@schmitech/chatbot-widget 0.5.3 → 0.6.0

package/dist/shared/styles.d.ts

@@ -51,7 +51,7 @@ export declare let CHAT_CONSTANTS: {
 /**
  * Global CSS styles for the ChatWidget component
  */
-export declare const CHAT_WIDGET_STYLES = "\n  body, button, input, textarea {\n    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;\n  }\n  \n  /* Complete focus ring removal - covers all browsers and scenarios */\n  textarea,\n  textarea:focus,\n  textarea:focus-visible,\n  input,\n  input:focus,\n  input:focus-visible {\n    outline: none !important;\n    box-shadow: none !important;\n    border-color: inherit !important;\n    -webkit-appearance: none !important;\n    -moz-appearance: none !important;\n    -webkit-tap-highlight-color: transparent !important;\n  }\n  \n  /* Alternative: Uncomment for subtle light focus ring instead of complete removal */\n  /*\n  textarea:focus,\n  textarea:focus-visible {\n    outline: 2px solid rgba(203, 213, 225, 0.4) !important;\n    outline-offset: -1px !important;\n    box-shadow: 0 0 0 1px rgba(203, 213, 225, 0.2) !important;\n  }\n  */\n  \n  /* Remove webkit/safari specific styling */\n  textarea::-webkit-input-placeholder,\n  input::-webkit-input-placeholder {\n    -webkit-appearance: none;\n  }\n  \n  /* Ensure buttons also don't show focus rings */\n  button:focus,\n  button:focus-visible {\n    outline: none !important;\n    box-shadow: none !important;\n  }\n\n  /* Enhanced animations for modern feel */\n  @keyframes slideInUp {\n    0% { \n      opacity: 0; \n      transform: translateY(20px) scale(0.95); \n    }\n    100% { \n      opacity: 1; \n      transform: translateY(0) scale(1); \n    }\n  }\n\n  @keyframes slideOutDown {\n    0% { \n      opacity: 1; \n      transform: translateY(0) scale(1); \n    }\n    100% { \n      opacity: 0; \n      transform: translateY(20px) scale(0.95); \n    }\n  }\n\n  .animate-slide-in-up {\n    animation: slideInUp 0.3s cubic-bezier(0.4, 0, 0.2, 1) forwards;\n  }\n\n  .animate-slide-out-down {\n    animation: slideOutDown 0.2s cubic-bezier(0.4, 0, 0.2, 1) forwards;\n  }\n\n  @keyframes pulseGlow {\n    0%, 100% { \n      box-shadow: 0 0 0 0 rgba(59, 130, 246, 0.4);\n    }\n    50% { \n      box-shadow: 0 0 0 8px rgba(59, 130, 246, 0);\n    }\n  }\n\n  .animate-pulse-glow {\n    animation: pulseGlow 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;\n  }\n\n  @keyframes messageEntry {\n    0% { \n      opacity: 0; \n      transform: translateY(10px) scale(0.98);\n    }\n    100% { \n      opacity: 1; \n      transform: translateY(0) scale(1);\n    }\n  }\n\n  .animate-message-entry {\n    animation: messageEntry 0.4s cubic-bezier(0.4, 0, 0.2, 1) forwards;\n  }\n\n  @keyframes buttonHover {\n    0% { transform: translateY(0) scale(1); }\n    100% { transform: translateY(-2px) scale(1.05); }\n  }\n\n  .animate-button-hover:hover {\n    animation: buttonHover 0.2s cubic-bezier(0.4, 0, 0.2, 1) forwards;\n  }\n  \n  @keyframes fadeInOut {\n    0% { opacity: 0; transform: translateY(4px); }\n    20% { opacity: 1; transform: translateY(0); }\n    80% { opacity: 1; transform: translateY(0); }\n    100% { opacity: 0; transform: translateY(-4px); }\n  }\n  .animate-fade-in-out {\n    animation: fadeInOut 2s ease-in-out forwards;\n  }\n  \n  @keyframes bounce-gentle {\n    0%, 100% { transform: translateY(0); }\n    50% { transform: translateY(-8px); }\n  }\n  .animate-bounce-gentle {\n    animation: bounce-gentle 3s ease-in-out infinite;\n    animation-delay: 2s;\n  }\n\n  @keyframes float {\n    0%, 100% { transform: translateY(0px) rotate(0deg) scale(1); }\n    25% { transform: translateY(-8px) rotate(2deg) scale(1.02); }\n    50% { transform: translateY(-4px) rotate(-1deg) scale(1); }\n    75% { transform: translateY(-6px) rotate(1deg) scale(1.01); }\n  }\n  .animate-float {\n    animation: float 2.5s cubic-bezier(0.4, 0, 0.6, 1) infinite;\n  }\n  \n  /* Modern typing dots animation */\n  @keyframes dotWave {\n    0%, 60%, 100% {\n      transform: translateY(0) scale(1);\n      background-color: #9ca3af;\n    }\n    30% {\n      transform: translateY(-10px) scale(1.1);\n      background-color: #6b7280;\n    }\n  }\n  \n  .typing-dots-container {\n    display: inline-flex;\n    align-items: center;\n    gap: 4px;\n    padding: 2px 0;\n  }\n  \n  .typing-dot {\n    width: 8px;\n    height: 8px;\n    border-radius: 50%;\n    background-color: #9ca3af;\n    animation: dotWave 1.4s ease-in-out infinite;\n  }\n  \n  .typing-dot:nth-child(1) {\n    animation-delay: 0s;\n  }\n  \n  .typing-dot:nth-child(2) {\n    animation-delay: 0.2s;\n  }\n  \n  .typing-dot:nth-child(3) {\n    animation-delay: 0.4s;\n  }\n\n  /* Glassmorphism effects */\n  .glass-effect {\n    backdrop-filter: blur(20px);\n    -webkit-backdrop-filter: blur(20px);\n    background: rgba(255, 255, 255, 0.8);\n    border: 1px solid rgba(255, 255, 255, 0.3);\n  }\n\n  .glass-effect-dark {\n    backdrop-filter: blur(20px);\n    -webkit-backdrop-filter: blur(20px);\n    background: rgba(30, 41, 59, 0.8);\n    border: 1px solid rgba(255, 255, 255, 0.1);\n  }\n\n  /* Custom scrollbar */\n  .custom-scrollbar::-webkit-scrollbar {\n    width: 6px;\n  }\n\n  .custom-scrollbar::-webkit-scrollbar-track {\n    background: rgba(0, 0, 0, 0.05);\n    border-radius: 3px;\n  }\n\n  .custom-scrollbar::-webkit-scrollbar-thumb {\n    background: rgba(0, 0, 0, 0.2);\n    border-radius: 3px;\n    transition: background 0.2s ease;\n  }\n\n  .custom-scrollbar::-webkit-scrollbar-thumb:hover {\n    background: rgba(0, 0, 0, 0.3);\n  }\n\n  /* Enhanced shadows */\n  .shadow-elegant {\n    box-shadow: \n      0 10px 25px -5px rgba(0, 0, 0, 0.1),\n      0 8px 10px -6px rgba(0, 0, 0, 0.1),\n      0 0 0 1px rgba(255, 255, 255, 0.05);\n  }\n\n  .shadow-soft {\n    box-shadow: \n      0 4px 6px -1px rgba(0, 0, 0, 0.1),\n      0 2px 4px -1px rgba(0, 0, 0, 0.06);\n  }\n\n  .shadow-floating {\n    box-shadow: \n      0 20px 25px -5px rgba(0, 0, 0, 0.1),\n      0 10px 10px -5px rgba(0, 0, 0, 0.04);\n  }\n  \n  .prose {\n    max-width: 100%;\n  }\n  \n  .prose > * {\n    margin-top: 0 !important;\n    margin-bottom: 0.5em !important;\n  }\n  \n  .prose p {\n    margin: 0 0 0.5em 0 !important;\n    padding: 0;\n    line-height: 1.6;\n  }\n  \n  .prose p:last-child {\n    margin-bottom: 0 !important;\n  }\n  \n  .prose ul,\n  .prose ol {\n    margin-top: 0.5em !important;\n    margin-bottom: 0.5em !important;\n    padding-left: 1.5em !important;\n  }\n  \n  .prose li {\n    margin-bottom: 0.25em !important;\n    padding-left: 0.25em !important;\n    line-height: 1.5;\n  }\n  \n  .prose li p {\n    margin: 0 !important;\n  }\n  \n  .prose li + li {\n    margin-top: 0.1em !important;\n  }\n  \n  .prose h1, .prose h2, .prose h3, .prose h4, .prose h5, .prose h6 {\n    margin-top: 1em !important;\n    margin-bottom: 0.5em !important;\n    font-weight: 600;\n  }\n\n  /* Button enhancements */\n  .btn-modern {\n    position: relative;\n    overflow: hidden;\n    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n  }\n\n  .btn-modern::before {\n    content: '';\n    position: absolute;\n    top: 0;\n    left: 0;\n    right: 0;\n    bottom: 0;\n    background: linear-gradient(135deg, rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0));\n    opacity: 0;\n    transition: opacity 0.3s ease;\n  }\n\n  .btn-modern:hover::before {\n    opacity: 1;\n  }\n\n  /* Input enhancements */\n  .input-modern {\n    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n  }\n\n  .input-modern:focus {\n    transform: translateY(-1px);\n  }\n  ";
+export declare const CHAT_WIDGET_STYLES = "\n  body, button, input, textarea {\n    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;\n  }\n  \n  /* Complete focus ring removal - covers all browsers and scenarios */\n  textarea,\n  textarea:focus,\n  textarea:focus-visible,\n  input,\n  input:focus,\n  input:focus-visible {\n    outline: none !important;\n    box-shadow: none !important;\n    border-color: inherit !important;\n    -webkit-appearance: none !important;\n    -moz-appearance: none !important;\n    -webkit-tap-highlight-color: transparent !important;\n  }\n  \n  /* Alternative: Uncomment for subtle light focus ring instead of complete removal */\n  /*\n  textarea:focus,\n  textarea:focus-visible {\n    outline: 2px solid rgba(203, 213, 225, 0.4) !important;\n    outline-offset: -1px !important;\n    box-shadow: 0 0 0 1px rgba(203, 213, 225, 0.2) !important;\n  }\n  */\n  \n  /* Remove webkit/safari specific styling */\n  textarea::-webkit-input-placeholder,\n  input::-webkit-input-placeholder {\n    -webkit-appearance: none;\n  }\n  \n  /* Ensure buttons also don't show focus rings */\n  button:focus,\n  button:focus-visible {\n    outline: none !important;\n    box-shadow: none !important;\n  }\n\n  /* Enhanced animations for modern feel */\n  @keyframes slideInUp {\n    0% { \n      opacity: 0; \n      transform: translateY(20px) scale(0.95); \n    }\n    100% { \n      opacity: 1; \n      transform: translateY(0) scale(1); \n    }\n  }\n\n  @keyframes slideOutDown {\n    0% { \n      opacity: 1; \n      transform: translateY(0) scale(1); \n    }\n    100% { \n      opacity: 0; \n      transform: translateY(20px) scale(0.95); \n    }\n  }\n\n  .animate-slide-in-up {\n    animation: slideInUp 0.3s cubic-bezier(0.4, 0, 0.2, 1) forwards;\n  }\n\n  .animate-slide-out-down {\n    animation: slideOutDown 0.2s cubic-bezier(0.4, 0, 0.2, 1) forwards;\n  }\n\n  @keyframes pulseGlow {\n    0%, 100% { \n      box-shadow: 0 0 0 0 rgba(59, 130, 246, 0.4);\n    }\n    50% { \n      box-shadow: 0 0 0 8px rgba(59, 130, 246, 0);\n    }\n  }\n\n  .animate-pulse-glow {\n    animation: pulseGlow 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;\n  }\n\n  @keyframes messageEntry {\n    0% { \n      opacity: 0; \n      transform: translateY(10px) scale(0.98);\n    }\n    100% { \n      opacity: 1; \n      transform: translateY(0) scale(1);\n    }\n  }\n\n  .animate-message-entry {\n    animation: messageEntry 0.4s cubic-bezier(0.4, 0, 0.2, 1) forwards;\n  }\n\n  @keyframes buttonHover {\n    0% { transform: translateY(0) scale(1); }\n    100% { transform: translateY(-2px) scale(1.05); }\n  }\n\n  .animate-button-hover:hover {\n    animation: buttonHover 0.2s cubic-bezier(0.4, 0, 0.2, 1) forwards;\n  }\n  \n  @keyframes fadeInOut {\n    0% { opacity: 0; transform: translateY(4px); }\n    20% { opacity: 1; transform: translateY(0); }\n    80% { opacity: 1; transform: translateY(0); }\n    100% { opacity: 0; transform: translateY(-4px); }\n  }\n  .animate-fade-in-out {\n    animation: fadeInOut 2s ease-in-out forwards;\n  }\n  \n  @keyframes bounce-gentle {\n    0%, 100% { transform: translateY(0); }\n    50% { transform: translateY(-8px); }\n  }\n  .animate-bounce-gentle {\n    animation: bounce-gentle 3s ease-in-out infinite;\n    animation-delay: 2s;\n  }\n\n  @keyframes float {\n    0%, 100% { transform: translateY(0px) rotate(0deg) scale(1); }\n    25% { transform: translateY(-8px) rotate(2deg) scale(1.02); }\n    50% { transform: translateY(-4px) rotate(-1deg) scale(1); }\n    75% { transform: translateY(-6px) rotate(1deg) scale(1.01); }\n  }\n  .animate-float {\n    animation: float 2.5s cubic-bezier(0.4, 0, 0.6, 1) infinite;\n  }\n  \n  /* Modern typing dots animation */\n  @keyframes dotWave {\n    0%, 60%, 100% {\n      transform: translateY(0) scale(1);\n      background-color: #9ca3af;\n    }\n    30% {\n      transform: translateY(-10px) scale(1.1);\n      background-color: #6b7280;\n    }\n  }\n  \n  .typing-dots-container {\n    display: inline-flex;\n    align-items: center;\n    gap: 4px;\n    padding: 2px 0;\n  }\n  \n  .typing-dot {\n    width: 8px;\n    height: 8px;\n    border-radius: 50%;\n    background-color: #9ca3af;\n    animation: dotWave 1.4s ease-in-out infinite;\n  }\n  \n  .typing-dot:nth-child(1) {\n    animation-delay: 0s;\n  }\n  \n  .typing-dot:nth-child(2) {\n    animation-delay: 0.2s;\n  }\n  \n  .typing-dot:nth-child(3) {\n    animation-delay: 0.4s;\n  }\n\n  /* Glassmorphism effects */\n  .glass-effect {\n    backdrop-filter: blur(20px);\n    -webkit-backdrop-filter: blur(20px);\n    background: rgba(255, 255, 255, 0.8);\n    border: 1px solid rgba(255, 255, 255, 0.3);\n  }\n\n  .glass-effect-dark {\n    backdrop-filter: blur(20px);\n    -webkit-backdrop-filter: blur(20px);\n    background: rgba(30, 41, 59, 0.8);\n    border: 1px solid rgba(255, 255, 255, 0.1);\n  }\n\n  /* Custom scrollbar */\n  .custom-scrollbar::-webkit-scrollbar {\n    width: 6px;\n  }\n\n  .custom-scrollbar::-webkit-scrollbar-track {\n    background: rgba(0, 0, 0, 0.05);\n    border-radius: 3px;\n  }\n\n  .custom-scrollbar::-webkit-scrollbar-thumb {\n    background: rgba(0, 0, 0, 0.2);\n    border-radius: 3px;\n    transition: background 0.2s ease;\n  }\n\n  .custom-scrollbar::-webkit-scrollbar-thumb:hover {\n    background: rgba(0, 0, 0, 0.3);\n  }\n\n  /* Horizontal scrollbar for markdown content (tables, code blocks, etc.) */\n  .markdown-content-wrapper {\n    overflow-x: scroll !important; /* Use 'scroll' to always show scrollbar when content overflows */\n    overflow-y: visible !important;\n    -webkit-overflow-scrolling: touch;\n    /* Force scrollbar to always be visible when content overflows */\n    scrollbar-width: thin;\n    scrollbar-color: rgba(0, 0, 0, 0.4) rgba(0, 0, 0, 0.15);\n  }\n\n  /* WebKit scrollbar - always visible when overflow */\n  .markdown-content-wrapper::-webkit-scrollbar {\n    height: 12px;\n    width: 12px;\n    /* Force scrollbar to always display */\n    display: block;\n    -webkit-appearance: none;\n  }\n\n  .markdown-content-wrapper::-webkit-scrollbar-track {\n    background: rgba(0, 0, 0, 0.15);\n    border-radius: 6px;\n    margin: 4px;\n    /* Make track always visible */\n    -webkit-box-shadow: inset 0 0 2px rgba(0, 0, 0, 0.1);\n  }\n\n  .markdown-content-wrapper::-webkit-scrollbar-thumb {\n    background: rgba(0, 0, 0, 0.4);\n    border-radius: 6px;\n    border: 2px solid transparent;\n    background-clip: padding-box;\n    transition: background 0.2s ease;\n    /* Ensure thumb is always visible */\n    min-height: 20px;\n  }\n\n  .markdown-content-wrapper::-webkit-scrollbar-thumb:hover {\n    background: rgba(0, 0, 0, 0.6);\n    background-clip: padding-box;\n  }\n\n  .markdown-content-wrapper::-webkit-scrollbar-thumb:active {\n    background: rgba(0, 0, 0, 0.7);\n  }\n\n  .markdown-content-wrapper::-webkit-scrollbar-corner {\n    background: rgba(0, 0, 0, 0.1);\n  }\n\n  /* Ensure scrollbar styling is consistent across browsers */\n  @supports (-webkit-appearance: none) {\n    .markdown-content-wrapper::-webkit-scrollbar {\n      -webkit-appearance: none;\n    }\n  }\n\n  /* Force scrollbar to always be visible when content overflows (macOS workaround) */\n  .markdown-content-wrapper.has-horizontal-scroll {\n    /* Reserve space for scrollbar */\n    scrollbar-gutter: stable;\n  }\n\n  .markdown-content-wrapper.has-horizontal-scroll::-webkit-scrollbar {\n    /* Force scrollbar to always be visible */\n    display: block !important;\n    opacity: 1 !important;\n    visibility: visible !important;\n  }\n\n  .markdown-content-wrapper.has-horizontal-scroll::-webkit-scrollbar-track {\n    /* Make track more visible */\n    background: rgba(0, 0, 0, 0.2) !important;\n    opacity: 1 !important;\n    visibility: visible !important;\n  }\n\n  .markdown-content-wrapper.has-horizontal-scroll::-webkit-scrollbar-thumb {\n    /* Make thumb more visible */\n    background: rgba(0, 0, 0, 0.5) !important;\n    opacity: 1 !important;\n    visibility: visible !important;\n  }\n\n  /* Enhanced shadows */\n  .shadow-elegant {\n    box-shadow: \n      0 10px 25px -5px rgba(0, 0, 0, 0.1),\n      0 8px 10px -6px rgba(0, 0, 0, 0.1),\n      0 0 0 1px rgba(255, 255, 255, 0.05);\n  }\n\n  .shadow-soft {\n    box-shadow: \n      0 4px 6px -1px rgba(0, 0, 0, 0.1),\n      0 2px 4px -1px rgba(0, 0, 0, 0.06);\n  }\n\n  .shadow-floating {\n    box-shadow: \n      0 20px 25px -5px rgba(0, 0, 0, 0.1),\n      0 10px 10px -5px rgba(0, 0, 0, 0.04);\n  }\n  \n  .prose {\n    max-width: 100%;\n  }\n  \n  .prose > * {\n    margin-top: 0 !important;\n    margin-bottom: 0.5em !important;\n  }\n  \n  .prose p {\n    margin: 0 0 0.5em 0 !important;\n    padding: 0;\n    line-height: 1.6;\n  }\n  \n  .prose p:last-child {\n    margin-bottom: 0 !important;\n  }\n  \n  .prose ul,\n  .prose ol {\n    margin-top: 0.5em !important;\n    margin-bottom: 0.5em !important;\n    padding-left: 1.5em !important;\n  }\n  \n  .prose li {\n    margin-bottom: 0.25em !important;\n    padding-left: 0.25em !important;\n    line-height: 1.5;\n  }\n  \n  .prose li p {\n    margin: 0 !important;\n  }\n  \n  .prose li + li {\n    margin-top: 0.1em !important;\n  }\n  \n  .prose h1, .prose h2, .prose h3, .prose h4, .prose h5, .prose h6 {\n    margin-top: 1em !important;\n    margin-bottom: 0.5em !important;\n    font-weight: 600;\n  }\n\n  /* Button enhancements */\n  .btn-modern {\n    position: relative;\n    overflow: hidden;\n    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n  }\n\n  .btn-modern::before {\n    content: '';\n    position: absolute;\n    top: 0;\n    left: 0;\n    right: 0;\n    bottom: 0;\n    background: linear-gradient(135deg, rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0));\n    opacity: 0;\n    transition: opacity 0.3s ease;\n  }\n\n  .btn-modern:hover::before {\n    opacity: 1;\n  }\n\n  /* Input enhancements */\n  .input-modern {\n    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n  }\n\n  .input-modern:focus {\n    transform: translateY(-1px);\n  }\n  ";
 /**
  * Helper functions for responsive window dimensions
  */

package/dist/stateDiagram-FKZM4ZOC-ofFsB7HJ-BJBX12rE.js

@@ -0,0 +1,264 @@
+import { U as G, B as A, M } from "./chunk-DI55MBZ5-BY2XXvZz-DbAvz3Pq.js";
+import { x as y, p as t, f as v, a as k, G as U, n as H, av as O, aC as P, az as R, v as C } from "./index-B5s_uaP2.js";
+import { L as I } from "./graph-BfwqPHx6-DErF9dBN.js";
+import { o as $ } from "./layout-CSfkE668-BjigbqJL.js";
+typeof window < "u" && (window.global = window);
+var W = /* @__PURE__ */ y((e) => e.append("circle").attr("class", "start-state").attr("r", t().state.sizeUnit).attr("cx", t().state.padding + t().state.sizeUnit).attr("cy", t().state.padding + t().state.sizeUnit), "drawStartState"), j = /* @__PURE__ */ y((e) => e.append("line").style("stroke", "grey").style("stroke-dasharray", "3").attr("x1", t().state.textHeight).attr("class", "divider").attr("x2", t().state.textHeight * 2).attr("y1", 0).attr("y2", 0), "drawDivider"), F = /* @__PURE__ */ y((e, n) => {
+  const g = e.append("text").attr("x", 2 * t().state.padding).attr("y", t().state.textHeight + 2 * t().state.padding).attr("font-size", t().state.fontSize).attr("class", "state-title").text(n.id), s = g.node().getBBox();
+  return e.insert("rect", ":first-child").attr("x", t().state.padding).attr("y", t().state.padding).attr("width", s.width + 2 * t().state.padding).attr("height", s.height + 2 * t().state.padding).attr("rx", t().state.radius), g;
+}, "drawSimpleState"), J = /* @__PURE__ */ y((e, n) => {
+  const g = /* @__PURE__ */ y(function(o, u, b) {
+    const m = o.append("tspan").attr("x", 2 * t().state.padding).text(u);
+    b || m.attr("dy", t().state.textHeight);
+  }, "addTspan"), s = e.append("text").attr("x", 2 * t().state.padding).attr("y", t().state.textHeight + 1.3 * t().state.padding).attr("font-size", t().state.fontSize).attr("class", "state-title").text(n.descriptions[0]).node().getBBox(), d = s.height, c = e.append("text").attr("x", t().state.padding).attr(
+    "y",
+    d + t().state.padding * 0.4 + t().state.dividerMargin + t().state.textHeight
+  ).attr("class", "state-description");
+  let l = !0, a = !0;
+  n.descriptions.forEach(function(o) {
+    l || (g(c, o, a), a = !1), l = !1;
+  });
+  const r = e.append("line").attr("x1", t().state.padding).attr("y1", t().state.padding + d + t().state.dividerMargin / 2).attr("y2", t().state.padding + d + t().state.dividerMargin / 2).attr("class", "descr-divider"), x = c.node().getBBox(), h = Math.max(x.width, s.width);
+  return r.attr("x2", h + 3 * t().state.padding), e.insert("rect", ":first-child").attr("x", t().state.padding).attr("y", t().state.padding).attr("width", h + 2 * t().state.padding).attr("height", x.height + d + 2 * t().state.padding).attr("rx", t().state.radius), e;
+}, "drawDescrState"), Y = /* @__PURE__ */ y((e, n, g) => {
+  const s = t().state.padding, d = 2 * t().state.padding, c = e.node().getBBox(), l = c.width, a = c.x, r = e.append("text").attr("x", 0).attr("y", t().state.titleShift).attr("font-size", t().state.fontSize).attr("class", "state-title").text(n.id), x = r.node().getBBox().width + d;
+  let h = Math.max(x, l);
+  h === l && (h = h + d);
+  let o;
+  const u = e.node().getBBox();
+  n.doc, o = a - s, x > l && (o = (l - h) / 2 + s), Math.abs(a - u.x) < s && x > l && (o = a - (x - l) / 2);
+  const b = 1 - t().state.textHeight;
+  return e.insert("rect", ":first-child").attr("x", o).attr("y", b).attr("class", g ? "alt-composit" : "composit").attr("width", h).attr(
+    "height",
+    u.height + t().state.textHeight + t().state.titleShift + 1
+  ).attr("rx", "0"), r.attr("x", o + s), x <= l && r.attr("x", a + (h - d) / 2 - x / 2 + s), e.insert("rect", ":first-child").attr("x", o).attr(
+    "y",
+    t().state.titleShift - t().state.textHeight - t().state.padding
+  ).attr("width", h).attr("height", t().state.textHeight * 3).attr("rx", t().state.radius), e.insert("rect", ":first-child").attr("x", o).attr(
+    "y",
+    t().state.titleShift - t().state.textHeight - t().state.padding
+  ).attr("width", h).attr("height", u.height + 3 + 2 * t().state.textHeight).attr("rx", t().state.radius), e;
+}, "addTitleAndBox"), X = /* @__PURE__ */ y((e) => (e.append("circle").attr("class", "end-state-outer").attr("r", t().state.sizeUnit + t().state.miniPadding).attr(
+  "cx",
+  t().state.padding + t().state.sizeUnit + t().state.miniPadding
+).attr(
+  "cy",
+  t().state.padding + t().state.sizeUnit + t().state.miniPadding
+), e.append("circle").attr("class", "end-state-inner").attr("r", t().state.sizeUnit).attr("cx", t().state.padding + t().state.sizeUnit + 2).attr("cy", t().state.padding + t().state.sizeUnit + 2)), "drawEndState"), q = /* @__PURE__ */ y((e, n) => {
+  let g = t().state.forkWidth, s = t().state.forkHeight;
+  if (n.parentId) {
+    let d = g;
+    g = s, s = d;
+  }
+  return e.append("rect").style("stroke", "black").style("fill", "black").attr("width", g).attr("height", s).attr("x", t().state.padding).attr("y", t().state.padding);
+}, "drawForkJoinState"), Z = /* @__PURE__ */ y((e, n, g, s) => {
+  let d = 0;
+  const c = s.append("text");
+  c.style("text-anchor", "start"), c.attr("class", "noteText");
+  let l = e.replace(/\r\n/g, "<br/>");
+  l = l.replace(/\n/g, "<br/>");
+  const a = l.split(H.lineBreakRegex);
+  let r = 1.25 * t().state.noteMargin;
+  for (const x of a) {
+    const h = x.trim();
+    if (h.length > 0) {
+      const o = c.append("tspan");
+      if (o.text(h), r === 0) {
+        const u = o.node().getBBox();
+        r += u.height;
+      }
+      d += r, o.attr("x", n + t().state.noteMargin), o.attr("y", g + d + 1.25 * t().state.noteMargin);
+    }
+  }
+  return { textWidth: c.node().getBBox().width, textHeight: d };
+}, "_drawLongText"), _ = /* @__PURE__ */ y((e, n) => {
+  n.attr("class", "state-note");
+  const g = n.append("rect").attr("x", 0).attr("y", t().state.padding), s = n.append("g"), { textWidth: d, textHeight: c } = Z(e, 0, 0, s);
+  return g.attr("height", c + 2 * t().state.noteMargin), g.attr("width", d + t().state.noteMargin * 2), g;
+}, "drawNote"), T = /* @__PURE__ */ y(function(e, n) {
+  const g = n.id, s = {
+    id: g,
+    label: n.id,
+    width: 0,
+    height: 0
+  }, d = e.append("g").attr("id", g).attr("class", "stateGroup");
+  n.type === "start" && W(d), n.type === "end" && X(d), (n.type === "fork" || n.type === "join") && q(d, n), n.type === "note" && _(n.note.text, d), n.type === "divider" && j(d), n.type === "default" && n.descriptions.length === 0 && F(d, n), n.type === "default" && n.descriptions.length > 0 && J(d, n);
+  const c = d.node().getBBox();
+  return s.width = c.width + 2 * t().state.padding, s.height = c.height + 2 * t().state.padding, s;
+}, "drawState"), L = 0, K = /* @__PURE__ */ y(function(e, n, g) {
+  const s = /* @__PURE__ */ y(function(r) {
+    switch (r) {
+      case M.relationType.AGGREGATION:
+        return "aggregation";
+      case M.relationType.EXTENSION:
+        return "extension";
+      case M.relationType.COMPOSITION:
+        return "composition";
+      case M.relationType.DEPENDENCY:
+        return "dependency";
+    }
+  }, "getRelationType");
+  n.points = n.points.filter((r) => !Number.isNaN(r.y));
+  const d = n.points, c = O().x(function(r) {
+    return r.x;
+  }).y(function(r) {
+    return r.y;
+  }).curve(P), l = e.append("path").attr("d", c(d)).attr("id", "edge" + L).attr("class", "transition");
+  let a = "";
+  if (t().state.arrowMarkerAbsolute && (a = R(!0)), l.attr(
+    "marker-end",
+    "url(" + a + "#" + s(M.relationType.DEPENDENCY) + "End)"
+  ), g.title !== void 0) {
+    const r = e.append("g").attr("class", "stateLabel"), { x, y: h } = C.calcLabelPosition(n.points), o = H.getRows(g.title);
+    let u = 0;
+    const b = [];
+    let m = 0, S = 0;
+    for (let f = 0; f <= o.length; f++) {
+      const p = r.append("text").attr("text-anchor", "middle").text(o[f]).attr("x", x).attr("y", h + u), w = p.node().getBBox();
+      m = Math.max(m, w.width), S = Math.min(S, w.x), k.info(w.x, x, h + u), u === 0 && (u = p.node().getBBox().height, k.info("Title height", u, h)), b.push(p);
+    }
+    let N = u * o.length;
+    if (o.length > 1) {
+      const f = (o.length - 1) * u * 0.5;
+      b.forEach((p, w) => p.attr("y", h + w * u - f)), N = u * o.length;
+    }
+    const i = r.node().getBBox();
+    r.insert("rect", ":first-child").attr("class", "box").attr("x", x - m / 2 - t().state.padding / 2).attr("y", h - N / 2 - t().state.padding / 2 - 3.5).attr("width", m + t().state.padding).attr("height", N + t().state.padding), k.info(i);
+  }
+  L++;
+}, "drawEdge"), B, z = {}, Q = /* @__PURE__ */ y(function() {
+}, "setConf"), V = /* @__PURE__ */ y(function(e) {
+  e.append("defs").append("marker").attr("id", "dependencyEnd").attr("refX", 19).attr("refY", 7).attr("markerWidth", 20).attr("markerHeight", 28).attr("orient", "auto").append("path").attr("d", "M 19,7 L9,13 L14,7 L9,1 Z");
+}, "insertMarkers"), tt = /* @__PURE__ */ y(function(e, n, g, s) {
+  B = t().state;
+  const d = t().securityLevel;
+  let c;
+  d === "sandbox" && (c = v("#i" + n));
+  const l = d === "sandbox" ? v(c.nodes()[0].contentDocument.body) : v("body"), a = d === "sandbox" ? c.nodes()[0].contentDocument : document;
+  k.debug("Rendering diagram " + e);
+  const r = l.select(`[id='${n}']`);
+  V(r);
+  const x = s.db.getRootDoc();
+  D(x, r, void 0, !1, l, a, s);
+  const h = B.padding, o = r.node().getBBox(), u = o.width + h * 2, b = o.height + h * 2, m = u * 1.75;
+  U(r, b, m, B.useMaxWidth), r.attr(
+    "viewBox",
+    `${o.x - B.padding}  ${o.y - B.padding} ` + u + " " + b
+  );
+}, "draw"), et = /* @__PURE__ */ y((e) => e ? e.length * B.fontSizeFactor : 1, "getLabelWidth"), D = /* @__PURE__ */ y((e, n, g, s, d, c, l) => {
+  const a = new I({
+    compound: !0,
+    multigraph: !0
+  });
+  let r, x = !0;
+  for (r = 0; r < e.length; r++)
+    if (e[r].stmt === "relation") {
+      x = !1;
+      break;
+    }
+  g ? a.setGraph({
+    rankdir: "LR",
+    multigraph: !0,
+    compound: !0,
+    // acyclicer: 'greedy',
+    ranker: "tight-tree",
+    ranksep: x ? 1 : B.edgeLengthFactor,
+    nodeSep: x ? 1 : 50,
+    isMultiGraph: !0
+    // ranksep: 5,
+    // nodesep: 1
+  }) : a.setGraph({
+    rankdir: "TB",
+    multigraph: !0,
+    compound: !0,
+    // isCompound: true,
+    // acyclicer: 'greedy',
+    // ranker: 'longest-path'
+    ranksep: x ? 1 : B.edgeLengthFactor,
+    nodeSep: x ? 1 : 50,
+    ranker: "tight-tree",
+    // ranker: 'network-simplex'
+    isMultiGraph: !0
+  }), a.setDefaultEdgeLabel(function() {
+    return {};
+  });
+  const h = l.db.getStates(), o = l.db.getRelations(), u = Object.keys(h);
+  for (const i of u) {
+    const f = h[i];
+    g && (f.parentId = g);
+    let p;
+    if (f.doc) {
+      let w = n.append("g").attr("id", f.id).attr("class", "stateGroup");
+      p = D(f.doc, w, f.id, !s, d, c, l);
+      {
+        w = Y(w, f, s);
+        let E = w.node().getBBox();
+        p.width = E.width, p.height = E.height + B.padding / 2, z[f.id] = { y: B.compositTitleSize };
+      }
+    } else
+      p = T(n, f, a);
+    if (f.note) {
+      const w = {
+        descriptions: [],
+        id: f.id + "-note",
+        note: f.note,
+        type: "note"
+      }, E = T(n, w, a);
+      f.note.position === "left of" ? (a.setNode(p.id + "-note", E), a.setNode(p.id, p)) : (a.setNode(p.id, p), a.setNode(p.id + "-note", E)), a.setParent(p.id, p.id + "-group"), a.setParent(p.id + "-note", p.id + "-group");
+    } else
+      a.setNode(p.id, p);
+  }
+  k.debug("Count=", a.nodeCount(), a);
+  let b = 0;
+  o.forEach(function(i) {
+    b++, k.debug("Setting edge", i), a.setEdge(
+      i.id1,
+      i.id2,
+      {
+        relation: i,
+        width: et(i.title),
+        height: B.labelHeight * H.getRows(i.title).length,
+        labelpos: "c"
+      },
+      "id" + b
+    );
+  }), $(a), k.debug("Graph after layout", a.nodes());
+  const m = n.node();
+  a.nodes().forEach(function(i) {
+    i !== void 0 && a.node(i) !== void 0 ? (k.warn("Node " + i + ": " + JSON.stringify(a.node(i))), d.select("#" + m.id + " #" + i).attr(
+      "transform",
+      "translate(" + (a.node(i).x - a.node(i).width / 2) + "," + (a.node(i).y + (z[i] ? z[i].y : 0) - a.node(i).height / 2) + " )"
+    ), d.select("#" + m.id + " #" + i).attr("data-x-shift", a.node(i).x - a.node(i).width / 2), c.querySelectorAll("#" + m.id + " #" + i + " .divider").forEach((f) => {
+      const p = f.parentElement;
+      let w = 0, E = 0;
+      p && (p.parentElement && (w = p.parentElement.getBBox().width), E = parseInt(p.getAttribute("data-x-shift"), 10), Number.isNaN(E) && (E = 0)), f.setAttribute("x1", 0 - E + 8), f.setAttribute("x2", w - E - 8);
+    })) : k.debug("No Node " + i + ": " + JSON.stringify(a.node(i)));
+  });
+  let S = m.getBBox();
+  a.edges().forEach(function(i) {
+    i !== void 0 && a.edge(i) !== void 0 && (k.debug("Edge " + i.v + " -> " + i.w + ": " + JSON.stringify(a.edge(i))), K(n, a.edge(i), a.edge(i).relation));
+  }), S = m.getBBox();
+  const N = {
+    id: g || "root",
+    label: g || "root",
+    width: 0,
+    height: 0
+  };
+  return N.width = S.width + 2 * B.padding, N.height = S.height + 2 * B.padding, k.debug("Doc rendered", N, a), N;
+}, "renderDoc"), at = {
+  setConf: Q,
+  draw: tt
+}, st = {
+  parser: A,
+  get db() {
+    return new M(1);
+  },
+  renderer: at,
+  styles: G,
+  init: /* @__PURE__ */ y((e) => {
+    e.state || (e.state = {}), e.state.arrowMarkerAbsolute = e.arrowMarkerAbsolute;
+  }, "init")
+};
+export {
+  st as diagram
+};

package/dist/stateDiagram-v2-4FDKWEC3-CEZFbksU-BywmU88h.js

@@ -0,0 +1,17 @@
+import { U as e, V as a, B as t, M as o } from "./chunk-DI55MBZ5-BY2XXvZz-DbAvz3Pq.js";
+import { x as s } from "./index-B5s_uaP2.js";
+typeof window < "u" && (window.global = window);
+var w = {
+  parser: t,
+  get db() {
+    return new o(2);
+  },
+  renderer: a,
+  styles: e,
+  init: /* @__PURE__ */ s((r) => {
+    r.state || (r.state = {}), r.state.arrowMarkerAbsolute = r.arrowMarkerAbsolute;
+  }, "init")
+};
+export {
+  w as diagram
+};