@ynput/ayon-frontend-shared 0.2.13 → 0.2.15

package/dist/shared/src/components/Powerpack/PowerpackDialog.es.js

@@ -0,0 +1,48 @@
+import { j as jsxRuntimeExports } from "../../../../_virtual/jsx-runtime.es.js";
+import { PowerpackDialog as PowerpackDialog$1, MainFeature, FeaturesList, MoreButton } from "./PowerpackDialog.styled.es.js";
+import { Icon } from "@ynput/ayon-react-components";
+import { PricingLink } from "./PricingLink.es.js";
+import "../../context/RemoteModulesContext.es.js";
+import "../../context/DetailsPanelContext.es.js";
+import "../../context/ThumbnailUploaderContext.es.js";
+import "../../context/SettingsPanelContext.es.js";
+import "../../context/pip/PiPProvider.es.js";
+import "react-dom";
+import "../../context/pip/PiPWrapper.es.js";
+import "../../context/AddonProjectContext.es.js";
+import "../../context/AddonContext.es.js";
+import { usePowerpack, powerpackFeatures } from "../../context/PowerpackContext.es.js";
+const PowerpackDialog = ({}) => {
+  const { setPowerpackDialog, selectedPowerPack, powerpackDialog } = usePowerpack();
+  if (!powerpackDialog) return null;
+  return /* @__PURE__ */ jsxRuntimeExports.jsxs(PowerpackDialog$1, { isOpen: true, onClose: () => setPowerpackDialog(null), size: "lg", children: [
+    /* @__PURE__ */ jsxRuntimeExports.jsxs(MainFeature, { children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsxs("h1", { children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx(Icon, { icon: "bolt" }),
+        powerpackDialog.label
+      ] }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx("h2", { children: powerpackDialog.description })
+    ] }),
+    /* @__PURE__ */ jsxRuntimeExports.jsxs(FeaturesList, { children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsxs("h3", { children: [
+        "Unlock all ",
+        /* @__PURE__ */ jsxRuntimeExports.jsx(Icon, { icon: "bolt" }),
+        " ",
+        /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "green", children: "Power Features" }),
+        " with an AYON subscription."
+      ] }),
+      /* @__PURE__ */ jsxRuntimeExports.jsxs("ul", { children: [
+        Object.entries(powerpackFeatures).sort(([key]) => key !== selectedPowerPack ? 1 : -1).map(([key, value]) => /* @__PURE__ */ jsxRuntimeExports.jsxs("li", { children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsx(Icon, { icon: "check" }),
+          /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: value.bullet })
+        ] }, key)),
+        /* @__PURE__ */ jsxRuntimeExports.jsx("li", { className: "more", children: "More coming soon!" })
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxRuntimeExports.jsx(PricingLink, { children: /* @__PURE__ */ jsxRuntimeExports.jsx(MoreButton, { children: "Find out more" }) })
+  ] });
+};
+export {
+  PowerpackDialog
+};
+//# sourceMappingURL=PowerpackDialog.es.js.map

package/dist/shared/src/components/Powerpack/PowerpackDialog.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PowerpackDialog.es.js","sources":["../../../../../src/components/Powerpack/PowerpackDialog.tsx"],"sourcesContent":["import * as Styled from './PowerpackDialog.styled'\nimport { FC } from 'react'\nimport { Icon } from '@ynput/ayon-react-components'\nimport { PricingLink } from './PricingLink'\nimport { powerpackFeatures, usePowerpack } from '@shared/context'\n\nexport interface PowerpackDialogProps {}\n\nexport const PowerpackDialog: FC<PowerpackDialogProps> = ({}) => {\n  const { setPowerpackDialog, selectedPowerPack, powerpackDialog } = usePowerpack()\n\n  if (!powerpackDialog) return null\n\n  return (\n    <Styled.PowerpackDialog isOpen onClose={() => setPowerpackDialog(null)} size=\"lg\">\n      <Styled.MainFeature>\n        <h1>\n          <Icon icon=\"bolt\" />\n          {powerpackDialog.label}\n        </h1>\n        <h2>{powerpackDialog.description}</h2>\n      </Styled.MainFeature>\n\n      <Styled.FeaturesList>\n        <h3>\n          Unlock all <Icon icon=\"bolt\" /> <span className=\"green\">Power Features</span> with an AYON\n          subscription.\n        </h3>\n        <ul>\n          {Object.entries(powerpackFeatures)\n            .sort(([key]) => (key !== selectedPowerPack ? 1 : -1))\n            .map(([key, value]) => (\n              <li key={key}>\n                <Icon icon=\"check\" />\n                <span>{value.bullet}</span>\n              </li>\n            ))}\n          <li className=\"more\">More coming soon!</li>\n        </ul>\n      </Styled.FeaturesList>\n      <PricingLink>\n        <Styled.MoreButton>Find out more</Styled.MoreButton>\n      </PricingLink>\n    </Styled.PowerpackDialog>\n  )\n}\n"],"names":["jsxs","Styled.PowerpackDialog","Styled.MainFeature","jsx","Styled.FeaturesList","Styled.MoreButton"],"mappings":";;;;;;;;;;;;;;AAQa,MAAA,kBAA4C,CAAC,CAAA,MAAO;AAC/D,QAAM,EAAE,oBAAoB,mBAAmB,gBAAA,IAAoB,aAAa;AAE5E,MAAA,CAAC,gBAAwB,QAAA;AAE7B,SACGA,uCAAAC,mBAAA,EAAuB,QAAM,MAAC,SAAS,MAAM,mBAAmB,IAAI,GAAG,MAAK,MAC3E,UAAA;AAAA,IAACD,uCAAAE,aAAA,EACC,UAAA;AAAA,MAAAF,uCAAC,MACC,EAAA,UAAA;AAAA,QAACG,kCAAAA,IAAA,MAAA,EAAK,MAAK,OAAO,CAAA;AAAA,QACjB,gBAAgB;AAAA,MAAA,GACnB;AAAA,MACAA,kCAAAA,IAAC,MAAI,EAAA,UAAA,gBAAgB,YAAY,CAAA;AAAA,IAAA,GACnC;AAAA,IAEAH,uCAACI,cAAA,EACC,UAAA;AAAA,MAAAJ,uCAAC,MAAG,EAAA,UAAA;AAAA,QAAA;AAAA,QACSG,kCAAAA,IAAC,MAAK,EAAA,MAAK,OAAO,CAAA;AAAA,QAAE;AAAA,QAAEA,kCAAA,IAAA,QAAA,EAAK,WAAU,SAAQ,UAAc,kBAAA;AAAA,QAAO;AAAA,MAAA,GAE/E;AAAA,6CACC,MACE,EAAA,UAAA;AAAA,QAAO,OAAA,QAAQ,iBAAiB,EAC9B,KAAK,CAAC,CAAC,GAAG,MAAO,QAAQ,oBAAoB,IAAI,EAAG,EACpD,IAAI,CAAC,CAAC,KAAK,KAAK,6CACd,MACC,EAAA,UAAA;AAAA,UAACA,kCAAAA,IAAA,MAAA,EAAK,MAAK,QAAQ,CAAA;AAAA,UACnBA,kCAAAA,IAAC,QAAM,EAAA,UAAA,MAAM,OAAO,CAAA;AAAA,QAAA,EAAA,GAFb,GAGT,CACD;AAAA,QACFA,kCAAA,IAAA,MAAA,EAAG,WAAU,QAAO,UAAiB,oBAAA,CAAA;AAAA,MAAA,EACxC,CAAA;AAAA,IAAA,GACF;AAAA,0CACC,aACC,EAAA,UAAAA,kCAAAA,IAACE,YAAA,EAAkB,2BAAa,EAClC,CAAA;AAAA,EAAA,GACF;AAEJ;"}

