Link

The Link control provides your component a LinkValue. You can use the LinkValue to create a component that: links to another Makeswift page, opens a URL, or scrolls to another element.

AnchorExamples

AnchorA simple anchor tag

In this example we register an anchor tag <a> with its href, target, and onClick props controlled by a Link control.

import { ReactRuntime } from '@makeswift/runtime/react'
import { Link } from '@makeswift/runtime/controls'

function Link({ link }) {
  const { href, target, onClick } = link ?? { href: '#' }

  return (
    <a href={href} target={target} onClick={onClick}>
      Click me!
    </a>
  )
}

ReactRuntime.registerComponent(Link, {
  type: 'link',
  label: 'Link',
  props: {
    link: Link(),
  },
})

AnchorAPI

AnchorParameters

AnchorProvided value

The Link control provides a LinkValue, or undefined if there's no value set.

AnchorTypes

type LinkValue = {
  href: string
  target: '_blank' | '_self' | undefined
  onClick(event: MouseEvent<HTMLElement>): void
}