@deephaven/iris-grid 0.46.1-beta.0 → 0.46.1-beta.4

package/dist/sidebar/aggregations/AggregationEdit.js

@@ -11,6 +11,8 @@ import { dhSortAlphaDown, dhSortAlphaUp } from '@deephaven/icons';
 import { TableUtils } from '@deephaven/jsapi-utils';
 import { filterValidColumns } from "./AggregationUtils.js";
 import "./AggregationEdit.css";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
 var SortType;
 (function (SortType) {
   SortType[SortType["NONE"] = 0] = "NONE";
@@ -92,64 +94,72 @@ function AggregationEdit(_ref) {
   }, [aggregation, invert, onChange, selected]);
   var checked = selected.length === 0 ? invert : null;
   var isModified = selected.length !== 0 || !invert || sort !== SortType.NONE;
-  return /*#__PURE__*/React.createElement("div", {
+  return /*#__PURE__*/_jsxs("div", {
     role: "menu",
-    className: "aggregation-edit"
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "top-menu"
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "form-inline"
-  }, /*#__PURE__*/React.createElement(Checkbox, {
-    checked: checked,
-    onChange: toggleAll
-  }, "Toggle All"), /*#__PURE__*/React.createElement("div", {
-    className: "spacer"
-  }), /*#__PURE__*/React.createElement(CSSTransition, {
-    in: isModified,
-    timeout: ThemeExport.transitionSlowMs,
-    classNames: "fade",
-    mountOnEnter: true,
-    unmountOnExit: true
-  }, /*#__PURE__*/React.createElement(Button, {
-    kind: "ghost",
-    className: "btn-reset",
-    onClick: handleReset
-  }, "Reset")), /*#__PURE__*/React.createElement(Button, {
-    kind: "ghost",
-    className: classNames({
-      active: sort === SortType.ASCENDING
-    }),
-    icon: dhSortAlphaDown,
-    tooltip: "Sort ascending",
-    onClick: () => setSort(SortType.ASCENDING)
-  }), /*#__PURE__*/React.createElement(Button, {
-    kind: "ghost",
-    className: classNames({
-      active: sort === SortType.DESCENDING
-    }),
-    icon: dhSortAlphaUp,
-    tooltip: "Sort descending",
-    onClick: () => setSort(SortType.DESCENDING)
-  }))), /*#__PURE__*/React.createElement("div", {
-    className: "aggregation-edit-item-list"
-  }, /*#__PURE__*/React.createElement(ItemList, {
-    itemCount: validColumns.length,
-    items: items,
-    offset: top,
-    renderItem: _ref2 => {
-      var {
-        item
-      } = _ref2;
-      return /*#__PURE__*/React.createElement(Checkbox, {
-        checked: isSelected(item.value)
-      }, item.displayValue);
-    },
-    onSelect: handleSelect,
-    onViewportChange: handleViewportChange,
-    rowHeight: DEFAULT_ROW_HEIGHT,
-    focusSelector: "input",
-    ref: list
-  })));
+    className: "aggregation-edit",
+    children: [/*#__PURE__*/_jsx("div", {
+      className: "top-menu",
+      children: /*#__PURE__*/_jsxs("div", {
+        className: "form-inline",
+        children: [/*#__PURE__*/_jsx(Checkbox, {
+          checked: checked,
+          onChange: toggleAll,
+          children: "Toggle All"
+        }), /*#__PURE__*/_jsx("div", {
+          className: "spacer"
+        }), /*#__PURE__*/_jsx(CSSTransition, {
+          in: isModified,
+          timeout: ThemeExport.transitionSlowMs,
+          classNames: "fade",
+          mountOnEnter: true,
+          unmountOnExit: true,
+          children: /*#__PURE__*/_jsx(Button, {
+            kind: "ghost",
+            className: "btn-reset",
+            onClick: handleReset,
+            children: "Reset"
+          })
+        }), /*#__PURE__*/_jsx(Button, {
+          kind: "ghost",
+          className: classNames({
+            active: sort === SortType.ASCENDING
+          }),
+          icon: dhSortAlphaDown,
+          tooltip: "Sort ascending",
+          onClick: () => setSort(SortType.ASCENDING)
+        }), /*#__PURE__*/_jsx(Button, {
+          kind: "ghost",
+          className: classNames({
+            active: sort === SortType.DESCENDING
+          }),
+          icon: dhSortAlphaUp,
+          tooltip: "Sort descending",
+          onClick: () => setSort(SortType.DESCENDING)
+        })]
+      })
+    }), /*#__PURE__*/_jsx("div", {
+      className: "aggregation-edit-item-list",
+      children: /*#__PURE__*/_jsx(ItemList, {
+        itemCount: validColumns.length,
+        items: items,
+        offset: top,
+        renderItem: _ref2 => {
+          var {
+            item
+          } = _ref2;
+          return /*#__PURE__*/_jsx(Checkbox, {
+            checked: isSelected(item.value),
+            children: item.displayValue
+          });
+        },
+        onSelect: handleSelect,
+        onViewportChange: handleViewportChange,
+        rowHeight: DEFAULT_ROW_HEIGHT,
+        focusSelector: "input",
+        ref: list
+      })
+    })]
+  });
 }
 export default AggregationEdit;
 //# sourceMappingURL=AggregationEdit.js.map

package/dist/sidebar/aggregations/AggregationEdit.js.map

