import { h } from "@stencil/core";
export default {
  title: "Components/Form Message",
};
export const SuccessAlert = () => {
  return (h("sqm-form-message", { type: "success" },
    h("p", { part: "alert-title" }, "This is the title"),
    h("p", { part: "alert-description" }, "This is the description")));
};
export const ErrorAlert = () => {
  return (h("sqm-form-message", { type: "error" },
    h("p", { part: "alert-title" }, "This is the title"),
    h("p", { part: "alert-description" }, "This is the description")));
};
export const WarningAlert = () => {
  return (h("sqm-form-message", { type: "warning" },
    h("p", { part: "alert-title" }, "This is the title"),
    h("p", { part: "alert-description" }, "This is the description")));
};
export const InfoAlert = () => {
  return (h("sqm-form-message", { type: "info" },
    h("p", { part: "alert-title" }, "This is the title"),
    h("p", { part: "alert-description" }, "This is the description")));
};
export const SuccessAlertTransparent = () => {
  return (h("sqm-form-message", { type: "success", transparent: true },
    h("p", { part: "alert-title" }, "This is the title"),
    h("p", { part: "alert-description" }, "This is the description")));
};
export const ErrorAlertTransparent = () => (h("sqm-form-message", { type: "error", transparent: true },
  h("p", { part: "alert-title" }, "This is the title"),
  h("p", { part: "alert-description" }, "This is the description")));
export const WarningAlertTransparent = () => (h("sqm-form-message", { type: "warning", transparent: true },
  h("p", { part: "alert-title" }, "This is the title"),
  h("p", { part: "alert-description" }, "This is the description")));
export const InfoAlertTransparent = () => (h("sqm-form-message", { type: "info", transparent: true },
  h("p", { part: "alert-title" }, "This is the title"),
  h("p", { part: "alert-description" }, "This is the description")));
export const Loading = () => {
  return (h("sqm-form-message", { type: "success", loading: true },
    h("p", { part: "alert-title" }, "This is the title"),
    h("p", { part: "alert-description" }, "This is the description")));
};
