@ptcwebops/ptcw-design 7.1.7 → 7.1.8

package/LICENSE

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

package/dist/cjs/_commonjsHelpers-CFO10eej.js

@@ -0,0 +1,7 @@
+'use strict';
+
+function getDefaultExportFromCjs (x) {
+	return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, 'default') ? x['default'] : x;
+}
+
+exports.getDefaultExportFromCjs = getDefaultExportFromCjs;

package/dist/cjs/academic-form-test.cjs.entry.js

@@ -0,0 +1,86 @@
+'use strict';
+
+var index = require('./index-Bjtyf7az.js');
+
+const academicFormTestCss = () => `:host{display:block}.form-wrapper{width:433px;display:flex;border-radius:3px;background:#fff;box-shadow:0px 2px 6px 0px rgba(0, 0, 0, 0.16);flex-direction:column;align-items:center;padding:24px 0px}.form-wrapper>form{max-width:277px}.form-wrapper>ptc-button{align-items:center}.form-wrapper .ptc-label{display:block;font-size:var(--ptc-font-size-x-small);font-weight:var(--ptc-font-weight-bold);line-height:normal;margin-bottom:var(--ptc-element-spacing-04);position:relative;z-index:1;color:var(--color-gray-13)}`;
+
+const AcademicForm = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+    }
+    get el() { return index.getElement(this); }
+    formData = {
+        email: "",
+        firstName: "",
+        lastName: "",
+        company: "",
+        country: "",
+        phone: "",
+        inquiryReason: "",
+        howhearselfreport: "",
+        policyChecked: false,
+    };
+    formButton;
+    emailEle;
+    firstNameEle;
+    lastNameEle;
+    companyEle;
+    phoneEle;
+    // private countryEle: HTMLPtcSelectElement;
+    // private inquiryreasonEle: HTMLPtcTextfieldElement;
+    // private howhearselfreport: HTMLPtcTextfieldElement;
+    componentDidLoad() {
+        this.formButton = this.el.querySelector(".form-submit");
+        this.formButton.addEventListener("click", this.handleSubmit.bind(this));
+        //get Email
+        this.emailEle = this.el.querySelector('ptc-textfield[field-id="contact-email"]');
+        this.firstNameEle = this.el.querySelector('ptc-textfield[field-id="contact-firstname"]');
+        this.lastNameEle = this.el.querySelector('ptc-textfield[field-id="contact-lastname"]');
+        this.companyEle = this.el.querySelector('ptc-textfield[field-id="company"]');
+        this.phoneEle = this.el.querySelector('ptc-textfield[field-id="contact-phone"]');
+        // this.countryEle = this.el.querySelector('ptc-select[field-id="contact-country"]')
+        // this.inquiryreasonEle = this.el.querySelector('ptc-textfield[field-id="contact-inquiry"]')
+        // this.howhearselfreport = this.el.querySelector('ptc-textfield[field-id="self-reporting"]')
+    }
+    handleInputChange(field, value) {
+        this.formData = { ...this.formData, [field]: value };
+    }
+    handleSubmit(event) {
+        event.preventDefault();
+        this.formData.email = this.emailEle.inputValue;
+        this.formData.firstName = this.firstNameEle.inputValue;
+        this.formData.lastName = this.lastNameEle.inputValue;
+        this.formData.company = this.companyEle.inputValue;
+        this.formData.phone = this.phoneEle.inputValue;
+        if (this.isValid()) {
+            const formSubmitEvent = new CustomEvent("formSubmit", {
+                detail: this.formData,
+                bubbles: true,
+            });
+            this.el.dispatchEvent(formSubmitEvent);
+        }
+        else {
+            console.log("Form validation failed");
+        }
+    }
+    isValid() {
+        const { email, firstName, lastName, company, country, phone, inquiryReason, howhearselfreport, policyChecked, } = this.formData;
+        const invalidLength = document.querySelectorAll(".invalid-field").length;
+        return (email !== "" &&
+            phone !== "" &&
+            firstName !== "" &&
+            lastName !== "" &&
+            company !== "" &&
+            country !== "" &&
+            inquiryReason !== "" &&
+            howhearselfreport != "" &&
+            policyChecked &&
+            invalidLength === 0);
+    }
+    render() {
+        return (index.h(index.Host, { key: '4bc6337328f0e9f1a607f6c186da9bcb1c09a018' }, index.h("div", { key: '23970ee3532ab37ab28e524270681333892c2379', class: "ptc-container ptc-section-standard u-flex u-flex-justify-center" }, index.h("div", { key: '15e463be14656d6d3917a12b703177dbf5d26704', class: "form-wrapper" }, index.h("max-width-container", { key: 'bda3bb219362647e558a5b4de34eadb54b8d9ca3', "max-width": "277", breakpoint: 480 }, index.h("ptc-title", { key: '3fd3829d092b2b0f74d86bee39cffaf9ebed784d', type: "h2", "text-align": "center", "title-size": "x-small", "title-color": "gray", upperline: "no-upperline", "title-display": "inline-block", "title-height": "densest", "title-margin": "margin-flush", "title-weight": "w-6", "is-plm-hub": "false" }, "Please fill out the form and a PTC sales representative will be in touch."), index.h("ptc-spacer", { key: 'f7cec1ab8ddb467b4ccdb0766400ad205b250835', breakpoint: "x-small", size: "medium" }), index.h("ptc-spacer", { key: '94f02cf36519b803467dc28e606a79dde89b7f3b', breakpoint: "x-small", size: "medium" }), index.h("ptc-spacer", { key: '9ca7645594fde4dea57b077a2093ce1e26283d41', breakpoint: "small", size: "small" }), index.h("ptc-spacer", { key: 'cff06311530472310984a0a56cd4a5a947dbeb36', breakpoint: "small", size: "small" })), index.h("form", { key: 'e3f5c3814409de2c56d09e7c9095d4d33edd6b33', onSubmit: (event) => this.handleSubmit(event) }, index.h("ptc-label", { key: 'aea4887e4ac0136ba0dc5f7c8c7b50e0ebcc9557', class: "ptc-label" }, "Your Information"), index.h("ptc-textfield", { key: 'ecba0c2058dc6ab3ee47e11b1b70832c3064a0a4', "field-id": "contact-firstname", "label-text": "First Name*", type: "text", "ptc-data-eloqua-name": "C_FirstName", "field-name": "firstname" }), index.h("ptc-textfield", { key: '1c584400eaf9b5e2aaefba966f871e335868e605', "field-id": "contact-lastname", "label-text": "Last Name*", type: "text", "ptc-data-eloqua-name": "C_LastName", "field-name": "lastname" }), index.h("ptc-textfield", { key: 'c9df6a98b1dd1122685b104e756e0b901710c6e2', "field-id": "contact-email", "label-text": "Email*", type: "email", "alert-text": "Minimum Age Required", "alert-text-content": "If you are under the age of 14 years old, you must use your parent/guardian email address.", "ptc-data-eloqua-name": "C_EmailAddress", "field-name": "email" }), index.h("ptc-textfield", { key: '07f6c34a9ff267a87d20132c0f318c745a5835b1', "field-id": "confirm-email", "label-text": "Confirm your Email*", type: "email", "ptc-data-eloqua-name": "emailconfirmation", "field-name": "confirm-email", "custom-validation": "Email addresses must match." }), index.h("ptc-textfield", { key: 'a282b117b60067229a43fbf55fe0a66c4115c83c', "field-id": "contact-phone", "label-text": "Phone*", type: "tel", "ptc-data-eloqua-name": "C_BusPhone", "field-name": "phone" }), index.h("ptc-textfield", { key: 'e834dea15f4b88e1de8249258a6b91463e685172', "field-id": "contact-city", "label-text": "City*", type: "text", "ptc-data-eloqua-name": "C_City", "field-name": "contact-city" }), index.h("ptc-textfield", { key: '80d0810123aceb88bcefb52ac5183498a0ea0e94', "field-id": "contact-zipcode", "label-text": "Zip Code*", type: "text", "ptc-data-eloqua-name": "C_Zip_Postal", "field-name": "zipcode-field" }), index.h("ptc-select", { key: 'f075f189ebb6c998fea69d15d80c84b474ff14d5', "field-id": "contact-country", label: "Country*", "ptc-data-eloqua-name": "C_Country", "field-name": "country" }, index.h("ul", { key: '48e6df921872be38440602abe5944239e02fd7a3', class: "mdc-list" }, index.h("li", { key: '9287156d2eeacbb5ea0c279fbad2144fbfca27e1', class: "mdc-list-item", "data-value": "" }, index.h("span", { key: 'aa50905da7e3512ccb053624a2a0a7d7eae19883', class: "mdc-list-item__ripple" })), index.h("li", { key: '36d1dadc962a5bef0ab33a09f05fcc85bf87b5a6', class: "mdc-list-item", "data-value": "USA" }, index.h("span", { key: '3046f42e17cf04906559d6d66a8546ebe3b19191', class: "mdc-list-item__ripple" }), index.h("span", { key: '5e6fa4d7ecf7236d1edf7e0a98ace22a121d38ea', class: "mdc-list-item__text" }, "USA")), index.h("li", { key: '265b92ea6fb1165c07931b0ac4d49692b9442683', class: "mdc-list-item", "data-value": "Canada" }, index.h("span", { key: 'fa7442888ef9a3e2bb3469497c92062b1b8d2c1a', class: "mdc-list-item__ripple" }), index.h("span", { key: 'd3f9deb0d7e58862bcb4b9c4797c257d4e277590', class: "mdc-list-item__text" }, "Canada")), index.h("li", { key: '49f25228e4c234764c5d4ad0e605096b2f408f25', class: "mdc-list-item", "data-value": "China" }, index.h("span", { key: '1814e2e408c17c664ce06c56faf5cac2da81270c', class: "mdc-list-item__ripple" }), index.h("span", { key: 'd77a29e2a1cb03c505aa931f5f043ff246de1110', class: "mdc-list-item__text" }, "China")))), index.h("ptc-label", { key: '574f78376d25d41c1937d2c730117a747c468a08', class: "ptc-label" }, "School Information"), index.h("ptc-textfield", { key: 'acaefcc86092912ff534fbaeae8b4631e89687e0', "field-id": "institution", "label-text": "School/Institution Name*", type: "text", "ptc-data-eloqua-name": "C_Company", "field-name": "institution" }), index.h("ptc-textfield", { key: '9da13f41babf36aa39259bca2a9cf7244d46c6cd', "field-id": "contact-email", "label-text": "School Level*", type: "email", "ptc-data-eloqua-name": "C_EmailAddress", "field-name": "email" }), index.h("ptc-textfield", { key: 'c06d77c7f9967b62d02d058697f27c3759478ee9', "field-id": "contact-email", "label-text": "Student Level*", type: "email", "ptc-data-eloqua-name": "gradeLevel1", "field-name": "email" }), index.h("ptc-select", { key: 'd3fb142e2645b8e67e413bcb70127eba37b8b177', "field-id": "academic-description", label: "Role of User*", "ptc-data-eloqua-name": "description1", "field-name": "academic-description" }, index.h("ul", { key: '9bc103982a658c99a342a8d88c09f0376e5c69de', class: "mdc-list" }, index.h("li", { key: 'f05316837848d3bdd2d723c35b62d4d1b0975d78', class: "mdc-list-item", "data-value": "" }, index.h("span", { key: 'ece487bcbf990b0366069205a349ab3e7dd72d7e', class: "mdc-list-item__ripple" })), index.h("li", { key: '6d60cc13bf52b99fd6c7576a93fda0a95e87789b', class: "mdc-list-item", "data-value": "USA" }, index.h("span", { key: '866372affa52342c5ed913d055a2e4cd63361094', class: "mdc-list-item__ripple" }), index.h("span", { key: 'fcd6cea907d061c9bd22befcbb69b067e814ea13', class: "mdc-list-item__text" }, "K-12 educator")), index.h("li", { key: 'b544d3cae1ba7047692654b73cb3278f25798fa7', class: "mdc-list-item", "data-value": "Canada" }, index.h("span", { key: '82cbd1319c70f325173f289cf7f74534ba82f3d2', class: "mdc-list-item__ripple" }), index.h("span", { key: 'f5822af79bfce09b6c8f5709e3f4e69a8f604d34', class: "mdc-list-item__text" }, "Professor")), index.h("li", { key: '85ee4fb898e33d5df83a81a4110de8f83e563403', class: "mdc-list-item", "data-value": "China" }, index.h("span", { key: '9da6b128af79e2524d9622dcde018de13a74edb7', class: "mdc-list-item__ripple" }), index.h("span", { key: 'e4a1948ac03411e4cfacaea59327c0179fb965c2', class: "mdc-list-item__text" }, "K-12 student")))), index.h("ptc-textfield", { key: '10a4a022a8c72ebf01af077f39b9da313de53278', "field-id": "contact-city", "label-text": "Purpose of use*", type: "text", "ptc-data-eloqua-name": "C_City", "field-name": "contact-city" }), index.h("ptc-textfield", { key: '7fd5663a9fb0742cfa997805a0f5dae2af7075c5', "field-id": "academic-ofComputers", "label-text": "How many computers are you planning to install this software on?*", type: "text", "ptc-data-eloqua-name": "ofComputers1", "field-name": "academic-ofComputers" }), index.h("ptc-form-checkbox", { key: '6e3f12eb277e5c8753da50c4068ee91607be0b2e', label: "I acknowledge that my personal details will be processed in accordance with PTC\u2019s privacy policy and that they may be shared with PTC Inc\u2019s subsidiaries for\r\n               the promotion of PTC\u2019s products and associated services. ", "checkbox-id": "test" }), index.h("ptc-button", { key: '9126c971a286d0894afaeea460e957bf36c3a2b5', class: "form-submit", color: "ptc-quaternary", type: "submit", styles: ":host{align-self:flex-end; margin-top: 48px; display:block; float: right; width: fit-content;}" }, "Submit"))))));
+    }
+};
+AcademicForm.style = academicFormTestCss();
+
+exports.academic_form_test = AcademicForm;

