@tylertech/forge-ai 0.4.0 → 0.5.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (129) hide show
  1. package/custom-elements.json +4691 -637
  2. package/dist/ai-actions-toolbar/ai-actions-toolbar.d.ts +24 -1
  3. package/dist/ai-actions-toolbar/ai-actions-toolbar.mjs +171 -42
  4. package/dist/ai-actions-toolbar/ai-actions-toolbar.scss.mjs +1 -1
  5. package/dist/ai-agent-info/ai-agent-info.d.ts +29 -0
  6. package/dist/ai-agent-info/ai-agent-info.mjs +123 -0
  7. package/dist/ai-agent-info/ai-agent-info.scss.mjs +4 -0
  8. package/dist/ai-agent-info/index.d.ts +1 -0
  9. package/dist/ai-agent-info/index.mjs +5 -0
  10. package/dist/ai-artifact/ai-artifact.scss.mjs +1 -1
  11. package/dist/ai-attachment/ai-attachment.d.ts +39 -0
  12. package/dist/ai-attachment/ai-attachment.mjs +130 -0
  13. package/dist/ai-attachment/ai-attachment.scss.mjs +4 -0
  14. package/dist/ai-attachment/index.d.ts +1 -0
  15. package/dist/ai-attachment/index.mjs +5 -0
  16. package/dist/ai-button/ai-button.mjs +1 -0
  17. package/dist/ai-button/ai-button.scss.mjs +1 -1
  18. package/dist/ai-chain-of-thought/thought-base/thought-base.scss.mjs +1 -1
  19. package/dist/ai-chat-header/ai-chat-header.d.ts +35 -17
  20. package/dist/ai-chat-header/ai-chat-header.mjs +130 -30
  21. package/dist/ai-chat-header/ai-chat-header.scss.mjs +1 -1
  22. package/dist/ai-chat-header/index.d.ts +1 -0
  23. package/dist/ai-chat-interface/ai-chat-interface.d.ts +2 -4
  24. package/dist/ai-chat-interface/ai-chat-interface.mjs +24 -28
  25. package/dist/ai-chat-interface/ai-chat-interface.scss.mjs +1 -1
  26. package/dist/ai-chatbot/ag-ui-adapter.d.ts +22 -0
  27. package/dist/ai-chatbot/ag-ui-adapter.mjs +331 -0
  28. package/dist/ai-chatbot/agent-adapter.d.ts +125 -0
  29. package/dist/ai-chatbot/agent-adapter.mjs +136 -0
  30. package/dist/ai-chatbot/agent-runner.d.ts +41 -0
  31. package/dist/ai-chatbot/agent-runner.mjs +264 -0
  32. package/dist/ai-chatbot/ai-chatbot-tool-call.d.ts +21 -0
  33. package/dist/ai-chatbot/ai-chatbot-tool-call.mjs +189 -0
  34. package/dist/ai-chatbot/ai-chatbot-tool-call.scss.mjs +4 -0
  35. package/dist/ai-chatbot/ai-chatbot.d.ts +133 -0
  36. package/dist/ai-chatbot/ai-chatbot.mjs +755 -0
  37. package/dist/ai-chatbot/ai-chatbot.scss.mjs +4 -0
  38. package/dist/ai-chatbot/create-tool-renderer.d.ts +12 -0
  39. package/dist/ai-chatbot/create-tool-renderer.mjs +28 -0
  40. package/dist/ai-chatbot/event-emitter.d.ts +43 -0
  41. package/dist/ai-chatbot/event-emitter.mjs +81 -0
  42. package/dist/ai-chatbot/file-upload-manager.d.ts +27 -0
  43. package/dist/ai-chatbot/file-upload-manager.mjs +106 -0
  44. package/dist/ai-chatbot/http-agent-with-credentials.d.ts +8 -0
  45. package/dist/ai-chatbot/http-agent-with-credentials.mjs +14 -0
  46. package/dist/ai-chatbot/index.d.ts +15 -0
  47. package/dist/ai-chatbot/index.mjs +30 -0
  48. package/dist/ai-chatbot/markdown-stream-controller.d.ts +13 -0
  49. package/dist/ai-chatbot/markdown-stream-controller.mjs +49 -0
  50. package/dist/ai-chatbot/message-state-controller.d.ts +45 -0
  51. package/dist/ai-chatbot/message-state-controller.mjs +168 -0
  52. package/dist/ai-chatbot/types.d.ts +120 -0
  53. package/dist/ai-chatbot/utils.d.ts +12 -0
  54. package/dist/ai-chatbot/utils.mjs +31 -0
  55. package/dist/ai-confirmation-prompt/ai-confirmation-prompt.d.ts +28 -0
  56. package/dist/ai-confirmation-prompt/ai-confirmation-prompt.mjs +89 -0
  57. package/dist/ai-confirmation-prompt/ai-confirmation-prompt.scss.mjs +4 -0
  58. package/dist/ai-confirmation-prompt/index.d.ts +1 -0
  59. package/dist/ai-confirmation-prompt/index.mjs +5 -0
  60. package/dist/ai-dialog/ai-dialog.scss.mjs +1 -1
  61. package/dist/ai-dropdown-menu/ai-dropdown-menu-item.d.ts +0 -6
  62. package/dist/ai-dropdown-menu/ai-dropdown-menu-item.mjs +3 -16
  63. package/dist/ai-dropdown-menu/ai-dropdown-menu-item.scss.mjs +1 -1
  64. package/dist/ai-dropdown-menu/ai-dropdown-menu.d.ts +6 -0
  65. package/dist/ai-dropdown-menu/ai-dropdown-menu.mjs +6 -2
  66. package/dist/ai-dropdown-menu/ai-dropdown-menu.scss.mjs +1 -1
  67. package/dist/ai-embedded-chat/ai-embedded-chat.d.ts +18 -5
  68. package/dist/ai-embedded-chat/ai-embedded-chat.mjs +43 -18
  69. package/dist/ai-empty-state/ai-empty-state.d.ts +4 -2
  70. package/dist/ai-empty-state/ai-empty-state.mjs +237 -57
  71. package/dist/ai-empty-state/ai-empty-state.scss.mjs +1 -1
  72. package/dist/ai-error-message/ai-error-message.d.ts +19 -0
  73. package/dist/ai-error-message/ai-error-message.mjs +44 -0
  74. package/dist/ai-error-message/ai-error-message.scss.mjs +4 -0
  75. package/dist/ai-error-message/index.d.ts +1 -0
  76. package/dist/ai-error-message/index.mjs +5 -0
  77. package/dist/ai-fab/ai-fab.scss.mjs +1 -1
  78. package/dist/ai-file-picker/ai-file-picker.d.ts +20 -1
  79. package/dist/ai-file-picker/ai-file-picker.mjs +67 -20
  80. package/dist/ai-file-picker/ai-file-picker.scss.mjs +1 -1
  81. package/dist/ai-file-picker/index.d.ts +1 -1
  82. package/dist/ai-floating-chat/ai-floating-chat.d.ts +5 -30
  83. package/dist/ai-floating-chat/ai-floating-chat.mjs +19 -42
  84. package/dist/ai-message-thread/ai-message-thread.d.ts +58 -0
  85. package/dist/ai-message-thread/ai-message-thread.mjs +224 -0
  86. package/dist/ai-message-thread/ai-message-thread.scss.mjs +4 -0
  87. package/dist/ai-message-thread/index.d.ts +2 -0
  88. package/dist/ai-message-thread/index.mjs +5 -0
  89. package/dist/ai-modal/ai-modal.d.ts +6 -0
  90. package/dist/ai-modal/ai-modal.mjs +31 -14
  91. package/dist/ai-modal/ai-modal.scss.mjs +1 -1
  92. package/dist/ai-prompt/ai-prompt.mjs +3 -6
  93. package/dist/ai-prompt/ai-prompt.scss.mjs +1 -1
  94. package/dist/ai-prompt/prompt-button/prompt-button.scss.mjs +1 -1
  95. package/dist/ai-response-message/ai-response-message.d.ts +12 -21
  96. package/dist/ai-response-message/ai-response-message.mjs +32 -89
  97. package/dist/ai-response-message/ai-response-message.scss.mjs +1 -1
  98. package/dist/ai-sidebar/ai-sidebar.mjs +1 -1
  99. package/dist/ai-sidebar-chat/ai-sidebar-chat.d.ts +5 -29
  100. package/dist/ai-sidebar-chat/ai-sidebar-chat.mjs +23 -43
  101. package/dist/ai-spinner/ai-spinner.d.ts +24 -0
  102. package/dist/ai-spinner/ai-spinner.mjs +41 -0
  103. package/dist/ai-spinner/ai-spinner.scss.mjs +4 -0
  104. package/dist/ai-spinner/index.d.ts +1 -0
  105. package/dist/ai-spinner/index.mjs +5 -0
  106. package/dist/ai-suggestions/ai-suggestions.d.ts +2 -0
  107. package/dist/ai-suggestions/ai-suggestions.mjs +66 -7
  108. package/dist/ai-suggestions/ai-suggestions.scss.mjs +1 -1
  109. package/dist/ai-suggestions/index.d.ts +2 -1
  110. package/dist/ai-thinking-indicator/ai-thinking-indicator.d.ts +3 -1
  111. package/dist/ai-thinking-indicator/ai-thinking-indicator.mjs +83 -3
  112. package/dist/ai-thinking-indicator/ai-thinking-indicator.scss.mjs +317 -1
  113. package/dist/ai-threads/ai-threads.d.ts +9 -4
  114. package/dist/ai-threads/ai-threads.mjs +21 -41
  115. package/dist/ai-threads/ai-threads.scss.mjs +1 -1
  116. package/dist/ai-user-message/ai-user-message.scss.mjs +1 -1
  117. package/dist/ai-voice-input/ai-voice-input.scss.mjs +1 -1
  118. package/dist/core/drag-controller.mjs +3 -0
  119. package/dist/core/overlay/overlay.d.ts +10 -0
  120. package/dist/core/overlay/overlay.mjs +24 -4
  121. package/dist/core/popover/popover.d.ts +17 -7
  122. package/dist/core/popover/popover.mjs +17 -3
  123. package/dist/core/popover/popover.scss.mjs +1 -1
  124. package/dist/core/tooltip/tooltip.d.ts +8 -7
  125. package/dist/core/tooltip/tooltip.mjs +45 -16
  126. package/dist/core/tooltip/tooltip.scss.mjs +1 -1
  127. package/dist/index.d.ts +10 -4
  128. package/dist/index.mjs +52 -9
  129. package/package.json +64 -60