package/dist/shared/src/components/Powerpack/PowerpackDialog.styled.cjs.js

@@ -0,0 +1,102 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const ayonReactComponents = require("@ynput/ayon-react-components");
+const styled = require("styled-components");
+const PowerpackDialog = styled(ayonReactComponents.Dialog)`
+  background: linear-gradient(180deg, rgb(0 121 181 / 0%) -12.03%, rgb(4 255 227 / 26%) 105.38%),
+    #15171c;
+
+  width: 550px;
+  max-height: unset;
+  height: unset;
+  border-radius: 16px;
+
+  .body {
+    gap: 32px;
+    padding: 16px 32px;
+    align-items: center;
+  }
+
+  .icon {
+    font-variation-settings: 'FILL' 1, 'wght' 200, 'GRAD' 200, 'opsz' 20;
+  }
+
+  .cancelButton {
+    background-color: unset !important;
+  }
+`;
+const MainFeature = styled.div`
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 12px;
+  padding: 8px 16px;
+  border-radius: var(--border-radius-l);
+  border: 1px solid var(--md-sys-color-tertiary);
+  color: var(--md-sys-color-tertiary);
+  width: 100%;
+
+  h1 {
+    margin: 0;
+    ${ayonReactComponents.theme.headlineSmall}
+
+    display: flex;
+    align-items: center;
+    gap: var(--base-gap-small);
+  }
+
+  h2 {
+    margin: 0;
+    ${ayonReactComponents.theme.bodyLarge}
+    text-align: center;
+  }
+
+  .icon {
+    font-size: 32px;
+    color: var(--md-sys-color-tertiary);
+  }
+`;
+const FeaturesList = styled.div`
+  width: 100%;
+
+  h3 {
+    ${ayonReactComponents.theme.bodyMedium}
+    .green, .icon {
+      color: var(--md-sys-color-tertiary);
+    }
+    .green {
+      margin-right: 4px;
+    }
+  }
+
+  ul {
+    margin: 0;
+    margin-top: 8px;
+    padding: 0;
+    display: flex;
+    flex-direction: column;
+    gap: 16px;
+
+    li {
+      display: flex;
+      align-items: center;
+      gap: 8px;
+    }
+  }
+`;
+const MoreButton = styled(ayonReactComponents.Button)`
+  background-color: var(--md-sys-color-tertiary);
+  color: var(--md-sys-color-on-tertiary);
+  padding: 12px 20px;
+  border-radius: var(--border-radius-l);
+  margin-bottom: 16px;
+
+  &:hover {
+    background-color: var(--md-sys-color-tertiary-hover);
+  }
+`;
+exports.FeaturesList = FeaturesList;
+exports.MainFeature = MainFeature;
+exports.MoreButton = MoreButton;
+exports.PowerpackDialog = PowerpackDialog;
+//# sourceMappingURL=PowerpackDialog.styled.cjs.js.map

package/dist/shared/src/components/Powerpack/PowerpackDialog.styled.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PowerpackDialog.styled.cjs.js","sources":["../../../../../src/components/Powerpack/PowerpackDialog.styled.ts"],"sourcesContent":["import { Button, Dialog, theme } from '@ynput/ayon-react-components'\nimport styled from 'styled-components'\n\nexport const PowerpackDialog = styled(Dialog)`\n  background: linear-gradient(180deg, rgb(0 121 181 / 0%) -12.03%, rgb(4 255 227 / 26%) 105.38%),\n    #15171c;\n\n  width: 550px;\n  max-height: unset;\n  height: unset;\n  border-radius: 16px;\n\n  .body {\n    gap: 32px;\n    padding: 16px 32px;\n    align-items: center;\n  }\n\n  .icon {\n    font-variation-settings: 'FILL' 1, 'wght' 200, 'GRAD' 200, 'opsz' 20;\n  }\n\n  .cancelButton {\n    background-color: unset !important;\n  }\n`\n\nexport const MainFeature = styled.div`\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  gap: 12px;\n  padding: 8px 16px;\n  border-radius: var(--border-radius-l);\n  border: 1px solid var(--md-sys-color-tertiary);\n  color: var(--md-sys-color-tertiary);\n  width: 100%;\n\n  h1 {\n    margin: 0;\n    ${theme.headlineSmall}\n\n    display: flex;\n    align-items: center;\n    gap: var(--base-gap-small);\n  }\n\n  h2 {\n    margin: 0;\n    ${theme.bodyLarge}\n    text-align: center;\n  }\n\n  .icon {\n    font-size: 32px;\n    color: var(--md-sys-color-tertiary);\n  }\n`\n\nexport const FeaturesList = styled.div`\n  width: 100%;\n\n  h3 {\n    ${theme.bodyMedium}\n    .green, .icon {\n      color: var(--md-sys-color-tertiary);\n    }\n    .green {\n      margin-right: 4px;\n    }\n  }\n\n  ul {\n    margin: 0;\n    margin-top: 8px;\n    padding: 0;\n    display: flex;\n    flex-direction: column;\n    gap: 16px;\n\n    li {\n      display: flex;\n      align-items: center;\n      gap: 8px;\n    }\n  }\n`\n\nexport const MoreButton = styled(Button)`\n  background-color: var(--md-sys-color-tertiary);\n  color: var(--md-sys-color-on-tertiary);\n  padding: 12px 20px;\n  border-radius: var(--border-radius-l);\n  margin-bottom: 16px;\n\n  &:hover {\n    background-color: var(--md-sys-color-tertiary-hover);\n  }\n`\n"],"names":["Dialog","theme","Button"],"mappings":";;;;AAGa,MAAA,kBAAkB,OAAOA,0BAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAwBrC,MAAM,cAAc,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAa5BC,0BAAM,aAAa;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MASnBA,0BAAM,SAAS;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAUd,MAAM,eAAe,OAAO;AAAA;AAAA;AAAA;AAAA,MAI7BA,0BAAM,UAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAyBT,MAAA,aAAa,OAAOC,0BAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;"}

package/dist/shared/src/components/Powerpack/PowerpackDialog.styled.es.js

@@ -0,0 +1,102 @@
+import { Dialog, theme, Button } from "@ynput/ayon-react-components";
+import styled from "styled-components";
+const PowerpackDialog = styled(Dialog)`
+  background: linear-gradient(180deg, rgb(0 121 181 / 0%) -12.03%, rgb(4 255 227 / 26%) 105.38%),
+    #15171c;
+
+  width: 550px;
+  max-height: unset;
+  height: unset;
+  border-radius: 16px;
+
+  .body {
+    gap: 32px;
+    padding: 16px 32px;
+    align-items: center;
+  }
+
+  .icon {
+    font-variation-settings: 'FILL' 1, 'wght' 200, 'GRAD' 200, 'opsz' 20;
+  }
+
+  .cancelButton {
+    background-color: unset !important;
+  }
+`;
+const MainFeature = styled.div`
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 12px;
+  padding: 8px 16px;
+  border-radius: var(--border-radius-l);
+  border: 1px solid var(--md-sys-color-tertiary);
+  color: var(--md-sys-color-tertiary);
+  width: 100%;
+
+  h1 {
+    margin: 0;
+    ${theme.headlineSmall}
+
+    display: flex;
+    align-items: center;
+    gap: var(--base-gap-small);
+  }
+
+  h2 {
+    margin: 0;
+    ${theme.bodyLarge}
+    text-align: center;
+  }
+
+  .icon {
+    font-size: 32px;
+    color: var(--md-sys-color-tertiary);
+  }
+`;
+const FeaturesList = styled.div`
+  width: 100%;
+
+  h3 {
+    ${theme.bodyMedium}
+    .green, .icon {
+      color: var(--md-sys-color-tertiary);
+    }
+    .green {
+      margin-right: 4px;
+    }
+  }
+
+  ul {
+    margin: 0;
+    margin-top: 8px;
+    padding: 0;
+    display: flex;
+    flex-direction: column;
+    gap: 16px;
+
+    li {
+      display: flex;
+      align-items: center;
+      gap: 8px;
+    }
+  }
+`;
+const MoreButton = styled(Button)`
+  background-color: var(--md-sys-color-tertiary);
+  color: var(--md-sys-color-on-tertiary);
+  padding: 12px 20px;
+  border-radius: var(--border-radius-l);
+  margin-bottom: 16px;
+
+  &:hover {
+    background-color: var(--md-sys-color-tertiary-hover);
+  }
+`;
+export {
+  FeaturesList,
+  MainFeature,
+  MoreButton,
+  PowerpackDialog
+};
+//# sourceMappingURL=PowerpackDialog.styled.es.js.map

