npm - @ptcwebops/ptcw-design - Versions diffs - 7.0.7-upgrade → 7.0.9-upgrade - Mend

@ptcwebops/ptcw-design 7.0.7-upgrade → 7.0.9-upgrade

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.

Files changed (1014) hide show

package/dist/components/{p-C8PdAKQ6.js → p-C0uml9g4.js} RENAMED Viewed

@@ -1,5 +1,5 @@
-import { p as proxyCustomElement, H, h, d as Host } from './p-BYSv8uGQ.js';
-import { d as defineCustomElement$1 } from './p-B8tFe8Su.js';
+import { p as proxyCustomElement, H, h, d as Host } from './p-BvGlmU4v.js';
+import { d as defineCustomElement$1 } from './p-CL4G31qv.js';
 const ptcBreadcrumbCss = ".sc-ptc-breadcrumb-h{margin-top:var(--ptc-element-spacing-05);display:flex;align-items:flex-start}.sc-ptc-breadcrumb-h .visually-hidden.sc-ptc-breadcrumb{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border:0}.sc-ptc-breadcrumb-h .ptc-breadcrumb-ol.sc-ptc-breadcrumb{position:relative;list-style:none;margin:0;padding:0 0 0 22px}.sc-ptc-breadcrumb-h .ptc-breadcrumb-ol.sc-ptc-breadcrumb li.sc-ptc-breadcrumb{position:relative;display:inline;font-weight:var(--ptc-font-weight-bold);font-size:var(--ptc-font-size-xxx-small);line-height:var(--ptc-line-height-densest);word-break:initial;color:var(--color-white)}.sc-ptc-breadcrumb-h .ptc-breadcrumb-ol.sc-ptc-breadcrumb li.sc-ptc-breadcrumb::before{content:\"/\";margin:0 3px}.sc-ptc-breadcrumb-h .ptc-breadcrumb-ol.sc-ptc-breadcrumb li.home-link.sc-ptc-breadcrumb{position:absolute;left:0;margin-top:-3px}.sc-ptc-breadcrumb-h .ptc-breadcrumb-ol.sc-ptc-breadcrumb li.home-link.sc-ptc-breadcrumb::before{display:none}.sc-ptc-breadcrumb-h .ptc-breadcrumb-ol.sc-ptc-breadcrumb li.sc-ptc-breadcrumb a.sc-ptc-breadcrumb{font-weight:var(--ptc-font-weight-bold) !important;font-size:var(--ptc-font-size-xxx-small) !important;line-height:var(--ptc-line-height-densest);text-decoration:underline;text-decoration-color:transparent;text-underline-offset:2px;text-decoration-thickness:1px;outline:none;transition:text-decoration-color var(--ptc-transition-medium) var(--ptc-ease-inout);color:var(--color-white)}.sc-ptc-breadcrumb-h .ptc-breadcrumb-ol.sc-ptc-breadcrumb li.sc-ptc-breadcrumb a.sc-ptc-breadcrumb:active{transition:none}.sc-ptc-breadcrumb-h .ptc-breadcrumb-ol.sc-ptc-breadcrumb li.sc-ptc-breadcrumb a.sc-ptc-breadcrumb:hover{text-decoration:underline;text-decoration-color:var(--color-green-07);outline:none}.sc-ptc-breadcrumb-h .ptc-breadcrumb-ol.sc-ptc-breadcrumb li.sc-ptc-breadcrumb a.breadcrumb-item-link.sc-ptc-breadcrumb:focus-visible{border-radius:var(--ptc-border-radius-standard);border:2px solid rgb(255, 255, 255);outline:5px solid var(--keyboard-nav-outline);display:inline-block}.sc-ptc-breadcrumb-h .ptc-breadcrumb-ol.sc-ptc-breadcrumb li.sc-ptc-breadcrumb a.breadcrumb-item-link.sc-ptc-breadcrumb:focus-visible.dark-mode-link:focus-visible{border-radius:var(--ptc-border-radius-standard);outline:5px solid var(--keyboard-nav-outline)}.white.sc-ptc-breadcrumb-h .ptc-breadcrumb-ol.sc-ptc-breadcrumb li.sc-ptc-breadcrumb{color:var(--color-white)}.white.sc-ptc-breadcrumb-h .ptc-breadcrumb-ol.sc-ptc-breadcrumb li.sc-ptc-breadcrumb a.sc-ptc-breadcrumb{color:var(--color-white)}.black.sc-ptc-breadcrumb-h .ptc-breadcrumb-ol.sc-ptc-breadcrumb li.sc-ptc-breadcrumb{color:var(--color-black)}.black.sc-ptc-breadcrumb-h .ptc-breadcrumb-ol.sc-ptc-breadcrumb li.sc-ptc-breadcrumb a.sc-ptc-breadcrumb{color:var(--color-black)}.ptc-green.sc-ptc-breadcrumb-h .ptc-breadcrumb-ol.sc-ptc-breadcrumb li.sc-ptc-breadcrumb{color:var(--color-green-07)}.ptc-green.sc-ptc-breadcrumb-h .ptc-breadcrumb-ol.sc-ptc-breadcrumb li.sc-ptc-breadcrumb a.sc-ptc-breadcrumb{color:var(--color-green-07)}.gray.sc-ptc-breadcrumb-h .ptc-breadcrumb-ol.sc-ptc-breadcrumb li.sc-ptc-breadcrumb{color:var(--color-gray-06)}.gray.sc-ptc-breadcrumb-h .ptc-breadcrumb-ol.sc-ptc-breadcrumb li.sc-ptc-breadcrumb a.sc-ptc-breadcrumb{color:var(--color-gray-06)}.light-gray.sc-ptc-breadcrumb-h .ptc-breadcrumb-ol.sc-ptc-breadcrumb li.sc-ptc-breadcrumb{color:var(--color-gray-05)}.light-gray.sc-ptc-breadcrumb-h .ptc-breadcrumb-ol.sc-ptc-breadcrumb li.sc-ptc-breadcrumb a.sc-ptc-breadcrumb{color:var(--color-gray-05)}.primary-gray.sc-ptc-breadcrumb-h .ptc-breadcrumb-ol.sc-ptc-breadcrumb li.sc-ptc-breadcrumb{color:var(--color-gray-10)}.primary-gray.sc-ptc-breadcrumb-h .ptc-breadcrumb-ol.sc-ptc-breadcrumb li.sc-ptc-breadcrumb a.sc-ptc-breadcrumb{color:var(--color-gray-10)}.left.sc-ptc-breadcrumb-h{display:flex;justify-content:flex-start;align-items:flex-end}.center.sc-ptc-breadcrumb-h{display:flex;justify-content:center}.center.sc-ptc-breadcrumb-h .ptc-breadcrumb-ol.sc-ptc-breadcrumb{padding:0;text-align:center}.center.sc-ptc-breadcrumb-h .ptc-breadcrumb-ol.sc-ptc-breadcrumb li.sc-ptc-breadcrumb{display:inline-block}.center.sc-ptc-breadcrumb-h .ptc-breadcrumb-ol.sc-ptc-breadcrumb li.home-link.sc-ptc-breadcrumb{position:relative;left:auto;margin-top:0;vertical-align:text-bottom;margin-bottom:-1px}.right.sc-ptc-breadcrumb-h{display:flex;justify-content:flex-end}.remove-top-margin.sc-ptc-breadcrumb-h{margin-top:0px !important}";
@@ -103,6 +103,6 @@ function defineCustomElement() {
 defineCustomElement();
 export { PtcBreadcrumb as P, defineCustomElement as d };
-//# sourceMappingURL=p-C8PdAKQ6.js.map
+//# sourceMappingURL=p-C0uml9g4.js.map
-//# sourceMappingURL=p-C8PdAKQ6.js.map
+//# sourceMappingURL=p-C0uml9g4.js.map

package/dist/components/{p-C8PdAKQ6.js.map → p-C0uml9g4.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"file":"p-C8PdAKQ6.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/molecules/ptc-breadcrumb/ptc-breadcrumb.scss?tag=ptc-breadcrumb&encapsulation=scoped","src/components/molecules/ptc-breadcrumb/ptc-breadcrumb.tsx"],"sourcesContent":["@use 'mixins' as ;\r\n\r\n:host {\r\n\tmargin-top: var(--ptc-element-spacing-05);\r\n\tdisplay: flex;\r\n\talign-items: flex-start;\r\n\r\n\t.visually-hidden {\r\n\t\tposition: absolute;\r\n\t\twidth: 1px;\r\n\t\theight: 1px;\r\n\t\tpadding: 0;\r\n\t\tmargin: -1px;\r\n\t\toverflow: hidden;\r\n\t\tclip: rect(0, 0, 0, 0);\r\n\t\twhite-space: nowrap;\r\n\t\tborder: 0;\r\n\t}\r\n\r\n\t.ptc-breadcrumb-ol {\r\n\t\tposition: relative;\r\n\t\tlist-style: none;\r\n\t\tmargin: 0;\r\n\t\tpadding: 0 0 0 22px;\r\n\r\n\t\tli {\r\n\t\t\tposition: relative;\r\n\t\t\tdisplay: inline;\r\n\t\t\tfont-weight: var(--ptc-font-weight-bold);\r\n\t\t\tfont-size: var(--ptc-font-size-xxx-small);\r\n\t\t\tline-height: var(--ptc-line-height-densest);\r\n\t\t\tword-break: initial;\r\n\t\t\tcolor: var(--color-white);\r\n\r\n\t\t\t&::before {\r\n\t\t\t\tcontent: \"/\";\r\n\t\t\t\tmargin: 0 3px;\r\n\t\t\t}\r\n\r\n\t\t\t&.home-link {\r\n\t\t\t\tposition: absolute;\r\n\t\t\t\tleft: 0;\r\n\t\t\t\tmargin-top: -3px;\r\n\r\n\t\t\t\t&::before {\r\n\t\t\t\t\tdisplay: none;\r\n\t\t\t\t}\r\n\t\t\t}\r\n\r\n\t\t\ta {\r\n\t\t\t\tfont-weight: var(--ptc-font-weight-bold) !important;\r\n\t\t\t\tfont-size: var(--ptc-font-size-xxx-small) !important;\r\n\t\t\t\tline-height: var(--ptc-line-height-densest);\r\n\t\t\t\ttext-decoration: underline;\r\n\t\t\t\ttext-decoration-color: transparent;\r\n\t\t\t\ttext-underline-offset: 2px;\r\n\t\t\t\ttext-decoration-thickness: 1px;\r\n\t\t\t\toutline: none;\r\n\t\t\t\ttransition: text-decoration-color var(--ptc-transition-medium)\r\n\t\t\t\t\tvar(--ptc-ease-inout);\r\n\t\t\t\tcolor: var(--color-white);\r\n\r\n\t\t\t\t&:active {\r\n\t\t\t\t\ttransition: none;\r\n\t\t\t\t}\r\n\r\n\t\t\t\t&:hover {\r\n\t\t\t\t\ttext-decoration: underline;\r\n\t\t\t\t\ttext-decoration-color: var(--color-green-07);\r\n\t\t\t\t\toutline: none;\r\n\t\t\t\t}\r\n\r\n\t\t\t\t&.breadcrumb-item-link:focus-visible {\r\n\t\t\t\t\t//outline: 5px solid var(--keyboard-nav-outline) !important;\r\n\t\t\t\t\t//outline-offset: 0px !important;\r\n\t\t\t\t\t//border-radius: var(--ptc-border-radius-standard);\r\n\t\t\t\t\t@include focus-state;\r\n\t\t\t\t\tdisplay: inline-block;\r\n\r\n\t\t\t\t\t&.dark-mode-link:focus-visible {\r\n\t\t\t\t\t\t//outline-offset: 2px !important;\r\n\t\t\t\t\t\t//box-shadow: 0px 0px 0px 2px var(--color-white);\r\n\t\t\t\t\t\t@include base-focus-state;\r\n\t\t\t\t\t}\r\n\t\t\t\t}\r\n\t\t\t}\r\n\t\t}\r\n\t}\r\n\r\n\t&.white {\r\n\t\t.ptc-breadcrumb-ol {\r\n\t\t\tli {\r\n\t\t\t\tcolor: var(--color-white);\r\n\r\n\t\t\t\ta {\r\n\t\t\t\t\tcolor: var(--color-white);\r\n\t\t\t\t}\r\n\t\t\t}\r\n\t\t}\r\n\t}\r\n\r\n\t&.black {\r\n\t\t.ptc-breadcrumb-ol {\r\n\t\t\tli {\r\n\t\t\t\tcolor: var(--color-black);\r\n\r\n\t\t\t\ta {\r\n\t\t\t\t\tcolor: var(--color-black);\r\n\t\t\t\t}\r\n\t\t\t}\r\n\t\t}\r\n\t}\r\n\r\n\t&.ptc-green {\r\n\t\t.ptc-breadcrumb-ol {\r\n\t\t\tli {\r\n\t\t\t\tcolor: var(--color-green-07);\r\n\r\n\t\t\t\ta {\r\n\t\t\t\t\tcolor: var(--color-green-07);\r\n\t\t\t\t}\r\n\t\t\t}\r\n\t\t}\r\n\t}\r\n\r\n\t&.gray {\r\n\t\t.ptc-breadcrumb-ol {\r\n\t\t\tli {\r\n\t\t\t\tcolor: var(--color-gray-06);\r\n\r\n\t\t\t\ta {\r\n\t\t\t\t\tcolor: var(--color-gray-06);\r\n\t\t\t\t}\r\n\t\t\t}\r\n\t\t}\r\n\t}\r\n\r\n\t&.light-gray {\r\n\t\t.ptc-breadcrumb-ol {\r\n\t\t\tli {\r\n\t\t\t\tcolor: var(--color-gray-05);\r\n\r\n\t\t\t\ta {\r\n\t\t\t\t\tcolor: var(--color-gray-05);\r\n\t\t\t\t}\r\n\t\t\t}\r\n\t\t}\r\n\t}\r\n\r\n\t&.primary-gray {\r\n\t\t.ptc-breadcrumb-ol {\r\n\t\t\tli {\r\n\t\t\t\tcolor: var(--color-gray-10);\r\n\r\n\t\t\t\ta {\r\n\t\t\t\t\tcolor: var(--color-gray-10);\r\n\t\t\t\t}\r\n\t\t\t}\r\n\t\t}\r\n\t}\r\n}\r\n\r\n:host(.left) {\r\n\tdisplay: flex;\r\n\tjustify-content: flex-start;\r\n\talign-items: flex-end;\r\n}\r\n\r\n:host(.center) {\r\n\tdisplay: flex;\r\n\tjustify-content: center;\r\n\r\n\t.ptc-breadcrumb-ol {\r\n\t\tpadding: 0;\r\n\t\ttext-align: center;\r\n\r\n\t\tli {\r\n\t\t\tdisplay: inline-block;\r\n\r\n\t\t\t&.home-link {\r\n\t\t\t\tposition: relative;\r\n\t\t\t\tleft: auto;\r\n\t\t\t\tmargin-top: 0;\r\n\t\t\t\tvertical-align: text-bottom;\r\n\t\t\t\tmargin-bottom: -1px;\r\n\t\t\t}\r\n\t\t}\r\n\t}\r\n}\r\n\r\n:host(.right) {\r\n\tdisplay: flex;\r\n\tjustify-content: flex-end;\r\n}\r\n\r\n:host(.remove-top-margin) {\r\n\tmargin-top: 0px !important;\r\n}\r\n","import { Component, Host, h, Prop, Element } from \"@stencil/core\";\r\nimport { CssClassMap } from \"../../../utils/interfaces\";\r\n\r\n@Component({\r\n\ttag: \"ptc-breadcrumb\",\r\n\tstyleUrl: \"ptc-breadcrumb.scss\",\r\n\tscoped: true,\r\n})\r\nexport class PtcBreadcrumb {\r\n\t/\r\n\t breadcrumb position\r\n\t /\r\n\t@Prop() position?: \"left\" \| \"center\" \| \"right\";\r\n\t/\r\n\t remove topMargin\r\n\t /\r\n\t@Prop() removeTopMargin: boolean = false;\r\n\t/\r\n\t Theme Color\r\n\t /\r\n\t@Prop() color:\r\n\t\t\| \"black\"\r\n\t\t\| \"white\"\r\n\t\t\| \"ptc-green\"\r\n\t\t\| \"gray\"\r\n\t\t\| \"light-gray\"\r\n\t\t\| \"primary-gray\"\r\n\t\t\| \"default\"\r\n\t\t\| \"inherit\" = \"white\";\r\n\t/\r\n\t Dark Mode for Tab Index\r\n\t /\r\n\t@Prop() isDarkMode: boolean = false;\r\n\t/\r\n\t (optional) Injected CSS styles\r\n\t */\r\n\t@Prop() styles?: string;\r\n\r\n\t@Prop() type?: string;\r\n\r\n\t@Element() hostElement: HTMLElement;\r\n\r\n\tlistItems: any;\r\n\r\n\tcomponentWillLoad() {\r\n\t\tthis.listItems = this.hostElement.querySelectorAll(\"list-item\");\r\n\t}\r\n\r\n\tcomponentDidLoad() {\r\n\t\tif (this.listItems) {\r\n\t\t\tthis.hostElement.querySelectorAll(\"list-item\").forEach((item) => {\r\n\t\t\t\titem.remove();\r\n\t\t\t});\r\n\t\t}\r\n\t}\r\n\r\n\trender() {\r\n\t\tconst classMap = this.getCssClassMap();\r\n\t\t//const childListItems: any = this.listItems[0].getAttribute(\"list-type\") === \"home\" && this.listItems[0].getAttribute(\"link-href\") !== \"\" ? Array.from(this.listItems).slice(1) : this.listItems;\r\n\t\tconst childListItems: HTMLElement[] = Array.from(this.listItems as NodeListOf<HTMLElement>).filter(\r\n\t\t\t(item: HTMLElement) => item.getAttribute(\"list-type\") === \"home\" && this.listItems[0].getAttribute(\"link-href\") !== \"\"\r\n\t\t);\r\n\t\tconst hasChildListItems = childListItems.length > 0;\r\n\t\t// Remove childListItems from listItems if any exist\r\n\t\tconst filteredArray = hasChildListItems ? Array.from(this.listItems).filter((item: HTMLElement) => !childListItems.includes(item)) : Array.from(this.listItems);\r\n\t\treturn (\r\n\t\t\t<Host class={classMap}>\r\n\t\t\t\t{this.styles && <style>{this.styles}</style>}\r\n\t\t\t\t<nav aria-label=\"Breadcrumb\">\r\n\t\t\t\t\t<ol class=\"ptc-breadcrumb-ol\">\r\n\t\t\t\t\t\t<li class=\"home-link mf-listen\" id=\"homeLinkID\">\r\n\t\t\t\t\t\t\t{hasChildListItems ? (\r\n\t\t\t\t\t\t\t\t<a\r\n\t\t\t\t\t\t\t\t\thref={childListItems[0].getAttribute(\"link-href\")}\r\n\t\t\t\t\t\t\t\t\taria-label=\"Home Link\"\r\n\t\t\t\t\t\t\t\t\tclass={{\r\n\t\t\t\t\t\t\t\t\t\t[\"breadcrumb-item-link\"]: true,\r\n\t\t\t\t\t\t\t\t\t\t[\"dark-mode-link\"]: this.isDarkMode,\r\n\t\t\t\t\t\t\t\t\t}}\r\n\t\t\t\t\t\t\t\t>\r\n\t\t\t\t\t\t\t\t\t<icon-asset\r\n\t\t\t\t\t\t\t\t\t\ttype=\"ptc\"\r\n\t\t\t\t\t\t\t\t\t\tsize=\"medium\"\r\n\t\t\t\t\t\t\t\t\t\tname=\"icon-home\"\r\n\t\t\t\t\t\t\t\t\t\tcolor={this.color}\r\n\t\t\t\t\t\t\t\t\t></icon-asset>\r\n\t\t\t\t\t\t\t\t</a>)\r\n\t\t\t\t\t\t\t: (\r\n\t\t\t\t\t\t\t\t<a\r\n\t\t\t\t\t\t\t\thref=\"/\"\r\n\t\t\t\t\t\t\t\taria-label=\"Home Link\"\r\n\t\t\t\t\t\t\t\tclass={{\r\n\t\t\t\t\t\t\t\t\t[\"breadcrumb-item-link\"]: true,\r\n\t\t\t\t\t\t\t\t\t[\"dark-mode-link\"]: this.isDarkMode,\r\n\t\t\t\t\t\t\t\t}}\r\n\t\t\t\t\t\t\t\t>\r\n\t\t\t\t\t\t\t\t\t<icon-asset\r\n\t\t\t\t\t\t\t\t\t\ttype=\"ptc\"\r\n\t\t\t\t\t\t\t\t\t\tsize=\"medium\"\r\n\t\t\t\t\t\t\t\t\t\tname=\"icon-home\"\r\n\t\t\t\t\t\t\t\t\t\tcolor={this.color}\r\n\t\t\t\t\t\t\t\t\t></icon-asset>\r\n\t\t\t\t\t\t\t\t</a>\r\n\t\t\t\t\t\t\t)}\r\n\t\t\t\t\t\t</li>\r\n\t\t\t\t\t\t{filteredArray.map(\r\n\t\t\t\t\t\t\t(item: HTMLElement, index, array) => {\r\n\t\t\t\t\t\t\t\tconst textContent = item.textContent.trim();\r\n\t\t\t\t\t\t\t\tconst href = item.getAttribute(\"link-href\");\r\n\t\t\t\t\t\t\t\treturn (\r\n\t\t\t\t\t\t\t\t\t<li\r\n\t\t\t\t\t\t\t\t\t\tkey={index}\r\n\t\t\t\t\t\t\t\t\t\tclass=\"mf-listen\"\r\n\t\t\t\t\t\t\t\t\t\tid={`breadcrumb` + index + `ID`}\r\n\t\t\t\t\t\t\t\t\t>\r\n\t\t\t\t\t\t\t\t\t\t{index < array.length - 1 ? (\r\n\t\t\t\t\t\t\t\t\t\t\t<a\r\n\t\t\t\t\t\t\t\t\t\t\t\thref={href}\r\n\t\t\t\t\t\t\t\t\t\t\t\ttarget=\"_self\"\r\n\t\t\t\t\t\t\t\t\t\t\t\tclass={{\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t[\"breadcrumb-item-link\"]:\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\ttrue,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t[\"dark-mode-link\"]:\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tthis.isDarkMode,\r\n\t\t\t\t\t\t\t\t\t\t\t\t}}\r\n\t\t\t\t\t\t\t\t\t\t\t>\r\n\t\t\t\t\t\t\t\t\t\t\t\t{textContent}\r\n\t\t\t\t\t\t\t\t\t\t\t</a>\r\n\t\t\t\t\t\t\t\t\t\t) : (\r\n\t\t\t\t\t\t\t\t\t\t\ttextContent\r\n\t\t\t\t\t\t\t\t\t\t)}\r\n\r\n\t\t\t\t\t\t\t\t\t\t{/ for screen readers */}\r\n\t\t\t\t\t\t\t\t\t\t<span class=\"visually-hidden\">/</span>\r\n\t\t\t\t\t\t\t\t\t</li>\r\n\t\t\t\t\t\t\t\t);\r\n\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t)}\r\n\t\t\t\t\t</ol>\r\n\t\t\t\t</nav>\r\n\t\t\t</Host>\r\n\t\t);\r\n\t}\r\n\r\n\tprivate getCssClassMap(): CssClassMap {\r\n\t\treturn {\r\n\t\t\t[this.position]:\r\n\t\t\t\t!!this.position && this.position !== undefined ? true : false,\r\n\t\t\t[\"remove-top-margin\"]: this.removeTopMargin ? true : false,\r\n\t\t\t[this.color]: true,\r\n\t\t};\r\n\t}\r\n}\r\n"],"version":3}
1	+ {"file":"p-C0uml9g4.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/molecules/ptc-breadcrumb/ptc-breadcrumb.scss?tag=ptc-breadcrumb&encapsulation=scoped","src/components/molecules/ptc-breadcrumb/ptc-breadcrumb.tsx"],"sourcesContent":["@use 'mixins' as ;\r\n\r\n:host {\r\n\tmargin-top: var(--ptc-element-spacing-05);\r\n\tdisplay: flex;\r\n\talign-items: flex-start;\r\n\r\n\t.visually-hidden {\r\n\t\tposition: absolute;\r\n\t\twidth: 1px;\r\n\t\theight: 1px;\r\n\t\tpadding: 0;\r\n\t\tmargin: -1px;\r\n\t\toverflow: hidden;\r\n\t\tclip: rect(0, 0, 0, 0);\r\n\t\twhite-space: nowrap;\r\n\t\tborder: 0;\r\n\t}\r\n\r\n\t.ptc-breadcrumb-ol {\r\n\t\tposition: relative;\r\n\t\tlist-style: none;\r\n\t\tmargin: 0;\r\n\t\tpadding: 0 0 0 22px;\r\n\r\n\t\tli {\r\n\t\t\tposition: relative;\r\n\t\t\tdisplay: inline;\r\n\t\t\tfont-weight: var(--ptc-font-weight-bold);\r\n\t\t\tfont-size: var(--ptc-font-size-xxx-small);\r\n\t\t\tline-height: var(--ptc-line-height-densest);\r\n\t\t\tword-break: initial;\r\n\t\t\tcolor: var(--color-white);\r\n\r\n\t\t\t&::before {\r\n\t\t\t\tcontent: \"/\";\r\n\t\t\t\tmargin: 0 3px;\r\n\t\t\t}\r\n\r\n\t\t\t&.home-link {\r\n\t\t\t\tposition: absolute;\r\n\t\t\t\tleft: 0;\r\n\t\t\t\tmargin-top: -3px;\r\n\r\n\t\t\t\t&::before {\r\n\t\t\t\t\tdisplay: none;\r\n\t\t\t\t}\r\n\t\t\t}\r\n\r\n\t\t\ta {\r\n\t\t\t\tfont-weight: var(--ptc-font-weight-bold) !important;\r\n\t\t\t\tfont-size: var(--ptc-font-size-xxx-small) !important;\r\n\t\t\t\tline-height: var(--ptc-line-height-densest);\r\n\t\t\t\ttext-decoration: underline;\r\n\t\t\t\ttext-decoration-color: transparent;\r\n\t\t\t\ttext-underline-offset: 2px;\r\n\t\t\t\ttext-decoration-thickness: 1px;\r\n\t\t\t\toutline: none;\r\n\t\t\t\ttransition: text-decoration-color var(--ptc-transition-medium)\r\n\t\t\t\t\tvar(--ptc-ease-inout);\r\n\t\t\t\tcolor: var(--color-white);\r\n\r\n\t\t\t\t&:active {\r\n\t\t\t\t\ttransition: none;\r\n\t\t\t\t}\r\n\r\n\t\t\t\t&:hover {\r\n\t\t\t\t\ttext-decoration: underline;\r\n\t\t\t\t\ttext-decoration-color: var(--color-green-07);\r\n\t\t\t\t\toutline: none;\r\n\t\t\t\t}\r\n\r\n\t\t\t\t&.breadcrumb-item-link:focus-visible {\r\n\t\t\t\t\t//outline: 5px solid var(--keyboard-nav-outline) !important;\r\n\t\t\t\t\t//outline-offset: 0px !important;\r\n\t\t\t\t\t//border-radius: var(--ptc-border-radius-standard);\r\n\t\t\t\t\t@include focus-state;\r\n\t\t\t\t\tdisplay: inline-block;\r\n\r\n\t\t\t\t\t&.dark-mode-link:focus-visible {\r\n\t\t\t\t\t\t//outline-offset: 2px !important;\r\n\t\t\t\t\t\t//box-shadow: 0px 0px 0px 2px var(--color-white);\r\n\t\t\t\t\t\t@include base-focus-state;\r\n\t\t\t\t\t}\r\n\t\t\t\t}\r\n\t\t\t}\r\n\t\t}\r\n\t}\r\n\r\n\t&.white {\r\n\t\t.ptc-breadcrumb-ol {\r\n\t\t\tli {\r\n\t\t\t\tcolor: var(--color-white);\r\n\r\n\t\t\t\ta {\r\n\t\t\t\t\tcolor: var(--color-white);\r\n\t\t\t\t}\r\n\t\t\t}\r\n\t\t}\r\n\t}\r\n\r\n\t&.black {\r\n\t\t.ptc-breadcrumb-ol {\r\n\t\t\tli {\r\n\t\t\t\tcolor: var(--color-black);\r\n\r\n\t\t\t\ta {\r\n\t\t\t\t\tcolor: var(--color-black);\r\n\t\t\t\t}\r\n\t\t\t}\r\n\t\t}\r\n\t}\r\n\r\n\t&.ptc-green {\r\n\t\t.ptc-breadcrumb-ol {\r\n\t\t\tli {\r\n\t\t\t\tcolor: var(--color-green-07);\r\n\r\n\t\t\t\ta {\r\n\t\t\t\t\tcolor: var(--color-green-07);\r\n\t\t\t\t}\r\n\t\t\t}\r\n\t\t}\r\n\t}\r\n\r\n\t&.gray {\r\n\t\t.ptc-breadcrumb-ol {\r\n\t\t\tli {\r\n\t\t\t\tcolor: var(--color-gray-06);\r\n\r\n\t\t\t\ta {\r\n\t\t\t\t\tcolor: var(--color-gray-06);\r\n\t\t\t\t}\r\n\t\t\t}\r\n\t\t}\r\n\t}\r\n\r\n\t&.light-gray {\r\n\t\t.ptc-breadcrumb-ol {\r\n\t\t\tli {\r\n\t\t\t\tcolor: var(--color-gray-05);\r\n\r\n\t\t\t\ta {\r\n\t\t\t\t\tcolor: var(--color-gray-05);\r\n\t\t\t\t}\r\n\t\t\t}\r\n\t\t}\r\n\t}\r\n\r\n\t&.primary-gray {\r\n\t\t.ptc-breadcrumb-ol {\r\n\t\t\tli {\r\n\t\t\t\tcolor: var(--color-gray-10);\r\n\r\n\t\t\t\ta {\r\n\t\t\t\t\tcolor: var(--color-gray-10);\r\n\t\t\t\t}\r\n\t\t\t}\r\n\t\t}\r\n\t}\r\n}\r\n\r\n:host(.left) {\r\n\tdisplay: flex;\r\n\tjustify-content: flex-start;\r\n\talign-items: flex-end;\r\n}\r\n\r\n:host(.center) {\r\n\tdisplay: flex;\r\n\tjustify-content: center;\r\n\r\n\t.ptc-breadcrumb-ol {\r\n\t\tpadding: 0;\r\n\t\ttext-align: center;\r\n\r\n\t\tli {\r\n\t\t\tdisplay: inline-block;\r\n\r\n\t\t\t&.home-link {\r\n\t\t\t\tposition: relative;\r\n\t\t\t\tleft: auto;\r\n\t\t\t\tmargin-top: 0;\r\n\t\t\t\tvertical-align: text-bottom;\r\n\t\t\t\tmargin-bottom: -1px;\r\n\t\t\t}\r\n\t\t}\r\n\t}\r\n}\r\n\r\n:host(.right) {\r\n\tdisplay: flex;\r\n\tjustify-content: flex-end;\r\n}\r\n\r\n:host(.remove-top-margin) {\r\n\tmargin-top: 0px !important;\r\n}\r\n","import { Component, Host, h, Prop, Element } from \"@stencil/core\";\r\nimport { CssClassMap } from \"../../../utils/interfaces\";\r\n\r\n@Component({\r\n\ttag: \"ptc-breadcrumb\",\r\n\tstyleUrl: \"ptc-breadcrumb.scss\",\r\n\tscoped: true,\r\n})\r\nexport class PtcBreadcrumb {\r\n\t/\r\n\t breadcrumb position\r\n\t /\r\n\t@Prop() position?: \"left\" \| \"center\" \| \"right\";\r\n\t/\r\n\t remove topMargin\r\n\t /\r\n\t@Prop() removeTopMargin: boolean = false;\r\n\t/\r\n\t Theme Color\r\n\t /\r\n\t@Prop() color:\r\n\t\t\| \"black\"\r\n\t\t\| \"white\"\r\n\t\t\| \"ptc-green\"\r\n\t\t\| \"gray\"\r\n\t\t\| \"light-gray\"\r\n\t\t\| \"primary-gray\"\r\n\t\t\| \"default\"\r\n\t\t\| \"inherit\" = \"white\";\r\n\t/\r\n\t Dark Mode for Tab Index\r\n\t /\r\n\t@Prop() isDarkMode: boolean = false;\r\n\t/\r\n\t (optional) Injected CSS styles\r\n\t */\r\n\t@Prop() styles?: string;\r\n\r\n\t@Prop() type?: string;\r\n\r\n\t@Element() hostElement: HTMLElement;\r\n\r\n\tlistItems: any;\r\n\r\n\tcomponentWillLoad() {\r\n\t\tthis.listItems = this.hostElement.querySelectorAll(\"list-item\");\r\n\t}\r\n\r\n\tcomponentDidLoad() {\r\n\t\tif (this.listItems) {\r\n\t\t\tthis.hostElement.querySelectorAll(\"list-item\").forEach((item) => {\r\n\t\t\t\titem.remove();\r\n\t\t\t});\r\n\t\t}\r\n\t}\r\n\r\n\trender() {\r\n\t\tconst classMap = this.getCssClassMap();\r\n\t\t//const childListItems: any = this.listItems[0].getAttribute(\"list-type\") === \"home\" && this.listItems[0].getAttribute(\"link-href\") !== \"\" ? Array.from(this.listItems).slice(1) : this.listItems;\r\n\t\tconst childListItems: HTMLElement[] = Array.from(this.listItems as NodeListOf<HTMLElement>).filter(\r\n\t\t\t(item: HTMLElement) => item.getAttribute(\"list-type\") === \"home\" && this.listItems[0].getAttribute(\"link-href\") !== \"\"\r\n\t\t);\r\n\t\tconst hasChildListItems = childListItems.length > 0;\r\n\t\t// Remove childListItems from listItems if any exist\r\n\t\tconst filteredArray = hasChildListItems ? Array.from(this.listItems).filter((item: HTMLElement) => !childListItems.includes(item)) : Array.from(this.listItems);\r\n\t\treturn (\r\n\t\t\t<Host class={classMap}>\r\n\t\t\t\t{this.styles && <style>{this.styles}</style>}\r\n\t\t\t\t<nav aria-label=\"Breadcrumb\">\r\n\t\t\t\t\t<ol class=\"ptc-breadcrumb-ol\">\r\n\t\t\t\t\t\t<li class=\"home-link mf-listen\" id=\"homeLinkID\">\r\n\t\t\t\t\t\t\t{hasChildListItems ? (\r\n\t\t\t\t\t\t\t\t<a\r\n\t\t\t\t\t\t\t\t\thref={childListItems[0].getAttribute(\"link-href\")}\r\n\t\t\t\t\t\t\t\t\taria-label=\"Home Link\"\r\n\t\t\t\t\t\t\t\t\tclass={{\r\n\t\t\t\t\t\t\t\t\t\t[\"breadcrumb-item-link\"]: true,\r\n\t\t\t\t\t\t\t\t\t\t[\"dark-mode-link\"]: this.isDarkMode,\r\n\t\t\t\t\t\t\t\t\t}}\r\n\t\t\t\t\t\t\t\t>\r\n\t\t\t\t\t\t\t\t\t<icon-asset\r\n\t\t\t\t\t\t\t\t\t\ttype=\"ptc\"\r\n\t\t\t\t\t\t\t\t\t\tsize=\"medium\"\r\n\t\t\t\t\t\t\t\t\t\tname=\"icon-home\"\r\n\t\t\t\t\t\t\t\t\t\tcolor={this.color}\r\n\t\t\t\t\t\t\t\t\t></icon-asset>\r\n\t\t\t\t\t\t\t\t</a>)\r\n\t\t\t\t\t\t\t: (\r\n\t\t\t\t\t\t\t\t<a\r\n\t\t\t\t\t\t\t\thref=\"/\"\r\n\t\t\t\t\t\t\t\taria-label=\"Home Link\"\r\n\t\t\t\t\t\t\t\tclass={{\r\n\t\t\t\t\t\t\t\t\t[\"breadcrumb-item-link\"]: true,\r\n\t\t\t\t\t\t\t\t\t[\"dark-mode-link\"]: this.isDarkMode,\r\n\t\t\t\t\t\t\t\t}}\r\n\t\t\t\t\t\t\t\t>\r\n\t\t\t\t\t\t\t\t\t<icon-asset\r\n\t\t\t\t\t\t\t\t\t\ttype=\"ptc\"\r\n\t\t\t\t\t\t\t\t\t\tsize=\"medium\"\r\n\t\t\t\t\t\t\t\t\t\tname=\"icon-home\"\r\n\t\t\t\t\t\t\t\t\t\tcolor={this.color}\r\n\t\t\t\t\t\t\t\t\t></icon-asset>\r\n\t\t\t\t\t\t\t\t</a>\r\n\t\t\t\t\t\t\t)}\r\n\t\t\t\t\t\t</li>\r\n\t\t\t\t\t\t{filteredArray.map(\r\n\t\t\t\t\t\t\t(item: HTMLElement, index, array) => {\r\n\t\t\t\t\t\t\t\tconst textContent = item.textContent.trim();\r\n\t\t\t\t\t\t\t\tconst href = item.getAttribute(\"link-href\");\r\n\t\t\t\t\t\t\t\treturn (\r\n\t\t\t\t\t\t\t\t\t<li\r\n\t\t\t\t\t\t\t\t\t\tkey={index}\r\n\t\t\t\t\t\t\t\t\t\tclass=\"mf-listen\"\r\n\t\t\t\t\t\t\t\t\t\tid={`breadcrumb` + index + `ID`}\r\n\t\t\t\t\t\t\t\t\t>\r\n\t\t\t\t\t\t\t\t\t\t{index < array.length - 1 ? (\r\n\t\t\t\t\t\t\t\t\t\t\t<a\r\n\t\t\t\t\t\t\t\t\t\t\t\thref={href}\r\n\t\t\t\t\t\t\t\t\t\t\t\ttarget=\"_self\"\r\n\t\t\t\t\t\t\t\t\t\t\t\tclass={{\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t[\"breadcrumb-item-link\"]:\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\ttrue,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t[\"dark-mode-link\"]:\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tthis.isDarkMode,\r\n\t\t\t\t\t\t\t\t\t\t\t\t}}\r\n\t\t\t\t\t\t\t\t\t\t\t>\r\n\t\t\t\t\t\t\t\t\t\t\t\t{textContent}\r\n\t\t\t\t\t\t\t\t\t\t\t</a>\r\n\t\t\t\t\t\t\t\t\t\t) : (\r\n\t\t\t\t\t\t\t\t\t\t\ttextContent\r\n\t\t\t\t\t\t\t\t\t\t)}\r\n\r\n\t\t\t\t\t\t\t\t\t\t{/ for screen readers */}\r\n\t\t\t\t\t\t\t\t\t\t<span class=\"visually-hidden\">/</span>\r\n\t\t\t\t\t\t\t\t\t</li>\r\n\t\t\t\t\t\t\t\t);\r\n\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t)}\r\n\t\t\t\t\t</ol>\r\n\t\t\t\t</nav>\r\n\t\t\t</Host>\r\n\t\t);\r\n\t}\r\n\r\n\tprivate getCssClassMap(): CssClassMap {\r\n\t\treturn {\r\n\t\t\t[this.position]:\r\n\t\t\t\t!!this.position && this.position !== undefined ? true : false,\r\n\t\t\t[\"remove-top-margin\"]: this.removeTopMargin ? true : false,\r\n\t\t\t[this.color]: true,\r\n\t\t};\r\n\t}\r\n}\r\n"],"version":3}