@@ -1 +1 @@
-{"version":3,"file":"AggregationEdit.js","names":["React","useCallback","useMemo","useRef","useState","classNames","CSSTransition","Button","Checkbox","ItemList","ThemeExport","dhSortAlphaDown","dhSortAlphaUp","TableUtils","filterValidColumns","SortType","DEFAULT_ROW_HEIGHT","AggregationEdit","aggregation","columns","onChange","top","setTop","bottom","setBottom","sort","setSort","NONE","invert","selected","list","isSelected","name","includes","validColumns","filteredColumns","operation","sortColumns","ASCENDING","items","slice","map","c","value","displayValue","handleSelect","itemIndex","selectedIndex","indexOf","newSelected","newInvert","splice","push","length","handleReset","handleViewportChange","newTop","newBottom","toggleAll","checked","isModified","transitionSlowMs","active","DESCENDING","item"],"sources":["../../../src/sidebar/aggregations/AggregationEdit.tsx"],"sourcesContent":["import React, { useCallback, useMemo, useRef, useState } from 'react';\nimport classNames from 'classnames';\nimport { CSSTransition } from 'react-transition-group';\nimport { Button, Checkbox, ItemList, ThemeExport } from '@deephaven/components';\nimport { dhSortAlphaDown, dhSortAlphaUp } from '@deephaven/icons';\nimport type { Column } from '@deephaven/jsapi-types';\nimport { TableUtils } from '@deephaven/jsapi-utils';\nimport { Aggregation } from './Aggregations';\nimport { filterValidColumns } from './AggregationUtils';\nimport './AggregationEdit.scss';\n\ninterface AggregationEditItem {\n  value: string;\n  displayValue: string;\n}\n\nexport type AggregationEditProps = {\n  aggregation: Aggregation;\n  columns: readonly Column[];\n  onChange: (aggregation: Aggregation) => void;\n};\n\nenum SortType {\n  NONE,\n  ASCENDING,\n  DESCENDING,\n}\n\nconst DEFAULT_ROW_HEIGHT = 30;\n\nfunction AggregationEdit({\n  aggregation,\n  columns,\n  onChange,\n}: AggregationEditProps): JSX.Element {\n  const [top, setTop] = useState(-1);\n  const [bottom, setBottom] = useState(-1);\n  const [sort, setSort] = useState(SortType.NONE);\n  const { invert, selected } = aggregation;\n  const list = useRef<ItemList<AggregationEditItem>>(null);\n\n  const isSelected = useCallback(\n    name => (selected.includes(name) ? !invert : invert),\n    [invert, selected]\n  );\n\n  const validColumns = useMemo(() => {\n    let filteredColumns = filterValidColumns(columns, aggregation.operation);\n    if (sort !== SortType.NONE) {\n      filteredColumns = TableUtils.sortColumns(\n        filteredColumns,\n        sort === SortType.ASCENDING\n      );\n    }\n    return filteredColumns;\n  }, [columns, aggregation.operation, sort]);\n\n  const items = useMemo(\n    () =>\n      top >= 0\n        ? validColumns.slice(top, bottom + 1).map(c => ({\n            value: c.name,\n            displayValue: c.name,\n            isSelected: isSelected(c.name),\n          }))\n        : [],\n    [validColumns, isSelected, bottom, top]\n  );\n\n  const handleSelect = useCallback(\n    itemIndex => {\n      const { name } = validColumns[itemIndex];\n      const selectedIndex = selected.indexOf(name);\n      let newSelected = [...selected];\n      let newInvert = invert;\n      if (selectedIndex >= 0) {\n        newSelected.splice(selectedIndex, 1);\n      } else {\n        newSelected.push(name);\n        if (newSelected.length === validColumns.length) {\n          // Every item is either selected or deselected, flip the inversion bit\n          newSelected = [];\n          newInvert = !invert;\n        }\n      }\n\n      onChange({ ...aggregation, selected: newSelected, invert: newInvert });\n    },\n    [aggregation, invert, validColumns, selected, onChange]\n  );\n\n  const handleReset = useCallback(() => {\n    setSort(SortType.NONE);\n    onChange({ ...aggregation, selected: [], invert: true });\n  }, [aggregation, onChange]);\n\n  const handleViewportChange = useCallback(\n    (newTop, newBottom) => {\n      setTop(newTop);\n      setBottom(newBottom);\n    },\n    [setTop, setBottom]\n  );\n\n  const toggleAll = useCallback(() => {\n    if (selected.length === 0) {\n      onChange({ ...aggregation, invert: !invert });\n    } else {\n      onChange({ ...aggregation, selected: [], invert: true });\n    }\n  }, [aggregation, invert, onChange, selected]);\n\n  const checked = selected.length === 0 ? invert : null;\n  const isModified = selected.length !== 0 || !invert || sort !== SortType.NONE;\n\n  return (\n    <div role=\"menu\" className=\"aggregation-edit\">\n      <div className=\"top-menu\">\n        <div className=\"form-inline\">\n          <Checkbox checked={checked} onChange={toggleAll}>\n            Toggle All\n          </Checkbox>\n          <div className=\"spacer\" />\n          <CSSTransition\n            in={isModified}\n            timeout={ThemeExport.transitionSlowMs}\n            classNames=\"fade\"\n            mountOnEnter\n            unmountOnExit\n          >\n            <Button kind=\"ghost\" className=\"btn-reset\" onClick={handleReset}>\n              Reset\n            </Button>\n          </CSSTransition>\n          <Button\n            kind=\"ghost\"\n            className={classNames({\n              active: sort === SortType.ASCENDING,\n            })}\n            icon={dhSortAlphaDown}\n            tooltip=\"Sort ascending\"\n            onClick={() => setSort(SortType.ASCENDING)}\n          />\n          <Button\n            kind=\"ghost\"\n            className={classNames({\n              active: sort === SortType.DESCENDING,\n            })}\n            icon={dhSortAlphaUp}\n            tooltip=\"Sort descending\"\n            onClick={() => setSort(SortType.DESCENDING)}\n          />\n        </div>\n      </div>\n      <div className=\"aggregation-edit-item-list\">\n        <ItemList\n          itemCount={validColumns.length}\n          items={items}\n          offset={top}\n          renderItem={({ item }) => (\n            <Checkbox checked={isSelected(item.value)}>\n              {item.displayValue}\n            </Checkbox>\n          )}\n          onSelect={handleSelect}\n          onViewportChange={handleViewportChange}\n          rowHeight={DEFAULT_ROW_HEIGHT}\n          focusSelector=\"input\"\n          ref={list}\n        />\n      </div>\n    </div>\n  );\n}\n\nexport default AggregationEdit;\n"],"mappings":"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"}
+{"version":3,"file":"AggregationEdit.js","names":["React","useCallback","useMemo","useRef","useState","classNames","CSSTransition","Button","Checkbox","ItemList","ThemeExport","dhSortAlphaDown","dhSortAlphaUp","TableUtils","filterValidColumns","SortType","DEFAULT_ROW_HEIGHT","AggregationEdit","aggregation","columns","onChange","top","setTop","bottom","setBottom","sort","setSort","NONE","invert","selected","list","isSelected","name","includes","validColumns","filteredColumns","operation","sortColumns","ASCENDING","items","slice","map","c","value","displayValue","handleSelect","itemIndex","selectedIndex","indexOf","newSelected","newInvert","splice","push","length","handleReset","handleViewportChange","newTop","newBottom","toggleAll","checked","isModified","transitionSlowMs","active","DESCENDING","item"],"sources":["../../../src/sidebar/aggregations/AggregationEdit.tsx"],"sourcesContent":["import React, { useCallback, useMemo, useRef, useState } from 'react';\nimport classNames from 'classnames';\nimport { CSSTransition } from 'react-transition-group';\nimport { Button, Checkbox, ItemList, ThemeExport } from '@deephaven/components';\nimport { dhSortAlphaDown, dhSortAlphaUp } from '@deephaven/icons';\nimport type { Column } from '@deephaven/jsapi-types';\nimport { TableUtils } from '@deephaven/jsapi-utils';\nimport { Aggregation } from './Aggregations';\nimport { filterValidColumns } from './AggregationUtils';\nimport './AggregationEdit.scss';\n\ninterface AggregationEditItem {\n  value: string;\n  displayValue: string;\n}\n\nexport type AggregationEditProps = {\n  aggregation: Aggregation;\n  columns: readonly Column[];\n  onChange: (aggregation: Aggregation) => void;\n};\n\nenum SortType {\n  NONE,\n  ASCENDING,\n  DESCENDING,\n}\n\nconst DEFAULT_ROW_HEIGHT = 30;\n\nfunction AggregationEdit({\n  aggregation,\n  columns,\n  onChange,\n}: AggregationEditProps): JSX.Element {\n  const [top, setTop] = useState(-1);\n  const [bottom, setBottom] = useState(-1);\n  const [sort, setSort] = useState(SortType.NONE);\n  const { invert, selected } = aggregation;\n  const list = useRef<ItemList<AggregationEditItem>>(null);\n\n  const isSelected = useCallback(\n    name => (selected.includes(name) ? !invert : invert),\n    [invert, selected]\n  );\n\n  const validColumns = useMemo(() => {\n    let filteredColumns = filterValidColumns(columns, aggregation.operation);\n    if (sort !== SortType.NONE) {\n      filteredColumns = TableUtils.sortColumns(\n        filteredColumns,\n        sort === SortType.ASCENDING\n      );\n    }\n    return filteredColumns;\n  }, [columns, aggregation.operation, sort]);\n\n  const items = useMemo(\n    () =>\n      top >= 0\n        ? validColumns.slice(top, bottom + 1).map(c => ({\n            value: c.name,\n            displayValue: c.name,\n            isSelected: isSelected(c.name),\n          }))\n        : [],\n    [validColumns, isSelected, bottom, top]\n  );\n\n  const handleSelect = useCallback(\n    itemIndex => {\n      const { name } = validColumns[itemIndex];\n      const selectedIndex = selected.indexOf(name);\n      let newSelected = [...selected];\n      let newInvert = invert;\n      if (selectedIndex >= 0) {\n        newSelected.splice(selectedIndex, 1);\n      } else {\n        newSelected.push(name);\n        if (newSelected.length === validColumns.length) {\n          // Every item is either selected or deselected, flip the inversion bit\n          newSelected = [];\n          newInvert = !invert;\n        }\n      }\n\n      onChange({ ...aggregation, selected: newSelected, invert: newInvert });\n    },\n    [aggregation, invert, validColumns, selected, onChange]\n  );\n\n  const handleReset = useCallback(() => {\n    setSort(SortType.NONE);\n    onChange({ ...aggregation, selected: [], invert: true });\n  }, [aggregation, onChange]);\n\n  const handleViewportChange = useCallback(\n    (newTop, newBottom) => {\n      setTop(newTop);\n      setBottom(newBottom);\n    },\n    [setTop, setBottom]\n  );\n\n  const toggleAll = useCallback(() => {\n    if (selected.length === 0) {\n      onChange({ ...aggregation, invert: !invert });\n    } else {\n      onChange({ ...aggregation, selected: [], invert: true });\n    }\n  }, [aggregation, invert, onChange, selected]);\n\n  const checked = selected.length === 0 ? invert : null;\n  const isModified = selected.length !== 0 || !invert || sort !== SortType.NONE;\n\n  return (\n    <div role=\"menu\" className=\"aggregation-edit\">\n      <div className=\"top-menu\">\n        <div className=\"form-inline\">\n          <Checkbox checked={checked} onChange={toggleAll}>\n            Toggle All\n          </Checkbox>\n          <div className=\"spacer\" />\n          <CSSTransition\n            in={isModified}\n            timeout={ThemeExport.transitionSlowMs}\n            classNames=\"fade\"\n            mountOnEnter\n            unmountOnExit\n          >\n            <Button kind=\"ghost\" className=\"btn-reset\" onClick={handleReset}>\n              Reset\n            </Button>\n          </CSSTransition>\n          <Button\n            kind=\"ghost\"\n            className={classNames({\n              active: sort === SortType.ASCENDING,\n            })}\n            icon={dhSortAlphaDown}\n            tooltip=\"Sort ascending\"\n            onClick={() => setSort(SortType.ASCENDING)}\n          />\n          <Button\n            kind=\"ghost\"\n            className={classNames({\n              active: sort === SortType.DESCENDING,\n            })}\n            icon={dhSortAlphaUp}\n            tooltip=\"Sort descending\"\n            onClick={() => setSort(SortType.DESCENDING)}\n          />\n        </div>\n      </div>\n      <div className=\"aggregation-edit-item-list\">\n        <ItemList\n          itemCount={validColumns.length}\n          items={items}\n          offset={top}\n          renderItem={({ item }) => (\n            <Checkbox checked={isSelected(item.value)}>\n              {item.displayValue}\n            </Checkbox>\n          )}\n          onSelect={handleSelect}\n          onViewportChange={handleViewportChange}\n          rowHeight={DEFAULT_ROW_HEIGHT}\n          focusSelector=\"input\"\n          ref={list}\n        />\n      </div>\n    </div>\n  );\n}\n\nexport default AggregationEdit;\n"],"mappings":";;;;;AAAA,OAAOA,KAAK,IAAIC,WAAW,EAAEC,OAAO,EAAEC,MAAM,EAAEC,QAAQ,QAAQ,OAAO;AACrE,OAAOC,UAAU,MAAM,YAAY;AACnC,SAASC,aAAa,QAAQ,wBAAwB;AACtD,SAASC,MAAM,EAAEC,QAAQ,EAAEC,QAAQ,EAAEC,WAAW,QAAQ,uBAAuB;AAC/E,SAASC,eAAe,EAAEC,aAAa,QAAQ,kBAAkB;AAEjE,SAASC,UAAU,QAAQ,wBAAwB;AAAC,SAE3CC,kBAAkB;AAAA;AAAA;AAAA;AAAA,IActBC,QAAQ;AAAA,WAARA,QAAQ;EAARA,QAAQ,CAARA,QAAQ;EAARA,QAAQ,CAARA,QAAQ;EAARA,QAAQ,CAARA,QAAQ;AAAA,GAARA,QAAQ,KAARA,QAAQ;AAMb,IAAMC,kBAAkB,GAAG,EAAE;AAE7B,SAASC,eAAe,OAIc;EAAA,IAJb;IACvBC,WAAW;IACXC,OAAO;IACPC;EACoB,CAAC;EACrB,IAAM,CAACC,GAAG,EAAEC,MAAM,CAAC,GAAGlB,QAAQ,CAAC,CAAC,CAAC,CAAC;EAClC,IAAM,CAACmB,MAAM,EAAEC,SAAS,CAAC,GAAGpB,QAAQ,CAAC,CAAC,CAAC,CAAC;EACxC,IAAM,CAACqB,IAAI,EAAEC,OAAO,CAAC,GAAGtB,QAAQ,CAACW,QAAQ,CAACY,IAAI,CAAC;EAC/C,IAAM;IAAEC,MAAM;IAAEC;EAAS,CAAC,GAAGX,WAAW;EACxC,IAAMY,IAAI,GAAG3B,MAAM,CAAgC,IAAI,CAAC;EAExD,IAAM4B,UAAU,GAAG9B,WAAW,CAC5B+B,IAAI,IAAKH,QAAQ,CAACI,QAAQ,CAACD,IAAI,CAAC,GAAG,CAACJ,MAAM,GAAGA,MAAO,EACpD,CAACA,MAAM,EAAEC,QAAQ,CAAC,CACnB;EAED,IAAMK,YAAY,GAAGhC,OAAO,CAAC,MAAM;IACjC,IAAIiC,eAAe,GAAGrB,kBAAkB,CAACK,OAAO,EAAED,WAAW,CAACkB,SAAS,CAAC;IACxE,IAAIX,IAAI,KAAKV,QAAQ,CAACY,IAAI,EAAE;MAC1BQ,eAAe,GAAGtB,UAAU,CAACwB,WAAW,CACtCF,eAAe,EACfV,IAAI,KAAKV,QAAQ,CAACuB,SAAS,CAC5B;IACH;IACA,OAAOH,eAAe;EACxB,CAAC,EAAE,CAAChB,OAAO,EAAED,WAAW,CAACkB,SAAS,EAAEX,IAAI,CAAC,CAAC;EAE1C,IAAMc,KAAK,GAAGrC,OAAO,CACnB,MACEmB,GAAG,IAAI,CAAC,GACJa,YAAY,CAACM,KAAK,CAACnB,GAAG,EAAEE,MAAM,GAAG,CAAC,CAAC,CAACkB,GAAG,CAACC,CAAC,KAAK;IAC5CC,KAAK,EAAED,CAAC,CAACV,IAAI;IACbY,YAAY,EAAEF,CAAC,CAACV,IAAI;IACpBD,UAAU,EAAEA,UAAU,CAACW,CAAC,CAACV,IAAI;EAC/B,CAAC,CAAC,CAAC,GACH,EAAE,EACR,CAACE,YAAY,EAAEH,UAAU,EAAER,MAAM,EAAEF,GAAG,CAAC,CACxC;EAED,IAAMwB,YAAY,GAAG5C,WAAW,CAC9B6C,SAAS,IAAI;IACX,IAAM;MAAEd;IAAK,CAAC,GAAGE,YAAY,CAACY,SAAS,CAAC;IACxC,IAAMC,aAAa,GAAGlB,QAAQ,CAACmB,OAAO,CAAChB,IAAI,CAAC;IAC5C,IAAIiB,WAAW,GAAG,CAAC,GAAGpB,QAAQ,CAAC;IAC/B,IAAIqB,SAAS,GAAGtB,MAAM;IACtB,IAAImB,aAAa,IAAI,CAAC,EAAE;MACtBE,WAAW,CAACE,MAAM,CAACJ,aAAa,EAAE,CAAC,CAAC;IACtC,CAAC,MAAM;MACLE,WAAW,CAACG,IAAI,CAACpB,IAAI,CAAC;MACtB,IAAIiB,WAAW,CAACI,MAAM,KAAKnB,YAAY,CAACmB,MAAM,EAAE;QAC9C;QACAJ,WAAW,GAAG,EAAE;QAChBC,SAAS,GAAG,CAACtB,MAAM;MACrB;IACF;IAEAR,QAAQ,iCAAMF,WAAW;MAAEW,QAAQ,EAAEoB,WAAW;MAAErB,MAAM,EAAEsB;IAAS,GAAG;EACxE,CAAC,EACD,CAAChC,WAAW,EAAEU,MAAM,EAAEM,YAAY,EAAEL,QAAQ,EAAET,QAAQ,CAAC,CACxD;EAED,IAAMkC,WAAW,GAAGrD,WAAW,CAAC,MAAM;IACpCyB,OAAO,CAACX,QAAQ,CAACY,IAAI,CAAC;IACtBP,QAAQ,iCAAMF,WAAW;MAAEW,QAAQ,EAAE,EAAE;MAAED,MAAM,EAAE;IAAI,GAAG;EAC1D,CAAC,EAAE,CAACV,WAAW,EAAEE,QAAQ,CAAC,CAAC;EAE3B,IAAMmC,oBAAoB,GAAGtD,WAAW,CACtC,CAACuD,MAAM,EAAEC,SAAS,KAAK;IACrBnC,MAAM,CAACkC,MAAM,CAAC;IACdhC,SAAS,CAACiC,SAAS,CAAC;EACtB,CAAC,EACD,CAACnC,MAAM,EAAEE,SAAS,CAAC,CACpB;EAED,IAAMkC,SAAS,GAAGzD,WAAW,CAAC,MAAM;IAClC,IAAI4B,QAAQ,CAACwB,MAAM,KAAK,CAAC,EAAE;MACzBjC,QAAQ,iCAAMF,WAAW;QAAEU,MAAM,EAAE,CAACA;MAAM,GAAG;IAC/C,CAAC,MAAM;MACLR,QAAQ,iCAAMF,WAAW;QAAEW,QAAQ,EAAE,EAAE;QAAED,MAAM,EAAE;MAAI,GAAG;IAC1D;EACF,CAAC,EAAE,CAACV,WAAW,EAAEU,MAAM,EAAER,QAAQ,EAAES,QAAQ,CAAC,CAAC;EAE7C,IAAM8B,OAAO,GAAG9B,QAAQ,CAACwB,MAAM,KAAK,CAAC,GAAGzB,MAAM,GAAG,IAAI;EACrD,IAAMgC,UAAU,GAAG/B,QAAQ,CAACwB,MAAM,KAAK,CAAC,IAAI,CAACzB,MAAM,IAAIH,IAAI,KAAKV,QAAQ,CAACY,IAAI;EAE7E,oBACE;IAAK,IAAI,EAAC,MAAM;IAAC,SAAS,EAAC,kBAAkB;IAAA,wBAC3C;MAAK,SAAS,EAAC,UAAU;MAAA,uBACvB;QAAK,SAAS,EAAC,aAAa;QAAA,wBAC1B,KAAC,QAAQ;UAAC,OAAO,EAAEgC,OAAQ;UAAC,QAAQ,EAAED,SAAU;UAAA,UAAC;QAEjD,EAAW,eACX;UAAK,SAAS,EAAC;QAAQ,EAAG,eAC1B,KAAC,aAAa;UACZ,EAAE,EAAEE,UAAW;UACf,OAAO,EAAElD,WAAW,CAACmD,gBAAiB;UACtC,UAAU,EAAC,MAAM;UACjB,YAAY;UACZ,aAAa;UAAA,uBAEb,KAAC,MAAM;YAAC,IAAI,EAAC,OAAO;YAAC,SAAS,EAAC,WAAW;YAAC,OAAO,EAAEP,WAAY;YAAA,UAAC;UAEjE;QAAS,EACK,eAChB,KAAC,MAAM;UACL,IAAI,EAAC,OAAO;UACZ,SAAS,EAAEjD,UAAU,CAAC;YACpByD,MAAM,EAAErC,IAAI,KAAKV,QAAQ,CAACuB;UAC5B,CAAC,CAAE;UACH,IAAI,EAAE3B,eAAgB;UACtB,OAAO,EAAC,gBAAgB;UACxB,OAAO,EAAE,MAAMe,OAAO,CAACX,QAAQ,CAACuB,SAAS;QAAE,EAC3C,eACF,KAAC,MAAM;UACL,IAAI,EAAC,OAAO;UACZ,SAAS,EAAEjC,UAAU,CAAC;YACpByD,MAAM,EAAErC,IAAI,KAAKV,QAAQ,CAACgD;UAC5B,CAAC,CAAE;UACH,IAAI,EAAEnD,aAAc;UACpB,OAAO,EAAC,iBAAiB;UACzB,OAAO,EAAE,MAAMc,OAAO,CAACX,QAAQ,CAACgD,UAAU;QAAE,EAC5C;MAAA;IACE,EACF,eACN;MAAK,SAAS,EAAC,4BAA4B;MAAA,uBACzC,KAAC,QAAQ;QACP,SAAS,EAAE7B,YAAY,CAACmB,MAAO;QAC/B,KAAK,EAAEd,KAAM;QACb,MAAM,EAAElB,GAAI;QACZ,UAAU,EAAE;UAAA,IAAC;YAAE2C;UAAK,CAAC;UAAA,oBACnB,KAAC,QAAQ;YAAC,OAAO,EAAEjC,UAAU,CAACiC,IAAI,CAACrB,KAAK,CAAE;YAAA,UACvCqB,IAAI,CAACpB;UAAY,EACT;QAAA,CACX;QACF,QAAQ,EAAEC,YAAa;QACvB,gBAAgB,EAAEU,oBAAqB;QACvC,SAAS,EAAEvC,kBAAmB;QAC9B,aAAa,EAAC,OAAO;QACrB,GAAG,EAAEc;MAAK;IACV,EACE;EAAA,EACF;AAEV;AAEA,eAAeb,eAAe"}

