@instructure/ui-top-nav-bar 8.30.1-snapshot-15

package/lib/TopNavBar/utils/mapItemsForDrilldown.js

@@ -0,0 +1,165 @@
+"use strict";
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.renderMappedItemsAsDrilldownOptions = exports.renderMappedItemDrilldownSubpages = exports.mapItemsForDrilldown = exports.default = void 0;
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _console = require("@instructure/console");
+
+var _generateId = require("@instructure/ui-utils/lib/generateId.js");
+
+var _matchComponentTypes = require("@instructure/ui-react-utils/lib/matchComponentTypes.js");
+
+var _generateInstanceCounterMap = require("@instructure/ui-react-utils/lib/DeterministicIdContext/generateInstanceCounterMap.js");
+
+var _Drilldown = require("@instructure/ui-drilldown/lib/Drilldown");
+
+var _TopNavBarItem = require("../TopNavBarItem");
+
+/*
+ * The MIT License (MIT)
+ *
+ * Copyright (c) 2015 - present Instructure, Inc.
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in all
+ * copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+ * SOFTWARE.
+ */
+const mapItemsForDrilldown = function (itemList) {
+  let options = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : {};
+  const submenus = [];
+  const currentPageId = options.currentPageId,
+        renderOptionContent = options.renderOptionContent;
+  const customPopoverIdMap = (0, _generateInstanceCounterMap.generateInstanceCounterMap)();
+
+  _react.Children.forEach(itemList, item => {
+    if (!item || !(0, _matchComponentTypes.matchComponentTypes)(item, [_TopNavBarItem.TopNavBarItem])) return;
+    const _item$props = item.props,
+          renderSubmenu = _item$props.renderSubmenu,
+          customPopoverConfig = _item$props.customPopoverConfig,
+          id = _item$props.id,
+          children = _item$props.children,
+          status = _item$props.status,
+          variant = _item$props.variant,
+          href = _item$props.href,
+          onClick = _item$props.onClick;
+    let submenu = renderSubmenu;
+    let customPopover = customPopoverConfig;
+    let customPopoverId;
+    let optionSubPageId;
+    const submenuPages = [];
+
+    if (submenu) {
+      if (!(0, _matchComponentTypes.matchComponentTypes)(submenu, [_Drilldown.Drilldown])) {
+        (0, _console.warn)(false, `The "renderSubmenu" prop accepts only Drilldown components, but the item with id "${id}" received: "${renderSubmenu}".`);
+        submenu = void 0;
+      } // if still has submenu...
+
+
+      if (submenu) {
+        optionSubPageId = submenu.props.rootPageId;
+        submenuPages.push(..._react.Children.toArray(submenu.props.children));
+      }
+    }
+
+    if (customPopover) {
+      if (!customPopover.children) {
+        (0, _console.warn)(false, `Pass the content of the custom Popover as "customPopoverConfig.children" for the item with id: "${id}".`);
+        customPopover = void 0;
+      }
+
+      if (submenu) {
+        (0, _console.warn)(false, `TopNavBar.Items are not allowed to have both the "renderSubmenu" and "customPopoverConfig" props. For submenus, pass a Drilldown component via the "renderSubmenu" prop, and only use "customPopoverConfig" for custom features. Item with id: "${id}" will ignore the "customPopoverConfig" prop.`);
+        customPopover = void 0;
+      } // if still has customPopover...
+
+
+      if (customPopover) {
+        customPopoverId = (0, _generateId.generateId)(`TopNavBarItem__customPopoverOption`, customPopoverIdMap);
+        optionSubPageId = customPopoverId;
+        submenuPages.push( /*#__PURE__*/_react.default.createElement(_Drilldown.Drilldown.Page, {
+          id: customPopoverId,
+          key: customPopoverId
+        }, /*#__PURE__*/_react.default.createElement(_Drilldown.Drilldown.Option, {
+          id: `${customPopoverId}__option`
+        }, customPopover.children)));
+      }
+    }
+
+    let ariaCurrent = item.props['aria-current'] || (id === currentPageId ? 'page' : void 0);
+
+    if (ariaCurrent) {
+      if (variant !== 'default') {
+        (0, _console.warn)(false, `Only \`variant="default"\` items can be set to current/active, but the item with id "${id}" is "${variant}" variant.`);
+        ariaCurrent = void 0;
+      }
+
+      if (status === 'disabled') {
+        (0, _console.warn)(false, `Disabled items can not be set to current/active, but the item with id "${id}" is disabled.`);
+        ariaCurrent = void 0;
+      }
+    }
+
+    submenus.push({
+      item,
+      submenuPages,
+      optionData: {
+        id,
+        disabled: status === 'disabled',
+        href,
+        onOptionClick: event => {
+          onClick === null || onClick === void 0 ? void 0 : onClick(event);
+        },
+        children: typeof renderOptionContent === 'function' ? renderOptionContent(children, { ...item.props,
+          status: ariaCurrent === 'page' ? 'active' : item.props.status
+        }) : children,
+        subPageId: optionSubPageId,
+        'aria-current': ariaCurrent
+      }
+    });
+  });
+
+  return submenus;
+};
+
+exports.mapItemsForDrilldown = mapItemsForDrilldown;
+
+const renderMappedItemDrilldownSubpages = mappedItems => {
+  const subPages = mappedItems.map(option => option.submenuPages).filter(submenu => !!submenu);
+  return subPages.flat();
+};
+
+exports.renderMappedItemDrilldownSubpages = renderMappedItemDrilldownSubpages;
+
+const renderMappedItemsAsDrilldownOptions = mappedItems => {
+  return mappedItems.map(mappedItem => {
+    const optionData = mappedItem.optionData;
+    return /*#__PURE__*/_react.default.createElement(_Drilldown.Drilldown.Option, Object.assign({}, optionData, {
+      key: optionData.id,
+      afterLabelContentVAlign: "center"
+    }), optionData.children);
+  });
+};
+
+exports.renderMappedItemsAsDrilldownOptions = renderMappedItemsAsDrilldownOptions;
+var _default = mapItemsForDrilldown;
+exports.default = _default;