package/dist/shared/src/components/Powerpack/PowerpackDialog.styled.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PowerpackDialog.styled.es.js","sources":["../../../../../src/components/Powerpack/PowerpackDialog.styled.ts"],"sourcesContent":["import { Button, Dialog, theme } from '@ynput/ayon-react-components'\nimport styled from 'styled-components'\n\nexport const PowerpackDialog = styled(Dialog)`\n  background: linear-gradient(180deg, rgb(0 121 181 / 0%) -12.03%, rgb(4 255 227 / 26%) 105.38%),\n    #15171c;\n\n  width: 550px;\n  max-height: unset;\n  height: unset;\n  border-radius: 16px;\n\n  .body {\n    gap: 32px;\n    padding: 16px 32px;\n    align-items: center;\n  }\n\n  .icon {\n    font-variation-settings: 'FILL' 1, 'wght' 200, 'GRAD' 200, 'opsz' 20;\n  }\n\n  .cancelButton {\n    background-color: unset !important;\n  }\n`\n\nexport const MainFeature = styled.div`\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  gap: 12px;\n  padding: 8px 16px;\n  border-radius: var(--border-radius-l);\n  border: 1px solid var(--md-sys-color-tertiary);\n  color: var(--md-sys-color-tertiary);\n  width: 100%;\n\n  h1 {\n    margin: 0;\n    ${theme.headlineSmall}\n\n    display: flex;\n    align-items: center;\n    gap: var(--base-gap-small);\n  }\n\n  h2 {\n    margin: 0;\n    ${theme.bodyLarge}\n    text-align: center;\n  }\n\n  .icon {\n    font-size: 32px;\n    color: var(--md-sys-color-tertiary);\n  }\n`\n\nexport const FeaturesList = styled.div`\n  width: 100%;\n\n  h3 {\n    ${theme.bodyMedium}\n    .green, .icon {\n      color: var(--md-sys-color-tertiary);\n    }\n    .green {\n      margin-right: 4px;\n    }\n  }\n\n  ul {\n    margin: 0;\n    margin-top: 8px;\n    padding: 0;\n    display: flex;\n    flex-direction: column;\n    gap: 16px;\n\n    li {\n      display: flex;\n      align-items: center;\n      gap: 8px;\n    }\n  }\n`\n\nexport const MoreButton = styled(Button)`\n  background-color: var(--md-sys-color-tertiary);\n  color: var(--md-sys-color-on-tertiary);\n  padding: 12px 20px;\n  border-radius: var(--border-radius-l);\n  margin-bottom: 16px;\n\n  &:hover {\n    background-color: var(--md-sys-color-tertiary-hover);\n  }\n`\n"],"names":[],"mappings":";;AAGa,MAAA,kBAAkB,OAAO,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAwBrC,MAAM,cAAc,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAa5B,MAAM,aAAa;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MASnB,MAAM,SAAS;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAUd,MAAM,eAAe,OAAO;AAAA;AAAA;AAAA;AAAA,MAI7B,MAAM,UAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAyBT,MAAA,aAAa,OAAO,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;"}

package/dist/shared/src/components/Powerpack/PricingLink.cjs.js

@@ -0,0 +1,13 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("../../../../_virtual/jsx-runtime.cjs.js");
+const React = require("react");
+const pricingUrl = "https://ynput.io/ayon/pricing?utm_source=ayon";
+const PricingLink = React.forwardRef(
+  ({ children, ...props }, ref) => {
+    return /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx("a", { href: pricingUrl, target: "_blank", rel: "noopener noreferrer", ...props, ref, children });
+  }
+);
+exports.PricingLink = PricingLink;
+exports.pricingUrl = pricingUrl;
+//# sourceMappingURL=PricingLink.cjs.js.map

