From 725c7371c502d837e3cc12c252ae665cfa81dd18 Mon Sep 17 00:00:00 2001 From: J-Michalek <71264422+J-Michalek@users.noreply.github.com> Date: Sun, 12 Jan 2025 20:10:46 +0100 Subject: [PATCH 1/3] feat(button): add a11yAttrs to slot types Ideally the types would only suggest it when the asChild option is set to true, but I suspect that we cannot do that without composition API and the generic types - even then it could be very messy. --- packages/primevue/src/button/Button.d.ts | 8 +++++++- 1 file changed, 7 insertions(+), 1 deletion(-) diff --git a/packages/primevue/src/button/Button.d.ts b/packages/primevue/src/button/Button.d.ts index a1605914c..a33a3c481 100755 --- a/packages/primevue/src/button/Button.d.ts +++ b/packages/primevue/src/button/Button.d.ts @@ -227,7 +227,13 @@ export interface ButtonSlots { /** * Custom content such as icons, images and text can be placed inside the button via the default slot. Note that when slot is used, label, icon and badge properties are not included. */ - default(): VNode[]; + default(scope: { + /** + * Object containing the accessibility attributes. + * @remarks Only available when {@link ButtonProps.asChild} is set to true. + */ + a11yAttrs?: Record + }): VNode[]; /** * Custom icon template. * @param {Object} scope - icon slot's params. From 8c570cac8c74339aa1eb061709dccd7ad8559d0c Mon Sep 17 00:00:00 2001 From: tugcekucukoglu Date: Mon, 13 Jan 2025 10:08:41 +0300 Subject: [PATCH 2/3] Fixed #7071 --- packages/primevue/src/tooltip/Tooltip.js | 13 +++++++++---- 1 file changed, 9 insertions(+), 4 deletions(-) diff --git a/packages/primevue/src/tooltip/Tooltip.js b/packages/primevue/src/tooltip/Tooltip.js index a9747921a..faa3554e0 100755 --- a/packages/primevue/src/tooltip/Tooltip.js +++ b/packages/primevue/src/tooltip/Tooltip.js @@ -249,6 +249,11 @@ const Tooltip = BaseTooltip.extend('tooltip', { getTooltipElement(el) { return document.getElementById(el.$_ptooltipId); }, + getArrowElement(el) { + let tooltipElement = this.getTooltipElement(el); + + return findSingle(tooltipElement, '[data-pc-section="arrow"]'); + }, create(el) { const modifiers = el.$_ptooltipModifiers; @@ -383,7 +388,7 @@ const Tooltip = BaseTooltip.extend('tooltip', { alignRight(el) { this.preAlign(el, 'right'); let tooltipElement = this.getTooltipElement(el); - let arrowElement = findSingle(tooltipElement, '[data-pc-section="arrow"]'); + let arrowElement = this.getArrowElement(el); let hostOffset = this.getHostOffset(el); let left = hostOffset.left + getOuterWidth(el); let top = hostOffset.top + (getOuterHeight(el) - getOuterHeight(tooltipElement)) / 2; @@ -399,7 +404,7 @@ const Tooltip = BaseTooltip.extend('tooltip', { alignLeft(el) { this.preAlign(el, 'left'); let tooltipElement = this.getTooltipElement(el); - let arrowElement = findSingle(tooltipElement, '[data-pc-section="arrow"]'); + let arrowElement = this.getArrowElement(el); let hostOffset = this.getHostOffset(el); let left = hostOffset.left - getOuterWidth(tooltipElement); let top = hostOffset.top + (getOuterHeight(el) - getOuterHeight(tooltipElement)) / 2; @@ -415,7 +420,7 @@ const Tooltip = BaseTooltip.extend('tooltip', { alignTop(el) { this.preAlign(el, 'top'); let tooltipElement = this.getTooltipElement(el); - let arrowElement = findSingle(tooltipElement, '[data-pc-section="arrow"]'); + let arrowElement = this.getArrowElement(el); let tooltipWidth = getOuterWidth(tooltipElement); let elementWidth = getOuterWidth(el); let { width: viewportWidth } = getViewport(); @@ -446,7 +451,7 @@ const Tooltip = BaseTooltip.extend('tooltip', { alignBottom(el) { this.preAlign(el, 'bottom'); let tooltipElement = this.getTooltipElement(el); - let arrowElement = findSingle(tooltipElement, '[data-pc-section="arrow"]'); + let arrowElement = this.getArrowElement(el); let tooltipWidth = getOuterWidth(tooltipElement); let elementWidth = getOuterWidth(el); let { width: viewportWidth } = getViewport(); From a4b80a22c93c25d6c1c8f5884d72cc4c9c76140e Mon Sep 17 00:00:00 2001 From: GitHub Actions Bot <> Date: Mon, 13 Jan 2025 07:13:50 +0000 Subject: [PATCH 3/3] Update API doc --- apps/showcase/doc/common/apidoc/index.json | 8 ++- packages/primevue/src/button/Button.d.ts | 8 +-- pnpm-lock.yaml | 74 +++++++++++----------- 3 files changed, 48 insertions(+), 42 deletions(-) diff --git a/apps/showcase/doc/common/apidoc/index.json b/apps/showcase/doc/common/apidoc/index.json index e15578372..4043c1243 100644 --- a/apps/showcase/doc/common/apidoc/index.json +++ b/apps/showcase/doc/common/apidoc/index.json @@ -7055,7 +7055,13 @@ "methods": [ { "name": "default", - "parameters": [], + "parameters": [ + { + "name": "scope", + "optional": false, + "type": "{\n \t a11yAttrs: Record, // Object containing the accessibility attributes.\n }" + } + ], "returnType": "VNode[]", "description": "Custom content such as icons, images and text can be placed inside the button via the default slot. Note that when slot is used, label, icon and badge properties are not included." }, diff --git a/packages/primevue/src/button/Button.d.ts b/packages/primevue/src/button/Button.d.ts index a33a3c481..1993f91b4 100755 --- a/packages/primevue/src/button/Button.d.ts +++ b/packages/primevue/src/button/Button.d.ts @@ -229,10 +229,10 @@ export interface ButtonSlots { */ default(scope: { /** - * Object containing the accessibility attributes. - * @remarks Only available when {@link ButtonProps.asChild} is set to true. - */ - a11yAttrs?: Record + * Object containing the accessibility attributes. + * @remarks Only available when {@link ButtonProps.asChild} is set to true. + */ + a11yAttrs?: Record; }): VNode[]; /** * Custom icon template. diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 1691c9b30..e9bb0ad36 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -2386,20 +2386,20 @@ packages: '@ungap/structured-clone@1.2.1': resolution: {integrity: sha512-fEzPV3hSkSMltkw152tJKNARhOupqbH96MZWyRjNaYZOMIzbrTeQDG+MTc6Mr2pgzFQzFxAfmhGDNP5QK++2ZA==} - '@unhead/dom@1.11.15': - resolution: {integrity: sha512-2OZ7zvZQLqlqkhvsKsNOhxxoO3vgjygzzrmtooQR9QNKY+3HjwJ3+QfjGswXI976YV7VJem57ydQSMk1ijB7yg==} + '@unhead/dom@1.11.16': + resolution: {integrity: sha512-TSERgn7I3oSlT8cdN8RpY60XPWU5mYMgWRRCma4zbD3MJwKCpAbBbv39SX47FcFDye1+EPCIqLDhCNDbowMcGA==} - '@unhead/schema@1.11.15': - resolution: {integrity: sha512-UkLz1dqw4yoh4jELEyLsgSG7yrXc+gv68GkQeTv8LysEPa8sXtFqhfuqTBLhY3sHqSnP8RkDknhtFhG2S3fuKQ==} + '@unhead/schema@1.11.16': + resolution: {integrity: sha512-G5x4qG9g7dQow/54v5GU1KhtlUnBbmHQkRLMcjH6lwslcqD9uXIMIjV/csYRDd0hupfIutji0wOI75U33bJS0g==} - '@unhead/shared@1.11.15': - resolution: {integrity: sha512-VT42ssmwpFGfixfXqAZ+Rn7KyNG0yFqWGsvLOXIgahiTzh3N1k2st1tPvuYFZU22dtWBNxG7cvy8yxUd1vunMQ==} + '@unhead/shared@1.11.16': + resolution: {integrity: sha512-T0sSvHzfmYzC83bufvgRvJ6tkwDlaxQkr8jIeAnhEom5iX2Yjd/jvneXzGgBhmkrRbk0WIk/f/dggkp7jSVXBQ==} - '@unhead/ssr@1.11.15': - resolution: {integrity: sha512-btoJ7huldVdxOJOr9yx8DpDiUELzdlX3LB0k5cBub+CI4nZoPC/8ovuaYzKBriAIkEtQp9g9ytHRUJYDvim/1g==} + '@unhead/ssr@1.11.16': + resolution: {integrity: sha512-m4fK+QIsZuK16aBx16RAiagB2GOmha15kHc7syOBxmj2/3kJsFj3DXLST8RgznXrRcXkStJTxVoMviqAyKI+yw==} - '@unhead/vue@1.11.15': - resolution: {integrity: sha512-2NT8Kph5AvB/qO+C8UKAc7cudbFRZTJk0eRpn8o1nG3yk2+mWvN0vsTTjnKvXixNF193I/R+zqo/NkcjgaWG9A==} + '@unhead/vue@1.11.16': + resolution: {integrity: sha512-4y+AH+PyU7FgVp9gXX1HgY3F9u4+SxMyoP5lKa2CC96TdcjPJBduEWq8MG1y7maLUXL38BclOxJ+NDEAj6GxEg==} peerDependencies: vue: '>=2.7 || >=3' @@ -6195,8 +6195,8 @@ packages: unenv@1.10.0: resolution: {integrity: sha512-wY5bskBQFL9n3Eca5XnhH6KbUo/tfvkwm9OpcdCvLaeA7piBNbavbOKJySEwQ1V0RH6HvNlSAFRTpvTqgKRQXQ==} - unhead@1.11.15: - resolution: {integrity: sha512-fA0rYB7qMHKY4sg0yzEXhi0cqiF/nl/OUKNaXOS9ChJwCjJxabpZvmQIUOiGS+1ckoFbZc3qZnhDLpdeNhOQwg==} + unhead@1.11.16: + resolution: {integrity: sha512-ty50pstic2rNt+Pq/QaMiOOmJZaR8P+vba5sk6HYgRzbihENLUWkwRWQaTnl3II/eUahs9NcL5splGX40FKVRA==} unicode-canonical-property-names-ecmascript@2.0.1: resolution: {integrity: sha512-dA8WbNeb2a6oQzAQ55YlT5vQAWGV9WXOsi3SskE3bcCdM0P4SDd+24zS/OCacdRq5BkdsRj9q3Pg6YyQoxIGqg==} @@ -9210,40 +9210,40 @@ snapshots: '@ungap/structured-clone@1.2.1': {} - '@unhead/dom@1.11.15': + '@unhead/dom@1.11.16': dependencies: - '@unhead/schema': 1.11.15 - '@unhead/shared': 1.11.15 + '@unhead/schema': 1.11.16 + '@unhead/shared': 1.11.16 - '@unhead/schema@1.11.15': + '@unhead/schema@1.11.16': dependencies: hookable: 5.5.3 zhead: 2.2.4 - '@unhead/shared@1.11.15': + '@unhead/shared@1.11.16': dependencies: - '@unhead/schema': 1.11.15 + '@unhead/schema': 1.11.16 packrup: 0.1.2 - '@unhead/ssr@1.11.15': + '@unhead/ssr@1.11.16': dependencies: - '@unhead/schema': 1.11.15 - '@unhead/shared': 1.11.15 + '@unhead/schema': 1.11.16 + '@unhead/shared': 1.11.16 - '@unhead/vue@1.11.15(vue@3.5.13(typescript@4.9.5))': + '@unhead/vue@1.11.16(vue@3.5.13(typescript@4.9.5))': dependencies: - '@unhead/schema': 1.11.15 - '@unhead/shared': 1.11.15 + '@unhead/schema': 1.11.16 + '@unhead/shared': 1.11.16 hookable: 5.5.3 - unhead: 1.11.15 + unhead: 1.11.16 vue: 3.5.13(typescript@4.9.5) - '@unhead/vue@1.11.15(vue@3.5.13(typescript@5.7.3))': + '@unhead/vue@1.11.16(vue@3.5.13(typescript@5.7.3))': dependencies: - '@unhead/schema': 1.11.15 - '@unhead/shared': 1.11.15 + '@unhead/schema': 1.11.16 + '@unhead/shared': 1.11.16 hookable: 5.5.3 - unhead: 1.11.15 + unhead: 1.11.16 vue: 3.5.13(typescript@5.7.3) '@vercel/nft@0.22.6(encoding@0.1.13)': @@ -12046,8 +12046,8 @@ snapshots: '@nuxt/telemetry': 2.6.4(magicast@0.3.5)(rollup@3.29.5) '@nuxt/ui-templates': 1.3.4 '@nuxt/vite-builder': 3.3.2(@types/node@18.19.70)(eslint@8.57.1)(magicast@0.3.5)(optionator@0.9.4)(sass@1.45.0)(terser@5.37.0)(typescript@4.9.5)(vue@3.5.13(typescript@4.9.5)) - '@unhead/ssr': 1.11.15 - '@unhead/vue': 1.11.15(vue@3.5.13(typescript@4.9.5)) + '@unhead/ssr': 1.11.16 + '@unhead/vue': 1.11.16(vue@3.5.13(typescript@4.9.5)) '@vue/reactivity': 3.5.13 '@vue/shared': 3.5.13 chokidar: 3.6.0 @@ -12132,8 +12132,8 @@ snapshots: '@nuxt/telemetry': 2.6.4(magicast@0.3.5)(rollup@4.30.1) '@nuxt/ui-templates': 1.3.4 '@nuxt/vite-builder': 3.3.2(@types/node@18.19.70)(eslint@8.57.1)(magicast@0.3.5)(optionator@0.9.4)(terser@5.37.0)(typescript@5.7.3)(vue@3.5.13(typescript@5.7.3)) - '@unhead/ssr': 1.11.15 - '@unhead/vue': 1.11.15(vue@3.5.13(typescript@5.7.3)) + '@unhead/ssr': 1.11.16 + '@unhead/vue': 1.11.16(vue@3.5.13(typescript@5.7.3)) '@vue/reactivity': 3.5.13 '@vue/shared': 3.5.13 chokidar: 3.6.0 @@ -13756,11 +13756,11 @@ snapshots: node-fetch-native: 1.6.4 pathe: 1.1.2 - unhead@1.11.15: + unhead@1.11.16: dependencies: - '@unhead/dom': 1.11.15 - '@unhead/schema': 1.11.15 - '@unhead/shared': 1.11.15 + '@unhead/dom': 1.11.16 + '@unhead/schema': 1.11.16 + '@unhead/shared': 1.11.16 hookable: 5.5.3 unicode-canonical-property-names-ecmascript@2.0.1: {}