import { jsxs as a, Fragment as t, jsx as e } from "react/jsx-runtime";
import { H as c, C as r, a as l, T as s, aj as i, P as m, A as o, c as d } from "../index-sdOMz8GW.js";
import { AlertCircle as h } from "lucide-react";
import "react-router-dom";
import "react";
import "react-dom";
const v = () => /* @__PURE__ */ a(t, { children: [
  /* @__PURE__ */ e(
    c,
    {
      title: "Alert",
      description: `An alert component for displaying important messages and notifications
          with different variants and dismissible functionality.`,
      icon: /* @__PURE__ */ e("div", { className: "w-16 h-16 sm:w-20 sm:h-20 md:w-24 md:h-24 bg-linear-to-br from-red-500 to-orange-500 rounded-full flex items-center justify-center shadow-lg", children: /* @__PURE__ */ e(h, { className: "w-8 h-8 sm:w-10 sm:h-10 md:w-12 md:h-12 text-white filter drop-shadow-lg" }) })
    }
  ),
  /* @__PURE__ */ e(r, { className: "overflow-hidden", children: /* @__PURE__ */ e(l, { title: "Basic Examples", className: "mt-2 mb-2", children: /* @__PURE__ */ e("div", { className: "w-full p-4 sm:p-6", children: /* @__PURE__ */ a("div", { className: "space-y-4", children: [
    /* @__PURE__ */ a(r, { className: "p-4", children: [
      /* @__PURE__ */ e(s, { tag: "h5", className: "mb-3", children: "Info Alert" }),
      /* @__PURE__ */ e(i, { variant: "info", children: /* @__PURE__ */ e(s, { tag: "p", children: "This is an informational message." }) })
    ] }),
    /* @__PURE__ */ a(r, { className: "p-4", children: [
      /* @__PURE__ */ e(s, { tag: "h5", className: "mb-3", children: "Success Alert" }),
      /* @__PURE__ */ e(i, { variant: "success", children: /* @__PURE__ */ e(s, { tag: "p", children: "Operation completed successfully!" }) })
    ] }),
    /* @__PURE__ */ a(r, { className: "p-4", children: [
      /* @__PURE__ */ e(s, { tag: "h5", className: "mb-3", children: "Warning Alert" }),
      /* @__PURE__ */ e(i, { variant: "warning", children: /* @__PURE__ */ e(s, { tag: "p", children: "Please review this information carefully." }) })
    ] }),
    /* @__PURE__ */ a(r, { className: "p-4", children: [
      /* @__PURE__ */ e(s, { tag: "h5", className: "mb-3", children: "Error Alert" }),
      /* @__PURE__ */ e(i, { variant: "error", children: /* @__PURE__ */ e(s, { tag: "p", children: "An error occurred. Please try again." }) })
    ] })
  ] }) }) }) }),
  /* @__PURE__ */ e(r, { className: "overflow-hidden", children: /* @__PURE__ */ e(l, { title: "Variants", className: "mt-2 mb-2", children: /* @__PURE__ */ e("div", { className: "w-full p-4 sm:p-6", children: /* @__PURE__ */ a("div", { className: "space-y-4", children: [
    /* @__PURE__ */ a(r, { className: "p-4", children: [
      /* @__PURE__ */ e(s, { tag: "h5", className: "mb-3", children: "Dismissible Alert" }),
      /* @__PURE__ */ e(i, { variant: "info", dismissible: !0, children: /* @__PURE__ */ e(s, { tag: "p", children: "This alert can be dismissed." }) })
    ] }),
    /* @__PURE__ */ a(r, { className: "p-4", children: [
      /* @__PURE__ */ e(s, { tag: "h5", className: "mb-3", children: "With Custom onDismiss" }),
      /* @__PURE__ */ e(
        i,
        {
          variant: "success",
          onDismiss: () => console.log("Alert dismissed"),
          children: /* @__PURE__ */ e(s, { tag: "p", children: "This alert has a custom dismiss handler." })
        }
      )
    ] })
  ] }) }) }) }),
  /* @__PURE__ */ e(
    m,
    {
      componentName: "Alert",
      defaultValues: { variant: "info", dismissible: !0 },
      excludeProps: ["onDismiss", "aria-label"],
      children: (n) => /* @__PURE__ */ e(i, { ...n, children: "This is an alert message for the playground preview." })
    }
  ),
  /* @__PURE__ */ e(o, { componentName: "Alert" }),
  /* @__PURE__ */ e(r, { className: "overflow-hidden", children: /* @__PURE__ */ e(l, { title: "Code Example", className: "mt-2 mb-2", children: /* @__PURE__ */ e("div", { className: "w-full p-4 sm:p-6", children: /* @__PURE__ */ e(
    d,
    {
      language: "tsx",
      code: `import { Alert, Typography } from '@e-burgos/tucu-ui';

// Basic usage
<Alert variant="info">
  <Typography tag="p">This is an informational message.</Typography>
</Alert>

// Different variants
<Alert variant="info">Info message</Alert>
<Alert variant="success">Success message</Alert>
<Alert variant="warning">Warning message</Alert>
<Alert variant="error">Error message</Alert>

// Non-dismissible
<Alert variant="info" dismissible={false}>
  <Typography tag="p">Cannot be dismissed</Typography>
</Alert>

// With custom dismiss handler
<Alert
  variant="success"
  onDismiss={() => handleDismiss()}
>
  <Typography tag="p">Custom dismiss handler</Typography>
</Alert>`
    }
  ) }) }) })
] });
export {
  v as default
};
