@uni-design-system/uni-core 0.0.5 → 0.0.8

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 (52) hide show
  1. package/README.md +3 -1
  2. package/dist/cjs/core/color/color.types.d.ts +1 -0
  3. package/dist/cjs/core/container/index.d.ts +1 -0
  4. package/dist/cjs/core/container/index.js +1 -0
  5. package/dist/cjs/core/container/index.js.map +1 -1
  6. package/dist/cjs/core/theme/index.d.ts +1 -0
  7. package/dist/cjs/core/theme/index.js +1 -0
  8. package/dist/cjs/core/theme/index.js.map +1 -1
  9. package/dist/cjs/core/theme/theme.model.d.ts +2 -0
  10. package/dist/cjs/core/theme/themes/base.theme.d.ts +2 -0
  11. package/dist/cjs/core/theme/themes/base.theme.js +97 -0
  12. package/dist/cjs/core/theme/themes/base.theme.js.map +1 -0
  13. package/dist/cjs/core/theme/themes/dark.theme.js +2 -5
  14. package/dist/cjs/core/theme/themes/dark.theme.js.map +1 -1
  15. package/dist/cjs/core/theme/themes/light.theme.js +2 -11
  16. package/dist/cjs/core/theme/themes/light.theme.js.map +1 -1
  17. package/dist/cjs/core/typography/index.d.ts +2 -0
  18. package/dist/cjs/core/typography/index.js +2 -0
  19. package/dist/cjs/core/typography/index.js.map +1 -1
  20. package/dist/cjs/core/typography/text.model.d.ts +14 -0
  21. package/dist/cjs/core/typography/text.model.js +3 -0
  22. package/dist/cjs/core/typography/text.model.js.map +1 -0
  23. package/dist/cjs/core/typography/typography.records.d.ts +2 -0
  24. package/dist/cjs/core/typography/typography.records.js +16 -0
  25. package/dist/cjs/core/typography/typography.records.js.map +1 -0
  26. package/dist/cjs/core/typography/typography.types.d.ts +4 -2
  27. package/dist/esm/core/color/color.types.d.ts +1 -0
  28. package/dist/esm/core/container/index.d.ts +1 -0
  29. package/dist/esm/core/container/index.js +1 -0
  30. package/dist/esm/core/container/index.js.map +1 -1
  31. package/dist/esm/core/theme/index.d.ts +1 -0
  32. package/dist/esm/core/theme/index.js +1 -0
  33. package/dist/esm/core/theme/index.js.map +1 -1
  34. package/dist/esm/core/theme/theme.model.d.ts +2 -0
  35. package/dist/esm/core/theme/themes/base.theme.d.ts +2 -0
  36. package/dist/esm/core/theme/themes/base.theme.js +94 -0
  37. package/dist/esm/core/theme/themes/base.theme.js.map +1 -0
  38. package/dist/esm/core/theme/themes/dark.theme.js +2 -5
  39. package/dist/esm/core/theme/themes/dark.theme.js.map +1 -1
  40. package/dist/esm/core/theme/themes/light.theme.js +2 -11
  41. package/dist/esm/core/theme/themes/light.theme.js.map +1 -1
  42. package/dist/esm/core/typography/index.d.ts +2 -0
  43. package/dist/esm/core/typography/index.js +2 -0
  44. package/dist/esm/core/typography/index.js.map +1 -1
  45. package/dist/esm/core/typography/text.model.d.ts +14 -0
  46. package/dist/esm/core/typography/text.model.js +2 -0
  47. package/dist/esm/core/typography/text.model.js.map +1 -0
  48. package/dist/esm/core/typography/typography.records.d.ts +2 -0
  49. package/dist/esm/core/typography/typography.records.js +13 -0
  50. package/dist/esm/core/typography/typography.records.js.map +1 -0
  51. package/dist/esm/core/typography/typography.types.d.ts +4 -2
  52. package/package.json +3 -2
package/README.md CHANGED
@@ -1,2 +1,4 @@
1
1
  # UNI Design System
2
- Core package for building components.
2
+
3
+ Uni's Core package is a library of types and models for building components in various frameworks.
4
+
@@ -9,4 +9,5 @@ export declare type utilColorRoles = 'warn' | 'alert' | 'success' | 'info';
9
9
  export declare type colorRoles = 'primary' | 'secondary' | 'tertiary' | 'inverse' | 'ghost';
10
10
  export declare const roleHues: Record<colorRoles, Range>;
11
11
  export declare const utilHues: Record<utilColorRoles, Range>;
