_ThreeLine.svelte

<div>
  <List threeLine nonInteractive>
    <Item>
      <Text>
        <PrimaryText>FruitPhone Pro</PrimaryText>
        <SecondaryText>$1,000</SecondaryText>
        <SecondaryText>A beautiful phone with good specs.</SecondaryText>
      </Text>
    </Item>
    <Item>
      <Text>
        <PrimaryText>Robot Phone Max</PrimaryText>
        <SecondaryText>$700</SecondaryText>
        <SecondaryText
          title="Pretty much the same phone, but a different brand name and OS. It spies on you more, too."
          >Pretty much the same phone, but a different brand name and OS. It
          spies on you more, too.</SecondaryText
        >
      </Text>
    </Item>
    <Item>
      <Text>
        <PrimaryText>Penguin Phone</PrimaryText>
        <SecondaryText>$220</SecondaryText>
        <SecondaryText
          title="A very weak phone that you can install literally anything on. Compile your own kernel, you nerd. :D"
          >A very weak phone that you can install literally anything on. Compile
          your own kernel, you nerd. :D</SecondaryText
        >
      </Text>
    </Item>
  </List>
</div>

<script lang="ts">
  import List, { Item, Text, PrimaryText, SecondaryText } from '@smui/list';
</script>