vertumnus/primevue-mirror
1
0
Fork 0
mirror of https://github.com/primefaces/primevue.git synced 2025-05-09 00:42:36 +00:00
Code Issues Projects Releases Packages Wiki Activity

Refactor #4433 - Sidebar

Browse source
This commit is contained in:
Tuğçe Küçükoğlu 2023-09-19 13:23:58 +03:00
parent 66cfbe54fc
commit 0f86b62fe2
3 changed files with 29 additions and 12 deletions
Download patch file Download diff file Expand all files Collapse all files

27
components/lib/sidebar/Sidebar.vue
View file

@ -3,19 +3,22 @@
<div v-if="containerVisible" :ref="maskRef" @mousedown="onMaskClick" :class="cx('mask')" :style="sx('mask', true, { position })" v-bind="ptm('mask')">
<transition name="p-sidebar" @enter="onEnter" @after-enter="onAfterEnter" @before-leave="onBeforeLeave" @leave="onLeave" @after-leave="onAfterLeave" appear v-bind="ptm('transition')">
<div v-if="visible" :ref="containerRef" v-focustrap :class="cx('root')" role="complementary" :aria-modal="modal" @keydown="onKeydown" v-bind="{ ...$attrs, ...ptm('root') }">
<div :ref="headerContainerRef" :class="cx('header')" v-bind="ptm('header')">
<div v-if="$slots.header" :class="cx('headerContent')" v-bind="ptm('headerContent')">
<slot name="header"></slot>
<slot v-if="$slots.container" name="container" :onClose="hide"></slot>
<template v-else>
<div :ref="headerContainerRef" :class="cx('header')" v-bind="ptm('header')">
<div v-if="$slots.header" :class="cx('headerContent')" v-bind="ptm('headerContent')">
<slot name="header"></slot>
</div>
<button v-if="showCloseIcon" :ref="closeButtonRef" v-ripple autofocus type="button" :class="cx('closeButton')" :aria-label="closeAriaLabel" @click="hide" v-bind="ptm('closeButton')" data-pc-group-section="iconcontainer">
<slot name="closeicon" :class="cx('closeIcon')">
<component :is="closeIcon ? 'span' : 'TimesIcon'" :class="[cx('closeIcon'), closeIcon]" v-bind="ptm('closeIcon')"></component>
</slot>
</button>
</div>
<button v-if="showCloseIcon" :ref="closeButtonRef" v-ripple autofocus type="button" :class="cx('closeButton')" :aria-label="closeAriaLabel" @click="hide" v-bind="ptm('closeButton')" data-pc-group-section="iconcontainer">
<slot name="closeicon" :class="cx('closeIcon')">
<component :is="closeIcon ? 'span' : 'TimesIcon'" :class="[cx('closeIcon'), closeIcon]" v-bind="ptm('closeIcon')"></component>
</slot>
</button>
</div>
<div :ref="contentRef" :class="cx('content')" v-bind="ptm('content')">
<slot></slot>
</div>
<div :ref="contentRef" :class="cx('content')" v-bind="ptm('content')">
<slot></slot>
</div>
</template>
</div>
</transition>
</div>