veleta-templates 0.0.1 → 0.0.3

package/dist/cjs/index-rvPH40G4.js

@@ -119,14 +119,10 @@ var loadModule = (cmpMeta, hostRef, hmrVersionId) => {
           }
           switch(bundleId) {
               
-                case 'veleta-demo-template.cjs':
+                case 'veleta-boston-template.cjs':
                     return Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespace(require(
                         /* webpackMode: "lazy" */
-                        './veleta-demo-template.cjs.entry.js')); }).then(processMod, consoleError);
-                case 'veleta-menu-template-b.cjs':
-                    return Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespace(require(
-                        /* webpackMode: "lazy" */
-                        './veleta-menu-template-b.cjs.entry.js')); }).then(processMod, consoleError);
+                        './veleta-boston-template.cjs.entry.js')); }).then(processMod, consoleError);
           }
       }
   return (function (t) { return Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespace(require(t)); }); })(

package/dist/cjs/loader.cjs.js

@@ -6,7 +6,7 @@ var appGlobals = require('./app-globals-V2Kpy_OQ.js');
 const defineCustomElements = async (win, options) => {
   if (typeof window === 'undefined') return undefined;
   await appGlobals.globalScripts();
-  return index.bootstrapLazy([["veleta-demo-template.cjs",[[256,"veleta-demo-template",{"sectionsJson":[1,"sections-json"],"dishesJson":[1,"dishes-json"],"themeJson":[1,"theme-json"],"restaurantName":[1,"restaurant-name"]}]]],["veleta-menu-template-b.cjs",[[256,"veleta-menu-template-b",{"sectionsJson":[1,"sections-json"],"dishesJson":[1,"dishes-json"],"themeJson":[1,"theme-json"],"restaurantName":[1,"restaurant-name"]}]]]], options);
+  return index.bootstrapLazy([["veleta-boston-template.cjs",[[256,"veleta-boston-template",{"dataJson":[1,"data-json"],"themeJson":[1,"theme-json"]}]]]], options);
 };
 
 exports.setNonce = index.setNonce;

package/dist/cjs/veleta-boston-template.cjs.entry.js

@@ -0,0 +1,148 @@
+'use strict';
+
+var index = require('./index-rvPH40G4.js');
+
+/**
+ * Carga fuentes usando webfontloader de forma dinámica.
+ * Esta función carga el módulo webfontloader solo cuando es necesario.
+ *
+ * @param fontConfig Configuración de fuentes para webfontloader
+ * @returns Promise que se resuelve cuando las fuentes se cargan
+ */
+async function loadFonts(fontConfig) {
+    if (!fontConfig || (!fontConfig.google && !fontConfig.custom)) {
+        return Promise.resolve();
+    }
+    try {
+        // Importación dinámica de webfontloader
+        // webfontloader puede exportar de diferentes formas según el entorno
+        const webfontloaderModule = await Promise.resolve().then(function () { return require('./webfontloader-CDgRDOZ3.js'); }).then(function (n) { return n.webfontloader; });
+        const WebFont = webfontloaderModule.default || webfontloaderModule;
+        if (!WebFont || typeof WebFont.load !== 'function') {
+            console.warn('webfontloader no está disponible o no tiene el método load');
+            return Promise.resolve();
+        }
+        return new Promise((resolve) => {
+            const config = Object.assign(Object.assign({}, fontConfig), { active: () => {
+                    if (fontConfig.active) {
+                        fontConfig.active();
+                    }
+                    resolve();
+                }, inactive: () => {
+                    if (fontConfig.inactive) {
+                        fontConfig.inactive();
+                    }
+                    // No rechazamos la promesa, solo resolvemos
+                    // para que el template pueda renderizarse con fuentes por defecto
+                    resolve();
+                } });
+            WebFont.load(config);
+        });
+    }
+    catch (error) {
+        console.error('Error loading webfontloader:', error);
+        // Resolvemos en lugar de rechazar para que el template pueda renderizarse
+        return Promise.resolve();
+    }
+}
+/**
+ * Aplica la familia de fuente al elemento raíz del componente.
+ *
+ * @param element Elemento HTML al que aplicar la fuente
+ * @param fontFamily Familia de fuente CSS (ej: "Roboto, sans-serif")
+ */
+function applyFontFamily(element, fontFamily) {
+    if (element) {
+        element.style.fontFamily = fontFamily;
+    }
+}
+
+/**
+ * Parsea un prop que puede ser un string JSON o un array/objeto directo.
+ * Compatible con Angular/Ionic (objetos directos) y Astro/vanilla JS (strings JSON).
+ */
+/**
+ * Parsea un prop de tema que puede ser un string JSON o un objeto directo.
+ * Compatible con Angular/Ionic (objetos directos) y Astro/vanilla JS (strings JSON).
+ */
+function parseTheme(themeJson) {
+    try {
+        // Si ya es un objeto (Angular/Ionic pasa objetos directamente), devolverlo
+        if (typeof themeJson === 'object' && themeJson !== null && !Array.isArray(themeJson)) {
+            return themeJson;
+        }
+        // Si es string, parsearlo (Astro, vanilla JS, etc. pasan strings JSON)
+        if (typeof themeJson === 'string') {
+            const cleaned = themeJson.trim();
+            if (!cleaned || cleaned === '{}') {
+                return null;
+            }
+            const res = JSON.parse(cleaned);
+            return res && typeof res === 'object' && !Array.isArray(res)
+                ? res
+                : null;
+        }
+        return null;
+    }
+    catch (_a) {
+        return null;
+    }
+}
+
+/**
+ * Formatea un precio como string con símbolo de euro.
+ * Si es un número entero, no muestra decimales.
+ */
+function formatPrice(price) {
+    return (price % 1 === 0 ? price.toString() : price.toFixed(2)) + '€';
+}
+
+const bostonTemplateCss = () => `.menu-wrapper{min-height:100vh;width:100%;padding:1.5rem 1rem;font-family:'Merriweather', serif;-webkit-box-sizing:border-box;box-sizing:border-box;margin:0;display:block}.menu-wrapper *,.menu-wrapper *::before,.menu-wrapper *::after{-webkit-box-sizing:border-box;box-sizing:border-box}.menu-wrapper h1,.menu-wrapper h2,.menu-wrapper h3,.menu-wrapper h4,.menu-wrapper h5,.menu-wrapper h6,.menu-wrapper p,.menu-wrapper ul,.menu-wrapper ol,.menu-wrapper li,.menu-wrapper header,.menu-wrapper section,.menu-wrapper article,.menu-wrapper aside,.menu-wrapper nav,.menu-wrapper blockquote,.menu-wrapper figure,.menu-wrapper figcaption{margin:0;-webkit-margin-before:0;margin-block-start:0;-webkit-margin-after:0;margin-block-end:0;-webkit-margin-start:0;margin-inline-start:0;-webkit-margin-end:0;margin-inline-end:0}.menu-wrapper ul,.menu-wrapper ol{padding:0}@media (min-width: 640px){.menu-wrapper{padding:2rem 1.5rem}}@media (min-width: 768px){.menu-wrapper{padding:2rem 1rem}}.menu-container{max-width:1280px;margin:0 auto}.menu-header{text-align:center}@media (min-width: 768px){.menu-header{margin-bottom:3rem}}.restaurant-title{font-size:2rem;font-weight:700;text-transform:uppercase;letter-spacing:0.05em;line-height:1.1;margin:0 0 1.5rem 0!important}@media (min-width: 640px){.restaurant-title{font-size:2.5rem;margin:0 0 3rem 0!important}}@media (min-width: 768px){.restaurant-title{font-size:3rem}}@media (min-width: 1024px){.restaurant-title{font-size:3.5rem}}.sections-container{display:grid;grid-template-columns:1fr;gap:3rem}@media (min-width: 768px){.sections-container{grid-template-columns:repeat(2, 1fr);gap:4rem}}.menu-section{display:-ms-flexbox;display:flex;width:100%;position:relative}.section-label-wrapper{position:relative;width:3rem;-ms-flex-negative:0;flex-shrink:0;margin-right:1rem;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:center;align-items:center;-ms-flex-pack:end;justify-content:flex-end}.section-label-line{position:absolute;right:0;top:0;bottom:0;width:1px;border-right:1px solid}.section-label{font-weight:700;font-size:1.125rem;text-transform:uppercase;letter-spacing:0.15em;-webkit-writing-mode:vertical-rl;-ms-writing-mode:tb-rl;writing-mode:vertical-rl;-webkit-transform:rotate(180deg);transform:rotate(180deg);text-align:right;white-space:nowrap;margin:0 0 0.5rem 0;-webkit-margin-after:0.5rem;margin-block-end:0.5rem;position:absolute;top:0}@media (min-width: 640px){.section-label{font-size:1.2375rem}}@media (min-width: 768px){.section-label{font-size:1.35rem}}@media (min-width: 1024px){.section-label{font-size:1.51875rem}}.section-content{-ms-flex:1;flex:1;padding-top:0.25rem}.section-description{font-size:0.875rem;font-style:italic;margin:0 0 1rem 0!important;-webkit-margin-after:1rem;margin-block-end:1rem;opacity:0.75;color:inherit}@media (min-width: 640px){.section-description{font-size:0.9625rem}}@media (min-width: 768px){.section-description{font-size:1.05rem}}@media (min-width: 1024px){.section-description{font-size:1.18125rem}}.dishes-list{list-style:none;padding:0;margin:0;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;gap:1rem}.dish-item{position:relative}.dish-header{display:-ms-flexbox;display:flex;-ms-flex-align:baseline;align-items:baseline;width:100%;gap:0.5rem}.dish-name{font-size:1rem;font-weight:700;text-transform:uppercase;letter-spacing:0.05em;-ms-flex-negative:0;flex-shrink:0}@media (min-width: 640px){.dish-name{font-size:1.1rem}}@media (min-width: 768px){.dish-name{font-size:1.2rem}}@media (min-width: 1024px){.dish-name{font-size:1.35rem}}.dish-dots{-ms-flex:1;flex:1;opacity:0.25;border-bottom:1px dotted;margin:0 0.55rem;position:relative;top:-5px;border-color:currentColor}.dish-price{font-size:1rem;font-weight:700;-ms-flex-negative:0;flex-shrink:0;text-align:right}@media (min-width: 640px){.dish-price{font-size:1.1rem}}@media (min-width: 768px){.dish-price{font-size:1.2rem}}@media (min-width: 1024px){.dish-price{font-size:1.35rem}}.dish-description{font-size:0.8125rem;margin-top:-0.9rem;line-height:1.4;opacity:0.7;color:inherit}@media (min-width: 640px){.dish-description{font-size:0.9425rem}}`;
+
+const BostonTemplate = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.dataJson = '{}';
+        this.themeJson = '{}';
+        this.fontConfig = {
+            google: {
+                families: ['Oswald:400,600,700', 'Merriweather:300,400,700'],
+            },
+        };
+    }
+    async componentWillLoad() {
+        await loadFonts(this.fontConfig);
+        applyFontFamily(this.el, 'Merriweather, serif');
+    }
+    render() {
+        let menuData = null;
+        try {
+            menuData = JSON.parse(this.dataJson);
+        }
+        catch (e) {
+            console.warn('Invalid dataJson provided to veleta-boston-template');
+        }
+        const theme = parseTheme(this.themeJson);
+        const primary = (theme === null || theme === void 0 ? void 0 : theme.primaryColor) || '#1a365d';
+        const fontBody = 'Merriweather, serif';
+        const fontTitle = 'Oswald, sans-serif';
+        if (!menuData) {
+            return index.h("div", { class: "menu-wrapper", style: { color: primary } });
+        }
+        const { sections, business } = menuData;
+        // Ordenar secciones por 'order'
+        const sortedSections = (sections || []).sort((a, b) => a.order - b.order);
+        return (index.h("div", { class: "menu-wrapper", style: { color: primary } }, index.h("div", { class: "menu-container" }, (business === null || business === void 0 ? void 0 : business.name) && (index.h("header", { class: "menu-header" }, index.h("h1", { class: "restaurant-title", style: { fontFamily: fontTitle } }, business.name))), index.h("div", { class: "sections-container" }, sortedSections.map(section => {
+            // Ordenar platos por 'order'
+            const sectionDishes = (section.dishes || []).sort((a, b) => a.order - b.order);
+            if (!sectionDishes.length)
+                return null;
+            return (index.h("section", { key: section.id, class: "menu-section" }, index.h("div", { class: "section-label-wrapper" }, index.h("div", { class: "section-label-line", style: { borderColor: primary } }), index.h("h2", { class: "section-label", style: { fontFamily: fontTitle, color: primary } }, section.title)), index.h("div", { class: "section-content" }, section.description && (index.h("p", { class: "section-description", style: { fontFamily: fontBody } }, section.description)), index.h("ul", { class: "dishes-list" }, sectionDishes.map(dish => (index.h("li", { key: dish.id, class: "dish-item" }, index.h("div", { class: "dish-header" }, index.h("h3", { class: "dish-name", style: { fontFamily: fontTitle, color: primary } }, dish.name), index.h("div", { class: "dish-dots" }), index.h("span", { class: "dish-price", style: { fontFamily: fontTitle, color: primary } }, formatPrice(dish.price))), dish.description && (index.h("p", { class: "dish-description", style: { fontFamily: fontBody } }, dish.description)))))))));
+        })))));
+    }
+    get el() { return index.getElement(this); }
+};
+BostonTemplate.style = bostonTemplateCss();
+
+exports.veleta_boston_template = BostonTemplate;
+//# sourceMappingURL=veleta-boston-template.entry.cjs.js.map

