Change Content

"use client";

import { Shine } from "@hazya/shinejs/react";
import { useState } from "react";

export function ContentSwap() {
  const [content, setContent] = useState("Change Text Demo");

  return (
    <>
      <button onClick={() => setContent("Change Text Demo")}>Change Text Demo</button>
      <button onClick={() => setContent("Hello World")}>Hello World</button>
      <button onClick={() => setContent("Lorem Ipsum")}>Lorem Ipsum</button>
      <Shine as="h1">{content}</Shine>
    </>
  );
}

"use client";

import { useRef } from "react";
import { useShine } from "@hazya/shinejs/react";

export function ContentSwap() {
  const ref = useRef<HTMLHeadingElement>(null);
  const { update } = useShine(ref);

  return (
    <>
      <button onClick={() => update({ content: "Hello World" })}>Hello World</button>
      <h1 ref={ref}>Change Text Demo</h1>
    </>
  );
}