12
+ export declare type ColorModes = 'base' | 'hover' | 'active' | 'disabled';
12
13
  export declare type ColorToken = 'background' | 'background-active' | 'background-brand' | 'background-hover' | 'background-inverse' | 'background-inverse-hover' | 'background-screen' | 'background-selected' | 'background-selected-hover' | 'border-disabled-01' | 'border-disabled-02' | 'border-disabled-03' | 'border-interactive' | 'border-inverse' | 'border-strong-01' | 'border-strong-02' | 'border-strong-03' | 'border-subtle-00' | 'border-subtle-01' | 'border-subtle-02' | 'border-subtle-03' | 'border-subtle-selected-01' | 'border-subtle-selected-02' | 'border-subtle-selected-03' | 'brand-primary' | 'button-primary' | 'button-primary-active' | 'button-primary-hover' | 'button-secondary' | 'button-secondary-active' | 'button-secondary-hover' | 'button-tertiary' | 'button-tertiary-active' | 'button-tertiary-hover' | 'button-danger-primary' | 'button-danger-secondary' | 'button-danger-active' | 'button-danger-hover' | 'button-disabled' | 'button-separator' | 'field-01' | 'field-02' | 'field-03' | 'field-disabled-01' | 'field-disabled-02' | 'field-disabled-03' | 'field-hover-01' | 'field-hover-02' | 'field-hover-03' | 'focus' | 'focus-inverse' | 'focus-inset' | 'highlight' | 'icon-primary' | 'icon-secondary' | 'icon-tertiary' | 'icon-inverse' | 'icon-on-color' | 'icon-on-color-disabled' | 'icon-disabled' | 'icon-subtle' | 'interactive' | 'layer-01' | 'layer-02' | 'layer-03' | 'layer-accent-01' | 'layer-accent-02' | 'layer-accent-03' | 'layer-accent-active-01' | 'layer-accent-active-02' | 'layer-accent-active-03' | 'layer-accent-hover-01' | 'layer-accent-hover-02' | 'layer-accent-hover-03' | 'layer-active-01' | 'layer-active-02' | 'layer-active-03' | 'layer-disabled-01' | 'layer-disabled-02' | 'layer-disabled-03' | 'layer-hover-01' | 'layer-hover-02' | 'layer-hover-03' | 'layer-selected-01' | 'layer-selected-02' | 'layer-selected-03' | 'layer-selected-hover-01' | 'layer-selected-hover-02' | 'layer-selected-hover-03' | 'layer-selected-disabled' | 'layer-selected-inverse' | 'link-primary' | 'link-primary-hover' | 'link-secondary' | 'link-inverse' | 'link-visited' | 'navigation-background' | 'navigation-badge' | 'navigation-border' | 'overlay' | 'screen-background' | 'skeleton-element' | 'skeleton-background' | 'status-online' | 'status-offline' | 'status-busy' | 'support-info' | 'support-warning' | 'support-success' | 'support-error' | 'support-info-inverse' | 'support-warning-inverse' | 'support-success-inverse' | 'support-error-inverse' | 'text-brand' | 'text-primary' | 'text-secondary' | 'text-disabled' | 'text-error' | 'text-ghost' | 'text-helper' | 'text-highlight' | 'text-link' | 'text-inverse' | 'text-on-color' | 'text-placeholder' | 'text-on-color-disabled' | 'text-warning' | 'toggle-off' | 'transparent' | 'shadowColor';
@@ -1 +1,2 @@
1
1
  export * from './container.model';
2
+ export * from './container.types';
@@ -15,4 +15,5 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
15
15
  };
16
16
  Object.defineProperty(exports, "__esModule", { value: true });
17
17
  __exportStar(require("./container.model"), exports);
18
+ __exportStar(require("./container.types"), exports);
18
19
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/core/container/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAAA,oDAAkC"}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/core/container/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAAA,oDAAkC;AAClC,oDAAkC"}
@@ -1,5 +1,6 @@
1
1
  export * from './theme.model';
2
2
  export * from './theme.records';
3
3
  export * from './theme.types';
4
+ export * from './themes/base.theme';
4
5
  export * from './themes/dark.theme';
5
6
  export * from './themes/light.theme';
@@ -17,6 +17,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
17
17
  __exportStar(require("./theme.model"), exports);
18
18
  __exportStar(require("./theme.records"), exports);
19
19
  __exportStar(require("./theme.types"), exports);
20
+ __exportStar(require("./themes/base.theme"), exports);
20
21
  __exportStar(require("./themes/dark.theme"), exports);
21
22
  __exportStar(require("./themes/light.theme"), exports);
