lapikit 0.0.0-insiders.d5e2672 → 0.0.0-insiders.d6bc7da

package/bin/modules/plugin.js

@@ -1,223 +0,0 @@
-import { promises as fs } from 'fs';
-import path from 'path';
-import { terminal } from '../helper.js';
-
-const lapikitTsTemplate = `import type { Config } from 'lapikit';
-
-/**
- * Custom configuration for Lapikit
- * @see https://lapikit.dev/docs/customize
- */
-const config: Config = {
-	theme: {
-		colorScheme: 'light',
-		colors: {
-			primary: '#3b82f6',
-			secondary: '#6b7280'
-		}
-	}
-};
-
-export default config;
-`;
-
-const lapikitJsTemplate = `/**
- * Custom configuration for Lapikit
- * @see https://lapikit.dev/docs/customize
- * @type {import('lapikit').Config}
- */
-const config = {
-	theme: {
-		colorScheme: 'light',
-		colors: {
-			primary: '#3b82f6',
-			secondary: '#6b7280'
-		}
-	}
-};
-
-export default config;
-`;
-
-export async function createPluginStructure(pluginPath, isTypescript) {
-	const resolvedPluginPath = path.resolve(process.cwd(), pluginPath);
-	const lapikitFileName = isTypescript ? 'lapikit.ts' : 'lapikit.js';
-	const lapikitFilePath = path.join(resolvedPluginPath, lapikitFileName);
-
-	try {
-		// Verify plugin directory
-		try {
-			await fs.access(resolvedPluginPath);
-			terminal('info', `The folder ${pluginPath} already exists.`);
-		} catch {
-			await fs.mkdir(resolvedPluginPath, { recursive: true });
-			terminal('success', `Folder ${pluginPath} created successfully.`);
-		}
-
-		// Create lapikit.ts or lapikit.js
-		const template = isTypescript ? lapikitTsTemplate : lapikitJsTemplate;
-		await fs.writeFile(lapikitFilePath, template.trim() + '\n', 'utf8');
-
-		terminal('success', `File ${lapikitFileName} created in ${pluginPath}.`);
-	} catch (error) {
-		terminal('error', `Error creating plugin structure: ${error.message}`);
-		throw error;
-	}
-}
-
-export async function setupSvelteKitIntegration(pluginPath, isTypescript) {
-	const srcRoutesPath = path.resolve(process.cwd(), 'src/routes');
-
-	try {
-		// Check if the src/routes directory exists
-		await fs.access(srcRoutesPath);
-		terminal('info', 'Folder src/routes found, configuring SvelteKit...');
-	} catch {
-		terminal('info', 'Folder src/routes not found, no SvelteKit configuration needed.');
-		return;
-	}
-
-	const layoutPath = path.join(srcRoutesPath, '+layout.svelte');
-	const pagePath = path.join(srcRoutesPath, '+page.svelte');
-
-	let targetFile = null;
-	let targetFileName = '';
-
-	try {
-		await fs.access(layoutPath);
-		targetFile = layoutPath;
-		targetFileName = '+layout.svelte';
-	} catch {
-		try {
-			await fs.access(pagePath);
-			targetFile = pagePath;
-			targetFileName = '+page.svelte';
-		} catch {
-			terminal('warn', 'No +layout.svelte or +page.svelte file found in src/routes.');
-			return;
-		}
-	}
-
-	// Read content
-	let fileContent = await fs.readFile(targetFile, 'utf8');
-
-	// Get Path
-	const relativePath = path.relative(
-		path.dirname(targetFile),
-		path.resolve(process.cwd(), pluginPath)
-	);
-	const lapikitFileName = isTypescript ? 'lapikit' : 'lapikit.js';
-	const configImportPath = `${relativePath}/${lapikitFileName}`.replace(/\\/g, '/');
-
-	// Imports
-	const createLapikitImport = `\n\timport { createLapikit } from 'lapikit';`;
-	const configImport = `\timport config from '${configImportPath}';`;
-
-	const scriptLang = isTypescript ? ' lang="ts"' : '';
-	const effectCode = `\n\t$effect.pre(() => {\n\t\tcreateLapikit(config);\n\t});`;
-
-	// search balise
-	const scriptRegex = /<script(\s+lang="ts")?>([\s\S]*?)<\/script>/;
-	const scriptMatch = fileContent.match(scriptRegex);
-
-	if (scriptMatch) {
-		// If have script balise , add import
-		let scriptContent = scriptMatch[2];
-
-		// Add imports if they don't already exist
-		if (!scriptContent.includes('createLapikit')) {
-			scriptContent = `${createLapikitImport}\n${configImport}\n${scriptContent}`;
-		}
-
-		// Add effect
-		if (!scriptContent.includes('createLapikit(config)')) {
-			scriptContent += effectCode;
-		}
-
-		// Replace script balise
-		const newScript = `<script${scriptMatch[1] || scriptLang}>${scriptContent}\n</script>`;
-		fileContent = fileContent.replace(scriptRegex, newScript);
-	} else {
-		// If no script tag exists, create one
-		const newScript = `<script${scriptLang}>\n${createLapikitImport}\n${configImport}${effectCode}\n</script>\n\n`;
-		fileContent = newScript + fileContent;
-	}
-
-	// Write the modified file
-	await fs.writeFile(targetFile, fileContent, 'utf8');
-	terminal('success', `Config added ${targetFileName}.`);
-}
-
-const [, , command] = process.argv;
-const typescriptEnabled = envTypescript();
-const args = process.argv.slice(2);
-const previewMode = args.includes('--preview');
-
-if (process.argv.includes('--help') || process.argv.includes('-h')) {
-	terminal(
-		'info',
-		`usage: ${ansi.color.yellow('npx lapikit init {cssPath} [--plugin-path {pluginPath}] [--preview]')}\n\n ${ansi.variant.bold('options:')}\n
-        - {cssPath}: (${ansi.color.cyan('src/app.css')}) customize path on your origin css file.
-        - --plugin-path, -p: (${ansi.color.cyan('src/plugin')}) customize path for the plugin directory.
-        - --preview: active preview mode (plugin + SvelteKit integration)\n\n`
-	);
-	process.exit(0);
-} else if (command === 'init') {
-	console.log('  _                 _ _    _ _   ');
-	console.log(' | |               (_) |  (_) |  ');
-	console.log(' | |     __ _ _ __  _| | ___| |_ ');
-	console.log(" | |    / _` | '_ \\| | |/ / | __|");
-	console.log(' | |___| (_| | |_) | |   <| | |_ ');
-	console.log(' |______\\__,_| .__/|_|_|\\_\\_|\\__|');
-	console.log('             | |                 ');
-	console.log('             |_|                 \n');
-
-	terminal('none', `${ansi.bold.blue('LAPIKIT')} - Component Library for Svelte\n\n`);
-
-	if (previewMode) {
-		// Mode preview
-		const pluginPath = getLapikitPathFromArgs();
-		const pathValidation = validatePluginPath(pluginPath);
-		if (!pathValidation.valid) {
-			terminal('error', `Invalid path: ${pathValidation.error}`);
-			process.exit(1);
-		}
-		try {
-			await createPluginStructure(pluginPath, typescriptEnabled);
-		} catch (error) {
-			terminal('error', `Create plugin structure not working : ${error.message}`);
-		}
-		try {
-			await setupSvelteKitIntegration(pluginPath, typescriptEnabled);
-		} catch (error) {
-			terminal('error', `SvelteKit integration setup failed: ${error.message}`);
-		}
-	} else {
-		// Mode classic
-		const configPath = path.resolve(process.cwd(), 'lapikit.config.js');
-		try {
-			await fs.writeFile(configPath, preset.trim() + '\n', 'utf8');
-			terminal('success', `has create lapikit.config.js on your project.`);
-		} catch (error) {
-			terminal('error', `failed to create configuration file:\n\n ${error}`);
-			terminal(
-				'warn',
-				`you can create lapikit.config.js manually, please visite https://lapikit.dev/docs/getting-started for more information`
-			);
-		}
-		await adapterCSSConfig();
-	}
-
-	await adapterViteConfig(typescriptEnabled);
-
-	terminal(
-		'info',
-		`${ansi.bold.blue('Thank to use lapikit, discover all posibility with lapikit on https://lapikit.dev')}\n\n`
-	);
-
-	console.log('Website: https://lapikit.dev');
-	console.log('Github: https://github.com/nycolaide/lapikit');
-	console.log('Support the developement: https://buymeacoffee.com/nycolaide');
-} else {
-	terminal('error', `Command not recognized. Try 'npx lapikit -h'`);
-}

