@forjacms/sections 1.2.6

package/dist/collection/components/forja-newsletter/forja-newsletter.js

@@ -0,0 +1,141 @@
+import { h } from "@stencil/core";
+import { sectionLabel, sectionId } from "../../utils/a11y";
+export class ForjaNewsletter {
+    constructor() {
+        this.buttonText = 'Subscribe';
+        this.handleSubmit = (e) => {
+            e.preventDefault();
+            const form = e.target;
+            this.forjaSubmit.emit(new FormData(form));
+        };
+    }
+    render() {
+        const emailId = sectionId(this.sectionTitle, 'newsletter-email');
+        const nameId = sectionId(this.sectionTitle, 'newsletter-name');
+        return (h("section", { key: '2b01646d3aa10d12c9568551edc2f8836a1e6199', class: "forja-newsletter", "aria-label": sectionLabel(this.sectionTitle, 'Newsletter') }, h("slot", { key: '020fd3a2e10a86f6bec4f9499e217818c534885f', name: "before" }), this.sectionTitle && h("h2", { key: 'e540517a30deb49e8d3b1271b8099fe2c5167f02', class: "forja-newsletter__title" }, this.sectionTitle), this.text && h("div", { key: 'c31f0ad333733992f426ca1b564a609603ce7f43', class: "forja-newsletter__text", innerHTML: this.text }), h("form", { key: '08ba3a98b082670794797a08048ab1cc683aaef4', class: "forja-newsletter__form", action: this.formAction, method: this.formAction ? 'post' : undefined, onSubmit: this.handleSubmit }, this.showName && (h("div", { key: '9537213f04bdd4d2e2008a783bc70a7e7a268865', class: "forja-newsletter__field" }, h("label", { key: '8feb551b009eb8f288cbcb54b18360c9fe09a694', class: "forja-newsletter__label", htmlFor: nameId }, "Name"), h("input", { key: 'b2df119a4d000e46a8e1cfb1ab2a2514be2f28a4', id: nameId, name: "name", type: "text", class: "forja-newsletter__input" }))), h("div", { key: '7fff741fe589ee3bc7f5eb278f07dfb78a4363c1', class: "forja-newsletter__field" }, h("label", { key: '2dda48f90d5303de371101b1da09e0402291a704', class: "forja-newsletter__label", htmlFor: emailId }, "Email"), h("input", { key: '7c913bcd86483511926cd2c6df3b2d8fae202a3b', id: emailId, name: "email", type: "email", class: "forja-newsletter__input", required: true, "aria-required": "true" })), h("button", { key: '374357cafdc13172944199b9537f32fa252fa274', type: "submit", class: "forja-newsletter__submit" }, this.buttonText)), h("slot", { key: '253f3650ec3839083c2ef1a768c78627fef141b3', name: "after" })));
+    }
+    static get is() { return "forja-newsletter"; }
+    static get properties() {
+        return {
+            "sectionTitle": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string | undefined",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "section-title"
+            },
+            "text": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string | undefined",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "text"
+            },
+            "buttonText": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string | undefined",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "button-text",
+                "defaultValue": "'Subscribe'"
+            },
+            "formAction": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string | undefined",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "form-action"
+            },
+            "showName": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean | undefined",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "show-name"
+            }
+        };
+    }
+    static get events() {
+        return [{
+                "method": "forjaSubmit",
+                "name": "forjaSubmit",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "complexType": {
+                    "original": "FormData",
+                    "resolved": "FormData",
+                    "references": {
+                        "FormData": {
+                            "location": "global",
+                            "id": "global::FormData"
+                        }
+                    }
+                }
+            }];
+    }
+}

package/dist/collection/components/forja-portfolio/forja-portfolio.js