22
23
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/core/theme/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAAA,gDAA8B;AAC9B,kDAAgC;AAChC,gDAA8B;AAC9B,sDAAoC;AACpC,uDAAqC"}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/core/theme/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAAA,gDAA8B;AAC9B,kDAAgC;AAChC,gDAA8B;AAC9B,sDAAoC;AACpC,sDAAoC;AACpC,uDAAqC"}
@@ -1,3 +1,4 @@
1
+ import { TextRole, TextStyle } from '../typography';
1
2
  export interface ThemeProps {
2
3
  themeId?: string;
3
4
  themes?: Record<string, Theme>;
@@ -7,4 +8,5 @@ export interface Theme {
7
8
  name: string;
8
9
  id: string;
9
10
  colors: Record<string, string>;
11
+ typography: Record<TextRole, TextStyle>;
10
12
  }
@@ -0,0 +1,2 @@
1
+ import { Theme } from '../theme.model';
2
+ export declare const BaseTheme: Theme;
@@ -0,0 +1,97 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.BaseTheme = void 0;
4
+ exports.BaseTheme = {
5
+ id: 'BaseTheme',
6
+ name: 'Base Theme',
7
+ colors: {
8
+ primary: '#35A7FF',
9
+ secondary: '#38618C',
10
+ error: '#FFE74C',
11
+ warn: '#FF5964',
12
+ background: '#FFFFFF'
13
+ },
14
+ typography: {
15
+ 'headline-1': {
16
+ fontSize: 96,
17
+ fontWeight: 'light',
18
+ letterSpacing: -1.5
19
+ },
20
+ 'headline-2': {
21
+ fontSize: 60,
22
+ fontWeight: 'light',
23
+ letterSpacing: -0.1
24
+ },
25
+ 'headline-3': {
26
+ fontSize: 48,
27
+ },
28
+ 'headline-4': {
29
+ fontSize: 34,
30
+ letterSpacing: 0.25
31
+ },
32
+ 'headline-5': {
33
+ fontSize: 24
34
+ },
35
+ 'headline-6': {
36
+ fontSize: 20,
37
+ fontWeight: 'medium',
38
+ letterSpacing: 0.15
39
+ },
40
+ 'body-1-long': {
41
+ fontSize: 16,
42
+ lineHeight: 22
43
+ },
44
+ 'body-1-short': {
45
+ fontSize: 16,
46
+ lineHeight: 24
47
+ },
48
+ 'body-2-long': {
49
+ fontSize: 14,
50
+ lineHeight: 18
51
+ },
52
+ 'body-2-short': {
53
+ fontSize: 14,
54
+ lineHeight: 20
55
+ },
56
+ title: {
57
+ fontSize: 48
58
+ },
59
+ 'subtitle-1': {
60
+ fontSize: 16,
61
+ letterSpacing: 0.15
62
+ },
63
+ 'subtitle-2': {
64
+ fontSize: 14,
65
+ fontWeight: 'medium',
66
+ letterSpacing: 0.1
67
+ },
68
+ label: {
69
+ fontSize: 14
70
+ },
71
+ button: {
72
+ fontSize: 14,
73
+ fontWeight: 'medium',
74
+ textTransform: 'uppercase'
75
+ },
76
+ caption: {
77
+ fontSize: 12,
78
+ letterSpacing: 0.4
79
+ },
80
+ overline: {
81
+ fontSize: 10,
82
+ letterSpacing: 1.5,
83
+ textTransform: 'uppercase'
84
+ },
85
+ paragraph: {
86
+ fontSize: 16
87
+ },
88
+ quote: {
89
+ fontSize: 16
90
+ },
91
+ note: {
92
+ fontSize: 14,
93
+ fontStyle: 'italic'
94
+ }
95
+ }
96
+ };
97
+ //# sourceMappingURL=base.theme.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"base.theme.js","sourceRoot":"","sources":["../../../../../src/core/theme/themes/base.theme.ts"],"names":[],"mappings":";;;AAEa,QAAA,SAAS,GAAU;IAC9B,EAAE,EAAE,WAAW;IACf,IAAI,EAAE,YAAY;IAClB,MAAM,EAAE;QACN,OAAO,EAAE,SAAS;QAClB,SAAS,EAAE,SAAS;QACpB,KAAK,EAAE,SAAS;QAChB,IAAI,EAAE,SAAS;QACf,UAAU,EAAE,SAAS;KACtB;IACD,UAAU,EAAE;QACV,YAAY,EAAE;YACZ,QAAQ,EAAE,EAAE;YACZ,UAAU,EAAE,OAAO;YACnB,aAAa,EAAE,CAAC,GAAG;SACpB;QACD,YAAY,EAAE;YACZ,QAAQ,EAAE,EAAE;YACZ,UAAU,EAAE,OAAO;YACnB,aAAa,EAAE,CAAC,GAAG;SACpB;QACD,YAAY,EAAE;YACZ,QAAQ,EAAE,EAAE;SACb;QACD,YAAY,EAAE;YACZ,QAAQ,EAAE,EAAE;YACZ,aAAa,EAAE,IAAI;SACpB;QACD,YAAY,EAAE;YACZ,QAAQ,EAAE,EAAE;SACb;QACD,YAAY,EAAE;YACZ,QAAQ,EAAE,EAAE;YACZ,UAAU,EAAE,QAAQ;YACpB,aAAa,EAAE,IAAI;SACpB;QACD,aAAa,EAAE;YACb,QAAQ,EAAE,EAAE;YACZ,UAAU,EAAE,EAAE;SACf;QACD,cAAc,EAAE;YACd,QAAQ,EAAE,EAAE;YACZ,UAAU,EAAE,EAAE;SACf;QACD,aAAa,EAAE;YACb,QAAQ,EAAE,EAAE;YACZ,UAAU,EAAE,EAAE;SACf;QACD,cAAc,EAAE;YACd,QAAQ,EAAE,EAAE;YACZ,UAAU,EAAE,EAAE;SACf;QACD,KAAK,EAAE;YACL,QAAQ,EAAE,EAAE;SACb;QACD,YAAY,EAAE;YACZ,QAAQ,EAAE,EAAE;YACZ,aAAa,EAAE,IAAI;SACpB;QACD,YAAY,EAAE;YACZ,QAAQ,EAAE,EAAE;YACZ,UAAU,EAAE,QAAQ;YACpB,aAAa,EAAE,GAAG;SACnB;QACD,KAAK,EAAE;YACL,QAAQ,EAAE,EAAE;SACb;QACD,MAAM,EAAE;YACN,QAAQ,EAAE,EAAE;YACZ,UAAU,EAAE,QAAQ;YACpB,aAAa,EAAE,WAAW;SAC3B;QACD,OAAO,EAAE;YACP,QAAQ,EAAE,EAAE;YACZ,aAAa,EAAE,GAAG;SACnB;QACD,QAAQ,EAAE;YACR,QAAQ,EAAE,EAAE;YACZ,aAAa,EAAE,GAAG;YAClB,aAAa,EAAE,WAAW;SAC3B;QACD,SAAS,EAAE;YACT,QAAQ,EAAE,EAAE;SACb;QACD,KAAK,EAAE;YACL,QAAQ,EAAE,EAAE;SACb;QACD,IAAI,EAAE;YACJ,QAAQ,EAAE,EAAE;YACZ,SAAS,EAAE,QAAQ;SACpB;KACF;CACF,CAAA"}
@@ -1,9 +1,6 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
3
  exports.DarkTheme = void 0;
4
- exports.DarkTheme = {
5
- id: 'DarkTheme',
6
- name: 'Dark Theme',
7
- colors: {}
8
- };
4
+ const base_theme_1 = require("./base.theme");
5
+ exports.DarkTheme = Object.assign(Object.assign({}, base_theme_1.BaseTheme), { id: 'DarkTheme', name: 'Dark Theme', colors: Object.assign(Object.assign({}, base_theme_1.BaseTheme.colors), { background: '#000000' }) });
9
6
  //# sourceMappingURL=dark.theme.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"dark.theme.js","sourceRoot":"","sources":["../../../../../src/core/theme/themes/dark.theme.ts"],"names":[],"mappings":";;;AAEa,QAAA,SAAS,GAAU;IAC9B,EAAE,EAAE,WAAW;IACf,IAAI,EAAE,YAAY;IAClB,MAAM,EAAE,EAEP;CACF,CAAA"}
1
+ {"version":3,"file":"dark.theme.js","sourceRoot":"","sources":["../../../../../src/core/theme/themes/dark.theme.ts"],"names":[],"mappings":";;;AACA,6CAAyC;AAE5B,QAAA,SAAS,mCACjB,sBAAS,KACZ,EAAE,EAAE,WAAW,EACf,IAAI,EAAE,YAAY,EAClB,MAAM,kCACD,sBAAS,CAAC,MAAM,KACnB,UAAU,EAAE,SAAS,OAExB"}
@@ -1,15 +1,6 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
3
  exports.LightTheme = void 0;
4
- exports.LightTheme = {
5
- id: 'LightTheme',
6
- name: 'Light Theme',
7
- colors: {
8
- primary: '#35A7FF',
9
- secondary: '#38618C',
10
- error: '#FFE74C',
11
- warn: '#FF5964',
12
- background: '#FFFFFF'
13
- }
14
- };
4
+ const base_theme_1 = require("./base.theme");
5
+ exports.LightTheme = Object.assign(Object.assign({}, base_theme_1.BaseTheme), { id: 'LightTheme', name: 'Light Theme' });
15
6
  //# sourceMappingURL=light.theme.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"light.theme.js","sourceRoot":"","sources":["../../../../../src/core/theme/themes/light.theme.ts"],"names":[],"mappings":";;;AAEa,QAAA,UAAU,GAAU;IAC/B,EAAE,EAAE,YAAY;IAChB,IAAI,EAAE,aAAa;IACnB,MAAM,EAAE;QACN,OAAO,EAAE,SAAS;QAClB,SAAS,EAAE,SAAS;QACpB,KAAK,EAAE,SAAS;QAChB,IAAI,EAAE,SAAS;QACf,UAAU,EAAE,SAAS;KACtB;CACF,CAAA"}
1
+ {"version":3,"file":"light.theme.js","sourceRoot":"","sources":["../../../../../src/core/theme/themes/light.theme.ts"],"names":[],"mappings":";;;AACA,6CAAyC;AAE5B,QAAA,UAAU,mCAClB,sBAAS,KACZ,EAAE,EAAE,YAAY,EAChB,IAAI,EAAE,aAAa,IACpB"}
@@ -1 +1,3 @@
1
1
  export * from './typography.types';
2
+ export * from './text.model';
3
+ export * from './typography.records';
@@ -15,4 +15,6 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
15
15
  };
