vuestic-ui
Version:
Vue 3 UI Framework
49 lines (48 loc) • 1.04 kB
JavaScript
import { computed } from "vue";
const useAlignProps = {
align: {
type: String,
default: "left"
},
vertical: {
type: Boolean,
default: false
}
};
const horizontalMap = {
left: "flex-start",
center: "center",
right: "flex-end",
between: "space-between",
around: "space-around"
};
const verticalMap = {
left: "flex-start",
center: "center",
right: "flex-end",
stretch: "stretch"
};
const justify = (align, vertical) => {
return vertical ? "center" : align ? horizontalMap[align] : "flex-start";
};
const items = (align, vertical) => {
return vertical ? verticalMap[align] : "center";
};
function useAlign(props) {
const alignComputed = computed(() => {
return {
display: "flex",
flexDirection: props.vertical ? "column" : "row",
justifyContent: justify(props.align, props.vertical),
alignItems: items(props.align, props.vertical)
};
});
return {
alignComputed
};
}
export {
useAlign as a,
useAlignProps as u
};
//# sourceMappingURL=useAlign.js.map