How to use the slate-react.useSelected function in slate-react

To help you get started, we’ve selected a few slate-react examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github ianstormtaylor / slate / site / examples / embeds.js View on Github external
const VideoElement = ({ attributes, children, element }) => {
  const editor = useEditor()
  const selected = useSelected()
  const focused = useFocused()
  const { url } = element
  return (
    <div>
      <div selected="" style="{{">
        </div></div>
github ianstormtaylor / slate / site / examples / images.js View on Github external
const ImageElement = ({ attributes, children, element }) =&gt; {
  const selected = useSelected()
  const focused = useFocused()
  return (
    <div>
      <div>
        <img src="{element.url}">
      </div>
      {children}
    </div>
github ianstormtaylor / slate / site / examples / paste-html.js View on Github external
const ImageElement = ({ attributes, children, element }) =&gt; {
  const selected = useSelected()
  const focused = useFocused()
  return (
    <div>
      {children}
      <img src="{element.url}">
    </div>
  )
}
github ianstormtaylor / slate / site / examples / mentions.js View on Github external
const MentionElement = ({ attributes, children, element }) =&gt; {
  const selected = useSelected()
  const focused = useFocused()
  return (
    <span selected="" style="{{"></span>
github redwood / redwood / demos / desktop-chat-app / frontend / src / components / TextBox / Mention.jsx View on Github external
function Mention({ attributes, children, element, style = {}, absolute, preview }) {
  const selected = useSelected()
  const focused = useFocused()
  const [hoverRef, isHovered] = useHover()
  const user = element.selectedUser

  let displayText = user.address.slice(0, 7)

  if (user.username) {
    displayText = user.username
  }

  if (preview) {
    return `@${displayText}`
  }

  return (