import { Component, h, Host } from '@stencil/core';
const demo1 = `<dvn-radio
  label="Basketball"
  name="sport"
  scale="small"
  tint="danger"
  value="basketball"
></dvn-radio>
<dvn-radio
  label="Football"
  name="sport"
  scale="small"
  tint="danger"
  value="football"
></dvn-radio>`;
const demo2 = `<dvn-radio
  label="How I met your mother?"
  name="tv-show"
  value="himym"
></dvn-radio>
<dvn-radio
  label="Stranger Things"
  name="tv-show"
  value="stranger-things"
></dvn-radio>`;
const demo3 = `<dvn-radio
  label="Istanbul"
  leaned
  name="city"
  scale="large"
  tint="secondary"
  value="istanbul"
></dvn-radio>
<dvn-radio
  label="London"
  leaned
  name="city"
  scale="large"
  tint="secondary"
  value="london"
></dvn-radio>`;
export class ShowcaseRadio {
  render() {
    return (h(Host, null,
      h("dvn-card", { leaned: true },
        h("div", { class: "d-flex" },
          h("dvn-component-demo", { domString: demo1 }),
          h("dvn-component-demo", { domString: demo2 }),
          h("dvn-component-demo", { domString: demo3 })))));
  }
  static get is() { return "showcase-radio"; }
}
