@instructure/ui-toggle-details 8.56.0 → 8.56.2-pr-snapshot-1721749364069

package/CHANGELOG.md

@@ -3,6 +3,22 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [8.56.2-pr-snapshot-1721749364069](https://github.com/instructure/instructure-ui/compare/v8.56.1...v8.56.2-pr-snapshot-1721749364069) (2024-07-23)
+
+**Note:** Version bump only for package @instructure/ui-toggle-details
+
+
+
+
+
+## [8.56.1](https://github.com/instructure/instructure-ui/compare/v8.56.0...v8.56.1) (2024-06-13)
+
+**Note:** Version bump only for package @instructure/ui-toggle-details
+
+
+
+
+
 # [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-toggle-details

package/lib/ToggleDetails/ToggleDetailsLocator.js

@@ -4,7 +4,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.customMethods = exports.ToggleDetailsLocator = void 0;
-var _locator = require("@instructure/ui-test-locator/lib/utils/locator.js");
+var _uiTestLocator = require("@instructure/ui-test-locator");
 var _index = require("./index");
 /*
  * The MIT License (MIT)
@@ -30,19 +30,19 @@ var _index = require("./index");
  * SOFTWARE.
  */
 
-const ToggleLocator = (0, _locator.locator)('[aria-expanded][aria-controls]');
+const ToggleLocator = (0, _uiTestLocator.locator)('[aria-expanded][aria-controls]');
 const customMethods = exports.customMethods = {
   clickToggle: async (element, ...args) => (await ToggleLocator.find(element)).click(...args),
   findToggle: (element, ...args) => ToggleLocator.find(element, ...args),
   findContent: async (element, ...args) => {
     const toggle = await ToggleLocator.find(element);
     if (toggle) {
-      return (0, _locator.locator)(`#${toggle.getAttribute('aria-controls')}`).find(...args);
+      return (0, _uiTestLocator.locator)(`#${toggle.getAttribute('aria-controls')}`).find(...args);
     } else {
       return null;
     }
   }
 };
-const ToggleDetailsLocator = exports.ToggleDetailsLocator = (0, _locator.locator)(
+const ToggleDetailsLocator = exports.ToggleDetailsLocator = (0, _uiTestLocator.locator)(
 // @ts-expect-error ts-migrate(2339) FIXME: Property 'selector' does not exist on type 'typeof... Remove this comment to see the full error message
 _index.ToggleDetails.selector, customMethods);

package/lib/ToggleDetails/index.js

@@ -7,14 +7,12 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = exports.ToggleDetails = void 0;
 var _react = _interopRequireWildcard(require("react"));
-var _Button = require("@instructure/ui-buttons/lib/Button");
-var _IconArrowOpenEndSolid = require("@instructure/ui-icons/lib/IconArrowOpenEndSolid.js");
-var _IconArrowOpenDownSolid = require("@instructure/ui-icons/lib/IconArrowOpenDownSolid.js");
-var _Expandable = require("@instructure/ui-expandable/lib/Expandable");
-var _omitProps = require("@instructure/ui-react-utils/lib/omitProps.js");
-var _pickProps = require("@instructure/ui-react-utils/lib/pickProps.js");
-var _isActiveElement = require("@instructure/ui-dom-utils/lib/isActiveElement.js");
-var _testable = require("@instructure/ui-testable/lib/testable.js");
+var _uiButtons = require("@instructure/ui-buttons");
+var _uiIcons = require("@instructure/ui-icons");
+var _uiExpandable = require("@instructure/ui-expandable");
+var _uiReactUtils = require("@instructure/ui-react-utils");
+var _uiDomUtils = require("@instructure/ui-dom-utils");
+var _uiTestable = require("@instructure/ui-testable");
 var _emotion = require("@instructure/emotion");
 var _styles = _interopRequireDefault(require("./styles"));
 var _theme = _interopRequireDefault(require("./theme"));
@@ -49,7 +47,7 @@ var _dec, _dec2, _class, _class2;
 category: components
 ---
 **/
-let ToggleDetails = exports.ToggleDetails = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default), _dec2 = (0, _testable.testable)(), _dec(_class = _dec2(_class = (_class2 = class ToggleDetails extends _react.Component {
+let ToggleDetails = exports.ToggleDetails = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default), _dec2 = (0, _uiTestable.testable)(), _dec(_class = _dec2(_class = (_class2 = class ToggleDetails extends _react.Component {
   constructor(...args) {
     super(...args);
     this.ref = null;
@@ -66,7 +64,7 @@ let ToggleDetails = exports.ToggleDetails = (_dec = (0, _emotion.withStyle)(_sty
     };
   }
   get focused() {
-    return (0, _isActiveElement.isActiveElement)(this._button);
+    return (0, _uiDomUtils.isActiveElement)(this._button);
   }
   focus() {
     var _this$_button;
@@ -98,7 +96,7 @@ let ToggleDetails = exports.ToggleDetails = (_dec = (0, _emotion.withStyle)(_sty
   renderToggle(toggleProps, expanded) {
     const variant = this.props.variant;
     const props = {
-      ...(0, _omitProps.omitProps)(this.props, ToggleDetails.allowedProps),
+      ...(0, _uiReactUtils.omitProps)(this.props, ToggleDetails.allowedProps),
       ...toggleProps,
       children: this.renderSummary(expanded)
       // spread operator makes toggleProps loose Record<string, any>>
@@ -106,7 +104,7 @@ let ToggleDetails = exports.ToggleDetails = (_dec = (0, _emotion.withStyle)(_sty
 
     const summary = this.renderSummary(expanded);
     if (variant === 'filled') {
-      return (0, _emotion.jsx)(_Button.Button, Object.assign({}, props, {
+      return (0, _emotion.jsx)(_uiButtons.Button, Object.assign({}, props, {
         display: "block",
         textAlign: "start",
         elementRef: this.getButtonRef
@@ -152,7 +150,7 @@ let ToggleDetails = exports.ToggleDetails = (_dec = (0, _emotion.withStyle)(_sty
     }, this.props.children);
   }
   render() {
-    return (0, _emotion.jsx)(_Expandable.Expandable, Object.assign({}, (0, _pickProps.pickProps)(this.props, _Expandable.Expandable.allowedProps), {
+    return (0, _emotion.jsx)(_uiExpandable.Expandable, Object.assign({}, (0, _uiReactUtils.pickProps)(this.props, _uiExpandable.Expandable.allowedProps), {
       onToggle: this.handleToggle
     }), ({
       expanded,
@@ -172,8 +170,8 @@ let ToggleDetails = exports.ToggleDetails = (_dec = (0, _emotion.withStyle)(_sty
   variant: 'default',
   size: 'medium',
   fluidWidth: false,
-  icon: _IconArrowOpenEndSolid.IconArrowOpenEndSolid,
-  iconExpanded: _IconArrowOpenDownSolid.IconArrowOpenDownSolid,
+  icon: _uiIcons.IconArrowOpenEndSolid,
+  iconExpanded: _uiIcons.IconArrowOpenDownSolid,
   iconPosition: 'start',
   defaultExpanded: false,
   children: null

package/lib/ToggleDetails/props.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.propTypes = exports.allowedProps = void 0;
 var _propTypes = _interopRequireDefault(require("prop-types"));
-var _controllable = require("@instructure/ui-prop-types/lib/controllable.js");
+var _uiPropTypes = require("@instructure/ui-prop-types");
 /*
  * The MIT License (MIT)
  *
@@ -34,7 +34,7 @@ var _controllable = require("@instructure/ui-prop-types/lib/controllable.js");
 const propTypes = exports.propTypes = {
   variant: _propTypes.default.oneOf(['default', 'filled']),
   summary: _propTypes.default.node.isRequired,
-  expanded: (0, _controllable.controllable)(_propTypes.default.bool, 'onToggle', 'defaultExpanded'),
+  expanded: (0, _uiPropTypes.controllable)(_propTypes.default.bool, 'onToggle', 'defaultExpanded'),
   defaultExpanded: _propTypes.default.bool,
   onToggle: _propTypes.default.func,
   icon: _propTypes.default.func,

package/lib/ToggleGroup/ToggleGroupLocator.js

@@ -4,7 +4,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.customMethods = exports.ToggleGroupLocator = void 0;
-var _locator = require("@instructure/ui-test-locator/lib/utils/locator.js");
+var _uiTestLocator = require("@instructure/ui-test-locator");
 var _index = require("./index");
 /*
  * The MIT License (MIT)
@@ -30,7 +30,7 @@ var _index = require("./index");
  * SOFTWARE.
  */
 
-const ToggleLocator = (0, _locator.locator)('[aria-expanded][aria-controls]');
+const ToggleLocator = (0, _uiTestLocator.locator)('[aria-expanded][aria-controls]');
 const customMethods = exports.customMethods = {
   clickToggle: async (element, ...args) => {
     return (await ToggleLocator.find(element)).click(...args);
@@ -41,7 +41,7 @@ const customMethods = exports.customMethods = {
   findContent: async (element, ...args) => {
     const toggle = await ToggleLocator.find(element);
     if (toggle) {
-      return (0, _locator.locator)(`#${toggle.getAttribute('aria-controls')}`).find(...args);
+      return (0, _uiTestLocator.locator)(`#${toggle.getAttribute('aria-controls')}`).find(...args);
     } else {
       return null;
     }
@@ -49,4 +49,4 @@ const customMethods = exports.customMethods = {
 };
 
 // @ts-expect-error ts-migrate(2339) FIXME: Property 'selector' does not exist on type 'typeof... Remove this comment to see the full error message
-const ToggleGroupLocator = exports.ToggleGroupLocator = (0, _locator.locator)(_index.ToggleGroup.selector, customMethods);
+const ToggleGroupLocator = exports.ToggleGroupLocator = (0, _uiTestLocator.locator)(_index.ToggleGroup.selector, customMethods);

package/lib/ToggleGroup/index.js

@@ -6,19 +6,15 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = exports.ToggleGroup = void 0;
 var _react = _interopRequireWildcard(require("react"));
-var _omitProps = require("@instructure/ui-react-utils/lib/omitProps.js");
-var _pickProps = require("@instructure/ui-react-utils/lib/pickProps.js");
-var _getElementType = require("@instructure/ui-react-utils/lib/getElementType.js");
-var _callRenderProp = require("@instructure/ui-react-utils/lib/callRenderProp.js");
-var _IconButton = require("@instructure/ui-buttons/lib/IconButton");
-var _Transition = require("@instructure/ui-motion/lib/Transition");
-var _Expandable = require("@instructure/ui-expandable/lib/Expandable");
-var _isActiveElement = require("@instructure/ui-dom-utils/lib/isActiveElement.js");
-var _Flex = require("@instructure/ui-flex/lib/Flex");
-var _View = require("@instructure/ui-view/lib/View");
-var _IconArrowOpenEndSolid = require("@instructure/ui-icons/lib/IconArrowOpenEndSolid.js");
-var _IconArrowOpenDownSolid = require("@instructure/ui-icons/lib/IconArrowOpenDownSolid.js");
-var _testable = require("@instructure/ui-testable/lib/testable.js");
+var _uiReactUtils = require("@instructure/ui-react-utils");
+var _uiButtons = require("@instructure/ui-buttons");
+var _uiMotion = require("@instructure/ui-motion");
+var _uiExpandable = require("@instructure/ui-expandable");
+var _uiDomUtils = require("@instructure/ui-dom-utils");
+var _uiFlex = require("@instructure/ui-flex");
+var _uiView = require("@instructure/ui-view");
+var _uiIcons = require("@instructure/ui-icons");
+var _uiTestable = require("@instructure/ui-testable");
 var _props = require("./props");
 var _dec, _class, _class2;
 /*
@@ -49,7 +45,7 @@ var _dec, _class, _class2;
 category: components
 ---
 **/
-let ToggleGroup = exports.ToggleGroup = (_dec = (0, _testable.testable)(), _dec(_class = (_class2 = class ToggleGroup extends _react.Component {
+let ToggleGroup = exports.ToggleGroup = (_dec = (0, _uiTestable.testable)(), _dec(_class = (_class2 = class ToggleGroup extends _react.Component {
   constructor(...args) {
     super(...args);
     this.ref = null;
@@ -67,7 +63,7 @@ let ToggleGroup = exports.ToggleGroup = (_dec = (0, _testable.testable)(), _dec(
     };
   }
   get focused() {
-    return (0, _isActiveElement.isActiveElement)(this._button);
+    return (0, _uiDomUtils.isActiveElement)(this._button);
   }
   focus() {
     var _this$_button;
@@ -78,7 +74,7 @@ let ToggleGroup = exports.ToggleGroup = (_dec = (0, _testable.testable)(), _dec(
   }
   renderIcon(expanded) {
     const Icon = expanded ? this.props.iconExpanded : this.props.icon;
-    return Icon ? (0, _callRenderProp.callRenderProp)(Icon) : null;
+    return Icon ? (0, _uiReactUtils.callRenderProp)(Icon) : null;
   }
   renderToggle(toggleProps, expanded) {
     const _this$props = this.props,
@@ -93,7 +89,7 @@ let ToggleGroup = exports.ToggleGroup = (_dec = (0, _testable.testable)(), _dec(
     const props = {
       ...toggleProps
     };
-    return /*#__PURE__*/_react.default.createElement(_IconButton.IconButton, Object.assign({}, props, {
+    return /*#__PURE__*/_react.default.createElement(_uiButtons.IconButton, Object.assign({}, props, {
       withBackground: false,
       withBorder: false,
       size: size === 'large' ? 'medium' : 'small',
@@ -102,32 +98,32 @@ let ToggleGroup = exports.ToggleGroup = (_dec = (0, _testable.testable)(), _dec(
     }), this.renderIcon(expanded));
   }
   renderDetails(detailsProps) {
-    return /*#__PURE__*/_react.default.createElement(_View.View, Object.assign({}, detailsProps, {
+    return /*#__PURE__*/_react.default.createElement(_uiView.View, Object.assign({}, detailsProps, {
       display: "block",
       borderWidth: "small none none none"
-    }), this.props.transition && this._shouldTransition ? /*#__PURE__*/_react.default.createElement(_Transition.Transition, {
+    }), this.props.transition && this._shouldTransition ? /*#__PURE__*/_react.default.createElement(_uiMotion.Transition, {
       transitionOnMount: true,
       in: true,
       type: "fade"
     }, this.props.children) : this.props.children);
   }
   render() {
-    const Element = (0, _getElementType.getElementType)(ToggleGroup, this.props);
-    return /*#__PURE__*/_react.default.createElement(_Expandable.Expandable, (0, _pickProps.pickProps)(this.props, _Expandable.Expandable.allowedProps), ({
+    const Element = (0, _uiReactUtils.getElementType)(ToggleGroup, this.props);
+    return /*#__PURE__*/_react.default.createElement(_uiExpandable.Expandable, (0, _uiReactUtils.pickProps)(this.props, _uiExpandable.Expandable.allowedProps), ({
       expanded,
       getToggleProps,
       getDetailsProps
     }) => {
-      return /*#__PURE__*/_react.default.createElement(_View.View, Object.assign({}, (0, _omitProps.omitProps)(this.props, ToggleGroup.allowedProps), {
+      return /*#__PURE__*/_react.default.createElement(_uiView.View, Object.assign({}, (0, _uiReactUtils.omitProps)(this.props, ToggleGroup.allowedProps), {
         borderWidth: this.props.border ? 'small' : 'none',
         as: Element,
         elementRef: this.handleRef,
         display: "block",
         borderRadius: "medium",
         background: "primary"
-      }), /*#__PURE__*/_react.default.createElement(_Flex.Flex, {
+      }), /*#__PURE__*/_react.default.createElement(_uiFlex.Flex, {
         padding: this.props.size === 'small' ? 'x-small' : 'small small small x-small'
-      }, /*#__PURE__*/_react.default.createElement(_Flex.Flex.Item, null, this.renderToggle(getToggleProps(), expanded)), /*#__PURE__*/_react.default.createElement(_Flex.Flex.Item, {
+      }, /*#__PURE__*/_react.default.createElement(_uiFlex.Flex.Item, null, this.renderToggle(getToggleProps(), expanded)), /*#__PURE__*/_react.default.createElement(_uiFlex.Flex.Item, {
         shouldGrow: true,
         shouldShrink: true,
         padding: "0 0 0 x-small"
@@ -136,8 +132,8 @@ let ToggleGroup = exports.ToggleGroup = (_dec = (0, _testable.testable)(), _dec(
   }
 }, _class2.displayName = "ToggleGroup", _class2.componentId = 'ToggleGroup', _class2.allowedProps = _props.allowedProps, _class2.propTypes = _props.propTypes, _class2.defaultProps = {
   size: 'medium',
-  icon: _IconArrowOpenEndSolid.IconArrowOpenEndSolid,
-  iconExpanded: _IconArrowOpenDownSolid.IconArrowOpenDownSolid,
+  icon: _uiIcons.IconArrowOpenEndSolid,
+  iconExpanded: _uiIcons.IconArrowOpenDownSolid,
   defaultExpanded: false,
   transition: true,
   as: 'span',

package/lib/ToggleGroup/props.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.propTypes = exports.allowedProps = void 0;
 var _propTypes = _interopRequireDefault(require("prop-types"));
-var _controllable = require("@instructure/ui-prop-types/lib/controllable.js");
+var _uiPropTypes = require("@instructure/ui-prop-types");
 /*
  * The MIT License (MIT)
  *
@@ -38,7 +38,7 @@ const propTypes = exports.propTypes = {
   as: _propTypes.default.elementType,
   elementRef: _propTypes.default.func,
   size: _propTypes.default.oneOf(['small', 'medium', 'large']),
-  expanded: (0, _controllable.controllable)(_propTypes.default.bool, 'onToggle', 'defaultExpanded'),
+  expanded: (0, _uiPropTypes.controllable)(_propTypes.default.bool, 'onToggle', 'defaultExpanded'),
   defaultExpanded: _propTypes.default.bool,
   onToggle: _propTypes.default.func,
   icon: _propTypes.default.oneOfType([_propTypes.default.node, _propTypes.default.func]),

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@instructure/ui-toggle-details",
-  "version": "8.56.0",
+  "version": "8.56.2-pr-snapshot-1721749364069",
   "description": "A styled toggleable, accordion-like component.",
   "author": "Instructure, Inc. Engineering and Product Design",
   "module": "./es/index.js",
@@ -23,29 +23,29 @@
   },
   "license": "MIT",
   "devDependencies": {
-    "@instructure/ui-babel-preset": "8.56.0",
-    "@instructure/ui-test-locator": "8.56.0",
-    "@instructure/ui-test-queries": "8.56.0",
-    "@instructure/ui-test-utils": "8.56.0",
-    "@instructure/ui-themes": "8.56.0"
+    "@instructure/ui-babel-preset": "8.56.2-pr-snapshot-1721749364069",
+    "@instructure/ui-test-locator": "8.56.2-pr-snapshot-1721749364069",
+    "@instructure/ui-test-queries": "8.56.2-pr-snapshot-1721749364069",
+    "@instructure/ui-test-utils": "8.56.2-pr-snapshot-1721749364069",
+    "@instructure/ui-themes": "8.56.2-pr-snapshot-1721749364069"
   },
   "dependencies": {
     "@babel/runtime": "^7.23.2",
-    "@instructure/emotion": "8.56.0",
-    "@instructure/shared-types": "8.56.0",
-    "@instructure/ui-buttons": "8.56.0",
-    "@instructure/ui-dom-utils": "8.56.0",
-    "@instructure/ui-expandable": "8.56.0",
-    "@instructure/ui-flex": "8.56.0",
-    "@instructure/ui-icons": "8.56.0",
-    "@instructure/ui-menu": "8.56.0",
-    "@instructure/ui-motion": "8.56.0",
-    "@instructure/ui-prop-types": "8.56.0",
-    "@instructure/ui-react-utils": "8.56.0",
-    "@instructure/ui-testable": "8.56.0",
-    "@instructure/ui-utils": "8.56.0",
-    "@instructure/ui-view": "8.56.0",
-    "@instructure/uid": "8.56.0",
+    "@instructure/emotion": "8.56.2-pr-snapshot-1721749364069",
+    "@instructure/shared-types": "8.56.2-pr-snapshot-1721749364069",
+    "@instructure/ui-buttons": "8.56.2-pr-snapshot-1721749364069",
+    "@instructure/ui-dom-utils": "8.56.2-pr-snapshot-1721749364069",
+    "@instructure/ui-expandable": "8.56.2-pr-snapshot-1721749364069",
+    "@instructure/ui-flex": "8.56.2-pr-snapshot-1721749364069",
+    "@instructure/ui-icons": "8.56.2-pr-snapshot-1721749364069",
+    "@instructure/ui-menu": "8.56.2-pr-snapshot-1721749364069",
+    "@instructure/ui-motion": "8.56.2-pr-snapshot-1721749364069",
+    "@instructure/ui-prop-types": "8.56.2-pr-snapshot-1721749364069",
+    "@instructure/ui-react-utils": "8.56.2-pr-snapshot-1721749364069",
+    "@instructure/ui-testable": "8.56.2-pr-snapshot-1721749364069",
+    "@instructure/ui-utils": "8.56.2-pr-snapshot-1721749364069",
+    "@instructure/ui-view": "8.56.2-pr-snapshot-1721749364069",
+    "@instructure/uid": "8.56.2-pr-snapshot-1721749364069",
     "prop-types": "^15.8.1"
   },
   "peerDependencies": {