@ptcwebops/ptcw-design 0.6.0 → 0.6.2
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/list-item.cjs.entry.js +1 -0
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/my-component.cjs.entry.js +2 -5
- package/dist/cjs/ptc-card_6.cjs.entry.js +479 -0
- package/dist/cjs/ptc-checkbox.cjs.entry.js +1 -1
- package/dist/cjs/ptc-collapse-list.cjs.entry.js +202 -0
- package/dist/cjs/ptc-list.cjs.entry.js +30 -3
- package/dist/cjs/ptc-overlay.cjs.entry.js +31 -0
- package/dist/cjs/ptc-picture.cjs.entry.js +1 -1
- package/dist/cjs/ptc-title.cjs.entry.js +1 -1
- package/dist/cjs/ptcw-design.cjs.js +1 -1
- package/dist/cjs/utils-dc2c222f.js +71 -0
- package/dist/collection/collection-manifest.json +1 -0
- package/dist/collection/components/icon-asset/media/designer.svg +28 -18
- package/dist/collection/components/list-item/list-item.js +1 -0
- package/dist/collection/components/ptc-card/ptc-card.css +144 -6
- package/dist/collection/components/ptc-card/ptc-card.js +4 -4
- package/dist/collection/components/ptc-checkbox/ptc-checkbox.js +1 -1
- package/dist/collection/components/ptc-collapse-list/ptc-collapse-list.css +121 -0
- package/dist/collection/components/ptc-collapse-list/ptc-collapse-list.js +288 -0
- package/dist/collection/components/ptc-list/ptc-list.js +31 -4
- package/dist/collection/components/ptc-picture/ptc-picture.css +3 -0
- package/dist/collection/components/ptc-title/ptc-title.css +1 -1
- package/dist/collection/utils/utils.js +62 -0
- package/dist/custom-elements/index.d.ts +6 -0
- package/dist/custom-elements/index.js +300 -12
- package/dist/esm/{interfaces-c1c73092.js → interfaces-3cb94654.js} +1 -1
- package/dist/esm/list-item.entry.js +1 -0
- package/dist/esm/loader.js +1 -1
- package/dist/esm/my-component.entry.js +1 -4
- package/dist/esm/ptc-card_6.entry.js +470 -0
- package/dist/esm/ptc-checkbox.entry.js +1 -1
- package/dist/esm/ptc-collapse-list.entry.js +198 -0
- package/dist/esm/ptc-list.entry.js +31 -4
- package/dist/esm/ptc-overlay.entry.js +27 -0
- package/dist/esm/ptc-picture.entry.js +2 -2
- package/dist/esm/ptc-title.entry.js +1 -1
- package/dist/esm/ptcw-design.js +1 -1
- package/dist/esm/utils-334d53bc.js +67 -0
- package/dist/ptcw-design/media/designer.svg +28 -18
- package/dist/ptcw-design/p-07c07cf9.entry.js +1 -0
- package/dist/ptcw-design/{p-50e52c88.js → p-240733ce.js} +1 -1
- package/dist/ptcw-design/p-2e496d31.js +1 -0
- package/dist/ptcw-design/p-3a972520.entry.js +1 -0
- package/dist/ptcw-design/p-3d3c73b1.entry.js +1 -0
- package/dist/ptcw-design/{p-3a41081a.entry.js → p-44cb62a9.entry.js} +1 -1
- package/dist/ptcw-design/p-46cf7f48.entry.js +1 -0
- package/dist/ptcw-design/{p-9b442487.entry.js → p-818df883.entry.js} +1 -1
- package/dist/ptcw-design/p-b146377a.entry.js +1 -0
- package/dist/ptcw-design/p-d8b48946.entry.js +1 -0
- package/dist/ptcw-design/p-e5bfbb91.entry.js +1 -0
- package/dist/ptcw-design/ptcw-design.css +1 -1
- package/dist/ptcw-design/ptcw-design.esm.js +1 -1
- package/dist/types/components/ptc-card/ptc-card.d.ts +1 -1
- package/dist/types/components/ptc-collapse-list/ptc-collapse-list.d.ts +39 -0
- package/dist/types/components/ptc-list/ptc-list.d.ts +2 -0
- package/dist/types/components.d.ts +21 -2
- package/dist/types/utils/utils.d.ts +2 -0
- package/package.json +1 -1
- package/readme.md +1 -1
- package/dist/cjs/ptc-card.cjs.entry.js +0 -79
- package/dist/cjs/ptc-date.cjs.entry.js +0 -59
- package/dist/cjs/ptc-img_2.cjs.entry.js +0 -185
- package/dist/cjs/ptc-pagenation.cjs.entry.js +0 -115
- package/dist/cjs/ptc-para.cjs.entry.js +0 -50
- package/dist/cjs/ptc-spacer.cjs.entry.js +0 -46
- package/dist/esm/ptc-card.entry.js +0 -75
- package/dist/esm/ptc-date.entry.js +0 -55
- package/dist/esm/ptc-img_2.entry.js +0 -180
- package/dist/esm/ptc-pagenation.entry.js +0 -111
- package/dist/esm/ptc-para.entry.js +0 -46
- package/dist/esm/ptc-spacer.entry.js +0 -42
- package/dist/ptcw-design/p-1cfc77eb.entry.js +0 -1
- package/dist/ptcw-design/p-42df89de.entry.js +0 -1
- package/dist/ptcw-design/p-51c39418.entry.js +0 -1
- package/dist/ptcw-design/p-679b99ad.entry.js +0 -1
- package/dist/ptcw-design/p-7bcc42e1.entry.js +0 -1
- package/dist/ptcw-design/p-8e27bb6d.entry.js +0 -1
- package/dist/ptcw-design/p-969c178b.entry.js +0 -1
- package/dist/ptcw-design/p-df80470b.entry.js +0 -1
- package/dist/ptcw-design/p-ec10f846.entry.js +0 -1
- package/dist/ptcw-design/p-fa53e5e5.entry.js +0 -1
|
@@ -15,6 +15,7 @@ let ListItem = class {
|
|
|
15
15
|
this.linkTarget = '_self';
|
|
16
16
|
}
|
|
17
17
|
render() {
|
|
18
|
+
console.log(this.listType);
|
|
18
19
|
const classMap = this.getCssClassMap();
|
|
19
20
|
return (index.h(index.Host, { class: classMap }, index.h("li", null, this.linkHref ? (index.h("a", Object.assign({ class: "item-link", target: this.linkTarget }, (this.linkHref ? { href: this.linkHref } : {})), index.h("slot", null))) : (index.h("slot", null)))));
|
|
20
21
|
}
|
package/dist/cjs/loader.cjs.js
CHANGED
|
@@ -14,7 +14,7 @@ const patchEsm = () => {
|
|
|
14
14
|
const defineCustomElements = (win, options) => {
|
|
15
15
|
if (typeof window === 'undefined') return Promise.resolve();
|
|
16
16
|
return patchEsm().then(() => {
|
|
17
|
-
return index.bootstrapLazy([["ptc-tab-list.cjs",[[4,"ptc-tab-list",null,[[0,"tabClicked","onSelectedTab"],[9,"resize","calculateHeaderTabsRendering"]]]]],["ptc-breadcrumb.cjs",[[1,"ptc-breadcrumb"]]],["ptc-hero.cjs",[[1,"ptc-hero",{"heroType":[1,"hero-type"],"bgUrl":[1,"bg-url"]}]]],["ptc-previous-url.cjs",[[1,"ptc-previous-url",{"href":[1],"text":[1]}]]],["ptc-announcement.cjs",[[1,"ptc-announcement",{"barTitle":[1,"bar-title"],"Description":[1,"description"],"linkText":[513,"link-text"],"linkTitle":[513,"link-title"],"visible":[1540],"linkUrl":[513,"link-url"],"tempContainer":[4,"temp-container"],"target":[1]}]]],["ptc-
|
|
17
|
+
return index.bootstrapLazy([["ptc-tab-list.cjs",[[4,"ptc-tab-list",null,[[0,"tabClicked","onSelectedTab"],[9,"resize","calculateHeaderTabsRendering"]]]]],["ptc-breadcrumb.cjs",[[1,"ptc-breadcrumb"]]],["ptc-collapse-list.cjs",[[1,"ptc-collapse-list",{"listItems":[1040],"data":[32],"selectedItems":[32],"hashMap":[32]}]]],["ptc-hero.cjs",[[1,"ptc-hero",{"heroType":[1,"hero-type"],"bgUrl":[1,"bg-url"]}]]],["ptc-previous-url.cjs",[[1,"ptc-previous-url",{"href":[1],"text":[1]}]]],["ptc-announcement.cjs",[[1,"ptc-announcement",{"barTitle":[1,"bar-title"],"Description":[1,"description"],"linkText":[513,"link-text"],"linkTitle":[513,"link-title"],"visible":[1540],"linkUrl":[513,"link-url"],"tempContainer":[4,"temp-container"],"target":[1]}]]],["ptc-checkbox.cjs",[[1,"ptc-checkbox",{"checked":[1025],"value":[1025],"inputName":[1,"input-name"]}]]],["ptc-dropdown.cjs",[[1,"ptc-dropdown",{"theme":[1],"label":[1],"listItems":[16],"toggle":[32],"selectedItem":[32]}]]],["ptc-icon-minimize.cjs",[[1,"ptc-icon-minimize",{"heading":[1025],"opened":[1028]}]]],["ptc-link.cjs",[[1,"ptc-link",{"disabled":[516],"external":[516],"href":[1],"target":[1],"linkTitle":[1,"link-title"],"theme":[1],"uppercase":[4],"fontSize":[1,"font-size"]}]]],["ptc-list.cjs",[[1,"ptc-list",{"listType":[1,"list-type"],"listItems":[16]}]]],["ptc-lottie.cjs",[[1,"ptc-lottie",{"jsonSrc":[1025,"json-src"],"speed":[1026]}]]],["ptc-mobile-select.cjs",[[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"],"linkUrl":[1025,"link-url"]}]]],["ptc-quote.cjs",[[1,"ptc-quote",{"quoteType":[1025,"quote-type"],"quoteName":[1025,"quote-name"],"ctaText":[1,"cta-text"],"ctaUrl":[1,"cta-url"],"imgSrc":[1,"img-src"],"imgTitle":[1,"img-title"]}]]],["ptc-social-share.cjs",[[1,"ptc-social-share",{"display":[1],"shareType":[1,"share-type"],"shareTitle":[1,"share-title"],"text":[1],"url":[1],"source":[1],"recipient":[1],"isHover":[32]}]]],["my-component.cjs",[[1,"my-component",{"first":[1],"middle":[1],"last":[1]}]]],["ptc-accordion.cjs",[[1,"ptc-accordion",{"multiple":[4]},[[0,"opened","openHandler"]]]]],["ptc-accordion-item.cjs",[[1,"ptc-accordion-item",{"heading":[1],"headingTag":[1,"heading-tag"],"autoHeight":[4,"auto-height"],"active":[1540],"hasHeadingSlot":[32],"hasArrowSlot":[32],"toggle":[64],"close":[64],"open":[64]}]]],["ptc-card-bottom.cjs",[[1,"ptc-card-bottom",{"cardType":[1,"card-type"],"styles":[1]}]]],["ptc-card-content.cjs",[[1,"ptc-card-content",{"cardType":[1,"card-type"],"styles":[1]}]]],["ptc-card-plm.cjs",[[1,"ptc-card-plm",{"cardType":[1,"card-type"],"cardLink":[1,"card-link"],"linkTitle":[1,"link-title"],"linkTarget":[1,"link-target"]}]]],["ptc-container.cjs",[[1,"ptc-container",{"backgroundColor":[1,"background-color"],"elevation":[1],"containerType":[1,"container-type"],"spacing":[1]}]]],["ptc-filter-tag.cjs",[[1,"ptc-filter-tag",{"theme":[1]}]]],["ptc-hero-footer-cta.cjs",[[6,"ptc-hero-footer-cta",{"ctaTitle":[1,"cta-title"],"description":[1],"backgroundImage":[1,"background-image"]}]]],["ptc-icon-list.cjs",[[1,"ptc-icon-list",{"listType":[1,"list-type"],"valueWithUnit":[1,"value-with-unit"],"valueText":[1,"value-text"],"listContent":[1,"list-content"],"isLastItem":[4,"is-last-item"]}]]],["ptc-minimized-footer.cjs",[[1,"ptc-minimized-footer"]]],["ptc-minimized-header.cjs",[[1,"ptc-minimized-header",{"linkUrl":[513,"link-url"],"imgSrc":[513,"img-src"],"imgAlt":[513,"img-alt"]}]]],["ptc-modal.cjs",[[1,"ptc-modal",{"iframeUrl":[1025,"iframe-url"],"size":[1025],"show":[1028],"overlay":[1028],"closeOnBlur":[1028,"close-on-blur"],"rounded":[1028],"showHeaderFooter":[1028,"show-header-footer"],"overlayHeight":[32],"bodyOverflowSetting":[32]}]]],["ptc-nav.cjs",[[1,"ptc-nav"]]],["ptc-nav-item.cjs",[[1,"ptc-nav-item",{"url":[1025],"label":[1025],"ariaExpanded":[1028,"aria-expanded"],"depth":[1538],"hasChildren":[1028,"has-children"],"parentExpanded":[1540,"parent-expanded"],"navType":[1,"nav-type"]},[[0,"handleClick","handleClick"],[9,"resize","handleResize"]]]]],["ptc-picture.cjs",[[1,"ptc-picture",{"src":[1],"alt":[1],"sizeXs":[1025,"size-xs"],"sizeSm":[1025,"size-sm"],"sizeMd":[1025,"size-md"],"sizeLg":[1025,"size-lg"],"imagePosition":[1,"image-position"],"borderRadius":[1,"border-radius"],"height":[1],"width":[1],"objectFit":[1,"object-fit"],"isFullHeight":[4,"is-full-height"],"isFullWidth":[4,"is-full-width"],"styles":[1],"imageAlignment":[1,"image-alignment"],"maxWidth":[1,"max-width"],"oldSrc":[32]},[[9,"resize","WindowResize"]]]]],["ptc-pricing-block.cjs",[[1,"ptc-pricing-block"]]],["ptc-responsive-wrapper.cjs",[[1,"ptc-responsive-wrapper"]]],["ptc-shopping-cart.cjs",[[1,"ptc-shopping-cart",{"cartCount":[1,"cart-count"],"color":[1]}]]],["ptc-span.cjs",[[1,"ptc-span",{"spanStyle":[1,"span-style"],"display":[1],"styles":[1]}]]],["ptc-two-column-media.cjs",[[1,"ptc-two-column-media",{"componentType":[1,"component-type"]}]]],["tab-content.cjs",[[4,"tab-content",{"name":[1],"isSelected":[32],"getChild":[64]}]]],["tab-header.cjs",[[1,"tab-header",{"name":[1],"isSelected":[32],"getChild":[64]}]]],["ptc-ellipsis-dropdown.cjs",[[1,"ptc-ellipsis-dropdown",{"dataItems":[16],"isDropdownOpen":[32]}]]],["lottie-player.cjs",[[1,"lottie-player",{"mode":[1],"autoplay":[4],"background":[513],"controls":[4],"count":[2],"direction":[2],"hover":[4],"loop":[516],"renderer":[1],"speed":[2],"src":[1],"currentState":[1,"current-state"],"seeker":[8],"intermission":[2],"play":[64],"pause":[64],"stop":[64],"seek":[64],"getLottie":[64],"setSpeed":[64],"setDirection":[64],"setLooping":[64],"togglePlay":[64],"toggleLooping":[64]}]]],["ptc-button.cjs",[[1,"ptc-button",{"disabled":[516],"type":[1],"color":[1],"iconAnimation":[1,"icon-animation"],"iconPosition":[1,"icon-position"],"linkHref":[1,"link-href"],"linkTitle":[1,"link-title"],"target":[1],"rel":[1],"tabNav":[2,"tab-nav"],"styles":[1]}]]],["ptc-overlay.cjs",[[1,"ptc-overlay",{"filterColor":[1,"filter-color"],"borderRadius":[1,"border-radius"],"overlayZIndex":[1,"overlay-z-index"],"styles":[1]}]]],["ptc-title.cjs",[[6,"ptc-title",{"isPlmHub":[4,"is-plm-hub"],"type":[1],"textAlign":[1,"text-align"],"upperline":[1],"titleShadow":[1,"title-shadow"],"titleMargin":[1,"title-margin"],"titleWeight":[1,"title-weight"],"titleSize":[1,"title-size"],"titleHeight":[1,"title-height"],"styles":[1]}]]],["ptc-card_6.cjs",[[1,"ptc-card",{"cardType":[1,"card-type"],"cardHref":[1,"card-href"],"target":[1],"rel":[1],"hasImage":[4,"has-image"],"hasVideo":[4,"has-video"],"hasLottie":[4,"has-lottie"],"heading":[1],"headingTransform":[1,"heading-transform"],"cardDate":[1,"card-date"],"styles":[1],"ribbonText":[1,"ribbon-text"]}],[1,"ptc-pagenation",{"totalCount":[2,"total-count"],"numberOfItems":[2,"number-of-items"],"previousValue":[1,"previous-value"],"lastValue":[1,"last-value"],"minPageNumber":[2,"min-page-number"],"maxPageNumber":[2,"max-page-number"],"clickedPageNumber":[2,"clicked-page-number"],"appendArray":[4,"append-array"],"prevArrowImg":[1,"prev-arrow-img"],"nextArrowImg":[1,"next-arrow-img"],"pageNumbers":[32]}],[1,"ptc-para",{"fontSize":[1,"font-size"],"fontWeight":[1,"font-weight"],"paraStyle":[1,"para-style"],"paraColor":[1,"para-color"],"paraLineH":[1,"para-line-h"],"paraMargin":[1,"para-margin"]}],[1,"ptc-spacer",{"breakpoint":[1],"size":[1],"direction":[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"]}],[4,"ptc-img",{"sizeXs":[1025,"size-xs"],"sizeSm":[1025,"size-sm"],"sizeMd":[1025,"size-md"],"sizeLg":[1025,"size-lg"],"imgUrl":[1,"img-url"],"imageType":[1,"image-type"],"borderRadius":[1,"border-radius"],"loadMode":[1,"load-mode"]},[[9,"resize","WindowResize"]]]]],["dropdown-item.cjs",[[4,"dropdown-item",{"linkHref":[1,"link-href"],"linkTarget":[1,"link-target"]}]]],["ptc-svg-btn.cjs",[[1,"ptc-svg-btn",{"svgName":[1,"svg-name"],"display":[1]}]]],["list-item.cjs",[[1,"list-item",{"listType":[1,"list-type"],"linkHref":[1,"link-href"],"flushBefore":[4,"flush-before"],"linkTarget":[1,"link-target"]}]]],["icon-asset.cjs",[[2,"icon-asset",{"name":[1],"size":[1],"type":[1],"spin":[1],"pulse":[1],"color":[1],"injectedStyle":[1,"injected-style"]}]]]], options);
|
|
18
18
|
});
|
|
19
19
|
};
|
|
20
20
|
|
|
@@ -3,10 +3,7 @@
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
5
|
const index = require('./index-3adcf9f4.js');
|
|
6
|
-
|
|
7
|
-
function format(first, middle, last) {
|
|
8
|
-
return (first || '') + (middle ? ` ${middle}` : '') + (last ? ` ${last}` : '');
|
|
9
|
-
}
|
|
6
|
+
const utils = require('./utils-dc2c222f.js');
|
|
10
7
|
|
|
11
8
|
const myComponentCss = ":host{display:block}";
|
|
12
9
|
|
|
@@ -15,7 +12,7 @@ let MyComponent = class {
|
|
|
15
12
|
index.registerInstance(this, hostRef);
|
|
16
13
|
}
|
|
17
14
|
getText() {
|
|
18
|
-
return format(this.first, this.middle, this.last);
|
|
15
|
+
return utils.format(this.first, this.middle, this.last);
|
|
19
16
|
}
|
|
20
17
|
render() {
|
|
21
18
|
return index.h("div", null, "Hello, World! I'm ", this.getText());
|
|
@@ -0,0 +1,479 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
+
|
|
5
|
+
const index = require('./index-3adcf9f4.js');
|
|
6
|
+
const interfaces = require('./interfaces-0ecd8027.js');
|
|
7
|
+
|
|
8
|
+
const ptcCardCss = ":host{display:block}:host(.lottie-card) .card-border{box-shadow:var(--ptc-shadow-small);border:1px solid var(--color-gray-03);border-radius:10px;position:relative;overflow:hidden}:host(.lottie-card) .card-border::after{content:\"\";height:40%;width:4px;position:absolute;top:30%;right:-2px;background-color:var(--color-green-06);z-index:2;display:block}:host(.lottie-card) .card-border:hover{box-shadow:var(--ptc-shadow-x-large)}:host(.lottie-card) .card-border:hover .card-body h3{border-bottom:2px solid var(--color-green-07)}:host(.lottie-card) .card-layout{display:block}@media only screen and (min-width: 768px){:host(.lottie-card) .card-layout{display:flex;flex-flow:nowrap row;justify-content:center}}:host(.lottie-card) .link-wrapper{outline:none;text-decoration:none}:host(.lottie-card) .link-wrapper:hover{outline:none;text-decoration:none}:host(.lottie-card) .card-media{flex-basis:40%;border-right:1px solid var(--color-gray-03);display:flex}:host(.lottie-card) .card-body{flex-basis:60%;align-self:center;padding:0 30px 10px}:host(.lottie-card) .card-body h3{display:inline-block;line-height:var(--ptc-line-height-densest);color:var(--color-gray-10);font-weight:var(--ptc-font-weight-bold);font-size:var(--ptc-font-size-x-small);border-bottom:2px solid transparent;margin-bottom:var(--ptc-element-spacing-02)}:host(.simple-card) .card-layout{display:block}:host(.simple-card) .link-wrapper{outline:none;text-decoration:none}:host(.simple-card) .link-wrapper:hover{outline:none;text-decoration:none}:host(.simple-card) .link-wrapper:hover .card-body h3::before{width:100%}:host(.simple-card) .link-wrapper:hover ::slotted([slot=slot-after-heading]){margin-left:var(--ptc-element-spacing-04)}:host(.simple-card) .card-body h3{color:var(--color-gray-10);font-size:var(--ptc-font-size-xx-small);font-weight:var(--ptc-font-weight-black);line-height:var(--ptc-line-height-dense);position:relative;margin-bottom:var(--ptc-element-spacing-02);display:inline-block}:host(.simple-card) .card-body h3::before{display:block;position:absolute;content:\"\";width:var(--ptc-element-spacing-07);border-bottom:2px solid var(--color-green-06);bottom:1px;transition:width var(--ptc-transition-medium) var(--ptc-ease-inout)}:host(.simple-card) ::slotted([slot=slot-after-heading]){margin-left:var(--ptc-element-spacing-01);transition:margin-left var(--ptc-transition-medium) var(--ptc-ease-inout)}:host(.clip-edge-card) .card-border{overflow:hidden;filter:drop-shadow(rgba(0, 0, 0, 0.32) 0px 3px 6px);width:100%}:host(.clip-edge-card) .card-border:hover{filter:drop-shadow(rgba(0, 0, 0, 0.32) 0px 6px 12px)}:host(.clip-edge-card) .card-layout{display:block}:host(.clip-edge-card) .link-wrapper{outline:none;text-decoration:none}:host(.clip-edge-card) .link-wrapper:hover{outline:none;text-decoration:none}:host(.clip-edge-card) .card-media{position:relative;width:100%;height:124px;overflow:hidden;border-radius:var(--ptc-border-radius-standard)}:host(.clip-edge-card) .card-body{transform:translateY(calc((-1) * var(--ptc-element-spacing-04)));overflow:hidden;width:calc(95% - var(--ptc-element-spacing-04) - var(--ptc-element-spacing-04));font-size:var(--ptc-font-size-xx-small);font-weight:var(--ptc-font-weight-medium);line-height:var(--ptc-line-height-dense);color:var(--color-gray-10);clip-path:var(--ptc-clip-path-bottom-right);background-color:var(--color-white);border-radius:var(--ptc-border-radius-standard);padding:var(--ptc-element-spacing-06) var(--ptc-element-spacing-04) var(--ptc-element-spacing-03) var(--ptc-element-spacing-04)}:host(.clip-edge-card) .card-body h3{display:inline-block;margin:0px;font-size:var(--ptc-font-size-x-small);font-weight:var(--ptc-font-weight-bold);line-height:var(--ptc-line-height-dense);color:var(--color-gray-10);text-decoration:none;border-bottom:2px solid transparent;transition:border-bottom var(--ptc-transition-medium) var(--ptc-ease-inout), margin var(--ptc-transition-medium) var(--ptc-ease-inout);margin:var(--ptc-element-spacing-03) 0 var(--ptc-element-spacing-03) 0}:host(.clip-edge-card) ::slotted([slot=slot-description]){height:0;opacity:0;transition:height var(--ptc-transition-medium) var(--ptc-ease-inout), opacity var(--ptc-transition-medium) var(--ptc-ease-inout)}:host(.clip-edge-card) ::slotted([slot=slot-image]){display:block;width:100%;height:100%;transform:scale(1);transition:transform var(--ptc-transition-medium) var(--ptc-ease-inout);transform-origin:top center}:host(.clip-edge-card) ::slotted([slot=slot-after-heading]){position:absolute;top:var(--ptc-element-spacing-03);left:var(--ptc-element-spacing-04);opacity:1;transform:scale(1);height:44px;transform-origin:bottom center;transition:opacity var(--ptc-transition-medium) var(--ptc-ease-inout)}:host(.clip-edge-card) ::slotted([slot=slot-before-heading]){display:block;opacity:0;height:24px;transition:all var(--ptc-transition-medium) var(--ptc-ease-inout)}:host(.clip-edge-card) .link-wrapper:hover .card-body h3{border-bottom:2px solid var(--color-green-06)}:host(.clip-edge-card) .link-wrapper:hover ::slotted([slot=slot-description]){height:60px;opacity:1}:host(.clip-edge-card) .link-wrapper:hover ::slotted([slot=slot-image]){transform:scale(1.1)}:host(.clip-edge-card) .link-wrapper:hover ::slotted([slot=slot-after-heading]){opacity:0;transform:scale(0);height:0}:host(.clip-edge-card) .link-wrapper:hover ::slotted([slot=slot-before-heading]){opacity:1}:host(.hightlight-card) .card-border{width:100%;border-radius:var(--ptc-border-radius-standard);overflow:hidden}:host(.hightlight-card) .card-border:hover .card-media{transform:scale(1.1)}:host(.hightlight-card) .card-layout{display:block;position:relative}:host(.hightlight-card) .link-wrapper{outline:none;text-decoration:none}:host(.hightlight-card) .link-wrapper:hover{outline:none;text-decoration:none}:host(.hightlight-card) .link-wrapper:hover ::slotted([slot=slot-description]){height:96px;opacity:1}@media only screen and (min-width: 768px){:host(.hightlight-card) .link-wrapper:hover ::slotted([slot=slot-description]){height:var(--ptc-layout-spacing-05)}}@media only screen and (min-width: 992px){:host(.hightlight-card) .link-wrapper:hover ::slotted([slot=slot-description]){height:var(--ptc-layout-spacing-06)}}@media only screen and (min-width: 1440px){:host(.hightlight-card) .link-wrapper:hover ::slotted([slot=slot-description]){height:var(--ptc-layout-spacing-05)}}:host(.hightlight-card) .card-media{width:100%;height:auto;min-height:450px;position:relative;transform:scale(1);transform-origin:center bottom;transition:transform var(--ptc-transition-medium) var(--ptc-ease-inout);transition-delay:var(--ptc-delay-5)}:host(.hightlight-card) .card-body{position:absolute;bottom:0;top:auto;left:0;right:auto;padding:var(--ptc-element-spacing-04) var(--ptc-element-spacing-07);background-color:var(--color-white);box-sizing:border-box}:host(.hightlight-card) .card-body h3{font-size:var(--ptc-font-size-x-large);line-height:var(--ptc-line-height-densest);font-weight:var(--ptc-font-weight-bold);color:var(--color-gray-10);margin:var(--ptc-element-spacing-04) 0}:host(.hightlight-card) ::slotted([slot=slot-description]){height:0;opacity:0;transition:height var(--ptc-transition-medium) var(--ptc-ease-inout), opacity var(--ptc-transition-fast) var(--ptc-ease-inout);transition-delay:var(--ptc-delay-5)}:host(.horizontal-card){margin-bottom:var(--ptc-layout-spacing-02)}:host(.horizontal-card) .card-layout{position:relative}@media only screen and (min-width: 768px){:host(.horizontal-card) .card-layout{display:grid;grid-template-columns:42% 58%;direction:ltr;grid-auto-rows:1fr}}:host(.horizontal-card) .link-wrapper{outline:none;text-decoration:none;transition:var(--ptc-transition-slow) linear}:host(.horizontal-card) .link-wrapper:hover{box-shadow:var(--ptc-shadow-large);transition:var(--ptc-transition-slow) linear;background-color:var(--color-white)}:host(.horizontal-card) .link-wrapper:hover h3{border-color:var(--color-green-06);transition:var(--ptc-transition-slow) linear}:host(.horizontal-card) .card-media{display:flex;align-self:center}:host(.horizontal-card) .card-body{padding:var(--ptc-element-spacing-05) var(--ptc-element-spacing-04)}@media only screen and (min-width: 768px){:host(.horizontal-card) .card-body{padding:var(--ptc-element-spacing-06) var(--ptc-element-spacing-07)}}:host(.horizontal-card) .card-body h3{margin-top:0;font-size:var(--ptc-font-size-x-small);color:var(--color-gray-10);border-bottom:1px solid transparent;padding-bottom:var(--ptc-element-spacing-01);margin-bottom:var(--ptc-element-spacing-02);transition:var(--ptc-transition-slow) linear}:host(.horizontal-card) ::slotted([slot=slot-image]){box-shadow:var(--ptc-shadow-medium);width:100%}:host(.listing-card) .card-border{width:320px;overflow:hidden;background:var(--color-white);box-shadow:var(--ptc-shadow-small);border-radius:3px;height:449px;display:flex;flex-direction:row}:host(.listing-card) .card-border:hover{background:var(--color-gray-02);box-shadow:var(--ptc-shadow-large)}:host(.listing-card) .card-layout{display:block;position:relative}:host(.listing-card) .card-layout .ribbon-text{position:absolute;top:0;left:0;margin-right:100px;margin-top:22px;background-color:var(--color-white);padding:4px 22px 5px 23px;font-family:var(--ptc-font-latin);font-style:var(--ptc-font-style-normal);font-weight:var(--ptc-font-weight-bold);font-size:var(--ptc-font-size-small);line-height:var(--ptc-line-height-loose);color:var(--color-gray-11)}:host(.listing-card) .link-wrapper{outline:none;text-decoration:none}:host(.listing-card) .link-wrapper:hover{outline:none;text-decoration:none}:host(.listing-card) .card-media{width:100%;height:200px;transform:scale(1);transform-origin:center bottom;transition:transform var(--ptc-transition-medium) var(--ptc-standard-ease);transition-delay:var(--ptc-delay-medium)}:host(.listing-card) .card-media .smart-img{height:200px}:host(.listing-card) .card-body{padding:20px 38px 20px 20px}:host(.listing-card) .card-body .small{font-size:var(--ptc-font-size-x-small)}:host(.listing-card) .card-body h3{font-family:var(--ptc-font-latin);font-style:var(--ptc-font-style-normal);font-weight:var(--ptc-font-weight-bold);font-size:var(--ptc-font-size-small);line-height:var(--ptc-line-height-loose);line-height:21px;color:var(--color-gray-11);margin-bottom:12px;margin-top:0rem}:host(.listing-card) ::slotted([slot=slot-description]){font-family:var(--ptc-font-latin);font-style:var(--ptc-font-style-normal);font-weight:400;font-size:1rem;line-height:19px;color:var(--color-gray-11);margin-bottom:39px}:host(.listing-card-horizontal) .card-border{width:890px;overflow:hidden;background:var(--color-white);box-shadow:var(--ptc-shadow-small);border-radius:3px;height:224px}:host(.listing-card-horizontal) .card-border:hover{background:var(--color-gray-02);box-shadow:var(--ptc-shadow-large)}:host(.listing-card-horizontal) .card-layout{display:flex;flex-direction:row;width:890px;height:224px}:host(.listing-card-horizontal) .link-wrapper{outline:none;text-decoration:none}:host(.listing-card-horizontal) .link-wrapper:hover{outline:none;text-decoration:none}:host(.listing-card-horizontal) .card-media{width:385px;height:224px;transform:scale(1);transform-origin:center bottom;transition:transform var(--ptc-transition-medium) var(--ptc-standard-ease);transition-delay:var(--ptc-delay-medium)}:host(.listing-card-horizontal) .card-media .smart-img{height:224px;width:385px}:host(.listing-card-horizontal) .card-body{padding:20px 38px 20px 20px;width:505px}:host(.listing-card-horizontal) .card-body .small{font-size:var(--ptc-font-size-x-small)}:host(.listing-card-horizontal) .card-body h3{font-family:var(--ptc-font-latin);font-style:var(--ptc-font-style-normal);font-weight:var(--ptc-font-weight-bold);font-size:var(--ptc-font-size-small);line-height:var(--ptc-line-height-loose);line-height:21px;color:var(--color-gray-11);margin-bottom:12px;margin-top:0rem}:host(.listing-card-horizontal) ::slotted([slot=slot-description]){font-family:var(--ptc-font-latin);font-style:var(--ptc-font-style-normal);font-weight:400;font-size:1rem;line-height:19px;color:var(--color-gray-11);margin-bottom:39px}.ptc-h3.uppercase{text-transform:uppercase}.ptc-h3.capitalize{text-transform:capitalize}.ptc-h3.lowercase{text-transform:lowercase}.ptc-h3.none{text-transform:none}";
|
|
9
|
+
|
|
10
|
+
let PtcCard = class {
|
|
11
|
+
constructor(hostRef) {
|
|
12
|
+
index.registerInstance(this, hostRef);
|
|
13
|
+
/**
|
|
14
|
+
* Card Type
|
|
15
|
+
* Specify Card Type, default to simple card
|
|
16
|
+
*/
|
|
17
|
+
this.cardType = 'custom-card';
|
|
18
|
+
/**
|
|
19
|
+
* Card Link URL (Optional)
|
|
20
|
+
*/
|
|
21
|
+
this.cardHref = undefined;
|
|
22
|
+
/**
|
|
23
|
+
* (optional) Link card target
|
|
24
|
+
* */
|
|
25
|
+
this.target = '_self';
|
|
26
|
+
/**
|
|
27
|
+
* (optional) Link card rel
|
|
28
|
+
* */
|
|
29
|
+
this.rel = undefined;
|
|
30
|
+
/**
|
|
31
|
+
* If this card has Image
|
|
32
|
+
*/
|
|
33
|
+
this.hasImage = false;
|
|
34
|
+
/**
|
|
35
|
+
* If this card has Video
|
|
36
|
+
*/
|
|
37
|
+
this.hasVideo = false;
|
|
38
|
+
/**
|
|
39
|
+
* If this card has Lottie Image
|
|
40
|
+
*/
|
|
41
|
+
this.hasLottie = false;
|
|
42
|
+
/**
|
|
43
|
+
* Card heading text transform
|
|
44
|
+
*/
|
|
45
|
+
this.headingTransform = 'none';
|
|
46
|
+
}
|
|
47
|
+
render() {
|
|
48
|
+
const Tag = !!this.cardHref ? 'a' : 'div';
|
|
49
|
+
const classMap = this.getCssClassMap();
|
|
50
|
+
return (index.h(index.Host, Object.assign({}, (!!this.cardType ? { class: this.cardType } : {})), this.styles && index.h("style", null, this.styles), index.h("div", { class: "card-border", part: "border-wrapper" }, index.h(Tag, Object.assign({ class: classMap, part: "card-layout" }, (!!this.cardHref ? { href: this.cardHref } : {}), (!!this.target && !!this.cardHref ? { target: this.target } : {}), (!!this.rel && !!this.cardHref ? { rel: this.rel } : {}), (!!this.ribbonText ? { rel: this.ribbonText } : {})), this.hasImage || this.hasLottie || this.hasVideo ? (index.h("div", { class: "card-media", part: "media-wrapper" }, this.getMediaSlot ? index.h("slot", { name: this.getMediaSlot() }) : null)) : null, !!this.ribbonText && this.cardType == 'listing-card' ? index.h("div", { class: "ribbon-text" }, `${this.ribbonText}`) : null, index.h("div", { class: "card-body", part: "body-wrapper" }, !!this.cardDate && (this.cardType === 'listing-card' || this.cardType === 'listing-card-horizontal') ? index.h("ptc-date", { "date-string": `${this.cardDate}`, "date-styles": "span{font-weight: 400;font-size: 16px;line-height: 19px;color: #282F35;margin-bottom:24px;display:inline-block;}" }) : null, index.h("slot", { name: "slot-before-heading" }), !!this.heading
|
|
51
|
+
? [
|
|
52
|
+
index.h("h3", { class: `ptc-h3 ${this.headingTransform}`, part: "card-heading" }, this.heading),
|
|
53
|
+
index.h("slot", { name: "slot-after-heading" }),
|
|
54
|
+
]
|
|
55
|
+
: null, index.h("slot", { name: "slot-description" }), !!this.cardDate && this.cardType !== 'listing-card' && this.cardType !== 'listing-card-horizontal' && this.cardType !== 'hightlight-card' ? index.h("ptc-date", { "date-string": `${this.cardDate}`, "date-styles": "span{color:#40434a;font-size:var(--ptc-font-size-x-small);margin-top:var(--ptc-element-spacing-06);display:inline-block;}" }) : null)))));
|
|
56
|
+
}
|
|
57
|
+
getCssClassMap() {
|
|
58
|
+
return {
|
|
59
|
+
['card-layout']: true,
|
|
60
|
+
['link-wrapper']: !!this.cardType ? true : false,
|
|
61
|
+
};
|
|
62
|
+
}
|
|
63
|
+
getMediaSlot() {
|
|
64
|
+
if (this.hasLottie) {
|
|
65
|
+
return 'slot-lottie';
|
|
66
|
+
}
|
|
67
|
+
else if (this.hasVideo) {
|
|
68
|
+
return 'slot-video';
|
|
69
|
+
}
|
|
70
|
+
else if (this.hasImage) {
|
|
71
|
+
return 'slot-image';
|
|
72
|
+
}
|
|
73
|
+
else {
|
|
74
|
+
return null;
|
|
75
|
+
}
|
|
76
|
+
}
|
|
77
|
+
};
|
|
78
|
+
PtcCard.style = ptcCardCss;
|
|
79
|
+
|
|
80
|
+
const ptcDateCss = ":host{display:block}:host(.small) span{font-size:var(--ptc-font-size-xx-small)}:host(.medium) span{font-size:var(--ptc-font-size-x-small)}:host(.primary-grey){color:var(--color-primary-gray-new)}:host(.white) span{color:var(--color-white)}:host(.date-m-top){margin-top:var(--ptc-element-spacing-01)}";
|
|
81
|
+
|
|
82
|
+
let PtcDate = class {
|
|
83
|
+
constructor(hostRef) {
|
|
84
|
+
index.registerInstance(this, hostRef);
|
|
85
|
+
/**
|
|
86
|
+
* Year
|
|
87
|
+
*/
|
|
88
|
+
this.year = 1900;
|
|
89
|
+
/**
|
|
90
|
+
* Month
|
|
91
|
+
* An integer between 1 (January) and 12 (December) representing the month.If omitted, defaults to 0.
|
|
92
|
+
*/
|
|
93
|
+
this.month = 0;
|
|
94
|
+
/**
|
|
95
|
+
* Day
|
|
96
|
+
* An integer between 1 and 31 representing the day of the month. If omitted, defaults to 1.
|
|
97
|
+
*/
|
|
98
|
+
this.day = 1;
|
|
99
|
+
/**
|
|
100
|
+
* Country
|
|
101
|
+
* examples: en-US, zh-CN, zh-TW, fr-FR, ja-JP, ru-RU, de-DE, ko-KR, it-IT, es-ES
|
|
102
|
+
*/
|
|
103
|
+
this.country = 'en-US';
|
|
104
|
+
/**
|
|
105
|
+
* Date Font Size
|
|
106
|
+
*/
|
|
107
|
+
this.dataSize = 'small';
|
|
108
|
+
}
|
|
109
|
+
render() {
|
|
110
|
+
// const newDate = new Date(this.year, this.month, this.day);
|
|
111
|
+
const classMap = this.getCssClassMap();
|
|
112
|
+
return (index.h(index.Host, { class: classMap }, this.dateStyles && index.h("style", null, this.dateStyles), index.h("span", { part: "part-ptc-date" }, this.getDate().toLocaleDateString(this.country, { year: 'numeric', month: 'short', day: 'numeric' }))));
|
|
113
|
+
}
|
|
114
|
+
getCssClassMap() {
|
|
115
|
+
return {
|
|
116
|
+
[this.dateColor]: !!this.dateColor ? true : false,
|
|
117
|
+
[this.dataSize]: !!this.dataSize ? true : false,
|
|
118
|
+
};
|
|
119
|
+
}
|
|
120
|
+
getDate() {
|
|
121
|
+
if (this.dateString) {
|
|
122
|
+
let newDate = new Date(this.dateString.replace(/-/g, '/'));
|
|
123
|
+
return newDate;
|
|
124
|
+
}
|
|
125
|
+
else {
|
|
126
|
+
return new Date(this.year, this.month - 1, this.day);
|
|
127
|
+
}
|
|
128
|
+
}
|
|
129
|
+
};
|
|
130
|
+
PtcDate.style = ptcDateCss;
|
|
131
|
+
|
|
132
|
+
const ptcImgCss = ".smart-bg{width:100%;height:100%;background-size:cover;background-repeat:no-repeat;background-position:50% 50%}.smart-img{position:absolute;display:block;width:100%;height:100%;top:0;left:0;background-size:cover;background-repeat:no-repeat;background-position:50% 50%}.radius-standard{border-radius:var(--ptc-border-radius-standard)}.radius-large{border-radius:var(--ptc-border-radius-large)}.lazy-bg{background-image:none !important;background-color:var(--color-gray-03)}@media only screen and (min-width: 768px){.hidden-xs{display:none !important}}@media (min-width: 768px) and (max-width: 991px){.hidden-sm{display:none !important}}@media (min-width: 992px) and (max-width: 1199px){.hidden-md{display:none !important}}@media only screen and (min-width: 768px){.hidden-lg{display:none !important}}";
|
|
133
|
+
|
|
134
|
+
let PtcImg = class {
|
|
135
|
+
constructor(hostRef) {
|
|
136
|
+
index.registerInstance(this, hostRef);
|
|
137
|
+
/**
|
|
138
|
+
* Image size for smallest screen
|
|
139
|
+
* <=767px
|
|
140
|
+
*/
|
|
141
|
+
this.sizeXs = '510x340';
|
|
142
|
+
/**
|
|
143
|
+
* Image size for small screen
|
|
144
|
+
* >=768px and <=991px
|
|
145
|
+
*/
|
|
146
|
+
this.sizeSm = '1240x496';
|
|
147
|
+
/**
|
|
148
|
+
* Image size for medium screen
|
|
149
|
+
* >=992px and <=1199px
|
|
150
|
+
*/
|
|
151
|
+
this.sizeMd = '1366x500';
|
|
152
|
+
/**
|
|
153
|
+
* Image solution for large screen
|
|
154
|
+
* >=1200px
|
|
155
|
+
*/
|
|
156
|
+
this.sizeLg = '1920x1080';
|
|
157
|
+
/**
|
|
158
|
+
* Image type
|
|
159
|
+
*/
|
|
160
|
+
this.imageType = 'smart-bg';
|
|
161
|
+
/**
|
|
162
|
+
* Image border shape
|
|
163
|
+
*/
|
|
164
|
+
this.borderRadius = '';
|
|
165
|
+
/**
|
|
166
|
+
* Lazy loading option
|
|
167
|
+
*/
|
|
168
|
+
this.loadMode = 'lazy-bg';
|
|
169
|
+
}
|
|
170
|
+
/**
|
|
171
|
+
* Image Z Index
|
|
172
|
+
*/
|
|
173
|
+
// @Prop() imageZIndex: 'z-index-auto' | 'z-index-n-2' | 'z-index-n-1' | 'z-index-p-1' | 'z-index-p-2' = 'z-index-auto';
|
|
174
|
+
WindowResize() {
|
|
175
|
+
this.setResponsiveBg();
|
|
176
|
+
}
|
|
177
|
+
render() {
|
|
178
|
+
const classMap = this.getCssClassMap();
|
|
179
|
+
return (index.h(index.Host, null, index.h("div", { class: classMap, "data-xs": `${this.imgUrl}:${this.sizeXs}`, "data-sm": `${this.imgUrl}:${this.sizeSm}`, "data-md": `${this.imgUrl}:${this.sizeMd}`, "data-lg": `${this.imgUrl}:${this.sizeLg}` }, this.imageType == 'smart-bg' ? index.h("slot", null) : null)));
|
|
180
|
+
}
|
|
181
|
+
componentDidLoad() {
|
|
182
|
+
this.addIntersectionObserver();
|
|
183
|
+
this.setResponsiveBg();
|
|
184
|
+
}
|
|
185
|
+
componentWillUpdate() {
|
|
186
|
+
// console.log('componentWillUpdate!');
|
|
187
|
+
this.addIntersectionObserver();
|
|
188
|
+
this.setResponsiveBg();
|
|
189
|
+
}
|
|
190
|
+
//responsive image
|
|
191
|
+
setResponsiveBg() {
|
|
192
|
+
// Define local variables
|
|
193
|
+
let backgrounds = (this.el || document).querySelectorAll(interfaces.ResponsiveBgVariables.selector), el, elData, currentBreakpoint = this.getCurrentBreakPoints();
|
|
194
|
+
// console.log('current breakpoint: ' + currentBreakpoint);
|
|
195
|
+
// Loop through all target elements
|
|
196
|
+
for (var i = 0, len = backgrounds.length; i < len; i++) {
|
|
197
|
+
// Set current variables
|
|
198
|
+
el = backgrounds[i];
|
|
199
|
+
elData = el.getAttribute('data-' + currentBreakpoint);
|
|
200
|
+
// If the data attribute exists, set the background
|
|
201
|
+
if (elData !== null) {
|
|
202
|
+
el.style.backgroundImage = "url('" + elData + "')";
|
|
203
|
+
}
|
|
204
|
+
else {
|
|
205
|
+
if (typeof console == 'object') {
|
|
206
|
+
console.warn('Data attribute: data-' + currentBreakpoint + ' not found on element:\n\n' + el.outerHTML + '\n\n\n');
|
|
207
|
+
}
|
|
208
|
+
}
|
|
209
|
+
}
|
|
210
|
+
}
|
|
211
|
+
//lazy loading
|
|
212
|
+
addIntersectionObserver() {
|
|
213
|
+
if (!this.imgUrl) {
|
|
214
|
+
console.log('no image!');
|
|
215
|
+
return;
|
|
216
|
+
}
|
|
217
|
+
if ('IntersectionObserver' in window) {
|
|
218
|
+
let lazyLoadBgs = (this.el || document).querySelectorAll('.lazy-bg');
|
|
219
|
+
let bgObserver = new IntersectionObserver(entries => {
|
|
220
|
+
entries.forEach(entry => {
|
|
221
|
+
if (entry.isIntersecting) {
|
|
222
|
+
const image = entry.target;
|
|
223
|
+
image.classList.remove('lazy-bg');
|
|
224
|
+
// console.log('loaded');
|
|
225
|
+
bgObserver.unobserve(image);
|
|
226
|
+
}
|
|
227
|
+
});
|
|
228
|
+
});
|
|
229
|
+
lazyLoadBgs.forEach(image => {
|
|
230
|
+
bgObserver.observe(image);
|
|
231
|
+
});
|
|
232
|
+
}
|
|
233
|
+
}
|
|
234
|
+
getCssClassMap() {
|
|
235
|
+
return {
|
|
236
|
+
[this.imageType]: true,
|
|
237
|
+
'ptc-img': true,
|
|
238
|
+
[this.borderRadius]: true,
|
|
239
|
+
[this.loadMode]: true,
|
|
240
|
+
// [this.imageZIndex] : true
|
|
241
|
+
};
|
|
242
|
+
}
|
|
243
|
+
getCurrentBreakPoints() {
|
|
244
|
+
// Define local variables
|
|
245
|
+
let doc = window.document, temp = doc.createElement('div'), env;
|
|
246
|
+
// Append test node
|
|
247
|
+
doc.body.appendChild(temp);
|
|
248
|
+
// Loop through breakpoints
|
|
249
|
+
for (let i = interfaces.ResponsiveBgVariables.envs.length - 1; i >= 0; i--) {
|
|
250
|
+
env = interfaces.ResponsiveBgVariables.envs[i];
|
|
251
|
+
// Add classes
|
|
252
|
+
temp.className = 'hidden-' + env;
|
|
253
|
+
// Found breakpoint
|
|
254
|
+
if (temp.offsetParent === null) {
|
|
255
|
+
// Remove our test node
|
|
256
|
+
doc.body.removeChild(temp);
|
|
257
|
+
console.log('remove test node');
|
|
258
|
+
// Return current breakpoint
|
|
259
|
+
return env;
|
|
260
|
+
}
|
|
261
|
+
}
|
|
262
|
+
// Breakpoint not found, try fallback
|
|
263
|
+
doc.body.removeChild(temp);
|
|
264
|
+
return this.getFallbackBreakpoint();
|
|
265
|
+
}
|
|
266
|
+
getFallbackBreakpoint() {
|
|
267
|
+
if (window.matchMedia('(min-width: 992px)').matches) {
|
|
268
|
+
return 'lg';
|
|
269
|
+
}
|
|
270
|
+
else if (window.matchMedia('(min-width: 768px)').matches) {
|
|
271
|
+
return 'md';
|
|
272
|
+
}
|
|
273
|
+
else if (window.matchMedia('(min-width: 576px)').matches) {
|
|
274
|
+
return 'sm';
|
|
275
|
+
}
|
|
276
|
+
else {
|
|
277
|
+
return 'xs';
|
|
278
|
+
}
|
|
279
|
+
}
|
|
280
|
+
get el() { return index.getElement(this); }
|
|
281
|
+
};
|
|
282
|
+
PtcImg.style = ptcImgCss;
|
|
283
|
+
|
|
284
|
+
const ptcPagenationCss = ":host{display:block}.events-filter{padding:20px 32px 20px 0;text-align:center}@media (min-width: 992px){.events-filter{padding:10px 40px 10px 0px}}.events-filter .pagenation-arrow{width:40px;height:40px;margin:0 15px;vertical-align:middle}.show-page{display:inline}.hide-page{display:none}.prev-text{display:none}.last-text{display:none}@media (min-width: 992px){.prev-text{display:inline;cursor:pointer}.last-text{display:inline;cursor:pointer}}.events-filter-item{font-family:var(--ptc-font-latin);font-size:var(--ptc-font-size-xx-small);font-weight:var(--ptc-font-weight-semibold);font-stretch:normal;font-style:var(--ptc-font-style-normal);line-height:var(--ptc-line-height-denser);letter-spacing:var(--ptc-letter-spacing-normal);text-align:left;padding:6px;color:var(--color-gray-13);text-decoration:none}.events-filter .active{font-family:var(--ptc-font-latin);border-bottom:2px solid var(--color-green-13);font-weight:var(--ptc-font-weight-semibold)}.events-filter-item:hover,.events-filter-item:focus{text-decoration:none;outline:0;color:var(--color-green-14)}.events-filter .disabled{color:var(--color-white-01)}.events-filter-dots{padding:0rem;font-weight:var(--ptc-font-weight-extrabold);font-family:var(--ptc-font-latin);font-size:var(--ptc-font-size-xx-small);font-stretch:normal;font-style:var(--ptc-font-style-normal);line-height:var(--ptc-line-height-denser);letter-spacing:var(--ptc-letter-spacing-normal);text-align:left;color:var(--color-gray-13);text-decoration:none}.events-disable-arrows{opacity:0.35}.events-enable-arrows{opacity:1}.events-small-dots{height:60px;margin-top:-25px}@media (min-width: 992px){.events-small-dots{height:80px;margin-top:-40px}}.last-page{transform:rotate(180deg)}";
|
|
285
|
+
|
|
286
|
+
let PtcPagenation = class {
|
|
287
|
+
constructor(hostRef) {
|
|
288
|
+
index.registerInstance(this, hostRef);
|
|
289
|
+
this.pageClicked = index.createEvent(this, "pageClicked", 7);
|
|
290
|
+
this.numberOfItems = 9; //page size
|
|
291
|
+
this.previousValue = "Previous";
|
|
292
|
+
this.lastValue = "Next";
|
|
293
|
+
this.pageNumbers = [];
|
|
294
|
+
this.minPageNumber = 1;
|
|
295
|
+
this.maxPageNumber = 4;
|
|
296
|
+
this.clickedPageNumber = 1;
|
|
297
|
+
this.appendArray = true;
|
|
298
|
+
this.prevArrowImg = "/dist/ptc/images/sidescroll-left-curved.svg";
|
|
299
|
+
this.nextArrowImg = "/dist/ptc/images/sidescroll-right-curved.svg";
|
|
300
|
+
this.handleClick = () => {
|
|
301
|
+
if (this.clickedPageNumber < this.getPageCount()) {
|
|
302
|
+
if (this.clickedPageNumber + 1 <= this.maxPageNumber) {
|
|
303
|
+
this.handleClickPage(this.clickedPageNumber + 1);
|
|
304
|
+
}
|
|
305
|
+
else {
|
|
306
|
+
this.minPageNumber = this.minPageNumber + 4;
|
|
307
|
+
this.clickedPageNumber = this.clickedPageNumber + 1;
|
|
308
|
+
this.appendArray = true;
|
|
309
|
+
this.pageNumbers = [...this.pageNumbers];
|
|
310
|
+
this.pageClicked.emit(this.clickedPageNumber);
|
|
311
|
+
}
|
|
312
|
+
}
|
|
313
|
+
};
|
|
314
|
+
this.handleClickPrev = () => {
|
|
315
|
+
if (this.clickedPageNumber > 1) {
|
|
316
|
+
if (this.clickedPageNumber - 1 >= this.minPageNumber) {
|
|
317
|
+
this.handleClickPage(this.clickedPageNumber - 1);
|
|
318
|
+
}
|
|
319
|
+
else {
|
|
320
|
+
this.minPageNumber = this.minPageNumber - 4;
|
|
321
|
+
this.clickedPageNumber = this.clickedPageNumber - 1;
|
|
322
|
+
this.appendArray = true;
|
|
323
|
+
this.pageNumbers = [...this.pageNumbers];
|
|
324
|
+
this.pageClicked.emit(this.clickedPageNumber);
|
|
325
|
+
}
|
|
326
|
+
}
|
|
327
|
+
};
|
|
328
|
+
this.getPageCount = () => {
|
|
329
|
+
let pageCount = 0;
|
|
330
|
+
if (this.totalCount != 0) {
|
|
331
|
+
if (this.totalCount % this.numberOfItems == 0) {
|
|
332
|
+
pageCount = this.totalCount / this.numberOfItems;
|
|
333
|
+
}
|
|
334
|
+
else {
|
|
335
|
+
pageCount = this.totalCount / this.numberOfItems + 1;
|
|
336
|
+
}
|
|
337
|
+
}
|
|
338
|
+
return Math.floor(pageCount);
|
|
339
|
+
};
|
|
340
|
+
this.getIndex = (appendarr) => {
|
|
341
|
+
//var games : string[] = [];
|
|
342
|
+
//let games : HTMLElement[] = [];
|
|
343
|
+
//let items: pageItem[] = [];
|
|
344
|
+
if (appendarr) {
|
|
345
|
+
let pageCountVal = this.getPageCount();
|
|
346
|
+
this.maxPageNumber = pageCountVal >= this.minPageNumber + 3 ? this.minPageNumber + 3 : pageCountVal;
|
|
347
|
+
this.pageNumbers = [];
|
|
348
|
+
for (let i = this.minPageNumber; i <= this.maxPageNumber; i++) {
|
|
349
|
+
let id = i + "Id";
|
|
350
|
+
let isItemActive = false;
|
|
351
|
+
if (i == this.clickedPageNumber) {
|
|
352
|
+
isItemActive = true;
|
|
353
|
+
}
|
|
354
|
+
// if (i > 4)
|
|
355
|
+
// {
|
|
356
|
+
// hideShowPageClass = " hide-page";
|
|
357
|
+
// }
|
|
358
|
+
const newPageItem = {
|
|
359
|
+
id: id,
|
|
360
|
+
isActive: isItemActive,
|
|
361
|
+
dataPage: i
|
|
362
|
+
};
|
|
363
|
+
this.pageNumbers = [...this.pageNumbers, newPageItem];
|
|
364
|
+
//games.push(<a href="#" data-url={id} data-page={i} class={classValue}>i</a>);
|
|
365
|
+
}
|
|
366
|
+
}
|
|
367
|
+
return this.pageNumbers;
|
|
368
|
+
};
|
|
369
|
+
}
|
|
370
|
+
render() {
|
|
371
|
+
let pageCountValue = this.getPageCount();
|
|
372
|
+
this.pageNumbers = [...this.getIndex(this.appendArray)];
|
|
373
|
+
return (index.h("div", { class: "events-filter" }, index.h("span", { class: this.clickedPageNumber == 1 ? "events-filter-item disabled prev-text" : "events-filter-item prev-text" }, this.previousValue), index.h("img", { src: this.prevArrowImg, onClick: this.handleClickPrev, class: this.clickedPageNumber == 1 ? "pagenation-arrow prev-page events-disable-arrows" : "pagenation-arrow prev-page" }), this.pageNumbers.map(anchoritem => {
|
|
374
|
+
return (index.h("a", { href: "#", "data-url": anchoritem.id, "data-page": anchoritem.dataPage, class: anchoritem.isActive ? "events-filter-item active" : "events-filter-item", onClick: () => this.handleClickPage(anchoritem.dataPage) }, anchoritem.dataPage));
|
|
375
|
+
}), pageCountValue > this.maxPageNumber ? (index.h("span", { class: "events-filter-dots" }, ". . .")) : null, index.h("img", { src: this.nextArrowImg, onClick: this.handleClick, class: this.clickedPageNumber == pageCountValue ? "pagenation-arrow last-page events-disable-arrows" : "pagenation-arrow last-page" }), index.h("span", { class: this.clickedPageNumber == pageCountValue ? "events-filter-item disabled last-text" : "events-filter-item last-text" }, this.lastValue)));
|
|
376
|
+
}
|
|
377
|
+
handleClickPage(clickedPage) {
|
|
378
|
+
this.clickedPageNumber = clickedPage;
|
|
379
|
+
let newArray = [];
|
|
380
|
+
this.appendArray = false;
|
|
381
|
+
newArray = [...this.pageNumbers];
|
|
382
|
+
newArray.map(item => {
|
|
383
|
+
item.dataPage == clickedPage ? item.isActive = true : item.isActive = false;
|
|
384
|
+
});
|
|
385
|
+
this.pageNumbers = null;
|
|
386
|
+
this.pageNumbers = [...newArray];
|
|
387
|
+
this.pageClicked.emit(clickedPage);
|
|
388
|
+
}
|
|
389
|
+
};
|
|
390
|
+
PtcPagenation.style = ptcPagenationCss;
|
|
391
|
+
|
|
392
|
+
const ptcParaCss = ":host{z-index:1}p.default{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;}p.main{text-shadow:0 3px 6px var(--color-white);line-height:var(--ptc-line-height-dense);color:var(--color-gray-10)}p.primary-grey{color:var(--color-gray-10)}p.white{color:var(--color-white)}p.xxx-small{font-size:var(--ptc-font-size-xxx-small)}p.xx-small{font-size:var(--ptc-font-size-xx-small)}p.x-small{font-size:var(--ptc-font-size-x-small)}p.small{font-size:var(--ptc-font-size-small)}p.medium{font-size:var(--ptc-font-size-medium)}p.large{font-size:var(--ptc-font-size-large)}p.x-large{font-size:var(--ptc-font-size-x-large)}p.xx-large{font-size:var(--ptc-font-size-xx-large)}p.xxx-large{font-size:var(--ptc-font-size-xxx-large)}p.xxxx-large{font-size:var(--ptc-font-size-xxxx-large)}p.w-3{font-weight:var(--ptc-font-weight-thin)}p.w-4{font-weight:var(--ptc-font-weight-regular)}p.w-5{font-weight:var(--ptc-font-weight-medium)}p.w-6{font-weight:var(--ptc-font-weight-semibold)}p.w-7{font-weight:var(--ptc-font-weight-bold)}p.w-8{font-weight:var(--ptc-font-weight-extrabold)}p.w-9{font-weight:var(--ptc-font-weight-black)}p.margin-flush{margin-top:0;margin-bottom:0}p.margin-top-1{margin-top:var(--ptc-element-spacing-01);margin-bottom:0}p.margin-top-2{margin-top:var(--ptc-element-spacing-02);margin-bottom:0}p.margin-top-3{margin-top:var(--ptc-element-spacing-03);margin-bottom:0}p.margin-top-4{margin-top:var(--ptc-element-spacing-04);margin-bottom:0}p.margin-top-5{margin-top:var(--ptc-element-spacing-05);margin-bottom:0}p.margin-top-6{margin-top:var(--ptc-element-spacing-06);margin-bottom:0}p.margin-bottom-1{margin-bottom:var(--ptc-element-spacing-01);margin-top:0}p.margin-bottom-2{margin-bottom:var(--ptc-element-spacing-02);margin-top:0}p.margin-bottom-3{margin-bottom:var(--ptc-element-spacing-03);margin-top:0}p.margin-bottom-4{margin-bottom:var(--ptc-element-spacing-04);margin-top:0}p.margin-bottom-5{margin-bottom:var(--ptc-element-spacing-05);margin-top:0}p.margin-bottom-6{margin-bottom:var(--ptc-element-spacing-06);margin-top:0}p.margin-1{margin-top:var(--ptc-element-spacing-01);margin-bottom:var(--ptc-element-spacing-01)}p.margin-2{margin-top:var(--ptc-element-spacing-02);margin-bottom:var(--ptc-element-spacing-02)}p.margin-3{margin-top:var(--ptc-element-spacing-03);margin-bottom:var(--ptc-element-spacing-03)}p.margin-4{margin-top:var(--ptc-element-spacing-04);margin-bottom:var(--ptc-element-spacing-04)}p.margin-5{margin-top:var(--ptc-element-spacing-05);margin-bottom:var(--ptc-element-spacing-05)}p.margin-6{margin-top:var(--ptc-element-spacing-06);margin-bottom:var(--ptc-element-spacing-06)}p.line-height-densest{line-height:var(--ptc-line-height-densest)}p.line-height-denser{line-height:var(--ptc-line-height-denser)}p.line-height-dense{line-height:var(--ptc-line-height-dense)}p.line-height-normal{line-height:var(--ptc-line-height-normal)}p.line-height-loose{line-height:var(--ptc-line-height-loose)}p.line-height-looser{line-height:var(--ptc-line-height-looser)}p.announcement{text-transform:uppercase;font-size:var(--ptc-font-size-small);color:var(--color-gray-07);line-height:var(--ptc-line-height-looser);letter-spacing:var(--ptc-letter-spacing-loose)}";
|
|
393
|
+
|
|
394
|
+
let PtcPara = class {
|
|
395
|
+
constructor(hostRef) {
|
|
396
|
+
index.registerInstance(this, hostRef);
|
|
397
|
+
/**
|
|
398
|
+
* Paragraph font size
|
|
399
|
+
**/
|
|
400
|
+
this.fontSize = "x-small";
|
|
401
|
+
/**
|
|
402
|
+
* Paragraph font weight
|
|
403
|
+
**/
|
|
404
|
+
this.fontWeight = 'w-4';
|
|
405
|
+
/**
|
|
406
|
+
* Paragraph Style
|
|
407
|
+
**/
|
|
408
|
+
this.paraStyle = 'default';
|
|
409
|
+
/**
|
|
410
|
+
* Paragraph Color
|
|
411
|
+
*/
|
|
412
|
+
this.paraColor = 'primary-grey';
|
|
413
|
+
/**
|
|
414
|
+
* line height
|
|
415
|
+
*/
|
|
416
|
+
this.paraLineH = 'line-height-normal';
|
|
417
|
+
}
|
|
418
|
+
render() {
|
|
419
|
+
const classMap = this.getCssClassMap();
|
|
420
|
+
return (index.h("p", { class: classMap, part: "part-para" }, index.h("slot", null)));
|
|
421
|
+
}
|
|
422
|
+
getCssClassMap() {
|
|
423
|
+
return {
|
|
424
|
+
[this.fontSize]: true,
|
|
425
|
+
[this.fontWeight]: true,
|
|
426
|
+
[this.paraStyle]: true,
|
|
427
|
+
[this.paraMargin]: !!this.paraMargin ? true : false,
|
|
428
|
+
[this.paraColor]: true,
|
|
429
|
+
[this.paraLineH]: true
|
|
430
|
+
};
|
|
431
|
+
}
|
|
432
|
+
};
|
|
433
|
+
PtcPara.style = ptcParaCss;
|
|
434
|
+
|
|
435
|
+
const ptcSpacerCss = ":host{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;position:relative;display:block;width:12px;min-width:12px;height:12px}@media (min-width: 36em){:host{width:16px;min-width:16px;height:16px}}:host(.ptc-spacer-horizontal){display:inline-block;height:100% !important}:host(.ptc-spacer-horizontal.xx-small){width:4px;min-width:4px;height:100%}@media (min-width: 36em){:host(.ptc-spacer-horizontal.xx-small){width:4px;min-width:4px}}:host(.ptc-spacer-horizontal.x-small){width:4px;min-width:4px;height:100%}@media (min-width: 36em){:host(.ptc-spacer-horizontal.x-small){width:8px;min-width:8px}}:host(.ptc-spacer-horizontal.small){width:8px;min-width:8px;height:100%}@media (min-width: 36em){:host(.ptc-spacer-horizontal.small){width:12px;min-width:12px}}:host(.ptc-spacer-horizontal.medium){height:100%}:host(.ptc-spacer-horizontal.large){width:16px;min-width:16px;height:100%}@media (min-width: 36em){:host(.ptc-spacer-horizontal.large){width:20px;min-width:20px}}:host(.ptc-spacer-horizontal.x-large){width:20px;min-width:20px;height:100%}@media (min-width: 36em){:host(.ptc-spacer-horizontal.x-large){width:28px;min-width:28px}}:host(.ptc-spacer-horizontal.xx-large){width:28px;min-width:28px;height:100%}@media (min-width: 36em){:host(.ptc-spacer-horizontal.xx-large){width:36px;min-width:36px}}:host(.ptc-spacer-horizontal.xxx-large){width:36px;min-width:36px;height:100%}@media (min-width: 36em){:host(.ptc-spacer-horizontal.xxx-large){width:48px;min-width:48px}}:host(.ptc-spacer-horizontal.xxxx-large){width:48px;min-width:48px;height:100%}@media (min-width: 36em){:host(.ptc-spacer-horizontal.xxxx-large){width:72px;min-width:72px}}:host(.ptc-spacer-vertical.xx-small){width:100%;height:4px;min-height:4px}:host(.ptc-spacer-vertical.x-small){width:100%;height:4px;min-height:4px}@media (min-width: 36em){:host(.ptc-spacer-vertical.x-small){height:8px;min-height:8px}}:host(.ptc-spacer-vertical.small){width:100%;height:8px;min-height:8px}@media (min-width: 36em){:host(.ptc-spacer-vertical.small){height:12px;min-height:12px}}:host(.ptc-spacer-vertical.medium){width:100%}:host(.ptc-spacer-vertical.large){width:100%;height:16px;min-height:16px}@media (min-width: 36em){:host(.ptc-spacer-vertical.large){height:20px;min-height:20px}}:host(.ptc-spacer-vertical.x-large){width:100%;height:20px;min-height:20px}@media (min-width: 36em){:host(.ptc-spacer-vertical.x-large){height:28px;min-height:28px}}:host(.ptc-spacer-vertical.xx-large){width:100%;height:28px;min-height:28px}@media (min-width: 36em){:host(.ptc-spacer-vertical.xx-large){height:36px;min-height:36px}}:host(.ptc-spacer-vertical.xxx-large){width:100%;height:36px;min-height:36px}@media (min-width: 36em){:host(.ptc-spacer-vertical.xxx-large){height:48px;min-height:48px}}:host(.ptc-spacer-vertical.xxxx-large){width:100%;height:48px;min-height:48px}@media (min-width: 36em){:host(.ptc-spacer-vertical.xxxx-large){height:72px;min-height:72px}}:host(.ptc-spacer-vertical.space-144){width:100%;height:144px;min-height:144px}:host(.ptc-spacer-vertical.space-120){width:100%;height:120px;min-height:120px}:host(.ptc-spacer-vertical.space-128){width:100%;height:128px;min-height:128px}:host(.ptc-spacer-xx-small){display:none}@media (max-width: 22.5em){:host(.ptc-spacer-xx-small){display:block}}:host(.ptc-spacer-x-small){display:none}@media (max-width: 35.9375em){:host(.ptc-spacer-x-small){display:block}}:host(.ptc-spacer-small){display:none}@media (min-width: 36em){:host(.ptc-spacer-small){display:block}}:host(.ptc-spacer-medium){display:none}@media (min-width: 48em){:host(.ptc-spacer-medium){display:block}}:host(.ptc-spacer-large){display:none}@media (min-width: 62em){:host(.ptc-spacer-large){display:block}}:host(.ptc-spacer-x-large){display:none}@media (min-width: 64.0625em){:host(.ptc-spacer-x-large){display:block}}:host(.ptc-spacer-xx-large){display:none}@media (min-width: 76.25em){:host(.ptc-spacer-xx-large){display:block}}";
|
|
436
|
+
|
|
437
|
+
let PtcSpacer = class {
|
|
438
|
+
constructor(hostRef) {
|
|
439
|
+
index.registerInstance(this, hostRef);
|
|
440
|
+
/**
|
|
441
|
+
* Breakpoint
|
|
442
|
+
*/
|
|
443
|
+
this.breakpoint = '';
|
|
444
|
+
/**
|
|
445
|
+
* Spacing Size
|
|
446
|
+
*/
|
|
447
|
+
this.size = 'medium';
|
|
448
|
+
/**
|
|
449
|
+
* Direction
|
|
450
|
+
*/
|
|
451
|
+
this.direction = 'vertical';
|
|
452
|
+
}
|
|
453
|
+
render() {
|
|
454
|
+
const classMap = this.getCssClassMap();
|
|
455
|
+
return (index.h(index.Host, { class: classMap }));
|
|
456
|
+
}
|
|
457
|
+
getCssClassMap() {
|
|
458
|
+
return {
|
|
459
|
+
[this.size]: true,
|
|
460
|
+
['ptc-spacer-horizontal']: this.direction === 'horizontal',
|
|
461
|
+
['ptc-spacer-vertical']: this.direction === 'vertical',
|
|
462
|
+
['ptc-spacer-xx-small']: this.breakpoint === 'xx-small',
|
|
463
|
+
['ptc-spacer-x-small']: this.breakpoint === 'x-small',
|
|
464
|
+
['ptc-spacer-small']: this.breakpoint === 'small',
|
|
465
|
+
['ptc-spacer-medium']: this.breakpoint === 'medium',
|
|
466
|
+
['ptc-spacer-large']: this.breakpoint === 'large',
|
|
467
|
+
['ptc-spacer-x-large']: this.breakpoint === 'x-large',
|
|
468
|
+
['ptc-spacer-xx-large']: this.breakpoint === 'xx-large',
|
|
469
|
+
};
|
|
470
|
+
}
|
|
471
|
+
};
|
|
472
|
+
PtcSpacer.style = ptcSpacerCss;
|
|
473
|
+
|
|
474
|
+
exports.ptc_card = PtcCard;
|
|
475
|
+
exports.ptc_date = PtcDate;
|
|
476
|
+
exports.ptc_img = PtcImg;
|
|
477
|
+
exports.ptc_pagenation = PtcPagenation;
|
|
478
|
+
exports.ptc_para = PtcPara;
|
|
479
|
+
exports.ptc_spacer = PtcSpacer;
|
|
@@ -33,7 +33,7 @@ let PtcCheckbox = class {
|
|
|
33
33
|
input.checked = this.checked == 'checked';
|
|
34
34
|
}
|
|
35
35
|
render() {
|
|
36
|
-
return (index.h(index.Host, null, index.h("label", { class: "ptc-checkbox" }, index.h("slot", null), index.h("input", { type: "checkbox", checked: this.checked == "checked", name: this.inputName, value: this.value, onChange: (e) => this.handleClick(e) }), index.h("span", { class: "check" }, index.h("span", { class: "mark" }, index.h("icon-asset", { type: "ptc", size: "xx-small", name: "
|
|
36
|
+
return (index.h(index.Host, null, index.h("label", { class: "ptc-checkbox" }, index.h("slot", null), index.h("input", { type: "checkbox", checked: this.checked == "checked", name: this.inputName, value: this.value, onChange: (e) => this.handleClick(e) }), index.h("span", { class: "check" }, index.h("span", { class: "mark" }, index.h("icon-asset", { type: "ptc", size: "xx-small", name: "checkmark" }))))));
|
|
37
37
|
}
|
|
38
38
|
get host() { return index.getElement(this); }
|
|
39
39
|
};
|