@mirai/ui 1.1.9 → 1.1.11

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 (29) hide show
  1. package/README.md +20 -8
  2. package/build/components/Button/Button.module.css +7 -7
  3. package/build/components/InputSelect/InputSelect.js +1 -1
  4. package/build/components/InputSelect/InputSelect.js.map +1 -1
  5. package/build/components/InputSelect/__tests__/__snapshots__/InputSelect.test.js.snap +1 -1
  6. package/build/components/InputText/InputText.js +1 -1
  7. package/build/components/InputText/InputText.js.map +1 -1
  8. package/build/components/InputText/__tests__/__snapshots__/InputText.test.js.snap +1 -1
  9. package/build/components/Table/Table.Filter.js +1 -1
  10. package/build/components/Table/Table.Filter.js.map +1 -1
  11. package/build/components/Table/__tests__/__snapshots__/Table.test.js.snap +4 -4
  12. package/build/primitives/Icon/Icon.js +23 -4
  13. package/build/primitives/Icon/Icon.js.map +1 -1
  14. package/build/primitives/Icon/Icon.module.css +0 -20
  15. package/build/primitives/Icon/Icon.stories.js +5 -1
  16. package/build/primitives/Icon/Icon.stories.js.map +1 -1
  17. package/build/primitives/Icon/__tests__/__snapshots__/Icon.test.js.snap +154 -50
  18. package/build/primitives/Text/Text.js +22 -4
  19. package/build/primitives/Text/Text.js.map +1 -1
  20. package/build/primitives/Text/Text.module.css +33 -20
  21. package/build/primitives/Text/Text.stories.js +5 -1
  22. package/build/primitives/Text/Text.stories.js.map +1 -1
  23. package/build/primitives/Text/__tests__/__snapshots__/Text.test.js.snap +82 -42
  24. package/build/primitives/Text/helpers/color.js +23 -0
  25. package/build/primitives/Text/helpers/color.js.map +1 -0
  26. package/build/primitives/Text/helpers/index.js +11 -0
  27. package/build/primitives/Text/helpers/index.js.map +1 -1
  28. package/build/theme/default.theme.css +19 -14
  29. package/package.json +1 -1
@@ -1,9 +1,9 @@
1
1
  // Jest Snapshot v1, https://goo.gl/fbAQLP
2
2
 
3
- exports[`primitive:<Icon> inherit:className 1`] = `
3
+ exports[`primitive:<Icon> color prop:accent 1`] = `
4
4
  <DocumentFragment>
5
5
  <span
6
- class="icon headline-3 mirai"
6
+ class="icon accent headline-3"
7
7
  >
8
8
  <svg
9
9
  fill="currentColor"
@@ -26,10 +26,10 @@ exports[`primitive:<Icon> inherit:className 1`] = `
26
26
  </DocumentFragment>
27
27
  `;
28
28
 
29
- exports[`primitive:<Icon> prop:accent 1`] = `
29
+ exports[`primitive:<Icon> color prop:accentDark 1`] = `
30
30
  <DocumentFragment>
31
31
  <span
32
- class="icon accent headline-3"
32
+ class="icon accentDark headline-3"
33
33
  >
34
34
  <svg
35
35
  fill="currentColor"
@@ -52,10 +52,10 @@ exports[`primitive:<Icon> prop:accent 1`] = `
52
52
  </DocumentFragment>
53
53
  `;
54
54
 
55
- exports[`primitive:<Icon> prop:action 1`] = `
55
+ exports[`primitive:<Icon> color prop:accentLight 1`] = `
56
56
  <DocumentFragment>
57
57
  <span
58
- class="icon action"
58
+ class="icon accentLight headline-3"
59
59
  >
60
60
  <svg
61
61
  fill="currentColor"
@@ -78,7 +78,33 @@ exports[`primitive:<Icon> prop:action 1`] = `
78
78
  </DocumentFragment>
79
79
  `;
80
80
 
