@instructure/ui-alerts 8.16.1-snapshot.2 → 8.17.1-snapshot.14

package/CHANGELOG.md

@@ -3,6 +3,12 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [8.17.0](https://github.com/instructure/instructure-ui/compare/v8.16.0...v8.17.0) (2022-02-07)
+
+### Bug Fixes
+
+- remove type:"commonjs" from package.json files ([0b243be](https://github.com/instructure/instructure-ui/commit/0b243bee389ee14493e6b3dbb30a8b660c295d3d))
+
 # [8.16.0](https://github.com/instructure/instructure-ui/compare/v8.15.0...v8.16.0) (2022-02-03)
 
 **Note:** Version bump only for package @instructure/ui-alerts

package/es/Alert/index.js

@@ -1,4 +1,4 @@
-var _dec, _class, _class2, _temp;
+var _dec, _dec2, _class, _class2, _temp;
 
 /*
  * The MIT License (MIT)
@@ -28,14 +28,13 @@ var _dec, _class, _class2, _temp;
 import React, { Component } from 'react';
 import ReactDOM from 'react-dom';
 import keycode from 'keycode';
-import { callRenderProp } from '@instructure/ui-react-utils';
+import { callRenderProp, withDeterministicId } from '@instructure/ui-react-utils';
 import { CloseButton } from '@instructure/ui-buttons';
 import { View } from '@instructure/ui-view';
 import { ScreenReaderContent } from '@instructure/ui-a11y-content';
 import { IconCheckMarkSolid, IconInfoBorderlessSolid, IconWarningBorderlessSolid, IconNoSolid } from '@instructure/ui-icons';
 import { Transition } from '@instructure/ui-motion';
 import { logError as error } from '@instructure/console';
-import { uid } from '@instructure/uid';
 import { canvas } from '@instructure/ui-themes';
 import { withStyle, jsx, InstUISettingsProvider } from '@instructure/emotion';
 import generateStyle from './styles';
@@ -48,7 +47,7 @@ category: components
 ---
 @tsProps
 **/
-let Alert = (_dec = withStyle(generateStyle, generateComponentTheme), _dec(_class = (_temp = _class2 = class Alert extends Component {
+let Alert = (_dec = withDeterministicId(), _dec2 = withStyle(generateStyle, generateComponentTheme), _dec(_class = _dec2(_class = (_temp = _class2 = class Alert extends Component {
   constructor(props) {
     super(props);
     this._timeouts = [];
@@ -141,7 +140,7 @@ let Alert = (_dec = withStyle(generateStyle, generateComponentTheme), _dec(_clas
     const liveRegion = this.getLiveRegion();
 
     if (liveRegion) {
-      this.srid = uid('Alert');
+      this.srid = this.props.deterministicId();
       const div = document.createElement('div');
       div.setAttribute('id', this.srid);
       this.renderScreenreeaderAlert(div);
@@ -297,6 +296,6 @@ let Alert = (_dec = withStyle(generateStyle, generateComponentTheme), _dec(_clas
   isLiveRegionAtomic: false,
   children: null,
   hasShadow: true
-}, _temp)) || _class);
+}, _temp)) || _class) || _class);
 export default Alert;
 export { Alert };

package/lib/Alert/index.js

@@ -17,6 +17,8 @@ var _keycode = _interopRequireDefault(require("keycode"));
 
 var _callRenderProp = require("@instructure/ui-react-utils/lib/callRenderProp.js");
 
+var _withDeterministicId = require("@instructure/ui-react-utils/lib/DeterministicIdContext/withDeterministicId.js");
+
 var _CloseButton = require("@instructure/ui-buttons/lib/CloseButton");
 
 var _View = require("@instructure/ui-view/lib/View");
@@ -35,8 +37,6 @@ var _Transition = require("@instructure/ui-motion/lib/Transition");
 
 var _console = require("@instructure/console");
 
-var _uid = require("@instructure/uid");
-
 var _uiThemes = require("@instructure/ui-themes");
 
 var _emotion = require("@instructure/emotion");
@@ -47,7 +47,7 @@ var _theme = _interopRequireDefault(require("./theme"));
 
 var _props = require("./props");
 
-var _dec, _class, _class2, _temp;
+var _dec, _dec2, _class, _class2, _temp;
 
 /**
 ---
@@ -55,7 +55,7 @@ category: components
 ---
 @tsProps
 **/
-let Alert = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default), _dec(_class = (_temp = _class2 = class Alert extends _react.Component {
+let Alert = (_dec = (0, _withDeterministicId.withDeterministicId)(), _dec2 = (0, _emotion.withStyle)(_styles.default, _theme.default), _dec(_class = _dec2(_class = (_temp = _class2 = class Alert extends _react.Component {
   constructor(props) {
     super(props);
     this._timeouts = [];
@@ -148,7 +148,7 @@ let Alert = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default), _d
     const liveRegion = this.getLiveRegion();
 
     if (liveRegion) {
-      this.srid = (0, _uid.uid)('Alert');
+      this.srid = this.props.deterministicId();
       const div = document.createElement('div');
       div.setAttribute('id', this.srid);
       this.renderScreenreeaderAlert(div);
@@ -307,7 +307,7 @@ let Alert = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default), _d
   isLiveRegionAtomic: false,
   children: null,
   hasShadow: true
-}, _temp)) || _class);
+}, _temp)) || _class) || _class);
 exports.Alert = Alert;
 var _default = Alert;
 exports.default = _default;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@instructure/ui-alerts",
-  "version": "8.16.1-snapshot.2+25359e770",
+  "version": "8.17.1-snapshot.14+f0b03679c",
   "description": "An alert component",
   "author": "Instructure, Inc. Engineering and Product Design",
   "module": "./es/index.js",
@@ -23,24 +23,24 @@
   },
   "license": "MIT",
   "devDependencies": {
-    "@instructure/ui-babel-preset": "8.16.1-snapshot.2+25359e770",
-    "@instructure/ui-color-utils": "8.16.1-snapshot.2+25359e770",
-    "@instructure/ui-test-utils": "8.16.1-snapshot.2+25359e770"
+    "@instructure/ui-babel-preset": "8.17.1-snapshot.14+f0b03679c",
+    "@instructure/ui-color-utils": "8.17.1-snapshot.14+f0b03679c",
+    "@instructure/ui-test-utils": "8.17.1-snapshot.14+f0b03679c"
   },
   "dependencies": {
     "@babel/runtime": "^7.13.10",
-    "@instructure/console": "8.16.1-snapshot.2+25359e770",
-    "@instructure/emotion": "8.16.1-snapshot.2+25359e770",
-    "@instructure/shared-types": "8.16.1-snapshot.2+25359e770",
-    "@instructure/ui-a11y-content": "8.16.1-snapshot.2+25359e770",
-    "@instructure/ui-buttons": "8.16.1-snapshot.2+25359e770",
-    "@instructure/ui-icons": "8.16.1-snapshot.2+25359e770",
-    "@instructure/ui-motion": "8.16.1-snapshot.2+25359e770",
-    "@instructure/ui-react-utils": "8.16.1-snapshot.2+25359e770",
-    "@instructure/ui-themes": "8.16.1-snapshot.2+25359e770",
-    "@instructure/ui-utils": "8.16.1-snapshot.2+25359e770",
-    "@instructure/ui-view": "8.16.1-snapshot.2+25359e770",
-    "@instructure/uid": "8.16.1-snapshot.2+25359e770",
+    "@instructure/console": "8.17.1-snapshot.14+f0b03679c",
+    "@instructure/emotion": "8.17.1-snapshot.14+f0b03679c",
+    "@instructure/shared-types": "8.17.1-snapshot.14+f0b03679c",
+    "@instructure/ui-a11y-content": "8.17.1-snapshot.14+f0b03679c",
+    "@instructure/ui-buttons": "8.17.1-snapshot.14+f0b03679c",
+    "@instructure/ui-icons": "8.17.1-snapshot.14+f0b03679c",
+    "@instructure/ui-motion": "8.17.1-snapshot.14+f0b03679c",
+    "@instructure/ui-react-utils": "8.17.1-snapshot.14+f0b03679c",
+    "@instructure/ui-themes": "8.17.1-snapshot.14+f0b03679c",
+    "@instructure/ui-utils": "8.17.1-snapshot.14+f0b03679c",
+    "@instructure/ui-view": "8.17.1-snapshot.14+f0b03679c",
+    "@instructure/uid": "8.17.1-snapshot.14+f0b03679c",
     "keycode": "^2",
     "prop-types": "^15"
   },
@@ -52,5 +52,5 @@
     "access": "public"
   },
   "sideEffects": false,
-  "gitHead": "25359e77043270cf26e92b14f396b498f1540c62"
+  "gitHead": "f0b03679c4c4d05d4d650d22646ac1dc6791e935"
 }

package/src/Alert/index.tsx

@@ -26,7 +26,10 @@ import React, { Component } from 'react'
 import ReactDOM from 'react-dom'
 import keycode from 'keycode'
 
-import { callRenderProp } from '@instructure/ui-react-utils'
+import {
+  callRenderProp,
+  withDeterministicId
+} from '@instructure/ui-react-utils'
 import { CloseButton } from '@instructure/ui-buttons'
 import { View } from '@instructure/ui-view'
 import type { ViewOwnProps } from '@instructure/ui-view'
@@ -39,7 +42,6 @@ import {
 } from '@instructure/ui-icons'
 import { Transition } from '@instructure/ui-motion'
 import { logError as error } from '@instructure/console'
-import { uid } from '@instructure/uid'
 import { canvas } from '@instructure/ui-themes'
 import { withStyle, jsx, InstUISettingsProvider } from '@instructure/emotion'
 
@@ -55,6 +57,7 @@ category: components
 ---
 @tsProps
 **/
+@withDeterministicId()
 @withStyle(generateStyle, generateComponentTheme)
 class Alert extends Component<AlertProps, AlertState> {
   static readonly componentId = 'Alert'
@@ -166,7 +169,7 @@ class Alert extends Component<AlertProps, AlertState> {
   createScreenreaderAlert() {
     const liveRegion = this.getLiveRegion()
     if (liveRegion) {
-      this.srid = uid('Alert')
+      this.srid = this.props.deterministicId!()
 
       const div = document.createElement('div')
       div.setAttribute('id', this.srid)

package/src/Alert/props.ts

@@ -33,6 +33,7 @@ import type {
   ComponentStyle
 } from '@instructure/emotion'
 import type { AlertTheme, PropValidators } from '@instructure/shared-types'
+import type { WithDeterministicIdProps } from '@instructure/ui-react-utils'
 
 type AlertOwnProps = {
   /**
@@ -96,7 +97,7 @@ type PropKeys = keyof AlertOwnProps
 
 type AllowedPropKeys = Readonly<Array<PropKeys>>
 
-type AlertProps = AlertOwnProps & WithStyleProps<AlertTheme, AlertStyle>
+type AlertProps = AlertOwnProps & WithStyleProps<AlertTheme, AlertStyle> & WithDeterministicIdProps
 
 type AlertStyle = ComponentStyle<'alert' | 'icon' | 'closeButton' | 'content'>