package/dist/cjs/app-globals-BklE725q.js

@@ -0,0 +1,23 @@
+'use strict';
+
+var index = require('./index-Bjtyf7az.js');
+
+// src/global/global.ts
+var global = () => {
+    globalThis.ptcLogger = index.ptcLogger;
+    index.loadValidationMessages()
+        .then(() => index.ptcLogger?.info?.('Validation messages loaded successfully'))
+        .catch((err) => index.ptcLogger?.error?.('Failed to load validation messages', err));
+    // Add 'hydrated' class to <html> tag for backward compatibility with Stencil v1 behavior
+    // In Stencil v4, this class is only added to individual components, not the document root
+    if (typeof window !== 'undefined') {
+        window.addEventListener('appload', () => {
+            document.documentElement.classList.add('hydrated');
+        });
+    }
+};
+
+const appGlobalScript = global || (() => {});
+const globalScripts = appGlobalScript;
+
+exports.globalScripts = globalScripts;

package/dist/cjs/author-listing-example.cjs.entry.js

@@ -0,0 +1,243 @@
+'use strict';
+
+var index = require('./index-Bjtyf7az.js');
+
+const authorListingExampleCss = () => `:host{display:block}:host .loader{margin:5rem auto;max-width:45px;position:relative;width:100%}:host .author-grid{width:100%;display:flex;flex-wrap:wrap;grid-row-gap:2rem;grid-column-gap:2rem;justify-content:center}:host .author-grid .author-col{width:100%}@media (min-width: 768px){:host .author-grid .author-col{width:calc(50% - 21.3333333px)}}@media (min-width: 992px){:host .author-grid .author-col{width:calc(33.333333333333% - 21.3333333px)}}`;
+
+const AuthorListingExample = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+    }
+    get el() { return index.getElement(this); }
+    defaultAuthorImage;
+    isLoading = false;
+    loadedCardCount = 0;
+    cardsPerLoad = 9; // Number of cards to load per scroll
+    cardData = [
+        {
+            id: 1,
+            authorName: "Aaron Shaw",
+            imageUrl: "https://www.ptc.com/-/media/Images/blog/Authors/Blog_AaronShaw_2.jpg",
+            DetailPagelink: "https://www.ptc.com/en/blog-authors/Aaron-Shaw",
+            description: "Aaron Shaw joined PTC in 2013, currently he is the Senior Manager, CAD Demand Generation. He is responsible for",
+        },
+        {
+            id: 2,
+            authorName: "Abby Eon",
+            imageUrl: "https://www.ptc.com/-/media/Images/new-org/399x200/abby-eon-400x200.jpg",
+            DetailPagelink: "https://www.ptc.com/en/blog-authors/Abby-Eon",
+            description: "Abby Eon is Senior Vice President and General Manager, Kepware. As part of her role, Abby looks after ",
+        },
+        {
+            id: 3,
+            authorName: "Catherine Kniker",
+            imageUrl: "https://www.ptc.com/-/media/Images/blog/Authors/catherine-kniker.jpg",
+            DetailPagelink: "https://www.ptc.com/en/blog-authors/Catherine-Kniker",
+            description: "Catherine is EVP and Chief Strategy and Marketing Officer at PTC, responsible for positioning the company for success",
+        },
+        {
+            id: 4,
+            authorName: "Maria Lowry, Manager, Kalypso",
+            imageUrl: "https://www.ptc.com/-/media/Images/blog/Authors/blog-Maria-Lowry.jpg",
+            DetailPagelink: "https://www.ptc.com/en/blog-authors/Maria-Lowry",
+            description: "Maria brings seven years of professional experience to her clients. She is committed to improving product quality, safety, sustainability",
+        },
+        {
+            id: 5,
+            authorName: "Author name",
+            imageUrl: "",
+            DetailPagelink: "#",
+            description: "Author description text goes here Author description text goes here Author description text goes here Author description text goes here Author description text goes here",
+        },
+        {
+            id: 1,
+            authorName: "Aaron Shaw",
+            imageUrl: "https://www.ptc.com/-/media/Images/blog/Authors/Blog_AaronShaw_2.jpg",
+            DetailPagelink: "https://www.ptc.com/en/blog-authors/Aaron-Shaw",
+            description: "Aaron Shaw joined PTC in 2013, currently he is the Senior Manager, CAD Demand Generation. He is responsible for",
+        },
+        {
+            id: 2,
+            authorName: "Abby Eon",
+            imageUrl: "https://www.ptc.com/-/media/Images/new-org/399x200/abby-eon-400x200.jpg",
+            DetailPagelink: "https://www.ptc.com/en/blog-authors/Abby-Eon",
+            description: "Abby Eon is Senior Vice President and General Manager, Kepware. As part of her role, Abby looks after ",
+        },
+        {
+            id: 3,
+            authorName: "Catherine Kniker",
+            imageUrl: "https://www.ptc.com/-/media/Images/blog/Authors/catherine-kniker.jpg",
+            DetailPagelink: "https://www.ptc.com/en/blog-authors/Catherine-Kniker",
+            description: "Catherine is EVP and Chief Strategy and Marketing Officer at PTC, responsible for positioning the company for success",
+        },
+        {
+            id: 4,
+            authorName: "Maria Lowry, Manager, Kalypso",
+            imageUrl: "https://www.ptc.com/-/media/Images/blog/Authors/blog-Maria-Lowry.jpg",
+            DetailPagelink: "https://www.ptc.com/en/blog-authors/Maria-Lowry",
+            description: "Maria brings seven years of professional experience to her clients. She is committed to improving product quality, safety, sustainability",
+        },
+        {
+            id: 5,
+            authorName: "Author name",
+            imageUrl: "",
+            DetailPagelink: "#",
+            description: "Author description text goes here Author description text goes here Author description text goes here Author description text goes here Author description text goes here",
+        },
+        {
+            id: 6,
+            authorName: "Aaron Shaw",
+            imageUrl: "https://www.ptc.com/-/media/Images/blog/Authors/Blog_AaronShaw_2.jpg",
+            DetailPagelink: "https://www.ptc.com/en/blog-authors/Aaron-Shaw",
+            description: "Aaron Shaw joined PTC in 2013, currently he is the Senior Manager, CAD Demand Generation. He is responsible for",
+        },
+        {
+            id: 7,
+            authorName: "Abby Eon",
+            imageUrl: "https://www.ptc.com/-/media/Images/new-org/399x200/abby-eon-400x200.jpg",
+            DetailPagelink: "https://www.ptc.com/en/blog-authors/Abby-Eon",
+            description: "Abby Eon is Senior Vice President and General Manager, Kepware. As part of her role, Abby looks after ",
+        },
+        {
+            id: 8,
+            authorName: "Catherine Kniker",
+            imageUrl: "https://www.ptc.com/-/media/Images/blog/Authors/catherine-kniker.jpg",
+            DetailPagelink: "https://www.ptc.com/en/blog-authors/Catherine-Kniker",
+            description: "Catherine is EVP and Chief Strategy and Marketing Officer at PTC, responsible for positioning the company for success",
+        },
+        {
+            id: 9,
+            authorName: "Maria Lowry, Manager, Kalypso",
+            imageUrl: "https://www.ptc.com/-/media/Images/blog/Authors/blog-Maria-Lowry.jpg",
+            DetailPagelink: "https://www.ptc.com/en/blog-authors/Maria-Lowry",
+            description: "Maria brings seven years of professional experience to her clients. She is committed to improving product quality, safety, sustainability",
+        },
+        {
+            id: 10,
+            authorName: "Author name",
+            imageUrl: "",
+            DetailPagelink: "#",
+            description: "Author description text goes here Author description text goes here Author description text goes here Author description text goes here Author description text goes here",
+        },
+        {
+            id: 11,
+            authorName: "Aaron Shaw",
+            imageUrl: "https://www.ptc.com/-/media/Images/blog/Authors/Blog_AaronShaw_2.jpg",
+            DetailPagelink: "https://www.ptc.com/en/blog-authors/Aaron-Shaw",
+            description: "Aaron Shaw joined PTC in 2013, currently he is the Senior Manager, CAD Demand Generation. He is responsible for",
+        },
+        {
+            id: 12,
+            authorName: "Abby Eon",
+            imageUrl: "https://www.ptc.com/-/media/Images/new-org/399x200/abby-eon-400x200.jpg",
+            DetailPagelink: "https://www.ptc.com/en/blog-authors/Abby-Eon",
+            description: "Abby Eon is Senior Vice President and General Manager, Kepware. As part of her role, Abby looks after ",
+        },
+        {
+            id: 13,
+            authorName: "Catherine Kniker",
+            imageUrl: "https://www.ptc.com/-/media/Images/blog/Authors/catherine-kniker.jpg",
+            DetailPagelink: "https://www.ptc.com/en/blog-authors/Catherine-Kniker",
+            description: "Catherine is EVP and Chief Strategy and Marketing Officer at PTC, responsible for positioning the company for success",
+        },
+        {
+            id: 14,
+            authorName: "Maria Lowry, Manager, Kalypso",
+            imageUrl: "https://www.ptc.com/-/media/Images/blog/Authors/blog-Maria-Lowry.jpg",
+            DetailPagelink: "https://www.ptc.com/en/blog-authors/Maria-Lowry",
+            description: "Maria brings seven years of professional experience to her clients. She is committed to improving product quality, safety, sustainability",
+        },
+        {
+            id: 15,
+            authorName: "Author name",
+            imageUrl: "",
+            DetailPagelink: "#",
+            description: "Author description text goes here Author description text goes here Author description text goes here Author description text goes here Author description text goes here",
+        },
+        {
+            id: 16,
+            authorName: "Aaron Shaw",
+            imageUrl: "https://www.ptc.com/-/media/Images/blog/Authors/Blog_AaronShaw_2.jpg",
+            DetailPagelink: "https://www.ptc.com/en/blog-authors/Aaron-Shaw",
+            description: "Aaron Shaw joined PTC in 2013, currently he is the Senior Manager, CAD Demand Generation. He is responsible for",
+        },
+        {
+            id: 17,
+            authorName: "Abby Eon",
+            imageUrl: "https://www.ptc.com/-/media/Images/new-org/399x200/abby-eon-400x200.jpg",
+            DetailPagelink: "https://www.ptc.com/en/blog-authors/Abby-Eon",
+            description: "Abby Eon is Senior Vice President and General Manager, Kepware. As part of her role, Abby looks after ",
+        },
+        {
+            id: 18,
+            authorName: "Catherine Kniker",
+            imageUrl: "https://www.ptc.com/-/media/Images/blog/Authors/catherine-kniker.jpg",
+            DetailPagelink: "https://www.ptc.com/en/blog-authors/Catherine-Kniker",
+            description: "Catherine is EVP and Chief Strategy and Marketing Officer at PTC, responsible for positioning the company for success",
+        },
+        {
+            id: 19,
+            authorName: "Maria Lowry, Manager, Kalypso",
+            imageUrl: "https://www.ptc.com/-/media/Images/blog/Authors/blog-Maria-Lowry.jpg",
+            DetailPagelink: "https://www.ptc.com/en/blog-authors/Maria-Lowry",
+            description: "Maria brings seven years of professional experience to her clients. She is committed to improving product quality, safety, sustainability",
+        },
+        {
+            id: 20,
+            authorName: "Author name",
+            imageUrl: "",
+            DetailPagelink: "#",
+            description: "Author description text goes here Author description text goes here Author description text goes here Author description text goes here Author description text goes here",
+        },
+        {
+            id: 21,
+            authorName: "Catherine Kniker",
+            imageUrl: "https://www.ptc.com/-/media/Images/blog/Authors/catherine-kniker.jpg",
+            DetailPagelink: "https://www.ptc.com/en/blog-authors/Catherine-Kniker",
+            description: "Catherine is EVP and Chief Strategy and Marketing Officer at PTC, responsible for positioning the company for success",
+        },
+    ];
+    componentWillLoad() {
+        this.loadMoreCards();
+    }
+    handleScroll() {
+        const windowHeight = window.innerHeight;
+        const documentHeight = document.documentElement.scrollHeight;
+        const scrollTop = window.scrollY || document.documentElement.scrollTop;
+        const scrollBottom = scrollTop + windowHeight;
+        const threshold = 5;
+        if (!this.isLoading && scrollBottom + threshold >= documentHeight) {
+            this.loadMoreCards();
+        }
+    }
+    async loadMoreCards() {
+        if (this.loadedCardCount < this.cardData.length) {
+            this.isLoading = true;
+            const visibleCardData = this.cardData.slice(this.loadedCardCount, this.loadedCardCount + this.cardsPerLoad);
+            const promises = visibleCardData.map((card) => {
+                return new Promise((resolve) => {
+                    const image = new Image();
+                    image.src = card.imageUrl;
+                    image.onload = () => {
+                        resolve();
+                    };
+                    image.onerror = () => {
+                        // Load a dummy image in case of error
+                        card.imageUrl = this.defaultAuthorImage;
+                        resolve();
+                    };
+                });
+            });
+            await Promise.all(promises);
+            this.loadedCardCount += this.cardsPerLoad;
+            this.isLoading = false;
+        }
+    }
+    render() {
+        const visibleCards = this.cardData.slice(0, this.loadedCardCount);
+        return (index.h("div", { key: 'fd4a6ef2c6b9a60a8562ce0dd304b4b7dce91771' }, index.h("div", { key: '363be82048cbb726f6c56d84712b3c3ac8ea2954', class: "author-grid" }, visibleCards.map((card, index$1) => (index.h("div", { class: "author-col", key: index$1 }, index.h("ptc-card", { "has-image": "true", "card-type": "related-card", "card-href": card.DetailPagelink, heading: card.authorName }, index.h("ptc-img", { slot: "slot-image", "img-url": card.imageUrl, "image-type": "smart-img", "load-mode": "lazy-bg" }), index.h("div", { slot: "slot-description" }, index.h("ptc-para", { "font-size": "x-small", "font-weight": "w-4", "para-line-h": "line-height-densest", "para-margin": "margin-flush", "para-z-index": "z-auto" }, index.h("ptc-tooltip", { description: card.description, "text-lines": "4", "z-index": "z-auto" })))))))), this.isLoading && (index.h("div", { key: 'd42c34e42fd92c038eff3d7d5159491a69958a88', class: "loader" }, index.h("svg", { key: '690148700b20a6d5b50966b8e3acbfd29bcb66ea', preserveAspectRatio: "xMinYMin meet", fill: "#3CC73D", x: "0px", y: "0px", version: "1.1", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 182.1 210.2" }, index.h("title", { key: 'f1a6c0e0759df001baaff855b5c11d7f73386ffa' }, "list-loading"), index.h("path", { key: '7eccf7d91d27ae3780cd92125c686c6ce46b487a', d: "M91,21.2l72.6,41.9v83.9L91,189l-72.6-41.9V63.2L91,21.2 M91,0L0,52.6v105.1l91,52.6l91-52.6V52.6L91,0L91,0z" }), index.h("g", { key: 'fee01d9aadbf472b30d929080d729cf3d5a85648' }, index.h("polygon", { key: '4f376d3531c501c276d953f81e380c4f8b6bf423', points: "67.5,105.5 67.5,163.1 67.5,165.4 43.9,151.8 43.9,149.4 43.9,100" }), index.h("polygon", { key: '0cdc59ef491497361029d0b0bde2e27f7e293e3e', opacity: "0.7", points: "43.6,100.1 43.8,100 43.9,100 43.9,149.4 43.9,149.4 43.9,151.8 30.3,144 30.3,141.6 30.3,106.6" }), index.h("animate", { key: 'f7984dcbee6675a60839c257a9d3b051641e6db0', attributeName: "fill-opacity", begin: "100ms", dur: "1s", values: "1;.2;1", calcMode: "linear", repeatCount: "indefinite" })), index.h("g", { key: '8720b2e2bd732acd6a8c17f49f71958407fd9930' }, index.h("polygon", { key: '7d2e27fb5ffb09b11c35b49a7c83041f56d8e8e8', points: "109.6,88.6 109.6,166.2 109.6,168.3 91,179 81.1,173.3 81.1,170.9 81.1,84.2" }), index.h("polygon", { key: 'd897f36e7a4964d3fae19f1e2fe8dadfe31bf663', opacity: "0.7", points: "81.1,84.2 81.1,170.9 81.1,173.3 67.5,165.4 67.5,163.1 67.5,105.5" }), index.h("animate", { key: '27cefabaa344ebe995a975ce8d010759dbe07485', attributeName: "fill-opacity", begin: "300ms", dur: "1s", values: "1;.2;1", calcMode: "linear", repeatCount: "indefinite" })), index.h("g", { key: '05bcdac5c0b5428a321b5b6d6bba20b86e4f5c71' }, index.h("polygon", { key: '1c552032172753c79e6742e34bddd5b6d51069e0', points: "154,70.2 154,70.2 154,142.7 122.9,160.5 122.9,158.5 122.9,65.8" }), index.h("polygon", { key: '8e30d4e6a3deb00d804e683fff233d4a70c62754', opacity: "0.7", points: "122.9,65.8 122.9,158.5 122.9,160.5 109.6,168.3 109.6,168.3 109.6,166.2 109.6,88.6" }), index.h("animate", { key: 'c1871f8294847beafdff5f636ab4d16cf89fcff7', attributeName: "fill-opacity", begin: "500ms", dur: "1s", values: "1;.2;1", calcMode: "linear", repeatCount: "indefinite" })))))));
+    }
+};
+AuthorListingExample.style = authorListingExampleCss();
+
+exports.author_listing_example = AuthorListingExample;