package/bin/modules/preset.js

@@ -1,11 +0,0 @@
-export const preset = `
-/** @type {import('lapikit').Config} */
-export default {
-	theme: {
-		colorScheme: 'light',
-		colors: {
-			svelte: '#ff3e00'
-		}
-	}
-};
-`;

package/dist/internal/colors.d.ts

@@ -1 +0,0 @@
-export declare const parseColor: (input: string) => string;

package/dist/internal/index.d.ts

@@ -1,4 +0,0 @@
-export * from './terminal.js';
-export * from './ansi.js';
-export * from './assets.svelte.js';
-export * from './scroll.js';

package/dist/internal/index.js

@@ -1,4 +0,0 @@
-export * from './terminal.js';
-export * from './ansi.js';
-export * from './assets.svelte.js';
-export * from './scroll.js';

package/dist/internal/types.d.ts

@@ -1,57 +0,0 @@
-import type { Snippet } from 'svelte';
-type IdElementType = string | undefined;
-type ClassNameType = string | string[] | undefined;
-type StylePropertiesType = string | undefined;
-export interface Base {
-    id?: IdElementType;
-    class?: ClassNameType;
-    style?: StylePropertiesType;
-    [key: string]: any;
-}
-export interface Component extends Base {
-    children?: Snippet;
-}
-export type FontFamily = {
-    [key: string]: string | string[];
-};
-export type Colors = {
-    [key: string]: {
-        light: string;
-        dark: string;
-    } | string;
-};
-export type Thresholds = {
-    [key: string]: number | string;
-};
-export type Radius = {
-    [key: string]: number | string;
-};
-export interface Lapikit {
-    options: {
-        normalize: boolean;
-        minify: boolean;
-    };
-    theme: {
-        colorScheme: string;
-        colors: Colors;
-    };
-    breakpoints: {
-        mobileBreakpoint: string;
-        tabletBreakpoint: string;
-        laptopBreakpoint: string;
-        thresholds: Thresholds;
-    };
-    styles: {
-        spacing: string;
-        corner: {
-            active: boolean;
-            radius: Radius;
-        };
-        font: FontFamily;
-    };
-}
-type DeepOptional<T> = {
-    [P in keyof T]?: T[P] extends (infer U)[] ? DeepOptional<U>[] : T[P] extends object ? DeepOptional<T[P]> : T[P];
-};
-export type LapikitConfig = DeepOptional<Lapikit>;
-export {};

