@seamly/web-ui 19.0.0-beta.3 → 19.1.2

package/build/dist/lib/style-guide.js

@@ -48,6 +48,27 @@ const web_ui_namespaceObject = require("@seamly/web-ui");
 const external_preact_namespaceObject = require("preact");
 ;// CONCATENATED MODULE: external "preact/hooks"
 const hooks_namespaceObject = require("preact/hooks");
+;// CONCATENATED MODULE: ./node_modules/redux-thunk/es/index.js
+function createThunkMiddleware(extraArgument) {
+  return function (_ref) {
+    var dispatch = _ref.dispatch,
+        getState = _ref.getState;
+    return function (next) {
+      return function (action) {
+        if (typeof action === 'function') {
+          return action(dispatch, getState, extraArgument);
+        }
+
+        return next(action);
+      };
+    };
+  };
+}
+
+var thunk = createThunkMiddleware();
+thunk.withExtraArgument = createThunkMiddleware;
+
+/* harmony default export */ const es = (thunk);
 ;// CONCATENATED MODULE: ./src/javascripts/lib/id.js
 function id_randomId() {
   return '_' + (Number(String(Math.random()).slice(2)) + Date.now() + Math.round(performance.now())).toString(36);
@@ -145,7 +166,6 @@ const general_utils_millisecondsToSeconds = milliseconds => {
 const microsecondsToMilliseconds = microseconds => {
   return Math.ceil(microseconds / 1000);
 };
-const general_utils_sanitizeText = text => text.replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/"/g, '&quot;').replace(/'/g, '&#39;').replace(/\//g, '&#x2F;');
 const general_utils_getTimeFromSeconds = seconds => {
   const minutes = Math.floor(seconds / 60);
   const secondsPartial = seconds - minutes * 60;
@@ -270,12 +290,6 @@ const entryTypes = {
   text: 'text',
   upload: 'upload'
 };
-const seamly_utils_visibilityStates = {
-  hidden: 'hidden',
-  minimized: 'minimized',
-  open: 'open',
-  initialize: null
-};
 const readStates = {
   received: 'received',
   read: 'read'
@@ -322,7 +336,6 @@ const seamly_utils_seamlyActions = {
   SET_PARTICIPANT: 'SET_PARTICIPANT',
   SET_HEADER_TITLE: 'SET_HEADER_TITLE',
   SET_HEADER_SUB_TITLE: 'SET_HEADER_SUB_TITLE',
-  SET_VISIBILITY: 'SET_VISIBILITY',
   RESET_HISTORY_LOADED_FLAG: 'RESET_HISTORY_LOADED_FLAG',
   SET_ACTIVE_SERVICE: 'SET_ACTIVE_SERVICE',
   INIT_IDLE_DETACH_COUNTDOWN: 'INIT_IDLE_DETACH_COUNTDOWN',
@@ -350,8 +363,6 @@ const seamly_utils_seamlyActions = {
   SET_UPLOAD_ERROR: 'SET_UPLOAD_ERROR',
   CLEAR_UPLOAD: 'CLEAR_UPLOAD',
   CLEAR_ALL_UPLOADS: 'CLEAR_ALL_UPLOADS',
-  RESET_UPLOAD_STATE: 'RESET_UPLOAD_STATE',
-  RESET_ENTRY_STATE: 'RESET_ENTRY_STATE',
   SET_SEAMLY_CONTAINER_ELEMENT: 'SET_SEAMLY_CONTAINER_ELEMENT'
 };
 const cardTypes = {
@@ -370,7 +381,6 @@ const {
   SET_PARTICIPANT,
   SET_HEADER_TITLE,
   SET_HEADER_SUB_TITLE,
-  SET_VISIBILITY,
   RESET_HISTORY_LOADED_FLAG,
   SET_ACTIVE_SERVICE,
   INIT_IDLE_DETACH_COUNTDOWN,
@@ -398,8 +408,6 @@ const {
   SET_UPLOAD_ERROR,
   CLEAR_UPLOAD,
   CLEAR_ALL_UPLOADS,
-  RESET_UPLOAD_STATE,
-  RESET_ENTRY_STATE,
   SET_SEAMLY_CONTAINER_ELEMENT
 } = seamly_utils_seamlyActions;
 const isUnreadMessage = ({
@@ -778,11 +786,6 @@ const seamlyStateReducer = (state, action) => {
         resumeConversationPrompt: false
       });
 
-    case SET_VISIBILITY:
-      return seamly_utils_objectSpread(seamly_utils_objectSpread({}, state), {}, {
-        visible: action.visible
-      });
-
     case SET_PARTICIPANT:
     case CLEAR_PARTICIPANTS:
       return seamly_utils_objectSpread(seamly_utils_objectSpread({}, state), {}, {
@@ -990,26 +993,6 @@ const seamlyStateReducer = (state, action) => {
         currentUploads: []
       });
 
-    case RESET_UPLOAD_STATE:
-      return seamly_utils_objectSpread(seamly_utils_objectSpread({}, state), {}, {
-        showFileUpload: false,
-        currentUploads: []
-      });
-
-    case RESET_ENTRY_STATE:
-      {
-        return seamly_utils_objectSpread(seamly_utils_objectSpread({}, state), {}, {
-          entryMeta: {
-            default: payloadTypes.text,
-            active: payloadTypes.text,
-            userSelected: null,
-            blockAutoEntrySwitch: false,
-            options: {},
-            optionsOverride: {}
-          }
-        });
-      }
-
     case SET_SEAMLY_CONTAINER_ELEMENT:
       {
         return seamly_utils_objectSpread(seamly_utils_objectSpread({}, state), {}, {
@@ -1021,81 +1004,6 @@ const seamlyStateReducer = (state, action) => {
       return state;
   }
 };
-const seamly_utils_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 !== seamly_utils_visibilityStates.open) {
-    return hasResponded ? requestedVisibility || previousVisibility || seamly_utils_visibilityStates.open : seamly_utils_visibilityStates.hidden;
-  }
-
-  const baseVisibility = layoutMode === 'inline' ? seamly_utils_visibilityStates.open : seamly_utils_visibilityStates.minimized;
-  return requestedVisibility || previousVisibility || defaultVisibility || baseVisibility;
-};
-;// CONCATENATED MODULE: ./src/javascripts/domains/store/state-reducer.js
-// Legacy state reducer. Do not add new features here but extract/create new reducers as needed
-
-
-const initialState = {
-  events: [],
-  initialState: {},
-  unreadEvents: 0,
-  isLoading: false,
-  idleDetachCountdown: {
-    hasCountdown: false,
-    isActive: false
-  },
-  resumeConversationPrompt: false,
-  visible: seamly_utils_visibilityStates.hidden,
-  serviceInfo: {
-    activeServiceSessionId: ''
-  },
-  participantInfo: {
-    participants: {},
-    currentAgent: ''
-  },
-  headerTitles: {
-    title: null,
-    subTitle: ''
-  },
-  historyLoaded: false,
-  skiplinkTargetId: id_randomId(),
-  optionsButtonId: id_randomId(),
-  cobrowsingContainerId: id_randomId(),
-  headerCollapseButtonId: id_randomId(),
-  serviceData: {},
-  options: {
-    features: {},
-    panelActive: false,
-    optionActive: '',
-    userSelectedOptions: {}
-  },
-  showFileUpload: false,
-  currentUploads: [],
-  entryMeta: {
-    default: entryTypes.text,
-    active: entryTypes.text,
-    userSelected: null,
-    blockAutoEntrySwitch: false,
-    options: {},
-    optionsOverride: {}
-  },
-  seamlyContainerElement: null
-};
-function stateReducer(state = initialState, action) {
-  return seamlyStateReducer(state, action);
-}
 ;// CONCATENATED MODULE: ./src/javascripts/lib/redux-helpers/index.js
 function redux_helpers_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; }
 
@@ -1207,12 +1115,7 @@ function createThunk(type, payloadCreator) {
   });
 }
 function createReducer(domain, handlers = {}, defaultState) {
-  const reducer = (state, action) => {
-    if (state === undefined) {
-      // eslint-disable-next-line no-param-reassign
-      state = defaultState;
-    }
-
+  const reducer = (state = defaultState, action) => {
     const typeReducer = handlers === null || handlers === void 0 ? void 0 : handlers[action === null || action === void 0 ? void 0 : action.type];
     return typeReducer ? typeReducer(state, action) : state;
   };
@@ -1230,63 +1133,22 @@ function createDomain(domain) {
     selectState: state => state[domain]
   };
 }
-;// CONCATENATED MODULE: ./src/javascripts/domains/forms/utils.js
+;// CONCATENATED MODULE: ./src/javascripts/domains/config/utils.js
 
 const {
-  createActions: utils_createActions,
+  createAction: utils_createAction,
+  createThunk: utils_createThunk,
   createReducer: utils_createReducer,
   selectState
-} = createDomain('forms');
-function utils_validate(values, schema = {}) {
-  return Object.entries(schema).reduce((errors, [key, validations]) => {
-    if (validations && !Array.isArray(validations)) {
-      // eslint-disable-next-line no-param-reassign
-      validations = [validations];
-    }
-
-    for (let i = 0; i < ((_validations = validations) === null || _validations === void 0 ? void 0 : _validations.length) ?? 0; i++) {
-      var _validations;
-
-      if (!validations[i].fn(values[key], validations[i].compareValue)) {
-        errors[key] = validations[i].errorText;
-        break;
-      }
-    }
-
-    return errors;
-  }, {});
-}
-;// CONCATENATED MODULE: ./src/javascripts/domains/forms/actions.js
+} = createDomain('config');
+;// CONCATENATED MODULE: ./src/javascripts/domains/config/actions.js
 
-const [registerForm, deregisterForm] = utils_createActions('form', {
-  register: (formId, persistData) => ({
-    formId,
-    persistData
-  }),
-  deregister: formId => ({
-    formId
-  })
-});
-const [registerControl, deregisterControl, updateControlValue, updateControlTouched] = utils_createActions('control', {
-  register: (formId, name) => ({
-    formId,
-    name
-  }),
-  deregister: (formId, name) => ({
-    formId,
-    name
-  }),
-  updateValue: (formId, name, value) => ({
-    formId,
-    name,
-    value
-  }),
-  updateTouched: (formId, name, touched) => ({
-    formId,
-    name,
-    touched
-  })
-});
+const initialize = utils_createAction('initialize', config => ({
+  config
+}));
+const update = utils_createAction('update', config => ({
+  config
+}));
 ;// CONCATENATED MODULE: ./node_modules/reselect/es/index.js
 function defaultEqualityCheck(a, b) {
   return a === b;
@@ -1408,45 +1270,39 @@ function createStructuredSelector(selectors) {
     }, {});
   });
 }
-;// CONCATENATED MODULE: ./src/javascripts/domains/redux/utils.js
-const arrayContentEquals = (a, b) => {
-  if (a === b) {
-    return true;
-  }
+;// CONCATENATED MODULE: ./src/javascripts/domains/visibility/constants.js
+const StoreKey = 'visibility';
+const constants_visibilityStates = {
+  hidden: 'hidden',
+  minimized: 'minimized',
+  open: 'open',
+  initialize: null
+};
+;// CONCATENATED MODULE: ./src/javascripts/domains/config/selectors.js
+function selectors_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; }
 
-  if (!Array.isArray(a) || !Array.isArray(b) || a.length !== b.length) {
-    return false;
-  }
+function selectors_objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { selectors_ownKeys(Object(source), true).forEach(function (key) { selectors_defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { selectors_ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
 
-  return a.every((value, idx) => b[idx] === value);
-};
-const getPropSelector = (propName, orDefault) => (_, props) => props[propName] || orDefault;
-;// CONCATENATED MODULE: ./src/javascripts/domains/forms/selectors.js
+function selectors_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 getState = selectState;
-const selectors_getFormById = createSelector(getState, getPropSelector('formId'), (forms, formId) => forms[formId]);
-const getFormControlsByFormId = createSelector(selectors_getFormById, form => (form === null || form === void 0 ? void 0 : form.controls) || {});
-const selectors_getFormValuesByFormId = createSelector(getFormControlsByFormId, controls => {
-  const valuesObj = {};
-  Object.entries(controls).forEach(([key, {
-    value
-  }]) => {
-    valuesObj[key] = value;
-  });
-  return valuesObj;
-});
-const selectors_getControlValueByName = createSelector(getFormControlsByFormId, getPropSelector('name'), (controls, name) => {
-  var _controls$name;
 
-  return (_controls$name = controls[name]) === null || _controls$name === void 0 ? void 0 : _controls$name.value;
-});
-const selectors_getControlTouchedByName = createSelector(getFormControlsByFormId, getPropSelector('name'), (controls, name) => {
-  var _controls$name2;
+const selectConfig = createSelector(selectState, config => {
+  let newConfig = selectors_objectSpread({
+    visible: (config === null || config === void 0 ? void 0 : config.layoutMode) === 'inline' ? constants_visibilityStates.open : constants_visibilityStates.minimized,
+    appContainerClassNames: config.appContainerClassNames || []
+  }, config);
 
-  return (_controls$name2 = controls[name]) === null || _controls$name2 === void 0 ? void 0 : _controls$name2.touched;
+  if (typeof newConfig.appContainerClassNames === 'function') {
+    newConfig = selectors_objectSpread(selectors_objectSpread({}, newConfig), {}, {
+      appContainerClassNames: newConfig.appContainerClassNames(newConfig)
+    });
+  }
+
+  return newConfig;
 });
+
 ;// CONCATENATED MODULE: ./src/javascripts/domains/redux/context.js
 
 const context_StoreContext = (0,external_preact_namespaceObject.createContext)(undefined);
@@ -1545,1024 +1401,839 @@ const hooks_useSelectorWithProps = function useSelectorWithProps(selector, props
 
 
 
-;// CONCATENATED MODULE: ./src/javascripts/domains/forms/context.js
+;// CONCATENATED MODULE: ./src/javascripts/domains/config/hooks.js
 
-const context_FormContext = (0,external_preact_namespaceObject.createContext)({});
-/* harmony default export */ const forms_context = ((/* unused pure expression or super */ null && (context_FormContext)));
-const {
-  Provider: forms_context_Provider,
-  Consumer: context_Consumer
-} = context_FormContext;
-;// CONCATENATED MODULE: ./src/javascripts/domains/forms/hooks.js
 
+function hooks_useConfig() {
+  return useSelector(Selectors.selectConfig);
+}
+;// CONCATENATED MODULE: ./src/javascripts/domains/config/middleware.js
+
+
+function createMiddleware() {
+  return ({
+    dispatch
+  }) => next => action => {
+    var _action$config, _action$config$defaul;
 
+    const result = next(action);
 
+    switch (action.type) {
+      case String(Actions.initialize):
+      case String(Actions.update):
+        if (action !== null && action !== void 0 && (_action$config = action.config) !== null && _action$config !== void 0 && (_action$config$defaul = _action$config.defaults) !== null && _action$config$defaul !== void 0 && _action$config$defaul.agentName) {
+          var _action$config2, _action$config2$defau;
 
+          dispatch({
+            type: seamlyActions.SET_HEADER_SUB_TITLE,
+            title: action === null || action === void 0 ? void 0 : (_action$config2 = action.config) === null || _action$config2 === void 0 ? void 0 : (_action$config2$defau = _action$config2.defaults) === null || _action$config2$defau === void 0 ? void 0 : _action$config2$defau.agentName
+          });
+        }
 
+    }
 
-function hooks_useFormContext() {
-  return useContext(FormContext);
-}
-function hooks_useForm() {
-  const {
-    handleSubmit
-  } = hooks_useFormContext();
-  return {
-    handleSubmit
+    return result;
   };
 }
-function hooks_useValidations(values, validationSchema) {
-  const errors = useMemo(() => validate(values, validationSchema), [values, validationSchema]);
-  return {
-    isValid: Object.keys(errors).length === 0,
-    errors
-  };
-}
-function hooks_useFormControl(name) {
-  const dispatch = useStoreDispatch();
-  const {
-    formId,
-    updateControlValue,
-    updateControlTouched,
-    errors
-  } = hooks_useFormContext();
-  const form = useSelectorWithProps(getFormById, {
-    formId
-  }, [formId]);
-  const isRegistered = !!form;
-  const isRegisteredRef = useRef();
-  isRegisteredRef.current = isRegistered;
-  const value = useSelectorWithProps(getControlValueByName, {
-    formId,
-    name
-  }, [formId, name]);
-  const touched = useSelectorWithProps(getControlTouchedByName, {
-    formId,
-    name
-  }, [formId, name]);
-  const error = errors === null || errors === void 0 ? void 0 : errors[name];
-  const isValid = !error;
-  useEffect(() => {
-    // Make sure the form is registered
-    // Since child useEffect runs before FormProvider useEffect
-    if (isRegisteredRef.current) {
-      dispatch(Actions.registerControl(formId, name));
-    }
-  }, [isRegistered, formId, name, dispatch]);
-  useLayoutEffect(() => {
-    return () => {
-      dispatch(Actions.deregisterControl(formId, name));
-    };
-  }, [isRegistered, formId, name, dispatch]); // preact uses onInput instead of onChange
-
-  const onInput = useCallback(e => updateControlValue(name, e.target.value), [name, updateControlValue]);
-  const onBlur = useCallback(() => {
-    updateControlTouched(name, true);
-  }, [updateControlTouched, name]);
-  const field = useMemo(() => ({
-    name,
-    onInput,
-    onBlur,
-    value
-  }), [name, onInput, onBlur, value]);
-  const meta = useMemo(() => ({
-    isValid,
-    error,
-    touched
-  }), [isValid, error, touched]);
-  return [field, meta];
-}
-;// CONCATENATED MODULE: ./src/javascripts/domains/forms/provider.js
-const _excluded = (/* unused pure expression or super */ null && (["children", "formId", "persistData", "onSubmit", "validationSchema"]));
+;// CONCATENATED MODULE: ./src/javascripts/config.js
+const CSS_NAME = 'cvco';
+const apiVersion = '2';
+const config_userParticipantId = 'seamly-client-participant'; // How long to debounce distinct changes in unread messages for before
+// broadcasting to the screen reader. This is done to avoid verbosity.
 
-function provider_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; }
+const unreadScreenReaderWait = 2000;
+const newMessageScreenReaderWait = 1000;
+const config_screenReaderDebounceDelaySeconds = 10;
+const activitySendDelay = 15000;
+const maxCharacterWarningLimit = 50;
+const maxCharacterSrDebounceDelay = 300;
+const config_defaultTransitionTimeMs = 300; // How long to wait before we decide the user isn't typing
 
-function provider_objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { provider_ownKeys(Object(source), true).forEach(function (key) { provider_defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { provider_ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+const config_typingTimeout = 2000;
+const defaultConfig = {
+  namespace: 'default',
+  layoutMode: 'window',
+  // "window", "inline" ("sidebar"), "modal"
+  messages: {
+    agent: {
+      showAvatar: false,
+      // true, "inline"
+      showName: false
+    },
+    user: {
+      showAvatar: false,
+      // true, "inline"
+      showName: false
+    },
+    timeIndicator: {
+      enabled: false,
+      threshold: 3600000 // Default threshold is an hour in milliseconds
 
-function provider_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; }
+    }
+  },
+  appContainerClassNames: config => [`app--layout-${config.layoutMode}`, `namespace--${config.namespace}`]
+};
+;// CONCATENATED MODULE: ./src/javascripts/domains/config/reducer.js
+const _excluded = ["messages"];
 
 function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _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 _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 reducer_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 reducer_objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { reducer_ownKeys(Object(source), true).forEach(function (key) { reducer_defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { reducer_ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
 
+function reducer_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 provider_FormProvider(_ref) {
-  let {
-    children,
-    formId,
-    persistData,
-    onSubmit,
-    validationSchema
-  } = _ref,
-      props = _objectWithoutProperties(_ref, _excluded);
-
-  const dispatch = useStoreDispatch();
-  const values = useSelectorWithProps(getFormValuesByFormId, {
-    formId
-  }, [formId]);
-  const [isSubmitted, setIsSubmitted] = useState(false);
-  const [externalErrors, setExternalErrors] = useState({});
-  const {
-    isValid: validationIsValid,
-    errors: validationErrors
-  } = useValidations(values, validationSchema);
-  const errors = useMemo(() => provider_objectSpread(provider_objectSpread({}, validationErrors), externalErrors), [validationErrors, externalErrors]); // register
 
-  useLayoutEffect(() => {
-    // register form in redux store
-    dispatch(Actions.registerForm(formId, persistData));
-  }, [formId, persistData, dispatch]); // deregister
+const initialState = reducer_objectSpread(reducer_objectSpread({}, defaultConfig), {}, {
+  hideOnNoUserResponse: false,
+  showDisclaimer: false,
+  showFaq: false,
+  customComponents: {},
+  defaults: {}
+});
 
-  useEffect(() => {
-    return () => {
-      // deregister form from redux store
-      dispatch(Actions.deregisterForm(formId));
-    };
-  }, [formId, persistData, dispatch]);
-  const updateControlValue = useCallback((name, value) => {
-    dispatch(Actions.updateControlValue(formId, name, value));
-  }, [formId, dispatch]);
-  const updateControlTouched = useCallback((name, touched) => {
-    dispatch(Actions.updateControlTouched(formId, name, touched));
-  }, [dispatch, formId]); // Function to manually set an error
+const configKeys = ['hideOnNoUserResponse', 'showDisclaimer', 'showFaq', 'namespace', 'customComponents', 'defaults', 'layoutMode', 'api', 'zIndex', 'context', 'appContainerClassNames', 'messages', 'visible', 'visibilityCallback', 'errorCallback'];
 
-  const setError = useCallback((name, error) => {
-    setExternalErrors(val => {
-      return provider_objectSpread(provider_objectSpread({}, val), {}, {
-        [name]: error
-      });
-    });
-  }, [setExternalErrors]);
-  const handleSubmit = useCallback(e => {
-    e.preventDefault();
-    setIsSubmitted(true);
+const updateState = (state, {
+  config
+}) => {
+  const _pick = pick(config, configKeys),
+        {
+    messages
+  } = _pick,
+        partialConfig = _objectWithoutProperties(_pick, _excluded);
 
-    if (validationIsValid) {
-      onSubmit(values, {
-        updateControlValue,
-        setError
-      });
-    }
-  }, [validationIsValid, onSubmit, values, updateControlValue, setError]);
-  const contextValue = useMemo(() => ({
-    formId,
-    values,
-    errors,
-    isValid: Object.keys(errors).length === 0,
-    isSubmitted,
-    handleSubmit,
-    validationSchema,
-    updateControlValue,
-    updateControlTouched
-  }), [formId, values, errors, isSubmitted, handleSubmit, validationSchema, updateControlValue, updateControlTouched]);
+  let newState = state;
 
-  if (!formId) {
-    console.error('"formId" is required.');
-    return null;
+  if (Object.keys(partialConfig).length > 0) {
+    newState = reducer_objectSpread(reducer_objectSpread({}, newState), partialConfig);
   }
 
-  if (!onSubmit) {
-    console.error('"onSubmit" is required.');
-    return null;
+  if (messages) {
+    newState = reducer_objectSpread(reducer_objectSpread({}, newState), {}, {
+      messages: reducer_objectSpread(reducer_objectSpread({}, newState.messages), messages)
+    });
   }
 
-  return _jsx(Provider, provider_objectSpread(provider_objectSpread({}, props), {}, {
-    value: contextValue,
-    children: children
-  }));
-}
-;// CONCATENATED MODULE: ./src/javascripts/domains/forms/reducer.js
-function reducer_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 reducer_objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { reducer_ownKeys(Object(source), true).forEach(function (key) { reducer_defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { reducer_ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+  return newState;
+};
 
-function reducer_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; }
+/* harmony default export */ const reducer = (utils_createReducer({
+  [initialize]: (state, action) => {
+    return updateState(state, action);
+  },
+  [update]: (state, action) => {
+    return updateState(state, action);
+  }
+}, initialState));
+;// CONCATENATED MODULE: ./src/javascripts/domains/config/index.js
 
 
 
-const reducer_initialState = {};
-const initialFormState = {
-  controls: {}
-};
-const initialControlState = {
-  value: '',
-  touched: false
-};
 
-function updateFormControl(state, formId, name, controlState) {
-  var _state$formId;
 
-  const currentControlState = ((_state$formId = state[formId]) === null || _state$formId === void 0 ? void 0 : _state$formId.controls[name]) || initialControlState;
-  return reducer_objectSpread(reducer_objectSpread({}, state), {}, {
-    [formId]: reducer_objectSpread(reducer_objectSpread({}, state[formId]), {}, {
-      controls: reducer_objectSpread(reducer_objectSpread({}, state[formId].controls), {}, {
-        [name]: reducer_objectSpread(reducer_objectSpread({}, currentControlState), controlState)
-      })
-    })
-  });
-}
 
-/* harmony default export */ const reducer = (utils_createReducer({
-  // Form handlers
-  [registerForm]: (state, {
-    formId,
-    persistData
-  }) => {
-    const formState = persistData ? state[formId] ?? reducer_objectSpread(reducer_objectSpread({}, initialFormState), {}, {
-      persistData
-    }) : reducer_objectSpread(reducer_objectSpread({}, initialFormState), {}, {
-      persistData
-    });
-    return reducer_objectSpread(reducer_objectSpread({}, state), {}, {
-      [formId]: formState
-    });
-  },
-  [deregisterForm]: (state, {
-    formId
-  }) => {
-    var _newState$formId;
+;// CONCATENATED MODULE: ./src/javascripts/lib/mutex.js
+function createMutex() {
+  let isRunning = false;
+  const tasks = [];
 
-    const newState = reducer_objectSpread({}, state);
+  const next = async () => {
+    if (!isRunning) {
+      while (tasks.length) {
+        const task = tasks.shift();
+        isRunning = true; // eslint-disable-next-line no-await-in-loop
 
-    if (!((_newState$formId = newState[formId]) !== null && _newState$formId !== void 0 && _newState$formId.persistData)) {
-      delete newState[formId];
+        await task().catch(() => {});
+        isRunning = false;
+      }
     }
+  };
 
-    return newState;
-  },
-  // Form control handlers
-  [registerControl]: (state, {
-    name,
-    formId
-  }) => {
-    return updateFormControl(state, formId, name);
-  },
-  [deregisterControl]: (state, {
-    formId,
-    name
-  }) => {
-    const form = state[formId];
-
-    if (!form) {
-      return state;
-    }
-
-    if (form.persistData) {
-      return state;
-    }
-
-    const controls = reducer_objectSpread({}, form.controls);
-
-    delete controls[name];
-    return reducer_objectSpread(reducer_objectSpread({}, state), {}, {
-      [formId]: reducer_objectSpread(reducer_objectSpread({}, form), {}, {
-        controls
-      })
-    });
-  },
-  [updateControlValue]: (state, {
-    formId,
-    name,
-    value
-  }) => {
-    return updateFormControl(state, formId, name, {
-      value
-    });
-  },
-  [updateControlTouched]: (state, {
-    formId,
-    name,
-    touched
-  }) => {
-    return updateFormControl(state, formId, name, {
-      touched
+  const runExclusively = async task => {
+    const prms = new Promise((resolve, reject) => {
+      tasks.push(async () => {
+        try {
+          resolve(await task());
+        } catch (e) {
+          reject(e);
+        }
+      });
     });
-  }
-}, reducer_initialState));
-;// CONCATENATED MODULE: ./src/javascripts/domains/forms/index.js
-
-
-
-
-
+    next();
+    return prms;
+  };
 
-;// CONCATENATED MODULE: ./src/javascripts/domains/translations/utils.js
+  return {
+    next,
+    runExclusively
+  };
+}
+;// CONCATENATED MODULE: ./src/javascripts/domains/i18n/utils.js
 
 const {
-  createActions: translations_utils_createActions,
-  createReducer: translations_utils_createReducer,
+  createAction: i18n_utils_createAction,
+  createThunk: i18n_utils_createThunk,
+  createReducer: i18n_utils_createReducer,
   selectState: 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/translations/selectors.js
-
-
-
-const selectors_getState = utils_selectState;
-const getOriginalPayloadIds = createSelector(selectors_getState, state => state.originalPayloadIds);
-const getIsPayloadTranslated = createSelector(getOriginalPayloadIds, getPropSelector('payloadId'), (payloadIds, payloadId) => !payloadIds.includes(payloadId));
-;// CONCATENATED MODULE: ./src/javascripts/ui/components/core/seamly-api-context.js
-
-const seamly_api_context_SeamlyApiContext = (0,external_preact_namespaceObject.createContext)(null);
-const seamly_api_context_SeamlyEventBusContext = (0,external_preact_namespaceObject.createContext)('');
-;// CONCATENATED MODULE: ./src/javascripts/ui/hooks/seamly-api-hooks.js
+} = createDomain('i18n');
+;// CONCATENATED MODULE: ./src/javascripts/domains/i18n/selectors.js
 
 
-const seamly_api_hooks_useSeamlyApiContext = () => useContext(SeamlyApiContext);
-const seamly_api_hooks_useSeamlyObjectStore = () => {
-  const api = seamly_api_hooks_useSeamlyApiContext();
-  return api.store || {};
-};
-const useSeamlyConversationUrl = () => {
-  const {
-    get
-  } = seamly_api_hooks_useSeamlyObjectStore();
+const selectTranslations = createSelector(utils_selectState, state => state.translations);
+const selectInitialLocale = createSelector(utils_selectState, state => state.initialLocale);
+const selectLocale = createSelector(utils_selectState, state => state.locale);
 
-  if (get) {
-    return get('conversationUrl');
-  }
+;// CONCATENATED MODULE: ./src/javascripts/domains/i18n/actions.js
 
-  return null;
-};
-const seamly_api_hooks_useSeamlyHasConversation = () => {
-  const url = useSeamlyConversationUrl();
-  return !!url;
-};
-;// CONCATENATED MODULE: ./src/javascripts/domains/config/utils.js
 
-const {
-  createAction: utils_createAction,
-  createThunk: utils_createThunk,
-  createReducer: config_utils_createReducer,
-  selectState: config_utils_selectState
-} = createDomain('config');
-;// CONCATENATED MODULE: ./src/javascripts/domains/config/actions.js
 
-const initialize = utils_createAction('initialize', config => ({
-  config
-}));
-const update = utils_createAction('update', config => ({
-  config
+const setInitialLocale = i18n_utils_createAction('setInitialLocale', locale => ({
+  locale
 }));
-;// CONCATENATED MODULE: ./src/javascripts/domains/config/selectors.js
-function selectors_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 selectors_objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { selectors_ownKeys(Object(source), true).forEach(function (key) { selectors_defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { selectors_ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
-
-function selectors_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 mutex = createMutex();
+const setLocale = i18n_utils_createThunk('setLocale', async (locale, {
+  getState,
+  extra: {
+    api
+  }
+}) => {
+  return mutex.runExclusively(() => {
+    if (locale === selectLocale(getState())) {
+      return undefined;
+    }
 
+    return api.getTranslations(locale);
+  });
+});
+;// CONCATENATED MODULE: ./node_modules/@ultraq/icu-message-formatter/node_modules/@babel/runtime/helpers/esm/arrayWithHoles.js
+function _arrayWithHoles(arr) {
+  if (Array.isArray(arr)) return arr;
+}
+;// CONCATENATED MODULE: ./node_modules/@ultraq/icu-message-formatter/node_modules/@babel/runtime/helpers/esm/iterableToArrayLimit.js
+function _iterableToArrayLimit(arr, i) {
+  var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"];
 
+  if (_i == null) return;
+  var _arr = [];
+  var _n = true;
+  var _d = false;
 
+  var _s, _e;
 
-const selectConfig = createSelector(config_utils_selectState, config => {
-  let newConfig = selectors_objectSpread({
-    visible: (config === null || config === void 0 ? void 0 : config.layoutMode) === 'inline' ? seamly_utils_visibilityStates.open : seamly_utils_visibilityStates.minimized,
-    appContainerClassNames: config.appContainerClassNames || []
-  }, config);
+  try {
+    for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) {
+      _arr.push(_s.value);
 
-  if (typeof newConfig.appContainerClassNames === 'function') {
-    newConfig = selectors_objectSpread(selectors_objectSpread({}, newConfig), {}, {
-      appContainerClassNames: newConfig.appContainerClassNames(newConfig)
-    });
+      if (i && _arr.length === i) break;
+    }
+  } catch (err) {
+    _d = true;
+    _e = err;
+  } finally {
+    try {
+      if (!_n && _i["return"] != null) _i["return"]();
+    } finally {
+      if (_d) throw _e;
+    }
   }
 
-  return newConfig;
-});
-
-;// CONCATENATED MODULE: ./src/javascripts/domains/config/hooks.js
-
-
-function hooks_useConfig() {
-  return useSelector(Selectors.selectConfig);
+  return _arr;
 }
-;// CONCATENATED MODULE: ./src/javascripts/domains/config/middleware.js
+;// CONCATENATED MODULE: ./node_modules/@ultraq/icu-message-formatter/node_modules/@babel/runtime/helpers/esm/arrayLikeToArray.js
+function _arrayLikeToArray(arr, len) {
+  if (len == null || len > arr.length) len = arr.length;
 
+  for (var i = 0, arr2 = new Array(len); i < len; i++) {
+    arr2[i] = arr[i];
+  }
 
-function createMiddleware() {
-  return ({
-    dispatch
-  }) => next => action => {
-    var _action$config, _action$config$defaul;
+  return arr2;
+}
+;// CONCATENATED MODULE: ./node_modules/@ultraq/icu-message-formatter/node_modules/@babel/runtime/helpers/esm/unsupportedIterableToArray.js
 
-    const result = next(action);
+function _unsupportedIterableToArray(o, minLen) {
+  if (!o) return;
+  if (typeof o === "string") return _arrayLikeToArray(o, minLen);
+  var n = Object.prototype.toString.call(o).slice(8, -1);
+  if (n === "Object" && o.constructor) n = o.constructor.name;
+  if (n === "Map" || n === "Set") return Array.from(o);
+  if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);
+}
+;// CONCATENATED MODULE: ./node_modules/@ultraq/icu-message-formatter/node_modules/@babel/runtime/helpers/esm/nonIterableRest.js
+function _nonIterableRest() {
+  throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
+}
+;// CONCATENATED MODULE: ./node_modules/@ultraq/icu-message-formatter/node_modules/@babel/runtime/helpers/esm/slicedToArray.js
 
-    switch (action.type) {
-      case String(Actions.initialize):
-      case String(Actions.update):
-        if (action !== null && action !== void 0 && (_action$config = action.config) !== null && _action$config !== void 0 && (_action$config$defaul = _action$config.defaults) !== null && _action$config$defaul !== void 0 && _action$config$defaul.agentName) {
-          var _action$config2, _action$config2$defau;
 
-          dispatch({
-            type: seamlyActions.SET_HEADER_SUB_TITLE,
-            title: action === null || action === void 0 ? void 0 : (_action$config2 = action.config) === null || _action$config2 === void 0 ? void 0 : (_action$config2$defau = _action$config2.defaults) === null || _action$config2$defau === void 0 ? void 0 : _action$config2$defau.agentName
-          });
-        }
 
-    }
 
-    return result;
-  };
+function _slicedToArray(arr, i) {
+  return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();
+}
+;// CONCATENATED MODULE: ./node_modules/@ultraq/icu-message-formatter/node_modules/@babel/runtime/helpers/esm/classCallCheck.js
+function _classCallCheck(instance, Constructor) {
+  if (!(instance instanceof Constructor)) {
+    throw new TypeError("Cannot call a class as a function");
+  }
+}
+;// CONCATENATED MODULE: ./node_modules/@ultraq/icu-message-formatter/node_modules/@babel/runtime/helpers/esm/createClass.js
+function _defineProperties(target, props) {
+  for (var i = 0; i < props.length; i++) {
+    var descriptor = props[i];
+    descriptor.enumerable = descriptor.enumerable || false;
+    descriptor.configurable = true;
+    if ("value" in descriptor) descriptor.writable = true;
+    Object.defineProperty(target, descriptor.key, descriptor);
+  }
 }
-;// CONCATENATED MODULE: ./src/javascripts/config.js
-const CSS_NAME = 'cvco';
-const apiVersion = '2';
-const config_userParticipantId = 'seamly-client-participant'; // How long to debounce distinct changes in unread messages for before
-// broadcasting to the screen reader. This is done to avoid verbosity.
-
-const unreadScreenReaderWait = 2000;
-const newMessageScreenReaderWait = 1000;
-const config_screenReaderDebounceDelaySeconds = 10;
-const activitySendDelay = 15000;
-const maxCharacterWarningLimit = 50;
-const maxCharacterSrDebounceDelay = 300;
-const config_defaultTransitionTimeMs = 300; // How long to wait before we decide the user isn't typing
-
-const config_typingTimeout = 2000;
-const defaultConfig = {
-  namespace: 'default',
-  layoutMode: 'window',
-  // "window", "inline" ("sidebar"), "modal"
-  messages: {
-    agent: {
-      showAvatar: false,
-      // true, "inline"
-      showName: false
-    },
-    user: {
-      showAvatar: false,
-      // true, "inline"
-      showName: false
-    },
-    timeIndicator: {
-      enabled: false,
-      threshold: 3600000 // Default threshold is an hour in milliseconds
 
-    }
-  },
-  appContainerClassNames: config => [`app--layout-${config.layoutMode}`, `namespace--${config.namespace}`]
-};
-;// CONCATENATED MODULE: ./src/javascripts/domains/config/reducer.js
-const reducer_excluded = ["messages"];
+function _createClass(Constructor, protoProps, staticProps) {
+  if (protoProps) _defineProperties(Constructor.prototype, protoProps);
+  if (staticProps) _defineProperties(Constructor, staticProps);
+  return Constructor;
+}
+;// CONCATENATED MODULE: ./node_modules/@ultraq/icu-message-formatter/node_modules/@babel/runtime/helpers/esm/defineProperty.js
+function defineProperty_defineProperty(obj, key, value) {
+  if (key in obj) {
+    Object.defineProperty(obj, key, {
+      value: value,
+      enumerable: true,
+      configurable: true,
+      writable: true
+    });
+  } else {
+    obj[key] = value;
+  }
 
-function reducer_objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = reducer_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; }
+  return obj;
+}
+;// CONCATENATED MODULE: ./node_modules/@ultraq/array-utils/array-utils.es.js
+/* 
+ * Copyright 2017, Emanuel Rabina (http://www.ultraq.net.nz/)
+ * 
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ * 
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ * 
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
 
-function reducer_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; }
+/**
+ * Flattens an array of arrays of infinite depth into a single-dimension array.
+ * 
+ * > This is now natively in JavaScript as the `flat` method on an Array
+ * > instance.  [Check MDN for which browsers have access to this feature](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/flat).
+ * > If you can't use `flat`, then this method will do the job 🙂
+ * 
+ * @param {Array} array
+ * @return {Array} Flattened array.
+ */
+function flatten(array) {
+  return array.reduce(function (accumulator, value) {
+    return accumulator.concat(Array.isArray(value) ? flatten(value) : value);
+  }, []);
+}
+/**
+ * Creates an array of numbers from the starting value (inclusive) to the end
+ * (exclusive), with an optional step (the gap between values).
+ * 
+ * @param {Number} start
+ *   The value to start at, the first item in the returned array.
+ * @param {Number} end
+ *   The value to end with, the last item in the returned array.
+ * @param {Number} [step=1]
+ *   The increment/gap between values, defaults to 1.
+ * @return {Array} An array encompassing the given range.
+ */
 
-function config_reducer_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 range(start, end) {
+  var step = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 1;
+  return Array.apply(0, Array(Math.ceil((end - start) / step))).map(function (empty, index) {
+    return index * step + start;
+  });
+}
+/**
+ * Remove and return the first item from `array` that matches the predicate
+ * function.
+ * 
+ * @param {Array} array
+ * @param {Function} predicate
+ *   Invoked with the array item.
+ * @return {Object} The matching item, or `null` if no match was found.
+ */
 
-function config_reducer_objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { config_reducer_ownKeys(Object(source), true).forEach(function (key) { config_reducer_defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { config_reducer_ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+function remove(array, predicate) {
+  return array.find(function (item, index) {
+    if (predicate(item)) {
+      array.splice(index, 1);
+      return item;
+    }
+  });
+}
 
-function config_reducer_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; }
+//# sourceMappingURL=array-utils.es.js.map
+;// CONCATENATED MODULE: ./node_modules/@ultraq/function-utils/function-utils.es.js
+/**
+ * A higher-order function to apply [memoization](https://en.wikipedia.org/wiki/Memoization).
+ * 
+ * If memoizing a recursive function, then memoize and define the function at
+ * the same time so you can make a call to the memoized function, eg:
+ * 
+ * ```javascript
+ * const myFunction = memoize(() => myFunction());
+ * ```
+ * 
+ * @param {Function} func
+ * @return {Function} 
+ */
+function memoize(func) {
+  var cache = {};
+  return function () {
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
 
+    var key = args.length ? args.map(function (arg) {
+      return arg === null ? 'null' : arg === undefined ? 'undefined' : typeof arg === 'function' ? arg.toString() : arg instanceof Date ? arg.toISOString() : JSON.stringify(arg);
+    }).join('|') : '_(no-args)_';
 
+    if (Object.prototype.hasOwnProperty.call(cache, key)) {
+      return cache[key];
+    }
 
+    var result = func.apply(void 0, args);
+    cache[key] = result;
+    return result;
+  };
+}
 
+//# sourceMappingURL=function-utils.es.js.map
+;// CONCATENATED MODULE: ./node_modules/@ultraq/icu-message-formatter/lib/icu-message-formatter.es.js
 
 
-const config_reducer_initialState = config_reducer_objectSpread(config_reducer_objectSpread({}, defaultConfig), {}, {
-  hideOnNoUserResponse: false,
-  showDisclaimer: false,
-  showFaq: false,
-  customComponents: {},
-  defaults: {}
-});
 
-const configKeys = ['hideOnNoUserResponse', 'showDisclaimer', 'showFaq', 'namespace', 'customComponents', 'defaults', 'layoutMode', 'api', 'zIndex', 'context', 'appContainerClassNames', 'messages', 'visible', 'visibilityCallback'];
 
-const updateState = (state, {
-  config
-}) => {
-  const _pick = pick(config, configKeys),
-        {
-    messages
-  } = _pick,
-        partialConfig = reducer_objectWithoutProperties(_pick, reducer_excluded);
 
-  let newState = state;
 
-  if (Object.keys(partialConfig).length > 0) {
-    newState = config_reducer_objectSpread(config_reducer_objectSpread({}, newState), partialConfig);
-  }
 
-  if (messages) {
-    newState = config_reducer_objectSpread(config_reducer_objectSpread({}, newState), {}, {
-      messages: config_reducer_objectSpread(config_reducer_objectSpread({}, newState.messages), messages)
-    });
-  }
+/* 
+ * Copyright 2019, Emanuel Rabina (http://www.ultraq.net.nz/)
+ * 
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ * 
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ * 
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
 
-  return newState;
-};
+/**
+ * Most branch-based type handlers are based around "cases".
+ * For example, `select` and `plural` compare compare a value
+ * to "case keys" to choose a subtranslation.
+ * 
+ * This util splits "matches" portions provided to the aforementioned
+ * handlers into case strings, and extracts any prepended arguments
+ * (for example, `plural` supports an `offset:n` argument used for
+ * populating the magic `#` variable).
+ * 
+ * @param {String} string
+ * @return {Object} The `cases` key points to a map of all cases.
+ *                  The `arguments` key points to a list of prepended arguments.
+ */
+function parseCases(string) {
+  var isWhitespace = function isWhitespace(ch) {
+    return /\s/.test(ch);
+  };
 
-/* harmony default export */ const config_reducer = (config_utils_createReducer({
-  [initialize]: (state, action) => {
-    return updateState(state, action);
-  },
-  [update]: (state, action) => {
-    return updateState(state, action);
-  }
-}, config_reducer_initialState));
-;// CONCATENATED MODULE: ./src/javascripts/domains/config/index.js
+  var args = [];
+  var cases = {};
+  var currTermStart = 0;
+  var latestTerm = null;
+  var inTerm = false;
+  var i = 0;
 
+  while (i < string.length) {
+    // Term ended
+    if (inTerm && (isWhitespace(string[i]) || string[i] === '{')) {
+      inTerm = false;
+      latestTerm = string.slice(currTermStart, i); // We want to process the opening char again so the case will be properly registered.
 
+      if (string[i] === '{') {
+        i--;
+      }
+    } // New term
+    else if (!inTerm && !isWhitespace(string[i])) {
+      var caseBody = string[i] === '{'; // If there's a previous term, we can either handle a whole
+      // case, or add that as an argument.
 
+      if (latestTerm && caseBody) {
+        var branchEndIndex = findClosingBracket(string, i);
 
+        if (branchEndIndex === -1) {
+          throw new Error("Unbalanced curly braces in string: \"".concat(string, "\""));
+        }
 
+        cases[latestTerm] = string.slice(i + 1, branchEndIndex); // Don't include the braces
 
-;// 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; }
+        i = branchEndIndex; // Will be moved up where needed at end of loop.
 
-function seamly_state_hooks_objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { seamly_state_hooks_ownKeys(Object(source), true).forEach(function (key) { seamly_state_hooks_defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { seamly_state_hooks_ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+        latestTerm = null;
+      } else {
+        if (latestTerm) {
+          args.push(latestTerm);
+          latestTerm = null;
+        }
 
-function seamly_state_hooks_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; }
+        inTerm = true;
+        currTermStart = i;
+      }
+    }
 
+    i++;
+  }
 
+  if (inTerm) {
+    latestTerm = string.slice(currTermStart);
+  }
 
+  if (latestTerm) {
+    args.push(latestTerm);
+  }
 
+  return {
+    args: args,
+    cases: cases
+  };
+}
+/**
+ * Finds the index of the matching closing curly bracket, including through
+ * strings that could have nested brackets.
+ * 
+ * @param {String} string
+ * @param {Number} fromIndex
+ * @return {Number} The index of the matching closing bracket, or -1 if no
+ *   closing bracket could be found.
+ */
 
-const seamly_state_hooks_selectState = state => state.state;
-const seamly_state_hooks_useSeamlyStateContext = () => useSelector(seamly_state_hooks_selectState);
-const selectEvents = createSelector(seamly_state_hooks_selectState, selectConfig, ({
-  events
-}, config) => {
-  var _config$messages;
+function findClosingBracket(string, fromIndex) {
+  var depth = 0;
 
-  const {
-    enabled,
-    threshold
-  } = (config === null || config === void 0 ? void 0 : (_config$messages = config.messages) === null || _config$messages === void 0 ? void 0 : _config$messages.timeIndicator) ?? {};
+  for (var i = fromIndex + 1; i < string.length; i++) {
+    var char = string.charAt(i);
 
-  if (!enabled) {
-    return events;
-  }
+    if (char === '}') {
+      if (depth === 0) {
+        return i;
+      }
 
-  const mappedEvents = [];
-  let previousEvent = null;
-  events.forEach((event, idx) => {
-    // always add timeIndicator to first message
-    if (idx === 0) {
-      mappedEvents.push(seamly_state_hooks_objectSpread(seamly_state_hooks_objectSpread({}, event), {}, {
-        timeIndicator: event.payload.occurredAt
-      })); // else check if diff is greater than threshold
-    } else {
-      const timeIndicator = previousEvent && microsecondsToMilliseconds(event.payload.occurredAt - previousEvent.payload.occurredAt) >= threshold ? event.payload.occurredAt : undefined;
-      mappedEvents.push(seamly_state_hooks_objectSpread(seamly_state_hooks_objectSpread({}, event), {}, {
-        timeIndicator
-      }));
+      depth--;
+    } else if (char === '{') {
+      depth++;
     }
+  }
 
-    previousEvent = event;
-  });
-  return mappedEvents;
-});
-const seamly_state_hooks_useEvents = () => useSelector(selectEvents, []);
-const useSeamlyIsLoading = () => seamly_state_hooks_useSeamlyStateContext().isLoading;
-const useSeamlyHeaderData = () => seamly_state_hooks_useSeamlyStateContext().headerTitles;
-const seamly_state_hooks_useSeamlyUnreadCount = () => seamly_state_hooks_useSeamlyStateContext().unreadEvents;
-const seamly_state_hooks_useSkiplink = () => seamly_state_hooks_useSeamlyStateContext().skiplinkTargetId;
-const useSeamlyParticipant = participantId => seamly_state_hooks_useSeamlyStateContext().participantInfo.participants[participantId];
-const useSeamlyServiceInfo = () => seamly_state_hooks_useSeamlyStateContext().serviceInfo;
-const selectLastMessageEventId = createSelector(selectEvents, events => {
-  var _filteredEvents;
-
-  const filteredEvents = events.filter(event => event.type === 'message');
-  return (_filteredEvents = filteredEvents[filteredEvents.length - 1]) === null || _filteredEvents === void 0 ? void 0 : _filteredEvents.payload.id;
-});
-const useLastMessageEventId = () => useSelector(selectLastMessageEventId);
-const useSeamlyIsHistoryLoaded = () => seamly_state_hooks_useSeamlyStateContext().historyLoaded;
-const useSeamlyCurrentAgent = () => {
-  const {
-    participants,
-    currentAgent
-  } = seamly_state_hooks_useSeamlyStateContext().participantInfo;
-  return currentAgent ? participants[currentAgent] : null;
-};
-const useSeamlyServiceData = key => seamly_state_hooks_useSeamlyStateContext().serviceData[key];
-const useEntryTextLimit = () => {
-  const {
-    entryMeta: {
-      options: {
-        text
-      }
-    }
-  } = seamly_state_hooks_useSeamlyStateContext();
-  const {
-    limit
-  } = text || {};
-  return {
-    hasLimit: limit != null,
-    limit: limit != null ? limit : null
-  };
-};
-const useSeamlyLayoutMode = () => {
-  const {
-    layoutMode
-  } = useConfig();
-  return {
-    isInline: layoutMode === 'inline',
-    isModal: layoutMode === 'modal',
-    isWindow: layoutMode === 'window',
-    isResolving: !layoutMode
-  };
-};
-;// CONCATENATED MODULE: ./src/javascripts/ui/hooks/use-seamly-dispatch.js
+  return -1;
+}
+/**
+ * Split a `{key, type, format}` block into those 3 parts, taking into account
+ * nested message syntax that can exist in the `format` part.
+ * 
+ * @param {String} block
+ * @return {Array}
+ *   An array with `key`, `type`, and `format` items in that order, if present
+ *   in the formatted argument block.
+ */
 
-/* harmony default export */ const use_seamly_dispatch = ((/* unused pure expression or super */ null && (useStoreDispatch)));
-;// CONCATENATED MODULE: ./src/javascripts/ui/hooks/focus-helper-hooks.js
+function splitFormattedArgument(block) {
+  return split(block.slice(1, -1), ',', 3);
+}
+/**
+ * Like `String.prototype.split()` but where the limit parameter causes the
+ * remainder of the string to be grouped together in a final entry.
+ * 
+ * @private
+ * @param {String} string
+ * @param {String} separator
+ * @param {Number} limit
+ * @param {Array} [accumulator=[]]
+ * @return {Array}
+ */
 
+function split(string, separator, limit) {
+  var accumulator = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : [];
 
+  if (!string) {
+    return accumulator;
+  }
 
+  if (limit === 1) {
+    accumulator.push(string);
+    return accumulator;
+  }
 
+  var indexOfDelimiter = string.indexOf(separator);
 
-const {
-  SET_SEAMLY_CONTAINER_ELEMENT: focus_helper_hooks_SET_SEAMLY_CONTAINER_ELEMENT
-} = seamly_utils_seamlyActions;
+  if (indexOfDelimiter === -1) {
+    accumulator.push(string);
+    return accumulator;
+  }
 
-const focusWithRaf = el => {
-  requestAnimationFrame(() => {
-    requestAnimationFrame(() => {
-      const focusEl = typeof el === 'string' ? document.getElementById(el) : el;
-      focusElement(focusEl);
-    });
-  });
-};
+  var head = string.substring(0, indexOfDelimiter).trim();
+  var tail = string.substring(indexOfDelimiter + separator.length + 1).trim();
+  accumulator.push(head);
+  return split(tail, separator, limit - 1, accumulator);
+}
 
-const useSeamlyContainerElement = () => {
-  const {
-    seamlyContainerElement
-  } = useSeamlyStateContext();
-  const dispatch = useSeamlyDispatchContext();
-  const setSeamlyContainerElement = useCallback(element => {
-    dispatch({
-      type: focus_helper_hooks_SET_SEAMLY_CONTAINER_ELEMENT,
-      element
-    });
-  }, [dispatch]);
-  return [seamlyContainerElement, setSeamlyContainerElement];
-};
-const focus_helper_hooks_useElementFocusingById = elementId => useCallback(() => {
-  focusWithRaf(elementId);
-}, [elementId]);
-const focus_helper_hooks_useSkiplinkTargetFocusing = () => {
-  const skiplinkTargetId = useSkiplink();
-  return focus_helper_hooks_useElementFocusingById(skiplinkTargetId);
-};
-const useFocusIfSeamlyContainedFocus = () => {
-  const containerElementRef = useRef(null);
-  const [seamlyContainerElement] = useSeamlyContainerElement();
-  containerElementRef.current = seamlyContainerElement;
-  return useCallback(elementToFocus => {
-    const focusFn = () => {
-      focusWithRaf(elementToFocus);
-    };
+/**
+ * The main class for formatting messages.
+ * 
+ * @author Emanuel Rabina
+ */
 
-    runIfElementContainsOrHasFocus(containerElementRef.current, focusFn);
-  }, []);
-};
-;// CONCATENATED MODULE: ./src/javascripts/ui/hooks/component-helper-hooks.js
+var MessageFormatter = /*#__PURE__*/function () {
+  /**
+   * Creates a new formatter that can work using any of the custom type handlers
+   * you register.
+   * 
+   * @param {String} locale
+   * @param {Object} [typeHandlers={}]
+   *   Optional object where the keys are the names of the types to register,
+   *   their values being the functions that will return a nicely formatted
+   *   string for the data and locale they are given.
+   */
+  function MessageFormatter(locale) {
+    var _this = this;
 
+    var typeHandlers = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
 
+    _classCallCheck(this, MessageFormatter);
 
-const useSeamlyAppContainerClassNames = () => {
-  return useConfig().appContainerClassNames;
-};
-const useSeamlyMessageContainerClassNames = event => {
-  const {
-    fromClient
-  } = event.payload;
-  const classNames = ['message'];
+    defineProperty_defineProperty(this, "format", memoize(function (message) {
+      var values = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+      return flatten(_this.process(message, values)).join('');
+    }));
 
-  if (event.type === 'info') {
-    classNames.push('message--source-info');
-  } else if (!fromClient) {
-    classNames.push('message--source-agent');
-  } else {
-    classNames.push('message--source-user');
+    this.locale = locale;
+    this.typeHandlers = typeHandlers;
   }
+  /**
+   * Formats an ICU message syntax string using `values` for placeholder data
+   * and any currently-registered type handlers.
+   * 
+   * @param {String} message
+   * @param {Object} [values={}]
+   * @return {String}
+   */
 
-  return classNames;
-};
-const useCobrowsingContainer = () => {
-  const {
-    cobrowsingContainerId: id
-  } = useSeamlyStateContext();
-  const focusContainer = useElementFocusingById(id);
-  return {
-    id,
-    focusContainer
-  };
-};
-;// CONCATENATED MODULE: ./src/javascripts/lib/mutex.js
-function createMutex() {
-  let isRunning = false;
-  const tasks = [];
 
-  const next = async () => {
-    if (!isRunning) {
-      while (tasks.length) {
-        const task = tasks.shift();
-        isRunning = true; // eslint-disable-next-line no-await-in-loop
+  _createClass(MessageFormatter, [{
+    key: "process",
+    value:
+    /**
+     * Process an ICU message syntax string using `values` for placeholder data
+     * and any currently-registered type handlers.  The result of this method is
+     * an array of the component parts after they have been processed in turn by
+     * their own type handlers.  This raw output is useful for other renderers,
+     * eg: React where components can be used instead of being forced to return
+     * raw strings.
+     * 
+     * This method is used by {@link MessageFormatter#format} where it acts as a
+     * string renderer.
+     * 
+     * @param {String} message
+     * @param {Object} [values={}]
+     * @return {Array}
+     */
+    function process(message) {
+      var values = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
 
-        await task().catch(() => {});
-        isRunning = false;
+      if (!message) {
+        return [];
       }
-    }
-  };
 
-  const runExclusively = async task => {
-    const prms = new Promise((resolve, reject) => {
-      tasks.push(async () => {
-        try {
-          resolve(await task());
-        } catch (e) {
-          reject(e);
-        }
-      });
-    });
-    next();
-    return prms;
-  };
+      var blockStartIndex = message.indexOf('{');
 
-  return {
-    next,
-    runExclusively
-  };
-}
-;// CONCATENATED MODULE: ./src/javascripts/domains/i18n/utils.js
+      if (blockStartIndex !== -1) {
+        var blockEndIndex = findClosingBracket(message, blockStartIndex);
 
-const {
-  createAction: i18n_utils_createAction,
-  createThunk: i18n_utils_createThunk,
-  createReducer: i18n_utils_createReducer,
-  selectState: i18n_utils_selectState
-} = createDomain('i18n');
-;// CONCATENATED MODULE: ./src/javascripts/domains/i18n/selectors.js
+        if (blockEndIndex !== -1) {
+          var block = message.substring(blockStartIndex, blockEndIndex + 1);
 
+          if (block) {
+            var result = [];
+            var head = message.substring(0, blockStartIndex);
 
-const selectTranslations = createSelector(i18n_utils_selectState, state => state.translations);
-const selectInitialLocale = createSelector(i18n_utils_selectState, state => state.initialLocale);
-const selectLocale = createSelector(i18n_utils_selectState, state => state.locale);
+            if (head) {
+              result.push(head);
+            }
 
-;// CONCATENATED MODULE: ./src/javascripts/domains/i18n/actions.js
+            var _splitFormattedArgume = splitFormattedArgument(block),
+                _splitFormattedArgume2 = _slicedToArray(_splitFormattedArgume, 3),
+                key = _splitFormattedArgume2[0],
+                type = _splitFormattedArgume2[1],
+                format = _splitFormattedArgume2[2];
 
+            var body = values[key];
 
+            if (body === null || body === undefined) {
+              body = '';
+            }
 
-const setInitialLocale = i18n_utils_createAction('setInitialLocale', locale => ({
-  locale
-}));
-const mutex = createMutex();
-const setLocale = i18n_utils_createThunk('setLocale', async (locale, {
-  getState,
-  extra: {
-    api
-  }
-}) => {
-  return mutex.runExclusively(() => {
-    if (locale === selectLocale(getState())) {
-      return undefined;
+            var typeHandler = type && this.typeHandlers[type];
+            result.push(typeHandler ? typeHandler(body, format, this.locale, values, this.process.bind(this)) : body);
+            var tail = message.substring(blockEndIndex + 1);
+
+            if (tail) {
+              result.push(this.process(tail, values));
+            }
+
+            return result;
+          }
+        } else {
+          throw new Error("Unbalanced curly braces in string: \"".concat(message, "\""));
+        }
+      }
+
+      return [message];
     }
+  }]);
 
-    return api.getTranslations(locale);
-  });
-});
-;// CONCATENATED MODULE: ./node_modules/@ultraq/icu-message-formatter/node_modules/@babel/runtime/helpers/esm/arrayWithHoles.js
-function _arrayWithHoles(arr) {
-  if (Array.isArray(arr)) return arr;
-}
-;// CONCATENATED MODULE: ./node_modules/@ultraq/icu-message-formatter/node_modules/@babel/runtime/helpers/esm/iterableToArrayLimit.js
-function _iterableToArrayLimit(arr, i) {
-  var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"];
+  return MessageFormatter;
+}();
 
-  if (_i == null) return;
-  var _arr = [];
-  var _n = true;
-  var _d = false;
+function icu_message_formatter_es_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; }
 
-  var _s, _e;
+function icu_message_formatter_es_objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { icu_message_formatter_es_ownKeys(Object(source), true).forEach(function (key) { defineProperty_defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { icu_message_formatter_es_ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+var pluralFormatter;
+var keyCounter = 0; // All the special keywords that can be used in `plural` blocks for the various branches
 
-  try {
-    for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) {
-      _arr.push(_s.value);
+var ONE = 'one';
+var OTHER$1 = 'other';
+/**
+ * @private
+ * @param {String} caseBody
+ * @param {Number} value
+ * @return {Object} {caseBody: string, numberValues: object}
+ */
 
-      if (i && _arr.length === i) break;
+function replaceNumberSign(caseBody, value) {
+  var i = 0;
+  var output = '';
+  var numBraces = 0;
+  var numberValues = {};
+
+  while (i < caseBody.length) {
+    if (caseBody[i] === '#' && !numBraces) {
+      var keyParam = "__hashToken".concat(keyCounter++);
+      output += "{".concat(keyParam, ", number}");
+      numberValues[keyParam] = value;
+    } else {
+      output += caseBody[i];
     }
-  } catch (err) {
-    _d = true;
-    _e = err;
-  } finally {
-    try {
-      if (!_n && _i["return"] != null) _i["return"]();
-    } finally {
-      if (_d) throw _e;
+
+    if (caseBody[i] === '{') {
+      numBraces++;
+    } else if (caseBody[i] === '}') {
+      numBraces--;
     }
+
+    i++;
   }
 
-  return _arr;
+  return {
+    caseBody: output,
+    numberValues: numberValues
+  };
 }
-;// CONCATENATED MODULE: ./node_modules/@ultraq/icu-message-formatter/node_modules/@babel/runtime/helpers/esm/arrayLikeToArray.js
-function _arrayLikeToArray(arr, len) {
-  if (len == null || len > arr.length) len = arr.length;
+/**
+ * Handler for `plural` statements within ICU message syntax strings.  Returns
+ * a formatted string for the branch that closely matches the current value.
+ * 
+ * See https://formatjs.io/docs/core-concepts/icu-syntax#plural-format for more
+ * details on how the `plural` statement works.
+ * 
+ * @param {String} value
+ * @param {String} matches
+ * @param {String} locale
+ * @param {String} values
+ * @param {Function} format
+ * @return {String}
+ */
 
-  for (var i = 0, arr2 = new Array(len); i < len; i++) {
-    arr2[i] = arr[i];
-  }
 
-  return arr2;
-}
-;// CONCATENATED MODULE: ./node_modules/@ultraq/icu-message-formatter/node_modules/@babel/runtime/helpers/esm/unsupportedIterableToArray.js
+function pluralTypeHandler(value) {
+  var matches = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
+  var locale = arguments.length > 2 ? arguments[2] : undefined;
+  var values = arguments.length > 3 ? arguments[3] : undefined;
+  var format = arguments.length > 4 ? arguments[4] : undefined;
 
-function _unsupportedIterableToArray(o, minLen) {
-  if (!o) return;
-  if (typeof o === "string") return _arrayLikeToArray(o, minLen);
-  var n = Object.prototype.toString.call(o).slice(8, -1);
-  if (n === "Object" && o.constructor) n = o.constructor.name;
-  if (n === "Map" || n === "Set") return Array.from(o);
-  if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);
-}
-;// CONCATENATED MODULE: ./node_modules/@ultraq/icu-message-formatter/node_modules/@babel/runtime/helpers/esm/nonIterableRest.js
-function _nonIterableRest() {
-  throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
-}
-;// CONCATENATED MODULE: ./node_modules/@ultraq/icu-message-formatter/node_modules/@babel/runtime/helpers/esm/slicedToArray.js
+  var _parseCases = parseCases(matches),
+      args = _parseCases.args,
+      cases = _parseCases.cases;
 
+  var intValue = parseInt(value);
+  args.forEach(function (arg) {
+    if (arg.startsWith('offset:')) {
+      intValue -= parseInt(arg.slice('offset:'.length));
+    }
+  });
+  var keywordPossibilities = [];
 
+  if ('PluralRules' in Intl) {
+    // Effectively memoize because instantiation of `Int.*` objects is expensive.
+    if (pluralFormatter === undefined || pluralFormatter.resolvedOptions().locale !== locale) {
+      pluralFormatter = new Intl.PluralRules(locale);
+    }
 
+    var pluralKeyword = pluralFormatter.select(intValue); // Other is always added last with least priority, so we don't want to add it here.
 
-function _slicedToArray(arr, i) {
-  return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();
-}
-;// CONCATENATED MODULE: ./node_modules/@ultraq/icu-message-formatter/node_modules/@babel/runtime/helpers/esm/classCallCheck.js
-function _classCallCheck(instance, Constructor) {
-  if (!(instance instanceof Constructor)) {
-    throw new TypeError("Cannot call a class as a function");
+    if (pluralKeyword !== OTHER$1) {
+      keywordPossibilities.push(pluralKeyword);
+    }
   }
-}
-;// CONCATENATED MODULE: ./node_modules/@ultraq/icu-message-formatter/node_modules/@babel/runtime/helpers/esm/createClass.js
-function _defineProperties(target, props) {
-  for (var i = 0; i < props.length; i++) {
-    var descriptor = props[i];
-    descriptor.enumerable = descriptor.enumerable || false;
-    descriptor.configurable = true;
-    if ("value" in descriptor) descriptor.writable = true;
-    Object.defineProperty(target, descriptor.key, descriptor);
-  }
-}
 
-function _createClass(Constructor, protoProps, staticProps) {
-  if (protoProps) _defineProperties(Constructor.prototype, protoProps);
-  if (staticProps) _defineProperties(Constructor, staticProps);
-  return Constructor;
-}
-;// CONCATENATED MODULE: ./node_modules/@ultraq/icu-message-formatter/node_modules/@babel/runtime/helpers/esm/defineProperty.js
-function defineProperty_defineProperty(obj, key, value) {
-  if (key in obj) {
-    Object.defineProperty(obj, key, {
-      value: value,
-      enumerable: true,
-      configurable: true,
-      writable: true
-    });
-  } else {
-    obj[key] = value;
+  if (intValue === 1) {
+    keywordPossibilities.push(ONE);
   }
 
-  return obj;
-}
-;// CONCATENATED MODULE: ./node_modules/@ultraq/array-utils/array-utils.es.js
-/* 
- * Copyright 2017, Emanuel Rabina (http://www.ultraq.net.nz/)
- * 
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- * 
- *     http://www.apache.org/licenses/LICENSE-2.0
- * 
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-/**
- * Flattens an array of arrays of infinite depth into a single-dimension array.
- * 
- * > This is now natively in JavaScript as the `flat` method on an Array
- * > instance.  [Check MDN for which browsers have access to this feature](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/flat).
- * > If you can't use `flat`, then this method will do the job 🙂
- * 
- * @param {Array} array
- * @return {Array} Flattened array.
- */
-function flatten(array) {
-  return array.reduce(function (accumulator, value) {
-    return accumulator.concat(Array.isArray(value) ? flatten(value) : value);
-  }, []);
-}
-/**
- * Creates an array of numbers from the starting value (inclusive) to the end
- * (exclusive), with an optional step (the gap between values).
- * 
- * @param {Number} start
- *   The value to start at, the first item in the returned array.
- * @param {Number} end
- *   The value to end with, the last item in the returned array.
- * @param {Number} [step=1]
- *   The increment/gap between values, defaults to 1.
- * @return {Array} An array encompassing the given range.
- */
-
-function range(start, end) {
-  var step = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 1;
-  return Array.apply(0, Array(Math.ceil((end - start) / step))).map(function (empty, index) {
-    return index * step + start;
-  });
-}
-/**
- * Remove and return the first item from `array` that matches the predicate
- * function.
- * 
- * @param {Array} array
- * @param {Function} predicate
- *   Invoked with the array item.
- * @return {Object} The matching item, or `null` if no match was found.
- */
-
-function remove(array, predicate) {
-  return array.find(function (item, index) {
-    if (predicate(item)) {
-      array.splice(index, 1);
-      return item;
-    }
-  });
-}
+  keywordPossibilities.push("=".concat(intValue), OTHER$1);
 
-//# sourceMappingURL=array-utils.es.js.map
-;// CONCATENATED MODULE: ./node_modules/@ultraq/function-utils/function-utils.es.js
-/**
- * A higher-order function to apply [memoization](https://en.wikipedia.org/wiki/Memoization).
- * 
- * If memoizing a recursive function, then memoize and define the function at
- * the same time so you can make a call to the memoized function, eg:
- * 
- * ```javascript
- * const myFunction = memoize(() => myFunction());
- * ```
- * 
- * @param {Function} func
- * @return {Function} 
- */
-function memoize(func) {
-  var cache = {};
-  return function () {
-    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
-      args[_key] = arguments[_key];
-    }
+  for (var i = 0; i < keywordPossibilities.length; i++) {
+    var keyword = keywordPossibilities[i];
 
-    var key = args.length ? args.map(function (arg) {
-      return arg === null ? 'null' : arg === undefined ? 'undefined' : typeof arg === 'function' ? arg.toString() : arg instanceof Date ? arg.toISOString() : JSON.stringify(arg);
-    }).join('|') : '_(no-args)_';
+    if (keyword in cases) {
+      var _replaceNumberSign = replaceNumberSign(cases[keyword], intValue),
+          caseBody = _replaceNumberSign.caseBody,
+          numberValues = _replaceNumberSign.numberValues;
 
-    if (Object.prototype.hasOwnProperty.call(cache, key)) {
-      return cache[key];
+      return format(caseBody, icu_message_formatter_es_objectSpread(icu_message_formatter_es_objectSpread({}, values), numberValues));
     }
+  }
 
-    var result = func.apply(void 0, args);
-    cache[key] = result;
-    return result;
-  };
+  return value;
 }
 
-//# sourceMappingURL=function-utils.es.js.map
-;// CONCATENATED MODULE: ./node_modules/@ultraq/icu-message-formatter/lib/icu-message-formatter.es.js
-
-
-
-
-
-
-
 /* 
  * Copyright 2019, Emanuel Rabina (http://www.ultraq.net.nz/)
  * 
@@ -2578,540 +2249,1129 @@ function memoize(func) {
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-
+var OTHER = 'other';
 /**
- * Most branch-based type handlers are based around "cases".
- * For example, `select` and `plural` compare compare a value
- * to "case keys" to choose a subtranslation.
+ * Handler for `select` statements within ICU message syntax strings.  Returns
+ * a formatted string for the branch that closely matches the current value.
  * 
- * This util splits "matches" portions provided to the aforementioned
- * handlers into case strings, and extracts any prepended arguments
- * (for example, `plural` supports an `offset:n` argument used for
- * populating the magic `#` variable).
+ * See https://formatjs.io/docs/core-concepts/icu-syntax#select-format for more
+ * details on how the `select` statement works.
  * 
- * @param {String} string
- * @return {Object} The `cases` key points to a map of all cases.
- *                  The `arguments` key points to a list of prepended arguments.
+ * @param {String} value
+ * @param {String} matches
+ * @param {String} locale
+ * @param {String} values
+ * @param {Function} format
+ * @return {String}
  */
-function parseCases(string) {
-  var isWhitespace = function isWhitespace(ch) {
-    return /\s/.test(ch);
-  };
 
-  var args = [];
-  var cases = {};
-  var currTermStart = 0;
-  var latestTerm = null;
-  var inTerm = false;
-  var i = 0;
+function selectTypeHandler(value) {
+  var matches = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
+  var values = arguments.length > 3 ? arguments[3] : undefined;
+  var format = arguments.length > 4 ? arguments[4] : undefined;
 
-  while (i < string.length) {
-    // Term ended
-    if (inTerm && (isWhitespace(string[i]) || string[i] === '{')) {
-      inTerm = false;
-      latestTerm = string.slice(currTermStart, i); // We want to process the opening char again so the case will be properly registered.
+  var _parseCases = parseCases(matches),
+      cases = _parseCases.cases;
 
-      if (string[i] === '{') {
-        i--;
-      }
-    } // New term
-    else if (!inTerm && !isWhitespace(string[i])) {
-      var caseBody = string[i] === '{'; // If there's a previous term, we can either handle a whole
-      // case, or add that as an argument.
+  if (value in cases) {
+    return format(cases[value], values);
+  } else if (OTHER in cases) {
+    return format(cases[OTHER], values);
+  }
 
-      if (latestTerm && caseBody) {
-        var branchEndIndex = findClosingBracket(string, i);
+  return value;
+}
 
-        if (branchEndIndex === -1) {
-          throw new Error("Unbalanced curly braces in string: \"".concat(string, "\""));
-        }
 
-        cases[latestTerm] = string.slice(i + 1, branchEndIndex); // Don't include the braces
+//# sourceMappingURL=icu-message-formatter.es.js.map
 
-        i = branchEndIndex; // Will be moved up where needed at end of loop.
+;// CONCATENATED MODULE: ./src/javascripts/domains/i18n/hooks.js
 
-        latestTerm = null;
-      } else {
-        if (latestTerm) {
-          args.push(latestTerm);
-          latestTerm = null;
-        }
 
-        inTerm = true;
-        currTermStart = i;
-      }
-    }
 
-    i++;
-  }
+ // The passed in locale (en-GB) is only used to call Intl.PluralRules.select() in
+// pluralTypeHandler. Since we only use exact plural matches (=0, =1 etc) we can
+// safely use en-GB all the time.
 
-  if (inTerm) {
-    latestTerm = string.slice(currTermStart);
-  }
+const formatter = new MessageFormatter('en-GB', {
+  plural: pluralTypeHandler,
+  select: selectTypeHandler
+});
+function hooks_useI18n() {
+  const translations = useSelector(Selectors.selectTranslations);
+  const locale = useSelector(Selectors.selectLocale);
+  const initialLocale = useSelector(Selectors.selectInitialLocale);
+  const t = useCallback((key, values = {}) => {
+    const translation = translations[key];
 
-  if (latestTerm) {
-    args.push(latestTerm);
-  }
+    if (!translation) {
+      return null;
+    }
 
+    return formatter.format(translation, values);
+  }, [translations]);
   return {
-    args: args,
-    cases: cases
+    t,
+    locale,
+    initialLocale
   };
 }
-/**
- * Finds the index of the matching closing curly bracket, including through
- * strings that could have nested brackets.
- * 
- * @param {String} string
- * @param {Number} fromIndex
- * @return {Number} The index of the matching closing bracket, or -1 if no
- *   closing bracket could be found.
- */
+;// CONCATENATED MODULE: ./src/javascripts/domains/i18n/reducer.js
+function i18n_reducer_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 findClosingBracket(string, fromIndex) {
-  var depth = 0;
+function i18n_reducer_objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { i18n_reducer_ownKeys(Object(source), true).forEach(function (key) { i18n_reducer_defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { i18n_reducer_ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
 
-  for (var i = fromIndex + 1; i < string.length; i++) {
-    var char = string.charAt(i);
+function i18n_reducer_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; }
 
-    if (char === '}') {
-      if (depth === 0) {
-        return i;
-      }
 
-      depth--;
-    } else if (char === '{') {
-      depth++;
+
+const defaultState = {
+  translations: {
+    'errors.configError.message': 'We are sorry this happened, please retry at a later time.',
+    'errors.configError.srText': 'A chat configuration error occurred. Our apologies, please retry at a later time.',
+    'errors.configError.title': 'Chat configuration error.',
+    'errors.general.buttonText': 'Restart chat',
+    'errors.general.message': 'Do you want to start a new chat session?',
+    'errors.general.srText': 'Something went wrong with the chat session. You can restart the chat.',
+    'errors.general.title': 'Something went wrong',
+    'errors.seamlyOffline.message': 'There might be a problem with your or our network connection. The chat session should resume as soon the connection is available again.',
+    'errors.seamlyOffline.srText': 'The chat has connection issues. There might be a problem with your or our network connection. The chat session should resume as soon as the connection is available again.',
+    'errors.seamlyOffline.title': 'Connection issues',
+    'errors.seamlyUnavailable.buttonText': 'Try again',
+    'errors.seamlyUnavailable.message': 'The server could not be reached. Try again in a little while.',
+    'errors.seamlyUnavailable.srText': 'The chat server could not be reached. Try again in a little while.',
+    'errors.seamlyUnavailable.title': 'Server unavailable'
+  },
+  isLoading: false,
+  initialLocale: undefined
+};
+/* harmony default export */ const i18n_reducer = (i18n_utils_createReducer({
+  [setInitialLocale]: (state, {
+    locale
+  }) => i18n_reducer_objectSpread(i18n_reducer_objectSpread({}, state), {}, {
+    initialLocale: locale
+  }),
+  [setLocale.pending]: state => i18n_reducer_objectSpread(i18n_reducer_objectSpread({}, state), {}, {
+    isLoading: true
+  }),
+  [setLocale.fulfilled]: (state, {
+    payload: translations,
+    meta: {
+      arg: locale
+    }
+  }) => {
+    if (!translations) {
+      return i18n_reducer_objectSpread(i18n_reducer_objectSpread({}, state), {}, {
+        isLoading: false
+      });
     }
-  }
 
-  return -1;
-}
-/**
- * Split a `{key, type, format}` block into those 3 parts, taking into account
- * nested message syntax that can exist in the `format` part.
- * 
- * @param {String} block
- * @return {Array}
- *   An array with `key`, `type`, and `format` items in that order, if present
- *   in the formatted argument block.
- */
+    return i18n_reducer_objectSpread(i18n_reducer_objectSpread({}, state), {}, {
+      isLoading: false,
+      locale,
+      translations: Object.keys(translations).sort().reduce((accum, key) => i18n_reducer_objectSpread(i18n_reducer_objectSpread({}, accum), {}, {
+        [key]: translations[key]
+      }), {})
+    });
+  },
+  [setLocale.rejected]: state => i18n_reducer_objectSpread(i18n_reducer_objectSpread({}, state), {}, {
+    isLoading: false
+  })
+}, defaultState));
+;// CONCATENATED MODULE: ./src/javascripts/domains/i18n/index.js
 
-function splitFormattedArgument(block) {
-  return split(block.slice(1, -1), ',', 3);
-}
-/**
- * Like `String.prototype.split()` but where the limit parameter causes the
- * remainder of the string to be grouped together in a final entry.
- * 
- * @private
- * @param {String} string
- * @param {String} separator
- * @param {Number} limit
- * @param {Array} [accumulator=[]]
- * @return {Array}
- */
 
-function split(string, separator, limit) {
-  var accumulator = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : [];
 
-  if (!string) {
-    return accumulator;
-  }
 
-  if (limit === 1) {
-    accumulator.push(string);
-    return accumulator;
-  }
 
-  var indexOfDelimiter = string.indexOf(separator);
+;// CONCATENATED MODULE: ./src/javascripts/domains/app/utils.js
 
-  if (indexOfDelimiter === -1) {
-    accumulator.push(string);
-    return accumulator;
+const {
+  createAction: app_utils_createAction,
+  createThunk: app_utils_createThunk,
+  createReducer: app_utils_createReducer,
+  selectState: app_utils_selectState
+} = createDomain('app');
+;// CONCATENATED MODULE: ./src/javascripts/domains/app/selectors.js
+
+
+const selectUserHasResponded = createSelector(app_utils_selectState, state => state.userHasResponded);
+
+;// 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 !== constants_visibilityStates.open) {
+    return hasResponded ? requestedVisibility || previousVisibility || constants_visibilityStates.open : constants_visibilityStates.hidden;
   }
 
-  var head = string.substring(0, indexOfDelimiter).trim();
-  var tail = string.substring(indexOfDelimiter + separator.length + 1).trim();
-  accumulator.push(head);
-  return split(tail, separator, limit - 1, accumulator);
-}
+  const baseVisibility = layoutMode === 'inline' ? constants_visibilityStates.open : constants_visibilityStates.minimized;
+  return requestedVisibility || previousVisibility || defaultVisibility || baseVisibility;
+};
+;// CONCATENATED MODULE: ./src/javascripts/domains/visibility/selectors.js
 
-/**
- * The main class for formatting messages.
- * 
- * @author Emanuel Rabina
- */
 
-var MessageFormatter = /*#__PURE__*/function () {
-  /**
-   * Creates a new formatter that can work using any of the custom type handlers
-   * you register.
-   * 
-   * @param {String} locale
-   * @param {Object} [typeHandlers={}]
-   *   Optional object where the keys are the names of the types to register,
-   *   their values being the functions that will return a nicely formatted
-   *   string for the data and locale they are given.
-   */
-  function MessageFormatter(locale) {
-    var _this = this;
+const selectVisibility = createSelector(visibility_utils_selectState, state => state.visibility);
 
-    var typeHandlers = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+;// 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; }
 
-    _classCallCheck(this, MessageFormatter);
+function seamly_state_hooks_objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { seamly_state_hooks_ownKeys(Object(source), true).forEach(function (key) { seamly_state_hooks_defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { seamly_state_hooks_ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
 
-    defineProperty_defineProperty(this, "format", memoize(function (message) {
-      var values = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
-      return flatten(_this.process(message, values)).join('');
-    }));
+function seamly_state_hooks_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; }
 
-    this.locale = locale;
-    this.typeHandlers = typeHandlers;
+
+
+
+
+const seamly_state_hooks_selectState = state => state.state;
+const seamly_state_hooks_useSeamlyStateContext = () => useSelector(seamly_state_hooks_selectState);
+const selectEvents = createSelector(seamly_state_hooks_selectState, selectConfig, ({
+  events
+}, config) => {
+  var _config$messages;
+
+  const {
+    enabled,
+    threshold
+  } = (config === null || config === void 0 ? void 0 : (_config$messages = config.messages) === null || _config$messages === void 0 ? void 0 : _config$messages.timeIndicator) ?? {};
+
+  if (!enabled) {
+    return events;
   }
-  /**
-   * Formats an ICU message syntax string using `values` for placeholder data
-   * and any currently-registered type handlers.
-   * 
-   * @param {String} message
-   * @param {Object} [values={}]
-   * @return {String}
-   */
 
+  const mappedEvents = [];
+  let previousEvent = null;
+  events.forEach((event, idx) => {
+    // always add timeIndicator to first message
+    if (idx === 0) {
+      mappedEvents.push(seamly_state_hooks_objectSpread(seamly_state_hooks_objectSpread({}, event), {}, {
+        timeIndicator: event.payload.occurredAt
+      })); // else check if diff is greater than threshold
+    } else {
+      const timeIndicator = previousEvent && microsecondsToMilliseconds(event.payload.occurredAt - previousEvent.payload.occurredAt) >= threshold ? event.payload.occurredAt : undefined;
+      mappedEvents.push(seamly_state_hooks_objectSpread(seamly_state_hooks_objectSpread({}, event), {}, {
+        timeIndicator
+      }));
+    }
 
-  _createClass(MessageFormatter, [{
-    key: "process",
-    value:
-    /**
-     * Process an ICU message syntax string using `values` for placeholder data
-     * and any currently-registered type handlers.  The result of this method is
-     * an array of the component parts after they have been processed in turn by
-     * their own type handlers.  This raw output is useful for other renderers,
-     * eg: React where components can be used instead of being forced to return
-     * raw strings.
-     * 
-     * This method is used by {@link MessageFormatter#format} where it acts as a
-     * string renderer.
-     * 
-     * @param {String} message
-     * @param {Object} [values={}]
-     * @return {Array}
-     */
-    function process(message) {
-      var values = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+    previousEvent = event;
+  });
+  return mappedEvents;
+});
+const seamly_state_hooks_useEvents = () => useSelector(selectEvents, []);
+const useSeamlyIsLoading = () => seamly_state_hooks_useSeamlyStateContext().isLoading;
+const useSeamlyHeaderData = () => seamly_state_hooks_useSeamlyStateContext().headerTitles;
+const seamly_state_hooks_useSeamlyUnreadCount = () => seamly_state_hooks_useSeamlyStateContext().unreadEvents;
+const seamly_state_hooks_useSkiplink = () => seamly_state_hooks_useSeamlyStateContext().skiplinkTargetId;
+const useSeamlyParticipant = participantId => seamly_state_hooks_useSeamlyStateContext().participantInfo.participants[participantId];
+const useSeamlyServiceInfo = () => seamly_state_hooks_useSeamlyStateContext().serviceInfo;
+const selectLastMessageEventId = createSelector(selectEvents, events => {
+  var _filteredEvents;
 
-      if (!message) {
-        return [];
-      }
+  const filteredEvents = events.filter(event => event.type === 'message');
+  return (_filteredEvents = filteredEvents[filteredEvents.length - 1]) === null || _filteredEvents === void 0 ? void 0 : _filteredEvents.payload.id;
+});
+const useLastMessageEventId = () => useSelector(selectLastMessageEventId);
+const useSeamlyIsHistoryLoaded = () => seamly_state_hooks_useSeamlyStateContext().historyLoaded;
+const useSeamlyCurrentAgent = () => {
+  const {
+    participants,
+    currentAgent
+  } = seamly_state_hooks_useSeamlyStateContext().participantInfo;
+  return currentAgent ? participants[currentAgent] : null;
+};
+const useSeamlyServiceData = key => seamly_state_hooks_useSeamlyStateContext().serviceData[key];
+const useEntryTextLimit = () => {
+  const {
+    entryMeta: {
+      options: {
+        text
+      }
+    }
+  } = seamly_state_hooks_useSeamlyStateContext();
+  const {
+    limit
+  } = text || {};
+  return {
+    hasLimit: limit != null,
+    limit: limit != null ? limit : null
+  };
+};
+const useSeamlyLayoutMode = () => {
+  const {
+    layoutMode
+  } = useConfig();
+  return {
+    isInline: layoutMode === 'inline',
+    isModal: layoutMode === 'modal',
+    isWindow: layoutMode === 'window',
+    isResolving: !layoutMode
+  };
+};
+;// 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; }
+
+function actions_objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { actions_ownKeys(Object(source), true).forEach(function (key) { actions_defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { actions_ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+
+function actions_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 setFromStorage = visibility_utils_createAction('setFromStorage', visibility => ({
+  visibility
+}));
+const validVisibilityStates = [constants_visibilityStates.open, constants_visibilityStates.minimized, constants_visibilityStates.hidden];
+const setVisibility = visibility_utils_createThunk('set', (requestedVisibility, {
+  getState,
+  extra: {
+    api,
+    eventBus
+  }
+}) => {
+  const state = getState();
+  const previousVisibility = selectVisibility(state);
+  const hasResponded = selectUserHasResponded(state);
+  const hasConversation = api.hasConversation();
+  const config = selectConfig(state);
+  const {
+    visibilityCallback = calculateVisibility,
+    layoutMode
+  } = config;
+  const {
+    unreadEvents: unreadMessageCount
+  } = seamly_state_hooks_selectState(state);
+  const calculatedVisibility = visibilityCallback({
+    hasConversation,
+    hasResponded,
+    previousVisibility,
+    requestedVisibility,
+    config
+  });
+
+  if (!validVisibilityStates.includes(calculatedVisibility)) {
+    console.error('The visibilityCallback function should return "open", "minimized" or "hidden".');
+    return undefined;
+  }
+
+  if (previousVisibility === calculatedVisibility) {
+    return undefined;
+  } // Store the user-requested visibility in order to reinitialize after refresh
+
+
+  api.store.set(StoreKey, actions_objectSpread(actions_objectSpread({}, api.store.get(StoreKey) || {}), {}, {
+    [layoutMode]: requestedVisibility
+  }));
+
+  if (requestedVisibility) {
+    eventBus.emit('ui.visible', requestedVisibility, {
+      visibility: requestedVisibility,
+      hasConversation,
+      hasResponded,
+      unreadMessageCount
+    });
+  }
+
+  return calculatedVisibility;
+});
+const actions_initialize = visibility_utils_createThunk('initialize', async (locale, {
+  dispatch,
+  getState,
+  extra: {
+    api
+  }
+}) => {
+  var _api$store$get;
+
+  // initialize stored visibility
+  const {
+    layoutMode
+  } = selectConfig(getState());
+  const storedVisibility = (_api$store$get = api.store.get(StoreKey)) === null || _api$store$get === void 0 ? void 0 : _api$store$get[layoutMode];
+
+  if (storedVisibility) {
+    dispatch(setFromStorage(storedVisibility));
+  }
+
+  dispatch(setVisibility(constants_visibilityStates.initialize));
+});
+;// CONCATENATED MODULE: ./src/javascripts/api/errors/seamly-unavailable-error.js
+/**
+ * This error is used to alert the user that there's a problem with the connection
+ * when initialising the application because of a connection issue on either the server
+ * or the client side.
+ */
+class SeamlyUnavailableError extends Error {
+  constructor(params) {
+    super(params);
+
+    if (Error.captureStackTrace) {
+      Error.captureStackTrace(this, SeamlyUnavailableError);
+    }
+
+    this.name = 'SeamlyUnavailableError';
+    this.langKey = 'errors.seamlyUnavailable';
+  }
+
+}
+;// CONCATENATED MODULE: ./src/javascripts/api/errors/seamly-base-error.js
+class SeamlyBaseError extends Error {
+  constructor(originalError, ...params) {
+    super(...params);
+
+    if (Error.captureStackTrace) {
+      Error.captureStackTrace(this, Object.getPrototypeOf(this));
+    }
+
+    this.originalError = originalError;
+  }
+
+}
+;// CONCATENATED MODULE: ./src/javascripts/api/errors/seamly-session-expired-error.js
+
+class SeamlySessionExpiredError extends SeamlyBaseError {
+  constructor(originalError, ...params) {
+    super(originalError, ...params);
+    this.name = 'SeamlySessionExpiredError';
+    this.action = 'reset';
+  }
+
+}
+;// CONCATENATED MODULE: ./src/javascripts/domains/app/actions.js
+
+
+
+
+
+
+
+const setHasResponded = app_utils_createAction('setHasResponded', hasResponded => ({
+  hasResponded
+}));
+const app_actions_initialize = app_utils_createThunk('initialize', async (config, {
+  dispatch,
+  extra: {
+    api
+  }
+}) => {
+  var _config$context;
+
+  dispatch(initialize(config));
+  let locale = config === null || config === void 0 ? void 0 : (_config$context = config.context) === null || _config$context === void 0 ? void 0 : _config$context.locale;
+
+  try {
+    const {
+      features,
+      defaultLocale
+    } = await api.getConfig();
+    dispatch({
+      type: seamly_utils_seamlyActions.SET_FEATURES,
+      features
+    });
+    locale = locale || defaultLocale;
+    dispatch(setInitialLocale(locale));
+  } catch (e) {
+    throw new SeamlyUnavailableError();
+  }
+
+  try {
+    if (api.hasConversation()) {
+      var _initialState$transla;
+
+      const initialState = await api.getConversationIntitialState();
+      dispatch({
+        type: seamly_utils_seamlyActions.SET_INITIAL_STATE,
+        initialState
+      });
+      locale = ((_initialState$transla = initialState.translation) === null || _initialState$transla === void 0 ? void 0 : _initialState$transla.locale) || locale;
+
+      if ('userResponded' in initialState) {
+        dispatch(setHasResponded(initialState.userResponded));
+      }
+    }
+  } catch (e) {
+    if (e instanceof SeamlySessionExpiredError) {
+      throw e;
+    }
+
+    throw new SeamlyUnavailableError();
+  } finally {
+    await dispatch(setLocale(locale));
+    dispatch(actions_initialize());
+  }
+});
+const actions_reset = app_utils_createAction('reset', () => {});
+;// CONCATENATED MODULE: ./src/javascripts/domains/app/hooks.js
+
+
+function hooks_useUserHasResponded() {
+  return useSelector(Selectors.selectUserHasResponded);
+}
+;// CONCATENATED MODULE: ./src/javascripts/domains/app/reducer.js
+function app_reducer_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 app_reducer_objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { app_reducer_ownKeys(Object(source), true).forEach(function (key) { app_reducer_defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { app_reducer_ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+
+function app_reducer_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 reducer_initialState = {
+  userHasResponded: false
+};
+/* harmony default export */ const app_reducer = (app_utils_createReducer({
+  [setHasResponded]: (state, {
+    hasResponded
+  }) => app_reducer_objectSpread(app_reducer_objectSpread({}, state), {}, {
+    userHasResponded: hasResponded
+  })
+}, reducer_initialState));
+;// CONCATENATED MODULE: ./src/javascripts/domains/app/index.js
+
+
+
+
+
+;// CONCATENATED MODULE: ./src/javascripts/domains/store/state-reducer.js
+function state_reducer_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 state_reducer_objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { state_reducer_ownKeys(Object(source), true).forEach(function (key) { state_reducer_defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { state_reducer_ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+
+function state_reducer_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; }
+
+// Legacy state reducer. Do not add new features here but extract/create new reducers as needed
+
+
+
+const state_reducer_initialState = {
+  events: [],
+  initialState: {},
+  unreadEvents: 0,
+  isLoading: false,
+  idleDetachCountdown: {
+    hasCountdown: false,
+    isActive: false
+  },
+  resumeConversationPrompt: false,
+  serviceInfo: {
+    activeServiceSessionId: ''
+  },
+  participantInfo: {
+    participants: {},
+    currentAgent: ''
+  },
+  headerTitles: {
+    title: null,
+    subTitle: ''
+  },
+  historyLoaded: false,
+  skiplinkTargetId: id_randomId(),
+  optionsButtonId: id_randomId(),
+  cobrowsingContainerId: id_randomId(),
+  headerCollapseButtonId: id_randomId(),
+  serviceData: {},
+  options: {
+    features: {},
+    panelActive: false,
+    optionActive: '',
+    userSelectedOptions: {}
+  },
+  showFileUpload: false,
+  currentUploads: [],
+  entryMeta: {
+    default: entryTypes.text,
+    active: entryTypes.text,
+    userSelected: null,
+    blockAutoEntrySwitch: false,
+    options: {},
+    optionsOverride: {}
+  },
+  seamlyContainerElement: null
+};
+function stateReducer(state = state_reducer_initialState, action) {
+  if (action.type === String(actions_reset)) {
+    const {
+      visible
+    } = state;
+    return state_reducer_objectSpread(state_reducer_objectSpread({}, state_reducer_initialState), {}, {
+      visible
+    });
+  }
+
+  return seamlyStateReducer(state, action);
+}
+;// CONCATENATED MODULE: ./src/javascripts/domains/forms/utils.js
+
+const {
+  createActions: forms_utils_createActions,
+  createReducer: forms_utils_createReducer,
+  selectState: forms_utils_selectState
+} = createDomain('forms');
+function utils_validate(values, schema = {}) {
+  return Object.entries(schema).reduce((errors, [key, validations]) => {
+    if (validations && !Array.isArray(validations)) {
+      // eslint-disable-next-line no-param-reassign
+      validations = [validations];
+    }
+
+    for (let i = 0; i < ((_validations = validations) === null || _validations === void 0 ? void 0 : _validations.length) ?? 0; i++) {
+      var _validations;
+
+      if (!validations[i].fn(values[key], validations[i].compareValue)) {
+        errors[key] = validations[i].errorText;
+        break;
+      }
+    }
+
+    return errors;
+  }, {});
+}
+;// CONCATENATED MODULE: ./src/javascripts/domains/forms/actions.js
+
+const [registerForm, deregisterForm] = forms_utils_createActions('form', {
+  register: (formId, persistData) => ({
+    formId,
+    persistData
+  }),
+  deregister: formId => ({
+    formId
+  })
+});
+const [registerControl, deregisterControl, updateControlValue, updateControlTouched] = forms_utils_createActions('control', {
+  register: (formId, name) => ({
+    formId,
+    name
+  }),
+  deregister: (formId, name) => ({
+    formId,
+    name
+  }),
+  updateValue: (formId, name, value) => ({
+    formId,
+    name,
+    value
+  }),
+  updateTouched: (formId, name, touched) => ({
+    formId,
+    name,
+    touched
+  })
+});
+;// CONCATENATED MODULE: ./src/javascripts/domains/redux/utils.js
+const arrayContentEquals = (a, b) => {
+  if (a === b) {
+    return true;
+  }
+
+  if (!Array.isArray(a) || !Array.isArray(b) || a.length !== b.length) {
+    return false;
+  }
+
+  return a.every((value, idx) => b[idx] === value);
+};
+const getPropSelector = (propName, orDefault) => (_, props) => props[propName] || orDefault;
+;// CONCATENATED MODULE: ./src/javascripts/domains/forms/selectors.js
+
+
+
+const getState = forms_utils_selectState;
+const selectors_getFormById = createSelector(getState, getPropSelector('formId'), (forms, formId) => forms[formId]);
+const getFormControlsByFormId = createSelector(selectors_getFormById, form => (form === null || form === void 0 ? void 0 : form.controls) || {});
+const selectors_getFormValuesByFormId = createSelector(getFormControlsByFormId, controls => {
+  const valuesObj = {};
+  Object.entries(controls).forEach(([key, {
+    value
+  }]) => {
+    valuesObj[key] = value;
+  });
+  return valuesObj;
+});
+const selectors_getControlValueByName = createSelector(getFormControlsByFormId, getPropSelector('name'), (controls, name) => {
+  var _controls$name;
+
+  return (_controls$name = controls[name]) === null || _controls$name === void 0 ? void 0 : _controls$name.value;
+});
+const selectors_getControlTouchedByName = createSelector(getFormControlsByFormId, getPropSelector('name'), (controls, name) => {
+  var _controls$name2;
+
+  return (_controls$name2 = controls[name]) === null || _controls$name2 === void 0 ? void 0 : _controls$name2.touched;
+});
+;// CONCATENATED MODULE: ./src/javascripts/domains/forms/context.js
+
+const context_FormContext = (0,external_preact_namespaceObject.createContext)({});
+/* harmony default export */ const forms_context = ((/* unused pure expression or super */ null && (context_FormContext)));
+const {
+  Provider: forms_context_Provider,
+  Consumer: context_Consumer
+} = context_FormContext;
+;// CONCATENATED MODULE: ./src/javascripts/domains/forms/hooks.js
+
+
+
+
+
+
+function hooks_useFormContext() {
+  return useContext(FormContext);
+}
+function hooks_useForm() {
+  const {
+    handleSubmit
+  } = hooks_useFormContext();
+  return {
+    handleSubmit
+  };
+}
+function hooks_useValidations(values, validationSchema) {
+  const errors = useMemo(() => validate(values, validationSchema), [values, validationSchema]);
+  return {
+    isValid: Object.keys(errors).length === 0,
+    errors
+  };
+}
+function hooks_useFormControl(name) {
+  const dispatch = useStoreDispatch();
+  const {
+    formId,
+    updateControlValue,
+    updateControlTouched,
+    errors
+  } = hooks_useFormContext();
+  const form = useSelectorWithProps(getFormById, {
+    formId
+  }, [formId]);
+  const isRegistered = !!form;
+  const isRegisteredRef = useRef();
+  isRegisteredRef.current = isRegistered;
+  const value = useSelectorWithProps(getControlValueByName, {
+    formId,
+    name
+  }, [formId, name]);
+  const touched = useSelectorWithProps(getControlTouchedByName, {
+    formId,
+    name
+  }, [formId, name]);
+  const error = errors === null || errors === void 0 ? void 0 : errors[name];
+  const isValid = !error;
+  useEffect(() => {
+    // Make sure the form is registered
+    // Since child useEffect runs before FormProvider useEffect
+    if (isRegisteredRef.current) {
+      dispatch(Actions.registerControl(formId, name));
+    }
+  }, [isRegistered, formId, name, dispatch]);
+  useLayoutEffect(() => {
+    return () => {
+      dispatch(Actions.deregisterControl(formId, name));
+    };
+  }, [isRegistered, formId, name, dispatch]); // preact uses onInput instead of onChange
+
+  const onInput = useCallback(e => updateControlValue(name, e.target.value), [name, updateControlValue]);
+  const onBlur = useCallback(() => {
+    updateControlTouched(name, true);
+  }, [updateControlTouched, name]);
+  const field = useMemo(() => ({
+    name,
+    onInput,
+    onBlur,
+    value
+  }), [name, onInput, onBlur, value]);
+  const meta = useMemo(() => ({
+    isValid,
+    error,
+    touched
+  }), [isValid, error, touched]);
+  return [field, meta];
+}
+;// CONCATENATED MODULE: ./src/javascripts/domains/forms/provider.js
+const provider_excluded = (/* unused pure expression or super */ null && (["children", "formId", "persistData", "onSubmit", "validationSchema"]));
 
-      var blockStartIndex = message.indexOf('{');
+function provider_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; }
 
-      if (blockStartIndex !== -1) {
-        var blockEndIndex = findClosingBracket(message, blockStartIndex);
+function provider_objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { provider_ownKeys(Object(source), true).forEach(function (key) { provider_defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { provider_ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
 
-        if (blockEndIndex !== -1) {
-          var block = message.substring(blockStartIndex, blockEndIndex + 1);
+function provider_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; }
 
-          if (block) {
-            var result = [];
-            var head = message.substring(0, blockStartIndex);
+function provider_objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = provider_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; }
 
-            if (head) {
-              result.push(head);
-            }
+function provider_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; }
 
-            var _splitFormattedArgume = splitFormattedArgument(block),
-                _splitFormattedArgume2 = _slicedToArray(_splitFormattedArgume, 3),
-                key = _splitFormattedArgume2[0],
-                type = _splitFormattedArgume2[1],
-                format = _splitFormattedArgume2[2];
 
-            var body = values[key];
 
-            if (body === null || body === undefined) {
-              body = '';
-            }
 
-            var typeHandler = type && this.typeHandlers[type];
-            result.push(typeHandler ? typeHandler(body, format, this.locale, values, this.process.bind(this)) : body);
-            var tail = message.substring(blockEndIndex + 1);
 
-            if (tail) {
-              result.push(this.process(tail, values));
-            }
 
-            return result;
-          }
-        } else {
-          throw new Error("Unbalanced curly braces in string: \"".concat(message, "\""));
-        }
-      }
 
-      return [message];
-    }
-  }]);
 
-  return MessageFormatter;
-}();
+function provider_FormProvider(_ref) {
+  let {
+    children,
+    formId,
+    persistData,
+    onSubmit,
+    validationSchema
+  } = _ref,
+      props = provider_objectWithoutProperties(_ref, provider_excluded);
 
-function icu_message_formatter_es_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; }
+  const dispatch = useStoreDispatch();
+  const values = useSelectorWithProps(getFormValuesByFormId, {
+    formId
+  }, [formId]);
+  const [isSubmitted, setIsSubmitted] = useState(false);
+  const [externalErrors, setExternalErrors] = useState({});
+  const {
+    isValid: validationIsValid,
+    errors: validationErrors
+  } = useValidations(values, validationSchema);
+  const errors = useMemo(() => provider_objectSpread(provider_objectSpread({}, validationErrors), externalErrors), [validationErrors, externalErrors]); // register
 
-function icu_message_formatter_es_objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { icu_message_formatter_es_ownKeys(Object(source), true).forEach(function (key) { defineProperty_defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { icu_message_formatter_es_ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
-var pluralFormatter;
-var keyCounter = 0; // All the special keywords that can be used in `plural` blocks for the various branches
+  useLayoutEffect(() => {
+    // register form in redux store
+    dispatch(Actions.registerForm(formId, persistData));
+  }, [formId, persistData, dispatch]); // deregister
 
-var ONE = 'one';
-var OTHER$1 = 'other';
-/**
- * @private
- * @param {String} caseBody
- * @param {Number} value
- * @return {Object} {caseBody: string, numberValues: object}
- */
+  useEffect(() => {
+    return () => {
+      // deregister form from redux store
+      dispatch(Actions.deregisterForm(formId));
+    };
+  }, [formId, persistData, dispatch]);
+  const updateControlValue = useCallback((name, value) => {
+    dispatch(Actions.updateControlValue(formId, name, value));
+  }, [formId, dispatch]);
+  const updateControlTouched = useCallback((name, touched) => {
+    dispatch(Actions.updateControlTouched(formId, name, touched));
+  }, [dispatch, formId]); // Function to manually set an error
 
-function replaceNumberSign(caseBody, value) {
-  var i = 0;
-  var output = '';
-  var numBraces = 0;
-  var numberValues = {};
+  const setError = useCallback((name, error) => {
+    setExternalErrors(val => {
+      return provider_objectSpread(provider_objectSpread({}, val), {}, {
+        [name]: error
+      });
+    });
+  }, [setExternalErrors]);
+  const handleSubmit = useCallback(e => {
+    e.preventDefault();
+    setIsSubmitted(true);
 
-  while (i < caseBody.length) {
-    if (caseBody[i] === '#' && !numBraces) {
-      var keyParam = "__hashToken".concat(keyCounter++);
-      output += "{".concat(keyParam, ", number}");
-      numberValues[keyParam] = value;
-    } else {
-      output += caseBody[i];
+    if (validationIsValid) {
+      onSubmit(values, {
+        updateControlValue,
+        setError
+      });
     }
+  }, [validationIsValid, onSubmit, values, updateControlValue, setError]);
+  const contextValue = useMemo(() => ({
+    formId,
+    values,
+    errors,
+    isValid: Object.keys(errors).length === 0,
+    isSubmitted,
+    handleSubmit,
+    validationSchema,
+    updateControlValue,
+    updateControlTouched
+  }), [formId, values, errors, isSubmitted, handleSubmit, validationSchema, updateControlValue, updateControlTouched]);
 
-    if (caseBody[i] === '{') {
-      numBraces++;
-    } else if (caseBody[i] === '}') {
-      numBraces--;
-    }
+  if (!formId) {
+    console.error('"formId" is required.');
+    return null;
+  }
 
-    i++;
+  if (!onSubmit) {
+    console.error('"onSubmit" is required.');
+    return null;
   }
 
-  return {
-    caseBody: output,
-    numberValues: numberValues
-  };
+  return _jsx(Provider, provider_objectSpread(provider_objectSpread({}, props), {}, {
+    value: contextValue,
+    children: children
+  }));
 }
-/**
- * Handler for `plural` statements within ICU message syntax strings.  Returns
- * a formatted string for the branch that closely matches the current value.
- * 
- * See https://formatjs.io/docs/core-concepts/icu-syntax#plural-format for more
- * details on how the `plural` statement works.
- * 
- * @param {String} value
- * @param {String} matches
- * @param {String} locale
- * @param {String} values
- * @param {Function} format
- * @return {String}
- */
+;// CONCATENATED MODULE: ./src/javascripts/domains/forms/reducer.js
+function forms_reducer_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 forms_reducer_objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { forms_reducer_ownKeys(Object(source), true).forEach(function (key) { forms_reducer_defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { forms_reducer_ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
 
-function pluralTypeHandler(value) {
-  var matches = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
-  var locale = arguments.length > 2 ? arguments[2] : undefined;
-  var values = arguments.length > 3 ? arguments[3] : undefined;
-  var format = arguments.length > 4 ? arguments[4] : undefined;
+function forms_reducer_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; }
 
-  var _parseCases = parseCases(matches),
-      args = _parseCases.args,
-      cases = _parseCases.cases;
 
-  var intValue = parseInt(value);
-  args.forEach(function (arg) {
-    if (arg.startsWith('offset:')) {
-      intValue -= parseInt(arg.slice('offset:'.length));
-    }
+
+const forms_reducer_initialState = {};
+const initialFormState = {
+  controls: {}
+};
+const initialControlState = {
+  value: '',
+  touched: false
+};
+
+function updateFormControl(state, formId, name, controlState) {
+  var _state$formId;
+
+  const currentControlState = ((_state$formId = state[formId]) === null || _state$formId === void 0 ? void 0 : _state$formId.controls[name]) || initialControlState;
+  return forms_reducer_objectSpread(forms_reducer_objectSpread({}, state), {}, {
+    [formId]: forms_reducer_objectSpread(forms_reducer_objectSpread({}, state[formId]), {}, {
+      controls: forms_reducer_objectSpread(forms_reducer_objectSpread({}, state[formId].controls), {}, {
+        [name]: forms_reducer_objectSpread(forms_reducer_objectSpread({}, currentControlState), controlState)
+      })
+    })
   });
-  var keywordPossibilities = [];
+}
 
-  if ('PluralRules' in Intl) {
-    // Effectively memoize because instantiation of `Int.*` objects is expensive.
-    if (pluralFormatter === undefined || pluralFormatter.resolvedOptions().locale !== locale) {
-      pluralFormatter = new Intl.PluralRules(locale);
+/* harmony default export */ const forms_reducer = (forms_utils_createReducer({
+  // Form handlers
+  [registerForm]: (state, {
+    formId,
+    persistData
+  }) => {
+    const formState = persistData ? state[formId] ?? forms_reducer_objectSpread(forms_reducer_objectSpread({}, initialFormState), {}, {
+      persistData
+    }) : forms_reducer_objectSpread(forms_reducer_objectSpread({}, initialFormState), {}, {
+      persistData
+    });
+    return forms_reducer_objectSpread(forms_reducer_objectSpread({}, state), {}, {
+      [formId]: formState
+    });
+  },
+  [deregisterForm]: (state, {
+    formId
+  }) => {
+    var _newState$formId;
+
+    const newState = forms_reducer_objectSpread({}, state);
+
+    if (!((_newState$formId = newState[formId]) !== null && _newState$formId !== void 0 && _newState$formId.persistData)) {
+      delete newState[formId];
     }
 
-    var pluralKeyword = pluralFormatter.select(intValue); // Other is always added last with least priority, so we don't want to add it here.
+    return newState;
+  },
+  // Form control handlers
+  [registerControl]: (state, {
+    name,
+    formId
+  }) => {
+    return updateFormControl(state, formId, name);
+  },
+  [deregisterControl]: (state, {
+    formId,
+    name
+  }) => {
+    const form = state[formId];
 
-    if (pluralKeyword !== OTHER$1) {
-      keywordPossibilities.push(pluralKeyword);
+    if (!form) {
+      return state;
     }
-  }
 
-  if (intValue === 1) {
-    keywordPossibilities.push(ONE);
+    if (form.persistData) {
+      return state;
+    }
+
+    const controls = forms_reducer_objectSpread({}, form.controls);
+
+    delete controls[name];
+    return forms_reducer_objectSpread(forms_reducer_objectSpread({}, state), {}, {
+      [formId]: forms_reducer_objectSpread(forms_reducer_objectSpread({}, form), {}, {
+        controls
+      })
+    });
+  },
+  [updateControlValue]: (state, {
+    formId,
+    name,
+    value
+  }) => {
+    return updateFormControl(state, formId, name, {
+      value
+    });
+  },
+  [updateControlTouched]: (state, {
+    formId,
+    name,
+    touched
+  }) => {
+    return updateFormControl(state, formId, name, {
+      touched
+    });
   }
+}, forms_reducer_initialState));
+;// CONCATENATED MODULE: ./src/javascripts/domains/forms/index.js
 
-  keywordPossibilities.push("=".concat(intValue), OTHER$1);
-
-  for (var i = 0; i < keywordPossibilities.length; i++) {
-    var keyword = keywordPossibilities[i];
 
-    if (keyword in cases) {
-      var _replaceNumberSign = replaceNumberSign(cases[keyword], intValue),
-          caseBody = _replaceNumberSign.caseBody,
-          numberValues = _replaceNumberSign.numberValues;
 
-      return format(caseBody, icu_message_formatter_es_objectSpread(icu_message_formatter_es_objectSpread({}, values), numberValues));
-    }
-  }
 
-  return value;
-}
 
-/* 
- * Copyright 2019, Emanuel Rabina (http://www.ultraq.net.nz/)
- * 
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- * 
- *     http://www.apache.org/licenses/LICENSE-2.0
- * 
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-var OTHER = 'other';
-/**
- * Handler for `select` statements within ICU message syntax strings.  Returns
- * a formatted string for the branch that closely matches the current value.
- * 
- * See https://formatjs.io/docs/core-concepts/icu-syntax#select-format for more
- * details on how the `select` statement works.
- * 
- * @param {String} value
- * @param {String} matches
- * @param {String} locale
- * @param {String} values
- * @param {Function} format
- * @return {String}
- */
 
-function selectTypeHandler(value) {
-  var matches = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
-  var values = arguments.length > 3 ? arguments[3] : undefined;
-  var format = arguments.length > 4 ? arguments[4] : undefined;
+;// CONCATENATED MODULE: ./src/javascripts/domains/translations/utils.js
 
-  var _parseCases = parseCases(matches),
-      cases = _parseCases.cases;
+const {
+  createActions: translations_utils_createActions,
+  createReducer: translations_utils_createReducer,
+  selectState: translations_utils_selectState
+} = createDomain('translations');
+;// CONCATENATED MODULE: ./src/javascripts/domains/translations/actions.js
 
-  if (value in cases) {
-    return format(cases[value], values);
-  } else if (OTHER in cases) {
-    return format(cases[OTHER], values);
-  }
+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/translations/selectors.js
 
-  return value;
-}
 
 
-//# sourceMappingURL=icu-message-formatter.es.js.map
+const selectors_getState = translations_utils_selectState;
+const getOriginalPayloadIds = createSelector(selectors_getState, state => state.originalPayloadIds);
+const getIsPayloadTranslated = createSelector(getOriginalPayloadIds, getPropSelector('payloadId'), (payloadIds, payloadId) => !payloadIds.includes(payloadId));
+;// CONCATENATED MODULE: ./src/javascripts/ui/components/core/seamly-api-context.js
 
-;// CONCATENATED MODULE: ./src/javascripts/domains/i18n/hooks.js
+const seamly_api_context_SeamlyApiContext = (0,external_preact_namespaceObject.createContext)(null);
+const seamly_api_context_SeamlyEventBusContext = (0,external_preact_namespaceObject.createContext)('');
+;// CONCATENATED MODULE: ./src/javascripts/ui/hooks/seamly-api-hooks.js
 
 
+const seamly_api_hooks_useSeamlyApiContext = () => useContext(SeamlyApiContext);
+const seamly_api_hooks_useSeamlyObjectStore = () => {
+  const api = seamly_api_hooks_useSeamlyApiContext();
+  return api.store || {};
+};
+const useSeamlyConversationUrl = () => {
+  const {
+    get
+  } = seamly_api_hooks_useSeamlyObjectStore();
 
- // The passed in locale (en-GB) is only used to call Intl.PluralRules.select() in
-// pluralTypeHandler. Since we only use exact plural matches (=0, =1 etc) we can
-// safely use en-GB all the time.
+  if (get) {
+    return get('conversationUrl');
+  }
 
-const formatter = new MessageFormatter('en-GB', {
-  plural: pluralTypeHandler,
-  select: selectTypeHandler
-});
-function hooks_useI18n() {
-  const translations = useSelector(Selectors.selectTranslations);
-  const locale = useSelector(Selectors.selectLocale);
-  const initialLocale = useSelector(Selectors.selectInitialLocale);
-  const t = useCallback((key, values = {}) => {
-    const translation = translations[key];
+  return null;
+};
+const seamly_api_hooks_useSeamlyHasConversation = () => {
+  const url = useSeamlyConversationUrl();
+  return !!url;
+};
+;// CONCATENATED MODULE: ./src/javascripts/ui/hooks/use-seamly-dispatch.js
 
-    if (!translation) {
-      return null;
-    }
+/* harmony default export */ const use_seamly_dispatch = ((/* unused pure expression or super */ null && (useStoreDispatch)));
+;// CONCATENATED MODULE: ./src/javascripts/ui/hooks/focus-helper-hooks.js
 
-    return formatter.format(translation, values);
-  }, [translations]);
-  return {
-    t,
-    locale,
-    initialLocale
-  };
-}
-;// CONCATENATED MODULE: ./src/javascripts/domains/i18n/reducer.js
-function i18n_reducer_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 i18n_reducer_objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { i18n_reducer_ownKeys(Object(source), true).forEach(function (key) { i18n_reducer_defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { i18n_reducer_ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
 
-function i18n_reducer_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 {
+  SET_SEAMLY_CONTAINER_ELEMENT: focus_helper_hooks_SET_SEAMLY_CONTAINER_ELEMENT
+} = seamly_utils_seamlyActions;
 
-const defaultState = {
-  translations: {
-    'errors.configError.message': 'We are sorry this happened, please retry at a later time.',
-    'errors.configError.srText': 'A chat configuration error occurred. Our apologies, please retry at a later time.',
-    'errors.configError.title': 'Chat configuration error.',
-    'errors.general.buttonText': 'Restart chat',
-    'errors.general.message': 'Do you want to start a new chat session?',
-    'errors.general.srText': 'Something went wrong with the chat session. You can restart the chat.',
-    'errors.general.title': 'Something went wrong',
-    'errors.seamlyOffline.message': 'There might be a problem with your or our network connection. The chat session should resume as soon the connection is available again.',
-    'errors.seamlyOffline.srText': 'The chat has connection issues. There might be a problem with your or our network connection. The chat session should resume as soon as the connection is available again.',
-    'errors.seamlyOffline.title': 'Connection issues'
-  },
-  isLoading: false,
-  initialLocale: undefined
+const focusWithRaf = el => {
+  requestAnimationFrame(() => {
+    requestAnimationFrame(() => {
+      const focusEl = typeof el === 'string' ? document.getElementById(el) : el;
+      focusElement(focusEl);
+    });
+  });
 };
-/* harmony default export */ const i18n_reducer = (i18n_utils_createReducer({
-  [setInitialLocale]: (state, {
-    locale
-  }) => i18n_reducer_objectSpread(i18n_reducer_objectSpread({}, state), {}, {
-    initialLocale: locale
-  }),
-  [setLocale.pending]: state => i18n_reducer_objectSpread(i18n_reducer_objectSpread({}, state), {}, {
-    isLoading: true
-  }),
-  [setLocale.fulfilled]: (state, {
-    payload: translations,
-    meta: {
-      arg: locale
-    }
-  }) => {
-    if (!translations) {
-      return i18n_reducer_objectSpread(i18n_reducer_objectSpread({}, state), {}, {
-        isLoading: false
-      });
-    }
 
-    return i18n_reducer_objectSpread(i18n_reducer_objectSpread({}, state), {}, {
-      isLoading: false,
-      locale,
-      translations: Object.keys(translations).sort().reduce((accum, key) => i18n_reducer_objectSpread(i18n_reducer_objectSpread({}, accum), {}, {
-        [key]: translations[key]
-      }), {})
+const useSeamlyContainerElement = () => {
+  const {
+    seamlyContainerElement
+  } = useSeamlyStateContext();
+  const dispatch = useSeamlyDispatchContext();
+  const setSeamlyContainerElement = useCallback(element => {
+    dispatch({
+      type: focus_helper_hooks_SET_SEAMLY_CONTAINER_ELEMENT,
+      element
     });
-  },
-  [setLocale.rejected]: state => i18n_reducer_objectSpread(i18n_reducer_objectSpread({}, state), {}, {
-    isLoading: false
-  })
-}, defaultState));
-;// CONCATENATED MODULE: ./src/javascripts/domains/i18n/index.js
+  }, [dispatch]);
+  return [seamlyContainerElement, setSeamlyContainerElement];
+};
+const focus_helper_hooks_useElementFocusingById = elementId => useCallback(() => {
+  focusWithRaf(elementId);
+}, [elementId]);
+const focus_helper_hooks_useSkiplinkTargetFocusing = () => {
+  const skiplinkTargetId = useSkiplink();
+  return focus_helper_hooks_useElementFocusingById(skiplinkTargetId);
+};
+const useFocusIfSeamlyContainedFocus = () => {
+  const containerElementRef = useRef(null);
+  const [seamlyContainerElement] = useSeamlyContainerElement();
+  containerElementRef.current = seamlyContainerElement;
+  return useCallback(elementToFocus => {
+    const focusFn = () => {
+      focusWithRaf(elementToFocus);
+    };
+
+    runIfElementContainsOrHasFocus(containerElementRef.current, focusFn);
+  }, []);
+};
+;// CONCATENATED MODULE: ./src/javascripts/ui/hooks/component-helper-hooks.js
 
 
 
+const useSeamlyAppContainerClassNames = () => {
+  return useConfig().appContainerClassNames;
+};
+const useSeamlyMessageContainerClassNames = event => {
+  const {
+    fromClient
+  } = event.payload;
+  const classNames = ['message'];
 
+  if (event.type === 'info') {
+    classNames.push('message--source-info');
+  } else if (!fromClient) {
+    classNames.push('message--source-agent');
+  } else {
+    classNames.push('message--source-user');
+  }
 
+  return classNames;
+};
+const useCobrowsingContainer = () => {
+  const {
+    cobrowsingContainerId: id
+  } = useSeamlyStateContext();
+  const focusContainer = useElementFocusingById(id);
+  return {
+    id,
+    focusContainer
+  };
+};
 ;// CONCATENATED MODULE: ./src/javascripts/ui/hooks/seamly-option-hooks.js
 function seamly_option_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; }
 
@@ -3408,14 +3668,10 @@ function hooks_useInterrupt() {
   };
 }
 ;// CONCATENATED MODULE: ./src/javascripts/api/errors/seamly-general-error.js
-class SeamlyGeneralError extends Error {
-  constructor(params) {
-    super(params);
-
-    if (Error.captureStackTrace) {
-      Error.captureStackTrace(this, SeamlyGeneralError);
-    }
 
+class SeamlyGeneralError extends SeamlyBaseError {
+  constructor(originalError, ...params) {
+    super(originalError, ...params);
     this.name = 'SeamlyGeneralError';
     this.langKey = 'errors.general';
     this.action = 'reset';
@@ -3423,56 +3679,30 @@ class SeamlyGeneralError extends Error {
 
 }
 ;// CONCATENATED MODULE: ./src/javascripts/api/errors/seamly-configuration-error.js
-class SeamlyConfigurationError extends Error {
-  constructor(params) {
-    super(params);
-
-    if (Error.captureStackTrace) {
-      Error.captureStackTrace(this, SeamlyConfigurationError);
-    }
 
+class SeamlyConfigurationError extends SeamlyBaseError {
+  constructor(originalError, ...params) {
+    super(originalError, ...params);
     this.name = 'SeamlyConfigurationError';
     this.langKey = 'errors.configError';
   }
 
-}
-;// CONCATENATED MODULE: ./src/javascripts/api/errors/seamly-session-expired-error.js
-class SeamlySessionExpiredError extends Error {
-  constructor(params) {
-    super(params);
-
-    if (Error.captureStackTrace) {
-      Error.captureStackTrace(this, SeamlySessionExpiredError);
-    }
-
-    this.name = 'SeamlySessionExpiredError';
-    this.action = 'reset';
-  }
-
 }
 ;// CONCATENATED MODULE: ./src/javascripts/api/errors/seamly-offline-error.js
-class SeamlyOfflineError extends Error {
-  constructor(params) {
-    super(params);
-
-    if (Error.captureStackTrace) {
-      Error.captureStackTrace(this, SeamlyOfflineError);
-    }
 
+class SeamlyOfflineError extends SeamlyBaseError {
+  constructor(originalError, ...params) {
+    super(originalError, ...params);
     this.name = 'SeamlyOfflineError';
     this.langKey = 'errors.seamlyOffline';
   }
 
 }
 ;// CONCATENATED MODULE: ./src/javascripts/api/errors/seamly-unauthorized-error.js
-class SeamlyUnauthorizedError extends Error {
-  constructor(params) {
-    super(params);
-
-    if (Error.captureStackTrace) {
-      Error.captureStackTrace(this, SeamlyUnauthorizedError);
-    }
 
+class SeamlyUnauthorizedError extends SeamlyBaseError {
+  constructor(originalError, ...params) {
+    super(originalError, ...params);
     this.name = 'SeamlyUnauthorizedError';
     this.langKey = 'errors.general';
     this.action = 'reset';
@@ -3486,12 +3716,23 @@ class SeamlyUnauthorizedError extends Error {
 
 
 
-const handledErrorTypes = [SeamlyGeneralError, SeamlyConfigurationError, SeamlySessionExpiredError, SeamlyOfflineError, SeamlyUnauthorizedError];
-function middleware_createMiddleware() {
+const handledErrorTypes = [SeamlyGeneralError, SeamlyConfigurationError, SeamlySessionExpiredError, SeamlyOfflineError, SeamlyUnauthorizedError, SeamlyUnavailableError];
+function middleware_createMiddleware({
+  api
+}) {
   return () => next => action => {
-    if (action.type === String(Actions.set)) {
-      if (!handledErrorTypes.some(ErrorType => action.error instanceof ErrorType)) {
-        throw action.error;
+    const {
+      error
+    } = action;
+
+    if (error) {
+      if (!handledErrorTypes.some(ErrorType => error instanceof ErrorType)) {
+        throw error;
+      } else if (error.action === 'reset') {
+        // [SMLY-942] We clear the store before a reset to force a new conversation if the page is refreshed before the conversation is reset
+        api.disconnect().then(() => {
+          api.clearStore();
+        });
       }
     }
 
@@ -3507,20 +3748,22 @@ function interrupt_reducer_defineProperty(obj, key, value) { if (key in obj) { O
 
 
 
+
 const interrupt_reducer_initialState = {
   error: undefined
 };
+
+const handleError = (state, {
+  error
+}) => interrupt_reducer_objectSpread(interrupt_reducer_objectSpread({}, state), {}, {
+  error
+});
+
 /* harmony default export */ const interrupt_reducer = (interrupt_utils_createReducer({
-  [set]: (state, {
-    error
-  }) => {
-    return interrupt_reducer_objectSpread(interrupt_reducer_objectSpread({}, state), {}, {
-      error
-    });
-  },
-  [clear]: () => {
-    return interrupt_reducer_initialState;
-  }
+  [set]: handleError,
+  [app_actions_initialize.rejected]: handleError,
+  [clear]: () => interrupt_reducer_initialState,
+  [actions_reset]: () => interrupt_reducer_initialState
 }, interrupt_reducer_initialState));
 ;// CONCATENATED MODULE: ./src/javascripts/domains/interrupt/index.js
 
@@ -3529,99 +3772,58 @@ const interrupt_reducer_initialState = {
 
 
 
-;// CONCATENATED MODULE: ./src/javascripts/domains/app/utils.js
-
-const {
-  createAction: app_utils_createAction,
-  createThunk: app_utils_createThunk,
-  createReducer: app_utils_createReducer,
-  selectState: app_utils_selectState
-} = createDomain('app');
-;// CONCATENATED MODULE: ./src/javascripts/domains/app/actions.js
-
-
-
-
-
-const setHasResponded = app_utils_createAction('setHasResponded', hasResponded => ({
-  hasResponded
-}));
-const actions_initialize = app_utils_createThunk('initialize', async (config, {
-  dispatch,
-  extra: {
-    api
-  }
-}) => {
-  try {
-    var _config$context;
+;// CONCATENATED MODULE: ./src/javascripts/domains/visibility/hooks.js
 
-    dispatch(initialize(config));
-    const {
-      features,
-      defaultLocale
-    } = await api.getConfig();
-    dispatch({
-      type: seamly_utils_seamlyActions.SET_FEATURES,
-      features
-    });
-    let locale = (config === null || config === void 0 ? void 0 : (_config$context = config.context) === null || _config$context === void 0 ? void 0 : _config$context.locale) || defaultLocale;
-    dispatch(setInitialLocale(locale));
 
-    try {
-      if (api.hasConversation()) {
-        var _initialState$transla;
 
-        const initialState = await api.getConversationIntitialState();
-        dispatch({
-          type: seamly_utils_seamlyActions.SET_INITIAL_STATE,
-          initialState
-        });
-        locale = ((_initialState$transla = initialState.translation) === null || _initialState$transla === void 0 ? void 0 : _initialState$transla.locale) || locale;
 
-        if ('userResponded' in initialState) {
-          dispatch(setHasResponded(initialState.userResponded));
-        }
-      }
-    } catch (error) {
-      dispatch(set(error));
-    }
 
-    await dispatch(setLocale(locale));
-  } catch (error) {
-    dispatch(set(error));
-  }
-});
-;// CONCATENATED MODULE: ./src/javascripts/domains/app/selectors.js
 
+const hooks_useVisibility = () => {
+  const dispatch = useStoreDispatch();
+  const visible = useSelector(Selectors.selectVisibility);
+  const isVisible = visible ? visible !== visibilityStates.hidden : false;
+  const {
+    layoutMode
+  } = useConfig();
+  const isOpen = visible && layoutMode ? visible === visibilityStates.open || layoutMode === 'inline' && visible !== visibilityStates.hidden : false;
+  const setVisibility = useCallback(visibility => dispatch(Actions.setVisibility(visibility)), [dispatch]);
+  return {
+    isVisible,
+    isOpen,
+    visible,
+    setVisibility
+  };
+};
+;// CONCATENATED MODULE: ./src/javascripts/domains/visibility/reducer.js
+function visibility_reducer_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; }
 
-const selectUserHasResponded = createSelector(app_utils_selectState, state => state.userHasResponded);
+function visibility_reducer_objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { visibility_reducer_ownKeys(Object(source), true).forEach(function (key) { visibility_reducer_defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { visibility_reducer_ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
 
-;// CONCATENATED MODULE: ./src/javascripts/domains/app/hooks.js
+function visibility_reducer_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 hooks_useUserHasResponded() {
-  return useSelector(Selectors.selectUserHasResponded);
-}
-;// CONCATENATED MODULE: ./src/javascripts/domains/app/reducer.js
-function app_reducer_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 app_reducer_objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { app_reducer_ownKeys(Object(source), true).forEach(function (key) { app_reducer_defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { app_reducer_ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
 
-function app_reducer_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 visibility_reducer_initialState = {
+  visibility: constants_visibilityStates.initialize
+};
+/* harmony default export */ const visibility_reducer = (visibility_utils_createReducer({
+  [setFromStorage]: (state, {
+    visibility
+  }) => visibility_reducer_objectSpread(visibility_reducer_objectSpread({}, state), {}, {
+    visibility
+  }),
+  [setVisibility.fulfilled]: (state, {
+    payload: visibility
+  }) => visibility ? visibility_reducer_objectSpread(visibility_reducer_objectSpread({}, state), {}, {
+    visibility
+  }) : state
+}, visibility_reducer_initialState));
+;// CONCATENATED MODULE: ./src/javascripts/domains/visibility/index.js
 
 
 
-const app_reducer_initialState = {
-  userHasResponded: false
-};
-/* harmony default export */ const app_reducer = (app_utils_createReducer({
-  [setHasResponded]: (state, {
-    hasResponded
-  }) => app_reducer_objectSpread(app_reducer_objectSpread({}, state), {}, {
-    userHasResponded: hasResponded
-  })
-}, app_reducer_initialState));
-;// CONCATENATED MODULE: ./src/javascripts/domains/app/index.js
 
 
 
@@ -3648,15 +3850,10 @@ function use_seamly_commands_defineProperty(obj, key, value) { if (key in obj) {
 
 const {
   ADD_EVENT: use_seamly_commands_ADD_EVENT,
-  CLEAR_EVENTS: use_seamly_commands_CLEAR_EVENTS,
   SET_IS_LOADING: use_seamly_commands_SET_IS_LOADING,
-  CLEAR_PARTICIPANTS: use_seamly_commands_CLEAR_PARTICIPANTS,
   SET_HEADER_SUB_TITLE: use_seamly_commands_SET_HEADER_SUB_TITLE,
   SET_INITIAL_STATE: use_seamly_commands_SET_INITIAL_STATE,
-  CLEAR_FEATURES: use_seamly_commands_CLEAR_FEATURES,
-  SET_FEATURES: use_seamly_commands_SET_FEATURES,
-  RESET_UPLOAD_STATE: use_seamly_commands_RESET_UPLOAD_STATE,
-  RESET_ENTRY_STATE: use_seamly_commands_RESET_ENTRY_STATE
+  SET_FEATURES: use_seamly_commands_SET_FEATURES
 } = seamly_utils_seamlyActions;
 
 const use_seamly_commands_useSeamlyCommands = () => {
@@ -3668,7 +3865,7 @@ const use_seamly_commands_useSeamlyCommands = () => {
   const hasConversation = useSeamlyHasConversation();
   const {
     visible: visibility
-  } = useSeamlyStateContext();
+  } = useVisibility();
   const unreadMessageCount = useSeamlyUnreadCount();
   const emitEvent = useCallback((...args) => {
     eventBus.emit(...args);
@@ -3690,26 +3887,12 @@ const use_seamly_commands_useSeamlyCommands = () => {
     });
   }, [api, appConfig, emitEvent, hasResponded, hasConversation, visibility, unreadMessageCount]);
   const reset = useCallback(async () => {
+    dispatch(AppActions.reset());
     dispatch(InterruptActions.clear());
-    dispatch({
-      type: use_seamly_commands_CLEAR_EVENTS
-    });
     dispatch({
       type: use_seamly_commands_SET_IS_LOADING,
       isLoading: true
     });
-    dispatch({
-      type: use_seamly_commands_CLEAR_PARTICIPANTS
-    });
-    dispatch({
-      type: use_seamly_commands_RESET_UPLOAD_STATE
-    });
-    dispatch({
-      type: use_seamly_commands_RESET_ENTRY_STATE
-    });
-    dispatch({
-      type: use_seamly_commands_CLEAR_FEATURES
-    });
     const {
       agentName
     } = appConfig.defaults || {};
@@ -3761,21 +3944,13 @@ const use_seamly_commands_useSeamlyCommands = () => {
 
     const message = use_seamly_commands_objectSpread(use_seamly_commands_objectSpread({}, getTextMessageBase(body)), config);
 
-    const sanitizedText = sanitizeText(body);
-
-    const sanitizedMessage = use_seamly_commands_objectSpread(use_seamly_commands_objectSpread({}, message), {}, {
-      body: {
-        text: sanitizedText
-      }
-    });
-
     api.send('message', message);
     emitEvent('message', message);
     dispatch({
       type: use_seamly_commands_ADD_EVENT,
       event: {
         type: 'message',
-        payload: sanitizedMessage
+        payload: message
       }
     });
   }, [api, dispatch, emitEvent, getTextMessageBase]);
@@ -4058,121 +4233,6 @@ const useSeamlyEntry = () => {
     setBlockAutoEntrySwitch
   };
 };
-;// CONCATENATED MODULE: ./src/javascripts/ui/hooks/use-seamly-stored-visibility.js
-function use_seamly_stored_visibility_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 use_seamly_stored_visibility_objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { use_seamly_stored_visibility_ownKeys(Object(source), true).forEach(function (key) { use_seamly_stored_visibility_defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { use_seamly_stored_visibility_ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
-
-function use_seamly_stored_visibility_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 use_seamly_stored_visibility_useSeamlyStoredVisibility = () => {
-  const {
-    layoutMode
-  } = useConfig();
-  const key = 'visibility';
-  const {
-    get,
-    set
-  } = useSeamlyObjectStore();
-  let storedVisibilityObj = {};
-  const savedVisibility = get ? get(key) : {};
-
-  if (savedVisibility) {
-    storedVisibilityObj = savedVisibility;
-  }
-
-  const setStoredVisibility = useCallback(state => {
-    const saved = get ? get(key) : {};
-    set(key, use_seamly_stored_visibility_objectSpread(use_seamly_stored_visibility_objectSpread({}, saved), {}, {
-      [layoutMode]: state
-    }));
-  }, [set, get, layoutMode]);
-  return [layoutMode ? storedVisibilityObj[layoutMode] : null, set && layoutMode ? setStoredVisibility : null];
-};
-
-/* harmony default export */ const use_seamly_stored_visibility = ((/* unused pure expression or super */ null && (use_seamly_stored_visibility_useSeamlyStoredVisibility)));
-;// CONCATENATED MODULE: ./src/javascripts/ui/hooks/use-seamly-visibility.js
-
-
-
-
-
-
-
-
-
-const {
-  SET_VISIBILITY: use_seamly_visibility_SET_VISIBILITY
-} = seamly_utils_seamlyActions;
-
-const use_seamly_visibility_useSeamlyVisibility = () => {
-  const config = useConfig();
-  const {
-    layoutMode,
-    visibilityCallback
-  } = config;
-  const {
-    visible
-  } = useSeamlyStateContext();
-  const {
-    emitEvent
-  } = useSeamlyCommands();
-  const dispatch = useSeamlyDispatchContext();
-  const [storedVisibility, setStoredVisibility] = useSeamlyStoredVisibility();
-  const hasResponded = useUserHasResponded();
-  const hasConversation = useSeamlyHasConversation();
-  const unreadMessageCount = useSeamlyUnreadCount();
-  const isVisible = visible ? visible !== visibilityStates.hidden : false;
-  const isOpen = visible && layoutMode ? visible === visibilityStates.open || layoutMode === 'inline' && visible !== visibilityStates.hidden : false;
-  const setVisibility = useCallback(visibility => {
-    const visibilityFn = visibilityCallback || calculateVisibility;
-    const requestedVisibility = visibilityFn({
-      hasConversation,
-      hasResponded,
-      previousVisibility: storedVisibility || null,
-      requestedVisibility: visibility,
-      config
-    });
-
-    if (![visibilityStates.open, visibilityStates.minimized, visibilityStates.hidden].includes(requestedVisibility)) {
-      console.error('The visibilityCallback function should return "open", "minimized" or "hidden".');
-      return;
-    }
-
-    if (requestedVisibility !== visible) {
-      if (setStoredVisibility) {
-        setStoredVisibility(requestedVisibility);
-      } // Don't broadcast the init visibility state
-
-
-      if (visibility) {
-        emitEvent('ui.visible', requestedVisibility, {
-          visibility: requestedVisibility,
-          hasConversation,
-          hasResponded,
-          unreadMessageCount
-        });
-      }
-
-      dispatch({
-        type: use_seamly_visibility_SET_VISIBILITY,
-        visible: requestedVisibility
-      });
-    }
-  }, [visible, emitEvent, dispatch, hasConversation, hasResponded, storedVisibility, visibilityCallback, config, setStoredVisibility, unreadMessageCount]);
-  return {
-    isVisible,
-    isOpen,
-    visible,
-    setVisibility
-  };
-};
-
-/* harmony default export */ const use_seamly_visibility = ((/* unused pure expression or super */ null && (use_seamly_visibility_useSeamlyVisibility)));
 ;// CONCATENATED MODULE: ./src/javascripts/ui/hooks/use-seamly-chat.js
 
 
@@ -4194,9 +4254,8 @@ const useSeamlyChat = () => {
   const {
     isOpen,
     isVisible,
-    visible,
     setVisibility
-  } = useSeamlyVisibility();
+  } = useVisibility();
   const dispatch = useSeamlyDispatchContext();
   const events = useEvents();
   const spinnerTimeout = useRef(null);
@@ -4240,7 +4299,6 @@ const useSeamlyChat = () => {
     prevIsOpen.current = isOpen;
     prevIsVisible.current = isVisible;
   }, [isOpen, isVisible, sendAssertive, t]);
-  useEffect(() => {}, [visible, sendAssertive]);
   useEffect(() => {
     // This delays the start of the loading inidicator we set when we initialise
     // the application. This is done to only avoid BSOD on initial load if DCX is slow.
@@ -4338,7 +4396,7 @@ const useSeamlyIdleDetachCountdown = () => {
   } = useSeamlyStateContext();
   const {
     isOpen: isSeamlyOpen
-  } = useSeamlyVisibility();
+  } = useVisibility();
   const stableState = useRef({});
   stableState.current = {
     hasCountdown: idleDetachCountdown.hasCountdown,
@@ -4537,8 +4595,6 @@ const useSeamlyResumeConversationPrompt = () => {
 
 
 
-
-
  // This hook isn't used within the core
 // But it is used in implementations
 // and imported directly from this file
@@ -5707,7 +5763,7 @@ function TranslationsChatStatus() {
 
 
 ;// CONCATENATED MODULE: ./src/javascripts/style-guide/components/static-core.js
-const static_core_excluded = ["translations", "interrupt", "config"];
+const static_core_excluded = ["translations", "interrupt", "config", "visibility"];
 
 function static_core_objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = static_core_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; }
 
@@ -5723,6 +5779,8 @@ function static_core_objectWithoutPropertiesLoose(source, excluded) { if (source
 
 
 
+
+
 const bareApi = {
   send: () => {},
   reset: () => {
@@ -5731,7 +5789,8 @@ const bareApi = {
   store: {
     get: () => {},
     set: () => {}
-  }
+  },
+  hasConversation: () => false
 };
 
 const SeamlyTestCore = ({
@@ -5748,7 +5807,8 @@ const SeamlyTestCore = ({
           {
       translations: translationsSlice,
       interrupt: interruptSlice,
-      config: configSlice
+      config: configSlice,
+      visibility: visibilitySlice
     } = _ref,
           restState = static_core_objectWithoutProperties(_ref, static_core_excluded);
 
@@ -5756,17 +5816,23 @@ const SeamlyTestCore = ({
       reducers: {
         state: stateReducer,
         [String(app_reducer)]: app_reducer,
-        [String(config_reducer)]: config_reducer,
         [String(reducer)]: reducer,
+        [String(forms_reducer)]: forms_reducer,
         [String(translations_reducer)]: translations_reducer,
         [String(i18n_reducer)]: i18n_reducer,
-        [String(interrupt_reducer)]: interrupt_reducer
+        [String(interrupt_reducer)]: interrupt_reducer,
+        [String(visibility_reducer)]: visibility_reducer
       },
       initialState: {
         state: restState,
         [String(translations_reducer)]: translationsSlice,
-        [String(interrupt_reducer)]: interruptSlice
-      }
+        [String(interrupt_reducer)]: interruptSlice,
+        [String(visibility_reducer)]: visibilitySlice
+      },
+      middlewares: [es.withExtraArgument({
+        api: bareApi,
+        eventBus: eventBusRef.current
+      })]
     });
     newStore.dispatch(initialize(configSlice || {}));
     newStore.dispatch(setLocale.fulfilled('en-GB', translations));
@@ -5921,7 +5987,9 @@ const baseState = {
     isActive: false
   },
   resumeConversationPrompt: false,
-  visible: web_ui_namespaceObject.visibilityStates.open,
+  visibility: {
+    visibility: web_ui_namespaceObject.visibilityStates.open
+  },
   serviceInfo: {
     activeServiceSessionId: ''
   },
@@ -6845,8 +6913,27 @@ const standardState = {
     headingText: 'System messages',
     description: ''
   }, baseState), {}, {
+    config: {
+      overrideMessages: {
+        timeIndicator: {
+          enabled: true,
+          threshold: 3600000
+        }
+      }
+    },
     participantInfo,
-    events: [participantMessage, participantMessageDefaultIcon, newTopicDivider, infoMessage, transcriptInfoMessage]
+    events: [{
+      type: 'message',
+      payload: states_objectSpread(states_objectSpread({}, shortTextMessage.payload), {}, {
+        occurredAt: (Date.now() - 86400000 * 5) * 1000,
+        id: (0,web_ui_namespaceObject.randomId)(),
+        body: {
+          text: 'Long ago when a dialog started',
+          type: 'text',
+          variables: {}
+        }
+      })
+    }, participantMessage, participantMessageDefaultIcon, newTopicDivider, transcriptInfoMessage, ...[newTranslationDividerStart, newTranslationDividerStop].map(addTranslationData), infoMessage]
   }),
   choicePromptMessages: states_objectSpread(states_objectSpread({
     category: categoryKeys.messages,
@@ -6999,34 +7086,24 @@ const standardState = {
       }
     }]
   }),
-  disconnectedInterrupt: states_objectSpread(states_objectSpread({
-    // Important: This cannot pick up the language files so the text is hard set here.
-    category: categoryKeys.errors,
-    headingText: 'Disconnected interrupt',
-    description: ''
-  }, baseState), {}, {
-    interrupt: {
-      error: new web_ui_namespaceObject.SeamlyOfflineError()
-    }
-  }),
-  generalErrorInterrupt: states_objectSpread(states_objectSpread({
+  errorWithAction: states_objectSpread(states_objectSpread({
     // Important: This cannot pick up the language files so the text is hard set here.
     category: categoryKeys.errors,
-    headingText: 'General error interrupt',
+    headingText: 'Error with a user action',
     description: ''
   }, baseState), {}, {
     interrupt: {
       error: new web_ui_namespaceObject.SeamlyGeneralError()
     }
   }),
-  configErrorInterrupt: states_objectSpread(states_objectSpread({
+  errorWithoutAction: states_objectSpread(states_objectSpread({
     // Important: This cannot pick up the language files so the text is hard set here.
     category: categoryKeys.errors,
-    headingText: 'Config error interrupt',
+    headingText: 'Error without a user action',
     description: ''
   }, baseState), {}, {
     interrupt: {
-      error: new web_ui_namespaceObject.SeamlyConfigurationError()
+      error: new web_ui_namespaceObject.SeamlyOfflineError()
     }
   }),
   privacyDisclaimer: states_objectSpread(states_objectSpread({
@@ -7574,11 +7651,11 @@ const standardState = {
     serviceInfo: {
       activeServiceSessionId: '3942159e-9878-469e-9120-f44fd6be0f35'
     },
-    events: [infoMessage, shortTextMessage, states_objectSpread(states_objectSpread({}, choicePromptMessage), {}, {
+    events: [newTranslationDividerStart, infoMessage, shortTextMessage, states_objectSpread(states_objectSpread({}, choicePromptMessage), {}, {
       payload: states_objectSpread(states_objectSpread({}, choicePromptMessage.payload), {}, {
         id: `${choicePromptMessage.payload.id}XXX`
       })
-    }), longTextMessage, userMessage, textMessageBoldItalicUnderline, newTopicDivider, newTranslationDividerStart, newTranslationDividerStop, imageMessage, fileDownloadAgentMessage, deletedFileDownloadAgentMessage, userMessageLong, videoMessage, textMessageWithLinks, textMessageWithLongLink, imageMessageWithLightbox, fileDownloadUserMessage, emptyUrlFileDownloadUserMessage, textMesageWithBullets, choicePromptMessage, ctaMessage].map(addTranslationData),
+    }), longTextMessage, userMessage, textMessageBoldItalicUnderline, newTopicDivider, newTranslationDividerStart, newTranslationDividerStop, imageMessage, fileDownloadAgentMessage, deletedFileDownloadAgentMessage, userMessageLong, videoMessage, textMessageWithLinks, textMessageWithLongLink, imageMessageWithLightbox, fileDownloadUserMessage, emptyUrlFileDownloadUserMessage, textMesageWithBullets, choicePromptMessage, ctaMessage, newTranslationDividerStop, newTranslationDividerStart].map(addTranslationData),
     translations: states_objectSpread(states_objectSpread({}, translationsSlice), {}, {
       currentLocale: 'nl',
       isActive: true,
@@ -7648,7 +7725,9 @@ const getStateObj = (layoutModes, customComponentEventBodies) => states_objectSp
       config: states_objectSpread(states_objectSpread({}, baseState.config), {}, {
         layoutMode: 'window'
       }),
-      visible: web_ui_namespaceObject.visibilityStates.minimized
+      visibility: states_objectSpread(states_objectSpread({}, baseState.visibility), {}, {
+        visibility: web_ui_namespaceObject.visibilityStates.minimized
+      })
     })
   },
   minimizedStarted: {
@@ -7659,7 +7738,9 @@ const getStateObj = (layoutModes, customComponentEventBodies) => states_objectSp
       config: states_objectSpread(states_objectSpread({}, baseState.config), {}, {
         layoutMode: 'window'
       }),
-      visible: web_ui_namespaceObject.visibilityStates.minimized,
+      visibility: states_objectSpread(states_objectSpread({}, baseState.visibility), {}, {
+        visibility: web_ui_namespaceObject.visibilityStates.minimized
+      }),
       participantInfo,
       headerTitles
     })
@@ -7672,7 +7753,9 @@ const getStateObj = (layoutModes, customComponentEventBodies) => states_objectSp
       config: states_objectSpread(states_objectSpread({}, baseState.config), {}, {
         layoutMode: 'window'
       }),
-      visible: web_ui_namespaceObject.visibilityStates.minimized,
+      visibility: states_objectSpread(states_objectSpread({}, baseState.visibility), {}, {
+        visibility: web_ui_namespaceObject.visibilityStates.minimized
+      }),
       participantInfo,
       headerTitles,
       unreadEvents: 12
@@ -7879,7 +7962,9 @@ const StyleGuideApp = ({
       if (overlay) {
         overlay.addEventListener('click', () => {
           setStaticState(s => app_objectSpread(app_objectSpread({}, s), {}, {
-            visible: 'minimized'
+            visibility: app_objectSpread(app_objectSpread({}, s.visibility), {}, {
+              visible: 'minimized'
+            })
           }));
         });
       }