81
- exports[`primitive:<Icon> prop:error 1`] = `
81
+ exports[`primitive:<Icon> color prop:dark 1`] = `
82
+ <DocumentFragment>
83
+ <span
84
+ class="icon dark headline-3"
85
+ >
86
+ <svg
87
+ fill="currentColor"
88
+ height="1em"
89
+ stroke="currentColor"
90
+ stroke-width="0"
91
+ viewBox="0 0 24 24"
92
+ width="1em"
93
+ xmlns="http://www.w3.org/2000/svg"
94
+ >
95
+ <path
96
+ d="M0 0h24v24H0V0z"
97
+ fill="none"
98
+ />
99
+ <path
100
+ d="M20 11H7.83l5.59-5.59L12 4l-8 8 8 8 1.41-1.41L7.83 13H20v-2z"
101
+ />
102
+ </svg>
103
+ </span>
104
+ </DocumentFragment>
105
+ `;
106
+
107
+ exports[`primitive:<Icon> color prop:error 1`] = `
82
108
  <DocumentFragment>
83
109
  <span
84
110
  class="icon error headline-3"
@@ -104,10 +130,10 @@ exports[`primitive:<Icon> prop:error 1`] = `
104
130
  </DocumentFragment>
105
131
  `;
106
132
 
107
- exports[`primitive:<Icon> prop:headline & level:1 1`] = `
133
+ exports[`primitive:<Icon> color prop:info 1`] = `
108
134
  <DocumentFragment>
109
135
  <span
110
- class="icon headline-1"
136
+ class="icon info headline-3"
111
137
  >
112
138
  <svg
113
139
  fill="currentColor"
@@ -130,10 +156,10 @@ exports[`primitive:<Icon> prop:headline & level:1 1`] = `
130
156
  </DocumentFragment>
131
157
  `;
132
158
 
133
- exports[`primitive:<Icon> prop:headline & level:2 1`] = `
159
+ exports[`primitive:<Icon> color prop:light 1`] = `
134
160
  <DocumentFragment>
135
161
  <span
136
- class="icon headline-2"
162
+ class="icon light headline-3"
137
163
  >
138
164
  <svg
139
165
  fill="currentColor"
@@ -156,10 +182,10 @@ exports[`primitive:<Icon> prop:headline & level:2 1`] = `
156
182
  </DocumentFragment>
157
183
  `;
158
184
 
159
- exports[`primitive:<Icon> prop:headline & level:3 1`] = `
185
+ exports[`primitive:<Icon> color prop:success 1`] = `
160
186
  <DocumentFragment>
161
187
  <span
162
- class="icon headline-3"
188
+ class="icon success headline-3"
163
189
  >
164
190
  <svg
165
191
  fill="currentColor"
@@ -182,10 +208,10 @@ exports[`primitive:<Icon> prop:headline & level:3 1`] = `
182
208
  </DocumentFragment>
183
209
  `;
184
210
 
185
- exports[`primitive:<Icon> prop:headline & level:4 1`] = `
211
+ exports[`primitive:<Icon> color prop:warning 1`] = `
186
212
  <DocumentFragment>
187
213
  <span
188
- class="icon headline-4"
214
+ class="icon warning headline-3"
189
215
  >
190
216
  <svg
191
217
  fill="currentColor"
@@ -208,7 +234,111 @@ exports[`primitive:<Icon> prop:headline & level:4 1`] = `
208
234
  </DocumentFragment>
209
235
  `;
210
236
 
