import { h } from "@stencil/core";
import { LeaderboardRankView } from "./sqm-leaderboard-rank-view";
import scenario from "./leaderboard-rank.feature";
export default {
  title: "Components/Leaderboard Rank",
  parameters: {
    scenario,
  },
};
export const First = () => {
  const props = { data: { rank: "1st" } };
  return (h("p", null,
    "Your rank is ",
    h(LeaderboardRankView, Object.assign({}, props)),
    " on the leaderboard"));
};
export const Second = () => {
  const props = { data: { rank: "2nd" } };
  return (h("p", null,
    "Your rank is ",
    h(LeaderboardRankView, Object.assign({}, props)),
    " on the leaderboard"));
};
export const Unranked = () => {
  const props = { data: { rank: "unranked" } };
  return (h("p", null,
    "You are currently ",
    h(LeaderboardRankView, Object.assign({}, props)),
    ", refer a friend!"));
};
