@moderneinc/neo-design 1.2.3 → 1.2.5

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.
@@ -4,27 +4,28 @@
4
4
  --neo-font-family-code: Jetbrains Mono;
5
5
  --neo-font-size-xxs: 10;
6
6
  --neo-font-size-xs: 12;
7
- --neo-font-weight-thin100: 100;
8
7
  --neo-font-size-sm: 14;
9
8
  --neo-font-size-default: 16;
10
- --neo-font-weight-light300: 300;
11
9
  --neo-font-size-h6: 16;
12
10
  --neo-font-size-caption: 13;
13
11
  --neo-font-size-code: 14;
14
- --neo-font-weight-regular400: 400;
15
12
  --neo-font-size-h5: 18;
16
- --neo-font-weight-medium500: 500;
17
13
  --neo-font-size-h4: 20;
18
14
  --neo-font-size-h3: 24;
19
- --neo-font-weight-semi-bold600: 600;
20
- --neo-font-weight-bold700: 700;
21
15
  --neo-font-size-h2: 28;
22
16
  --neo-font-size-h1: 36;
23
- --neo-font-weight-extra-bold800: 800;
24
- --neo-line-height-xs16: 16;
25
- --neo-line-height-s20: 20;
26
- --neo-line-height-m24: 24;
27
- --neo-line-height-l28: 28;
28
- --neo-line-height-xl32: 32;
17
+ --neo-font-weight-thin: 100;
18
+ --neo-font-weight-light: 300;
19
+ --neo-font-weight-regular: 400;
20
+ --neo-font-weight-medium: 500;
21
+ --neo-font-weight-semi-bold: 600;
22
+ --neo-font-weight-bold: 700;
23
+ --neo-font-weight-extra-bold: 800;
24
+ /* value in pixels */
25
+ --neo-line-height-xs: 16;
26
+ --neo-line-height-s: 20;
27
+ --neo-line-height-m: 24;
28
+ --neo-line-height-l: 28;
29
+ --neo-line-height-xl: 32;
29
30
  --neo-text-decoration-underline: underline;
30
31
  }
@@ -4,90 +4,90 @@
4
4
  * @generated
5
5
  */
6
6
 
7
- export const fontFamilyHeading = "Inter";
8
-
9
- export const fontFamilyBody = "Inter";
10
-
11
- export const fontFamilyCode = "Jetbrains Mono";
12
-
13
- export const fontSizeXxs = 10;
14
-
15
- export const fontSizeXs = 12;
16
-
17
- export const fontWeightThin100 = 100;
18
-
19
- export const fontSizeSm = 14;
20
-
21
- export const fontSizeDefault = 16;
22
-
23
- export const fontWeightLight300 = 300;
24
-
25
- export const fontSizeH6 = 16;
26
-
27
- export const fontSizeCaption = 13;
28
-
29
- export const fontSizeCode = 14;
30
-
31
- export const fontWeightRegular400 = 400;
32
-
33
- export const fontSizeH5 = 18;
34
-
35
- export const fontWeightMedium500 = 500;
36
-
37
- export const fontSizeH4 = 20;
38
-
39
- export const fontSizeH3 = 24;
40
-
41
- export const fontWeightSemiBold600 = 600;
42
-
43
- export const fontWeightBold700 = 700;
7
+ /**
8
+ * @typedef {{ heading: string, body: string, code: string }} FontFamily
9
+ */
44
10
 
45
- export const fontSizeH2 = 28;
11
+ /**
12
+ * @type {FontFamily}
13
+ */
14
+ export const fontFamily = {
15
+ "heading": "Inter",
16
+ "body": "Inter",
17
+ "code": "Jetbrains Mono"
18
+ };
46
19
 
47
- export const fontSizeH1 = 36;
20
+ /**
21
+ * @typedef {{ xxs: number, xs: number, sm: number, default: number, h6: number, caption: number, code: number, h5: number, h4: number, h3: number, h2: number, h1: number }} FontSize
22
+ */
48
23
 
49
- export const fontWeightExtraBold800 = 800;
24
+ /**
25
+ * @type {FontSize}
26
+ */
27
+ export const fontSize = {
28
+ "xxs": 10,
29
+ "xs": 12,
30
+ "sm": 14,
31
+ "default": 16,
32
+ "h6": 16,
33
+ "caption": 13,
34
+ "code": 14,
35
+ "h5": 18,
36
+ "h4": 20,
37
+ "h3": 24,
38
+ "h2": 28,
39
+ "h1": 36
40
+ };
50
41
 
