@ptcwebops/ptcw-design 6.4.36-beta → 6.5.0-upgrade

package/dist/collection/stories/organisms/ptc/Three Column Text/preview.stories.js

@@ -1,75 +0,0 @@
-import { html } from 'lit';
-
-export default {
-  title: 'Organisms/ptc/Three Column Text'
-};
-
-const AlertsPage = args => {
-  return html`
-    
-
-<section id="three-column-text" class="three-column-text-section">
-    <div class="ptc-container ptc-section-standard">
-        <div class="is-grid has-col-gap-lg has-row-gap-lg column-gap-mobile">
-            <div class="is-col-12 is-col-3-xl">
-                    <ptc-title seo-compatibility-mode title-margin="margin-flush">
-                        <h2>Three Column Text - Supports up to 3 rows</h2>
-                    </ptc-title>
-            </div>
-                <div class="is-col-12 is-col-9-xl">
-                    <div class="is-grid has-col-gap-lg has-row-gap-xxl column-gap-mobile">
-                            <div class="is-col-12 is-col-6-md is-col-4-xl">
-                                    <ptc-title seo-compatibility-mode upperline="no-upperline" title-margin="margin-flush">
-                                        <h3>
-                                            Smart Factories
-                                        </h3>
-                                    </ptc-title>
-                                                                        <ptc-para para-margin="margin-3" para-line-h="line-height-p" seo-compatibility-mode><p>Manufacturers equip their assets and production lines with sensors to monitor performance. This allows them to monitor the quantity and quality of the assets they are producing. Better quality products lead to reduced costs and scrap along with better customer experiences&mdash;all of which contribute to revenue gains.</p></ptc-para>
-                                                                        <ptc-spacer size="xx-small" breakpoint="x-small"></ptc-spacer>
-                                    <ptc-spacer size="small"></ptc-spacer>
-                                    <ptc-link  href="/" link-title="PTC Home" target="_self" theme="simple" seo-compatibility-mode tracker-id="ptc-link-three-colum-text" >
-                                        <a href="/">
-                                            PTC Home
-                                        </a>
-                                    </ptc-link>
-                            </div>
-                            <div class="is-col-12 is-col-6-md is-col-4-xl">
-                                    <ptc-title seo-compatibility-mode upperline="no-upperline" title-margin="margin-flush">
-                                        <h3>
-                                            Connected Products
-                                        </h3>
-                                    </ptc-title>
-                                                                        <ptc-para para-margin="margin-3" para-line-h="line-height-p" seo-compatibility-mode><p>In addition to being able to leverage IoT data to improve factory processes, manufacturers can use IoT analytics to understand how the things they have built are performing in the real world.</p></ptc-para>
-                                                                        <ptc-spacer size="xx-small" breakpoint="x-small"></ptc-spacer>
-                                    <ptc-spacer size="small"></ptc-spacer>
-                                    <ptc-link  href="/" link-title="PTC Home" target="_self" theme="simple" seo-compatibility-mode tracker-id="ptc-link-three-colum-text" >
-                                        <a href="/">
-                                            PTC Home
-                                        </a>
-                                    </ptc-link>
-                            </div>
-                            <div class="is-col-12 is-col-6-md is-col-4-xl">
-                                    <ptc-title seo-compatibility-mode upperline="no-upperline" title-margin="margin-flush">
-                                        <h3>
-                                            New Business Models
-                                        </h3>
-                                    </ptc-title>
-                                                                        <ptc-para para-margin="margin-3" para-line-h="line-height-p" seo-compatibility-mode><p>Vendors that used to simply sell products are now able to sell those products as a service, where customers pay based on monthly usage. Manufacturers are also able to offer other value-added services such as over-the-air updates to software.</p></ptc-para>
-                                                                        <ptc-spacer size="xx-small" breakpoint="x-small"></ptc-spacer>
-                                    <ptc-spacer size="small"></ptc-spacer>
-                                    <ptc-link  href="/" link-title="PTC Home" target="_self" theme="simple" seo-compatibility-mode tracker-id="ptc-link-three-colum-text" >
-                                        <a href="/">
-                                            PTC Home
-                                        </a>
-                                    </ptc-link>
-                            </div>
-                    </div>
-                </div>
-        </div>
-    </div>
-    </section>
-
-  `;
-};
-
-export const Preview = AlertsPage.bind();

