paris 0.2.1 → 0.2.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.
Files changed (81) hide show
  1. package/CHANGELOG.md +6 -0
  2. package/package.json +6 -1
  3. package/.changeset/README.md +0 -8
  4. package/.changeset/config.json +0 -11
  5. package/.eslintrc.json +0 -22
  6. package/.github/workflows/publish.yml +0 -54
  7. package/.husky/pre-commit +0 -2
  8. package/.idea/inspectionProfiles/Project_Default.xml +0 -7
  9. package/.idea/jsLibraryMappings.xml +0 -6
  10. package/.idea/jsLinters/eslint.xml +0 -6
  11. package/.idea/modules.xml +0 -8
  12. package/.idea/paris.iml +0 -13
  13. package/.idea/vcs.xml +0 -6
  14. package/.idea/watcherTasks.xml +0 -4
  15. package/.storybook/main.ts +0 -43
  16. package/.storybook/manager-head.html +0 -16
  17. package/.storybook/manager.ts +0 -6
  18. package/.storybook/preview.ts +0 -74
  19. package/.storybook/themes.ts +0 -30
  20. package/cat +0 -2
  21. package/global.d.ts +0 -2
  22. package/next.config.js +0 -6
  23. package/public/favicon.ico +0 -0
  24. package/public/fira/fira_code.css +0 -48
  25. package/public/fira/woff/FiraCode-Bold.woff +0 -0
  26. package/public/fira/woff/FiraCode-Light.woff +0 -0
  27. package/public/fira/woff/FiraCode-Medium.woff +0 -0
  28. package/public/fira/woff/FiraCode-Regular.woff +0 -0
  29. package/public/fira/woff/FiraCode-SemiBold.woff +0 -0
  30. package/public/fira/woff/FiraCode-VF.woff +0 -0
  31. package/public/fira/woff2/FiraCode-Bold.woff2 +0 -0
  32. package/public/fira/woff2/FiraCode-Light.woff2 +0 -0
  33. package/public/fira/woff2/FiraCode-Medium.woff2 +0 -0
  34. package/public/fira/woff2/FiraCode-Regular.woff2 +0 -0
  35. package/public/fira/woff2/FiraCode-SemiBold.woff2 +0 -0
  36. package/public/fira/woff2/FiraCode-VF.woff2 +0 -0
  37. package/public/graphik/GraphikSS-Black.woff +0 -0
  38. package/public/graphik/GraphikSS-Black.woff2 +0 -0
  39. package/public/graphik/GraphikSS-BlackItalic.woff +0 -0
  40. package/public/graphik/GraphikSS-BlackItalic.woff2 +0 -0
  41. package/public/graphik/GraphikSS-Bold.woff +0 -0
  42. package/public/graphik/GraphikSS-Bold.woff2 +0 -0
  43. package/public/graphik/GraphikSS-BoldItalic.woff +0 -0
  44. package/public/graphik/GraphikSS-BoldItalic.woff2 +0 -0
  45. package/public/graphik/GraphikSS-Extralight.woff +0 -0
  46. package/public/graphik/GraphikSS-Extralight.woff2 +0 -0
  47. package/public/graphik/GraphikSS-ExtralightItalic.woff +0 -0
  48. package/public/graphik/GraphikSS-ExtralightItalic.woff2 +0 -0
  49. package/public/graphik/GraphikSS-Light.woff +0 -0
  50. package/public/graphik/GraphikSS-Light.woff2 +0 -0
  51. package/public/graphik/GraphikSS-LightItalic.woff +0 -0
  52. package/public/graphik/GraphikSS-LightItalic.woff2 +0 -0
  53. package/public/graphik/GraphikSS-Medium.woff +0 -0
  54. package/public/graphik/GraphikSS-Medium.woff2 +0 -0
  55. package/public/graphik/GraphikSS-MediumItalic.woff +0 -0
  56. package/public/graphik/GraphikSS-MediumItalic.woff2 +0 -0
  57. package/public/graphik/GraphikSS-Regular.woff +0 -0
  58. package/public/graphik/GraphikSS-Regular.woff2 +0 -0
  59. package/public/graphik/GraphikSS-RegularItalic.woff +0 -0
  60. package/public/graphik/GraphikSS-RegularItalic.woff2 +0 -0
  61. package/public/graphik/GraphikSS-Semibold.woff +0 -0
  62. package/public/graphik/GraphikSS-Semibold.woff2 +0 -0
  63. package/public/graphik/GraphikSS-SemiboldItalic.woff +0 -0
  64. package/public/graphik/GraphikSS-SemiboldItalic.woff2 +0 -0
  65. package/public/graphik/GraphikSS-Super.woff +0 -0
  66. package/public/graphik/GraphikSS-Super.woff2 +0 -0
  67. package/public/graphik/GraphikSS-SuperItalic.woff +0 -0
  68. package/public/graphik/GraphikSS-SuperItalic.woff2 +0 -0
  69. package/public/graphik/GraphikSS-Thin.woff +0 -0
  70. package/public/graphik/GraphikSS-Thin.woff2 +0 -0
  71. package/public/graphik/GraphikSS-ThinItalic.woff +0 -0
  72. package/public/graphik/GraphikSS-ThinItalic.woff2 +0 -0
  73. package/public/graphik/graphik.css +0 -174
  74. package/public/next.svg +0 -1
  75. package/public/pte.css +0 -219
  76. package/public/thirteen.svg +0 -1
  77. package/public/vercel.svg +0 -1
  78. package/scripts/createComponent.js +0 -100
  79. package/scripts/generateEntry.js +0 -35
  80. package/scripts/text.ts +0 -118
  81. package/tsconfig.json +0 -27
