import { a8 as W, ao as c, A as x, j as e, z as y, t as K, l as p, d as h, P as I, _ as T, ad as M, ap as P, $ as r, aq as f, B as H, ar as d, u as $, v as ee, N as l, as as Q, at as te, x as q, F as k, au as D, H as R, q as O, av as oe, M as B, g as ne, U as se, i as _, G as Y, J as ae, Q as ie, W as J, w as re } from "./styles.css-RZgqP4wo.mjs";
import { useState as E, useEffect as le } from "react";
const V = `\`\`\`javascript
<script type="text/javascript">
  (function(d, t) {
      var v = d.createElement(t), s = d.getElementsByTagName(t)[0];
      v.onload = function() {
        window.voiceflow.chat.load({
          verify: { projectID: 'howdy folks, very cool verification hash here' },
          url: 'https://general-runtime.voiceflow.com',
          versionID: 'production'
        });
      }
      v.src = "https://cdn.voiceflow.com/widget/bundle.mjs"; v.type = "text/javascript"; s.parentNode.insertBefore(v, s);
  })(document, 'script');
<\/script>
\`\`\`
`, ce = `# Code and Syntax Highlighting

\`\`\`javascript
<script type="text/javascript">
  (function(d, t) {
      var v = d.createElement(t), s = d.getElementsByTagName(t)[0];
      v.onload = function() {
        window.voiceflow.chat.load({
          verify: { projectID: 'howdy folks, very cool verification hash here' },
          url: 'https://general-runtime.voiceflow.com',
          versionID: 'production'
        });
      }
      v.src = "https://cdn.voiceflow.com/widget/bundle.mjs"; v.type = "text/javascript"; s.parentNode.insertBefore(v, s);
  })(document, 'script');
<\/script>
\`\`\`

\`\`\`css
@font-face {
  font-family: Chunkfive;
  src: url('Chunkfive.otf');
}

body,
.usertext {
  color: #f0f0f0;
  background: #600;
  font-family: Chunkfive, sans;
}

@import url(print.css);
@media print {
  a[href^='http']::after {
    content: attr(href);
  }
}
\`\`\`
`, de = `# Lists

1. First ordered list item
2. Another item
3. Actual numbers don't matter, just that it's a number
4. And another item.

- Unordered list can use asterisks

* Or minuses

- Or pluses

1. Make my changes
   1. Fix bug
   2. Improve formatting
      - Make the headings bigger
2. Push my commits to GitHub
3. Open a pull request
   - Describe my changes
   - Mention all the members of my team
     - Ask for feedback

---

# Task lists

- [x] Finish my changes
- [ ] Push my commits to GitHub
- [ ] Open a pull request
- [x] @mentions, #refs, [links](), **formatting**, and <del>tags</del> supported
- [x] list syntax required (any unordered or ordered list supported)
- [ ] this is a complete item
- [ ] this is an incomplete item

---

# Ignoring Markdown formatting

You can tell GitHub to ignore (or escape) Markdown formatting by using \\ before the Markdown character.

Let's rename \\*our-new-project\\* to \\*our-old-project\\*.

---

# Links

[I'm an inline-style link](https://www.google.com)

[I'm an inline-style link with title](https://www.google.com "Google's Homepage")

[I'm a reference-style link][Arbitrary case-insensitive reference text]

[I'm a relative reference to a repository file](../blob/master/LICENSE)

[You can use numbers for reference-style link definitions][1]

Or leave it empty and use the [link text itself].

URLs and URLs in angle brackets will automatically get turned into links.
http://www.example.com or <http://www.example.com> and sometimes
example.com (but not on Github, for example).

Some text to show that the reference links can follow later.

[arbitrary case-insensitive reference text]: https://www.mozilla.org
[1]: http://slashdot.org
[link text itself]: http://www.reddit.com

# Images

Here's our logo (hover to see the title text):

Inline-style:
![alt text](https://github.com/adam-p/markdown-here/raw/master/src/common/images/icon48.png 'Logo Title Text 1')

Reference-style:
![alt text][logo]

[logo]: https://github.com/adam-p/markdown-here/raw/master/src/common/images/icon48.png 'Logo Title Text 2'

Like links, Images also have a footnote style syntax

![Alt text][id]

With a reference later in the document defining the URL location:

---

# [Footnotes](https://github.com/markdown-it/markdown-it-footnote)

Footnote 1 link[^first].

Footnote 2 link[^second].

Inline footnote^[Text of inline footnote] definition.

Duplicated footnote reference[^second].

[^first]: Footnote **can have markup**

    and multiple paragraphs.

[^second]: Footnote text.

---
`, ge = `# Tables

Colons can be used to align columns.

| Tables        |      Are      |  Cool |
| ------------- | :-----------: | ----: |
| col 3 is      | right-aligned | $1600 |
| col 2 is      |   centered    |   $12 |
| zebra stripes |   are neat    |    $1 |

There must be at least 3 dashes separating each header cell.
The outer pipes (|) are optional, and you don't need to make the
raw Markdown line up prettily. You can also use inline Markdown.

| Markdown | Less      | Pretty     |
| -------- | --------- | ---------- |
| _Still_  | \`renders\` | **nicely** |
| 1        | 2         | 3          |

| First Header | Second Header |
| ------------ | ------------- |
| Content Cell | Content Cell  |
| Content Cell | Content Cell  |

| Command    | Description                                    |
| ---------- | ---------------------------------------------- |
| git status | List all new or modified files                 |
| git diff   | Show file differences that haven't been staged |

| Command      | Description                                        |
| ------------ | -------------------------------------------------- |
| \`git status\` | List all _new or modified_ files                   |
| \`git diff\`   | Show file differences that **haven't been** staged |

| Left-aligned | Center-aligned | Right-aligned |
| :----------- | :------------: | ------------: |
| git status   |   git status   |    git status |
| git diff     |    git diff    |      git diff |

| Name     | Character |
| -------- | --------- |
| Backtick | \`         |
| Pipe     | \\|        |

---

# Blockquotes

> Blockquotes are very handy in email to emulate reply text.
> This line is part of the same quote.
> Quote break.

> This is a very long line that will still be quoted properly when it wraps. Oh boy let's keep writing to make sure this is long enough to actually wrap for everyone. Oh, you can _put_ **Markdown** into a blockquote.
> Blockquotes can also be nested...
>
> > ...by using additional greater-than signs right next to each other...
> >
> > > ...or with spaces between arrows.

---

# Inline HTML

<dl>
  <dt>Definition list</dt>
  <dd>Is something people use sometimes.</dd>

  <dt>Markdown in HTML</dt>
  <dd>Does *not* work **very** well. Use HTML <em>tags</em>.</dd>
</dl>

---

# Horizontal Rules

Three or more...

---

Hyphens

---

Asterisks

---

Underscores

---
`, N = `# Howdy!

# h1 Voiceflow

## h2 Voiceflow

### h3 Voiceflow

#### h4 Voiceflow

##### h5 Voiceflow

###### h6 Voiceflow

# Alt-H1

## Alt-H2

---

What does a really long block of text look like? Well, it looks like this. And there's even more of it than you could ever imagine. We want to see how this wraps and displays line height properly. So we're going to keep going. What does a really long block of text look like? Well, it looks like this. And there's even more of it than you could ever imagine. We want to see how this wraps and displays line height properly. So we're going to keep going.

---

# Emphasis

Emphasis, aka italics, with _asterisks_ or _underscores_.

Strong emphasis, aka bold, with **asterisks** or **underscores**.

Combined emphasis with **asterisks and _underscores_**.

**This is bold text**

_This is italic text_

~~Strikethrough~~
`, w = [{ type: "paragraph", children: [{ text: "Hello, world!" }] }], ue = { type: "speak", payload: { message: "End of conversation." } }, Ae = {
  name: "SampleExtension",
  type: W.RESPONSE,
  match() {
    throw new Error("Function not implemented.");
  }
};
c.TEXT;
c.TEXT;
c.IMAGE;
c.CARD;
c.CAROUSEL;
c.END;
c.EXTENSION;
const g = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAABlSURBVHgB7ZOxCYBQDEQvH2LhKI7h0nauYOcoIkE4d0hzgvf6QOC9i+24+WBCl3UJzP1zDERAyYCYDzxAQokbsAIrsAI3IG8gqoqZiS77SVyFNoNqBfH7GcoVQIwb8AytwArcwAspAyS5uk3juAAAAABJRU5ErkJggg==", me = "Howdy folks how yall doing out there?", pe = {
  title: "Core/AgentMessage",
  component: x
}, he = {
  args: {
    text: w
  }
}, Ie = {
  args: {
    text: w,
    ai: !0,
    generatedMessage: "Generated by AI, double-check for accuracy."
  }
}, Ce = {
  args: {
    text: w,
    ai: !0,
    generatedMessage: "Generated by AI, double-check for accuracy.",
    children: /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
      /* @__PURE__ */ e.jsx(
        y,
        {
          image: g,
          inline: !0,
          title: "Lorem ipsum dolor sit amet consectetur. Quis risus nibh tincidunt platea. A donec amet gravida aliquam sed eget aliquet sollicitudin turpis.",
          link: "voiceflow.com"
        }
      ),
      /* @__PURE__ */ e.jsx(
        y,
        {
          image: g,
          inline: !0,
          title: "Lorem ipsum dolor sit amet consectetur. Quis risus nibh tincidunt platea. A donec amet gravida aliquam sed eget aliquet sollicitudin turpis.",
          link: "voiceflow.com"
        }
      ),
      /* @__PURE__ */ e.jsx(
        y,
        {
          image: g,
          inline: !0,
          title: "Lorem ipsum dolor sit amet consectetur. Quis risus nibh tincidunt platea. A donec amet gravida aliquam sed eget aliquet sollicitudin turpis.",
          link: "voiceflow.com"
        }
      )
    ] })
  }
}, Ee = {
  args: {
    text: N
  }
}, ye = {
  args: {
    text: ce
  }
}, fe = {
  args: {
    text: V
  },
  render: ({ children: t, ...o }) => /* @__PURE__ */ e.jsx("div", { style: { maxWidth: "300px" }, children: /* @__PURE__ */ e.jsx(x, { ...o }) })
}, Be = {
  args: {
    text: ge
  }
}, we = {
  args: {
    text: de
  }
}, U = ({ message: t }) => {
  const [o, u] = E("");
  return le(() => {
    let a = 0;
    const C = setInterval(() => {
      u(t.slice(0, a + 1)), a++, a === t.length && clearInterval(C);
    }, 5);
    return () => clearInterval(C);
  }, [t]), /* @__PURE__ */ e.jsx(x, { text: o });
}, ve = {
  render: () => /* @__PURE__ */ e.jsx(U, { message: me }),
  parameters: {
    chromatic: { disableSnapshot: !0 }
  }
}, Qe = {
  render: () => /* @__PURE__ */ e.jsx(U, { message: N }),
  parameters: {
    chromatic: { disableSnapshot: !0 }
  }
}, oo = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
  __proto__: null,
  AIGenerated: Ie,
  CodeResponse: fe,
  InlineCode: ye,
  Lists: we,
  Markdown: Ee,
  Small: he,
  Streaming: ve,
  StreamingFullMarkdown: Qe,
  Tables: Be,
  WithLink: Ce,
  default: pe
}, Symbol.toStringTag, { value: "Module" })), n = "data:image/png;base64, ", xe = {
  title: "Core/Avatar",
  component: K,
  argTypes: {
    size: {
      options: ["small", "large"],
      control: { type: "radio" },
      defaultValue: "small"
    }
  },
  args: {
    avatar: n
  }
}, ke = {
  args: {
    size: "small"
  }
}, be = {
  args: {
    size: "large"
  }
}, no = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
  __proto__: null,
  Large: be,
  Small: ke,
  default: xe
}, Symbol.toStringTag, { value: "Module" })), s = (t, { args: o }) => /* @__PURE__ */ e.jsx("div", { style: p(I, { colors: h() }), children: /* @__PURE__ */ e.jsx(t, { args: { ...o } }) }), z = (t) => /* @__PURE__ */ e.jsx(
  T,
  {
    config: {
      verify: { projectID: "project-id" },
      url: "",
      versionID: "version-id",
      autostart: !0,
      allowDangerousHTML: !0,
      user: { name: "User" },
      render: { mode: M.OVERLAY }
    },
    assistant: {
      title: "Voiceflow Assistant",
      color: P.ACCENT[500],
      image: r,
      avatar: r,
      launcher: void 0,
      watermark: !0,
      feedback: !1,
      stylesheet: void 0,
      description: "",
      position: f.ChatPosition.RIGHT,
      persistence: f.ChatPersistence.LOCAL_STORAGE,
      audioInterface: !1,
      defaultAudioOutput: void 0,
      spacing: {
        side: 30,
        bottom: 30
      },
      extensions: []
    },
    children: t()
  }
), Se = "test-id", je = {
  title: "Core/Button",
  component: H,
  argTypes: {
    variant: {
      options: Object.values(d),
      control: { type: "radio" },
      defaultValue: d.PRIMARY
    }
  },
  args: {
    children: "Button label",
    round: !1,
    onClick: () => {
      alert("Button clicked");
    },
    testID: Se
  },
  decorators: [s]
}, Le = {
  args: {
    variant: d.PRIMARY
  }
}, Re = {
  args: {
    variant: d.PRIMARY,
    large: "true"
  }
}, Te = {
  args: {
    variant: d.SECONDARY
  }
}, Me = {
  args: {
    variant: d.SECONDARY,
    large: "true"
  }
}, Pe = {
  args: {
    variant: d.INLINE
  }
}, He = {
  args: {
    variant: d.INLINE,
    children: "Button label that is very long and should wrap. Button label that is very long and should wrap."
  },
  render: () => /* @__PURE__ */ e.jsx("div", { style: { width: "200px" }, children: /* @__PURE__ */ e.jsx(H, { variant: d.INLINE, large: "true", children: "Button label that is very long and should wrap. Button label that is very long and should wrap." }) })
}, so = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
  __proto__: null,
  Inline: Pe,
  InlineWrapped: He,
  Primary: Le,
  PrimaryLarge: Re,
  Secondary: Te,
  SecondaryLarge: Me,
  default: je
}, Symbol.toStringTag, { value: "Module" })), qe = {
  title: "Components/Card",
  component: $,
  args: {
    title: "Title",
    image: "",
    description: "Description.",
    actions: []
  }
}, De = {}, Oe = {
  args: {
    description: void 0
  }
}, _e = {
  args: {
    title: void 0
  }
}, v = {
  args: {
    image: g
  }
}, Ye = {
  args: {
    ...v.args,
    actions: [
      { request: {}, name: "Label" },
      { request: {}, name: "Label" },
      { request: {}, name: "Label" }
    ]
  }
}, Je = {
  args: {
    title: void 0,
    description: void 0,
    actions: [
      { request: {}, name: "Label" },
      { request: {}, name: "Label" },
      { request: {}, name: "Label" }
    ]
  }
}, Ve = {
  args: {
    ...v.args,
    actions: [
      { request: {}, name: "First Button with a very long long long wrapping label" },
      { request: {}, name: "Second Button with a shorter text" },
      { request: {}, name: "Third button, also with a shorter text" }
    ]
  }
}, Ne = {
  args: {
    ...v.args,
    title: "Long card title to wrap inside the card. Some more text to test the growth of card.",
    actions: [{ request: {}, name: "First Button" }]
  }
}, ao = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
  __proto__: null,
  Actionable: Ye,
  OnlyActions: Je,
  OnlyDescription: _e,
  OnlyTitle: Oe,
  Simple: De,
  WithImage: v,
  WithLongLabels: Ve,
  WithLongTitle: Ne,
  default: qe
}, Symbol.toStringTag, { value: "Module" })), G = "https://picsum.photos/seed/9/300/200", Ue = {
  component: ee,
  title: "Components/Carousel",
  decorators: [
    (t) => /* @__PURE__ */ e.jsx(
      T,
      {
        config: {
          verify: { projectID: "project-id" },
          url: "",
          versionID: "version-id",
          autostart: !0,
          allowDangerousHTML: !0,
          user: { name: "User" },
          render: { mode: M.OVERLAY }
        },
        assistant: {
          title: "Voiceflow Assistant",
          color: P.ACCENT[500],
          image: r,
          avatar: r,
          launcher: void 0,
          watermark: !0,
          feedback: !1,
          stylesheet: void 0,
          description: "",
          position: f.ChatPosition.RIGHT,
          persistence: f.ChatPersistence.LOCAL_STORAGE,
          audioInterface: !1,
          defaultAudioOutput: void 0,
          spacing: {
            side: 30,
            bottom: 30
          },
          extensions: []
        },
        children: t()
      }
    ),
    s
  ]
}, F = G, Z = {
  title: "First Card",
  description: "Lorem ipsum dolor sit amet",
  image: F,
  actions: [
    { request: {}, name: "First Button" },
    { request: {}, name: "Second Button" },
    { request: {}, name: "Third Button" }
  ]
}, b = [
  Z,
  {
    title: "Second Card",
    description: "Lorem ipsum dolor sit amet consectetur adipisicing elit. Exercitationem voluptas perspiciatis est quis dolores!",
    image: F
  },
  {
    title: "Third Card with a long title that wraps",
    description: "Lorem ipsum dolor sit amet consectetur adipisicing elit.",
    actions: [
      { request: {}, name: "Fourth Button with a long label that wraps" },
      { request: {}, name: "Fifth Button" }
    ]
  }
], ze = {
  render: () => /* @__PURE__ */ e.jsx("div", { style: { width: "380px" }, children: /* @__PURE__ */ e.jsxs(
    l,
    {
      title: "Your awesome assistant",
      description: "Im hot, youre not, deal with it",
      avatar: r,
      isLoading: !1,
      image: G,
      hasEnded: !1,
      messageInputProps: {},
      children: [
        /* @__PURE__ */ e.jsx(
          Q,
          {
            avatar: r,
            message: {
              type: c.CAROUSEL,
              cards: b
            },
            withImage: !1
          }
        ),
        /* @__PURE__ */ e.jsx(
          Q,
          {
            avatar: r,
            message: {
              type: c.TEXT,
              text: "Do you like this carousel ?"
            },
            withImage: !0
          }
        )
      ]
    }
  ) })
}, Ge = {
  args: {
    cards: [Z]
  }
}, Fe = {
  args: {
    cards: b
  }
}, Ze = {
  args: {
    cards: b
  }
}, io = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
  __proto__: null,
  Default: ze,
  MultipleCards: Fe,
  SingleCard: Ge,
  WithControls: Ze,
  default: Ue
}, Symbol.toStringTag, { value: "Module" })), Xe = {
  title: "Core/Carousel Button",
  component: te,
  args: {
    visible: !0
  }
}, We = {
  args: {
    direction: "right"
  }
}, Ke = {
  args: {
    direction: "left"
  }
}, ro = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
  __proto__: null,
  Left: Ke,
  Right: We,
  default: Xe
}, Symbol.toStringTag, { value: "Module" })), $e = [
  "orange",
  "#397DFF",
  "#A3E4D7",
  "red",
  "#F1948A",
  "#0000FF",
  "#85C1E9",
  "#F7DC6F",
  "#BB8FCE",
  "green",
  "black",
  "yellow",
  "purple"
], et = {
  title: "Theme/Colors",
  component: q
}, tt = {
  render: () => /* @__PURE__ */ e.jsx("div", { children: $e.map((t, o) => /* @__PURE__ */ e.jsx("div", { style: { marginBottom: "2rem" }, children: /* @__PURE__ */ e.jsx(q, { color: t }) }, o)) })
}, lo = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
  __proto__: null,
  Primary: tt,
  default: et
}, Symbol.toStringTag, { value: "Module" })), ot = {
  title: "Button/FeedbackButton",
  component: k,
  args: {}
}, nt = {
  render: () => /* @__PURE__ */ e.jsx("div", { style: { width: "400px", ...p(I, { colors: h("green") }) }, children: /* @__PURE__ */ e.jsx(k, { onClick: () => null, variant: D.PREVIOUS_RESPONSE }) })
}, st = {
  render: () => /* @__PURE__ */ e.jsx("div", { style: { width: "400px", ...p(I, { colors: h("red") }) }, children: /* @__PURE__ */ e.jsx(k, { onClick: () => null, variant: D.LAST_RESPONSE }) })
}, co = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
  __proto__: null,
  LastResponse: st,
  PreviousResponse: nt,
  default: ot
}, Symbol.toStringTag, { value: "Module" })), at = {
  title: "Components/Chat/Header",
  component: R,
  args: {
    title: "Agent name",
    image: n,
    actions: []
  },
  render: (t) => /* @__PURE__ */ e.jsx(R, { ...t }),
  decorators: [s]
}, it = {}, rt = {
  args: {
    actions: [{ svg: "volume" }, { svg: "reset" }]
  }
}, lt = {
  args: {
    actions: [{ svg: "mute" }, { svg: "reset" }]
  }
}, ct = {
  args: {
    actions: [{ svg: "volume" }, { svg: "reset" }]
  },
  decorators: [s]
}, dt = {
  args: {
    actions: [{ svg: "volume" }, { svg: "reset" }],
    image: void 0
  },
  decorators: [s]
}, gt = {
  args: {
    actions: [{ svg: "volume" }, { svg: "reset" }, { svg: "close" }]
  },
  decorators: [s]
}, go = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
  __proto__: null,
  Actionable: rt,
  Base: it,
  Mobile: gt,
  Muted: lt,
  NoImage: dt,
  Themed: ct,
  default: at
}, Symbol.toStringTag, { value: "Module" })), ut = {
  title: "Components/Launcher",
  component: O,
  parameters: {
    controls: { hideNoControlsWarning: !0 }
  },
  decorators: [s]
}, S = (t) => {
  const [o, u] = E(!1), a = () => {
    u((C) => !C);
  };
  return /* @__PURE__ */ e.jsx(O, { isOpen: o, onClick: a, ...t });
}, At = {
  render: () => /* @__PURE__ */ e.jsx(S, {})
}, mt = { render: () => /* @__PURE__ */ e.jsx(S, { image: g }) }, pt = {
  render: () => /* @__PURE__ */ e.jsx(S, { image: g, label: "Label" })
}, uo = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
  __proto__: null,
  Base: At,
  WithCustomIcon: mt,
  WithLabel: pt,
  default: ut
}, Symbol.toStringTag, { value: "Module" })), ht = {
  title: "Components/LinkPreview",
  component: y,
  parameters: {
    controls: { hideNoControlsWarning: !0 }
  }
}, It = {
  args: {
    image: g,
    title: "Lorem ipsum dolor sit amet consectetur. Quis risus nibh tincidunt platea. A donec amet gravida aliquam sed eget aliquet sollicitudin turpis.",
    link: "websiteexample.com"
  }
}, Ct = {
  args: {
    title: "Lorem ipsum dolor sit amet consectetur. Quis risus nibh tincidunt platea. A donec amet gravida aliquam sed eget aliquet sollicitudin turpis.",
    link: "websiteexample.com"
  }
}, Et = {
  args: {
    title: "Lorem ipsum dolor sit amet consectetur. Quis risus nibh tincidunt platea. A donec amet gravida aliquam sed eget aliquet sollicitudin turpis.",
    link: "https://google.com"
  }
}, yt = {
  args: {
    title: "Lorem ipsum dolor sit amet consectetur. Quis risus nibh tincidunt platea. A donec amet gravida aliquam sed eget aliquet sollicitudin turpis.",
    link: "some_guide.pdf"
  }
}, ft = {
  args: {
    inline: !0,
    image: g,
    title: "Lorem ipsum dolor sit amet consectetur. Quis risus nibh tincidunt platea. A donec amet gravida aliquam sed eget aliquet sollicitudin turpis.",
    link: "websiteexample.com"
  }
}, Bt = {
  args: {
    inline: !0,
    title: "Lorem ipsum dolor sit amet consectetur. Quis risus nibh tincidunt platea. A donec amet gravida aliquam sed eget aliquet sollicitudin turpis.",
    link: "websiteexample.com"
  }
}, wt = {
  args: {
    inline: !0,
    title: "Lorem ipsum dolor sit amet consectetur. Quis risus nibh tincidunt platea. A donec amet gravida aliquam sed eget aliquet sollicitudin turpis.",
    link: "https://google.com"
  }
}, vt = {
  args: {
    inline: !0,
    title: "Lorem ipsum dolor sit amet consectetur. Quis risus nibh tincidunt platea. A donec amet gravida aliquam sed eget aliquet sollicitudin turpis.",
    link: "some_guide.pdf"
  }
}, Ao = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
  __proto__: null,
  Default: It,
  DocumentPdf: yt,
  DocumentUrl: Et,
  Inline: ft,
  InlineDocumentPdf: vt,
  InlineDocumentUrl: wt,
  Loading: Ct,
  LoadingInline: Bt,
  default: ht
}, Symbol.toStringTag, { value: "Module" }));
var Qt = oe({ defaultClassName: "_5q07fe0", variantClassNames: { isOpen: { true: "_5q07fe1", false: "_5q07fe2" } }, defaultVariants: {}, compoundVariants: [] });
const xt = {
  title: "Core/MessageInput",
  component: B,
  decorators: [
    s,
    (t) => /* @__PURE__ */ e.jsx("div", { style: { width: "400px" }, children: /* @__PURE__ */ e.jsx(t, {}) })
  ]
}, kt = () => /* @__PURE__ */ e.jsx("div", { style: { width: "380px" }, children: /* @__PURE__ */ e.jsx(B, { placeholder: "Message...", onSubmit: () => Promise.resolve() }) }), bt = {
  render: () => /* @__PURE__ */ e.jsx(kt, {})
}, St = {
  render: () => /* @__PURE__ */ e.jsx("div", { style: { width: "380px" }, children: /* @__PURE__ */ e.jsx(
    B,
    {
      placeholder: "Message...",
      disableSend: !1,
      audioInterface: !0,
      onSubmit: () => Promise.resolve()
    }
  ) })
}, jt = () => {
  const [t, o] = E(!1);
  return /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
    /* @__PURE__ */ e.jsx("div", { className: Qt({ isOpen: t }), children: /* @__PURE__ */ e.jsx(
      B,
      {
        placeholder: "Message...",
        disableSend: !1,
        audioInterface: !0,
        onSubmit: () => Promise.resolve()
      }
    ) }),
    /* @__PURE__ */ e.jsx("button", { style: { position: "absolute", top: 10, right: 10 }, onClick: () => o(!t), children: "Toggle" })
  ] });
}, Lt = {
  render: () => /* @__PURE__ */ e.jsx(jt, {})
}, mo = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
  __proto__: null,
  AnimationTest: Lt,
  Base: bt,
  WithAudioInput: St,
  default: xt
}, Symbol.toStringTag, { value: "Module" })), Rt = {
  title: "Widget",
  parameters: {
    layout: "centered"
  },
  decorators: [z, s]
}, i = (t) => /* @__PURE__ */ e.jsx(
  ne,
  {
    avatar: n,
    timestamp: Date.now(),
    messages: t.map((o) => ({ type: "text", text: o }))
  }
), m = (t) => /* @__PURE__ */ e.jsx(se, { message: t, timestamp: Date.now() }), j = ({ isLoading: t }) => {
  const [o, u] = E([
    { type: "User", text: "Cool, great weather ☀️" },
    {
      type: "User",
      text: "How bout you? What about Bob? How has he been. Is he ok. Should I separate these messages?"
    },
    { type: "Agent", text: "Howdy, great to meet you!" },
    { type: "Agent", text: "What up" },
    { type: "User", text: "How bout you?" },
    { type: "Agent", text: "Howdy, great to meet you!" },
    { type: "Agent", text: "What up" },
    { type: "User", text: "How bout you?" },
    { type: "Agent", text: "Howdy, great to meet you!" },
    { type: "Agent", text: "What up" },
    { type: "User", text: "How bout you? Hows it going does this hit the loading state at the bottom of the chat?" }
  ]), a = [
    "How are you today?",
    "Nice to hear from you!",
    "I’m here to help!",
    "What can I do for you?",
    "Good to see you!"
  ], C = async (A) => {
    if (!A)
      return;
    const L = [...o], X = a[Math.floor(Math.random() * a.length)];
    L.push({ type: "Agent", text: X }), u(L);
  };
  return /* @__PURE__ */ e.jsxs(
    l,
    {
      title: "Your AI assistant",
      image: "",
      description: "Hello, I am here to help with whatever you need.",
      avatar: n,
      showPoweredBy: !0,
      extraLinkText: "Privacy",
      extraLinkUrl: "https://voiceflow.com",
      isLoading: !1,
      hasEnded: !1,
      messageInputProps: {
        onSubmit: async (A) => C(A),
        placeholder: "Message..."
      },
      children: [
        o.map((A) => A.type === "Agent" ? i([A.text]) : m(A.text)),
        t && /* @__PURE__ */ e.jsx(_, { avatar: n })
      ]
    }
  );
}, Tt = {
  render: () => /* @__PURE__ */ e.jsx(j, {})
}, Mt = {
  render: () => /* @__PURE__ */ e.jsx("div", { style: p(I, { colors: h("red") }), children: /* @__PURE__ */ e.jsx(j, {}) })
}, Pt = {
  render: () => /* @__PURE__ */ e.jsx(j, { isLoading: !0 })
}, Ht = {
  render: () => /* @__PURE__ */ e.jsxs("div", { style: { display: "flex", gap: "32px" }, children: [
    /* @__PURE__ */ e.jsx("div", { style: { width: "400px", ...p(I, { colors: h("red") }) }, children: /* @__PURE__ */ e.jsx(
      l,
      {
        title: "Your AI assistant",
        image: "",
        description: "Hello, I am here to help with whatever you need.",
        avatar: n,
        showPoweredBy: !0,
        extraLinkText: "Privacy",
        extraLinkUrl: "https://voiceflow.com",
        isLoading: !1,
        hasEnded: !1,
        messageInputProps: {
          onSubmit: () => Promise.resolve(),
          placeholder: "Message..."
        }
      }
    ) }),
    /* @__PURE__ */ e.jsx("div", { style: { width: "400px", ...p(I, { colors: h("green") }) }, children: /* @__PURE__ */ e.jsx(
      l,
      {
        title: "Your AI assistant",
        image: "",
        description: "Hello, I am here to help with whatever you need.",
        avatar: n,
        showPoweredBy: !0,
        extraLinkText: "Privacy",
        extraLinkUrl: "https://voiceflow.com",
        isLoading: !1,
        hasEnded: !1,
        messageInputProps: {
          onSubmit: () => Promise.resolve(),
          placeholder: "Message..."
        }
      }
    ) }),
    /* @__PURE__ */ e.jsx("div", { style: { width: "400px", ...p(I, { colors: h("purple") }) }, children: /* @__PURE__ */ e.jsx(
      l,
      {
        title: "",
        image: "",
        description: "",
        avatar: n,
        showPoweredBy: !0,
        extraLinkText: "Privacy",
        extraLinkUrl: "https://voiceflow.com",
        isLoading: !1,
        hasEnded: !1,
        messageInputProps: {
          onSubmit: () => Promise.resolve(),
          placeholder: "Message..."
        }
      }
    ) })
  ] })
}, qt = {
  render: () => /* @__PURE__ */ e.jsx(
    l,
    {
      title: "Your AI assistant",
      image: "",
      description: "Let's get this party started already!",
      avatar: n,
      buttons: [],
      extraLinkText: "Privacy",
      extraLinkUrl: "https://voiceflow.com",
      showPoweredBy: !1,
      isLoading: !1,
      hasEnded: !1,
      messageInputProps: { onSubmit: () => Promise.resolve(), placeholder: "Message..." }
    }
  )
}, Dt = {
  render: () => /* @__PURE__ */ e.jsx(
    l,
    {
      title: "Your AI assistant",
      image: "",
      description: "Let's get this party started already!",
      avatar: n,
      buttons: [],
      showPoweredBy: !0,
      isLoading: !1,
      hasEnded: !1,
      messageInputProps: { onSubmit: () => Promise.resolve(), placeholder: "Message..." }
    }
  )
}, Ot = {
  render: () => /* @__PURE__ */ e.jsxs(
    l,
    {
      title: "Your AI assistant",
      image: "",
      description: "Let's get this party started already!",
      avatar: n,
      buttons: [],
      showPoweredBy: !1,
      isLoading: !1,
      hasEnded: !1,
      messageInputProps: { onSubmit: () => Promise.resolve(), placeholder: "Message..." },
      children: [
        i(["👋🏻 Good morning!", "How are you today?", "How can I help you ?"]),
        m("How bout you?"),
        i(["Thanks for asking", "here are some cool emojis:", "😝 ✌️ ☎️  🤦🏼‍♀️  🤯"]),
        i(["Anything else I can do to help you today?"]),
        m("Dont think so. Everything else is amazing!"),
        i(["ok, so bye for now"])
      ]
    }
  )
}, _t = {
  render: () => /* @__PURE__ */ e.jsxs(
    l,
    {
      title: "Your amazing assistant",
      image: n,
      description: "Let's get this party started already!",
      avatar: n,
      buttons: [],
      showPoweredBy: !0,
      isLoading: !1,
      hasEnded: !0,
      messageInputProps: { onSubmit: () => Promise.resolve(), placeholder: "Message..." },
      children: [
        i(["👋🏻 Good morning!", "How are you today?", "How can I help you ?"]),
        m("How bout you?"),
        i(["Thanks for asking", "here are some cool emojis:", "😝 ✌️ ☎️  🤦🏼‍♀️  🤯"]),
        m("Cool, I *LOVE* emojis!"),
        i([`I know.
That's why I sent you some.`]),
        m("🤯"),
        i(["Anything else I can do to help you today?"]),
        m("Dont think so. Everything else is amazing!"),
        i(["ok, so bye for now"])
      ]
    }
  )
}, po = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
  __proto__: null,
  Base: Tt,
  BaseThemed: Mt,
  ChatEnded: _t,
  LoadingState: Pt,
  NoFooterLinks: Ot,
  NoPoweredBy: qt,
  OnlyPoweredBy: Dt,
  Themed: Ht,
  default: Rt
}, Symbol.toStringTag, { value: "Module" })), Yt = (t) => {
  const [o, u] = E(!0);
  return /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
    /* @__PURE__ */ e.jsx("div", { style: { height: 250, backgroundColor: "lavender" } }),
    /* @__PURE__ */ e.jsx("button", { onClick: () => u((a) => !a), children: "Show Prompt" }),
    /* @__PURE__ */ e.jsx(Y, { ...t, visible: o })
  ] });
}, Jt = {
  title: "Components/Chat/Prompt",
  component: Y,
  args: {
    cancel: { label: "Cancel" }
  },
  render: (t) => /* @__PURE__ */ e.jsx(Yt, { ...t }),
  decorators: [s]
}, Vt = {
  args: {
    visible: !0,
    accept: { label: "Primary Action" }
  }
}, Nt = {
  args: {
    visible: !0,
    accept: { label: "Dangerous Action" }
  }
}, ho = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
  __proto__: null,
  Base: Vt,
  Dangerous: Nt,
  default: Jt
}, Symbol.toStringTag, { value: "Module" })), Ut = {
  title: "Core/Send Button",
  component: ae,
  decorators: [s]
}, zt = {
  args: {
    disabled: !1,
    color: "#387dff"
  }
}, Gt = {
  args: {
    disabled: !0,
    color: "#387dff"
  }
}, Io = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
  __proto__: null,
  Default: zt,
  Disabled: Gt,
  default: Ut
}, Symbol.toStringTag, { value: "Module" })), Ft = {
  title: "Components/TypingIndicator",
  component: ie,
  decorators: [z, s]
}, Zt = {
  args: {}
}, Xt = {
  render: () => /* @__PURE__ */ e.jsx("div", { style: { width: "380px" }, children: /* @__PURE__ */ e.jsxs(
    l,
    {
      title: "Your AI assistant",
      image: "",
      description: "It's tricky to rock a rhyme, to rock a rhyme thats right on time, it's tricky",
      avatar: r,
      showPoweredBy: !0,
      extraLinkText: "Privacy",
      extraLinkUrl: "https://voiceflow.com",
      isLoading: !1,
      hasEnded: !1,
      messageInputProps: {
        onSubmit: () => Promise.resolve(),
        placeholder: "Message..."
      },
      children: [
        /* @__PURE__ */ e.jsx(Q, { avatar: r, withImage: !1, message: { type: "text", text: "Good morning" } }),
        /* @__PURE__ */ e.jsx(_, { avatar: r })
      ]
    }
  ) })
}, Co = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
  __proto__: null,
  Default: Zt,
  InsideChat: Xt,
  default: Ft
}, Symbol.toStringTag, { value: "Module" })), Wt = {
  title: "Core/WelcomeMessage",
  component: J,
  args: {
    avatar: n
  },
  parameters: {
    layout: "centered"
  },
  decorators: [
    (t) => /* @__PURE__ */ e.jsx("div", { className: re.classNames.variants.withChat.true, children: /* @__PURE__ */ e.jsx(t, {}) })
  ]
}, Kt = {
  args: {
    avatar: n,
    title: "Agent name",
    description: "Agent description."
  }
}, $t = {
  args: {
    avatar: n,
    title: "Hello, I am your #1 favourite AI assistant, meant to help you out in all sorts of ways. Hello, I am your #1 favourite AI assistant, meant to help you out in all sorts of ways. Hello, I am your #1 favourite AI assistant, meant to help you out in all sorts of ways. Hello, I am your #1 favourite AI assistant, meant to help you out in all sorts of ways. Hello, I am your #1 favourite AI assistant, meant to help you out in all sorts of ways.",
    description: "I can do tons of stuff, like help you with your account, answer questions, and even tell you a joke or two. Just ask me anything! I can do tons of stuff, like help you with your account, answer questions, and even tell you a joke or two. Just ask me anything! I can do tons of stuff, like help you with your account, answer questions, and even tell you a joke or two. Just ask me anything!I can do tons of stuff, like help you with your account, answer questions, and even tell you a joke or two. Just ask me anything! I can do tons of stuff, like help you with your account, answer questions, and even tell you a joke or two. Just ask me anything! I can do tons of stuff, like help you with your account, answer questions, and even tell you a joke or two. Just ask me anything!"
  },
  render: (t) => /* @__PURE__ */ e.jsxs("div", { children: [
    "Mock container",
    /* @__PURE__ */ e.jsx("div", { style: { border: "1px solid black" }, children: /* @__PURE__ */ e.jsx(J, { ...t }) })
  ] })
}, Eo = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
  __proto__: null,
  Base: Kt,
  LongContent: $t,
  default: Wt
}, Symbol.toStringTag, { value: "Module" }));
export {
  oo as AgentMessage,
  no as Avatar,
  so as Button,
  ao as Card,
  io as Carousel,
  ro as CarouselButton,
  lo as ColorTheme,
  co as FeedbackButton,
  go as Header,
  uo as Launcher,
  Ao as LinkPreview,
  mo as MessageInput,
  po as NewChat,
  ho as Prompt,
  Io as SendButton,
  Co as TypingIndicator,
  Eo as WelcomeMessage
};