@@ -0,0 +1,163 @@
+import { h } from "@stencil/core";
+import { sectionLabel } from "../../utils/a11y";
+export class ForjaPortfolio {
+    renderExperiences() {
+        if (!this.experiences || this.experiences.length === 0)
+            return null;
+        return (h("div", { class: "forja-portfolio__experiences" }, h("h3", { class: "forja-portfolio__group-title" }, "Experience"), h("ol", { class: "forja-portfolio__list" }, this.experiences.map(exp => (h("li", { class: "forja-portfolio__entry" }, h("article", { class: "forja-portfolio__card" }, exp.logoUrl && (h("img", { src: exp.logoUrl, alt: "", class: "forja-portfolio__logo", loading: "lazy" })), h("div", { class: "forja-portfolio__details" }, h("h4", { class: "forja-portfolio__role" }, exp.role), h("p", { class: "forja-portfolio__company" }, exp.company), exp.period && h("time", { class: "forja-portfolio__period" }, exp.period), exp.description && (h("div", { class: "forja-portfolio__description", innerHTML: exp.description }))))))))));
+    }
+    renderEducation() {
+        if (!this.education || this.education.length === 0)
+            return null;
+        return (h("div", { class: "forja-portfolio__education" }, h("h3", { class: "forja-portfolio__group-title" }, "Education"), h("ol", { class: "forja-portfolio__list" }, this.education.map(edu => (h("li", { class: "forja-portfolio__entry" }, h("article", { class: "forja-portfolio__card" }, h("div", { class: "forja-portfolio__details" }, h("h4", { class: "forja-portfolio__role" }, edu.degree), h("p", { class: "forja-portfolio__company" }, edu.institution), edu.period && h("time", { class: "forja-portfolio__period" }, edu.period), edu.description && (h("div", { class: "forja-portfolio__description", innerHTML: edu.description }))))))))));
+    }
+    renderSkills() {
+        if (!this.skills || this.skills.length === 0)
+            return null;
+        const grouped = this.skills.reduce((acc, skill) => {
+            const cat = skill.category || 'General';
+            if (!acc[cat])
+                acc[cat] = [];
+            acc[cat].push(skill);
+            return acc;
+        }, {});
+        return (h("div", { class: "forja-portfolio__skills" }, h("h3", { class: "forja-portfolio__group-title" }, "Skills"), Object.entries(grouped).map(([category, items]) => (h("div", { class: "forja-portfolio__skill-group" }, Object.keys(grouped).length > 1 && (h("h4", { class: "forja-portfolio__skill-category" }, category)), h("ul", { class: "forja-portfolio__skill-list", "data-columns": this.columns }, items.map(skill => (h("li", { class: "forja-portfolio__skill" }, skill.name)))))))));
+    }
+    render() {
+        return (h("section", { key: '96e2ad1a4250c58f0785ccf1dcf38c7ac5b8d53a', class: "forja-portfolio", "aria-label": sectionLabel(this.sectionTitle, 'Portfolio') }, h("slot", { key: 'a4f4d1379d09a2019e5e92de5bf0f65d8a78bf62', name: "before" }), this.sectionTitle && h("h2", { key: '3419d7e33cda89d94ad2166c02df2b5451715ca7', class: "forja-portfolio__title" }, this.sectionTitle), this.text && h("div", { key: '1dc200413658bde80829bd57b166772e6e27b8be', class: "forja-portfolio__text", innerHTML: this.text }), this.renderExperiences(), this.renderEducation(), this.renderSkills(), h("slot", { key: '4ea0373f8e21524b516dd3f4b5a967acd3c7d7cf', name: "after" })));
+    }
+    static get is() { return "forja-portfolio"; }
+    static get properties() {
+        return {
+            "sectionTitle": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string | undefined",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "section-title"
+            },
+            "text": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string | undefined",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "text"
+            },
+            "experiences": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "PortfolioExperience[]",
+                    "resolved": "PortfolioExperience[] | undefined",
+                    "references": {
+                        "PortfolioExperience": {
+                            "location": "import",
+                            "path": "../../types",
+                            "id": "src/types.ts::PortfolioExperience",
+                            "referenceLocation": "PortfolioExperience"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false
+            },
+            "education": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "EducationItem[]",
+                    "resolved": "EducationItem[] | undefined",
+                    "references": {
+                        "EducationItem": {
+                            "location": "import",
+                            "path": "../../types",
+                            "id": "src/types.ts::EducationItem",
+                            "referenceLocation": "EducationItem"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false
+            },
+            "skills": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "SkillItem[]",
+                    "resolved": "SkillItem[] | undefined",
+                    "references": {
+                        "SkillItem": {
+                            "location": "import",
+                            "path": "../../types",
+                            "id": "src/types.ts::SkillItem",
+                            "referenceLocation": "SkillItem"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false
+            },
+            "columns": {
+                "type": "number",
+                "mutable": false,
+                "complexType": {
+                    "original": "number",
+                    "resolved": "number | undefined",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "columns"
+            }
+        };
+    }
+}

package/dist/collection/components/forja-pricing/forja-pricing.js

@@ -0,0 +1,94 @@
+import { h } from "@stencil/core";
+import { sectionLabel } from "../../utils/a11y";
+export class ForjaPricing {
+    render() {
+        const hasTiers = this.tiers && this.tiers.length > 0;
+        return (h("section", { key: 'bae1df3d72dc351c1e55506fdfaad535f45814f6', class: "forja-pricing", "aria-label": sectionLabel(this.sectionTitle, 'Pricing') }, h("slot", { key: '343e7d5490dfc07cc2024661d404b1c2a44c46a9', name: "before" }), (this.sectionTitle || this.text) && (h("div", { key: 'e91c8e1945da57bc28bbc6ee09b72dca1dd03d22', class: "forja-pricing__header" }, this.sectionTitle && h("h2", { key: '81000892bb72e034613283df85928c1c667a4f95', class: "forja-pricing__title" }, this.sectionTitle), this.text && h("div", { key: '56363c268fb40a5512ab90005463bf43402e8c2f', class: "forja-pricing__text", innerHTML: this.text }))), hasTiers ? (h("div", { class: "forja-pricing__tiers", role: "list", "data-columns": this.columns }, this.tiers.map(tier => (h("div", { class: `forja-pricing__tier${tier.highlighted ? ' forja-pricing__tier--highlighted' : ''}`, role: "listitem" }, h("h3", { class: "forja-pricing__tier-name" }, tier.name), h("div", { class: "forja-pricing__price" }, h("span", { class: "forja-pricing__amount" }, tier.price), tier.period && h("span", { class: "forja-pricing__period" }, tier.period)), tier.description && h("p", { class: "forja-pricing__description" }, tier.description), tier.features && tier.features.length > 0 && (h("ul", { class: "forja-pricing__features" }, tier.features.map(feature => (h("li", { class: "forja-pricing__feature" }, feature))))), tier.buttonText && tier.buttonHref && (h("a", { href: tier.buttonHref, class: "forja-pricing__cta" }, tier.buttonText))))))) : (h("div", { class: "forja-pricing__tiers", role: "list", "data-columns": this.columns }, h("slot", null))), h("slot", { key: 'd4ed110c1c8ab8a865ba7c1066caf5867c36494c', name: "after" })));
+    }
+    static get is() { return "forja-pricing"; }
+    static get properties() {
+        return {
+            "sectionTitle": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string | undefined",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "section-title"
+            },
+            "text": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string | undefined",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "text"
+            },
+            "tiers": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "PricingTier[]",
+                    "resolved": "PricingTier[] | undefined",
+                    "references": {
+                        "PricingTier": {
+                            "location": "import",
+                            "path": "../../types",
+                            "id": "src/types.ts::PricingTier",
+                            "referenceLocation": "PricingTier"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false
+            },
+            "columns": {
+                "type": "number",
+                "mutable": false,
+                "complexType": {
+                    "original": "number",
+                    "resolved": "number | undefined",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "columns"
+            }
+        };
+    }
+}

package/dist/collection/components/forja-projects/forja-projects.js

@@ -0,0 +1,94 @@
+import { h } from "@stencil/core";
+import { sectionLabel } from "../../utils/a11y";
+export class ForjaProjects {
+    render() {
+        const hasItems = this.items && this.items.length > 0;
+        return (h("section", { key: '15db32b9f5878409c28debb36ded1047f657ce2a', class: "forja-projects", "aria-label": sectionLabel(this.sectionTitle, 'Projects') }, h("slot", { key: 'f5dd2f0ca808fcfeaa11c4006dfaa88723ea4a47', name: "before" }), this.sectionTitle && h("h2", { key: 'fd5e121eb42bba78d4dc5b2719c1129182ebc030', class: "forja-projects__title" }, this.sectionTitle), this.text && h("div", { key: 'dd82836aaf6934f7420fa2cce02e9574e27b4781', class: "forja-projects__text", innerHTML: this.text }), hasItems ? (h("div", { class: "forja-projects__grid", role: "list", "data-columns": this.columns }, this.items.map(item => (h("article", { class: "forja-projects__card", role: "listitem" }, item.imageUrl && (h("img", { src: item.imageUrl, alt: "", class: "forja-projects__image", loading: "lazy" })), h("div", { class: "forja-projects__content" }, h("div", { class: "forja-projects__header" }, h("h3", { class: "forja-projects__name" }, item.href ? (h("a", { href: item.href, class: "forja-projects__link" }, item.title)) : (item.title)), item.status && (h("span", { class: "forja-projects__status" }, item.status))), item.description && (h("div", { class: "forja-projects__description", innerHTML: item.description })), item.tags && item.tags.length > 0 && (h("ul", { class: "forja-projects__tags" }, item.tags.map(tag => (h("li", { class: "forja-projects__tag" }, tag))))))))))) : (h("slot", null)), h("slot", { key: 'b7772bead8f5c04f3b3e857bc9da18adc29e38b7', name: "after" })));
+    }
+    static get is() { return "forja-projects"; }
+    static get properties() {
+        return {
+            "sectionTitle": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string | undefined",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "section-title"
+            },
+            "text": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string | undefined",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "text"
+            },
+            "items": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "ProjectItem[]",
+                    "resolved": "ProjectItem[] | undefined",
+                    "references": {
+                        "ProjectItem": {
+                            "location": "import",
+                            "path": "../../types",
+                            "id": "src/types.ts::ProjectItem",
+                            "referenceLocation": "ProjectItem"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false
+            },
+            "columns": {
+                "type": "number",
+                "mutable": false,
+                "complexType": {
+                    "original": "number",
+                    "resolved": "number | undefined",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "columns"
+            }
+        };
+    }
+}