{"version":3,"file":"use-space.mjs","sources":["../../../../../../packages/components/space/src/use-space.ts"],"sourcesContent":["import { ref, computed, watchEffect } from \"vue\";\nimport { isNumber } from \"@xplus/utils/utils\";\nimport type { SpaceProps, SpaceSize } from \"./space\";\n\nimport type { CSSProperties, StyleValue } from \"vue\";\n\nconst SIZE_MAP: Record<Exclude<SpaceSize, \"\">, number> = {\n  mini: 4,\n  small: 8,\n  medium: 12,\n  large: 16,\n};\n\nexport function useSpace(props: SpaceProps) {\n  // 拼接class\n  const classes = computed(() => [\n    \"x-space\",\n    `x-space--${props.direction}`,\n    props.class,\n  ]);\n\n  const horizontalSize = ref(0);\n  const verticalSize = ref(0);\n  // 添加样式\n  const containerStyle = computed<StyleValue>(() => {\n    const wrapKls: CSSProperties =\n      props.wrap || props.fill\n        ? { flexWrap: \"wrap\", marginBottom: `-${verticalSize.value}px` }\n        : {};\n    const alignment: CSSProperties = {\n      alignItems: props.alignment,\n    };\n    return [wrapKls, alignment, props.style];\n  });\n\n  const itemStyle = computed<StyleValue>(() => {\n    const itemBaseStyle: CSSProperties = {\n      paddingBottom: `${verticalSize.value}px`,\n      marginRight: `${horizontalSize.value}px`,\n    };\n\n    const fillStyle: CSSProperties = props.fill\n      ? { flexGrow: 1, minWidth: `${props.fillRatio}%` }\n      : {};\n\n    return [itemBaseStyle, fillStyle];\n  });\n\n  watchEffect(() => {\n    const { size = \"small\", wrap, direction: dir, fill } = props;\n\n    // when the specified size have been given\n    if (Array.isArray(size)) {\n      const [h = 0, v = 0] = size;\n      horizontalSize.value = h;\n      verticalSize.value = v;\n    } else {\n      let val: number;\n      if (isNumber(size)) {\n        val = size;\n      } else {\n        val = SIZE_MAP[size] || SIZE_MAP.small;\n      }\n\n      if ((wrap || fill) && dir === \"horizontal\") {\n        horizontalSize.value = verticalSize.value = val;\n      } else {\n        if (dir === \"horizontal\") {\n          horizontalSize.value = val;\n          verticalSize.value = 0;\n        } else {\n          verticalSize.value = val;\n          horizontalSize.value = 0;\n        }\n      }\n    }\n  });\n\n  return {\n    classes,\n    containerStyle,\n    itemStyle,\n  };\n}\n"],"names":[],"mappings":"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"}