211
- exports[`primitive:<Icon> prop:headline 1`] = `
237
+ exports[`primitive:<Icon> inherit:className 1`] = `
238
+ <DocumentFragment>
239
+ <span
240
+ class="icon headline-3 mirai"
241
+ >
242
+ <svg
243
+ fill="currentColor"
244
+ height="1em"
245
+ stroke="currentColor"
246
+ stroke-width="0"
247
+ viewBox="0 0 24 24"
248
+ width="1em"
249
+ xmlns="http://www.w3.org/2000/svg"
250
+ >
251
+ <path
252
+ d="M0 0h24v24H0V0z"
253
+ fill="none"
254
+ />
255
+ <path
256
+ d="M20 11H7.83l5.59-5.59L12 4l-8 8 8 8 1.41-1.41L7.83 13H20v-2z"
257
+ />
258
+ </svg>
259
+ </span>
260
+ </DocumentFragment>
261
+ `;
262
+
263
+ exports[`primitive:<Icon> prop:action 1`] = `
264
+ <DocumentFragment>
265
+ <span
266
+ class="icon action"
267
+ >
268
+ <svg
269
+ fill="currentColor"
270
+ height="1em"
271
+ stroke="currentColor"
272
+ stroke-width="0"
273
+ viewBox="0 0 24 24"
274
+ width="1em"
275
+ xmlns="http://www.w3.org/2000/svg"
276
+ >
277
+ <path
278
+ d="M0 0h24v24H0V0z"
279
+ fill="none"
280
+ />
281
+ <path
282
+ d="M20 11H7.83l5.59-5.59L12 4l-8 8 8 8 1.41-1.41L7.83 13H20v-2z"
283
+ />
284
+ </svg>
285
+ </span>
286
+ </DocumentFragment>
287
+ `;
288
+
289
+ exports[`primitive:<Icon> prop:headline & level:1 1`] = `
290
+ <DocumentFragment>
291
+ <span
292
+ class="icon headline-1"
293
+ >
294
+ <svg
295
+ fill="currentColor"
296
+ height="1em"
297
+ stroke="currentColor"
298
+ stroke-width="0"
299
+ viewBox="0 0 24 24"
300
+ width="1em"
301
+ xmlns="http://www.w3.org/2000/svg"
302
+ >
303
+ <path
304
+ d="M0 0h24v24H0V0z"
305
+ fill="none"
306
+ />
307
+ <path
308
+ d="M20 11H7.83l5.59-5.59L12 4l-8 8 8 8 1.41-1.41L7.83 13H20v-2z"
309
+ />
310
+ </svg>
311
+ </span>
312
+ </DocumentFragment>
313
+ `;
314
+
315
+ exports[`primitive:<Icon> prop:headline & level:2 1`] = `
316
+ <DocumentFragment>
317
+ <span
318
+ class="icon headline-2"
319
+ >
320
+ <svg
321
+ fill="currentColor"
322
+ height="1em"
323
+ stroke="currentColor"
324
+ stroke-width="0"
325
+ viewBox="0 0 24 24"
326
+ width="1em"
327
+ xmlns="http://www.w3.org/2000/svg"
328
+ >
329
+ <path
330
+ d="M0 0h24v24H0V0z"
331
+ fill="none"
332
+ />
333
+ <path
334
+ d="M20 11H7.83l5.59-5.59L12 4l-8 8 8 8 1.41-1.41L7.83 13H20v-2z"
335
+ />
336
+ </svg>
337
+ </span>
338
+ </DocumentFragment>
339
+ `;
340
+
341
+ exports[`primitive:<Icon> prop:headline & level:3 1`] = `
212
342
  <DocumentFragment>
213
343
  <span
214
344
  class="icon headline-3"
@@ -234,10 +364,10 @@ exports[`primitive:<Icon> prop:headline 1`] = `
234
364
  </DocumentFragment>
235
365
  `;
236
366
 
237
- exports[`primitive:<Icon> prop:lighten 1`] = `
367
+ exports[`primitive:<Icon> prop:headline & level:4 1`] = `
238
368
  <DocumentFragment>
239
369
  <span
240
- class="icon headline-3 lighten"
370
+ class="icon headline-4"
241
371
  >
242
372
  <svg
243
373
  fill="currentColor"
@@ -260,10 +390,10 @@ exports[`primitive:<Icon> prop:lighten 1`] = `
260
390
  </DocumentFragment>
261
391
  `;
262
392
 
263
- exports[`primitive:<Icon> prop:paragraph 1`] = `
393
+ exports[`primitive:<Icon> prop:headline 1`] = `
264
394
  <DocumentFragment>
265
395
  <span
266
- class="icon paragraph"
396
+ class="icon headline-3"
267
397
  >
268
398
  <svg
269
399
  fill="currentColor"
@@ -286,10 +416,10 @@ exports[`primitive:<Icon> prop:paragraph 1`] = `
286
416
  </DocumentFragment>
287
417
  `;
288
418
 
289
- exports[`primitive:<Icon> prop:small 1`] = `
419
+ exports[`primitive:<Icon> prop:paragraph 1`] = `
290
420
  <DocumentFragment>
291
421
  <span
292
- class="icon small"
422
+ class="icon paragraph"
293
423
  >
294
424
  <svg
295
425
  fill="currentColor"
@@ -312,10 +442,10 @@ exports[`primitive:<Icon> prop:small 1`] = `
312
442
  </DocumentFragment>
313
443
  `;
314
444
 
315
- exports[`primitive:<Icon> prop:success 1`] = `
445
+ exports[`primitive:<Icon> prop:small 1`] = `
316
446
  <DocumentFragment>