package/dist/components/{p-20376fPh.js → p-C42Dg7zS.js} RENAMED Viewed

@@ -1,7 +1,7 @@
-import { p as proxyCustomElement, H, e as createEvent, h, d as Host, a as getAssetPath } from './p-BYSv8uGQ.js';
-import { d as defineCustomElement$3 } from './p-CgrombOd.js';
-import { d as defineCustomElement$2 } from './p-BvqX8A4Z.js';
-import { d as defineCustomElement$1 } from './p-eNu33ocq.js';
+import { p as proxyCustomElement, H, e as createEvent, h, d as Host, a as getAssetPath } from './p-BvGlmU4v.js';
+import { d as defineCustomElement$3 } from './p-EcTA3sjE.js';
+import { d as defineCustomElement$2 } from './p-Cmek7vlD.js';
+import { d as defineCustomElement$1 } from './p-CUXDowVt.js';
 const ptcDynamicCardCss = ":host{display:block}:host(.sequential) .card-wrapper{position:relative;cursor:pointer;outline:none}:host(.sequential) .card-wrapper:focus-visible{transition:none;border-radius:var(--ptc-border-radius-standard);outline:5px solid var(--keyboard-nav-outline);z-index:1}:host(.sequential) .card{background-color:var(--color-gray-12);overflow:hidden}:host(.sequential) .card.hide{display:none}:host(.sequential) .card.show{display:block}:host(.sequential) .card-mobile,:host(.sequential) .card-dt-open{display:block}:host(.sequential) .card-mobile ptc-card-content,:host(.sequential) .card-dt-open ptc-card-content{display:flex;flex-basis:38%;justify-content:flex-start;align-items:center;padding:var(--ptc-element-spacing-06)}@media only screen and (min-width: 1200px){:host(.sequential) .card-mobile ptc-card-content,:host(.sequential) .card-dt-open ptc-card-content{height:unset;flex:0 0 310px}}:host(.sequential) .card-mobile ptc-picture,:host(.sequential) .card-dt-open ptc-picture{flex:1 1 auto}:host(.sequential) .card-mobile .card-title h3,:host(.sequential) .card-dt-open .card-title h3{color:var(--color-white);font-size:var(--ptc-font-size-medium);font-weight:var(--ptc-font-weight-bold);line-height:var(--ptc-line-height-densest);margin-bottom:0rem;margin-block-start:0rem;letter-spacing:var(--ptc-letter-spacing-normal)}@media only screen and (min-width: 768px){:host(.sequential) .card-mobile .card-title h3,:host(.sequential) .card-dt-open .card-title h3{font-size:var(--ptc-font-size-large)}}:host(.sequential) .card-mobile .card-content,:host(.sequential) .card-dt-open .card-content{margin-top:var(--ptc-element-spacing-03)}:host(.sequential) .card-mobile{max-width:320px;min-width:226px;position:relative}@media only screen and (min-width: 480px){:host(.sequential) .card-mobile{max-width:350px}}:host(.sequential) .card-mobile::before{content:\"\";display:block;position:absolute;top:0;left:0;width:100%;height:5px;transition:background-color var(--ptc-transition-medium) var(--ptc-ease-out);background-color:transparent}:host(.sequential) .card-mobile ptc-card-content{align-items:flex-start}:host(.sequential) .card-dt-closed{width:135px;height:424px;position:relative}:host(.sequential) .card-dt-closed .closed-content{position:absolute;width:100%;height:100%;top:0;display:flex;align-items:center;justify-content:center}:host(.sequential) .card-dt-closed .card-title{text-align:center}:host(.sequential) .card-dt-closed .card-title h2{color:var(--color-white);font-size:var(--ptc-font-size-xx-small);font-weight:var(--ptc-font-weight-bold);line-height:var(--ptc-line-height-densest);margin-bottom:0rem;margin-block-start:0rem;letter-spacing:var(--ptc-letter-spacing-normal);padding-left:var(--ptc-element-spacing-02);padding-right:var(--ptc-element-spacing-02)}@media only screen and (min-width: 1440px){:host(.sequential) .card-dt-closed .card-title h2{font-size:var(--ptc-font-size-small)}}:host(.sequential) .card-dt-open{border-top:5px solid var(--color-green-05);display:flex;max-width:790px;transition:width var(--ptc-transition-x-fast) var(--ptc-ease-out)}@media only screen and (min-width: 1440px){:host(.sequential) .card-dt-open{max-width:825px}}:host(.sequential) .card-dt-open:not([hidden]){height:480px}@media only screen and (min-width: 1200px){:host(.sequential) .card-dt-open:not([hidden]){min-width:600px}}:host(.sequential):host(.active) .card-mobile::before{background-color:var(--color-green-05)}";
