{"version":3,"file":"ui-button-Bg6E6PEJ.js","sources":["../../../app/frontend/vue/src/components/ui/ui-button.vue"],"sourcesContent":["<template>\n  <component\n    :is=\"link ? 'a' : 'button'\"\n    class=\"ui-button\"\n    :target=\"target ? target : ''\"\n    :style=\"{width}\"\n    :href=\"link ? link : 'javascript:void(0);'\"\n    :class=\"[{\n               disabled,\n               'ui-button--stroke': stroke,\n               'ui-button--outline': !outline,\n               'ui-button--white': white,\n             },\n             type,\n             `${type}--${size}`\n    ]\"\n    role=\"button\"\n  >\n    <div class=\"ui-button__text\">\n      <slot />\n    </div>\n  </component>\n</template>\n\n<script>\nexport default {\n  name: 'UiButton',\n  props: {\n    link: {\n      type: [String, Boolean],\n      default: false,\n    },\n    disabled: {\n      type: Boolean,\n      default: false,\n    },\n    type: {\n      type: String,\n      default: 'dashboard',\n      validator: (v) => ['dashboard', 'landing'].includes(v),\n    },\n    size: {\n      type: String,\n      default: 'm',\n      validator: (v) => ['xs', 's', 'm', 'l', 'xl'].includes(v),\n    },\n    stroke: {\n      type: Boolean,\n      default: false,\n    },\n    outline: {\n      type: Boolean,\n      default: true,\n    },\n    width: {\n      type: String,\n      default: 'initial',\n    },\n    white: {\n      type: Boolean,\n      default: false,\n    },\n    target: {\n      type: [String, Boolean],\n      default: false,\n    },\n  },\n};\n</script>\n\n<style scoped lang=\"scss\">\n.ui-button, a.ui-button{\n  display: inline-flex;\n  align-items: center;\n  border-radius: 8px;\n  color: #FFFFFF;\n  text-align: center;\n  font-size: 16px;\n  line-height: 20px;\n  transition: all 0.2s ease-in;\n  box-sizing: border-box;\n  justify-content: center;\n  cursor: pointer;\n  user-select: none;\n  -webkit-user-select: none;\n  text-decoration: none !important;\n  padding: 0 24px;\n  border: 1px solid transparent;\n\n  &.dashboard{\n    background-color: #3899E1;\n    &--xs{\n      min-height: 38px;\n    }\n    &--s{\n      min-height: 44px;\n    }\n    &--m{\n\n    }\n    &--l{\n      min-height: 50px;\n    }\n    &--xl{\n\n    }\n  }\n\n  &.landing{\n    background-color: $ysn-blue-landing;\n    &--xs{\n      min-height: 32px;\n    }\n    &--s{\n      min-height: 40px;\n    }\n    &--m{\n      min-height: 48px;\n    }\n    &--l{\n      min-height: 56px;\n    }\n    &--xl{\n      min-height: 66px;\n      font-size: 20px;\n      line-height: 24px;\n    }\n  }\n\n  &.ui-button--white{\n    background-color: white;\n    border-color: white;\n    color: $ysn-blue-landing;\n    &.ui-button--stroke{\n      color: white;\n      border-color: white;\n      &:hover{\n        color: $ysn-blue-landing;\n      }\n    }\n    &:hover{\n      background-color: #eff7fd;\n      border-color:#eff7fd;\n    }\n  }\n\n  &--stroke{\n    &.disabled{\n      color: #A2D3FA;\n      border-color: #A2D3FA;\n    }\n    &:active{\n      background-color: $ysn-blue-landing !important;\n      color: white !important;\n    }\n    &.landing{\n      color: #3899E1;\n      border-color: #3899E1;\n      background-color: transparent;\n      &:hover{\n        background-color: #DAEDFD;\n      }\n    }\n    &.dashboard{\n      background-color: transparent;\n      color: $ysn-blue-landing;\n      border-color: $ysn-blue-landing;\n      &:hover{\n        background-color: #F0F7FC;\n      }\n    }\n    &.disabled{\n      color: #A2D3FA !important;\n      border: 1px solid #A2D3FA !important;\n    }\n    &:hover{\n      border-color: #45A7F5;\n    }\n  }\n\n  &.disabled{\n    color: #FFFFFF;\n    pointer-events: none;\n    opacity: 0.65;\n  }\n\n  &:hover{\n    background-color: transparent;\n    color: $ysn-blue-landing;\n    border-color: $ysn-blue-landing;\n  }\n\n  &:active{\n    transition: none;\n    background-color: #DAEDFD;\n    color: $ysn-blue-landing;\n    border-color: $ysn-blue-landing;\n  }\n  &:focus {\n    outline: none;\n  }\n\n  &--outline {\n    &:hover{\n      color: #fff;\n      background-color: #2087d3;\n      border-color: #2087d3;\n    }\n  }\n}\n</style>\n"],"names":["_sfc_main","name","props","link","type","String","Boolean","default","disabled","validator","v","includes","size","stroke","outline","width","white","target","_hoisted_1","class","_createBlock","_resolveDynamicComponent","$props","_normalizeClass","style","_normalizeStyle","href","role","_withCtx","_createElementVNode","_renderSlot","_ctx","$slots","_"],"mappings":"gJAyBA,MAAKA,EAAU,CACbC,KAAM,WACNC,MAAO,CACLC,KAAM,CACJC,KAAM,CAACC,OAAQC,SACfC,SAAS,GAEXC,SAAU,CACRJ,KAAME,QACNC,SAAS,GAEXH,KAAM,CACJA,KAAMC,OACNE,QAAS,YACTE,UAAYC,GAAM,CAAC,YAAa,WAAWC,SAASD,IAEtDE,KAAM,CACJR,KAAMC,OACNE,QAAS,IACTE,UAAYC,GAAM,CAAC,KAAM,IAAK,IAAK,IAAK,MAAMC,SAASD,IAEzDG,OAAQ,CACNT,KAAME,QACNC,SAAS,GAEXO,QAAS,CACPV,KAAME,QACNC,SAAS,GAEXQ,MAAO,CACLX,KAAMC,OACNE,QAAS,WAEXS,MAAO,CACLZ,KAAME,QACNC,SAAS,GAEXU,OAAQ,CACNb,KAAM,CAACC,OAAQC,SACfC,SAAS,KA9CNW,EAAA,CAAAC,MAAM,2EAjBbC,EADFC,EAESC,EAAInB,KAAA,IAAA,UAAA,CACTgB,MAHJI,GAGU,YAAW,CAAA,UAISD,EAAQd,6BAAsCc,EAAMT,6BAAwCS,EAAOR,2BAAqCQ,EAAKN,OAA+BM,EAAIlB,KAAkB,GAAAkB,EAAAlB,SAASkB,EAAIV,UAHxOK,OAAQK,EAAML,OAAGK,EAAML,OAAA,GACvBO,MALLC,SAKaH,EAAKP,QACbW,KAAMJ,EAAInB,KAAGmB,EAAInB,KAAA,sBAUlBwB,KAAK,WAhBTpB,QAAAqB,GAkBI,IAEM,CAFNC,EAEM,MAFNX,EAEM,CADJY,EAAQC,EAAAC,OAAA,UAAA,CAAA,OAAA,GAAA,QAnBdC,EAAA"}