Configuracion del proyecto en svelte kit + tailwind css + typescript

- Definicion de los tipos propios del configurador
master
dev 12 months ago
commit 611b7cb47e

23
.gitignore vendored

@ -0,0 +1,23 @@
node_modules
# Output
.output
.vercel
.netlify
.wrangler
/.svelte-kit
/build
# OS
.DS_Store
Thumbs.db
# Env
.env
.env.*
!.env.example
!.env.test
# Vite
vite.config.js.timestamp-*
vite.config.ts.timestamp-*

8
.idea/.gitignore vendored

@ -0,0 +1,8 @@
# Default ignored files
/shelf/
/workspace.xml
# Editor-based HTTP Client requests
/httpRequests/
# Datasource local storage ignored files
/dataSources/
/dataSources.local.xml

@ -0,0 +1,12 @@
<?xml version="1.0" encoding="UTF-8"?>
<module type="WEB_MODULE" version="4">
<component name="NewModuleRootManager">
<content url="file://$MODULE_DIR$">
<excludeFolder url="file://$MODULE_DIR$/.tmp" />
<excludeFolder url="file://$MODULE_DIR$/temp" />
<excludeFolder url="file://$MODULE_DIR$/tmp" />
</content>
<orderEntry type="inheritedJdk" />
<orderEntry type="sourceFolder" forTests="false" />
</component>
</module>

@ -0,0 +1,63 @@
<component name="ProjectCodeStyleConfiguration">
<code_scheme name="Project" version="173">
<HTMLCodeStyleSettings>
<option name="HTML_SPACE_INSIDE_EMPTY_TAG" value="true" />
</HTMLCodeStyleSettings>
<JSCodeStyleSettings version="0">
<option name="FORCE_SEMICOLON_STYLE" value="true" />
<option name="SPACE_BEFORE_FUNCTION_LEFT_PARENTH" value="false" />
<option name="USE_DOUBLE_QUOTES" value="false" />
<option name="FORCE_QUOTE_STYlE" value="true" />
<option name="ENFORCE_TRAILING_COMMA" value="Remove" />
<option name="SPACES_WITHIN_OBJECT_LITERAL_BRACES" value="true" />
<option name="SPACES_WITHIN_IMPORTS" value="true" />
</JSCodeStyleSettings>
<TypeScriptCodeStyleSettings version="0">
<option name="FORCE_SEMICOLON_STYLE" value="true" />
<option name="SPACE_BEFORE_FUNCTION_LEFT_PARENTH" value="false" />
<option name="USE_DOUBLE_QUOTES" value="false" />
<option name="FORCE_QUOTE_STYlE" value="true" />
<option name="ENFORCE_TRAILING_COMMA" value="Remove" />
<option name="SPACES_WITHIN_OBJECT_LITERAL_BRACES" value="true" />
<option name="SPACES_WITHIN_IMPORTS" value="true" />
</TypeScriptCodeStyleSettings>
<VueCodeStyleSettings>
<option name="INTERPOLATION_NEW_LINE_AFTER_START_DELIMITER" value="false" />
<option name="INTERPOLATION_NEW_LINE_BEFORE_END_DELIMITER" value="false" />
</VueCodeStyleSettings>
<codeStyleSettings language="HTML">
<option name="SOFT_MARGINS" value="100" />
<indentOptions>
<option name="INDENT_SIZE" value="2" />
<option name="CONTINUATION_INDENT_SIZE" value="2" />
<option name="TAB_SIZE" value="2" />
<option name="USE_TAB_CHARACTER" value="true" />
</indentOptions>
</codeStyleSettings>
<codeStyleSettings language="JavaScript">
<option name="SOFT_MARGINS" value="100" />
<indentOptions>
<option name="INDENT_SIZE" value="2" />
<option name="CONTINUATION_INDENT_SIZE" value="2" />
<option name="TAB_SIZE" value="2" />
<option name="USE_TAB_CHARACTER" value="true" />
</indentOptions>
</codeStyleSettings>
<codeStyleSettings language="TypeScript">
<option name="SOFT_MARGINS" value="100" />
<indentOptions>
<option name="INDENT_SIZE" value="2" />
<option name="CONTINUATION_INDENT_SIZE" value="2" />
<option name="TAB_SIZE" value="2" />
<option name="USE_TAB_CHARACTER" value="true" />
</indentOptions>
</codeStyleSettings>
<codeStyleSettings language="Vue">
<option name="SOFT_MARGINS" value="100" />
<indentOptions>
<option name="CONTINUATION_INDENT_SIZE" value="2" />
<option name="USE_TAB_CHARACTER" value="true" />
</indentOptions>
</codeStyleSettings>
</code_scheme>
</component>

