Skip to content

General: Passthrough default props and icons #4607

Open
@m-thorsen

Description

@m-thorsen

Describe the feature you would like to see added

Add possibility to define default props via passthrough.
Add possibility to set icons and/or default slot content via passthrough.

In order to keep configuration to a single config file and/or plugin and eliminate the need for wrapping.

Some examples:

  • I always change the Panel collapse icon to angle - similar to accordion
  • I always set dialog defaults draggable=false, modal=true
  • I always set Select/Multiselect props auto-filter-focus=true, scroll-height=

Is your feature request related to a problem?

Having to wrap/extend/template component every project and/or usage.

Describe the solution you'd like

Some examples:

Panel

<Panel :pt="{
   togglerIcon: ({ props}) => ({
      icon: props.collapsed ? 'pi-angle-up' : 'pi-angle-down'
   })
}" />

AND/OR

import { Icon } from '@iconify/vue';
...
<Panel :pt="{
   togglerIcon: ({ props}) => ({
      icon:  `<Icon icon=${props.collapsed ? 'mdi:chevron-up'  :  'mdi:chevron-down'} />`
   })
}" />

AND/OR

import { Icon } from '@iconify/vue';
...
<Panel :pt="{
   slots: {
      togglericon: ({ props}) => `<Icon icon=${props.collapsed ? 'mdi:chevron-up'  :  'mdi:chevron-down'} />`
   }
}
}" />

Dialog

<Dialog :pt="{
   root: {
      modal: true,
      draggable: false,
   }
}" />

OR

<Dialog :pt="{
   modal: true,
   draggable: false,
}" />

Describe alternatives you have considered

Wrapping each component, templating every use case

Additional context

The passthrough options seems like very natural place for this!

Metadata

Metadata

Assignees

Labels

Status: DiscussionIssue or pull request needs to be discussed by Core TeamType: New FeatureIssue contains a new feature or new component request

Type

No type

Projects

Status

No status

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions