@ptcwebops/ptcw-design 6.3.5 → 6.3.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/event-jumbotron-example.cjs.entry.js +36 -3
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/ptc-close-icon_2.cjs.entry.js +6 -12
- package/dist/cjs/ptc-countdown.cjs.entry.js +100 -19
- package/dist/cjs/ptcw-design.cjs.js +1 -1
- package/dist/collection/components/organism-bundles/event-jumbotron-example/event-jumbotron-example.css +8 -4
- package/dist/collection/components/organism-bundles/event-jumbotron-example/event-jumbotron-example.js +35 -2
- package/dist/collection/components/ptc-countdown/ptc-countdown.css +2 -0
- package/dist/collection/components/ptc-countdown/ptc-countdown.js +193 -17
- package/dist/collection/components/ptc-modal/ptc-modal.css +4 -4
- package/dist/collection/components/ptc-modal/ptc-modal.js +5 -29
- package/dist/custom-elements/index.js +144 -36
- package/dist/esm/event-jumbotron-example.entry.js +36 -3
- package/dist/esm/loader.js +1 -1
- package/dist/esm/ptc-close-icon_2.entry.js +6 -12
- package/dist/esm/ptc-countdown.entry.js +100 -19
- package/dist/esm/ptcw-design.js +1 -1
- package/dist/ptcw-design/p-9fa958b9.entry.js +1 -0
- package/dist/ptcw-design/p-ab3d2934.entry.js +1 -0
- package/dist/ptcw-design/p-c8f68292.entry.js +1 -0
- package/dist/ptcw-design/ptcw-design.esm.js +1 -1
- package/dist/types/components/organism-bundles/event-jumbotron-example/event-jumbotron-example.d.ts +2 -0
- package/dist/types/components/ptc-countdown/ptc-countdown.d.ts +9 -0
- package/dist/types/components/ptc-modal/ptc-modal.d.ts +0 -1
- package/dist/types/components.d.ts +10 -2
- package/package.json +1 -1
- package/readme.md +1 -1
- package/dist/ptcw-design/p-27a4ee73.entry.js +0 -1
- package/dist/ptcw-design/p-42992202.entry.js +0 -1
- package/dist/ptcw-design/p-54350a01.entry.js +0 -1
|
@@ -2865,7 +2865,7 @@ var createFocusTrap = function createFocusTrap(elements, userOptions) {
|
|
|
2865
2865
|
return trap;
|
|
2866
2866
|
};
|
|
2867
2867
|
|
|
2868
|
-
const eventJumbotronExampleCss = "h1.sc-event-jumbotron-example,h2.sc-event-jumbotron-example,h3.sc-event-jumbotron-example,h4.sc-event-jumbotron-example,h5.sc-event-jumbotron-example,h6.sc-event-jumbotron-example,p.sc-event-jumbotron-example,ul.sc-event-jumbotron-example,li.sc-event-jumbotron-example,ptc-subnav.sc-event-jumbotron-example,ptc-tab-list.sc-event-jumbotron-example,ptc-link.sc-event-jumbotron-example,ptc-square-card.sc-event-jumbotron-example,.hyphenate-text.sc-event-jumbotron-example,ptc-footer.sc-event-jumbotron-example{word-break:break-word;hyphens:manual;-webkit-hyphens:manual;-moz-hyphens:manual;-ms-hyphens:manual}@supports (hyphenate-limit-chars: 12 3 3){h1.sc-event-jumbotron-example,h2.sc-event-jumbotron-example,h3.sc-event-jumbotron-example,h4.sc-event-jumbotron-example,h5.sc-event-jumbotron-example,h6.sc-event-jumbotron-example,p.sc-event-jumbotron-example,ul.sc-event-jumbotron-example,li.sc-event-jumbotron-example,ptc-subnav.sc-event-jumbotron-example,ptc-tab-list.sc-event-jumbotron-example,ptc-link.sc-event-jumbotron-example,ptc-square-card.sc-event-jumbotron-example,.hyphenate-text.sc-event-jumbotron-example,ptc-footer.sc-event-jumbotron-example{hyphens:auto;-webkit-hyphenate-limit-before:3;-webkit-hyphenate-limit-after:3;hyphenate-limit-chars:12 3 3;hyphenate-limit-lines:2;hyphenate-limit-last:always;hyphenate-limit-zone:6%;-webkit-hyphens:auto;-webkit-hyphenate-limit-before:3;-webkit-hyphenate-limit-after:3;-webkit-hyphenate-limit-chars:12 3 3;-webkit-hyphenate-limit-lines:2;-moz-hyphens:auto;-moz-hyphenate-limit-chars:12 3 3;-moz-hyphenate-limit-lines:2;-ms-hyphens:auto;-ms-hyphenate-limit-chars:12 3 3;-ms-hyphenate-limit-lines:2}}.sc-event-jumbotron-example-h{display:block;position:relative}.event-jumbotron.sc-event-jumbotron-example{margin-bottom:3rem;width:100%}.white-placeholder.sc-event-jumbotron-example{position:absolute;height:130px;width:100%;background-color:#F3f3f3;bottom:0px}.jumbotron-cards-wrapper.sc-event-jumbotron-example{z-index:1;position:relative;display:flex;flex-direction:column}.jumbotron-cards.sc-event-jumbotron-example{display:flex;gap:24px;overflow-x:auto;padding:
|
|
2868
|
+
const eventJumbotronExampleCss = "h1.sc-event-jumbotron-example,h2.sc-event-jumbotron-example,h3.sc-event-jumbotron-example,h4.sc-event-jumbotron-example,h5.sc-event-jumbotron-example,h6.sc-event-jumbotron-example,p.sc-event-jumbotron-example,ul.sc-event-jumbotron-example,li.sc-event-jumbotron-example,ptc-subnav.sc-event-jumbotron-example,ptc-tab-list.sc-event-jumbotron-example,ptc-link.sc-event-jumbotron-example,ptc-square-card.sc-event-jumbotron-example,.hyphenate-text.sc-event-jumbotron-example,ptc-footer.sc-event-jumbotron-example{word-break:break-word;hyphens:manual;-webkit-hyphens:manual;-moz-hyphens:manual;-ms-hyphens:manual}@supports (hyphenate-limit-chars: 12 3 3){h1.sc-event-jumbotron-example,h2.sc-event-jumbotron-example,h3.sc-event-jumbotron-example,h4.sc-event-jumbotron-example,h5.sc-event-jumbotron-example,h6.sc-event-jumbotron-example,p.sc-event-jumbotron-example,ul.sc-event-jumbotron-example,li.sc-event-jumbotron-example,ptc-subnav.sc-event-jumbotron-example,ptc-tab-list.sc-event-jumbotron-example,ptc-link.sc-event-jumbotron-example,ptc-square-card.sc-event-jumbotron-example,.hyphenate-text.sc-event-jumbotron-example,ptc-footer.sc-event-jumbotron-example{hyphens:auto;-webkit-hyphenate-limit-before:3;-webkit-hyphenate-limit-after:3;hyphenate-limit-chars:12 3 3;hyphenate-limit-lines:2;hyphenate-limit-last:always;hyphenate-limit-zone:6%;-webkit-hyphens:auto;-webkit-hyphenate-limit-before:3;-webkit-hyphenate-limit-after:3;-webkit-hyphenate-limit-chars:12 3 3;-webkit-hyphenate-limit-lines:2;-moz-hyphens:auto;-moz-hyphenate-limit-chars:12 3 3;-moz-hyphenate-limit-lines:2;-ms-hyphens:auto;-ms-hyphenate-limit-chars:12 3 3;-ms-hyphenate-limit-lines:2}}.sc-event-jumbotron-example-h{display:block;position:relative}.event-jumbotron.sc-event-jumbotron-example{margin-bottom:calc(3rem - 5px);width:100%}@media only screen and (min-width: 992px){.event-jumbotron.sc-event-jumbotron-example{margin-bottom:3rem}}.white-placeholder.sc-event-jumbotron-example{position:absolute;height:130px;width:100%;background-color:#F3f3f3;bottom:0px}.jumbotron-cards-wrapper.sc-event-jumbotron-example{z-index:1;position:relative;display:flex;flex-direction:column}.jumbotron-cards.sc-event-jumbotron-example{display:flex;gap:24px;overflow-x:auto;padding:5px 24px;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;cursor:grab}.jumbotron-cards.sc-event-jumbotron-example::-webkit-scrollbar{display:none}.jumbotron-cards.dragging.sc-event-jumbotron-example{cursor:grabbing}.card.sc-event-jumbotron-example{flex:1 0 auto;width:250px;height:414px;background:transparent;border-radius:var(--ptc-border-radius-standard);display:flex;justify-content:center;align-items:center;text-align:center;flex-direction:column;padding:24px;position:relative}.card.sc-event-jumbotron-example::after{content:\"\";position:absolute;top:0;left:0;bottom:0;right:0;box-shadow:0 2px 8px rgba(0, 0, 0, 0.1);z-index:-1;border-radius:var(--ptc-border-radius-standard)}.card.sc-event-jumbotron-example:focus-visible{border-radius:var(--ptc-border-radius-standard);outline:5px solid var(--keyboard-nav-outline)}.card.sc-event-jumbotron-example ptc-img.sc-event-jumbotron-example::after{content:\"\";top:0px;left:0px;position:absolute;width:100%;height:100%;border-radius:var(--ptc-border-radius-standard);background:linear-gradient(0deg, black 0%, black 100%);opacity:0.7;transition:opacity var(--ptc-transition-slow) ease-in-out;border:none;outline:1px solid rgba(255, 255, 255, 0.1);outline-offset:-1px}.card.sc-event-jumbotron-example:hover ptc-img.sc-event-jumbotron-example::after{opacity:0.8}.card.sc-event-jumbotron-example:focus ptc-img.sc-event-jumbotron-example::after,.card.sc-event-jumbotron-example:active ptc-img.sc-event-jumbotron-example::after{opacity:0.85}.text-wrapper.sc-event-jumbotron-example{align-self:flex-start;text-align:left}.card-title.sc-event-jumbotron-example{color:var(--color-white);font-family:var(--ptc-font-latin);font-size:var(--ptc-font-size-x-large);font-weight:var(--ptc-font-weight-extrabold);line-height:var(--ptc-line-height-densest);position:relative;z-index:2;margin-top:0;margin-bottom:var(--ptc-element-spacing-06)}.card-title.sc-event-jumbotron-example span.sc-event-jumbotron-example{font-weight:var(--ptc-font-weight-medium);display:inline-block}.cta-all.sc-event-jumbotron-example{margin-right:var(--ptc-element-spacing-05)}.panel.sc-event-jumbotron-example{display:none;visibility:hidden}@media only screen and (min-width: 768px){.card-title.sc-event-jumbotron-example{font-size:var(--ptc-font-size-xx-large)}.card-title.sc-event-jumbotron-example span.sc-event-jumbotron-example{font-size:var(--ptc-font-size-xx-large)}}@media only screen and (min-width: 992px){.card-title.sc-event-jumbotron-example{font-size:var(--ptc-font-size-x-large)}.card-title.sc-event-jumbotron-example span.sc-event-jumbotron-example{font-size:var(--ptc-font-size-x-large)}.cta-group.sc-event-jumbotron-example{margin-bottom:88px}.jumbotron-cards.sc-event-jumbotron-example{overflow-x:visible;justify-content:space-between;cursor:auto;transition:transform 0.3s ease-in-out;width:100%;padding:0px}.card.sc-event-jumbotron-example{width:auto;height:530px;padding:var(--ptc-element-spacing-06);cursor:pointer;flex:1}.card.hidden.sc-event-jumbotron-example{opacity:0;pointer-events:none}.card.active.sc-event-jumbotron-example{min-height:530px;border-top-right-radius:0px;border-bottom-right-radius:0px;box-shadow:var(--ptc-shadow-x-large);height:auto}.card.active.sc-event-jumbotron-example ptc-img.sc-event-jumbotron-example::after{border-top-right-radius:0px;border-bottom-right-radius:0px}.card.active.sc-event-jumbotron-example:hover ptc-img.sc-event-jumbotron-example::after{opacity:0.7}.card.active.sc-event-jumbotron-example:focus ptc-img.sc-event-jumbotron-example::after,.card.active.sc-event-jumbotron-example:active ptc-img.sc-event-jumbotron-example::after{opacity:0.7}.panel.sc-event-jumbotron-example{visibility:hidden;opacity:0;position:absolute;top:0;left:0;min-height:530px;padding:40px;background:var(--color-white);border-radius:var(--ptc-border-radius-standard);box-shadow:0 2px 8px rgba(0, 0, 0, 0.1);transition:opacity 0.3s ease-in-out, transform 0.3s ease-in-out;z-index:10}.panel.visible.sc-event-jumbotron-example{visibility:visible;opacity:1;border-top-left-radius:0px;border-bottom-left-radius:0px;box-shadow:var(--ptc-shadow-x-large);height:auto}.close-panel.sc-event-jumbotron-example{position:absolute;top:0px;right:0px;background:var(--color-white);border:none;text-align:center;cursor:pointer;padding:0px;margin:5px}.hide-scrollbar.sc-event-jumbotron-example{margin-left:-40px;margin-right:-40px}}@media only screen and (min-width: 1200px){.card-title.sc-event-jumbotron-example{font-size:var(--ptc-font-size-xx-large)}.card-title.sc-event-jumbotron-example span.sc-event-jumbotron-example{font-size:var(--ptc-font-size-xx-large)}.jumbotron-cards.sc-event-jumbotron-example{padding:0;gap:32px}}@media only screen and (min-width: 1440px){.jumbotron-cards.sc-event-jumbotron-example{gap:40px}}";
|
|
2869
2869
|
|
|
2870
2870
|
const EventJumbotronExample$1 = class extends HTMLElement$1 {
|
|
2871
2871
|
constructor() {
|
|
@@ -2944,6 +2944,7 @@ const EventJumbotronExample$1 = class extends HTMLElement$1 {
|
|
|
2944
2944
|
},
|
|
2945
2945
|
});
|
|
2946
2946
|
this.trap.activate();
|
|
2947
|
+
this.setupTabNavigation(panel); //set up special navigation to no-content panel, skip tabindex=-1 container and focus on the A inside a shdow dom.
|
|
2947
2948
|
}, 500);
|
|
2948
2949
|
}
|
|
2949
2950
|
else {
|
|
@@ -2955,11 +2956,43 @@ const EventJumbotronExample$1 = class extends HTMLElement$1 {
|
|
|
2955
2956
|
else if (!this.isDesktop) {
|
|
2956
2957
|
if (!this.isDragging) {
|
|
2957
2958
|
const modal = document.getElementById(`modal-${cardIndex}`);
|
|
2958
|
-
console.log('open: ' + modal.id);
|
|
2959
|
+
// console.log('open: ' + modal.id);
|
|
2959
2960
|
modal.show = true;
|
|
2960
2961
|
}
|
|
2961
2962
|
}
|
|
2962
2963
|
}
|
|
2964
|
+
//Focus the ptc-button directly in the no content panel (tab navigation).
|
|
2965
|
+
setupTabNavigation(panel) {
|
|
2966
|
+
var _a;
|
|
2967
|
+
if (panel.querySelector('.no-content-card')) {
|
|
2968
|
+
const shadowButton = panel.querySelector('ptc-close-icon');
|
|
2969
|
+
const closeButton = (_a = shadowButton.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('.close-icon');
|
|
2970
|
+
if (closeButton) {
|
|
2971
|
+
closeButton.addEventListener('keydown', (event) => {
|
|
2972
|
+
if (event.key === 'Tab' && !event.shiftKey) {
|
|
2973
|
+
event.preventDefault();
|
|
2974
|
+
this.focusShadowDomElement(panel);
|
|
2975
|
+
}
|
|
2976
|
+
});
|
|
2977
|
+
}
|
|
2978
|
+
}
|
|
2979
|
+
else {
|
|
2980
|
+
return;
|
|
2981
|
+
}
|
|
2982
|
+
}
|
|
2983
|
+
focusShadowDomElement(panel) {
|
|
2984
|
+
const card = panel.querySelector('.no-content-card');
|
|
2985
|
+
if (card) {
|
|
2986
|
+
const button = card.querySelector('ptc-button');
|
|
2987
|
+
// console.log('button: ' + button.innerHTML);
|
|
2988
|
+
if (button) {
|
|
2989
|
+
const link = button.shadowRoot.querySelector('a');
|
|
2990
|
+
if (link) {
|
|
2991
|
+
link.focus();
|
|
2992
|
+
}
|
|
2993
|
+
}
|
|
2994
|
+
}
|
|
2995
|
+
}
|
|
2963
2996
|
showPanel(card, panel) {
|
|
2964
2997
|
if (this.activePanel)
|
|
2965
2998
|
return;
|
|
@@ -3028,7 +3061,7 @@ const EventJumbotronExample$1 = class extends HTMLElement$1 {
|
|
|
3028
3061
|
document.addEventListener('keydown', event => {
|
|
3029
3062
|
if (event.key === 'Tab' || event.key === 'Enter' || event.key === ' ') {
|
|
3030
3063
|
this.openedWithKeyboard = true;
|
|
3031
|
-
console.log('keyboard status: ' + this.openedWithKeyboard);
|
|
3064
|
+
// console.log('keyboard status: ' + this.openedWithKeyboard);
|
|
3032
3065
|
}
|
|
3033
3066
|
});
|
|
3034
3067
|
document.addEventListener('mousedown', () => {
|
|
@@ -12215,15 +12248,11 @@ var utc = createCommonjsModule(function (module, exports) {
|
|
|
12215
12248
|
!function(t,i){module.exports=i();}(commonjsGlobal,(function(){var t="minute",i=/[+-]\d\d(?::?\d\d)?/g,e=/([+-]|\d\d)/g;return function(s,f,n){var u=f.prototype;n.utc=function(t){var i={date:t,utc:!0,args:arguments};return new f(i)},u.utc=function(i){var e=n(this.toDate(),{locale:this.$L,utc:!0});return i?e.add(this.utcOffset(),t):e},u.local=function(){return n(this.toDate(),{locale:this.$L,utc:!1})};var o=u.parse;u.parse=function(t){t.utc&&(this.$u=!0),this.$utils().u(t.$offset)||(this.$offset=t.$offset),o.call(this,t);};var r=u.init;u.init=function(){if(this.$u){var t=this.$d;this.$y=t.getUTCFullYear(),this.$M=t.getUTCMonth(),this.$D=t.getUTCDate(),this.$W=t.getUTCDay(),this.$H=t.getUTCHours(),this.$m=t.getUTCMinutes(),this.$s=t.getUTCSeconds(),this.$ms=t.getUTCMilliseconds();}else r.call(this);};var a=u.utcOffset;u.utcOffset=function(s,f){var n=this.$utils().u;if(n(s))return this.$u?0:n(this.$offset)?a.call(this):this.$offset;if("string"==typeof s&&(s=function(t){void 0===t&&(t="");var s=t.match(i);if(!s)return null;var f=(""+s[0]).match(e)||["-",0,0],n=f[0],u=60*+f[1]+ +f[2];return 0===u?0:"+"===n?u:-u}(s),null===s))return this;var u=Math.abs(s)<=16?60*s:s,o=this;if(f)return o.$offset=u,o.$u=0===s,o;if(0!==s){var r=this.$u?this.toDate().getTimezoneOffset():-1*this.utcOffset();(o=this.local().add(u+r,t)).$offset=u,o.$x.$localOffset=r;}else o=this.utc();return o};var h=u.format;u.format=function(t){var i=t||(this.$u?"YYYY-MM-DDTHH:mm:ss[Z]":"");return h.call(this,i)},u.valueOf=function(){var t=this.$utils().u(this.$offset)?0:this.$offset+(this.$x.$localOffset||this.$d.getTimezoneOffset());return this.$d.valueOf()-6e4*t},u.isUTC=function(){return !!this.$u},u.toISOString=function(){return this.toDate().toISOString()},u.toString=function(){return this.toDate().toUTCString()};var l=u.toDate;u.toDate=function(t){return "s"===t&&this.$offset?n(this.format("YYYY-MM-DD HH:mm:ss:SSS")).toDate():l.call(this)};var c=u.diff;u.diff=function(t,i,e){if(t&&this.$u===t.$u)return c.call(this,t,i,e);var s=this.local(),f=n(t).local();return c.call(s,f,i,e)};}}));
|
|
12216
12249
|
});
|
|
12217
12250
|
|
|
12218
|
-
|
|
12219
|
-
!function(t,e){module.exports=e();}(commonjsGlobal,(function(){var t={year:0,month:1,day:2,hour:3,minute:4,second:5},e={};return function(n,i,o){var r,a=function(t,n,i){void 0===i&&(i={});var o=new Date(t),r=function(t,n){void 0===n&&(n={});var i=n.timeZoneName||"short",o=t+"|"+i,r=e[o];return r||(r=new Intl.DateTimeFormat("en-US",{hour12:!1,timeZone:t,year:"numeric",month:"2-digit",day:"2-digit",hour:"2-digit",minute:"2-digit",second:"2-digit",timeZoneName:i}),e[o]=r),r}(n,i);return r.formatToParts(o)},u=function(e,n){for(var i=a(e,n),r=[],u=0;u<i.length;u+=1){var f=i[u],s=f.type,m=f.value,c=t[s];c>=0&&(r[c]=parseInt(m,10));}var d=r[3],l=24===d?0:d,h=r[0]+"-"+r[1]+"-"+r[2]+" "+l+":"+r[4]+":"+r[5]+":000",v=+e;return (o.utc(h).valueOf()-(v-=v%1e3))/6e4},f=i.prototype;f.tz=function(t,e){void 0===t&&(t=r);var n,i=this.utcOffset(),a=this.toDate(),u=a.toLocaleString("en-US",{timeZone:t}),f=Math.round((a-new Date(u))/1e3/60),s=15*-Math.round(a.getTimezoneOffset()/15)-f;if(!Number(s))n=this.utcOffset(0,e);else if(n=o(u,{locale:this.$L}).$set("millisecond",this.$ms).utcOffset(s,!0),e){var m=n.utcOffset();n=n.add(i-m,"minute");}return n.$x.$timezone=t,n},f.offsetName=function(t){var e=this.$x.$timezone||o.tz.guess(),n=a(this.valueOf(),e,{timeZoneName:t}).find((function(t){return "timezonename"===t.type.toLowerCase()}));return n&&n.value};var s=f.startOf;f.startOf=function(t,e){if(!this.$x||!this.$x.$timezone)return s.call(this,t,e);var n=o(this.format("YYYY-MM-DD HH:mm:ss:SSS"),{locale:this.$L});return s.call(n,t,e).tz(this.$x.$timezone,!0)},o.tz=function(t,e,n){var i=n&&e,a=n||e||r,f=u(+o(),a);if("string"!=typeof t)return o(t).tz(a);var s=function(t,e,n){var i=t-60*e*1e3,o=u(i,n);if(e===o)return [i,e];var r=u(i-=60*(o-e)*1e3,n);return o===r?[i,o]:[t-60*Math.min(o,r)*1e3,Math.max(o,r)]}(o.utc(t,i).valueOf(),f,a),m=s[0],c=s[1],d=o(m).utcOffset(c);return d.$x.$timezone=a,d},o.tz.guess=function(){return Intl.DateTimeFormat().resolvedOptions().timeZone},o.tz.setDefault=function(t){r=t;};}}));
|
|
12220
|
-
});
|
|
12221
|
-
|
|
12222
|
-
const ptcCountdownCss = "h1,h2,h3,h4,h5,h6,p,ul,li,ptc-subnav,ptc-tab-list,ptc-link,ptc-square-card,.hyphenate-text,ptc-footer{word-break:break-word;hyphens:manual;-webkit-hyphens:manual;-moz-hyphens:manual;-ms-hyphens:manual}@supports (hyphenate-limit-chars: 12 3 3){h1,h2,h3,h4,h5,h6,p,ul,li,ptc-subnav,ptc-tab-list,ptc-link,ptc-square-card,.hyphenate-text,ptc-footer{hyphens:auto;-webkit-hyphenate-limit-before:3;-webkit-hyphenate-limit-after:3;hyphenate-limit-chars:12 3 3;hyphenate-limit-lines:2;hyphenate-limit-last:always;hyphenate-limit-zone:6%;-webkit-hyphens:auto;-webkit-hyphenate-limit-before:3;-webkit-hyphenate-limit-after:3;-webkit-hyphenate-limit-chars:12 3 3;-webkit-hyphenate-limit-lines:2;-moz-hyphens:auto;-moz-hyphenate-limit-chars:12 3 3;-moz-hyphenate-limit-lines:2;-ms-hyphens:auto;-ms-hyphenate-limit-chars:12 3 3;-ms-hyphenate-limit-lines:2}}:host{display:block;z-index:10;display:flex;align-items:center;justify-content:flex-start;margin-left:0px;margin-bottom:32px}@media only screen and (min-width: 992px){:host{margin-left:var(--ptc-element-spacing-05);margin-bottom:0px}}.countdown-outer{padding:16px 4px;display:block;max-width:450px;border-radius:4px;box-shadow:0 12px 16px 0 rgba(0, 0, 0, 0.32);background-color:#20262a}@media only screen and (min-width: 480px){.countdown-outer{padding:16px 32px}}.event-name{display:flex;justify-content:center;align-items:center;margin-bottom:24px;color:white;font-family:\"Raleway\", sans-serif;font-size:24px;letter-spacing:0.48px;text-align:center}.cd-event-date{display:flex;justify-content:center;align-items:center;margin-top:32px;color:white;font-family:\"Raleway\", sans-serif;font-size:16px;letter-spacing:0.32px}.countdown{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;color:white;font-size:16px;margin:12px 0px}.day,.hours,.minutes,.seconds{display:flex;flex-flow:column nowrap;align-items:center;justify-content:center;padding:4px 4px;border-right:1px #6d707b solid}@media only screen and (min-width: 480px){.day,.hours,.minutes,.seconds{padding:4px 16px}}.day div,.hours div,.minutes div,.seconds div{line-height:56px;letter-spacing:0.96px;font-weight:600;font-size:48px;color:#fff}.day span,.hours span,.minutes span,.seconds span{display:block;font-size:16px;line-height:1.63;letter-spacing:0.32px;text-align:center;color:#fff;margin-bottom:0}.seconds{border-right:none}.expired{min-height:90px;display:flex;justify-content:center;align-items:center;text-align:center;font-weight:bold;padding:0 0px;color:var(--color-white)}";
|
|
12251
|
+
const ptcCountdownCss = "h1,h2,h3,h4,h5,h6,p,ul,li,ptc-subnav,ptc-tab-list,ptc-link,ptc-square-card,.hyphenate-text,ptc-footer{word-break:break-word;hyphens:manual;-webkit-hyphens:manual;-moz-hyphens:manual;-ms-hyphens:manual}@supports (hyphenate-limit-chars: 12 3 3){h1,h2,h3,h4,h5,h6,p,ul,li,ptc-subnav,ptc-tab-list,ptc-link,ptc-square-card,.hyphenate-text,ptc-footer{hyphens:auto;-webkit-hyphenate-limit-before:3;-webkit-hyphenate-limit-after:3;hyphenate-limit-chars:12 3 3;hyphenate-limit-lines:2;hyphenate-limit-last:always;hyphenate-limit-zone:6%;-webkit-hyphens:auto;-webkit-hyphenate-limit-before:3;-webkit-hyphenate-limit-after:3;-webkit-hyphenate-limit-chars:12 3 3;-webkit-hyphenate-limit-lines:2;-moz-hyphens:auto;-moz-hyphenate-limit-chars:12 3 3;-moz-hyphenate-limit-lines:2;-ms-hyphens:auto;-ms-hyphenate-limit-chars:12 3 3;-ms-hyphenate-limit-lines:2}}:host{display:block;z-index:10;display:flex;align-items:center;justify-content:flex-start;margin-left:0px;margin-bottom:32px}@media only screen and (min-width: 992px){:host{margin-left:var(--ptc-element-spacing-05);margin-bottom:0px}}.countdown-outer{padding:16px 4px;display:block;max-width:450px;min-width:280px;border-radius:4px;box-shadow:0 12px 16px 0 rgba(0, 0, 0, 0.32);background-color:#20262a}@media only screen and (min-width: 480px){.countdown-outer{padding:16px 32px;min-width:380px}}.event-name{display:flex;justify-content:center;align-items:center;margin-bottom:24px;color:white;font-family:\"Raleway\", sans-serif;font-size:24px;letter-spacing:0.48px;text-align:center}.cd-event-date{display:flex;justify-content:center;align-items:center;margin-top:32px;color:white;font-family:\"Raleway\", sans-serif;font-size:16px;letter-spacing:0.32px}.countdown{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;color:white;font-size:16px;margin:12px 0px}.day,.hours,.minutes,.seconds{display:flex;flex-flow:column nowrap;align-items:center;justify-content:center;padding:4px 4px;border-right:1px #6d707b solid}@media only screen and (min-width: 480px){.day,.hours,.minutes,.seconds{padding:4px 16px}}.day div,.hours div,.minutes div,.seconds div{line-height:56px;letter-spacing:0.96px;font-weight:600;font-size:48px;color:#fff}.day span,.hours span,.minutes span,.seconds span{display:block;font-size:16px;line-height:1.63;letter-spacing:0.32px;text-align:center;color:#fff;margin-bottom:0}.seconds{border-right:none}.expired{min-height:90px;display:flex;justify-content:center;align-items:center;text-align:center;font-weight:bold;padding:0 0px;color:var(--color-white)}";
|
|
12223
12252
|
|
|
12253
|
+
// import timezone from 'dayjs/plugin/timezone';
|
|
12224
12254
|
// Extend dayjs with timezone support
|
|
12225
12255
|
dayjs_min.extend(utc);
|
|
12226
|
-
dayjs_min.extend(timezone);
|
|
12227
12256
|
const PtcCountdown$1 = class extends HTMLElement$1 {
|
|
12228
12257
|
constructor() {
|
|
12229
12258
|
super();
|
|
@@ -12231,8 +12260,13 @@ const PtcCountdown$1 = class extends HTMLElement$1 {
|
|
|
12231
12260
|
this.__attachShadow();
|
|
12232
12261
|
this.countdownTitle = '';
|
|
12233
12262
|
this.eventTime = '';
|
|
12234
|
-
this.eventTimeZone = '
|
|
12263
|
+
this.eventTimeZone = 'EST';
|
|
12235
12264
|
this.expiredText = 'This event has started on';
|
|
12265
|
+
this.daysText = 'days';
|
|
12266
|
+
this.hoursText = 'hours';
|
|
12267
|
+
this.minutesText = 'minutes';
|
|
12268
|
+
this.secondsText = 'seconds';
|
|
12269
|
+
this.useHourFormat = true;
|
|
12236
12270
|
this.timeLeft = {
|
|
12237
12271
|
days: 0,
|
|
12238
12272
|
hours: 0,
|
|
@@ -12240,24 +12274,70 @@ const PtcCountdown$1 = class extends HTMLElement$1 {
|
|
|
12240
12274
|
seconds: 0,
|
|
12241
12275
|
};
|
|
12242
12276
|
this.isExpired = false;
|
|
12277
|
+
this.displayLocale = 'en';
|
|
12243
12278
|
}
|
|
12244
12279
|
componentWillLoad() {
|
|
12245
12280
|
if (!this.eventTime || !this.eventTimeZone) {
|
|
12246
12281
|
console.error('Both eventTime and eventTimeZone are required.');
|
|
12247
12282
|
return;
|
|
12248
12283
|
}
|
|
12284
|
+
this.detectLocaleFromURL();
|
|
12249
12285
|
this.startCountdown();
|
|
12250
12286
|
}
|
|
12251
12287
|
disconnectedCallback() {
|
|
12252
12288
|
clearInterval(this.timer);
|
|
12253
12289
|
}
|
|
12290
|
+
// Map time zone abbreviations to their offset in minutes.
|
|
12291
|
+
getOffsetFromAbbr(abbr) {
|
|
12292
|
+
const tzMapping = {
|
|
12293
|
+
'ACDT': 630,
|
|
12294
|
+
'ACST': 570,
|
|
12295
|
+
'ADT': -180,
|
|
12296
|
+
'AEDT': 660,
|
|
12297
|
+
'AEST': 600,
|
|
12298
|
+
'AKDT': -480,
|
|
12299
|
+
'AKST': -540,
|
|
12300
|
+
'AST': -240,
|
|
12301
|
+
'AWST': 480,
|
|
12302
|
+
'BST': 60,
|
|
12303
|
+
'CDT': -300,
|
|
12304
|
+
'CEST': 120,
|
|
12305
|
+
'CET': 60,
|
|
12306
|
+
'CST': -360,
|
|
12307
|
+
'CST_CN': 480,
|
|
12308
|
+
'EDT': -240,
|
|
12309
|
+
'EEST': 180,
|
|
12310
|
+
'EET': 120,
|
|
12311
|
+
'EST': -300,
|
|
12312
|
+
'GMT': 0,
|
|
12313
|
+
'HKT': 480,
|
|
12314
|
+
'IST': 330,
|
|
12315
|
+
'JST': 540,
|
|
12316
|
+
'MDT': -360,
|
|
12317
|
+
'MST': -420,
|
|
12318
|
+
'PDT': -420,
|
|
12319
|
+
'PST': -480,
|
|
12320
|
+
'UTC': 0,
|
|
12321
|
+
};
|
|
12322
|
+
return tzMapping[abbr] !== undefined ? tzMapping[abbr] : 0;
|
|
12323
|
+
}
|
|
12324
|
+
// Convert the provided date to ISO 8601 if needed.
|
|
12254
12325
|
transformDate(contentDate) {
|
|
12326
|
+
// If contentDate includes a 'T', assume it’s ISO 8601.
|
|
12327
|
+
if (contentDate.includes('T')) {
|
|
12328
|
+
return contentDate;
|
|
12329
|
+
}
|
|
12330
|
+
// Otherwise, assume the original format "M/D/YYYY h:mm:ss A"
|
|
12255
12331
|
return dayjs_min(contentDate, 'M/D/YYYY h:mm:ss A').format('YYYY-MM-DDTHH:mm:ss');
|
|
12256
12332
|
}
|
|
12257
12333
|
calculateTimeLeft() {
|
|
12258
|
-
const
|
|
12259
|
-
|
|
12260
|
-
|
|
12334
|
+
const offset = this.getOffsetFromAbbr(this.eventTimeZone);
|
|
12335
|
+
// Parse eventTime as if it is in the provided time zone.
|
|
12336
|
+
// Using utcOffset(offset, true) tells dayjs to treat the parsed time as local in that offset.
|
|
12337
|
+
const target = dayjs_min(this.transformDate(this.eventTime))
|
|
12338
|
+
.utcOffset(offset, true)
|
|
12339
|
+
.utc();
|
|
12340
|
+
const now = dayjs_min.utc();
|
|
12261
12341
|
const diff = target.diff(now);
|
|
12262
12342
|
if (diff > 0) {
|
|
12263
12343
|
this.timeLeft = {
|
|
@@ -12273,24 +12353,58 @@ const PtcCountdown$1 = class extends HTMLElement$1 {
|
|
|
12273
12353
|
}
|
|
12274
12354
|
}
|
|
12275
12355
|
startCountdown() {
|
|
12356
|
+
this.calculateTimeLeft();
|
|
12276
12357
|
this.timer = window.setInterval(() => this.calculateTimeLeft(), 1000);
|
|
12277
12358
|
}
|
|
12359
|
+
shouldUse12HourFormat() {
|
|
12360
|
+
if (this.displayLocale === 'en') {
|
|
12361
|
+
return true;
|
|
12362
|
+
}
|
|
12363
|
+
else if (this.useHourFormat !== undefined) {
|
|
12364
|
+
return this.useHourFormat;
|
|
12365
|
+
}
|
|
12366
|
+
}
|
|
12367
|
+
detectLocaleFromURL() {
|
|
12368
|
+
const url = window.location.href;
|
|
12369
|
+
if (url.includes('/cn/')) {
|
|
12370
|
+
this.displayLocale = 'zh-CN';
|
|
12371
|
+
}
|
|
12372
|
+
else if (url.includes('/tw/')) {
|
|
12373
|
+
this.displayLocale = 'zh-TW';
|
|
12374
|
+
}
|
|
12375
|
+
else if (url.includes('/fr/')) {
|
|
12376
|
+
this.displayLocale = 'fr';
|
|
12377
|
+
}
|
|
12378
|
+
else if (url.includes('/de/')) {
|
|
12379
|
+
this.displayLocale = 'de';
|
|
12380
|
+
}
|
|
12381
|
+
else if (url.includes('/it/')) {
|
|
12382
|
+
this.displayLocale = 'it';
|
|
12383
|
+
}
|
|
12384
|
+
else if (url.includes('/ja/')) {
|
|
12385
|
+
this.displayLocale = 'ja';
|
|
12386
|
+
}
|
|
12387
|
+
else if (url.includes('/ko/')) {
|
|
12388
|
+
this.displayLocale = 'ko';
|
|
12389
|
+
}
|
|
12390
|
+
else {
|
|
12391
|
+
this.displayLocale = 'en';
|
|
12392
|
+
}
|
|
12393
|
+
}
|
|
12278
12394
|
render() {
|
|
12279
12395
|
const { days, hours, minutes, seconds } = this.timeLeft;
|
|
12280
|
-
|
|
12281
|
-
|
|
12282
|
-
|
|
12283
|
-
|
|
12284
|
-
|
|
12285
|
-
|
|
12286
|
-
minute: '2-digit',
|
|
12287
|
-
}))), h$1("div", { class: "cd-event-date" }, new Date(this.eventTime).toLocaleString('en-US', {
|
|
12288
|
-
//timeZone: this.eventTimeZone,
|
|
12396
|
+
// Format the event time in 24-hour ISO 8601 style, applying the eventTimeZone offset.
|
|
12397
|
+
const formattedEventTime = dayjs_min(this.transformDate(this.eventTime))
|
|
12398
|
+
.utcOffset(this.getOffsetFromAbbr(this.eventTimeZone), true)
|
|
12399
|
+
.format('YYYY-MM-DD HH:mm');
|
|
12400
|
+
const hour12 = this.shouldUse12HourFormat();
|
|
12401
|
+
return (h$1("div", { class: "countdown-outer" }, this.countdownTitle && h$1("div", { class: "event-name" }, this.countdownTitle), !this.isExpired ? (h$1("div", { id: "CDOutput", class: "countdown" }, h$1("div", { class: "day" }, h$1("div", null, days), h$1("span", null, this.daysText)), h$1("div", { class: "hours" }, h$1("div", null, hours), h$1("span", null, this.hoursText)), h$1("div", { class: "minutes" }, h$1("div", null, minutes), h$1("span", null, this.minutesText)), h$1("div", { class: "seconds" }, h$1("div", null, seconds), h$1("span", null, this.secondsText)))) : (h$1("div", { class: "expired" }, `${this.expiredText} ${formattedEventTime} ${this.eventTimeZone}`)), h$1("div", { class: "cd-event-date" }, new Date(this.eventTime).toLocaleDateString(this.displayLocale, {
|
|
12289
12402
|
month: 'long',
|
|
12290
12403
|
day: 'numeric',
|
|
12291
12404
|
year: 'numeric',
|
|
12292
12405
|
hour: '2-digit',
|
|
12293
12406
|
minute: '2-digit',
|
|
12407
|
+
hour12: hour12,
|
|
12294
12408
|
}), ' ', "(", this.eventTimeZone, ")")));
|
|
12295
12409
|
}
|
|
12296
12410
|
static get style() { return ptcCountdownCss; }
|
|
@@ -23326,7 +23440,7 @@ const PtcMobileSelect$1 = class extends HTMLElement$1 {
|
|
|
23326
23440
|
static get style() { return ptcMobileSelectCss; }
|
|
23327
23441
|
};
|
|
23328
23442
|
|
|
23329
|
-
const ptcModalCss = "h1,h2,h3,h4,h5,h6,p,ul,li,ptc-subnav,ptc-tab-list,ptc-link,ptc-square-card,.hyphenate-text,ptc-footer{word-break:break-word;hyphens:manual;-webkit-hyphens:manual;-moz-hyphens:manual;-ms-hyphens:manual}@supports (hyphenate-limit-chars: 12 3 3){h1,h2,h3,h4,h5,h6,p,ul,li,ptc-subnav,ptc-tab-list,ptc-link,ptc-square-card,.hyphenate-text,ptc-footer{hyphens:auto;-webkit-hyphenate-limit-before:3;-webkit-hyphenate-limit-after:3;hyphenate-limit-chars:12 3 3;hyphenate-limit-lines:2;hyphenate-limit-last:always;hyphenate-limit-zone:6%;-webkit-hyphens:auto;-webkit-hyphenate-limit-before:3;-webkit-hyphenate-limit-after:3;-webkit-hyphenate-limit-chars:12 3 3;-webkit-hyphenate-limit-lines:2;-moz-hyphens:auto;-moz-hyphenate-limit-chars:12 3 3;-moz-hyphenate-limit-lines:2;-ms-hyphens:auto;-ms-hyphenate-limit-chars:12 3 3;-ms-hyphenate-limit-lines:2}}:host{display:block}.wrapper{position:absolute;width:100vw;height:100%;top:0;left:0;z-index:500001;display:none}.wrapper.fixed{position:fixed}.wrapper .modal-popup{margin:7.5rem auto 1rem;background-color:var(--color-white);box-shadow:var(--ptc-shadow-large);max-width:22.5625rem;width:80%;display:flex;flex-direction:column;align-items:flex-end;align-content:flex-end;z-index:50020;transform:translateY(-100%)}@media only screen and (min-width: 992px){.wrapper .modal-popup{max-width:29.125rem}}.wrapper .modal-popup.md{max-width:44.125rem}.wrapper .modal-popup.lg{max-width:56.25rem}.wrapper .modal-popup.xl{max-width:64.0625rem}.wrapper .modal-popup.max{width:calc(100% - 4rem);max-width:75rem;height:80vh;margin:auto;overflow:hidden}.wrapper .modal-popup.max .close{margin:var(--ptc-element-spacing-02)}.wrapper .modal-popup.max .modal-body iframe{height:100%}.wrapper .modal-popup.sm-modal{width:341px;max-width:341px}@media only screen and (max-width: 360px){.wrapper .modal-popup.sm-modal{max-width:100%;width:100%}}@media only screen and (min-width: 360px) and (max-width: 479.55px){.wrapper .modal-popup.sm-modal{max-width:360px;width:360px}}@media only screen and (min-width: 480px){.wrapper .modal-popup.sm-modal.modal-with-content{width:371px;max-width:371px}}@media only screen and (min-width: 360px) and (max-width: 479.55px){.wrapper .modal-popup.sm-modal.modal-with-content{max-width:360px;width:360px}}.wrapper .modal-popup .modal-body{width:100%}.wrapper .modal-popup .modal-body iframe{opacity:0;overflow:hidden;width:100%;border:0;transition:opacity var(--ptc-ease-inout) var(--ptc-transition-medium)}.wrapper .modal-popup .modal-body iframe.ready{opacity:1}.wrapper .modal-popup .modal-body.frame{overflow:hidden;overflow-y:hidden;overflow-x:hidden}.wrapper .modal-popup .modal-body.html{overflow:hidden}.wrapper .modal-popup.frame .modal-body{display:flex;flex:1;height:100%}.wrapper .modal-popup .close{margin-right:2px;margin-top:2px}.wrapper .modal-popup.shadow-scroller{max-height:calc(100vh - 220px)}@media only screen and (min-width: 992px){.wrapper .modal-popup.shadow-scroller{max-height:756px}}.wrapper .modal-popup.shadow-scroller .modal-header{transition:box-shadow ease-in-out 250ms;position:relative;min-height:57px;border-bottom:1px solid var(--color-gray-02);width:100%}.wrapper .modal-popup.shadow-scroller .modal-header .close{position:absolute;top:8px;right:8px;margin:0}.wrapper .modal-popup.shadow-scroller .modal-body{min-height:200px;overflow-x:hidden}.wrapper .modal-popup.shadow-scroller .modal-footer{transition:box-shadow ease-in-out 250ms;width:100%;min-height:60px;border-top:1px solid var(--color-gray-02);padding-top:1rem}.wrapper .modal-popup.shadow-scroller.scroll-top .modal-header{box-shadow:0px 4px 12px rgba(0, 0, 0, 0.12)}.wrapper .modal-popup.shadow-scroller.scroll-bottom .modal-footer{box-shadow:0px -8px 12px rgba(0, 0, 0, 0.12)}.wrapper.show{display:flex;align-items:flex-start}.wrapper.show .modal-popup{transform:translateY(0)}.wrapper.show .modal-popup.rounded{border-radius:var(--ptc-border-radius-standard)}.overlay{width:100vw;height:100vh;position:fixed;top:0;left:0;z-index:50010;display:block;background-color:rgba(0, 0, 0, 0.6)}:host(.standard) .modal-popup{border-radius:var(--ptc-border-radius-standard)}:host(.large) .modal-popup{border-radius:var(--ptc-border-radius-large)}:host(.pill) .modal-popup{border-radius:var(--ptc-border-radius-pill)}:host(.circle) .modal-popup{border-radius:var(--ptc-border-radius-circle)}:host(.enclose-modal) .modal-popup{max-height:calc(100vh - 180px)}:host(.enclose-modal) .modal-popup:not(.frame) .modal-body{overflow-y:auto}:host(.bio-modal) .wrapper.show{align-items:flex-start}@media only screen and (min-width: 768px){:host(.bio-modal) .wrapper.show{align-items:center}}:host(.bio-modal) .modal-popup{padding:30px 15px 30px 0;max-width:1200px;margin:20px auto 0 auto;max-height:calc(100vh - 180px);width:90%;height:100%}:host(.bio-modal) .modal-popup .modal-body{height:100%}@media only screen and (min-width: 768px){:host(.bio-modal) .modal-popup .modal-body{height:auto}}@media (max-height: 450px){:host(.bio-modal) .modal-popup .modal-body{height:100%}}@media only screen and (min-width: 768px){:host(.bio-modal) .modal-popup{max-height:none;width:80%;margin-top:0px;height:auto}}@media only screen and (min-width: 1440px){:host(.bio-modal) .modal-popup{max-width:1400px}}@media (max-height: 450px){:host(.bio-modal) .modal-popup{max-height:calc(100vh - 180px);height:100%}}:host(.bio-modal) .close{position:absolute;margin:0;right:8px;top:8px}:host(.bio-modal) .close svg .cls-1,:host(.bio-modal) .close svg .cls-2{fill:none;stroke-width:2px}:host(.bio-modal) .close svg .cls-1{stroke:#1c2439;stroke-linecap:square}:host(.bio-modal) .close svg .cls-2{stroke:#74c34d}:host(.bio-modal) .close svg path{transition:all ease-in-out 250ms}:host(.bio-modal) .close svg .cls-1:nth-child(1){transform:translate(175.5px, 135.5px)}:host(.bio-modal) .close svg .cls-1:nth-child(2){transform:translate(175.5px, 174.985px)}:host(.bio-modal) .close svg .cls-1:nth-child(3){transform:translate(215.5px, 141.393px)}:host(.bio-modal) .close svg .cls-1:nth-child(4){transform:translate(175.5px, 135.5px)}:host(.bio-modal) .close:hover svg .cls-1:nth-child(1){transform:translate(175.5px, 162px)}:host(.bio-modal) .close:hover svg .cls-1:nth-child(2){transform:translate(149px, 174.985px)}:host(.bio-modal) .close:hover svg .cls-1:nth-child(3){transform:translate(215.5px, 174px)}:host(.bio-modal) .close:hover svg .cls-1:nth-child(4){transform:translate(152.5px, 135.5px)}:host(.no-container) .wrapper .modal-popup.xl{max-width:80rem !important;background:transparent;box-shadow:none}:host(.no-container) .wrapper .modal-popup .close{display:none}:host(.video-modal) .modal-popup{margin:auto}@media (max-height: 768px){:host(.video-modal) .modal-popup.xl{max-width:56rem}}@media (max-height: 600px){:host(.video-modal) .modal-popup.xl{max-width:44rem}}@media (max-height: 500px){:host(.video-modal) .modal-popup.xl{max-width:35rem}}@media (max-height: 400px){:host(.video-modal) .modal-popup.xl{max-width:26rem}}:host(.event-listing) .wrapper .modal-popup{max-width:unset;width:calc(100% - 48px);top:50%;left:50%;transform:translate(-50%, -50%) !important;margin:0px;position:absolute}:host(.vh-center) .wrapper .modal-popup{top:50%;left:50%;transform:translate(-50%, -50%) !important;margin:0px auto;position:absolute}:host(.thank-you) .wrapper .modal-popup{max-width:calc(100% - 48px);width:100%}@media only screen and (min-width: 480px){:host(.thank-you) .wrapper .modal-popup{max-width:640px;width:80%}}:host(.thank-you) .wrapper .modal-popup .modal-body{padding:2px 24px 48px 24px;box-sizing:border-box}@media only screen and (min-width: 992px){:host(.thank-you) .wrapper .modal-popup .modal-body{padding:2px 48px 48px 48px}}:host .wrapper .event-list-header{display:flex;position:absolute;width:100%;height:118px;left:0;transform:translateY(-100%);border-radius:var(--ptc-border-radius-standard) var(--ptc-border-radius-standard) 0px 0px;align-items:center;padding:var(--ptc-element-spacing-06);box-sizing:border-box}:host .wrapper .event-list-header::before{content:\"\";position:absolute;left:0;width:100%;height:100%;border-radius:4px 4px 0px 0px;background:linear-gradient(0deg, rgba(0, 0, 0, 0.7) 0%, rgba(0, 0, 0, 0.7) 100%);z-index:1}:host .wrapper .event-list-header+.close{margin-top:0px;margin-right:0px;width:40px;height:40px;display:flex;justify-content:center;align-items:center}:host .wrapper .event-list-header .text-wrapper{display:flex;flex-wrap:wrap;column-gap:0.5em}:host .wrapper .event-list-header .text-wrapper span{display:inline-block;color:var(--color-white);font-family:var(--ptc-font-latin);font-size:var(--ptc-font-size-x-large);font-weight:var(--ptc-font-weight-medium);line-height:var(--ptc-line-height-densest);position:relative;z-index:2}:host .wrapper .event-list-header .text-wrapper span:first-of-type{font-weight:var(--ptc-font-weight-extrabold)}:host .wrapper .event-mobile-modal{border-top-left-radius:0px;border-top-right-radius:0px}:host .wrapper .bottom-close{text-align:center;margin:0 auto 40px auto}:host .wrapper .bottom-close span{cursor:pointer;color:var(--color-hyperlink);font-size:var(--ptc-font-size-small);font-weight:var(--ptc-font-weight-bold);text-decoration-line:underline;line-height:var(--ptc-line-height-densest)}:host .wrapper .bottom-close span:focus-visible{border-radius:var(--ptc-border-radius-standard);outline:5px solid var(--keyboard-nav-outline)}
|
|
23443
|
+
const ptcModalCss = "h1,h2,h3,h4,h5,h6,p,ul,li,ptc-subnav,ptc-tab-list,ptc-link,ptc-square-card,.hyphenate-text,ptc-footer{word-break:break-word;hyphens:manual;-webkit-hyphens:manual;-moz-hyphens:manual;-ms-hyphens:manual}@supports (hyphenate-limit-chars: 12 3 3){h1,h2,h3,h4,h5,h6,p,ul,li,ptc-subnav,ptc-tab-list,ptc-link,ptc-square-card,.hyphenate-text,ptc-footer{hyphens:auto;-webkit-hyphenate-limit-before:3;-webkit-hyphenate-limit-after:3;hyphenate-limit-chars:12 3 3;hyphenate-limit-lines:2;hyphenate-limit-last:always;hyphenate-limit-zone:6%;-webkit-hyphens:auto;-webkit-hyphenate-limit-before:3;-webkit-hyphenate-limit-after:3;-webkit-hyphenate-limit-chars:12 3 3;-webkit-hyphenate-limit-lines:2;-moz-hyphens:auto;-moz-hyphenate-limit-chars:12 3 3;-moz-hyphenate-limit-lines:2;-ms-hyphens:auto;-ms-hyphenate-limit-chars:12 3 3;-ms-hyphenate-limit-lines:2}}:host{display:block}.wrapper{position:absolute;width:100vw;height:100%;top:0;left:0;z-index:500001;display:none}.wrapper.fixed{position:fixed}.wrapper .modal-popup{margin:7.5rem auto 1rem;background-color:var(--color-white);box-shadow:var(--ptc-shadow-large);max-width:22.5625rem;width:80%;display:flex;flex-direction:column;align-items:flex-end;align-content:flex-end;z-index:50020;transform:translateY(-100%)}@media only screen and (min-width: 992px){.wrapper .modal-popup{max-width:29.125rem}}.wrapper .modal-popup.md{max-width:44.125rem}.wrapper .modal-popup.lg{max-width:56.25rem}.wrapper .modal-popup.xl{max-width:64.0625rem}.wrapper .modal-popup.max{width:calc(100% - 4rem);max-width:75rem;height:80vh;margin:auto;overflow:hidden}.wrapper .modal-popup.max .close{margin:var(--ptc-element-spacing-02)}.wrapper .modal-popup.max .modal-body iframe{height:100%}.wrapper .modal-popup.sm-modal{width:341px;max-width:341px}@media only screen and (max-width: 360px){.wrapper .modal-popup.sm-modal{max-width:100%;width:100%}}@media only screen and (min-width: 360px) and (max-width: 479.55px){.wrapper .modal-popup.sm-modal{max-width:360px;width:360px}}@media only screen and (min-width: 480px){.wrapper .modal-popup.sm-modal.modal-with-content{width:371px;max-width:371px}}@media only screen and (min-width: 360px) and (max-width: 479.55px){.wrapper .modal-popup.sm-modal.modal-with-content{max-width:360px;width:360px}}.wrapper .modal-popup .modal-body{width:100%}.wrapper .modal-popup .modal-body iframe{opacity:0;overflow:hidden;width:100%;border:0;transition:opacity var(--ptc-ease-inout) var(--ptc-transition-medium)}.wrapper .modal-popup .modal-body iframe.ready{opacity:1}.wrapper .modal-popup .modal-body.frame{overflow:hidden;overflow-y:hidden;overflow-x:hidden}.wrapper .modal-popup .modal-body.html{overflow:hidden}.wrapper .modal-popup.frame .modal-body{display:flex;flex:1;height:100%}.wrapper .modal-popup .close{margin-right:2px;margin-top:2px}.wrapper .modal-popup.shadow-scroller{max-height:calc(100vh - 220px)}@media only screen and (min-width: 992px){.wrapper .modal-popup.shadow-scroller{max-height:756px}}.wrapper .modal-popup.shadow-scroller .modal-header{transition:box-shadow ease-in-out 250ms;position:relative;min-height:57px;border-bottom:1px solid var(--color-gray-02);width:100%}.wrapper .modal-popup.shadow-scroller .modal-header .close{position:absolute;top:8px;right:8px;margin:0}.wrapper .modal-popup.shadow-scroller .modal-body{min-height:200px;overflow-x:hidden}.wrapper .modal-popup.shadow-scroller .modal-footer{transition:box-shadow ease-in-out 250ms;width:100%;min-height:60px;border-top:1px solid var(--color-gray-02);padding-top:1rem}.wrapper .modal-popup.shadow-scroller.scroll-top .modal-header{box-shadow:0px 4px 12px rgba(0, 0, 0, 0.12)}.wrapper .modal-popup.shadow-scroller.scroll-bottom .modal-footer{box-shadow:0px -8px 12px rgba(0, 0, 0, 0.12)}.wrapper.show{display:flex;align-items:flex-start}.wrapper.show .modal-popup{transform:translateY(0)}.wrapper.show .modal-popup.rounded{border-radius:var(--ptc-border-radius-standard)}.overlay{width:100vw;height:100vh;position:fixed;top:0;left:0;z-index:50010;display:block;background-color:rgba(0, 0, 0, 0.6)}:host(.standard) .modal-popup{border-radius:var(--ptc-border-radius-standard)}:host(.large) .modal-popup{border-radius:var(--ptc-border-radius-large)}:host(.pill) .modal-popup{border-radius:var(--ptc-border-radius-pill)}:host(.circle) .modal-popup{border-radius:var(--ptc-border-radius-circle)}:host(.enclose-modal) .modal-popup{max-height:calc(100vh - 180px)}:host(.enclose-modal) .modal-popup:not(.frame) .modal-body{overflow-y:auto}:host(.bio-modal) .wrapper.show{align-items:flex-start}@media only screen and (min-width: 768px){:host(.bio-modal) .wrapper.show{align-items:center}}:host(.bio-modal) .modal-popup{padding:30px 15px 30px 0;max-width:1200px;margin:20px auto 0 auto;max-height:calc(100vh - 180px);width:90%;height:100%}:host(.bio-modal) .modal-popup .modal-body{height:100%}@media only screen and (min-width: 768px){:host(.bio-modal) .modal-popup .modal-body{height:auto}}@media (max-height: 450px){:host(.bio-modal) .modal-popup .modal-body{height:100%}}@media only screen and (min-width: 768px){:host(.bio-modal) .modal-popup{max-height:none;width:80%;margin-top:0px;height:auto}}@media only screen and (min-width: 1440px){:host(.bio-modal) .modal-popup{max-width:1400px}}@media (max-height: 450px){:host(.bio-modal) .modal-popup{max-height:calc(100vh - 180px);height:100%}}:host(.bio-modal) .close{position:absolute;margin:0;right:8px;top:8px}:host(.bio-modal) .close svg .cls-1,:host(.bio-modal) .close svg .cls-2{fill:none;stroke-width:2px}:host(.bio-modal) .close svg .cls-1{stroke:#1c2439;stroke-linecap:square}:host(.bio-modal) .close svg .cls-2{stroke:#74c34d}:host(.bio-modal) .close svg path{transition:all ease-in-out 250ms}:host(.bio-modal) .close svg .cls-1:nth-child(1){transform:translate(175.5px, 135.5px)}:host(.bio-modal) .close svg .cls-1:nth-child(2){transform:translate(175.5px, 174.985px)}:host(.bio-modal) .close svg .cls-1:nth-child(3){transform:translate(215.5px, 141.393px)}:host(.bio-modal) .close svg .cls-1:nth-child(4){transform:translate(175.5px, 135.5px)}:host(.bio-modal) .close:hover svg .cls-1:nth-child(1){transform:translate(175.5px, 162px)}:host(.bio-modal) .close:hover svg .cls-1:nth-child(2){transform:translate(149px, 174.985px)}:host(.bio-modal) .close:hover svg .cls-1:nth-child(3){transform:translate(215.5px, 174px)}:host(.bio-modal) .close:hover svg .cls-1:nth-child(4){transform:translate(152.5px, 135.5px)}:host(.no-container) .wrapper .modal-popup.xl{max-width:80rem !important;background:transparent;box-shadow:none}:host(.no-container) .wrapper .modal-popup .close{display:none}:host(.video-modal) .modal-popup{margin:auto}@media (max-height: 768px){:host(.video-modal) .modal-popup.xl{max-width:56rem}}@media (max-height: 600px){:host(.video-modal) .modal-popup.xl{max-width:44rem}}@media (max-height: 500px){:host(.video-modal) .modal-popup.xl{max-width:35rem}}@media (max-height: 400px){:host(.video-modal) .modal-popup.xl{max-width:26rem}}:host(.event-listing) .wrapper .modal-popup{max-width:unset;width:calc(100% - 48px);top:50%;left:50%;transform:translate(-50%, -50%) !important;margin:0px;position:absolute}:host(.vh-center) .wrapper .modal-popup{top:50%;left:50%;transform:translate(-50%, -50%) !important;margin:0px auto;position:absolute}:host(.thank-you) .wrapper .modal-popup{max-width:calc(100% - 48px);width:100%}@media only screen and (min-width: 480px){:host(.thank-you) .wrapper .modal-popup{max-width:640px;width:80%}}:host(.thank-you) .wrapper .modal-popup .modal-body{padding:2px 24px 48px 24px;box-sizing:border-box}@media only screen and (min-width: 992px){:host(.thank-you) .wrapper .modal-popup .modal-body{padding:2px 48px 48px 48px}}:host .wrapper .event-list-header{display:flex;position:absolute;width:100%;height:118px;left:0;transform:translateY(-100%);border-radius:var(--ptc-border-radius-standard) var(--ptc-border-radius-standard) 0px 0px;align-items:center;padding:var(--ptc-element-spacing-06);box-sizing:border-box}:host .wrapper .event-list-header::before{content:\"\";position:absolute;left:0;width:100%;height:100%;border-radius:4px 4px 0px 0px;background:linear-gradient(0deg, rgba(0, 0, 0, 0.7) 0%, rgba(0, 0, 0, 0.7) 100%);z-index:1}:host .wrapper .event-list-header+.close{margin-top:0px;margin-right:0px;width:40px;height:40px;display:flex;justify-content:center;align-items:center}:host .wrapper .event-list-header .text-wrapper{display:flex;flex-wrap:wrap;column-gap:0.5em}:host .wrapper .event-list-header .text-wrapper span{display:inline-block;color:var(--color-white);font-family:var(--ptc-font-latin);font-size:var(--ptc-font-size-x-large);font-weight:var(--ptc-font-weight-medium);line-height:var(--ptc-line-height-densest);position:relative;z-index:2}:host .wrapper .event-list-header .text-wrapper span:first-of-type{font-weight:var(--ptc-font-weight-extrabold)}:host .wrapper .event-mobile-modal{border-top-left-radius:0px;border-top-right-radius:0px}:host .wrapper .bottom-close{text-align:center;margin:0 auto 40px auto}:host .wrapper .bottom-close span{cursor:pointer;color:var(--color-hyperlink);font-size:var(--ptc-font-size-small);font-weight:var(--ptc-font-weight-bold);text-decoration-line:underline;line-height:var(--ptc-line-height-densest)}:host .wrapper .bottom-close span:hover{color:var(--color-blue-08)}:host .wrapper .bottom-close:focus-visible{border-radius:var(--ptc-border-radius-standard);outline:5px solid var(--keyboard-nav-outline)}";
|
|
23330
23444
|
|
|
23331
23445
|
const PtcModal$1 = class extends HTMLElement$1 {
|
|
23332
23446
|
constructor() {
|
|
@@ -23360,15 +23474,6 @@ const PtcModal$1 = class extends HTMLElement$1 {
|
|
|
23360
23474
|
fallbackElement.focus();
|
|
23361
23475
|
}
|
|
23362
23476
|
};
|
|
23363
|
-
//change it with @Watch
|
|
23364
|
-
// componentDidUpdate() {
|
|
23365
|
-
// if (this.show) {
|
|
23366
|
-
// this.lastFocusElement = document.activeElement as HTMLElement;
|
|
23367
|
-
// this.fireOnOpened(this);
|
|
23368
|
-
// } else {
|
|
23369
|
-
// this.fireOnClosed(this);
|
|
23370
|
-
// }
|
|
23371
|
-
// }
|
|
23372
23477
|
this.handleKeyPress = (event) => {
|
|
23373
23478
|
if (event.key === 'Enter' || event.key === ' ' || event.key === 'Tab') {
|
|
23374
23479
|
this.openedByKeyboard = true;
|
|
@@ -23398,7 +23503,6 @@ const PtcModal$1 = class extends HTMLElement$1 {
|
|
|
23398
23503
|
this.headerOnlyText1 = undefined;
|
|
23399
23504
|
this.headerOnlyText2 = undefined;
|
|
23400
23505
|
this.bottomCloseBtn = undefined;
|
|
23401
|
-
this.initialFocus = true;
|
|
23402
23506
|
this.openedByKeyboard = false;
|
|
23403
23507
|
this.bodyOverflowSetting = undefined;
|
|
23404
23508
|
}
|
|
@@ -23571,12 +23675,16 @@ const PtcModal$1 = class extends HTMLElement$1 {
|
|
|
23571
23675
|
this.trap.deactivate();
|
|
23572
23676
|
}
|
|
23573
23677
|
} })));
|
|
23574
|
-
let bottomCloseBtnEle = (h$1("div", { class: "bottom-close", id: "modal-bottom-close", onClick: e => {
|
|
23678
|
+
let bottomCloseBtnEle = (h$1("div", { tabindex: "0", class: "bottom-close", id: "modal-bottom-close", onClick: e => {
|
|
23575
23679
|
e.preventDefault();
|
|
23576
23680
|
this.close();
|
|
23577
23681
|
}, onKeyPress: e => {
|
|
23578
23682
|
e.preventDefault();
|
|
23579
23683
|
this.close();
|
|
23684
|
+
this.setReturnFocus();
|
|
23685
|
+
if (this.trap) {
|
|
23686
|
+
this.trap.deactivate();
|
|
23687
|
+
}
|
|
23580
23688
|
} }, h$1("span", null, this.bottomCloseBtn)));
|
|
23581
23689
|
if (this.iframeUrl) {
|
|
23582
23690
|
content = h$1("iframe", { src: this.iframeUrl, frameBorder: 0, allowFullScreen: false, height: '100%', width: '100%', scrolling: "no", onLoad: this.resizeIframe });
|
|
@@ -34778,7 +34886,7 @@ const PtcCheckboxGroup = /*@__PURE__*/proxyCustomElement(PtcCheckboxGroup$1, [6,
|
|
|
34778
34886
|
const PtcCloseIcon = /*@__PURE__*/proxyCustomElement(PtcCloseIcon$1, [1,"ptc-close-icon"]);
|
|
34779
34887
|
const PtcCollapseList = /*@__PURE__*/proxyCustomElement(PtcCollapseList$1, [1,"ptc-collapse-list",{"showSearchBar":[4,"show-search-bar"],"header":[1],"trackerId":[1,"tracker-id"],"listItems":[1040],"placeholderText":[1025,"placeholder-text"],"debounceUpdateDelay":[1026,"debounce-update-delay"],"allowMultiSelect":[4,"allow-multi-select"],"data":[32],"searchText":[32],"selectedValue":[32],"selectedItems":[32],"hashMap":[32],"debouncedUpdatedEvent":[32],"refreshBuffer":[32]}]);
|
|
34780
34888
|
const PtcContainer = /*@__PURE__*/proxyCustomElement(PtcContainer$1, [1,"ptc-container",{"backgroundColor":[1,"background-color"],"elevation":[1],"containerType":[1,"container-type"],"spacing":[1],"styles":[1]}]);
|
|
34781
|
-
const PtcCountdown = /*@__PURE__*/proxyCustomElement(PtcCountdown$1, [1,"ptc-countdown",{"countdownTitle":[1,"countdown-title"],"eventTime":[1,"event-time"],"eventTimeZone":[1,"event-time-zone"],"expiredText":[1,"expired-text"],"timeLeft":[32],"isExpired":[32]}]);
|
|
34889
|
+
const PtcCountdown = /*@__PURE__*/proxyCustomElement(PtcCountdown$1, [1,"ptc-countdown",{"countdownTitle":[1,"countdown-title"],"eventTime":[1,"event-time"],"eventTimeZone":[1,"event-time-zone"],"expiredText":[1,"expired-text"],"daysText":[1,"days-text"],"hoursText":[1,"hours-text"],"minutesText":[1,"minutes-text"],"secondsText":[1,"seconds-text"],"useHourFormat":[4,"use-hour-format"],"timeLeft":[32],"isExpired":[32],"displayLocale":[32]}]);
|
|
34782
34890
|
const PtcDataLookup = /*@__PURE__*/proxyCustomElement(PtcDataLookup$1, [4,"ptc-data-lookup",{"elqSiteId":[1,"elq-site-id"],"elqVisitorLookupKey":[1,"elq-visitor-lookup-key"],"elqRecipientIdLookupKey":[1,"elq-recipient-id-lookup-key"],"elqContactLookupKey":[1,"elq-contact-lookup-key"],"elqSubscriptionLookupKey":[1,"elq-subscription-lookup-key"],"elqFieldEmailRecId":[1,"elq-field-email-rec-id"],"elqFieldContactEmail":[1,"elq-field-contact-email"],"elqFieldVisitorEmail":[1,"elq-field-visitor-email"],"elqFieldVisitorFirstname":[1,"elq-field-visitor-firstname"],"elqFieldVisitorLastname":[1,"elq-field-visitor-lastname"],"notmeLinkId":[1,"notme-link-id"],"notmeFieldsClass":[1,"notme-fields-class"],"notmeMessage":[1,"notme-message"],"notmeMessageNoname":[1,"notme-message-noname"],"isBlindSubmit":[4,"is-blind-submit"],"isInitialized":[32]}]);
|
|
34783
34891
|
const PtcDate = /*@__PURE__*/proxyCustomElement(PtcDate$1, [1,"ptc-date",{"year":[2],"month":[2],"day":[2],"country":[1],"dateString":[1,"date-string"],"dateColor":[1,"date-color"],"dateStyles":[1,"date-styles"],"dataSize":[1,"data-size"],"formatOptions":[1,"format-options"]}]);
|
|
34784
34892
|
const PtcDropdown = /*@__PURE__*/proxyCustomElement(PtcDropdown$1, [1,"ptc-dropdown",{"theme":[1],"label":[1],"listItems":[16],"trackerId":[1,"tracker-id"],"toggle":[32],"selectedItem":[32]},[[4,"click","offClick"]]]);
|
|
@@ -34812,7 +34920,7 @@ const PtcList = /*@__PURE__*/proxyCustomElement(PtcList$1, [1,"ptc-list",{"listT
|
|
|
34812
34920
|
const PtcMediaCard = /*@__PURE__*/proxyCustomElement(PtcMediaCard$1, [1,"ptc-media-card",{"cardType":[1,"card-type"],"cardHref":[1,"card-href"],"target":[1],"rel":[1],"activeBackgroundImage":[1025,"active-background-image"],"activeBackgroundImageAlt":[1025,"active-background-image-alt"],"hoverBackgroundImage":[1025,"hover-background-image"],"heading":[1025],"headingTransform":[1025,"heading-transform"],"category":[1025],"ariaLabel":[1,"aria-label"],"iconImage":[1025,"icon-image"],"iconImageAlt":[1025,"icon-image-alt"],"trackerId":[1,"tracker-id"],"isHovered":[32],"isTabNavigated":[32]}]);
|
|
34813
34921
|
const PtcMinimizedNav = /*@__PURE__*/proxyCustomElement(PtcMinimizedNav$1, [1,"ptc-minimized-nav",{"linkUrl":[513,"link-url"],"imgSrc":[513,"img-src"],"imgAlt":[513,"img-alt"],"navType":[1,"nav-type"],"trackerId":[1,"tracker-id"]}]);
|
|
34814
34922
|
const PtcMobileSelect = /*@__PURE__*/proxyCustomElement(PtcMobileSelect$1, [0,"ptc-mobile-select",{"triggerName":[1,"trigger-name"],"selectedText":[1,"selected-text"],"wheelData":[1040],"selectedId":[1,"selected-id"],"ensureBtnText":[1,"ensure-btn-text"],"cancelBtnText":[1,"cancel-btn-text"],"listTitle":[1,"list-title"],"notFoundPopupProceedButton":[8,"not-found-popup-proceed-button"]}]);
|
|
34815
|
-
const PtcModal = /*@__PURE__*/proxyCustomElement(PtcModal$1, [1,"ptc-modal",{"iframeUrl":[1025,"iframe-url"],"size":[1025],"customClass":[1025,"custom-class"],"show":[1028],"overlay":[1028],"fixed":[1028],"keepInViewport":[1028,"keep-in-viewport"],"closeOnBlur":[1028,"close-on-blur"],"rounded":[1028],"hideContainer":[1028,"hide-container"],"showHeaderFooter":[1028,"show-header-footer"],"borderRadius":[1025,"border-radius"],"isBioModal":[1028,"is-bio-modal"],"styles":[1],"modalType":[1,"modal-type"],"vhCenter":[4,"vh-center"],"headerOnlyBg":[1,"header-only-bg"],"headerOnlyText1":[1,"header-only-text-1"],"headerOnlyText2":[1,"header-only-text-2"],"bottomCloseBtn":[1,"bottom-close-btn"],"
|
|
34923
|
+
const PtcModal = /*@__PURE__*/proxyCustomElement(PtcModal$1, [1,"ptc-modal",{"iframeUrl":[1025,"iframe-url"],"size":[1025],"customClass":[1025,"custom-class"],"show":[1028],"overlay":[1028],"fixed":[1028],"keepInViewport":[1028,"keep-in-viewport"],"closeOnBlur":[1028,"close-on-blur"],"rounded":[1028],"hideContainer":[1028,"hide-container"],"showHeaderFooter":[1028,"show-header-footer"],"borderRadius":[1025,"border-radius"],"isBioModal":[1028,"is-bio-modal"],"styles":[1],"modalType":[1,"modal-type"],"vhCenter":[4,"vh-center"],"headerOnlyBg":[1,"header-only-bg"],"headerOnlyText1":[1,"header-only-text-1"],"headerOnlyText2":[1,"header-only-text-2"],"bottomCloseBtn":[1,"bottom-close-btn"],"overlayHeight":[32],"openedByKeyboard":[32],"bodyOverflowSetting":[32]}]);
|
|
34816
34924
|
const PtcModalQuiz = /*@__PURE__*/proxyCustomElement(PtcModalQuiz$1, [1,"ptc-modal-quiz",{"totalQuestions":[2,"total-questions"],"modalId":[1,"modal-id"],"currentQuestion":[32],"currentSelectedPriority":[32],"selectedPriorityRadio":[32],"answers":[32],"traversal":[32]}]);
|
|
34817
34925
|
const PtcMultiSelect = /*@__PURE__*/proxyCustomElement(PtcMultiSelect$1, [0,"ptc-multi-select",{"items":[1040],"label":[1],"selectAllText":[1,"select-all-text"],"clearAllText":[1,"clear-all-text"],"isRequired":[4,"is-required"],"helpertext":[1],"placeholderText":[1,"placeholder-text"],"showDropdown":[32],"language":[32],"isValid":[32],"selectedItemsCount":[32],"hasInteracted":[32],"tooltipText":[32],"tooltipVisible":[32],"tooltipPosition":[32],"focusedItemIndex":[32]},[[4,"click","handleDocumentClick"]]]);
|
|
34818
34926
|
const PtcNavCard = /*@__PURE__*/proxyCustomElement(PtcNavCard$1, [1,"ptc-nav-card",{"cardType":[1025,"card-type"],"cardHref":[1025,"card-href"],"logoAlt":[1025,"logo-alt"],"target":[1025],"rel":[1025],"linkTitle":[1025,"link-title"],"cardLogo":[1025,"card-logo"],"heading":[1025],"description":[1025],"trackerId":[1,"tracker-id"],"windowSize":[32]},[[9,"resize","handleResize"]]]);
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { r as registerInstance, h, g as getElement } from './index-c83db688.js';
|
|
2
2
|
import { c as createFocusTrap } from './focus-trap.esm-d205300d.js';
|
|
3
3
|
|
|
4
|
-
const eventJumbotronExampleCss = "h1.sc-event-jumbotron-example,h2.sc-event-jumbotron-example,h3.sc-event-jumbotron-example,h4.sc-event-jumbotron-example,h5.sc-event-jumbotron-example,h6.sc-event-jumbotron-example,p.sc-event-jumbotron-example,ul.sc-event-jumbotron-example,li.sc-event-jumbotron-example,ptc-subnav.sc-event-jumbotron-example,ptc-tab-list.sc-event-jumbotron-example,ptc-link.sc-event-jumbotron-example,ptc-square-card.sc-event-jumbotron-example,.hyphenate-text.sc-event-jumbotron-example,ptc-footer.sc-event-jumbotron-example{word-break:break-word;hyphens:manual;-webkit-hyphens:manual;-moz-hyphens:manual;-ms-hyphens:manual}@supports (hyphenate-limit-chars: 12 3 3){h1.sc-event-jumbotron-example,h2.sc-event-jumbotron-example,h3.sc-event-jumbotron-example,h4.sc-event-jumbotron-example,h5.sc-event-jumbotron-example,h6.sc-event-jumbotron-example,p.sc-event-jumbotron-example,ul.sc-event-jumbotron-example,li.sc-event-jumbotron-example,ptc-subnav.sc-event-jumbotron-example,ptc-tab-list.sc-event-jumbotron-example,ptc-link.sc-event-jumbotron-example,ptc-square-card.sc-event-jumbotron-example,.hyphenate-text.sc-event-jumbotron-example,ptc-footer.sc-event-jumbotron-example{hyphens:auto;-webkit-hyphenate-limit-before:3;-webkit-hyphenate-limit-after:3;hyphenate-limit-chars:12 3 3;hyphenate-limit-lines:2;hyphenate-limit-last:always;hyphenate-limit-zone:6%;-webkit-hyphens:auto;-webkit-hyphenate-limit-before:3;-webkit-hyphenate-limit-after:3;-webkit-hyphenate-limit-chars:12 3 3;-webkit-hyphenate-limit-lines:2;-moz-hyphens:auto;-moz-hyphenate-limit-chars:12 3 3;-moz-hyphenate-limit-lines:2;-ms-hyphens:auto;-ms-hyphenate-limit-chars:12 3 3;-ms-hyphenate-limit-lines:2}}.sc-event-jumbotron-example-h{display:block;position:relative}.event-jumbotron.sc-event-jumbotron-example{margin-bottom:3rem;width:100%}.white-placeholder.sc-event-jumbotron-example{position:absolute;height:130px;width:100%;background-color:#F3f3f3;bottom:0px}.jumbotron-cards-wrapper.sc-event-jumbotron-example{z-index:1;position:relative;display:flex;flex-direction:column}.jumbotron-cards.sc-event-jumbotron-example{display:flex;gap:24px;overflow-x:auto;padding:
|
|
4
|
+
const eventJumbotronExampleCss = "h1.sc-event-jumbotron-example,h2.sc-event-jumbotron-example,h3.sc-event-jumbotron-example,h4.sc-event-jumbotron-example,h5.sc-event-jumbotron-example,h6.sc-event-jumbotron-example,p.sc-event-jumbotron-example,ul.sc-event-jumbotron-example,li.sc-event-jumbotron-example,ptc-subnav.sc-event-jumbotron-example,ptc-tab-list.sc-event-jumbotron-example,ptc-link.sc-event-jumbotron-example,ptc-square-card.sc-event-jumbotron-example,.hyphenate-text.sc-event-jumbotron-example,ptc-footer.sc-event-jumbotron-example{word-break:break-word;hyphens:manual;-webkit-hyphens:manual;-moz-hyphens:manual;-ms-hyphens:manual}@supports (hyphenate-limit-chars: 12 3 3){h1.sc-event-jumbotron-example,h2.sc-event-jumbotron-example,h3.sc-event-jumbotron-example,h4.sc-event-jumbotron-example,h5.sc-event-jumbotron-example,h6.sc-event-jumbotron-example,p.sc-event-jumbotron-example,ul.sc-event-jumbotron-example,li.sc-event-jumbotron-example,ptc-subnav.sc-event-jumbotron-example,ptc-tab-list.sc-event-jumbotron-example,ptc-link.sc-event-jumbotron-example,ptc-square-card.sc-event-jumbotron-example,.hyphenate-text.sc-event-jumbotron-example,ptc-footer.sc-event-jumbotron-example{hyphens:auto;-webkit-hyphenate-limit-before:3;-webkit-hyphenate-limit-after:3;hyphenate-limit-chars:12 3 3;hyphenate-limit-lines:2;hyphenate-limit-last:always;hyphenate-limit-zone:6%;-webkit-hyphens:auto;-webkit-hyphenate-limit-before:3;-webkit-hyphenate-limit-after:3;-webkit-hyphenate-limit-chars:12 3 3;-webkit-hyphenate-limit-lines:2;-moz-hyphens:auto;-moz-hyphenate-limit-chars:12 3 3;-moz-hyphenate-limit-lines:2;-ms-hyphens:auto;-ms-hyphenate-limit-chars:12 3 3;-ms-hyphenate-limit-lines:2}}.sc-event-jumbotron-example-h{display:block;position:relative}.event-jumbotron.sc-event-jumbotron-example{margin-bottom:calc(3rem - 5px);width:100%}@media only screen and (min-width: 992px){.event-jumbotron.sc-event-jumbotron-example{margin-bottom:3rem}}.white-placeholder.sc-event-jumbotron-example{position:absolute;height:130px;width:100%;background-color:#F3f3f3;bottom:0px}.jumbotron-cards-wrapper.sc-event-jumbotron-example{z-index:1;position:relative;display:flex;flex-direction:column}.jumbotron-cards.sc-event-jumbotron-example{display:flex;gap:24px;overflow-x:auto;padding:5px 24px;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;cursor:grab}.jumbotron-cards.sc-event-jumbotron-example::-webkit-scrollbar{display:none}.jumbotron-cards.dragging.sc-event-jumbotron-example{cursor:grabbing}.card.sc-event-jumbotron-example{flex:1 0 auto;width:250px;height:414px;background:transparent;border-radius:var(--ptc-border-radius-standard);display:flex;justify-content:center;align-items:center;text-align:center;flex-direction:column;padding:24px;position:relative}.card.sc-event-jumbotron-example::after{content:\"\";position:absolute;top:0;left:0;bottom:0;right:0;box-shadow:0 2px 8px rgba(0, 0, 0, 0.1);z-index:-1;border-radius:var(--ptc-border-radius-standard)}.card.sc-event-jumbotron-example:focus-visible{border-radius:var(--ptc-border-radius-standard);outline:5px solid var(--keyboard-nav-outline)}.card.sc-event-jumbotron-example ptc-img.sc-event-jumbotron-example::after{content:\"\";top:0px;left:0px;position:absolute;width:100%;height:100%;border-radius:var(--ptc-border-radius-standard);background:linear-gradient(0deg, black 0%, black 100%);opacity:0.7;transition:opacity var(--ptc-transition-slow) ease-in-out;border:none;outline:1px solid rgba(255, 255, 255, 0.1);outline-offset:-1px}.card.sc-event-jumbotron-example:hover ptc-img.sc-event-jumbotron-example::after{opacity:0.8}.card.sc-event-jumbotron-example:focus ptc-img.sc-event-jumbotron-example::after,.card.sc-event-jumbotron-example:active ptc-img.sc-event-jumbotron-example::after{opacity:0.85}.text-wrapper.sc-event-jumbotron-example{align-self:flex-start;text-align:left}.card-title.sc-event-jumbotron-example{color:var(--color-white);font-family:var(--ptc-font-latin);font-size:var(--ptc-font-size-x-large);font-weight:var(--ptc-font-weight-extrabold);line-height:var(--ptc-line-height-densest);position:relative;z-index:2;margin-top:0;margin-bottom:var(--ptc-element-spacing-06)}.card-title.sc-event-jumbotron-example span.sc-event-jumbotron-example{font-weight:var(--ptc-font-weight-medium);display:inline-block}.cta-all.sc-event-jumbotron-example{margin-right:var(--ptc-element-spacing-05)}.panel.sc-event-jumbotron-example{display:none;visibility:hidden}@media only screen and (min-width: 768px){.card-title.sc-event-jumbotron-example{font-size:var(--ptc-font-size-xx-large)}.card-title.sc-event-jumbotron-example span.sc-event-jumbotron-example{font-size:var(--ptc-font-size-xx-large)}}@media only screen and (min-width: 992px){.card-title.sc-event-jumbotron-example{font-size:var(--ptc-font-size-x-large)}.card-title.sc-event-jumbotron-example span.sc-event-jumbotron-example{font-size:var(--ptc-font-size-x-large)}.cta-group.sc-event-jumbotron-example{margin-bottom:88px}.jumbotron-cards.sc-event-jumbotron-example{overflow-x:visible;justify-content:space-between;cursor:auto;transition:transform 0.3s ease-in-out;width:100%;padding:0px}.card.sc-event-jumbotron-example{width:auto;height:530px;padding:var(--ptc-element-spacing-06);cursor:pointer;flex:1}.card.hidden.sc-event-jumbotron-example{opacity:0;pointer-events:none}.card.active.sc-event-jumbotron-example{min-height:530px;border-top-right-radius:0px;border-bottom-right-radius:0px;box-shadow:var(--ptc-shadow-x-large);height:auto}.card.active.sc-event-jumbotron-example ptc-img.sc-event-jumbotron-example::after{border-top-right-radius:0px;border-bottom-right-radius:0px}.card.active.sc-event-jumbotron-example:hover ptc-img.sc-event-jumbotron-example::after{opacity:0.7}.card.active.sc-event-jumbotron-example:focus ptc-img.sc-event-jumbotron-example::after,.card.active.sc-event-jumbotron-example:active ptc-img.sc-event-jumbotron-example::after{opacity:0.7}.panel.sc-event-jumbotron-example{visibility:hidden;opacity:0;position:absolute;top:0;left:0;min-height:530px;padding:40px;background:var(--color-white);border-radius:var(--ptc-border-radius-standard);box-shadow:0 2px 8px rgba(0, 0, 0, 0.1);transition:opacity 0.3s ease-in-out, transform 0.3s ease-in-out;z-index:10}.panel.visible.sc-event-jumbotron-example{visibility:visible;opacity:1;border-top-left-radius:0px;border-bottom-left-radius:0px;box-shadow:var(--ptc-shadow-x-large);height:auto}.close-panel.sc-event-jumbotron-example{position:absolute;top:0px;right:0px;background:var(--color-white);border:none;text-align:center;cursor:pointer;padding:0px;margin:5px}.hide-scrollbar.sc-event-jumbotron-example{margin-left:-40px;margin-right:-40px}}@media only screen and (min-width: 1200px){.card-title.sc-event-jumbotron-example{font-size:var(--ptc-font-size-xx-large)}.card-title.sc-event-jumbotron-example span.sc-event-jumbotron-example{font-size:var(--ptc-font-size-xx-large)}.jumbotron-cards.sc-event-jumbotron-example{padding:0;gap:32px}}@media only screen and (min-width: 1440px){.jumbotron-cards.sc-event-jumbotron-example{gap:40px}}";
|
|
5
5
|
|
|
6
6
|
const EventJumbotronExample = class {
|
|
7
7
|
constructor(hostRef) {
|
|
@@ -79,6 +79,7 @@ const EventJumbotronExample = class {
|
|
|
79
79
|
},
|
|
80
80
|
});
|
|
81
81
|
this.trap.activate();
|
|
82
|
+
this.setupTabNavigation(panel); //set up special navigation to no-content panel, skip tabindex=-1 container and focus on the A inside a shdow dom.
|
|
82
83
|
}, 500);
|
|
83
84
|
}
|
|
84
85
|
else {
|
|
@@ -90,11 +91,43 @@ const EventJumbotronExample = class {
|
|
|
90
91
|
else if (!this.isDesktop) {
|
|
91
92
|
if (!this.isDragging) {
|
|
92
93
|
const modal = document.getElementById(`modal-${cardIndex}`);
|
|
93
|
-
console.log('open: ' + modal.id);
|
|
94
|
+
// console.log('open: ' + modal.id);
|
|
94
95
|
modal.show = true;
|
|
95
96
|
}
|
|
96
97
|
}
|
|
97
98
|
}
|
|
99
|
+
//Focus the ptc-button directly in the no content panel (tab navigation).
|
|
100
|
+
setupTabNavigation(panel) {
|
|
101
|
+
var _a;
|
|
102
|
+
if (panel.querySelector('.no-content-card')) {
|
|
103
|
+
const shadowButton = panel.querySelector('ptc-close-icon');
|
|
104
|
+
const closeButton = (_a = shadowButton.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('.close-icon');
|
|
105
|
+
if (closeButton) {
|
|
106
|
+
closeButton.addEventListener('keydown', (event) => {
|
|
107
|
+
if (event.key === 'Tab' && !event.shiftKey) {
|
|
108
|
+
event.preventDefault();
|
|
109
|
+
this.focusShadowDomElement(panel);
|
|
110
|
+
}
|
|
111
|
+
});
|
|
112
|
+
}
|
|
113
|
+
}
|
|
114
|
+
else {
|
|
115
|
+
return;
|
|
116
|
+
}
|
|
117
|
+
}
|
|
118
|
+
focusShadowDomElement(panel) {
|
|
119
|
+
const card = panel.querySelector('.no-content-card');
|
|
120
|
+
if (card) {
|
|
121
|
+
const button = card.querySelector('ptc-button');
|
|
122
|
+
// console.log('button: ' + button.innerHTML);
|
|
123
|
+
if (button) {
|
|
124
|
+
const link = button.shadowRoot.querySelector('a');
|
|
125
|
+
if (link) {
|
|
126
|
+
link.focus();
|
|
127
|
+
}
|
|
128
|
+
}
|
|
129
|
+
}
|
|
130
|
+
}
|
|
98
131
|
showPanel(card, panel) {
|
|
99
132
|
if (this.activePanel)
|
|
100
133
|
return;
|
|
@@ -163,7 +196,7 @@ const EventJumbotronExample = class {
|
|
|
163
196
|
document.addEventListener('keydown', event => {
|
|
164
197
|
if (event.key === 'Tab' || event.key === 'Enter' || event.key === ' ') {
|
|
165
198
|
this.openedWithKeyboard = true;
|
|
166
|
-
console.log('keyboard status: ' + this.openedWithKeyboard);
|
|
199
|
+
// console.log('keyboard status: ' + this.openedWithKeyboard);
|
|
167
200
|
}
|
|
168
201
|
});
|
|
169
202
|
document.addEventListener('mousedown', () => {
|