317
447
  <span
318
- class="icon headline-3 success"
448
+ class="icon small"
319
449
  >
320
450
  <svg
321
451
  fill="currentColor"
@@ -886,32 +1016,6 @@ exports[`primitive:<Icon> prop:value prop:value (WARNING) 1`] = `
886
1016
  </DocumentFragment>
887
1017
  `;
888
1018
 
889
- exports[`primitive:<Icon> prop:warning 1`] = `
890
- <DocumentFragment>
891
- <span
892
- class="icon headline-3 warning"
893
- >
894
- <svg
895
- fill="currentColor"
896
- height="1em"
897
- stroke="currentColor"
898
- stroke-width="0"
899
- viewBox="0 0 24 24"
900
- width="1em"
901
- xmlns="http://www.w3.org/2000/svg"
902
- >
903
- <path
904
- d="M0 0h24v24H0V0z"
905
- fill="none"
906
- />
907
- <path
908
- d="M20 11H7.83l5.59-5.59L12 4l-8 8 8 8 1.41-1.41L7.83 13H20v-2z"
909
- />
910
- </svg>
911
- </span>
912
- </DocumentFragment>
913
- `;
914
-
915
1019
  exports[`primitive:<Icon> renders 1`] = `
916
1020
  <DocumentFragment>
917
1021
  <span
@@ -11,7 +11,7 @@ var _helpers = require("../../helpers");
11
11
  var _Primitive = require("../Primitive");
12
12
  var _helpers2 = require("./helpers");
13
13
  var _TextModule = _interopRequireDefault(require("./Text.module.css"));
14
- var _excluded = ["accent", "action", "bold", "capitalize", "children", "error", "headline", "level", "lighten", "markdown", "small", "success", "tag", "tiny", "underline", "upperCase", "warning", "wide"];
14
+ var _excluded = ["accent", "accentLight", "accentDark", "action", "bold", "capitalize", "children", "dark", "error", "headline", "info", "level", "light", "markdown", "small", "success", "tag", "tiny", "underline", "upperCase", "warning", "wide"];
15
15
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
16
16
  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; }
17
17
  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; }
@@ -22,15 +22,19 @@ function _objectWithoutProperties(source, excluded) { if (source == null) return
22
22
  function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
23
23
  var Text = function Text(_ref) {
24
24
  var accent = _ref.accent,
25
+ accentLight = _ref.accentLight,
26
+ accentDark = _ref.accentDark,
25
27
  action = _ref.action,
26
28
  bold = _ref.bold,
27
29
  capitalize = _ref.capitalize,
28
30
  children = _ref.children,
31
+ dark = _ref.dark,
29
32
  error = _ref.error,
30
33
  headline = _ref.headline,
34
+ info = _ref.info,
31
35
  _ref$level = _ref.level,
32
36
  level = _ref$level === void 0 ? 3 : _ref$level,
33
- lighten = _ref.lighten,
37
+ light = _ref.light,
34
38
  _ref$markdown = _ref.markdown,
35
39
  markdown = _ref$markdown === void 0 ? true : _ref$markdown,
36
40
  small = _ref.small,
@@ -45,21 +49,35 @@ var Text = function Text(_ref) {
45
49
  return /*#__PURE__*/_react.default.createElement(_Primitive.Primitive, _objectSpread(_objectSpread({}, others), {}, {
46
50
  role: others.role || 'text',
47
51
  tag: tag || (headline ? "h".concat(level) : 'span'),
48
- className: (0, _helpers.styles)(_TextModule.default.text, accent && _TextModule.default.accent, bold && _TextModule.default.bold, capitalize && _TextModule.default.capitalize, error && _TextModule.default.error, headline ? _TextModule.default["headline-".concat(level)] : action ? _TextModule.default.action : small ? _TextModule.default.small : tiny ? _TextModule.default.tiny : _TextModule.default.paragraph, lighten && _TextModule.default.lighten, success && _TextModule.default.success, underline && _TextModule.default.underline, upperCase && _TextModule.default.upperCase, warning && _TextModule.default.warning, wide && _TextModule.default.wide, others.className)
52
+ className: (0, _helpers.styles)(_TextModule.default.text, bold && _TextModule.default.bold, capitalize && _TextModule.default.capitalize, (0, _helpers2.color)({
53
+ accent: accent,
54
+ accentDark: accentDark,
55
+ accentLight: accentLight,
56
+ dark: dark,
57
+ error: error,
58
+ info: info,
59
+ light: light,
60
+ success: success,
61
+ warning: warning
62
+ }), headline ? _TextModule.default["headline-".concat(level)] : action ? _TextModule.default.action : small ? _TextModule.default.small : tiny ? _TextModule.default.tiny : _TextModule.default.paragraph, underline && _TextModule.default.underline, upperCase && _TextModule.default.upperCase, wide && _TextModule.default.wide, others.className)
49
63
  }), markdown ? (0, _helpers2.parseMarkdown)(children) : children);
50
64
  };
51
65
  exports.Text = Text;
52
66
  Text.displayName = 'Primitive:Text';
53
67
  Text.propTypes = {
54
68
  accent: _propTypes.default.bool,
69
+ accentLight: _propTypes.default.bool,
70
+ accentDark: _propTypes.default.bool,
55
71
  action: _propTypes.default.bool,
56
72
  bold: _propTypes.default.bool,
57
73
  capitalize: _propTypes.default.bool,
58
74
  children: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.number, _propTypes.default.array]),
75
+ dark: _propTypes.default.bool,
59
76
  error: _propTypes.default.bool,
60
77
  headline: _propTypes.default.bool,
78
+ info: _propTypes.default.bool,
61
79
  level: _propTypes.default.number,
62
- lighten: _propTypes.default.bool,
80
+ light: _propTypes.default.bool,
63
81
  markdown: _propTypes.default.bool,
64
82
  small: _propTypes.default.bool,
65
83
  success: _propTypes.default.bool,
@@ -1 +1 @@
1
- {"version":3,"file":"Text.js","names":["Text","accent","action","bold","capitalize","children","error","headline","level","lighten","markdown","small","success","tag","tiny","underline","upperCase","warning","wide","others","React","createElement","Primitive","role","className","styles","style","text","paragraph","parseMarkdown","displayName","propTypes","PropTypes","bool","oneOfType","string","number","array"],"sources":["../../../src/primitives/Text/Text.jsx"],"sourcesContent":["import PropTypes from 'prop-types';\nimport React from 'react';\n\nimport { styles } from '../../helpers';\nimport { Primitive } from '../Primitive';\nimport { parseMarkdown } from './helpers';\nimport style from './Text.module.css';\n\nconst Text = ({\n accent,\n action,\n bold,\n capitalize,\n children,\n error,\n headline,\n level = 3,\n lighten,\n markdown = true,\n small,\n success,\n tag,\n tiny,\n underline,\n upperCase,\n warning,\n wide,\n ...others\n}) =>\n React.createElement(\n Primitive,\n {\n ...others,\n role: others.role || 'text',\n tag: tag || (headline ? `h${level}` : 'span'),\n className: styles(\n style.text,\n accent && style.accent,\n bold && style.bold,\n capitalize && style.capitalize,\n error && style.error,\n headline\n ? style[`headline-${level}`]\n : action\n ? style.action\n : small\n ? style.small\n : tiny\n ? style.tiny\n : style.paragraph,\n lighten && style.lighten,\n success && style.success,\n underline && style.underline,\n upperCase && style.upperCase,\n warning && style.warning,\n wide && style.wide,\n others.className,\n ),\n },\n markdown ? parseMarkdown(children) : children,\n );\n\nText.displayName = 'Primitive:Text';\n\nText.propTypes = {\n accent: PropTypes.bool,\n action: PropTypes.bool,\n bold: PropTypes.bool,\n capitalize: PropTypes.bool,\n children: PropTypes.oneOfType([PropTypes.string, PropTypes.number, PropTypes.array]),\n error: PropTypes.bool,\n headline: PropTypes.bool,\n level: PropTypes.number,\n lighten: PropTypes.bool,\n markdown: PropTypes.bool,\n small: PropTypes.bool,\n success: PropTypes.bool,\n tag: PropTypes.string,\n tiny: PropTypes.bool,\n underline: PropTypes.bool,\n upperCase: PropTypes.bool,\n warning: PropTypes.bool,\n wide: PropTypes.bool,\n};\n\nexport { Text };\n"],"mappings":"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"}
1
+ {"version":3,"file":"Text.js","names":["Text","accent","accentLight","accentDark","action","bold","capitalize","children","dark","error","headline","info","level","light","markdown","small","success","tag","tiny","underline","upperCase","warning","wide","others","React","createElement","Primitive","role","className","styles","style","text","color","paragraph","parseMarkdown","displayName","propTypes","PropTypes","bool","oneOfType","string","number","array"],"sources":["../../../src/primitives/Text/Text.jsx"],"sourcesContent":["import PropTypes from 'prop-types';\nimport React from 'react';\n\nimport { styles } from '../../helpers';\nimport { Primitive } from '../Primitive';\nimport { color, parseMarkdown } from './helpers';\nimport style from './Text.module.css';\n\nconst Text = ({\n accent,\n accentLight,\n accentDark,\n action,\n bold,\n capitalize,\n children,\n dark,\n error,\n headline,\n info,\n level = 3,\n light,\n markdown = true,\n small,\n success,\n tag,\n tiny,\n underline,\n upperCase,\n warning,\n wide,\n ...others\n}) =>\n React.createElement(\n Primitive,\n {\n ...others,\n role: others.role || 'text',\n tag: tag || (headline ? `h${level}` : 'span'),\n className: styles(\n style.text,\n bold && style.bold,\n capitalize && style.capitalize,\n color({ accent, accentDark, accentLight, dark, error, info, light, success, warning }),\n headline\n ? style[`headline-${level}`]\n : action\n ? style.action\n : small\n ? style.small\n : tiny\n ? style.tiny\n : style.paragraph,\n underline && style.underline,\n upperCase && style.upperCase,\n wide && style.wide,\n others.className,\n ),\n },\n markdown ? parseMarkdown(children) : children,\n );\n\nText.displayName = 'Primitive:Text';\n\nText.propTypes = {\n accent: PropTypes.bool,\n accentLight: PropTypes.bool,\n accentDark: PropTypes.bool,\n action: PropTypes.bool,\n bold: PropTypes.bool,\n capitalize: PropTypes.bool,\n children: PropTypes.oneOfType([PropTypes.string, PropTypes.number, PropTypes.array]),\n dark: PropTypes.bool,\n error: PropTypes.bool,\n headline: PropTypes.bool,\n info: PropTypes.bool,\n level: PropTypes.number,\n light: PropTypes.bool,\n markdown: PropTypes.bool,\n small: PropTypes.bool,\n success: PropTypes.bool,\n tag: PropTypes.string,\n tiny: PropTypes.bool,\n underline: PropTypes.bool,\n upperCase: PropTypes.bool,\n warning: PropTypes.bool,\n wide: PropTypes.bool,\n};\n\nexport { Text };\n"],"mappings":"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"}
@@ -13,10 +13,6 @@
13
13
  -moz-osx-font-smoothing: grayscale;
14
14
  }
15
15
 
16
- .accent {
17
- color: var(--mirai-ui-accent);
18
- }
19
-
20
16
  .action {
21
17
  font-size: var(--mirai-ui-font-size-action);
22
18
  line-height: var(--mirai-ui-line-height-action);
@@ -35,10 +31,6 @@
35
31
  text-transform: uppercase;
36
32
  }
37
33
 
38
- .error {
39
- color: var(--mirai-ui-error);
40
- }
41
-
42
34
  .headline-1 {
43
35
  font-size: var(--mirai-ui-font-size-headline-1);
44
36
  line-height: var(--mirai-ui-line-height-headline-1);
@@ -59,19 +51,11 @@
59
51
  line-height: var(--mirai-ui-line-height-paragraph);
60
52
  }
61
53
 
62
- .lighten {
63
- color: var(--mirai-ui-content-light);
64
- }
65
-
66
54
  .small {
67
55
  font-size: var(--mirai-ui-font-size-small);
68
56
  line-height: var(--mirai-ui-line-height-small);
69
57
  }
70
58
 
71
- .success {
72
- color: var(--mirai-ui-success);
73
- }
74
-
75
59
  .tiny {
76
60
  font-size: var(--mirai-ui-font-size-tiny);
77
61
  line-height: var(--mirai-ui-line-height-tiny);
@@ -85,10 +69,39 @@
85
69
  text-transform: uppercase;
86
70
  }
87
71
 
88
- .warning {
89
- color: var(--mirai-ui-warning);
90
- }
91
-
92
72
  .wide {
93
73
  width: 100%;
94
74
  }
75
+
76
+ /* color */
77
+ .accent {
78
+ color: var(--mirai-ui-accent);
79
+ }
80
+
81
+ .accentDark {
82
+ color: var(--mirai-ui-accent-dark);
83
+ }
84
+
85
+ .accentLight {
86
+ color: var(--mirai-ui-accent-light);
87
+ }
88
+
89
+ .error {
90
+ color: var(--mirai-ui-error);
91
+ }
92
+
93
+ .info {
94
+ color: var(--mirai-ui-info);
95
+ }
96
+
97
+ .light {
98
+ color: var(--mirai-ui-content-light);
99
+ }
100
+
101
+ .success {
102
+ color: var(--mirai-ui-success);
103
+ }
104
+
105
+ .warning {
106
+ color: var(--mirai-ui-warning);
107
+ }
@@ -26,15 +26,19 @@ exports.Story = Story;
26
26
  Story.storyName = 'Text';
27
27
  Story.args = {
28
28
  accent: false,
29
+ accentDark: false,
30
+ accentLight: false,
29
31
  action: false,
30
32
  bold: false,
31
33
  capitalize: false,
32
34
  children: 'children',
33
35
  childrenMarkdown: '<Text> is **capable** of _interpreting_ and *representing* [markdown](https://www.markdownguide.org/) ~~markup~~ {language}.',
36
+ dark: false,
34
37
  error: false,
35
38
  headline: false,
39
+ info: false,
36
40
  level: 3,
37
- lighten: false,
41
+ light: false,
38
42
  small: false,
39
43
  success: false,
40
44
  tag: 'span',
@@ -1 +1 @@
1
- {"version":3,"file":"Text.stories.js","names":["title","Story","childrenMarkdown","props","storyName","args","accent","action","bold","capitalize","children","error","headline","level","lighten","small","success","tag","tiny","underline","upperCase","warning","wide","testId","style","argTypes"],"sources":["../../../src/primitives/Text/Text.stories.jsx"],"sourcesContent":["import React from 'react';\n\nimport { Text } from './Text';\n\nexport default { title: 'Primitives' };\n\nexport const Story = ({ childrenMarkdown, ...props }) => (\n <>\n <Text {...props} />\n <Text {...props} children={childrenMarkdown} />\n </>\n);\n\nStory.storyName = 'Text';\n\nStory.args = {\n accent: false,\n action: false,\n bold: false,\n capitalize: false,\n children: 'children',\n childrenMarkdown:\n '<Text> is **capable** of _interpreting_ and *representing* [markdown](https://www.markdownguide.org/) ~~markup~~ {language}.',\n error: false,\n headline: false,\n level: 3,\n lighten: false,\n small: false,\n success: false,\n tag: 'span',\n tiny: false,\n underline: false,\n upperCase: false,\n warning: false,\n wide: false,\n // inherited properties\n testId: 'test-story',\n style: {},\n};\n\nStory.argTypes = {};\n"],"mappings":";;;;;;AAAA;AAEA;AAA8B;AAAA;AAAA;AAAA;AAAA;AAAA,eAEf;EAAEA,KAAK,EAAE;AAAa,CAAC;AAAA;AAE/B,IAAMC,KAAK,GAAG,SAARA,KAAK;EAAA,IAAMC,gBAAgB,QAAhBA,gBAAgB;IAAKC,KAAK;EAAA,oBAChD,yEACE,6BAAC,UAAI,EAAKA,KAAK,CAAI,eACnB,6BAAC,UAAI,eAAKA,KAAK;IAAE,QAAQ,EAAED;EAAiB,GAAG,CAC9C;AAAA,CACJ;AAAC;AAEFD,KAAK,CAACG,SAAS,GAAG,MAAM;AAExBH,KAAK,CAACI,IAAI,GAAG;EACXC,MAAM,EAAE,KAAK;EACbC,MAAM,EAAE,KAAK;EACbC,IAAI,EAAE,KAAK;EACXC,UAAU,EAAE,KAAK;EACjBC,QAAQ,EAAE,UAAU;EACpBR,gBAAgB,EACd,8HAA8H;EAChIS,KAAK,EAAE,KAAK;EACZC,QAAQ,EAAE,KAAK;EACfC,KAAK,EAAE,CAAC;EACRC,OAAO,EAAE,KAAK;EACdC,KAAK,EAAE,KAAK;EACZC,OAAO,EAAE,KAAK;EACdC,GAAG,EAAE,MAAM;EACXC,IAAI,EAAE,KAAK;EACXC,SAAS,EAAE,KAAK;EAChBC,SAAS,EAAE,KAAK;EAChBC,OAAO,EAAE,KAAK;EACdC,IAAI,EAAE,KAAK;EACX;EACAC,MAAM,EAAE,YAAY;EACpBC,KAAK,EAAE,CAAC;AACV,CAAC;AAEDvB,KAAK,CAACwB,QAAQ,GAAG,CAAC,CAAC"}
1
+ {"version":3,"file":"Text.stories.js","names":["title","Story","childrenMarkdown","props","storyName","args","accent","accentDark","accentLight","action","bold","capitalize","children","dark","error","headline","info","level","light","small","success","tag","tiny","underline","upperCase","warning","wide","testId","style","argTypes"],"sources":["../../../src/primitives/Text/Text.stories.jsx"],"sourcesContent":["import React from 'react';\n\nimport { Text } from './Text';\n\nexport default { title: 'Primitives' };\n\nexport const Story = ({ childrenMarkdown, ...props }) => (\n <>\n <Text {...props} />\n <Text {...props} children={childrenMarkdown} />\n </>\n);\n\nStory.storyName = 'Text';\n\nStory.args = {\n accent: false,\n accentDark: false,\n accentLight: false,\n action: false,\n bold: false,\n capitalize: false,\n children: 'children',\n childrenMarkdown:\n '<Text> is **capable** of _interpreting_ and *representing* [markdown](https://www.markdownguide.org/) ~~markup~~ {language}.',\n dark: false,\n error: false,\n headline: false,\n info: false,\n level: 3,\n light: false,\n small: false,\n success: false,\n tag: 'span',\n tiny: false,\n underline: false,\n upperCase: false,\n warning: false,\n wide: false,\n // inherited properties\n testId: 'test-story',\n style: {},\n};\n\nStory.argTypes = {};\n"],"mappings":";;;;;;AAAA;AAEA;AAA8B;AAAA;AAAA;AAAA;AAAA;AAAA,eAEf;EAAEA,KAAK,EAAE;AAAa,CAAC;AAAA;AAE/B,IAAMC,KAAK,GAAG,SAARA,KAAK;EAAA,IAAMC,gBAAgB,QAAhBA,gBAAgB;IAAKC,KAAK;EAAA,oBAChD,yEACE,6BAAC,UAAI,EAAKA,KAAK,CAAI,eACnB,6BAAC,UAAI,eAAKA,KAAK;IAAE,QAAQ,EAAED;EAAiB,GAAG,CAC9C;AAAA,CACJ;AAAC;AAEFD,KAAK,CAACG,SAAS,GAAG,MAAM;AAExBH,KAAK,CAACI,IAAI,GAAG;EACXC,MAAM,EAAE,KAAK;EACbC,UAAU,EAAE,KAAK;EACjBC,WAAW,EAAE,KAAK;EAClBC,MAAM,EAAE,KAAK;EACbC,IAAI,EAAE,KAAK;EACXC,UAAU,EAAE,KAAK;EACjBC,QAAQ,EAAE,UAAU;EACpBV,gBAAgB,EACd,8HAA8H;EAChIW,IAAI,EAAE,KAAK;EACXC,KAAK,EAAE,KAAK;EACZC,QAAQ,EAAE,KAAK;EACfC,IAAI,EAAE,KAAK;EACXC,KAAK,EAAE,CAAC;EACRC,KAAK,EAAE,KAAK;EACZC,KAAK,EAAE,KAAK;EACZC,OAAO,EAAE,KAAK;EACdC,GAAG,EAAE,MAAM;EACXC,IAAI,EAAE,KAAK;EACXC,SAAS,EAAE,KAAK;EAChBC,SAAS,EAAE,KAAK;EAChBC,OAAO,EAAE,KAAK;EACdC,IAAI,EAAE,KAAK;EACX;EACAC,MAAM,EAAE,YAAY;EACpBC,KAAK,EAAE,CAAC;AACV,CAAC;AAED3B,KAAK,CAAC4B,QAAQ,GAAG,CAAC,CAAC"}