@reach/alert - npm Package Compare versions

Comparing version 0.7.2 to 0.7.3

dist/alert.cjs.development.js

 'use strict';
 
-Object.defineProperty(exports, '__esModule', { value: true });
-
 function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; }
@@ -15,4 +13,6 @@
 
-// The approach here is to allow developers to render a visual <Alert> and then
-// an alert (SRs don't read them on first load anyway)
+/*
+ * Singleton state is fine because you don't server render
+ * an alert (SRs don't read them on first load anyway)
+ */
 
@@ -19,0 +19,0 @@ var keys = {

dist/alert.cjs.production.min.js

@@ -1,2 +0,2 @@
-"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}Object.defineProperty(exports,"__esModule",{value:!0});var t=require("tslib"),r=require("react"),n=e(r),u=require("react-dom"),i=e(require("@reach/visually-hidden")),c=require("@reach/utils");require("prop-types");var o,l={polite:-1,assertive:-1},a={polite:{},assertive:{}},s={polite:null,assertive:null},f=r.forwardRef((function(e,u){var i=e.children,o=e.type,l=void 0===o?"polite":o,a=t.__rest(e,["children","type"]),s=r.useRef(null),f=c.useForkedRef(u,s),v=r.useMemo((function(){return n.createElement("div",t.__assign({},a,{ref:f,"data-reach-alert":!0}),i)}),[i,a]);return function(e,t,n){var u=c.usePrevious(e),i=r.useRef(null),o=r.useRef(!1);r.useEffect((function(){var r=(n.current||{}).ownerDocument;o.current?u!==e?(i.current&&i.current.unmount(),i.current=d(e,r),i.current.mount(t)):i.current&&i.current.update(t):(o.current=!0,i.current=d(e,r),i.current.mount(t))}),[t,e,u]),r.useEffect((function(){return function(){i.current&&i.current.unmount()}}),[])}(l,v,s),v}));function d(e,t){void 0===t&&(t=document);var r=++l[e];return{mount:function n(u){if(s[e])a[e][r]=u,v();else{var i=t.createElement("div");i.setAttribute("data-reach-live-"+e,"true"),s[e]=i,t.body.appendChild(s[e]),n(u)}},update:function(t){a[e][r]=t,v()},unmount:function(){delete a[e][r],v()}}}function v(){null!=o&&window.clearTimeout(o),o=window.setTimeout((function(){Object.keys(a).forEach((function(e){var t=e;s[t]&&u.render(n.createElement(i,null,n.createElement("div",{role:"assertive"===t?"alert":"status","aria-live":t},Object.keys(a[t]).map((function(e){return n.cloneElement(a[t][e],{key:e,ref:null})})))),s[t])}))}),500)}f.displayName="Alert",exports.Alert=f,exports.default=f;
+"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}var t=require("tslib"),r=require("react"),n=e(r),u=require("react-dom"),i=e(require("@reach/visually-hidden")),c=require("@reach/utils");require("prop-types");var o,a={polite:-1,assertive:-1},l={polite:{},assertive:{}},s={polite:null,assertive:null},f=r.forwardRef((function(e,u){var i=e.children,o=e.type,a=void 0===o?"polite":o,l=t.__rest(e,["children","type"]),s=r.useRef(null),f=c.useForkedRef(u,s),v=r.useMemo((function(){return n.createElement("div",t.__assign({},l,{ref:f,"data-reach-alert":!0}),i)}),[i,l]);return function(e,t,n){var u=c.usePrevious(e),i=r.useRef(null),o=r.useRef(!1);r.useEffect((function(){var r=(n.current||{}).ownerDocument;o.current?u!==e?(i.current&&i.current.unmount(),i.current=d(e,r),i.current.mount(t)):i.current&&i.current.update(t):(o.current=!0,i.current=d(e,r),i.current.mount(t))}),[t,e,u]),r.useEffect((function(){return function(){i.current&&i.current.unmount()}}),[])}(a,v,s),v}));function d(e,t){void 0===t&&(t=document);var r=++a[e];return{mount:function n(u){if(s[e])l[e][r]=u,v();else{var i=t.createElement("div");i.setAttribute("data-reach-live-"+e,"true"),s[e]=i,t.body.appendChild(s[e]),n(u)}},update:function(t){l[e][r]=t,v()},unmount:function(){delete l[e][r],v()}}}function v(){null!=o&&window.clearTimeout(o),o=window.setTimeout((function(){Object.keys(l).forEach((function(e){var t=e;s[t]&&u.render(n.createElement(i,null,n.createElement("div",{role:"assertive"===t?"alert":"status","aria-live":t},Object.keys(l[t]).map((function(e){return n.cloneElement(l[t][e],{key:e,ref:null})})))),s[t])}))}),500)}f.displayName="Alert",exports.Alert=f,exports.default=f;
 //# sourceMappingURL=alert.cjs.production.min.js.map

dist/alert.esm.js

@@ -8,4 +8,6 @@ import { __rest, __assign } from 'tslib';
 
-// The approach here is to allow developers to render a visual <Alert> and then
-// an alert (SRs don't read them on first load anyway)
+/*
+ * Singleton state is fine because you don't server render
+ * an alert (SRs don't read them on first load anyway)
+ */
 
@@ -12,0 +14,0 @@ var keys = {

dist/index.d.ts

@@ -0,1 +1,21 @@
+/**
+ * Welcome to @reach/alert!
+ *
+ * The approach here is to allow developers to render a visual <Alert> and then
+ * we mirror that to a couple of aria live regions behind the scenes. This way,
+ * most of the time, developers don't have to think about visual vs. aria
+ * alerts.
+ *
+ * Limitations: Developers can't read from context inside of an Alert because
+ * we aren't using ReactDOM.createPortal(), we're actually creating a couple of
+ * brand new React roots. We could use createPortal but then apps would need to
+ * render the entire app tree in an <AlertProvider>, or maybe there's a way
+ * with default context to do it, but we haven't explored that yet. So, we'll
+ * see how this goes, and if it becomes a problem, we can introduce a portal
+ * later.
+ *
+ * @see Docs     https://reacttraining.com/reach-ui/alert
+ * @see Source   https://github.com/reach/reach-ui/tree/master/packages/alert
+ * @see WAI-ARIA https://www.w3.org/TR/wai-aria-practices-1.1/#alert
+ */
 import React from "react";
@@ -2,0 +22,0 @@ /**

package.json

 {
   "name": "@reach/alert",
-  "version": "0.7.2",
+  "version": "0.7.3",
   "description": "Screen-reader-friendly alert messages.",
@@ -18,4 +18,4 @@ "author": "React Training <[e-mail]>",
   "dependencies": {
-    "@reach/utils": "^0.7.2",
-    "@reach/visually-hidden": "^0.7.2",
+    "@reach/utils": "^0.7.3",
+    "@reach/visually-hidden": "^0.7.3",
     "prop-types": "^15.7.2"
@@ -31,5 +31,6 @@ },
   "files": [
+    "README.md",
     "dist"
   ],
-  "gitHead": "96cf6c191cca0f2cbcb7ff578f15e289efeda1e2"
+  "gitHead": "fe739beb1d94cc58c4e72f88ab58efa58e0de8c8"
 }

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

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

No README

Quality

Package does not have a README. This may indicate a failed publish or a low quality package.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

45788

increased by7.09%

Number of package files

11

increased by10%

Lines of code

342

increased by7.21%

Number of medium quality alerts

0

decreased by-100%

Number of lines in readme file

37

increased byInfinity%

Dependency changes

• Updated@reach/utils@^0.7.3

• Updated@reach/visually-hidden@^0.7.3