@saasquatch/mint-components 2.1.8-1 → 2.1.8-3
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/{ShadowViewAddon-5ce32291.js → ShadowViewAddon-3384ddc4.js} +375 -98
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/mint-components.cjs.js +1 -1
- package/dist/cjs/sqm-banking-info-form_10.cjs.entry.js +50 -377
- package/dist/cjs/{sqm-big-stat_46.cjs.entry.js → sqm-big-stat_45.cjs.entry.js} +172 -351
- package/dist/cjs/sqm-stencilbook.cjs.entry.js +168 -175
- package/dist/collection/collection-manifest.json +0 -1
- package/dist/collection/components/sqm-share-code/sqm-share-code.js +0 -1
- package/dist/collection/components/sqm-share-link/ShareLink.stories.js +142 -11
- package/dist/collection/components/sqm-share-link/UseShareLink.stories.js +14 -5
- package/dist/collection/components/sqm-share-link/sqm-share-link-view.js +173 -0
- package/dist/collection/components/sqm-share-link/sqm-share-link.js +536 -26
- package/dist/collection/components/sqm-share-link/useShareLink.js +200 -5
- package/dist/collection/components/sqm-stencilbook/sqm-stencilbook.js +0 -2
- package/dist/collection/components/tax-and-cash/sqm-banking-info-form/formDefinitions.js +37 -75
- package/dist/collection/components/tax-and-cash/sqm-banking-info-form/sqm-banking-info-form.js +13 -688
- package/dist/collection/components/tax-and-cash/sqm-banking-info-form/useBankingInfoForm.js +1 -95
- package/dist/esm/{ShadowViewAddon-9d97b5d5.js → ShadowViewAddon-c2f026c0.js} +376 -99
- package/dist/esm/loader.js +1 -1
- package/dist/esm/mint-components.js +1 -1
- package/dist/esm/sqm-banking-info-form_10.entry.js +50 -377
- package/dist/esm/{sqm-big-stat_46.entry.js → sqm-big-stat_45.entry.js} +177 -355
- package/dist/esm/sqm-stencilbook.entry.js +168 -175
- package/dist/esm-es5/ShadowViewAddon-c2f026c0.js +1 -0
- package/dist/esm-es5/loader.js +1 -1
- package/dist/esm-es5/mint-components.js +1 -1
- package/dist/esm-es5/sqm-banking-info-form_10.entry.js +1 -1
- package/dist/esm-es5/sqm-big-stat_45.entry.js +1 -0
- package/dist/esm-es5/sqm-stencilbook.entry.js +1 -1
- package/dist/mint-components/mint-components.esm.js +1 -1
- package/dist/mint-components/p-1ebdb2b3.js +500 -0
- package/dist/mint-components/p-87fb29a9.system.js +1 -0
- package/dist/mint-components/{p-499885aa.entry.js → p-a01baeea.entry.js} +2 -2
- package/dist/mint-components/p-ca098be1.system.js +1 -1
- package/dist/mint-components/p-cacb897d.system.entry.js +1 -0
- package/dist/mint-components/{p-22e39d2c.entry.js → p-debc2b08.entry.js} +21 -90
- package/dist/mint-components/{p-a6621899.system.entry.js → p-ea4cd12c.system.entry.js} +1 -1
- package/dist/mint-components/p-f865d476.system.entry.js +1 -0
- package/dist/mint-components/p-ff378015.entry.js +106 -0
- package/dist/types/components/sqm-share-link/ShareLink.stories.d.ts +10 -0
- package/dist/types/components/sqm-share-link/UseShareLink.stories.d.ts +6 -0
- package/dist/types/components/sqm-share-link/sqm-share-link-view.d.ts +37 -0
- package/dist/types/components/sqm-share-link/sqm-share-link.d.ts +107 -2
- package/dist/types/components/sqm-share-link/useShareLink.d.ts +27 -4
- package/dist/types/components/tax-and-cash/sqm-banking-info-form/formDefinitions.d.ts +0 -2
- package/dist/types/components/tax-and-cash/sqm-banking-info-form/sqm-banking-info-form-view.d.ts +0 -4
- package/dist/types/components/tax-and-cash/sqm-banking-info-form/sqm-banking-info-form.d.ts +0 -165
- package/dist/types/components.d.ts +183 -380
- package/docs/docs.docx +0 -0
- package/docs/raisins.json +1 -1
- package/grapesjs/grapesjs.js +1 -1
- package/package.json +1 -1
- package/dist/collection/components/sqm-partner-info-modal/PartnerInfoModal.stories.js +0 -143
- package/dist/collection/components/sqm-partner-info-modal/sqm-partner-info-modal-view.js +0 -90
- package/dist/collection/components/sqm-partner-info-modal/sqm-partner-info-modal.js +0 -462
- package/dist/collection/components/sqm-partner-info-modal/usePartnerInfoModal.js +0 -180
- package/dist/esm-es5/ShadowViewAddon-9d97b5d5.js +0 -1
- package/dist/esm-es5/sqm-big-stat_46.entry.js +0 -1
- package/dist/mint-components/p-0f036907.system.js +0 -1
- package/dist/mint-components/p-adc4e263.js +0 -463
- package/dist/mint-components/p-b0253f4c.entry.js +0 -108
- package/dist/mint-components/p-d93e19e9.system.entry.js +0 -1
- package/dist/mint-components/p-e45a9966.system.entry.js +0 -1
- package/dist/types/components/sqm-partner-info-modal/PartnerInfoModal.stories.d.ts +0 -13
- package/dist/types/components/sqm-partner-info-modal/sqm-partner-info-modal-view.d.ts +0 -41
- package/dist/types/components/sqm-partner-info-modal/sqm-partner-info-modal.d.ts +0 -80
- package/dist/types/components/sqm-partner-info-modal/usePartnerInfoModal.d.ts +0 -16
|
@@ -4229,6 +4229,178 @@ function useShareButton(props) {
|
|
|
4229
4229
|
};
|
|
4230
4230
|
}
|
|
4231
4231
|
|
|
4232
|
+
const vanillaStyle$6 = `
|
|
4233
|
+
:host {
|
|
4234
|
+
display: block;
|
|
4235
|
+
width: 100%;
|
|
4236
|
+
}
|
|
4237
|
+
`;
|
|
4238
|
+
function ShareLinkView(props) {
|
|
4239
|
+
const { copyTextViewProps, customizeUrl, customizeLinkLabel, saveLabelText, cancelLabelText, successMessage, isEditing, editValue, domainPrefix, editsRemaining, maxEdits, limitReached, validationError, isValidating, isSaving, showSuccess, characterLimit, charactersRemaining, editLimitText, editLimitReachedText, supportLinkText, customizeDisabled, customizeDisabledTooltip, onCustomizeClick, onEditValueChange, onSave, onCancel, } = props;
|
|
4240
|
+
const style = {
|
|
4241
|
+
Container: {
|
|
4242
|
+
display: "flex",
|
|
4243
|
+
flexDirection: "column",
|
|
4244
|
+
gap: "var(--sl-spacing-x-small)",
|
|
4245
|
+
width: "100%",
|
|
4246
|
+
},
|
|
4247
|
+
CustomizeLinkText: {
|
|
4248
|
+
margin: "0",
|
|
4249
|
+
fontSize: "var(--sl-font-size-small)",
|
|
4250
|
+
fontWeight: "600",
|
|
4251
|
+
cursor: "pointer",
|
|
4252
|
+
color: "var(--sl-color-neutral-900)",
|
|
4253
|
+
textAlign: "left",
|
|
4254
|
+
"&:hover": {
|
|
4255
|
+
textDecoration: "underline",
|
|
4256
|
+
},
|
|
4257
|
+
},
|
|
4258
|
+
CustomizeLinkDisabled: {
|
|
4259
|
+
margin: "0",
|
|
4260
|
+
fontSize: "var(--sl-font-size-small)",
|
|
4261
|
+
fontWeight: "600",
|
|
4262
|
+
color: "var(--sl-color-neutral-400)",
|
|
4263
|
+
cursor: "default",
|
|
4264
|
+
textAlign: "left",
|
|
4265
|
+
},
|
|
4266
|
+
EditContainer: {
|
|
4267
|
+
display: "flex",
|
|
4268
|
+
flexDirection: "column",
|
|
4269
|
+
gap: "var(--sl-spacing-x-small)",
|
|
4270
|
+
width: "100%",
|
|
4271
|
+
},
|
|
4272
|
+
EditInputWrapper: {
|
|
4273
|
+
display: "flex",
|
|
4274
|
+
alignItems: "center",
|
|
4275
|
+
width: "100%",
|
|
4276
|
+
border: "var(--sqm-border-thickness, 1px) solid var(--sqm-input-border-color, #d1d5db)",
|
|
4277
|
+
borderRadius: "var(--sqm-border-radius-normal, 4px)",
|
|
4278
|
+
background: "var(--sqm-input-background, #fff)",
|
|
4279
|
+
overflow: "hidden",
|
|
4280
|
+
"&:focus-within": {
|
|
4281
|
+
borderColor: "#999999",
|
|
4282
|
+
boxShadow: "0 0 0 var(--sl-focus-ring-width) var(--sl-input-focus-ring-color)",
|
|
4283
|
+
},
|
|
4284
|
+
},
|
|
4285
|
+
DomainPrefix: {
|
|
4286
|
+
padding: "0 0 0 var(--sl-spacing-medium)",
|
|
4287
|
+
fontSize: "var(--sl-font-size-medium)",
|
|
4288
|
+
color: "var(--sl-color-neutral-500)",
|
|
4289
|
+
whiteSpace: "nowrap",
|
|
4290
|
+
userSelect: "none",
|
|
4291
|
+
lineHeight: "var(--sl-input-height-medium)",
|
|
4292
|
+
},
|
|
4293
|
+
EditInput: {
|
|
4294
|
+
flex: "1",
|
|
4295
|
+
border: "none",
|
|
4296
|
+
outline: "none",
|
|
4297
|
+
padding: "0 var(--sl-spacing-medium) 0 0",
|
|
4298
|
+
fontSize: "var(--sl-font-size-medium)",
|
|
4299
|
+
fontFamily: "var(--sl-font-sans)",
|
|
4300
|
+
color: "var(--sl-input-color)",
|
|
4301
|
+
background: "transparent",
|
|
4302
|
+
lineHeight: "var(--sl-input-height-medium)",
|
|
4303
|
+
minWidth: "0",
|
|
4304
|
+
},
|
|
4305
|
+
EditLabel: {
|
|
4306
|
+
margin: "0",
|
|
4307
|
+
fontSize: "var(--sl-font-size-small)",
|
|
4308
|
+
color: "var(--sl-color-neutral-500)",
|
|
4309
|
+
},
|
|
4310
|
+
HelperText: {
|
|
4311
|
+
margin: "0",
|
|
4312
|
+
fontSize: "var(--sl-font-size-small)",
|
|
4313
|
+
color: "var(--sl-color-neutral-500)",
|
|
4314
|
+
},
|
|
4315
|
+
ErrorText: {
|
|
4316
|
+
margin: "0",
|
|
4317
|
+
fontSize: "var(--sl-font-size-small)",
|
|
4318
|
+
color: "var(--sqm-danger-color-text, #dc2626)",
|
|
4319
|
+
},
|
|
4320
|
+
SuccessText: {
|
|
4321
|
+
margin: "0",
|
|
4322
|
+
fontSize: "var(--sl-font-size-small)",
|
|
4323
|
+
color: "var(--sl-color-success-600, #16a34a)",
|
|
4324
|
+
},
|
|
4325
|
+
ActionRow: {
|
|
4326
|
+
display: "flex",
|
|
4327
|
+
gap: "var(--sl-spacing-medium)",
|
|
4328
|
+
alignItems: "center",
|
|
4329
|
+
},
|
|
4330
|
+
SaveButton: {
|
|
4331
|
+
cursor: "pointer",
|
|
4332
|
+
fontFamily: "var(--sl-font-sans)",
|
|
4333
|
+
fontSize: "var(--sl-font-size-small)",
|
|
4334
|
+
fontWeight: "600",
|
|
4335
|
+
padding: "var(--sl-spacing-x-small) var(--sl-spacing-medium)",
|
|
4336
|
+
borderRadius: "var(--sqm-border-radius-normal, 4px)",
|
|
4337
|
+
border: "1px solid var(--sl-color-neutral-900)",
|
|
4338
|
+
background: "var(--sl-color-neutral-900)",
|
|
4339
|
+
color: "#fff",
|
|
4340
|
+
"&:disabled": {
|
|
4341
|
+
opacity: "0.5",
|
|
4342
|
+
cursor: "default",
|
|
4343
|
+
},
|
|
4344
|
+
},
|
|
4345
|
+
CancelButton: {
|
|
4346
|
+
margin: "0",
|
|
4347
|
+
fontSize: "var(--sl-font-size-small)",
|
|
4348
|
+
fontWeight: "600",
|
|
4349
|
+
cursor: "pointer",
|
|
4350
|
+
background: "none",
|
|
4351
|
+
border: "none",
|
|
4352
|
+
padding: "0",
|
|
4353
|
+
fontFamily: "var(--sl-font-sans)",
|
|
4354
|
+
color: "var(--sl-color-neutral-500)",
|
|
4355
|
+
},
|
|
4356
|
+
};
|
|
4357
|
+
const sheet = JSS.createStyleSheet(style);
|
|
4358
|
+
const styleString = sheet.toString();
|
|
4359
|
+
const errorMessageType = (validationError === null || validationError === void 0 ? void 0 : validationError.code) === "LINK_TAKEN" ? "info" : "warning";
|
|
4360
|
+
const showCharactersRemaining = charactersRemaining <= 7;
|
|
4361
|
+
// Editing state
|
|
4362
|
+
if (isEditing) {
|
|
4363
|
+
return (index.h("div", { class: sheet.classes.Container },
|
|
4364
|
+
index.h("style", { type: "text/css" },
|
|
4365
|
+
styleString,
|
|
4366
|
+
vanillaStyle$6),
|
|
4367
|
+
index.h("p", { class: sheet.classes.EditLabel }, "Enter your link"),
|
|
4368
|
+
index.h("div", { class: sheet.classes.EditInputWrapper },
|
|
4369
|
+
index.h("span", { class: sheet.classes.DomainPrefix }, domainPrefix),
|
|
4370
|
+
index.h("input", { class: sheet.classes.EditInput, type: "text", value: editValue, onInput: (e) => onEditValueChange(e.target.value), disabled: isSaving, maxLength: characterLimit })),
|
|
4371
|
+
index.h("p", { class: sheet.classes.HelperText },
|
|
4372
|
+
editLimitText,
|
|
4373
|
+
showCharactersRemaining &&
|
|
4374
|
+
` Characters remaining: ${charactersRemaining}`),
|
|
4375
|
+
validationError && (index.h("sqm-form-message", { type: errorMessageType },
|
|
4376
|
+
index.h("p", { part: "alert-title" }, validationError.title),
|
|
4377
|
+
validationError.description)),
|
|
4378
|
+
isValidating && index.h("p", { class: sheet.classes.HelperText }, "Validating..."),
|
|
4379
|
+
index.h("div", { class: sheet.classes.ActionRow },
|
|
4380
|
+
index.h("button", { class: sheet.classes.SaveButton, onClick: onSave, disabled: isSaving || isValidating || !!validationError || !editValue }, isSaving ? "Saving..." : saveLabelText),
|
|
4381
|
+
index.h("button", { class: sheet.classes.CancelButton, onClick: onCancel, disabled: isSaving }, cancelLabelText))));
|
|
4382
|
+
}
|
|
4383
|
+
// Default / Customized / Limit reached states
|
|
4384
|
+
return (index.h("div", { class: sheet.classes.Container },
|
|
4385
|
+
index.h("style", { type: "text/css" },
|
|
4386
|
+
styleString,
|
|
4387
|
+
vanillaStyle$6),
|
|
4388
|
+
index.h(copyTextView.CopyTextView, Object.assign({}, copyTextViewProps)),
|
|
4389
|
+
showSuccess && index.h("p", { class: sheet.classes.SuccessText }, successMessage),
|
|
4390
|
+
customizeUrl && (customizeDisabled ? (index.h("sl-tooltip", { content: customizeDisabledTooltip },
|
|
4391
|
+
index.h("p", { class: sheet.classes.CustomizeLinkDisabled }, customizeLinkLabel))) : (index.h("p", { class: limitReached
|
|
4392
|
+
? sheet.classes.CustomizeLinkDisabled
|
|
4393
|
+
: sheet.classes.CustomizeLinkText, onClick: limitReached ? undefined : onCustomizeClick }, customizeLinkLabel))),
|
|
4394
|
+
customizeUrl && limitReached && (index.h("p", { class: sheet.classes.HelperText }, global.intl.formatMessage({
|
|
4395
|
+
id: "editLimitReached",
|
|
4396
|
+
defaultMessage: editLimitReachedText,
|
|
4397
|
+
}, {
|
|
4398
|
+
supportLink: (index.h("a", { target: "_blank", href: "https://example.com" }, supportLinkText)),
|
|
4399
|
+
})))));
|
|
4400
|
+
}
|
|
4401
|
+
|
|
4402
|
+
const MAX_EDITS = 5;
|
|
4403
|
+
const CHARACTER_LIMIT = 15;
|
|
4232
4404
|
const MessageLinkQuery$1 = index_module.dist.gql `
|
|
4233
4405
|
query ($programId: ID, $engagementMedium: UserEngagementMedium!) {
|
|
4234
4406
|
user: viewer {
|
|
@@ -4247,19 +4419,119 @@ const WIDGET_ENGAGEMENT_EVENT = index_module.dist.gql `
|
|
|
4247
4419
|
createUserAnalyticsEvent(eventMeta: $eventMeta)
|
|
4248
4420
|
}
|
|
4249
4421
|
`;
|
|
4422
|
+
const ADD_SHARE_LINK_CODE = index_module.dist.gql `
|
|
4423
|
+
mutation ($addShareLinkCodeInput: AddShareLinkCodeInput!) {
|
|
4424
|
+
addShareLinkCode(addShareLinkCodeInput: $addShareLinkCodeInput) {
|
|
4425
|
+
linkCode {
|
|
4426
|
+
linkCode
|
|
4427
|
+
shortUrl
|
|
4428
|
+
referralCode {
|
|
4429
|
+
code
|
|
4430
|
+
}
|
|
4431
|
+
}
|
|
4432
|
+
}
|
|
4433
|
+
}
|
|
4434
|
+
`;
|
|
4435
|
+
// TODO: Replace with actual validation query when backend is ready
|
|
4436
|
+
const VALIDATE_LINK_CODE = index_module.dist.gql `
|
|
4437
|
+
query validateLinkCode($linkCode: String!, $programId: ID) {
|
|
4438
|
+
validateShareLinkCode(linkCode: $linkCode, programId: $programId) {
|
|
4439
|
+
valid
|
|
4440
|
+
message
|
|
4441
|
+
}
|
|
4442
|
+
}
|
|
4443
|
+
`;
|
|
4444
|
+
const GET_LINK_DOMAIN = index_module.dist.gql `
|
|
4445
|
+
query getLinkDomain {
|
|
4446
|
+
tenantSettings {
|
|
4447
|
+
primaryLinkDomain {
|
|
4448
|
+
host
|
|
4449
|
+
}
|
|
4450
|
+
}
|
|
4451
|
+
}
|
|
4452
|
+
`;
|
|
4453
|
+
// TODO: Replace with actual edit count query when backend is ready
|
|
4454
|
+
const SHARE_LINK_EDIT_COUNT = index_module.dist.gql `
|
|
4455
|
+
query shareLinkEditCount($programId: ID) {
|
|
4456
|
+
viewer {
|
|
4457
|
+
... on User {
|
|
4458
|
+
shareLinkCodes(programId: $programId) {
|
|
4459
|
+
totalCount
|
|
4460
|
+
}
|
|
4461
|
+
}
|
|
4462
|
+
}
|
|
4463
|
+
}
|
|
4464
|
+
`;
|
|
4465
|
+
function parseDomainPrefix(url) {
|
|
4466
|
+
try {
|
|
4467
|
+
const parsed = new URL(url);
|
|
4468
|
+
return parsed.origin + "/";
|
|
4469
|
+
}
|
|
4470
|
+
catch {
|
|
4471
|
+
return url;
|
|
4472
|
+
}
|
|
4473
|
+
}
|
|
4474
|
+
function parsePathSuffix(url) {
|
|
4475
|
+
try {
|
|
4476
|
+
const parsed = new URL(url);
|
|
4477
|
+
// Remove leading slash
|
|
4478
|
+
return parsed.pathname.slice(1) + parsed.search + parsed.hash;
|
|
4479
|
+
}
|
|
4480
|
+
catch {
|
|
4481
|
+
return "";
|
|
4482
|
+
}
|
|
4483
|
+
}
|
|
4250
4484
|
function useShareLink(props) {
|
|
4251
|
-
var _a, _b;
|
|
4485
|
+
var _a, _b, _c, _d, _e, _f;
|
|
4252
4486
|
const { programId = index_module.H() } = props;
|
|
4253
4487
|
const user = index_module.J();
|
|
4254
4488
|
const engagementMedium = index_module.B();
|
|
4255
4489
|
const contextData = index_module.Fn(useReferralCodes.REFERRAL_CODES_NAMESPACE);
|
|
4256
|
-
const { data } = index_module.wn(MessageLinkQuery$1, { programId, engagementMedium }, !(user === null || user === void 0 ? void 0 : user.jwt) || !!props.linkOverride || (contextData === null || contextData === void 0 ? void 0 : contextData.shareLink) !== undefined);
|
|
4490
|
+
const { data, refetch } = index_module.wn(MessageLinkQuery$1, { programId, engagementMedium }, !(user === null || user === void 0 ? void 0 : user.jwt) || !!props.linkOverride || (contextData === null || contextData === void 0 ? void 0 : contextData.shareLink) !== undefined);
|
|
4257
4491
|
const [sendLoadEvent] = index_module.$e(WIDGET_ENGAGEMENT_EVENT);
|
|
4258
|
-
const [setCopied
|
|
4492
|
+
const [setCopied] = index_module.$e(useReferralCodes.SET_CODE_COPIED);
|
|
4493
|
+
const [addShareLinkCode, { loading: isSaving }] = index_module.$e(ADD_SHARE_LINK_CODE);
|
|
4494
|
+
const { data: linkDomainData } = index_module.wn(GET_LINK_DOMAIN, {}, !(user === null || user === void 0 ? void 0 : user.jwt) || !props.customizeUrl);
|
|
4495
|
+
// TODO: Wire up when backend query is ready
|
|
4496
|
+
const { data: editCountData } = index_module.wn(SHARE_LINK_EDIT_COUNT, { programId }, !(user === null || user === void 0 ? void 0 : user.jwt) || !props.customizeUrl);
|
|
4259
4497
|
const copyString = (_b = ((contextData === null || contextData === void 0 ? void 0 : contextData.shareLink) || ((_a = data === null || data === void 0 ? void 0 : data.user) === null || _a === void 0 ? void 0 : _a.shareLink))) !== null && _b !== void 0 ? _b :
|
|
4260
4498
|
// Shown during loading
|
|
4261
4499
|
"...";
|
|
4262
4500
|
const [open, setOpen] = domContextHooks_module.useState(false);
|
|
4501
|
+
const [isEditing, setIsEditing] = domContextHooks_module.useState(false);
|
|
4502
|
+
const [editValue, setEditValue] = domContextHooks_module.useState("");
|
|
4503
|
+
const [validationError, setValidationError] = domContextHooks_module.useState(null);
|
|
4504
|
+
const [isValidating, setIsValidating] = domContextHooks_module.useState(false);
|
|
4505
|
+
const [showSuccess, setShowSuccess] = domContextHooks_module.useState(false);
|
|
4506
|
+
const debounceTimerRef = domContextHooks_module.useRef(undefined);
|
|
4507
|
+
const domainPrefix = parseDomainPrefix(copyString);
|
|
4508
|
+
const hasPrimaryLinkDomain = ((_c = linkDomainData === null || linkDomainData === void 0 ? void 0 : linkDomainData.tenantSettings) === null || _c === void 0 ? void 0 : _c.primaryLinkDomain) != null;
|
|
4509
|
+
const customizeDisabled = !hasPrimaryLinkDomain;
|
|
4510
|
+
const editCount = (_f = (_e = (_d = editCountData === null || editCountData === void 0 ? void 0 : editCountData.viewer) === null || _d === void 0 ? void 0 : _d.shareLinkCodes) === null || _e === void 0 ? void 0 : _e.totalCount) !== null && _f !== void 0 ? _f : 0;
|
|
4511
|
+
const editsRemaining = Math.max(0, MAX_EDITS - editCount);
|
|
4512
|
+
const limitReached = editsRemaining <= 0;
|
|
4513
|
+
function mapErrorCodeToInfo(errorCode) {
|
|
4514
|
+
if (!errorCode)
|
|
4515
|
+
return null;
|
|
4516
|
+
const errorMap = {
|
|
4517
|
+
LINK_TAKEN: {
|
|
4518
|
+
code: "LINK_TAKEN",
|
|
4519
|
+
title: props.linkTakenErrorTitle,
|
|
4520
|
+
description: props.linkTakenErrorDescription,
|
|
4521
|
+
},
|
|
4522
|
+
INVALID_SYMBOLS: {
|
|
4523
|
+
code: "INVALID_SYMBOLS",
|
|
4524
|
+
title: props.invalidSymbolsErrorTitle,
|
|
4525
|
+
description: props.invalidSymbolsErrorDescription,
|
|
4526
|
+
},
|
|
4527
|
+
RESTRICTED_WORD: {
|
|
4528
|
+
code: "RESTRICTED_WORD",
|
|
4529
|
+
title: props.restrictedWordErrorTitle,
|
|
4530
|
+
description: props.restrictedWordErrorDescription,
|
|
4531
|
+
},
|
|
4532
|
+
};
|
|
4533
|
+
return errorMap[errorCode];
|
|
4534
|
+
}
|
|
4263
4535
|
async function onClick() {
|
|
4264
4536
|
if (contextData) {
|
|
4265
4537
|
await setCopied({ referralCode: contextData.referralCode });
|
|
@@ -4283,7 +4555,100 @@ function useShareLink(props) {
|
|
|
4283
4555
|
},
|
|
4284
4556
|
});
|
|
4285
4557
|
}
|
|
4286
|
-
|
|
4558
|
+
function onCustomizeClick() {
|
|
4559
|
+
if (limitReached || customizeDisabled)
|
|
4560
|
+
return;
|
|
4561
|
+
setIsEditing(true);
|
|
4562
|
+
setEditValue(parsePathSuffix(copyString));
|
|
4563
|
+
setValidationError(null);
|
|
4564
|
+
}
|
|
4565
|
+
function onEditValueChange(value) {
|
|
4566
|
+
const trimmed = value.slice(0, CHARACTER_LIMIT);
|
|
4567
|
+
setEditValue(trimmed);
|
|
4568
|
+
setValidationError(null);
|
|
4569
|
+
if (debounceTimerRef.current)
|
|
4570
|
+
clearTimeout(debounceTimerRef.current);
|
|
4571
|
+
if (!trimmed) {
|
|
4572
|
+
setIsValidating(false);
|
|
4573
|
+
return;
|
|
4574
|
+
}
|
|
4575
|
+
setIsValidating(true);
|
|
4576
|
+
debounceTimerRef.current = setTimeout(async () => {
|
|
4577
|
+
// TODO: Call actual validation query when backend is ready
|
|
4578
|
+
// Example: const result = await validateLinkCode({ linkCode: trimmed, programId });
|
|
4579
|
+
// if (!result?.validateShareLinkCode?.valid) {
|
|
4580
|
+
// setValidationError(mapErrorCodeToInfo(result.validateShareLinkCode.errorCode));
|
|
4581
|
+
// }
|
|
4582
|
+
setIsValidating(false);
|
|
4583
|
+
}, 2000);
|
|
4584
|
+
}
|
|
4585
|
+
async function onSave() {
|
|
4586
|
+
var _a, _b;
|
|
4587
|
+
if (!editValue || validationError || isValidating)
|
|
4588
|
+
return;
|
|
4589
|
+
try {
|
|
4590
|
+
await addShareLinkCode({
|
|
4591
|
+
addShareLinkCodeInput: {
|
|
4592
|
+
userId: user === null || user === void 0 ? void 0 : user.id,
|
|
4593
|
+
accountId: user === null || user === void 0 ? void 0 : user.accountId,
|
|
4594
|
+
programId,
|
|
4595
|
+
linkCode: editValue,
|
|
4596
|
+
},
|
|
4597
|
+
});
|
|
4598
|
+
setIsEditing(false);
|
|
4599
|
+
setShowSuccess(true);
|
|
4600
|
+
await refetch();
|
|
4601
|
+
setTimeout(() => setShowSuccess(false), 3000);
|
|
4602
|
+
}
|
|
4603
|
+
catch (e) {
|
|
4604
|
+
const errorCode = (_a = e === null || e === void 0 ? void 0 : e.extensions) === null || _a === void 0 ? void 0 : _a.code;
|
|
4605
|
+
setValidationError((_b = mapErrorCodeToInfo(errorCode)) !== null && _b !== void 0 ? _b : {
|
|
4606
|
+
code: null,
|
|
4607
|
+
title: "Error",
|
|
4608
|
+
description: (e === null || e === void 0 ? void 0 : e.message) || "Failed to save custom link. Please try again.",
|
|
4609
|
+
});
|
|
4610
|
+
}
|
|
4611
|
+
}
|
|
4612
|
+
function onCancel() {
|
|
4613
|
+
setIsEditing(false);
|
|
4614
|
+
setEditValue("");
|
|
4615
|
+
setValidationError(null);
|
|
4616
|
+
setIsValidating(false);
|
|
4617
|
+
}
|
|
4618
|
+
return {
|
|
4619
|
+
copyTextViewProps: {
|
|
4620
|
+
...props,
|
|
4621
|
+
onClick,
|
|
4622
|
+
open,
|
|
4623
|
+
copyString,
|
|
4624
|
+
},
|
|
4625
|
+
customizeUrl: props.customizeUrl,
|
|
4626
|
+
customizeLinkLabel: props.customizeLinkLabel,
|
|
4627
|
+
saveLabelText: props.saveLabelText,
|
|
4628
|
+
cancelLabelText: props.cancelLabelText,
|
|
4629
|
+
successMessage: props.successMessage,
|
|
4630
|
+
isEditing,
|
|
4631
|
+
editValue,
|
|
4632
|
+
domainPrefix,
|
|
4633
|
+
editsRemaining,
|
|
4634
|
+
maxEdits: MAX_EDITS,
|
|
4635
|
+
limitReached,
|
|
4636
|
+
validationError,
|
|
4637
|
+
isValidating,
|
|
4638
|
+
isSaving,
|
|
4639
|
+
showSuccess,
|
|
4640
|
+
characterLimit: CHARACTER_LIMIT,
|
|
4641
|
+
charactersRemaining: CHARACTER_LIMIT - editValue.length,
|
|
4642
|
+
editLimitText: props.editLimitText,
|
|
4643
|
+
editLimitReachedText: props.editLimitReachedText,
|
|
4644
|
+
supportLinkText: props.supportLinkText,
|
|
4645
|
+
customizeDisabled,
|
|
4646
|
+
customizeDisabledTooltip: props.customizeDisabledTooltip,
|
|
4647
|
+
onCustomizeClick,
|
|
4648
|
+
onEditValueChange,
|
|
4649
|
+
onSave,
|
|
4650
|
+
onCancel,
|
|
4651
|
+
};
|
|
4287
4652
|
}
|
|
4288
4653
|
|
|
4289
4654
|
const style$9 = {
|
|
@@ -4324,7 +4689,7 @@ const style$9 = {
|
|
|
4324
4689
|
},
|
|
4325
4690
|
ErrorStyle: mixins.ErrorStyles,
|
|
4326
4691
|
};
|
|
4327
|
-
const vanillaStyle$
|
|
4692
|
+
const vanillaStyle$7 = `
|
|
4328
4693
|
sqm-portal-register {
|
|
4329
4694
|
margin: 0 auto;
|
|
4330
4695
|
width: 100%;
|
|
@@ -4356,7 +4721,7 @@ function LeadFormView(props) {
|
|
|
4356
4721
|
return (index.h(index.Fragment, null,
|
|
4357
4722
|
states.success && (index.h("div", { class: sheet$9.classes.Wrapper, part: "sqm-base" },
|
|
4358
4723
|
index.h("style", { type: "text/css" },
|
|
4359
|
-
vanillaStyle$
|
|
4724
|
+
vanillaStyle$7,
|
|
4360
4725
|
styleString$9),
|
|
4361
4726
|
index.h(sqmTextSpanView.TextSpanView, { type: "h3" }, content.pageLabel),
|
|
4362
4727
|
index.h("sqm-form-message", { loading: states.loading, exportparts: "success-icon" },
|
|
@@ -4366,7 +4731,7 @@ function LeadFormView(props) {
|
|
|
4366
4731
|
index.h("sl-button", { class: sheet$9.classes.ContinueButton, onClick: callbacks.resetForm, loading: states.loading, exportparts: "base: primarybutton-base", type: "default" }, content.resubmitFormLabel))),
|
|
4367
4732
|
index.h("div", { class: sheet$9.classes.Wrapper, part: "sqm-base", style: { display: states.success ? "none" : "block" } },
|
|
4368
4733
|
index.h("style", { type: "text/css" },
|
|
4369
|
-
vanillaStyle$
|
|
4734
|
+
vanillaStyle$7,
|
|
4370
4735
|
styleString$9),
|
|
4371
4736
|
index.h(sqmTextSpanView.TextSpanView, { type: "h3" }, content.pageLabel),
|
|
4372
4737
|
index.h("sl-form", { class: sheet$9.classes.Column, "onSl-submit": callbacks.submit, ref: (el) => (refs.formRef.current = el), novalidate: true },
|
|
@@ -4419,7 +4784,7 @@ const style$a = {
|
|
|
4419
4784
|
"margin-bottom": "var(--sl-spacing-large)",
|
|
4420
4785
|
},
|
|
4421
4786
|
};
|
|
4422
|
-
const vanillaStyle$
|
|
4787
|
+
const vanillaStyle$8 = `
|
|
4423
4788
|
:host {
|
|
4424
4789
|
margin: 0 auto;
|
|
4425
4790
|
width: 100%;
|
|
@@ -4448,7 +4813,7 @@ function LeadDropdownFieldView(props) {
|
|
|
4448
4813
|
});
|
|
4449
4814
|
return (index.h("div", { class: sheet$a.classes.FieldContainer, part: "sqm-base" },
|
|
4450
4815
|
index.h("style", { type: "text/css" },
|
|
4451
|
-
vanillaStyle$
|
|
4816
|
+
vanillaStyle$8,
|
|
4452
4817
|
styleString$a),
|
|
4453
4818
|
index.h("sl-select", Object.assign({ style: { maxHeight: "100px" }, exportparts: "label: input-label, base: input-base", label: `${content.dropdownLabel}${content.dropdownOptional ? ` ${content.optionalLabel}` : ""}`, name: `/${content.dropdownName}`, multiple: content.multiple }, (!content.dropdownOptional ? { required: true } : []), { disabled: ((_b = states.leadFormState) === null || _b === void 0 ? void 0 : _b.loading) || ((_c = states.leadFormState) === null || _c === void 0 ? void 0 : _c.disabled), validationError: ({ value }) => {
|
|
4454
4819
|
if (!value && !content.dropdownOptional) {
|
|
@@ -4465,94 +4830,6 @@ function LeadDropdownFieldView(props) {
|
|
|
4465
4830
|
})))));
|
|
4466
4831
|
}
|
|
4467
4832
|
|
|
4468
|
-
const style$b = {
|
|
4469
|
-
Dialog: {
|
|
4470
|
-
"&::part(panel)": {
|
|
4471
|
-
maxWidth: "480px",
|
|
4472
|
-
},
|
|
4473
|
-
"&::part(title)": {
|
|
4474
|
-
fontSize: "var(--sl-font-size-x-large)",
|
|
4475
|
-
fontWeight: "600",
|
|
4476
|
-
padding: "var(--sl-spacing-x-large) var(--sl-spacing-x-large) 0 var(--sl-spacing-x-large)",
|
|
4477
|
-
},
|
|
4478
|
-
"&::part(body)": {
|
|
4479
|
-
padding: "var(--sl-spacing-small) var(--sl-spacing-x-large)",
|
|
4480
|
-
fontSize: "var(--sl-font-size-small)",
|
|
4481
|
-
overflow: "visible",
|
|
4482
|
-
},
|
|
4483
|
-
"&::part(footer)": {
|
|
4484
|
-
display: "flex",
|
|
4485
|
-
flexDirection: "column",
|
|
4486
|
-
gap: "var(--sl-spacing-small)",
|
|
4487
|
-
padding: "var(--sl-spacing-small) var(--sl-spacing-x-large) var(--sl-spacing-x-large)",
|
|
4488
|
-
},
|
|
4489
|
-
"&::part(overlay)": {
|
|
4490
|
-
background: "rgba(0, 0, 0, 0.5)",
|
|
4491
|
-
},
|
|
4492
|
-
"&::part(close-button)": {
|
|
4493
|
-
display: "none",
|
|
4494
|
-
},
|
|
4495
|
-
},
|
|
4496
|
-
FormFields: {
|
|
4497
|
-
display: "flex",
|
|
4498
|
-
gap: "var(--sl-spacing-medium)",
|
|
4499
|
-
marginTop: "var(--sl-spacing-medium)",
|
|
4500
|
-
"& > *": {
|
|
4501
|
-
flex: 1,
|
|
4502
|
-
},
|
|
4503
|
-
},
|
|
4504
|
-
ErrorMessage: {
|
|
4505
|
-
color: "var(--sqm-danger-color-text, #d32f2f)",
|
|
4506
|
-
fontSize: "var(--sl-font-size-small)",
|
|
4507
|
-
marginTop: "var(--sl-spacing-x-small)",
|
|
4508
|
-
},
|
|
4509
|
-
SearchInput: {
|
|
4510
|
-
"&::part(base)": {
|
|
4511
|
-
border: "none",
|
|
4512
|
-
borderBottom: "1px solid var(--sl-color-neutral-300)",
|
|
4513
|
-
borderRadius: "0",
|
|
4514
|
-
},
|
|
4515
|
-
},
|
|
4516
|
-
};
|
|
4517
|
-
function PartnerInfoModalView(props) {
|
|
4518
|
-
var _a, _b;
|
|
4519
|
-
const { states, callbacks, text } = props;
|
|
4520
|
-
const sheet = JSS.createStyleSheet(style$b);
|
|
4521
|
-
const styleString = sheet.toString();
|
|
4522
|
-
const description = states.isExistingPartner
|
|
4523
|
-
? text.descriptionExistingPartner
|
|
4524
|
-
: text.descriptionNewPartner;
|
|
4525
|
-
const buttonLabel = states.isExistingPartner
|
|
4526
|
-
? text.confirmButtonLabel
|
|
4527
|
-
: text.submitButtonLabel;
|
|
4528
|
-
return (index.h("sl-dialog", { class: sheet.classes.Dialog, open: states.open, noHeader: false, label: global.intl.formatMessage({
|
|
4529
|
-
id: "modalBrandHeader",
|
|
4530
|
-
defaultMessage: text.modalBrandHeader,
|
|
4531
|
-
}, { brandName: states.brandName }), "onSl-request-close": (e) => {
|
|
4532
|
-
e.preventDefault();
|
|
4533
|
-
}, "onSl-hide": (e) => {
|
|
4534
|
-
var _a;
|
|
4535
|
-
// Prevent closing when clicking outside the dialog but not dropdowns
|
|
4536
|
-
if (((_a = e.target) === null || _a === void 0 ? void 0 : _a.tagName) === "SL-DIALOG") {
|
|
4537
|
-
e.preventDefault();
|
|
4538
|
-
}
|
|
4539
|
-
} },
|
|
4540
|
-
index.h("style", { type: "text/css" }, styleString),
|
|
4541
|
-
index.h("p", null, description),
|
|
4542
|
-
index.h("div", { class: sheet.classes.FormFields },
|
|
4543
|
-
index.h("sl-select", { exportparts: "label: input-label, base: input-base", label: text.countryLabel, value: states.countryCode, disabled: states.submitting, required: true, "onSl-select": callbacks.onCountryChange },
|
|
4544
|
-
index.h("sl-input", { class: sheet.classes.SearchInput, placeholder: text.searchCountryPlaceholder, onKeyDown: (e) => e.stopPropagation(), "onSl-input": (e) => { var _a; return callbacks.onCountrySearch(((_a = e.target) === null || _a === void 0 ? void 0 : _a.value) || ""); } }), (_a = states.filteredCountries) === null || _a === void 0 ? void 0 :
|
|
4545
|
-
_a.map((c) => (index.h("sl-menu-item", { value: c.countryCode }, c.displayName)))),
|
|
4546
|
-
index.h("sl-select", { exportparts: "label: input-label, base: input-base", label: text.currencyLabel, value: states.currency, disabled: states.submitting, required: true, "onSl-select": callbacks.onCurrencyChange },
|
|
4547
|
-
index.h("sl-input", { class: sheet.classes.SearchInput, placeholder: text.searchCurrencyPlaceholder, onKeyDown: (e) => e.stopPropagation(), "onSl-input": (e) => { var _a; return callbacks.onCurrencySearch(((_a = e.target) === null || _a === void 0 ? void 0 : _a.value) || ""); } }), (_b = states.filteredCurrencies) === null || _b === void 0 ? void 0 :
|
|
4548
|
-
_b.map((c) => (index.h("sl-menu-item", { value: c.currencyCode },
|
|
4549
|
-
c.currencyCode,
|
|
4550
|
-
" - ",
|
|
4551
|
-
c.displayName))))),
|
|
4552
|
-
states.error && index.h("p", { class: sheet.classes.ErrorMessage }, states.error),
|
|
4553
|
-
index.h("sl-button", { slot: "footer", type: "primary", loading: states.submitting, disabled: states.submitting || !states.countryCode || !states.currency, onClick: callbacks.onSubmit, style: { width: "100%" }, exportparts: "base: primarybutton-base" }, buttonLabel)));
|
|
4554
|
-
}
|
|
4555
|
-
|
|
4556
4833
|
const map = new Map();
|
|
4557
4834
|
function withShadowView(component) {
|
|
4558
4835
|
// TODO: Could only do this if rendered in a Stencilbook environment to prevent unintended side-effects
|
|
@@ -4601,7 +4878,6 @@ exports.LeadDropdownFieldView = LeadDropdownFieldView;
|
|
|
4601
4878
|
exports.LeadFormView = LeadFormView;
|
|
4602
4879
|
exports.LeaderboardView = LeaderboardView;
|
|
4603
4880
|
exports.NameFieldsView = NameFieldsView;
|
|
4604
|
-
exports.PartnerInfoModalView = PartnerInfoModalView;
|
|
4605
4881
|
exports.PortalChangePasswordView = PortalChangePasswordView;
|
|
4606
4882
|
exports.PortalFooterView = PortalFooterView;
|
|
4607
4883
|
exports.PortalFrameView = PortalFrameView;
|
|
@@ -4612,6 +4888,7 @@ exports.ReferralIframeView = ReferralIframeView;
|
|
|
4612
4888
|
exports.RewardExchangeView = RewardExchangeView;
|
|
4613
4889
|
exports.ShadowViewAddon = ShadowViewAddon;
|
|
4614
4890
|
exports.ShareButtonView = ShareButtonView;
|
|
4891
|
+
exports.ShareLinkView = ShareLinkView;
|
|
4615
4892
|
exports.StatContainerView = StatContainerView;
|
|
4616
4893
|
exports.TaskCardView = TaskCardView;
|
|
4617
4894
|
exports.chooseAmountFixed = chooseAmountFixed;
|