package/dist/collection/stories/organisms/ptc/Three Up Text Cards/preview.stories.js

@@ -1,134 +0,0 @@
-import { html } from 'lit';
-
-export default {
-  title: 'Organisms/ptc/Three Up Text Cards'
-};
-
-const AlertsPage = args => {
-  return html`
-    
-
-<div class="ptc-container ptc-section-standard">
-      <ptc-button id="ty-modal" type="button" color="ptc-primary"> Show Modal </ptc-button>
-      
-      <ptc-modal id="modal-example" modal-type="thank-you" keep-in-viewport border-radius="standard" close-on-blur="true" fixed="false" overlay="true" size="md" vh-center>
-        <div class="u-textAlign-ctr p-3">
-          <ptc-title type="h2" seo-compatibility-mode upperline="no-upperline" title-margin="margin-flush margin-bottom-2">
-            <h2>Thanks for signing up</h2>
-          </ptc-title>
-          <ptc-para font-size="small" para-margin="margin-flush  margin-bottom-6" seo-compatibility-mode>
-            <p>We’ll keep you up to date with the latest PTC events.</p>
-          </ptc-para>
-          <ptc-button color="ptc-quaternary" target="_self" type="button" id="close-ty-modal" tracker-id="close-ty-modal-cta"> Back to page</ptc-button>
-        </div>
-      </ptc-modal>
-
-      <script>
-        document.getElementById('ty-modal').addEventListener('click', () => {
-          document.getElementById('modal-example').show = true;
-        });
-        document.getElementById('close-ty-modal').addEventListener('click', () => {
-          document.getElementById('modal-example').show = false;
-        });
-      </script>
-    </div>
-
-    
-    <div class="ptc-container ptc-section-standard three-up-event-cards-wrapper">
-      <ptc-title type="h2" seo-compatibility-mode upperline="no-upperline" title-margin="margin-flush">
-        <h2>More ways to engage</h2>
-      </ptc-title>
-      <ptc-spacer size="xx-large"></ptc-spacer>
-      <ptc-spacer breakpoint="x-small" size="small"></ptc-spacer>
-      <div class="is-grid has-col-gap-xl has-row-gap-xl">
-        <div class="is-col-12 is-col-4-lg">
-          <ptc-title type="h3" upperline="no-upperline" title-margin="margin-flush" seo-compatibility-mode>
-            <h3>Imperdiet dolor</h3>
-          </ptc-title>
-          <ptc-spacer size="small"></ptc-spacer>
-          <ptc-spacer breakpoint="x-small" size="xx-small"></ptc-spacer>
-          <ptc-para font-size="small" para-margin="margin-bottom-6" seo-compatibility-mode>
-            <p>Vestibulum consectetur nunc ac mauris sodales aliquet non et tellus. Maecenas facilisis semper neque id lacinia.</p>
-          </ptc-para>
-          <a class="ptc-link mf-listen" href="/https://www.ptc.com/en" target="">Explore Events</a>
-        </div>
-        <div class="is-col-12 is-col-4-lg">
-          <ptc-title type="h3" upperline="no-upperline" title-margin="margin-flush" seo-compatibility-mode>
-            <h3>Fermentum risus gravida</h3>
-          </ptc-title>
-          <ptc-spacer size="small"></ptc-spacer>
-          <ptc-spacer breakpoint="x-small" size="xx-small"></ptc-spacer>
-          <ptc-para font-size="small" para-margin="margin-bottom-6" seo-compatibility-mode>
-            <p>Vestibulum consectetur nunc ac mauris sodales aliquet non et tellus. Maecenas facilisis semper neque id lacinia. Pellentesque habitant morbi tristique.</p>
-          </ptc-para>
-          <a class="ptc-link mf-listen" href="/https://www.ptc.com/en" target="">Watch Now</a>
-        </div>
-        <div class="is-col-12 is-col-4-lg">
-          <ptc-title type="h3" upperline="no-upperline" title-margin="margin-flush" seo-compatibility-mode>
-            <h3>Facilisis efficitur</h3>
-          </ptc-title>
-          <ptc-spacer size="small"></ptc-spacer>
-          <ptc-spacer breakpoint="x-small" size="xx-small"></ptc-spacer>
-          <ptc-para font-size="small" para-margin="margin-bottom-6" seo-compatibility-mode>
-            <p>Vestibulum consectetur nunc ac mauris sodales aliquet non et tellus. Maecenas facilisis semper.</p>
-          </ptc-para>
-          <a class="ptc-link mf-listen" href="/https://www.ptc.com/en" target="">Learn How</a>
-        </div>
-      </div>
-    </div>
-    
-    <div class="ptc-section-standard u-paddingBottom-flush">
-      <div class="email-sign-up-wrapper">
-          <div class="ptc-container u-flex has-col-gap-xxl has-row-gap-md">
-            <max-width-container breakpoint="992" content-align="left" max-width="768">
-              <ptc-title type="h2" seo-compatibility-mode upperline="no-upperline" title-margin="margin-flush" title-color="white">
-                <h2>Stay connected</h2>
-              </ptc-title>
-              <ptc-spacer size="xx-small"></ptc-spacer>
-              <ptc-para font-size="small" para-margin="margin-flush" para-color="white" seo-compatibility-mode>
-                <p>
-                  Aliquam erat volutpat. Integer ac placerat massa nunc aliquam libero in aliquam vestibulum.
-                </p>
-              </ptc-para>
-            </max-width-container>
-            <div class="u-flex signup-form">
-              <div class="u-flex u-align-center w-100 form-design-field u-shadow-large">
-                <ptc-textfield 
-                  field-id="contact-email"
-                  textfield-form="email-signup"
-                  label-text=""
-                  type="email"
-                  ptc-data-eloqua-name="C_EmailAddress"
-                  field-name="email"
-                  placeholder-text="Enter your email"
-                ></ptc-textfield>
-
-                <ptc-button 
-                  id="stdsubmit"
-                  type="submit"
-                  color="ptc-secondary"
-                  class="form-submit"
-                  link-href="/en/products/windchill/contact-us/thank-you"
-                  target=""
-                  button-title="Submit"
-                  tracker-id="hero-footer-form-button"
-                  styles=".ptc-secondary { border-color: transparent !important; border-top-left-radius:0 !important; border-bottom-left-radius:0 !important; padding: 12px 16px}"
-                >
-                  Submit
-                </ptc-button>
-
-                <ptc-textfield type="hidden" id="hdnFormGuid" input-value="{11EB9492-D544-4D6E-B8B1-002C1010A11B}"></ptc-textfield>
-                <ptc-textfield type="hidden" id="hdnElqFormName" ptc-data-eloqua-name="elqFormName" input-value="CPGALMPercContactMe"></ptc-textfield>
-                <ptc-textfield type="hidden" ptc-data-eloqua-name="blnSalesContact" id="chkContact" input-value="yes"></ptc-textfield>
-                <ptc-textfield type="hidden" id="hdnWebsite" ptc-data-eloqua-name="C_Website1" input-value=""></ptc-textfield>
-                <ptc-textfield type="hidden" id="elqHdnCID" ptc-data-eloqua-name="cid" input-value=""></ptc-textfield>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-
-  `;
-};
-
-export const Preview = AlertsPage.bind();

