@instructure/ui-buttons 8.56.0 → 9.0.1-snapshot-0

package/CHANGELOG.md

@@ -3,6 +3,30 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [9.0.1-snapshot-0](https://github.com/instructure/instructure-ui/compare/v9.0.0...v9.0.1-snapshot-0) (2024-05-09)
+
+**Note:** Version bump only for package @instructure/ui-buttons
+
+
+
+
+
+# [9.0.0](https://github.com/instructure/instructure-ui/compare/v8.56.0...v9.0.0) (2024-05-09)
+
+
+### Features
+
+* **ui-buttons,ui-text:** remove deprecated prop values ([f6b27d8](https://github.com/instructure/instructure-ui/commit/f6b27d84fe9dfbd2987dc5af7edefb093bcb4e1b))
+
+
+### BREAKING CHANGES
+
+* **ui-buttons,ui-text:** deprecated property values has been removed
+
+
+
+
+
 # [8.56.0](https://github.com/instructure/instructure-ui/compare/v8.55.1...v8.56.0) (2024-05-06)
 
 **Note:** Version bump only for package @instructure/ui-buttons

package/es/BaseButton/index.js

@@ -28,7 +28,6 @@ var _dec, _dec2, _class, _class2;
 /** @jsx jsx */
 import React, { Component } from 'react';
 import keycode from 'keycode';
-import { warn } from '@instructure/console';
 import { testable } from '@instructure/ui-testable';
 import { getElementType, getInteraction, passthroughProps, callRenderProp } from '@instructure/ui-react-utils';
 import { isActiveElement } from '@instructure/ui-dom-utils';
@@ -100,9 +99,6 @@ let BaseButton = (_dec = withStyle(generateStyles, generateComponentTheme), _dec
     var _this$props$makeStyle2, _this$props3;
     (_this$props$makeStyle2 = (_this$props3 = this.props).makeStyles) === null || _this$props$makeStyle2 === void 0 ? void 0 : _this$props$makeStyle2.call(_this$props3, this.makeStylesVariables);
   }
-  get _rootElement() {
-    return this.ref;
-  }
   get makeStylesVariables() {
     return {
       isDisabled: this.isDisabled,
@@ -132,16 +128,6 @@ let BaseButton = (_dec = withStyle(generateStyles, generateComponentTheme), _dec
   get isEnabled() {
     return this.interaction === 'enabled';
   }
-
-  // TODO: delete once the type of tabIndex is changed to number only
-  get tabIndex() {
-    const tabIndex = this.props.tabIndex;
-    if (typeof tabIndex === 'string') {
-      warn(false, 'The `string` value for `tabIndex` is deprecated. Only `number` type will be accepted from V9.0.0.');
-      return parseInt(tabIndex);
-    }
-    return tabIndex;
-  }
   get focusColor() {
     const _this$props5 = this.props,
       color = _this$props5.color,
@@ -222,7 +208,6 @@ let BaseButton = (_dec = withStyle(generateStyles, generateComponentTheme), _dec
     const isDisabled = this.isDisabled,
       isEnabled = this.isEnabled,
       isReadOnly = this.isReadOnly;
-    const tabIndexNumber = this.tabIndex;
     return jsx(View, Object.assign({}, passthroughProps(props), {
       as: this.elementType,
       focusColor: this.focusColor,
@@ -241,7 +226,7 @@ let BaseButton = (_dec = withStyle(generateStyles, generateComponentTheme), _dec
       onClick: this.handleClick,
       onKeyDown: this.handleKeyDown,
       role: onClick && as !== 'button' ? 'button' : void 0,
-      tabIndex: onClick && as ? tabIndexNumber || 0 : tabIndexNumber,
+      tabIndex: onClick && as ? tabIndex || 0 : tabIndex,
       disabled: isDisabled || isReadOnly,
       css: isEnabled ? styles === null || styles === void 0 ? void 0 : styles.baseButton : null
     }), jsx("span", {

package/es/BaseButton/props.js

@@ -45,9 +45,7 @@ const propTypes = {
   onClick: PropTypes.func,
   onKeyDown: PropTypes.func,
   renderIcon: PropTypes.oneOfType([PropTypes.node, PropTypes.func]),
-  // Deprecated `string` tabIndex type
-  // TODO: remove string type in v9
-  tabIndex: PropTypes.oneOfType([PropTypes.number, PropTypes.string])
+  tabIndex: PropTypes.number
 };
 const allowedProps = ['as', 'children', 'color', 'cursor', 'display', 'elementRef', 'focusColor', 'href', 'interaction', 'isCondensed', 'margin', 'onClick', 'onKeyDown', 'renderIcon', 'shape', 'size', 'tabIndex', 'textAlign', 'type', 'withBackground', 'withBorder'];
 export { propTypes, allowedProps };

package/es/CloseButton/props.js

@@ -38,9 +38,7 @@ const propTypes = {
   as: PropTypes.elementType,
   href: PropTypes.string,
   cursor: PropTypes.string,
-  // Deprecated `string` tabIndex type
-  // TODO: remove string type in v9
-  tabIndex: PropTypes.oneOfType([PropTypes.number, PropTypes.string])
+  tabIndex: PropTypes.number
 };
 const allowedProps = ['as', 'color', 'cursor', 'elementRef', 'href', 'interaction', 'margin', 'offset', 'onClick', 'placement', 'screenReaderLabel', 'size', 'tabIndex', 'type'];
 export { propTypes, allowedProps };

package/lib/BaseButton/index.js

@@ -9,7 +9,6 @@ exports.default = exports.BaseButton = void 0;
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var _react = _interopRequireWildcard(require("react"));
 var _keycode = _interopRequireDefault(require("keycode"));
-var _console = require("@instructure/console");
 var _testable = require("@instructure/ui-testable/lib/testable.js");
 var _getElementType = require("@instructure/ui-react-utils/lib/getElementType.js");
 var _getInteraction = require("@instructure/ui-react-utils/lib/getInteraction.js");
@@ -110,9 +109,6 @@ let BaseButton = exports.BaseButton = (_dec = (0, _emotion.withStyle)(_styles.de
     var _this$props$makeStyle2, _this$props3;
     (_this$props$makeStyle2 = (_this$props3 = this.props).makeStyles) === null || _this$props$makeStyle2 === void 0 ? void 0 : _this$props$makeStyle2.call(_this$props3, this.makeStylesVariables);
   }
-  get _rootElement() {
-    return this.ref;
-  }
   get makeStylesVariables() {
     return {
       isDisabled: this.isDisabled,
@@ -142,16 +138,6 @@ let BaseButton = exports.BaseButton = (_dec = (0, _emotion.withStyle)(_styles.de
   get isEnabled() {
     return this.interaction === 'enabled';
   }
-
-  // TODO: delete once the type of tabIndex is changed to number only
-  get tabIndex() {
-    const tabIndex = this.props.tabIndex;
-    if (typeof tabIndex === 'string') {
-      (0, _console.warn)(false, 'The `string` value for `tabIndex` is deprecated. Only `number` type will be accepted from V9.0.0.');
-      return parseInt(tabIndex);
-    }
-    return tabIndex;
-  }
   get focusColor() {
     const _this$props5 = this.props,
       color = _this$props5.color,
@@ -232,7 +218,6 @@ let BaseButton = exports.BaseButton = (_dec = (0, _emotion.withStyle)(_styles.de
     const isDisabled = this.isDisabled,
       isEnabled = this.isEnabled,
       isReadOnly = this.isReadOnly;
-    const tabIndexNumber = this.tabIndex;
     return (0, _emotion.jsx)(_View.View, Object.assign({}, (0, _passthroughProps.passthroughProps)(props), {
       as: this.elementType,
       focusColor: this.focusColor,
@@ -251,7 +236,7 @@ let BaseButton = exports.BaseButton = (_dec = (0, _emotion.withStyle)(_styles.de
       onClick: this.handleClick,
       onKeyDown: this.handleKeyDown,
       role: onClick && as !== 'button' ? 'button' : void 0,
-      tabIndex: onClick && as ? tabIndexNumber || 0 : tabIndexNumber,
+      tabIndex: onClick && as ? tabIndex || 0 : tabIndex,
       disabled: isDisabled || isReadOnly,
       css: isEnabled ? styles === null || styles === void 0 ? void 0 : styles.baseButton : null
     }), (0, _emotion.jsx)("span", {

package/lib/BaseButton/props.js

@@ -52,8 +52,6 @@ const propTypes = exports.propTypes = {
   onClick: _propTypes.default.func,
   onKeyDown: _propTypes.default.func,
   renderIcon: _propTypes.default.oneOfType([_propTypes.default.node, _propTypes.default.func]),
-  // Deprecated `string` tabIndex type
-  // TODO: remove string type in v9
-  tabIndex: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string])
+  tabIndex: _propTypes.default.number
 };
 const allowedProps = exports.allowedProps = ['as', 'children', 'color', 'cursor', 'display', 'elementRef', 'focusColor', 'href', 'interaction', 'isCondensed', 'margin', 'onClick', 'onKeyDown', 'renderIcon', 'shape', 'size', 'tabIndex', 'textAlign', 'type', 'withBackground', 'withBorder'];

package/lib/CloseButton/props.js

@@ -45,8 +45,6 @@ const propTypes = exports.propTypes = {
   as: _propTypes.default.elementType,
   href: _propTypes.default.string,
   cursor: _propTypes.default.string,
-  // Deprecated `string` tabIndex type
-  // TODO: remove string type in v9
-  tabIndex: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string])
+  tabIndex: _propTypes.default.number
 };
 const allowedProps = exports.allowedProps = ['as', 'color', 'cursor', 'elementRef', 'href', 'interaction', 'margin', 'offset', 'onClick', 'placement', 'screenReaderLabel', 'size', 'tabIndex', 'type'];

package/package.json

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

package/src/BaseButton/index.tsx

@@ -26,7 +26,6 @@
 import React, { Component } from 'react'
 import keycode from 'keycode'
 
-import { warn } from '@instructure/console'
 import { testable } from '@instructure/ui-testable'
 import {
   getElementType,
@@ -87,14 +86,6 @@ class BaseButton extends Component<BaseButtonProps> {
     this.props.makeStyles?.(this.makeStylesVariables)
   }
 
-  get _rootElement() {
-    console.warn(
-      '_rootElement property is deprecated and will be removed in v9, please use ref instead'
-    )
-
-    return this.ref
-  }
-
   get makeStylesVariables(): BaseButtonStyleProps {
     return {
       isDisabled: this.isDisabled,
@@ -127,20 +118,6 @@ class BaseButton extends Component<BaseButtonProps> {
     return this.interaction === 'enabled'
   }
 
-  // TODO: delete once the type of tabIndex is changed to number only
-  get tabIndex() {
-    const { tabIndex } = this.props
-
-    if (typeof tabIndex === 'string') {
-      warn(
-        false,
-        'The `string` value for `tabIndex` is deprecated. Only `number` type will be accepted from V9.0.0.'
-      )
-      return parseInt(tabIndex)
-    }
-    return tabIndex
-  }
-
   get focusColor() {
     const { color, focusColor, withBackground } = this.props
 
@@ -280,8 +257,6 @@ class BaseButton extends Component<BaseButtonProps> {
 
     const { isDisabled, isEnabled, isReadOnly } = this
 
-    const tabIndexNumber = this.tabIndex
-
     return (
       <View
         {...passthroughProps(props)}
@@ -302,7 +277,7 @@ class BaseButton extends Component<BaseButtonProps> {
         onClick={this.handleClick}
         onKeyDown={this.handleKeyDown}
         role={onClick && as !== 'button' ? 'button' : undefined}
-        tabIndex={onClick && as ? tabIndexNumber || 0 : tabIndexNumber}
+        tabIndex={onClick && as ? tabIndex || 0 : tabIndex}
         disabled={isDisabled || isReadOnly}
         css={isEnabled ? styles?.baseButton : null}
       >

package/src/BaseButton/props.ts

@@ -152,13 +152,11 @@ type BaseButtonOwnProps = {
    */
   renderIcon?: Renderable
 
-  // Deprecated `string` tabIndex type
   /**
    * Specifies the tabindex of the `Button`.
    *
-   * (`string` type is __deprecated__, use `number`)
    */
-  tabIndex?: number | string // TODO: remove string type in v9
+  tabIndex?: number
 }
 
 type BaseButtonStyleProps = {
@@ -213,9 +211,7 @@ const propTypes: PropValidators<PropKeys> = {
   onClick: PropTypes.func,
   onKeyDown: PropTypes.func,
   renderIcon: PropTypes.oneOfType([PropTypes.node, PropTypes.func]),
-  // Deprecated `string` tabIndex type
-  // TODO: remove string type in v9
-  tabIndex: PropTypes.oneOfType([PropTypes.number, PropTypes.string])
+  tabIndex: PropTypes.number
 }
 
 const allowedProps: AllowedPropKeys = [

package/src/CloseButton/props.ts

@@ -115,13 +115,11 @@ type CloseButtonOwnProps = {
    */
   cursor?: Cursor
 
-  // Deprecated `string` tabIndex type
   /**
    * Specifies the tabindex of the `CloseButton`.
    *
-   * (`string` type is __deprecated__, use `number`)
    */
-  tabIndex?: number | string // TODO: remove string type in v9
+  tabIndex?: number
 }
 
 type PropKeys = keyof CloseButtonOwnProps
@@ -150,9 +148,7 @@ const propTypes: PropValidators<PropKeys> = {
   as: PropTypes.elementType,
   href: PropTypes.string,
   cursor: PropTypes.string,
-  // Deprecated `string` tabIndex type
-  // TODO: remove string type in v9
-  tabIndex: PropTypes.oneOfType([PropTypes.number, PropTypes.string])
+  tabIndex: PropTypes.number
 }
 
 const allowedProps: AllowedPropKeys = [