package/dist/internal/unit.d.ts

@@ -1 +0,0 @@
-export declare const setUnit: (value: string | number) => string;

package/dist/internal/unit.js

@@ -1,11 +0,0 @@
-export const setUnit = (value) => {
-    if (typeof value === 'number')
-        return `${value}px`;
-    if (typeof value === 'string') {
-        const cleaned = value.trim();
-        const isOnlyNumericLike = /^[\d.,]+$/.test(cleaned);
-        if (isOnlyNumericLike)
-            return `${value}px`;
-    }
-    return value;
-};

package/dist/plugin/modules/config.d.ts

@@ -1,2 +0,0 @@
-import type { LapikitConfig } from '../../internal/types.js';
-export declare const parseConfig: (props?: LapikitConfig) => import("../../internal/types.js").Lapikit;

package/dist/plugin/modules/config.js

@@ -1,54 +0,0 @@
-import { config } from '../../preset.js';
-export const parseConfig = (props) => {
-    if (!props)
-        return config;
-    const newConfig = { ...config };
-    if (props?.options) {
-        if (props.options.normalize !== undefined)
-            newConfig.options.normalize = props.options.normalize;
-        if (props.options.minify !== undefined)
-            newConfig.options.minify = props.options.minify;
-    }
-    if (props?.theme) {
-        if (props.theme.colorScheme !== undefined)
-            newConfig.theme.colorScheme = props.theme.colorScheme;
-        if (props.theme.colors) {
-            newConfig.theme.colors = {
-                ...newConfig.theme.colors,
-                ...props.theme.colors
-            };
-        }
-    }
-    if (props?.breakpoints) {
-        if (props.breakpoints.mobileBreakpoint !== undefined)
-            newConfig.breakpoints.mobileBreakpoint = props.breakpoints.mobileBreakpoint;
-        if (props.breakpoints.tabletBreakpoint !== undefined)
-            newConfig.breakpoints.tabletBreakpoint = props.breakpoints.tabletBreakpoint;
-        if (props.breakpoints.laptopBreakpoint !== undefined)
-            newConfig.breakpoints.laptopBreakpoint = props.breakpoints.laptopBreakpoint;
-        if (props.breakpoints.thresholds)
-            newConfig.breakpoints.thresholds = {
-                ...newConfig.breakpoints.thresholds,
-                ...props.breakpoints.thresholds
-            };
-    }
-    if (props?.styles) {
-        if (props.styles.spacing !== undefined)
-            newConfig.styles.spacing = props.styles.spacing;
-        if (props.styles.corner !== undefined) {
-            if (props.styles.corner.active !== undefined)
-                newConfig.styles.corner.active = props.styles.corner.active;
-            if (props.styles.corner.radius)
-                newConfig.styles.corner.radius = {
-                    ...newConfig.styles.corner.radius,
-                    ...props.styles.corner.radius
-                };
-        }
-        if (props.styles.font)
-            newConfig.styles.font = {
-                ...newConfig.styles.font,
-                ...props.styles.font
-            };
-    }
-    return newConfig;
-};

