@ynput/ayon-frontend-shared 0.2.20 → 0.2.22

package/dist/shared/src/{components → containers}/Views/ViewItem/ViewItem.styled.cjs.js

@@ -5,6 +5,7 @@ const styled = require("styled-components");
 const ViewItem = styled.li`
   position: relative;
   padding: 4px 6px 4px 12px;
+  user-select: none;
 
   &:has(.start-icon) {
     padding-left: 8px;
@@ -28,36 +29,49 @@ const ViewItem = styled.li`
   }
 
   &.selected {
-    background-color: var(--md-sys-color-primary);
+    background-color: var(--md-sys-color-primary-container);
     &,
     .icon {
-      color: var(--md-sys-color-on-primary);
+      color: var(--md-sys-color-on-primary-container);
     }
 
     .more {
       &:hover {
-        background-color: var(--md-sys-color-primary-hover);
+        background-color: var(--md-sys-color-primary-container-hover);
       }
     }
+  }
 
-    /* personal view item uses secondary colors */
-    &.personal {
-      background-color: var(--md-sys-color-secondary-container);
-      &,
-      .icon {
-        color: var(--md-sys-color-on-secondary-container);
-      }
+  /* hide save button by default */
+  .save,
+  .reset {
+    display: none;
+  }
+  &:hover {
+    .save,
+    .reset {
+      display: flex;
     }
   }
 `;
-const MoreButton = styled(ayonReactComponents.Button)`
+const ActionButton = styled(ayonReactComponents.Button)`
   &.hasIcon {
     padding: 2px;
   }
   &:hover {
     background-color: var(--md-sys-color-surface-container-highest-hover);
   }
+  &.active {
+    background-color: var(--md-sys-color-primary);
+    color: var(--md-sys-color-on-primary);
+
+    display: flex !important;
+
+    &:hover {
+      background-color: var(--md-sys-color-primary-hover);
+    }
+  }
 `;
-exports.MoreButton = MoreButton;
+exports.ActionButton = ActionButton;
 exports.ViewItem = ViewItem;
 //# sourceMappingURL=ViewItem.styled.cjs.js.map

package/dist/shared/src/containers/Views/ViewItem/ViewItem.styled.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ViewItem.styled.cjs.js","sources":["../../../../../../src/containers/Views/ViewItem/ViewItem.styled.ts"],"sourcesContent":["import { Button } from '@ynput/ayon-react-components'\nimport styled from 'styled-components'\n\nexport const ViewItem = styled.li`\n  position: relative;\n  padding: 4px 6px 4px 12px;\n  user-select: none;\n\n  &:has(.start-icon) {\n    padding-left: 8px;\n  }\n\n  height: 32px;\n  border-radius: var(--border-radius-m);\n\n  display: flex;\n  align-items: center;\n  gap: var(--base-gap-small);\n\n  cursor: pointer;\n\n  .label {\n    flex: 1;\n  }\n\n  &:hover {\n    background-color: var(--md-sys-color-surface-container-high-hover);\n  }\n\n  &.selected {\n    background-color: var(--md-sys-color-primary-container);\n    &,\n    .icon {\n      color: var(--md-sys-color-on-primary-container);\n    }\n\n    .more {\n      &:hover {\n        background-color: var(--md-sys-color-primary-container-hover);\n      }\n    }\n  }\n\n  /* hide save button by default */\n  .save,\n  .reset {\n    display: none;\n  }\n  &:hover {\n    .save,\n    .reset {\n      display: flex;\n    }\n  }\n`\n\nexport const ActionButton = styled(Button)`\n  &.hasIcon {\n    padding: 2px;\n  }\n  &:hover {\n    background-color: var(--md-sys-color-surface-container-highest-hover);\n  }\n  &.active {\n    background-color: var(--md-sys-color-primary);\n    color: var(--md-sys-color-on-primary);\n\n    display: flex !important;\n\n    &:hover {\n      background-color: var(--md-sys-color-primary-hover);\n    }\n  }\n`\n"],"names":["Button"],"mappings":";;;;AAGO,MAAM,WAAW,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAqDlB,MAAA,eAAe,OAAOA,0BAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;"}

package/dist/shared/src/{components → containers}/Views/ViewItem/ViewItem.styled.es.js

@@ -3,6 +3,7 @@ import styled from "styled-components";
 const ViewItem = styled.li`
   position: relative;
   padding: 4px 6px 4px 12px;
+  user-select: none;
 
   &:has(.start-icon) {
     padding-left: 8px;
@@ -26,38 +27,51 @@ const ViewItem = styled.li`
   }
 
   &.selected {
-    background-color: var(--md-sys-color-primary);
+    background-color: var(--md-sys-color-primary-container);
     &,
     .icon {
-      color: var(--md-sys-color-on-primary);
+      color: var(--md-sys-color-on-primary-container);
     }
 
     .more {
       &:hover {
-        background-color: var(--md-sys-color-primary-hover);
+        background-color: var(--md-sys-color-primary-container-hover);
       }
     }
+  }
 
-    /* personal view item uses secondary colors */
-    &.personal {
-      background-color: var(--md-sys-color-secondary-container);
-      &,
-      .icon {
-        color: var(--md-sys-color-on-secondary-container);
-      }
+  /* hide save button by default */
+  .save,
+  .reset {
+    display: none;
+  }
+  &:hover {
+    .save,
+    .reset {
+      display: flex;
     }
   }
 `;
-const MoreButton = styled(Button)`
+const ActionButton = styled(Button)`
   &.hasIcon {
     padding: 2px;
   }
   &:hover {
     background-color: var(--md-sys-color-surface-container-highest-hover);
   }
+  &.active {
+    background-color: var(--md-sys-color-primary);
+    color: var(--md-sys-color-on-primary);
+
+    display: flex !important;
+
+    &:hover {
+      background-color: var(--md-sys-color-primary-hover);
+    }
+  }
 `;
 export {
-  MoreButton,
+  ActionButton,
   ViewItem
 };
 //# sourceMappingURL=ViewItem.styled.es.js.map

package/dist/shared/src/containers/Views/ViewItem/ViewItem.styled.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ViewItem.styled.es.js","sources":["../../../../../../src/containers/Views/ViewItem/ViewItem.styled.ts"],"sourcesContent":["import { Button } from '@ynput/ayon-react-components'\nimport styled from 'styled-components'\n\nexport const ViewItem = styled.li`\n  position: relative;\n  padding: 4px 6px 4px 12px;\n  user-select: none;\n\n  &:has(.start-icon) {\n    padding-left: 8px;\n  }\n\n  height: 32px;\n  border-radius: var(--border-radius-m);\n\n  display: flex;\n  align-items: center;\n  gap: var(--base-gap-small);\n\n  cursor: pointer;\n\n  .label {\n    flex: 1;\n  }\n\n  &:hover {\n    background-color: var(--md-sys-color-surface-container-high-hover);\n  }\n\n  &.selected {\n    background-color: var(--md-sys-color-primary-container);\n    &,\n    .icon {\n      color: var(--md-sys-color-on-primary-container);\n    }\n\n    .more {\n      &:hover {\n        background-color: var(--md-sys-color-primary-container-hover);\n      }\n    }\n  }\n\n  /* hide save button by default */\n  .save,\n  .reset {\n    display: none;\n  }\n  &:hover {\n    .save,\n    .reset {\n      display: flex;\n    }\n  }\n`\n\nexport const ActionButton = styled(Button)`\n  &.hasIcon {\n    padding: 2px;\n  }\n  &:hover {\n    background-color: var(--md-sys-color-surface-container-highest-hover);\n  }\n  &.active {\n    background-color: var(--md-sys-color-primary);\n    color: var(--md-sys-color-on-primary);\n\n    display: flex !important;\n\n    &:hover {\n      background-color: var(--md-sys-color-primary-hover);\n    }\n  }\n`\n"],"names":[],"mappings":";;AAGO,MAAM,WAAW,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAqDlB,MAAA,eAAe,OAAO,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;"}

package/dist/shared/src/{components → containers}/Views/Views.cjs.js

@@ -1,21 +1,17 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("../../../../_virtual/jsx-runtime.cjs.js");
-const ViewsContext = require("./context/ViewsContext.cjs.js");
 const ViewsButton = require("./ViewsButton/ViewsButton.cjs.js");
 const ViewsMenuContainer = require("./ViewsMenuContainer/ViewsMenuContainer.cjs.js");
-const Views = ({ viewType, projectName }) => {
-  return /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsxs(ViewsContext.ViewsProvider, { viewType, projectName, children: [
-    /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(ViewsButton.ViewsButton, {}),
-    /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(ViewsMenuContainer.ViewsMenuContainer, {})
-  ] });
-};
-const ViewsComponents = () => {
+const ViewsDialogContainer = require("./ViewsDialogContainer/ViewsDialogContainer.cjs.js");
+const useViewsShortcuts = require("./hooks/useViewsShortcuts.cjs.js");
+const Views = () => {
+  useViewsShortcuts.useViewsShortcuts();
   return /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsxs(jsxRuntime.jsxRuntimeExports.Fragment, { children: [
     /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(ViewsButton.ViewsButton, {}),
-    /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(ViewsMenuContainer.ViewsMenuContainer, {})
+    /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(ViewsMenuContainer.ViewsMenuContainer, {}),
+    /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(ViewsDialogContainer.default, {})
   ] });
 };
 exports.Views = Views;
-exports.ViewsComponents = ViewsComponents;
 //# sourceMappingURL=Views.cjs.js.map

package/dist/shared/src/containers/Views/Views.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Views.cjs.js","sources":["../../../../../src/containers/Views/Views.tsx"],"sourcesContent":["import { FC } from 'react'\nimport { ViewsButton } from './ViewsButton/ViewsButton'\nimport { ViewsMenuContainer } from './ViewsMenuContainer/ViewsMenuContainer'\nimport ViewsDialogContainer from './ViewsDialogContainer/ViewsDialogContainer'\nimport { useViewsShortcuts } from './hooks/useViewsShortcuts'\n\n// Component for use inside a ViewsProvider\nexport const Views: FC = () => {\n  // Enable Views keyboard shortcuts:\n  // - Shift+Ctrl/Cmd+0: Reset view to default settings\n  useViewsShortcuts()\n\n  return (\n    <>\n      <ViewsButton />\n      <ViewsMenuContainer />\n      <ViewsDialogContainer />\n    </>\n  )\n}\n"],"names":["useViewsShortcuts","jsxs","Fragment","jsx","ViewsButton","ViewsMenuContainer","ViewsDialogContainer"],"mappings":";;;;;;;AAOO,MAAM,QAAY,MAAM;AAGXA,sCAAA;AAElB,SAEIC,2BAAA,kBAAA,KAAAC,uCAAA,EAAA,UAAA;AAAA,IAAAC,2BAAA,kBAAA,IAACC,YAAY,aAAA,EAAA;AAAA,qDACZC,mBAAmB,oBAAA,EAAA;AAAA,qDACnBC,qBAAqB,SAAA,CAAA,CAAA;AAAA,EAAA,GACxB;AAEJ;;"}

package/dist/shared/src/{components → containers}/Views/Views.es.js

@@ -1,21 +1,17 @@
 import { j as jsxRuntimeExports } from "../../../../_virtual/jsx-runtime.es.js";
-import { ViewsProvider } from "./context/ViewsContext.es.js";
 import { ViewsButton } from "./ViewsButton/ViewsButton.es.js";
 import { ViewsMenuContainer } from "./ViewsMenuContainer/ViewsMenuContainer.es.js";
-const Views = ({ viewType, projectName }) => {
-  return /* @__PURE__ */ jsxRuntimeExports.jsxs(ViewsProvider, { viewType, projectName, children: [
-    /* @__PURE__ */ jsxRuntimeExports.jsx(ViewsButton, {}),
-    /* @__PURE__ */ jsxRuntimeExports.jsx(ViewsMenuContainer, {})
-  ] });
-};
-const ViewsComponents = () => {
+import ViewsDialogContainer from "./ViewsDialogContainer/ViewsDialogContainer.es.js";
+import { useViewsShortcuts } from "./hooks/useViewsShortcuts.es.js";
+const Views = () => {
+  useViewsShortcuts();
   return /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
     /* @__PURE__ */ jsxRuntimeExports.jsx(ViewsButton, {}),
-    /* @__PURE__ */ jsxRuntimeExports.jsx(ViewsMenuContainer, {})
+    /* @__PURE__ */ jsxRuntimeExports.jsx(ViewsMenuContainer, {}),
+    /* @__PURE__ */ jsxRuntimeExports.jsx(ViewsDialogContainer, {})
   ] });
 };
 export {
-  Views,
-  ViewsComponents
+  Views
 };
 //# sourceMappingURL=Views.es.js.map

