@repobit/dex-system-design 0.23.94 → 0.23.96

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 (84) hide show
  1. package/CHANGELOG.md +15 -0
  2. package/package.json +4 -4
  3. package/src/blog/assets/articles/fbi-crypto-scam-1.jpeg +0 -0
  4. package/src/blog/assets/articles/fbi-crypto-scam-cover.png +0 -0
  5. package/src/blog/assets/fonts/IBMPlexSans-Bold.woff2 +0 -0
  6. package/src/blog/assets/fonts/IBMPlexSans-BoldItalic.woff2 +0 -0
  7. package/src/blog/assets/fonts/IBMPlexSans-Italic.woff2 +0 -0
  8. package/src/blog/assets/fonts/IBMPlexSans-Light.woff2 +0 -0
  9. package/src/blog/assets/fonts/IBMPlexSans-LightItalic.woff2 +0 -0
  10. package/src/blog/assets/fonts/IBMPlexSans-Medium.woff2 +0 -0
  11. package/src/blog/assets/fonts/IBMPlexSans-MediumItalic.woff2 +0 -0
  12. package/src/blog/assets/fonts/IBMPlexSans-Regular.woff2 +0 -0
  13. package/src/blog/assets/fonts/IBMPlexSans-SemiBold.woff2 +0 -0
  14. package/src/blog/assets/fonts/IBMPlexSans-SemiBoldItalic.woff2 +0 -0
  15. package/src/blog/assets/fonts/IBMPlexSansCondensed-Bold.woff2 +0 -0
  16. package/src/blog/assets/fonts/IBMPlexSansCondensed-BoldItalic.woff2 +0 -0
  17. package/src/blog/assets/fonts/IBMPlexSansCondensed-Italic.woff2 +0 -0
  18. package/src/blog/assets/fonts/IBMPlexSansCondensed-Light.woff2 +0 -0
  19. package/src/blog/assets/fonts/IBMPlexSansCondensed-LightItalic.woff2 +0 -0
  20. package/src/blog/assets/fonts/IBMPlexSansCondensed-Medium.woff2 +0 -0
  21. package/src/blog/assets/fonts/IBMPlexSansCondensed-MediumItalic.woff2 +0 -0
  22. package/src/blog/assets/fonts/IBMPlexSansCondensed-Regular.woff2 +0 -0
  23. package/src/blog/assets/fonts/IBMPlexSansCondensed-SemiBold.woff2 +0 -0
  24. package/src/blog/assets/fonts/IBMPlexSansCondensed-SemiBoldItalic.woff2 +0 -0
  25. package/src/blog/assets/global-scam-intelligence-report-2026.png +0 -0
  26. package/src/blog/assets/psd-4.jpg +0 -0
  27. package/src/blog/src/articles/FBI warns of crypto investment scam that sends couriers to collect victims' cash-editedAB.docx +0 -0
  28. package/src/blog/src/articles/FBI-crypto-scam-courier-cash.png +0 -0
  29. package/src/blog/src/articles/fbi-crypto-scam.js +324 -0
  30. package/src/blog/src/articles/~$I warns of crypto investment scam that sends couriers to collect victims' cash-editedAB.docx +0 -0
  31. package/src/blog/src/atoms/blog-abstract.js +51 -0
  32. package/src/blog/src/atoms/blog-atoms.stories.js +519 -0
  33. package/src/blog/src/atoms/blog-authors.js +70 -0
  34. package/src/blog/src/atoms/blog-avatar.js +44 -0
  35. package/src/blog/src/atoms/blog-blockquote.js +92 -0
  36. package/src/blog/src/atoms/blog-caption.js +31 -0
  37. package/src/blog/src/atoms/blog-code-block.js +89 -0
  38. package/src/blog/src/atoms/blog-dek.js +30 -0
  39. package/src/blog/src/atoms/blog-featured-image.js +65 -0
  40. package/src/blog/src/atoms/blog-heading.js +63 -0
  41. package/src/blog/src/atoms/blog-image.js +50 -0
  42. package/src/blog/src/atoms/blog-key-takeaways.js +101 -0
  43. package/src/blog/src/atoms/blog-link.js +68 -0
  44. package/src/blog/src/atoms/blog-meta.js +87 -0
  45. package/src/blog/src/atoms/blog-most-popular.js +146 -0
  46. package/src/blog/src/atoms/blog-newsletter-signup.js +342 -0
  47. package/src/blog/src/atoms/blog-paragraph.js +61 -0
  48. package/src/blog/src/atoms/blog-product-upsell.js +168 -0
  49. package/src/blog/src/atoms/blog-related-articles.js +326 -0
  50. package/src/blog/src/atoms/blog-related-label.js +30 -0
  51. package/src/blog/src/atoms/blog-report-promo.js +250 -0
  52. package/src/blog/src/atoms/blog-standout.js +78 -0
  53. package/src/blog/src/atoms/blog-subhead.js +32 -0
  54. package/src/blog/src/atoms/blog-table-of-contents.js +447 -0
  55. package/src/blog/src/atoms/blog-tag.js +86 -0
  56. package/src/blog/src/atoms/blog-title.js +31 -0
  57. package/src/blog/src/base/blog-element.js +10 -0
  58. package/src/blog/src/breakpoints.js +23 -0
  59. package/src/blog/src/content/blog-article.js +736 -0
  60. package/src/blog/src/content/blog-atoms-showcase.js +401 -0
  61. package/src/blog/src/content/blog-page-layout.js +73 -0
  62. package/src/blog/src/content/blog-pages.stories.js +101 -0
  63. package/src/blog/src/content/render-inline-content.js +18 -0
  64. package/src/blog/src/data/popular-articles.js +43 -0
  65. package/src/blog/src/data/related-articles.js +58 -0
  66. package/src/blog/src/index.js +104 -0
  67. package/src/blog/src/lib/article-toc.js +206 -0
  68. package/src/blog/src/lib/load-prism.js +23 -0
  69. package/src/blog/src/shell/blog-shell.js +31 -0
  70. package/src/blog/src/styles/prism-theme.js +65 -0
  71. package/src/blog/src/tokens/blog.js +406 -0
  72. package/src/blog/src/tokens/core.js +811 -0
  73. package/src/blog/src/tokens/fonts.css +241 -0
  74. package/src/blog/src/tokens/index.js +27 -0
  75. package/src/blog/src/tokens/legacy.js +58 -0
  76. package/src/blog/tokens/blog.js +406 -0
  77. package/src/blog/tokens/core.js +811 -0
  78. package/src/blog/tokens/fonts.css +241 -0
  79. package/src/blog/tokens/index.js +27 -0
  80. package/src/blog/tokens/legacy.js +58 -0
  81. package/src/blog/tokens.css +1512 -0
  82. package/src/blog/tokens.js +1 -0
  83. package/src/blog/vendor/prism/prism.css +120 -0
  84. package/src/blog/vendor/prism/prism.js +300 -0
