@genexus/genexus-ide-ui 1.0.30 → 1.0.32
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 +133 -0
- package/dist/cjs/gx-ide-current-user-info.cjs.entry.js.map +1 -0
- package/dist/cjs/gx-ide-select-user-team.cjs.entry.js +79 -0
- package/dist/cjs/gx-ide-select-user-team.cjs.entry.js.map +1 -0
- package/dist/cjs/gx-ide-sign-in-team.cjs.entry.js +123 -0
- package/dist/cjs/gx-ide-sign-in-team.cjs.entry.js.map +1 -0
- package/dist/cjs/gx-ide-sign-in.cjs.entry.js +62 -0
- package/dist/cjs/gx-ide-sign-in.cjs.entry.js.map +1 -0
- package/dist/cjs/gx-ide-splash.cjs.entry.js +1 -1
- package/dist/cjs/gx-ide-splash.cjs.entry.js.map +1 -1
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/collection/collection-manifest.json +4 -0
- package/dist/collection/components/current-user-info/current-user-info.css +55 -0
- package/dist/collection/components/current-user-info/current-user-info.js +280 -0
- package/dist/collection/components/current-user-info/current-user-info.js.map +1 -0
- package/dist/collection/components/current-user-info/gx-ide-assets/current-user-info/langs/current-user-info.lang.en.json +10 -0
- package/dist/collection/components/current-user-info/gx-ide-assets/current-user-info/langs/current-user-info.lang.ja.json +10 -0
- package/dist/collection/components/current-user-info/gx-ide-assets/current-user-info/langs/current-user-info.lang.zh.json +10 -0
- package/dist/collection/components/current-user-info/gx-ide-assets/current-user-info/shortcuts.json +15 -0
- package/dist/collection/components/current-user-info/helpers.js +10 -0
- package/dist/collection/components/current-user-info/helpers.js.map +1 -0
- package/dist/collection/components/select-user-team/gx-ide-assets/select-user-team/images/copyrights-illustration.png +0 -0
- package/dist/collection/components/select-user-team/gx-ide-assets/select-user-team/images/icon-next.svg +4 -0
- package/dist/collection/components/select-user-team/gx-ide-assets/select-user-team/langs/select-user-team.lang.en.json +10 -0
- package/dist/collection/components/select-user-team/gx-ide-assets/select-user-team/langs/select-user-team.lang.ja.json +10 -0
- package/dist/collection/components/select-user-team/gx-ide-assets/select-user-team/langs/select-user-team.lang.zh.json +10 -0
- package/dist/collection/components/select-user-team/helpers.js +9 -0
- package/dist/collection/components/select-user-team/helpers.js.map +1 -0
- package/dist/collection/components/select-user-team/select-user-team.css +62 -0
- package/dist/collection/components/select-user-team/select-user-team.js +118 -0
- package/dist/collection/components/select-user-team/select-user-team.js.map +1 -0
- package/dist/collection/components/sign-in/gx-ide-assets/sign-in/images/copyrights-illustration.png +0 -0
- package/dist/collection/components/sign-in/gx-ide-assets/sign-in/images/icon-next.svg +4 -0
- package/dist/collection/components/sign-in/gx-ide-assets/sign-in/langs/sign-in.lang.en.json +10 -0
- package/dist/collection/components/sign-in/gx-ide-assets/sign-in/langs/sign-in.lang.ja.json +10 -0
- package/dist/collection/components/sign-in/gx-ide-assets/sign-in/langs/sign-in.lang.zh.json +10 -0
- package/dist/collection/components/sign-in/sign-in.css +60 -0
- package/dist/collection/components/sign-in/sign-in.js +108 -0
- package/dist/collection/components/sign-in/sign-in.js.map +1 -0
- package/dist/collection/components/sign-in-team/gx-ide-assets/sign-in-team/images/copyrights-illustration.png +0 -0
- package/dist/collection/components/sign-in-team/gx-ide-assets/sign-in-team/images/icon-next.svg +4 -0
- package/dist/collection/components/sign-in-team/gx-ide-assets/sign-in-team/langs/sign-in-team.lang.en.json +18 -0
- package/dist/collection/components/sign-in-team/gx-ide-assets/sign-in-team/langs/sign-in-team.lang.ja.json +18 -0
- package/dist/collection/components/sign-in-team/gx-ide-assets/sign-in-team/langs/sign-in-team.lang.zh.json +18 -0
- package/dist/collection/components/sign-in-team/helpers.js +10 -0
- package/dist/collection/components/sign-in-team/helpers.js.map +1 -0
- package/dist/collection/components/sign-in-team/sign-in-team.css +92 -0
- package/dist/collection/components/sign-in-team/sign-in-team.js +234 -0
- package/dist/collection/components/sign-in-team/sign-in-team.js.map +1 -0
- package/dist/collection/components/splash/splash.js +1 -1
- package/dist/collection/components/splash/splash.js.map +1 -1
- package/dist/collection/testing/locale.e2e.js +4 -0
- package/dist/collection/testing/locale.e2e.js.map +1 -1
- package/dist/components/gx-ide-current-user-info.d.ts +11 -0
- package/dist/components/gx-ide-current-user-info.js +156 -0
- package/dist/components/gx-ide-current-user-info.js.map +1 -0
- package/dist/components/gx-ide-select-user-team.d.ts +11 -0
- package/dist/components/gx-ide-select-user-team.js +96 -0
- package/dist/components/gx-ide-select-user-team.js.map +1 -0
- package/dist/components/gx-ide-sign-in-team.d.ts +11 -0
- package/dist/components/gx-ide-sign-in-team.js +147 -0
- package/dist/components/gx-ide-sign-in-team.js.map +1 -0
- package/dist/components/gx-ide-sign-in.d.ts +11 -0
- package/dist/components/gx-ide-sign-in.js +79 -0
- package/dist/components/gx-ide-sign-in.js.map +1 -0
- package/dist/components/gx-ide-splash.js +1 -1
- package/dist/components/gx-ide-splash.js.map +1 -1
- package/dist/esm/genexus-ide-ui.js +1 -1
- package/dist/esm/gx-ide-current-user-info.entry.js +129 -0
- package/dist/esm/gx-ide-current-user-info.entry.js.map +1 -0
- package/dist/esm/gx-ide-select-user-team.entry.js +75 -0
- package/dist/esm/gx-ide-select-user-team.entry.js.map +1 -0
- package/dist/esm/gx-ide-sign-in-team.entry.js +119 -0
- package/dist/esm/gx-ide-sign-in-team.entry.js.map +1 -0
- package/dist/esm/gx-ide-sign-in.entry.js +58 -0
- package/dist/esm/gx-ide-sign-in.entry.js.map +1 -0
- package/dist/esm/gx-ide-splash.entry.js +1 -1
- package/dist/esm/gx-ide-splash.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 +10 -0
- package/dist/genexus-ide-ui/gx-ide-assets/current-user-info/langs/current-user-info.lang.ja.json +10 -0
- package/dist/genexus-ide-ui/gx-ide-assets/current-user-info/langs/current-user-info.lang.zh.json +10 -0
- package/dist/genexus-ide-ui/gx-ide-assets/current-user-info/shortcuts.json +15 -0
- package/dist/genexus-ide-ui/gx-ide-assets/select-user-team/images/copyrights-illustration.png +0 -0
- package/dist/genexus-ide-ui/gx-ide-assets/select-user-team/images/icon-next.svg +4 -0
- package/dist/genexus-ide-ui/gx-ide-assets/select-user-team/langs/select-user-team.lang.en.json +10 -0
- package/dist/genexus-ide-ui/gx-ide-assets/select-user-team/langs/select-user-team.lang.ja.json +10 -0
- package/dist/genexus-ide-ui/gx-ide-assets/select-user-team/langs/select-user-team.lang.zh.json +10 -0
- package/dist/genexus-ide-ui/gx-ide-assets/sign-in/images/copyrights-illustration.png +0 -0
- package/dist/genexus-ide-ui/gx-ide-assets/sign-in/images/icon-next.svg +4 -0
- package/dist/genexus-ide-ui/gx-ide-assets/sign-in/langs/sign-in.lang.en.json +10 -0
- package/dist/genexus-ide-ui/gx-ide-assets/sign-in/langs/sign-in.lang.ja.json +10 -0
- package/dist/genexus-ide-ui/gx-ide-assets/sign-in/langs/sign-in.lang.zh.json +10 -0
- package/dist/genexus-ide-ui/gx-ide-assets/sign-in-team/images/copyrights-illustration.png +0 -0
- package/dist/genexus-ide-ui/gx-ide-assets/sign-in-team/images/icon-next.svg +4 -0
- package/dist/genexus-ide-ui/gx-ide-assets/sign-in-team/langs/sign-in-team.lang.en.json +18 -0
- package/dist/genexus-ide-ui/gx-ide-assets/sign-in-team/langs/sign-in-team.lang.ja.json +18 -0
- package/dist/genexus-ide-ui/gx-ide-assets/sign-in-team/langs/sign-in-team.lang.zh.json +18 -0
- package/dist/genexus-ide-ui/p-90c8cb0d.entry.js +92 -0
- package/dist/genexus-ide-ui/p-90c8cb0d.entry.js.map +1 -0
- package/dist/genexus-ide-ui/p-b189e45d.entry.js +113 -0
- package/dist/genexus-ide-ui/p-b189e45d.entry.js.map +1 -0
- package/dist/genexus-ide-ui/p-edd6ebef.entry.js +149 -0
- package/dist/genexus-ide-ui/p-edd6ebef.entry.js.map +1 -0
- package/dist/genexus-ide-ui/{p-3c3b276e.entry.js → p-f0efd16f.entry.js} +2 -2
- package/dist/genexus-ide-ui/{p-3c3b276e.entry.js.map → p-f0efd16f.entry.js.map} +1 -1
- package/dist/genexus-ide-ui/p-fe063c9e.entry.js +162 -0
- package/dist/genexus-ide-ui/p-fe063c9e.entry.js.map +1 -0
- package/dist/types/components/current-user-info/current-user-info.d.ts +40 -0
- package/dist/types/components/current-user-info/helpers.d.ts +1 -0
- package/dist/types/components/select-user-team/helpers.d.ts +3 -0
- package/dist/types/components/select-user-team/select-user-team.d.ts +18 -0
- package/dist/types/components/sign-in/sign-in.d.ts +14 -0
- package/dist/types/components/sign-in-team/helpers.d.ts +3 -0
- package/dist/types/components/sign-in-team/sign-in-team.d.ts +42 -0
- package/dist/types/components.d.ts +186 -0
- package/package.json +3 -3
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
{
|
|
2
|
+
"illustrationAriaLabel": "GeneXus Next geometric shapes illustration",
|
|
3
|
+
"illustrationFigureAriaLabel": "Geometric shape illustration",
|
|
4
|
+
"illustrationAlternativeText": "GeneXus Next isologotype",
|
|
5
|
+
"title": "Welcome to GeneXus Next Desktop",
|
|
6
|
+
"descriptionText": "(This description is to be defined)",
|
|
7
|
+
"byContinuingTextFirstPart": "By continuing you agree to ",
|
|
8
|
+
"byContinuingCallBackText": "terms and conditions",
|
|
9
|
+
"signInButtonCaption": "Sign In"
|
|
10
|
+
}
|
|
@@ -0,0 +1,60 @@
|
|
|
1
|
+
:host {
|
|
2
|
+
display: grid;
|
|
3
|
+
block-size: 100%;
|
|
4
|
+
inline-size: 100%;
|
|
5
|
+
align-items: center;
|
|
6
|
+
justify-content: center;
|
|
7
|
+
padding: var(--mer-spacing--xl);
|
|
8
|
+
}
|
|
9
|
+
|
|
10
|
+
.slide {
|
|
11
|
+
display: grid;
|
|
12
|
+
max-inline-size: 1100px;
|
|
13
|
+
grid-template-columns: 1fr 550px;
|
|
14
|
+
background-color: var(--mer-surface__elevation--01);
|
|
15
|
+
border-radius: var(--mer-spacing--md);
|
|
16
|
+
overflow: hidden;
|
|
17
|
+
}
|
|
18
|
+
.slide__illustration {
|
|
19
|
+
overflow: hidden;
|
|
20
|
+
max-block-size: 700px;
|
|
21
|
+
}
|
|
22
|
+
.slide__sign-in {
|
|
23
|
+
display: grid;
|
|
24
|
+
block-size: 100%;
|
|
25
|
+
inline-size: 100%;
|
|
26
|
+
padding: var(--mer-spacing--3xl);
|
|
27
|
+
}
|
|
28
|
+
.slide__sign-in-container {
|
|
29
|
+
display: grid;
|
|
30
|
+
gap: var(--mer-spacing--lg);
|
|
31
|
+
max-inline-size: 480px;
|
|
32
|
+
place-self: center;
|
|
33
|
+
}
|
|
34
|
+
.slide__sign-in-header {
|
|
35
|
+
display: grid;
|
|
36
|
+
gap: var(--mer-spacing--lg);
|
|
37
|
+
}
|
|
38
|
+
.slide__sign-in-title {
|
|
39
|
+
font-size: var(--mer-font__size--xl);
|
|
40
|
+
color: var(--mer-text__on-surface);
|
|
41
|
+
letter-spacing: 0.02em;
|
|
42
|
+
font-weight: var(--mer-font__weight--semi-bold);
|
|
43
|
+
}
|
|
44
|
+
.slide__sign-in-description {
|
|
45
|
+
display: grid;
|
|
46
|
+
color: var(--mer-text__complementary);
|
|
47
|
+
gap: var(--mer-spacing--2xl);
|
|
48
|
+
font-size: var(--mer-font__size--sm);
|
|
49
|
+
font-weight: var(--mer-font__weight--light);
|
|
50
|
+
line-height: var(--mer-line-height--spaced);
|
|
51
|
+
}
|
|
52
|
+
|
|
53
|
+
.terms-conditions {
|
|
54
|
+
text-decoration: underline;
|
|
55
|
+
}
|
|
56
|
+
|
|
57
|
+
.sign-in-btn {
|
|
58
|
+
padding-inline-start: var(--mer-spacing--3xl) !important;
|
|
59
|
+
padding-inline-end: var(--mer-spacing--3xl) !important;
|
|
60
|
+
}
|
|
@@ -0,0 +1,108 @@
|
|
|
1
|
+
var __classPrivateFieldSet = (this && this.__classPrivateFieldSet) || function (receiver, state, value, kind, f) {
|
|
2
|
+
if (kind === "m")
|
|
3
|
+
throw new TypeError("Private method is not writable");
|
|
4
|
+
if (kind === "a" && !f)
|
|
5
|
+
throw new TypeError("Private accessor was defined without a setter");
|
|
6
|
+
if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver))
|
|
7
|
+
throw new TypeError("Cannot write private member to an object whose class did not declare it");
|
|
8
|
+
return (kind === "a" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value)), value;
|
|
9
|
+
};
|
|
10
|
+
var __classPrivateFieldGet = (this && this.__classPrivateFieldGet) || function (receiver, state, kind, f) {
|
|
11
|
+
if (kind === "a" && !f)
|
|
12
|
+
throw new TypeError("Private accessor was defined without a getter");
|
|
13
|
+
if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver))
|
|
14
|
+
throw new TypeError("Cannot read private member from an object whose class did not declare it");
|
|
15
|
+
return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
|
|
16
|
+
};
|
|
17
|
+
var _GxIdeUiSplash_componentLocale;
|
|
18
|
+
// Stencil
|
|
19
|
+
import { Host, h, getAssetPath } from "@stencil/core";
|
|
20
|
+
// Custom Imports
|
|
21
|
+
import { Locale } from "../../common/locale";
|
|
22
|
+
const COPYRIGHTS_ILLUSTRATION = getAssetPath(`./gx-ide-assets/welcome-page/images/copyrights-illustration.png`);
|
|
23
|
+
const ICON_NEXT = getAssetPath(`./gx-ide-assets/welcome-page/images/icon-next.svg`);
|
|
24
|
+
const CSS_BUNDLES = [
|
|
25
|
+
"resets/box-sizing",
|
|
26
|
+
"utils/typography",
|
|
27
|
+
"components/button"
|
|
28
|
+
];
|
|
29
|
+
export class GxIdeUiSplash {
|
|
30
|
+
constructor() {
|
|
31
|
+
/**
|
|
32
|
+
* The component hard-coded strings translations.
|
|
33
|
+
*/
|
|
34
|
+
// eslint-disable-next-line @stencil-community/own-props-must-be-private
|
|
35
|
+
_GxIdeUiSplash_componentLocale.set(this, void 0);
|
|
36
|
+
this.termsCallback = undefined;
|
|
37
|
+
this.signInCallback = undefined;
|
|
38
|
+
}
|
|
39
|
+
async componentWillLoad() {
|
|
40
|
+
__classPrivateFieldSet(this, _GxIdeUiSplash_componentLocale, await Locale.getComponentStrings(this.el), "f");
|
|
41
|
+
}
|
|
42
|
+
render() {
|
|
43
|
+
return (h(Host, null, h("ch-theme", { model: CSS_BUNDLES }), h("section", { class: "slide" }, h("div", { class: "slide__illustration", role: "img", "aria-label": __classPrivateFieldGet(this, _GxIdeUiSplash_componentLocale, "f").illustrationAriaLabel }, h("img", {
|
|
44
|
+
// base image (acts like a background)
|
|
45
|
+
src: COPYRIGHTS_ILLUSTRATION, class: "slide__illustration", alt: __classPrivateFieldGet(this, _GxIdeUiSplash_componentLocale, "f").illustrationFigureAriaLabel
|
|
46
|
+
})), h("div", { class: "slide__sign-in" }, h("div", { class: "slide__sign-in-container" }, h("header", { class: "slide__sign-in-header" }, h("img", { src: ICON_NEXT, alt: __classPrivateFieldGet(this, _GxIdeUiSplash_componentLocale, "f").illustrationAlternativeText }), h("h2", { class: "slide__sign-in-title" }, __classPrivateFieldGet(this, _GxIdeUiSplash_componentLocale, "f").title)), h("div", { class: "slide__sign-in-description" }, h("p", { hidden: true }, h("span", null, __classPrivateFieldGet(this, _GxIdeUiSplash_componentLocale, "f").descriptionText)), h("span", null, __classPrivateFieldGet(this, _GxIdeUiSplash_componentLocale, "f").byContinuingTextFirstPart, h("a", { class: "terms-conditions", onClick: this.termsCallback }, __classPrivateFieldGet(this, _GxIdeUiSplash_componentLocale, "f").byContinuingCallBackText))), h("div", null, h("button", { class: "button-primary sign-in-btn", onClick: this.signInCallback }, __classPrivateFieldGet(this, _GxIdeUiSplash_componentLocale, "f").signInButtonCaption)))))));
|
|
47
|
+
}
|
|
48
|
+
static get is() { return "gx-ide-sign-in"; }
|
|
49
|
+
static get encapsulation() { return "shadow"; }
|
|
50
|
+
static get originalStyleUrls() {
|
|
51
|
+
return {
|
|
52
|
+
"$": ["sign-in.scss"]
|
|
53
|
+
};
|
|
54
|
+
}
|
|
55
|
+
static get styleUrls() {
|
|
56
|
+
return {
|
|
57
|
+
"$": ["sign-in.css"]
|
|
58
|
+
};
|
|
59
|
+
}
|
|
60
|
+
static get assetsDirs() { return ["gx-ide-assets/sign-in"]; }
|
|
61
|
+
static get properties() {
|
|
62
|
+
return {
|
|
63
|
+
"termsCallback": {
|
|
64
|
+
"type": "unknown",
|
|
65
|
+
"mutable": false,
|
|
66
|
+
"complexType": {
|
|
67
|
+
"original": "() => Promise<void>",
|
|
68
|
+
"resolved": "() => Promise<void>",
|
|
69
|
+
"references": {
|
|
70
|
+
"Promise": {
|
|
71
|
+
"location": "global",
|
|
72
|
+
"id": "global::Promise"
|
|
73
|
+
}
|
|
74
|
+
}
|
|
75
|
+
},
|
|
76
|
+
"required": false,
|
|
77
|
+
"optional": false,
|
|
78
|
+
"docs": {
|
|
79
|
+
"tags": [],
|
|
80
|
+
"text": "Callback executed when the user click on the \"term and conditions\" link"
|
|
81
|
+
}
|
|
82
|
+
},
|
|
83
|
+
"signInCallback": {
|
|
84
|
+
"type": "unknown",
|
|
85
|
+
"mutable": false,
|
|
86
|
+
"complexType": {
|
|
87
|
+
"original": "() => Promise<void>",
|
|
88
|
+
"resolved": "() => Promise<void>",
|
|
89
|
+
"references": {
|
|
90
|
+
"Promise": {
|
|
91
|
+
"location": "global",
|
|
92
|
+
"id": "global::Promise"
|
|
93
|
+
}
|
|
94
|
+
}
|
|
95
|
+
},
|
|
96
|
+
"required": false,
|
|
97
|
+
"optional": false,
|
|
98
|
+
"docs": {
|
|
99
|
+
"tags": [],
|
|
100
|
+
"text": "Callback executed when the user click the Sign In button"
|
|
101
|
+
}
|
|
102
|
+
}
|
|
103
|
+
};
|
|
104
|
+
}
|
|
105
|
+
static get elementRef() { return "el"; }
|
|
106
|
+
}
|
|
107
|
+
_GxIdeUiSplash_componentLocale = new WeakMap();
|
|
108
|
+
//# sourceMappingURL=sign-in.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"sign-in.js","sourceRoot":"","sources":["../../../src/components/sign-in/sign-in.tsx"],"names":[],"mappings":";;;;;;;;;;;;AAAA,UAAU;AACV,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC;AAGhF,iBAAiB;AACjB,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAE7C,MAAM,uBAAuB,GAAG,YAAY,CAC1C,iEAAiE,CAClE,CAAC;AACF,MAAM,SAAS,GAAG,YAAY,CAC5B,mDAAmD,CACpD,CAAC;AACF,MAAM,WAAW,GAAmB;IAClC,mBAAmB;IACnB,kBAAkB;IAClB,mBAAmB;CACpB,CAAC;AAQF,MAAM,OAAO,aAAa;;QACxB;;WAEG;QACH,wEAAwE;QACxE,iDAAsB;;;;IActB,KAAK,CAAC,iBAAiB;QACrB,uBAAA,IAAI,kCAAoB,MAAM,MAAM,CAAC,mBAAmB,CAAC,IAAI,CAAC,EAAE,CAAC,MAAA,CAAC;IACpE,CAAC;IAED,MAAM;QACJ,OAAO,CACL,EAAC,IAAI;YACH,gBAAU,KAAK,EAAE,WAAW,GAAa;YACzC,eAAS,KAAK,EAAC,OAAO;gBACpB,WACE,KAAK,EAAC,qBAAqB,EAC3B,IAAI,EAAC,KAAK,gBACE,uBAAA,IAAI,sCAAiB,CAAC,qBAAqB;oBAEvD;wBACE,sCAAsC;wBACtC,GAAG,EAAE,uBAAuB,EAC5B,KAAK,EAAC,qBAAqB,EAC3B,GAAG,EAAE,uBAAA,IAAI,sCAAiB,CAAC,2BAA2B,GACtD,CACE;gBAEN,WAAK,KAAK,EAAC,gBAAgB;oBACzB,WAAK,KAAK,EAAC,0BAA0B;wBACnC,cAAQ,KAAK,EAAC,uBAAuB;4BACnC,WACE,GAAG,EAAE,SAAS,EACd,GAAG,EAAE,uBAAA,IAAI,sCAAiB,CAAC,2BAA2B,GACtD;4BACF,UAAI,KAAK,EAAC,sBAAsB,IAC7B,uBAAA,IAAI,sCAAiB,CAAC,KAAK,CACzB,CACE;wBACT,WAAK,KAAK,EAAC,4BAA4B;4BACrC,SAAG,MAAM;gCACP,gBAAO,uBAAA,IAAI,sCAAiB,CAAC,eAAe,CAAQ,CAClD;4BACJ;gCACG,uBAAA,IAAI,sCAAiB,CAAC,yBAAyB;gCAChD,SAAG,KAAK,EAAC,kBAAkB,EAAC,OAAO,EAAE,IAAI,CAAC,aAAa,IACpD,uBAAA,IAAI,sCAAiB,CAAC,wBAAwB,CAC7C,CACC,CACH;wBACN;4BACE,cACE,KAAK,EAAC,4BAA4B,EAClC,OAAO,EAAE,IAAI,CAAC,cAAc,IAE3B,uBAAA,IAAI,sCAAiB,CAAC,mBAAmB,CACnC,CACL,CACF,CACF,CACE,CACL,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["// Stencil\nimport { Component, Host, h, Prop, Element, getAssetPath } from \"@stencil/core\";\n// Other Libraries\nimport { MercuryBundles } from \"@genexus/mercury\";\n// Custom Imports\nimport { Locale } from \"../../common/locale\";\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];\n\n@Component({\n tag: \"gx-ide-sign-in\",\n styleUrl: \"sign-in.scss\",\n shadow: true,\n assetsDirs: [\"gx-ide-assets/sign-in\"]\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\n @Element() el: HTMLGxIdeSignInElement;\n\n /**\n * Callback executed when the user click on the \"term and conditions\" link\n */\n @Prop() readonly termsCallback: () => Promise<void>;\n\n /**\n * Callback executed when the user click the Sign In button\n */\n @Prop() readonly signInCallback: () => Promise<void>;\n\n async componentWillLoad() {\n this.#componentLocale = await Locale.getComponentStrings(this.el);\n }\n\n render() {\n return (\n <Host>\n <ch-theme model={CSS_BUNDLES}></ch-theme>\n <section class=\"slide\">\n <div\n class=\"slide__illustration\"\n role=\"img\"\n aria-label={this.#componentLocale.illustrationAriaLabel}\n >\n <img\n // base image (acts like a background)\n src={COPYRIGHTS_ILLUSTRATION}\n class=\"slide__illustration\"\n alt={this.#componentLocale.illustrationFigureAriaLabel}\n />\n </div>\n\n <div class=\"slide__sign-in\">\n <div class=\"slide__sign-in-container\">\n <header class=\"slide__sign-in-header\">\n <img\n src={ICON_NEXT}\n alt={this.#componentLocale.illustrationAlternativeText}\n />\n <h2 class=\"slide__sign-in-title\">\n {this.#componentLocale.title}\n </h2>\n </header>\n <div class=\"slide__sign-in-description\">\n <p hidden>\n <span>{this.#componentLocale.descriptionText}</span>\n </p>\n <span>\n {this.#componentLocale.byContinuingTextFirstPart}\n <a class=\"terms-conditions\" onClick={this.termsCallback}>\n {this.#componentLocale.byContinuingCallBackText}\n </a>\n </span>\n </div>\n <div>\n <button\n class=\"button-primary sign-in-btn\"\n onClick={this.signInCallback}\n >\n {this.#componentLocale.signInButtonCaption}\n </button>\n </div>\n </div>\n </div>\n </section>\n </Host>\n );\n }\n}\n"]}
|
|
Binary file
|
package/dist/collection/components/sign-in-team/gx-ide-assets/sign-in-team/images/icon-next.svg
ADDED
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
<svg width="30" height="31" viewBox="0 0 30 31" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
2
|
+
<path d="M0 3.7C0 2.5799 0 2.01984 0.217987 1.59202C0.409734 1.21569 0.715695 0.909734 1.09202 0.717987C1.51984 0.5 2.07989 0.5 3.2 0.5H26.8C27.9201 0.5 28.4802 0.5 28.908 0.717987C29.2843 0.909734 29.5903 1.21569 29.782 1.59202C30 2.01984 30 2.57989 30 3.7V27.3C30 28.4201 30 28.9802 29.782 29.408C29.5903 29.7843 29.2843 30.0903 28.908 30.282C28.4802 30.5 27.9201 30.5 26.8 30.5H3.2C2.0799 30.5 1.51984 30.5 1.09202 30.282C0.715695 30.0903 0.409734 29.7843 0.217987 29.408C0 28.9802 0 28.4201 0 27.3V3.7Z" fill="#5BA7FF"/>
|
|
3
|
+
<path d="M14.8361 26.63L7.73975 26.6245L15.8043 15.5027L7.73975 4.37271H14.8361L22.2543 15.5027L14.8361 26.6327V26.63Z" fill="black"/>
|
|
4
|
+
</svg>
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
{
|
|
2
|
+
"illustrationAriaLabel": "GeneXus Next geometric shapes illustration",
|
|
3
|
+
"signIn": {
|
|
4
|
+
"titlePart1": "Welcome to ",
|
|
5
|
+
"titlePart2": "GeneXus Next Desktop",
|
|
6
|
+
"description": "(This description is to be defined)",
|
|
7
|
+
"byContinuingText": "By continuing you agree to ",
|
|
8
|
+
"byContinuingCallBackText": "terms and conditions",
|
|
9
|
+
"buttonCaption": "Sign In"
|
|
10
|
+
},
|
|
11
|
+
"selectUserTeam": {
|
|
12
|
+
"titlePart1": "You have successfully ",
|
|
13
|
+
"titlePart2": "signed in",
|
|
14
|
+
"infoMessage": "Before proceeding please select your team from the list below",
|
|
15
|
+
"teamSelectorLabel": "Team",
|
|
16
|
+
"buttonCaption": "Continue"
|
|
17
|
+
}
|
|
18
|
+
}
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
{
|
|
2
|
+
"illustrationAriaLabel": "",
|
|
3
|
+
"signIn": {
|
|
4
|
+
"titlePart1": "",
|
|
5
|
+
"titlePart2": "",
|
|
6
|
+
"description": "",
|
|
7
|
+
"byContinuingText": "",
|
|
8
|
+
"byContinuingCallBackText": "",
|
|
9
|
+
"buttonCaption": ""
|
|
10
|
+
},
|
|
11
|
+
"selectUserTeam": {
|
|
12
|
+
"titlePart1": "",
|
|
13
|
+
"titlePart2": "",
|
|
14
|
+
"infoMessage": "",
|
|
15
|
+
"teamSelectorLabel": "",
|
|
16
|
+
"buttonCaption": ""
|
|
17
|
+
}
|
|
18
|
+
}
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
{
|
|
2
|
+
"illustrationAriaLabel": "",
|
|
3
|
+
"signIn": {
|
|
4
|
+
"titlePart1": "",
|
|
5
|
+
"titlePart2": "",
|
|
6
|
+
"description": "",
|
|
7
|
+
"byContinuingText": "",
|
|
8
|
+
"byContinuingCallBackText": "",
|
|
9
|
+
"buttonCaption": ""
|
|
10
|
+
},
|
|
11
|
+
"selectUserTeam": {
|
|
12
|
+
"titlePart1": "",
|
|
13
|
+
"titlePart2": "",
|
|
14
|
+
"infoMessage": "",
|
|
15
|
+
"teamSelectorLabel": "",
|
|
16
|
+
"buttonCaption": ""
|
|
17
|
+
}
|
|
18
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"helpers.js","sourceRoot":"","sources":["../../../src/components/sign-in-team/helpers.ts"],"names":[],"mappings":"AAGA,MAAM,CAAC,MAAM,2BAA2B,GAAG,CACzC,KAAkB,EACe,EAAE;IACnC,IAAI,CAAC,KAAK,EAAE;QACV,OAAO,EAAE,CAAC;KACX;IACD,OAAO,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;QACxB,KAAK,EAAE,IAAI,CAAC,EAAE;QACd,OAAO,EAAE,IAAI,CAAC,IAAI;KACnB,CAAC,CAAC,CAAC;AACN,CAAC,CAAC","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"]}
|
|
@@ -0,0 +1,92 @@
|
|
|
1
|
+
:host {
|
|
2
|
+
display: grid;
|
|
3
|
+
container-type: inline-size;
|
|
4
|
+
container-name: host-container;
|
|
5
|
+
block-size: 100%;
|
|
6
|
+
inline-size: 100%;
|
|
7
|
+
align-items: center;
|
|
8
|
+
justify-content: center;
|
|
9
|
+
padding: var(--mer-spacing--xl);
|
|
10
|
+
}
|
|
11
|
+
|
|
12
|
+
.slide {
|
|
13
|
+
display: grid;
|
|
14
|
+
grid-template-columns: 1fr 1fr;
|
|
15
|
+
block-size: 100%;
|
|
16
|
+
max-block-size: 700px;
|
|
17
|
+
max-inline-size: 1100px;
|
|
18
|
+
background-color: var(--mer-surface__elevation--01);
|
|
19
|
+
border-radius: var(--mer-spacing--md);
|
|
20
|
+
overflow: hidden;
|
|
21
|
+
}
|
|
22
|
+
.slide__illustration {
|
|
23
|
+
overflow: hidden;
|
|
24
|
+
object-fit: cover;
|
|
25
|
+
object-position: left;
|
|
26
|
+
block-size: 100%;
|
|
27
|
+
inline-size: 100%;
|
|
28
|
+
}
|
|
29
|
+
.slide__main {
|
|
30
|
+
display: grid;
|
|
31
|
+
block-size: 100%;
|
|
32
|
+
inline-size: 100%;
|
|
33
|
+
padding: var(--mer-spacing--3xl);
|
|
34
|
+
transform: translateY(var(--mer-spacing--2xs));
|
|
35
|
+
transition: var(--switch-step-transtion-time) all;
|
|
36
|
+
opacity: 0;
|
|
37
|
+
}
|
|
38
|
+
.slide__main--visible {
|
|
39
|
+
transform: translateY(0);
|
|
40
|
+
opacity: 1;
|
|
41
|
+
}
|
|
42
|
+
.slide__main-container {
|
|
43
|
+
display: grid;
|
|
44
|
+
place-self: center;
|
|
45
|
+
gap: var(--mer-spacing--lg);
|
|
46
|
+
max-inline-size: 480px;
|
|
47
|
+
}
|
|
48
|
+
.slide__main-header {
|
|
49
|
+
display: grid;
|
|
50
|
+
gap: var(--mer-spacing--lg);
|
|
51
|
+
}
|
|
52
|
+
.slide__main-title {
|
|
53
|
+
display: flex;
|
|
54
|
+
flex-direction: column;
|
|
55
|
+
font-size: var(--mer-font__size--xl);
|
|
56
|
+
font-weight: var(--mer-font__weight--semi-bold);
|
|
57
|
+
letter-spacing: 0.02em;
|
|
58
|
+
color: var(--mer-text__on-surface);
|
|
59
|
+
}
|
|
60
|
+
.slide__main-description {
|
|
61
|
+
display: grid;
|
|
62
|
+
gap: var(--mer-spacing--2xl);
|
|
63
|
+
font-size: var(--mer-font__size--sm);
|
|
64
|
+
font-weight: var(--mer-font__weight--light);
|
|
65
|
+
line-height: var(--mer-line-height--spaced);
|
|
66
|
+
color: var(--mer-text__complementary);
|
|
67
|
+
}
|
|
68
|
+
|
|
69
|
+
.terms-conditions {
|
|
70
|
+
text-decoration: underline;
|
|
71
|
+
}
|
|
72
|
+
|
|
73
|
+
.teams-list {
|
|
74
|
+
inline-size: 100%;
|
|
75
|
+
max-inline-size: 400px;
|
|
76
|
+
}
|
|
77
|
+
|
|
78
|
+
.main-btn {
|
|
79
|
+
inline-size: 100%;
|
|
80
|
+
max-inline-size: 124px;
|
|
81
|
+
}
|
|
82
|
+
|
|
83
|
+
@container host-container (max-width: 768px) {
|
|
84
|
+
.slide {
|
|
85
|
+
grid-template-columns: 1fr 2fr;
|
|
86
|
+
}
|
|
87
|
+
}
|
|
88
|
+
@container host-container (max-width: 640px) {
|
|
89
|
+
.slide {
|
|
90
|
+
grid-template-columns: 1fr 5fr;
|
|
91
|
+
}
|
|
92
|
+
}
|
|
@@ -0,0 +1,234 @@
|
|
|
1
|
+
var __classPrivateFieldGet = (this && this.__classPrivateFieldGet) || function (receiver, state, kind, f) {
|
|
2
|
+
if (kind === "a" && !f)
|
|
3
|
+
throw new TypeError("Private accessor was defined without a getter");
|
|
4
|
+
if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver))
|
|
5
|
+
throw new TypeError("Cannot read private member from an object whose class did not declare it");
|
|
6
|
+
return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
|
|
7
|
+
};
|
|
8
|
+
var __classPrivateFieldSet = (this && this.__classPrivateFieldSet) || function (receiver, state, value, kind, f) {
|
|
9
|
+
if (kind === "m")
|
|
10
|
+
throw new TypeError("Private method is not writable");
|
|
11
|
+
if (kind === "a" && !f)
|
|
12
|
+
throw new TypeError("Private accessor was defined without a setter");
|
|
13
|
+
if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver))
|
|
14
|
+
throw new TypeError("Cannot write private member to an object whose class did not declare it");
|
|
15
|
+
return (kind === "a" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value)), value;
|
|
16
|
+
};
|
|
17
|
+
var _GxIdeUiSplash_componentLocale, _GxIdeUiSplash_userTeamsModel, _GxIdeUiSplash_chSelectTeamEl, _GxIdeUiSplash_switchStepTransitionTime, _GxIdeUiSplash_authStepCallback, _GxIdeUiSplash_continueHandler;
|
|
18
|
+
// Stencil
|
|
19
|
+
import { Host, h, getAssetPath } from "@stencil/core";
|
|
20
|
+
// Custom Imports
|
|
21
|
+
import { Locale } from "../../common/locale";
|
|
22
|
+
import { mapTeamsToComboBoxItemModel } from "./helpers";
|
|
23
|
+
const COPYRIGHTS_ILLUSTRATION = getAssetPath(`./gx-ide-assets/welcome-page/images/copyrights-illustration.png`);
|
|
24
|
+
const ICON_NEXT = getAssetPath(`./gx-ide-assets/welcome-page/images/icon-next.svg`);
|
|
25
|
+
const CSS_BUNDLES = [
|
|
26
|
+
"resets/box-sizing",
|
|
27
|
+
"utils/typography",
|
|
28
|
+
"components/button",
|
|
29
|
+
"components/combo-box"
|
|
30
|
+
];
|
|
31
|
+
export class GxIdeUiSplash {
|
|
32
|
+
constructor() {
|
|
33
|
+
/**
|
|
34
|
+
* The component hard-coded strings translations.
|
|
35
|
+
*/
|
|
36
|
+
// eslint-disable-next-line @stencil-community/own-props-must-be-private
|
|
37
|
+
_GxIdeUiSplash_componentLocale.set(this, void 0);
|
|
38
|
+
// Select User Team References :
|
|
39
|
+
_GxIdeUiSplash_userTeamsModel.set(this, []);
|
|
40
|
+
_GxIdeUiSplash_chSelectTeamEl.set(this, void 0);
|
|
41
|
+
_GxIdeUiSplash_switchStepTransitionTime.set(this, 100);
|
|
42
|
+
_GxIdeUiSplash_authStepCallback.set(this, () => {
|
|
43
|
+
console.log("authStepCallback called");
|
|
44
|
+
if (this.authStep === "signIn") {
|
|
45
|
+
this.signInCallback();
|
|
46
|
+
}
|
|
47
|
+
else if (this.authStep === "selectUserTeam") {
|
|
48
|
+
__classPrivateFieldGet(this, _GxIdeUiSplash_continueHandler, "f").call(this);
|
|
49
|
+
}
|
|
50
|
+
});
|
|
51
|
+
_GxIdeUiSplash_continueHandler.set(this, async () => {
|
|
52
|
+
console.log("continueHandler called");
|
|
53
|
+
await this.continueCallback(__classPrivateFieldGet(this, _GxIdeUiSplash_chSelectTeamEl, "f").value);
|
|
54
|
+
});
|
|
55
|
+
this.authStepInternal = undefined;
|
|
56
|
+
this.slideIsVisible = true;
|
|
57
|
+
this.authStep = "signIn";
|
|
58
|
+
this.continueCallback = undefined;
|
|
59
|
+
this.signInCallback = undefined;
|
|
60
|
+
this.teams = undefined;
|
|
61
|
+
this.termsCallback = undefined;
|
|
62
|
+
}
|
|
63
|
+
authStepChanged(newAuthStep) {
|
|
64
|
+
console.log("authStep changed");
|
|
65
|
+
this.slideIsVisible = false;
|
|
66
|
+
// switch step
|
|
67
|
+
setTimeout(() => {
|
|
68
|
+
this.authStepInternal = newAuthStep;
|
|
69
|
+
}, __classPrivateFieldGet(this, _GxIdeUiSplash_switchStepTransitionTime, "f"));
|
|
70
|
+
// show slide
|
|
71
|
+
setTimeout(() => {
|
|
72
|
+
this.slideIsVisible = true;
|
|
73
|
+
}, __classPrivateFieldGet(this, _GxIdeUiSplash_switchStepTransitionTime, "f") * 2);
|
|
74
|
+
}
|
|
75
|
+
async componentWillLoad() {
|
|
76
|
+
__classPrivateFieldSet(this, _GxIdeUiSplash_componentLocale, await Locale.getComponentStrings(this.el), "f");
|
|
77
|
+
this.authStepInternal = this.authStep;
|
|
78
|
+
__classPrivateFieldSet(this, _GxIdeUiSplash_userTeamsModel, mapTeamsToComboBoxItemModel(this.teams), "f");
|
|
79
|
+
this.el.style.setProperty("--switch-step-transtion-time", __classPrivateFieldGet(this, _GxIdeUiSplash_switchStepTransitionTime, "f").toString() + "ms");
|
|
80
|
+
}
|
|
81
|
+
render() {
|
|
82
|
+
var _a;
|
|
83
|
+
console.log("userTeams comboBox model", __classPrivateFieldGet(this, _GxIdeUiSplash_userTeamsModel, "f"));
|
|
84
|
+
return (h(Host, null, h("ch-theme", { model: CSS_BUNDLES }), h("section", { class: "slide" }, h("img", { src: COPYRIGHTS_ILLUSTRATION, class: "slide__illustration", alt: "" // decorative
|
|
85
|
+
}), h("div", { class: {
|
|
86
|
+
"slide__main": true,
|
|
87
|
+
"slide__main--visible": this.slideIsVisible
|
|
88
|
+
} }, h("div", { class: "slide__main-container" }, h("header", { class: "slide__main-header" }, h("img", { src: ICON_NEXT, alt: "" // decorative
|
|
89
|
+
}), h("h2", {
|
|
90
|
+
// Split the title into two spans for better styling
|
|
91
|
+
class: "slide__main-title"
|
|
92
|
+
}, h("span", null, __classPrivateFieldGet(this, _GxIdeUiSplash_componentLocale, "f")[this.authStepInternal].titlePart1), h("span", null, __classPrivateFieldGet(this, _GxIdeUiSplash_componentLocale, "f")[this.authStepInternal].titlePart2))), this.authStepInternal === "signIn" ? (h("div", { class: "slide__main-description" }, h("p", { hidden: true }, h("span", null, __classPrivateFieldGet(this, _GxIdeUiSplash_componentLocale, "f").descriptionText)), h("span", null, __classPrivateFieldGet(this, _GxIdeUiSplash_componentLocale, "f").signIn.byContinuingText, h("a", { class: "terms-conditions", onClick: this.termsCallback }, __classPrivateFieldGet(this, _GxIdeUiSplash_componentLocale, "f").signIn.byContinuingCallBackText)))) : ([
|
|
93
|
+
h("div", { class: "slide__select-team-description" }, h("p", { class: "text-body-highlighted-l" }, __classPrivateFieldGet(this, _GxIdeUiSplash_componentLocale, "f").selectUserTeam.infoMessage)),
|
|
94
|
+
h("div", { class: "field-group" }, h("div", { class: "field field-block" }, h("label", { htmlFor: "teams" }, __classPrivateFieldGet(this, _GxIdeUiSplash_componentLocale, "f").teams), h("ch-combo-box-render", { id: "teams", accessibleName: "Teams", class: "combo-box teams-list", model: __classPrivateFieldGet(this, _GxIdeUiSplash_userTeamsModel, "f"), value: (_a = __classPrivateFieldGet(this, _GxIdeUiSplash_userTeamsModel, "f")[0]) === null || _a === void 0 ? void 0 : _a.value, ref: (el) => (__classPrivateFieldSet(this, _GxIdeUiSplash_chSelectTeamEl, el, "f")) })))
|
|
95
|
+
]), h("div", null, h("button", { class: "button-primary main-btn", onClick: __classPrivateFieldGet(this, _GxIdeUiSplash_authStepCallback, "f") }, __classPrivateFieldGet(this, _GxIdeUiSplash_componentLocale, "f")[this.authStepInternal].buttonCaption)))))));
|
|
96
|
+
}
|
|
97
|
+
static get is() { return "gx-ide-sign-in-team"; }
|
|
98
|
+
static get encapsulation() { return "shadow"; }
|
|
99
|
+
static get originalStyleUrls() {
|
|
100
|
+
return {
|
|
101
|
+
"$": ["sign-in-team.scss"]
|
|
102
|
+
};
|
|
103
|
+
}
|
|
104
|
+
static get styleUrls() {
|
|
105
|
+
return {
|
|
106
|
+
"$": ["sign-in-team.css"]
|
|
107
|
+
};
|
|
108
|
+
}
|
|
109
|
+
static get assetsDirs() { return ["gx-ide-assets/sign-in-team"]; }
|
|
110
|
+
static get properties() {
|
|
111
|
+
return {
|
|
112
|
+
"authStep": {
|
|
113
|
+
"type": "string",
|
|
114
|
+
"mutable": false,
|
|
115
|
+
"complexType": {
|
|
116
|
+
"original": "AuthStep",
|
|
117
|
+
"resolved": "\"selectUserTeam\" | \"signIn\"",
|
|
118
|
+
"references": {
|
|
119
|
+
"AuthStep": {
|
|
120
|
+
"location": "local",
|
|
121
|
+
"path": "/home/runner/work/genexus-ide-ui/genexus-ide-ui/src/components/sign-in-team/sign-in-team.tsx",
|
|
122
|
+
"id": "src/components/sign-in-team/sign-in-team.tsx::AuthStep"
|
|
123
|
+
}
|
|
124
|
+
}
|
|
125
|
+
},
|
|
126
|
+
"required": false,
|
|
127
|
+
"optional": false,
|
|
128
|
+
"docs": {
|
|
129
|
+
"tags": [],
|
|
130
|
+
"text": "The authentication step to display"
|
|
131
|
+
},
|
|
132
|
+
"attribute": "auth-step",
|
|
133
|
+
"reflect": false,
|
|
134
|
+
"defaultValue": "\"signIn\""
|
|
135
|
+
},
|
|
136
|
+
"continueCallback": {
|
|
137
|
+
"type": "unknown",
|
|
138
|
+
"mutable": false,
|
|
139
|
+
"complexType": {
|
|
140
|
+
"original": "(teamId: string) => Promise<void>",
|
|
141
|
+
"resolved": "(teamId: string) => Promise<void>",
|
|
142
|
+
"references": {
|
|
143
|
+
"Promise": {
|
|
144
|
+
"location": "global",
|
|
145
|
+
"id": "global::Promise"
|
|
146
|
+
}
|
|
147
|
+
}
|
|
148
|
+
},
|
|
149
|
+
"required": true,
|
|
150
|
+
"optional": false,
|
|
151
|
+
"docs": {
|
|
152
|
+
"tags": [],
|
|
153
|
+
"text": "Callback executed when the user clicks the 'Continue' button"
|
|
154
|
+
}
|
|
155
|
+
},
|
|
156
|
+
"signInCallback": {
|
|
157
|
+
"type": "unknown",
|
|
158
|
+
"mutable": false,
|
|
159
|
+
"complexType": {
|
|
160
|
+
"original": "() => Promise<void>",
|
|
161
|
+
"resolved": "() => Promise<void>",
|
|
162
|
+
"references": {
|
|
163
|
+
"Promise": {
|
|
164
|
+
"location": "global",
|
|
165
|
+
"id": "global::Promise"
|
|
166
|
+
}
|
|
167
|
+
}
|
|
168
|
+
},
|
|
169
|
+
"required": false,
|
|
170
|
+
"optional": false,
|
|
171
|
+
"docs": {
|
|
172
|
+
"tags": [],
|
|
173
|
+
"text": "Callback executed when the user click the \"Sign In\" button"
|
|
174
|
+
}
|
|
175
|
+
},
|
|
176
|
+
"teams": {
|
|
177
|
+
"type": "unknown",
|
|
178
|
+
"mutable": false,
|
|
179
|
+
"complexType": {
|
|
180
|
+
"original": "TeamData[]",
|
|
181
|
+
"resolved": "TeamData[]",
|
|
182
|
+
"references": {
|
|
183
|
+
"TeamData": {
|
|
184
|
+
"location": "local",
|
|
185
|
+
"path": "/home/runner/work/genexus-ide-ui/genexus-ide-ui/src/components/sign-in-team/sign-in-team.tsx",
|
|
186
|
+
"id": "src/components/sign-in-team/sign-in-team.tsx::TeamData"
|
|
187
|
+
}
|
|
188
|
+
}
|
|
189
|
+
},
|
|
190
|
+
"required": true,
|
|
191
|
+
"optional": false,
|
|
192
|
+
"docs": {
|
|
193
|
+
"tags": [],
|
|
194
|
+
"text": "Array that contains the user's teams"
|
|
195
|
+
}
|
|
196
|
+
},
|
|
197
|
+
"termsCallback": {
|
|
198
|
+
"type": "unknown",
|
|
199
|
+
"mutable": false,
|
|
200
|
+
"complexType": {
|
|
201
|
+
"original": "() => Promise<void>",
|
|
202
|
+
"resolved": "() => Promise<void>",
|
|
203
|
+
"references": {
|
|
204
|
+
"Promise": {
|
|
205
|
+
"location": "global",
|
|
206
|
+
"id": "global::Promise"
|
|
207
|
+
}
|
|
208
|
+
}
|
|
209
|
+
},
|
|
210
|
+
"required": false,
|
|
211
|
+
"optional": false,
|
|
212
|
+
"docs": {
|
|
213
|
+
"tags": [],
|
|
214
|
+
"text": "Callback executed when the user clicks on the \"term and conditions\" link"
|
|
215
|
+
}
|
|
216
|
+
}
|
|
217
|
+
};
|
|
218
|
+
}
|
|
219
|
+
static get states() {
|
|
220
|
+
return {
|
|
221
|
+
"authStepInternal": {},
|
|
222
|
+
"slideIsVisible": {}
|
|
223
|
+
};
|
|
224
|
+
}
|
|
225
|
+
static get elementRef() { return "el"; }
|
|
226
|
+
static get watchers() {
|
|
227
|
+
return [{
|
|
228
|
+
"propName": "authStep",
|
|
229
|
+
"methodName": "authStepChanged"
|
|
230
|
+
}];
|
|
231
|
+
}
|
|
232
|
+
}
|
|
233
|
+
_GxIdeUiSplash_componentLocale = new WeakMap(), _GxIdeUiSplash_userTeamsModel = new WeakMap(), _GxIdeUiSplash_chSelectTeamEl = new WeakMap(), _GxIdeUiSplash_switchStepTransitionTime = new WeakMap(), _GxIdeUiSplash_authStepCallback = new WeakMap(), _GxIdeUiSplash_continueHandler = new WeakMap();
|
|
234
|
+
//# sourceMappingURL=sign-in-team.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"sign-in-team.js","sourceRoot":"","sources":["../../../src/components/sign-in-team/sign-in-team.tsx"],"names":[],"mappings":";;;;;;;;;;;;AAAA,UAAU;AACV,OAAO,EACL,SAAS,EACT,IAAI,EACJ,CAAC,EACD,IAAI,EACJ,KAAK,EACL,KAAK,EACL,OAAO,EACP,YAAY,EACb,MAAM,eAAe,CAAC;AAIvB,iBAAiB;AACjB,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAC7C,OAAO,EAAE,2BAA2B,EAAE,MAAM,WAAW,CAAC;AAExD,MAAM,uBAAuB,GAAG,YAAY,CAC1C,iEAAiE,CAClE,CAAC;AACF,MAAM,SAAS,GAAG,YAAY,CAC5B,mDAAmD,CACpD,CAAC;AACF,MAAM,WAAW,GAAmB;IAClC,mBAAmB;IACnB,kBAAkB;IAClB,mBAAmB;IACnB,sBAAsB;CACvB,CAAC;AAQF,MAAM,OAAO,aAAa;;QACxB;;WAEG;QACH,wEAAwE;QACxE,iDAAsB;QACtB,gCAAgC;QAChC,wCAAuC,EAAE,EAAC;QAC1C,gDAA6C;QAC7C,kDAAoC,GAAG,EAAC;QAiExC,0CAAoB,GAAG,EAAE;YACvB,OAAO,CAAC,GAAG,CAAC,yBAAyB,CAAC,CAAC;YACvC,IAAI,IAAI,CAAC,QAAQ,KAAK,QAAQ,EAAE;gBAC9B,IAAI,CAAC,cAAc,EAAE,CAAC;aACvB;iBAAM,IAAI,IAAI,CAAC,QAAQ,KAAK,gBAAgB,EAAE;gBAC7C,uBAAA,IAAI,sCAAiB,MAArB,IAAI,CAAmB,CAAC;aACzB;QACH,CAAC,EAAC;QAEF,yCAAmB,KAAK,IAAI,EAAE;YAC5B,OAAO,CAAC,GAAG,CAAC,wBAAwB,CAAC,CAAC;YACtC,MAAM,IAAI,CAAC,gBAAgB,CAAC,uBAAA,IAAI,qCAAgB,CAAC,KAAK,CAAC,CAAC;QAC1D,CAAC,EAAC;;8BA9DiC,IAAI;wBAKD,QAAQ;;;;;;IAE9C,eAAe,CAAC,WAAqB;QACnC,OAAO,CAAC,GAAG,CAAC,kBAAkB,CAAC,CAAC;QAChC,IAAI,CAAC,cAAc,GAAG,KAAK,CAAC;QAC5B,cAAc;QACd,UAAU,CAAC,GAAG,EAAE;YACd,IAAI,CAAC,gBAAgB,GAAG,WAAW,CAAC;QACtC,CAAC,EAAE,uBAAA,IAAI,+CAA0B,CAAC,CAAC;QACnC,aAAa;QACb,UAAU,CAAC,GAAG,EAAE;YACd,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC;QAC7B,CAAC,EAAE,uBAAA,IAAI,+CAA0B,GAAG,CAAC,CAAC,CAAC;IACzC,CAAC;IAsBD,KAAK,CAAC,iBAAiB;QACrB,uBAAA,IAAI,kCAAoB,MAAM,MAAM,CAAC,mBAAmB,CAAC,IAAI,CAAC,EAAE,CAAC,MAAA,CAAC;QAClE,IAAI,CAAC,gBAAgB,GAAG,IAAI,CAAC,QAAQ,CAAC;QACtC,uBAAA,IAAI,iCAAmB,2BAA2B,CAAC,IAAI,CAAC,KAAK,CAAC,MAAA,CAAC;QAC/D,IAAI,CAAC,EAAE,CAAC,KAAK,CAAC,WAAW,CACvB,8BAA8B,EAC9B,uBAAA,IAAI,+CAA0B,CAAC,QAAQ,EAAE,GAAG,IAAI,CACjD,CAAC;IACJ,CAAC;IAgBD,MAAM;;QACJ,OAAO,CAAC,GAAG,CAAC,0BAA0B,EAAE,uBAAA,IAAI,qCAAgB,CAAC,CAAC;QAC9D,OAAO,CACL,EAAC,IAAI;YACH,gBAAU,KAAK,EAAE,WAAW,GAAa;YACzC,eAAS,KAAK,EAAC,OAAO;gBACpB,WACE,GAAG,EAAE,uBAAuB,EAC5B,KAAK,EAAC,qBAAqB,EAC3B,GAAG,EAAC,EAAE,CAAC,aAAa;mBACpB;gBAEF,WACE,KAAK,EAAE;wBACL,aAAa,EAAE,IAAI;wBACnB,sBAAsB,EAAE,IAAI,CAAC,cAAc;qBAC5C;oBAED,WAAK,KAAK,EAAC,uBAAuB;wBAChC,cAAQ,KAAK,EAAC,oBAAoB;4BAChC,WACE,GAAG,EAAE,SAAS,EACd,GAAG,EAAC,EAAE,CAAC,aAAa;+BACpB;4BACF;gCACE,oDAAoD;gCACpD,KAAK,EAAC,mBAAmB;gCAEzB,gBACG,uBAAA,IAAI,sCAAiB,CAAC,IAAI,CAAC,gBAAgB,CAAC,CAAC,UAAU,CACnD;gCACP,gBACG,uBAAA,IAAI,sCAAiB,CAAC,IAAI,CAAC,gBAAgB,CAAC,CAAC,UAAU,CACnD,CACJ,CACE;wBAER,IAAI,CAAC,gBAAgB,KAAK,QAAQ,CAAC,CAAC,CAAC,CACpC,WAAK,KAAK,EAAC,yBAAyB;4BAClC,SAAG,MAAM;gCACP,gBAAO,uBAAA,IAAI,sCAAiB,CAAC,eAAe,CAAQ,CAClD;4BACJ;gCACG,uBAAA,IAAI,sCAAiB,CAAC,MAAM,CAAC,gBAAgB;gCAC9C,SAAG,KAAK,EAAC,kBAAkB,EAAC,OAAO,EAAE,IAAI,CAAC,aAAa,IACpD,uBAAA,IAAI,sCAAiB,CAAC,MAAM,CAAC,wBAAwB,CACpD,CACC,CACH,CACP,CAAC,CAAC,CAAC,CACF;4BACE,WAAK,KAAK,EAAC,gCAAgC;gCACzC,SAAG,KAAK,EAAC,yBAAyB,IAC/B,uBAAA,IAAI,sCAAiB,CAAC,cAAc,CAAC,WAAW,CAC/C,CACA;4BAEN,WAAK,KAAK,EAAC,aAAa;gCACtB,WAAK,KAAK,EAAC,mBAAmB;oCAC5B,aAAO,OAAO,EAAC,OAAO,IACnB,uBAAA,IAAI,sCAAiB,CAAC,KAAK,CACtB;oCACR,2BACE,EAAE,EAAC,OAAO,EACV,cAAc,EAAC,OAAO,EACtB,KAAK,EAAC,sBAAsB,EAC5B,KAAK,EAAE,uBAAA,IAAI,qCAAgB,EAC3B,KAAK,EAAE,MAAA,uBAAA,IAAI,qCAAgB,CAAC,CAAC,CAAC,0CAAE,KAAK,EACrC,GAAG,EAAE,CAAC,EAA+B,EAAE,EAAE,CACvC,CAAC,uBAAA,IAAI,iCACH,EAAiC,MAAA,CAAC,GAEjB,CACnB,CACF;yBACP,CACF;wBAED;4BACE,cACE,KAAK,EAAC,yBAAyB,EAC/B,OAAO,EAAE,uBAAA,IAAI,uCAAkB,IAE9B,uBAAA,IAAI,sCAAiB,CAAC,IAAI,CAAC,gBAAgB,CAAC,CAAC,aAAa,CACpD,CACL,CACF,CACF,CACE,CACL,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["// 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 console.log(\"authStep changed\");\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\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.authStepInternal = this.authStep;\n this.#userTeamsModel = mapTeamsToComboBoxItemModel(this.teams);\n this.el.style.setProperty(\n \"--switch-step-transtion-time\",\n this.#switchStepTransitionTime.toString() + \"ms\"\n );\n }\n\n #authStepCallback = () => {\n console.log(\"authStepCallback called\");\n if (this.authStep === \"signIn\") {\n this.signInCallback();\n } else if (this.authStep === \"selectUserTeam\") {\n this.#continueHandler();\n }\n };\n\n #continueHandler = async () => {\n console.log(\"continueHandler called\");\n await this.continueCallback(this.#chSelectTeamEl.value);\n };\n\n render() {\n console.log(\"userTeams comboBox model\", this.#userTeamsModel);\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"]}
|