6 changed files with 67 additions and 17 deletions
@ -1,25 +1,33 @@
@@ -1,25 +1,33 @@
|
||||
<script> |
||||
import { name } from '../../vcard.js'; |
||||
import LineEditor from '../../Components/LineEditor.svelte'; |
||||
import { name } from '../../vcard.js'; |
||||
import { t } from '../../translations.svelte'; |
||||
|
||||
let { vcard } = $props(); |
||||
let { code, patch = (from, to) => true } = $props(); |
||||
|
||||
let n = $derived(name(vcard)); |
||||
let n = $derived(name(code)); |
||||
|
||||
function onSet(oldVal,newVal){ |
||||
console.log(`onset(${oldVal} → ${newVal})`); |
||||
const newCode = code.replace(oldVal,newVal); |
||||
return patch(code,newCode); |
||||
} |
||||
</script> |
||||
|
||||
<div class="name"> |
||||
{#if n.prefix} |
||||
<span class="prefix">{n.prefix}</span> |
||||
<LineEditor type="span" editable={true} value={n.prefix} onSet={newVal => onSet(n.prefix,newVal)} title={t('name_prefix')} /> |
||||
{/if} |
||||
{#if n.given} |
||||
<span class="given">{n.given}</span> |
||||
<LineEditor type="span" editable={true} value={n.given} onSet={newVal => onSet(n.given,newVal)} title={t('given_name')} /> |
||||
{/if} |
||||
{#if n.additional} |
||||
<span class="additional">{n.additional}</span> |
||||
<LineEditor type="span" editable={true} value={n.additional} onSet={newVal => onSet(n.additional,newVal)} title={t('additional_name')} /> |
||||
{/if} |
||||
{#if n.family} |
||||
<span class="family">{n.family}</span> |
||||
<LineEditor type="span" editable={true} value={n.family} onSet={newVal => onSet(n.family,newVal)} title={t('family_name')} /> |
||||
{/if} |
||||
{#if n.suffix} |
||||
<span class="suffix">{n.suffix}</span> |
||||
<LineEditor type="span" editable={true} value={n.suffix} onSet={newVal => onSet(n.suffix,newVal)} title={t('<name_suffix></name_suffix>')} /> |
||||
{/if} |
||||
</div> |
||||
Loading…
Reference in new issue