aboutsummaryrefslogtreecommitdiff
path: root/src/tools/ipv4-range-expander/result-row.vue
blob: 565fb177eaea1b62e2c471ff37cc021ea2a66fac (plain) (blame)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
<script setup lang="ts">
import _ from 'lodash';
import SpanCopyable from '@/components/SpanCopyable.vue';

const props = withDefaults(defineProps<{ label: string; oldValue?: string; newValue?: string }>(), {
  label: '',
  oldValue: '',
  newValue: '',
});
const { label, oldValue, newValue } = toRefs(props);

const testId = computed(() => _.kebabCase(label.value));
</script>

<template>
  <tr>
    <td font-bold>
      {{ label }}
    </td>
    <td :data-test-id="`${testId}.old`">
      <SpanCopyable :value="oldValue" class="monospace" />
    </td>
    <td :data-test-id="`${testId}.new`">
      <SpanCopyable :value="newValue" />
    </td>
  </tr>
</template>