package/dist/plugin/modules/importer.d.ts

@@ -1 +0,0 @@
-export declare const importer: () => Promise<any>;

package/dist/plugin/modules/importer.js

@@ -1,15 +0,0 @@
-import path from 'path';
-import fs from 'fs';
-import { terminal, ansi } from '../../internal/index.js';
-const app = process.cwd();
-const pathConfig = path.resolve(app, 'lapikit.config.js');
-export const importer = async () => {
-    if (!fs.existsSync(pathConfig)) {
-        terminal('error', `config file not found\n ${ansi.color.yellow('Could not find lapikit.config.js. See https://localhost/docs/kit/vite to learn more about the configuration file.')}\n\n${ansi.color.blue('for initializing a new lapikit config, run:')}\n        ${ansi.variant.bold('npx lapikit init')}    ${ansi.bold.yellow('(preview)')}\n\n`);
-        process.exit(1);
-    }
-    const timestamp = Date.now();
-    const fileUrl = `file://${pathConfig}?t=${timestamp}`;
-    const content = await import(fileUrl);
-    return content.default;
-};

package/dist/plugin/vitejs.d.ts

@@ -1,6 +0,0 @@
-import type { ViteDevServer } from 'vite';
-export declare function lapikit(): Promise<{
-    name: string;
-    configResolved(): Promise<void>;
-    configureServer(server: ViteDevServer): Promise<void>;
-}>;

package/dist/plugin/vitejs.js

@@ -1,26 +0,0 @@
-import { importer } from './modules/importer.js';
-import { processCSS } from '../style/css.js';
-import { parseConfig } from './modules/config.js';
-import { terminal } from '../internal/terminal.js';
-export async function lapikit() {
-    return {
-        name: 'lapikit/vite.js',
-        async configResolved() {
-            const config = await importer();
-            const result = await parseConfig(config);
-            await processCSS(result);
-            terminal('info', 'lapikit is up!');
-        },
-        async configureServer(server) {
-            server.watcher.add('./lapikit.config.js');
-            server.watcher.on('change', async (filePath) => {
-                if (String(filePath).includes('lapikit.config.js')) {
-                    const config = await importer();
-                    const result = await parseConfig(config);
-                    await processCSS(result);
-                    terminal('info', 'lapikit config reloaded');
-                }
-            });
-        }
-    };
-}

package/dist/preset.d.ts

@@ -1,2 +0,0 @@
-import type { Lapikit } from './internal/types.js';
-export declare const config: Lapikit;

package/dist/preset.js

