@pnp/spfx-controls-react 3.15.0-beta.4974189 → 3.15.0-beta.5068030

package/CHANGELOG.json

@@ -3,10 +3,14 @@
     {
       "version": "3.15.0",
       "changes": {
-        "new": [],
+        "new": [
+          "`TermSetNavigation`: new control TermSetNavigation [#1527](https://github.com/pnp/sp-dev-fx-controls-react/pull/1527)"
+        ],
         "enhancements": [
           "`FolderExplorer`: show files on folder explorer control [#1502](https://github.com/pnp/sp-dev-fx-controls-react/pull/1502)",
-          "`Dynamic Form`: Fixed typo in property name [#1529](https://github.com/pnp/sp-dev-fx-controls-react/pull/1529)"
+          "`DynamicForm`: Fixed typo in property name [#1529](https://github.com/pnp/sp-dev-fx-controls-react/pull/1529)",
+          "`DynamicForm`: validation error dialog added [#1531](https://github.com/pnp/sp-dev-fx-controls-react/pull/1531/)"
+
         ],
         "fixes": [
           "`FieldPicker`: Changed react import to fix `cannot be used as a JSX component` error [#1500](https://github.com/pnp/sp-dev-fx-controls-react/pull/1500)",

package/CHANGELOG.md

@@ -5,7 +5,8 @@
 ### Enhancements
 
 - `FolderExplorer`: show files on folder explorer control [#1502](https://github.com/pnp/sp-dev-fx-controls-react/pull/1502)
-- `Dynamic Form`: Fixed typo in property name [#1529](https://github.com/pnp/sp-dev-fx-controls-react/pull/1529)
+- `DynamicForm`: Fixed typo in property name [#1529](https://github.com/pnp/sp-dev-fx-controls-react/pull/1529)
+- `DynamicForm`: validation error dialog added [#1531](https://github.com/pnp/sp-dev-fx-controls-react/pull/1531/)
 
 ### Fixes
 

package/lib/TermSetNavigation.d.ts

@@ -0,0 +1,2 @@
+export * from './controls/TermSetNavigation/index';
+//# sourceMappingURL=TermSetNavigation.d.ts.map

package/lib/TermSetNavigation.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TermSetNavigation.d.ts","sourceRoot":"","sources":["../src/TermSetNavigation.ts"],"names":[],"mappings":"AAAA,cAAc,oCAAoC,CAAC"}

package/lib/TermSetNavigation.js

@@ -0,0 +1,2 @@
+export * from './controls/TermSetNavigation/index';
+//# sourceMappingURL=TermSetNavigation.js.map

package/lib/TermSetNavigation.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TermSetNavigation.js","sourceRoot":"","sources":["../src/TermSetNavigation.ts"],"names":[],"mappings":"AAAA,cAAc,oCAAoC,CAAC"}

package/lib/common/telemetry/version.js

@@ -1,2 +1,2 @@
-export var version = "3.15.0-beta.4974189";
+export var version = "3.15.0-beta.5068030";
 //# sourceMappingURL=version.js.map

package/lib/controls/TermSetNavigation/ErrorMessage/ErrorMessage.d.ts

@@ -0,0 +1,4 @@
+import * as React from 'react';
+import { IErrorMessageProps } from '../models/IErrorMessageProps';
+export declare const ErrorMessage: React.FunctionComponent<IErrorMessageProps>;
+//# sourceMappingURL=ErrorMessage.d.ts.map

package/lib/controls/TermSetNavigation/ErrorMessage/ErrorMessage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ErrorMessage.d.ts","sourceRoot":"","sources":["../../../../src/controls/TermSetNavigation/ErrorMessage/ErrorMessage.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAQ/B,OAAO,EAAE,kBAAkB,EAAE,MAAM,8BAA8B,CAAC;AAGlE,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,iBAAiB,CAAC,kBAAkB,CAgBpE,CAAC"}

package/lib/controls/TermSetNavigation/ErrorMessage/ErrorMessage.js

@@ -0,0 +1,16 @@
+import * as React from 'react';
+import { MessageBar, MessageBarType, } from '@fluentui/react/lib/MessageBar';
+import { Stack } from '@fluentui/react/lib/Stack';
+import { useErrorMessageStyles } from './useErrorMessageStyles';
+export var ErrorMessage = function (props) {
+    var showError = props.showError, errorMessage = props.errorMessage, children = props.children;
+    var messageErrorContainerStyles = useErrorMessageStyles().messageErrorContainerStyles;
+    if (!showError)
+        return null;
+    return (React.createElement(React.Fragment, null,
+        React.createElement(Stack, { verticalAlign: "center", tokens: { childrenGap: 10 }, styles: messageErrorContainerStyles },
+            React.createElement(MessageBar, { messageBarType: MessageBarType.error, isMultiline: true },
+                errorMessage,
+                children))));
+};
+//# sourceMappingURL=ErrorMessage.js.map

package/lib/controls/TermSetNavigation/ErrorMessage/ErrorMessage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ErrorMessage.js","sourceRoot":"","sources":["../../../../src/controls/TermSetNavigation/ErrorMessage/ErrorMessage.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EACL,UAAU,EACV,cAAc,GACf,MAAM,gCAAgC,CAAC;AACxC,OAAO,EAAE,KAAK,EAAE,MAAM,2BAA2B,CAAC;AAGlD,OAAO,EAAE,qBAAqB,EAAE,MAAM,yBAAyB,CAAC;AAEhE,MAAM,CAAC,IAAM,YAAY,GAAgD,UACvE,KAAkD;IAE1C,IAAA,SAAS,GAA6B,KAAK,UAAlC,EAAE,YAAY,GAAe,KAAK,aAApB,EAAE,QAAQ,GAAK,KAAK,SAAV,CAAW;IAC5C,IAAA,2BAA2B,GAAI,qBAAqB,EAAE,4BAA3B,CAA4B;IAC/D,IAAI,CAAC,SAAS;QAAE,OAAO,IAAI,CAAC;IAC5B,OAAO,CACL;QACE,oBAAC,KAAK,IAAC,aAAa,EAAC,QAAQ,EAAC,MAAM,EAAE,EAAE,WAAW,EAAE,EAAE,EAAE,EAAE,MAAM,EAAE,2BAA2B;YAC5F,oBAAC,UAAU,IAAC,cAAc,EAAE,cAAc,CAAC,KAAK,EAAE,WAAW,EAAE,IAAI;gBAChE,YAAY;gBACZ,QAAQ,CACE,CACP,CACP,CACJ,CAAC;AACJ,CAAC,CAAC"}

package/lib/controls/TermSetNavigation/ErrorMessage/useErrorMessageStyles.d.ts

@@ -0,0 +1,7 @@
+import { IStackStyles } from '@fluentui/react/lib/Stack';
+interface IErrorMessageStyles {
+    messageErrorContainerStyles: IStackStyles;
+}
+export declare const useErrorMessageStyles: () => IErrorMessageStyles;
+export {};
+//# sourceMappingURL=useErrorMessageStyles.d.ts.map

package/lib/controls/TermSetNavigation/ErrorMessage/useErrorMessageStyles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useErrorMessageStyles.d.ts","sourceRoot":"","sources":["../../../../src/controls/TermSetNavigation/ErrorMessage/useErrorMessageStyles.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;AAIzD,UAAU,mBAAmB;IAC3B,2BAA2B,EAAE,YAAY,CAAC;CAC3C;AAED,eAAO,MAAM,qBAAqB,QAAO,mBAYxC,CAAC"}

package/lib/controls/TermSetNavigation/ErrorMessage/useErrorMessageStyles.js

@@ -0,0 +1,16 @@
+import * as React from 'react';
+import { useAtom } from 'jotai';
+import { globalState } from '../atoms/globalState';
+export var useErrorMessageStyles = function () {
+    var appGlobalState = useAtom(globalState)[0];
+    var themeVariant = appGlobalState.themeVariant;
+    var messageErrorContainerStyles = React.useMemo(function () {
+        return {
+            root: {
+                width: '100%',
+            },
+        };
+    }, [themeVariant]);
+    return { messageErrorContainerStyles: messageErrorContainerStyles };
+};
+//# sourceMappingURL=useErrorMessageStyles.js.map

package/lib/controls/TermSetNavigation/ErrorMessage/useErrorMessageStyles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useErrorMessageStyles.js","sourceRoot":"","sources":["../../../../src/controls/TermSetNavigation/ErrorMessage/useErrorMessageStyles.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAIhC,OAAO,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AAMnD,MAAM,CAAC,IAAM,qBAAqB,GAAI;IAC7B,IAAA,cAAc,GAAI,OAAO,CAAC,WAAW,CAAC,GAAxB,CAAyB;IACtC,IAAA,YAAY,GAAK,cAAc,aAAnB,CAAoB;IACxC,IAAM,2BAA2B,GAAiB,KAAK,CAAC,OAAO,CAAC;QAC9D,OAAO;YACL,IAAI,EAAE;gBACL,KAAK,EAAC,MAAM;aACZ;SACF,CAAC;IACJ,CAAC,EAAE,CAAE,YAAY,CAAC,CAAC,CAAC;IAEpB,OAAO,EAAC,2BAA2B,6BAAA,EAAC,CAAA;AACtC,CAAC,CAAC"}

package/lib/controls/TermSetNavigation/INavigationProps.d.ts

@@ -0,0 +1,14 @@
+import { IContextualMenuItem } from '@fluentui/react';
+import { ITheme } from '@fluentui/react/lib/Styling';
+import { TermStore } from '@microsoft/microsoft-graph-types';
+import { BaseComponentContext, IReadonlyTheme } from '@microsoft/sp-component-base';
+export interface INavigationProps {
+    context: BaseComponentContext;
+    themeVariant: IReadonlyTheme | ITheme;
+    termSetId: string;
+    showContextMenu: boolean;
+    contextMenuItems?: IContextualMenuItem[];
+    onSelected?: (term: TermStore.Term) => void;
+    onSelectedTermAction?: (term: TermStore.Term, option: string) => void;
+}
+//# sourceMappingURL=INavigationProps.d.ts.map

package/lib/controls/TermSetNavigation/INavigationProps.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"INavigationProps.d.ts","sourceRoot":"","sources":["../../../src/controls/TermSetNavigation/INavigationProps.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,mBAAmB,EAAE,MAAM,iBAAiB,CAAC;AACtD,OAAO,EAAE,MAAM,EAAE,MAAM,6BAA6B,CAAC;AACrD,OAAO,EAAE,SAAS,EAAE,MAAM,kCAAkC,CAAC;AAC7D,OAAO,EACL,oBAAoB,EACpB,cAAc,EACf,MAAM,8BAA8B,CAAC;AAEtC,MAAM,WAAW,gBAAgB;IAC/B,OAAO,EAAE,oBAAoB,CAAC;IAC9B,YAAY,EAAC,cAAc,GAAG,MAAM,CAAC;IACrC,SAAS,EAAE,MAAM,CAAC;IAClB,eAAe,EAAE,OAAO,CAAC;IACzB,gBAAgB,CAAC,EAAE,mBAAmB,EAAE,CAAC;IACzC,UAAU,CAAC,EAAE,CAAC,IAAI,EAAE,SAAS,CAAC,IAAI,KAAK,IAAI,CAAC;IAC5C,oBAAoB,CAAC,EAAE,CAAC,IAAI,EAAG,SAAS,CAAC,IAAI,EAAE,MAAM,EAAC,MAAM,KAAK,IAAI,CAAC;CACvE"}

package/lib/controls/TermSetNavigation/INavigationProps.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=INavigationProps.js.map

package/lib/controls/TermSetNavigation/INavigationProps.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"INavigationProps.js","sourceRoot":"","sources":["../../../src/controls/TermSetNavigation/INavigationProps.ts"],"names":[],"mappings":""}

package/lib/controls/TermSetNavigation/Navigation.d.ts

@@ -0,0 +1,4 @@
+import * as React from 'react';
+import { INavigationProps } from './INavigationProps';
+export declare const Navigation: React.FunctionComponent<INavigationProps>;
+//# sourceMappingURL=Navigation.d.ts.map

package/lib/controls/TermSetNavigation/Navigation.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Navigation.d.ts","sourceRoot":"","sources":["../../../src/controls/TermSetNavigation/Navigation.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAsB/B,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AAOtD,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,iBAAiB,CAAC,gBAAgB,CAmIhE,CAAC"}

package/lib/controls/TermSetNavigation/Navigation.js

@@ -0,0 +1,199 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __generator = (this && this.__generator) || function (thisArg, body) {
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
+    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+    function verb(n) { return function (v) { return step([n, v]); }; }
+    function step(op) {
+        if (f) throw new TypeError("Generator is already executing.");
+        while (_) try {
+            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+            if (y = 0, t) op = [op[0] & 2, t.value];
+            switch (op[0]) {
+                case 0: case 1: t = op; break;
+                case 4: _.label++; return { value: op[1], done: false };
+                case 5: _.label++; y = op[1]; op = [0]; continue;
+                case 7: op = _.ops.pop(); _.trys.pop(); continue;
+                default:
+                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
+                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
+                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
+                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
+                    if (t[2]) _.ops.pop();
+                    _.trys.pop(); continue;
+            }
+            op = body.call(thisArg, _);
+        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
+        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
+    }
+};
+var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
+    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+        if (ar || !(i in from)) {
+            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+            ar[i] = from[i];
+        }
+    }
+    return to.concat(ar || Array.prototype.slice.call(from));
+};
+/* eslint-disable require-atomic-updates */
+/* eslint-disable @typescript-eslint/no-floating-promises */
+import * as React from 'react';
+import * as strings from 'ControlStrings';
+import { useAtom } from 'jotai';
+import { Nav, } from '@fluentui/react/lib/Nav';
+import { Separator } from '@fluentui/react/lib/Separator';
+import { Spinner } from '@fluentui/react/lib/Spinner';
+import { Stack } from '@fluentui/react/lib/Stack';
+import { Text } from '@fluentui/react/lib/Text';
+import { globalState } from './atoms/globalState';
+import { ErrorMessage } from './ErrorMessage/ErrorMessage';
+import { useGraphTaxonomyAPI } from './hooks/useGraphTaxonomyAPI';
+import { useSessionStorage } from './hooks/useSessionStorage';
+import { RenderLink } from './RenderLink';
+import { RenderNoOptions } from './RenderNoOptions';
+import { useNavigationStyles } from './useNavigationStyles';
+import { useTaxonomyUtils } from './utils/useTaxonomyUtils';
+import { useUtils } from './utils/useUtils';
+export var Navigation = function (props) {
+    var _a, _b;
+    var context = props.context, termSetId = props.termSetId;
+    var _c = useAtom(globalState), appGlobalState = _c[0], setAppGlobalState = _c[1];
+    var _d = appGlobalState || {}, isLoadingNavitionTree = _d.isLoadingNavitionTree, refreshNavigationTree = _d.refreshNavigationTree, showContextMenu = _d.showContextMenu, onSelected = _d.onSelected;
+    var navStyles = useNavigationStyles().navStyles;
+    var pageContext = (context || {}).pageContext;
+    var site = (pageContext || {}).site;
+    var _e = useGraphTaxonomyAPI(context), getTermSetChildren = _e.getTermSetChildren, getTermSet = _e.getTermSet;
+    var isLoadedTermSetsRef = React.useRef(false);
+    var createItems = useTaxonomyUtils(context).createItems;
+    var _f = React.useState([]), navLinksGroup = _f[0], setNavLinksGroup = _f[1];
+    var selectedItem = appGlobalState.selectedItem;
+    var navRef = React.useRef(null);
+    var getCacheKey = useUtils().getCacheKey;
+    var getSessionStorageItem = useSessionStorage()[0];
+    var _g = React.useState(null), termSetInfo = _g[0], setTermSetInfo = _g[1];
+    var _h = React.useState(null), error = _h[0], setError = _h[1];
+    var loadNavLinks = React.useCallback(function (refresh) { return __awaiter(void 0, void 0, void 0, function () {
+        var termSetChildren, navItems, navGroup;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
+                case 0:
+                    if (!site)
+                        return [2 /*return*/];
+                    setError(null);
+                    setAppGlobalState(function (state) { return (__assign(__assign({}, state), { isLoadingNavitionTree: true })); });
+                    isLoadedTermSetsRef.current = true;
+                    return [4 /*yield*/, getTermSetChildren(site === null || site === void 0 ? void 0 : site.id.toString(), termSetId, refresh)];
+                case 1:
+                    termSetChildren = _a.sent();
+                    return [4 /*yield*/, createItems(site === null || site === void 0 ? void 0 : site.id.toString(), termSetId, termSetChildren, 0, refresh)];
+                case 2:
+                    navItems = _a.sent();
+                    navGroup = { groupData: { termSet: termSetId }, links: navItems };
+                    setNavLinksGroup(function (state) { return __spreadArray(__spreadArray([], state, true), [navGroup], false); });
+                    setAppGlobalState(function (state) { return (__assign(__assign({}, state), { selectedItem: selectedItem !== null && selectedItem !== void 0 ? selectedItem : navItems[0], isLoadingNavitionTree: false, refreshNavigationTree: false })); });
+                    return [2 /*return*/];
+            }
+        });
+    }); }, [
+        selectedItem,
+        site,
+        getSessionStorageItem,
+        getCacheKey,
+        getTermSetChildren,
+        createItems,
+        setAppGlobalState,
+        termSetId,
+    ]);
+    React.useEffect(function () {
+        (function () { return __awaiter(void 0, void 0, void 0, function () {
+            var termSetInfo_1, error_1;
+            return __generator(this, function (_a) {
+                switch (_a.label) {
+                    case 0:
+                        _a.trys.push([0, 4, 5, 6]);
+                        if (!!isLoadedTermSetsRef.current) return [3 /*break*/, 3];
+                        return [4 /*yield*/, getTermSet(site === null || site === void 0 ? void 0 : site.id.toString(), termSetId)];
+                    case 1:
+                        termSetInfo_1 = _a.sent();
+                        setTermSetInfo(termSetInfo_1);
+                        return [4 /*yield*/, loadNavLinks(false)];
+                    case 2:
+                        _a.sent();
+                        isLoadedTermSetsRef.current = true;
+                        _a.label = 3;
+                    case 3: return [3 /*break*/, 6];
+                    case 4:
+                        error_1 = _a.sent();
+                        setError(error_1);
+                        return [3 /*break*/, 6];
+                    case 5:
+                        setAppGlobalState(function (state) { return (__assign(__assign({}, state), { isLoadingNavitionTree: false })); });
+                        return [7 /*endfinally*/];
+                    case 6: return [2 /*return*/];
+                }
+            });
+        }); })();
+    }, []);
+    React.useEffect(function () {
+        (function () { return __awaiter(void 0, void 0, void 0, function () {
+            return __generator(this, function (_a) {
+                switch (_a.label) {
+                    case 0:
+                        if (!refreshNavigationTree) return [3 /*break*/, 2];
+                        setNavLinksGroup([]);
+                        return [4 /*yield*/, loadNavLinks(refreshNavigationTree)];
+                    case 1:
+                        _a.sent();
+                        _a.label = 2;
+                    case 2: return [2 /*return*/];
+                }
+            });
+        }); })();
+    }, [refreshNavigationTree]);
+    var onRenderLink = React.useCallback(function (link) {
+        return React.createElement(RenderLink, { link: link, showContextMenu: showContextMenu });
+    }, [showContextMenu]);
+    var onLinkClick = React.useCallback(function (ev, item) {
+        ev.preventDefault();
+        setAppGlobalState(function (state) { return (__assign(__assign({}, state), { selectedItem: item })); });
+        if (onSelected) {
+            onSelected(item.data);
+        }
+    }, [selectedItem, setAppGlobalState]);
+    var hasLinks = React.useMemo(function () {
+        var _a, _b;
+        return ((_b = (_a = navLinksGroup[0]) === null || _a === void 0 ? void 0 : _a.links) === null || _b === void 0 ? void 0 : _b.length) > 0;
+    }, [navLinksGroup]);
+    var hasError = React.useMemo(function () {
+        return error !== null || termSetInfo === null;
+    }, [error, termSetInfo]);
+    if (isLoadingNavitionTree)
+        return React.createElement(Spinner, { ariaLive: "assertive" });
+    if (hasError)
+        return (React.createElement(ErrorMessage, { showError: hasError, errorMessage: (_a = error === null || error === void 0 ? void 0 : error.message) !== null && _a !== void 0 ? _a : strings.TermSertNaviagtionErrorMessage }));
+    return (React.createElement(React.Fragment, null,
+        React.createElement(Stack, { horizontalAlign: "stretch", tokens: { childrenGap: 0 } },
+            React.createElement(Text, { variant: "large" }, (_b = termSetInfo === null || termSetInfo === void 0 ? void 0 : termSetInfo.localizedNames[0].name) !== null && _b !== void 0 ? _b : ""),
+            React.createElement(Separator, null),
+            hasLinks ? (React.createElement(Nav, { componentRef: navRef, ariaLabel: "navigation", styles: navStyles, groups: navLinksGroup, onRenderLink: onRenderLink, selectedKey: selectedItem === null || selectedItem === void 0 ? void 0 : selectedItem.key, onLinkClick: onLinkClick })) : (React.createElement(RenderNoOptions, null)))));
+};
+//# sourceMappingURL=Navigation.js.map

package/lib/controls/TermSetNavigation/Navigation.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Navigation.js","sourceRoot":"","sources":["../../../src/controls/TermSetNavigation/Navigation.tsx"],"names":[],"mappings":"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"}

package/lib/controls/TermSetNavigation/NavigationContextMenu.d.ts

@@ -0,0 +1,5 @@
+import * as React from 'react';
+export interface INavigationContextMenuProps {
+}
+export declare const NavigationContextMenu: React.FunctionComponent<INavigationContextMenuProps>;
+//# sourceMappingURL=NavigationContextMenu.d.ts.map

package/lib/controls/TermSetNavigation/NavigationContextMenu.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"NavigationContextMenu.d.ts","sourceRoot":"","sources":["../../../src/controls/TermSetNavigation/NavigationContextMenu.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAU/B,MAAM,WAAW,2BAA2B;CAAG;AAE/C,eAAO,MAAM,qBAAqB,EAAE,KAAK,CAAC,iBAAiB,CAAC,2BAA2B,CA2BtF,CAAC"}

package/lib/controls/TermSetNavigation/NavigationContextMenu.js

@@ -0,0 +1,22 @@
+import * as React from 'react';
+import { useAtom } from 'jotai';
+import { IconButton } from '@fluentui/react/lib/Button';
+import { globalState } from './atoms/globalState';
+export var NavigationContextMenu = function (props) {
+    var moreVerticaliIcon = { iconName: "MoreVertical" };
+    var appGlobalState = useAtom(globalState)[0];
+    var contextMenuItems = appGlobalState.contextMenuItems, onSelectedTermAction = appGlobalState.onSelectedTermAction, selectedItem = appGlobalState.selectedItem;
+    var menuProps = React.useMemo(function () {
+        return {
+            items: contextMenuItems.length ? contextMenuItems : [],
+            directionalHintFixed: true,
+            onItemClick: function (ev, item) {
+                ev.preventDefault();
+                onSelectedTermAction(selectedItem.data, item.text);
+            },
+        };
+    }, [contextMenuItems]);
+    return (React.createElement(React.Fragment, null,
+        React.createElement(IconButton, { menuProps: menuProps, iconProps: moreVerticaliIcon, ariaLabel: "Menu", styles: { menuIcon: { display: "none" } } })));
+};
+//# sourceMappingURL=NavigationContextMenu.js.map

package/lib/controls/TermSetNavigation/NavigationContextMenu.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"NavigationContextMenu.js","sourceRoot":"","sources":["../../../src/controls/TermSetNavigation/NavigationContextMenu.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAEhC,OAAO,EAAE,UAAU,EAAE,MAAM,4BAA4B,CAAC;AAIxD,OAAO,EAAE,WAAW,EAAE,MAAM,qBAAqB,CAAC;AAIlD,MAAM,CAAC,IAAM,qBAAqB,GAAyD,UACzF,KAA2D;IAE3D,IAAM,iBAAiB,GAAe,EAAE,QAAQ,EAAE,cAAc,EAAE,CAAC;IAC5D,IAAA,cAAc,GAAI,OAAO,CAAC,WAAW,CAAC,GAAxB,CAAyB;IACtC,IAAA,gBAAgB,GAAyC,cAAc,iBAAvD,EAAE,oBAAoB,GAAmB,cAAc,qBAAjC,EAAE,YAAY,GAAK,cAAc,aAAnB,CAAoB;IAChF,IAAM,SAAS,GAAyB,KAAK,CAAC,OAAO,CAAC;QACpD,OAAO;YACL,KAAK,EAAE,gBAAgB,CAAC,MAAM,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,EAAE;YACtD,oBAAoB,EAAE,IAAI;YAC1B,WAAW,EAAE,UAAC,EAAE,EAAE,IAAI;gBACpB,EAAE,CAAC,cAAc,EAAE,CAAC;gBACpB,oBAAoB,CAAC,YAAY,CAAC,IAAI,EAAE,IAAI,CAAC,IAAI,CAAC,CAAC;YACrD,CAAC;SACF,CAAC;IACJ,CAAC,EAAE,CAAC,gBAAgB,CAAC,CAAC,CAAC;IAEvB,OAAO,CACL;QACE,oBAAC,UAAU,IACT,SAAS,EAAE,SAAS,EACpB,SAAS,EAAE,iBAAiB,EAC5B,SAAS,EAAC,MAAM,EAChB,MAAM,EAAE,EAAE,QAAQ,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,EAAE,GACzC,CACD,CACJ,CAAC;AACJ,CAAC,CAAC"}

package/lib/controls/TermSetNavigation/RenderGroupHeader.d.ts

@@ -0,0 +1,4 @@
+import * as React from 'react';
+import { IRenderGroupHeaderProps } from '@fluentui/react';
+export declare const RenderGroupHeader: React.FunctionComponent<IRenderGroupHeaderProps>;
+//# sourceMappingURL=RenderGroupHeader.d.ts.map

package/lib/controls/TermSetNavigation/RenderGroupHeader.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"RenderGroupHeader.d.ts","sourceRoot":"","sources":["../../../src/controls/TermSetNavigation/RenderGroupHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAEL,uBAAuB,EAExB,MAAM,iBAAiB,CAAC;AAIzB,eAAO,MAAM,iBAAiB,EAAE,KAAK,CAAC,iBAAiB,CAAC,uBAAuB,CAoB9E,CAAC"}

package/lib/controls/TermSetNavigation/RenderGroupHeader.js

@@ -0,0 +1,14 @@
+import * as React from 'react';
+import { FontIcon, Text, } from '@fluentui/react';
+import { useNavigationStyles } from './useNavigationStyles';
+export var RenderGroupHeader = function (group) {
+    var textGroupLinkStyles = useNavigationStyles().textGroupLinkStyles;
+    return (React.createElement(React.Fragment, null,
+        React.createElement(FontIcon, { iconName: group.isExpanded ? "ChevronRight" : "ChevronDown", style: { fontSize: 16 }, onClick: function (ev) {
+                ev.preventDefault();
+                group.onHeaderClick(ev);
+            } }),
+        React.createElement(FontIcon, { iconName: "CustomList", style: { fontSize: 16 } }),
+        React.createElement(Text, { styles: textGroupLinkStyles(group.groupData.termSet), variant: "large" }, group.name)));
+};
+//# sourceMappingURL=RenderGroupHeader.js.map

package/lib/controls/TermSetNavigation/RenderGroupHeader.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RenderGroupHeader.js","sourceRoot":"","sources":["../../../src/controls/TermSetNavigation/RenderGroupHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EACL,QAAQ,EAER,IAAI,GACL,MAAM,iBAAiB,CAAC;AAEzB,OAAO,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AAE5D,MAAM,CAAC,IAAM,iBAAiB,GAAqD,UACjF,KAAuD;IAE/C,IAAA,mBAAmB,GAAK,mBAAmB,EAAE,oBAA1B,CAA2B;IACtD,OAAO,CACL;QACE,oBAAC,QAAQ,IACP,QAAQ,EAAE,KAAK,CAAC,UAAU,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,aAAa,EAC3D,KAAK,EAAE,EAAE,QAAQ,EAAE,EAAE,EAAE,EACvB,OAAO,EAAE,UAAC,EAAE;gBACV,EAAE,CAAC,cAAc,EAAE,CAAC;gBACpB,KAAK,CAAC,aAAa,CAAC,EAAE,CAAC,CAAC;YAC1B,CAAC,GACD;QACF,oBAAC,QAAQ,IAAC,QAAQ,EAAC,YAAY,EAAC,KAAK,EAAE,EAAE,QAAQ,EAAE,EAAE,EAAE,GAAI;QAC3D,oBAAC,IAAI,IAAC,MAAM,EAAE,mBAAmB,CAAC,KAAK,CAAC,SAAS,CAAC,OAAO,CAAC,EAAE,OAAO,EAAC,OAAO,IACxE,KAAK,CAAC,IAAI,CACN,CACN,CACJ,CAAC;AACJ,CAAC,CAAC"}

package/lib/controls/TermSetNavigation/RenderLink.d.ts

@@ -0,0 +1,8 @@
+import * as React from 'react';
+import { INavLink } from '@fluentui/react';
+export interface IRenderLinkProps {
+    link: INavLink;
+    showContextMenu?: boolean;
+}
+export declare const RenderLink: React.FunctionComponent<IRenderLinkProps>;
+//# sourceMappingURL=RenderLink.d.ts.map

package/lib/controls/TermSetNavigation/RenderLink.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"RenderLink.d.ts","sourceRoot":"","sources":["../../../src/controls/TermSetNavigation/RenderLink.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,EAEL,QAAQ,EAGT,MAAM,iBAAiB,CAAC;AAUzB,MAAM,WAAW,gBAAgB;IAC/B,IAAI,EAAE,QAAQ,CAAC;IACf,eAAe,CAAC,EAAE,OAAO,CAAC;CAE3B;AAED,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,iBAAiB,CAAC,gBAAgB,CAgDhE,CAAC"}

package/lib/controls/TermSetNavigation/RenderLink.js

@@ -0,0 +1,32 @@
+import * as React from 'react';
+import { useAtom } from 'jotai';
+import { FontIcon, Stack, Text, } from '@fluentui/react';
+import { Tag16Regular, TagMultiple16Regular, } from '@fluentui/react-icons';
+import { globalState } from './atoms/globalState';
+import { NavigationContextMenu } from './NavigationContextMenu';
+import { useNavigationStyles } from './useNavigationStyles';
+export var RenderLink = function (props) {
+    var link = props.link, showContextMenu = props.showContextMenu;
+    var _a = useNavigationStyles(), controlStyles = _a.controlStyles, textNavLinkStyles = _a.textNavLinkStyles;
+    var appGlobalState = useAtom(globalState)[0];
+    var selectedItem = appGlobalState.selectedItem, contextMenuItems = appGlobalState.contextMenuItems;
+    var hasChildren = React.useMemo(function () { return link === null || link === void 0 ? void 0 : link.links.length; }, [link]);
+    var onClick = React.useCallback(function (ev) {
+        ev.preventDefault();
+        link.isExpanded = !link.isExpanded;
+    }, [link]);
+    var showContext = React.useMemo(function () {
+        return showContextMenu && (selectedItem === null || selectedItem === void 0 ? void 0 : selectedItem.key) === link.key && contextMenuItems && contextMenuItems.length;
+    }, [showContextMenu, selectedItem, contextMenuItems]);
+    return (React.createElement(React.Fragment, null,
+        React.createElement("div", { className: controlStyles.navlink },
+            hasChildren ? (React.createElement(React.Fragment, null,
+                React.createElement(FontIcon, { iconName: link.isExpanded ? "ChevronRight" : "ChevronDown", style: { fontSize: 16, }, onClick: onClick }),
+                React.createElement(TagMultiple16Regular, null))) : (React.createElement(React.Fragment, null,
+                React.createElement("div", { style: { height: 16 } }),
+                React.createElement(Tag16Regular, null))),
+            React.createElement(Stack, { horizontal: true, horizontalAlign: "space-between", verticalAlign: "center" },
+                React.createElement(Text, { variant: "medium", styles: textNavLinkStyles(link) }, link.name),
+                showContext && React.createElement(NavigationContextMenu, null)))));
+};
+//# sourceMappingURL=RenderLink.js.map

package/lib/controls/TermSetNavigation/RenderLink.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RenderLink.js","sourceRoot":"","sources":["../../../src/controls/TermSetNavigation/RenderLink.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAEhC,OAAO,EACL,QAAQ,EAER,KAAK,EACL,IAAI,GACL,MAAM,iBAAiB,CAAC;AACzB,OAAO,EACL,YAAY,EACZ,oBAAoB,GACrB,MAAM,uBAAuB,CAAC;AAE/B,OAAO,EAAE,WAAW,EAAE,MAAM,qBAAqB,CAAC;AAClD,OAAO,EAAE,qBAAqB,EAAE,MAAM,yBAAyB,CAAC;AAChE,OAAO,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AAQ5D,MAAM,CAAC,IAAM,UAAU,GAA8C,UACnE,KAAgD;IAExC,IAAA,IAAI,GAAuB,KAAK,KAA5B,EAAE,eAAe,GAAM,KAAK,gBAAX,CAAY;IACnC,IAAA,KAAuC,mBAAmB,EAAE,EAA1D,aAAa,mBAAA,EAAE,iBAAiB,uBAA0B,CAAC;IAC5D,IAAA,cAAc,GAAI,OAAO,CAAC,WAAW,CAAC,GAAxB,CAAyB;IACtC,IAAA,YAAY,GAAwB,cAAc,aAAtC,EAAG,gBAAgB,GAAK,cAAc,iBAAnB,CAAoB;IAC3D,IAAM,WAAW,GAAG,KAAK,CAAC,OAAO,CAAC,cAAM,OAAA,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,KAAK,CAAC,MAAM,EAAlB,CAAkB,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC;IAEpE,IAAM,OAAO,GAAG,KAAK,CAAC,WAAW,CAC/B,UAAC,EAAiC;QAChC,EAAE,CAAC,cAAc,EAAE,CAAC;QACpB,IAAI,CAAC,UAAU,GAAG,CAAC,IAAI,CAAC,UAAU,CAAC;IACrC,CAAC,EACD,CAAC,IAAI,CAAC,CACP,CAAC;IAEF,IAAM,WAAW,GAAG,KAAK,CAAC,OAAO,CAAC;QAChC,OAAO,eAAe,IAAI,CAAA,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,GAAG,MAAK,IAAI,CAAC,GAAG,IAAI,gBAAgB,IAAI,gBAAgB,CAAC,MAAM,CAAC;IAC1G,CAAC,EAAE,CAAE,eAAe,EAAE,YAAY,EAAE,gBAAgB,CAAC,CAAC,CAAC;IAEvD,OAAO,CACL;QACE,6BAAK,SAAS,EAAE,aAAa,CAAC,OAAO;YAClC,WAAW,CAAC,CAAC,CAAC,CACb;gBACE,oBAAC,QAAQ,IACP,QAAQ,EAAE,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,aAAa,EAC1D,KAAK,EAAE,EAAE,QAAQ,EAAE,EAAE,GAAI,EACzB,OAAO,EAAE,OAAO,GAChB;gBACF,oBAAC,oBAAoB,OAAI,CACxB,CACJ,CAAC,CAAC,CAAC,CACF;gBACE,6BAAK,KAAK,EAAE,EAAC,MAAM,EAAE,EAAE,EAAE,GAAI;gBAC9B,oBAAC,YAAY,OAAG,CACd,CACJ;YACD,oBAAC,KAAK,IAAC,UAAU,QAAC,eAAe,EAAC,eAAe,EAAC,aAAa,EAAC,QAAQ;gBACtE,oBAAC,IAAI,IAAC,OAAO,EAAC,QAAQ,EAAC,MAAM,EAAE,iBAAiB,CAAC,IAAI,CAAC,IACnD,IAAI,CAAC,IAAI,CACL;gBACN,WAAW,IAAI,oBAAC,qBAAqB,OAAG,CACnC,CACJ,CACL,CACJ,CAAC;AACJ,CAAC,CAAC"}

package/lib/controls/TermSetNavigation/RenderNoOptions.d.ts

@@ -0,0 +1,5 @@
+import * as React from 'react';
+export interface IRenderNoOptionsProps {
+}
+export declare const RenderNoOptions: React.FunctionComponent<IRenderNoOptionsProps>;
+//# sourceMappingURL=RenderNoOptions.d.ts.map

package/lib/controls/TermSetNavigation/RenderNoOptions.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"RenderNoOptions.d.ts","sourceRoot":"","sources":["../../../src/controls/TermSetNavigation/RenderNoOptions.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAU/B,MAAM,WAAW,qBAAqB;CAAG;AAEzC,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,iBAAiB,CAAC,qBAAqB,CAa1E,CAAC"}

package/lib/controls/TermSetNavigation/RenderNoOptions.js

@@ -0,0 +1,11 @@
+import * as React from 'react';
+import * as strings from 'ControlStrings';
+import { Image, Stack, Text, } from '@fluentui/react';
+export var RenderNoOptions = function (props) {
+    return (React.createElement(React.Fragment, null,
+        React.createElement(Stack, { tokens: { childrenGap: 10 }, verticalFill: true, verticalAlign: "start", horizontalAlign: "center" },
+            React.createElement(Image, { src: require("./assets/menu-rafiki.svg"), width: 210, height: 210 }),
+            React.createElement(Stack, { tokens: { childrenGap: 5 }, horizontalAlign: "center" },
+                React.createElement(Text, { variant: "large" }, strings.TermSetNavigationNoTerms)))));
+};
+//# sourceMappingURL=RenderNoOptions.js.map

package/lib/controls/TermSetNavigation/RenderNoOptions.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RenderNoOptions.js","sourceRoot":"","sources":["../../../src/controls/TermSetNavigation/RenderNoOptions.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,KAAK,OAAO,MAAM,gBAAgB,CAAC;AAE1C,OAAO,EACL,KAAK,EACL,KAAK,EACL,IAAI,GACL,MAAM,iBAAiB,CAAC;AAIzB,MAAM,CAAC,IAAM,eAAe,GAAmD,UAC7E,KAAqD;IAErD,OAAO,CACL;QACE,oBAAC,KAAK,IAAC,MAAM,EAAE,EAAE,WAAW,EAAE,EAAE,EAAE,EAAE,YAAY,QAAC,aAAa,EAAC,OAAO,EAAC,eAAe,EAAC,QAAQ;YAC7F,oBAAC,KAAK,IAAC,GAAG,EAAE,OAAO,CAAC,0BAA0B,CAAC,EAAE,KAAK,EAAE,GAAG,EAAE,MAAM,EAAE,GAAG,GAAI;YAC5E,oBAAC,KAAK,IAAC,MAAM,EAAE,EAAE,WAAW,EAAE,CAAC,EAAE,EAAE,eAAe,EAAE,QAAQ;gBAC1D,oBAAC,IAAI,IAAC,OAAO,EAAC,OAAO,IAAE,OAAO,CAAC,wBAAwB,CAAQ,CACzD,CACF,CACP,CACJ,CAAC;AACJ,CAAC,CAAC"}

package/lib/controls/TermSetNavigation/TermSetNavigation.d.ts

@@ -0,0 +1,4 @@
+import * as React from 'react';
+import { INavigationProps } from './INavigationProps';
+export declare const TermSetNavigation: React.FunctionComponent<INavigationProps>;
+//# sourceMappingURL=TermSetNavigation.d.ts.map

package/lib/controls/TermSetNavigation/TermSetNavigation.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TermSetNavigation.d.ts","sourceRoot":"","sources":["../../../src/controls/TermSetNavigation/TermSetNavigation.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAM/B,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AAGtD,eAAO,MAAM,iBAAiB,EAAE,KAAK,CAAC,iBAAiB,CAAC,gBAAgB,CAmBvE,CAAC"}

package/lib/controls/TermSetNavigation/TermSetNavigation.js

@@ -0,0 +1,29 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import * as React from 'react';
+import { useAtom } from 'jotai';
+import { EnhancedThemeProvider } from '../enhancedThemeProvider';
+import { globalState } from './atoms/globalState';
+import { Navigation } from './Navigation';
+export var TermSetNavigation = function (props) {
+    var themeVariant = props.themeVariant, context = props.context;
+    var _a = useAtom(globalState), setAppGlobalState = _a[1];
+    React.useEffect(function () {
+        setAppGlobalState(function (state) { return (__assign(__assign({}, state), props)); });
+    }, [props]);
+    if (!context || !themeVariant)
+        return null;
+    return (React.createElement(React.Fragment, null,
+        React.createElement(EnhancedThemeProvider, { theme: themeVariant, context: context },
+            React.createElement(Navigation, __assign({}, props)))));
+};
+//# sourceMappingURL=TermSetNavigation.js.map

package/lib/controls/TermSetNavigation/TermSetNavigation.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TermSetNavigation.js","sourceRoot":"","sources":["../../../src/controls/TermSetNavigation/TermSetNavigation.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAEhC,OAAO,EAAE,qBAAqB,EAAE,MAAM,0BAA0B,CAAC;AACjE,OAAO,EAAE,WAAW,EAAE,MAAM,qBAAqB,CAAC;AAElD,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAE1C,MAAM,CAAC,IAAM,iBAAiB,GAA8C,UAC1E,KAAgD;IAExC,IAAA,YAAY,GAAc,KAAK,aAAnB,EAAE,OAAO,GAAK,KAAK,QAAV,CAAW;IAClC,IAAA,KAAwB,OAAO,CAAC,WAAW,CAAC,EAAzC,iBAAiB,QAAwB,CAAC;IAEnD,KAAK,CAAC,SAAS,CAAC;QACd,iBAAiB,CAAC,UAAC,KAAK,IAAK,OAAA,uBAAM,KAAK,GAAK,KAAK,EAAG,EAAxB,CAAwB,CAAC,CAAC;IACzD,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC;IAEZ,IAAI,CAAC,OAAO,IAAI,CAAC,YAAY;QAAK,OAAO,IAAI,CAAC;IAE9C,OAAO,CACL;QACE,oBAAC,qBAAqB,IAAC,KAAK,EAAE,YAAY,EAAE,OAAO,EAAE,OAAO;YAC1D,oBAAC,UAAU,eAAK,KAAK,EAAI,CACH,CACvB,CACJ,CAAC;AACJ,CAAC,CAAC"}

package/lib/controls/TermSetNavigation/atoms/globalState.d.ts

@@ -0,0 +1,5 @@
+import { IGlobalState } from '../models/IGlobalState';
+export declare const globalState: import("jotai").PrimitiveAtom<IGlobalState> & {
+    init: IGlobalState;
+};
+//# sourceMappingURL=globalState.d.ts.map

package/lib/controls/TermSetNavigation/atoms/globalState.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"globalState.d.ts","sourceRoot":"","sources":["../../../../src/controls/TermSetNavigation/atoms/globalState.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,YAAY,EAAE,MAAM,wBAAwB,CAAC;AAEtD,eAAO,MAAM,WAAW;;CAGN,CAAC"}

package/lib/controls/TermSetNavigation/atoms/globalState.js

@@ -0,0 +1,5 @@
+import { atom } from 'jotai';
+export var globalState = atom({
+    isLoadingNavitionTree: true,
+});
+//# sourceMappingURL=globalState.js.map

package/lib/controls/TermSetNavigation/atoms/globalState.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"globalState.js","sourceRoot":"","sources":["../../../../src/controls/TermSetNavigation/atoms/globalState.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,OAAO,CAAC;AAI7B,MAAM,CAAC,IAAM,WAAW,GAAG,IAAI,CAAe;IAE5C,qBAAqB,EAAC,IAAI;CACX,CAAC,CAAC"}