"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});

const tslib_1 = require("tslib");

const styleh_components_1 = require("styleh-components");

const Label_1 = tslib_1.__importDefault(require("../../atoms/Text/Label"));

const Button_1 = require("../../atoms/Button");
/**
 * @todo invalid position names
 * @todo correct timing on transition
 */


const SnackBarWrapper = styleh_components_1.styled.aside.attrs({
  'data-qa': 'qa-toast'
})`display:flex;background:var(--color-black);position:fixed;margin:auto auto 0.625rem auto;padding:0.5rem 6.25rem;min-height:4.375rem;@media (max-width:768px){padding:0.5rem 1.25rem;width:calc(100% - 16px);}transform:translateY(0);transition:transform 0.24s cubic-bezier(0.4,0,0.2,1);${props => props.isVisible === false && styleh_components_1.styled.css`transform:translateY(150%);`};${props => props.isVisible === true && styleh_components_1.styled.css`transform:translateY(0%);`};${props => props.position === 'bottomleft' && styleh_components_1.styled.css`top:auto;right:auto;bottom:0;left:0;`};${props => props.position === 'bottomcenter' && styleh_components_1.styled.css`top:auto;right:0;bottom:0;left:0;`};`;
exports.SnackBarWrapper = SnackBarWrapper;
const Message = styleh_components_1.styled.withComponent(Label_1.default)`color:var(--color-pure-white);display:flex;align-items:center;justify-content:flex-start;flex:1;margin:auto;`;
exports.Message = Message; // TextButton - needs adapter?

/* align-self: flex-end; */

exports.SnackBarActionButton = styleh_components_1.styled.withComponent(Button_1.Button)`color:#009944;border:none;background-color:transparent;padding:0;margin:0;${Button_1.ButtonLabel}{margin:0;}`; //# sourceMappingURL=styled.js.map