@jjlmoya/utils-social 1.8.0 → 1.10.0

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 (32) hide show
  1. package/package.json +7 -4
  2. package/scripts/postinstall.mjs +27 -0
  3. package/src/entries.ts +23 -0
  4. package/src/tool/redditFormatter/component.astro +0 -128
  5. package/src/tool/redditFormatter/entry.ts +30 -0
  6. package/src/tool/redditFormatter/index.ts +2 -32
  7. package/src/tool/redditFormatter/reddit-text-formatter.css +126 -0
  8. package/src/tool/safeZones/component.astro +0 -514
  9. package/src/tool/safeZones/entry.ts +30 -0
  10. package/src/tool/safeZones/index.ts +2 -32
  11. package/src/tool/safeZones/social-safe-zones.css +512 -0
  12. package/src/tool/socialImageResizer/component.astro +0 -315
  13. package/src/tool/socialImageResizer/entry.ts +30 -0
  14. package/src/tool/socialImageResizer/index.ts +2 -32
  15. package/src/tool/socialImageResizer/social-media-image-resizer.css +313 -0
  16. package/src/tool/socialValueCalculator/component.astro +0 -526
  17. package/src/tool/socialValueCalculator/entry.ts +30 -0
  18. package/src/tool/socialValueCalculator/index.ts +2 -32
  19. package/src/tool/socialValueCalculator/social-account-value-calculator.css +524 -0
  20. package/src/tool/tinderPhotoOptimizer/component.astro +0 -900
  21. package/src/tool/tinderPhotoOptimizer/entry.ts +30 -0
  22. package/src/tool/tinderPhotoOptimizer/index.ts +2 -32
  23. package/src/tool/tinderPhotoOptimizer/tinder-photo-optimizer.css +898 -0
  24. package/src/tool/youtubeThumbnail/component.astro +0 -267
  25. package/src/tool/youtubeThumbnail/entry.ts +30 -0
  26. package/src/tool/youtubeThumbnail/index.ts +2 -32
  27. package/src/tool/youtubeThumbnail/youtube-thumbnail-extractor.css +265 -0
  28. package/src/tool/youtubeThumbnailPreviewer/component.astro +0 -558
  29. package/src/tool/youtubeThumbnailPreviewer/entry.ts +46 -0
  30. package/src/tool/youtubeThumbnailPreviewer/index.ts +2 -48
  31. package/src/tool/youtubeThumbnailPreviewer/youtube-thumbnail-previewer.css +273 -0
  32. package/src/tools.ts +1 -1
