seed-components 1.0.0

package/.prettierrc

@@ -0,0 +1,13 @@
+{
+  "semi": false,
+  "singleQuote": true,
+  "jsxSingleQuote": false,
+  "trailingComma": "es5",
+  "printWidth": 80,
+  "tabWidth": 2,
+  "useTabs": false,
+  "bracketSpacing": true,
+  "arrowParens": "always",
+  "endOfLine": "lf",
+  "proseWrap": "always"
+}

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 Juan Carlos Trejos Iglesias
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,198 @@
+# components-seed
+
+Librería de componentes React (variantes por _constelación_) para portafolios y
+landing pages. Componentes modulares, estilizados con **CSS variables**
+(`var(--...)`), listos para consumir desde otros proyectos y para publicar en
+npm.
+
+---
+
+## Qué hace
+
+- Exporta componentes listos (`HeroSectionAndromeda`, `ContactFormAndromeda`,
+  `ScrollSnapAndromeda`, `WorkSectionAndromeda`, etc.).
+- Estilos por componente; uso intensivo de `var(--...)` para tematización.
+- Incluye carpeta `bundle/` con los builds compilados (`index.css`,
+  `index.es.js`, `index.umd.js`).
+- Script TypeScript `scripts/update-css-vars.ts` que inserta en cada `.css` un
+  comentario inicial con las variables `--xxx` usadas (documentación
+  automática).
+
+---
+
+## Instalación
+
+### Desde npm (consumidor)
+
+```
+npm install components-seed
+```
+
+### En desarrollo (usar el paquete local)
+
+```
+# en la librería
+npm install
+npm link
+npm run bundle:watch             # mantiene a la escucha para generar /bundle
+# en el proyecto consumidor
+npm link components-seed
+```
+
+---
+
+## Ejemplo de uso
+
+Importa los estilos de la librería en el main.tsx
+
+```react
+import 'components-seed/bundle/index.css'
+```
+
+Importa un componente desde la librería
+
+```react
+import { ExampleComponent } from 'components-seed'
+
+export const Home = () => (
+  <ExampleComponent someProp="value" />
+)
+```
+
+**Recuerda:** las variables CSS globales (`:root { --base-color-7: ... }`) deben
+definirse en el proyecto para que los colores concuerden.
+
+---
+
+## Estructura del proyecto
+
+```sh
+.
+├── bundle
+│   ├── index.css
+│   ├── index.es.js
+│   └── index.umd.js
+├── src
+│   ├── components
+│   │   ├── ContactForm(Type-Component)
+│   │   │   └── Andromeda(Constelation-Name)
+│   │   │       ├── index.tsx
+│   │   │       └── styles.module.css
+│   └── index.ts
+├── scripts
+│   ├── generate-components-index.ts
+│   ├── generate-types-index.ts
+│   ├── generate-utils-index.ts
+│   └── update-css-vars.ts
+├── package.json
+├── .prettierrc
+└── eslint.config.js
+```
+
+---
+
+## Scripts (`package.json`)
+
+```json
+{
+  "scripts": {
+    "dev": "vite",
+    "build": "tsc -b && vite build",
+    "preview": "vite preview",
+    "lint": "eslint . --ext .ts,.tsx --fix",
+    "lint:fix": "eslint . --fix",
+    "lint:css": "stylelint \"**/*.css\" --fix",
+    "format": "prettier --write .",
+    "generate:types": "ts-node ./src/scripts/generate-types-index.ts",
+    "generate:utils": "ts-node ./src/scripts/generate-utils-index.ts",
+    "generate:components": "ts-node ./src/scripts/generate-components-index.ts",
+    "comment-css-variables": "ts-node ./src/scripts/comment-css-variables.ts",
+    "generate-indexes": "ts-node ./src/scripts",
+    "bundle": "npm run generate-indexes && tsc -b && vite build",
+    "bundle:watch": "vite build --watch"
+  }
+}
+```
+
+---
+
+## Publicar en npm
+
+1. Ejecuta localmente:
+
+```sh
+npm run lint
+npm run format
+npm run bundle
+```
+
+2. Bump de versión:
+
+```
+npm version patch
+```
+
+3. Login (si es necesario):
+
+```
+npm login
+```
+
+4. Publicar:
+
+```
+npm publish --access public
+```
+
+5. En proyecto consumidor:
+
+```
+npm install components-seed@X.Y.Z
+```
+
+---
+
+## VS Code — configuración recomendada (pegar en `.vscode/` del workspace consumidor)
+
+### `.vscode/settings.json`
+
+```json
+{
+  "editor.defaultFormatter": "dbaeumer.vscode-eslint",
+  "editor.formatOnSave": true,
+  "editor.codeActionsOnSave": {
+    "source.fixAll.eslint": "always",
+    "source.organizeImports": "always",
+    "source.removeUnusedImports": "always",
+    "source.sortImports": "always"
+  }
+}
+```
+
+**Notas VS Code**
+
+- `prettier.configPath` apunta al `.prettierrc` dentro del paquete
+  `components-seed` instalado. Esto unifica formato entre librería y consumidor.
+- Si usas path-aliases en `tsconfig.json`, añade
+  `eslint-import-resolver-typescript` para que ESLint resuelva importaciones.
+
+---
+
+## Buenas prácticas antes de publicar
+
+1. `npm run lint && npm run format && npm run build && npm run comment-css-variables`.
+2. Verifica `bundle/index.css` y builds (`index.es.js`, `index.umd.js`).
+3. Prueba localmente instalando el paquete desde la ruta:
+   `npm install /ruta/a/components-seed` y ejecuta el proyecto consumidor.
+4. Mantén `prepublishOnly` para no olvidar pasos.
+
+---
+
+## Cómo añadir una nueva constelación (rápido)
+
+1. Copia la carpeta base del componente (p. ej.
+   `src/components/HeroSection/Andromeda`) → renombra `Antlia`.
+2. Ajusta `index.tsx` y el `.css` correspondiente.
+3. Ejecuta `npm run comment-css-variables`.
+4. Ejecuta `npm run bundle`.
+5. Bump version y publicar.

