<style include="cr-shared-style">
:host {
--error-message-color: var(--color-sys-error);
}
.error {
color: var(--error-message-color);
text-align: center;
}
</style>
<div class="error" aria-live="assertive">
<template is="dom-if"
if="[[isNotEqual(messageCode, errorMessageEnum.NO_ERROR)]]"
>
<template is="dom-if" if="[[isEqual(messageCode, errorMessageEnum.GENERIC)]]">
$i18n{errorUnknown}
</template>
<template is="dom-if"
if="[[isEqual(messageCode, errorMessageEnum.ACCESS_CODE)]]"
>
$i18n{errorAccessCode}
</template>
<template is="dom-if" if="[[isEqual(messageCode, errorMessageEnum.NETWORK)]]">
$i18n{errorNetwork}
</template>
<template is="dom-if"
if="[[isEqual(messageCode, errorMessageEnum.PERMISSION)]]"
>
$i18n{errorPermission}
</template>
<template is="dom-if"
if="[[isEqual(messageCode, errorMessageEnum.TOO_MANY_REQUESTS)]]"
>
$i18n{errorTooManyRequests}
</template>
<template is="dom-if"
if="[[isEqual(messageCode, errorMessageEnum.PROFILE_SYNC_ERROR)]]"
>
$i18n{errorProfileSync}
</template>
<template is="dom-if"
if="[[isEqual(messageCode, errorMessageEnum.DIFFERENT_NETWORK)]]"
>
$i18n{errorDifferentNetwork}
</template>
</template>
</div>