@instructure/ui-buttons 10.16.1-snapshot-0 → 10.16.1

package/lib/ToggleButton/__new-tests__/ToggleButton.test.js

@@ -1,12 +1,12 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-var _react = _interopRequireDefault(require("react"));
-var _react2 = require("@testing-library/react");
+var _react = require("@testing-library/react");
 var _vitest = require("vitest");
 var _userEvent = _interopRequireDefault(require("@testing-library/user-event"));
 require("@testing-library/jest-dom");
 var _index = require("../index");
+var _jsxRuntime = require("@emotion/react/jsx-runtime");
 var _svg;
 /*
  * The MIT License (MIT)
@@ -33,26 +33,27 @@ var _svg;
  */
 describe('<ToggleButton />', () => {
   var _ToggleButton, _ToggleButton2, _ToggleButton3, _ToggleButton4, _ToggleButton5, _ToggleButton6, _ToggleButton7, _ToggleButton8, _ToggleButton9;
-  const icon = _svg || (_svg = /*#__PURE__*/_react.default.createElement("svg", {
+  const icon = _svg || (_svg = (0, _jsxRuntime.jsx)("svg", {
     "data-title": "myIcon",
     height: "1em",
-    width: "1em"
-  }, /*#__PURE__*/_react.default.createElement("circle", {
-    cx: "0.5em",
-    cy: "0.5em",
-    r: "0.5em"
-  })));
+    width: "1em",
+    children: (0, _jsxRuntime.jsx)("circle", {
+      cx: "0.5em",
+      cy: "0.5em",
+      r: "0.5em"
+    })
+  }));
   const iconSelector = 'svg[data-title="myIcon"]';
   it('should render', () => {
-    (0, _react2.render)(_ToggleButton || (_ToggleButton = /*#__PURE__*/_react.default.createElement(_index.ToggleButton, {
+    (0, _react.render)(_ToggleButton || (_ToggleButton = (0, _jsxRuntime.jsx)(_index.ToggleButton, {
       screenReaderLabel: "This is a screen reader label",
       renderIcon: icon,
       renderTooltipContent: "This is tooltip content",
       status: "pressed"
     })));
-    const button = _react2.screen.getByRole('button');
+    const button = _react.screen.getByRole('button');
     const svgIcon = document.querySelector(iconSelector);
-    const tooltip = _react2.screen.getByRole('tooltip');
+    const tooltip = _react.screen.getByRole('tooltip');
     expect(button).toBeInTheDocument();
     expect(button).toHaveTextContent('This is a screen reader label');
     expect(svgIcon).toBeInTheDocument();
@@ -60,39 +61,39 @@ describe('<ToggleButton />', () => {
     expect(tooltip).toHaveTextContent('This is tooltip content');
   });
   it('should set `aria-pressed` to `true` if `status` is `pressed`', () => {
-    (0, _react2.render)(_ToggleButton2 || (_ToggleButton2 = /*#__PURE__*/_react.default.createElement(_index.ToggleButton, {
+    (0, _react.render)(_ToggleButton2 || (_ToggleButton2 = (0, _jsxRuntime.jsx)(_index.ToggleButton, {
       screenReaderLabel: "This is a screen reader label",
       renderIcon: icon,
       renderTooltipContent: "This is tooltip content",
       status: "pressed"
     })));
-    const button = _react2.screen.getByRole('button');
+    const button = _react.screen.getByRole('button');
     expect(button).toHaveAttribute('aria-pressed', 'true');
   });
   it('should set `aria-pressed` to `false` if `status` is `unpressed`', () => {
-    (0, _react2.render)(_ToggleButton3 || (_ToggleButton3 = /*#__PURE__*/_react.default.createElement(_index.ToggleButton, {
+    (0, _react.render)(_ToggleButton3 || (_ToggleButton3 = (0, _jsxRuntime.jsx)(_index.ToggleButton, {
       screenReaderLabel: "This is a screen reader label",
       renderIcon: icon,
       renderTooltipContent: "This is tooltip content",
       status: "unpressed"
     })));
-    const button = _react2.screen.getByRole('button');
+    const button = _react.screen.getByRole('button');
     expect(button).toHaveAttribute('aria-pressed', 'false');
   });
   it('should render an icon', () => {
-    (0, _react2.render)(_ToggleButton4 || (_ToggleButton4 = /*#__PURE__*/_react.default.createElement(_index.ToggleButton, {
+    (0, _react.render)(_ToggleButton4 || (_ToggleButton4 = (0, _jsxRuntime.jsx)(_index.ToggleButton, {
       screenReaderLabel: "This is a screen reader label",
       renderIcon: icon,
       renderTooltipContent: "This is tooltip content",
       status: "pressed"
     })));
-    const button = _react2.screen.getByRole('button');
+    const button = _react.screen.getByRole('button');
     const svgIcon = document.querySelector(iconSelector);
     expect(button).toBeInTheDocument();
     expect(svgIcon).toBeInTheDocument();
   });
   it('should pass the `as` prop', () => {
-    const _render = (0, _react2.render)(_ToggleButton5 || (_ToggleButton5 = /*#__PURE__*/_react.default.createElement(_index.ToggleButton, {
+    const _render = (0, _react.render)(_ToggleButton5 || (_ToggleButton5 = (0, _jsxRuntime.jsx)(_index.ToggleButton, {
         screenReaderLabel: "This is a screen reader label",
         renderIcon: icon,
         renderTooltipContent: "This is tooltip content",
@@ -105,61 +106,61 @@ describe('<ToggleButton />', () => {
     expect(button.tagName).toBe('LI');
   });
   it('should set the disabled attribute when `interaction` prop is set to disabled', () => {
-    (0, _react2.render)(_ToggleButton6 || (_ToggleButton6 = /*#__PURE__*/_react.default.createElement(_index.ToggleButton, {
+    (0, _react.render)(_ToggleButton6 || (_ToggleButton6 = (0, _jsxRuntime.jsx)(_index.ToggleButton, {
       screenReaderLabel: "This is a screen reader label",
       renderIcon: icon,
       renderTooltipContent: "This is tooltip content",
       interaction: "disabled",
       status: "pressed"
     })));
-    const button = _react2.screen.getByRole('button');
+    const button = _react.screen.getByRole('button');
     expect(button).toHaveAttribute('disabled');
   });
   it('should set the disabled attribute when `disabled` prop is set', () => {
-    (0, _react2.render)(_ToggleButton7 || (_ToggleButton7 = /*#__PURE__*/_react.default.createElement(_index.ToggleButton, {
+    (0, _react.render)(_ToggleButton7 || (_ToggleButton7 = (0, _jsxRuntime.jsx)(_index.ToggleButton, {
       screenReaderLabel: "This is a screen reader label",
       renderIcon: icon,
       renderTooltipContent: "This is tooltip content",
       disabled: true,
       status: "pressed"
     })));
-    const button = _react2.screen.getByRole('button');
+    const button = _react.screen.getByRole('button');
     expect(button).toHaveAttribute('disabled');
   });
   it('should set the disabled attribute when `interaction` prop is set to readonly', () => {
-    (0, _react2.render)(_ToggleButton8 || (_ToggleButton8 = /*#__PURE__*/_react.default.createElement(_index.ToggleButton, {
+    (0, _react.render)(_ToggleButton8 || (_ToggleButton8 = (0, _jsxRuntime.jsx)(_index.ToggleButton, {
       screenReaderLabel: "This is a screen reader label",
       renderIcon: icon,
       renderTooltipContent: "This is tooltip content",
       interaction: "readonly",
       status: "pressed"
     })));
-    const button = _react2.screen.getByRole('button');
+    const button = _react.screen.getByRole('button');
     expect(button).toHaveAttribute('disabled');
   });
   it('should set the disabled attribute when `readOnly` prop is set', () => {
-    (0, _react2.render)(_ToggleButton9 || (_ToggleButton9 = /*#__PURE__*/_react.default.createElement(_index.ToggleButton, {
+    (0, _react.render)(_ToggleButton9 || (_ToggleButton9 = (0, _jsxRuntime.jsx)(_index.ToggleButton, {
       screenReaderLabel: "This is a screen reader label",
       renderIcon: icon,
       renderTooltipContent: "This is tooltip content",
       readOnly: true,
       status: "pressed"
     })));
-    const button = _react2.screen.getByRole('button');
+    const button = _react.screen.getByRole('button');
     expect(button).toHaveAttribute('disabled');
   });
   it('should pass the `onClick` prop', async () => {
     const onClick = _vitest.vi.fn();
-    (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_index.ToggleButton, {
+    (0, _react.render)((0, _jsxRuntime.jsx)(_index.ToggleButton, {
       screenReaderLabel: "This is a screen reader label",
       renderIcon: icon,
       renderTooltipContent: "This is tooltip content",
       onClick: onClick,
       status: "pressed"
     }));
-    const button = _react2.screen.getByRole('button');
+    const button = _react.screen.getByRole('button');
     await _userEvent.default.click(button);
-    await (0, _react2.waitFor)(() => {
+    await (0, _react.waitFor)(() => {
       expect(onClick).toHaveBeenCalledTimes(1);
     });
   });

package/lib/ToggleButton/index.js

@@ -1,19 +1,19 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = exports.ToggleButton = void 0;
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
-var _react = _interopRequireWildcard(require("react"));
+var _react = require("react");
 var _testable = require("@instructure/ui-testable/lib/testable.js");
 var _callRenderProp = require("@instructure/ui-react-utils/lib/callRenderProp.js");
 var _passthroughProps = require("@instructure/ui-react-utils/lib/passthroughProps.js");
 var _Tooltip = require("@instructure/ui-tooltip/lib/Tooltip");
 var _IconButton = require("../IconButton");
 var _props = require("./props");
+var _jsxRuntime = require("@emotion/react/jsx-runtime");
 const _excluded = ["as", "color", "elementRef", "size", "interaction", "mountNode", "renderIcon", "renderTooltipContent", "screenReaderLabel", "status", "placement", "onClick"];
 var _dec, _class, _ToggleButton;
 /*
@@ -76,7 +76,7 @@ let ToggleButton = exports.ToggleButton = (_dec = (0, _testable.testable)(), _de
       placement = _this$props.placement,
       onClick = _this$props.onClick,
       props = (0, _objectWithoutProperties2.default)(_this$props, _excluded);
-    return /*#__PURE__*/_react.default.createElement(_Tooltip.Tooltip, {
+    return (0, _jsxRuntime.jsx)(_Tooltip.Tooltip, {
       renderTip: renderTooltipContent,
       on: ['hover', 'focus'],
       placement: placement,
@@ -93,19 +93,22 @@ let ToggleButton = exports.ToggleButton = (_dec = (0, _testable.testable)(), _de
         });
       },
       mountNode: mountNode,
-      elementRef: el => this.ref = el
-    }, /*#__PURE__*/_react.default.createElement(_IconButton.IconButton, Object.assign({}, (0, _passthroughProps.passthroughProps)(props), {
-      screenReaderLabel: screenReaderLabel,
-      withBackground: false,
-      withBorder: false,
-      color: color,
-      size: size,
-      elementRef: this.handleRef,
-      as: as,
-      onClick: onClick,
-      interaction: interaction,
-      "aria-pressed": status === 'pressed'
-    }), (0, _callRenderProp.callRenderProp)(renderIcon)));
+      elementRef: el => this.ref = el,
+      children: (0, _jsxRuntime.jsx)(_IconButton.IconButton, {
+        ...(0, _passthroughProps.passthroughProps)(props),
+        screenReaderLabel: screenReaderLabel,
+        withBackground: false,
+        withBorder: false,
+        color: color,
+        size: size,
+        elementRef: this.handleRef,
+        as: as,
+        onClick: onClick,
+        interaction: interaction,
+        "aria-pressed": status === 'pressed',
+        children: (0, _callRenderProp.callRenderProp)(renderIcon)
+      })
+    });
   }
 }, _ToggleButton.displayName = "ToggleButton", _ToggleButton.componentId = 'ToggleButton', _ToggleButton.propTypes = _props.propTypes, _ToggleButton.allowedProps = _props.allowedProps, _ToggleButton.defaultProps = {
   size: 'medium',

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@instructure/ui-buttons",
-  "version": "10.16.1-snapshot-0",
+  "version": "10.16.1",
   "description": "Accessible button components",
   "author": "Instructure, Inc. Engineering and Product Design",
   "module": "./es/index.js",
@@ -23,10 +23,10 @@
   },
   "license": "MIT",
   "devDependencies": {
-    "@instructure/ui-axe-check": "10.16.1-snapshot-0",
-    "@instructure/ui-babel-preset": "10.16.1-snapshot-0",
-    "@instructure/ui-test-utils": "10.16.1-snapshot-0",
-    "@instructure/ui-themes": "10.16.1-snapshot-0",
+    "@instructure/ui-axe-check": "10.16.1",
+    "@instructure/ui-babel-preset": "10.16.1",
+    "@instructure/ui-test-utils": "10.16.1",
+    "@instructure/ui-themes": "10.16.1",
     "@testing-library/jest-dom": "^6.6.3",
     "@testing-library/react": "^16.0.1",
     "@testing-library/user-event": "^14.5.2",
@@ -34,21 +34,21 @@
   },
   "dependencies": {
     "@babel/runtime": "^7.26.0",
-    "@instructure/console": "10.16.1-snapshot-0",
-    "@instructure/emotion": "10.16.1-snapshot-0",
-    "@instructure/shared-types": "10.16.1-snapshot-0",
-    "@instructure/ui-a11y-content": "10.16.1-snapshot-0",
-    "@instructure/ui-a11y-utils": "10.16.1-snapshot-0",
-    "@instructure/ui-color-utils": "10.16.1-snapshot-0",
-    "@instructure/ui-dom-utils": "10.16.1-snapshot-0",
-    "@instructure/ui-icons": "10.16.1-snapshot-0",
-    "@instructure/ui-position": "10.16.1-snapshot-0",
-    "@instructure/ui-prop-types": "10.16.1-snapshot-0",
-    "@instructure/ui-react-utils": "10.16.1-snapshot-0",
-    "@instructure/ui-testable": "10.16.1-snapshot-0",
-    "@instructure/ui-tooltip": "10.16.1-snapshot-0",
-    "@instructure/ui-utils": "10.16.1-snapshot-0",
-    "@instructure/ui-view": "10.16.1-snapshot-0",
+    "@instructure/console": "10.16.1",
+    "@instructure/emotion": "10.16.1",
+    "@instructure/shared-types": "10.16.1",
+    "@instructure/ui-a11y-content": "10.16.1",
+    "@instructure/ui-a11y-utils": "10.16.1",
+    "@instructure/ui-color-utils": "10.16.1",
+    "@instructure/ui-dom-utils": "10.16.1",
+    "@instructure/ui-icons": "10.16.1",
+    "@instructure/ui-position": "10.16.1",
+    "@instructure/ui-prop-types": "10.16.1",
+    "@instructure/ui-react-utils": "10.16.1",
+    "@instructure/ui-testable": "10.16.1",
+    "@instructure/ui-tooltip": "10.16.1",
+    "@instructure/ui-utils": "10.16.1",
+    "@instructure/ui-view": "10.16.1",
     "keycode": "^2",
     "prop-types": "^15.8.1"
   },

package/src/BaseButton/__new-tests__/BaseButton.test.tsx

@@ -22,7 +22,6 @@
  * SOFTWARE.
  */
 
-import React from 'react'
 import { render, screen, waitFor } from '@testing-library/react'
 import { vi } from 'vitest'
 import type { MockInstance } from 'vitest'

package/src/BaseButton/index.tsx

@@ -22,8 +22,7 @@
  * SOFTWARE.
  */
 
-/** @jsx jsx */
-import React, { Component } from 'react'
+import { Component } from 'react'
 import keycode from 'keycode'
 
 import { testable } from '@instructure/ui-testable'
@@ -38,7 +37,7 @@ import { hasVisibleChildren } from '@instructure/ui-a11y-utils'
 import { View } from '@instructure/ui-view'
 import type { ViewProps } from '@instructure/ui-view'
 
-import { withStyle, jsx } from '@instructure/emotion'
+import { withStyle } from '@instructure/emotion'
 
 import generateStyles from './styles'
 import generateComponentTheme from './theme'

package/src/Button/__new-tests__/Button.test.tsx

@@ -22,7 +22,6 @@
  * SOFTWARE.
  */
 
-import React from 'react'
 import { render, screen, waitFor } from '@testing-library/react'
 import { vi } from 'vitest'
 import userEvent from '@testing-library/user-event'

package/src/Button/index.tsx

@@ -22,7 +22,7 @@
  * SOFTWARE.
  */
 
-import React, { Component } from 'react'
+import { Component } from 'react'
 
 import { testable } from '@instructure/ui-testable'
 import { getInteraction, passthroughProps } from '@instructure/ui-react-utils'

package/src/CloseButton/__new-tests__/CloseButton.test.tsx

@@ -22,7 +22,6 @@
  * SOFTWARE.
  */
 
-import React from 'react'
 import { render, screen, waitFor } from '@testing-library/react'
 import { vi } from 'vitest'
 import userEvent from '@testing-library/user-event'

package/src/CloseButton/index.tsx

@@ -22,7 +22,6 @@
  * SOFTWARE.
  */
 
-/** @jsx jsx */
 import { Component } from 'react'
 
 import { IconXSolid } from '@instructure/ui-icons'
@@ -30,7 +29,7 @@ import { ScreenReaderContent } from '@instructure/ui-a11y-content'
 import { testable } from '@instructure/ui-testable'
 import { getInteraction, passthroughProps } from '@instructure/ui-react-utils'
 
-import { withStyle, jsx } from '@instructure/emotion'
+import { withStyle } from '@instructure/emotion'
 
 import generateStyle from './styles'
 import generateComponentTheme from './theme'

package/src/CondensedButton/__new-tests__/CondensedButton.test.tsx

@@ -22,7 +22,6 @@
  * SOFTWARE.
  */
 
-import React from 'react'
 import { render, screen, waitFor } from '@testing-library/react'
 import { vi } from 'vitest'
 import userEvent from '@testing-library/user-event'

package/src/CondensedButton/index.tsx

@@ -22,7 +22,7 @@
  * SOFTWARE.
  */
 
-import React, { Component } from 'react'
+import { Component } from 'react'
 
 import { testable } from '@instructure/ui-testable'
 import { passthroughProps } from '@instructure/ui-react-utils'

package/src/IconButton/__new-tests__/IconButton.test.tsx

@@ -22,7 +22,6 @@
  * SOFTWARE.
  */
 
-import React from 'react'
 import { render, screen, waitFor } from '@testing-library/react'
 import { vi } from 'vitest'
 import userEvent from '@testing-library/user-event'

package/src/IconButton/index.tsx

@@ -22,7 +22,7 @@
  * SOFTWARE.
  */
 
-import React, { Component } from 'react'
+import { Component } from 'react'
 
 import { testable } from '@instructure/ui-testable'
 import { passthroughProps } from '@instructure/ui-react-utils'

package/src/IconButton/props.ts

@@ -22,7 +22,7 @@
  * SOFTWARE.
  */
 
-import React, { ReactNode } from 'react'
+import { ReactNode } from 'react'
 import PropTypes from 'prop-types'
 
 import type { Spacing, WithStyleProps } from '@instructure/emotion'

package/src/ToggleButton/__new-tests__/ToggleButton.test.tsx

@@ -22,7 +22,6 @@
  * SOFTWARE.
  */
 
-import React from 'react'
 import { render, screen, waitFor } from '@testing-library/react'
 import { vi } from 'vitest'
 import userEvent from '@testing-library/user-event'

package/src/ToggleButton/index.tsx

@@ -22,7 +22,7 @@
  * SOFTWARE.
  */
 
-import React, { Component } from 'react'
+import { Component } from 'react'
 
 import { testable } from '@instructure/ui-testable'