Merge pull request #6267 from WatCodeDatCode/fix-6266

fix: extend as props to accept component objects

packages/primevue/src/accordioncontent/AccordionContent.d.ts

@@ -10,7 +10,7 @@
 import type { DefineComponent, DesignToken, EmitFn, GlobalComponentConstructor, PassThrough } from '@primevue/core';
 import type { ComponentHooks } from '@primevue/core/basecomponent';
 import type { PassThroughOptions } from 'primevue/passthrough';
-import { VNode } from 'vue';
+import type { Component, VNode } from 'vue';
 
 export declare type AccordionContentPassThroughOptionType = AccordionContentPassThroughAttributes | ((options: AccordionContentPassThroughMethodOptions) => AccordionContentPassThroughAttributes | string) | string | null | undefined;
 
@@ -80,7 +80,7 @@ export interface AccordionContentProps {
      * Use to change the HTML tag of root element.
      * @defaultValue DIV
      */
-    as?: string | undefined;
+    as?: string | Component | undefined;
     /**
      * When enabled, it changes the default rendered element for the one passed as a child element.
      * @defaultValue false

packages/primevue/src/accordioncontent/BaseAccordionContent.vue

@@ -7,7 +7,7 @@ export default {
     extends: BaseComponent,
     props: {
         as: {
-            type: String,
+            type: [String, Object],
             default: 'DIV'
         },
         asChild: {

packages/primevue/src/accordionheader/AccordionHeader.d.ts

@@ -10,7 +10,7 @@
 import type { DefineComponent, DesignToken, EmitFn, GlobalComponentConstructor, PassThrough } from '@primevue/core';
 import type { ComponentHooks } from '@primevue/core/basecomponent';
 import type { PassThroughOptions } from 'primevue/passthrough';
-import { VNode } from 'vue';
+import type { Component, VNode } from 'vue';
 
 export declare type AccordionHeaderPassThroughOptionType = AccordionHeaderPassThroughAttributes | ((options: AccordionHeaderPassThroughMethodOptions) => AccordionHeaderPassThroughAttributes | string) | string | null | undefined;
 
@@ -76,7 +76,7 @@ export interface AccordionHeaderProps {
      * Use to change the HTML tag of root element.
      * @defaultValue BUTTON
      */
-    as?: string | undefined;
+    as?: string | Component | undefined;
     /**
      * When enabled, it changes the default rendered element for the one passed as a child element.
      * @defaultValue false

packages/primevue/src/accordionheader/BaseAccordionHeader.vue

@@ -7,7 +7,7 @@ export default {
     extends: BaseComponent,
     props: {
         as: {
-            type: String,
+            type: [String, Object],
             default: 'BUTTON'
         },
         asChild: {

packages/primevue/src/accordionpanel/AccordionPanel.d.ts

@@ -10,7 +10,7 @@
 import type { DefineComponent, DesignToken, EmitFn, GlobalComponentConstructor, PassThrough } from '@primevue/core';
 import type { ComponentHooks } from '@primevue/core/basecomponent';
 import type { PassThroughOptions } from 'primevue/passthrough';
-import { VNode } from 'vue';
+import type { Component, VNode } from 'vue';
 
 export declare type AccordionPanelPassThroughOptionType = AccordionPanelPassThroughAttributes | ((options: AccordionPanelPassThroughMethodOptions) => AccordionPanelPassThroughAttributes | string) | string | null | undefined;
 
@@ -81,7 +81,7 @@ export interface AccordionPanelProps {
      * Use to change the HTML tag of root element.
      * @defaultValue DIV
      */
-    as?: string | undefined;
+    as?: string | Component | undefined;
     /**
      * When enabled, it changes the default rendered element for the one passed as a child element.
      * @defaultValue false

packages/primevue/src/accordionpanel/BaseAccordionPanel.vue

@@ -15,7 +15,7 @@ export default {
             default: false
         },
         as: {
-            type: String,
+            type: [String, Object],
             default: 'DIV'
         },
         asChild: {

packages/primevue/src/button/Button.d.ts

@@ -10,7 +10,7 @@
 import type { DefineComponent, DesignToken, EmitFn, GlobalComponentConstructor, HintedString, PassThrough } from '@primevue/core';
 import type { ComponentHooks } from '@primevue/core/basecomponent';
 import type { PassThroughOptions } from 'primevue/passthrough';
-import { ButtonHTMLAttributes, VNode } from 'vue';
+import type { ButtonHTMLAttributes, Component, VNode } from 'vue';
 
 export declare type ButtonPassThroughOptionType<T = any> = ButtonPassThroughAttributes | ((options: ButtonPassThroughMethodOptions<T>) => ButtonPassThroughAttributes | string) | string | null | undefined;
 
@@ -133,7 +133,7 @@ export interface ButtonProps extends ButtonHTMLAttributes {
      * Use to change the HTML tag of root element.
      * @defaultValue BUTTON
      */
-    as?: string | undefined;
+    as?: string | Component | undefined;
     /**
      * When enabled, it changes the default rendered element for the one passed as a child element.
      * @defaultValue false

packages/primevue/src/step/BaseStep.vue

@@ -19,7 +19,7 @@ export default {
             default: false
         },
         as: {
-            type: String,
+            type: [String, Object],
             default: 'DIV'
         }
     },

packages/primevue/src/step/Step.d.ts

@@ -10,7 +10,7 @@
 import type { DefineComponent, DesignToken, EmitFn, GlobalComponentConstructor, PassThrough } from '@primevue/core';
 import type { ComponentHooks } from '@primevue/core/basecomponent';
 import type { PassThroughOptions } from 'primevue/passthrough';
-import { VNode } from 'vue';
+import type { Component, VNode } from 'vue';
 
 export declare type StepPassThroughOptionType = StepPassThroughAttributes | ((options: StepPassThroughMethodOptions) => StepPassThroughAttributes | string) | string | null | undefined;
 
@@ -93,7 +93,7 @@ export interface StepProps {
      * Use to change the HTML tag of root element.
      * @defaultValue BUTTON
      */
-    as?: string | undefined;
+    as?: string | Component | undefined;
     /**
      * When enabled, it changes the default rendered element for the one passed as a child element.
      * @defaultValue false

packages/primevue/src/steppanel/BaseStepPanel.vue

@@ -15,7 +15,7 @@ export default {
             default: false
         },
         as: {
-            type: String,
+            type: [String, Object],
             default: 'DIV'
         }
     },

packages/primevue/src/steppanel/StepPanel.d.ts

@@ -10,7 +10,7 @@
 import type { DefineComponent, DesignToken, EmitFn, GlobalComponentConstructor, PassThrough } from '@primevue/core';
 import type { ComponentHooks } from '@primevue/core/basecomponent';
 import type { PassThroughOptions } from 'primevue/passthrough';
-import { VNode } from 'vue';
+import type { Component, VNode } from 'vue';
 
 export declare type StepPanelPassThroughOptionType = StepPanelPassThroughAttributes | ((options: StepPanelPassThroughMethodOptions) => StepPanelPassThroughAttributes | string) | string | null | undefined;
 
@@ -72,7 +72,7 @@ export interface StepPanelProps {
      * Use to change the HTML tag of root element.
      * @defaultValue BUTTON
      */
-    as?: string | undefined;
+    as?: string | Component | undefined;
     /**
      * When enabled, it changes the default rendered element for the one passed as a child element.
      * @defaultValue false

packages/primevue/src/tab/BaseTab.vue

@@ -15,7 +15,7 @@ export default {
             default: false
         },
         as: {
-            type: String,
+            type: [String, Object],
             default: 'BUTTON'
         },
         asChild: {

packages/primevue/src/tab/Tab.d.ts

@@ -10,7 +10,7 @@
 import type { DefineComponent, DesignToken, EmitFn, GlobalComponentConstructor, PassThrough } from '@primevue/core';
 import type { ComponentHooks } from '@primevue/core/basecomponent';
 import type { PassThroughOptions } from 'primevue/passthrough';
-import { VNode } from 'vue';
+import type { Component, VNode } from 'vue';
 
 export declare type TabPassThroughOptionType = TabPassThroughAttributes | ((options: TabPassThroughMethodOptions) => TabPassThroughAttributes | string) | string | null | undefined;
 
@@ -81,7 +81,7 @@ export interface TabProps {
      * Use to change the HTML tag of root element.
      * @defaultValue BUTTON
      */
-    as?: string | undefined;
+    as?: string | Component | undefined;
     /**
      * When enabled, it changes the default rendered element for the one passed as a child element.
      * @defaultValue false

packages/primevue/src/tabpanel/BaseTabPanel.vue

@@ -12,7 +12,7 @@ export default {
             default: undefined
         },
         as: {
-            type: String,
+            type: [String, Object],
             default: 'DIV'
         },
         asChild: {

packages/primevue/src/tabpanel/TabPanel.d.ts

@@ -10,7 +10,7 @@
 import type { DefineComponent, DesignToken, EmitFn, GlobalComponentConstructor, PassThrough } from '@primevue/core';
 import type { ComponentHooks } from '@primevue/core/basecomponent';
 import type { PassThroughOptions } from 'primevue/passthrough';
-import { AnchorHTMLAttributes, HTMLAttributes, LiHTMLAttributes, VNode } from 'vue';
+import type { AnchorHTMLAttributes, Component, HTMLAttributes, LiHTMLAttributes, VNode } from 'vue';
 
 export declare type TabPanelPassThroughOptionType = TabPanelPassThroughAttributes | ((options: TabPanelPassThroughMethodOptions) => TabPanelPassThroughAttributes | string) | string | null | undefined;
 
@@ -96,7 +96,7 @@ export interface TabPanelProps {
      * Use to change the HTML tag of root element.
      * @defaultValue DIV
      */
-    as?: string | undefined;
+    as?: string | Component | undefined;
     /**
      * When enabled, it changes the default rendered element for the one passed as a child element.
      * @defaultValue false