@zendeskgarden/react-tabs 9.0.0-next.24 → 9.0.0-next.25

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.
@@ -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, focusStyles } from '@zendeskgarden/react-theming';
8
+ import { retrieveComponentStyles, getColor, focusStyles } from '@zendeskgarden/react-theming';
9
9
  import { stripUnit } from 'polished';
10
10
 
11
11
  const COMPONENT_ID = 'tabs.tab';
@@ -44,7 +44,7 @@ const sizeStyles = _ref2 => {
44
44
  $isVertical
45
45
  } = _ref2;
46
46
  const borderWidth = theme.borderWidths.md;
47
- const focusHeight = `${theme.space.base * 5}px`;
47
+ const focusHeight = `calc(100% - ${theme.space.base * ($isVertical ? 2 : 4)}px);`;
48
48
  let marginBottom;
49
49
  let padding;
50
50
  if ($isVertical) {
@@ -60,7 +60,7 @@ const sizeStyles = _ref2 => {
60
60
  };
61
61
  const StyledTab = styled.div.attrs({
62
62
  'data-garden-id': COMPONENT_ID,
63
- 'data-garden-version': '9.0.0-next.24'
63
+ 'data-garden-version': '9.0.0-next.25'
64
64
  }).withConfig({
65
65
  displayName: "StyledTab",
66
66
  componentId: "sc-x2pbow-0"
@@ -70,8 +70,5 @@ const StyledTab = styled.div.attrs({
70
70
  }
71
71
  return 'center';
72
72
  }, sizeStyles, colorStyles, props => props.theme.space.base * (props.$isVertical ? 1 : 2.5), props => props.theme.space.base * (props.$isVertical ? 1 : 6), props => props.theme.space.base * (props.$isVertical ? 1 : 6), props => props.theme.borderRadii.md, props => retrieveComponentStyles(COMPONENT_ID, props));
73
- StyledTab.defaultProps = {
74
- theme: DEFAULT_THEME
75
- };
76
73
 
77
74
  export { StyledTab };
@@ -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, getLineHeight } from '@zendeskgarden/react-theming';
8
+ import { retrieveComponentStyles, getColor, getLineHeight } from '@zendeskgarden/react-theming';
9
9
 
10
10
  const COMPONENT_ID = 'tabs.tablist';
11
11
  const colorStyles = _ref => {
@@ -35,13 +35,10 @@ const sizeStyles = _ref2 => {
35
35
  };
36
36
  const StyledTabList = styled.div.attrs({
37
37
  'data-garden-id': COMPONENT_ID,
38
- 'data-garden-version': '9.0.0-next.24'
38
+ 'data-garden-version': '9.0.0-next.25'
39
39
  }).withConfig({
40
40
  displayName: "StyledTabList",
41
41
  componentId: "sc-wa5aaj-0"
42
42
  })(["display:", ";border-bottom:", ";vertical-align:", ";white-space:nowrap;", ";", ";", ";"], props => props.$isVertical ? 'table-cell' : 'block', props => props.$isVertical ? 'none' : props.theme.borderStyles.solid, props => props.$isVertical ? 'top' : undefined, sizeStyles, colorStyles, props => retrieveComponentStyles(COMPONENT_ID, props));
43
- StyledTabList.defaultProps = {
44
- theme: DEFAULT_THEME
45
- };
46
43
 
47
44
  export { StyledTabList };
@@ -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 } from '@zendeskgarden/react-theming';
8
+ import { retrieveComponentStyles } from '@zendeskgarden/react-theming';
9
9
 
10
10
  const COMPONENT_ID = 'tabs.tabpanel';
11
11
  const sizeStyles = _ref => {
@@ -18,13 +18,10 @@ const sizeStyles = _ref => {
18
18
  };
19
19
  const StyledTabPanel = 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.25'
22
22
  }).withConfig({
23
23
  displayName: "StyledTabPanel",
24
24
  componentId: "sc-7lhrmp-0"
25
25
  })(["display:block;vertical-align:", ";color-scheme:only ", ";", ";&[aria-hidden='true']{display:none;}", ";"], props => props.$isVertical && 'top', p => p.theme.colors.base, sizeStyles, props => retrieveComponentStyles(COMPONENT_ID, props));
26
- StyledTabPanel.defaultProps = {
27
- theme: DEFAULT_THEME
28
- };
29
26
 
30
27
  export { StyledTabPanel };
@@ -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 = 'tabs.tabs';
11
11
  const StyledTabs = 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.25'
14
14
  }).withConfig({
15
15
  displayName: "StyledTabs",
16
16
  componentId: "sc-1qaor65-0"
17
17
  })(["display:", ";overflow:hidden;direction:", ";", ";"], props => props.$isVertical ? 'table' : 'block', props => props.theme.rtl && 'rtl', props => retrieveComponentStyles(COMPONENT_ID, props));
18
- StyledTabs.defaultProps = {
19
- theme: DEFAULT_THEME
20
- };
21
18
 
22
19
  export { StyledTabs };
package/dist/index.cjs.js CHANGED
@@ -57,7 +57,7 @@ const sizeStyles$2 = _ref2 => {
57
57
  $isVertical
58
58
  } = _ref2;
59
59
  const borderWidth = theme.borderWidths.md;
60
- const focusHeight = `${theme.space.base * 5}px`;
60
+ const focusHeight = `calc(100% - ${theme.space.base * ($isVertical ? 2 : 4)}px);`;
61
61
  let marginBottom;
