@deephaven/iris-grid 1.22.1-alpha-pivot-builder.0 → 1.22.2-alpha-pivot-builder.0

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

@@ -1 +1 @@
-{"version":3,"file":"RowFormatEditor.js","names":["React","useCallback","useEffect","useMemo","useState","Log","ComboBox","getDefaultConditionConfigForType","getConditionConfig","getDefaultStyleConfig","ConditionEditor","StyleEditor","jsx","_jsx","jsxs","_jsxs","Fragment","_Fragment","log","module","DEFAULT_CALLBACK","undefined","makeDefaultConfig","columns","type","name","column","config","_objectSpread","style","RowFormatEditor","props","_columns$find","dh","onChange","selectedColumn","setColumn","find","c","conditionConfig","setConditionConfig","conditionValid","setConditionValid","selectedStyle","setStyle","handleColumnChange","value","newColumn","_ref","error","concat","handleConditionChange","updatedConditionConfig","isValid","debug","handleStyleChange","updatedStyleConfig","updateRowFormat","columnNames","map","_ref2","className","children","defaultSelectedKey"],"sources":["../../../src/sidebar/conditional-formatting/RowFormatEditor.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useMemo, useState } from 'react';\nimport type { ItemKey } from '@deephaven/components';\nimport Log from '@deephaven/log';\nimport type { dh as DhType } from '@deephaven/jsapi-types';\nimport { ComboBox } from '@deephaven/components';\nimport {\n  type BaseFormatConfig,\n  type ChangeCallback,\n  getDefaultConditionConfigForType,\n  getConditionConfig,\n  getDefaultStyleConfig,\n  type ModelColumn,\n  type ConditionConfig,\n  type FormatStyleConfig,\n} from './ConditionalFormattingUtils';\nimport ConditionEditor from './ConditionEditor';\nimport StyleEditor from './StyleEditor';\n\nconst log = Log.module('RowFormatEditor');\n\nexport interface RowFormatEditorProps {\n  columns: ModelColumn[];\n  config?: BaseFormatConfig;\n  dh: typeof DhType;\n  onChange?: ChangeCallback;\n}\n\nconst DEFAULT_CALLBACK = (): void => 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 RowFormatEditor(props: RowFormatEditorProps): 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: ItemKey | null) => {\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: ConditionConfig, isValid: boolean) => {\n      log.debug('handleConditionChange', updatedConditionConfig, isValid);\n      setConditionConfig(updatedConditionConfig);\n      setConditionValid(isValid);\n    },\n    []\n  );\n\n  const handleStyleChange = useCallback(\n    (updatedStyleConfig: FormatStyleConfig) => {\n      log.debug('handleStyleChange', updatedStyleConfig);\n      setStyle(updatedStyleConfig);\n    },\n    []\n  );\n\n  useEffect(\n    function updateRowFormat() {\n      if (selectedColumn === undefined) {\n        log.debug('Column is not selected, skip update.');\n        return;\n      }\n      if (selectedStyle === undefined) {\n        log.debug('Style is not selected, skip update.');\n        return;\n      }\n      const { type, name } = selectedColumn;\n      const column = { type, name };\n      onChange(\n        {\n          column,\n          style: selectedStyle,\n          ...conditionConfig,\n        },\n        conditionValid\n      );\n    },\n    [onChange, selectedColumn, selectedStyle, conditionConfig, conditionValid]\n  );\n\n  const columnNames = useMemo(() => columns.map(({ name }) => name), [columns]);\n\n  return (\n    <div className=\"conditional-rule-editor form\">\n      <div className=\"mb-2\">\n        <label className=\"mb-0\">Format Row If</label>\n        <ComboBox\n          aria-label=\"Select column to format row by\"\n          defaultSelectedKey={selectedColumn?.name}\n          onChange={handleColumnChange}\n        >\n          {columnNames}\n        </ComboBox>\n      </div>\n\n      {selectedColumn !== undefined && (\n        <>\n          <ConditionEditor\n            column={selectedColumn}\n            config={conditionConfig}\n            dh={dh}\n            onChange={handleConditionChange}\n          />\n          <StyleEditor config={selectedStyle} onChange={handleStyleChange} />\n        </>\n      )}\n    </div>\n  );\n}\n\nexport default RowFormatEditor;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"RowFormatEditor.js","names":["React","useCallback","useEffect","useMemo","useState","Log","ComboBox","getDefaultConditionConfigForType","getConditionConfig","getDefaultStyleConfig","ConditionEditor","StyleEditor","jsx","_jsx","jsxs","_jsxs","Fragment","_Fragment","log","module","DEFAULT_CALLBACK","undefined","makeDefaultConfig","columns","_columns$","type","name","column","config","_objectSpread","style","RowFormatEditor","props","_columns$find","_props$config","dh","_props$onChange","onChange","_useState","find","c","_useState2","_slicedToArray","selectedColumn","setColumn","_useState3","_useState4","conditionConfig","setConditionConfig","_useState5","_useState6","conditionValid","setConditionValid","_useState7","_useState8","selectedStyle","setStyle","handleColumnChange","value","newColumn","_ref","error","concat","handleConditionChange","updatedConditionConfig","isValid","debug","handleStyleChange","updatedStyleConfig","updateRowFormat","columnNames","map","_ref2","className","children","defaultSelectedKey"],"sources":["../../../src/sidebar/conditional-formatting/RowFormatEditor.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useMemo, useState } from 'react';\nimport type { ItemKey } from '@deephaven/components';\nimport Log from '@deephaven/log';\nimport type { dh as DhType } from '@deephaven/jsapi-types';\nimport { ComboBox } from '@deephaven/components';\nimport {\n  type BaseFormatConfig,\n  type ChangeCallback,\n  getDefaultConditionConfigForType,\n  getConditionConfig,\n  getDefaultStyleConfig,\n  type ModelColumn,\n  type ConditionConfig,\n  type FormatStyleConfig,\n} from './ConditionalFormattingUtils';\nimport ConditionEditor from './ConditionEditor';\nimport StyleEditor from './StyleEditor';\n\nconst log = Log.module('RowFormatEditor');\n\nexport interface RowFormatEditorProps {\n  columns: ModelColumn[];\n  config?: BaseFormatConfig;\n  dh: typeof DhType;\n  onChange?: ChangeCallback;\n}\n\nconst DEFAULT_CALLBACK = (): void => 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 RowFormatEditor(props: RowFormatEditorProps): 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: ItemKey | null) => {\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: ConditionConfig, isValid: boolean) => {\n      log.debug('handleConditionChange', updatedConditionConfig, isValid);\n      setConditionConfig(updatedConditionConfig);\n      setConditionValid(isValid);\n    },\n    []\n  );\n\n  const handleStyleChange = useCallback(\n    (updatedStyleConfig: FormatStyleConfig) => {\n      log.debug('handleStyleChange', updatedStyleConfig);\n      setStyle(updatedStyleConfig);\n    },\n    []\n  );\n\n  useEffect(\n    function updateRowFormat() {\n      if (selectedColumn === undefined) {\n        log.debug('Column is not selected, skip update.');\n        return;\n      }\n      if (selectedStyle === undefined) {\n        log.debug('Style is not selected, skip update.');\n        return;\n      }\n      const { type, name } = selectedColumn;\n      const column = { type, name };\n      onChange(\n        {\n          column,\n          style: selectedStyle,\n          ...conditionConfig,\n        },\n        conditionValid\n      );\n    },\n    [onChange, selectedColumn, selectedStyle, conditionConfig, conditionValid]\n  );\n\n  const columnNames = useMemo(() => columns.map(({ name }) => name), [columns]);\n\n  return (\n    <div className=\"conditional-rule-editor form\">\n      <div className=\"mb-2\">\n        <label className=\"mb-0\">Format Row If</label>\n        <ComboBox\n          aria-label=\"Select column to format row by\"\n          defaultSelectedKey={selectedColumn?.name}\n          onChange={handleColumnChange}\n        >\n          {columnNames}\n        </ComboBox>\n      </div>\n\n      {selectedColumn !== undefined && (\n        <>\n          <ConditionEditor\n            column={selectedColumn}\n            config={conditionConfig}\n            dh={dh}\n            onChange={handleConditionChange}\n          />\n          <StyleEditor config={selectedStyle} onChange={handleStyleChange} />\n        </>\n      )}\n    </div>\n  );\n}\n\nexport default RowFormatEditor;\n"],"mappings":"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","ignoreList":[]}

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

@@ -1,3 +1,9 @@
+function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
+function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
+function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
+function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
 import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import Log from '@deephaven/log';