package/dist/sidebar/aggregations/Aggregations.js

@@ -12,6 +12,9 @@ import Log from '@deephaven/log';
 import { DraggableItemList, DragUtils, Option, Select, RadioItem, RadioGroup, Button } from '@deephaven/components';
 import AggregationUtils, { SELECTABLE_OPTIONS } from "./AggregationUtils.js";
 import "./Aggregations.css";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+import { Fragment as _Fragment } from "react/jsx-runtime";
 var log = Log.module('Aggregations');
 function Aggregations(_ref) {
   var {
@@ -107,72 +110,92 @@ function Aggregations(_ref) {
     var className = isClone ? 'item-list-item-clone' : undefined;
     var isRollupOperation = AggregationUtils.isRollupOperation(item.operation);
     var isEditable = !isClone && !isRollupOperation;
-    return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
-      className: classNames('item-list-item-content', 'draggable-item-list-item-content', className)
-    }, /*#__PURE__*/React.createElement("span", {
-      className: "title"
-    }, text, !isRollup && isRollupOperation && /*#__PURE__*/React.createElement("span", {
-      className: "small text-warning"
-    }, /*#__PURE__*/React.createElement(FontAwesomeIcon, {
-      icon: dhWarningFilled
-    }), " Requires rollup")), DraggableItemList.renderBadge({
-      text: badgeText
-    }), DraggableItemList.renderHandle()), !isClone && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Button, {
-      kind: "ghost",
-      className: "btn-edit",
-      icon: vsEdit,
-      tooltip: "Edit Columns",
-      onClick: () => onEdit(item),
-      disabled: !isEditable
-    }), /*#__PURE__*/React.createElement(Button, {
-      kind: "ghost",
-      className: "btn-delete",
-      icon: vsTrash,
-      tooltip: "Delete Aggregation",
-      onClick: () => handleDeleteClicked(itemIndex)
-    })));
+    return /*#__PURE__*/_jsxs(_Fragment, {
+      children: [/*#__PURE__*/_jsxs("div", {
+        className: classNames('item-list-item-content', 'draggable-item-list-item-content', className),
+        children: [/*#__PURE__*/_jsxs("span", {
+          className: "title",
+          children: [text, !isRollup && isRollupOperation && /*#__PURE__*/_jsxs("span", {
+            className: "small text-warning",
+            children: [/*#__PURE__*/_jsx(FontAwesomeIcon, {
+              icon: dhWarningFilled
+            }), " Requires rollup"]
+          })]
+        }), DraggableItemList.renderBadge({
+          text: badgeText
+        }), DraggableItemList.renderHandle()]
+      }), !isClone && /*#__PURE__*/_jsxs(_Fragment, {
+        children: [/*#__PURE__*/_jsx(Button, {
+          kind: "ghost",
+          className: "btn-edit",
+          icon: vsEdit,
+          tooltip: "Edit Columns",
+          onClick: () => onEdit(item),
+          disabled: !isEditable
+        }), /*#__PURE__*/_jsx(Button, {
+          kind: "ghost",
+          className: "btn-delete",
+          icon: vsTrash,
+          tooltip: "Delete Aggregation",
+          onClick: () => handleDeleteClicked(itemIndex)
+        })]
+      })]
+    });
   }, [handleDeleteClicked, onEdit, isRollup]);
   var isOptionsShown = options.length > 0;
   var isAggregationsShown = aggregations.length > 0;
