@genexus/genexus-ide-ui 1.1.4 → 1.1.6

package/dist/collection/common/common.js

@@ -95,11 +95,24 @@ export const getSelectedItem2 = (gxOptions) => {
         : undefined;
 };
 // Dots animation used in ch-chat code-render (or other components)
-export const ANIMATION_DOTS = (size = "regular", color = "primary") => {
-    const n = size === "regular" ? 1 : 4;
-    const colorVar = color === "primary"
-        ? "var(--mer-color__primary--200)"
-        : "var(--mer-text__on-surface)";
-    return (h("svg", { width: 36 / n, height: 8 / n, fill: "transparent" }, h("circle", { cx: 4 / n, cy: 4 / n, r: 4 / n, opacity: "0", fill: colorVar }, h("animate", { attributeName: "opacity", values: "0;1;0", dur: "1s", repeatCount: "indefinite" })), h("circle", { cx: 18 / n, cy: 4 / n, r: 4 / n, opacity: "0", fill: colorVar }, h("animate", { attributeName: "opacity", values: "0;1;0", dur: "1s", begin: "0.15s", repeatCount: "indefinite" })), h("circle", { cx: 32 / n, cy: 4 / n, r: 4 / n, opacity: "0", fill: colorVar }, h("animate", { attributeName: "opacity", values: "0;1;0", dur: "1s", begin: "0.30s", repeatCount: "indefinite" }))));
+export const ANIMATION_DOTS = (size = "regular", color = "primary", sizeType = "dynamic", duration = "1s") => {
+    const n = size === "regular" ? 1.5 : 4;
+    let colorDot1, colorDot2, colorDot3;
+    if (color === "nexa") {
+        colorDot1 = "#5ba7ff";
+        colorDot2 = "#00CCFF";
+        colorDot3 = "#CF7AFF";
+    }
+    else if (color === "on-surface") {
+        colorDot1 = colorDot2 = colorDot3 = "var(--mer-text__on-surface)";
+    }
+    else {
+        // primary
+        colorDot1 = colorDot2 = colorDot3 = "var(--mer-color__primary--200)";
+    }
+    const animateRadiusSize = (begin = "0") => {
+        return (h("animate", { attributeName: "r", values: `${2 / n};${4 / n};${2 / n}`, dur: duration, begin: begin, repeatCount: "indefinite" }));
+    };
+    return (h("svg", { width: 36 / n, height: 8 / n, fill: "transparent" }, h("circle", { cx: 4 / n, cy: 4 / n, r: 4 / n, opacity: "0", fill: colorDot1 }, h("animate", { attributeName: "opacity", values: "0;1;0", dur: duration, repeatCount: "indefinite" }), sizeType === "dynamic" ? animateRadiusSize("0") : null), h("circle", { cx: 18 / n, cy: 4 / n, r: 4 / n, opacity: "0", fill: colorDot2 }, h("animate", { attributeName: "opacity", values: "0;1;0", dur: duration, begin: "0.15s", repeatCount: "indefinite" }), sizeType === "dynamic" ? animateRadiusSize("0.33s") : null), h("circle", { cx: 32 / n, cy: 4 / n, r: 4 / n, opacity: "0", fill: colorDot3 }, h("animate", { attributeName: "opacity", values: "0;1;0", dur: duration, begin: "0.30s", repeatCount: "indefinite" }), sizeType === "dynamic" ? animateRadiusSize("0.66s") : null)));
 };
 //# sourceMappingURL=common.js.map

package/dist/collection/common/common.js.map

@@ -1 +1 @@
-{"version":3,"file":"common.js","sourceRoot":"","sources":["../../src/common/common.tsx"],"names":[],"mappings":"AAAA,qBAAqB;AACrB,OAAO,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAKlC,MAAM,CAAC,MAAM,eAAe,GAAG,CAC7B,gBAGuB,oBAAoB,EAC3C,OAAwB,EACxB,KAAK,GAAG,iBAAiB,EACzB,QAAc,EACK,EAAE;IACrB,IAAI,OAAO,CAAC,MAAM,EAAE;QAClB,MAAM,KAAK,GAAsB,EAAE,CAAC;QACpC,OAAO,CAAC,OAAO,CAAC,MAAM,CAAC,EAAE;YACvB,IAAI,IAAI,CAAC;YACT,QAAQ,aAAa,EAAE;gBACrB,KAAK,mBAAmB;oBACtB,IAAI,GAAG,CACL,yBACE,UAAU,EAAE,MAAM,CAAC,EAAE,EACrB,OAAO,EAAE,MAAM,CAAC,OAAO,EACvB,QAAQ,EAAE,MAAM,CAAC,QAAQ,EACzB,KAAK,EAAE,MAAM,CAAC,KAAK,EACnB,KAAK,EAAE,MAAM,CAAC,KAAK,EACnB,QAAQ,EAAE,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,IAAI,EACpC,QAAQ,EAAE,MAAM,CAAC,QAAQ,EACzB,IAAI,EAAE,GAAG,KAAK,IAAI,MAAM,CAAC,EAAE,EAAE,GACV,CACtB,CAAC;oBACF,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;oBACjB,MAAM;gBACR,KAAK,oBAAoB;oBACvB,IAAI,GAAG,CACL,0BACE,KAAK,EAAE,MAAM,CAAC,EAAE,EAChB,IAAI,EAAE,MAAM,CAAC,QAAQ,EACrB,IAAI,EAAE,GAAG,KAAK,IAAI,MAAM,CAAC,EAAE,EAAE,IAE5B,MAAM,CAAC,KAAK,CACM,CACtB,CAAC;oBACF,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;oBACjB,MAAM;gBACR,KAAK,gBAAgB;oBACnB,IAAI,GAAG,CACL,sBACE,OAAO,EAAE,MAAM,CAAC,EAAE,EAClB,OAAO,EAAE,MAAM,CAAC,OAAO,EACvB,QAAQ,EAAE,MAAM,CAAC,QAAQ,EACzB,KAAK,EAAE,MAAM,CAAC,KAAK,EACnB,KAAK,EAAE,MAAM,CAAC,KAAK,EACnB,IAAI,EAAE,KAAK,EACX,IAAI,EAAE,GAAG,KAAK,IAAI,MAAM,CAAC,EAAE,EAAE,GACb,CACnB,CAAC;oBACF,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;oBACjB,MAAM;gBACR;oBACE,MAAM;aACT;QACH,CAAC,CAAC,CAAC;QACH,OAAO,KAAK,CAAC;KACd;IACD,OAAO,IAAI,CAAC;AACd,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,0BAA0B,GAAG,CACxC,OAAkC,EACZ,EAAE;IACxB,IAAI,OAAO,CAAC,MAAM,EAAE;QAClB,MAAM,KAAK,GAAyB,EAAE,CAAC;QAEvC,OAAO,CAAC,OAAO,CAAC,MAAM,CAAC,EAAE;YACvB,IAAI,KAAK,CAAC,OAAO,CAAC,MAAM,CAAC,KAAK,CAAC,EAAE;gBAC/B,MAAM,IAAI,GAAG,CACX,WAAK,KAAK,EAAC,mBAAmB;oBAC5B,SAAG,KAAK,EAAC,kBAAkB;wBAAE,MAAM,CAAC,IAAI;6BAAO;oBAC/C,cACG,MAAM,CAAC,KAAK,CAAC,GAAG,CAAC,OAAO,CAAC,EAAE;wBAC1B,OAAO,cAAK,OAAO,CAAM,CAAC;oBAC5B,CAAC,CAAC,CACC,CACD,CACP,CAAC;gBACF,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;aAClB;iBAAM;gBACL,MAAM,IAAI,GAAG,CACX,WACE,KAAK,EACH,MAAM,CAAC,MAAM;wBACX,CAAC,CAAC,iCAAiC;wBACnC,CAAC,CAAC,oBAAoB;oBAG1B,SAAG,KAAK,EAAC,kBAAkB;wBAAE,MAAM,CAAC,IAAI;6BAAO;oBAC/C,SAAG,KAAK,EAAC,oBAAoB,IAAE,MAAM,CAAC,KAAK,CAAK,CAC5C,CACP,CAAC;gBACF,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;aAClB;QACH,CAAC,CAAC,CAAC;QAEH,OAAO,KAAK,CAAC;KACd;IACD,OAAO,IAAI,CAAC;AACd,CAAC,CAAC;AAEF;;;GAGG;AACH,MAAM,CAAC,MAAM,mBAAmB,GAAG,CACjC,SAAqB,EACrB,MAAM,GAAG,IAAI,EACa,EAAE;IAC5B,IAAI,CAAA,SAAS,aAAT,SAAS,uBAAT,SAAS,CAAE,MAAM,IAAG,CAAC,EAAE;QACzB,IAAI,KAAK,GAAG,IAAI,CAAC;QACjB,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,SAAS,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;YACzC,IAAI,SAAS,CAAC,CAAC,CAAC,CAAC,QAAQ,EAAE;gBACzB,KAAK,GAAG,SAAS,CAAC,CAAC,CAAC,CAAC;gBACrB,MAAM;aACP;SACF;QACD,IAAI,KAAK,IAAI,MAAM,EAAE;YACnB,OAAO,KAAK,CAAC,EAAE,CAAC;SACjB;aAAM,IAAI,CAAC,KAAK,IAAI,MAAM,EAAE;YAC3B,OAAO,SAAS,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC;SACxB;QACD,OAAO,KAAK,CAAC;KACd;AACH,CAAC,CAAC;AAEF;;;GAGG;AACH,MAAM,CAAC,MAAM,eAAe,GAAG,CAAC,SAAqB,EAAU,EAAE;IAC/D,IAAI,KAAK,GAAG,SAAS,CAAC;IACtB,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,SAAS,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;QACzC,IAAI,SAAS,CAAC,CAAC,CAAC,CAAC,QAAQ,EAAE;YACzB,KAAK,GAAG,SAAS,CAAC,CAAC,CAAC,CAAC;YACrB,MAAM;SACP;KACF;IACD,IAAI,KAAK,EAAE;QACT,OAAO,KAAK,CAAC,EAAE,CAAC;KACjB;SAAM;QACL,OAAO,SAAS,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC;KACxB;AACH,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAC9B,SAAiC,EACb,EAAE;;IACtB,OAAA,SAAS;QACP,CAAC,CAAC,CAAC,MAAA,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,QAAQ,CAAC,mCAAI,SAAS,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE;QAC5D,CAAC,CAAC,SAAS,CAAA;CAAA,CAAC;AAEhB,mEAAmE;AACnE,MAAM,CAAC,MAAM,cAAc,GAAG,CAC5B,OAA2B,SAAS,EACpC,QAAkC,SAAS,EAC/B,EAAE;IACd,MAAM,CAAC,GAAG,IAAI,KAAK,SAAS,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;IACrC,MAAM,QAAQ,GACZ,KAAK,KAAK,SAAS;QACjB,CAAC,CAAC,gCAAgC;QAClC,CAAC,CAAC,6BAA6B,CAAC;IAEpC,OAAO,CACL,WAAK,KAAK,EAAE,EAAE,GAAG,CAAC,EAAE,MAAM,EAAE,CAAC,GAAG,CAAC,EAAE,IAAI,EAAC,aAAa;QACnD,cAAQ,EAAE,EAAE,CAAC,GAAG,CAAC,EAAE,EAAE,EAAE,CAAC,GAAG,CAAC,EAAE,CAAC,EAAE,CAAC,GAAG,CAAC,EAAE,OAAO,EAAC,GAAG,EAAC,IAAI,EAAE,QAAQ;YAChE,eACE,aAAa,EAAC,SAAS,EACvB,MAAM,EAAC,OAAO,EACd,GAAG,EAAC,IAAI,EACR,WAAW,EAAC,YAAY,GACxB,CACK;QACT,cAAQ,EAAE,EAAE,EAAE,GAAG,CAAC,EAAE,EAAE,EAAE,CAAC,GAAG,CAAC,EAAE,CAAC,EAAE,CAAC,GAAG,CAAC,EAAE,OAAO,EAAC,GAAG,EAAC,IAAI,EAAE,QAAQ;YACjE,eACE,aAAa,EAAC,SAAS,EACvB,MAAM,EAAC,OAAO,EACd,GAAG,EAAC,IAAI,EACR,KAAK,EAAC,OAAO,EACb,WAAW,EAAC,YAAY,GACxB,CACK;QACT,cAAQ,EAAE,EAAE,EAAE,GAAG,CAAC,EAAE,EAAE,EAAE,CAAC,GAAG,CAAC,EAAE,CAAC,EAAE,CAAC,GAAG,CAAC,EAAE,OAAO,EAAC,GAAG,EAAC,IAAI,EAAE,QAAQ;YACjE,eACE,aAAa,EAAC,SAAS,EACvB,MAAM,EAAC,OAAO,EACd,GAAG,EAAC,IAAI,EACR,KAAK,EAAC,OAAO,EACb,WAAW,EAAC,YAAY,GACxB,CACK,CACL,CACP,CAAC;AACJ,CAAC,CAAC","sourcesContent":["/* STENCIL IMPORTS */\nimport { h } from \"@stencil/core\";\n/* OTHER LIBRARIES IMPORTS */\n/* CUSTOM IMPORTS */\nimport { GxgFormItemsArray, GxOption } from \"./types\";\nimport { ModulePropertyData } from \"../components/modules/types\";\nexport const renderFormItems = (\n  componentType:\n    | \"gxg-combo-box-item\"\n    | \"gxg-form-checkbox\"\n    | \"gxg-form-radio\" = \"gxg-combo-box-item\",\n  options: Array<GxOption>,\n  group = \"undefined-group\",\n  callback?: any\n): GxgFormItemsArray => {\n  if (options.length) {\n    const items: GxgFormItemsArray = [];\n    options.forEach(option => {\n      let item;\n      switch (componentType) {\n        case \"gxg-form-checkbox\":\n          item = (\n            <gxg-form-checkbox\n              checkboxId={option.id}\n              checked={option.checked}\n              disabled={option.disabled}\n              label={option.label}\n              value={option.value}\n              onChange={callback ? callback : null}\n              iconName={option.iconName}\n              part={`${group}-${option.id}`}\n            ></gxg-form-checkbox>\n          );\n          items.push(item);\n          break;\n        case \"gxg-combo-box-item\":\n          item = (\n            <gxg-combo-box-item\n              value={option.id}\n              icon={option.iconName}\n              part={`${group}-${option.id}`}\n            >\n              {option.label}\n            </gxg-combo-box-item>\n          );\n          items.push(item);\n          break;\n        case \"gxg-form-radio\":\n          item = (\n            <gxg-form-radio\n              radioId={option.id}\n              checked={option.checked}\n              disabled={option.disabled}\n              label={option.label}\n              value={option.value}\n              name={group}\n              part={`${group}-${option.id}`}\n            ></gxg-form-radio>\n          );\n          items.push(item);\n          break;\n        default:\n          break;\n      }\n    });\n    return items;\n  }\n  return null;\n};\n\nexport const renderModuleDataProperties = (\n  options: Array<ModulePropertyData>\n): ModulePropertyData[] => {\n  if (options.length) {\n    const items: ModulePropertyData[] = [];\n\n    options.forEach(option => {\n      if (Array.isArray(option.value)) {\n        const item = (\n          <div class=\"md-property__list\">\n            <p class=\"md-property__key\">{option.name} :</p>\n            <ul>\n              {option.value.map(subItem => {\n                return <li>{subItem}</li>;\n              })}\n            </ul>\n          </div>\n        );\n        items.push(item);\n      } else {\n        const item = (\n          <div\n            class={\n              option.inline\n                ? \"md-property md-property--inline\"\n                : \"md-property--block\"\n            }\n          >\n            <p class=\"md-property__key\">{option.name} :</p>\n            <p class=\"md-property__value\">{option.value}</p>\n          </div>\n        );\n        items.push(item);\n      }\n    });\n\n    return items;\n  }\n  return null;\n};\n\n/**\n * @param gxOptions An array of GxOptions's\n * @returns The first option in the array that is 'selected'. If no one found it returns null.\n */\nexport const getSelectedGxOption = (\n  gxOptions: GxOption[],\n  onlyId = true\n): GxOption | string | void => {\n  if (gxOptions?.length > 0) {\n    let found = null;\n    for (let i = 0; i < gxOptions.length; i++) {\n      if (gxOptions[i].selected) {\n        found = gxOptions[i];\n        break;\n      }\n    }\n    if (found && onlyId) {\n      return found.id;\n    } else if (!found && onlyId) {\n      return gxOptions[0].id;\n    }\n    return found;\n  }\n};\n\n/**\n * @param gxOptions An array of GxOptions's\n * @returns The value of the selected item, or the first item, if no one is selected.\n */\nexport const getSelectedItem = (gxOptions: GxOption[]): string => {\n  let found = undefined;\n  for (let i = 0; i < gxOptions.length; i++) {\n    if (gxOptions[i].selected) {\n      found = gxOptions[i];\n      break;\n    }\n  }\n  if (found) {\n    return found.id;\n  } else {\n    return gxOptions[0].id;\n  }\n};\n\nexport const getSelectedItem2 = (\n  gxOptions: GxOption[] | undefined\n): string | undefined =>\n  gxOptions\n    ? (gxOptions.find(item => item.selected) ?? gxOptions[0]).id\n    : undefined;\n\n// Dots animation used in ch-chat code-render (or other components)\nexport const ANIMATION_DOTS = (\n  size: \"regular\" | \"tiny\" = \"regular\",\n  color: \"primary\" | \"on-surface\" = \"primary\"\n): SVGElement => {\n  const n = size === \"regular\" ? 1 : 4;\n  const colorVar =\n    color === \"primary\"\n      ? \"var(--mer-color__primary--200)\"\n      : \"var(--mer-text__on-surface)\";\n\n  return (\n    <svg width={36 / n} height={8 / n} fill=\"transparent\">\n      <circle cx={4 / n} cy={4 / n} r={4 / n} opacity=\"0\" fill={colorVar}>\n        <animate\n          attributeName=\"opacity\"\n          values=\"0;1;0\"\n          dur=\"1s\"\n          repeatCount=\"indefinite\"\n        />\n      </circle>\n      <circle cx={18 / n} cy={4 / n} r={4 / n} opacity=\"0\" fill={colorVar}>\n        <animate\n          attributeName=\"opacity\"\n          values=\"0;1;0\"\n          dur=\"1s\"\n          begin=\"0.15s\"\n          repeatCount=\"indefinite\"\n        />\n      </circle>\n      <circle cx={32 / n} cy={4 / n} r={4 / n} opacity=\"0\" fill={colorVar}>\n        <animate\n          attributeName=\"opacity\"\n          values=\"0;1;0\"\n          dur=\"1s\"\n          begin=\"0.30s\"\n          repeatCount=\"indefinite\"\n        />\n      </circle>\n    </svg>\n  );\n};\n"]}
+{"version":3,"file":"common.js","sourceRoot":"","sources":["../../src/common/common.tsx"],"names":[],"mappings":"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","sourcesContent":["/* STENCIL IMPORTS */\nimport { h } from \"@stencil/core\";\n/* OTHER LIBRARIES IMPORTS */\n/* CUSTOM IMPORTS */\nimport { GxgFormItemsArray, GxOption } from \"./types\";\nimport { ModulePropertyData } from \"../components/modules/types\";\nexport const renderFormItems = (\n  componentType:\n    | \"gxg-combo-box-item\"\n    | \"gxg-form-checkbox\"\n    | \"gxg-form-radio\" = \"gxg-combo-box-item\",\n  options: Array<GxOption>,\n  group = \"undefined-group\",\n  callback?: any\n): GxgFormItemsArray => {\n  if (options.length) {\n    const items: GxgFormItemsArray = [];\n    options.forEach(option => {\n      let item;\n      switch (componentType) {\n        case \"gxg-form-checkbox\":\n          item = (\n            <gxg-form-checkbox\n              checkboxId={option.id}\n              checked={option.checked}\n              disabled={option.disabled}\n              label={option.label}\n              value={option.value}\n              onChange={callback ? callback : null}\n              iconName={option.iconName}\n              part={`${group}-${option.id}`}\n            ></gxg-form-checkbox>\n          );\n          items.push(item);\n          break;\n        case \"gxg-combo-box-item\":\n          item = (\n            <gxg-combo-box-item\n              value={option.id}\n              icon={option.iconName}\n              part={`${group}-${option.id}`}\n            >\n              {option.label}\n            </gxg-combo-box-item>\n          );\n          items.push(item);\n          break;\n        case \"gxg-form-radio\":\n          item = (\n            <gxg-form-radio\n              radioId={option.id}\n              checked={option.checked}\n              disabled={option.disabled}\n              label={option.label}\n              value={option.value}\n              name={group}\n              part={`${group}-${option.id}`}\n            ></gxg-form-radio>\n          );\n          items.push(item);\n          break;\n        default:\n          break;\n      }\n    });\n    return items;\n  }\n  return null;\n};\n\nexport const renderModuleDataProperties = (\n  options: Array<ModulePropertyData>\n): ModulePropertyData[] => {\n  if (options.length) {\n    const items: ModulePropertyData[] = [];\n\n    options.forEach(option => {\n      if (Array.isArray(option.value)) {\n        const item = (\n          <div class=\"md-property__list\">\n            <p class=\"md-property__key\">{option.name} :</p>\n            <ul>\n              {option.value.map(subItem => {\n                return <li>{subItem}</li>;\n              })}\n            </ul>\n          </div>\n        );\n        items.push(item);\n      } else {\n        const item = (\n          <div\n            class={\n              option.inline\n                ? \"md-property md-property--inline\"\n                : \"md-property--block\"\n            }\n          >\n            <p class=\"md-property__key\">{option.name} :</p>\n            <p class=\"md-property__value\">{option.value}</p>\n          </div>\n        );\n        items.push(item);\n      }\n    });\n\n    return items;\n  }\n  return null;\n};\n\n/**\n * @param gxOptions An array of GxOptions's\n * @returns The first option in the array that is 'selected'. If no one found it returns null.\n */\nexport const getSelectedGxOption = (\n  gxOptions: GxOption[],\n  onlyId = true\n): GxOption | string | void => {\n  if (gxOptions?.length > 0) {\n    let found = null;\n    for (let i = 0; i < gxOptions.length; i++) {\n      if (gxOptions[i].selected) {\n        found = gxOptions[i];\n        break;\n      }\n    }\n    if (found && onlyId) {\n      return found.id;\n    } else if (!found && onlyId) {\n      return gxOptions[0].id;\n    }\n    return found;\n  }\n};\n\n/**\n * @param gxOptions An array of GxOptions's\n * @returns The value of the selected item, or the first item, if no one is selected.\n */\nexport const getSelectedItem = (gxOptions: GxOption[]): string => {\n  let found = undefined;\n  for (let i = 0; i < gxOptions.length; i++) {\n    if (gxOptions[i].selected) {\n      found = gxOptions[i];\n      break;\n    }\n  }\n  if (found) {\n    return found.id;\n  } else {\n    return gxOptions[0].id;\n  }\n};\n\nexport const getSelectedItem2 = (\n  gxOptions: GxOption[] | undefined\n): string | undefined =>\n  gxOptions\n    ? (gxOptions.find(item => item.selected) ?? gxOptions[0]).id\n    : undefined;\n\n// Dots animation used in ch-chat code-render (or other components)\nexport const ANIMATION_DOTS = (\n  size: \"regular\" | \"tiny\" = \"regular\",\n  color: \"primary\" | \"on-surface\" | \"nexa\" = \"primary\",\n  sizeType: \"static\" | \"dynamic\" = \"dynamic\",\n  duration: string = \"1s\"\n): SVGElement => {\n  const n = size === \"regular\" ? 1.5 : 4;\n  let colorDot1, colorDot2, colorDot3;\n  if (color === \"nexa\") {\n    colorDot1 = \"#5ba7ff\";\n    colorDot2 = \"#00CCFF\";\n    colorDot3 = \"#CF7AFF\";\n  } else if (color === \"on-surface\") {\n    colorDot1 = colorDot2 = colorDot3 = \"var(--mer-text__on-surface)\";\n  } else {\n    // primary\n    colorDot1 = colorDot2 = colorDot3 = \"var(--mer-color__primary--200)\";\n  }\n\n  const animateRadiusSize = (begin: string = \"0\") => {\n    return (\n      <animate\n        attributeName=\"r\"\n        values={`${2 / n};${4 / n};${2 / n}`}\n        dur={duration}\n        begin={begin}\n        repeatCount=\"indefinite\"\n      />\n    );\n  };\n\n  return (\n    <svg width={36 / n} height={8 / n} fill=\"transparent\">\n      <circle cx={4 / n} cy={4 / n} r={4 / n} opacity=\"0\" fill={colorDot1}>\n        <animate\n          attributeName=\"opacity\"\n          values=\"0;1;0\"\n          dur={duration}\n          repeatCount=\"indefinite\"\n        />\n        {sizeType === \"dynamic\" ? animateRadiusSize(\"0\") : null}\n      </circle>\n      <circle cx={18 / n} cy={4 / n} r={4 / n} opacity=\"0\" fill={colorDot2}>\n        <animate\n          attributeName=\"opacity\"\n          values=\"0;1;0\"\n          dur={duration}\n          begin=\"0.15s\"\n          repeatCount=\"indefinite\"\n        />\n        {sizeType === \"dynamic\" ? animateRadiusSize(\"0.33s\") : null}\n      </circle>\n      <circle cx={32 / n} cy={4 / n} r={4 / n} opacity=\"0\" fill={colorDot3}>\n        <animate\n          attributeName=\"opacity\"\n          values=\"0;1;0\"\n          dur={duration}\n          begin=\"0.30s\"\n          repeatCount=\"indefinite\"\n        />\n        {sizeType === \"dynamic\" ? animateRadiusSize(\"0.66s\") : null}\n      </circle>\n    </svg>\n  );\n};\n"]}

package/dist/collection/common/images/ai-avatar.svg

@@ -0,0 +1,11 @@
+<svg width="26" height="27" viewBox="0 0 26 27" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect x="0.5" y="1" width="25" height="25" rx="12.5" stroke="url(#paint0_linear_738_366)" stroke-opacity="0.9"/>
+<circle cx="12.9999" cy="13.4999" r="10.1122" fill="#5BA7FF"/>
+<path d="M11.3364 9.82021C11.6747 8.83021 13.0426 8.80023 13.4437 9.73026L13.4776 9.82077L13.9341 11.1559C14.0388 11.462 14.2078 11.7422 14.4299 11.9775C14.652 12.2128 14.922 12.3977 15.2217 12.5198L15.3444 12.5656L16.6795 13.0216C17.6695 13.3599 17.6995 14.7278 16.77 15.1289L16.6795 15.1628L15.3444 15.6193C15.0382 15.7239 14.7579 15.8929 14.5225 16.115C14.2871 16.3372 14.1021 16.6072 13.98 16.9069L13.9341 17.0291L13.4782 18.3647C13.1399 19.3547 11.772 19.3847 11.3714 18.4552L11.3364 18.3647L10.8804 17.0296C10.7759 16.7234 10.6068 16.4431 10.3847 16.2077C10.1626 15.9723 9.89256 15.7873 9.59285 15.6651L9.47066 15.6193L8.13557 15.1634C7.14501 14.8251 7.11503 13.4572 8.04506 13.0566L8.13557 13.0216L9.47066 12.5656C9.77684 12.461 10.057 12.2919 10.2923 12.0698C10.5276 11.8477 10.7125 11.5777 10.8346 11.278L10.8804 11.1559L11.3364 9.82021ZM16.933 7.86963C17.0388 7.86963 17.1425 7.89932 17.2323 7.95532C17.3221 8.01132 17.3944 8.09139 17.441 8.18643L17.4681 8.25262L17.6661 8.83304L18.2471 9.03104C18.3532 9.06707 18.4462 9.13378 18.5143 9.22271C18.5824 9.31164 18.6226 9.41879 18.6297 9.53057C18.6368 9.64236 18.6107 9.75375 18.5544 9.85063C18.4982 9.94752 18.4145 10.0255 18.3139 10.0748L18.2471 10.1019L17.6667 10.2999L17.4687 10.8809C17.4326 10.9869 17.3658 11.0799 17.2769 11.1479C17.1879 11.216 17.0808 11.2561 16.969 11.2632C16.8572 11.2703 16.7458 11.244 16.649 11.1877C16.5521 11.1315 16.4742 11.0477 16.425 10.9471L16.3978 10.8809L16.1998 10.3005L15.6188 10.1025C15.5128 10.0665 15.4198 9.99975 15.3517 9.91082C15.2836 9.82189 15.2434 9.71475 15.2362 9.60296C15.2291 9.49117 15.2553 9.37978 15.3115 9.2829C15.3677 9.18602 15.4515 9.10801 15.5521 9.05876L15.6188 9.0316L16.1992 8.8336L16.3972 8.25262C16.4354 8.14085 16.5076 8.04382 16.6036 7.97513C16.6997 7.90645 16.8149 7.86956 16.933 7.86963Z" fill="#1C6AC7"/>
+<defs>
+<linearGradient id="paint0_linear_738_366" x1="34.4783" y1="5.02174" x2="13" y2="26.5" gradientUnits="userSpaceOnUse">
+<stop stop-color="#00CCFF"/>
+<stop offset="1" stop-color="#CF7AFF"/>
+</linearGradient>
+</defs>
+</svg>

package/dist/collection/components/bpm/application-declaration/bpm-app-declaration.css

@@ -636,6 +636,7 @@ ch-tabular-grid.empty-result::part(main) {
   display: grid;
   align-items: stretch;
   justify-content: stretch;
+  min-inline-size: 0;
 }
 .tabular-grid-application-declaration ch-tabular-grid-cell:is(:nth-child(2)):hover {
   outline: var(--focus__outline-width) var(--focus__outline-style) var(--control__border-color--hover);

package/dist/collection/components/chat/chat-container/chat-container.css

@@ -0,0 +1,118 @@
+.chat-container {
+  background-color: var(--elevation-background-color, --mer-surface__elevation--01);
+  display: grid;
+  block-size: 100%;
+  overflow: auto;
+  grid-template-rows: 1fr;
+  position: relative;
+  --chat-common-border-radius: var(--mer-spacing--2xs);
+}
+
+.chat-container.with-header {
+  grid-template-rows: max-content 1fr;
+}
+
+.section {
+  display: contents;
+}
+
+.header {
+  padding: var(--mer-spacing--2xs) var(--mer-spacing--2xs) var(--mer-spacing--2xs) var(--mer-spacing--sm);
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: var(--mer-spacing--sm);
+  color: var(--mer-text__bright);
+  border-block-end: var(--mer-border__width--sm) solid var(--color-border-surface-on-elevation-01, #333d47);
+}
+.header .button-copy-chat,
+.header .button-delete-chat {
+  --control__border-color: transparent !important;
+}
+.header .button-delete-chat:hover {
+  filter: brightness(1.3);
+}
+.header .button-delete-chat:active {
+  filter: brightness(0.8);
+}
+
+.ch-chat-container {
+  overflow: auto;
+  position: relative;
+  display: grid;
+}
+
+.chat-container__conversation-copied {
+  position: absolute;
+  z-index: 1;
+  inline-size: 100%;
+  block-size: 100%;
+  background: rgba(22, 22, 23, 0.75);
+  backdrop-filter: saturate(180%) blur(20px);
+  display: grid;
+  align-items: center;
+  justify-content: center;
+  text-align: center;
+  padding: 32px;
+  --mer-icon__box--md: 18px;
+  pointer-events: none;
+  overflow: hidden;
+  animation: fadeIn 100ms ease-in-out forwards;
+  opacity: 0;
+}
+
+.chat-container__conversation-copied-wrapper {
+  display: flex;
+  align-items: center;
+  gap: var(--mer-spacing--sm);
+  position: relative;
+  inset-block-start: 4px;
+  opacity: 0;
+  animation: liftUp var(--mer-timing--fast) ease-in-out forwards;
+  animation-delay: var(--mer-timing--fast);
+}
+
+@keyframes fadeIn {
+  from {
+    opacity: 0;
+  }
+  to {
+    opacity: 1;
+  }
+}
+@keyframes liftUp {
+  from {
+    opacity: 0;
+    inset-block-start: 4px;
+  }
+  to {
+    opacity: 1;
+    inset-block-start: 0;
+  }
+}
+::selection {
+  color: #00ccff;
+  background: #22334a;
+}
+
+.chat::part(code-block-header__copy) {
+  --copy-text-opacity: 0;
+  --copy-text-translate-x: 6px;
+  opacity: var(--copy-text-opacity);
+  pointer-events: none;
+  transform: translateX(var(--copy-text-translate-x));
+  transition: opacity 100ms ease-in-out, transform 100ms ease-in-out;
+  font-size: 12px;
+}
+
+.chat::part(code-block-header__copy-copied) {
+  --copy-button-pointer-events: none !important;
+  --copy-text-opacity: 1;
+  --copy-text-translate-x: 0;
+}
+
+.chat::part(code-block-header) {
+  align-items: center;
+  display: flex;
+  gap: 8px;
+}

package/dist/collection/components/chat/chat-container/chat-container.js

@@ -0,0 +1,218 @@
+var __classPrivateFieldSet = (this && this.__classPrivateFieldSet) || function (receiver, state, value, kind, f) {
+    if (kind === "m")
+        throw new TypeError("Private method is not writable");
+    if (kind === "a" && !f)
+        throw new TypeError("Private accessor was defined without a setter");
+    if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver))
+        throw new TypeError("Cannot write private member to an object whose class did not declare it");
+    return (kind === "a" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value)), value;
+};
+var __classPrivateFieldGet = (this && this.__classPrivateFieldGet) || function (receiver, state, kind, f) {
+    if (kind === "a" && !f)
+        throw new TypeError("Private accessor was defined without a getter");
+    if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver))
+        throw new TypeError("Cannot read private member from an object whose class did not declare it");
+    return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
+};
+var _GxIdeChatContainer_menuItems, _GxIdeChatContainer_componentLocale, _GxIdeChatContainer_showMenuHandler, _GxIdeChatContainer_menuExpandedChangeHandler, _GxIdeChatContainer_copyConversationHandler, _GxIdeChatContainer_deleteConversationHandler;
+import { Host, h } from "@stencil/core";
+import { getIconPath } from "@genexus/mercury";
+import { Locale } from "../../../common/locale";
+const CSS_BUNDLES = [
+    "resets/box-sizing",
+    "utils/typography",
+    "chameleon/scrollbar",
+    "components/button",
+    "components/dropdown",
+    "components/icon",
+    "utils/elevation"
+];
+const COPY_ICON = getIconPath({
+    category: "system",
+    name: "copy",
+    colorType: "primary"
+});
+const DELETE_ICON = getIconPath({
+    category: "system",
+    name: "delete-outlined",
+    colorType: "primary"
+});
+const CONVERSATION_ICON = getIconPath({
+    category: "objects",
+    name: "conversational-flows"
+});
+const MORE_HORIZONTAL_ICON = getIconPath({
+    category: "system",
+    name: "more-horizontal",
+    colorType: "neutral"
+});
+export class GxIdeChatContainer {
+    constructor() {
+        _GxIdeChatContainer_menuItems.set(this, [
+            { type: "slot", id: "delete-chat-button" },
+            { type: "slot", id: "copy-chat-button" }
+        ]);
+        /**
+         * The component hard-coded strings translations.
+         */
+        // eslint-disable-next-line @stencil-community/own-props-must-be-private
+        _GxIdeChatContainer_componentLocale.set(this, void 0);
+        _GxIdeChatContainer_showMenuHandler.set(this, () => {
+            this.menuIsExpanded = true;
+        });
+        _GxIdeChatContainer_menuExpandedChangeHandler.set(this, (event) => {
+            this.menuIsExpanded = event.detail;
+        });
+        _GxIdeChatContainer_copyConversationHandler.set(this, () => {
+            if (this.copyConversationCallback) {
+                this.copyConversationCallback();
+                this.menuIsExpanded = false;
+            }
+        });
+        _GxIdeChatContainer_deleteConversationHandler.set(this, () => {
+            if (this.deleteConversationCallback) {
+                this.deleteConversationCallback();
+                this.menuIsExpanded = false;
+            }
+        });
+        this.displayConversationCopiedMessage = false;
+        this.menuIsExpanded = false;
+        this.chatTitle = undefined;
+        this.copyConversationCallback = undefined;
+        this.deleteConversationCallback = undefined;
+        this.displayWelcomeScreen = false;
+    }
+    async componentWillLoad() {
+        __classPrivateFieldSet(this, _GxIdeChatContainer_componentLocale, await Locale.getComponentStrings(this.el), "f");
+    }
+    /**
+     * It will display a feedback message that the conversation has been copied
+     */
+    async showCopyConversationMessage() {
+        this.displayConversationCopiedMessage = true;
+        setTimeout(() => {
+            this.displayConversationCopiedMessage = false;
+        }, 2000);
+    }
+    render() {
+        const renderHeader = this.chatTitle ||
+            this.copyConversationCallback ||
+            this.deleteConversationCallback;
+        const renderButtonsGroup = this.copyConversationCallback || this.deleteConversationCallback;
+        return (h(Host, { class: {
+                "chat-container": true,
+                "with-header": !!renderHeader
+            } }, h("ch-theme", { model: CSS_BUNDLES }), h("section", { class: "section" }, renderHeader && (h("header", { class: "header tiny-semi-bold-l" }, this.chatTitle && this.chatTitle, renderButtonsGroup && (h("ch-action-menu-render", { class: "dropdown", blockAlign: "inside-start", inlineAlign: "inside-end", model: __classPrivateFieldGet(this, _GxIdeChatContainer_menuItems, "f"), expanded: this.menuIsExpanded, onExpandedChange: __classPrivateFieldGet(this, _GxIdeChatContainer_menuExpandedChangeHandler, "f") }, h("button", { class: "button-tertiary button-icon-only", onClick: __classPrivateFieldGet(this, _GxIdeChatContainer_showMenuHandler, "f"), type: "button", "aria-label": __classPrivateFieldGet(this, _GxIdeChatContainer_componentLocale, "f").showMenuAriaLabel, title: __classPrivateFieldGet(this, _GxIdeChatContainer_componentLocale, "f").showMenuAriaLabel }, h("ch-image", { class: "icon-md", src: MORE_HORIZONTAL_ICON })), this.copyConversationCallback && (h("button", { class: "button-tertiary button-icon-and-text button-copy-chat", slot: "copy-chat-button", onClick: __classPrivateFieldGet(this, _GxIdeChatContainer_copyConversationHandler, "f"), type: "button", "aria-label": __classPrivateFieldGet(this, _GxIdeChatContainer_componentLocale, "f").copyConversationAriaLabel, title: __classPrivateFieldGet(this, _GxIdeChatContainer_componentLocale, "f").copyConversationAriaLabel }, h("ch-image", { class: "icon-md", src: COPY_ICON }), __classPrivateFieldGet(this, _GxIdeChatContainer_componentLocale, "f").copyConversationLabel)), this.deleteConversationCallback && (h("button", { class: "button-tertiary button-icon-and-text button-delete-chat", slot: "delete-chat-button", onClick: __classPrivateFieldGet(this, _GxIdeChatContainer_deleteConversationHandler, "f"), type: "button", "aria-label": __classPrivateFieldGet(this, _GxIdeChatContainer_componentLocale, "f").deleteConversationAriaLabel, title: __classPrivateFieldGet(this, _GxIdeChatContainer_componentLocale, "f").deleteConversationAriaLabel }, h("ch-image", { class: "icon-md", src: DELETE_ICON }), __classPrivateFieldGet(this, _GxIdeChatContainer_componentLocale, "f").clearConversationLabel)))))), h("section", { class: "ch-chat-container" }, h("slot", null), this.displayConversationCopiedMessage && (h("div", { class: "chat-container__conversation-copied" }, h("div", { class: "chat-container__conversation-copied-wrapper" }, h("ch-image", { class: "icon-md", src: CONVERSATION_ICON }), h("p", { class: "body-regular-l" }, "conversation copied"))))))));
+    }
+    static get is() { return "gx-ide-chat-container"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["chat-container.scss"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["chat-container.css"]
+        };
+    }
+    static get assetsDirs() { return ["gx-ide-assets/chat-container"]; }
+    static get properties() {
+        return {
+            "chatTitle": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "The chat title"
+                },
+                "attribute": "chat-title",
+                "reflect": false
+            },
+            "copyConversationCallback": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "() => void",
+                    "resolved": "() => void",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "If true a button for copying the conversation will be render on the header"
+                }
+            },
+            "deleteConversationCallback": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "() => void",
+                    "resolved": "() => void",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "If true a button for deleting the conversation will be render on the header"
+                }
+            },
+            "displayWelcomeScreen": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "If true a the welcome screen will be rendered"
+                },
+                "attribute": "display-welcome-screen",
+                "reflect": false,
+                "defaultValue": "false"
+            }
+        };
+    }
+    static get states() {
+        return {
+            "displayConversationCopiedMessage": {},
+            "menuIsExpanded": {}
+        };
+    }
+    static get methods() {
+        return {
+            "showCopyConversationMessage": {
+                "complexType": {
+                    "signature": "() => Promise<void>",
+                    "parameters": [],
+                    "references": {
+                        "Promise": {
+                            "location": "global",
+                            "id": "global::Promise"
+                        }
+                    },
+                    "return": "Promise<void>"
+                },
+                "docs": {
+                    "text": "It will display a feedback message that the conversation has been copied",
+                    "tags": []
+                }
+            }
+        };
+    }
+    static get elementRef() { return "el"; }
+}
+_GxIdeChatContainer_menuItems = new WeakMap(), _GxIdeChatContainer_componentLocale = new WeakMap(), _GxIdeChatContainer_showMenuHandler = new WeakMap(), _GxIdeChatContainer_menuExpandedChangeHandler = new WeakMap(), _GxIdeChatContainer_copyConversationHandler = new WeakMap(), _GxIdeChatContainer_deleteConversationHandler = new WeakMap();
+//# sourceMappingURL=chat-container.js.map