51
- export const lineHeightXs16 = 16;
42
+ /**
43
+ * @typedef {{ thin: number, light: number, regular: number, medium: number, semiBold: number, bold: number, extraBold: number }} FontWeight
44
+ */
52
45
 
53
- export const lineHeightS20 = 20;
46
+ /**
47
+ * @type {FontWeight}
48
+ */
49
+ export const fontWeight = {
50
+ "thin": 100,
51
+ "light": 300,
52
+ "regular": 400,
53
+ "medium": 500,
54
+ "semiBold": 600,
55
+ "bold": 700,
56
+ "extraBold": 800
57
+ };
54
58
 
55
- export const lineHeightM24 = 24;
59
+ /**
60
+ * @typedef {{ xs: number, s: number, m: number, l: number, xl: number }} LineHeight
61
+ */
56
62
 
57
- export const lineHeightL28 = 28;
63
+ /**
64
+ * @type {LineHeight}
65
+ */
66
+ export const lineHeight = {
67
+ /** value in pixels */
68
+ "xs": 16,
69
+ "s": 20,
70
+ "m": 24,
71
+ "l": 28,
72
+ "xl": 32
73
+ };
58
74
 
59
- export const lineHeightXl32 = 32;
75
+ /**
76
+ * @typedef {{ underline: string }} TextDecoration
77
+ */
60
78
 
61
- export const textDecorationUnderline = "underline";
79
+ /**
80
+ * @type {TextDecoration}
81
+ */
82
+ export const textDecoration = {
83
+ "underline": "underline"
84
+ };
62
85
 
63
- // Default export with all tokens
86
+ // Default export with all color groups
64
87
  export default {
65
- 'fontFamilyHeading': fontFamilyHeading,
66
- 'fontFamilyBody': fontFamilyBody,
67
- 'fontFamilyCode': fontFamilyCode,
68
- 'fontSizeXxs': fontSizeXxs,
69
- 'fontSizeXs': fontSizeXs,
70
- 'fontWeightThin100': fontWeightThin100,
71
- 'fontSizeSm': fontSizeSm,
72
- 'fontSizeDefault': fontSizeDefault,
73
- 'fontWeightLight300': fontWeightLight300,
74
- 'fontSizeH6': fontSizeH6,
75
- 'fontSizeCaption': fontSizeCaption,
76
- 'fontSizeCode': fontSizeCode,
77
- 'fontWeightRegular400': fontWeightRegular400,
78
- 'fontSizeH5': fontSizeH5,
79
- 'fontWeightMedium500': fontWeightMedium500,
80
- 'fontSizeH4': fontSizeH4,
81
- 'fontSizeH3': fontSizeH3,
82
- 'fontWeightSemiBold600': fontWeightSemiBold600,
83
- 'fontWeightBold700': fontWeightBold700,
84
- 'fontSizeH2': fontSizeH2,
85
- 'fontSizeH1': fontSizeH1,
86
- 'fontWeightExtraBold800': fontWeightExtraBold800,
87
- 'lineHeightXs16': lineHeightXs16,
88
- 'lineHeightS20': lineHeightS20,
89
- 'lineHeightM24': lineHeightM24,
90
- 'lineHeightL28': lineHeightL28,
91
- 'lineHeightXl32': lineHeightXl32,
92
- 'textDecorationUnderline': textDecorationUnderline
93
- };
88
+ fontFamily,
89
+ fontSize,
90
+ fontWeight,
91
+ lineHeight,
92
+ textDecoration
93
+ };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@moderneinc/neo-design",
3
- "version": "1.2.3",
3
+ "version": "1.2.5",
4
4
  "type": "module",
5
5
  "description": "Design primitives and tokens for Moderne applications",
6
6
  "main": "dist/index.js",
@@ -27,7 +27,7 @@
27
27
  "format": "biome format --write src",
28
28
  "knip": "knip",
29
29
  "knip:production": "knip --production",
30
- "check:all": "npm run format && npm run lint:fix && npm run knip",
30
+ "check:all": "npm run format && npm run lint:fix && npm run knip && npm run test:run",
31
31
  "build-storybook": "storybook build",
32
32
  "dev-storybook": "storybook dev -p 6006",
33
33
  "storybook": "npm run dev-storybook"
@@ -50,9 +50,7 @@
50
50
  "@biomejs/biome": "2.2.4",
51
51
  "@rollup/plugin-json": "6.1.0",
52
52
  "@rollup/plugin-node-resolve": "16.0.1",
53
- "@semantic-release/changelog": "6.0.3",
54
53
  "@semantic-release/commit-analyzer": "13.0.1",
