@instructure/ui-top-nav-bar 8.33.1 → 8.33.2

package/CHANGELOG.md

@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [8.33.2](https://github.com/instructure/instructure-ui/compare/v8.33.1...v8.33.2) (2023-01-25)
+
+**Note:** Version bump only for package @instructure/ui-top-nav-bar
+
 ## [8.33.1](https://github.com/instructure/instructure-ui/compare/v8.33.0...v8.33.1) (2023-01-06)
 
 ### Bug Fixes

package/es/TopNavBar/TopNavBarActionItems/TopNavBarActionItemsLocator.js

@@ -21,16 +21,18 @@
  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  * SOFTWARE.
  */
+
 import { locator } from '@instructure/ui-test-locator';
+
 /* eslint-disable no-restricted-imports */
 // @ts-expect-error bypass no type definition found error
-
 import { TruncateListLocator } from '@instructure/ui-truncate-list/es/TruncateList/TruncateListLocator';
 /* eslint-enable no-restricted-imports */
 
 import { TopNavBarItemLocator } from '../TopNavBarItem/TopNavBarItemLocator';
 import { TopNavBarActionItems } from './index';
-export const TopNavBarActionItemsLocator = 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
+export const TopNavBarActionItemsLocator = 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
 TopNavBarActionItems.selector, {
   findAllActionItems: function () {
     return TopNavBarItemLocator.findAll(...arguments);

package/es/TopNavBar/TopNavBarActionItems/index.js

@@ -1,5 +1,4 @@
 var _dec, _dec2, _dec3, _class, _class2;
-
 /*
  * The MIT License (MIT)
  *
@@ -39,7 +38,6 @@ import { TopNavBarContext } from '../TopNavBarContext';
 import generateStyle from './styles';
 import generateComponentTheme from './theme';
 import { propTypes, allowedProps } from './props';
-
 /**
 ---
 parent: TopNavBar
@@ -54,16 +52,13 @@ let TopNavBarActionItems = (_dec = withDeterministicId(), _dec2 = withStyle(gene
     this.ref = null;
     this._hiddenActionItemsMenuId = void 0;
     this._hiddenActionItemsMenuTriggerId = void 0;
-
     this.handleRef = el => {
       const elementRef = this.props.elementRef;
       this.ref = el;
-
       if (typeof elementRef === 'function') {
         elementRef(el);
       }
     };
-
     this.renderOptionContent = (children, itemProps) => {
       const styles = this.props.styles;
       const status = itemProps.status;
@@ -71,7 +66,6 @@ let TopNavBarActionItems = (_dec = withDeterministicId(), _dec2 = withStyle(gene
         css: status === 'active' ? styles === null || styles === void 0 ? void 0 : styles.dropdownMenuOptionActive : styles === null || styles === void 0 ? void 0 : styles.dropdownMenuOption
       }, children);
     };
-
     this._hiddenActionItemsMenuId = props.deterministicId('TopNavBarActionItems-hiddenActionItemsMenu');
     this._hiddenActionItemsMenuTriggerId = props.deterministicId('TopNavBarActionItems-hiddenActionItemsMenuTrigger');
     this.state = {
@@ -79,44 +73,35 @@ let TopNavBarActionItems = (_dec = withDeterministicId(), _dec2 = withStyle(gene
       visibleActionItemsCount: void 0
     };
   }
-
   componentDidMount() {
     var _this$props$makeStyle, _this$props;
-
     (_this$props$makeStyle = (_this$props = this.props).makeStyles) === null || _this$props$makeStyle === void 0 ? void 0 : _this$props$makeStyle.call(_this$props, this.makeStylesVariables);
   }
-
   componentDidUpdate(prevProps) {
     var _this$props$makeStyle2, _this$props2;
-
     (_this$props$makeStyle2 = (_this$props2 = this.props).makeStyles) === null || _this$props$makeStyle2 === void 0 ? void 0 : _this$props$makeStyle2.call(_this$props2, this.makeStylesVariables);
-
     if (this.context.layout === 'smallViewport' && React.Children.count(prevProps.children) !== React.Children.count(this.props.children)) {
       this.setState({
         key: this.state.key + 1
       });
     }
   }
-
   get makeStylesVariables() {
     return {
       layout: this.context.layout
     };
   }
-
   get childrenArray() {
     const children = React.Children.toArray(this.props.children);
     return children.map(child => {
       if (!(child !== null && child !== void 0 && child.props)) {
         return null;
       }
-
       const _child$props = child.props,
-            id = _child$props.id,
-            renderAvatar = _child$props.renderAvatar,
-            renderIcon = _child$props.renderIcon,
-            variant = _child$props.variant;
-
+        id = _child$props.id,
+        renderAvatar = _child$props.renderAvatar,
+        renderIcon = _child$props.renderIcon,
+        variant = _child$props.variant;
       if (renderAvatar) {
         warn(false, `Items in <TopNavBar.ActionItems> are not allowed to have avatars, please remove it from item with the id "${id}".`);
         return safeCloneElement(child, {
@@ -124,26 +109,22 @@ let TopNavBarActionItems = (_dec = withDeterministicId(), _dec2 = withStyle(gene
           variant: 'default'
         });
       }
-
       if (this.context.layout === 'smallViewport' && variant !== 'icon') {
         if (!renderIcon) {
           error(false, `Items in <TopNavBar.ActionItems> are required to have the \`renderIcon\` prop, because only the icons are displayed due to the lack of space. Please add an icon to the item with the id "${id}".`);
           return null;
         }
-
         return safeCloneElement(child, {
           variant: 'icon'
         });
       }
-
       return child;
     });
   }
-
   renderHiddenActionItemsMenu(hiddenItems) {
     const _this$props3 = this.props,
-          renderHiddenItemsMenuTriggerLabel = _this$props3.renderHiddenItemsMenuTriggerLabel,
-          renderHiddenItemsMenuTriggerTooltip = _this$props3.renderHiddenItemsMenuTriggerTooltip;
+      renderHiddenItemsMenuTriggerLabel = _this$props3.renderHiddenItemsMenuTriggerLabel,
+      renderHiddenItemsMenuTriggerTooltip = _this$props3.renderHiddenItemsMenuTriggerTooltip;
     const mappedItems = mapItemsForDrilldown(hiddenItems, {
       renderOptionContent: this.renderOptionContent
     });
@@ -165,11 +146,10 @@ let TopNavBarActionItems = (_dec = withDeterministicId(), _dec2 = withStyle(gene
       }, options), ...subPages])
     }, label);
   }
-
   renderTruncatedActionItemList() {
     const _this$props4 = this.props,
-          listLabel = _this$props4.listLabel,
-          styles = _this$props4.styles;
+      listLabel = _this$props4.listLabel,
+      styles = _this$props4.styles;
     return jsx(TruncateList, Object.assign({}, passthroughProps(omitProps(this.props, allowedProps)), {
       key: this.state.key // rerender if child count changes
       ,
@@ -186,20 +166,16 @@ let TopNavBarActionItems = (_dec = withDeterministicId(), _dec2 = withStyle(gene
       "aria-label": listLabel
     }), this.childrenArray);
   }
-
   render() {
     const _this$props5 = this.props,
-          listLabel = _this$props5.listLabel,
-          styles = _this$props5.styles;
-
+      listLabel = _this$props5.listLabel,
+      styles = _this$props5.styles;
     if (!this.childrenArray.length) {
       return null;
     }
-
     if (this.context.layout === 'smallViewport') {
       return this.renderTruncatedActionItemList();
     }
-
     return jsx("ul", Object.assign({}, omitProps(this.props, allowedProps), {
       ref: this.handleRef,
       css: styles === null || styles === void 0 ? void 0 : styles.topNavBarActionItems,
@@ -209,7 +185,6 @@ let TopNavBarActionItems = (_dec = withDeterministicId(), _dec2 = withStyle(gene
       key: item.props.id
     }, item)));
   }
-
 }, _class2.displayName = "TopNavBarActionItems", _class2.componentId = 'TopNavBar.ActionItems', _class2.propTypes = propTypes, _class2.allowedProps = allowedProps, _class2.defaultProps = {}, _class2.contextType = TopNavBarContext, _class2)) || _class) || _class) || _class);
 export { TopNavBarActionItems };
 export default TopNavBarActionItems;

package/es/TopNavBar/TopNavBarActionItems/props.js

@@ -21,6 +21,7 @@
  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  * SOFTWARE.
  */
+
 import PropTypes from 'prop-types';
 import { Children as ChildrenPropTypes } from '@instructure/ui-prop-types';
 import { TopNavBarItem } from '../TopNavBarItem';

package/es/TopNavBar/TopNavBarActionItems/styles.js

@@ -72,5 +72,4 @@ const generateStyle = (componentTheme, _props, state) => {
     }
   };
 };
-
 export default generateStyle;

package/es/TopNavBar/TopNavBarActionItems/theme.js

@@ -29,8 +29,8 @@
  */
 const generateComponentTheme = theme => {
   const typography = theme.typography,
-        spacing = theme.spacing,
-        borders = theme.borders;
+    spacing = theme.spacing,
+    borders = theme.borders;
   const componentVariables = {
     smallViewportActionItemContainerMargin: spacing === null || spacing === void 0 ? void 0 : spacing.xxLarge,
     smallViewportActionItemContainerMaxWidth: '50%',
@@ -39,8 +39,8 @@ const generateComponentTheme = theme => {
     smallViewportDropdownMenuActiveOptionIndicatorWidth: borders === null || borders === void 0 ? void 0 : borders.widthMedium,
     smallViewportDropdownMenuActiveOptionIndicatorColor: 'currentColor'
   };
-  return { ...componentVariables
+  return {
+    ...componentVariables
   };
 };
-
 export default generateComponentTheme;

package/es/TopNavBar/TopNavBarBrand/TopNavBarBrandLocator.js

@@ -21,37 +21,35 @@
  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  * SOFTWARE.
  */
+
 import { locator } from '@instructure/ui-test-locator';
 import { find } from '@instructure/ui-test-utils';
-import { TopNavBarBrand } from './index'; // @ts-expect-error ts-migrate(2339) FIXME: Property 'selector' does not exist on type 'typeof... Remove this comment to see the full error message
+import { TopNavBarBrand } from './index';
 
+// @ts-expect-error ts-migrate(2339) FIXME: Property 'selector' does not exist on type 'typeof... Remove this comment to see the full error message
 export const TopNavBarBrandLocator = locator(TopNavBarBrand.selector, {
   findContainer: function () {
     for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
       args[_key] = arguments[_key];
     }
-
     return find('[class$="-topNavBarBrand__container"]', ...args);
   },
   findBrandNameContainer: function () {
     for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
       args[_key2] = arguments[_key2];
     }
-
     return find('[class$="-topNavBarBrand__nameContainer"]', ...args);
   },
   findBrandIconContainer: function () {
     for (var _len3 = arguments.length, args = new Array(_len3), _key3 = 0; _key3 < _len3; _key3++) {
       args[_key3] = arguments[_key3];
     }
-
     return find('[class$="-topNavBarBrand__iconContainer"]', ...args);
   },
   findScreenReaderLabel: function () {
     for (var _len4 = arguments.length, args = new Array(_len4), _key4 = 0; _key4 < _len4; _key4++) {
       args[_key4] = arguments[_key4];
     }
-
     return find('[class$="-screenReaderContent"]', ...args);
   }
 });

package/es/TopNavBar/TopNavBarBrand/index.js

@@ -1,5 +1,4 @@
 var _dec, _dec2, _class, _class2;
-
 /*
  * The MIT License (MIT)
  *
@@ -35,7 +34,6 @@ import { TopNavBarContext } from '../TopNavBarContext';
 import generateStyle from './styles';
 import generateComponentTheme from './theme';
 import { propTypes, allowedProps } from './props';
-
 /**
 ---
 parent: TopNavBar
@@ -48,43 +46,35 @@ let TopNavBarBrand = (_dec = withStyle(generateStyle, generateComponentTheme), _
   constructor() {
     super(...arguments);
     this.ref = null;
-
     this.handleRef = el => {
       const elementRef = this.props.elementRef;
       this.ref = el;
-
       if (typeof elementRef === 'function') {
         elementRef(el);
       }
     };
   }
-
   componentDidMount() {
     var _this$props$makeStyle, _this$props;
-
     (_this$props$makeStyle = (_this$props = this.props).makeStyles) === null || _this$props$makeStyle === void 0 ? void 0 : _this$props$makeStyle.call(_this$props, this.makeStylesVariables);
   }
-
   componentDidUpdate() {
     var _this$props$makeStyle2, _this$props2;
-
     (_this$props$makeStyle2 = (_this$props2 = this.props).makeStyles) === null || _this$props$makeStyle2 === void 0 ? void 0 : _this$props$makeStyle2.call(_this$props2, this.makeStylesVariables);
   }
-
   get makeStylesVariables() {
     return {
       layout: this.context.layout
     };
   }
-
   render() {
     const _this$props3 = this.props,
-          screenReaderLabel = _this$props3.screenReaderLabel,
-          renderName = _this$props3.renderName,
-          renderIcon = _this$props3.renderIcon,
-          href = _this$props3.href,
-          onClick = _this$props3.onClick,
-          styles = _this$props3.styles;
+      screenReaderLabel = _this$props3.screenReaderLabel,
+      renderName = _this$props3.renderName,
+      renderIcon = _this$props3.renderIcon,
+      href = _this$props3.href,
+      onClick = _this$props3.onClick,
+      styles = _this$props3.styles;
     const ElementType = getElementType(TopNavBarBrand, this.props);
     return jsx("div", {
       ref: this.handleRef,
@@ -111,7 +101,6 @@ let TopNavBarBrand = (_dec = withStyle(generateStyle, generateComponentTheme), _
       "aria-hidden": "true"
     }, renderName)));
   }
-
 }, _class2.displayName = "TopNavBarBrand", _class2.componentId = 'TopNavBar.Brand', _class2.propTypes = propTypes, _class2.allowedProps = allowedProps, _class2.defaultProps = {}, _class2.contextType = TopNavBarContext, _class2)) || _class) || _class);
 export { TopNavBarBrand };
 export default TopNavBarBrand;

package/es/TopNavBar/TopNavBarBrand/props.js

@@ -21,6 +21,7 @@
  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  * SOFTWARE.
  */
+
 import PropTypes from 'prop-types';
 const propTypes = {
   screenReaderLabel: PropTypes.string.isRequired,

package/es/TopNavBar/TopNavBarBrand/styles.js

@@ -34,7 +34,7 @@
  */
 const generateStyle = (componentTheme, props, state) => {
   const nameBackground = props.nameBackground,
-        iconBackground = props.iconBackground;
+    iconBackground = props.iconBackground;
   const isDesktop = state.layout === 'desktop';
   return {
     topNavBarBrand: {
@@ -87,5 +87,4 @@ const generateStyle = (componentTheme, props, state) => {
     focusOutlineInset: componentTheme.focusOutlineInset
   };
 };
-
 export default generateStyle;

package/es/TopNavBar/TopNavBarBrand/theme.js

@@ -35,8 +35,8 @@ const generateComponentTheme = theme => {
     iconPadding: spacing.small,
     focusOutlineInset: '-0.25rem'
   };
-  return { ...componentVariables
+  return {
+    ...componentVariables
   };
 };
-
 export default generateComponentTheme;

package/es/TopNavBar/TopNavBarContext.js

@@ -21,8 +21,8 @@
  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  * SOFTWARE.
  */
-import { createContext } from 'react';
 
+import { createContext } from 'react';
 /**
 ---
 private: true

package/es/TopNavBar/TopNavBarItem/TopNavBarItemLocator.js

@@ -21,25 +21,27 @@
  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  * SOFTWARE.
  */
+
 import { locator } from '@instructure/ui-test-locator';
 import { find } from '@instructure/ui-test-utils';
 import { getComputedStyle } from '@instructure/ui-dom-utils';
+
 /* eslint-disable no-restricted-imports */
 // @ts-expect-error bypass no type definition found error
-
-import { BaseButtonLocator } from '@instructure/ui-buttons/es/BaseButton/BaseButtonLocator'; // @ts-expect-error bypass no type definition found error
-
-import { TooltipLocator } from '@instructure/ui-tooltip/es/Tooltip/TooltipLocator'; // @ts-expect-error bypass no type definition found error
-
-import { AvatarLocator } from '@instructure/ui-avatar/es/Avatar/AvatarLocator'; // @ts-expect-error bypass no type definition found error
-
-import { DrilldownLocator } from '@instructure/ui-drilldown/es/Drilldown/DrilldownLocator'; // @ts-expect-error bypass no type definition found error
-
+import { BaseButtonLocator } from '@instructure/ui-buttons/es/BaseButton/BaseButtonLocator';
+// @ts-expect-error bypass no type definition found error
+import { TooltipLocator } from '@instructure/ui-tooltip/es/Tooltip/TooltipLocator';
+// @ts-expect-error bypass no type definition found error
+import { AvatarLocator } from '@instructure/ui-avatar/es/Avatar/AvatarLocator';
+// @ts-expect-error bypass no type definition found error
+import { DrilldownLocator } from '@instructure/ui-drilldown/es/Drilldown/DrilldownLocator';
+// @ts-expect-error bypass no type definition found error
 import { PopoverLocator } from '@instructure/ui-popover/es/Popover/PopoverLocator';
 /* eslint-enable no-restricted-imports */
 
-import { TopNavBarItem } from './index'; // @ts-expect-error ts-migrate(2339) FIXME: Property 'selector' does not exist on type 'typeof... Remove this comment to see the full error message
+import { TopNavBarItem } from './index';
 
+// @ts-expect-error ts-migrate(2339) FIXME: Property 'selector' does not exist on type 'typeof... Remove this comment to see the full error message
 export const TopNavBarItemLocator = locator(TopNavBarItem.selector, {
   findButton: function () {
     return BaseButtonLocator.find(...arguments);
@@ -68,7 +70,6 @@ export const TopNavBarItemLocator = locator(TopNavBarItem.selector, {
     for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
       args[_key] = arguments[_key];
     }
-
     return find('[class$="-topNavBarItem__content"]', ...args);
   },
   findSubmenu: function () {
@@ -76,7 +77,6 @@ export const TopNavBarItemLocator = locator(TopNavBarItem.selector, {
   },
   findCustomPopover: async function () {
     const popover = await PopoverLocator.find(...arguments);
-
     if (popover) {
       const isDrilldown = popover.getAttribute('data-cid').includes('Drilldown');
       return isDrilldown ? null : popover;
@@ -91,14 +91,12 @@ export const TopNavBarItemLocator = locator(TopNavBarItem.selector, {
     for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
       args[_key2] = arguments[_key2];
     }
-
     return find('[class*="-baseButton__icon"] [class$="-svgIcon"]', ...args);
   },
   findSubmenuChevron: function () {
     for (var _len3 = arguments.length, args = new Array(_len3), _key3 = 0; _key3 < _len3; _key3++) {
       args[_key3] = arguments[_key3];
     }
-
     return find('[class$="-topNavBarItem__submenuIcon"] [class$="-svgIcon"]', ...args);
   },
   findAvatar: function () {
@@ -108,7 +106,6 @@ export const TopNavBarItemLocator = locator(TopNavBarItem.selector, {
     for (var _len4 = arguments.length, args = new Array(_len4), _key4 = 0; _key4 < _len4; _key4++) {
       args[_key4] = arguments[_key4];
     }
-
     return find('[class$="-screenReaderContent"]', ...args);
   }
 });