veleta-templates 0.0.1

package/dist/collection/components/demo-template/demo-template.js

@@ -0,0 +1,144 @@
+import { h } from "@stencil/core";
+import { loadFonts, applyFontFamily } from "../../utils/font-loader";
+import { parseList } from "../../utils/prop-parser";
+export class DemoTemplate {
+    constructor() {
+        this.sectionsJson = '[]';
+        this.dishesJson = '[]';
+        this.themeJson = '{}';
+        this.restaurantName = '';
+        // Configuración de fuente fija para este template
+        this.fontFamily = 'Roboto, sans-serif';
+        this.fontConfig = {
+            google: {
+                families: ['Roboto:300,400,700']
+            }
+        };
+    }
+    async componentWillLoad() {
+        // Cargar la fuente fija del template
+        await loadFonts(this.fontConfig);
+        applyFontFamily(this.el, this.fontFamily);
+    }
+    render() {
+        const sections = parseList(this.sectionsJson);
+        return (h("div", { key: '3603e4d5bad99be18a27160cf265f7d6c0e8c3dc', class: "veleta-demo-template" }, this.restaurantName && (h("h1", { key: '181dfda2dd33e72e14617f362399ad7fc5b02d87', class: "restaurant-name" }, this.restaurantName)), sections.length > 0 ? (h("div", { class: "sections-list" }, h("h2", { class: "sections-title" }, "Secciones"), h("ul", { class: "sections-ul" }, sections
+            .sort((a, b) => a.order - b.order)
+            .map((section) => (h("li", { key: section.id, class: "section-item" }, h("div", { class: "section-title-text" }, section.title), section.description && (h("div", { class: "section-description-text" }, section.description)))))))) : (h("p", { class: "no-sections" }, "No hay secciones disponibles"))));
+    }
+    static get is() { return "veleta-demo-template"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["demo-template.css"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["demo-template.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "sectionsJson": {
+                "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"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "dishes-json",
+                "defaultValue": "'[]'"
+            },
+            "themeJson": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string | Theme",
+                    "resolved": "Theme | string",
+                    "references": {
+                        "Theme": {
+                            "location": "import",
+                            "path": "../../types/interfaces",
+                            "id": "src/types/interfaces.ts::Theme"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "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=demo-template.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"demo-template.js","sourceRoot":"","sources":["../../../src/components/demo-template/demo-template.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,OAAO,EAAE,MAAM,eAAe,CAAC;AAE5D,OAAO,EAAE,SAAS,EAAE,eAAe,EAAE,MAAM,yBAAyB,CAAC;AACrE,OAAO,EAAE,SAAS,EAAE,MAAM,yBAAyB,CAAC;AAOpD,MAAM,OAAO,YAAY;IALzB;QAQU,iBAAY,GAAuB,IAAI,CAAC;QACxC,eAAU,GAAoB,IAAI,CAAC;QACnC,cAAS,GAAmB,IAAI,CAAC;QACjC,mBAAc,GAAW,EAAE,CAAC;QAEpC,kDAAkD;QACjC,eAAU,GAAW,oBAAoB,CAAC;QAC1C,eAAU,GAAG;YAC5B,MAAM,EAAE;gBACN,QAAQ,EAAE,CAAC,oBAAoB,CAAC;aACjC;SACF,CAAC;KA2CH;IAzCC,KAAK,CAAC,iBAAiB;QACrB,qCAAqC;QACrC,MAAM,SAAS,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;QACjC,eAAe,CAAC,IAAI,CAAC,EAAE,EAAE,IAAI,CAAC,UAAU,CAAC,CAAC;IAC5C,CAAC;IAED,MAAM;QACJ,MAAM,QAAQ,GAAG,SAAS,CAAU,IAAI,CAAC,YAAY,CAAC,CAAC;QAEvD,OAAO,CACL,4DAAK,KAAK,EAAC,sBAAsB;YAC9B,IAAI,CAAC,cAAc,IAAI,CACtB,2DAAI,KAAK,EAAC,iBAAiB,IACxB,IAAI,CAAC,cAAc,CACjB,CACN;YAEA,QAAQ,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,CACrB,WAAK,KAAK,EAAC,eAAe;gBACxB,UAAI,KAAK,EAAC,gBAAgB,gBAAe;gBACzC,UAAI,KAAK,EAAC,aAAa,IACpB,QAAQ;qBACN,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,KAAK,GAAG,CAAC,CAAC,KAAK,CAAC;qBACjC,GAAG,CAAC,CAAC,OAAO,EAAE,EAAE,CAAC,CAChB,UAAI,GAAG,EAAE,OAAO,CAAC,EAAE,EAAE,KAAK,EAAC,cAAc;oBACvC,WAAK,KAAK,EAAC,oBAAoB,IAAE,OAAO,CAAC,KAAK,CAAO;oBACpD,OAAO,CAAC,WAAW,IAAI,CACtB,WAAK,KAAK,EAAC,0BAA0B,IAClC,OAAO,CAAC,WAAW,CAChB,CACP,CACE,CACN,CAAC,CACD,CACD,CACP,CAAC,CAAC,CAAC,CACF,SAAG,KAAK,EAAC,aAAa,mCAAiC,CACxD,CACG,CACP,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Prop, h, Element } from '@stencil/core';\nimport { Section, Dish, Theme } from '../../types/interfaces';\nimport { loadFonts, applyFontFamily } from '../../utils/font-loader';\nimport { parseList } from '../../utils/prop-parser';\n\n@Component({\n  tag: 'veleta-demo-template',\n  styleUrl: 'demo-template.css',\n  shadow: false,\n})\nexport class DemoTemplate {\n  @Element() el: HTMLElement;\n\n  @Prop() sectionsJson: string | Section[] = '[]';\n  @Prop() dishesJson: string | Dish[] = '[]';\n  @Prop() themeJson: string | Theme = '{}';\n  @Prop() restaurantName: string = '';\n\n  // Configuración de fuente fija para este template\n  private readonly fontFamily: string = 'Roboto, sans-serif';\n  private readonly fontConfig = {\n    google: {\n      families: ['Roboto:300,400,700']\n    }\n  };\n\n  async componentWillLoad() {\n    // Cargar la fuente fija del template\n    await loadFonts(this.fontConfig);\n    applyFontFamily(this.el, this.fontFamily);\n  }\n\n  render() {\n    const sections = parseList<Section>(this.sectionsJson);\n\n    return (\n      <div class=\"veleta-demo-template\">\n        {this.restaurantName && (\n          <h1 class=\"restaurant-name\">\n            {this.restaurantName}\n          </h1>\n        )}\n        \n        {sections.length > 0 ? (\n          <div class=\"sections-list\">\n            <h2 class=\"sections-title\">Secciones</h2>\n            <ul class=\"sections-ul\">\n              {sections\n                .sort((a, b) => a.order - b.order)\n                .map((section) => (\n                  <li key={section.id} class=\"section-item\">\n                    <div class=\"section-title-text\">{section.title}</div>\n                    {section.description && (\n                      <div class=\"section-description-text\">\n                        {section.description}\n                      </div>\n                    )}\n                  </li>\n                ))}\n            </ul>\n          </div>\n        ) : (\n          <p class=\"no-sections\">No hay secciones disponibles</p>\n        )}\n      </div>\n    );\n  }\n}\n\n"]}

package/dist/collection/components/menu-template-b/menu-template-b.css

@@ -0,0 +1,305 @@
+.menu-wrapper {
+  min-height: 100vh;
+  width: 100%;
+  padding: 1.5rem 1rem;
+  font-family: 'Merriweather', serif;
+  /* Reset para aislar de estilos globales */
+  box-sizing: border-box;
+  margin: 0;
+  display: block;
+}
+
+/* Asegurar que todos los elementos hijos usen border-box */
+.menu-wrapper *,
+.menu-wrapper *::before,
+.menu-wrapper *::after {
+  box-sizing: border-box;
+}
+
+/* Reset completo de márgenes para todos los elementos HTML comunes */
+.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;
+  margin-block-start: 0;
+  margin-block-end: 0;
+  margin-inline-start: 0;
+  margin-inline-end: 0;
+}
+
+/* Reset adicional para padding en listas */
+.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: flex;
+  width: 100%;
+  position: relative;
+}
+
+/* Título vertical izquierdo */
+.section-label-wrapper {
+  position: relative;
+  width: 3rem;
+  flex-shrink: 0;
+  margin-right: 1rem;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  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;
+  writing-mode: vertical-rl;
+  transform: rotate(180deg);
+  text-align: right;
+  white-space: nowrap;
+  margin: 0 0 0.5rem 0;
+  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;
+  }
+}
+
+/* Contenido de la sección */
+.section-content {
+  flex: 1;
+  padding-top: 0.25rem;
+}
+
+.section-description {
+  font-size: 0.875rem;
+  font-style: italic;
+  margin: 0 0 1rem 0!important;
+  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: flex;
+  flex-direction: column;
+  gap: 1rem;
+}
+
+.dish-item {
+  position: relative;
+}
+
+.dish-header {
+  display: flex;
+  align-items: baseline;
+  width: 100%;
+  gap: 0.5rem;
+}
+
+.dish-name {
+  font-size: 1rem;
+  font-weight: 700;
+  text-transform: uppercase;
+  letter-spacing: 0.05em;
+  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 {
+  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;
+  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;
+  }
+}

package/dist/collection/components/menu-template-b/menu-template-b.js

@@ -0,0 +1,150 @@
+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 {
+    constructor() {
+        this.sectionsJson = '[]';
+        this.dishesJson = '[]';
+        this.themeJson = '{}';
+        this.restaurantName = '';
+        this.fontConfig = {
+            google: {
+                families: ['Oswald:400,600,700', 'Merriweather:300,400,700'],
+            },
+        };
+    }
+    async componentWillLoad() {
+        await loadFonts(this.fontConfig);
+        applyFontFamily(this.el, 'Merriweather, serif');
+    }
+    render() {
+        const sections = parseList(this.sectionsJson).sort((a, b) => a.order - b.order);
+        const dishes = parseList(this.dishesJson);
+        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 (!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 originalStyleUrls() {
+        return {
+            "$": ["menu-template-b.css"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["menu-template-b.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "sectionsJson": {
+                "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"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "dishes-json",
+                "defaultValue": "'[]'"
+            },
+            "themeJson": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string | Theme",
+                    "resolved": "Theme | string",
+                    "references": {
+                        "Theme": {
+                            "location": "import",
+                            "path": "../../types/interfaces",
+                            "id": "src/types/interfaces.ts::Theme"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "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

package/dist/collection/components/menu-template-b/menu-template-b.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"menu-template-b.js","sourceRoot":"","sources":["../../../src/components/menu-template-b/menu-template-b.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Prop, h, Element } from '@stencil/core';\nimport { Section, Dish, Theme } from '../../types/interfaces';\nimport { loadFonts, applyFontFamily } from '../../utils/font-loader';\nimport { parseList, parseTheme } from '../../utils/prop-parser';\nimport { getDishesBySection, formatPrice } from '../../utils/data-helpers';\n\n@Component({\n  tag: 'veleta-menu-template-b',\n  styleUrl: 'menu-template-b.css',\n  shadow: false,\n})\nexport class MenuTemplateB {\n  @Element() el: HTMLElement;\n\n  @Prop() sectionsJson: string | Section[] = '[]';\n  @Prop() dishesJson: string | Dish[] = '[]';\n  @Prop() themeJson: string | Theme = '{}';\n  @Prop() restaurantName: string = '';\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    const sections = parseList<Section>(this.sectionsJson).sort(\n      (a, b) => a.order - b.order,\n    );\n    const dishes = parseList<Dish>(this.dishesJson);\n    const theme = parseTheme(this.themeJson);\n\n    const primary = theme?.primaryColor || '#1a365d';\n    const fontBody = 'Merriweather, serif';\n    const fontTitle = 'Oswald, sans-serif';\n\n    return (\n      <div\n        class=\"menu-wrapper\"\n        style={{ color: primary }}\n      >\n        <div class=\"menu-container\">\n          {this.restaurantName && (\n            <header class=\"menu-header\">\n              <h1 class=\"restaurant-title\" style={{ fontFamily: fontTitle }}>\n                {this.restaurantName}\n              </h1>\n            </header>\n          )}\n\n          {/* Layout: 1 columna mobile, 2 columnas tablet/desktop */}\n          <div class=\"sections-container\">\n            {sections.map(section => {\n              const sectionDishes = getDishesBySection(section.id, dishes);\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

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

package/dist/collection/components.js.map

@@ -0,0 +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"]}

package/dist/collection/index.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=index.js.map

package/dist/collection/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"","sourcesContent":["export { Components, JSX } from './components.d';\n\n"]}

package/dist/collection/types/index.js

@@ -0,0 +1,2 @@
+export * from './interfaces';
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/types/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC","sourcesContent":["export * from './interfaces';\n\n"]}

package/dist/collection/types/interfaces.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=interfaces.js.map

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

@@ -0,0 +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"]}

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

@@ -0,0 +1,16 @@
+/**
+ * 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.
+ */
+export function formatPrice(price) {
+    return (price % 1 === 0 ? price.toString() : price.toFixed(2)) + '€';
+}
+//# sourceMappingURL=data-helpers.js.map