@@ -1,4 +1,4 @@
1
- const styles = '/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/* prettier-ignore */\n.forge-button {\n --_button-primary-color: var(--forge-button-primary-color, var(--forge-theme-primary, #3f51b5));\n --_button-text-color: var(--forge-button-text-color, var(--_button-primary-color));\n --_button-disabled-color: var(--forge-button-disabled-color, var(--forge-theme-surface-container, #e0e0e0));\n --_button-padding: var(--forge-button-padding, var(--forge-spacing-medium, 16px));\n --_button-display: var(--forge-button-display, inline-grid);\n --_button-justify: var(--forge-button-justify, center);\n --_button-shape: var(--forge-button-shape, calc(var(--forge-shape-medium, 4px) * var(--forge-shape-factor, 1)));\n --_button-height: var(--forge-button-height, 36px);\n --_button-min-width: var(--forge-button-min-width, 64px);\n --_button-spacing: var(--forge-button-spacing, var(--forge-spacing-xsmall, 8px));\n --_button-border-width: var(--forge-button-border-width, medium);\n --_button-border-style: var(--forge-button-border-style, none);\n --_button-border-color: var(--forge-button-border-color, currentColor);\n --_button-shape-start-start-radius: var(--forge-button-shape-start-start-radius, var(--_button-shape));\n --_button-shape-start-end-radius: var(--forge-button-shape-start-end-radius, var(--_button-shape));\n --_button-shape-end-start-radius: var(--forge-button-shape-end-start-radius, var(--_button-shape));\n --_button-shape-end-end-radius: var(--forge-button-shape-end-end-radius, var(--_button-shape));\n --_button-padding-block: var(--forge-button-padding-block, var(--_button-0));\n --_button-padding-inline: var(--forge-button-padding-inline, var(--_button-padding));\n --_button-background: var(--forge-button-background, transparent);\n --_button-hover-background: var(--forge-button-hover-background, var(--_button-background));\n --_button-active-background: var(--forge-button-active-background, var(--_button-background));\n --_button-color: var(--forge-button-color, var(--_button-text-color));\n --_button-icon-size: var(--forge-button-icon-size, calc(var(--forge-typography-font-size, 1rem) * 1.125));\n --_button-shadow: var(--forge-button-shadow, none);\n --_button-hover-shadow: var(--forge-button-hover-shadow, none);\n --_button-active-shadow: var(--forge-button-active-shadow, none);\n --_button-cursor: var(--forge-button-cursor, pointer);\n --_button-transition-duration: var(--forge-button-transition-duration, var(--forge-animation-duration-short3, 150ms));\n --_button-transition-timing: var(--forge-button-transition-timing, var(--forge-animation-easing-standard, cubic-bezier(0.2, 0, 0, 1)));\n --_button-text-padding-inline: var(--forge-button-text-padding-inline, var(--forge-spacing-xsmall, 8px));\n --_button-outlined-background: var(--forge-button-outlined-background, transparent);\n --_button-outlined-color: var(--forge-button-outlined-color, var(--_button-primary-color));\n --_button-outlined-border-width: var(--forge-button-outlined-border-width, var(--forge-border-thin, 1px));\n --_button-outlined-border-style: var(--forge-button-outlined-border-style, solid);\n --_button-outlined-border-color: var(--forge-button-outlined-border-color, var(--_button-primary-color));\n --_button-tonal-background: var(--forge-button-tonal-background, var(--forge-theme-primary-container, #d1d5ed));\n --_button-tonal-disabled-background: var(--forge-button-tonal-disabled-background, var(--_button-disabled-color));\n --_button-tonal-color: var(--forge-button-tonal-color, var(--forge-theme-on-primary-container, #222c62));\n --_button-tonal-disabled-color: var(--forge-button-tonal-disabled-color, var(--_button-disabled-text-color));\n --_button-filled-background: var(--forge-button-filled-background, var(--_button-primary-color));\n --_button-filled-disabled-background: var(--forge-button-filled-disabled-background, var(--_button-disabled-color));\n --_button-filled-color: var(--forge-button-filled-color, var(--forge-theme-on-primary, #ffffff));\n --_button-filled-disabled-color: var(--forge-button-filled-disabled-color, var(--_button-disabled-text-color));\n --_button-raised-background: var(--forge-button-raised-background, var(--_button-primary-color));\n --_button-raised-disabled-background: var(--forge-button-raised-disabled-background, var(--_button-disabled-color));\n --_button-raised-color: var(--forge-button-raised-color, var(--forge-theme-on-primary, #ffffff));\n --_button-raised-disabled-color: var(--forge-button-raised-disabled-color, var(--_button-disabled-text-color));\n --_button-raised-shadow: var(--forge-button-raised-shadow, 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12));\n --_button-raised-hover-shadow: var(--forge-button-raised-hover-shadow, 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12));\n --_button-raised-active-shadow: var(--forge-button-raised-active-shadow, 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12));\n --_button-raised-disabled-shadow: var(--forge-button-raised-disabled-shadow, none);\n --_button-link-color: var(--forge-button-link-color, var(--_button-primary-color));\n --_button-link-text-decoration: var(--forge-button-link-text-decoration, underline);\n --_button-link-height: var(--forge-button-link-height, auto);\n --_button-link-padding: var(--forge-button-link-padding, 0);\n --_button-link-line-height: var(--forge-button-link-line-height, normal);\n --_button-link-width: var(--forge-button-link-width, auto);\n --_button-link-hover-text-decoration: var(--forge-button-link-hover-text-decoration, none);\n --_button-link-active-opacity: var(--forge-button-link-active-opacity, 0.65);\n --_button-link-transition-duration: var(--forge-button-link-transition-duration, var(--forge-animation-duration-short3, 150ms));\n --_button-link-transition-timing: var(--forge-button-link-transition-timing, var(--forge-animation-easing-standard, cubic-bezier(0.2, 0, 0, 1)));\n --_button-disabled-cursor: var(--forge-button-disabled-cursor, not-allowed);\n --_button-disabled-text-color: var(--forge-button-disabled-text-color, var(--forge-theme-text-low, rgba(0, 0, 0, 0.38)));\n --_button-disabled-background: var(--forge-button-disabled-background, transparent);\n --_button-disabled-border-color: var(--forge-button-disabled-border-color, var(--_button-disabled-color));\n --_button-disabled-shadow: var(--forge-button-disabled-shadow, none);\n --_button-dense-height: var(--forge-button-dense-height, 24px);\n --_button-pill-shape: var(--forge-button-pill-shape, calc(var(--forge-shape-full, 9999px) * var(--forge-shape-factor, 1)));\n --_button-pill-padding-inline: var(--forge-button-pill-padding-inline, var(--forge-spacing-small, 12px));\n --_button-focus-indicator-offset: var(--forge-button-focus-indicator-offset, 4px);\n --_button-text-focus-indicator-offset: var(--forge-button-text-focus-indicator-offset, 0px);\n --_button-link-focus-indicator-offset: var(--forge-button-link-focus-indicator-offset, 2px);\n --_button-popover-icon-transition-duration: var(--forge-button-popover-icon-transition-duration, var(--forge-animation-duration-short3, 150ms));\n --_button-popover-icon-transition-timing: var(--forge-button-popover-icon-transition-timing, var(--forge-animation-easing-standard, cubic-bezier(0.2, 0, 0, 1)));\n --_button-popover-icon-open-rotation: var(--forge-button-popover-icon-open-rotation, 180deg);\n}\n\n.forge-button {\n display: var(--_button-display);\n position: relative;\n outline: none;\n vertical-align: middle;\n -webkit-tap-highlight-color: transparent;\n -moz-osx-font-smoothing: grayscale;\n -webkit-font-smoothing: antialiased;\n font-family: var(--forge-typography-button-font-family, var(--forge-typography-font-family, "Roboto", sans-serif));\n font-size: var(--forge-typography-button-font-size, calc(var(--forge-typography-font-size, 1rem) * var(--forge-typography-button-font-size-scale, 0.875)));\n font-weight: var(--forge-typography-button-font-weight, 500);\n line-height: var(--forge-typography-button-line-height, normal);\n letter-spacing: var(--forge-typography-button-letter-spacing, 0.0714285714em);\n text-transform: var(--forge-typography-button-text-transform, inherit);\n text-decoration: var(--forge-typography-button-text-decoration, inherit);\n position: relative;\n display: var(--_button-display);\n grid-auto-flow: column;\n align-items: center;\n justify-content: var(--_button-justify);\n gap: var(--_button-spacing);\n z-index: 0;\n box-sizing: border-box;\n min-inline-size: var(--_button-min-width);\n height: var(--_button-height);\n inline-size: 100%;\n border-width: var(--_button-border-width);\n border-style: var(--_button-border-style);\n border-color: var(--_button-border-color);\n border-start-start-radius: var(--_button-shape-start-start-radius);\n border-start-end-radius: var(--_button-shape-start-end-radius);\n border-end-start-radius: var(--_button-shape-end-start-radius);\n border-end-end-radius: var(--_button-shape-end-end-radius);\n padding-block: var(--_button-padding-block);\n padding-inline: var(--_button-padding-inline);\n box-shadow: var(--_button-shadow);\n outline: none;\n user-select: none;\n -webkit-appearance: none;\n vertical-align: middle;\n text-decoration: none;\n white-space: nowrap;\n background: var(--_button-background);\n color: var(--_button-color);\n cursor: var(--_button-cursor);\n transition-property: box-shadow, background;\n transition-duration: var(--_button-transition-duration);\n transition-timing-function: var(--_button-transition-timing);\n}\n\n.forge-button::-moz-focus-inner {\n padding: 0;\n border: 0;\n}\n\n.forge-button:hover {\n --_button-shadow: var(--_button-hover-shadow);\n background: var(--_button-hover-background);\n}\n\n.forge-button:active {\n --_button-shadow: var(--_button-active-shadow);\n background: var(--_button-active-background);\n}\n\n.forge-button {\n position: relative;\n inline-size: auto;\n}\n\n.forge-button:not(:disabled):not(.forge-button--link) {\n --_state-layer-display: var(--forge-state-layer-display, flex);\n --_state-layer-color: var(--forge-state-layer-color, var(--forge-theme-on-surface, #000000));\n --_state-layer-hover-color: var(--forge-state-layer-hover-color, var(--_state-layer-color));\n --_state-layer-hover-opacity: var(--forge-state-layer-hover-opacity, 0.08);\n --_state-layer-pressed-color: var(--forge-state-layer-pressed-color, var(--_state-layer-color));\n --_state-layer-pressed-opacity: var(--forge-state-layer-pressed-opacity, 0.12);\n --_state-layer-hover-duration: var(--forge-state-layer-hover-duration, 15ms);\n --_state-layer-pressed-duration: var(--forge-state-layer-pressed-duration, 105ms);\n --_state-layer-animation-duration: var(--forge-state-layer-animation-duration, 375ms);\n}\n\n.forge-button:not(:disabled):not(.forge-button--link)::before {\n opacity: 0;\n position: absolute;\n background-color: var(--_state-layer-hover-color);\n inset: 0;\n transition: opacity var(--_state-layer-hover-duration) linear, background-color var(--_state-layer-hover-duration) linear;\n --_state-layer-hover-duration: var(--forge-state-layer-hover-duration, 100ms);\n content: "";\n opacity: 0;\n border-radius: inherit;\n}\n\n.forge-button:not(:disabled):not(.forge-button--link):hover::before {\n background-color: var(--_state-layer-hover-color);\n opacity: var(--_state-layer-hover-opacity);\n}\n\n.forge-button:not(:disabled):not(.forge-button--link):active::before {\n opacity: var(--_state-layer-pressed-opacity);\n transition-duration: var(--_state-layer-pressed-duration);\n --_state-layer-pressed-opacity: var(--forge-state-layer-pressed-opacity, 0.18);\n}\n\n@keyframes forge-focus-indicator-outward-grow {\n from {\n outline-width: 0;\n }\n to {\n outline-width: var(--_focus-indicator-active-width);\n }\n}\n@keyframes forge-focus-indicator-outward-shrink {\n from {\n outline-width: var(--_focus-indicator-active-width);\n }\n}\n@keyframes forge-focus-indicator-inward-grow {\n from {\n border-width: 0;\n }\n to {\n border-width: var(--_focus-indicator-active-width);\n }\n}\n@keyframes forge-focus-indicator-inward-shrink {\n from {\n border-width: var(--_focus-indicator-active-width);\n }\n}\n.forge-button:not(:disabled) {\n outline: none;\n}\n\n.forge-button:not(:disabled):focus-visible::after {\n --_focus-indicator-display: var(--forge-focus-indicator-display, flex);\n --_focus-indicator-width: var(--forge-focus-indicator-width, var(--forge-border-medium, 2px));\n --_focus-indicator-active-width: var(--forge-focus-indicator-active-width, 6px);\n --_focus-indicator-color: var(--forge-focus-indicator-color, var(--forge-theme-primary, #3f51b5));\n --_focus-indicator-shape: var(--forge-focus-indicator-shape, calc(var(--forge-shape-extra-small, 1px) * var(--forge-shape-factor, 1)));\n --_focus-indicator-duration: var(--forge-focus-indicator-duration, var(--forge-animation-duration-long4, 600ms));\n --_focus-indicator-easing: var(--forge-focus-indicator-easing, var(--forge-animation-easing-emphasized, cubic-bezier(0.2, 0, 0, 1)));\n --_focus-indicator-shape-start-start: var(--forge-focus-indicator-shape-start-start, var(--_focus-indicator-shape));\n --_focus-indicator-shape-start-end: var(--forge-focus-indicator-shape-start-end, var(--_focus-indicator-shape));\n --_focus-indicator-shape-end-end: var(--forge-focus-indicator-shape-end-end, var(--_focus-indicator-shape));\n --_focus-indicator-shape-end-start: var(--forge-focus-indicator-shape-end-start, var(--_focus-indicator-shape));\n --_focus-indicator-outward-offset: var(--forge-focus-indicator-outward-offset, var(--forge-spacing-xxsmall, 4px));\n --_focus-indicator-inward-offset: var(--forge-focus-indicator-inward-offset, 0px);\n --_focus-indicator-offset-block: var(--forge-focus-indicator-offset-block, 0);\n --_focus-indicator-offset-inline: var(--forge-focus-indicator-offset-inline, 0);\n}\n\n.forge-button:not(:disabled):focus-visible::after {\n animation-delay: 0s, calc(var(--_focus-indicator-duration) * 0.25);\n animation-duration: calc(var(--_focus-indicator-duration) * 0.25), calc(var(--_focus-indicator-duration) * 0.75);\n animation-timing-function: var(--_focus-indicator-easing);\n box-sizing: border-box;\n color: var(--_focus-indicator-color);\n display: none;\n pointer-events: none;\n position: absolute;\n margin-block: var(--_focus-indicator-offset-block);\n margin-inline: var(--_focus-indicator-offset-inline);\n animation-name: forge-focus-indicator-outward-grow, forge-focus-indicator-outward-shrink;\n border-end-end-radius: calc(var(--_focus-indicator-shape-end-end) + var(--_focus-indicator-outward-offset));\n border-end-start-radius: calc(var(--_focus-indicator-shape-end-start) + var(--_focus-indicator-outward-offset));\n border-start-end-radius: calc(var(--_focus-indicator-shape-start-end) + var(--_focus-indicator-outward-offset));\n border-start-start-radius: calc(var(--_focus-indicator-shape-start-start) + var(--_focus-indicator-outward-offset));\n inset: calc(-1 * var(--_focus-indicator-outward-offset));\n outline: var(--_focus-indicator-width) solid currentColor;\n content: "";\n display: block;\n}\n\n.forge-button:not(:disabled) {\n --forge-focus-indicator-color: var(--_button-primary-color);\n}\n\n.forge-button:disabled {\n cursor: var(--_button-disabled-cursor);\n --_button-background: var(--_button-disabled-background);\n --_button-color: var(--_button-disabled-text-color);\n --_button-shadow: var(--_button-disabled-shadow);\n pointer-events: none;\n pointer-events: initial;\n}\n\n.forge-button:where(:not(.forge-button--outlined, .forge-button--tonal, .forge-button--filled, .forge-button--raised, .forge-button--link)), .forge-button--text {\n --_button-padding-inline: var(--_button-text-padding-inline);\n}\n\n.forge-button--outlined {\n --_button-background: var(--_button-outlined-background);\n --_button-color: var(--_button-outlined-color);\n --_button-border-width: var(--_button-outlined-border-width);\n --_button-border-style: var(--_button-outlined-border-style);\n --_button-border-color: var(--_button-outlined-border-color);\n}\n\n.forge-button--outlined:disabled {\n --_button-border-color: var(--_button-disabled-border-color);\n}\n\n.forge-button--tonal {\n --_button-background: var(--_button-tonal-background);\n --_button-color: var(--_button-tonal-color);\n}\n\n.forge-button--tonal:disabled {\n --_button-background: var(--_button-tonal-disabled-background);\n --_button-color: var(--_button-tonal-disabled-color);\n}\n\n.forge-button--filled, .forge-button--raised {\n --_button-background: var(--_button-filled-background);\n --_button-color: var(--_button-filled-color);\n --forge-state-layer-color: var(--_button-filled-color);\n}\n\n.forge-button--filled:disabled, .forge-button--raised:disabled {\n --_button-background: var(--_button-filled-disabled-background);\n --_button-color: var(--_button-filled-disabled-color);\n}\n\n.forge-button--raised {\n --_button-background: var(--_button-raised-background);\n --_button-color: var(--_button-raised-color);\n --_button-shadow: var(--_button-raised-shadow);\n}\n\n.forge-button--raised:hover {\n --_button-shadow: var(--_button-raised-hover-shadow);\n}\n\n.forge-button--raised:active {\n --_button-shadow: var(--_button-raised-active-shadow);\n}\n\n.forge-button--raised:disabled {\n --_button-background: var(--_button-raised-disabled-background);\n --_button-color: var(--_button-raised-disabled-color);\n --_button-shadow: var(--_button-raised-disabled-shadow);\n}\n\n.forge-button--link {\n --_button-color: var(--_button-link-color);\n --_button-height: var(--_button-link-height);\n --_button-padding: var(--_button-link-padding);\n --_button-focus-indicator-offset: var(--_button-link-focus-indicator-offset);\n text-decoration: var(--_button-link-text-decoration);\n line-height: var(--_button-link-line-height);\n transition: opacity var(--_button-link-transition-duration) var(--_button-link-transition-timing);\n inline-size: var(--_button-link-width);\n}\n\n.forge-button--link:hover {\n text-decoration: var(--_button-link-hover-text-decoration);\n}\n\n.forge-button--link:active {\n opacity: var(--_button-link-active-opacity);\n}\n\n.forge-button--pill {\n --_button-shape: var(--_button-pill-shape);\n --_button-padding-inline: var(--_button-pill-padding-inline);\n --forge-focus-indicator-shape: var(--_button-pill-shape);\n}\n\n.forge-button {\n --forge-icon-font-size: var(--_button-icon-size);\n}\n\n.forge-button--dense {\n --_button-height: var(--_button-dense-height);\n}\n\n:host {\n display: block;\n width: 100%;\n}\n\n.scroll-container {\n overflow: scroll;\n scrollbar-width: none;\n -webkit-overflow-scrolling: touch;\n width: 100%;\n height: 100%;\n}\n\n.suggestions-container {\n min-width: 100%;\n display: table;\n}\n\n.suggestions-inline {\n display: flex;\n align-items: center;\n flex-direction: row;\n flex-wrap: nowrap;\n width: max-content;\n gap: var(--forge-spacing-small, 12px);\n}\n\n.suggestions-block {\n display: flex;\n align-items: center;\n flex-direction: column;\n gap: var(--forge-spacing-small, 12px);\n}\n.suggestions-block > button {\n width: 100%;\n}\n\n.suggestion {\n --forge-button-shape: calc(var(--forge-shape-medium, 4px) * var(--forge-shape-factor, 1));\n --forge-button-tonal-background: var(--forge-theme-tertiary-container, #d0d7ff);\n --forge-button-tonal-color: var(--forge-theme-on-tertiary-container, #213189);\n}';
1
+ const styles = '/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/* prettier-ignore */\n.forge-button {\n --_button-primary-color: var(--forge-button-primary-color, var(--forge-theme-primary, #3f51b5));\n --_button-text-color: var(--forge-button-text-color, var(--_button-primary-color));\n --_button-disabled-color: var(--forge-button-disabled-color, var(--forge-theme-surface-container, #e0e0e0));\n --_button-padding: var(--forge-button-padding, var(--forge-spacing-medium, 16px));\n --_button-display: var(--forge-button-display, inline-grid);\n --_button-justify: var(--forge-button-justify, center);\n --_button-shape: var(--forge-button-shape, calc(var(--forge-shape-medium, 4px) * var(--forge-shape-factor, 1)));\n --_button-height: var(--forge-button-height, 36px);\n --_button-min-width: var(--forge-button-min-width, 64px);\n --_button-spacing: var(--forge-button-spacing, var(--forge-spacing-xsmall, 8px));\n --_button-border-width: var(--forge-button-border-width, medium);\n --_button-border-style: var(--forge-button-border-style, none);\n --_button-border-color: var(--forge-button-border-color, currentColor);\n --_button-shape-start-start-radius: var(--forge-button-shape-start-start-radius, var(--_button-shape));\n --_button-shape-start-end-radius: var(--forge-button-shape-start-end-radius, var(--_button-shape));\n --_button-shape-end-start-radius: var(--forge-button-shape-end-start-radius, var(--_button-shape));\n --_button-shape-end-end-radius: var(--forge-button-shape-end-end-radius, var(--_button-shape));\n --_button-padding-block: var(--forge-button-padding-block, var(--_button-0));\n --_button-padding-inline: var(--forge-button-padding-inline, var(--_button-padding));\n --_button-background: var(--forge-button-background, transparent);\n --_button-hover-background: var(--forge-button-hover-background, var(--_button-background));\n --_button-active-background: var(--forge-button-active-background, var(--_button-background));\n --_button-color: var(--forge-button-color, var(--_button-text-color));\n --_button-icon-size: var(--forge-button-icon-size, calc(var(--forge-typography-font-size, 1rem) * 1.125));\n --_button-shadow: var(--forge-button-shadow, none);\n --_button-hover-shadow: var(--forge-button-hover-shadow, none);\n --_button-active-shadow: var(--forge-button-active-shadow, none);\n --_button-cursor: var(--forge-button-cursor, pointer);\n --_button-transition-duration: var(--forge-button-transition-duration, var(--forge-animation-duration-short3, 150ms));\n --_button-transition-timing: var(--forge-button-transition-timing, var(--forge-animation-easing-standard, cubic-bezier(0.2, 0, 0, 1)));\n --_button-text-padding-inline: var(--forge-button-text-padding-inline, var(--forge-spacing-xsmall, 8px));\n --_button-outlined-background: var(--forge-button-outlined-background, transparent);\n --_button-outlined-color: var(--forge-button-outlined-color, var(--_button-primary-color));\n --_button-outlined-border-width: var(--forge-button-outlined-border-width, var(--forge-border-thin, 1px));\n --_button-outlined-border-style: var(--forge-button-outlined-border-style, solid);\n --_button-outlined-border-color: var(--forge-button-outlined-border-color, var(--_button-primary-color));\n --_button-tonal-background: var(--forge-button-tonal-background, var(--forge-theme-primary-container, #d1d5ed));\n --_button-tonal-disabled-background: var(--forge-button-tonal-disabled-background, var(--_button-disabled-color));\n --_button-tonal-color: var(--forge-button-tonal-color, var(--forge-theme-on-primary-container, #222c62));\n --_button-tonal-disabled-color: var(--forge-button-tonal-disabled-color, var(--_button-disabled-text-color));\n --_button-filled-background: var(--forge-button-filled-background, var(--_button-primary-color));\n --_button-filled-disabled-background: var(--forge-button-filled-disabled-background, var(--_button-disabled-color));\n --_button-filled-color: var(--forge-button-filled-color, var(--forge-theme-on-primary, #ffffff));\n --_button-filled-disabled-color: var(--forge-button-filled-disabled-color, var(--_button-disabled-text-color));\n --_button-raised-background: var(--forge-button-raised-background, var(--_button-primary-color));\n --_button-raised-disabled-background: var(--forge-button-raised-disabled-background, var(--_button-disabled-color));\n --_button-raised-color: var(--forge-button-raised-color, var(--forge-theme-on-primary, #ffffff));\n --_button-raised-disabled-color: var(--forge-button-raised-disabled-color, var(--_button-disabled-text-color));\n --_button-raised-shadow: var(--forge-button-raised-shadow, 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12));\n --_button-raised-hover-shadow: var(--forge-button-raised-hover-shadow, 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12));\n --_button-raised-active-shadow: var(--forge-button-raised-active-shadow, 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12));\n --_button-raised-disabled-shadow: var(--forge-button-raised-disabled-shadow, none);\n --_button-link-color: var(--forge-button-link-color, var(--_button-primary-color));\n --_button-link-text-decoration: var(--forge-button-link-text-decoration, underline);\n --_button-link-height: var(--forge-button-link-height, auto);\n --_button-link-padding: var(--forge-button-link-padding, 0);\n --_button-link-line-height: var(--forge-button-link-line-height, normal);\n --_button-link-width: var(--forge-button-link-width, auto);\n --_button-link-hover-text-decoration: var(--forge-button-link-hover-text-decoration, none);\n --_button-link-active-opacity: var(--forge-button-link-active-opacity, 0.65);\n --_button-link-transition-duration: var(--forge-button-link-transition-duration, var(--forge-animation-duration-short3, 150ms));\n --_button-link-transition-timing: var(--forge-button-link-transition-timing, var(--forge-animation-easing-standard, cubic-bezier(0.2, 0, 0, 1)));\n --_button-disabled-cursor: var(--forge-button-disabled-cursor, not-allowed);\n --_button-disabled-text-color: var(--forge-button-disabled-text-color, var(--forge-theme-text-low, rgba(0, 0, 0, 0.38)));\n --_button-disabled-background: var(--forge-button-disabled-background, transparent);\n --_button-disabled-border-color: var(--forge-button-disabled-border-color, var(--_button-disabled-color));\n --_button-disabled-shadow: var(--forge-button-disabled-shadow, none);\n --_button-dense-height: var(--forge-button-dense-height, 24px);\n --_button-pill-shape: var(--forge-button-pill-shape, calc(var(--forge-shape-full, 9999px) * var(--forge-shape-factor, 1)));\n --_button-pill-padding-inline: var(--forge-button-pill-padding-inline, var(--forge-spacing-small, 12px));\n --_button-focus-indicator-offset: var(--forge-button-focus-indicator-offset, 4px);\n --_button-text-focus-indicator-offset: var(--forge-button-text-focus-indicator-offset, 0px);\n --_button-link-focus-indicator-offset: var(--forge-button-link-focus-indicator-offset, 2px);\n --_button-popover-icon-transition-duration: var(--forge-button-popover-icon-transition-duration, var(--forge-animation-duration-short3, 150ms));\n --_button-popover-icon-transition-timing: var(--forge-button-popover-icon-transition-timing, var(--forge-animation-easing-standard, cubic-bezier(0.2, 0, 0, 1)));\n --_button-popover-icon-open-rotation: var(--forge-button-popover-icon-open-rotation, 180deg);\n}\n\n.forge-button {\n display: var(--_button-display);\n position: relative;\n outline: none;\n vertical-align: middle;\n -webkit-tap-highlight-color: transparent;\n -moz-osx-font-smoothing: grayscale;\n -webkit-font-smoothing: antialiased;\n font-family: var(--forge-typography-button-font-family, var(--forge-typography-font-family, "Roboto", sans-serif));\n font-size: var(--forge-typography-button-font-size, calc(var(--forge-typography-font-size, 1rem) * var(--forge-typography-button-font-size-scale, 0.875)));\n font-weight: var(--forge-typography-button-font-weight, 500);\n line-height: var(--forge-typography-button-line-height, normal);\n letter-spacing: var(--forge-typography-button-letter-spacing, 0.0714285714em);\n text-transform: var(--forge-typography-button-text-transform, inherit);\n text-decoration: var(--forge-typography-button-text-decoration, inherit);\n position: relative;\n display: var(--_button-display);\n grid-auto-flow: column;\n align-items: center;\n justify-content: var(--_button-justify);\n gap: var(--_button-spacing);\n z-index: 0;\n box-sizing: border-box;\n min-inline-size: var(--_button-min-width);\n height: var(--_button-height);\n inline-size: 100%;\n border-width: var(--_button-border-width);\n border-style: var(--_button-border-style);\n border-color: var(--_button-border-color);\n border-start-start-radius: var(--_button-shape-start-start-radius);\n border-start-end-radius: var(--_button-shape-start-end-radius);\n border-end-start-radius: var(--_button-shape-end-start-radius);\n border-end-end-radius: var(--_button-shape-end-end-radius);\n padding-block: var(--_button-padding-block);\n padding-inline: var(--_button-padding-inline);\n box-shadow: var(--_button-shadow);\n outline: none;\n user-select: none;\n -webkit-appearance: none;\n vertical-align: middle;\n text-decoration: none;\n white-space: nowrap;\n background: var(--_button-background);\n color: var(--_button-color);\n cursor: var(--_button-cursor);\n transition-property: box-shadow, background;\n transition-duration: var(--_button-transition-duration);\n transition-timing-function: var(--_button-transition-timing);\n}\n\n.forge-button::-moz-focus-inner {\n padding: 0;\n border: 0;\n}\n\n.forge-button:hover {\n --_button-shadow: var(--_button-hover-shadow);\n background: var(--_button-hover-background);\n}\n\n.forge-button:active {\n --_button-shadow: var(--_button-active-shadow);\n background: var(--_button-active-background);\n}\n\n.forge-button {\n position: relative;\n inline-size: auto;\n}\n\n.forge-button:not(:disabled):not(.forge-button--link) {\n --_state-layer-display: var(--forge-state-layer-display, flex);\n --_state-layer-color: var(--forge-state-layer-color, var(--forge-theme-on-surface, #000000));\n --_state-layer-hover-color: var(--forge-state-layer-hover-color, var(--_state-layer-color));\n --_state-layer-hover-opacity: var(--forge-state-layer-hover-opacity, 0.08);\n --_state-layer-pressed-color: var(--forge-state-layer-pressed-color, var(--_state-layer-color));\n --_state-layer-pressed-opacity: var(--forge-state-layer-pressed-opacity, 0.12);\n --_state-layer-hover-duration: var(--forge-state-layer-hover-duration, 15ms);\n --_state-layer-pressed-duration: var(--forge-state-layer-pressed-duration, 105ms);\n --_state-layer-animation-duration: var(--forge-state-layer-animation-duration, 375ms);\n}\n\n.forge-button:not(:disabled):not(.forge-button--link)::before {\n opacity: 0;\n position: absolute;\n backface-visibility: hidden;\n transform: translateZ(0);\n background-color: var(--_state-layer-hover-color);\n inset: 0;\n transition: opacity var(--_state-layer-hover-duration) linear, background-color var(--_state-layer-hover-duration) linear;\n --_state-layer-hover-duration: var(--forge-state-layer-hover-duration, 100ms);\n content: "";\n opacity: 0;\n border-radius: inherit;\n}\n\n.forge-button:not(:disabled):not(.forge-button--link):hover::before {\n background-color: var(--_state-layer-hover-color);\n opacity: var(--_state-layer-hover-opacity);\n}\n\n.forge-button:not(:disabled):not(.forge-button--link):active::before {\n opacity: var(--_state-layer-pressed-opacity);\n transition-duration: var(--_state-layer-pressed-duration);\n --_state-layer-pressed-opacity: var(--forge-state-layer-pressed-opacity, 0.18);\n}\n\n@keyframes forge-focus-indicator-outward-grow {\n from {\n outline-width: 0;\n }\n to {\n outline-width: var(--_focus-indicator-active-width);\n }\n}\n@keyframes forge-focus-indicator-outward-shrink {\n from {\n outline-width: var(--_focus-indicator-active-width);\n }\n}\n@keyframes forge-focus-indicator-inward-grow {\n from {\n border-width: 0;\n }\n to {\n border-width: var(--_focus-indicator-active-width);\n }\n}\n@keyframes forge-focus-indicator-inward-shrink {\n from {\n border-width: var(--_focus-indicator-active-width);\n }\n}\n.forge-button:not(:disabled) {\n outline: none;\n}\n\n.forge-button:not(:disabled):focus-visible::after {\n --_focus-indicator-display: var(--forge-focus-indicator-display, flex);\n --_focus-indicator-width: var(--forge-focus-indicator-width, var(--forge-border-medium, 2px));\n --_focus-indicator-active-width: var(--forge-focus-indicator-active-width, 6px);\n --_focus-indicator-color: var(--forge-focus-indicator-color, var(--forge-theme-primary, #3f51b5));\n --_focus-indicator-shape: var(--forge-focus-indicator-shape, calc(var(--forge-shape-extra-small, 1px) * var(--forge-shape-factor, 1)));\n --_focus-indicator-duration: var(--forge-focus-indicator-duration, var(--forge-animation-duration-long4, 600ms));\n --_focus-indicator-easing: var(--forge-focus-indicator-easing, var(--forge-animation-easing-emphasized, cubic-bezier(0.2, 0, 0, 1)));\n --_focus-indicator-shape-start-start: var(--forge-focus-indicator-shape-start-start, var(--_focus-indicator-shape));\n --_focus-indicator-shape-start-end: var(--forge-focus-indicator-shape-start-end, var(--_focus-indicator-shape));\n --_focus-indicator-shape-end-end: var(--forge-focus-indicator-shape-end-end, var(--_focus-indicator-shape));\n --_focus-indicator-shape-end-start: var(--forge-focus-indicator-shape-end-start, var(--_focus-indicator-shape));\n --_focus-indicator-outward-offset: var(--forge-focus-indicator-outward-offset, var(--forge-spacing-xxsmall, 4px));\n --_focus-indicator-inward-offset: var(--forge-focus-indicator-inward-offset, 0px);\n --_focus-indicator-offset-block: var(--forge-focus-indicator-offset-block, 0);\n --_focus-indicator-offset-inline: var(--forge-focus-indicator-offset-inline, 0);\n}\n\n.forge-button:not(:disabled):focus-visible::after {\n animation-delay: 0s, calc(var(--_focus-indicator-duration) * 0.25);\n animation-duration: calc(var(--_focus-indicator-duration) * 0.25), calc(var(--_focus-indicator-duration) * 0.75);\n animation-timing-function: var(--_focus-indicator-easing);\n box-sizing: border-box;\n color: var(--_focus-indicator-color);\n display: none;\n pointer-events: none;\n position: absolute;\n margin-block: var(--_focus-indicator-offset-block);\n margin-inline: var(--_focus-indicator-offset-inline);\n animation-name: forge-focus-indicator-outward-grow, forge-focus-indicator-outward-shrink;\n border-end-end-radius: calc(var(--_focus-indicator-shape-end-end) + var(--_focus-indicator-outward-offset));\n border-end-start-radius: calc(var(--_focus-indicator-shape-end-start) + var(--_focus-indicator-outward-offset));\n border-start-end-radius: calc(var(--_focus-indicator-shape-start-end) + var(--_focus-indicator-outward-offset));\n border-start-start-radius: calc(var(--_focus-indicator-shape-start-start) + var(--_focus-indicator-outward-offset));\n inset: calc(-1 * var(--_focus-indicator-outward-offset));\n outline: var(--_focus-indicator-width) solid currentColor;\n content: "";\n display: block;\n}\n\n.forge-button:not(:disabled) {\n --forge-focus-indicator-color: var(--_button-primary-color);\n}\n\n.forge-button:disabled {\n cursor: var(--_button-disabled-cursor);\n --_button-background: var(--_button-disabled-background);\n --_button-color: var(--_button-disabled-text-color);\n --_button-shadow: var(--_button-disabled-shadow);\n pointer-events: none;\n pointer-events: initial;\n}\n\n.forge-button:where(:not(.forge-button--outlined, .forge-button--tonal, .forge-button--filled, .forge-button--raised, .forge-button--link)), .forge-button--text {\n --_button-padding-inline: var(--_button-text-padding-inline);\n}\n\n.forge-button--outlined {\n --_button-background: var(--_button-outlined-background);\n --_button-color: var(--_button-outlined-color);\n --_button-border-width: var(--_button-outlined-border-width);\n --_button-border-style: var(--_button-outlined-border-style);\n --_button-border-color: var(--_button-outlined-border-color);\n}\n\n.forge-button--outlined:disabled {\n --_button-border-color: var(--_button-disabled-border-color);\n}\n\n.forge-button--tonal {\n --_button-background: var(--_button-tonal-background);\n --_button-color: var(--_button-tonal-color);\n}\n\n.forge-button--tonal:disabled {\n --_button-background: var(--_button-tonal-disabled-background);\n --_button-color: var(--_button-tonal-disabled-color);\n}\n\n.forge-button--filled, .forge-button--raised {\n --_button-background: var(--_button-filled-background);\n --_button-color: var(--_button-filled-color);\n --forge-state-layer-color: var(--_button-filled-color);\n}\n\n.forge-button--filled:disabled, .forge-button--raised:disabled {\n --_button-background: var(--_button-filled-disabled-background);\n --_button-color: var(--_button-filled-disabled-color);\n}\n\n.forge-button--raised {\n --_button-background: var(--_button-raised-background);\n --_button-color: var(--_button-raised-color);\n --_button-shadow: var(--_button-raised-shadow);\n}\n\n.forge-button--raised:hover {\n --_button-shadow: var(--_button-raised-hover-shadow);\n}\n\n.forge-button--raised:active {\n --_button-shadow: var(--_button-raised-active-shadow);\n}\n\n.forge-button--raised:disabled {\n --_button-background: var(--_button-raised-disabled-background);\n --_button-color: var(--_button-raised-disabled-color);\n --_button-shadow: var(--_button-raised-disabled-shadow);\n}\n\n.forge-button--link {\n --_button-color: var(--_button-link-color);\n --_button-height: var(--_button-link-height);\n --_button-padding: var(--_button-link-padding);\n --_button-focus-indicator-offset: var(--_button-link-focus-indicator-offset);\n text-decoration: var(--_button-link-text-decoration);\n line-height: var(--_button-link-line-height);\n transition: opacity var(--_button-link-transition-duration) var(--_button-link-transition-timing);\n inline-size: var(--_button-link-width);\n}\n\n.forge-button--link:hover {\n text-decoration: var(--_button-link-hover-text-decoration);\n}\n\n.forge-button--link:active {\n opacity: var(--_button-link-active-opacity);\n}\n\n.forge-button--pill {\n --_button-shape: var(--_button-pill-shape);\n --_button-padding-inline: var(--_button-pill-padding-inline);\n --forge-focus-indicator-shape: var(--_button-pill-shape);\n}\n\n.forge-button {\n --forge-icon-font-size: var(--_button-icon-size);\n}\n\n.forge-button--dense {\n --_button-height: var(--_button-dense-height);\n}\n\n:host {\n display: block;\n width: 100%;\n}\n\n.scroll-container {\n overflow: scroll;\n scrollbar-width: none;\n -webkit-overflow-scrolling: touch;\n width: 100%;\n height: 100%;\n}\n\n.suggestions-container {\n min-width: 100%;\n display: table;\n}\n\n.suggestions-inline {\n display: flex;\n align-items: center;\n flex-direction: row;\n flex-wrap: nowrap;\n width: max-content;\n gap: var(--forge-spacing-small, 12px);\n}\n\n.suggestions-block {\n display: flex;\n align-items: center;\n flex-direction: column;\n gap: var(--forge-spacing-small, 12px);\n}\n.suggestions-block > .container,\n.suggestions-block .container > button {\n width: 100%;\n}\n\n.suggestion {\n --forge-button-shape: calc(var(--forge-shape-medium, 4px) * var(--forge-shape-factor, 1));\n --forge-button-tonal-background: var(--forge-theme-tertiary-container, #d0d7ff);\n --forge-button-tonal-color: var(--forge-theme-on-tertiary-container, #213189);\n --forge-button-height: 32px;\n max-inline-size: 320px;\n}\n.suggestion .suggestion-text {\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n}\n\n.suggestion-tooltip {\n --forge-tooltip-content-align: start;\n}';
2
2
  export {
3
3
  styles as default
4
4
  };