@@ -1,92 +0,0 @@
-export const config = {
-    options: {
-        normalize: true, // true | false
-        minify: false // true | false
-    },
-    theme: {
-        colorScheme: 'system', // 'light' | 'dark' | 'system'
-        colors: {
-            primary: { light: 'oklch(45% 0.24 277.023)', dark: 'oklch(45% 0.24 277.023)' },
-            'on-primary': { light: 'oklch(14% 0.005 285.823)', dark: 'oklch(14% 0.005 285.823)' },
-            secondary: { light: 'oklch(65% 0.241 354.308)', dark: 'oklch(65% 0.241 354.308)' },
-            'on-secondary': { light: 'oklch(14% 0.005 285.823)', dark: 'oklch(14% 0.005 285.823)' },
-            tertiary: { light: 'oklch(77% 0.152 181.912)', dark: 'oklch(77% 0.152 181.912)' },
-            'on-tertiary': { light: 'oklch(14% 0.005 285.823)', dark: 'oklch(14% 0.005 285.823)' },
-            neutral: { light: 'oklch(14% 0.005 285.823)', dark: 'oklch(14% 0.005 285.823)' },
-            'on-neutral': { light: 'oklch(100% 0 0)', dark: 'oklch(100% 0 0)' },
-            info: { light: 'oklch(74% 0.16 232.661)', dark: 'oklch(74% 0.16 232.661)' },
-            'on-info': { light: 'oklch(14% 0.005 285.823)', dark: 'oklch(14% 0.005 285.823)' },
-            success: { light: 'oklch(76% 0.177 163.223)', dark: 'oklch(76% 0.177 163.223)' },
-            'on-success': { light: 'oklch(14% 0.005 285.823)', dark: 'oklch(14% 0.005 285.823)' },
-            warning: { light: 'oklch(82% 0.189 84.429)', dark: 'oklch(82% 0.189 84.429)' },
-            'on-warning': { light: 'oklch(14% 0.005 285.823)', dark: 'oklch(14% 0.005 285.823)' },
-            error: { light: 'oklch(71% 0.194 13.428)', dark: 'oklch(71% 0.194 13.428)' },
-            'on-error': { light: 'oklch(14% 0.005 285.823)', dark: 'oklch(14% 0.005 285.823)' },
-            base: { light: 'oklch(100% 0 0)', dark: 'oklch(25.33% 0.016 252.42)' },
-            'on-base': { light: 'oklch(14% 0.005 285.823)', dark: 'oklch(100% 0 0)' },
-            surface: { light: 'oklch(98% 0 0)', dark: 'oklch(23.26% 0.014 253.1)' },
-            'on-surface': { light: 'oklch(14% 0.005 285.823)', dark: 'oklch(100% 0 0)' },
-            container: { light: 'oklch(95% 0 0)', dark: 'oklch(21.15% 0.012 254.09)' },
-            'on-container': { light: 'oklch(14% 0.005 285.823)', dark: 'oklch(100% 0 0)' },
-            shadow: 'black',
-            scrim: 'oklch(0.00% 0.000 0)'
-        }
-    },
-    breakpoints: {
-        mobileBreakpoint: 'sm',
-        tabletBreakpoint: 'md',
-        laptopBreakpoint: 'lg',
-        thresholds: {
-            _default: 0, // 0px
-            xs: '28rem', //448px
-            sm: '40rem', //640px
-            md: '48rem', //768px
-            lg: '64rem', //1024px
-            xl: '80rem', //1280px
-            '2xl': '96rem', //1536px
-            '3xl': '112rem' //1792px
-        }
-    },
-    styles: {
-        spacing: '0.125rem', // 2px
-        corner: {
-            active: true, // true | false
-            radius: {
-                sm: '0.125rem', // 2px
-                md: '0.25rem', // 4px
-                lg: '0.5rem', // 8px
-                xl: '0.75rem', // 12px
-                '2xl': '1rem', // 16px
-                '3xl': '1.5rem', // 24px
-                full: '9999px' // 9999px
-            }
-        },
-        font: {
-            sans: [
-                'system-ui',
-                '-apple-system',
-                'BlinkMacSystemFont',
-                'Segoe UI',
-                'Roboto',
-                'Helvetica Neue',
-                'Arial',
-                'sans-serif',
-                'Apple Color Emoji',
-                'Segoe UI Emoji',
-                'Segoe UI Symbol'
-            ],
-            mono: [
-                'SFMono-Regular',
-                'ui-monospace',
-                'SF Mono',
-                'Menlo',
-                'Monaco',
-                'Consolas',
-                'Liberation Mono',
-                'Courier New',
-                'monospace'
-            ],
-            serif: ['Merriweather', 'Georgia', 'Cambria', 'Times New Roman', 'Times', 'serif']
-        }
-    }
-};

