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

Fixed #1083 - Added panelClass where necessary

pull/1088/head
Cagatay Civici 2021-04-15 15:06:20 +03:00
parent 9875abb85d
commit 1405a14768
21 changed files with 74 additions and 25 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
src/components/autocomplete/AutoComplete.d.ts vendored
View File

@ -16,6 +16,7 @@ interface AutoCompleteProps {
inputStyle?: any;
inputClass?: string;
forceSelection?: boolean;
panelClass?: string;
}
declare class AutoComplete {

8
src/components/autocomplete/AutoComplete.vue
View File

@ -16,7 +16,7 @@
<Button ref="dropdownButton" type="button" icon="pi pi-chevron-down" class="p-autocomplete-dropdown" :disabled="$attrs.disabled" @click="onDropdownClick" v-if="dropdown"/>
<Teleport :to="appendTo">
<transition name="p-connected-overlay" @enter="onOverlayEnter" @leave="onOverlayLeave" @after-leave="onOverlayAfterLeave">
<div :ref="overlayRef" class="p-autocomplete-panel p-component" :style="{'max-height': scrollHeight}" v-if="overlayVisible" @click="onOverlayClick">
<div :ref="overlayRef" :class="panelStyleClass" :style="{'max-height': scrollHeight}" v-if="overlayVisible" @click="onOverlayClick">
<slot name="header" :value="modelValue" :suggestions="suggestions"></slot>
<ul :id="listId" class="p-autocomplete-items" role="listbox">
<template v-if="!optionGroupLabel">
@ -98,7 +98,8 @@ export default {
inputClass: null,
inputStyle: null,
class: null,
style: null
style: null,
panelClass: null
},
timeout: null,
outsideClickListener: null,
@ -533,6 +534,9 @@ export default {
'p-focus': this.focused
}];
},
panelStyleClass() {
return ['p-autocomplete-panel p-component', this.panelClass];
},
inputValue() {
if (this.modelValue) {
if (this.field && typeof this.modelValue === 'object') {

1
src/components/calendar/Calendar.d.ts vendored
View File

@ -16,7 +16,6 @@ interface CalendarProps {
yearNavigator?: boolean;
yearRange?: string;
panelClass?: string;
panelStyle?: string;
minDate?: Date;
maxDate?: Date;
disabledDates?: Date[];

4
src/components/calendar/Calendar.vue
View File

@ -200,10 +200,6 @@ export default {
type: String,
default: null
},
panelStyle: {
type: String,
default: null
},
minDate: {
type: Date,
value: null

1
src/components/cascadeselect/CascadeSelect.d.ts vendored
View File

@ -14,6 +14,7 @@ interface CascadeSelectProps {
inputId?: string;
ariaLabelledBy?: string;
appendTo?: string;
panelClass?: string;
}
declare class CascadeSelect {

8
src/components/cascadeselect/CascadeSelect.vue
View File

@ -14,7 +14,7 @@
</div>
<Teleport :to="appendTo">
<transition name="p-connected-overlay" @enter="onOverlayEnter" @leave="onOverlayLeave" @after-leave="onOverlayAfterLeave">
<div :ref="overlayRef" class="p-cascadeselect-panel p-component" v-if="overlayVisible" @click="onOverlayClick">
<div :ref="overlayRef" :class="panelStyleClass" v-if="overlayVisible" @click="onOverlayClick">
<div class="p-cascadeselect-items-wrapper">
<CascadeSelectSub :options="options" :selectionPath="selectionPath"
:optionLabel="optionLabel" :optionValue="optionValue" :level="0" :templates="$slots"
@ -58,7 +58,8 @@ export default {
appendTo: {
type: String,
default: 'body'
}
},
panelClass: null
},
outsideClickListener: null,
scrollHandler: null,
@ -299,6 +300,9 @@ export default {
return this.getOptionLabel(this.selectionPath[this.selectionPath.length - 1]);
else
return this.placeholder||'p-emptylabel';
},
panelStyleClass() {
return ['p-cascadeselect-panel p-component', this.panelClass];
}
},
components: {

1
src/components/colorpicker/ColorPicker.d.ts vendored
View File

@ -8,6 +8,7 @@ interface ColorPickerProps {
autoZIndex?: boolean;
baseZIndex?: number;
ariaLabelledBy?: string;
panelClass?: string;
}
declare class ColorPicker {

5
src/components/colorpicker/ColorPicker.vue
View File

@ -65,7 +65,8 @@ export default {
ariaLabelledBy: {
type: String,
default: null
}
},
panelClass: null
},
data() {
return {
@ -561,7 +562,7 @@ export default {
return ['p-colorpicker-preview p-inputtext', {'p-disabled': this.disabled}];
},
pickerClass() {
return ['p-colorpicker-panel', {'p-colorpicker-overlay-panel': !this.inline, 'p-disabled': this.disabled}];
return ['p-colorpicker-panel', this.panelClass, {'p-colorpicker-overlay-panel': !this.inline, 'p-disabled': this.disabled}];
}
}
}

1
src/components/dropdown/Dropdown.d.ts vendored
View File

@ -25,6 +25,7 @@ interface DropdownProps {
appendTo?: string;
emptyFilterMessage?: string;
emptyMessage?: string;
panelClass?: string;
}
declare class Dropdown {

8
src/components/dropdown/Dropdown.vue
View File

@ -15,7 +15,7 @@
</div>
<Teleport :to="appendTo">
<transition name="p-connected-overlay" @enter="onOverlayEnter" @leave="onOverlayLeave" @after-leave="onOverlayAfterLeave">
<div :ref="overlayRef" class="p-dropdown-panel p-component" v-if="overlayVisible" @click="onOverlayClick">
<div :ref="overlayRef" :class="panelStyleClass" v-if="overlayVisible" @click="onOverlayClick">
<slot name="header" :value="modelValue" :options="visibleOptions"></slot>
<div class="p-dropdown-header" v-if="filter">
<div class="p-dropdown-filter-container">
@ -107,7 +107,8 @@ export default {
emptyMessage: {
type: String,
default: null
}
},
panelClass: null
},
data() {
return {
@ -621,6 +622,9 @@ export default {
}
];
},
panelStyleClass() {
return ['p-dropdown-panel p-component', this.panelClass];
},
label() {
let selectedOption = this.getSelectedOption();
if (selectedOption)

1
src/components/multiselect/MultiSelect.d.ts vendored
View File

@ -24,6 +24,7 @@ interface MultiSelectProps {
emptyFilterMessage?: string;
emptyMessage?: string;
display?: string;
panelClass?: string;
}
declare class MultiSelect {

8
src/components/multiselect/MultiSelect.vue
View File

@ -25,7 +25,7 @@
</div>
<Teleport :to="appendTo">
<transition name="p-connected-overlay" @enter="onOverlayEnter" @leave="onOverlayLeave" @after-leave="onOverlayAfterLeave">
<div :ref="overlayRef" class="p-multiselect-panel p-component" v-if="overlayVisible" @click="onOverlayClick">
<div :ref="overlayRef" :class="panelStyleClass" v-if="overlayVisible" @click="onOverlayClick">
<slot name="header" :value="modelValue" :options="visibleOptions"></slot>
<div class="p-multiselect-header">
<div class="p-checkbox p-component" @click="onToggleAll" role="checkbox" :aria-checked="allSelected">
@ -144,7 +144,8 @@ export default {
display: {
type: String,
default: 'comma'
}
},
panelClass: null
},
data() {
return {
@ -529,6 +530,9 @@ export default {
}
];
},
panelStyleClass() {
return ['p-multiselect-panel p-component', this.panelClass];
},
label() {
let label;

1
src/components/password/Password.d.ts vendored
View File

@ -11,6 +11,7 @@ interface PasswordProps {
toggleMask?: boolean;
inputStyle?: any;
inputClass?: string;
panelClass?: string;
}
declare class Password {

10
src/components/password/Password.vue
View File

@ -4,7 +4,7 @@
<i v-if="toggleMask" :class="toggleIconClass" @click="onMaskToggle" />
<Teleport :to="appendTo">
<transition name="p-connected-overlay" @enter="onOverlayEnter" @leave="onOverlayLeave" @after-leave="onOverlayAfterLeave">
<div :ref="overlayRef" class="p-password-panel p-component" v-if="overlayVisible" @click="onOverlayClick">
<div :ref="overlayRef" :class="panelStyleClass" v-if="overlayVisible" @click="onOverlayClick">
<slot name="header"></slot>
<slot name="content">
<div class="p-password-meter">
@ -65,10 +65,11 @@ export default {
type: Boolean,
default: false
},
inputClass: null,
inputClass: toString,
inputStyle: null,
style: null,
class: null
class: String,
panelClass: String
},
data() {
return {
@ -250,6 +251,9 @@ export default {
'p-disabled': this.$attrs.disabled
}];
},
panelStyleClass() {
return ['p-password-panel p-component', this.panelClass];
},
toggleIconClass() {
return this.unmasked ? 'pi pi-eye-slash' : 'pi pi-eye';
},

5
src/components/treeselect/TreeSelect.vue
View File

@ -24,7 +24,7 @@
</div>
<Teleport :to="appendTo">
<transition name="p-connected-overlay" @enter="onOverlayEnter" @leave="onOverlayLeave" @after-leave="onOverlayAfterLeave">
<div :ref="overlayRef" v-if="overlayVisible" @click="onOverlayClick" :class="['p-treeselect-panel p-component', panelClass]">
<div :ref="overlayRef" v-if="overlayVisible" @click="onOverlayClick" :class="panelStyleClass">
<slot name="header" :value="modelValue" :options="options"></slot>
<div class="p-treeselect-items-wrapper" :style="{'max-height': scrollHeight}">
<TSTree :value="options" :selectionMode="selectionMode" @update:selectionKeys="onSelectionChange" :selectionKeys="modelValue"
@ -369,6 +369,9 @@ export default {
}
];
},
panelStyleClass() {
return ['p-treeselect-panel p-component', panelClass];
},
selectedNodes() {
let selectedNodes = [];
if (this.modelValue && this.options) {

6
src/views/autocomplete/AutoCompleteDoc.vue
View File

@ -229,6 +229,12 @@ export default {
<td>false</td>
<td>When present, autocomplete clears the manual input if it does not match of the suggestions to force only
accepting values from the suggestions.</td>
</tr>
<tr>
<td>panelClass</td>
<td>string</td>
<td>null</td>
<td>Style class of the overlay panel.</td>
</tr>
</tbody>
</table>

6
src/views/calendar/CalendarDoc.vue
View File

@ -263,12 +263,6 @@ export default {
<td>null</td>
<td>Style class of the datetimepicker panel.</td>
</tr>
<tr>
<td>panelStyle</td>
<td>object</td>
<td>null</td>
<td>Inline style of the datetimepicker panel.</td>
</tr>
<tr>
<td>minDate</td>
<td>Date</td>

6
src/views/cascadeselect/CascadeSelectDoc.vue
View File

@ -212,6 +212,12 @@ data() {
<td>string</td>
<td>body</td>
<td>A valid query selector or an HTMLElement to specify where the overlay gets attached.</td>
</tr>
<tr>
<td>panelClass</td>
<td>string</td>
<td>null</td>
<td>Style class of the overlay panel.</td>
</tr>
</tbody>
</table>

6
src/views/colorpicker/ColorPickerDoc.vue
View File

@ -98,6 +98,12 @@ export default {
<td>null</td>
<td>Establishes relationships between the component and label(s) where its value should be one or more element IDs.</td>
</tr>
<tr>
<td>panelClass</td>
<td>string</td>
<td>null</td>
<td>Style class of the overlay panel.</td>
</tr>
</tbody>
</table>
</div>

6
src/views/dropdown/DropdownDoc.vue
View File

@ -268,6 +268,12 @@ export default {
<td>string</td>
<td>No results found</td>
<td>Text to display when there are no options available. Defaults to value from PrimeVue locale configuration.</td>
</tr>
<tr>
<td>panelClass</td>
<td>string</td>
<td>null</td>
<td>Style class of the overlay panel.</td>
</tr>
</tbody>
</table>

6
src/views/multiselect/MultiSelectDoc.vue
View File

@ -270,6 +270,12 @@ export default {
<td>string</td>
<td>comma</td>
<td>Defines how the selected items are displayed, valid values are "comma" and "chip".</td>
</tr>
<tr>
<td>panelClass</td>
<td>string</td>
<td>null</td>
<td>Style class of the overlay panel.</td>
</tr>
</tbody>
</table>