package/package.json CHANGED
@@ -1,15 +1,17 @@
1
1
  {
2
2
  "name": "@jjlmoya/utils-social",
3
- "version": "1.8.0",
3
+ "version": "1.10.0",
4
4
  "type": "module",
5
5
  "main": "./src/index.ts",
6
6
  "types": "./src/index.ts",
7
7
  "exports": {
8
8
  ".": "./src/index.ts",
9
- "./data": "./src/data.ts"
9
+ "./data": "./src/data.ts",
10
+ "./entries": "./src/entries.ts"
10
11
  },
11
12
  "files": [
12
- "src"
13
+ "src",
14
+ "scripts"
13
15
  ],
14
16
  "publishConfig": {
15
17
  "access": "public"
@@ -28,7 +30,8 @@
28
30
  "postversion": "git push && git push --tags",
29
31
  "patch": "npm version patch",
30
32
  "minor": "npm version minor",
31
- "major": "npm version major"
33
+ "major": "npm version major",
34
+ "postinstall": "node scripts/postinstall.mjs"
32
35
  },
33
36
  "lint-staged": {
34
37
  "*.{ts,tsx,astro}": [
@@ -0,0 +1,27 @@
1
+ import { readFileSync, writeFileSync, mkdirSync, readdirSync } from 'fs';
2
+ import { join, dirname } from 'path';
3
+ import { fileURLToPath } from 'url';
4
+
5
+ const libDir = dirname(fileURLToPath(import.meta.url));
6
+ const toolsDir = join(libDir, '../src/tool');
7
+
8
+ const inNodeModules = libDir.includes('node_modules');
9
+ if (!inNodeModules) process.exit(0);
10
+
11
+ const projectRoot = join(libDir, '../../../..');
12
+ const categoryKey = JSON.parse(readFileSync(join(libDir, '../package.json'), 'utf8')).name.replace('@jjlmoya/utils-', '');
13
+ const destDir = join(projectRoot, `public/styles/lib/${categoryKey}`);
14
+
15
+ mkdirSync(destDir, { recursive: true });
16
+
17
+ const tools = readdirSync(toolsDir, { withFileTypes: true }).filter(d => d.isDirectory());
18
+ for (const tool of tools) {
19
+ const toolDir = join(toolsDir, tool.name);
20
+ let files;
21
+ try { files = readdirSync(toolDir).filter(f => f.endsWith('.css')); }
22
+ catch { continue; }
23
+ for (const file of files) {
24
+ writeFileSync(join(destDir, file), readFileSync(join(toolDir, file)));
25
+ console.log(`[@jjlmoya/utils-${categoryKey}] copied ${file}`);
26
+ }
27
+ }
package/src/entries.ts ADDED
@@ -0,0 +1,23 @@
1
+ export { redditFormatter } from './tool/redditFormatter/entry';
2
+ export type { RedditFormatterLocaleContent } from './tool/redditFormatter/entry';
3
+ export { safeZones } from './tool/safeZones/entry';
4
+ export type { SafeZonesLocaleContent } from './tool/safeZones/entry';
5
+ export { socialImageResizer } from './tool/socialImageResizer/entry';
6
+ export type { SocialImageResizerLocaleContent } from './tool/socialImageResizer/entry';
7
+ export { socialValueCalculator } from './tool/socialValueCalculator/entry';
8
+ export type { SocialValueCalculatorLocaleContent } from './tool/socialValueCalculator/entry';
9
+ export { tinderPhotoOptimizer } from './tool/tinderPhotoOptimizer/entry';
10
+ export type { TinderPhotoOptimizerLocaleContent } from './tool/tinderPhotoOptimizer/entry';
11
+ export { youtubeThumbnail } from './tool/youtubeThumbnail/entry';
12
+ export type { YoutubeThumbnailLocaleContent } from './tool/youtubeThumbnail/entry';
13
+ export { youtubeThumbnailPreviewer } from './tool/youtubeThumbnailPreviewer/entry';
14
+ export type { YoutubeThumbnailPreviewerLocaleContent } from './tool/youtubeThumbnailPreviewer/entry';
15
+ export { socialCategory } from './category';
16
+ import { redditFormatter } from './tool/redditFormatter/entry';
17
+ import { safeZones } from './tool/safeZones/entry';
18
+ import { socialImageResizer } from './tool/socialImageResizer/entry';
19
+ import { socialValueCalculator } from './tool/socialValueCalculator/entry';
20
+ import { tinderPhotoOptimizer } from './tool/tinderPhotoOptimizer/entry';
21
+ import { youtubeThumbnail } from './tool/youtubeThumbnail/entry';
22
+ import { youtubeThumbnailPreviewer } from './tool/youtubeThumbnailPreviewer/entry';
23
+ export const ALL_ENTRIES = [redditFormatter, safeZones, socialImageResizer, socialValueCalculator, tinderPhotoOptimizer, youtubeThumbnail, youtubeThumbnailPreviewer];
@@ -116,131 +116,3 @@ const t = (ui ?? {}) as RedditFormatterUI;
116
116
  init();
117
117
  </script>
118
118
 
119
- <style>
120
- .rdf-root {
121
- --bg: rgba(255, 255, 255, 0.4);
122
- --border: rgba(255, 255, 255, 0.6);
123
- --label: #334155;
124
- --textarea-bg: #fff;
125
- --textarea-border: #ddd;
126
- --textarea-text: #111;
127
- --controls-bg: rgba(255, 255, 255, 0.7);
128
- --controls-border: #eaeaea;
129
- --checkbox-color: #444;
130
-
131
- padding: 2rem;
132
- background: var(--bg);
133
- backdrop-filter: blur(12px);
134
- -webkit-backdrop-filter: blur(12px);
135
- border-radius: 16px;
136
- border: 1px solid var(--border);
137
- box-shadow: 0 4px 30px rgba(0, 0, 0, 0.05);
138
- }
139
-
140
- :global(.theme-dark) .rdf-root {
141
- --bg: rgba(15, 23, 42, 0.6);
142
- --border: rgba(255, 255, 255, 0.08);
143
- --label: #94a3b8;
144
- --textarea-bg: #0f172a;
145
- --textarea-border: rgba(255, 255, 255, 0.1);
146
- --textarea-text: #f1f5f9;
147
- --controls-bg: rgba(255, 255, 255, 0.03);
148
- --controls-border: rgba(255, 255, 255, 0.08);
149
- --checkbox-color: #94a3b8;
150
- }
151
-
152
- .rdf-grid {
153
- display: flex;
154
- flex-direction: column;
155
- gap: 1.5rem;
156
- }
157
-
158
- .rdf-panel {
159
- display: flex;
160
- flex-direction: column;
161
- gap: 0.5rem;
162
- }
163
-
164
- .rdf-label {
165
- font-weight: 600;
166
- color: var(--label);
167
- font-size: 0.95rem;
168
- }
169
-
170
- .rdf-textarea {
171
- width: 100%;
172
- min-height: 220px;
173
- padding: 1rem;
174
- border-radius: 8px;
175
- border: 1px solid var(--textarea-border);
176
- background: var(--textarea-bg);
177
- font-size: 1rem;
178
- color: var(--textarea-text);
179
- resize: vertical;
180
- transition: border-color 0.2s;
181
- line-height: 1.6;
182
- box-sizing: border-box;
183
- }
184
-
185
- .rdf-textarea:focus {
186
- outline: none;
187
- border-color: #ff4500;
188
- box-shadow: 0 0 0 3px rgba(255, 69, 0, 0.1);
189
- }
190
-
191
- .rdf-controls {
192
- display: flex;
193
- flex-direction: column;
194
- gap: 0.75rem;
195
- background: var(--controls-bg);
196
- padding: 1.5rem;
197
- border-radius: 8px;
198
- border: 1px solid var(--controls-border);
199
- }
200
-
201
- .rdf-checkbox-group {
202
- display: grid;
203
- grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
204
- gap: 0.75rem;
205
- margin-top: 0.25rem;
206
- }
207
-
208
- .rdf-checkbox-label {
209
- display: flex;
210
- align-items: center;
211
- gap: 0.75rem;
212
- cursor: pointer;
213
- font-size: 0.95rem;
214
- color: var(--checkbox-color);
215
- font-weight: 500;
216
- }
217
-
218
- .rdf-checkbox-label input[type='checkbox'] {
219
- width: 1.25rem;
220
- height: 1.25rem;
221
- accent-color: #ff4500;
222
- cursor: pointer;
223
- flex-shrink: 0;
224
- }
225
-
226
- .rdf-output-header {
227
- display: flex;
228
- justify-content: space-between;
229
- align-items: center;
230
- }
231
-
232
- .rdf-copy-btn {
233
- background: #ff4500;
234
- color: #fff;
235
- border: none;
236
- padding: 0.6rem 1.25rem;
237
- border-radius: 6px;
238
- font-weight: 600;
239
- font-size: 0.9rem;
240
- cursor: pointer;
241
- transition: background-color 0.2s, transform 0.1s;
242
- }
243
-
244
- .rdf-copy-btn:hover { background: #e03d00; }
245
- .rdf-copy-btn:active { transform: scale(0.97); }
246
- </style>
@@ -0,0 +1,30 @@
1
+ import type { SocialToolEntry, ToolLocaleContent } from '../../types';
2
+
3
+
4
+ import type { RedditFormatterUI } from './ui';
5
+ export type RedditFormatterLocaleContent = ToolLocaleContent<RedditFormatterUI>;
6
+
7
+ export const redditFormatter: SocialToolEntry<RedditFormatterUI> = {
8
+ id: 'reddit-formatter',
9
+ icons: {
10
+ bg: 'mdi:reddit',
11
+ fg: 'mdi:format-text-rotation-none',
12
+ },
13
+ i18n: {
14
+ es: () => import('./i18n/es').then((m) => m.content),
15
+ en: () => import('./i18n/en').then((m) => m.content),
16
+ fr: () => import('./i18n/fr').then((m) => m.content),
17
+ de: () => import('./i18n/de').then((m) => m.content),
18
+ id: () => import('./i18n/id').then((m) => m.content),
19
+ it: () => import('./i18n/it').then((m) => m.content),
20
+ ja: () => import('./i18n/ja').then((m) => m.content),
21
+ ko: () => import('./i18n/ko').then((m) => m.content),
22
+ nl: () => import('./i18n/nl').then((m) => m.content),
23
+ pl: () => import('./i18n/pl').then((m) => m.content),
24
+ pt: () => import('./i18n/pt').then((m) => m.content),
25
+ ru: () => import('./i18n/ru').then((m) => m.content),
26
+ sv: () => import('./i18n/sv').then((m) => m.content),
27
+ tr: () => import('./i18n/tr').then((m) => m.content),
28
+ zh: () => import('./i18n/zh').then((m) => m.content),
29
+ },
30
+ };
@@ -1,35 +1,5 @@
1
- import type { SocialToolEntry, ToolLocaleContent, ToolDefinition } from '../../types';
2
-
3
-
4
- import type { RedditFormatterUI } from './ui';
5
- export type RedditFormatterLocaleContent = ToolLocaleContent<RedditFormatterUI>;
6
-
7
- export const redditFormatter: SocialToolEntry<RedditFormatterUI> = {
8
- id: 'reddit-formatter',
9
- icons: {
10
- bg: 'mdi:reddit',
11
- fg: 'mdi:format-text-rotation-none',
12
- },
13
- i18n: {
14
- es: () => import('./i18n/es').then((m) => m.content),
15
- en: () => import('./i18n/en').then((m) => m.content),
16
- fr: () => import('./i18n/fr').then((m) => m.content),
17
- de: () => import('./i18n/de').then((m) => m.content),
18
- id: () => import('./i18n/id').then((m) => m.content),
19
- it: () => import('./i18n/it').then((m) => m.content),
20
- ja: () => import('./i18n/ja').then((m) => m.content),
21
- ko: () => import('./i18n/ko').then((m) => m.content),
22
- nl: () => import('./i18n/nl').then((m) => m.content),
23
- pl: () => import('./i18n/pl').then((m) => m.content),
24
- pt: () => import('./i18n/pt').then((m) => m.content),
25
- ru: () => import('./i18n/ru').then((m) => m.content),
26
- sv: () => import('./i18n/sv').then((m) => m.content),
27
- tr: () => import('./i18n/tr').then((m) => m.content),
28
- zh: () => import('./i18n/zh').then((m) => m.content),
29
- },
30
- };
31
-
32
-
1
+ import { redditFormatter } from './entry';
2
+ export * from './entry';
33
3
  export const REDDIT_FORMATTER_TOOL: ToolDefinition = {
34
4
  entry: redditFormatter,
35
5
  Component: () => import('./component.astro'),
@@ -0,0 +1,126 @@
1
+ .rdf-root {
2
+ --bg: rgba(255, 255, 255, 0.4);
3
+ --border: rgba(255, 255, 255, 0.6);
4
+ --label: #334155;
5
+ --textarea-bg: #fff;
6
+ --textarea-border: #ddd;
7
+ --textarea-text: #111;
8
+ --controls-bg: rgba(255, 255, 255, 0.7);
9
+ --controls-border: #eaeaea;
10
+ --checkbox-color: #444;
11
+
12
+ padding: 2rem;
13
+ background: var(--bg);
14
+ backdrop-filter: blur(12px);
15
+ -webkit-backdrop-filter: blur(12px);
16
+ border-radius: 16px;
17
+ border: 1px solid var(--border);
18
+ box-shadow: 0 4px 30px rgba(0, 0, 0, 0.05);
19
+ }
20
+
21
+ :global(.theme-dark) .rdf-root {
22
+ --bg: rgba(15, 23, 42, 0.6);
23
+ --border: rgba(255, 255, 255, 0.08);
24
+ --label: #94a3b8;
25
+ --textarea-bg: #0f172a;
26
+ --textarea-border: rgba(255, 255, 255, 0.1);
27
+ --textarea-text: #f1f5f9;
28
+ --controls-bg: rgba(255, 255, 255, 0.03);
29
+ --controls-border: rgba(255, 255, 255, 0.08);
30
+ --checkbox-color: #94a3b8;
31
+ }
32
+
33
+ .rdf-grid {
34
+ display: flex;
35
+ flex-direction: column;
36
+ gap: 1.5rem;
37
+ }
38
+
39
+ .rdf-panel {
40
+ display: flex;
41
+ flex-direction: column;
42
+ gap: 0.5rem;
43
+ }
44
+
45
+ .rdf-label {
46
+ font-weight: 600;
47
+ color: var(--label);
48
+ font-size: 0.95rem;
49
+ }
50
+
51
+ .rdf-textarea {
52
+ width: 100%;
53
+ min-height: 220px;
54
+ padding: 1rem;
55
+ border-radius: 8px;
56
+ border: 1px solid var(--textarea-border);
57
+ background: var(--textarea-bg);
58
+ font-size: 1rem;
59
+ color: var(--textarea-text);
60
+ resize: vertical;
61
+ transition: border-color 0.2s;
62
+ line-height: 1.6;
63
+ box-sizing: border-box;
64
+ }
65
+
66
+ .rdf-textarea:focus {
67
+ outline: none;
68
+ border-color: #ff4500;
69
+ box-shadow: 0 0 0 3px rgba(255, 69, 0, 0.1);
70
+ }
71
+
72
+ .rdf-controls {
73
+ display: flex;
74
+ flex-direction: column;
75
+ gap: 0.75rem;
76
+ background: var(--controls-bg);
77
+ padding: 1.5rem;
78
+ border-radius: 8px;
79
+ border: 1px solid var(--controls-border);
80
+ }
81
+
82
+ .rdf-checkbox-group {
83
+ display: grid;
84
+ grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
85
+ gap: 0.75rem;
86
+ margin-top: 0.25rem;
87
+ }
88
+
89
+ .rdf-checkbox-label {
90
+ display: flex;
91
+ align-items: center;
92
+ gap: 0.75rem;
93
+ cursor: pointer;
94
+ font-size: 0.95rem;
95
+ color: var(--checkbox-color);
96
+ font-weight: 500;
97
+ }
98
+
99
+ .rdf-checkbox-label input[type='checkbox'] {
100
+ width: 1.25rem;
101
+ height: 1.25rem;
102
+ accent-color: #ff4500;
103
+ cursor: pointer;
104
+ flex-shrink: 0;
105
+ }
106
+
107
+ .rdf-output-header {
108
+ display: flex;
109
+ justify-content: space-between;
110
+ align-items: center;
111
+ }
112
+
113
+ .rdf-copy-btn {
114
+ background: #ff4500;
115
+ color: #fff;
116
+ border: none;
117
+ padding: 0.6rem 1.25rem;
118
+ border-radius: 6px;
119
+ font-weight: 600;
120
+ font-size: 0.9rem;
121
+ cursor: pointer;
122
+ transition: background-color 0.2s, transform 0.1s;
123
+ }
124
+
125
+ .rdf-copy-btn:hover { background: #e03d00; }
126
+ .rdf-copy-btn:active { transform: scale(0.97); }