@@ -1 +1,2 @@
1
- export * from './ai-suggestions.js';
1
+ export { AiSuggestionsComponent, AiSuggestionsComponentTagName } from './ai-suggestions.js';
2
+ export type { Suggestion, ForgeAiSuggestionsEventData, AiSuggestionsVariant } from './ai-suggestions.js';
@@ -13,10 +13,12 @@ export declare const AiThinkingIndicatorComponentTagName: keyof HTMLElementTagNa
13
13
  * @description
14
14
  * The AI Thinking Indicator component provides a visual cue that the system is working on a response.
15
15
  * It displays three dots that animate in sequence from left to right, then bounce in a wave pattern,
16
- * creating an engaging loading animation perfect for chat interfaces.
16
+ * creating an engaging loading animation perfect for chat interfaces. Displays cycling status text.
17
17
  */
18
18
  export declare class AiThinkingIndicatorComponent extends LitElement {
19
19
  #private;
20
20
  static styles: import('lit').CSSResult;
21
+ connectedCallback(): void;
22
+ disconnectedCallback(): void;
21
23
  render(): TemplateResult;
22
24
  }
@@ -1,4 +1,4 @@
1
- import { unsafeCSS, LitElement, html } from "lit";
1
+ import { unsafeCSS, LitElement, html, nothing } from "lit";
2
2
  import { customElement } from "lit/decorators.js";
