src/components/DetailsOneRow.svelte

   1 <script>
   2   import DetailsLink from '../components/DetailsLink.svelte';
   3   import PageLink from '../components/PageLink.svelte';
   4   import {
   5     formatPlaceType, osmLink, formatAdminLevel, formatDistance
   6   } from '../lib/helpers.js';
   7
   8   let {
   9     addressLine,
  10     bDistanceInMeters,
  11     bMarkUnusedLines = false,
  12     sCountryCode
  13   } = $props();
  14
  15   const bAddressLineUsed = $derived(addressLine.isaddress);
  16   const reverse_only = $derived(Nominatim_Config.Reverse_Only);
  17 </script>
  18
  19 <tr class:notused={bMarkUnusedLines && !bAddressLineUsed}>
  20   <td class="name fw-bold">
  21     {#if addressLine.localname}
  22       {addressLine.localname}
  23     {:else}
  24       <span class="noname">No Name</span>
  25     {/if}
  26   </td>
  27   <td>{formatPlaceType(addressLine)}</td>
  28   <!-- eslint-disable-next-line svelte/no-at-html-tags -->
  29   <td>{@html osmLink(addressLine)}</td>
  30   <td>{addressLine.rank_address}</td>
  31   <td>{formatAdminLevel(addressLine.admin_level)}</td>
  32   <!-- eslint-disable-next-line svelte/no-at-html-tags -->
  33   <td>{@html formatDistance(addressLine.distance, bDistanceInMeters)}</td>
  34   <td>
  35     {#if addressLine.osm_id}
  36       <DetailsLink feature={addressLine} />
  37     {:else if !reverse_only && addressLine.type.match(/^country/)}
  38       <PageLink page='search'
  39                 text='search by name'
  40                 params_hash={{ country: addressLine.localname }} />
  41     {:else if !reverse_only && addressLine.type === 'postcode'}
  42       <PageLink page='search'
  43                 text='search by name'
  44                 params_hash={{ postalcode: addressLine.localname, country: sCountryCode }} />
  45     {/if}
  46   </td>
  47 </tr>
  48
  49 <style>
  50   .notused td {
  51     color: var(--bs-secondary-color);
  52     font-style: italic;
  53   }
  54
  55   td {
  56     padding: 2px 8px;
  57     font-size: 0.9em;
  58   }
  59 </style>