@@ -1,174 +0,0 @@
1
- /*
2
- This font software is the property of Commercial Type.
3
-
4
- You may not modify the font software, use it on another website, or install it on a computer.
5
-
6
- License information is available at http://commercialtype.com/eula
7
- For more information please visit Commercial Type at http://commercialtype.com or email us at info[at]commercialtype.com
8
-
9
- Copyright (C) 2022 Schwartzco Inc.
10
- License: 2203-CJKSFW
11
- */
12
-
13
-
14
- @font-face {
15
- font-family: 'Graphik Web';
16
- src: url('GraphikSS-BlackItalic.woff2') format('woff2'),
17
- url('GraphikSS-BlackItalic.woff') format('woff');
18
- font-weight: 900;
19
- font-style: italic;
20
- font-stretch: normal;
21
- }
22
-
23
- @font-face {
24
- font-family: 'Graphik Web';
25
- src: url('GraphikSS-Black.woff2') format('woff2'),
26
- url('GraphikSS-Black.woff') format('woff');
27
- font-weight: 900;
28
- font-style: normal;
29
- font-stretch: normal;
30
- }
31
-
32
- @font-face {
33
- font-family: 'Graphik Web';
34
- src: url('GraphikSS-BoldItalic.woff2') format('woff2'),
35
- url('GraphikSS-BoldItalic.woff') format('woff');
36
- font-weight: 800;
37
- font-style: italic;
38
- font-stretch: normal;
39
- }
40
-
41
- @font-face {
42
- font-family: 'Graphik Web';
43
- src: url('GraphikSS-Bold.woff2') format('woff2'),
44
- url('GraphikSS-Bold.woff') format('woff');
45
- font-weight: 800;
46
- font-style: normal;
47
- font-stretch: normal;
48
- }
49
-
50
- @font-face {
51
- font-family: 'Graphik Web';
52
- src: url('GraphikSS-SemiboldItalic.woff2') format('woff2'),
53
- url('GraphikSS-SemiboldItalic.woff') format('woff');
54
- font-weight: 700;
55
- font-style: italic;
56
- font-stretch: normal;
57
- }
58
-
59
- @font-face {
60
- font-family: 'Graphik Web';
61
- src: url('GraphikSS-Semibold.woff2') format('woff2'),
62
- url('GraphikSS-Semibold.woff') format('woff');
63
- font-weight: 700;
64
- font-style: normal;
65
- font-stretch: normal;
66
- }
67
-
68
- @font-face {
69
- font-family: 'Graphik Web';
70
- src: url('GraphikSS-SemiboldItalic.woff2') format('woff2'),
71
- url('GraphikSS-SemiboldItalic.woff') format('woff');
72
- font-weight: 600;
73
- font-style: italic;
74
- font-stretch: normal;
75
- }
76
-
77
- @font-face {
78
- font-family: 'Graphik Web';
79
- src: url('GraphikSS-Semibold.woff2') format('woff2'),
80
- url('GraphikSS-Semibold.woff') format('woff');
81
- font-weight: 600;
82
- font-style: normal;
83
- font-stretch: normal;
84
- }
85
-
86
- @font-face {
87
- font-family: 'Graphik Web';
88
- src: url('GraphikSS-MediumItalic.woff2') format('woff2'),
89
- url('GraphikSS-MediumItalic.woff') format('woff');
90
- font-weight: 500;
91
- font-style: italic;
92
- font-stretch: normal;
93
- }
94
-
95
- @font-face {
96
- font-family: 'Graphik Web';
97
- src: url('GraphikSS-Medium.woff2') format('woff2'),
98
- url('GraphikSS-Medium.woff') format('woff');
99
- font-weight: 500;
100
- font-style: normal;
101
- font-stretch: normal;
102
- }
103
-
104
- @font-face {
105
- font-family: 'Graphik Web';
106
- src: url('GraphikSS-RegularItalic.woff2') format('woff2'),
107
- url('GraphikSS-RegularItalic.woff') format('woff');
108
- font-weight: 400;
109
- font-style: italic;
110
- font-stretch: normal;
111
- }
112
-
113
- @font-face {
114
- font-family: 'Graphik Web';
115
- src: url('GraphikSS-Regular.woff2') format('woff2'),
116
- url('GraphikSS-Regular.woff') format('woff');
117
- font-weight: 400;
118
- font-style: normal;
119
- font-stretch: normal;
120
- }
121
-
122
- @font-face {
123
- font-family: 'Graphik Web';
124
- src: url('GraphikSS-LightItalic.woff2') format('woff2'),
125
- url('GraphikSS-LightItalic.woff') format('woff');
126
- font-weight: 300;
127
- font-style: italic;
128
- font-stretch: normal;
129
- }
130
-
131
- @font-face {
132
- font-family: 'Graphik Web';
133
- src: url('GraphikSS-Light.woff2') format('woff2'),
134
- url('GraphikSS-Light.woff') format('woff');
135
- font-weight: 300;
136
- font-style: normal;
137
- font-stretch: normal;
138
- }
139
-
140
- @font-face {
141
- font-family: 'Graphik Web';
142
- src: url('GraphikSS-ExtralightItalic.woff2') format('woff2'),
143
- url('GraphikSS-ExtralightItalic.woff') format('woff');
144
- font-weight: 200;
145
- font-style: italic;
146
- font-stretch: normal;
147
- }
148
-
149
- @font-face {
150
- font-family: 'Graphik Web';
151
- src: url('GraphikSS-Extralight.woff2') format('woff2'),
152
- url('GraphikSS-Extralight.woff') format('woff');
153
- font-weight: 200;
154
- font-style: normal;
155
- font-stretch: normal;
156
- }
157
-
158
- @font-face {
159
- font-family: 'Graphik Web';
160
- src: url('GraphikSS-ThinItalic.woff2') format('woff2'),
161
- url('GraphikSS-ThinItalic.woff') format('woff');
162
- font-weight: 100;
163
- font-style: italic;
164
- font-stretch: normal;
165
- }
166
-
167
- @font-face {
168
- font-family: 'Graphik Web';
169
- src: url('GraphikSS-Thin.woff2') format('woff2'),
170
- url('GraphikSS-Thin.woff') format('woff');
171
- font-weight: 100;
172
- font-style: normal;
173
- font-stretch: normal;
174
- }
package/public/next.svg DELETED
@@ -1 +0,0 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 394 80"><path fill="#000" d="M262 0h68.5v12.7h-27.2v66.6h-13.6V12.7H262V0ZM149 0v12.7H94v20.4h44.3v12.6H94v21h55v12.6H80.5V0h68.7zm34.3 0h-17.8l63.8 79.4h17.9l-32-39.7 32-39.6h-17.9l-23 28.6-23-28.6zm18.3 56.7-9-11-27.1 33.7h17.8l18.3-22.7z"/><path fill="#000" d="M81 79.3 17 0H0v79.3h13.6V17l50.2 62.3H81Zm252.6-.4c-1 0-1.8-.4-2.5-1s-1.1-1.6-1.1-2.6.3-1.8 1-2.5 1.6-1 2.6-1 1.8.3 2.5 1a3.4 3.4 0 0 1 .6 4.3 3.7 3.7 0 0 1-3 1.8zm23.2-33.5h6v23.3c0 2.1-.4 4-1.3 5.5a9.1 9.1 0 0 1-3.8 3.5c-1.6.8-3.5 1.3-5.7 1.3-2 0-3.7-.4-5.3-1s-2.8-1.8-3.7-3.2c-.9-1.3-1.4-3-1.4-5h6c.1.8.3 1.6.7 2.2s1 1.2 1.6 1.5c.7.4 1.5.5 2.4.5 1 0 1.8-.2 2.4-.6a4 4 0 0 0 1.6-1.8c.3-.8.5-1.8.5-3V45.5zm30.9 9.1a4.4 4.4 0 0 0-2-3.3 7.5 7.5 0 0 0-4.3-1.1c-1.3 0-2.4.2-3.3.5-.9.4-1.6 1-2 1.6a3.5 3.5 0 0 0-.3 4c.3.5.7.9 1.3 1.2l1.8 1 2 .5 3.2.8c1.3.3 2.5.7 3.7 1.2a13 13 0 0 1 3.2 1.8 8.1 8.1 0 0 1 3 6.5c0 2-.5 3.7-1.5 5.1a10 10 0 0 1-4.4 3.5c-1.8.8-4.1 1.2-6.8 1.2-2.6 0-4.9-.4-6.8-1.2-2-.8-3.4-2-4.5-3.5a10 10 0 0 1-1.7-5.6h6a5 5 0 0 0 3.5 4.6c1 .4 2.2.6 3.4.6 1.3 0 2.5-.2 3.5-.6 1-.4 1.8-1 2.4-1.7a4 4 0 0 0 .8-2.4c0-.9-.2-1.6-.7-2.2a11 11 0 0 0-2.1-1.4l-3.2-1-3.8-1c-2.8-.7-5-1.7-6.6-3.2a7.2 7.2 0 0 1-2.4-5.7 8 8 0 0 1 1.7-5 10 10 0 0 1 4.3-3.5c2-.8 4-1.2 6.4-1.2 2.3 0 4.4.4 6.2 1.2 1.8.8 3.2 2 4.3 3.4 1 1.4 1.5 3 1.5 5h-5.8z"/></svg>
package/public/pte.css DELETED
@@ -1,219 +0,0 @@
1
- /* Theme variables, generated by `pte` */
2
- /* This is automatically generated. Do not edit directly. */
3
-
4
- :root {
5
- --pte-tokens-colors-black: #060606;
6
- --pte-tokens-colors-white: #ffffff;
7
- --pte-tokens-colors-teal: #1deecd;
8
- --pte-tokens-colors-orange: #ff9426;
9
- --pte-tokens-colors-pink: #fb46be;
10
- --pte-tokens-colors-red: #fd4d2e;
11
- --pte-tokens-colors-yellow: #ffc043;
12
- --pte-tokens-colors-green: #08c94e;
13
- --pte-tokens-colors-grey1050: #121212;
14
- --pte-tokens-colors-grey1000: #171717;
15
- --pte-tokens-colors-grey950: #1f1f1f;
16
- --pte-tokens-colors-grey900: #252525;
17
- --pte-tokens-colors-grey800: #2e2e2e;
18
- --pte-tokens-colors-grey750: #3c3c3c;
19
- --pte-tokens-colors-grey700: #4a4a4a;
20
- --pte-tokens-colors-grey600: #545454;
21
- --pte-tokens-colors-grey500: #757575;
22
- --pte-tokens-colors-grey400: #afafaf;
23
- --pte-tokens-colors-grey300: #c9c9c9;
24
- --pte-tokens-colors-grey200: #e2e2e2;
25
- --pte-tokens-colors-grey100: #eeeeee;
26
- --pte-tokens-colors-grey50: #f6f6f6;
27
- --pte-tokens-colors-teal600: #18b199;
28
- --pte-tokens-colors-teal500: #1ad4b6;
29
- --pte-tokens-colors-teal400: #1deecd;
30
- --pte-tokens-colors-teal300: #8ef7e6;
31
- --pte-tokens-colors-teal200: #d9fcf7;
32
- --pte-tokens-colors-teal100: #ecfefb;
33
- --pte-tokens-colors-red700: #331611;
34
- --pte-tokens-colors-red600: #541a0f;
35
- --pte-tokens-colors-red500: #a9331f;
36
- --pte-tokens-colors-red400: #fd4d2e;
37
- --pte-tokens-colors-red300: #fea697;
38
- --pte-tokens-colors-red200: #ffe1dc;
39
- --pte-tokens-colors-red100: #fff0ee;
40
- --pte-tokens-colors-yellow600: #554016;
41
- --pte-tokens-colors-yellow500: #aa802d;
42
- --pte-tokens-colors-yellow450: #eba417;
43
- --pte-tokens-colors-yellow400: #ffc043;
44
- --pte-tokens-colors-yellow300: #ffe0a1;
45
- --pte-tokens-colors-yellow200: #fff5e0;
46
- --pte-tokens-colors-yellow100: #fff8e8;
47
- --pte-tokens-colors-green700: #063717;
48
- --pte-tokens-colors-green600: #0a4820;
49
- --pte-tokens-colors-green500: #148f41;
50
- --pte-tokens-colors-green400: #08c94e;
51
- --pte-tokens-colors-green300: #8febb0;
52
- --pte-tokens-colors-green200: #daf8e5;
53
- --pte-tokens-colors-green100: #edfcf2;
54
- --pte-tokens-colors-gradientTeal: linear-gradient(95.14deg, #26EDED 0%, #14EFAC 100%);
55
- --pte-tokens-colors-gradientOrange: linear-gradient(95.14deg, #FF814A 0%, #FFA800 100%);
56
- --pte-tokens-colors-gradientPink: linear-gradient(90deg, #FF4BED 0%, #F7418D 100%);
57
- --pte-colors-black: #060606;
58
- --pte-colors-white: #ffffff;
59
- --pte-colors-accent: #1deecd;
60
- --pte-colors-negative: #fd4d2e;
61
- --pte-colors-warning: #ffc043;
62
- --pte-colors-positive: #08c94e;
63
- --pte-colors-contentPrimary: #121212;
64
- --pte-colors-contentSecondary: #545454;
65
- --pte-colors-contentTertiary: #757575;
66
- --pte-colors-contentDisabled: #afafaf;
67
- --pte-colors-contentAccent: #1deecd;
68
- --pte-colors-contentNegative: #fd4d2e;
69
- --pte-colors-contentWarning: #ffc043;
70
- --pte-colors-contentPositive: #08c94e;
71
- --pte-colors-contentInversePrimary: #ffffff;
72
- --pte-colors-contentInverseSecondary: #e2e2e2;
73
- --pte-colors-contentInverseTertiary: #afafaf;
74
- --pte-colors-contentInverseDisabled: #757575;
75
- --pte-colors-backgroundSidebar: #060606;
76
- --pte-colors-backgroundPrimary: #ffffff;
77
- --pte-colors-backgroundSecondary: #f6f6f6;
78
- --pte-colors-backgroundTertiary: #eeeeee;
79
- --pte-colors-backgroundAccent: #ecfefb;
80
- --pte-colors-backgroundNegative: #fff0ee;
81
- --pte-colors-backgroundWarning: #fff8e8;
82
- --pte-colors-backgroundPositive: #edfcf2;
83
- --pte-colors-backgroundInverseSidebar: #121212;
84
- --pte-colors-backgroundInversePrimary: #060606;
85
- --pte-colors-backgroundInverseSecondary: #252525;
86
- --pte-colors-backgroundInverseTertiary: #2e2e2e;
87
- --pte-colors-backgroundInverseNegative: #331611;
88
- --pte-colors-backgroundInversePositive: #063717;
89
- --pte-colors-backgroundOverlayLight: rgba(255, 255, 255, 0.07);
90
- --pte-colors-backgroundOverlayXLight: rgba(255, 255, 255, 0.1);
91
- --pte-colors-backgroundOverlayGrey: rgba(175, 175, 175, 0.8);
92
- --pte-colors-backgroundOverlayTeal: rgba(29, 238, 205, 0.1);
93
- --pte-colors-borderOpaque: #e2e2e2;
94
- --pte-colors-borderSelected: #757575;
95
- --pte-colors-borderAccent: #1deecd;
96
- --pte-colors-borderNegative: #fd4d2e;
97
- --pte-colors-borderWarning: #ffc043;
98
- --pte-colors-borderPositive: #08c94e;
99
- --pte-colors-borderInverseOpaque: #3c3c3c;
100
- --pte-colors-borderInverseSelected: #e2e2e2;
101
- --pte-typography-fontFamily: "Graphik Web", -apple-system, BlinkMacSystemFont, Helvetica, Arial, sans-serif;
102
- --pte-typography-boldFontWeight: 500;
103
- --pte-typography-italicLetterSpacing: -0.01em;
104
- --pte-typography-styles-displayLarge-fontStyle: normal;
105
- --pte-typography-styles-displayLarge-letterSpacing: -0.01em;
106
- --pte-typography-styles-displayLarge-fontWeight: 600;
107
- --pte-typography-styles-displayLarge-textTransform: none;
108
- --pte-typography-styles-displayLarge-fontSize: 72px;
109
- --pte-typography-styles-displayLarge-lineHeight: 86px;
110
- --pte-typography-styles-displayMedium-fontStyle: normal;
111
- --pte-typography-styles-displayMedium-letterSpacing: -0.01em;
112
- --pte-typography-styles-displayMedium-fontWeight: 600;
113
- --pte-typography-styles-displayMedium-textTransform: none;
114
- --pte-typography-styles-displayMedium-fontSize: 52px;
115
- --pte-typography-styles-displayMedium-lineHeight: 62px;
116
- --pte-typography-styles-displaySmall-fontStyle: normal;
117
- --pte-typography-styles-displaySmall-letterSpacing: -0.01em;
118
- --pte-typography-styles-displaySmall-fontWeight: 600;
119
- --pte-typography-styles-displaySmall-textTransform: none;
120
- --pte-typography-styles-displaySmall-fontSize: 34px;
121
- --pte-typography-styles-displaySmall-lineHeight: 41px;
122
- --pte-typography-styles-headingLarge-fontStyle: normal;
123
- --pte-typography-styles-headingLarge-letterSpacing: normal;
124
- --pte-typography-styles-headingLarge-fontWeight: 600;
125
- --pte-typography-styles-headingLarge-textTransform: none;
126
- --pte-typography-styles-headingLarge-fontSize: 32px;
127
- --pte-typography-styles-headingLarge-lineHeight: 38px;
128
- --pte-typography-styles-headingMedium-fontStyle: normal;
129
- --pte-typography-styles-headingMedium-letterSpacing: normal;
130
- --pte-typography-styles-headingMedium-fontWeight: 600;
131
- --pte-typography-styles-headingMedium-textTransform: none;
132
- --pte-typography-styles-headingMedium-fontSize: 28px;
133
- --pte-typography-styles-headingMedium-lineHeight: 34px;
134
- --pte-typography-styles-headingSmall-fontStyle: normal;
135
- --pte-typography-styles-headingSmall-letterSpacing: normal;
136
- --pte-typography-styles-headingSmall-fontWeight: 600;
137
- --pte-typography-styles-headingSmall-textTransform: none;
138
- --pte-typography-styles-headingSmall-fontSize: 24px;
139
- --pte-typography-styles-headingSmall-lineHeight: 29px;
140
- --pte-typography-styles-headingXSmall-fontStyle: normal;
141
- --pte-typography-styles-headingXSmall-letterSpacing: normal;
142
- --pte-typography-styles-headingXSmall-fontWeight: 600;
143
- --pte-typography-styles-headingXSmall-textTransform: none;
144
- --pte-typography-styles-headingXSmall-fontSize: 20px;
145
- --pte-typography-styles-headingXSmall-lineHeight: 24px;
146
- --pte-typography-styles-headingXXSmall-fontStyle: normal;
147
- --pte-typography-styles-headingXXSmall-letterSpacing: normal;
148
- --pte-typography-styles-headingXXSmall-fontWeight: 600;
149
- --pte-typography-styles-headingXXSmall-textTransform: none;
150
- --pte-typography-styles-headingXXSmall-fontSize: 18px;
151
- --pte-typography-styles-headingXXSmall-lineHeight: 22px;
152
- --pte-typography-styles-labelXLarge-fontStyle: normal;
153
- --pte-typography-styles-labelXLarge-letterSpacing: 0.1em;
154
- --pte-typography-styles-labelXLarge-fontWeight: 600;
155
- --pte-typography-styles-labelXLarge-textTransform: uppercase;
156
- --pte-typography-styles-labelXLarge-fontSize: 18px;
157
- --pte-typography-styles-labelXLarge-lineHeight: 22px;
158
- --pte-typography-styles-labelLarge-fontStyle: normal;
159
- --pte-typography-styles-labelLarge-letterSpacing: 0.1em;
160
- --pte-typography-styles-labelLarge-fontWeight: 600;
161
- --pte-typography-styles-labelLarge-textTransform: uppercase;
162
- --pte-typography-styles-labelLarge-fontSize: 16px;
163
- --pte-typography-styles-labelLarge-lineHeight: 19px;
164
- --pte-typography-styles-labelMedium-fontStyle: normal;
165
- --pte-typography-styles-labelMedium-letterSpacing: 0.1em;
166
- --pte-typography-styles-labelMedium-fontWeight: 600;
167
- --pte-typography-styles-labelMedium-textTransform: uppercase;
168
- --pte-typography-styles-labelMedium-fontSize: 14px;
169
- --pte-typography-styles-labelMedium-lineHeight: 17px;
170
- --pte-typography-styles-labelSmall-fontStyle: normal;
171
- --pte-typography-styles-labelSmall-letterSpacing: 0.1em;
172
- --pte-typography-styles-labelSmall-fontWeight: 600;
173
- --pte-typography-styles-labelSmall-textTransform: uppercase;
174
- --pte-typography-styles-labelSmall-fontSize: 12px;
175
- --pte-typography-styles-labelSmall-lineHeight: 14px;
176
- --pte-typography-styles-labelXSmall-fontStyle: normal;
177
- --pte-typography-styles-labelXSmall-letterSpacing: 0.1em;
178
- --pte-typography-styles-labelXSmall-fontWeight: 600;
179
- --pte-typography-styles-labelXSmall-textTransform: uppercase;
180
- --pte-typography-styles-labelXSmall-fontSize: 10px;
181
- --pte-typography-styles-labelXSmall-lineHeight: 12px;
182
- --pte-typography-styles-paragraphLarge-fontStyle: normal;
183
- --pte-typography-styles-paragraphLarge-letterSpacing: normal;
184
- --pte-typography-styles-paragraphLarge-fontWeight: 400;
185
- --pte-typography-styles-paragraphLarge-textTransform: none;
186
- --pte-typography-styles-paragraphLarge-fontSize: 18px;
187
- --pte-typography-styles-paragraphLarge-lineHeight: 150%;
188
- --pte-typography-styles-paragraphMedium-fontStyle: normal;
189
- --pte-typography-styles-paragraphMedium-letterSpacing: normal;
190
- --pte-typography-styles-paragraphMedium-fontWeight: 400;
191
- --pte-typography-styles-paragraphMedium-textTransform: none;
192
- --pte-typography-styles-paragraphMedium-fontSize: 16px;
193
- --pte-typography-styles-paragraphMedium-lineHeight: 150%;
194
- --pte-typography-styles-paragraphSmall-fontStyle: normal;
195
- --pte-typography-styles-paragraphSmall-letterSpacing: normal;
196
- --pte-typography-styles-paragraphSmall-fontWeight: 400;
197
- --pte-typography-styles-paragraphSmall-textTransform: none;
198
- --pte-typography-styles-paragraphSmall-fontSize: 14px;
199
- --pte-typography-styles-paragraphSmall-lineHeight: 150%;
200
- --pte-typography-styles-paragraphXSmall-fontStyle: normal;
201
- --pte-typography-styles-paragraphXSmall-letterSpacing: normal;
202
- --pte-typography-styles-paragraphXSmall-fontWeight: 400;
203
- --pte-typography-styles-paragraphXSmall-textTransform: none;
204
- --pte-typography-styles-paragraphXSmall-fontSize: 12px;
205
- --pte-typography-styles-paragraphXSmall-lineHeight: 150%;
206
- --pte-typography-styles-paragraphXXSmall-fontStyle: normal;
207
- --pte-typography-styles-paragraphXXSmall-letterSpacing: normal;
208
- --pte-typography-styles-paragraphXXSmall-fontWeight: 400;
209
- --pte-typography-styles-paragraphXXSmall-textTransform: none;
210
- --pte-typography-styles-paragraphXXSmall-fontSize: 10px;
211
- --pte-typography-styles-paragraphXXSmall-lineHeight: 150%;
212
- --pte-borders-radius-pill: 1000px;
213
- --pte-borders-radius-circle: 100%;
214
- --pte-borders-radius-rectangle: 0px;
215
- --pte-borders-radius-rounded: 8px;
216
- --pte-borders-radius-roundedSmall: 4px;
217
- --pte-borders-radius-roundedLarge: 12px;
218
- --pte-animations-interaction: 0.2s cubic-bezier(0.25, 1, 0.5, 1);
219
- }
@@ -1 +0,0 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="40" height="31" fill="none"><g opacity=".9"><path fill="url(#a)" d="M13 .4v29.3H7V6.3h-.2L0 10.5V5L7.2.4H13Z"/><path fill="url(#b)" d="M28.8 30.1c-2.2 0-4-.3-5.7-1-1.7-.8-3-1.8-4-3.1a7.7 7.7 0 0 1-1.4-4.6h6.2c0 .8.3 1.4.7 2 .4.5 1 .9 1.7 1.2.7.3 1.6.4 2.5.4 1 0 1.7-.2 2.5-.5.7-.3 1.3-.8 1.7-1.4.4-.6.6-1.2.6-2s-.2-1.5-.7-2.1c-.4-.6-1-1-1.8-1.4-.8-.4-1.8-.5-2.9-.5h-2.7v-4.6h2.7a6 6 0 0 0 2.5-.5 4 4 0 0 0 1.7-1.3c.4-.6.6-1.3.6-2a3.5 3.5 0 0 0-2-3.3 5.6 5.6 0 0 0-4.5 0 4 4 0 0 0-1.7 1.2c-.4.6-.6 1.2-.6 2h-6c0-1.7.6-3.2 1.5-4.5 1-1.3 2.2-2.3 3.8-3C25 .4 26.8 0 28.8 0s3.8.4 5.3 1.1c1.5.7 2.7 1.7 3.6 3a7.2 7.2 0 0 1 1.2 4.2c0 1.6-.5 3-1.5 4a7 7 0 0 1-4 2.2v.2c2.2.3 3.8 1 5 2.2a6.4 6.4 0 0 1 1.6 4.6c0 1.7-.5 3.1-1.4 4.4a9.7 9.7 0 0 1-4 3.1c-1.7.8-3.7 1.1-5.8 1.1Z"/></g><defs><linearGradient id="a" x1="20" x2="20" y1="0" y2="30.1" gradientUnits="userSpaceOnUse"><stop/><stop offset="1" stop-color="#3D3D3D"/></linearGradient><linearGradient id="b" x1="20" x2="20" y1="0" y2="30.1" gradientUnits="userSpaceOnUse"><stop/><stop offset="1" stop-color="#3D3D3D"/></linearGradient></defs></svg>
package/public/vercel.svg DELETED
@@ -1 +0,0 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 283 64"><path fill="black" d="M141 16c-11 0-19 7-19 18s9 18 20 18c7 0 13-3 16-7l-7-5c-2 3-6 4-9 4-5 0-9-3-10-7h28v-3c0-11-8-18-19-18zm-9 15c1-4 4-7 9-7s8 3 9 7h-18zm117-15c-11 0-19 7-19 18s9 18 20 18c6 0 12-3 16-7l-8-5c-2 3-5 4-8 4-5 0-9-3-11-7h28l1-3c0-11-8-18-19-18zm-10 15c2-4 5-7 10-7s8 3 9 7h-19zm-39 3c0 6 4 10 10 10 4 0 7-2 9-5l8 5c-3 5-9 8-17 8-11 0-19-7-19-18s8-18 19-18c8 0 14 3 17 8l-8 5c-2-3-5-5-9-5-6 0-10 4-10 10zm83-29v46h-9V5h9zM37 0l37 64H0L37 0zm92 5-27 48L74 5h10l18 30 17-30h10zm59 12v10l-3-1c-6 0-10 4-10 10v15h-9V17h9v9c0-5 6-9 13-9z"/></svg>
@@ -1,100 +0,0 @@
1
- /* eslint-disable @typescript-eslint/no-var-requires */
2
- const fs = require('fs');
3
- const path = require('path');
4
-
5
- if (!process.argv[2]) {
6
- console.error('❌ Please provide a component name, e.g. pnpm create:component Button');
7
- process.exit(1);
8
- }
9
-
10
- const componentNameInput = process.argv[2];
11
-
12
- if (!/[A-Za-z]+/.test(componentNameInput)) {
13
- console.error('❌ Please provide a alphabet only component name in CamelCase, e.g. pnpm create:component Button');
14
- process.exit(1);
15
- }
16
-
17
- // Capitalize the first letter of the component name
18
- const componentName = componentNameInput.charAt(0).toUpperCase() + componentNameInput.slice(1);
19
-
20
- const baseDir = path.resolve(process.cwd());
21
- const componentDirectory = `${baseDir}/src/stories/${componentName.toLocaleLowerCase()}`;
22
-
23
- const componentFile = `${componentDirectory}/${componentName}.tsx`;
24
- const cssModuleFile = `${componentDirectory}/${componentName}.module.scss`;
25
- const storyFile = `${componentDirectory}/${componentName}.stories.ts`;
26
- const indexFile = `${componentDirectory}/index.ts`;
27
-
28
- const componentCode = `import type { FC } from 'react';
29
- import styles from './${componentName}.module.scss';
30
-
31
- export type ${componentName}Props = {
32
- /** The contents of the ${componentName}. */
33
- children?: string;
34
- };
35
-
36
- export const ${componentName}: FC<${componentName}Props> = ({ children }) => (
37
- <div className={styles.content}>
38
- <p>{children || 'Replace this area with your component.'}</p>
39
- </div>
40
- );
41
- `;
42
-
43
- const indexCode = `export * from './${componentName}';
44
- `;
45
-
46
- const cssModuleCode = `.content {
47
- background-color: pink;
48
- color: white;
49
- height: 2rem;
50
- }
51
- `;
52
-
53
- const storyCode = `import type { Meta, StoryObj } from '@storybook/react';
54
- import { ${componentName} } from './${componentName}';
55
-
56
- const meta: Meta<typeof ${componentName}> = {
57
- title: 'Uncategorized/${componentName}',
58
- component: ${componentName},
59
- tags: ['autodocs'],
60
- };
61
-
62
- export default meta;
63
- type Story = StoryObj<typeof ${componentName}>;
64
-
65
- export const Default: Story = {
66
- args: {
67
- children: 'Hello world! This is a new ${componentName} component.',
68
- },
69
- };
70
-
71
- export const Secondary: Story = {
72
- args: {
73
- children: 'Hello world! This is a secondary component.',
74
- },
75
- };
76
- `;
77
-
78
- const run = async () => {
79
- const componentExists = await fs.promises
80
- .access(indexFile)
81
- .then(() => true)
82
- .catch(() => false);
83
-
84
- if (componentExists) {
85
- throw new Error(`❌ Component ${componentName} already exists.`);
86
- }
87
-
88
- const success = await fs.promises.mkdir(componentDirectory)
89
- .then(() => Promise.all([
90
- fs.promises.writeFile(componentFile, componentCode, { encoding: 'utf8' }),
91
- fs.promises.writeFile(cssModuleFile, cssModuleCode, { encoding: 'utf8' }),
92
- fs.promises.writeFile(storyFile, storyCode, { encoding: 'utf8' }),
93
- fs.promises.writeFile(indexFile, indexCode, { encoding: 'utf8' }),
94
- ]))
95
- .then(() => `✅ Component ${componentName} created!`);
96
-
97
- return success;
98
- };
99
-
100
- run().then(console.log).catch(console.error);
@@ -1,35 +0,0 @@
1
- /* eslint-disable @typescript-eslint/no-var-requires */
2
- const path = require('path');
3
- const fs = require('fs');
4
-
5
- const baseDir = path.resolve(process.cwd());
6
-
7
- const componentDirectory = `${baseDir}/src/stories`;
8
-
9
- // Directories to intentionally ignore
10
- const ignoreDirectories = [
11
- 'assets',
12
- ];
13
-
14
- const run = async () => {
15
- // Iterate through the directory and get a list of subdirectories
16
- const subDirectories = fs
17
- .readdirSync(componentDirectory, { withFileTypes: true })
18
- .filter((dirent) => dirent.isDirectory())
19
- .map((dirent) => dirent.name)
20
- .filter((directory) => !ignoreDirectories.includes(directory));
21
-
22
- // Generate entry point file
23
- const entryPointFile = `${baseDir}/index.ts`;
24
- const entryPointCode = subDirectories
25
- .map((subDirectory) => `export * from './src/stories/${subDirectory}';`)
26
- .join('\n')
27
- .concat('\n');
28
-
29
- // Write the entry point file
30
- await fs.promises.writeFile(entryPointFile, entryPointCode, { encoding: 'utf8' });
31
-
32
- return '✅ Entry point file generated.';
33
- };
34
-
35
- run().then(console.log).catch(console.error);
package/scripts/text.ts DELETED
@@ -1,118 +0,0 @@
1
- #!/usr/bin/env ts-node --esm
2
-
3
- /**
4
- * @file Generates CSS modules and Storybook stories for typography classes.
5
- */
6
-
7
- import fs from 'fs/promises';
8
- import * as cp from 'child_process';
9
- import jss from 'jss';
10
- import preset from 'jss-preset-default';
11
- import type { StoryObj } from '@storybook/react';
12
- import { pascalCase } from 'change-case';
13
- import type { FontDefinition, Theme } from '../src/stories/theme';
14
- import { theme, pvar, LightTheme } from '../src/stories/theme';
15
- import type { Text } from '../src/stories/text';
16
-
17
- jss.setup({
18
- ...preset(),
19
- createGenerateId: () => (rule) => rule.key,
20
- });
21
-
22
- /**
23
- * Generates a CSS module with all the typography classes.
24
- */
25
- export const text = async () => {
26
- const styles = Object.fromEntries(
27
- (Object.entries(theme.typography.styles) as Array<[keyof Theme['typography']['styles'], FontDefinition]>)
28
- .map(([fontClass, value]) => [
29
- fontClass,
30
- Object.fromEntries(
31
- (Object.keys(value) as Array<keyof FontDefinition>).map((attr) => [
32
- attr,
33
- pvar(`typography.styles.${fontClass}.${attr}`),
34
- ]),
35
- ),
36
- ]),
37
- );
38
- // const { styles } = theme.typography;
39
- const css = `/* Auto-generated with \`pnpm generate:text\` on ${new Date().toString()} */\n/* Do not edit manually; instead, edit the \`generateTextClasses\` function in \`scripts/text.ts\` and run \`pnpm generate:text -c\`. */\n\n${jss.createStyleSheet(styles).toString()}`;
40
- await fs.writeFile('src/stories/text/Typography.module.css', css
41
- // Add a newline after each class
42
- .replaceAll('}', '}\n'));
43
- };
44
-
45
- /**
46
- * Generates Storybook stories for each typography class.
47
- */
48
- export const generateTextStories = async () => {
49
- const stories: Array<[string, StoryObj<typeof Text>]> = Object.keys(LightTheme.typography.styles)
50
- .map((style) => ([
51
- style,
52
- {
53
- args: {
54
- children: 'In an alleyway, drinking champagne',
55
- kind: style,
56
- },
57
- } as StoryObj<typeof Text>,
58
- ]));
59
-
60
- // Retrieve current stories
61
- const currentStories = await fs.readFile('src/stories/text/Text.stories.ts', 'utf-8');
62
-
63
- // Look for `// @auto-generated-start` and `// @auto-generated-end`
64
- const start = currentStories.indexOf('// @auto-generated-start');
65
- const end = currentStories.indexOf('// @auto-generated-end');
66
-
67
- // Generate the new stories
68
- const out = stories.map((story) => `export const ${pascalCase(story[0] as string).replace('Xx', 'XX')}: Story = ${JSON.stringify(story[1], null, 4)};`).join('\n\n');
69
-
70
- // If the start and end tags are found, replace the content between them
71
- if (start !== -1 && end !== -1) {
72
- const newStories = `${currentStories.slice(0, start + '// @auto-generated-start\n\n'.length)}${
73
- out
74
- }\n\n${
75
- currentStories.slice(end)}`;
76
- await fs.writeFile('src/stories/text/Text.stories.ts', newStories);
77
- } else {
78
- // Otherwise, append the new stories to the end of the file and add the start and end tags
79
- const newStories = `${currentStories
80
- }\n\n// @auto-generated-start\n\n${
81
- out
82
- }\n\n// @auto-generated-end`;
83
- await fs.writeFile('src/stories/text/Text.stories.ts', newStories);
84
- }
85
-
86
- // const storyFile = stories.map((story) => `export const ${pascalCase(story.storyName as string)}: Story = ${JSON.stringify(story, null, 4)};`).join('\n\n');
87
- // await fs.writeFile('src/stories/text/Text.generated-stories.ts', storyFile);
88
- };
89
-
90
- (async function main() {
91
- let argReceived = false;
92
- if (process.argv.includes('--stories') || process.argv.includes('-s')) {
93
- const startS = Date.now();
94
- argReceived = true;
95
- await generateTextStories();
96
- try {
97
- cp.execSync('eslint --fix src/stories/text/Text.stories.ts');
98
- } catch (e: any) {
99
- console.error('❌ Failed to lint generated stories.');
100
- if (e?.stdout) {
101
- console.error(e?.stdout?.toString());
102
- }
103
- process.exit(1);
104
- }
105
- console.info(`✅ Successfully generated stories in ${Date.now() - startS}ms`);
106
- }
107
- if (process.argv.includes('--classes') || process.argv.includes('-c')) {
108
- const startC = Date.now();
109
- argReceived = true;
110
- await text();
111
- console.info(`✅ Successfully generated classes in ${Date.now() - startC}ms`);
112
- }
113
- if (!argReceived) {
114
- console.error('❌ No arguments received. Please specify either --stories, --classes, or both.');
115
- process.exit(1);
116
- }
117
- process.exit(0);
118
- }());