package/dist/shared/src/containers/Views/Views.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Views.es.js","sources":["../../../../../src/containers/Views/Views.tsx"],"sourcesContent":["import { FC } from 'react'\nimport { ViewsButton } from './ViewsButton/ViewsButton'\nimport { ViewsMenuContainer } from './ViewsMenuContainer/ViewsMenuContainer'\nimport ViewsDialogContainer from './ViewsDialogContainer/ViewsDialogContainer'\nimport { useViewsShortcuts } from './hooks/useViewsShortcuts'\n\n// Component for use inside a ViewsProvider\nexport const Views: FC = () => {\n  // Enable Views keyboard shortcuts:\n  // - Shift+Ctrl/Cmd+0: Reset view to default settings\n  useViewsShortcuts()\n\n  return (\n    <>\n      <ViewsButton />\n      <ViewsMenuContainer />\n      <ViewsDialogContainer />\n    </>\n  )\n}\n"],"names":["jsxs","Fragment","jsx"],"mappings":";;;;;AAOO,MAAM,QAAY,MAAM;AAGX,oBAAA;AAElB,SAEIA,kCAAA,KAAAC,4BAAA,EAAA,UAAA;AAAA,IAAAC,kCAAA,IAAC,aAAY,EAAA;AAAA,0CACZ,oBAAmB,EAAA;AAAA,0CACnB,sBAAqB,CAAA,CAAA;AAAA,EAAA,GACxB;AAEJ;"}

package/dist/shared/src/{components → containers}/Views/Views.styled.cjs.js

@@ -7,6 +7,7 @@ const ViewsButton = styled(ayonReactComponents.Icon)`
   border-radius: var(--border-radius-m);
   margin: -4px 0;
   margin-right: -16px;
+  margin-left: 8px;
 
   &:hover,
   &.open {
@@ -14,12 +15,12 @@ const ViewsButton = styled(ayonReactComponents.Icon)`
   }
 
   &.active {
-    color: var(--md-sys-color-primary);
+    background-color: var(--md-sys-color-primary);
+    color: var(--md-sys-color-on-primary);
 
     &:hover,
     &.open {
-      background-color: var(--md-sys-color-on-primary);
-      color: var(--md-sys-color-primary);
+      background-color: var(--md-sys-color-primary-hover);
     }
   }
 `;

package/dist/shared/src/containers/Views/Views.styled.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Views.styled.cjs.js","sources":["../../../../../src/containers/Views/Views.styled.ts"],"sourcesContent":["import { Icon } from '@ynput/ayon-react-components'\nimport styled from 'styled-components'\n\nexport const ViewsButton = styled(Icon)`\n  padding: var(--padding-s);\n  border-radius: var(--border-radius-m);\n  margin: -4px 0;\n  margin-right: -16px;\n  margin-left: 8px;\n\n  &:hover,\n  &.open {\n    background-color: var(--md-sys-color-surface-container-high-hover);\n  }\n\n  &.active {\n    background-color: var(--md-sys-color-primary);\n    color: var(--md-sys-color-on-primary);\n\n    &:hover,\n    &.open {\n      background-color: var(--md-sys-color-primary-hover);\n    }\n  }\n`\n\nexport const ViewsModal = styled.div`\n  position: fixed;\n  top: 0;\n  left: 0;\n  padding: var(--padding-m);\n  min-width: 240px;\n  max-width: 800px;\n\n  overflow: hidden;\n\n  z-index: 910;\n\n  background-color: var(--md-sys-color-surface-container-high);\n  border-radius: var(--border-radius-l);\n  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.15);\n`\n"],"names":["Icon"],"mappings":";;;;AAGa,MAAA,cAAc,OAAOA,wBAAI;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAuB/B,MAAM,aAAa,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;"}

package/dist/shared/src/{components → containers}/Views/Views.styled.es.js

@@ -5,6 +5,7 @@ const ViewsButton = styled(Icon)`
   border-radius: var(--border-radius-m);
   margin: -4px 0;
   margin-right: -16px;