package/dist/style/animation.css

@@ -1,62 +0,0 @@
-@keyframes button-click {
-	0% {
-		transform: scale(0.98);
-	}
-	40% {
-		transform: scale(1.02);
-	}
-	100% {
-		transform: scale(1);
-	}
-}
-
-@keyframes icon-rotate {
-	0% {
-		transform: rotate(10deg);
-	}
-	100% {
-		transform: rotate(380deg);
-	}
-}
-
-.kit-ripple {
-	background-color: currentColor;
-	opacity: 0.1;
-	position: absolute;
-	border-radius: 50%;
-	pointer-events: none;
-	-webkit-transition: 0.6s;
-	transition: 0.6s;
-	-webkit-animation: lapikit-ripple var(--ripple-duration, 0.4s) cubic-bezier(0.4, 0, 0.2, 1);
-	animation: lapikit-ripple var(--ripple-duration, 0.4s) cubic-bezier(0.4, 0, 0.2, 1);
-	border-radius: var(--ripple-radius);
-}
-
-.kit-ripple--center {
-	top: 50% !important;
-	left: 50% !important;
-	translate: -50% -50% !important;
-}
-
-.kit-ripple--effect {
-	position: absolute;
-	left: 0;
-	right: 0;
-	top: 0;
-	bottom: 0;
-	overflow: hidden;
-	background: none;
-	pointer-events: none;
-	z-index: 999;
-	border-radius: var(--ripple-radius);
-}
-
-@keyframes lapikit-ripple {
-	from {
-		scale: 0;
-	}
-
-	to {
-		scale: 1;
-	}
-}

package/dist/style/css.d.ts

@@ -1,2 +0,0 @@
-import type { Lapikit } from '../internal/types.js';
-export declare const processCSS: (config: Lapikit) => Promise<void>;

package/dist/style/css.js

@@ -1,34 +0,0 @@
-import { fileURLToPath } from 'url';
-import { dirname } from 'path';
-import fs from 'fs';
-import fsPromises from 'fs/promises';
-import path from 'path';
-import { minify } from '../internal/minify.js';
-import { colors, component, devices, variables } from './parser/index.js';
-import { terminal } from '../internal/terminal.js';
-const __filename = fileURLToPath(import.meta.url);
-const __dirname = dirname(__filename);
-export const processCSS = async (config) => {
-    const _normalize = fs.readFileSync(path.resolve(__dirname, './normalize.css'), 'utf-8');
-    const _animation = fs.readFileSync(path.resolve(__dirname, './animation.css'), 'utf-8');
-    const _variables = fs.readFileSync(path.resolve(__dirname, './variable.css'), 'utf-8');
-    let styles = ``;
-    if (config.options.normalize)
-        styles += `${_normalize}\n`;
-    const colorScheme = colors(config);
-    const deviceDisplay = devices(config);
-    const variablesStyles = variables(config);
-    styles += `${colorScheme.root}\n`;
-    styles += `${variablesStyles}\n`;
-    styles += `${variablesStyles}\n`;
-    styles += `${_variables}\n`;
-    styles += `${colorScheme.className}\n`;
-    styles += `${deviceDisplay}\n`;
-    styles += component(config);
-    styles += `${_animation}\n`;
-    if (config.options.minify) {
-        styles = minify(styles);
-        terminal('success', 'css minified');
-    }
-    fsPromises.writeFile(path.resolve(__dirname, '../styles.css'), styles);
-};

package/dist/style/parser/color.d.ts

@@ -1,5 +0,0 @@
-import type { Lapikit } from '../../internal/types.js';
-export declare const colors: (config: Lapikit) => {
-    root: string;
-    className: string;
-};