-  return /*#__PURE__*/React.createElement("div", {
-    className: "aggregations"
-  }, isOptionsShown && /*#__PURE__*/React.createElement("div", {
-    className: "form-inline"
-  }, /*#__PURE__*/React.createElement(Select, {
-    onChange: handleOperationChange,
-    value: selectedOperation
-  }, options.map(option => /*#__PURE__*/React.createElement(Option, {
-    value: option,
-    key: option
-  }, option))), /*#__PURE__*/React.createElement("button", {
-    type: "button",
-    className: "btn btn-link btn-add",
-    onClick: handleAdd
-  }, /*#__PURE__*/React.createElement(FontAwesomeIcon, {
-    icon: dhNewCircleLargeFilled
-  }), "Add Aggregation")), isOptionsShown && isAggregationsShown && /*#__PURE__*/React.createElement("hr", null), isAggregationsShown && /*#__PURE__*/React.createElement(React.Fragment, null, !isRollup && /*#__PURE__*/React.createElement("div", {
-    className: "form-inline"
-  }, /*#__PURE__*/React.createElement("label", null, "Placement:\xA0"), /*#__PURE__*/React.createElement(RadioGroup, {
-    onChange: handleShowOnTopChange,
-    value: "".concat(showOnTop)
-  }, /*#__PURE__*/React.createElement(RadioItem, {
-    value: "true"
-  }, "Top"), /*#__PURE__*/React.createElement(RadioItem, {
-    value: "false"
-  }, "Bottom"))), /*#__PURE__*/React.createElement(DragDropContext, {
-    onDragStart: handleDragStart,
-    onDragEnd: handleDragEnd
-  }, /*#__PURE__*/React.createElement(DraggableItemList, {
-    className: "selected-aggregations",
-    itemCount: aggregations.length,
-    items: aggregations,
-    renderItem: renderAggregation,
-    offset: 0,
-    onSelectionChange: handleAggregationSelectionChange,
-    onSelect: handleAggregationSelect,
-    selectedRanges: selectedRanges,
-    isMultiSelect: true
-  }))));
+  return /*#__PURE__*/_jsxs("div", {
+    className: "aggregations",
+    children: [isOptionsShown && /*#__PURE__*/_jsxs("div", {
+      className: "form-inline",
+      children: [/*#__PURE__*/_jsx(Select, {
+        onChange: handleOperationChange,
+        value: selectedOperation,
+        children: options.map(option => /*#__PURE__*/_jsx(Option, {
+          value: option,
+          children: option
+        }, option))
+      }), /*#__PURE__*/_jsxs("button", {
+        type: "button",
+        className: "btn btn-link btn-add",
+        onClick: handleAdd,
+        children: [/*#__PURE__*/_jsx(FontAwesomeIcon, {
+          icon: dhNewCircleLargeFilled
+        }), "Add Aggregation"]
+      })]
+    }), isOptionsShown && isAggregationsShown && /*#__PURE__*/_jsx("hr", {}), isAggregationsShown && /*#__PURE__*/_jsxs(_Fragment, {
+      children: [!isRollup && /*#__PURE__*/_jsxs("div", {
+        className: "form-inline",
+        children: [/*#__PURE__*/_jsx("label", {
+          children: "Placement:\xA0"
+        }), /*#__PURE__*/_jsxs(RadioGroup, {
+          onChange: handleShowOnTopChange,
+          value: "".concat(showOnTop),
+          children: [/*#__PURE__*/_jsx(RadioItem, {
+            value: "true",
+            children: "Top"
+          }), /*#__PURE__*/_jsx(RadioItem, {
+            value: "false",
+            children: "Bottom"
+          })]
+        })]
+      }), /*#__PURE__*/_jsx(DragDropContext, {
+        onDragStart: handleDragStart,
+        onDragEnd: handleDragEnd,
+        children: /*#__PURE__*/_jsx(DraggableItemList, {
+          className: "selected-aggregations",
+          itemCount: aggregations.length,
+          items: aggregations,
+          renderItem: renderAggregation,
+          offset: 0,
+          onSelectionChange: handleAggregationSelectionChange,
+          onSelect: handleAggregationSelect,
+          selectedRanges: selectedRanges,
+          isMultiSelect: true
+        })
+      })]
+    })]
+  });
 }
 export default Aggregations;
 //# sourceMappingURL=Aggregations.js.map