package/bundle/components/Alert/Andromeda/AlertAndromeda.stories.d.ts

@@ -0,0 +1,5 @@
+import { Meta, StoryObj } from '@storybook/react';
+declare const meta: Meta<any>;
+export default meta;
+type Story = StoryObj<any>;
+export declare const Default: Story;

package/bundle/components/Alert/Andromeda/index.d.ts

@@ -0,0 +1,2 @@
+import { AlertAndromedaProps } from './types';
+export declare const AlertAndromeda: ({ title, message, type, visible, onClose, className, style, }: AlertAndromedaProps) => import("react").JSX.Element | null;

package/bundle/components/Alert/Andromeda/types.d.ts

@@ -0,0 +1,9 @@
+import { BasePropComponents } from '../../../types';
+export type AlertTypeAndromeda = 'success' | 'error' | 'warning';
+export type AlertAndromedaProps = BasePropComponents & {
+    title?: string;
+    message?: string;
+    type?: AlertTypeAndromeda;
+    visible?: boolean;
+    onClose?: () => void;
+};

package/bundle/components/AppointmentForm/Andromeda/AppointmentFormAndromeda.stories.d.ts

@@ -0,0 +1,5 @@
+import { Meta, StoryObj } from '@storybook/react';
+declare const meta: Meta<any>;
+export default meta;
+type Story = StoryObj<any>;
+export declare const Default: Story;

package/bundle/components/AppointmentForm/Andromeda/examples.d.ts

@@ -0,0 +1,6 @@
+import { AppointmentType } from './types';
+export declare const availableSlotsExample: {
+    date: string;
+    times: string[];
+}[];
+export declare const appointmentTypesExample: AppointmentType[];

package/bundle/components/AppointmentForm/Andromeda/index.d.ts

@@ -0,0 +1,2 @@
+import { AppointmentFormAndromedaProps } from './types';
+export declare const AppointmentFormAndromeda: ({ availableSlots, appointmentTypes, onSubmit, selectedServiceDefault, position, style, className, }: AppointmentFormAndromedaProps) => import("react").JSX.Element;

package/bundle/components/AppointmentForm/Andromeda/translations.d.ts

@@ -0,0 +1,50 @@
+export declare const translationsSources: {
+    name_placeholder: {
+        es: string;
+        en: string;
+    };
+    document_placeholder: {
+        es: string;
+        en: string;
+    };
+    phone_placeholder: {
+        es: string;
+        en: string;
+    };
+    select_time: {
+        es: string;
+        en: string;
+    };
+    select_appointment_type: {
+        es: string;
+        en: string;
+    };
+    price_label: {
+        es: string;
+        en: string;
+    };
+    selected_date_label: {
+        es: string;
+        en: string;
+    };
+    submit_button: {
+        es: string;
+        en: string;
+    };
+    date_not_available: {
+        es: string;
+        en: string;
+    };
+    validation_required: {
+        es: string;
+        en: string;
+    };
+    validation_calendar: {
+        es: string;
+        en: string;
+    };
+    validation_service: {
+        es: string;
+        en: string;
+    };
+};

