@deephaven/components 1.4.1-beta.0 → 1.4.1-react19.43

package/dist/navigation/Menu.js.map

@@ -1 +1 @@
-{"version":3,"file":"Menu.js","names":["React","MenuItem","jsx","_jsx","Menu","_ref","items","onSelect","undefined","dataTestId","className","children","map","item","itemIndex","title"],"sources":["../../src/navigation/Menu.tsx"],"sourcesContent":["import React from 'react';\nimport MenuItem, { type MenuItemDef } from './MenuItem';\nimport './Menu.scss';\n\nexport type MenuSelectCallback = (itemIndex: number) => void;\n\nexport type MenuProps = {\n  items: readonly MenuItemDef[];\n  onSelect?: MenuSelectCallback;\n  'data-testid'?: string;\n};\n\nexport function Menu({\n  items,\n  onSelect = () => undefined,\n  'data-testid': dataTestId,\n}: MenuProps): JSX.Element {\n  return (\n    <div className=\"navigation-menu-view\" data-testid={dataTestId}>\n      <ul className=\"navigation-menu-list\">\n        {items.map((item, itemIndex) => (\n          <li key={item.title}>\n            <MenuItem\n              item={item}\n              onSelect={() => {\n                onSelect(itemIndex);\n              }}\n            />\n          </li>\n        ))}\n      </ul>\n    </div>\n  );\n}\n\nexport default Menu;\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AAAC,OACnBC,QAAQ;AAAA;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAWf,OAAO,SAASC,IAAIA,CAAAC,IAAA,EAIO;EAAA,IAJN;IACnBC,KAAK;IACLC,QAAQ,EAARA,SAAQ,GAAGA,CAAA,KAAMC,SAAS;IAC1B,aAAa,EAAEC;EACN,CAAC,GAAAJ,IAAA;EACV,oBACEF,IAAA;IAAKO,SAAS,EAAC,sBAAsB;IAAC,eAAaD,UAAW;IAAAE,QAAA,eAC5DR,IAAA;MAAIO,SAAS,EAAC,sBAAsB;MAAAC,QAAA,EACjCL,KAAK,CAACM,GAAG,CAAC,CAACC,IAAI,EAAEC,SAAS,kBACzBX,IAAA;QAAAQ,QAAA,eACER,IAAA,CAACF,QAAQ;UACPY,IAAI,EAAEA,IAAK;UACXN,QAAQ,EAAEA,CAAA,KAAM;YACdA,SAAQ,CAACO,SAAS,CAAC;UACrB;QAAE,CACH;MAAC,GANKD,IAAI,CAACE,KAOV,CACL;IAAC,CACA;EAAC,CACF,CAAC;AAEV;AAEA,eAAeX,IAAI"}
+{"version":3,"file":"Menu.js","names":["React","MenuItem","jsx","_jsx","Menu","_ref","items","onSelect","undefined","dataTestId","className","children","map","item","itemIndex","title"],"sources":["../../src/navigation/Menu.tsx"],"sourcesContent":["import React from 'react';\nimport MenuItem, { type MenuItemDef } from './MenuItem';\nimport './Menu.scss';\n\nexport type MenuSelectCallback = (itemIndex: number) => void;\n\nexport type MenuProps = {\n  items: readonly MenuItemDef[];\n  onSelect?: MenuSelectCallback;\n  'data-testid'?: string;\n};\n\nexport function Menu({\n  items,\n  onSelect = () => undefined,\n  'data-testid': dataTestId,\n}: MenuProps): JSX.Element {\n  return (\n    <div className=\"navigation-menu-view\" data-testid={dataTestId}>\n      <ul className=\"navigation-menu-list\">\n        {items.map((item, itemIndex) => (\n          <li key={item.title}>\n            <MenuItem\n              item={item}\n              onSelect={() => {\n                onSelect(itemIndex);\n              }}\n            />\n          </li>\n        ))}\n      </ul>\n    </div>\n  );\n}\n\nexport default Menu;\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AAAC,OACnBC,QAAQ;AAAA;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAWf,OAAO,SAASC,IAAIA,CAAAC,IAAA,EAIO;EAAA,IAJN;IACnBC,KAAK;IACLC,QAAQ,EAARA,SAAQ,GAAGA,CAAA,KAAMC,SAAS;IAC1B,aAAa,EAAEC;EACN,CAAC,GAAAJ,IAAA;EACV,oBACEF,IAAA;IAAKO,SAAS,EAAC,sBAAsB;IAAC,eAAaD,UAAW;IAAAE,QAAA,eAC5DR,IAAA;MAAIO,SAAS,EAAC,sBAAsB;MAAAC,QAAA,EACjCL,KAAK,CAACM,GAAG,CAAC,CAACC,IAAI,EAAEC,SAAS,kBACzBX,IAAA;QAAAQ,QAAA,eACER,IAAA,CAACF,QAAQ;UACPY,IAAI,EAAEA,IAAK;UACXN,QAAQ,EAAEA,CAAA,KAAM;YACdA,SAAQ,CAACO,SAAS,CAAC;UACrB;QAAE,CACH;MAAC,GANKD,IAAI,CAACE,KAOV,CACL;IAAC,CACA;EAAC,CACF,CAAC;AAEV;AAEA,eAAeX,IAAI","ignoreList":[]}

package/dist/navigation/MenuItem.js

@@ -3,8 +3,7 @@ import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import { vsChevronRight } from '@deephaven/icons';
 import "./MenuItem.css";
 import UISwitch from "../UISwitch.js";
-import { jsx as _jsx } from "react/jsx-runtime";
-import { jsxs as _jsxs } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 function isSwitchMenuItemType(item) {
   return item.isOn !== undefined;
 }

package/dist/navigation/MenuItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"MenuItem.js","names":["React","useMemo","FontAwesomeIcon","vsChevronRight","UISwitch","jsx","_jsx","jsxs","_jsxs","isSwitchMenuItemType","item","isOn","undefined","MenuItem","_ref","onSelect","dataTestId","icon","subtitle","title","handleSelect","onChange","className","concat","onClick","onKeyDown","event","key","tabIndex","role","children","on","stopPropagation"],"sources":["../../src/navigation/MenuItem.tsx"],"sourcesContent":["import React, { useMemo } from 'react';\nimport { type IconProp } from '@fortawesome/fontawesome-svg-core';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport { vsChevronRight } from '@deephaven/icons';\nimport './MenuItem.scss';\n\nimport UISwitch from '../UISwitch';\n\nexport type MenuItemDef = {\n  title: string;\n  subtitle?: string;\n  icon?: IconProp;\n};\n\nexport type SwitchMenuItemDef = MenuItemDef & {\n  isOn: boolean;\n  onChange: (isOn: boolean) => void;\n};\n\nfunction isSwitchMenuItemType(item: MenuItemDef): item is SwitchMenuItemDef {\n  return (item as SwitchMenuItemDef).isOn !== undefined;\n}\n\nexport type MenuItemProps = {\n  item: MenuItemDef;\n  onSelect?: () => void;\n  'data-testid'?: string;\n};\n\n/**\n * @param props.item The menu item to set. Set a SwitchMenuItemDef to show a switch.\n * @param props.onSelect Called when the menu item is selected\n */\nexport function MenuItem({\n  item,\n  onSelect = () => undefined,\n  'data-testid': dataTestId,\n}: MenuItemProps): JSX.Element {\n  const { icon, subtitle, title } = item;\n  const handleSelect = useMemo(() => {\n    if (isSwitchMenuItemType(item)) {\n      return () => {\n        item.onChange(!item.isOn);\n      };\n    }\n    return onSelect;\n  }, [item, onSelect]);\n  return (\n    <div\n      className=\"btn btn-navigation-menu-item\"\n      data-testid={`menu-item-${title}`}\n      onClick={handleSelect}\n      onKeyDown={event => {\n        if (event.key === 'Enter' || event.key === ' ') {\n          handleSelect();\n        }\n      }}\n      tabIndex={0}\n      role=\"menuitem\"\n    >\n      {icon !== undefined && (\n        <div className=\"icon\">\n          <FontAwesomeIcon icon={icon} />\n        </div>\n      )}\n      <div className=\"title\">{title}</div>\n      {subtitle !== undefined && <div className=\"shortcut\">{subtitle}</div>}\n      <div className=\"accessory\" data-testid={dataTestId}>\n        {isSwitchMenuItemType(item) ? (\n          <UISwitch\n            on={item.isOn}\n            onClick={event => {\n              event.stopPropagation();\n              handleSelect();\n            }}\n          />\n        ) : (\n          <FontAwesomeIcon icon={vsChevronRight} />\n        )}\n      </div>\n    </div>\n  );\n}\n\nexport default MenuItem;\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,OAAO,QAAQ,OAAO;AAEtC,SAASC,eAAe,QAAQ,gCAAgC;AAChE,SAASC,cAAc,QAAQ,kBAAkB;AAAC;AAAA,OAG3CC,QAAQ;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAAA,SAAAC,IAAA,IAAAC,KAAA;AAaf,SAASC,oBAAoBA,CAACC,IAAiB,EAA6B;EAC1E,OAAQA,IAAI,CAAuBC,IAAI,KAAKC,SAAS;AACvD;AAQA;AACA;AACA;AACA;AACA,OAAO,SAASC,QAAQA,CAAAC,IAAA,EAIO;EAAA,IAJN;IACvBJ,IAAI;IACJK,QAAQ,GAAGA,CAAA,KAAMH,SAAS;IAC1B,aAAa,EAAEI;EACF,CAAC,GAAAF,IAAA;EACd,IAAM;IAAEG,IAAI;IAAEC,QAAQ;IAAEC;EAAM,CAAC,GAAGT,IAAI;EACtC,IAAMU,YAAY,GAAGnB,OAAO,CAAC,MAAM;IACjC,IAAIQ,oBAAoB,CAACC,IAAI,CAAC,EAAE;MAC9B,OAAO,MAAM;QACXA,IAAI,CAACW,QAAQ,CAAC,CAACX,IAAI,CAACC,IAAI,CAAC;MAC3B,CAAC;IACH;IACA,OAAOI,QAAQ;EACjB,CAAC,EAAE,CAACL,IAAI,EAAEK,QAAQ,CAAC,CAAC;EACpB,oBACEP,KAAA;IACEc,SAAS,EAAC,8BAA8B;IACxC,4BAAAC,MAAA,CAA0BJ,KAAK,CAAG;IAClCK,OAAO,EAAEJ,YAAa;IACtBK,SAAS,EAAEC,KAAK,IAAI;MAClB,IAAIA,KAAK,CAACC,GAAG,KAAK,OAAO,IAAID,KAAK,CAACC,GAAG,KAAK,GAAG,EAAE;QAC9CP,YAAY,CAAC,CAAC;MAChB;IACF,CAAE;IACFQ,QAAQ,EAAE,CAAE;IACZC,IAAI,EAAC,UAAU;IAAAC,QAAA,GAEdb,IAAI,KAAKL,SAAS,iBACjBN,IAAA;MAAKgB,SAAS,EAAC,MAAM;MAAAQ,QAAA,eACnBxB,IAAA,CAACJ,eAAe;QAACe,IAAI,EAAEA;MAAK,CAAE;IAAC,CAC5B,CACN,eACDX,IAAA;MAAKgB,SAAS,EAAC,OAAO;MAAAQ,QAAA,EAAEX;IAAK,CAAM,CAAC,EACnCD,QAAQ,KAAKN,SAAS,iBAAIN,IAAA;MAAKgB,SAAS,EAAC,UAAU;MAAAQ,QAAA,EAAEZ;IAAQ,CAAM,CAAC,eACrEZ,IAAA;MAAKgB,SAAS,EAAC,WAAW;MAAC,eAAaN,UAAW;MAAAc,QAAA,EAChDrB,oBAAoB,CAACC,IAAI,CAAC,gBACzBJ,IAAA,CAACF,QAAQ;QACP2B,EAAE,EAAErB,IAAI,CAACC,IAAK;QACda,OAAO,EAAEE,KAAK,IAAI;UAChBA,KAAK,CAACM,eAAe,CAAC,CAAC;UACvBZ,YAAY,CAAC,CAAC;QAChB;MAAE,CACH,CAAC,gBAEFd,IAAA,CAACJ,eAAe;QAACe,IAAI,EAAEd;MAAe,CAAE;IACzC,CACE,CAAC;EAAA,CACH,CAAC;AAEV;AAEA,eAAeU,QAAQ"}
+{"version":3,"file":"MenuItem.js","names":["React","useMemo","FontAwesomeIcon","vsChevronRight","UISwitch","jsx","_jsx","jsxs","_jsxs","isSwitchMenuItemType","item","isOn","undefined","MenuItem","_ref","onSelect","dataTestId","icon","subtitle","title","handleSelect","onChange","className","concat","onClick","onKeyDown","event","key","tabIndex","role","children","on","stopPropagation"],"sources":["../../src/navigation/MenuItem.tsx"],"sourcesContent":["import React, { useMemo } from 'react';\nimport { type IconProp } from '@fortawesome/fontawesome-svg-core';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport { vsChevronRight } from '@deephaven/icons';\nimport './MenuItem.scss';\n\nimport UISwitch from '../UISwitch';\n\nexport type MenuItemDef = {\n  title: string;\n  subtitle?: string;\n  icon?: IconProp;\n};\n\nexport type SwitchMenuItemDef = MenuItemDef & {\n  isOn: boolean;\n  onChange: (isOn: boolean) => void;\n};\n\nfunction isSwitchMenuItemType(item: MenuItemDef): item is SwitchMenuItemDef {\n  return (item as SwitchMenuItemDef).isOn !== undefined;\n}\n\nexport type MenuItemProps = {\n  item: MenuItemDef;\n  onSelect?: () => void;\n  'data-testid'?: string;\n};\n\n/**\n * @param props.item The menu item to set. Set a SwitchMenuItemDef to show a switch.\n * @param props.onSelect Called when the menu item is selected\n */\nexport function MenuItem({\n  item,\n  onSelect = () => undefined,\n  'data-testid': dataTestId,\n}: MenuItemProps): JSX.Element {\n  const { icon, subtitle, title } = item;\n  const handleSelect = useMemo(() => {\n    if (isSwitchMenuItemType(item)) {\n      return () => {\n        item.onChange(!item.isOn);\n      };\n    }\n    return onSelect;\n  }, [item, onSelect]);\n  return (\n    <div\n      className=\"btn btn-navigation-menu-item\"\n      data-testid={`menu-item-${title}`}\n      onClick={handleSelect}\n      onKeyDown={event => {\n        if (event.key === 'Enter' || event.key === ' ') {\n          handleSelect();\n        }\n      }}\n      tabIndex={0}\n      role=\"menuitem\"\n    >\n      {icon !== undefined && (\n        <div className=\"icon\">\n          <FontAwesomeIcon icon={icon} />\n        </div>\n      )}\n      <div className=\"title\">{title}</div>\n      {subtitle !== undefined && <div className=\"shortcut\">{subtitle}</div>}\n      <div className=\"accessory\" data-testid={dataTestId}>\n        {isSwitchMenuItemType(item) ? (\n          <UISwitch\n            on={item.isOn}\n            onClick={event => {\n              event.stopPropagation();\n              handleSelect();\n            }}\n          />\n        ) : (\n          <FontAwesomeIcon icon={vsChevronRight} />\n        )}\n      </div>\n    </div>\n  );\n}\n\nexport default MenuItem;\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,OAAO,QAAQ,OAAO;AAEtC,SAASC,eAAe,QAAQ,gCAAgC;AAChE,SAASC,cAAc,QAAQ,kBAAkB;AAAC;AAAA,OAG3CC,QAAQ;AAAA,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAaf,SAASC,oBAAoBA,CAACC,IAAiB,EAA6B;EAC1E,OAAQA,IAAI,CAAuBC,IAAI,KAAKC,SAAS;AACvD;AAQA;AACA;AACA;AACA;AACA,OAAO,SAASC,QAAQA,CAAAC,IAAA,EAIO;EAAA,IAJN;IACvBJ,IAAI;IACJK,QAAQ,GAAGA,CAAA,KAAMH,SAAS;IAC1B,aAAa,EAAEI;EACF,CAAC,GAAAF,IAAA;EACd,IAAM;IAAEG,IAAI;IAAEC,QAAQ;IAAEC;EAAM,CAAC,GAAGT,IAAI;EACtC,IAAMU,YAAY,GAAGnB,OAAO,CAAC,MAAM;IACjC,IAAIQ,oBAAoB,CAACC,IAAI,CAAC,EAAE;MAC9B,OAAO,MAAM;QACXA,IAAI,CAACW,QAAQ,CAAC,CAACX,IAAI,CAACC,IAAI,CAAC;MAC3B,CAAC;IACH;IACA,OAAOI,QAAQ;EACjB,CAAC,EAAE,CAACL,IAAI,EAAEK,QAAQ,CAAC,CAAC;EACpB,oBACEP,KAAA;IACEc,SAAS,EAAC,8BAA8B;IACxC,4BAAAC,MAAA,CAA0BJ,KAAK,CAAG;IAClCK,OAAO,EAAEJ,YAAa;IACtBK,SAAS,EAAEC,KAAK,IAAI;MAClB,IAAIA,KAAK,CAACC,GAAG,KAAK,OAAO,IAAID,KAAK,CAACC,GAAG,KAAK,GAAG,EAAE;QAC9CP,YAAY,CAAC,CAAC;MAChB;IACF,CAAE;IACFQ,QAAQ,EAAE,CAAE;IACZC,IAAI,EAAC,UAAU;IAAAC,QAAA,GAEdb,IAAI,KAAKL,SAAS,iBACjBN,IAAA;MAAKgB,SAAS,EAAC,MAAM;MAAAQ,QAAA,eACnBxB,IAAA,CAACJ,eAAe;QAACe,IAAI,EAAEA;MAAK,CAAE;IAAC,CAC5B,CACN,eACDX,IAAA;MAAKgB,SAAS,EAAC,OAAO;MAAAQ,QAAA,EAAEX;IAAK,CAAM,CAAC,EACnCD,QAAQ,KAAKN,SAAS,iBAAIN,IAAA;MAAKgB,SAAS,EAAC,UAAU;MAAAQ,QAAA,EAAEZ;IAAQ,CAAM,CAAC,eACrEZ,IAAA;MAAKgB,SAAS,EAAC,WAAW;MAAC,eAAaN,UAAW;MAAAc,QAAA,EAChDrB,oBAAoB,CAACC,IAAI,CAAC,gBACzBJ,IAAA,CAACF,QAAQ;QACP2B,EAAE,EAAErB,IAAI,CAACC,IAAK;QACda,OAAO,EAAEE,KAAK,IAAI;UAChBA,KAAK,CAACM,eAAe,CAAC,CAAC;UACvBZ,YAAY,CAAC,CAAC;QAChB;MAAE,CACH,CAAC,gBAEFd,IAAA,CAACJ,eAAe;QAACe,IAAI,EAAEd;MAAe,CAAE;IACzC,CACE,CAAC;EAAA,CACH,CAAC;AAEV;AAEA,eAAeU,QAAQ","ignoreList":[]}

package/dist/navigation/NavTab.d.ts

@@ -11,6 +11,6 @@ interface NavTabProps {
     isDraggable: boolean;
     contextActions?: ResolvableContextAction | ResolvableContextAction[];
 }
-declare const NavTab: React.MemoExoticComponent<({ tab, onClose, onSelect, isActive, activeRef, index, isDraggable, contextActions, }: NavTabProps) => JSX.Element>;
+declare const NavTab: React.MemoExoticComponent<({ tab, onClose, onSelect, isActive, activeRef, index, isDraggable, contextActions, }: NavTabProps) => import("react/jsx-runtime").JSX.Element>;
 export default NavTab;
 //# sourceMappingURL=NavTab.d.ts.map

package/dist/navigation/NavTab.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"NavTab.d.ts","sourceRoot":"","sources":["../../src/navigation/NavTab.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAe,MAAM,OAAO,CAAC;AAKpC,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAG/C,OAAO,EAAE,KAAK,uBAAuB,EAAE,MAAM,oBAAoB,CAAC;AAGlE,UAAU,WAAW;IACnB,GAAG,EAAE,UAAU,CAAC;IAChB,QAAQ,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IAChC,OAAO,CAAC,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IAChC,QAAQ,EAAE,OAAO,CAAC;IAClB,SAAS,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC,CAAC;IAC3C,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,EAAE,OAAO,CAAC;IACrB,cAAc,CAAC,EAAE,uBAAuB,GAAG,uBAAuB,EAAE,CAAC;CACtE;AAED,QAAA,MAAM,MAAM,mHAUP,WAAW,iBAwFf,CAAC;AAIF,eAAe,MAAM,CAAC"}
+{"version":3,"file":"NavTab.d.ts","sourceRoot":"","sources":["../../src/navigation/NavTab.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAe,MAAM,OAAO,CAAC;AAKpC,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAG/C,OAAO,EAAE,KAAK,uBAAuB,EAAE,MAAM,oBAAoB,CAAC;AAGlE,UAAU,WAAW;IACnB,GAAG,EAAE,UAAU,CAAC;IAChB,QAAQ,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IAChC,OAAO,CAAC,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IAChC,QAAQ,EAAE,OAAO,CAAC;IAClB,SAAS,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC,CAAC;IAC3C,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,EAAE,OAAO,CAAC;IACrB,cAAc,CAAC,EAAE,uBAAuB,GAAG,uBAAuB,EAAE,CAAC;CACtE;AAED,QAAA,MAAM,MAAM,mHAUP,WAAW,6CAwFf,CAAC;AAIF,eAAe,MAAM,CAAC"}

package/dist/navigation/NavTab.js

@@ -5,14 +5,13 @@ function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol"
 function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
 import React, { memo } from 'react';
 import classNames from 'classnames';
-import { Draggable } from 'react-beautiful-dnd';
+import { Draggable } from '@hello-pangea/dnd';
 import { vsClose } from '@deephaven/icons';
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import Button from "../Button.js";
 import ContextActions from "../context-actions/ContextActions.js";
 import { Tooltip } from "../popper/index.js";
-import { jsx as _jsx } from "react/jsx-runtime";
-import { jsxs as _jsxs } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 var NavTab = /*#__PURE__*/memo(_ref => {
   var {
     tab,
@@ -58,13 +57,13 @@ var NavTab = /*#__PURE__*/memo(_ref => {
         onAuxClick: e => {
           // Middle mouse button was clicked, and no buttons remain pressed
           if (isClosable && e.button === 1 && e.buttons === 0) {
-            onClose === null || onClose === void 0 ? void 0 : onClose(key);
+            onClose === null || onClose === void 0 || onClose(key);
           }
         },
         onClick: e => {
           // have to have seperate check onClick for Safari not supporting AuxClick
           if (isClosable && e.button === 1 && e.buttons === 0) {
-            onClose === null || onClose === void 0 ? void 0 : onClose(key);
+            onClose === null || onClose === void 0 || onClose(key);
             return;
           }
           // Left mouse button was clicked, and no buttons remain pressed
@@ -87,7 +86,7 @@ var NavTab = /*#__PURE__*/memo(_ref => {
           kind: "ghost",
           className: "btn-nav-tab-close",
           onClick: event => {
-            onClose === null || onClose === void 0 ? void 0 : onClose(key);
+            onClose === null || onClose === void 0 || onClose(key);
             event.stopPropagation();
             event.preventDefault();
           },

package/dist/navigation/NavTab.js.map

@@ -1 +1 @@
-{"version":3,"file":"NavTab.js","names":["React","memo","classNames","Draggable","vsClose","FontAwesomeIcon","Button","ContextActions","Tooltip","jsx","_jsx","jsxs","_jsxs","NavTab","_ref","tab","onClose","onSelect","isActive","activeRef","index","isDraggable","contextActions","key","isClosable","title","icon","iconElem","isValidElement","draggableId","isDragDisabled","children","provided","snapshot","className","ref","_objectSpread","innerRef","draggableProps","dragHandleProps","active","dragging","isDragging","concat","role","tabIndex","onAuxClick","e","button","buttons","onClick","target","focus","onKeyPress","event","kind","stopPropagation","preventDefault","tooltip","actions","displayName"],"sources":["../../src/navigation/NavTab.tsx"],"sourcesContent":["import React, { memo } from 'react';\nimport classNames from 'classnames';\nimport { Draggable } from 'react-beautiful-dnd';\nimport { type IconDefinition, vsClose } from '@deephaven/icons';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport type { NavTabItem } from './NavTabList';\nimport Button from '../Button';\nimport ContextActions from '../context-actions/ContextActions';\nimport { type ResolvableContextAction } from '../context-actions';\nimport { Tooltip } from '../popper';\n\ninterface NavTabProps {\n  tab: NavTabItem;\n  onSelect: (key: string) => void;\n  onClose?: (key: string) => void;\n  isActive: boolean;\n  activeRef: React.RefObject<HTMLDivElement>;\n  index: number;\n  isDraggable: boolean;\n  contextActions?: ResolvableContextAction | ResolvableContextAction[];\n}\n\nconst NavTab = memo(\n  ({\n    tab,\n    onClose,\n    onSelect,\n    isActive,\n    activeRef,\n    index,\n    isDraggable,\n    contextActions,\n  }: NavTabProps) => {\n    const { key, isClosable = onClose != null, title, icon } = tab;\n\n    let iconElem: JSX.Element | undefined;\n    if (icon != null) {\n      iconElem = React.isValidElement(icon) ? (\n        icon\n      ) : (\n        <FontAwesomeIcon icon={icon as IconDefinition} />\n      );\n    }\n\n    return (\n      <Draggable\n        draggableId={key}\n        key={key}\n        index={index}\n        isDragDisabled={!isDraggable}\n      >\n        {(provided, snapshot) => (\n          <div\n            className=\"context-menu-wrapper\"\n            ref={isActive ? activeRef : null}\n          >\n            <div\n              ref={provided.innerRef}\n              // eslint-disable-next-line react/jsx-props-no-spreading\n              {...provided.draggableProps}\n              // eslint-disable-next-line react/jsx-props-no-spreading\n              {...provided.dragHandleProps}\n              className={classNames(\n                'btn btn-link btn-nav-tab',\n                { active: isActive },\n                { dragging: snapshot.isDragging }\n              )}\n              data-testid={`btn-nav-tab-${title}`}\n              role=\"tab\"\n              tabIndex={0}\n              onAuxClick={e => {\n                // Middle mouse button was clicked, and no buttons remain pressed\n                if (isClosable && e.button === 1 && e.buttons === 0) {\n                  onClose?.(key);\n                }\n              }}\n              onClick={e => {\n                // have to have seperate check onClick for Safari not supporting AuxClick\n                if (isClosable && e.button === 1 && e.buttons === 0) {\n                  onClose?.(key);\n                  return;\n                }\n                // Left mouse button was clicked, and no buttons remain pressed\n                if (e.button === 0 && e.buttons === 0) {\n                  // focus is normally set on mousedown, but dnd calls preventDefault for drag purposes\n                  // so we can call focus on the firing of the actual click event manually\n                  (e.target as HTMLDivElement).focus();\n\n                  onSelect(key);\n                }\n              }}\n              onKeyPress={event => {\n                if (event.key === 'Enter') onSelect(key);\n              }}\n            >\n              {iconElem}\n              <span className=\"btn-nav-tab-title\">\n                {title}\n                <Tooltip>{title}</Tooltip>\n              </span>\n              {isClosable && (\n                <Button\n                  kind=\"ghost\"\n                  className=\"btn-nav-tab-close\"\n                  onClick={event => {\n                    onClose?.(key);\n                    event.stopPropagation();\n                    event.preventDefault();\n                  }}\n                  icon={vsClose}\n                  tooltip=\"Close\"\n                />\n              )}\n            </div>\n            <ContextActions actions={contextActions} />\n          </div>\n        )}\n      </Draggable>\n    );\n  }\n);\n\nNavTab.displayName = 'NavTab';\n\nexport default NavTab;\n"],"mappings":"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"}
+{"version":3,"file":"NavTab.js","names":["React","memo","classNames","Draggable","vsClose","FontAwesomeIcon","Button","ContextActions","Tooltip","jsx","_jsx","jsxs","_jsxs","NavTab","_ref","tab","onClose","onSelect","isActive","activeRef","index","isDraggable","contextActions","key","isClosable","title","icon","iconElem","isValidElement","draggableId","isDragDisabled","children","provided","snapshot","className","ref","_objectSpread","innerRef","draggableProps","dragHandleProps","active","dragging","isDragging","concat","role","tabIndex","onAuxClick","e","button","buttons","onClick","target","focus","onKeyPress","event","kind","stopPropagation","preventDefault","tooltip","actions","displayName"],"sources":["../../src/navigation/NavTab.tsx"],"sourcesContent":["import React, { memo } from 'react';\nimport classNames from 'classnames';\nimport { Draggable } from '@hello-pangea/dnd';\nimport { type IconDefinition, vsClose } from '@deephaven/icons';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport type { NavTabItem } from './NavTabList';\nimport Button from '../Button';\nimport ContextActions from '../context-actions/ContextActions';\nimport { type ResolvableContextAction } from '../context-actions';\nimport { Tooltip } from '../popper';\n\ninterface NavTabProps {\n  tab: NavTabItem;\n  onSelect: (key: string) => void;\n  onClose?: (key: string) => void;\n  isActive: boolean;\n  activeRef: React.RefObject<HTMLDivElement>;\n  index: number;\n  isDraggable: boolean;\n  contextActions?: ResolvableContextAction | ResolvableContextAction[];\n}\n\nconst NavTab = memo(\n  ({\n    tab,\n    onClose,\n    onSelect,\n    isActive,\n    activeRef,\n    index,\n    isDraggable,\n    contextActions,\n  }: NavTabProps) => {\n    const { key, isClosable = onClose != null, title, icon } = tab;\n\n    let iconElem: JSX.Element | undefined;\n    if (icon != null) {\n      iconElem = React.isValidElement(icon) ? (\n        icon\n      ) : (\n        <FontAwesomeIcon icon={icon as IconDefinition} />\n      );\n    }\n\n    return (\n      <Draggable\n        draggableId={key}\n        key={key}\n        index={index}\n        isDragDisabled={!isDraggable}\n      >\n        {(provided, snapshot) => (\n          <div\n            className=\"context-menu-wrapper\"\n            ref={isActive ? activeRef : null}\n          >\n            <div\n              ref={provided.innerRef}\n              // eslint-disable-next-line react/jsx-props-no-spreading\n              {...provided.draggableProps}\n              // eslint-disable-next-line react/jsx-props-no-spreading\n              {...provided.dragHandleProps}\n              className={classNames(\n                'btn btn-link btn-nav-tab',\n                { active: isActive },\n                { dragging: snapshot.isDragging }\n              )}\n              data-testid={`btn-nav-tab-${title}`}\n              role=\"tab\"\n              tabIndex={0}\n              onAuxClick={e => {\n                // Middle mouse button was clicked, and no buttons remain pressed\n                if (isClosable && e.button === 1 && e.buttons === 0) {\n                  onClose?.(key);\n                }\n              }}\n              onClick={e => {\n                // have to have seperate check onClick for Safari not supporting AuxClick\n                if (isClosable && e.button === 1 && e.buttons === 0) {\n                  onClose?.(key);\n                  return;\n                }\n                // Left mouse button was clicked, and no buttons remain pressed\n                if (e.button === 0 && e.buttons === 0) {\n                  // focus is normally set on mousedown, but dnd calls preventDefault for drag purposes\n                  // so we can call focus on the firing of the actual click event manually\n                  (e.target as HTMLDivElement).focus();\n\n                  onSelect(key);\n                }\n              }}\n              onKeyPress={event => {\n                if (event.key === 'Enter') onSelect(key);\n              }}\n            >\n              {iconElem}\n              <span className=\"btn-nav-tab-title\">\n                {title}\n                <Tooltip>{title}</Tooltip>\n              </span>\n              {isClosable && (\n                <Button\n                  kind=\"ghost\"\n                  className=\"btn-nav-tab-close\"\n                  onClick={event => {\n                    onClose?.(key);\n                    event.stopPropagation();\n                    event.preventDefault();\n                  }}\n                  icon={vsClose}\n                  tooltip=\"Close\"\n                />\n              )}\n            </div>\n            <ContextActions actions={contextActions} />\n          </div>\n        )}\n      </Draggable>\n    );\n  }\n);\n\nNavTab.displayName = 'NavTab';\n\nexport default NavTab;\n"],"mappings":"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","ignoreList":[]}

package/dist/navigation/NavTabList.css

@@ -24,7 +24,7 @@
 .nav-container .nav-tabs .btn-nav-tab {
   line-height: 30px;
   width: auto;
-  max-width: 200px;
+  max-width: max(200px, 40vw);
   overflow: hidden;
   padding: 0 24px;
   position: relative;

package/dist/navigation/NavTabList.css.map

@@ -1 +1 @@
-{"version":3,"sourceRoot":"","sources":["../../scss/custom.scss","../../scss/bootstrap_overrides.scss","../../src/navigation/NavTabList.scss","../../scss/new_variables.scss"],"names":[],"mappings":"AAAA;AC6LA;ACxKA;EACE;EACA;;AAEA;EACE;EACA,QAzBS;EA0BT,WAxBY;EAyBZ;EACA;EACA;;AAEA;ECbF;EAIA,iBACE;EAIF,qBACE;EAIF;EACA;EACA;EACA;;ADAE;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;;AAGF;EACE;EACA;EACA,aAtDQ;EAuDR;EACA;EACA;EACA;EACA;;AAEA;EACE,ODlDC;;ACqDH;EACE;EACA,ODvDC;;AC2DL;EAEE;EACA;EACA;EACA,MA1EgB;EA2EhB,OA3EgB;EA4EhB,QA3EqB;EA4ErB;;AAIF;EACE;EACA;;AAIF;EACE,YAlF0B;EAmF1B;;AAGF;EAEE;EACA;;AACA;EACE;;AAIJ;EAEE;;AAEA;EACE;;AAGF;EACE,YDlGC;ECmGD;;AAIJ;EACE,OD1GG;;AC4GH;EACE;;AAGF;EACE;;AAEF;EACE;;AAIJ;EACE,ODzHG;EC0HH;;AAEA;EACE;;AAGF;EAEE;;AAMR;EACE,eDEY;ECDZ;EACA;EACA;EACA;;AAGF;EACE,cA9IqB;;AAiJvB;EACE,aAlJqB","file":"NavTabList.css","sourcesContent":["/* stylelint-disable scss/at-import-no-partial-leading-underscore */\n// Consumers should be able to resolve bootstrap/ to node_modules/bootstrap\n\n//Make bootstrap functions available for use in overrides\n@import 'bootstrap/scss/_functions.scss';\n@import './bootstrap_overrides.scss';\n\n//_variable imports come after bootstrap default overrides,\n// makes all other variables and mixins from bootstrap available\n/// with just importing customer.scss\n@import 'bootstrap/scss/_variables.scss';\n@import 'bootstrap/scss/_mixins.scss';\n\n//New variables come after imports\n@import './new_variables.scss';\n@import './util.scss';\n","// Styling overrides for bootstrap\n@use 'sass:map';\n\n// Override / set color variables\n$red: var(--dh-color-visual-red);\n$orange: var(--dh-color-visual-orange);\n$yellow: var(--dh-color-visual-yellow);\n$green: var(--dh-color-visual-green);\n$blue: var(--dh-color-visual-blue);\n$purple: var(--dh-color-visual-purple);\n\n// Fallback colors are used if theme isn't loaded\n// this is required for error messages if the API doesn't load\n\n//Define our Gray scale\n$gray-100: var(--dh-color-gray-900, #fcfcfa);\n$gray-200: var(--dh-color-gray-800);\n$gray-300: var(--dh-color-gray-700);\n$gray-400: var(--dh-color-gray-600);\n$gray-500: var(--dh-color-gray-500);\n// intentional duplicate, scale doesn't line up otherwise\n// as we have gray-850 and spectrum doesn't and it is needed\n$gray-600: var(--dh-color-gray-500);\n$gray-700: var(--dh-color-gray-400);\n$gray-800: var(--dh-color-gray-300);\n$gray-850: var(--dh-color-gray-200);\n$gray-900: var(--dh-color-gray-75);\n$black: var(--dh-color-black, #1a171a);\n$white: var(--dh-color-white, #f0f0ee);\n\n//Define some UI colors\n$interfacegray: var(--dh-color-content-bg, #2d2a2e);\n$interfaceblue: var(--dh-color-accent-bg);\n$interfacewhite: $white;\n$interfaceblack: $black;\n$content-bg: var(--dh-color-content-bg, #2d2a2e);\n$background: var(--dh-color-bg, #1a171a);\n$foreground: var(--dh-color-fg, #f0f0ee);\n\n// Extend default Bootstrap $grays map\n$grays-custom: (\n  '850': $gray-850,\n);\n$grays: () !default;\n$grays: map-merge($grays, $grays-custom);\n\n// Extend default Bootstrap $colors map\n$colors-custom: (\n  'black': $black,\n);\n$colors: () !default;\n$colors: map-merge($colors, $colors-custom);\n\n// Override default Bootstrap $theme-colors map by mapping each key to itself.\n// These will then be re-mapped inside of `button-outline-variant` and\n// `button-outline-variant` mixins in `bootstrap_override_mixins_buttons.scss`\n$theme-colors-self-map: ();\n@each $key\n  in (\n    'primary',\n    'secondary',\n    'success',\n    'info',\n    'warning',\n    'danger',\n    'light',\n    'dark'\n  )\n{\n  $theme-colors-self-map: map.set($theme-colors-self-map, $key, $key);\n}\n$theme-colors: () !default;\n$theme-colors: map-merge($theme-colors, $theme-colors-self-map);\n\n// Used by bootstrap_override_mixins_buttons.scss to map Bootstrap colors to\n// DH semantic colors\n$bootstrap-dh-semantic-map: (\n  'primary': 'accent',\n  'secondary': 'neutral',\n  'success': 'positive',\n  'info': 'info',\n  'warning': 'notice',\n  'danger': 'negative',\n  // We shouldn't be using these, but mapping so they work with our custom\n  // `color-yiq` mixin. If we find a way to remove $light + $dark that are\n  // defined in Bootstrap _variables.scss, we should remove these\n  'light': 'neutral',\n  'dark': 'neutral',\n);\n\n//Set default colors\n$body-bg: $black;\n$body-color: $interfacewhite;\n\n// Set brand colors\n$primary: var(--dh-color-accent-bg);\n$primary-hover: var(--dh-color-accent-hover-bg);\n$primary-dark: var(--dh-color-accent-down-bg);\n$secondary: var(--dh-color-neutral-bg);\n$secondary-hover: var(--dh-color-neutral-hover-bg);\n$success: $green;\n$info: $yellow;\n$warning: $orange;\n$danger: var(--dh-color-negative-bg);\n$danger-hover: var(--dh-color-negative-hover-bg);\n// We really don't want to use $light or $dark variables, but Bootstrap defines\n// them in _variables.scss. Explicitly setting them to ensure we are in control\n// of their values. If we can find a way to remove them, we should\n$light: var(--dh-color-gray-light);\n$dark: var(--dh-color-gray-dark);\n// Bootstrap doesn't define $mid, and we want to move away from this particular\n// semantic. Should be deleted by #1635\n$mid: var(--dh-color-gray-mid);\n\n$semantic-colors: (\n  'primary-hover': $primary-hover,\n  'primary-dark': $primary-dark,\n  'mid': $mid,\n  'content-bg': $interfacegray,\n  'background': $interfaceblack,\n  'foreground': $interfacewhite,\n  'secondary-hover': $secondary-hover,\n  'danger-hover': $danger-hover,\n);\n\n$component-active-bg: $primary;\n$theme-color-interval: 9%;\n$yiq-contrasted-threshold: 180;\n\n// Override fonts\n$font-family-sans-serif:\n  'Fira Sans',\n  -apple-system,\n  blinkmacsystemfont,\n  'Segoe UI',\n  'Roboto',\n  'Helvetica Neue',\n  arial,\n  sans-serif; //fira sans then native system ui fallbacks\n$font-family-monospace: 'Fira Mono', menlo, monaco, consolas, 'Liberation Mono',\n  'Courier New', monospace;\n$font-family-base: $font-family-sans-serif;\n\n$headings-font-weight: 400;\n\n//Text overides\n$text-muted: $gray-400;\n\n//Style Selection highlight color\n$text-select-color: var(--dh-color-text-highlight);\n\n//Grid variables, same value as default just making easily accessible\n$grid-gutter-width: 30px;\n\n//Visual Overrides\n$border-radius: 4px;\n$box-shadow: 0 0.1rem 1rem var(--dh-color-dropshadow);\n\n//Override Btn\n$btn-border-radius: 4rem;\n$btn-padding-x: 1.5rem;\n$btn-transition:\n  color 0.12s ease-in-out,\n  background-color 0.12s ease-in-out,\n  border-color 0.12s ease-in-out,\n  box-shadow 0.12s ease-in-out; //default 0.15 is too long\n$btn-border-width: 2px;\n$btn-font-weight: var(--spectrum-global-font-weight-bold);\n$btn-line-height: 1.3;\n\n//Override Inputs\n$input-bg: var(--dh-color-input-bg);\n$input-disabled-bg: var(--dh-color-input-disabled-bg);\n$input-color: var(--dh-color-input-fg);\n$input-border-color: var(--dh-color-input-border);\n$input-placeholder-color: var(--dh-color-input-placeholder);\n$input-focus-border-color: var(--dh-color-input-focus-border);\n\n$input-btn-focus-width: 0.2rem;\n$input-btn-focus-color: color-mix(\n  in srgb,\n  var(--dh-color-accent) 35%,\n  transparent\n);\n$input-btn-focus-box-shadow: 0 0 0 $input-btn-focus-width $input-btn-focus-color;\n$input-btn-line-height: 1.3;\n// Bootstrap uses a calc expression to determine the input height (calc(line-height + 2*padding-y + border)).\n// The padding-y value has to be in rem to match units as it is a SASS calc.\n// Using 0.42145rem with 1.3 line height gets us to spectrum's 32px.\n/* stylelint-disable-next-line number-max-precision */\n$input-btn-padding-y: 0.42145rem;\n\n//checkbox\n$custom-control-indicator-bg: var(--dh-color-input-bg);\n$custom-control-indicator-border-color: var(--dh-color-input-border);\n$custom-checkbox-indicator-border-radius: 2px;\n$custom-control-indicator-border-width: 2px;\n$custom-control-indicator-active-bg: var(--dh-color-input-bg);\n$custom-control-indicator-active-border-color: var(--dh-color-input-fg);\n$custom-control-indicator-checked-bg: var(--dh-color-input-fg);\n$custom-control-indicator-checked-color: black; // used as mask fill color\n$custom-checkbox-indicator-indeterminate-bg: var(--dh-color-input-fg);\n$custom-control-indicator-bg-size: 75% 75%;\n$custom-control-indicator-disabled-bg: var(--dh-color-input-disabled-bg);\n$custom-control-indicator-checked-disabled-bg: var(\n  --dh-color-input-disabled-bg\n);\n$custom-control-label-disabled-color: var(--dh-color-input-disabled-fg);\n\n// The $custom-select-indicator variable is used by Bootstrap to provide the\n// icon for the select dropdown. Inline svgs can't use CSS variables, so we hard\n// code the color to #929192 (the default value of --dh-color-gray-600). PR #1651\n// overrides this icon altogether for known dropdowns, so technically we may not\n// need this, but it's here in case there are any remaining instances.\n$custom-select-indicator-color: #929192;\n$custom-select-bg: var(--dh-color-selector-bg);\n$custom-select-bg-size: 16px 16px;\n//dhSort icon encoded\n$custom-select-indicator: str-replace(\n  url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='#{$custom-select-indicator-color}' d='M4 7l-.4-.8 4-3.7h.8l4 3.7-.4.8H4zm0 2l-.4.8 4 3.7h.8l4-3.7L12 9H4z'/%3E%3C/svg%3E\"),\n  '#',\n  '%23'\n);\n$custom-select-focus-box-shadow: $input-btn-focus-box-shadow;\n$custom-select-disabled-color: $gray-500;\n$custom-select-disabled-bg: $gray-800;\n\n//modal\n$modal-content-bg: $content-bg;\n$modal-content-border-width: 0;\n$modal-md: 550px;\n$close-color: var(--dh-color-text);\n$close-text-shadow: none;\n\n// Toast notification\n$toast-bg: var(--dh-color-accent-100);\n$toast-color: var(--dh-color-text);\n$toast-error-bg: var(--dh-color-negative-bg);\n$toast-error-color: var(--dh-color-text);\n\n//tooltips\n$tooltip-bg: var(--dh-color-tooltip-bg);\n$tooltip-color: var(--dh-color-tooltip-fg);\n$tooltip-box-shadow: 0 0.1rem 1.5rem 0.1rem var(--dh-color-tooltip-box-shadow);\n\n//drowdowns\n$dropdown-bg: $gray-600;\n$dropdown-link-color: $foreground;\n$dropdown-link-hover-color: $foreground;\n$dropdown-link-hover-bg: var(--dh-color-item-list-hover-bg);\n$dropdown-divider-bg: $gray-700;\n\n//context menus\n$contextmenu-bg: var(--dh-color-popover-bg);\n$contextmenu-color: var(--dh-color-text);\n$contextmenu-disabled-color: var(--dh-color-text-disabled);\n$contextmenu-keyboard-selected-bg: var(--dh-color-keyboard-selected-bg);\n$contextmenu-selected-bg: var(--dh-color-item-list-hover-bg);\n$contextmenu-selected-color: var(--dh-color-item-list-selected-fg);\n\n//hr\n$hr-border-color: var(--dh-color-hr);\n\n//links\n$link-color: $gray-400;\n$link-hover-color: $foreground;\n\n//progress-bar\n$progress-bg: $gray-600;\n$progress-border-radius: 1rem;\n\n// Set global options\n$enable-shadows: false;\n$enable-gradients: false;\n$enable-print-styles: false; //I don't think anyone should expect to \"print\" this app.\n\n// Transition times\n$transition: 0.15s;\n$transition-mid: 0.2s;\n$transition-long: 0.3s;\n$transition-slow: 0.6s;\n\n//form-validation icon, uses vsWarning icon encoded here as svg\n$form-feedback-icon-invalid-color: $danger;\n$form-feedback-icon-invalid: str-replace(\n  url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cg fill='none'%3E%3Cg fill='#{$form-feedback-icon-invalid-color}'%3E%3Cpath d='M7.56 1h.88l6.54 12.26-.44.74H1.44L1 13.26 7.56 1zM8 2.28 2.28 13H13.7L8 2.28zM8.625 12v-1h-1.25v1h1.25zm-1.25-2V6h1.25v4h-1.25z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E \"),\n  '#',\n  '%23'\n);\n\n// This section of variables is not consumed directly by DH, but they need to be\n// defined for sass to compile _variables\n$table-dark-bg: $gray-800;\n$table-dark-accent-bg: var(--dh-color-highlight-hover);\n$table-dark-hover-bg: var(--dh-color-highlight-active);\n$table-dark-border-color: $gray-700;\n$popover-bg: var(--dh-color-tooltip-bg);\n$popover-border-color: var(--dh-color-overlay-modal-bg);\n$popover-header-bg: #000;\n$popover-arrow-outer-color: var(--dh-color-dropshadow);\n$custom-range-thumb-active-bg: var(--dh-color-accent-1100);\n","@import '../../scss/custom.scss';\n\n$tab-height: 32px;\n$tab-drag-border-width: 1px;\n$tab-font-size: 1rem;\n\n$tab-link-side-padding: 24px;\n$tab-link-underline-spacing: 6px;\n\n$tab-link-hover-underline-color: $gray-400;\n\n$tab-link-active-color: $gray-200;\n$tab-link-active-underline-color: var(--dh-color-accent-bg);\n\n$tab-link-active-hover-underline-color: var(--dh-color-accent-bg);\n\n$tab-button-hover-color: $gray-200;\n$tab-button-separator-color: $gray-600;\n\n$tab-control-btn-offset: -8px;\n\n.nav-container {\n  display: flex;\n  flex-shrink: 0;\n\n  .nav-tabs {\n    border: none;\n    height: $tab-height;\n    font-size: $tab-font-size;\n    flex-wrap: nowrap;\n    overflow-x: hidden;\n    position: relative;\n\n    &.dragging {\n      @include ants-base($gray-300, $background);\n    }\n\n    .btn-nav-tab {\n      line-height: $tab-height - $tab-drag-border-width * 2; // subtract top and bottom borders, and focus border\n      width: auto;\n      max-width: 200px;\n      overflow: hidden;\n      padding: 0 $tab-link-side-padding;\n      position: relative;\n      user-select: none;\n      flex-shrink: 0;\n      background: none;\n      background-clip: padding-box;\n\n      .btn-nav-tab-title {\n        overflow: hidden;\n        text-overflow: ellipsis;\n        white-space: nowrap;\n      }\n\n      .btn-nav-tab-close {\n        position: absolute;\n        height: 20px;\n        line-height: $tab-font-size;\n        right: 0.25rem;\n        bottom: 6px;\n        padding: 2px 1px;\n        opacity: 0;\n        transition: opacity $transition ease-out;\n\n        &:hover {\n          color: $tab-button-hover-color;\n        }\n\n        &:focus {\n          opacity: 1;\n          color: $tab-button-hover-color;\n        }\n      }\n\n      &::before,\n      &::after {\n        content: '';\n        position: absolute;\n        height: 1px;\n        left: $tab-link-side-padding;\n        right: $tab-link-side-padding;\n        bottom: $tab-link-underline-spacing;\n        transition: all $transition-mid ease-out;\n      }\n\n      //hover line is drawn as a before element\n      &::before {\n        background: transparent;\n        transform: translateY($tab-link-underline-spacing);\n      }\n\n      //active is drawn animated overtop as after element\n      &::after {\n        background: $tab-link-active-underline-color;\n        transform: scaleX(0);\n      }\n\n      &:focus {\n        // these seem like something that shouldn't have a regular focus state\n        box-shadow: none;\n        border-color: transparent;\n        &::before {\n          box-shadow: 0 1px 0 1px $input-btn-focus-color;\n        }\n      }\n\n      &:hover,\n      &:focus {\n        text-decoration: none;\n\n        .btn-nav-tab-close {\n          opacity: 1;\n        }\n\n        &::before {\n          background: $tab-link-hover-underline-color;\n          transform: translateY(0);\n        }\n      }\n\n      &.active {\n        color: $tab-link-active-color;\n\n        .btn-nav-tab-close {\n          opacity: 1;\n        }\n\n        &::after {\n          transform: scaleX(1);\n        }\n        &::before {\n          transform: translateY(0);\n        }\n      }\n\n      &.dragging {\n        color: $tab-link-active-color;\n        background-color: var(--dh-color-accent-down-bg);\n\n        .btn-nav-tab-close {\n          opacity: 0;\n        }\n\n        &::before,\n        &::after {\n          display: none;\n        }\n      }\n    }\n  }\n\n  .tab-controls-btn {\n    border-radius: $border-radius;\n    width: 25px;\n    padding: 0;\n    flex-shrink: 0;\n    z-index: 2;\n  }\n\n  .tab-controls-btn-left {\n    margin-right: $tab-control-btn-offset;\n  }\n\n  .tab-controls-btn-right {\n    margin-left: $tab-control-btn-offset;\n  }\n}\n","@use 'sass:math';\n\n//Set of spacer variables from the spacer map\n$spacer-0: map-get($spacers, 0); //0\n$spacer-1: map-get($spacers, 1);\n$spacer-2: map-get($spacers, 2);\n$spacer-3: map-get($spacers, 3);\n$spacer-4: map-get($spacers, 4);\n$spacer-5: map-get($spacers, 5);\n\n//Marching Ants for golden layout dropzone and drag and drop\n//top bottom, left right.\n//create 4 background images that are 50% color 1, 50% color 2 using graidents,  two veritical, two horizontal\n//size them to ant-size and thickness\n//position those images along the egdes and make top/bottom repeat-x and left/right repeat-y\n//then offest each of those background positions by ant-size in animation to make them march.\n$ant-size: 8px;\n$ant-thickness: 1px;\n\n@mixin ants-base($color-1: black, $color-2: white) {\n  background-image: linear-gradient(to right, $color-2 50%, $color-1 50%),\n    linear-gradient(to right, $color-2 50%, $color-1 50%),\n    linear-gradient(to bottom, $color-2 50%, $color-1 50%),\n    linear-gradient(to bottom, $color-2 50%, $color-1 50%);\n  background-size:\n    $ant-size $ant-thickness,\n    $ant-size $ant-thickness,\n    $ant-thickness $ant-size,\n    $ant-thickness $ant-size;\n  background-position:\n    0 top,\n    0 bottom,\n    left 0,\n    right 0;\n  background-repeat: repeat-x, repeat-x, repeat-y, repeat-y;\n  animation: march 0.5s;\n  animation-timing-function: linear;\n  animation-iteration-count: infinite;\n}\n\n@mixin drag-stack($pseudo-element) {\n  &::#{$pseudo-element} {\n    content: ' ';\n    background: $primary;\n    box-shadow: $box-shadow;\n    border-radius: $border-radius;\n    position: absolute;\n    height: 100%;\n    width: 100%;\n    @content;\n  }\n}\n\n$focus-bg-transparency: 12%;\n$hover-bg-transparency: 14%;\n$active-bg-transparency: 28%;\n$exception-transparency: 28%;\n"]}
+{"version":3,"sourceRoot":"","sources":["../../scss/custom.scss","../../scss/bootstrap_overrides.scss","../../src/navigation/NavTabList.scss","../../scss/new_variables.scss"],"names":[],"mappings":"AAAA;AC6LA;ACxKA;EACE;EACA;;AAEA;EACE;EACA,QAzBS;EA0BT,WAxBY;EAyBZ;EACA;EACA;;AAEA;ECbF;EAIA,iBACE;EAIF,qBACE;EAIF;EACA;EACA;EACA;;ADAE;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;;AAGF;EACE;EACA;EACA,aAtDQ;EAuDR;EACA;EACA;EACA;EACA;;AAEA;EACE,ODlDC;;ACqDH;EACE;EACA,ODvDC;;AC2DL;EAEE;EACA;EACA;EACA,MA1EgB;EA2EhB,OA3EgB;EA4EhB,QA3EqB;EA4ErB;;AAIF;EACE;EACA;;AAIF;EACE,YAlF0B;EAmF1B;;AAGF;EAEE;EACA;;AACA;EACE;;AAIJ;EAEE;;AAEA;EACE;;AAGF;EACE,YDlGC;ECmGD;;AAIJ;EACE,OD1GG;;AC4GH;EACE;;AAGF;EACE;;AAEF;EACE;;AAIJ;EACE,ODzHG;EC0HH;;AAEA;EACE;;AAGF;EAEE;;AAMR;EACE,eDEY;ECDZ;EACA;EACA;EACA;;AAGF;EACE,cA9IqB;;AAiJvB;EACE,aAlJqB","file":"NavTabList.css","sourcesContent":["/* stylelint-disable scss/at-import-no-partial-leading-underscore */\n// Consumers should be able to resolve bootstrap/ to node_modules/bootstrap\n\n//Make bootstrap functions available for use in overrides\n@import 'bootstrap/scss/_functions.scss';\n@import './bootstrap_overrides.scss';\n\n//_variable imports come after bootstrap default overrides,\n// makes all other variables and mixins from bootstrap available\n/// with just importing customer.scss\n@import 'bootstrap/scss/_variables.scss';\n@import 'bootstrap/scss/_mixins.scss';\n\n//New variables come after imports\n@import './new_variables.scss';\n@import './util.scss';\n","// Styling overrides for bootstrap\n@use 'sass:map';\n\n// Override / set color variables\n$red: var(--dh-color-visual-red);\n$orange: var(--dh-color-visual-orange);\n$yellow: var(--dh-color-visual-yellow);\n$green: var(--dh-color-visual-green);\n$blue: var(--dh-color-visual-blue);\n$purple: var(--dh-color-visual-purple);\n\n// Fallback colors are used if theme isn't loaded\n// this is required for error messages if the API doesn't load\n\n//Define our Gray scale\n$gray-100: var(--dh-color-gray-900, #fcfcfa);\n$gray-200: var(--dh-color-gray-800);\n$gray-300: var(--dh-color-gray-700);\n$gray-400: var(--dh-color-gray-600);\n$gray-500: var(--dh-color-gray-500);\n// intentional duplicate, scale doesn't line up otherwise\n// as we have gray-850 and spectrum doesn't and it is needed\n$gray-600: var(--dh-color-gray-500);\n$gray-700: var(--dh-color-gray-400);\n$gray-800: var(--dh-color-gray-300);\n$gray-850: var(--dh-color-gray-200);\n$gray-900: var(--dh-color-gray-75);\n$black: var(--dh-color-black, #1a171a);\n$white: var(--dh-color-white, #f0f0ee);\n\n//Define some UI colors\n$interfacegray: var(--dh-color-content-bg, #2d2a2e);\n$interfaceblue: var(--dh-color-accent-bg);\n$interfacewhite: $white;\n$interfaceblack: $black;\n$content-bg: var(--dh-color-content-bg, #2d2a2e);\n$background: var(--dh-color-bg, #1a171a);\n$foreground: var(--dh-color-fg, #f0f0ee);\n\n// Extend default Bootstrap $grays map\n$grays-custom: (\n  '850': $gray-850,\n);\n$grays: () !default;\n$grays: map-merge($grays, $grays-custom);\n\n// Extend default Bootstrap $colors map\n$colors-custom: (\n  'black': $black,\n);\n$colors: () !default;\n$colors: map-merge($colors, $colors-custom);\n\n// Override default Bootstrap $theme-colors map by mapping each key to itself.\n// These will then be re-mapped inside of `button-outline-variant` and\n// `button-outline-variant` mixins in `bootstrap_override_mixins_buttons.scss`\n$theme-colors-self-map: ();\n@each $key\n  in (\n    'primary',\n    'secondary',\n    'success',\n    'info',\n    'warning',\n    'danger',\n    'light',\n    'dark'\n  )\n{\n  $theme-colors-self-map: map.set($theme-colors-self-map, $key, $key);\n}\n$theme-colors: () !default;\n$theme-colors: map-merge($theme-colors, $theme-colors-self-map);\n\n// Used by bootstrap_override_mixins_buttons.scss to map Bootstrap colors to\n// DH semantic colors\n$bootstrap-dh-semantic-map: (\n  'primary': 'accent',\n  'secondary': 'neutral',\n  'success': 'positive',\n  'info': 'info',\n  'warning': 'notice',\n  'danger': 'negative',\n  // We shouldn't be using these, but mapping so they work with our custom\n  // `color-yiq` mixin. If we find a way to remove $light + $dark that are\n  // defined in Bootstrap _variables.scss, we should remove these\n  'light': 'neutral',\n  'dark': 'neutral',\n);\n\n//Set default colors\n$body-bg: $black;\n$body-color: $interfacewhite;\n\n// Set brand colors\n$primary: var(--dh-color-accent-bg);\n$primary-hover: var(--dh-color-accent-hover-bg);\n$primary-dark: var(--dh-color-accent-down-bg);\n$secondary: var(--dh-color-neutral-bg);\n$secondary-hover: var(--dh-color-neutral-hover-bg);\n$success: $green;\n$info: $yellow;\n$warning: $orange;\n$danger: var(--dh-color-negative-bg);\n$danger-hover: var(--dh-color-negative-hover-bg);\n// We really don't want to use $light or $dark variables, but Bootstrap defines\n// them in _variables.scss. Explicitly setting them to ensure we are in control\n// of their values. If we can find a way to remove them, we should\n$light: var(--dh-color-gray-light);\n$dark: var(--dh-color-gray-dark);\n// Bootstrap doesn't define $mid, and we want to move away from this particular\n// semantic. Should be deleted by #1635\n$mid: var(--dh-color-gray-mid);\n\n$semantic-colors: (\n  'primary-hover': $primary-hover,\n  'primary-dark': $primary-dark,\n  'mid': $mid,\n  'content-bg': $interfacegray,\n  'background': $interfaceblack,\n  'foreground': $interfacewhite,\n  'secondary-hover': $secondary-hover,\n  'danger-hover': $danger-hover,\n);\n\n$component-active-bg: $primary;\n$theme-color-interval: 9%;\n$yiq-contrasted-threshold: 180;\n\n// Override fonts\n$font-family-sans-serif:\n  'Fira Sans',\n  -apple-system,\n  blinkmacsystemfont,\n  'Segoe UI',\n  'Roboto',\n  'Helvetica Neue',\n  arial,\n  sans-serif; //fira sans then native system ui fallbacks\n$font-family-monospace: 'Fira Mono', menlo, monaco, consolas, 'Liberation Mono',\n  'Courier New', monospace;\n$font-family-base: $font-family-sans-serif;\n\n$headings-font-weight: 400;\n\n//Text overides\n$text-muted: $gray-400;\n\n//Style Selection highlight color\n$text-select-color: var(--dh-color-text-highlight);\n\n//Grid variables, same value as default just making easily accessible\n$grid-gutter-width: 30px;\n\n//Visual Overrides\n$border-radius: 4px;\n$box-shadow: 0 0.1rem 1rem var(--dh-color-dropshadow);\n\n//Override Btn\n$btn-border-radius: 4rem;\n$btn-padding-x: 1.5rem;\n$btn-transition:\n  color 0.12s ease-in-out,\n  background-color 0.12s ease-in-out,\n  border-color 0.12s ease-in-out,\n  box-shadow 0.12s ease-in-out; //default 0.15 is too long\n$btn-border-width: 2px;\n$btn-font-weight: var(--spectrum-global-font-weight-bold);\n$btn-line-height: 1.3;\n\n//Override Inputs\n$input-bg: var(--dh-color-input-bg);\n$input-disabled-bg: var(--dh-color-input-disabled-bg);\n$input-color: var(--dh-color-input-fg);\n$input-border-color: var(--dh-color-input-border);\n$input-placeholder-color: var(--dh-color-input-placeholder);\n$input-focus-border-color: var(--dh-color-input-focus-border);\n\n$input-btn-focus-width: 0.2rem;\n$input-btn-focus-color: color-mix(\n  in srgb,\n  var(--dh-color-accent) 35%,\n  transparent\n);\n$input-btn-focus-box-shadow: 0 0 0 $input-btn-focus-width $input-btn-focus-color;\n$input-btn-line-height: 1.3;\n// Bootstrap uses a calc expression to determine the input height (calc(line-height + 2*padding-y + border)).\n// The padding-y value has to be in rem to match units as it is a SASS calc.\n// Using 0.42145rem with 1.3 line height gets us to spectrum's 32px.\n/* stylelint-disable-next-line number-max-precision */\n$input-btn-padding-y: 0.42145rem;\n\n//checkbox\n$custom-control-indicator-bg: var(--dh-color-input-bg);\n$custom-control-indicator-border-color: var(--dh-color-input-border);\n$custom-checkbox-indicator-border-radius: 2px;\n$custom-control-indicator-border-width: 2px;\n$custom-control-indicator-active-bg: var(--dh-color-input-bg);\n$custom-control-indicator-active-border-color: var(--dh-color-input-fg);\n$custom-control-indicator-checked-bg: var(--dh-color-input-fg);\n$custom-control-indicator-checked-color: black; // used as mask fill color\n$custom-checkbox-indicator-indeterminate-bg: var(--dh-color-input-fg);\n$custom-control-indicator-bg-size: 75% 75%;\n$custom-control-indicator-disabled-bg: var(--dh-color-input-disabled-bg);\n$custom-control-indicator-checked-disabled-bg: var(\n  --dh-color-input-disabled-bg\n);\n$custom-control-label-disabled-color: var(--dh-color-input-disabled-fg);\n\n// The $custom-select-indicator variable is used by Bootstrap to provide the\n// icon for the select dropdown. Inline svgs can't use CSS variables, so we hard\n// code the color to #929192 (the default value of --dh-color-gray-600). PR #1651\n// overrides this icon altogether for known dropdowns, so technically we may not\n// need this, but it's here in case there are any remaining instances.\n$custom-select-indicator-color: #929192;\n$custom-select-bg: var(--dh-color-selector-bg);\n$custom-select-bg-size: 16px 16px;\n//dhSort icon encoded\n$custom-select-indicator: str-replace(\n  url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='#{$custom-select-indicator-color}' d='M4 7l-.4-.8 4-3.7h.8l4 3.7-.4.8H4zm0 2l-.4.8 4 3.7h.8l4-3.7L12 9H4z'/%3E%3C/svg%3E\"),\n  '#',\n  '%23'\n);\n$custom-select-focus-box-shadow: $input-btn-focus-box-shadow;\n$custom-select-disabled-color: $gray-500;\n$custom-select-disabled-bg: $gray-800;\n\n//modal\n$modal-content-bg: $content-bg;\n$modal-content-border-width: 0;\n$modal-md: 550px;\n$close-color: var(--dh-color-text);\n$close-text-shadow: none;\n\n// Toast notification\n$toast-bg: var(--dh-color-accent-100);\n$toast-color: var(--dh-color-text);\n$toast-error-bg: var(--dh-color-negative-bg);\n$toast-error-color: var(--dh-color-text);\n\n//tooltips\n$tooltip-bg: var(--dh-color-tooltip-bg);\n$tooltip-color: var(--dh-color-tooltip-fg);\n$tooltip-box-shadow: 0 0.1rem 1.5rem 0.1rem var(--dh-color-tooltip-box-shadow);\n\n//drowdowns\n$dropdown-bg: $gray-600;\n$dropdown-link-color: $foreground;\n$dropdown-link-hover-color: $foreground;\n$dropdown-link-hover-bg: var(--dh-color-item-list-hover-bg);\n$dropdown-divider-bg: $gray-700;\n\n//context menus\n$contextmenu-bg: var(--dh-color-popover-bg);\n$contextmenu-color: var(--dh-color-text);\n$contextmenu-disabled-color: var(--dh-color-text-disabled);\n$contextmenu-keyboard-selected-bg: var(--dh-color-keyboard-selected-bg);\n$contextmenu-selected-bg: var(--dh-color-item-list-hover-bg);\n$contextmenu-selected-color: var(--dh-color-item-list-selected-fg);\n\n//hr\n$hr-border-color: var(--dh-color-hr);\n\n//links\n$link-color: $gray-400;\n$link-hover-color: $foreground;\n\n//progress-bar\n$progress-bg: $gray-600;\n$progress-border-radius: 1rem;\n\n// Set global options\n$enable-shadows: false;\n$enable-gradients: false;\n$enable-print-styles: false; //I don't think anyone should expect to \"print\" this app.\n\n// Transition times\n$transition: 0.15s;\n$transition-mid: 0.2s;\n$transition-long: 0.3s;\n$transition-slow: 0.6s;\n\n//form-validation icon, uses vsWarning icon encoded here as svg\n$form-feedback-icon-invalid-color: $danger;\n$form-feedback-icon-invalid: str-replace(\n  url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cg fill='none'%3E%3Cg fill='#{$form-feedback-icon-invalid-color}'%3E%3Cpath d='M7.56 1h.88l6.54 12.26-.44.74H1.44L1 13.26 7.56 1zM8 2.28 2.28 13H13.7L8 2.28zM8.625 12v-1h-1.25v1h1.25zm-1.25-2V6h1.25v4h-1.25z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E \"),\n  '#',\n  '%23'\n);\n\n// This section of variables is not consumed directly by DH, but they need to be\n// defined for sass to compile _variables\n$table-dark-bg: $gray-800;\n$table-dark-accent-bg: var(--dh-color-highlight-hover);\n$table-dark-hover-bg: var(--dh-color-highlight-active);\n$table-dark-border-color: $gray-700;\n$popover-bg: var(--dh-color-tooltip-bg);\n$popover-border-color: var(--dh-color-overlay-modal-bg);\n$popover-header-bg: #000;\n$popover-arrow-outer-color: var(--dh-color-dropshadow);\n$custom-range-thumb-active-bg: var(--dh-color-accent-1100);\n","@import '../../scss/custom.scss';\n\n$tab-height: 32px;\n$tab-drag-border-width: 1px;\n$tab-font-size: 1rem;\n\n$tab-link-side-padding: 24px;\n$tab-link-underline-spacing: 6px;\n\n$tab-link-hover-underline-color: $gray-400;\n\n$tab-link-active-color: $gray-200;\n$tab-link-active-underline-color: var(--dh-color-accent-bg);\n\n$tab-link-active-hover-underline-color: var(--dh-color-accent-bg);\n\n$tab-button-hover-color: $gray-200;\n$tab-button-separator-color: $gray-600;\n\n$tab-control-btn-offset: -8px;\n\n.nav-container {\n  display: flex;\n  flex-shrink: 0;\n\n  .nav-tabs {\n    border: none;\n    height: $tab-height;\n    font-size: $tab-font-size;\n    flex-wrap: nowrap;\n    overflow-x: hidden;\n    position: relative;\n\n    &.dragging {\n      @include ants-base($gray-300, $background);\n    }\n\n    .btn-nav-tab {\n      line-height: $tab-height - $tab-drag-border-width * 2; // subtract top and bottom borders, and focus border\n      width: auto;\n      max-width: max(200px, 40vw);\n      overflow: hidden;\n      padding: 0 $tab-link-side-padding;\n      position: relative;\n      user-select: none;\n      flex-shrink: 0;\n      background: none;\n      background-clip: padding-box;\n\n      .btn-nav-tab-title {\n        overflow: hidden;\n        text-overflow: ellipsis;\n        white-space: nowrap;\n      }\n\n      .btn-nav-tab-close {\n        position: absolute;\n        height: 20px;\n        line-height: $tab-font-size;\n        right: 0.25rem;\n        bottom: 6px;\n        padding: 2px 1px;\n        opacity: 0;\n        transition: opacity $transition ease-out;\n\n        &:hover {\n          color: $tab-button-hover-color;\n        }\n\n        &:focus {\n          opacity: 1;\n          color: $tab-button-hover-color;\n        }\n      }\n\n      &::before,\n      &::after {\n        content: '';\n        position: absolute;\n        height: 1px;\n        left: $tab-link-side-padding;\n        right: $tab-link-side-padding;\n        bottom: $tab-link-underline-spacing;\n        transition: all $transition-mid ease-out;\n      }\n\n      //hover line is drawn as a before element\n      &::before {\n        background: transparent;\n        transform: translateY($tab-link-underline-spacing);\n      }\n\n      //active is drawn animated overtop as after element\n      &::after {\n        background: $tab-link-active-underline-color;\n        transform: scaleX(0);\n      }\n\n      &:focus {\n        // these seem like something that shouldn't have a regular focus state\n        box-shadow: none;\n        border-color: transparent;\n        &::before {\n          box-shadow: 0 1px 0 1px $input-btn-focus-color;\n        }\n      }\n\n      &:hover,\n      &:focus {\n        text-decoration: none;\n\n        .btn-nav-tab-close {\n          opacity: 1;\n        }\n\n        &::before {\n          background: $tab-link-hover-underline-color;\n          transform: translateY(0);\n        }\n      }\n\n      &.active {\n        color: $tab-link-active-color;\n\n        .btn-nav-tab-close {\n          opacity: 1;\n        }\n\n        &::after {\n          transform: scaleX(1);\n        }\n        &::before {\n          transform: translateY(0);\n        }\n      }\n\n      &.dragging {\n        color: $tab-link-active-color;\n        background-color: var(--dh-color-accent-down-bg);\n\n        .btn-nav-tab-close {\n          opacity: 0;\n        }\n\n        &::before,\n        &::after {\n          display: none;\n        }\n      }\n    }\n  }\n\n  .tab-controls-btn {\n    border-radius: $border-radius;\n    width: 25px;\n    padding: 0;\n    flex-shrink: 0;\n    z-index: 2;\n  }\n\n  .tab-controls-btn-left {\n    margin-right: $tab-control-btn-offset;\n  }\n\n  .tab-controls-btn-right {\n    margin-left: $tab-control-btn-offset;\n  }\n}\n","@use 'sass:math';\n\n//Set of spacer variables from the spacer map\n$spacer-0: map-get($spacers, 0); //0\n$spacer-1: map-get($spacers, 1);\n$spacer-2: map-get($spacers, 2);\n$spacer-3: map-get($spacers, 3);\n$spacer-4: map-get($spacers, 4);\n$spacer-5: map-get($spacers, 5);\n\n//Marching Ants for golden layout dropzone and drag and drop\n//top bottom, left right.\n//create 4 background images that are 50% color 1, 50% color 2 using graidents,  two veritical, two horizontal\n//size them to ant-size and thickness\n//position those images along the egdes and make top/bottom repeat-x and left/right repeat-y\n//then offest each of those background positions by ant-size in animation to make them march.\n$ant-size: 8px;\n$ant-thickness: 1px;\n\n@mixin ants-base($color-1: black, $color-2: white) {\n  background-image: linear-gradient(to right, $color-2 50%, $color-1 50%),\n    linear-gradient(to right, $color-2 50%, $color-1 50%),\n    linear-gradient(to bottom, $color-2 50%, $color-1 50%),\n    linear-gradient(to bottom, $color-2 50%, $color-1 50%);\n  background-size:\n    $ant-size $ant-thickness,\n    $ant-size $ant-thickness,\n    $ant-thickness $ant-size,\n    $ant-thickness $ant-size;\n  background-position:\n    0 top,\n    0 bottom,\n    left 0,\n    right 0;\n  background-repeat: repeat-x, repeat-x, repeat-y, repeat-y;\n  animation: march 0.5s;\n  animation-timing-function: linear;\n  animation-iteration-count: infinite;\n}\n\n@mixin drag-stack($pseudo-element) {\n  &::#{$pseudo-element} {\n    content: ' ';\n    background: $primary;\n    box-shadow: $box-shadow;\n    border-radius: $border-radius;\n    position: absolute;\n    height: 100%;\n    width: 100%;\n    @content;\n  }\n}\n\n$focus-bg-transparency: 12%;\n$hover-bg-transparency: 14%;\n$active-bg-transparency: 28%;\n$exception-transparency: 28%;\n"]}

package/dist/navigation/NavTabList.js

@@ -6,7 +6,7 @@ function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e =
 import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import classNames from 'classnames';
 import clamp from 'lodash.clamp';
-import { DragDropContext, Droppable } from 'react-beautiful-dnd';
+import { DragDropContext, Droppable } from '@hello-pangea/dnd';
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import { vsChevronRight, vsChevronLeft, vsChevronDown } from '@deephaven/icons';
 import { useResizeObserver } from '@deephaven/react-hooks';
@@ -18,8 +18,7 @@ import { ContextActions } from "../context-actions/index.js";
 import Popper from "../popper/Popper.js";
 import DashboardList from "./DashboardList.js";
 import { GLOBAL_SHORTCUTS } from "../shortcuts/index.js"; // mouse hold timeout to act as hold instead of click
-import { jsx as _jsx } from "react/jsx-runtime";
-import { jsxs as _jsxs } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 var CLICK_TIMEOUT = 500;
 
 // mouse hold acceleration
@@ -116,7 +115,7 @@ function NavTabList(_ref) {
     if (!result.destination) {
       return;
     }
-    onReorder === null || onReorder === void 0 ? void 0 : onReorder(result.source.index, result.destination.index);
+    onReorder === null || onReorder === void 0 || onReorder(result.source.index, result.destination.index);
   }, [onReorder]);
   var handleScroll = useCallback(() => {
     if (containerRef.current == null) {
@@ -255,10 +254,10 @@ function NavTabList(_ref) {
       // Scrolling jumps too far sometimes, so clamp to get a smoother scroll
       nav.scrollLeft += clamp(delta, -30, 30);
     };
-    (_containerRef$current = containerRef.current) === null || _containerRef$current === void 0 ? void 0 : _containerRef$current.addEventListener('wheel', onWheel);
+    (_containerRef$current = containerRef.current) === null || _containerRef$current === void 0 || _containerRef$current.addEventListener('wheel', onWheel);
     return () => {
       var _containerRef$current2;
-      (_containerRef$current2 = containerRef.current) === null || _containerRef$current2 === void 0 ? void 0 : _containerRef$current2.removeEventListener('wheel', onWheel);
+      (_containerRef$current2 = containerRef.current) === null || _containerRef$current2 === void 0 || _containerRef$current2.removeEventListener('wheel', onWheel);
     };
   }, []);
   var tabContextActionMap = useMemo(() => {

package/dist/navigation/NavTabList.js.map

@@ -1 +1 @@
-{"version":3,"file":"NavTabList.js","names":["React","useCallback","useEffect","useMemo","useRef","useState","classNames","clamp","DragDropContext","Droppable","FontAwesomeIcon","vsChevronRight","vsChevronLeft","vsChevronDown","useResizeObserver","DragUtils","Button","NavTab","ContextActions","Popper","DashboardList","GLOBAL_SHORTCUTS","jsx","_jsx","jsxs","_jsxs","CLICK_TIMEOUT","START_SPEED","ACCELERATION","isScrolledLeft","element","scrollLeft","isScrolledRight","Math","abs","clientWidth","scrollWidth","makeBaseContextActions","tab","tabs","onClose","isClosable","key","contextActions","push","title","order","group","action","disabled","i","length","forEach","t","NavTabList","_ref","activeKey","onSelect","onReorder","makeContextActions","containerRef","isOverflowing","setIsOverflowing","isDashboardTabMenuShown","setIsDashboardTabMenuShown","disableScrollLeft","setDisableScrollLeft","disableScrollRight","setDisableScrollRight","handleResize","current","onDragEnd","result","stopDragging","destination","source","index","handleScroll","shouldDisableScrollLeft","shouldDisableScrollRight","continuousScrollRef","cancelClick","handleLeftClick","children","child","offsetLeft","scrollIntoView","behavior","block","inline","handleRightClick","offsetWidth","handleMouseRepeat","direction","startX","deltaX","arguments","undefined","prevTimestamp","container","rAF","requestAnimationFrame","timestamp","startTime","deltaTime","newDeltaX","min","endContinuousScroll","holdTimer","clearTimeout","cancelAnimationFrame","window","removeEventListener","handleMouseDown","setTimeout","addEventListener","handleMouseDownLeft","handleMouseDownRight","handleWheel","_containerRef$current","onWheel","e","stopPropagation","preventDefault","nav","currentTarget","delta","deltaY","_containerRef$current2","tabContextActionMap","tabContextActions","Map","_makeContextActions","set","activeTabRef","activeTab","find","navTabs","map","isActive","activeRef","isDraggable","get","scrollActiveTabIntoView","handleDashboardMenuClick","handleDashboardMenuSelect","handleDashboardMenuClose","className","kind","icon","transform","tooltip","onClick","onMouseDown","onDragStart","startDragging","droppableId","provided","snapshot","_objectSpread","ref","r","innerRef","droppableProps","dragging","draggingFromThisWith","role","onScroll","placeholder","style","visibility","marginLeft","isShown","onExited","options","placement","closeOnBlur","interactive","actions","shortcut","OPEN_DASHBOARD_LIST","isGlobal"],"sources":["../../src/navigation/NavTabList.tsx"],"sourcesContent":["import React, {\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\nimport classNames from 'classnames';\nimport clamp from 'lodash.clamp';\nimport {\n  DragDropContext,\n  Droppable,\n  type OnDragEndResponder,\n} from 'react-beautiful-dnd';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport { type IconDefinition } from '@fortawesome/fontawesome-svg-core';\nimport { vsChevronRight, vsChevronLeft, vsChevronDown } from '@deephaven/icons';\nimport { useResizeObserver } from '@deephaven/react-hooks';\nimport DragUtils from '../DragUtils';\nimport Button from '../Button';\nimport NavTab from './NavTab';\nimport './NavTabList.scss';\nimport {\n  type ContextAction,\n  type ResolvableContextAction,\n  ContextActions,\n} from '../context-actions';\nimport Popper from '../popper/Popper';\nimport DashboardList from './DashboardList';\nimport { GLOBAL_SHORTCUTS } from '../shortcuts';\n\n// mouse hold timeout to act as hold instead of click\nconst CLICK_TIMEOUT = 500;\n\n// mouse hold acceleration\nconst START_SPEED = 0.01;\nconst ACCELERATION = 0.0005;\n\nexport interface NavTabItem {\n  /**\n   * Unique key for the tab.\n   */\n  key: string;\n\n  /**\n   * Title to display on the tab.\n   */\n  title: string;\n\n  /**\n   * Icon to display on the tab.\n   */\n  icon?: IconDefinition | JSX.Element;\n\n  /**\n   * Whether the tab is closable.\n   * If omitted, the tab will be closeable if onClose exists.\n   */\n  isClosable?: boolean;\n}\n\ntype NavTabListProps<T extends NavTabItem = NavTabItem> = {\n  /**\n   * The key of the active tab.\n   * If this does not match a tab key, no tab will be active.\n   */\n  activeKey: string;\n\n  /**\n   * Array of tabs to display.\n   * @see {@link NavTabItem} for the minimum required properties.\n   */\n  tabs: T[];\n\n  /**\n   * Function called when a tab is selected.\n   *\n   * @param key The key of the tab to select\n   */\n  onSelect: (key: string) => void;\n\n  /**\n   * Function called when a tab is closed.\n   * If the function is provided, all tabs will be closeable by default.\n   * Tabs may set their own closeable property to override this behavior.\n   *\n   * @param key The key of the tab to close\n   */\n  onClose?: (key: string) => void;\n\n  /**\n   * Function called when a tab is reordered.\n   * If the function is omitted, the tab list will not be reorderable.\n   *\n   * @param sourceIndex Index in the tab list the drag started from\n   * @param destinationIndex Index in the tab list the drag ended at\n   */\n  onReorder?: (sourceIndex: number, destinationIndex: number) => void;\n\n  /**\n   * Context actions to add to the tab in addition to the default actions.\n   * The default actions are Close, Close to the Right, and Close All.\n   * The default actions have a group value of 20.\n   *\n   * @param tab The tab to make context items for\n   * @returns Additional context items for the tab\n   */\n  makeContextActions?: (tab: T) => ContextAction | ContextAction[];\n};\n\nfunction isScrolledLeft(element: HTMLElement): boolean {\n  return element.scrollLeft === 0;\n}\n\nfunction isScrolledRight(element: HTMLElement): boolean {\n  return (\n    // single pixel buffer to account for sub-pixel rendering\n    Math.abs(element.scrollLeft + element.clientWidth - element.scrollWidth) <=\n      1 || element.scrollWidth === 0\n  );\n}\n\nfunction makeBaseContextActions(\n  tab: NavTabItem,\n  tabs: NavTabItem[],\n  onClose: ((key: string) => void) | undefined\n): ContextAction[] {\n  const { isClosable = false, key } = tab;\n  const contextActions: ContextAction[] = [];\n  if (isClosable && onClose != null) {\n    contextActions.push({\n      title: 'Close',\n      order: 10,\n      group: 20,\n      action: () => {\n        onClose(key);\n      },\n    });\n\n    let disabled = true;\n    for (let i = tabs.length - 1; i > 0; i -= 1) {\n      if (tabs[i].key === tab.key) break;\n      if (tabs[i].isClosable === true) {\n        disabled = false;\n        break;\n      }\n    }\n\n    contextActions.push({\n      title: 'Close to the Right',\n      order: 20,\n      group: 20,\n      action: () => {\n        for (let i = tabs.length - 1; i > 0; i -= 1) {\n          if (tabs[i].key === key) break;\n          if (tabs[i].isClosable === true) onClose(tabs[i].key);\n        }\n      },\n      disabled,\n    });\n\n    contextActions.push({\n      title: 'Close All',\n      order: 30,\n      group: 20,\n      action: () => {\n        tabs.forEach(t => {\n          if (t.isClosable === true) onClose(t.key);\n        });\n      },\n    });\n  }\n\n  return contextActions;\n}\n\nfunction NavTabList({\n  activeKey,\n  tabs,\n  onSelect,\n  onReorder,\n  onClose,\n  makeContextActions,\n}: NavTabListProps): React.ReactElement {\n  const containerRef = useRef<HTMLDivElement>();\n  const [isOverflowing, setIsOverflowing] = useState(true);\n  const [isDashboardTabMenuShown, setIsDashboardTabMenuShown] = useState(false);\n  const [disableScrollLeft, setDisableScrollLeft] = useState(true);\n  const [disableScrollRight, setDisableScrollRight] = useState(true);\n\n  const handleResize = useCallback(() => {\n    if (containerRef.current == null) {\n      return;\n    }\n\n    if (\n      containerRef.current.clientWidth < containerRef.current.scrollWidth &&\n      tabs.length > 0\n    ) {\n      setIsOverflowing(true);\n    } else {\n      setIsOverflowing(false);\n    }\n\n    setDisableScrollLeft(isScrolledLeft(containerRef.current));\n    setDisableScrollRight(isScrolledRight(containerRef.current));\n  }, [tabs]);\n  useResizeObserver(containerRef.current, handleResize);\n\n  const onDragEnd: OnDragEndResponder = useCallback(\n    result => {\n      DragUtils.stopDragging();\n\n      // dropped outside the list\n      if (!result.destination) {\n        return;\n      }\n\n      onReorder?.(result.source.index, result.destination.index);\n    },\n    [onReorder]\n  );\n\n  const handleScroll = useCallback(() => {\n    if (containerRef.current == null) {\n      return;\n    }\n\n    const shouldDisableScrollLeft = isScrolledLeft(containerRef.current);\n    if (shouldDisableScrollLeft !== disableScrollLeft) {\n      setDisableScrollLeft(shouldDisableScrollLeft);\n    }\n\n    const shouldDisableScrollRight = isScrolledRight(containerRef.current);\n    if (shouldDisableScrollRight !== disableScrollRight) {\n      setDisableScrollRight(shouldDisableScrollRight);\n    }\n  }, [disableScrollLeft, disableScrollRight]);\n\n  const continuousScrollRef = useRef<{\n    holdTimer?: number;\n    rAF?: number;\n    cancelClick: boolean;\n  }>({ cancelClick: false });\n\n  const handleLeftClick = useCallback(() => {\n    if (\n      containerRef.current == null ||\n      continuousScrollRef.current.cancelClick\n    ) {\n      return;\n    }\n\n    const { children } = containerRef.current;\n    for (let i = children.length - 1; i >= 0; i -= 1) {\n      const child = children[i] as HTMLElement;\n      // Subtract 5px from left edge to account for rounding of offset values\n      if (child.offsetLeft < containerRef.current.scrollLeft - 5) {\n        child.scrollIntoView({\n          behavior: 'smooth',\n          block: 'nearest',\n          inline: 'start',\n        });\n        return;\n      }\n    }\n  }, []);\n\n  const handleRightClick = useCallback(() => {\n    if (\n      containerRef.current == null ||\n      continuousScrollRef.current.cancelClick\n    ) {\n      return;\n    }\n\n    const { children } = containerRef.current;\n    for (let i = 0; i < children.length; i += 1) {\n      const child = children[i] as HTMLElement;\n      // Add 5px to right edge to account for rounding of offset values\n      if (\n        child.offsetLeft + 5 >\n        containerRef.current.scrollLeft + containerRef.current.offsetWidth\n      ) {\n        child.scrollIntoView({\n          behavior: 'smooth',\n          block: 'nearest',\n          inline: 'end',\n        });\n        return;\n      }\n    }\n  }, []);\n\n  /**\n   * Recurively called after initial timeout on mousedown. Continuously scroll with acceleration.\n   * Cancelled by mouseup handler cancelling the animationFrame.\n   * @param direction of scroll, left or right\n   * @param startX starting position of scroll\n   * @param deltaX delta from intial startX calculated recursively\n   * @param prevTimestamp called on subsequent delta frames\n   */\n  const handleMouseRepeat = useCallback(\n    (\n      direction: 'left' | 'right',\n      startX: number,\n      deltaX = 0,\n      prevTimestamp?: number\n    ) => {\n      const container = containerRef.current;\n      if (container == null) {\n        return;\n      }\n\n      continuousScrollRef.current.cancelClick = true;\n\n      if (direction === 'left') {\n        // eslint-disable-next-line no-param-reassign\n        container.scrollLeft = startX - deltaX;\n      } else if (direction === 'right') {\n        // eslint-disable-next-line no-param-reassign\n        container.scrollLeft = startX + deltaX;\n      }\n\n      // eslint-disable-next-line no-param-reassign\n      continuousScrollRef.current.rAF = requestAnimationFrame(timestamp => {\n        const startTime = prevTimestamp ?? timestamp;\n        const deltaTime = timestamp - startTime;\n        let newDeltaX =\n          START_SPEED * deltaTime + 0.5 * ACCELERATION * deltaTime ** 2;\n        newDeltaX = Math.min(newDeltaX, container.scrollWidth);\n        // scrollLeft enforces a limit but no point letting delta increment beyond scrollWidth\n\n        handleMouseRepeat(direction, startX, newDeltaX, startTime);\n      });\n    },\n    []\n  );\n\n  const endContinuousScroll = useCallback(() => {\n    const { holdTimer, rAF } = continuousScrollRef.current;\n    if (holdTimer != null) {\n      clearTimeout(holdTimer);\n      continuousScrollRef.current.holdTimer = undefined;\n    }\n    if (rAF != null) {\n      cancelAnimationFrame(rAF);\n      continuousScrollRef.current.rAF = undefined;\n    }\n    window.removeEventListener('mouseup', endContinuousScroll);\n  }, []);\n\n  useEffect(\n    () => () => window.removeEventListener('mouseup', endContinuousScroll),\n    [endContinuousScroll]\n  );\n\n  const handleMouseDown = useCallback(\n    (direction: 'left' | 'right') => {\n      if (containerRef.current != null) {\n        continuousScrollRef.current.holdTimer = window.setTimeout(\n          handleMouseRepeat,\n          CLICK_TIMEOUT,\n          direction,\n          containerRef.current.scrollLeft\n        );\n      }\n      continuousScrollRef.current.cancelClick = false;\n      window.addEventListener('mouseup', endContinuousScroll);\n    },\n    [endContinuousScroll, handleMouseRepeat]\n  );\n\n  const handleMouseDownLeft = useCallback(() => {\n    handleMouseDown('left');\n  }, [handleMouseDown]);\n\n  const handleMouseDownRight = useCallback(() => {\n    handleMouseDown('right');\n  }, [handleMouseDown]);\n\n  // React binds to the root as a passive listener for wheel\n  // This prevents the wheel event from being canceled\n  // Bypass React's event system so we can prevent the default behavior\n  // https://github.com/facebook/react/issues/14856\n  useEffect(function handleWheel() {\n    const onWheel = (e: WheelEvent) => {\n      e.stopPropagation();\n      e.preventDefault();\n      const nav = e.currentTarget as HTMLDivElement;\n      const delta =\n        Math.abs(e.deltaY) > Math.abs(e.deltaX) ? e.deltaY : e.deltaX;\n\n      // Scrolling jumps too far sometimes, so clamp to get a smoother scroll\n      nav.scrollLeft += clamp(delta, -30, 30);\n    };\n\n    containerRef.current?.addEventListener('wheel', onWheel);\n    return () => {\n      containerRef.current?.removeEventListener('wheel', onWheel);\n    };\n  }, []);\n\n  const tabContextActionMap = useMemo(() => {\n    const tabContextActions = new Map<string, ResolvableContextAction[]>();\n    tabs.forEach(tab => {\n      const { key } = tab;\n      const contextActions = [\n        () => makeBaseContextActions(tab, tabs, onClose),\n        () => makeContextActions?.(tab) ?? [],\n      ];\n      tabContextActions.set(key, contextActions);\n    });\n    return tabContextActions;\n  }, [makeContextActions, tabs, onClose]);\n\n  const activeTabRef = useRef<HTMLDivElement>(null);\n  const activeTab = tabs.find(tab => tab.key === activeKey);\n  const navTabs = tabs.map((tab, index) => {\n    const { key } = tab;\n    const isActive = tab === activeTab;\n\n    return (\n      <NavTab\n        tab={tab}\n        key={key}\n        index={index}\n        isActive={isActive}\n        activeRef={activeTabRef}\n        onSelect={onSelect}\n        onClose={onClose}\n        isDraggable={onReorder != null}\n        contextActions={tabContextActionMap.get(key)}\n      />\n    );\n  });\n\n  useEffect(\n    // Needs to be in a useEffect so the ref is updated\n    function scrollActiveTabIntoView() {\n      if (activeTabRef.current != null) {\n        activeTabRef.current.scrollIntoView({\n          block: 'nearest',\n          inline: 'nearest',\n        });\n      }\n    },\n    [activeKey]\n  );\n\n  const handleDashboardMenuClick = () => {\n    setIsDashboardTabMenuShown(!isDashboardTabMenuShown);\n  };\n\n  const handleDashboardMenuSelect = (tab: NavTabItem) => {\n    setIsDashboardTabMenuShown(false);\n\n    onSelect(tab.key);\n  };\n\n  const handleDashboardMenuClose = () => {\n    setIsDashboardTabMenuShown(false);\n  };\n\n  return (\n    <nav className=\"nav-container\">\n      {isOverflowing && (\n        <Button\n          kind=\"ghost\"\n          icon={<FontAwesomeIcon icon={vsChevronLeft} transform=\"grow-4\" />}\n          className=\"tab-controls-btn tab-controls-btn-left\"\n          tooltip=\"Scroll left\"\n          onClick={handleLeftClick}\n          onMouseDown={handleMouseDownLeft}\n          disabled={disableScrollLeft}\n        />\n      )}\n      <DragDropContext\n        onDragStart={DragUtils.startDragging}\n        onDragEnd={onDragEnd}\n      >\n        <Droppable\n          droppableId=\"droppable-tab-navigation\"\n          direction=\"horizontal\"\n        >\n          {(provided, snapshot) => (\n            <div\n              ref={r => {\n                if (r == null) {\n                  return;\n                }\n                containerRef.current = r;\n                provided.innerRef(r);\n              }}\n              // eslint-disable-next-line react/jsx-props-no-spreading\n              {...provided.droppableProps}\n              className={classNames('nav nav-tabs', {\n                dragging: snapshot.draggingFromThisWith,\n              })}\n              role=\"tablist\"\n              onScroll={handleScroll}\n            >\n              {navTabs}\n              {provided.placeholder}\n            </div>\n          )}\n        </Droppable>\n      </DragDropContext>\n      {isOverflowing && (\n        <Button\n          kind=\"ghost\"\n          icon={<FontAwesomeIcon icon={vsChevronRight} transform=\"grow-4\" />}\n          className=\"tab-controls-btn tab-controls-btn-right\"\n          tooltip=\"Scroll right\"\n          onClick={handleRightClick}\n          onMouseDown={handleMouseDownRight}\n          disabled={disableScrollRight}\n        />\n      )}\n      <Button\n        kind=\"ghost\"\n        icon={<FontAwesomeIcon icon={vsChevronDown} transform=\"grow-4\" />}\n        className=\"btn-dashboard-list-menu btn-show-dashboard-list\"\n        tooltip=\"Search open dashboards\"\n        onClick={handleDashboardMenuClick}\n        disabled={tabs.length < 2}\n        style={{\n          visibility: isOverflowing ? 'visible' : 'hidden',\n          marginLeft: 'auto',\n        }}\n      >\n        <Popper\n          isShown={isDashboardTabMenuShown}\n          className=\"dashboard-list-menu-popper\"\n          onExited={handleDashboardMenuClose}\n          options={{\n            placement: 'bottom-start',\n          }}\n          closeOnBlur\n          interactive\n        >\n          <DashboardList tabs={tabs} onSelect={handleDashboardMenuSelect} />\n        </Popper>\n      </Button>\n      <ContextActions\n        actions={[\n          {\n            action: () => {\n              setIsDashboardTabMenuShown(!isDashboardTabMenuShown);\n            },\n            shortcut: GLOBAL_SHORTCUTS.OPEN_DASHBOARD_LIST,\n            isGlobal: true,\n          },\n        ]}\n      />\n    </nav>\n  );\n}\n\nexport default NavTabList;\n"],"mappings":"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"}
+{"version":3,"file":"NavTabList.js","names":["React","useCallback","useEffect","useMemo","useRef","useState","classNames","clamp","DragDropContext","Droppable","FontAwesomeIcon","vsChevronRight","vsChevronLeft","vsChevronDown","useResizeObserver","DragUtils","Button","NavTab","ContextActions","Popper","DashboardList","GLOBAL_SHORTCUTS","jsx","_jsx","jsxs","_jsxs","CLICK_TIMEOUT","START_SPEED","ACCELERATION","isScrolledLeft","element","scrollLeft","isScrolledRight","Math","abs","clientWidth","scrollWidth","makeBaseContextActions","tab","tabs","onClose","isClosable","key","contextActions","push","title","order","group","action","disabled","i","length","forEach","t","NavTabList","_ref","activeKey","onSelect","onReorder","makeContextActions","containerRef","isOverflowing","setIsOverflowing","isDashboardTabMenuShown","setIsDashboardTabMenuShown","disableScrollLeft","setDisableScrollLeft","disableScrollRight","setDisableScrollRight","handleResize","current","onDragEnd","result","stopDragging","destination","source","index","handleScroll","shouldDisableScrollLeft","shouldDisableScrollRight","continuousScrollRef","cancelClick","handleLeftClick","children","child","offsetLeft","scrollIntoView","behavior","block","inline","handleRightClick","offsetWidth","handleMouseRepeat","direction","startX","deltaX","arguments","undefined","prevTimestamp","container","rAF","requestAnimationFrame","timestamp","startTime","deltaTime","newDeltaX","min","endContinuousScroll","holdTimer","clearTimeout","cancelAnimationFrame","window","removeEventListener","handleMouseDown","setTimeout","addEventListener","handleMouseDownLeft","handleMouseDownRight","handleWheel","_containerRef$current","onWheel","e","stopPropagation","preventDefault","nav","currentTarget","delta","deltaY","_containerRef$current2","tabContextActionMap","tabContextActions","Map","_makeContextActions","set","activeTabRef","activeTab","find","navTabs","map","isActive","activeRef","isDraggable","get","scrollActiveTabIntoView","handleDashboardMenuClick","handleDashboardMenuSelect","handleDashboardMenuClose","className","kind","icon","transform","tooltip","onClick","onMouseDown","onDragStart","startDragging","droppableId","provided","snapshot","_objectSpread","ref","r","innerRef","droppableProps","dragging","draggingFromThisWith","role","onScroll","placeholder","style","visibility","marginLeft","isShown","onExited","options","placement","closeOnBlur","interactive","actions","shortcut","OPEN_DASHBOARD_LIST","isGlobal"],"sources":["../../src/navigation/NavTabList.tsx"],"sourcesContent":["import React, {\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\nimport classNames from 'classnames';\nimport clamp from 'lodash.clamp';\nimport {\n  DragDropContext,\n  Droppable,\n  type OnDragEndResponder,\n} from '@hello-pangea/dnd';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport { type IconDefinition } from '@fortawesome/fontawesome-svg-core';\nimport { vsChevronRight, vsChevronLeft, vsChevronDown } from '@deephaven/icons';\nimport { useResizeObserver } from '@deephaven/react-hooks';\nimport DragUtils from '../DragUtils';\nimport Button from '../Button';\nimport NavTab from './NavTab';\nimport './NavTabList.scss';\nimport {\n  type ContextAction,\n  type ResolvableContextAction,\n  ContextActions,\n} from '../context-actions';\nimport Popper from '../popper/Popper';\nimport DashboardList from './DashboardList';\nimport { GLOBAL_SHORTCUTS } from '../shortcuts';\n\n// mouse hold timeout to act as hold instead of click\nconst CLICK_TIMEOUT = 500;\n\n// mouse hold acceleration\nconst START_SPEED = 0.01;\nconst ACCELERATION = 0.0005;\n\nexport interface NavTabItem {\n  /**\n   * Unique key for the tab.\n   */\n  key: string;\n\n  /**\n   * Title to display on the tab.\n   */\n  title: string;\n\n  /**\n   * Icon to display on the tab.\n   */\n  icon?: IconDefinition | JSX.Element;\n\n  /**\n   * Whether the tab is closable.\n   * If omitted, the tab will be closeable if onClose exists.\n   */\n  isClosable?: boolean;\n}\n\ntype NavTabListProps<T extends NavTabItem = NavTabItem> = {\n  /**\n   * The key of the active tab.\n   * If this does not match a tab key, no tab will be active.\n   */\n  activeKey: string;\n\n  /**\n   * Array of tabs to display.\n   * @see {@link NavTabItem} for the minimum required properties.\n   */\n  tabs: T[];\n\n  /**\n   * Function called when a tab is selected.\n   *\n   * @param key The key of the tab to select\n   */\n  onSelect: (key: string) => void;\n\n  /**\n   * Function called when a tab is closed.\n   * If the function is provided, all tabs will be closeable by default.\n   * Tabs may set their own closeable property to override this behavior.\n   *\n   * @param key The key of the tab to close\n   */\n  onClose?: (key: string) => void;\n\n  /**\n   * Function called when a tab is reordered.\n   * If the function is omitted, the tab list will not be reorderable.\n   *\n   * @param sourceIndex Index in the tab list the drag started from\n   * @param destinationIndex Index in the tab list the drag ended at\n   */\n  onReorder?: (sourceIndex: number, destinationIndex: number) => void;\n\n  /**\n   * Context actions to add to the tab in addition to the default actions.\n   * The default actions are Close, Close to the Right, and Close All.\n   * The default actions have a group value of 20.\n   *\n   * @param tab The tab to make context items for\n   * @returns Additional context items for the tab\n   */\n  makeContextActions?: (tab: T) => ContextAction | ContextAction[];\n};\n\nfunction isScrolledLeft(element: HTMLElement): boolean {\n  return element.scrollLeft === 0;\n}\n\nfunction isScrolledRight(element: HTMLElement): boolean {\n  return (\n    // single pixel buffer to account for sub-pixel rendering\n    Math.abs(element.scrollLeft + element.clientWidth - element.scrollWidth) <=\n      1 || element.scrollWidth === 0\n  );\n}\n\nfunction makeBaseContextActions(\n  tab: NavTabItem,\n  tabs: NavTabItem[],\n  onClose: ((key: string) => void) | undefined\n): ContextAction[] {\n  const { isClosable = false, key } = tab;\n  const contextActions: ContextAction[] = [];\n  if (isClosable && onClose != null) {\n    contextActions.push({\n      title: 'Close',\n      order: 10,\n      group: 20,\n      action: () => {\n        onClose(key);\n      },\n    });\n\n    let disabled = true;\n    for (let i = tabs.length - 1; i > 0; i -= 1) {\n      if (tabs[i].key === tab.key) break;\n      if (tabs[i].isClosable === true) {\n        disabled = false;\n        break;\n      }\n    }\n\n    contextActions.push({\n      title: 'Close to the Right',\n      order: 20,\n      group: 20,\n      action: () => {\n        for (let i = tabs.length - 1; i > 0; i -= 1) {\n          if (tabs[i].key === key) break;\n          if (tabs[i].isClosable === true) onClose(tabs[i].key);\n        }\n      },\n      disabled,\n    });\n\n    contextActions.push({\n      title: 'Close All',\n      order: 30,\n      group: 20,\n      action: () => {\n        tabs.forEach(t => {\n          if (t.isClosable === true) onClose(t.key);\n        });\n      },\n    });\n  }\n\n  return contextActions;\n}\n\nfunction NavTabList({\n  activeKey,\n  tabs,\n  onSelect,\n  onReorder,\n  onClose,\n  makeContextActions,\n}: NavTabListProps): React.ReactElement {\n  const containerRef = useRef<HTMLDivElement>();\n  const [isOverflowing, setIsOverflowing] = useState(true);\n  const [isDashboardTabMenuShown, setIsDashboardTabMenuShown] = useState(false);\n  const [disableScrollLeft, setDisableScrollLeft] = useState(true);\n  const [disableScrollRight, setDisableScrollRight] = useState(true);\n\n  const handleResize = useCallback(() => {\n    if (containerRef.current == null) {\n      return;\n    }\n\n    if (\n      containerRef.current.clientWidth < containerRef.current.scrollWidth &&\n      tabs.length > 0\n    ) {\n      setIsOverflowing(true);\n    } else {\n      setIsOverflowing(false);\n    }\n\n    setDisableScrollLeft(isScrolledLeft(containerRef.current));\n    setDisableScrollRight(isScrolledRight(containerRef.current));\n  }, [tabs]);\n  useResizeObserver(containerRef.current, handleResize);\n\n  const onDragEnd: OnDragEndResponder = useCallback(\n    result => {\n      DragUtils.stopDragging();\n\n      // dropped outside the list\n      if (!result.destination) {\n        return;\n      }\n\n      onReorder?.(result.source.index, result.destination.index);\n    },\n    [onReorder]\n  );\n\n  const handleScroll = useCallback(() => {\n    if (containerRef.current == null) {\n      return;\n    }\n\n    const shouldDisableScrollLeft = isScrolledLeft(containerRef.current);\n    if (shouldDisableScrollLeft !== disableScrollLeft) {\n      setDisableScrollLeft(shouldDisableScrollLeft);\n    }\n\n    const shouldDisableScrollRight = isScrolledRight(containerRef.current);\n    if (shouldDisableScrollRight !== disableScrollRight) {\n      setDisableScrollRight(shouldDisableScrollRight);\n    }\n  }, [disableScrollLeft, disableScrollRight]);\n\n  const continuousScrollRef = useRef<{\n    holdTimer?: number;\n    rAF?: number;\n    cancelClick: boolean;\n  }>({ cancelClick: false });\n\n  const handleLeftClick = useCallback(() => {\n    if (\n      containerRef.current == null ||\n      continuousScrollRef.current.cancelClick\n    ) {\n      return;\n    }\n\n    const { children } = containerRef.current;\n    for (let i = children.length - 1; i >= 0; i -= 1) {\n      const child = children[i] as HTMLElement;\n      // Subtract 5px from left edge to account for rounding of offset values\n      if (child.offsetLeft < containerRef.current.scrollLeft - 5) {\n        child.scrollIntoView({\n          behavior: 'smooth',\n          block: 'nearest',\n          inline: 'start',\n        });\n        return;\n      }\n    }\n  }, []);\n\n  const handleRightClick = useCallback(() => {\n    if (\n      containerRef.current == null ||\n      continuousScrollRef.current.cancelClick\n    ) {\n      return;\n    }\n\n    const { children } = containerRef.current;\n    for (let i = 0; i < children.length; i += 1) {\n      const child = children[i] as HTMLElement;\n      // Add 5px to right edge to account for rounding of offset values\n      if (\n        child.offsetLeft + 5 >\n        containerRef.current.scrollLeft + containerRef.current.offsetWidth\n      ) {\n        child.scrollIntoView({\n          behavior: 'smooth',\n          block: 'nearest',\n          inline: 'end',\n        });\n        return;\n      }\n    }\n  }, []);\n\n  /**\n   * Recurively called after initial timeout on mousedown. Continuously scroll with acceleration.\n   * Cancelled by mouseup handler cancelling the animationFrame.\n   * @param direction of scroll, left or right\n   * @param startX starting position of scroll\n   * @param deltaX delta from intial startX calculated recursively\n   * @param prevTimestamp called on subsequent delta frames\n   */\n  const handleMouseRepeat = useCallback(\n    (\n      direction: 'left' | 'right',\n      startX: number,\n      deltaX = 0,\n      prevTimestamp?: number\n    ) => {\n      const container = containerRef.current;\n      if (container == null) {\n        return;\n      }\n\n      continuousScrollRef.current.cancelClick = true;\n\n      if (direction === 'left') {\n        // eslint-disable-next-line no-param-reassign\n        container.scrollLeft = startX - deltaX;\n      } else if (direction === 'right') {\n        // eslint-disable-next-line no-param-reassign\n        container.scrollLeft = startX + deltaX;\n      }\n\n      // eslint-disable-next-line no-param-reassign\n      continuousScrollRef.current.rAF = requestAnimationFrame(timestamp => {\n        const startTime = prevTimestamp ?? timestamp;\n        const deltaTime = timestamp - startTime;\n        let newDeltaX =\n          START_SPEED * deltaTime + 0.5 * ACCELERATION * deltaTime ** 2;\n        newDeltaX = Math.min(newDeltaX, container.scrollWidth);\n        // scrollLeft enforces a limit but no point letting delta increment beyond scrollWidth\n\n        handleMouseRepeat(direction, startX, newDeltaX, startTime);\n      });\n    },\n    []\n  );\n\n  const endContinuousScroll = useCallback(() => {\n    const { holdTimer, rAF } = continuousScrollRef.current;\n    if (holdTimer != null) {\n      clearTimeout(holdTimer);\n      continuousScrollRef.current.holdTimer = undefined;\n    }\n    if (rAF != null) {\n      cancelAnimationFrame(rAF);\n      continuousScrollRef.current.rAF = undefined;\n    }\n    window.removeEventListener('mouseup', endContinuousScroll);\n  }, []);\n\n  useEffect(\n    () => () => window.removeEventListener('mouseup', endContinuousScroll),\n    [endContinuousScroll]\n  );\n\n  const handleMouseDown = useCallback(\n    (direction: 'left' | 'right') => {\n      if (containerRef.current != null) {\n        continuousScrollRef.current.holdTimer = window.setTimeout(\n          handleMouseRepeat,\n          CLICK_TIMEOUT,\n          direction,\n          containerRef.current.scrollLeft\n        );\n      }\n      continuousScrollRef.current.cancelClick = false;\n      window.addEventListener('mouseup', endContinuousScroll);\n    },\n    [endContinuousScroll, handleMouseRepeat]\n  );\n\n  const handleMouseDownLeft = useCallback(() => {\n    handleMouseDown('left');\n  }, [handleMouseDown]);\n\n  const handleMouseDownRight = useCallback(() => {\n    handleMouseDown('right');\n  }, [handleMouseDown]);\n\n  // React binds to the root as a passive listener for wheel\n  // This prevents the wheel event from being canceled\n  // Bypass React's event system so we can prevent the default behavior\n  // https://github.com/facebook/react/issues/14856\n  useEffect(function handleWheel() {\n    const onWheel = (e: WheelEvent) => {\n      e.stopPropagation();\n      e.preventDefault();\n      const nav = e.currentTarget as HTMLDivElement;\n      const delta =\n        Math.abs(e.deltaY) > Math.abs(e.deltaX) ? e.deltaY : e.deltaX;\n\n      // Scrolling jumps too far sometimes, so clamp to get a smoother scroll\n      nav.scrollLeft += clamp(delta, -30, 30);\n    };\n\n    containerRef.current?.addEventListener('wheel', onWheel);\n    return () => {\n      containerRef.current?.removeEventListener('wheel', onWheel);\n    };\n  }, []);\n\n  const tabContextActionMap = useMemo(() => {\n    const tabContextActions = new Map<string, ResolvableContextAction[]>();\n    tabs.forEach(tab => {\n      const { key } = tab;\n      const contextActions = [\n        () => makeBaseContextActions(tab, tabs, onClose),\n        () => makeContextActions?.(tab) ?? [],\n      ];\n      tabContextActions.set(key, contextActions);\n    });\n    return tabContextActions;\n  }, [makeContextActions, tabs, onClose]);\n\n  const activeTabRef = useRef<HTMLDivElement>(null);\n  const activeTab = tabs.find(tab => tab.key === activeKey);\n  const navTabs = tabs.map((tab, index) => {\n    const { key } = tab;\n    const isActive = tab === activeTab;\n\n    return (\n      <NavTab\n        tab={tab}\n        key={key}\n        index={index}\n        isActive={isActive}\n        activeRef={activeTabRef}\n        onSelect={onSelect}\n        onClose={onClose}\n        isDraggable={onReorder != null}\n        contextActions={tabContextActionMap.get(key)}\n      />\n    );\n  });\n\n  useEffect(\n    // Needs to be in a useEffect so the ref is updated\n    function scrollActiveTabIntoView() {\n      if (activeTabRef.current != null) {\n        activeTabRef.current.scrollIntoView({\n          block: 'nearest',\n          inline: 'nearest',\n        });\n      }\n    },\n    [activeKey]\n  );\n\n  const handleDashboardMenuClick = () => {\n    setIsDashboardTabMenuShown(!isDashboardTabMenuShown);\n  };\n\n  const handleDashboardMenuSelect = (tab: NavTabItem) => {\n    setIsDashboardTabMenuShown(false);\n\n    onSelect(tab.key);\n  };\n\n  const handleDashboardMenuClose = () => {\n    setIsDashboardTabMenuShown(false);\n  };\n\n  return (\n    <nav className=\"nav-container\">\n      {isOverflowing && (\n        <Button\n          kind=\"ghost\"\n          icon={<FontAwesomeIcon icon={vsChevronLeft} transform=\"grow-4\" />}\n          className=\"tab-controls-btn tab-controls-btn-left\"\n          tooltip=\"Scroll left\"\n          onClick={handleLeftClick}\n          onMouseDown={handleMouseDownLeft}\n          disabled={disableScrollLeft}\n        />\n      )}\n      <DragDropContext\n        onDragStart={DragUtils.startDragging}\n        onDragEnd={onDragEnd}\n      >\n        <Droppable\n          droppableId=\"droppable-tab-navigation\"\n          direction=\"horizontal\"\n        >\n          {(provided, snapshot) => (\n            <div\n              ref={r => {\n                if (r == null) {\n                  return;\n                }\n                containerRef.current = r;\n                provided.innerRef(r);\n              }}\n              // eslint-disable-next-line react/jsx-props-no-spreading\n              {...provided.droppableProps}\n              className={classNames('nav nav-tabs', {\n                dragging: snapshot.draggingFromThisWith,\n              })}\n              role=\"tablist\"\n              onScroll={handleScroll}\n            >\n              {navTabs}\n              {provided.placeholder}\n            </div>\n          )}\n        </Droppable>\n      </DragDropContext>\n      {isOverflowing && (\n        <Button\n          kind=\"ghost\"\n          icon={<FontAwesomeIcon icon={vsChevronRight} transform=\"grow-4\" />}\n          className=\"tab-controls-btn tab-controls-btn-right\"\n          tooltip=\"Scroll right\"\n          onClick={handleRightClick}\n          onMouseDown={handleMouseDownRight}\n          disabled={disableScrollRight}\n        />\n      )}\n      <Button\n        kind=\"ghost\"\n        icon={<FontAwesomeIcon icon={vsChevronDown} transform=\"grow-4\" />}\n        className=\"btn-dashboard-list-menu btn-show-dashboard-list\"\n        tooltip=\"Search open dashboards\"\n        onClick={handleDashboardMenuClick}\n        disabled={tabs.length < 2}\n        style={{\n          visibility: isOverflowing ? 'visible' : 'hidden',\n          marginLeft: 'auto',\n        }}\n      >\n        <Popper\n          isShown={isDashboardTabMenuShown}\n          className=\"dashboard-list-menu-popper\"\n          onExited={handleDashboardMenuClose}\n          options={{\n            placement: 'bottom-start',\n          }}\n          closeOnBlur\n          interactive\n        >\n          <DashboardList tabs={tabs} onSelect={handleDashboardMenuSelect} />\n        </Popper>\n      </Button>\n      <ContextActions\n        actions={[\n          {\n            action: () => {\n              setIsDashboardTabMenuShown(!isDashboardTabMenuShown);\n            },\n            shortcut: GLOBAL_SHORTCUTS.OPEN_DASHBOARD_LIST,\n            isGlobal: true,\n          },\n        ]}\n      />\n    </nav>\n  );\n}\n\nexport default NavTabList;\n"],"mappings":"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","ignoreList":[]}

package/dist/navigation/Page.js

@@ -2,8 +2,7 @@ import React from 'react';
 import { vsClose, vsChevronLeft } from '@deephaven/icons';
 import "./Page.css";
 import Button from "../Button.js";
-import { jsx as _jsx } from "react/jsx-runtime";
-import { jsxs as _jsxs } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 /**
  * A page view with a back button in the bottom left, a title at the top, and a close button in the top right.
  * Back and close buttons will only appear if `onBack` and/or `onClose` callbacks are set.

package/dist/navigation/Page.js.map

@@ -1 +1 @@
-{"version":3,"file":"Page.js","names":["React","vsClose","vsChevronLeft","Button","jsx","_jsx","jsxs","_jsxs","Page","_ref","children","onBack","onClose","title","dataTestId","className","undefined","kind","onClick","icon","tooltip"],"sources":["../../src/navigation/Page.tsx"],"sourcesContent":["import React from 'react';\nimport { vsClose, vsChevronLeft } from '@deephaven/icons';\nimport './Page.scss';\nimport Button from '../Button';\n\nexport type PageProps = {\n  children: React.ReactNode;\n  onBack?: () => void;\n  onClose?: () => void;\n  title: string;\n  'data-testid'?: string;\n};\n\n/**\n * A page view with a back button in the bottom left, a title at the top, and a close button in the top right.\n * Back and close buttons will only appear if `onBack` and/or `onClose` callbacks are set.\n */\nexport function Page({\n  children,\n  onBack,\n  onClose,\n  title,\n  'data-testid': dataTestId,\n}: PageProps): JSX.Element {\n  return (\n    <div className=\"navigation-page\" data-testid={dataTestId}>\n      <div className=\"navigation-title-bar\">\n        <div className=\"navigation-left-buttons\">\n          {onBack !== undefined && (\n            <Button\n              kind=\"ghost\"\n              className=\"btn-back m-1 btn-sm\"\n              data-testid=\"btn-page-back\"\n              onClick={onBack}\n              icon={vsChevronLeft}\n            >\n              Back\n            </Button>\n          )}\n        </div>\n        <div className=\"navigation-title\">{title}</div>\n        <div className=\"navigation-right-buttons\">\n          {onClose !== undefined && (\n            <Button\n              kind=\"ghost\"\n              className=\"btn-close btn-sm px-2 m-1\"\n              data-testid=\"btn-page-close\"\n              onClick={onClose}\n              icon={vsClose}\n              tooltip=\"Close\"\n            />\n          )}\n        </div>\n      </div>\n      <div className=\"navigation-content\">{children}</div>\n    </div>\n  );\n}\n\nexport default Page;\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,OAAO,EAAEC,aAAa,QAAQ,kBAAkB;AAAC;AAAA,OAEnDC,MAAM;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAAA,SAAAC,IAAA,IAAAC,KAAA;AAUb;AACA;AACA;AACA;AACA,OAAO,SAASC,IAAIA,CAAAC,IAAA,EAMO;EAAA,IANN;IACnBC,QAAQ;IACRC,MAAM;IACNC,OAAO;IACPC,KAAK;IACL,aAAa,EAAEC;EACN,CAAC,GAAAL,IAAA;EACV,oBACEF,KAAA;IAAKQ,SAAS,EAAC,iBAAiB;IAAC,eAAaD,UAAW;IAAAJ,QAAA,gBACvDH,KAAA;MAAKQ,SAAS,EAAC,sBAAsB;MAAAL,QAAA,gBACnCL,IAAA;QAAKU,SAAS,EAAC,yBAAyB;QAAAL,QAAA,EACrCC,MAAM,KAAKK,SAAS,iBACnBX,IAAA,CAACF,MAAM;UACLc,IAAI,EAAC,OAAO;UACZF,SAAS,EAAC,qBAAqB;UAC/B,eAAY,eAAe;UAC3BG,OAAO,EAAEP,MAAO;UAChBQ,IAAI,EAAEjB,aAAc;UAAAQ,QAAA,EACrB;QAED,CAAQ;MACT,CACE,CAAC,eACNL,IAAA;QAAKU,SAAS,EAAC,kBAAkB;QAAAL,QAAA,EAAEG;MAAK,CAAM,CAAC,eAC/CR,IAAA;QAAKU,SAAS,EAAC,0BAA0B;QAAAL,QAAA,EACtCE,OAAO,KAAKI,SAAS,iBACpBX,IAAA,CAACF,MAAM;UACLc,IAAI,EAAC,OAAO;UACZF,SAAS,EAAC,2BAA2B;UACrC,eAAY,gBAAgB;UAC5BG,OAAO,EAAEN,OAAQ;UACjBO,IAAI,EAAElB,OAAQ;UACdmB,OAAO,EAAC;QAAO,CAChB;MACF,CACE,CAAC;IAAA,CACH,CAAC,eACNf,IAAA;MAAKU,SAAS,EAAC,oBAAoB;MAAAL,QAAA,EAAEA;IAAQ,CAAM,CAAC;EAAA,CACjD,CAAC;AAEV;AAEA,eAAeF,IAAI"}
+{"version":3,"file":"Page.js","names":["React","vsClose","vsChevronLeft","Button","jsx","_jsx","jsxs","_jsxs","Page","_ref","children","onBack","onClose","title","dataTestId","className","undefined","kind","onClick","icon","tooltip"],"sources":["../../src/navigation/Page.tsx"],"sourcesContent":["import React from 'react';\nimport { vsClose, vsChevronLeft } from '@deephaven/icons';\nimport './Page.scss';\nimport Button from '../Button';\n\nexport type PageProps = {\n  children: React.ReactNode;\n  onBack?: () => void;\n  onClose?: () => void;\n  title: string;\n  'data-testid'?: string;\n};\n\n/**\n * A page view with a back button in the bottom left, a title at the top, and a close button in the top right.\n * Back and close buttons will only appear if `onBack` and/or `onClose` callbacks are set.\n */\nexport function Page({\n  children,\n  onBack,\n  onClose,\n  title,\n  'data-testid': dataTestId,\n}: PageProps): JSX.Element {\n  return (\n    <div className=\"navigation-page\" data-testid={dataTestId}>\n      <div className=\"navigation-title-bar\">\n        <div className=\"navigation-left-buttons\">\n          {onBack !== undefined && (\n            <Button\n              kind=\"ghost\"\n              className=\"btn-back m-1 btn-sm\"\n              data-testid=\"btn-page-back\"\n              onClick={onBack}\n              icon={vsChevronLeft}\n            >\n              Back\n            </Button>\n          )}\n        </div>\n        <div className=\"navigation-title\">{title}</div>\n        <div className=\"navigation-right-buttons\">\n          {onClose !== undefined && (\n            <Button\n              kind=\"ghost\"\n              className=\"btn-close btn-sm px-2 m-1\"\n              data-testid=\"btn-page-close\"\n              onClick={onClose}\n              icon={vsClose}\n              tooltip=\"Close\"\n            />\n          )}\n        </div>\n      </div>\n      <div className=\"navigation-content\">{children}</div>\n    </div>\n  );\n}\n\nexport default Page;\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,OAAO,EAAEC,aAAa,QAAQ,kBAAkB;AAAC;AAAA,OAEnDC,MAAM;AAAA,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAUb;AACA;AACA;AACA;AACA,OAAO,SAASC,IAAIA,CAAAC,IAAA,EAMO;EAAA,IANN;IACnBC,QAAQ;IACRC,MAAM;IACNC,OAAO;IACPC,KAAK;IACL,aAAa,EAAEC;EACN,CAAC,GAAAL,IAAA;EACV,oBACEF,KAAA;IAAKQ,SAAS,EAAC,iBAAiB;IAAC,eAAaD,UAAW;IAAAJ,QAAA,gBACvDH,KAAA;MAAKQ,SAAS,EAAC,sBAAsB;MAAAL,QAAA,gBACnCL,IAAA;QAAKU,SAAS,EAAC,yBAAyB;QAAAL,QAAA,EACrCC,MAAM,KAAKK,SAAS,iBACnBX,IAAA,CAACF,MAAM;UACLc,IAAI,EAAC,OAAO;UACZF,SAAS,EAAC,qBAAqB;UAC/B,eAAY,eAAe;UAC3BG,OAAO,EAAEP,MAAO;UAChBQ,IAAI,EAAEjB,aAAc;UAAAQ,QAAA,EACrB;QAED,CAAQ;MACT,CACE,CAAC,eACNL,IAAA;QAAKU,SAAS,EAAC,kBAAkB;QAAAL,QAAA,EAAEG;MAAK,CAAM,CAAC,eAC/CR,IAAA;QAAKU,SAAS,EAAC,0BAA0B;QAAAL,QAAA,EACtCE,OAAO,KAAKI,SAAS,iBACpBX,IAAA,CAACF,MAAM;UACLc,IAAI,EAAC,OAAO;UACZF,SAAS,EAAC,2BAA2B;UACrC,eAAY,gBAAgB;UAC5BG,OAAO,EAAEN,OAAQ;UACjBO,IAAI,EAAElB,OAAQ;UACdmB,OAAO,EAAC;QAAO,CAChB;MACF,CACE,CAAC;IAAA,CACH,CAAC,eACNf,IAAA;MAAKU,SAAS,EAAC,oBAAoB;MAAAL,QAAA,EAAEA;IAAQ,CAAM,CAAC;EAAA,CACjD,CAAC;AAEV;AAEA,eAAeF,IAAI","ignoreList":[]}

package/dist/navigation/Stack.js

@@ -2,9 +2,7 @@ import React, { useState, useEffect, useMemo, useCallback } from 'react';
 import { usePrevious } from '@deephaven/react-hooks';
 import "./Stack.css";
 import { SlideTransition } from "../transitions/index.js";
-import { jsx as _jsx } from "react/jsx-runtime";
-import { Fragment as _Fragment } from "react/jsx-runtime";
-import { jsxs as _jsxs } from "react/jsx-runtime";
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 /**
  * Pass a full navigation stack of children, and then automatically does a sliding animation when the stack changes.
  * Adding items to the stack will do a "push" animation, and removing items from the stack will do a "pop" animation.

package/dist/navigation/Stack.js.map

@@ -1 +1 @@
-{"version":3,"file":"Stack.js","names":["React","useState","useEffect","useMemo","useCallback","usePrevious","SlideTransition","jsx","_jsx","Fragment","_Fragment","jsxs","_jsxs","Stack","_ref","children","dataTestId","childrenArray","Children","toArray","prevChildrenArray","mainView","setMainView","length","pushingView","setPushingView","poppingView","setPoppingView","initAnimation","undefined","topChild","pushComplete","popComplete","className","direction","in","onEntered"],"sources":["../../src/navigation/Stack.tsx"],"sourcesContent":["import React, { useState, useEffect, useMemo, useCallback } from 'react';\nimport { usePrevious } from '@deephaven/react-hooks';\nimport './Stack.scss';\nimport { SlideTransition } from '../transitions';\n\nexport type StackProps = {\n  children: React.ReactNode | React.ReactNode[];\n  'data-testid'?: string;\n};\n\n/**\n * Pass a full navigation stack of children, and then automatically does a sliding animation when the stack changes.\n * Adding items to the stack will do a \"push\" animation, and removing items from the stack will do a \"pop\" animation.\n */\nexport function Stack({\n  children,\n  'data-testid': dataTestId,\n}: StackProps): JSX.Element {\n  const childrenArray = useMemo(\n    () => React.Children.toArray(children),\n    [children]\n  );\n  const prevChildrenArray = usePrevious(childrenArray);\n  const [mainView, setMainView] = useState<React.ReactNode>(\n    childrenArray[childrenArray.length - 1]\n  );\n\n  const [pushingView, setPushingView] = useState<React.ReactNode>(null);\n  const [poppingView, setPoppingView] = useState<React.ReactNode>(null);\n\n  /**\n   * To do the animation effect, we just need to set the proper pushing/popping views when the stack changes.\n   * `mainView` - The main view of the stack, stationary, filling the container.\n   * `pushingView` - A view that's currently being pushed. Slides from off screen right to overtop of `mainView`.\n   * `poppingView` - A view that's currently being popped. Slides from overtop of `mainView` to right off screen.\n   *\n   * When the `pushingView` or `poppingView` is set, that will kick off their animation.\n   * Completion of the animation is handled in `pushComplete` or `popComplete`, and then the stack is in an idle state again.\n   */\n  useEffect(\n    function initAnimation() {\n      if (\n        prevChildrenArray === undefined ||\n        childrenArray === prevChildrenArray\n      ) {\n        return;\n      }\n      const topChild = childrenArray[childrenArray.length - 1];\n      if (\n        childrenArray.length === prevChildrenArray.length ||\n        prevChildrenArray.length === 0 ||\n        pushingView !== null ||\n        poppingView !== null\n      ) {\n        // 1) Stack is the same size, we've just mounted, or we're already in an animation - just update the view\n        if (pushingView !== null && topChild !== pushingView) {\n          // Stack was updated mid animation\n          setPushingView(topChild);\n        } else if (topChild !== poppingView && topChild !== mainView) {\n          // Replace the current view\n          setMainView(topChild);\n        }\n      } else if (childrenArray.length > prevChildrenArray.length) {\n        // 2) Stack has grown - start the push animation\n        setPushingView(topChild);\n      } else if (childrenArray.length < prevChildrenArray.length) {\n        // 3) Stack has shrunk - start the pop animation\n        setMainView(topChild);\n        setPoppingView(prevChildrenArray[prevChildrenArray.length - 1]);\n      }\n    },\n    [childrenArray, prevChildrenArray, pushingView, poppingView, mainView]\n  );\n\n  const pushComplete = useCallback(() => {\n    setMainView(pushingView);\n    setPushingView(null);\n  }, [pushingView]);\n\n  const popComplete = useCallback(() => {\n    setPoppingView(null);\n  }, []);\n\n  return (\n    <div className=\"navigation-stack\">\n      <div className=\"main-view\" data-testid={dataTestId}>\n        {mainView}\n      </div>\n\n      <SlideTransition\n        direction=\"right\"\n        in={poppingView != null}\n        onEntered={popComplete}\n      >\n        {/* Without the fragment, the transition doesn't work. Without the conditional render, the stack is blank */}\n        {/* eslint-disable-next-line react/jsx-no-useless-fragment */}\n        <>\n          {poppingView != null && (\n            <div className=\"popping-view\">{poppingView}</div>\n          )}\n        </>\n      </SlideTransition>\n      <SlideTransition in={pushingView != null} onEntered={pushComplete}>\n        {/* eslint-disable-next-line react/jsx-no-useless-fragment */}\n        <>\n          {pushingView != null && (\n            <div className=\"pushing-view\">{pushingView}</div>\n          )}\n        </>\n      </SlideTransition>\n    </div>\n  );\n}\n\nexport default Stack;\n"],"mappings":"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"}
+{"version":3,"file":"Stack.js","names":["React","useState","useEffect","useMemo","useCallback","usePrevious","SlideTransition","jsx","_jsx","Fragment","_Fragment","jsxs","_jsxs","Stack","_ref","children","dataTestId","childrenArray","Children","toArray","prevChildrenArray","mainView","setMainView","length","pushingView","setPushingView","poppingView","setPoppingView","initAnimation","undefined","topChild","pushComplete","popComplete","className","direction","in","onEntered"],"sources":["../../src/navigation/Stack.tsx"],"sourcesContent":["import React, { useState, useEffect, useMemo, useCallback } from 'react';\nimport { usePrevious } from '@deephaven/react-hooks';\nimport './Stack.scss';\nimport { SlideTransition } from '../transitions';\n\nexport type StackProps = {\n  children: React.ReactNode | React.ReactNode[];\n  'data-testid'?: string;\n};\n\n/**\n * Pass a full navigation stack of children, and then automatically does a sliding animation when the stack changes.\n * Adding items to the stack will do a \"push\" animation, and removing items from the stack will do a \"pop\" animation.\n */\nexport function Stack({\n  children,\n  'data-testid': dataTestId,\n}: StackProps): JSX.Element {\n  const childrenArray = useMemo(\n    () => React.Children.toArray(children),\n    [children]\n  );\n  const prevChildrenArray = usePrevious(childrenArray);\n  const [mainView, setMainView] = useState<React.ReactNode>(\n    childrenArray[childrenArray.length - 1]\n  );\n\n  const [pushingView, setPushingView] = useState<React.ReactNode>(null);\n  const [poppingView, setPoppingView] = useState<React.ReactNode>(null);\n\n  /**\n   * To do the animation effect, we just need to set the proper pushing/popping views when the stack changes.\n   * `mainView` - The main view of the stack, stationary, filling the container.\n   * `pushingView` - A view that's currently being pushed. Slides from off screen right to overtop of `mainView`.\n   * `poppingView` - A view that's currently being popped. Slides from overtop of `mainView` to right off screen.\n   *\n   * When the `pushingView` or `poppingView` is set, that will kick off their animation.\n   * Completion of the animation is handled in `pushComplete` or `popComplete`, and then the stack is in an idle state again.\n   */\n  useEffect(\n    function initAnimation() {\n      if (\n        prevChildrenArray === undefined ||\n        childrenArray === prevChildrenArray\n      ) {\n        return;\n      }\n      const topChild = childrenArray[childrenArray.length - 1];\n      if (\n        childrenArray.length === prevChildrenArray.length ||\n        prevChildrenArray.length === 0 ||\n        pushingView !== null ||\n        poppingView !== null\n      ) {\n        // 1) Stack is the same size, we've just mounted, or we're already in an animation - just update the view\n        if (pushingView !== null && topChild !== pushingView) {\n          // Stack was updated mid animation\n          setPushingView(topChild);\n        } else if (topChild !== poppingView && topChild !== mainView) {\n          // Replace the current view\n          setMainView(topChild);\n        }\n      } else if (childrenArray.length > prevChildrenArray.length) {\n        // 2) Stack has grown - start the push animation\n        setPushingView(topChild);\n      } else if (childrenArray.length < prevChildrenArray.length) {\n        // 3) Stack has shrunk - start the pop animation\n        setMainView(topChild);\n        setPoppingView(prevChildrenArray[prevChildrenArray.length - 1]);\n      }\n    },\n    [childrenArray, prevChildrenArray, pushingView, poppingView, mainView]\n  );\n\n  const pushComplete = useCallback(() => {\n    setMainView(pushingView);\n    setPushingView(null);\n  }, [pushingView]);\n\n  const popComplete = useCallback(() => {\n    setPoppingView(null);\n  }, []);\n\n  return (\n    <div className=\"navigation-stack\">\n      <div className=\"main-view\" data-testid={dataTestId}>\n        {mainView}\n      </div>\n\n      <SlideTransition\n        direction=\"right\"\n        in={poppingView != null}\n        onEntered={popComplete}\n      >\n        {/* Without the fragment, the transition doesn't work. Without the conditional render, the stack is blank */}\n        {/* eslint-disable-next-line react/jsx-no-useless-fragment */}\n        <>\n          {poppingView != null && (\n            <div className=\"popping-view\">{poppingView}</div>\n          )}\n        </>\n      </SlideTransition>\n      <SlideTransition in={pushingView != null} onEntered={pushComplete}>\n        {/* eslint-disable-next-line react/jsx-no-useless-fragment */}\n        <>\n          {pushingView != null && (\n            <div className=\"pushing-view\">{pushingView}</div>\n          )}\n        </>\n      </SlideTransition>\n    </div>\n  );\n}\n\nexport default Stack;\n"],"mappings":"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","ignoreList":[]}

package/dist/navigation/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["default","Menu","MenuItem","NavTabList","DashboardList","Page","Stack"],"sources":["../../src/navigation/index.ts"],"sourcesContent":["export { default as Menu } from './Menu';\nexport type { MenuProps } from './Menu';\nexport { default as MenuItem } from './MenuItem';\nexport type { SwitchMenuItemDef, MenuItemDef, MenuItemProps } from './MenuItem';\nexport { default as NavTabList } from './NavTabList';\nexport type { NavTabItem } from './NavTabList';\nexport { default as DashboardList } from './DashboardList';\nexport { default as Page } from './Page';\nexport type { PageProps } from './Page';\nexport { default as Stack } from './Stack';\n"],"mappings":"SAASA,OAAO,IAAIC,IAAI;AAAA,SAEfD,OAAO,IAAIE,QAAQ;AAAA,SAEnBF,OAAO,IAAIG,UAAU;AAAA,SAErBH,OAAO,IAAII,aAAa;AAAA,SACxBJ,OAAO,IAAIK,IAAI;AAAA,SAEfL,OAAO,IAAIM,KAAK"}
+{"version":3,"file":"index.js","names":["default","Menu","MenuItem","NavTabList","DashboardList","Page","Stack"],"sources":["../../src/navigation/index.ts"],"sourcesContent":["export { default as Menu } from './Menu';\nexport type { MenuProps } from './Menu';\nexport { default as MenuItem } from './MenuItem';\nexport type { SwitchMenuItemDef, MenuItemDef, MenuItemProps } from './MenuItem';\nexport { default as NavTabList } from './NavTabList';\nexport type { NavTabItem } from './NavTabList';\nexport { default as DashboardList } from './DashboardList';\nexport { default as Page } from './Page';\nexport type { PageProps } from './Page';\nexport { default as Stack } from './Stack';\n"],"mappings":"SAASA,OAAO,IAAIC,IAAI;AAAA,SAEfD,OAAO,IAAIE,QAAQ;AAAA,SAEnBF,OAAO,IAAIG,UAAU;AAAA,SAErBH,OAAO,IAAII,aAAa;AAAA,SACxBJ,OAAO,IAAIK,IAAI;AAAA,SAEfL,OAAO,IAAIM,KAAK","ignoreList":[]}

package/dist/popper/Popper.d.ts

@@ -16,9 +16,9 @@
  */
 import React, { Component } from 'react';
 import PopperJs, { type PopperOptions, type ReferenceObject } from 'popper.js';
-import PropTypes from 'prop-types';
 import './Popper.scss';
 interface PopperProps {
+    children: React.ReactNode;
     options: PopperOptions;
     className: string;
     timeout: number;
@@ -35,19 +35,6 @@ interface PopperState {
     popper: PopperJs | null;
 }
 declare class Popper extends Component<PopperProps, PopperState> {
-    static propTypes: {
-        children: PropTypes.Validator<NonNullable<PropTypes.ReactNodeLike>>;
-        options: PropTypes.Requireable<PropTypes.InferProps<{}>>;
-        className: PropTypes.Requireable<string>;
-        timeout: PropTypes.Requireable<number>;
-        onEntered: PropTypes.Requireable<(...args: any[]) => any>;
-        onExited: PropTypes.Requireable<(...args: any[]) => any>;
-        isShown: PropTypes.Requireable<boolean>;
-        closeOnBlur: PropTypes.Requireable<boolean>;
-        interactive: PropTypes.Requireable<boolean>;
-        referenceObject: PropTypes.Requireable<PropTypes.InferProps<{}>>;
-        'data-testid': PropTypes.Requireable<string>;
-    };
     static defaultProps: {
         options: {};
         className: string;
@@ -65,6 +52,7 @@ declare class Popper extends Component<PopperProps, PopperState> {
     componentWillUnmount(): void;
     element: HTMLDivElement;
     container: React.RefObject<HTMLDivElement>;
+    nodeRef: React.RefObject<HTMLDivElement>;
     rAF: number;
     /** Goes through an element and it's parents until the first visible element is found */
     getVisibleElement(element: HTMLElement | null): HTMLElement | null;