package/dist/collection/stories/organisms/ptc/Two Column Media/preview.stories.js

@@ -1,181 +0,0 @@
-import { html } from 'lit';
-
-export default {
-  title: 'Organisms/ptc/Two Column Media'
-};
-
-const AlertsPage = args => {
-  return html`
-    
-
-<div class="ptc-container">
-    
-    <ptc-title type='h3' upperline="no-upperline">Media Component Demo</ptc-title>
-    <hr>
-    <div class="is-grid has-col has-col-gap-lg has-row-gap-md has-m has-p has-col-gap-lg tcm-parent">
-      <div class="is-col-12 ">
-        <ptc-title type='h2' text-align='center' title-size="large">What is industrial augmented reality?
-        </ptc-title>
-      </div>
-      <div class="is-col is-col-6-md tcm-text">
-        <ptc-para font-size="small" font-weight="w-4" para-margin="margin-bottom-4" para-style="main">
-          Augmented reality is a highly visual, interactive <a href="#">method of presenting relevant digital
-            information in </a>the
-          context of the physical environment—connecting employees and improving business outcomes.
-        </ptc-para>
-        <ptc-para font-size="small" font-weight="w-4" para-margin="margin-bottom-4" para-style="main">
-          Industrial augmented reality offers a better way to create and deliver easily consumable work instructions
-          by
-          overlaying digital content onto real-world work environments.
-        </ptc-para>
-        <ptc-spacer size="x-large"></ptc-spacer>
-        <ptc-button type="link" color="ptc-secondary" link-href="https://www.ptc.com" target="_blank" tab-nav="0">
-          Request Free Trial
-        </ptc-button>
-      </div>
-      <div class="is-col is-col-6-md tcm-media">
-        <ptc-modal id="modal-example" show="false" size="lg">
-          <h1>Test</h1>
-        </ptc-modal>
-        <ptc-link href="javascript:void(0)" id="modal-example-btn" link-title="" theme="simple">
-          <ptc-picture alt="image-test" is-full-width="true" image-alignment="left" max-width="640"
-            src="https://ptc-p-001.sitecorecontenthub.cloud/api/public/content/0e27bf5688094193abfffa797061e886?v=1969d507"
-            class="js-fade scale-up scale-up-animation">
-          </ptc-picture>
-        </ptc-link>
-      </div>
-
-    </div>
-
-    
-    <ptc-title type='h3' upperline="no-upperline">Media Icon List Component Demo</ptc-title>
-    <hr>
-    <div class="is-grid has-col has-col-gap-lg has-row-gap-md has-m has-p ">
-      <div class="is-col-12">
-        <ptc-title type='h2' text-align='center' title-size="large">Improve Efficiency for Your Workforce and
-          Operations</ptc-title>
-      </div>
-      <div class="is-col is-col-6-md">
-        <div class="img-wrap">
-          <ptc-picture alt="image-test"
-            src="https://ptc-p-001.sitecorecontenthub.cloud/api/public/content/0e27bf5688094193abfffa797061e886?v=1969d507"
-            class="js-fade scale-up scale-up-animation" is-full-width="true" image-alignment="right" max-width="640">
-          </ptc-picture>
-        </div>
-      </div>
-      <div class="is-col is-col-6-md">
-        <ptc-para font-size="small" font-weight="w-4" para-margin="margin-bottom-4" para-style="main">
-          In a challenging global market, being able <a href="#">to do more with less—with speed and scalability—is
-            crucial</a> to
-          success. PTC helps our customers improve both manufacturing efficiency and field service automation to break
-          down barriers impacting productivity and output. From cutting factory downtime and boosting asset
-          performance
-          to enabling skilled technicians to deliver services faster, our customers are achieving:
-        </ptc-para>
-        <ptc-icon-list list-type="stat-icon-list" value-text="up&nbsp;to" value-with-unit="60%"
-          list-content="Increase in Operator Productivity">
-          <icon-asset slot="icon" type="ptc" size="large" name="icon-3d-cube" color="ptc-green"></icon-asset>
-        </ptc-icon-list>
-        <ptc-icon-list list-type="stat-icon-list" value-text="up&nbsp;to" value-with-unit="92%"
-          list-content=" First Time Fix Rate">
-          <icon-asset slot="icon" type="ptc" size="large" name="icon-3d-cube" color="ptc-green"></icon-asset>
-        </ptc-icon-list>
-        <ptc-icon-list list-type="stat-icon-list" value-text="up&nbsp;to" value-with-unit="30%"
-          list-content="Less Unscheduled Downtime">
-          <icon-asset slot="icon" type="ptc" size="large" name="icon-clock-checkmark" color="ptc-green">
-          </icon-asset>
-        </ptc-icon-list>
-        <ptc-icon-list list-type="stat-icon-list" value-text="up&nbsp;to" value-with-unit="75%"
-          list-content="Faster On-site Service">
-          <icon-asset slot="icon" type="ptc" size="large" name="icon-3d-cube" color="ptc-green"></icon-asset>
-        </ptc-icon-list>
-      </div>
-    </div>
-    
-    <ptc-title type='h3' upperline="no-upperline">Text Component Demo</ptc-title>
-    <hr>
-    <ptc-title type='h2' text-align='left' title-size="large">How does Creo support 3D design?</ptc-title>
-    <ptc-para font-size="small" font-weight="w-4" para-margin="margin-bottom-4" para-style="main">
-      In a challenging global market, being able to do more with less—with speed and scalability—is crucial to
-      success. PTC helps our customers improve both manufacturing efficiency and field service automation to break
-      down barriers impacting productivity and output. From cutting factory downtime and boosting asset
-      performance
-      to enabling skilled technicians to deliver services faster, our customers are achieving:
-    </ptc-para>
-    <ptc-para font-size="small" font-weight="w-7" para-margin="{margin-top-1, margin-bottom-1}" para-style="main">
-      The vast list of capabilities that support the 3D design process include:</ptc-para>
-    <div class="is-grid has-col has-col-gap-lg has-p">
-      <div class="is-col is-col-6-md">
-        <ptc-para font-size="small" font-weight="w-7" para-margin="margin-bottom-4" para-style="main">
-          3D part & assembly design</ptc-para>
-        <ptc-icon-list list-type="simple-icon-list"
-          list-content="Create precise geometry, regardless of model complexity">
-          <icon-asset slot="icon" type="ptc" size="large" name="icon-3d-cube" color="ptc-green"></icon-asset>
-        </ptc-icon-list>
-        <ptc-icon-list list-type="simple-icon-list"
-          list-content="Quickly build robust engineering features such as rounds, chamfers, holes, and more">
-          <icon-asset slot="icon" type="ptc" size="large" name="icon-3d-cube" color="ptc-green"></icon-asset>
-        </ptc-icon-list>
-        <ptc-icon-list list-type="simple-icon-list" is-last-item="true"
-          list-content="Create design variants using family tables">
-          <icon-asset slot="icon" type="ptc" size="large" name="icon-3d-cube" color="ptc-green"></icon-asset>
-        </ptc-icon-list>
-        <ptc-para font-size="small" font-weight="w-7" para-margin="margin-bottom-4" para-style="main">
-          Automated 2D drawing creation & update</ptc-para>
-        <ptc-icon-list list-type="simple-icon-list"
-          list-content="Quickly build robust engineering features such as rounds, chamfers, holes, and more">
-          <icon-asset slot="icon" type="ptc" size="large" name="icon-3d-cube" color="ptc-green"></icon-asset>
-        </ptc-icon-list>
-        <ptc-icon-list list-type="simple-icon-list" is-last-item=true
-          list-content="Create design variants using family tables">
-          <icon-asset slot="icon" type="ptc" size="large" name="icon-3d-cube" color="ptc-green"></icon-asset>
-        </ptc-icon-list>
-      </div>
-      <div class="is-col is-col-6-md">
-        <ptc-para font-size="small" font-weight="w-7" para-margin=" margin-bottom-4" para-style="main">
-          Assembly management & performance tools</ptc-para>
-        <ptc-icon-list list-type="simple-icon-list"
-          list-content="Create precise geometry, regardless of model complexity">
-          <icon-asset slot="icon" type="ptc" size="large" name="icon-3d-cube" color="ptc-green"></icon-asset>
-        </ptc-icon-list>
-        <ptc-icon-list list-type="simple-icon-list"
-          list-content="Create precise geometry, regardless of model complexity">
-          <icon-asset slot="icon" type="ptc" size="large" name="icon-3d-cube" color="ptc-green"></icon-asset>
-        </ptc-icon-list>
-        <ptc-icon-list list-type="simple-icon-list" is-last-item=true
-          list-content="Create precise geometry, regardless of model complexity">
-          <icon-asset slot="icon" type="ptc" size="large" name="icon-3d-cube" color="ptc-green"></icon-asset>
-        </ptc-icon-list>
-      </div>
-    </div>
-  </div>
-<script>
-  document.getElementById('modal-example-btn').addEventListener('click', () => {
-    document.getElementById('modal-example').show = true;
-  });
-
-
-  updateMediaPosition();
-  window.addEventListener('resize', updateMediaPosition);
-
-  function updateMediaPosition() {
-    const isMobile = window.innerWidth < 768;
-    const parentTc = document.querySelectorAll('.tcm-parent');
-
-    if (!parentTc.length) return; // Early exit if no elements found
-
-    parentTc.forEach((item) => {
-      const tcm = item.querySelector('.tcm-media');
-      const tct = item.querySelector('.tcm-text');
-
-      if (tcm && tct) { // Check that both elements exist
-        item.insertBefore(isMobile ? tcm : tct, isMobile ? tct : tcm);
-      }
-    });
-  }
-
-</script>
-  `;
-};
-
-export const Preview = AlertsPage.bind();