16
16
  Object.defineProperty(exports, "__esModule", { value: true });
17
17
  __exportStar(require("./typography.types"), exports);
18
+ __exportStar(require("./text.model"), exports);
19
+ __exportStar(require("./typography.records"), exports);
18
20
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/core/typography/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAAA,qDAAmC"}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/core/typography/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAAA,qDAAmC;AACnC,+CAA4B;AAC5B,uDAAoC"}
@@ -0,0 +1,14 @@
1
+ import { FontWeight, TextDecoration, TextTransform } from './typography.types';
2
+ export interface TextStyle {
3
+ fontFamily?: string;
4
+ fontSize: number;
5
+ fontWeight?: FontWeight;
6
+ fontStyle?: 'italic';
7
+ textTransform?: TextTransform;
8
+ textDecoration?: TextDecoration;
9
+ letterSpacing?: number;
10
+ textIndent?: number;
11
+ lineHeight?: number;
12
+ wordSpacing?: number;
13
+ whiteSpace?: 'nowrap';
14
+ }
@@ -0,0 +1,3 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ //# sourceMappingURL=text.model.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"text.model.js","sourceRoot":"","sources":["../../../../src/core/typography/text.model.ts"],"names":[],"mappings":""}
@@ -0,0 +1,2 @@
1
+ import { FontWeight } from './typography.types';
2
+ export declare const FontWeightMap: Record<FontWeight, number>;
@@ -0,0 +1,16 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.FontWeightMap = void 0;
4
+ exports.FontWeightMap = {
5
+ thin: 100,
6
+ 'extra-light': 200,
7
+ light: 200,
8
+ normal: 400,
9
+ medium: 500,
10
+ 'semi-bold': 600,
11
+ bold: 700,
12
+ 'extra-bold': 800,
13
+ black: 900,
14
+ 'extra-black': 950
15
+ };
16
+ //# sourceMappingURL=typography.records.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"typography.records.js","sourceRoot":"","sources":["../../../../src/core/typography/typography.records.ts"],"names":[],"mappings":";;;AAEa,QAAA,aAAa,GAA+B;IACvD,IAAI,EAAE,GAAG;IACT,aAAa,EAAE,GAAG;IAClB,KAAK,EAAE,GAAG;IACV,MAAM,EAAE,GAAG;IACX,MAAM,EAAE,GAAG;IACX,WAAW,EAAE,GAAG;IAChB,IAAI,EAAE,GAAG;IACT,YAAY,EAAE,GAAG;IACjB,KAAK,EAAE,GAAG;IACV,aAAa,EAAE,GAAG;CACnB,CAAA"}
@@ -1,5 +1,7 @@
1
1
  export declare type classes = 'sanserif' | 'serif' | 'slab' | 'script' | 'display' | 'monospace';
