{"version":3,"file":"layout-item.mjs","sources":["../../../../../packages/components/layout/src/layout-item.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, onMounted, ref } from 'vue'\nimport { useNamespace } from '@element3/hooks'\n\ninterface _config {\n  x: string\n  y: string\n  w: string\n  h: string\n}\nconst config = ref<_config>({ x: '0', y: '0', w: '50px', h: '50px' })\n\ndefineOptions({\n  name: 'ElLayoutItem',\n})\n\nconst defaultConfig = {\n  x: '0',\n  y: '0',\n  w: '50px',\n  h: '50px',\n}\n\nconst props = defineProps({\n  option: {\n    type: Object,\n    default: () => ({}),\n  },\n})\n\ndefineEmits({})\n\nconst ns = useNamespace('layout-item')\n\nonMounted(() => {\n  config.value = Object.assign(defaultConfig, props.option)\n})\n\nconst style = computed(() => {\n  const { w, h, x, y } = config.value\n  return {\n    width: w,\n    height: h,\n    left: x,\n    top: y,\n  }\n})\n</script>\n\n<template>\n  <div :class=\"ns.b()\" :style=\"style\"><slot /></div>\n</template>\n<style scoped></style>\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;AAUA,IAAA,MAAA,MAAA,GAAA,GAAA,CAAA,EAAA,CAAA,EAAA,GAAA,EAAA,CAAA,EAAA,GAAA,EAAA,CAAA,EAAA,MAAA,EAAA,CAAA,EAAA,MAAA,EAAA,CAAA,CAAA;AAMA,IAAA,MAAA,aAAA,GAAA;AAAA,MACA,CAAA,EAAA,GAAA;AAAA,MACA,CAAA,EAAA,GAAA;AAAA,MACA,CAAA,EAAA,MAAA;AAAA,MACA,CAAA,EAAA,MAAA;AAAA,KACA,CAAA;AAWA,IAAA,MAAA,EAAA,GAAA,aAAA,aAAA,CAAA,CAAA;AAEA,IAAA,SAAA,CAAA,MAAA;AACA,MAAA,MAAA,CAAA,KAAA,GAAA,MAAA,CAAA,MAAA,CAAA,aAAA,EAAA,MAAA,MAAA,CAAA,CAAA;AAAA,KACA,CAAA,CAAA;AAEA,IAAA,MAAA,KAAA,GAAA,SAAA,MAAA;AACA,MAAA,MAAA,EAAA,CAAA,EAAA,CAAA,EAAA,CAAA,EAAA,CAAA,KAAA,MAAA,CAAA,KAAA,CAAA;AACA,MAAA,OAAA;AAAA,QACA,KAAA,EAAA,CAAA;AAAA,QACA,MAAA,EAAA,CAAA;AAAA,QACA,IAAA,EAAA,CAAA;AAAA,QACA,GAAA,EAAA,CAAA;AAAA,OACA,CAAA;AAAA,KACA,CAAA,CAAA;;;;;;;;;;;;;;;"}