TextButton

    <Arrange>
      <TextButton icon={<IconHeart />}>Like</TextButton>
      <TextButton icon={<IconPlus />}>Add</TextButton>
      <TextButton icon={<IconShare />}>Share</TextButton>
    </Arrange>
  

    <Arrange gap="s">
      <TextButton icon={<IconArrowLeft />} iconPosition="left">TextButton</TextButton>
      <TextButton icon={<IconArrowRight />} iconPosition="right">TextButton</TextButton>
    </Arrange>
  

    <Arrange>
      <TextButton>Like</TextButton>
      <TextButton>Add</TextButton>
      <TextButton>Share</TextButton>
    </Arrange>
  

    <Arrange>
      <TextButton variant="neutral" icon={<IconFolder />}>Move</TextButton>
      <TextButton variant="danger" icon={<IconTrash />}>Delete</TextButton>
    </Arrange>
  

    <Arrange gap="s">
      <TextButton icon={<IconArrowLeft />} iconPosition="left" isDisabled>TextButton</TextButton>
      <TextButton icon={<IconArrowRight />} iconPosition="right">TextButton</TextButton>
    </Arrange>
  

    <Stack
      gap="m"
      borderSide="x"
      borderWidth="1px"
      borderColor="red"
      maxWidth="50ch"
      paddingY="m"
    >
      <Text>{demoText.l}</Text>
      <Arrange justifyContent="space-between">
        <TextButton trimSide="left" icon={<IconGlobe />}>TextButton</TextButton>
        <TextButton trimSide="right" icon={<IconGlobe />}>TextButton</TextButton>
      </Arrange>
    </Stack>
  

    <TextButton icon={<IconPlus />} onClick={() => alert('Nice')}>Click me</TextButton>
  

    () => {
      const [hasSpinner, setHasSpinner] = React.useState(false)
      return (
        <>
          <TextButton
            icon={<IconDownload />}
            hasSpinner={hasSpinner}
            isDisabled={hasSpinner}
            onClick={() => {
              setHasSpinner(true)
              setTimeout(() => setHasSpinner(false), 2000)
            }}
          >
            Download
          </TextButton>
        </>
      )
    }