UNPKG

vuestic-ui

Version:
1 lines 2.01 kB
{"version":3,"file":"useAlign.mjs","sources":["../../../../src/composables/useAlign.ts"],"sourcesContent":["import { computed } from 'vue'\n\nexport const useAlignProps = {\n align: {\n type: String,\n default: 'left',\n },\n vertical: {\n type: Boolean,\n default: false,\n },\n}\n\nconst horizontalMap = {\n left: 'flex-start',\n center: 'center',\n right: 'flex-end',\n between: 'space-between',\n around: 'space-around',\n}\n\nconst verticalMap = {\n left: 'flex-start',\n center: 'center',\n right: 'flex-end',\n stretch: 'stretch',\n}\n\nconst justify = (align: string, vertical: boolean) => {\n return vertical\n ? 'center'\n : align\n ? horizontalMap[align as keyof typeof horizontalMap]\n : 'flex-start'\n}\n\nconst items = (align: string, vertical: boolean) => {\n return vertical ? verticalMap[align as keyof typeof verticalMap] : 'center'\n}\n\nexport function useAlign (props: any) {\n const alignComputed = computed(() => {\n return {\n display: 'flex',\n flexDirection: props.vertical ? 'column' : 'row' as 'row' | 'column',\n justifyContent: justify(props.align, props.vertical),\n alignItems: items(props.align, props.vertical),\n }\n })\n\n return {\n alignComputed,\n }\n}\n"],"names":[],"mappings":";AAEO,MAAM,gBAAgB;AAAA,EAC3B,OAAO;AAAA,IACL,MAAM;AAAA,IACN,SAAS;AAAA,EACX;AAAA,EACA,UAAU;AAAA,IACR,MAAM;AAAA,IACN,SAAS;AAAA,EACX;AACF;AAEA,MAAM,gBAAgB;AAAA,EACpB,MAAM;AAAA,EACN,QAAQ;AAAA,EACR,OAAO;AAAA,EACP,SAAS;AAAA,EACT,QAAQ;AACV;AAEA,MAAM,cAAc;AAAA,EAClB,MAAM;AAAA,EACN,QAAQ;AAAA,EACR,OAAO;AAAA,EACP,SAAS;AACX;AAEA,MAAM,UAAU,CAAC,OAAe,aAAsB;AACpD,SAAO,WACH,WACA,QACE,cAAc,KAAmC,IACjD;AACR;AAEA,MAAM,QAAQ,CAAC,OAAe,aAAsB;AAC3C,SAAA,WAAW,YAAY,KAAiC,IAAI;AACrE;AAEO,SAAS,SAAU,OAAY;AAC9B,QAAA,gBAAgB,SAAS,MAAM;AAC5B,WAAA;AAAA,MACL,SAAS;AAAA,MACT,eAAe,MAAM,WAAW,WAAW;AAAA,MAC3C,gBAAgB,QAAQ,MAAM,OAAO,MAAM,QAAQ;AAAA,MACnD,YAAY,MAAM,MAAM,OAAO,MAAM,QAAQ;AAAA,IAAA;AAAA,EAC/C,CACD;AAEM,SAAA;AAAA,IACL;AAAA,EAAA;AAEJ;"}