@dnd-kit/accessibility - npm Package Compare versions

Comparing version 3.0.0 to 3.0.1-next-20224300590

CHANGELOG.md

 # @dnd-kit/accessibility
 
+## 3.0.1-next-20224300590
+
+### Patch Changes
+
+- [#776](https://github.com/clauderic/dnd-kit/pull/776) [`3978c43`](https://github.com/clauderic/dnd-kit/commit/3978c43c6b045f10b75f47ad8bbea38a84437bd6) Thanks [@clauderic](https://github.com/clauderic)! - The ARIA live region element used for screen reader announcements is now positioned using `position: fixed` instead of `position: absolute`. As of `@dnd-kit/core^6.0.0`, the live region element is no longer portaled by default into the `document.body`. This change was introduced in order to fix issues with portaled live regions. However, this change can introduce visual regressions when using absolutely positioned elements, since the live region element is constrained to the stacking and position context of its closest positioned ancestor. Using fixed position ensures the element does not introduce visual regressions.
+
 ## 3.0.0
@@ -4,0 +10,0 @@

dist/accessibility.cjs.development.js

@@ -13,6 +13,7 @@ 'use strict';
 };
-function HiddenText({
-  id,
-  value
-}) {
+function HiddenText(_ref) {
+  let {
+    id,
+    value
+  } = _ref;
   return React__default.createElement("div", {
@@ -25,3 +26,3 @@ id: id,
 const visuallyHidden = {
-  position: 'absolute',
+  position: 'fixed',
   width: 1,
@@ -37,6 +38,7 @@ height: 1,
 };
-function LiveRegion({
-  id,
-  announcement
-}) {
+function LiveRegion(_ref) {
+  let {
+    id,
+    announcement
+  } = _ref;
   return React__default.createElement("div", {
@@ -43,0 +45,0 @@ id: id,

dist/accessibility.cjs.production.min.js

@@ -1,2 +0,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,t=require("react"),n=(e=t)&&"object"==typeof e&&"default"in e?e.default:e;const i={display:"none"},r={position:"absolute",width:1,height:1,margin:-1,border:0,padding:0,overflow:"hidden",clip:"rect(0 0 0 0)",clipPath:"inset(100%)",whiteSpace:"nowrap"};exports.HiddenText=function({id:e,value:t}){return n.createElement("div",{id:e,style:i},t)},exports.LiveRegion=function({id:e,announcement:t}){return n.createElement("div",{id:e,style:r,role:"status","aria-live":"assertive","aria-atomic":!0},t)},exports.useAnnouncement=function(){const[e,n]=t.useState("");return{announce:t.useCallback(e=>{null!=e&&n(e)},[]),announcement:e}};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,t=require("react"),n=(e=t)&&"object"==typeof e&&"default"in e?e.default:e;const i={display:"none"},r={position:"fixed",width:1,height:1,margin:-1,border:0,padding:0,overflow:"hidden",clip:"rect(0 0 0 0)",clipPath:"inset(100%)",whiteSpace:"nowrap"};exports.HiddenText=function(e){let{id:t,value:r}=e;return n.createElement("div",{id:t,style:i},r)},exports.LiveRegion=function(e){let{id:t,announcement:i}=e;return n.createElement("div",{id:t,style:r,role:"status","aria-live":"assertive","aria-atomic":!0},i)},exports.useAnnouncement=function(){const[e,n]=t.useState("");return{announce:t.useCallback(e=>{null!=e&&n(e)},[]),announcement:e}};
 //# sourceMappingURL=accessibility.cjs.production.min.js.map

dist/accessibility.esm.js

@@ -6,6 +6,7 @@ import React, { useState, useCallback } from 'react';
 };
-function HiddenText({
-  id,
-  value
-}) {
+function HiddenText(_ref) {
+  let {
+    id,
+    value
+  } = _ref;
   return React.createElement("div", {
@@ -18,3 +19,3 @@ id: id,
 const visuallyHidden = {
-  position: 'absolute',
+  position: 'fixed',
   width: 1,
@@ -30,6 +31,7 @@ height: 1,
 };
-function LiveRegion({
-  id,
-  announcement
-}) {
+function LiveRegion(_ref) {
+  let {
+    id,
+    announcement
+  } = _ref;
   return React.createElement("div", {
@@ -36,0 +38,0 @@ id: id,

package.json

 {
   "name": "@dnd-kit/accessibility",
-  "version": "3.0.0",
+  "version": "3.0.1-next-20224300590",
   "description": "A generic toolkit to help with accessibility",
@@ -5,0 +5,0 @@ "author": "Claudéric Demers",

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

No v1

Quality

Package is not semver >=1. This means it is not stable and does not support ^ ranges.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

18929

increased by3.78%

Lines of code

146

increased by2.82%

Worsened metrics

Number of low quality alerts

3

increased by50%

No dependency changes