@zohodesk/components 1.0.0-temp-259.1 → 1.0.0-temp-259.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (9) hide show
  1. package/es/v1/Button/constants/presets.js +31 -42
  2. package/es/v1/Button/css/cssJSLogic.js +13 -4
  3. package/es/v1/Button/props/defaultProps.js +1 -4
  4. package/es/v1/helpers/colorHelpers/colorHelper.js +10 -8
  5. package/lib/v1/Button/constants/presets.js +31 -42
  6. package/lib/v1/Button/css/cssJSLogic.js +13 -3
  7. package/lib/v1/Button/props/defaultProps.js +0 -3
  8. package/lib/v1/helpers/colorHelpers/colorHelper.js +10 -8
  9. package/package.json +9 -9
package/es/v1/Button/constants/presets.js CHANGED
@@ -2,102 +2,90 @@
2
2
  export const BRAND_OUTLINE = {
3
3
  palette: 'brand',
4
4
  appearance: {
5
- border: true,
6
- text: true
5
+ bg: false,
6
+ border: true
7
7
  },
8
8
  hoverAppearance: {
9
- border: true,
10
- text: true
9
+ bg: false,
10
+ border: true
11
11
  },
12
12
  selectedAppearance: {
13
- border: true,
14
- text: true
13
+ bg: false,
14
+ border: true
15
15
  }
16
16
  };
17
17
  export const BRAND_GHOST = {
18
18
  palette: 'brand',
19
19
  appearance: {
20
- text: true
20
+ bg: false
21
21
  },
22
22
  hoverAppearance: {
23
- text: true
23
+ bg: false
24
24
  },
25
25
  selectedAppearance: {
26
- text: true
26
+ bg: false
27
27
  }
28
28
  };
29
29
  export const BRAND_TINTED_OUTLINE = {
30
30
  palette: 'brandLighter',
31
31
  appearance: {
32
- bg: true,
33
- text: true,
34
32
  border: true
35
33
  },
36
34
  hoverAppearance: {
37
- bg: true,
38
- text: true,
39
35
  border: true
40
36
  },
41
37
  selectedAppearance: {
42
- bg: true,
43
- text: true,
44
38
  border: true
45
39
  }
46
40
  };
47
41
  export const SUCCESS_OUTLINE = {
48
42
  palette: 'success',
49
43
  appearance: {
50
- border: true,
51
- text: true
44
+ bg: false,
45
+ border: true
52
46
  },
53
47
  hoverAppearance: {
54
- border: true,
55
- text: true
48
+ bg: false,
49
+ border: true
56
50
  },
57
51
  selectedAppearance: {
58
- border: true,
59
- text: true
52
+ bg: false,
53
+ border: true
60
54
  }
61
55
  };
62
56
  export const SUCCESS_GHOST = {
63
57
  palette: 'success',
64
58
  appearance: {
65
- text: true
59
+ bg: false
66
60
  },
67
61
  hoverAppearance: {
68
- text: true
62
+ bg: false
69
63
  },
70
64
  selectedAppearance: {
71
- text: true
65
+ bg: false
72
66
  }
73
67
  };
74
68
  export const SUCCESS_TINTED_OUTLINE = {
75
69
  palette: 'successLighter',
76
70
  appearance: {
77
- bg: true,
78
- text: true,
79
71
  border: true
80
72
  },
81
73
  hoverAppearance: {
82
- bg: true,
83
- text: true,
84
74
  border: true
85
75
  },
86
76
  selectedAppearance: {
87
- bg: true,
88
- text: true,
89
77
  border: true
90
78
  }
91
79
  };
