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

Related #6474

pull/6480/head
tugcekucukoglu 2024-09-25 15:00:40 +03:00
parent a5cad903b9
commit 6065a4e2b5
8 changed files with 22 additions and 72 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
packages/primevue/src/carousel/Carousel.vue
View File

@ -103,7 +103,6 @@
<script>
import { addClass, find, findSingle, getAttribute, removeClass, setAttribute } from '@primeuix/utils/dom';
import { localeComparator, sort } from '@primeuix/utils/object';
import { UniqueComponentId } from '@primevue/core/utils';
import ChevronDownIcon from '@primevue/icons/chevrondown';
import ChevronLeftIcon from '@primevue/icons/chevronleft';
import ChevronRightIcon from '@primevue/icons/chevronright';
@ -161,7 +160,6 @@ export default {
mounted() {
let stateChanged = false;
this.$el.setAttribute(this.attributeSelector, '');
this.createStyle();
this.calculatePosition();
@ -569,7 +567,7 @@ export default {
}
let innerHTML = `
.p-carousel[${this.attributeSelector}] .p-carousel-item {
.p-carousel[${this.$attrSelector}] .p-carousel-item {
flex: 1 0 ${100 / this.d_numVisible}%
}
`;
@ -590,7 +588,7 @@ export default {
innerHTML += `
@media screen and (max-width: ${res.breakpoint}) {
.p-carousel[${this.attributeSelector}] .p-carousel-item {
.p-carousel[${this.$attrSelector}] .p-carousel-item {
flex: 1 0 ${100 / res.numVisible}%
}
}
@ -641,9 +639,6 @@ export default {
ariaNextButtonLabel() {
return this.$primevue.config.locale.aria ? this.$primevue.config.locale.aria.nextPageLabel : undefined;
},
attributeSelector() {
return UniqueComponentId();
},
empty() {
return !this.value || this.value.length === 0;
},

10
packages/primevue/src/datepicker/DatePicker.vue
View File

@ -642,8 +642,6 @@ export default {
this.bindMatchMediaListener();
if (this.inline) {
this.overlay && this.overlay.setAttribute(this.attributeSelector, '');
if (!this.disabled) {
this.preventFocus = true;
this.initFocusableCell();
@ -875,7 +873,6 @@ export default {
return validMin && validMax && validDate && validDay;
},
onOverlayEnter(el) {
el.setAttribute(this.attributeSelector, '');
const styles = !this.inline ? { position: 'absolute', top: '0', left: '0' } : undefined;
addStyle(el, styles);
@ -2712,14 +2709,14 @@ export default {
for (let i = 0; i < responsiveOptions.length; i++) {
let { breakpoint, numMonths } = responsiveOptions[i];
let styles = `
.p-datepicker-panel[${this.attributeSelector}] .p-datepicker-calendar:nth-child(${numMonths}) .p-datepicker-next-button {
.p-datepicker-panel[${this.$attrSelector}] .p-datepicker-calendar:nth-child(${numMonths}) .p-datepicker-next-button {
display: inline-flex;
}
`;
for (let j = numMonths; j < this.numberOfMonths; j++) {
styles += `
.p-datepicker-panel[${this.attributeSelector}] .p-datepicker-calendar:nth-child(${j + 1}) {
.p-datepicker-panel[${this.$attrSelector}] .p-datepicker-calendar:nth-child(${j + 1}) {
display: none;
}
`;
@ -2943,9 +2940,6 @@ export default {
monthNames() {
return this.$primevue.config.locale.monthNames;
},
attributeSelector() {
return UniqueComponentId();
},
switchViewButtonDisabled() {
return this.numberOfMonths > 1 || this.disabled;
},

8
packages/primevue/src/orderlist/OrderList.vue
View File

@ -259,7 +259,6 @@ export default {
},
createStyle() {
if (!this.styleElement && !this.isUnstyled) {
this.$el.setAttribute(this.attributeSelector, '');
this.styleElement = document.createElement('style');
this.styleElement.type = 'text/css';
setAttribute(this.styleElement, 'nonce', this.$primevue?.config?.csp?.nonce);
@ -267,11 +266,11 @@ export default {
let innerHTML = `
@media screen and (max-width: ${this.breakpoint}) {
.p-orderlist[${this.attributeSelector}] {
.p-orderlist[${this.$attrSelector}] {
flex-direction: column;
}
.p-orderlist[${this.attributeSelector}] .p-orderlist-controls {
.p-orderlist[${this.$attrSelector}] .p-orderlist-controls {
flex-direction: row;
}
}
@ -291,9 +290,6 @@ export default {
}
},
computed: {
attributeSelector() {
return UniqueComponentId();
},
moveUpAriaLabel() {
return this.$primevue.config.locale.aria ? this.$primevue.config.locale.aria.moveUp : undefined;
},

20
packages/primevue/src/paginator/Paginator.vue
View File

@ -90,7 +90,6 @@
<script>
import { setAttribute } from '@primeuix/utils/dom';
import { UniqueComponentId } from '@primevue/core/utils';
import BasePaginator from './BasePaginator.vue';
import CurrrentPageReport from './CurrentPageReport.vue';
import FirstPageLink from './FirstPageLink.vue';
@ -127,7 +126,6 @@ export default {
}
},
mounted() {
this.setPaginatorAttribute();
this.createStyle();
},
methods: {
@ -209,21 +207,21 @@ export default {
if (key === 'default') {
innerHTML += `
@media screen ${minValue} {
.paginator[${this.attributeSelector}],
.p-paginator[${this.$attrSelector}],
display: flex;
}
}
`;
} else {
innerHTML += `
.paginator[${this.attributeSelector}], .p-paginator-${key} {
.p-paginator-${key} {
display: none;
}
@media screen ${minValue} and (max-width: ${key}) {
.paginator[${this.attributeSelector}], .p-paginator-${key} {
.p-paginator-${key} {
display: flex;
}
.paginator[${this.attributeSelector}],
.p-paginator-default{
display: none;
}
@ -238,13 +236,6 @@ export default {
hasBreakpoints() {
return typeof this.template === 'object';
},
setPaginatorAttribute() {
if (this.$refs.paginator && this.$refs.paginator.length >= 0) {
[...this.$refs.paginator].forEach((el) => {
el.setAttribute(this.attributeSelector, '');
});
}
},
getAriaLabel(labelType) {
return this.$primevue.config.locale.aria ? this.$primevue.config.locale.aria[labelType] : undefined;
}
@ -326,9 +317,6 @@ export default {
},
currentPage() {
return this.pageCount > 0 ? this.page + 1 : 0;
},
attributeSelector() {
return UniqueComponentId();
}
},
components: {

8
packages/primevue/src/picklist/PickList.vue
View File

@ -562,7 +562,6 @@ export default {
},
createStyle() {
if (!this.styleElement && !this.isUnstyled) {
this.$el.setAttribute(this.attributeSelector, '');
this.styleElement = document.createElement('style');
this.styleElement.type = 'text/css';
setAttribute(this.styleElement, 'nonce', this.$primevue?.config?.csp?.nonce);
@ -570,11 +569,11 @@ export default {
let innerHTML = `
@media screen and (max-width: ${this.breakpoint}) {
.p-picklist[${this.attributeSelector}] {
.p-picklist[${this.$attrSelector}] {
flex-direction: column;
}
.p-picklist[${this.attributeSelector}] .p-picklist-controls {
.p-picklist[${this.$attrSelector}] .p-picklist-controls {
flex-direction: row;
}
}
@ -609,9 +608,6 @@ export default {
targetList() {
return this.modelValue && this.modelValue[1] ? this.modelValue[1] : null;
},
attributeSelector() {
return UniqueComponentId();
},
moveUpAriaLabel() {
return this.$primevue.config.locale.aria ? this.$primevue.config.locale.aria.moveUp : undefined;
},

14
packages/primevue/src/popover/Popover.vue
View File

@ -14,10 +14,10 @@
</template>
<script>
import { ConnectedOverlayScrollHandler, UniqueComponentId } from '@primevue/core/utils';
import { addStyle, absolutePosition, getOffset, addClass, focus, isClient, isTouchDevice, setAttribute } from '@primeuix/utils/dom';
import { ZIndex } from '@primeuix/utils/zindex';
import { $dt } from '@primeuix/styled';
import { absolutePosition, addClass, addStyle, focus, getOffset, isClient, isTouchDevice, setAttribute } from '@primeuix/utils/dom';
import { ZIndex } from '@primeuix/utils/zindex';
import { ConnectedOverlayScrollHandler } from '@primevue/core/utils';
import FocusTrap from 'primevue/focustrap';
import OverlayEventBus from 'primevue/overlayeventbus';
import Portal from 'primevue/portal';
@ -103,7 +103,6 @@ export default {
this.selfClick = true;
},
onEnter(el) {
this.container.setAttribute(this.attributeSelector, '');
addStyle(el, { position: 'absolute', top: '0', left: '0' });
this.alignOverlay();
@ -277,7 +276,7 @@ export default {
for (let breakpoint in this.breakpoints) {
innerHTML += `
@media screen and (max-width: ${breakpoint}) {
.p-popover[${this.attributeSelector}] {
.p-popover[${this.$attrSelector}] {
width: ${this.breakpoints[breakpoint]} !important;
}
}
@ -300,11 +299,6 @@ export default {
});
}
},
computed: {
attributeSelector() {
return UniqueComponentId();
}
},
directives: {
focustrap: FocusTrap,
ripple: Ripple

11
packages/primevue/src/toast/Toast.vue
View File

@ -26,7 +26,6 @@
import { setAttribute } from '@primeuix/utils/dom';
import { isEmpty } from '@primeuix/utils/object';
import { ZIndex } from '@primeuix/utils/zindex';
import { UniqueComponentId } from '@primevue/core/utils';
import Portal from 'primevue/portal';
import ToastEventBus from 'primevue/toasteventbus';
import BaseToast from './BaseToast.vue';
@ -100,8 +99,6 @@ export default {
this.messages = [];
},
onEnter() {
this.$refs.container.setAttribute(this.attributeSelector, '');
if (this.autoZIndex) {
ZIndex.set('modal', this.$refs.container, this.baseZIndex || this.$primevue.config.zIndex.modal);
}
@ -131,7 +128,7 @@ export default {
innerHTML += `
@media screen and (max-width: ${breakpoint}) {
.p-toast[${this.attributeSelector}] {
.p-toast[${this.$attrSelector}] {
${breakpointStyle}
}
}
@ -148,11 +145,7 @@ export default {
}
}
},
computed: {
attributeSelector() {
return UniqueComponentId();
}
},
components: {
ToastMessage: ToastMessage,
Portal: Portal

14
packages/primevue/src/treetable/TreeTable.vue
View File

@ -168,10 +168,10 @@
</template>
<script>
import { addStyle, clearSelection, find, getAttribute, getIndex, getOffset, getOuterWidth, setAttribute } from '@primeuix/utils/dom';
import { localeComparator, resolveFieldData, sort } from '@primeuix/utils/object';
import { FilterService } from '@primevue/core/api';
import { HelperSet, getVNodeProp, UniqueComponentId } from '@primevue/core/utils';
import { getOffset, addStyle, getIndex, find, getOuterWidth, getAttribute, setAttribute, clearSelection } from '@primeuix/utils/dom';
import { resolveFieldData, localeComparator, sort } from '@primeuix/utils/object';
import { getVNodeProp, HelperSet } from '@primevue/core/utils';
import SpinnerIcon from '@primevue/icons/spinner';
import Paginator from 'primevue/paginator';
import BaseTreeTable from './BaseTreeTable.vue';
@ -241,9 +241,6 @@ export default {
this.d_multiSortMeta = newValue;
}
},
mounted() {
this.$el.setAttribute(this.attributeSelector, '');
},
beforeUnmount() {
this.destroyStyleElement();
this.d_columns.clear();
@ -684,7 +681,7 @@ export default {
this.createStyleElement();
let innerHTML = '';
let selector = `[data-pc-name="treetable"][${this.attributeSelector}] > [data-pc-section="tablecontainer"] > table[data-pc-section="table"]`;
let selector = `[data-pc-name="treetable"][${this.$attrSelector}] > [data-pc-section="tablecontainer"] > table[data-pc-section="table"]`;
widths.forEach((width, index) => {
let colWidth = index === colIndex ? newColumnWidth : nextColumnWidth && index === colIndex + 1 ? nextColumnWidth : width;
@ -863,9 +860,6 @@ export default {
return data ? data.length : 0;
}
},
attributeSelector() {
return UniqueComponentId();
}
},
components: {