lapikit 0.0.0-insiders.df219d7 → 0.0.0-insiders.e4d0a84
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.
- package/bin/configuration.js +298 -0
- package/bin/index.js +23 -47
- package/bin/legacy.js +34 -0
- package/bin/modules/adapter.js +3 -3
- package/bin/presets.js +25 -0
- package/bin/prompts.js +100 -0
- package/dist/components/chip/chip.css +4 -4
- package/dist/components/chip/chip.svelte +5 -3
- package/dist/components/chip/types.d.ts +1 -0
- package/dist/components/dialog/dialog.css +3 -1
- package/dist/components/modal/modal.css +7 -6
- package/dist/index.d.ts +10 -1
- package/dist/index.js +9 -3
- package/dist/stores/breakpoints.d.ts +6 -0
- package/dist/stores/breakpoints.js +23 -0
- package/dist/stores/index.d.ts +1 -0
- package/dist/stores/index.js +1 -0
- package/package.json +1 -1
|
@@ -0,0 +1,298 @@
|
|
|
1
|
+
#!/usr/bin/env node
|
|
2
|
+
import { promises as fs } from 'fs';
|
|
3
|
+
import path from 'path';
|
|
4
|
+
import { terminal } from './helper.js';
|
|
5
|
+
import presets from './presets.js';
|
|
6
|
+
|
|
7
|
+
async function findReferenceFile(projectPath) {
|
|
8
|
+
const routesPath = path.join(projectPath, 'src', 'routes');
|
|
9
|
+
|
|
10
|
+
try {
|
|
11
|
+
await fs.access(routesPath);
|
|
12
|
+
} catch {
|
|
13
|
+
terminal('error', `Lapikit cannot find the routes/ directory.`);
|
|
14
|
+
// throw new Error('Lapikit cannot find the routes/ directory.');
|
|
15
|
+
}
|
|
16
|
+
|
|
17
|
+
const layoutFile = path.join(routesPath, '+layout.svelte');
|
|
18
|
+
try {
|
|
19
|
+
await fs.access(layoutFile);
|
|
20
|
+
return layoutFile;
|
|
21
|
+
} catch {
|
|
22
|
+
// +layout.svelte not found in routes/
|
|
23
|
+
}
|
|
24
|
+
|
|
25
|
+
const pageFile = path.join(routesPath, '+page.svelte');
|
|
26
|
+
try {
|
|
27
|
+
await fs.access(pageFile);
|
|
28
|
+
return pageFile;
|
|
29
|
+
} catch {
|
|
30
|
+
// +page.svelte not found in routes/
|
|
31
|
+
}
|
|
32
|
+
|
|
33
|
+
try {
|
|
34
|
+
const entries = await fs.readdir(routesPath, { withFileTypes: true });
|
|
35
|
+
const subDirectories = entries.filter((entry) => entry.isDirectory());
|
|
36
|
+
|
|
37
|
+
for (const dir of subDirectories) {
|
|
38
|
+
const subDirPath = path.join(routesPath, dir.name);
|
|
39
|
+
|
|
40
|
+
const subLayoutFile = path.join(subDirPath, '+layout.svelte');
|
|
41
|
+
try {
|
|
42
|
+
await fs.access(subLayoutFile);
|
|
43
|
+
return subLayoutFile;
|
|
44
|
+
} catch {
|
|
45
|
+
// +layout.svelte not found in subdirectory
|
|
46
|
+
}
|
|
47
|
+
|
|
48
|
+
const subPageFile = path.join(subDirPath, '+page.svelte');
|
|
49
|
+
try {
|
|
50
|
+
await fs.access(subPageFile);
|
|
51
|
+
return subPageFile;
|
|
52
|
+
} catch {
|
|
53
|
+
// +page.svelte not found in subdirectory
|
|
54
|
+
}
|
|
55
|
+
}
|
|
56
|
+
} catch {
|
|
57
|
+
// Error reading routes directory
|
|
58
|
+
}
|
|
59
|
+
|
|
60
|
+
throw new Error('Not found +layout or +page main on your project.');
|
|
61
|
+
}
|
|
62
|
+
|
|
63
|
+
async function addImportToReferenceFile(targetFile, referenceFile) {
|
|
64
|
+
try {
|
|
65
|
+
const content = await fs.readFile(referenceFile, 'utf-8');
|
|
66
|
+
const relativePath = path.relative(path.dirname(referenceFile), targetFile);
|
|
67
|
+
const importStatement = `import "${relativePath.startsWith('.') ? relativePath : './' + relativePath}";\n`;
|
|
68
|
+
|
|
69
|
+
if (content.includes(`import "${relativePath}"`)) {
|
|
70
|
+
terminal('info', `Import statement already exists in ${referenceFile}`);
|
|
71
|
+
return;
|
|
72
|
+
}
|
|
73
|
+
|
|
74
|
+
const lines = content.split('\n');
|
|
75
|
+
let insertIndex = -1;
|
|
76
|
+
|
|
77
|
+
for (let i = 0; i < lines.length; i++) {
|
|
78
|
+
const line = lines[i].trim();
|
|
79
|
+
if (line.startsWith('<script>') || line.startsWith('<script lang="ts">')) {
|
|
80
|
+
insertIndex = i + 1;
|
|
81
|
+
break;
|
|
82
|
+
}
|
|
83
|
+
}
|
|
84
|
+
|
|
85
|
+
if (insertIndex === -1) {
|
|
86
|
+
throw new Error(`No found balise <script> ou <script lang="ts"> ${referenceFile}`);
|
|
87
|
+
}
|
|
88
|
+
|
|
89
|
+
let finalInsertIndex = insertIndex;
|
|
90
|
+
for (let i = insertIndex; i < lines.length; i++) {
|
|
91
|
+
const line = lines[i].trim();
|
|
92
|
+
|
|
93
|
+
if (line === '</script>') {
|
|
94
|
+
break;
|
|
95
|
+
}
|
|
96
|
+
|
|
97
|
+
if (line === '' || line.startsWith('import ') || line.startsWith('//')) {
|
|
98
|
+
finalInsertIndex = i + 1;
|
|
99
|
+
} else {
|
|
100
|
+
break;
|
|
101
|
+
}
|
|
102
|
+
}
|
|
103
|
+
|
|
104
|
+
lines.splice(finalInsertIndex, 0, `\t${importStatement.trim()}`);
|
|
105
|
+
const newContent = lines.join('\n');
|
|
106
|
+
|
|
107
|
+
await fs.writeFile(referenceFile, newContent);
|
|
108
|
+
terminal('info', `Import has been added to ${referenceFile}`);
|
|
109
|
+
} catch (error) {
|
|
110
|
+
terminal('error', `Error adding import: ${error.message}`);
|
|
111
|
+
throw error;
|
|
112
|
+
}
|
|
113
|
+
}
|
|
114
|
+
|
|
115
|
+
async function findViteConfigFile(projectPath, typescript) {
|
|
116
|
+
const ext = typescript ? 'ts' : 'js';
|
|
117
|
+
const viteConfigFile = path.join(projectPath, `vite.config.${ext}`);
|
|
118
|
+
|
|
119
|
+
try {
|
|
120
|
+
await fs.access(viteConfigFile);
|
|
121
|
+
return viteConfigFile;
|
|
122
|
+
} catch {
|
|
123
|
+
// Try the other extension if the preferred one doesn't exist
|
|
124
|
+
const alternativeExt = typescript ? 'js' : 'ts';
|
|
125
|
+
const alternativeFile = path.join(projectPath, `vite.config.${alternativeExt}`);
|
|
126
|
+
|
|
127
|
+
try {
|
|
128
|
+
await fs.access(alternativeFile);
|
|
129
|
+
return alternativeFile;
|
|
130
|
+
} catch {
|
|
131
|
+
throw new Error(`No vite.config.js or vite.config.ts file found in ${projectPath}`);
|
|
132
|
+
}
|
|
133
|
+
}
|
|
134
|
+
}
|
|
135
|
+
|
|
136
|
+
async function addLapikitToViteConfig(viteConfigFile) {
|
|
137
|
+
try {
|
|
138
|
+
const content = await fs.readFile(viteConfigFile, 'utf-8');
|
|
139
|
+
const lapikitImport = `import { lapikit } from 'lapikit/vite';`;
|
|
140
|
+
|
|
141
|
+
// Check if lapikit import already exists
|
|
142
|
+
if (content.includes(lapikitImport) || content.includes(`from 'lapikit/vite'`)) {
|
|
143
|
+
terminal('info', `Lapikit import already exists in ${viteConfigFile}`);
|
|
144
|
+
return;
|
|
145
|
+
}
|
|
146
|
+
|
|
147
|
+
const lines = content.split('\n');
|
|
148
|
+
let importInsertIndex = -1;
|
|
149
|
+
let pluginAdded = false;
|
|
150
|
+
|
|
151
|
+
// Find where to insert the import (after other imports)
|
|
152
|
+
for (let i = 0; i < lines.length; i++) {
|
|
153
|
+
const line = lines[i].trim();
|
|
154
|
+
|
|
155
|
+
if (line.startsWith('import ') && !line.includes('type ')) {
|
|
156
|
+
importInsertIndex = i + 1;
|
|
157
|
+
} else if (
|
|
158
|
+
line === '' &&
|
|
159
|
+
importInsertIndex !== -1 &&
|
|
160
|
+
lines[i + 1] &&
|
|
161
|
+
!lines[i + 1].trim().startsWith('import ')
|
|
162
|
+
) {
|
|
163
|
+
importInsertIndex = i;
|
|
164
|
+
break;
|
|
165
|
+
}
|
|
166
|
+
}
|
|
167
|
+
|
|
168
|
+
// If no imports found, insert at the beginning
|
|
169
|
+
if (importInsertIndex === -1) {
|
|
170
|
+
importInsertIndex = 0;
|
|
171
|
+
}
|
|
172
|
+
|
|
173
|
+
// Insert the lapikit import
|
|
174
|
+
lines.splice(importInsertIndex, 0, lapikitImport);
|
|
175
|
+
|
|
176
|
+
// Find and update the plugins array
|
|
177
|
+
for (let i = 0; i < lines.length; i++) {
|
|
178
|
+
const line = lines[i].trim();
|
|
179
|
+
|
|
180
|
+
if (line.includes('plugins:') && line.includes('[') && line.includes(']')) {
|
|
181
|
+
// Single line plugins array
|
|
182
|
+
if (line.includes('sveltekit()')) {
|
|
183
|
+
const pluginMatch = line.match(/plugins:\s*\[(.*)\]/);
|
|
184
|
+
if (pluginMatch) {
|
|
185
|
+
const pluginsContent = pluginMatch[1];
|
|
186
|
+
if (!pluginsContent.includes('lapikit()')) {
|
|
187
|
+
const newPluginsContent = pluginsContent.replace(
|
|
188
|
+
/sveltekit\(\)/,
|
|
189
|
+
'sveltekit(), lapikit()'
|
|
190
|
+
);
|
|
191
|
+
lines[i] = line.replace(pluginsContent, newPluginsContent);
|
|
192
|
+
pluginAdded = true;
|
|
193
|
+
}
|
|
194
|
+
}
|
|
195
|
+
}
|
|
196
|
+
break;
|
|
197
|
+
} else if (line.includes('plugins:') && line.includes('[') && !line.includes(']')) {
|
|
198
|
+
// Multi-line plugins array start
|
|
199
|
+
for (let j = i; j < lines.length; j++) {
|
|
200
|
+
const pluginLine = lines[j].trim();
|
|
201
|
+
|
|
202
|
+
if (pluginLine.includes('sveltekit()') && !pluginAdded) {
|
|
203
|
+
// Check if lapikit() is not already present
|
|
204
|
+
let hasLapikit = false;
|
|
205
|
+
for (let k = i; k < lines.length && !lines[k].includes(']'); k++) {
|
|
206
|
+
if (lines[k].includes('lapikit()')) {
|
|
207
|
+
hasLapikit = true;
|
|
208
|
+
break;
|
|
209
|
+
}
|
|
210
|
+
}
|
|
211
|
+
|
|
212
|
+
if (!hasLapikit) {
|
|
213
|
+
// Add lapikit() after sveltekit()
|
|
214
|
+
if (pluginLine.includes(',')) {
|
|
215
|
+
lines[j] = lines[j].replace('sveltekit()', 'sveltekit(), lapikit()');
|
|
216
|
+
} else {
|
|
217
|
+
lines[j] = lines[j].replace('sveltekit()', 'sveltekit(),');
|
|
218
|
+
// Insert lapikit() on the next line with proper indentation
|
|
219
|
+
const indentation = lines[j].match(/^\s*/)[0];
|
|
220
|
+
lines.splice(j + 1, 0, `${indentation}lapikit()`);
|
|
221
|
+
}
|
|
222
|
+
pluginAdded = true;
|
|
223
|
+
}
|
|
224
|
+
break;
|
|
225
|
+
}
|
|
226
|
+
|
|
227
|
+
if (pluginLine.includes(']')) {
|
|
228
|
+
break;
|
|
229
|
+
}
|
|
230
|
+
}
|
|
231
|
+
break;
|
|
232
|
+
}
|
|
233
|
+
}
|
|
234
|
+
|
|
235
|
+
if (!pluginAdded) {
|
|
236
|
+
terminal('warn', `Could not find sveltekit() in plugins array to add lapikit() after it`);
|
|
237
|
+
}
|
|
238
|
+
|
|
239
|
+
const newContent = lines.join('\n');
|
|
240
|
+
await fs.writeFile(viteConfigFile, newContent);
|
|
241
|
+
terminal('info', `Lapikit import and plugin added to ${viteConfigFile}`);
|
|
242
|
+
} catch (error) {
|
|
243
|
+
terminal('error', `Error adding lapikit to vite config: ${error.message}`);
|
|
244
|
+
throw error;
|
|
245
|
+
}
|
|
246
|
+
}
|
|
247
|
+
|
|
248
|
+
export async function initConfiguration(options) {
|
|
249
|
+
const { typescript, pathConfig, formatCSS } = options;
|
|
250
|
+
const ext = typescript ? 'ts' : 'js';
|
|
251
|
+
const targetDir = path.resolve(process.cwd(), pathConfig);
|
|
252
|
+
const targetFile = path.join(targetDir, `lapikit.${ext}`);
|
|
253
|
+
|
|
254
|
+
await fs.mkdir(targetDir, { recursive: true });
|
|
255
|
+
|
|
256
|
+
let fileCreated = false;
|
|
257
|
+
|
|
258
|
+
// Create Lapikit config
|
|
259
|
+
try {
|
|
260
|
+
await fs.access(targetFile);
|
|
261
|
+
terminal('info', `File ${targetFile} already exists.`);
|
|
262
|
+
} catch {
|
|
263
|
+
terminal('info', `Creating file: ${targetFile}`);
|
|
264
|
+
const content = presets({
|
|
265
|
+
adapterCSS: formatCSS
|
|
266
|
+
});
|
|
267
|
+
await fs.writeFile(targetFile, content);
|
|
268
|
+
terminal('info', `File created: ${targetFile}`);
|
|
269
|
+
fileCreated = true;
|
|
270
|
+
}
|
|
271
|
+
|
|
272
|
+
// Add Import Lapikit plugin
|
|
273
|
+
try {
|
|
274
|
+
const referenceFile = await findReferenceFile(process.cwd());
|
|
275
|
+
await addImportToReferenceFile(targetFile, referenceFile);
|
|
276
|
+
} catch (error) {
|
|
277
|
+
terminal('error', `Error adding import: ${error.message}`);
|
|
278
|
+
|
|
279
|
+
if (fileCreated) {
|
|
280
|
+
try {
|
|
281
|
+
await fs.unlink(targetFile);
|
|
282
|
+
terminal('info', `File ${targetFile} deleted due to error.`);
|
|
283
|
+
} catch {
|
|
284
|
+
// Ignore deletion error
|
|
285
|
+
}
|
|
286
|
+
}
|
|
287
|
+
throw error;
|
|
288
|
+
}
|
|
289
|
+
|
|
290
|
+
// Add lapikit to vite.config file
|
|
291
|
+
try {
|
|
292
|
+
const viteConfigFile = await findViteConfigFile(process.cwd(), typescript);
|
|
293
|
+
await addLapikitToViteConfig(viteConfigFile);
|
|
294
|
+
} catch (error) {
|
|
295
|
+
terminal('warn', `Warning: Could not update vite.config file: ${error.message}`);
|
|
296
|
+
terminal('error', `Error adding lapikit to vite config: ${error.message}`);
|
|
297
|
+
}
|
|
298
|
+
}
|
package/bin/index.js
CHANGED
|
@@ -1,8 +1,10 @@
|
|
|
1
1
|
#!/usr/bin/env node
|
|
2
|
-
import
|
|
2
|
+
import { initConfiguration } from './configuration.js';
|
|
3
3
|
import { ansi, terminal } from './helper.js';
|
|
4
|
+
import { legacyConfiguration } from './legacy.js';
|
|
5
|
+
import { initPrompts } from './prompts.js';
|
|
4
6
|
|
|
5
|
-
async function
|
|
7
|
+
async function run() {
|
|
6
8
|
console.log(' _ _ _ _ _ ');
|
|
7
9
|
console.log(' | | (_) | (_) | ');
|
|
8
10
|
console.log(' | | __ _ _ __ _| | ___| |_ ');
|
|
@@ -12,54 +14,28 @@ async function main() {
|
|
|
12
14
|
console.log(' | | ');
|
|
13
15
|
console.log(' |_| \n');
|
|
14
16
|
|
|
15
|
-
terminal('none', `${ansi.bold.blue('
|
|
17
|
+
terminal('none', `${ansi.bold.blue('Lapikit')} - Component Library for Svelte\n\n`);
|
|
16
18
|
|
|
17
|
-
const
|
|
18
|
-
type: 'toggle',
|
|
19
|
-
name: 'confirm',
|
|
20
|
-
message: 'Start install Lapikit on your app?',
|
|
21
|
-
initial: true,
|
|
22
|
-
active: 'Yes',
|
|
23
|
-
inactive: 'No'
|
|
24
|
-
});
|
|
19
|
+
const promptsConfig = await initPrompts();
|
|
25
20
|
|
|
26
|
-
if (
|
|
27
|
-
|
|
28
|
-
process.exit(0);
|
|
21
|
+
if (promptsConfig.env === 'current') {
|
|
22
|
+
await legacyConfiguration(promptsConfig);
|
|
29
23
|
}
|
|
30
24
|
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
// message: 'Project name ?',
|
|
36
|
-
// initial: 'lapikit-app'
|
|
37
|
-
// },
|
|
38
|
-
// {
|
|
39
|
-
// type: 'select',
|
|
40
|
-
// name: 'theme',
|
|
41
|
-
// message: 'Choice theme :',
|
|
42
|
-
// choices: [
|
|
43
|
-
// { title: 'Light', value: 'light' },
|
|
44
|
-
// { title: 'Dark', value: 'dark' },
|
|
45
|
-
// { title: 'Auto', value: 'auto' }
|
|
46
|
-
// ],
|
|
47
|
-
// initial: 0
|
|
48
|
-
// },
|
|
49
|
-
// {
|
|
50
|
-
// type: 'toggle',
|
|
51
|
-
// name: 'typescript',
|
|
52
|
-
// message: 'Use TypeScript ?',
|
|
53
|
-
// initial: true,
|
|
54
|
-
// active: 'Yes',
|
|
55
|
-
// inactive: 'No'
|
|
56
|
-
// }
|
|
57
|
-
// ]);
|
|
58
|
-
|
|
59
|
-
// console.log('\n Resume :');
|
|
60
|
-
// console.log(JSON.stringify(response, null, 2));
|
|
61
|
-
|
|
62
|
-
// console.log(`Config : ${configFile}`);
|
|
25
|
+
if (promptsConfig.env === 'experimental') {
|
|
26
|
+
terminal('warn', `Experimental mode is not yet implemented.`);
|
|
27
|
+
await initConfiguration(promptsConfig);
|
|
28
|
+
}
|
|
63
29
|
}
|
|
64
30
|
|
|
65
|
-
|
|
31
|
+
run()
|
|
32
|
+
.then(() => {
|
|
33
|
+
terminal('none', `\n\n\n\nWebsite: https://lapikit.dev`);
|
|
34
|
+
terminal('none', `Github: https://github.com/nycolaide/lapikit`);
|
|
35
|
+
terminal('none', `Support the developement: https://buymeacoffee.com/nycolaide`);
|
|
36
|
+
process.exit(0);
|
|
37
|
+
})
|
|
38
|
+
.catch((error) => {
|
|
39
|
+
terminal('error', `Error: ${error}`);
|
|
40
|
+
process.exit(1);
|
|
41
|
+
});
|
package/bin/legacy.js
ADDED
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
#!/usr/bin/env node
|
|
2
|
+
import { promises as fs } from 'fs';
|
|
3
|
+
import path from 'path';
|
|
4
|
+
import { preset } from './modules/preset.js';
|
|
5
|
+
import { ansi, terminal, envTypescript } from './helper.js';
|
|
6
|
+
import { adapterCSSConfig, adapterViteConfig } from './modules/adapter.js';
|
|
7
|
+
|
|
8
|
+
export async function legacyConfiguration(options) {
|
|
9
|
+
const typescriptEnabled = envTypescript();
|
|
10
|
+
const configPath = path.resolve(process.cwd(), 'lapikit.config.js');
|
|
11
|
+
|
|
12
|
+
try {
|
|
13
|
+
await fs.writeFile(configPath, preset.trim() + '\n', 'utf8');
|
|
14
|
+
terminal('success', `has create lapikit.config.js on your project.`);
|
|
15
|
+
} catch (error) {
|
|
16
|
+
terminal('error', `failed to create configuration file:\n\n ${error}`);
|
|
17
|
+
terminal(
|
|
18
|
+
'warn',
|
|
19
|
+
`you can create lapikit.config.js manually, please visite https://lapikit.dev/docs/getting-started for more information`
|
|
20
|
+
);
|
|
21
|
+
}
|
|
22
|
+
|
|
23
|
+
await adapterViteConfig(typescriptEnabled);
|
|
24
|
+
await adapterCSSConfig(options);
|
|
25
|
+
|
|
26
|
+
terminal(
|
|
27
|
+
'info',
|
|
28
|
+
`${ansi.bold.blue('Thank to use lapikit, discover all posibility with lapikit on https://lapikit.dev')}\n\n`
|
|
29
|
+
);
|
|
30
|
+
|
|
31
|
+
console.log('Website: https://lapikit.dev');
|
|
32
|
+
console.log('Github: https://github.com/nycolaide/lapikit');
|
|
33
|
+
console.log('Support the developement: https://buymeacoffee.com/nycolaide');
|
|
34
|
+
}
|
package/bin/modules/adapter.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { promises as fs } from 'fs';
|
|
2
2
|
import path from 'path';
|
|
3
|
-
import {
|
|
3
|
+
import { terminal } from '../helper.js';
|
|
4
4
|
|
|
5
5
|
const importLapikitVite = `import { lapikit } from 'lapikit/vite';`;
|
|
6
6
|
const importLapikitCss = `@import 'lapikit/css';`;
|
|
@@ -33,8 +33,8 @@ export async function adapterViteConfig(typescript) {
|
|
|
33
33
|
}
|
|
34
34
|
}
|
|
35
35
|
|
|
36
|
-
export async function adapterCSSConfig() {
|
|
37
|
-
const cssPath =
|
|
36
|
+
export async function adapterCSSConfig(options) {
|
|
37
|
+
const cssPath = options?.pathCSS || 'src/app.css';
|
|
38
38
|
const resolvedPath = path.resolve(process.cwd(), cssPath);
|
|
39
39
|
try {
|
|
40
40
|
await fs.access(resolvedPath);
|
package/bin/presets.js
ADDED
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
function presets({ adapterCSS }) {
|
|
2
|
+
let content = '';
|
|
3
|
+
|
|
4
|
+
content += `/**\n`;
|
|
5
|
+
content += ` * Lapikit\n`;
|
|
6
|
+
content += ` * Library documentation: https://lapikit.dev\n`;
|
|
7
|
+
content += ` */\n\n`;
|
|
8
|
+
|
|
9
|
+
if (adapterCSS === 'css') {
|
|
10
|
+
content += `// Styles\n`;
|
|
11
|
+
content += `import 'lapikit/css';\n\n`;
|
|
12
|
+
}
|
|
13
|
+
|
|
14
|
+
content += `// Composables\n`;
|
|
15
|
+
content += `import createLapikit from 'lapikit';\n\n`;
|
|
16
|
+
|
|
17
|
+
content += `// https://lapikit.dev/docs/getting-started\n`;
|
|
18
|
+
content += `export default createLapikit({\n`;
|
|
19
|
+
content += `\tadapterCSS: "${adapterCSS}",\n`;
|
|
20
|
+
content += `\n});`;
|
|
21
|
+
|
|
22
|
+
return content;
|
|
23
|
+
}
|
|
24
|
+
|
|
25
|
+
export default presets;
|
package/bin/prompts.js
ADDED
|
@@ -0,0 +1,100 @@
|
|
|
1
|
+
#!/usr/bin/env node
|
|
2
|
+
import prompts from 'prompts';
|
|
3
|
+
import { terminal } from './helper.js';
|
|
4
|
+
|
|
5
|
+
export async function initPrompts() {
|
|
6
|
+
const { confirm } = await prompts({
|
|
7
|
+
type: 'toggle',
|
|
8
|
+
name: 'confirm',
|
|
9
|
+
message: 'Launch install Lapikit on your project?',
|
|
10
|
+
initial: true,
|
|
11
|
+
active: 'Yes',
|
|
12
|
+
inactive: 'No'
|
|
13
|
+
});
|
|
14
|
+
|
|
15
|
+
if (!confirm) {
|
|
16
|
+
terminal('warn', `installation canceled.`);
|
|
17
|
+
process.exit(0);
|
|
18
|
+
}
|
|
19
|
+
// temps with legacy and new process install
|
|
20
|
+
const { type } = await prompts({
|
|
21
|
+
type: 'select',
|
|
22
|
+
name: 'type',
|
|
23
|
+
message: 'Select installation type:',
|
|
24
|
+
choices: [
|
|
25
|
+
{ title: 'Classic install with lapikit.config.js', value: 'current' },
|
|
26
|
+
{
|
|
27
|
+
title: 'Preview install with new plugin/lapikit.(js|ts) <experimental>',
|
|
28
|
+
value: 'experimental'
|
|
29
|
+
}
|
|
30
|
+
]
|
|
31
|
+
});
|
|
32
|
+
|
|
33
|
+
if (type === 'current') {
|
|
34
|
+
// Classic install
|
|
35
|
+
const settings = await prompts([
|
|
36
|
+
{
|
|
37
|
+
type: 'text',
|
|
38
|
+
name: 'pathCSS',
|
|
39
|
+
message: 'Where would you like to import the lapikit CSS files?',
|
|
40
|
+
initial: 'src/app.css',
|
|
41
|
+
validate: (value) =>
|
|
42
|
+
value.startsWith('src/') ? true : 'Please provide a valid path starting with src/'
|
|
43
|
+
}
|
|
44
|
+
]);
|
|
45
|
+
|
|
46
|
+
return {
|
|
47
|
+
...settings,
|
|
48
|
+
env: 'current'
|
|
49
|
+
};
|
|
50
|
+
} else if (type === 'experimental') {
|
|
51
|
+
// Preview install
|
|
52
|
+
let settings = await prompts([
|
|
53
|
+
{
|
|
54
|
+
type: 'text',
|
|
55
|
+
name: 'pathConfig',
|
|
56
|
+
message: 'Where would you like to install the lapikit configuration files?',
|
|
57
|
+
initial: 'src/plugins',
|
|
58
|
+
validate: (value) =>
|
|
59
|
+
value.startsWith('src/') ? true : 'Please provide a valid path starting with src/'
|
|
60
|
+
},
|
|
61
|
+
{
|
|
62
|
+
type: 'toggle',
|
|
63
|
+
name: 'typescript',
|
|
64
|
+
message: 'Use TypeScript?',
|
|
65
|
+
initial: true,
|
|
66
|
+
active: 'Yes',
|
|
67
|
+
inactive: 'No'
|
|
68
|
+
},
|
|
69
|
+
{
|
|
70
|
+
type: 'select',
|
|
71
|
+
name: 'formatCSS',
|
|
72
|
+
message: 'What is your CSS format used on your app?',
|
|
73
|
+
choices: [
|
|
74
|
+
{ title: 'Basic (classic import)', value: 'css' },
|
|
75
|
+
{
|
|
76
|
+
title: 'TailwindCSS (v4)',
|
|
77
|
+
value: 'tailwind-v4'
|
|
78
|
+
},
|
|
79
|
+
{
|
|
80
|
+
title: 'UnoCSS',
|
|
81
|
+
value: 'unocss'
|
|
82
|
+
}
|
|
83
|
+
]
|
|
84
|
+
},
|
|
85
|
+
{
|
|
86
|
+
type: (prev) => (prev !== 'css' ? 'text' : null),
|
|
87
|
+
name: 'pathCSS',
|
|
88
|
+
message: 'Where would you like to import the lapikit CSS files?',
|
|
89
|
+
initial: 'src/app.css',
|
|
90
|
+
validate: (value) =>
|
|
91
|
+
value.startsWith('src/') ? true : 'Please provide a valid path starting with src/'
|
|
92
|
+
}
|
|
93
|
+
]);
|
|
94
|
+
|
|
95
|
+
return {
|
|
96
|
+
...settings,
|
|
97
|
+
env: 'experimental'
|
|
98
|
+
};
|
|
99
|
+
}
|
|
100
|
+
}
|
|
@@ -20,7 +20,7 @@
|
|
|
20
20
|
text-decoration: none;
|
|
21
21
|
}
|
|
22
22
|
|
|
23
|
-
.kit-chip:not(div):not(span) {
|
|
23
|
+
.kit-chip:not(div):not(span):not(.kit-chip--readonly) {
|
|
24
24
|
cursor: pointer;
|
|
25
25
|
}
|
|
26
26
|
|
|
@@ -49,13 +49,13 @@
|
|
|
49
49
|
pointer-events: none;
|
|
50
50
|
border-radius: inherit;
|
|
51
51
|
}
|
|
52
|
-
.kit-chip:not(div):not(span):hover::after {
|
|
52
|
+
.kit-chip:not(div):not(span):not(.kit-chip--readonly):hover::after {
|
|
53
53
|
opacity: 0.08;
|
|
54
54
|
}
|
|
55
|
-
.kit-chip:not(div):not(span):active::after {
|
|
55
|
+
.kit-chip:not(div):not(span):not(.kit-chip--readonly):active::after {
|
|
56
56
|
opacity: 0.12;
|
|
57
57
|
}
|
|
58
|
-
.kit-chip:not(div):not(span):focus-visible::after {
|
|
58
|
+
.kit-chip:not(div):not(span):not(.kit-chip--readonly):focus-visible::after {
|
|
59
59
|
opacity: 0.12;
|
|
60
60
|
}
|
|
61
61
|
|
|
@@ -37,6 +37,7 @@
|
|
|
37
37
|
rounded,
|
|
38
38
|
closable,
|
|
39
39
|
noRipple,
|
|
40
|
+
readonly = false,
|
|
40
41
|
...rest
|
|
41
42
|
}: ChipProps = $props();
|
|
42
43
|
|
|
@@ -44,7 +45,7 @@
|
|
|
44
45
|
|
|
45
46
|
$effect(() => {
|
|
46
47
|
const refProps = { ...rest };
|
|
47
|
-
if (refProps?.onclick) is = 'button';
|
|
48
|
+
if (refProps?.onclick && !readonly) is = 'button';
|
|
48
49
|
});
|
|
49
50
|
</script>
|
|
50
51
|
|
|
@@ -68,6 +69,7 @@
|
|
|
68
69
|
disabled && 'kit-chip--disabled',
|
|
69
70
|
active && 'kit-chip--active',
|
|
70
71
|
loading && 'kit-chip--loading',
|
|
72
|
+
readonly && 'kit-chip--readonly',
|
|
71
73
|
rest.class
|
|
72
74
|
]}
|
|
73
75
|
tabindex={href && disabled ? -1 : 0}
|
|
@@ -77,7 +79,7 @@
|
|
|
77
79
|
type={href ? undefined : type}
|
|
78
80
|
use:ripple={{
|
|
79
81
|
component: 'chip',
|
|
80
|
-
disabled: noRipple || disabled || is === 'div' || is === 'span'
|
|
82
|
+
disabled: noRipple || readonly || disabled || is === 'div' || is === 'span'
|
|
81
83
|
}}
|
|
82
84
|
style:--base={assets.color(background)}
|
|
83
85
|
style:--on={assets.color(color)}
|
|
@@ -109,7 +111,7 @@
|
|
|
109
111
|
</div>
|
|
110
112
|
{/if}
|
|
111
113
|
|
|
112
|
-
{#if closable}
|
|
114
|
+
{#if closable && !readonly}
|
|
113
115
|
<button
|
|
114
116
|
class="kit-chip--close"
|
|
115
117
|
type="button"
|
|
@@ -49,7 +49,6 @@
|
|
|
49
49
|
max-height: calc(100% - 3rem);
|
|
50
50
|
height: fit-content;
|
|
51
51
|
margin: 0 auto;
|
|
52
|
-
top: 50%;
|
|
53
52
|
left: 50%;
|
|
54
53
|
bottom: initial;
|
|
55
54
|
translate: var(--modal-translate-x) var(--modal-translate-y);
|
|
@@ -60,7 +59,6 @@
|
|
|
60
59
|
max-height: calc(100% - 3rem);
|
|
61
60
|
height: fit-content;
|
|
62
61
|
margin: 0 auto;
|
|
63
|
-
top: 50%;
|
|
64
62
|
left: 50%;
|
|
65
63
|
bottom: initial;
|
|
66
64
|
translate: var(--modal-translate-x) var(--modal-translate-y);
|
|
@@ -71,7 +69,6 @@
|
|
|
71
69
|
max-height: calc(100% - 3rem);
|
|
72
70
|
height: fit-content;
|
|
73
71
|
margin: 0 auto;
|
|
74
|
-
top: 50%;
|
|
75
72
|
left: 50%;
|
|
76
73
|
bottom: initial;
|
|
77
74
|
translate: var(--modal-translate-x) var(--modal-translate-y);
|
|
@@ -82,7 +79,6 @@
|
|
|
82
79
|
max-height: calc(100% - 3rem);
|
|
83
80
|
height: fit-content;
|
|
84
81
|
margin: 0 auto;
|
|
85
|
-
top: 50%;
|
|
86
82
|
left: 50%;
|
|
87
83
|
bottom: initial;
|
|
88
84
|
translate: var(--modal-translate-x) var(--modal-translate-y);
|
|
@@ -93,7 +89,6 @@
|
|
|
93
89
|
max-height: calc(100% - 3rem);
|
|
94
90
|
height: fit-content;
|
|
95
91
|
margin: 0 auto;
|
|
96
|
-
top: 50%;
|
|
97
92
|
left: 50%;
|
|
98
93
|
bottom: initial;
|
|
99
94
|
translate: var(--modal-translate-x) var(--modal-translate-y);
|
|
@@ -130,15 +125,21 @@
|
|
|
130
125
|
/* position */
|
|
131
126
|
.kit-modal [breakpoint]kit-modal-container--position-bottom {
|
|
132
127
|
--modal-translate-y: 0;
|
|
133
|
-
|
|
128
|
+
margin: auto;
|
|
134
129
|
top: initial;
|
|
130
|
+
bottom: 0;
|
|
135
131
|
}
|
|
136
132
|
|
|
137
133
|
.kit-modal [breakpoint]kit-modal-container--position-top {
|
|
138
134
|
--modal-translate-y: 0;
|
|
135
|
+
margin: auto;
|
|
139
136
|
top: 0;
|
|
137
|
+
bottom: initial;
|
|
140
138
|
}
|
|
141
139
|
|
|
142
140
|
.kit-modal [breakpoint]kit-modal-container--position-center {
|
|
141
|
+
--modal-translate-y: -50%;
|
|
143
142
|
margin: auto;
|
|
143
|
+
top: 50%;
|
|
144
|
+
bottom: initial;
|
|
144
145
|
}
|
package/dist/index.d.ts
CHANGED
package/dist/index.js
CHANGED
|
@@ -1,4 +1,10 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
console.log('
|
|
1
|
+
function createLapikit(lapikit) {
|
|
2
|
+
console.log('Creating a new Lapikit instance...');
|
|
3
|
+
console.log('Options loaded:', lapikit);
|
|
4
|
+
// deepMerge
|
|
5
|
+
const breakpointMerged = lapikit?.breakpoints?.thresholds;
|
|
6
|
+
if (breakpointMerged) {
|
|
7
|
+
console.log('Breakpoints found:', breakpointMerged);
|
|
8
|
+
}
|
|
4
9
|
}
|
|
10
|
+
export default createLapikit;
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
// store breakpoints and thresholds
|
|
2
|
+
import { writable } from 'svelte/store';
|
|
3
|
+
// presets
|
|
4
|
+
const ref = {
|
|
5
|
+
base: 0, // 0px
|
|
6
|
+
xs: '28rem', //448px
|
|
7
|
+
sm: '40rem', //640px
|
|
8
|
+
md: '48rem', //768px
|
|
9
|
+
lg: '64rem', //1024px
|
|
10
|
+
xl: '80rem', //1280px
|
|
11
|
+
'2xl': '96rem', //1536px
|
|
12
|
+
'3xl': '112rem' //1792px
|
|
13
|
+
};
|
|
14
|
+
export const breakpoints = writable(ref);
|
|
15
|
+
// export function setBreakpoints(newBreakpoints: Breakpoints) {
|
|
16
|
+
// breakpoints.set(newBreakpoints);
|
|
17
|
+
// }
|
|
18
|
+
// export function updateBreakpoint(key: string, value: number) {
|
|
19
|
+
// breakpoints.update((bp) => ({
|
|
20
|
+
// ...bp,
|
|
21
|
+
// [key]: value
|
|
22
|
+
// }));
|
|
23
|
+
// }
|
package/dist/stores/index.d.ts
CHANGED
|
@@ -8,3 +8,4 @@ export declare function setColorScheme(scheme: 'system' | 'dark' | 'light'): voi
|
|
|
8
8
|
export declare function setOpenModal(state: boolean | 'persistent'): void;
|
|
9
9
|
export declare const pushModal: (id: string) => void;
|
|
10
10
|
export declare const popModal: (id: string) => void;
|
|
11
|
+
export * from './breakpoints.js';
|
package/dist/stores/index.js
CHANGED