package/bundle/components/AppointmentForm/Andromeda/types.d.ts

@@ -0,0 +1,25 @@
+import { SlotCalendarAndromeda } from '../../Calendar/Andromeda/types';
+import { BasePropComponents } from '../../../types';
+export type AppointmentType = {
+    id: string;
+    label: string;
+    price: number;
+};
+export type AppointmentSubmitPayload = {
+    name: string;
+    document: string;
+    phone: string;
+    date: string;
+    time: string;
+    appointmentTypeId: string;
+    price: number;
+};
+export type AppointmentFormAndromedaProps = BasePropComponents & {
+    availableSlots?: SlotCalendarAndromeda[];
+    appointmentTypes?: AppointmentType[];
+    onSubmit: (payload: AppointmentSubmitPayload) => void;
+    selectedServiceDefault?: string;
+    style?: React.CSSProperties;
+    className?: string;
+    position?: 'static' | 'sticky' | 'fixed';
+};

package/bundle/components/Calendar/Andromeda/CalendarAndromeda.stories.d.ts

@@ -0,0 +1,5 @@
+import { Meta, StoryObj } from '@storybook/react';
+declare const meta: Meta<any>;
+export default meta;
+type Story = StoryObj<any>;
+export declare const Default: Story;

package/bundle/components/Calendar/Andromeda/examples.d.ts

@@ -0,0 +1,4 @@
+export declare const availableSlotsExample: {
+    date: string;
+    times: string[];
+}[];

package/bundle/components/Calendar/Andromeda/index.d.ts

@@ -0,0 +1,2 @@
+import { CalendarAndromedaProps } from './types';
+export declare const CalendarAndromeda: ({ availableSlots, value, onChange, minDate, maxDate, style, className, }: CalendarAndromedaProps) => import("react").JSX.Element;

package/bundle/components/Calendar/Andromeda/types.d.ts

@@ -0,0 +1,14 @@
+import { BasePropComponents } from '../../../types';
+export type SlotCalendarAndromeda = {
+    date: string;
+    times: string[];
+};
+export type CalendarAndromedaProps = BasePropComponents & {
+    availableSlots?: SlotCalendarAndromeda[] | string[];
+    value?: string;
+    onChange?: (date: string, time?: string) => void;
+    minDate?: string;
+    maxDate?: string;
+    style?: React.CSSProperties;
+    className?: string;
+};

package/bundle/components/Calendar/Antlia/CalendarAntlia.stories.d.ts

@@ -0,0 +1,5 @@
+import { Meta, StoryObj } from '@storybook/react';
+declare const meta: Meta<any>;
+export default meta;
+type Story = StoryObj<any>;
+export declare const Default: Story;

package/bundle/components/Calendar/Antlia/components/EventModal/index.d.ts

@@ -0,0 +1,2 @@
+import { CalendarModalAntliaProps } from '../../types';
+export declare const EventModal: ({ open, date, events, locale, onClose, onEventClick, onSaveEvent, onDeleteEvent, }: CalendarModalAntliaProps) => import("react").JSX.Element | null;

package/bundle/components/Calendar/Antlia/index.d.ts

@@ -0,0 +1,2 @@
+import { CalendarAntliaProps } from './types';
+export declare const CalendarAntlia: ({ title, events, initialDate, locale, weekStartsOn, className, style, onDateClick, onEventClick, onSaveEvent, onDeleteEvent, }: CalendarAntliaProps) => import("react").JSX.Element;

package/bundle/components/Calendar/Antlia/types.d.ts