@ -0,0 +1,5 @@
<component name="ProjectCodeStyleConfiguration">
<state>
<option name="USE_PER_PROJECT_SETTINGS" value="true" />
</state>
</component>

@ -0,0 +1,8 @@
<?xml version="1.0" encoding="UTF-8"?>
<project version="4">
<component name="ProjectModuleManager">
<modules>
<module fileurl="file://$PROJECT_DIR$/.idea/app-selector-acabados.iml" filepath="$PROJECT_DIR$/.idea/app-selector-acabados.iml" />
</modules>
</component>
</project>

@ -0,0 +1,6 @@
<?xml version="1.0" encoding="UTF-8"?>
<project version="4">
<component name="PrettierConfiguration">
<option name="myConfigurationMode" value="AUTOMATIC" />
</component>
</project>

@ -0,0 +1,6 @@
<?xml version="1.0" encoding="UTF-8"?>
<project version="4">
<component name="VcsDirectoryMappings">
<mapping directory="$PROJECT_DIR$" vcs="Git" />
</component>
</project>

@ -0,0 +1 @@
engine-strict=true

@ -0,0 +1,9 @@
# Package Managers
package-lock.json
pnpm-lock.yaml
yarn.lock
bun.lock
bun.lockb
# Miscellaneous
/static/

@ -0,0 +1,16 @@
{
"useTabs": true,
"singleQuote": true,
"trailingComma": "none",
"printWidth": 100,
"plugins": ["prettier-plugin-svelte", "prettier-plugin-tailwindcss"],
"overrides": [
{
"files": "*.svelte",
"options": {
"parser": "svelte"
}
}
],
"tailwindStylesheet": "./src/app.css"
}