3
3
  import styles from "./ai-thinking-indicator.scss.mjs";
4
4
  var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
@@ -15,22 +15,102 @@ var __decorateClass = (decorators, target, key, kind) => {
15
15
  var __accessCheck = (obj, member, msg) => member.has(obj) || __typeError("Cannot " + msg);
16
16
  var __privateGet = (obj, member, getter) => (__accessCheck(obj, member, "read from private field"), getter ? getter.call(obj) : member.get(obj));
17
17
  var __privateAdd = (obj, member, value) => member.has(obj) ? __typeError("Cannot add the same private member more than once") : member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
18
- var _dotsTemplate;
18
+ var __privateSet = (obj, member, value, setter) => (__accessCheck(obj, member, "write to private field"), member.set(obj, value), value);
19
+ var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "access private method"), method);
20
+ var _currentMessage, _lastMessageIndex, _cycleInterval, _initialDelayTimeout, _showText, _dotsTemplate, _AiThinkingIndicatorComponent_instances, startCycling_fn, stopCycling_fn, getNextMessage_fn, statusText_get;
19
21
  const AiThinkingIndicatorComponentTagName = "forge-ai-thinking-indicator";
22
+ const STATUS_MESSAGES = [
23
+ "Thinking...",
24
+ "Processing...",
25
+ "Working on it...",
26
+ "Almost there...",
27
+ "Analyzing...",
28
+ "One moment...",
29
+ "Hold on...",
30
+ "Forging a response...",
31
+ "Tylerizing...",
32
+ "Gathering information...",
33
+ "Looking into that...",
34
+ "Hang tight..."
35
+ ];
36
+ const CYCLE_INTERVAL = 5e3;
37
+ const INITIAL_DELAY = 5e3;
20
38
  let AiThinkingIndicatorComponent = class extends LitElement {
21
39
  constructor() {
22
40
  super(...arguments);
41
+ __privateAdd(this, _AiThinkingIndicatorComponent_instances);
42
+ __privateAdd(this, _currentMessage, "");
43
+ __privateAdd(this, _lastMessageIndex, -1);
44
+ __privateAdd(this, _cycleInterval);
45
+ __privateAdd(this, _initialDelayTimeout);
46
+ __privateAdd(this, _showText, false);
23
47
  __privateAdd(this, _dotsTemplate, html`
24
48
  <div class="dot dot-1"></div>
25
49
  <div class="dot dot-2"></div>
26
50
  <div class="dot dot-3"></div>
27
51
  `);
28
52
  }
53
+ connectedCallback() {
54
+ super.connectedCallback();
55
+ __privateMethod(this, _AiThinkingIndicatorComponent_instances, startCycling_fn).call(this);
56
+ }
57
+ disconnectedCallback() {
58
+ super.disconnectedCallback();
59
+ __privateMethod(this, _AiThinkingIndicatorComponent_instances, stopCycling_fn).call(this);
60
+ }
29
61
  render() {
30
- return html`<div class="thinking-indicator">${__privateGet(this, _dotsTemplate)}</div>`;
62
+ return html`
63
+ <div class="thinking-indicator">
64
+ <div class="dots-container">${__privateGet(this, _dotsTemplate)}</div>
65
+ ${__privateGet(this, _AiThinkingIndicatorComponent_instances, statusText_get)}
66
+ </div>
67
+ `;
31
68
  }
32
69
  };