@@ -203,6 +203,6 @@ function defineCustomElement() {
 defineCustomElement();
 export { PtcDynamicCard as P, defineCustomElement as d };
-//# sourceMappingURL=p-20376fPh.js.map
+//# sourceMappingURL=p-C42Dg7zS.js.map
-//# sourceMappingURL=p-20376fPh.js.map
+//# sourceMappingURL=p-C42Dg7zS.js.map

package/dist/components/{p-20376fPh.js.map → p-C42Dg7zS.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"file":"p-20376fPh.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/molecules/ptc-dynamic-card/ptc-dynamic-card.scss?tag=ptc-dynamic-card&encapsulation=shadow","src/components/molecules/ptc-dynamic-card/ptc-dynamic-card.tsx"],"sourcesContent":["@use \"mixins\" as ;\r\n\r\n:host {\r\n\tdisplay: block;\r\n}\r\n\r\n:host(.sequential) {\r\n\t.card-wrapper {\r\n\t\tposition: relative;\r\n\t\tcursor: pointer;\r\n\t\toutline: none;\r\n\r\n\t\t&:focus-visible {\r\n\t\t\ttransition: none;\r\n\t\t\t@include base-focus-state;\r\n\t\t\tz-index: 1;\r\n\t\t}\r\n\t}\r\n\r\n\t.card {\r\n\t\tbackground-color: var(--color-gray-12);\r\n\t\toverflow: hidden;\r\n\r\n\t\t&.hide {\r\n\t\t\tdisplay: none;\r\n\t\t}\r\n\r\n\t\t&.show {\r\n\t\t\tdisplay: block;\r\n\t\t}\r\n\t}\r\n\r\n\t.card-mobile,\r\n\t.card-dt-open {\r\n\t\tdisplay: block;\r\n\r\n\t\tptc-card-content {\r\n\t\t\tdisplay: flex;\r\n\t\t\tflex-basis: 38%;\r\n\t\t\tjustify-content: flex-start;\r\n\t\t\talign-items: center;\r\n\t\t\tpadding: var(--ptc-element-spacing-06);\r\n\r\n\t\t\t@include screen-lg {\r\n\t\t\t\theight: unset;\r\n\t\t\t\tflex: 0 0 310px;\r\n\t\t\t}\r\n\t\t}\r\n\r\n\t\tptc-picture {\r\n\t\t\t// flex-basis: 62%;\r\n\t\t\tflex: 1 1 auto;\r\n\t\t}\r\n\r\n\t\t.card-title {\r\n\t\t\th3 {\r\n\t\t\t\tcolor: var(--color-white);\r\n\t\t\t\tfont-size: var(--ptc-font-size-medium);\r\n\t\t\t\tfont-weight: var(--ptc-font-weight-bold);\r\n\t\t\t\tline-height: var(--ptc-line-height-densest);\r\n\t\t\t\tmargin-bottom: 0rem;\r\n\t\t\t\tmargin-block-start: 0rem;\r\n\t\t\t\tletter-spacing: var(--ptc-letter-spacing-normal);\r\n\r\n\t\t\t\t@include screen-sm {\r\n\t\t\t\t\tfont-size: var(--ptc-font-size-large);\r\n\t\t\t\t}\r\n\t\t\t}\r\n\t\t}\r\n\r\n\t\t.card-content {\r\n\t\t\tmargin-top: var(--ptc-element-spacing-03);\r\n\t\t}\r\n\t}\r\n\t.card-mobile {\r\n\t\tmax-width: 320px;\r\n\t\tmin-width: 226px;\r\n\t\tposition: relative;\r\n\r\n\t\t@include screen-xs {\r\n\t\t\tmax-width: 350px;\r\n\t\t}\r\n\r\n\t\t&::before {\r\n\t\t\tcontent: \"\";\r\n\t\t\tdisplay: block;\r\n\t\t\tposition: absolute;\r\n\t\t\ttop: 0;\r\n\t\t\tleft: 0;\r\n\t\t\twidth: 100%;\r\n\t\t\theight: 5px;\r\n\t\t\ttransition: background-color var(--ptc-transition-medium)\r\n\t\t\t\tvar(--ptc-ease-out);\r\n\t\t\tbackground-color: transparent;\r\n\t\t}\r\n\r\n\t\tptc-card-content {\r\n\t\t\talign-items: flex-start;\r\n\t\t}\r\n\t}\r\n\t.card-dt-closed {\r\n\t\twidth: 135px;\r\n\t\theight: 424px;\r\n\t\tposition: relative;\r\n\r\n\t\t.closed-content {\r\n\t\t\tposition: absolute;\r\n\t\t\twidth: 100%;\r\n\t\t\theight: 100%;\r\n\t\t\ttop: 0;\r\n\t\t\tdisplay: flex;\r\n\t\t\talign-items: center;\r\n\t\t\tjustify-content: center;\r\n\t\t}\r\n\t\t.card-title {\r\n\t\t\ttext-align: center;\r\n\t\t\th2 {\r\n\t\t\t\tcolor: var(--color-white);\r\n\t\t\t\tfont-size: var(--ptc-font-size-xx-small);\r\n\t\t\t\tfont-weight: var(--ptc-font-weight-bold);\r\n\t\t\t\tline-height: var(--ptc-line-height-densest);\r\n\t\t\t\tmargin-bottom: 0rem;\r\n\t\t\t\tmargin-block-start: 0rem;\r\n\t\t\t\tletter-spacing: var(--ptc-letter-spacing-normal);\r\n\t\t\t\tpadding-left: var(--ptc-element-spacing-02);\r\n\t\t\t\tpadding-right: var(--ptc-element-spacing-02);\r\n\r\n\t\t\t\t@include screen-xl {\r\n\t\t\t\t\tfont-size: var(--ptc-font-size-small);\r\n\t\t\t\t}\r\n\t\t\t}\r\n\t\t}\r\n\t}\r\n\r\n\t.card-dt-open {\r\n\t\tborder-top: 5px solid var(--color-green-05);\r\n\t\tdisplay: flex;\r\n\t\tmax-width: 790px;\r\n\t\ttransition: width var(--ptc-transition-x-fast) var(--ptc-ease-out);\r\n\r\n\t\t@include screen-xl {\r\n\t\t\tmax-width: 825px;\r\n\t\t}\r\n\r\n\t\t&:not([hidden]) {\r\n\t\t\theight: 480px;\r\n\r\n\t\t\t@include screen-lg {\r\n\t\t\t\tmin-width: 600px;\r\n\t\t\t}\r\n\t\t}\r\n\t}\r\n\r\n\t&:host(.active) {\r\n\t\t.card-mobile {\r\n\t\t\t&::before {\r\n\t\t\t\tbackground-color: var(--color-green-05);\r\n\t\t\t}\r\n\t\t}\r\n\t}\r\n}\r\n","import {\r\n\tComponent,\r\n\tHost,\r\n\th,\r\n\tProp,\r\n\tState,\r\n\tgetAssetPath,\r\n\tElement,\r\n\tListen,\r\n\tEvent,\r\n\tEventEmitter,\r\n\tMethod,\r\n} from \"@stencil/core\";\r\nimport { CssClassMap } from \"../../../utils/interfaces\";\r\n//import navDotSlick from '../../media/svg-imgs/nav-active-dotslick.svg';\r\n\r\n@Component({\r\n\ttag: \"ptc-dynamic-card\",\r\n\tstyleUrl: \"ptc-dynamic-card.scss\",\r\n\tassetsDirs: [\"media\"],\r\n\tshadow: true,\r\n})\r\nexport class PtcDynamicCard {\r\n\t@Element() el: HTMLElement;\r\n\r\n\t/* Dynamic Card Type /\r\n\t@Prop() cardType: \"sequential\" = \"sequential\";\r\n\r\n\t/* Card Title /\r\n\t@Prop() cardTitle: string = \"Card Title Goes Here\";\r\n\r\n\t/* Card Image Src/\r\n\t@Prop() cardImgSrc?: string;\r\n\r\n\t/* Card Image Alt/\r\n\t@Prop() cardImgAlt?: string;\r\n\t/* Public card state /\r\n\t//@Prop({ mutable: true }) outCardState: string;\r\n\r\n\t/* Card varients /\r\n\t@Prop() cardScreen: \"mobile\" \| \"desktop\" = \"desktop\";\r\n\r\n\t/* is card expanded? /\r\n\t@Prop({ mutable: true }) isExpanded: boolean = false;\r\n\r\n\t/* Internal Overlay Status /\r\n\t@State() overlayExists: boolean = true;\r\n\r\n\t/\r\n\t (optional) Injected CSS Styles\r\n\t /\r\n\t@Prop() styles?: string;\r\n\r\n\t/\r\n\t Tracker ID\r\n\t /\r\n\t@Prop() trackerId?: string;\r\n\r\n\t// handleClick() {\r\n\t// this.isExpanded = !this.isExpanded;\r\n\t// }\r\n\t/\r\n\t Event emitted when this card is opened\r\n\t /\r\n\t@Event({ bubbles: true, composed: true }) cardOpened: EventEmitter<string>;\r\n\tcomponentDidLoad() {\r\n\t\t// Handle mouse enter and leave for overlay\r\n\t\tthis.el.addEventListener(\r\n\t\t\t\"mouseenter\",\r\n\t\t\t() => (this.overlayExists = false),\r\n\t\t);\r\n\t\tthis.el.addEventListener(\r\n\t\t\t\"mouseleave\",\r\n\t\t\t() => (this.overlayExists = true),\r\n\t\t);\r\n\t}\r\n\r\n\t/\r\n\t Open the card\r\n\t /\r\n\topenCard = () => {\r\n\t\tif (!this.isExpanded) {\r\n\t\t\tthis.isExpanded = true;\r\n\t\t\tthis.cardOpened.emit(this.trackerId);\r\n\t\t}\r\n\t\t// If already expanded, do nothing to ensure at least one card remains open\r\n\t};\r\n\r\n\t/\r\n\t Handle keyboard interactions\r\n\t /\r\n\thandleKeyDown = (event: KeyboardEvent) => {\r\n\t\tswitch (event.key) {\r\n\t\t\tcase \"Enter\":\r\n\t\t\t\t//event.preventDefault();\r\n\t\t\t\tthis.openCard();\r\n\t\t\t\tbreak;\r\n\t\t\tdefault:\r\n\t\t\t\tbreak;\r\n\t\t}\r\n\t};\r\n\r\n\t/\r\n\t Listen for 'cardOpened' events on the document to close other cards\r\n\t /\r\n\t@Listen(\"cardOpened\", { target: \"document\" })\r\n\thandleCardOpened(event: CustomEvent<string>) {\r\n\t\tconst openedTrackerId = event.detail;\r\n\t\tif (openedTrackerId !== this.trackerId && this.isExpanded) {\r\n\t\t\tthis.isExpanded = false;\r\n\t\t}\r\n\t}\r\n\r\n\t/\r\n\t Focus the card-wrapper element\r\n\t /\r\n\t@Method()\r\n\tasync focusCardWrapper() {\r\n\t\tconst cardWrapper = this.el.querySelector(\r\n\t\t\t\".card-wrapper\",\r\n\t\t) as HTMLElement;\r\n\t\tif (cardWrapper) {\r\n\t\t\tcardWrapper.focus();\r\n\t\t}\r\n\t}\r\n\r\n\t/\r\n\t Get CSS class map\r\n\t /\r\n\tprivate getCssClassMap(): CssClassMap {\r\n\t\treturn {\r\n\t\t\t[this.cardType]: true,\r\n\t\t};\r\n\t}\r\n\r\n\t/\r\n\t Get desktop card based on expansion state\r\n\t /\r\n\t// getDesktopCard() {\r\n\t// if (this.cardScreen === 'desktop' && this.isExpanded) {\r\n\t// return [\r\n\t// <div class=\"card card-dt-open mf-listen\" id={this.trackerId}>\r\n\t// <ptc-card-content card-type=\"card-dynamic\">\r\n\t// <div class=\"card-title\">\r\n\t// <h3>{this.cardTitle}</h3>\r\n\t// </div>\r\n\t// <div class=\"card-content\">\r\n\t// <slot></slot>\r\n\t// </div>\r\n\t// </ptc-card-content>\r\n\t// <ptc-picture\r\n\t// alt={this.cardImgAlt}\r\n\t// src={this.cardImgSrc}\r\n\t// is-full-width=\"true\"\r\n\t// is-full-height=\"true\"\r\n\t// image-alignment=\"center\"\r\n\t// ></ptc-picture>\r\n\t// </div>,\r\n\t// ];\r\n\t// } else if (this.cardScreen === 'desktop' && !this.isExpanded) {\r\n\t// return [\r\n\t// <div class=\"card card-dt-closed mf-listen\" id={this.trackerId}>\r\n\t// <ptc-picture\r\n\t// alt={this.cardImgAlt}\r\n\t// src={this.cardImgSrc}\r\n\t// image-position=\"relative\"\r\n\t// is-full-width\r\n\t// height=\"424\"\r\n\t// >\r\n\t// {this.overlayExists ? (\r\n\t// <ptc-overlay filter-color=\"solid-black-1\"></ptc-overlay>\r\n\t// ) : (\r\n\t// <ptc-overlay filter-color=\"solid-black-2\"></ptc-overlay>\r\n\t// )}\r\n\t// </ptc-picture>\r\n\t// <div class=\"closed-content\" card-type=\"card-dynamic\">\r\n\t// <div class=\"card-title\">\r\n\t// <h2>{this.cardTitle}</h2>\r\n\t// </div>\r\n\t// </div>\r\n\t// </div>,\r\n\t// ];\r\n\t// } else {\r\n\t// return null;\r\n\t// }\r\n\t// }\r\n\r\n\trender() {\r\n\t\tconst classMap = this.getCssClassMap();\r\n\r\n\t\treturn (\r\n\t\t\t<Host class={classMap}>\r\n\t\t\t\t{this.styles && <style>{this.styles}</style>}\r\n\t\t\t\t<div\r\n\t\t\t\t\tclass=\"card-wrapper mf-listen\"\r\n\t\t\t\t\trole=\"button\"\r\n\t\t\t\t\ttabindex=\"0\"\r\n\t\t\t\t\taria-expanded={this.isExpanded}\r\n\t\t\t\t\tonClick={this.openCard}\r\n\t\t\t\t\tonKeyDown={this.handleKeyDown}\r\n\t\t\t\t>\r\n\t\t\t\t\t{this.cardScreen === \"mobile\" ? (\r\n\t\t\t\t\t\t<div\r\n\t\t\t\t\t\t\tclass=\"card card-mobile mf-listen\"\r\n\t\t\t\t\t\t\tid={this.trackerId}\r\n\t\t\t\t\t\t>\r\n\t\t\t\t\t\t\t<ptc-picture\r\n\t\t\t\t\t\t\t\theight=\"287\"\r\n\t\t\t\t\t\t\t\tis-full-width\r\n\t\t\t\t\t\t\t\talt={this.cardImgAlt}\r\n\t\t\t\t\t\t\t\tsrc={this.cardImgSrc}\r\n\t\t\t\t\t\t\t></ptc-picture>\r\n\t\t\t\t\t\t\t<ptc-card-content\r\n\t\t\t\t\t\t\t\tcard-type=\"card-dynamic\"\r\n\t\t\t\t\t\t\t\tstyles=\":host(.card-dynamic){height: auto;}\"\r\n\t\t\t\t\t\t\t>\r\n\t\t\t\t\t\t\t\t<div class=\"card-title\">\r\n\t\t\t\t\t\t\t\t\t<h3>{this.cardTitle}</h3>\r\n\t\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t\t\t<div class=\"card-content\">\r\n\t\t\t\t\t\t\t\t\t<slot></slot>\r\n\t\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t\t</ptc-card-content>\r\n\t\t\t\t\t\t</div>\r\n\t\t\t\t\t) : (\r\n\t\t\t\t\t\t<div>\r\n\t\t\t\t\t\t\t<div\r\n\t\t\t\t\t\t\t\t{...(!this.isExpanded && {\r\n\t\t\t\t\t\t\t\t\thidden: \"until-found\",\r\n\t\t\t\t\t\t\t\t})}\r\n\t\t\t\t\t\t\t\t/ @ts-ignore */\r\n\t\t\t\t\t\t\t\tonBeforeMatch={this.openCard.bind(this)}\r\n\t\t\t\t\t\t\t\tclass={`card mf-listen ${\r\n\t\t\t\t\t\t\t\t\tthis.isExpanded && \"card-dt-open\"\r\n\t\t\t\t\t\t\t\t}`}\r\n\t\t\t\t\t\t\t\tid={this.trackerId}\r\n\t\t\t\t\t\t\t>\r\n\t\t\t\t\t\t\t\t<ptc-card-content card-type=\"card-dynamic\">\r\n\t\t\t\t\t\t\t\t\t<div class=\"card-title\">\r\n\t\t\t\t\t\t\t\t\t\t<h3>{this.cardTitle}</h3>\r\n\t\t\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t\t\t\t<div class=\"card-content\">\r\n\t\t\t\t\t\t\t\t\t\t<slot></slot>\r\n\t\t\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t\t\t</ptc-card-content>\r\n\t\t\t\t\t\t\t\t<ptc-picture\r\n\t\t\t\t\t\t\t\t\talt={this.cardImgAlt}\r\n\t\t\t\t\t\t\t\t\tsrc={this.cardImgSrc}\r\n\t\t\t\t\t\t\t\t\tis-full-width=\"true\"\r\n\t\t\t\t\t\t\t\t\tis-full-height=\"true\"\r\n\t\t\t\t\t\t\t\t\timage-alignment=\"center\"\r\n\t\t\t\t\t\t\t\t></ptc-picture>\r\n\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t\t<div\r\n\t\t\t\t\t\t\t\tclass={`card card-dt-closed mf-listen ${\r\n\t\t\t\t\t\t\t\t\tthis.isExpanded ? \"hide\" : \"show\"\r\n\t\t\t\t\t\t\t\t}`}\r\n\t\t\t\t\t\t\t\tid={this.trackerId}\r\n\t\t\t\t\t\t\t>\r\n\t\t\t\t\t\t\t\t<ptc-picture\r\n\t\t\t\t\t\t\t\t\talt={this.cardImgAlt}\r\n\t\t\t\t\t\t\t\t\tsrc={this.cardImgSrc}\r\n\t\t\t\t\t\t\t\t\timage-position=\"relative\"\r\n\t\t\t\t\t\t\t\t\tis-full-width\r\n\t\t\t\t\t\t\t\t\theight=\"424\"\r\n\t\t\t\t\t\t\t\t>\r\n\t\t\t\t\t\t\t\t\t{this.overlayExists ? (\r\n\t\t\t\t\t\t\t\t\t\t<ptc-overlay filter-color=\"solid-black-1\"></ptc-overlay>\r\n\t\t\t\t\t\t\t\t\t) : (\r\n\t\t\t\t\t\t\t\t\t\t<ptc-overlay filter-color=\"solid-black-2\"></ptc-overlay>\r\n\t\t\t\t\t\t\t\t\t)}\r\n\t\t\t\t\t\t\t\t</ptc-picture>\r\n\t\t\t\t\t\t\t\t<div\r\n\t\t\t\t\t\t\t\t\tclass=\"closed-content\"\r\n\t\t\t\t\t\t\t\t\tcard-type=\"card-dynamic\"\r\n\t\t\t\t\t\t\t\t>\r\n\t\t\t\t\t\t\t\t\t<div class=\"card-title\">\r\n\t\t\t\t\t\t\t\t\t\t<h2>{this.cardTitle}</h2>\r\n\t\t\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t</div>\r\n\t\t\t\t\t)}\r\n\t\t\t\t</div>\r\n\t\t\t\t{this.cardScreen === \"desktop\" && (\r\n\t\t\t\t\t<div hidden>\r\n\t\t\t\t\t\t<svg>\r\n\t\t\t\t\t\t\t<use href={`${this.dotSvg}`}></use>\r\n\t\t\t\t\t\t</svg>\r\n\t\t\t\t\t</div>\r\n\t\t\t\t)}\r\n\t\t\t</Host>\r\n\t\t);\r\n\t}\r\n\r\n\tprivate dotSvg: string = getAssetPath(\"./media/nav-active-dotslick.svg\");\r\n}\r\n"],"version":3}
1	+ {"file":"p-C42Dg7zS.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/molecules/ptc-dynamic-card/ptc-dynamic-card.scss?tag=ptc-dynamic-card&encapsulation=shadow","src/components/molecules/ptc-dynamic-card/ptc-dynamic-card.tsx"],"sourcesContent":["@use \"mixins\" as ;\r\n\r\n:host {\r\n\tdisplay: block;\r\n}\r\n\r\n:host(.sequential) {\r\n\t.card-wrapper {\r\n\t\tposition: relative;\r\n\t\tcursor: pointer;\r\n\t\toutline: none;\r\n\r\n\t\t&:focus-visible {\r\n\t\t\ttransition: none;\r\n\t\t\t@include base-focus-state;\r\n\t\t\tz-index: 1;\r\n\t\t}\r\n\t}\r\n\r\n\t.card {\r\n\t\tbackground-color: var(--color-gray-12);\r\n\t\toverflow: hidden;\r\n\r\n\t\t&.hide {\r\n\t\t\tdisplay: none;\r\n\t\t}\r\n\r\n\t\t&.show {\r\n\t\t\tdisplay: block;\r\n\t\t}\r\n\t}\r\n\r\n\t.card-mobile,\r\n\t.card-dt-open {\r\n\t\tdisplay: block;\r\n\r\n\t\tptc-card-content {\r\n\t\t\tdisplay: flex;\r\n\t\t\tflex-basis: 38%;\r\n\t\t\tjustify-content: flex-start;\r\n\t\t\talign-items: center;\r\n\t\t\tpadding: var(--ptc-element-spacing-06);\r\n\r\n\t\t\t@include screen-lg {\r\n\t\t\t\theight: unset;\r\n\t\t\t\tflex: 0 0 310px;\r\n\t\t\t}\r\n\t\t}\r\n\r\n\t\tptc-picture {\r\n\t\t\t// flex-basis: 62%;\r\n\t\t\tflex: 1 1 auto;\r\n\t\t}\r\n\r\n\t\t.card-title {\r\n\t\t\th3 {\r\n\t\t\t\tcolor: var(--color-white);\r\n\t\t\t\tfont-size: var(--ptc-font-size-medium);\r\n\t\t\t\tfont-weight: var(--ptc-font-weight-bold);\r\n\t\t\t\tline-height: var(--ptc-line-height-densest);\r\n\t\t\t\tmargin-bottom: 0rem;\r\n\t\t\t\tmargin-block-start: 0rem;\r\n\t\t\t\tletter-spacing: var(--ptc-letter-spacing-normal);\r\n\r\n\t\t\t\t@include screen-sm {\r\n\t\t\t\t\tfont-size: var(--ptc-font-size-large);\r\n\t\t\t\t}\r\n\t\t\t}\r\n\t\t}\r\n\r\n\t\t.card-content {\r\n\t\t\tmargin-top: var(--ptc-element-spacing-03);\r\n\t\t}\r\n\t}\r\n\t.card-mobile {\r\n\t\tmax-width: 320px;\r\n\t\tmin-width: 226px;\r\n\t\tposition: relative;\r\n\r\n\t\t@include screen-xs {\r\n\t\t\tmax-width: 350px;\r\n\t\t}\r\n\r\n\t\t&::before {\r\n\t\t\tcontent: \"\";\r\n\t\t\tdisplay: block;\r\n\t\t\tposition: absolute;\r\n\t\t\ttop: 0;\r\n\t\t\tleft: 0;\r\n\t\t\twidth: 100%;\r\n\t\t\theight: 5px;\r\n\t\t\ttransition: background-color var(--ptc-transition-medium)\r\n\t\t\t\tvar(--ptc-ease-out);\r\n\t\t\tbackground-color: transparent;\r\n\t\t}\r\n\r\n\t\tptc-card-content {\r\n\t\t\talign-items: flex-start;\r\n\t\t}\r\n\t}\r\n\t.card-dt-closed {\r\n\t\twidth: 135px;\r\n\t\theight: 424px;\r\n\t\tposition: relative;\r\n\r\n\t\t.closed-content {\r\n\t\t\tposition: absolute;\r\n\t\t\twidth: 100%;\r\n\t\t\theight: 100%;\r\n\t\t\ttop: 0;\r\n\t\t\tdisplay: flex;\r\n\t\t\talign-items: center;\r\n\t\t\tjustify-content: center;\r\n\t\t}\r\n\t\t.card-title {\r\n\t\t\ttext-align: center;\r\n\t\t\th2 {\r\n\t\t\t\tcolor: var(--color-white);\r\n\t\t\t\tfont-size: var(--ptc-font-size-xx-small);\r\n\t\t\t\tfont-weight: var(--ptc-font-weight-bold);\r\n\t\t\t\tline-height: var(--ptc-line-height-densest);\r\n\t\t\t\tmargin-bottom: 0rem;\r\n\t\t\t\tmargin-block-start: 0rem;\r\n\t\t\t\tletter-spacing: var(--ptc-letter-spacing-normal);\r\n\t\t\t\tpadding-left: var(--ptc-element-spacing-02);\r\n\t\t\t\tpadding-right: var(--ptc-element-spacing-02);\r\n\r\n\t\t\t\t@include screen-xl {\r\n\t\t\t\t\tfont-size: var(--ptc-font-size-small);\r\n\t\t\t\t}\r\n\t\t\t}\r\n\t\t}\r\n\t}\r\n\r\n\t.card-dt-open {\r\n\t\tborder-top: 5px solid var(--color-green-05);\r\n\t\tdisplay: flex;\r\n\t\tmax-width: 790px;\r\n\t\ttransition: width var(--ptc-transition-x-fast) var(--ptc-ease-out);\r\n\r\n\t\t@include screen-xl {\r\n\t\t\tmax-width: 825px;\r\n\t\t}\r\n\r\n\t\t&:not([hidden]) {\r\n\t\t\theight: 480px;\r\n\r\n\t\t\t@include screen-lg {\r\n\t\t\t\tmin-width: 600px;\r\n\t\t\t}\r\n\t\t}\r\n\t}\r\n\r\n\t&:host(.active) {\r\n\t\t.card-mobile {\r\n\t\t\t&::before {\r\n\t\t\t\tbackground-color: var(--color-green-05);\r\n\t\t\t}\r\n\t\t}\r\n\t}\r\n}\r\n","import {\r\n\tComponent,\r\n\tHost,\r\n\th,\r\n\tProp,\r\n\tState,\r\n\tgetAssetPath,\r\n\tElement,\r\n\tListen,\r\n\tEvent,\r\n\tEventEmitter,\r\n\tMethod,\r\n} from \"@stencil/core\";\r\nimport { CssClassMap } from \"../../../utils/interfaces\";\r\n//import navDotSlick from '../../media/svg-imgs/nav-active-dotslick.svg';\r\n\r\n@Component({\r\n\ttag: \"ptc-dynamic-card\",\r\n\tstyleUrl: \"ptc-dynamic-card.scss\",\r\n\tassetsDirs: [\"media\"],\r\n\tshadow: true,\r\n})\r\nexport class PtcDynamicCard {\r\n\t@Element() el: HTMLElement;\r\n\r\n\t/* Dynamic Card Type /\r\n\t@Prop() cardType: \"sequential\" = \"sequential\";\r\n\r\n\t/* Card Title /\r\n\t@Prop() cardTitle: string = \"Card Title Goes Here\";\r\n\r\n\t/* Card Image Src/\r\n\t@Prop() cardImgSrc?: string;\r\n\r\n\t/* Card Image Alt/\r\n\t@Prop() cardImgAlt?: string;\r\n\t/* Public card state /\r\n\t//@Prop({ mutable: true }) outCardState: string;\r\n\r\n\t/* Card varients /\r\n\t@Prop() cardScreen: \"mobile\" \| \"desktop\" = \"desktop\";\r\n\r\n\t/* is card expanded? /\r\n\t@Prop({ mutable: true }) isExpanded: boolean = false;\r\n\r\n\t/* Internal Overlay Status /\r\n\t@State() overlayExists: boolean = true;\r\n\r\n\t/\r\n\t (optional) Injected CSS Styles\r\n\t /\r\n\t@Prop() styles?: string;\r\n\r\n\t/\r\n\t Tracker ID\r\n\t /\r\n\t@Prop() trackerId?: string;\r\n\r\n\t// handleClick() {\r\n\t// this.isExpanded = !this.isExpanded;\r\n\t// }\r\n\t/\r\n\t Event emitted when this card is opened\r\n\t /\r\n\t@Event({ bubbles: true, composed: true }) cardOpened: EventEmitter<string>;\r\n\tcomponentDidLoad() {\r\n\t\t// Handle mouse enter and leave for overlay\r\n\t\tthis.el.addEventListener(\r\n\t\t\t\"mouseenter\",\r\n\t\t\t() => (this.overlayExists = false),\r\n\t\t);\r\n\t\tthis.el.addEventListener(\r\n\t\t\t\"mouseleave\",\r\n\t\t\t() => (this.overlayExists = true),\r\n\t\t);\r\n\t}\r\n\r\n\t/\r\n\t Open the card\r\n\t /\r\n\topenCard = () => {\r\n\t\tif (!this.isExpanded) {\r\n\t\t\tthis.isExpanded = true;\r\n\t\t\tthis.cardOpened.emit(this.trackerId);\r\n\t\t}\r\n\t\t// If already expanded, do nothing to ensure at least one card remains open\r\n\t};\r\n\r\n\t/\r\n\t Handle keyboard interactions\r\n\t /\r\n\thandleKeyDown = (event: KeyboardEvent) => {\r\n\t\tswitch (event.key) {\r\n\t\t\tcase \"Enter\":\r\n\t\t\t\t//event.preventDefault();\r\n\t\t\t\tthis.openCard();\r\n\t\t\t\tbreak;\r\n\t\t\tdefault:\r\n\t\t\t\tbreak;\r\n\t\t}\r\n\t};\r\n\r\n\t/\r\n\t Listen for 'cardOpened' events on the document to close other cards\r\n\t /\r\n\t@Listen(\"cardOpened\", { target: \"document\" })\r\n\thandleCardOpened(event: CustomEvent<string>) {\r\n\t\tconst openedTrackerId = event.detail;\r\n\t\tif (openedTrackerId !== this.trackerId && this.isExpanded) {\r\n\t\t\tthis.isExpanded = false;\r\n\t\t}\r\n\t}\r\n\r\n\t/\r\n\t Focus the card-wrapper element\r\n\t /\r\n\t@Method()\r\n\tasync focusCardWrapper() {\r\n\t\tconst cardWrapper = this.el.querySelector(\r\n\t\t\t\".card-wrapper\",\r\n\t\t) as HTMLElement;\r\n\t\tif (cardWrapper) {\r\n\t\t\tcardWrapper.focus();\r\n\t\t}\r\n\t}\r\n\r\n\t/\r\n\t Get CSS class map\r\n\t /\r\n\tprivate getCssClassMap(): CssClassMap {\r\n\t\treturn {\r\n\t\t\t[this.cardType]: true,\r\n\t\t};\r\n\t}\r\n\r\n\t/\r\n\t Get desktop card based on expansion state\r\n\t /\r\n\t// getDesktopCard() {\r\n\t// if (this.cardScreen === 'desktop' && this.isExpanded) {\r\n\t// return [\r\n\t// <div class=\"card card-dt-open mf-listen\" id={this.trackerId}>\r\n\t// <ptc-card-content card-type=\"card-dynamic\">\r\n\t// <div class=\"card-title\">\r\n\t// <h3>{this.cardTitle}</h3>\r\n\t// </div>\r\n\t// <div class=\"card-content\">\r\n\t// <slot></slot>\r\n\t// </div>\r\n\t// </ptc-card-content>\r\n\t// <ptc-picture\r\n\t// alt={this.cardImgAlt}\r\n\t// src={this.cardImgSrc}\r\n\t// is-full-width=\"true\"\r\n\t// is-full-height=\"true\"\r\n\t// image-alignment=\"center\"\r\n\t// ></ptc-picture>\r\n\t// </div>,\r\n\t// ];\r\n\t// } else if (this.cardScreen === 'desktop' && !this.isExpanded) {\r\n\t// return [\r\n\t// <div class=\"card card-dt-closed mf-listen\" id={this.trackerId}>\r\n\t// <ptc-picture\r\n\t// alt={this.cardImgAlt}\r\n\t// src={this.cardImgSrc}\r\n\t// image-position=\"relative\"\r\n\t// is-full-width\r\n\t// height=\"424\"\r\n\t// >\r\n\t// {this.overlayExists ? (\r\n\t// <ptc-overlay filter-color=\"solid-black-1\"></ptc-overlay>\r\n\t// ) : (\r\n\t// <ptc-overlay filter-color=\"solid-black-2\"></ptc-overlay>\r\n\t// )}\r\n\t// </ptc-picture>\r\n\t// <div class=\"closed-content\" card-type=\"card-dynamic\">\r\n\t// <div class=\"card-title\">\r\n\t// <h2>{this.cardTitle}</h2>\r\n\t// </div>\r\n\t// </div>\r\n\t// </div>,\r\n\t// ];\r\n\t// } else {\r\n\t// return null;\r\n\t// }\r\n\t// }\r\n\r\n\trender() {\r\n\t\tconst classMap = this.getCssClassMap();\r\n\r\n\t\treturn (\r\n\t\t\t<Host class={classMap}>\r\n\t\t\t\t{this.styles && <style>{this.styles}</style>}\r\n\t\t\t\t<div\r\n\t\t\t\t\tclass=\"card-wrapper mf-listen\"\r\n\t\t\t\t\trole=\"button\"\r\n\t\t\t\t\ttabindex=\"0\"\r\n\t\t\t\t\taria-expanded={this.isExpanded}\r\n\t\t\t\t\tonClick={this.openCard}\r\n\t\t\t\t\tonKeyDown={this.handleKeyDown}\r\n\t\t\t\t>\r\n\t\t\t\t\t{this.cardScreen === \"mobile\" ? (\r\n\t\t\t\t\t\t<div\r\n\t\t\t\t\t\t\tclass=\"card card-mobile mf-listen\"\r\n\t\t\t\t\t\t\tid={this.trackerId}\r\n\t\t\t\t\t\t>\r\n\t\t\t\t\t\t\t<ptc-picture\r\n\t\t\t\t\t\t\t\theight=\"287\"\r\n\t\t\t\t\t\t\t\tis-full-width\r\n\t\t\t\t\t\t\t\talt={this.cardImgAlt}\r\n\t\t\t\t\t\t\t\tsrc={this.cardImgSrc}\r\n\t\t\t\t\t\t\t></ptc-picture>\r\n\t\t\t\t\t\t\t<ptc-card-content\r\n\t\t\t\t\t\t\t\tcard-type=\"card-dynamic\"\r\n\t\t\t\t\t\t\t\tstyles=\":host(.card-dynamic){height: auto;}\"\r\n\t\t\t\t\t\t\t>\r\n\t\t\t\t\t\t\t\t<div class=\"card-title\">\r\n\t\t\t\t\t\t\t\t\t<h3>{this.cardTitle}</h3>\r\n\t\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t\t\t<div class=\"card-content\">\r\n\t\t\t\t\t\t\t\t\t<slot></slot>\r\n\t\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t\t</ptc-card-content>\r\n\t\t\t\t\t\t</div>\r\n\t\t\t\t\t) : (\r\n\t\t\t\t\t\t<div>\r\n\t\t\t\t\t\t\t<div\r\n\t\t\t\t\t\t\t\t{...(!this.isExpanded && {\r\n\t\t\t\t\t\t\t\t\thidden: \"until-found\",\r\n\t\t\t\t\t\t\t\t})}\r\n\t\t\t\t\t\t\t\t/ @ts-ignore */\r\n\t\t\t\t\t\t\t\tonBeforeMatch={this.openCard.bind(this)}\r\n\t\t\t\t\t\t\t\tclass={`card mf-listen ${\r\n\t\t\t\t\t\t\t\t\tthis.isExpanded && \"card-dt-open\"\r\n\t\t\t\t\t\t\t\t}`}\r\n\t\t\t\t\t\t\t\tid={this.trackerId}\r\n\t\t\t\t\t\t\t>\r\n\t\t\t\t\t\t\t\t<ptc-card-content card-type=\"card-dynamic\">\r\n\t\t\t\t\t\t\t\t\t<div class=\"card-title\">\r\n\t\t\t\t\t\t\t\t\t\t<h3>{this.cardTitle}</h3>\r\n\t\t\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t\t\t\t<div class=\"card-content\">\r\n\t\t\t\t\t\t\t\t\t\t<slot></slot>\r\n\t\t\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t\t\t</ptc-card-content>\r\n\t\t\t\t\t\t\t\t<ptc-picture\r\n\t\t\t\t\t\t\t\t\talt={this.cardImgAlt}\r\n\t\t\t\t\t\t\t\t\tsrc={this.cardImgSrc}\r\n\t\t\t\t\t\t\t\t\tis-full-width=\"true\"\r\n\t\t\t\t\t\t\t\t\tis-full-height=\"true\"\r\n\t\t\t\t\t\t\t\t\timage-alignment=\"center\"\r\n\t\t\t\t\t\t\t\t></ptc-picture>\r\n\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t\t<div\r\n\t\t\t\t\t\t\t\tclass={`card card-dt-closed mf-listen ${\r\n\t\t\t\t\t\t\t\t\tthis.isExpanded ? \"hide\" : \"show\"\r\n\t\t\t\t\t\t\t\t}`}\r\n\t\t\t\t\t\t\t\tid={this.trackerId}\r\n\t\t\t\t\t\t\t>\r\n\t\t\t\t\t\t\t\t<ptc-picture\r\n\t\t\t\t\t\t\t\t\talt={this.cardImgAlt}\r\n\t\t\t\t\t\t\t\t\tsrc={this.cardImgSrc}\r\n\t\t\t\t\t\t\t\t\timage-position=\"relative\"\r\n\t\t\t\t\t\t\t\t\tis-full-width\r\n\t\t\t\t\t\t\t\t\theight=\"424\"\r\n\t\t\t\t\t\t\t\t>\r\n\t\t\t\t\t\t\t\t\t{this.overlayExists ? (\r\n\t\t\t\t\t\t\t\t\t\t<ptc-overlay filter-color=\"solid-black-1\"></ptc-overlay>\r\n\t\t\t\t\t\t\t\t\t) : (\r\n\t\t\t\t\t\t\t\t\t\t<ptc-overlay filter-color=\"solid-black-2\"></ptc-overlay>\r\n\t\t\t\t\t\t\t\t\t)}\r\n\t\t\t\t\t\t\t\t</ptc-picture>\r\n\t\t\t\t\t\t\t\t<div\r\n\t\t\t\t\t\t\t\t\tclass=\"closed-content\"\r\n\t\t\t\t\t\t\t\t\tcard-type=\"card-dynamic\"\r\n\t\t\t\t\t\t\t\t>\r\n\t\t\t\t\t\t\t\t\t<div class=\"card-title\">\r\n\t\t\t\t\t\t\t\t\t\t<h2>{this.cardTitle}</h2>\r\n\t\t\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t</div>\r\n\t\t\t\t\t)}\r\n\t\t\t\t</div>\r\n\t\t\t\t{this.cardScreen === \"desktop\" && (\r\n\t\t\t\t\t<div hidden>\r\n\t\t\t\t\t\t<svg>\r\n\t\t\t\t\t\t\t<use href={`${this.dotSvg}`}></use>\r\n\t\t\t\t\t\t</svg>\r\n\t\t\t\t\t</div>\r\n\t\t\t\t)}\r\n\t\t\t</Host>\r\n\t\t);\r\n\t}\r\n\r\n\tprivate dotSvg: string = getAssetPath(\"./media/nav-active-dotslick.svg\");\r\n}\r\n"],"version":3}

package/dist/components/{p-CwOMZVTl.js → p-CCrGe6qh.js} RENAMED Viewed

@@ -1,4 +1,4 @@
-import { p as proxyCustomElement, H, h, d as Host } from './p-BYSv8uGQ.js';
+import { p as proxyCustomElement, H, h, d as Host } from './p-BvGlmU4v.js';
 import { s as seoSlotReset } from './p-DpFzAwLW.js';
 const ptcParaCss = ":host{position:relative;z-index:1}:host .tooltip-enabled{position:relative}:host(.white){color:var(--color-white)}:host(.z-1){z-index:1}:host(.z-2){z-index:2}:host(.z-3){z-index:3}:host(.z-99){z-index:99}:host(.z-999){z-index:999}:host(.z-auto){z-index:auto}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.primary-green{color:var(--color-green-06)}p.gray-darker{color:var(--color-gray-11)}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.htmlquote-para{font-size:var(--ptc-font-size-small)}@media only screen and (min-width: 992px){p.htmlquote-para{font-size:var(--ptc-font-size-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-8 ::slotted(a){font-weight:var(--ptc-font-weight-extrabold) !important}p.w-9{font-weight:var(--ptc-font-weight-black)}p.w-9 ::slotted(a){font-weight:var(--ptc-font-weight-black) !important}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-p{line-height:var(--ptc-line-height-p)}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.left{text-align:left}p.right{text-align:right}p.center{text-align:center}p.justify{text-align:justify}p.right-768above{text-align:left}@media (min-width: 768px){p.right-768above{text-align:right}}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)}p.ellipsis-boxing{display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;overflow-wrap:break-word}p.line-clamp-title{display:-webkit-box !important;-webkit-box-orient:vertical;overflow:hidden}@media (max-width: 768px){:host(.hide-tooltip-on-mobile) .line-clamp-title{-webkit-line-clamp:initial !important}}";