@@ -15,19 +21,28 @@ var DEFAULT_DROPDOWN_WIDTH = 200;
 var DEFAULT_CALLBACK = () => undefined;
 function StyleEditor(props) {
   var _config$customConfig$, _config$customConfig;
-  var {
-    config,
-    onChange = DEFAULT_CALLBACK
-  } = props;
-  var [styleType, setStyleType] = useState(config.type);
-  var [background, setBackground] = useState((_config$customConfig$ = (_config$customConfig = config.customConfig) === null || _config$customConfig === void 0 ? void 0 : _config$customConfig.background) !== null && _config$customConfig$ !== void 0 ? _config$customConfig$ : DEFAULT_BACKGROUND);
-  var [isShown, setShown] = useState(false);
-  var [dropdownWidth, setDropdownWidth] = useState(DEFAULT_DROPDOWN_WIDTH);
+  var config = props.config,
+    _props$onChange = props.onChange,
+    onChange = _props$onChange === void 0 ? DEFAULT_CALLBACK : _props$onChange;
+  var _useState = useState(config.type),
+    _useState2 = _slicedToArray(_useState, 2),
+    styleType = _useState2[0],
+    setStyleType = _useState2[1];
+  var _useState3 = useState((_config$customConfig$ = (_config$customConfig = config.customConfig) === null || _config$customConfig === void 0 ? void 0 : _config$customConfig.background) !== null && _config$customConfig$ !== void 0 ? _config$customConfig$ : DEFAULT_BACKGROUND),
+    _useState4 = _slicedToArray(_useState3, 2),
+    background = _useState4[0],
+    setBackground = _useState4[1];
+  var _useState5 = useState(false),
+    _useState6 = _slicedToArray(_useState5, 2),
+    isShown = _useState6[0],
+    setShown = _useState6[1];
+  var _useState7 = useState(DEFAULT_DROPDOWN_WIDTH),
+    _useState8 = _slicedToArray(_useState7, 2),
+    dropdownWidth = _useState8[0],
+    setDropdownWidth = _useState8[1];
   var csContainer = useRef(null);
   var handleBackgroundChange = useCallback(e => {
-    var {
-      value
-    } = e.target;
+    var value = e.target.value;
     log.debug('handleBackgroundChange', value);
     setBackground(value);
   }, []);

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

@@ -1 +1 @@
-{"version":3,"file":"StyleEditor.js","names":["React","useCallback","useEffect","useMemo","useRef","useState","FontAwesomeIcon","Log","ColorUtils","vsCheck","Button","DropdownMenu","FormatStyleType","getLabelForStyleType","getBackgroundForStyleConfig","getColorForStyleConfig","jsx","_jsx","jsxs","_jsxs","log","module","DEFAULT_BACKGROUND","DEFAULT_COLOR_LIGHT","DEFAULT_COLOR_DARK","DEFAULT_DROPDOWN_WIDTH","DEFAULT_CALLBACK","undefined","StyleEditor","props","_config$customConfig$","_config$customConfig","config","onChange","styleType","setStyleType","type","background","setBackground","customConfig","isShown","setShown","dropdownWidth","setDropdownWidth","csContainer","handleBackgroundChange","e","value","target","debug","handleMenuClosed","handleToggleClick","updateDropdownWidth","styleOptions","NO_FORMATTING","POSITIVE","NEGATIVE","WARN","NEUTRAL","ACCENT_1","ACCENT_2","CUSTOM","current","getBoundingClientRect","width","updateTheme","color","isDark","renderOptions","matchFound","optionArray","_loop","option","index","key","concat","push","kind","className","onClick","style","children","icon","length","renderMenuElement","role","ref","actions","menuElement","popperOptions","placement","popperClassName","onMenuClosed","menuStyle","maxWidth"],"sources":["../../../src/sidebar/conditional-formatting/StyleEditor.tsx"],"sourcesContent":["import React, {\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport Log from '@deephaven/log';\nimport { ColorUtils } from '@deephaven/utils';\nimport { vsCheck } from '@deephaven/icons';\nimport { Button, DropdownMenu } from '@deephaven/components';\nimport {\n  FormatStyleType,\n  getLabelForStyleType,\n  type FormatStyleConfig,\n  getBackgroundForStyleConfig,\n  getColorForStyleConfig,\n} from './ConditionalFormattingUtils';\n\nimport './StyleEditor.scss';\n\nconst log = Log.module('StyleEditor');\n\nconst DEFAULT_BACKGROUND = '#fcfcfa';\n\nconst DEFAULT_COLOR_LIGHT = '#f0f0ee';\n\nconst DEFAULT_COLOR_DARK = '#1a171a';\n\nconst DEFAULT_DROPDOWN_WIDTH = 200;\n\nexport interface ConditionEditorProps {\n  config: FormatStyleConfig;\n  onChange?: (config: FormatStyleConfig) => void;\n}\n\nconst DEFAULT_CALLBACK = (): void => undefined;\n\nfunction StyleEditor(props: ConditionEditorProps): JSX.Element {\n  const { config, onChange = DEFAULT_CALLBACK } = props;\n  const [styleType, setStyleType] = useState(config.type);\n  const [background, setBackground] = useState(\n    config.customConfig?.background ?? DEFAULT_BACKGROUND\n  );\n  const [isShown, setShown] = useState(false);\n  const [dropdownWidth, setDropdownWidth] = useState(DEFAULT_DROPDOWN_WIDTH);\n  const csContainer = useRef<HTMLDivElement>(null);\n\n  const handleBackgroundChange = useCallback(\n    (e: React.ChangeEvent<HTMLInputElement>) => {\n      const { value } = e.target;\n      log.debug('handleBackgroundChange', value);\n      setBackground(value);\n    },\n    []\n  );\n\n  const handleMenuClosed = useCallback(() => {\n    if (isShown) {\n      setShown(false);\n    }\n  }, [isShown]);\n\n  const handleToggleClick = useCallback(() => {\n    if (!isShown) {\n      updateDropdownWidth();\n    }\n    setShown(!isShown);\n  }, [isShown]);\n\n  const styleOptions = useMemo(\n    () => [\n      FormatStyleType.NO_FORMATTING,\n      FormatStyleType.POSITIVE,\n      FormatStyleType.NEGATIVE,\n      FormatStyleType.WARN,\n      FormatStyleType.NEUTRAL,\n      FormatStyleType.ACCENT_1,\n      FormatStyleType.ACCENT_2,\n      FormatStyleType.CUSTOM,\n    ],\n    []\n  );\n\n  function updateDropdownWidth(): void {\n    if (csContainer.current) {\n      setDropdownWidth(csContainer.current.getBoundingClientRect().width);\n    }\n  }\n\n  useEffect(\n    function updateTheme() {\n      onChange({\n        type: styleType,\n        customConfig: {\n          color: ColorUtils.isDark(background)\n            ? DEFAULT_COLOR_LIGHT\n            : DEFAULT_COLOR_DARK,\n          background,\n        },\n      });\n    },\n    [onChange, styleType, background]\n  );\n\n  const renderOptions = useCallback(() => {\n    let matchFound = false;\n    const optionArray: JSX.Element[] = [];\n    for (let index = 0; index < styleOptions.length; index += 1) {\n      const option = styleOptions[index];\n      const key = `option-${index}-${option}`;\n      matchFound = matchFound || option === styleType;\n      optionArray.push(\n        <Button\n          key={key}\n          kind=\"inline\"\n          className=\"style-option-btn\"\n          onClick={() => {\n            setStyleType(option);\n            setShown(false);\n          }}\n          style={{\n            color: getColorForStyleConfig({ type: option }),\n            background: getBackgroundForStyleConfig({ type: option }),\n          }}\n        >\n          {option === styleType && (\n            <FontAwesomeIcon icon={vsCheck} className=\"mr-2\" />\n          )}\n          {option !== styleType && <span className=\"mr-4\" />}\n          {getLabelForStyleType(option)}\n        </Button>\n      );\n    }\n    return optionArray;\n  }, [styleOptions, styleType]);\n\n  const renderMenuElement = useCallback(\n    () => (\n      <div\n        className=\"style-menu-container\"\n        role=\"presentation\"\n        style={{ width: dropdownWidth }}\n      >\n        <div className=\"style-options\">{renderOptions()}</div>\n      </div>\n    ),\n    [dropdownWidth, renderOptions]\n  );\n\n  return (\n    <div className=\"style-editor\">\n      <div className=\"mb-2\" ref={csContainer}>\n        <label className=\"mb-0\">Style</label>\n        <Button\n          kind=\"inline\"\n          className=\"cs-dropdown custom-select\"\n          style={{\n            color: getColorForStyleConfig({ type: styleType }),\n            background: getBackgroundForStyleConfig({ type: styleType }),\n          }}\n          onClick={handleToggleClick}\n        >\n          {getLabelForStyleType(styleType)}\n\n          <DropdownMenu\n            isShown={isShown}\n            actions={{ menuElement: renderMenuElement() }}\n            popperOptions={{ placement: 'bottom-start' }}\n            popperClassName=\"style-dropdown-menu\"\n            onMenuClosed={handleMenuClosed}\n            menuStyle={{ maxWidth: '100rem' }}\n          />\n        </Button>\n      </div>\n\n      {styleType === FormatStyleType.CUSTOM && (\n        <div className=\"mb-2\">\n          <label className=\"mb-0\">Background</label>\n          <input\n            type=\"color\"\n            value={background}\n            className=\"custom-select color-select\"\n            onChange={handleBackgroundChange}\n          />\n        </div>\n      )}\n    </div>\n  );\n}\n\nexport default StyleEditor;\n"],"mappings":"AAAA,OAAOA,KAAK,IACVC,WAAW,EACXC,SAAS,EACTC,OAAO,EACPC,MAAM,EACNC,QAAQ,QACH,OAAO;AACd,SAASC,eAAe,QAAQ,gCAAgC;AAChE,OAAOC,GAAG,MAAM,gBAAgB;AAChC,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,OAAO,QAAQ,kBAAkB;AAC1C,SAASC,MAAM,EAAEC,YAAY,QAAQ,uBAAuB;AAAC,SAE3DC,eAAe,EACfC,oBAAoB,EAEpBC,2BAA2B,EAC3BC,sBAAsB;AAAA;AAAA,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAKxB,IAAMC,GAAG,GAAGb,GAAG,CAACc,MAAM,CAAC,aAAa,CAAC;AAErC,IAAMC,kBAAkB,GAAG,SAAS;AAEpC,IAAMC,mBAAmB,GAAG,SAAS;AAErC,IAAMC,kBAAkB,GAAG,SAAS;AAEpC,IAAMC,sBAAsB,GAAG,GAAG;AAOlC,IAAMC,gBAAgB,GAAGA,CAAA,KAAYC,SAAS;AAE9C,SAASC,WAAWA,CAACC,KAA2B,EAAe;EAAA,IAAAC,qBAAA,EAAAC,oBAAA;EAC7D,IAAM;IAAEC,MAAM;IAAEC,QAAQ,GAAGP;EAAiB,CAAC,GAAGG,KAAK;EACrD,IAAM,CAACK,SAAS,EAAEC,YAAY,CAAC,GAAG9B,QAAQ,CAAC2B,MAAM,CAACI,IAAI,CAAC;EACvD,IAAM,CAACC,UAAU,EAAEC,aAAa,CAAC,GAAGjC,QAAQ,EAAAyB,qBAAA,IAAAC,oBAAA,GAC1CC,MAAM,CAACO,YAAY,cAAAR,oBAAA,uBAAnBA,oBAAA,CAAqBM,UAAU,cAAAP,qBAAA,cAAAA,qBAAA,GAAIR,kBACrC,CAAC;EACD,IAAM,CAACkB,OAAO,EAAEC,QAAQ,CAAC,GAAGpC,QAAQ,CAAC,KAAK,CAAC;EAC3C,IAAM,CAACqC,aAAa,EAAEC,gBAAgB,CAAC,GAAGtC,QAAQ,CAACoB,sBAAsB,CAAC;EAC1E,IAAMmB,WAAW,GAAGxC,MAAM,CAAiB,IAAI,CAAC;EAEhD,IAAMyC,sBAAsB,GAAG5C,WAAW,CACvC6C,CAAsC,IAAK;IAC1C,IAAM;MAAEC;IAAM,CAAC,GAAGD,CAAC,CAACE,MAAM;IAC1B5B,GAAG,CAAC6B,KAAK,CAAC,wBAAwB,EAAEF,KAAK,CAAC;IAC1CT,aAAa,CAACS,KAAK,CAAC;EACtB,CAAC,EACD,EACF,CAAC;EAED,IAAMG,gBAAgB,GAAGjD,WAAW,CAAC,MAAM;IACzC,IAAIuC,OAAO,EAAE;MACXC,QAAQ,CAAC,KAAK,CAAC;IACjB;EACF,CAAC,EAAE,CAACD,OAAO,CAAC,CAAC;EAEb,IAAMW,iBAAiB,GAAGlD,WAAW,CAAC,MAAM;IAC1C,IAAI,CAACuC,OAAO,EAAE;MACZY,mBAAmB,CAAC,CAAC;IACvB;IACAX,QAAQ,CAAC,CAACD,OAAO,CAAC;EACpB,CAAC,EAAE,CAACA,OAAO,CAAC,CAAC;EAEb,IAAMa,YAAY,GAAGlD,OAAO,CAC1B,MAAM,CACJS,eAAe,CAAC0C,aAAa,EAC7B1C,eAAe,CAAC2C,QAAQ,EACxB3C,eAAe,CAAC4C,QAAQ,EACxB5C,eAAe,CAAC6C,IAAI,EACpB7C,eAAe,CAAC8C,OAAO,EACvB9C,eAAe,CAAC+C,QAAQ,EACxB/C,eAAe,CAACgD,QAAQ,EACxBhD,eAAe,CAACiD,MAAM,CACvB,EACD,EACF,CAAC;EAED,SAAST,mBAAmBA,CAAA,EAAS;IACnC,IAAIR,WAAW,CAACkB,OAAO,EAAE;MACvBnB,gBAAgB,CAACC,WAAW,CAACkB,OAAO,CAACC,qBAAqB,CAAC,CAAC,CAACC,KAAK,CAAC;IACrE;EACF;EAEA9D,SAAS,CACP,SAAS+D,WAAWA,CAAA,EAAG;IACrBhC,QAAQ,CAAC;MACPG,IAAI,EAAEF,SAAS;MACfK,YAAY,EAAE;QACZ2B,KAAK,EAAE1D,UAAU,CAAC2D,MAAM,CAAC9B,UAAU,CAAC,GAChCd,mBAAmB,GACnBC,kBAAkB;QACtBa;MACF;IACF,CAAC,CAAC;EACJ,CAAC,EACD,CAACJ,QAAQ,EAAEC,SAAS,EAAEG,UAAU,CAClC,CAAC;EAED,IAAM+B,aAAa,GAAGnE,WAAW,CAAC,MAAM;IACtC,IAAIoE,UAAU,GAAG,KAAK;IACtB,IAAMC,WAA0B,GAAG,EAAE;IAAC,IAAAC,KAAA,YAAAA,MAAA,EACuB;MAC3D,IAAMC,MAAM,GAAGnB,YAAY,CAACoB,KAAK,CAAC;MAClC,IAAMC,GAAG,aAAAC,MAAA,CAAaF,KAAK,OAAAE,MAAA,CAAIH,MAAM,CAAE;MACvCH,UAAU,GAAGA,UAAU,IAAIG,MAAM,KAAKtC,SAAS;MAC/CoC,WAAW,CAACM,IAAI,cACdzD,KAAA,CAACT,MAAM;QAELmE,IAAI,EAAC,QAAQ;QACbC,SAAS,EAAC,kBAAkB;QAC5BC,OAAO,EAAEA,CAAA,KAAM;UACb5C,YAAY,CAACqC,MAAM,CAAC;UACpB/B,QAAQ,CAAC,KAAK,CAAC;QACjB,CAAE;QACFuC,KAAK,EAAE;UACLd,KAAK,EAAEnD,sBAAsB,CAAC;YAAEqB,IAAI,EAAEoC;UAAO,CAAC,CAAC;UAC/CnC,UAAU,EAAEvB,2BAA2B,CAAC;YAAEsB,IAAI,EAAEoC;UAAO,CAAC;QAC1D,CAAE;QAAAS,QAAA,GAEDT,MAAM,KAAKtC,SAAS,iBACnBjB,IAAA,CAACX,eAAe;UAAC4E,IAAI,EAAEzE,OAAQ;UAACqE,SAAS,EAAC;QAAM,CAAE,CACnD,EACAN,MAAM,KAAKtC,SAAS,iBAAIjB,IAAA;UAAM6D,SAAS,EAAC;QAAM,CAAE,CAAC,EACjDjE,oBAAoB,CAAC2D,MAAM,CAAC;MAAA,GAhBxBE,GAiBC,CACV,CAAC;IACH,CAAC;IAzBD,KAAK,IAAID,KAAK,GAAG,CAAC,EAAEA,KAAK,GAAGpB,YAAY,CAAC8B,MAAM,EAAEV,KAAK,IAAI,CAAC;MAAAF,KAAA;IAAA;IA0B3D,OAAOD,WAAW;EACpB,CAAC,EAAE,CAACjB,YAAY,EAAEnB,SAAS,CAAC,CAAC;EAE7B,IAAMkD,iBAAiB,GAAGnF,WAAW,CACnC,mBACEgB,IAAA;IACE6D,SAAS,EAAC,sBAAsB;IAChCO,IAAI,EAAC,cAAc;IACnBL,KAAK,EAAE;MAAEhB,KAAK,EAAEtB;IAAc,CAAE;IAAAuC,QAAA,eAEhChE,IAAA;MAAK6D,SAAS,EAAC,eAAe;MAAAG,QAAA,EAAEb,aAAa,CAAC;IAAC,CAAM;EAAC,CACnD,CACN,EACD,CAAC1B,aAAa,EAAE0B,aAAa,CAC/B,CAAC;EAED,oBACEjD,KAAA;IAAK2D,SAAS,EAAC,cAAc;IAAAG,QAAA,gBAC3B9D,KAAA;MAAK2D,SAAS,EAAC,MAAM;MAACQ,GAAG,EAAE1C,WAAY;MAAAqC,QAAA,gBACrChE,IAAA;QAAO6D,SAAS,EAAC,MAAM;QAAAG,QAAA,EAAC;MAAK,CAAO,CAAC,eACrC9D,KAAA,CAACT,MAAM;QACLmE,IAAI,EAAC,QAAQ;QACbC,SAAS,EAAC,2BAA2B;QACrCE,KAAK,EAAE;UACLd,KAAK,EAAEnD,sBAAsB,CAAC;YAAEqB,IAAI,EAAEF;UAAU,CAAC,CAAC;UAClDG,UAAU,EAAEvB,2BAA2B,CAAC;YAAEsB,IAAI,EAAEF;UAAU,CAAC;QAC7D,CAAE;QACF6C,OAAO,EAAE5B,iBAAkB;QAAA8B,QAAA,GAE1BpE,oBAAoB,CAACqB,SAAS,CAAC,eAEhCjB,IAAA,CAACN,YAAY;UACX6B,OAAO,EAAEA,OAAQ;UACjB+C,OAAO,EAAE;YAAEC,WAAW,EAAEJ,iBAAiB,CAAC;UAAE,CAAE;UAC9CK,aAAa,EAAE;YAAEC,SAAS,EAAE;UAAe,CAAE;UAC7CC,eAAe,EAAC,qBAAqB;UACrCC,YAAY,EAAE1C,gBAAiB;UAC/B2C,SAAS,EAAE;YAAEC,QAAQ,EAAE;UAAS;QAAE,CACnC,CAAC;MAAA,CACI,CAAC;IAAA,CACN,CAAC,EAEL5D,SAAS,KAAKtB,eAAe,CAACiD,MAAM,iBACnC1C,KAAA;MAAK2D,SAAS,EAAC,MAAM;MAAAG,QAAA,gBACnBhE,IAAA;QAAO6D,SAAS,EAAC,MAAM;QAAAG,QAAA,EAAC;MAAU,CAAO,CAAC,eAC1ChE,IAAA;QACEmB,IAAI,EAAC,OAAO;QACZW,KAAK,EAAEV,UAAW;QAClByC,SAAS,EAAC,4BAA4B;QACtC7C,QAAQ,EAAEY;MAAuB,CAClC,CAAC;IAAA,CACC,CACN;EAAA,CACE,CAAC;AAEV;AAEA,eAAejB,WAAW","ignoreList":[]}
+{"version":3,"file":"StyleEditor.js","names":["React","useCallback","useEffect","useMemo","useRef","useState","FontAwesomeIcon","Log","ColorUtils","vsCheck","Button","DropdownMenu","FormatStyleType","getLabelForStyleType","getBackgroundForStyleConfig","getColorForStyleConfig","jsx","_jsx","jsxs","_jsxs","log","module","DEFAULT_BACKGROUND","DEFAULT_COLOR_LIGHT","DEFAULT_COLOR_DARK","DEFAULT_DROPDOWN_WIDTH","DEFAULT_CALLBACK","undefined","StyleEditor","props","_config$customConfig$","_config$customConfig","config","_props$onChange","onChange","_useState","type","_useState2","_slicedToArray","styleType","setStyleType","_useState3","customConfig","background","_useState4","setBackground","_useState5","_useState6","isShown","setShown","_useState7","_useState8","dropdownWidth","setDropdownWidth","csContainer","handleBackgroundChange","e","value","target","debug","handleMenuClosed","handleToggleClick","updateDropdownWidth","styleOptions","NO_FORMATTING","POSITIVE","NEGATIVE","WARN","NEUTRAL","ACCENT_1","ACCENT_2","CUSTOM","current","getBoundingClientRect","width","updateTheme","color","isDark","renderOptions","matchFound","optionArray","_loop","option","index","key","concat","push","kind","className","onClick","style","children","icon","length","renderMenuElement","role","ref","actions","menuElement","popperOptions","placement","popperClassName","onMenuClosed","menuStyle","maxWidth"],"sources":["../../../src/sidebar/conditional-formatting/StyleEditor.tsx"],"sourcesContent":["import React, {\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport Log from '@deephaven/log';\nimport { ColorUtils } from '@deephaven/utils';\nimport { vsCheck } from '@deephaven/icons';\nimport { Button, DropdownMenu } from '@deephaven/components';\nimport {\n  FormatStyleType,\n  getLabelForStyleType,\n  type FormatStyleConfig,\n  getBackgroundForStyleConfig,\n  getColorForStyleConfig,\n} from './ConditionalFormattingUtils';\n\nimport './StyleEditor.scss';\n\nconst log = Log.module('StyleEditor');\n\nconst DEFAULT_BACKGROUND = '#fcfcfa';\n\nconst DEFAULT_COLOR_LIGHT = '#f0f0ee';\n\nconst DEFAULT_COLOR_DARK = '#1a171a';\n\nconst DEFAULT_DROPDOWN_WIDTH = 200;\n\nexport interface ConditionEditorProps {\n  config: FormatStyleConfig;\n  onChange?: (config: FormatStyleConfig) => void;\n}\n\nconst DEFAULT_CALLBACK = (): void => undefined;\n\nfunction StyleEditor(props: ConditionEditorProps): JSX.Element {\n  const { config, onChange = DEFAULT_CALLBACK } = props;\n  const [styleType, setStyleType] = useState(config.type);\n  const [background, setBackground] = useState(\n    config.customConfig?.background ?? DEFAULT_BACKGROUND\n  );\n  const [isShown, setShown] = useState(false);\n  const [dropdownWidth, setDropdownWidth] = useState(DEFAULT_DROPDOWN_WIDTH);\n  const csContainer = useRef<HTMLDivElement>(null);\n\n  const handleBackgroundChange = useCallback(\n    (e: React.ChangeEvent<HTMLInputElement>) => {\n      const { value } = e.target;\n      log.debug('handleBackgroundChange', value);\n      setBackground(value);\n    },\n    []\n  );\n\n  const handleMenuClosed = useCallback(() => {\n    if (isShown) {\n      setShown(false);\n    }\n  }, [isShown]);\n\n  const handleToggleClick = useCallback(() => {\n    if (!isShown) {\n      updateDropdownWidth();\n    }\n    setShown(!isShown);\n  }, [isShown]);\n\n  const styleOptions = useMemo(\n    () => [\n      FormatStyleType.NO_FORMATTING,\n      FormatStyleType.POSITIVE,\n      FormatStyleType.NEGATIVE,\n      FormatStyleType.WARN,\n      FormatStyleType.NEUTRAL,\n      FormatStyleType.ACCENT_1,\n      FormatStyleType.ACCENT_2,\n      FormatStyleType.CUSTOM,\n    ],\n    []\n  );\n\n  function updateDropdownWidth(): void {\n    if (csContainer.current) {\n      setDropdownWidth(csContainer.current.getBoundingClientRect().width);\n    }\n  }\n\n  useEffect(\n    function updateTheme() {\n      onChange({\n        type: styleType,\n        customConfig: {\n          color: ColorUtils.isDark(background)\n            ? DEFAULT_COLOR_LIGHT\n            : DEFAULT_COLOR_DARK,\n          background,\n        },\n      });\n    },\n    [onChange, styleType, background]\n  );\n\n  const renderOptions = useCallback(() => {\n    let matchFound = false;\n    const optionArray: JSX.Element[] = [];\n    for (let index = 0; index < styleOptions.length; index += 1) {\n      const option = styleOptions[index];\n      const key = `option-${index}-${option}`;\n      matchFound = matchFound || option === styleType;\n      optionArray.push(\n        <Button\n          key={key}\n          kind=\"inline\"\n          className=\"style-option-btn\"\n          onClick={() => {\n            setStyleType(option);\n            setShown(false);\n          }}\n          style={{\n            color: getColorForStyleConfig({ type: option }),\n            background: getBackgroundForStyleConfig({ type: option }),\n          }}\n        >\n          {option === styleType && (\n            <FontAwesomeIcon icon={vsCheck} className=\"mr-2\" />\n          )}\n          {option !== styleType && <span className=\"mr-4\" />}\n          {getLabelForStyleType(option)}\n        </Button>\n      );\n    }\n    return optionArray;\n  }, [styleOptions, styleType]);\n\n  const renderMenuElement = useCallback(\n    () => (\n      <div\n        className=\"style-menu-container\"\n        role=\"presentation\"\n        style={{ width: dropdownWidth }}\n      >\n        <div className=\"style-options\">{renderOptions()}</div>\n      </div>\n    ),\n    [dropdownWidth, renderOptions]\n  );\n\n  return (\n    <div className=\"style-editor\">\n      <div className=\"mb-2\" ref={csContainer}>\n        <label className=\"mb-0\">Style</label>\n        <Button\n          kind=\"inline\"\n          className=\"cs-dropdown custom-select\"\n          style={{\n            color: getColorForStyleConfig({ type: styleType }),\n            background: getBackgroundForStyleConfig({ type: styleType }),\n          }}\n          onClick={handleToggleClick}\n        >\n          {getLabelForStyleType(styleType)}\n\n          <DropdownMenu\n            isShown={isShown}\n            actions={{ menuElement: renderMenuElement() }}\n            popperOptions={{ placement: 'bottom-start' }}\n            popperClassName=\"style-dropdown-menu\"\n            onMenuClosed={handleMenuClosed}\n            menuStyle={{ maxWidth: '100rem' }}\n          />\n        </Button>\n      </div>\n\n      {styleType === FormatStyleType.CUSTOM && (\n        <div className=\"mb-2\">\n          <label className=\"mb-0\">Background</label>\n          <input\n            type=\"color\"\n            value={background}\n            className=\"custom-select color-select\"\n            onChange={handleBackgroundChange}\n          />\n        </div>\n      )}\n    </div>\n  );\n}\n\nexport default StyleEditor;\n"],"mappings":"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","ignoreList":[]}

package/dist/sidebar/visibility-ordering-builder/SearchItem.js

@@ -10,13 +10,11 @@ import { vsGripper } from '@deephaven/icons';
 import { Tooltip } from '@deephaven/components';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 var SearchItem = /*#__PURE__*/forwardRef(function SearchItem(props, ref) {
-  var {
-    value,
-    item,
-    onClick,
-    onKeyDown,
-    handleProps
-  } = props;
+  var value = props.value,
+    item = props.item,
+    onClick = props.onClick,
+    onKeyDown = props.onKeyDown,
+    handleProps = props.handleProps;
   var handleClick = useCallback(event => {
     onClick(item, event);
   }, [onClick, item]);

package/dist/sidebar/visibility-ordering-builder/SearchItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"SearchItem.js","names":["React","forwardRef","memo","useCallback","classNames","FontAwesomeIcon","vsGripper","Tooltip","jsx","_jsx","jsxs","_jsxs","SearchItem","props","ref","value","item","onClick","onKeyDown","handleProps","handleClick","event","handleKeyDown","_objectSpread","className","isSelected","selected","onKeyDownCapture","index","children","title","icon","MemoizedSearchItem"],"sources":["../../../src/sidebar/visibility-ordering-builder/SearchItem.tsx"],"sourcesContent":["import React, { forwardRef, memo, useCallback } from 'react';\nimport classNames from 'classnames';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport { vsGripper } from '@deephaven/icons';\nimport { Tooltip } from '@deephaven/components';\nimport { type FlattenedIrisGridTreeItem } from './sortable-tree/utilities';\n\ntype SearchItemProps = {\n  value: string;\n  item: FlattenedIrisGridTreeItem;\n  onClick: (\n    item: FlattenedIrisGridTreeItem,\n    event: React.MouseEvent<HTMLElement>\n  ) => void;\n  onKeyDown: (\n    item: FlattenedIrisGridTreeItem,\n    event: React.KeyboardEvent<HTMLElement>\n  ) => void;\n  handleProps?: Record<string, unknown>;\n};\n\nconst SearchItem = forwardRef<HTMLDivElement, SearchItemProps>(\n  function SearchItem(props, ref) {\n    const { value, item, onClick, onKeyDown, handleProps } = props;\n\n    const handleClick = useCallback(\n      (event: React.MouseEvent<HTMLElement>) => {\n        onClick(item, event);\n      },\n      [onClick, item]\n    );\n\n    const handleKeyDown = useCallback(\n      (event: React.KeyboardEvent<HTMLElement>) => {\n        onKeyDown(item, event);\n      },\n      [onKeyDown, item]\n    );\n\n    return (\n      // eslint-disable-next-line jsx-a11y/no-static-element-interactions\n      <div\n        ref={ref}\n        className={classNames('tree-item', {\n          isSelected: item.selected,\n        })}\n        onClick={handleClick}\n        onKeyDownCapture={handleKeyDown}\n        data-index={item.index}\n        // eslint-disable-next-line react/jsx-props-no-spreading\n        {...handleProps}\n      >\n        <span title={value} className={classNames('column-name')}>\n          {value}\n        </span>\n        <div>\n          <Tooltip>Drag to re-order</Tooltip>\n          <FontAwesomeIcon icon={vsGripper} />\n        </div>\n      </div>\n    );\n  }\n);\n\nconst MemoizedSearchItem = memo(SearchItem);\n\nexport default MemoizedSearchItem;\n"],"mappings":";;;;;AAAA,OAAOA,KAAK,IAAIC,UAAU,EAAEC,IAAI,EAAEC,WAAW,QAAQ,OAAO;AAC5D,OAAOC,UAAU,MAAM,YAAY;AACnC,SAASC,eAAe,QAAQ,gCAAgC;AAChE,SAASC,SAAS,QAAQ,kBAAkB;AAC5C,SAASC,OAAO,QAAQ,uBAAuB;AAAC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAiBhD,IAAMC,UAAU,gBAAGX,UAAU,CAC3B,SAASW,UAAUA,CAACC,KAAK,EAAEC,GAAG,EAAE;EAC9B,IAAM;IAAEC,KAAK;IAAEC,IAAI;IAAEC,OAAO;IAAEC,SAAS;IAAEC;EAAY,CAAC,GAAGN,KAAK;EAE9D,IAAMO,WAAW,GAAGjB,WAAW,CAC5BkB,KAAoC,IAAK;IACxCJ,OAAO,CAACD,IAAI,EAAEK,KAAK,CAAC;EACtB,CAAC,EACD,CAACJ,OAAO,EAAED,IAAI,CAChB,CAAC;EAED,IAAMM,aAAa,GAAGnB,WAAW,CAC9BkB,KAAuC,IAAK;IAC3CH,SAAS,CAACF,IAAI,EAAEK,KAAK,CAAC;EACxB,CAAC,EACD,CAACH,SAAS,EAAEF,IAAI,CAClB,CAAC;EAED;IAAA;IACE;IACAL,KAAA,QAAAY,aAAA,CAAAA,aAAA;MACET,GAAG,EAAEA,GAAI;MACTU,SAAS,EAAEpB,UAAU,CAAC,WAAW,EAAE;QACjCqB,UAAU,EAAET,IAAI,CAACU;MACnB,CAAC,CAAE;MACHT,OAAO,EAAEG,WAAY;MACrBO,gBAAgB,EAAEL,aAAc;MAChC,cAAYN,IAAI,CAACY;MACjB;IAAA,GACIT,WAAW;MAAAU,QAAA,gBAEfpB,IAAA;QAAMqB,KAAK,EAAEf,KAAM;QAACS,SAAS,EAAEpB,UAAU,CAAC,aAAa,CAAE;QAAAyB,QAAA,EACtDd;MAAK,CACF,CAAC,eACPJ,KAAA;QAAAkB,QAAA,gBACEpB,IAAA,CAACF,OAAO;UAAAsB,QAAA,EAAC;QAAgB,CAAS,CAAC,eACnCpB,IAAA,CAACJ,eAAe;UAAC0B,IAAI,EAAEzB;QAAU,CAAE,CAAC;MAAA,CACjC,CAAC;IAAA,EACH;EAAC;AAEV,CACF,CAAC;AAED,IAAM0B,kBAAkB,gBAAG9B,IAAI,CAACU,UAAU,CAAC;AAE3C,eAAeoB,kBAAkB","ignoreList":[]}
+{"version":3,"file":"SearchItem.js","names":["React","forwardRef","memo","useCallback","classNames","FontAwesomeIcon","vsGripper","Tooltip","jsx","_jsx","jsxs","_jsxs","SearchItem","props","ref","value","item","onClick","onKeyDown","handleProps","handleClick","event","handleKeyDown","_objectSpread","className","isSelected","selected","onKeyDownCapture","index","children","title","icon","MemoizedSearchItem"],"sources":["../../../src/sidebar/visibility-ordering-builder/SearchItem.tsx"],"sourcesContent":["import React, { forwardRef, memo, useCallback } from 'react';\nimport classNames from 'classnames';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport { vsGripper } from '@deephaven/icons';\nimport { Tooltip } from '@deephaven/components';\nimport { type FlattenedIrisGridTreeItem } from './sortable-tree/utilities';\n\ntype SearchItemProps = {\n  value: string;\n  item: FlattenedIrisGridTreeItem;\n  onClick: (\n    item: FlattenedIrisGridTreeItem,\n    event: React.MouseEvent<HTMLElement>\n  ) => void;\n  onKeyDown: (\n    item: FlattenedIrisGridTreeItem,\n    event: React.KeyboardEvent<HTMLElement>\n  ) => void;\n  handleProps?: Record<string, unknown>;\n};\n\nconst SearchItem = forwardRef<HTMLDivElement, SearchItemProps>(\n  function SearchItem(props, ref) {\n    const { value, item, onClick, onKeyDown, handleProps } = props;\n\n    const handleClick = useCallback(\n      (event: React.MouseEvent<HTMLElement>) => {\n        onClick(item, event);\n      },\n      [onClick, item]\n    );\n\n    const handleKeyDown = useCallback(\n      (event: React.KeyboardEvent<HTMLElement>) => {\n        onKeyDown(item, event);\n      },\n      [onKeyDown, item]\n    );\n\n    return (\n      // eslint-disable-next-line jsx-a11y/no-static-element-interactions\n      <div\n        ref={ref}\n        className={classNames('tree-item', {\n          isSelected: item.selected,\n        })}\n        onClick={handleClick}\n        onKeyDownCapture={handleKeyDown}\n        data-index={item.index}\n        // eslint-disable-next-line react/jsx-props-no-spreading\n        {...handleProps}\n      >\n        <span title={value} className={classNames('column-name')}>\n          {value}\n        </span>\n        <div>\n          <Tooltip>Drag to re-order</Tooltip>\n          <FontAwesomeIcon icon={vsGripper} />\n        </div>\n      </div>\n    );\n  }\n);\n\nconst MemoizedSearchItem = memo(SearchItem);\n\nexport default MemoizedSearchItem;\n"],"mappings":";;;;;AAAA,OAAOA,KAAK,IAAIC,UAAU,EAAEC,IAAI,EAAEC,WAAW,QAAQ,OAAO;AAC5D,OAAOC,UAAU,MAAM,YAAY;AACnC,SAASC,eAAe,QAAQ,gCAAgC;AAChE,SAASC,SAAS,QAAQ,kBAAkB;AAC5C,SAASC,OAAO,QAAQ,uBAAuB;AAAC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAiBhD,IAAMC,UAAU,gBAAGX,UAAU,CAC3B,SAASW,UAAUA,CAACC,KAAK,EAAEC,GAAG,EAAE;EAC9B,IAAQC,KAAK,GAA4CF,KAAK,CAAtDE,KAAK;IAAEC,IAAI,GAAsCH,KAAK,CAA/CG,IAAI;IAAEC,OAAO,GAA6BJ,KAAK,CAAzCI,OAAO;IAAEC,SAAS,GAAkBL,KAAK,CAAhCK,SAAS;IAAEC,WAAW,GAAKN,KAAK,CAArBM,WAAW;EAEpD,IAAMC,WAAW,GAAGjB,WAAW,CAC5BkB,KAAoC,IAAK;IACxCJ,OAAO,CAACD,IAAI,EAAEK,KAAK,CAAC;EACtB,CAAC,EACD,CAACJ,OAAO,EAAED,IAAI,CAChB,CAAC;EAED,IAAMM,aAAa,GAAGnB,WAAW,CAC9BkB,KAAuC,IAAK;IAC3CH,SAAS,CAACF,IAAI,EAAEK,KAAK,CAAC;EACxB,CAAC,EACD,CAACH,SAAS,EAAEF,IAAI,CAClB,CAAC;EAED;IAAA;IACE;IACAL,KAAA,QAAAY,aAAA,CAAAA,aAAA;MACET,GAAG,EAAEA,GAAI;MACTU,SAAS,EAAEpB,UAAU,CAAC,WAAW,EAAE;QACjCqB,UAAU,EAAET,IAAI,CAACU;MACnB,CAAC,CAAE;MACHT,OAAO,EAAEG,WAAY;MACrBO,gBAAgB,EAAEL,aAAc;MAChC,cAAYN,IAAI,CAACY;MACjB;IAAA,GACIT,WAAW;MAAAU,QAAA,gBAEfpB,IAAA;QAAMqB,KAAK,EAAEf,KAAM;QAACS,SAAS,EAAEpB,UAAU,CAAC,aAAa,CAAE;QAAAyB,QAAA,EACtDd;MAAK,CACF,CAAC,eACPJ,KAAA;QAAAkB,QAAA,gBACEpB,IAAA,CAACF,OAAO;UAAAsB,QAAA,EAAC;QAAgB,CAAS,CAAC,eACnCpB,IAAA,CAACJ,eAAe;UAAC0B,IAAI,EAAEzB;QAAU,CAAE,CAAC;MAAA,CACjC,CAAC;IAAA,EACH;EAAC;AAEV,CACF,CAAC;AAED,IAAM0B,kBAAkB,gBAAG9B,IAAI,CAACU,UAAU,CAAC;AAE3C,eAAeoB,kBAAkB","ignoreList":[]}

package/dist/sidebar/visibility-ordering-builder/SearchWithModal.js

@@ -1,3 +1,9 @@
+function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
+function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
+function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
+function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
 import React, { useCallback, useMemo, useRef, useState } from 'react';
 import { useDndMonitor } from '@dnd-kit/core';
 import { GridUtils } from '@deephaven/grid';
@@ -9,15 +15,19 @@ import MemoizedSearchItem from "./SearchItem.js";
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 export function SearchWithModal(_ref) {
   var _searchRef$current3, _searchRef$current4;
-  var {
-    items,
-    onModalOpenChange,
-    onClick,
-    onDragStart,
-    setSelection
-  } = _ref;
-  var [searchValue, setSearchValue] = useState('');
-  var [isModalOpen, setIsModalOpen] = useState(false);
+  var items = _ref.items,
+    onModalOpenChange = _ref.onModalOpenChange,
+    onClick = _ref.onClick,
+    onDragStart = _ref.onDragStart,
+    setSelection = _ref.setSelection;
+  var _useState = useState(''),
+    _useState2 = _slicedToArray(_useState, 2),
+    searchValue = _useState2[0],
+    setSearchValue = _useState2[1];
+  var _useState3 = useState(false),
+    _useState4 = _slicedToArray(_useState3, 2),
+    isModalOpen = _useState4[0],
+    setIsModalOpen = _useState4[1];
   var searchRef = useRef(null);
   var popperRef = useRef(null);
   var handleModalOpen = useCallback(() => {
@@ -66,9 +76,7 @@ export function SearchWithModal(_ref) {
     }
   }, [onClick, handleModalClose]);
   var handleItemKeyDown = useCallback((item, event) => {
-    var {
-      key
-    } = event;
+    var key = event.key;
     if (key === 'Enter') {
       // Select item and close modal
       event.preventDefault();
@@ -105,12 +113,10 @@ export function SearchWithModal(_ref) {
     }
   }, [setSelection, handleModalClose]);
   var renderItem = useCallback(_ref2 => {
-    var {
-      value,
-      item,
-      ref,
-      handleProps
-    } = _ref2;
+    var value = _ref2.value,
+      item = _ref2.item,
+      ref = _ref2.ref,
+      handleProps = _ref2.handleProps;
     return /*#__PURE__*/_jsx(MemoizedSearchItem, {
       ref: ref,
       value: value,

package/dist/sidebar/visibility-ordering-builder/SearchWithModal.js.map

@@ -1 +1 @@
-{"version":3,"file":"SearchWithModal.js","names":["React","useCallback","useMemo","useRef","useState","useDndMonitor","GridUtils","ActionButton","Popper","SearchField","useResizeObserver","SortableTree","MemoizedSearchItem","jsx","_jsx","jsxs","_jsxs","Fragment","_Fragment","SearchWithModal","_ref","_searchRef$current3","_searchRef$current4","items","onModalOpenChange","onClick","onDragStart","setSelection","searchValue","setSearchValue","isModalOpen","setIsModalOpen","searchRef","popperRef","handleModalOpen","handleModalClose","handleInputChange","value","handleInputBlur","e","current","element","contains","relatedTarget","handleModalBlur","_searchRef$current","searchElement","getInputElement","handleDragStart","event","undefined","handleClick","item","shiftKey","isModifierKeyDown","handleItemKeyDown","key","preventDefault","stopPropagation","_event$currentTarget$","nextElement","currentTarget","parentElement","nextElementSibling","querySelector","scrollIntoView","block","focus","_event$currentTarget$2","prevElement","previousElementSibling","_searchRef$current2","renderItem","_ref2","ref","handleProps","onKeyDown","id","closest","_popperRef$current","scheduleUpdate","filteredItems","lowerSearch","toLowerCase","filter","includes","handleSearchKeyDown","length","firstItem","_popperRef$current2","handleSelectMatching","hasMultipleSelection","foundOne","some","selected","hasMultipleMatches","showFooterButtons","children","onChange","onFocus","onBlur","isShown","interactive","keepInParent","onExited","options","placement","modifiers","preventOverflow","priority","flip","enabled","referenceObject","className","withDepthMarkers","isQuiet","onPress"],"sources":["../../../src/sidebar/visibility-ordering-builder/SearchWithModal.tsx"],"sourcesContent":["import React, { useCallback, useMemo, useRef, useState } from 'react';\nimport { type DragStartEvent, useDndMonitor } from '@dnd-kit/core';\nimport type { TextFieldRef } from '@react-types/textfield';\nimport { GridUtils } from '@deephaven/grid';\nimport { ActionButton, Popper, SearchField } from '@deephaven/components';\nimport { useResizeObserver } from '@deephaven/react-hooks';\nimport SortableTree from './sortable-tree/SortableTree';\nimport { type TreeItemRenderFnProps } from './sortable-tree/TreeItem';\nimport type {\n  IrisGridTreeItemData,\n  FlattenedIrisGridTreeItem,\n} from './sortable-tree/utilities';\nimport './SearchWithModal.scss';\nimport MemoizedSearchItem from './SearchItem';\n\ninterface SearchWithModalProps {\n  items: readonly FlattenedIrisGridTreeItem[];\n  onModalOpenChange: (isOpen: boolean) => void;\n  onClick: (\n    item: FlattenedIrisGridTreeItem,\n    event: React.MouseEvent<HTMLElement>\n  ) => void;\n  onDragStart?: (event: DragStartEvent) => void;\n  setSelection: (items: readonly FlattenedIrisGridTreeItem[]) => void;\n}\n\nexport function SearchWithModal({\n  items,\n  onModalOpenChange,\n  onClick,\n  onDragStart,\n  setSelection,\n}: SearchWithModalProps): JSX.Element {\n  const [searchValue, setSearchValue] = useState('');\n  const [isModalOpen, setIsModalOpen] = useState(false);\n  const searchRef = useRef<TextFieldRef>(null);\n  const popperRef = useRef<Popper>(null);\n\n  const handleModalOpen = useCallback(() => {\n    if (isModalOpen) {\n      return;\n    }\n    setIsModalOpen(true);\n    onModalOpenChange(true);\n  }, [onModalOpenChange, isModalOpen]);\n\n  const handleModalClose = useCallback(() => {\n    if (!isModalOpen) {\n      return;\n    }\n    setIsModalOpen(false);\n    onModalOpenChange(false);\n  }, [onModalOpenChange, isModalOpen]);\n\n  const handleInputChange = useCallback(\n    (value: string) => {\n      // Open in case the user hit escape to close the modal then started typing\n      // without blurring the input\n      handleModalOpen();\n      setSearchValue(value);\n    },\n    [handleModalOpen]\n  );\n\n  const handleInputBlur = useCallback(\n    (e: React.FocusEvent<HTMLInputElement>) => {\n      if (\n        !popperRef.current ||\n        !popperRef.current.element.contains(e.relatedTarget as Node)\n      ) {\n        handleModalClose();\n      }\n    },\n    [handleModalClose]\n  );\n\n  const handleModalBlur = useCallback(\n    (e: React.FocusEvent) => {\n      const searchElement = searchRef.current?.getInputElement();\n      if (!searchElement || !searchElement.contains(e.relatedTarget as Node)) {\n        handleModalClose();\n      }\n    },\n    [handleModalClose]\n  );\n\n  const handleDragStart = useCallback(\n    (event: DragStartEvent) => {\n      onDragStart?.(event);\n      handleModalClose();\n    },\n    [onDragStart, handleModalClose]\n  );\n\n  useDndMonitor({\n    onDragStart: isModalOpen ? handleDragStart : undefined,\n  });\n\n  const handleClick = useCallback(\n    (item: FlattenedIrisGridTreeItem, event: React.MouseEvent<HTMLElement>) => {\n      onClick(item, event);\n      if (!event.shiftKey && !GridUtils.isModifierKeyDown(event)) {\n        handleModalClose();\n      }\n    },\n    [onClick, handleModalClose]\n  );\n\n  const handleItemKeyDown = useCallback(\n    (\n      item: FlattenedIrisGridTreeItem,\n      event: React.KeyboardEvent<HTMLElement>\n    ) => {\n      const { key } = event;\n      if (key === 'Enter') {\n        // Select item and close modal\n        event.preventDefault();\n        event.stopPropagation();\n        setSelection([item]);\n        handleModalClose();\n      } else if (key === 'ArrowDown') {\n        // Move focus to the next item\n        event.preventDefault();\n        event.stopPropagation();\n        const nextElement = (\n          event.currentTarget.parentElement as HTMLElement | null\n        )?.nextElementSibling // The parent item-wrapper elements are siblings, not the tree-items\n          ?.querySelector('.tree-item[tabindex=\"0\"]') as HTMLElement | null;\n        nextElement?.scrollIntoView({ block: 'nearest' });\n        nextElement?.focus();\n      } else if (key === 'ArrowUp') {\n        // Move focus to the previous item\n        event.preventDefault();\n        event.stopPropagation();\n        const prevElement = (\n          event.currentTarget.parentElement as HTMLElement | null\n        )?.previousElementSibling // The parent item-wrapper elements are siblings, not the tree-items\n          ?.querySelector('.tree-item[tabindex=\"0\"]') as HTMLElement | null;\n        if (prevElement) {\n          prevElement.scrollIntoView({ block: 'nearest' });\n          prevElement.focus();\n        } else {\n          searchRef.current?.getInputElement()?.focus();\n        }\n      }\n    },\n    [setSelection, handleModalClose]\n  );\n\n  const renderItem = useCallback(\n    ({\n      value,\n      item,\n      ref,\n      handleProps,\n    }: TreeItemRenderFnProps<IrisGridTreeItemData>): JSX.Element => (\n      <MemoizedSearchItem\n        key={item.id}\n        ref={ref}\n        value={value}\n        item={item}\n        onClick={handleClick}\n        onKeyDown={handleItemKeyDown}\n        handleProps={handleProps}\n      />\n    ),\n    [handleClick, handleItemKeyDown]\n  );\n\n  // Detect if the user resizes the panel height while the popper is open\n  useResizeObserver(\n    searchRef.current\n      ?.getInputElement()\n      ?.closest('.visibility-ordering-builder'),\n    () => {\n      popperRef.current?.scheduleUpdate();\n    }\n  );\n\n  const filteredItems = useMemo(() => {\n    if (searchValue === '') {\n      return items;\n    }\n    const lowerSearch = searchValue.toLowerCase();\n    return items.filter(item => item.id.toLowerCase().includes(lowerSearch));\n  }, [items, searchValue]);\n\n  const handleSearchKeyDown = useCallback(\n    // Close on escape with empty search.\n    // If there is a search value, let the input handle the escape to clear the search.\n    (e: React.KeyboardEvent) => {\n      if (e.key === 'Escape' && searchValue === '') {\n        handleModalClose();\n      }\n\n      if (e.key === 'Enter' && filteredItems.length > 0) {\n        e.preventDefault();\n        // Select the first item in the list\n        const firstItem = filteredItems[0];\n        setSelection([firstItem]);\n        handleModalClose();\n      }\n\n      if (e.key === 'ArrowDown' && filteredItems.length > 0) {\n        e.preventDefault();\n        // Focus the first item in the list\n        const item = popperRef.current?.element.querySelector(\n          '.tree-item[tabindex=\"0\"]'\n        ) as HTMLElement | null;\n        item?.focus();\n      }\n    },\n    [setSelection, filteredItems, handleModalClose, searchValue]\n  );\n\n  const handleSelectMatching = useCallback(() => {\n    setSelection(filteredItems);\n    handleModalClose();\n  }, [filteredItems, setSelection, handleModalClose]);\n\n  const hasMultipleSelection = useMemo(() => {\n    let foundOne = false;\n    return filteredItems.some(item => {\n      if (item.selected) {\n        if (foundOne) {\n          return true;\n        }\n        foundOne = true;\n      }\n      return false;\n    });\n  }, [filteredItems]);\n\n  const hasMultipleMatches = searchValue !== '' && filteredItems.length > 1;\n  const showFooterButtons = hasMultipleSelection || hasMultipleMatches;\n\n  return (\n    <>\n      <SearchField\n        aria-label=\"Search columns\"\n        ref={searchRef}\n        value={searchValue}\n        onChange={handleInputChange}\n        onFocus={handleModalOpen}\n        onBlur={handleInputBlur}\n        onKeyDown={handleSearchKeyDown}\n      />\n      <Popper\n        ref={popperRef}\n        isShown={isModalOpen}\n        interactive\n        keepInParent\n        onBlur={handleModalBlur}\n        onExited={handleModalClose} // May exit due to escape which does not trigger blur\n        options={{\n          placement: 'bottom-end',\n          modifiers: {\n            preventOverflow: {\n              priority: ['top'],\n            },\n            flip: {\n              enabled: false,\n            },\n          },\n        }}\n        referenceObject={searchRef.current?.getInputElement()}\n        className=\"visibility-search-list\"\n      >\n        <div className=\"visibility-search-list-inner\">\n          {filteredItems.length === 0 ? (\n            <div className=\"no-results\">No matching columns</div>\n          ) : (\n            <>\n              <div className=\"search-tree-container\">\n                <SortableTree\n                  items={filteredItems}\n                  withDepthMarkers={false}\n                  renderItem={renderItem}\n                />\n              </div>\n              {showFooterButtons && (\n                <div className=\"footer-buttons\">\n                  {hasMultipleSelection && (\n                    <ActionButton isQuiet onPress={handleModalClose}>\n                      Select Group\n                    </ActionButton>\n                  )}\n                  {hasMultipleMatches && (\n                    <ActionButton isQuiet onPress={handleSelectMatching}>\n                      Select Matching\n                    </ActionButton>\n                  )}\n                </div>\n              )}\n            </>\n          )}\n        </div>\n      </Popper>\n    </>\n  );\n}\n\nexport default SearchWithModal;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"SearchWithModal.js","names":["React","useCallback","useMemo","useRef","useState","useDndMonitor","GridUtils","ActionButton","Popper","SearchField","useResizeObserver","SortableTree","MemoizedSearchItem","jsx","_jsx","jsxs","_jsxs","Fragment","_Fragment","SearchWithModal","_ref","_searchRef$current3","_searchRef$current4","items","onModalOpenChange","onClick","onDragStart","setSelection","_useState","_useState2","_slicedToArray","searchValue","setSearchValue","_useState3","_useState4","isModalOpen","setIsModalOpen","searchRef","popperRef","handleModalOpen","handleModalClose","handleInputChange","value","handleInputBlur","e","current","element","contains","relatedTarget","handleModalBlur","_searchRef$current","searchElement","getInputElement","handleDragStart","event","undefined","handleClick","item","shiftKey","isModifierKeyDown","handleItemKeyDown","key","preventDefault","stopPropagation","_event$currentTarget$","nextElement","currentTarget","parentElement","nextElementSibling","querySelector","scrollIntoView","block","focus","_event$currentTarget$2","prevElement","previousElementSibling","_searchRef$current2","renderItem","_ref2","ref","handleProps","onKeyDown","id","closest","_popperRef$current","scheduleUpdate","filteredItems","lowerSearch","toLowerCase","filter","includes","handleSearchKeyDown","length","firstItem","_popperRef$current2","handleSelectMatching","hasMultipleSelection","foundOne","some","selected","hasMultipleMatches","showFooterButtons","children","onChange","onFocus","onBlur","isShown","interactive","keepInParent","onExited","options","placement","modifiers","preventOverflow","priority","flip","enabled","referenceObject","className","withDepthMarkers","isQuiet","onPress"],"sources":["../../../src/sidebar/visibility-ordering-builder/SearchWithModal.tsx"],"sourcesContent":["import React, { useCallback, useMemo, useRef, useState } from 'react';\nimport { type DragStartEvent, useDndMonitor } from '@dnd-kit/core';\nimport type { TextFieldRef } from '@react-types/textfield';\nimport { GridUtils } from '@deephaven/grid';\nimport { ActionButton, Popper, SearchField } from '@deephaven/components';\nimport { useResizeObserver } from '@deephaven/react-hooks';\nimport SortableTree from './sortable-tree/SortableTree';\nimport { type TreeItemRenderFnProps } from './sortable-tree/TreeItem';\nimport type {\n  IrisGridTreeItemData,\n  FlattenedIrisGridTreeItem,\n} from './sortable-tree/utilities';\nimport './SearchWithModal.scss';\nimport MemoizedSearchItem from './SearchItem';\n\ninterface SearchWithModalProps {\n  items: readonly FlattenedIrisGridTreeItem[];\n  onModalOpenChange: (isOpen: boolean) => void;\n  onClick: (\n    item: FlattenedIrisGridTreeItem,\n    event: React.MouseEvent<HTMLElement>\n  ) => void;\n  onDragStart?: (event: DragStartEvent) => void;\n  setSelection: (items: readonly FlattenedIrisGridTreeItem[]) => void;\n}\n\nexport function SearchWithModal({\n  items,\n  onModalOpenChange,\n  onClick,\n  onDragStart,\n  setSelection,\n}: SearchWithModalProps): JSX.Element {\n  const [searchValue, setSearchValue] = useState('');\n  const [isModalOpen, setIsModalOpen] = useState(false);\n  const searchRef = useRef<TextFieldRef>(null);\n  const popperRef = useRef<Popper>(null);\n\n  const handleModalOpen = useCallback(() => {\n    if (isModalOpen) {\n      return;\n    }\n    setIsModalOpen(true);\n    onModalOpenChange(true);\n  }, [onModalOpenChange, isModalOpen]);\n\n  const handleModalClose = useCallback(() => {\n    if (!isModalOpen) {\n      return;\n    }\n    setIsModalOpen(false);\n    onModalOpenChange(false);\n  }, [onModalOpenChange, isModalOpen]);\n\n  const handleInputChange = useCallback(\n    (value: string) => {\n      // Open in case the user hit escape to close the modal then started typing\n      // without blurring the input\n      handleModalOpen();\n      setSearchValue(value);\n    },\n    [handleModalOpen]\n  );\n\n  const handleInputBlur = useCallback(\n    (e: React.FocusEvent<HTMLInputElement>) => {\n      if (\n        !popperRef.current ||\n        !popperRef.current.element.contains(e.relatedTarget as Node)\n      ) {\n        handleModalClose();\n      }\n    },\n    [handleModalClose]\n  );\n\n  const handleModalBlur = useCallback(\n    (e: React.FocusEvent) => {\n      const searchElement = searchRef.current?.getInputElement();\n      if (!searchElement || !searchElement.contains(e.relatedTarget as Node)) {\n        handleModalClose();\n      }\n    },\n    [handleModalClose]\n  );\n\n  const handleDragStart = useCallback(\n    (event: DragStartEvent) => {\n      onDragStart?.(event);\n      handleModalClose();\n    },\n    [onDragStart, handleModalClose]\n  );\n\n  useDndMonitor({\n    onDragStart: isModalOpen ? handleDragStart : undefined,\n  });\n\n  const handleClick = useCallback(\n    (item: FlattenedIrisGridTreeItem, event: React.MouseEvent<HTMLElement>) => {\n      onClick(item, event);\n      if (!event.shiftKey && !GridUtils.isModifierKeyDown(event)) {\n        handleModalClose();\n      }\n    },\n    [onClick, handleModalClose]\n  );\n\n  const handleItemKeyDown = useCallback(\n    (\n      item: FlattenedIrisGridTreeItem,\n      event: React.KeyboardEvent<HTMLElement>\n    ) => {\n      const { key } = event;\n      if (key === 'Enter') {\n        // Select item and close modal\n        event.preventDefault();\n        event.stopPropagation();\n        setSelection([item]);\n        handleModalClose();\n      } else if (key === 'ArrowDown') {\n        // Move focus to the next item\n        event.preventDefault();\n        event.stopPropagation();\n        const nextElement = (\n          event.currentTarget.parentElement as HTMLElement | null\n        )?.nextElementSibling // The parent item-wrapper elements are siblings, not the tree-items\n          ?.querySelector('.tree-item[tabindex=\"0\"]') as HTMLElement | null;\n        nextElement?.scrollIntoView({ block: 'nearest' });\n        nextElement?.focus();\n      } else if (key === 'ArrowUp') {\n        // Move focus to the previous item\n        event.preventDefault();\n        event.stopPropagation();\n        const prevElement = (\n          event.currentTarget.parentElement as HTMLElement | null\n        )?.previousElementSibling // The parent item-wrapper elements are siblings, not the tree-items\n          ?.querySelector('.tree-item[tabindex=\"0\"]') as HTMLElement | null;\n        if (prevElement) {\n          prevElement.scrollIntoView({ block: 'nearest' });\n          prevElement.focus();\n        } else {\n          searchRef.current?.getInputElement()?.focus();\n        }\n      }\n    },\n    [setSelection, handleModalClose]\n  );\n\n  const renderItem = useCallback(\n    ({\n      value,\n      item,\n      ref,\n      handleProps,\n    }: TreeItemRenderFnProps<IrisGridTreeItemData>): JSX.Element => (\n      <MemoizedSearchItem\n        key={item.id}\n        ref={ref}\n        value={value}\n        item={item}\n        onClick={handleClick}\n        onKeyDown={handleItemKeyDown}\n        handleProps={handleProps}\n      />\n    ),\n    [handleClick, handleItemKeyDown]\n  );\n\n  // Detect if the user resizes the panel height while the popper is open\n  useResizeObserver(\n    searchRef.current\n      ?.getInputElement()\n      ?.closest('.visibility-ordering-builder'),\n    () => {\n      popperRef.current?.scheduleUpdate();\n    }\n  );\n\n  const filteredItems = useMemo(() => {\n    if (searchValue === '') {\n      return items;\n    }\n    const lowerSearch = searchValue.toLowerCase();\n    return items.filter(item => item.id.toLowerCase().includes(lowerSearch));\n  }, [items, searchValue]);\n\n  const handleSearchKeyDown = useCallback(\n    // Close on escape with empty search.\n    // If there is a search value, let the input handle the escape to clear the search.\n    (e: React.KeyboardEvent) => {\n      if (e.key === 'Escape' && searchValue === '') {\n        handleModalClose();\n      }\n\n      if (e.key === 'Enter' && filteredItems.length > 0) {\n        e.preventDefault();\n        // Select the first item in the list\n        const firstItem = filteredItems[0];\n        setSelection([firstItem]);\n        handleModalClose();\n      }\n\n      if (e.key === 'ArrowDown' && filteredItems.length > 0) {\n        e.preventDefault();\n        // Focus the first item in the list\n        const item = popperRef.current?.element.querySelector(\n          '.tree-item[tabindex=\"0\"]'\n        ) as HTMLElement | null;\n        item?.focus();\n      }\n    },\n    [setSelection, filteredItems, handleModalClose, searchValue]\n  );\n\n  const handleSelectMatching = useCallback(() => {\n    setSelection(filteredItems);\n    handleModalClose();\n  }, [filteredItems, setSelection, handleModalClose]);\n\n  const hasMultipleSelection = useMemo(() => {\n    let foundOne = false;\n    return filteredItems.some(item => {\n      if (item.selected) {\n        if (foundOne) {\n          return true;\n        }\n        foundOne = true;\n      }\n      return false;\n    });\n  }, [filteredItems]);\n\n  const hasMultipleMatches = searchValue !== '' && filteredItems.length > 1;\n  const showFooterButtons = hasMultipleSelection || hasMultipleMatches;\n\n  return (\n    <>\n      <SearchField\n        aria-label=\"Search columns\"\n        ref={searchRef}\n        value={searchValue}\n        onChange={handleInputChange}\n        onFocus={handleModalOpen}\n        onBlur={handleInputBlur}\n        onKeyDown={handleSearchKeyDown}\n      />\n      <Popper\n        ref={popperRef}\n        isShown={isModalOpen}\n        interactive\n        keepInParent\n        onBlur={handleModalBlur}\n        onExited={handleModalClose} // May exit due to escape which does not trigger blur\n        options={{\n          placement: 'bottom-end',\n          modifiers: {\n            preventOverflow: {\n              priority: ['top'],\n            },\n            flip: {\n              enabled: false,\n            },\n          },\n        }}\n        referenceObject={searchRef.current?.getInputElement()}\n        className=\"visibility-search-list\"\n      >\n        <div className=\"visibility-search-list-inner\">\n          {filteredItems.length === 0 ? (\n            <div className=\"no-results\">No matching columns</div>\n          ) : (\n            <>\n              <div className=\"search-tree-container\">\n                <SortableTree\n                  items={filteredItems}\n                  withDepthMarkers={false}\n                  renderItem={renderItem}\n                />\n              </div>\n              {showFooterButtons && (\n                <div className=\"footer-buttons\">\n                  {hasMultipleSelection && (\n                    <ActionButton isQuiet onPress={handleModalClose}>\n                      Select Group\n                    </ActionButton>\n                  )}\n                  {hasMultipleMatches && (\n                    <ActionButton isQuiet onPress={handleSelectMatching}>\n                      Select Matching\n                    </ActionButton>\n                  )}\n                </div>\n              )}\n            </>\n          )}\n        </div>\n      </Popper>\n    </>\n  );\n}\n\nexport default SearchWithModal;\n"],"mappings":"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","ignoreList":[]}