70
+ _currentMessage = /* @__PURE__ */ new WeakMap();
71
+ _lastMessageIndex = /* @__PURE__ */ new WeakMap();
72
+ _cycleInterval = /* @__PURE__ */ new WeakMap();
73
+ _initialDelayTimeout = /* @__PURE__ */ new WeakMap();
74
+ _showText = /* @__PURE__ */ new WeakMap();
33
75
  _dotsTemplate = /* @__PURE__ */ new WeakMap();
76
+ _AiThinkingIndicatorComponent_instances = /* @__PURE__ */ new WeakSet();
77
+ startCycling_fn = function() {
78
+ __privateSet(this, _initialDelayTimeout, window.setTimeout(() => {
79
+ __privateSet(this, _showText, true);
80
+ __privateMethod(this, _AiThinkingIndicatorComponent_instances, getNextMessage_fn).call(this);
81
+ __privateSet(this, _cycleInterval, window.setInterval(() => {
82
+ __privateMethod(this, _AiThinkingIndicatorComponent_instances, getNextMessage_fn).call(this);
83
+ }, CYCLE_INTERVAL));
84
+ }, INITIAL_DELAY));
85
+ };
86
+ stopCycling_fn = function() {
87
+ if (__privateGet(this, _initialDelayTimeout)) {
88
+ clearTimeout(__privateGet(this, _initialDelayTimeout));
89
+ __privateSet(this, _initialDelayTimeout, void 0);
90
+ }
91
+ if (__privateGet(this, _cycleInterval)) {
92
+ clearInterval(__privateGet(this, _cycleInterval));
93
+ __privateSet(this, _cycleInterval, void 0);
94
+ }
95
+ __privateSet(this, _showText, false);
96
+ __privateSet(this, _currentMessage, "");
97
+ __privateSet(this, _lastMessageIndex, -1);
98
+ };
99
+ getNextMessage_fn = function() {
100
+ let nextIndex;
101
+ do {
102
+ nextIndex = Math.floor(Math.random() * STATUS_MESSAGES.length);
103
+ } while (nextIndex === __privateGet(this, _lastMessageIndex) && STATUS_MESSAGES.length > 1);
104
+ __privateSet(this, _lastMessageIndex, nextIndex);
105
+ __privateSet(this, _currentMessage, STATUS_MESSAGES[nextIndex]);
106
+ this.requestUpdate();
107
+ };
108
+ statusText_get = function() {
109
+ if (!__privateGet(this, _showText) || !__privateGet(this, _currentMessage)) {
110
+ return nothing;
111
+ }
112
+ return html`<div class="status-text" aria-live="polite">${__privateGet(this, _currentMessage)}</div>`;
113
+ };
34
114
  AiThinkingIndicatorComponent.styles = unsafeCSS(styles);
