vertumnus
/
primevue-mirror
mirror of https://github.com/primefaces/primevue.git
1
0
Fork 0
Code Packages Releases Activity

Refactored TreeSelect

pull/5677/head
Cagatay Civici 2024-04-07 14:02:54 +03:00
parent 9ce35574a8
commit 03ca6c89ab
2 changed files with 16 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
components/lib/themes/primeone/base/treeselect/index.js
View File

@ -39,7 +39,7 @@ export default {
background: ${dt('treeselect.disabled.background')};
}
.p-treeselect-trigger {
.p-treeselect-dropdown {
display: flex;
align-items: center;
justify-content: center;
@ -75,7 +75,7 @@ export default {
color: ${dt('treeselect.disabled.color')};
}
.p-inputwrapper-filled.p-treeselect.p-treeselect-chip .p-treeselect-label {
.p-inputwrapper-filled.p-treeselect.p-treeselect-display-chip .p-treeselect-label {
padding: 0.25rem 0.25rem;
}
@ -84,7 +84,7 @@ export default {
visibility: hidden;
}
.p-treeselect-token {
.p-treeselect-chip {
cursor: default;
display: inline-flex;
align-items: center;
@ -96,16 +96,16 @@ export default {
margin-right: 0.25rem;
}
.p-treeselect-token-icon {
.p-treeselect-chip-icon {
cursor: pointer;
margin-left: 0.375rem;
}
.p-treeselect .p-treeselect-panel {
.p-treeselect .p-treeselect-overlay {
min-width: 100%;
}
.p-treeselect-panel {
.p-treeselect-overlay {
position: absolute;
top: 0;
left: 0;
@ -125,7 +125,7 @@ export default {
display: flex;
}
.p-treeselect-panel .p-tree {
.p-treeselect-overlay .p-tree {
padding: 0.25rem 0.25rem;
}
`

17
components/lib/treeselect/style/TreeSelectStyle.js
View File

@ -8,13 +8,14 @@ const classes = {
root: ({ instance, props }) => [
'p-treeselect p-component p-inputwrapper',
{
'p-treeselect-chip': props.display === 'chip',
'p-treeselect-display-chip': props.display === 'chip',
'p-disabled': props.disabled,
'p-invalid': props.invalid,
'p-focus': instance.focused,
'p-variant-filled': props.variant ? props.variant === 'filled' : instance.$primevue.config.inputStyle === 'filled',
'p-inputwrapper-filled': !instance.emptyValue,
'p-inputwrapper-focus': instance.focused || instance.overlayVisible
'p-inputwrapper-focus': instance.focused || instance.overlayVisible,
'p-treeselect-open': instance.overlayVisible
}
],
labelContainer: 'p-treeselect-label-container',
@ -25,17 +26,17 @@ const classes = {
'p-treeselect-label-empty': !props.placeholder && instance.emptyValue
}
],
token: 'p-treeselect-token',
tokenLabel: 'p-treeselect-token-label',
trigger: 'p-treeselect-trigger',
triggerIcon: 'p-treeselect-trigger-icon',
token: 'p-treeselect-chip',
tokenLabel: 'p-treeselect-chip-label',
trigger: 'p-treeselect-dropdown',
triggerIcon: 'p-treeselect-dropdown-icon',
panel: ({ instance }) => [
'p-treeselect-panel p-component',
'p-treeselect-overlay p-component',
{
'p-ripple-disabled': instance.$primevue.config.ripple === false
}
],
wrapper: 'p-treeselect-items-wrapper',
wrapper: 'p-treeselect-tree-container',
emptyMessage: 'p-treeselect-empty-message'
};