package/dist/sidebar/aggregations/Aggregations.js.map

@@ -1 +1 @@
-{"version":3,"file":"Aggregations.js","names":["React","useCallback","useEffect","useMemo","useState","DragDropContext","classNames","FontAwesomeIcon","dhNewCircleLargeFilled","vsTrash","vsEdit","dhWarningFilled","Log","DraggableItemList","DragUtils","Option","Select","RadioItem","RadioGroup","Button","AggregationUtils","SELECTABLE_OPTIONS","log","module","Aggregations","isRollup","settings","onChange","onEdit","aggregations","showOnTop","options","filter","option","some","aggregation","operation","selectedOperation","setSelectedOperation","selectedRanges","setSelectedRanges","changeSettings","changedSettings","changeAggregations","newAggregations","changeShowOnTop","newShowOnTop","handleDragStart","debug","startDragging","handleDragEnd","destination","source","stopDragging","destinationIndex","index","draggedItems","reorder","insertIndex","adjustDestinationIndex","newSelectedRanges","length","handleOperationChange","handleAdd","selected","invert","handleDeleteClicked","itemIndex","handleAggregationSelectionChange","handleAggregationSelect","isRollupOperation","handleShowOnTopChange","event","target","value","setDefaultOperation","includes","renderAggregation","item","isClone","selectedCount","text","badgeText","undefined","className","isEditable","renderBadge","renderHandle","isOptionsShown","isAggregationsShown","map"],"sources":["../../../src/sidebar/aggregations/Aggregations.tsx"],"sourcesContent":["import React, {\n  ChangeEvent,\n  useCallback,\n  useEffect,\n  useMemo,\n  useState,\n} from 'react';\nimport { DragDropContext } from 'react-beautiful-dnd';\nimport classNames from 'classnames';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport {\n  dhNewCircleLargeFilled,\n  vsTrash,\n  vsEdit,\n  dhWarningFilled,\n} from '@deephaven/icons';\nimport Log from '@deephaven/log';\nimport {\n  DraggableItemList,\n  DragUtils,\n  Option,\n  Select,\n  RadioItem,\n  RadioGroup,\n  Button,\n} from '@deephaven/components';\nimport type { DraggableRenderItemProps, Range } from '@deephaven/components';\nimport { ModelIndex } from '@deephaven/grid';\nimport AggregationOperation from './AggregationOperation';\nimport AggregationUtils, { SELECTABLE_OPTIONS } from './AggregationUtils';\nimport './Aggregations.scss';\n\nconst log = Log.module('Aggregations');\n\nexport type Aggregation = {\n  operation: AggregationOperation;\n  selected: readonly string[];\n  invert: boolean;\n};\n\nexport type AggregationSettings = {\n  aggregations: readonly Aggregation[];\n  showOnTop: boolean;\n};\n\nexport type AggregationsProps = {\n  isRollup: boolean;\n  settings: AggregationSettings;\n  onChange: (settings: AggregationSettings) => void;\n  onEdit: (aggregation: Aggregation) => void;\n};\n\nfunction Aggregations({\n  isRollup,\n  settings,\n  onChange,\n  onEdit,\n}: AggregationsProps): JSX.Element {\n  const { aggregations, showOnTop } = settings;\n  const options = useMemo(\n    () =>\n      SELECTABLE_OPTIONS.filter(\n        option =>\n          !aggregations.some(aggregation => aggregation.operation === option)\n      ),\n    [aggregations]\n  );\n  const [selectedOperation, setSelectedOperation] = useState(options[0]);\n  const [selectedRanges, setSelectedRanges] = useState<Range[]>([]);\n  const changeSettings = useCallback(\n    changedSettings => {\n      onChange({ ...settings, ...changedSettings });\n    },\n    [onChange, settings]\n  );\n  const changeAggregations = useCallback(\n    newAggregations => {\n      changeSettings({ aggregations: newAggregations });\n    },\n    [changeSettings]\n  );\n\n  const changeShowOnTop = useCallback(\n    newShowOnTop => {\n      changeSettings({ showOnTop: newShowOnTop });\n    },\n    [changeSettings]\n  );\n\n  const handleDragStart = useCallback(() => {\n    log.debug('handleDragStart');\n\n    DragUtils.startDragging();\n  }, []);\n\n  const handleDragEnd = useCallback(\n    ({ destination, source }) => {\n      log.debug('handleDragEnd', destination, source);\n\n      DragUtils.stopDragging();\n\n      if (destination === null) {\n        return;\n      }\n\n      let destinationIndex = destination.index;\n      if (source.index < destination.index) {\n        destinationIndex += 1;\n      }\n\n      const newAggregations = [...aggregations];\n      const draggedItems = DragUtils.reorder(\n        newAggregations,\n        selectedRanges,\n        newAggregations,\n        destinationIndex\n      );\n      const insertIndex = DragUtils.adjustDestinationIndex(\n        destinationIndex,\n        selectedRanges\n      );\n      const newSelectedRanges: Range[] = [\n        [insertIndex, insertIndex + draggedItems.length - 1],\n      ];\n      changeAggregations(newAggregations);\n      setSelectedRanges(newSelectedRanges);\n    },\n    [changeAggregations, aggregations, selectedRanges, setSelectedRanges]\n  );\n\n  const handleOperationChange = useCallback(\n    operation => {\n      setSelectedOperation(operation);\n    },\n    [setSelectedOperation]\n  );\n\n  const handleAdd = useCallback(() => {\n    changeAggregations([\n      ...aggregations,\n      { operation: selectedOperation, selected: [], invert: true },\n    ]);\n  }, [aggregations, selectedOperation, changeAggregations]);\n\n  const handleDeleteClicked = useCallback(\n    (itemIndex: ModelIndex) => {\n      changeAggregations(\n        aggregations.filter((aggregation, index) => index !== itemIndex)\n      );\n    },\n    [aggregations, changeAggregations]\n  );\n\n  const handleAggregationSelectionChange = useCallback(\n    newSelectedRanges => {\n      setSelectedRanges(newSelectedRanges);\n    },\n    [setSelectedRanges]\n  );\n\n  const handleAggregationSelect = useCallback(\n    itemIndex => {\n      const aggregation = aggregations[itemIndex];\n      if (!AggregationUtils.isRollupOperation(aggregation.operation)) {\n        onEdit(aggregation);\n      }\n    },\n    [aggregations, onEdit]\n  );\n\n  const handleShowOnTopChange = useCallback(\n    (event: ChangeEvent<HTMLInputElement>) => {\n      changeShowOnTop(event.target.value === 'true');\n    },\n    [changeShowOnTop]\n  );\n\n  useEffect(\n    function setDefaultOperation() {\n      if (options.length > 0 && !options.includes(selectedOperation)) {\n        setSelectedOperation(options[0]);\n      }\n    },\n    [options, selectedOperation]\n  );\n\n  const renderAggregation = useCallback(\n    ({\n      item,\n      itemIndex,\n      isClone = false,\n      selectedCount,\n    }: DraggableRenderItemProps<Aggregation>) => {\n      const text = item.operation;\n      const badgeText = isClone ? `${selectedCount}` : undefined;\n      const className = isClone ? 'item-list-item-clone' : undefined;\n      const isRollupOperation = AggregationUtils.isRollupOperation(\n        item.operation\n      );\n      const isEditable = !isClone && !isRollupOperation;\n      return (\n        <>\n          <div\n            className={classNames(\n              'item-list-item-content',\n              'draggable-item-list-item-content',\n              className\n            )}\n          >\n            <span className=\"title\">\n              {text}\n              {!isRollup && isRollupOperation && (\n                <span className=\"small text-warning\">\n                  <FontAwesomeIcon icon={dhWarningFilled} /> Requires rollup\n                </span>\n              )}\n            </span>\n            {DraggableItemList.renderBadge({ text: badgeText })}\n            {DraggableItemList.renderHandle()}\n          </div>\n          {!isClone && (\n            <>\n              <Button\n                kind=\"ghost\"\n                className=\"btn-edit\"\n                icon={vsEdit}\n                tooltip=\"Edit Columns\"\n                onClick={() => onEdit(item)}\n                disabled={!isEditable}\n              />\n              <Button\n                kind=\"ghost\"\n                className=\"btn-delete\"\n                icon={vsTrash}\n                tooltip=\"Delete Aggregation\"\n                onClick={() => handleDeleteClicked(itemIndex)}\n              />\n            </>\n          )}\n        </>\n      );\n    },\n    [handleDeleteClicked, onEdit, isRollup]\n  );\n\n  const isOptionsShown = options.length > 0;\n  const isAggregationsShown = aggregations.length > 0;\n\n  return (\n    <div className=\"aggregations\">\n      {isOptionsShown && (\n        <div className=\"form-inline\">\n          <Select onChange={handleOperationChange} value={selectedOperation}>\n            {options.map(option => (\n              <Option value={option} key={option}>\n                {option}\n              </Option>\n            ))}\n          </Select>\n          <button\n            type=\"button\"\n            className=\"btn btn-link btn-add\"\n            onClick={handleAdd}\n          >\n            <FontAwesomeIcon icon={dhNewCircleLargeFilled} />\n            Add Aggregation\n          </button>\n        </div>\n      )}\n      {isOptionsShown && isAggregationsShown && <hr />}\n      {isAggregationsShown && (\n        <>\n          {!isRollup && (\n            <div className=\"form-inline\">\n              <label>Placement:&nbsp;</label>\n              <RadioGroup\n                onChange={handleShowOnTopChange}\n                value={`${showOnTop}`}\n              >\n                <RadioItem value=\"true\">Top</RadioItem>\n                <RadioItem value=\"false\">Bottom</RadioItem>\n              </RadioGroup>\n            </div>\n          )}\n          <DragDropContext\n            onDragStart={handleDragStart}\n            onDragEnd={handleDragEnd}\n          >\n            <DraggableItemList<Aggregation>\n              className=\"selected-aggregations\"\n              itemCount={aggregations.length}\n              items={aggregations}\n              renderItem={renderAggregation}\n              offset={0}\n              onSelectionChange={handleAggregationSelectionChange}\n              onSelect={handleAggregationSelect}\n              selectedRanges={selectedRanges}\n              isMultiSelect\n            />\n          </DragDropContext>\n        </>\n      )}\n    </div>\n  );\n}\n\nexport default Aggregations;\n"],"mappings":"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"}
+{"version":3,"file":"Aggregations.js","names":["React","useCallback","useEffect","useMemo","useState","DragDropContext","classNames","FontAwesomeIcon","dhNewCircleLargeFilled","vsTrash","vsEdit","dhWarningFilled","Log","DraggableItemList","DragUtils","Option","Select","RadioItem","RadioGroup","Button","AggregationUtils","SELECTABLE_OPTIONS","log","module","Aggregations","isRollup","settings","onChange","onEdit","aggregations","showOnTop","options","filter","option","some","aggregation","operation","selectedOperation","setSelectedOperation","selectedRanges","setSelectedRanges","changeSettings","changedSettings","changeAggregations","newAggregations","changeShowOnTop","newShowOnTop","handleDragStart","debug","startDragging","handleDragEnd","destination","source","stopDragging","destinationIndex","index","draggedItems","reorder","insertIndex","adjustDestinationIndex","newSelectedRanges","length","handleOperationChange","handleAdd","selected","invert","handleDeleteClicked","itemIndex","handleAggregationSelectionChange","handleAggregationSelect","isRollupOperation","handleShowOnTopChange","event","target","value","setDefaultOperation","includes","renderAggregation","item","isClone","selectedCount","text","badgeText","undefined","className","isEditable","renderBadge","renderHandle","isOptionsShown","isAggregationsShown","map"],"sources":["../../../src/sidebar/aggregations/Aggregations.tsx"],"sourcesContent":["import React, {\n  ChangeEvent,\n  useCallback,\n  useEffect,\n  useMemo,\n  useState,\n} from 'react';\nimport { DragDropContext } from 'react-beautiful-dnd';\nimport classNames from 'classnames';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport {\n  dhNewCircleLargeFilled,\n  vsTrash,\n  vsEdit,\n  dhWarningFilled,\n} from '@deephaven/icons';\nimport Log from '@deephaven/log';\nimport {\n  DraggableItemList,\n  DragUtils,\n  Option,\n  Select,\n  RadioItem,\n  RadioGroup,\n  Button,\n} from '@deephaven/components';\nimport type { DraggableRenderItemProps, Range } from '@deephaven/components';\nimport { ModelIndex } from '@deephaven/grid';\nimport AggregationOperation from './AggregationOperation';\nimport AggregationUtils, { SELECTABLE_OPTIONS } from './AggregationUtils';\nimport './Aggregations.scss';\n\nconst log = Log.module('Aggregations');\n\nexport type Aggregation = {\n  operation: AggregationOperation;\n  selected: readonly string[];\n  invert: boolean;\n};\n\nexport type AggregationSettings = {\n  aggregations: readonly Aggregation[];\n  showOnTop: boolean;\n};\n\nexport type AggregationsProps = {\n  isRollup: boolean;\n  settings: AggregationSettings;\n  onChange: (settings: AggregationSettings) => void;\n  onEdit: (aggregation: Aggregation) => void;\n};\n\nfunction Aggregations({\n  isRollup,\n  settings,\n  onChange,\n  onEdit,\n}: AggregationsProps): JSX.Element {\n  const { aggregations, showOnTop } = settings;\n  const options = useMemo(\n    () =>\n      SELECTABLE_OPTIONS.filter(\n        option =>\n          !aggregations.some(aggregation => aggregation.operation === option)\n      ),\n    [aggregations]\n  );\n  const [selectedOperation, setSelectedOperation] = useState(options[0]);\n  const [selectedRanges, setSelectedRanges] = useState<Range[]>([]);\n  const changeSettings = useCallback(\n    changedSettings => {\n      onChange({ ...settings, ...changedSettings });\n    },\n    [onChange, settings]\n  );\n  const changeAggregations = useCallback(\n    newAggregations => {\n      changeSettings({ aggregations: newAggregations });\n    },\n    [changeSettings]\n  );\n\n  const changeShowOnTop = useCallback(\n    newShowOnTop => {\n      changeSettings({ showOnTop: newShowOnTop });\n    },\n    [changeSettings]\n  );\n\n  const handleDragStart = useCallback(() => {\n    log.debug('handleDragStart');\n\n    DragUtils.startDragging();\n  }, []);\n\n  const handleDragEnd = useCallback(\n    ({ destination, source }) => {\n      log.debug('handleDragEnd', destination, source);\n\n      DragUtils.stopDragging();\n\n      if (destination === null) {\n        return;\n      }\n\n      let destinationIndex = destination.index;\n      if (source.index < destination.index) {\n        destinationIndex += 1;\n      }\n\n      const newAggregations = [...aggregations];\n      const draggedItems = DragUtils.reorder(\n        newAggregations,\n        selectedRanges,\n        newAggregations,\n        destinationIndex\n      );\n      const insertIndex = DragUtils.adjustDestinationIndex(\n        destinationIndex,\n        selectedRanges\n      );\n      const newSelectedRanges: Range[] = [\n        [insertIndex, insertIndex + draggedItems.length - 1],\n      ];\n      changeAggregations(newAggregations);\n      setSelectedRanges(newSelectedRanges);\n    },\n    [changeAggregations, aggregations, selectedRanges, setSelectedRanges]\n  );\n\n  const handleOperationChange = useCallback(\n    operation => {\n      setSelectedOperation(operation);\n    },\n    [setSelectedOperation]\n  );\n\n  const handleAdd = useCallback(() => {\n    changeAggregations([\n      ...aggregations,\n      { operation: selectedOperation, selected: [], invert: true },\n    ]);\n  }, [aggregations, selectedOperation, changeAggregations]);\n\n  const handleDeleteClicked = useCallback(\n    (itemIndex: ModelIndex) => {\n      changeAggregations(\n        aggregations.filter((aggregation, index) => index !== itemIndex)\n      );\n    },\n    [aggregations, changeAggregations]\n  );\n\n  const handleAggregationSelectionChange = useCallback(\n    newSelectedRanges => {\n      setSelectedRanges(newSelectedRanges);\n    },\n    [setSelectedRanges]\n  );\n\n  const handleAggregationSelect = useCallback(\n    itemIndex => {\n      const aggregation = aggregations[itemIndex];\n      if (!AggregationUtils.isRollupOperation(aggregation.operation)) {\n        onEdit(aggregation);\n      }\n    },\n    [aggregations, onEdit]\n  );\n\n  const handleShowOnTopChange = useCallback(\n    (event: ChangeEvent<HTMLInputElement>) => {\n      changeShowOnTop(event.target.value === 'true');\n    },\n    [changeShowOnTop]\n  );\n\n  useEffect(\n    function setDefaultOperation() {\n      if (options.length > 0 && !options.includes(selectedOperation)) {\n        setSelectedOperation(options[0]);\n      }\n    },\n    [options, selectedOperation]\n  );\n\n  const renderAggregation = useCallback(\n    ({\n      item,\n      itemIndex,\n      isClone = false,\n      selectedCount,\n    }: DraggableRenderItemProps<Aggregation>) => {\n      const text = item.operation;\n      const badgeText = isClone ? `${selectedCount}` : undefined;\n      const className = isClone ? 'item-list-item-clone' : undefined;\n      const isRollupOperation = AggregationUtils.isRollupOperation(\n        item.operation\n      );\n      const isEditable = !isClone && !isRollupOperation;\n      return (\n        <>\n          <div\n            className={classNames(\n              'item-list-item-content',\n              'draggable-item-list-item-content',\n              className\n            )}\n          >\n            <span className=\"title\">\n              {text}\n              {!isRollup && isRollupOperation && (\n                <span className=\"small text-warning\">\n                  <FontAwesomeIcon icon={dhWarningFilled} /> Requires rollup\n                </span>\n              )}\n            </span>\n            {DraggableItemList.renderBadge({ text: badgeText })}\n            {DraggableItemList.renderHandle()}\n          </div>\n          {!isClone && (\n            <>\n              <Button\n                kind=\"ghost\"\n                className=\"btn-edit\"\n                icon={vsEdit}\n                tooltip=\"Edit Columns\"\n                onClick={() => onEdit(item)}\n                disabled={!isEditable}\n              />\n              <Button\n                kind=\"ghost\"\n                className=\"btn-delete\"\n                icon={vsTrash}\n                tooltip=\"Delete Aggregation\"\n                onClick={() => handleDeleteClicked(itemIndex)}\n              />\n            </>\n          )}\n        </>\n      );\n    },\n    [handleDeleteClicked, onEdit, isRollup]\n  );\n\n  const isOptionsShown = options.length > 0;\n  const isAggregationsShown = aggregations.length > 0;\n\n  return (\n    <div className=\"aggregations\">\n      {isOptionsShown && (\n        <div className=\"form-inline\">\n          <Select onChange={handleOperationChange} value={selectedOperation}>\n            {options.map(option => (\n              <Option value={option} key={option}>\n                {option}\n              </Option>\n            ))}\n          </Select>\n          <button\n            type=\"button\"\n            className=\"btn btn-link btn-add\"\n            onClick={handleAdd}\n          >\n            <FontAwesomeIcon icon={dhNewCircleLargeFilled} />\n            Add Aggregation\n          </button>\n        </div>\n      )}\n      {isOptionsShown && isAggregationsShown && <hr />}\n      {isAggregationsShown && (\n        <>\n          {!isRollup && (\n            <div className=\"form-inline\">\n              <label>Placement:&nbsp;</label>\n              <RadioGroup\n                onChange={handleShowOnTopChange}\n                value={`${showOnTop}`}\n              >\n                <RadioItem value=\"true\">Top</RadioItem>\n                <RadioItem value=\"false\">Bottom</RadioItem>\n              </RadioGroup>\n            </div>\n          )}\n          <DragDropContext\n            onDragStart={handleDragStart}\n            onDragEnd={handleDragEnd}\n          >\n            <DraggableItemList<Aggregation>\n              className=\"selected-aggregations\"\n              itemCount={aggregations.length}\n              items={aggregations}\n              renderItem={renderAggregation}\n              offset={0}\n              onSelectionChange={handleAggregationSelectionChange}\n              onSelect={handleAggregationSelect}\n              selectedRanges={selectedRanges}\n              isMultiSelect\n            />\n          </DragDropContext>\n        </>\n      )}\n    </div>\n  );\n}\n\nexport default Aggregations;\n"],"mappings":"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"}

