<template>
  <view class="uni-list" :class="{ 'uni-list--border': border }">
    <slot />
  </view>
</template>

<script setup lang="ts">
interface Props {
  border?: boolean
}
withDefaults(defineProps<Props>(), {
  border: true
})
</script>

<style scoped>
.uni-list {
  background-color: #fff;
  position: relative;
  width: 100%;
  display: flex;
  flex-direction: column;
}
.uni-list--border::after {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  height: 1px;
  content: '';
  background-color: #e5e7eb;
  transform: scaleY(0.5);
}
.uni-list--border::before {
  position: absolute;
  bottom: 0;
  right: 0;
  left: 0;
  height: 1px;
  content: '';
  background-color: #e5e7eb;
  transform: scaleY(0.5);
}
</style>
