diff --git a/apps/showcase/doc/accordion/pt/PTViewer.vue b/apps/showcase/doc/accordion/pt/PTViewer.vue
index b03ea09e9..bb0ff2971 100644
--- a/apps/showcase/doc/accordion/pt/PTViewer.vue
+++ b/apps/showcase/doc/accordion/pt/PTViewer.vue
@@ -1,5 +1,4 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
     <DocPTViewer :docs="docs">
         <Accordion value="0">
             <AccordionPanel value="0">
diff --git a/apps/showcase/doc/avatar/pt/PTViewer.vue b/apps/showcase/doc/avatar/pt/PTViewer.vue
index 213ff18ce..1456a357a 100644
--- a/apps/showcase/doc/avatar/pt/PTViewer.vue
+++ b/apps/showcase/doc/avatar/pt/PTViewer.vue
@@ -1,6 +1,5 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
-    <DocPTViewer :docs="ptViewerDoc">
+    <DocPTViewer :docs="docs">
         <div class="flex flex-wrap gap-8">
             <AvatarGroup>
                 <Avatar label="P" size="xlarge" shape="circle" />
@@ -17,7 +16,7 @@ import { getPTOptions } from '@/components/doc/helpers';
 export default {
     data() {
         return {
-            ptViewerDoc: [
+            docs: [
                 {
                     data: getPTOptions('Avatar'),
                     key: 'Avatar'
diff --git a/apps/showcase/doc/badge/pt/PTViewer.vue b/apps/showcase/doc/badge/pt/PTViewer.vue
index 529fe50a2..063645ee2 100644
--- a/apps/showcase/doc/badge/pt/PTViewer.vue
+++ b/apps/showcase/doc/badge/pt/PTViewer.vue
@@ -1,6 +1,5 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
-    <DocPTViewer :docs="ptViewerDoc">
+    <DocPTViewer :docs="docs">
         <div class="flex flex-wrap gap-8">
             <Badge value="2"></Badge>
             <OverlayBadge value="3">
@@ -16,7 +15,7 @@ import { getPTOptions } from '@/components/doc/helpers';
 export default {
     data() {
         return {
-            ptViewerDoc: [
+            docs: [
                 {
                     data: getPTOptions('Badge'),
                     key: 'Badge'
diff --git a/apps/showcase/doc/blockui/pt/PTViewer.vue b/apps/showcase/doc/blockui/pt/PTViewer.vue
index 21c0e702c..02278c31e 100644
--- a/apps/showcase/doc/blockui/pt/PTViewer.vue
+++ b/apps/showcase/doc/blockui/pt/PTViewer.vue
@@ -1,6 +1,5 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
-    <DocPTViewer :docs="ptViewerDoc">
+    <DocPTViewer :docs="docs">
         <BlockUI blocked>
             <Panel header="Basic">
                 <p class="m-0">
@@ -18,7 +17,7 @@ import { getPTOptions } from '@/components/doc/helpers';
 export default {
     data() {
         return {
-            ptViewerDoc: [
+            docs: [
                 {
                     data: getPTOptions('BlockUI'),
                     key: 'BlockUI'
diff --git a/apps/showcase/doc/breadcrumb/pt/PTViewer.vue b/apps/showcase/doc/breadcrumb/pt/PTViewer.vue
index 3ba48a2bc..48d674785 100644
--- a/apps/showcase/doc/breadcrumb/pt/PTViewer.vue
+++ b/apps/showcase/doc/breadcrumb/pt/PTViewer.vue
@@ -1,6 +1,5 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
-    <DocPTViewer :docs="ptViewerDoc">
+    <DocPTViewer :docs="docs">
         <Breadcrumb :home="home" :model="items" />
     </DocPTViewer>
 </template>
@@ -15,7 +14,7 @@ export default {
                 icon: 'pi pi-home'
             },
             items: [{ label: 'Electronics' }, { label: 'Computer', icon: 'pi pi-desktop' }, { label: 'Accessories' }, { label: 'Keyboard' }, { label: 'Wireless' }],
-            ptViewerDoc: [
+            docs: [
                 {
                     data: getPTOptions('Breadcrumb'),
                     key: 'Breadcrumb'
diff --git a/apps/showcase/doc/button/pt/PTViewer.vue b/apps/showcase/doc/button/pt/PTViewer.vue
index b88af9914..5f94e2bee 100644
--- a/apps/showcase/doc/button/pt/PTViewer.vue
+++ b/apps/showcase/doc/button/pt/PTViewer.vue
@@ -1,5 +1,4 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
     <DocPTViewer :docs="docs">
         <Button label="Profile" icon="pi pi-user" severity="secondary" badge="2" badgeSeverity="contrast" />
     </DocPTViewer>
diff --git a/apps/showcase/doc/card/pt/PTViewer.vue b/apps/showcase/doc/card/pt/PTViewer.vue
index 983aeba9b..0150b382d 100644
--- a/apps/showcase/doc/card/pt/PTViewer.vue
+++ b/apps/showcase/doc/card/pt/PTViewer.vue
@@ -1,5 +1,4 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
     <DocPTViewer :docs="docs">
         <Card style="width: 25rem">
             <template #title>Advanced Card</template>
diff --git a/apps/showcase/doc/carousel/pt/PTViewer.vue b/apps/showcase/doc/carousel/pt/PTViewer.vue
index 981575fe5..bb81c440c 100644
--- a/apps/showcase/doc/carousel/pt/PTViewer.vue
+++ b/apps/showcase/doc/carousel/pt/PTViewer.vue
@@ -1,5 +1,4 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
     <DocPTViewer :docs="docs">
         <Carousel :value="products" :numVisible="1" :numScroll="1" :responsiveOptions="responsiveOptions" class="!w-3/4 !p-2">
             <template #item="slotProps">
diff --git a/apps/showcase/doc/cascadeselect/pt/PTViewer.vue b/apps/showcase/doc/cascadeselect/pt/PTViewer.vue
index ed61ec832..e5800ff95 100644
--- a/apps/showcase/doc/cascadeselect/pt/PTViewer.vue
+++ b/apps/showcase/doc/cascadeselect/pt/PTViewer.vue
@@ -1,6 +1,5 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
-    <DocPTViewer :docs="ptViewerDoc">
+    <DocPTViewer :docs="docs">
         <CascadeSelect v-model="selectedCity" :options="countries" optionLabel="cname" optionGroupLabel="name" :optionGroupChildren="['states', 'cities']" style="min-width: 14rem" placeholder="Select a City" />
     </DocPTViewer>
 </template>
@@ -86,7 +85,7 @@ export default {
                     ]
                 }
             ],
-            ptViewerDoc: [
+            docs: [
                 {
                     data: getPTOptions('CascadeSelect'),
                     key: 'CascadeSelect'
diff --git a/apps/showcase/doc/chart/pt/PTViewer.vue b/apps/showcase/doc/chart/pt/PTViewer.vue
index d25e903ed..6593922ec 100644
--- a/apps/showcase/doc/chart/pt/PTViewer.vue
+++ b/apps/showcase/doc/chart/pt/PTViewer.vue
@@ -1,6 +1,5 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
-    <DocPTViewer :docs="ptViewerDoc">
+    <DocPTViewer :docs="docs">
         <Chart type="bar" :data="chartData" :options="chartOptions" />
     </DocPTViewer>
 </template>
@@ -14,7 +13,7 @@ export default {
         return {
             chartData: null,
             chartOptions: null,
-            ptViewerDoc: [
+            docs: [
                 {
                     data: getPTOptions('Chart'),
                     key: 'Chart'
diff --git a/apps/showcase/doc/checkbox/pt/PTViewer.vue b/apps/showcase/doc/checkbox/pt/PTViewer.vue
index 36c8f0735..1d2b89ecf 100644
--- a/apps/showcase/doc/checkbox/pt/PTViewer.vue
+++ b/apps/showcase/doc/checkbox/pt/PTViewer.vue
@@ -1,5 +1,4 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
     <DocPTViewer :docs="docs">
         <Checkbox v-model="checked" :binary="true" />
     </DocPTViewer>
diff --git a/apps/showcase/doc/chip/pt/PTViewer.vue b/apps/showcase/doc/chip/pt/PTViewer.vue
index 8a5bebb21..6d78ba55d 100644
--- a/apps/showcase/doc/chip/pt/PTViewer.vue
+++ b/apps/showcase/doc/chip/pt/PTViewer.vue
@@ -1,6 +1,5 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
-    <DocPTViewer :docs="ptViewerDoc">
+    <DocPTViewer :docs="docs">
         <div class="flex flex-wrap gap-8">
             <Chip label="Microsoft" icon="pi pi-microsoft" removable />
             <Chip label="Xuxue Feng" image="https://primefaces.org/cdn/primevue/images/avatar/xuxuefeng.png" removable />
@@ -14,7 +13,7 @@ import { getPTOptions } from '@/components/doc/helpers';
 export default {
     data() {
         return {
-            ptViewerDoc: [
+            docs: [
                 {
                     data: getPTOptions('Chip'),
                     key: 'Chip'
diff --git a/apps/showcase/doc/colorpicker/pt/PTViewer.vue b/apps/showcase/doc/colorpicker/pt/PTViewer.vue
index 3597b759a..1f8dc5076 100644
--- a/apps/showcase/doc/colorpicker/pt/PTViewer.vue
+++ b/apps/showcase/doc/colorpicker/pt/PTViewer.vue
@@ -1,5 +1,4 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
     <DocPTViewer :docs="docs">
         <ColorPicker v-model="color" inline />
     </DocPTViewer>
diff --git a/apps/showcase/doc/confirmpopup/pt/PTViewer.vue b/apps/showcase/doc/confirmpopup/pt/PTViewer.vue
index 9c8d8f3a1..649fa2198 100644
--- a/apps/showcase/doc/confirmpopup/pt/PTViewer.vue
+++ b/apps/showcase/doc/confirmpopup/pt/PTViewer.vue
@@ -1,6 +1,5 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
-    <DocPTViewer :docs="ptViewerDoc">
+    <DocPTViewer :docs="docs">
         <ConfirmPopup group="ptviewer"></ConfirmPopup>
         <Button ref="btn" @click="confirm1($event)" label="Open Popup" outlined></Button>
     </DocPTViewer>
@@ -12,7 +11,7 @@ import { getPTOptions } from '@/components/doc/helpers';
 export default {
     data() {
         return {
-            ptViewerDoc: [
+            docs: [
                 {
                     data: getPTOptions('ConfirmPopup'),
                     key: 'ConfirmPopup'
diff --git a/apps/showcase/doc/contextmenu/pt/PTViewer.vue b/apps/showcase/doc/contextmenu/pt/PTViewer.vue
index 9197a4449..cfa29f93a 100644
--- a/apps/showcase/doc/contextmenu/pt/PTViewer.vue
+++ b/apps/showcase/doc/contextmenu/pt/PTViewer.vue
@@ -1,6 +1,5 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
-    <DocPTViewer :docs="ptViewerDoc">
+    <DocPTViewer :docs="docs">
         <img id="logo" alt="Logo" src="https://primefaces.org/cdn/primevue/images/nature/nature2.jpg" class="w-full md:w-[20rem] rounded shadow-lg" @contextmenu="onImageRightClick" aria-haspopup="true" />
         <ContextMenu ref="menu" appendTo="#logo" :model="items" />
     </DocPTViewer>
@@ -16,7 +15,7 @@ export default {
                 { label: 'Copy', icon: 'pi pi-copy' },
                 { label: 'Rename', icon: 'pi pi-file-edit' }
             ],
-            ptViewerDoc: [
+            docs: [
                 {
                     data: getPTOptions('ContextMenu'),
                     key: 'ContextMenu'
diff --git a/apps/showcase/doc/datatable/pt/PTViewer.vue b/apps/showcase/doc/datatable/pt/PTViewer.vue
index 6a98c28d5..b1d4bfe5b 100644
--- a/apps/showcase/doc/datatable/pt/PTViewer.vue
+++ b/apps/showcase/doc/datatable/pt/PTViewer.vue
@@ -1,5 +1,4 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
     <DocPTViewer :docs="docs">
         <DataTable :value="products" tableStyle="min-width: 50rem">
             <Column field="code" header="Code"></Column>
diff --git a/apps/showcase/doc/dataview/pt/PTViewer.vue b/apps/showcase/doc/dataview/pt/PTViewer.vue
index 37fef276a..5538c3c3b 100644
--- a/apps/showcase/doc/dataview/pt/PTViewer.vue
+++ b/apps/showcase/doc/dataview/pt/PTViewer.vue
@@ -1,5 +1,4 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
     <DocPTViewer :docs="docs">
         <DataView :value="products">
             <template #list="slotProps">
diff --git a/apps/showcase/doc/datepicker/pt/PTViewer.vue b/apps/showcase/doc/datepicker/pt/PTViewer.vue
index 7973527b0..029dd45dc 100644
--- a/apps/showcase/doc/datepicker/pt/PTViewer.vue
+++ b/apps/showcase/doc/datepicker/pt/PTViewer.vue
@@ -1,5 +1,4 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
     <DocPTViewer :docs="docs">
         <DatePicker v-model="date" showIcon fluid iconDisplay="input" />
     </DocPTViewer>
diff --git a/apps/showcase/doc/deferredcontent/pt/PTViewer.vue b/apps/showcase/doc/deferredcontent/pt/PTViewer.vue
index 2db92f0e0..276b2140f 100644
--- a/apps/showcase/doc/deferredcontent/pt/PTViewer.vue
+++ b/apps/showcase/doc/deferredcontent/pt/PTViewer.vue
@@ -1,5 +1,4 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
     <DocPTViewer :docs="docs">
         <DeferredContent>
             <img src="https://primefaces.org/cdn/primevue/images/nature/nature4.jpg" alt="Nature" />
diff --git a/apps/showcase/doc/dialog/pt/PTViewer.vue b/apps/showcase/doc/dialog/pt/PTViewer.vue
index 6e2827c9d..903320633 100644
--- a/apps/showcase/doc/dialog/pt/PTViewer.vue
+++ b/apps/showcase/doc/dialog/pt/PTViewer.vue
@@ -1,6 +1,5 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
-    <DocPTViewer :docs="ptViewerDoc">
+    <DocPTViewer :docs="docs">
         <Dialog v-model:visible="visible" appendTo="#doc-ptviewer" header="Edit Profile" maximizable pt:mask="!relative" :draggable="false" class="!my-auto" :style="{ width: '25rem' }">
             <span class="text-surface-500 dark:text-surface-400 block mb-8">Update your information.</span>
             <div class="flex items-center gap-4 mb-4">
@@ -28,7 +27,7 @@ export default {
     data() {
         return {
             visible: true,
-            ptViewerDoc: [
+            docs: [
                 {
                     data: getPTOptions('Dialog'),
                     key: 'Dialog'
diff --git a/apps/showcase/doc/divider/pt/PTViewer.vue b/apps/showcase/doc/divider/pt/PTViewer.vue
index cfe43251c..0bc18fb2c 100644
--- a/apps/showcase/doc/divider/pt/PTViewer.vue
+++ b/apps/showcase/doc/divider/pt/PTViewer.vue
@@ -1,5 +1,4 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
     <DocPTViewer :docs="docs">
         <div>
             <p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Asperiores debitis praesentium aliquam.</p>
diff --git a/apps/showcase/doc/dock/pt/PTViewer.vue b/apps/showcase/doc/dock/pt/PTViewer.vue
index e353ac980..f8af9ca31 100644
--- a/apps/showcase/doc/dock/pt/PTViewer.vue
+++ b/apps/showcase/doc/dock/pt/PTViewer.vue
@@ -1,6 +1,5 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
-    <DocPTViewer :docs="ptViewerDoc">
+    <DocPTViewer :docs="docs">
         <div class="relative w-full">
             <Dock :model="items">
                 <template #itemicon="{ item }">
@@ -35,7 +34,7 @@ export default {
                     icon: 'https://primefaces.org/cdn/primevue/images/dock/trash.png'
                 }
             ],
-            ptViewerDoc: [
+            docs: [
                 {
                     data: getPTOptions('Dock'),
                     key: 'Dock'
diff --git a/apps/showcase/doc/editor/pt/PTViewer.vue b/apps/showcase/doc/editor/pt/PTViewer.vue
index 8d3ad030b..7aff166f7 100644
--- a/apps/showcase/doc/editor/pt/PTViewer.vue
+++ b/apps/showcase/doc/editor/pt/PTViewer.vue
@@ -1,5 +1,4 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
     <DocPTViewer :docs="docs">
         <Editor v-model="value" editorStyle="height: 320px" />
     </DocPTViewer>
diff --git a/apps/showcase/doc/fieldset/pt/PTViewer.vue b/apps/showcase/doc/fieldset/pt/PTViewer.vue
index 0ea50c1a1..4a5f0a6bd 100644
--- a/apps/showcase/doc/fieldset/pt/PTViewer.vue
+++ b/apps/showcase/doc/fieldset/pt/PTViewer.vue
@@ -1,5 +1,4 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
     <DocPTViewer :docs="docs">
         <Fieldset legend="Header" toggleable>
             <p class="m-0">
diff --git a/apps/showcase/doc/fileupload/pt/PTViewer.vue b/apps/showcase/doc/fileupload/pt/PTViewer.vue
index b80900131..80617a851 100644
--- a/apps/showcase/doc/fileupload/pt/PTViewer.vue
+++ b/apps/showcase/doc/fileupload/pt/PTViewer.vue
@@ -1,5 +1,4 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
     <DocPTViewer :docs="docs">
         <div class="w-full">
             <FileUpload name="demo[]" url="/api/upload" :multiple="true" accept="image/*" :maxFileSize="1000000">
diff --git a/apps/showcase/doc/floatlabel/pt/PTViewer.vue b/apps/showcase/doc/floatlabel/pt/PTViewer.vue
index 63daa6ed0..012955b15 100644
--- a/apps/showcase/doc/floatlabel/pt/PTViewer.vue
+++ b/apps/showcase/doc/floatlabel/pt/PTViewer.vue
@@ -1,5 +1,4 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
     <DocPTViewer :docs="docs">
         <FloatLabel>
             <InputText id="username" v-model="value" autocomplete="off" />
diff --git a/apps/showcase/doc/fluid/pt/PTViewer.vue b/apps/showcase/doc/fluid/pt/PTViewer.vue
index a7b23424e..343b9e986 100644
--- a/apps/showcase/doc/fluid/pt/PTViewer.vue
+++ b/apps/showcase/doc/fluid/pt/PTViewer.vue
@@ -1,6 +1,5 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
-    <DocPTViewer :docs="ptViewerDoc">
+    <DocPTViewer :docs="docs">
         <Fluid>
             <InputText />
         </Fluid>
@@ -13,7 +12,7 @@ import { getPTOptions } from '@/components/doc/helpers';
 export default {
     data() {
         return {
-            ptViewerDoc: [
+            docs: [
                 {
                     data: getPTOptions('Fluid'),
                     key: 'Fluid'
diff --git a/apps/showcase/doc/galleria/pt/PTViewer.vue b/apps/showcase/doc/galleria/pt/PTViewer.vue
index 345db9be5..13deb0c3b 100644
--- a/apps/showcase/doc/galleria/pt/PTViewer.vue
+++ b/apps/showcase/doc/galleria/pt/PTViewer.vue
@@ -1,5 +1,4 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
     <DocPTViewer :docs="docs">
         <Galleria :value="images" :responsiveOptions="responsiveOptions" showItemNavigators :numVisible="5" containerStyle="max-width: 640px">
             <template #item="slotProps">
diff --git a/apps/showcase/doc/iconfield/pt/PTViewer.vue b/apps/showcase/doc/iconfield/pt/PTViewer.vue
index 36b55d087..c26ca1806 100644
--- a/apps/showcase/doc/iconfield/pt/PTViewer.vue
+++ b/apps/showcase/doc/iconfield/pt/PTViewer.vue
@@ -1,5 +1,4 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
     <DocPTViewer :docs="docs">
         <IconField>
             <InputIcon class="pi pi-search" />
diff --git a/apps/showcase/doc/iftalabel/pt/PTViewer.vue b/apps/showcase/doc/iftalabel/pt/PTViewer.vue
index be02c8395..1c8b878ac 100644
--- a/apps/showcase/doc/iftalabel/pt/PTViewer.vue
+++ b/apps/showcase/doc/iftalabel/pt/PTViewer.vue
@@ -1,5 +1,4 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
     <DocPTViewer :docs="docs">
         <IftaLabel>
             <InputText id="username" v-model="value" autocomplete="off" />
diff --git a/apps/showcase/doc/image/pt/PTViewer.vue b/apps/showcase/doc/image/pt/PTViewer.vue
index 8aa980078..48c767973 100644
--- a/apps/showcase/doc/image/pt/PTViewer.vue
+++ b/apps/showcase/doc/image/pt/PTViewer.vue
@@ -1,5 +1,4 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
     <DocPTViewer :docs="docs">
         <Image src="https://primefaces.org/cdn/primevue/images/galleria/galleria10.jpg" alt="Image" width="250" preview />
     </DocPTViewer>
diff --git a/apps/showcase/doc/inplace/pt/PTViewer.vue b/apps/showcase/doc/inplace/pt/PTViewer.vue
index 63db86257..59013c9fe 100644
--- a/apps/showcase/doc/inplace/pt/PTViewer.vue
+++ b/apps/showcase/doc/inplace/pt/PTViewer.vue
@@ -1,6 +1,5 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
-    <DocPTViewer :docs="ptViewerDoc">
+    <DocPTViewer :docs="docs">
         <Inplace>
             <template #display> View Content </template>
             <template #content>
@@ -19,7 +18,7 @@ import { getPTOptions } from '@/components/doc/helpers';
 export default {
     data() {
         return {
-            ptViewerDoc: [
+            docs: [
                 {
                     data: getPTOptions('Inplace'),
                     key: 'Inplace'
diff --git a/apps/showcase/doc/inputgroup/pt/PTViewer.vue b/apps/showcase/doc/inputgroup/pt/PTViewer.vue
index bc275bcbe..eed1df054 100644
--- a/apps/showcase/doc/inputgroup/pt/PTViewer.vue
+++ b/apps/showcase/doc/inputgroup/pt/PTViewer.vue
@@ -1,5 +1,4 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
     <DocPTViewer :docs="docs">
         <InputGroup>
             <InputGroupAddon>$</InputGroupAddon>
diff --git a/apps/showcase/doc/inputmask/pt/PTViewer.vue b/apps/showcase/doc/inputmask/pt/PTViewer.vue
index eda147a7d..bed2c11b3 100644
--- a/apps/showcase/doc/inputmask/pt/PTViewer.vue
+++ b/apps/showcase/doc/inputmask/pt/PTViewer.vue
@@ -1,5 +1,4 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
     <DocPTViewer :docs="docs">
         <InputMask id="basic" v-model="value" mask="99-999999" placeholder="99-999999" />
     </DocPTViewer>
diff --git a/apps/showcase/doc/inputnumber/pt/PTViewer.vue b/apps/showcase/doc/inputnumber/pt/PTViewer.vue
index 12b425ea8..64bf4f45d 100644
--- a/apps/showcase/doc/inputnumber/pt/PTViewer.vue
+++ b/apps/showcase/doc/inputnumber/pt/PTViewer.vue
@@ -1,5 +1,4 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
     <DocPTViewer :docs="docs">
         <InputNumber v-model="value" inputId="stacked-buttons" showButtons mode="currency" currency="USD" />
     </DocPTViewer>
diff --git a/apps/showcase/doc/inputotp/pt/PTViewer.vue b/apps/showcase/doc/inputotp/pt/PTViewer.vue
index 1e5580bca..90c1c76b9 100644
--- a/apps/showcase/doc/inputotp/pt/PTViewer.vue
+++ b/apps/showcase/doc/inputotp/pt/PTViewer.vue
@@ -1,5 +1,4 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
     <DocPTViewer :docs="docs">
         <InputOtp v-model="value" />
     </DocPTViewer>
diff --git a/apps/showcase/doc/inputtext/pt/PTViewer.vue b/apps/showcase/doc/inputtext/pt/PTViewer.vue
index a1d00a194..853afd007 100644
--- a/apps/showcase/doc/inputtext/pt/PTViewer.vue
+++ b/apps/showcase/doc/inputtext/pt/PTViewer.vue
@@ -1,5 +1,4 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
     <DocPTViewer :docs="docs">
         <InputText v-model="value" placeholder="Username" />
     </DocPTViewer>
diff --git a/apps/showcase/doc/knob/pt/PTViewer.vue b/apps/showcase/doc/knob/pt/PTViewer.vue
index 22a6f38d5..471146b5e 100644
--- a/apps/showcase/doc/knob/pt/PTViewer.vue
+++ b/apps/showcase/doc/knob/pt/PTViewer.vue
@@ -1,5 +1,4 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
     <DocPTViewer :docs="docs">
         <Knob v-model="value" />
     </DocPTViewer>
diff --git a/apps/showcase/doc/listbox/pt/PTViewer.vue b/apps/showcase/doc/listbox/pt/PTViewer.vue
index f7a41de12..1b8dab189 100644
--- a/apps/showcase/doc/listbox/pt/PTViewer.vue
+++ b/apps/showcase/doc/listbox/pt/PTViewer.vue
@@ -1,5 +1,4 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
     <DocPTViewer :docs="docs">
         <Listbox v-model="selectedCity" filter checkmark :highlightOnSelect="false" :options="groupedCities" optionLabel="label" optionGroupLabel="label" optionGroupChildren="items" class="w-full md:w-56" listStyle="max-height:250px">
             <template #optiongroup="slotProps">
diff --git a/apps/showcase/doc/megamenu/pt/PTViewer.vue b/apps/showcase/doc/megamenu/pt/PTViewer.vue
index 9cb1f9346..012237fd3 100644
--- a/apps/showcase/doc/megamenu/pt/PTViewer.vue
+++ b/apps/showcase/doc/megamenu/pt/PTViewer.vue
@@ -1,6 +1,5 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
-    <DocPTViewer :docs="ptViewerDoc">
+    <DocPTViewer :docs="docs">
         <MegaMenu :model="items" />
     </DocPTViewer>
 </template>
@@ -71,7 +70,7 @@ export default {
                     ]
                 }
             ],
-            ptViewerDoc: [
+            docs: [
                 {
                     data: getPTOptions('MegaMenu'),
                     key: 'MegaMenu'
diff --git a/apps/showcase/doc/menu/pt/PTViewer.vue b/apps/showcase/doc/menu/pt/PTViewer.vue
index a43ce301a..3a719d23f 100644
--- a/apps/showcase/doc/menu/pt/PTViewer.vue
+++ b/apps/showcase/doc/menu/pt/PTViewer.vue
@@ -1,6 +1,5 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
-    <DocPTViewer :docs="ptViewerDoc">
+    <DocPTViewer :docs="docs">
         <Menu :model="items" />
     </DocPTViewer>
 </template>
@@ -42,7 +41,7 @@ export default {
                     ]
                 }
             ],
-            ptViewerDoc: [
+            docs: [
                 {
                     data: getPTOptions('Menu'),
                     key: 'Menu'
diff --git a/apps/showcase/doc/menubar/pt/PTViewer.vue b/apps/showcase/doc/menubar/pt/PTViewer.vue
index ce7a6bf28..fc50d34eb 100644
--- a/apps/showcase/doc/menubar/pt/PTViewer.vue
+++ b/apps/showcase/doc/menubar/pt/PTViewer.vue
@@ -1,6 +1,5 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
-    <DocPTViewer :docs="ptViewerDoc">
+    <DocPTViewer :docs="docs">
         <Menubar :model="items" />
     </DocPTViewer>
 </template>
@@ -57,7 +56,7 @@ export default {
                     icon: 'pi pi-envelope'
                 }
             ],
-            ptViewerDoc: [
+            docs: [
                 {
                     data: getPTOptions('Menubar'),
                     key: 'Menubar'
diff --git a/apps/showcase/doc/message/pt/PTViewer.vue b/apps/showcase/doc/message/pt/PTViewer.vue
index a9a8ff1f8..a8b929c28 100644
--- a/apps/showcase/doc/message/pt/PTViewer.vue
+++ b/apps/showcase/doc/message/pt/PTViewer.vue
@@ -1,5 +1,4 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
     <DocPTViewer :docs="docs">
         <Message closable severity="info" icon="pi pi-send">Info Message</Message>
     </DocPTViewer>
diff --git a/apps/showcase/doc/metergroup/pt/PTViewer.vue b/apps/showcase/doc/metergroup/pt/PTViewer.vue
index c525b650b..171798ffc 100644
--- a/apps/showcase/doc/metergroup/pt/PTViewer.vue
+++ b/apps/showcase/doc/metergroup/pt/PTViewer.vue
@@ -1,6 +1,5 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
-    <DocPTViewer :docs="ptViewerDoc">
+    <DocPTViewer :docs="docs">
         <MeterGroup :value="value" />
     </DocPTViewer>
 </template>
@@ -17,7 +16,7 @@ export default {
                 { label: 'Media', color: '#60a5fa', value: 24, icon: 'pi pi-image' },
                 { label: 'System', color: '#c084fc', value: 10, icon: 'pi pi-cog' }
             ],
-            ptViewerDoc: [
+            docs: [
                 {
                     data: getPTOptions('MeterGroup'),
                     key: 'MeterGroup'
diff --git a/apps/showcase/doc/multiselect/pt/PTViewer.vue b/apps/showcase/doc/multiselect/pt/PTViewer.vue
index c414928c1..bccc5ce99 100644
--- a/apps/showcase/doc/multiselect/pt/PTViewer.vue
+++ b/apps/showcase/doc/multiselect/pt/PTViewer.vue
@@ -1,5 +1,4 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
     <DocPTViewer :docs="docs">
         <MultiSelect v-model="selectedCities" :options="groupedCities" optionLabel="label" filter optionGroupLabel="label" optionGroupChildren="items" display="chip" placeholder="Select Cities" class="w-full md:w-80">
             <template #optiongroup="slotProps">
diff --git a/apps/showcase/doc/orderlist/pt/PTViewer.vue b/apps/showcase/doc/orderlist/pt/PTViewer.vue
index d07e8b624..252668cb7 100644
--- a/apps/showcase/doc/orderlist/pt/PTViewer.vue
+++ b/apps/showcase/doc/orderlist/pt/PTViewer.vue
@@ -1,5 +1,4 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
     <DocPTViewer :docs="docs">
         <OrderList v-model="products" dataKey="id" breakpoint="575px" pt:pcList:root="w-full sm:w-56">
             <template #option="{ option }">
diff --git a/apps/showcase/doc/organizationchart/pt/PTViewer.vue b/apps/showcase/doc/organizationchart/pt/PTViewer.vue
index 05b6ad445..1e3a2fc8d 100644
--- a/apps/showcase/doc/organizationchart/pt/PTViewer.vue
+++ b/apps/showcase/doc/organizationchart/pt/PTViewer.vue
@@ -1,5 +1,4 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
     <DocPTViewer :docs="docs">
         <OrganizationChart :value="data" collapsible>
             <template #default="slotProps">
diff --git a/apps/showcase/doc/paginator/pt/PTViewer.vue b/apps/showcase/doc/paginator/pt/PTViewer.vue
index 1b180f2f7..99b0dfab9 100644
--- a/apps/showcase/doc/paginator/pt/PTViewer.vue
+++ b/apps/showcase/doc/paginator/pt/PTViewer.vue
@@ -1,6 +1,5 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
-    <DocPTViewer :docs="ptViewerDoc">
+    <DocPTViewer :docs="docs">
         <div class="w-full">
             <Paginator :rows="10" :totalRecords="120" :rowsPerPageOptions="[10, 20, 30]"></Paginator>
         </div>
@@ -13,7 +12,7 @@ import { getPTOptions } from '@/components/doc/helpers';
 export default {
     data() {
         return {
-            ptViewerDoc: [
+            docs: [
                 {
                     data: getPTOptions('Paginator'),
                     key: 'Paginator'
diff --git a/apps/showcase/doc/panel/pt/PTViewer.vue b/apps/showcase/doc/panel/pt/PTViewer.vue
index 1a3d9cb13..c8d44988e 100644
--- a/apps/showcase/doc/panel/pt/PTViewer.vue
+++ b/apps/showcase/doc/panel/pt/PTViewer.vue
@@ -1,6 +1,5 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
-    <DocPTViewer :docs="ptViewerDoc">
+    <DocPTViewer :docs="docs">
         <Panel header="Header" toggleable>
             <p class="m-0">
                 Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
@@ -16,7 +15,7 @@ import { getPTOptions } from '@/components/doc/helpers';
 export default {
     data() {
         return {
-            ptViewerDoc: [
+            docs: [
                 {
                     data: getPTOptions('Panel'),
                     key: 'Panel'
diff --git a/apps/showcase/doc/panelmenu/pt/PTViewer.vue b/apps/showcase/doc/panelmenu/pt/PTViewer.vue
index 6018ea194..66f17c045 100644
--- a/apps/showcase/doc/panelmenu/pt/PTViewer.vue
+++ b/apps/showcase/doc/panelmenu/pt/PTViewer.vue
@@ -1,6 +1,5 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
-    <DocPTViewer :docs="ptViewerDoc">
+    <DocPTViewer :docs="docs">
         <PanelMenu :model="items" class="w-full md:w-80" />
     </DocPTViewer>
 </template>
@@ -89,7 +88,7 @@ export default {
                     ]
                 }
             ],
-            ptViewerDoc: [
+            docs: [
                 {
                     data: getPTOptions('PanelMenu'),
                     key: 'PanelMenu'
diff --git a/apps/showcase/doc/password/pt/PTViewer.vue b/apps/showcase/doc/password/pt/PTViewer.vue
index 733aba4a2..3bea5fc68 100644
--- a/apps/showcase/doc/password/pt/PTViewer.vue
+++ b/apps/showcase/doc/password/pt/PTViewer.vue
@@ -1,5 +1,4 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
     <DocPTViewer :docs="docs">
         <Password v-model="value" toggleMask />
     </DocPTViewer>
diff --git a/apps/showcase/doc/picklist/pt/PTViewer.vue b/apps/showcase/doc/picklist/pt/PTViewer.vue
index 34217f1fa..6f7a753ca 100644
--- a/apps/showcase/doc/picklist/pt/PTViewer.vue
+++ b/apps/showcase/doc/picklist/pt/PTViewer.vue
@@ -1,6 +1,5 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
-    <DocPTViewer :docs="ptViewerDoc">
+    <DocPTViewer :docs="docs">
         <PickList v-model="products" dataKey="id" breakpoint="1400px" class="w-full">
             <template #option="{ option }">
                 {{ option.name }}
@@ -17,7 +16,7 @@ export default {
     data() {
         return {
             products: null,
-            ptViewerDoc: [
+            docs: [
                 {
                     data: getPTOptions('PickList'),
                     key: 'PickList'
diff --git a/apps/showcase/doc/popover/pt/PTViewer.vue b/apps/showcase/doc/popover/pt/PTViewer.vue
index e8cf83302..01e2c5347 100644
--- a/apps/showcase/doc/popover/pt/PTViewer.vue
+++ b/apps/showcase/doc/popover/pt/PTViewer.vue
@@ -1,6 +1,5 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
-    <DocPTViewer :docs="ptViewerDoc">
+    <DocPTViewer :docs="docs">
         <Button ref="btn" type="button" icon="pi pi-share-alt" label="Share" @click="toggle" />
         <Popover ref="op" appendTo="self">
             <div class="flex flex-col gap-4 w-[25rem]">
@@ -52,7 +51,7 @@ export default {
                 { name: 'Bernardo Dominic', image: 'bernardodominic.png', email: 'bernardo@email.com', role: 'Editor' },
                 { name: 'Ioni Bowcher', image: 'ionibowcher.png', email: 'ioni@email.com', role: 'Viewer' }
             ],
-            ptViewerDoc: [
+            docs: [
                 {
                     data: getPTOptions('Popover'),
                     key: 'Popover'
diff --git a/apps/showcase/doc/progressbar/pt/PTViewer.vue b/apps/showcase/doc/progressbar/pt/PTViewer.vue
index bd3c64d95..bb28d6192 100644
--- a/apps/showcase/doc/progressbar/pt/PTViewer.vue
+++ b/apps/showcase/doc/progressbar/pt/PTViewer.vue
@@ -1,6 +1,5 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
-    <DocPTViewer :docs="ptViewerDoc">
+    <DocPTViewer :docs="docs">
         <div class="w-full">
             <ProgressBar :value="50"></ProgressBar>
         </div>
@@ -13,7 +12,7 @@ import { getPTOptions } from '@/components/doc/helpers';
 export default {
     data() {
         return {
-            ptViewerDoc: [
+            docs: [
                 {
                     data: getPTOptions('ProgressBar'),
                     key: 'ProgressBar'
diff --git a/apps/showcase/doc/progressspinner/pt/PTViewer.vue b/apps/showcase/doc/progressspinner/pt/PTViewer.vue
index 1480f137b..49900e7f2 100644
--- a/apps/showcase/doc/progressspinner/pt/PTViewer.vue
+++ b/apps/showcase/doc/progressspinner/pt/PTViewer.vue
@@ -1,6 +1,5 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
-    <DocPTViewer :docs="ptViewerDoc">
+    <DocPTViewer :docs="docs">
         <ProgressSpinner />
     </DocPTViewer>
 </template>
@@ -11,7 +10,7 @@ import { getPTOptions } from '@/components/doc/helpers';
 export default {
     data() {
         return {
-            ptViewerDoc: [
+            docs: [
                 {
                     data: getPTOptions('ProgressSpinner'),
                     key: 'ProgressSpinner'
diff --git a/apps/showcase/doc/radiobutton/pt/PTViewer.vue b/apps/showcase/doc/radiobutton/pt/PTViewer.vue
index 4b7777781..8719f574d 100644
--- a/apps/showcase/doc/radiobutton/pt/PTViewer.vue
+++ b/apps/showcase/doc/radiobutton/pt/PTViewer.vue
@@ -1,5 +1,4 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
     <DocPTViewer :docs="docs">
         <RadioButton v-model="value" value="1" />
     </DocPTViewer>
diff --git a/apps/showcase/doc/rating/pt/PTViewer.vue b/apps/showcase/doc/rating/pt/PTViewer.vue
index 4d6b7365b..6a7c9972d 100644
--- a/apps/showcase/doc/rating/pt/PTViewer.vue
+++ b/apps/showcase/doc/rating/pt/PTViewer.vue
@@ -1,5 +1,4 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
     <DocPTViewer :docs="docs">
         <Rating v-model="value" />
     </DocPTViewer>
diff --git a/apps/showcase/doc/scrollpanel/pt/PTViewer.vue b/apps/showcase/doc/scrollpanel/pt/PTViewer.vue
index 04d187b50..c194ea172 100644
--- a/apps/showcase/doc/scrollpanel/pt/PTViewer.vue
+++ b/apps/showcase/doc/scrollpanel/pt/PTViewer.vue
@@ -1,5 +1,4 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
     <DocPTViewer :docs="docs">
         <ScrollPanel style="width: 100%; height: 200px" pt:bary="!visible !opacity-100">
             <p>
diff --git a/apps/showcase/doc/scrolltop/pt/PTViewer.vue b/apps/showcase/doc/scrolltop/pt/PTViewer.vue
index d014951ba..6c77cf6d8 100644
--- a/apps/showcase/doc/scrolltop/pt/PTViewer.vue
+++ b/apps/showcase/doc/scrolltop/pt/PTViewer.vue
@@ -1,6 +1,5 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
-    <DocPTViewer :docs="ptViewerDoc">
+    <DocPTViewer :docs="docs">
         <ScrollPanel style="width: 250px; height: 200px">
             <p>
                 Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Vitae et leo duis ut diam. Ultricies mi quis hendrerit dolor magna eget est lorem. Amet consectetur adipiscing
@@ -20,7 +19,7 @@ import { getPTOptions } from '@/components/doc/helpers';
 export default {
     data() {
         return {
-            ptViewerDoc: [
+            docs: [
                 {
                     data: getPTOptions('ScrollTop'),
                     key: 'ScrollTop'
diff --git a/apps/showcase/doc/select/pt/PTViewer.vue b/apps/showcase/doc/select/pt/PTViewer.vue
index 2e6c142e1..df8fde02e 100644
--- a/apps/showcase/doc/select/pt/PTViewer.vue
+++ b/apps/showcase/doc/select/pt/PTViewer.vue
@@ -1,5 +1,4 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
     <DocPTViewer :docs="docs">
         <Select v-model="selectedCity" filter :options="groupedCities" optionLabel="label" optionGroupLabel="label" optionGroupChildren="items" placeholder="Select a City" class="w-full md:w-56">
             <template #optiongroup="slotProps">
diff --git a/apps/showcase/doc/selectbutton/pt/PTViewer.vue b/apps/showcase/doc/selectbutton/pt/PTViewer.vue
index 1a7427bb3..87d123d85 100644
--- a/apps/showcase/doc/selectbutton/pt/PTViewer.vue
+++ b/apps/showcase/doc/selectbutton/pt/PTViewer.vue
@@ -1,5 +1,4 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
     <DocPTViewer :docs="docs">
         <SelectButton v-model="value" :options="options" />
     </DocPTViewer>
diff --git a/apps/showcase/doc/skeleton/pt/PTViewer.vue b/apps/showcase/doc/skeleton/pt/PTViewer.vue
index be4462c10..dc2aca8e9 100644
--- a/apps/showcase/doc/skeleton/pt/PTViewer.vue
+++ b/apps/showcase/doc/skeleton/pt/PTViewer.vue
@@ -1,6 +1,5 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
-    <DocPTViewer :docs="ptViewerDoc">
+    <DocPTViewer :docs="docs">
         <div class="w-full">
             <Skeleton class="mb-2"></Skeleton>
             <Skeleton width="10rem" class="mb-2"></Skeleton>
@@ -17,7 +16,7 @@ import { getPTOptions } from '@/components/doc/helpers';
 export default {
     data() {
         return {
-            ptViewerDoc: [
+            docs: [
                 {
                     data: getPTOptions('Skeleton'),
                     key: 'Skeleton'
diff --git a/apps/showcase/doc/slider/pt/PTViewer.vue b/apps/showcase/doc/slider/pt/PTViewer.vue
index ad02f4e73..dfe19eaa1 100644
--- a/apps/showcase/doc/slider/pt/PTViewer.vue
+++ b/apps/showcase/doc/slider/pt/PTViewer.vue
@@ -1,5 +1,4 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
     <DocPTViewer :docs="docs">
         <Slider v-model="value" class="w-56" />
     </DocPTViewer>
diff --git a/apps/showcase/doc/speeddial/pt/PTViewer.vue b/apps/showcase/doc/speeddial/pt/PTViewer.vue
index 064569ace..7a97d3d53 100644
--- a/apps/showcase/doc/speeddial/pt/PTViewer.vue
+++ b/apps/showcase/doc/speeddial/pt/PTViewer.vue
@@ -1,5 +1,4 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
     <DocPTViewer :docs="docs">
         <div style="position: relative; height: 300px">
             <SpeedDial :model="items" direction="down" style="position: absolute; left: calc(50% - 2rem); top: 0" />
diff --git a/apps/showcase/doc/splitbutton/pt/PTViewer.vue b/apps/showcase/doc/splitbutton/pt/PTViewer.vue
index 672e5e0e2..e7f44a040 100644
--- a/apps/showcase/doc/splitbutton/pt/PTViewer.vue
+++ b/apps/showcase/doc/splitbutton/pt/PTViewer.vue
@@ -1,7 +1,6 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
     <DocPTViewer :docs="docs">
-        <SplitButton label="Save" icon="pi pi-check" dropdownIcon="pi pi-cog" @click="save" :model="items" />
+        <SplitButton label="Save" icon="pi pi-check" dropdownIcon="pi pi-cog" :model="items" />
     </DocPTViewer>
 </template>
 
diff --git a/apps/showcase/doc/splitter/pt/PTViewer.vue b/apps/showcase/doc/splitter/pt/PTViewer.vue
index 82dcdb76f..45dc7f683 100644
--- a/apps/showcase/doc/splitter/pt/PTViewer.vue
+++ b/apps/showcase/doc/splitter/pt/PTViewer.vue
@@ -1,5 +1,4 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
     <DocPTViewer :docs="docs">
         <Splitter style="height: 300px" class="w-full">
             <SplitterPanel class="flex items-center justify-center"> Panel 1 </SplitterPanel>
diff --git a/apps/showcase/doc/stepper/pt/PTViewer.vue b/apps/showcase/doc/stepper/pt/PTViewer.vue
index 21485d28f..34f514894 100644
--- a/apps/showcase/doc/stepper/pt/PTViewer.vue
+++ b/apps/showcase/doc/stepper/pt/PTViewer.vue
@@ -1,5 +1,4 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
     <DocPTViewer :docs="docs">
         <Stepper value="1" class="basis-[50rem]" linear>
             <StepList :style="{ overflowX: 'unset' }">
diff --git a/apps/showcase/doc/tabs/pt/PTViewer.vue b/apps/showcase/doc/tabs/pt/PTViewer.vue
index 379cdffc4..7246b3b27 100644
--- a/apps/showcase/doc/tabs/pt/PTViewer.vue
+++ b/apps/showcase/doc/tabs/pt/PTViewer.vue
@@ -1,5 +1,4 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
     <DocPTViewer :docs="docs">
         <Tabs value="0">
             <TabList>
diff --git a/apps/showcase/doc/tag/pt/PTViewer.vue b/apps/showcase/doc/tag/pt/PTViewer.vue
index 215d3d5ae..cc00f2e73 100644
--- a/apps/showcase/doc/tag/pt/PTViewer.vue
+++ b/apps/showcase/doc/tag/pt/PTViewer.vue
@@ -1,6 +1,5 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
-    <DocPTViewer :docs="ptViewerDoc">
+    <DocPTViewer :docs="docs">
         <Tag icon="pi pi-user" value="Primary"></Tag>
     </DocPTViewer>
 </template>
@@ -11,7 +10,7 @@ import { getPTOptions } from '@/components/doc/helpers';
 export default {
     data() {
         return {
-            ptViewerDoc: [
+            docs: [
                 {
                     data: getPTOptions('Tag'),
                     key: 'Tag'
diff --git a/apps/showcase/doc/terminal/pt/PTViewer.vue b/apps/showcase/doc/terminal/pt/PTViewer.vue
index 2ee11d704..41c6a5838 100644
--- a/apps/showcase/doc/terminal/pt/PTViewer.vue
+++ b/apps/showcase/doc/terminal/pt/PTViewer.vue
@@ -1,6 +1,5 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
-    <DocPTViewer :docs="ptViewerDoc">
+    <DocPTViewer :docs="docs">
         <div>
             <p>Enter "<strong>date</strong>" to display the current date, "<strong>greet {0}</strong>" for a message and "<strong>random</strong>" to get a random number.</p>
             <Terminal welcomeMessage="Welcome to PrimeVue" prompt="primevue $" aria-label="PrimeVue Terminal Service" />
@@ -15,7 +14,7 @@ import TerminalService from 'primevue/terminalservice';
 export default {
     data() {
         return {
-            ptViewerDoc: [
+            docs: [
                 {
                     data: getPTOptions('Terminal'),
                     key: 'Terminal'
diff --git a/apps/showcase/doc/textarea/pt/PTViewer.vue b/apps/showcase/doc/textarea/pt/PTViewer.vue
index 278c7a0f5..cc0eee26f 100644
--- a/apps/showcase/doc/textarea/pt/PTViewer.vue
+++ b/apps/showcase/doc/textarea/pt/PTViewer.vue
@@ -1,5 +1,4 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
     <DocPTViewer :docs="docs">
         <Textarea v-model="value" rows="5" cols="30" style="resize: none" />
     </DocPTViewer>
diff --git a/apps/showcase/doc/tieredmenu/pt/PTViewer.vue b/apps/showcase/doc/tieredmenu/pt/PTViewer.vue
index c8a844279..43031bd4d 100644
--- a/apps/showcase/doc/tieredmenu/pt/PTViewer.vue
+++ b/apps/showcase/doc/tieredmenu/pt/PTViewer.vue
@@ -1,6 +1,5 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
-    <DocPTViewer :docs="ptViewerDoc">
+    <DocPTViewer :docs="docs">
         <TieredMenu :model="items" />
     </DocPTViewer>
 </template>
@@ -80,7 +79,7 @@ export default {
                     ]
                 }
             ],
-            ptViewerDoc: [
+            docs: [
                 {
                     data: getPTOptions('TieredMenu'),
                     key: 'TieredMenu'
diff --git a/apps/showcase/doc/timeline/pt/PTViewer.vue b/apps/showcase/doc/timeline/pt/PTViewer.vue
index a2ec2c920..26394be33 100644
--- a/apps/showcase/doc/timeline/pt/PTViewer.vue
+++ b/apps/showcase/doc/timeline/pt/PTViewer.vue
@@ -1,6 +1,5 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
-    <DocPTViewer :docs="ptViewerDoc">
+    <DocPTViewer :docs="docs">
         <Timeline :value="events">
             <template #opposite="slotProps">
                 <small class="text-surface-500 dark:text-surface-400">{{ slotProps.item.date }}</small>
@@ -24,7 +23,7 @@ export default {
                 { status: 'Shipped', date: '15/10/2020 16:15', icon: 'pi pi-shopping-cart', color: '#FF9800' },
                 { status: 'Delivered', date: '16/10/2020 10:00', icon: 'pi pi-check', color: '#607D8B' }
             ],
-            ptViewerDoc: [
+            docs: [
                 {
                     data: getPTOptions('Timeline'),
                     key: 'Timeline'
diff --git a/apps/showcase/doc/toast/pt/PTViewer.vue b/apps/showcase/doc/toast/pt/PTViewer.vue
index 1cf507704..315039b02 100644
--- a/apps/showcase/doc/toast/pt/PTViewer.vue
+++ b/apps/showcase/doc/toast/pt/PTViewer.vue
@@ -1,5 +1,4 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
     <DocPTViewer :docs="docs">
         <div class="p-toast p-component" data-pc-name="toast">
             <div>
diff --git a/apps/showcase/doc/togglebutton/pt/PTViewer.vue b/apps/showcase/doc/togglebutton/pt/PTViewer.vue
index 7f424bafc..2402937c1 100644
--- a/apps/showcase/doc/togglebutton/pt/PTViewer.vue
+++ b/apps/showcase/doc/togglebutton/pt/PTViewer.vue
@@ -1,5 +1,4 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
     <DocPTViewer :docs="docs">
         <ToggleButton v-model="checked" onIcon="pi pi-check" offIcon="pi pi-times" class="w-full sm:w-40" />
     </DocPTViewer>
diff --git a/apps/showcase/doc/toggleswitch/pt/PTViewer.vue b/apps/showcase/doc/toggleswitch/pt/PTViewer.vue
index 4e7a290a7..49b115fa7 100644
--- a/apps/showcase/doc/toggleswitch/pt/PTViewer.vue
+++ b/apps/showcase/doc/toggleswitch/pt/PTViewer.vue
@@ -1,5 +1,4 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
     <DocPTViewer :docs="docs">
         <ToggleSwitch v-model="checked" />
     </DocPTViewer>
diff --git a/apps/showcase/doc/toolbar/pt/PTViewer.vue b/apps/showcase/doc/toolbar/pt/PTViewer.vue
index e968651e1..8efa15411 100644
--- a/apps/showcase/doc/toolbar/pt/PTViewer.vue
+++ b/apps/showcase/doc/toolbar/pt/PTViewer.vue
@@ -1,5 +1,4 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
     <DocPTViewer :docs="docs">
         <Toolbar class="w-full">
             <template #start>
diff --git a/apps/showcase/doc/tooltip/pt/PTViewer.vue b/apps/showcase/doc/tooltip/pt/PTViewer.vue
index 637c835c4..3ad55fc34 100644
--- a/apps/showcase/doc/tooltip/pt/PTViewer.vue
+++ b/apps/showcase/doc/tooltip/pt/PTViewer.vue
@@ -1,6 +1,5 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
-    <DocPTViewer :docs="ptViewerDoc">
+    <DocPTViewer :docs="docs">
         <Button v-tooltip="{ value: 'Confirm to proceed', hideDelay: 300000 }" severity="secondary" label="Tooltip" />
     </DocPTViewer>
 </template>
@@ -11,7 +10,7 @@ import { getPTOptions } from '@/components/doc/helpers';
 export default {
     data() {
         return {
-            ptViewerDoc: [
+            docs: [
                 {
                     data: getPTOptions('Tooltip'),
                     key: 'Tooltip'
diff --git a/apps/showcase/doc/tree/pt/PTViewer.vue b/apps/showcase/doc/tree/pt/PTViewer.vue
index 99350b041..8c7033181 100644
--- a/apps/showcase/doc/tree/pt/PTViewer.vue
+++ b/apps/showcase/doc/tree/pt/PTViewer.vue
@@ -1,6 +1,5 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
-    <DocPTViewer :docs="ptViewerDoc">
+    <DocPTViewer :docs="docs">
         <Tree v-model:selectionKeys="selectedKey" filter :value="nodes" selectionMode="checkbox" class="w-full md:w-[30rem]"></Tree>
     </DocPTViewer>
 </template>
@@ -14,7 +13,7 @@ export default {
         return {
             nodes: null,
             selectedKey: null,
-            ptViewerDoc: [
+            docs: [
                 {
                     data: getPTOptions('Tree'),
                     key: 'Tree'
diff --git a/apps/showcase/doc/treeselect/pt/PTViewer.vue b/apps/showcase/doc/treeselect/pt/PTViewer.vue
index 416ec7bd5..54648d51e 100644
--- a/apps/showcase/doc/treeselect/pt/PTViewer.vue
+++ b/apps/showcase/doc/treeselect/pt/PTViewer.vue
@@ -1,5 +1,4 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
     <DocPTViewer :docs="docs">
         <TreeSelect v-model="selectedValue" :options="nodes" selectionMode="checkbox" placeholder="Select Item" class="md:w-80 w-full" />
     </DocPTViewer>
diff --git a/apps/showcase/doc/treetable/pt/PTViewer.vue b/apps/showcase/doc/treetable/pt/PTViewer.vue
index ca54cedd0..880af5c5b 100644
--- a/apps/showcase/doc/treetable/pt/PTViewer.vue
+++ b/apps/showcase/doc/treetable/pt/PTViewer.vue
@@ -1,6 +1,5 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
-    <DocPTViewer :docs="ptViewerDoc">
+    <DocPTViewer :docs="docs">
         <TreeTable :value="nodes" tableStyle="min-width: 50rem">
             <Column field="name" header="Name" expander style="width: 34%"></Column>
             <Column field="size" header="Size" style="width: 33%"></Column>
@@ -17,7 +16,7 @@ export default {
     data() {
         return {
             nodes: null,
-            ptViewerDoc: [
+            docs: [
                 {
                     data: getPTOptions('TreeTable'),
                     key: 'TreeTable'
diff --git a/apps/showcase/doc/virtualscroller/pt/PTViewer.vue b/apps/showcase/doc/virtualscroller/pt/PTViewer.vue
index 255b7cf55..930168451 100644
--- a/apps/showcase/doc/virtualscroller/pt/PTViewer.vue
+++ b/apps/showcase/doc/virtualscroller/pt/PTViewer.vue
@@ -1,5 +1,4 @@
 <template>
-    <DocSectionText v-bind="$attrs" />
     <DocPTViewer :docs="docs">
         <VirtualScroller :items="items" :itemSize="50" class="border border-surface-200 dark:border-surface-700 rounded" style="width: 200px; height: 200px">
             <template v-slot:item="{ item, options }">