@genexus/genexus-ide-ui 1.0.38 → 1.0.40

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 (75) hide show
  1. package/dist/cjs/genexus-ide-ui.cjs.js +1 -1
  2. package/dist/cjs/gx-ide-ai-assistant.cjs.entry.js +26 -16
  3. package/dist/cjs/gx-ide-ai-assistant.cjs.entry.js.map +1 -1
  4. package/dist/cjs/gx-ide-ai-message.cjs.entry.js +22 -11
  5. package/dist/cjs/gx-ide-ai-message.cjs.entry.js.map +1 -1
  6. package/dist/cjs/gx-ide-current-user-info.cjs.entry.js +42 -3
  7. package/dist/cjs/gx-ide-current-user-info.cjs.entry.js.map +1 -1
  8. package/dist/cjs/gx-ide-data-type-selector.cjs.entry.js +226 -0
  9. package/dist/cjs/gx-ide-data-type-selector.cjs.entry.js.map +1 -0
  10. package/dist/cjs/loader.cjs.js +1 -1
  11. package/dist/collection/collection-manifest.json +1 -0
  12. package/dist/collection/components/ai-assistant/ai-assistant.js +26 -35
  13. package/dist/collection/components/ai-assistant/ai-assistant.js.map +1 -1
  14. package/dist/collection/components/ai-assistant/ai-message.css +13 -11
  15. package/dist/collection/components/ai-assistant/ai-message.js +41 -13
  16. package/dist/collection/components/ai-assistant/ai-message.js.map +1 -1
  17. package/dist/collection/components/current-user-info/current-user-info.css +7 -0
  18. package/dist/collection/components/current-user-info/current-user-info.js +4 -2
  19. package/dist/collection/components/current-user-info/current-user-info.js.map +1 -1
  20. package/dist/collection/components/current-user-info/helpers.js +38 -1
  21. package/dist/collection/components/current-user-info/helpers.js.map +1 -1
  22. package/dist/collection/components/data-type-selector/data-type-selector.css +24 -0
  23. package/dist/collection/components/data-type-selector/data-type-selector.js +275 -0
  24. package/dist/collection/components/data-type-selector/data-type-selector.js.map +1 -0
  25. package/dist/collection/components/data-type-selector/gx-ide-assets/data-type-selector/langs/data-type-selector.lang.en.json +13 -0
  26. package/dist/collection/components/data-type-selector/gx-ide-assets/data-type-selector/langs/data-type-selector.lang.ja.json +13 -0
  27. package/dist/collection/components/data-type-selector/gx-ide-assets/data-type-selector/langs/data-type-selector.lang.zh.json +13 -0
  28. package/dist/collection/components/data-type-selector/helpers.js +38 -0
  29. package/dist/collection/components/data-type-selector/helpers.js.map +1 -0
  30. package/dist/collection/components/kb-manager-import/kb-manager-import.js +1 -1
  31. package/dist/collection/components/team-dev/update/update.js +1 -1
  32. package/dist/collection/testing/locale.e2e.js +1 -0
  33. package/dist/collection/testing/locale.e2e.js.map +1 -1
  34. package/dist/components/ai-message.js +23 -11
  35. package/dist/components/ai-message.js.map +1 -1
  36. package/dist/components/gx-ide-ai-assistant.js +28 -18
  37. package/dist/components/gx-ide-ai-assistant.js.map +1 -1
  38. package/dist/components/gx-ide-current-user-info.js +42 -3
  39. package/dist/components/gx-ide-current-user-info.js.map +1 -1
  40. package/dist/components/gx-ide-data-type-selector.d.ts +11 -0
  41. package/dist/components/gx-ide-data-type-selector.js +258 -0
  42. package/dist/components/gx-ide-data-type-selector.js.map +1 -0
  43. package/dist/esm/genexus-ide-ui.js +1 -1
  44. package/dist/esm/gx-ide-ai-assistant.entry.js +27 -17
  45. package/dist/esm/gx-ide-ai-assistant.entry.js.map +1 -1
  46. package/dist/esm/gx-ide-ai-message.entry.js +22 -11
  47. package/dist/esm/gx-ide-ai-message.entry.js.map +1 -1
  48. package/dist/esm/gx-ide-current-user-info.entry.js +42 -3
  49. package/dist/esm/gx-ide-current-user-info.entry.js.map +1 -1
  50. package/dist/esm/gx-ide-data-type-selector.entry.js +222 -0
  51. package/dist/esm/gx-ide-data-type-selector.entry.js.map +1 -0
  52. package/dist/esm/loader.js +1 -1
  53. package/dist/genexus-ide-ui/genexus-ide-ui.esm.js +1 -1
  54. package/dist/genexus-ide-ui/genexus-ide-ui.esm.js.map +1 -1
  55. package/dist/genexus-ide-ui/gx-ide-assets/data-type-selector/langs/data-type-selector.lang.en.json +13 -0
  56. package/dist/genexus-ide-ui/gx-ide-assets/data-type-selector/langs/data-type-selector.lang.ja.json +13 -0
  57. package/dist/genexus-ide-ui/gx-ide-assets/data-type-selector/langs/data-type-selector.lang.zh.json +13 -0
  58. package/dist/genexus-ide-ui/{p-798eb91a.entry.js → p-6e993843.entry.js} +42 -22
  59. package/dist/genexus-ide-ui/p-6e993843.entry.js.map +1 -0
  60. package/dist/genexus-ide-ui/p-a3a43593.entry.js +255 -0
  61. package/dist/genexus-ide-ui/p-a3a43593.entry.js.map +1 -0
  62. package/dist/genexus-ide-ui/{p-dd890eed.entry.js → p-c2ec8185.entry.js} +85 -46
  63. package/dist/genexus-ide-ui/p-c2ec8185.entry.js.map +1 -0
  64. package/dist/genexus-ide-ui/{p-a7dcfedd.entry.js → p-fdd9de33.entry.js} +62 -54
  65. package/dist/genexus-ide-ui/p-fdd9de33.entry.js.map +1 -0
  66. package/dist/types/components/ai-assistant/ai-assistant.d.ts +1 -6
  67. package/dist/types/components/ai-assistant/ai-message.d.ts +5 -0
  68. package/dist/types/components/current-user-info/helpers.d.ts +24 -1
  69. package/dist/types/components/data-type-selector/data-type-selector.d.ts +46 -0
  70. package/dist/types/components/data-type-selector/helpers.d.ts +4 -0
  71. package/dist/types/components.d.ts +47 -19
  72. package/package.json +2 -1
  73. package/dist/genexus-ide-ui/p-798eb91a.entry.js.map +0 -1
  74. package/dist/genexus-ide-ui/p-a7dcfedd.entry.js.map +0 -1
  75. package/dist/genexus-ide-ui/p-dd890eed.entry.js.map +0 -1
package/dist/esm/gx-ide-ai-assistant.entry.js CHANGED
@@ -1,18 +1,26 @@
1
- import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-93411ea2.js';
1
+ import { r as registerInstance, h, H as Host, g as getElement } from './index-93411ea2.js';
2
2
  import { L as Locale } from './locale-e5107fad.js';
3
3
 
4
4
  const aiAssistantCss = ":root{--ui-animaton-speed:0.2s}.gxg-title-01{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-01-font-weight);font-size:var(--ds-title-01-font-size);letter-spacing:var(--ds-base-font-letter-spacing--comfortable);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable)}.gxg-title-01--negative{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-01-font-weight);font-size:var(--ds-title-01-font-size);letter-spacing:var(--ds-base-font-letter-spacing--comfortable);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--negative)}.gxg-title-02{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-02-font-weight);font-size:var(--ds-title-02-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;text-transform:uppercase;line-height:var(--ds-base-font-line-height--comfortable)}.gxg-title-02--negative{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-02-font-weight);font-size:var(--ds-title-02-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;text-transform:uppercase;line-height:var(--ds-base-font-line-height--comfortable);color:var(--color-on-primary)}.gxg-title-03{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-03-font-weight);font-size:var(--ds-title-03-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;text-transform:uppercase;line-height:var(--ds-base-font-line-height--comfortable)}.gxg-title-03--negative{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-03-font-weight);font-size:var(--ds-title-03-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;text-transform:uppercase;line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--negative)}.gxg-title-04{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-04-font-weight);font-size:var(--ds-title-04-font-size);letter-spacing:var(--ds-base-font-letter-spacing--comfortable);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable)}.gxg-title-04--negative{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-04-font-weight);font-size:var(--ds-title-04-font-size);letter-spacing:var(--ds-base-font-letter-spacing--comfortable);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--negative)}.gxg-title-05{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-05-font-weight);font-size:var(--ds-title-05-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable)}.gxg-title-05--negative{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-05-font-weight);font-size:var(--ds-title-05-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--negative)}.gxg-text{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable)}.gxg-text--negative{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--negative)}.gxg-text--gray{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--dimmed)}.gxg-quote{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);font-style:italic}.gxg-quote--negative{color:var(--ds-base-font-color--negative)}.gxg-link{line-height:unset;font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--link);text-decoration:underline;cursor:pointer;display:inline-block}.gxg-link:hover{color:var(--ds-base-font-color--link-hover)}.gxg-link:active{color:var(--ds-base-font-color--link-active)}.gxg-link-gray{line-height:unset;font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--link);text-decoration:underline;cursor:pointer;display:inline-block;color:var(--ds-base-font-color--dimmed)}.gxg-link-gray:hover{line-height:unset;font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--link);text-decoration:underline;cursor:pointer;display:inline-block;color:var(--ds-base-font-color--dimmed);filter:brightness(1.4)}.gxg-alert-error{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--error);display:inline-block}.gxg-alert-warning{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--warning);display:inline-block}.gxg-alert-success{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--success);display:inline-block}.gxg-tab--disabled{color:var(--color-primary-disabled);pointer-events:none}.gxg-tab--disabled[disabled]{color:var(--color-primary-disabled);pointer-events:none}.gxg-label{font-family:var(--ds-base-font-family-primary);font-weight:var(--gxg-label-font-weight);font-size:var(--gxg-label-font-size);color:var(--gxg-label-color);text-align:center;line-height:1.455em;display:flex;align-items:center}.gxg-label:hover{color:var(--color-primary-hover)}.gxg-label:focus{color:var(--color-primary-active)}.gxg-label:active{color:var(--color-primary-active)}.gxg-label[disabled]{color:var(--color-primary-disabled)}.gxg-label--negative{color:var(--color-on-primary)}.gxg-label--negative[disabled]{color:var(--color-on-disabled)}.gxg-scrollbar{}.gxg-scrollbar::-webkit-scrollbar{width:var(--gxg-scrollbar-width);height:var(--gxg-scrollbar-width)}.gxg-scrollbar::-webkit-scrollbar-track{background-color:var(--gxg-scrollbar-track-background);border-radius:var(--gxg-scrollbar-track-border-radius)}.gxg-scrollbar::-webkit-scrollbar-thumb{background-color:var(--gxg-scrollbar-track-thumb-background);border-radius:var(--gxg-scrollbar-track-thumb-radius)}.gxg-scrollbar::-webkit-scrollbar-thumb:hover{background-color:var(--gxg-scrollbar-track-thumb-hover-background)}.gxg-scrollbar::-webkit-scrollbar-corner{background:rgba(0, 0, 0, 0)}@keyframes spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}:host{display:grid;block-size:100%}.card-regular{background-color:var(--mer-surface__elevation--01);border:var(--mer-border__width--sm) solid var(--mer-border-color__on-elevation--01);border-radius:var(--mer-border__radius--md);padding:var(--mer-spacing--md) var(--mer-spacing--md);display:grid}.card-small{background-color:var(--mer-surface__elevation--02);border-radius:var(--mer-border__radius--sm);padding:var(--mer-spacing--sm) var(--mer-spacing--sm)}.card-small--actionable:hover{background-color:var(--mer-color__neutral-gray--600)}.card-small--actionable:active{background-color:var(--mer-color__neutral-gray--650)}.card-small:focus-visible{outline:var(--focus__outline-width) var(--focus__outline-style) var(--focus__outline-color);outline-offset:var(--focus__outline-offset)}.empty-state{block-size:100%;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:var(--mer-spacing--sm);text-align:center}.empty-state__title,.empty-state__button,.empty-state__link{max-inline-size:300px}.opacity-0{opacity:0}.opacity-1{opacity:1}.display-contents{display:contents}.gxi-hidden{display:none !important}.gxi-full-height{height:100%}.gxi-overflow-auto{overflow:auto}.gxi-display-flex{display:flex}.align-start{display:flex;align-items:start}.align-center{display:flex;align-items:center}.align-end{display:flex;align-items:end}.overflow-auto{overflow:auto}.justify-start{display:flex;justify-content:start}.justify-center{display:flex;justify-content:center}.justify-end{display:flex;justify-content:end}.grid{display:grid;grid-row-gap:var(--gx-ide-grid-row-gap);grid-column-gap:var(--gx-ide-grid-column-gap);grid-template-rows:auto}ch-grid-cell{display:flex}ch-grid{overflow:auto;height:100%}ch-grid-column{z-index:99;border-bottom:1px solid var(--mer-color__neutral-gray--800)}ch-grid-column:first-child{padding-inline-start:var(--gx-ide-container__padding) !important}ch-grid-column:last-child{padding-inline-end:var(--gx-ide-container__padding) !important}ch-grid-cell{--mer-spacing--xs:var(--gx-ide-container__padding)}.layout{display:grid;gap:var(--mer-spacing--lg);box-sizing:border-box}.layout--two-cols{grid-template-columns:1fr 1fr}.layout--space-above{padding-block-start:var(--mer-spacing--lg)}gxg-tabs{box-shadow:none}:host(.gx-ide-component){height:100% !important;display:flex !important;flex-direction:column !important}:host(:focus-within) gx-ide-top-bar::part(wrapper){background-color:var(--color-secondary-enabled)}.gx-ide-main-wrapper{color:var(--gx-ide-component-text-color);font-weight:var(--mer-font__weight--regular);font-size:var(--mer-font__size--xs);font-family:var(--mer-font-family--primary);height:100%;background-color:var(--gx-ide-component-background-color);display:flex;flex-direction:column;flex-grow:1;box-sizing:border-box}.gx-ide-main{flex-grow:1;overflow-y:auto;}.gx-ide-main::-webkit-scrollbar{width:var(--gxg-scrollbar-width);height:var(--gxg-scrollbar-width)}.gx-ide-main::-webkit-scrollbar-track{background-color:var(--gxg-scrollbar-track-background);border-radius:var(--gxg-scrollbar-track-border-radius)}.gx-ide-main::-webkit-scrollbar-thumb{background-color:var(--gxg-scrollbar-track-thumb-background);border-radius:var(--gxg-scrollbar-track-thumb-radius)}.gx-ide-main::-webkit-scrollbar-thumb:hover{background-color:var(--gxg-scrollbar-track-thumb-hover-background)}.gx-ide-main::-webkit-scrollbar-corner{background:rgba(0, 0, 0, 0)}.gx-ide-overflow{overflow-y:auto;}.gx-ide-overflow::-webkit-scrollbar{width:var(--gxg-scrollbar-width);height:var(--gxg-scrollbar-width)}.gx-ide-overflow::-webkit-scrollbar-track{background-color:var(--gxg-scrollbar-track-background);border-radius:var(--gxg-scrollbar-track-border-radius)}.gx-ide-overflow::-webkit-scrollbar-thumb{background-color:var(--gxg-scrollbar-track-thumb-background);border-radius:var(--gxg-scrollbar-track-thumb-radius)}.gx-ide-overflow::-webkit-scrollbar-thumb:hover{background-color:var(--gxg-scrollbar-track-thumb-hover-background)}.gx-ide-overflow::-webkit-scrollbar-corner{background:rgba(0, 0, 0, 0)}.tree-view-primary{font-size:var(--mer-font__size--2xs)}p{margin:0;font-size:var(--mer-font__size--xxs)}.buttons-container{display:flex;gap:var(--mer-spacing--xs)}:root{--ui-animaton-speed:0.2s}.gxg-title-01{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-01-font-weight);font-size:var(--ds-title-01-font-size);letter-spacing:var(--ds-base-font-letter-spacing--comfortable);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable)}.gxg-title-01--negative{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-01-font-weight);font-size:var(--ds-title-01-font-size);letter-spacing:var(--ds-base-font-letter-spacing--comfortable);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--negative)}.gxg-title-02{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-02-font-weight);font-size:var(--ds-title-02-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;text-transform:uppercase;line-height:var(--ds-base-font-line-height--comfortable)}.gxg-title-02--negative{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-02-font-weight);font-size:var(--ds-title-02-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;text-transform:uppercase;line-height:var(--ds-base-font-line-height--comfortable);color:var(--color-on-primary)}.gxg-title-03{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-03-font-weight);font-size:var(--ds-title-03-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;text-transform:uppercase;line-height:var(--ds-base-font-line-height--comfortable)}.gxg-title-03--negative{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-03-font-weight);font-size:var(--ds-title-03-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;text-transform:uppercase;line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--negative)}.gxg-title-04{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-04-font-weight);font-size:var(--ds-title-04-font-size);letter-spacing:var(--ds-base-font-letter-spacing--comfortable);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable)}.gxg-title-04--negative{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-04-font-weight);font-size:var(--ds-title-04-font-size);letter-spacing:var(--ds-base-font-letter-spacing--comfortable);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--negative)}.gxg-title-05{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-05-font-weight);font-size:var(--ds-title-05-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable)}.gxg-title-05--negative{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-05-font-weight);font-size:var(--ds-title-05-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--negative)}.gxg-text{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable)}.gxg-text--negative{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--negative)}.gxg-text--gray{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--dimmed)}.gxg-quote{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);font-style:italic}.gxg-quote--negative{color:var(--ds-base-font-color--negative)}.gxg-link{line-height:unset;font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--link);text-decoration:underline;cursor:pointer;display:inline-block}.gxg-link:hover{color:var(--ds-base-font-color--link-hover)}.gxg-link:active{color:var(--ds-base-font-color--link-active)}.gxg-link-gray{line-height:unset;font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--link);text-decoration:underline;cursor:pointer;display:inline-block;color:var(--ds-base-font-color--dimmed)}.gxg-link-gray:hover{line-height:unset;font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--link);text-decoration:underline;cursor:pointer;display:inline-block;color:var(--ds-base-font-color--dimmed);filter:brightness(1.4)}.gxg-alert-error{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--error);display:inline-block}.gxg-alert-warning{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--warning);display:inline-block}.gxg-alert-success{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--success);display:inline-block}.gxg-tab--disabled{color:var(--color-primary-disabled);pointer-events:none}.gxg-tab--disabled[disabled]{color:var(--color-primary-disabled);pointer-events:none}.gxg-label{font-family:var(--ds-base-font-family-primary);font-weight:var(--gxg-label-font-weight);font-size:var(--gxg-label-font-size);color:var(--gxg-label-color);text-align:center;line-height:1.455em;display:flex;align-items:center}.gxg-label:hover{color:var(--color-primary-hover)}.gxg-label:focus{color:var(--color-primary-active)}.gxg-label:active{color:var(--color-primary-active)}.gxg-label[disabled]{color:var(--color-primary-disabled)}.gxg-label--negative{color:var(--color-on-primary)}.gxg-label--negative[disabled]{color:var(--color-on-disabled)}.gxg-scrollbar{}.gxg-scrollbar::-webkit-scrollbar{width:var(--gxg-scrollbar-width);height:var(--gxg-scrollbar-width)}.gxg-scrollbar::-webkit-scrollbar-track{background-color:var(--gxg-scrollbar-track-background);border-radius:var(--gxg-scrollbar-track-border-radius)}.gxg-scrollbar::-webkit-scrollbar-thumb{background-color:var(--gxg-scrollbar-track-thumb-background);border-radius:var(--gxg-scrollbar-track-thumb-radius)}.gxg-scrollbar::-webkit-scrollbar-thumb:hover{background-color:var(--gxg-scrollbar-track-thumb-hover-background)}.gxg-scrollbar::-webkit-scrollbar-corner{background:rgba(0, 0, 0, 0)}:host{font-family:var(--mer-font-family--primary);display:block;height:100%;flex-basis:286px;flex-shrink:0;height:100%;overflow-y:auto}.gx-ide-main-wrapper{padding:0 10px 52px 10px;background-color:var(--mer-surface);height:100%;display:grid;grid-template-rows:auto 1fr auto;gap:var(--mer-spacing--sm)}.header{padding-block-start:var(--mer-spacing--sm);display:flex;flex-direction:column}.header__actions-wrapper{display:flex;gap:var(--ai-assistant-header-actions-gap);margin-inline-start:auto}.header__first-row{display:flex;gap:var(--mer-spacing--xs);align-items:center;justify-content:space-between}.header__filter{margin-block-start:var(--mer-spacing--xs)}.header__second-row{transition:100ms grid-template-rows;display:grid;grid-template-rows:0fr}.header__second-row--visible{grid-template-rows:1fr}.header .filter-inner-wrapper{overflow:hidden}.messages-wrapper{position:relative;overflow:auto;display:flex;flex-direction:column;scroll-behavior:smooth;}.messages-wrapper::-webkit-scrollbar{width:var(--gxg-scrollbar-width);height:var(--gxg-scrollbar-width)}.messages-wrapper::-webkit-scrollbar-track{background-color:var(--gxg-scrollbar-track-background);border-radius:var(--gxg-scrollbar-track-border-radius)}.messages-wrapper::-webkit-scrollbar-thumb{background-color:var(--gxg-scrollbar-track-thumb-background);border-radius:var(--gxg-scrollbar-track-thumb-radius)}.messages-wrapper::-webkit-scrollbar-thumb:hover{background-color:var(--gxg-scrollbar-track-thumb-hover-background)}.messages-wrapper::-webkit-scrollbar-corner{background:rgba(0, 0, 0, 0)}.messages{display:flex;flex-direction:column;list-style-type:none;padding:0;margin:0}.prompt{position:relative;margin-top:auto}.prompt__textarea::part(textarea-wrapper){border:none}.prompt__textarea::part(textarea){border:none;background-color:var(--mer-color__neutral-gray--800)}.prompt__shortcuts{position:absolute;display:flex;align-items:center;gap:var(--mer-spacing--2xs);padding-inline-end:var(--mer-spacing--xs);right:0;top:0;height:100%}.prompt__shortcut{color:var(--mer-color__neutral-gray--400);font-size:var(--mer-font__size--2xs);padding:var(--mer-spacing--3xs) var(--mer-spacing--xs);background-color:var(--mer-color__neutral-gray--700);border-radius:var(--mer-border__radius--xs)}";
