@rivet-health/design-system 31.8.0 → 31.8.2
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/esm2020/lib/input/mentions-input/mentions-input.component.mjs +96 -40
- package/esm2020/lib/input/phone-field/phone-field.component.mjs +4 -4
- package/fesm2015/rivet-health-design-system.mjs +98 -42
- package/fesm2015/rivet-health-design-system.mjs.map +1 -1
- package/fesm2020/rivet-health-design-system.mjs +98 -42
- package/fesm2020/rivet-health-design-system.mjs.map +1 -1
- package/lib/input/mentions-input/mentions-input.component.d.ts +6 -2
- package/lib/input/phone-field/phone-field.component.d.ts +1 -1
- package/package.json +1 -1
|
@@ -4028,6 +4028,8 @@ class MentionsInputComponent {
|
|
|
4028
4028
|
return `<span class="${readonly ? 'readonly-mention' : 'mention'}" data-id="${item.id}" data-type="mention" contenteditable="false">@${MentionsInputComponent.escapeHtml(item.name)}</span>`;
|
|
4029
4029
|
case 'text':
|
|
4030
4030
|
return MentionsInputComponent.escapeHtml(item.text);
|
|
4031
|
+
case 'newline':
|
|
4032
|
+
return '<br>';
|
|
4031
4033
|
}
|
|
4032
4034
|
}
|
|
4033
4035
|
static escapeHtml(text) {
|
|
@@ -4040,37 +4042,42 @@ class MentionsInputComponent {
|
|
|
4040
4042
|
this.emitContentChange();
|
|
4041
4043
|
}
|
|
4042
4044
|
onKeyDown(event) {
|
|
4043
|
-
if (
|
|
4045
|
+
if (this.mentionsVisible) {
|
|
4046
|
+
const filteredUsers = this.getFilteredUsers();
|
|
4047
|
+
if (filteredUsers.length === 0) {
|
|
4048
|
+
this.closeMentions();
|
|
4049
|
+
return;
|
|
4050
|
+
}
|
|
4051
|
+
switch (event.key) {
|
|
4052
|
+
case 'ArrowDown':
|
|
4053
|
+
event.preventDefault();
|
|
4054
|
+
this.selectedUserIndex = Math.min(this.selectedUserIndex + 1, filteredUsers.length - 1);
|
|
4055
|
+
this.cdr.markForCheck();
|
|
4056
|
+
break;
|
|
4057
|
+
case 'ArrowUp':
|
|
4058
|
+
event.preventDefault();
|
|
4059
|
+
this.selectedUserIndex = Math.max(this.selectedUserIndex - 1, 0);
|
|
4060
|
+
this.cdr.markForCheck();
|
|
4061
|
+
break;
|
|
4062
|
+
case 'Enter':
|
|
4063
|
+
case 'Tab':
|
|
4064
|
+
event.preventDefault();
|
|
4065
|
+
if (filteredUsers[this.selectedUserIndex]) {
|
|
4066
|
+
this.selectUser(filteredUsers[this.selectedUserIndex]);
|
|
4067
|
+
}
|
|
4068
|
+
break;
|
|
4069
|
+
case 'Escape':
|
|
4070
|
+
event.preventDefault();
|
|
4071
|
+
this.closeMentions();
|
|
4072
|
+
break;
|
|
4073
|
+
}
|
|
4044
4074
|
return;
|
|
4045
4075
|
}
|
|
4046
|
-
|
|
4047
|
-
|
|
4048
|
-
|
|
4049
|
-
|
|
4050
|
-
|
|
4051
|
-
this.cdr.markForCheck();
|
|
4052
|
-
break;
|
|
4053
|
-
case 'ArrowUp':
|
|
4054
|
-
event.preventDefault();
|
|
4055
|
-
this.selectedUserIndex = Math.max(this.selectedUserIndex - 1, 0);
|
|
4056
|
-
this.cdr.markForCheck();
|
|
4057
|
-
break;
|
|
4058
|
-
case 'Enter':
|
|
4059
|
-
event.preventDefault();
|
|
4060
|
-
if (filteredUsers[this.selectedUserIndex]) {
|
|
4061
|
-
this.selectUser(filteredUsers[this.selectedUserIndex]);
|
|
4062
|
-
}
|
|
4063
|
-
break;
|
|
4064
|
-
case 'Tab':
|
|
4065
|
-
event.preventDefault();
|
|
4066
|
-
if (filteredUsers[this.selectedUserIndex]) {
|
|
4067
|
-
this.selectUser(filteredUsers[this.selectedUserIndex]);
|
|
4068
|
-
}
|
|
4069
|
-
break;
|
|
4070
|
-
case 'Escape':
|
|
4071
|
-
event.preventDefault();
|
|
4072
|
-
this.closeMentions();
|
|
4073
|
-
break;
|
|
4076
|
+
//Handle newlines when mentions aren't visible
|
|
4077
|
+
if (event.key === 'Enter') {
|
|
4078
|
+
event.preventDefault();
|
|
4079
|
+
this.insertLineBreak();
|
|
4080
|
+
this.emitContentChange();
|
|
4074
4081
|
}
|
|
4075
4082
|
}
|
|
4076
4083
|
onPaste(event) {
|
|
@@ -4086,11 +4093,24 @@ class MentionsInputComponent {
|
|
|
4086
4093
|
this.insertNodesAtCursor(sanitizedNodes);
|
|
4087
4094
|
}
|
|
4088
4095
|
else if (plainText) {
|
|
4089
|
-
|
|
4090
|
-
this.
|
|
4096
|
+
const nodes = this.plainTextToNodes(plainText);
|
|
4097
|
+
this.insertNodesAtCursor(nodes);
|
|
4091
4098
|
}
|
|
4092
4099
|
this.emitContentChange();
|
|
4093
4100
|
}
|
|
4101
|
+
plainTextToNodes(text) {
|
|
4102
|
+
const nodes = [];
|
|
4103
|
+
const lines = text.split('\n');
|
|
4104
|
+
lines.forEach((line, index) => {
|
|
4105
|
+
if (line) {
|
|
4106
|
+
nodes.push(document.createTextNode(line));
|
|
4107
|
+
}
|
|
4108
|
+
if (index < lines.length - 1) {
|
|
4109
|
+
nodes.push(document.createElement('br'));
|
|
4110
|
+
}
|
|
4111
|
+
});
|
|
4112
|
+
return nodes;
|
|
4113
|
+
}
|
|
4094
4114
|
parsePastedHtml(html) {
|
|
4095
4115
|
// Create a temporary container to parse the HTML
|
|
4096
4116
|
const tempContainer = document.createElement('div');
|
|
@@ -4099,7 +4119,7 @@ class MentionsInputComponent {
|
|
|
4099
4119
|
const walkNodes = (node) => {
|
|
4100
4120
|
if (node.nodeType === Node.ELEMENT_NODE) {
|
|
4101
4121
|
const element = node;
|
|
4102
|
-
// DAHNE NOTE - we only want mention spans and text
|
|
4122
|
+
// DAHNE NOTE - we only want mention spans, br elements, and text
|
|
4103
4123
|
if (element.tagName === 'SPAN' &&
|
|
4104
4124
|
element.getAttribute('data-type') === 'mention' &&
|
|
4105
4125
|
element.hasAttribute('data-id')) {
|
|
@@ -4114,6 +4134,10 @@ class MentionsInputComponent {
|
|
|
4114
4134
|
mentionSpan.textContent = element.textContent;
|
|
4115
4135
|
nodes.push(mentionSpan);
|
|
4116
4136
|
}
|
|
4137
|
+
else if (element.tagName === 'BR') {
|
|
4138
|
+
// Preserve line breaks
|
|
4139
|
+
nodes.push(document.createElement('br'));
|
|
4140
|
+
}
|
|
4117
4141
|
else {
|
|
4118
4142
|
//Recursively look for nested children
|
|
4119
4143
|
for (const child of Array.from(element.childNodes)) {
|
|
@@ -4131,7 +4155,7 @@ class MentionsInputComponent {
|
|
|
4131
4155
|
for (const child of Array.from(tempContainer.childNodes)) {
|
|
4132
4156
|
walkNodes(child);
|
|
4133
4157
|
}
|
|
4134
|
-
//DAHNE NOTE - the result here should be an array of text/span-mention nodes
|
|
4158
|
+
//DAHNE NOTE - the result here should be an array of text/span-mention/br nodes
|
|
4135
4159
|
return nodes;
|
|
4136
4160
|
}
|
|
4137
4161
|
insertNodesAtCursor(nodes) {
|
|
@@ -4168,6 +4192,20 @@ class MentionsInputComponent {
|
|
|
4168
4192
|
selection.removeAllRanges();
|
|
4169
4193
|
selection.addRange(range);
|
|
4170
4194
|
}
|
|
4195
|
+
insertLineBreak() {
|
|
4196
|
+
const selection = window.getSelection();
|
|
4197
|
+
if (!selection || !selection.rangeCount) {
|
|
4198
|
+
return;
|
|
4199
|
+
}
|
|
4200
|
+
const range = selection.getRangeAt(0);
|
|
4201
|
+
range.deleteContents();
|
|
4202
|
+
const br = document.createElement('br');
|
|
4203
|
+
range.insertNode(br);
|
|
4204
|
+
range.setStartAfter(br);
|
|
4205
|
+
range.setEndAfter(br);
|
|
4206
|
+
selection.removeAllRanges();
|
|
4207
|
+
selection.addRange(range);
|
|
4208
|
+
}
|
|
4171
4209
|
checkForMentionTrigger() {
|
|
4172
4210
|
const selection = window.getSelection();
|
|
4173
4211
|
if (!selection || !selection.rangeCount || !this.inputElement) {
|
|
@@ -4205,15 +4243,24 @@ class MentionsInputComponent {
|
|
|
4205
4243
|
}
|
|
4206
4244
|
// Trim trailing/leading spaces from search text while preserving spaces in the middle
|
|
4207
4245
|
this.mentionSearchText = textAfterAt.trim();
|
|
4246
|
+
// Only show mentions if there are filtered users
|
|
4247
|
+
const filteredUsers = this.getFilteredUsers();
|
|
4248
|
+
if (filteredUsers.length === 0) {
|
|
4249
|
+
this.closeMentions();
|
|
4250
|
+
return;
|
|
4251
|
+
}
|
|
4208
4252
|
this.mentionsVisible = true;
|
|
4209
4253
|
this.selectedUserIndex = 0;
|
|
4210
4254
|
//Save the current range for later restoration (needed for click selection)
|
|
4211
4255
|
//DAHNE NOTE - this is annoyingly neceessary because clicks and enter keys have different effects on the
|
|
4212
4256
|
//focus of the contenteditable div
|
|
4213
4257
|
this.savedRange = range.cloneRange();
|
|
4214
|
-
|
|
4215
|
-
|
|
4216
|
-
|
|
4258
|
+
if (atPosition) {
|
|
4259
|
+
const atRange = document.createRange();
|
|
4260
|
+
atRange.setStart(atPosition.node, atPosition.offset);
|
|
4261
|
+
atRange.setEnd(atPosition.node, atPosition.offset + 1);
|
|
4262
|
+
this.mentionAnchor = atRange.getBoundingClientRect();
|
|
4263
|
+
}
|
|
4217
4264
|
this.cdr.markForCheck();
|
|
4218
4265
|
}
|
|
4219
4266
|
getTextBeforeCursor(range) {
|
|
@@ -4236,6 +4283,10 @@ class MentionsInputComponent {
|
|
|
4236
4283
|
.includes(this.mentionSearchText.toLowerCase()));
|
|
4237
4284
|
return users.slice().sort((a, b) => a.name.localeCompare(b.name));
|
|
4238
4285
|
}
|
|
4286
|
+
onUserHover(index) {
|
|
4287
|
+
this.selectedUserIndex = index;
|
|
4288
|
+
this.cdr.markForCheck();
|
|
4289
|
+
}
|
|
4239
4290
|
selectUser(user) {
|
|
4240
4291
|
if (!this.inputElement) {
|
|
4241
4292
|
return;
|
|
@@ -4364,6 +4415,9 @@ class MentionsInputComponent {
|
|
|
4364
4415
|
const name = element.textContent?.replace('@', '') || '';
|
|
4365
4416
|
items.push({ type: 'mention', id, name });
|
|
4366
4417
|
}
|
|
4418
|
+
else if (element.tagName === 'BR') {
|
|
4419
|
+
items.push({ type: 'newline' });
|
|
4420
|
+
}
|
|
4367
4421
|
}
|
|
4368
4422
|
else if (node.nodeType === Node.TEXT_NODE) {
|
|
4369
4423
|
const text = node.textContent || '';
|
|
@@ -4379,10 +4433,10 @@ class MentionsInputComponent {
|
|
|
4379
4433
|
}
|
|
4380
4434
|
}
|
|
4381
4435
|
MentionsInputComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: MentionsInputComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
4382
|
-
MentionsInputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: MentionsInputComponent, selector: "riv-mentions-input", inputs: { content: "content", users: "users", readonly: "readonly", placeholder: "placeholder" }, outputs: { contentChange: "contentChange" }, viewQueries: [{ propertyName: "inputElement", first: true, predicate: ["input"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"mentions-container\" #container>\n <div\n *ngIf=\"!readonly\"\n #input\n class=\"text-content editable\"\n contenteditable=\"true\"\n [attr.data-placeholder]=\"placeholder\"\n (input)=\"onInput()\"\n (keydown)=\"onKeyDown($event)\"\n (paste)=\"onPaste($event)\"\n ></div>\n\n <div *ngIf=\"readonly\" #input class=\"text-content\"></div>\n\n <riv-callout\n *ngIf=\"!readonly && mentionsVisible && mentionAnchor\"\n [anchor]=\"mentionAnchor\"\n [isModal]=\"false\"\n [showCaret]=\"false\"\n [
|
|
4436
|
+
MentionsInputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: MentionsInputComponent, selector: "riv-mentions-input", inputs: { content: "content", users: "users", readonly: "readonly", placeholder: "placeholder" }, outputs: { contentChange: "contentChange" }, viewQueries: [{ propertyName: "inputElement", first: true, predicate: ["input"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"mentions-container\" #container>\n <div\n *ngIf=\"!readonly\"\n #input\n class=\"text-content editable\"\n contenteditable=\"true\"\n [attr.data-placeholder]=\"placeholder\"\n (input)=\"onInput()\"\n (keydown)=\"onKeyDown($event)\"\n (paste)=\"onPaste($event)\"\n ></div>\n\n <div *ngIf=\"readonly\" #input class=\"text-content\"></div>\n\n <riv-callout\n *ngIf=\"!readonly && mentionsVisible && mentionAnchor\"\n [anchor]=\"mentionAnchor\"\n [isModal]=\"false\"\n [showCaret]=\"false\"\n [allowedPositions]=\"['bottom-right', 'top-right']\"\n [theme]=\"'light'\"\n (close)=\"onCalloutClose()\"\n >\n <div class=\"mentions-content\">\n <div class=\"mentions-header\">Mention someone</div>\n <div class=\"mentions-list\">\n <button\n *ngFor=\"let user of getFilteredUsers(); let i = index\"\n [class.selected]=\"i === selectedUserIndex\"\n (mouseenter)=\"onUserHover(i)\"\n (click)=\"selectUser(user)\"\n >\n {{ user.name }}\n </button>\n </div>\n </div>\n </riv-callout>\n</div>\n", styles: [".mentions-container{position:relative;width:100%}.mentions-input{width:100%;border:var(--border-width) solid var(--border-light);border-radius:var(--border-radius-small);color:var(--type-light-high-contrast);overflow-y:auto;white-space:pre-wrap;word-wrap:break-word}.mentions-input:empty:before{content:attr(data-placeholder);color:var(--type-light-disabled);pointer-events:none}.mentions-input:focus{outline:none;border:var(--border-width) solid var(--purp-60)}.mentions-input[contenteditable=false]{color:var(--type-light-disabled);background-color:var(--surface-light-1);cursor:not-allowed}span.mention{color:var(--type-light-link);font-weight:var(--font-weight-heavy)}span.readonly-mention{font-weight:var(--font-weight-heavy)}.mentions-input.warning{border-color:var(--surface-dark-caution)}.mentions-input.error{border-color:var(--surface-dark-danger);box-shadow:inset 0 0 0 var(--border-width-large) var(--surface-dark-danger)}.mentions-input.large{font:var(--input-large);padding:var(--size-medium)}.mentions-list{margin:0;padding:0;max-height:calc(var(--base-grid-size) * 50);overflow-y:auto;display:flex;flex-direction:column;gap:var(--size-xxsmall)}.mentions-list button{padding:var(--size-small) var(--size-small);border-radius:var(--border-radius-medium);cursor:pointer;transition:background-color .2s;font:var(--input-medium);text-align:left}.mentions-list button:hover,.mentions-list button.selected{background-color:var(--surface-light-2)}.mentions-content{max-height:50vh;min-width:calc(var(--base-grid-size) * 62);max-width:50vw;padding:var(--size-large);display:flex;flex-direction:column}.mentions-header{padding:var(--size-small) var(--size-small);font:var(--input-medium);color:var(--type-light-low-contrast)}.text-content{width:100%;min-height:9em;border-radius:var(--border-radius-small);font:var(--input-medium);color:var(--type-light-high-contrast);padding:var(--size-large);resize:vertical}.editable{border:var(--border-width) solid var(--border-light);background-color:var(--surface-light-0)}.text-content::placeholder{color:var(--type-light-disabled)}.text-content.editable[data-placeholder]:empty:before{content:attr(data-placeholder);color:var(--type-light-disabled)}.text-content:disabled{color:var(--type-light-disabled);background-color:var(--surface-light-1)}.text-content:focus{outline:none;border:var(--border-width) solid var(--purp-60)}.text-content.warning{border-color:var(--surface-dark-caution)}.text-content.error{border-color:var(--surface-dark-danger);box-shadow:inset 0 0 0 var(--border-width-large) var(--surface-dark-danger)}.text-content.large{font:var(--input-large);padding:var(--size-medium)}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: CalloutComponent, selector: "riv-callout", inputs: ["anchor", "isModal", "preferredPosition", "allowedPositions", "fallbackDirection", "showCaret", "theme"], outputs: ["close"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
4383
4437
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: MentionsInputComponent, decorators: [{
|
|
4384
4438
|
type: Component,
|
|
4385
|
-
args: [{ selector: 'riv-mentions-input', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"mentions-container\" #container>\n <div\n *ngIf=\"!readonly\"\n #input\n class=\"text-content editable\"\n contenteditable=\"true\"\n [attr.data-placeholder]=\"placeholder\"\n (input)=\"onInput()\"\n (keydown)=\"onKeyDown($event)\"\n (paste)=\"onPaste($event)\"\n ></div>\n\n <div *ngIf=\"readonly\" #input class=\"text-content\"></div>\n\n <riv-callout\n *ngIf=\"!readonly && mentionsVisible && mentionAnchor\"\n [anchor]=\"mentionAnchor\"\n [isModal]=\"false\"\n [showCaret]=\"false\"\n [
|
|
4439
|
+
args: [{ selector: 'riv-mentions-input', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"mentions-container\" #container>\n <div\n *ngIf=\"!readonly\"\n #input\n class=\"text-content editable\"\n contenteditable=\"true\"\n [attr.data-placeholder]=\"placeholder\"\n (input)=\"onInput()\"\n (keydown)=\"onKeyDown($event)\"\n (paste)=\"onPaste($event)\"\n ></div>\n\n <div *ngIf=\"readonly\" #input class=\"text-content\"></div>\n\n <riv-callout\n *ngIf=\"!readonly && mentionsVisible && mentionAnchor\"\n [anchor]=\"mentionAnchor\"\n [isModal]=\"false\"\n [showCaret]=\"false\"\n [allowedPositions]=\"['bottom-right', 'top-right']\"\n [theme]=\"'light'\"\n (close)=\"onCalloutClose()\"\n >\n <div class=\"mentions-content\">\n <div class=\"mentions-header\">Mention someone</div>\n <div class=\"mentions-list\">\n <button\n *ngFor=\"let user of getFilteredUsers(); let i = index\"\n [class.selected]=\"i === selectedUserIndex\"\n (mouseenter)=\"onUserHover(i)\"\n (click)=\"selectUser(user)\"\n >\n {{ user.name }}\n </button>\n </div>\n </div>\n </riv-callout>\n</div>\n", styles: [".mentions-container{position:relative;width:100%}.mentions-input{width:100%;border:var(--border-width) solid var(--border-light);border-radius:var(--border-radius-small);color:var(--type-light-high-contrast);overflow-y:auto;white-space:pre-wrap;word-wrap:break-word}.mentions-input:empty:before{content:attr(data-placeholder);color:var(--type-light-disabled);pointer-events:none}.mentions-input:focus{outline:none;border:var(--border-width) solid var(--purp-60)}.mentions-input[contenteditable=false]{color:var(--type-light-disabled);background-color:var(--surface-light-1);cursor:not-allowed}span.mention{color:var(--type-light-link);font-weight:var(--font-weight-heavy)}span.readonly-mention{font-weight:var(--font-weight-heavy)}.mentions-input.warning{border-color:var(--surface-dark-caution)}.mentions-input.error{border-color:var(--surface-dark-danger);box-shadow:inset 0 0 0 var(--border-width-large) var(--surface-dark-danger)}.mentions-input.large{font:var(--input-large);padding:var(--size-medium)}.mentions-list{margin:0;padding:0;max-height:calc(var(--base-grid-size) * 50);overflow-y:auto;display:flex;flex-direction:column;gap:var(--size-xxsmall)}.mentions-list button{padding:var(--size-small) var(--size-small);border-radius:var(--border-radius-medium);cursor:pointer;transition:background-color .2s;font:var(--input-medium);text-align:left}.mentions-list button:hover,.mentions-list button.selected{background-color:var(--surface-light-2)}.mentions-content{max-height:50vh;min-width:calc(var(--base-grid-size) * 62);max-width:50vw;padding:var(--size-large);display:flex;flex-direction:column}.mentions-header{padding:var(--size-small) var(--size-small);font:var(--input-medium);color:var(--type-light-low-contrast)}.text-content{width:100%;min-height:9em;border-radius:var(--border-radius-small);font:var(--input-medium);color:var(--type-light-high-contrast);padding:var(--size-large);resize:vertical}.editable{border:var(--border-width) solid var(--border-light);background-color:var(--surface-light-0)}.text-content::placeholder{color:var(--type-light-disabled)}.text-content.editable[data-placeholder]:empty:before{content:attr(data-placeholder);color:var(--type-light-disabled)}.text-content:disabled{color:var(--type-light-disabled);background-color:var(--surface-light-1)}.text-content:focus{outline:none;border:var(--border-width) solid var(--purp-60)}.text-content.warning{border-color:var(--surface-dark-caution)}.text-content.error{border-color:var(--surface-dark-danger);box-shadow:inset 0 0 0 var(--border-width-large) var(--surface-dark-danger)}.text-content.large{font:var(--input-large);padding:var(--size-medium)}\n"] }]
|
|
4386
4440
|
}], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { content: [{
|
|
4387
4441
|
type: Input
|
|
4388
4442
|
}], users: [{
|
|
@@ -4398,7 +4452,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
|
|
|
4398
4452
|
args: ['input', { static: false }]
|
|
4399
4453
|
}] } });
|
|
4400
4454
|
(function (MentionsInputComponent) {
|
|
4401
|
-
MentionsInputComponent.ContentTypes = ['mention', 'text'];
|
|
4455
|
+
MentionsInputComponent.ContentTypes = ['mention', 'text', 'newline'];
|
|
4402
4456
|
function contentToPlainText(content) {
|
|
4403
4457
|
return content
|
|
4404
4458
|
.map(item => {
|
|
@@ -4407,6 +4461,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
|
|
|
4407
4461
|
return `@${item.name}`;
|
|
4408
4462
|
case 'text':
|
|
4409
4463
|
return item.text;
|
|
4464
|
+
case 'newline':
|
|
4465
|
+
return '\n';
|
|
4410
4466
|
}
|
|
4411
4467
|
})
|
|
4412
4468
|
.join('');
|
|
@@ -4475,8 +4531,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
|
|
|
4475
4531
|
return digits.length > 10 ? digits.slice(0, 10) : digits;
|
|
4476
4532
|
}
|
|
4477
4533
|
PhoneFieldComponent.clean = clean;
|
|
4478
|
-
function format(
|
|
4479
|
-
const cleaned = clean(
|
|
4534
|
+
function format(value) {
|
|
4535
|
+
const cleaned = clean(value);
|
|
4480
4536
|
if (!cleaned)
|
|
4481
4537
|
return '';
|
|
4482
4538
|
function formatBody(v) {
|
|
@@ -4493,7 +4549,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
|
|
|
4493
4549
|
if (cleaned.length === 11) {
|
|
4494
4550
|
return `1 ${formatBody(cleaned.slice(1))}`;
|
|
4495
4551
|
}
|
|
4496
|
-
return formatBody(
|
|
4552
|
+
return formatBody(cleaned);
|
|
4497
4553
|
}
|
|
4498
4554
|
PhoneFieldComponent.format = format;
|
|
4499
4555
|
})(PhoneFieldComponent || (PhoneFieldComponent = {}));
|