@seamly/web-ui 20.1.0 → 20.2.0-alpha.3

package/build/dist/lib/index.js

@@ -9225,6 +9225,29 @@ const setLocale = i18n_utils_createThunk('setLocale', async (locale, {
     return api.getTranslations(locale);
   });
 });
+;// CONCATENATED MODULE: ./src/javascripts/domains/translations/utils.js
+
+const {
+  createActions: utils_createActions,
+  createReducer: translations_utils_createReducer,
+  selectState: translations_utils_selectState
+} = createDomain('translations');
+;// CONCATENATED MODULE: ./src/javascripts/domains/translations/actions.js
+
+const [enable, disable] = utils_createActions('translate', {
+  enable: locale => ({
+    locale
+  }),
+  disable: () => ({})
+});
+const [enableEvent, disableEvent] = utils_createActions('event', {
+  enable: payloadId => ({
+    payloadId
+  }),
+  disable: payloadId => ({
+    payloadId
+  })
+});
 ;// CONCATENATED MODULE: ./src/javascripts/domains/app/utils.js
 
 const {
@@ -9238,6 +9261,49 @@ const {
 
 const selectUserHasResponded = createSelector(app_utils_selectState, state => state.userHasResponded);
 
+;// CONCATENATED MODULE: ./src/javascripts/domains/visibility/utils.js
+
+
+const {
+  createAction: visibility_utils_createAction,
+  createActions: visibility_utils_createActions,
+  createThunk: visibility_utils_createThunk,
+  createReducer: visibility_utils_createReducer,
+  selectState: visibility_utils_selectState
+} = createDomain('visibility');
+const calculateVisibility = ({
+  hasResponded,
+  previousVisibility,
+  requestedVisibility,
+  config
+}) => {
+  const {
+    defaults,
+    layoutMode,
+    hideOnNoUserResponse
+  } = config;
+  const {
+    visible: defaultVisibility
+  } = defaults || {}; // Requesting open should override the responded check.
+
+  if (layoutMode === 'window' && hideOnNoUserResponse && requestedVisibility !== visibilityStates.open) {
+    return hasResponded ? requestedVisibility || previousVisibility || visibilityStates.open : visibilityStates.hidden;
+  } // Allow users to continue a conversation (if they have responded and no visibility is requested)
+  // when switching from the window layout to the inline layout
+
+
+  if (layoutMode === 'inline' && hasResponded && !requestedVisibility) {
+    return previousVisibility || visibilityStates.open;
+  }
+
+  const baseVisibility = visibilityStates.minimized;
+  return requestedVisibility || previousVisibility || defaultVisibility || baseVisibility;
+};
+;// CONCATENATED MODULE: ./src/javascripts/domains/visibility/selectors.js
+
+
+const selectVisibility = createSelector(visibility_utils_selectState, state => state.visibility);
+
 ;// CONCATENATED MODULE: ./src/javascripts/ui/hooks/seamly-state-hooks.js
 function seamly_state_hooks_ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
 
@@ -9349,43 +9415,6 @@ const useSeamlyLayoutMode = () => {
     isResolving: !layoutMode
   };
 };
-;// CONCATENATED MODULE: ./src/javascripts/domains/visibility/utils.js
-
-
-const {
-  createAction: visibility_utils_createAction,
-  createActions: utils_createActions,
-  createThunk: visibility_utils_createThunk,
-  createReducer: visibility_utils_createReducer,
-  selectState: visibility_utils_selectState
-} = createDomain('visibility');
-const calculateVisibility = ({
-  hasResponded,
-  previousVisibility,
-  requestedVisibility,
-  config
-}) => {
-  const {
-    defaults,
-    layoutMode,
-    hideOnNoUserResponse
-  } = config;
-  const {
-    visible: defaultVisibility
-  } = defaults || {}; // Requesting open should override the responded check.
-
-  if (layoutMode === 'window' && hideOnNoUserResponse && requestedVisibility !== visibilityStates.open) {
-    return hasResponded ? requestedVisibility || previousVisibility || visibilityStates.open : visibilityStates.hidden;
-  }
-
-  const baseVisibility = visibilityStates.minimized;
-  return requestedVisibility || previousVisibility || defaultVisibility || baseVisibility;
-};
-;// CONCATENATED MODULE: ./src/javascripts/domains/visibility/selectors.js
-
-
-const selectVisibility = createSelector(visibility_utils_selectState, state => state.visibility);
-
 ;// CONCATENATED MODULE: ./src/javascripts/domains/visibility/actions.js
 function actions_ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
 
@@ -9550,6 +9579,8 @@ const clear = interrupt_utils_createAction('clear');
 
 
 
+
+
 const setHasResponded = app_utils_createAction('setHasResponded', hasResponded => ({
   hasResponded
 }));
@@ -9592,7 +9623,7 @@ const app_actions_initialize = app_utils_createThunk('initialize', async (_, {
 
     if (agentParticipant !== null && agentParticipant !== void 0 && agentParticipant.name) {
       dispatch({
-        type: seamlyActions.SET_HEADER_TITLE,
+        type: seamlyActions.SET_HEADER_SUB_TITLE,
         title: agentParticipant.name
       });
     }
@@ -9601,6 +9632,8 @@ const app_actions_initialize = app_utils_createThunk('initialize', async (_, {
   }
 
   try {
+    var _config$context2;
+
     if (api.hasConversation()) {
       var _initialState$transla;
 
@@ -9614,6 +9647,16 @@ const app_actions_initialize = app_utils_createThunk('initialize', async (_, {
       if ('userResponded' in initialState) {
         dispatch(setHasResponded(initialState.userResponded));
       }
+    } else if (config !== null && config !== void 0 && (_config$context2 = config.context) !== null && _config$context2 !== void 0 && _config$context2.translationLocale) {
+      locale = config.context.translationLocale;
+      api.send('action', {
+        type: actionTypes.setTranslation,
+        body: {
+          enabled: true,
+          locale
+        }
+      });
+      dispatch(enable(locale));
     }
   } catch (e) {
     if (e instanceof SeamlySessionExpiredError) {
@@ -10818,6 +10861,33 @@ const useFileUploads = () => {
     isComplete: currentUploads.every(file => file.complete)
   };
 };
+;// CONCATENATED MODULE: ./src/javascripts/ui/hooks/utility-hooks.js
+
+
+const useForceUpdate = () => {
+  // This is an escape hatch mentioned in the React docs:
+  // https://reactjs.org/docs/hooks-faq.html#is-there-something-like-forceupdate
+
+  /* eslint-disable-next-line no-unused-vars */
+  const [ignored, forceUpdate] = (0,hooks_namespaceObject.useReducer)(x => x + 1, 0);
+  return (0,hooks_namespaceObject.useCallback)(() => {
+    setTimeout(() => {
+      forceUpdate();
+    });
+  }, []);
+};
+const useGeneratedId = () => {
+  const [id] = (0,hooks_namespaceObject.useState)(() => randomId());
+  return id;
+};
+const useStableCallback = callback => {
+  const callbackRef = (0,hooks_namespaceObject.useRef)();
+  callbackRef.current = callback;
+  const isFunction = typeof callback === 'function';
+  return (0,hooks_namespaceObject.useMemo)(() => {
+    return isFunction ? (...args) => callbackRef.current(...args) : undefined;
+  }, [isFunction]);
+};
 ;// CONCATENATED MODULE: ./src/javascripts/domains/interrupt/selectors.js
 
 
@@ -11035,33 +11105,6 @@ const visibility_reducer_initialState = {
 
 
 
-;// CONCATENATED MODULE: ./src/javascripts/ui/hooks/utility-hooks.js
-
-
-const useForceUpdate = () => {
-  // This is an escape hatch mentioned in the React docs:
-  // https://reactjs.org/docs/hooks-faq.html#is-there-something-like-forceupdate
-
-  /* eslint-disable-next-line no-unused-vars */
-  const [ignored, forceUpdate] = (0,hooks_namespaceObject.useReducer)(x => x + 1, 0);
-  return (0,hooks_namespaceObject.useCallback)(() => {
-    setTimeout(() => {
-      forceUpdate();
-    });
-  }, []);
-};
-const useGeneratedId = () => {
-  const [id] = (0,hooks_namespaceObject.useState)(() => randomId());
-  return id;
-};
-const useStableCallback = callback => {
-  const callbackRef = (0,hooks_namespaceObject.useRef)();
-  callbackRef.current = callback;
-  const isFunction = typeof callback === 'function';
-  return (0,hooks_namespaceObject.useMemo)(() => {
-    return isFunction ? (...args) => callbackRef.current(...args) : undefined;
-  }, [isFunction]);
-};
 ;// CONCATENATED MODULE: ./src/javascripts/ui/hooks/use-seamly-commands.js
 function use_seamly_commands_ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
 
@@ -11849,29 +11892,6 @@ const app_reducer_initialState = {
 
 
 
-;// CONCATENATED MODULE: ./src/javascripts/domains/translations/utils.js
-
-const {
-  createActions: translations_utils_createActions,
-  createReducer: translations_utils_createReducer,
-  selectState: translations_utils_selectState
-} = createDomain('translations');
-;// CONCATENATED MODULE: ./src/javascripts/domains/translations/actions.js
-
-const [enable, disable] = translations_utils_createActions('translate', {
-  enable: locale => ({
-    locale
-  }),
-  disable: () => ({})
-});
-const [enableEvent, disableEvent] = translations_utils_createActions('event', {
-  enable: payloadId => ({
-    payloadId
-  }),
-  disable: payloadId => ({
-    payloadId
-  })
-});
 ;// CONCATENATED MODULE: ./src/javascripts/domains/redux/utils.js
 const arrayContentEquals = (a, b) => {
   if (a === b) {
@@ -12804,197 +12824,18 @@ function updateFormControl(state, formId, name, controlState) {
 
 
 
-;// CONCATENATED MODULE: ./src/javascripts/ui/utils/form-utils.js
-function form_utils_ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+;// CONCATENATED MODULE: ./src/javascripts/ui/components/form-controls/form.js
+const form_excluded = ["className", "disableValidationClasses"];
 
-function form_utils_objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { form_utils_ownKeys(Object(source), true).forEach(function (key) { form_utils_defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { form_utils_ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+function form_ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
 
-function form_utils_defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function form_objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { form_ownKeys(Object(source), true).forEach(function (key) { form_defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { form_ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
 
-const formActions = {
-  REGISTER_FORM: 'REGISTER_FORM',
-  DE_REGISTER_FORM: 'DE_REGISTER_FORM',
-  REGISTER: 'REGISTER',
-  DE_REGISTER: 'DEREGISTER',
-  SET_VALUE: 'SET_VALUE',
-  SET_VALIDITY: 'SET_VALIDITY',
-  SET_STATE: 'SET_STATE',
-  SET_SUBMITTED: 'SET_SUBMITTED',
-  SET_PERSIST_FORM_DATA: 'SET_PERSIST_FORM_DATA'
-};
-const {
-  REGISTER_FORM,
-  DE_REGISTER_FORM,
-  REGISTER,
-  DE_REGISTER,
-  SET_VALUE,
-  SET_VALIDITY,
-  SET_STATE,
-  SET_SUBMITTED,
-  SET_PERSIST_FORM_DATA
-} = formActions;
-const getValidator = (fn, errorText, compareValue = null) => ({
-  fn,
-  errorText,
-  compareValue
-});
-const formReducer = (state, action) => {
-  const {
-    formId,
-    name,
-    controlId,
-    value,
-    data,
-    validity,
-    errorText,
-    hasSubmitted,
-    persistData
-  } = action;
+function form_defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 
-  const setControls = controls => form_utils_objectSpread(form_utils_objectSpread({}, state), {}, {
-    [formId]: form_utils_objectSpread(form_utils_objectSpread({}, state[formId]), {}, {
-      controls: form_utils_objectSpread(form_utils_objectSpread({}, state[formId].controls), controls)
-    })
-  });
+function form_objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = form_objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
 
-  switch (action.type) {
-    case REGISTER_FORM:
-      return form_utils_objectSpread({
-        [formId]: {
-          controls: {},
-          validity: true,
-          hasSubmitted: false,
-          persistData: false
-        }
-      }, state);
-
-    case DE_REGISTER_FORM:
-      const removedFormState = form_utils_objectSpread({}, state);
-
-      delete removedFormState[formId];
-      return removedFormState;
-
-    case REGISTER:
-      const {
-        value: existingValue,
-        validity: existingValidity,
-        errorText: existingErrorText
-      } = state[formId].controls[name] || {};
-      return setControls({
-        [name]: {
-          controlId,
-          value: existingValue || value,
-          validity: existingValidity !== false,
-          errorText: existingErrorText || ''
-        }
-      });
-
-    case DE_REGISTER:
-      const relatedForm = state[formId];
-
-      if (!relatedForm) {
-        return state;
-      }
-
-      const newControls = form_utils_objectSpread({}, relatedForm.controls);
-
-      delete newControls[action.name];
-      return form_utils_objectSpread(form_utils_objectSpread({}, state), {}, {
-        [formId]: form_utils_objectSpread(form_utils_objectSpread({}, relatedForm), {}, {
-          controls: newControls
-        })
-      });
-
-    case SET_VALUE:
-      return setControls({
-        [name]: form_utils_objectSpread(form_utils_objectSpread({}, state[formId].controls[name]), {}, {
-          value
-        })
-      });
-
-    case SET_VALIDITY:
-      const newControlValidities = form_utils_objectSpread(form_utils_objectSpread({}, state[formId].controls), {}, {
-        [name]: form_utils_objectSpread(form_utils_objectSpread({}, state[formId].controls[name]), {}, {
-          validity,
-          errorText
-        })
-      });
-
-      return form_utils_objectSpread(form_utils_objectSpread({}, state), {}, {
-        [formId]: form_utils_objectSpread(form_utils_objectSpread({}, state[formId]), {}, {
-          controls: newControlValidities,
-          validity: Object.keys(newControlValidities).map(key => newControlValidities[key].validity).every(v => v)
-        })
-      });
-
-    case SET_STATE:
-      return form_utils_objectSpread(form_utils_objectSpread({}, state), {}, {
-        [formId]: form_utils_objectSpread(form_utils_objectSpread({}, state[formId]), {}, {
-          controls: Object.keys(data).reduce((acc, key) => {
-            return form_utils_objectSpread(form_utils_objectSpread({}, acc), {}, {
-              [key]: form_utils_objectSpread(form_utils_objectSpread({}, state[formId].controls[key]), {}, {
-                value: data[key],
-                validity: true,
-                errorText: ''
-              })
-            });
-          }, form_utils_objectSpread({}, state.controls))
-        })
-      });
-
-    case SET_SUBMITTED:
-      return form_utils_objectSpread(form_utils_objectSpread({}, state), {}, {
-        [formId]: form_utils_objectSpread(form_utils_objectSpread({}, state[formId]), {}, {
-          hasSubmitted
-        })
-      });
-
-    case SET_PERSIST_FORM_DATA:
-      return form_utils_objectSpread(form_utils_objectSpread({}, state), {}, {
-        [formId]: form_utils_objectSpread(form_utils_objectSpread({}, state[formId]), {}, {
-          persistData
-        })
-      });
-
-    default:
-      return state;
-  }
-};
-;// CONCATENATED MODULE: ./src/javascripts/ui/utils/validations.js
-const validateFileSize = (fileList, maxSize) => {
-  let isValid = true;
-
-  for (let i = 0; i < fileList.length; i++) {
-    if (fileList[i].size > maxSize) {
-      isValid = false;
-    }
-  }
-
-  return isValid;
-};
-const fileListObjectIsNotEmpty = fileListObj => !!(fileListObj !== null && fileListObj !== void 0 && fileListObj.length) > 0;
-/* eslint-disable no-control-regex */
-
-const isEmailString = val => {
-  const regex = /^(?:[a-z0-9!#$%&'*+/=?^_`{|}~-]+(?:\.[a-z0-9!#$%&'*+/=?^_`{|}~-]+)*|"(?:[\x01-\x08\x0b\x0c\x0e-\x1f\x21\x23-\x5b\x5d-\x7f]|\\[\x01-\x09\x0b\x0c\x0e-\x7f])*")@(?:(?:[a-z0-9](?:[a-z0-9-]*[a-z0-9])?\.)+[a-z0-9](?:[a-z0-9-]*[a-z0-9])?|\[(?:(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.){3}(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?|[a-z0-9-]*[a-z0-9]:(?:[\x01-\x08\x0b\x0c\x0e-\x1f\x21-\x5a\x53-\x7f]|\\[\x01-\x09\x0b\x0c\x0e-\x7f])+)\])$/i;
-  const trimmedVal = val && val.trim();
-  return !!(trimmedVal && trimmedVal.match(regex));
-};
-/* eslint-enable no-control-regex */
-
-const isNotEmptyString = val => !!val;
-;// CONCATENATED MODULE: ./src/javascripts/ui/components/form-controls/form.js
-const form_excluded = ["className", "disableValidationClasses"];
-
-function form_ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
-
-function form_objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { form_ownKeys(Object(source), true).forEach(function (key) { form_defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { form_ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
-
-function form_defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-
-function form_objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = form_objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
-
-function form_objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+function form_objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 
 
 
@@ -13195,52 +13036,231 @@ function TranslationsOptionsDialogForm({
   const languageName = (0,hooks_namespaceObject.useMemo)(() => {
     var _languages$find;
 
-    return languages === null || languages === void 0 ? void 0 : (_languages$find = languages.find(lang => lang.locale === currentLocale)) === null || _languages$find === void 0 ? void 0 : _languages$find.nativeName;
-  }, [languages, currentLocale]);
-  const options = (0,hooks_namespaceObject.useMemo)(() => {
-    return [{
-      value: '',
-      label: t('translations.settings.defaultOptionLabel')
-    }, ...languages.filter(language => language.locale.toLowerCase() !== String(uiLocale).toLowerCase()).map(language => ({
-      value: language.locale,
-      label: language.nativeName
-    }))];
-  }, [t, languages, uiLocale]);
-  return (0,jsx_runtime_namespaceObject.jsxs)(form_controls_form, {
-    noValidate: "true",
-    className: css_className('options__form'),
-    children: [(0,jsx_runtime_namespaceObject.jsx)("p", {
-      className: css_className('options__description'),
-      id: descriptionId,
-      children: t('translations.settings.description')
-    }), isActive ? (0,jsx_runtime_namespaceObject.jsxs)(jsx_runtime_namespaceObject.Fragment, {
-      children: [(0,jsx_runtime_namespaceObject.jsx)("h3", {
-        children: t('translations.settings.currentTranslationLabel')
-      }), (0,jsx_runtime_namespaceObject.jsx)("p", {
-        className: css_className('options__active-language'),
-        children: languageName
-      })]
-    }) : (0,jsx_runtime_namespaceObject.jsx)(form_controls_select, {
-      name: controlName,
-      type: "text",
-      className: css_className('input__select'),
-      "aria-describedby": descriptionId,
-      labelClass: css_className('label'),
-      labelText: t('translations.settings.inputLabel'),
-      options: options,
-      defaultValue: currentLocale || ''
-    }), (0,jsx_runtime_namespaceObject.jsx)("div", {
-      className: css_className('options__actions'),
-      children: (0,jsx_runtime_namespaceObject.jsx)("button", {
-        type: "submit",
-        className: css_className('button', 'button--primary', 'options__submit'),
-        children: isActive ? t('translations.settings.endButtonText') : t('translations.settings.startButtonText')
-      })
-    })]
-  });
-}
+    return languages === null || languages === void 0 ? void 0 : (_languages$find = languages.find(lang => lang.locale === currentLocale)) === null || _languages$find === void 0 ? void 0 : _languages$find.nativeName;
+  }, [languages, currentLocale]);
+  const options = (0,hooks_namespaceObject.useMemo)(() => {
+    return [{
+      value: '',
+      label: t('translations.settings.defaultOptionLabel')
+    }, ...languages.filter(language => language.locale.toLowerCase() !== String(uiLocale).toLowerCase()).map(language => ({
+      value: language.locale,
+      label: language.nativeName
+    }))];
+  }, [t, languages, uiLocale]);
+  return (0,jsx_runtime_namespaceObject.jsxs)(form_controls_form, {
+    noValidate: "true",
+    className: css_className('options__form'),
+    children: [(0,jsx_runtime_namespaceObject.jsx)("p", {
+      className: css_className('options__description'),
+      id: descriptionId,
+      children: t('translations.settings.description')
+    }), isActive ? (0,jsx_runtime_namespaceObject.jsxs)(jsx_runtime_namespaceObject.Fragment, {
+      children: [(0,jsx_runtime_namespaceObject.jsx)("h3", {
+        children: t('translations.settings.currentTranslationLabel')
+      }), (0,jsx_runtime_namespaceObject.jsx)("p", {
+        className: css_className('options__active-language'),
+        children: languageName
+      })]
+    }) : (0,jsx_runtime_namespaceObject.jsx)(form_controls_select, {
+      name: controlName,
+      type: "text",
+      className: css_className('input__select'),
+      "aria-describedby": descriptionId,
+      labelClass: css_className('label'),
+      labelText: t('translations.settings.inputLabel'),
+      options: options,
+      defaultValue: currentLocale || ''
+    }), (0,jsx_runtime_namespaceObject.jsx)("div", {
+      className: css_className('options__actions'),
+      children: (0,jsx_runtime_namespaceObject.jsx)("button", {
+        type: "submit",
+        className: css_className('button', 'button--primary', 'options__submit'),
+        children: isActive ? t('translations.settings.endButtonText') : t('translations.settings.startButtonText')
+      })
+    })]
+  });
+}
+
+/* harmony default export */ const options_dialog_form = (TranslationsOptionsDialogForm);
+;// CONCATENATED MODULE: ./src/javascripts/ui/utils/form-utils.js
+function form_utils_ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+
+function form_utils_objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { form_utils_ownKeys(Object(source), true).forEach(function (key) { form_utils_defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { form_utils_ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+
+function form_utils_defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
+const formActions = {
+  REGISTER_FORM: 'REGISTER_FORM',
+  DE_REGISTER_FORM: 'DE_REGISTER_FORM',
+  REGISTER: 'REGISTER',
+  DE_REGISTER: 'DEREGISTER',
+  SET_VALUE: 'SET_VALUE',
+  SET_VALIDITY: 'SET_VALIDITY',
+  SET_STATE: 'SET_STATE',
+  SET_SUBMITTED: 'SET_SUBMITTED',
+  SET_PERSIST_FORM_DATA: 'SET_PERSIST_FORM_DATA'
+};
+const {
+  REGISTER_FORM,
+  DE_REGISTER_FORM,
+  REGISTER,
+  DE_REGISTER,
+  SET_VALUE,
+  SET_VALIDITY,
+  SET_STATE,
+  SET_SUBMITTED,
+  SET_PERSIST_FORM_DATA
+} = formActions;
+const getValidator = (fn, errorText, compareValue = null) => ({
+  fn,
+  errorText,
+  compareValue
+});
+const formReducer = (state, action) => {
+  const {
+    formId,
+    name,
+    controlId,
+    value,
+    data,
+    validity,
+    errorText,
+    hasSubmitted,
+    persistData
+  } = action;
+
+  const setControls = controls => form_utils_objectSpread(form_utils_objectSpread({}, state), {}, {
+    [formId]: form_utils_objectSpread(form_utils_objectSpread({}, state[formId]), {}, {
+      controls: form_utils_objectSpread(form_utils_objectSpread({}, state[formId].controls), controls)
+    })
+  });
+
+  switch (action.type) {
+    case REGISTER_FORM:
+      return form_utils_objectSpread({
+        [formId]: {
+          controls: {},
+          validity: true,
+          hasSubmitted: false,
+          persistData: false
+        }
+      }, state);
+
+    case DE_REGISTER_FORM:
+      const removedFormState = form_utils_objectSpread({}, state);
+
+      delete removedFormState[formId];
+      return removedFormState;
+
+    case REGISTER:
+      const {
+        value: existingValue,
+        validity: existingValidity,
+        errorText: existingErrorText
+      } = state[formId].controls[name] || {};
+      return setControls({
+        [name]: {
+          controlId,
+          value: existingValue || value,
+          validity: existingValidity !== false,
+          errorText: existingErrorText || ''
+        }
+      });
+
+    case DE_REGISTER:
+      const relatedForm = state[formId];
+
+      if (!relatedForm) {
+        return state;
+      }
+
+      const newControls = form_utils_objectSpread({}, relatedForm.controls);
+
+      delete newControls[action.name];
+      return form_utils_objectSpread(form_utils_objectSpread({}, state), {}, {
+        [formId]: form_utils_objectSpread(form_utils_objectSpread({}, relatedForm), {}, {
+          controls: newControls
+        })
+      });
+
+    case SET_VALUE:
+      return setControls({
+        [name]: form_utils_objectSpread(form_utils_objectSpread({}, state[formId].controls[name]), {}, {
+          value
+        })
+      });
+
+    case SET_VALIDITY:
+      const newControlValidities = form_utils_objectSpread(form_utils_objectSpread({}, state[formId].controls), {}, {
+        [name]: form_utils_objectSpread(form_utils_objectSpread({}, state[formId].controls[name]), {}, {
+          validity,
+          errorText
+        })
+      });
+
+      return form_utils_objectSpread(form_utils_objectSpread({}, state), {}, {
+        [formId]: form_utils_objectSpread(form_utils_objectSpread({}, state[formId]), {}, {
+          controls: newControlValidities,
+          validity: Object.keys(newControlValidities).map(key => newControlValidities[key].validity).every(v => v)
+        })
+      });
+
+    case SET_STATE:
+      return form_utils_objectSpread(form_utils_objectSpread({}, state), {}, {
+        [formId]: form_utils_objectSpread(form_utils_objectSpread({}, state[formId]), {}, {
+          controls: Object.keys(data).reduce((acc, key) => {
+            return form_utils_objectSpread(form_utils_objectSpread({}, acc), {}, {
+              [key]: form_utils_objectSpread(form_utils_objectSpread({}, state[formId].controls[key]), {}, {
+                value: data[key],
+                validity: true,
+                errorText: ''
+              })
+            });
+          }, form_utils_objectSpread({}, state.controls))
+        })
+      });
+
+    case SET_SUBMITTED:
+      return form_utils_objectSpread(form_utils_objectSpread({}, state), {}, {
+        [formId]: form_utils_objectSpread(form_utils_objectSpread({}, state[formId]), {}, {
+          hasSubmitted
+        })
+      });
+
+    case SET_PERSIST_FORM_DATA:
+      return form_utils_objectSpread(form_utils_objectSpread({}, state), {}, {
+        [formId]: form_utils_objectSpread(form_utils_objectSpread({}, state[formId]), {}, {
+          persistData
+        })
+      });
+
+    default:
+      return state;
+  }
+};
+;// CONCATENATED MODULE: ./src/javascripts/ui/utils/validations.js
+const validateFileSize = (fileList, maxSize) => {
+  let isValid = true;
+
+  for (let i = 0; i < fileList.length; i++) {
+    if (fileList[i].size > maxSize) {
+      isValid = false;
+    }
+  }
+
+  return isValid;
+};
+const fileListObjectIsNotEmpty = fileListObj => !!(fileListObj !== null && fileListObj !== void 0 && fileListObj.length) > 0;
+/* eslint-disable no-control-regex */
 
-/* harmony default export */ const options_dialog_form = (TranslationsOptionsDialogForm);
+const isEmailString = val => {
+  const regex = /^(?:[a-z0-9!#$%&'*+/=?^_`{|}~-]+(?:\.[a-z0-9!#$%&'*+/=?^_`{|}~-]+)*|"(?:[\x01-\x08\x0b\x0c\x0e-\x1f\x21\x23-\x5b\x5d-\x7f]|\\[\x01-\x09\x0b\x0c\x0e-\x7f])*")@(?:(?:[a-z0-9](?:[a-z0-9-]*[a-z0-9])?\.)+[a-z0-9](?:[a-z0-9-]*[a-z0-9])?|\[(?:(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.){3}(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?|[a-z0-9-]*[a-z0-9]:(?:[\x01-\x08\x0b\x0c\x0e-\x1f\x21-\x5a\x53-\x7f]|\\[\x01-\x09\x0b\x0c\x0e-\x7f])+)\])$/i;
+  const trimmedVal = val && val.trim();
+  return !!(trimmedVal && trimmedVal.match(regex));
+};
+/* eslint-enable no-control-regex */
+
+const isNotEmptyString = val => !!val;
 ;// CONCATENATED MODULE: ./src/javascripts/domains/translations/components/options-dialog/index.js
 
 
@@ -13858,36 +13878,6 @@ const Interrupt = ({
 };
 
 /* harmony default export */ const interrupt = (Interrupt);
-;// CONCATENATED MODULE: ./src/javascripts/ui/components/layout/privacy-disclaimer.js
-
-
-
-
-
-
-const PrivacyDisclaimer = () => {
-  const {
-    t
-  } = useI18n();
-  const {
-    showDisclaimer
-  } = useConfig();
-  return showDisclaimer && (0,jsx_runtime_namespaceObject.jsxs)("div", {
-    className: css_className('disclaimer'),
-    tabIndex: "0",
-    children: [(0,jsx_runtime_namespaceObject.jsx)("h2", {
-      className: css_className('disclaimer__title'),
-      children: t('disclaimer.title')
-    }), (0,jsx_runtime_namespaceObject.jsx)("div", {
-      className: css_className('disclaimer__message'),
-      dangerouslySetInnerHTML: {
-        __html: t('disclaimer.content')
-      }
-    })]
-  });
-};
-
-/* harmony default export */ const privacy_disclaimer = (PrivacyDisclaimer);
 ;// CONCATENATED MODULE: ./src/javascripts/ui/components/conversation/component-context.js
 
 const ComponentContext = (0,external_preact_namespaceObject.createContext)({});
@@ -19527,7 +19517,7 @@ const Participant = ({
   const avatar = participant.avatar || (agent === null || agent === void 0 ? void 0 : agent.avatar);
   return (0,jsx_runtime_namespaceObject.jsx)(EventDivider, {
     graphicSrc: avatar,
-    graphicType: participant.avatar ? 'avatar' : undefined,
+    graphicType: avatar ? 'avatar' : undefined,
     iconName: !avatar ? 'balloon' : undefined,
     childrenHTML: intro,
     dividerType: "participant"
@@ -19713,6 +19703,94 @@ const Cta = ({
 };
 
 /* harmony default export */ const cta = (Cta);
+;// CONCATENATED MODULE: ./src/javascripts/ui/components/conversation/event/carousel-component/components/pagination.js
+
+
+
+function CarouselPagination({
+  items,
+  currentIndex,
+  onChange,
+  getItemKey,
+  getItemLabel
+}) {
+  const itemCount = items.length;
+  const handlePaginate = (0,hooks_namespaceObject.useCallback)(event => {
+    const slideIndex = Number(event.target.dataset.item || '0');
+    const nextIndex = Math.min(itemCount - 1, Math.max(0, slideIndex));
+
+    if (nextIndex !== currentIndex) {
+      onChange(nextIndex);
+    }
+  }, [itemCount, currentIndex, onChange]);
+  return (0,jsx_runtime_namespaceObject.jsx)("div", {
+    className: css_className('carousel-pagination__wrapper'),
+    role: "group",
+    children: (0,jsx_runtime_namespaceObject.jsx)("ul", {
+      className: css_className('carousel-pagination'),
+      children: items.map((item, idx) => {
+        const isActive = currentIndex === idx;
+        return (0,jsx_runtime_namespaceObject.jsx)("li", {
+          className: css_className('carousel-pagination__item', isActive ? 'is-active' : undefined),
+          children: (0,jsx_runtime_namespaceObject.jsx)("button", {
+            className: css_className('carousel-pagination__button'),
+            type: "button",
+            onClick: handlePaginate,
+            "data-item": idx,
+            "aria-disabled": isActive ? 'true' : undefined,
+            "aria-label": getItemLabel(item, idx)
+          })
+        }, getItemKey(item, idx, 'pagination-item-'));
+      })
+    })
+  });
+}
+;// CONCATENATED MODULE: ./src/javascripts/ui/components/conversation/event/carousel-component/components/controls.js
+
+
+
+
+
+function CarouselControls({
+  items,
+  currentIndex,
+  onChange,
+  children
+}) {
+  const {
+    t
+  } = useI18n();
+  const itemCount = items.length;
+
+  const handlePrevious = () => {
+    onChange((currentIndex - 1 + itemCount) % itemCount);
+  };
+
+  const handleNext = () => {
+    onChange((currentIndex + 1) % itemCount);
+  };
+
+  return (0,jsx_runtime_namespaceObject.jsxs)("div", {
+    className: css_className('carousel-controls'),
+    children: [(0,jsx_runtime_namespaceObject.jsx)("button", {
+      className: css_className('button', 'button--previous'),
+      "aria-label": t('carousel.controls.previous'),
+      onClick: handlePrevious,
+      children: (0,jsx_runtime_namespaceObject.jsx)(icon, {
+        name: "arrowLeft",
+        size: "16"
+      })
+    }), children, (0,jsx_runtime_namespaceObject.jsx)("button", {
+      className: css_className('button', 'button--next'),
+      "aria-label": t('carousel.controls.next'),
+      onClick: handleNext,
+      children: (0,jsx_runtime_namespaceObject.jsx)(icon, {
+        name: "arrowRight",
+        size: "16"
+      })
+    })]
+  });
+}
 ;// CONCATENATED MODULE: ./src/javascripts/ui/components/conversation/event/card-component.js
 function card_component_ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
 
@@ -19819,133 +19897,45 @@ const CardComponent = ({
         className: css_className('button', 'button--primary'),
         "aria-describedby": descriptionId
       }, actionProps), {}, {
-        children: buttonText
-      }))]
-    })]
-  });
-};
-
-/* harmony default export */ const card_component = (CardComponent);
-;// CONCATENATED MODULE: ./src/javascripts/ui/components/conversation/event/carousel-message/components/slide.js
-function slide_ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
-
-function slide_objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { slide_ownKeys(Object(source), true).forEach(function (key) { slide_defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { slide_ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
-
-function slide_defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-
-
-
-
-
-function CarouselMessageSlide({
-  item: slide,
-  items,
-  index,
-  isActive
-}) {
-  const {
-    t
-  } = useI18n();
-  return (0,jsx_runtime_namespaceObject.jsx)("div", {
-    className: css_className('carousel-item', `carousel-item--${slide.type}`),
-    role: "group",
-    "aria-roledescription": "slide",
-    "aria-label": t('carousel.slide.label', {
-      index: index + 1,
-      total: items.length
-    }),
-    children: (0,jsx_runtime_namespaceObject.jsx)(card_component, slide_objectSpread(slide_objectSpread({}, slide), {}, {
-      isCarouselItem: true,
-      hasFocus: isActive
-    }))
-  });
-}
-;// CONCATENATED MODULE: ./src/javascripts/ui/components/conversation/event/carousel-component/components/pagination.js
-
-
-
-function CarouselPagination({
-  items,
-  currentIndex,
-  onChange,
-  getItemKey,
-  getItemLabel
-}) {
-  const itemCount = items.length;
-  const handlePaginate = (0,hooks_namespaceObject.useCallback)(event => {
-    const slideIndex = Number(event.target.dataset.item || '0');
-    const nextIndex = Math.min(itemCount - 1, Math.max(0, slideIndex));
-
-    if (nextIndex !== currentIndex) {
-      onChange(nextIndex);
-    }
-  }, [itemCount, currentIndex, onChange]);
-  return (0,jsx_runtime_namespaceObject.jsx)("div", {
-    className: css_className('carousel-pagination__wrapper'),
-    role: "group",
-    children: (0,jsx_runtime_namespaceObject.jsx)("ul", {
-      className: css_className('carousel-pagination'),
-      children: items.map((item, idx) => {
-        const isActive = currentIndex === idx;
-        return (0,jsx_runtime_namespaceObject.jsx)("li", {
-          className: css_className('carousel-pagination__item', isActive ? 'is-active' : undefined),
-          children: (0,jsx_runtime_namespaceObject.jsx)("button", {
-            className: css_className('carousel-pagination__button'),
-            type: "button",
-            onClick: handlePaginate,
-            "data-item": idx,
-            "aria-disabled": isActive ? 'true' : undefined,
-            "aria-label": getItemLabel(item, idx)
-          })
-        }, getItemKey(item, idx, 'pagination-item-'));
-      })
-    })
+        children: buttonText
+      }))]
+    })]
   });
-}
-;// CONCATENATED MODULE: ./src/javascripts/ui/components/conversation/event/carousel-component/components/controls.js
+};
+
+/* harmony default export */ const card_component = (CardComponent);
+;// CONCATENATED MODULE: ./src/javascripts/ui/components/conversation/event/carousel-message/components/slide.js
+function slide_ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+
+function slide_objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { slide_ownKeys(Object(source), true).forEach(function (key) { slide_defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { slide_ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
 
+function slide_defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 
 
 
 
-function CarouselControls({
+
+function CarouselMessageSlide({
+  item: slide,
   items,
-  currentIndex,
-  onChange,
-  children
+  index,
+  isActive
 }) {
   const {
     t
   } = useI18n();
-  const itemCount = items.length;
-
-  const handlePrevious = () => {
-    onChange((currentIndex - 1 + itemCount) % itemCount);
-  };
-
-  const handleNext = () => {
-    onChange((currentIndex + 1) % itemCount);
-  };
-
-  return (0,jsx_runtime_namespaceObject.jsxs)("div", {
-    className: css_className('carousel-controls'),
-    children: [(0,jsx_runtime_namespaceObject.jsx)("button", {
-      className: css_className('button', 'button--previous'),
-      "aria-label": t('carousel.controls.previous'),
-      onClick: handlePrevious,
-      children: (0,jsx_runtime_namespaceObject.jsx)(icon, {
-        name: "arrowLeft",
-        size: "16"
-      })
-    }), children, (0,jsx_runtime_namespaceObject.jsx)("button", {
-      className: css_className('button', 'button--next'),
-      "aria-label": t('carousel.controls.next'),
-      onClick: handleNext,
-      children: (0,jsx_runtime_namespaceObject.jsx)(icon, {
-        name: "arrowRight",
-        size: "16"
-      })
-    })]
+  return (0,jsx_runtime_namespaceObject.jsx)("div", {
+    className: css_className('carousel-item', `carousel-item--${slide.type}`),
+    role: "group",
+    "aria-roledescription": "slide",
+    "aria-label": t('carousel.slide.label', {
+      index: index + 1,
+      total: items.length
+    }),
+    children: (0,jsx_runtime_namespaceObject.jsx)(card_component, slide_objectSpread(slide_objectSpread({}, slide), {}, {
+      isCarouselItem: true,
+      hasFocus: isActive
+    }))
   });
 }
 ;// CONCATENATED MODULE: ./src/javascripts/ui/components/conversation/event/carousel-component/index.js
@@ -20289,6 +20279,36 @@ const ComponentFilter = ({
 };
 
 /* harmony default export */ const component_filter = (ComponentFilter);
+;// CONCATENATED MODULE: ./src/javascripts/ui/components/layout/privacy-disclaimer.js
+
+
+
+
+
+
+const PrivacyDisclaimer = () => {
+  const {
+    t
+  } = useI18n();
+  const {
+    showDisclaimer
+  } = useConfig();
+  return showDisclaimer && (0,jsx_runtime_namespaceObject.jsxs)("div", {
+    className: css_className('disclaimer'),
+    tabIndex: "0",
+    children: [(0,jsx_runtime_namespaceObject.jsx)("h2", {
+      className: css_className('disclaimer__title'),
+      children: t('disclaimer.title')
+    }), (0,jsx_runtime_namespaceObject.jsx)("div", {
+      className: css_className('disclaimer__message'),
+      dangerouslySetInnerHTML: {
+        __html: t('disclaimer.content')
+      }
+    })]
+  });
+};
+
+/* harmony default export */ const privacy_disclaimer = (PrivacyDisclaimer);
 ;// CONCATENATED MODULE: ./src/javascripts/ui/components/conversation/conversation.js
 
 
@@ -22217,53 +22237,6 @@ const View = () => {
 };
 
 /* harmony default export */ const view = (View);
-;// CONCATENATED MODULE: ./src/javascripts/domains/errors/index.js
-
-
-const {
-  createAction: errors_createAction
-} = createDomain('errors');
-const catchError = errors_createAction('catch-error', error => ({
-  error
-}));
-function errors_createMiddleware({
-  api: seamlyApi
-}) {
-  return ({
-    getState
-  }) => {
-    const handleError = action => {
-      const {
-        errorCallback,
-        namespace,
-        api,
-        layoutMode
-      } = selectConfig(getState());
-      errorCallback === null || errorCallback === void 0 ? void 0 : errorCallback(action.error, {
-        namespace,
-        api,
-        layoutMode,
-        conversationUrl: seamlyApi.getConversationUrl(),
-        action: action.type ? action : undefined
-      });
-    };
-
-    return next => action => {
-      try {
-        if (action.error) {
-          handleError(action);
-        }
-
-        return next(action);
-      } catch (error) {
-        handleError({
-          error
-        });
-        throw error;
-      }
-    };
-  };
-}
 ;// CONCATENATED MODULE: ./src/javascripts/ui/components/core/seamly-instance-functions-loader.js
 
 
@@ -23138,6 +23111,53 @@ const SeamlyFileUpload = ({
 };
 
 /* harmony default export */ const seamly_file_upload = (SeamlyFileUpload);
+;// CONCATENATED MODULE: ./src/javascripts/domains/errors/index.js
+
+
+const {
+  createAction: errors_createAction
+} = createDomain('errors');
+const catchError = errors_createAction('catch-error', error => ({
+  error
+}));
+function errors_createMiddleware({
+  api: seamlyApi
+}) {
+  return ({
+    getState
+  }) => {
+    const handleError = action => {
+      const {
+        errorCallback,
+        namespace,
+        api,
+        layoutMode
+      } = selectConfig(getState());
+      errorCallback === null || errorCallback === void 0 ? void 0 : errorCallback(action.error, {
+        namespace,
+        api,
+        layoutMode,
+        conversationUrl: seamlyApi.getConversationUrl(),
+        action: action.type ? action : undefined
+      });
+    };
+
+    return next => action => {
+      try {
+        if (action.error) {
+          handleError(action);
+        }
+
+        return next(action);
+      } catch (error) {
+        handleError({
+          error
+        });
+        throw error;
+      }
+    };
+  };
+}
 ;// CONCATENATED MODULE: ./src/javascripts/ui/components/core/seamly-core.js
 
 
@@ -23242,34 +23262,6 @@ function objectStore(key, storageProvider) {
 
   };
 }
-;// CONCATENATED MODULE: ./src/javascripts/lib/store/providers/session-storage.js
-function store(key) {
-  const KEY = 'cvco.' + key;
-  return {
-    get() {
-      const candidates = [KEY, KEY.split('.').slice(0, -1).join('.')];
-      let val;
-
-      do {
-        val = sessionStorage.getItem(candidates[0]);
-      } while (candidates.shift() && !val);
-
-      return JSON.parse(val);
-    },
-
-    set(value) {
-      if (!value) {
-        return;
-      }
-
-      sessionStorage.setItem(KEY, JSON.stringify(value));
-    }
-
-  };
-}
-// EXTERNAL MODULE: ./src/javascripts/lib/debug.js
-var debug = __webpack_require__(905);
-var debug_default = /*#__PURE__*/__webpack_require__.n(debug);
 ;// CONCATENATED MODULE: ./node_modules/phoenix/priv/static/phoenix.esm.js
 // js/phoenix/utils.js
 var closure = value => {
@@ -24664,6 +24656,9 @@ const splitUrlParams = url => {
 };
 
 /* harmony default export */ const split_url_params = (splitUrlParams);
+// EXTERNAL MODULE: ./src/javascripts/lib/debug.js
+var debug = __webpack_require__(905);
+var debug_default = /*#__PURE__*/__webpack_require__.n(debug);
 ;// CONCATENATED MODULE: ./src/javascripts/api/producer.js
 function producer_ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
 
@@ -24826,6 +24821,31 @@ class ConversationProducer {
   }
 
 }
+;// CONCATENATED MODULE: ./src/javascripts/lib/store/providers/session-storage.js
+function store(key) {
+  const KEY = 'cvco.' + key;
+  return {
+    get() {
+      const candidates = [KEY, KEY.split('.').slice(0, -1).join('.')];
+      let val;
+
+      do {
+        val = sessionStorage.getItem(candidates[0]);
+      } while (candidates.shift() && !val);
+
+      return JSON.parse(val);
+    },
+
+    set(value) {
+      if (!value) {
+        return;
+      }
+
+      sessionStorage.setItem(KEY, JSON.stringify(value));
+    }
+
+  };
+}
 ;// CONCATENATED MODULE: ./src/javascripts/api/event-producer.js
 class EventProducer {
   constructor(name) {
@@ -24936,10 +24956,11 @@ class API {
    * @param {boolean} config.sendEnvironment
    * @param {string} layoutMode
    * @param {string} namespace
-   * @param {Object} [context={ channelName: undefined, variables: undefined, locale: undefined }]
+   * @param {Object} [context={ channelName: undefined, variables: undefined, locale: undefined, translationLocale: undefined }]
    * @param {string} context.channelName
    * @param {object} context.variables
    * @param {string} context.locale
+   * @param {string} context.translationLocale
    * @memberof API
    */
   constructor({
@@ -25303,9 +25324,9 @@ class API {
 
   getEnvironment() {
     return {
-      clientName: PACKAGE_NAME,
+      clientName: "@seamly/web-ui",
       clientVariant: this.layoutMode,
-      clientVersion: PACKAGE_VERSION,
+      clientVersion: "20.2.0-alpha.3",
       currentUrl: window.location.toString(),
       screenResolution: `${window.screen.width}x${window.screen.height}`,
       timezone: getTimeZone(),
@@ -25622,6 +25643,7 @@ class ExternalApi {
     this._waitingActions = [];
     this._instances = {};
     this.appConfig = appConfig;
+    this.context = {};
   }
 
   push(...actionObjects) {
@@ -25649,7 +25671,8 @@ class ExternalApi {
           break;
 
         default:
-          if (!this.handleAction(actionObj)) {
+          if (!this.handleAction(actionObj) && // Store context properties for the next instance that will be created
+          !this.setContext(actionObj.action, ...actionObj.args)) {
             this._waitingActions.push(actionObj);
           }
 
@@ -25658,6 +25681,25 @@ class ExternalApi {
     });
   }
 
+  setContext(action, args) {
+    switch (action) {
+      case 'setTranslation':
+        const {
+          enabled,
+          locale
+        } = args;
+
+        if (!!enabled && locale) {
+          this.context.translationLocale = locale;
+        }
+
+        return true;
+
+      default:
+        return false;
+    }
+  }
+
   handleInit(actionObj) {
     const userConfig = this.getUserConfig(...actionObj.args);
     const config = this.getCombinedConfig(userConfig); // if this.appConfig is a function, it might return an invalid configuration (false, null, undefined)
@@ -25679,7 +25721,9 @@ class ExternalApi {
 
     if (config) {
       const instance = this.createInstance(config);
-      this._instances[config.namespace] = instance;
+      this._instances[config.namespace] = instance; // Clear the context after creating the instance, so we do not reuse it for the next
+
+      this.context = {};
       instance.render();
     }
   }
@@ -25743,10 +25787,13 @@ class ExternalApi {
       return this.appConfig(userConfig);
     }
 
+    const context = external_api_objectSpread(external_api_objectSpread({}, userConfig.context || this.appConfig.context), this.context);
+
     const defaults = external_api_objectSpread(external_api_objectSpread({}, this.appConfig.defaults), userConfig.defaults);
 
     return external_api_objectSpread(external_api_objectSpread(external_api_objectSpread({}, this.appConfig), userConfig), {}, {
       api: external_api_objectSpread(external_api_objectSpread({}, this.appConfig.api), userConfig.api),
+      context: Object.keys(context).length ? context : undefined,
       defaults: Object.keys(defaults).length ? defaults : undefined
     });
   }