@genexus/genexus-ide-ui 1.0.34 → 1.0.35
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-current-user-info.cjs.entry.js +7 -7
- package/dist/cjs/gx-ide-current-user-info.cjs.entry.js.map +1 -1
- package/dist/cjs/gx-ide-sign-in-team.cjs.entry.js +8 -7
- package/dist/cjs/gx-ide-sign-in-team.cjs.entry.js.map +1 -1
- package/dist/cjs/gx-ide-welcome-page.cjs.entry.js +14 -9
- package/dist/cjs/gx-ide-welcome-page.cjs.entry.js.map +1 -1
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/collection/components/current-user-info/current-user-info.css +7 -5
- package/dist/collection/components/current-user-info/current-user-info.js +6 -6
- package/dist/collection/components/current-user-info/current-user-info.js.map +1 -1
- package/dist/collection/components/current-user-info/gx-ide-assets/current-user-info/langs/current-user-info.lang.en.json +1 -1
- package/dist/collection/components/current-user-info/gx-ide-assets/current-user-info/langs/current-user-info.lang.ja.json +1 -1
- package/dist/collection/components/current-user-info/gx-ide-assets/current-user-info/langs/current-user-info.lang.zh.json +1 -1
- package/dist/collection/components/sign-in-team/sign-in-team.js +9 -6
- package/dist/collection/components/sign-in-team/sign-in-team.js.map +1 -1
- package/dist/collection/components/welcome-page/welcome-page.css +1 -1
- package/dist/collection/components/welcome-page/welcome-page.js +13 -8
- package/dist/collection/components/welcome-page/welcome-page.js.map +1 -1
- package/dist/components/gx-ide-current-user-info.js +7 -7
- package/dist/components/gx-ide-current-user-info.js.map +1 -1
- package/dist/components/gx-ide-sign-in-team.js +10 -8
- package/dist/components/gx-ide-sign-in-team.js.map +1 -1
- package/dist/components/gx-ide-welcome-page.js +14 -9
- package/dist/components/gx-ide-welcome-page.js.map +1 -1
- package/dist/esm/genexus-ide-ui.js +1 -1
- package/dist/esm/gx-ide-current-user-info.entry.js +7 -7
- package/dist/esm/gx-ide-current-user-info.entry.js.map +1 -1
- package/dist/esm/gx-ide-sign-in-team.entry.js +8 -7
- package/dist/esm/gx-ide-sign-in-team.entry.js.map +1 -1
- package/dist/esm/gx-ide-welcome-page.entry.js +14 -9
- package/dist/esm/gx-ide-welcome-page.entry.js.map +1 -1
- 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/current-user-info/langs/current-user-info.lang.en.json +1 -1
- package/dist/genexus-ide-ui/gx-ide-assets/current-user-info/langs/current-user-info.lang.ja.json +1 -1
- package/dist/genexus-ide-ui/gx-ide-assets/current-user-info/langs/current-user-info.lang.zh.json +1 -1
- package/dist/genexus-ide-ui/{p-fe063c9e.entry.js → p-0b33d2f9.entry.js} +42 -41
- package/dist/genexus-ide-ui/p-0b33d2f9.entry.js.map +1 -0
- package/dist/genexus-ide-ui/{p-b42dfccc.entry.js → p-3d6140e6.entry.js} +25 -22
- package/dist/genexus-ide-ui/p-3d6140e6.entry.js.map +1 -0
- package/dist/genexus-ide-ui/{p-edd6ebef.entry.js → p-e36d53f0.entry.js} +15 -15
- package/dist/genexus-ide-ui/p-e36d53f0.entry.js.map +1 -0
- package/dist/types/components/sign-in-team/sign-in-team.d.ts +1 -0
- package/package.json +1 -1
- package/dist/genexus-ide-ui/p-b42dfccc.entry.js.map +0 -1
- package/dist/genexus-ide-ui/p-edd6ebef.entry.js.map +0 -1
- package/dist/genexus-ide-ui/p-fe063c9e.entry.js.map +0 -1
|
@@ -1,54 +1,53 @@
|
|
|
1
|
-
import { a as
|
|
1
|
+
import { a as n, r as e, h as i, H as t, g as s } from "./p-49712340.js";
|
|
2
2
|
|
|
3
3
|
import { L as a } from "./p-311eedf3.js";
|
|
4
4
|
|
|
5
|
-
const mapTeamsToComboBoxItemModel =
|
|
6
|
-
if (!
|
|
5
|
+
const mapTeamsToComboBoxItemModel = n => {
|
|
6
|
+
if (!n) {
|
|
7
7
|
return [];
|
|
8
8
|
}
|
|
9
|
-
return
|
|
10
|
-
value:
|
|
11
|
-
caption:
|
|
9
|
+
return n.map((n => ({
|
|
10
|
+
value: n.id,
|
|
11
|
+
caption: n.name
|
|
12
12
|
})));
|
|
13
13
|
};
|
|
14
14
|
|
|
15
15
|
const r = ":host {\n display: grid;\n container-type: inline-size;\n container-name: host-container;\n block-size: 100%;\n inline-size: 100%;\n align-items: center;\n justify-content: center;\n padding: var(--mer-spacing--xl);\n}\n\n.slide {\n display: grid;\n grid-template-columns: 1fr 1fr;\n block-size: 100%;\n max-block-size: 700px;\n max-inline-size: 1100px;\n background-color: var(--mer-surface__elevation--01);\n border-radius: var(--mer-spacing--md);\n overflow: hidden;\n}\n.slide__illustration {\n overflow: hidden;\n object-fit: cover;\n object-position: left;\n block-size: 100%;\n inline-size: 100%;\n}\n.slide__main {\n display: grid;\n block-size: 100%;\n inline-size: 100%;\n padding: var(--mer-spacing--3xl);\n transform: translateY(var(--mer-spacing--2xs));\n transition: var(--switch-step-transtion-time) all;\n opacity: 0;\n}\n.slide__main--visible {\n transform: translateY(0);\n opacity: 1;\n}\n.slide__main-container {\n display: grid;\n place-self: center;\n gap: var(--mer-spacing--lg);\n max-inline-size: 480px;\n}\n.slide__main-header {\n display: grid;\n gap: var(--mer-spacing--lg);\n}\n.slide__main-title {\n display: flex;\n flex-direction: column;\n font-size: var(--mer-font__size--xl);\n font-weight: var(--mer-font__weight--semi-bold);\n letter-spacing: 0.02em;\n color: var(--mer-text__on-surface);\n}\n.slide__main-description {\n display: grid;\n gap: var(--mer-spacing--2xl);\n font-size: var(--mer-font__size--sm);\n font-weight: var(--mer-font__weight--light);\n line-height: var(--mer-line-height--spaced);\n color: var(--mer-text__complementary);\n}\n\n.terms-conditions {\n text-decoration: underline;\n}\n\n.teams-list {\n inline-size: 100%;\n max-inline-size: 400px;\n}\n\n.main-btn {\n inline-size: 100%;\n max-inline-size: 124px;\n}\n\n@container host-container (max-width: 768px) {\n .slide {\n grid-template-columns: 1fr 2fr;\n }\n}\n@container host-container (max-width: 640px) {\n .slide {\n grid-template-columns: 1fr 5fr;\n }\n}";
|
|
16
16
|
|
|
17
|
-
var o = undefined && undefined.__classPrivateFieldGet || function(
|
|
17
|
+
var o = undefined && undefined.__classPrivateFieldGet || function(n, e, i, t) {
|
|
18
18
|
if (i === "a" && !t) throw new TypeError("Private accessor was defined without a getter");
|
|
19
|
-
if (typeof
|
|
20
|
-
return i === "m" ? t : i === "a" ? t.call(
|
|
19
|
+
if (typeof e === "function" ? n !== e || !t : !e.has(n)) throw new TypeError("Cannot read private member from an object whose class did not declare it");
|
|
20
|
+
return i === "m" ? t : i === "a" ? t.call(n) : t ? t.value : e.get(n);
|
|
21
21
|
};
|
|
22
22
|
|
|
23
|
-
var l = undefined && undefined.__classPrivateFieldSet || function(
|
|
23
|
+
var l = undefined && undefined.__classPrivateFieldSet || function(n, e, i, t, s) {
|
|
24
24
|
if (t === "m") throw new TypeError("Private method is not writable");
|
|
25
25
|
if (t === "a" && !s) throw new TypeError("Private accessor was defined without a setter");
|
|
26
|
-
if (typeof
|
|
27
|
-
return t === "a" ? s.call(
|
|
26
|
+
if (typeof e === "function" ? n !== e || !s : !e.has(n)) throw new TypeError("Cannot write private member to an object whose class did not declare it");
|
|
27
|
+
return t === "a" ? s.call(n, i) : s ? s.value = i : e.set(n, i), i;
|
|
28
28
|
};
|
|
29
29
|
|
|
30
|
-
var
|
|
30
|
+
var d, c, h, m, p, f;
|
|
31
31
|
|
|
32
|
-
const g =
|
|
32
|
+
const g = n(`./gx-ide-assets/welcome-page/images/copyrights-illustration.png`);
|
|
33
33
|
|
|
34
|
-
const u =
|
|
34
|
+
const u = n(`./gx-ide-assets/welcome-page/images/icon-next.svg`);
|
|
35
35
|
|
|
36
36
|
const _ = [ "resets/box-sizing", "utils/typography", "components/button", "components/combo-box" ];
|
|
37
37
|
|
|
38
38
|
const v = class {
|
|
39
|
-
constructor(
|
|
40
|
-
|
|
39
|
+
constructor(n) {
|
|
40
|
+
e(this, n);
|
|
41
41
|
/**
|
|
42
42
|
* The component hard-coded strings translations.
|
|
43
43
|
*/
|
|
44
44
|
// eslint-disable-next-line @stencil-community/own-props-must-be-private
|
|
45
|
-
|
|
45
|
+
d.set(this, void 0);
|
|
46
46
|
// Select User Team References :
|
|
47
|
-
|
|
47
|
+
c.set(this, []);
|
|
48
48
|
h.set(this, void 0);
|
|
49
49
|
m.set(this, 100);
|
|
50
50
|
p.set(this, (() => {
|
|
51
|
-
console.log("authStepCallback called");
|
|
52
51
|
if (this.authStep === "signIn") {
|
|
53
52
|
this.signInCallback();
|
|
54
53
|
} else if (this.authStep === "selectUserTeam") {
|
|
@@ -56,7 +55,6 @@ const v = class {
|
|
|
56
55
|
}
|
|
57
56
|
}));
|
|
58
57
|
f.set(this, (async () => {
|
|
59
|
-
console.log("continueHandler called");
|
|
60
58
|
await this.continueCallback(o(this, h, "f").value);
|
|
61
59
|
}));
|
|
62
60
|
this.authStepInternal = undefined;
|
|
@@ -67,27 +65,29 @@ const v = class {
|
|
|
67
65
|
this.teams = undefined;
|
|
68
66
|
this.termsCallback = undefined;
|
|
69
67
|
}
|
|
70
|
-
authStepChanged(
|
|
71
|
-
console.log("authStep changed");
|
|
68
|
+
authStepChanged(n) {
|
|
72
69
|
this.slideIsVisible = false;
|
|
73
70
|
// switch step
|
|
74
71
|
setTimeout((() => {
|
|
75
|
-
this.authStepInternal =
|
|
72
|
+
this.authStepInternal = n;
|
|
76
73
|
}), o(this, m, "f"));
|
|
77
74
|
// show slide
|
|
78
75
|
setTimeout((() => {
|
|
79
76
|
this.slideIsVisible = true;
|
|
80
77
|
}), o(this, m, "f") * 2);
|
|
81
78
|
}
|
|
79
|
+
teamsChanged(n) {
|
|
80
|
+
l(this, c, mapTeamsToComboBoxItemModel(n), "f");
|
|
81
|
+
}
|
|
82
82
|
async componentWillLoad() {
|
|
83
|
-
l(this,
|
|
84
|
-
this.authStepInternal = this.authStep;
|
|
85
|
-
l(this, d, mapTeamsToComboBoxItemModel(this.teams), "f");
|
|
83
|
+
l(this, d, await a.getComponentStrings(this.el), "f");
|
|
86
84
|
this.el.style.setProperty("--switch-step-transtion-time", o(this, m, "f").toString() + "ms");
|
|
85
|
+
// Initialize values
|
|
86
|
+
this.authStepInternal = this.authStep;
|
|
87
|
+
this.teamsChanged(this.teams);
|
|
87
88
|
}
|
|
88
89
|
render() {
|
|
89
|
-
var
|
|
90
|
-
console.log("userTeams comboBox model", o(this, d, "f"));
|
|
90
|
+
var n;
|
|
91
91
|
return i(t, null, i("ch-theme", {
|
|
92
92
|
model: _
|
|
93
93
|
}), i("section", {
|
|
@@ -111,34 +111,34 @@ const v = class {
|
|
|
111
111
|
}), i("h2", {
|
|
112
112
|
// Split the title into two spans for better styling
|
|
113
113
|
class: "slide__main-title"
|
|
114
|
-
}, i("span", null, o(this,
|
|
114
|
+
}, i("span", null, o(this, d, "f")[this.authStepInternal].titlePart1), i("span", null, o(this, d, "f")[this.authStepInternal].titlePart2))), this.authStepInternal === "signIn" ? i("div", {
|
|
115
115
|
class: "slide__main-description"
|
|
116
116
|
}, i("p", {
|
|
117
117
|
hidden: true
|
|
118
|
-
}, i("span", null, o(this,
|
|
118
|
+
}, i("span", null, o(this, d, "f").descriptionText)), i("span", null, o(this, d, "f").signIn.byContinuingText, i("a", {
|
|
119
119
|
class: "terms-conditions",
|
|
120
120
|
onClick: this.termsCallback
|
|
121
|
-
}, o(this,
|
|
121
|
+
}, o(this, d, "f").signIn.byContinuingCallBackText))) : [ i("div", {
|
|
122
122
|
class: "slide__select-team-description"
|
|
123
123
|
}, i("p", {
|
|
124
124
|
class: "text-body-highlighted-l"
|
|
125
|
-
}, o(this,
|
|
125
|
+
}, o(this, d, "f").selectUserTeam.infoMessage)), i("div", {
|
|
126
126
|
class: "field-group"
|
|
127
127
|
}, i("div", {
|
|
128
128
|
class: "field field-block"
|
|
129
129
|
}, i("label", {
|
|
130
130
|
htmlFor: "teams"
|
|
131
|
-
}, o(this,
|
|
131
|
+
}, o(this, d, "f").teams), i("ch-combo-box-render", {
|
|
132
132
|
id: "teams",
|
|
133
133
|
accessibleName: "Teams",
|
|
134
134
|
class: "combo-box teams-list",
|
|
135
|
-
model: o(this,
|
|
136
|
-
value: (
|
|
137
|
-
ref:
|
|
135
|
+
model: o(this, c, "f"),
|
|
136
|
+
value: (n = o(this, c, "f")[0]) === null || n === void 0 ? void 0 : n.value,
|
|
137
|
+
ref: n => l(this, h, n, "f")
|
|
138
138
|
}))) ], i("div", null, i("button", {
|
|
139
139
|
class: "button-primary main-btn",
|
|
140
140
|
onClick: o(this, p, "f")
|
|
141
|
-
}, o(this,
|
|
141
|
+
}, o(this, d, "f")[this.authStepInternal].buttonCaption))))));
|
|
142
142
|
}
|
|
143
143
|
static get assetsDirs() {
|
|
144
144
|
return [ "gx-ide-assets/sign-in-team" ];
|
|
@@ -148,15 +148,16 @@ const v = class {
|
|
|
148
148
|
}
|
|
149
149
|
static get watchers() {
|
|
150
150
|
return {
|
|
151
|
-
authStep: [ "authStepChanged" ]
|
|
151
|
+
authStep: [ "authStepChanged" ],
|
|
152
|
+
teams: [ "teamsChanged" ]
|
|
152
153
|
};
|
|
153
154
|
}
|
|
154
155
|
};
|
|
155
156
|
|
|
156
|
-
|
|
157
|
+
d = new WeakMap, c = new WeakMap, h = new WeakMap, m = new WeakMap, p = new WeakMap,
|
|
157
158
|
f = new WeakMap;
|
|
158
159
|
|
|
159
160
|
v.style = r;
|
|
160
161
|
|
|
161
162
|
export { v as gx_ide_sign_in_team };
|
|
162
|
-
//# sourceMappingURL=p-
|
|
163
|
+
//# sourceMappingURL=p-0b33d2f9.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["mapTeamsToComboBoxItemModel","teams","map","team","value","id","caption","name","signInTeamCss","COPYRIGHTS_ILLUSTRATION","getAssetPath","ICON_NEXT","CSS_BUNDLES","GxIdeUiSplash","_GxIdeUiSplash_componentLocale","set","this","_GxIdeUiSplash_userTeamsModel","_GxIdeUiSplash_chSelectTeamEl","_GxIdeUiSplash_switchStepTransitionTime","_GxIdeUiSplash_authStepCallback","authStep","signInCallback","__classPrivateFieldGet","_GxIdeUiSplash_continueHandler","call","async","continueCallback","authStepChanged","newAuthStep","slideIsVisible","setTimeout","authStepInternal","teamsChanged","newTeams","__classPrivateFieldSet","componentWillLoad","Locale","getComponentStrings","el","style","setProperty","toString","render","h","Host","model","class","src","alt","slide__main","titlePart1","titlePart2","hidden","descriptionText","signIn","byContinuingText","onClick","termsCallback","byContinuingCallBackText","selectUserTeam","infoMessage","htmlFor","accessibleName","_a","ref","buttonCaption"],"sources":["src/components/sign-in-team/helpers.ts","src/components/sign-in-team/sign-in-team.scss?tag=gx-ide-sign-in-team&encapsulation=shadow","src/components/sign-in-team/sign-in-team.tsx"],"sourcesContent":["import { ComboBoxItemModel } from \"@genexus/chameleon-controls-library/dist/types/components/combo-box/types\";\nimport { TeamData } from \"./sign-in-team\";\n\nexport const mapTeamsToComboBoxItemModel = (\n teams?: TeamData[]\n): ComboBoxItemModel[] | undefined => {\n if (!teams) {\n return [];\n }\n return teams.map(team => ({\n value: team.id,\n caption: team.name\n }));\n};\n",":host {\n display: grid;\n container-type: inline-size;\n container-name: host-container;\n block-size: 100%;\n inline-size: 100%;\n align-items: center;\n justify-content: center;\n padding: var(--mer-spacing--xl);\n}\n\n.slide {\n display: grid;\n grid-template-columns: 1fr 1fr;\n block-size: 100%;\n max-block-size: 700px;\n max-inline-size: 1100px;\n background-color: var(--mer-surface__elevation--01);\n border-radius: var(--mer-spacing--md);\n overflow: hidden;\n\n &__illustration {\n overflow: hidden;\n object-fit: cover;\n object-position: left;\n block-size: 100%;\n inline-size: 100%;\n }\n\n &__main {\n display: grid;\n block-size: 100%;\n inline-size: 100%;\n padding: var(--mer-spacing--3xl);\n transform: translateY(var(--mer-spacing--2xs));\n transition: var(--switch-step-transtion-time) all;\n opacity: 0;\n\n &--visible {\n transform: translateY(0);\n opacity: 1;\n }\n }\n\n &__main-container {\n display: grid;\n place-self: center;\n gap: var(--mer-spacing--lg);\n max-inline-size: 480px;\n }\n\n &__main-header {\n display: grid;\n gap: var(--mer-spacing--lg);\n }\n\n &__main-title {\n display: flex;\n flex-direction: column;\n font-size: var(--mer-font__size--xl);\n font-weight: var(--mer-font__weight--semi-bold);\n letter-spacing: 0.02em;\n color: var(--mer-text__on-surface);\n }\n\n &__main-description {\n display: grid;\n gap: var(--mer-spacing--2xl);\n font-size: var(--mer-font__size--sm);\n font-weight: var(--mer-font__weight--light);\n line-height: var(--mer-line-height--spaced);\n color: var(--mer-text__complementary);\n }\n}\n\n.terms-conditions {\n text-decoration: underline;\n}\n\n.teams-list {\n inline-size: 100%;\n max-inline-size: 400px;\n}\n\n.main-btn {\n inline-size: 100%;\n max-inline-size: 124px;\n}\n\n@container host-container (max-width: 768px) {\n .slide {\n grid-template-columns: 1fr 2fr;\n }\n}\n\n@container host-container (max-width: 640px) {\n .slide {\n grid-template-columns: 1fr 5fr;\n }\n}\n","// Stencil\nimport {\n Component,\n Host,\n h,\n Prop,\n State,\n Watch,\n Element,\n getAssetPath\n} from \"@stencil/core\";\n// Other Libraries\nimport { MercuryBundles } from \"@genexus/mercury\";\nimport { ComboBoxItemModel } from \"@genexus/chameleon-controls-library/dist/types/components/combo-box/types\";\n// Custom Imports\nimport { Locale } from \"../../common/locale\";\nimport { mapTeamsToComboBoxItemModel } from \"./helpers\";\n\nconst COPYRIGHTS_ILLUSTRATION = getAssetPath(\n `./gx-ide-assets/welcome-page/images/copyrights-illustration.png`\n);\nconst ICON_NEXT = getAssetPath(\n `./gx-ide-assets/welcome-page/images/icon-next.svg`\n);\nconst CSS_BUNDLES: MercuryBundles = [\n \"resets/box-sizing\",\n \"utils/typography\",\n \"components/button\",\n \"components/combo-box\"\n];\n\n@Component({\n tag: \"gx-ide-sign-in-team\",\n styleUrl: \"sign-in-team.scss\",\n shadow: true,\n assetsDirs: [\"gx-ide-assets/sign-in-team\"]\n})\nexport class GxIdeUiSplash {\n /**\n * The component hard-coded strings translations.\n */\n // eslint-disable-next-line @stencil-community/own-props-must-be-private\n #componentLocale: any;\n // Select User Team References :\n #userTeamsModel: ComboBoxItemModel[] = [];\n #chSelectTeamEl: HTMLChComboBoxRenderElement;\n #switchStepTransitionTime: number = 100;\n\n @Element() el: HTMLGxIdeSignInTeamElement;\n\n /**\n * This is a handover from \"authStep\" that allows updating descriptions once\n * the slide is hidden. This enables a smooth transition between descriptions.\n */\n\n @State() authStepInternal: AuthStep;\n\n /**\n * Defines if the main slide is visible or not. Used for smooth transitions\n * between slides.\n */\n @State() slideIsVisible: boolean = true;\n\n /**\n * The authentication step to display\n */\n @Prop() readonly authStep: AuthStep = \"signIn\";\n @Watch(\"authStep\")\n authStepChanged(newAuthStep: AuthStep) {\n this.slideIsVisible = false;\n // switch step\n setTimeout(() => {\n this.authStepInternal = newAuthStep;\n }, this.#switchStepTransitionTime);\n // show slide\n setTimeout(() => {\n this.slideIsVisible = true;\n }, this.#switchStepTransitionTime * 2);\n }\n\n /**\n * Callback executed when the user clicks the 'Continue' button\n */\n @Prop() readonly continueCallback!: (teamId: string) => Promise<void>;\n\n /**\n * Callback executed when the user click the \"Sign In\" button\n */\n @Prop() readonly signInCallback: () => Promise<void>;\n\n /**\n * Array that contains the user's teams\n */\n @Prop() readonly teams!: TeamData[];\n @Watch(\"teams\")\n teamsChanged(newTeams: TeamData[]) {\n this.#userTeamsModel = mapTeamsToComboBoxItemModel(newTeams);\n }\n\n /**\n * Callback executed when the user clicks on the \"term and conditions\" link\n */\n @Prop() readonly termsCallback: () => Promise<void>;\n\n async componentWillLoad() {\n this.#componentLocale = await Locale.getComponentStrings(this.el);\n this.el.style.setProperty(\n \"--switch-step-transtion-time\",\n this.#switchStepTransitionTime.toString() + \"ms\"\n );\n // Initialize values\n this.authStepInternal = this.authStep;\n this.teamsChanged(this.teams);\n }\n\n #authStepCallback = () => {\n if (this.authStep === \"signIn\") {\n this.signInCallback();\n } else if (this.authStep === \"selectUserTeam\") {\n this.#continueHandler();\n }\n };\n\n #continueHandler = async () => {\n await this.continueCallback(this.#chSelectTeamEl.value);\n };\n\n render() {\n return (\n <Host>\n <ch-theme model={CSS_BUNDLES}></ch-theme>\n <section class=\"slide\">\n <img\n src={COPYRIGHTS_ILLUSTRATION}\n class=\"slide__illustration\"\n alt=\"\" // decorative\n />\n\n <div\n class={{\n \"slide__main\": true,\n \"slide__main--visible\": this.slideIsVisible\n }}\n >\n <div class=\"slide__main-container\">\n <header class=\"slide__main-header\">\n <img\n src={ICON_NEXT}\n alt=\"\" // decorative\n />\n <h2\n // Split the title into two spans for better styling\n class=\"slide__main-title\"\n >\n <span>\n {this.#componentLocale[this.authStepInternal].titlePart1}\n </span>\n <span>\n {this.#componentLocale[this.authStepInternal].titlePart2}\n </span>\n </h2>\n </header>\n\n {this.authStepInternal === \"signIn\" ? (\n <div class=\"slide__main-description\">\n <p hidden>\n <span>{this.#componentLocale.descriptionText}</span>\n </p>\n <span>\n {this.#componentLocale.signIn.byContinuingText}\n <a class=\"terms-conditions\" onClick={this.termsCallback}>\n {this.#componentLocale.signIn.byContinuingCallBackText}\n </a>\n </span>\n </div>\n ) : (\n [\n <div class=\"slide__select-team-description\">\n <p class=\"text-body-highlighted-l\">\n {this.#componentLocale.selectUserTeam.infoMessage}\n </p>\n </div>,\n\n <div class=\"field-group\">\n <div class=\"field field-block\">\n <label htmlFor=\"teams\">\n {this.#componentLocale.teams}\n </label>\n <ch-combo-box-render\n id=\"teams\"\n accessibleName=\"Teams\"\n class=\"combo-box teams-list\"\n model={this.#userTeamsModel}\n value={this.#userTeamsModel[0]?.value}\n ref={(el: HTMLChComboBoxRenderElement) =>\n (this.#chSelectTeamEl =\n el as HTMLChComboBoxRenderElement)\n }\n ></ch-combo-box-render>\n </div>\n </div>\n ]\n )}\n\n <div>\n <button\n class=\"button-primary main-btn\"\n onClick={this.#authStepCallback}\n >\n {this.#componentLocale[this.authStepInternal].buttonCaption}\n </button>\n </div>\n </div>\n </div>\n </section>\n </Host>\n );\n }\n}\n\nexport type AuthStep = \"signIn\" | \"selectUserTeam\";\n\nexport type TeamData = {\n id: string;\n name: string;\n};\n"],"mappings":"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"}
|
|
@@ -4,7 +4,7 @@ import { g as r } from "./p-7d4c5a43.js";
|
|
|
4
4
|
|
|
5
5
|
import { L as o } from "./p-311eedf3.js";
|
|
6
6
|
|
|
7
|
-
const n = ':host{--slide-header-block-padding:34px;--slide-footer-block:var(--mer-spacing--md) var(--mer-spacing--4xl);--slide-footer-block-last-slide:var(--mer-spacing--md) 42px;--slide-footer-navigation-hide-transition:var(--mer-timing--fast);display:grid;block-size:100%;inline-size:100%;overflow:auto;padding:var(--mer-spacing--lg);box-sizing:border-box;padding:var(--mer-spacing--xl)}.main{display:grid;place-self:center;inline-size:100%;max-inline-size:1100px;background-color:var(--mer-surface__elevation--01);border-radius:17px;overflow:hidden;border:var(--mer-border__width--sm) solid var(--mer-surface__elevation--01);inset-block-start:0;transition:opacity var(--slide-fade-duration);opacity:0;pointer-events:none}.main--border-glow{animation:borderColorCycle 2s infinite}.main--visible{pointer-events:visible;opacity:1}.slide{display:grid;block-size:100%;grid-template-areas:"header header" "slide-wrapper slide-wrapper" "footer footer";grid-template-rows:max-content 1fr max-content}.slide__header{padding-inline:18px;padding-block:24px 27px;display:flex;flex-direction:row-reverse;grid-area:header}.slide__container{display:contents}.slide__wrapper{display:grid;column-gap:var(--mer-spacing--3xl);grid-template-areas:"header header" "illustration copy" "footer footer";grid-template-rows:max-content 1fr max-content;grid-template-columns:1fr
|
|
7
|
+
const n = ':host{--slide-header-block-padding:34px;--slide-footer-block:var(--mer-spacing--md) var(--mer-spacing--4xl);--slide-footer-block-last-slide:var(--mer-spacing--md) 42px;--slide-footer-navigation-hide-transition:var(--mer-timing--fast);display:grid;block-size:100%;inline-size:100%;overflow:auto;padding:var(--mer-spacing--lg);box-sizing:border-box;padding:var(--mer-spacing--xl)}.main{display:grid;place-self:center;inline-size:100%;max-inline-size:1100px;background-color:var(--mer-surface__elevation--01);border-radius:17px;overflow:hidden;border:var(--mer-border__width--sm) solid var(--mer-surface__elevation--01);inset-block-start:0;transition:opacity var(--slide-fade-duration);opacity:0;pointer-events:none}.main--border-glow{animation:borderColorCycle 2s infinite}.main--visible{pointer-events:visible;opacity:1}.slide{display:grid;block-size:100%;grid-template-areas:"header header" "slide-wrapper slide-wrapper" "footer footer";grid-template-rows:max-content 1fr max-content}.slide__header{padding-inline:18px;padding-block:24px 27px;display:flex;flex-direction:row-reverse;grid-area:header}.slide__container{display:contents}.slide__wrapper{display:grid;column-gap:var(--mer-spacing--3xl);grid-template-areas:"header header" "illustration copy" "footer footer";grid-template-rows:max-content 1fr max-content;grid-template-columns:1fr 1fr;grid-area:slide-wrapper;transition:var(--slide-fade-duration) opacity;transition:opacity 200ms;padding-inline:48px;opacity:1;z-index:1}.slide__wrapper:not(.active){opacity:0;z-index:0;pointer-events:none}.slide__illustration{position:relative;overflow:hidden;display:grid;grid-area:illustration;place-items:center;inline-size:100%}.slide__illustration-img{object-fit:contain;block-size:100%;inline-size:100%}.slide__copy{grid-area:copy;place-self:center;justify-self:flex-start}.slide__copy-container{display:grid;gap:var(--mer-spacing--md);max-inline-size:524px}.slide__copy-header{display:grid;gap:var(--mer-spacing--md)}.slide__copy-title{font-size:var(--mer-font__size--xl);color:var(--mer-text__on-surface);letter-spacing:0.02em;font-weight:var(--mer-font__weight--semi-bold)}.slide__copy-description{display:grid;gap:var(--mer-spacing--md);font-size:var(--mer-font__size--sm);font-weight:var(--mer-font__weight--light);line-height:var(--mer-line-height--spaced)}.slide__list{display:grid;gap:var(--mer-spacing--md);list-style:none;padding:0;margin:0}.slide__list-item-title{font-weight:var(--mer-font__weight--medium)}.slide__word{transition:var(--mer-timing--regular) opacity;opacity:0}.slide__word--visible{opacity:1}.slide__footer{grid-area:footer;display:grid;padding-block:var(--slide-footer-block);opacity:1}.slide__footer-last-slide{opacity:0;transition:calc(var(--mer-timing--fast) + 200ms) opacity;pointer-events:none;animation:footerPaddingBlockLastSlide var(--mer-timing--regular) ease-out forwards calc(var(--mer-timing--fast) + 200ms)}.slide__footer-wrapper{display:grid;grid-auto-flow:column;grid-auto-columns:max-content;gap:var(--mer-spacing--md);align-items:center;justify-content:center;transition:var(--mer-timing--regular) opacity;opacity:1}.slide__footer-wrapper-hidden{opacity:0}.slide__dots{display:grid;gap:var(--mer-spacing--2xs);list-style:none;padding:0;margin:0;grid-auto-flow:column;grid-auto-columns:max-content;justify-content:center}.slide__dots-inactive{pointer-events:none}.slide__dot{display:grid;padding:var(--mer-spacing--xs);cursor:pointer}.slide__dot::before{content:"";place-self:center;inline-size:var(--mer-spacing--sm);block-size:var(--mer-spacing--sm);border-radius:calc(var(--mer-spacing--sm) / 2);background-color:var(--mer-color__neutral-gray--500)}.slide__dot:hover::before{background-color:var(--mer-icon__on-primary--hover)}.slide__dot.active{cursor:auto}.slide__dot.active::before{background-color:var(--mer-accent__primary);cursor:auto}.slide__dot-inactive{pointer-events:none}.close-icon{transition:all var(--mer-timing--fast)}.close-icon:hover{filter:brightness(1.5)}.start-button{justify-self:start;margin-block-start:25px}@keyframes ellipseFadeInOut{0%{opacity:0.3}100%{opacity:0.7}}@keyframes ellipseRotate{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}@keyframes polygonRotate{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}@keyframes borderColorCycle{0%{border-color:var(--mer-surface__elevation--01)}50%{border-color:var(--mer-color__primary--400)}100%{border-color:var(--mer-surface__elevation--01)}}@keyframes footerPaddingBlockLastSlide{0%{padding-block:var(--slide-footer-block)}100%{padding-block:var(--slide-footer-block-last-slide)}}.fade-out{animation:fadeOut 0.5s forwards 0.3s}';
|
|
8
8
|
|
|
9
9
|
var l = undefined && undefined.__classPrivateFieldGet || function(e, i, t, s) {
|
|
10
10
|
if (t === "a" && !s) throw new TypeError("Private accessor was defined without a getter");
|
|
@@ -19,7 +19,7 @@ var d = undefined && undefined.__classPrivateFieldSet || function(e, i, t, s, a)
|
|
|
19
19
|
return s === "a" ? a.call(e, t) : a ? a.value = t : i.set(e, t), t;
|
|
20
20
|
};
|
|
21
21
|
|
|
22
|
-
var c, p, h, f, m,
|
|
22
|
+
var c, p, h, f, m, g, _, u, v, y, w, b, k, x, z, M, W;
|
|
23
23
|
|
|
24
24
|
const T = "active";
|
|
25
25
|
|
|
@@ -63,7 +63,7 @@ const I = class {
|
|
|
63
63
|
// that is set to be displayed as chunks, has already been displayed. Used to not display
|
|
64
64
|
// as chunks after the first time.
|
|
65
65
|
m.set(this, void 0);
|
|
66
|
-
|
|
66
|
+
g.set(this, (() => {
|
|
67
67
|
this.sliderVisible = false;
|
|
68
68
|
setTimeout((() => {
|
|
69
69
|
// wait until the slide disappears, then remove.
|
|
@@ -72,7 +72,7 @@ const I = class {
|
|
|
72
72
|
document.removeEventListener("keydown", l(this, y, "f"));
|
|
73
73
|
}), L);
|
|
74
74
|
}));
|
|
75
|
-
|
|
75
|
+
_.set(this, (() => {
|
|
76
76
|
l(this, k, "f").call(this);
|
|
77
77
|
// listen to keydown events to navigate the slides with the arrows
|
|
78
78
|
document.addEventListener("keydown", l(this, y, "f"));
|
|
@@ -100,7 +100,7 @@ const I = class {
|
|
|
100
100
|
} else if (i) {
|
|
101
101
|
l(this, b, "f").call(this);
|
|
102
102
|
} else if (s) {
|
|
103
|
-
l(this,
|
|
103
|
+
l(this, g, "f").call(this);
|
|
104
104
|
}
|
|
105
105
|
}));
|
|
106
106
|
w.set(this, (() => {
|
|
@@ -120,14 +120,22 @@ const I = class {
|
|
|
120
120
|
if (!e) {
|
|
121
121
|
return;
|
|
122
122
|
}
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
123
|
+
let i = 0;
|
|
124
|
+
if (this.slides[this.activeSlideIndex].listItems) {
|
|
125
|
+
const e = this.slides[this.activeSlideIndex].listItems.map((e => e.title + e.description));
|
|
126
|
+
if (e.length) {
|
|
127
|
+
const t = e.join("");
|
|
128
|
+
i = t.split(" ").length;
|
|
129
|
+
}
|
|
130
|
+
}
|
|
131
|
+
const t = this.slides[this.activeSlideIndex].description.join("");
|
|
132
|
+
const s = t.split(" ").length;
|
|
133
|
+
const a = l(this, x, "f").call(this, s + i);
|
|
126
134
|
// Set a fresh timeout
|
|
127
|
-
if (
|
|
135
|
+
if (a) {
|
|
128
136
|
d(this, m, setTimeout((() => {
|
|
129
137
|
l(this, w, "f").call(this);
|
|
130
|
-
}),
|
|
138
|
+
}), a), "f");
|
|
131
139
|
}
|
|
132
140
|
}));
|
|
133
141
|
x.set(this, ((e, i = this.wordsPerMinute) => {
|
|
@@ -172,7 +180,7 @@ const I = class {
|
|
|
172
180
|
class: "slide__list-item-title"
|
|
173
181
|
}, e.title), " ", e.description))))), r && t("button", {
|
|
174
182
|
class: "button-primary start-button",
|
|
175
|
-
onClick: l(this,
|
|
183
|
+
onClick: l(this, g, "f")
|
|
176
184
|
}, l(this, c, "f").startButtonCaption))));
|
|
177
185
|
})), "f");
|
|
178
186
|
}));
|
|
@@ -180,9 +188,6 @@ const I = class {
|
|
|
180
188
|
class: "slide__word"
|
|
181
189
|
}, e, " ")))));
|
|
182
190
|
W.set(this, (e => {
|
|
183
|
-
if (this.lastSlideReached) {
|
|
184
|
-
return;
|
|
185
|
-
}
|
|
186
191
|
this.slideTransitioning = true;
|
|
187
192
|
// unset current active slide
|
|
188
193
|
const i = l(this, f, "f")[this.activeSlideIndex];
|
|
@@ -236,7 +241,7 @@ const I = class {
|
|
|
236
241
|
componentDidLoad() {
|
|
237
242
|
l(this, f, "f")[this.activeSlideIndex].classList.add(T);
|
|
238
243
|
this.sliderVisible = true;
|
|
239
|
-
l(this,
|
|
244
|
+
l(this, _, "f").call(this);
|
|
240
245
|
}
|
|
241
246
|
render() {
|
|
242
247
|
return t(s, null, t("ch-theme", {
|
|
@@ -257,7 +262,7 @@ const I = class {
|
|
|
257
262
|
}, t("button", {
|
|
258
263
|
class: "button-tertiary button-icon-only close-icon",
|
|
259
264
|
"aria-label": "close presentation",
|
|
260
|
-
onClick: l(this,
|
|
265
|
+
onClick: l(this, g, "f")
|
|
261
266
|
}, t("ch-image", {
|
|
262
267
|
class: "icon-md",
|
|
263
268
|
src: B
|
|
@@ -266,13 +271,11 @@ const I = class {
|
|
|
266
271
|
}, l(this, h, "f")), t("footer", {
|
|
267
272
|
// slide common footer
|
|
268
273
|
class: {
|
|
269
|
-
slide__footer: true
|
|
270
|
-
"slide__footer-last-slide": this.lastSlideReached
|
|
274
|
+
slide__footer: true
|
|
271
275
|
}
|
|
272
276
|
}, t("div", {
|
|
273
277
|
class: {
|
|
274
|
-
"slide__footer-wrapper": true
|
|
275
|
-
"slide__footer-wrapper-hidden": this.lastSlideReached
|
|
278
|
+
"slide__footer-wrapper": true
|
|
276
279
|
}
|
|
277
280
|
}, t("ul", {
|
|
278
281
|
class: "slide__dots",
|
|
@@ -296,11 +299,11 @@ const I = class {
|
|
|
296
299
|
};
|
|
297
300
|
|
|
298
301
|
c = new WeakMap, p = new WeakMap, h = new WeakMap, f = new WeakMap, m = new WeakMap,
|
|
299
|
-
|
|
302
|
+
g = new WeakMap, _ = new WeakMap, u = new WeakMap, v = new WeakMap, y = new WeakMap,
|
|
300
303
|
w = new WeakMap, b = new WeakMap, k = new WeakMap, x = new WeakMap, z = new WeakMap,
|
|
301
304
|
M = new WeakMap, W = new WeakMap;
|
|
302
305
|
|
|
303
306
|
I.style = n;
|
|
304
307
|
|
|
305
308
|
export { I as gx_ide_welcome_page };
|
|
306
|
-
//# sourceMappingURL=p-
|
|
309
|
+
//# sourceMappingURL=p-3d6140e6.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["welcomePageCss","ACTIVE_SLIDE_SELECTOR","ARROW_LEFT_KEY","ARROW_RIGHT_KEY","ESCAPE_KEY","SLIDE_FADE_DURATION","SLIDE_WORD_SELECTOR","SLIDE_WORD_SELECTOR_TIMEOUT","SLIDE_WORD_SELECTOR_VISIBLE","ICON_NEXT","getAssetPath","CLOSE_ICON","getIconPath","category","name","colorType","CSS_BUNDLES","GxIdeWelcomePage","_GxIdeWelcomePage_componentLocale","set","this","_GxIdeWelcomePage_slidesDescriptionAsChunksAlreadyDisplayed","Map","_GxIdeWelcomePage_slidesElements","_GxIdeWelcomePage_slidesElementsRef","_GxIdeWelcomePage_slideTimeOutId","_GxIdeWelcomePage_closeSlider","sliderVisible","setTimeout","el","remove","closeCallback","document","removeEventListener","__classPrivateFieldGet","_GxIdeWelcomePage_keyboardEventHandler","_GxIdeWelcomePage_initiateSlidesTransition","_GxIdeWelcomePage_slideTimeOut","call","addEventListener","_GxIdeWelcomePage_displayWords","wordsNodeList","forEach","word","index","classList","add","_GxIdeWelcomePage_dotClickedHandler","event","userHasChangedSlide","itemClicked","currentTarget","parseInt","getAttribute","_GxIdeWelcomePage_updateActiveSlide","goToPrevSlide","key","slideTransitioning","lastSlideReached","activeSlideIndex","goToNextSlide","closeSlider","_GxIdeWelcomePage_nextSlideHandler","_GxIdeWelcomePage_prevSlideHandler","newIndex","clearTimeout","autoChangeSlide","transitionType","itemsWordsCount","slides","listItems","itemsWords","map","item","title","description","length","mergedItemsWords","join","split","mergedDescription","words","timeBeforeNextSlide","_GxIdeWelcomePage_secondsToRead","__classPrivateFieldSet","wordsCount","wordsPerMinute","minutes","milliseconds","_GxIdeWelcomePage_renderSlides","slide","isLastSlide","h","class","ref","role","copyright","illustrationAriaLabel","src","illustration","url","alt","_a","paragraph","descriptionAsChunks","_GxIdeWelcomePage_splitWords","_b","onClick","startButtonCaption","newSlideIndex","activeSlide","nextSlideReference","displayDescriptionAsChunks","descriptionAsChunksDisplayedAlready","get","slideTimeOut","querySelectorAll","componentWillLoad","Locale","getComponentStrings","componentDidLoad","render","Host","model","main","style","slide__footer","_","slide__dot"],"sources":["src/components/welcome-page/welcome-page.scss?tag=gx-ide-welcome-page&encapsulation=shadow","src/components/welcome-page/welcome-page.tsx"],"sourcesContent":[":host {\n --slide-header-block-padding: 34px;\n --slide-footer-block: var(--mer-spacing--md) var(--mer-spacing--4xl);\n --slide-footer-block-last-slide: var(--mer-spacing--md) 42px;\n --slide-footer-navigation-hide-transition: var(--mer-timing--fast);\n display: grid;\n block-size: 100%;\n inline-size: 100%;\n overflow: auto;\n padding: var(--mer-spacing--lg);\n box-sizing: border-box;\n padding: var(--mer-spacing--xl);\n}\n\n.main {\n display: grid;\n place-self: center;\n inline-size: 100%;\n max-inline-size: 1100px;\n background-color: var(--mer-surface__elevation--01);\n border-radius: 17px;\n overflow: hidden;\n border: var(--mer-border__width--sm) solid var(--mer-surface__elevation--01);\n inset-block-start: 0;\n transition: opacity var(--slide-fade-duration);\n opacity: 0;\n pointer-events: none;\n\n &--border-glow {\n animation: borderColorCycle 2s infinite;\n }\n &--visible {\n pointer-events: visible;\n opacity: 1;\n }\n}\n\n// - - - - - - - - - - - - -\n// Slide\n// - - - - - - - - - - - - -\n\n.slide {\n display: grid;\n block-size: 100%;\n grid-template-areas:\n \"header header\"\n \"slide-wrapper slide-wrapper\"\n \"footer footer\";\n grid-template-rows: max-content 1fr max-content;\n\n // - - - - - Header\n\n &__header {\n padding-inline: 18px;\n padding-block: 24px 27px;\n display: flex;\n flex-direction: row-reverse;\n grid-area: header;\n }\n\n // - - - - - Container\n\n &__container {\n display: contents;\n }\n\n &__wrapper {\n display: grid;\n column-gap: var(--mer-spacing--3xl);\n grid-template-areas:\n \"header header\"\n \"illustration copy\"\n \"footer footer\";\n grid-template-rows: max-content 1fr max-content;\n // grid-template-columns: 411px 1fr;\n grid-template-columns: 1fr 1fr;\n grid-area: slide-wrapper;\n transition: var(--slide-fade-duration) opacity;\n transition: opacity 200ms;\n padding-inline: 48px;\n opacity: 1;\n z-index: 1;\n }\n &__wrapper:not(.active) {\n opacity: 0;\n z-index: 0;\n pointer-events: none;\n }\n\n &__illustration {\n position: relative;\n overflow: hidden;\n display: grid;\n grid-area: illustration;\n place-items: center;\n inline-size: 100%;\n\n &-img {\n object-fit: contain;\n block-size: 100%;\n inline-size: 100%;\n }\n }\n\n &__copy {\n grid-area: copy;\n place-self: center;\n justify-self: flex-start;\n }\n\n &__copy-container {\n display: grid;\n gap: var(--mer-spacing--md);\n max-inline-size: 524px;\n }\n\n &__copy-header {\n display: grid;\n gap: var(--mer-spacing--md);\n }\n\n &__copy-title {\n font-size: var(--mer-font__size--xl);\n color: var(--mer-text__on-surface);\n letter-spacing: 0.02em;\n font-weight: var(--mer-font__weight--semi-bold);\n }\n\n &__copy-description {\n display: grid;\n gap: var(--mer-spacing--md);\n font-size: var(--mer-font__size--sm);\n font-weight: var(--mer-font__weight--light);\n line-height: var(--mer-line-height--spaced);\n }\n\n &__list {\n display: grid;\n gap: var(--mer-spacing--md);\n list-style: none;\n padding: 0;\n margin: 0;\n\n &-item {\n &-title {\n font-weight: var(--mer-font__weight--medium);\n }\n }\n }\n\n // words (if 'showTextInChunks' is true)\n &__word {\n transition: var(--mer-timing--regular) opacity;\n opacity: 0;\n\n &--visible {\n opacity: 1;\n }\n }\n\n // - - - - - Footer\n\n &__footer {\n $hideDotsDuration: calc(var(--mer-timing--fast) + 200ms);\n grid-area: footer;\n display: grid;\n padding-block: var(--slide-footer-block);\n opacity: 1;\n\n &-last-slide {\n opacity: 0;\n transition: $hideDotsDuration opacity;\n pointer-events: none;\n animation: footerPaddingBlockLastSlide var(--mer-timing--regular) ease-out\n forwards $hideDotsDuration;\n }\n }\n\n &__footer-wrapper {\n display: grid;\n grid-auto-flow: column;\n grid-auto-columns: max-content;\n gap: var(--mer-spacing--md);\n align-items: center;\n justify-content: center;\n transition: var(--mer-timing--regular) opacity;\n opacity: 1;\n\n &-hidden {\n opacity: 0;\n }\n }\n &__dots {\n display: grid;\n gap: var(--mer-spacing--2xs);\n list-style: none;\n padding: 0;\n margin: 0;\n grid-auto-flow: column;\n grid-auto-columns: max-content;\n justify-content: center;\n\n &-inactive {\n pointer-events: none;\n }\n }\n &__dot {\n display: grid;\n padding: var(--mer-spacing--xs);\n cursor: pointer;\n\n &::before {\n content: \"\";\n place-self: center;\n inline-size: var(--mer-spacing--sm);\n block-size: var(--mer-spacing--sm);\n border-radius: calc(var(--mer-spacing--sm) / 2);\n background-color: var(--mer-color__neutral-gray--500);\n }\n &:hover::before {\n background-color: var(--mer-icon__on-primary--hover);\n }\n\n &.active {\n cursor: auto;\n &::before {\n background-color: var(--mer-accent__primary);\n cursor: auto;\n }\n }\n\n &-inactive {\n pointer-events: none;\n }\n }\n}\n\n.close-icon {\n transition: all var(--mer-timing--fast);\n &:hover {\n filter: brightness(1.5);\n }\n}\n\n.start-button {\n justify-self: start;\n margin-block-start: 25px;\n}\n\n// - - - - - - - - - - - - - -\n// Animations\n// - - - - - - - - - - - - - -\n\n@keyframes ellipseFadeInOut {\n 0% {\n opacity: 0.3;\n }\n 100% {\n opacity: 0.7;\n }\n}\n@keyframes ellipseRotate {\n 0% {\n transform: rotate(0deg);\n }\n 100% {\n transform: rotate(360deg);\n }\n}\n@keyframes polygonRotate {\n 0% {\n transform: rotate(0deg);\n }\n 100% {\n transform: rotate(360deg);\n }\n}\n\n@keyframes borderColorCycle {\n 0% {\n border-color: var(--mer-surface__elevation--01);\n }\n 50% {\n border-color: var(--mer-color__primary--400);\n }\n 100% {\n border-color: var(--mer-surface__elevation--01);\n }\n}\n\n@keyframes footerPaddingBlockLastSlide {\n 0% {\n padding-block: var(--slide-footer-block);\n }\n 100% {\n padding-block: var(--slide-footer-block-last-slide);\n }\n}\n\n.fade-out {\n animation: fadeOut 0.5s forwards 0.3s;\n}\n","// Stencil\nimport {\n Component,\n Host,\n h,\n Prop,\n Element,\n State,\n getAssetPath\n} from \"@stencil/core\";\n// Other Libraries\nimport { MercuryBundles, getIconPath } from \"@genexus/mercury\";\n\n// Custom Imports\nimport { Locale } from \"../../common/locale\";\n\nconst ACTIVE_SLIDE_SELECTOR = \"active\";\nconst ARROW_LEFT_KEY = \"ArrowLeft\";\nconst ARROW_RIGHT_KEY = \"ArrowRight\";\nconst ESCAPE_KEY = \"Escape\";\nconst SLIDE_FADE_DURATION = 300;\nconst SLIDE_WORD_SELECTOR = \".slide__word\";\nconst SLIDE_WORD_SELECTOR_TIMEOUT = 70;\nconst SLIDE_WORD_SELECTOR_VISIBLE = \"slide__word--visible\";\n\n// icons\nconst ICON_NEXT = getAssetPath(\n `./gx-ide-assets/welcome-page/images/icon-next.svg`\n);\nconst CLOSE_ICON = getIconPath({\n category: \"system\",\n name: \"close\",\n colorType: \"on-elevation\"\n});\n\nconst CSS_BUNDLES: MercuryBundles = [\n \"resets/box-sizing\",\n \"utils/typography\",\n \"components/icon\",\n \"components/button\"\n];\n\n@Component({\n tag: \"gx-ide-welcome-page\",\n styleUrl: \"welcome-page.scss\",\n shadow: true,\n assetsDirs: [\"gx-ide-assets/welcome-page\"]\n})\nexport class GxIdeWelcomePage {\n /**\n * The component hard-coded strings translations.\n */\n // eslint-disable-next-line @stencil-community/own-props-must-be-private\n #componentLocale: any;\n\n #slidesDescriptionAsChunksAlreadyDisplayed: Map<number, boolean> = new Map();\n #slidesElements: HTMLElement[] = [];\n #slidesElementsRef: HTMLElement[] = [];\n // #slidesDescriptionAsChunksAlreadyDisplayed is used to know if the description of a slide\n // that is set to be displayed as chunks, has already been displayed. Used to not display\n // as chunks after the first time.\n #slideTimeOutId: NodeJS.Timeout;\n\n @Element() el: HTMLGxIdeWelcomePageElement;\n\n /**\n * The current active slide index from 'slides' Prop. It does not considers the very first slide \"Copyright\".\n */\n @State() activeSlideIndex: number = 0;\n\n /**\n * When true the slider will be visible. Used to display and hide the slide with a smooth transition.\n */\n @State() displaySlider: boolean = false;\n\n /**\n * True if the very first slide is visible (The copyright slide)\n */\n @State() copyrightsVisible: boolean = true;\n\n /**\n * True if the user has reached the last slide. Used to hide/disable the navigation.\n */\n @State() lastSlideReached: boolean = false;\n\n /**\n * When true the slider will be visible. Used to display and hide the slider with a smooth transition.\n */\n @State() sliderVisible: boolean = false;\n\n /**\n * True if a slide is transitioning, false otherwise. Used to disable the navigation arrows while transitioning.\n */\n @State() slideTransitioning: boolean = false;\n\n /**\n * True if the user has changed slides by clicking on the navigation dots, or by using the keyboard arrows. This is used to know evaluate the slide transition setTimeOut. If the user has navigated, automatic slide transition should be turned off.\n */\n @State() userHasChangedSlide: boolean = false;\n\n /**\n * The transition type between the slides. \"static\" requires the user to navigate by clicking the navigation dots. \"auto\" will transition automatically after a calculated amount of time.\n */\n @Prop() readonly transitionType: TransitionType = \"auto\";\n\n /**\n * The estimated amount of words per minute that the user requires to read a slide. This value is used to return the time each slide is freezed before transitioning to the next one. Only evaluated when transitionType is set to \"auto\".\n */\n @Prop() readonly wordsPerMinute: number = 250;\n\n /**\n * Callback invoked when the user closes the slider by pressing the close button.\n */\n @Prop() readonly closeCallback!: CloseCallback;\n\n /**\n * An array of slides, with the information that each slide requires. This slides appear after the first slide (Copyrights) that is defined inside the component.\n */\n @Prop() readonly slides: SlideInfo[] = [];\n\n async componentWillLoad() {\n this.#componentLocale = await Locale.getComponentStrings(this.el);\n this.#renderSlides();\n }\n\n componentDidLoad() {\n this.#slidesElementsRef[this.activeSlideIndex].classList.add(\n ACTIVE_SLIDE_SELECTOR\n );\n this.sliderVisible = true;\n this.#initiateSlidesTransition();\n }\n\n #closeSlider = () => {\n this.sliderVisible = false;\n setTimeout(() => {\n // wait until the slide disappears, then remove.\n this.el.remove();\n this.closeCallback();\n document.removeEventListener(\"keydown\", this.#keyboardEventHandler);\n }, SLIDE_FADE_DURATION);\n };\n\n #initiateSlidesTransition = () => {\n this.#slideTimeOut();\n // listen to keydown events to navigate the slides with the arrows\n document.addEventListener(\"keydown\", this.#keyboardEventHandler);\n };\n\n #displayWords = (wordsNodeList: NodeListOf<HTMLElement>) => {\n wordsNodeList.forEach((word, index) => {\n setTimeout(() => {\n word.classList.add(SLIDE_WORD_SELECTOR_VISIBLE);\n }, index * SLIDE_WORD_SELECTOR_TIMEOUT);\n });\n };\n\n #dotClickedHandler = (event: MouseEvent) => {\n this.userHasChangedSlide = true;\n const itemClicked = event.currentTarget as HTMLElement;\n const index = parseInt(itemClicked.getAttribute(\"data-index\"), 10);\n this.#updateActiveSlide(index);\n };\n\n #keyboardEventHandler = (event: KeyboardEvent) => {\n this.userHasChangedSlide = true;\n const goToPrevSlide =\n event.key === ARROW_LEFT_KEY &&\n !this.slideTransitioning &&\n !this.lastSlideReached &&\n this.activeSlideIndex !== 0;\n\n const goToNextSlide =\n event.key === ARROW_RIGHT_KEY &&\n !this.slideTransitioning &&\n !this.lastSlideReached;\n\n const closeSlider =\n event.key === ESCAPE_KEY ||\n (event.key === ARROW_RIGHT_KEY &&\n !this.slideTransitioning &&\n this.lastSlideReached);\n\n if (goToNextSlide) {\n this.#nextSlideHandler();\n } else if (goToPrevSlide) {\n this.#prevSlideHandler();\n } else if (closeSlider) {\n this.#closeSlider();\n }\n };\n\n #nextSlideHandler = () => {\n const newIndex = this.activeSlideIndex + 1;\n this.#updateActiveSlide(newIndex);\n };\n\n #prevSlideHandler = () => {\n const newIndex = this.activeSlideIndex - 1;\n this.#updateActiveSlide(newIndex);\n };\n\n #slideTimeOut = () => {\n // Clear any existing timeout\n if (this.#slideTimeOutId) {\n clearTimeout(this.#slideTimeOutId);\n }\n\n const autoChangeSlide =\n this.transitionType === \"auto\" &&\n !this.lastSlideReached &&\n !this.userHasChangedSlide;\n\n if (!autoChangeSlide) {\n return;\n }\n\n let itemsWordsCount = 0;\n if (this.slides[this.activeSlideIndex].listItems) {\n const itemsWords = this.slides[this.activeSlideIndex].listItems.map(\n item => {\n return item.title + item.description;\n }\n );\n if (itemsWords.length) {\n const mergedItemsWords = itemsWords.join(\"\");\n itemsWordsCount = mergedItemsWords.split(\" \").length;\n }\n }\n\n const mergedDescription =\n this.slides[this.activeSlideIndex].description.join(\"\");\n const words = mergedDescription.split(\" \").length;\n const timeBeforeNextSlide: number = this.#secondsToRead(\n words + itemsWordsCount\n );\n\n // Set a fresh timeout\n if (timeBeforeNextSlide) {\n this.#slideTimeOutId = setTimeout(() => {\n this.#nextSlideHandler();\n }, timeBeforeNextSlide);\n }\n };\n\n #secondsToRead = (\n wordsCount: number,\n wordsPerMinute = this.wordsPerMinute\n ): number => {\n const minutes = wordsCount / wordsPerMinute;\n const milliseconds = minutes * 60000; // Convert minutes to milliseconds\n return milliseconds;\n };\n\n #renderSlides = () => {\n this.#slidesElements = this.slides.map((slide, index) => {\n const isLastSlide = index === this.slides.length - 1;\n return (\n <section\n class=\"slide__wrapper\"\n ref={(el: HTMLElement) =>\n (this.#slidesElementsRef[index] = el as HTMLElement)\n }\n >\n <div\n class=\"slide__illustration\"\n role=\"img\"\n aria-label={this.#componentLocale.copyright.illustrationAriaLabel}\n >\n <img\n class=\"slide__illustration-img\"\n src={slide.illustration.url}\n alt={slide.illustration.alt}\n />\n </div>\n <section class=\"slide__copy\">\n <div class=\"slide__copy-container\">\n <header class=\"slide__copy-header\">\n <img src={ICON_NEXT} alt=\"GeneXus Next isologotype\" />\n <h2 class=\"slide__copy-title\">{slide.title}</h2>\n </header>\n <div class=\"slide__copy-description\">\n {slide.description?.map(paragraph => {\n return (\n <p>\n {slide.descriptionAsChunks\n ? this.#splitWords(paragraph)\n : paragraph}\n </p>\n );\n })}\n {slide.listItems?.length && (\n <ul class=\"slide__list\">\n {slide.listItems.map(item => {\n return (\n <li class=\"slide__list-item\">\n <strong class=\"slide__list-item-title\">\n {item.title}\n </strong>{\" \"}\n {item.description}\n </li>\n );\n })}\n </ul>\n )}\n </div>\n {isLastSlide && (\n <button\n class=\"button-primary start-button\"\n onClick={this.#closeSlider}\n >\n {this.#componentLocale.startButtonCaption}\n </button>\n )}\n </div>\n </section>\n </section>\n );\n });\n };\n\n #splitWords = (paragraph: string): HTMLSpanElement[] => {\n return paragraph.split(\" \").map(word => {\n // keep the space after {word} !\n return <span class=\"slide__word\">{word} </span>;\n });\n };\n\n #updateActiveSlide = (newSlideIndex: number) => {\n this.slideTransitioning = true;\n\n // unset current active slide\n const activeSlide = this.#slidesElementsRef[this.activeSlideIndex];\n activeSlide.classList.remove(ACTIVE_SLIDE_SELECTOR);\n\n const nextSlideReference = this.#slidesElementsRef[newSlideIndex];\n const displayDescriptionAsChunks =\n this.slides[newSlideIndex].descriptionAsChunks;\n const descriptionAsChunksDisplayedAlready =\n this.#slidesDescriptionAsChunksAlreadyDisplayed.get(newSlideIndex);\n let wordsCount;\n let wordsNodeList: NodeListOf<HTMLElement>;\n let slideTimeOut = 0;\n if (displayDescriptionAsChunks) {\n wordsNodeList = nextSlideReference.querySelectorAll(SLIDE_WORD_SELECTOR);\n wordsCount = wordsNodeList.length;\n slideTimeOut = wordsCount * SLIDE_WORD_SELECTOR_TIMEOUT;\n }\n\n this.lastSlideReached = newSlideIndex === this.slides.length - 1;\n\n // set new slide as active after fade out\n setTimeout(() => {\n nextSlideReference.classList.add(ACTIVE_SLIDE_SELECTOR);\n\n if (displayDescriptionAsChunks && !descriptionAsChunksDisplayedAlready) {\n this.#slidesDescriptionAsChunksAlreadyDisplayed.set(\n newSlideIndex,\n true\n );\n this.#displayWords(wordsNodeList);\n setTimeout(() => {\n this.slideTransitioning = false;\n }, slideTimeOut);\n } else {\n this.slideTransitioning = false;\n }\n }, SLIDE_FADE_DURATION);\n\n // update active slide index\n this.activeSlideIndex = newSlideIndex;\n this.#slideTimeOut(); // this has to be after this.#updateActiveSlide.\n };\n\n render() {\n return (\n <Host>\n <ch-theme model={CSS_BUNDLES}></ch-theme>\n <div\n class={{\n \"main\": true,\n \"main--visible\": this.sliderVisible,\n \"main--border-glow\": this.lastSlideReached\n }}\n style={{ \"--slide-fade-duration\": `${SLIDE_FADE_DURATION}ms` }}\n >\n <section class=\"slide\">\n <header class=\"slide__header\">\n <button\n class=\"button-tertiary button-icon-only close-icon\"\n aria-label=\"close presentation\"\n onClick={this.#closeSlider}\n >\n <ch-image class=\"icon-md\" src={CLOSE_ICON}></ch-image>\n </button>\n </header>\n <div class=\"slide__container\">{this.#slidesElements}</div>\n <footer\n // slide common footer\n class={{\n slide__footer: true\n }}\n >\n <div\n class={{\n \"slide__footer-wrapper\": true\n }}\n >\n <ul class=\"slide__dots\" aria-label=\"Slide indicators\">\n {this.slides.map((_, index) => {\n return (\n <li\n class={{\n \"slide__dot\": true,\n \"slide__dot-inactive\": this.slideTransitioning,\n [ACTIVE_SLIDE_SELECTOR]:\n index === this.activeSlideIndex\n }}\n data-index={index}\n onClick={\n !this.slideTransitioning && this.#dotClickedHandler\n }\n ></li>\n );\n })}\n </ul>\n </div>\n </footer>\n </section>\n </div>\n </Host>\n );\n }\n}\n\nexport type SlideInfo = {\n illustration: {\n url: string;\n alt: string;\n };\n title: string;\n description?: string[];\n descriptionAsChunks?: boolean;\n listItems?: Array<{\n title: string;\n description: string;\n }>;\n};\n\nexport type CloseCallback = () => Promise<void>;\nexport type TransitionType = \"static\" | \"auto\";\n"],"mappings":"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"}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { r as e, h as t, H as i, g as o } from "./p-49712340.js";
|
|
2
2
|
|
|
3
|
-
import { g as
|
|
3
|
+
import { g as n } from "./p-7d4c5a43.js";
|
|
4
4
|
|
|
5
|
-
import { L as
|
|
5
|
+
import { L as s } from "./p-311eedf3.js";
|
|
6
6
|
|
|
7
7
|
const getInitialsFromName = e => {
|
|
8
8
|
const t = e.split(" ");
|
|
@@ -13,13 +13,13 @@ const getInitialsFromName = e => {
|
|
|
13
13
|
}
|
|
14
14
|
};
|
|
15
15
|
|
|
16
|
-
const
|
|
16
|
+
const r = "@keyframes spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}:host{display:inline-grid;justify-items:end;block-size:100%}.user-login__button{all:unset;display:grid;grid-template-columns:max-content max-content max-content;align-items:center;gap:var(--mer-spacing--sm);block-size:auto;cursor:pointer}.user-login__details{display:grid;grid-template-rows:max-content max-content;gap:var(--mer-spacing--3xs);justify-items:end}.user-login__name{font-weight:var(--mer-font__weight--medium);font-size:var(--mer-font__size--3xs);color:var(--mer-text__on-elevation)}.user-login__organization{font-weight:var(--mer-font__weight--light);font-size:var(--mer-font__size--4xs);color:var(--mer-text__neutral)}.user-login__avatar{font-size:9px;flex:0 0 auto;display:flex;align-items:center;justify-content:center;block-size:var(--mer-spacing--lg);inline-size:var(--mer-spacing--lg);color:var(--mer-text__on-elevation);border-radius:50%;background-color:var(--mer-color__tinted-primary--10);border:var(--mer-border__width--sm) solid var(--mer-color__primary--200)}.privacy-policy{text-decoration:underline;cursor:pointer}";
|
|
17
17
|
|
|
18
|
-
var a = undefined && undefined.__classPrivateFieldSet || function(e, t, i, o,
|
|
18
|
+
var a = undefined && undefined.__classPrivateFieldSet || function(e, t, i, o, n) {
|
|
19
19
|
if (o === "m") throw new TypeError("Private method is not writable");
|
|
20
|
-
if (o === "a" && !
|
|
21
|
-
if (typeof t === "function" ? e !== t || !
|
|
22
|
-
return o === "a" ?
|
|
20
|
+
if (o === "a" && !n) throw new TypeError("Private accessor was defined without a setter");
|
|
21
|
+
if (typeof t === "function" ? e !== t || !n : !t.has(e)) throw new TypeError("Cannot write private member to an object whose class did not declare it");
|
|
22
|
+
return o === "a" ? n.call(e, i) : n ? n.value = i : t.set(e, i), i;
|
|
23
23
|
};
|
|
24
24
|
|
|
25
25
|
var c = undefined && undefined.__classPrivateFieldGet || function(e, t, i, o) {
|
|
@@ -34,7 +34,7 @@ const p = [
|
|
|
34
34
|
// TODO: review if "utils/form--full" is required.
|
|
35
35
|
"resets/box-sizing", "components/tooltip", "components/toggle", "components/icon", "components/dropdown", "utils/layout", "utils/typography", "utils/spacing", "chameleon/scrollbar" ];
|
|
36
36
|
|
|
37
|
-
const h =
|
|
37
|
+
const h = n({
|
|
38
38
|
category: "navigation",
|
|
39
39
|
name: "chevron-down",
|
|
40
40
|
colorType: "neutral"
|
|
@@ -44,7 +44,7 @@ const g = "my-account";
|
|
|
44
44
|
|
|
45
45
|
const _ = "change-team";
|
|
46
46
|
|
|
47
|
-
const w = "
|
|
47
|
+
const w = "sign-out";
|
|
48
48
|
|
|
49
49
|
const v = "language";
|
|
50
50
|
|
|
@@ -68,9 +68,9 @@ const y = class {
|
|
|
68
68
|
} else if (i === _) {
|
|
69
69
|
this.changeTeamCallback();
|
|
70
70
|
} else if (i === w) {
|
|
71
|
-
this.changeLanguageCallback();
|
|
72
|
-
} else if (i === v) {
|
|
73
71
|
this.signOutCallback();
|
|
72
|
+
} else if (i === v) {
|
|
73
|
+
this.changeLanguageCallback();
|
|
74
74
|
}
|
|
75
75
|
}));
|
|
76
76
|
this.showMenu = false;
|
|
@@ -83,7 +83,7 @@ const y = class {
|
|
|
83
83
|
this.showTermsCallback = undefined;
|
|
84
84
|
}
|
|
85
85
|
async componentWillLoad() {
|
|
86
|
-
a(this, l, await
|
|
86
|
+
a(this, l, await s.getComponentStrings(this.el), "f");
|
|
87
87
|
a(this, d, getInitialsFromName(this.userInfo.name), "f");
|
|
88
88
|
a(this, f, [ {
|
|
89
89
|
id: g,
|
|
@@ -95,7 +95,7 @@ const y = class {
|
|
|
95
95
|
showSeparator: false
|
|
96
96
|
}, {
|
|
97
97
|
id: w,
|
|
98
|
-
caption: c(this, l, "f").
|
|
98
|
+
caption: c(this, l, "f").signOutLabel,
|
|
99
99
|
showSeparator: true
|
|
100
100
|
} ], "f");
|
|
101
101
|
}
|
|
@@ -143,7 +143,7 @@ const y = class {
|
|
|
143
143
|
|
|
144
144
|
l = new WeakMap, d = new WeakMap, f = new WeakMap, u = new WeakMap, m = new WeakMap;
|
|
145
145
|
|
|
146
|
-
y.style =
|
|
146
|
+
y.style = r;
|
|
147
147
|
|
|
148
148
|
export { y as gx_ide_current_user_info };
|
|
149
|
-
//# sourceMappingURL=p-
|
|
149
|
+
//# sourceMappingURL=p-e36d53f0.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["getInitialsFromName","name","nameData","split","length","toUpperCase","currentUserInfoCss","CSS_BUNDLES","CHEVRON_DOWN_ICON","getIconPath","category","colorType","MY_ACCOUNT_ID","CHANGE_TEAM_ID","SIGN_OUT_ID","LANGUAGE_ID","GxIdeNewEnvironment","_GxIdeNewEnvironment_componentLocale","set","this","_GxIdeNewEnvironment_initials","_GxIdeNewEnvironment_menuDropdownModel","_GxIdeNewEnvironment_userLoginButton","_GxIdeNewEnvironment_dropDownitemClickHandler","_event","_target","itemId","myAccountCallback","changeTeamCallback","signOutCallback","changeLanguageCallback","componentWillLoad","__classPrivateFieldSet","Locale","getComponentStrings","el","userInfo","id","caption","__classPrivateFieldGet","myAccountLabel","showSeparator","changeTeamLabel","signOutLabel","render","h","Host","class","model","position","itemClickCallback","ref","slot","team","src","containerRef","onClick","showTermsCallback","privacyAndTerms"],"sources":["src/components/current-user-info/helpers.tsx","src/components/current-user-info/current-user-info.scss?tag=gx-ide-current-user-info&encapsulation=shadow","src/components/current-user-info/current-user-info.tsx"],"sourcesContent":["export const getInitialsFromName = (name: string): string => {\n const nameData = name.split(\" \");\n if (nameData.length === 1) {\n return nameData[0][0].toUpperCase();\n } else {\n return `${nameData[0][0].toUpperCase()}${nameData[1][0].toUpperCase()}`;\n }\n};\n","@import \"../../../node_modules/@genexus/mercury/dist/mercury.scss\";\n\n:host {\n display: inline-grid;\n justify-items: end;\n block-size: 100%;\n}\n\n.user-login {\n &__button {\n all: unset;\n display: grid;\n grid-template-columns: max-content max-content max-content;\n align-items: center;\n gap: var(--mer-spacing--sm);\n block-size: auto;\n cursor: pointer;\n }\n &__details {\n display: grid;\n grid-template-rows: max-content max-content;\n gap: var(--mer-spacing--3xs);\n justify-items: end;\n }\n &__name {\n font-weight: var(--mer-font__weight--medium);\n font-size: var(--mer-font__size--3xs);\n color: var(--mer-text__on-elevation);\n }\n &__organization {\n font-weight: var(--mer-font__weight--light);\n font-size: var(--mer-font__size--4xs);\n color: var(--mer-text__neutral);\n }\n &__avatar {\n font-size: 9px;\n flex: 0 0 auto;\n display: flex;\n align-items: center;\n justify-content: center;\n block-size: var(--mer-spacing--lg);\n inline-size: var(--mer-spacing--lg);\n color: var(--mer-text__on-elevation);\n border-radius: 50%;\n background-color: var(--mer-color__tinted-primary--10);\n border: var(--mer-border__width--sm) solid var(--mer-color__primary--200);\n }\n}\n\n.privacy-policy {\n text-decoration: underline;\n cursor: pointer;\n}\n","/* STENCIL IMPORTS */\nimport { Component, Element, Host, Prop, State, h } from \"@stencil/core\";\n\nimport { getIconPath, MercuryBundles } from \"@genexus/mercury\";\n\nimport { Locale } from \"../../common/locale\";\nimport { getInitialsFromName } from \"./helpers\";\nimport { DropdownModel } from \"@genexus/chameleon-controls-library\";\n\nconst CSS_BUNDLES: MercuryBundles = [\n // TODO: review if \"utils/form--full\" is required.\n \"resets/box-sizing\",\n \"components/tooltip\",\n \"components/toggle\",\n \"components/icon\",\n \"components/dropdown\",\n \"utils/layout\",\n \"utils/typography\",\n \"utils/spacing\",\n \"chameleon/scrollbar\"\n];\n\nconst CHEVRON_DOWN_ICON = getIconPath({\n category: \"navigation\",\n name: \"chevron-down\",\n colorType: \"neutral\"\n});\n\nconst MY_ACCOUNT_ID = \"my-account\";\nconst CHANGE_TEAM_ID = \"change-team\";\nconst SIGN_OUT_ID = \"sign-out\";\nconst LANGUAGE_ID = \"language\";\n\n@Component({\n tag: \"gx-ide-current-user-info\",\n styleUrl: \"current-user-info.scss\",\n shadow: true,\n assetsDirs: [\"gx-ide-assets/current-user-info\"]\n})\nexport class GxIdeNewEnvironment {\n #componentLocale: any;\n #initials: string = \"\";\n // #mode: Mode;\n #menuDropdownModel: DropdownModel;\n\n @Element() el: HTMLGxIdeCurrentUserInfoElement;\n #userLoginButton: HTMLButtonElement;\n\n @State() showMenu: boolean = false;\n\n /**\n * User data\n */\n @Prop() readonly userInfo: UserInfo;\n\n /**\n * Callback executed when the user click \"My Account\" link\n */\n @Prop() readonly myAccountCallback!: () => Promise<void>;\n\n /**\n * Callback executed when the user click \"change team\" link\n */\n @Prop() readonly changeTeamCallback!: () => Promise<void>;\n\n /**\n * Callback executed when the user click \"Language\" link\n */\n @Prop() readonly changeLanguageCallback!: () => Promise<void>;\n\n /**\n * Callback executed when the user switch the \"Mode\" status\n */\n @Prop() readonly changeModeCallback!: (mode: Mode) => Promise<void>;\n\n /**\n * Callback executed when the user click \"Sign Out\" link\n */\n @Prop() readonly signOutCallback!: () => Promise<void>;\n\n /**\n * Callback executed when the user click \"Privacy Policy & Terms of use\" link\n */\n @Prop() readonly showTermsCallback!: () => Promise<void>;\n\n async componentWillLoad() {\n this.#componentLocale = await Locale.getComponentStrings(this.el);\n this.#initials = getInitialsFromName(this.userInfo.name);\n this.#menuDropdownModel = [\n {\n id: MY_ACCOUNT_ID,\n caption: this.#componentLocale.myAccountLabel,\n showSeparator: false\n },\n {\n id: CHANGE_TEAM_ID,\n caption: this.#componentLocale.changeTeamLabel,\n showSeparator: false\n },\n {\n id: SIGN_OUT_ID,\n caption: this.#componentLocale.signOutLabel,\n showSeparator: true\n }\n // {\n // id: LANGUAGE_ID,\n // caption: this.#componentLocale.languageLabel,\n // showSeparator: true\n // }\n ];\n }\n\n // #handleModeSwitch = () => {\n // this.#mode = this.#mode === \"dark\" ? \"light\" : \"dark\";\n // if (this.changeModeCallback) {\n // this.changeModeCallback(this.#mode);\n // }\n // };\n\n #dropDownitemClickHandler = (\n _event: UIEvent,\n _target: string,\n itemId: string\n ): void => {\n if (itemId === MY_ACCOUNT_ID) {\n this.myAccountCallback();\n } else if (itemId === CHANGE_TEAM_ID) {\n this.changeTeamCallback();\n } else if (itemId === SIGN_OUT_ID) {\n this.signOutCallback();\n } else if (itemId === LANGUAGE_ID) {\n this.changeLanguageCallback();\n }\n };\n\n render() {\n return (\n <Host class=\"widget\">\n <ch-theme model={CSS_BUNDLES}></ch-theme>\n <ch-dropdown-render\n class=\"dropdown\"\n model={this.#menuDropdownModel}\n position=\"InsideEnd_OutsideEnd\"\n itemClickCallback={this.#dropDownitemClickHandler}\n >\n <button\n class=\"user-login__button\"\n ref={el => (this.#userLoginButton = el as HTMLButtonElement)}\n slot=\"action\"\n >\n <div class=\"user-login__details\">\n <span class=\"user-login__name\">{this.userInfo.name}</span>\n <span class=\"user-login__organization\">{this.userInfo.team}</span>\n </div>\n <div class=\"user-login__avatar\">{this.#initials}</div>\n <ch-image\n src={CHEVRON_DOWN_ICON}\n class=\"icon-md\"\n containerRef={this.#userLoginButton}\n ></ch-image>\n </button>\n <div class=\"user-login__footer footer-slot\" slot=\"footer\">\n <p\n class=\"text-body-regular-s privacy-policy\"\n onClick={this.showTermsCallback}\n >\n {this.#componentLocale.privacyAndTerms}\n </p>\n </div>\n </ch-dropdown-render>\n </Host>\n );\n }\n}\n\nexport type UserInfo = {\n name: string;\n team: string;\n};\n\nexport type Mode = \"dark\" | \"light\";\n"],"mappings":";;;;;;AAAO,MAAMA,sBAAuBC;EAClC,MAAMC,IAAWD,EAAKE,MAAM;EAC5B,IAAID,EAASE,WAAW,GAAG;IACzB,OAAOF,EAAS,GAAG,GAAGG;SACjB;IACL,OAAO,GAAGH,EAAS,GAAG,GAAGG,gBAAgBH,EAAS,GAAG,GAAGG;;;;ACL5D,MAAMC,IAAqB;;;;;;;;;;;;;;;;;ACS3B,MAAMC,IAA8B;;AAElC,qBACA,sBACA,qBACA,mBACA,uBACA,gBACA,oBACA,iBACA;;AAGF,MAAMC,IAAoBC,EAAY;EACpCC,UAAU;EACVT,MAAM;EACNU,WAAW;;;AAGb,MAAMC,IAAgB;;AACtB,MAAMC,IAAiB;;AACvB,MAAMC,IAAc;;AACpB,MAAMC,IAAc;;MAQPC,IAAmB;;;IAC9BC,EAAAC,IAAAC,WAAA;IACAC,EAAAF,IAAAC,MAAoB;;QAEpBE,EAAAH,IAAAC,WAAA;IAGAG,EAAAJ,IAAAC,WAAA;;;;;;;QAyEAI,EAAAL,IAAAC,OAA4B,CAC1BK,GACAC,GACAC;MAEA,IAAIA,MAAWd,GAAe;QAC5BO,KAAKQ;aACA,IAAID,MAAWb,GAAgB;QACpCM,KAAKS;aACA,IAAIF,MAAWZ,GAAa;QACjCK,KAAKU;aACA,IAAIH,MAAWX,GAAa;QACjCI,KAAKW;;;oBAnFoB;;;;;;;;;EAqC7B,uBAAMC;IACJC,EAAAb,MAAIF,SAA0BgB,EAAOC,oBAAoBf,KAAKgB,KAAG;IACjEH,EAAAb,MAAIC,GAAapB,oBAAoBmB,KAAKiB,SAASnC,OAAK;IACxD+B,EAAAb,MAAIE,GAAsB,EACxB;MACEgB,IAAIzB;MACJ0B,SAASC,EAAApB,MAAIF,GAAA,KAAkBuB;MAC/BC,eAAe;OAEjB;MACEJ,IAAIxB;MACJyB,SAASC,EAAApB,MAAIF,GAAA,KAAkByB;MAC/BD,eAAe;OAEjB;MACEJ,IAAIvB;MACJwB,SAASC,EAAApB,MAAIF,GAAA,KAAkB0B;MAC/BF,eAAe;SAOlB;;EA0BH,MAAAG;IACE,OACEC,EAACC,GAAI;MAACC,OAAM;OACVF,EAAA;MAAUG,OAAOzC;QACjBsC,EAAA;MACEE,OAAM;MACNC,OAAOT,EAAApB,MAAIE,GAAA;MACX4B,UAAS;MACTC,mBAAmBX,EAAApB,MAAII,GAAA;OAEvBsB,EAAA;MACEE,OAAM;MACNI,KAAKhB,KAAOH,EAAAb,MAAIG,GAAoBa,GAAuB;MAC3DiB,MAAK;OAELP,EAAA;MAAKE,OAAM;OACTF,EAAA;MAAME,OAAM;OAAoB5B,KAAKiB,SAASnC,OAC9C4C,EAAA;MAAME,OAAM;OAA4B5B,KAAKiB,SAASiB,QAExDR,EAAA;MAAKE,OAAM;OAAsBR,EAAApB,MAAIC,GAAA,OACrCyB,EAAA;MACES,KAAK9C;MACLuC,OAAM;MACNQ,cAAchB,EAAApB,MAAIG,GAAA;SAGtBuB,EAAA;MAAKE,OAAM;MAAiCK,MAAK;OAC/CP,EAAA;MACEE,OAAM;MACNS,SAASrC,KAAKsC;OAEblB,EAAApB,MAAIF,GAAA,KAAkByC"}
|