@@ -223,6 +223,6 @@ function defineCustomElement() {
 defineCustomElement();
 export { PtcPara as P, defineCustomElement as d };
-//# sourceMappingURL=p-CwOMZVTl.js.map
+//# sourceMappingURL=p-CCrGe6qh.js.map
-//# sourceMappingURL=p-CwOMZVTl.js.map
+//# sourceMappingURL=p-CCrGe6qh.js.map

package/dist/components/{p-CwOMZVTl.js.map → p-CCrGe6qh.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"file":"p-CwOMZVTl.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/atoms/ptc-para/ptc-para.scss?tag=ptc-para&encapsulation=shadow","src/components/atoms/ptc-para/ptc-para.tsx"],"sourcesContent":["@use \"mixins\" as ;\r\n:host {\r\n\tposition: relative;\r\n\tz-index: 1;\r\n\t.tooltip-enabled {\r\n\t\tposition: relative;\r\n\t}\r\n}\r\n\r\n:host(.white) {\r\n\tcolor: var(--color-white);\r\n}\r\n\r\n:host(.z-1) {\r\n\tz-index: 1;\r\n}\r\n\r\n:host(.z-2) {\r\n\tz-index: 2;\r\n}\r\n\r\n:host(.z-3) {\r\n\tz-index: 3;\r\n}\r\n:host(.z-99) {\r\n\tz-index: 99;\r\n}\r\n\r\n:host(.z-999) {\r\n\tz-index: 999;\r\n}\r\n\r\n:host(.z-auto) {\r\n\tz-index: auto;\r\n}\r\n\r\np {\r\n\t&.default {\r\n\t\t-moz-osx-font-smoothing: grayscale;\r\n\t\t/(For Firefox)/\r\n\t\t-webkit-font-smoothing: antialiased;\r\n\t\t/(For Chrome and Safari)/\r\n\t}\r\n\r\n\t&.main {\r\n\t\ttext-shadow: 0 3px 6px var(--color-white);\r\n\t\tline-height: var(--ptc-line-height-dense);\r\n\t\tcolor: var(--color-gray-10);\r\n\t}\r\n\r\n\t&.primary-grey {\r\n\t\tcolor: var(--color-gray-10);\r\n\t}\r\n\r\n\t&.primary-green {\r\n\t\tcolor: var(--color-green-06);\r\n\t}\r\n\r\n\t&.gray-darker {\r\n\t\tcolor: var(--color-gray-11);\r\n\t}\r\n\r\n\t&.white {\r\n\t\tcolor: var(--color-white);\r\n\t}\r\n\r\n\t&.xxx-small {\r\n\t\tfont-size: var(--ptc-font-size-xxx-small);\r\n\t}\r\n\r\n\t&.xx-small {\r\n\t\tfont-size: var(--ptc-font-size-xx-small);\r\n\t}\r\n\r\n\t&.x-small {\r\n\t\tfont-size: var(--ptc-font-size-x-small);\r\n\t}\r\n\r\n\t&.small {\r\n\t\tfont-size: var(--ptc-font-size-small);\r\n\t}\r\n\r\n\t&.medium {\r\n\t\tfont-size: var(--ptc-font-size-medium);\r\n\t}\r\n\r\n\t&.large {\r\n\t\tfont-size: var(--ptc-font-size-large);\r\n\t}\r\n\r\n\t&.x-large {\r\n\t\tfont-size: var(--ptc-font-size-x-large);\r\n\t}\r\n\r\n\t&.xx-large {\r\n\t\tfont-size: var(--ptc-font-size-xx-large);\r\n\t}\r\n\r\n\t&.xxx-large {\r\n\t\tfont-size: var(--ptc-font-size-xxx-large);\r\n\t}\r\n\r\n\t&.xxxx-large {\r\n\t\tfont-size: var(--ptc-font-size-xxxx-large);\r\n\t}\r\n\r\n\t&.htmlquote-para {\r\n\t\tfont-size: var(--ptc-font-size-small);\r\n\r\n\t\t@include screen-md {\r\n\t\t\tfont-size: var(--ptc-font-size-large);\r\n\t\t}\r\n\t}\r\n\r\n\t&.w-3 {\r\n\t\tfont-weight: var(--ptc-font-weight-thin);\r\n\t}\r\n\r\n\t&.w-4 {\r\n\t\tfont-weight: var(--ptc-font-weight-regular);\r\n\t}\r\n\r\n\t&.w-5 {\r\n\t\tfont-weight: var(--ptc-font-weight-medium);\r\n\t}\r\n\r\n\t&.w-6 {\r\n\t\tfont-weight: var(--ptc-font-weight-semibold);\r\n\t}\r\n\r\n\t&.w-7 {\r\n\t\tfont-weight: var(--ptc-font-weight-bold);\r\n\t}\r\n\r\n\t&.w-8 {\r\n\t\tfont-weight: var(--ptc-font-weight-extrabold);\r\n\t\t::slotted(a) {\r\n\t\t\tfont-weight: var(--ptc-font-weight-extrabold) !important;\r\n\t\t}\r\n\t}\r\n\r\n\t&.w-9 {\r\n\t\tfont-weight: var(--ptc-font-weight-black);\r\n\t\t::slotted(a) {\r\n\t\t\tfont-weight: var(--ptc-font-weight-black) !important;\r\n\t\t}\r\n\t}\r\n\r\n\t&.margin-flush {\r\n\t\tmargin-top: 0;\r\n\t\tmargin-bottom: 0;\r\n\t}\r\n\r\n\t&.margin-top-1 {\r\n\t\tmargin-top: var(--ptc-element-spacing-01);\r\n\t\tmargin-bottom: 0;\r\n\t}\r\n\r\n\t&.margin-top-2 {\r\n\t\tmargin-top: var(--ptc-element-spacing-02);\r\n\t\tmargin-bottom: 0;\r\n\t}\r\n\r\n\t&.margin-top-3 {\r\n\t\tmargin-top: var(--ptc-element-spacing-03);\r\n\t\tmargin-bottom: 0;\r\n\t}\r\n\r\n\t&.margin-top-4 {\r\n\t\tmargin-top: var(--ptc-element-spacing-04);\r\n\t\tmargin-bottom: 0;\r\n\t}\r\n\r\n\t&.margin-top-5 {\r\n\t\tmargin-top: var(--ptc-element-spacing-05);\r\n\t\tmargin-bottom: 0;\r\n\t}\r\n\r\n\t&.margin-top-6 {\r\n\t\tmargin-top: var(--ptc-element-spacing-06);\r\n\t\tmargin-bottom: 0;\r\n\t}\r\n\r\n\t&.margin-bottom-1 {\r\n\t\tmargin-bottom: var(--ptc-element-spacing-01);\r\n\t\tmargin-top: 0;\r\n\t}\r\n\r\n\t&.margin-bottom-2 {\r\n\t\tmargin-bottom: var(--ptc-element-spacing-02);\r\n\t\tmargin-top: 0;\r\n\t}\r\n\r\n\t&.margin-bottom-3 {\r\n\t\tmargin-bottom: var(--ptc-element-spacing-03);\r\n\t\tmargin-top: 0;\r\n\t}\r\n\r\n\t&.margin-bottom-4 {\r\n\t\tmargin-bottom: var(--ptc-element-spacing-04);\r\n\t\tmargin-top: 0;\r\n\t}\r\n\r\n\t&.margin-bottom-5 {\r\n\t\tmargin-bottom: var(--ptc-element-spacing-05);\r\n\t\tmargin-top: 0;\r\n\t}\r\n\r\n\t&.margin-bottom-6 {\r\n\t\tmargin-bottom: var(--ptc-element-spacing-06);\r\n\t\tmargin-top: 0;\r\n\t}\r\n\r\n\t&.margin-1 {\r\n\t\tmargin-top: var(--ptc-element-spacing-01);\r\n\t\tmargin-bottom: var(--ptc-element-spacing-01);\r\n\t}\r\n\r\n\t&.margin-2 {\r\n\t\tmargin-top: var(--ptc-element-spacing-02);\r\n\t\tmargin-bottom: var(--ptc-element-spacing-02);\r\n\t}\r\n\r\n\t&.margin-3 {\r\n\t\tmargin-top: var(--ptc-element-spacing-03);\r\n\t\tmargin-bottom: var(--ptc-element-spacing-03);\r\n\t}\r\n\r\n\t&.margin-4 {\r\n\t\tmargin-top: var(--ptc-element-spacing-04);\r\n\t\tmargin-bottom: var(--ptc-element-spacing-04);\r\n\t}\r\n\r\n\t&.margin-5 {\r\n\t\tmargin-top: var(--ptc-element-spacing-05);\r\n\t\tmargin-bottom: var(--ptc-element-spacing-05);\r\n\t}\r\n\r\n\t&.margin-6 {\r\n\t\tmargin-top: var(--ptc-element-spacing-06);\r\n\t\tmargin-bottom: var(--ptc-element-spacing-06);\r\n\t}\r\n\r\n\t&.line-height-densest {\r\n\t\tline-height: var(--ptc-line-height-densest);\r\n\t}\r\n\r\n\t&.line-height-denser {\r\n\t\tline-height: var(--ptc-line-height-denser);\r\n\t}\r\n\r\n\t&.line-height-p {\r\n\t\tline-height: var(--ptc-line-height-p);\r\n\t}\r\n\r\n\t&.line-height-dense {\r\n\t\tline-height: var(--ptc-line-height-dense);\r\n\t}\r\n\r\n\t&.line-height-normal {\r\n\t\tline-height: var(--ptc-line-height-normal);\r\n\t}\r\n\r\n\t&.line-height-loose {\r\n\t\tline-height: var(--ptc-line-height-loose);\r\n\t}\r\n\r\n\t&.line-height-looser {\r\n\t\tline-height: var(--ptc-line-height-looser);\r\n\t}\r\n\r\n\t&.left {\r\n\t\ttext-align: left;\r\n\t}\r\n\r\n\t&.right {\r\n\t\ttext-align: right;\r\n\t}\r\n\r\n\t&.center {\r\n\t\ttext-align: center;\r\n\t}\r\n\r\n\t&.justify {\r\n\t\ttext-align: justify;\r\n\t}\r\n\r\n\t&.right-768above {\r\n\t\ttext-align: left;\r\n\r\n\t\t@media (min-width: 768px) {\r\n\t\t\ttext-align: right;\r\n\t\t}\r\n\t}\r\n\r\n\t&.announcement {\r\n\t\ttext-transform: uppercase;\r\n\t\tfont-size: var(--ptc-font-size-small);\r\n\t\tcolor: var(--color-gray-07);\r\n\t\tline-height: var(--ptc-line-height-looser);\r\n\t\tletter-spacing: var(--ptc-letter-spacing-loose);\r\n\t}\r\n\r\n\t&.ellipsis-boxing {\r\n\t\tdisplay: -webkit-box;\r\n\t\t-webkit-line-clamp: 1;\r\n\t\t-webkit-box-orient: vertical;\r\n\t\toverflow: hidden;\r\n\t\ttext-overflow: ellipsis;\r\n\t\toverflow-wrap: break-word;\r\n\t}\r\n\t&.line-clamp-title {\r\n\t\tdisplay: -webkit-box !important;\r\n\t\t-webkit-box-orient: vertical;\r\n\t\toverflow: hidden;\r\n\t}\r\n}\r\n\r\n:host(.hide-tooltip-on-mobile) {\r\n\t.line-clamp-title {\r\n\t\t@media (max-width: 768px) {\r\n\t\t\t-webkit-line-clamp: initial !important;\r\n\t\t}\r\n\t}\r\n}\r\n","import { Component, h, Host, Prop, Element, State } from \"@stencil/core\";\r\nimport { CssClassMap, StylesMap } from \"../../../utils/interfaces\";\r\nimport { seoSlotReset } from \"../../../utils/utils\";\r\n\r\n@Component({\r\n\ttag: \"ptc-para\",\r\n\tstyleUrl: \"ptc-para.scss\",\r\n\tshadow: true,\r\n})\r\nexport class PtcPara {\r\n\t@Element() el: HTMLElement;\r\n\t/\r\n\t Paragraph font size\r\n\t /\r\n\t@Prop() fontSize:\r\n\t\t\| \"xxx-small\"\r\n\t\t\| \"xx-small\"\r\n\t\t\| \"x-small\"\r\n\t\t\| \"small\"\r\n\t\t\| \"medium\"\r\n\t\t\| \"large\"\r\n\t\t\| \"x-large\"\r\n\t\t\| \"xx-large\"\r\n\t\t\| \"xxx-large\"\r\n\t\t\| \"xxxx-large\"\r\n\t\t\| \"htmlquote-para\" = \"x-small\";\r\n\r\n\t/\r\n\t * Paragraph font weight\r\n\t /\r\n\t@Prop() fontWeight: \"w-3\" \| \"w-4\" \| \"w-5\" \| \"w-6\" \| \"w-7\" \| \"w-8\" \| \"w-9\" =\r\n\t\t\"w-4\";\r\n\r\n\t/\r\n\t * Paragraph Style\r\n\t /\r\n\t@Prop() paraStyle:\r\n\t\t\| \"default\"\r\n\t\t\| \"intro\"\r\n\t\t\| \"small\"\r\n\t\t\| \"announcement\"\r\n\t\t\| \"flush-style\"\r\n\t\t\| \"main\" = \"default\";\r\n\r\n\t/\r\n\t * Paragraph Color\r\n\t /\r\n\t@Prop() paraColor:\r\n\t\t\| \"primary-grey\"\r\n\t\t\| \"primary-green\"\r\n\t\t\| \"white\"\r\n\t\t\| \"gray-darker\" = \"primary-grey\";\r\n\r\n\t/\r\n\t line height\r\n\t /\r\n\t@Prop() paraLineH:\r\n\t\t\| \"line-height-densest\"\r\n\t\t\| \"line-height-denser\"\r\n\t\t\| \"line-height-dense\"\r\n\t\t\| \"line-height-normal\"\r\n\t\t\| \"line-height-loose\"\r\n\t\t\| \"line-height-looser\"\r\n\t\t\| \"line-height-p\" = \"line-height-normal\";\r\n\r\n\t/\r\n\t Paragraph Margin\r\n\t /\r\n\t@Prop() paraMargin?:\r\n\t\t\| \"margin-flush\"\r\n\t\t\| \"maring-top-1\"\r\n\t\t\| \"margin-top-2\"\r\n\t\t\| \"margin-top-3\"\r\n\t\t\| \"margin-top-4\"\r\n\t\t\| \"margin-top-5\"\r\n\t\t\| \"margin-top-6\"\r\n\t\t\| \"margin-bottom-1\"\r\n\t\t\| \"margin-bottom-2\"\r\n\t\t\| \"margin-bottom-3\"\r\n\t\t\| \"margin-bottom-4\"\r\n\t\t\| \"margin-bottom-5\"\r\n\t\t\| \"margin-bottom-6\"\r\n\t\t\| \"margin-1\"\r\n\t\t\| \"margin-2\"\r\n\t\t\| \"margin-3\"\r\n\t\t\| \"margin-4\"\r\n\t\t\| \"margin-5\"\r\n\t\t\| \"margin-6\";\r\n\r\n\t/\r\n\t Para text Alignment\r\n\t /\r\n\t@Prop() paraAlign?:\r\n\t\t\| \"left\"\r\n\t\t\| \"center\"\r\n\t\t\| \"right\"\r\n\t\t\| \"justify\"\r\n\t\t\| \"right-768above\";\r\n\r\n\t/\r\n\t Line number to cut text off at and add ellipsis\r\n\t /\r\n\t@Prop() ellipsisLineCutoff?: number;\r\n\r\n\t/\r\n\t sep z-index\r\n\t /\r\n\t@Prop() paraZIndex?: \"z-auto\" \| \"z-1\" \| \"z-2\" \| \"z-3\" \| \"z-99\" \| \"z-999\";\r\n\t/\r\n\t (optional) Injected CSS Styles\r\n\t /\r\n\t@Prop() styles?: string;\r\n\r\n\t/\r\n\t (optional) enable support for seo tools that can only view source\r\n\t /\r\n\t@Prop() seoCompatibilityMode: boolean = false;\r\n\r\n\t// Tooltip Properties started\r\n\t/\r\n\t index of hover tooltip element\r\n\t /\r\n\t@Prop() tooltipZIndex: string = \"auto\";\r\n\t/\r\n\t Tooltip position\r\n\t /\r\n\t@Prop() tooltipPosition:\r\n\t\t\| \"left\"\r\n\t\t\| \"right\"\r\n\t\t\| \"bottom\"\r\n\t\t\| \"bottom-right\"\r\n\t\t\| \"top\" = \"bottom\";\r\n\t/\r\n\t (optional) Injected CSS Styles\r\n\t /\r\n\t@Prop() tooltipTheme: \"standard\" \| \"danger\" = \"standard\";\r\n\t@Prop() enableTooltip: boolean = false;\r\n\t@Prop() maxChars: number;\r\n\t@Prop() maxLines: number;\r\n\ttooltipText: string;\r\n\t@Prop() hideTooltipOnMobile: boolean = false;\r\n\t@State() ismob: boolean;\r\n\t/\r\n\t If tooltip noOverflow = \"true\" then the tooltip will not be visible just ellipses will be visible\r\n\t /\r\n\t@Prop() noOverflow?: boolean = false;\r\n\r\n\t/\r\n\t This will make the width 100% respective to its parent\r\n\t */\r\n\t@Prop() tooltipWidth?: \"full-width\" \| \"default\" = \"default\";\r\n\t// Tooltip Properties ends\r\n\r\n\trender() {\r\n\t\tif (this.seoCompatibilityMode) {\r\n\t\t\tseoSlotReset(this.el);\r\n\t\t}\r\n\r\n\t\treturn this.standardRender();\r\n\t}\r\n\t//tooltip code\r\n\tgetSortedText(content: string): string \| undefined {\r\n\t\tif (!this.enableTooltip) return;\r\n\r\n\t\tconst trimmedContent = content.trim();\r\n\t\tconst shouldTruncate =\r\n\t\t\ttrimmedContent.length > this.maxChars && !this.maxLines;\r\n\t\treturn shouldTruncate\r\n\t\t\t? `${trimmedContent.slice(0, this.maxChars).trimEnd()}\\u00A0\\u2026`\r\n\t\t\t: trimmedContent;\r\n\t}\r\n\r\n\tcomponentDidLoad() {\r\n\t\tif (this.hideTooltipOnMobile) {\r\n\t\t\tthis.el.classList.add(\"hide-tooltip-on-mobile\");\r\n\t\t}\r\n\t\tthis.el.addEventListener(\"mouseenter\", () => {\r\n\t\t\tthis.toggleTitleTooltip(true);\r\n\t\t});\r\n\t\tthis.el.addEventListener(\"mouseleave\", () => {\r\n\t\t\tthis.toggleTitleTooltip(false);\r\n\t\t});\r\n\r\n\t\tif (this.enableTooltip) {\r\n\t\t\tlet paraContent = this.el.innerText \|\| this.el.textContent;\r\n\t\t\tthis.tooltipText = paraContent.trim();\r\n\t\t\tthis.el.innerText = this.getSortedText(paraContent);\r\n\t\t}\r\n\t}\r\n\r\n\ttoggleTitleTooltip(show: boolean) {\r\n\t\tconst tooltipClass = \"tooltip-box\";\r\n\t\tconst existingTooltip = this.el.querySelector(`.${tooltipClass}`);\r\n\t\tconst text = this.el.shadowRoot.querySelectorAll(\".line-clamp-title\");\r\n\r\n\t\tlet maxLinesShowCheck: boolean = false;\r\n\t\tif (text) {\r\n\t\t\ttext.forEach((t) => {\r\n\t\t\t\tmaxLinesShowCheck = t.scrollHeight > t.clientHeight;\r\n\t\t\t});\r\n\t\t}\r\n\t\tconst ifCharExceeds = this.maxChars\r\n\t\t\t? this.tooltipText.length > this.maxChars && !this.maxLines\r\n\t\t\t: false;\r\n\t\tconst ifLinesExceeds = this.maxLines && maxLinesShowCheck;\r\n\r\n\t\tif (show && this.enableTooltip) {\r\n\t\t\tif (\r\n\t\t\t\t((!existingTooltip && ifCharExceeds) \|\|\r\n\t\t\t\t\t(!existingTooltip && ifLinesExceeds)) &&\r\n\t\t\t\t!this.noOverflow\r\n\t\t\t) {\r\n\t\t\t\tconst tooltipMarkup = document.createElement(\"div\");\r\n\t\t\t\ttooltipMarkup.className = tooltipClass;\r\n\t\t\t\ttooltipMarkup.innerText = this.tooltipText;\r\n\t\t\t\ttooltipMarkup.style.zIndex = String(this.tooltipZIndex); // Ensures zIndex is a string\r\n\t\t\t\ttooltipMarkup.classList.add(\r\n\t\t\t\t\tthis.tooltipPosition,\r\n\t\t\t\t\tthis.tooltipTheme,\r\n\t\t\t\t\tthis.tooltipWidth\r\n\t\t\t\t);\r\n\t\t\t\tif (this.hideTooltipOnMobile) {\r\n\t\t\t\t\ttooltipMarkup.classList.add(\"hide-tooltip-mobile\");\r\n\t\t\t\t}\r\n\t\t\t\tthis.el.appendChild(tooltipMarkup);\r\n\t\t\t}\r\n\t\t} else {\r\n\t\t\texistingTooltip?.remove();\r\n\t\t}\r\n\t}\r\n\t//tooltip code ends\r\n\r\n\tstandardRender() {\r\n\t\tconst classMap = this.getCssClassMap();\r\n\t\tconst colorClass = this.addWhiteClass();\r\n\t\tconst cutOff = this.getLineCuttoff();\r\n\r\n\t\treturn (\r\n\t\t\t<Host class={`${colorClass} ${this.paraZIndex} trunc-text`}>\r\n\t\t\t\t{this.styles && <style>{this.styles}</style>}\r\n\t\t\t\t<p class={classMap} part=\"part-para\" style={cutOff}>\r\n\t\t\t\t\t<slot></slot>\r\n\t\t\t\t</p>\r\n\t\t\t</Host>\r\n\t\t);\r\n\t}\r\n\r\n\tprivate getCssClassMap(): CssClassMap {\r\n\t\treturn {\r\n\t\t\t[this.fontSize]: true,\r\n\t\t\t[this.fontWeight]: true,\r\n\t\t\t[this.paraStyle]: true,\r\n\t\t\t[this.paraMargin]: !!this.paraMargin ? true : false,\r\n\t\t\t[this.paraColor]: true,\r\n\t\t\t[this.paraLineH]: true,\r\n\t\t\t[this.paraAlign]: !!this.paraAlign ? true : false,\r\n\t\t\t[\"ellipsis-boxing\"]:\r\n\t\t\t\tthis.ellipsisLineCutoff && this.ellipsisLineCutoff > 0,\r\n\t\t\t[\"line-clamp-title\"]: this.maxLines && this.maxLines > 0, //tooltip code,\r\n\t\t};\r\n\t}\r\n\t//WEB-2392\r\n\tprivate addWhiteClass(): CssClassMap {\r\n\t\tif (this.paraColor == \"white\") {\r\n\t\t\treturn {\r\n\t\t\t\t[this.paraColor]: true,\r\n\t\t\t};\r\n\t\t}\r\n\t}\r\n\r\n\tprivate getLineCuttoff(): StylesMap {\r\n\t\tconst lineClamp =\r\n\t\t\tthis.ellipsisLineCutoff > 0\r\n\t\t\t\t? this.ellipsisLineCutoff\r\n\t\t\t\t: this.maxLines;\r\n\t\treturn lineClamp > 0 ? { \"-webkit-line-clamp\": `${lineClamp}` } : {};\r\n\t}\r\n}\r\n"],"version":3}
1	+ {"file":"p-CCrGe6qh.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/atoms/ptc-para/ptc-para.scss?tag=ptc-para&encapsulation=shadow","src/components/atoms/ptc-para/ptc-para.tsx"],"sourcesContent":["@use \"mixins\" as ;\r\n:host {\r\n\tposition: relative;\r\n\tz-index: 1;\r\n\t.tooltip-enabled {\r\n\t\tposition: relative;\r\n\t}\r\n}\r\n\r\n:host(.white) {\r\n\tcolor: var(--color-white);\r\n}\r\n\r\n:host(.z-1) {\r\n\tz-index: 1;\r\n}\r\n\r\n:host(.z-2) {\r\n\tz-index: 2;\r\n}\r\n\r\n:host(.z-3) {\r\n\tz-index: 3;\r\n}\r\n:host(.z-99) {\r\n\tz-index: 99;\r\n}\r\n\r\n:host(.z-999) {\r\n\tz-index: 999;\r\n}\r\n\r\n:host(.z-auto) {\r\n\tz-index: auto;\r\n}\r\n\r\np {\r\n\t&.default {\r\n\t\t-moz-osx-font-smoothing: grayscale;\r\n\t\t/(For Firefox)/\r\n\t\t-webkit-font-smoothing: antialiased;\r\n\t\t/(For Chrome and Safari)/\r\n\t}\r\n\r\n\t&.main {\r\n\t\ttext-shadow: 0 3px 6px var(--color-white);\r\n\t\tline-height: var(--ptc-line-height-dense);\r\n\t\tcolor: var(--color-gray-10);\r\n\t}\r\n\r\n\t&.primary-grey {\r\n\t\tcolor: var(--color-gray-10);\r\n\t}\r\n\r\n\t&.primary-green {\r\n\t\tcolor: var(--color-green-06);\r\n\t}\r\n\r\n\t&.gray-darker {\r\n\t\tcolor: var(--color-gray-11);\r\n\t}\r\n\r\n\t&.white {\r\n\t\tcolor: var(--color-white);\r\n\t}\r\n\r\n\t&.xxx-small {\r\n\t\tfont-size: var(--ptc-font-size-xxx-small);\r\n\t}\r\n\r\n\t&.xx-small {\r\n\t\tfont-size: var(--ptc-font-size-xx-small);\r\n\t}\r\n\r\n\t&.x-small {\r\n\t\tfont-size: var(--ptc-font-size-x-small);\r\n\t}\r\n\r\n\t&.small {\r\n\t\tfont-size: var(--ptc-font-size-small);\r\n\t}\r\n\r\n\t&.medium {\r\n\t\tfont-size: var(--ptc-font-size-medium);\r\n\t}\r\n\r\n\t&.large {\r\n\t\tfont-size: var(--ptc-font-size-large);\r\n\t}\r\n\r\n\t&.x-large {\r\n\t\tfont-size: var(--ptc-font-size-x-large);\r\n\t}\r\n\r\n\t&.xx-large {\r\n\t\tfont-size: var(--ptc-font-size-xx-large);\r\n\t}\r\n\r\n\t&.xxx-large {\r\n\t\tfont-size: var(--ptc-font-size-xxx-large);\r\n\t}\r\n\r\n\t&.xxxx-large {\r\n\t\tfont-size: var(--ptc-font-size-xxxx-large);\r\n\t}\r\n\r\n\t&.htmlquote-para {\r\n\t\tfont-size: var(--ptc-font-size-small);\r\n\r\n\t\t@include screen-md {\r\n\t\t\tfont-size: var(--ptc-font-size-large);\r\n\t\t}\r\n\t}\r\n\r\n\t&.w-3 {\r\n\t\tfont-weight: var(--ptc-font-weight-thin);\r\n\t}\r\n\r\n\t&.w-4 {\r\n\t\tfont-weight: var(--ptc-font-weight-regular);\r\n\t}\r\n\r\n\t&.w-5 {\r\n\t\tfont-weight: var(--ptc-font-weight-medium);\r\n\t}\r\n\r\n\t&.w-6 {\r\n\t\tfont-weight: var(--ptc-font-weight-semibold);\r\n\t}\r\n\r\n\t&.w-7 {\r\n\t\tfont-weight: var(--ptc-font-weight-bold);\r\n\t}\r\n\r\n\t&.w-8 {\r\n\t\tfont-weight: var(--ptc-font-weight-extrabold);\r\n\t\t::slotted(a) {\r\n\t\t\tfont-weight: var(--ptc-font-weight-extrabold) !important;\r\n\t\t}\r\n\t}\r\n\r\n\t&.w-9 {\r\n\t\tfont-weight: var(--ptc-font-weight-black);\r\n\t\t::slotted(a) {\r\n\t\t\tfont-weight: var(--ptc-font-weight-black) !important;\r\n\t\t}\r\n\t}\r\n\r\n\t&.margin-flush {\r\n\t\tmargin-top: 0;\r\n\t\tmargin-bottom: 0;\r\n\t}\r\n\r\n\t&.margin-top-1 {\r\n\t\tmargin-top: var(--ptc-element-spacing-01);\r\n\t\tmargin-bottom: 0;\r\n\t}\r\n\r\n\t&.margin-top-2 {\r\n\t\tmargin-top: var(--ptc-element-spacing-02);\r\n\t\tmargin-bottom: 0;\r\n\t}\r\n\r\n\t&.margin-top-3 {\r\n\t\tmargin-top: var(--ptc-element-spacing-03);\r\n\t\tmargin-bottom: 0;\r\n\t}\r\n\r\n\t&.margin-top-4 {\r\n\t\tmargin-top: var(--ptc-element-spacing-04);\r\n\t\tmargin-bottom: 0;\r\n\t}\r\n\r\n\t&.margin-top-5 {\r\n\t\tmargin-top: var(--ptc-element-spacing-05);\r\n\t\tmargin-bottom: 0;\r\n\t}\r\n\r\n\t&.margin-top-6 {\r\n\t\tmargin-top: var(--ptc-element-spacing-06);\r\n\t\tmargin-bottom: 0;\r\n\t}\r\n\r\n\t&.margin-bottom-1 {\r\n\t\tmargin-bottom: var(--ptc-element-spacing-01);\r\n\t\tmargin-top: 0;\r\n\t}\r\n\r\n\t&.margin-bottom-2 {\r\n\t\tmargin-bottom: var(--ptc-element-spacing-02);\r\n\t\tmargin-top: 0;\r\n\t}\r\n\r\n\t&.margin-bottom-3 {\r\n\t\tmargin-bottom: var(--ptc-element-spacing-03);\r\n\t\tmargin-top: 0;\r\n\t}\r\n\r\n\t&.margin-bottom-4 {\r\n\t\tmargin-bottom: var(--ptc-element-spacing-04);\r\n\t\tmargin-top: 0;\r\n\t}\r\n\r\n\t&.margin-bottom-5 {\r\n\t\tmargin-bottom: var(--ptc-element-spacing-05);\r\n\t\tmargin-top: 0;\r\n\t}\r\n\r\n\t&.margin-bottom-6 {\r\n\t\tmargin-bottom: var(--ptc-element-spacing-06);\r\n\t\tmargin-top: 0;\r\n\t}\r\n\r\n\t&.margin-1 {\r\n\t\tmargin-top: var(--ptc-element-spacing-01);\r\n\t\tmargin-bottom: var(--ptc-element-spacing-01);\r\n\t}\r\n\r\n\t&.margin-2 {\r\n\t\tmargin-top: var(--ptc-element-spacing-02);\r\n\t\tmargin-bottom: var(--ptc-element-spacing-02);\r\n\t}\r\n\r\n\t&.margin-3 {\r\n\t\tmargin-top: var(--ptc-element-spacing-03);\r\n\t\tmargin-bottom: var(--ptc-element-spacing-03);\r\n\t}\r\n\r\n\t&.margin-4 {\r\n\t\tmargin-top: var(--ptc-element-spacing-04);\r\n\t\tmargin-bottom: var(--ptc-element-spacing-04);\r\n\t}\r\n\r\n\t&.margin-5 {\r\n\t\tmargin-top: var(--ptc-element-spacing-05);\r\n\t\tmargin-bottom: var(--ptc-element-spacing-05);\r\n\t}\r\n\r\n\t&.margin-6 {\r\n\t\tmargin-top: var(--ptc-element-spacing-06);\r\n\t\tmargin-bottom: var(--ptc-element-spacing-06);\r\n\t}\r\n\r\n\t&.line-height-densest {\r\n\t\tline-height: var(--ptc-line-height-densest);\r\n\t}\r\n\r\n\t&.line-height-denser {\r\n\t\tline-height: var(--ptc-line-height-denser);\r\n\t}\r\n\r\n\t&.line-height-p {\r\n\t\tline-height: var(--ptc-line-height-p);\r\n\t}\r\n\r\n\t&.line-height-dense {\r\n\t\tline-height: var(--ptc-line-height-dense);\r\n\t}\r\n\r\n\t&.line-height-normal {\r\n\t\tline-height: var(--ptc-line-height-normal);\r\n\t}\r\n\r\n\t&.line-height-loose {\r\n\t\tline-height: var(--ptc-line-height-loose);\r\n\t}\r\n\r\n\t&.line-height-looser {\r\n\t\tline-height: var(--ptc-line-height-looser);\r\n\t}\r\n\r\n\t&.left {\r\n\t\ttext-align: left;\r\n\t}\r\n\r\n\t&.right {\r\n\t\ttext-align: right;\r\n\t}\r\n\r\n\t&.center {\r\n\t\ttext-align: center;\r\n\t}\r\n\r\n\t&.justify {\r\n\t\ttext-align: justify;\r\n\t}\r\n\r\n\t&.right-768above {\r\n\t\ttext-align: left;\r\n\r\n\t\t@media (min-width: 768px) {\r\n\t\t\ttext-align: right;\r\n\t\t}\r\n\t}\r\n\r\n\t&.announcement {\r\n\t\ttext-transform: uppercase;\r\n\t\tfont-size: var(--ptc-font-size-small);\r\n\t\tcolor: var(--color-gray-07);\r\n\t\tline-height: var(--ptc-line-height-looser);\r\n\t\tletter-spacing: var(--ptc-letter-spacing-loose);\r\n\t}\r\n\r\n\t&.ellipsis-boxing {\r\n\t\tdisplay: -webkit-box;\r\n\t\t-webkit-line-clamp: 1;\r\n\t\t-webkit-box-orient: vertical;\r\n\t\toverflow: hidden;\r\n\t\ttext-overflow: ellipsis;\r\n\t\toverflow-wrap: break-word;\r\n\t}\r\n\t&.line-clamp-title {\r\n\t\tdisplay: -webkit-box !important;\r\n\t\t-webkit-box-orient: vertical;\r\n\t\toverflow: hidden;\r\n\t}\r\n}\r\n\r\n:host(.hide-tooltip-on-mobile) {\r\n\t.line-clamp-title {\r\n\t\t@media (max-width: 768px) {\r\n\t\t\t-webkit-line-clamp: initial !important;\r\n\t\t}\r\n\t}\r\n}\r\n","import { Component, h, Host, Prop, Element, State } from \"@stencil/core\";\r\nimport { CssClassMap, StylesMap } from \"../../../utils/interfaces\";\r\nimport { seoSlotReset } from \"../../../utils/utils\";\r\n\r\n@Component({\r\n\ttag: \"ptc-para\",\r\n\tstyleUrl: \"ptc-para.scss\",\r\n\tshadow: true,\r\n})\r\nexport class PtcPara {\r\n\t@Element() el: HTMLElement;\r\n\t/\r\n\t Paragraph font size\r\n\t /\r\n\t@Prop() fontSize:\r\n\t\t\| \"xxx-small\"\r\n\t\t\| \"xx-small\"\r\n\t\t\| \"x-small\"\r\n\t\t\| \"small\"\r\n\t\t\| \"medium\"\r\n\t\t\| \"large\"\r\n\t\t\| \"x-large\"\r\n\t\t\| \"xx-large\"\r\n\t\t\| \"xxx-large\"\r\n\t\t\| \"xxxx-large\"\r\n\t\t\| \"htmlquote-para\" = \"x-small\";\r\n\r\n\t/\r\n\t * Paragraph font weight\r\n\t /\r\n\t@Prop() fontWeight: \"w-3\" \| \"w-4\" \| \"w-5\" \| \"w-6\" \| \"w-7\" \| \"w-8\" \| \"w-9\" =\r\n\t\t\"w-4\";\r\n\r\n\t/\r\n\t * Paragraph Style\r\n\t /\r\n\t@Prop() paraStyle:\r\n\t\t\| \"default\"\r\n\t\t\| \"intro\"\r\n\t\t\| \"small\"\r\n\t\t\| \"announcement\"\r\n\t\t\| \"flush-style\"\r\n\t\t\| \"main\" = \"default\";\r\n\r\n\t/\r\n\t * Paragraph Color\r\n\t /\r\n\t@Prop() paraColor:\r\n\t\t\| \"primary-grey\"\r\n\t\t\| \"primary-green\"\r\n\t\t\| \"white\"\r\n\t\t\| \"gray-darker\" = \"primary-grey\";\r\n\r\n\t/\r\n\t line height\r\n\t /\r\n\t@Prop() paraLineH:\r\n\t\t\| \"line-height-densest\"\r\n\t\t\| \"line-height-denser\"\r\n\t\t\| \"line-height-dense\"\r\n\t\t\| \"line-height-normal\"\r\n\t\t\| \"line-height-loose\"\r\n\t\t\| \"line-height-looser\"\r\n\t\t\| \"line-height-p\" = \"line-height-normal\";\r\n\r\n\t/\r\n\t Paragraph Margin\r\n\t /\r\n\t@Prop() paraMargin?:\r\n\t\t\| \"margin-flush\"\r\n\t\t\| \"maring-top-1\"\r\n\t\t\| \"margin-top-2\"\r\n\t\t\| \"margin-top-3\"\r\n\t\t\| \"margin-top-4\"\r\n\t\t\| \"margin-top-5\"\r\n\t\t\| \"margin-top-6\"\r\n\t\t\| \"margin-bottom-1\"\r\n\t\t\| \"margin-bottom-2\"\r\n\t\t\| \"margin-bottom-3\"\r\n\t\t\| \"margin-bottom-4\"\r\n\t\t\| \"margin-bottom-5\"\r\n\t\t\| \"margin-bottom-6\"\r\n\t\t\| \"margin-1\"\r\n\t\t\| \"margin-2\"\r\n\t\t\| \"margin-3\"\r\n\t\t\| \"margin-4\"\r\n\t\t\| \"margin-5\"\r\n\t\t\| \"margin-6\";\r\n\r\n\t/\r\n\t Para text Alignment\r\n\t /\r\n\t@Prop() paraAlign?:\r\n\t\t\| \"left\"\r\n\t\t\| \"center\"\r\n\t\t\| \"right\"\r\n\t\t\| \"justify\"\r\n\t\t\| \"right-768above\";\r\n\r\n\t/\r\n\t Line number to cut text off at and add ellipsis\r\n\t /\r\n\t@Prop() ellipsisLineCutoff?: number;\r\n\r\n\t/\r\n\t sep z-index\r\n\t /\r\n\t@Prop() paraZIndex?: \"z-auto\" \| \"z-1\" \| \"z-2\" \| \"z-3\" \| \"z-99\" \| \"z-999\";\r\n\t/\r\n\t (optional) Injected CSS Styles\r\n\t /\r\n\t@Prop() styles?: string;\r\n\r\n\t/\r\n\t (optional) enable support for seo tools that can only view source\r\n\t /\r\n\t@Prop() seoCompatibilityMode: boolean = false;\r\n\r\n\t// Tooltip Properties started\r\n\t/\r\n\t index of hover tooltip element\r\n\t /\r\n\t@Prop() tooltipZIndex: string = \"auto\";\r\n\t/\r\n\t Tooltip position\r\n\t /\r\n\t@Prop() tooltipPosition:\r\n\t\t\| \"left\"\r\n\t\t\| \"right\"\r\n\t\t\| \"bottom\"\r\n\t\t\| \"bottom-right\"\r\n\t\t\| \"top\" = \"bottom\";\r\n\t/\r\n\t (optional) Injected CSS Styles\r\n\t /\r\n\t@Prop() tooltipTheme: \"standard\" \| \"danger\" = \"standard\";\r\n\t@Prop() enableTooltip: boolean = false;\r\n\t@Prop() maxChars: number;\r\n\t@Prop() maxLines: number;\r\n\ttooltipText: string;\r\n\t@Prop() hideTooltipOnMobile: boolean = false;\r\n\t@State() ismob: boolean;\r\n\t/\r\n\t If tooltip noOverflow = \"true\" then the tooltip will not be visible just ellipses will be visible\r\n\t /\r\n\t@Prop() noOverflow?: boolean = false;\r\n\r\n\t/\r\n\t This will make the width 100% respective to its parent\r\n\t */\r\n\t@Prop() tooltipWidth?: \"full-width\" \| \"default\" = \"default\";\r\n\t// Tooltip Properties ends\r\n\r\n\trender() {\r\n\t\tif (this.seoCompatibilityMode) {\r\n\t\t\tseoSlotReset(this.el);\r\n\t\t}\r\n\r\n\t\treturn this.standardRender();\r\n\t}\r\n\t//tooltip code\r\n\tgetSortedText(content: string): string \| undefined {\r\n\t\tif (!this.enableTooltip) return;\r\n\r\n\t\tconst trimmedContent = content.trim();\r\n\t\tconst shouldTruncate =\r\n\t\t\ttrimmedContent.length > this.maxChars && !this.maxLines;\r\n\t\treturn shouldTruncate\r\n\t\t\t? `${trimmedContent.slice(0, this.maxChars).trimEnd()}\\u00A0\\u2026`\r\n\t\t\t: trimmedContent;\r\n\t}\r\n\r\n\tcomponentDidLoad() {\r\n\t\tif (this.hideTooltipOnMobile) {\r\n\t\t\tthis.el.classList.add(\"hide-tooltip-on-mobile\");\r\n\t\t}\r\n\t\tthis.el.addEventListener(\"mouseenter\", () => {\r\n\t\t\tthis.toggleTitleTooltip(true);\r\n\t\t});\r\n\t\tthis.el.addEventListener(\"mouseleave\", () => {\r\n\t\t\tthis.toggleTitleTooltip(false);\r\n\t\t});\r\n\r\n\t\tif (this.enableTooltip) {\r\n\t\t\tlet paraContent = this.el.innerText \|\| this.el.textContent;\r\n\t\t\tthis.tooltipText = paraContent.trim();\r\n\t\t\tthis.el.innerText = this.getSortedText(paraContent);\r\n\t\t}\r\n\t}\r\n\r\n\ttoggleTitleTooltip(show: boolean) {\r\n\t\tconst tooltipClass = \"tooltip-box\";\r\n\t\tconst existingTooltip = this.el.querySelector(`.${tooltipClass}`);\r\n\t\tconst text = this.el.shadowRoot.querySelectorAll(\".line-clamp-title\");\r\n\r\n\t\tlet maxLinesShowCheck: boolean = false;\r\n\t\tif (text) {\r\n\t\t\ttext.forEach((t) => {\r\n\t\t\t\tmaxLinesShowCheck = t.scrollHeight > t.clientHeight;\r\n\t\t\t});\r\n\t\t}\r\n\t\tconst ifCharExceeds = this.maxChars\r\n\t\t\t? this.tooltipText.length > this.maxChars && !this.maxLines\r\n\t\t\t: false;\r\n\t\tconst ifLinesExceeds = this.maxLines && maxLinesShowCheck;\r\n\r\n\t\tif (show && this.enableTooltip) {\r\n\t\t\tif (\r\n\t\t\t\t((!existingTooltip && ifCharExceeds) \|\|\r\n\t\t\t\t\t(!existingTooltip && ifLinesExceeds)) &&\r\n\t\t\t\t!this.noOverflow\r\n\t\t\t) {\r\n\t\t\t\tconst tooltipMarkup = document.createElement(\"div\");\r\n\t\t\t\ttooltipMarkup.className = tooltipClass;\r\n\t\t\t\ttooltipMarkup.innerText = this.tooltipText;\r\n\t\t\t\ttooltipMarkup.style.zIndex = String(this.tooltipZIndex); // Ensures zIndex is a string\r\n\t\t\t\ttooltipMarkup.classList.add(\r\n\t\t\t\t\tthis.tooltipPosition,\r\n\t\t\t\t\tthis.tooltipTheme,\r\n\t\t\t\t\tthis.tooltipWidth\r\n\t\t\t\t);\r\n\t\t\t\tif (this.hideTooltipOnMobile) {\r\n\t\t\t\t\ttooltipMarkup.classList.add(\"hide-tooltip-mobile\");\r\n\t\t\t\t}\r\n\t\t\t\tthis.el.appendChild(tooltipMarkup);\r\n\t\t\t}\r\n\t\t} else {\r\n\t\t\texistingTooltip?.remove();\r\n\t\t}\r\n\t}\r\n\t//tooltip code ends\r\n\r\n\tstandardRender() {\r\n\t\tconst classMap = this.getCssClassMap();\r\n\t\tconst colorClass = this.addWhiteClass();\r\n\t\tconst cutOff = this.getLineCuttoff();\r\n\r\n\t\treturn (\r\n\t\t\t<Host class={`${colorClass} ${this.paraZIndex} trunc-text`}>\r\n\t\t\t\t{this.styles && <style>{this.styles}</style>}\r\n\t\t\t\t<p class={classMap} part=\"part-para\" style={cutOff}>\r\n\t\t\t\t\t<slot></slot>\r\n\t\t\t\t</p>\r\n\t\t\t</Host>\r\n\t\t);\r\n\t}\r\n\r\n\tprivate getCssClassMap(): CssClassMap {\r\n\t\treturn {\r\n\t\t\t[this.fontSize]: true,\r\n\t\t\t[this.fontWeight]: true,\r\n\t\t\t[this.paraStyle]: true,\r\n\t\t\t[this.paraMargin]: !!this.paraMargin ? true : false,\r\n\t\t\t[this.paraColor]: true,\r\n\t\t\t[this.paraLineH]: true,\r\n\t\t\t[this.paraAlign]: !!this.paraAlign ? true : false,\r\n\t\t\t[\"ellipsis-boxing\"]:\r\n\t\t\t\tthis.ellipsisLineCutoff && this.ellipsisLineCutoff > 0,\r\n\t\t\t[\"line-clamp-title\"]: this.maxLines && this.maxLines > 0, //tooltip code,\r\n\t\t};\r\n\t}\r\n\t//WEB-2392\r\n\tprivate addWhiteClass(): CssClassMap {\r\n\t\tif (this.paraColor == \"white\") {\r\n\t\t\treturn {\r\n\t\t\t\t[this.paraColor]: true,\r\n\t\t\t};\r\n\t\t}\r\n\t}\r\n\r\n\tprivate getLineCuttoff(): StylesMap {\r\n\t\tconst lineClamp =\r\n\t\t\tthis.ellipsisLineCutoff > 0\r\n\t\t\t\t? this.ellipsisLineCutoff\r\n\t\t\t\t: this.maxLines;\r\n\t\treturn lineClamp > 0 ? { \"-webkit-line-clamp\": `${lineClamp}` } : {};\r\n\t}\r\n}\r\n"],"version":3}

