<link rel="import" href="../../../../../../bower_components/paper-button/paper-button.html">
<link rel="import" href="../../../../../../bower_components/iron-a11y-keys-behavior/iron-a11y-keys-behavior.html">
<link rel="import" href="../rhodecode-unsafe-html/rhodecode-unsafe-html.html">
<dom-module id="rhodecode-toast">
    <template>
        <style include="shared-styles"></style>
        <link rel="stylesheet" href="rhodecode-toast.css">
        <template is="dom-if" if="[[hasToasts]]">
            <div class$="container toast-message-holder [[conditionalClass(isFixed)]]">
                <template is="dom-repeat" items="[[toasts]]">
                    <div class$="alert alert-[[item.level]]">
                        <div on-tap="dismissNotification" class="toast-close"  index-pos="[[index]]">
                            <span>[[_gettext('Close')]]</span>
                        </div>
                        <rhodecode-unsafe-html text="[[item.message]]"></rhodecode-unsafe-html>
                    </div>
                </template>
            </div>
        </template>
    </template>

    <script src="rhodecode-toast.js"></script>
</dom-module>