Socket
Socket
Sign inDemoInstall

@reach/alert-dialog

Package Overview
Dependencies
Maintainers
4
Versions
66
Alerts
File Explorer

Advanced tools

License
Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@reach/alert-dialog - npm Package Compare versions

Comparing version 0.10.5 to 0.11.0

55

dist/alert-dialog.cjs.development.js

@@ -5,12 +5,15 @@ 'use strict';

function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; }
var React = require('react');
var React__default = _interopDefault(React);
var dialog = require('@reach/dialog');
var autoId = require('@reach/auto-id');
var utils = require('@reach/utils');
var invariant = _interopDefault(require('invariant'));
var PropTypes = _interopDefault(require('prop-types'));
var invariant = require('invariant');
var PropTypes = require('prop-types');
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
var invariant__default = /*#__PURE__*/_interopDefaultLegacy(invariant);
var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
function _objectWithoutPropertiesLoose(source, excluded) {

@@ -42,3 +45,3 @@ if (source == null) return {};

*
* @see Docs https://reacttraining.com/reach-ui/alert-dialog#alertdialogoverlay
* @see Docs https://reach.tech/alert-dialog#alertdialogoverlay
*/

@@ -55,3 +58,3 @@

var descriptionId = id ? utils.makeId("alert-dialog-description", id) : undefined;
return React__default.createElement(AlertDialogContext.Provider, {
return React__default['default'].createElement(AlertDialogContext.Provider, {
value: {

@@ -63,3 +66,3 @@ labelId: labelId,

}
}, React__default.createElement(dialog.DialogOverlay, Object.assign({}, props, {
}, React__default['default'].createElement(dialog.DialogOverlay, Object.assign({}, props, {
ref: ref,

@@ -74,8 +77,8 @@ "data-reach-alert-dialog-overlay": true,

AlertDialogOverlay.propTypes = {
isOpen: PropTypes.bool,
onDismiss: PropTypes.func,
isOpen: PropTypes__default['default'].bool,
onDismiss: PropTypes__default['default'].func,
leastDestructiveRef: function leastDestructiveRef() {
return null;
},
children: PropTypes.node
children: PropTypes__default['default'].node
};

@@ -96,3 +99,3 @@ } ////////////////////////////////////////////////////////////////////////////////

*
* @see Docs https://reacttraining.com/reach-ui/alert-dialog#alertdialogcontent
* @see Docs https://reach.tech/alert-dialog#alertdialogcontent
*/

@@ -115,8 +118,8 @@

if (labelId) {
!ownerDocument.getElementById(labelId) ? invariant(false, "@reach/alert-dialog: You must render a `<AlertDialogLabel>`\n inside an `<AlertDialog/>`.") : void 0;
!ownerDocument.getElementById(labelId) ? invariant__default['default'](false, "@reach/alert-dialog: You must render a `<AlertDialogLabel>`\n inside an `<AlertDialog/>`.") : void 0;
}
!leastDestructiveRef ? invariant(false, "@reach/alert-dialog: You must provide a `leastDestructiveRef` to\n `<AlertDialog>` or `<AlertDialogOverlay/>`. Please see\n https://ui.reach.tech/alert-dialog/#alertdialogoverlay-leastdestructiveref") : void 0; // eslint-disable-next-line react-hooks/exhaustive-deps
!leastDestructiveRef ? invariant__default['default'](false, "@reach/alert-dialog: You must provide a `leastDestructiveRef` to\n `<AlertDialog>` or `<AlertDialogOverlay/>`. Please see\n https://ui.reach.tech/alert-dialog/#alertdialogoverlay-leastdestructiveref") : void 0; // eslint-disable-next-line react-hooks/exhaustive-deps
}, [labelId, leastDestructiveRef]);
return React__default.createElement(dialog.DialogContent // The element that contains all elements of the dialog, including the
return React__default['default'].createElement(dialog.DialogContent // The element that contains all elements of the dialog, including the
// alert message and any dialog buttons, has role alertdialog.

@@ -141,3 +144,3 @@ // https://www.w3.org/TR/wai-aria-practices-1.2/#alertdialog

AlertDialogContent.propTypes = {
children: PropTypes.node
children: PropTypes__default['default'].node
};

@@ -155,3 +158,3 @@ } ////////////////////////////////////////////////////////////////////////////////

*
* @see Docs https://reacttraining.com/reach-ui/alert-dialog#alertdialoglabel
* @see Docs https://reach.tech/alert-dialog#alertdialoglabel
*/

@@ -164,3 +167,3 @@

return React__default.createElement("div", Object.assign({}, props, {
return React__default['default'].createElement("div", Object.assign({}, props, {
id: labelId,

@@ -182,3 +185,3 @@ "data-reach-alert-dialog-label": true

*
* @see Docs https://reacttraining.com/reach-ui/alert-dialog#alertdialogdescription
* @see Docs https://reach.tech/alert-dialog#alertdialogdescription
* @param props

@@ -192,3 +195,3 @@ */

return React__default.createElement("div", Object.assign({}, props, {
return React__default['default'].createElement("div", Object.assign({}, props, {
id: descriptionId,

@@ -208,3 +211,3 @@ "data-reach-alert-dialog-description": true

*
* @see Docs https://reacttraining.com/reach-ui/alert-dialog#alertdialog
* @see Docs https://reach.tech/alert-dialog#alertdialog
* @param props

@@ -221,3 +224,3 @@ */

return React__default.createElement(AlertDialogOverlay, Object.assign({}, {
return React__default['default'].createElement(AlertDialogOverlay, Object.assign({}, {
isOpen: isOpen,

@@ -227,3 +230,3 @@ onDismiss: onDismiss,

id: id
}), React__default.createElement(AlertDialogContent, Object.assign({}, props)));
}), React__default['default'].createElement(AlertDialogContent, Object.assign({}, props)));
};

@@ -234,8 +237,8 @@

AlertDialog.propTypes = {
isOpen: PropTypes.bool,
onDismiss: PropTypes.func,
isOpen: PropTypes__default['default'].bool,
onDismiss: PropTypes__default['default'].func,
leastDestructiveRef: function leastDestructiveRef() {
return null;
},
children: PropTypes.node
children: PropTypes__default['default'].node
};

@@ -242,0 +245,0 @@ }

2

dist/alert-dialog.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("react"),r=e(t),a=require("@reach/dialog"),i=require("@reach/auto-id"),l=require("@reach/utils"),n=e(require("invariant"));function o(e,t){if(null==e)return{};var r,a,i={},l=Object.keys(e);for(a=0;a<l.length;a++)t.indexOf(r=l[a])>=0||(i[r]=e[r]);return i}require("prop-types");var s=l.createNamedContext("AlertDialogContext",{}),c=t.forwardRef((function(e,n){var c=e.leastDestructiveRef,d=o(e,["leastDestructiveRef"]),u=t.useRef(null),f=l.useForkedRef(n,u),v=i.useId(d.id),g=v?l.makeId("alert-dialog",v):void 0,p=v?l.makeId("alert-dialog-description",v):void 0;return r.createElement(s.Provider,{value:{labelId:g,descriptionId:p,overlayRef:u,leastDestructiveRef:c}},r.createElement(a.DialogOverlay,Object.assign({},d,{ref:f,"data-reach-alert-dialog-overlay":!0,initialFocusRef:c})))})),d=t.forwardRef((function(e,i){var c=e.children,d=o(e,["children"]),u=t.useContext(s),f=u.descriptionId,v=u.labelId,g=u.leastDestructiveRef,p=u.overlayRef;return t.useEffect((function(){var e=l.getOwnerDocument(p.current)||document;v&&(e.getElementById(v)||n(!1)),g||n(!1)}),[v,g]),r.createElement(a.DialogContent,Object.assign({role:"alertdialog","aria-describedby":f,"aria-labelledby":d["aria-label"]?void 0:v},d,{ref:i,"data-reach-alert-dialong-content":!0,"data-reach-alert-dialog-content":!0}),c)}));exports.AlertDialog=function(e){var t=e.id,a=e.isOpen,i=e.onDismiss,l=e.leastDestructiveRef,n=o(e,["id","isOpen","onDismiss","leastDestructiveRef"]);return r.createElement(c,Object.assign({},{isOpen:a,onDismiss:i,leastDestructiveRef:l,id:t}),r.createElement(d,Object.assign({},n)))},exports.AlertDialogContent=d,exports.AlertDialogDescription=function(e){var a=t.useContext(s);return r.createElement("div",Object.assign({},e,{id:a.descriptionId,"data-reach-alert-dialog-description":!0}))},exports.AlertDialogLabel=function(e){var a=t.useContext(s);return r.createElement("div",Object.assign({},e,{id:a.labelId,"data-reach-alert-dialog-label":!0}))},exports.AlertDialogOverlay=c;
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("@reach/dialog"),r=require("@reach/auto-id"),a=require("@reach/utils"),i=require("invariant");function l(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}require("prop-types");var n=l(e),o=l(i);function d(e,t){if(null==e)return{};var r,a,i={},l=Object.keys(e);for(a=0;a<l.length;a++)t.indexOf(r=l[a])>=0||(i[r]=e[r]);return i}var s=a.createNamedContext("AlertDialogContext",{}),u=e.forwardRef((function(i,l){var o=i.leastDestructiveRef,u=d(i,["leastDestructiveRef"]),c=e.useRef(null),f=a.useForkedRef(l,c),v=r.useId(u.id),g=v?a.makeId("alert-dialog",v):void 0,p=v?a.makeId("alert-dialog-description",v):void 0;return n.default.createElement(s.Provider,{value:{labelId:g,descriptionId:p,overlayRef:c,leastDestructiveRef:o}},n.default.createElement(t.DialogOverlay,Object.assign({},u,{ref:f,"data-reach-alert-dialog-overlay":!0,initialFocusRef:o})))})),c=e.forwardRef((function(r,i){var l=r.children,u=d(r,["children"]),c=e.useContext(s),f=c.descriptionId,v=c.labelId,g=c.leastDestructiveRef,p=c.overlayRef;return e.useEffect((function(){var e=a.getOwnerDocument(p.current)||document;v&&(e.getElementById(v)||o.default(!1)),g||o.default(!1)}),[v,g]),n.default.createElement(t.DialogContent,Object.assign({role:"alertdialog","aria-describedby":f,"aria-labelledby":u["aria-label"]?void 0:v},u,{ref:i,"data-reach-alert-dialong-content":!0,"data-reach-alert-dialog-content":!0}),l)}));exports.AlertDialog=function(e){var t=e.id,r=e.isOpen,a=e.onDismiss,i=e.leastDestructiveRef,l=d(e,["id","isOpen","onDismiss","leastDestructiveRef"]);return n.default.createElement(u,Object.assign({},{isOpen:r,onDismiss:a,leastDestructiveRef:i,id:t}),n.default.createElement(c,Object.assign({},l)))},exports.AlertDialogContent=c,exports.AlertDialogDescription=function(t){var r=e.useContext(s);return n.default.createElement("div",Object.assign({},t,{id:r.descriptionId,"data-reach-alert-dialog-description":!0}))},exports.AlertDialogLabel=function(t){var r=e.useContext(s);return n.default.createElement("div",Object.assign({},t,{id:r.labelId,"data-reach-alert-dialog-label":!0}))},exports.AlertDialogOverlay=u;
//# sourceMappingURL=alert-dialog.cjs.production.min.js.map

10

dist/alert-dialog.esm.js

@@ -34,3 +34,3 @@ import React, { forwardRef, useRef, useContext, useEffect } from 'react';

*
* @see Docs https://reacttraining.com/reach-ui/alert-dialog#alertdialogoverlay
* @see Docs https://reach.tech/alert-dialog#alertdialogoverlay
*/

@@ -85,3 +85,3 @@

*
* @see Docs https://reacttraining.com/reach-ui/alert-dialog#alertdialogcontent
* @see Docs https://reach.tech/alert-dialog#alertdialogcontent
*/

@@ -142,3 +142,3 @@

*
* @see Docs https://reacttraining.com/reach-ui/alert-dialog#alertdialoglabel
* @see Docs https://reach.tech/alert-dialog#alertdialoglabel
*/

@@ -168,3 +168,3 @@

*
* @see Docs https://reacttraining.com/reach-ui/alert-dialog#alertdialogdescription
* @see Docs https://reach.tech/alert-dialog#alertdialogdescription
* @param props

@@ -193,3 +193,3 @@ */

*
* @see Docs https://reacttraining.com/reach-ui/alert-dialog#alertdialog
* @see Docs https://reach.tech/alert-dialog#alertdialog
* @param props

@@ -196,0 +196,0 @@ */

36

dist/index.d.ts

@@ -28,3 +28,3 @@ /**

*
* @see Docs https://reacttraining.com/reach-ui/alert-dialog
* @see Docs https://reach.tech/alert-dialog
* @see Source https://github.com/reach/reach-ui/tree/main/packages/alert-dialog

@@ -44,3 +44,3 @@ * @see WAI-ARIA https://www.w3.org/TR/wai-aria-practices-1.2/#alertdialog

*
* @see Docs https://reacttraining.com/reach-ui/alert-dialog#alertdialogoverlay
* @see Docs https://reach.tech/alert-dialog#alertdialogoverlay
*/

@@ -51,3 +51,3 @@ export declare const AlertDialogOverlay: React.ForwardRefExoticComponent<{

*
* @see Docs: https://reacttraining.com/reach-ui/alert-dialog#alertdialog-isopen
* @see Docs: https://reach.tech/alert-dialog#alertdialog-isopen
*/

@@ -60,3 +60,3 @@ isOpen?: boolean | undefined;

*
* @see Docs: https://reacttraining.com/reach-ui/alert-dialog#alertdialog-ondismiss
* @see Docs: https://reach.tech/alert-dialog#alertdialog-ondismiss
*/

@@ -68,3 +68,3 @@ onDismiss?: ((event?: React.SyntheticEvent<Element, Event> | undefined) => void) | undefined;

*
* @see Docs: https://reacttraining.com/reach-ui/alert-dialog#alertdialog-leastdestructiveref
* @see Docs: https://reach.tech/alert-dialog#alertdialog-leastdestructiveref
*/

@@ -77,3 +77,3 @@ leastDestructiveRef?: React.RefObject<HTMLElement> | undefined;

*
* @see Docs: https://reacttraining.com/reach-ui/alert-dialog#alertdialog-children
* @see Docs: https://reach.tech/alert-dialog#alertdialog-children
*/

@@ -101,3 +101,3 @@ children: React.ReactNode;

*
* @see Docs https://reacttraining.com/reach-ui/alert-dialog#alertdialogcontent
* @see Docs https://reach.tech/alert-dialog#alertdialogcontent
*/

@@ -110,3 +110,3 @@ export declare const AlertDialogContent: React.ForwardRefExoticComponent<{

*
* @see Docs https://reacttraining.com/reach-ui/alert-dialog#alertdialogcontent-children
* @see Docs https://reach.tech/alert-dialog#alertdialogcontent-children
*/

@@ -118,3 +118,3 @@ children: React.ReactNode;

/**
* @see Docs https://reacttraining.com/reach-ui/alert-dialog#alertdialogcontent-props
* @see Docs https://reach.tech/alert-dialog#alertdialogcontent-props
*/

@@ -127,3 +127,3 @@ export declare type AlertDialogContentProps = {

*
* @see Docs https://reacttraining.com/reach-ui/alert-dialog#alertdialogcontent-children
* @see Docs https://reach.tech/alert-dialog#alertdialogcontent-children
*/

@@ -141,3 +141,3 @@ children: React.ReactNode;

*
* @see Docs https://reacttraining.com/reach-ui/alert-dialog#alertdialoglabel
* @see Docs https://reach.tech/alert-dialog#alertdialoglabel
*/

@@ -152,3 +152,3 @@ export declare const AlertDialogLabel: React.FC<React.HTMLAttributes<HTMLDivElement>>;

*
* @see Docs https://reacttraining.com/reach-ui/alert-dialog#alertdialogdescription
* @see Docs https://reach.tech/alert-dialog#alertdialogdescription
* @param props

@@ -162,3 +162,3 @@ */

*
* @see Docs https://reacttraining.com/reach-ui/alert-dialog#alertdialog
* @see Docs https://reach.tech/alert-dialog#alertdialog
* @param props

@@ -168,3 +168,3 @@ */

/**
* @see Docs https://reacttraining.com/reach-ui/alert-dialog#alertdialog-props
* @see Docs https://reach.tech/alert-dialog#alertdialog-props
*/

@@ -175,3 +175,3 @@ export declare type AlertDialogProps = {

*
* @see Docs: https://reacttraining.com/reach-ui/alert-dialog#alertdialog-isopen
* @see Docs: https://reach.tech/alert-dialog#alertdialog-isopen
*/

@@ -184,3 +184,3 @@ isOpen?: boolean;

*
* @see Docs: https://reacttraining.com/reach-ui/alert-dialog#alertdialog-ondismiss
* @see Docs: https://reach.tech/alert-dialog#alertdialog-ondismiss
*/

@@ -192,3 +192,3 @@ onDismiss?: (event?: React.SyntheticEvent) => void;

*
* @see Docs: https://reacttraining.com/reach-ui/alert-dialog#alertdialog-leastdestructiveref
* @see Docs: https://reach.tech/alert-dialog#alertdialog-leastdestructiveref
*/

@@ -201,5 +201,5 @@ leastDestructiveRef?: React.RefObject<HTMLElement>;

*
* @see Docs: https://reacttraining.com/reach-ui/alert-dialog#alertdialog-children
* @see Docs: https://reach.tech/alert-dialog#alertdialog-children
*/
children: React.ReactNode;
} & DialogProps;

12

package.json
{
"name": "@reach/alert-dialog",
"version": "0.10.5",
"version": "0.11.0",
"description": "Accessible React Alert Dialog.",

@@ -13,8 +13,8 @@ "author": "React Training <hello@reacttraining.com>",

"scripts": {
"build": "ts-node ../../scripts/build"
"build": "ts-node --transpile-only ../../scripts/build-package $npm_package_name"
},
"dependencies": {
"@reach/auto-id": "0.10.5",
"@reach/dialog": "0.10.5",
"@reach/utils": "0.10.5",
"@reach/auto-id": "0.11.0",
"@reach/dialog": "0.11.0",
"@reach/utils": "0.11.0",
"invariant": "^2.2.4",

@@ -35,3 +35,3 @@ "prop-types": "^15.7.2",

],
"gitHead": "86a046f54d53b6420e392b3fa56dd991d9d4e458"
"gitHead": "7eaa66982cd17fb012c13c97e6a1770f75b6ce00"
}

4

README.md

@@ -5,3 +5,3 @@ # @reach/alert-dialog

[Docs](https://reacttraining.com/reach-ui/alert-dialog) | [Source](https://github.com/reach/reach-ui/tree/main/packages/alert-dialog) | [WAI-ARIA](https://www.w3.org/TR/wai-aria-practices-1.2/#alertdialog)
[Docs](https://reach.tech/alert-dialog) | [Source](https://github.com/reach/reach-ui/tree/main/packages/alert-dialog) | [WAI-ARIA](https://www.w3.org/TR/wai-aria-practices-1.2/#alertdialog)

@@ -16,3 +16,3 @@ A modal dialog that interrupts the user's workflow to get a response, usually some sort of confirmation. This is different than a typical Dialog in that it requires some user response, like "Save", or "Cancel", etc.

This is built on top of [@reach/dialog](https://reacttraining.com/reach-ui/dialog), so `AlertDialog` spreads its props and renders a `Dialog`, same for `AlertDialogOverlay` to `DialogOverlay`, and `AlertDialogContent` to `DialogContent`.
This is built on top of [@reach/dialog](https://reach.tech/dialog), so `AlertDialog` spreads its props and renders a `Dialog`, same for `AlertDialogOverlay` to `DialogOverlay`, and `AlertDialogContent` to `DialogContent`.

@@ -19,0 +19,0 @@ ```jsx

dist/alert-dialog.cjs.development.js.map

Sorry, the diff of this file is not supported yet

dist/alert-dialog.cjs.production.min.js.map

Sorry, the diff of this file is not supported yet

dist/alert-dialog.esm.js.map

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

About

Packages

npm

Go

Maven

PyPI

Rubygems

Stay in touch

Get open source security insights delivered straight into your inbox.

  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc