@wireapp/react-ui-kit 9.2.1 → 9.2.3

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 (10) hide show
  1. package/lib/Form/IndicatorRangeInput.d.ts.map +1 -1
  2. package/lib/Form/IndicatorRangeInput.js +1 -1
  3. package/lib/Form/IndicatorRangeInput.styles.js +2 -2
  4. package/lib/Misc/useTimeout.js +5 -5
  5. package/lib/Theme/GlobalCssVariables.d.ts.map +1 -1
  6. package/lib/Theme/GlobalCssVariables.js +12 -5
  7. package/lib/Theme/Theme.d.ts +4 -0
  8. package/lib/Theme/Theme.d.ts.map +1 -1
  9. package/lib/Theme/Theme.js +44 -32
  10. package/package.json +2 -2
package/lib/Form/IndicatorRangeInput.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"IndicatorRangeInput.d.ts","sourceRoot":"","sources":["../../src/Form/IndicatorRangeInput.tsx"],"names":[],"mappings":"AAmBA,OAAO,EAAC,EAAE,EAAE,SAAS,EAAE,YAAY,EAAsB,MAAM,OAAO,CAAC;AAEvE,OAAO,EAAC,SAAS,EAAC,MAAM,gBAAgB,CAAC;AAOzC,KAAK,eAAe,GAAG;IACrB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB,CAAC;AAEF,MAAM,WAAW,wBAAwB,CAAC,CAAC,GAAG,gBAAgB,CAAE,SAAQ,YAAY,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC;IAChG,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,eAAe,EAAE,eAAe,EAAE,CAAC;CACpC;AAED,eAAO,MAAM,mBAAmB,EAAE,EAAE,CAAC,wBAAwB,CAkG5D,CAAC"}
1
+ {"version":3,"file":"IndicatorRangeInput.d.ts","sourceRoot":"","sources":["../../src/Form/IndicatorRangeInput.tsx"],"names":[],"mappings":"AAmBA,OAAO,EAAC,EAAE,EAAE,SAAS,EAAE,YAAY,EAAsB,MAAM,OAAO,CAAC;AAEvE,OAAO,EAAC,SAAS,EAAC,MAAM,gBAAgB,CAAC;AAOzC,KAAK,eAAe,GAAG;IACrB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB,CAAC;AAEF,MAAM,WAAW,wBAAwB,CAAC,CAAC,GAAG,gBAAgB,CAAE,SAAQ,YAAY,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC;IAChG,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,eAAe,EAAE,eAAe,EAAE,CAAC;CACpC;AAED,eAAO,MAAM,mBAAmB,EAAE,EAAE,CAAC,wBAAwB,CAsG5D,CAAC"}
package/lib/Form/IndicatorRangeInput.js CHANGED
@@ -52,7 +52,7 @@ exports.IndicatorRangeInput = (0, react_1.forwardRef)((_a, ref) => {
52
52
  const valueText = ((_b = dataListOptions[valueNum]) === null || _b === void 0 ? void 0 : _b.heading)
53
53
  ? `${dataListOptions[valueNum].label} (${dataListOptions[valueNum].heading})`
54
54
  : dataListOptions[valueNum].label;
55
- return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ css: { wrapperCSS, width: '100%' } }, { children: [label && (0, jsx_runtime_1.jsx)(InputLabel_1.InputLabel, Object.assign({ htmlFor: id }, { children: label })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ css: IndicatorRangeInput_styles_1.containerStyles }, { children: [isCustomSlider && ((0, jsx_runtime_1.jsx)("div", Object.assign({ css: { position: 'relative', display: 'flex', marginBottom: '20px' } }, { children: dataListOptions.map((dataListOption, index) => ((0, jsx_runtime_1.jsx)("div", Object.assign({ css: (theme) => (0, IndicatorRangeInput_styles_1.headingStyle)(listLength, theme), onClick: () => {
55
+ return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ css: { wrapperCSS, width: '100%' } }, { children: [label && ((0, jsx_runtime_1.jsx)(InputLabel_1.InputLabel, Object.assign({ css: (theme) => ({ fontSize: theme.fontSizes.base }), htmlFor: id }, { children: label }))), (0, jsx_runtime_1.jsxs)("div", Object.assign({ css: IndicatorRangeInput_styles_1.containerStyles }, { children: [isCustomSlider && ((0, jsx_runtime_1.jsx)("div", Object.assign({ css: { position: 'relative', display: 'flex', marginBottom: '20px' } }, { children: dataListOptions.map((dataListOption, index) => ((0, jsx_runtime_1.jsx)("div", Object.assign({ css: (theme) => (0, IndicatorRangeInput_styles_1.headingStyle)(listLength, theme), onClick: () => {
56
56
  if (dataListOption === null || dataListOption === void 0 ? void 0 : dataListOption.heading) {
57
57
  onOptionClick(index);
58
58
  }
package/lib/Form/IndicatorRangeInput.styles.js CHANGED
@@ -27,7 +27,7 @@ const rangeStyles = (backgroundSize, value, listLength, isCustomSlider, theme) =
27
27
  const lastOptionThumbPosition = `calc(((100% - 12px) / (${listLength} * 2) - 6px) / 2)`;
28
28
  const isFirstOption = value === 0;
29
29
  const isLastOption = value === listLength;
30
- return Object.assign(Object.assign({ appearance: 'none', width: '100%', height: '8px', backgroundImage: `linear-gradient(${theme.general.primaryColor}, ${theme.general.primaryColor})`, backgroundColor: theme.Input.borderHover, backgroundSize: backgroundSize || '0% 100%', backgroundRepeat: 'no-repeat', display: 'flex', alignItems: 'center', borderRadius: '8px', marginBlock: '10px', zIndex: '1', position: 'relative' }, (0, util_1.manySelectors)(thumbSelectors, Object.assign(Object.assign({ '-webkit-appearance': 'none', height: '28px', width: '10px', borderRadius: '4px', background: theme.Button.primaryActiveBorder, cursor: 'pointer', border: 'none', boxShadow: '0px 2px 2px rgba(0, 0, 0, 0.25);', position: 'relative', top: '-9px', zIndex: '2' }, (isCustomSlider && isFirstOption && { left: firstOptionThumbPosition })), (isCustomSlider && isLastOption && { right: lastOptionThumbPosition })))), (0, util_1.manySelectors)(sliderSelectors, {
30
+ return Object.assign(Object.assign({ appearance: 'none', width: '100%', height: '8px', backgroundImage: `linear-gradient(${theme.general.primaryColor}, ${theme.general.primaryColor})`, backgroundColor: theme.IndicatorRangeInput.trackBg, backgroundSize: backgroundSize || '0% 100%', backgroundRepeat: 'no-repeat', display: 'flex', alignItems: 'center', borderRadius: '8px', marginBlock: '10px', zIndex: '1', position: 'relative' }, (0, util_1.manySelectors)(thumbSelectors, Object.assign(Object.assign({ '-webkit-appearance': 'none', height: '28px', width: '10px', borderRadius: '4px', background: theme.IndicatorRangeInput.thumb, cursor: 'pointer', border: 'none', boxShadow: '0px 2px 2px rgba(0, 0, 0, 0.25);', position: 'relative', top: '-9px', zIndex: '2' }, (isCustomSlider && isFirstOption && { left: firstOptionThumbPosition })), (isCustomSlider && isLastOption && { right: lastOptionThumbPosition })))), (0, util_1.manySelectors)(sliderSelectors, {
31
31
  '-webkit-appearance': 'none',
32
32
  boxShadow: 'none',
33
33
  background: 'transparent',
@@ -82,7 +82,7 @@ const dataListOption = (listLength, theme) => {
82
82
  '&::before': {
83
83
  content: '""',
84
84
  position: 'absolute',
85
- borderLeft: `2px solid ${theme.Select.borderColor}`,
85
+ borderLeft: `2px solid ${theme.IndicatorRangeInput.trackBg}`,
86
86
  width: '2px',
87
87
  height: '27px',
88
88
  top: '-37px',
package/lib/Misc/useTimeout.js CHANGED
@@ -21,16 +21,16 @@ Object.defineProperty(exports, "__esModule", { value: true });
21
21
  exports.useTimeout = void 0;
22
22
  const react_1 = require("react");
23
23
  const useTimeout = (onTimeoutStop, duration) => {
24
- const [timerId, setTimerId] = (0, react_1.useState)(null);
24
+ const timerRef = (0, react_1.useRef)(null);
25
25
  const removeTimeout = () => {
26
- if (timerId) {
27
- window.clearTimeout(timerId);
28
- setTimerId(null);
26
+ if (timerRef.current) {
27
+ window.clearTimeout(timerRef.current);
28
+ timerRef.current = null;
29
29
  }
30
30
  };
31
31
  const start = () => {
32
32
  removeTimeout();
33
- setTimerId(window.setTimeout(onStop, duration));
33
+ timerRef.current = window.setTimeout(onStop, duration);
34
34
  };
35
35
  const onStop = () => {
36
36
  removeTimeout();
package/lib/Theme/GlobalCssVariables.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"GlobalCssVariables.d.ts","sourceRoot":"","sources":["../../src/Theme/GlobalCssVariables.tsx"],"names":[],"mappings":"AAmBA,OAAO,EAAC,SAAS,EAAC,MAAM,gBAAgB,CAAC;AA6GzC,eAAO,MAAM,kBAAkB;iBAzGZ,SAAS;gBA4CV,SAAS;wBA4CD,SAAS;CAqBlC,CAAC"}
1
+ {"version":3,"file":"GlobalCssVariables.d.ts","sourceRoot":"","sources":["../../src/Theme/GlobalCssVariables.tsx"],"names":[],"mappings":"AAmBA,OAAO,EAAC,SAAS,EAAC,MAAM,gBAAgB,CAAC;AAsHzC,eAAO,MAAM,kBAAkB;iBAlHZ,SAAS;gBAgDV,SAAS;wBAgDD,SAAS;CAsBlC,CAAC"}
package/lib/Theme/GlobalCssVariables.js CHANGED
@@ -52,6 +52,9 @@ const light = () => ({
52
52
  '--text-input-label': Identity_1.COLOR_V2.GRAY_80,
53
53
  // Select
54
54
  '--select-focused-description': Identity_1.COLOR_V2.WHITE,
55
+ // Range Input
56
+ '--indicator-range-input-thumb': Identity_1.COLOR_V2.BLUE_LIGHT_700,
57
+ '--indicator-range-input-track-bg': Identity_1.COLOR_V2.GRAY_60,
55
58
  // General
56
59
  '--danger-color': Identity_1.COLOR_V2.RED_LIGHT_500,
57
60
  '--app-bg': Identity_1.COLOR_V2.GRAY_10,
@@ -89,6 +92,9 @@ const dark = () => ({
89
92
  '--text-input-label': Identity_1.COLOR_V2.GRAY_40,
90
93
  // Select
91
94
  '--select-focused-description': Identity_1.COLOR_V2.GRAY_40,
95
+ // Range Input
96
+ '--indicator-range-input-thumb': Identity_1.COLOR_V2.BLUE_DARK_300,
97
+ '--indicator-range-input-track-bg': Identity_1.COLOR_V2.GRAY_70,
92
98
  // General
93
99
  '--danger-color': Identity_1.COLOR_V2.RED_DARK_500,
94
100
  '--app-bg': Identity_1.COLOR_V2.GRAY_95,
@@ -100,15 +106,16 @@ const accentColors = () => ({
100
106
  '--accent-color-highlight-inversed': Identity_1.COLOR_V2.BLUE_LIGHT_800,
101
107
  '--accent-color-border': Identity_1.COLOR_V2.BLUE_LIGHT_500,
102
108
  '--accent-color-focus': Identity_1.COLOR_V2.BLUE_LIGHT_400,
103
- '--icon-primary-active-fill': Identity_1.COLOR_V2.BLUE_LIGHT_500,
104
- '--icon-secondary-active-border': 'transparent',
105
109
  '--button-primary-hover': Identity_1.COLOR_V2.BLUE_LIGHT_600,
106
110
  '--button-primary-active': Identity_1.COLOR_V2.BLUE_LIGHT_700,
107
111
  '--button-primary-active-border': Identity_1.COLOR_V2.BLUE_LIGHT_700,
108
112
  '--button-primary-focus-border': Identity_1.COLOR_V2.BLUE_LIGHT_700,
109
- '--button-secondary-active-bg)': Identity_1.COLOR_V2.BLUE_LIGHT_50,
110
- '--button-secondary-active-border)': Identity_1.COLOR_V2.BLUE_LIGHT_500,
111
- '--button-secondary-hover-border)': Identity_1.COLOR_V2.BLUE_LIGHT_500,
113
+ '--button-secondary-active-bg': Identity_1.COLOR_V2.BLUE_LIGHT_50,
114
+ '--button-secondary-active-border': Identity_1.COLOR_V2.BLUE_LIGHT_500,
115
+ '--button-secondary-hover-border': Identity_1.COLOR_V2.BLUE_LIGHT_500,
116
+ '--icon-primary-active-fill': Identity_1.COLOR_V2.BLUE_LIGHT_500,
117
+ '--icon-secondary-active-border': 'transparent',
118
+ '--indicator-range-input-thumb': Identity_1.COLOR_V2.BLUE_LIGHT_700,
112
119
  });
113
120
  exports.GlobalCssVariables = {
114
121
  light,
package/lib/Theme/Theme.d.ts CHANGED
@@ -62,6 +62,10 @@ export interface Theme extends ETheme {
62
62
  focusColor: string;
63
63
  primaryColor: string;
64
64
  };
65
+ IndicatorRangeInput: {
66
+ thumb: string;
67
+ trackBg: string;
68
+ };
65
69
  Input: {
66
70
  backgroundColor: string;
67
71
  backgroundColorDisabled: string;
package/lib/Theme/Theme.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Theme.d.ts","sourceRoot":"","sources":["../../src/Theme/Theme.tsx"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"Theme.d.ts","sourceRoot":"","sources":["../../src/Theme/Theme.tsx"],"names":[],"mappings":"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"}
package/lib/Theme/Theme.js CHANGED
@@ -55,6 +55,10 @@ exports.themes = {
55
55
  primaryHoverBorderColor: 'var(--icon-button-primary-hover-border)',
56
56
  secondaryActiveBorderColor: 'var(--icon-secondary-active-border)',
57
57
  },
58
+ IndicatorRangeInput: {
59
+ thumb: 'var(--indicator-range-input-thumb)',
60
+ trackBg: 'var(--indicator-range-input-track-bg)',
61
+ },
58
62
  Input: {
59
63
  backgroundColor: 'var(--text-input-background)',
60
64
  backgroundColorDisabled: 'var(--text-input-disabled)',
@@ -100,6 +104,15 @@ exports.themes = {
100
104
  tertiaryDisabledBorder: 'var(--button-tertiary-disabled-border)',
101
105
  tertiaryActiveBg: 'var(--accent-color-highlight)',
102
106
  },
107
+ Checkbox: {
108
+ background: colors_v2_1.COLOR_V2.GRAY_20,
109
+ border: colors_v2_1.COLOR_V2.GRAY_80,
110
+ borderFocused: colors_v2_1.BASE_LIGHT_COLOR.BLUE,
111
+ disableBgColor: colors_v2_1.COLOR_V2.GRAY_20,
112
+ disableBorderColor: colors_v2_1.COLOR_V2.GRAY_60,
113
+ disablecheckedBgColor: colors_v2_1.COLOR_V2.GRAY_20,
114
+ invalidBorderColor: colors_v2_1.BASE_LIGHT_COLOR.RED,
115
+ },
103
116
  IconButton: {
104
117
  activePrimaryBgColor: colors_v2_1.COLOR_V2.BLUE_LIGHT_50,
105
118
  focusBorderColor: colors_v2_1.COLOR_V2.BLUE_LIGHT_500,
@@ -112,6 +125,10 @@ exports.themes = {
112
125
  primaryHoverBorderColor: colors_v2_1.COLOR_V2.GRAY_50,
113
126
  secondaryActiveBorderColor: 'transparent',
114
127
  },
128
+ IndicatorRangeInput: {
129
+ thumb: 'var(--indicator-range-input-thumb)',
130
+ trackBg: 'var(--indicator-range-input-track-bg)',
131
+ },
115
132
  Input: {
116
133
  backgroundColor: colors_1.COLOR.WHITE,
117
134
  backgroundColorDisabled: colors_v2_1.COLOR_V2.GRAY_20,
@@ -119,14 +136,6 @@ exports.themes = {
119
136
  labelColor: colors_v2_1.COLOR_V2.GRAY_80,
120
137
  borderHover: 'var(--text-input-border-hover)',
121
138
  },
122
- general: {
123
- backgroundColor: colors_v2_1.COLOR_V2.GRAY_20,
124
- color: colors_1.COLOR.TEXT,
125
- primaryColor: colors_v2_1.COLOR_V2.BLUE,
126
- dangerColor: colors_v2_1.COLOR_V2.RED,
127
- contrastColor: 'var(--text-input-background)',
128
- focusColor: 'var(--accent-color-focus)',
129
- },
130
139
  Select: {
131
140
  disabledColor: colors_v2_1.COLOR_V2.GRAY_70,
132
141
  contrastTextColor: colors_1.COLOR.WHITE,
@@ -135,14 +144,13 @@ exports.themes = {
135
144
  optionHoverBg: 'var(--accent-color-highlight)',
136
145
  selectedActiveBg: 'var(--button-primary-hover)',
137
146
  },
138
- Checkbox: {
139
- background: colors_v2_1.COLOR_V2.GRAY_20,
140
- border: colors_v2_1.COLOR_V2.GRAY_80,
141
- borderFocused: colors_v2_1.BASE_LIGHT_COLOR.BLUE,
142
- disableBgColor: colors_v2_1.COLOR_V2.GRAY_20,
143
- disableBorderColor: colors_v2_1.COLOR_V2.GRAY_60,
144
- disablecheckedBgColor: colors_v2_1.COLOR_V2.GRAY_20,
145
- invalidBorderColor: colors_v2_1.BASE_LIGHT_COLOR.RED,
147
+ general: {
148
+ backgroundColor: colors_v2_1.COLOR_V2.GRAY_20,
149
+ color: colors_1.COLOR.TEXT,
150
+ primaryColor: colors_v2_1.COLOR_V2.BLUE,
151
+ dangerColor: colors_v2_1.COLOR_V2.RED,
152
+ contrastColor: 'var(--text-input-background)',
153
+ focusColor: 'var(--accent-color-focus)',
146
154
  },
147
155
  },
148
156
  [THEME_ID.DARK]: {
@@ -166,6 +174,15 @@ exports.themes = {
166
174
  tertiaryDisabledBorder: 'var(--button-tertiary-disabled-border)',
167
175
  tertiaryActiveBg: 'var(--accent-color-highlight)',
168
176
  },
177
+ Checkbox: {
178
+ background: colors_v2_1.COLOR_V2.GRAY_20,
179
+ border: colors_v2_1.COLOR_V2.GRAY_60,
180
+ borderFocused: colors_v2_1.BASE_DARK_COLOR.BLUE,
181
+ disableBgColor: colors_v2_1.COLOR_V2.GRAY_10,
182
+ disableBorderColor: colors_v2_1.COLOR_V2.GRAY_70,
183
+ disablecheckedBgColor: colors_v2_1.COLOR_V2.GRAY_60,
184
+ invalidBorderColor: colors_v2_1.BASE_DARK_COLOR.RED,
185
+ },
169
186
  IconButton: {
170
187
  activePrimaryBgColor: colors_v2_1.COLOR_V2.BLUE_DARK_800,
171
188
  focusBorderColor: colors_v2_1.COLOR_V2.BLUE_DARK_600,
@@ -178,6 +195,10 @@ exports.themes = {
178
195
  primaryHoverBorderColor: colors_v2_1.COLOR_V2.GRAY_70,
179
196
  secondaryActiveBorderColor: colors_v2_1.COLOR_V2.BLUE_DARK_800,
180
197
  },
198
+ IndicatorRangeInput: {
199
+ thumb: 'var(--indicator-range-input-thumb)',
200
+ trackBg: 'var(--indicator-range-input-track-bg)',
201
+ },
181
202
  Input: {
182
203
  backgroundColor: colors_1.COLOR.BLACK_LIGHTEN_24,
183
204
  backgroundColorDisabled: colors_1.COLOR.GRAY_100,
@@ -185,14 +206,6 @@ exports.themes = {
185
206
  labelColor: colors_v2_1.COLOR_V2.GRAY_40,
186
207
  borderHover: 'var(--text-input-border-hover)',
187
208
  },
188
- general: {
189
- backgroundColor: colors_1.COLOR.BLACK,
190
- color: colors_1.COLOR.WHITE,
191
- primaryColor: colors_v2_1.COLOR_V2.BLUE,
192
- dangerColor: colors_v2_1.COLOR_V2.RED,
193
- contrastColor: 'var(--text-input-background)',
194
- focusColor: 'var(--accent-color-focus)',
195
- },
196
209
  Select: {
197
210
  disabledColor: colors_v2_1.COLOR_V2.GRAY_60,
198
211
  contrastTextColor: colors_1.COLOR.BLACK,
@@ -201,14 +214,13 @@ exports.themes = {
201
214
  optionHoverBg: 'var(--accent-color-highlight)',
202
215
  selectedActiveBg: 'var(--button-primary-active)',
203
216
  },
204
- Checkbox: {
205
- background: colors_v2_1.COLOR_V2.GRAY_20,
206
- border: colors_v2_1.COLOR_V2.GRAY_60,
207
- borderFocused: colors_v2_1.BASE_DARK_COLOR.BLUE,
208
- disableBgColor: colors_v2_1.COLOR_V2.GRAY_10,
209
- disableBorderColor: colors_v2_1.COLOR_V2.GRAY_70,
210
- disablecheckedBgColor: colors_v2_1.COLOR_V2.GRAY_60,
211
- invalidBorderColor: colors_v2_1.BASE_DARK_COLOR.RED,
217
+ general: {
218
+ backgroundColor: colors_1.COLOR.BLACK,
219
+ color: colors_1.COLOR.WHITE,
220
+ primaryColor: colors_v2_1.COLOR_V2.BLUE,
221
+ dangerColor: colors_v2_1.COLOR_V2.RED,
222
+ contrastColor: 'var(--text-input-background)',
223
+ focusColor: 'var(--accent-color-focus)',
212
224
  },
213
225
  },
214
226
  };
package/package.json CHANGED
@@ -69,6 +69,6 @@
69
69
  "test:watch": "jest --watch",
70
70
  "test:update": "jest --updateSnapshot"
71
71
  },
72
- "version": "9.2.1",
73
- "gitHead": "073ba4e4894358c2ebc85719ffac6982bd517d60"
72
+ "version": "9.2.3",
73
+ "gitHead": "9d7855a43fb0feb33ea0a0e5f82c8d0863c28cc5"
74
74
  }