@dialpad/dialtone 9.84.2 → 9.85.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/dist/css/dialtone-default-theme.css +4299 -4053
- package/dist/css/dialtone-default-theme.min.css +1 -1
- package/dist/css/dialtone.css +2290 -2044
- package/dist/css/dialtone.min.css +1 -1
- package/dist/css/tokens/tokens-dp-dark.css +7 -7
- package/dist/css/tokens/tokens-expressive-dark.css +7 -7
- package/dist/css/tokens/tokens-expressive-sm-dark.css +7 -7
- package/dist/css/tokens/tokens-tmo-dark.css +7 -7
- package/dist/tokens/css/tokens-dp-dark.css +7 -7
- package/dist/tokens/css/tokens-expressive-dark.css +7 -7
- package/dist/tokens/css/tokens-expressive-sm-dark.css +7 -7
- package/dist/tokens/css/tokens-tmo-dark.css +7 -7
- package/dist/tokens/doc.json +7696 -7696
- package/dist/tokens/less/tokens-dp-dark.less +1 -1
- package/dist/tokens/less/tokens-expressive-dark.less +1 -1
- package/dist/tokens/less/tokens-expressive-sm-dark.less +1 -1
- package/dist/tokens/less/tokens-tmo-dark.less +1 -1
- package/dist/tokens/themes/dp-dark.cjs +1 -1
- package/dist/tokens/themes/dp-dark.js +1 -1
- package/dist/tokens/themes/expressive-dark.cjs +1 -1
- package/dist/tokens/themes/expressive-dark.js +1 -1
- package/dist/tokens/themes/expressive-sm-dark.cjs +1 -1
- package/dist/tokens/themes/expressive-sm-dark.js +1 -1
- package/dist/tokens/themes/tmo-dark.cjs +1 -1
- package/dist/tokens/themes/tmo-dark.js +1 -1
- package/dist/tokens/tokens-dp-dark.json +1 -1
- package/dist/tokens/tokens-expressive-dark.json +1 -1
- package/dist/tokens/tokens-expressive-sm-dark.json +1 -1
- package/dist/tokens/tokens-tmo-dark.json +1 -1
- package/dist/vue2/component-documentation.json +1 -1
- package/dist/vue2/components/avatar/avatar.vue.cjs +0 -1
- package/dist/vue2/components/avatar/avatar.vue.cjs.map +1 -1
- package/dist/vue2/components/avatar/avatar.vue.js +0 -1
- package/dist/vue2/components/avatar/avatar.vue.js.map +1 -1
- package/dist/vue2/components/collapsible/collapsible_lazy_show.vue.cjs +1 -2
- package/dist/vue2/components/collapsible/collapsible_lazy_show.vue.cjs.map +1 -1
- package/dist/vue2/components/collapsible/collapsible_lazy_show.vue.js +1 -2
- package/dist/vue2/components/collapsible/collapsible_lazy_show.vue.js.map +1 -1
- package/dist/vue2/components/combobox/combobox_empty-list.vue.cjs +1 -2
- package/dist/vue2/components/combobox/combobox_empty-list.vue.cjs.map +1 -1
- package/dist/vue2/components/combobox/combobox_empty-list.vue.js +1 -2
- package/dist/vue2/components/combobox/combobox_empty-list.vue.js.map +1 -1
- package/dist/vue2/components/description_list/description_list.vue.cjs +5 -6
- package/dist/vue2/components/description_list/description_list.vue.cjs.map +1 -1
- package/dist/vue2/components/description_list/description_list.vue.js +5 -6
- package/dist/vue2/components/description_list/description_list.vue.js.map +1 -1
- package/dist/vue2/components/dropdown/dropdown.vue.cjs +0 -1
- package/dist/vue2/components/dropdown/dropdown.vue.cjs.map +1 -1
- package/dist/vue2/components/dropdown/dropdown.vue.js +0 -1
- package/dist/vue2/components/dropdown/dropdown.vue.js.map +1 -1
- package/dist/vue2/components/dropdown/dropdown_separator.vue.cjs +1 -2
- package/dist/vue2/components/dropdown/dropdown_separator.vue.cjs.map +1 -1
- package/dist/vue2/components/dropdown/dropdown_separator.vue.js +1 -2
- package/dist/vue2/components/dropdown/dropdown_separator.vue.js.map +1 -1
- package/dist/vue2/components/item_layout/item_layout.vue.cjs +1 -1
- package/dist/vue2/components/item_layout/item_layout.vue.cjs.map +1 -1
- package/dist/vue2/components/item_layout/item_layout.vue.js +1 -1
- package/dist/vue2/components/item_layout/item_layout.vue.js.map +1 -1
- package/dist/vue2/components/list_item/list_item.vue.cjs +5 -6
- package/dist/vue2/components/list_item/list_item.vue.cjs.map +1 -1
- package/dist/vue2/components/list_item/list_item.vue.js +5 -6
- package/dist/vue2/components/list_item/list_item.vue.js.map +1 -1
- package/dist/vue2/components/rich_text_editor/extensions/mentions/MentionSuggestion.vue.cjs +2 -3
- package/dist/vue2/components/rich_text_editor/extensions/mentions/MentionSuggestion.vue.cjs.map +1 -1
- package/dist/vue2/components/rich_text_editor/extensions/mentions/MentionSuggestion.vue.js +2 -3
- package/dist/vue2/components/rich_text_editor/extensions/mentions/MentionSuggestion.vue.js.map +1 -1
- package/dist/vue2/components/rich_text_editor/extensions/suggestion/SuggestionList.vue.cjs +4 -5
- package/dist/vue2/components/rich_text_editor/extensions/suggestion/SuggestionList.vue.cjs.map +1 -1
- package/dist/vue2/components/rich_text_editor/extensions/suggestion/SuggestionList.vue.js +4 -5
- package/dist/vue2/components/rich_text_editor/extensions/suggestion/SuggestionList.vue.js.map +1 -1
- package/dist/vue2/components/rich_text_editor/rich_text_editor.vue.cjs +13 -48
- package/dist/vue2/components/rich_text_editor/rich_text_editor.vue.cjs.map +1 -1
- package/dist/vue2/components/rich_text_editor/rich_text_editor.vue.js +13 -48
- package/dist/vue2/components/rich_text_editor/rich_text_editor.vue.js.map +1 -1
- package/dist/vue2/components/skeleton/skeleton-shape.vue.cjs +2 -2
- package/dist/vue2/components/skeleton/skeleton-shape.vue.cjs.map +1 -1
- package/dist/vue2/components/skeleton/skeleton-shape.vue.js +2 -2
- package/dist/vue2/components/skeleton/skeleton-shape.vue.js.map +1 -1
- package/dist/vue2/components/skeleton/skeleton-text.vue.cjs +4 -4
- package/dist/vue2/components/skeleton/skeleton-text.vue.cjs.map +1 -1
- package/dist/vue2/components/skeleton/skeleton-text.vue.js +4 -4
- package/dist/vue2/components/skeleton/skeleton-text.vue.js.map +1 -1
- package/dist/vue2/components/skeleton/skeleton.vue.cjs +0 -1
- package/dist/vue2/components/skeleton/skeleton.vue.cjs.map +1 -1
- package/dist/vue2/components/skeleton/skeleton.vue.js +0 -1
- package/dist/vue2/components/skeleton/skeleton.vue.js.map +1 -1
- package/dist/vue2/components/tooltip/tooltip.vue.cjs +0 -1
- package/dist/vue2/components/tooltip/tooltip.vue.cjs.map +1 -1
- package/dist/vue2/components/tooltip/tooltip.vue.js +0 -1
- package/dist/vue2/components/tooltip/tooltip.vue.js.map +1 -1
- package/dist/vue2/recipes/conversation_view/editor/editor.vue.cjs +1 -8
- package/dist/vue2/recipes/conversation_view/editor/editor.vue.cjs.map +1 -1
- package/dist/vue2/recipes/conversation_view/editor/editor.vue.js +1 -8
- package/dist/vue2/recipes/conversation_view/editor/editor.vue.js.map +1 -1
- package/dist/vue2/recipes/conversation_view/feed_item_pill/feed_item_pill.vue.cjs +1 -1
- package/dist/vue2/recipes/conversation_view/feed_item_pill/feed_item_pill.vue.cjs.map +1 -1
- package/dist/vue2/recipes/conversation_view/feed_item_pill/feed_item_pill.vue.js +1 -1
- package/dist/vue2/recipes/conversation_view/feed_item_pill/feed_item_pill.vue.js.map +1 -1
- package/dist/vue2/recipes/conversation_view/feed_item_row/feed_item_row.vue.cjs +1 -1
- package/dist/vue2/recipes/conversation_view/feed_item_row/feed_item_row.vue.cjs.map +1 -1
- package/dist/vue2/recipes/conversation_view/feed_item_row/feed_item_row.vue.js +1 -1
- package/dist/vue2/recipes/conversation_view/feed_item_row/feed_item_row.vue.js.map +1 -1
- package/dist/vue2/recipes/item_layout/contact_info/contact_info.vue.cjs +1 -1
- package/dist/vue2/recipes/item_layout/contact_info/contact_info.vue.cjs.map +1 -1
- package/dist/vue2/recipes/item_layout/contact_info/contact_info.vue.js +1 -1
- package/dist/vue2/recipes/item_layout/contact_info/contact_info.vue.js.map +1 -1
- package/dist/vue2/style.css +44 -277
- package/dist/vue2/types/components/collapsible/collapsible_lazy_show.vue.d.ts.map +1 -1
- package/dist/vue2/types/components/rich_text_editor/rich_text_editor.vue.d.ts +0 -10
- package/dist/vue2/types/components/rich_text_editor/rich_text_editor.vue.d.ts.map +1 -1
- package/dist/vue2/types/recipes/conversation_view/editor/editor.vue.d.ts +0 -9
- package/dist/vue2/types/recipes/conversation_view/editor/editor.vue.d.ts.map +1 -1
- package/dist/vue3/component-documentation.json +1 -1
- package/dist/vue3/components/avatar/avatar.vue.cjs +0 -1
- package/dist/vue3/components/avatar/avatar.vue.cjs.map +1 -1
- package/dist/vue3/components/avatar/avatar.vue.js +0 -1
- package/dist/vue3/components/avatar/avatar.vue.js.map +1 -1
- package/dist/vue3/components/collapsible/collapsible_lazy_show.vue.cjs +2 -3
- package/dist/vue3/components/collapsible/collapsible_lazy_show.vue.cjs.map +1 -1
- package/dist/vue3/components/collapsible/collapsible_lazy_show.vue.js +2 -3
- package/dist/vue3/components/collapsible/collapsible_lazy_show.vue.js.map +1 -1
- package/dist/vue3/components/combobox/combobox_empty-list.vue.cjs +1 -2
- package/dist/vue3/components/combobox/combobox_empty-list.vue.cjs.map +1 -1
- package/dist/vue3/components/combobox/combobox_empty-list.vue.js +1 -2
- package/dist/vue3/components/combobox/combobox_empty-list.vue.js.map +1 -1
- package/dist/vue3/components/description_list/description_list.vue.cjs +5 -6
- package/dist/vue3/components/description_list/description_list.vue.cjs.map +1 -1
- package/dist/vue3/components/description_list/description_list.vue.js +5 -6
- package/dist/vue3/components/description_list/description_list.vue.js.map +1 -1
- package/dist/vue3/components/dropdown/dropdown.vue.cjs +0 -1
- package/dist/vue3/components/dropdown/dropdown.vue.cjs.map +1 -1
- package/dist/vue3/components/dropdown/dropdown.vue.js +0 -1
- package/dist/vue3/components/dropdown/dropdown.vue.js.map +1 -1
- package/dist/vue3/components/dropdown/dropdown_separator.vue.cjs +1 -2
- package/dist/vue3/components/dropdown/dropdown_separator.vue.cjs.map +1 -1
- package/dist/vue3/components/dropdown/dropdown_separator.vue.js +1 -2
- package/dist/vue3/components/dropdown/dropdown_separator.vue.js.map +1 -1
- package/dist/vue3/components/item_layout/item_layout.vue.cjs +16 -16
- package/dist/vue3/components/item_layout/item_layout.vue.cjs.map +1 -1
- package/dist/vue3/components/item_layout/item_layout.vue.js +16 -16
- package/dist/vue3/components/item_layout/item_layout.vue.js.map +1 -1
- package/dist/vue3/components/list_item/list_item.vue.cjs +5 -6
- package/dist/vue3/components/list_item/list_item.vue.cjs.map +1 -1
- package/dist/vue3/components/list_item/list_item.vue.js +5 -6
- package/dist/vue3/components/list_item/list_item.vue.js.map +1 -1
- package/dist/vue3/components/rich_text_editor/extensions/mentions/MentionSuggestion.vue.cjs +2 -3
- package/dist/vue3/components/rich_text_editor/extensions/mentions/MentionSuggestion.vue.cjs.map +1 -1
- package/dist/vue3/components/rich_text_editor/extensions/mentions/MentionSuggestion.vue.js +2 -3
- package/dist/vue3/components/rich_text_editor/extensions/mentions/MentionSuggestion.vue.js.map +1 -1
- package/dist/vue3/components/rich_text_editor/extensions/suggestion/SuggestionList.vue.cjs +5 -6
- package/dist/vue3/components/rich_text_editor/extensions/suggestion/SuggestionList.vue.cjs.map +1 -1
- package/dist/vue3/components/rich_text_editor/extensions/suggestion/SuggestionList.vue.js +5 -6
- package/dist/vue3/components/rich_text_editor/extensions/suggestion/SuggestionList.vue.js.map +1 -1
- package/dist/vue3/components/rich_text_editor/rich_text_editor.vue.cjs +14 -49
- package/dist/vue3/components/rich_text_editor/rich_text_editor.vue.cjs.map +1 -1
- package/dist/vue3/components/rich_text_editor/rich_text_editor.vue.js +14 -49
- package/dist/vue3/components/rich_text_editor/rich_text_editor.vue.js.map +1 -1
- package/dist/vue3/components/scroller/modules/core_scroller.vue.cjs +0 -1
- package/dist/vue3/components/scroller/modules/core_scroller.vue.cjs.map +1 -1
- package/dist/vue3/components/scroller/modules/core_scroller.vue.js +0 -1
- package/dist/vue3/components/scroller/modules/core_scroller.vue.js.map +1 -1
- package/dist/vue3/components/skeleton/skeleton-shape.vue.cjs +2 -2
- package/dist/vue3/components/skeleton/skeleton-shape.vue.cjs.map +1 -1
- package/dist/vue3/components/skeleton/skeleton-shape.vue.js +2 -2
- package/dist/vue3/components/skeleton/skeleton-shape.vue.js.map +1 -1
- package/dist/vue3/components/skeleton/skeleton-text.vue.cjs +4 -4
- package/dist/vue3/components/skeleton/skeleton-text.vue.cjs.map +1 -1
- package/dist/vue3/components/skeleton/skeleton-text.vue.js +4 -4
- package/dist/vue3/components/skeleton/skeleton-text.vue.js.map +1 -1
- package/dist/vue3/components/skeleton/skeleton.vue.cjs +0 -1
- package/dist/vue3/components/skeleton/skeleton.vue.cjs.map +1 -1
- package/dist/vue3/components/skeleton/skeleton.vue.js +0 -1
- package/dist/vue3/components/skeleton/skeleton.vue.js.map +1 -1
- package/dist/vue3/components/tooltip/tooltip.vue.cjs +0 -1
- package/dist/vue3/components/tooltip/tooltip.vue.cjs.map +1 -1
- package/dist/vue3/components/tooltip/tooltip.vue.js +0 -1
- package/dist/vue3/components/tooltip/tooltip.vue.js.map +1 -1
- package/dist/vue3/recipes/conversation_view/editor/editor.vue.cjs +1 -9
- package/dist/vue3/recipes/conversation_view/editor/editor.vue.cjs.map +1 -1
- package/dist/vue3/recipes/conversation_view/editor/editor.vue.js +1 -9
- package/dist/vue3/recipes/conversation_view/editor/editor.vue.js.map +1 -1
- package/dist/vue3/recipes/conversation_view/feed_item_pill/feed_item_pill.vue.cjs +1 -1
- package/dist/vue3/recipes/conversation_view/feed_item_pill/feed_item_pill.vue.cjs.map +1 -1
- package/dist/vue3/recipes/conversation_view/feed_item_pill/feed_item_pill.vue.js +1 -1
- package/dist/vue3/recipes/conversation_view/feed_item_pill/feed_item_pill.vue.js.map +1 -1
- package/dist/vue3/recipes/conversation_view/feed_item_row/feed_item_row.vue.cjs +1 -1
- package/dist/vue3/recipes/conversation_view/feed_item_row/feed_item_row.vue.cjs.map +1 -1
- package/dist/vue3/recipes/conversation_view/feed_item_row/feed_item_row.vue.js +1 -1
- package/dist/vue3/recipes/conversation_view/feed_item_row/feed_item_row.vue.js.map +1 -1
- package/dist/vue3/recipes/item_layout/contact_info/contact_info.vue.cjs +1 -1
- package/dist/vue3/recipes/item_layout/contact_info/contact_info.vue.cjs.map +1 -1
- package/dist/vue3/recipes/item_layout/contact_info/contact_info.vue.js +1 -1
- package/dist/vue3/recipes/item_layout/contact_info/contact_info.vue.js.map +1 -1
- package/dist/vue3/style.css +45 -318
- package/dist/vue3/types/components/avatar/avatar.vue.d.ts.map +1 -1
- package/dist/vue3/types/components/collapsible/collapsible_lazy_show.vue.d.ts.map +1 -1
- package/dist/vue3/types/components/rich_text_editor/rich_text_editor.vue.d.ts +0 -10
- package/dist/vue3/types/components/rich_text_editor/rich_text_editor.vue.d.ts.map +1 -1
- package/dist/vue3/types/components/scroller/modules/core_scroller.vue.d.ts.map +1 -1
- package/dist/vue3/types/components/tooltip/tooltip.vue.d.ts.map +1 -1
- package/dist/vue3/types/recipes/conversation_view/editor/editor.vue.d.ts +0 -9
- package/dist/vue3/types/recipes/conversation_view/editor/editor.vue.d.ts.map +1 -1
- package/package.json +3 -3
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
import { EditorContent, Editor } from "@tiptap/vue-3";
|
|
2
|
-
import { Slice, Fragment } from "@tiptap/pm/model";
|
|
3
2
|
import Blockquote from "@tiptap/extension-blockquote";
|
|
4
3
|
import CodeBlock from "@tiptap/extension-code-block";
|
|
5
4
|
import Document from "@tiptap/extension-document";
|
|
@@ -29,7 +28,6 @@ import channelSuggestion from "./extensions/channels/suggestion.js";
|
|
|
29
28
|
import slashCommandSuggestion from "./extensions/slash_command/suggestion.js";
|
|
30
29
|
import { warnIfUnmounted } from "../../common/utils.js";
|
|
31
30
|
import { resolveComponent, openBlock, createBlock, mergeProps } from "vue";
|
|
32
|
-
/* empty css */
|
|
33
31
|
import _export_sfc from "../../_virtual/_plugin-vue_export-helper.js";
|
|
34
32
|
const _sfc_main = {
|
|
35
33
|
name: "DtRichTextEditor",
|
|
@@ -212,7 +210,7 @@ const _sfc_main = {
|
|
|
212
210
|
},
|
|
213
211
|
/**
|
|
214
212
|
* Whether the input allows for bullet list to be introduced in the text.
|
|
215
|
-
|
|
213
|
+
*/
|
|
216
214
|
allowBulletList: {
|
|
217
215
|
type: Boolean,
|
|
218
216
|
default: true
|
|
@@ -251,13 +249,6 @@ const _sfc_main = {
|
|
|
251
249
|
additionalExtensions: {
|
|
252
250
|
type: Array,
|
|
253
251
|
default: () => []
|
|
254
|
-
},
|
|
255
|
-
/**
|
|
256
|
-
* Use default paste handler.
|
|
257
|
-
*/
|
|
258
|
-
useDefaultPasteHandler: {
|
|
259
|
-
type: Boolean,
|
|
260
|
-
default: false
|
|
261
252
|
}
|
|
262
253
|
},
|
|
263
254
|
emits: [
|
|
@@ -390,7 +381,7 @@ const _sfc_main = {
|
|
|
390
381
|
if (this.allowCodeblock) {
|
|
391
382
|
extensions.push(CodeBlock.configure({
|
|
392
383
|
HTMLAttributes: {
|
|
393
|
-
class: "
|
|
384
|
+
class: "d-rich-text-editor__code-block"
|
|
394
385
|
}
|
|
395
386
|
}));
|
|
396
387
|
}
|
|
@@ -412,10 +403,10 @@ const _sfc_main = {
|
|
|
412
403
|
}
|
|
413
404
|
},
|
|
414
405
|
/**
|
|
415
|
-
|
|
416
|
-
|
|
417
|
-
|
|
418
|
-
|
|
406
|
+
* Because the Editor instance is initialized when mounted it does not get
|
|
407
|
+
* updated props automatically, so the ones that can change after mount have
|
|
408
|
+
* to be hooked up to the Editor's own API.
|
|
409
|
+
*/
|
|
419
410
|
watch: {
|
|
420
411
|
editable(isEditable) {
|
|
421
412
|
this.editor.setEditable(isEditable);
|
|
@@ -457,41 +448,15 @@ const _sfc_main = {
|
|
|
457
448
|
...this.inputAttrs,
|
|
458
449
|
class: this.inputClass
|
|
459
450
|
},
|
|
460
|
-
|
|
461
|
-
|
|
462
|
-
|
|
463
|
-
|
|
464
|
-
|
|
451
|
+
// Moves the <br /> tags inside the previous closing tag to avoid
|
|
452
|
+
// Prosemirror wrapping them within another </p> tag.
|
|
453
|
+
transformPastedHTML(html) {
|
|
454
|
+
return html.replace(/(<\/\w+>)((<br \/>)+)/g, "$2$3$1");
|
|
455
|
+
}
|
|
465
456
|
}
|
|
466
457
|
});
|
|
467
458
|
this.addEditorListeners();
|
|
468
459
|
},
|
|
469
|
-
handlerPreserveBreaksOnPaste(view, event, slice) {
|
|
470
|
-
var _a;
|
|
471
|
-
const { state } = view;
|
|
472
|
-
const { tr } = state;
|
|
473
|
-
if (!state.schema.nodes.hardBreak) {
|
|
474
|
-
return false;
|
|
475
|
-
}
|
|
476
|
-
const clipboardText = (_a = event.clipboardData) == null ? void 0 : _a.getData("text/plain").trim();
|
|
477
|
-
if (!clipboardText) {
|
|
478
|
-
return false;
|
|
479
|
-
}
|
|
480
|
-
const textLines = clipboardText.split(/(?:\r\n|\r|\n)/g);
|
|
481
|
-
const nodes = textLines.reduce((nodes2, line, index) => {
|
|
482
|
-
if (line.length > 0) {
|
|
483
|
-
nodes2.push(state.schema.text(line));
|
|
484
|
-
}
|
|
485
|
-
if (index < textLines.length - 1) {
|
|
486
|
-
nodes2.push(state.schema.nodes.hardBreak.create());
|
|
487
|
-
}
|
|
488
|
-
return nodes2;
|
|
489
|
-
}, []);
|
|
490
|
-
view.dispatch(
|
|
491
|
-
tr.replaceSelection(Slice.maxOpen(Fragment.fromArray(nodes))).scrollIntoView()
|
|
492
|
-
);
|
|
493
|
-
return true;
|
|
494
|
-
},
|
|
495
460
|
processValue(newValue, returnIfEqual = true) {
|
|
496
461
|
let currentValue = this.getOutput();
|
|
497
462
|
if (this.outputFormat === "json") {
|
|
@@ -538,7 +503,7 @@ const _sfc_main = {
|
|
|
538
503
|
return this.editor.getHTML();
|
|
539
504
|
case "text":
|
|
540
505
|
default:
|
|
541
|
-
return this.editor.getText();
|
|
506
|
+
return this.editor.getText({ blockSeparator: "\n" });
|
|
542
507
|
}
|
|
543
508
|
},
|
|
544
509
|
getExtension(extension, options) {
|
|
@@ -568,8 +533,8 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
|
|
|
568
533
|
const _component_editor_content = resolveComponent("editor-content");
|
|
569
534
|
return openBlock(), createBlock(_component_editor_content, mergeProps({
|
|
570
535
|
editor: $data.editor,
|
|
571
|
-
|
|
572
|
-
|
|
536
|
+
class: "d-rich-text-editor",
|
|
537
|
+
"data-qa": "dt-rich-text-editor"
|
|
573
538
|
}, $options.attrs), null, 16, ["editor"]);
|
|
574
539
|
}
|
|
575
540
|
const DtRichTextEditor = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"rich_text_editor.vue.js","sources":["../../../components/rich_text_editor/rich_text_editor.vue"],"sourcesContent":["<template>\n <editor-content\n :editor=\"editor\"\n data-qa=\"dt-rich-text-editor\"\n class=\"dt-rich-text-editor\"\n v-bind=\"attrs\"\n />\n</template>\n\n<script>\n/* eslint-disable max-lines */\nimport { Editor, EditorContent } from '@tiptap/vue-3';\nimport { Slice, Fragment } from '@tiptap/pm/model';\nimport Blockquote from '@tiptap/extension-blockquote';\nimport CodeBlock from '@tiptap/extension-code-block';\nimport Document from '@tiptap/extension-document';\nimport HardBreak from '@tiptap/extension-hard-break';\nimport Paragraph from '@tiptap/extension-paragraph';\nimport Placeholder from '@tiptap/extension-placeholder';\nimport Bold from '@tiptap/extension-bold';\nimport BulletList from '@tiptap/extension-bullet-list';\nimport Italic from '@tiptap/extension-italic';\nimport TipTapLink from '@tiptap/extension-link';\nimport ListItem from '@tiptap/extension-list-item';\nimport OrderedList from '@tiptap/extension-ordered-list';\nimport Strike from '@tiptap/extension-strike';\nimport Underline from '@tiptap/extension-underline';\nimport Text from '@tiptap/extension-text';\nimport TextAlign from '@tiptap/extension-text-align';\nimport History from '@tiptap/extension-history';\nimport Emoji from './extensions/emoji';\nimport CustomLink from './extensions/custom_link';\nimport { MentionPlugin } from './extensions/mentions/mention';\nimport { ChannelPlugin } from './extensions/channels/channel';\nimport { SlashCommandPlugin } from './extensions/slash_command/slash_command';\nimport {\n RICH_TEXT_EDITOR_OUTPUT_FORMATS,\n RICH_TEXT_EDITOR_AUTOFOCUS_TYPES,\n RICH_TEXT_EDITOR_SUPPORTED_LINK_PROTOCOLS,\n} from './rich_text_editor_constants';\nimport { emojiPattern } from 'regex-combined-emojis';\n\nimport mentionSuggestion from './extensions/mentions/suggestion';\nimport channelSuggestion from './extensions/channels/suggestion';\nimport slashCommandSuggestion from './extensions/slash_command/suggestion';\nimport { warnIfUnmounted } from '@/common/utils';\n\nexport default {\n name: 'DtRichTextEditor',\n\n components: {\n EditorContent,\n },\n\n props: {\n /**\n * Value of the input. The object format should match TipTap's JSON\n * document structure: https://tiptap.dev/guide/output#option-1-json\n */\n modelValue: {\n type: [Object, String],\n default: '',\n },\n\n /**\n * Whether the input is editable\n */\n editable: {\n type: Boolean,\n default: true,\n },\n\n /**\n * Prevents the user from typing any further. Deleting text will still work.\n */\n preventTyping: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Whether the input allows for line breaks to be introduced in the text by pressing enter. If this is disabled,\n * line breaks can still be entered by pressing shift+enter.\n */\n allowLineBreaks: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Descriptive label for the input element\n */\n inputAriaLabel: {\n type: String,\n required: true,\n },\n\n /**\n * Additional class name for the input element. Only accepts a String value\n * because this is passed to the editor via options. For multiple classes,\n * join them into one string, e.g. \"d-p8 d-hmx96\"\n */\n inputClass: {\n type: String,\n default: '',\n },\n\n /**\n * Whether the input should receive focus after the component has been\n * mounted. Either one of `start`, `end`, `all` or a Boolean or a Number.\n * - `start` Sets the focus to the beginning of the input\n * - `end` Sets the focus to the end of the input\n * - `all` Selects the whole contents of the input\n * - `Number` Sets the focus to a specific position in the input\n * - `true` Defaults to `start`\n * - `false` Disables autofocus\n * @values true, false, start, end, all, number\n */\n autoFocus: {\n type: [Boolean, String, Number],\n default: false,\n validator (autoFocus) {\n if (typeof autoFocus === 'string') {\n return RICH_TEXT_EDITOR_AUTOFOCUS_TYPES.includes(autoFocus);\n }\n return true;\n },\n },\n\n /**\n * The output format that the editor uses when emitting the \"@input\" event.\n * One of `text`, `json`, `html`. See https://tiptap.dev/guide/output for\n * examples.\n * @values text, json, html\n */\n outputFormat: {\n type: String,\n default: 'html',\n validator (outputFormat) {\n return RICH_TEXT_EDITOR_OUTPUT_FORMATS.includes(outputFormat);\n },\n },\n\n /**\n * Placeholder text\n */\n placeholder: {\n type: String,\n default: '',\n },\n\n /**\n * Enables the TipTap Link extension and optionally passes configurations to it\n *\n * It is not recommended to use this and the custom link extension at the same time.\n */\n link: {\n type: [Boolean, Object],\n default: false,\n },\n\n /**\n * Enables the Custom Link extension and optionally passes configurations to it\n *\n * It is not recommended to use this and the built in TipTap link extension at the same time.\n *\n * The custom link does some additional things on top of the built in TipTap link\n * extension such as styling phone numbers and IP adresses as links, and allows you\n * to linkify text without having to type a space after the link. Currently it is missing some\n * functionality such as editing links and will likely require more work to be fully usable,\n * so it is recommended to use the built in TipTap link for now.\n */\n customLink: {\n type: [Boolean, Object],\n default: false,\n },\n\n /**\n * suggestion object containing the items query function.\n * The valid keys passed into this object can be found here: https://tiptap.dev/api/utilities/suggestion\n *\n * The only required key is the items function which is used to query the contacts for suggestion.\n * items({ query }) => { return [ContactObject]; }\n * ContactObject format:\n * { name: string, avatarSrc: string, id: string }\n *\n * When null, it does not add the plugin.\n */\n mentionSuggestion: {\n type: Object,\n default: null,\n },\n\n /**\n * suggestion object containing the items query function.\n * The valid keys passed into this object can be found here: https://tiptap.dev/api/utilities/suggestion\n *\n * The only required key is the items function which is used to query the channels for suggestion.\n * items({ query }) => { return [ChannelObject]; }\n * ChannelObject format:\n * { name: string, id: string, locked: boolean }\n *\n * When null, it does not add the plugin. Setting locked to true will display a lock rather than hash.\n */\n channelSuggestion: {\n type: Object,\n default: null,\n },\n\n /**\n * suggestion object containing the items query function.\n * The valid keys passed into this object can be found here: https://tiptap.dev/api/utilities/suggestion\n *\n * The only required key is the items function which is used to query the slash commands for suggestion.\n * items({ query }) => { return [SlashCommandObject]; }\n * SlashCommandObject format:\n * { command: string, description: string, parametersExample?: string }\n * The \"parametersExample\" parameter is optional, and describes an example\n * of the parameters that command can take.\n *\n * When null, it does not add the plugin.\n * Note that slash commands only work when they are the first word in the input.\n */\n slashCommandSuggestion: {\n type: Object,\n default: null,\n },\n\n /**\n * Whether the input allows for block quote.\n */\n allowBlockquote: {\n type: Boolean,\n default: true,\n },\n\n /**\n * Whether the input allows for bold to be introduced in the text.\n */\n allowBold: {\n type: Boolean,\n default: true,\n },\n\n /**\n * Whether the input allows for bullet list to be introduced in the text.\n */\n allowBulletList: {\n type: Boolean,\n default: true,\n },\n\n /**\n * Whether the input allows for italic to be introduced in the text.\n */\n allowItalic: {\n type: Boolean,\n default: true,\n },\n\n /**\n * Whether the input allows for strike to be introduced in the text.\n */\n allowStrike: {\n type: Boolean,\n default: true,\n },\n\n /**\n * Whether the input allows for underline to be introduced in the text.\n */\n allowUnderline: {\n type: Boolean,\n default: true,\n },\n\n /**\n * Whether the input allows codeblock to be introduced in the text.\n */\n allowCodeblock: {\n type: Boolean,\n default: true,\n },\n\n /**\n * Additional TipTap extensions to be added to the editor.\n */\n additionalExtensions: {\n type: Array,\n default: () => [],\n },\n\n /**\n * Use default paste handler.\n */\n useDefaultPasteHandler: {\n type: Boolean,\n default: false,\n },\n },\n\n emits: [\n /**\n * Editor input event\n * @event input\n * @type {String|JSON}\n */\n 'input',\n\n /**\n * Event to sync the value with the parent\n * @event update:value\n * @type {String|JSON}\n */\n 'update:modelValue',\n\n /**\n * Editor blur event\n * @event blur\n * @type {FocusEvent}\n */\n 'blur',\n\n /**\n * Editor focus event\n * @event focus\n * @type {FocusEvent}\n */\n 'focus',\n\n /**\n * Enter was pressed. Note that shift enter must be pressed to line break the input.\n * @event enter\n * @type {String}\n */\n 'enter',\n ],\n\n data () {\n return {\n editor: null,\n };\n },\n\n computed: {\n attrs () {\n return {\n ...this.$attrs,\n onInput: () => {},\n onFocus: () => {},\n onBlur: () => {},\n };\n },\n\n // eslint-disable-next-line complexity\n extensions () {\n // These are the default extensions needed just for plain text.\n const extensions = [Document, Paragraph, Text, History];\n if (this.link) {\n extensions.push(TipTapLink.extend({ inclusive: false }).configure({\n HTMLAttributes: {\n class: 'd-link d-wb-break-all',\n },\n autolink: true,\n protocols: RICH_TEXT_EDITOR_SUPPORTED_LINK_PROTOCOLS,\n }));\n }\n if (this.customLink) {\n extensions.push(this.getExtension(CustomLink, this.customLink));\n }\n if (this.allowBlockquote) {\n extensions.push(Blockquote);\n }\n if (this.allowBold) {\n extensions.push(Bold);\n }\n if (this.allowBulletList) {\n extensions.push(BulletList);\n extensions.push(ListItem);\n extensions.push(OrderedList);\n }\n if (this.allowItalic) {\n extensions.push(Italic);\n }\n if (this.allowStrike) {\n extensions.push(Strike);\n }\n if (this.allowUnderline) {\n extensions.push(Underline);\n }\n\n // Enable placeholderText\n if (this.placeholder) {\n extensions.push(\n Placeholder.configure({ placeholder: this.placeholder }),\n );\n }\n\n // make sure that this is defined before any other extensions\n // where Enter and Shift+Enter should have its own interaction. otherwise it will be ignored\n if (!this.allowLineBreaks) {\n const self = this;\n extensions.push(\n HardBreak.extend({\n addKeyboardShortcuts () {\n return {\n Enter: () => {\n self.$emit('enter');\n return true;\n },\n 'Shift-Enter': () => {\n this.editor.commands.setHardBreak();\n return true;\n },\n };\n },\n }),\n );\n } else {\n extensions.push(HardBreak);\n }\n\n if (this.mentionSuggestion) {\n // Add both the suggestion plugin as well as means for user to add suggestion items to the plugin\n const suggestionObject = { ...this.mentionSuggestion, ...mentionSuggestion };\n extensions.push(MentionPlugin.configure({ suggestion: suggestionObject }));\n }\n\n if (this.channelSuggestion) {\n // Add both the suggestion plugin as well as means for user to add suggestion items to the plugin\n const suggestionObject = { ...this.channelSuggestion, ...channelSuggestion };\n extensions.push(ChannelPlugin.configure({ suggestion: suggestionObject }));\n }\n\n if (this.slashCommandSuggestion) {\n // Add both the suggestion plugin as well as means for user to add suggestion items to the plugin\n const suggestionObject = { ...this.slashCommandSuggestion, ...slashCommandSuggestion };\n extensions.push(SlashCommandPlugin.configure({ suggestion: suggestionObject }));\n }\n\n // Emoji has some interactions with Enter key\n // hence this should be done last otherwise the enter wont add a emoji.\n extensions.push(Emoji);\n\n extensions.push(TextAlign.configure({\n types: ['paragraph'],\n defaultAlignment: 'left',\n }));\n\n if (this.allowCodeblock) {\n extensions.push(CodeBlock.configure({\n HTMLAttributes: {\n class: 'dt-rich-text-editor--code-block',\n },\n }));\n }\n\n if (this.additionalExtensions.length) {\n extensions.push(...this.additionalExtensions);\n }\n\n return extensions;\n },\n\n inputAttrs () {\n const attrs = {\n 'aria-label': this.inputAriaLabel,\n 'aria-multiline': true,\n role: 'textbox',\n };\n if (!this.editable) {\n attrs['aria-readonly'] = true;\n }\n return attrs;\n },\n },\n\n /**\n * Because the Editor instance is initialized when mounted it does not get\n * updated props automatically, so the ones that can change after mount have\n * to be hooked up to the Editor's own API.\n */\n watch: {\n editable (isEditable) {\n this.editor.setEditable(isEditable);\n this.updateEditorAttributes({ 'aria-readonly': !isEditable });\n },\n\n inputClass (newClass) {\n this.updateEditorAttributes({ class: newClass });\n },\n\n inputAriaLabel (newLabel) {\n this.updateEditorAttributes({ 'aria-label': newLabel });\n },\n\n extensions () {\n // Extensions can't be registered on the fly, so just recreate the editor.\n // https://github.com/ueberdosis/tiptap/issues/1044\n this.destroyEditor();\n this.createEditor();\n },\n\n modelValue (newValue) {\n this.processValue(newValue);\n },\n },\n\n created () {\n this.createEditor();\n },\n\n beforeUnmount () {\n this.destroyEditor();\n },\n\n mounted () {\n warnIfUnmounted(this.$el, this.$options.name);\n this.processValue(this.modelValue, false);\n },\n\n methods: {\n\n createEditor () {\n // For all available options, see https://tiptap.dev/api/editor#settings\n this.editor = new Editor({\n autofocus: this.autoFocus,\n content: this.modelValue,\n editable: this.editable,\n extensions: this.extensions,\n editorProps: {\n attributes: {\n ...this.inputAttrs,\n class: this.inputClass,\n },\n\n /* Absolutely crazy that this is what's needed to paste line breaks properly in prosemirror, but it does seem\n to fix our issue of line breaks outputting as paragraphs. Code taken from this thread:\n https://discuss.prosemirror.net/t/how-to-preserve-hard-breaks-when-pasting-html-into-a-plain-text-schema/4202/4\n */\n ...(!this.useDefaultPasteHandler && { handlePaste: this.handlerPreserveBreaksOnPaste }),\n },\n });\n this.addEditorListeners();\n },\n\n handlerPreserveBreaksOnPaste (view, event, slice) {\n const { state } = view;\n const { tr } = state;\n\n if (!state.schema.nodes.hardBreak) {\n return false;\n }\n\n const clipboardText = event.clipboardData?.getData('text/plain').trim();\n\n if (!clipboardText) {\n return false;\n }\n\n const textLines = clipboardText.split(/(?:\\r\\n|\\r|\\n)/g);\n\n const nodes = textLines.reduce((nodes, line, index) => {\n if (line.length > 0) {\n nodes.push(state.schema.text(line));\n }\n\n if (index < textLines.length - 1) {\n nodes.push(state.schema.nodes.hardBreak.create());\n }\n\n return nodes;\n }, []);\n\n view.dispatch(\n tr.replaceSelection(Slice.maxOpen(Fragment.fromArray(nodes))).scrollIntoView(),\n );\n\n return true;\n },\n\n processValue (newValue, returnIfEqual = true) {\n let currentValue = this.getOutput();\n if (this.outputFormat === 'json') {\n newValue = JSON.stringify(newValue);\n currentValue = JSON.stringify(currentValue);\n }\n if (returnIfEqual && newValue === currentValue) {\n // The new value came from this component and was passed back down\n // through the parent, so don't do anything here.\n return;\n }\n\n const inputUnicodeRegex = new RegExp(`(${emojiPattern})`, 'g');\n\n // If the text contains emoji characters convert them to emoji component tags\n newValue = newValue.replace(inputUnicodeRegex, '<emoji-component code=\"$1\"></emoji-component>');\n\n // Otherwise replace the content (resets the cursor position).\n this.editor.commands.setContent(newValue, false);\n },\n\n destroyEditor () {\n this.editor.destroy();\n },\n\n /**\n * The Editor exposes event hooks that we have to map our emits into. See\n * https://tiptap.dev/api/events for all events.\n */\n addEditorListeners () {\n // The content has changed.\n this.editor.on('update', () => {\n const value = this.getOutput();\n // When preventTyping is true and user wants to type, we revert to last value\n // If Backspace (keyCode = 8) is pressed, we allow updating the text\n if (this.preventTyping && this.editor.view?.input?.lastKeyCode !== 8) {\n this.editor.commands.setContent(this.value, false);\n return;\n }\n this.$emit('input', value);\n this.$emit('update:modelValue', value);\n });\n\n // The editor is focused.\n this.editor.on('focus', ({ event }) => {\n this.$emit('focus', event);\n });\n\n // The editor isn’t focused anymore.\n this.editor.on('blur', ({ event }) => {\n this.$emit('blur', event);\n });\n },\n\n getOutput () {\n switch (this.outputFormat) {\n case 'json':\n return this.editor.getJSON();\n case 'html':\n return this.editor.getHTML();\n case 'text':\n default:\n return this.editor.getText();\n }\n },\n\n getExtension (extension, options) {\n if (typeof options === 'boolean') {\n return extension;\n }\n return extension.configure?.(options);\n },\n\n updateEditorAttributes (attributes) {\n this.editor.setOptions({\n editorProps: {\n attributes: {\n ...this.inputAttrs,\n class: this.inputClass,\n ...attributes,\n },\n },\n });\n },\n\n focusEditor () {\n this.editor.commands.focus();\n },\n },\n};\n</script>\n\n<style lang=\"less\">\n .dt-rich-text-editor {\n &--code-block {\n background: var(--dt-color-surface-secondary);\n padding: var(--dt-space-400);\n }\n\n > .ProseMirror {\n box-shadow: none;\n\n p.is-editor-empty:first-child::before {\n content: attr(data-placeholder);\n float: left;\n color: var(--dt-color-foreground-placeholder);\n pointer-events: none;\n height: 0;\n }\n\n ul, ol {\n padding-left: var(--dt-space-525);\n }\n\n ul > li {\n list-style-type: disc;\n }\n\n ol > li {\n list-style-type: decimal;\n }\n\n blockquote {\n padding-left: var(--dt-space-400);\n border-left: var(--dt-size-border-300) solid var(--dt-color-foreground-muted-inverted);\n margin-left: 0;\n }\n }\n }\n</style>\n"],"names":["nodes","_openBlock","_createBlock","_mergeProps"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"rich_text_editor.vue.js","sources":["../../../components/rich_text_editor/rich_text_editor.vue"],"sourcesContent":["<!-- eslint-disable vue/no-restricted-class -->\n<template>\n <editor-content\n :editor=\"editor\"\n class=\"d-rich-text-editor\"\n data-qa=\"dt-rich-text-editor\"\n v-bind=\"attrs\"\n />\n</template>\n\n<script>\n/* eslint-disable max-lines */\nimport { Editor, EditorContent } from '@tiptap/vue-3';\nimport Blockquote from '@tiptap/extension-blockquote';\nimport CodeBlock from '@tiptap/extension-code-block';\nimport Document from '@tiptap/extension-document';\nimport HardBreak from '@tiptap/extension-hard-break';\nimport Paragraph from '@tiptap/extension-paragraph';\nimport Placeholder from '@tiptap/extension-placeholder';\nimport Bold from '@tiptap/extension-bold';\nimport BulletList from '@tiptap/extension-bullet-list';\nimport Italic from '@tiptap/extension-italic';\nimport TipTapLink from '@tiptap/extension-link';\nimport ListItem from '@tiptap/extension-list-item';\nimport OrderedList from '@tiptap/extension-ordered-list';\nimport Strike from '@tiptap/extension-strike';\nimport Underline from '@tiptap/extension-underline';\nimport Text from '@tiptap/extension-text';\nimport TextAlign from '@tiptap/extension-text-align';\nimport History from '@tiptap/extension-history';\nimport Emoji from './extensions/emoji';\nimport CustomLink from './extensions/custom_link';\nimport { MentionPlugin } from './extensions/mentions/mention';\nimport { ChannelPlugin } from './extensions/channels/channel';\nimport { SlashCommandPlugin } from './extensions/slash_command/slash_command';\nimport {\n RICH_TEXT_EDITOR_OUTPUT_FORMATS,\n RICH_TEXT_EDITOR_AUTOFOCUS_TYPES,\n RICH_TEXT_EDITOR_SUPPORTED_LINK_PROTOCOLS,\n} from './rich_text_editor_constants';\nimport { emojiPattern } from 'regex-combined-emojis';\n\nimport mentionSuggestion from './extensions/mentions/suggestion';\nimport channelSuggestion from './extensions/channels/suggestion';\nimport slashCommandSuggestion from './extensions/slash_command/suggestion';\nimport { warnIfUnmounted } from '@/common/utils';\n\nexport default {\n name: 'DtRichTextEditor',\n\n components: {\n EditorContent,\n },\n\n props: {\n /**\n * Value of the input. The object format should match TipTap's JSON\n * document structure: https://tiptap.dev/guide/output#option-1-json\n */\n modelValue: {\n type: [Object, String],\n default: '',\n },\n\n /**\n * Whether the input is editable\n */\n editable: {\n type: Boolean,\n default: true,\n },\n\n /**\n * Prevents the user from typing any further. Deleting text will still work.\n */\n preventTyping: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Whether the input allows for line breaks to be introduced in the text by pressing enter. If this is disabled,\n * line breaks can still be entered by pressing shift+enter.\n */\n allowLineBreaks: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Descriptive label for the input element\n */\n inputAriaLabel: {\n type: String,\n required: true,\n },\n\n /**\n * Additional class name for the input element. Only accepts a String value\n * because this is passed to the editor via options. For multiple classes,\n * join them into one string, e.g. \"d-p8 d-hmx96\"\n */\n inputClass: {\n type: String,\n default: '',\n },\n\n /**\n * Whether the input should receive focus after the component has been\n * mounted. Either one of `start`, `end`, `all` or a Boolean or a Number.\n * - `start` Sets the focus to the beginning of the input\n * - `end` Sets the focus to the end of the input\n * - `all` Selects the whole contents of the input\n * - `Number` Sets the focus to a specific position in the input\n * - `true` Defaults to `start`\n * - `false` Disables autofocus\n * @values true, false, start, end, all, number\n */\n autoFocus: {\n type: [Boolean, String, Number],\n default: false,\n validator (autoFocus) {\n if (typeof autoFocus === 'string') {\n return RICH_TEXT_EDITOR_AUTOFOCUS_TYPES.includes(autoFocus);\n }\n return true;\n },\n },\n\n /**\n * The output format that the editor uses when emitting the \"@input\" event.\n * One of `text`, `json`, `html`. See https://tiptap.dev/guide/output for\n * examples.\n * @values text, json, html\n */\n outputFormat: {\n type: String,\n default: 'html',\n validator (outputFormat) {\n return RICH_TEXT_EDITOR_OUTPUT_FORMATS.includes(outputFormat);\n },\n },\n\n /**\n * Placeholder text\n */\n placeholder: {\n type: String,\n default: '',\n },\n\n /**\n * Enables the TipTap Link extension and optionally passes configurations to it\n *\n * It is not recommended to use this and the custom link extension at the same time.\n */\n link: {\n type: [Boolean, Object],\n default: false,\n },\n\n /**\n * Enables the Custom Link extension and optionally passes configurations to it\n *\n * It is not recommended to use this and the built in TipTap link extension at the same time.\n *\n * The custom link does some additional things on top of the built in TipTap link\n * extension such as styling phone numbers and IP adresses as links, and allows you\n * to linkify text without having to type a space after the link. Currently it is missing some\n * functionality such as editing links and will likely require more work to be fully usable,\n * so it is recommended to use the built in TipTap link for now.\n */\n customLink: {\n type: [Boolean, Object],\n default: false,\n },\n\n /**\n * suggestion object containing the items query function.\n * The valid keys passed into this object can be found here: https://tiptap.dev/api/utilities/suggestion\n *\n * The only required key is the items function which is used to query the contacts for suggestion.\n * items({ query }) => { return [ContactObject]; }\n * ContactObject format:\n * { name: string, avatarSrc: string, id: string }\n *\n * When null, it does not add the plugin.\n */\n mentionSuggestion: {\n type: Object,\n default: null,\n },\n\n /**\n * suggestion object containing the items query function.\n * The valid keys passed into this object can be found here: https://tiptap.dev/api/utilities/suggestion\n *\n * The only required key is the items function which is used to query the channels for suggestion.\n * items({ query }) => { return [ChannelObject]; }\n * ChannelObject format:\n * { name: string, id: string, locked: boolean }\n *\n * When null, it does not add the plugin. Setting locked to true will display a lock rather than hash.\n */\n channelSuggestion: {\n type: Object,\n default: null,\n },\n\n /**\n * suggestion object containing the items query function.\n * The valid keys passed into this object can be found here: https://tiptap.dev/api/utilities/suggestion\n *\n * The only required key is the items function which is used to query the slash commands for suggestion.\n * items({ query }) => { return [SlashCommandObject]; }\n * SlashCommandObject format:\n * { command: string, description: string, parametersExample?: string }\n * The \"parametersExample\" parameter is optional, and describes an example\n * of the parameters that command can take.\n *\n * When null, it does not add the plugin.\n * Note that slash commands only work when they are the first word in the input.\n */\n slashCommandSuggestion: {\n type: Object,\n default: null,\n },\n\n /**\n * Whether the input allows for block quote.\n */\n allowBlockquote: {\n type: Boolean,\n default: true,\n },\n\n /**\n * Whether the input allows for bold to be introduced in the text.\n */\n allowBold: {\n type: Boolean,\n default: true,\n },\n\n /**\n * Whether the input allows for bullet list to be introduced in the text.\n */\n allowBulletList: {\n type: Boolean,\n default: true,\n },\n\n /**\n * Whether the input allows for italic to be introduced in the text.\n */\n allowItalic: {\n type: Boolean,\n default: true,\n },\n\n /**\n * Whether the input allows for strike to be introduced in the text.\n */\n allowStrike: {\n type: Boolean,\n default: true,\n },\n\n /**\n * Whether the input allows for underline to be introduced in the text.\n */\n allowUnderline: {\n type: Boolean,\n default: true,\n },\n\n /**\n * Whether the input allows codeblock to be introduced in the text.\n */\n allowCodeblock: {\n type: Boolean,\n default: true,\n },\n\n /**\n * Additional TipTap extensions to be added to the editor.\n */\n additionalExtensions: {\n type: Array,\n default: () => [],\n },\n },\n\n emits: [\n /**\n * Editor input event\n * @event input\n * @type {String|JSON}\n */\n 'input',\n\n /**\n * Event to sync the value with the parent\n * @event update:value\n * @type {String|JSON}\n */\n 'update:modelValue',\n\n /**\n * Editor blur event\n * @event blur\n * @type {FocusEvent}\n */\n 'blur',\n\n /**\n * Editor focus event\n * @event focus\n * @type {FocusEvent}\n */\n 'focus',\n\n /**\n * Enter was pressed. Note that shift enter must be pressed to line break the input.\n * @event enter\n * @type {String}\n */\n 'enter',\n ],\n\n data () {\n return {\n editor: null,\n };\n },\n\n computed: {\n attrs () {\n return {\n ...this.$attrs,\n onInput: () => {},\n onFocus: () => {},\n onBlur: () => {},\n };\n },\n\n // eslint-disable-next-line complexity\n extensions () {\n // These are the default extensions needed just for plain text.\n const extensions = [Document, Paragraph, Text, History];\n if (this.link) {\n extensions.push(TipTapLink.extend({ inclusive: false }).configure({\n HTMLAttributes: {\n class: 'd-link d-wb-break-all',\n },\n autolink: true,\n protocols: RICH_TEXT_EDITOR_SUPPORTED_LINK_PROTOCOLS,\n }));\n }\n if (this.customLink) {\n extensions.push(this.getExtension(CustomLink, this.customLink));\n }\n if (this.allowBlockquote) {\n extensions.push(Blockquote);\n }\n if (this.allowBold) {\n extensions.push(Bold);\n }\n if (this.allowBulletList) {\n extensions.push(BulletList);\n extensions.push(ListItem);\n extensions.push(OrderedList);\n }\n if (this.allowItalic) {\n extensions.push(Italic);\n }\n if (this.allowStrike) {\n extensions.push(Strike);\n }\n if (this.allowUnderline) {\n extensions.push(Underline);\n }\n\n // Enable placeholderText\n if (this.placeholder) {\n extensions.push(\n Placeholder.configure({ placeholder: this.placeholder }),\n );\n }\n\n // make sure that this is defined before any other extensions\n // where Enter and Shift+Enter should have its own interaction. otherwise it will be ignored\n if (!this.allowLineBreaks) {\n const self = this;\n extensions.push(\n HardBreak.extend({\n addKeyboardShortcuts () {\n return {\n Enter: () => {\n self.$emit('enter');\n return true;\n },\n 'Shift-Enter': () => {\n this.editor.commands.setHardBreak();\n return true;\n },\n };\n },\n }),\n );\n } else {\n extensions.push(HardBreak);\n }\n\n if (this.mentionSuggestion) {\n // Add both the suggestion plugin as well as means for user to add suggestion items to the plugin\n const suggestionObject = { ...this.mentionSuggestion, ...mentionSuggestion };\n extensions.push(MentionPlugin.configure({ suggestion: suggestionObject }));\n }\n\n if (this.channelSuggestion) {\n // Add both the suggestion plugin as well as means for user to add suggestion items to the plugin\n const suggestionObject = { ...this.channelSuggestion, ...channelSuggestion };\n extensions.push(ChannelPlugin.configure({ suggestion: suggestionObject }));\n }\n\n if (this.slashCommandSuggestion) {\n // Add both the suggestion plugin as well as means for user to add suggestion items to the plugin\n const suggestionObject = { ...this.slashCommandSuggestion, ...slashCommandSuggestion };\n extensions.push(SlashCommandPlugin.configure({ suggestion: suggestionObject }));\n }\n\n // Emoji has some interactions with Enter key\n // hence this should be done last otherwise the enter wont add a emoji.\n extensions.push(Emoji);\n\n extensions.push(TextAlign.configure({\n types: ['paragraph'],\n defaultAlignment: 'left',\n }));\n\n if (this.allowCodeblock) {\n extensions.push(CodeBlock.configure({\n HTMLAttributes: {\n class: 'd-rich-text-editor__code-block',\n },\n }));\n }\n\n if (this.additionalExtensions.length) {\n extensions.push(...this.additionalExtensions);\n }\n\n return extensions;\n },\n\n inputAttrs () {\n const attrs = {\n 'aria-label': this.inputAriaLabel,\n 'aria-multiline': true,\n role: 'textbox',\n };\n if (!this.editable) {\n attrs['aria-readonly'] = true;\n }\n return attrs;\n },\n },\n\n /**\n * Because the Editor instance is initialized when mounted it does not get\n * updated props automatically, so the ones that can change after mount have\n * to be hooked up to the Editor's own API.\n */\n watch: {\n editable (isEditable) {\n this.editor.setEditable(isEditable);\n this.updateEditorAttributes({ 'aria-readonly': !isEditable });\n },\n\n inputClass (newClass) {\n this.updateEditorAttributes({ class: newClass });\n },\n\n inputAriaLabel (newLabel) {\n this.updateEditorAttributes({ 'aria-label': newLabel });\n },\n\n extensions () {\n // Extensions can't be registered on the fly, so just recreate the editor.\n // https://github.com/ueberdosis/tiptap/issues/1044\n this.destroyEditor();\n this.createEditor();\n },\n\n modelValue (newValue) {\n this.processValue(newValue);\n },\n },\n\n created () {\n this.createEditor();\n },\n\n beforeUnmount () {\n this.destroyEditor();\n },\n\n mounted () {\n warnIfUnmounted(this.$el, this.$options.name);\n this.processValue(this.modelValue, false);\n },\n\n methods: {\n\n createEditor () {\n // For all available options, see https://tiptap.dev/api/editor#settings\n this.editor = new Editor({\n autofocus: this.autoFocus,\n content: this.modelValue,\n editable: this.editable,\n extensions: this.extensions,\n editorProps: {\n attributes: {\n ...this.inputAttrs,\n class: this.inputClass,\n },\n\n // Moves the <br /> tags inside the previous closing tag to avoid\n // Prosemirror wrapping them within another </p> tag.\n transformPastedHTML (html) {\n return html.replace(/(<\\/\\w+>)((<br \\/>)+)/g, '$2$3$1');\n },\n },\n });\n this.addEditorListeners();\n },\n\n processValue (newValue, returnIfEqual = true) {\n let currentValue = this.getOutput();\n if (this.outputFormat === 'json') {\n newValue = JSON.stringify(newValue);\n currentValue = JSON.stringify(currentValue);\n }\n\n if (returnIfEqual && newValue === currentValue) {\n // The new value came from this component and was passed back down\n // through the parent, so don't do anything here.\n return;\n }\n\n const inputUnicodeRegex = new RegExp(`(${emojiPattern})`, 'g');\n\n // If the text contains emoji characters convert them to emoji component tags\n newValue = newValue.replace(inputUnicodeRegex, '<emoji-component code=\"$1\"></emoji-component>');\n\n // Otherwise replace the content (resets the cursor position).\n this.editor.commands.setContent(newValue, false);\n },\n\n destroyEditor () {\n this.editor.destroy();\n },\n\n /**\n * The Editor exposes event hooks that we have to map our emits into. See\n * https://tiptap.dev/api/events for all events.\n */\n addEditorListeners () {\n // The content has changed.\n this.editor.on('update', () => {\n const value = this.getOutput();\n // When preventTyping is true and user wants to type, we revert to last value\n // If Backspace (keyCode = 8) is pressed, we allow updating the text\n if (this.preventTyping && this.editor.view?.input?.lastKeyCode !== 8) {\n this.editor.commands.setContent(this.value, false);\n return;\n }\n this.$emit('input', value);\n this.$emit('update:modelValue', value);\n });\n\n // The editor is focused.\n this.editor.on('focus', ({ event }) => {\n this.$emit('focus', event);\n });\n\n // The editor isn’t focused anymore.\n this.editor.on('blur', ({ event }) => {\n this.$emit('blur', event);\n });\n },\n\n getOutput () {\n switch (this.outputFormat) {\n case 'json':\n return this.editor.getJSON();\n case 'html':\n return this.editor.getHTML();\n case 'text':\n default:\n return this.editor.getText({ blockSeparator: '\\n' });\n }\n },\n\n getExtension (extension, options) {\n if (typeof options === 'boolean') {\n return extension;\n }\n return extension.configure?.(options);\n },\n\n updateEditorAttributes (attributes) {\n this.editor.setOptions({\n editorProps: {\n attributes: {\n ...this.inputAttrs,\n class: this.inputClass,\n ...attributes,\n },\n },\n });\n },\n\n focusEditor () {\n this.editor.commands.focus();\n },\n },\n};\n</script>\n"],"names":["_openBlock","_createBlock","_mergeProps"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"core_scroller.vue.cjs","sources":["../../../../components/scroller/modules/core_scroller.vue"],"sourcesContent":["<!-- eslint-disable max-len -->\n<template>\n <div\n ref=\"scroller\"\n class=\"vue-recycle-scroller\"\n :class=\"{\n ready,\n [`direction-${direction}`]: true,\n }\"\n @scroll.passive=\"handleScroll\"\n >\n <component\n :is=\"listTag\"\n ref=\"wrapper\"\n :style=\"{ [direction === 'vertical' ? 'minHeight' : 'minWidth']: `${totalSize}px` }\"\n class=\"vue-recycle-scroller__item-wrapper\"\n :class=\"listClass\"\n >\n <component\n :is=\"itemTag\"\n v-for=\"view in pool\"\n :key=\"view.nr.id\"\n :style=\"ready ? {\n transform: `translate${direction === 'vertical' ? 'Y' : 'X'}(${view.position}px) translate${direction === 'vertical' ? 'X' : 'Y'}(${view.offset}px)`,\n width: undefined,\n height: undefined,\n } : null\"\n class=\"vue-recycle-scroller__item-view\"\n :class=\"[\n itemClass,\n {\n hover: !skipHover && hoverKey === view.nr.key,\n },\n ]\"\n v-on=\"skipHover ? {} : {\n mouseenter: () => { hoverKey = view.nr.key },\n mouseleave: () => { hoverKey = null },\n }\"\n >\n <slot\n :item=\"view.item\"\n :index=\"view.nr.index\"\n :active=\"view.nr.used\"\n />\n </component>\n </component>\n </div>\n</template>\n\n<script setup>\n/*\nThis is a code from external library (https://github.com/Akryum/vue-virtual-scroller/blob/master/packages/vue-virtual-scroller/src/components/RecycleScroller.vue)\nWe have modified it for our own specific use.\n*/\nimport { computed, watch, markRaw, shallowReactive, onMounted, nextTick, reactive, ref } from 'vue';\n\nconst props = defineProps({\n /**\n * List of items you want to display in the scroller.\n */\n items: {\n type: Array,\n required: true,\n },\n\n /**\n *\n * Field used to identify items and optimize managing rendered views\n */\n keyField: {\n type: String,\n default: 'id',\n },\n\n /**\n * Direction of the scroller. Can be either `vertical` or `horizontal`.\n */\n direction: {\n type: String,\n default: 'vertical',\n validator: (value) => ['vertical', 'horizontal'].includes(value),\n },\n\n /**\n * Size of the items in the list.\n * If it is set to null (the default value), it will use variable size mode.\n */\n itemSize: {\n type: Number,\n default: null,\n },\n\n /**\n * Minimum size used if the height (or width in horizontal mode) of an item is unknown.\n */\n minItemSize: {\n type: [Number, String],\n default: null,\n },\n\n /**\n * Field used to get the item's size in variable size mode.\n */\n sizeField: {\n type: String,\n default: 'size',\n },\n\n /**\n * Amount of pixel to add to edges of the scrolling visible area to start rendering items further away.\n */\n buffer: {\n type: Number,\n default: 200,\n },\n\n /**\n * If true, the hover state will be skipped.\n * This can be useful if you want to use the hover state for other purposes.\n */\n skipHover: {\n type: Boolean,\n default: false,\n },\n\n /**\n * The element to render as the list's wrapper.\n */\n listTag: {\n type: String,\n default: 'div',\n },\n\n /**\n * The element to render as the list item.\n */\n itemTag: {\n type: String,\n default: 'div',\n },\n\n /**\n * The custom classes added to the item list wrapper.\n */\n listClass: {\n type: [String, Object, Array],\n default: '',\n },\n\n /**\n * The custom classes added to each item.\n */\n itemClass: {\n type: [String, Object, Array],\n default: '',\n },\n});\n\nconst emit = defineEmits(['user-position']);\n\nconst views = reactive(new Map());\n// const reactiveItems = reactive(props.items);\nconst unusedViews = reactive(new Map());\nconst updateTimeout = null;\nconst pool = ref([]);\nconst hoverKey = ref(null);\nconst ready = ref(false);\nconst scroller = ref(null);\nconst userPosition = ref('top');\n\nlet startIndex = 0;\nlet endIndex = 0;\nlet scrollDirty = false;\nlet lastUpdateScrollPosition = 0;\nlet sortTimer = null;\nlet computedMinItemSize = null;\nlet totalSize = 0;\nlet uid = 0;\n\nconst sizes = computed(() => {\n if (props.itemSize === null) {\n const sizes = {\n '-1': { accumulator: 0 },\n };\n const items = props.items;\n const field = props.sizeField;\n const minItemSize = props.minItemSize;\n let computedMinSize = 10000;\n let accumulator = 0;\n let current;\n for (let i = 0, l = items.length; i < l; i++) {\n current = items[i][field] || minItemSize;\n if (current < computedMinSize) {\n computedMinSize = current;\n }\n accumulator += current;\n sizes[i] = { accumulator, size: current };\n }\n\n computedMinItemSize = computedMinSize;\n return sizes;\n }\n return [];\n});\n\nconst simpleArray = computed(() => {\n return props.items.length && typeof props.items[0] !== 'object';\n});\n\nconst itemIndexByKey = computed(() => {\n const result = {};\n for (let i = 0, l = props.items.length; i < l; i++) {\n result[props.items[i][props.keyField]] = i;\n }\n return result;\n});\n\n// watch(reactiveItems, () => {\n// // if add to the top\n// // _updateVisibleItems(true);\n// // if autoscrolling if add to the bottom\n// // _updateVisibleItems(false, true);\n// });\n\nwatch(sizes, () => {\n _updateVisibleItems(false);\n}, { deep: true });\n\nonMounted(() => {\n nextTick(() => {\n // In SSR mode, render the real number of visible items\n _updateVisibleItems(true);\n ready.value = true;\n });\n});\n\nconst _addView = (pool, index, item, key, type) => {\n const nr = markRaw({\n id: uid++,\n index,\n used: true,\n key,\n type,\n });\n const view = shallowReactive({\n item,\n position: 0,\n nr,\n });\n pool.value.push(view);\n return view;\n};\n\nconst _unuseView = (view, fake = false) => {\n const _unusedViews = unusedViews;\n const type = view.nr.type;\n let unusedPool = _unusedViews.get(type);\n if (!unusedPool) {\n unusedPool = [];\n _unusedViews.set(type, unusedPool);\n }\n unusedPool.push(view);\n if (!fake) {\n view.nr.used = false;\n view.position = -9999;\n }\n};\n\nconst _getScroll = () => {\n const isVertical = props.direction === 'vertical';\n let scrollState;\n\n if (isVertical) {\n scrollState = {\n start: scroller.value.scrollTop,\n end: scroller.value.scrollTop + scroller.value.clientHeight,\n };\n } else {\n scrollState = {\n start: scroller.value.scrollLeft,\n end: scroller.value.scrollLeft + scroller.value.clientWidth,\n };\n }\n\n return scrollState;\n};\n\nconst _itemsLimitError = () => {\n setTimeout(() => {\n // eslint-disable-next-line max-len\n console.error('It seems the scroller element isn\\'t scrolling, so it tries to render all the items at once.', 'Scroller:', scroller);\n // eslint-disable-next-line max-len\n console.error('Make sure the scroller has a fixed height (or width) and \\'overflow-y\\' (or \\'overflow-x\\') set to \\'auto\\' so it can scroll correctly and only render the items visible in the scroll viewport.');\n });\n throw new Error('Rendered items limit reached');\n};\n\nconst _sortViews = () => {\n pool.value.sort((viewA, viewB) => viewA.nr.index - viewB.nr.index);\n};\n\nconst _updateVisibleItems = (checkItem, checkPositionDiff = false) => {\n const itemSize = props.itemSize;\n const minItemSize = computedMinItemSize;\n const keyField = simpleArray.value ? null : props.keyField;\n const items = props.items;\n const count = items.length;\n const _sizes = sizes.value;\n const _views = views;\n const _unusedViews = unusedViews;\n const _pool = pool;\n const _itemIndexByKey = itemIndexByKey;\n let _startIndex, _endIndex;\n let _totalSize;\n let visibleStartIndex, visibleEndIndex;\n\n if (!count) {\n _startIndex = _endIndex = visibleStartIndex = visibleEndIndex = _totalSize = 0;\n } else {\n const scroll = _getScroll();\n\n // Skip update if use hasn't scrolled enough\n if (checkPositionDiff) {\n let positionDiff = scroll.start - lastUpdateScrollPosition.value;\n if (positionDiff < 0) positionDiff = -positionDiff;\n if ((itemSize === null && positionDiff < minItemSize.value) || positionDiff < itemSize) {\n return {\n continuous: true,\n };\n }\n }\n lastUpdateScrollPosition = scroll.start;\n\n const _buffer = props.buffer;\n scroll.start -= _buffer;\n scroll.end += _buffer;\n\n // Variable size mode\n if (itemSize === null) {\n let h;\n let a = 0;\n let b = count - 1;\n let i = ~~(count / 2);\n let oldI;\n\n // Searching for _startIndex\n do {\n oldI = i;\n h = _sizes[i]?.accumulator;\n if (h < scroll.start) {\n a = i;\n } else if (i < count - 1 && _sizes[i + 1]?.accumulator > scroll.start) {\n b = i;\n }\n i = ~~((a + b) / 2);\n } while (i !== oldI);\n i < 0 && (i = 0);\n _startIndex = i;\n\n // For container style\n _totalSize = _sizes[count - 1]?.accumulator;\n\n // Searching for _endIndex\n for (\n _endIndex = i;\n _endIndex < count && _sizes[_endIndex]?.accumulator < scroll.end;\n _endIndex++\n );\n\n if (_endIndex === -1) {\n _endIndex = items.length - 1;\n } else {\n _endIndex++;\n // Bounds\n _endIndex > count && (_endIndex = count);\n }\n\n // search visible _startIndex\n for (\n visibleStartIndex = startIndex;\n visibleStartIndex < count && (_sizes[visibleStartIndex]?.accumulator) < scroll.start;\n visibleStartIndex++\n );\n\n // search visible endIndex\n for (\n visibleEndIndex = visibleStartIndex;\n visibleEndIndex < count && (_sizes[visibleEndIndex]?.accumulator) < scroll.end;\n visibleEndIndex++\n );\n } else {\n // Fixed size mode\n _startIndex = ~~(scroll.start / itemSize);\n const remainer = _startIndex % 1;\n _startIndex -= remainer;\n _endIndex = Math.ceil(scroll.end / itemSize);\n visibleStartIndex = Math.max(0, Math.floor((scroll.start) / itemSize));\n visibleEndIndex = Math.floor((scroll.end) / itemSize);\n\n // Bounds\n _startIndex < 0 && (_startIndex = 0);\n _endIndex > count && (_endIndex = count);\n visibleStartIndex < 0 && (visibleStartIndex = 0);\n visibleEndIndex > count && (visibleEndIndex = count);\n\n _totalSize = Math.ceil(count / 1) * itemSize;\n }\n }\n\n // items limit 1000\n if (_endIndex - _startIndex > 1000) {\n _itemsLimitError();\n }\n\n totalSize = _totalSize;\n\n let view;\n\n const continuous = _startIndex <= endIndex && _endIndex >= _startIndex;\n\n // Unuse views that are no longer visible\n if (continuous) {\n for (let i = 0, l = _pool.value.length; i < l; i++) {\n view = _pool.value[i];\n if (view?.nr.used) {\n // Update view item index\n if (checkItem) {\n view.nr.index = _itemIndexByKey[view.item[keyField]];\n }\n\n // Check if index is still in visible range\n if (\n view.nr.index == null ||\n view.nr.index < _startIndex ||\n view.nr.index >= _endIndex\n ) {\n _unuseView(view);\n }\n }\n }\n }\n\n const unusedIndex = continuous ? null : new Map();\n\n let item, type;\n let v;\n for (let i = _startIndex; i < _endIndex; i++) {\n item = items[i];\n const key = keyField ? item?.[keyField] : item;\n\n if (key == null) {\n throw new Error(`Key is ${key} on item (keyField is '${keyField}')`);\n }\n view = _views.get(key);\n\n if (!itemSize && !_sizes[i]?.size) {\n if (view) _unuseView(view);\n continue;\n }\n\n type = item.type;\n\n let unusedPool = _unusedViews.get(type);\n // let newlyUsedView = false;\n\n // No view assigned to item\n if (!view) {\n if (continuous) {\n // Reuse existing view\n if (unusedPool && unusedPool.length) {\n view = unusedPool.pop();\n } else {\n view = _addView(_pool, i, item, key, type);\n }\n } else {\n // Use existing view\n // We don't care if they are already used\n // because we are not in continous scrolling\n v = unusedIndex.get(type) || 0;\n\n if (!unusedPool || v >= unusedPool.length) {\n view = _addView(_pool, i, item, key, type);\n _unuseView(view, true);\n unusedPool = _unusedViews.get(type);\n }\n\n view = unusedPool[v];\n unusedIndex.set(type, v + 1);\n }\n\n // Assign view to item\n _views.delete(view.nr.key);\n view.nr.used = true;\n view.nr.index = i;\n view.nr.key = key;\n view.nr.type = type;\n _views.set(key, view);\n\n // newlyUsedView = true;\n } else {\n // View already assigned to item\n if (!view.nr.used) {\n view.nr.used = true;\n // newlyUsedView = true;\n if (unusedPool) {\n const index = unusedPool.indexOf(view);\n if (index !== -1) unusedPool.splice(index, 1);\n }\n }\n }\n\n // Always set item in case it's a new object with the same key\n view.item = item;\n\n // if (newlyUsedView) {\n // if (items.length === 0) return;\n // if (i === items.length - 1) emit('scroll-end');\n // if (i === 0) emit('scroll-start');\n // }\n\n // Update position\n if (itemSize === null) {\n view.position = _sizes[i - 1]?.accumulator;\n view.offset = 0;\n } else {\n view.position = Math.floor(i) * itemSize;\n view.offset = (i % 1) * itemSize;\n }\n }\n\n startIndex = _startIndex;\n endIndex = _endIndex;\n\n // After the user has finished scrolling\n // Sort views so text selection is correct\n clearTimeout(sortTimer);\n sortTimer = setTimeout(_sortViews, 300);\n\n return {\n continuous,\n };\n};\n\nconst _scrollToPosition = (position) => {\n const direction = props.direction === 'vertical'\n ? { scroll: 'scrollTop', start: 'top' }\n : { scroll: 'scrollLeft', start: 'left' };\n\n const viewport = scroller.value;\n const scrollDirection = direction.scroll;\n\n viewport[scrollDirection] = position;\n};\n\nconst scrollToItem = (index) => {\n let scroll;\n if (props.itemSize === null) {\n scroll = index > 0 ? sizes.value[index - 1]?.accumulator : 0;\n } else {\n scroll = Math.floor(index) * props.itemSize;\n }\n _scrollToPosition(scroll);\n};\n\nconst handleScroll = () => {\n const container = scroller.value;\n\n if (userPosition.value !== 'middle') {\n userPosition.value = 'middle';\n emit('user-position', 'middle');\n }\n\n // Check if the scroll is at the top of the container\n if (container.scrollTop === 0) {\n userPosition.value = 'top';\n emit('user-position', 'top');\n }\n\n // Check if the scroll is at the bottom of the container\n if (container.scrollTop + container.clientHeight === container.scrollHeight) {\n userPosition.value = 'bottom';\n emit('user-position', 'bottom');\n }\n\n if (!scrollDirty) {\n scrollDirty = true;\n if (updateTimeout) return;\n\n const requestUpdate = () => requestAnimationFrame(() => {\n scrollDirty = false;\n _updateVisibleItems(false, true);\n });\n\n requestUpdate();\n }\n};\n\ndefineExpose({\n scrollToItem,\n _updateVisibleItems,\n});\n</script>\n\n<style>\n.vue-recycle-scroller{\n position:relative\n}\n.vue-recycle-scroller.direction-vertical:not(.page-mode){\n overflow-y:auto\n}\n.vue-recycle-scroller.direction-horizontal:not(.page-mode){\n overflow-x:auto\n}\n.vue-recycle-scroller.direction-horizontal{\n display:flex\n}\n.vue-recycle-scroller__slot{\n flex:auto 0 0\n}\n.vue-recycle-scroller__item-wrapper{\n flex:1;\n box-sizing:border-box;\n overflow:hidden;\n position:relative\n}\n.vue-recycle-scroller.ready .vue-recycle-scroller__item-view{\n position:absolute;\n top:0;\n left:0;\n will-change:transform\n}\n.vue-recycle-scroller.direction-vertical .vue-recycle-scroller__item-wrapper{\n width:100%\n}\n.vue-recycle-scroller.direction-horizontal .vue-recycle-scroller__item-wrapper{\n height:100%\n}\n.vue-recycle-scroller.ready.direction-vertical .vue-recycle-scroller__item-view{\n width:100%\n}\n.vue-recycle-scroller.ready.direction-horizontal .vue-recycle-scroller__item-view{\n height:100%\n}\n </style>\n"],"names":["reactive","ref","computed","sizes","watch","onMounted","nextTick","pool","markRaw","shallowReactive"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"core_scroller.vue.cjs","sources":["../../../../components/scroller/modules/core_scroller.vue"],"sourcesContent":["<!-- eslint-disable max-len -->\n<template>\n <div\n ref=\"scroller\"\n class=\"vue-recycle-scroller\"\n :class=\"{\n ready,\n [`direction-${direction}`]: true,\n }\"\n @scroll.passive=\"handleScroll\"\n >\n <component\n :is=\"listTag\"\n ref=\"wrapper\"\n :style=\"{ [direction === 'vertical' ? 'minHeight' : 'minWidth']: `${totalSize}px` }\"\n class=\"vue-recycle-scroller__item-wrapper\"\n :class=\"listClass\"\n >\n <component\n :is=\"itemTag\"\n v-for=\"view in pool\"\n :key=\"view.nr.id\"\n :style=\"ready ? {\n transform: `translate${direction === 'vertical' ? 'Y' : 'X'}(${view.position}px) translate${direction === 'vertical' ? 'X' : 'Y'}(${view.offset}px)`,\n width: undefined,\n height: undefined,\n } : null\"\n class=\"vue-recycle-scroller__item-view\"\n :class=\"[\n itemClass,\n {\n hover: !skipHover && hoverKey === view.nr.key,\n },\n ]\"\n v-on=\"skipHover ? {} : {\n mouseenter: () => { hoverKey = view.nr.key },\n mouseleave: () => { hoverKey = null },\n }\"\n >\n <slot\n :item=\"view.item\"\n :index=\"view.nr.index\"\n :active=\"view.nr.used\"\n />\n </component>\n </component>\n </div>\n</template>\n\n<script setup>\n/*\nThis is a code from external library (https://github.com/Akryum/vue-virtual-scroller/blob/master/packages/vue-virtual-scroller/src/components/RecycleScroller.vue)\nWe have modified it for our own specific use.\n*/\nimport { computed, watch, markRaw, shallowReactive, onMounted, nextTick, reactive, ref } from 'vue';\n\nconst props = defineProps({\n /**\n * List of items you want to display in the scroller.\n */\n items: {\n type: Array,\n required: true,\n },\n\n /**\n *\n * Field used to identify items and optimize managing rendered views\n */\n keyField: {\n type: String,\n default: 'id',\n },\n\n /**\n * Direction of the scroller. Can be either `vertical` or `horizontal`.\n */\n direction: {\n type: String,\n default: 'vertical',\n validator: (value) => ['vertical', 'horizontal'].includes(value),\n },\n\n /**\n * Size of the items in the list.\n * If it is set to null (the default value), it will use variable size mode.\n */\n itemSize: {\n type: Number,\n default: null,\n },\n\n /**\n * Minimum size used if the height (or width in horizontal mode) of an item is unknown.\n */\n minItemSize: {\n type: [Number, String],\n default: null,\n },\n\n /**\n * Field used to get the item's size in variable size mode.\n */\n sizeField: {\n type: String,\n default: 'size',\n },\n\n /**\n * Amount of pixel to add to edges of the scrolling visible area to start rendering items further away.\n */\n buffer: {\n type: Number,\n default: 200,\n },\n\n /**\n * If true, the hover state will be skipped.\n * This can be useful if you want to use the hover state for other purposes.\n */\n skipHover: {\n type: Boolean,\n default: false,\n },\n\n /**\n * The element to render as the list's wrapper.\n */\n listTag: {\n type: String,\n default: 'div',\n },\n\n /**\n * The element to render as the list item.\n */\n itemTag: {\n type: String,\n default: 'div',\n },\n\n /**\n * The custom classes added to the item list wrapper.\n */\n listClass: {\n type: [String, Object, Array],\n default: '',\n },\n\n /**\n * The custom classes added to each item.\n */\n itemClass: {\n type: [String, Object, Array],\n default: '',\n },\n});\n\nconst emit = defineEmits(['user-position']);\n\nconst views = reactive(new Map());\n// const reactiveItems = reactive(props.items);\nconst unusedViews = reactive(new Map());\nconst updateTimeout = null;\nconst pool = ref([]);\nconst hoverKey = ref(null);\nconst ready = ref(false);\nconst scroller = ref(null);\nconst userPosition = ref('top');\n\nlet startIndex = 0;\nlet endIndex = 0;\nlet scrollDirty = false;\nlet lastUpdateScrollPosition = 0;\nlet sortTimer = null;\nlet computedMinItemSize = null;\nlet totalSize = 0;\nlet uid = 0;\n\nconst sizes = computed(() => {\n if (props.itemSize === null) {\n const sizes = {\n '-1': { accumulator: 0 },\n };\n const items = props.items;\n const field = props.sizeField;\n const minItemSize = props.minItemSize;\n let computedMinSize = 10000;\n let accumulator = 0;\n let current;\n for (let i = 0, l = items.length; i < l; i++) {\n current = items[i][field] || minItemSize;\n if (current < computedMinSize) {\n computedMinSize = current;\n }\n accumulator += current;\n sizes[i] = { accumulator, size: current };\n }\n\n computedMinItemSize = computedMinSize;\n return sizes;\n }\n return [];\n});\n\nconst simpleArray = computed(() => {\n return props.items.length && typeof props.items[0] !== 'object';\n});\n\nconst itemIndexByKey = computed(() => {\n const result = {};\n for (let i = 0, l = props.items.length; i < l; i++) {\n result[props.items[i][props.keyField]] = i;\n }\n return result;\n});\n\n// watch(reactiveItems, () => {\n// // if add to the top\n// // _updateVisibleItems(true);\n// // if autoscrolling if add to the bottom\n// // _updateVisibleItems(false, true);\n// });\n\nwatch(sizes, () => {\n _updateVisibleItems(false);\n}, { deep: true });\n\nonMounted(() => {\n nextTick(() => {\n // In SSR mode, render the real number of visible items\n _updateVisibleItems(true);\n ready.value = true;\n });\n});\n\nconst _addView = (pool, index, item, key, type) => {\n const nr = markRaw({\n id: uid++,\n index,\n used: true,\n key,\n type,\n });\n const view = shallowReactive({\n item,\n position: 0,\n nr,\n });\n pool.value.push(view);\n return view;\n};\n\nconst _unuseView = (view, fake = false) => {\n const _unusedViews = unusedViews;\n const type = view.nr.type;\n let unusedPool = _unusedViews.get(type);\n if (!unusedPool) {\n unusedPool = [];\n _unusedViews.set(type, unusedPool);\n }\n unusedPool.push(view);\n if (!fake) {\n view.nr.used = false;\n view.position = -9999;\n }\n};\n\nconst _getScroll = () => {\n const isVertical = props.direction === 'vertical';\n let scrollState;\n\n if (isVertical) {\n scrollState = {\n start: scroller.value.scrollTop,\n end: scroller.value.scrollTop + scroller.value.clientHeight,\n };\n } else {\n scrollState = {\n start: scroller.value.scrollLeft,\n end: scroller.value.scrollLeft + scroller.value.clientWidth,\n };\n }\n\n return scrollState;\n};\n\nconst _itemsLimitError = () => {\n setTimeout(() => {\n // eslint-disable-next-line max-len\n console.error('It seems the scroller element isn\\'t scrolling, so it tries to render all the items at once.', 'Scroller:', scroller);\n // eslint-disable-next-line max-len\n console.error('Make sure the scroller has a fixed height (or width) and \\'overflow-y\\' (or \\'overflow-x\\') set to \\'auto\\' so it can scroll correctly and only render the items visible in the scroll viewport.');\n });\n throw new Error('Rendered items limit reached');\n};\n\nconst _sortViews = () => {\n pool.value.sort((viewA, viewB) => viewA.nr.index - viewB.nr.index);\n};\n\nconst _updateVisibleItems = (checkItem, checkPositionDiff = false) => {\n const itemSize = props.itemSize;\n const minItemSize = computedMinItemSize;\n const keyField = simpleArray.value ? null : props.keyField;\n const items = props.items;\n const count = items.length;\n const _sizes = sizes.value;\n const _views = views;\n const _unusedViews = unusedViews;\n const _pool = pool;\n const _itemIndexByKey = itemIndexByKey;\n let _startIndex, _endIndex;\n let _totalSize;\n let visibleStartIndex, visibleEndIndex;\n\n if (!count) {\n _startIndex = _endIndex = visibleStartIndex = visibleEndIndex = _totalSize = 0;\n } else {\n const scroll = _getScroll();\n\n // Skip update if use hasn't scrolled enough\n if (checkPositionDiff) {\n let positionDiff = scroll.start - lastUpdateScrollPosition.value;\n if (positionDiff < 0) positionDiff = -positionDiff;\n if ((itemSize === null && positionDiff < minItemSize.value) || positionDiff < itemSize) {\n return {\n continuous: true,\n };\n }\n }\n lastUpdateScrollPosition = scroll.start;\n\n const _buffer = props.buffer;\n scroll.start -= _buffer;\n scroll.end += _buffer;\n\n // Variable size mode\n if (itemSize === null) {\n let h;\n let a = 0;\n let b = count - 1;\n let i = ~~(count / 2);\n let oldI;\n\n // Searching for _startIndex\n do {\n oldI = i;\n h = _sizes[i]?.accumulator;\n if (h < scroll.start) {\n a = i;\n } else if (i < count - 1 && _sizes[i + 1]?.accumulator > scroll.start) {\n b = i;\n }\n i = ~~((a + b) / 2);\n } while (i !== oldI);\n i < 0 && (i = 0);\n _startIndex = i;\n\n // For container style\n _totalSize = _sizes[count - 1]?.accumulator;\n\n // Searching for _endIndex\n for (\n _endIndex = i;\n _endIndex < count && _sizes[_endIndex]?.accumulator < scroll.end;\n _endIndex++\n );\n\n if (_endIndex === -1) {\n _endIndex = items.length - 1;\n } else {\n _endIndex++;\n // Bounds\n _endIndex > count && (_endIndex = count);\n }\n\n // search visible _startIndex\n for (\n visibleStartIndex = startIndex;\n visibleStartIndex < count && (_sizes[visibleStartIndex]?.accumulator) < scroll.start;\n visibleStartIndex++\n );\n\n // search visible endIndex\n for (\n visibleEndIndex = visibleStartIndex;\n visibleEndIndex < count && (_sizes[visibleEndIndex]?.accumulator) < scroll.end;\n visibleEndIndex++\n );\n } else {\n // Fixed size mode\n _startIndex = ~~(scroll.start / itemSize);\n const remainer = _startIndex % 1;\n _startIndex -= remainer;\n _endIndex = Math.ceil(scroll.end / itemSize);\n visibleStartIndex = Math.max(0, Math.floor((scroll.start) / itemSize));\n visibleEndIndex = Math.floor((scroll.end) / itemSize);\n\n // Bounds\n _startIndex < 0 && (_startIndex = 0);\n _endIndex > count && (_endIndex = count);\n visibleStartIndex < 0 && (visibleStartIndex = 0);\n visibleEndIndex > count && (visibleEndIndex = count);\n\n _totalSize = Math.ceil(count / 1) * itemSize;\n }\n }\n\n // items limit 1000\n if (_endIndex - _startIndex > 1000) {\n _itemsLimitError();\n }\n\n totalSize = _totalSize;\n\n let view;\n\n const continuous = _startIndex <= endIndex && _endIndex >= _startIndex;\n\n // Unuse views that are no longer visible\n if (continuous) {\n for (let i = 0, l = _pool.value.length; i < l; i++) {\n view = _pool.value[i];\n if (view?.nr.used) {\n // Update view item index\n if (checkItem) {\n view.nr.index = _itemIndexByKey[view.item[keyField]];\n }\n\n // Check if index is still in visible range\n if (\n view.nr.index == null ||\n view.nr.index < _startIndex ||\n view.nr.index >= _endIndex\n ) {\n _unuseView(view);\n }\n }\n }\n }\n\n const unusedIndex = continuous ? null : new Map();\n\n let item, type;\n let v;\n for (let i = _startIndex; i < _endIndex; i++) {\n item = items[i];\n const key = keyField ? item?.[keyField] : item;\n\n if (key == null) {\n throw new Error(`Key is ${key} on item (keyField is '${keyField}')`);\n }\n view = _views.get(key);\n\n if (!itemSize && !_sizes[i]?.size) {\n if (view) _unuseView(view);\n continue;\n }\n\n type = item.type;\n\n let unusedPool = _unusedViews.get(type);\n // let newlyUsedView = false;\n\n // No view assigned to item\n if (!view) {\n if (continuous) {\n // Reuse existing view\n if (unusedPool && unusedPool.length) {\n view = unusedPool.pop();\n } else {\n view = _addView(_pool, i, item, key, type);\n }\n } else {\n // Use existing view\n // We don't care if they are already used\n // because we are not in continous scrolling\n v = unusedIndex.get(type) || 0;\n\n if (!unusedPool || v >= unusedPool.length) {\n view = _addView(_pool, i, item, key, type);\n _unuseView(view, true);\n unusedPool = _unusedViews.get(type);\n }\n\n view = unusedPool[v];\n unusedIndex.set(type, v + 1);\n }\n\n // Assign view to item\n _views.delete(view.nr.key);\n view.nr.used = true;\n view.nr.index = i;\n view.nr.key = key;\n view.nr.type = type;\n _views.set(key, view);\n\n // newlyUsedView = true;\n } else {\n // View already assigned to item\n if (!view.nr.used) {\n view.nr.used = true;\n // newlyUsedView = true;\n if (unusedPool) {\n const index = unusedPool.indexOf(view);\n if (index !== -1) unusedPool.splice(index, 1);\n }\n }\n }\n\n // Always set item in case it's a new object with the same key\n view.item = item;\n\n // if (newlyUsedView) {\n // if (items.length === 0) return;\n // if (i === items.length - 1) emit('scroll-end');\n // if (i === 0) emit('scroll-start');\n // }\n\n // Update position\n if (itemSize === null) {\n view.position = _sizes[i - 1]?.accumulator;\n view.offset = 0;\n } else {\n view.position = Math.floor(i) * itemSize;\n view.offset = (i % 1) * itemSize;\n }\n }\n\n startIndex = _startIndex;\n endIndex = _endIndex;\n\n // After the user has finished scrolling\n // Sort views so text selection is correct\n clearTimeout(sortTimer);\n sortTimer = setTimeout(_sortViews, 300);\n\n return {\n continuous,\n };\n};\n\nconst _scrollToPosition = (position) => {\n const direction = props.direction === 'vertical'\n ? { scroll: 'scrollTop', start: 'top' }\n : { scroll: 'scrollLeft', start: 'left' };\n\n const viewport = scroller.value;\n const scrollDirection = direction.scroll;\n\n viewport[scrollDirection] = position;\n};\n\nconst scrollToItem = (index) => {\n let scroll;\n if (props.itemSize === null) {\n scroll = index > 0 ? sizes.value[index - 1]?.accumulator : 0;\n } else {\n scroll = Math.floor(index) * props.itemSize;\n }\n _scrollToPosition(scroll);\n};\n\nconst handleScroll = () => {\n const container = scroller.value;\n\n if (userPosition.value !== 'middle') {\n userPosition.value = 'middle';\n emit('user-position', 'middle');\n }\n\n // Check if the scroll is at the top of the container\n if (container.scrollTop === 0) {\n userPosition.value = 'top';\n emit('user-position', 'top');\n }\n\n // Check if the scroll is at the bottom of the container\n if (container.scrollTop + container.clientHeight === container.scrollHeight) {\n userPosition.value = 'bottom';\n emit('user-position', 'bottom');\n }\n\n if (!scrollDirty) {\n scrollDirty = true;\n if (updateTimeout) return;\n\n const requestUpdate = () => requestAnimationFrame(() => {\n scrollDirty = false;\n _updateVisibleItems(false, true);\n });\n\n requestUpdate();\n }\n};\n\ndefineExpose({\n scrollToItem,\n _updateVisibleItems,\n});\n</script>\n"],"names":["reactive","ref","computed","sizes","watch","onMounted","nextTick","pool","markRaw","shallowReactive"],"mappings":"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"}
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
import { reactive, ref, computed, watch, onMounted, nextTick, openBlock, createElementBlock, normalizeClass, createBlock, resolveDynamicComponent, normalizeStyle, unref, withCtx, Fragment, renderList, mergeProps, toHandlers, renderSlot, markRaw, shallowReactive } from "vue";
|
|
2
|
-
/* empty css */
|
|
3
2
|
const _sfc_main = {
|
|
4
3
|
__name: "core_scroller",
|
|
5
4
|
props: {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"core_scroller.vue.js","sources":["../../../../components/scroller/modules/core_scroller.vue"],"sourcesContent":["<!-- eslint-disable max-len -->\n<template>\n <div\n ref=\"scroller\"\n class=\"vue-recycle-scroller\"\n :class=\"{\n ready,\n [`direction-${direction}`]: true,\n }\"\n @scroll.passive=\"handleScroll\"\n >\n <component\n :is=\"listTag\"\n ref=\"wrapper\"\n :style=\"{ [direction === 'vertical' ? 'minHeight' : 'minWidth']: `${totalSize}px` }\"\n class=\"vue-recycle-scroller__item-wrapper\"\n :class=\"listClass\"\n >\n <component\n :is=\"itemTag\"\n v-for=\"view in pool\"\n :key=\"view.nr.id\"\n :style=\"ready ? {\n transform: `translate${direction === 'vertical' ? 'Y' : 'X'}(${view.position}px) translate${direction === 'vertical' ? 'X' : 'Y'}(${view.offset}px)`,\n width: undefined,\n height: undefined,\n } : null\"\n class=\"vue-recycle-scroller__item-view\"\n :class=\"[\n itemClass,\n {\n hover: !skipHover && hoverKey === view.nr.key,\n },\n ]\"\n v-on=\"skipHover ? {} : {\n mouseenter: () => { hoverKey = view.nr.key },\n mouseleave: () => { hoverKey = null },\n }\"\n >\n <slot\n :item=\"view.item\"\n :index=\"view.nr.index\"\n :active=\"view.nr.used\"\n />\n </component>\n </component>\n </div>\n</template>\n\n<script setup>\n/*\nThis is a code from external library (https://github.com/Akryum/vue-virtual-scroller/blob/master/packages/vue-virtual-scroller/src/components/RecycleScroller.vue)\nWe have modified it for our own specific use.\n*/\nimport { computed, watch, markRaw, shallowReactive, onMounted, nextTick, reactive, ref } from 'vue';\n\nconst props = defineProps({\n /**\n * List of items you want to display in the scroller.\n */\n items: {\n type: Array,\n required: true,\n },\n\n /**\n *\n * Field used to identify items and optimize managing rendered views\n */\n keyField: {\n type: String,\n default: 'id',\n },\n\n /**\n * Direction of the scroller. Can be either `vertical` or `horizontal`.\n */\n direction: {\n type: String,\n default: 'vertical',\n validator: (value) => ['vertical', 'horizontal'].includes(value),\n },\n\n /**\n * Size of the items in the list.\n * If it is set to null (the default value), it will use variable size mode.\n */\n itemSize: {\n type: Number,\n default: null,\n },\n\n /**\n * Minimum size used if the height (or width in horizontal mode) of an item is unknown.\n */\n minItemSize: {\n type: [Number, String],\n default: null,\n },\n\n /**\n * Field used to get the item's size in variable size mode.\n */\n sizeField: {\n type: String,\n default: 'size',\n },\n\n /**\n * Amount of pixel to add to edges of the scrolling visible area to start rendering items further away.\n */\n buffer: {\n type: Number,\n default: 200,\n },\n\n /**\n * If true, the hover state will be skipped.\n * This can be useful if you want to use the hover state for other purposes.\n */\n skipHover: {\n type: Boolean,\n default: false,\n },\n\n /**\n * The element to render as the list's wrapper.\n */\n listTag: {\n type: String,\n default: 'div',\n },\n\n /**\n * The element to render as the list item.\n */\n itemTag: {\n type: String,\n default: 'div',\n },\n\n /**\n * The custom classes added to the item list wrapper.\n */\n listClass: {\n type: [String, Object, Array],\n default: '',\n },\n\n /**\n * The custom classes added to each item.\n */\n itemClass: {\n type: [String, Object, Array],\n default: '',\n },\n});\n\nconst emit = defineEmits(['user-position']);\n\nconst views = reactive(new Map());\n// const reactiveItems = reactive(props.items);\nconst unusedViews = reactive(new Map());\nconst updateTimeout = null;\nconst pool = ref([]);\nconst hoverKey = ref(null);\nconst ready = ref(false);\nconst scroller = ref(null);\nconst userPosition = ref('top');\n\nlet startIndex = 0;\nlet endIndex = 0;\nlet scrollDirty = false;\nlet lastUpdateScrollPosition = 0;\nlet sortTimer = null;\nlet computedMinItemSize = null;\nlet totalSize = 0;\nlet uid = 0;\n\nconst sizes = computed(() => {\n if (props.itemSize === null) {\n const sizes = {\n '-1': { accumulator: 0 },\n };\n const items = props.items;\n const field = props.sizeField;\n const minItemSize = props.minItemSize;\n let computedMinSize = 10000;\n let accumulator = 0;\n let current;\n for (let i = 0, l = items.length; i < l; i++) {\n current = items[i][field] || minItemSize;\n if (current < computedMinSize) {\n computedMinSize = current;\n }\n accumulator += current;\n sizes[i] = { accumulator, size: current };\n }\n\n computedMinItemSize = computedMinSize;\n return sizes;\n }\n return [];\n});\n\nconst simpleArray = computed(() => {\n return props.items.length && typeof props.items[0] !== 'object';\n});\n\nconst itemIndexByKey = computed(() => {\n const result = {};\n for (let i = 0, l = props.items.length; i < l; i++) {\n result[props.items[i][props.keyField]] = i;\n }\n return result;\n});\n\n// watch(reactiveItems, () => {\n// // if add to the top\n// // _updateVisibleItems(true);\n// // if autoscrolling if add to the bottom\n// // _updateVisibleItems(false, true);\n// });\n\nwatch(sizes, () => {\n _updateVisibleItems(false);\n}, { deep: true });\n\nonMounted(() => {\n nextTick(() => {\n // In SSR mode, render the real number of visible items\n _updateVisibleItems(true);\n ready.value = true;\n });\n});\n\nconst _addView = (pool, index, item, key, type) => {\n const nr = markRaw({\n id: uid++,\n index,\n used: true,\n key,\n type,\n });\n const view = shallowReactive({\n item,\n position: 0,\n nr,\n });\n pool.value.push(view);\n return view;\n};\n\nconst _unuseView = (view, fake = false) => {\n const _unusedViews = unusedViews;\n const type = view.nr.type;\n let unusedPool = _unusedViews.get(type);\n if (!unusedPool) {\n unusedPool = [];\n _unusedViews.set(type, unusedPool);\n }\n unusedPool.push(view);\n if (!fake) {\n view.nr.used = false;\n view.position = -9999;\n }\n};\n\nconst _getScroll = () => {\n const isVertical = props.direction === 'vertical';\n let scrollState;\n\n if (isVertical) {\n scrollState = {\n start: scroller.value.scrollTop,\n end: scroller.value.scrollTop + scroller.value.clientHeight,\n };\n } else {\n scrollState = {\n start: scroller.value.scrollLeft,\n end: scroller.value.scrollLeft + scroller.value.clientWidth,\n };\n }\n\n return scrollState;\n};\n\nconst _itemsLimitError = () => {\n setTimeout(() => {\n // eslint-disable-next-line max-len\n console.error('It seems the scroller element isn\\'t scrolling, so it tries to render all the items at once.', 'Scroller:', scroller);\n // eslint-disable-next-line max-len\n console.error('Make sure the scroller has a fixed height (or width) and \\'overflow-y\\' (or \\'overflow-x\\') set to \\'auto\\' so it can scroll correctly and only render the items visible in the scroll viewport.');\n });\n throw new Error('Rendered items limit reached');\n};\n\nconst _sortViews = () => {\n pool.value.sort((viewA, viewB) => viewA.nr.index - viewB.nr.index);\n};\n\nconst _updateVisibleItems = (checkItem, checkPositionDiff = false) => {\n const itemSize = props.itemSize;\n const minItemSize = computedMinItemSize;\n const keyField = simpleArray.value ? null : props.keyField;\n const items = props.items;\n const count = items.length;\n const _sizes = sizes.value;\n const _views = views;\n const _unusedViews = unusedViews;\n const _pool = pool;\n const _itemIndexByKey = itemIndexByKey;\n let _startIndex, _endIndex;\n let _totalSize;\n let visibleStartIndex, visibleEndIndex;\n\n if (!count) {\n _startIndex = _endIndex = visibleStartIndex = visibleEndIndex = _totalSize = 0;\n } else {\n const scroll = _getScroll();\n\n // Skip update if use hasn't scrolled enough\n if (checkPositionDiff) {\n let positionDiff = scroll.start - lastUpdateScrollPosition.value;\n if (positionDiff < 0) positionDiff = -positionDiff;\n if ((itemSize === null && positionDiff < minItemSize.value) || positionDiff < itemSize) {\n return {\n continuous: true,\n };\n }\n }\n lastUpdateScrollPosition = scroll.start;\n\n const _buffer = props.buffer;\n scroll.start -= _buffer;\n scroll.end += _buffer;\n\n // Variable size mode\n if (itemSize === null) {\n let h;\n let a = 0;\n let b = count - 1;\n let i = ~~(count / 2);\n let oldI;\n\n // Searching for _startIndex\n do {\n oldI = i;\n h = _sizes[i]?.accumulator;\n if (h < scroll.start) {\n a = i;\n } else if (i < count - 1 && _sizes[i + 1]?.accumulator > scroll.start) {\n b = i;\n }\n i = ~~((a + b) / 2);\n } while (i !== oldI);\n i < 0 && (i = 0);\n _startIndex = i;\n\n // For container style\n _totalSize = _sizes[count - 1]?.accumulator;\n\n // Searching for _endIndex\n for (\n _endIndex = i;\n _endIndex < count && _sizes[_endIndex]?.accumulator < scroll.end;\n _endIndex++\n );\n\n if (_endIndex === -1) {\n _endIndex = items.length - 1;\n } else {\n _endIndex++;\n // Bounds\n _endIndex > count && (_endIndex = count);\n }\n\n // search visible _startIndex\n for (\n visibleStartIndex = startIndex;\n visibleStartIndex < count && (_sizes[visibleStartIndex]?.accumulator) < scroll.start;\n visibleStartIndex++\n );\n\n // search visible endIndex\n for (\n visibleEndIndex = visibleStartIndex;\n visibleEndIndex < count && (_sizes[visibleEndIndex]?.accumulator) < scroll.end;\n visibleEndIndex++\n );\n } else {\n // Fixed size mode\n _startIndex = ~~(scroll.start / itemSize);\n const remainer = _startIndex % 1;\n _startIndex -= remainer;\n _endIndex = Math.ceil(scroll.end / itemSize);\n visibleStartIndex = Math.max(0, Math.floor((scroll.start) / itemSize));\n visibleEndIndex = Math.floor((scroll.end) / itemSize);\n\n // Bounds\n _startIndex < 0 && (_startIndex = 0);\n _endIndex > count && (_endIndex = count);\n visibleStartIndex < 0 && (visibleStartIndex = 0);\n visibleEndIndex > count && (visibleEndIndex = count);\n\n _totalSize = Math.ceil(count / 1) * itemSize;\n }\n }\n\n // items limit 1000\n if (_endIndex - _startIndex > 1000) {\n _itemsLimitError();\n }\n\n totalSize = _totalSize;\n\n let view;\n\n const continuous = _startIndex <= endIndex && _endIndex >= _startIndex;\n\n // Unuse views that are no longer visible\n if (continuous) {\n for (let i = 0, l = _pool.value.length; i < l; i++) {\n view = _pool.value[i];\n if (view?.nr.used) {\n // Update view item index\n if (checkItem) {\n view.nr.index = _itemIndexByKey[view.item[keyField]];\n }\n\n // Check if index is still in visible range\n if (\n view.nr.index == null ||\n view.nr.index < _startIndex ||\n view.nr.index >= _endIndex\n ) {\n _unuseView(view);\n }\n }\n }\n }\n\n const unusedIndex = continuous ? null : new Map();\n\n let item, type;\n let v;\n for (let i = _startIndex; i < _endIndex; i++) {\n item = items[i];\n const key = keyField ? item?.[keyField] : item;\n\n if (key == null) {\n throw new Error(`Key is ${key} on item (keyField is '${keyField}')`);\n }\n view = _views.get(key);\n\n if (!itemSize && !_sizes[i]?.size) {\n if (view) _unuseView(view);\n continue;\n }\n\n type = item.type;\n\n let unusedPool = _unusedViews.get(type);\n // let newlyUsedView = false;\n\n // No view assigned to item\n if (!view) {\n if (continuous) {\n // Reuse existing view\n if (unusedPool && unusedPool.length) {\n view = unusedPool.pop();\n } else {\n view = _addView(_pool, i, item, key, type);\n }\n } else {\n // Use existing view\n // We don't care if they are already used\n // because we are not in continous scrolling\n v = unusedIndex.get(type) || 0;\n\n if (!unusedPool || v >= unusedPool.length) {\n view = _addView(_pool, i, item, key, type);\n _unuseView(view, true);\n unusedPool = _unusedViews.get(type);\n }\n\n view = unusedPool[v];\n unusedIndex.set(type, v + 1);\n }\n\n // Assign view to item\n _views.delete(view.nr.key);\n view.nr.used = true;\n view.nr.index = i;\n view.nr.key = key;\n view.nr.type = type;\n _views.set(key, view);\n\n // newlyUsedView = true;\n } else {\n // View already assigned to item\n if (!view.nr.used) {\n view.nr.used = true;\n // newlyUsedView = true;\n if (unusedPool) {\n const index = unusedPool.indexOf(view);\n if (index !== -1) unusedPool.splice(index, 1);\n }\n }\n }\n\n // Always set item in case it's a new object with the same key\n view.item = item;\n\n // if (newlyUsedView) {\n // if (items.length === 0) return;\n // if (i === items.length - 1) emit('scroll-end');\n // if (i === 0) emit('scroll-start');\n // }\n\n // Update position\n if (itemSize === null) {\n view.position = _sizes[i - 1]?.accumulator;\n view.offset = 0;\n } else {\n view.position = Math.floor(i) * itemSize;\n view.offset = (i % 1) * itemSize;\n }\n }\n\n startIndex = _startIndex;\n endIndex = _endIndex;\n\n // After the user has finished scrolling\n // Sort views so text selection is correct\n clearTimeout(sortTimer);\n sortTimer = setTimeout(_sortViews, 300);\n\n return {\n continuous,\n };\n};\n\nconst _scrollToPosition = (position) => {\n const direction = props.direction === 'vertical'\n ? { scroll: 'scrollTop', start: 'top' }\n : { scroll: 'scrollLeft', start: 'left' };\n\n const viewport = scroller.value;\n const scrollDirection = direction.scroll;\n\n viewport[scrollDirection] = position;\n};\n\nconst scrollToItem = (index) => {\n let scroll;\n if (props.itemSize === null) {\n scroll = index > 0 ? sizes.value[index - 1]?.accumulator : 0;\n } else {\n scroll = Math.floor(index) * props.itemSize;\n }\n _scrollToPosition(scroll);\n};\n\nconst handleScroll = () => {\n const container = scroller.value;\n\n if (userPosition.value !== 'middle') {\n userPosition.value = 'middle';\n emit('user-position', 'middle');\n }\n\n // Check if the scroll is at the top of the container\n if (container.scrollTop === 0) {\n userPosition.value = 'top';\n emit('user-position', 'top');\n }\n\n // Check if the scroll is at the bottom of the container\n if (container.scrollTop + container.clientHeight === container.scrollHeight) {\n userPosition.value = 'bottom';\n emit('user-position', 'bottom');\n }\n\n if (!scrollDirty) {\n scrollDirty = true;\n if (updateTimeout) return;\n\n const requestUpdate = () => requestAnimationFrame(() => {\n scrollDirty = false;\n _updateVisibleItems(false, true);\n });\n\n requestUpdate();\n }\n};\n\ndefineExpose({\n scrollToItem,\n _updateVisibleItems,\n});\n</script>\n\n<style>\n.vue-recycle-scroller{\n position:relative\n}\n.vue-recycle-scroller.direction-vertical:not(.page-mode){\n overflow-y:auto\n}\n.vue-recycle-scroller.direction-horizontal:not(.page-mode){\n overflow-x:auto\n}\n.vue-recycle-scroller.direction-horizontal{\n display:flex\n}\n.vue-recycle-scroller__slot{\n flex:auto 0 0\n}\n.vue-recycle-scroller__item-wrapper{\n flex:1;\n box-sizing:border-box;\n overflow:hidden;\n position:relative\n}\n.vue-recycle-scroller.ready .vue-recycle-scroller__item-view{\n position:absolute;\n top:0;\n left:0;\n will-change:transform\n}\n.vue-recycle-scroller.direction-vertical .vue-recycle-scroller__item-wrapper{\n width:100%\n}\n.vue-recycle-scroller.direction-horizontal .vue-recycle-scroller__item-wrapper{\n height:100%\n}\n.vue-recycle-scroller.ready.direction-vertical .vue-recycle-scroller__item-view{\n width:100%\n}\n.vue-recycle-scroller.ready.direction-horizontal .vue-recycle-scroller__item-view{\n height:100%\n}\n </style>\n"],"names":["sizes","pool"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"core_scroller.vue.js","sources":["../../../../components/scroller/modules/core_scroller.vue"],"sourcesContent":["<!-- eslint-disable max-len -->\n<template>\n <div\n ref=\"scroller\"\n class=\"vue-recycle-scroller\"\n :class=\"{\n ready,\n [`direction-${direction}`]: true,\n }\"\n @scroll.passive=\"handleScroll\"\n >\n <component\n :is=\"listTag\"\n ref=\"wrapper\"\n :style=\"{ [direction === 'vertical' ? 'minHeight' : 'minWidth']: `${totalSize}px` }\"\n class=\"vue-recycle-scroller__item-wrapper\"\n :class=\"listClass\"\n >\n <component\n :is=\"itemTag\"\n v-for=\"view in pool\"\n :key=\"view.nr.id\"\n :style=\"ready ? {\n transform: `translate${direction === 'vertical' ? 'Y' : 'X'}(${view.position}px) translate${direction === 'vertical' ? 'X' : 'Y'}(${view.offset}px)`,\n width: undefined,\n height: undefined,\n } : null\"\n class=\"vue-recycle-scroller__item-view\"\n :class=\"[\n itemClass,\n {\n hover: !skipHover && hoverKey === view.nr.key,\n },\n ]\"\n v-on=\"skipHover ? {} : {\n mouseenter: () => { hoverKey = view.nr.key },\n mouseleave: () => { hoverKey = null },\n }\"\n >\n <slot\n :item=\"view.item\"\n :index=\"view.nr.index\"\n :active=\"view.nr.used\"\n />\n </component>\n </component>\n </div>\n</template>\n\n<script setup>\n/*\nThis is a code from external library (https://github.com/Akryum/vue-virtual-scroller/blob/master/packages/vue-virtual-scroller/src/components/RecycleScroller.vue)\nWe have modified it for our own specific use.\n*/\nimport { computed, watch, markRaw, shallowReactive, onMounted, nextTick, reactive, ref } from 'vue';\n\nconst props = defineProps({\n /**\n * List of items you want to display in the scroller.\n */\n items: {\n type: Array,\n required: true,\n },\n\n /**\n *\n * Field used to identify items and optimize managing rendered views\n */\n keyField: {\n type: String,\n default: 'id',\n },\n\n /**\n * Direction of the scroller. Can be either `vertical` or `horizontal`.\n */\n direction: {\n type: String,\n default: 'vertical',\n validator: (value) => ['vertical', 'horizontal'].includes(value),\n },\n\n /**\n * Size of the items in the list.\n * If it is set to null (the default value), it will use variable size mode.\n */\n itemSize: {\n type: Number,\n default: null,\n },\n\n /**\n * Minimum size used if the height (or width in horizontal mode) of an item is unknown.\n */\n minItemSize: {\n type: [Number, String],\n default: null,\n },\n\n /**\n * Field used to get the item's size in variable size mode.\n */\n sizeField: {\n type: String,\n default: 'size',\n },\n\n /**\n * Amount of pixel to add to edges of the scrolling visible area to start rendering items further away.\n */\n buffer: {\n type: Number,\n default: 200,\n },\n\n /**\n * If true, the hover state will be skipped.\n * This can be useful if you want to use the hover state for other purposes.\n */\n skipHover: {\n type: Boolean,\n default: false,\n },\n\n /**\n * The element to render as the list's wrapper.\n */\n listTag: {\n type: String,\n default: 'div',\n },\n\n /**\n * The element to render as the list item.\n */\n itemTag: {\n type: String,\n default: 'div',\n },\n\n /**\n * The custom classes added to the item list wrapper.\n */\n listClass: {\n type: [String, Object, Array],\n default: '',\n },\n\n /**\n * The custom classes added to each item.\n */\n itemClass: {\n type: [String, Object, Array],\n default: '',\n },\n});\n\nconst emit = defineEmits(['user-position']);\n\nconst views = reactive(new Map());\n// const reactiveItems = reactive(props.items);\nconst unusedViews = reactive(new Map());\nconst updateTimeout = null;\nconst pool = ref([]);\nconst hoverKey = ref(null);\nconst ready = ref(false);\nconst scroller = ref(null);\nconst userPosition = ref('top');\n\nlet startIndex = 0;\nlet endIndex = 0;\nlet scrollDirty = false;\nlet lastUpdateScrollPosition = 0;\nlet sortTimer = null;\nlet computedMinItemSize = null;\nlet totalSize = 0;\nlet uid = 0;\n\nconst sizes = computed(() => {\n if (props.itemSize === null) {\n const sizes = {\n '-1': { accumulator: 0 },\n };\n const items = props.items;\n const field = props.sizeField;\n const minItemSize = props.minItemSize;\n let computedMinSize = 10000;\n let accumulator = 0;\n let current;\n for (let i = 0, l = items.length; i < l; i++) {\n current = items[i][field] || minItemSize;\n if (current < computedMinSize) {\n computedMinSize = current;\n }\n accumulator += current;\n sizes[i] = { accumulator, size: current };\n }\n\n computedMinItemSize = computedMinSize;\n return sizes;\n }\n return [];\n});\n\nconst simpleArray = computed(() => {\n return props.items.length && typeof props.items[0] !== 'object';\n});\n\nconst itemIndexByKey = computed(() => {\n const result = {};\n for (let i = 0, l = props.items.length; i < l; i++) {\n result[props.items[i][props.keyField]] = i;\n }\n return result;\n});\n\n// watch(reactiveItems, () => {\n// // if add to the top\n// // _updateVisibleItems(true);\n// // if autoscrolling if add to the bottom\n// // _updateVisibleItems(false, true);\n// });\n\nwatch(sizes, () => {\n _updateVisibleItems(false);\n}, { deep: true });\n\nonMounted(() => {\n nextTick(() => {\n // In SSR mode, render the real number of visible items\n _updateVisibleItems(true);\n ready.value = true;\n });\n});\n\nconst _addView = (pool, index, item, key, type) => {\n const nr = markRaw({\n id: uid++,\n index,\n used: true,\n key,\n type,\n });\n const view = shallowReactive({\n item,\n position: 0,\n nr,\n });\n pool.value.push(view);\n return view;\n};\n\nconst _unuseView = (view, fake = false) => {\n const _unusedViews = unusedViews;\n const type = view.nr.type;\n let unusedPool = _unusedViews.get(type);\n if (!unusedPool) {\n unusedPool = [];\n _unusedViews.set(type, unusedPool);\n }\n unusedPool.push(view);\n if (!fake) {\n view.nr.used = false;\n view.position = -9999;\n }\n};\n\nconst _getScroll = () => {\n const isVertical = props.direction === 'vertical';\n let scrollState;\n\n if (isVertical) {\n scrollState = {\n start: scroller.value.scrollTop,\n end: scroller.value.scrollTop + scroller.value.clientHeight,\n };\n } else {\n scrollState = {\n start: scroller.value.scrollLeft,\n end: scroller.value.scrollLeft + scroller.value.clientWidth,\n };\n }\n\n return scrollState;\n};\n\nconst _itemsLimitError = () => {\n setTimeout(() => {\n // eslint-disable-next-line max-len\n console.error('It seems the scroller element isn\\'t scrolling, so it tries to render all the items at once.', 'Scroller:', scroller);\n // eslint-disable-next-line max-len\n console.error('Make sure the scroller has a fixed height (or width) and \\'overflow-y\\' (or \\'overflow-x\\') set to \\'auto\\' so it can scroll correctly and only render the items visible in the scroll viewport.');\n });\n throw new Error('Rendered items limit reached');\n};\n\nconst _sortViews = () => {\n pool.value.sort((viewA, viewB) => viewA.nr.index - viewB.nr.index);\n};\n\nconst _updateVisibleItems = (checkItem, checkPositionDiff = false) => {\n const itemSize = props.itemSize;\n const minItemSize = computedMinItemSize;\n const keyField = simpleArray.value ? null : props.keyField;\n const items = props.items;\n const count = items.length;\n const _sizes = sizes.value;\n const _views = views;\n const _unusedViews = unusedViews;\n const _pool = pool;\n const _itemIndexByKey = itemIndexByKey;\n let _startIndex, _endIndex;\n let _totalSize;\n let visibleStartIndex, visibleEndIndex;\n\n if (!count) {\n _startIndex = _endIndex = visibleStartIndex = visibleEndIndex = _totalSize = 0;\n } else {\n const scroll = _getScroll();\n\n // Skip update if use hasn't scrolled enough\n if (checkPositionDiff) {\n let positionDiff = scroll.start - lastUpdateScrollPosition.value;\n if (positionDiff < 0) positionDiff = -positionDiff;\n if ((itemSize === null && positionDiff < minItemSize.value) || positionDiff < itemSize) {\n return {\n continuous: true,\n };\n }\n }\n lastUpdateScrollPosition = scroll.start;\n\n const _buffer = props.buffer;\n scroll.start -= _buffer;\n scroll.end += _buffer;\n\n // Variable size mode\n if (itemSize === null) {\n let h;\n let a = 0;\n let b = count - 1;\n let i = ~~(count / 2);\n let oldI;\n\n // Searching for _startIndex\n do {\n oldI = i;\n h = _sizes[i]?.accumulator;\n if (h < scroll.start) {\n a = i;\n } else if (i < count - 1 && _sizes[i + 1]?.accumulator > scroll.start) {\n b = i;\n }\n i = ~~((a + b) / 2);\n } while (i !== oldI);\n i < 0 && (i = 0);\n _startIndex = i;\n\n // For container style\n _totalSize = _sizes[count - 1]?.accumulator;\n\n // Searching for _endIndex\n for (\n _endIndex = i;\n _endIndex < count && _sizes[_endIndex]?.accumulator < scroll.end;\n _endIndex++\n );\n\n if (_endIndex === -1) {\n _endIndex = items.length - 1;\n } else {\n _endIndex++;\n // Bounds\n _endIndex > count && (_endIndex = count);\n }\n\n // search visible _startIndex\n for (\n visibleStartIndex = startIndex;\n visibleStartIndex < count && (_sizes[visibleStartIndex]?.accumulator) < scroll.start;\n visibleStartIndex++\n );\n\n // search visible endIndex\n for (\n visibleEndIndex = visibleStartIndex;\n visibleEndIndex < count && (_sizes[visibleEndIndex]?.accumulator) < scroll.end;\n visibleEndIndex++\n );\n } else {\n // Fixed size mode\n _startIndex = ~~(scroll.start / itemSize);\n const remainer = _startIndex % 1;\n _startIndex -= remainer;\n _endIndex = Math.ceil(scroll.end / itemSize);\n visibleStartIndex = Math.max(0, Math.floor((scroll.start) / itemSize));\n visibleEndIndex = Math.floor((scroll.end) / itemSize);\n\n // Bounds\n _startIndex < 0 && (_startIndex = 0);\n _endIndex > count && (_endIndex = count);\n visibleStartIndex < 0 && (visibleStartIndex = 0);\n visibleEndIndex > count && (visibleEndIndex = count);\n\n _totalSize = Math.ceil(count / 1) * itemSize;\n }\n }\n\n // items limit 1000\n if (_endIndex - _startIndex > 1000) {\n _itemsLimitError();\n }\n\n totalSize = _totalSize;\n\n let view;\n\n const continuous = _startIndex <= endIndex && _endIndex >= _startIndex;\n\n // Unuse views that are no longer visible\n if (continuous) {\n for (let i = 0, l = _pool.value.length; i < l; i++) {\n view = _pool.value[i];\n if (view?.nr.used) {\n // Update view item index\n if (checkItem) {\n view.nr.index = _itemIndexByKey[view.item[keyField]];\n }\n\n // Check if index is still in visible range\n if (\n view.nr.index == null ||\n view.nr.index < _startIndex ||\n view.nr.index >= _endIndex\n ) {\n _unuseView(view);\n }\n }\n }\n }\n\n const unusedIndex = continuous ? null : new Map();\n\n let item, type;\n let v;\n for (let i = _startIndex; i < _endIndex; i++) {\n item = items[i];\n const key = keyField ? item?.[keyField] : item;\n\n if (key == null) {\n throw new Error(`Key is ${key} on item (keyField is '${keyField}')`);\n }\n view = _views.get(key);\n\n if (!itemSize && !_sizes[i]?.size) {\n if (view) _unuseView(view);\n continue;\n }\n\n type = item.type;\n\n let unusedPool = _unusedViews.get(type);\n // let newlyUsedView = false;\n\n // No view assigned to item\n if (!view) {\n if (continuous) {\n // Reuse existing view\n if (unusedPool && unusedPool.length) {\n view = unusedPool.pop();\n } else {\n view = _addView(_pool, i, item, key, type);\n }\n } else {\n // Use existing view\n // We don't care if they are already used\n // because we are not in continous scrolling\n v = unusedIndex.get(type) || 0;\n\n if (!unusedPool || v >= unusedPool.length) {\n view = _addView(_pool, i, item, key, type);\n _unuseView(view, true);\n unusedPool = _unusedViews.get(type);\n }\n\n view = unusedPool[v];\n unusedIndex.set(type, v + 1);\n }\n\n // Assign view to item\n _views.delete(view.nr.key);\n view.nr.used = true;\n view.nr.index = i;\n view.nr.key = key;\n view.nr.type = type;\n _views.set(key, view);\n\n // newlyUsedView = true;\n } else {\n // View already assigned to item\n if (!view.nr.used) {\n view.nr.used = true;\n // newlyUsedView = true;\n if (unusedPool) {\n const index = unusedPool.indexOf(view);\n if (index !== -1) unusedPool.splice(index, 1);\n }\n }\n }\n\n // Always set item in case it's a new object with the same key\n view.item = item;\n\n // if (newlyUsedView) {\n // if (items.length === 0) return;\n // if (i === items.length - 1) emit('scroll-end');\n // if (i === 0) emit('scroll-start');\n // }\n\n // Update position\n if (itemSize === null) {\n view.position = _sizes[i - 1]?.accumulator;\n view.offset = 0;\n } else {\n view.position = Math.floor(i) * itemSize;\n view.offset = (i % 1) * itemSize;\n }\n }\n\n startIndex = _startIndex;\n endIndex = _endIndex;\n\n // After the user has finished scrolling\n // Sort views so text selection is correct\n clearTimeout(sortTimer);\n sortTimer = setTimeout(_sortViews, 300);\n\n return {\n continuous,\n };\n};\n\nconst _scrollToPosition = (position) => {\n const direction = props.direction === 'vertical'\n ? { scroll: 'scrollTop', start: 'top' }\n : { scroll: 'scrollLeft', start: 'left' };\n\n const viewport = scroller.value;\n const scrollDirection = direction.scroll;\n\n viewport[scrollDirection] = position;\n};\n\nconst scrollToItem = (index) => {\n let scroll;\n if (props.itemSize === null) {\n scroll = index > 0 ? sizes.value[index - 1]?.accumulator : 0;\n } else {\n scroll = Math.floor(index) * props.itemSize;\n }\n _scrollToPosition(scroll);\n};\n\nconst handleScroll = () => {\n const container = scroller.value;\n\n if (userPosition.value !== 'middle') {\n userPosition.value = 'middle';\n emit('user-position', 'middle');\n }\n\n // Check if the scroll is at the top of the container\n if (container.scrollTop === 0) {\n userPosition.value = 'top';\n emit('user-position', 'top');\n }\n\n // Check if the scroll is at the bottom of the container\n if (container.scrollTop + container.clientHeight === container.scrollHeight) {\n userPosition.value = 'bottom';\n emit('user-position', 'bottom');\n }\n\n if (!scrollDirty) {\n scrollDirty = true;\n if (updateTimeout) return;\n\n const requestUpdate = () => requestAnimationFrame(() => {\n scrollDirty = false;\n _updateVisibleItems(false, true);\n });\n\n requestUpdate();\n }\n};\n\ndefineExpose({\n scrollToItem,\n _updateVisibleItems,\n});\n</script>\n"],"names":["sizes","pool"],"mappings":"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"}
|
|
@@ -83,10 +83,10 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
|
|
|
83
83
|
ref: "skeleton",
|
|
84
84
|
"data-qa": "skeleton-shape",
|
|
85
85
|
class: vue.normalizeClass([
|
|
86
|
-
"skeleton-placeholder",
|
|
86
|
+
"d-skeleton-placeholder",
|
|
87
87
|
$data.SKELETON_SHAPES[$props.shape],
|
|
88
88
|
{
|
|
89
|
-
"skeleton-placeholder--animate": $props.animate
|
|
89
|
+
"d-skeleton-placeholder--animate": $props.animate
|
|
90
90
|
},
|
|
91
91
|
$props.contentClass
|
|
92
92
|
]),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"skeleton-shape.vue.cjs","sources":["../../../components/skeleton/skeleton-shape.vue"],"sourcesContent":["<template>\n <div\n ref=\"skeleton\"\n data-qa=\"skeleton-shape\"\n :class=\"[\n 'skeleton-placeholder',\n SKELETON_SHAPES[shape],\n {\n 'skeleton-placeholder--animate': animate,\n },\n contentClass,\n ]\"\n :style=\"shapeStyles\"\n />\n</template>\n\n<script>\nimport SkeletonAnimation from '@/common/mixins/skeleton';\nimport {\n SKELETON_SHAPES,\n SKELETON_SHAPE_SIZES,\n} from './skeleton_constants';\n\nexport default {\n name: 'DtSkeletonShape',\n\n mixins: [SkeletonAnimation],\n\n props: {\n /**\n * Defines the shape of the skeleton, accepts circle or square.\n * @values circle, square\n */\n shape: {\n type: String,\n default: 'circle',\n validator: shape => Object.keys(SKELETON_SHAPES).includes(shape),\n },\n\n /**\n * Size of the shape\n * @values xs, sm, md, lg, xl\n */\n size: {\n type: String,\n default: 'md',\n },\n\n /**\n * Duration time of the animation (ms), set -1 for an infinite animation.\n */\n animationDuration: {\n type: Number,\n default: -1,\n },\n\n /**\n * This property has higher priority than \"option.animate\"\n * @values true, false\n */\n animate: {\n type: Boolean,\n default: true,\n },\n\n /**\n * RippleDuration controls how long the delay is for the animation of a\n * placeholder 1000 pixels from the top of the page. Each placeholder\n * from the top down will have a delay duration from 0 to this offset.\n * The delay of each placeholder animation is based on how far down the page\n * the placeholder is rendered. This is a linear relationship. The unit\n * is milliseconds.\n */\n offset: {\n type: Number,\n default: 1,\n },\n\n /**\n * Additional class name for the content.\n */\n contentClass: {\n type: [String, Object, Array],\n default: '',\n },\n },\n\n data () {\n return {\n SKELETON_SHAPES,\n };\n },\n\n computed: {\n shapeStyles () {\n const size = SKELETON_SHAPE_SIZES[this.size] || this.size;\n return {\n ...this.skeletonStyle,\n 'min-width': size,\n 'max-width': size,\n 'min-height': size,\n 'max-height': size,\n };\n },\n },\n};\n</script>\n"],"names":["SkeletonAnimation","SKELETON_SHAPES","SKELETON_SHAPE_SIZES","_createElementBlock","_normalizeClass","_normalizeStyle"],"mappings":";;;;;;AAuBA,MAAK,YAAU;AAAA,EACb,MAAM;AAAA,EAEN,QAAQ,CAACA,SAAAA,OAAiB;AAAA,EAE1B,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA,IAKL,OAAO;AAAA,MACL,MAAM;AAAA,MACN,SAAS;AAAA,MACT,WAAW,WAAS,OAAO,KAAKC,mBAAAA,eAAe,EAAE,SAAS,KAAK;AAAA,IAChE;AAAA;AAAA;AAAA;AAAA;AAAA,IAMD,MAAM;AAAA,MACJ,MAAM;AAAA,MACN,SAAS;AAAA,IACV;AAAA;AAAA;AAAA;AAAA,IAKD,mBAAmB;AAAA,MACjB,MAAM;AAAA,MACN,SAAS;AAAA,IACV;AAAA;AAAA;AAAA;AAAA;AAAA,IAMD,SAAS;AAAA,MACP,MAAM;AAAA,MACN,SAAS;AAAA,IACV;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAUD,QAAQ;AAAA,MACN,MAAM;AAAA,MACN,SAAS;AAAA,IACV;AAAA;AAAA;AAAA;AAAA,IAKD,cAAc;AAAA,MACZ,MAAM,CAAC,QAAQ,QAAQ,KAAK;AAAA,MAC5B,SAAS;AAAA,IACV;AAAA,EACF;AAAA,EAED,OAAQ;AACN,WAAO;AAAA,MACL,iBAAAA,mBAAe;AAAA;EAElB;AAAA,EAED,UAAU;AAAA,IACR,cAAe;AACb,YAAM,OAAOC,mBAAAA,qBAAqB,KAAK,IAAI,KAAK,KAAK;AACrD,aAAO;AAAA,QACL,GAAG,KAAK;AAAA,QACR,aAAa;AAAA,QACb,aAAa;AAAA,QACb,cAAc;AAAA,QACd,cAAc;AAAA;IAEjB;AAAA,EACF;AACH;;0BAxGEC,IAYE,mBAAA,OAAA;AAAA,IAXA,KAAI;AAAA,IACJ,WAAQ;AAAA,IACP,OAJLC,IAAAA,eAAA;AAAA;
|
|
1
|
+
{"version":3,"file":"skeleton-shape.vue.cjs","sources":["../../../components/skeleton/skeleton-shape.vue"],"sourcesContent":["<template>\n <div\n ref=\"skeleton\"\n data-qa=\"skeleton-shape\"\n :class=\"[\n 'd-skeleton-placeholder',\n SKELETON_SHAPES[shape],\n {\n 'd-skeleton-placeholder--animate': animate,\n },\n contentClass,\n ]\"\n :style=\"shapeStyles\"\n />\n</template>\n\n<script>\nimport SkeletonAnimation from '@/common/mixins/skeleton';\nimport {\n SKELETON_SHAPES,\n SKELETON_SHAPE_SIZES,\n} from './skeleton_constants';\n\nexport default {\n name: 'DtSkeletonShape',\n\n mixins: [SkeletonAnimation],\n\n props: {\n /**\n * Defines the shape of the skeleton, accepts circle or square.\n * @values circle, square\n */\n shape: {\n type: String,\n default: 'circle',\n validator: shape => Object.keys(SKELETON_SHAPES).includes(shape),\n },\n\n /**\n * Size of the shape\n * @values xs, sm, md, lg, xl\n */\n size: {\n type: String,\n default: 'md',\n },\n\n /**\n * Duration time of the animation (ms), set -1 for an infinite animation.\n */\n animationDuration: {\n type: Number,\n default: -1,\n },\n\n /**\n * This property has higher priority than \"option.animate\"\n * @values true, false\n */\n animate: {\n type: Boolean,\n default: true,\n },\n\n /**\n * RippleDuration controls how long the delay is for the animation of a\n * placeholder 1000 pixels from the top of the page. Each placeholder\n * from the top down will have a delay duration from 0 to this offset.\n * The delay of each placeholder animation is based on how far down the page\n * the placeholder is rendered. This is a linear relationship. The unit\n * is milliseconds.\n */\n offset: {\n type: Number,\n default: 1,\n },\n\n /**\n * Additional class name for the content.\n */\n contentClass: {\n type: [String, Object, Array],\n default: '',\n },\n },\n\n data () {\n return {\n SKELETON_SHAPES,\n };\n },\n\n computed: {\n shapeStyles () {\n const size = SKELETON_SHAPE_SIZES[this.size] || this.size;\n return {\n ...this.skeletonStyle,\n 'min-width': size,\n 'max-width': size,\n 'min-height': size,\n 'max-height': size,\n };\n },\n },\n};\n</script>\n"],"names":["SkeletonAnimation","SKELETON_SHAPES","SKELETON_SHAPE_SIZES","_createElementBlock","_normalizeClass","_normalizeStyle"],"mappings":";;;;;;AAuBA,MAAK,YAAU;AAAA,EACb,MAAM;AAAA,EAEN,QAAQ,CAACA,SAAAA,OAAiB;AAAA,EAE1B,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA,IAKL,OAAO;AAAA,MACL,MAAM;AAAA,MACN,SAAS;AAAA,MACT,WAAW,WAAS,OAAO,KAAKC,mBAAAA,eAAe,EAAE,SAAS,KAAK;AAAA,IAChE;AAAA;AAAA;AAAA;AAAA;AAAA,IAMD,MAAM;AAAA,MACJ,MAAM;AAAA,MACN,SAAS;AAAA,IACV;AAAA;AAAA;AAAA;AAAA,IAKD,mBAAmB;AAAA,MACjB,MAAM;AAAA,MACN,SAAS;AAAA,IACV;AAAA;AAAA;AAAA;AAAA;AAAA,IAMD,SAAS;AAAA,MACP,MAAM;AAAA,MACN,SAAS;AAAA,IACV;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAUD,QAAQ;AAAA,MACN,MAAM;AAAA,MACN,SAAS;AAAA,IACV;AAAA;AAAA;AAAA;AAAA,IAKD,cAAc;AAAA,MACZ,MAAM,CAAC,QAAQ,QAAQ,KAAK;AAAA,MAC5B,SAAS;AAAA,IACV;AAAA,EACF;AAAA,EAED,OAAQ;AACN,WAAO;AAAA,MACL,iBAAAA,mBAAe;AAAA;EAElB;AAAA,EAED,UAAU;AAAA,IACR,cAAe;AACb,YAAM,OAAOC,mBAAAA,qBAAqB,KAAK,IAAI,KAAK,KAAK;AACrD,aAAO;AAAA,QACL,GAAG,KAAK;AAAA,QACR,aAAa;AAAA,QACb,aAAa;AAAA,QACb,cAAc;AAAA,QACd,cAAc;AAAA;IAEjB;AAAA,EACF;AACH;;0BAxGEC,IAYE,mBAAA,OAAA;AAAA,IAXA,KAAI;AAAA,IACJ,WAAQ;AAAA,IACP,OAJLC,IAAAA,eAAA;AAAA;MAIoD,MAAA,gBAAgB,OAAK,KAAA;AAAA;2CAAsD,OAAO;AAAA;MAAiB,OAAY;AAAA;IAQ9J,OAZLC,IAAAA,eAYY,SAAW,WAAA;AAAA;;;;"}
|
|
@@ -81,10 +81,10 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
|
|
|
81
81
|
ref: "skeleton",
|
|
82
82
|
"data-qa": "skeleton-shape",
|
|
83
83
|
class: normalizeClass([
|
|
84
|
-
"skeleton-placeholder",
|
|
84
|
+
"d-skeleton-placeholder",
|
|
85
85
|
$data.SKELETON_SHAPES[$props.shape],
|
|
86
86
|
{
|
|
87
|
-
"skeleton-placeholder--animate": $props.animate
|
|
87
|
+
"d-skeleton-placeholder--animate": $props.animate
|
|
88
88
|
},
|
|
89
89
|
$props.contentClass
|
|
90
90
|
]),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"skeleton-shape.vue.js","sources":["../../../components/skeleton/skeleton-shape.vue"],"sourcesContent":["<template>\n <div\n ref=\"skeleton\"\n data-qa=\"skeleton-shape\"\n :class=\"[\n 'skeleton-placeholder',\n SKELETON_SHAPES[shape],\n {\n 'skeleton-placeholder--animate': animate,\n },\n contentClass,\n ]\"\n :style=\"shapeStyles\"\n />\n</template>\n\n<script>\nimport SkeletonAnimation from '@/common/mixins/skeleton';\nimport {\n SKELETON_SHAPES,\n SKELETON_SHAPE_SIZES,\n} from './skeleton_constants';\n\nexport default {\n name: 'DtSkeletonShape',\n\n mixins: [SkeletonAnimation],\n\n props: {\n /**\n * Defines the shape of the skeleton, accepts circle or square.\n * @values circle, square\n */\n shape: {\n type: String,\n default: 'circle',\n validator: shape => Object.keys(SKELETON_SHAPES).includes(shape),\n },\n\n /**\n * Size of the shape\n * @values xs, sm, md, lg, xl\n */\n size: {\n type: String,\n default: 'md',\n },\n\n /**\n * Duration time of the animation (ms), set -1 for an infinite animation.\n */\n animationDuration: {\n type: Number,\n default: -1,\n },\n\n /**\n * This property has higher priority than \"option.animate\"\n * @values true, false\n */\n animate: {\n type: Boolean,\n default: true,\n },\n\n /**\n * RippleDuration controls how long the delay is for the animation of a\n * placeholder 1000 pixels from the top of the page. Each placeholder\n * from the top down will have a delay duration from 0 to this offset.\n * The delay of each placeholder animation is based on how far down the page\n * the placeholder is rendered. This is a linear relationship. The unit\n * is milliseconds.\n */\n offset: {\n type: Number,\n default: 1,\n },\n\n /**\n * Additional class name for the content.\n */\n contentClass: {\n type: [String, Object, Array],\n default: '',\n },\n },\n\n data () {\n return {\n SKELETON_SHAPES,\n };\n },\n\n computed: {\n shapeStyles () {\n const size = SKELETON_SHAPE_SIZES[this.size] || this.size;\n return {\n ...this.skeletonStyle,\n 'min-width': size,\n 'max-width': size,\n 'min-height': size,\n 'max-height': size,\n };\n },\n },\n};\n</script>\n"],"names":["_createElementBlock","_normalizeClass","_normalizeStyle"],"mappings":";;;;AAuBA,MAAK,YAAU;AAAA,EACb,MAAM;AAAA,EAEN,QAAQ,CAAC,iBAAiB;AAAA,EAE1B,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA,IAKL,OAAO;AAAA,MACL,MAAM;AAAA,MACN,SAAS;AAAA,MACT,WAAW,WAAS,OAAO,KAAK,eAAe,EAAE,SAAS,KAAK;AAAA,IAChE;AAAA;AAAA;AAAA;AAAA;AAAA,IAMD,MAAM;AAAA,MACJ,MAAM;AAAA,MACN,SAAS;AAAA,IACV;AAAA;AAAA;AAAA;AAAA,IAKD,mBAAmB;AAAA,MACjB,MAAM;AAAA,MACN,SAAS;AAAA,IACV;AAAA;AAAA;AAAA;AAAA;AAAA,IAMD,SAAS;AAAA,MACP,MAAM;AAAA,MACN,SAAS;AAAA,IACV;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAUD,QAAQ;AAAA,MACN,MAAM;AAAA,MACN,SAAS;AAAA,IACV;AAAA;AAAA;AAAA;AAAA,IAKD,cAAc;AAAA,MACZ,MAAM,CAAC,QAAQ,QAAQ,KAAK;AAAA,MAC5B,SAAS;AAAA,IACV;AAAA,EACF;AAAA,EAED,OAAQ;AACN,WAAO;AAAA,MACL;AAAA;EAEH;AAAA,EAED,UAAU;AAAA,IACR,cAAe;AACb,YAAM,OAAO,qBAAqB,KAAK,IAAI,KAAK,KAAK;AACrD,aAAO;AAAA,QACL,GAAG,KAAK;AAAA,QACR,aAAa;AAAA,QACb,aAAa;AAAA,QACb,cAAc;AAAA,QACd,cAAc;AAAA;IAEjB;AAAA,EACF;AACH;;sBAxGEA,mBAYE,OAAA;AAAA,IAXA,KAAI;AAAA,IACJ,WAAQ;AAAA,IACP,OAJLC,eAAA;AAAA;
|
|
1
|
+
{"version":3,"file":"skeleton-shape.vue.js","sources":["../../../components/skeleton/skeleton-shape.vue"],"sourcesContent":["<template>\n <div\n ref=\"skeleton\"\n data-qa=\"skeleton-shape\"\n :class=\"[\n 'd-skeleton-placeholder',\n SKELETON_SHAPES[shape],\n {\n 'd-skeleton-placeholder--animate': animate,\n },\n contentClass,\n ]\"\n :style=\"shapeStyles\"\n />\n</template>\n\n<script>\nimport SkeletonAnimation from '@/common/mixins/skeleton';\nimport {\n SKELETON_SHAPES,\n SKELETON_SHAPE_SIZES,\n} from './skeleton_constants';\n\nexport default {\n name: 'DtSkeletonShape',\n\n mixins: [SkeletonAnimation],\n\n props: {\n /**\n * Defines the shape of the skeleton, accepts circle or square.\n * @values circle, square\n */\n shape: {\n type: String,\n default: 'circle',\n validator: shape => Object.keys(SKELETON_SHAPES).includes(shape),\n },\n\n /**\n * Size of the shape\n * @values xs, sm, md, lg, xl\n */\n size: {\n type: String,\n default: 'md',\n },\n\n /**\n * Duration time of the animation (ms), set -1 for an infinite animation.\n */\n animationDuration: {\n type: Number,\n default: -1,\n },\n\n /**\n * This property has higher priority than \"option.animate\"\n * @values true, false\n */\n animate: {\n type: Boolean,\n default: true,\n },\n\n /**\n * RippleDuration controls how long the delay is for the animation of a\n * placeholder 1000 pixels from the top of the page. Each placeholder\n * from the top down will have a delay duration from 0 to this offset.\n * The delay of each placeholder animation is based on how far down the page\n * the placeholder is rendered. This is a linear relationship. The unit\n * is milliseconds.\n */\n offset: {\n type: Number,\n default: 1,\n },\n\n /**\n * Additional class name for the content.\n */\n contentClass: {\n type: [String, Object, Array],\n default: '',\n },\n },\n\n data () {\n return {\n SKELETON_SHAPES,\n };\n },\n\n computed: {\n shapeStyles () {\n const size = SKELETON_SHAPE_SIZES[this.size] || this.size;\n return {\n ...this.skeletonStyle,\n 'min-width': size,\n 'max-width': size,\n 'min-height': size,\n 'max-height': size,\n };\n },\n },\n};\n</script>\n"],"names":["_createElementBlock","_normalizeClass","_normalizeStyle"],"mappings":";;;;AAuBA,MAAK,YAAU;AAAA,EACb,MAAM;AAAA,EAEN,QAAQ,CAAC,iBAAiB;AAAA,EAE1B,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA,IAKL,OAAO;AAAA,MACL,MAAM;AAAA,MACN,SAAS;AAAA,MACT,WAAW,WAAS,OAAO,KAAK,eAAe,EAAE,SAAS,KAAK;AAAA,IAChE;AAAA;AAAA;AAAA;AAAA;AAAA,IAMD,MAAM;AAAA,MACJ,MAAM;AAAA,MACN,SAAS;AAAA,IACV;AAAA;AAAA;AAAA;AAAA,IAKD,mBAAmB;AAAA,MACjB,MAAM;AAAA,MACN,SAAS;AAAA,IACV;AAAA;AAAA;AAAA;AAAA;AAAA,IAMD,SAAS;AAAA,MACP,MAAM;AAAA,MACN,SAAS;AAAA,IACV;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAUD,QAAQ;AAAA,MACN,MAAM;AAAA,MACN,SAAS;AAAA,IACV;AAAA;AAAA;AAAA;AAAA,IAKD,cAAc;AAAA,MACZ,MAAM,CAAC,QAAQ,QAAQ,KAAK;AAAA,MAC5B,SAAS;AAAA,IACV;AAAA,EACF;AAAA,EAED,OAAQ;AACN,WAAO;AAAA,MACL;AAAA;EAEH;AAAA,EAED,UAAU;AAAA,IACR,cAAe;AACb,YAAM,OAAO,qBAAqB,KAAK,IAAI,KAAK,KAAK;AACrD,aAAO;AAAA,QACL,GAAG,KAAK;AAAA,QACR,aAAa;AAAA,QACb,aAAa;AAAA,QACb,cAAc;AAAA,QACd,cAAc;AAAA;IAEjB;AAAA,EACF;AACH;;sBAxGEA,mBAYE,OAAA;AAAA,IAXA,KAAI;AAAA,IACJ,WAAQ;AAAA,IACP,OAJLC,eAAA;AAAA;MAIoD,MAAA,gBAAgB,OAAK,KAAA;AAAA;2CAAsD,OAAO;AAAA;MAAiB,OAAY;AAAA;IAQ9J,OAZLC,eAYY,SAAW,WAAA;AAAA;;;"}
|