package/dist/components/{p-fw8Vl3vu.js → p-CDH04Z6-.js} RENAMED Viewed

@@ -1,4 +1,4 @@
-import { p as proxyCustomElement, H, e as createEvent, h, d as Host } from './p-BYSv8uGQ.js';
+import { p as proxyCustomElement, H, e as createEvent, h, d as Host } from './p-BvGlmU4v.js';
 import { C as CheckDarkFocusState, g as getSeoTagType } from './p-DpFzAwLW.js';
 const ptcButtonCss = "button.disabled{pointer-events:none;opacity:0.6}button{background-color:var(--color-gray-10);display:inline-block;border-style:solid;border-width:1px;white-space:normal;position:relative;text-decoration:none;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;cursor:pointer;padding:9.4px 17.5px;border-radius:var(--ptc-border-radius-standard)}button.reveal-down .content{transition:opacity var(--ptc-transition-medium) var(--ptc-ease-out);opacity:0;font-size:var(--ptc-font-size-xx-small)}button.reveal-down .icon-wrapper{position:relative;display:flex;align-items:center;justify-content:center;align-content:center;height:16px}button.reveal-down .icon-wrapper .icon{transition:top var(--ptc-transition-fast) var(--ptc-ease-out);position:absolute;display:inline-block;top:-12px}button:hover.reveal-down .content{opacity:1}button:hover.reveal-down .icon-wrapper .icon{top:4px}button.animation-right ::slotted([slot=slot-after-text]),button.animation-right ::slotted([slot=slot-before-text]),button.animation-down ::slotted([slot=slot-after-text]),button.animation-down ::slotted([slot=slot-before-text]){transition:transform var(--ptc-transition-medium) var(--ptc-ease-inout);position:relative;display:inline-block}button:hover.animation-right ::slotted([slot=slot-after-text]),button:hover.animation-right ::slotted([slot=slot-before-text]){transform:translateX(var(--ptc-element-spacing-02))}button:hover.animation-down ::slotted([slot=slot-after-text]),button:hover.animation-down ::slotted([slot=slot-before-text]){transform:translateY(var(--ptc-element-spacing-02))}button span{font-family:var(--ptc-font-latin);font-size:var(--ptc-font-size-small);font-weight:bold;line-height:var(--ptc-line-height-densest)}button.left{text-align:left}button.right{text-align:right}button.center{text-align:center}.icon-left ::slotted([slot=slot-before-text]){margin-right:var(--ptc-element-spacing-01)}.icon-right ::slotted([slot=slot-after-text]){margin-left:var(--ptc-element-spacing-01)}.blackgrey:hover{box-shadow:var(--ptc-shadow-x-large)}.blackgrey{box-shadow:var(--ptc-shadow-x-small);border:solid 1px var(--color-gray-10);background-image:linear-gradient(285deg, var(--color-gray-10) 155%, var(--color-gray-07) 62%)}.blackgrey span{color:var(--color-white)}.turtlegreen:hover{box-shadow:var(--ptc-shadow-x-large)}.turtlegreen{box-shadow:var(--ptc-shadow-x-small);border:solid 1px var(--color-green-07);background-image:linear-gradient(285deg, var(--color-green-07) 155%, var(--color-green-07) 62%)}.turtlegreen span{color:var(--color-white)}.offwhite{box-shadow:var(--ptc-shadow-x-small);border:solid 1px var(--color-gray-10);background-image:linear-gradient(to right, var(--color-white), var(--color-gray-02), var(--color-gray-01))}.offwhite:hover{box-shadow:var(--ptc-shadow-x-large)}.offwhite span{color:var(--color-gray-10)}.legacy-green{margin-left:10px;padding:10px 20px;margin-bottom:var(--ptc-element-spacing-01);margin-top:var(--ptc-element-spacing-01)}.legacy-green:after{position:absolute;content:\"\";top:-1px;left:0;bottom:0;right:0;width:100%;height:103%;background-image:linear-gradient(to right, var(--color-green-08), var(--color-green-06));opacity:0;transition:opacity var(--ptc-transition-x-slow) var(--ptc-ease-inout);border-radius:2px}.legacy-green:hover{box-shadow:var(--ptc-shadow-x-large)}.legacy-green:hover span{color:var(--color-white)}.legacy-green:hover:after{opacity:1}.legacy-green{box-shadow:var(--ptc-shadow-large);border:solid 2.5px var(--color-green-08);background-image:linear-gradient(to right, var(--color-green-06), var(--color-green-08))}.legacy-green span{font-family:var(--ptc-font-secondary-latin);color:var(--color-white);z-index:100;position:relative;text-transform:uppercase;font-weight:var(--ptc-font-weight-bold);letter-spacing:var(--ptc-letter-spacing-normal);font-size:var(--ptc-font-size-x-small)}@media only screen and (min-width: 768px){.legacy-green span{font-size:var(--ptc-font-size-small);letter-spacing:var(--ptc-letter-spacing-loose)}}.legacy-green icon-asset{display:inline}a{border-style:solid;border-width:1px;position:relative;text-decoration:none;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;padding:9.4px 17.5px;border-radius:var(--ptc-border-radius-standard);display:inline-block;position:relative}a.animation-right ::slotted([slot=slot-after-text]),a.animation-right ::slotted([slot=slot-before-text]),a.animation-down ::slotted([slot=slot-after-text]),a.animation-down ::slotted([slot=slot-before-text]){transition:all var(--ptc-ease-inout) var(--ptc-transition-medium);position:relative;display:inline-block;margin-left:5px}a:hover.animation-right ::slotted([slot=slot-after-text]),a:hover.animation-right ::slotted([slot=slot-before-text]){transform:translateX(var(--ptc-element-spacing-02))}a:hover.animation-down ::slotted([slot=slot-after-text]),a:hover.animation-down ::slotted([slot=slot-before-text]){transform:translateY(var(--ptc-element-spacing-02))}a.left{text-align:left}a.right{text-align:right}a.center{text-align:center}.nav{font-family:var(--ptc-font-latin);background-color:var(--color-gray-10);border-radius:var(--ptc-border-radius-standard);border:1px solid var(--color-white);border-bottom-style:solid;border-bottom-width:1px;box-sizing:border-box;color:var(--color-white);display:inline-block;font-size:var(--ptc-font-size-xx-small);font-stretch:100%;font-weight:var(--ptc-font-weight-bold);line-height:var(--ptc-line-height-loose);list-style:none;padding:3px var(--ptc-element-spacing-04);position:relative;text-align:center;text-decoration:none;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;transition:background-color var(--ptc-transition-medium) var(--ptc-ease-inout)}.nav:focus-visible{border-radius:4px !important;border:2px solid #fff !important;outline:5px solid #003dd6 !important;background-color:transparent !important;outline-offset:0px !important}.nav:focus{text-decoration:none;border:solid 2px transparent;outline:none}.nav:hover{background-color:var(--color-gray-12)}.nav-store-btn{font-family:var(--ptc-font-latin);background-color:var(--color-green-07);border-radius:var(--ptc-border-radius-standard);border:1px solid var(--color-green-07);border-bottom-style:solid;border-bottom-width:1px;box-sizing:border-box;color:var(--color-white);display:inline-block;font-size:var(--ptc-font-size-xx-small);font-stretch:100%;font-weight:var(--ptc-font-weight-bold);line-height:var(--ptc-line-height-loose);list-style:none;padding:3px var(--ptc-element-spacing-04);position:relative;text-align:center;text-decoration:none;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;transition:background-color var(--ptc-transition-medium) var(--ptc-ease-inout)}.nav-store-btn:focus-visible{border-radius:4px !important;border:2px solid #fff !important;outline:5px solid #003dd6 !important;background-color:var(--color-green-07) !important;outline-offset:0px !important}.nav-store-btn:focus{text-decoration:none;border:solid 2px transparent;outline:none}.nav-store-btn:hover{background-color:var(--color-green-08)}.nav-store-btn:active{background-color:var(--color-green-09);transition:none}.ptc-primary,.ptc-quaternary,.ptc-secondary,.ptc-tertiary,.icon-toggle{padding:var(--ptc-font-size-xx-small) var(--ptc-font-size-medium);transition:background-color var(--ptc-ease-inout) var(--ptc-transition-medium);line-height:20px}.ptc-primary.disabled,.ptc-quaternary.disabled,.ptc-secondary.disabled,.ptc-tertiary.disabled,.icon-toggle.disabled{pointer-events:none;border-color:var(--color-gray-03);background:var(--color-gray-02)}.ptc-primary.disabled span,.ptc-quaternary.disabled span,.ptc-secondary.disabled span,.ptc-tertiary.disabled span,.icon-toggle.disabled span{color:var(--color-gray-03)}.ptc-primary.disabled ::slotted([slot=slot-after-text]),.ptc-quaternary.disabled ::slotted([slot=slot-after-text]),.ptc-secondary.disabled ::slotted([slot=slot-after-text]),.ptc-tertiary.disabled ::slotted([slot=slot-after-text]),.icon-toggle.disabled ::slotted([slot=slot-after-text]){fill:var(--color-gray-03) !important}.ptc-primary:focus-visible,.ptc-quaternary:focus-visible,.ptc-secondary:focus-visible,.ptc-tertiary:focus-visible,.icon-toggle:focus-visible{border-radius:var(--ptc-border-radius-standard);outline:5px solid var(--keyboard-nav-outline)}.ptc-primary span,.ptc-quaternary span,.ptc-secondary span,.ptc-tertiary span,.icon-toggle span{font-family:var(--ptc-font-latin);font-weight:var(--ptc-font-weight-bold);font-size:var(--ptc-font-size-small);line-height:var(--ptc-line-height-densest);letter-spacing:normal}.ptc-primary.small,.ptc-quaternary.small,.ptc-secondary.small,.ptc-tertiary.small,.icon-toggle.small{padding:var(--ptc-element-spacing-03) var(--ptc-element-spacing-04)}.ptc-primary.small span,.ptc-quaternary.small span,.ptc-secondary.small span,.ptc-tertiary.small span,.icon-toggle.small span{font-size:var(--ptc-font-size-xx-small)}.ptc-primary.medium,.ptc-quaternary.medium,.ptc-secondary.medium,.ptc-tertiary.medium,.icon-toggle.medium{padding:14px 20px}.ptc-primary.medium span,.ptc-quaternary.medium span,.ptc-secondary.medium span,.ptc-tertiary.medium span,.icon-toggle.medium span{font-size:var(--ptc-font-size-small)}.ptc-primary.large,.ptc-quaternary.large,.ptc-secondary.large,.ptc-tertiary.large,.icon-toggle.large{padding:var(--ptc-element-spacing-04) var(--ptc-element-spacing-06)}.ptc-primary.large span,.ptc-quaternary.large span,.ptc-secondary.large span,.ptc-tertiary.large span,.icon-toggle.large span{font-size:var(--ptc-font-size-large)}.ptc-primary.acc-alt-style:focus-visible,.ptc-quaternary.acc-alt-style:focus-visible,.ptc-secondary.acc-alt-style:focus-visible,.ptc-tertiary.acc-alt-style:focus-visible,.icon-toggle.acc-alt-style:focus-visible{border-radius:var(--ptc-border-radius-standard);border:2px solid rgb(255, 255, 255);outline:5px solid var(--keyboard-nav-outline)}.ptc-primary{background:var(--color-gray-12);border:2px solid var(--color-green-07);border-radius:var(--ptc-border-radius-standard)}.ptc-primary:hover{background-color:var(--color-gray-10)}.ptc-primary:active{background-color:var(--color-black);transition:none}.ptc-primary span{color:var(--color-white)}.ptc-primary ::slotted([slot=slot-after-text]){fill:var(--color-white) !important}.ptc-secondary{background:var(--color-gray-12);border:2px solid var(--color-gray-08);border-radius:var(--ptc-border-radius-standard)}.ptc-secondary:hover{background-color:var(--color-gray-10)}.ptc-secondary:active{background-color:var(--color-black);transition:none}.ptc-secondary span{color:var(--color-white)}.ptc-secondary ::slotted([slot=slot-after-text]){fill:var(--color-white) !important}.ptc-tertiary{background:var(--color-white);border:2px solid var(--color-gray-10);border-radius:var(--ptc-border-radius-standard)}.ptc-tertiary:hover{background-color:var(--color-gray-02)}.ptc-tertiary:active{background-color:var(--color-gray-03);transition:none}.ptc-tertiary span{color:var(--color-gray-10)}.ptc-tertiary ::slotted([slot=slot-after-text]){fill:var(--color-gray-10) !important}.ptc-tertiary ::slotted(a){color:var(--color-gray-10) !important;text-decoration-line:none !important}.ptc-quaternary{background:var(--color-green-07);border:2px solid var(--color-green-07);border-radius:var(--ptc-border-radius-standard);cursor:pointer}.ptc-quaternary:hover{background-color:var(--color-green-08)}.ptc-quaternary:active{background-color:var(--color-green-09);transition:none}.ptc-quaternary span{color:var(--color-white)}.ptc-quaternary ::slotted([slot=slot-after-text]){fill:var(--color-white) !important}.icon-toggle{background:var(--color-white);border:1px solid var(--color-gray-10);border-radius:var(--ptc-border-radius-standard);padding:0;height:2.125rem;width:2.125rem;box-shadow:var(--ptc-shadow-medium)}.icon-toggle:hover{background-color:var(--color-gray-02)}.icon-toggle:active{transition:none;background-color:var(--color-gray-03)}.icon-toggle.active{background-color:var(--color-gray-04)}.icon-toggle.active:hover{background-color:var(--color-gray-05)}.icon-toggle.active:active{transition:none;background-color:var(--color-gray-03)}.icon-toggle:focus{outline:2px solid var(--color-blue-07);outline-offset:1px}.icon-toggle span{color:var(--color-gray-10);padding:0}.icon-toggle ::slotted([slot=slot-after-text]){fill:var(--color-gray-10) !important}.icon-toggle ::slotted(icon-asset){display:block;margin:auto;height:18px;width:18px}.clear-search{border:none;padding:0px;line-height:var(----ptc-line-height-densest);background-color:transparent}.clear-search:hover{text-decoration:underline;text-decoration-color:var(--color-white)}.clear-search span{color:var(--color-white);font-weight:var(--ptc-font-weight-semibold);font-size:var(--ptc-font-size-x-small);-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}.tracker-div{display:inline;display:inline-block}.focus-state-dark-background:focus-visible{border-radius:var(--ptc-border-radius-standard);border:2px solid rgb(255, 255, 255);outline:5px solid var(--keyboard-nav-outline)}.secondary-cta-light,.secondary-cta-dark,.primary-cta{padding:0.875rem 1.25rem;font-size:var(--ptc-font-size-small);font-style:normal;font-weight:var(--ptc-font-weight-bold);line-height:var(--ptc-line-height-densest);color:var(--color-white);border:2px solid transparent;text-decoration:none}.medium.secondary-cta-light,.medium.secondary-cta-dark,.medium.primary-cta{padding:0.75rem 1rem}.medium.secondary-cta-light span,.medium.secondary-cta-dark span,.medium.primary-cta span{font-size:var(--ptc-font-size-xx-small);font-weight:var(--ptc-font-weight-extrabold)}.small.secondary-cta-light,.small.secondary-cta-dark,.small.primary-cta{padding:0.5rem 0.75rem}.small.secondary-cta-light span,.small.secondary-cta-dark span,.small.primary-cta span{font-size:var(--ptc-font-size-xx-small);font-weight:var(--ptc-font-weight-extrabold)}.disabled.secondary-cta-light,.disabled.secondary-cta-dark,.disabled.primary-cta{pointer-events:none;color:var(--color-gray-03);border-color:var(--color-gray-03);background-color:var(--color-gray-02)}.disabled.secondary-cta-light icon-asset svg,.disabled.secondary-cta-dark icon-asset svg,.disabled.primary-cta icon-asset svg{fill:var(--color-gray-03)}.disabled.secondary-cta-light:focus-visible,.disabled.secondary-cta-dark:focus-visible,.disabled.primary-cta:focus-visible{background-color:var(--color-gray-02)}.secondary-cta-light:focus-visible,.secondary-cta-dark:focus-visible,.primary-cta:focus-visible{border-radius:var(--ptc-border-radius-standard);border:2px solid rgb(255, 255, 255);outline:5px solid var(--keyboard-nav-outline)}.full-width.secondary-cta-light,.full-width.secondary-cta-dark,.full-width.primary-cta{width:100%}.secondary-cta-light .cta-content-wrap,.secondary-cta-dark .cta-content-wrap,.primary-cta .cta-content-wrap{display:flex;justify-content:center;align-items:center;text-align:center}.secondary-cta-light .cta-content-wrap icon-asset,.secondary-cta-dark .cta-content-wrap icon-asset,.primary-cta .cta-content-wrap icon-asset{margin-right:8px;line-height:0}.secondary-cta-light .cta-content-wrap icon-asset+span,.secondary-cta-dark .cta-content-wrap icon-asset+span,.primary-cta .cta-content-wrap icon-asset+span{text-align:left}.primary-cta{background-color:var(--color-green-07);border-color:var(--color-green-07);transition:all 0.2s ease}.primary-cta:hover{background-color:var(--color-green-08)}.primary-cta:active{background-color:var(--color-green-09)}.primary-cta:focus-visible{background-color:var(--color-green-07)}.secondary-cta-dark{background-color:var(--color-gray-12);border-color:var(--color-gray-08)}.secondary-cta-dark:hover{background-color:var(--color-gray-10)}.secondary-cta-dark:active{background-color:var(--color-black)}.secondary-cta-dark:focus-visible{background-color:var(--color-gray-12)}.secondary-cta-light{background-color:var(--color-white);border-color:var(--color-gray-10);color:var(--color-gray-10)}.secondary-cta-light:hover{background-color:var(--color-gray-02)}.secondary-cta-light:active{background-color:var(--color-gray-03)}.secondary-cta-light:focus-visible{background-color:var(--color-white)}";