package/dist/sidebar/conditional-formatting/ColumnFormatEditor.js

@@ -9,6 +9,9 @@ import { ComboBox } from '@deephaven/components';
 import { getDefaultConditionConfigForType, getConditionConfig, getDefaultStyleConfig, FormatStyleType } from "./ConditionalFormattingUtils.js";
 import ConditionEditor from "./ConditionEditor.js";
 import StyleEditor from "./StyleEditor.js";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+import { Fragment as _Fragment } from "react/jsx-runtime";
 var log = Log.module('ColumnFormatEditor');
 var DEFAULT_CALLBACK = () => undefined;
 function makeDefaultConfig(columns) {
@@ -96,28 +99,33 @@ function ColumnFormatEditor(props) {
       value: name
     };
   });
-  return /*#__PURE__*/React.createElement("div", {
-    className: "conditional-rule-editor form"
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "mb-2"
-  }, /*#__PURE__*/React.createElement("label", {
-    className: "mb-0"
-  }, "Format Cell If"), /*#__PURE__*/React.createElement(ComboBox, {
-    defaultValue: selectedColumn === null || selectedColumn === void 0 ? void 0 : selectedColumn.name,
-    options: columnInputOptions,
-    inputPlaceholder: "Select a column",
-    spellCheck: false,
-    onChange: handleColumnChange,
-    searchPlaceholder: "Filter columns"
-  })), selectedColumn !== undefined && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(ConditionEditor, {
-    dh: dh,
-    column: selectedColumn,
-    config: conditionConfig,
-    onChange: handleConditionChange
-  }), /*#__PURE__*/React.createElement(StyleEditor, {
-    config: selectedStyle,
-    onChange: handleStyleChange
-  })));
+  return /*#__PURE__*/_jsxs("div", {
+    className: "conditional-rule-editor form",
+    children: [/*#__PURE__*/_jsxs("div", {
+      className: "mb-2",
+      children: [/*#__PURE__*/_jsx("label", {
+        className: "mb-0",
+        children: "Format Cell If"
+      }), /*#__PURE__*/_jsx(ComboBox, {
+        defaultValue: selectedColumn === null || selectedColumn === void 0 ? void 0 : selectedColumn.name,
+        options: columnInputOptions,
+        inputPlaceholder: "Select a column",
+        spellCheck: false,
+        onChange: handleColumnChange,
+        searchPlaceholder: "Filter columns"
+      })]
+    }), selectedColumn !== undefined && /*#__PURE__*/_jsxs(_Fragment, {
+      children: [/*#__PURE__*/_jsx(ConditionEditor, {
+        dh: dh,
+        column: selectedColumn,
+        config: conditionConfig,
+        onChange: handleConditionChange
+      }), /*#__PURE__*/_jsx(StyleEditor, {
+        config: selectedStyle,
+        onChange: handleStyleChange
+      })]
+    })]
+  });
 }
 export default ColumnFormatEditor;
 //# sourceMappingURL=ColumnFormatEditor.js.map

package/dist/sidebar/conditional-formatting/ColumnFormatEditor.js.map

@@ -1 +1 @@
-{"version":3,"file":"ColumnFormatEditor.js","names":["React","useCallback","useEffect","useState","Log","ComboBox","getDefaultConditionConfigForType","getConditionConfig","getDefaultStyleConfig","FormatStyleType","ConditionEditor","StyleEditor","log","module","DEFAULT_CALLBACK","undefined","makeDefaultConfig","columns","type","name","column","config","style","ColumnFormatEditor","props","dh","onChange","selectedColumn","setColumn","find","c","conditionConfig","setConditionConfig","conditionValid","setConditionValid","selectedStyle","setStyle","handleColumnChange","value","newColumn","error","handleConditionChange","updatedConditionConfig","isValid","debug","handleStyleChange","updatedStyleConfig","updateColumnFormat","NO_FORMATTING","columnInputOptions","map","title"],"sources":["../../../src/sidebar/conditional-formatting/ColumnFormatEditor.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useState } from 'react';\nimport Log from '@deephaven/log';\nimport { ComboBox } from '@deephaven/components';\nimport type { dh as DhType } from '@deephaven/jsapi-types';\nimport {\n  BaseFormatConfig,\n  ChangeCallback,\n  getDefaultConditionConfigForType,\n  getConditionConfig,\n  getDefaultStyleConfig,\n  ModelColumn,\n  FormatStyleType,\n} from './ConditionalFormattingUtils';\nimport ConditionEditor from './ConditionEditor';\nimport StyleEditor from './StyleEditor';\n\nconst log = Log.module('ColumnFormatEditor');\n\nexport interface ColumnFormatEditorProps {\n  columns: ModelColumn[];\n  config?: BaseFormatConfig;\n  dh: DhType;\n  onChange?: ChangeCallback;\n}\n\nconst DEFAULT_CALLBACK = () => undefined;\n\nfunction makeDefaultConfig(columns: ModelColumn[]): BaseFormatConfig {\n  const { type, name } = columns[0];\n  const column = { type, name };\n  const config = {\n    column,\n    style: getDefaultStyleConfig(),\n    ...getDefaultConditionConfigForType(type),\n  };\n  return config;\n}\n\nfunction ColumnFormatEditor(props: ColumnFormatEditorProps): JSX.Element {\n  const {\n    columns,\n    config = makeDefaultConfig(columns),\n    dh,\n    onChange = DEFAULT_CALLBACK,\n  } = props;\n\n  const [selectedColumn, setColumn] = useState(\n    columns.find(\n      c => c.name === config.column.name && c.type === config.column.type\n    ) ?? columns[0]\n  );\n  const [conditionConfig, setConditionConfig] = useState(\n    getConditionConfig(config)\n  );\n  const [conditionValid, setConditionValid] = useState(false);\n  const [selectedStyle, setStyle] = useState(config.style);\n\n  const handleColumnChange = useCallback(\n    value => {\n      const newColumn = columns.find(({ name }) => name === value);\n      if (newColumn !== undefined) {\n        setColumn(newColumn);\n        if (selectedColumn.type !== newColumn.type) {\n          setConditionConfig(getDefaultConditionConfigForType(newColumn.type));\n          setConditionValid(false);\n        }\n      } else {\n        log.error(`Column ${value} not found.`);\n      }\n    },\n    [columns, selectedColumn]\n  );\n\n  const handleConditionChange = useCallback(\n    (updatedConditionConfig, isValid) => {\n      log.debug('handleConditionChange', updatedConditionConfig, isValid);\n      setConditionConfig(updatedConditionConfig);\n      setConditionValid(isValid);\n    },\n    []\n  );\n\n  const handleStyleChange = useCallback(updatedStyleConfig => {\n    log.debug('handleStyleChange', updatedStyleConfig);\n    setStyle(updatedStyleConfig);\n  }, []);\n\n  useEffect(\n    function updateColumnFormat() {\n      let isValid = conditionValid;\n\n      if (selectedColumn === undefined) {\n        log.debug('Column is not selected, invalidating update.');\n        isValid = false;\n      }\n      if (\n        selectedStyle === undefined ||\n        selectedStyle.type === FormatStyleType.NO_FORMATTING\n      ) {\n        log.debug('Style is not selected, invalidating update.');\n        isValid = false;\n      }\n\n      const { type, name } = selectedColumn;\n      const column = { type, name };\n      onChange(\n        {\n          column,\n          style: selectedStyle,\n          ...conditionConfig,\n        },\n        isValid\n      );\n    },\n    [onChange, selectedColumn, selectedStyle, conditionConfig, conditionValid]\n  );\n\n  const columnInputOptions = columns.map(({ name }) => ({\n    title: name,\n    value: name,\n  }));\n\n  return (\n    <div className=\"conditional-rule-editor form\">\n      <div className=\"mb-2\">\n        <label className=\"mb-0\">Format Cell If</label>\n        <ComboBox\n          defaultValue={selectedColumn?.name}\n          options={columnInputOptions}\n          inputPlaceholder=\"Select a column\"\n          spellCheck={false}\n          onChange={handleColumnChange}\n          searchPlaceholder=\"Filter columns\"\n        />\n      </div>\n\n      {selectedColumn !== undefined && (\n        <>\n          <ConditionEditor\n            dh={dh}\n            column={selectedColumn}\n            config={conditionConfig}\n            onChange={handleConditionChange}\n          />\n          <StyleEditor config={selectedStyle} onChange={handleStyleChange} />\n        </>\n      )}\n    </div>\n  );\n}\n\nexport default ColumnFormatEditor;\n"],"mappings":"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"}
+{"version":3,"file":"ColumnFormatEditor.js","names":["React","useCallback","useEffect","useState","Log","ComboBox","getDefaultConditionConfigForType","getConditionConfig","getDefaultStyleConfig","FormatStyleType","ConditionEditor","StyleEditor","log","module","DEFAULT_CALLBACK","undefined","makeDefaultConfig","columns","type","name","column","config","style","ColumnFormatEditor","props","dh","onChange","selectedColumn","setColumn","find","c","conditionConfig","setConditionConfig","conditionValid","setConditionValid","selectedStyle","setStyle","handleColumnChange","value","newColumn","error","handleConditionChange","updatedConditionConfig","isValid","debug","handleStyleChange","updatedStyleConfig","updateColumnFormat","NO_FORMATTING","columnInputOptions","map","title"],"sources":["../../../src/sidebar/conditional-formatting/ColumnFormatEditor.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useState } from 'react';\nimport Log from '@deephaven/log';\nimport { ComboBox } from '@deephaven/components';\nimport type { dh as DhType } from '@deephaven/jsapi-types';\nimport {\n  BaseFormatConfig,\n  ChangeCallback,\n  getDefaultConditionConfigForType,\n  getConditionConfig,\n  getDefaultStyleConfig,\n  ModelColumn,\n  FormatStyleType,\n} from './ConditionalFormattingUtils';\nimport ConditionEditor from './ConditionEditor';\nimport StyleEditor from './StyleEditor';\n\nconst log = Log.module('ColumnFormatEditor');\n\nexport interface ColumnFormatEditorProps {\n  columns: ModelColumn[];\n  config?: BaseFormatConfig;\n  dh: DhType;\n  onChange?: ChangeCallback;\n}\n\nconst DEFAULT_CALLBACK = () => undefined;\n\nfunction makeDefaultConfig(columns: ModelColumn[]): BaseFormatConfig {\n  const { type, name } = columns[0];\n  const column = { type, name };\n  const config = {\n    column,\n    style: getDefaultStyleConfig(),\n    ...getDefaultConditionConfigForType(type),\n  };\n  return config;\n}\n\nfunction ColumnFormatEditor(props: ColumnFormatEditorProps): JSX.Element {\n  const {\n    columns,\n    config = makeDefaultConfig(columns),\n    dh,\n    onChange = DEFAULT_CALLBACK,\n  } = props;\n\n  const [selectedColumn, setColumn] = useState(\n    columns.find(\n      c => c.name === config.column.name && c.type === config.column.type\n    ) ?? columns[0]\n  );\n  const [conditionConfig, setConditionConfig] = useState(\n    getConditionConfig(config)\n  );\n  const [conditionValid, setConditionValid] = useState(false);\n  const [selectedStyle, setStyle] = useState(config.style);\n\n  const handleColumnChange = useCallback(\n    value => {\n      const newColumn = columns.find(({ name }) => name === value);\n      if (newColumn !== undefined) {\n        setColumn(newColumn);\n        if (selectedColumn.type !== newColumn.type) {\n          setConditionConfig(getDefaultConditionConfigForType(newColumn.type));\n          setConditionValid(false);\n        }\n      } else {\n        log.error(`Column ${value} not found.`);\n      }\n    },\n    [columns, selectedColumn]\n  );\n\n  const handleConditionChange = useCallback(\n    (updatedConditionConfig, isValid) => {\n      log.debug('handleConditionChange', updatedConditionConfig, isValid);\n      setConditionConfig(updatedConditionConfig);\n      setConditionValid(isValid);\n    },\n    []\n  );\n\n  const handleStyleChange = useCallback(updatedStyleConfig => {\n    log.debug('handleStyleChange', updatedStyleConfig);\n    setStyle(updatedStyleConfig);\n  }, []);\n\n  useEffect(\n    function updateColumnFormat() {\n      let isValid = conditionValid;\n\n      if (selectedColumn === undefined) {\n        log.debug('Column is not selected, invalidating update.');\n        isValid = false;\n      }\n      if (\n        selectedStyle === undefined ||\n        selectedStyle.type === FormatStyleType.NO_FORMATTING\n      ) {\n        log.debug('Style is not selected, invalidating update.');\n        isValid = false;\n      }\n\n      const { type, name } = selectedColumn;\n      const column = { type, name };\n      onChange(\n        {\n          column,\n          style: selectedStyle,\n          ...conditionConfig,\n        },\n        isValid\n      );\n    },\n    [onChange, selectedColumn, selectedStyle, conditionConfig, conditionValid]\n  );\n\n  const columnInputOptions = columns.map(({ name }) => ({\n    title: name,\n    value: name,\n  }));\n\n  return (\n    <div className=\"conditional-rule-editor form\">\n      <div className=\"mb-2\">\n        <label className=\"mb-0\">Format Cell If</label>\n        <ComboBox\n          defaultValue={selectedColumn?.name}\n          options={columnInputOptions}\n          inputPlaceholder=\"Select a column\"\n          spellCheck={false}\n          onChange={handleColumnChange}\n          searchPlaceholder=\"Filter columns\"\n        />\n      </div>\n\n      {selectedColumn !== undefined && (\n        <>\n          <ConditionEditor\n            dh={dh}\n            column={selectedColumn}\n            config={conditionConfig}\n            onChange={handleConditionChange}\n          />\n          <StyleEditor config={selectedStyle} onChange={handleStyleChange} />\n        </>\n      )}\n    </div>\n  );\n}\n\nexport default ColumnFormatEditor;\n"],"mappings":"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"}