2
2
  export declare type families = 'Open-Sans' | 'Times-New-Roman' | 'Noto-Serif-Display';
3
- export declare type styles = 'thin' | 'light' | 'regular' | 'medium' | 'bold' | 'semi-bold' | 'black';
3
+ export declare type FontWeight = 'thin' | 'extra-light' | 'light' | 'normal' | 'medium' | 'semi-bold' | 'bold' | 'extra-bold' | 'black' | 'extra-black' | number;
4
4
  export declare type placement = 'overline' | 'title' | 'underline' | 'body' | 'label' | 'note' | 'footer';
5
- export declare type alignment = 'left' | 'right' | 'center';
5
+ export declare type TextRole = 'headline-1' | 'headline-2' | 'headline-3' | 'headline-4' | 'headline-5' | 'headline-6' | 'body-1-long' | 'body-1-short' | 'body-2-long' | 'body-2-short' | 'title' | 'subtitle-1' | 'subtitle-2' | 'label' | 'button' | 'caption' | 'overline' | 'paragraph' | 'quote' | 'note';
6
+ export declare type TextDecoration = 'overline' | 'line-through' | 'underline' | 'overline-underline';
7
+ export declare type TextTransform = 'uppercase' | 'lowercase' | 'capitalize';
@@ -9,4 +9,5 @@ export declare type utilColorRoles = 'warn' | 'alert' | 'success' | 'info';
9
9
  export declare type colorRoles = 'primary' | 'secondary' | 'tertiary' | 'inverse' | 'ghost';
10
10
  export declare const roleHues: Record<colorRoles, Range>;
11
11
  export declare const utilHues: Record<utilColorRoles, Range>;
12
+ export declare type ColorModes = 'base' | 'hover' | 'active' | 'disabled';
12
13
  export declare type ColorToken = 'background' | 'background-active' | 'background-brand' | 'background-hover' | 'background-inverse' | 'background-inverse-hover' | 'background-screen' | 'background-selected' | 'background-selected-hover' | 'border-disabled-01' | 'border-disabled-02' | 'border-disabled-03' | 'border-interactive' | 'border-inverse' | 'border-strong-01' | 'border-strong-02' | 'border-strong-03' | 'border-subtle-00' | 'border-subtle-01' | 'border-subtle-02' | 'border-subtle-03' | 'border-subtle-selected-01' | 'border-subtle-selected-02' | 'border-subtle-selected-03' | 'brand-primary' | 'button-primary' | 'button-primary-active' | 'button-primary-hover' | 'button-secondary' | 'button-secondary-active' | 'button-secondary-hover' | 'button-tertiary' | 'button-tertiary-active' | 'button-tertiary-hover' | 'button-danger-primary' | 'button-danger-secondary' | 'button-danger-active' | 'button-danger-hover' | 'button-disabled' | 'button-separator' | 'field-01' | 'field-02' | 'field-03' | 'field-disabled-01' | 'field-disabled-02' | 'field-disabled-03' | 'field-hover-01' | 'field-hover-02' | 'field-hover-03' | 'focus' | 'focus-inverse' | 'focus-inset' | 'highlight' | 'icon-primary' | 'icon-secondary' | 'icon-tertiary' | 'icon-inverse' | 'icon-on-color' | 'icon-on-color-disabled' | 'icon-disabled' | 'icon-subtle' | 'interactive' | 'layer-01' | 'layer-02' | 'layer-03' | 'layer-accent-01' | 'layer-accent-02' | 'layer-accent-03' | 'layer-accent-active-01' | 'layer-accent-active-02' | 'layer-accent-active-03' | 'layer-accent-hover-01' | 'layer-accent-hover-02' | 'layer-accent-hover-03' | 'layer-active-01' | 'layer-active-02' | 'layer-active-03' | 'layer-disabled-01' | 'layer-disabled-02' | 'layer-disabled-03' | 'layer-hover-01' | 'layer-hover-02' | 'layer-hover-03' | 'layer-selected-01' | 'layer-selected-02' | 'layer-selected-03' | 'layer-selected-hover-01' | 'layer-selected-hover-02' | 'layer-selected-hover-03' | 'layer-selected-disabled' | 'layer-selected-inverse' | 'link-primary' | 'link-primary-hover' | 'link-secondary' | 'link-inverse' | 'link-visited' | 'navigation-background' | 'navigation-badge' | 'navigation-border' | 'overlay' | 'screen-background' | 'skeleton-element' | 'skeleton-background' | 'status-online' | 'status-offline' | 'status-busy' | 'support-info' | 'support-warning' | 'support-success' | 'support-error' | 'support-info-inverse' | 'support-warning-inverse' | 'support-success-inverse' | 'support-error-inverse' | 'text-brand' | 'text-primary' | 'text-secondary' | 'text-disabled' | 'text-error' | 'text-ghost' | 'text-helper' | 'text-highlight' | 'text-link' | 'text-inverse' | 'text-on-color' | 'text-placeholder' | 'text-on-color-disabled' | 'text-warning' | 'toggle-off' | 'transparent' | 'shadowColor';
@@ -1 +1,2 @@
1
1
  export * from './container.model';
2
+ export * from './container.types';
@@ -1,2 +1,3 @@
1
1
  export * from './container.model';