@@ -214,6 +214,6 @@ function defineCustomElement() {
 defineCustomElement();
 export { PtcButton as P, defineCustomElement as d };
-//# sourceMappingURL=p-fw8Vl3vu.js.map
+//# sourceMappingURL=p-CDH04Z6-.js.map
-//# sourceMappingURL=p-fw8Vl3vu.js.map
+//# sourceMappingURL=p-CDH04Z6-.js.map

package/dist/components/{p-fw8Vl3vu.js.map → p-CDH04Z6-.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"file":"p-fw8Vl3vu.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/atoms/ptc-button/ptc-button.scss?tag=ptc-button&encapsulation=shadow","src/components/atoms/ptc-button/ptc-button.tsx"],"sourcesContent":["@use 'mixins' as ;\r\n\r\nbutton.disabled {\r\n pointer-events: none;\r\n opacity: 0.6;\r\n}\r\n\r\nbutton {\r\n background-color: var(--color-gray-10);\r\n display: inline-block;\r\n border-style: solid;\r\n border-width: 1px;\r\n white-space: normal;\r\n position: relative;\r\n text-decoration: none;\r\n -moz-osx-font-smoothing: grayscale;\r\n /(For Firefox)/\r\n -webkit-font-smoothing: antialiased;\r\n /(For Chrome and Safari)/\r\n cursor: pointer;\r\n padding: 9.4px 17.5px;\r\n border-radius: var(--ptc-border-radius-standard);\r\n\r\n &.reveal-down {\r\n .content {\r\n transition: opacity var(--ptc-transition-medium) var(--ptc-ease-out);\r\n opacity: 0;\r\n font-size: var(--ptc-font-size-xx-small);\r\n }\r\n .icon-wrapper {\r\n position: relative;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n align-content: center;\r\n height: 16px;\r\n\r\n .icon {\r\n transition: top var(--ptc-transition-fast) var(--ptc-ease-out);\r\n position: absolute;\r\n display: inline-block;\r\n top: -12px;\r\n }\r\n }\r\n }\r\n\r\n &:hover {\r\n &.reveal-down {\r\n .content {\r\n opacity: 1;\r\n }\r\n\r\n .icon-wrapper {\r\n .icon {\r\n top: 4px;\r\n }\r\n }\r\n }\r\n }\r\n\r\n &.animation-right,\r\n &.animation-down {\r\n ::slotted([slot='slot-after-text']),\r\n ::slotted([slot='slot-before-text']) {\r\n transition: transform var(--ptc-transition-medium) var(--ptc-ease-inout);\r\n position: relative;\r\n display: inline-block;\r\n }\r\n }\r\n\r\n &:hover {\r\n &.animation-right {\r\n ::slotted([slot='slot-after-text']),\r\n ::slotted([slot='slot-before-text']) {\r\n transform: translateX(var(--ptc-element-spacing-02));\r\n }\r\n }\r\n\r\n &.animation-down {\r\n ::slotted([slot='slot-after-text']),\r\n ::slotted([slot='slot-before-text']) {\r\n transform: translateY(var(--ptc-element-spacing-02));\r\n }\r\n }\r\n }\r\n\r\n span {\r\n font-family: var(--ptc-font-latin);\r\n font-size: var(--ptc-font-size-small);\r\n font-weight: bold;\r\n line-height: var(--ptc-line-height-densest);\r\n }\r\n &.left {\r\n text-align: left;\r\n }\r\n &.right {\r\n text-align: right;\r\n }\r\n &.center {\r\n text-align: center;\r\n }\r\n}\r\n\r\n.icon-left {\r\n ::slotted([slot='slot-before-text']) {\r\n margin-right: var(--ptc-element-spacing-01);\r\n }\r\n}\r\n\r\n.icon-right {\r\n ::slotted([slot='slot-after-text']) {\r\n margin-left: var(--ptc-element-spacing-01);\r\n }\r\n}\r\n\r\n.blackgrey {\r\n &:hover {\r\n box-shadow: var(--ptc-shadow-x-large);\r\n }\r\n\r\n box-shadow: var(--ptc-shadow-x-small);\r\n border: solid 1px var(--color-gray-10);\r\n background-image: linear-gradient(285deg, var(--color-gray-10) 155%, var(--color-gray-07) 62%);\r\n\r\n span {\r\n color: var(--color-white);\r\n }\r\n}\r\n\r\n.turtlegreen {\r\n &:hover {\r\n box-shadow: var(--ptc-shadow-x-large);\r\n }\r\n\r\n box-shadow: var(--ptc-shadow-x-small);\r\n border: solid 1px var(--color-green-07);\r\n background-image: linear-gradient(285deg, var(--color-green-07) 155%, var(--color-green-07) 62%);\r\n\r\n span {\r\n color: var(--color-white);\r\n }\r\n}\r\n\r\n.offwhite {\r\n box-shadow: var(--ptc-shadow-x-small);\r\n border: solid 1px var(--color-gray-10);\r\n background-image: linear-gradient(to right, var(--color-white), var(--color-gray-02), var(--color-gray-01));\r\n\r\n &:hover {\r\n box-shadow: var(--ptc-shadow-x-large);\r\n }\r\n\r\n span {\r\n color: var(--color-gray-10);\r\n }\r\n}\r\n\r\n.legacy-green {\r\n margin-left: 10px;\r\n padding: 10px 20px;\r\n margin-bottom: var(--ptc-element-spacing-01);\r\n margin-top: var(--ptc-element-spacing-01);\r\n\r\n &:after {\r\n position: absolute;\r\n content: '';\r\n top: -1px;\r\n left: 0;\r\n bottom: 0;\r\n right: 0;\r\n width: 100%;\r\n height: 103%;\r\n background-image: linear-gradient(to right, var(--color-green-08), var(--color-green-06));\r\n opacity: 0;\r\n transition: opacity var(--ptc-transition-x-slow) var(--ptc-ease-inout);\r\n border-radius: 2px;\r\n }\r\n\r\n &:hover {\r\n box-shadow: var(--ptc-shadow-x-large);\r\n\r\n span {\r\n color: var(--color-white);\r\n }\r\n }\r\n\r\n &:hover:after {\r\n opacity: 1;\r\n }\r\n\r\n box-shadow: var(--ptc-shadow-large);\r\n border: solid 2.5px var(--color-green-08);\r\n background-image: linear-gradient(to right, var(--color-green-06), var(--color-green-08));\r\n\r\n span {\r\n font-family: var(--ptc-font-secondary-latin);\r\n color: var(--color-white);\r\n z-index: 100;\r\n position: relative;\r\n text-transform: uppercase;\r\n font-weight: var(--ptc-font-weight-bold);\r\n letter-spacing: var(--ptc-letter-spacing-normal);\r\n font-size: var(--ptc-font-size-x-small);\r\n\r\n @include screen-sm {\r\n font-size: var(--ptc-font-size-small);\r\n letter-spacing: var(--ptc-letter-spacing-loose);\r\n }\r\n }\r\n\r\n icon-asset {\r\n display: inline;\r\n }\r\n}\r\n\r\n//Link style adjustments\r\na {\r\n border-style: solid;\r\n border-width: 1px;\r\n position: relative;\r\n text-decoration: none;\r\n -moz-osx-font-smoothing: grayscale;\r\n /(For Firefox)/\r\n -webkit-font-smoothing: antialiased;\r\n /(For Chrome and Safari)/\r\n padding: 9.4px 17.5px;\r\n border-radius: var(--ptc-border-radius-standard);\r\n display: inline-block;\r\n position: relative;\r\n\r\n &.animation-right,\r\n &.animation-down {\r\n ::slotted([slot='slot-after-text']),\r\n ::slotted([slot='slot-before-text']) {\r\n transition: all var(--ptc-ease-inout) var(--ptc-transition-medium);\r\n position: relative;\r\n display: inline-block;\r\n margin-left: 5px;\r\n }\r\n }\r\n\r\n &:hover {\r\n &.animation-right {\r\n ::slotted([slot='slot-after-text']),\r\n ::slotted([slot='slot-before-text']) {\r\n transform: translateX(var(--ptc-element-spacing-02));\r\n }\r\n }\r\n\r\n &.animation-down {\r\n ::slotted([slot='slot-after-text']),\r\n ::slotted([slot='slot-before-text']) {\r\n transform: translateY(var(--ptc-element-spacing-02));\r\n }\r\n }\r\n }\r\n &.left {\r\n text-align: left;\r\n }\r\n &.right {\r\n text-align: right;\r\n }\r\n &.center {\r\n text-align: center;\r\n }\r\n}\r\n\r\n.nav {\r\n font-family: var(--ptc-font-latin);\r\n background-color: var(--color-gray-10);\r\n border-radius: var(--ptc-border-radius-standard);\r\n border: 1px solid var(--color-white);\r\n border-bottom-style: solid;\r\n border-bottom-width: 1px;\r\n box-sizing: border-box;\r\n color: var(--color-white);\r\n display: inline-block;\r\n font-size: var(--ptc-font-size-xx-small);\r\n font-stretch: 100%; //undefined value\r\n font-weight: var(--ptc-font-weight-bold);\r\n line-height: var(--ptc-line-height-loose);\r\n list-style: none;\r\n padding: 3px var(--ptc-element-spacing-04);\r\n position: relative;\r\n text-align: center;\r\n text-decoration: none;\r\n -moz-osx-font-smoothing: grayscale;\r\n /(For Firefox)/\r\n -webkit-font-smoothing: antialiased;\r\n /(For Chrome and Safari)/\r\n transition: background-color var(--ptc-transition-medium) var(--ptc-ease-inout);\r\n\r\n &:focus-visible {\r\n border-radius: 4px !important;\r\n border: 2px solid #fff !important;\r\n outline: 5px solid #003dd6 !important;\r\n background-color: transparent !important;\r\n outline-offset: 0px !important;\r\n }\r\n\r\n &:focus {\r\n text-decoration: none;\r\n border: solid 2px transparent;\r\n outline: none;\r\n }\r\n\r\n // &:focus {\r\n // outline: 3px solid var(--color-blue-07);\r\n // outline-offset: 2px;\r\n // }\r\n\r\n &:hover {\r\n background-color: var(--color-gray-12);\r\n }\r\n}\r\n\r\n.nav-store-btn {\r\n font-family: var(--ptc-font-latin);\r\n background-color: var(--color-green-07);\r\n border-radius: var(--ptc-border-radius-standard);\r\n border: 1px solid var(--color-green-07);\r\n border-bottom-style: solid;\r\n border-bottom-width: 1px;\r\n box-sizing: border-box;\r\n color: var(--color-white);\r\n display: inline-block;\r\n font-size: var(--ptc-font-size-xx-small);\r\n font-stretch: 100%; //undefined value\r\n font-weight: var(--ptc-font-weight-bold);\r\n line-height: var(--ptc-line-height-loose);\r\n list-style: none;\r\n padding: 3px var(--ptc-element-spacing-04);\r\n position: relative;\r\n text-align: center;\r\n text-decoration: none;\r\n -moz-osx-font-smoothing: grayscale;\r\n /(For Firefox)/\r\n -webkit-font-smoothing: antialiased;\r\n /(For Chrome and Safari)/\r\n transition: background-color var(--ptc-transition-medium) var(--ptc-ease-inout);\r\n\r\n &:focus-visible {\r\n border-radius: 4px !important;\r\n border: 2px solid #fff !important;\r\n outline: 5px solid #003dd6 !important;\r\n background-color: var(--color-green-07) !important;\r\n outline-offset: 0px !important;\r\n }\r\n\r\n &:focus {\r\n text-decoration: none;\r\n border: solid 2px transparent;\r\n outline: none;\r\n }\r\n\r\n // &:focus {\r\n // outline: 3px solid var(--color-blue-07);\r\n // outline-offset: 2px;\r\n // }\r\n\r\n &:hover {\r\n background-color: var(--color-green-08);\r\n }\r\n\r\n &:active {\r\n background-color: var(--color-green-09);\r\n transition: none;\r\n }\r\n}\r\n\r\n//ADA button updates\r\n.ptc-primary,\r\n.ptc-quaternary,\r\n.ptc-secondary,\r\n.ptc-tertiary,\r\n.icon-toggle {\r\n padding: var(--ptc-font-size-xx-small) var(--ptc-font-size-medium);\r\n transition: background-color var(--ptc-ease-inout) var(--ptc-transition-medium);\r\n line-height: 20px; //undefined size\r\n\r\n &.disabled {\r\n pointer-events: none;\r\n border-color: var(--color-gray-03);\r\n background: var(--color-gray-02);\r\n\r\n span {\r\n color: var(--color-gray-03);\r\n }\r\n\r\n ::slotted([slot='slot-after-text']) {\r\n fill: var(--color-gray-03) !important;\r\n }\r\n }\r\n\r\n // &:focus {\r\n // outline: 3px solid var(--color-blue-07);\r\n // outline-offset: 2px;\r\n // }\r\n\r\n &:focus-visible {\r\n @include base-focus-state;\r\n }\r\n\r\n span {\r\n font-family: var(--ptc-font-latin);\r\n font-weight: var(--ptc-font-weight-bold);\r\n font-size: var(--ptc-font-size-small);\r\n line-height: var(--ptc-line-height-densest);\r\n letter-spacing: normal;\r\n }\r\n &.small {\r\n padding: var(--ptc-element-spacing-03) var(--ptc-element-spacing-04);\r\n span {\r\n font-size: var(--ptc-font-size-xx-small);\r\n }\r\n }\r\n &.medium {\r\n padding: 14px 20px;\r\n span {\r\n font-size: var(--ptc-font-size-small);\r\n }\r\n }\r\n &.large {\r\n padding: var(--ptc-element-spacing-04) var(--ptc-element-spacing-06);\r\n span {\r\n font-size: var(--ptc-font-size-large);\r\n }\r\n }\r\n\r\n &.acc-alt-style {\r\n &:focus-visible {\r\n @include focus-state;\r\n }\r\n }\r\n}\r\n\r\n.ptc-primary {\r\n background: var(--color-gray-12); //--color-primary\r\n border: 2px solid var(--color-green-07); //--color-primary-green\r\n border-radius: var(--ptc-border-radius-standard);\r\n\r\n &:hover {\r\n background-color: var(--color-gray-10);\r\n }\r\n\r\n &:active {\r\n background-color: var(--color-black);\r\n transition: none;\r\n }\r\n\r\n span {\r\n color: var(--color-white);\r\n }\r\n\r\n ::slotted([slot='slot-after-text']) {\r\n fill: var(--color-white) !important;\r\n }\r\n}\r\n\r\n.ptc-secondary {\r\n background: var(--color-gray-12);\r\n border: 2px solid var(--color-gray-08);\r\n border-radius: var(--ptc-border-radius-standard);\r\n\r\n &:hover {\r\n background-color: var(--color-gray-10);\r\n }\r\n\r\n &:active {\r\n background-color: var(--color-black);\r\n transition: none;\r\n }\r\n\r\n span {\r\n color: var(--color-white);\r\n }\r\n\r\n ::slotted([slot='slot-after-text']) {\r\n fill: var(--color-white) !important;\r\n }\r\n}\r\n\r\n.ptc-tertiary {\r\n background: var(--color-white);\r\n border: 2px solid var(--color-gray-10);\r\n border-radius: var(--ptc-border-radius-standard);\r\n\r\n &:hover {\r\n background-color: var(--color-gray-02);\r\n }\r\n\r\n &:active {\r\n background-color: var(--color-gray-03);\r\n transition: none;\r\n }\r\n\r\n span {\r\n color: var(--color-gray-10);\r\n }\r\n\r\n ::slotted([slot='slot-after-text']) {\r\n fill: var(--color-gray-10) !important;\r\n }\r\n\r\n ::slotted(a) {\r\n color: var(--color-gray-10) !important;\r\n text-decoration-line: none !important;\r\n }\r\n}\r\n\r\n.ptc-quaternary {\r\n background: var(--color-green-07);\r\n border: 2px solid var(--color-green-07);\r\n border-radius: var(--ptc-border-radius-standard);\r\n cursor: pointer;\r\n\r\n &:hover {\r\n background-color: var(--color-green-08);\r\n }\r\n\r\n &:active {\r\n background-color: var(--color-green-09);\r\n transition: none;\r\n }\r\n\r\n span {\r\n color: var(--color-white);\r\n }\r\n\r\n ::slotted([slot='slot-after-text']) {\r\n fill: var(--color-white) !important;\r\n }\r\n}\r\n\r\n.icon-toggle {\r\n background: var(--color-white);\r\n border: 1px solid var(--color-gray-10);\r\n border-radius: var(--ptc-border-radius-standard);\r\n padding: 0;\r\n height: 2.125rem;\r\n width: 2.125rem;\r\n box-shadow: var(--ptc-shadow-medium);\r\n\r\n &:hover {\r\n background-color: var(--color-gray-02);\r\n }\r\n\r\n &:active {\r\n transition: none;\r\n background-color: var(--color-gray-03);\r\n }\r\n\r\n &.active {\r\n background-color: var(--color-gray-04);\r\n\r\n &:hover {\r\n background-color: var(--color-gray-05);\r\n }\r\n\r\n &:active {\r\n transition: none;\r\n background-color: var(--color-gray-03);\r\n }\r\n }\r\n\r\n &:focus {\r\n outline: 2px solid var(--color-blue-07);\r\n outline-offset: 1px;\r\n }\r\n\r\n span {\r\n color: var(--color-gray-10);\r\n padding: 0;\r\n }\r\n\r\n ::slotted([slot='slot-after-text']) {\r\n fill: var(--color-gray-10) !important;\r\n }\r\n\r\n ::slotted(icon-asset) {\r\n display: block;\r\n margin: auto;\r\n height: 18px;\r\n width: 18px;\r\n }\r\n}\r\n\r\n.clear-search {\r\n border: none;\r\n padding: 0px;\r\n line-height: var(----ptc-line-height-densest);\r\n background-color: transparent;\r\n\r\n &:hover {\r\n text-decoration: underline;\r\n text-decoration-color: var(--color-white);\r\n }\r\n\r\n span {\r\n color: var(--color-white);\r\n font-weight: var(--ptc-font-weight-semibold);\r\n font-size: var(--ptc-font-size-x-small);\r\n -moz-osx-font-smoothing: grayscale;\r\n -webkit-font-smoothing: antialiased;\r\n }\r\n}\r\n\r\n.tracker-div {\r\n @include div-tracker;\r\n display: inline-block;\r\n}\r\n\r\n.focus-state-dark-background {\r\n &:focus-visible {\r\n @include focus-state;\r\n }\r\n}\r\n\r\n// New CTA's\r\n// Common CTA base styles\r\n%cta-base {\r\n padding: 0.875rem 1.25rem;\r\n font-size: var(--ptc-font-size-small);\r\n font-style: normal;\r\n font-weight: var(--ptc-font-weight-bold);\r\n line-height: var(--ptc-line-height-densest);\r\n color: var(--color-white);\r\n border: 2px solid transparent;\r\n text-decoration: none;\r\n\r\n &.medium {\r\n padding: 0.75rem 1rem;\r\n\r\n span {\r\n font-size: var(--ptc-font-size-xx-small);\r\n font-weight: var(--ptc-font-weight-extrabold);\r\n }\r\n }\r\n\r\n &.small {\r\n padding: 0.5rem 0.75rem;\r\n\r\n span {\r\n font-size: var(--ptc-font-size-xx-small);\r\n font-weight: var(--ptc-font-weight-extrabold);\r\n }\r\n }\r\n\r\n &.disabled {\r\n pointer-events: none;\r\n color: var(--color-gray-03);\r\n border-color: var(--color-gray-03);\r\n background-color: var(--color-gray-02);\r\n\r\n icon-asset svg {\r\n fill: var(--color-gray-03);\r\n }\r\n\r\n &:focus-visible {\r\n background-color: var(--color-gray-02);\r\n }\r\n }\r\n\r\n &:focus-visible {\r\n @include focus-state;\r\n }\r\n\r\n &.full-width {\r\n width: 100%;\r\n }\r\n\r\n .cta-content-wrap {\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n text-align: center;\r\n icon-asset {\r\n margin-right: 8px;\r\n line-height: 0;\r\n & + span {\r\n text-align: left;\r\n }\r\n }\r\n }\r\n}\r\n\r\n// Primary CTA\r\n.primary-cta {\r\n @extend %cta-base;\r\n background-color: var(--color-green-07);\r\n border-color: var(--color-green-07);\r\n transition: all 0.2s ease;\r\n\r\n &:hover {\r\n background-color: var(--color-green-08);\r\n }\r\n\r\n &:active {\r\n background-color: var(--color-green-09);\r\n }\r\n\r\n &:focus-visible {\r\n background-color: var(--color-green-07);\r\n }\r\n}\r\n\r\n// Secondary CTA (dark theme)\r\n.secondary-cta-dark {\r\n @extend %cta-base;\r\n background-color: var(--color-gray-12);\r\n border-color: var(--color-gray-08);\r\n\r\n &:hover {\r\n background-color: var(--color-gray-10);\r\n }\r\n\r\n &:active {\r\n background-color: var(--color-black);\r\n }\r\n\r\n &:focus-visible {\r\n background-color: var(--color-gray-12);\r\n }\r\n}\r\n\r\n// Secondary CTA (light theme)\r\n.secondary-cta-light {\r\n @extend %cta-base;\r\n background-color: var(--color-white);\r\n border-color: var(--color-gray-10);\r\n color: var(--color-gray-10);\r\n\r\n &:hover {\r\n background-color: var(--color-gray-02);\r\n }\r\n\r\n &:active {\r\n background-color: var(--color-gray-03);\r\n }\r\n\r\n &:focus-visible {\r\n background-color: var(--color-white);\r\n }\r\n}\r\n","import {\r\n\tComponent,\r\n\tProp,\r\n\th,\r\n\tEvent,\r\n\tEventEmitter,\r\n\tHost,\r\n\tElement,\r\n} from \"@stencil/core\";\r\nimport { CssClassMap } from \"../../../utils/interfaces\";\r\nimport { getSeoTagType, CheckDarkFocusState } from \"../../../utils/utils\";\r\n\r\n@Component({\r\n\ttag: \"ptc-button\",\r\n\tstyleUrl: \"ptc-button.scss\",\r\n\tshadow: true,\r\n})\r\nexport class PtcButton {\r\n\t@Element() el: HTMLElement;\r\n\t/\r\n\t Disabled button\r\n\t /\r\n\t@Prop({ reflect: true }) disabled?: boolean = false;\r\n\t/\r\n\t Active Toggle button\r\n\t /\r\n\t@Prop({ reflect: true }) active?: boolean = false;\r\n\t/\r\n\t Button type\r\n\t /\r\n\t@Prop() type: \"button\" \| \"reset\" \| \"submit\" \| \"link\" = \"button\";\r\n\t/\r\n\t Button theme color\r\n\t /\r\n\t@Prop()\r\n\tcolor:\r\n\t\t\| \"offwhite\"\r\n\t\t\| \"blackgrey\"\r\n\t\t\| \"turtlegreen\"\r\n\t\t\| \"nav\"\r\n\t\t\| \"legacy-green\"\r\n\t\t\| \"ptc-primary\"\r\n\t\t\| \"ptc-secondary\"\r\n\t\t\| \"ptc-tertiary\"\r\n\t\t\| \"ptc-quaternary\"\r\n\t\t\| \"icon-toggle\"\r\n\t\t\| \"clear-search\"\r\n\t\t\| \"primary-cta\"\r\n\t\t\| \"secondary-cta-dark\"\r\n\t\t\| \"secondary-cta-light\" = \"ptc-primary\";\r\n\t/\r\n\t Icon Animation\r\n\t /\r\n\t@Prop() iconAnimation:\r\n\t\t\| \"animation-right\"\r\n\t\t\| \"animation-down\"\r\n\t\t\| \"reveal-down\"\r\n\t\t\| \"\" = \"\";\r\n\t/\r\n\t Icon Position\r\n\t /\r\n\t@Prop() iconPosition: \"icon-left\" \| \"icon-right\" \| \"none\" = \"icon-right\";\r\n\r\n\t/\r\n\t Link URL\r\n\t /\r\n\t@Prop() linkHref?: string = undefined;\r\n\r\n\t/\r\n\t link Title\r\n\t /\r\n\t@Prop() linkTitle?: string = undefined;\r\n\r\n\t/\r\n\t Link target\r\n\t * /\r\n\t@Prop() target?: string = \"_self\";\r\n\t/\r\n\t Link rel\r\n\t * /\r\n\t@Prop() rel?: string = undefined;\r\n\t/\r\n\t (optional) tab-nav.\r\n\t * indicates that its element can be focused, and where it participates in sequential keyboard navigation.\r\n\t * A negative value (usually tabindex=\"-1\") means that the element is not reachable via sequential keyboard navigation\r\n\t /\r\n\t@Prop() tabNav: number = 0;\r\n\t/\r\n\t (optional) Injected CSS Styles\r\n\t /\r\n\t@Prop() styles?: string;\r\n\r\n\t/\r\n\t Text Align\r\n\t /\r\n\t@Prop() textAlign?: \"left\" \| \"right\" \| \"center\";\r\n\r\n\t/\r\n\t Enable Accessibility Alternate Styling\r\n\t /\r\n\t@Prop() enableAccessibilityAltStyle: boolean = false;\r\n\r\n\t/\r\n\t Button theme color\r\n\t /\r\n\t@Prop()\r\n\tsize: \"small\" \| \"medium\" \| \"large\";\r\n\t/\r\n\t Emitted when the button has focus.\r\n\t /\r\n\t@Event() clickEvent: EventEmitter<void>;\r\n\tclickEventHandler() {\r\n\t\tthis.clickEvent.emit();\r\n\t}\r\n\t// Properties for accessibilty / aria\r\n\t@Prop() buttonTitle?: string;\r\n\t@Prop() ariaLabel: string = \"\";\r\n\t/\r\n\t (optional) enable support for seo tools that can only view source\r\n\t /\r\n\t@Prop() seoCompatibilityMode: boolean = false;\r\n\t/\r\n\t when support for seo tools is enabled will take inner element content and dublicate to slot for browser translation compatibility\r\n\t /\r\n\t@Prop() maintainContent: boolean = false;\r\n\t@Prop() trackerId?: string;\r\n\r\n\t/\r\n\t Add dark-focus-state property where button is present on dark backgrounds\r\n\t */\r\n\t@Prop() darkFocusState: boolean = false;\r\n\r\n\t@Prop() ctaWidth: \"full-width\" \| \"default\" = \"default\";\r\n\r\n\tcomponentWillLoad() {\r\n\t\tconsole.log(\"FeF v4 test\");\r\n\t\tCheckDarkFocusState(this, this.el);\r\n\t}\r\n\r\n\tseoCompRender() {\r\n\t\tconst classMap = this.getCssClassMap();\r\n\t\tconst Tag = !!this.linkHref ? \"a\" : \"button\";\r\n\t\tconst [TagType, firstChild] = getSeoTagType(this.el, Tag);\r\n\t\tconst html = firstChild && firstChild.innerHTML;\r\n\r\n\t\tif (this.el == firstChild) {\r\n\t\t\tthis.el.innerHTML = \"\";\r\n\t\t}\r\n\r\n\t\tif (this.maintainContent) {\r\n\t\t\tthis.el.innerHTML = html;\r\n\t\t}\r\n\r\n\t\treturn (\r\n\t\t\t<Host>\r\n\t\t\t\t{this.styles && <style>{this.styles}</style>}\r\n\t\t\t\t<div\r\n\t\t\t\t\tid={this.trackerId}\r\n\t\t\t\t\tclass=\"tracker-div mf-listen\"\r\n\t\t\t\t\t{...(this.ctaWidth === \"full-width\"\r\n\t\t\t\t\t\t? { style: { display: \"block\" } }\r\n\t\t\t\t\t\t: {})}\r\n\t\t\t\t>\r\n\t\t\t\t\t<TagType\r\n\t\t\t\t\t\tclass={classMap}\r\n\t\t\t\t\t\tonClick={this.clickEventHandler.bind(this)}\r\n\t\t\t\t\t\t{...(!!this.linkHref ? { href: this.linkHref } : {})}\r\n\t\t\t\t\t\t{...(!this.linkHref ? { type: this.type } : {})}\r\n\t\t\t\t\t\t{...(!!this.target && !!this.linkHref\r\n\t\t\t\t\t\t\t? { target: this.target }\r\n\t\t\t\t\t\t\t: {})}\r\n\t\t\t\t\t\t{...(!!this.rel && !!this.linkHref\r\n\t\t\t\t\t\t\t? { rel: this.rel }\r\n\t\t\t\t\t\t\t: {})}\r\n\t\t\t\t\t\t{...(!!this.linkHref\r\n\t\t\t\t\t\t\t? {\r\n\t\t\t\t\t\t\t\t\ttitle: this.linkTitle\r\n\t\t\t\t\t\t\t\t\t\t? this.linkTitle\r\n\t\t\t\t\t\t\t\t\t\t: this.linkHref,\r\n\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t: {})}\r\n\t\t\t\t\t\t{...(!!this.tabNav\r\n\t\t\t\t\t\t\t? { tabindex: -1 }\r\n\t\t\t\t\t\t\t: { tabindex: 0 })}\r\n\t\t\t\t\t\ttitle={this.buttonTitle}\r\n\t\t\t\t\t\t{...(this.ariaLabel !== \"\"\r\n\t\t\t\t\t\t\t? { ariaLabel: this.ariaLabel }\r\n\t\t\t\t\t\t\t: {})}\r\n\t\t\t\t\t>\r\n\t\t\t\t\t\t{\r\n\t\t\t\t\t\t\t<span innerHTML={html} class={\"cta-content-wrap\"}>\r\n\t\t\t\t\t\t\t\t<slot name=\"slot-before-text\"></slot>\r\n\t\t\t\t\t\t\t\t<slot name=\"slot-after-text\"></slot>\r\n\t\t\t\t\t\t\t</span>\r\n\t\t\t\t\t\t}\r\n\t\t\t\t\t</TagType>\r\n\t\t\t\t</div>\r\n\t\t\t</Host>\r\n\t\t);\r\n\t}\r\n\r\n\tstandardRender() {\r\n\t\tconst classMap = this.getCssClassMap();\r\n\t\tconst Tag = !!this.linkHref ? \"a\" : \"button\";\r\n\r\n\t\treturn (\r\n\t\t\t<Host>\r\n\t\t\t\t{this.styles && <style>{this.styles}</style>}\r\n\t\t\t\t<div id={this.trackerId} class=\"tracker-div mf-listen\">\r\n\t\t\t\t\t<Tag\r\n\t\t\t\t\t\tclass={classMap}\r\n\t\t\t\t\t\tonClick={this.clickEventHandler.bind(this)}\r\n\t\t\t\t\t\t{...(!!this.linkHref ? { href: this.linkHref } : {})}\r\n\t\t\t\t\t\t{...(!this.linkHref ? { type: this.type } : {})}\r\n\t\t\t\t\t\t{...(!!this.target && !!this.linkHref\r\n\t\t\t\t\t\t\t? { target: this.target }\r\n\t\t\t\t\t\t\t: {})}\r\n\t\t\t\t\t\t{...(!!this.rel && !!this.linkHref\r\n\t\t\t\t\t\t\t? { rel: this.rel }\r\n\t\t\t\t\t\t\t: {})}\r\n\t\t\t\t\t\t{...(!!this.linkHref\r\n\t\t\t\t\t\t\t? {\r\n\t\t\t\t\t\t\t\t\ttitle: this.linkTitle\r\n\t\t\t\t\t\t\t\t\t\t? this.linkTitle\r\n\t\t\t\t\t\t\t\t\t\t: this.linkHref,\r\n\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t: {})}\r\n\t\t\t\t\t\t{...(!!this.tabNav\r\n\t\t\t\t\t\t\t? { tabindex: -1 }\r\n\t\t\t\t\t\t\t: { tabindex: 0 })}\r\n\t\t\t\t\t\ttitle={this.buttonTitle}\r\n\t\t\t\t\t\t{...(this.ariaLabel !== \"\"\r\n\t\t\t\t\t\t\t? { ariaLabel: this.ariaLabel }\r\n\t\t\t\t\t\t\t: {})}\r\n\t\t\t\t\t>\r\n\t\t\t\t\t\t{this.iconAnimation == \"reveal-down\" ? (\r\n\t\t\t\t\t\t\t<span>\r\n\t\t\t\t\t\t\t\t<div class=\"content\">\r\n\t\t\t\t\t\t\t\t\t<slot></slot>\r\n\t\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t\t\t<div class=\"icon-wrapper\">\r\n\t\t\t\t\t\t\t\t\t<div class=\"icon\">\r\n\t\t\t\t\t\t\t\t\t\t<slot name=\"slot-after-text\"></slot>\r\n\t\t\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t\t</span>\r\n\t\t\t\t\t\t) : (\r\n\t\t\t\t\t\t\t<span>\r\n\t\t\t\t\t\t\t\t<slot name=\"slot-before-text\"></slot>\r\n\t\t\t\t\t\t\t\t<slot></slot>\r\n\t\t\t\t\t\t\t\t<slot name=\"slot-after-text\"></slot>\r\n\t\t\t\t\t\t\t</span>\r\n\t\t\t\t\t\t)}\r\n\t\t\t\t\t</Tag>\r\n\t\t\t\t</div>\r\n\t\t\t</Host>\r\n\t\t);\r\n\t}\r\n\r\n\trender() {\r\n\t\tif (this.seoCompatibilityMode) {\r\n\t\t\treturn this.seoCompRender();\r\n\t\t} else {\r\n\t\t\treturn this.standardRender();\r\n\t\t}\r\n\t}\r\n\r\n\tprivate getCssClassMap(): CssClassMap {\r\n\t\treturn {\r\n\t\t\t[this.color]: true,\r\n\t\t\t[this.iconAnimation]: true,\r\n\t\t\t[this.iconPosition]: true,\r\n\t\t\t[\"disabled\"]: this.disabled ? true : false,\r\n\t\t\t[\"active\"]: this.active ? true : false,\r\n\t\t\t[this.textAlign]: true,\r\n\t\t\t[this.size]: true,\r\n\t\t\t[\"acc-alt-style\"]: this.enableAccessibilityAltStyle,\r\n\t\t\t[\"focus-state-dark-background\"]: this.darkFocusState,\r\n\t\t\t[this.ctaWidth]: true,\r\n\t\t};\r\n\t}\r\n}\r\n"],"version":3}
1	+ {"file":"p-CDH04Z6-.js","mappings":";;;AAAA,MAAM,YAAY,GAAG,oxfAAoxf;;MCiB5xf,SAAS,iBAAAA,kBAAA,CAAA,MAAA,SAAA,SAAAC,CAAA,CAAA;;;;;;;;;;AAErB;;AAEG;IACsB,QAAQ,GAAa,KAAK;AACnD;;AAEG;IACsB,MAAM,GAAa,KAAK;AACjD;;AAEG;IACK,IAAI,GAA2C,QAAQ;AAC/D;;AAEG;IAEH,KAAK,GAcsB,aAAa;AACxC;;AAEG;IACK,aAAa,GAIb,EAAE;AACV;;AAEG;IACK,YAAY,GAAwC,YAAY;AAExE;;AAEG;IACK,QAAQ,GAAY,SAAS;AAErC;;AAEG;IACK,SAAS,GAAY,SAAS;AAEtC;;AAEK;IACG,MAAM,GAAY,OAAO;AACjC;;AAEK;IACG,GAAG,GAAY,SAAS;AAChC;;;;AAIG;IACK,MAAM,GAAW,CAAC;AAC1B;;AAEG;AACK,IAAA,MAAM;AAEd;;AAEG;AACK,IAAA,SAAS;AAEjB;;AAEG;IACK,2BAA2B,GAAY,KAAK;AAEpD;;AAEG;AAEH,IAAA,IAAI;AACJ;;AAEG;AACM,IAAA,UAAU;IACnB,iBAAiB,GAAA;AAChB,QAAA,IAAI,CAAC,UAAU,CAAC,IAAI,EAAE;;;AAGf,IAAA,WAAW;IACX,SAAS,GAAW,EAAE;AAC9B;;AAEG;IACK,oBAAoB,GAAY,KAAK;AAC7C;;AAEG;IACK,eAAe,GAAY,KAAK;AAChC,IAAA,SAAS;AAEjB;;AAEG;IACK,cAAc,GAAY,KAAK;IAE/B,QAAQ,GAA6B,SAAS;IAEtD,iBAAiB,GAAA;AAChB,QAAA,OAAO,CAAC,GAAG,CAAC,aAAa,CAAC;AAC1B,QAAA,mBAAmB,CAAC,IAAI,EAAE,IAAI,CAAC,EAAE,CAAC;;IAGnC,aAAa,GAAA;AACZ,QAAA,MAAM,QAAQ,GAAG,IAAI,CAAC,cAAc,EAAE;AACtC,QAAA,MAAM,GAAG,GAAG,CAAC,CAAC,IAAI,CAAC,QAAQ,GAAG,GAAG,GAAG,QAAQ;AAC5C,QAAA,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,aAAa,CAAC,IAAI,CAAC,EAAE,EAAE,GAAG,CAAC;AACzD,QAAA,MAAM,IAAI,GAAG,UAAU,IAAI,UAAU,CAAC,SAAS;AAE/C,QAAA,IAAI,IAAI,CAAC,EAAE,IAAI,UAAU,EAAE;AAC1B,YAAA,IAAI,CAAC,EAAE,CAAC,SAAS,GAAG,EAAE;;AAGvB,QAAA,IAAI,IAAI,CAAC,eAAe,EAAE;AACzB,YAAA,IAAI,CAAC,EAAE,CAAC,SAAS,GAAG,IAAI;;AAGzB,QAAA,QACC,EAAC,IAAI,EAAA,IAAA,EACH,IAAI,CAAC,MAAM,IAAI,iBAAQ,IAAI,CAAC,MAAM,CAAS,EAC5C,CAAA,CAAA,KAAA,EAAA,EACC,EAAE,EAAE,IAAI,CAAC,SAAS,EAClB,KAAK,EAAC,uBAAuB,MACxB,IAAI,CAAC,QAAQ,KAAK;kBACpB,EAAE,KAAK,EAAE,EAAE,OAAO,EAAE,OAAO,EAAE;AAC/B,kBAAE,EAAE,CAAC,EAAA,EAEN,CAAA,CAAC,OAAO,EAAA,EACP,KAAK,EAAE,QAAQ,EACf,OAAO,EAAE,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,IAAI,CAAC,EACtC,IAAC,CAAC,CAAC,IAAI,CAAC,QAAQ,GAAG,EAAE,IAAI,EAAE,IAAI,CAAC,QAAQ,EAAE,GAAG,EAAE,CAAC,EAAA,IAC/C,CAAC,IAAI,CAAC,QAAQ,GAAG,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,GAAG,EAAE,CAAC,EAAA,IAC1C,CAAC,CAAC,IAAI,CAAC,MAAM,IAAI,CAAC,CAAC,IAAI,CAAC;AAC5B,kBAAE,EAAE,MAAM,EAAE,IAAI,CAAC,MAAM;AACvB,kBAAE,EAAE,CAAC,EAAA,IACD,CAAC,CAAC,IAAI,CAAC,GAAG,IAAI,CAAC,CAAC,IAAI,CAAC;AACzB,kBAAE,EAAE,GAAG,EAAE,IAAI,CAAC,GAAG;kBACf,EAAE,CAAC,EAAA,IACD,CAAC,CAAC,IAAI,CAAC;AACX,kBAAE;oBACA,KAAK,EAAE,IAAI,CAAC;0BACT,IAAI,CAAC;0BACL,IAAI,CAAC,QAAQ;AAChB;kBACA,EAAE,CAAC,EAAA,IACD,CAAC,CAAC,IAAI,CAAC;AACX,kBAAE,EAAE,QAAQ,EAAE,EAAE;kBACd,EAAE,QAAQ,EAAE,CAAC,EAAE,CAAC,EACnB,KAAK,EAAE,IAAI,CAAC,WAAW,EACnB,IAAC,IAAI,CAAC,SAAS,KAAK;AACvB,kBAAE,EAAE,SAAS,EAAE,IAAI,CAAC,SAAS;kBAC3B,EAAE,CAAC,EAGL,EAAA,CAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAE,IAAI,EAAE,KAAK,EAAE,kBAAkB,EAAA,EAC/C,CAAM,CAAA,MAAA,EAAA,EAAA,IAAI,EAAC,kBAAkB,EAAQ,CAAA,EACrC,CAAM,CAAA,MAAA,EAAA,EAAA,IAAI,EAAC,iBAAiB,EAAA,CAAQ,CAC9B,CAEC,CACL,CACA;;IAIT,cAAc,GAAA;AACb,QAAA,MAAM,QAAQ,GAAG,IAAI,CAAC,cAAc,EAAE;AACtC,QAAA,MAAM,GAAG,GAAG,CAAC,CAAC,IAAI,CAAC,QAAQ,GAAG,GAAG,GAAG,QAAQ;QAE5C,QACC,EAAC,IAAI,EAAA,IAAA,EACH,IAAI,CAAC,MAAM,IAAI,iBAAQ,IAAI,CAAC,MAAM,CAAS,EAC5C,CAAK,CAAA,KAAA,EAAA,EAAA,EAAE,EAAE,IAAI,CAAC,SAAS,EAAE,KAAK,EAAC,uBAAuB,EAAA,EACrD,CAAA,CAAC,GAAG,EAAA,EACH,KAAK,EAAE,QAAQ,EACf,OAAO,EAAE,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,IAAI,CAAC,EACtC,IAAC,CAAC,CAAC,IAAI,CAAC,QAAQ,GAAG,EAAE,IAAI,EAAE,IAAI,CAAC,QAAQ,EAAE,GAAG,EAAE,CAAC,EAAA,IAC/C,CAAC,IAAI,CAAC,QAAQ,GAAG,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,GAAG,EAAE,CAAC,EAAA,IAC1C,CAAC,CAAC,IAAI,CAAC,MAAM,IAAI,CAAC,CAAC,IAAI,CAAC;AAC5B,kBAAE,EAAE,MAAM,EAAE,IAAI,CAAC,MAAM;AACvB,kBAAE,EAAE,CAAC,EAAA,IACD,CAAC,CAAC,IAAI,CAAC,GAAG,IAAI,CAAC,CAAC,IAAI,CAAC;AACzB,kBAAE,EAAE,GAAG,EAAE,IAAI,CAAC,GAAG;kBACf,EAAE,CAAC,EAAA,IACD,CAAC,CAAC,IAAI,CAAC;AACX,kBAAE;oBACA,KAAK,EAAE,IAAI,CAAC;0BACT,IAAI,CAAC;0BACL,IAAI,CAAC,QAAQ;AAChB;kBACA,EAAE,CAAC,EAAA,IACD,CAAC,CAAC,IAAI,CAAC;AACX,kBAAE,EAAE,QAAQ,EAAE,EAAE;kBACd,EAAE,QAAQ,EAAE,CAAC,EAAE,CAAC,EACnB,KAAK,EAAE,IAAI,CAAC,WAAW,EACnB,IAAC,IAAI,CAAC,SAAS,KAAK;AACvB,kBAAE,EAAE,SAAS,EAAE,IAAI,CAAC,SAAS;kBAC3B,EAAE,CAAC,EAAA,EAEL,IAAI,CAAC,aAAa,IAAI,aAAa,IACnC,CAAA,CAAA,MAAA,EAAA,IAAA,EACC,CAAK,CAAA,KAAA,EAAA,EAAA,KAAK,EAAC,SAAS,EAAA,EACnB,CAAA,CAAA,MAAA,EAAA,IAAA,CAAa,CACR,EACN,CAAK,CAAA,KAAA,EAAA,EAAA,KAAK,EAAC,cAAc,EAAA,EACxB,CAAK,CAAA,KAAA,EAAA,EAAA,KAAK,EAAC,MAAM,EAAA,EAChB,CAAM,CAAA,MAAA,EAAA,EAAA,IAAI,EAAC,iBAAiB,EAAQ,CAAA,CAC/B,CACD,CACA,KAEP,CAAA,CAAA,MAAA,EAAA,IAAA,EACC,CAAM,CAAA,MAAA,EAAA,EAAA,IAAI,EAAC,kBAAkB,EAAQ,CAAA,EACrC,CAAa,CAAA,MAAA,EAAA,IAAA,CAAA,EACb,CAAM,CAAA,MAAA,EAAA,EAAA,IAAI,EAAC,iBAAiB,EAAQ,CAAA,CAC9B,CACP,CACI,CACD,CACA;;IAIT,MAAM,GAAA;AACL,QAAA,IAAI,IAAI,CAAC,oBAAoB,EAAE;AAC9B,YAAA,OAAO,IAAI,CAAC,aAAa,EAAE;;aACrB;AACN,YAAA,OAAO,IAAI,CAAC,cAAc,EAAE;;;IAItB,cAAc,GAAA;QACrB,OAAO;AACN,YAAA,CAAC,IAAI,CAAC,KAAK,GAAG,IAAI;AAClB,YAAA,CAAC,IAAI,CAAC,aAAa,GAAG,IAAI;AAC1B,YAAA,CAAC,IAAI,CAAC,YAAY,GAAG,IAAI;AACzB,YAAA,CAAC,UAAU,GAAG,IAAI,CAAC,QAAQ,GAAG,IAAI,GAAG,KAAK;AAC1C,YAAA,CAAC,QAAQ,GAAG,IAAI,CAAC,MAAM,GAAG,IAAI,GAAG,KAAK;AACtC,YAAA,CAAC,IAAI,CAAC,SAAS,GAAG,IAAI;AACtB,YAAA,CAAC,IAAI,CAAC,IAAI,GAAG,IAAI;AACjB,YAAA,CAAC,eAAe,GAAG,IAAI,CAAC,2BAA2B;AACnD,YAAA,CAAC,6BAA6B,GAAG,IAAI,CAAC,cAAc;AACpD,YAAA,CAAC,IAAI,CAAC,QAAQ,GAAG,IAAI;SACrB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/atoms/ptc-button/ptc-button.scss?tag=ptc-button&encapsulation=shadow","src/components/atoms/ptc-button/ptc-button.tsx"],"sourcesContent":["@use 'mixins' as ;\r\n\r\nbutton.disabled {\r\n pointer-events: none;\r\n opacity: 0.6;\r\n}\r\n\r\nbutton {\r\n background-color: var(--color-gray-10);\r\n display: inline-block;\r\n border-style: solid;\r\n border-width: 1px;\r\n white-space: normal;\r\n position: relative;\r\n text-decoration: none;\r\n -moz-osx-font-smoothing: grayscale;\r\n /(For Firefox)/\r\n -webkit-font-smoothing: antialiased;\r\n /(For Chrome and Safari)/\r\n cursor: pointer;\r\n padding: 9.4px 17.5px;\r\n border-radius: var(--ptc-border-radius-standard);\r\n\r\n &.reveal-down {\r\n .content {\r\n transition: opacity var(--ptc-transition-medium) var(--ptc-ease-out);\r\n opacity: 0;\r\n font-size: var(--ptc-font-size-xx-small);\r\n }\r\n .icon-wrapper {\r\n position: relative;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n align-content: center;\r\n height: 16px;\r\n\r\n .icon {\r\n transition: top var(--ptc-transition-fast) var(--ptc-ease-out);\r\n position: absolute;\r\n display: inline-block;\r\n top: -12px;\r\n }\r\n }\r\n }\r\n\r\n &:hover {\r\n &.reveal-down {\r\n .content {\r\n opacity: 1;\r\n }\r\n\r\n .icon-wrapper {\r\n .icon {\r\n top: 4px;\r\n }\r\n }\r\n }\r\n }\r\n\r\n &.animation-right,\r\n &.animation-down {\r\n ::slotted([slot='slot-after-text']),\r\n ::slotted([slot='slot-before-text']) {\r\n transition: transform var(--ptc-transition-medium) var(--ptc-ease-inout);\r\n position: relative;\r\n display: inline-block;\r\n }\r\n }\r\n\r\n &:hover {\r\n &.animation-right {\r\n ::slotted([slot='slot-after-text']),\r\n ::slotted([slot='slot-before-text']) {\r\n transform: translateX(var(--ptc-element-spacing-02));\r\n }\r\n }\r\n\r\n &.animation-down {\r\n ::slotted([slot='slot-after-text']),\r\n ::slotted([slot='slot-before-text']) {\r\n transform: translateY(var(--ptc-element-spacing-02));\r\n }\r\n }\r\n }\r\n\r\n span {\r\n font-family: var(--ptc-font-latin);\r\n font-size: var(--ptc-font-size-small);\r\n font-weight: bold;\r\n line-height: var(--ptc-line-height-densest);\r\n }\r\n &.left {\r\n text-align: left;\r\n }\r\n &.right {\r\n text-align: right;\r\n }\r\n &.center {\r\n text-align: center;\r\n }\r\n}\r\n\r\n.icon-left {\r\n ::slotted([slot='slot-before-text']) {\r\n margin-right: var(--ptc-element-spacing-01);\r\n }\r\n}\r\n\r\n.icon-right {\r\n ::slotted([slot='slot-after-text']) {\r\n margin-left: var(--ptc-element-spacing-01);\r\n }\r\n}\r\n\r\n.blackgrey {\r\n &:hover {\r\n box-shadow: var(--ptc-shadow-x-large);\r\n }\r\n\r\n box-shadow: var(--ptc-shadow-x-small);\r\n border: solid 1px var(--color-gray-10);\r\n background-image: linear-gradient(285deg, var(--color-gray-10) 155%, var(--color-gray-07) 62%);\r\n\r\n span {\r\n color: var(--color-white);\r\n }\r\n}\r\n\r\n.turtlegreen {\r\n &:hover {\r\n box-shadow: var(--ptc-shadow-x-large);\r\n }\r\n\r\n box-shadow: var(--ptc-shadow-x-small);\r\n border: solid 1px var(--color-green-07);\r\n background-image: linear-gradient(285deg, var(--color-green-07) 155%, var(--color-green-07) 62%);\r\n\r\n span {\r\n color: var(--color-white);\r\n }\r\n}\r\n\r\n.offwhite {\r\n box-shadow: var(--ptc-shadow-x-small);\r\n border: solid 1px var(--color-gray-10);\r\n background-image: linear-gradient(to right, var(--color-white), var(--color-gray-02), var(--color-gray-01));\r\n\r\n &:hover {\r\n box-shadow: var(--ptc-shadow-x-large);\r\n }\r\n\r\n span {\r\n color: var(--color-gray-10);\r\n }\r\n}\r\n\r\n.legacy-green {\r\n margin-left: 10px;\r\n padding: 10px 20px;\r\n margin-bottom: var(--ptc-element-spacing-01);\r\n margin-top: var(--ptc-element-spacing-01);\r\n\r\n &:after {\r\n position: absolute;\r\n content: '';\r\n top: -1px;\r\n left: 0;\r\n bottom: 0;\r\n right: 0;\r\n width: 100%;\r\n height: 103%;\r\n background-image: linear-gradient(to right, var(--color-green-08), var(--color-green-06));\r\n opacity: 0;\r\n transition: opacity var(--ptc-transition-x-slow) var(--ptc-ease-inout);\r\n border-radius: 2px;\r\n }\r\n\r\n &:hover {\r\n box-shadow: var(--ptc-shadow-x-large);\r\n\r\n span {\r\n color: var(--color-white);\r\n }\r\n }\r\n\r\n &:hover:after {\r\n opacity: 1;\r\n }\r\n\r\n box-shadow: var(--ptc-shadow-large);\r\n border: solid 2.5px var(--color-green-08);\r\n background-image: linear-gradient(to right, var(--color-green-06), var(--color-green-08));\r\n\r\n span {\r\n font-family: var(--ptc-font-secondary-latin);\r\n color: var(--color-white);\r\n z-index: 100;\r\n position: relative;\r\n text-transform: uppercase;\r\n font-weight: var(--ptc-font-weight-bold);\r\n letter-spacing: var(--ptc-letter-spacing-normal);\r\n font-size: var(--ptc-font-size-x-small);\r\n\r\n @include screen-sm {\r\n font-size: var(--ptc-font-size-small);\r\n letter-spacing: var(--ptc-letter-spacing-loose);\r\n }\r\n }\r\n\r\n icon-asset {\r\n display: inline;\r\n }\r\n}\r\n\r\n//Link style adjustments\r\na {\r\n border-style: solid;\r\n border-width: 1px;\r\n position: relative;\r\n text-decoration: none;\r\n -moz-osx-font-smoothing: grayscale;\r\n /(For Firefox)/\r\n -webkit-font-smoothing: antialiased;\r\n /(For Chrome and Safari)/\r\n padding: 9.4px 17.5px;\r\n border-radius: var(--ptc-border-radius-standard);\r\n display: inline-block;\r\n position: relative;\r\n\r\n &.animation-right,\r\n &.animation-down {\r\n ::slotted([slot='slot-after-text']),\r\n ::slotted([slot='slot-before-text']) {\r\n transition: all var(--ptc-ease-inout) var(--ptc-transition-medium);\r\n position: relative;\r\n display: inline-block;\r\n margin-left: 5px;\r\n }\r\n }\r\n\r\n &:hover {\r\n &.animation-right {\r\n ::slotted([slot='slot-after-text']),\r\n ::slotted([slot='slot-before-text']) {\r\n transform: translateX(var(--ptc-element-spacing-02));\r\n }\r\n }\r\n\r\n &.animation-down {\r\n ::slotted([slot='slot-after-text']),\r\n ::slotted([slot='slot-before-text']) {\r\n transform: translateY(var(--ptc-element-spacing-02));\r\n }\r\n }\r\n }\r\n &.left {\r\n text-align: left;\r\n }\r\n &.right {\r\n text-align: right;\r\n }\r\n &.center {\r\n text-align: center;\r\n }\r\n}\r\n\r\n.nav {\r\n font-family: var(--ptc-font-latin);\r\n background-color: var(--color-gray-10);\r\n border-radius: var(--ptc-border-radius-standard);\r\n border: 1px solid var(--color-white);\r\n border-bottom-style: solid;\r\n border-bottom-width: 1px;\r\n box-sizing: border-box;\r\n color: var(--color-white);\r\n display: inline-block;\r\n font-size: var(--ptc-font-size-xx-small);\r\n font-stretch: 100%; //undefined value\r\n font-weight: var(--ptc-font-weight-bold);\r\n line-height: var(--ptc-line-height-loose);\r\n list-style: none;\r\n padding: 3px var(--ptc-element-spacing-04);\r\n position: relative;\r\n text-align: center;\r\n text-decoration: none;\r\n -moz-osx-font-smoothing: grayscale;\r\n /(For Firefox)/\r\n -webkit-font-smoothing: antialiased;\r\n /(For Chrome and Safari)/\r\n transition: background-color var(--ptc-transition-medium) var(--ptc-ease-inout);\r\n\r\n &:focus-visible {\r\n border-radius: 4px !important;\r\n border: 2px solid #fff !important;\r\n outline: 5px solid #003dd6 !important;\r\n background-color: transparent !important;\r\n outline-offset: 0px !important;\r\n }\r\n\r\n &:focus {\r\n text-decoration: none;\r\n border: solid 2px transparent;\r\n outline: none;\r\n }\r\n\r\n // &:focus {\r\n // outline: 3px solid var(--color-blue-07);\r\n // outline-offset: 2px;\r\n // }\r\n\r\n &:hover {\r\n background-color: var(--color-gray-12);\r\n }\r\n}\r\n\r\n.nav-store-btn {\r\n font-family: var(--ptc-font-latin);\r\n background-color: var(--color-green-07);\r\n border-radius: var(--ptc-border-radius-standard);\r\n border: 1px solid var(--color-green-07);\r\n border-bottom-style: solid;\r\n border-bottom-width: 1px;\r\n box-sizing: border-box;\r\n color: var(--color-white);\r\n display: inline-block;\r\n font-size: var(--ptc-font-size-xx-small);\r\n font-stretch: 100%; //undefined value\r\n font-weight: var(--ptc-font-weight-bold);\r\n line-height: var(--ptc-line-height-loose);\r\n list-style: none;\r\n padding: 3px var(--ptc-element-spacing-04);\r\n position: relative;\r\n text-align: center;\r\n text-decoration: none;\r\n -moz-osx-font-smoothing: grayscale;\r\n /(For Firefox)/\r\n -webkit-font-smoothing: antialiased;\r\n /(For Chrome and Safari)/\r\n transition: background-color var(--ptc-transition-medium) var(--ptc-ease-inout);\r\n\r\n &:focus-visible {\r\n border-radius: 4px !important;\r\n border: 2px solid #fff !important;\r\n outline: 5px solid #003dd6 !important;\r\n background-color: var(--color-green-07) !important;\r\n outline-offset: 0px !important;\r\n }\r\n\r\n &:focus {\r\n text-decoration: none;\r\n border: solid 2px transparent;\r\n outline: none;\r\n }\r\n\r\n // &:focus {\r\n // outline: 3px solid var(--color-blue-07);\r\n // outline-offset: 2px;\r\n // }\r\n\r\n &:hover {\r\n background-color: var(--color-green-08);\r\n }\r\n\r\n &:active {\r\n background-color: var(--color-green-09);\r\n transition: none;\r\n }\r\n}\r\n\r\n//ADA button updates\r\n.ptc-primary,\r\n.ptc-quaternary,\r\n.ptc-secondary,\r\n.ptc-tertiary,\r\n.icon-toggle {\r\n padding: var(--ptc-font-size-xx-small) var(--ptc-font-size-medium);\r\n transition: background-color var(--ptc-ease-inout) var(--ptc-transition-medium);\r\n line-height: 20px; //undefined size\r\n\r\n &.disabled {\r\n pointer-events: none;\r\n border-color: var(--color-gray-03);\r\n background: var(--color-gray-02);\r\n\r\n span {\r\n color: var(--color-gray-03);\r\n }\r\n\r\n ::slotted([slot='slot-after-text']) {\r\n fill: var(--color-gray-03) !important;\r\n }\r\n }\r\n\r\n // &:focus {\r\n // outline: 3px solid var(--color-blue-07);\r\n // outline-offset: 2px;\r\n // }\r\n\r\n &:focus-visible {\r\n @include base-focus-state;\r\n }\r\n\r\n span {\r\n font-family: var(--ptc-font-latin);\r\n font-weight: var(--ptc-font-weight-bold);\r\n font-size: var(--ptc-font-size-small);\r\n line-height: var(--ptc-line-height-densest);\r\n letter-spacing: normal;\r\n }\r\n &.small {\r\n padding: var(--ptc-element-spacing-03) var(--ptc-element-spacing-04);\r\n span {\r\n font-size: var(--ptc-font-size-xx-small);\r\n }\r\n }\r\n &.medium {\r\n padding: 14px 20px;\r\n span {\r\n font-size: var(--ptc-font-size-small);\r\n }\r\n }\r\n &.large {\r\n padding: var(--ptc-element-spacing-04) var(--ptc-element-spacing-06);\r\n span {\r\n font-size: var(--ptc-font-size-large);\r\n }\r\n }\r\n\r\n &.acc-alt-style {\r\n &:focus-visible {\r\n @include focus-state;\r\n }\r\n }\r\n}\r\n\r\n.ptc-primary {\r\n background: var(--color-gray-12); //--color-primary\r\n border: 2px solid var(--color-green-07); //--color-primary-green\r\n border-radius: var(--ptc-border-radius-standard);\r\n\r\n &:hover {\r\n background-color: var(--color-gray-10);\r\n }\r\n\r\n &:active {\r\n background-color: var(--color-black);\r\n transition: none;\r\n }\r\n\r\n span {\r\n color: var(--color-white);\r\n }\r\n\r\n ::slotted([slot='slot-after-text']) {\r\n fill: var(--color-white) !important;\r\n }\r\n}\r\n\r\n.ptc-secondary {\r\n background: var(--color-gray-12);\r\n border: 2px solid var(--color-gray-08);\r\n border-radius: var(--ptc-border-radius-standard);\r\n\r\n &:hover {\r\n background-color: var(--color-gray-10);\r\n }\r\n\r\n &:active {\r\n background-color: var(--color-black);\r\n transition: none;\r\n }\r\n\r\n span {\r\n color: var(--color-white);\r\n }\r\n\r\n ::slotted([slot='slot-after-text']) {\r\n fill: var(--color-white) !important;\r\n }\r\n}\r\n\r\n.ptc-tertiary {\r\n background: var(--color-white);\r\n border: 2px solid var(--color-gray-10);\r\n border-radius: var(--ptc-border-radius-standard);\r\n\r\n &:hover {\r\n background-color: var(--color-gray-02);\r\n }\r\n\r\n &:active {\r\n background-color: var(--color-gray-03);\r\n transition: none;\r\n }\r\n\r\n span {\r\n color: var(--color-gray-10);\r\n }\r\n\r\n ::slotted([slot='slot-after-text']) {\r\n fill: var(--color-gray-10) !important;\r\n }\r\n\r\n ::slotted(a) {\r\n color: var(--color-gray-10) !important;\r\n text-decoration-line: none !important;\r\n }\r\n}\r\n\r\n.ptc-quaternary {\r\n background: var(--color-green-07);\r\n border: 2px solid var(--color-green-07);\r\n border-radius: var(--ptc-border-radius-standard);\r\n cursor: pointer;\r\n\r\n &:hover {\r\n background-color: var(--color-green-08);\r\n }\r\n\r\n &:active {\r\n background-color: var(--color-green-09);\r\n transition: none;\r\n }\r\n\r\n span {\r\n color: var(--color-white);\r\n }\r\n\r\n ::slotted([slot='slot-after-text']) {\r\n fill: var(--color-white) !important;\r\n }\r\n}\r\n\r\n.icon-toggle {\r\n background: var(--color-white);\r\n border: 1px solid var(--color-gray-10);\r\n border-radius: var(--ptc-border-radius-standard);\r\n padding: 0;\r\n height: 2.125rem;\r\n width: 2.125rem;\r\n box-shadow: var(--ptc-shadow-medium);\r\n\r\n &:hover {\r\n background-color: var(--color-gray-02);\r\n }\r\n\r\n &:active {\r\n transition: none;\r\n background-color: var(--color-gray-03);\r\n }\r\n\r\n &.active {\r\n background-color: var(--color-gray-04);\r\n\r\n &:hover {\r\n background-color: var(--color-gray-05);\r\n }\r\n\r\n &:active {\r\n transition: none;\r\n background-color: var(--color-gray-03);\r\n }\r\n }\r\n\r\n &:focus {\r\n outline: 2px solid var(--color-blue-07);\r\n outline-offset: 1px;\r\n }\r\n\r\n span {\r\n color: var(--color-gray-10);\r\n padding: 0;\r\n }\r\n\r\n ::slotted([slot='slot-after-text']) {\r\n fill: var(--color-gray-10) !important;\r\n }\r\n\r\n ::slotted(icon-asset) {\r\n display: block;\r\n margin: auto;\r\n height: 18px;\r\n width: 18px;\r\n }\r\n}\r\n\r\n.clear-search {\r\n border: none;\r\n padding: 0px;\r\n line-height: var(----ptc-line-height-densest);\r\n background-color: transparent;\r\n\r\n &:hover {\r\n text-decoration: underline;\r\n text-decoration-color: var(--color-white);\r\n }\r\n\r\n span {\r\n color: var(--color-white);\r\n font-weight: var(--ptc-font-weight-semibold);\r\n font-size: var(--ptc-font-size-x-small);\r\n -moz-osx-font-smoothing: grayscale;\r\n -webkit-font-smoothing: antialiased;\r\n }\r\n}\r\n\r\n.tracker-div {\r\n @include div-tracker;\r\n display: inline-block;\r\n}\r\n\r\n.focus-state-dark-background {\r\n &:focus-visible {\r\n @include focus-state;\r\n }\r\n}\r\n\r\n// New CTA's\r\n// Common CTA base styles\r\n%cta-base {\r\n padding: 0.875rem 1.25rem;\r\n font-size: var(--ptc-font-size-small);\r\n font-style: normal;\r\n font-weight: var(--ptc-font-weight-bold);\r\n line-height: var(--ptc-line-height-densest);\r\n color: var(--color-white);\r\n border: 2px solid transparent;\r\n text-decoration: none;\r\n\r\n &.medium {\r\n padding: 0.75rem 1rem;\r\n\r\n span {\r\n font-size: var(--ptc-font-size-xx-small);\r\n font-weight: var(--ptc-font-weight-extrabold);\r\n }\r\n }\r\n\r\n &.small {\r\n padding: 0.5rem 0.75rem;\r\n\r\n span {\r\n font-size: var(--ptc-font-size-xx-small);\r\n font-weight: var(--ptc-font-weight-extrabold);\r\n }\r\n }\r\n\r\n &.disabled {\r\n pointer-events: none;\r\n color: var(--color-gray-03);\r\n border-color: var(--color-gray-03);\r\n background-color: var(--color-gray-02);\r\n\r\n icon-asset svg {\r\n fill: var(--color-gray-03);\r\n }\r\n\r\n &:focus-visible {\r\n background-color: var(--color-gray-02);\r\n }\r\n }\r\n\r\n &:focus-visible {\r\n @include focus-state;\r\n }\r\n\r\n &.full-width {\r\n width: 100%;\r\n }\r\n\r\n .cta-content-wrap {\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n text-align: center;\r\n icon-asset {\r\n margin-right: 8px;\r\n line-height: 0;\r\n & + span {\r\n text-align: left;\r\n }\r\n }\r\n }\r\n}\r\n\r\n// Primary CTA\r\n.primary-cta {\r\n @extend %cta-base;\r\n background-color: var(--color-green-07);\r\n border-color: var(--color-green-07);\r\n transition: all 0.2s ease;\r\n\r\n &:hover {\r\n background-color: var(--color-green-08);\r\n }\r\n\r\n &:active {\r\n background-color: var(--color-green-09);\r\n }\r\n\r\n &:focus-visible {\r\n background-color: var(--color-green-07);\r\n }\r\n}\r\n\r\n// Secondary CTA (dark theme)\r\n.secondary-cta-dark {\r\n @extend %cta-base;\r\n background-color: var(--color-gray-12);\r\n border-color: var(--color-gray-08);\r\n\r\n &:hover {\r\n background-color: var(--color-gray-10);\r\n }\r\n\r\n &:active {\r\n background-color: var(--color-black);\r\n }\r\n\r\n &:focus-visible {\r\n background-color: var(--color-gray-12);\r\n }\r\n}\r\n\r\n// Secondary CTA (light theme)\r\n.secondary-cta-light {\r\n @extend %cta-base;\r\n background-color: var(--color-white);\r\n border-color: var(--color-gray-10);\r\n color: var(--color-gray-10);\r\n\r\n &:hover {\r\n background-color: var(--color-gray-02);\r\n }\r\n\r\n &:active {\r\n background-color: var(--color-gray-03);\r\n }\r\n\r\n &:focus-visible {\r\n background-color: var(--color-white);\r\n }\r\n}\r\n","import {\r\n\tComponent,\r\n\tProp,\r\n\th,\r\n\tEvent,\r\n\tEventEmitter,\r\n\tHost,\r\n\tElement,\r\n} from \"@stencil/core\";\r\nimport { CssClassMap } from \"../../../utils/interfaces\";\r\nimport { getSeoTagType, CheckDarkFocusState } from \"../../../utils/utils\";\r\n\r\n@Component({\r\n\ttag: \"ptc-button\",\r\n\tstyleUrl: \"ptc-button.scss\",\r\n\tshadow: true,\r\n})\r\nexport class PtcButton {\r\n\t@Element() el: HTMLElement;\r\n\t/\r\n\t Disabled button\r\n\t /\r\n\t@Prop({ reflect: true }) disabled?: boolean = false;\r\n\t/\r\n\t Active Toggle button\r\n\t /\r\n\t@Prop({ reflect: true }) active?: boolean = false;\r\n\t/\r\n\t Button type\r\n\t /\r\n\t@Prop() type: \"button\" \| \"reset\" \| \"submit\" \| \"link\" = \"button\";\r\n\t/\r\n\t Button theme color\r\n\t /\r\n\t@Prop()\r\n\tcolor:\r\n\t\t\| \"offwhite\"\r\n\t\t\| \"blackgrey\"\r\n\t\t\| \"turtlegreen\"\r\n\t\t\| \"nav\"\r\n\t\t\| \"legacy-green\"\r\n\t\t\| \"ptc-primary\"\r\n\t\t\| \"ptc-secondary\"\r\n\t\t\| \"ptc-tertiary\"\r\n\t\t\| \"ptc-quaternary\"\r\n\t\t\| \"icon-toggle\"\r\n\t\t\| \"clear-search\"\r\n\t\t\| \"primary-cta\"\r\n\t\t\| \"secondary-cta-dark\"\r\n\t\t\| \"secondary-cta-light\" = \"ptc-primary\";\r\n\t/\r\n\t Icon Animation\r\n\t /\r\n\t@Prop() iconAnimation:\r\n\t\t\| \"animation-right\"\r\n\t\t\| \"animation-down\"\r\n\t\t\| \"reveal-down\"\r\n\t\t\| \"\" = \"\";\r\n\t/\r\n\t Icon Position\r\n\t /\r\n\t@Prop() iconPosition: \"icon-left\" \| \"icon-right\" \| \"none\" = \"icon-right\";\r\n\r\n\t/\r\n\t Link URL\r\n\t /\r\n\t@Prop() linkHref?: string = undefined;\r\n\r\n\t/\r\n\t link Title\r\n\t /\r\n\t@Prop() linkTitle?: string = undefined;\r\n\r\n\t/\r\n\t Link target\r\n\t * /\r\n\t@Prop() target?: string = \"_self\";\r\n\t/\r\n\t Link rel\r\n\t * /\r\n\t@Prop() rel?: string = undefined;\r\n\t/\r\n\t (optional) tab-nav.\r\n\t * indicates that its element can be focused, and where it participates in sequential keyboard navigation.\r\n\t * A negative value (usually tabindex=\"-1\") means that the element is not reachable via sequential keyboard navigation\r\n\t /\r\n\t@Prop() tabNav: number = 0;\r\n\t/\r\n\t (optional) Injected CSS Styles\r\n\t /\r\n\t@Prop() styles?: string;\r\n\r\n\t/\r\n\t Text Align\r\n\t /\r\n\t@Prop() textAlign?: \"left\" \| \"right\" \| \"center\";\r\n\r\n\t/\r\n\t Enable Accessibility Alternate Styling\r\n\t /\r\n\t@Prop() enableAccessibilityAltStyle: boolean = false;\r\n\r\n\t/\r\n\t Button theme color\r\n\t /\r\n\t@Prop()\r\n\tsize: \"small\" \| \"medium\" \| \"large\";\r\n\t/\r\n\t Emitted when the button has focus.\r\n\t /\r\n\t@Event() clickEvent: EventEmitter<void>;\r\n\tclickEventHandler() {\r\n\t\tthis.clickEvent.emit();\r\n\t}\r\n\t// Properties for accessibilty / aria\r\n\t@Prop() buttonTitle?: string;\r\n\t@Prop() ariaLabel: string = \"\";\r\n\t/\r\n\t (optional) enable support for seo tools that can only view source\r\n\t /\r\n\t@Prop() seoCompatibilityMode: boolean = false;\r\n\t/\r\n\t when support for seo tools is enabled will take inner element content and dublicate to slot for browser translation compatibility\r\n\t /\r\n\t@Prop() maintainContent: boolean = false;\r\n\t@Prop() trackerId?: string;\r\n\r\n\t/\r\n\t Add dark-focus-state property where button is present on dark backgrounds\r\n\t */\r\n\t@Prop() darkFocusState: boolean = false;\r\n\r\n\t@Prop() ctaWidth: \"full-width\" \| \"default\" = \"default\";\r\n\r\n\tcomponentWillLoad() {\r\n\t\tconsole.log(\"FeF v4 test\");\r\n\t\tCheckDarkFocusState(this, this.el);\r\n\t}\r\n\r\n\tseoCompRender() {\r\n\t\tconst classMap = this.getCssClassMap();\r\n\t\tconst Tag = !!this.linkHref ? \"a\" : \"button\";\r\n\t\tconst [TagType, firstChild] = getSeoTagType(this.el, Tag);\r\n\t\tconst html = firstChild && firstChild.innerHTML;\r\n\r\n\t\tif (this.el == firstChild) {\r\n\t\t\tthis.el.innerHTML = \"\";\r\n\t\t}\r\n\r\n\t\tif (this.maintainContent) {\r\n\t\t\tthis.el.innerHTML = html;\r\n\t\t}\r\n\r\n\t\treturn (\r\n\t\t\t<Host>\r\n\t\t\t\t{this.styles && <style>{this.styles}</style>}\r\n\t\t\t\t<div\r\n\t\t\t\t\tid={this.trackerId}\r\n\t\t\t\t\tclass=\"tracker-div mf-listen\"\r\n\t\t\t\t\t{...(this.ctaWidth === \"full-width\"\r\n\t\t\t\t\t\t? { style: { display: \"block\" } }\r\n\t\t\t\t\t\t: {})}\r\n\t\t\t\t>\r\n\t\t\t\t\t<TagType\r\n\t\t\t\t\t\tclass={classMap}\r\n\t\t\t\t\t\tonClick={this.clickEventHandler.bind(this)}\r\n\t\t\t\t\t\t{...(!!this.linkHref ? { href: this.linkHref } : {})}\r\n\t\t\t\t\t\t{...(!this.linkHref ? { type: this.type } : {})}\r\n\t\t\t\t\t\t{...(!!this.target && !!this.linkHref\r\n\t\t\t\t\t\t\t? { target: this.target }\r\n\t\t\t\t\t\t\t: {})}\r\n\t\t\t\t\t\t{...(!!this.rel && !!this.linkHref\r\n\t\t\t\t\t\t\t? { rel: this.rel }\r\n\t\t\t\t\t\t\t: {})}\r\n\t\t\t\t\t\t{...(!!this.linkHref\r\n\t\t\t\t\t\t\t? {\r\n\t\t\t\t\t\t\t\t\ttitle: this.linkTitle\r\n\t\t\t\t\t\t\t\t\t\t? this.linkTitle\r\n\t\t\t\t\t\t\t\t\t\t: this.linkHref,\r\n\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t: {})}\r\n\t\t\t\t\t\t{...(!!this.tabNav\r\n\t\t\t\t\t\t\t? { tabindex: -1 }\r\n\t\t\t\t\t\t\t: { tabindex: 0 })}\r\n\t\t\t\t\t\ttitle={this.buttonTitle}\r\n\t\t\t\t\t\t{...(this.ariaLabel !== \"\"\r\n\t\t\t\t\t\t\t? { ariaLabel: this.ariaLabel }\r\n\t\t\t\t\t\t\t: {})}\r\n\t\t\t\t\t>\r\n\t\t\t\t\t\t{\r\n\t\t\t\t\t\t\t<span innerHTML={html} class={\"cta-content-wrap\"}>\r\n\t\t\t\t\t\t\t\t<slot name=\"slot-before-text\"></slot>\r\n\t\t\t\t\t\t\t\t<slot name=\"slot-after-text\"></slot>\r\n\t\t\t\t\t\t\t</span>\r\n\t\t\t\t\t\t}\r\n\t\t\t\t\t</TagType>\r\n\t\t\t\t</div>\r\n\t\t\t</Host>\r\n\t\t);\r\n\t}\r\n\r\n\tstandardRender() {\r\n\t\tconst classMap = this.getCssClassMap();\r\n\t\tconst Tag = !!this.linkHref ? \"a\" : \"button\";\r\n\r\n\t\treturn (\r\n\t\t\t<Host>\r\n\t\t\t\t{this.styles && <style>{this.styles}</style>}\r\n\t\t\t\t<div id={this.trackerId} class=\"tracker-div mf-listen\">\r\n\t\t\t\t\t<Tag\r\n\t\t\t\t\t\tclass={classMap}\r\n\t\t\t\t\t\tonClick={this.clickEventHandler.bind(this)}\r\n\t\t\t\t\t\t{...(!!this.linkHref ? { href: this.linkHref } : {})}\r\n\t\t\t\t\t\t{...(!this.linkHref ? { type: this.type } : {})}\r\n\t\t\t\t\t\t{...(!!this.target && !!this.linkHref\r\n\t\t\t\t\t\t\t? { target: this.target }\r\n\t\t\t\t\t\t\t: {})}\r\n\t\t\t\t\t\t{...(!!this.rel && !!this.linkHref\r\n\t\t\t\t\t\t\t? { rel: this.rel }\r\n\t\t\t\t\t\t\t: {})}\r\n\t\t\t\t\t\t{...(!!this.linkHref\r\n\t\t\t\t\t\t\t? {\r\n\t\t\t\t\t\t\t\t\ttitle: this.linkTitle\r\n\t\t\t\t\t\t\t\t\t\t? this.linkTitle\r\n\t\t\t\t\t\t\t\t\t\t: this.linkHref,\r\n\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t: {})}\r\n\t\t\t\t\t\t{...(!!this.tabNav\r\n\t\t\t\t\t\t\t? { tabindex: -1 }\r\n\t\t\t\t\t\t\t: { tabindex: 0 })}\r\n\t\t\t\t\t\ttitle={this.buttonTitle}\r\n\t\t\t\t\t\t{...(this.ariaLabel !== \"\"\r\n\t\t\t\t\t\t\t? { ariaLabel: this.ariaLabel }\r\n\t\t\t\t\t\t\t: {})}\r\n\t\t\t\t\t>\r\n\t\t\t\t\t\t{this.iconAnimation == \"reveal-down\" ? (\r\n\t\t\t\t\t\t\t<span>\r\n\t\t\t\t\t\t\t\t<div class=\"content\">\r\n\t\t\t\t\t\t\t\t\t<slot></slot>\r\n\t\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t\t\t<div class=\"icon-wrapper\">\r\n\t\t\t\t\t\t\t\t\t<div class=\"icon\">\r\n\t\t\t\t\t\t\t\t\t\t<slot name=\"slot-after-text\"></slot>\r\n\t\t\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t\t</span>\r\n\t\t\t\t\t\t) : (\r\n\t\t\t\t\t\t\t<span>\r\n\t\t\t\t\t\t\t\t<slot name=\"slot-before-text\"></slot>\r\n\t\t\t\t\t\t\t\t<slot></slot>\r\n\t\t\t\t\t\t\t\t<slot name=\"slot-after-text\"></slot>\r\n\t\t\t\t\t\t\t</span>\r\n\t\t\t\t\t\t)}\r\n\t\t\t\t\t</Tag>\r\n\t\t\t\t</div>\r\n\t\t\t</Host>\r\n\t\t);\r\n\t}\r\n\r\n\trender() {\r\n\t\tif (this.seoCompatibilityMode) {\r\n\t\t\treturn this.seoCompRender();\r\n\t\t} else {\r\n\t\t\treturn this.standardRender();\r\n\t\t}\r\n\t}\r\n\r\n\tprivate getCssClassMap(): CssClassMap {\r\n\t\treturn {\r\n\t\t\t[this.color]: true,\r\n\t\t\t[this.iconAnimation]: true,\r\n\t\t\t[this.iconPosition]: true,\r\n\t\t\t[\"disabled\"]: this.disabled ? true : false,\r\n\t\t\t[\"active\"]: this.active ? true : false,\r\n\t\t\t[this.textAlign]: true,\r\n\t\t\t[this.size]: true,\r\n\t\t\t[\"acc-alt-style\"]: this.enableAccessibilityAltStyle,\r\n\t\t\t[\"focus-state-dark-background\"]: this.darkFocusState,\r\n\t\t\t[this.ctaWidth]: true,\r\n\t\t};\r\n\t}\r\n}\r\n"],"version":3}

