@forgeroute/ui 0.4.77 → 0.4.78

package/fesm2022/forgeroute-ui.mjs

@@ -3156,6 +3156,17 @@ function mergeDescribedBy(own, external) {
 	const unique = ids.filter((id, i) => ids.indexOf(id) === i);
 	return unique.length ? unique.join(" ") : null;
 }
+function safeLinkHref(url) {
+	const u = (url ?? "").trim();
+	if (!u) return null;
+	if (/[\\\u0000-\u001f\u007f]/.test(u)) return null;
+	if (/^(https?:\/\/|mailto:|tel:)/i.test(u)) return u;
+	if (/^(\/(?![\/\\])|#)/.test(u)) return u;
+	return null;
+}
+function opensInNewTab(href) {
+	return /^https?:\/\//i.test(href ?? "");
+}
 var CheckboxComponent = class CheckboxComponent {
 	isSelected(value) {
 		return this._selected().includes(value);
@@ -3173,6 +3184,35 @@ var CheckboxComponent = class CheckboxComponent {
 		this._legend = computed(() => this.legend() || (this._host.nativeElement.tagName === "UI-CHECKBOX-GROUP" ? this.label() : ""), ...ngDevMode ? [{ debugName: "_legend" }] : /* istanbul ignore next */ []);
 		this.orientation = input("vertical", ...ngDevMode ? [{ debugName: "orientation" }] : /* istanbul ignore next */ []);
 		this.values = model(void 0, ...ngDevMode ? [{ debugName: "values" }] : /* istanbul ignore next */ []);
+		this.labelLinks = input({}, ...ngDevMode ? [{ debugName: "labelLinks" }] : /* istanbul ignore next */ []);
+		this._labelSegments = computed(() => {
+			const label = this.label();
+			const links = this.labelLinks();
+			if (!label || !links || Object.keys(links).length === 0) return null;
+			const segments = [];
+			let used = false;
+			let last = 0;
+			for (const m of label.matchAll(/\{([A-Za-z0-9_-]+)\}/g)) {
+				const link = Object.prototype.hasOwnProperty.call(links, m[1]) ? links[m[1]] : void 0;
+				if (!link) continue;
+				used = true;
+				const at = m.index ?? 0;
+				if (at > last) segments.push({ text: label.slice(last, at) });
+				const text = link.label ?? "";
+				const href = safeLinkHref(link.url);
+				if (text.trim()) segments.push(href ? {
+					text,
+					href,
+					newTab: opensInNewTab(href),
+					testId: link.testId
+				} : { text });
+				last = at + m[0].length;
+			}
+			if (!used) return null;
+			if (last < label.length) segments.push({ text: label.slice(last) });
+			return segments;
+		}, ...ngDevMode ? [{ debugName: "_labelSegments" }] : /* istanbul ignore next */ []);
+		this._plainLabel = computed(() => this._labelSegments()?.map((s) => s.text).join("") ?? this.label(), ...ngDevMode ? [{ debugName: "_plainLabel" }] : /* istanbul ignore next */ []);
 		this.description = input("", ...ngDevMode ? [{ debugName: "description" }] : /* istanbul ignore next */ []);
 		this._trailingContent = contentChild(CheckboxTrailingDirective, ...ngDevMode ? [{ debugName: "_trailingContent" }] : /* istanbul ignore next */ []);
 		this._trailing = computed(() => !this.groupMode() && !!this._trailingContent(), ...ngDevMode ? [{ debugName: "_trailing" }] : /* istanbul ignore next */ []);
@@ -3251,7 +3291,7 @@ var CheckboxComponent = class CheckboxComponent {
 		return rm ? {
 			key: "required",
 			message: rm
-		} : requiredIssue(this.groupMode() ? this._legend() : this.label());
+		} : requiredIssue(this.groupMode() ? this._legend() : this._plainLabel());
 	}
 	writeValue(val) {
 		if (Array.isArray(val)) this._selected.set(this.inOptionOrder(val));
@@ -3384,6 +3424,13 @@ var CheckboxComponent = class CheckboxComponent {
 					isRequired: false,
 					transformFunction: null
 				},
+				labelLinks: {
+					classPropertyName: "labelLinks",
+					publicName: "labelLinks",
+					isSignal: true,
+					isRequired: false,
+					transformFunction: null
+				},
 				description: {
 					classPropertyName: "description",
 					publicName: "description",
@@ -3544,7 +3591,7 @@ var CheckboxComponent = class CheckboxComponent {
         (change)="onToggle($event)"
       />
       @if (label()) {
-        <span class="cb-label" [attr.data-testid]="labelTestId() || null" [attr.role]="headingLevel() ? 'heading' : null" [attr.aria-level]="headingLevel() || null">{{ label() }}</span>
+        <span class="cb-label" [attr.data-testid]="labelTestId() || null" [attr.role]="headingLevel() ? 'heading' : null" [attr.aria-level]="headingLevel() || null">@if (_labelSegments(); as segments) {@for (seg of segments; track $index) {@if (seg.href) {<a class="cb-link" [attr.href]="seg.href" [attr.target]="seg.newTab ? '_blank' : null" [attr.rel]="seg.newTab ? 'noopener noreferrer' : null" [attr.data-testid]="seg.testId || null">{{ seg.text }}@if (seg.newTab) {<span class="cb-sr-only"> (opens in a new tab)</span>}</a>} @else {<ng-container>{{ seg.text }}</ng-container>}}} @else {<ng-container>{{ label() }}</ng-container>}</span>
       }
       <ng-content />
     </label>
@@ -3569,7 +3616,7 @@ var CheckboxComponent = class CheckboxComponent {
     }
   `,
 			isInline: true,
-			styles: [".cb-field{display:inline-flex;flex-direction:column;gap:4px;vertical-align:top}.cb-group{display:flex;flex-direction:column;gap:8px;margin:0;padding:0;border:0;min-width:0}.cb-legend{padding:0;margin:0 0 8px;font-size:.8125rem;font-weight:600;color:#374151;line-height:1.2}.cb-required{color:#dc2626;margin-left:2px}.cb-sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.cb-options{display:flex;flex-direction:column;gap:10px}.cb-options.cb-horizontal{flex-direction:row;flex-wrap:wrap;gap:8px 20px}.cb-field.cb-has-trailing{display:flex}.cb-row{display:flex;align-items:center;justify-content:space-between;gap:12px}.cb-trailing{display:inline-flex;align-items:center;flex-shrink:0}.cb-option{display:flex;flex-direction:column;gap:4px}.cb-group-desc{margin-left:0}.cb-indent{margin-left:29px}.cb-desc{margin:0 0 0 29px;font-size:.75rem;line-height:1.4;color:#64748b}.cb-desc-error{color:#dc2626}.cb-error .cb-box:not(.cb-checked){border-color:#ef4444}.cb-wrap{position:relative;vertical-align:top;display:inline-flex;align-items:center;gap:9px;cursor:pointer;-webkit-user-select:none;user-select:none}.cb-wrap.cb-disabled{cursor:not-allowed;opacity:.5}.cb-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.cb-wrap:has(.cb-hidden:focus-visible) .cb-box{outline:2px solid #3b82f6;outline-offset:2px}@media(pointer:coarse),(max-width:480px){.cb-wrap{position:relative}.cb-hidden{width:44px;height:44px;margin:0;clip:auto;overflow:visible;left:-12px;top:50%;transform:translateY(-50%);opacity:0;cursor:pointer;z-index:1}.cb-wrap.cb-disabled .cb-hidden{cursor:not-allowed}}.cb-box{flex-shrink:0;box-sizing:border-box;width:20px;height:20px;border:2px solid #7c8ba1;border-radius:5px;background:#fff;display:flex;align-items:center;justify-content:center;transition:background .12s,border-color .12s}.cb-box.cb-checked,.cb-box.cb-indeterminate{background:#3b82f6;border-color:#3b82f6}.cb-wrap:hover .cb-box:not(.cb-checked):not(.cb-disabled){border-color:#3b82f6}@media(max-width:640px),(pointer:coarse){.cb-box{position:relative}.cb-box:after{content:\"\";position:absolute;inset:-12px}}.cb-label{font-size:.875rem;color:#334155;line-height:1.4}\n"],
+			styles: [".cb-field{display:inline-flex;flex-direction:column;gap:4px;vertical-align:top}.cb-group{display:flex;flex-direction:column;gap:8px;margin:0;padding:0;border:0;min-width:0}.cb-legend{padding:0;margin:0 0 8px;font-size:.8125rem;font-weight:600;color:#374151;line-height:1.2}.cb-required{color:#dc2626;margin-left:2px}.cb-sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.cb-options{display:flex;flex-direction:column;gap:10px}.cb-options.cb-horizontal{flex-direction:row;flex-wrap:wrap;gap:8px 20px}.cb-field.cb-has-trailing{display:flex}.cb-row{display:flex;align-items:center;justify-content:space-between;gap:12px}.cb-trailing{display:inline-flex;align-items:center;flex-shrink:0}.cb-option{display:flex;flex-direction:column;gap:4px}.cb-group-desc{margin-left:0}.cb-indent{margin-left:29px}.cb-desc{margin:0 0 0 29px;font-size:.75rem;line-height:1.4;color:#64748b}.cb-desc-error{color:#dc2626}.cb-error .cb-box:not(.cb-checked){border-color:#ef4444}.cb-wrap{position:relative;vertical-align:top;display:inline-flex;align-items:center;gap:9px;cursor:pointer;-webkit-user-select:none;user-select:none}.cb-wrap.cb-disabled{cursor:not-allowed;opacity:.5}.cb-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.cb-wrap:has(.cb-hidden:focus-visible) .cb-box{outline:2px solid #3b82f6;outline-offset:2px}@media(pointer:coarse),(max-width:480px){.cb-wrap{position:relative}.cb-hidden{width:44px;height:44px;margin:0;clip:auto;overflow:visible;left:-12px;top:50%;transform:translateY(-50%);opacity:0;cursor:pointer;z-index:1}.cb-wrap.cb-disabled .cb-hidden{cursor:not-allowed}}.cb-box{flex-shrink:0;box-sizing:border-box;width:20px;height:20px;border:2px solid #7c8ba1;border-radius:5px;background:#fff;display:flex;align-items:center;justify-content:center;transition:background .12s,border-color .12s}.cb-box.cb-checked,.cb-box.cb-indeterminate{background:#3b82f6;border-color:#3b82f6}.cb-wrap:hover .cb-box:not(.cb-checked):not(.cb-disabled){border-color:#3b82f6}@media(max-width:640px),(pointer:coarse){.cb-box{position:relative}.cb-box:after{content:\"\";position:absolute;inset:-12px}}.cb-label{font-size:.875rem;color:#334155;line-height:1.4}.cb-link{color:#2563eb;text-decoration:underline;cursor:pointer;border-radius:2px}.cb-link:hover{color:#1d4ed8}.cb-link:focus-visible{outline:2px solid #3b82f6;outline-offset:2px}\n"],
 			dependencies: [{
 				kind: "directive",
 				type: NgTemplateOutlet,
@@ -3685,7 +3732,7 @@ i0.ɵɵngDeclareClassMetadata({
         (change)="onToggle($event)"
       />
       @if (label()) {
-        <span class="cb-label" [attr.data-testid]="labelTestId() || null" [attr.role]="headingLevel() ? 'heading' : null" [attr.aria-level]="headingLevel() || null">{{ label() }}</span>
+        <span class="cb-label" [attr.data-testid]="labelTestId() || null" [attr.role]="headingLevel() ? 'heading' : null" [attr.aria-level]="headingLevel() || null">@if (_labelSegments(); as segments) {@for (seg of segments; track $index) {@if (seg.href) {<a class="cb-link" [attr.href]="seg.href" [attr.target]="seg.newTab ? '_blank' : null" [attr.rel]="seg.newTab ? 'noopener noreferrer' : null" [attr.data-testid]="seg.testId || null">{{ seg.text }}@if (seg.newTab) {<span class="cb-sr-only"> (opens in a new tab)</span>}</a>} @else {<ng-container>{{ seg.text }}</ng-container>}}} @else {<ng-container>{{ label() }}</ng-container>}</span>
       }
       <ng-content />
     </label>
@@ -3709,7 +3756,7 @@ i0.ɵɵngDeclareClassMetadata({
     </div>
     }
   `,
-			styles: [".cb-field{display:inline-flex;flex-direction:column;gap:4px;vertical-align:top}.cb-group{display:flex;flex-direction:column;gap:8px;margin:0;padding:0;border:0;min-width:0}.cb-legend{padding:0;margin:0 0 8px;font-size:.8125rem;font-weight:600;color:#374151;line-height:1.2}.cb-required{color:#dc2626;margin-left:2px}.cb-sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.cb-options{display:flex;flex-direction:column;gap:10px}.cb-options.cb-horizontal{flex-direction:row;flex-wrap:wrap;gap:8px 20px}.cb-field.cb-has-trailing{display:flex}.cb-row{display:flex;align-items:center;justify-content:space-between;gap:12px}.cb-trailing{display:inline-flex;align-items:center;flex-shrink:0}.cb-option{display:flex;flex-direction:column;gap:4px}.cb-group-desc{margin-left:0}.cb-indent{margin-left:29px}.cb-desc{margin:0 0 0 29px;font-size:.75rem;line-height:1.4;color:#64748b}.cb-desc-error{color:#dc2626}.cb-error .cb-box:not(.cb-checked){border-color:#ef4444}.cb-wrap{position:relative;vertical-align:top;display:inline-flex;align-items:center;gap:9px;cursor:pointer;-webkit-user-select:none;user-select:none}.cb-wrap.cb-disabled{cursor:not-allowed;opacity:.5}.cb-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.cb-wrap:has(.cb-hidden:focus-visible) .cb-box{outline:2px solid #3b82f6;outline-offset:2px}@media(pointer:coarse),(max-width:480px){.cb-wrap{position:relative}.cb-hidden{width:44px;height:44px;margin:0;clip:auto;overflow:visible;left:-12px;top:50%;transform:translateY(-50%);opacity:0;cursor:pointer;z-index:1}.cb-wrap.cb-disabled .cb-hidden{cursor:not-allowed}}.cb-box{flex-shrink:0;box-sizing:border-box;width:20px;height:20px;border:2px solid #7c8ba1;border-radius:5px;background:#fff;display:flex;align-items:center;justify-content:center;transition:background .12s,border-color .12s}.cb-box.cb-checked,.cb-box.cb-indeterminate{background:#3b82f6;border-color:#3b82f6}.cb-wrap:hover .cb-box:not(.cb-checked):not(.cb-disabled){border-color:#3b82f6}@media(max-width:640px),(pointer:coarse){.cb-box{position:relative}.cb-box:after{content:\"\";position:absolute;inset:-12px}}.cb-label{font-size:.875rem;color:#334155;line-height:1.4}\n"]
+			styles: [".cb-field{display:inline-flex;flex-direction:column;gap:4px;vertical-align:top}.cb-group{display:flex;flex-direction:column;gap:8px;margin:0;padding:0;border:0;min-width:0}.cb-legend{padding:0;margin:0 0 8px;font-size:.8125rem;font-weight:600;color:#374151;line-height:1.2}.cb-required{color:#dc2626;margin-left:2px}.cb-sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.cb-options{display:flex;flex-direction:column;gap:10px}.cb-options.cb-horizontal{flex-direction:row;flex-wrap:wrap;gap:8px 20px}.cb-field.cb-has-trailing{display:flex}.cb-row{display:flex;align-items:center;justify-content:space-between;gap:12px}.cb-trailing{display:inline-flex;align-items:center;flex-shrink:0}.cb-option{display:flex;flex-direction:column;gap:4px}.cb-group-desc{margin-left:0}.cb-indent{margin-left:29px}.cb-desc{margin:0 0 0 29px;font-size:.75rem;line-height:1.4;color:#64748b}.cb-desc-error{color:#dc2626}.cb-error .cb-box:not(.cb-checked){border-color:#ef4444}.cb-wrap{position:relative;vertical-align:top;display:inline-flex;align-items:center;gap:9px;cursor:pointer;-webkit-user-select:none;user-select:none}.cb-wrap.cb-disabled{cursor:not-allowed;opacity:.5}.cb-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.cb-wrap:has(.cb-hidden:focus-visible) .cb-box{outline:2px solid #3b82f6;outline-offset:2px}@media(pointer:coarse),(max-width:480px){.cb-wrap{position:relative}.cb-hidden{width:44px;height:44px;margin:0;clip:auto;overflow:visible;left:-12px;top:50%;transform:translateY(-50%);opacity:0;cursor:pointer;z-index:1}.cb-wrap.cb-disabled .cb-hidden{cursor:not-allowed}}.cb-box{flex-shrink:0;box-sizing:border-box;width:20px;height:20px;border:2px solid #7c8ba1;border-radius:5px;background:#fff;display:flex;align-items:center;justify-content:center;transition:background .12s,border-color .12s}.cb-box.cb-checked,.cb-box.cb-indeterminate{background:#3b82f6;border-color:#3b82f6}.cb-wrap:hover .cb-box:not(.cb-checked):not(.cb-disabled){border-color:#3b82f6}@media(max-width:640px),(pointer:coarse){.cb-box{position:relative}.cb-box:after{content:\"\";position:absolute;inset:-12px}}.cb-label{font-size:.875rem;color:#334155;line-height:1.4}.cb-link{color:#2563eb;text-decoration:underline;cursor:pointer;border-radius:2px}.cb-link:hover{color:#1d4ed8}.cb-link:focus-visible{outline:2px solid #3b82f6;outline-offset:2px}\n"]
 		}]
 	}],
 	ctorParameters: () => [],
@@ -3808,6 +3855,14 @@ i0.ɵɵngDeclareClassMetadata({
 			type: i0.Output,
 			args: ["valuesChange"]
 		}],
+		labelLinks: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "labelLinks",
+				required: false
+			}]
+		}],
 		description: [{
 			type: i0.Input,
 			args: [{
@@ -6507,6 +6562,7 @@ var TableToolbarComponent = class TableToolbarComponent {
 						"legend",
 						"orientation",
 						"values",
+						"labelLinks",
 						"description",
 						"indent",
 						"required",
@@ -14897,6 +14953,7 @@ var DataTableComponent = class DataTableComponent {
 						"legend",
 						"orientation",
 						"values",
+						"labelLinks",
 						"description",
 						"indent",
 						"required",
@@ -19353,6 +19410,7 @@ var BusinessHoursComponent = class BusinessHoursComponent {
 						"legend",
 						"orientation",
 						"values",
+						"labelLinks",
 						"description",
 						"indent",
 						"required",
@@ -19600,16 +19658,8 @@ var RadioComponent = class RadioComponent {
 			if (!v) return null;
 			return iconPath(v) ?? (/^[Mm][\d\s.,\-MmLlHhVvCcSsQqTtAaZz]+$/.test(v) ? v : null);
 		}, ...ngDevMode ? [{ debugName: "_iconD" }] : /* istanbul ignore next */ []);
-		this._linkHref = computed(() => {
-			const label = this.linkLabel().trim();
-			const url = this.linkUrl().trim();
-			if (!label || !url) return null;
-			if (/[\\\u0000-\u001f\u007f]/.test(url)) return null;
-			if (/^(https?:\/\/|mailto:|tel:)/i.test(url)) return url;
-			if (/^(\/(?![\/\\])|#)/.test(url)) return url;
-			return null;
-		}, ...ngDevMode ? [{ debugName: "_linkHref" }] : /* istanbul ignore next */ []);
-		this._linkNewTab = computed(() => /^https?:\/\//i.test(this._linkHref() ?? ""), ...ngDevMode ? [{ debugName: "_linkNewTab" }] : /* istanbul ignore next */ []);
+		this._linkHref = computed(() => this.linkLabel().trim() ? safeLinkHref(this.linkUrl()) : null, ...ngDevMode ? [{ debugName: "_linkHref" }] : /* istanbul ignore next */ []);
+		this._linkNewTab = computed(() => opensInNewTab(this._linkHref()), ...ngDevMode ? [{ debugName: "_linkNewTab" }] : /* istanbul ignore next */ []);
 		this.labelId = input("", ...ngDevMode ? [{ debugName: "labelId" }] : /* istanbul ignore next */ []);
 		this._generatedLabelId = `rd-${Math.random().toString(36).slice(2, 8)}-label`;
 		this._labelId = computed(() => this.labelId() || this._generatedLabelId, ...ngDevMode ? [{ debugName: "_labelId" }] : /* istanbul ignore next */ []);
@@ -22748,6 +22798,7 @@ var ContactPickerComponent = class ContactPickerComponent {
 						"legend",
 						"orientation",
 						"values",
+						"labelLinks",
 						"description",
 						"indent",
 						"required",
@@ -24426,6 +24477,7 @@ var BankAccountFormComponent = class BankAccountFormComponent {
 						"legend",
 						"orientation",
 						"values",
+						"labelLinks",
 						"description",
 						"indent",
 						"required",
@@ -29109,6 +29161,7 @@ var MultiSelectComponent = class MultiSelectComponent {
 					"legend",
 					"orientation",
 					"values",
+					"labelLinks",
 					"description",
 					"indent",
 					"required",
@@ -29446,6 +29499,7 @@ var DiscountSelectorComponent = class DiscountSelectorComponent {
 					"legend",
 					"orientation",
 					"values",
+					"labelLinks",
 					"description",
 					"indent",
 					"required",
@@ -54880,6 +54934,7 @@ var EmailTemplateEditorComponent = class EmailTemplateEditorComponent {
 						"legend",
 						"orientation",
 						"values",
+						"labelLinks",
 						"description",
 						"indent",
 						"required",
@@ -61426,6 +61481,7 @@ var PaymentSidePanelComponent = class PaymentSidePanelComponent {
 						"legend",
 						"orientation",
 						"values",
+						"labelLinks",
 						"description",
 						"indent",
 						"required",