2
+ export * from './container.types';
2
3
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/core/container/index.ts"],"names":[],"mappings":"AAAA,cAAc,mBAAmB,CAAC"}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/core/container/index.ts"],"names":[],"mappings":"AAAA,cAAc,mBAAmB,CAAC;AAClC,cAAc,mBAAmB,CAAC"}
@@ -1,5 +1,6 @@
1
1
  export * from './theme.model';
2
2
  export * from './theme.records';
3
3
  export * from './theme.types';
4
+ export * from './themes/base.theme';
4
5
  export * from './themes/dark.theme';
5
6
  export * from './themes/light.theme';
@@ -1,6 +1,7 @@
1
1
  export * from './theme.model';
2
2
  export * from './theme.records';
3
3
  export * from './theme.types';
4
+ export * from './themes/base.theme';
4
5
  export * from './themes/dark.theme';
5
6
  export * from './themes/light.theme';
6
7
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/core/theme/index.ts"],"names":[],"mappings":"AAAA,cAAc,eAAe,CAAC;AAC9B,cAAc,iBAAiB,CAAC;AAChC,cAAc,eAAe,CAAC;AAC9B,cAAc,qBAAqB,CAAC;AACpC,cAAc,sBAAsB,CAAC"}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/core/theme/index.ts"],"names":[],"mappings":"AAAA,cAAc,eAAe,CAAC;AAC9B,cAAc,iBAAiB,CAAC;AAChC,cAAc,eAAe,CAAC;AAC9B,cAAc,qBAAqB,CAAC;AACpC,cAAc,qBAAqB,CAAC;AACpC,cAAc,sBAAsB,CAAC"}
@@ -1,3 +1,4 @@
1
+ import { TextRole, TextStyle } from '../typography';
1
2
  export interface ThemeProps {
2
3
  themeId?: string;
3
4
  themes?: Record<string, Theme>;
@@ -7,4 +8,5 @@ export interface Theme {
7
8
  name: string;
8
9
  id: string;
9
10
  colors: Record<string, string>;
11
+ typography: Record<TextRole, TextStyle>;
10
12
  }
@@ -0,0 +1,2 @@
1
+ import { Theme } from '../theme.model';
2
+ export declare const BaseTheme: Theme;
@@ -0,0 +1,94 @@
1
+ export const BaseTheme = {
2
+ id: 'BaseTheme',
3
+ name: 'Base Theme',
4
+ colors: {
5
+ primary: '#35A7FF',
6
+ secondary: '#38618C',
7
+ error: '#FFE74C',
8
+ warn: '#FF5964',
9
+ background: '#FFFFFF'
10
+ },
11
+ typography: {
12
+ 'headline-1': {
13
+ fontSize: 96,
14
+ fontWeight: 'light',
15
+ letterSpacing: -1.5
16
+ },
17
+ 'headline-2': {
18
+ fontSize: 60,
19
+ fontWeight: 'light',
20
+ letterSpacing: -0.1
21
+ },
22
+ 'headline-3': {
23
+ fontSize: 48,
24
+ },
25
+ 'headline-4': {
26
+ fontSize: 34,
27
+ letterSpacing: 0.25
28
+ },
29
+ 'headline-5': {
30
+ fontSize: 24
31
+ },
32
+ 'headline-6': {
33
+ fontSize: 20,
34
+ fontWeight: 'medium',
35
+ letterSpacing: 0.15
36
+ },
37
+ 'body-1-long': {
38
+ fontSize: 16,
39
+ lineHeight: 22
40
+ },
41
+ 'body-1-short': {
42
+ fontSize: 16,
43
+ lineHeight: 24
44
+ },
45
+ 'body-2-long': {
46
+ fontSize: 14,
47
+ lineHeight: 18
48
+ },
49
+ 'body-2-short': {
50
+ fontSize: 14,
51
+ lineHeight: 20
52
+ },
53
+ title: {
54
+ fontSize: 48
55
+ },
56
+ 'subtitle-1': {
57
+ fontSize: 16,
58
+ letterSpacing: 0.15
59
+ },
60
+ 'subtitle-2': {
61
+ fontSize: 14,
62
+ fontWeight: 'medium',
63
+ letterSpacing: 0.1
64
+ },
65
+ label: {
66
+ fontSize: 14
67
+ },
68
+ button: {
69
+ fontSize: 14,
70
+ fontWeight: 'medium',
71
+ textTransform: 'uppercase'
72
+ },
73
+ caption: {
74
+ fontSize: 12,
75
+ letterSpacing: 0.4
76
+ },
77
+ overline: {
78
+ fontSize: 10,
79
+ letterSpacing: 1.5,
80
+ textTransform: 'uppercase'
81
+ },
82
+ paragraph: {
83
+ fontSize: 16
84
+ },
85
+ quote: {
86
+ fontSize: 16
87
+ },
88
+ note: {
89
+ fontSize: 14,
90
+ fontStyle: 'italic'
91
+ }
92
+ }
93
+ };
94
+ //# sourceMappingURL=base.theme.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"base.theme.js","sourceRoot":"","sources":["../../../../../src/core/theme/themes/base.theme.ts"],"names":[],"mappings":"AAEA,MAAM,CAAC,MAAM,SAAS,GAAU;IAC9B,EAAE,EAAE,WAAW;IACf,IAAI,EAAE,YAAY;IAClB,MAAM,EAAE;QACN,OAAO,EAAE,SAAS;QAClB,SAAS,EAAE,SAAS;QACpB,KAAK,EAAE,SAAS;QAChB,IAAI,EAAE,SAAS;QACf,UAAU,EAAE,SAAS;KACtB;IACD,UAAU,EAAE;QACV,YAAY,EAAE;YACZ,QAAQ,EAAE,EAAE;YACZ,UAAU,EAAE,OAAO;YACnB,aAAa,EAAE,CAAC,GAAG;SACpB;QACD,YAAY,EAAE;YACZ,QAAQ,EAAE,EAAE;YACZ,UAAU,EAAE,OAAO;YACnB,aAAa,EAAE,CAAC,GAAG;SACpB;QACD,YAAY,EAAE;YACZ,QAAQ,EAAE,EAAE;SACb;QACD,YAAY,EAAE;YACZ,QAAQ,EAAE,EAAE;YACZ,aAAa,EAAE,IAAI;SACpB;QACD,YAAY,EAAE;YACZ,QAAQ,EAAE,EAAE;SACb;QACD,YAAY,EAAE;YACZ,QAAQ,EAAE,EAAE;YACZ,UAAU,EAAE,QAAQ;YACpB,aAAa,EAAE,IAAI;SACpB;QACD,aAAa,EAAE;YACb,QAAQ,EAAE,EAAE;YACZ,UAAU,EAAE,EAAE;SACf;QACD,cAAc,EAAE;YACd,QAAQ,EAAE,EAAE;YACZ,UAAU,EAAE,EAAE;SACf;QACD,aAAa,EAAE;YACb,QAAQ,EAAE,EAAE;YACZ,UAAU,EAAE,EAAE;SACf;QACD,cAAc,EAAE;YACd,QAAQ,EAAE,EAAE;YACZ,UAAU,EAAE,EAAE;SACf;QACD,KAAK,EAAE;YACL,QAAQ,EAAE,EAAE;SACb;QACD,YAAY,EAAE;YACZ,QAAQ,EAAE,EAAE;YACZ,aAAa,EAAE,IAAI;SACpB;QACD,YAAY,EAAE;YACZ,QAAQ,EAAE,EAAE;YACZ,UAAU,EAAE,QAAQ;YACpB,aAAa,EAAE,GAAG;SACnB;QACD,KAAK,EAAE;YACL,QAAQ,EAAE,EAAE;SACb;QACD,MAAM,EAAE;YACN,QAAQ,EAAE,EAAE;YACZ,UAAU,EAAE,QAAQ;YACpB,aAAa,EAAE,WAAW;SAC3B;QACD,OAAO,EAAE;YACP,QAAQ,EAAE,EAAE;YACZ,aAAa,EAAE,GAAG;SACnB;QACD,QAAQ,EAAE;YACR,QAAQ,EAAE,EAAE;YACZ,aAAa,EAAE,GAAG;YAClB,aAAa,EAAE,WAAW;SAC3B;QACD,SAAS,EAAE;YACT,QAAQ,EAAE,EAAE;SACb;QACD,KAAK,EAAE;YACL,QAAQ,EAAE,EAAE;SACb;QACD,IAAI,EAAE;YACJ,QAAQ,EAAE,EAAE;YACZ,SAAS,EAAE,QAAQ;SACpB;KACF;CACF,CAAA"}
@@ -1,6 +1,3 @@
1
- export const DarkTheme = {
2
- id: 'DarkTheme',
3
- name: 'Dark Theme',
4
- colors: {}
5
- };
1
+ import { BaseTheme } from './base.theme';
2
+ export const DarkTheme = Object.assign(Object.assign({}, BaseTheme), { id: 'DarkTheme', name: 'Dark Theme', colors: Object.assign(Object.assign({}, BaseTheme.colors), { background: '#000000' }) });
6
3
  //# sourceMappingURL=dark.theme.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"dark.theme.js","sourceRoot":"","sources":["../../../../../src/core/theme/themes/dark.theme.ts"],"names":[],"mappings":"AAEA,MAAM,CAAC,MAAM,SAAS,GAAU;IAC9B,EAAE,EAAE,WAAW;IACf,IAAI,EAAE,YAAY;IAClB,MAAM,EAAE,EAEP;CACF,CAAA"}
1
+ {"version":3,"file":"dark.theme.js","sourceRoot":"","sources":["../../../../../src/core/theme/themes/dark.theme.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAEzC,MAAM,CAAC,MAAM,SAAS,mCACjB,SAAS,KACZ,EAAE,EAAE,WAAW,EACf,IAAI,EAAE,YAAY,EAClB,MAAM,kCACD,SAAS,CAAC,MAAM,KACnB,UAAU,EAAE,SAAS,MAExB,CAAA"}
@@ -1,12 +1,3 @@
1
- export const LightTheme = {
2
- id: 'LightTheme',
3
- name: 'Light Theme',
4
- colors: {
5
- primary: '#35A7FF',
6
- secondary: '#38618C',
7
- error: '#FFE74C',
8
- warn: '#FF5964',
9
- background: '#FFFFFF'
10
- }
11
- };
1
+ import { BaseTheme } from './base.theme';
2
+ export const LightTheme = Object.assign(Object.assign({}, BaseTheme), { id: 'LightTheme', name: 'Light Theme' });
12
3
  //# sourceMappingURL=light.theme.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"light.theme.js","sourceRoot":"","sources":["../../../../../src/core/theme/themes/light.theme.ts"],"names":[],"mappings":"AAEA,MAAM,CAAC,MAAM,UAAU,GAAU;IAC/B,EAAE,EAAE,YAAY;IAChB,IAAI,EAAE,aAAa;IACnB,MAAM,EAAE;QACN,OAAO,EAAE,SAAS;QAClB,SAAS,EAAE,SAAS;QACpB,KAAK,EAAE,SAAS;QAChB,IAAI,EAAE,SAAS;QACf,UAAU,EAAE,SAAS;KACtB;CACF,CAAA"}
1
+ {"version":3,"file":"light.theme.js","sourceRoot":"","sources":["../../../../../src/core/theme/themes/light.theme.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAEzC,MAAM,CAAC,MAAM,UAAU,mCAClB,SAAS,KACZ,EAAE,EAAE,YAAY,EAChB,IAAI,EAAE,aAAa,GACpB,CAAA"}
@@ -1 +1,3 @@
1
1
  export * from './typography.types';
2
+ export * from './text.model';
3
+ export * from './typography.records';
@@ -1,2 +1,4 @@
1
1
  export * from './typography.types';
2
+ export * from './text.model';
3
+ export * from './typography.records';
2
4
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/core/typography/index.ts"],"names":[],"mappings":"AAAA,cAAc,oBAAoB,CAAC"}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/core/typography/index.ts"],"names":[],"mappings":"AAAA,cAAc,oBAAoB,CAAC;AACnC,cAAc,cAAc,CAAA;AAC5B,cAAc,sBAAsB,CAAA"}
@@ -0,0 +1,14 @@
1
+ import { FontWeight, TextDecoration, TextTransform } from './typography.types';
2
+ export interface TextStyle {
3
+ fontFamily?: string;
4
+ fontSize: number;
5
+ fontWeight?: FontWeight;
6
+ fontStyle?: 'italic';
7
+ textTransform?: TextTransform;
8
+ textDecoration?: TextDecoration;
9
+ letterSpacing?: number;
10
+ textIndent?: number;
11
+ lineHeight?: number;
12
+ wordSpacing?: number;
13
+ whiteSpace?: 'nowrap';
14
+ }
@@ -0,0 +1,2 @@
1
+ export {};
2
+ //# sourceMappingURL=text.model.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"text.model.js","sourceRoot":"","sources":["../../../../src/core/typography/text.model.ts"],"names":[],"mappings":""}
@@ -0,0 +1,2 @@
1
+ import { FontWeight } from './typography.types';
2
+ export declare const FontWeightMap: Record<FontWeight, number>;
@@ -0,0 +1,13 @@
1
+ export const FontWeightMap = {
2
+ thin: 100,
3
+ 'extra-light': 200,
4
+ light: 200,
5
+ normal: 400,
6
+ medium: 500,
7
+ 'semi-bold': 600,
8
+ bold: 700,
9
+ 'extra-bold': 800,
10
+ black: 900,
11
+ 'extra-black': 950
12
+ };
13
+ //# sourceMappingURL=typography.records.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"typography.records.js","sourceRoot":"","sources":["../../../../src/core/typography/typography.records.ts"],"names":[],"mappings":"AAEA,MAAM,CAAC,MAAM,aAAa,GAA+B;IACvD,IAAI,EAAE,GAAG;IACT,aAAa,EAAE,GAAG;IAClB,KAAK,EAAE,GAAG;IACV,MAAM,EAAE,GAAG;IACX,MAAM,EAAE,GAAG;IACX,WAAW,EAAE,GAAG;IAChB,IAAI,EAAE,GAAG;IACT,YAAY,EAAE,GAAG;IACjB,KAAK,EAAE,GAAG;IACV,aAAa,EAAE,GAAG;CACnB,CAAA"}
@@ -1,5 +1,7 @@
1
1
  export declare type classes = 'sanserif' | 'serif' | 'slab' | 'script' | 'display' | 'monospace';
2
2
  export declare type families = 'Open-Sans' | 'Times-New-Roman' | 'Noto-Serif-Display';
3
- export declare type styles = 'thin' | 'light' | 'regular' | 'medium' | 'bold' | 'semi-bold' | 'black';
3
+ export declare type FontWeight = 'thin' | 'extra-light' | 'light' | 'normal' | 'medium' | 'semi-bold' | 'bold' | 'extra-bold' | 'black' | 'extra-black' | number;
4
4
  export declare type placement = 'overline' | 'title' | 'underline' | 'body' | 'label' | 'note' | 'footer';
5
- export declare type alignment = 'left' | 'right' | 'center';
5
+ export declare type TextRole = 'headline-1' | 'headline-2' | 'headline-3' | 'headline-4' | 'headline-5' | 'headline-6' | 'body-1-long' | 'body-1-short' | 'body-2-long' | 'body-2-short' | 'title' | 'subtitle-1' | 'subtitle-2' | 'label' | 'button' | 'caption' | 'overline' | 'paragraph' | 'quote' | 'note';
6
+ export declare type TextDecoration = 'overline' | 'line-through' | 'underline' | 'overline-underline';
7
+ export declare type TextTransform = 'uppercase' | 'lowercase' | 'capitalize';
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@uni-design-system/uni-core",
3
3
  "description": "UNI Design System core dependencies.",
4
- "version": "0.0.5",
4
+ "version": "0.0.8",
5
5
  "repository": {
6
6
  "type": "git",
7
7
  "url": "git+https://github.com/uni-design-system/uni-core.git"
@@ -14,7 +14,8 @@
14
14
  "scripts": {
15
15
  "build": "rm -rf dist/ && yarn build:esm && yarn build:cjs",
16
16
  "build:esm": "tsc",
17
- "build:cjs": "tsc --module CommonJS --outDir dist/cjs"
17
+ "build:cjs": "tsc --module CommonJS --outDir dist/cjs",
18
+ "publish": "yarn build && npm publish"
18
19
  },
19
20
  "keywords": [
20
21
  "ui",