+  margin-left: 8px;
 
   &:hover,
   &.open {
@@ -12,12 +13,12 @@ const ViewsButton = styled(Icon)`
   }
 
   &.active {
-    color: var(--md-sys-color-primary);
+    background-color: var(--md-sys-color-primary);
+    color: var(--md-sys-color-on-primary);
 
     &:hover,
     &.open {
-      background-color: var(--md-sys-color-on-primary);
-      color: var(--md-sys-color-primary);
+      background-color: var(--md-sys-color-primary-hover);
     }
   }
 `;

package/dist/shared/src/containers/Views/Views.styled.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Views.styled.es.js","sources":["../../../../../src/containers/Views/Views.styled.ts"],"sourcesContent":["import { Icon } from '@ynput/ayon-react-components'\nimport styled from 'styled-components'\n\nexport const ViewsButton = styled(Icon)`\n  padding: var(--padding-s);\n  border-radius: var(--border-radius-m);\n  margin: -4px 0;\n  margin-right: -16px;\n  margin-left: 8px;\n\n  &:hover,\n  &.open {\n    background-color: var(--md-sys-color-surface-container-high-hover);\n  }\n\n  &.active {\n    background-color: var(--md-sys-color-primary);\n    color: var(--md-sys-color-on-primary);\n\n    &:hover,\n    &.open {\n      background-color: var(--md-sys-color-primary-hover);\n    }\n  }\n`\n\nexport const ViewsModal = styled.div`\n  position: fixed;\n  top: 0;\n  left: 0;\n  padding: var(--padding-m);\n  min-width: 240px;\n  max-width: 800px;\n\n  overflow: hidden;\n\n  z-index: 910;\n\n  background-color: var(--md-sys-color-surface-container-high);\n  border-radius: var(--border-radius-l);\n  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.15);\n`\n"],"names":[],"mappings":";;AAGa,MAAA,cAAc,OAAO,IAAI;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAuB/B,MAAM,aAAa,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;"}

package/dist/shared/src/{components → containers}/Views/ViewsButton/ViewsButton.cjs.js

@@ -8,8 +8,9 @@ const portalUtils = require("../utils/portalUtils.cjs.js");
 const Views_styled = require("../Views.styled.cjs.js");
 const clsx = require("clsx");
 const ViewsButton = () => {
-  const { viewType, isMenuOpen, setIsMenuOpen, selectedView } = ViewsContext.useViewsContext();
+  const { viewType, isMenuOpen, setIsMenuOpen, selectedView, isViewWorking, editingViewId } = ViewsContext.useViewsContext();
   const buttonRef = React.useRef(null);
+  if (!viewType) return null;
   const handleButtonClick = (e) => {
     e.preventDefault();
     e.stopPropagation();
@@ -21,7 +22,15 @@ const ViewsButton = () => {
       icon: "view_quilt",
       ref: buttonRef,
       onClick: handleButtonClick,
-      className: clsx({ active: !!selectedView, open: isMenuOpen })
+      className: clsx({ active: !!editingViewId, open: isMenuOpen }),
+      tabIndex: 0,
+      "data-tooltip": isViewWorking ? "Working view" : "View: " + (selectedView == null ? void 0 : selectedView.label) || "None",
+      "data-tooltip-delay": 0,
+      onKeyDown: (e) => {
+        if (e.key === "Enter" || e.key === " ") {
+          handleButtonClick(e);
+        }
+      }
     }
   );
   const portalContainer = portalUtils.getViewsPortalContainer(viewType);

package/dist/shared/src/containers/Views/ViewsButton/ViewsButton.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ViewsButton.cjs.js","sources":["../../../../../../src/containers/Views/ViewsButton/ViewsButton.tsx"],"sourcesContent":["import { FC, useRef } from 'react'\nimport { createPortal } from 'react-dom'\nimport { useViewsContext } from '../context/ViewsContext'\nimport { getViewsPortalContainer } from '../utils/portalUtils'\nimport * as Styled from '../Views.styled'\nimport clsx from 'clsx'\n\nexport const ViewsButton: FC = () => {\n  const { viewType, isMenuOpen, setIsMenuOpen, selectedView, isViewWorking, editingViewId } =\n    useViewsContext()\n\n  const buttonRef = useRef<HTMLButtonElement>(null)\n\n  // views not support for this page\n  if (!viewType) return null\n\n  const handleButtonClick = (\n    e: React.MouseEvent<HTMLSpanElement> | React.KeyboardEvent<HTMLSpanElement>,\n  ) => {\n    e.preventDefault()\n    e.stopPropagation()\n    setIsMenuOpen(!isMenuOpen)\n  }\n\n  const button = (\n    <Styled.ViewsButton\n      icon=\"view_quilt\"\n      ref={buttonRef}\n      onClick={handleButtonClick}\n      className={clsx({ active: !!editingViewId, open: isMenuOpen })}\n      tabIndex={0}\n      data-tooltip={isViewWorking ? 'Working view' : 'View: ' + selectedView?.label || 'None'}\n      data-tooltip-delay={0}\n      onKeyDown={(e) => {\n        if (e.key === 'Enter' || e.key === ' ') {\n          handleButtonClick(e)\n        }\n      }}\n    />\n  )\n\n  // Try to find the portal container for this viewType\n  const portalContainer = getViewsPortalContainer(viewType)\n\n  if (!portalContainer) return null\n\n  // If we have a portal container, render there. Otherwise render normally\n  return createPortal(button, portalContainer)\n}\n"],"names":["useViewsContext","useRef","jsx","Styled.ViewsButton","getViewsPortalContainer","createPortal"],"mappings":";;;;;;;;;AAOO,MAAM,cAAkB,MAAM;AAC7B,QAAA,EAAE,UAAU,YAAY,eAAe,cAAc,eAAe,kBACxEA,6BAAgB;AAEZ,QAAA,YAAYC,aAA0B,IAAI;AAG5C,MAAA,CAAC,SAAiB,QAAA;AAEhB,QAAA,oBAAoB,CACxB,MACG;AACH,MAAE,eAAe;AACjB,MAAE,gBAAgB;AAClB,kBAAc,CAAC,UAAU;AAAA,EAC3B;AAEA,QAAM,SACJC,2BAAA,kBAAA;AAAA,IAACC,aAAO;AAAA,IAAP;AAAA,MACC,MAAK;AAAA,MACL,KAAK;AAAA,MACL,SAAS;AAAA,MACT,WAAW,KAAK,EAAE,QAAQ,CAAC,CAAC,eAAe,MAAM,YAAY;AAAA,MAC7D,UAAU;AAAA,MACV,gBAAc,gBAAgB,iBAAiB,YAAW,6CAAc,UAAS;AAAA,MACjF,sBAAoB;AAAA,MACpB,WAAW,CAAC,MAAM;AAChB,YAAI,EAAE,QAAQ,WAAW,EAAE,QAAQ,KAAK;AACtC,4BAAkB,CAAC;AAAA,QAAA;AAAA,MACrB;AAAA,IACF;AAAA,EACF;AAII,QAAA,kBAAkBC,oCAAwB,QAAQ;AAEpD,MAAA,CAAC,gBAAwB,QAAA;AAGtB,SAAAC,SAAA,aAAa,QAAQ,eAAe;AAC7C;;"}

package/dist/shared/src/{components → containers}/Views/ViewsButton/ViewsButton.es.js

@@ -6,8 +6,9 @@ import { getViewsPortalContainer } from "../utils/portalUtils.es.js";
 import { ViewsButton as ViewsButton$1 } from "../Views.styled.es.js";
 import clsx from "clsx";
 const ViewsButton = () => {
-  const { viewType, isMenuOpen, setIsMenuOpen, selectedView } = useViewsContext();
+  const { viewType, isMenuOpen, setIsMenuOpen, selectedView, isViewWorking, editingViewId } = useViewsContext();
   const buttonRef = useRef(null);
+  if (!viewType) return null;
   const handleButtonClick = (e) => {
     e.preventDefault();
     e.stopPropagation();
@@ -19,7 +20,15 @@ const ViewsButton = () => {
       icon: "view_quilt",
       ref: buttonRef,
       onClick: handleButtonClick,
-      className: clsx({ active: !!selectedView, open: isMenuOpen })
+      className: clsx({ active: !!editingViewId, open: isMenuOpen }),
+      tabIndex: 0,
+      "data-tooltip": isViewWorking ? "Working view" : "View: " + (selectedView == null ? void 0 : selectedView.label) || "None",
+      "data-tooltip-delay": 0,
+      onKeyDown: (e) => {
+        if (e.key === "Enter" || e.key === " ") {
+          handleButtonClick(e);
+        }
+      }
     }
   );
   const portalContainer = getViewsPortalContainer(viewType);

package/dist/shared/src/containers/Views/ViewsButton/ViewsButton.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ViewsButton.es.js","sources":["../../../../../../src/containers/Views/ViewsButton/ViewsButton.tsx"],"sourcesContent":["import { FC, useRef } from 'react'\nimport { createPortal } from 'react-dom'\nimport { useViewsContext } from '../context/ViewsContext'\nimport { getViewsPortalContainer } from '../utils/portalUtils'\nimport * as Styled from '../Views.styled'\nimport clsx from 'clsx'\n\nexport const ViewsButton: FC = () => {\n  const { viewType, isMenuOpen, setIsMenuOpen, selectedView, isViewWorking, editingViewId } =\n    useViewsContext()\n\n  const buttonRef = useRef<HTMLButtonElement>(null)\n\n  // views not support for this page\n  if (!viewType) return null\n\n  const handleButtonClick = (\n    e: React.MouseEvent<HTMLSpanElement> | React.KeyboardEvent<HTMLSpanElement>,\n  ) => {\n    e.preventDefault()\n    e.stopPropagation()\n    setIsMenuOpen(!isMenuOpen)\n  }\n\n  const button = (\n    <Styled.ViewsButton\n      icon=\"view_quilt\"\n      ref={buttonRef}\n      onClick={handleButtonClick}\n      className={clsx({ active: !!editingViewId, open: isMenuOpen })}\n      tabIndex={0}\n      data-tooltip={isViewWorking ? 'Working view' : 'View: ' + selectedView?.label || 'None'}\n      data-tooltip-delay={0}\n      onKeyDown={(e) => {\n        if (e.key === 'Enter' || e.key === ' ') {\n          handleButtonClick(e)\n        }\n      }}\n    />\n  )\n\n  // Try to find the portal container for this viewType\n  const portalContainer = getViewsPortalContainer(viewType)\n\n  if (!portalContainer) return null\n\n  // If we have a portal container, render there. Otherwise render normally\n  return createPortal(button, portalContainer)\n}\n"],"names":["jsx","Styled.ViewsButton"],"mappings":";;;;;;;AAOO,MAAM,cAAkB,MAAM;AAC7B,QAAA,EAAE,UAAU,YAAY,eAAe,cAAc,eAAe,kBACxE,gBAAgB;AAEZ,QAAA,YAAY,OAA0B,IAAI;AAG5C,MAAA,CAAC,SAAiB,QAAA;AAEhB,QAAA,oBAAoB,CACxB,MACG;AACH,MAAE,eAAe;AACjB,MAAE,gBAAgB;AAClB,kBAAc,CAAC,UAAU;AAAA,EAC3B;AAEA,QAAM,SACJA,kCAAA;AAAA,IAACC;AAAAA,IAAA;AAAA,MACC,MAAK;AAAA,MACL,KAAK;AAAA,MACL,SAAS;AAAA,MACT,WAAW,KAAK,EAAE,QAAQ,CAAC,CAAC,eAAe,MAAM,YAAY;AAAA,MAC7D,UAAU;AAAA,MACV,gBAAc,gBAAgB,iBAAiB,YAAW,6CAAc,UAAS;AAAA,MACjF,sBAAoB;AAAA,MACpB,WAAW,CAAC,MAAM;AAChB,YAAI,EAAE,QAAQ,WAAW,EAAE,QAAQ,KAAK;AACtC,4BAAkB,CAAC;AAAA,QAAA;AAAA,MACrB;AAAA,IACF;AAAA,EACF;AAII,QAAA,kBAAkB,wBAAwB,QAAQ;AAEpD,MAAA,CAAC,gBAAwB,QAAA;AAGtB,SAAA,aAAa,QAAQ,eAAe;AAC7C;"}

package/dist/shared/src/containers/Views/ViewsDialogContainer/ViewFormDialogFallback.cjs.js

@@ -0,0 +1,4 @@
+"use strict";
+const ViewFormDialogFallback = () => null;
+module.exports = ViewFormDialogFallback;
+//# sourceMappingURL=ViewFormDialogFallback.cjs.js.map

package/dist/shared/src/containers/Views/ViewsDialogContainer/ViewFormDialogFallback.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ViewFormDialogFallback.cjs.js","sources":["../../../../../../src/containers/Views/ViewsDialogContainer/ViewFormDialogFallback.tsx"],"sourcesContent":["import { FC } from 'react'\nimport { ViewFormData, ViewsContextValue, ViewSettings, ViewType } from '..'\nimport { ShareOption, UserModel } from '@shared/api'\n\nexport interface ViewFormDialogProps {\n  editingView: Partial<ViewFormData> & { viewId?: string }\n  setEditingView: (viewId: string | null) => void\n  viewType: ViewType\n  viewSettings?: ViewSettings\n  currentUser?: UserModel\n  projectName?: string\n  setSelected: (viewId: string) => void\n  // data\n  shareOptions?: ShareOption[]\n  // data mutations\n  onCreateView: ViewsContextValue['onCreateView']\n  onUpdateView: ViewsContextValue['onUpdateView']\n  onDeleteView: ViewsContextValue['onDeleteView']\n  api: ViewsContextValue['api']\n  dispatch: any\n  pt?: {\n    dialog?: Partial<React.HTMLAttributes<HTMLDivElement>>\n  }\n}\n\nconst ViewFormDialogFallback: FC<ViewFormDialogProps> = () => null\n\nexport default ViewFormDialogFallback\n"],"names":[],"mappings":";AAyBA,MAAM,yBAAkD,MAAM;;"}

package/dist/shared/src/containers/Views/ViewsDialogContainer/ViewFormDialogFallback.es.js

@@ -0,0 +1,5 @@
+const ViewFormDialogFallback = () => null;
+export {
+  ViewFormDialogFallback as default
+};
+//# sourceMappingURL=ViewFormDialogFallback.es.js.map

package/dist/shared/src/containers/Views/ViewsDialogContainer/ViewFormDialogFallback.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ViewFormDialogFallback.es.js","sources":["../../../../../../src/containers/Views/ViewsDialogContainer/ViewFormDialogFallback.tsx"],"sourcesContent":["import { FC } from 'react'\nimport { ViewFormData, ViewsContextValue, ViewSettings, ViewType } from '..'\nimport { ShareOption, UserModel } from '@shared/api'\n\nexport interface ViewFormDialogProps {\n  editingView: Partial<ViewFormData> & { viewId?: string }\n  setEditingView: (viewId: string | null) => void\n  viewType: ViewType\n  viewSettings?: ViewSettings\n  currentUser?: UserModel\n  projectName?: string\n  setSelected: (viewId: string) => void\n  // data\n  shareOptions?: ShareOption[]\n  // data mutations\n  onCreateView: ViewsContextValue['onCreateView']\n  onUpdateView: ViewsContextValue['onUpdateView']\n  onDeleteView: ViewsContextValue['onDeleteView']\n  api: ViewsContextValue['api']\n  dispatch: any\n  pt?: {\n    dialog?: Partial<React.HTMLAttributes<HTMLDivElement>>\n  }\n}\n\nconst ViewFormDialogFallback: FC<ViewFormDialogProps> = () => null\n\nexport default ViewFormDialogFallback\n"],"names":[],"mappings":"AAyBA,MAAM,yBAAkD,MAAM;"}

package/dist/shared/src/{components/Views/context/ViewsContext.cjs.js → containers/Views/ViewsDialogContainer/ViewsDialogContainer.cjs.js}

@@ -1,11 +1,11 @@
 "use strict";
-Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
 const jsxRuntime = require("../../../../../_virtual/jsx-runtime.cjs.js");
-const React = require("react");
-require("react-dom");
-require("../Views.styled.cjs.js");
-require("clsx");
-const ViewsMenuContainer = require("../ViewsMenuContainer/ViewsMenuContainer.cjs.js");
+const ViewsContext = require("../context/ViewsContext.cjs.js");
+require("react");
+const useLoadModule = require("../../../hooks/useLoadModule.cjs.js");
+require("../../../../../_virtual/runtime.cjs.js");
+require("../../../../../_virtual/semver.cjs.js");
 require("../../../api/base/client.cjs.js");
 require("../../../api/generated/graphql.cjs.js");
 require("../../../api/generated/access.cjs.js");
@@ -53,6 +53,7 @@ require("../../../api/queries/addons/updateAddons.cjs.js");
 require("../../../api/queries/attributes/getAttributes.cjs.js");
 require("../../../api/queries/attributes/updateAttributes.cjs.js");
 require("../../../api/queries/authentication/getAuthentication.cjs.js");
+require("../../../api/queries/cloud/cloud.cjs.js");
 require("../../../api/queries/entities/getEntity.cjs.js");
 require("../../../api/queries/entities/getEntityPanel.cjs.js");
 require("../../../api/queries/entities/updateEntity.cjs.js");
@@ -61,85 +62,98 @@ require("../../../api/queries/entityLists/updateLists.cjs.js");
 require("../../../api/queries/entityLists/getListsAttributes.cjs.js");
 require("../../../api/queries/entityLists/updateListsAttributes.cjs.js");
 require("../../../api/queries/folders/getFolders.cjs.js");
+require("../../../api/queries/grouping/getGrouping.cjs.js");
 require("../../../api/queries/overview/getOverview.cjs.js");
 require("../../../api/queries/overview/updateOverview.cjs.js");
+require("../../../api/queries/permissions/getPermissions.cjs.js");
+require("../../../api/queries/products/createProduct.cjs.js");
 require("../../../api/queries/project/getProject.cjs.js");
 require("../../../api/queries/project/updateProject.cjs.js");
 require("../../../api/queries/review/getReview.cjs.js");
 require("../../../api/queries/review/updateReview.cjs.js");
+require("../../../api/queries/share/share.cjs.js");
 require("../../../api/queries/system/getSystem.cjs.js");
 require("../../../api/queries/userDashboard/getUserDashboard.cjs.js");
 require("../../../api/queries/users/getUsers.cjs.js");
 require("../../../api/queries/users/updateUsers.cjs.js");
-require("../../../api/queries/watchers/getWatchers.cjs.js");
-require("../../../api/queries/permissions/getPermissions.cjs.js");
-require("../../../api/queries/grouping/getGrouping.cjs.js");
 require("../../../api/queries/versions/updateVersions.cjs.js");
-require("../../../api/queries/products/createProduct.cjs.js");
-require("../../../api/queries/cloud/cloud.cjs.js");
-const getViews = require("../../../api/queries/views/getViews.cjs.js");
+require("../../../api/queries/views/getViews.cjs.js");
 require("../../../api/queries/views/updateViews.cjs.js");
-const useBuildViewMenuItems = require("../hooks/useBuildViewMenuItems.cjs.js");
+require("../../../api/queries/watchers/getWatchers.cjs.js");
+require("lodash");
+require("react-toastify");
 require("../../../context/RemoteModulesContext.cjs.js");
 require("../../../context/DetailsPanelContext.cjs.js");
 require("../../../context/ThumbnailUploaderContext.cjs.js");
 require("../../../context/SettingsPanelContext.cjs.js");
 require("../../../context/pip/PiPProvider.cjs.js");
+require("react-dom");
 require("../../../context/pip/PiPWrapper.cjs.js");
 require("../../../context/AddonProjectContext.cjs.js");
 require("../../../context/AddonContext.cjs.js");
 const PowerpackContext = require("../../../context/PowerpackContext.cjs.js");
-const ViewsContext = React.createContext(null);
-const ViewsProvider = ({ children, viewType, projectName }) => {
-  const { powerLicense } = PowerpackContext.usePowerpack();
-  const [isMenuOpen, setIsMenuOpen] = React.useState(false);
-  const [editingView, setEditingView] = React.useState(null);
-  const [selectedView, setSelectedView] = React.useState(null);
-  const { data: viewsList = [], isLoading: isLoadingViews } = getViews.useListViewsQuery(
-    { projectName, viewType },
-    { skip: !viewType || !projectName || !powerLicense }
-  );
-  const { data: personalView } = getViews.useGetPersonalViewQuery(
-    { projectName, viewType },
-    { skip: !viewType || !projectName }
-  );
-  const { data: selectedViewData } = getViews.useGetViewQuery(
-    { viewId: selectedView, projectName, viewType },
-    { skip: !selectedView || selectedView === ViewsMenuContainer.PERSONAL_VIEW_ID || !powerLicense }
-  );
-  const viewSettings = selectedView === ViewsMenuContainer.PERSONAL_VIEW_ID ? personalView == null ? void 0 : personalView.settings : selectedViewData == null ? void 0 : selectedViewData.settings;
-  const viewMenuItems = useBuildViewMenuItems.default({
-    viewsList,
-    personalView,
-    viewType,
-    projectName,
-    onSelect: setSelectedView,
-    onEdit: (viewId) => setEditingView({ viewId })
-  });
-  const value = {
+require("react-redux");
+require("custom-protocol-check");
+const ViewFormDialogFallback = require("./ViewFormDialogFallback.cjs.js");
+const ayonReactComponents = require("@ynput/ayon-react-components");
+const VIEWS_DIALOG_CLASS = "views-dialog";
+const ViewsDialogContainer = ({}) => {
+  const {
+    editingView,
+    editingViewData,
+    setEditingView,
     viewType,
     projectName,
-    isMenuOpen,
-    editingView,
-    selectedView,
+    currentUser,
     viewSettings,
-    viewsList,
-    personalView,
-    viewMenuItems,
-    isLoadingViews,
-    setIsMenuOpen,
-    setEditingView,
-    setSelectedView
-  };
-  return /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(ViewsContext.Provider, { value, children });
-};
-const useViewsContext = () => {
-  const context = React.useContext(ViewsContext);
-  if (!context) {
-    throw new Error("useViewsContext must be used within a ViewsProvider");
+    shareOptions,
+    setSelectedView,
+    onCreateView,
+    onUpdateView,
+    onDeleteView,
+    api,
+    dispatch
+  } = ViewsContext.useViewsContext();
+  const { powerLicense } = PowerpackContext.usePowerpack();
+  const [ViewFormDialog, { isLoading: isLoadingQueries, outdated }] = useLoadModule.useLoadModule({
+    addon: "powerpack",
+    remote: "views",
+    module: "ViewFormDialog",
+    fallback: ViewFormDialogFallback,
+    minVersion: "1.1.1-views",
+    skip: !viewType || !powerLicense
+  });
+  if (!viewType || !editingView) return null;
+  if (editingView && outdated) {
+    return /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(ayonReactComponents.Dialog, { isOpen: true, header: "Powerpack Update Required", onClose: () => setEditingView(null), children: /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx("p", { children: "The View Form Dialog is outdated. Please update the Powerpack addon to the latest version." }) });
   }
-  return context;
+  return /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(
+    ViewFormDialog,
+    {
+      editingView: {
+        viewId: editingView === true ? void 0 : editingView,
+        ...editingViewData || {}
+      },
+      viewSettings,
+      setEditingView,
+      viewType,
+      projectName,
+      shareOptions,
+      setSelected: setSelectedView,
+      onCreateView,
+      onUpdateView,
+      onDeleteView,
+      api,
+      dispatch,
+      currentUser,
+      pt: {
+        dialog: {
+          className: VIEWS_DIALOG_CLASS
+        }
+      }
+    }
+  );
 };
-exports.ViewsProvider = ViewsProvider;
-exports.useViewsContext = useViewsContext;
-//# sourceMappingURL=ViewsContext.cjs.js.map
+exports.VIEWS_DIALOG_CLASS = VIEWS_DIALOG_CLASS;
+exports.default = ViewsDialogContainer;
+//# sourceMappingURL=ViewsDialogContainer.cjs.js.map

package/dist/shared/src/containers/Views/ViewsDialogContainer/ViewsDialogContainer.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ViewsDialogContainer.cjs.js","sources":["../../../../../../src/containers/Views/ViewsDialogContainer/ViewsDialogContainer.tsx"],"sourcesContent":["import { FC } from 'react'\nimport { useViewsContext } from '../context/ViewsContext'\nimport { useLoadModule } from '@shared/hooks'\nimport ViewFormDialogFallback from './ViewFormDialogFallback'\nimport { Dialog } from '@ynput/ayon-react-components'\nimport { usePowerpack } from '@shared/context'\n\nexport const VIEWS_DIALOG_CLASS = 'views-dialog' as const\n\ninterface ViewsDialogContainerProps {}\n\nconst ViewsDialogContainer: FC<ViewsDialogContainerProps> = ({}) => {\n  const {\n    editingView,\n    editingViewData,\n    setEditingView,\n    viewType,\n    projectName,\n    currentUser,\n    viewSettings,\n    shareOptions,\n    setSelectedView,\n    onCreateView,\n    onUpdateView,\n    onDeleteView,\n    api,\n    dispatch,\n  } = useViewsContext()\n\n  const { powerLicense } = usePowerpack()\n\n  const [ViewFormDialog, { isLoading: isLoadingQueries, outdated }] = useLoadModule({\n    addon: 'powerpack',\n    remote: 'views',\n    module: 'ViewFormDialog',\n    fallback: ViewFormDialogFallback,\n    minVersion: '1.1.1-views',\n    skip: !viewType || !powerLicense,\n  })\n\n  if (!viewType || !editingView) return null\n\n  if (editingView && outdated) {\n    return (\n      <Dialog isOpen header=\"Powerpack Update Required\" onClose={() => setEditingView(null)}>\n        <p>\n          The View Form Dialog is outdated. Please update the Powerpack addon to the latest version.\n        </p>\n      </Dialog>\n    )\n  }\n\n  return (\n    <ViewFormDialog\n      editingView={{\n        viewId: editingView === true ? undefined : editingView,\n        ...(editingViewData || {}),\n      }}\n      viewSettings={viewSettings}\n      setEditingView={setEditingView}\n      viewType={viewType}\n      projectName={projectName}\n      shareOptions={shareOptions}\n      setSelected={setSelectedView}\n      onCreateView={onCreateView}\n      onUpdateView={onUpdateView}\n      onDeleteView={onDeleteView}\n      api={api}\n      dispatch={dispatch}\n      currentUser={currentUser}\n      pt={{\n        dialog: {\n          className: VIEWS_DIALOG_CLASS,\n        },\n      }}\n    />\n  )\n}\n\nexport default ViewsDialogContainer\n"],"names":["useViewsContext","usePowerpack","useLoadModule","jsx","Dialog"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAOO,MAAM,qBAAqB;AAI5B,MAAA,uBAAsD,CAAC,CAAA,MAAO;AAC5D,QAAA;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,MACEA,6BAAgB;AAEd,QAAA,EAAE,aAAa,IAAIC,8BAAa;AAEhC,QAAA,CAAC,gBAAgB,EAAE,WAAW,kBAAkB,SAAS,CAAC,IAAIC,4BAAc;AAAA,IAChF,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR,UAAU;AAAA,IACV,YAAY;AAAA,IACZ,MAAM,CAAC,YAAY,CAAC;AAAA,EAAA,CACrB;AAED,MAAI,CAAC,YAAY,CAAC,YAAoB,QAAA;AAEtC,MAAI,eAAe,UAAU;AAC3B,WACGC,2BAAAA,kBAAAA,IAAAC,oBAAAA,QAAA,EAAO,QAAM,MAAC,QAAO,6BAA4B,SAAS,MAAM,eAAe,IAAI,GAClF,UAACD,iDAAA,KAAA,EAAE,uGAEH,CAAA,GACF;AAAA,EAAA;AAKF,SAAAA,2BAAA,kBAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,aAAa;AAAA,QACX,QAAQ,gBAAgB,OAAO,SAAY;AAAA,QAC3C,GAAI,mBAAmB,CAAA;AAAA,MACzB;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,aAAa;AAAA,MACb;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,IAAI;AAAA,QACF,QAAQ;AAAA,UACN,WAAW;AAAA,QAAA;AAAA,MACb;AAAA,IACF;AAAA,EACF;AAEJ;;;"}