55
- "@semantic-release/git": "10.0.1",
56
54
  "@semantic-release/github": "11.0.6",
57
55
  "@semantic-release/npm": "12.0.2",
58
56
  "@semantic-release/release-notes-generator": "14.1.0",
package/dist/colors.json DELETED
@@ -1,104 +0,0 @@
1
- {
2
- "digitalBlue": {
3
- "50": "#f2f3ff",
4
- "100": "#dce0ff",
5
- "200": "#b6bfff",
6
- "300": "#8d99ff",
7
- "400": "#626eff",
8
- "500": "#2f42ff",
9
- "600": "#2637e6",
10
- "700": "#1e2ec2",
11
- "800": "#131e7a",
12
- "900": "#000855",
13
- "main": "#2f42ff"
14
- },
15
- "digitalGreen": {
16
- "50": "#f3fff5",
17
- "100": "#cfffd7",
18
- "200": "#acffb9",
19
- "300": "#88fe9b",
20
- "400": "#72e184",
21
- "500": "#5ec46f",
22
- "600": "#4ca75a",
23
- "700": "#3b8948",
24
- "800": "#2c6c36",
25
- "900": "#1e4f26",
26
- "main": "#5ec46f"
27
- },
28
- "gold": {
29
- "100": "#fbf1d2",
30
- "200": "#f7e3a5",
31
- "300": "#f4d479",
32
- "400": "#f0c64c",
33
- "500": "#ecb81f",
34
- "600": "#bd9319",
35
- "700": "#8e6e13",
36
- "800": "#5e4a0c",
37
- "900": "#2f2506",
38
- "main": "#ecb81f"
39
- },
40
- "grey": {
41
- "50": "#f9fafb",
42
- "100": "#f3f4f6",
43
- "200": "#e5e7eb",
44
- "300": "#d1d5db",
45
- "400": "#9ca3af",
46
- "500": "#6b7280",
47
- "600": "#4b5563",
48
- "700": "#374151",
49
- "800": "#1f2937",
50
- "900": "#111827",
51
- "main": "#6b7280"
52
- },
53
- "orange": {
54
- "50": "#fff8e5",
55
- "100": "#ffebb7",
56
- "200": "#ffde8a",
57
- "300": "#ffd15c",
58
- "400": "#ffc52e",
59
- "500": "#ffb800",
60
- "600": "#d69b00",
61
- "700": "#856000",
62
- "800": "#856000",
63
- "900": "#5c4200",
64
- "main": "#ffb800"
65
- },
66
- "red": {
67
- "50": "#ffedef",
68
- "100": "#ffc6cd",
69
- "200": "#ff9eaa",
70
- "300": "#fd7686",
71
- "400": "#ed4a5d",
72
- "500": "#cb3446",
73
- "600": "#a92232",
74
- "700": "#871421",
75
- "800": "#650914",
76
- "900": "#43020a",
77
- "main": "#cb3446"
78
- },
79
- "tealGreen": {
80
- "50": "#eefffa",
81
- "100": "#c9fff1",
82
- "200": "#a4ffe7",
83
- "300": "#7fffde",
84
- "400": "#54eec6",
85
- "500": "#3bcca6",
86
- "600": "#27aa88",
87
- "700": "#17886b",
88
- "800": "#0b664e",
89
- "900": "#034433",
90
- "main": "#3bcca6"
91
- },
92
- "violet": {
93
- "100": "#ebd5f1",
94
- "200": "#d6ace3",
95
- "300": "#c282d5",
96
- "400": "#ad59c7",
97
- "500": "#992fb9",
98
- "600": "#7a2694",
99
- "700": "#5c1c6f",
100
- "800": "#3d134a",
101
- "900": "#1f0925",
102
- "main": "#992fb9"
103
- }
104
- }
@@ -1,98 +0,0 @@
1
- {
2
- "activity": {
3
- "recipeRun": "#992fb9",
4
- "commitJob": "#2f42ff",
5
- "visualization": "#27aa88"
6
- },
7
- "border": {
8
- "primary": "#d1d5db",
9
- "input": "#9ca3af",
10
- "tabActive": "#2f42ff",
11
- "codeDashed": "#9ca3af",
12
- "card": "#d1d5db",
13
- "cardHeader": "#d1d5db"
14
- },
15
- "buttons": {
16
- "destructive": "#cb3446",
17
- "navigationActive": "#ffffff",
18
- "primaryPressed": "#131e7a",
19
- "primaryDefault": "#2f42ff",
20
- "primaryHover": "#1e2ec2",
21
- "primaryDisabled": "#b6bfff",
22
- "primaryFocus": "#2f42ff",
23
- "secondaryDefaultBorder": "#b6bfff",
24
- "secondaryHoverBackground": "#f2f3ff",
25
- "secondaryPressedBackground": "#dce0ff",
26
- "secondaryDisabled": "#626eff",
27
- "secondaryFocus": "#2f42ff",
28
- "tertiaryDefault": "#2f42ff",
29
- "tertiaryHover": "#1e2ec2",
30
- "tertiaryPressed": "#131e7a",
31
- "tertiaryFocus": "#2f42ff",
32
- "tertiaryDisabled": "#626eff"
33
- },
34
- "icons": {
35
- "default": "#1f2937",
36
- "active": "#2f42ff",
37
- "hover": "#131e7a",
38
- "hoverBackground": "#e5e7eb",
39
- "disabled": "#9ca3af",
40
- "placeholder": "#4b5563",
41
- "checkbox": "#4b5563"
42
- },
43
- "status": {
44
- "successDark": "#4ca75a",
45
- "warningDark": "#ffb800",
46
- "errorDark": "#cb3446",
47
- "successLight": "#f3fff5",
48
- "errorLight": "#ffedef",
49
- "warningLight": "#fff8e5"
50
- },
51
- "surfaces": {
52
- "black": "#000000",
53
- "white": "#ffffff",
54
- "page": "#f9fafb",
55
- "card": "#ffffff",
56
- "cardHeader": "#f3f4f6",
57
- "tabActive": "#f3f4f6",
58
- "listHover": "#f9fafb",
59
- "inputHover": "#f3f4f6",
60
- "tableDisabledRow": "#f3f4f6",
61
- "tableBackground": "#ffffff",
62
- "shadowNeutral": "#1f2937",
63
- "scrim": "#1f2937",
64
- "shadowPrimary": "#2f42ff",
65
- "tooltip": "#4b5563"
66
- },
67
- "typography": {
68
- "pageHeader": "#111827",
69
- "sectionHeader": "#374151",
70
- "body": "#1f2937",
71
- "buttonPrimary": "#f9fafb",
72
- "buttonSecondary": "#2f42ff",
73
- "buttonDisabled": "#9ca3af",
74
- "inputPlaceholder": "#6b7280",
75
- "inputDefault": "#1f2937",
76
- "codePrimary": "#1f2937",
77
- "codeSecondary": "#6b7280",
78
- "tabInactive": "#4b5563",
79
- "tabActive": "#626eff",
80
- "linkPrimary": "#2f42ff",
81
- "linkDisabled": "#b6bfff",
82
- "linkDefault": "#f9fafb",
83
- "error": "#cb3446",
84
- "success": "#4ca75a",
85
- "warning": "#1f2937",
86
- "tooltip": "#ffffff"
87
- },
88
- "data": {
89
- "green": "#4ca75a",
90
- "yellow": "#fdda04",
91
- "orange1": "#ffc008",
92
- "orange2": "#ff9800",
93
- "orange3": "#f9a91b",
94
- "red1": "#ff5c24",
95
- "red2": "#ed4134",
96
- "red3": "#cb3446"
97
- }
98
- }
@@ -1,30 +0,0 @@
1
- {
2
- "fontFamilyHeading": "Inter",
3
- "fontFamilyBody": "Inter",
4
- "fontFamilyCode": "Jetbrains Mono",
5
- "fontSizeXxs": 10,
6
- "fontSizeXs": 12,
7
- "fontWeightThin100": 100,
8
- "fontSizeSm": 14,
9
- "fontSizeDefault": 16,
10
- "fontWeightLight300": 300,
11
- "fontSizeH6": 16,
12
- "fontSizeCaption": 13,
13
- "fontSizeCode": 14,
14
- "fontWeightRegular400": 400,
15
- "fontSizeH5": 18,
16
- "fontWeightMedium500": 500,
17
- "fontSizeH4": 20,
18
- "fontSizeH3": 24,
19
- "fontWeightSemiBold600": 600,
20
- "fontWeightBold700": 700,
21
- "fontSizeH2": 28,
22
- "fontSizeH1": 36,
23
- "fontWeightExtraBold800": 800,
24
- "lineHeightXs16": 16,
25
- "lineHeightS20": 20,
26
- "lineHeightM24": 24,
27
- "lineHeightL28": 28,
28
- "lineHeightXl32": 32,
29
- "textDecorationUnderline": "underline"
30
- }