package/dist/collection/components/chat/chat-container/chat-container.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"chat-container.js","sourceRoot":"","sources":["../../../../src/components/chat/chat-container/chat-container.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  Component,\n  Host,\n  h,\n  Prop,\n  Element,\n  Method,\n  State\n} from \"@stencil/core\";\nimport { MercuryBundles, getIconPath } from \"@genexus/mercury\";\nimport { ActionMenuModel } from \"@genexus/chameleon-controls-library\";\n\nimport { Locale } from \"../../../common/locale\";\n\nconst CSS_BUNDLES: MercuryBundles = [\n  \"resets/box-sizing\",\n  \"utils/typography\",\n  \"chameleon/scrollbar\",\n  \"components/button\",\n  \"components/dropdown\",\n  \"components/icon\",\n  \"utils/elevation\"\n];\n\nconst COPY_ICON = getIconPath({\n  category: \"system\",\n  name: \"copy\",\n  colorType: \"primary\"\n});\nconst DELETE_ICON = getIconPath({\n  category: \"system\",\n  name: \"delete-outlined\",\n  colorType: \"primary\"\n});\nconst CONVERSATION_ICON = getIconPath({\n  category: \"objects\",\n  name: \"conversational-flows\"\n});\nconst MORE_HORIZONTAL_ICON = getIconPath({\n  category: \"system\",\n  name: \"more-horizontal\",\n  colorType: \"neutral\"\n});\n\n@Component({\n  tag: \"gx-ide-chat-container\",\n  styleUrl: \"chat-container.scss\",\n  shadow: false,\n  assetsDirs: [\"gx-ide-assets/chat-container\"]\n})\nexport class GxIdeChatContainer {\n  #menuItems: ActionMenuModel = [\n    { type: \"slot\", id: \"delete-chat-button\" },\n    { type: \"slot\", id: \"copy-chat-button\" }\n  ];\n\n  /**\n   * The component hard-coded strings translations.\n   */\n  // eslint-disable-next-line @stencil-community/own-props-must-be-private\n  #componentLocale: any;\n\n  @Element() el: HTMLGxIdeChatContainerElement;\n\n  /**\n   * Coneration Copied\n   */\n  @State() displayConversationCopiedMessage: boolean = false;\n\n  /**\n   * Displays or hides the menu\n   */\n  @State() menuIsExpanded: boolean = false;\n\n  /**\n   * The chat title\n   */\n  @Prop() readonly chatTitle?: string;\n\n  /**\n   * If true a button for copying the conversation will be render on the header\n   */\n  @Prop() readonly copyConversationCallback: () => void;\n\n  /**\n   * If true a button for deleting the conversation will be render on the header\n   */\n  @Prop() readonly deleteConversationCallback: () => void;\n\n  /**\n   * If true a the welcome screen will be rendered\n   */\n  @Prop() readonly displayWelcomeScreen: boolean = false;\n\n  async componentWillLoad() {\n    this.#componentLocale = await Locale.getComponentStrings(this.el);\n  }\n\n  /**\n   * It will display a feedback message that the conversation has been copied\n   */\n  @Method()\n  async showCopyConversationMessage() {\n    this.displayConversationCopiedMessage = true;\n    setTimeout(() => {\n      this.displayConversationCopiedMessage = false;\n    }, 2000);\n  }\n\n  #showMenuHandler = () => {\n    this.menuIsExpanded = true;\n  };\n\n  #menuExpandedChangeHandler = (event: CustomEvent<boolean>) => {\n    this.menuIsExpanded = event.detail;\n  };\n\n  #copyConversationHandler = () => {\n    if (this.copyConversationCallback) {\n      this.copyConversationCallback();\n      this.menuIsExpanded = false;\n    }\n  };\n  #deleteConversationHandler = () => {\n    if (this.deleteConversationCallback) {\n      this.deleteConversationCallback();\n      this.menuIsExpanded = false;\n    }\n  };\n\n  render() {\n    const renderHeader =\n      this.chatTitle ||\n      this.copyConversationCallback ||\n      this.deleteConversationCallback;\n\n    const renderButtonsGroup =\n      this.copyConversationCallback || this.deleteConversationCallback;\n    return (\n      <Host\n        class={{\n          \"chat-container\": true,\n          \"with-header\": !!renderHeader\n        }}\n      >\n        <ch-theme model={CSS_BUNDLES}></ch-theme>\n        <section class=\"section\">\n          {renderHeader && (\n            <header class=\"header tiny-semi-bold-l\">\n              {this.chatTitle && this.chatTitle}\n              {renderButtonsGroup && (\n                <ch-action-menu-render\n                  class=\"dropdown\"\n                  blockAlign=\"inside-start\"\n                  inlineAlign=\"inside-end\"\n                  model={this.#menuItems}\n                  expanded={this.menuIsExpanded}\n                  onExpandedChange={this.#menuExpandedChangeHandler}\n                >\n                  <button\n                    class=\"button-tertiary button-icon-only\"\n                    onClick={this.#showMenuHandler}\n                    type=\"button\"\n                    aria-label={this.#componentLocale.showMenuAriaLabel}\n                    title={this.#componentLocale.showMenuAriaLabel}\n                  >\n                    <ch-image\n                      class=\"icon-md\"\n                      src={MORE_HORIZONTAL_ICON}\n                    ></ch-image>\n                  </button>\n                  {this.copyConversationCallback && (\n                    <button\n                      class=\"button-tertiary button-icon-and-text button-copy-chat\"\n                      slot=\"copy-chat-button\"\n                      onClick={this.#copyConversationHandler}\n                      type=\"button\"\n                      aria-label={\n                        this.#componentLocale.copyConversationAriaLabel\n                      }\n                      title={this.#componentLocale.copyConversationAriaLabel}\n                    >\n                      <ch-image class=\"icon-md\" src={COPY_ICON}></ch-image>\n                      {this.#componentLocale.copyConversationLabel}\n                    </button>\n                  )}\n                  {this.deleteConversationCallback && (\n                    <button\n                      class=\"button-tertiary button-icon-and-text button-delete-chat\"\n                      slot=\"delete-chat-button\"\n                      onClick={this.#deleteConversationHandler}\n                      type=\"button\"\n                      aria-label={\n                        this.#componentLocale.deleteConversationAriaLabel\n                      }\n                      title={this.#componentLocale.deleteConversationAriaLabel}\n                    >\n                      <ch-image class=\"icon-md\" src={DELETE_ICON}></ch-image>\n                      {this.#componentLocale.clearConversationLabel}\n                    </button>\n                  )}\n                </ch-action-menu-render>\n              )}\n            </header>\n          )}\n          <section class=\"ch-chat-container\">\n            <slot></slot>\n            {this.displayConversationCopiedMessage && (\n              <div class=\"chat-container__conversation-copied\">\n                <div class=\"chat-container__conversation-copied-wrapper\">\n                  <ch-image class=\"icon-md\" src={CONVERSATION_ICON}></ch-image>\n                  <p class=\"body-regular-l\">conversation copied</p>\n                </div>\n              </div>\n            )}\n          </section>\n          {/* <footer class=\"footer elevation-1\">footer</footer> */}\n        </section>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/chat/chat-container/gx-ide-assets/chat-container/langs/chat-container.lang.en.json

@@ -0,0 +1,9 @@
+{
+  "componentName": "Chat Container",
+  "showMenuAriaLabel": "Show actions",
+  "copyConversationLabel": "Copy conversation",
+  "clearConversationLabel": "Clear conversation",
+  "copyResponseAriaLabel": "Copy response",
+  "sendPromptAriaLabel": "Send prompt",
+  "stopGeneratingAnswerAriaLabel": "Stop response"
+}

package/dist/collection/components/chat/chat-container/gx-ide-assets/chat-container/langs/chat-container.lang.ja.json

@@ -0,0 +1,9 @@
+{
+  "componentName": "Chat Container",
+  "showMenuAriaLabel": "Show actions",
+  "copyConversationLabel": "Copy conversation",
+  "clearConversationLabel": "Clear conversation",
+  "copyResponseAriaLabel": "Copy response",
+  "sendPromptAriaLabel": "Send prompt",
+  "stopGeneratingAnswerAriaLabel": "Stop response"
+}

package/dist/collection/components/chat/chat-container/gx-ide-assets/chat-container/langs/chat-container.lang.zh.json

@@ -0,0 +1,9 @@
+{
+  "componentName": "Chat Container",
+  "showMenuAriaLabel": "Show actions",
+  "copyConversationLabel": "Copy conversation",
+  "clearConversationLabel": "Clear conversation",
+  "copyResponseAriaLabel": "Copy response",
+  "sendPromptAriaLabel": "Send prompt",
+  "stopGeneratingAnswerAriaLabel": "Stop response"
+}

package/dist/collection/components/chat/chat-welcome/chat-welcome.css

@@ -0,0 +1,109 @@
+:host {
+  block-size: 100%;
+}
+
+.welcome-container {
+  --opacity: 1;
+  --translate-y: 0;
+  opacity: var(--opacity);
+  transform: translateY(var(--translate-y));
+  transition: all var(--transition-duration);
+  display: flex;
+  block-size: 100%;
+  grid-template-rows: max-content max-content;
+  flex-direction: column;
+  justify-content: space-between;
+  background-repeat: no-repeat;
+  background-size: cover;
+  background-size: contain;
+}
+.welcome-container.hidden {
+  --opacity: 0;
+  --translate-y: 4px;
+}
+
+.header {
+  --opacity: 0;
+  --translate-y: 3px;
+  transition: all var(--transition-duration) var(--transition-delay) cubic-bezier(0.4, 0, 0.2, 1);
+  transform: translateY(var(--translate-y));
+  opacity: var(--opacity);
+  display: flex;
+  flex-direction: column;
+  gap: var(--mer-spacing--md);
+  align-items: center;
+  padding: var(--mer-spacing--md);
+}
+.header--visible {
+  --opacity: 1;
+  --translate-y: 0;
+}
+.header__circle {
+  inline-size: 55px;
+  block-size: 55px;
+  background-size: contain;
+  background-repeat: no-repeat;
+  background-position: center center;
+  margin-block-end: -6px;
+}
+.header__title {
+  display: grid;
+  text-align: center;
+  margin: 0;
+  text-align: center;
+  white-space: pre-line;
+  line-height: 1.3;
+  font-weight: 600;
+  font-size: var(--font-size-header-h3);
+}
+.header__greeting {
+  line-height: 1.4;
+  text-align: center;
+  font-weight: 300;
+}
+
+.suggested-prompts {
+  --opacity: 1;
+  opacity: var(--opacity);
+  transition: opacity var(--transition-duration);
+  display: flex;
+  flex-direction: column;
+  gap: var(--mer-spacing--md);
+  list-style: none;
+  margin: 0;
+  padding: var(--mer-spacing--md);
+}
+.suggested-prompts.hidden {
+  --opacity: 0;
+}
+.suggested-prompts__button {
+  opacity: 0;
+  transform: translateX(-3px);
+  animation: fadeInSuggestedPromptButton var(--mer-timing--regular) ease forwards;
+  animation-delay: var(--delay, 0s);
+  border: 0;
+  padding: var(--mer-spacing--sm);
+  border-radius: 30px;
+  font-size: 14px;
+  font-style: oblique;
+  cursor: pointer;
+  display: flex;
+  align-items: center;
+  gap: var(--mer-spacing--xs);
+  background-color: #22334a;
+  font-weight: 100;
+}
+.suggested-prompts__button:hover {
+  background-color: #1a2b42;
+}
+
+@keyframes fadeInSuggestedPromptButton {
+  from {
+    opacity: 0;
+    transform: translateX(-3px);
+  }
+  to {
+    opacity: 1;
+    transform: translateX(0);
+  }
+}