package/lib/index.js

@@ -0,0 +1,13 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "TopNavBar", {
+  enumerable: true,
+  get: function () {
+    return _TopNavBar.TopNavBar;
+  }
+});
+
+var _TopNavBar = require("./TopNavBar");

package/lib/package.json

@@ -0,0 +1 @@
+{"type":"commonjs"}

package/package.json

@@ -0,0 +1,64 @@
+{
+  "name": "@instructure/ui-top-nav-bar",
+  "version": "8.30.1-snapshot-15",
+  "description": "A UI component library made by Instructure Inc.",
+  "author": "Instructure, Inc. Engineering and Product Design",
+  "module": "./es/index.js",
+  "main": "./lib/index.js",
+  "types": "./types/index.d.ts",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/instructure/instructure-ui.git"
+  },
+  "homepage": "https://instructure.github.io/instructure-ui/",
+  "bugs": "https://github.com/instructure/instructure-ui/issues",
+  "scripts": {
+    "lint": "run -T ui-test --lint",
+    "lint:fix": "run -T ui-test --lint --fix",
+    "clean": "run -T ui-build --clean",
+    "build": "run -T ui-build --modules es,cjs",
+    "build:watch": "yarn ts:check --watch & run -T ui-build --watch",
+    "build:types": "run -T tsc -p tsconfig.build.json",
+    "ts:check": "run -T tsc -p tsconfig.build.json --noEmit --emitDeclarationOnly false"
+  },
+  "license": "MIT",
+  "dependencies": {
+    "@babel/runtime": "^7.13.10",
+    "@instructure/console": "8.30.1-snapshot-15",
+    "@instructure/emotion": "8.30.1-snapshot-15",
+    "@instructure/shared-types": "8.30.1-snapshot-15",
+    "@instructure/ui-a11y-content": "8.30.1-snapshot-15",
+    "@instructure/ui-avatar": "8.30.1-snapshot-15",
+    "@instructure/ui-buttons": "8.30.1-snapshot-15",
+    "@instructure/ui-dialog": "8.30.1-snapshot-15",
+    "@instructure/ui-dom-utils": "8.30.1-snapshot-15",
+    "@instructure/ui-drilldown": "8.30.1-snapshot-15",
+    "@instructure/ui-icons": "8.30.1-snapshot-15",
+    "@instructure/ui-link": "8.30.1-snapshot-15",
+    "@instructure/ui-popover": "8.30.1-snapshot-15",
+    "@instructure/ui-prop-types": "8.30.1-snapshot-15",
+    "@instructure/ui-react-utils": "8.30.1-snapshot-15",
+    "@instructure/ui-responsive": "8.30.1-snapshot-15",
+    "@instructure/ui-testable": "8.30.1-snapshot-15",
+    "@instructure/ui-tooltip": "8.30.1-snapshot-15",
+    "@instructure/ui-tray": "8.30.1-snapshot-15",
+    "@instructure/ui-truncate-list": "8.30.1-snapshot-15",
+    "@instructure/ui-utils": "8.30.1-snapshot-15",
+    "@instructure/ui-view": "8.30.1-snapshot-15",
+    "prop-types": "^15"
+  },
+  "devDependencies": {
+    "@instructure/ui-babel-preset": "8.30.1-snapshot-15",
+    "@instructure/ui-color-utils": "8.30.1-snapshot-15",
+    "@instructure/ui-test-locator": "8.30.1-snapshot-15",
+    "@instructure/ui-test-utils": "8.30.1-snapshot-15",
+    "@instructure/ui-themes": "8.30.1-snapshot-15"
+  },
+  "peerDependencies": {
+    "react": ">=16.8 <=18"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "sideEffects": false
+}