@svadmin/lite 0.26.0 → 0.27.0

package/dist/components/LiteKpiCard.svelte

@@ -0,0 +1,169 @@
+<script lang="ts">
+  import type { Snippet } from 'svelte';
+
+  interface TargetProgress {
+    current: number;
+    target: number;
+    label?: string;
+  }
+
+  interface Props {
+    title: string;
+    value: number | string;
+    prefix?: string;
+    suffix?: string;
+    subtitle?: string;
+    trendText?: string;
+    trendDirection?: 'up' | 'down' | 'neutral';
+    targetProgress?: TargetProgress;
+    sparklineData?: number[];
+    alertStatus?: 'normal' | 'warning' | 'danger';
+    alertMessage?: string;
+    class?: string;
+    actions?: Snippet;
+    children?: Snippet;
+  }
+
+  let {
+    title,
+    value,
+    prefix = '',
+    suffix = '',
+    subtitle,
+    trendText,
+    trendDirection = 'neutral',
+    targetProgress,
+    sparklineData,
+    alertStatus = 'normal',
+    alertMessage,
+    class: className = '',
+    actions,
+    children,
+  }: Props = $props();
+
+  const formattedValue = $derived(
+    typeof value === 'number' ? value.toLocaleString('en-US') : String(value)
+  );
+
+  const progressPercent = $derived.by(() => {
+    if (!targetProgress || targetProgress.target <= 0) return 0;
+    const pct = (targetProgress.current / targetProgress.target) * 100;
+    return Math.max(0, Math.min(100, Math.round(pct)));
+  });
+
+  const sparklinePoints = $derived.by(() => {
+    if (!sparklineData || sparklineData.length < 2) return '';
+    const min = Math.min(...sparklineData);
+    const max = Math.max(...sparklineData);
+    const range = max - min || 1;
+    const width = 100;
+    const height = 30;
+    const padding = 2;
+
+    return sparklineData
+      .map((val, idx) => {
+        const x = padding + (idx / (sparklineData.length - 1)) * (width - padding * 2);
+        const y = height - padding - ((val - min) / range) * (height - padding * 2);
+        return `${x.toFixed(1)},${y.toFixed(1)}`;
+      })
+      .join(' ');
+  });
+</script>
+
+<div
+  class="lite-kpi-card lite-kpi-card-{alertStatus} {className}"
+  data-svadmin-component="LiteKpiCard"
+  role="region"
+  aria-label={title}
+>
+  <header class="lite-kpi-card-header">
+    <div class="lite-kpi-card-title-group">
+      <h4 class="lite-kpi-card-title">{title}</h4>
+      {#if subtitle}
+        <span class="lite-kpi-card-subtitle">{subtitle}</span>
+      {/if}
+    </div>
+    {#if actions}
+      <div class="lite-kpi-card-actions">{@render actions()}</div>
+    {/if}
+  </header>
+
+  <div class="lite-kpi-card-body">
+    <div class="lite-kpi-card-metric">
+      {#if prefix}<span class="lite-kpi-card-prefix">{prefix}</span>{/if}
+      <span class="lite-kpi-card-value">{formattedValue}</span>
+      {#if suffix}<span class="lite-kpi-card-suffix">{suffix}</span>{/if}
+    </div>
+
+    {#if trendText}
+      <div class="lite-kpi-card-trend lite-kpi-card-trend-{trendDirection}">
+        {#if trendDirection === 'up'}↑{:else if trendDirection === 'down'}↓{/if}
+        <span>{trendText}</span>
+      </div>
+    {/if}
+
+    {#if sparklinePoints}
+      <div class="lite-kpi-card-sparkline">
+        <svg viewBox="0 0 100 30" class="lite-kpi-sparkline-svg" aria-hidden="true">
+          <polyline points={sparklinePoints} fill="none" stroke="currentColor" stroke-width="2" />
+        </svg>
+      </div>
+    {/if}
+  </div>
+
+  {#if targetProgress}
+    <div class="lite-kpi-card-progress">
+      <div class="lite-kpi-progress-label">
+        <span>{targetProgress.label ?? 'Target progress'}</span>
+        <span class="lite-kpi-progress-pct">{progressPercent}%</span>
+      </div>
+      <div class="lite-kpi-progress-track">
+        <div class="lite-kpi-progress-bar" style="width: {progressPercent}%;"></div>
+      </div>
+    </div>
+  {/if}
+
+  {#if alertMessage && alertStatus !== 'normal'}
+    <div class="lite-kpi-card-alert lite-kpi-alert-{alertStatus}" role="alert">
+      <span>{alertMessage}</span>
+    </div>
+  {/if}
+
+  {#if children}
+    <div class="lite-kpi-card-extra">{@render children()}</div>
+  {/if}
+</div>
+
+<style>
+  .lite-kpi-card {
+    border: 1px solid #e5e6eb;
+    border-radius: 8px;
+    padding: 16px;
+    background: #ffffff;
+    box-sizing: border-box;
+  }
+  .lite-kpi-card-warning { border-color: #ffc766; background: #fffdf5; }
+  .lite-kpi-card-danger { border-color: #ffd8d2; background: #fff7f6; }
+  .lite-kpi-card-header { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 8px; }
+  .lite-kpi-card-title { margin: 0; font-size: 13px; font-weight: 600; color: #4e5969; }
+  .lite-kpi-card-subtitle { font-size: 11px; color: #86909c; display: block; margin-top: 2px; }
+  .lite-kpi-card-body { display: flex; align-items: baseline; flex-wrap: wrap; margin-bottom: 8px; }
+  .lite-kpi-card-body > * + * { margin-left: 8px; }
+  .lite-kpi-card-metric { font-family: monospace; font-size: 24px; font-weight: 700; color: #1d2129; }
+  .lite-kpi-card-prefix, .lite-kpi-card-suffix { font-size: 13px; font-weight: 400; color: #86909c; margin: 0 2px; }
+  .lite-kpi-card-trend { font-size: 11px; font-weight: 600; padding: 2px 6px; border-radius: 4px; display: inline-flex; align-items: center; }
+  .lite-kpi-card-trend > * + * { margin-left: 2px; }
+  .lite-kpi-card-trend-up { color: #00b42a; background: #e8ffea; }
+  .lite-kpi-card-trend-down { color: #f53f3f; background: #ffece8; }
+  .lite-kpi-card-trend-neutral { color: #4e5969; background: #f2f3f5; }
+  .lite-kpi-card-sparkline { margin-left: auto; width: 80px; height: 24px; color: #165dff; }
+  .lite-kpi-sparkline-svg { width: 100%; height: 100%; display: block; }
+  .lite-kpi-card-progress { margin-top: 8px; }
+  .lite-kpi-progress-label { display: flex; justify-content: space-between; font-size: 11px; color: #86909c; margin-bottom: 4px; }
+  .lite-kpi-progress-track { height: 4px; background: #f2f3f5; border-radius: 2px; overflow: hidden; }
+  .lite-kpi-progress-bar { height: 100%; background: #165dff; border-radius: 2px; }
+  .lite-kpi-card-alert { margin-top: 10px; padding: 6px 10px; border-radius: 4px; font-size: 12px; }
+  .lite-kpi-alert-warning { background: #fff7e8; color: #d46b08; border: 1px solid #ffd591; }
+  .lite-kpi-alert-danger { background: #fff1f0; color: #cf1322; border: 1px solid #ffa39e; }
+  .lite-kpi-card-extra { margin-top: 10px; border-top: 1px solid #f2f3f5; padding-top: 8px; }
+</style>

package/dist/components/LiteKpiCard.svelte.d.ts

@@ -0,0 +1,25 @@
+import type { Snippet } from 'svelte';
+interface TargetProgress {
+    current: number;
+    target: number;
+    label?: string;
+}
+interface Props {
+    title: string;
+    value: number | string;
+    prefix?: string;
+    suffix?: string;
+    subtitle?: string;
+    trendText?: string;
+    trendDirection?: 'up' | 'down' | 'neutral';
+    targetProgress?: TargetProgress;
+    sparklineData?: number[];
+    alertStatus?: 'normal' | 'warning' | 'danger';
+    alertMessage?: string;
+    class?: string;
+    actions?: Snippet;
+    children?: Snippet;
+}
+declare const LiteKpiCard: import("svelte").Component<Props, {}, "">;
+type LiteKpiCard = ReturnType<typeof LiteKpiCard>;
+export default LiteKpiCard;

package/dist/components/LiteResultPage.svelte

@@ -0,0 +1,135 @@
+<script lang="ts">
+  import type { Snippet } from 'svelte';
+
+  type ResultStatus = 'success' | 'processing' | 'warning' | 'error' | '403' | '404' | '500';
+
+  interface Props {
+    status?: ResultStatus;
+    title: string;
+    description?: string;
+    primaryActionHref?: string;
+    primaryActionLabel?: string;
+    secondaryActionHref?: string;
+    secondaryActionLabel?: string;
+    class?: string;
+    actions?: Snippet;
+    children?: Snippet;
+  }
+
+  let {
+    status = 'success',
+    title,
+    description,
+    primaryActionHref,
+    primaryActionLabel = 'Back to Home',
+    secondaryActionHref,
+    secondaryActionLabel,
+    class: className = '',
+    actions,
+    children,
+  }: Props = $props();
+
+  const iconSymbol = $derived.by(() => {
+    switch (status) {
+      case 'success':
+        return '✓';
+      case 'processing':
+        return '⏳';
+      case 'warning':
+      case '403':
+        return '!';
+      case 'error':
+      case '500':
+        return '✕';
+      case '404':
+      default:
+        return '?';
+    }
+  });
+</script>
+
+<div
+  class="lite-result-page lite-result-{status} {className}"
+  data-svadmin-component="LiteResultPage"
+  role="status"
+>
+  <div class="lite-result-icon-wrapper" aria-hidden="true">
+    <span class="lite-result-icon">{iconSymbol}</span>
+  </div>
+
+  <h2 class="lite-result-title">{title}</h2>
+
+  {#if description}
+    <p class="lite-result-description">{description}</p>
+  {/if}
+
+  {#if actions}
+    <div class="lite-result-actions">{@render actions()}</div>
+  {:else if primaryActionHref || secondaryActionHref}
+    <div class="lite-result-actions">
+      {#if primaryActionHref}
+        <a href={primaryActionHref} class="lite-result-btn-primary">{primaryActionLabel}</a>
+      {/if}
+      {#if secondaryActionHref && secondaryActionLabel}
+        <a href={secondaryActionHref} class="lite-result-btn-secondary">{secondaryActionLabel}</a>
+      {/if}
+    </div>
+  {/if}
+
+  {#if children}
+    <div class="lite-result-extra">{@render children()}</div>
+  {/if}
+</div>
+
+<style>
+  .lite-result-page {
+    text-align: center;
+    padding: 48px 24px;
+    background: #ffffff;
+    border-radius: 8px;
+    border: 1px solid #e5e6eb;
+    box-sizing: border-box;
+  }
+  .lite-result-icon-wrapper {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    width: 64px;
+    height: 64px;
+    border-radius: 50%;
+    margin-bottom: 16px;
+    font-size: 28px;
+    font-weight: 700;
+  }
+  .lite-result-success .lite-result-icon-wrapper { background: #e8ffea; color: #00b42a; }
+  .lite-result-processing .lite-result-icon-wrapper { background: #e8f3ff; color: #165dff; }
+  .lite-result-warning .lite-result-icon-wrapper { background: #fff7e8; color: #ff7d00; }
+  .lite-result-error .lite-result-icon-wrapper { background: #ffece8; color: #f53f3f; }
+  .lite-result-403 .lite-result-icon-wrapper { background: #fff7e8; color: #ff7d00; }
+  .lite-result-404 .lite-result-icon-wrapper { background: #f2f3f5; color: #86909c; }
+  .lite-result-500 .lite-result-icon-wrapper { background: #ffece8; color: #f53f3f; }
+  .lite-result-title { margin: 0 0 8px; font-size: 20px; font-weight: 600; color: #1d2129; }
+  .lite-result-description { margin: 0 0 24px; font-size: 14px; color: #4e5969; max-width: 480px; margin-left: auto; margin-right: auto; }
+  .lite-result-actions { display: flex; justify-content: center; }
+  .lite-result-actions > * + * { margin-left: 12px; }
+  .lite-result-btn-primary {
+    display: inline-block;
+    padding: 8px 18px;
+    background: #165dff;
+    color: #ffffff;
+    border-radius: 4px;
+    text-decoration: none;
+    font-size: 13px;
+    font-weight: 500;
+  }
+  .lite-result-btn-secondary {
+    display: inline-block;
+    padding: 8px 18px;
+    background: #f2f3f5;
+    color: #4e5969;
+    border-radius: 4px;
+    text-decoration: none;
+    font-size: 13px;
+  }
+  .lite-result-extra { margin-top: 24px; padding-top: 16px; border-top: 1px solid #f2f3f5; }
+</style>

package/dist/components/LiteResultPage.svelte.d.ts

@@ -0,0 +1,17 @@
+import type { Snippet } from 'svelte';
+type ResultStatus = 'success' | 'processing' | 'warning' | 'error' | '403' | '404' | '500';
+interface Props {
+    status?: ResultStatus;
+    title: string;
+    description?: string;
+    primaryActionHref?: string;
+    primaryActionLabel?: string;
+    secondaryActionHref?: string;
+    secondaryActionLabel?: string;
+    class?: string;
+    actions?: Snippet;
+    children?: Snippet;
+}
+declare const LiteResultPage: import("svelte").Component<Props, {}, "">;
+type LiteResultPage = ReturnType<typeof LiteResultPage>;
+export default LiteResultPage;

package/dist/components/LiteSensitiveDataMask.svelte

@@ -1,8 +1,17 @@
 <script lang="ts">
   interface Props {
     value?: string | number | null;
-    type?: 'phone' | 'id-card' | 'email' | 'bank-card' | 'secret' | 'custom';
-    /** Caller class merged with the built-in class list. */
+    type?:
+      | 'phone'
+      | 'mobile'
+      | 'id-card'
+      | 'idCard'
+      | 'email'
+      | 'bank-card'
+      | 'bankCard'
+      | 'name'
+      | 'secret'
+      | 'custom';
     class?: string;
   }
 
@@ -14,13 +23,36 @@
 
   const rawString = $derived(String(value ?? ''));
 
+  function maskName(val: string): string {
+    const trimmed = val.trim();
+    if (!trimmed) return '—';
+    if (trimmed.includes(' ')) {
+      return trimmed
+        .split(/\s+/)
+        .map((part) => (part.length <= 1 ? '*' : `${part[0]}${'*'.repeat(Math.max(1, part.length - 2))}${part.length > 2 ? part.slice(-1) : '*'}`))
+        .join(' ');
+    }
+    const len = trimmed.length;
+    if (len <= 1) return '*';
+    if (len === 2) return `${trimmed[0]}*`;
+    if (len === 3) return `${trimmed[0]}*${trimmed[2]}`;
+    return `${trimmed[0]}${'*'.repeat(len - 2)}${trimmed.slice(-1)}`;
+  }
+
   function mask(val: string, maskType: string): string {
     if (!val) return '—';
     switch (maskType) {
       case 'phone':
+      case 'mobile':
         return val.length >= 7 ? `${val.slice(0, 3)}****${val.slice(-4)}` : '****';
       case 'id-card':
+      case 'idCard':
         return val.length >= 10 ? `${val.slice(0, 6)}********${val.slice(-4)}` : '********';
+      case 'bank-card':
+      case 'bankCard':
+        return val.length >= 8 ? `${val.slice(0, 4)} **** **** ${val.slice(-4)}` : '**** ****';
+      case 'name':
+        return maskName(val);
       case 'email': {
         const parts = val.split('@');
         const [name, domain] = parts;

package/dist/components/LiteSensitiveDataMask.svelte.d.ts

@@ -1,7 +1,6 @@
 interface Props {
     value?: string | number | null;
-    type?: 'phone' | 'id-card' | 'email' | 'bank-card' | 'secret' | 'custom';
-    /** Caller class merged with the built-in class list. */
+    type?: 'phone' | 'mobile' | 'id-card' | 'idCard' | 'email' | 'bank-card' | 'bankCard' | 'name' | 'secret' | 'custom';
     class?: string;
 }
 declare const LiteSensitiveDataMask: import("svelte").Component<Props, {}, "">;

package/dist/components/LiteStepWizard.svelte

@@ -0,0 +1,98 @@
+<script lang="ts">
+  import type { Snippet } from 'svelte';
+
+  export interface LiteStepItem {
+    id: string;
+    title: string;
+    description?: string;
+  }
+
+  interface Props {
+    steps: LiteStepItem[];
+    currentStep?: number;
+    action?: string;
+    class?: string;
+    children?: Snippet;
+  }
+
+  let {
+    steps = [],
+    currentStep = 0,
+    action,
+    class: className = '',
+    children,
+  }: Props = $props();
+</script>
+
+<div
+  class="lite-step-wizard {className}"
+  data-svadmin-component="LiteStepWizard"
+  data-current-step={currentStep}
+>
+  <nav class="lite-steps-nav" aria-label="Wizard Steps">
+    <ol class="lite-steps-list">
+      {#each steps as step, idx (step.id)}
+        {@const isDone = idx < currentStep}
+        {@const isCurrent = idx === currentStep}
+        <li
+          class="lite-step-item"
+          class:lite-step-done={isDone}
+          class:lite-step-active={isCurrent}
+        >
+          <span class="lite-step-badge">
+            {#if isDone}✓{:else}{idx + 1}{/if}
+          </span>
+          <span class="lite-step-info">
+            <span class="lite-step-title">{step.title}</span>
+            {#if step.description}
+              <span class="lite-step-desc">{step.description}</span>
+            {/if}
+          </span>
+          {#if idx < steps.length - 1}
+            <span class="lite-step-divider" aria-hidden="true"></span>
+          {/if}
+        </li>
+      {/each}
+    </ol>
+  </nav>
+
+  <div class="lite-step-body">
+    {#if children}{@render children()}{/if}
+  </div>
+
+  {#if action}
+    <form {action} method="POST" class="lite-step-actions">
+      <input type="hidden" name="currentStep" value={currentStep} />
+      {#if currentStep > 0}
+        <button type="submit" name="direction" value="prev" class="lite-btn-secondary">上一步</button>
+      {/if}
+      <button type="submit" name="direction" value="next" class="lite-btn-primary">
+        {currentStep >= steps.length - 1 ? '提交完成' : '下一步'}
+      </button>
+    </form>
+  {/if}
+</div>
+
+<style>
+  .lite-step-wizard { border: 1px solid #e5e6eb; border-radius: 8px; background: #ffffff; padding: 20px; }
+  .lite-steps-nav { margin-bottom: 24px; border-bottom: 1px solid #f2f3f5; padding-bottom: 16px; }
+  .lite-steps-list { display: flex; align-items: center; list-style: none; margin: 0; padding: 0; }
+  .lite-step-item { display: flex; align-items: center; flex: 1; }
+  .lite-step-item > * + * { margin-left: 8px; }
+  .lite-step-badge {
+    width: 28px; height: 28px; border-radius: 50%; display: flex; align-items: center;
+    justify-content: center; font-size: 12px; font-weight: 700; background: #f2f3f5; color: #4e5969;
+  }
+  .lite-step-done .lite-step-badge { background: #00b42a; color: #fff; }
+  .lite-step-active .lite-step-badge { background: #165dff; color: #fff; }
+  .lite-step-info { display: flex; flex-direction: column; }
+  .lite-step-title { font-size: 13px; font-weight: 600; color: #1d2129; }
+  .lite-step-desc { font-size: 11px; color: #86909c; }
+  .lite-step-divider { flex: 1; height: 1px; background: #e5e6eb; margin: 0 12px; }
+  .lite-step-done .lite-step-divider { background: #00b42a; }
+  .lite-step-body { min-height: 120px; }
+  .lite-step-actions { display: flex; justify-content: flex-end; margin-top: 20px; border-top: 1px solid #f2f3f5; padding-top: 16px; }
+  .lite-step-actions > * + * { margin-left: 12px; }
+  .lite-btn-primary { padding: 6px 16px; background: #165dff; color: #fff; border: none; border-radius: 4px; font-size: 12px; cursor: pointer; }
+  .lite-btn-secondary { padding: 6px 16px; background: #f2f3f5; color: #4e5969; border: 1px solid #e5e6eb; border-radius: 4px; font-size: 12px; cursor: pointer; }
+</style>

package/dist/components/LiteStepWizard.svelte.d.ts

@@ -0,0 +1,16 @@
+import type { Snippet } from 'svelte';
+export interface LiteStepItem {
+    id: string;
+    title: string;
+    description?: string;
+}
+interface Props {
+    steps: LiteStepItem[];
+    currentStep?: number;
+    action?: string;
+    class?: string;
+    children?: Snippet;
+}
+declare const LiteStepWizard: import("svelte").Component<Props, {}, "">;
+type LiteStepWizard = ReturnType<typeof LiteStepWizard>;
+export default LiteStepWizard;

package/dist/components/LiteTextDiffViewer.svelte

@@ -0,0 +1,111 @@
+<script lang="ts">
+  interface Props {
+    oldText?: string;
+    newText?: string;
+    oldTitle?: string;
+    newTitle?: string;
+    class?: string;
+  }
+
+  let {
+    oldText = '',
+    newText = '',
+    oldTitle = 'Baseline',
+    newTitle = 'Current',
+    class: className = '',
+  }: Props = $props();
+
+  interface DiffEntry {
+    type: 'same' | 'add' | 'del';
+    lineNo: number;
+    text: string;
+  }
+
+  const diffEntries = $derived.by<DiffEntry[]>(() => {
+    const oldLines = oldText.split(/\r?\n/u);
+    const newLines = newText.split(/\r?\n/u);
+    const result: DiffEntry[] = [];
+
+    let lineCounter = 1;
+    let i = 0;
+    let j = 0;
+
+    while (i < oldLines.length && j < newLines.length) {
+      if (oldLines[i] === newLines[j]) {
+        result.push({ type: 'same', lineNo: lineCounter++, text: oldLines[i] ?? '' });
+        i++;
+        j++;
+      } else {
+        result.push({ type: 'del', lineNo: lineCounter++, text: oldLines[i] ?? '' });
+        result.push({ type: 'add', lineNo: lineCounter++, text: newLines[j] ?? '' });
+        i++;
+        j++;
+      }
+    }
+    while (i < oldLines.length) {
+      result.push({ type: 'del', lineNo: lineCounter++, text: oldLines[i] ?? '' });
+      i++;
+    }
+    while (j < newLines.length) {
+      result.push({ type: 'add', lineNo: lineCounter++, text: newLines[j] ?? '' });
+      j++;
+    }
+
+    return result;
+  });
+</script>
+
+<div
+  class="lite-text-diff {className}"
+  data-svadmin-component="LiteTextDiffViewer"
+  role="region"
+  aria-label="Text Diff"
+>
+  <header class="lite-diff-header">
+    <span class="lite-diff-title">{oldTitle} ↔ {newTitle}</span>
+  </header>
+
+  <div class="lite-diff-body">
+    <table class="lite-diff-table">
+      <tbody>
+        {#each diffEntries as entry (entry.lineNo)}
+          <tr class="lite-diff-row lite-diff-{entry.type}">
+            <td class="lite-diff-line-no">{entry.lineNo}</td>
+            <td class="lite-diff-sign">
+              {#if entry.type === 'add'}+{/if}
+              {#if entry.type === 'del'}-{/if}
+            </td>
+            <td class="lite-diff-content">{entry.text}</td>
+          </tr>
+        {/each}
+      </tbody>
+    </table>
+  </div>
+</div>
+
+<style>
+  .lite-text-diff {
+    border: 1px solid #e5e6eb;
+    border-radius: 6px;
+    background: #ffffff;
+    font-family: monospace;
+    font-size: 12px;
+    overflow: hidden;
+  }
+  .lite-diff-header {
+    padding: 8px 12px;
+    background: #f7f8fa;
+    border-bottom: 1px solid #e5e6eb;
+    font-weight: 600;
+    color: #4e5969;
+  }
+  .lite-diff-body { max-height: 400px; overflow: auto; }
+  .lite-diff-table { width: 100%; border-collapse: collapse; }
+  .lite-diff-row td { padding: 2px 6px; }
+  .lite-diff-line-no { width: 40px; text-align: right; color: #86909c; user-select: none; border-right: 1px solid #f2f3f5; }
+  .lite-diff-sign { width: 20px; text-align: center; font-weight: 700; user-select: none; }
+  .lite-diff-content { white-space: pre-wrap; word-break: break-all; }
+  .lite-diff-add { background: #e8ffea; color: #00b42a; }
+  .lite-diff-del { background: #ffece8; color: #f53f3f; }
+  .lite-diff-same { color: #1d2129; }
+</style>

package/dist/components/LiteTextDiffViewer.svelte.d.ts

@@ -0,0 +1,10 @@
+interface Props {
+    oldText?: string;
+    newText?: string;
+    oldTitle?: string;
+    newTitle?: string;
+    class?: string;
+}
+declare const LiteTextDiffViewer: import("svelte").Component<Props, {}, "">;
+type LiteTextDiffViewer = ReturnType<typeof LiteTextDiffViewer>;
+export default LiteTextDiffViewer;