skytek_xinliang
8af82f5900
Update documentation rules for GUIDE.md files to keep higher-level guides focused on constraints, conventions, and indexes. Add base and section component guides to the LLM development index, clarify component layering responsibilities, and fix architecture references from README to GUIDE.md.docs: reorganize component guide structure and indexes Update documentation rules for GUIDE.md files to keep higher-level guides focused on constraints, conventions, and indexes. Add base and section component guides to the LLM development index, clarify component layering responsibilities, and fix architecture references from README to GUIDE.md.
38 lines
896 B
Vue
38 lines
896 B
Vue
<script setup lang="ts">
|
|
import { computed } from 'vue'
|
|
|
|
const props = defineProps<{
|
|
label?: string
|
|
items: any[]
|
|
labelCharCount?: number
|
|
prependMarginEnd?: number
|
|
}>()
|
|
|
|
const modelValue = defineModel<any>({ required: true })
|
|
|
|
const prependMinWidth = computed(() =>
|
|
props.labelCharCount != null ? `${props.labelCharCount * 0.785}rem` : undefined,
|
|
)
|
|
|
|
const marginEndStyle = computed(() => `${props.prependMarginEnd ?? 8}px`)
|
|
</script>
|
|
|
|
<template>
|
|
<v-select v-model="modelValue" variant="outlined" density="compact" hide-details :items="items">
|
|
<template v-if="label" #prepend>
|
|
<span
|
|
class="text-title-small"
|
|
:style="prependMinWidth ? { minWidth: prependMinWidth } : undefined"
|
|
>
|
|
{{ label }}
|
|
</span>
|
|
</template>
|
|
</v-select>
|
|
</template>
|
|
|
|
<style scoped>
|
|
:deep(.v-input__prepend) {
|
|
margin-inline-end: v-bind(marginEndStyle);
|
|
}
|
|
</style>
|