@ -0,0 +1,38 @@
# sv
Everything you need to build a Svelte project, powered by [`sv`](https://github.com/sveltejs/cli).
## Creating a project
If you're seeing this, you've probably already done this step. Congrats!
```sh
# create a new project in the current directory
npx sv create
# create a new project in my-app
npx sv create my-app
```
## Developing
Once you've created a project and installed dependencies with `npm install` (or `pnpm install` or `yarn`), start a development server:
```sh
npm run dev
# or start the server and open the app in a new browser tab
npm run dev -- --open
```
## Building
To create a production version of your app:
```sh
npm run build
```
You can preview the production build with `npm run preview`.
> To deploy your app, you may need to install an [adapter](https://svelte.dev/docs/kit/adapters) for your target environment.

2740
package-lock.json generated

File diff suppressed because it is too large Load Diff

@ -0,0 +1,35 @@
{
"name": "app-selector-acabados",
"private": true,
"version": "0.0.1",
"type": "module",
"scripts": {
"dev": "vite dev",
"build": "vite build",
"preview": "vite preview",
"prepare": "svelte-kit sync || echo ''",
"check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
"check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch",
"format": "prettier --write .",
"lint": "prettier --check ."
},
"devDependencies": {
"@sveltejs/adapter-static": "^3.0.9",
"@sveltejs/kit": "^2.43.2",
"@sveltejs/vite-plugin-svelte": "^6.2.0",
"@tailwindcss/postcss": "^4.1.14",
"@tailwindcss/vite": "^4.1.13",
"@types/node": "^24.7.2",
"autoprefixer": "^10.4.21",
"postcss-import": "^16.1.1",
"postcss-import-alias": "^0.0.1",
"prettier": "^3.6.2",
"prettier-plugin-svelte": "^3.4.0",
"prettier-plugin-tailwindcss": "^0.6.14",
"svelte": "^5.39.5",
"svelte-check": "^4.3.2",
"tailwindcss": "^4.1.14",
"typescript": "^5.9.2",
"vite": "^7.1.7"
}
}

@ -0,0 +1,9 @@
// postcss.config.cts
module.exports = {
plugins: {
'@tailwindcss/postcss': {},
autoprefixer: {},
},
};

@ -0,0 +1,2 @@
@import "./styles/global.css";

13
src/app.d.ts vendored

@ -0,0 +1,13 @@
// See https://svelte.dev/docs/kit/types#app.d.ts
// for information about these interfaces
declare global {
namespace App {
// interface Error {}
// interface Locals {}
// interface PageData {}
// interface PageState {}
// interface Platform {}
}
}
export {};

@ -0,0 +1,11 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
%sveltekit.head%
</head>
<body data-sveltekit-preload-data="hover">
<div style="display: contents">%sveltekit.body%</div>
</body>
</html>

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="107" height="128" viewBox="0 0 107 128"><title>svelte-logo</title><path d="M94.157 22.819c-10.4-14.885-30.94-19.297-45.792-9.835L22.282 29.608A29.92 29.92 0 0 0 8.764 49.65a31.5 31.5 0 0 0 3.108 20.231 30 30 0 0 0-4.477 11.183 31.9 31.9 0 0 0 5.448 24.116c10.402 14.887 30.942 19.297 45.791 9.835l26.083-16.624A29.92 29.92 0 0 0 98.235 78.35a31.53 31.53 0 0 0-3.105-20.232 30 30 0 0 0 4.474-11.182 31.88 31.88 0 0 0-5.447-24.116" style="fill:#ff3e00"/><path d="M45.817 106.582a20.72 20.72 0 0 1-22.237-8.243 19.17 19.17 0 0 1-3.277-14.503 18 18 0 0 1 .624-2.435l.49-1.498 1.337.981a33.6 33.6 0 0 0 10.203 5.098l.97.294-.09.968a5.85 5.85 0 0 0 1.052 3.878 6.24 6.24 0 0 0 6.695 2.485 5.8 5.8 0 0 0 1.603-.704L69.27 76.28a5.43 5.43 0 0 0 2.45-3.631 5.8 5.8 0 0 0-.987-4.371 6.24 6.24 0 0 0-6.698-2.487 5.7 5.7 0 0 0-1.6.704l-9.953 6.345a19 19 0 0 1-5.296 2.326 20.72 20.72 0 0 1-22.237-8.243 19.17 19.17 0 0 1-3.277-14.502 17.99 17.99 0 0 1 8.13-12.052l26.081-16.623a19 19 0 0 1 5.3-2.329 20.72 20.72 0 0 1 22.237 8.243 19.17 19.17 0 0 1 3.277 14.503 18 18 0 0 1-.624 2.435l-.49 1.498-1.337-.98a33.6 33.6 0 0 0-10.203-5.1l-.97-.294.09-.968a5.86 5.86 0 0 0-1.052-3.878 6.24 6.24 0 0 0-6.696-2.485 5.8 5.8 0 0 0-1.602.704L37.73 51.72a5.42 5.42 0 0 0-2.449 3.63 5.79 5.79 0 0 0 .986 4.372 6.24 6.24 0 0 0 6.698 2.486 5.8 5.8 0 0 0 1.602-.704l9.952-6.342a19 19 0 0 1 5.295-2.328 20.72 20.72 0 0 1 22.237 8.242 19.17 19.17 0 0 1 3.277 14.503 18 18 0 0 1-8.13 12.053l-26.081 16.622a19 19 0 0 1-5.3 2.328" style="fill:#fff"/></svg>

After

Width:  |  Height:  |  Size: 1.5 KiB

@ -0,0 +1 @@
// place files you want to import through the `$lib` alias in this folder.

@ -0,0 +1,158 @@
export type OptionValue = string | number | boolean;
export type IdsPos = Record<string, number>;
export type RestrictionType = 'choices' | 'range';
export type OptionRestriction =
| { mode: 'choices'; values: OptionValue[] }
| {
mode: 'range';
range: {
min: number | (() => number);
max: number | (() => number);
step?: number;
};
};
export type OptionRestrictions = OptionRestriction[];
export type ValidatorType = "min" | "max" | "regex" | "allowedValues" | "custom";
export interface OptionValidator {
mode : ValidatorType;
value? : OptionValue | OptionValue[];
func? : (v :OptionValue) => boolean;
message? : (v :OptionValue) => string;
}
export type OptionValidators = OptionValidator[]
export type DependencyOperator = '=' | '!=' | '<=' | '<' | '>=' | '>';
export interface Dependency {
entity : string;
group : string; // Nombre del grupo del que depende
value : OptionValue;
operator? : DependencyOperator; // Por defecto '=' si no se indica
}
export type Dependencies = Dependency[];
export interface ImageContent {
id : string;
name : string;
src : string;
thumb? : string;
large? : string;
title? : string;
text? : string;
alt? : string;
width? : number;
height? : number;
}
export interface PdfContent {
title : string;
text : string;
image? : string;
}
export interface TextContent {
label? : string; // Etiqueta corta, ideal para botones o encabezados
title? : string; // Título principal o destacado
description? : string; // Texto descriptivo o explicativo
help? : string; // Texto de ayuda o aclaración contextual
message_ok? : string; // Mensaje positivo (éxito, selección válida)
message_err? : string; // Mensaje de error o validación
placeholder? : string; // Texto de entrada (para inputs)
tooltip? : string; // Texto breve al pasar el cursor
// 🔹 Campos relacionados con precio
price_label? : string; // Ej: "Precio"
price_unit? : string; // Ej: "€/m²", "€/ud"
price_message?: string; // Mensaje contextual sobre precio (ej: "Incluye IVA")
price_range_message? : string; // Mensaje contextual si es un precio calculado por rango
}
export interface Price {
amount? : number; // precio fijo
calc? : (value: OptionValue) => number; // precio dinámico según el valor elegido
}
export interface Content {
text? : TextContent;
pdf? : PdfContent;
image? : ImageContent;
gallery? : ImageContent[];
}
export interface Group {
id : string;
name : string;
default : number; // idx default option, normally 0
options : Options;
optionIds : IdsPos;
content? : Content;
dependsOn? : Dependencies;
}
export type Groups = Group[];
export interface Option {
id : string;
name : string;
value : OptionValue;
choices? : OptionValue[];
unit? : string;
content? : Content;
dependsOn? : Dependencies;
validates? : OptionValidators;
restrictions? : OptionRestrictions;
}
export type Options = Option[];
export interface Entity {
name : string;
content? : Content;
groups : Groups;
groupsIds : IdsPos;
dependsOn? : Dependencies;
entities? : Entities;
entitiesIds : Record<string, number>;
}
export type Entities = Entity[];

@ -0,0 +1,12 @@
<script lang="ts">
import '../app.css';
import favicon from '$lib/assets/favicon.svg';
let { children } = $props();
</script>
<svelte:head>
<link rel="icon" href={favicon} />
</svelte:head>
{@render children?.()}

@ -0,0 +1,16 @@
<script>
</script>
<h1>Welcome to SvelteKit</h1>
<h1 class="font-serif"> Esto es el titulo </h1>
<p class="text-xl font-extralight">Que fuente es esta ?</p>
<p class="text-xl font-light">Que fuente es esta ?</p>
<p class="text-xl font-regular">Que fuente es esta ?</p>
<p class="text-xl font-medium">Que fuente es esta ?</p>
<p class="text-xl font-semibold">Que fuente es esta ?</p>
<p class="text-xl font-bold">Que fuente es esta ?</p>
<p class="text-xl font-extrabold">Que fuente es esta ?</p>
<p>Visit <a class="text-lg font-bold" href="https://svelte.dev/docs/kit">svelte.dev/docs/kit</a> to read the documentation</p>

@ -0,0 +1,61 @@
@font-face {
font-family: 'didot';
src: url('/fnts/didot.otf') format('opentype');
font-weight: 400;
font-style: normal;
}
@font-face {
font-family: 'outfit';
src: url('/fnts/outfit-regular.ttf') format('truetype');
font-weight: 400;
font-style: normal;
}
@font-face {
font-family: 'outfit';
src: url('/fnts/outfit-extra-light.ttf') format('truetype');
font-weight: 100;
font-style: normal;
}
@font-face {
font-family: 'outfit';
src: url('/fnts/outfit-light.ttf') format('truetype');
font-weight: 300;
font-style: normal;
}
@font-face {
font-family: 'outfit';
src: url('/fnts/outfit-medium.ttf') format('truetype');
font-weight: 500;
font-style: normal;
}
@font-face {
font-family: 'outfit';
src: url('/fnts/outfit-semi-bold.ttf') format('truetype');
font-weight: 600;
font-style: normal;
}
@font-face {
font-family: 'outfit';
src: url('/fnts/outfit-bold.ttf') format('truetype');
font-weight: 700;
font-style: normal;
}
@font-face {
font-family: 'outfit';
src: url('/fnts/outfit-extra-bold.ttf') format('truetype');
font-weight: 800;
font-style: normal;
}

@ -0,0 +1,32 @@
@import "./fonts.css";
@import "tailwindcss";
@theme {
/* Fonts: Sobrescribe/extiende los defaults */
--font-serif: didot, ui-serif, Georgia, Cambria, 'Times New Roman', Times, serif;
--font-sans : outfit, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" ;
/* Colors: Custom primary palette (convertidos de hex a HSL) */
--color-primary-50: hsl(204, 100%, 97%);
--color-primary-500: hsl(217, 91%, 60%);
--color-primary-600: hsl(221, 83%, 53%);
--color-primary-700: hsl(224, 76%, 48%);
/* Width: Custom como --spacing-* para generar w-image-fit */
--spacing-image-fit: calc(100% - 2rem);
}
@layer base {
:root {
font-family: theme('font-sans'), serif;
}
}
@layer utilities {
.font-extralight {
font-weight: 100;
}
}

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

@ -0,0 +1,3 @@
# allow crawling everything by default
User-agent: *
Disallow:

@ -0,0 +1,12 @@
import adapter from '@sveltejs/adapter-static';
import { vitePreprocess } from '@sveltejs/vite-plugin-svelte';
/** @type {import('@sveltejs/kit').Config} */
const config = {
// Consult https://svelte.dev/docs/kit/integrations
// for more information about preprocessors
preprocess: vitePreprocess(),
kit: { adapter: adapter() }
};
export default config;

@ -0,0 +1,19 @@
{
"extends": "./.svelte-kit/tsconfig.json",
"compilerOptions": {
"allowJs": true,
"checkJs": true,
"esModuleInterop": true,
"forceConsistentCasingInFileNames": true,
"resolveJsonModule": true,
"skipLibCheck": true,
"sourceMap": true,
"strict": true,
"moduleResolution": "bundler"
}
// Path aliases are handled by https://svelte.dev/docs/kit/configuration#alias
// except $lib which is handled by https://svelte.dev/docs/kit/configuration#files
//
// To make changes to top-level options such as include and exclude, we recommend extending
// the generated config; see https://svelte.dev/docs/kit/configuration#typescript
}

@ -0,0 +1,7 @@
import tailwindcss from '@tailwindcss/vite';
import { sveltekit } from '@sveltejs/kit/vite';
import { defineConfig } from 'vite';
export default defineConfig({
plugins: [tailwindcss(), sveltekit()]
});
Loading…
Cancel
Save

Powered by TurnKey Linux.