62
62
  let padding;
63
63
  if ($isVertical) {
@@ -73,7 +73,7 @@ const sizeStyles$2 = _ref2 => {
73
73
  };
74
74
  const StyledTab = styled__default.default.div.attrs({
75
75
  'data-garden-id': COMPONENT_ID$3,
76
- 'data-garden-version': '9.0.0-next.24'
76
+ 'data-garden-version': '9.0.0-next.25'
77
77
  }).withConfig({
78
78
  displayName: "StyledTab",
79
79
  componentId: "sc-x2pbow-0"
@@ -83,9 +83,6 @@ const StyledTab = styled__default.default.div.attrs({
83
83
  }
84
84
  return 'center';
85
85
  }, sizeStyles$2, colorStyles$1, props => props.theme.space.base * (props.$isVertical ? 1 : 2.5), props => props.theme.space.base * (props.$isVertical ? 1 : 6), props => props.theme.space.base * (props.$isVertical ? 1 : 6), props => props.theme.borderRadii.md, props => reactTheming.retrieveComponentStyles(COMPONENT_ID$3, props));
86
- StyledTab.defaultProps = {
87
- theme: reactTheming.DEFAULT_THEME
88
- };
89
86
 
90
87
  const COMPONENT_ID$2 = 'tabs.tablist';
91
88
  const colorStyles = _ref => {
@@ -115,14 +112,11 @@ const sizeStyles$1 = _ref2 => {
115
112
  };
116
113
  const StyledTabList = styled__default.default.div.attrs({
117
114
  'data-garden-id': COMPONENT_ID$2,
118
- 'data-garden-version': '9.0.0-next.24'
115
+ 'data-garden-version': '9.0.0-next.25'
119
116
  }).withConfig({
120
117
  displayName: "StyledTabList",
121
118
  componentId: "sc-wa5aaj-0"
122
119
  })(["display:", ";border-bottom:", ";vertical-align:", ";white-space:nowrap;", ";", ";", ";"], props => props.$isVertical ? 'table-cell' : 'block', props => props.$isVertical ? 'none' : props.theme.borderStyles.solid, props => props.$isVertical ? 'top' : undefined, sizeStyles$1, colorStyles, props => reactTheming.retrieveComponentStyles(COMPONENT_ID$2, props));
123
- StyledTabList.defaultProps = {
124
- theme: reactTheming.DEFAULT_THEME
125
- };
126
120
 
127
121
  const COMPONENT_ID$1 = 'tabs.tabpanel';
128
122
  const sizeStyles = _ref => {
@@ -135,26 +129,20 @@ const sizeStyles = _ref => {
135
129
  };
136
130
  const StyledTabPanel = styled__default.default.div.attrs({
137
131
  'data-garden-id': COMPONENT_ID$1,
138
- 'data-garden-version': '9.0.0-next.24'
132
+ 'data-garden-version': '9.0.0-next.25'
139
133
  }).withConfig({
140
134
  displayName: "StyledTabPanel",
141
135
  componentId: "sc-7lhrmp-0"
142
136
  })(["display:block;vertical-align:", ";color-scheme:only ", ";", ";&[aria-hidden='true']{display:none;}", ";"], props => props.$isVertical && 'top', p => p.theme.colors.base, sizeStyles, props => reactTheming.retrieveComponentStyles(COMPONENT_ID$1, props));
143
- StyledTabPanel.defaultProps = {
144
- theme: reactTheming.DEFAULT_THEME
145
- };
146
137
 
147
138
  const COMPONENT_ID = 'tabs.tabs';
148
139
  const StyledTabs = styled__default.default.div.attrs({
149
140
  'data-garden-id': COMPONENT_ID,
150
- 'data-garden-version': '9.0.0-next.24'
141
+ 'data-garden-version': '9.0.0-next.25'
151
142
  }).withConfig({
152
143
  displayName: "StyledTabs",
153
144
  componentId: "sc-1qaor65-0"
154
145
  })(["display:", ";overflow:hidden;direction:", ";", ";"], props => props.$isVertical ? 'table' : 'block', props => props.theme.rtl && 'rtl', props => reactTheming.retrieveComponentStyles(COMPONENT_ID, props));
155
- StyledTabs.defaultProps = {
156
- theme: reactTheming.DEFAULT_THEME
157
- };
158
146
 
159
147
  const TabsContext = React.createContext(undefined);
160
148
  const useTabsContext = () => {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@zendeskgarden/react-tabs",
3
- "version": "9.0.0-next.24",
3
+ "version": "9.0.0-next.25",
4
4
  "description": "Components and render prop containers relating to the Garden Design System.",
5
5
  "license": "Apache-2.0",
6
6
  "author": "Zendesk Garden <garden@zendesk.com>",
@@ -34,7 +34,7 @@
34
34
  "styled-components": "^5.3.1"
35
35
  },
36
36
  "devDependencies": {
37
- "@zendeskgarden/react-theming": "^9.0.0-next.24"
37
+ "@zendeskgarden/react-theming": "^9.0.0-next.25"
38
38
  },
39
39
  "keywords": [
40
40
  "components",
@@ -46,5 +46,5 @@
46
46
  "access": "public"
47
47
  },
48
48
  "zendeskgarden:src": "src/index.ts",
49
- "gitHead": "36ac3913276188edf8d187a9861be7ba765e487a"
49
+ "gitHead": "460751d630ab1c46e11810d60e4d7701b9d30b8f"
50
50
  }