Merge branch 'v4' of https://github.com/primefaces/primevue into v4

components/lib/dock/DockSub.vue

@@ -19,7 +19,7 @@
             <template v-for="(processedItem, index) of model" :key="index">
                 <li
                     :id="getItemId(index)"
-                    :class="cx('menuitem', { processedItem, index, id: getItemId(index) })"
+                    :class="cx('menuitem', { processedItem, id: getItemId(index) })"
                     role="menuitem"
                     :aria-label="processedItem.label"
                     :aria-disabled="disabled(processedItem)"

components/lib/dock/style/DockStyle.js

@@ -10,16 +10,11 @@ const classes = {
     ],
     container: 'p-dock-list-container',
     menu: 'p-dock-list',
-    menuitem: ({ instance, processedItem, index, id }) => [
+    menuitem: ({ instance, processedItem, id }) => [
         'p-dock-item',
         {
             'p-focus': instance.isItemActive(id),
-            'p-disabled': instance.disabled(processedItem),
+            'p-disabled': instance.disabled(processedItem)
-            'p-dock-item-second-prev': instance.currentIndex - 2 === index,
-            'p-dock-item-prev': instance.currentIndex - 1 === index,
-            'p-dock-item-current': instance.currentIndex === index,
-            'p-dock-item-next': instance.currentIndex + 1 === index,
-            'p-dock-item-second-next': instance.currentIndex + 2 === index
         }
     ],
     content: 'p-menuitem-content',

components/lib/organizationchart/OrganizationChartNode.vue

@@ -107,7 +107,7 @@ export default {
             });
         },
         onNodeClick(event) {
-            if (DomHandler.getAttribute(event.target, 'nodeToggler') || DomHandler.getAttribute(event.target, 'nodeTogglerIcon')) {
+            if (DomHandler.isAttributeEquals(event.target, 'data-pc-section', 'nodetoggler') || DomHandler.isAttributeEquals(event.target, 'data-pc-section', 'nodetogglericon')) {
                 return;
             }
 

components/lib/overlaypanel/BaseOverlayPanel.vue

@@ -10,10 +10,6 @@ export default {
             type: Boolean,
             default: true
         },
-        showCloseIcon: {
-            type: Boolean,
-            default: false
-        },
         appendTo: {
             type: [String, Object],
             default: 'body'
@@ -30,10 +26,6 @@ export default {
             type: Object,
             default: null
         },
-        closeIcon: {
-            type: String,
-            default: undefined
-        },
         closeOnEscape: {
             type: Boolean,
             default: true

components/lib/overlaypanel/OverlayPanel.d.ts

@@ -10,7 +10,7 @@
 import { TransitionProps, VNode } from 'vue';
 import { ComponentHooks } from '../basecomponent';
 import { PassThroughOptions } from '../passthrough';
-import { ClassComponent, GlobalComponentConstructor, PassThrough, HintedString } from '../ts-helpers';
+import { ClassComponent, GlobalComponentConstructor, HintedString, PassThrough } from '../ts-helpers';
 
 export declare type OverlayPanelPassThroughOptionType = OverlayPanelPassThroughAttributes | ((options: OverlayPanelPassThroughMethodOptions) => OverlayPanelPassThroughAttributes | string) | string | null | undefined;
 
@@ -59,14 +59,6 @@ export interface OverlayPanelPassThroughOptions {
      * Used to pass attributes to the content's DOM element.
      */
     content?: OverlayPanelPassThroughOptionType;
-    /**
-     * Used to pass attributes to the close button's DOM element.
-     */
-    closeButton?: OverlayPanelPassThroughOptionType;
-    /**
-     * Used to pass attributes to the close icon's DOM element.
-     */
-    closeIcon?: OverlayPanelPassThroughOptionType;
     /**
      * Used to manage all lifecycle hooks.
      * @see {@link BaseComponent.ComponentHooks}
@@ -127,11 +119,6 @@ export interface OverlayPanelProps {
      * @defaultValue true
      */
     dismissable?: boolean;
-    /**
-     * When enabled, displays a close icon at top right corner.
-     * @defaultValue false
-     */
-    showCloseIcon?: boolean;
     /**
      * A valid query selector or an HTMLElement to specify where the overlay gets attached.
      * @defaultValue body
@@ -151,11 +138,6 @@ export interface OverlayPanelProps {
      * Object literal to define widths per screen size.
      */
     breakpoints?: OverlayPanelBreakpoints;
-    /**
-     * Icon to display in the overlaypanel close button.
-     * @deprecated since v3.27.0. Use 'closeicon' slot.
-     */
-    closeIcon?: string | undefined;
     /**
      * Used to pass attributes to DOM elements inside the component.
      * @type {OverlayPanelPassThroughOptions}
@@ -186,10 +168,6 @@ export interface OverlayPanelSlots {
      * Custom content template.
      */
     default(): VNode[];
-    /**
-     * Custom close icon template.
-     */
-    closeicon(): VNode[];
     /**
      * Custom container slot.
      * @param {Object} scope - container slot's params.

components/lib/overlaypanel/OverlayPanel.vue

@@ -7,11 +7,6 @@
                     <div :class="cx('content')" @click="onContentClick" @mousedown="onContentClick" @keydown="onContentKeydown" v-bind="ptm('content')">
                         <slot></slot>
                     </div>
-                    <button v-if="showCloseIcon" v-ripple :class="cx('closeButton')" :aria-label="closeAriaLabel" type="button" autofocus @click="hide" @keydown="onButtonKeydown" v-bind="ptm('closeButton')">
-                        <slot name="closeicon">
-                            <component :is="closeIcon ? 'span' : 'TimesIcon'" :class="[cx('closeIcon'), closeIcon]" v-bind="ptm('closeIcon')"></component>
-                        </slot>
-                    </button>
                 </template>
             </div>
         </transition>
@@ -20,7 +15,6 @@
 
 <script>
 import FocusTrap from 'primevue/focustrap';
-import TimesIcon from 'primevue/icons/times';
 import OverlayEventBus from 'primevue/overlayeventbus';
 import Portal from 'primevue/portal';
 import Ripple from 'primevue/ripple';
@@ -306,9 +300,6 @@ export default {
     computed: {
         attributeSelector() {
             return UniqueComponentId();
-        },
-        closeAriaLabel() {
-            return this.$primevue.config.locale.aria ? this.$primevue.config.locale.aria.close : undefined;
         }
     },
     directives: {
@@ -316,8 +307,7 @@ export default {
         ripple: Ripple
     },
     components: {
-        Portal: Portal,
+        Portal
-        TimesIcon
     }
 };
 </script>

components/lib/themes/primeone/base/dock/index.js

@@ -52,21 +52,6 @@ p-dock-item.p-focus {
     height: 3rem;
 }
 
-.p-dock-item-second-prev,
-.p-dock-item-second-next {
-    transform: scale(1.2);
-}
-
-.p-dock-item-prev,
-.p-dock-item-next {
-    transform: scale(1.4);
-}
-
-.p-dock-item-current {
-    transform: scale(1.6);
-    z-index: 1;
-}
-
 .p-dock-top {
     left: 0;
     top: 0;
@@ -115,38 +100,6 @@ p-dock-item.p-focus {
     flex-direction: column;
 }
 
-.p-dock-top .p-dock-item-second-prev,
-.p-dock-top .p-dock-item-second-next,
-.p-dock-bottom .p-dock-item-second-prev,
-.p-dock-bottom .p-dock-item-second-next {
-    margin: 0 0.9rem;
-}
-.p-dock-top .p-dock-item-prev,
-.p-dock-top .p-dock-item-next,
-.p-dock-bottom .p-dock-item-prev,
-.p-dock-bottom .p-dock-item-next {
-    margin: 0 1.3rem;
-}
-.p-dock-top .p-dock-item-current,
-.p-dock-bottom .p-dock-item-current {
-    margin: 0 1.5rem;
-}
-.p-dock-left .p-dock-item-second-prev,
-.p-dock-left .p-dock-item-second-next,
-.p-dock-right .p-dock-item-second-prev,
-.p-dock-right .p-dock-item-second-next {
-    margin: 0.9rem 0;
-}
-.p-dock-left .p-dock-item-prev,
-.p-dock-left .p-dock-item-next,
-.p-dock-right .p-dock-item-prev,
-.p-dock-right .p-dock-item-next {
-    margin: 1.3rem 0;
-}
-.p-dock-left .p-dock-item-current,
-.p-dock-right .p-dock-item-current {
-    margin: 1.5rem 0;
-}
 .p-dock-mobile.p-dock-top .p-dock-list-container,
 .p-dock-mobile.p-dock-bottom .p-dock-list-container {
     overflow-x: auto;

doc/multiselect/AccessibilityDoc.vue

@@ -217,32 +217,6 @@
                 </tbody>
             </table>
         </div>
-
-        <h3>Close Button Keyboard Support</h3>
-        <div class="doc-tablewrapper">
-            <table class="doc-table">
-                <thead>
-                    <tr>
-                        <th>Key</th>
-                        <th>Function</th>
-                    </tr>
-                </thead>
-                <tbody>
-                    <tr>
-                        <td><i>enter</i></td>
-                        <td>Closes the popup and moves focus to the multiselect element.</td>
-                    </tr>
-                    <tr>
-                        <td><i>space</i></td>
-                        <td>Closes the popup and moves focus to the multiselect element.</td>
-                    </tr>
-                    <tr>
-                        <td><i>escape</i></td>
-                        <td>Closes the popup and moves focus to the multiselect element.</td>
-                    </tr>
-                </tbody>
-            </table>
-        </div>
     </DocSectionText>
 </template>
 

doc/overlaypanel/AccessibilityDoc.vue

@@ -38,31 +38,5 @@
                 </tbody>
             </table>
         </div>
-
-        <h3>Close Button Keyboard Support</h3>
-        <div class="doc-tablewrapper">
-            <table class="doc-table">
-                <thead>
-                    <tr>
-                        <th>Key</th>
-                        <th>Function</th>
-                    </tr>
-                </thead>
-                <tbody>
-                    <tr>
-                        <td>
-                            <i>enter</i>
-                        </td>
-                        <td>Closes the popup and moves focus to the trigger.</td>
-                    </tr>
-                    <tr>
-                        <td>
-                            <i>space</i>
-                        </td>
-                        <td>Closes the popup and moves focus to the trigger.</td>
-                    </tr>
-                </tbody>
-            </table>
-        </div>
     </DocSectionText>
 </template>