35
115
  AiThinkingIndicatorComponent = __decorateClass([
36
116
  customElement(AiThinkingIndicatorComponentTagName)
@@ -1,4 +1,320 @@
1
- const styles = "/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n:host {\n --forge-ai-thinking-indicator-dot-color: var(--forge-theme-text-medium, rgba(0, 0, 0, 0.6));\n --forge-ai-thinking-indicator-dot-size: 6px;\n --forge-ai-thinking-indicator-gap: var(--forge-spacing-xxsmall, 4px);\n --forge-ai-thinking-indicator-animation-duration: 2s;\n display: inline-block;\n box-sizing: border-box;\n}\n\n.thinking-indicator {\n display: flex;\n align-items: center;\n justify-content: center;\n gap: var(--forge-ai-thinking-indicator-gap);\n height: calc(var(--forge-ai-thinking-indicator-dot-size) * 2);\n}\n\n.dot {\n width: var(--forge-ai-thinking-indicator-dot-size);\n height: var(--forge-ai-thinking-indicator-dot-size);\n background-color: var(--forge-ai-thinking-indicator-dot-color);\n border-radius: 50%;\n opacity: 0;\n transform: scale(0.8) translateY(0);\n animation: thinking-animation var(--forge-ai-thinking-indicator-animation-duration) ease-in-out infinite;\n}\n\n.dot-1 {\n animation-delay: 0s;\n}\n\n.dot-2 {\n animation-delay: 0.15s;\n}\n\n.dot-3 {\n animation-delay: 0.3s;\n}\n\n@keyframes thinking-animation {\n 0% {\n opacity: 0;\n transform: scale(0.8) translateY(0);\n }\n 10% {\n opacity: 1;\n transform: scale(1) translateY(0);\n }\n 20% {\n opacity: 1;\n transform: scale(1) translateY(0);\n }\n 30% {\n opacity: 1;\n transform: scale(1.2) translateY(-4px);\n }\n 40% {\n opacity: 1;\n transform: scale(1) translateY(0);\n }\n 50% {\n opacity: 1;\n transform: scale(1.1) translateY(-2px);\n }\n 60% {\n opacity: 1;\n transform: scale(1) translateY(0);\n }\n 70% {\n opacity: 1;\n transform: scale(1) translateY(0);\n }\n 80% {\n opacity: 0.7;\n transform: scale(0.9) translateY(0);\n }\n 100% {\n opacity: 0;\n transform: scale(0.8) translateY(0);\n }\n}\n/* Respect user's reduced motion preference */\n@media (prefers-reduced-motion: reduce) {\n .dot {\n animation: thinking-animation-reduced var(--forge-ai-thinking-indicator-animation-duration) ease-in-out infinite;\n }\n @keyframes thinking-animation-reduced {\n 0%, 100% {\n opacity: 0.3;\n }\n 50% {\n opacity: 1;\n }\n }\n}";
1
+ const styles = `/**
2
+ * @license
3
+ * Copyright Tyler Technologies, Inc.
4
+ * License: Apache-2.0
5
+ */
6
+ /**
7
+ * @license
8
+ * Copyright Tyler Technologies, Inc.
9
+ * License: Apache-2.0
10
+ */
11
+ /**
12
+ * @license
13
+ * Copyright Tyler Technologies, Inc.
14
+ * License: Apache-2.0
15
+ */
16
+ /**
17
+ * @license
18
+ * Copyright Tyler Technologies, Inc.
19
+ * License: Apache-2.0
20
+ */
21
+ /**
22
+ * @license
23
+ * Copyright Tyler Technologies, Inc.
24
+ * License: Apache-2.0
25
+ */
26
+ /**
27
+ * @license
28
+ * Copyright Tyler Technologies, Inc.
29
+ * License: Apache-2.0
30
+ */
31
+ /**
32
+ * @license
33
+ * Copyright Tyler Technologies, Inc.
34
+ * License: Apache-2.0
35
+ */
36
+ /**
37
+ * @license
38
+ * Copyright Tyler Technologies, Inc.
39
+ * License: Apache-2.0
40
+ */
41
+ /**
42
+ * @license
43
+ * Copyright Tyler Technologies, Inc.
44
+ * License: Apache-2.0
45
+ */
46
+ /**
47
+ * @license
48
+ * Copyright Tyler Technologies, Inc.
49
+ * License: Apache-2.0
50
+ */
51
+ /**
52
+ * @license
53
+ * Copyright Tyler Technologies, Inc.
54
+ * License: Apache-2.0
55
+ */
56
+ /**
57
+ * @license
58
+ * Copyright Tyler Technologies, Inc.
59
+ * License: Apache-2.0
60
+ */
61
+ /**
62
+ * @license
63
+ * Copyright Tyler Technologies, Inc.
64
+ * License: Apache-2.0
65
+ */
66
+ /**
67
+ * @license
68
+ * Copyright Tyler Technologies, Inc.
69
+ * License: Apache-2.0
70
+ */
71
+ /**
72
+ * @license
73
+ * Copyright Tyler Technologies, Inc.
74
+ * License: Apache-2.0
75
+ */
76
+ /**
77
+ * @license
78
+ * Copyright Tyler Technologies, Inc.
79
+ * License: Apache-2.0
80
+ */
81
+ /**
82
+ * @license
83
+ * Copyright Tyler Technologies, Inc.
84
+ * License: Apache-2.0
85
+ */
86
+ /**
87
+ * @license
88
+ * Copyright Tyler Technologies, Inc.
89
+ * License: Apache-2.0
90
+ */
91
+ /**
92
+ * @license
93
+ * Copyright Tyler Technologies, Inc.
94
+ * License: Apache-2.0
95
+ */
96
+ /**
97
+ * @license
98
+ * Copyright Tyler Technologies, Inc.
99
+ * License: Apache-2.0
100
+ */
101
+ /**
102
+ * @license
103
+ * Copyright Tyler Technologies, Inc.
104
+ * License: Apache-2.0
105
+ */
106
+ /**
107
+ * @license
108
+ * Copyright Tyler Technologies, Inc.
109
+ * License: Apache-2.0
110
+ */
111
+ /**
112
+ * @license
113
+ * Copyright Tyler Technologies, Inc.
114
+ * License: Apache-2.0
115
+ */
116
+ /**
117
+ * @license
118
+ * Copyright Tyler Technologies, Inc.
119
+ * License: Apache-2.0
120
+ */
121
+ /**
122
+ * @license
123
+ * Copyright Tyler Technologies, Inc.
124
+ * License: Apache-2.0
125
+ */
126
+ /**
127
+ * @license
128
+ * Copyright Tyler Technologies, Inc.
129
+ * License: Apache-2.0
130
+ */
131
+ /* prettier-ignore */
132
+ /**
133
+ * @license
134
+ * Copyright Tyler Technologies, Inc.
135
+ * License: Apache-2.0
136
+ */
137
+ /**
138
+ * @license
139
+ * Copyright Tyler Technologies, Inc.
140
+ * License: Apache-2.0
141
+ */
142
+ /**
143
+ * @license
144
+ * Copyright Tyler Technologies, Inc.
145
+ * License: Apache-2.0
146
+ */
147
+ /**
148
+ * @license
149
+ * Copyright Tyler Technologies, Inc.
150
+ * License: Apache-2.0
151
+ */
152
+ /**
153
+ * @license
154
+ * Copyright Tyler Technologies, Inc.
155
+ * License: Apache-2.0
156
+ */
157
+ /**
158
+ * @license
159
+ * Copyright Tyler Technologies, Inc.
160
+ * License: Apache-2.0
161
+ */
162
+ /**
163
+ * @license
164
+ * Copyright Tyler Technologies, Inc.
165
+ * License: Apache-2.0
166
+ */
167
+ /**
168
+ * @license
169
+ * Copyright Tyler Technologies, Inc.
170
+ * License: Apache-2.0
171
+ */
172
+ /**
173
+ * @license
174
+ * Copyright Tyler Technologies, Inc.
175
+ * License: Apache-2.0
176
+ */
177
+ /**
178
+ * @license
179
+ * Copyright Tyler Technologies, Inc.
180
+ * License: Apache-2.0
181
+ */
182
+ :host {
183
+ --forge-ai-thinking-indicator-dot-color: var(--forge-theme-text-medium, rgba(0, 0, 0, 0.6));
184
+ --forge-ai-thinking-indicator-dot-size: 6px;
185
+ --forge-ai-thinking-indicator-gap: var(--forge-spacing-xxsmall, 4px);
186
+ --forge-ai-thinking-indicator-animation-duration: 2s;
187
+ display: inline-block;
188
+ box-sizing: border-box;
189
+ }
190
+
191
+ .thinking-indicator {
192
+ display: flex;
193
+ align-items: center;
194
+ gap: var(--forge-spacing-small, 12px);
195
+ height: calc(var(--forge-ai-thinking-indicator-dot-size) * 2);
196
+ }
197
+
198
+ .dots-container {
199
+ display: flex;
200
+ align-items: center;
201
+ justify-content: center;
202
+ gap: var(--forge-ai-thinking-indicator-gap);
203
+ }
204
+
205
+ .dot {
206
+ width: var(--forge-ai-thinking-indicator-dot-size);
207
+ height: var(--forge-ai-thinking-indicator-dot-size);
208
+ background-color: var(--forge-ai-thinking-indicator-dot-color);
209
+ border-radius: 50%;
210
+ opacity: 0;
211
+ transform: scale(0.8) translateY(0);
212
+ animation: thinking-animation var(--forge-ai-thinking-indicator-animation-duration) ease-in-out infinite;
213
+ }
214
+
215
+ .dot-1 {
216
+ animation-delay: 0s;
217
+ }
218
+
219
+ .dot-2 {
220
+ animation-delay: 0.15s;
221
+ }
222
+
223
+ .dot-3 {
224
+ animation-delay: 0.3s;
225
+ }
226
+
227
+ @keyframes thinking-animation {
228
+ 0% {
229
+ opacity: 0;
230
+ transform: scale(0.8) translateY(0);
231
+ }
232
+ 10% {
233
+ opacity: 1;
234
+ transform: scale(1) translateY(0);
235
+ }
236
+ 20% {
237
+ opacity: 1;
238
+ transform: scale(1) translateY(0);
239
+ }
240
+ 30% {
241
+ opacity: 1;
242
+ transform: scale(1.2) translateY(-4px);
243
+ }
244
+ 40% {
245
+ opacity: 1;
246
+ transform: scale(1) translateY(0);
247
+ }
248
+ 50% {
249
+ opacity: 1;
250
+ transform: scale(1.1) translateY(-2px);
251
+ }
252
+ 60% {
253
+ opacity: 1;
254
+ transform: scale(1) translateY(0);
255
+ }
256
+ 70% {
257
+ opacity: 1;
258
+ transform: scale(1) translateY(0);
259
+ }
260
+ 80% {
261
+ opacity: 0.7;
262
+ transform: scale(0.9) translateY(0);
263
+ }
264
+ 100% {
265
+ opacity: 0;
266
+ transform: scale(0.8) translateY(0);
267
+ }
268
+ }
269
+ .status-text {
270
+ -moz-osx-font-smoothing: grayscale;
271
+ -webkit-font-smoothing: antialiased;
272
+ font-family: var(--forge-typography-body1-font-family, var(--forge-typography-font-family, "Roboto", sans-serif));
273
+ font-size: var(--forge-typography-body1-font-size, calc(var(--forge-typography-font-size, 1rem) * var(--forge-typography-body-font-size-scale, 0.875)));
274
+ font-weight: var(--forge-typography-body1-font-weight, 400);
275
+ line-height: var(--forge-typography-body1-line-height, calc(var(--forge-typography-font-size, 1rem) * var(--forge-typography-body-line-height-scale, 1.125)));
276
+ letter-spacing: var(--forge-typography-body1-letter-spacing, 0.0357142857em);
277
+ text-transform: var(--forge-typography-body1-text-transform, inherit);
278
+ text-decoration: var(--forge-typography-body1-text-decoration, inherit);
279
+ color: var(--forge-theme-text-medium, rgba(0, 0, 0, 0.6));
280
+ user-select: none;
281
+ white-space: nowrap;
282
+ background: linear-gradient(90deg, var(--forge-theme-text-low, rgba(0, 0, 0, 0.38)) 0%, var(--forge-theme-text-high, rgba(0, 0, 0, 0.87)) 50%, var(--forge-theme-text-low, rgba(0, 0, 0, 0.38)) 100%);
283
+ background-size: 200% 100%;
284
+ background-clip: text;
285
+ -webkit-background-clip: text;
286
+ -webkit-text-fill-color: transparent;
287
+ animation: shimmer 4s ease-in-out infinite;
288
+ }
289
+
290
+ @keyframes shimmer {
291
+ 0% {
292
+ background-position: 200% 0;
293
+ }
294
+ 100% {
295
+ background-position: -200% 0;
296
+ }
297
+ }
298
+ /* Respect user's reduced motion preference */
299
+ @media (prefers-reduced-motion: reduce) {
300
+ .dot {
301
+ animation: thinking-animation-reduced var(--forge-ai-thinking-indicator-animation-duration) ease-in-out infinite;
302
+ }
303
+ @keyframes thinking-animation-reduced {
304
+ 0%, 100% {
305
+ opacity: 0.3;
306
+ }
307
+ 50% {
308
+ opacity: 1;
309
+ }
310
+ }
311
+ .status-text {
312
+ animation: none;
313
+ background: none;
314
+ -webkit-text-fill-color: unset;
315
+ color: var(--forge-theme-text-medium, rgba(0, 0, 0, 0.6));
316
+ }
317
+ }`;
2
318
  export {
3
319
  styles as default
4
320
  };
@@ -23,9 +23,15 @@ export declare const AiThreadsComponentTagName: keyof HTMLElementTagNameMap;
23
23
  /**
24
24
  * @tag forge-ai-threads
25
25
  *
26
+ * @slot - Default slot for chatbot component
27
+ *
26
28
  * @event {CustomEvent<ForgeAiThreadsSelectEventData>} forge-ai-threads-select - Fired when a thread is selected.
27
29
  * @event {CustomEvent} forge-ai-threads-new-chat - Fired when the new chat button is clicked.
28
30
  * @event {CustomEvent} forge-ai-threads-clear-history - Fired when the clear history button is clicked.
31
+ *
32
+ * @description A form factor component that positions a slotted chatbot alongside a thread navigation drawer.
33
+ * Manages thread list and selection while delegating chat functionality to the slotted chatbot.
34
+ * All chatbot events bubble through unchanged.
29
35
  */
30
36
  export declare class AiThreadsComponent extends LitElement {
31
37
  #private;
@@ -36,13 +42,12 @@ export declare class AiThreadsComponent extends LitElement {
36
42
  private _filterValue;
37
43
  /** Currently selected thread ID */
38
44
  private _selectedThreadId;
45
+ private _slottedChatbots;
39
46
  private _handleFilterInput;
40
47
  private _handleThreadSelect;
41
48
  private _handleNewChatClick;
42
- private _focusChatInput;
43
- private _handlePromptSend;
44
- private _generateThreadId;
45
- private _generateThreadTitle;
49
+ private _handleChatbotExpand;
50
+ private _handleChatbotMinimize;
46
51
  private _handleClearHistoryClick;
47
52
  render(): TemplateResult;
48
53
  }