synapse-react-client/dist/stories/ToastDemo.js

[](https://badge.fury.io/js/synapse-react-client) [](https://github.com/prettier/prettie

import { jsxs as d, jsx as e } from "react/jsx-runtime";
import { displayToast as T } from "../components/ToastMessage/ToastMessage.js";
import { Typography as y, RadioGroup as B, FormControlLabel as a, Radio as l, TextField as o, Button as k } from "@mui/material";
import { useState as n } from "react";
const M = () => {
  const [s, v] = n("info"), [u, f] = n(""), [c, h] = n(""), [g, p] = n(0), [r, C] = n(""), [i, b] = n("");
  function x() {
    T(c, s, {
      title: u,
      autoCloseInMs: g,
      primaryButtonConfig: r === "" ? void 0 : {
        text: r,
        onClick: () => {
          console.log("Primary button clicked!");
        }
      },
      secondaryButtonConfig: i === "" ? void 0 : {
        text: i,
        href: "#"
      }
    });
  }
  return /* @__PURE__ */ d("div", { children: [
    /* @__PURE__ */ e(y, { component: "label", variant: "smallText2", children: "Alert Variant" }),
    /* @__PURE__ */ d(
      B,
      {
        value: s,
        onChange: (t, m) => v(m),
        children: [
          /* @__PURE__ */ e(a, { control: /* @__PURE__ */ e(l, {}), label: "Info", value: "info" }),
          /* @__PURE__ */ e(
            a,
            {
              control: /* @__PURE__ */ e(l, {}),
              label: "Success",
              value: "success"
            }
          ),
          /* @__PURE__ */ e(
            a,
            {
              control: /* @__PURE__ */ e(l, {}),
              label: "Warning",
              value: "warning"
            }
          ),
          /* @__PURE__ */ e(
            a,
            {
              control: /* @__PURE__ */ e(l, {}),
              label: "Danger",
              value: "danger"
            }
          )
        ]
      }
    ),
    /* @__PURE__ */ e(
      o,
      {
        fullWidth: !0,
        margin: "dense",
        label: "Message",
        value: c,
        onChange: (t) => h(t.target.value)
      }
    ),
    /* @__PURE__ */ e(
      o,
      {
        fullWidth: !0,
        margin: "dense",
        label: "Title",
        value: u,
        onChange: (t) => f(t.target.value)
      }
    ),
    /* @__PURE__ */ e(
      o,
      {
        fullWidth: !0,
        margin: "dense",
        label: "Auto-close (ms)",
        type: "number",
        value: g,
        onChange: (t) => p(Number.parseInt(t.target.value))
      }
    ),
    /* @__PURE__ */ e(
      o,
      {
        fullWidth: !0,
        margin: "dense",
        label: "Optional Button Text",
        value: r,
        onChange: (t) => C(t.target.value)
      }
    ),
    /* @__PURE__ */ e(
      o,
      {
        fullWidth: !0,
        margin: "dense",
        label: "Optional Link Text",
        value: i,
        onChange: (t) => b(t.target.value)
      }
    ),
    /* @__PURE__ */ e(
      k,
      {
        variant: "contained",
        color: "primary",
        onClick: x,
        sx: { mt: 2 },
        children: "Push toast message"
      }
    )
  ] });
};
export {
  M as ToastDemo
};
//# sourceMappingURL=ToastDemo.js.map