@genexus/genexus-ide-ui 0.0.102 → 0.0.103
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/genexus-ide-ui.cjs.js +1 -1
- package/dist/cjs/{gx-ide-container_3.cjs.entry.js → gx-ide-container_2.cjs.entry.js} +3 -42
- package/dist/cjs/gx-ide-container_2.cjs.entry.js.map +1 -0
- package/dist/cjs/gx-ide-dashboard-home.cjs.entry.js +53 -8
- package/dist/cjs/gx-ide-dashboard-home.cjs.entry.js.map +1 -1
- package/dist/cjs/gx-ide-empty-state_2.cjs.entry.js +107 -97
- package/dist/cjs/gx-ide-empty-state_2.cjs.entry.js.map +1 -1
- package/dist/cjs/gx-ide-recent-news.cjs.entry.js +113 -0
- package/dist/cjs/gx-ide-recent-news.cjs.entry.js.map +1 -0
- package/dist/cjs/gxg-title-editable.cjs.entry.js +128 -0
- package/dist/cjs/gxg-title-editable.cjs.entry.js.map +1 -0
- package/dist/cjs/gxg-title.cjs.entry.js +47 -0
- package/dist/cjs/gxg-title.cjs.entry.js.map +1 -0
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/collection/components/_helpers/empty-state/gx-ide-empty-state.js +4 -4
- package/dist/collection/components/_helpers/empty-state/gx-ide-empty-state.js.map +1 -1
- package/dist/collection/components/dashboard-home/dashboard-home.css +23 -11
- package/dist/collection/components/dashboard-home/dashboard-home.js +75 -9
- package/dist/collection/components/dashboard-home/dashboard-home.js.map +1 -1
- package/dist/collection/components/dashboard-home/gx-ide-assets/dashboard-home/langs/dashboard-home.lang.en.json +16 -1
- package/dist/components/gx-ide-dashboard-home.js +104 -20
- package/dist/components/gx-ide-dashboard-home.js.map +1 -1
- package/dist/components/gx-ide-empty-state2.js +4 -4
- package/dist/components/gx-ide-empty-state2.js.map +1 -1
- package/dist/esm/genexus-ide-ui.js +1 -1
- package/dist/esm/{gx-ide-container_3.entry.js → gx-ide-container_2.entry.js} +4 -42
- package/dist/esm/gx-ide-container_2.entry.js.map +1 -0
- package/dist/esm/gx-ide-dashboard-home.entry.js +53 -8
- package/dist/esm/gx-ide-dashboard-home.entry.js.map +1 -1
- package/dist/esm/gx-ide-empty-state_2.entry.js +107 -97
- package/dist/esm/gx-ide-empty-state_2.entry.js.map +1 -1
- package/dist/esm/gx-ide-recent-news.entry.js +109 -0
- package/dist/esm/gx-ide-recent-news.entry.js.map +1 -0
- package/dist/esm/gxg-title-editable.entry.js +124 -0
- package/dist/esm/gxg-title-editable.entry.js.map +1 -0
- package/dist/esm/gxg-title.entry.js +43 -0
- package/dist/esm/gxg-title.entry.js.map +1 -0
- package/dist/esm/loader.js +1 -1
- package/dist/genexus-ide-ui/genexus-ide-ui.esm.js +1 -1
- package/dist/genexus-ide-ui/genexus-ide-ui.esm.js.map +1 -1
- package/dist/genexus-ide-ui/gx-ide-assets/dashboard-home/langs/dashboard-home.lang.en.json +16 -1
- package/dist/genexus-ide-ui/{p-1346991a.entry.js → p-01f66e53.entry.js} +93 -39
- package/dist/genexus-ide-ui/p-01f66e53.entry.js.map +1 -0
- package/dist/genexus-ide-ui/p-3457226c.entry.js +146 -0
- package/dist/genexus-ide-ui/p-3457226c.entry.js.map +1 -0
- package/dist/genexus-ide-ui/{p-bff2603a.entry.js → p-5270ef52.entry.js} +120 -172
- package/dist/genexus-ide-ui/p-5270ef52.entry.js.map +1 -0
- package/dist/genexus-ide-ui/{p-40f21d2d.entry.js → p-95cd2572.entry.js} +9 -76
- package/dist/genexus-ide-ui/p-95cd2572.entry.js.map +1 -0
- package/dist/genexus-ide-ui/p-ce89cbcb.entry.js +71 -0
- package/dist/genexus-ide-ui/p-ce89cbcb.entry.js.map +1 -0
- package/dist/genexus-ide-ui/{p-2e6da0ef.entry.js → p-e9456041.entry.js} +6 -96
- package/dist/genexus-ide-ui/p-e9456041.entry.js.map +1 -0
- package/dist/types/components/dashboard-home/dashboard-home.d.ts +12 -2
- package/dist/types/components.d.ts +10 -2
- package/package.json +1 -1
- package/dist/cjs/gx-ide-container_3.cjs.entry.js.map +0 -1
- package/dist/cjs/gxg-card_2.cjs.entry.js +0 -243
- package/dist/cjs/gxg-card_2.cjs.entry.js.map +0 -1
- package/dist/esm/gx-ide-container_3.entry.js.map +0 -1
- package/dist/esm/gxg-card_2.entry.js +0 -238
- package/dist/esm/gxg-card_2.entry.js.map +0 -1
- package/dist/genexus-ide-ui/p-1346991a.entry.js.map +0 -1
- package/dist/genexus-ide-ui/p-2e6da0ef.entry.js.map +0 -1
- package/dist/genexus-ide-ui/p-40f21d2d.entry.js.map +0 -1
- package/dist/genexus-ide-ui/p-bff2603a.entry.js.map +0 -1
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
5
|
const index = require('./index-faa86ee7.js');
|
|
6
|
-
const
|
|
6
|
+
const store = require('./store-118af971.js');
|
|
7
7
|
|
|
8
8
|
const gxIdeEmptyStateCss = ":host{display:flex;align-items:center;justify-content:center}.container{max-width:520px;margin:0 auto;gap:var(--mer-spacing--xl);opacity:0;transition:opacity var(--state-transition-speed);padding:var(--mer-spacing--md)}.container .icon-wrapper{border:var(--mer-border__width--sm) dashed var(--mer-accent__primary);border-radius:50%;min-width:40px;min-height:40px;display:flex;align-items:center;justify-content:center}.container__main{gap:var(--mer-spacing--sm)}.container__buttons{gap:var(--mer-spacing--xs)}.container--visible{opacity:1}.container,.container__main,.container__buttons{display:flex;align-items:center;flex-direction:column}";
|
|
9
9
|
|
|
@@ -34,13 +34,13 @@ const GxIdeEmptyState = class {
|
|
|
34
34
|
}
|
|
35
35
|
watchDisplayHandler(display) {
|
|
36
36
|
if (display) {
|
|
37
|
-
this.primaryButtonEl.disabled = false;
|
|
38
|
-
this.secondaryButtonEl.disabled = false;
|
|
37
|
+
this.primaryButtonLabel && (this.primaryButtonEl.disabled = false);
|
|
38
|
+
this.secondaryButtonLabel && (this.secondaryButtonEl.disabled = false);
|
|
39
39
|
}
|
|
40
40
|
else {
|
|
41
41
|
setTimeout(() => {
|
|
42
|
-
this.primaryButtonEl.disabled = true;
|
|
43
|
-
this.secondaryButtonEl.disabled = true;
|
|
42
|
+
this.primaryButtonLabel && (this.primaryButtonEl.disabled = true);
|
|
43
|
+
this.secondaryButtonLabel && (this.secondaryButtonEl.disabled = true);
|
|
44
44
|
}, this.transitionSpeed);
|
|
45
45
|
}
|
|
46
46
|
}
|
|
@@ -66,110 +66,120 @@ const GxIdeEmptyState = class {
|
|
|
66
66
|
};
|
|
67
67
|
GxIdeEmptyState.style = gxIdeEmptyStateCss;
|
|
68
68
|
|
|
69
|
-
const recentNewsCss = ":root{--ui-animaton-speed:0.2s}.gxg-title-01{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-01-font-weight);font-size:var(--ds-title-01-font-size);letter-spacing:var(--ds-base-font-letter-spacing--comfortable);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable)}.gxg-title-01--negative{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-01-font-weight);font-size:var(--ds-title-01-font-size);letter-spacing:var(--ds-base-font-letter-spacing--comfortable);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--negative)}.gxg-title-02{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-02-font-weight);font-size:var(--ds-title-02-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;text-transform:uppercase;line-height:var(--ds-base-font-line-height--comfortable)}.gxg-title-02--negative{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-02-font-weight);font-size:var(--ds-title-02-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;text-transform:uppercase;line-height:var(--ds-base-font-line-height--comfortable);color:var(--color-on-primary)}.gxg-title-03{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-03-font-weight);font-size:var(--ds-title-03-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;text-transform:uppercase;line-height:var(--ds-base-font-line-height--comfortable)}.gxg-title-03--negative{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-03-font-weight);font-size:var(--ds-title-03-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;text-transform:uppercase;line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--negative)}.gxg-title-04{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-04-font-weight);font-size:var(--ds-title-04-font-size);letter-spacing:var(--ds-base-font-letter-spacing--comfortable);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable)}.gxg-title-04--negative{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-04-font-weight);font-size:var(--ds-title-04-font-size);letter-spacing:var(--ds-base-font-letter-spacing--comfortable);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--negative)}.gxg-title-05{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-05-font-weight);font-size:var(--ds-title-05-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable)}.gxg-title-05--negative{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-05-font-weight);font-size:var(--ds-title-05-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--negative)}.gxg-text{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable)}.gxg-text--negative{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--negative)}.gxg-text--gray{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--dimmed)}.gxg-quote{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);font-style:italic}.gxg-quote--negative{color:var(--ds-base-font-color--negative)}.gxg-link{line-height:unset;font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--link);text-decoration:underline;cursor:pointer;display:inline-block}.gxg-link:hover{color:var(--ds-base-font-color--link-hover)}.gxg-link:active{color:var(--ds-base-font-color--link-active)}.gxg-link-gray{line-height:unset;font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--link);text-decoration:underline;cursor:pointer;display:inline-block;color:var(--ds-base-font-color--dimmed)}.gxg-link-gray:hover{line-height:unset;font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--link);text-decoration:underline;cursor:pointer;display:inline-block;color:var(--ds-base-font-color--dimmed);filter:brightness(1.4)}.gxg-alert-error{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--error);display:inline-block}.gxg-alert-warning{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--warning);display:inline-block}.gxg-alert-success{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--success);display:inline-block}.gxg-tab--disabled{color:var(--color-primary-disabled);pointer-events:none}.gxg-tab--disabled[disabled]{color:var(--color-primary-disabled);pointer-events:none}.gxg-label{font-family:var(--ds-base-font-family-primary);font-weight:var(--gxg-label-font-weight);font-size:var(--gxg-label-font-size);color:var(--gxg-label-color);text-align:center;line-height:1.455em;display:flex;align-items:center}.gxg-label:hover{color:var(--color-primary-hover)}.gxg-label:focus{color:var(--color-primary-active)}.gxg-label:active{color:var(--color-primary-active)}.gxg-label[disabled]{color:var(--color-primary-disabled)}.gxg-label--negative{color:var(--color-on-primary)}.gxg-label--negative[disabled]{color:var(--color-on-disabled)}.gxg-scrollbar{}.gxg-scrollbar::-webkit-scrollbar{width:var(--gxg-scrollbar-width);height:var(--gxg-scrollbar-width)}.gxg-scrollbar::-webkit-scrollbar-track{background-color:var(--gxg-scrollbar-track-background);border-radius:var(--gxg-scrollbar-track-border-radius)}.gxg-scrollbar::-webkit-scrollbar-thumb{background-color:var(--gxg-scrollbar-track-thumb-background);border-radius:var(--gxg-scrollbar-track-thumb-radius)}.gxg-scrollbar::-webkit-scrollbar-thumb:hover{background-color:var(--gxg-scrollbar-track-thumb-hover-background)}.gxg-scrollbar::-webkit-scrollbar-corner{background:rgba(0, 0, 0, 0)}.gxi-hidden{display:none !important}.gxi-full-height{height:100%}.gxi-overflow-auto{overflow:auto}.gxi-display-flex{display:flex}.align-start{display:flex;align-items:start}.align-center{display:flex;align-items:center}.align-end{display:flex;align-items:end}.overflow-auto{overflow:auto}.justify-start{display:flex;justify-content:start}.justify-center{display:flex;justify-content:center}.justify-end{display:flex;justify-content:end}.grid{display:grid;grid-row-gap:var(--gx-ide-grid-row-gap);grid-column-gap:var(--gx-ide-grid-column-gap);grid-template-rows:auto}ch-grid-cell{display:flex}ch-grid{overflow:auto;height:100%}ch-grid-column{z-index:99;border-bottom:1px solid var(--mer-color__neutral-gray--800)}ch-grid-column:first-child{padding-inline-start:var(--gx-ide-container__padding) !important}ch-grid-column:last-child{padding-inline-end:var(--gx-ide-container__padding) !important}ch-grid-cell{--mer-spacing--xs:var(--gx-ide-container__padding)}.layout{display:grid;gap:var(--mer-spacing--lg);box-sizing:border-box}.layout--two-cols{grid-template-columns:1fr 1fr}.layout--space-above{padding-block-start:var(--mer-spacing--lg)}gxg-tabs{box-shadow:none}:host(.gx-ide-component){height:100% !important;display:flex !important;flex-direction:column !important}:host(:focus-within) gx-ide-top-bar::part(wrapper){background-color:var(--color-secondary-enabled)}.gx-ide-main-wrapper{color:var(--gx-ide-component-text-color);font-weight:var(--mer-font__weight--regular);font-size:var(--mer-font__size--xs);font-family:var(--mer-font-family--primary);height:100%;background-color:var(--gx-ide-component-background-color);display:flex;flex-direction:column;flex-grow:1;box-sizing:border-box}.gx-ide-main{flex-grow:1;overflow-y:auto;}.gx-ide-main::-webkit-scrollbar{width:var(--gxg-scrollbar-width);height:var(--gxg-scrollbar-width)}.gx-ide-main::-webkit-scrollbar-track{background-color:var(--gxg-scrollbar-track-background);border-radius:var(--gxg-scrollbar-track-border-radius)}.gx-ide-main::-webkit-scrollbar-thumb{background-color:var(--gxg-scrollbar-track-thumb-background);border-radius:var(--gxg-scrollbar-track-thumb-radius)}.gx-ide-main::-webkit-scrollbar-thumb:hover{background-color:var(--gxg-scrollbar-track-thumb-hover-background)}.gx-ide-main::-webkit-scrollbar-corner{background:rgba(0, 0, 0, 0)}.gx-ide-overflow{overflow-y:auto;}.gx-ide-overflow::-webkit-scrollbar{width:var(--gxg-scrollbar-width);height:var(--gxg-scrollbar-width)}.gx-ide-overflow::-webkit-scrollbar-track{background-color:var(--gxg-scrollbar-track-background);border-radius:var(--gxg-scrollbar-track-border-radius)}.gx-ide-overflow::-webkit-scrollbar-thumb{background-color:var(--gxg-scrollbar-track-thumb-background);border-radius:var(--gxg-scrollbar-track-thumb-radius)}.gx-ide-overflow::-webkit-scrollbar-thumb:hover{background-color:var(--gxg-scrollbar-track-thumb-hover-background)}.gx-ide-overflow::-webkit-scrollbar-corner{background:rgba(0, 0, 0, 0)}.tree-container{display:flex;height:100%;width:100%;box-sizing:border-box}:host{display:block;box-shadow:none;height:100%;overflow:hidden;padding-bottom:2px;box-sizing:border-box}.news-container{display:flex;flex-direction:column;gap:var(--gx-ide-articles-gap)}.news-container p:first-child{margin-top:0}.news-container p:last-child{margin-bottom:0}gxg-card.section{height:100% !important;overflow:auto;border-bottom:2px solid var(--gray-00)}gxg-ide-loader::part(loader-wrapper){border-radius:var(--gxg-card-section_border-radius);overflow:hidden}.gxg-card-container{height:100%;overflow:auto}.gx-ide-message{height:100%;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:var(--mer-spacing--sm)}.gx-ide-message--hidden{display:none}gx-ide-title{max-width:250px}.news-article{transition:200ms opacity;opacity:0}.news-article.visible{opacity:1}";
|
|
69
|
+
/* STENCIL IMPORTS */
|
|
70
|
+
/*A function that helps highlighting characters when searching.*/
|
|
71
|
+
const escapeRegExp = (str) => {
|
|
72
|
+
return str.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
|
|
73
|
+
};
|
|
74
|
+
const hiChar = function (text, filterValue) {
|
|
75
|
+
if (text && filterValue) {
|
|
76
|
+
/* this function highlights the character(s) that match(es) the filter value. (hi)light (Char)acters */
|
|
77
|
+
const escapedFilterValue = escapeRegExp(filterValue);
|
|
78
|
+
const re = new RegExp(escapedFilterValue, "gi");
|
|
79
|
+
return (index.h("span", { innerHTML: text.replace(re, '<span class="hiChar">$&</span>') }));
|
|
80
|
+
}
|
|
81
|
+
else {
|
|
82
|
+
return text;
|
|
83
|
+
}
|
|
84
|
+
};
|
|
85
|
+
|
|
86
|
+
const cardCss = "/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button}button::-moz-focus-inner,[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0;}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px;}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}:root{--ui-animaton-speed:0.2s}.gxg-title-01{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-01-font-weight);font-size:var(--ds-title-01-font-size);letter-spacing:var(--ds-base-font-letter-spacing--comfortable);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable)}.gxg-title-01--negative{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-01-font-weight);font-size:var(--ds-title-01-font-size);letter-spacing:var(--ds-base-font-letter-spacing--comfortable);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--negative)}.gxg-title-02{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-02-font-weight);font-size:var(--ds-title-02-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;text-transform:uppercase;line-height:var(--ds-base-font-line-height--comfortable)}.gxg-title-02--negative{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-02-font-weight);font-size:var(--ds-title-02-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;text-transform:uppercase;line-height:var(--ds-base-font-line-height--comfortable);color:var(--color-on-primary)}.gxg-title-03{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-03-font-weight);font-size:var(--ds-title-03-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;text-transform:uppercase;line-height:var(--ds-base-font-line-height--comfortable)}.gxg-title-03--negative{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-03-font-weight);font-size:var(--ds-title-03-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;text-transform:uppercase;line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--negative)}.gxg-title-04{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-04-font-weight);font-size:var(--ds-title-04-font-size);letter-spacing:var(--ds-base-font-letter-spacing--comfortable);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable)}.gxg-title-04--negative{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-04-font-weight);font-size:var(--ds-title-04-font-size);letter-spacing:var(--ds-base-font-letter-spacing--comfortable);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--negative)}.gxg-title-05{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-05-font-weight);font-size:var(--ds-title-05-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable)}.gxg-title-05--negative{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-05-font-weight);font-size:var(--ds-title-05-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--negative)}.gxg-text{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable)}.gxg-text--negative{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--negative)}.gxg-text--gray{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--dimmed)}.gxg-quote{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);font-style:italic}.gxg-quote--negative{color:var(--ds-base-font-color--negative)}.gxg-link{line-height:unset;font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--link);text-decoration:underline;cursor:pointer;display:inline-block}.gxg-link:hover{color:var(--ds-base-font-color--link-hover)}.gxg-link:active{color:var(--ds-base-font-color--link-active)}.gxg-link-gray{line-height:unset;font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--link);text-decoration:underline;cursor:pointer;display:inline-block;color:var(--ds-base-font-color--dimmed)}.gxg-link-gray:hover{line-height:unset;font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--link);text-decoration:underline;cursor:pointer;display:inline-block;color:var(--ds-base-font-color--dimmed);filter:brightness(1.4)}.gxg-alert-error{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--error);display:inline-block}.gxg-alert-warning{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--warning);display:inline-block}.gxg-alert-success{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--success);display:inline-block}.gxg-tab--disabled{color:var(--color-primary-disabled);pointer-events:none}.gxg-tab--disabled[disabled]{color:var(--color-primary-disabled);pointer-events:none}.gxg-label{font-family:var(--ds-base-font-family-primary);font-weight:var(--gxg-label-font-weight);font-size:var(--gxg-label-font-size);color:var(--gxg-label-color);text-align:center;line-height:1.455em;display:flex;align-items:center}.gxg-label:hover{color:var(--color-primary-hover)}.gxg-label:focus{color:var(--color-primary-active)}.gxg-label:active{color:var(--color-primary-active)}.gxg-label[disabled]{color:var(--color-primary-disabled)}.gxg-label--negative{color:var(--color-on-primary)}.gxg-label--negative[disabled]{color:var(--color-on-disabled)}.gxg-scrollbar{}.gxg-scrollbar::-webkit-scrollbar{width:var(--gxg-scrollbar-width);height:var(--gxg-scrollbar-width)}.gxg-scrollbar::-webkit-scrollbar-track{background-color:var(--gxg-scrollbar-track-background);border-radius:var(--gxg-scrollbar-track-border-radius)}.gxg-scrollbar::-webkit-scrollbar-thumb{background-color:var(--gxg-scrollbar-track-thumb-background);border-radius:var(--gxg-scrollbar-track-thumb-radius)}.gxg-scrollbar::-webkit-scrollbar-thumb:hover{background-color:var(--gxg-scrollbar-track-thumb-hover-background)}.gxg-scrollbar::-webkit-scrollbar-corner{background:rgba(0, 0, 0, 0)}:host{display:block;background-color:var(--gxg-card_background-color);box-shadow:var(--gxg-card_box-shadow);border-radius:var(--gxg-card_border-radius);border-style:solid;border-width:1px;border-color:transparent;font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable)}:host([elevation=xs]){box-shadow:var(--gxg-card_box-shadow)}:host([elevation=m]){box-shadow:var(--gxg-card_box-shadow)}:host([padding=\"0\"]){padding:0}:host([padding=xs]){padding:var(--gxg-card_padding-xs)}:host([padding=s]){padding:var(--gxg-card_padding-s)}:host([padding=m]){padding:var(--gxg-card_padding-m)}:host([padding=l]){padding:var(--gxg-card_padding-l)}:host([padding=xl]){padding:var(--gxg-card_padding-xl)}:host([padding=xxl]){padding:var(--gxg-card_padding-xxl)}:host([padding=xxxl]){padding:var(--gxg-card_padding-xxxl)}:host([background=white]){background:var(--gxg-card_background-white)}:host([background=gray-01]){background:var(--gxg-card_background-gray)}.content{overflow:auto;height:100%}.content::-webkit-scrollbar{width:var(--gxg-scrollbar-width);height:var(--gxg-scrollbar-width)}.content::-webkit-scrollbar-track{background-color:var(--gxg-scrollbar-track-background);border-radius:var(--gxg-scrollbar-track-border-radius)}.content::-webkit-scrollbar-thumb{background-color:var(--gxg-scrollbar-track-thumb-background);border-radius:var(--gxg-scrollbar-track-thumb-radius)}.content::-webkit-scrollbar-thumb:hover{background-color:var(--gxg-scrollbar-track-thumb-hover-background)}.content::-webkit-scrollbar-corner{background:rgba(0, 0, 0, 0)}:host(.card--no-shadow){box-shadow:none}:host(.card--title) .wrapper{display:flex;flex-direction:column;height:100%;grid-template-rows:auto 1fr}:host(.card){background-color:var(--gxg-card_background-color)}:host(.card) .card__header{box-sizing:border-box;display:flex;align-items:center;justify-content:space-between;margin:var(--gxg-card-header_margin);padding-block-end:var(--gxg-card-header_padding-block-end);border-block-end:var(--gxg-card-header_border-block-end);gap:var(--gxg-card-header_gap)}:host(.card) .card__header--left{display:flex;align-items:center;gap:var(--gxg-card-header-left_gap);width:var(--gxg-card-header-left_width)}:host(.card) .card__header--left .card-title-wrapper{width:100%;white-space:nowrap;overflow:hidden}:host(.card) .card__header--left-full-width{width:100% !important}:host(.card) .card__header--left-full-width .card-title-wrapper{white-space:unset}:host(.card) .card__header--right{display:flex;flex-direction:row;align-items:center;justify-content:end;gap:var(--gxg-card-header-right_gap);font-size:var(--font-size-xl);width:var(--gxg-card-header-right_width);overflow:hidden;white-space:nowrap}:host(.card) .card__header .subtitle-wrapper{overflow:hidden;text-overflow:ellipsis;color:var(--gxg-card-subtitle_color);padding-inline-end:var(--gxg-card-subtitle-wrapper_padding-inline-end);}:host(.card) .card__header .subtitle-wrapper a{color:var(--gxg-card-subtitle-wrapper_link-color)}:host(.card) .card__header .subtitle{white-space:nowrap;color:var(--gxg-card-subtitle-wrapper_color)}:host(.card) .content{padding:var(--gxg-card-content_padding);font-size:var(--gxg-card-content_font-size);line-height:var(--gxg-card-content_line-height);color:var(--gxg-card-content_color)}:host(.card--default){background:var(--color-background)}:host(.card--default) .content{padding:0}:host(.card--section){font-size:var(--gxg-card-section_font-size);border-radius:var(--gxg-card-section_border-radius);padding:var(--gxg-card-section_padding);background-color:var(--mer-elevation__background-color--01);border:var(--mer-elevation__border-01);box-shadow:var(--mer-elevation__box-shadow--01)}:host(.card--section) .card__title{font-weight:var(--gxg-card-section-title_font-weight);font-size:var(--gxg-card-section-title_font-size)}:host(.card--article){font-size:var(--gxg-card-article_font-size);border-radius:var(--gxg-card-article_border-radius);padding:var(--gxg-card-article_padding);background-color:var(--mer-elevation__background-color--02);border:var(--mer-elevation__border-02);box-shadow:var(--mer-elevation__box-shadow--02);border:var(--gxg-card-article_border)}:host(.card--article) .card__header .card__title{margin:var(--gxg-card-article-title_margin);color:var(--gxg-card-article-title_color);overflow:hidden;text-overflow:ellipsis;font-weight:var(--gxg-card-article-title_font-weight);font-size:var(--gxg-card-article-title_font-size)}:host(.card--article) .card__header .subtitle-wrapper{color:var(--gxg-card-article-subtitle-wrapper_color);font-style:var(--gxg-card-article-subtitle-wrapper_font-style)}:host(.card--article) .content{font-style:var(--gxg-card-article-subtitle-content_font-style);color:var(--gxg-card-article-content_color);line-height:var(--gxg-card-article-subtitle-content_line-height)}:host(.card--article.title-semibold) .card__header .card__title{font-weight:var(--gxg-card-article-title-semibold_font-weight)}:host(.card--mini){font-size:var(--gxg-card-mini_font-size);border-radius:var(--gxg-card-mini_border-radius);padding:var(--gxg-card-mini_padding);background-color:var(--mer-elevation__background-color--02);border:var(--mer-elevation__border-02);box-shadow:var(--mer-elevation__box-shadow--02);border:var(--gxg-card-mini_border)}:host(.card--mini) .card__header{margin:var(--gxg-card-mini-header_margin);padding-block-end:var(--gxg-card-mini-header_padding-block-end);border-bottom:var(--gxg-card-mini-header_border-bottom)}:host(.card--mini) .card__header .card__header--left{width:var(--gxg-card-mini-header-left_width);gap:var(--gxg-card-mini-header-left_gap)}:host(.card--mini) .card__header .card__title{margin:var(--gxg-card-mini-title_margin);overflow:hidden;text-overflow:ellipsis;font-weight:var(--gxg-card-mini-title_font-weight);font-size:var(--gxg-card-mini-title_font-size);color:var(--gxg-card-mini-title_color)}:host(.card--mini) .content{font-style:var(--gxg-card-mini-content_font-style);font-size:var(--gxg-card-mini_font-size);padding:var(--gxg-card-mini-content_padding);color:var(--gxg-card-mini-content_color)}:host(.card--no-content) .card__header{border-bottom:0}:host(.card--actionable:hover){filter:brightness(var(--gxg-card-actionable-brightness--hover))}:host(.card--actionable:hover) .wrapper,:host(.card--actionable:hover) .card__header,:host(.card--actionable:hover) .content{cursor:pointer}:host(.no-header-border) .card__header{padding-bottom:0;border-bottom:0}:host(.card--no-border){border:none !important}.hiChar{color:var(--gxg-hi-char-color);font-weight:600}";
|
|
70
87
|
|
|
71
|
-
const
|
|
88
|
+
const GxgCard = class {
|
|
72
89
|
constructor(hostRef) {
|
|
73
|
-
|
|
74
|
-
this.
|
|
75
|
-
this.
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
if (!this.newsRendered &&
|
|
81
|
-
this.news.length > 0 &&
|
|
82
|
-
this.newsContainerEl !== undefined) {
|
|
83
|
-
this.displayNews();
|
|
84
|
-
this.newsRendered = true;
|
|
85
|
-
}
|
|
86
|
-
};
|
|
87
|
-
this.displayNews = () => {
|
|
88
|
-
if (this.newsContainerEl !== undefined) {
|
|
89
|
-
const news = Array.from(this.newsContainerEl.querySelectorAll("gxg-card"));
|
|
90
|
-
news.forEach(news => {
|
|
91
|
-
setTimeout(() => {
|
|
92
|
-
news.classList.add("visible");
|
|
93
|
-
}, this.setTimeOutNewsDelay);
|
|
94
|
-
this.setTimeOutNewsDelay += 75;
|
|
95
|
-
});
|
|
90
|
+
/*--- Mercury Only Tokens ---*/
|
|
91
|
+
this.titleType = "h2";
|
|
92
|
+
this.hasSlot = false;
|
|
93
|
+
this.hasHeaderSlot = false;
|
|
94
|
+
this.renderCardSubtitle = () => {
|
|
95
|
+
if (this.cardSubtitle && this.subtitleLink) {
|
|
96
|
+
return (index.h("a", { class: "subtitle", href: this.subtitleLink, target: "_blank" }, this.cardSubtitle));
|
|
96
97
|
}
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
98
|
+
else if (this.cardSubtitle && !this.subtitleLink) {
|
|
99
|
+
{
|
|
100
|
+
return this.hiChar
|
|
101
|
+
? hiChar(this.cardSubtitle, this.filterValue)
|
|
102
|
+
: this.cardSubtitle;
|
|
102
103
|
}
|
|
103
|
-
else {
|
|
104
|
-
this.newsLoadFailed = false;
|
|
105
|
-
}
|
|
106
|
-
});
|
|
107
|
-
};
|
|
108
|
-
this.getNews = async () => {
|
|
109
|
-
this.loaderEl.show = true;
|
|
110
|
-
if (this.getNewsCallback) {
|
|
111
|
-
const newsResult = await this.getNewsCallback();
|
|
112
|
-
this.loaderEl.show = false;
|
|
113
|
-
if (newsResult && newsResult.length > 0) {
|
|
114
|
-
this.news = newsResult;
|
|
115
|
-
this.newsLoadFailed = false;
|
|
116
|
-
}
|
|
117
|
-
else {
|
|
118
|
-
this.newsLoadFailed = true;
|
|
119
|
-
}
|
|
120
|
-
}
|
|
121
|
-
};
|
|
122
|
-
this.openNewsHandler = (newsId) => async () => {
|
|
123
|
-
if (this.openNewsCallback) {
|
|
124
|
-
await this.openNewsCallback(newsId);
|
|
125
|
-
}
|
|
126
|
-
};
|
|
127
|
-
// 9.LOCAL METHODS -> RENDERS //
|
|
128
|
-
this.renderNews = (news) => {
|
|
129
|
-
if (news.id && news.title) {
|
|
130
|
-
return (index.h("gxg-card", { id: news.id, key: news.id, cardType: "article", cardTitle: news.title, icon: "gx-test/test-results", iconColor: "auto", actionable: true, onClick: this.openNewsHandler(news.id), titleSemibold: true, noHeaderBorder: true, class: "news-article" }, news.body ? index.h("p", null, news.body) : null));
|
|
131
104
|
}
|
|
132
|
-
return null;
|
|
133
105
|
};
|
|
134
|
-
this
|
|
135
|
-
this.
|
|
136
|
-
this.
|
|
137
|
-
this.
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
this.
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
this.
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
this.
|
|
149
|
-
this.
|
|
106
|
+
index.registerInstance(this, hostRef);
|
|
107
|
+
this.elevation = "xs";
|
|
108
|
+
this.background = "white";
|
|
109
|
+
this.padding = "xs";
|
|
110
|
+
this.minHeight = "auto";
|
|
111
|
+
this.height = "auto";
|
|
112
|
+
this.maxWidth = "100%";
|
|
113
|
+
this.noShadow = false;
|
|
114
|
+
this.noBorder = false;
|
|
115
|
+
this.hiChar = false;
|
|
116
|
+
this.filterValue = undefined;
|
|
117
|
+
this.noPaddingTop = false;
|
|
118
|
+
this.cardTitle = undefined;
|
|
119
|
+
this.noHeaderBorder = false;
|
|
120
|
+
this.titleSemibold = false;
|
|
121
|
+
this.cardSubtitle = undefined;
|
|
122
|
+
this.subtitleLink = undefined;
|
|
123
|
+
this.subtitleIcon = undefined;
|
|
124
|
+
this.cardType = "section";
|
|
125
|
+
this.icon = undefined;
|
|
126
|
+
this.iconColor = "auto";
|
|
127
|
+
this.subtitleColor = "auto";
|
|
128
|
+
this.editableTitle = false;
|
|
129
|
+
this.actionable = false;
|
|
150
130
|
}
|
|
151
|
-
|
|
152
|
-
|
|
131
|
+
get el() { return index.getElement(this); }
|
|
132
|
+
componentWillLoad() {
|
|
133
|
+
if (this.cardType === "article") {
|
|
134
|
+
this.titleType = "h2";
|
|
135
|
+
}
|
|
136
|
+
else if (this.cardType === "mini") {
|
|
137
|
+
this.titleType = "h4";
|
|
138
|
+
}
|
|
139
|
+
const hasSlot = this.el.querySelector("*");
|
|
140
|
+
if (hasSlot) {
|
|
141
|
+
this.hasSlot = true;
|
|
142
|
+
}
|
|
143
|
+
const headerSlot = this.el.querySelector("[slot='header']");
|
|
144
|
+
if (headerSlot) {
|
|
145
|
+
this.hasHeaderSlot = true;
|
|
146
|
+
}
|
|
153
147
|
}
|
|
154
|
-
// 10.RENDER() FUNCTION //
|
|
155
148
|
render() {
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
"
|
|
161
|
-
"
|
|
162
|
-
|
|
149
|
+
return (index.h(index.Host, { role: "article", class: {
|
|
150
|
+
card: true,
|
|
151
|
+
mercury: store.state.mercury,
|
|
152
|
+
"card--no-content": !this.hasSlot,
|
|
153
|
+
"card--section": this.cardType === "section",
|
|
154
|
+
"card--article": this.cardType === "article",
|
|
155
|
+
"card--mini": this.cardType === "mini",
|
|
156
|
+
"card--title": this.cardTitle !== undefined,
|
|
157
|
+
"card--actionable": this.actionable &&
|
|
158
|
+
(this.cardType === "article" || this.cardType === "mini"),
|
|
159
|
+
"title-semibold": this.titleSemibold,
|
|
160
|
+
"card--no-shadow": this.noShadow,
|
|
161
|
+
"card--no-border": this.noBorder,
|
|
162
|
+
"no-header-border": this.noHeaderBorder
|
|
163
|
+
}, style: {
|
|
164
|
+
maxWidth: this.maxWidth,
|
|
165
|
+
minHeight: this.minHeight,
|
|
166
|
+
height: this.height
|
|
167
|
+
} }, index.h("div", { role: this.actionable ? "button" : "none", class: {
|
|
168
|
+
wrapper: true,
|
|
169
|
+
"wrapper--header": this.cardTitle !== undefined
|
|
170
|
+
} }, this.cardTitle ? (index.h("header", { class: "card__header" }, index.h("div", { class: {
|
|
171
|
+
"card__header--left": true,
|
|
172
|
+
"card__header--left-full-width": !this.cardSubtitle
|
|
173
|
+
} }, this.icon ? (index.h("gxg-icon", { type: this.icon, color: this.iconColor })) : null, index.h("div", { class: "card-title-wrapper" }, this.cardType === "section" ? (index.h("gxg-title-editable", { class: "card__title", titleType: this.titleType, value: this.cardTitle, disableEdition: !this.editableTitle })) : (index.h("h2", { class: "card__title" }, this.hiChar
|
|
174
|
+
? hiChar(this.cardTitle, this.filterValue)
|
|
175
|
+
: this.cardTitle)))), this.cardSubtitle &&
|
|
176
|
+
this.cardType !== "mini" &&
|
|
177
|
+
!this.hasHeaderSlot ? (index.h("div", { class: "card__header--right" }, index.h("div", { class: "subtitle-wrapper" }, this.renderCardSubtitle()), this.subtitleIcon ? (index.h("gxg-icon", { type: this.subtitleIcon, color: this.subtitleColor })) : null)) : null, this.hasHeaderSlot ? (index.h("div", { class: "card__header--right" }, index.h("slot", { name: "header" }))) : null)) : null, this.hasSlot ? (index.h("div", { class: "content" }, index.h("slot", null))) : null)));
|
|
163
178
|
}
|
|
164
|
-
static get assetsDirs() { return ["gx-ide-assets/recent-news"]; }
|
|
165
|
-
get el() { return index.getElement(this); }
|
|
166
|
-
static get watchers() { return {
|
|
167
|
-
"news": ["watchNewsHandler"]
|
|
168
|
-
}; }
|
|
169
179
|
};
|
|
170
|
-
|
|
180
|
+
GxgCard.style = cardCss;
|
|
171
181
|
|
|
172
182
|
exports.gx_ide_empty_state = GxIdeEmptyState;
|
|
173
|
-
exports.
|
|
183
|
+
exports.gxg_card = GxgCard;
|
|
174
184
|
|
|
175
185
|
//# sourceMappingURL=gx-ide-empty-state_2.cjs.entry.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"gx-ide-empty-state.gx-ide-recent-news.entry.cjs.js","mappings":"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","names":["h","Host","Locale"],"sources":["src/components/_helpers/empty-state/gx-ide-empty-state.scss?tag=gx-ide-empty-state&encapsulation=shadow","src/components/_helpers/empty-state/gx-ide-empty-state.tsx","src/components/start-page/recent-news.scss?tag=gx-ide-recent-news&encapsulation=shadow","src/components/start-page/recent-news.tsx"],"sourcesContent":[":host {\n display: flex;\n align-items: center;\n justify-content: center;\n}\n.container {\n max-width: 520px;\n margin: 0 auto;\n gap: var(--mer-spacing--xl);\n opacity: 0;\n transition: opacity var(--state-transition-speed);\n padding: var(--mer-spacing--md);\n\n .icon-wrapper {\n border: var(--mer-border__width--sm) dashed var(--mer-accent__primary);\n border-radius: 50%;\n min-width: 40px;\n min-height: 40px;\n display: flex;\n align-items: center;\n justify-content: center;\n }\n\n &__main {\n gap: var(--mer-spacing--sm);\n }\n &__buttons {\n gap: var(--mer-spacing--xs);\n }\n &--visible {\n opacity: 1;\n }\n}\n.container,\n.container__main,\n.container__buttons {\n display: flex;\n align-items: center;\n flex-direction: column;\n}\n","import { Component, Host, h, Prop, Watch, Element } from \"@stencil/core\";\n\n@Component({\n tag: \"gx-ide-empty-state\",\n styleUrl: \"gx-ide-empty-state.scss\",\n shadow: true\n})\nexport class GxIdeEmptyState {\n /*\nINDEX:\n1.OWN PROPERTIES \n2.REFERENCE TO ELEMENTS\n3.STATE() VARIABLES\n4.PUBLIC PROPERTY API | WATCH'S\n5.EVENTS (EMIT)\n6.COMPONENT LIFECYCLE METHODS\n7.LISTENERS\n8.PUBLIC METHODS API\n9.LOCAL METHODS\n10.RENDER() FUNCTION\n*/\n\n // 1.OWN PROPERTIES //\n\n private transitionSpeed: number = 200;\n\n // 2. REFERENCE TO ELEMENTS //\n\n @Element() el: HTMLGxIdeEmptyStateElement;\n private primaryButtonEl!: HTMLGxgButtonElement;\n private secondaryButtonEl!: HTMLGxgButtonElement;\n\n // 3.STATE() VARIABLES //\n\n // 4.PUBLIC PROPERTY API | WATCH'S //\n\n /**\n * The state icon\n */\n @Prop() readonly stateIcon?: string;\n\n /**\n * The state title\n */\n @Prop() readonly stateTitle!: string;\n\n /**\n * The state description\n */\n @Prop() readonly stateDescription?: string;\n\n /**\n * The button primary label\n */\n @Prop() readonly primaryButtonLabel?: string;\n\n /**\n * The button secondary label\n */\n @Prop() readonly secondaryButtonLabel?: string;\n\n /**\n * If true, it will display the content\n */\n @Prop({ mutable: true }) display: boolean = false;\n @Watch(\"display\")\n watchDisplayHandler(display: boolean) {\n if (display) {\n this.primaryButtonEl.disabled = false;\n this.secondaryButtonEl.disabled = false;\n } else {\n setTimeout(() => {\n this.primaryButtonEl.disabled = true;\n this.secondaryButtonEl.disabled = true;\n }, this.transitionSpeed);\n }\n }\n\n // 5.EVENTS (EMIT) //\n\n // 6.COMPONENT LIFECYCLE METHODS //\n\n componentWillLoad() {\n this.el.style.setProperty(\n \"--state-transition-speed\",\n `${this.transitionSpeed}ms`\n );\n }\n\n componentDidLoad() {\n this.display = true;\n }\n\n // 7.LISTENERS //\n\n // 8.PUBLIC METHODS API //\n\n // 9.LOCAL METHODS //\n\n // 10.RENDER() FUNCTION //\n\n render() {\n return (\n <Host>\n <div class={{ \"container\": true, \"container--visible\": this.display }}>\n {this.stateIcon ? (\n <span class=\"icon-wrapper\">\n <gxg-icon\n class=\"icon\"\n type={this.stateIcon}\n color=\"mercury-primary\"\n >\n {this.stateTitle}\n </gxg-icon>\n </span>\n ) : null}\n <main class=\"container__main\">\n {this.stateTitle ? (\n <gx-ide-title alignment=\"center\">{this.stateTitle}</gx-ide-title>\n ) : null}\n {this.stateDescription ? (\n <gxg-text textAlign=\"center\">{this.stateDescription}</gxg-text>\n ) : null}\n </main>\n <div class=\"container__buttons\">\n {this.primaryButtonLabel ? (\n <gxg-button\n type=\"primary-text-only\"\n ref={el => (this.primaryButtonEl = el as HTMLGxgButtonElement)}\n >\n {this.primaryButtonLabel}\n </gxg-button>\n ) : null}\n {this.secondaryButtonLabel ? (\n <gxg-button\n type=\"secondary-text-only\"\n ref={el =>\n (this.secondaryButtonEl = el as HTMLGxgButtonElement)\n }\n >\n {this.secondaryButtonLabel}\n </gxg-button>\n ) : null}\n </div>\n </div>\n </Host>\n );\n }\n}\n","@import \"../../global/gx-ide-common.scss\";\n@import \"../../global/gx-ide-mixins.scss\";\n\n:host {\n display: block;\n box-shadow: none;\n height: 100%;\n overflow: hidden;\n padding-bottom: 2px;\n box-sizing: border-box;\n}\n.news-container {\n display: flex;\n flex-direction: column;\n gap: var(--gx-ide-articles-gap);\n p:first-child {\n margin-top: 0;\n }\n p:last-child {\n margin-bottom: 0;\n }\n}\ngxg-card.section {\n height: 100% !important;\n overflow: auto;\n border-bottom: 2px solid var(--gray-00);\n}\ngxg-ide-loader::part(loader-wrapper) {\n border-radius: var(--gxg-card-section_border-radius);\n overflow: hidden;\n}\n.gxg-card-container {\n height: 100%;\n overflow: auto;\n}\n.gx-ide-message {\n height: 100%;\n display: flex;\n align-items: center;\n justify-content: center;\n flex-direction: column;\n gap: var(--mer-spacing--sm);\n\n &--hidden {\n display: none;\n }\n}\ngx-ide-title {\n max-width: 250px;\n}\n.news-article {\n transition: 200ms opacity;\n opacity: 0;\n\n &.visible {\n opacity: 1;\n }\n}\n","/* STENCIL IMPORTS */\nimport { Component, Host, h, Prop, Element, State, Watch } from \"@stencil/core\";\n/* OTHER LIBRARIES IMPORTS */\n/* CUSTOM IMPORTS */\nimport { Locale } from \"../../common/locale\";\nimport { NewsData, GetNewsCallback, OpenNewsCallback } from \"./start-page\";\n\n@Component({\n tag: \"gx-ide-recent-news\",\n styleUrl: \"recent-news.scss\",\n shadow: true,\n assetsDirs: [\"gx-ide-assets/recent-news\"]\n})\nexport class GxIdeRecentNews {\n /*\nINDEX:\n1.OWN PROPERTIES \n2.REFERENCE TO ELEMENTS\n3.STATE() VARIABLES\n4.PUBLIC PROPERTY API | WATCH'S\n5.EVENTS (EMIT)\n6.COMPONENT LIFECYCLE METHODS\n7.LISTENERS\n8.PUBLIC METHODS API\n9.LOCAL METHODS\n10.RENDER() FUNCTION\n*/\n\n // 1.OWN PROPERTIES //\n\n /**\n * The component hard-coded strings translations.\n */\n private _componentLocale: any;\n\n // 2. REFERENCE TO ELEMENTS //\n\n @Element() el: HTMLGxIdeRecentNewsElement;\n private loaderEl!: HTMLGxgIdeLoaderElement;\n private newsContainerEl: HTMLDivElement;\n private newsRendered = false;\n private setTimeOutNewsDelay = 75;\n\n // 3.STATE() VARIABLES //\n\n /**\n * The list of news\n */\n @State() news: NewsData[] = [];\n @Watch(\"news\")\n watchNewsHandler() {\n this.displayNews();\n }\n\n /**\n * True if news couldn't be loaded\n */\n @State() newsLoadFailed = false;\n\n // 4.PUBLIC PROPERTY API | WATCH'S //\n\n /**\n * Callback invoked to load the news feed (right panel \"Recent News\").\n */\n @Prop() readonly getNewsCallback: GetNewsCallback;\n\n /**\n * Callback invoked to open a news article.\n */\n @Prop() readonly openNewsCallback: OpenNewsCallback;\n\n // 5.EVENTS (EMIT) //\n\n // 6.COMPONENT LIFECYCLE METHODS //\n\n async componentWillLoad() {\n this._componentLocale = await Locale.getComponentStrings(this.el);\n }\n\n componentDidLoad() {\n this.getNews();\n this.attachLoaderEvents();\n }\n\n componentDidRender() {\n this.evaluateNewsDisplay();\n }\n\n // 7.LISTENERS //\n\n // 8.PUBLIC METHODS API //\n\n // 9.LOCAL METHODS //\n\n private evaluateNewsDisplay = () => {\n if (\n !this.newsRendered &&\n this.news.length > 0 &&\n this.newsContainerEl !== undefined\n ) {\n this.displayNews();\n this.newsRendered = true;\n }\n };\n\n private displayNews = () => {\n if (this.newsContainerEl !== undefined) {\n const news = Array.from(\n this.newsContainerEl.querySelectorAll(\"gxg-card\")\n );\n news.forEach(news => {\n setTimeout(() => {\n news.classList.add(\"visible\");\n }, this.setTimeOutNewsDelay);\n this.setTimeOutNewsDelay += 75;\n });\n }\n };\n\n private attachLoaderEvents = () => {\n this.loaderEl.addEventListener(\"loaderFinished\", () => {\n if (this.news.length === 0) {\n this.newsLoadFailed = true;\n } else {\n this.newsLoadFailed = false;\n }\n });\n };\n\n private getNews = async () => {\n this.loaderEl.show = true;\n if (this.getNewsCallback) {\n const newsResult = await this.getNewsCallback();\n this.loaderEl.show = false;\n if (newsResult && newsResult.length > 0) {\n this.news = newsResult;\n this.newsLoadFailed = false;\n } else {\n this.newsLoadFailed = true;\n }\n }\n };\n\n private openNewsHandler = (newsId: string) => async () => {\n if (this.openNewsCallback) {\n await this.openNewsCallback(newsId);\n }\n };\n\n // 9.LOCAL METHODS -> RENDERS //\n\n private renderNews = (news: NewsData): HTMLGxgCardElement | null => {\n if (news.id && news.title) {\n return (\n <gxg-card\n id={news.id}\n key={news.id}\n cardType=\"article\"\n cardTitle={news.title}\n icon=\"gx-test/test-results\"\n iconColor=\"auto\"\n actionable\n onClick={this.openNewsHandler(news.id)}\n titleSemibold\n noHeaderBorder\n class=\"news-article\"\n >\n {news.body ? <p>{news.body}</p> : null}\n </gxg-card>\n );\n }\n return null;\n };\n\n // 10.RENDER() FUNCTION //\n\n render() {\n return (\n <Host>\n <gxg-card\n class=\"section\"\n cardType=\"section\"\n cardTitle={this._componentLocale.recentNews.title}\n >\n {this.news.length > 0 ? (\n <div\n class=\"news-container\"\n ref={el => (this.newsContainerEl = el as HTMLDivElement)}\n >\n {this.news?.map(singleNews => {\n return this.renderNews(singleNews);\n })}\n </div>\n ) : (\n <div\n class={{\n \"gx-ide-message\": true,\n \"gx-ide-message--hidden\": !this.newsLoadFailed\n }}\n >\n <gx-ide-title alignment=\"center\">\n {this._componentLocale.recentNews.newsNotFetched}\n </gx-ide-title>\n <gxg-button onClick={this.getNews}>\n {this._componentLocale.recentNews.tryAgainButtonLabel}\n </gxg-button>\n <gxg-text\n type=\"text-link\"\n href=\"https://www.genexus.com/en/news\"\n target=\"_blank\"\n >\n {this._componentLocale.recentNews.readThemOnline}\n </gxg-text>\n </div>\n )}\n </gxg-card>\n <gxg-ide-loader\n abortTime={8000}\n container={this.el}\n loaderTitle={this._componentLocale.loader.title}\n description=\"Hang on please\"\n ref={el => (this.loaderEl = el as HTMLGxgIdeLoaderElement)}\n ></gxg-ide-loader>\n </Host>\n );\n }\n}\n"],"version":3}
|
|
1
|
+
{"file":"gx-ide-empty-state.gxg-card.entry.cjs.js","mappings":"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","names":["h","Host","state"],"sources":["src/components/_helpers/empty-state/gx-ide-empty-state.scss?tag=gx-ide-empty-state&encapsulation=shadow","src/components/_helpers/empty-state/gx-ide-empty-state.tsx","node_modules/@genexus/gemini/dist/collection/common/hiChar.js","node_modules/@genexus/gemini/dist/collection/components/card/card.css?tag=gxg-card&encapsulation=shadow","node_modules/@genexus/gemini/dist/collection/components/card/card.js"],"sourcesContent":[":host {\n display: flex;\n align-items: center;\n justify-content: center;\n}\n.container {\n max-width: 520px;\n margin: 0 auto;\n gap: var(--mer-spacing--xl);\n opacity: 0;\n transition: opacity var(--state-transition-speed);\n padding: var(--mer-spacing--md);\n\n .icon-wrapper {\n border: var(--mer-border__width--sm) dashed var(--mer-accent__primary);\n border-radius: 50%;\n min-width: 40px;\n min-height: 40px;\n display: flex;\n align-items: center;\n justify-content: center;\n }\n\n &__main {\n gap: var(--mer-spacing--sm);\n }\n &__buttons {\n gap: var(--mer-spacing--xs);\n }\n &--visible {\n opacity: 1;\n }\n}\n.container,\n.container__main,\n.container__buttons {\n display: flex;\n align-items: center;\n flex-direction: column;\n}\n","import { Component, Host, h, Prop, Watch, Element } from \"@stencil/core\";\n\n@Component({\n tag: \"gx-ide-empty-state\",\n styleUrl: \"gx-ide-empty-state.scss\",\n shadow: true\n})\nexport class GxIdeEmptyState {\n /*\nINDEX:\n1.OWN PROPERTIES \n2.REFERENCE TO ELEMENTS\n3.STATE() VARIABLES\n4.PUBLIC PROPERTY API | WATCH'S\n5.EVENTS (EMIT)\n6.COMPONENT LIFECYCLE METHODS\n7.LISTENERS\n8.PUBLIC METHODS API\n9.LOCAL METHODS\n10.RENDER() FUNCTION\n*/\n\n // 1.OWN PROPERTIES //\n\n private transitionSpeed: number = 200;\n\n // 2. REFERENCE TO ELEMENTS //\n\n @Element() el: HTMLGxIdeEmptyStateElement;\n private primaryButtonEl!: HTMLGxgButtonElement;\n private secondaryButtonEl!: HTMLGxgButtonElement;\n\n // 3.STATE() VARIABLES //\n\n // 4.PUBLIC PROPERTY API | WATCH'S //\n\n /**\n * The state icon\n */\n @Prop() readonly stateIcon?: string;\n\n /**\n * The state title\n */\n @Prop() readonly stateTitle!: string;\n\n /**\n * The state description\n */\n @Prop() readonly stateDescription?: string;\n\n /**\n * The button primary label\n */\n @Prop() readonly primaryButtonLabel?: string;\n\n /**\n * The button secondary label\n */\n @Prop() readonly secondaryButtonLabel?: string;\n\n /**\n * If true, it will display the content\n */\n @Prop({ mutable: true }) display: boolean = false;\n @Watch(\"display\")\n watchDisplayHandler(display: boolean) {\n if (display) {\n this.primaryButtonLabel && (this.primaryButtonEl.disabled = false);\n this.secondaryButtonLabel && (this.secondaryButtonEl.disabled = false);\n } else {\n setTimeout(() => {\n this.primaryButtonLabel && (this.primaryButtonEl.disabled = true);\n this.secondaryButtonLabel && (this.secondaryButtonEl.disabled = true);\n }, this.transitionSpeed);\n }\n }\n\n // 5.EVENTS (EMIT) //\n\n // 6.COMPONENT LIFECYCLE METHODS //\n\n componentWillLoad() {\n this.el.style.setProperty(\n \"--state-transition-speed\",\n `${this.transitionSpeed}ms`\n );\n }\n\n componentDidLoad() {\n this.display = true;\n }\n\n // 7.LISTENERS //\n\n // 8.PUBLIC METHODS API //\n\n // 9.LOCAL METHODS //\n\n // 10.RENDER() FUNCTION //\n\n render() {\n return (\n <Host>\n <div class={{ \"container\": true, \"container--visible\": this.display }}>\n {this.stateIcon ? (\n <span class=\"icon-wrapper\">\n <gxg-icon\n class=\"icon\"\n type={this.stateIcon}\n color=\"mercury-primary\"\n >\n {this.stateTitle}\n </gxg-icon>\n </span>\n ) : null}\n <main class=\"container__main\">\n {this.stateTitle ? (\n <gx-ide-title alignment=\"center\">{this.stateTitle}</gx-ide-title>\n ) : null}\n {this.stateDescription ? (\n <gxg-text textAlign=\"center\">{this.stateDescription}</gxg-text>\n ) : null}\n </main>\n <div class=\"container__buttons\">\n {this.primaryButtonLabel ? (\n <gxg-button\n type=\"primary-text-only\"\n ref={el => (this.primaryButtonEl = el as HTMLGxgButtonElement)}\n >\n {this.primaryButtonLabel}\n </gxg-button>\n ) : null}\n {this.secondaryButtonLabel ? (\n <gxg-button\n type=\"secondary-text-only\"\n ref={el =>\n (this.secondaryButtonEl = el as HTMLGxgButtonElement)\n }\n >\n {this.secondaryButtonLabel}\n </gxg-button>\n ) : null}\n </div>\n </div>\n </Host>\n );\n }\n}\n","/* STENCIL IMPORTS */\nimport { h } from \"@stencil/core\";\n/*A function that helps highlighting characters when searching.*/\nexport const escapeRegExp = (str) => {\n return str.replace(/[.*+?^${}()|[\\]\\\\]/g, \"\\\\$&\");\n};\nexport const hiChar = function (text, filterValue) {\n if (text && filterValue) {\n /* this function highlights the character(s) that match(es) the filter value. (hi)light (Char)acters */\n const escapedFilterValue = escapeRegExp(filterValue);\n const re = new RegExp(escapedFilterValue, \"gi\");\n return (h(\"span\", { innerHTML: text.replace(re, '<span class=\"hiChar\">$&</span>') }));\n }\n else {\n return text;\n }\n};\n//# sourceMappingURL=hiChar.js.map\n","/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */\n/* Document\n ========================================================================== */\n/**\n * 1. Correct the line height in all browsers.\n * 2. Prevent adjustments of font size after orientation changes in iOS.\n */\nhtml {\n line-height: 1.15;\n /* 1 */\n -webkit-text-size-adjust: 100%;\n /* 2 */\n}\n\n/* Sections\n ========================================================================== */\n/**\n * Remove the margin in all browsers.\n */\nbody {\n margin: 0;\n}\n\n/**\n * Render the `main` element consistently in IE.\n */\nmain {\n display: block;\n}\n\n/**\n * Correct the font size and margin on `h1` elements within `section` and\n * `article` contexts in Chrome, Firefox, and Safari.\n */\nh1 {\n font-size: 2em;\n margin: 0.67em 0;\n}\n\n/* Grouping content\n ========================================================================== */\n/**\n * 1. Add the correct box sizing in Firefox.\n * 2. Show the overflow in Edge and IE.\n */\nhr {\n box-sizing: content-box;\n /* 1 */\n height: 0;\n /* 1 */\n overflow: visible;\n /* 2 */\n}\n\n/**\n * 1. Correct the inheritance and scaling of font size in all browsers.\n * 2. Correct the odd `em` font sizing in all browsers.\n */\npre {\n font-family: monospace, monospace;\n /* 1 */\n font-size: 1em;\n /* 2 */\n}\n\n/* Text-level semantics\n ========================================================================== */\n/**\n * Remove the gray background on active links in IE 10.\n */\na {\n background-color: transparent;\n}\n\n/**\n * 1. Remove the bottom border in Chrome 57-\n * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.\n */\nabbr[title] {\n border-bottom: none;\n /* 1 */\n text-decoration: underline;\n /* 2 */\n text-decoration: underline dotted;\n /* 2 */\n}\n\n/**\n * Add the correct font weight in Chrome, Edge, and Safari.\n */\nb,\nstrong {\n font-weight: bolder;\n}\n\n/**\n * 1. Correct the inheritance and scaling of font size in all browsers.\n * 2. Correct the odd `em` font sizing in all browsers.\n */\ncode,\nkbd,\nsamp {\n font-family: monospace, monospace;\n /* 1 */\n font-size: 1em;\n /* 2 */\n}\n\n/**\n * Add the correct font size in all browsers.\n */\nsmall {\n font-size: 80%;\n}\n\n/**\n * Prevent `sub` and `sup` elements from affecting the line height in\n * all browsers.\n */\nsub,\nsup {\n font-size: 75%;\n line-height: 0;\n position: relative;\n vertical-align: baseline;\n}\n\nsub {\n bottom: -0.25em;\n}\n\nsup {\n top: -0.5em;\n}\n\n/* Embedded content\n ========================================================================== */\n/**\n * Remove the border on images inside links in IE 10.\n */\nimg {\n border-style: none;\n}\n\n/* Forms\n ========================================================================== */\n/**\n * 1. Change the font styles in all browsers.\n * 2. Remove the margin in Firefox and Safari.\n */\nbutton,\ninput,\noptgroup,\nselect,\ntextarea {\n font-family: inherit;\n /* 1 */\n font-size: 100%;\n /* 1 */\n line-height: 1.15;\n /* 1 */\n margin: 0;\n /* 2 */\n}\n\n/**\n * Show the overflow in IE.\n * 1. Show the overflow in Edge.\n */\nbutton,\ninput {\n /* 1 */\n overflow: visible;\n}\n\n/**\n * Remove the inheritance of text transform in Edge, Firefox, and IE.\n * 1. Remove the inheritance of text transform in Firefox.\n */\nbutton,\nselect {\n /* 1 */\n text-transform: none;\n}\n\n/**\n * Correct the inability to style clickable types in iOS and Safari.\n */\nbutton,\n[type=button],\n[type=reset],\n[type=submit] {\n -webkit-appearance: button;\n}\n\n/**\n * Remove the inner border and padding in Firefox.\n */\nbutton::-moz-focus-inner,\n[type=button]::-moz-focus-inner,\n[type=reset]::-moz-focus-inner,\n[type=submit]::-moz-focus-inner {\n border-style: none;\n padding: 0;\n}\n\n/**\n * Restore the focus styles unset by the previous rule.\n */\nbutton:-moz-focusring,\n[type=button]:-moz-focusring,\n[type=reset]:-moz-focusring,\n[type=submit]:-moz-focusring {\n outline: 1px dotted ButtonText;\n}\n\n/**\n * Correct the padding in Firefox.\n */\nfieldset {\n padding: 0.35em 0.75em 0.625em;\n}\n\n/**\n * 1. Correct the text wrapping in Edge and IE.\n * 2. Correct the color inheritance from `fieldset` elements in IE.\n * 3. Remove the padding so developers are not caught out when they zero out\n * `fieldset` elements in all browsers.\n */\nlegend {\n box-sizing: border-box;\n /* 1 */\n color: inherit;\n /* 2 */\n display: table;\n /* 1 */\n max-width: 100%;\n /* 1 */\n padding: 0;\n /* 3 */\n white-space: normal;\n /* 1 */\n}\n\n/**\n * Add the correct vertical alignment in Chrome, Firefox, and Opera.\n */\nprogress {\n vertical-align: baseline;\n}\n\n/**\n * Remove the default vertical scrollbar in IE 10+.\n */\ntextarea {\n overflow: auto;\n}\n\n/**\n * 1. Add the correct box sizing in IE 10.\n * 2. Remove the padding in IE 10.\n */\n[type=checkbox],\n[type=radio] {\n box-sizing: border-box;\n /* 1 */\n padding: 0;\n /* 2 */\n}\n\n/**\n * Correct the cursor style of increment and decrement buttons in Chrome.\n */\n[type=number]::-webkit-inner-spin-button,\n[type=number]::-webkit-outer-spin-button {\n height: auto;\n}\n\n/**\n * 1. Correct the odd appearance in Chrome and Safari.\n * 2. Correct the outline style in Safari.\n */\n[type=search] {\n -webkit-appearance: textfield;\n /* 1 */\n outline-offset: -2px;\n /* 2 */\n}\n\n/**\n * Remove the inner padding in Chrome and Safari on macOS.\n */\n[type=search]::-webkit-search-decoration {\n -webkit-appearance: none;\n}\n\n/**\n * 1. Correct the inability to style clickable types in iOS and Safari.\n * 2. Change font properties to `inherit` in Safari.\n */\n::-webkit-file-upload-button {\n -webkit-appearance: button;\n /* 1 */\n font: inherit;\n /* 2 */\n}\n\n/* Interactive\n ========================================================================== */\n/*\n * Add the correct display in Edge, IE 10+, and Firefox.\n */\ndetails {\n display: block;\n}\n\n/*\n * Add the correct display in all browsers.\n */\nsummary {\n display: list-item;\n}\n\n/* Misc\n ========================================================================== */\n/**\n * Add the correct display in IE 10+.\n */\ntemplate {\n display: none;\n}\n\n/**\n * Add the correct display in IE 10.\n */\n[hidden] {\n display: none;\n}\n\n:root {\n --ui-animaton-speed: 0.2s;\n}\n\n/*ALIGNMENT*/\n/*Ellipsis*/\n/*****************************************************\nTYPOGRAPHY\n*****************************************************/\n/*Title 01 (Positive)*/\n.gxg-title-01 {\n font-family: var(--ds-base-font-family-primary);\n font-weight: var(--ds-title-01-font-weight);\n font-size: var(--ds-title-01-font-size);\n letter-spacing: var(--ds-base-font-letter-spacing--comfortable);\n color: var(--ds-base-font-color);\n text-align: start;\n line-height: var(--ds-base-font-line-height--comfortable);\n}\n\n/*Title 01 (Negative)*/\n.gxg-title-01--negative {\n font-family: var(--ds-base-font-family-primary);\n font-weight: var(--ds-title-01-font-weight);\n font-size: var(--ds-title-01-font-size);\n letter-spacing: var(--ds-base-font-letter-spacing--comfortable);\n color: var(--ds-base-font-color);\n text-align: start;\n line-height: var(--ds-base-font-line-height--comfortable);\n color: var(--ds-base-font-color--negative);\n}\n\n/*Title 02 (Positive)*/\n.gxg-title-02 {\n font-family: var(--ds-base-font-family-primary);\n font-weight: var(--ds-title-02-font-weight);\n font-size: var(--ds-title-02-font-size);\n letter-spacing: var(--ds-base-font-letter-spacing--regular);\n color: var(--ds-base-font-color);\n text-align: start;\n text-transform: uppercase;\n line-height: var(--ds-base-font-line-height--comfortable);\n}\n\n.gxg-title-02--negative {\n font-family: var(--ds-base-font-family-primary);\n font-weight: var(--ds-title-02-font-weight);\n font-size: var(--ds-title-02-font-size);\n letter-spacing: var(--ds-base-font-letter-spacing--regular);\n color: var(--ds-base-font-color);\n text-align: start;\n text-transform: uppercase;\n line-height: var(--ds-base-font-line-height--comfortable);\n color: var(--color-on-primary);\n}\n\n/*Title 03*/\n.gxg-title-03 {\n font-family: var(--ds-base-font-family-primary);\n font-weight: var(--ds-title-03-font-weight);\n font-size: var(--ds-title-03-font-size);\n letter-spacing: var(--ds-base-font-letter-spacing--regular);\n color: var(--ds-base-font-color);\n text-align: start;\n text-transform: uppercase;\n line-height: var(--ds-base-font-line-height--comfortable);\n}\n\n.gxg-title-03--negative {\n font-family: var(--ds-base-font-family-primary);\n font-weight: var(--ds-title-03-font-weight);\n font-size: var(--ds-title-03-font-size);\n letter-spacing: var(--ds-base-font-letter-spacing--regular);\n color: var(--ds-base-font-color);\n text-align: start;\n text-transform: uppercase;\n line-height: var(--ds-base-font-line-height--comfortable);\n color: var(--ds-base-font-color--negative);\n}\n\n/*Title 04*/\n.gxg-title-04 {\n font-family: var(--ds-base-font-family-primary);\n font-weight: var(--ds-title-04-font-weight);\n font-size: var(--ds-title-04-font-size);\n letter-spacing: var(--ds-base-font-letter-spacing--comfortable);\n color: var(--ds-base-font-color);\n text-align: start;\n line-height: var(--ds-base-font-line-height--comfortable);\n}\n\n.gxg-title-04--negative {\n font-family: var(--ds-base-font-family-primary);\n font-weight: var(--ds-title-04-font-weight);\n font-size: var(--ds-title-04-font-size);\n letter-spacing: var(--ds-base-font-letter-spacing--comfortable);\n color: var(--ds-base-font-color);\n text-align: start;\n line-height: var(--ds-base-font-line-height--comfortable);\n color: var(--ds-base-font-color--negative);\n}\n\n/*Title 05*/\n.gxg-title-05 {\n font-family: var(--ds-base-font-family-primary);\n font-weight: var(--ds-title-05-font-weight);\n font-size: var(--ds-title-05-font-size);\n letter-spacing: var(--ds-base-font-letter-spacing--regular);\n color: var(--ds-base-font-color);\n text-align: start;\n line-height: var(--ds-base-font-line-height--comfortable);\n}\n\n.gxg-title-05--negative {\n font-family: var(--ds-base-font-family-primary);\n font-weight: var(--ds-title-05-font-weight);\n font-size: var(--ds-title-05-font-size);\n letter-spacing: var(--ds-base-font-letter-spacing--regular);\n color: var(--ds-base-font-color);\n text-align: start;\n line-height: var(--ds-base-font-line-height--comfortable);\n color: var(--ds-base-font-color--negative);\n}\n\n/*Text*/\n.gxg-text {\n font-family: var(--ds-base-font-family-primary);\n font-size: var(--ds-base-font-size);\n color: var(--ds-base-font-size-color);\n font-weight: var(--ds-base-font-size-weight);\n line-height: var(--ds-base-font-line-height--comfortable);\n}\n\n.gxg-text--negative {\n font-family: var(--ds-base-font-family-primary);\n font-size: var(--ds-base-font-size);\n color: var(--ds-base-font-size-color);\n font-weight: var(--ds-base-font-size-weight);\n line-height: var(--ds-base-font-line-height--comfortable);\n color: var(--ds-base-font-color--negative);\n}\n\n.gxg-text--gray {\n font-family: var(--ds-base-font-family-primary);\n font-size: var(--ds-base-font-size);\n color: var(--ds-base-font-size-color);\n font-weight: var(--ds-base-font-size-weight);\n line-height: var(--ds-base-font-line-height--comfortable);\n color: var(--ds-base-font-color--dimmed);\n}\n\n/*Quote*/\n.gxg-quote {\n font-family: var(--ds-base-font-family-primary);\n font-size: var(--ds-base-font-size);\n color: var(--ds-base-font-size-color);\n font-weight: var(--ds-base-font-size-weight);\n line-height: var(--ds-base-font-line-height--comfortable);\n font-style: italic;\n}\n\n.gxg-quote--negative {\n color: var(--ds-base-font-color--negative);\n}\n\n/*Link*/\n.gxg-link {\n line-height: unset;\n font-family: var(--ds-base-font-family-primary);\n font-size: var(--ds-base-font-size);\n color: var(--ds-base-font-size-color);\n font-weight: var(--ds-base-font-size-weight);\n line-height: var(--ds-base-font-line-height--comfortable);\n color: var(--ds-base-font-color--link);\n text-decoration: underline;\n cursor: pointer;\n display: inline-block;\n}\n.gxg-link:hover {\n color: var(--ds-base-font-color--link-hover);\n}\n.gxg-link:active {\n color: var(--ds-base-font-color--link-active);\n}\n\n.gxg-link-gray {\n line-height: unset;\n font-family: var(--ds-base-font-family-primary);\n font-size: var(--ds-base-font-size);\n color: var(--ds-base-font-size-color);\n font-weight: var(--ds-base-font-size-weight);\n line-height: var(--ds-base-font-line-height--comfortable);\n color: var(--ds-base-font-color--link);\n text-decoration: underline;\n cursor: pointer;\n display: inline-block;\n color: var(--ds-base-font-color--dimmed);\n}\n.gxg-link-gray:hover {\n line-height: unset;\n font-family: var(--ds-base-font-family-primary);\n font-size: var(--ds-base-font-size);\n color: var(--ds-base-font-size-color);\n font-weight: var(--ds-base-font-size-weight);\n line-height: var(--ds-base-font-line-height--comfortable);\n color: var(--ds-base-font-color--link);\n text-decoration: underline;\n cursor: pointer;\n display: inline-block;\n color: var(--ds-base-font-color--dimmed);\n filter: brightness(1.4);\n}\n\n/*Alerts*/\n.gxg-alert-error {\n font-family: var(--ds-base-font-family-primary);\n font-size: var(--ds-base-font-size);\n color: var(--ds-base-font-size-color);\n font-weight: var(--ds-base-font-size-weight);\n line-height: var(--ds-base-font-line-height--comfortable);\n color: var(--ds-base-font-color--error);\n display: inline-block;\n}\n\n.gxg-alert-warning {\n font-family: var(--ds-base-font-family-primary);\n font-size: var(--ds-base-font-size);\n color: var(--ds-base-font-size-color);\n font-weight: var(--ds-base-font-size-weight);\n line-height: var(--ds-base-font-line-height--comfortable);\n color: var(--ds-base-font-color--warning);\n display: inline-block;\n}\n\n.gxg-alert-success {\n font-family: var(--ds-base-font-family-primary);\n font-size: var(--ds-base-font-size);\n color: var(--ds-base-font-size-color);\n font-weight: var(--ds-base-font-size-weight);\n line-height: var(--ds-base-font-line-height--comfortable);\n color: var(--ds-base-font-color--success);\n display: inline-block;\n}\n\n/*Tab*/\n.gxg-tab--disabled {\n color: var(--color-primary-disabled);\n pointer-events: none;\n}\n.gxg-tab--disabled[disabled] {\n color: var(--color-primary-disabled);\n pointer-events: none;\n}\n\n/*Label*/\n.gxg-label {\n font-family: var(--ds-base-font-family-primary);\n font-weight: var(--gxg-label-font-weight);\n font-size: var(--gxg-label-font-size);\n color: var(--gxg-label-color);\n text-align: center;\n line-height: 1.455em;\n display: flex;\n align-items: center;\n}\n.gxg-label:hover {\n color: var(--color-primary-hover);\n}\n.gxg-label:focus {\n color: var(--color-primary-active);\n}\n.gxg-label:active {\n color: var(--color-primary-active);\n}\n.gxg-label[disabled] {\n color: var(--color-primary-disabled);\n}\n\n.gxg-label--negative {\n color: var(--color-on-primary);\n}\n.gxg-label--negative[disabled] {\n color: var(--color-on-disabled);\n}\n\n/*****************************************************\nGXG-BUTTON and GXG-BUTTON-GROUP COMMON STYLES\n*****************************************************/\n/*****************************************************\nFORM ELEMENTS\n*****************************************************/\n.gxg-scrollbar {\n /* Track */\n /* Handle */\n /* Handle on hover */\n}\n.gxg-scrollbar::-webkit-scrollbar {\n width: var(--gxg-scrollbar-width);\n height: var(--gxg-scrollbar-width);\n}\n.gxg-scrollbar::-webkit-scrollbar-track {\n background-color: var(--gxg-scrollbar-track-background);\n border-radius: var(--gxg-scrollbar-track-border-radius);\n}\n.gxg-scrollbar::-webkit-scrollbar-thumb {\n background-color: var(--gxg-scrollbar-track-thumb-background);\n border-radius: var(--gxg-scrollbar-track-thumb-radius);\n}\n.gxg-scrollbar::-webkit-scrollbar-thumb:hover {\n background-color: var(--gxg-scrollbar-track-thumb-hover-background);\n}\n.gxg-scrollbar::-webkit-scrollbar-corner {\n background: rgba(0, 0, 0, 0);\n}\n\n/*--- Elevation ---*/\n:host {\n display: block;\n background-color: var(--gxg-card_background-color);\n box-shadow: var(--gxg-card_box-shadow);\n border-radius: var(--gxg-card_border-radius);\n border-style: solid;\n border-width: 1px;\n border-color: transparent;\n font-family: var(--ds-base-font-family-primary);\n font-size: var(--ds-base-font-size);\n color: var(--ds-base-font-size-color);\n font-weight: var(--ds-base-font-size-weight);\n line-height: var(--ds-base-font-line-height--comfortable);\n}\n\n:host([elevation=xs]) {\n box-shadow: var(--gxg-card_box-shadow);\n}\n\n:host([elevation=m]) {\n box-shadow: var(--gxg-card_box-shadow);\n}\n\n:host([padding=\"0\"]) {\n padding: 0;\n}\n\n:host([padding=xs]) {\n padding: var(--gxg-card_padding-xs);\n}\n\n:host([padding=s]) {\n padding: var(--gxg-card_padding-s);\n}\n\n:host([padding=m]) {\n padding: var(--gxg-card_padding-m);\n}\n\n:host([padding=l]) {\n padding: var(--gxg-card_padding-l);\n}\n\n:host([padding=xl]) {\n padding: var(--gxg-card_padding-xl);\n}\n\n:host([padding=xxl]) {\n padding: var(--gxg-card_padding-xxl);\n}\n\n:host([padding=xxxl]) {\n padding: var(--gxg-card_padding-xxxl);\n}\n\n:host([background=white]) {\n background: var(--gxg-card_background-white);\n}\n\n:host([background=gray-01]) {\n background: var(--gxg-card_background-gray);\n}\n\n.content {\n /* Track */\n /* Handle */\n /* Handle on hover */\n overflow: auto;\n height: 100%;\n}\n.content::-webkit-scrollbar {\n width: var(--gxg-scrollbar-width);\n height: var(--gxg-scrollbar-width);\n}\n.content::-webkit-scrollbar-track {\n background-color: var(--gxg-scrollbar-track-background);\n border-radius: var(--gxg-scrollbar-track-border-radius);\n}\n.content::-webkit-scrollbar-thumb {\n background-color: var(--gxg-scrollbar-track-thumb-background);\n border-radius: var(--gxg-scrollbar-track-thumb-radius);\n}\n.content::-webkit-scrollbar-thumb:hover {\n background-color: var(--gxg-scrollbar-track-thumb-hover-background);\n}\n.content::-webkit-scrollbar-corner {\n background: rgba(0, 0, 0, 0);\n}\n\n/*No Shadow*/\n:host(.card--no-shadow) {\n box-shadow: none;\n}\n\n/*Title*/\n:host(.card--title) .wrapper {\n display: flex;\n flex-direction: column;\n height: 100%;\n grid-template-rows: auto 1fr;\n}\n\n:host(.card) {\n background-color: var(--gxg-card_background-color);\n}\n:host(.card) .card__header {\n box-sizing: border-box;\n display: flex;\n align-items: center;\n justify-content: space-between;\n margin: var(--gxg-card-header_margin);\n padding-block-end: var(--gxg-card-header_padding-block-end);\n border-block-end: var(--gxg-card-header_border-block-end);\n gap: var(--gxg-card-header_gap);\n}\n:host(.card) .card__header--left {\n display: flex;\n align-items: center;\n gap: var(--gxg-card-header-left_gap);\n width: var(--gxg-card-header-left_width);\n}\n:host(.card) .card__header--left .card-title-wrapper {\n width: 100%;\n white-space: nowrap;\n overflow: hidden;\n}\n:host(.card) .card__header--left-full-width {\n width: 100% !important;\n}\n:host(.card) .card__header--left-full-width .card-title-wrapper {\n white-space: unset;\n}\n:host(.card) .card__header--right {\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: end;\n gap: var(--gxg-card-header-right_gap);\n font-size: var(--font-size-xl);\n width: var(--gxg-card-header-right_width);\n overflow: hidden;\n white-space: nowrap;\n}\n:host(.card) .card__header .subtitle-wrapper {\n overflow: hidden;\n text-overflow: ellipsis;\n color: var(--gxg-card-subtitle_color);\n padding-inline-end: var(--gxg-card-subtitle-wrapper_padding-inline-end);\n /*prevents text cut text if italic, due to ellipsis*/\n}\n:host(.card) .card__header .subtitle-wrapper a {\n color: var(--gxg-card-subtitle-wrapper_link-color);\n}\n:host(.card) .card__header .subtitle {\n white-space: nowrap;\n color: var(--gxg-card-subtitle-wrapper_color);\n}\n:host(.card) .content {\n padding: var(--gxg-card-content_padding);\n font-size: var(--gxg-card-content_font-size);\n line-height: var(--gxg-card-content_line-height);\n color: var(--gxg-card-content_color);\n}\n\n/*--- Default ---*/\n:host(.card--default) {\n background: var(--color-background);\n}\n:host(.card--default) .content {\n padding: 0;\n}\n\n/*--- Section ---*/\n:host(.card--section) {\n font-size: var(--gxg-card-section_font-size);\n border-radius: var(--gxg-card-section_border-radius);\n padding: var(--gxg-card-section_padding);\n background-color: var(--mer-elevation__background-color--01);\n border: var(--mer-elevation__border-01);\n box-shadow: var(--mer-elevation__box-shadow--01);\n}\n:host(.card--section) .card__title {\n font-weight: var(--gxg-card-section-title_font-weight);\n font-size: var(--gxg-card-section-title_font-size);\n}\n\n/*--- Article ---*/\n:host(.card--article) {\n font-size: var(--gxg-card-article_font-size);\n border-radius: var(--gxg-card-article_border-radius);\n padding: var(--gxg-card-article_padding);\n background-color: var(--mer-elevation__background-color--02);\n border: var(--mer-elevation__border-02);\n box-shadow: var(--mer-elevation__box-shadow--02);\n border: var(--gxg-card-article_border);\n}\n:host(.card--article) .card__header .card__title {\n margin: var(--gxg-card-article-title_margin);\n color: var(--gxg-card-article-title_color);\n overflow: hidden;\n text-overflow: ellipsis;\n font-weight: var(--gxg-card-article-title_font-weight);\n font-size: var(--gxg-card-article-title_font-size);\n}\n:host(.card--article) .card__header .subtitle-wrapper {\n color: var(--gxg-card-article-subtitle-wrapper_color);\n font-style: var(--gxg-card-article-subtitle-wrapper_font-style);\n}\n:host(.card--article) .content {\n font-style: var(--gxg-card-article-subtitle-content_font-style);\n color: var(--gxg-card-article-content_color);\n line-height: var(--gxg-card-article-subtitle-content_line-height);\n}\n\n/*semibold*/\n:host(.card--article.title-semibold) .card__header .card__title {\n font-weight: var(--gxg-card-article-title-semibold_font-weight);\n}\n\n/*--- Mini ---*/\n:host(.card--mini) {\n font-size: var(--gxg-card-mini_font-size);\n border-radius: var(--gxg-card-mini_border-radius);\n padding: var(--gxg-card-mini_padding);\n background-color: var(--mer-elevation__background-color--02);\n border: var(--mer-elevation__border-02);\n box-shadow: var(--mer-elevation__box-shadow--02);\n border: var(--gxg-card-mini_border);\n}\n:host(.card--mini) .card__header {\n margin: var(--gxg-card-mini-header_margin);\n padding-block-end: var(--gxg-card-mini-header_padding-block-end);\n border-bottom: var(--gxg-card-mini-header_border-bottom);\n}\n:host(.card--mini) .card__header .card__header--left {\n width: var(--gxg-card-mini-header-left_width);\n gap: var(--gxg-card-mini-header-left_gap);\n}\n:host(.card--mini) .card__header .card__title {\n margin: var(--gxg-card-mini-title_margin);\n overflow: hidden;\n text-overflow: ellipsis;\n font-weight: var(--gxg-card-mini-title_font-weight);\n font-size: var(--gxg-card-mini-title_font-size);\n color: var(--gxg-card-mini-title_color);\n}\n:host(.card--mini) .content {\n font-style: var(--gxg-card-mini-content_font-style);\n font-size: var(--gxg-card-mini_font-size);\n padding: var(--gxg-card-mini-content_padding);\n color: var(--gxg-card-mini-content_color);\n}\n\n:host(.card--no-content) .card__header {\n border-bottom: 0;\n}\n\n/*actionable*/\n:host(.card--actionable:hover) {\n filter: brightness(var(--gxg-card-actionable-brightness--hover));\n}\n:host(.card--actionable:hover) .wrapper,\n:host(.card--actionable:hover) .card__header,\n:host(.card--actionable:hover) .content {\n cursor: pointer;\n}\n\n/*no header border*/\n:host(.no-header-border) .card__header {\n padding-bottom: 0;\n border-bottom: 0;\n}\n\n/*noBorder*/\n:host(.card--no-border) {\n border: none !important;\n}\n\n/*hiChar*/\n.hiChar {\n color: var(--gxg-hi-char-color);\n font-weight: 600;\n}","import { h, Host } from \"@stencil/core\";\nimport state from \"../store\";\nimport { hiChar } from \"../../common/hiChar\";\nexport class GxgCard {\n constructor() {\n this.elevation = \"xs\";\n this.background = \"white\";\n this.padding = \"xs\";\n this.minHeight = \"auto\";\n this.height = \"auto\";\n this.maxWidth = \"100%\";\n this.noShadow = false;\n this.noBorder = false;\n this.hiChar = false;\n this.filterValue = undefined;\n this.noPaddingTop = false;\n this.cardTitle = undefined;\n this.noHeaderBorder = false;\n this.titleSemibold = false;\n this.cardSubtitle = undefined;\n this.subtitleLink = undefined;\n this.subtitleIcon = undefined;\n this.cardType = \"section\";\n this.icon = undefined;\n this.iconColor = \"auto\";\n this.subtitleColor = \"auto\";\n this.editableTitle = false;\n this.actionable = false;\n }\n el;\n /*--- Mercury Only Tokens ---*/\n titleType = \"h2\";\n hasSlot = false;\n hasHeaderSlot = false;\n componentWillLoad() {\n if (this.cardType === \"article\") {\n this.titleType = \"h2\";\n }\n else if (this.cardType === \"mini\") {\n this.titleType = \"h4\";\n }\n const hasSlot = this.el.querySelector(\"*\");\n if (hasSlot) {\n this.hasSlot = true;\n }\n const headerSlot = this.el.querySelector(\"[slot='header']\");\n if (headerSlot) {\n this.hasHeaderSlot = true;\n }\n }\n renderCardSubtitle = () => {\n if (this.cardSubtitle && this.subtitleLink) {\n return (h(\"a\", { class: \"subtitle\", href: this.subtitleLink, target: \"_blank\" }, this.cardSubtitle));\n }\n else if (this.cardSubtitle && !this.subtitleLink) {\n {\n return this.hiChar\n ? hiChar(this.cardSubtitle, this.filterValue)\n : this.cardSubtitle;\n }\n }\n };\n render() {\n return (h(Host, { role: \"article\", class: {\n card: true,\n mercury: state.mercury,\n \"card--no-content\": !this.hasSlot,\n \"card--section\": this.cardType === \"section\",\n \"card--article\": this.cardType === \"article\",\n \"card--mini\": this.cardType === \"mini\",\n \"card--title\": this.cardTitle !== undefined,\n \"card--actionable\": this.actionable &&\n (this.cardType === \"article\" || this.cardType === \"mini\"),\n \"title-semibold\": this.titleSemibold,\n \"card--no-shadow\": this.noShadow,\n \"card--no-border\": this.noBorder,\n \"no-header-border\": this.noHeaderBorder\n }, style: {\n maxWidth: this.maxWidth,\n minHeight: this.minHeight,\n height: this.height\n } }, h(\"div\", { role: this.actionable ? \"button\" : \"none\", class: {\n wrapper: true,\n \"wrapper--header\": this.cardTitle !== undefined\n } }, this.cardTitle ? (h(\"header\", { class: \"card__header\" }, h(\"div\", { class: {\n \"card__header--left\": true,\n \"card__header--left-full-width\": !this.cardSubtitle\n } }, this.icon ? (h(\"gxg-icon\", { type: this.icon, color: this.iconColor })) : null, h(\"div\", { class: \"card-title-wrapper\" }, this.cardType === \"section\" ? (h(\"gxg-title-editable\", { class: \"card__title\", titleType: this.titleType, value: this.cardTitle, disableEdition: !this.editableTitle })) : (h(\"h2\", { class: \"card__title\" }, this.hiChar\n ? hiChar(this.cardTitle, this.filterValue)\n : this.cardTitle)))), this.cardSubtitle &&\n this.cardType !== \"mini\" &&\n !this.hasHeaderSlot ? (h(\"div\", { class: \"card__header--right\" }, h(\"div\", { class: \"subtitle-wrapper\" }, this.renderCardSubtitle()), this.subtitleIcon ? (h(\"gxg-icon\", { type: this.subtitleIcon, color: this.subtitleColor })) : null)) : null, this.hasHeaderSlot ? (h(\"div\", { class: \"card__header--right\" }, h(\"slot\", { name: \"header\" }))) : null)) : null, this.hasSlot ? (h(\"div\", { class: \"content\" }, h(\"slot\", null))) : null)));\n }\n static get is() { return \"gxg-card\"; }\n static get encapsulation() { return \"shadow\"; }\n static get originalStyleUrls() {\n return {\n \"$\": [\"card.scss\"]\n };\n }\n static get styleUrls() {\n return {\n \"$\": [\"card.css\"]\n };\n }\n static get properties() {\n return {\n \"elevation\": {\n \"type\": \"string\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"elevation\",\n \"resolved\": \"\\\"m\\\" | \\\"xs\\\"\",\n \"references\": {\n \"elevation\": {\n \"location\": \"local\",\n \"path\": \"/home/circleci/repo/src/components/card/card.tsx\",\n \"id\": \"src/components/card/card.tsx::elevation\"\n }\n }\n },\n \"required\": false,\n \"optional\": false,\n \"docs\": {\n \"tags\": [],\n \"text\": \"The card box-shadow\"\n },\n \"attribute\": \"elevation\",\n \"reflect\": true,\n \"defaultValue\": \"\\\"xs\\\"\"\n },\n \"background\": {\n \"type\": \"string\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"background\",\n \"resolved\": \"\\\"gray-01\\\" | \\\"white\\\"\",\n \"references\": {\n \"background\": {\n \"location\": \"local\",\n \"path\": \"/home/circleci/repo/src/components/card/card.tsx\",\n \"id\": \"src/components/card/card.tsx::background\"\n }\n }\n },\n \"required\": false,\n \"optional\": false,\n \"docs\": {\n \"tags\": [],\n \"text\": \"The background color\"\n },\n \"attribute\": \"background\",\n \"reflect\": true,\n \"defaultValue\": \"\\\"white\\\"\"\n },\n \"padding\": {\n \"type\": \"string\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"padding\",\n \"resolved\": \"\\\"0\\\" | \\\"l\\\" | \\\"m\\\" | \\\"s\\\" | \\\"xl\\\" | \\\"xs\\\" | \\\"xxl\\\" | \\\"xxxl\\\"\",\n \"references\": {\n \"padding\": {\n \"location\": \"local\",\n \"path\": \"/home/circleci/repo/src/components/card/card.tsx\",\n \"id\": \"src/components/card/card.tsx::padding\"\n }\n }\n },\n \"required\": false,\n \"optional\": false,\n \"docs\": {\n \"tags\": [],\n \"text\": \"The card padding\"\n },\n \"attribute\": \"padding\",\n \"reflect\": true,\n \"defaultValue\": \"\\\"xs\\\"\"\n },\n \"minHeight\": {\n \"type\": \"string\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"string\",\n \"resolved\": \"string\",\n \"references\": {}\n },\n \"required\": false,\n \"optional\": false,\n \"docs\": {\n \"tags\": [],\n \"text\": \"The component min. height\"\n },\n \"attribute\": \"min-height\",\n \"reflect\": false,\n \"defaultValue\": \"\\\"auto\\\"\"\n },\n \"height\": {\n \"type\": \"string\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"string\",\n \"resolved\": \"string\",\n \"references\": {}\n },\n \"required\": false,\n \"optional\": false,\n \"docs\": {\n \"tags\": [],\n \"text\": \"The component height\"\n },\n \"attribute\": \"height\",\n \"reflect\": false,\n \"defaultValue\": \"\\\"auto\\\"\"\n },\n \"maxWidth\": {\n \"type\": \"string\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"string\",\n \"resolved\": \"string\",\n \"references\": {}\n },\n \"required\": false,\n \"optional\": false,\n \"docs\": {\n \"tags\": [],\n \"text\": \"The component max. width\"\n },\n \"attribute\": \"max-width\",\n \"reflect\": false,\n \"defaultValue\": \"\\\"100%\\\"\"\n },\n \"noShadow\": {\n \"type\": \"boolean\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"boolean\",\n \"resolved\": \"boolean\",\n \"references\": {}\n },\n \"required\": false,\n \"optional\": false,\n \"docs\": {\n \"tags\": [],\n \"text\": \"Disables box-shadow\"\n },\n \"attribute\": \"no-shadow\",\n \"reflect\": false,\n \"defaultValue\": \"false\"\n },\n \"noBorder\": {\n \"type\": \"boolean\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"boolean\",\n \"resolved\": \"boolean\",\n \"references\": {}\n },\n \"required\": false,\n \"optional\": false,\n \"docs\": {\n \"tags\": [],\n \"text\": \"Removes border\"\n },\n \"attribute\": \"no-border\",\n \"reflect\": false,\n \"defaultValue\": \"false\"\n },\n \"hiChar\": {\n \"type\": \"boolean\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"boolean\",\n \"resolved\": \"boolean\",\n \"references\": {}\n },\n \"required\": false,\n \"optional\": false,\n \"docs\": {\n \"tags\": [],\n \"text\": \"This allows to highlight any character on the card title, or subtitle.\"\n },\n \"attribute\": \"hi-char\",\n \"reflect\": false,\n \"defaultValue\": \"false\"\n },\n \"filterValue\": {\n \"type\": \"string\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"string\",\n \"resolved\": \"string\",\n \"references\": {}\n },\n \"required\": false,\n \"optional\": false,\n \"docs\": {\n \"tags\": [],\n \"text\": \"This is the filter value needed for hiChar.\"\n },\n \"attribute\": \"filter-value\",\n \"reflect\": false\n },\n \"noPaddingTop\": {\n \"type\": \"boolean\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"boolean\",\n \"resolved\": \"boolean\",\n \"references\": {}\n },\n \"required\": false,\n \"optional\": false,\n \"docs\": {\n \"tags\": [],\n \"text\": \"Remove padding from the top (applies only for the \\\"section\\\" card type)\"\n },\n \"attribute\": \"no-padding-top\",\n \"reflect\": true,\n \"defaultValue\": \"false\"\n },\n \"cardTitle\": {\n \"type\": \"string\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"string\",\n \"resolved\": \"string\",\n \"references\": {}\n },\n \"required\": false,\n \"optional\": false,\n \"docs\": {\n \"tags\": [],\n \"text\": \"An optional title\"\n },\n \"attribute\": \"card-title\",\n \"reflect\": false\n },\n \"noHeaderBorder\": {\n \"type\": \"boolean\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"boolean\",\n \"resolved\": \"boolean\",\n \"references\": {}\n },\n \"required\": false,\n \"optional\": false,\n \"docs\": {\n \"tags\": [],\n \"text\": \"Removes the header border\"\n },\n \"attribute\": \"no-header-border\",\n \"reflect\": false,\n \"defaultValue\": \"false\"\n },\n \"titleSemibold\": {\n \"type\": \"boolean\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"boolean\",\n \"resolved\": \"boolean\",\n \"references\": {}\n },\n \"required\": false,\n \"optional\": false,\n \"docs\": {\n \"tags\": [],\n \"text\": \"Card title semibold\"\n },\n \"attribute\": \"title-semibold\",\n \"reflect\": false,\n \"defaultValue\": \"false\"\n },\n \"cardSubtitle\": {\n \"type\": \"string\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"string\",\n \"resolved\": \"string\",\n \"references\": {}\n },\n \"required\": false,\n \"optional\": false,\n \"docs\": {\n \"tags\": [],\n \"text\": \"An optional subtitle\"\n },\n \"attribute\": \"card-subtitle\",\n \"reflect\": false\n },\n \"subtitleLink\": {\n \"type\": \"string\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"string\",\n \"resolved\": \"string\",\n \"references\": {}\n },\n \"required\": false,\n \"optional\": false,\n \"docs\": {\n \"tags\": [],\n \"text\": \"An optional subtitle link\"\n },\n \"attribute\": \"subtitle-link\",\n \"reflect\": false\n },\n \"subtitleIcon\": {\n \"type\": \"string\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"string\",\n \"resolved\": \"string\",\n \"references\": {}\n },\n \"required\": false,\n \"optional\": false,\n \"docs\": {\n \"tags\": [],\n \"text\": \"An optional subtitle icon\"\n },\n \"attribute\": \"subtitle-icon\",\n \"reflect\": false\n },\n \"cardType\": {\n \"type\": \"string\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"CardType\",\n \"resolved\": \"\\\"article\\\" | \\\"mini\\\" | \\\"section\\\"\",\n \"references\": {\n \"CardType\": {\n \"location\": \"local\",\n \"path\": \"/home/circleci/repo/src/components/card/card.tsx\",\n \"id\": \"src/components/card/card.tsx::CardType\"\n }\n }\n },\n \"required\": false,\n \"optional\": false,\n \"docs\": {\n \"tags\": [],\n \"text\": \"The card type (only for mercury)\"\n },\n \"attribute\": \"card-type\",\n \"reflect\": false,\n \"defaultValue\": \"\\\"section\\\"\"\n },\n \"icon\": {\n \"type\": \"string\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"string\",\n \"resolved\": \"string\",\n \"references\": {}\n },\n \"required\": false,\n \"optional\": false,\n \"docs\": {\n \"tags\": [],\n \"text\": \"The card type (only for mercury)\"\n },\n \"attribute\": \"icon\",\n \"reflect\": false\n },\n \"iconColor\": {\n \"type\": \"string\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"Color\",\n \"resolved\": \"\\\"alwaysblack\\\" | \\\"auto\\\" | \\\"disabled\\\" | \\\"error\\\" | \\\"indeterminate\\\" | \\\"mercury\\\" | \\\"mercury-neutral\\\" | \\\"mercury-on-primary\\\" | \\\"mercury-primary\\\" | \\\"mercury-text-on-message\\\" | \\\"negative\\\" | \\\"onbackground\\\" | \\\"ondisabled\\\" | \\\"primary-active\\\" | \\\"primary-enabled\\\" | \\\"primary-hover\\\" | \\\"success\\\" | \\\"warning\\\"\",\n \"references\": {\n \"Color\": {\n \"location\": \"import\",\n \"path\": \"../icon/icon\",\n \"id\": \"src/components/icon/icon.tsx::Color\"\n }\n }\n },\n \"required\": false,\n \"optional\": false,\n \"docs\": {\n \"tags\": [],\n \"text\": \"The icon color\"\n },\n \"attribute\": \"icon-color\",\n \"reflect\": false,\n \"defaultValue\": \"\\\"auto\\\"\"\n },\n \"subtitleColor\": {\n \"type\": \"string\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"Color\",\n \"resolved\": \"\\\"alwaysblack\\\" | \\\"auto\\\" | \\\"disabled\\\" | \\\"error\\\" | \\\"indeterminate\\\" | \\\"mercury\\\" | \\\"mercury-neutral\\\" | \\\"mercury-on-primary\\\" | \\\"mercury-primary\\\" | \\\"mercury-text-on-message\\\" | \\\"negative\\\" | \\\"onbackground\\\" | \\\"ondisabled\\\" | \\\"primary-active\\\" | \\\"primary-enabled\\\" | \\\"primary-hover\\\" | \\\"success\\\" | \\\"warning\\\"\",\n \"references\": {\n \"Color\": {\n \"location\": \"import\",\n \"path\": \"../icon/icon\",\n \"id\": \"src/components/icon/icon.tsx::Color\"\n }\n }\n },\n \"required\": false,\n \"optional\": false,\n \"docs\": {\n \"tags\": [],\n \"text\": \"The icon color\"\n },\n \"attribute\": \"subtitle-color\",\n \"reflect\": false,\n \"defaultValue\": \"\\\"auto\\\"\"\n },\n \"editableTitle\": {\n \"type\": \"boolean\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"boolean\",\n \"resolved\": \"boolean\",\n \"references\": {}\n },\n \"required\": false,\n \"optional\": false,\n \"docs\": {\n \"tags\": [],\n \"text\": \"It makes the title editable (only for mercury)\"\n },\n \"attribute\": \"editable-title\",\n \"reflect\": false,\n \"defaultValue\": \"false\"\n },\n \"actionable\": {\n \"type\": \"boolean\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"boolean\",\n \"resolved\": \"boolean\",\n \"references\": {}\n },\n \"required\": false,\n \"optional\": false,\n \"docs\": {\n \"tags\": [],\n \"text\": \"It applies a different style on hover. Useful when the card is actionable (has an action attached to the click event).\"\n },\n \"attribute\": \"actionable\",\n \"reflect\": false,\n \"defaultValue\": \"false\"\n }\n };\n }\n static get elementRef() { return \"el\"; }\n}\n//# sourceMappingURL=card.js.map\n"],"version":3}
|