92
80
  export const SECONDARY_OUTLINE = {
93
81
  palette: 'secondary',
94
82
  appearance: {
95
- border: true,
96
- text: true
83
+ bg: false,
84
+ border: true
97
85
  },
98
86
  hoverAppearance: {
99
- border: true,
100
- text: true
87
+ bg: false,
88
+ border: true
101
89
  },
102
90
  selectedAppearance: {
103
91
  border: 'brandLighter',
@@ -108,30 +96,31 @@ export const SECONDARY_OUTLINE = {
108
96
  export const BLACK_GHOST = {
109
97
  palette: 'brand',
110
98
  appearance: {
99
+ bg: false,
111
100
  text: 'black'
112
101
  },
113
102
  hoverAppearance: {
114
- text: true
103
+ bg: false
115
104
  },
116
105
  selectedAppearance: {
117
- text: true
106
+ bg: false
118
107
  }
119
108
  };
120
109
  export const BRAND_OUTLINE_NO_SELECT = {
121
110
  palette: 'brand',
122
111
  appearance: {
123
- border: true,
124
- text: true
112
+ bg: false,
113
+ border: true
125
114
  },
126
115
  hoverAppearance: {
127
- border: true,
128
- text: true
116
+ bg: false,
117
+ border: true
129
118
  }
130
119
  };
131
120
  export const GHOST_TINTED_HOVER = {
132
121
  palette: 'brandLighter',
133
122
  appearance: {
134
- text: true
123
+ bg: false
135
124
  },
136
125
  hoverAppearance: {
137
126
  bg: true
@@ -144,7 +133,7 @@ export const GHOST_TINTED_HOVER = {
144
133
  export const GHOST_DANGER_HOVER = {
145
134
  palette: 'brandLighter',
146
135
  appearance: {
147
- text: true
136
+ bg: false
148
137
  },
149
138
  hoverAppearance: {
150
139
  bg: 'dangerLighter',
package/es/v1/Button/css/cssJSLogic.js CHANGED
@@ -1,6 +1,6 @@
1
1
  import compileClassNames from '@zohodesk/utils/es/compileClassNames';
2
2
  import { DUMMY_OBJECT } from '@zohodesk/dotkit/es/utils/constants';
3
- import { DISABLED_APPEARANCE, LOADER_PLACEMENT, SHAPE, SIZE, STATUS } from "../constants";
3
+ import { DISABLED_APPEARANCE, LOADER_PLACEMENT, SHAPE, SIZE, STATUS, DEFAULT_APPEARANCE, DEFAULT_HOVER_APPEARANCE, DEFAULT_SELECTED_APPEARANCE } from "../constants";
4
4
  import buttonResetStyle from "../../../semantic/Button/semanticButton.module.css";
5
5
  import getPaletteClasses from "../../helpers/colorHelpers/colorHelper";
6
6
  import style from "./Button_v1.module.css";
@@ -36,6 +36,15 @@ export default function cssJSLogic({
36
36
  const isSuccess = status === STATUS.SUCCESS;
37
37
  const isInteractive = !isDisabled && !isLoading;
38
38
  const overlayActive = (isLoading || isSuccess) && loaderPlacement === LOADER_PLACEMENT.OVERLAY;
39
+ const mergedAppearance = { ...DEFAULT_APPEARANCE,
40
+ ...(appearance || {})
41
+ };
42
+ const mergedHoverAppearance = { ...DEFAULT_HOVER_APPEARANCE,
43
+ ...(hoverAppearance || {})
44
+ };
45
+ const mergedSelectedAppearance = { ...DEFAULT_SELECTED_APPEARANCE,
46
+ ...(selectedAppearance || {})
47
+ };
39
48
  const {
40
49
  bg,
41
50
  selectedBg,
@@ -54,9 +63,9 @@ export default function cssJSLogic({
54
63
  activeBorder
55
64
  } = getPaletteClasses({
56
65
  palette,
57
- appearance,
58
- hoverAppearance,
59
- selectedAppearance
66
+ appearance: mergedAppearance,
67
+ hoverAppearance: mergedHoverAppearance,
68
+ selectedAppearance: mergedSelectedAppearance
60
69
  });
61
70
  const sizeClass = size ? style[`size${capitalize(size)}`] : '';
62
71
  const shapeClass = shape ? style[`shape${capitalize(shape)}`] : '';
package/es/v1/Button/props/defaultProps.js CHANGED
@@ -1,10 +1,7 @@
1
1
  import { DUMMY_FUNCTION, DUMMY_OBJECT } from '@zohodesk/dotkit/es/utils/constants';
2
- import { DEFAULT_APPEARANCE, DEFAULT_HOVER_APPEARANCE, DEFAULT_SELECTED_APPEARANCE, DEFAULT_VARIANT, DEFAULT_SIZE, DEFAULT_STATUS, DEFAULT_LOADER_PLACEMENT, DEFAULT_ICON_PLACEMENT, DEFAULT_ICON_SIZE, DEFAULT_SHAPE, DEFAULT_DISABLED_APPEARANCE, DEFAULT_BUTTON_TYPE } from "../constants";
2
+ import { DEFAULT_VARIANT, DEFAULT_SIZE, DEFAULT_STATUS, DEFAULT_LOADER_PLACEMENT, DEFAULT_ICON_PLACEMENT, DEFAULT_ICON_SIZE, DEFAULT_SHAPE, DEFAULT_DISABLED_APPEARANCE, DEFAULT_BUTTON_TYPE } from "../constants";
3
3
  const defaultProps = {
4
4
  palette: '',
5
- appearance: DEFAULT_APPEARANCE,
6
- hoverAppearance: DEFAULT_HOVER_APPEARANCE,
7
- selectedAppearance: DEFAULT_SELECTED_APPEARANCE,
8
5
  variant: DEFAULT_VARIANT,
9
6
  size: DEFAULT_SIZE,
10
7
  status: DEFAULT_STATUS,
package/es/v1/helpers/colorHelpers/colorHelper.js CHANGED
@@ -46,14 +46,11 @@ const getTextClass = (state, textTone, darker) => {
46
46
  if (!intensity) return paletteTextStyle[withState(state, `text-${textTone}`)];
47
47
  const shade = darker ? intensity.textHover ?? intensity.hover : intensity.base;
48
48
  return paletteTextStyle[withState(state, `text-${textTone}-${shade}`)];
49
- }; // text: true → isInherit flag இருக்கும் → bg context-ல இருந்து filledTextTone/textTone pick பண்ணும்
50
- // text: 'red' → directly textTone use பண்ணும்
51
- // text absent → null → no text
52
-
49
+ };
53
50
 
54
51
  const resolveTextTone = (textConfig, bgConfig) => {
55
52
  if (!textConfig) return null;
56
- if (textConfig.isInherit && bgConfig) return bgConfig.isLighter ? bgConfig.textTone : bgConfig.filledTextTone;
53
+ if (textConfig.isInherit && bgConfig) return bgConfig.isLighter ? textConfig.textTone : textConfig.filledTextTone;
57
54
  return textConfig.textTone || null;
58
55
  };
59
56
 
@@ -65,7 +62,8 @@ const buildStateClasses = ({
65
62
  state,
66
63
  paletteConfig,
67
64
  restAppearance,
68
- restPaletteConfig
65
+ restPaletteConfig,
66
+ textFallbackBgConfig
69
67
  }) => {
70
68
  if (!appearance) return {
71
69
  bg: '',
@@ -83,7 +81,8 @@ const buildStateClasses = ({
83
81
  const restTextConfig = restAppearance ? resolveConfig(restAppearance.text, restPaletteConfig) : null;
84
82
  const bg = bgConfig ? getBgClass(state, bgConfig, isContinuingTone(bgConfig, restBgConfig)) || '' : '';
85
83
  const border = borderConfig ? getBorderClass(state, borderConfig, isContinuingTone(borderConfig, restBorderConfig)) || '' : state ? '' : paletteBorderStyle['border-transparent'] || '';
86
- const textTone = resolveTextTone(textConfig, bgConfig);
84
+ const effectiveBgForText = bgConfig || textFallbackBgConfig || restBgConfig || null;
85
+ const textTone = resolveTextTone(textConfig, effectiveBgForText);
87
86
  const restTextTone = resolveTextTone(restTextConfig, restBgConfig);
88
87
  const text = textTone ? getTextClass(state, textTone, textTone === restTextTone) || '' : '';
89
88
  return {
@@ -105,10 +104,13 @@ const getPaletteClasses = ({
105
104
  state: undefined,
106
105
  paletteConfig
107
106
  });
107
+ const rawRestBgConfig = resolveConfig(appearance?.bg, paletteConfig);
108
+ const restBgForText = rawRestBgConfig && !BG_BORDER_INVALID.has(rawRestBgConfig.tone) ? rawRestBgConfig : null;
108
109
  const selected = buildStateClasses({
109
110
  appearance: selectedAppearance,
110
111
  state: 'selected',
111
- paletteConfig
112
+ paletteConfig,
113
+ textFallbackBgConfig: restBgForText
112
114
  });
113
115
 
114
116
  const buildInteractive = state => buildStateClasses({
package/lib/v1/Button/constants/presets.js CHANGED
@@ -9,47 +9,41 @@ exports.SUCCESS_TINTED_OUTLINE = exports.SUCCESS_OUTLINE = exports.SUCCESS_GHOST
9
9
  var BRAND_OUTLINE = {
10
10
  palette: 'brand',
11
11
  appearance: {
12
- border: true,
13
- text: true
12
+ bg: false,
13
+ border: true
14
14
  },
15
15
  hoverAppearance: {
16
- border: true,
17
- text: true
16
+ bg: false,
17
+ border: true
18
18
  },
19
19
  selectedAppearance: {
20
- border: true,
21
- text: true
20
+ bg: false,
21
+ border: true
22
22
  }
23
23
  };
24
24
  exports.BRAND_OUTLINE = BRAND_OUTLINE;
25
25
  var BRAND_GHOST = {
26
26
  palette: 'brand',
27
27
  appearance: {
28
- text: true
28
+ bg: false
29
29
  },
30
30
  hoverAppearance: {
31
- text: true
31
+ bg: false
32
32
  },
33
33
  selectedAppearance: {
34
- text: true
34
+ bg: false
35
35
  }
36
36
  };
37
37
  exports.BRAND_GHOST = BRAND_GHOST;
38
38
  var BRAND_TINTED_OUTLINE = {
39
39
  palette: 'brandLighter',
40
40
  appearance: {
41
- bg: true,
42
- text: true,
43
41
  border: true
44
42
  },
45
43
  hoverAppearance: {
46
- bg: true,
47
- text: true,
48
44
  border: true
49
45
  },
50
46
  selectedAppearance: {
51
- bg: true,
52
- text: true,
53
47
  border: true
54
48
  }
55
49
  };
@@ -57,47 +51,41 @@ exports.BRAND_TINTED_OUTLINE = BRAND_TINTED_OUTLINE;
57
51
  var SUCCESS_OUTLINE = {
58
52
  palette: 'success',
59
53
  appearance: {
60
- border: true,
61
- text: true
54
+ bg: false,
55
+ border: true
62
56
  },
63
57
  hoverAppearance: {
64
- border: true,
65
- text: true
58
+ bg: false,
59
+ border: true
66
60
  },
67
61
  selectedAppearance: {
68
- border: true,
69
- text: true
62
+ bg: false,
63
+ border: true
70
64
  }
71
65
  };
72
66
  exports.SUCCESS_OUTLINE = SUCCESS_OUTLINE;
73
67
  var SUCCESS_GHOST = {
74
68
  palette: 'success',
75
69
  appearance: {
76
- text: true
70
+ bg: false
77
71
  },
78
72
  hoverAppearance: {
79
- text: true
73
+ bg: false
80
74
  },
81
75
  selectedAppearance: {
82
- text: true
76
+ bg: false
83
77
  }
84
78
  };
85
79
  exports.SUCCESS_GHOST = SUCCESS_GHOST;
86
80
  var SUCCESS_TINTED_OUTLINE = {
87
81
  palette: 'successLighter',
88
82
  appearance: {
89
- bg: true,
90
- text: true,
91
83
  border: true
92
84
  },
93
85
  hoverAppearance: {
94
- bg: true,
95
- text: true,
96
86
  border: true
97
87
  },
98
88
  selectedAppearance: {
99
- bg: true,
100
- text: true,
101
89
  border: true
102
90
  }
103
91
  };
@@ -105,12 +93,12 @@ exports.SUCCESS_TINTED_OUTLINE = SUCCESS_TINTED_OUTLINE;
105
93
  var SECONDARY_OUTLINE = {
106
94
  palette: 'secondary',
107
95
  appearance: {
108
- border: true,
109
- text: true
96
+ bg: false,
97
+ border: true
110
98
  },
111
99
  hoverAppearance: {
112
- border: true,
113
- text: true
100
+ bg: false,
101
+ border: true
114
102
  },
115
103
  selectedAppearance: {
116
104
  border: 'brandLighter',
@@ -122,32 +110,33 @@ exports.SECONDARY_OUTLINE = SECONDARY_OUTLINE;
122
110
  var BLACK_GHOST = {
123
111
  palette: 'brand',
124
112
  appearance: {
113
+ bg: false,
125
114
  text: 'black'
126
115
  },
127
116
  hoverAppearance: {
128
- text: true
117
+ bg: false
129
118
  },
130
119
  selectedAppearance: {
131
- text: true
120
+ bg: false
132
121
  }
133
122
  };
134
123
  exports.BLACK_GHOST = BLACK_GHOST;
135
124
  var BRAND_OUTLINE_NO_SELECT = {
136
125
  palette: 'brand',
137
126
  appearance: {
138
- border: true,
139
- text: true
127
+ bg: false,
128
+ border: true
140
129
  },
141
130
  hoverAppearance: {
142
- border: true,
143
- text: true
131
+ bg: false,
132
+ border: true
144
133
  }
145
134
  };
146
135
  exports.BRAND_OUTLINE_NO_SELECT = BRAND_OUTLINE_NO_SELECT;
147
136
  var GHOST_TINTED_HOVER = {
148
137
  palette: 'brandLighter',
149
138
  appearance: {
150
- text: true
139
+ bg: false
151
140
  },
152
141
  hoverAppearance: {
153
142
  bg: true
@@ -161,7 +150,7 @@ exports.GHOST_TINTED_HOVER = GHOST_TINTED_HOVER;
161
150
  var GHOST_DANGER_HOVER = {
162
151
  palette: 'brandLighter',
163
152
  appearance: {
164
- text: true
153
+ bg: false
165
154
  },
166
155
  hoverAppearance: {
167
156
  bg: 'dangerLighter',
package/lib/v1/Button/css/cssJSLogic.js CHANGED
@@ -19,6 +19,10 @@ var _Button_v1Module = _interopRequireDefault(require("./Button_v1.module.css"))
19
19
 
20
20
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
21
21
 
22
+ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
23
+
24
+ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
25
+
22
26
  function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
23
27
 
24
28
  var capitalize = function capitalize() {
@@ -59,11 +63,17 @@ function cssJSLogic(_ref) {
59
63
  var isInteractive = !isDisabled && !isLoading;
60
64
  var overlayActive = (isLoading || isSuccess) && loaderPlacement === _constants2.LOADER_PLACEMENT.OVERLAY;
61
65
 
66
+ var mergedAppearance = _objectSpread(_objectSpread({}, _constants2.DEFAULT_APPEARANCE), appearance || {});
67
+
68
+ var mergedHoverAppearance = _objectSpread(_objectSpread({}, _constants2.DEFAULT_HOVER_APPEARANCE), hoverAppearance || {});
69
+
70
+ var mergedSelectedAppearance = _objectSpread(_objectSpread({}, _constants2.DEFAULT_SELECTED_APPEARANCE), selectedAppearance || {});
71
+
62
72
  var _getPaletteClasses = (0, _colorHelper["default"])({
63
73
  palette: palette,
64
- appearance: appearance,
65
- hoverAppearance: hoverAppearance,
66
- selectedAppearance: selectedAppearance
74
+ appearance: mergedAppearance,
75
+ hoverAppearance: mergedHoverAppearance,
76
+ selectedAppearance: mergedSelectedAppearance
67
77
  }),
68
78
  bg = _getPaletteClasses.bg,
69
79
  selectedBg = _getPaletteClasses.selectedBg,
package/lib/v1/Button/props/defaultProps.js CHANGED
@@ -11,9 +11,6 @@ var _constants2 = require("../constants");
11
11
 
12
12
  var defaultProps = {
13
13
  palette: '',
14
- appearance: _constants2.DEFAULT_APPEARANCE,
15
- hoverAppearance: _constants2.DEFAULT_HOVER_APPEARANCE,
16
- selectedAppearance: _constants2.DEFAULT_SELECTED_APPEARANCE,
17
14
  variant: _constants2.DEFAULT_VARIANT,
18
15
  size: _constants2.DEFAULT_SIZE,
19
16
  status: _constants2.DEFAULT_STATUS,
package/lib/v1/helpers/colorHelpers/colorHelper.js CHANGED
@@ -66,14 +66,11 @@ var getTextClass = function getTextClass(state, textTone, darker) {
66
66
  if (!intensity) return _textColorModule["default"][withState(state, "text-".concat(textTone))];
67
67
  var shade = darker ? (_intensity$textHover = intensity.textHover) !== null && _intensity$textHover !== void 0 ? _intensity$textHover : intensity.hover : intensity.base;
68
68
  return _textColorModule["default"][withState(state, "text-".concat(textTone, "-").concat(shade))];
69
- }; // text: true → isInherit flag இருக்கும் → bg context-ல இருந்து filledTextTone/textTone pick பண்ணும்
70
- // text: 'red' → directly textTone use பண்ணும்
71
- // text absent → null → no text
72
-
69
+ };
73
70
 
74
71
  var resolveTextTone = function resolveTextTone(textConfig, bgConfig) {
75
72
  if (!textConfig) return null;
76
- if (textConfig.isInherit && bgConfig) return bgConfig.isLighter ? bgConfig.textTone : bgConfig.filledTextTone;
73
+ if (textConfig.isInherit && bgConfig) return bgConfig.isLighter ? textConfig.textTone : textConfig.filledTextTone;
77
74
  return textConfig.textTone || null;
78
75
  };
79
76
 
@@ -85,7 +82,8 @@ var buildStateClasses = function buildStateClasses(_ref) {
85
82
  state = _ref.state,
86
83
  paletteConfig = _ref.paletteConfig,
87
84
  restAppearance = _ref.restAppearance,
88
- restPaletteConfig = _ref.restPaletteConfig;
85
+ restPaletteConfig = _ref.restPaletteConfig,
86
+ textFallbackBgConfig = _ref.textFallbackBgConfig;
89
87
  if (!appearance) return {
90
88
  bg: '',
91
89
  text: '',
@@ -102,7 +100,8 @@ var buildStateClasses = function buildStateClasses(_ref) {
102
100
  var restTextConfig = restAppearance ? resolveConfig(restAppearance.text, restPaletteConfig) : null;
103
101
  var bg = bgConfig ? getBgClass(state, bgConfig, isContinuingTone(bgConfig, restBgConfig)) || '' : '';
104
102
  var border = borderConfig ? getBorderClass(state, borderConfig, isContinuingTone(borderConfig, restBorderConfig)) || '' : state ? '' : _borderColorModule["default"]['border-transparent'] || '';
105
- var textTone = resolveTextTone(textConfig, bgConfig);
103
+ var effectiveBgForText = bgConfig || textFallbackBgConfig || restBgConfig || null;
104
+ var textTone = resolveTextTone(textConfig, effectiveBgForText);
106
105
  var restTextTone = resolveTextTone(restTextConfig, restBgConfig);
107
106
  var text = textTone ? getTextClass(state, textTone, textTone === restTextTone) || '' : '';
108
107
  return {
@@ -123,10 +122,13 @@ var getPaletteClasses = function getPaletteClasses(_ref2) {
123
122
  state: undefined,
124
123
  paletteConfig: paletteConfig
125
124
  });
125
+ var rawRestBgConfig = resolveConfig(appearance === null || appearance === void 0 ? void 0 : appearance.bg, paletteConfig);
126
+ var restBgForText = rawRestBgConfig && !BG_BORDER_INVALID.has(rawRestBgConfig.tone) ? rawRestBgConfig : null;
126
127
  var selected = buildStateClasses({
127
128
  appearance: selectedAppearance,
128
129
  state: 'selected',
129
- paletteConfig: paletteConfig
130
+ paletteConfig: paletteConfig,
131
+ textFallbackBgConfig: restBgForText
130
132
  });
131
133
 
132
134
  var buildInteractive = function buildInteractive(state) {
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@zohodesk/components",
3
- "version": "1.0.0-temp-259.1",
4
- "main": "es/index.js",
3
+ "version": "1.0.0-temp-259.2",
4
+ "main": "lib/index.js",
5
5
  "module": "es/index.js",
6
6
  "private": false,
7
7
  "publishConfig": {
@@ -30,7 +30,7 @@
30
30
  "build:local": "npm run build",
31
31
  "build:watch": "npm run build:es:watch --module:mode=dev -- -w",
32
32
  "prepare": "npm run init && npm run css:build ",
33
- "prepublishOnly": "node ../prePublish.js && npm run css:review && npm run review:props ",
33
+ "prepublishOnly": "node ../prePublish.js && npm run download_only && npm run css:review && npm run review:props ",
34
34
  "postpublish": "node ../postPublish.js",
35
35
  "test": "ZDTestingFramework unit-test",
36
36
  "test:changed": "ZDTestingFramework unit-test --onlyChanged",
@@ -76,12 +76,12 @@
76
76
  "@zohodesk-private/color-variable-preprocessor": "1.3.4",
77
77
  "@zohodesk-private/css-variable-migrator": "1.0.12",
78
78
  "@zohodesk-private/node-plugins": "1.1.16",
79
- "@zohodesk-private/react-prop-validator": "1.2.3",
79
+ "@zohodesk-private/react-prop-validator": "1.2.4",
80
80
  "@zohodesk/a11y": "2.3.9",
81
81
  "@zohodesk/docstool": "1.0.0-alpha-2",
82
82
  "@zohodesk/dotkit": "1.0.10",
83
83
  "@zohodesk/hooks": "2.0.8",
84
- "@zohodesk/icons": "1.3.14",
84
+ "@zohodesk/icons": "1.3.15",
85
85
  "@zohodesk/layout": "3.2.2",
86
86
  "@zohodesk/svg": "1.3.13",
87
87
  "@zohodesk/utils": "1.3.16",
@@ -93,7 +93,7 @@
93
93
  "@zohodesk/client_build_tool": "0.0.23",
94
94
  "color": "4.2.3",
95
95
  "@zohodesk/jsx_attribute_wrapper": "1.0.0",
96
- "@dot-system/css-utility": "0.1.3",
96
+ "@dot-system/css-utility": "0.1.4",
97
97
  "@zohodesk-private/client_deployment_tool": "0.0.7",
98
98
  "@babel/preset-react": "7.29.7",
99
99
  "@zohodesk/testinglibrary": "4.1.10"
@@ -105,7 +105,7 @@
105
105
  "selectn": "1.1.2"
106
106
  },
107
107
  "peerDependencies": {
108
- "@zohodesk/icons": "1.3.14",
108
+ "@zohodesk/icons": "1.3.15",
109
109
  "@zohodesk/variables": "1.3.2",
110
110
  "@zohodesk/svg": "1.3.13",
111
111
  "@zohodesk/virtualizer": "1.0.13",
@@ -117,6 +117,6 @@
117
117
  "@zohodesk/layout": "3.2.2",
118
118
  "@zohodesk/dotkit": "1.0.10",
119
119
  "color": "4.2.3",
120
- "@dot-system/css-utility": "0.1.3"
120
+ "@dot-system/css-utility": "0.1.4"
121
121
  }
122
- }
122
+ }