package/dist/components/{p-BdLXv0uV.js → p-CDIX3Q8v.js} RENAMED Viewed

@@ -1,4 +1,4 @@
-import { p as proxyCustomElement, H, h, d as Host } from './p-BYSv8uGQ.js';
+import { p as proxyCustomElement, H, h, d as Host } from './p-BvGlmU4v.js';
 const flTabImageCss = ":host{display:none;height:240px}@media only screen and (min-width: 480px){:host{height:320px}}@media only screen and (min-width: 768px){:host{height:450px}}@media only screen and (min-width: 992px){:host{height:500px}}:host(.selected){display:block}";
@@ -39,6 +39,6 @@ function defineCustomElement() {
 defineCustomElement();
 export { FlTabImage as F, defineCustomElement as d };
-//# sourceMappingURL=p-BdLXv0uV.js.map
+//# sourceMappingURL=p-CDIX3Q8v.js.map
-//# sourceMappingURL=p-BdLXv0uV.js.map
+//# sourceMappingURL=p-CDIX3Q8v.js.map

package/dist/components/{p-BdLXv0uV.js.map → p-CDIX3Q8v.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"file":"p-~~BdLXv0uV~~.js","mappings":";;AAAA,MAAM,aAAa,GAAG,2PAA2P;;MCOpQ,UAAU,iBAAAA,kBAAA,CAAA,MAAA,UAAA,SAAAC,CAAA,CAAA;;;;;;;;AACtB;;AAEG;AACK,IAAA,OAAO;IAEP,QAAQ,GAAY,KAAK;IACjC,MAAM,GAAA;AACL,QAAA,QACC,CAAC,CAAA,IAAI,qDAAC,KAAK,EAAE,CAAA,aAAA,EAAgB,IAAI,CAAC,QAAQ,GAAG,UAAU,GAAG,EAAE,EAAE,EAAA,EAC7D,CAAa,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,CACP;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/molecules/ptc-featured-list/fl-tab-image/fl-tab-image.scss?tag=fl-tab-image&encapsulation=shadow","src/components/molecules/ptc-featured-list/fl-tab-image/fl-tab-image.tsx"],"sourcesContent":["@use \"mixins\" as ;\r\n\r\n:host {\r\n\tdisplay: none;\r\n\theight: 240px;\r\n\t@include screen-xs {\r\n\t\theight: 320px;\r\n\t}\r\n\t@include screen-sm {\r\n\t\theight: 450px;\r\n\t}\r\n\t@include screen-md {\r\n\t\theight: 500px;\r\n\t}\r\n}\r\n// :host(.init-active){\r\n// display: block;\r\n// }\r\n:host(.selected) {\r\n\tdisplay: block;\r\n}\r\n","import { Component, Host, h, Prop } from \"@stencil/core\";\r\n\r\n@Component({\r\n\ttag: \"fl-tab-image\",\r\n\tstyleUrl: \"fl-tab-image.scss\",\r\n\tshadow: true,\r\n})\r\nexport class FlTabImage {\r\n\t/\r\n\t * Tab featured image name, for identification\r\n\t */\r\n\t@Prop() nameKey: string;\r\n\r\n\t@Prop() selected: boolean = false;\r\n\trender() {\r\n\t\treturn (\r\n\t\t\t<Host class={`featured-img ${this.selected ? \"selected\" : \"\"}`}>\r\n\t\t\t\t<slot></slot>\r\n\t\t\t</Host>\r\n\t\t);\r\n\t}\r\n}\r\n"],"version":3}
1	+ {"file":"p-CDIX3Q8v.js","mappings":";;AAAA,MAAM,aAAa,GAAG,2PAA2P;;MCOpQ,UAAU,iBAAAA,kBAAA,CAAA,MAAA,UAAA,SAAAC,CAAA,CAAA;;;;;;;;AACtB;;AAEG;AACK,IAAA,OAAO;IAEP,QAAQ,GAAY,KAAK;IACjC,MAAM,GAAA;AACL,QAAA,QACC,CAAC,CAAA,IAAI,qDAAC,KAAK,EAAE,CAAA,aAAA,EAAgB,IAAI,CAAC,QAAQ,GAAG,UAAU,GAAG,EAAE,EAAE,EAAA,EAC7D,CAAa,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,CACP;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/molecules/ptc-featured-list/fl-tab-image/fl-tab-image.scss?tag=fl-tab-image&encapsulation=shadow","src/components/molecules/ptc-featured-list/fl-tab-image/fl-tab-image.tsx"],"sourcesContent":["@use \"mixins\" as ;\r\n\r\n:host {\r\n\tdisplay: none;\r\n\theight: 240px;\r\n\t@include screen-xs {\r\n\t\theight: 320px;\r\n\t}\r\n\t@include screen-sm {\r\n\t\theight: 450px;\r\n\t}\r\n\t@include screen-md {\r\n\t\theight: 500px;\r\n\t}\r\n}\r\n// :host(.init-active){\r\n// display: block;\r\n// }\r\n:host(.selected) {\r\n\tdisplay: block;\r\n}\r\n","import { Component, Host, h, Prop } from \"@stencil/core\";\r\n\r\n@Component({\r\n\ttag: \"fl-tab-image\",\r\n\tstyleUrl: \"fl-tab-image.scss\",\r\n\tshadow: true,\r\n})\r\nexport class FlTabImage {\r\n\t/\r\n\t * Tab featured image name, for identification\r\n\t */\r\n\t@Prop() nameKey: string;\r\n\r\n\t@Prop() selected: boolean = false;\r\n\trender() {\r\n\t\treturn (\r\n\t\t\t<Host class={`featured-img ${this.selected ? \"selected\" : \"\"}`}>\r\n\t\t\t\t<slot></slot>\r\n\t\t\t</Host>\r\n\t\t);\r\n\t}\r\n}\r\n"],"version":3}