package/dist/cjs/veleta-templates.cjs.js

@@ -19,7 +19,7 @@ var patchBrowser = () => {
 
 patchBrowser().then(async (options) => {
   await appGlobals.globalScripts();
-  return index.bootstrapLazy([["veleta-demo-template.cjs",[[256,"veleta-demo-template",{"sectionsJson":[1,"sections-json"],"dishesJson":[1,"dishes-json"],"themeJson":[1,"theme-json"],"restaurantName":[1,"restaurant-name"]}]]],["veleta-menu-template-b.cjs",[[256,"veleta-menu-template-b",{"sectionsJson":[1,"sections-json"],"dishesJson":[1,"dishes-json"],"themeJson":[1,"theme-json"],"restaurantName":[1,"restaurant-name"]}]]]], options);
+  return index.bootstrapLazy([["veleta-boston-template.cjs",[[256,"veleta-boston-template",{"dataJson":[1,"data-json"],"themeJson":[1,"theme-json"]}]]]], options);
 });
 
 exports.setNonce = index.setNonce;

package/dist/collection/collection-manifest.json

@@ -1,7 +1,6 @@
 {
   "entries": [
-    "components/demo-template/demo-template.js",
-    "components/menu-template-b/menu-template-b.js"
+    "components/boston-template/boston-template.js"
   ],
   "compiler": {
     "name": "@stencil/core",

package/dist/collection/components/{menu-template-b/menu-template-b.js → boston-template/boston-template.js}

@@ -1,13 +1,11 @@
 import { h } from "@stencil/core";
 import { loadFonts, applyFontFamily } from "../../utils/font-loader";
-import { parseList, parseTheme } from "../../utils/prop-parser";
-import { getDishesBySection, formatPrice } from "../../utils/data-helpers";
-export class MenuTemplateB {
+import { parseTheme } from "../../utils/prop-parser";
+import { formatPrice } from "../../utils/data-helpers";
+export class BostonTemplate {
     constructor() {
-        this.sectionsJson = '[]';
-        this.dishesJson = '[]';
+        this.dataJson = '{}';
         this.themeJson = '{}';
-        this.restaurantName = '';
         this.fontConfig = {
             google: {
                 families: ['Oswald:400,600,700', 'Merriweather:300,400,700'],
@@ -19,71 +17,51 @@ export class MenuTemplateB {
         applyFontFamily(this.el, 'Merriweather, serif');
     }
     render() {
-        const sections = parseList(this.sectionsJson).sort((a, b) => a.order - b.order);
-        const dishes = parseList(this.dishesJson);
+        let menuData = null;
+        try {
+            menuData = JSON.parse(this.dataJson);
+        }
+        catch (e) {
+            console.warn('Invalid dataJson provided to veleta-boston-template');
+        }
         const theme = parseTheme(this.themeJson);
         const primary = (theme === null || theme === void 0 ? void 0 : theme.primaryColor) || '#1a365d';
         const fontBody = 'Merriweather, serif';
         const fontTitle = 'Oswald, sans-serif';
-        return (h("div", { key: '13f686e0069dee50b0b177187cd377f50d6935d2', class: "menu-wrapper", style: { color: primary } }, h("div", { key: 'b3d1b79d94cb4060e429f520122f2780b67e284b', class: "menu-container" }, this.restaurantName && (h("header", { key: '80b7b01796c067c64191ebe02904df58156b1305', class: "menu-header" }, h("h1", { key: 'b75dd9d478241674dc1e7728d238b1d390cfac82', class: "restaurant-title", style: { fontFamily: fontTitle } }, this.restaurantName))), h("div", { key: '96995a7755759113e096c9defb125ee41fda20b6', class: "sections-container" }, sections.map(section => {
-            const sectionDishes = getDishesBySection(section.id, dishes);
+        if (!menuData) {
+            return h("div", { class: "menu-wrapper", style: { color: primary } });
+        }
+        const { sections, business } = menuData;
+        // Ordenar secciones por 'order'
+        const sortedSections = (sections || []).sort((a, b) => a.order - b.order);
+        return (h("div", { class: "menu-wrapper", style: { color: primary } }, h("div", { class: "menu-container" }, (business === null || business === void 0 ? void 0 : business.name) && (h("header", { class: "menu-header" }, h("h1", { class: "restaurant-title", style: { fontFamily: fontTitle } }, business.name))), h("div", { class: "sections-container" }, sortedSections.map(section => {
+            // Ordenar platos por 'order'
+            const sectionDishes = (section.dishes || []).sort((a, b) => a.order - b.order);
             if (!sectionDishes.length)
                 return null;
             return (h("section", { key: section.id, class: "menu-section" }, h("div", { class: "section-label-wrapper" }, h("div", { class: "section-label-line", style: { borderColor: primary } }), h("h2", { class: "section-label", style: { fontFamily: fontTitle, color: primary } }, section.title)), h("div", { class: "section-content" }, section.description && (h("p", { class: "section-description", style: { fontFamily: fontBody } }, section.description)), h("ul", { class: "dishes-list" }, sectionDishes.map(dish => (h("li", { key: dish.id, class: "dish-item" }, h("div", { class: "dish-header" }, h("h3", { class: "dish-name", style: { fontFamily: fontTitle, color: primary } }, dish.name), h("div", { class: "dish-dots" }), h("span", { class: "dish-price", style: { fontFamily: fontTitle, color: primary } }, formatPrice(dish.price))), dish.description && (h("p", { class: "dish-description", style: { fontFamily: fontBody } }, dish.description)))))))));
         })))));
     }
-    static get is() { return "veleta-menu-template-b"; }
+    static get is() { return "veleta-boston-template"; }
     static get originalStyleUrls() {
         return {
-            "$": ["menu-template-b.css"]
+            "$": ["boston-template.css"]
         };
     }
     static get styleUrls() {
         return {
-            "$": ["menu-template-b.css"]
+            "$": ["boston-template.css"]
         };
     }
     static get properties() {
         return {
-            "sectionsJson": {
+            "dataJson": {
                 "type": "string",
                 "mutable": false,
                 "complexType": {
-                    "original": "string | Section[]",
-                    "resolved": "Section[] | string",
-                    "references": {
-                        "Section": {
-                            "location": "import",
-                            "path": "../../types/interfaces",
-                            "id": "src/types/interfaces.ts::Section"
-                        }
-                    }
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "sections-json",
-                "defaultValue": "'[]'"
-            },
-            "dishesJson": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string | Dish[]",
-                    "resolved": "Dish[] | string",
-                    "references": {
-                        "Dish": {
-                            "location": "import",
-                            "path": "../../types/interfaces",
-                            "id": "src/types/interfaces.ts::Dish"
-                        }
-                    }
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
                 },
                 "required": false,
                 "optional": false,
@@ -94,8 +72,8 @@ export class MenuTemplateB {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
-                "attribute": "dishes-json",
-                "defaultValue": "'[]'"
+                "attribute": "data-json",
+                "defaultValue": "'{}'"
             },
             "themeJson": {
                 "type": "string",
@@ -122,29 +100,9 @@ export class MenuTemplateB {
                 "reflect": false,
                 "attribute": "theme-json",
                 "defaultValue": "'{}'"
-            },
-            "restaurantName": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "restaurant-name",
-                "defaultValue": "''"
             }
         };
     }
     static get elementRef() { return "el"; }
 }
-//# sourceMappingURL=menu-template-b.js.map
+//# sourceMappingURL=boston-template.js.map

package/dist/collection/components/boston-template/boston-template.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"boston-template.js","sourceRoot":"","sources":["../../../src/components/boston-template/boston-template.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Prop, h, Element } from '@stencil/core';\nimport { Menu, Theme } from '../../types/interfaces';\nimport { loadFonts, applyFontFamily } from '../../utils/font-loader';\nimport { parseTheme } from '../../utils/prop-parser';\nimport { formatPrice } from '../../utils/data-helpers';\n\n@Component({\n  tag: 'veleta-boston-template',\n  styleUrl: 'boston-template.css',\n  shadow: false,\n})\nexport class BostonTemplate {\n  @Element() el: HTMLElement;\n\n  @Prop() dataJson: string = '{}';\n  @Prop() themeJson: string | Theme = '{}';\n\n  private readonly fontConfig = {\n    google: {\n      families: ['Oswald:400,600,700', 'Merriweather:300,400,700'],\n    },\n  };\n\n  async componentWillLoad() {\n    await loadFonts(this.fontConfig);\n    applyFontFamily(this.el, 'Merriweather, serif');\n  }\n\n  render() {\n    let menuData: Menu | null = null;\n    try {\n      menuData = JSON.parse(this.dataJson);\n    } catch (e) {\n      console.warn('Invalid dataJson provided to veleta-boston-template');\n    }\n\n    const theme = parseTheme(this.themeJson);\n    const primary = theme?.primaryColor || '#1a365d';\n    const fontBody = 'Merriweather, serif';\n    const fontTitle = 'Oswald, sans-serif';\n\n    if (!menuData) {\n      return <div class=\"menu-wrapper\" style={{ color: primary }}></div>;\n    }\n\n    const { sections, business } = menuData;\n    // Ordenar secciones por 'order'\n    const sortedSections = (sections || []).sort((a, b) => a.order - b.order);\n\n    return (\n      <div\n        class=\"menu-wrapper\"\n        style={{ color: primary }}\n      >\n        <div class=\"menu-container\">\n          {business?.name && (\n            <header class=\"menu-header\">\n              <h1 class=\"restaurant-title\" style={{ fontFamily: fontTitle }}>\n                {business.name}\n              </h1>\n            </header>\n          )}\n\n          {/* Layout: 1 columna mobile, 2 columnas tablet/desktop */}\n          <div class=\"sections-container\">\n            {sortedSections.map(section => {\n              // Ordenar platos por 'order'\n              const sectionDishes = (section.dishes || []).sort((a, b) => a.order - b.order);\n              if (!sectionDishes.length) return null;\n\n              return (\n                <section key={section.id} class=\"menu-section\">\n                  {/* Título vertical izquierdo */}\n                  <div class=\"section-label-wrapper\">\n                    <div class=\"section-label-line\" style={{ borderColor: primary }}></div>\n                    <h2\n                      class=\"section-label\"\n                      style={{ fontFamily: fontTitle, color: primary }}\n                    >\n                      {section.title}\n                    </h2>\n                  </div>\n\n                  {/* Contenido de platos */}\n                  <div class=\"section-content\">\n                    {section.description && (\n                      <p class=\"section-description\" style={{ fontFamily: fontBody }}>\n                        {section.description}\n                      </p>\n                    )}\n\n                    <ul class=\"dishes-list\">\n                      {sectionDishes.map(dish => (\n                        <li key={dish.id} class=\"dish-item\">\n                          <div class=\"dish-header\">\n                            <h3\n                              class=\"dish-name\"\n                              style={{ fontFamily: fontTitle, color: primary }}\n                            >\n                              {dish.name}\n                            </h3>\n                            <div\n                              class=\"dish-dots\"\n                            ></div>\n                            <span\n                              class=\"dish-price\"\n                              style={{ fontFamily: fontTitle, color: primary }}\n                            >\n                              {formatPrice(dish.price)}\n                            </span>\n                          </div>\n                          {dish.description && (\n                            <p class=\"dish-description\" style={{ fontFamily: fontBody }}>\n                              {dish.description}\n                            </p>\n                          )}\n                        </li>\n                      ))}\n                    </ul>\n                  </div>\n                </section>\n              );\n            })}\n          </div>\n        </div>\n      </div>\n    );\n  }\n}"]}

package/dist/collection/components.js

@@ -1,3 +1,2 @@
-export * from './components/demo-template/demo-template';
-export * from './components/menu-template-b/menu-template-b';
+export * from './components/boston-template/boston-template';
 //# sourceMappingURL=components.js.map

package/dist/collection/components.js.map

@@ -1 +1 @@
-{"version":3,"file":"components.js","sourceRoot":"","sources":["../src/components.ts"],"names":[],"mappings":"AAAA,cAAc,0CAA0C,CAAC;AACzD,cAAc,8CAA8C,CAAC","sourcesContent":["export * from './components/demo-template/demo-template';\nexport * from './components/menu-template-b/menu-template-b';\n\n"]}
+{"version":3,"file":"components.js","sourceRoot":"","sources":["../src/components.ts"],"names":[],"mappings":"AAAA,cAAc,8CAA8C,CAAC","sourcesContent":["export * from './components/boston-template/boston-template';\n\n"]}

package/dist/collection/types/interfaces.js.map

@@ -1 +1 @@
-{"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../src/types/interfaces.ts"],"names":[],"mappings":"","sourcesContent":["/**\n * Representa una sección del menú que agrupa platos.\n */\nexport interface Section {\n  id: string;                    // Identificador único de la sección (requerido)\n  title: string;                 // Título de la sección (requerido)\n  description?: string;           // Descripción opcional de la sección\n  order: number;                 // Índice de orden para ordenar secciones (requerido)\n}\n\n/**\n * Representa un plato individual del menú que pertenece a una sección.\n */\nexport interface Dish {\n  id: string;                    // Identificador único del plato (requerido)\n  name: string;                  // Nombre del plato (requerido)\n  price: number;                 // Precio del plato en euros (requerido, > 0)\n  description?: string;           // Descripción opcional del plato\n  sectionId: string;             // ID de la sección a la que pertenece (requerido)\n  order: number;                 // Índice de orden dentro de la sección (requerido)\n}\n\n/**\n * Representa la configuración de colores del tema para el template.\n */\nexport interface Theme {\n  id: string;                    // Identificador único del tema (requerido)\n  name: string;                  // Nombre del tema (requerido)\n  primaryColor: string;          // Color primario en formato hexadecimal (requerido, ej: \"#3B82F6\")\n  secondaryColor?: string | null; // Color secundario en formato hexadecimal (opcional, ej: \"#60A5FA\")\n  backgroundColor?: string | null; // Color de fondo en formato hexadecimal (opcional, ej: \"#FFFFFF\")\n}\n\n/**\n * Propiedades que reciben los componentes Stencil como strings JSON.\n */\nexport interface TemplateProps {\n  restaurantName: string;      // Nombre del restaurante\n  sectionsJson: string;          // JSON string del array de secciones\n  dishesJson: string;            // JSON string del array de platos\n  themeJson: string;             // JSON string del objeto de tema\n}\n\n"]}
+{"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../src/types/interfaces.ts"],"names":[],"mappings":"","sourcesContent":["/**\n * Representa un plato individual del menú.\n */\nexport interface Dish {\n  id: string;\n  name: string;\n  price: number;\n  available: boolean;\n  order: number;\n  description?: string;\n}\n\n/**\n * Representa la configuración de colores del tema para el template.\n */\nexport interface Theme {\n  id: string;\n  name: string;\n  primaryColor: string;\n  secondaryColor?: string | null;\n  backgroundColor?: string | null;\n}\n\nexport interface MenuInfo {\n  id: string;\n  businessId: string;\n  name: string;\n  slug: string;\n  active: boolean;\n}\n\nexport interface BusinessInfo {\n  name: string;\n  description: string;\n  instagramUrl: string;\n}\n\nexport interface SectionWithDishes {\n  id: string;\n  title: string;\n  order: number;\n  description?: string;\n  dishes: Dish[];\n}\n\nexport interface Menu {\n  menu: MenuInfo;\n  sections: SectionWithDishes[];\n  business: BusinessInfo;\n}\n"]}

package/dist/collection/utils/data-helpers.js

@@ -1,11 +1,3 @@
-/**
- * Obtiene los platos de una sección específica, ordenados por order.
- */
-export function getDishesBySection(sectionId, dishes) {
-    return dishes
-        .filter(d => d.sectionId === sectionId)
-        .sort((a, b) => a.order - b.order);
-}
 /**
  * Formatea un precio como string con símbolo de euro.
  * Si es un número entero, no muestra decimales.

package/dist/collection/utils/data-helpers.js.map

@@ -1 +1 @@
-{"version":3,"file":"data-helpers.js","sourceRoot":"","sources":["../../src/utils/data-helpers.ts"],"names":[],"mappings":"AAEA;;GAEG;AACH,MAAM,UAAU,kBAAkB,CAAC,SAAiB,EAAE,MAAc;IAClE,OAAO,MAAM;SACV,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS,KAAK,SAAS,CAAC;SACtC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,KAAK,GAAG,CAAC,CAAC,KAAK,CAAC,CAAC;AACvC,CAAC;AAED;;;GAGG;AACH,MAAM,UAAU,WAAW,CAAC,KAAa;IACvC,OAAO,CAAC,KAAK,GAAG,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,QAAQ,EAAE,CAAC,CAAC,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,GAAG,GAAG,CAAC;AACvE,CAAC","sourcesContent":["import { Dish } from '../types/interfaces';\n\n/**\n * Obtiene los platos de una sección específica, ordenados por order.\n */\nexport function getDishesBySection(sectionId: string, dishes: Dish[]): Dish[] {\n  return dishes\n    .filter(d => d.sectionId === sectionId)\n    .sort((a, b) => a.order - b.order);\n}\n\n/**\n * Formatea un precio como string con símbolo de euro.\n * Si es un número entero, no muestra decimales.\n */\nexport function formatPrice(price: number): string {\n  return (price % 1 === 0 ? price.toString() : price.toFixed(2)) + '€';\n}\n\n"]}
+{"version":3,"file":"data-helpers.js","sourceRoot":"","sources":["../../src/utils/data-helpers.ts"],"names":[],"mappings":"AAAA;;;GAGG;AACH,MAAM,UAAU,WAAW,CAAC,KAAa;IACvC,OAAO,CAAC,KAAK,GAAG,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,QAAQ,EAAE,CAAC,CAAC,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,GAAG,GAAG,CAAC;AACvE,CAAC","sourcesContent":["/**\n * Formatea un precio como string con símbolo de euro.\n * Si es un número entero, no muestra decimales.\n */\nexport function formatPrice(price: number): string {\n  return (price % 1 === 0 ? price.toString() : price.toFixed(2)) + '€';\n}\n\n\n"]}

package/dist/components/veleta-boston-template.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface VeletaBostonTemplate extends Components.VeletaBostonTemplate, HTMLElement {}
+export const VeletaBostonTemplate: {
+    prototype: VeletaBostonTemplate;
+    new (): VeletaBostonTemplate;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/veleta-boston-template.js

@@ -0,0 +1,171 @@
+import { t as transformTag, p as proxyCustomElement, H, h } from './index.js';
+
+/**
+ * Carga fuentes usando webfontloader de forma dinámica.
+ * Esta función carga el módulo webfontloader solo cuando es necesario.
+ *
+ * @param fontConfig Configuración de fuentes para webfontloader
+ * @returns Promise que se resuelve cuando las fuentes se cargan
+ */
+async function loadFonts(fontConfig) {
+    if (!fontConfig || (!fontConfig.google && !fontConfig.custom)) {
+        return Promise.resolve();
+    }
+    try {
+        // Importación dinámica de webfontloader
+        // webfontloader puede exportar de diferentes formas según el entorno
+        const webfontloaderModule = await import('./p-DjUJwx0S.js').then(function (n) { return n.w; });
+        const WebFont = webfontloaderModule.default || webfontloaderModule;
+        if (!WebFont || typeof WebFont.load !== 'function') {
+            console.warn('webfontloader no está disponible o no tiene el método load');
+            return Promise.resolve();
+        }
+        return new Promise((resolve) => {
+            const config = Object.assign(Object.assign({}, fontConfig), { active: () => {
+                    if (fontConfig.active) {
+                        fontConfig.active();
+                    }
+                    resolve();
+                }, inactive: () => {
+                    if (fontConfig.inactive) {
+                        fontConfig.inactive();
+                    }
+                    // No rechazamos la promesa, solo resolvemos
+                    // para que el template pueda renderizarse con fuentes por defecto
+                    resolve();
+                } });
+            WebFont.load(config);
+        });
+    }
+    catch (error) {
+        console.error('Error loading webfontloader:', error);
+        // Resolvemos en lugar de rechazar para que el template pueda renderizarse
+        return Promise.resolve();
+    }
+}
+/**
+ * Aplica la familia de fuente al elemento raíz del componente.
+ *
+ * @param element Elemento HTML al que aplicar la fuente
+ * @param fontFamily Familia de fuente CSS (ej: "Roboto, sans-serif")
+ */
+function applyFontFamily(element, fontFamily) {
+    if (element) {
+        element.style.fontFamily = fontFamily;
+    }
+}
+
+/**
+ * Parsea un prop que puede ser un string JSON o un array/objeto directo.
+ * Compatible con Angular/Ionic (objetos directos) y Astro/vanilla JS (strings JSON).
+ */
+/**
+ * Parsea un prop de tema que puede ser un string JSON o un objeto directo.
+ * Compatible con Angular/Ionic (objetos directos) y Astro/vanilla JS (strings JSON).
+ */
+function parseTheme(themeJson) {
+    try {
+        // Si ya es un objeto (Angular/Ionic pasa objetos directamente), devolverlo
+        if (typeof themeJson === 'object' && themeJson !== null && !Array.isArray(themeJson)) {
+            return themeJson;
+        }
+        // Si es string, parsearlo (Astro, vanilla JS, etc. pasan strings JSON)
+        if (typeof themeJson === 'string') {
+            const cleaned = themeJson.trim();
+            if (!cleaned || cleaned === '{}') {
+                return null;
+            }
+            const res = JSON.parse(cleaned);
+            return res && typeof res === 'object' && !Array.isArray(res)
+                ? res
+                : null;
+        }
+        return null;
+    }
+    catch (_a) {
+        return null;
+    }
+}
+
+/**
+ * Formatea un precio como string con símbolo de euro.
+ * Si es un número entero, no muestra decimales.
+ */
+function formatPrice(price) {
+    return (price % 1 === 0 ? price.toString() : price.toFixed(2)) + '€';
+}
+
+const bostonTemplateCss = () => `.menu-wrapper{min-height:100vh;width:100%;padding:1.5rem 1rem;font-family:'Merriweather', serif;-webkit-box-sizing:border-box;box-sizing:border-box;margin:0;display:block}.menu-wrapper *,.menu-wrapper *::before,.menu-wrapper *::after{-webkit-box-sizing:border-box;box-sizing:border-box}.menu-wrapper h1,.menu-wrapper h2,.menu-wrapper h3,.menu-wrapper h4,.menu-wrapper h5,.menu-wrapper h6,.menu-wrapper p,.menu-wrapper ul,.menu-wrapper ol,.menu-wrapper li,.menu-wrapper header,.menu-wrapper section,.menu-wrapper article,.menu-wrapper aside,.menu-wrapper nav,.menu-wrapper blockquote,.menu-wrapper figure,.menu-wrapper figcaption{margin:0;-webkit-margin-before:0;margin-block-start:0;-webkit-margin-after:0;margin-block-end:0;-webkit-margin-start:0;margin-inline-start:0;-webkit-margin-end:0;margin-inline-end:0}.menu-wrapper ul,.menu-wrapper ol{padding:0}@media (min-width: 640px){.menu-wrapper{padding:2rem 1.5rem}}@media (min-width: 768px){.menu-wrapper{padding:2rem 1rem}}.menu-container{max-width:1280px;margin:0 auto}.menu-header{text-align:center}@media (min-width: 768px){.menu-header{margin-bottom:3rem}}.restaurant-title{font-size:2rem;font-weight:700;text-transform:uppercase;letter-spacing:0.05em;line-height:1.1;margin:0 0 1.5rem 0!important}@media (min-width: 640px){.restaurant-title{font-size:2.5rem;margin:0 0 3rem 0!important}}@media (min-width: 768px){.restaurant-title{font-size:3rem}}@media (min-width: 1024px){.restaurant-title{font-size:3.5rem}}.sections-container{display:grid;grid-template-columns:1fr;gap:3rem}@media (min-width: 768px){.sections-container{grid-template-columns:repeat(2, 1fr);gap:4rem}}.menu-section{display:-ms-flexbox;display:flex;width:100%;position:relative}.section-label-wrapper{position:relative;width:3rem;-ms-flex-negative:0;flex-shrink:0;margin-right:1rem;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:center;align-items:center;-ms-flex-pack:end;justify-content:flex-end}.section-label-line{position:absolute;right:0;top:0;bottom:0;width:1px;border-right:1px solid}.section-label{font-weight:700;font-size:1.125rem;text-transform:uppercase;letter-spacing:0.15em;-webkit-writing-mode:vertical-rl;-ms-writing-mode:tb-rl;writing-mode:vertical-rl;-webkit-transform:rotate(180deg);transform:rotate(180deg);text-align:right;white-space:nowrap;margin:0 0 0.5rem 0;-webkit-margin-after:0.5rem;margin-block-end:0.5rem;position:absolute;top:0}@media (min-width: 640px){.section-label{font-size:1.2375rem}}@media (min-width: 768px){.section-label{font-size:1.35rem}}@media (min-width: 1024px){.section-label{font-size:1.51875rem}}.section-content{-ms-flex:1;flex:1;padding-top:0.25rem}.section-description{font-size:0.875rem;font-style:italic;margin:0 0 1rem 0!important;-webkit-margin-after:1rem;margin-block-end:1rem;opacity:0.75;color:inherit}@media (min-width: 640px){.section-description{font-size:0.9625rem}}@media (min-width: 768px){.section-description{font-size:1.05rem}}@media (min-width: 1024px){.section-description{font-size:1.18125rem}}.dishes-list{list-style:none;padding:0;margin:0;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;gap:1rem}.dish-item{position:relative}.dish-header{display:-ms-flexbox;display:flex;-ms-flex-align:baseline;align-items:baseline;width:100%;gap:0.5rem}.dish-name{font-size:1rem;font-weight:700;text-transform:uppercase;letter-spacing:0.05em;-ms-flex-negative:0;flex-shrink:0}@media (min-width: 640px){.dish-name{font-size:1.1rem}}@media (min-width: 768px){.dish-name{font-size:1.2rem}}@media (min-width: 1024px){.dish-name{font-size:1.35rem}}.dish-dots{-ms-flex:1;flex:1;opacity:0.25;border-bottom:1px dotted;margin:0 0.55rem;position:relative;top:-5px;border-color:currentColor}.dish-price{font-size:1rem;font-weight:700;-ms-flex-negative:0;flex-shrink:0;text-align:right}@media (min-width: 640px){.dish-price{font-size:1.1rem}}@media (min-width: 768px){.dish-price{font-size:1.2rem}}@media (min-width: 1024px){.dish-price{font-size:1.35rem}}.dish-description{font-size:0.8125rem;margin-top:-0.9rem;line-height:1.4;opacity:0.7;color:inherit}@media (min-width: 640px){.dish-description{font-size:0.9425rem}}`;
+
+const BostonTemplate = /*@__PURE__*/ proxyCustomElement(class BostonTemplate extends H {
+    constructor(registerHost) {
+        super();
+        if (registerHost !== false) {
+            this.__registerHost();
+        }
+        this.dataJson = '{}';
+        this.themeJson = '{}';
+        this.fontConfig = {
+            google: {
+                families: ['Oswald:400,600,700', 'Merriweather:300,400,700'],
+            },
+        };
+    }
+    async componentWillLoad() {
+        await loadFonts(this.fontConfig);
+        applyFontFamily(this.el, 'Merriweather, serif');
+    }
+    render() {
+        let menuData = null;
+        try {
+            menuData = JSON.parse(this.dataJson);
+        }
+        catch (e) {
+            console.warn('Invalid dataJson provided to veleta-boston-template');
+        }
+        const theme = parseTheme(this.themeJson);
+        const primary = (theme === null || theme === void 0 ? void 0 : theme.primaryColor) || '#1a365d';
+        const fontBody = 'Merriweather, serif';
+        const fontTitle = 'Oswald, sans-serif';
+        if (!menuData) {
+            return h("div", { class: "menu-wrapper", style: { color: primary } });
+        }
+        const { sections, business } = menuData;
+        // Ordenar secciones por 'order'
+        const sortedSections = (sections || []).sort((a, b) => a.order - b.order);
+        return (h("div", { class: "menu-wrapper", style: { color: primary } }, h("div", { class: "menu-container" }, (business === null || business === void 0 ? void 0 : business.name) && (h("header", { class: "menu-header" }, h("h1", { class: "restaurant-title", style: { fontFamily: fontTitle } }, business.name))), h("div", { class: "sections-container" }, sortedSections.map(section => {
+            // Ordenar platos por 'order'
+            const sectionDishes = (section.dishes || []).sort((a, b) => a.order - b.order);
+            if (!sectionDishes.length)
+                return null;
+            return (h("section", { key: section.id, class: "menu-section" }, h("div", { class: "section-label-wrapper" }, h("div", { class: "section-label-line", style: { borderColor: primary } }), h("h2", { class: "section-label", style: { fontFamily: fontTitle, color: primary } }, section.title)), h("div", { class: "section-content" }, section.description && (h("p", { class: "section-description", style: { fontFamily: fontBody } }, section.description)), h("ul", { class: "dishes-list" }, sectionDishes.map(dish => (h("li", { key: dish.id, class: "dish-item" }, h("div", { class: "dish-header" }, h("h3", { class: "dish-name", style: { fontFamily: fontTitle, color: primary } }, dish.name), h("div", { class: "dish-dots" }), h("span", { class: "dish-price", style: { fontFamily: fontTitle, color: primary } }, formatPrice(dish.price))), dish.description && (h("p", { class: "dish-description", style: { fontFamily: fontBody } }, dish.description)))))))));
+        })))));
+    }
+    get el() { return this; }
+    static get style() { return bostonTemplateCss(); }
+}, [256, "veleta-boston-template", {
+        "dataJson": [1, "data-json"],
+        "themeJson": [1, "theme-json"]
+    }]);
+function defineCustomElement$1() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["veleta-boston-template"];
+    components.forEach(tagName => { switch (tagName) {
+        case "veleta-boston-template":
+            if (!customElements.get(transformTag(tagName))) {
+                customElements.define(transformTag(tagName), BostonTemplate);
+            }
+            break;
+    } });
+}
+defineCustomElement$1();
+
+const VeletaBostonTemplate = BostonTemplate;
+const defineCustomElement = defineCustomElement$1;
+
+export { VeletaBostonTemplate, defineCustomElement };
+//# sourceMappingURL=veleta-boston-template.js.map
+
+//# sourceMappingURL=veleta-boston-template.js.map