@@ -0,0 +1,33 @@
+import { BasePropComponents } from '../../../types';
+export type CalendarEventAntlia = {
+    id: string;
+    title: string;
+    date: string | Date;
+    startTime?: string;
+    endTime?: string;
+    description?: string;
+    location?: string;
+    color?: string;
+    allDay?: boolean;
+};
+export type CalendarAntliaProps = BasePropComponents & {
+    title?: string;
+    events?: CalendarEventAntlia[];
+    initialDate?: Date | string;
+    locale?: string;
+    weekStartsOn?: 0 | 1 | 2 | 3 | 4 | 5 | 6;
+    onDateClick?: (date: Date, events: CalendarEventAntlia[]) => void;
+    onEventClick?: (event: CalendarEventAntlia) => void;
+    onSaveEvent?: (event: CalendarEventAntlia) => void;
+    onDeleteEvent?: (eventId: string) => void;
+};
+export type CalendarModalAntliaProps = {
+    open: boolean;
+    date: Date;
+    events: CalendarEventAntlia[];
+    locale?: string;
+    onClose: () => void;
+    onEventClick?: (event: CalendarEventAntlia) => void;
+    onSaveEvent?: (event: CalendarEventAntlia) => void;
+    onDeleteEvent?: (eventId: string) => void;
+};

package/bundle/components/ContactForm/Andromeda/ContactFormAndromeda.stories.d.ts

@@ -0,0 +1,5 @@
+import { Meta, StoryObj } from '@storybook/react';
+declare const meta: Meta<any>;
+export default meta;
+type Story = StoryObj<any>;
+export declare const Default: Story;

package/bundle/components/ContactForm/Andromeda/index.d.ts

@@ -0,0 +1,2 @@
+import { ContactFormAndromedaProps } from './types';
+export declare const ContactFormAndromeda: ({ sendTo, translations, style, backgroundImage, onSubmit, showName, showEmail, showPhone, showMessage, }: ContactFormAndromedaProps) => import("react").JSX.Element;

package/bundle/components/ContactForm/Andromeda/translations.d.ts

@@ -0,0 +1,46 @@
+export declare const translationsSources: {
+    title: {
+        es: string;
+        en: string;
+    };
+    subtitle: {
+        es: string;
+        en: string;
+    };
+    label_name: {
+        es: string;
+        en: string;
+    };
+    label_email: {
+        es: string;
+        en: string;
+    };
+    label_phone: {
+        es: string;
+        en: string;
+    };
+    label_message: {
+        es: string;
+        en: string;
+    };
+    placeholder_name: {
+        es: string;
+        en: string;
+    };
+    placeholder_email: {
+        es: string;
+        en: string;
+    };
+    placeholder_phone: {
+        es: string;
+        en: string;
+    };
+    placeholder_message: {
+        es: string;
+        en: string;
+    };
+    button: {
+        es: string;
+        en: string;
+    };
+};

package/bundle/components/ContactForm/Andromeda/types.d.ts

@@ -0,0 +1,16 @@
+import { BasePropComponents } from '../../../types';
+export type ContactFormData = {
+    name?: string;
+    email?: string;
+    phone?: string;
+    message?: string;
+};
+export type ContactFormAndromedaProps = BasePropComponents & {
+    sendTo?: string;
+    backgroundImage?: string;
+    onSubmit?: (data: ContactFormData) => void;
+    showName?: boolean;
+    showEmail?: boolean;
+    showPhone?: boolean;
+    showMessage?: boolean;
+};

package/bundle/components/ContactForm/Antlia/ContactFormAntlia.stories.d.ts

@@ -0,0 +1,5 @@
+import { Meta, StoryObj } from '@storybook/react';
+declare const meta: Meta<any>;
+export default meta;
+type Story = StoryObj<any>;
+export declare const Default: Story;

package/bundle/components/ContactForm/Antlia/example.d.ts

@@ -0,0 +1,28 @@
+export declare const contactItemsExample: ({
+    key: string;
+    type: "phone";
+    title: string;
+    subtitle: string;
+    actionText: string;
+    url: string;
+    icon: import("react").JSX.Element;
+    targetBlank: boolean;
+} | {
+    key: string;
+    type: "email";
+    title: string;
+    subtitle: string;
+    actionText: string;
+    url: string;
+    icon: import("react").JSX.Element;
+    targetBlank: boolean;
+} | {
+    key: string;
+    type: "whatsapp";
+    title: string;
+    subtitle: string;
+    actionText: string;
+    url: string;
+    icon: import("react").JSX.Element;
+    targetBlank: boolean;
+})[];

package/bundle/components/ContactForm/Antlia/index.d.ts

@@ -0,0 +1,2 @@
+import { ContactFormAntliaProps } from './types';
+export declare const ContactFormAntlia: ({ items, translations, idForm, style, className, }: ContactFormAntliaProps) => import("react").JSX.Element;

package/bundle/components/ContactForm/Antlia/translations.d.ts

@@ -0,0 +1,6 @@
+export declare const translationsSoruces: {
+    title: {
+        es: string;
+        en: string;
+    };
+};

