@visma-swno/customer-onboarding-wizard 1.0.11 → 1.0.13
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/README.md
CHANGED
|
@@ -51,6 +51,8 @@ import { CustomerOnboardingWizard } from '@visma-swno/customer-onboarding-wizard
|
|
|
51
51
|
| `locale` | String | `'en-US'` | No | Locale for translations. Accepted values: `en-US`, `en-GB` (mapped to `en-US`), `da-DK`, `fi-FI`, `nb-NO`, `nl-NL`, `sv-SE` |
|
|
52
52
|
| `step` | String | `'welcome'` | No | Initial step to navigate to: `welcome`, `company`, `administrators`, `partner-access`, `complete` |
|
|
53
53
|
| `adminUrl` | String | `''` | No | Absolute `http`/`https` URL to redirect to after task cleanup when the user clicks "Go to Admin" on the completion step. Relative paths and other schemes are ignored and the wizard closes without redirecting. |
|
|
54
|
+
| `userName` | String | `''` | **Yes** | Display name of the logged-in user. Set via the `user-name` HTML attribute (e.g. `[attr.user-name]="userName"` in Angular). The component does not call any profile API. |
|
|
55
|
+
| `userEmail` | String | `''` | No | Email of the logged-in user. Set via the `user-email` HTML attribute (e.g. `[attr.user-email]="userEmail"` in Angular). When provided, highlights the current user's row in the Administrators step. |
|
|
54
56
|
|
|
55
57
|
## CSS Custom Properties
|
|
56
58
|
|
|
@@ -116,7 +118,7 @@ The component emits custom events for host application integration:
|
|
|
116
118
|
|
|
117
119
|
### `request-token`
|
|
118
120
|
|
|
119
|
-
**Emitted**: Once
|
|
121
|
+
**Emitted**: Once after first render (after host property bindings are applied)
|
|
120
122
|
|
|
121
123
|
**Purpose**: Request OAuth2 access token from host application
|
|
122
124
|
|
|
@@ -8,8 +8,8 @@ export declare class CustomerOnboardingWizard extends LitElement {
|
|
|
8
8
|
customerId: string;
|
|
9
9
|
step: 'welcome' | 'company' | 'administrators' | 'partner-access' | 'complete';
|
|
10
10
|
private static readonly stepMap;
|
|
11
|
-
|
|
12
|
-
|
|
11
|
+
userName: string;
|
|
12
|
+
userEmail: string;
|
|
13
13
|
private currentStep;
|
|
14
14
|
private completedSteps;
|
|
15
15
|
private errorState;
|
|
@@ -21,6 +21,7 @@ export declare class CustomerOnboardingWizard extends LitElement {
|
|
|
21
21
|
private errorMessageListener;
|
|
22
22
|
private get steps();
|
|
23
23
|
connectedCallback(): void;
|
|
24
|
+
firstUpdated(): void;
|
|
24
25
|
disconnectedCallback(): void;
|
|
25
26
|
/**
|
|
26
27
|
* Set up listener for error-message events from HttpService
|
|
@@ -45,12 +46,6 @@ export declare class CustomerOnboardingWizard extends LitElement {
|
|
|
45
46
|
* @returns Promise that resolves with the authentication token
|
|
46
47
|
*/
|
|
47
48
|
private requestAuthToken;
|
|
48
|
-
/**
|
|
49
|
-
* Load user profile from API and set userName
|
|
50
|
-
* userName is populated from getUserProfile() API call
|
|
51
|
-
* Falls back to default 'User' if request fails
|
|
52
|
-
*/
|
|
53
|
-
private loadUserProfile;
|
|
54
49
|
/**
|
|
55
50
|
* Load customer data from API (details and subscriptions in parallel)
|
|
56
51
|
* Falls back gracefully if customerId is missing or requests fail
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { LitElement } from 'lit';
|
|
2
2
|
import { Translations, SupportedLocale } from '../../core/i18n.service';
|
|
3
|
-
import { HttpService
|
|
3
|
+
import { HttpService } from '../../core/http.service';
|
|
4
4
|
/**
|
|
5
5
|
* Administrators Step Component
|
|
6
6
|
* Manages administrator user accounts for the customer
|
|
@@ -10,7 +10,7 @@ export declare class WizardStep2Administrators extends LitElement {
|
|
|
10
10
|
httpService: HttpService | null;
|
|
11
11
|
customerId: string;
|
|
12
12
|
locale: SupportedLocale;
|
|
13
|
-
|
|
13
|
+
currentUserEmail: string;
|
|
14
14
|
private existingAdmins;
|
|
15
15
|
private isLoadingAdmins;
|
|
16
16
|
private rows;
|
package/dist/index.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { css as S, svg as y, LitElement as E, html as n, nothing as p } from "lit";
|
|
2
|
-
import { property as
|
|
2
|
+
import { property as d, customElement as A, state as l } from "lit/decorators.js";
|
|
3
3
|
S`:root{--font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif;--primary-color:#0066cc;--secondary-color:#6c757d;--success-color:#28a745;--danger-color:#dc3545;--warning-color:#ffc107;--info-color:#17a2b8;--background-color:#ffffff;--surface-color:#f8f9fa;--border-color:#dee2e6;--ga-text-primary:#212529;--ga-text-secondary:#6c757d;--spacing-xs:0.25rem;--spacing-sm:0.5rem;--spacing-md:1rem;--spacing-lg:1.5rem;--spacing-xl:2rem;--border-radius:4px;--box-shadow:0 2px 4px rgba(0,0,0,0.1);}*{box-sizing:border-box;}`;
|
|
4
|
-
const N = S`:host{--ga-color-black:#000;--ga-color-blue-10:#edf4fe;--ga-color-information-accent:var(--ga-color-utility-blue-accent);--ga-color-surface-information:var(--ga-color-information-accent);--ga-color-utility-blue-accent:var(--ga-color-blue-10);--ga-color-blue-40:#93bbf9;--ga-color-utility-blue:var(--ga-color-blue-40);--ga-color-blue-60:#366af6;--ga-color-border-information:var(--ga-color-information);--ga-color-icon-information:var(--ga-color-information);--ga-color-information:var(--ga-color-blue-60);--ga-color-border-action:var(--ga-color-primary);--ga-color-border-action-hover:var(--ga-color-primary-60);--ga-color-border-action-hover-2:var(--ga-color-secondary-30);--ga-color-border-disabled:var(--ga-color-neutral);--ga-color-border-error:var(--ga-color-error);--ga-color-border-focus:var(--ga-color-primary);--ga-color-border-primary:var(--ga-color-neutral-60);--ga-color-border-secondary:var(--ga-color-secondary-30);--ga-color-border-selected:var(--ga-color-green-60);--ga-color-border-success:var(--ga-color-success);--ga-color-border-tertiary:var(--ga-color-neutral);--ga-color-border-warning:var(--ga-color-warning);--ga-color-categorical-graph-01:#6769d8;--ga-color-categorical-graph-02:#479fc6;--ga-color-categorical-graph-03:var(--ga-color-teal-70);--ga-color-categorical-graph-04:#c0497d;--ga-color-categorical-graph-05:#041255;--ga-color-categorical-graph-06:#dc756b;--ga-color-categorical-graph-07:var(--ga-color-rose-40);--ga-color-categorical-graph-08:#984319;--ga-color-categorical-graph-09:var(--ga-color-indigo-40);--ga-color-categorical-graph-10:#610f08;--ga-color-cyan-60:#377ea0;--ga-color-icon-action-hover:var(--ga-color-primary-60);--ga-color-primary-60:var(--ga-color-cyan-60);--ga-color-surface-progress-2:var(--ga-color-primary-60);--ga-color-cyan-70:#2a6480;--ga-color-primary-70:var(--ga-color-cyan-70);--ga-color-surface-progress:var(--ga-color-primary-70);--ga-color-text-body-secondary:var(--ga-color-primary-70);--ga-color-cyan-80:#1f4e66;--ga-color-icon-action:var(--ga-color-primary);--ga-color-primary:var(--ga-color-cyan-80);--ga-color-surface-action:var(--ga-color-primary);--ga-color-text-action:var(--ga-color-primary);--ga-color-cyan-90:#133445;--ga-color-icon-primary:var(--ga-color-primary-90);--ga-color-primary-90:var(--ga-color-cyan-90);--ga-color-surface-action-hover:var(--ga-color-primary-90);--ga-color-text-action-hover:var(--ga-color-primary-90);--ga-color-text-body:var(--ga-color-primary-90);--ga-color-text-error:var(--ga-color-primary-90);--ga-color-text-headings:var(--ga-color-primary-90);--ga-color-text-information:var(--ga-color-primary-90);--ga-color-text-success:var(--ga-color-primary-90);--ga-color-text-warning:var(--ga-color-primary-90);--ga-color-diverging-graph-01:#281986;--ga-color-diverging-graph-02:#3d37a3;--ga-color-diverging-graph-03:#504fba;--ga-color-diverging-graph-04:#6769d8;--ga-color-diverging-graph-05:#8489f5;--ga-color-diverging-graph-06:var(--ga-color-indigo-40);--ga-color-diverging-graph-07:#c5cbfb;--ga-color-diverging-graph-08:var(--ga-color-indigo-10);--ga-color-diverging-graph-09:var(--ga-color-teal-30);--ga-color-diverging-graph-10:var(--ga-color-teal-40);--ga-color-diverging-graph-11:var(--ga-color-teal-50);--ga-color-diverging-graph-12:var(--ga-color-teal-60);--ga-color-diverging-graph-13:var(--ga-color-teal-70);--ga-color-diverging-graph-14:var(--ga-color-teal-80);--ga-color-diverging-graph-15:var(--ga-color-teal-90);--ga-color-error:var(--ga-color-red-60);--ga-color-icon-error:var(--ga-color-error);--ga-color-error-accent:var(--ga-color-utility-red-accent);--ga-color-green-10:#eef5ee;--ga-color-success-accent:var(--ga-color-utility-green-accent);--ga-color-surface-selected:var(--ga-color-green-10);--ga-color-surface-success:var(--ga-color-success-accent);--ga-color-utility-green-accent:var(--ga-color-green-10);--ga-color-green-40:#9bc59b;--ga-color-utility-green:var(--ga-color-green-40);--ga-color-green-60:#448548;--ga-color-icon-success:var(--ga-color-success);--ga-color-success:var(--ga-color-green-60);--ga-color-grey-10:#f2f2f2;--ga-color-utility-grey-accent:var(--ga-color-grey-10);--ga-color-grey-40:#b9b9b9;--ga-color-text-disabled:var(--ga-color-utility-grey);--ga-color-utility-grey:var(--ga-color-grey-40);--ga-color-icon-disabled:var(--ga-color-neutral);--ga-color-icon-on-action:var(--ga-color-secondary);--ga-color-icon-on-disabled:var(--ga-color-neutral-60);--ga-color-icon-on-primary:var(--ga-color-white);--ga-color-icon-warning:var(--ga-color-warning);--ga-color-indigo-10:#f0f2fe;--ga-color-utility-indigo-accent:var(--ga-color-indigo-10);--ga-color-indigo-40:#adb4f9;--ga-color-utility-indigo:var(--ga-color-indigo-40);--ga-color-lime-10:#edf6dd;--ga-color-utility-lime-accent:var(--ga-color-lime-10);--ga-color-lime-40:#a5c656;--ga-color-utility-lime:var(--ga-color-lime-40);--ga-color-miscellaneous-overlay:#70778891;--ga-color-miscellaneous-skeleton-element:var(--ga-color-neutral-10);--ga-color-miscellaneous-skeleton-highlight:var(--ga-color-neutral-20);--ga-color-neutral:var(--ga-color-neutral-30);--ga-color-neutral-10:#f2f3f5;--ga-color-surface-page:var(--ga-color-neutral-10);--ga-color-neutral-20:#e2e4e9;--ga-color-surface-container:var(--ga-color-neutral-20);--ga-color-surface-disabled:var(--ga-color-neutral-20);--ga-color-neutral-30:#cccfd7;--ga-color-neutral-60:#6f7687;--ga-color-surface-disable-selected:var(--ga-color-neutral-60);--ga-color-text-disable-selected:var(--ga-color-neutral-60);--ga-color-text-on-disabled:var(--ga-color-neutral-60);--ga-color-orange-10:#fcf0e7;--ga-color-secondary-10:var(--ga-color-orange-10);--ga-color-surface-warning:var(--ga-color-utility-orange-accent);--ga-color-text-on-action:var(--ga-color-secondary-10);--ga-color-utility-orange-accent:var(--ga-color-orange-10);--ga-color-warning-accent:var(--ga-color-utility-orange-accent);--ga-color-orange-20:#fae0ce;--ga-color-secondary:var(--ga-color-orange-20);--ga-color-surface-action-hover-2:var(--ga-color-orange-20);--ga-color-text-menu:var(--ga-color-secondary);--ga-color-orange-30:#f5c3a1;--ga-color-secondary-30:var(--ga-color-orange-30);--ga-color-surface-highlight:var(--ga-color-secondary-30);--ga-color-orange-40:#f2a676;--ga-color-utility-orange:var(--ga-color-orange-40);--ga-color-orange-60:#bb5822;--ga-color-warning:var(--ga-color-orange-60);--ga-color-pink-10:#fbeefc;--ga-color-utility-pink-accent:var(--ga-color-pink-10);--ga-color-pink-40:#e79dee;--ga-color-utility-pink:var(--ga-color-pink-40);--ga-color-purple-10:#f3f1fe;--ga-color-utility-purple-accent:var(--ga-color-purple-10);--ga-color-purple-40:#c3acf9;--ga-color-utility-purple:var(--ga-color-purple-40);--ga-color-purple-80:#591ab5;--ga-color-text-link-visited:var(--ga-color-purple-80);--ga-color-red-10:#fcf1ee;--ga-color-surface-error:var(--ga-color-utility-red-accent);--ga-color-utility-red-accent:var(--ga-color-red-10);--ga-color-red-40:#eca79e;--ga-color-utility-red:var(--ga-color-red-40);--ga-color-red-60:#cc453e;--ga-color-rose-10:#fcf0f4;--ga-color-utility-rose-accent:var(--ga-color-rose-10);--ga-color-rose-40:#efa1bd;--ga-color-utility-rose:var(--ga-color-rose-40);--ga-color-sequential-graph-10:var(--ga-color-teal-10);--ga-color-sequential-graph-20:var(--ga-color-teal-20);--ga-color-sequential-graph-30:var(--ga-color-teal-30);--ga-color-sequential-graph-40:var(--ga-color-teal-40);--ga-color-sequential-graph-50:var(--ga-color-teal-50);--ga-color-sequential-graph-60:var(--ga-color-teal-60);--ga-color-sequential-graph-70:var(--ga-color-teal-70);--ga-color-sequential-graph-80:var(--ga-color-teal-80);--ga-color-sequential-graph-90:var(--ga-color-teal-90);--ga-color-sequential-graph-100:var(--ga-color-teal-100);--ga-color-surface-primary:var(--ga-color-white);--ga-color-teal-10:#ecf5f4;--ga-color-utility-teal-accent:var(--ga-color-teal-10);--ga-color-teal-20:#d5e8e6;--ga-color-teal-30:#b4d7d4;--ga-color-teal-40:#92c3c0;--ga-color-utility-teal:var(--ga-color-teal-40);--ga-color-teal-50:#51a39e;--ga-color-teal-60:#3a837e;--ga-color-teal-70:#2c6764;--ga-color-teal-80:#21514e;--ga-color-teal-90:#143734;--ga-color-teal-100:#081f1f;--ga-color-white:#fff;--ga-duration-0:0ms;--ga-duration-fast:100ms;--ga-transition-state:var(--ga-duration-fast) 0ms var(--ga-easing-standard);--ga-duration-instant:50ms;--ga-transition-hover:var(--ga-duration-instant) 0ms var(--ga-easing-standard);--ga-duration-moderate:150ms;--ga-transition-dismiss:var(--ga-duration-moderate) 0ms var(--ga-easing-exit);--ga-transition-reveal:var(--ga-duration-moderate) 0ms var(--ga-easing-entrance);--ga-duration-slow:250ms;--ga-transition-overlay-in:var(--ga-duration-slow) 0ms var(--ga-easing-entrance);--ga-transition-overlay-out:var(--ga-duration-slow) 0ms var(--ga-easing-exit);--ga-duration-slower:400ms;--ga-transition-backdrop:var(--ga-duration-slower) 0ms var(--ga-easing-standard);--ga-easing-entrance:cubic-bezier(0,0,0.38,0.9);--ga-easing-exit:cubic-bezier(0.2,0,1,0.9);--ga-easing-standard:cubic-bezier(0.2,0,0.38,0.9);--ga-font-family-primary:"Inter",system-ui,sans-serif;--ga-font-weight-bold:700;--ga-font-weight-medium:500;--ga-font-weight-normal:400;--ga-font-weight-semibold:600;--ga-radius:4px;--ga-radius-round:999px;--ga-radius-sharp:0.02rem;--ga-shadow-east:-2px 0 5px 0 #1334451a,-8px 0 8px 0 #13344517,-19px 0 11px 0 #1334450d,-34px 0 14px 0 #13344503,-53px 0 15px 0 #13344500;--ga-shadow-north:0 4px 8px 0 #1334451a,0 15px 15px 0 #13344517,0 34px 21px 0 #1334450d,0 61px 24px 0 #13344503,0 95px 27px 0 #13344500;--ga-shadow-south:0 -1px 1px 0 #13344514,0 -2px 2px 0 #13344512,0 -6px 3px 0 #1334450a,0 -10px 4px 0 #13344503,0 -15px 4px 0 #13344500;--ga-shadow-west:1px 0 3px 0 #1334451a,5px 0 5px 0 #13344517,12px 0 7px 0 #1334450d,21px 0 8px 0 #13344503,33px 0 9px 0 #13344500;--ga-size-0:0;--ga-size-1:0.0625rem;--ga-size-2:0.125rem;--ga-size-4:0.25rem;--ga-size-6:0.375rem;--ga-size-8:0.5rem;--ga-size-10:0.625rem;--ga-size-11:0.6875rem;--ga-size-12:0.75rem;--ga-size-14:0.875rem;--ga-size-16:1rem;--ga-size-18:1.125rem;--ga-size-20:1.25rem;--ga-size-24:1.5rem;--ga-size-28:1.75rem;--ga-size-32:2rem;--ga-size-36:2.25rem;--ga-size-40:2.5rem;--ga-size-44:2.75rem;--ga-size-48:3rem;--ga-size-56:3.5rem;--ga-size-64:4rem;--ga-size-80:5rem;--ga-size-96:6rem;--ga-size-112:7rem;--ga-size-128:8rem;--ga-size-144:9rem;--ga-size-160:10rem;--ga-size-192:12rem;--ga-size-224:14rem;--ga-size-256:16rem;--ga-size-288:18rem;--ga-size-320:20rem;--ga-size-352:22rem;--ga-size-384:24rem;--ga-size-416:26rem;--ga-size-border-width-lg:4px;--ga-size-border-width-md:2px;--ga-size-border-width-none:0;--ga-size-border-width-sm:1px;--ga-size-spacing-00:0;--ga-size-spacing-01:0.125rem;--ga-size-spacing-02:0.25rem;--ga-size-spacing-03:0.5rem;--ga-size-spacing-04:0.75rem;--ga-size-spacing-05:1rem;--ga-size-spacing-06:1.5rem;--ga-size-spacing-07:2rem;--ga-size-spacing-08:2.5rem;--ga-size-spacing-09:3rem;--ga-size-spacing-10:4rem;--ga-size-spacing-11:5rem;--ga-size-spacing-12:6rem;--ga-size-spacing-13:10rem;--ga-text-2xl-font-size:1.5rem;--ga-text-2xl-font-style:normal;--ga-text-2xl-line-height:2rem;--ga-text-2xl-font-family:inherit;--ga-text-2xl-font-weight:400;--ga-text-2xl-letter-spacing:-0.019rem;--ga-text-2xl:var(--ga-text-2xl-font-style) var(--ga-text-2xl-font-weight) var(--ga-text-2xl-font-size)/var(--ga-text-2xl-line-height) var(--ga-text-2xl-font-family);--ga-text-3xl-font-size:2rem;--ga-text-3xl-font-style:normal;--ga-text-3xl-line-height:2.5rem;--ga-text-3xl-font-family:inherit;--ga-text-3xl-font-weight:400;--ga-text-3xl-letter-spacing:-0.022rem;--ga-text-3xl:var(--ga-text-3xl-font-style) var(--ga-text-3xl-font-weight) var(--ga-text-3xl-font-size)/var(--ga-text-3xl-line-height) var(--ga-text-3xl-font-family);--ga-text-lg-font-size:1rem;--ga-text-lg-font-style:normal;--ga-text-lg-line-height:1.5rem;--ga-text-lg-font-family:inherit;--ga-text-lg-font-weight:400;--ga-text-lg-letter-spacing:-0.011rem;--ga-text-lg:var(--ga-text-lg-font-style) var(--ga-text-lg-font-weight) var(--ga-text-lg-font-size)/var(--ga-text-lg-line-height) var(--ga-text-lg-font-family);--ga-text-md-font-size:0.875rem;--ga-text-md-font-style:normal;--ga-text-md-line-height:1.25rem;--ga-text-md-font-family:inherit;--ga-text-md-font-weight:400;--ga-text-md-letter-spacing:-0.006rem;--ga-text-md:var(--ga-text-md-font-style) var(--ga-text-md-font-weight) var(--ga-text-md-font-size)/var(--ga-text-md-line-height) var(--ga-text-md-font-family);--ga-text-sm-font-size:0.75rem;--ga-text-sm-font-style:normal;--ga-text-sm-line-height:1.25rem;--ga-text-sm-font-family:inherit;--ga-text-sm-font-weight:400;--ga-text-sm-letter-spacing:0;--ga-text-sm:var(--ga-text-sm-font-style) var(--ga-text-sm-font-weight) var(--ga-text-sm-font-size)/var(--ga-text-sm-line-height) var(--ga-text-sm-font-family);--ga-text-xl-font-size:1.125rem;--ga-text-xl-font-style:normal;--ga-text-xl-line-height:1.5rem;--ga-text-xl-font-family:inherit;--ga-text-xl-font-weight:400;--ga-text-xl-letter-spacing:-0.017rem;--ga-text-xl:var(--ga-text-xl-font-style) var(--ga-text-xl-font-weight) var(--ga-text-xl-font-size)/var(--ga-text-xl-line-height) var(--ga-text-xl-font-family);--ga-text-xs-font-size:0.6875rem;--ga-text-xs-font-style:normal;--ga-text-xs-line-height:1rem;--ga-text-xs-font-family:inherit;--ga-text-xs-font-weight:400;--ga-text-xs-letter-spacing:0.005rem;--ga-text-xs:var(--ga-text-xs-font-style) var(--ga-text-xs-font-weight) var(--ga-text-xs-font-size)/var(--ga-text-xs-line-height) var(--ga-text-xs-font-family);--vsn-customer-onboarding-wizard-font-family:var(--font-family,Inter,ui-sans-serif,system-ui,sans-serif);--ga-text-sm-size:var(--ga-text-sm-font-size);--ga-text-md-size:var(--ga-text-md-font-size);--ga-text-md-tracking:var(--ga-text-md-letter-spacing);--ga-text-xl-size:var(--ga-text-xl-font-size);--ga-text-xl-tracking:var(--ga-text-xl-letter-spacing);--ga-text-2xl-size:var(--ga-text-2xl-font-size);--ga-text-2xl-tracking:var(--ga-text-2xl-letter-spacing);--ga-size-content-2xs:11.25rem;--ga-size-content-xs:15rem;--ga-size-content-sm:22.5rem;--ga-color-utility-green-light:var(--ga-color-green-10);--ga-shadow-dropdown:var(--ga-shadow-south);}@media (width >= 48rem){:host{--ga-text-2xl-font-size:1.5rem;--ga-text-2xl-font-style:normal;--ga-text-2xl-line-height:2.5rem;--ga-text-2xl-font-family:inherit;--ga-text-2xl-font-weight:400;--ga-text-2xl-letter-spacing:-0.019rem;--ga-text-2xl:var(--ga-text-2xl-font-style) var(--ga-text-2xl-font-weight) var(--ga-text-2xl-font-size)/var(--ga-text-2xl-line-height) var(--ga-text-2xl-font-family);--ga-text-3xl-font-size:2.25rem;--ga-text-3xl-font-style:normal;--ga-text-3xl-line-height:3rem;--ga-text-3xl-font-family:inherit;--ga-text-3xl-font-weight:400;--ga-text-3xl-letter-spacing:-0.022rem;--ga-text-3xl:var(--ga-text-3xl-font-style) var(--ga-text-3xl-font-weight) var(--ga-text-3xl-font-size)/var(--ga-text-3xl-line-height) var(--ga-text-3xl-font-family);--ga-text-xl-font-size:1.25rem;--ga-text-xl-font-style:normal;--ga-text-xl-line-height:2rem;--ga-text-xl-font-family:inherit;--ga-text-xl-font-weight:400;--ga-text-xl-letter-spacing:-0.017rem;--ga-text-xl:var(--ga-text-xl-font-style) var(--ga-text-xl-font-weight) var(--ga-text-xl-font-size)/var(--ga-text-xl-line-height) var(--ga-text-xl-font-family);}}`, d = {
|
|
4
|
+
const N = S`:host{--ga-color-black:#000;--ga-color-blue-10:#edf4fe;--ga-color-information-accent:var(--ga-color-utility-blue-accent);--ga-color-surface-information:var(--ga-color-information-accent);--ga-color-utility-blue-accent:var(--ga-color-blue-10);--ga-color-blue-40:#93bbf9;--ga-color-utility-blue:var(--ga-color-blue-40);--ga-color-blue-60:#366af6;--ga-color-border-information:var(--ga-color-information);--ga-color-icon-information:var(--ga-color-information);--ga-color-information:var(--ga-color-blue-60);--ga-color-border-action:var(--ga-color-primary);--ga-color-border-action-hover:var(--ga-color-primary-60);--ga-color-border-action-hover-2:var(--ga-color-secondary-30);--ga-color-border-disabled:var(--ga-color-neutral);--ga-color-border-error:var(--ga-color-error);--ga-color-border-focus:var(--ga-color-primary);--ga-color-border-primary:var(--ga-color-neutral-60);--ga-color-border-secondary:var(--ga-color-secondary-30);--ga-color-border-selected:var(--ga-color-green-60);--ga-color-border-success:var(--ga-color-success);--ga-color-border-tertiary:var(--ga-color-neutral);--ga-color-border-warning:var(--ga-color-warning);--ga-color-categorical-graph-01:#6769d8;--ga-color-categorical-graph-02:#479fc6;--ga-color-categorical-graph-03:var(--ga-color-teal-70);--ga-color-categorical-graph-04:#c0497d;--ga-color-categorical-graph-05:#041255;--ga-color-categorical-graph-06:#dc756b;--ga-color-categorical-graph-07:var(--ga-color-rose-40);--ga-color-categorical-graph-08:#984319;--ga-color-categorical-graph-09:var(--ga-color-indigo-40);--ga-color-categorical-graph-10:#610f08;--ga-color-cyan-60:#377ea0;--ga-color-icon-action-hover:var(--ga-color-primary-60);--ga-color-primary-60:var(--ga-color-cyan-60);--ga-color-surface-progress-2:var(--ga-color-primary-60);--ga-color-cyan-70:#2a6480;--ga-color-primary-70:var(--ga-color-cyan-70);--ga-color-surface-progress:var(--ga-color-primary-70);--ga-color-text-body-secondary:var(--ga-color-primary-70);--ga-color-cyan-80:#1f4e66;--ga-color-icon-action:var(--ga-color-primary);--ga-color-primary:var(--ga-color-cyan-80);--ga-color-surface-action:var(--ga-color-primary);--ga-color-text-action:var(--ga-color-primary);--ga-color-cyan-90:#133445;--ga-color-icon-primary:var(--ga-color-primary-90);--ga-color-primary-90:var(--ga-color-cyan-90);--ga-color-surface-action-hover:var(--ga-color-primary-90);--ga-color-text-action-hover:var(--ga-color-primary-90);--ga-color-text-body:var(--ga-color-primary-90);--ga-color-text-error:var(--ga-color-primary-90);--ga-color-text-headings:var(--ga-color-primary-90);--ga-color-text-information:var(--ga-color-primary-90);--ga-color-text-success:var(--ga-color-primary-90);--ga-color-text-warning:var(--ga-color-primary-90);--ga-color-diverging-graph-01:#281986;--ga-color-diverging-graph-02:#3d37a3;--ga-color-diverging-graph-03:#504fba;--ga-color-diverging-graph-04:#6769d8;--ga-color-diverging-graph-05:#8489f5;--ga-color-diverging-graph-06:var(--ga-color-indigo-40);--ga-color-diverging-graph-07:#c5cbfb;--ga-color-diverging-graph-08:var(--ga-color-indigo-10);--ga-color-diverging-graph-09:var(--ga-color-teal-30);--ga-color-diverging-graph-10:var(--ga-color-teal-40);--ga-color-diverging-graph-11:var(--ga-color-teal-50);--ga-color-diverging-graph-12:var(--ga-color-teal-60);--ga-color-diverging-graph-13:var(--ga-color-teal-70);--ga-color-diverging-graph-14:var(--ga-color-teal-80);--ga-color-diverging-graph-15:var(--ga-color-teal-90);--ga-color-error:var(--ga-color-red-60);--ga-color-icon-error:var(--ga-color-error);--ga-color-error-accent:var(--ga-color-utility-red-accent);--ga-color-green-10:#eef5ee;--ga-color-success-accent:var(--ga-color-utility-green-accent);--ga-color-surface-selected:var(--ga-color-green-10);--ga-color-surface-success:var(--ga-color-success-accent);--ga-color-utility-green-accent:var(--ga-color-green-10);--ga-color-green-40:#9bc59b;--ga-color-utility-green:var(--ga-color-green-40);--ga-color-green-60:#448548;--ga-color-icon-success:var(--ga-color-success);--ga-color-success:var(--ga-color-green-60);--ga-color-grey-10:#f2f2f2;--ga-color-utility-grey-accent:var(--ga-color-grey-10);--ga-color-grey-40:#b9b9b9;--ga-color-text-disabled:var(--ga-color-utility-grey);--ga-color-utility-grey:var(--ga-color-grey-40);--ga-color-icon-disabled:var(--ga-color-neutral);--ga-color-icon-on-action:var(--ga-color-secondary);--ga-color-icon-on-disabled:var(--ga-color-neutral-60);--ga-color-icon-on-primary:var(--ga-color-white);--ga-color-icon-warning:var(--ga-color-warning);--ga-color-indigo-10:#f0f2fe;--ga-color-utility-indigo-accent:var(--ga-color-indigo-10);--ga-color-indigo-40:#adb4f9;--ga-color-utility-indigo:var(--ga-color-indigo-40);--ga-color-lime-10:#edf6dd;--ga-color-utility-lime-accent:var(--ga-color-lime-10);--ga-color-lime-40:#a5c656;--ga-color-utility-lime:var(--ga-color-lime-40);--ga-color-miscellaneous-overlay:#70778891;--ga-color-miscellaneous-skeleton-element:var(--ga-color-neutral-10);--ga-color-miscellaneous-skeleton-highlight:var(--ga-color-neutral-20);--ga-color-neutral:var(--ga-color-neutral-30);--ga-color-neutral-10:#f2f3f5;--ga-color-surface-page:var(--ga-color-neutral-10);--ga-color-neutral-20:#e2e4e9;--ga-color-surface-container:var(--ga-color-neutral-20);--ga-color-surface-disabled:var(--ga-color-neutral-20);--ga-color-neutral-30:#cccfd7;--ga-color-neutral-60:#6f7687;--ga-color-surface-disable-selected:var(--ga-color-neutral-60);--ga-color-text-disable-selected:var(--ga-color-neutral-60);--ga-color-text-on-disabled:var(--ga-color-neutral-60);--ga-color-orange-10:#fcf0e7;--ga-color-secondary-10:var(--ga-color-orange-10);--ga-color-surface-warning:var(--ga-color-utility-orange-accent);--ga-color-text-on-action:var(--ga-color-secondary-10);--ga-color-utility-orange-accent:var(--ga-color-orange-10);--ga-color-warning-accent:var(--ga-color-utility-orange-accent);--ga-color-orange-20:#fae0ce;--ga-color-secondary:var(--ga-color-orange-20);--ga-color-surface-action-hover-2:var(--ga-color-orange-20);--ga-color-text-menu:var(--ga-color-secondary);--ga-color-orange-30:#f5c3a1;--ga-color-secondary-30:var(--ga-color-orange-30);--ga-color-surface-highlight:var(--ga-color-secondary-30);--ga-color-orange-40:#f2a676;--ga-color-utility-orange:var(--ga-color-orange-40);--ga-color-orange-60:#bb5822;--ga-color-warning:var(--ga-color-orange-60);--ga-color-pink-10:#fbeefc;--ga-color-utility-pink-accent:var(--ga-color-pink-10);--ga-color-pink-40:#e79dee;--ga-color-utility-pink:var(--ga-color-pink-40);--ga-color-purple-10:#f3f1fe;--ga-color-utility-purple-accent:var(--ga-color-purple-10);--ga-color-purple-40:#c3acf9;--ga-color-utility-purple:var(--ga-color-purple-40);--ga-color-purple-80:#591ab5;--ga-color-text-link-visited:var(--ga-color-purple-80);--ga-color-red-10:#fcf1ee;--ga-color-surface-error:var(--ga-color-utility-red-accent);--ga-color-utility-red-accent:var(--ga-color-red-10);--ga-color-red-40:#eca79e;--ga-color-utility-red:var(--ga-color-red-40);--ga-color-red-60:#cc453e;--ga-color-rose-10:#fcf0f4;--ga-color-utility-rose-accent:var(--ga-color-rose-10);--ga-color-rose-40:#efa1bd;--ga-color-utility-rose:var(--ga-color-rose-40);--ga-color-sequential-graph-10:var(--ga-color-teal-10);--ga-color-sequential-graph-20:var(--ga-color-teal-20);--ga-color-sequential-graph-30:var(--ga-color-teal-30);--ga-color-sequential-graph-40:var(--ga-color-teal-40);--ga-color-sequential-graph-50:var(--ga-color-teal-50);--ga-color-sequential-graph-60:var(--ga-color-teal-60);--ga-color-sequential-graph-70:var(--ga-color-teal-70);--ga-color-sequential-graph-80:var(--ga-color-teal-80);--ga-color-sequential-graph-90:var(--ga-color-teal-90);--ga-color-sequential-graph-100:var(--ga-color-teal-100);--ga-color-surface-primary:var(--ga-color-white);--ga-color-teal-10:#ecf5f4;--ga-color-utility-teal-accent:var(--ga-color-teal-10);--ga-color-teal-20:#d5e8e6;--ga-color-teal-30:#b4d7d4;--ga-color-teal-40:#92c3c0;--ga-color-utility-teal:var(--ga-color-teal-40);--ga-color-teal-50:#51a39e;--ga-color-teal-60:#3a837e;--ga-color-teal-70:#2c6764;--ga-color-teal-80:#21514e;--ga-color-teal-90:#143734;--ga-color-teal-100:#081f1f;--ga-color-white:#fff;--ga-duration-0:0ms;--ga-duration-fast:100ms;--ga-transition-state:var(--ga-duration-fast) 0ms var(--ga-easing-standard);--ga-duration-instant:50ms;--ga-transition-hover:var(--ga-duration-instant) 0ms var(--ga-easing-standard);--ga-duration-moderate:150ms;--ga-transition-dismiss:var(--ga-duration-moderate) 0ms var(--ga-easing-exit);--ga-transition-reveal:var(--ga-duration-moderate) 0ms var(--ga-easing-entrance);--ga-duration-slow:250ms;--ga-transition-overlay-in:var(--ga-duration-slow) 0ms var(--ga-easing-entrance);--ga-transition-overlay-out:var(--ga-duration-slow) 0ms var(--ga-easing-exit);--ga-duration-slower:400ms;--ga-transition-backdrop:var(--ga-duration-slower) 0ms var(--ga-easing-standard);--ga-easing-entrance:cubic-bezier(0,0,0.38,0.9);--ga-easing-exit:cubic-bezier(0.2,0,1,0.9);--ga-easing-standard:cubic-bezier(0.2,0,0.38,0.9);--ga-font-family-primary:"Inter",system-ui,sans-serif;--ga-font-weight-bold:700;--ga-font-weight-medium:500;--ga-font-weight-normal:400;--ga-font-weight-semibold:600;--ga-radius:4px;--ga-radius-round:999px;--ga-radius-sharp:calc(0.02rem * var(--ga-base-scaling-factor,1));--ga-shadow-east:-2px 0 5px 0 #1334451a,-8px 0 8px 0 #13344517,-19px 0 11px 0 #1334450d,-34px 0 14px 0 #13344503,-53px 0 15px 0 #13344500;--ga-shadow-north:0 4px 8px 0 #1334451a,0 15px 15px 0 #13344517,0 34px 21px 0 #1334450d,0 61px 24px 0 #13344503,0 95px 27px 0 #13344500;--ga-shadow-south:0 -1px 1px 0 #13344514,0 -2px 2px 0 #13344512,0 -6px 3px 0 #1334450a,0 -10px 4px 0 #13344503,0 -15px 4px 0 #13344500;--ga-shadow-west:1px 0 3px 0 #1334451a,5px 0 5px 0 #13344517,12px 0 7px 0 #1334450d,21px 0 8px 0 #13344503,33px 0 9px 0 #13344500;--ga-size-0:0;--ga-size-1:calc(0.0625rem * var(--ga-base-scaling-factor,1));--ga-size-2:calc(0.125rem * var(--ga-base-scaling-factor,1));--ga-size-4:calc(0.25rem * var(--ga-base-scaling-factor,1));--ga-size-6:calc(0.375rem * var(--ga-base-scaling-factor,1));--ga-size-8:calc(0.5rem * var(--ga-base-scaling-factor,1));--ga-size-10:calc(0.625rem * var(--ga-base-scaling-factor,1));--ga-size-11:calc(0.6875rem * var(--ga-base-scaling-factor,1));--ga-size-12:calc(0.75rem * var(--ga-base-scaling-factor,1));--ga-size-14:calc(0.875rem * var(--ga-base-scaling-factor,1));--ga-size-16:calc(1rem * var(--ga-base-scaling-factor,1));--ga-size-18:calc(1.125rem * var(--ga-base-scaling-factor,1));--ga-size-20:calc(1.25rem * var(--ga-base-scaling-factor,1));--ga-size-24:calc(1.5rem * var(--ga-base-scaling-factor,1));--ga-size-28:calc(1.75rem * var(--ga-base-scaling-factor,1));--ga-size-32:calc(2rem * var(--ga-base-scaling-factor,1));--ga-size-36:calc(2.25rem * var(--ga-base-scaling-factor,1));--ga-size-40:calc(2.5rem * var(--ga-base-scaling-factor,1));--ga-size-44:calc(2.75rem * var(--ga-base-scaling-factor,1));--ga-size-48:calc(3rem * var(--ga-base-scaling-factor,1));--ga-size-56:calc(3.5rem * var(--ga-base-scaling-factor,1));--ga-size-64:calc(4rem * var(--ga-base-scaling-factor,1));--ga-size-80:calc(5rem * var(--ga-base-scaling-factor,1));--ga-size-96:calc(6rem * var(--ga-base-scaling-factor,1));--ga-size-112:calc(7rem * var(--ga-base-scaling-factor,1));--ga-size-128:calc(8rem * var(--ga-base-scaling-factor,1));--ga-size-144:calc(9rem * var(--ga-base-scaling-factor,1));--ga-size-160:calc(10rem * var(--ga-base-scaling-factor,1));--ga-size-192:calc(12rem * var(--ga-base-scaling-factor,1));--ga-size-224:calc(14rem * var(--ga-base-scaling-factor,1));--ga-size-256:calc(16rem * var(--ga-base-scaling-factor,1));--ga-size-288:calc(18rem * var(--ga-base-scaling-factor,1));--ga-size-320:calc(20rem * var(--ga-base-scaling-factor,1));--ga-size-352:calc(22rem * var(--ga-base-scaling-factor,1));--ga-size-384:calc(24rem * var(--ga-base-scaling-factor,1));--ga-size-416:calc(26rem * var(--ga-base-scaling-factor,1));--ga-size-border-width-lg:4px;--ga-size-border-width-md:2px;--ga-size-border-width-none:0;--ga-size-border-width-sm:1px;--ga-size-spacing-00:0;--ga-size-spacing-01:calc(0.125rem * var(--ga-base-scaling-factor,1));--ga-size-spacing-02:calc(0.25rem * var(--ga-base-scaling-factor,1));--ga-size-spacing-03:calc(0.5rem * var(--ga-base-scaling-factor,1));--ga-size-spacing-04:calc(0.75rem * var(--ga-base-scaling-factor,1));--ga-size-spacing-05:calc(1rem * var(--ga-base-scaling-factor,1));--ga-size-spacing-06:calc(1.5rem * var(--ga-base-scaling-factor,1));--ga-size-spacing-07:calc(2rem * var(--ga-base-scaling-factor,1));--ga-size-spacing-08:calc(2.5rem * var(--ga-base-scaling-factor,1));--ga-size-spacing-09:calc(3rem * var(--ga-base-scaling-factor,1));--ga-size-spacing-10:calc(4rem * var(--ga-base-scaling-factor,1));--ga-size-spacing-11:calc(5rem * var(--ga-base-scaling-factor,1));--ga-size-spacing-12:calc(6rem * var(--ga-base-scaling-factor,1));--ga-size-spacing-13:calc(10rem * var(--ga-base-scaling-factor,1));--ga-text-2xl-font-size:calc(1.5rem * var(--ga-base-scaling-factor,1));--ga-text-2xl-font-style:normal;--ga-text-2xl-line-height:calc(2rem * var(--ga-base-scaling-factor,1));--ga-text-2xl-font-family:inherit;--ga-text-2xl-font-weight:400;--ga-text-2xl-letter-spacing:calc(-0.019rem * var(--ga-base-scaling-factor,1));--ga-text-2xl:var(--ga-text-2xl-font-style) var(--ga-text-2xl-font-weight) var(--ga-text-2xl-font-size)/var(--ga-text-2xl-line-height) var(--ga-text-2xl-font-family);--ga-text-3xl-font-size:calc(2rem * var(--ga-base-scaling-factor,1));--ga-text-3xl-font-style:normal;--ga-text-3xl-line-height:calc(2.5rem * var(--ga-base-scaling-factor,1));--ga-text-3xl-font-family:inherit;--ga-text-3xl-font-weight:400;--ga-text-3xl-letter-spacing:calc(-0.022rem * var(--ga-base-scaling-factor,1));--ga-text-3xl:var(--ga-text-3xl-font-style) var(--ga-text-3xl-font-weight) var(--ga-text-3xl-font-size)/var(--ga-text-3xl-line-height) var(--ga-text-3xl-font-family);--ga-text-lg-font-size:calc(1rem * var(--ga-base-scaling-factor,1));--ga-text-lg-font-style:normal;--ga-text-lg-line-height:calc(1.5rem * var(--ga-base-scaling-factor,1));--ga-text-lg-font-family:inherit;--ga-text-lg-font-weight:400;--ga-text-lg-letter-spacing:calc(-0.011rem * var(--ga-base-scaling-factor,1));--ga-text-lg:var(--ga-text-lg-font-style) var(--ga-text-lg-font-weight) var(--ga-text-lg-font-size)/var(--ga-text-lg-line-height) var(--ga-text-lg-font-family);--ga-text-md-font-size:calc(0.875rem * var(--ga-base-scaling-factor,1));--ga-text-md-font-style:normal;--ga-text-md-line-height:calc(1.25rem * var(--ga-base-scaling-factor,1));--ga-text-md-font-family:inherit;--ga-text-md-font-weight:400;--ga-text-md-letter-spacing:calc(-0.006rem * var(--ga-base-scaling-factor,1));--ga-text-md:var(--ga-text-md-font-style) var(--ga-text-md-font-weight) var(--ga-text-md-font-size)/var(--ga-text-md-line-height) var(--ga-text-md-font-family);--ga-text-sm-font-size:calc(0.75rem * var(--ga-base-scaling-factor,1));--ga-text-sm-font-style:normal;--ga-text-sm-line-height:calc(1.25rem * var(--ga-base-scaling-factor,1));--ga-text-sm-font-family:inherit;--ga-text-sm-font-weight:400;--ga-text-sm-letter-spacing:0;--ga-text-sm:var(--ga-text-sm-font-style) var(--ga-text-sm-font-weight) var(--ga-text-sm-font-size)/var(--ga-text-sm-line-height) var(--ga-text-sm-font-family);--ga-text-xl-font-size:calc(1.125rem * var(--ga-base-scaling-factor,1));--ga-text-xl-font-style:normal;--ga-text-xl-line-height:calc(1.5rem * var(--ga-base-scaling-factor,1));--ga-text-xl-font-family:inherit;--ga-text-xl-font-weight:400;--ga-text-xl-letter-spacing:calc(-0.017rem * var(--ga-base-scaling-factor,1));--ga-text-xl:var(--ga-text-xl-font-style) var(--ga-text-xl-font-weight) var(--ga-text-xl-font-size)/var(--ga-text-xl-line-height) var(--ga-text-xl-font-family);--ga-text-xs-font-size:calc(0.6875rem * var(--ga-base-scaling-factor,1));--ga-text-xs-font-style:normal;--ga-text-xs-line-height:calc(1rem * var(--ga-base-scaling-factor,1));--ga-text-xs-font-family:inherit;--ga-text-xs-font-weight:400;--ga-text-xs-letter-spacing:calc(0.005rem * var(--ga-base-scaling-factor,1));--ga-text-xs:var(--ga-text-xs-font-style) var(--ga-text-xs-font-weight) var(--ga-text-xs-font-size)/var(--ga-text-xs-line-height) var(--ga-text-xs-font-family);--vsn-customer-onboarding-wizard-font-family:var(--font-family,Inter,ui-sans-serif,system-ui,sans-serif);--ga-text-sm-size:var(--ga-text-sm-font-size);--ga-text-md-size:var(--ga-text-md-font-size);--ga-text-md-tracking:var(--ga-text-md-letter-spacing);--ga-text-xl-size:var(--ga-text-xl-font-size);--ga-text-xl-tracking:var(--ga-text-xl-letter-spacing);--ga-text-2xl-size:var(--ga-text-2xl-font-size);--ga-text-2xl-tracking:var(--ga-text-2xl-letter-spacing);--ga-size-content-2xs:calc(11.25rem * var(--ga-base-scaling-factor,1));--ga-size-content-xs:calc(15rem * var(--ga-base-scaling-factor,1));--ga-size-content-sm:calc(22.5rem * var(--ga-base-scaling-factor,1));--ga-color-utility-green-light:var(--ga-color-green-10);--ga-shadow-dropdown:var(--ga-shadow-south);}@media (width >= 48rem){:host{--ga-text-2xl-font-size:calc(1.5rem * var(--ga-base-scaling-factor,1));--ga-text-2xl-font-style:normal;--ga-text-2xl-line-height:calc(2.5rem * var(--ga-base-scaling-factor,1));--ga-text-2xl-font-family:inherit;--ga-text-2xl-font-weight:400;--ga-text-2xl-letter-spacing:calc(-0.019rem * var(--ga-base-scaling-factor,1));--ga-text-2xl:var(--ga-text-2xl-font-style) var(--ga-text-2xl-font-weight) var(--ga-text-2xl-font-size)/var(--ga-text-2xl-line-height) var(--ga-text-2xl-font-family);--ga-text-3xl-font-size:calc(2.25rem * var(--ga-base-scaling-factor,1));--ga-text-3xl-font-style:normal;--ga-text-3xl-line-height:calc(3rem * var(--ga-base-scaling-factor,1));--ga-text-3xl-font-family:inherit;--ga-text-3xl-font-weight:400;--ga-text-3xl-letter-spacing:calc(-0.022rem * var(--ga-base-scaling-factor,1));--ga-text-3xl:var(--ga-text-3xl-font-style) var(--ga-text-3xl-font-weight) var(--ga-text-3xl-font-size)/var(--ga-text-3xl-line-height) var(--ga-text-3xl-font-family);--ga-text-xl-font-size:calc(1.25rem * var(--ga-base-scaling-factor,1));--ga-text-xl-font-style:normal;--ga-text-xl-line-height:calc(2rem * var(--ga-base-scaling-factor,1));--ga-text-xl-font-family:inherit;--ga-text-xl-font-weight:400;--ga-text-xl-letter-spacing:calc(-0.017rem * var(--ga-base-scaling-factor,1));--ga-text-xl:var(--ga-text-xl-font-style) var(--ga-text-xl-font-weight) var(--ga-text-xl-font-size)/var(--ga-text-xl-line-height) var(--ga-text-xl-font-family);}}`, c = {
|
|
5
5
|
circle: () => y`
|
|
6
6
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
7
7
|
<circle cx="12" cy="12" r="10"/>
|
|
@@ -756,7 +756,7 @@ const N = S`:host{--ga-color-black:#000;--ga-color-blue-10:#edf4fe;--ga-color-in
|
|
|
756
756
|
}
|
|
757
757
|
}
|
|
758
758
|
};
|
|
759
|
-
class
|
|
759
|
+
class T {
|
|
760
760
|
constructor() {
|
|
761
761
|
this.currentLocale = "en-US";
|
|
762
762
|
}
|
|
@@ -798,7 +798,7 @@ class D extends Error {
|
|
|
798
798
|
super(`HTTP ${t}: ${a}`), this.status = t, this.name = "HttpError";
|
|
799
799
|
}
|
|
800
800
|
}
|
|
801
|
-
class
|
|
801
|
+
class U {
|
|
802
802
|
constructor(t, a = {}, i) {
|
|
803
803
|
if (this.authToken = null, !t)
|
|
804
804
|
throw new Error("[HttpService] baseUrl is required");
|
|
@@ -1087,10 +1087,10 @@ R.styles = [
|
|
|
1087
1087
|
S`.wizard-content{display:flex;flex-direction:column;gap:var(--ga-size-spacing-06);flex:1 1 270px;min-height:0;text-align:left;align-self:center;width:100%;max-width:var(--ga-size-content-sm);padding:0;overflow-y:auto;}.wizard-content p{font-size:var(--ga-text-md-size);line-height:var(--ga-text-md-line-height);letter-spacing:var(--ga-text-md-tracking);color:var(--ga-color-text-body);margin:0;}.wizard-content h2.welcome-message{font-size:var(--ga-text-2xl-size);line-height:var(--ga-text-2xl-line-height);letter-spacing:var(--ga-text-2xl-tracking);font-weight:var(--ga-font-weight-normal);margin:0;color:var(--ga-color-text-headings);}.wizard-actions{border-top:none;padding-top:0;margin-top:0;}h2[tabindex="-1"]:focus{outline:none;}`
|
|
1088
1088
|
];
|
|
1089
1089
|
I([
|
|
1090
|
-
|
|
1090
|
+
d({ type: String })
|
|
1091
1091
|
], R.prototype, "userName", 2);
|
|
1092
1092
|
I([
|
|
1093
|
-
|
|
1093
|
+
d({ type: Object })
|
|
1094
1094
|
], R.prototype, "translations", 2);
|
|
1095
1095
|
R = I([
|
|
1096
1096
|
A("wizard-step-welcome")
|
|
@@ -1101,7 +1101,7 @@ var _ = Object.defineProperty, W = Object.getOwnPropertyDescriptor, h = (e, t, a
|
|
|
1101
1101
|
return i && r && _(t, a, r), r;
|
|
1102
1102
|
};
|
|
1103
1103
|
const C = ["NO", "SE", "DK", "FI", "NL"];
|
|
1104
|
-
let
|
|
1104
|
+
let u = class extends E {
|
|
1105
1105
|
constructor() {
|
|
1106
1106
|
super(...arguments), this.locale = "en-GB", this.customer = null, this.subscriptions = { content: [], totalNumberOfRecords: 0 }, this.editingContact = !1, this.countryDropdownOpen = !1, this.fieldErrors = {}, this.editName = "", this.editAddress1 = "", this.editAddress2 = "", this.editPostalCode = "", this.editCity = "", this.editCountryCode = "", this.editWebUrl = "", this.editContactEmail = "", this.localCustomer = null;
|
|
1107
1107
|
}
|
|
@@ -1295,7 +1295,7 @@ let m = class extends E {
|
|
|
1295
1295
|
this.validateField("name", r.target.value);
|
|
1296
1296
|
}}
|
|
1297
1297
|
/>
|
|
1298
|
-
${this.fieldErrors.name ? n`<span class="field-error" role="alert" id="company-error-name"><span aria-hidden="true">${
|
|
1298
|
+
${this.fieldErrors.name ? n`<span class="field-error" role="alert" id="company-error-name"><span aria-hidden="true">${c.octagonAlert()}</span><span class="field-error-text">${this.fieldErrors.name}</span></span>` : ""}
|
|
1299
1299
|
</div>` : n`<div class="company-name-wrapper">
|
|
1300
1300
|
<h3 class="company-name">${t.name}</h3>
|
|
1301
1301
|
</div>`}
|
|
@@ -1321,7 +1321,7 @@ let m = class extends E {
|
|
|
1321
1321
|
this.validateField("address1", r.target.value);
|
|
1322
1322
|
}}
|
|
1323
1323
|
/>
|
|
1324
|
-
${this.fieldErrors.address1 ? n`<span class="field-error" role="alert" id="company-error-address1"><span aria-hidden="true">${
|
|
1324
|
+
${this.fieldErrors.address1 ? n`<span class="field-error" role="alert" id="company-error-address1"><span aria-hidden="true">${c.octagonAlert()}</span><span class="field-error-text">${this.fieldErrors.address1}</span></span>` : ""}
|
|
1325
1325
|
</div>
|
|
1326
1326
|
<input
|
|
1327
1327
|
class="form-input"
|
|
@@ -1366,8 +1366,8 @@ let m = class extends E {
|
|
|
1366
1366
|
}}
|
|
1367
1367
|
/>
|
|
1368
1368
|
</div>
|
|
1369
|
-
${this.fieldErrors.postalCode ? n`<span class="field-error" role="alert" id="company-error-postal"><span aria-hidden="true">${
|
|
1370
|
-
${this.fieldErrors.city ? n`<span class="field-error" role="alert" id="company-error-city"><span aria-hidden="true">${
|
|
1369
|
+
${this.fieldErrors.postalCode ? n`<span class="field-error" role="alert" id="company-error-postal"><span aria-hidden="true">${c.octagonAlert()}</span><span class="field-error-text">${this.fieldErrors.postalCode}</span></span>` : ""}
|
|
1370
|
+
${this.fieldErrors.city ? n`<span class="field-error" role="alert" id="company-error-city"><span aria-hidden="true">${c.octagonAlert()}</span><span class="field-error-text">${this.fieldErrors.city}</span></span>` : ""}
|
|
1371
1371
|
</div>
|
|
1372
1372
|
<div
|
|
1373
1373
|
class="select-wrapper"
|
|
@@ -1383,7 +1383,7 @@ let m = class extends E {
|
|
|
1383
1383
|
@keydown=${this.handleCountryKeydown}
|
|
1384
1384
|
>
|
|
1385
1385
|
<span>${this.editCountryCode ? this.getCountryLabel(this.editCountryCode) : ""}</span>
|
|
1386
|
-
${
|
|
1386
|
+
${c.chevronDown()}
|
|
1387
1387
|
</button>
|
|
1388
1388
|
${this.countryDropdownOpen ? n`
|
|
1389
1389
|
<ul class="dropdown-menu" role="listbox" aria-label=${e.company.countryLabel}>
|
|
@@ -1397,7 +1397,7 @@ let m = class extends E {
|
|
|
1397
1397
|
@click=${() => this.selectCountry(r)}
|
|
1398
1398
|
@keydown=${(o) => this.handleOptionKeydown(o, r)}
|
|
1399
1399
|
>
|
|
1400
|
-
<span class="dropdown-option-icon" aria-hidden="true">${r === this.editCountryCode ?
|
|
1400
|
+
<span class="dropdown-option-icon" aria-hidden="true">${r === this.editCountryCode ? c.check() : ""}</span>
|
|
1401
1401
|
${this.getCountryLabel(r)}
|
|
1402
1402
|
</li>
|
|
1403
1403
|
`)}
|
|
@@ -1429,7 +1429,7 @@ let m = class extends E {
|
|
|
1429
1429
|
this.validateField("webUrl", r.target.value);
|
|
1430
1430
|
}}
|
|
1431
1431
|
/>
|
|
1432
|
-
${this.fieldErrors.webUrl ? n`<span class="field-error" role="alert" id="company-error-webUrl"><span aria-hidden="true">${
|
|
1432
|
+
${this.fieldErrors.webUrl ? n`<span class="field-error" role="alert" id="company-error-webUrl"><span aria-hidden="true">${c.octagonAlert()}</span><span class="field-error-text">${this.fieldErrors.webUrl}</span></span>` : ""}
|
|
1433
1433
|
</div>
|
|
1434
1434
|
<div class="form-field">
|
|
1435
1435
|
<input
|
|
@@ -1446,7 +1446,7 @@ let m = class extends E {
|
|
|
1446
1446
|
this.validateField("contactEmail", r.target.value);
|
|
1447
1447
|
}}
|
|
1448
1448
|
/>
|
|
1449
|
-
${this.fieldErrors.contactEmail ? n`<span class="field-error" role="alert" id="company-error-email"><span aria-hidden="true">${
|
|
1449
|
+
${this.fieldErrors.contactEmail ? n`<span class="field-error" role="alert" id="company-error-email"><span aria-hidden="true">${c.octagonAlert()}</span><span class="field-error-text">${this.fieldErrors.contactEmail}</span></span>` : ""}
|
|
1450
1450
|
</div>
|
|
1451
1451
|
<div class="edit-actions">
|
|
1452
1452
|
<button type="button" class="btn-primary" @click=${this.handleSaveChanges}>
|
|
@@ -1485,7 +1485,7 @@ let m = class extends E {
|
|
|
1485
1485
|
<ul class="subscription-list">
|
|
1486
1486
|
${a.map((r) => n`
|
|
1487
1487
|
<li>
|
|
1488
|
-
<span aria-hidden="true">${
|
|
1488
|
+
<span aria-hidden="true">${c.check()}</span>
|
|
1489
1489
|
${r}
|
|
1490
1490
|
</li>
|
|
1491
1491
|
`)}
|
|
@@ -1497,7 +1497,7 @@ let m = class extends E {
|
|
|
1497
1497
|
const o = e.company.managePlanMessage.split("{partnerName}");
|
|
1498
1498
|
return n`
|
|
1499
1499
|
<div class="plan-notification" role="note">
|
|
1500
|
-
<div class="plan-notification-icon" aria-hidden="true">${
|
|
1500
|
+
<div class="plan-notification-icon" aria-hidden="true">${c.info()}</div>
|
|
1501
1501
|
<p class="plan-notification-text">
|
|
1502
1502
|
${o[0]}<strong>${r}</strong>${o[1]}
|
|
1503
1503
|
</p>
|
|
@@ -1518,71 +1518,71 @@ let m = class extends E {
|
|
|
1518
1518
|
`;
|
|
1519
1519
|
}
|
|
1520
1520
|
};
|
|
1521
|
-
|
|
1521
|
+
u.styles = [
|
|
1522
1522
|
N,
|
|
1523
1523
|
j,
|
|
1524
1524
|
P,
|
|
1525
1525
|
S`:host{--avatar-size:var(--ga-size-spacing-09);}.step-content > p{font-size:var(--ga-text-md-size);line-height:var(--ga-text-md-line-height);letter-spacing:var(--ga-text-md-tracking);color:var(--ga-color-text-body);margin:0 0 var(--ga-size-spacing-06);}.section-divider{border:none;border-top:var(--ga-size-border-width-sm) solid var(--ga-color-neutral-30);margin:0 0 var(--ga-size-spacing-06);}.loading-placeholder{padding:var(--ga-size-spacing-05);background:var(--ga-color-neutral-10);border-radius:var(--ga-radius);color:var(--ga-color-neutral-60);font-size:var(--ga-text-md-size);line-height:var(--ga-text-md-line-height);}.company-header{display:flex;align-items:center;gap:var(--ga-size-spacing-05);margin-bottom:var(--ga-size-spacing-07);}.company-header--editing{margin-bottom:var(--ga-size-spacing-05);}.company-avatar{width:var(--avatar-size);height:var(--avatar-size);border-radius:var(--ga-radius-round);background:transparent;border:var(--ga-size-border-width-sm) solid var(--ga-color-text-headings);color:var(--ga-color-text-headings);display:flex;align-items:center;justify-content:center;font-size:var(--ga-text-md-size);font-weight:600;flex-shrink:0;}.company-name{font-size:var(--ga-text-xl-size);line-height:var(--ga-text-xl-line-height);letter-spacing:var(--ga-text-xl-tracking);font-weight:400;margin:0;color:var(--ga-color-text-headings);}.company-columns{display:flex;gap:var(--ga-size-spacing-07);align-items:flex-start;padding-bottom:var(--ga-size-spacing-04);padding-left:var(--ga-size-spacing-10);padding-right:var(--ga-size-spacing-10);}.contact-column{width:var(--ga-size-content-xs);flex-shrink:0;display:flex;flex-direction:column;gap:var(--ga-size-spacing-05);}.edit-form{display:flex;flex-direction:column;gap:var(--ga-size-spacing-05);}.form-field{display:flex;flex-direction:column;}.form-input{width:100%;padding:var(--ga-size-spacing-03) var(--ga-size-spacing-04);border:var(--ga-size-border-width-sm) solid var(--ga-color-border-primary);border-radius:var(--ga-radius);font-size:var(--ga-text-md-size);font-family:var(--ga-font-family-primary);line-height:var(--ga-text-md-line-height);letter-spacing:var(--ga-text-md-tracking);color:var(--ga-color-text-action);background:var(--ga-color-white);box-sizing:border-box;outline:none;transition:border-color 0.2s;}.form-input:focus{border-color:var(--ga-color-border-focus);box-shadow:0 0 0 var(--ga-size-border-width-md) var(--ga-color-white),0 0 0 var(--ga-size-border-width-lg) var(--ga-color-border-focus);}.form-input.has-error{border-color:var(--ga-color-border-error);background:var(--ga-color-surface-error);}.form-input.has-error:focus{border-color:var(--ga-color-border-error);box-shadow:0 0 0 var(--ga-size-border-width-md) var(--ga-color-white),0 0 0 var(--ga-size-border-width-lg) var(--ga-color-border-error);}.postal-city-row{display:flex;gap:var(--ga-size-spacing-03);}.input-postal{width:var(--ga-size-spacing-10);flex-shrink:0;}.input-city{flex:1;}.input-country{max-width:var(--ga-size-content-2xs);}.select-wrapper{position:relative;max-width:var(--ga-size-content-2xs);}.select-trigger{display:flex;align-items:center;justify-content:space-between;text-align:left;cursor:pointer;width:100%;padding-right:var(--ga-size-spacing-04);}.select-trigger svg{width:var(--ga-size-spacing-05);height:var(--ga-size-spacing-05);flex-shrink:0;color:var(--ga-color-text-action);}.dropdown-menu{position:absolute;top:calc(100% + var(--ga-size-spacing-01));left:0;right:0;background:var(--ga-color-surface-primary);border:var(--ga-size-border-width-sm) solid var(--ga-color-border-primary);border-radius:var(--ga-radius);box-shadow:var(--ga-shadow-dropdown);list-style:none;margin:0;padding:0;z-index:10;overflow:hidden;}.dropdown-option{display:flex;align-items:center;gap:var(--ga-size-spacing-03);padding:var(--ga-size-spacing-03) var(--ga-size-spacing-04);font-size:var(--ga-text-md-size);font-family:var(--ga-font-family-primary);line-height:var(--ga-text-md-line-height);letter-spacing:var(--ga-text-md-tracking);color:var(--ga-color-text-body);cursor:pointer;list-style:none;outline:none;position:relative;}.dropdown-option[aria-selected='true']{background:var(--ga-color-surface-selected);}.dropdown-option:hover{background:var(--ga-color-surface-action-hover-2);color:var(--ga-color-text-action-hover);}.dropdown-option:focus{box-shadow:inset 0 0 0 var(--ga-size-border-width-md) var(--ga-color-border-focus);}.dropdown-option-icon{width:var(--ga-size-spacing-05);height:var(--ga-size-spacing-05);flex-shrink:0;display:flex;align-items:center;justify-content:center;color:var(--ga-color-text-body);}.dropdown-option-icon svg{width:var(--ga-size-spacing-05);height:var(--ga-size-spacing-05);}.company-name-wrapper{flex:1;min-width:0;display:flex;flex-direction:column;gap:var(--ga-size-spacing-03);}.org-number{font-size:var(--ga-text-sm-size);line-height:var(--ga-text-sm-line-height);color:var(--ga-color-text-subtle);}.form-input--readonly{background:var(--ga-color-neutral-10);cursor:default;color:var(--ga-color-text-body);}.form-input--readonly.org-number{font-size:var(--ga-text-md-size);line-height:var(--ga-text-md-line-height);color:var(--ga-color-text-body);}.field-label-text{margin:0 0 var(--ga-size-spacing-01);font-size:var(--ga-text-md-size);line-height:var(--ga-text-md-line-height);letter-spacing:var(--ga-text-md-tracking);color:var(--ga-color-text-body);}.company-name-input{width:var(--ga-size-content-xs);box-sizing:border-box;}.edit-actions{display:flex;gap:var(--ga-size-spacing-05);align-items:center;margin-top:var(--ga-size-spacing-03);}.subscription-card{flex:1;border-radius:var(--ga-radius);background:var(--ga-color-surface-page);padding:var(--ga-size-spacing-03) var(--ga-size-spacing-03) var(--ga-size-spacing-03) var(--ga-size-spacing-05);display:flex;flex-direction:column;gap:var(--ga-size-spacing-03);}.subscription-title{font-size:var(--ga-text-md-size);line-height:var(--ga-text-md-line-height);letter-spacing:var(--ga-text-md-tracking);font-weight:700;color:var(--ga-color-text-body);margin:0;}.contact-info{display:flex;flex-direction:column;gap:var(--ga-size-spacing-05);}.contact-group{display:flex;flex-direction:column;gap:var(--ga-size-spacing-01);}.contact-info p{margin:0;font-size:var(--ga-text-md-size);line-height:var(--ga-text-md-line-height);letter-spacing:var(--ga-text-md-tracking);color:var(--ga-color-text-body);}.subscription-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:var(--ga-size-spacing-03);}.subscription-list li{display:flex;align-items:center;gap:var(--ga-size-spacing-03);font-size:var(--ga-text-md-size);line-height:var(--ga-text-md-line-height);letter-spacing:var(--ga-text-md-tracking);color:var(--ga-color-text-body);}.subscription-list li svg{width:var(--ga-size-spacing-05);height:var(--ga-size-spacing-05);color:var(--ga-color-text-body);flex-shrink:0;}.plan-notification{display:flex;align-items:flex-start;gap:var(--ga-size-spacing-05);padding:var(--ga-size-spacing-03) var(--ga-size-spacing-03) var(--ga-size-spacing-03) var(--ga-size-spacing-05);background:var(--ga-color-surface-information);border:var(--ga-size-border-width-sm) solid var(--ga-color-border-information);border-radius:var(--ga-radius);}.plan-notification-icon{color:var(--ga-color-icon-information);flex-shrink:0;padding-top:var(--ga-size-spacing-03);}.plan-notification-icon svg{width:var(--ga-size-spacing-05);height:var(--ga-size-spacing-05);}.plan-notification-text{font-size:var(--ga-text-md-size);line-height:var(--ga-text-md-line-height);color:var(--ga-color-text-body);margin:var(--ga-size-spacing-03) 0;}.wizard-actions{margin-top:0;}.sr-only{position:absolute;width:var(--ga-size-border-width-sm);height:var(--ga-size-border-width-sm);padding:0;margin:calc(var(--ga-size-border-width-sm) * -1);overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0;}.edit-contact-btn{all:unset;display:inline-flex;align-items:center;align-self:flex-start;height:var(--ga-size-40);padding:0 var(--ga-size-spacing-05);border:var(--ga-size-border-width-sm) solid var(--ga-color-cyan-80);border-radius:var(--ga-radius);background:var(--ga-color-white);color:var(--ga-color-text-body);font-size:var(--ga-text-md-size);font-weight:var(--ga-font-weight-medium);font-family:var(--vsn-customer-onboarding-wizard-font-family);cursor:pointer;white-space:nowrap;box-sizing:border-box;}.edit-contact-btn:hover{background:var(--ga-color-secondary-10);}.edit-contact-btn:focus-visible{outline:var(--ga-size-border-width-md) solid var(--ga-color-border-focus);outline-offset:var(--ga-size-border-width-md);}h2[tabindex="-1"]:focus{outline:none;}`
|
|
1526
1526
|
];
|
|
1527
1527
|
h([
|
|
1528
|
-
|
|
1529
|
-
],
|
|
1528
|
+
d({ type: Object })
|
|
1529
|
+
], u.prototype, "translations", 2);
|
|
1530
1530
|
h([
|
|
1531
|
-
|
|
1532
|
-
],
|
|
1531
|
+
d({ type: String })
|
|
1532
|
+
], u.prototype, "locale", 2);
|
|
1533
1533
|
h([
|
|
1534
|
-
|
|
1535
|
-
],
|
|
1534
|
+
d({ type: Object })
|
|
1535
|
+
], u.prototype, "customer", 2);
|
|
1536
1536
|
h([
|
|
1537
|
-
|
|
1538
|
-
],
|
|
1537
|
+
d({ type: Object })
|
|
1538
|
+
], u.prototype, "subscriptions", 2);
|
|
1539
1539
|
h([
|
|
1540
1540
|
l()
|
|
1541
|
-
],
|
|
1541
|
+
], u.prototype, "editingContact", 2);
|
|
1542
1542
|
h([
|
|
1543
1543
|
l()
|
|
1544
|
-
],
|
|
1544
|
+
], u.prototype, "countryDropdownOpen", 2);
|
|
1545
1545
|
h([
|
|
1546
1546
|
l()
|
|
1547
|
-
],
|
|
1547
|
+
], u.prototype, "fieldErrors", 2);
|
|
1548
1548
|
h([
|
|
1549
1549
|
l()
|
|
1550
|
-
],
|
|
1550
|
+
], u.prototype, "editName", 2);
|
|
1551
1551
|
h([
|
|
1552
1552
|
l()
|
|
1553
|
-
],
|
|
1553
|
+
], u.prototype, "editAddress1", 2);
|
|
1554
1554
|
h([
|
|
1555
1555
|
l()
|
|
1556
|
-
],
|
|
1556
|
+
], u.prototype, "editAddress2", 2);
|
|
1557
1557
|
h([
|
|
1558
1558
|
l()
|
|
1559
|
-
],
|
|
1559
|
+
], u.prototype, "editPostalCode", 2);
|
|
1560
1560
|
h([
|
|
1561
1561
|
l()
|
|
1562
|
-
],
|
|
1562
|
+
], u.prototype, "editCity", 2);
|
|
1563
1563
|
h([
|
|
1564
1564
|
l()
|
|
1565
|
-
],
|
|
1565
|
+
], u.prototype, "editCountryCode", 2);
|
|
1566
1566
|
h([
|
|
1567
1567
|
l()
|
|
1568
|
-
],
|
|
1568
|
+
], u.prototype, "editWebUrl", 2);
|
|
1569
1569
|
h([
|
|
1570
1570
|
l()
|
|
1571
|
-
],
|
|
1571
|
+
], u.prototype, "editContactEmail", 2);
|
|
1572
1572
|
h([
|
|
1573
1573
|
l()
|
|
1574
|
-
],
|
|
1575
|
-
|
|
1574
|
+
], u.prototype, "localCustomer", 2);
|
|
1575
|
+
u = h([
|
|
1576
1576
|
A("wizard-step1-company")
|
|
1577
|
-
],
|
|
1577
|
+
], u);
|
|
1578
1578
|
var K = Object.defineProperty, G = Object.getOwnPropertyDescriptor, x = (e, t, a, i) => {
|
|
1579
1579
|
for (var r = i > 1 ? void 0 : i ? G(t, a) : t, o = e.length - 1, s; o >= 0; o--)
|
|
1580
1580
|
(s = e[o]) && (r = (i ? s(t, a, r) : s(r)) || r);
|
|
1581
1581
|
return i && r && K(t, a, r), r;
|
|
1582
1582
|
};
|
|
1583
|
-
let
|
|
1583
|
+
let b = class extends E {
|
|
1584
1584
|
constructor() {
|
|
1585
|
-
super(...arguments), this.httpService = null, this.customerId = "", this.locale = "en-GB", this.
|
|
1585
|
+
super(...arguments), this.httpService = null, this.customerId = "", this.locale = "en-GB", this.currentUserEmail = "", this.existingAdmins = [], this.isLoadingAdmins = !1, this.rows = [], this.nextId = 1, this.lookingUpIds = /* @__PURE__ */ new Set(), this.isConfirming = !1, this.rowErrors = /* @__PURE__ */ new Map(), this._loadSequence = 0;
|
|
1586
1586
|
}
|
|
1587
1587
|
firstUpdated() {
|
|
1588
1588
|
this.updateComplete.then(() => {
|
|
@@ -1591,11 +1591,11 @@ let f = class extends E {
|
|
|
1591
1591
|
});
|
|
1592
1592
|
}
|
|
1593
1593
|
updated(e) {
|
|
1594
|
-
e.has("httpService") || e.has("customerId") ? this.loadExistingAdmins() : e.has("
|
|
1594
|
+
e.has("httpService") || e.has("customerId") ? this.loadExistingAdmins() : e.has("currentUserEmail") && this.existingAdmins.length > 0 && (this.existingAdmins = this.sortAdmins([...this.existingAdmins]));
|
|
1595
1595
|
}
|
|
1596
1596
|
sortAdmins(e) {
|
|
1597
1597
|
var a;
|
|
1598
|
-
const t = (a = this.
|
|
1598
|
+
const t = (a = this.currentUserEmail) == null ? void 0 : a.toLowerCase();
|
|
1599
1599
|
return t ? e.sort((i, r) => {
|
|
1600
1600
|
const o = i.email.toLowerCase() === t, s = r.email.toLowerCase() === t;
|
|
1601
1601
|
return o && s ? 0 : o ? -1 : s ? 1 : 0;
|
|
@@ -1771,8 +1771,7 @@ let f = class extends E {
|
|
|
1771
1771
|
this.dispatchEvent(new CustomEvent("save-and-close", { bubbles: !0, composed: !0 }));
|
|
1772
1772
|
}
|
|
1773
1773
|
renderExistingAdminRow(e, t) {
|
|
1774
|
-
|
|
1775
|
-
const a = this.translations, i = ((r = this.currentUser) == null ? void 0 : r.email.toLowerCase()) === e.email.toLowerCase();
|
|
1774
|
+
const a = this.translations, i = !!this.currentUserEmail && this.currentUserEmail.toLowerCase() === e.email.toLowerCase();
|
|
1776
1775
|
return n`
|
|
1777
1776
|
<div class="admin-row admin-row--done">
|
|
1778
1777
|
<span class="row-num">${t}</span>
|
|
@@ -1788,7 +1787,7 @@ let f = class extends E {
|
|
|
1788
1787
|
<div class="cell-action">
|
|
1789
1788
|
${i ? n`
|
|
1790
1789
|
<div class="you-tag">
|
|
1791
|
-
<span aria-hidden="true">${
|
|
1790
|
+
<span aria-hidden="true">${c.userRound()}</span>
|
|
1792
1791
|
<span>${a.administrators.youLabel}</span>
|
|
1793
1792
|
</div>
|
|
1794
1793
|
` : p}
|
|
@@ -1814,7 +1813,7 @@ let f = class extends E {
|
|
|
1814
1813
|
@input=${(s) => this.updateRowEmail(e.id, s.target.value)}
|
|
1815
1814
|
@blur=${(s) => this.validateRowEmail(e.id, s.target.value)}
|
|
1816
1815
|
/>
|
|
1817
|
-
<span class="field-error ${o.email ? "" : "field-error--empty"}" role=${o.email ? "alert" : p} aria-hidden=${o.email ? "false" : "true"} id=${"admin-error-email-" + e.id}><span aria-hidden="true">${
|
|
1816
|
+
<span class="field-error ${o.email ? "" : "field-error--empty"}" role=${o.email ? "alert" : p} aria-hidden=${o.email ? "false" : "true"} id=${"admin-error-email-" + e.id}><span aria-hidden="true">${c.octagonAlert()}</span><span class="field-error-text">${o.email ?? ""}</span></span>
|
|
1818
1817
|
</div>
|
|
1819
1818
|
<div class="cell-lookup-btn">
|
|
1820
1819
|
<button
|
|
@@ -1834,7 +1833,7 @@ let f = class extends E {
|
|
|
1834
1833
|
@click=${() => this.removeRow(e.id)}
|
|
1835
1834
|
aria-label=${a.administrators.deleteRowLabel}
|
|
1836
1835
|
>
|
|
1837
|
-
${
|
|
1836
|
+
${c.trash()}
|
|
1838
1837
|
</button>
|
|
1839
1838
|
</div>
|
|
1840
1839
|
</div>
|
|
@@ -1887,7 +1886,7 @@ let f = class extends E {
|
|
|
1887
1886
|
@input=${(o) => this.updateRowEmail(e.id, o.target.value)}
|
|
1888
1887
|
@blur=${(o) => this.validateRowEmail(e.id, o.target.value)}
|
|
1889
1888
|
/>
|
|
1890
|
-
<span class="field-error ${r.email ? "" : "field-error--empty"}" role=${r.email ? "alert" : p} aria-hidden=${r.email ? "false" : "true"} id=${"admin-error-email-" + e.id}><span aria-hidden="true">${
|
|
1889
|
+
<span class="field-error ${r.email ? "" : "field-error--empty"}" role=${r.email ? "alert" : p} aria-hidden=${r.email ? "false" : "true"} id=${"admin-error-email-" + e.id}><span aria-hidden="true">${c.octagonAlert()}</span><span class="field-error-text">${r.email ?? ""}</span></span>
|
|
1891
1890
|
</div>
|
|
1892
1891
|
<div class="cell-name">
|
|
1893
1892
|
<span class="name-text">${e.firstName}</span>
|
|
@@ -1903,7 +1902,7 @@ let f = class extends E {
|
|
|
1903
1902
|
@click=${() => this.removeRow(e.id)}
|
|
1904
1903
|
aria-label=${a.administrators.deleteRowLabel}
|
|
1905
1904
|
>
|
|
1906
|
-
${
|
|
1905
|
+
${c.trash()}
|
|
1907
1906
|
</button>
|
|
1908
1907
|
<button
|
|
1909
1908
|
type="button"
|
|
@@ -1961,7 +1960,7 @@ let f = class extends E {
|
|
|
1961
1960
|
@input=${(r) => this.updateRowEmail(e.id, r.target.value)}
|
|
1962
1961
|
@blur=${(r) => this.validateRowEmail(e.id, r.target.value)}
|
|
1963
1962
|
/>
|
|
1964
|
-
<span class="field-error ${i.email ? "" : "field-error--empty"}" role=${i.email ? "alert" : p} aria-hidden=${i.email ? "false" : "true"} id=${"admin-error-email-" + e.id}><span aria-hidden="true">${
|
|
1963
|
+
<span class="field-error ${i.email ? "" : "field-error--empty"}" role=${i.email ? "alert" : p} aria-hidden=${i.email ? "false" : "true"} id=${"admin-error-email-" + e.id}><span aria-hidden="true">${c.octagonAlert()}</span><span class="field-error-text">${i.email ?? ""}</span></span>
|
|
1965
1964
|
</div>
|
|
1966
1965
|
<div class="cell-name">
|
|
1967
1966
|
<input
|
|
@@ -1975,7 +1974,7 @@ let f = class extends E {
|
|
|
1975
1974
|
aria-describedby=${i.firstName ? "admin-error-firstName-" + e.id : p}
|
|
1976
1975
|
@input=${(r) => this.updateFirstName(e.id, r.target.value)}
|
|
1977
1976
|
/>
|
|
1978
|
-
<span class="field-error ${i.firstName ? "" : "field-error--empty"}" role=${i.firstName ? "alert" : p} aria-hidden=${i.firstName ? "false" : "true"} id=${"admin-error-firstName-" + e.id}><span aria-hidden="true">${
|
|
1977
|
+
<span class="field-error ${i.firstName ? "" : "field-error--empty"}" role=${i.firstName ? "alert" : p} aria-hidden=${i.firstName ? "false" : "true"} id=${"admin-error-firstName-" + e.id}><span aria-hidden="true">${c.octagonAlert()}</span><span class="field-error-text">${i.firstName ?? ""}</span></span>
|
|
1979
1978
|
</div>
|
|
1980
1979
|
<div class="cell-name-last">
|
|
1981
1980
|
<input
|
|
@@ -1988,7 +1987,7 @@ let f = class extends E {
|
|
|
1988
1987
|
aria-describedby=${i.lastName ? "admin-error-lastName-" + e.id : p}
|
|
1989
1988
|
@input=${(r) => this.updateLastName(e.id, r.target.value)}
|
|
1990
1989
|
/>
|
|
1991
|
-
<span class="field-error ${i.lastName ? "" : "field-error--empty"}" role=${i.lastName ? "alert" : p} aria-hidden=${i.lastName ? "false" : "true"} id=${"admin-error-lastName-" + e.id}><span aria-hidden="true">${
|
|
1990
|
+
<span class="field-error ${i.lastName ? "" : "field-error--empty"}" role=${i.lastName ? "alert" : p} aria-hidden=${i.lastName ? "false" : "true"} id=${"admin-error-lastName-" + e.id}><span aria-hidden="true">${c.octagonAlert()}</span><span class="field-error-text">${i.lastName ?? ""}</span></span>
|
|
1992
1991
|
</div>
|
|
1993
1992
|
<div class="cell-action">
|
|
1994
1993
|
<button
|
|
@@ -1997,7 +1996,7 @@ let f = class extends E {
|
|
|
1997
1996
|
@click=${() => this.removeRow(e.id)}
|
|
1998
1997
|
aria-label=${a.administrators.deleteRowLabel}
|
|
1999
1998
|
>
|
|
2000
|
-
${
|
|
1999
|
+
${c.trash()}
|
|
2001
2000
|
</button>
|
|
2002
2001
|
<button
|
|
2003
2002
|
type="button"
|
|
@@ -2039,7 +2038,7 @@ let f = class extends E {
|
|
|
2039
2038
|
?disabled=${!this.canAddMore}
|
|
2040
2039
|
aria-label=${e.administrators.addAdministratorButton}
|
|
2041
2040
|
>
|
|
2042
|
-
${
|
|
2041
|
+
${c.plus()}
|
|
2043
2042
|
${e.administrators.addAdministratorButton}
|
|
2044
2043
|
</button>
|
|
2045
2044
|
</div>
|
|
@@ -2062,51 +2061,51 @@ let f = class extends E {
|
|
|
2062
2061
|
`;
|
|
2063
2062
|
}
|
|
2064
2063
|
};
|
|
2065
|
-
|
|
2064
|
+
b.styles = [
|
|
2066
2065
|
N,
|
|
2067
2066
|
j,
|
|
2068
2067
|
P,
|
|
2069
2068
|
S`.step-content > p{font-size:var(--ga-text-md-size);line-height:var(--ga-text-md-line-height);letter-spacing:var(--ga-text-md-tracking);color:var(--ga-color-text-body);margin:0 0 var(--ga-size-spacing-07);}.admin-table{background:var(--ga-color-surface-page);border-radius:var(--ga-radius);overflow:hidden;}.admin-row{display:flex;align-items:flex-start;gap:var(--ga-size-spacing-04);padding:var(--ga-size-spacing-03) var(--ga-size-spacing-05);min-height:var(--ga-size-56);}.admin-row + .admin-row{border-top:var(--ga-size-border-width-sm) solid var(--ga-color-neutral-20);}.admin-row--done{align-items:center;}.row-num{font-size:var(--ga-text-sm-size);line-height:var(--ga-text-sm-line-height);color:var(--ga-color-text-body);width:var(--ga-size-spacing-05);text-align:right;flex-shrink:0;align-self:flex-start;padding-top:var(--ga-size-spacing-04);}.admin-row--done .row-num{align-self:auto;padding-top:0;}.cell-email{flex:0 0 var(--ga-size-content-xs);min-width:0;}.cell-name,.cell-name-last{flex:1 1 0;min-width:0;}.cell-lookup-btn{flex:1 1 0;}.cell-action{flex-shrink:0;display:flex;align-items:center;justify-content:flex-end;gap:var(--ga-size-spacing-02);min-width:calc(var(--ga-size-spacing-12) + var(--ga-size-spacing-03));}.name-text{font-size:var(--ga-text-sm-size);line-height:var(--ga-text-sm-line-height);color:var(--ga-color-text-body);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:block;padding:0 var(--ga-size-spacing-02);}.grid-input{background:var(--ga-color-white);border:var(--ga-size-border-width-sm) solid var(--ga-color-neutral-30);border-radius:var(--ga-radius);height:var(--ga-size-40);padding:0 var(--ga-size-spacing-04);font-size:var(--ga-text-sm-size);line-height:var(--ga-text-sm-line-height);color:var(--ga-color-text-body);width:100%;box-sizing:border-box;outline:none;font-family:var(--vsn-customer-onboarding-wizard-font-family);}.grid-input:focus{border-color:var(--ga-color-border-focus);outline:var(--ga-size-border-width-md) solid var(--ga-color-border-focus);outline-offset:var(--ga-size-border-width-md);}.grid-input.has-error{border-color:var(--ga-color-border-error);background:var(--ga-color-surface-error);}.grid-input.has-error:focus{border-color:var(--ga-color-border-error);}.you-tag{display:inline-flex;align-items:center;gap:var(--ga-size-spacing-02);background:var(--ga-color-utility-green-light);border:var(--ga-size-border-width-sm) solid var(--ga-color-utility-green);border-radius:var(--ga-radius);padding:var(--ga-size-spacing-01) var(--ga-size-spacing-02);font-size:var(--ga-text-sm-size);line-height:var(--ga-text-sm-line-height);color:var(--ga-color-text-body);white-space:nowrap;}.you-tag svg{width:var(--ga-size-spacing-05);height:var(--ga-size-spacing-05);flex-shrink:0;}.btn-add-name{background:transparent;border:var(--ga-size-border-width-sm) solid var(--ga-color-primary);border-radius:var(--ga-radius);color:var(--ga-color-primary);font-size:var(--ga-text-sm-size);font-weight:500;height:var(--ga-size-40);padding:0 var(--ga-size-spacing-04);cursor:pointer;white-space:nowrap;font-family:var(--vsn-customer-onboarding-wizard-font-family);}.btn-add-name:hover:not(:disabled){background:var(--ga-color-surface-page);}.btn-add-name:focus-visible,.btn-done:focus-visible,.btn-edit:focus-visible,.btn-icon:focus-visible,.btn-add-row:focus-visible{outline:var(--ga-size-border-width-md) solid var(--ga-color-border-focus);outline-offset:var(--ga-size-border-width-md);}.btn-add-name:disabled{border-color:var(--ga-color-border-disabled);color:var(--ga-color-text-disabled);cursor:not-allowed;}.btn-done{background:var(--ga-color-primary-70);color:var(--ga-color-secondary-10);border:var(--ga-size-border-width-sm) solid var(--ga-color-primary-70);border-radius:var(--ga-radius);font-size:var(--ga-text-sm-size);font-weight:500;height:var(--ga-size-40);padding:0 var(--ga-size-spacing-04);cursor:pointer;white-space:nowrap;font-family:var(--vsn-customer-onboarding-wizard-font-family);}.btn-done:hover{background:var(--ga-color-primary-90);border-color:var(--ga-color-primary-90);}.btn-edit{background:var(--ga-color-white);color:var(--ga-color-text-body);border:var(--ga-size-border-width-sm) solid var(--ga-color-cyan-80);border-radius:var(--ga-radius);font-size:var(--ga-text-sm-size);font-weight:500;height:var(--ga-size-40);padding:0 var(--ga-size-spacing-04);cursor:pointer;white-space:nowrap;font-family:var(--vsn-customer-onboarding-wizard-font-family);}.btn-edit:hover{background:var(--ga-color-secondary-10);}.btn-icon{background:transparent;border:none;padding:var(--ga-size-spacing-02);cursor:pointer;color:var(--ga-color-primary);display:flex;align-items:center;justify-content:center;border-radius:var(--ga-radius);}.btn-icon:hover{background:var(--ga-color-surface-page);}.btn-icon svg{width:var(--ga-size-spacing-05);height:var(--ga-size-spacing-05);}.table-footer{border-top:var(--ga-size-border-width-sm) solid var(--ga-color-neutral-20);padding:var(--ga-size-spacing-03) var(--ga-size-spacing-05);display:flex;align-items:center;}.btn-add-row{display:inline-flex;align-items:center;gap:var(--ga-size-spacing-02);background:transparent;border:var(--ga-size-border-width-sm) solid var(--ga-color-primary);color:var(--ga-color-primary);font-size:var(--ga-text-md-size);font-weight:500;padding:var(--ga-size-spacing-03) var(--ga-size-spacing-05);cursor:pointer;border-radius:var(--ga-radius);font-family:var(--vsn-customer-onboarding-wizard-font-family);}.btn-add-row:hover:not(:disabled){background:var(--ga-color-surface-page);}.btn-add-row:disabled{color:var(--ga-color-text-disabled);border-color:var(--ga-color-neutral-30);cursor:not-allowed;}.btn-add-row svg{width:var(--ga-size-16);height:var(--ga-size-16);}.admin-row:not(.admin-row--done) .name-text{line-height:var(--ga-size-40);}h2[tabindex="-1"]:focus{outline:none;}`
|
|
2070
2069
|
];
|
|
2071
2070
|
x([
|
|
2072
|
-
|
|
2073
|
-
],
|
|
2071
|
+
d({ type: Object })
|
|
2072
|
+
], b.prototype, "translations", 2);
|
|
2074
2073
|
x([
|
|
2075
|
-
|
|
2076
|
-
],
|
|
2074
|
+
d({ type: Object })
|
|
2075
|
+
], b.prototype, "httpService", 2);
|
|
2077
2076
|
x([
|
|
2078
|
-
|
|
2079
|
-
],
|
|
2077
|
+
d({ type: String })
|
|
2078
|
+
], b.prototype, "customerId", 2);
|
|
2080
2079
|
x([
|
|
2081
|
-
|
|
2082
|
-
],
|
|
2080
|
+
d({ type: String })
|
|
2081
|
+
], b.prototype, "locale", 2);
|
|
2083
2082
|
x([
|
|
2084
|
-
|
|
2085
|
-
],
|
|
2083
|
+
d({ type: String })
|
|
2084
|
+
], b.prototype, "currentUserEmail", 2);
|
|
2086
2085
|
x([
|
|
2087
2086
|
l()
|
|
2088
|
-
],
|
|
2087
|
+
], b.prototype, "existingAdmins", 2);
|
|
2089
2088
|
x([
|
|
2090
2089
|
l()
|
|
2091
|
-
],
|
|
2090
|
+
], b.prototype, "isLoadingAdmins", 2);
|
|
2092
2091
|
x([
|
|
2093
2092
|
l()
|
|
2094
|
-
],
|
|
2093
|
+
], b.prototype, "rows", 2);
|
|
2095
2094
|
x([
|
|
2096
2095
|
l()
|
|
2097
|
-
],
|
|
2096
|
+
], b.prototype, "nextId", 2);
|
|
2098
2097
|
x([
|
|
2099
2098
|
l()
|
|
2100
|
-
],
|
|
2099
|
+
], b.prototype, "lookingUpIds", 2);
|
|
2101
2100
|
x([
|
|
2102
2101
|
l()
|
|
2103
|
-
],
|
|
2102
|
+
], b.prototype, "isConfirming", 2);
|
|
2104
2103
|
x([
|
|
2105
2104
|
l()
|
|
2106
|
-
],
|
|
2107
|
-
|
|
2105
|
+
], b.prototype, "rowErrors", 2);
|
|
2106
|
+
b = x([
|
|
2108
2107
|
A("wizard-step2-administrators")
|
|
2109
|
-
],
|
|
2108
|
+
], b);
|
|
2110
2109
|
var Y = Object.defineProperty, H = Object.getOwnPropertyDescriptor, $ = (e, t, a, i) => {
|
|
2111
2110
|
for (var r = i > 1 ? void 0 : i ? H(t, a) : t, o = e.length - 1, s; o >= 0; o--)
|
|
2112
2111
|
(s = e[o]) && (r = (i ? s(t, a, r) : s(r)) || r);
|
|
@@ -2181,7 +2180,7 @@ let w = class extends E {
|
|
|
2181
2180
|
@change=${() => this.toggleConsultant(e.id)}
|
|
2182
2181
|
/>
|
|
2183
2182
|
<span class="checkbox-visual ${t ? "checkbox-visual--checked" : ""}" aria-hidden="true">
|
|
2184
|
-
${t ?
|
|
2183
|
+
${t ? c.check() : p}
|
|
2185
2184
|
</span>
|
|
2186
2185
|
<span class="consultant-name">${a}</span>
|
|
2187
2186
|
<span class="consultant-email">${e.email}</span>
|
|
@@ -2202,7 +2201,7 @@ let w = class extends E {
|
|
|
2202
2201
|
|
|
2203
2202
|
<div class="search-row">
|
|
2204
2203
|
<div class="search-wrapper">
|
|
2205
|
-
<span class="search-icon" aria-hidden="true">${
|
|
2204
|
+
<span class="search-icon" aria-hidden="true">${c.search()}</span>
|
|
2206
2205
|
<input
|
|
2207
2206
|
type="search"
|
|
2208
2207
|
class="search-input"
|
|
@@ -2245,19 +2244,19 @@ w.styles = [
|
|
|
2245
2244
|
S`.step-content > p{font-size:var(--ga-text-md-size);line-height:var(--ga-text-md-line-height);color:var(--ga-color-text-body);margin:0 0 var(--ga-size-spacing-07);}.search-row{display:flex;justify-content:flex-end;margin-bottom:var(--ga-size-spacing-03);}.search-wrapper{position:relative;width:var(--ga-size-content-xs);}.search-icon{position:absolute;left:var(--ga-size-spacing-03);top:50%;transform:translateY(-50%);color:var(--ga-color-icon-action);display:flex;align-items:center;pointer-events:none;}.search-icon svg{width:var(--ga-size-spacing-05);height:var(--ga-size-spacing-05);}.search-input{width:100%;box-sizing:border-box;height:var(--ga-size-40);padding:0 var(--ga-size-spacing-04) 0 var(--ga-size-spacing-07);border:var(--ga-size-border-width-sm) solid var(--ga-color-neutral-30);border-radius:var(--ga-radius);background:var(--ga-color-white);font-size:var(--ga-text-sm-size);line-height:var(--ga-text-sm-line-height);color:var(--ga-color-text-body);outline:none;font-family:var(--vsn-customer-onboarding-wizard-font-family);}.search-input::placeholder{color:var(--ga-color-neutral-60);}.search-input:focus{border-color:var(--ga-color-border-focus);}.consultant-list{background:var(--ga-color-surface-page);border-radius:var(--ga-radius);overflow:hidden;}.consultant-row{display:flex;align-items:center;gap:var(--ga-size-spacing-03);height:var(--ga-size-56);padding:0 var(--ga-size-spacing-05);cursor:pointer;}.consultant-row + .consultant-row{border-top:var(--ga-size-border-width-sm) solid var(--ga-color-neutral-20);}.consultant-row--selected{background:var(--ga-color-surface-selected);}.consultant-row:hover:not(.consultant-row--selected){background:var(--ga-color-neutral-10);}.consultant-row:focus-within .checkbox-visual{outline:var(--ga-size-border-width-md) solid var(--ga-color-border-focus);outline-offset:var(--ga-size-border-width-sm);}.checkbox-visual{flex-shrink:0;width:var(--ga-size-16);height:var(--ga-size-16);border:var(--ga-size-border-width-sm) solid var(--ga-color-neutral-30);border-radius:var(--ga-radius);background:var(--ga-color-white);display:flex;align-items:center;justify-content:center;pointer-events:none;}.checkbox-visual--checked{background:var(--ga-color-primary-70);border-color:var(--ga-color-primary-70);}.checkbox-visual svg{width:var(--ga-size-12);height:var(--ga-size-12);color:var(--ga-color-white);stroke-width:var(--ga-size-border-width-lg);}.sr-only{position:absolute;width:var(--ga-size-border-width-sm);height:var(--ga-size-border-width-sm);padding:0;margin:calc(var(--ga-size-border-width-sm) * -1);overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0;}.consultant-name,.consultant-email{min-width:0;font-size:var(--ga-text-sm-size);line-height:var(--ga-text-sm-line-height);color:var(--ga-color-text-body);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}.consultant-name{flex:7 1 0;}.consultant-email{flex:5 1 0;text-align:left;}.loading-row,.no-results-row{padding:var(--ga-size-spacing-05);text-align:center;font-size:var(--ga-text-sm-size);color:var(--ga-color-neutral-60);}h2[tabindex="-1"]:focus{outline:none;}`
|
|
2246
2245
|
];
|
|
2247
2246
|
$([
|
|
2248
|
-
|
|
2247
|
+
d({ type: Object })
|
|
2249
2248
|
], w.prototype, "translations", 2);
|
|
2250
2249
|
$([
|
|
2251
|
-
|
|
2250
|
+
d({ type: Object })
|
|
2252
2251
|
], w.prototype, "httpService", 2);
|
|
2253
2252
|
$([
|
|
2254
|
-
|
|
2253
|
+
d({ type: String })
|
|
2255
2254
|
], w.prototype, "customerId", 2);
|
|
2256
2255
|
$([
|
|
2257
|
-
|
|
2256
|
+
d({ type: String })
|
|
2258
2257
|
], w.prototype, "partnerId", 2);
|
|
2259
2258
|
$([
|
|
2260
|
-
|
|
2259
|
+
d({ type: String })
|
|
2261
2260
|
], w.prototype, "partnerName", 2);
|
|
2262
2261
|
$([
|
|
2263
2262
|
l()
|
|
@@ -2333,19 +2332,19 @@ B.styles = [
|
|
|
2333
2332
|
S`.complete-content{display:flex;flex-direction:column;gap:var(--ga-size-spacing-06);margin:0 auto;width:100%;max-width:var(--ga-size-content-sm);min-height:270px;}.complete-content h2{margin:0;}.complete-body p{font-size:var(--ga-text-md-size);line-height:var(--ga-text-md-line-height);letter-spacing:var(--ga-text-md-tracking);color:var(--ga-color-text-body);margin:0 0 var(--ga-size-spacing-05);}.complete-body p:last-child{margin-bottom:0;}.wizard-actions{border-top:none;}h2[tabindex="-1"]:focus{outline:none;}`
|
|
2334
2333
|
];
|
|
2335
2334
|
F([
|
|
2336
|
-
|
|
2335
|
+
d({ type: Object })
|
|
2337
2336
|
], B.prototype, "translations", 2);
|
|
2338
2337
|
B = F([
|
|
2339
2338
|
A("wizard-step-complete")
|
|
2340
2339
|
], B);
|
|
2341
|
-
var Q = Object.defineProperty, X = Object.getOwnPropertyDescriptor,
|
|
2340
|
+
var Q = Object.defineProperty, X = Object.getOwnPropertyDescriptor, f = (e, t, a, i) => {
|
|
2342
2341
|
for (var r = i > 1 ? void 0 : i ? X(t, a) : t, o = e.length - 1, s; o >= 0; o--)
|
|
2343
2342
|
(s = e[o]) && (r = (i ? s(t, a, r) : s(r)) || r);
|
|
2344
2343
|
return i && r && Q(t, a, r), r;
|
|
2345
2344
|
};
|
|
2346
|
-
let
|
|
2345
|
+
let m = class extends E {
|
|
2347
2346
|
constructor() {
|
|
2348
|
-
super(...arguments), this.locale = "en-US", this.baseUrl = "", this.adminUrl = "", this.taskId = "", this.customerId = "", this.step = "welcome", this.userName = "User", this.
|
|
2347
|
+
super(...arguments), this.locale = "en-US", this.baseUrl = "", this.adminUrl = "", this.taskId = "", this.customerId = "", this.step = "welcome", this.userName = "User", this.userEmail = "", this.currentStep = 0, this.completedSteps = /* @__PURE__ */ new Set(), this.errorState = null, this.customer = null, this.customerSubscriptions = { content: [], totalNumberOfRecords: 0 }, this.visible = !0, this.i18n = new T(), this.errorMessageListener = null;
|
|
2349
2348
|
}
|
|
2350
2349
|
get steps() {
|
|
2351
2350
|
const e = this.i18n.getTranslations();
|
|
@@ -2356,7 +2355,10 @@ let u = class extends E {
|
|
|
2356
2355
|
];
|
|
2357
2356
|
}
|
|
2358
2357
|
connectedCallback() {
|
|
2359
|
-
super.connectedCallback(), this.currentStep =
|
|
2358
|
+
super.connectedCallback(), this.currentStep = m.stepMap[this.step] ?? 0, this.i18n.setLocale(this.locale), this.setupErrorMessageListener();
|
|
2359
|
+
}
|
|
2360
|
+
firstUpdated() {
|
|
2361
|
+
this.httpService = new U(this.baseUrl, {}, this), this.initializeWithAuth();
|
|
2360
2362
|
}
|
|
2361
2363
|
disconnectedCallback() {
|
|
2362
2364
|
super.disconnectedCallback(), this.removeErrorMessageListener();
|
|
@@ -2393,7 +2395,7 @@ let u = class extends E {
|
|
|
2393
2395
|
console.warn("[CustomerOnboardingWizard] No authentication token provided by host application");
|
|
2394
2396
|
return;
|
|
2395
2397
|
}
|
|
2396
|
-
this.httpService.setAuthToken(e),
|
|
2398
|
+
this.httpService.setAuthToken(e), this.loadDataForStep(this.currentStep);
|
|
2397
2399
|
} catch (e) {
|
|
2398
2400
|
console.error("Failed to initialize component:", e);
|
|
2399
2401
|
}
|
|
@@ -2420,19 +2422,6 @@ let u = class extends E {
|
|
|
2420
2422
|
this.dispatchEvent(i);
|
|
2421
2423
|
});
|
|
2422
2424
|
}
|
|
2423
|
-
/**
|
|
2424
|
-
* Load user profile from API and set userName
|
|
2425
|
-
* userName is populated from getUserProfile() API call
|
|
2426
|
-
* Falls back to default 'User' if request fails
|
|
2427
|
-
*/
|
|
2428
|
-
async loadUserProfile() {
|
|
2429
|
-
try {
|
|
2430
|
-
const e = await this.httpService.getUserProfile();
|
|
2431
|
-
this.currentUserProfile = e, this.userName = `${e.firstName} ${e.lastName}`;
|
|
2432
|
-
} catch (e) {
|
|
2433
|
-
console.error("Failed to load user profile:", e);
|
|
2434
|
-
}
|
|
2435
|
-
}
|
|
2436
2425
|
/**
|
|
2437
2426
|
* Load customer data from API (details and subscriptions in parallel)
|
|
2438
2427
|
* Falls back gracefully if customerId is missing or requests fail
|
|
@@ -2543,7 +2532,7 @@ let u = class extends E {
|
|
|
2543
2532
|
<div class="step-wrapper completed" role="listitem">
|
|
2544
2533
|
<div class="step-indicator completed">
|
|
2545
2534
|
<div class="step-icon" aria-hidden="true">
|
|
2546
|
-
${
|
|
2535
|
+
${c.circleCheckBig()}
|
|
2547
2536
|
</div>
|
|
2548
2537
|
<span class="step-label">${t.label}</span>
|
|
2549
2538
|
</div>
|
|
@@ -2558,7 +2547,7 @@ let u = class extends E {
|
|
|
2558
2547
|
<div class="step-wrapper ${a}" role="listitem" aria-current=${this.currentStep === t.id ? "step" : p}>
|
|
2559
2548
|
<div class="step-indicator ${a}">
|
|
2560
2549
|
<div class="step-icon" aria-hidden="true">
|
|
2561
|
-
${this.completedSteps.has(t.id) ?
|
|
2550
|
+
${this.completedSteps.has(t.id) ? c.circleCheckBig() : this.currentStep === t.id ? c.circleDotDashed() : c.circleDashed()}
|
|
2562
2551
|
</div>
|
|
2563
2552
|
<span class="step-label">${t.label}</span>
|
|
2564
2553
|
</div>
|
|
@@ -2607,7 +2596,7 @@ let u = class extends E {
|
|
|
2607
2596
|
.httpService=${this.httpService}
|
|
2608
2597
|
.customerId=${this.customerId}
|
|
2609
2598
|
.locale=${this.locale}
|
|
2610
|
-
.
|
|
2599
|
+
.currentUserEmail=${this.userEmail}
|
|
2611
2600
|
@next=${this.handleNext}
|
|
2612
2601
|
@save-and-close=${this.handleSaveAndClose}
|
|
2613
2602
|
></wizard-step2-administrators>
|
|
@@ -2648,7 +2637,7 @@ let u = class extends E {
|
|
|
2648
2637
|
<div class="error-banner" role="alert">
|
|
2649
2638
|
<div class="error-content">
|
|
2650
2639
|
<div class="error-icon" aria-hidden="true">
|
|
2651
|
-
${
|
|
2640
|
+
${c.octagonAlert()}
|
|
2652
2641
|
</div>
|
|
2653
2642
|
<div class="error-text-container">
|
|
2654
2643
|
<div class="error-title">${t.title}</div>
|
|
@@ -2656,69 +2645,72 @@ let u = class extends E {
|
|
|
2656
2645
|
</div>
|
|
2657
2646
|
</div>
|
|
2658
2647
|
<button type="button" class="error-dismiss" @click=${this.dismissError} aria-label=${e.common.dismissError}>
|
|
2659
|
-
${
|
|
2648
|
+
${c.x()}
|
|
2660
2649
|
</button>
|
|
2661
2650
|
</div>
|
|
2662
2651
|
`;
|
|
2663
2652
|
}
|
|
2664
2653
|
};
|
|
2665
|
-
|
|
2654
|
+
m.stepMap = {
|
|
2666
2655
|
welcome: 0,
|
|
2667
2656
|
company: 1,
|
|
2668
2657
|
administrators: 2,
|
|
2669
2658
|
"partner-access": 3,
|
|
2670
2659
|
complete: 4
|
|
2671
2660
|
};
|
|
2672
|
-
|
|
2661
|
+
m.styles = [
|
|
2673
2662
|
N,
|
|
2674
|
-
S`:host{display:block;font-family:var(--vsn-customer-onboarding-wizard-font-family);}.overlay{position:fixed;inset:0;background:var(--vsn-customer-onboarding-wizard-overlay-bg,
|
|
2663
|
+
S`:host{display:block;font-family:var(--vsn-customer-onboarding-wizard-font-family);}.overlay{position:fixed;inset:var(--vsn-customer-onboarding-wizard-navbar-height,var(--vsn-co-navbar-height,0px)) 0 0 0;background:var(--vsn-customer-onboarding-wizard-overlay-bg,var(--ga-color-miscellaneous-overlay));display:flex;align-items:center;justify-content:center;z-index:1000;}.wizard-container{background:var(--ga-color-white);width:780px;max-height:90vh;box-sizing:border-box;padding:var(--ga-size-spacing-05);border-radius:var(--ga-radius);border:1px solid var(--ga-color-cyan-80);display:flex;flex-direction:column;overflow:hidden;}.wizard-body{flex:1;min-height:0;display:flex;flex-direction:column;overflow:hidden;}h1.wizard-title{font-size:var(--ga-text-xl-size);line-height:var(--ga-text-xl-line-height);font-weight:var(--ga-font-weight-semibold);margin:0;padding-bottom:var(--ga-size-spacing-06);color:var(--ga-color-text-headings);text-align:left;letter-spacing:var(--ga-text-xl-tracking);}.error-banner{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--ga-size-spacing-04);padding:var(--ga-size-spacing-05);margin-bottom:var(--ga-size-spacing-06);background-color:#FEF2F2;border:1px solid #FCA5A5;border-radius:var(--ga-radius);animation:slideDown 0.3s ease-out;}@keyframes slideDown{from{opacity:0;transform:translateY(-10px);}to{opacity:1;transform:translateY(0);}}.error-content{display:flex;align-items:flex-start;gap:var(--ga-size-spacing-04);flex:1;}.error-icon{width:24px;height:24px;color:var(--ga-color-error);flex-shrink:0;}.error-icon svg{width:24px;height:24px;}.error-text-container{display:flex;flex-direction:column;gap:var(--ga-size-spacing-01);flex:1;}.error-title{font-size:var(--ga-text-sm-size);line-height:var(--ga-text-sm-line-height);color:var(--ga-color-cyan-90);font-weight:600;margin:0;}.error-message{font-size:var(--ga-text-sm-size);line-height:var(--ga-text-sm-line-height);color:var(--ga-color-cyan-90);font-weight:400;margin:0;}.error-dismiss{background:none;border:none;padding:0;cursor:pointer;color:var(--ga-color-red-60);width:24px;height:24px;flex-shrink:0;display:flex;align-items:center;justify-content:center;opacity:0.7;transition:opacity 0.2s;}.error-dismiss:hover{opacity:1;}.error-dismiss:focus-visible{outline:var(--ga-size-border-width-md) solid var(--ga-color-border-focus);outline-offset:var(--ga-size-border-width-md);border-radius:var(--ga-radius);}.error-dismiss svg{width:20px;height:20px;}.step-indicators{display:flex;height:82px;align-items:flex-end;}.step-wrapper{flex:1;display:flex;align-items:flex-start;height:100%;box-sizing:border-box;padding:var(--ga-size-spacing-03) var(--ga-size-spacing-02) var(--ga-size-spacing-03) 0;border-top:var(--ga-size-border-width-md) solid var(--ga-color-surface-disabled);}.step-wrapper.active{border-top-width:var(--ga-size-border-width-lg);border-top-color:var(--ga-color-primary);}.step-wrapper.completed{border-top-color:var(--ga-color-success);}.step-indicator{display:flex;align-items:center;gap:var(--ga-size-spacing-02);padding-left:var(--ga-size-spacing-03);}.step-icon{width:24px;height:24px;border-radius:var(--ga-radius-round);background:transparent;display:flex;align-items:center;justify-content:center;flex-shrink:0;color:var(--ga-color-primary);}.step-indicator.active .step-icon{color:var(--ga-color-primary);}.step-indicator.completed .step-icon{color:var(--ga-color-success);}.step-label{font-size:var(--ga-text-md-size);font-weight:500;color:var(--ga-color-primary);white-space:nowrap;letter-spacing:-0.1px}.step-indicator.active .step-label{color:var(--ga-color-text-headings);font-weight:500;}`
|
|
2675
2664
|
];
|
|
2676
|
-
|
|
2677
|
-
|
|
2678
|
-
],
|
|
2679
|
-
|
|
2680
|
-
|
|
2681
|
-
],
|
|
2682
|
-
|
|
2683
|
-
|
|
2684
|
-
],
|
|
2685
|
-
|
|
2686
|
-
|
|
2687
|
-
],
|
|
2688
|
-
|
|
2689
|
-
|
|
2690
|
-
],
|
|
2691
|
-
|
|
2692
|
-
|
|
2693
|
-
],
|
|
2694
|
-
|
|
2695
|
-
|
|
2696
|
-
],
|
|
2697
|
-
|
|
2665
|
+
f([
|
|
2666
|
+
d({ type: String })
|
|
2667
|
+
], m.prototype, "locale", 2);
|
|
2668
|
+
f([
|
|
2669
|
+
d({ type: String })
|
|
2670
|
+
], m.prototype, "baseUrl", 2);
|
|
2671
|
+
f([
|
|
2672
|
+
d({ type: String })
|
|
2673
|
+
], m.prototype, "adminUrl", 2);
|
|
2674
|
+
f([
|
|
2675
|
+
d({ type: String })
|
|
2676
|
+
], m.prototype, "taskId", 2);
|
|
2677
|
+
f([
|
|
2678
|
+
d({ type: String })
|
|
2679
|
+
], m.prototype, "customerId", 2);
|
|
2680
|
+
f([
|
|
2681
|
+
d({ type: String })
|
|
2682
|
+
], m.prototype, "step", 2);
|
|
2683
|
+
f([
|
|
2684
|
+
d({ attribute: "user-name" })
|
|
2685
|
+
], m.prototype, "userName", 2);
|
|
2686
|
+
f([
|
|
2687
|
+
d({ attribute: "user-email" })
|
|
2688
|
+
], m.prototype, "userEmail", 2);
|
|
2689
|
+
f([
|
|
2698
2690
|
l()
|
|
2699
|
-
],
|
|
2700
|
-
|
|
2691
|
+
], m.prototype, "currentStep", 2);
|
|
2692
|
+
f([
|
|
2701
2693
|
l()
|
|
2702
|
-
],
|
|
2703
|
-
|
|
2694
|
+
], m.prototype, "completedSteps", 2);
|
|
2695
|
+
f([
|
|
2704
2696
|
l()
|
|
2705
|
-
],
|
|
2706
|
-
|
|
2697
|
+
], m.prototype, "errorState", 2);
|
|
2698
|
+
f([
|
|
2707
2699
|
l()
|
|
2708
|
-
],
|
|
2709
|
-
|
|
2700
|
+
], m.prototype, "customer", 2);
|
|
2701
|
+
f([
|
|
2710
2702
|
l()
|
|
2711
|
-
],
|
|
2712
|
-
|
|
2703
|
+
], m.prototype, "customerSubscriptions", 2);
|
|
2704
|
+
f([
|
|
2713
2705
|
l()
|
|
2714
|
-
],
|
|
2715
|
-
|
|
2706
|
+
], m.prototype, "visible", 2);
|
|
2707
|
+
f([
|
|
2716
2708
|
l()
|
|
2717
|
-
],
|
|
2718
|
-
|
|
2709
|
+
], m.prototype, "httpService", 2);
|
|
2710
|
+
m = f([
|
|
2719
2711
|
A("vsn-customer-onboarding-wizard")
|
|
2720
|
-
],
|
|
2712
|
+
], m);
|
|
2721
2713
|
export {
|
|
2722
|
-
|
|
2723
|
-
|
|
2714
|
+
m as CustomerOnboardingWizard,
|
|
2715
|
+
U as HttpService
|
|
2724
2716
|
};
|