42 lines
841 B
Vue
42 lines
841 B
Vue
<script setup>
|
|
const props = defineProps({
|
|
/** 렌더링할 HTML 태그 */
|
|
as: {
|
|
type: String,
|
|
default: 'div'
|
|
},
|
|
/** 팝오버 접근성 role */
|
|
role: {
|
|
type: String,
|
|
default: ''
|
|
},
|
|
/** 팝오버에 추가할 화면별 클래스 */
|
|
rootClass: {
|
|
type: String,
|
|
default: ''
|
|
},
|
|
/** 팝오버에 적용할 인라인 스타일 */
|
|
surfaceStyle: {
|
|
type: Object,
|
|
default: () => ({})
|
|
},
|
|
/** 기본 overflow 숨김 사용 여부 */
|
|
clipped: {
|
|
type: Boolean,
|
|
default: false
|
|
}
|
|
})
|
|
</script>
|
|
|
|
<template>
|
|
<component
|
|
:is="props.as"
|
|
class="admin-popover-surface border bg-white shadow-[0_18px_50px_rgba(15,23,42,0.14)]"
|
|
:class="[clipped ? 'overflow-hidden' : '', rootClass]"
|
|
:style="surfaceStyle"
|
|
:role="role || undefined"
|
|
>
|
|
<slot />
|
|
</component>
|
|
</template>
|