package/src/blog/src/tokens/fonts.css ADDED
@@ -0,0 +1,241 @@
1
+ /* Load once globally — do not import into Lit shadow styles */
2
+
3
+ @font-face {
4
+ font-family: "IBM Plex Mono";
5
+ font-style: normal;
6
+ font-weight: 700;
7
+ font-display: swap;
8
+ src: url("/assets/fonts/IBMPlexMono-Bold.woff2") format("woff2");
9
+ }
10
+
11
+ @font-face {
12
+ font-family: "IBM Plex Mono";
13
+ font-style: italic;
14
+ font-weight: 700;
15
+ font-display: swap;
16
+ src: url("/assets/fonts/IBMPlexMono-BoldItalic.woff2") format("woff2");
17
+ }
18
+
19
+ @font-face {
20
+ font-family: "IBM Plex Mono";
21
+ font-style: italic;
22
+ font-weight: 300;
23
+ font-display: swap;
24
+ src: url("/assets/fonts/IBMPlexMono-Italic.woff2") format("woff2");
25
+ }
26
+
27
+ @font-face {
28
+ font-family: "IBM Plex Mono";
29
+ font-style: normal;
30
+ font-weight: 300;
31
+ font-display: swap;
32
+ src: url("/assets/fonts/IBMPlexMono-Light.woff2") format("woff2");
33
+ }
34
+
35
+ @font-face {
36
+ font-family: "IBM Plex Mono";
37
+ font-style: italic;
38
+ font-weight: 300;
39
+ font-display: swap;
40
+ src: url("/assets/fonts/IBMPlexMono-LightItalic.woff2") format("woff2");
41
+ }
42
+
43
+ @font-face {
44
+ font-family: "IBM Plex Mono";
45
+ font-style: normal;
46
+ font-weight: 400;
47
+ font-display: swap;
48
+ src: url("/assets/fonts/IBMPlexMono-Regular.woff2") format("woff2");
49
+ }
50
+
51
+ @font-face {
52
+ font-family: "IBM Plex Mono";
53
+ font-style: italic;
54
+ font-weight: 500;
55
+ font-display: swap;
56
+ src: url("/assets/fonts/IBMPlexMono-Medium.woff2") format("woff2");
57
+ }
58
+
59
+ @font-face {
60
+ font-family: "IBM Plex Mono";
61
+ font-style: italic;
62
+ font-weight: 500;
63
+ font-display: swap;
64
+ src: url("/assets/fonts/IBMPlexMono-MediumItalic.woff2") format("woff2");
65
+ }
66
+
67
+ @font-face {
68
+ font-family: "IBM Plex Mono";
69
+ font-style: italic;
70
+ font-weight: 600;
71
+ font-display: swap;
72
+ src: url("/assets/fonts/IBMPlexMono-SemiBold.woff2") format("woff2");
73
+ }
74
+
75
+ @font-face {
76
+ font-family: "IBM Plex Mono";
77
+ font-style: italic;
78
+ font-weight: 600;
79
+ font-display: swap;
80
+ src: url("/assets/fonts/IBMPlexMono-SemiBoldItalic.woff2") format("woff2");
81
+ }
82
+
83
+ @font-face {
84
+ font-family: "IBM Plex Sans";
85
+ font-style: normal;
86
+ font-weight: 700;
87
+ font-display: swap;
88
+ src: url("/assets/fonts/IBMPlexSans-Bold.woff2") format("woff2");
89
+ }
90
+
91
+ @font-face {
92
+ font-family: "IBM Plex Sans";
93
+ font-style: italic;
94
+ font-weight: 700;
95
+ font-display: swap;
96
+ src: url("/assets/fonts/IBMPlexSans-BoldItalic.woff2") format("woff2");
97
+ }
98
+
99
+ @font-face {
100
+ font-family: "IBM Plex Sans";
101
+ font-style: italic;
102
+ font-weight: 400;
103
+ font-display: swap;
104
+ src: url("/assets/fonts/IBMPlexSans-Italic.woff2") format("woff2");
105
+ }
106
+
107
+ @font-face {
108
+ font-family: "IBM Plex Sans";
109
+ font-style: normal;
110
+ font-weight: 300;
111
+ font-display: swap;
112
+ src: url("/assets/fonts/IBMPlexSans-Light.woff2") format("woff2");
113
+ }
114
+
115
+ @font-face {
116
+ font-family: "IBM Plex Sans";
117
+ font-style: italic;
118
+ font-weight: 300;
119
+ font-display: swap;
120
+ src: url("/assets/fonts/IBMPlexSans-LightItalic.woff2") format("woff2");
121
+ }
122
+
123
+ @font-face {
124
+ font-family: "IBM Plex Sans";
125
+ font-style: normal;
126
+ font-weight: 400;
127
+ font-display: swap;
128
+ src: url("/assets/fonts/IBMPlexSans-Regular.woff2") format("woff2");
129
+ }
130
+
131
+ @font-face {
132
+ font-family: "IBM Plex Sans";
133
+ font-style: italic;
134
+ font-weight: 500;
135
+ font-display: swap;
136
+ src: url("/assets/fonts/IBMPlexSans-MediumItalic.woff2") format("woff2");
137
+ }
138
+
139
+ @font-face {
140
+ font-family: "IBM Plex Sans";
141
+ font-style: normal;
142
+ font-weight: 500;
143
+ font-display: swap;
144
+ src: url("/assets/fonts/IBMPlexSans-Medium.woff2") format("woff2");
145
+ }
146
+
147
+ @font-face {
148
+ font-family: "IBM Plex Sans";
149
+ font-style: normal;
150
+ font-weight: 600;
151
+ font-display: swap;
152
+ src: url("/assets/fonts/IBMPlexSans-SemiBold.woff2") format("woff2");
153
+ }
154
+
155
+ @font-face {
156
+ font-family: "IBM Plex Sans";
157
+ font-style: italic;
158
+ font-weight: 600;
159
+ font-display: swap;
160
+ src: url("/assets/fonts/IBMPlexSans-SemiBoldItalic.woff2") format("woff2");
161
+ }
162
+
163
+ @font-face {
164
+ font-family: "IBM Plex Sans Condensed";
165
+ font-style: normal;
166
+ font-weight: 700;
167
+ font-display: swap;
168
+ src: url("/assets/fonts/IBMPlexSansCondensed-Bold.woff2") format("woff2");
169
+ }
170
+
171
+ @font-face {
172
+ font-family: "IBM Plex Sans Condensed";
173
+ font-style: italic;
174
+ font-weight: 700;
175
+ font-display: swap;
176
+ src: url("/assets/fonts/IBMPlexSansCondensed-BoldItalic.woff2") format("woff2");
177
+ }
178
+
179
+ @font-face {
180
+ font-family: "IBM Plex Sans Condensed";
181
+ font-style: italic;
182
+ font-weight: 300;
183
+ font-display: swap;
184
+ src: url("/assets/fonts/IBMPlexSansCondensed-Italic.woff2") format("woff2");
185
+ }
186
+
187
+ @font-face {
188
+ font-family: "IBM Plex Sans Condensed";
189
+ font-style: normal;
190
+ font-weight: 300;
191
+ font-display: swap;
192
+ src: url("/assets/fonts/IBMPlexSansCondensed-Light.woff2") format("woff2");
193
+ }
194
+
195
+ @font-face {
196
+ font-family: "IBM Plex Sans Condensed";
197
+ font-style: italic;
198
+ font-weight: 300;
199
+ font-display: swap;
200
+ src: url("/assets/fonts/IBMPlexSansCondensed-LightItalic.woff2") format("woff2");
201
+ }
202
+
203
+ @font-face {
204
+ font-family: "IBM Plex Sans Condensed";
205
+ font-style: normal;
206
+ font-weight: 400;
207
+ font-display: swap;
208
+ src: url("/assets/fonts/IBMPlexSansCondensed-Regular.woff2") format("woff2");
209
+ }
210
+
211
+ @font-face {
212
+ font-family: "IBM Plex Sans Condensed";
213
+ font-style: normal;
214
+ font-weight: 500;
215
+ font-display: swap;
216
+ src: url("/assets/fonts/IBMPlexSansCondensed-Medium.woff2") format("woff2");
217
+ }
218
+
219
+ @font-face {
220
+ font-family: "IBM Plex Sans Condensed";
221
+ font-style: italic;
222
+ font-weight: 500;
223
+ font-display: swap;
224
+ src: url("/assets/fonts/IBMPlexSansCondensed-MediumItalic.woff2") format("woff2");
225
+ }
226
+
227
+ @font-face {
228
+ font-family: "IBM Plex Sans Condensed";
229
+ font-style: normal;
230
+ font-weight: 600;
231
+ font-display: swap;
232
+ src: url("/assets/fonts/IBMPlexSansCondensed-SemiBold.woff2") format("woff2");
233
+ }
234
+
235
+ @font-face {
236
+ font-family: "IBM Plex Sans Condensed";
237
+ font-style: italic;
238
+ font-weight: 600;
239
+ font-display: swap;
240
+ src: url("/assets/fonts/IBMPlexSansCondensed-SemiBoldItalic.woff2") format("woff2");
241
+ }
package/src/blog/src/tokens/index.js ADDED
@@ -0,0 +1,27 @@
1
+ import { css, unsafeCSS } from 'lit';
2
+ import { coreTokens } from './core.js';
3
+ import { blogVars } from './blog.js';
4
+ import { legacyVars } from './legacy.js';
5
+
6
+ /** Core design system tokens — apply to :host in Lit components */
7
+ export const tokens = css`
8
+ :host {
9
+ ${unsafeCSS(coreTokens)}
10
+ }
11
+ `;
12
+
13
+ /** Blog-specific tokens — apply alongside core tokens */
14
+ export const blogTokens = css`
15
+ :host {
16
+ ${unsafeCSS(blogVars)}
17
+ }
18
+ `;
19
+
20
+ /** Deprecated aliases — avoid in new components */
21
+ export const legacyTokens = css`
22
+ :host {
23
+ ${unsafeCSS(legacyVars)}
24
+ }
25
+ `;
26
+
27
+ export { coreTokens, blogVars, legacyVars };
package/src/blog/src/tokens/legacy.js ADDED
@@ -0,0 +1,58 @@
1
+ /** Deprecated token aliases — source of truth. Run npm run build:tokens to sync tokens.css */
2
+ export const legacyVars = `
3
+ /* ================================
4
+ LEGACY ALIASES (DEPRECATED)
5
+ Do not add new references — use core tokens instead.
6
+ These names are preserved for backward compatibility only.
7
+ ================================ */
8
+
9
+ /* Display sizes (legacy px-based names) */
10
+ --display-xxsmall: 2.75rem;
11
+ --display-xsmall: 3rem;
12
+ --display-small: 3.25rem;
13
+ --display-medium: 3.5rem;
14
+ --display-large: 3.75rem;
15
+ --display-xlarge: 4rem;
16
+
17
+ --display-xxsmall-mobile: 2.125rem;
18
+ --display-xsmall-mobile: 2.25rem;
19
+ --display-small-mobile: 2.375rem;
20
+ --display-medium-mobile: 2.5rem;
21
+ --display-large-mobile: 2.75rem;
22
+ --display-xlarge-mobile: 3rem;
23
+
24
+ --display-xlarge-line-height: 1.1;
25
+ --display-medium-line-height: 1.15;
26
+ --display-xlarge-mobile-line-height: 1.15;
27
+ --display-medium-mobile-line-height: 1.2;
28
+
29
+ /* Heading sizes (legacy names — map to current scale) */
30
+ --heading-xxsmall: var(--typography-fontSize-lg);
31
+ --heading-xsmall: var(--typography-fontSize-xl);
32
+ --heading-medium: 1.75rem;
33
+ --heading-xlarge: var(--typography-fontSize-4xl);
34
+ --heading-xxlarge: 2.5rem;
35
+ --heading-xlarge-line-height: 1.2;
36
+ --typography-heading-h4-fontSize-line-height: 1.3;
37
+
38
+ /* Body sizes (legacy names) */
39
+ --body-small: 0.8125rem;
40
+ --body-xlarge: var(--typography-fontSize-lg);
41
+ --typography-body-regular-fontSize-line-height: var(--typography-lineHeight-normal);
42
+ --typography-label-small-fontSize-line-height: 1.35;
43
+
44
+ /* Font family shorthand (legacy) */
45
+ --font-family-mono: var(--typography-fontFamily-mono);
46
+ --font-weight-mono-light: var(--typography-fontWeight-light);
47
+ --font-weight-mono-regular: var(--typography-fontWeight-normal);
48
+ --font-weight-mono-medium: var(--typography-fontWeight-medium);
49
+ --font-weight-mono-semibold: var(--typography-fontWeight-semibold);
50
+ --font-weight-mono-bold: var(--typography-fontWeight-bold);
51
+ --font-style-mono-normal: normal;
52
+ --font-style-mono-italic: italic;
53
+
54
+ --font-weight-sans-light: var(--typography-fontWeight-light);
55
+ --font-weight-sans-medium: var(--typography-fontWeight-medium);
56
+ --font-style-sans-normal: normal;
57
+ --font-style-sans-italic: italic;
58
+ `;