EZQMS-398: Add StringDiffViewer (#4085)

Signed-off-by: Anna No <anna.no@xored.com>
This commit is contained in:
Anna No 2023-11-28 16:33:16 +07:00 committed by GitHub
parent 13cdaa7f66
commit 72bb3c9c60
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 37 additions and 0 deletions

View File

@ -0,0 +1,36 @@
<!--
//
// Copyright © 2022, 2023 Hardcore Engineering Inc.
//
// Licensed under the Eclipse Public License, Version 2.0 (the "License");
// you may not use this file except in compliance with the License. You may
// obtain a copy of the License at https://www.eclipse.org/legal/epl-2.0
//
// Unless required by applicable law or agreed to in writing, software
// distributed under the License is distributed on an "AS IS" BASIS,
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
//
// See the License for the specific language governing permissions and
// limitations under the License.
//
-->
<script lang="ts">
import * as Diff from 'diff'
export let value: string
export let compareTo: string
export let method: 'diffChars' | 'diffWords' | 'diffWordsWithSpace' = 'diffChars'
const handleDiff = (oldValue: string, newValue: string) => Diff[method](oldValue, newValue)
$: changes = handleDiff(value, compareTo)
</script>
{#each changes as change}
<span
class:text-editor-highlighted-node-add={change.added}
class:text-editor-highlighted-node-delete={change.removed}
>
{change.value}
</span>
{/each}

View File

@ -23,6 +23,7 @@ export { default as CollaboratorEditor } from './components/CollaboratorEditor.s
export { default as FullDescriptionBox } from './components/FullDescriptionBox.svelte'
export { default as MarkupDiffViewer } from './components/MarkupDiffViewer.svelte'
export { default as ReferenceInput } from './components/ReferenceInput.svelte'
export { default as StringDiffViewer } from './components/StringDiffViewer.svelte'
export { default as StyleButton } from './components/StyleButton.svelte'
export { default as StyledTextArea } from './components/StyledTextArea.svelte'
export { default as StyledTextBox } from './components/StyledTextBox.svelte'