oneslash-design-system 2.0.1 → 2.0.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.
@@ -59,12 +59,12 @@ export default function TextField(_a) {
59
59
  };
60
60
  return (<div className="flex flex-col w-full">
61
61
  {label && (<label htmlFor={id} className="mb-1 text-body2 text-fg-secondary">
62
- {label}{required && <span className="text-error-main ml-0.5">*</span>}
62
+ {label}{required && <span className="text-error-text ml-0.5">*</span>}
63
63
  </label>)}
64
64
  <div className="relative">
65
65
  {multiline ? (<textarea id={id} rows={maxRows} className={containerClasses} value={value} onChange={onChange} placeholder={placeholder} onFocus={onFocus} onBlur={onBlur} onKeyDown={handleKeyDown} autoFocus={autoFocus} disabled={disabled} required={required} autoComplete="off" {...errorProps}/>) : (<input id={id} type={type} inputMode={getInputMode()} className={containerClasses} value={value} onChange={onChange} placeholder={placeholder} onFocus={onFocus} onBlur={onBlur} onKeyDown={handleKeyDown} autoFocus={autoFocus} disabled={disabled} required={required} autoComplete="off" {...errorProps}/>)}
66
66
  </div>
67
- {error && (<p id={errorId} className="mt-1 text-error-main text-body2">
67
+ {error && (<p id={errorId} className="mt-1 text-error-text text-body2">
68
68
  {errorText}
69
69
  </p>)}
70
70
  </div>);
@@ -67,7 +67,7 @@ export default function Textarea(_a) {
67
67
  <div className="relative">
68
68
  <textarea ref={textareaRef} id={id} rows={1} className={containerClasses} value={value} onChange={onChange} onInput={adjustHeight} placeholder={placeholder} onFocus={onFocus} onBlur={onBlur} onKeyDown={handleKeyDown} onCompositionStart={onCompositionStart} onCompositionEnd={onCompositionEnd} autoFocus={autoFocus} disabled={disabled} autoComplete="off" aria-invalid={error || undefined} aria-describedby={error ? errorId : undefined}/>
69
69
  </div>
70
- {error && (<p id={errorId} className="mt-1 text-error-main text-body2">
70
+ {error && (<p id={errorId} className="mt-1 text-error-text text-body2">
71
71
  {errorText}
72
72
  </p>)}
73
73
  </div>);
@@ -39,7 +39,7 @@ var base = {
39
39
  },
40
40
  error: {
41
41
  main: '#D32F2F',
42
- dark: '#B22323',
42
+ dark: '#A82121', // 4.62:1 on alertBg (#B22323 was 4.27)
43
43
  light: '#F27777',
44
44
  alertBg: '#F2C4C4',
45
45
  contrast: '#FFFFFF',
@@ -126,7 +126,7 @@ var base = {
126
126
  dark: '#B22323',
127
127
  light: '#F27777',
128
128
  alertBg: '#5C1A1A',
129
- contrast: '#FFFFFF',
129
+ contrast: '#000000', // 5.5:1 on main (#FFFFFF was 3.79)
130
130
  },
131
131
  warning: {
132
132
  main: '#FF8C0A',
@@ -338,8 +338,8 @@ var forestDark = override(baseColors.dark, {
338
338
  * @returns {S}
339
339
  */
340
340
  var withForestInfoText = function (set) { return (__assign(__assign({}, set), { info: __assign(__assign({}, set.info), { text: '#0068A3', textHover: '#0068A3' }) })); };
341
- // Forest's secondary.main (#6E7A5A) is mid-tone: its text.primary gives 3.5:1, so the label is the pale green
342
- // Scindo's hand-written theme used (3.8:1 light, 3.5:1 dark; report-only in check:contrast).
341
+ // Forest's secondary.main (#6E7A5A) is mid-tone: its text.primary gives 3.5:1 and Scindo's cream 3.8:1, so the
342
+ // label is white (4.56:1) in both modes.
343
343
  /**
344
344
  * @template {typeof base.colors.light} S
345
345
  * @param {S} set
@@ -359,5 +359,5 @@ var withTooltips = function (light, dark) { return ({
359
359
  dark: __assign(__assign({}, dark), { misc: __assign(__assign({}, dark.misc), { tooltipBg: light.background.accent300, tooltipText: light.text.primary }) }),
360
360
  }); };
361
361
  var defaultSets = withTooltips(withSemanticKeys(baseColors.light, 'light'), withSemanticKeys(baseColors.dark, 'dark'));
362
- var forestSets = withTooltips(withSecondaryContrast(withForestInfoText(withSemanticKeys(forestLight, 'light')), '#E7ECDA'), withSecondaryContrast(withSemanticKeys(forestDark, 'dark'), '#D9E5C7'));
362
+ var forestSets = withTooltips(withSecondaryContrast(withForestInfoText(withSemanticKeys(forestLight, 'light')), '#FFFFFF'), withSecondaryContrast(withSemanticKeys(forestDark, 'dark'), '#FFFFFF'));
363
363
  module.exports = __assign(__assign({}, base), { colors: defaultSets, themes: { forest: forestSets } });
@@ -20,14 +20,14 @@
20
20
  --os-color-secondary-light: 209 209 209;
21
21
  --os-color-secondary-contrast: 0 0 0;
22
22
  --os-color-error-main: 211 47 47;
23
- --os-color-error-dark: 178 35 35;
23
+ --os-color-error-dark: 168 33 33;
24
24
  --os-color-error-light: 242 119 119;
25
25
  --os-color-error-alertBg: 242 196 196;
26
26
  --os-color-error-contrast: 255 255 255;
27
- --os-color-error-fill: 178 35 35;
27
+ --os-color-error-fill: 168 33 33;
28
28
  --os-color-error-onFill: 255 255 255;
29
- --os-color-error-text: 178 35 35;
30
- --os-color-error-textHover: 178 35 35;
29
+ --os-color-error-text: 168 33 33;
30
+ --os-color-error-textHover: 168 33 33;
31
31
  --os-color-error-tint: 242 119 119;
32
32
  --os-color-warning-main: 239 108 0;
33
33
  --os-color-warning-dark: 168 70 0;
@@ -105,7 +105,7 @@
105
105
  --os-color-error-dark: 178 35 35;
106
106
  --os-color-error-light: 242 119 119;
107
107
  --os-color-error-alertBg: 92 26 26;
108
- --os-color-error-contrast: 255 255 255;
108
+ --os-color-error-contrast: 0 0 0;
109
109
  --os-color-error-fill: 231 76 76;
110
110
  --os-color-error-onFill: 0 0 0;
111
111
  --os-color-error-text: 242 119 119;
@@ -188,7 +188,7 @@
188
188
  --os-color-error-dark: 178 35 35;
189
189
  --os-color-error-light: 242 119 119;
190
190
  --os-color-error-alertBg: 92 26 26;
191
- --os-color-error-contrast: 255 255 255;
191
+ --os-color-error-contrast: 0 0 0;
192
192
  --os-color-error-fill: 231 76 76;
193
193
  --os-color-error-onFill: 0 0 0;
194
194
  --os-color-error-text: 242 119 119;
@@ -20,14 +20,14 @@
20
20
  --os-color-secondary-light: 209 209 209;
21
21
  --os-color-secondary-contrast: 0 0 0;
22
22
  --os-color-error-main: 211 47 47;
23
- --os-color-error-dark: 178 35 35;
23
+ --os-color-error-dark: 168 33 33;
24
24
  --os-color-error-light: 242 119 119;
25
25
  --os-color-error-alertBg: 242 196 196;
26
26
  --os-color-error-contrast: 255 255 255;
27
- --os-color-error-fill: 178 35 35;
27
+ --os-color-error-fill: 168 33 33;
28
28
  --os-color-error-onFill: 255 255 255;
29
- --os-color-error-text: 178 35 35;
30
- --os-color-error-textHover: 178 35 35;
29
+ --os-color-error-text: 168 33 33;
30
+ --os-color-error-textHover: 168 33 33;
31
31
  --os-color-error-tint: 242 119 119;
32
32
  --os-color-warning-main: 239 108 0;
33
33
  --os-color-warning-dark: 168 70 0;
@@ -105,7 +105,7 @@
105
105
  --os-color-error-dark: 178 35 35;
106
106
  --os-color-error-light: 242 119 119;
107
107
  --os-color-error-alertBg: 92 26 26;
108
- --os-color-error-contrast: 255 255 255;
108
+ --os-color-error-contrast: 0 0 0;
109
109
  --os-color-error-fill: 231 76 76;
110
110
  --os-color-error-onFill: 0 0 0;
111
111
  --os-color-error-text: 242 119 119;
@@ -18,16 +18,16 @@
18
18
  --os-color-secondary-main: 110 122 90;
19
19
  --os-color-secondary-dark: 93 104 73;
20
20
  --os-color-secondary-light: 130 141 107;
21
- --os-color-secondary-contrast: 231 236 218;
21
+ --os-color-secondary-contrast: 255 255 255;
22
22
  --os-color-error-main: 211 47 47;
23
- --os-color-error-dark: 178 35 35;
23
+ --os-color-error-dark: 168 33 33;
24
24
  --os-color-error-light: 242 119 119;
25
25
  --os-color-error-alertBg: 242 196 196;
26
26
  --os-color-error-contrast: 255 255 255;
27
- --os-color-error-fill: 178 35 35;
27
+ --os-color-error-fill: 168 33 33;
28
28
  --os-color-error-onFill: 255 255 255;
29
- --os-color-error-text: 178 35 35;
30
- --os-color-error-textHover: 178 35 35;
29
+ --os-color-error-text: 168 33 33;
30
+ --os-color-error-textHover: 168 33 33;
31
31
  --os-color-error-tint: 242 119 119;
32
32
  --os-color-warning-main: 239 108 0;
33
33
  --os-color-warning-dark: 168 70 0;
@@ -100,12 +100,12 @@
100
100
  --os-color-secondary-main: 110 122 90;
101
101
  --os-color-secondary-dark: 93 104 73;
102
102
  --os-color-secondary-light: 130 141 107;
103
- --os-color-secondary-contrast: 217 229 199;
103
+ --os-color-secondary-contrast: 255 255 255;
104
104
  --os-color-error-main: 231 76 76;
105
105
  --os-color-error-dark: 178 35 35;
106
106
  --os-color-error-light: 242 119 119;
107
107
  --os-color-error-alertBg: 92 26 26;
108
- --os-color-error-contrast: 255 255 255;
108
+ --os-color-error-contrast: 0 0 0;
109
109
  --os-color-error-fill: 231 76 76;
110
110
  --os-color-error-onFill: 0 0 0;
111
111
  --os-color-error-text: 242 119 119;
@@ -183,12 +183,12 @@
183
183
  --os-color-secondary-main: 110 122 90;
184
184
  --os-color-secondary-dark: 93 104 73;
185
185
  --os-color-secondary-light: 130 141 107;
186
- --os-color-secondary-contrast: 217 229 199;
186
+ --os-color-secondary-contrast: 255 255 255;
187
187
  --os-color-error-main: 231 76 76;
188
188
  --os-color-error-dark: 178 35 35;
189
189
  --os-color-error-light: 242 119 119;
190
190
  --os-color-error-alertBg: 92 26 26;
191
- --os-color-error-contrast: 255 255 255;
191
+ --os-color-error-contrast: 0 0 0;
192
192
  --os-color-error-fill: 231 76 76;
193
193
  --os-color-error-onFill: 0 0 0;
194
194
  --os-color-error-text: 242 119 119;
@@ -18,16 +18,16 @@
18
18
  --os-color-secondary-main: 110 122 90;
19
19
  --os-color-secondary-dark: 93 104 73;
20
20
  --os-color-secondary-light: 130 141 107;
21
- --os-color-secondary-contrast: 231 236 218;
21
+ --os-color-secondary-contrast: 255 255 255;
22
22
  --os-color-error-main: 211 47 47;
23
- --os-color-error-dark: 178 35 35;
23
+ --os-color-error-dark: 168 33 33;
24
24
  --os-color-error-light: 242 119 119;
25
25
  --os-color-error-alertBg: 242 196 196;
26
26
  --os-color-error-contrast: 255 255 255;
27
- --os-color-error-fill: 178 35 35;
27
+ --os-color-error-fill: 168 33 33;
28
28
  --os-color-error-onFill: 255 255 255;
29
- --os-color-error-text: 178 35 35;
30
- --os-color-error-textHover: 178 35 35;
29
+ --os-color-error-text: 168 33 33;
30
+ --os-color-error-textHover: 168 33 33;
31
31
  --os-color-error-tint: 242 119 119;
32
32
  --os-color-warning-main: 239 108 0;
33
33
  --os-color-warning-dark: 168 70 0;
@@ -100,12 +100,12 @@
100
100
  --os-color-secondary-main: 110 122 90;
101
101
  --os-color-secondary-dark: 93 104 73;
102
102
  --os-color-secondary-light: 130 141 107;
103
- --os-color-secondary-contrast: 217 229 199;
103
+ --os-color-secondary-contrast: 255 255 255;
104
104
  --os-color-error-main: 231 76 76;
105
105
  --os-color-error-dark: 178 35 35;
106
106
  --os-color-error-light: 242 119 119;
107
107
  --os-color-error-alertBg: 92 26 26;
108
- --os-color-error-contrast: 255 255 255;
108
+ --os-color-error-contrast: 0 0 0;
109
109
  --os-color-error-fill: 231 76 76;
110
110
  --os-color-error-onFill: 0 0 0;
111
111
  --os-color-error-text: 242 119 119;
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "oneslash-design-system",
3
3
  "description": "A design system for the Oneslash projects",
4
- "version": "2.0.1",
4
+ "version": "2.0.2",
5
5
  "private": false,
6
6
  "main": "./dist/index.js",
7
7
  "types": "./dist/index.d.ts",