package/dist/shared/src/components/Powerpack/PricingLink.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PricingLink.cjs.js","sources":["../../../../../src/components/Powerpack/PricingLink.tsx"],"sourcesContent":["import { forwardRef } from 'react'\nexport const pricingUrl = 'https://ynput.io/ayon/pricing?utm_source=ayon'\n\nexport interface PricingLinkProps extends React.HTMLAttributes<HTMLAnchorElement> {}\n\nexport const PricingLink = forwardRef<HTMLAnchorElement, PricingLinkProps>(\n  ({ children, ...props }, ref) => {\n    return (\n      <a href={pricingUrl} target=\"_blank\" rel=\"noopener noreferrer\" {...props} ref={ref}>\n        {children}\n      </a>\n    )\n  },\n)\n"],"names":["forwardRef","jsx"],"mappings":";;;;AACO,MAAM,aAAa;AAInB,MAAM,cAAcA,MAAA;AAAA,EACzB,CAAC,EAAE,UAAU,GAAG,MAAA,GAAS,QAAQ;AAE7B,WAAAC,2BAAA,kBAAA,IAAC,KAAE,EAAA,MAAM,YAAY,QAAO,UAAS,KAAI,uBAAuB,GAAG,OAAO,KACvE,SACH,CAAA;AAAA,EAAA;AAGN;;;"}

package/dist/shared/src/components/Powerpack/PricingLink.es.js

@@ -0,0 +1,13 @@
+import { j as jsxRuntimeExports } from "../../../../_virtual/jsx-runtime.es.js";
+import { forwardRef } from "react";
+const pricingUrl = "https://ynput.io/ayon/pricing?utm_source=ayon";
+const PricingLink = forwardRef(
+  ({ children, ...props }, ref) => {
+    return /* @__PURE__ */ jsxRuntimeExports.jsx("a", { href: pricingUrl, target: "_blank", rel: "noopener noreferrer", ...props, ref, children });
+  }
+);
+export {
+  PricingLink,
+  pricingUrl
+};
+//# sourceMappingURL=PricingLink.es.js.map

package/dist/shared/src/components/Powerpack/PricingLink.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PricingLink.es.js","sources":["../../../../../src/components/Powerpack/PricingLink.tsx"],"sourcesContent":["import { forwardRef } from 'react'\nexport const pricingUrl = 'https://ynput.io/ayon/pricing?utm_source=ayon'\n\nexport interface PricingLinkProps extends React.HTMLAttributes<HTMLAnchorElement> {}\n\nexport const PricingLink = forwardRef<HTMLAnchorElement, PricingLinkProps>(\n  ({ children, ...props }, ref) => {\n    return (\n      <a href={pricingUrl} target=\"_blank\" rel=\"noopener noreferrer\" {...props} ref={ref}>\n        {children}\n      </a>\n    )\n  },\n)\n"],"names":["jsx"],"mappings":";;AACO,MAAM,aAAa;AAInB,MAAM,cAAc;AAAA,EACzB,CAAC,EAAE,UAAU,GAAG,MAAA,GAAS,QAAQ;AAE7B,WAAAA,kCAAA,IAAC,KAAE,EAAA,MAAM,YAAY,QAAO,UAAS,KAAI,uBAAuB,GAAG,OAAO,KACvE,SACH,CAAA;AAAA,EAAA;AAGN;"}

package/dist/shared/src/components/ProjectTableSettings/ColumnsSettings.cjs.js

@@ -2,6 +2,7 @@
 const jsxRuntime = require("../../../../_virtual/jsx-runtime.cjs.js");
 const React = require("react");
 const styled = require("styled-components");
+const TableSettings_styled = require("./TableSettings.styled.cjs.js");
 const ColumnSettingsContext = require("../../containers/ProjectTreeTable/context/ColumnSettingsContext.cjs.js");
 const ColumnItem = require("./ColumnItem.cjs.js");
 const SortableColumnItem = require("./SortableColumnItem.cjs.js");
@@ -240,7 +241,7 @@ const ColumnsSettings = ({ columns, highlighted }) => {
             {
               items: sortedPinnedColumns.map((col) => col.value),
               strategy: sortable.verticalListSortingStrategy,
-              children: /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(Menu, { children: sortedPinnedColumns.map((column) => /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(
+              children: /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(TableSettings_styled.Menu, { children: sortedPinnedColumns.map((column) => /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(
                 SortableColumnItem,
                 {
                   id: column.value,
@@ -267,7 +268,7 @@ const ColumnsSettings = ({ columns, highlighted }) => {
                 {
                   items: sortedVisibleColumns.map((col) => col.value),
                   strategy: sortable.verticalListSortingStrategy,
-                  children: /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(Menu, { children: sortedVisibleColumns.map((column) => /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(
+                  children: /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(TableSettings_styled.Menu, { children: sortedVisibleColumns.map((column) => /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(
                     SortableColumnItem,
                     {
                       id: column.value,
@@ -287,7 +288,7 @@ const ColumnsSettings = ({ columns, highlighted }) => {
         ),
         hiddenColumns.length > 0 && /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsxs(Section, { className: isDraggingOverHidden ? "drop-target" : "", children: [
           /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(SectionTitle, { children: "Hidden Columns" }),
-          /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(Menu, { ref: menuRef, children: hiddenColumns.map((column) => {
+          /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(TableSettings_styled.Menu, { ref: menuRef, children: hiddenColumns.map((column) => {
             var _a2;
             return /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(
               SortableColumnItem,
@@ -341,12 +342,5 @@ const SectionTitle = styled.div`
   color: var(--md-sys-color-outline);
   padding: 4px 0;
 `;
-const Menu = styled.ul`
-  display: flex;
-  flex-direction: column;
-  list-style-type: none;
-  margin: 0;
-  padding: 0;
-`;
 module.exports = ColumnsSettings;
 //# sourceMappingURL=ColumnsSettings.cjs.js.map

package/dist/shared/src/components/ProjectTableSettings/ColumnsSettings.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"ColumnsSettings.cjs.js","sources":["../../../../../src/components/ProjectTableSettings/ColumnsSettings.tsx"],"sourcesContent":["// React and Styling imports\nimport { FC, useEffect, useMemo, useRef, useState } from 'react'\nimport styled from 'styled-components'\n\n// Context and Components imports\nimport {\n  ColumnsConfig,\n  useColumnSettingsContext,\n} from '@shared/containers/ProjectTreeTable/context/ColumnSettingsContext'\nimport ColumnItem from './ColumnItem'\nimport SortableColumnItem from './SortableColumnItem'\n\n// DND (Drag and Drop) imports\nimport {\n  DndContext,\n  closestCenter,\n  DragEndEvent,\n  DragStartEvent,\n  useSensor,\n  useSensors,\n  PointerSensor,\n  DragOverlay,\n  DragOverEvent,\n} from '@dnd-kit/core'\nimport { SortableContext, verticalListSortingStrategy, arrayMove } from '@dnd-kit/sortable'\n\n// Notification imports\nimport { toast } from 'react-toastify'\nimport { SettingsPanelItem } from '../SettingsPanel/SettingsPanelItemTemplate'\nimport { SettingHighlightedId } from '@shared/context'\n\ninterface ColumnsSettingsProps {\n  columns: SettingsPanelItem[]\n  highlighted?: SettingHighlightedId\n}\n\nconst ColumnsSettings: FC<ColumnsSettingsProps> = ({ columns, highlighted }) => {\n  const {\n    columnVisibility,\n    updateColumnVisibility,\n    columnPinning,\n    updateColumnPinning,\n    columnOrder,\n    setColumnsConfig,\n    columnSizing,\n  } = useColumnSettingsContext()\n\n  // State for the currently dragged column\n  const [activeId, setActiveId] = useState<string | null>(null)\n  const [isHiddenOverVisible, setIsHiddenOverVisible] = useState(false)\n  const [isDraggingOverPinned, setIsDraggingOverPinned] = useState(false)\n  const [isDraggingFromPinned, setIsDraggingFromPinned] = useState(false)\n  // Add a new state to track if we're hovering over the visible section\n  const [isHoveringVisibleSection, setIsHoveringVisibleSection] = useState(false)\n  // Add state to track if dragging over the hidden section\n  const [isDraggingOverHidden, setIsDraggingOverHidden] = useState(false)\n\n  // Setup sensors for dnd-kit\n  const sensors = useSensors(\n    useSensor(PointerSensor, {\n      activationConstraint: {\n        distance: 5,\n      },\n    }),\n  )\n\n  const menuRef = useRef<HTMLUListElement | null>(null)\n\n  // if highlighted is set, scroll to the highlighted column\n  useEffect(() => {\n    if (menuRef.current && highlighted) {\n      const highlightedElement = menuRef.current.querySelector(`#column-settings-${highlighted}`)\n      if (highlightedElement) {\n        highlightedElement.scrollIntoView({\n          behavior: 'smooth',\n          block: 'center',\n        })\n      }\n    }\n  }, [highlighted])\n\n  // Separate columns into visible, hidden, and pinned\n  const { visibleColumns, hiddenColumns, pinnedColumns } = useMemo(() => {\n    // First filter columns by visibility\n    const visible = columns.filter((col) => columnVisibility[col.value] !== false)\n    const hidden = columns.filter((col) => columnVisibility[col.value] === false)\n\n    // Then separate out pinned columns from visible\n    const pinned = visible.filter((col) => columnPinning.left?.includes(col.value))\n    const unpinnedVisible = visible.filter((col) => !columnPinning.left?.includes(col.value))\n\n    return {\n      visibleColumns: unpinnedVisible,\n      hiddenColumns: hidden,\n      pinnedColumns: pinned,\n    }\n  }, [columns, columnVisibility, columnPinning])\n\n  // Sort columns based on columnOrder\n  const sortedVisibleColumns = useMemo(() => {\n    // Create a copy of visible columns\n    const visibleCopy = [...visibleColumns]\n\n    // If we have a column order, use it to sort\n    if (columnOrder.length > 0) {\n      visibleCopy.sort((a, b) => {\n        const indexA = columnOrder.indexOf(a.value)\n        const indexB = columnOrder.indexOf(b.value)\n\n        // If column is not in order array, place at end\n        if (indexA === -1) return 1\n        if (indexB === -1) return -1\n\n        return indexA - indexB\n      })\n    }\n\n    return visibleCopy\n  }, [visibleColumns, columnOrder])\n\n  // Sort pinned columns based on columnOrder\n  const sortedPinnedColumns = useMemo(() => {\n    // Create a copy of pinned columns\n    const pinnedCopy = [...pinnedColumns]\n\n    // If we have a column order, use it to sort\n    if (columnOrder.length > 0) {\n      pinnedCopy.sort((a, b) => {\n        const indexA = columnOrder.indexOf(a.value)\n        const indexB = columnOrder.indexOf(b.value)\n\n        // If column is not in order array, place at end\n        if (indexA === -1) return 1\n        if (indexB === -1) return -1\n\n        return indexA - indexB\n      })\n    }\n\n    return pinnedCopy\n  }, [pinnedColumns, columnOrder])\n\n  const sortedVisibleColumnsIds = useMemo(\n    () => sortedVisibleColumns.map((col) => col.value),\n    [sortedVisibleColumns],\n  )\n\n  const sortedPinnedColumnsIds = useMemo(\n    () => sortedPinnedColumns.map((col) => col.value),\n    [sortedPinnedColumns],\n  )\n\n  // Toggle column visibility\n  const toggleVisibility = (columnId: string) => {\n    const newState = { ...columnVisibility }\n    // If column is currently visible, hide it\n    if (newState[columnId] !== false) {\n      newState[columnId] = false\n    } else {\n      // If column is currently hidden, show it\n      newState[columnId] = true\n    }\n    updateColumnVisibility(newState)\n  }\n\n  // Toggle column pinning\n  const togglePinning = (columnId: string) => {\n    const newState = { ...columnPinning }\n    const newVisibility = { ...columnVisibility }\n\n    // If column is currently pinned, unpin it\n    if (newState.left?.includes(columnId)) {\n      newState.left = newState.left.filter((id) => id !== columnId)\n    } else {\n      // If column is currently unpinned, pin it\n      newState.left = [...(newState.left || []), columnId]\n      // If column is hidden, show it\n      if (newVisibility[columnId] === false) {\n        newVisibility[columnId] = true\n        updateColumnVisibility(newVisibility)\n      }\n    }\n    updateColumnPinning(newState)\n  }\n\n  // When drag starts\n  const handleDragStart = (event: DragStartEvent) => {\n    const id = event.active.id as string\n    setActiveId(id)\n    setIsDraggingFromPinned(columnPinning.left?.includes(id) || false)\n  }\n\n  // Track when dragging over different sections\n  const handleDragOver = (event: DragOverEvent) => {\n    const { active, over } = event\n\n    if (over && active.id !== over.id) {\n      // Check if we're dragging a hidden column over a visible column\n      const isActiveHidden = columnVisibility[active.id as string] === false\n      const isOverVisible = columnVisibility[over.id as string] !== false\n      const isOverPinned = columnPinning.left?.includes(over.id as string) || false\n      const isOverHidden = columnVisibility[over.id as string] === false\n\n      setIsHiddenOverVisible(isActiveHidden && isOverVisible && !isOverPinned)\n      setIsDraggingOverPinned(isOverVisible && isOverPinned)\n      setIsDraggingOverHidden(isOverHidden)\n\n      // Set if we're hovering over the visible (unpinned) section\n      setIsHoveringVisibleSection(isOverVisible && !isOverPinned)\n    } else {\n      // Reset when not over any column\n      setIsHoveringVisibleSection(false)\n      setIsDraggingOverHidden(false)\n    }\n  }\n\n  // When drag ends, reset all states\n  const handleDragEnd = (event: DragEndEvent) => {\n    // Reset states\n    setIsHiddenOverVisible(false)\n    setIsDraggingOverPinned(false)\n    setIsDraggingFromPinned(false)\n    setIsHoveringVisibleSection(false)\n    setIsDraggingOverHidden(false)\n\n    const { active, over } = event\n\n    if (over && active.id !== over.id) {\n      // Find the dragged column and target column\n      const activeColumn = [...visibleColumns, ...hiddenColumns, ...pinnedColumns].find(\n        (col) => col.value === active.id,\n      )\n      const overColumn = [...visibleColumns, ...hiddenColumns, ...pinnedColumns].find(\n        (col) => col.value === over.id,\n      )\n\n      if (activeColumn && overColumn) {\n        const activeId = active.id as string\n        const overId = over.id as string\n        const isActiveVisible = columnVisibility[activeId] !== false\n        const isOverVisible = columnVisibility[overId] !== false\n        const isActivePinned = columnPinning.left?.includes(activeId) || false\n        const isOverPinned = columnPinning.left?.includes(overId) || false\n        const isOverHidden = columnVisibility[overId] === false\n\n        // Create a new config object that we'll update and apply at the end\n        const newConfig: ColumnsConfig = {\n          columnVisibility: { ...columnVisibility },\n          columnOrder: [...columnOrder],\n          columnPinning: { ...columnPinning },\n          columnSizing: { ...columnSizing },\n        }\n\n        // If we're moving a column between visible columns (including pinned)\n        if (isActiveVisible && isOverVisible) {\n          let newPinningLeft = [...(newConfig.columnPinning.left || [])]\n\n          // Handle pinning/unpinning based on target section\n          if (isActivePinned !== isOverPinned) {\n            if (isActivePinned && !isOverPinned) {\n              // Moving from pinned to unpinned section\n              newPinningLeft = newPinningLeft.filter((id) => id !== activeId)\n            } else if (!isActivePinned && isOverPinned) {\n              // Moving from unpinned to pinned section\n              newPinningLeft = [...newPinningLeft, activeId]\n            }\n          }\n\n          // Update order within the appropriate section\n          const allVisibleIds = [...sortedPinnedColumnsIds, ...sortedVisibleColumnsIds]\n          const oldIndex = allVisibleIds.indexOf(activeId)\n          const newIndex = allVisibleIds.indexOf(overId)\n\n          if (oldIndex === -1 || newIndex === -1) {\n            console.error('Invalid column order state')\n            toast.error('Invalid column order state')\n            return\n          }\n\n          const newOrder = arrayMove(allVisibleIds, oldIndex, newIndex)\n\n          // new pinning left should be ordered by the new order\n          const newPinningLeftOrdered = newOrder.filter((id) => newPinningLeft.includes(id))\n\n          // Update config object\n          newConfig.columnOrder = newOrder\n          newConfig.columnPinning = {\n            ...newConfig.columnPinning,\n            left: newPinningLeftOrdered,\n          }\n\n          // Apply all changes at once\n          setColumnsConfig(newConfig)\n        }\n\n        // If we're dragging from hidden to visible\n        else if (!isActiveVisible && isOverVisible) {\n          // Make the column visible\n          newConfig.columnVisibility[activeId] = true\n\n          // If dropping into pinned section, also pin the column\n          if (isOverPinned) {\n            const newPinningLeft = [...(newConfig.columnPinning.left || []), activeId]\n            newConfig.columnPinning.left = newPinningLeft\n          }\n\n          // Update order to place it near the over column\n          const allVisibleIds = [...sortedPinnedColumnsIds, ...sortedVisibleColumnsIds]\n\n          // Add the column to order if not already there\n          if (!allVisibleIds.includes(activeId)) {\n            const overIndex = allVisibleIds.indexOf(overId)\n            allVisibleIds.splice(overIndex, 0, activeId)\n          }\n\n          newConfig.columnOrder = allVisibleIds\n\n          // Apply all changes at once\n          setColumnsConfig(newConfig)\n        }\n\n        // If we're dragging from visible to hidden\n        else if (isActiveVisible && isOverHidden) {\n          // Make the active column hidden\n          newConfig.columnVisibility[activeId] = false\n\n          // If the column was pinned, remove it from pinned\n          if (isActivePinned) {\n            const newPinningLeft = (newConfig.columnPinning.left || []).filter(\n              (id) => id !== activeId,\n            )\n            newConfig.columnPinning.left = newPinningLeft\n          }\n\n          // Apply all changes at once\n          setColumnsConfig(newConfig)\n        }\n      }\n    }\n\n    setActiveId(null)\n  }\n\n  // Find the active column for the drag overlay\n  const activeColumn = activeId\n    ? [...visibleColumns, ...hiddenColumns, ...pinnedColumns].find((col) => col.value === activeId)\n    : null\n\n  return (\n    <DndContext\n      sensors={sensors}\n      collisionDetection={closestCenter}\n      onDragStart={handleDragStart}\n      onDragOver={handleDragOver}\n      onDragEnd={handleDragEnd}\n    >\n      <ColumnsContainer>\n        {/* Pinned Columns Section */}\n        {pinnedColumns.length > 0 && (\n          <Section className={isDraggingOverPinned && !isDraggingFromPinned ? 'drop-target' : ''}>\n            <SectionTitle>Pinned Columns</SectionTitle>\n            <SortableContext\n              items={sortedPinnedColumns.map((col) => col.value)}\n              strategy={verticalListSortingStrategy}\n            >\n              <Menu>\n                {sortedPinnedColumns.map((column) => (\n                  <SortableColumnItem\n                    key={column.value}\n                    id={column.value}\n                    column={column}\n                    isPinned={true}\n                    isHidden={false}\n                    isHighlighted={highlighted === column.value}\n                    onTogglePinning={togglePinning}\n                    onToggleVisibility={toggleVisibility}\n                  />\n                ))}\n              </Menu>\n            </SortableContext>\n          </Section>\n        )}\n\n        {/* Visible Columns Section */}\n        <Section\n          className={\n            isHiddenOverVisible || (isDraggingFromPinned && isHoveringVisibleSection)\n              ? 'drop-target'\n              : ''\n          }\n        >\n          <SectionTitle>Visible Columns</SectionTitle>\n          <SortableContext\n            items={sortedVisibleColumns.map((col) => col.value)}\n            strategy={verticalListSortingStrategy}\n          >\n            <Menu>\n              {sortedVisibleColumns.map((column) => (\n                <SortableColumnItem\n                  key={column.value}\n                  id={column.value}\n                  column={column}\n                  isPinned={false}\n                  isHidden={false}\n                  isHighlighted={highlighted === column.value}\n                  onTogglePinning={togglePinning}\n                  onToggleVisibility={toggleVisibility}\n                />\n              ))}\n            </Menu>\n          </SortableContext>\n        </Section>\n\n        {/* Hidden Columns Section */}\n        {hiddenColumns.length > 0 && (\n          <Section className={isDraggingOverHidden ? 'drop-target' : ''}>\n            <SectionTitle>Hidden Columns</SectionTitle>\n            <Menu ref={menuRef}>\n              {hiddenColumns.map((column) => (\n                <SortableColumnItem\n                  key={column.value}\n                  id={column.value}\n                  column={column}\n                  isPinned={columnPinning.left?.includes(column.value) || false}\n                  isHidden={true}\n                  isHighlighted={highlighted === column.value}\n                  onTogglePinning={togglePinning}\n                  onToggleVisibility={toggleVisibility}\n                />\n              ))}\n            </Menu>\n          </Section>\n        )}\n\n        {/* Drag Overlay */}\n        <DragOverlay>\n          {activeColumn && (\n            <ColumnItem\n              column={activeColumn}\n              isPinned={columnPinning.left?.includes(activeColumn.value) || false}\n              isHidden={columnVisibility[activeColumn.value] === false}\n              isHighlighted={highlighted === activeColumn.value}\n              dragOverlay={true}\n            />\n          )}\n        </DragOverlay>\n      </ColumnsContainer>\n    </DndContext>\n  )\n}\n\n// Styled components\nconst ColumnsContainer = styled.div`\n  display: flex;\n  flex-direction: column;\n  gap: var(--base-gap-large);\n`\n\nconst Section = styled.section`\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  overflow: hidden;\n  transition: background-color 0.2s ease;\n  border-radius: 4px;\n\n  &.drop-target {\n    background-color: var(--md-sys-color-surface-container);\n    box-shadow: 0 0 0 1px var(--md-sys-color-outline);\n  }\n`\n\nconst SectionTitle = styled.div`\n  font-weight: 500;\n  color: var(--md-sys-color-outline);\n  padding: 4px 0;\n`\n\nconst Menu = styled.ul`\n  display: flex;\n  flex-direction: column;\n  list-style-type: none;\n  margin: 0;\n  padding: 0;\n`\n\nexport default ColumnsSettings\n"],"names":["useColumnSettingsContext","useState","useSensors","useSensor","PointerSensor","useRef","useEffect","useMemo","_a","activeColumn","activeId","toast","arrayMove","jsx","DndContext","closestCenter","jsxs","SortableContext","verticalListSortingStrategy","DragOverlay"],"mappings":"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"}
+{"version":3,"file":"ColumnsSettings.cjs.js","sources":["../../../../../src/components/ProjectTableSettings/ColumnsSettings.tsx"],"sourcesContent":["// React and Styling imports\nimport { FC, useEffect, useMemo, useRef, useState } from 'react'\nimport styled from 'styled-components'\nimport * as Styled from './TableSettings.styled'\n\n// Context and Components imports\nimport {\n  ColumnsConfig,\n  useColumnSettingsContext,\n} from '@shared/containers/ProjectTreeTable/context/ColumnSettingsContext'\nimport ColumnItem from './ColumnItem'\nimport SortableColumnItem from './SortableColumnItem'\n\n// DND (Drag and Drop) imports\nimport {\n  DndContext,\n  closestCenter,\n  DragEndEvent,\n  DragStartEvent,\n  useSensor,\n  useSensors,\n  PointerSensor,\n  DragOverlay,\n  DragOverEvent,\n} from '@dnd-kit/core'\nimport { SortableContext, verticalListSortingStrategy, arrayMove } from '@dnd-kit/sortable'\n\n// Notification imports\nimport { toast } from 'react-toastify'\nimport { SettingsPanelItem } from '../SettingsPanel/SettingsPanelItemTemplate'\nimport { SettingHighlightedId } from '@shared/context'\n\ninterface ColumnsSettingsProps {\n  columns: SettingsPanelItem[]\n  highlighted?: SettingHighlightedId\n}\n\nconst ColumnsSettings: FC<ColumnsSettingsProps> = ({ columns, highlighted }) => {\n  const {\n    columnVisibility,\n    updateColumnVisibility,\n    columnPinning,\n    updateColumnPinning,\n    columnOrder,\n    setColumnsConfig,\n    columnSizing,\n  } = useColumnSettingsContext()\n\n  // State for the currently dragged column\n  const [activeId, setActiveId] = useState<string | null>(null)\n  const [isHiddenOverVisible, setIsHiddenOverVisible] = useState(false)\n  const [isDraggingOverPinned, setIsDraggingOverPinned] = useState(false)\n  const [isDraggingFromPinned, setIsDraggingFromPinned] = useState(false)\n  // Add a new state to track if we're hovering over the visible section\n  const [isHoveringVisibleSection, setIsHoveringVisibleSection] = useState(false)\n  // Add state to track if dragging over the hidden section\n  const [isDraggingOverHidden, setIsDraggingOverHidden] = useState(false)\n\n  // Setup sensors for dnd-kit\n  const sensors = useSensors(\n    useSensor(PointerSensor, {\n      activationConstraint: {\n        distance: 5,\n      },\n    }),\n  )\n\n  const menuRef = useRef<HTMLUListElement | null>(null)\n\n  // if highlighted is set, scroll to the highlighted column\n  useEffect(() => {\n    if (menuRef.current && highlighted) {\n      const highlightedElement = menuRef.current.querySelector(`#column-settings-${highlighted}`)\n      if (highlightedElement) {\n        highlightedElement.scrollIntoView({\n          behavior: 'smooth',\n          block: 'center',\n        })\n      }\n    }\n  }, [highlighted])\n\n  // Separate columns into visible, hidden, and pinned\n  const { visibleColumns, hiddenColumns, pinnedColumns } = useMemo(() => {\n    // First filter columns by visibility\n    const visible = columns.filter((col) => columnVisibility[col.value] !== false)\n    const hidden = columns.filter((col) => columnVisibility[col.value] === false)\n\n    // Then separate out pinned columns from visible\n    const pinned = visible.filter((col) => columnPinning.left?.includes(col.value))\n    const unpinnedVisible = visible.filter((col) => !columnPinning.left?.includes(col.value))\n\n    return {\n      visibleColumns: unpinnedVisible,\n      hiddenColumns: hidden,\n      pinnedColumns: pinned,\n    }\n  }, [columns, columnVisibility, columnPinning])\n\n  // Sort columns based on columnOrder\n  const sortedVisibleColumns = useMemo(() => {\n    // Create a copy of visible columns\n    const visibleCopy = [...visibleColumns]\n\n    // If we have a column order, use it to sort\n    if (columnOrder.length > 0) {\n      visibleCopy.sort((a, b) => {\n        const indexA = columnOrder.indexOf(a.value)\n        const indexB = columnOrder.indexOf(b.value)\n\n        // If column is not in order array, place at end\n        if (indexA === -1) return 1\n        if (indexB === -1) return -1\n\n        return indexA - indexB\n      })\n    }\n\n    return visibleCopy\n  }, [visibleColumns, columnOrder])\n\n  // Sort pinned columns based on columnOrder\n  const sortedPinnedColumns = useMemo(() => {\n    // Create a copy of pinned columns\n    const pinnedCopy = [...pinnedColumns]\n\n    // If we have a column order, use it to sort\n    if (columnOrder.length > 0) {\n      pinnedCopy.sort((a, b) => {\n        const indexA = columnOrder.indexOf(a.value)\n        const indexB = columnOrder.indexOf(b.value)\n\n        // If column is not in order array, place at end\n        if (indexA === -1) return 1\n        if (indexB === -1) return -1\n\n        return indexA - indexB\n      })\n    }\n\n    return pinnedCopy\n  }, [pinnedColumns, columnOrder])\n\n  const sortedVisibleColumnsIds = useMemo(\n    () => sortedVisibleColumns.map((col) => col.value),\n    [sortedVisibleColumns],\n  )\n\n  const sortedPinnedColumnsIds = useMemo(\n    () => sortedPinnedColumns.map((col) => col.value),\n    [sortedPinnedColumns],\n  )\n\n  // Toggle column visibility\n  const toggleVisibility = (columnId: string) => {\n    const newState = { ...columnVisibility }\n    // If column is currently visible, hide it\n    if (newState[columnId] !== false) {\n      newState[columnId] = false\n    } else {\n      // If column is currently hidden, show it\n      newState[columnId] = true\n    }\n    updateColumnVisibility(newState)\n  }\n\n  // Toggle column pinning\n  const togglePinning = (columnId: string) => {\n    const newState = { ...columnPinning }\n    const newVisibility = { ...columnVisibility }\n\n    // If column is currently pinned, unpin it\n    if (newState.left?.includes(columnId)) {\n      newState.left = newState.left.filter((id) => id !== columnId)\n    } else {\n      // If column is currently unpinned, pin it\n      newState.left = [...(newState.left || []), columnId]\n      // If column is hidden, show it\n      if (newVisibility[columnId] === false) {\n        newVisibility[columnId] = true\n        updateColumnVisibility(newVisibility)\n      }\n    }\n    updateColumnPinning(newState)\n  }\n\n  // When drag starts\n  const handleDragStart = (event: DragStartEvent) => {\n    const id = event.active.id as string\n    setActiveId(id)\n    setIsDraggingFromPinned(columnPinning.left?.includes(id) || false)\n  }\n\n  // Track when dragging over different sections\n  const handleDragOver = (event: DragOverEvent) => {\n    const { active, over } = event\n\n    if (over && active.id !== over.id) {\n      // Check if we're dragging a hidden column over a visible column\n      const isActiveHidden = columnVisibility[active.id as string] === false\n      const isOverVisible = columnVisibility[over.id as string] !== false\n      const isOverPinned = columnPinning.left?.includes(over.id as string) || false\n      const isOverHidden = columnVisibility[over.id as string] === false\n\n      setIsHiddenOverVisible(isActiveHidden && isOverVisible && !isOverPinned)\n      setIsDraggingOverPinned(isOverVisible && isOverPinned)\n      setIsDraggingOverHidden(isOverHidden)\n\n      // Set if we're hovering over the visible (unpinned) section\n      setIsHoveringVisibleSection(isOverVisible && !isOverPinned)\n    } else {\n      // Reset when not over any column\n      setIsHoveringVisibleSection(false)\n      setIsDraggingOverHidden(false)\n    }\n  }\n\n  // When drag ends, reset all states\n  const handleDragEnd = (event: DragEndEvent) => {\n    // Reset states\n    setIsHiddenOverVisible(false)\n    setIsDraggingOverPinned(false)\n    setIsDraggingFromPinned(false)\n    setIsHoveringVisibleSection(false)\n    setIsDraggingOverHidden(false)\n\n    const { active, over } = event\n\n    if (over && active.id !== over.id) {\n      // Find the dragged column and target column\n      const activeColumn = [...visibleColumns, ...hiddenColumns, ...pinnedColumns].find(\n        (col) => col.value === active.id,\n      )\n      const overColumn = [...visibleColumns, ...hiddenColumns, ...pinnedColumns].find(\n        (col) => col.value === over.id,\n      )\n\n      if (activeColumn && overColumn) {\n        const activeId = active.id as string\n        const overId = over.id as string\n        const isActiveVisible = columnVisibility[activeId] !== false\n        const isOverVisible = columnVisibility[overId] !== false\n        const isActivePinned = columnPinning.left?.includes(activeId) || false\n        const isOverPinned = columnPinning.left?.includes(overId) || false\n        const isOverHidden = columnVisibility[overId] === false\n\n        // Create a new config object that we'll update and apply at the end\n        const newConfig: ColumnsConfig = {\n          columnVisibility: { ...columnVisibility },\n          columnOrder: [...columnOrder],\n          columnPinning: { ...columnPinning },\n          columnSizing: { ...columnSizing },\n        }\n\n        // If we're moving a column between visible columns (including pinned)\n        if (isActiveVisible && isOverVisible) {\n          let newPinningLeft = [...(newConfig.columnPinning.left || [])]\n\n          // Handle pinning/unpinning based on target section\n          if (isActivePinned !== isOverPinned) {\n            if (isActivePinned && !isOverPinned) {\n              // Moving from pinned to unpinned section\n              newPinningLeft = newPinningLeft.filter((id) => id !== activeId)\n            } else if (!isActivePinned && isOverPinned) {\n              // Moving from unpinned to pinned section\n              newPinningLeft = [...newPinningLeft, activeId]\n            }\n          }\n\n          // Update order within the appropriate section\n          const allVisibleIds = [...sortedPinnedColumnsIds, ...sortedVisibleColumnsIds]\n          const oldIndex = allVisibleIds.indexOf(activeId)\n          const newIndex = allVisibleIds.indexOf(overId)\n\n          if (oldIndex === -1 || newIndex === -1) {\n            console.error('Invalid column order state')\n            toast.error('Invalid column order state')\n            return\n          }\n\n          const newOrder = arrayMove(allVisibleIds, oldIndex, newIndex)\n\n          // new pinning left should be ordered by the new order\n          const newPinningLeftOrdered = newOrder.filter((id) => newPinningLeft.includes(id))\n\n          // Update config object\n          newConfig.columnOrder = newOrder\n          newConfig.columnPinning = {\n            ...newConfig.columnPinning,\n            left: newPinningLeftOrdered,\n          }\n\n          // Apply all changes at once\n          setColumnsConfig(newConfig)\n        }\n\n        // If we're dragging from hidden to visible\n        else if (!isActiveVisible && isOverVisible) {\n          // Make the column visible\n          newConfig.columnVisibility[activeId] = true\n\n          // If dropping into pinned section, also pin the column\n          if (isOverPinned) {\n            const newPinningLeft = [...(newConfig.columnPinning.left || []), activeId]\n            newConfig.columnPinning.left = newPinningLeft\n          }\n\n          // Update order to place it near the over column\n          const allVisibleIds = [...sortedPinnedColumnsIds, ...sortedVisibleColumnsIds]\n\n          // Add the column to order if not already there\n          if (!allVisibleIds.includes(activeId)) {\n            const overIndex = allVisibleIds.indexOf(overId)\n            allVisibleIds.splice(overIndex, 0, activeId)\n          }\n\n          newConfig.columnOrder = allVisibleIds\n\n          // Apply all changes at once\n          setColumnsConfig(newConfig)\n        }\n\n        // If we're dragging from visible to hidden\n        else if (isActiveVisible && isOverHidden) {\n          // Make the active column hidden\n          newConfig.columnVisibility[activeId] = false\n\n          // If the column was pinned, remove it from pinned\n          if (isActivePinned) {\n            const newPinningLeft = (newConfig.columnPinning.left || []).filter(\n              (id) => id !== activeId,\n            )\n            newConfig.columnPinning.left = newPinningLeft\n          }\n\n          // Apply all changes at once\n          setColumnsConfig(newConfig)\n        }\n      }\n    }\n\n    setActiveId(null)\n  }\n\n  // Find the active column for the drag overlay\n  const activeColumn = activeId\n    ? [...visibleColumns, ...hiddenColumns, ...pinnedColumns].find((col) => col.value === activeId)\n    : null\n\n  return (\n    <DndContext\n      sensors={sensors}\n      collisionDetection={closestCenter}\n      onDragStart={handleDragStart}\n      onDragOver={handleDragOver}\n      onDragEnd={handleDragEnd}\n    >\n      <ColumnsContainer>\n        {/* Pinned Columns Section */}\n        {pinnedColumns.length > 0 && (\n          <Section className={isDraggingOverPinned && !isDraggingFromPinned ? 'drop-target' : ''}>\n            <SectionTitle>Pinned Columns</SectionTitle>\n            <SortableContext\n              items={sortedPinnedColumns.map((col) => col.value)}\n              strategy={verticalListSortingStrategy}\n            >\n              <Styled.Menu>\n                {sortedPinnedColumns.map((column) => (\n                  <SortableColumnItem\n                    key={column.value}\n                    id={column.value}\n                    column={column}\n                    isPinned={true}\n                    isHidden={false}\n                    isHighlighted={highlighted === column.value}\n                    onTogglePinning={togglePinning}\n                    onToggleVisibility={toggleVisibility}\n                  />\n                ))}\n              </Styled.Menu>\n            </SortableContext>\n          </Section>\n        )}\n\n        {/* Visible Columns Section */}\n        <Section\n          className={\n            isHiddenOverVisible || (isDraggingFromPinned && isHoveringVisibleSection)\n              ? 'drop-target'\n              : ''\n          }\n        >\n          <SectionTitle>Visible Columns</SectionTitle>\n          <SortableContext\n            items={sortedVisibleColumns.map((col) => col.value)}\n            strategy={verticalListSortingStrategy}\n          >\n            <Styled.Menu>\n              {sortedVisibleColumns.map((column) => (\n                <SortableColumnItem\n                  key={column.value}\n                  id={column.value}\n                  column={column}\n                  isPinned={false}\n                  isHidden={false}\n                  isHighlighted={highlighted === column.value}\n                  onTogglePinning={togglePinning}\n                  onToggleVisibility={toggleVisibility}\n                />\n              ))}\n            </Styled.Menu>\n          </SortableContext>\n        </Section>\n\n        {/* Hidden Columns Section */}\n        {hiddenColumns.length > 0 && (\n          <Section className={isDraggingOverHidden ? 'drop-target' : ''}>\n            <SectionTitle>Hidden Columns</SectionTitle>\n            <Styled.Menu ref={menuRef}>\n              {hiddenColumns.map((column) => (\n                <SortableColumnItem\n                  key={column.value}\n                  id={column.value}\n                  column={column}\n                  isPinned={columnPinning.left?.includes(column.value) || false}\n                  isHidden={true}\n                  isHighlighted={highlighted === column.value}\n                  onTogglePinning={togglePinning}\n                  onToggleVisibility={toggleVisibility}\n                />\n              ))}\n            </Styled.Menu>\n          </Section>\n        )}\n\n        {/* Drag Overlay */}\n        <DragOverlay>\n          {activeColumn && (\n            <ColumnItem\n              column={activeColumn}\n              isPinned={columnPinning.left?.includes(activeColumn.value) || false}\n              isHidden={columnVisibility[activeColumn.value] === false}\n              isHighlighted={highlighted === activeColumn.value}\n              dragOverlay={true}\n            />\n          )}\n        </DragOverlay>\n      </ColumnsContainer>\n    </DndContext>\n  )\n}\n\n// Styled components\nconst ColumnsContainer = styled.div`\n  display: flex;\n  flex-direction: column;\n  gap: var(--base-gap-large);\n`\n\nconst Section = styled.section`\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  overflow: hidden;\n  transition: background-color 0.2s ease;\n  border-radius: 4px;\n\n  &.drop-target {\n    background-color: var(--md-sys-color-surface-container);\n    box-shadow: 0 0 0 1px var(--md-sys-color-outline);\n  }\n`\n\nconst SectionTitle = styled.div`\n  font-weight: 500;\n  color: var(--md-sys-color-outline);\n  padding: 4px 0;\n`\n\nexport default ColumnsSettings\n"],"names":["useColumnSettingsContext","useState","useSensors","useSensor","PointerSensor","useRef","useEffect","useMemo","_a","activeColumn","activeId","toast","arrayMove","jsx","DndContext","closestCenter","jsxs","SortableContext","verticalListSortingStrategy","Styled.Menu","DragOverlay"],"mappings":"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"}

package/dist/shared/src/components/ProjectTableSettings/ColumnsSettings.es.js

@@ -1,6 +1,7 @@
 import { j as jsxRuntimeExports } from "../../../../_virtual/jsx-runtime.es.js";
 import { useState, useRef, useEffect, useMemo } from "react";
 import styled from "styled-components";
+import { Menu } from "./TableSettings.styled.es.js";
 import { useColumnSettingsContext } from "../../containers/ProjectTreeTable/context/ColumnSettingsContext.es.js";
 import ColumnItem from "./ColumnItem.es.js";
 import SortableColumnItem from "./SortableColumnItem.es.js";
@@ -340,13 +341,6 @@ const SectionTitle = styled.div`
   color: var(--md-sys-color-outline);
   padding: 4px 0;
 `;
-const Menu = styled.ul`
-  display: flex;
-  flex-direction: column;
-  list-style-type: none;
-  margin: 0;
-  padding: 0;
-`;
 export {
   ColumnsSettings as default
 };