5
5
 
6
- /* OTHER LIBRARIES IMPORTS */
7
- const CSS_BUNDLES = ["resets/box-sizing", "components/icon"];
6
+ var __classPrivateFieldGet = (undefined && undefined.__classPrivateFieldGet) || function (receiver, state, kind, f) {
7
+ if (kind === "a" && !f)
8
+ throw new TypeError("Private accessor was defined without a getter");
9
+ if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver))
10
+ throw new TypeError("Cannot read private member from an object whose class did not declare it");
11
+ return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
12
+ };
13
+ var _GxIdeTemplate_mouseDownListener, _GxIdeTemplate_mouseUpListener;
14
+ const CSS_BUNDLES = [
15
+ "resets/box-sizing",
16
+ "components/icon",
17
+ "components/button"
18
+ ];
8
19
  const GxIdeTemplate = class {
9
20
  constructor(hostRef) {
10
21
  registerInstance(this, hostRef);
11
- this.componentDidRenderFirstTime = createEvent(this, "componentDidRenderFirstTime", 7);
12
- this.renderedFirstTime = false;
13
22
  this.setFocus = true;
14
23
  this.scrollToBottomFlag = true;
15
- // 9.LOCAL METHODS //
16
24
  this.evaluateAiInProgress = () => {
17
25
  var _a;
18
26
  if (((_a = this.messages) === null || _a === void 0 ? void 0 : _a.length) > 0 &&
@@ -43,7 +51,9 @@ const GxIdeTemplate = class {
43
51
  };
44
52
  this.renderMessage = (message, i) => {
45
53
  if (message.text.length > 0) {
46
- return (h("gx-ide-ai-message", { message: message.text, messageType: message.type, hidden: message.hidden, filterValue: this.filterValue, key: `${i.toString()}-${message.type}`, translations: this._componentLocale.aiMessage }));
54
+ return (h("gx-ide-ai-message", { style: {
55
+ "--primary-color": "lightblue"
56
+ }, message: message.text, messageType: message.type, hidden: message.hidden, filterValue: this.filterValue, key: `${i.toString()}-${message.type}`, translations: this._componentLocale.aiMessage, aiAssistantHostRef: this.el }));
47
57
  }
48
58
  };
49
59
  this.textAreaInputHandler = () => {
@@ -160,6 +170,12 @@ const GxIdeTemplate = class {
160
170
  this.messagesWrapperEl.clientHeight;
161
171
  }
162
172
  };
173
+ _GxIdeTemplate_mouseDownListener.set(this, () => {
174
+ this.el.removeAttribute("tabindex");
175
+ });
176
+ _GxIdeTemplate_mouseUpListener.set(this, () => {
177
+ this.el.setAttribute("tabindex", "0");
178
+ });
163
179
  this.userHasTyped = false;
164
180
  this.aIInProgress = false;
165
181
  this.showFilter = false;
@@ -183,7 +199,6 @@ const GxIdeTemplate = class {
183
199
  this.evaluateAiInProgress();
184
200
  this.evaluateAiStatus();
185
201
  }
186
- // 6.COMPONENT LIFECYCLE METHODS //
187
202
  async componentWillLoad() {
188
203
  this._componentLocale = await Locale.getComponentStrings(this.el);
189
204
  this.evaluateAiInProgress();
@@ -193,12 +208,10 @@ const GxIdeTemplate = class {
193
208
  componentDidLoad() {
194
209
  this.textareaShadowPart =
195
210
  this.textAreaEl.shadowRoot.querySelector("textarea");
211
+ this.el.addEventListener("mousedown", __classPrivateFieldGet(this, _GxIdeTemplate_mouseDownListener, "f"));
212
+ this.el.addEventListener("mouseup", __classPrivateFieldGet(this, _GxIdeTemplate_mouseUpListener, "f"));
196
213
  }
197
214
  componentDidRender() {
198
- if (!this.renderedFirstTime) {
199
- this.componentDidRenderFirstTime.emit(this._componentLocale.componentName);
200
- this.renderedFirstTime = true;
201
- }
202
215
  if (this.setFocus) {
203
216
  setTimeout(() => {
204
217
  /* Doesn't seems to work without the setTimeout */
@@ -210,14 +223,12 @@ const GxIdeTemplate = class {
210
223
  this.scrollToBottom();
211
224
  }, 200);
212
225
  }
213
- // 7.LISTENERS //
214
226
  handleFocus(event) {
215
227
  if (this.textAreaEl) {
216
228
  event.preventDefault();
217
229
  this.textAreaEl.focus();
218
230
  }
219
231
  }
220
- // 8.PUBLIC METHODS API //
221
232
  /**
222
233
  * Clear the list of messages
223
234
  */
@@ -240,13 +251,12 @@ const GxIdeTemplate = class {
240
251
  this.messages = messages;
241
252
  }
242
253
  }
243
- // 10.RENDER() FUNCTION //
244
254
  render() {
245
255
  var _a, _b;
246
256
  return (h(Host, { class: {
247
257
  [`assistant--${this.assistantStatus}`]: true,
248
258
  "assistant--in-progress": this.aIInProgress
249
- } }, h("ch-theme", { model: CSS_BUNDLES }), h("div", { class: "gx-ide-main-wrapper" }, h("header", { class: "header" }, h("div", { class: "header__first-row" }, h("gxg-title", { type: "title-02" }, this._componentLocale.componentName), h("div", { class: "header__actions-wrapper" }, this.filter ? (h("gxg-button", { class: "header__filter-button", type: "tertiary", icon: "menus/find", onClick: this.toggleFilterHandler, disabled: this.messages.length === 0 })) : null, h("gxg-button", { class: "header__clear-button", type: "tertiary", icon: "bpm/delete", onClick: this.clearMessages, disabled: this.messages.length === 0 }))), this.filter ? (h("div", { class: {
259
+ }, tabindex: "0" }, h("ch-theme", { model: CSS_BUNDLES }), h("div", { class: "gx-ide-main-wrapper" }, h("slot", null), h("header", { class: "header" }, h("div", { class: "header__first-row" }, h("gxg-title", { type: "title-02" }, this._componentLocale.componentName), h("div", { class: "header__actions-wrapper" }, this.filter ? (h("gxg-button", { class: "header__filter-button", type: "tertiary", icon: "menus/find", onClick: this.toggleFilterHandler, disabled: this.messages.length === 0 })) : null, h("gxg-button", { class: "header__clear-button", type: "tertiary", icon: "bpm/delete", onClick: this.clearMessages, disabled: this.messages.length === 0 }))), this.filter ? (h("div", { class: {
250
260
  "header__second-row": true,
251
261
  "header__second-row--visible": this.showFilter
252
262
  } }, h("div", { class: "filter-inner-wrapper" }, h("gxg-form-text", { class: "header__filter", onInput: this.filterMessagesHandler, ref: el => (this.filterEl = el) })))) : null), h("div", { class: {
@@ -268,7 +278,6 @@ const GxIdeTemplate = class {
268
278
  return i <= 2 ? (h("span", { class: "prompt__shortcut" }, shortcut)) : null;
269
279
  }))) : null))));
270
280
  }
271
- static get delegatesFocus() { return true; }
272
281
  static get assetsDirs() { return ["gx-ide-assets/ai-assistant"]; }
273
282
  get el() { return getElement(this); }
274
283
  static get watchers() { return {
@@ -276,6 +285,7 @@ const GxIdeTemplate = class {
276
285
  "messages": ["watchMessagesHandler"]
277
286
  }; }
278
287
  };
288
+ _GxIdeTemplate_mouseDownListener = new WeakMap(), _GxIdeTemplate_mouseUpListener = new WeakMap();
279
289
  GxIdeTemplate.style = aiAssistantCss;
280
290
 
281
291
  export { GxIdeTemplate as gx_ide_ai_assistant };
package/dist/esm/gx-ide-ai-assistant.entry.js.map CHANGED
@@ -1 +1 @@
1
- {"file":"gx-ide-ai-assistant.entry.js","mappings":"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","names":[],"sources":["src/components/ai-assistant/ai-assistant.scss?tag=gx-ide-ai-assistant&encapsulation=shadow","src/components/ai-assistant/ai-assistant.tsx"],"sourcesContent":["@import \"../../global/gx-ide-common.scss\";\n@import \"../../global/gx-ide-mixins.scss\";\n@import \"../../../node_modules/@genexus/gemini/dist/gemini/globals/mixins.scss\";\n\n:host {\n font-family: var(--mer-font-family--primary);\n display: block;\n height: 100%;\n flex-basis: 286px;\n flex-shrink: 0;\n height: 100%;\n overflow-y: auto;\n}\n.gx-ide-main-wrapper {\n padding: 0 10px 52px 10px;\n background-color: var(--mer-surface);\n height: 100%;\n display: grid;\n grid-template-rows: auto 1fr auto;\n gap: var(--mer-spacing--sm);\n}\n\n/*--- Header ---*/\n.header {\n padding-block-start: var(--mer-spacing--sm);\n display: flex;\n flex-direction: column;\n\n &__actions-wrapper {\n display: flex;\n gap: var(--ai-assistant-header-actions-gap);\n margin-inline-start: auto;\n }\n &__first-row {\n display: flex;\n gap: var(--mer-spacing--xs);\n align-items: center;\n justify-content: space-between;\n }\n &__filter {\n margin-block-start: var(--mer-spacing--xs);\n }\n &__second-row {\n transition: 100ms grid-template-rows;\n display: grid;\n grid-template-rows: 0fr;\n\n &--visible {\n grid-template-rows: 1fr;\n }\n }\n .filter-inner-wrapper {\n overflow: hidden;\n }\n}\n\n/*--- Messages ---*/\n.messages-wrapper {\n position: relative;\n overflow: auto;\n display: flex;\n flex-direction: column;\n scroll-behavior: smooth;\n @include gxg-scrollbar();\n}\n.messages {\n display: flex;\n flex-direction: column;\n list-style-type: none;\n padding: 0;\n margin: 0;\n}\n\n/*--- Prompt ---*/\n.prompt {\n position: relative;\n margin-top: auto;\n\n &__textarea {\n &::part(textarea-wrapper) {\n border: none;\n }\n &::part(textarea) {\n border: none;\n background-color: var(--mer-color__neutral-gray--800);\n }\n }\n &__shortcuts {\n position: absolute;\n display: flex;\n align-items: center;\n gap: var(--mer-spacing--2xs);\n padding-inline-end: var(--mer-spacing--xs);\n right: 0;\n top: 0;\n height: 100%;\n }\n &__shortcut {\n color: var(--mer-color__neutral-gray--400);\n font-size: var(--mer-font__size--2xs);\n padding: var(--mer-spacing--3xs) var(--mer-spacing--xs);\n background-color: var(--mer-color__neutral-gray--700);\n border-radius: var(--mer-border__radius--xs);\n }\n}\n","/* STENCIL IMPORTS */\nimport {\n Component,\n Host,\n h,\n Prop,\n Event,\n EventEmitter,\n Element,\n Method,\n State,\n Watch,\n Listen\n} from \"@stencil/core\";\n/* OTHER LIBRARIES IMPORTS */\nconst CSS_BUNDLES: MercuryBundles = [\"resets/box-sizing\", \"components/icon\"];\n/* CUSTOM IMPORTS */\nimport { Locale } from \"../../common/locale\";\n\nimport { MercuryBundles } from \"@genexus/mercury\";\n\n@Component({\n tag: \"gx-ide-ai-assistant\",\n styleUrl: \"ai-assistant.scss\",\n shadow: { delegatesFocus: true },\n assetsDirs: [\"gx-ide-assets/ai-assistant\"]\n})\nexport class GxIdeTemplate {\n // 1.OWN PROPERTIES //\n\n /**\n * The component hard-coded strings translations.\n */\n private _componentLocale: any;\n private renderedFirstTime = false;\n /* lastUserMessageHeight is used to set the appropriate height on the textarea, if user presses arrowUp (recover last message)*/\n private lastUserMessageHeight: number;\n private setFocus = true;\n private scrollToBottomFlag = true;\n\n // 2. REFERENCE TO ELEMENTS //\n\n @Element() el: HTMLGxIdeAiAssistantElement;\n private textAreaEl!: HTMLGxgFormTextareaElement;\n private textareaShadowPart: HTMLTextAreaElement;\n private filterEl: HTMLGxgFormTextElement;\n private messagesWrapperEl!: HTMLDivElement;\n\n // 3.STATE() VARIABLES //\n\n /**\n * Flag used to hide the shortcuts\n */\n @State() userHasTyped = false;\n\n /**\n * This is true if the last message is of type 'assistant-in-progress'\n */\n @State() aIInProgress = false;\n @Watch(\"aIInProgress\")\n watchAIInProgressHandler(aiInProgress: boolean) {\n if (!aiInProgress) {\n this.setFocus = true;\n }\n }\n\n /**\n * This displays or hides the messages filter\n */\n @State() showFilter = false;\n\n /**\n * True if the prompt textbox has focus\n */\n @State() promptHasFocus = false;\n\n /**\n * The filter value\n */\n @State() filterValue: string;\n\n // 4.PUBLIC PROPERTY API | WATCH'S //\n\n /**\n * List of messages displayed by the component\n */\n @Prop({ mutable: true }) messages: Message[] = [];\n @Watch(\"messages\")\n watchMessagesHandler() {\n this.evaluateAiInProgress();\n this.evaluateAiStatus();\n }\n\n /**\n * The prompt textarea max-height\n */\n @Prop() readonly promptMaxHeight = \"128px\";\n\n /**\n * A temporary property to illustrate the assistant status\n */\n @Prop({ mutable: true }) assistantStatus: AiStatus = \"indeterminate\";\n\n /**\n * List of keys that make up the shortcut to focus on the component's text input\n */\n @Prop() readonly focusShortcuts: string[];\n\n /**\n * List of keys that make up the shortcut to focus on the component's text input\n */\n @Prop() readonly userMessageCallback: UserMessageCallback;\n\n /**\n * Callback that must be invoked when the conversation is cleared, using the header button.\n */\n @Prop() readonly clearCallback: () => Promise<void>;\n\n /**\n * the prompt value\n */\n @Prop() readonly promptValue: string;\n\n /**\n * If tue, it will display a filter.\n */\n @Prop() readonly filter = true;\n\n // 5.EVENTS (EMIT) //\n\n /**\n * This event is emitted once just after the component is fully loaded and the first render() occurs\n */\n @Event() componentDidRenderFirstTime: EventEmitter<boolean>;\n\n // 6.COMPONENT LIFECYCLE METHODS //\n\n async componentWillLoad() {\n this._componentLocale = await Locale.getComponentStrings(this.el);\n this.evaluateAiInProgress();\n this.evaluateAiStatus();\n this.attachShortcuts();\n }\n\n componentDidLoad() {\n this.textareaShadowPart =\n this.textAreaEl.shadowRoot.querySelector(\"textarea\");\n }\n\n componentDidRender() {\n if (!this.renderedFirstTime) {\n this.componentDidRenderFirstTime.emit(\n this._componentLocale.componentName\n );\n this.renderedFirstTime = true;\n }\n if (this.setFocus) {\n setTimeout(() => {\n /* Doesn't seems to work without the setTimeout */\n this.textAreaEl.focus();\n this.setFocus = false;\n }, 50);\n }\n setTimeout(() => {\n this.scrollToBottom();\n }, 200);\n }\n\n // 7.LISTENERS //\n\n @Listen(\"focus\", { capture: true })\n handleFocus(event: FocusEvent) {\n if (this.textAreaEl) {\n event.preventDefault();\n this.textAreaEl.focus();\n }\n }\n\n // 8.PUBLIC METHODS API //\n\n /**\n * Clear the list of messages\n */\n @Method()\n async clear() {\n this.messages = [];\n }\n\n /**\n * Add a message. This method will be used by the host to add messages from the assistant\n */\n @Method()\n async addMessage(message: Message) {\n if (message.text?.length > 0) {\n const messages = [...this.messages];\n const updateInProgressMessage =\n messages?.length > 0 &&\n messages[messages.length - 1].type === \"assistant-in-progress\";\n if (updateInProgressMessage) {\n messages.pop();\n }\n messages.push(message);\n this.messages = messages;\n }\n }\n\n // 9.LOCAL METHODS //\n\n private evaluateAiInProgress = () => {\n if (\n this.messages?.length > 0 &&\n this.messages[this.messages.length - 1].type === \"assistant-in-progress\"\n ) {\n this.aIInProgress = true;\n } else {\n this.aIInProgress = false;\n }\n };\n\n private evaluateAiStatus = () => {\n if (this.messages?.length === 0) {\n this.assistantStatus = \"indeterminate\";\n return;\n }\n if (\n this.messages[this.messages.length - 1].type ===\n \"assistant-in-progress\" ||\n this.messages[this.messages.length - 1].type === \"user\"\n ) {\n this.assistantStatus = \"indeterminate\";\n } else if (\n this.messages[this.messages.length - 1].type === \"assistant-error\"\n ) {\n this.assistantStatus = \"error\";\n } else {\n this.assistantStatus = \"success\";\n }\n };\n\n private renderMessage = (\n message: Message,\n i: number\n ): HTMLLIElement | void => {\n if (message.text.length > 0) {\n return (\n <gx-ide-ai-message\n message={message.text}\n messageType={message.type}\n hidden={message.hidden}\n filterValue={this.filterValue}\n key={`${i.toString()}-${message.type}`}\n translations={this._componentLocale.aiMessage}\n ></gx-ide-ai-message>\n );\n }\n };\n\n private textAreaInputHandler = () => {\n this.userHasTyped = true;\n this.showFilter = false;\n this.filterEl.value = \"\";\n this.filterValue = \"\";\n this.scrollToBottomFlag = true;\n };\n\n private promptEnterHandler = async (prompt: CustomEvent<string>) => {\n /* First remove double spaces */\n const promptTrimmed = prompt.detail.replace(/\\s+/g, \" \");\n /* Update textarea value to get the proper height */\n this.textAreaEl.value = promptTrimmed;\n setTimeout(() => {\n /* Then save the actual height (setTimeOut required) */\n this.lastUserMessageHeight = this.textAreaEl.offsetHeight;\n }, 0);\n /* The clear the textarea */\n this.textAreaEl.value = \"\";\n /* Insert the user message */\n this.addMessage({\n type: \"user\",\n text: promptTrimmed\n });\n /* Call the callback */\n if (this.userMessageCallback && !this.aIInProgress) {\n this.aIInProgress = true;\n this.userMessageCallback(promptTrimmed).then(() => {\n this.aIInProgress = false;\n });\n }\n };\n\n private filterMessagesHandler = (e: CustomEvent<string>) => {\n this.scrollToBottomFlag = false;\n this.filterValue = e.detail.toLowerCase();\n const filteredMessages = [...this.messages];\n filteredMessages.forEach(message => {\n if (message.text.toLowerCase().includes(this.filterValue)) {\n message.hidden = false;\n } else {\n message.hidden = true;\n }\n });\n this.messages = filteredMessages;\n };\n\n private clearMessages = () => {\n this.messages = [];\n this.textAreaEl.focus();\n if (this.clearCallback) {\n this.clearCallback();\n }\n };\n\n private attachShortcuts = () => {\n if (this.focusShortcuts?.length > 0) {\n const ctrlFocusIndex = this.focusShortcuts.findIndex(\n key => key.toLocaleLowerCase() === \"ctrl\"\n );\n const shiftFocusIndex = this.focusShortcuts.findIndex(\n key => key.toLocaleLowerCase() === \"shift\"\n );\n const cmdKeyIndex = this.focusShortcuts.findIndex(\n key => key.toLocaleLowerCase() === \"cmd\"\n );\n const keyFocus = this.focusShortcuts\n .find(key => {\n return (\n key.toLocaleLowerCase() !== \"ctrl\" &&\n key.toLocaleLowerCase() !== \"shift\" &&\n key.toLocaleLowerCase() !== \"cmd\"\n );\n })\n .toLowerCase();\n document.addEventListener(\"keydown\", (e: KeyboardEvent) => {\n if (e.key === keyFocus && ctrlFocusIndex !== -1 && e.ctrlKey) {\n this.textAreaEl.focus();\n this.userHasTyped = true;\n } else if (e.key === keyFocus && shiftFocusIndex !== -1 && e.shiftKey) {\n this.textAreaEl.focus();\n this.userHasTyped = true;\n } else if (e.key === keyFocus && cmdKeyIndex !== -1 && e.metaKey) {\n this.textAreaEl.focus();\n this.userHasTyped = true;\n }\n });\n }\n };\n\n private promptArrowUpHandler = () => {\n this.userHasTyped = true;\n const lastUserMessage = this.messages?.find(message => {\n return message.type === \"user\";\n });\n if (lastUserMessage) {\n if (this.lastUserMessageHeight) {\n this.textareaShadowPart.style.height = `${this.lastUserMessageHeight}px`;\n }\n this.textAreaEl.value = lastUserMessage.text;\n }\n };\n\n private toggleFilterHandler = () => {\n this.showFilter = !this.showFilter;\n if (this.showFilter) {\n this.filterEl.focus();\n }\n };\n\n private promptFocusHandler = () => {\n this.promptHasFocus = true;\n };\n\n private promptBlurHandler = () => {\n this.promptHasFocus = false;\n };\n\n private scrollToBottom = () => {\n if (this.scrollToBottomFlag) {\n this.messagesWrapperEl.scrollTo(0, this.messagesWrapperEl.scrollHeight);\n this.messagesWrapperEl.scrollTop =\n this.messagesWrapperEl.scrollHeight -\n this.messagesWrapperEl.clientHeight;\n }\n };\n\n // 10.RENDER() FUNCTION //\n\n render() {\n return (\n <Host\n class={{\n [`assistant--${this.assistantStatus}`]: true,\n \"assistant--in-progress\": this.aIInProgress\n }}\n >\n <ch-theme model={CSS_BUNDLES}></ch-theme>\n <div class=\"gx-ide-main-wrapper\">\n <header class=\"header\">\n <div class=\"header__first-row\">\n <gxg-title type=\"title-02\">\n {this._componentLocale.componentName}\n </gxg-title>\n <div class=\"header__actions-wrapper\">\n {this.filter ? (\n <gxg-button\n class=\"header__filter-button\"\n type=\"tertiary\"\n icon=\"menus/find\"\n onClick={this.toggleFilterHandler}\n disabled={this.messages.length === 0}\n ></gxg-button>\n ) : null}\n\n <gxg-button\n class=\"header__clear-button\"\n type=\"tertiary\"\n icon=\"bpm/delete\"\n onClick={this.clearMessages}\n disabled={this.messages.length === 0}\n ></gxg-button>\n </div>\n </div>\n {this.filter ? (\n <div\n class={{\n \"header__second-row\": true,\n \"header__second-row--visible\": this.showFilter\n }}\n >\n <div class=\"filter-inner-wrapper\">\n <gxg-form-text\n class=\"header__filter\"\n onInput={this.filterMessagesHandler as any}\n ref={el => (this.filterEl = el as HTMLGxgFormTextElement)}\n ></gxg-form-text>\n </div>\n </div>\n ) : null}\n </header>\n\n <div\n class={{\n \"messages-wrapper\": true,\n \"scrollable\": true\n }}\n ref={el => (this.messagesWrapperEl = el as HTMLDivElement)}\n >\n {this.messages?.length ? (\n <ol class={{ messages: true }}>\n {this.messages.map((message, i) => {\n return this.renderMessage(message, i);\n })}\n </ol>\n ) : null}\n </div>\n\n <div\n class={{\n prompt: true\n }}\n >\n <gxg-form-textarea\n ai\n class=\"prompt__textarea\"\n value={this.promptValue}\n maxHeight={this.promptMaxHeight}\n placeholder={\n this.aIInProgress\n ? this._componentLocale.processingQueryPlaceholder\n : this._componentLocale.promptPlaceholder\n }\n onInput={this.textAreaInputHandler}\n onEnter={this.promptEnterHandler}\n onArrowUpPressed={this.promptArrowUpHandler}\n onBlur={this.promptBlurHandler}\n onFocus={this.promptFocusHandler}\n disabled={this.aIInProgress}\n ref={el => (this.textAreaEl = el as HTMLGxgFormTextareaElement)}\n ></gxg-form-textarea>\n {!this.userHasTyped &&\n !this.aIInProgress &&\n !this.promptHasFocus &&\n this.focusShortcuts?.length > 0 ? (\n <div\n class={{\n prompt__shortcuts: true\n }}\n >\n {this.focusShortcuts.map((shortcut, i) => {\n /* Up to three keys allowed*/\n return i <= 2 ? (\n <span class=\"prompt__shortcut\">{shortcut}</span>\n ) : null;\n })}\n </div>\n ) : null}\n </div>\n </div>\n </Host>\n );\n }\n}\n\nexport type AiStatus = \"indeterminate\" | \"success\" | \"error\";\n\nexport type Message = {\n type: MessageType;\n text: string;\n hidden?: boolean;\n filterValue?: string;\n};\n\nexport type MessageType =\n | \"user\"\n | \"assistant-chat\"\n | \"assistant-action\"\n | \"assistant-in-progress\"\n | \"assistant-error\";\n\nexport type UserMessageCallback = (text: string) => Promise<void>;\n"],"version":3}
1
+ {"file":"gx-ide-ai-assistant.entry.js","mappings":";;;AAAA,MAAM,cAAc,GAAG,wqsBAAwqsB;;;;;;;;;;ACY/rsB,MAAM,WAAW,GAAmB;IAClC,mBAAmB;IACnB,iBAAiB;IACjB,mBAAmB;CACpB,CAAC;MAYW,aAAa;;;QAOhB,aAAQ,GAAG,IAAI,CAAC;QAChB,uBAAkB,GAAG,IAAI,CAAC;QAiJ1B,yBAAoB,GAAG;;YAC7B,IACE,CAAA,MAAA,IAAI,CAAC,QAAQ,0CAAE,MAAM,IAAG,CAAC;gBACzB,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,QAAQ,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,IAAI,KAAK,uBAAuB,EACxE;gBACA,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC;aAC1B;iBAAM;gBACL,IAAI,CAAC,YAAY,GAAG,KAAK,CAAC;aAC3B;SACF,CAAC;QAEM,qBAAgB,GAAG;;YACzB,IAAI,CAAA,MAAA,IAAI,CAAC,QAAQ,0CAAE,MAAM,MAAK,CAAC,EAAE;gBAC/B,IAAI,CAAC,eAAe,GAAG,eAAe,CAAC;gBACvC,OAAO;aACR;YACD,IACE,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,QAAQ,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,IAAI;gBAC1C,uBAAuB;gBACzB,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,QAAQ,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,IAAI,KAAK,MAAM,EACvD;gBACA,IAAI,CAAC,eAAe,GAAG,eAAe,CAAC;aACxC;iBAAM,IACL,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,QAAQ,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,IAAI,KAAK,iBAAiB,EAClE;gBACA,IAAI,CAAC,eAAe,GAAG,OAAO,CAAC;aAChC;iBAAM;gBACL,IAAI,CAAC,eAAe,GAAG,SAAS,CAAC;aAClC;SACF,CAAC;QAEM,kBAAa,GAAG,CACtB,OAAgB,EAChB,CAAS;YAET,IAAI,OAAO,CAAC,IAAI,CAAC,MAAM,GAAG,CAAC,EAAE;gBAC3B,QACE,yBACE,KAAK,EAAE;wBACL,iBAAiB,EAAE,WAAW;qBAC/B,EACD,OAAO,EAAE,OAAO,CAAC,IAAI,EACrB,WAAW,EAAE,OAAO,CAAC,IAAI,EACzB,MAAM,EAAE,OAAO,CAAC,MAAM,EACtB,WAAW,EAAE,IAAI,CAAC,WAAW,EAC7B,GAAG,EAAE,GAAG,CAAC,CAAC,QAAQ,EAAE,IAAI,OAAO,CAAC,IAAI,EAAE,EACtC,YAAY,EAAE,IAAI,CAAC,gBAAgB,CAAC,SAAS,EAC7C,kBAAkB,EAAE,IAAI,CAAC,EAAE,GACR,EACrB;aACH;SACF,CAAC;QAEM,yBAAoB,GAAG;YAC7B,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC;YACzB,IAAI,CAAC,UAAU,GAAG,KAAK,CAAC;YACxB,IAAI,CAAC,QAAQ,CAAC,KAAK,GAAG,EAAE,CAAC;YACzB,IAAI,CAAC,WAAW,GAAG,EAAE,CAAC;YACtB,IAAI,CAAC,kBAAkB,GAAG,IAAI,CAAC;SAChC,CAAC;QAEM,uBAAkB,GAAG,OAAO,MAA2B;;YAE7D,MAAM,aAAa,GAAG,MAAM,CAAC,MAAM,CAAC,OAAO,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;;YAEzD,IAAI,CAAC,UAAU,CAAC,KAAK,GAAG,aAAa,CAAC;YACtC,UAAU,CAAC;;gBAET,IAAI,CAAC,qBAAqB,GAAG,IAAI,CAAC,UAAU,CAAC,YAAY,CAAC;aAC3D,EAAE,CAAC,CAAC,CAAC;;YAEN,IAAI,CAAC,UAAU,CAAC,KAAK,GAAG,EAAE,CAAC;;YAE3B,IAAI,CAAC,UAAU,CAAC;gBACd,IAAI,EAAE,MAAM;gBACZ,IAAI,EAAE,aAAa;aACpB,CAAC,CAAC;;YAEH,IAAI,IAAI,CAAC,mBAAmB,IAAI,CAAC,IAAI,CAAC,YAAY,EAAE;gBAClD,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC;gBACzB,IAAI,CAAC,mBAAmB,CAAC,aAAa,CAAC,CAAC,IAAI,CAAC;oBAC3C,IAAI,CAAC,YAAY,GAAG,KAAK,CAAC;iBAC3B,CAAC,CAAC;aACJ;SACF,CAAC;QAEM,0BAAqB,GAAG,CAAC,CAAsB;YACrD,IAAI,CAAC,kBAAkB,GAAG,KAAK,CAAC;YAChC,IAAI,CAAC,WAAW,GAAG,CAAC,CAAC,MAAM,CAAC,WAAW,EAAE,CAAC;YAC1C,MAAM,gBAAgB,GAAG,CAAC,GAAG,IAAI,CAAC,QAAQ,CAAC,CAAC;YAC5C,gBAAgB,CAAC,OAAO,CAAC,OAAO;gBAC9B,IAAI,OAAO,CAAC,IAAI,CAAC,WAAW,EAAE,CAAC,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,EAAE;oBACzD,OAAO,CAAC,MAAM,GAAG,KAAK,CAAC;iBACxB;qBAAM;oBACL,OAAO,CAAC,MAAM,GAAG,IAAI,CAAC;iBACvB;aACF,CAAC,CAAC;YACH,IAAI,CAAC,QAAQ,GAAG,gBAAgB,CAAC;SAClC,CAAC;QAEM,kBAAa,GAAG;YACtB,IAAI,CAAC,QAAQ,GAAG,EAAE,CAAC;YACnB,IAAI,CAAC,UAAU,CAAC,KAAK,EAAE,CAAC;YACxB,IAAI,IAAI,CAAC,aAAa,EAAE;gBACtB,IAAI,CAAC,aAAa,EAAE,CAAC;aACtB;SACF,CAAC;QAEM,oBAAe,GAAG;;YACxB,IAAI,CAAA,MAAA,IAAI,CAAC,cAAc,0CAAE,MAAM,IAAG,CAAC,EAAE;gBACnC,MAAM,cAAc,GAAG,IAAI,CAAC,cAAc,CAAC,SAAS,CAClD,GAAG,IAAI,GAAG,CAAC,iBAAiB,EAAE,KAAK,MAAM,CAC1C,CAAC;gBACF,MAAM,eAAe,GAAG,IAAI,CAAC,cAAc,CAAC,SAAS,CACnD,GAAG,IAAI,GAAG,CAAC,iBAAiB,EAAE,KAAK,OAAO,CAC3C,CAAC;gBACF,MAAM,WAAW,GAAG,IAAI,CAAC,cAAc,CAAC,SAAS,CAC/C,GAAG,IAAI,GAAG,CAAC,iBAAiB,EAAE,KAAK,KAAK,CACzC,CAAC;gBACF,MAAM,QAAQ,GAAG,IAAI,CAAC,cAAc;qBACjC,IAAI,CAAC,GAAG;oBACP,QACE,GAAG,CAAC,iBAAiB,EAAE,KAAK,MAAM;wBAClC,GAAG,CAAC,iBAAiB,EAAE,KAAK,OAAO;wBACnC,GAAG,CAAC,iBAAiB,EAAE,KAAK,KAAK,EACjC;iBACH,CAAC;qBACD,WAAW,EAAE,CAAC;gBACjB,QAAQ,CAAC,gBAAgB,CAAC,SAAS,EAAE,CAAC,CAAgB;oBACpD,IAAI,CAAC,CAAC,GAAG,KAAK,QAAQ,IAAI,cAAc,KAAK,CAAC,CAAC,IAAI,CAAC,CAAC,OAAO,EAAE;wBAC5D,IAAI,CAAC,UAAU,CAAC,KAAK,EAAE,CAAC;wBACxB,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC;qBAC1B;yBAAM,IAAI,CAAC,CAAC,GAAG,KAAK,QAAQ,IAAI,eAAe,KAAK,CAAC,CAAC,IAAI,CAAC,CAAC,QAAQ,EAAE;wBACrE,IAAI,CAAC,UAAU,CAAC,KAAK,EAAE,CAAC;wBACxB,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC;qBAC1B;yBAAM,IAAI,CAAC,CAAC,GAAG,KAAK,QAAQ,IAAI,WAAW,KAAK,CAAC,CAAC,IAAI,CAAC,CAAC,OAAO,EAAE;wBAChE,IAAI,CAAC,UAAU,CAAC,KAAK,EAAE,CAAC;wBACxB,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC;qBAC1B;iBACF,CAAC,CAAC;aACJ;SACF,CAAC;QAEM,yBAAoB,GAAG;;YAC7B,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC;YACzB,MAAM,eAAe,GAAG,MAAA,IAAI,CAAC,QAAQ,0CAAE,IAAI,CAAC,OAAO;gBACjD,OAAO,OAAO,CAAC,IAAI,KAAK,MAAM,CAAC;aAChC,CAAC,CAAC;YACH,IAAI,eAAe,EAAE;gBACnB,IAAI,IAAI,CAAC,qBAAqB,EAAE;oBAC9B,IAAI,CAAC,kBAAkB,CAAC,KAAK,CAAC,MAAM,GAAG,GAAG,IAAI,CAAC,qBAAqB,IAAI,CAAC;iBAC1E;gBACD,IAAI,CAAC,UAAU,CAAC,KAAK,GAAG,eAAe,CAAC,IAAI,CAAC;aAC9C;SACF,CAAC;QAEM,wBAAmB,GAAG;YAC5B,IAAI,CAAC,UAAU,GAAG,CAAC,IAAI,CAAC,UAAU,CAAC;YACnC,IAAI,IAAI,CAAC,UAAU,EAAE;gBACnB,IAAI,CAAC,QAAQ,CAAC,KAAK,EAAE,CAAC;aACvB;SACF,CAAC;QAEM,uBAAkB,GAAG;YAC3B,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC;SAC5B,CAAC;QAEM,sBAAiB,GAAG;YAC1B,IAAI,CAAC,cAAc,GAAG,KAAK,CAAC;SAC7B,CAAC;QAEM,mBAAc,GAAG;YACvB,IAAI,IAAI,CAAC,kBAAkB,EAAE;gBAC3B,IAAI,CAAC,iBAAiB,CAAC,QAAQ,CAAC,CAAC,EAAE,IAAI,CAAC,iBAAiB,CAAC,YAAY,CAAC,CAAC;gBACxE,IAAI,CAAC,iBAAiB,CAAC,SAAS;oBAC9B,IAAI,CAAC,iBAAiB,CAAC,YAAY;wBACnC,IAAI,CAAC,iBAAiB,CAAC,YAAY,CAAC;aACvC;SACF,CAAC;QAEF,2CAAqB;YACnB,IAAI,CAAC,EAAE,CAAC,eAAe,CAAC,UAAU,CAAC,CAAC;SACrC,EAAC;QAEF,yCAAmB;YACjB,IAAI,CAAC,EAAE,CAAC,YAAY,CAAC,UAAU,EAAE,GAAG,CAAC,CAAC;SACvC,EAAC;4BAhUsB,KAAK;4BAKL,KAAK;0BAWP,KAAK;8BAKD,KAAK;;wBAUgB,EAAE;+BAUd,OAAO;+BAKW,eAAe;;;;;sBAyB1C,IAAI;;IAhE9B,wBAAwB,CAAC,YAAqB;QAC5C,IAAI,CAAC,YAAY,EAAE;YACjB,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC;SACtB;KACF;IAsBD,oBAAoB;QAClB,IAAI,CAAC,oBAAoB,EAAE,CAAC;QAC5B,IAAI,CAAC,gBAAgB,EAAE,CAAC;KACzB;IAqCD,MAAM,iBAAiB;QACrB,IAAI,CAAC,gBAAgB,GAAG,MAAM,MAAM,CAAC,mBAAmB,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;QAClE,IAAI,CAAC,oBAAoB,EAAE,CAAC;QAC5B,IAAI,CAAC,gBAAgB,EAAE,CAAC;QACxB,IAAI,CAAC,eAAe,EAAE,CAAC;KACxB;IAED,gBAAgB;QACd,IAAI,CAAC,kBAAkB;YACrB,IAAI,CAAC,UAAU,CAAC,UAAU,CAAC,aAAa,CAAC,UAAU,CAAC,CAAC;QACvD,IAAI,CAAC,EAAE,CAAC,gBAAgB,CAAC,WAAW,EAAE,uBAAA,IAAI,wCAAmB,CAAC,CAAC;QAC/D,IAAI,CAAC,EAAE,CAAC,gBAAgB,CAAC,SAAS,EAAE,uBAAA,IAAI,sCAAiB,CAAC,CAAC;KAC5D;IAED,kBAAkB;QAChB,IAAI,IAAI,CAAC,QAAQ,EAAE;YACjB,UAAU,CAAC;;gBAET,IAAI,CAAC,UAAU,CAAC,KAAK,EAAE,CAAC;gBACxB,IAAI,CAAC,QAAQ,GAAG,KAAK,CAAC;aACvB,EAAE,EAAE,CAAC,CAAC;SACR;QACD,UAAU,CAAC;YACT,IAAI,CAAC,cAAc,EAAE,CAAC;SACvB,EAAE,GAAG,CAAC,CAAC;KACT;IAGD,WAAW,CAAC,KAAiB;QAC3B,IAAI,IAAI,CAAC,UAAU,EAAE;YACnB,KAAK,CAAC,cAAc,EAAE,CAAC;YACvB,IAAI,CAAC,UAAU,CAAC,KAAK,EAAE,CAAC;SACzB;KACF;;;;IAMD,MAAM,KAAK;QACT,IAAI,CAAC,QAAQ,GAAG,EAAE,CAAC;KACpB;;;;IAMD,MAAM,UAAU,CAAC,OAAgB;;QAC/B,IAAI,CAAA,MAAA,OAAO,CAAC,IAAI,0CAAE,MAAM,IAAG,CAAC,EAAE;YAC5B,MAAM,QAAQ,GAAG,CAAC,GAAG,IAAI,CAAC,QAAQ,CAAC,CAAC;YACpC,MAAM,uBAAuB,GAC3B,CAAA,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAE,MAAM,IAAG,CAAC;gBACpB,QAAQ,CAAC,QAAQ,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,IAAI,KAAK,uBAAuB,CAAC;YACjE,IAAI,uBAAuB,EAAE;gBAC3B,QAAQ,CAAC,GAAG,EAAE,CAAC;aAChB;YACD,QAAQ,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;YACvB,IAAI,CAAC,QAAQ,GAAG,QAAQ,CAAC;SAC1B;KACF;IA8LD,MAAM;;QACJ,QACE,EAAC,IAAI,IACH,KAAK,EAAE;gBACL,CAAC,cAAc,IAAI,CAAC,eAAe,EAAE,GAAG,IAAI;gBAC5C,wBAAwB,EAAE,IAAI,CAAC,YAAY;aAC5C,EACD,QAAQ,EAAC,GAAG,IAEZ,gBAAU,KAAK,EAAE,WAAW,GAAa,EACzC,WAAK,KAAK,EAAC,qBAAqB,IAC9B,eAAa,EACb,cAAQ,KAAK,EAAC,QAAQ,IACpB,WAAK,KAAK,EAAC,mBAAmB,IAC5B,iBAAW,IAAI,EAAC,UAAU,IACvB,IAAI,CAAC,gBAAgB,CAAC,aAAa,CAC1B,EACZ,WAAK,KAAK,EAAC,yBAAyB,IACjC,IAAI,CAAC,MAAM,IACV,kBACE,KAAK,EAAC,uBAAuB,EAC7B,IAAI,EAAC,UAAU,EACf,IAAI,EAAC,YAAY,EACjB,OAAO,EAAE,IAAI,CAAC,mBAAmB,EACjC,QAAQ,EAAE,IAAI,CAAC,QAAQ,CAAC,MAAM,KAAK,CAAC,GACxB,IACZ,IAAI,EAER,kBACE,KAAK,EAAC,sBAAsB,EAC5B,IAAI,EAAC,UAAU,EACf,IAAI,EAAC,YAAY,EACjB,OAAO,EAAE,IAAI,CAAC,aAAa,EAC3B,QAAQ,EAAE,IAAI,CAAC,QAAQ,CAAC,MAAM,KAAK,CAAC,GACxB,CACV,CACF,EACL,IAAI,CAAC,MAAM,IACV,WACE,KAAK,EAAE;gBACL,oBAAoB,EAAE,IAAI;gBAC1B,6BAA6B,EAAE,IAAI,CAAC,UAAU;aAC/C,IAED,WAAK,KAAK,EAAC,sBAAsB,IAC/B,qBACE,KAAK,EAAC,gBAAgB,EACtB,OAAO,EAAE,IAAI,CAAC,qBAA4B,EAC1C,GAAG,EAAE,EAAE,KAAK,IAAI,CAAC,QAAQ,GAAG,EAA4B,CAAC,GAC1C,CACb,CACF,IACJ,IAAI,CACD,EAET,WACE,KAAK,EAAE;gBACL,kBAAkB,EAAE,IAAI;gBACxB,YAAY,EAAE,IAAI;aACnB,EACD,GAAG,EAAE,EAAE,KAAK,IAAI,CAAC,iBAAiB,GAAG,EAAoB,CAAC,IAEzD,CAAA,MAAA,IAAI,CAAC,QAAQ,0CAAE,MAAM,KACpB,UAAI,KAAK,EAAE,EAAE,QAAQ,EAAE,IAAI,EAAE,IAC1B,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC,OAAO,EAAE,CAAC;YAC5B,OAAO,IAAI,CAAC,aAAa,CAAC,OAAO,EAAE,CAAC,CAAC,CAAC;SACvC,CAAC,CACC,IACH,IAAI,CACJ,EAEN,WACE,KAAK,EAAE;gBACL,MAAM,EAAE,IAAI;aACb,IAED,yBACE,EAAE,QACF,KAAK,EAAC,kBAAkB,EACxB,KAAK,EAAE,IAAI,CAAC,WAAW,EACvB,SAAS,EAAE,IAAI,CAAC,eAAe,EAC/B,WAAW,EACT,IAAI,CAAC,YAAY;kBACb,IAAI,CAAC,gBAAgB,CAAC,0BAA0B;kBAChD,IAAI,CAAC,gBAAgB,CAAC,iBAAiB,EAE7C,OAAO,EAAE,IAAI,CAAC,oBAAoB,EAClC,OAAO,EAAE,IAAI,CAAC,kBAAkB,EAChC,gBAAgB,EAAE,IAAI,CAAC,oBAAoB,EAC3C,MAAM,EAAE,IAAI,CAAC,iBAAiB,EAC9B,OAAO,EAAE,IAAI,CAAC,kBAAkB,EAChC,QAAQ,EAAE,IAAI,CAAC,YAAY,EAC3B,GAAG,EAAE,EAAE,KAAK,IAAI,CAAC,UAAU,GAAG,EAAgC,CAAC,GAC5C,EACpB,CAAC,IAAI,CAAC,YAAY;YACnB,CAAC,IAAI,CAAC,YAAY;YAClB,CAAC,IAAI,CAAC,cAAc;YACpB,CAAA,MAAA,IAAI,CAAC,cAAc,0CAAE,MAAM,IAAG,CAAC,IAC7B,WACE,KAAK,EAAE;gBACL,iBAAiB,EAAE,IAAI;aACxB,IAEA,IAAI,CAAC,cAAc,CAAC,GAAG,CAAC,CAAC,QAAQ,EAAE,CAAC;;YAEnC,OAAO,CAAC,IAAI,CAAC,IACX,YAAM,KAAK,EAAC,kBAAkB,IAAE,QAAQ,CAAQ,IAC9C,IAAI,CAAC;SACV,CAAC,CACE,IACJ,IAAI,CACJ,CACF,CACD,EACP;KACH;;;;;;;;;;;;;","names":[],"sources":["src/components/ai-assistant/ai-assistant.scss?tag=gx-ide-ai-assistant&encapsulation=shadow","src/components/ai-assistant/ai-assistant.tsx"],"sourcesContent":["@import \"../../global/gx-ide-common.scss\";\n@import \"../../global/gx-ide-mixins.scss\";\n@import \"../../../node_modules/@genexus/gemini/dist/gemini/globals/mixins.scss\";\n\n:host {\n font-family: var(--mer-font-family--primary);\n display: block;\n height: 100%;\n flex-basis: 286px;\n flex-shrink: 0;\n height: 100%;\n overflow-y: auto;\n}\n.gx-ide-main-wrapper {\n padding: 0 10px 52px 10px;\n background-color: var(--mer-surface);\n height: 100%;\n display: grid;\n grid-template-rows: auto 1fr auto;\n gap: var(--mer-spacing--sm);\n}\n\n/*--- Header ---*/\n.header {\n padding-block-start: var(--mer-spacing--sm);\n display: flex;\n flex-direction: column;\n\n &__actions-wrapper {\n display: flex;\n gap: var(--ai-assistant-header-actions-gap);\n margin-inline-start: auto;\n }\n &__first-row {\n display: flex;\n gap: var(--mer-spacing--xs);\n align-items: center;\n justify-content: space-between;\n }\n &__filter {\n margin-block-start: var(--mer-spacing--xs);\n }\n &__second-row {\n transition: 100ms grid-template-rows;\n display: grid;\n grid-template-rows: 0fr;\n\n &--visible {\n grid-template-rows: 1fr;\n }\n }\n .filter-inner-wrapper {\n overflow: hidden;\n }\n}\n\n/*--- Messages ---*/\n.messages-wrapper {\n position: relative;\n overflow: auto;\n display: flex;\n flex-direction: column;\n scroll-behavior: smooth;\n @include gxg-scrollbar();\n}\n.messages {\n display: flex;\n flex-direction: column;\n list-style-type: none;\n padding: 0;\n margin: 0;\n}\n\n/*--- Prompt ---*/\n.prompt {\n position: relative;\n margin-top: auto;\n\n &__textarea {\n &::part(textarea-wrapper) {\n border: none;\n }\n &::part(textarea) {\n border: none;\n background-color: var(--mer-color__neutral-gray--800);\n }\n }\n &__shortcuts {\n position: absolute;\n display: flex;\n align-items: center;\n gap: var(--mer-spacing--2xs);\n padding-inline-end: var(--mer-spacing--xs);\n right: 0;\n top: 0;\n height: 100%;\n }\n &__shortcut {\n color: var(--mer-color__neutral-gray--400);\n font-size: var(--mer-font__size--2xs);\n padding: var(--mer-spacing--3xs) var(--mer-spacing--xs);\n background-color: var(--mer-color__neutral-gray--700);\n border-radius: var(--mer-border__radius--xs);\n }\n}\n","import {\n Component,\n Host,\n h,\n Prop,\n Element,\n Method,\n State,\n Watch,\n Listen\n} from \"@stencil/core\";\n\nconst CSS_BUNDLES: MercuryBundles = [\n \"resets/box-sizing\",\n \"components/icon\",\n \"components/button\"\n];\n\nimport { Locale } from \"../../common/locale\";\n\nimport { MercuryBundles } from \"@genexus/mercury\";\n\n@Component({\n tag: \"gx-ide-ai-assistant\",\n styleUrl: \"ai-assistant.scss\",\n shadow: true,\n assetsDirs: [\"gx-ide-assets/ai-assistant\"]\n})\nexport class GxIdeTemplate {\n /**\n * The component hard-coded strings translations.\n */\n private _componentLocale: any;\n /* lastUserMessageHeight is used to set the appropriate height on the textarea, if user presses arrowUp (recover last message)*/\n private lastUserMessageHeight: number;\n private setFocus = true;\n private scrollToBottomFlag = true;\n\n @Element() el: HTMLGxIdeAiAssistantElement;\n private textAreaEl!: HTMLGxgFormTextareaElement;\n private textareaShadowPart: HTMLTextAreaElement;\n private filterEl: HTMLGxgFormTextElement;\n private messagesWrapperEl!: HTMLDivElement;\n\n /**\n * Flag used to hide the shortcuts\n */\n @State() userHasTyped = false;\n\n /**\n * This is true if the last message is of type 'assistant-in-progress'\n */\n @State() aIInProgress = false;\n @Watch(\"aIInProgress\")\n watchAIInProgressHandler(aiInProgress: boolean) {\n if (!aiInProgress) {\n this.setFocus = true;\n }\n }\n\n /**\n * This displays or hides the messages filter\n */\n @State() showFilter = false;\n\n /**\n * True if the prompt textbox has focus\n */\n @State() promptHasFocus = false;\n\n /**\n * The filter value\n */\n @State() filterValue: string;\n\n /**\n * List of messages displayed by the component\n */\n @Prop({ mutable: true }) messages: Message[] = [];\n @Watch(\"messages\")\n watchMessagesHandler() {\n this.evaluateAiInProgress();\n this.evaluateAiStatus();\n }\n\n /**\n * The prompt textarea max-height\n */\n @Prop() readonly promptMaxHeight = \"128px\";\n\n /**\n * A temporary property to illustrate the assistant status\n */\n @Prop({ mutable: true }) assistantStatus: AiStatus = \"indeterminate\";\n\n /**\n * List of keys that make up the shortcut to focus on the component's text input\n */\n @Prop() readonly focusShortcuts: string[];\n\n /**\n * List of keys that make up the shortcut to focus on the component's text input\n */\n @Prop() readonly userMessageCallback: UserMessageCallback;\n\n /**\n * Callback that must be invoked when the conversation is cleared, using the header button.\n */\n @Prop() readonly clearCallback: () => Promise<void>;\n\n /**\n * the prompt value\n */\n @Prop() readonly promptValue: string;\n\n /**\n * If tue, it will display a filter.\n */\n @Prop() readonly filter = true;\n\n async componentWillLoad() {\n this._componentLocale = await Locale.getComponentStrings(this.el);\n this.evaluateAiInProgress();\n this.evaluateAiStatus();\n this.attachShortcuts();\n }\n\n componentDidLoad() {\n this.textareaShadowPart =\n this.textAreaEl.shadowRoot.querySelector(\"textarea\");\n this.el.addEventListener(\"mousedown\", this.#mouseDownListener);\n this.el.addEventListener(\"mouseup\", this.#mouseUpListener);\n }\n\n componentDidRender() {\n if (this.setFocus) {\n setTimeout(() => {\n /* Doesn't seems to work without the setTimeout */\n this.textAreaEl.focus();\n this.setFocus = false;\n }, 50);\n }\n setTimeout(() => {\n this.scrollToBottom();\n }, 200);\n }\n\n @Listen(\"focus\", { capture: true })\n handleFocus(event: FocusEvent) {\n if (this.textAreaEl) {\n event.preventDefault();\n this.textAreaEl.focus();\n }\n }\n\n /**\n * Clear the list of messages\n */\n @Method()\n async clear() {\n this.messages = [];\n }\n\n /**\n * Add a message. This method will be used by the host to add messages from the assistant\n */\n @Method()\n async addMessage(message: Message) {\n if (message.text?.length > 0) {\n const messages = [...this.messages];\n const updateInProgressMessage =\n messages?.length > 0 &&\n messages[messages.length - 1].type === \"assistant-in-progress\";\n if (updateInProgressMessage) {\n messages.pop();\n }\n messages.push(message);\n this.messages = messages;\n }\n }\n\n private evaluateAiInProgress = () => {\n if (\n this.messages?.length > 0 &&\n this.messages[this.messages.length - 1].type === \"assistant-in-progress\"\n ) {\n this.aIInProgress = true;\n } else {\n this.aIInProgress = false;\n }\n };\n\n private evaluateAiStatus = () => {\n if (this.messages?.length === 0) {\n this.assistantStatus = \"indeterminate\";\n return;\n }\n if (\n this.messages[this.messages.length - 1].type ===\n \"assistant-in-progress\" ||\n this.messages[this.messages.length - 1].type === \"user\"\n ) {\n this.assistantStatus = \"indeterminate\";\n } else if (\n this.messages[this.messages.length - 1].type === \"assistant-error\"\n ) {\n this.assistantStatus = \"error\";\n } else {\n this.assistantStatus = \"success\";\n }\n };\n\n private renderMessage = (\n message: Message,\n i: number\n ): HTMLLIElement | void => {\n if (message.text.length > 0) {\n return (\n <gx-ide-ai-message\n style={{\n \"--primary-color\": \"lightblue\"\n }}\n message={message.text}\n messageType={message.type}\n hidden={message.hidden}\n filterValue={this.filterValue}\n key={`${i.toString()}-${message.type}`}\n translations={this._componentLocale.aiMessage}\n aiAssistantHostRef={this.el}\n ></gx-ide-ai-message>\n );\n }\n };\n\n private textAreaInputHandler = () => {\n this.userHasTyped = true;\n this.showFilter = false;\n this.filterEl.value = \"\";\n this.filterValue = \"\";\n this.scrollToBottomFlag = true;\n };\n\n private promptEnterHandler = async (prompt: CustomEvent<string>) => {\n /* First remove double spaces */\n const promptTrimmed = prompt.detail.replace(/\\s+/g, \" \");\n /* Update textarea value to get the proper height */\n this.textAreaEl.value = promptTrimmed;\n setTimeout(() => {\n /* Then save the actual height (setTimeOut required) */\n this.lastUserMessageHeight = this.textAreaEl.offsetHeight;\n }, 0);\n /* The clear the textarea */\n this.textAreaEl.value = \"\";\n /* Insert the user message */\n this.addMessage({\n type: \"user\",\n text: promptTrimmed\n });\n /* Call the callback */\n if (this.userMessageCallback && !this.aIInProgress) {\n this.aIInProgress = true;\n this.userMessageCallback(promptTrimmed).then(() => {\n this.aIInProgress = false;\n });\n }\n };\n\n private filterMessagesHandler = (e: CustomEvent<string>) => {\n this.scrollToBottomFlag = false;\n this.filterValue = e.detail.toLowerCase();\n const filteredMessages = [...this.messages];\n filteredMessages.forEach(message => {\n if (message.text.toLowerCase().includes(this.filterValue)) {\n message.hidden = false;\n } else {\n message.hidden = true;\n }\n });\n this.messages = filteredMessages;\n };\n\n private clearMessages = () => {\n this.messages = [];\n this.textAreaEl.focus();\n if (this.clearCallback) {\n this.clearCallback();\n }\n };\n\n private attachShortcuts = () => {\n if (this.focusShortcuts?.length > 0) {\n const ctrlFocusIndex = this.focusShortcuts.findIndex(\n key => key.toLocaleLowerCase() === \"ctrl\"\n );\n const shiftFocusIndex = this.focusShortcuts.findIndex(\n key => key.toLocaleLowerCase() === \"shift\"\n );\n const cmdKeyIndex = this.focusShortcuts.findIndex(\n key => key.toLocaleLowerCase() === \"cmd\"\n );\n const keyFocus = this.focusShortcuts\n .find(key => {\n return (\n key.toLocaleLowerCase() !== \"ctrl\" &&\n key.toLocaleLowerCase() !== \"shift\" &&\n key.toLocaleLowerCase() !== \"cmd\"\n );\n })\n .toLowerCase();\n document.addEventListener(\"keydown\", (e: KeyboardEvent) => {\n if (e.key === keyFocus && ctrlFocusIndex !== -1 && e.ctrlKey) {\n this.textAreaEl.focus();\n this.userHasTyped = true;\n } else if (e.key === keyFocus && shiftFocusIndex !== -1 && e.shiftKey) {\n this.textAreaEl.focus();\n this.userHasTyped = true;\n } else if (e.key === keyFocus && cmdKeyIndex !== -1 && e.metaKey) {\n this.textAreaEl.focus();\n this.userHasTyped = true;\n }\n });\n }\n };\n\n private promptArrowUpHandler = () => {\n this.userHasTyped = true;\n const lastUserMessage = this.messages?.find(message => {\n return message.type === \"user\";\n });\n if (lastUserMessage) {\n if (this.lastUserMessageHeight) {\n this.textareaShadowPart.style.height = `${this.lastUserMessageHeight}px`;\n }\n this.textAreaEl.value = lastUserMessage.text;\n }\n };\n\n private toggleFilterHandler = () => {\n this.showFilter = !this.showFilter;\n if (this.showFilter) {\n this.filterEl.focus();\n }\n };\n\n private promptFocusHandler = () => {\n this.promptHasFocus = true;\n };\n\n private promptBlurHandler = () => {\n this.promptHasFocus = false;\n };\n\n private scrollToBottom = () => {\n if (this.scrollToBottomFlag) {\n this.messagesWrapperEl.scrollTo(0, this.messagesWrapperEl.scrollHeight);\n this.messagesWrapperEl.scrollTop =\n this.messagesWrapperEl.scrollHeight -\n this.messagesWrapperEl.clientHeight;\n }\n };\n\n #mouseDownListener = () => {\n this.el.removeAttribute(\"tabindex\");\n };\n\n #mouseUpListener = () => {\n this.el.setAttribute(\"tabindex\", \"0\");\n };\n\n render() {\n return (\n <Host\n class={{\n [`assistant--${this.assistantStatus}`]: true,\n \"assistant--in-progress\": this.aIInProgress\n }}\n tabindex=\"0\"\n >\n <ch-theme model={CSS_BUNDLES}></ch-theme>\n <div class=\"gx-ide-main-wrapper\">\n <slot></slot>\n <header class=\"header\">\n <div class=\"header__first-row\">\n <gxg-title type=\"title-02\">\n {this._componentLocale.componentName}\n </gxg-title>\n <div class=\"header__actions-wrapper\">\n {this.filter ? (\n <gxg-button\n class=\"header__filter-button\"\n type=\"tertiary\"\n icon=\"menus/find\"\n onClick={this.toggleFilterHandler}\n disabled={this.messages.length === 0}\n ></gxg-button>\n ) : null}\n\n <gxg-button\n class=\"header__clear-button\"\n type=\"tertiary\"\n icon=\"bpm/delete\"\n onClick={this.clearMessages}\n disabled={this.messages.length === 0}\n ></gxg-button>\n </div>\n </div>\n {this.filter ? (\n <div\n class={{\n \"header__second-row\": true,\n \"header__second-row--visible\": this.showFilter\n }}\n >\n <div class=\"filter-inner-wrapper\">\n <gxg-form-text\n class=\"header__filter\"\n onInput={this.filterMessagesHandler as any}\n ref={el => (this.filterEl = el as HTMLGxgFormTextElement)}\n ></gxg-form-text>\n </div>\n </div>\n ) : null}\n </header>\n\n <div\n class={{\n \"messages-wrapper\": true,\n \"scrollable\": true\n }}\n ref={el => (this.messagesWrapperEl = el as HTMLDivElement)}\n >\n {this.messages?.length ? (\n <ol class={{ messages: true }}>\n {this.messages.map((message, i) => {\n return this.renderMessage(message, i);\n })}\n </ol>\n ) : null}\n </div>\n\n <div\n class={{\n prompt: true\n }}\n >\n <gxg-form-textarea\n ai\n class=\"prompt__textarea\"\n value={this.promptValue}\n maxHeight={this.promptMaxHeight}\n placeholder={\n this.aIInProgress\n ? this._componentLocale.processingQueryPlaceholder\n : this._componentLocale.promptPlaceholder\n }\n onInput={this.textAreaInputHandler}\n onEnter={this.promptEnterHandler}\n onArrowUpPressed={this.promptArrowUpHandler}\n onBlur={this.promptBlurHandler}\n onFocus={this.promptFocusHandler}\n disabled={this.aIInProgress}\n ref={el => (this.textAreaEl = el as HTMLGxgFormTextareaElement)}\n ></gxg-form-textarea>\n {!this.userHasTyped &&\n !this.aIInProgress &&\n !this.promptHasFocus &&\n this.focusShortcuts?.length > 0 ? (\n <div\n class={{\n prompt__shortcuts: true\n }}\n >\n {this.focusShortcuts.map((shortcut, i) => {\n /* Up to three keys allowed*/\n return i <= 2 ? (\n <span class=\"prompt__shortcut\">{shortcut}</span>\n ) : null;\n })}\n </div>\n ) : null}\n </div>\n </div>\n </Host>\n );\n }\n}\n\nexport type AiStatus = \"indeterminate\" | \"success\" | \"error\";\n\nexport type Message = {\n type: MessageType;\n text: string;\n hidden?: boolean;\n filterValue?: string;\n};\n\nexport type MessageType =\n | \"user\"\n | \"assistant-chat\"\n | \"assistant-action\"\n | \"assistant-in-progress\"\n | \"assistant-error\";\n\nexport type UserMessageCallback = (text: string) => Promise<void>;\n"],"version":3}
package/dist/esm/gx-ide-ai-message.entry.js CHANGED
@@ -3,8 +3,16 @@ import { g as getIconPath } from './MERCURY_ASSETS-7a7c1795.js';
3
3
  import { L as Locale } from './locale-e5107fad.js';
4
4
  import { h as hiChar } from './helpers-39459872.js';
5
5
 
6
- const aiMessageCss = ":host{font-family:var(--mer-font-family--primary)}.message{color:var(--mer-color__neutral-gray--100);display:grid;grid-template-rows:0fr;transition:grid-template-rows 100ms;transition:grid-template-rows 100ms, -ms-grid-rows 100ms;}.message__outer-wrapper{overflow:hidden}.message__inner-wrapper{padding:var(--mer-spacing--sm) var(--mer-spacing--sm);border-radius:var(--mer-border__radius--sm);border-inline-start:var(--mer-border__width--md) solid transparent;background-color:var(--mer-color__neutral-gray--1200);margin-block-start:var(--mer-spacing--xs);position:relative}.message__header{display:flex;gap:var(--mer-spacing--xs);justify-content:space-between;pointer-events:none}.message__header .icon-md{opacity:0}.message__role{display:inline-block;font-weight:var(--mer-font__weight--semi-bold);margin-block-end:var(--mer-spacing--xs);display:inline-grid;grid-template-columns:max-content max-content;gap:6px}.message__role:before{content:\"\";display:grid;place-self:center flex-end;inline-size:4px;block-size:4px;border-radius:50%;background-color:currentcolor}.message__role--user{color:var(--mer-color__primary--300)}.message__role--hidden{display:none}.message__caption{font-size:var(--mer-font__size--xs);line-height:var(--mer-line-height--regular)}.message--visible{grid-template-rows:1fr}.message--copying{pointer-events:none}.message--copying span:not(.copied),.message--copying .message__caption{color:transparent;-webkit-user-select:none;-ms-user-select:none;user-select:none;}.message--user .message__inner-wrapper{background-color:rgba(91, 167, 255, 0.08);border-color:var(--mer-border-color__primary)}.message--assistant-action .message__inner-wrapper{background-color:rgba(63, 168, 155, 0.05);border-color:var(--mer-border-color__success)}.message--assistant-chat .message__inner-wrapper{background-color:var(--mer-surface__elevation--01)}.message--assistant-in-progress{color:var(--mer-color__neutral-gray--500)}.message--assistant-in-progress .message__inner-wrapper{font-style:italic;display:grid;grid-template-columns:1fr auto;gap:var(--mer-spacing--xs)}.message--assistant-in-progress .message__inner-wrapper .message__caption{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;flex:1}.message--assistant-in-progress .message__inner-wrapper .animation-wrapper{flex:none}.message--assistant-error .message__inner-wrapper{background-color:rgba(251, 124, 132, 0.05);border-color:var(--mer-border-color__error)}.message--copyable{cursor:pointer}.message--copyable:hover{filter:brightness(1.2)}.message--copyable:hover .icon-md{opacity:1}.message:last-child{margin-block-end:0}:host(:first-child) .message__inner-wrapper{margin-block-end:0}.animation-wrapper{width:45px;display:flex;align-items:center;justify-content:center}.dot-pulse{position:relative;left:-9999px;width:5px;height:5px;border-radius:2.5px;background-color:var(--mer-color__neutral-gray--400);color:var(--mer-color__neutral-gray--400);box-shadow:9999px 0 0 -5px;animation:dot-pulse 1.5s infinite linear;animation-delay:0.25s}.dot-pulse::before,.dot-pulse::after{content:\"\";display:inline-block;position:absolute;top:0;width:5px;height:5px;border-radius:2.5px;background-color:var(--mer-color__neutral-gray--400);color:var(--mer-color__neutral-gray--400)}.dot-pulse::before{box-shadow:9984px 0 0 -5px;animation:dot-pulse-before 1.5s infinite linear;animation-delay:0s}.dot-pulse::after{box-shadow:10014px 0 0 -5px;animation:dot-pulse-after 1.5s infinite linear;animation-delay:0.5s}@keyframes dot-pulse-before{0%{box-shadow:9984px 0 0 -5px}30%{box-shadow:9984px 0 0 2px}60%,100%{box-shadow:9984px 0 0 -5px}}@keyframes dot-pulse{0%{box-shadow:9999px 0 0 -5px}30%{box-shadow:9999px 0 0 2px}60%,100%{box-shadow:9999px 0 0 -5px}}@keyframes dot-pulse-after{0%{box-shadow:10014px 0 0 -5px}30%{box-shadow:10014px 0 0 2px}60%,100%{box-shadow:10014px 0 0 -5px}}.copied{position:absolute;width:100%;height:100%;top:0;left:0;display:flex;align-items:center;justify-content:center;color:var(--mer-color__neutral-gray--300);display:flex;gap:var(--mer-spacing--xs);opacity:0;animation:fadeIn var(--mer-timing--fast) ease-out forwards}@keyframes fadeIn{0%{opacity:0}100%{opacity:1}}.hiChar{color:var(--mer-color__primary--200);filter:brightness(1.3)}";
6
+ const aiMessageCss = ":host{font-family:var(--mer-font-family--primary)}.message{color:var(--mer-color__neutral-gray--100);display:grid;grid-template-rows:0fr;transition:grid-template-rows 100ms;transition:grid-template-rows 100ms, -ms-grid-rows 100ms;}.message__outer-wrapper{overflow:hidden}.message__inner-wrapper{padding:var(--mer-spacing--sm) var(--mer-spacing--sm);border-radius:var(--mer-border__radius--sm);border-inline-start:var(--mer-border__width--md) solid transparent;background-color:var(--mer-color__neutral-gray--1200);margin-block-start:var(--mer-spacing--xs);position:relative}.message__header{display:flex;gap:var(--mer-spacing--xs);justify-content:space-between}.message__header .icon-md{opacity:0}.message__header--in-progress{display:contents}.message__role{font-weight:var(--mer-font__weight--semi-bold);margin-block-end:var(--mer-spacing--xs);display:inline-grid;grid-template-columns:max-content 1fr;gap:8px}.message__role:before{content:\"\";display:grid;place-self:center flex-end;inline-size:4px;block-size:4px;border-radius:50%;background-color:currentcolor}.message__role-description{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:inline-block;padding-block-start:2px}.message__role--user{color:var(--mer-color__primary--300)}.message__role--hidden{display:none}.message__caption{font-size:var(--mer-font__size--xs);line-height:var(--mer-line-height--regular)}.message--visible{grid-template-rows:1fr}.message--copying{pointer-events:none}.message--copying span:not(.copied),.message--copying .message__caption{color:transparent;-webkit-user-select:none;-ms-user-select:none;user-select:none;}.message--user .message__inner-wrapper{background-color:rgba(91, 167, 255, 0.08);border-color:var(--mer-border-color__primary)}.message--assistant-action .message__inner-wrapper{background-color:rgba(63, 168, 155, 0.05);border-color:var(--mer-border-color__success)}.message--assistant-chat .message__inner-wrapper{background-color:var(--mer-surface__elevation--01)}.message--assistant-in-progress{color:var(--mer-color__neutral-gray--500)}.message--assistant-in-progress .message__inner-wrapper{font-style:italic;display:grid;grid-template-columns:1fr auto;gap:var(--mer-spacing--xs)}.message--assistant-in-progress .message__inner-wrapper .message__caption{flex:1}.message--assistant-in-progress .message__inner-wrapper .animation-wrapper{flex:none}.message--assistant-error .message__inner-wrapper{background-color:rgba(251, 124, 132, 0.05);border-color:var(--mer-border-color__error)}.message--copyable:hover{filter:brightness(1.2)}.message--copyable:hover .icon-md{opacity:1}.message:last-child{margin-block-end:0}:host(:first-child) .message__inner-wrapper{margin-block-end:0}.animation-wrapper{width:45px;display:flex;align-items:center;justify-content:center}.dot-pulse{position:relative;left:-9999px;width:5px;height:5px;border-radius:2.5px;background-color:var(--mer-color__neutral-gray--400);color:var(--mer-color__neutral-gray--400);box-shadow:9999px 0 0 -5px;animation:dot-pulse 1.5s infinite linear;animation-delay:0.25s}.dot-pulse::before,.dot-pulse::after{content:\"\";display:inline-block;position:absolute;top:0;width:5px;height:5px;border-radius:2.5px;background-color:var(--mer-color__neutral-gray--400);color:var(--mer-color__neutral-gray--400)}.dot-pulse::before{box-shadow:9984px 0 0 -5px;animation:dot-pulse-before 1.5s infinite linear;animation-delay:0s}.dot-pulse::after{box-shadow:10014px 0 0 -5px;animation:dot-pulse-after 1.5s infinite linear;animation-delay:0.5s}@keyframes dot-pulse-before{0%{box-shadow:9984px 0 0 -5px}30%{box-shadow:9984px 0 0 2px}60%,100%{box-shadow:9984px 0 0 -5px}}@keyframes dot-pulse{0%{box-shadow:9999px 0 0 -5px}30%{box-shadow:9999px 0 0 2px}60%,100%{box-shadow:9999px 0 0 -5px}}@keyframes dot-pulse-after{0%{box-shadow:10014px 0 0 -5px}30%{box-shadow:10014px 0 0 2px}60%,100%{box-shadow:10014px 0 0 -5px}}.copied{position:absolute;width:100%;height:100%;top:0;left:0;display:flex;align-items:center;justify-content:center;color:var(--mer-color__neutral-gray--300);display:flex;gap:var(--mer-spacing--xs);opacity:0;animation:fadeIn var(--mer-timing--regular) ease-out forwards}@keyframes fadeIn{0%{opacity:0}100%{opacity:1}}.hiChar{color:var(--mer-color__primary--200);filter:brightness(1.3)}";
7
7
 
8
+ var __classPrivateFieldGet = (undefined && undefined.__classPrivateFieldGet) || function (receiver, state, kind, f) {
9
+ if (kind === "a" && !f)
10
+ throw new TypeError("Private accessor was defined without a getter");
11
+ if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver))
12
+ throw new TypeError("Cannot read private member from an object whose class did not declare it");
13
+ return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
14
+ };
15
+ var _GxIdeAiMessage_buttonMouseDownHandler;
8
16
  const COPY_ICON = getIconPath({
9
17
  category: "bpm",
10
18
  name: "tasks",
@@ -14,9 +22,6 @@ const GxIdeAiMessage = class {
14
22
  constructor(hostRef) {
15
23
  registerInstance(this, hostRef);
16
24
  this.copyable = false;
17
- // 7.LISTENERS //
18
- // 8.PUBLIC METHODS API //
19
- // 9.LOCAL METHODS //
20
25
  this.copyMessage = () => {
21
26
  const messageInfo = JSON.stringify({
22
27
  messageType: this.messageType,
@@ -28,22 +33,25 @@ const GxIdeAiMessage = class {
28
33
  this.showCopiedMessage = false;
29
34
  }, 1500);
30
35
  };
36
+ _GxIdeAiMessage_buttonMouseDownHandler.set(this, (e) => {
37
+ e.preventDefault();
38
+ e.stopPropagation();
39
+ });
31
40
  this.evaluateMessageIsCopyable = () => {
32
41
  this.copyable = this.messageType !== "assistant-in-progress";
33
42
  };
34
43
  this.evaluateCopyIcon = () => {
35
- return this.copyable ? (h("ch-image", { class: "icon-md", src: COPY_ICON })) : null;
44
+ return this.copyable ? (h("button", { class: "button-tertiary button-icon-only", "aria-label": "copy", onClick: this.copyMessage, onMouseDown: __classPrivateFieldGet(this, _GxIdeAiMessage_buttonMouseDownHandler, "f") }, h("ch-image", { class: "icon-md", src: COPY_ICON }))) : null;
36
45
  };
37
46
  this.visible = false;
38
47
  this.showCopiedMessage = false;
48
+ this.aiAssistantHostRef = undefined;
39
49
  this.message = undefined;
40
50
  this.messageType = undefined;
41
51
  this.filterValue = undefined;
42
52
  this.hidden = undefined;
43
53
  this.translations = undefined;
44
54
  }
45
- // 5.EVENTS (EMIT) //
46
- // 6.COMPONENT LIFECYCLE METHODS //
47
55
  async componentWillLoad() {
48
56
  this._componentLocale = await Locale.getComponentStrings(this.el);
49
57
  this.evaluateMessageIsCopyable();
@@ -56,7 +64,6 @@ const GxIdeAiMessage = class {
56
64
  messagesList.scrollTo(0, 0);
57
65
  }, 0);
58
66
  }
59
- // 10.RENDER() FUNCTION //
60
67
  render() {
61
68
  return (h("li", { class: {
62
69
  "message": true,
@@ -65,13 +72,16 @@ const GxIdeAiMessage = class {
65
72
  "message--assistant": this.messageType !== "user",
66
73
  "message--copyable": this.copyable,
67
74
  "message--copying": this.showCopiedMessage
68
- }, onClick: this.copyable && this.copyMessage }, h("div", { class: "message__outer-wrapper" }, h("div", { class: {
75
+ } }, h("div", { class: "message__outer-wrapper" }, h("div", { class: {
69
76
  "message__inner-wrapper": true
70
- } }, this.messageType === "user" ? (h("div", { class: "message__header" }, h("span", { class: "message__role message__role--user" }, this._componentLocale.you), this.evaluateCopyIcon())) : (h("div", { class: "message__header" }, h("span", { class: {
77
+ } }, this.messageType === "user" ? (h("div", { class: "message__header" }, h("span", { class: "message__role message__role--user" }, h("span", { class: "message__role-description" }, this._componentLocale.you)), this.evaluateCopyIcon())) : (h("div", { class: {
78
+ "message__header": true,
79
+ "message__header--in-progress": this.messageType === "assistant-in-progress"
80
+ } }, h("span", { class: {
71
81
  "message__role": this.messageType !== "assistant-in-progress",
72
82
  "message__role--hidden": this.messageType === "assistant-in-progress",
73
83
  "message__role--assistant": true
74
- } }, this._componentLocale.assistant), this.evaluateCopyIcon())), h("div", { class: {
84
+ } }, h("span", { class: "message__role-description" }, this._componentLocale.assistant)), this.evaluateCopyIcon())), h("div", { class: {
75
85
  "message__caption": true,
76
86
  "message__caption--in-progress": this.messageType === "assistant-in-progress"
77
87
  } }, this.showCopiedMessage ? (h("span", { class: "copied" }, h("ch-image", { class: "icon-md", src: COPY_ICON }), this.translations["copied"])) : null, hiChar(this.message, this.filterValue)), this.messageType === "assistant-in-progress" ? (h("div", { class: "animation-wrapper" }, h("div", { class: "dot-pulse" }))) : null))));
@@ -79,6 +89,7 @@ const GxIdeAiMessage = class {
79
89
  static get assetsDirs() { return ["gx-ide-assets/ai-message"]; }
80
90
  get el() { return getElement(this); }
81
91
  };
92
+ _GxIdeAiMessage_buttonMouseDownHandler = new WeakMap();
82
93
  GxIdeAiMessage.style = aiMessageCss;
83
94
 
84
95
  export { GxIdeAiMessage as gx_ide_ai_message };
package/dist/esm/gx-ide-ai-message.entry.js.map CHANGED
@@ -1 +1 @@
1
- {"file":"gx-ide-ai-message.entry.js","mappings":"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","names":[],"sources":["src/components/ai-assistant/ai-message.scss?tag=gx-ide-ai-message","src/components/ai-assistant/ai-message.tsx"],"sourcesContent":["@import \"../../global/gx-ide-mixins.scss\";\n\n:host {\n font-family: var(--mer-font-family--primary);\n}\n/*--- Messages ---*/\n.message {\n color: var(--mer-color__neutral-gray--100);\n display: grid;\n grid-template-rows: 0fr;\n transition: grid-template-rows 100ms;\n transition: grid-template-rows 100ms, -ms-grid-rows 100ms;\n &__outer-wrapper {\n overflow: hidden;\n }\n &__inner-wrapper {\n padding: var(--mer-spacing--sm) var(--mer-spacing--sm);\n border-radius: var(--mer-border__radius--sm);\n border-inline-start: var(--mer-border__width--md) solid transparent;\n background-color: var(--mer-color__neutral-gray--1200);\n margin-block-start: var(--mer-spacing--xs);\n position: relative;\n }\n &__header {\n display: flex;\n gap: var(--mer-spacing--xs);\n justify-content: space-between;\n pointer-events: none;\n\n .icon-md {\n opacity: 0;\n }\n }\n &__role {\n display: inline-block;\n font-weight: var(--mer-font__weight--semi-bold);\n margin-block-end: var(--mer-spacing--xs);\n display: inline-grid;\n grid-template-columns: max-content max-content;\n gap: 6px;\n &:before {\n content: \"\";\n display: grid;\n place-self: center flex-end;\n inline-size: 4px;\n block-size: 4px;\n border-radius: 50%;\n background-color: currentcolor;\n }\n\n &--user {\n color: var(--mer-color__primary--300);\n }\n &--assistant {\n }\n &--hidden {\n display: none;\n }\n }\n &__caption {\n font-size: var(--mer-font__size--xs);\n line-height: var(--mer-line-height--regular);\n }\n &--visible {\n grid-template-rows: 1fr;\n }\n &--copying {\n pointer-events: none;\n span:not(.copied),\n .message__caption {\n color: transparent;\n -webkit-user-select: none; /* Safari */\n -ms-user-select: none; /* IE 10 and IE 11 */\n user-select: none; /* Standard syntax */\n }\n }\n /*--- Types of messages ---*/\n &--user {\n .message__inner-wrapper {\n background-color: rgba(91, 167, 255, 0.08);\n border-color: var(--mer-border-color__primary);\n }\n }\n &--assistant-action {\n .message__inner-wrapper {\n background-color: rgba(63, 168, 155, 0.05);\n border-color: var(--mer-border-color__success);\n }\n }\n &--assistant-chat {\n .message__inner-wrapper {\n background-color: var(--mer-surface__elevation--01);\n }\n }\n &--assistant-in-progress {\n color: var(--mer-color__neutral-gray--500);\n .message__inner-wrapper {\n font-style: italic;\n display: grid;\n grid-template-columns: 1fr auto;\n gap: var(--mer-spacing--xs);\n\n .message__caption {\n @include ellipsis;\n flex: 1;\n }\n .animation-wrapper {\n flex: none;\n }\n }\n }\n &--assistant-error {\n .message__inner-wrapper {\n background-color: rgba(251, 124, 132, 0.05);\n border-color: var(--mer-border-color__error);\n }\n }\n &--copyable {\n cursor: pointer;\n &:hover {\n filter: brightness(1.2);\n .icon-md {\n opacity: 1;\n }\n }\n }\n &:last-child {\n margin-block-end: 0;\n }\n}\n:host(:first-child) {\n .message {\n &__inner-wrapper {\n margin-block-end: 0;\n }\n }\n}\n\n/*--- Dot Pulse Sweet Animation ---*/\n.animation-wrapper {\n width: 45px;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n$color: var(--mer-color__neutral-gray--400);\n.dot-pulse {\n position: relative;\n left: -9999px;\n width: 5px;\n height: 5px;\n border-radius: 2.5px;\n background-color: $color;\n color: $color;\n box-shadow: 9999px 0 0 -5px;\n animation: dot-pulse 1.5s infinite linear;\n animation-delay: 0.25s;\n &::before,\n &::after {\n content: \"\";\n display: inline-block;\n position: absolute;\n top: 0;\n width: 5px;\n height: 5px;\n border-radius: 2.5px;\n background-color: $color;\n color: $color;\n }\n &::before {\n box-shadow: 9984px 0 0 -5px;\n animation: dot-pulse-before 1.5s infinite linear;\n animation-delay: 0s;\n }\n &::after {\n box-shadow: 10014px 0 0 -5px;\n animation: dot-pulse-after 1.5s infinite linear;\n animation-delay: 0.5s;\n }\n}\n@keyframes dot-pulse-before {\n 0% {\n box-shadow: 9984px 0 0 -5px;\n }\n 30% {\n box-shadow: 9984px 0 0 2px;\n }\n 60%,\n 100% {\n box-shadow: 9984px 0 0 -5px;\n }\n}\n@keyframes dot-pulse {\n 0% {\n box-shadow: 9999px 0 0 -5px;\n }\n 30% {\n box-shadow: 9999px 0 0 2px;\n }\n 60%,\n 100% {\n box-shadow: 9999px 0 0 -5px;\n }\n}\n@keyframes dot-pulse-after {\n 0% {\n box-shadow: 10014px 0 0 -5px;\n }\n 30% {\n box-shadow: 10014px 0 0 2px;\n }\n 60%,\n 100% {\n box-shadow: 10014px 0 0 -5px;\n }\n}\n\n/*--- Copy Message ---*/\n.copied {\n position: absolute;\n width: 100%;\n height: 100%;\n top: 0;\n left: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n color: var(--mer-color__neutral-gray--300);\n display: flex;\n gap: var(--mer-spacing--xs);\n opacity: 0;\n animation: fadeIn var(--mer-timing--fast) ease-out forwards;\n}\n\n@keyframes fadeIn {\n 0% {\n opacity: 0;\n }\n 100% {\n opacity: 1;\n }\n}\n\n@include hiChar;\n","/* STENCIL IMPORTS */\nimport { Component, h, Prop, Element, State } from \"@stencil/core\";\n/* OTHER LIBRARIES IMPORTS */\nimport { getIconPath } from \"@genexus/mercury\";\n/* CUSTOM IMPORTS */\nimport { Locale } from \"../../common/locale\";\nimport { MessageType } from \"./ai-assistant\";\nimport { hiChar } from \"../../common/helpers\";\n\nconst COPY_ICON = getIconPath({\n category: \"bpm\",\n name: \"tasks\",\n colorType: \"neutral\"\n});\n@Component({\n tag: \"gx-ide-ai-message\",\n styleUrl: \"ai-message.scss\",\n shadow: false,\n assetsDirs: [\"gx-ide-assets/ai-message\"]\n})\nexport class GxIdeAiMessage {\n /*\nINDEX:\n1.OWN PROPERTIES \n2.REFERENCE TO ELEMENTS\n3.STATE() VARIABLES\n4.PUBLIC PROPERTY API | WATCH'S\n5.EVENTS (EMIT)\n6.COMPONENT LIFECYCLE METHODS\n7.LISTENERS\n8.PUBLIC METHODS API\n9.LOCAL METHODS\n10.RENDER() FUNCTION\n*/\n\n // 1.OWN PROPERTIES //\n\n /* The message allows to be copied*/\n private _componentLocale: any;\n private copyable = false;\n\n // 2. REFERENCE TO ELEMENTS //\n\n @Element() el: HTMLGxIdeAiMessageElement;\n\n // 3.STATE() VARIABLES //\n\n /**\n * This wil display the message if true\n */\n @State() visible = false;\n\n /**\n * This wil show the user a text, indicating that the message has been copied\n */\n @State() showCopiedMessage = false;\n\n // 4.PUBLIC PROPERTY API | WATCH'S //\n\n /**\n * The actual message\n */\n @Prop() readonly message: string;\n\n /**\n * The message type\n */\n @Prop() readonly messageType: MessageType;\n\n /**\n * The filter value\n */\n @Prop() readonly filterValue: string;\n\n /**\n * It hides the message (used for the filter)\n */\n @Prop() readonly hidden: boolean;\n\n /**\n * An object with the needed string translations.\n */\n @Prop() readonly translations: Translations;\n\n // 5.EVENTS (EMIT) //\n\n // 6.COMPONENT LIFECYCLE METHODS //\n\n async componentWillLoad() {\n this._componentLocale = await Locale.getComponentStrings(this.el);\n this.evaluateMessageIsCopyable();\n }\n\n componentDidRender() {\n setTimeout(() => {\n /* Without the timeout it appears instantly (no apparent transition)*/\n this.visible = true;\n const messagesList = this.el.parentElement;\n messagesList.scrollTo(0, 0);\n }, 0);\n }\n\n // 7.LISTENERS //\n\n // 8.PUBLIC METHODS API //\n\n // 9.LOCAL METHODS //\n\n private copyMessage = () => {\n const messageInfo = JSON.stringify(\n {\n messageType: this.messageType,\n message: this.message\n },\n null,\n 2\n );\n\n navigator.clipboard.writeText(messageInfo);\n this.showCopiedMessage = true;\n setTimeout(() => {\n this.showCopiedMessage = false;\n }, 1500);\n };\n\n private evaluateMessageIsCopyable = () => {\n this.copyable = this.messageType !== \"assistant-in-progress\";\n };\n\n private evaluateCopyIcon = () => {\n return this.copyable ? (\n <ch-image class=\"icon-md\" src={COPY_ICON}></ch-image>\n ) : null;\n };\n\n // 10.RENDER() FUNCTION //\n\n render() {\n return (\n <li\n class={{\n \"message\": true,\n \"message--visible\": this.visible && !this.hidden,\n [`message--${[this.messageType]}`]: true,\n \"message--assistant\": this.messageType !== \"user\",\n \"message--copyable\": this.copyable,\n \"message--copying\": this.showCopiedMessage\n }}\n onClick={this.copyable && this.copyMessage}\n >\n <div class=\"message__outer-wrapper\">\n <div\n class={{\n \"message__inner-wrapper\": true\n }}\n >\n {this.messageType === \"user\" ? (\n <div class=\"message__header\">\n <span class=\"message__role message__role--user\">\n {this._componentLocale.you}\n </span>\n {this.evaluateCopyIcon()}\n </div>\n ) : (\n <div class=\"message__header\">\n <span\n class={{\n \"message__role\":\n this.messageType !== \"assistant-in-progress\",\n \"message__role--hidden\":\n this.messageType === \"assistant-in-progress\",\n \"message__role--assistant\": true\n }}\n >\n {this._componentLocale.assistant}\n </span>\n {this.evaluateCopyIcon()}\n </div>\n )}\n <div\n class={{\n \"message__caption\": true,\n \"message__caption--in-progress\":\n this.messageType === \"assistant-in-progress\"\n }}\n >\n {this.showCopiedMessage ? (\n <span class=\"copied\">\n <ch-image class=\"icon-md\" src={COPY_ICON}></ch-image>\n {this.translations[\"copied\"]}\n </span>\n ) : null}\n {hiChar(this.message, this.filterValue)}\n </div>\n {this.messageType === \"assistant-in-progress\" ? (\n <div class=\"animation-wrapper\">\n <div class=\"dot-pulse\"></div>\n </div>\n ) : null}\n </div>\n </div>\n </li>\n );\n }\n}\n\nexport type Translations = {\n [key: string]: string;\n};\n"],"version":3}
1
+ {"file":"gx-ide-ai-message.entry.js","mappings":";;;;;AAAA,MAAM,YAAY,GAAG,grIAAgrI;;;;;;;;;;ACQrsI,MAAM,SAAS,GAAG,WAAW,CAAC;IAC5B,QAAQ,EAAE,KAAK;IACf,IAAI,EAAE,OAAO;IACb,SAAS,EAAE,SAAS;CACrB,CAAC,CAAC;MAQU,cAAc;;;QAGjB,aAAQ,GAAG,KAAK,CAAC;QA0DjB,gBAAW,GAAG;YACpB,MAAM,WAAW,GAAG,IAAI,CAAC,SAAS,CAChC;gBACE,WAAW,EAAE,IAAI,CAAC,WAAW;gBAC7B,OAAO,EAAE,IAAI,CAAC,OAAO;aACtB,EACD,IAAI,EACJ,CAAC,CACF,CAAC;YAEF,SAAS,CAAC,SAAS,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC;YAC3C,IAAI,CAAC,iBAAiB,GAAG,IAAI,CAAC;YAC9B,UAAU,CAAC;gBACT,IAAI,CAAC,iBAAiB,GAAG,KAAK,CAAC;aAChC,EAAE,IAAI,CAAC,CAAC;SACV,CAAC;QAEF,iDAA0B,CAAC,CAAa;YACtC,CAAC,CAAC,cAAc,EAAE,CAAC;YACnB,CAAC,CAAC,eAAe,EAAE,CAAC;SACrB,EAAC;QAEM,8BAAyB,GAAG;YAClC,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,WAAW,KAAK,uBAAuB,CAAC;SAC9D,CAAC;QAEM,qBAAgB,GAAG;YACzB,OAAO,IAAI,CAAC,QAAQ,IAClB,cACE,KAAK,EAAC,kCAAkC,gBAC7B,MAAM,EACjB,OAAO,EAAE,IAAI,CAAC,WAAW,EACzB,WAAW,EAAE,uBAAA,IAAI,8CAAwB,IAEzC,gBAAU,KAAK,EAAC,SAAS,EAAC,GAAG,EAAE,SAAS,GAAa,CAC9C,IACP,IAAI,CAAC;SACV,CAAC;uBAxFiB,KAAK;iCAKK,KAAK;;;;;;;;IAgClC,MAAM,iBAAiB;QACrB,IAAI,CAAC,gBAAgB,GAAG,MAAM,MAAM,CAAC,mBAAmB,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;QAClE,IAAI,CAAC,yBAAyB,EAAE,CAAC;KAClC;IAED,kBAAkB;QAChB,UAAU,CAAC;;YAET,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC;YACpB,MAAM,YAAY,GAAG,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC;YAC3C,YAAY,CAAC,QAAQ,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;SAC7B,EAAE,CAAC,CAAC,CAAC;KACP;IAyCD,MAAM;QACJ,QACE,UACE,KAAK,EAAE;gBACL,SAAS,EAAE,IAAI;gBACf,kBAAkB,EAAE,IAAI,CAAC,OAAO,IAAI,CAAC,IAAI,CAAC,MAAM;gBAChD,CAAC,YAAY,CAAC,IAAI,CAAC,WAAW,CAAC,EAAE,GAAG,IAAI;gBACxC,oBAAoB,EAAE,IAAI,CAAC,WAAW,KAAK,MAAM;gBACjD,mBAAmB,EAAE,IAAI,CAAC,QAAQ;gBAClC,kBAAkB,EAAE,IAAI,CAAC,iBAAiB;aAC3C,IAED,WAAK,KAAK,EAAC,wBAAwB,IACjC,WACE,KAAK,EAAE;gBACL,wBAAwB,EAAE,IAAI;aAC/B,IAEA,IAAI,CAAC,WAAW,KAAK,MAAM,IAC1B,WAAK,KAAK,EAAC,iBAAiB,IAC1B,YAAM,KAAK,EAAC,mCAAmC,IAC7C,YAAM,KAAK,EAAC,2BAA2B,IACpC,IAAI,CAAC,gBAAgB,CAAC,GAAG,CACrB,CACF,EACN,IAAI,CAAC,gBAAgB,EAAE,CACpB,KAEN,WACE,KAAK,EAAE;gBACL,iBAAiB,EAAE,IAAI;gBACvB,8BAA8B,EAC5B,IAAI,CAAC,WAAW,KAAK,uBAAuB;aAC/C,IAED,YACE,KAAK,EAAE;gBACL,eAAe,EACb,IAAI,CAAC,WAAW,KAAK,uBAAuB;gBAC9C,uBAAuB,EACrB,IAAI,CAAC,WAAW,KAAK,uBAAuB;gBAC9C,0BAA0B,EAAE,IAAI;aACjC,IAED,YAAM,KAAK,EAAC,2BAA2B,IACpC,IAAI,CAAC,gBAAgB,CAAC,SAAS,CAC3B,CACF,EACN,IAAI,CAAC,gBAAgB,EAAE,CACpB,CACP,EACD,WACE,KAAK,EAAE;gBACL,kBAAkB,EAAE,IAAI;gBACxB,+BAA+B,EAC7B,IAAI,CAAC,WAAW,KAAK,uBAAuB;aAC/C,IAEA,IAAI,CAAC,iBAAiB,IACrB,YAAM,KAAK,EAAC,QAAQ,IAClB,gBAAU,KAAK,EAAC,SAAS,EAAC,GAAG,EAAE,SAAS,GAAa,EACpD,IAAI,CAAC,YAAY,CAAC,QAAQ,CAAC,CACvB,IACL,IAAI,EACP,MAAM,CAAC,IAAI,CAAC,OAAO,EAAE,IAAI,CAAC,WAAW,CAAC,CACnC,EACL,IAAI,CAAC,WAAW,KAAK,uBAAuB,IAC3C,WAAK,KAAK,EAAC,mBAAmB,IAC5B,WAAK,KAAK,EAAC,WAAW,GAAO,CACzB,IACJ,IAAI,CACJ,CACF,CACH,EACL;KACH;;;;;;;;;","names":[],"sources":["src/components/ai-assistant/ai-message.scss?tag=gx-ide-ai-message","src/components/ai-assistant/ai-message.tsx"],"sourcesContent":["@import \"../../global/gx-ide-mixins.scss\";\n\n:host {\n font-family: var(--mer-font-family--primary);\n}\n/*--- Messages ---*/\n.message {\n color: var(--mer-color__neutral-gray--100);\n display: grid;\n grid-template-rows: 0fr;\n transition: grid-template-rows 100ms;\n transition: grid-template-rows 100ms, -ms-grid-rows 100ms;\n &__outer-wrapper {\n overflow: hidden;\n }\n &__inner-wrapper {\n padding: var(--mer-spacing--sm) var(--mer-spacing--sm);\n border-radius: var(--mer-border__radius--sm);\n border-inline-start: var(--mer-border__width--md) solid transparent;\n background-color: var(--mer-color__neutral-gray--1200);\n margin-block-start: var(--mer-spacing--xs);\n position: relative;\n }\n &__header {\n display: flex;\n gap: var(--mer-spacing--xs);\n justify-content: space-between;\n\n .icon-md {\n opacity: 0;\n }\n\n &--in-progress {\n display: contents;\n }\n }\n &__role {\n &:before {\n content: \"\";\n display: grid;\n place-self: center flex-end;\n inline-size: 4px;\n block-size: 4px;\n border-radius: 50%;\n background-color: currentcolor;\n }\n\n font-weight: var(--mer-font__weight--semi-bold);\n margin-block-end: var(--mer-spacing--xs);\n display: inline-grid;\n grid-template-columns: max-content 1fr;\n gap: 8px;\n\n &-description {\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n display: inline-block;\n padding-block-start: 2px;\n }\n &--user {\n color: var(--mer-color__primary--300);\n }\n &--assistant {\n }\n &--hidden {\n display: none;\n }\n }\n &__caption {\n font-size: var(--mer-font__size--xs);\n line-height: var(--mer-line-height--regular);\n }\n &--visible {\n grid-template-rows: 1fr;\n }\n &--copying {\n pointer-events: none;\n span:not(.copied),\n .message__caption {\n color: transparent;\n -webkit-user-select: none; /* Safari */\n -ms-user-select: none; /* IE 10 and IE 11 */\n user-select: none; /* Standard syntax */\n }\n }\n /*--- Types of messages ---*/\n &--user {\n .message__inner-wrapper {\n background-color: rgba(91, 167, 255, 0.08);\n border-color: var(--mer-border-color__primary);\n }\n }\n &--assistant-action {\n .message__inner-wrapper {\n background-color: rgba(63, 168, 155, 0.05);\n border-color: var(--mer-border-color__success);\n }\n }\n &--assistant-chat {\n .message__inner-wrapper {\n background-color: var(--mer-surface__elevation--01);\n }\n }\n &--assistant-in-progress {\n color: var(--mer-color__neutral-gray--500);\n .message__inner-wrapper {\n font-style: italic;\n display: grid;\n grid-template-columns: 1fr auto;\n gap: var(--mer-spacing--xs);\n\n .message__caption {\n flex: 1;\n }\n .animation-wrapper {\n flex: none;\n }\n }\n }\n &--assistant-error {\n .message__inner-wrapper {\n background-color: rgba(251, 124, 132, 0.05);\n border-color: var(--mer-border-color__error);\n }\n }\n &--copyable {\n &:hover {\n filter: brightness(1.2);\n .icon-md {\n opacity: 1;\n }\n }\n }\n &:last-child {\n margin-block-end: 0;\n }\n}\n:host(:first-child) {\n .message {\n &__inner-wrapper {\n margin-block-end: 0;\n }\n }\n}\n\n/*--- Dot Pulse Sweet Animation ---*/\n.animation-wrapper {\n width: 45px;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n$color: var(--mer-color__neutral-gray--400);\n.dot-pulse {\n position: relative;\n left: -9999px;\n width: 5px;\n height: 5px;\n border-radius: 2.5px;\n background-color: $color;\n color: $color;\n box-shadow: 9999px 0 0 -5px;\n animation: dot-pulse 1.5s infinite linear;\n animation-delay: 0.25s;\n &::before,\n &::after {\n content: \"\";\n display: inline-block;\n position: absolute;\n top: 0;\n width: 5px;\n height: 5px;\n border-radius: 2.5px;\n background-color: $color;\n color: $color;\n }\n &::before {\n box-shadow: 9984px 0 0 -5px;\n animation: dot-pulse-before 1.5s infinite linear;\n animation-delay: 0s;\n }\n &::after {\n box-shadow: 10014px 0 0 -5px;\n animation: dot-pulse-after 1.5s infinite linear;\n animation-delay: 0.5s;\n }\n}\n@keyframes dot-pulse-before {\n 0% {\n box-shadow: 9984px 0 0 -5px;\n }\n 30% {\n box-shadow: 9984px 0 0 2px;\n }\n 60%,\n 100% {\n box-shadow: 9984px 0 0 -5px;\n }\n}\n@keyframes dot-pulse {\n 0% {\n box-shadow: 9999px 0 0 -5px;\n }\n 30% {\n box-shadow: 9999px 0 0 2px;\n }\n 60%,\n 100% {\n box-shadow: 9999px 0 0 -5px;\n }\n}\n@keyframes dot-pulse-after {\n 0% {\n box-shadow: 10014px 0 0 -5px;\n }\n 30% {\n box-shadow: 10014px 0 0 2px;\n }\n 60%,\n 100% {\n box-shadow: 10014px 0 0 -5px;\n }\n}\n\n/*--- Copy Message ---*/\n.copied {\n position: absolute;\n width: 100%;\n height: 100%;\n top: 0;\n left: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n color: var(--mer-color__neutral-gray--300);\n display: flex;\n gap: var(--mer-spacing--xs);\n opacity: 0;\n animation: fadeIn var(--mer-timing--regular) ease-out forwards;\n}\n\n@keyframes fadeIn {\n 0% {\n opacity: 0;\n }\n 100% {\n opacity: 1;\n }\n}\n\n@include hiChar;\n","import { Component, h, Prop, Element, State } from \"@stencil/core\";\n\nimport { getIconPath } from \"@genexus/mercury\";\n\nimport { Locale } from \"../../common/locale\";\nimport { MessageType } from \"./ai-assistant\";\nimport { hiChar } from \"../../common/helpers\";\n\nconst COPY_ICON = getIconPath({\n category: \"bpm\",\n name: \"tasks\",\n colorType: \"neutral\"\n});\n\n@Component({\n tag: \"gx-ide-ai-message\",\n styleUrl: \"ai-message.scss\",\n shadow: false,\n assetsDirs: [\"gx-ide-assets/ai-message\"]\n})\nexport class GxIdeAiMessage {\n /* The message allows to be copied*/\n private _componentLocale: any;\n private copyable = false;\n\n @Element() el: HTMLGxIdeAiMessageElement;\n\n /**\n * This wil display the message if true\n */\n @State() visible = false;\n\n /**\n * This wil show the user a text, indicating that the message has been copied\n */\n @State() showCopiedMessage = false;\n\n /**\n * A reference to the gx-ide-ai-assistant host element\n */\n @Prop() readonly aiAssistantHostRef: HTMLGxIdeAiAssistantElement;\n\n /**\n * The actual message\n */\n @Prop() readonly message: string;\n\n /**\n * The message type\n */\n @Prop() readonly messageType: MessageType;\n\n /**\n * The filter value\n */\n @Prop() readonly filterValue: string;\n\n /**\n * It hides the message (used for the filter)\n */\n @Prop() readonly hidden: boolean;\n\n /**\n * An object with the needed string translations.\n */\n @Prop() readonly translations: Translations;\n\n async componentWillLoad() {\n this._componentLocale = await Locale.getComponentStrings(this.el);\n this.evaluateMessageIsCopyable();\n }\n\n componentDidRender() {\n setTimeout(() => {\n /* Without the timeout it appears instantly (no apparent transition)*/\n this.visible = true;\n const messagesList = this.el.parentElement;\n messagesList.scrollTo(0, 0);\n }, 0);\n }\n\n private copyMessage = () => {\n const messageInfo = JSON.stringify(\n {\n messageType: this.messageType,\n message: this.message\n },\n null,\n 2\n );\n\n navigator.clipboard.writeText(messageInfo);\n this.showCopiedMessage = true;\n setTimeout(() => {\n this.showCopiedMessage = false;\n }, 1500);\n };\n\n #buttonMouseDownHandler = (e: MouseEvent) => {\n e.preventDefault();\n e.stopPropagation();\n };\n\n private evaluateMessageIsCopyable = () => {\n this.copyable = this.messageType !== \"assistant-in-progress\";\n };\n\n private evaluateCopyIcon = () => {\n return this.copyable ? (\n <button\n class=\"button-tertiary button-icon-only\"\n aria-label=\"copy\"\n onClick={this.copyMessage}\n onMouseDown={this.#buttonMouseDownHandler}\n >\n <ch-image class=\"icon-md\" src={COPY_ICON}></ch-image>\n </button>\n ) : null;\n };\n\n render() {\n return (\n <li\n class={{\n \"message\": true,\n \"message--visible\": this.visible && !this.hidden,\n [`message--${[this.messageType]}`]: true,\n \"message--assistant\": this.messageType !== \"user\",\n \"message--copyable\": this.copyable,\n \"message--copying\": this.showCopiedMessage\n }}\n >\n <div class=\"message__outer-wrapper\">\n <div\n class={{\n \"message__inner-wrapper\": true\n }}\n >\n {this.messageType === \"user\" ? (\n <div class=\"message__header\">\n <span class=\"message__role message__role--user\">\n <span class=\"message__role-description\">\n {this._componentLocale.you}\n </span>\n </span>\n {this.evaluateCopyIcon()}\n </div>\n ) : (\n <div\n class={{\n \"message__header\": true,\n \"message__header--in-progress\":\n this.messageType === \"assistant-in-progress\"\n }}\n >\n <span\n class={{\n \"message__role\":\n this.messageType !== \"assistant-in-progress\",\n \"message__role--hidden\":\n this.messageType === \"assistant-in-progress\",\n \"message__role--assistant\": true\n }}\n >\n <span class=\"message__role-description\">\n {this._componentLocale.assistant}\n </span>\n </span>\n {this.evaluateCopyIcon()}\n </div>\n )}\n <div\n class={{\n \"message__caption\": true,\n \"message__caption--in-progress\":\n this.messageType === \"assistant-in-progress\"\n }}\n >\n {this.showCopiedMessage ? (\n <span class=\"copied\">\n <ch-image class=\"icon-md\" src={COPY_ICON}></ch-image>\n {this.translations[\"copied\"]}\n </span>\n ) : null}\n {hiChar(this.message, this.filterValue)}\n </div>\n {this.messageType === \"assistant-in-progress\" ? (\n <div class=\"animation-wrapper\">\n <div class=\"dot-pulse\"></div>\n </div>\n ) : null}\n </div>\n </div>\n </li>\n );\n }\n}\n\nexport type Translations = {\n [key: string]: string;\n};\n"],"version":3}
package/dist/esm/gx-ide-current-user-info.entry.js CHANGED
@@ -2,8 +2,22 @@ import { r as registerInstance, h, H as Host, g as getElement } from './index-93
2
2
  import { g as getIconPath } from './MERCURY_ASSETS-7a7c1795.js';
3
3
  import { L as Locale } from './locale-e5107fad.js';
4
4
 
5
+ /**
6
+ * Returns initials from the first two words of a name. Returns "X" for invalid input.
7
+ *
8
+ * @param name - The full name string.
9
+ * @returns Initials of the first two words, or "X" if invalid.
10
+ *
11
+ * Example:
12
+ * getInitialsFromName("John Doe") -> "JD"
13
+ * getInitialsFromName("Jane") -> "J"
14
+ * getInitialsFromName("") -> "X"
15
+ */
5
16
  const getInitialsFromName = (name) => {
6
- const nameData = name.split(" ");
17
+ if (typeof name !== "string" || name.trim() === "") {
18
+ return "X";
19
+ }
20
+ const nameData = name.split(" ").filter(Boolean); // Remove any empty strings from splitting
7
21
  if (nameData.length === 1) {
8
22
  return nameData[0][0].toUpperCase();
9
23
  }
@@ -11,8 +25,31 @@ const getInitialsFromName = (name) => {
11
25
  return `${nameData[0][0].toUpperCase()}${nameData[1][0].toUpperCase()}`;
12
26
  }
13
27
  };
28
+ /**
29
+ * Limits the full name to the first two words. Returns null for invalid input.
30
+ *
31
+ * @param fullName - The full name string to be limited.
32
+ * @returns The first two words of the full name, or null if invalid.
33
+ *
34
+ * Example:
35
+ * limitFullName("John Doe Smith") -> "John Doe"
36
+ * limitFullName("Jane") -> "Jane"
37
+ * limitFullName("") -> null
38
+ */
39
+ const limitFullName = (fullName) => {
40
+ if (typeof fullName !== "string" || fullName.trim() === "") {
41
+ return null;
42
+ }
43
+ const fullNameData = fullName.split(" ").filter(Boolean); // Remove any empty strings from splitting
44
+ if (fullNameData.length === 1) {
45
+ return fullNameData[0];
46
+ }
47
+ else {
48
+ return `${fullNameData[0]} ${fullNameData[1]}`;
49
+ }
50
+ };
14
51
 
15
- const currentUserInfoCss = "@keyframes spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}:host{display:inline-grid;justify-items:end;block-size:100%}.user-login__button{all:unset;display:grid;grid-template-columns:max-content max-content max-content;align-items:center;gap:var(--mer-spacing--sm);block-size:auto;cursor:pointer}.user-login__details{display:grid;grid-template-rows:max-content max-content;gap:var(--mer-spacing--3xs);justify-items:end}.user-login__name{font-weight:var(--mer-font__weight--medium);font-size:var(--mer-font__size--3xs);color:var(--mer-text__on-elevation)}.user-login__organization{font-weight:var(--mer-font__weight--light);font-size:var(--mer-font__size--4xs);color:var(--mer-text__neutral)}.user-login__avatar{font-size:9px;flex:0 0 auto;display:flex;align-items:center;justify-content:center;block-size:var(--mer-spacing--lg);inline-size:var(--mer-spacing--lg);color:var(--mer-text__on-elevation);border-radius:50%;background-color:var(--mer-color__tinted-primary--10);border:var(--mer-border__width--sm) solid var(--mer-color__primary--200)}.privacy-policy{text-decoration:underline;cursor:pointer}";
52
+ const currentUserInfoCss = "@keyframes spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}:host{display:inline-grid;justify-items:end;block-size:100%}.user-login__button{all:unset;display:grid;grid-template-columns:max-content max-content max-content;align-items:center;gap:var(--mer-spacing--sm);block-size:auto;cursor:pointer}.user-login__details{display:grid;grid-template-rows:max-content max-content;gap:var(--mer-spacing--3xs);justify-items:end}.user-login__name{font-weight:var(--mer-font__weight--medium);font-size:var(--mer-font__size--3xs);color:var(--mer-text__on-elevation)}.user-login__organization{font-weight:var(--mer-font__weight--light);font-size:var(--mer-font__size--4xs);color:var(--mer-text__neutral)}.user-login__name,.user-login__organization{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-inline-size:120px;display:inline-block}.user-login__avatar{font-size:9px;flex:0 0 auto;display:flex;align-items:center;justify-content:center;block-size:var(--mer-spacing--lg);inline-size:var(--mer-spacing--lg);color:var(--mer-text__on-elevation);border-radius:50%;background-color:var(--mer-color__tinted-primary--10);border:var(--mer-border__width--sm) solid var(--mer-color__primary--200)}.privacy-policy{text-decoration:underline;cursor:pointer}";
16
53
 
17
54
  var __classPrivateFieldSet = (undefined && undefined.__classPrivateFieldSet) || function (receiver, state, value, kind, f) {
18
55
  if (kind === "m")
@@ -116,7 +153,9 @@ const GxIdeNewEnvironment = class {
116
153
  ], "f");
117
154
  }
118
155
  render() {
119
- return (h(Host, { class: "widget" }, h("ch-theme", { model: CSS_BUNDLES }), h("ch-dropdown-render", { class: "dropdown", model: __classPrivateFieldGet(this, _GxIdeNewEnvironment_menuDropdownModel, "f"), position: "InsideEnd_OutsideEnd", itemClickCallback: __classPrivateFieldGet(this, _GxIdeNewEnvironment_dropDownitemClickHandler, "f") }, h("button", { class: "user-login__button", ref: el => (__classPrivateFieldSet(this, _GxIdeNewEnvironment_userLoginButton, el, "f")), slot: "action" }, h("div", { class: "user-login__details" }, h("span", { class: "user-login__name" }, this.userInfo.name), h("span", { class: "user-login__organization" }, this.userInfo.team)), h("div", { class: "user-login__avatar" }, __classPrivateFieldGet(this, _GxIdeNewEnvironment_initials, "f")), h("ch-image", { src: CHEVRON_DOWN_ICON, class: "icon-md", containerRef: __classPrivateFieldGet(this, _GxIdeNewEnvironment_userLoginButton, "f") })), h("div", { class: "user-login__footer footer-slot", slot: "footer" }, h("p", { class: "text-body-regular-s privacy-policy", onClick: this.showTermsCallback }, __classPrivateFieldGet(this, _GxIdeNewEnvironment_componentLocale, "f").privacyAndTerms)))));
156
+ var _a, _b;
157
+ const userName = limitFullName((_a = this.userInfo) === null || _a === void 0 ? void 0 : _a.name);
158
+ return (h(Host, { class: "widget" }, h("ch-theme", { model: CSS_BUNDLES }), h("ch-dropdown-render", { class: "dropdown", model: __classPrivateFieldGet(this, _GxIdeNewEnvironment_menuDropdownModel, "f"), position: "InsideEnd_OutsideEnd", itemClickCallback: __classPrivateFieldGet(this, _GxIdeNewEnvironment_dropDownitemClickHandler, "f") }, h("button", { class: "user-login__button", ref: el => (__classPrivateFieldSet(this, _GxIdeNewEnvironment_userLoginButton, el, "f")), slot: "action" }, h("div", { class: "user-login__details" }, userName ? (h("span", { class: "user-login__name" }, userName)) : null, ((_b = this.userInfo) === null || _b === void 0 ? void 0 : _b.team) ? (h("span", { class: "user-login__organization" }, this.userInfo.team)) : null), h("div", { class: "user-login__avatar" }, __classPrivateFieldGet(this, _GxIdeNewEnvironment_initials, "f")), h("ch-image", { src: CHEVRON_DOWN_ICON, class: "icon-md", containerRef: __classPrivateFieldGet(this, _GxIdeNewEnvironment_userLoginButton, "f") })), h("div", { class: "user-login__footer footer-slot", slot: "footer" }, h("p", { class: "text-body-regular-s privacy-policy", onClick: this.showTermsCallback }, __classPrivateFieldGet(this, _GxIdeNewEnvironment_componentLocale, "f").privacyAndTerms)))));
120
159
  }
121
160
  static get assetsDirs() { return ["gx-ide-assets/current-user-info"]; }
122
161
  get el() { return getElement(this); }