package/bundle/components/ContactForm/Antlia/types.d.ts

@@ -0,0 +1,17 @@
+import { BasePropComponents } from '../../../types';
+import { ReactNode } from 'react';
+export type ContactType = 'phone' | 'email' | 'whatsapp' | 'other';
+export type ContactItem = {
+    key: string;
+    type: ContactType;
+    title: string;
+    subtitle?: string;
+    actionText?: string;
+    url: string;
+    icon: ReactNode;
+    targetBlank?: boolean;
+};
+export type ContactFormAntliaProps = BasePropComponents & {
+    items?: ContactItem[];
+    idForm: string;
+};

package/bundle/components/FileDownloader/Andromeda/FileDownloaderAndromeda.stories.d.ts

@@ -0,0 +1,5 @@
+import { Meta, StoryObj } from '@storybook/react';
+declare const meta: Meta<any>;
+export default meta;
+type Story = StoryObj<any>;
+export declare const Default: Story;

package/bundle/components/FileDownloader/Andromeda/examples.d.ts

@@ -0,0 +1,2 @@
+import { FileItemAndromeda } from './types';
+export declare const filesExample: FileItemAndromeda[];

package/bundle/components/FileDownloader/Andromeda/index.d.ts

@@ -0,0 +1,2 @@
+import { FileDownloaderAndromedaProps } from './types';
+export declare const FileDownloaderAndromeda: ({ files, position, layout, offset, defaultIcon, title, style, className, }: FileDownloaderAndromedaProps) => import("react").JSX.Element;

package/bundle/components/FileDownloader/Andromeda/types.d.ts

@@ -0,0 +1,21 @@
+import { BasePropComponents } from '../../../types';
+import { ReactNode } from 'react';
+export type FloatingPosition = 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right';
+export type FileItemAndromeda = {
+    url: string;
+    name?: string;
+    label?: string;
+    icon?: ReactNode;
+};
+export type FilesLayout = 'horizontal' | 'vertical';
+export type FileDownloaderAndromedaProps = BasePropComponents & {
+    files: FileItemAndromeda[];
+    position?: FloatingPosition;
+    layout?: FilesLayout;
+    offset?: {
+        x?: number;
+        y?: number;
+    };
+    defaultIcon?: ReactNode;
+    title?: string;
+};

package/bundle/components/FileUpload/Andromeda/FileUploadAndromeda.stories.d.ts

@@ -0,0 +1,5 @@
+import { Meta, StoryObj } from '@storybook/react';
+declare const meta: Meta<any>;
+export default meta;
+type Story = StoryObj<any>;
+export declare const Default: Story;

package/bundle/components/FileUpload/Andromeda/index.d.ts

@@ -0,0 +1,2 @@
+import { FileUploadPropsAndromeda } from './types';
+export declare const FileUploadAndromeda: (props: FileUploadPropsAndromeda) => import("react").JSX.Element;

package/bundle/components/FileUpload/Andromeda/translations.d.ts

@@ -0,0 +1,17 @@
+export declare const translationsSources: {
+    select_archive_file: {
+        es: string;
+        en: string;
+        pt: string;
+    };
+    execute_regression_lineal: {
+        es: string;
+        en: string;
+        pt: string;
+    };
+    dependent_variable: {
+        es: string;
+        en: string;
+        pt: string;
+    };
+};

package/bundle/components/FileUpload/Andromeda/types.d.ts

@@ -0,0 +1,14 @@
+import { BasePropComponents } from '../../../types';
+export interface FileUploadProps {
+    onFileSelect: (file: File) => void;
+    className?: string;
+}
+export interface RegressionLinealProps {
+    onExecute: () => void;
+    dependentVariable: string;
+    className?: string;
+}
+export interface FileUploadPropsAndromeda extends BasePropComponents {
+    fileUploadProps: FileUploadProps;
+    regressionLinealProps: RegressionLinealProps;
+}

package/bundle/components/HeroSection/Andromeda/HeroSectionAndromeda.stories.d.ts

@@ -0,0 +1,5 @@
+import { Meta, StoryObj } from '@storybook/react';
+declare const meta: Meta<any>;
+export default meta;
+type Story = StoryObj<any>;
+export declare const Default: Story;

package/bundle/components/HeroSection/Andromeda/defaults.d.ts

@@ -0,0 +1,2 @@
+import type * as Types from './types';
+export declare const defaults: Types.HeroSectionAndromedaProps;