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

package/dist/sidebar/CustomColumnBuilder.js.map

@@ -1 +1 @@
-{"version":3,"file":"CustomColumnBuilder.js","names":["React","Component","classNames","shortid","memoize","DragDropContext","Droppable","FontAwesomeIcon","Button","DragUtils","LoadingSpinner","dhNewCircleLargeFilled","vsWarning","vsPass","DbNameValidator","CustomColumnInput","IrisGridModel","CustomColumnBuilder","makeCustomColumnInputEventKey","generate","createCustomColumnInput","eventKey","name","formula","constructor","props","inputs","key","find","input","findIndex","handleAddColumnClick","bind","handleSaveClick","handleInputChange","handleDeleteColumn","handleCustomColumnUpdated","handleRequestFailed","handleDragEnd","resetRequestFailed","handleEditorTabNavigation","state","isCustomColumnApplying","errorMessage","hasRequestFailed","isSuccessShowing","container","successButtonTimer","componentDidMount","customColumns","parseCustomColumns","startListening","componentWillUnmount","stopListening","clearTimeout","resetErrorMessage","setState","model","addEventListener","EVENT","COLUMNS_CHANGED","UPDATED","REQUEST_FAILED","removeEventListener","length","customColumnInputs","map","customColumn","split","newInputs","push","customColumnIndex","getInputIndex","splice","type","value","customColumnInput","getInput","newCustomInput","setTimeout","SUCCESS_SHOW_DURATION","event","customEvent","detail","JSON","stringify","configuration","result","stopDragging","destination","sourceIndex","source","index","destinationIndex","sourceInput","focusEditorIndex","shiftKey","querySelectorAll","focus","querySelector","nextFocusIndex","onSave","originalCustomColumns","forEach","renderInputs","nameCount","Map","set","get","isDuplicate","renderSaveButton","saveText","areNamesValid","every","isValidColumnName","filteredNames","filter","areNamesUnique","Set","size","render","onCancel","startDragging","provided","snapshot","innerRef","droppableProps","dragging","draggingFromThisWith","placeholder"],"sources":["../../src/sidebar/CustomColumnBuilder.tsx"],"sourcesContent":["import React, { Component, ReactElement } from 'react';\nimport classNames from 'classnames';\nimport shortid from 'shortid';\nimport memoize from 'memoize-one';\nimport { DragDropContext, Droppable, DropResult } from 'react-beautiful-dnd';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport { Button, DragUtils, LoadingSpinner } from '@deephaven/components';\nimport { dhNewCircleLargeFilled, vsWarning, vsPass } from '@deephaven/icons';\nimport { DbNameValidator } from '@deephaven/utils';\nimport CustomColumnInput from './CustomColumnInput';\nimport './CustomColumnBuilder.scss';\nimport IrisGridModel from '../IrisGridModel';\n\nexport type CustomColumnKey = 'eventKey' | 'name' | 'formula';\n\ntype Input = {\n  eventKey: string;\n  name: string;\n  formula: string;\n};\nexport interface CustomColumnBuilderProps {\n  model: IrisGridModel;\n  customColumns: readonly string[];\n  onSave: (columns: readonly string[]) => void;\n  onCancel: () => void;\n}\n\ninterface CustomColumnBuilderState {\n  inputs: readonly Input[];\n  isCustomColumnApplying: boolean;\n  errorMessage: ReactElement | null;\n  hasRequestFailed: boolean;\n  isSuccessShowing: boolean;\n}\nclass CustomColumnBuilder extends Component<\n  CustomColumnBuilderProps,\n  CustomColumnBuilderState\n> {\n  static SUCCESS_SHOW_DURATION = 750;\n\n  static makeCustomColumnInputEventKey(): string {\n    return shortid.generate();\n  }\n\n  static createCustomColumnInput(): Input {\n    return {\n      eventKey: shortid.generate(),\n      name: '',\n      formula: '',\n    };\n  }\n\n  constructor(props: CustomColumnBuilderProps) {\n    super(props);\n\n    this.handleAddColumnClick = this.handleAddColumnClick.bind(this);\n    this.handleSaveClick = this.handleSaveClick.bind(this);\n    this.handleInputChange = this.handleInputChange.bind(this);\n    this.handleDeleteColumn = this.handleDeleteColumn.bind(this);\n    this.handleCustomColumnUpdated = this.handleCustomColumnUpdated.bind(this);\n    this.handleRequestFailed = this.handleRequestFailed.bind(this);\n    this.handleDragEnd = this.handleDragEnd.bind(this);\n    this.resetRequestFailed = this.resetRequestFailed.bind(this);\n\n    this.handleEditorTabNavigation = this.handleEditorTabNavigation.bind(this);\n\n    this.state = {\n      inputs: [],\n      isCustomColumnApplying: false,\n      errorMessage: null,\n      hasRequestFailed: false,\n      isSuccessShowing: false,\n    };\n    this.container = null;\n    this.successButtonTimer = null;\n  }\n\n  componentDidMount(): void {\n    const { customColumns } = this.props;\n    this.parseCustomColumns(customColumns);\n    this.startListening();\n  }\n\n  componentWillUnmount(): void {\n    this.stopListening();\n    if (this.successButtonTimer) {\n      clearTimeout(this.successButtonTimer);\n    }\n  }\n\n  container: HTMLDivElement | null;\n\n  successButtonTimer: ReturnType<typeof setTimeout> | null;\n\n  getInput = memoize((inputs: readonly Input[], key: string) =>\n    inputs.find(input => input.eventKey === key)\n  );\n\n  getInputIndex = memoize((inputs: readonly Input[], key: string) =>\n    inputs.findIndex(input => input.eventKey === key)\n  );\n\n  resetErrorMessage(): void {\n    this.setState({ errorMessage: null });\n  }\n\n  startListening(): void {\n    const { model } = this.props;\n    model.addEventListener(\n      IrisGridModel.EVENT.COLUMNS_CHANGED,\n      this.handleCustomColumnUpdated\n    );\n    model.addEventListener(\n      IrisGridModel.EVENT.UPDATED,\n      this.handleCustomColumnUpdated\n    );\n    model.addEventListener(\n      IrisGridModel.EVENT.REQUEST_FAILED,\n      this.handleRequestFailed\n    );\n  }\n\n  stopListening(): void {\n    const { model } = this.props;\n    model.removeEventListener(\n      IrisGridModel.EVENT.COLUMNS_CHANGED,\n      this.handleCustomColumnUpdated\n    );\n    model.removeEventListener(\n      IrisGridModel.EVENT.UPDATED,\n      this.handleCustomColumnUpdated\n    );\n    model.removeEventListener(\n      IrisGridModel.EVENT.REQUEST_FAILED,\n      this.handleRequestFailed\n    );\n  }\n\n  parseCustomColumns(customColumns: readonly string[]): void {\n    if (customColumns.length > 0) {\n      const customColumnInputs = customColumns.map(customColumn => {\n        const input = customColumn.split(/=(.+)/, 2);\n        return {\n          eventKey: CustomColumnBuilder.makeCustomColumnInputEventKey(),\n          name: input[0],\n          formula: input[1],\n        };\n      });\n      this.setState({ inputs: customColumnInputs });\n    } else {\n      this.setState({\n        inputs: [CustomColumnBuilder.createCustomColumnInput()],\n      });\n    }\n  }\n\n  handleAddColumnClick(): void {\n    const { inputs } = this.state;\n    const newInputs = [...inputs];\n    newInputs.push(CustomColumnBuilder.createCustomColumnInput());\n    this.setState({\n      inputs: newInputs,\n    });\n  }\n\n  handleDeleteColumn(eventKey: string): void {\n    const { inputs } = this.state;\n    const customColumnIndex = this.getInputIndex(inputs, eventKey);\n    const newInputs = [...inputs];\n    newInputs.splice(customColumnIndex, 1);\n    if (newInputs.length === 0) {\n      newInputs.push(CustomColumnBuilder.createCustomColumnInput());\n    }\n    this.setState({\n      inputs: newInputs,\n    });\n  }\n\n  handleInputChange(\n    eventKey: string,\n    type: CustomColumnKey,\n    value: string\n  ): void {\n    const { inputs } = this.state;\n    const customColumnIndex = this.getInputIndex(inputs, eventKey);\n    const customColumnInput = this.getInput(inputs, eventKey);\n\n    const newCustomInput = { ...customColumnInput } as Input;\n    newCustomInput[type] = value;\n\n    const newInputs = [...inputs];\n    newInputs.splice(customColumnIndex, 1, newCustomInput);\n    this.setState({\n      inputs: newInputs,\n    });\n  }\n\n  handleCustomColumnUpdated(): void {\n    const { isCustomColumnApplying } = this.state;\n    if (!isCustomColumnApplying) {\n      return;\n    }\n    this.setState(\n      { isCustomColumnApplying: false, isSuccessShowing: true },\n      () => {\n        this.successButtonTimer = setTimeout(\n          () => this.setState({ isSuccessShowing: false }),\n          CustomColumnBuilder.SUCCESS_SHOW_DURATION\n        );\n      }\n    );\n  }\n\n  handleRequestFailed(event: Event): void {\n    const customEvent = event as CustomEvent;\n    const { isCustomColumnApplying } = this.state;\n    if (!isCustomColumnApplying) {\n      return;\n    }\n\n    this.setState({\n      isCustomColumnApplying: false,\n      errorMessage: (\n        <>\n          <p>\n            <FontAwesomeIcon icon={vsWarning} /> Failed to apply custom columns.\n          </p>\n          <div className=\"error-box\">\n            {customEvent.detail.errorMessage}\n            <br />\n            Table configuration:{' '}\n            {JSON.stringify(customEvent.detail.configuration)}\n          </div>\n        </>\n      ),\n      hasRequestFailed: true,\n    });\n  }\n\n  handleDragEnd(result: DropResult): void {\n    DragUtils.stopDragging();\n\n    // if dropped outside the list\n    if (!result.destination) {\n      return;\n    }\n    const { inputs } = this.state;\n    const sourceIndex = result.source.index;\n    const destinationIndex = result.destination.index;\n    const newInputs = [...inputs];\n    const sourceInput = inputs[sourceIndex];\n\n    newInputs.splice(sourceIndex, 1);\n    newInputs.splice(destinationIndex, 0, sourceInput);\n\n    this.setState({ inputs: newInputs });\n  }\n\n  handleEditorTabNavigation(focusEditorIndex: number, shiftKey: boolean): void {\n    const { inputs } = this.state;\n    // focus on drag handle\n    if (shiftKey) {\n      (\n        this.container?.querySelectorAll('.btn-drag-handle')[\n          focusEditorIndex\n        ] as HTMLButtonElement\n      ).focus();\n      return;\n    }\n    if (focusEditorIndex === inputs.length - 1) {\n      (\n        this.container?.querySelector('.btn-add-column') as HTMLButtonElement\n      )?.focus();\n    } else {\n      // focus on next column name input\n      const nextFocusIndex = focusEditorIndex + 1;\n      (\n        this.container?.querySelectorAll(`.custom-column-input`)[\n          nextFocusIndex\n        ] as HTMLInputElement\n      ).focus();\n    }\n  }\n\n  handleSaveClick(): void {\n    const { onSave, customColumns: originalCustomColumns } = this.props;\n    const { inputs, isCustomColumnApplying } = this.state;\n    if (isCustomColumnApplying) {\n      return;\n    }\n    const customColumns = [] as string[];\n    inputs.forEach(input => {\n      const { name, formula } = input;\n      if (name && formula) {\n        customColumns.push(`${name}=${formula}`);\n      }\n    });\n    this.resetErrorMessage();\n    this.setState({\n      // If both are 0, then moving from no custom to no custom. The parent won't re-render to cancel the loading state\n      isCustomColumnApplying:\n        customColumns.length > 0 || originalCustomColumns.length > 0,\n    });\n    onSave(customColumns);\n  }\n\n  resetRequestFailed(): void {\n    this.setState(({ hasRequestFailed }) => {\n      if (hasRequestFailed) {\n        return { hasRequestFailed: false };\n      }\n      return null;\n    });\n  }\n\n  renderInputs(): ReactElement[] {\n    const { inputs, hasRequestFailed } = this.state;\n\n    const nameCount = new Map();\n    inputs.forEach(({ name }) =>\n      nameCount.set(name, (nameCount.get(name) ?? 0) + 1)\n    );\n\n    return inputs.map((input, index) => {\n      const { eventKey, name, formula } = input;\n      const isDuplicate = (nameCount.get(name) ?? 0) > 1;\n      return (\n        <CustomColumnInput\n          key={eventKey}\n          inputIndex={index}\n          eventKey={eventKey}\n          name={name}\n          formula={formula}\n          onChange={this.handleInputChange}\n          onDeleteColumn={this.handleDeleteColumn}\n          onTabInEditor={this.handleEditorTabNavigation}\n          invalid={hasRequestFailed}\n          isDuplicate={isDuplicate}\n        />\n      );\n    });\n  }\n\n  renderSaveButton(): ReactElement {\n    const { inputs, isCustomColumnApplying, isSuccessShowing } = this.state;\n    const saveText = inputs.length > 1 ? 'Save Columns' : 'Save Column';\n    const areNamesValid = inputs.every(\n      ({ name }) => name === '' || DbNameValidator.isValidColumnName(name)\n    );\n    const filteredNames = inputs\n      .filter(({ name }) => name !== '')\n      .map(({ name }) => name);\n    const areNamesUnique = new Set(filteredNames).size === filteredNames.length;\n\n    return (\n      <Button\n        kind={isSuccessShowing ? 'success' : 'primary'}\n        className={classNames('btn-apply', {\n          'btn-spinner': isCustomColumnApplying,\n        })}\n        disabled={\n          isSuccessShowing ||\n          isCustomColumnApplying ||\n          !areNamesValid ||\n          !areNamesUnique\n        }\n        onClick={this.handleSaveClick}\n      >\n        {isCustomColumnApplying && (\n          <span>\n            <LoadingSpinner />\n            <span className=\"btn-normal-content\">Applying</span>\n          </span>\n        )}\n        {!isSuccessShowing && !isCustomColumnApplying && saveText}\n        {isSuccessShowing && (\n          <>\n            <FontAwesomeIcon icon={vsPass} /> Success\n          </>\n        )}\n      </Button>\n    );\n  }\n\n  render(): JSX.Element {\n    const { onCancel } = this.props;\n    const { errorMessage } = this.state;\n    return (\n      <div\n        role=\"presentation\"\n        className=\"custom-column-builder-container\"\n        ref={container => {\n          this.container = container;\n        }}\n        onClick={this.resetRequestFailed}\n        onFocus={this.resetRequestFailed}\n      >\n        <hr />\n        <DragDropContext\n          onDragStart={DragUtils.startDragging}\n          onDragEnd={this.handleDragEnd}\n        >\n          <Droppable droppableId=\"droppable-custom-columns\">\n            {(provided, snapshot) => (\n              <div\n                ref={provided.innerRef}\n                // eslint-disable-next-line react/jsx-props-no-spreading\n                {...provided.droppableProps}\n                className={classNames('droppable-container', {\n                  dragging: snapshot.draggingFromThisWith,\n                })}\n              >\n                {this.renderInputs()}\n                {provided.placeholder}\n              </div>\n            )}\n          </Droppable>\n        </DragDropContext>\n\n        <div className=\"pt-1 px-3\">\n          <Button\n            kind=\"ghost\"\n            className=\"btn-add-column\"\n            onClick={this.handleAddColumnClick}\n            icon={dhNewCircleLargeFilled}\n          >\n            Add Another Column\n          </Button>\n        </div>\n\n        <div className=\"custom-column-builder-footer\">\n          {errorMessage && <div className=\"error-message\">{errorMessage}</div>}\n\n          <div className=\"d-flex justify-content-end\">\n            <Button kind=\"secondary\" className=\"mr-2\" onClick={onCancel}>\n              Cancel\n            </Button>\n            {this.renderSaveButton()}\n          </div>\n        </div>\n      </div>\n    );\n  }\n}\n\nexport default CustomColumnBuilder;\n"],"mappings":"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"}
+{"version":3,"file":"CustomColumnBuilder.js","names":["React","Component","classNames","shortid","memoize","DragDropContext","Droppable","FontAwesomeIcon","Button","DragUtils","LoadingSpinner","dhNewCircleLargeFilled","vsWarning","vsPass","DbNameValidator","CustomColumnInput","IrisGridModel","CustomColumnBuilder","makeCustomColumnInputEventKey","generate","createCustomColumnInput","eventKey","name","formula","constructor","props","inputs","key","find","input","findIndex","handleAddColumnClick","bind","handleSaveClick","handleInputChange","handleDeleteColumn","handleCustomColumnUpdated","handleRequestFailed","handleDragEnd","resetRequestFailed","handleEditorTabNavigation","state","isCustomColumnApplying","errorMessage","hasRequestFailed","isSuccessShowing","container","successButtonTimer","componentDidMount","customColumns","parseCustomColumns","startListening","componentWillUnmount","stopListening","clearTimeout","resetErrorMessage","setState","model","addEventListener","EVENT","COLUMNS_CHANGED","UPDATED","REQUEST_FAILED","removeEventListener","length","customColumnInputs","map","customColumn","split","newInputs","push","customColumnIndex","getInputIndex","splice","type","value","customColumnInput","getInput","newCustomInput","setTimeout","SUCCESS_SHOW_DURATION","event","customEvent","detail","JSON","stringify","configuration","result","stopDragging","destination","sourceIndex","source","index","destinationIndex","sourceInput","focusEditorIndex","shiftKey","querySelectorAll","focus","querySelector","nextFocusIndex","onSave","originalCustomColumns","forEach","renderInputs","nameCount","Map","set","get","isDuplicate","renderSaveButton","saveText","areNamesValid","every","isValidColumnName","filteredNames","filter","areNamesUnique","Set","size","render","onCancel","startDragging","provided","snapshot","innerRef","droppableProps","dragging","draggingFromThisWith","placeholder"],"sources":["../../src/sidebar/CustomColumnBuilder.tsx"],"sourcesContent":["import React, { Component, ReactElement } from 'react';\nimport classNames from 'classnames';\nimport shortid from 'shortid';\nimport memoize from 'memoize-one';\nimport { DragDropContext, Droppable, DropResult } from 'react-beautiful-dnd';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport { Button, DragUtils, LoadingSpinner } from '@deephaven/components';\nimport { dhNewCircleLargeFilled, vsWarning, vsPass } from '@deephaven/icons';\nimport { DbNameValidator } from '@deephaven/utils';\nimport CustomColumnInput from './CustomColumnInput';\nimport './CustomColumnBuilder.scss';\nimport IrisGridModel from '../IrisGridModel';\n\nexport type CustomColumnKey = 'eventKey' | 'name' | 'formula';\n\ntype Input = {\n  eventKey: string;\n  name: string;\n  formula: string;\n};\nexport interface CustomColumnBuilderProps {\n  model: IrisGridModel;\n  customColumns: readonly string[];\n  onSave: (columns: readonly string[]) => void;\n  onCancel: () => void;\n}\n\ninterface CustomColumnBuilderState {\n  inputs: readonly Input[];\n  isCustomColumnApplying: boolean;\n  errorMessage: ReactElement | null;\n  hasRequestFailed: boolean;\n  isSuccessShowing: boolean;\n}\nclass CustomColumnBuilder extends Component<\n  CustomColumnBuilderProps,\n  CustomColumnBuilderState\n> {\n  static SUCCESS_SHOW_DURATION = 750;\n\n  static makeCustomColumnInputEventKey(): string {\n    return shortid.generate();\n  }\n\n  static createCustomColumnInput(): Input {\n    return {\n      eventKey: shortid.generate(),\n      name: '',\n      formula: '',\n    };\n  }\n\n  constructor(props: CustomColumnBuilderProps) {\n    super(props);\n\n    this.handleAddColumnClick = this.handleAddColumnClick.bind(this);\n    this.handleSaveClick = this.handleSaveClick.bind(this);\n    this.handleInputChange = this.handleInputChange.bind(this);\n    this.handleDeleteColumn = this.handleDeleteColumn.bind(this);\n    this.handleCustomColumnUpdated = this.handleCustomColumnUpdated.bind(this);\n    this.handleRequestFailed = this.handleRequestFailed.bind(this);\n    this.handleDragEnd = this.handleDragEnd.bind(this);\n    this.resetRequestFailed = this.resetRequestFailed.bind(this);\n\n    this.handleEditorTabNavigation = this.handleEditorTabNavigation.bind(this);\n\n    this.state = {\n      inputs: [],\n      isCustomColumnApplying: false,\n      errorMessage: null,\n      hasRequestFailed: false,\n      isSuccessShowing: false,\n    };\n    this.container = null;\n    this.successButtonTimer = null;\n  }\n\n  componentDidMount(): void {\n    const { customColumns } = this.props;\n    this.parseCustomColumns(customColumns);\n    this.startListening();\n  }\n\n  componentWillUnmount(): void {\n    this.stopListening();\n    if (this.successButtonTimer) {\n      clearTimeout(this.successButtonTimer);\n    }\n  }\n\n  container: HTMLDivElement | null;\n\n  successButtonTimer: ReturnType<typeof setTimeout> | null;\n\n  getInput = memoize((inputs: readonly Input[], key: string) =>\n    inputs.find(input => input.eventKey === key)\n  );\n\n  getInputIndex = memoize((inputs: readonly Input[], key: string) =>\n    inputs.findIndex(input => input.eventKey === key)\n  );\n\n  resetErrorMessage(): void {\n    this.setState({ errorMessage: null });\n  }\n\n  startListening(): void {\n    const { model } = this.props;\n    model.addEventListener(\n      IrisGridModel.EVENT.COLUMNS_CHANGED,\n      this.handleCustomColumnUpdated\n    );\n    model.addEventListener(\n      IrisGridModel.EVENT.UPDATED,\n      this.handleCustomColumnUpdated\n    );\n    model.addEventListener(\n      IrisGridModel.EVENT.REQUEST_FAILED,\n      this.handleRequestFailed\n    );\n  }\n\n  stopListening(): void {\n    const { model } = this.props;\n    model.removeEventListener(\n      IrisGridModel.EVENT.COLUMNS_CHANGED,\n      this.handleCustomColumnUpdated\n    );\n    model.removeEventListener(\n      IrisGridModel.EVENT.UPDATED,\n      this.handleCustomColumnUpdated\n    );\n    model.removeEventListener(\n      IrisGridModel.EVENT.REQUEST_FAILED,\n      this.handleRequestFailed\n    );\n  }\n\n  parseCustomColumns(customColumns: readonly string[]): void {\n    if (customColumns.length > 0) {\n      const customColumnInputs = customColumns.map(customColumn => {\n        const input = customColumn.split(/=(.+)/, 2);\n        return {\n          eventKey: CustomColumnBuilder.makeCustomColumnInputEventKey(),\n          name: input[0],\n          formula: input[1],\n        };\n      });\n      this.setState({ inputs: customColumnInputs });\n    } else {\n      this.setState({\n        inputs: [CustomColumnBuilder.createCustomColumnInput()],\n      });\n    }\n  }\n\n  handleAddColumnClick(): void {\n    const { inputs } = this.state;\n    const newInputs = [...inputs];\n    newInputs.push(CustomColumnBuilder.createCustomColumnInput());\n    this.setState({\n      inputs: newInputs,\n    });\n  }\n\n  handleDeleteColumn(eventKey: string): void {\n    const { inputs } = this.state;\n    const customColumnIndex = this.getInputIndex(inputs, eventKey);\n    const newInputs = [...inputs];\n    newInputs.splice(customColumnIndex, 1);\n    if (newInputs.length === 0) {\n      newInputs.push(CustomColumnBuilder.createCustomColumnInput());\n    }\n    this.setState({\n      inputs: newInputs,\n    });\n  }\n\n  handleInputChange(\n    eventKey: string,\n    type: CustomColumnKey,\n    value: string\n  ): void {\n    const { inputs } = this.state;\n    const customColumnIndex = this.getInputIndex(inputs, eventKey);\n    const customColumnInput = this.getInput(inputs, eventKey);\n\n    const newCustomInput = { ...customColumnInput } as Input;\n    newCustomInput[type] = value;\n\n    const newInputs = [...inputs];\n    newInputs.splice(customColumnIndex, 1, newCustomInput);\n    this.setState({\n      inputs: newInputs,\n    });\n  }\n\n  handleCustomColumnUpdated(): void {\n    const { isCustomColumnApplying } = this.state;\n    if (!isCustomColumnApplying) {\n      return;\n    }\n    this.setState(\n      { isCustomColumnApplying: false, isSuccessShowing: true },\n      () => {\n        this.successButtonTimer = setTimeout(\n          () => this.setState({ isSuccessShowing: false }),\n          CustomColumnBuilder.SUCCESS_SHOW_DURATION\n        );\n      }\n    );\n  }\n\n  handleRequestFailed(event: Event): void {\n    const customEvent = event as CustomEvent;\n    const { isCustomColumnApplying } = this.state;\n    if (!isCustomColumnApplying) {\n      return;\n    }\n\n    this.setState({\n      isCustomColumnApplying: false,\n      errorMessage: (\n        <>\n          <p>\n            <FontAwesomeIcon icon={vsWarning} /> Failed to apply custom columns.\n          </p>\n          <div className=\"error-box\">\n            {customEvent.detail.errorMessage}\n            <br />\n            Table configuration:{' '}\n            {JSON.stringify(customEvent.detail.configuration)}\n          </div>\n        </>\n      ),\n      hasRequestFailed: true,\n    });\n  }\n\n  handleDragEnd(result: DropResult): void {\n    DragUtils.stopDragging();\n\n    // if dropped outside the list\n    if (!result.destination) {\n      return;\n    }\n    const { inputs } = this.state;\n    const sourceIndex = result.source.index;\n    const destinationIndex = result.destination.index;\n    const newInputs = [...inputs];\n    const sourceInput = inputs[sourceIndex];\n\n    newInputs.splice(sourceIndex, 1);\n    newInputs.splice(destinationIndex, 0, sourceInput);\n\n    this.setState({ inputs: newInputs });\n  }\n\n  handleEditorTabNavigation(focusEditorIndex: number, shiftKey: boolean): void {\n    const { inputs } = this.state;\n    // focus on drag handle\n    if (shiftKey) {\n      (\n        this.container?.querySelectorAll('.btn-drag-handle')[\n          focusEditorIndex\n        ] as HTMLButtonElement\n      ).focus();\n      return;\n    }\n    if (focusEditorIndex === inputs.length - 1) {\n      (\n        this.container?.querySelector('.btn-add-column') as HTMLButtonElement\n      )?.focus();\n    } else {\n      // focus on next column name input\n      const nextFocusIndex = focusEditorIndex + 1;\n      (\n        this.container?.querySelectorAll(`.custom-column-input`)[\n          nextFocusIndex\n        ] as HTMLInputElement\n      ).focus();\n    }\n  }\n\n  handleSaveClick(): void {\n    const { onSave, customColumns: originalCustomColumns } = this.props;\n    const { inputs, isCustomColumnApplying } = this.state;\n    if (isCustomColumnApplying) {\n      return;\n    }\n    const customColumns = [] as string[];\n    inputs.forEach(input => {\n      const { name, formula } = input;\n      if (name && formula) {\n        customColumns.push(`${name}=${formula}`);\n      }\n    });\n    this.resetErrorMessage();\n    this.setState({\n      // If both are 0, then moving from no custom to no custom. The parent won't re-render to cancel the loading state\n      isCustomColumnApplying:\n        customColumns.length > 0 || originalCustomColumns.length > 0,\n    });\n    onSave(customColumns);\n  }\n\n  resetRequestFailed(): void {\n    this.setState(({ hasRequestFailed }) => {\n      if (hasRequestFailed) {\n        return { hasRequestFailed: false };\n      }\n      return null;\n    });\n  }\n\n  renderInputs(): ReactElement[] {\n    const { inputs, hasRequestFailed } = this.state;\n\n    const nameCount = new Map();\n    inputs.forEach(({ name }) =>\n      nameCount.set(name, (nameCount.get(name) ?? 0) + 1)\n    );\n\n    return inputs.map((input, index) => {\n      const { eventKey, name, formula } = input;\n      const isDuplicate = (nameCount.get(name) ?? 0) > 1;\n      return (\n        <CustomColumnInput\n          key={eventKey}\n          inputIndex={index}\n          eventKey={eventKey}\n          name={name}\n          formula={formula}\n          onChange={this.handleInputChange}\n          onDeleteColumn={this.handleDeleteColumn}\n          onTabInEditor={this.handleEditorTabNavigation}\n          invalid={hasRequestFailed}\n          isDuplicate={isDuplicate}\n        />\n      );\n    });\n  }\n\n  renderSaveButton(): ReactElement {\n    const { inputs, isCustomColumnApplying, isSuccessShowing } = this.state;\n    const saveText = inputs.length > 1 ? 'Save Columns' : 'Save Column';\n    const areNamesValid = inputs.every(\n      ({ name }) => name === '' || DbNameValidator.isValidColumnName(name)\n    );\n    const filteredNames = inputs\n      .filter(({ name }) => name !== '')\n      .map(({ name }) => name);\n    const areNamesUnique = new Set(filteredNames).size === filteredNames.length;\n\n    return (\n      <Button\n        kind={isSuccessShowing ? 'success' : 'primary'}\n        className={classNames('btn-apply', {\n          'btn-spinner': isCustomColumnApplying,\n        })}\n        disabled={\n          isSuccessShowing ||\n          isCustomColumnApplying ||\n          !areNamesValid ||\n          !areNamesUnique\n        }\n        onClick={this.handleSaveClick}\n      >\n        {isCustomColumnApplying && (\n          <span>\n            <LoadingSpinner />\n            <span className=\"btn-normal-content\">Applying</span>\n          </span>\n        )}\n        {!isSuccessShowing && !isCustomColumnApplying && saveText}\n        {isSuccessShowing && (\n          <>\n            <FontAwesomeIcon icon={vsPass} /> Success\n          </>\n        )}\n      </Button>\n    );\n  }\n\n  render(): JSX.Element {\n    const { onCancel } = this.props;\n    const { errorMessage } = this.state;\n    return (\n      <div\n        role=\"presentation\"\n        className=\"custom-column-builder-container\"\n        ref={container => {\n          this.container = container;\n        }}\n        onClick={this.resetRequestFailed}\n        onFocus={this.resetRequestFailed}\n      >\n        <hr />\n        <DragDropContext\n          onDragStart={DragUtils.startDragging}\n          onDragEnd={this.handleDragEnd}\n        >\n          <Droppable droppableId=\"droppable-custom-columns\">\n            {(provided, snapshot) => (\n              <div\n                ref={provided.innerRef}\n                // eslint-disable-next-line react/jsx-props-no-spreading\n                {...provided.droppableProps}\n                className={classNames('droppable-container', {\n                  dragging: snapshot.draggingFromThisWith,\n                })}\n              >\n                {this.renderInputs()}\n                {provided.placeholder}\n              </div>\n            )}\n          </Droppable>\n        </DragDropContext>\n\n        <div className=\"pt-1 px-3\">\n          <Button\n            kind=\"ghost\"\n            className=\"btn-add-column\"\n            onClick={this.handleAddColumnClick}\n            icon={dhNewCircleLargeFilled}\n          >\n            Add Another Column\n          </Button>\n        </div>\n\n        <div className=\"custom-column-builder-footer\">\n          {errorMessage && <div className=\"error-message\">{errorMessage}</div>}\n\n          <div className=\"d-flex justify-content-end\">\n            <Button kind=\"secondary\" className=\"mr-2\" onClick={onCancel}>\n              Cancel\n            </Button>\n            {this.renderSaveButton()}\n          </div>\n        </div>\n      </div>\n    );\n  }\n}\n\nexport default CustomColumnBuilder;\n"],"mappings":"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"}

package/dist/sidebar/CustomColumnInput.js

@@ -1,4 +1,8 @@
-function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
 import React, { useCallback } from 'react';
 import classNames from 'classnames';
 import { Draggable } from 'react-beautiful-dnd';
@@ -6,6 +10,8 @@ import { Button } from '@deephaven/components';
 import { vsTrash, vsGripper } from '@deephaven/icons';
 import { DbNameValidator } from '@deephaven/utils';
 import InputEditor from "./InputEditor.js";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
 var INPUT_TYPE = Object.freeze({
   NAME: 'name',
   FORMULA: 'formula'
@@ -32,60 +38,67 @@ function CustomColumnInput(_ref) {
       _onChange(eventKey, INPUT_TYPE.FORMULA, formulaValue);
     }
   }, [_onChange, eventKey]);
-  return /*#__PURE__*/React.createElement(Draggable, {
+  return /*#__PURE__*/_jsx(Draggable, {
     draggableId: eventKey,
     index: inputIndex,
-    disableInteractiveElementBlocking: true
-  }, (provided, snapshot) => /*#__PURE__*/React.createElement("div", _extends({
-    className: classNames('draggable-container', {
-      dragging: snapshot.isDragging
-    }),
-    ref: provided.innerRef
-    // eslint-disable-next-line react/jsx-props-no-spreading
-  }, provided.draggableProps), /*#__PURE__*/React.createElement("div", {
-    className: "custom-column-input-container"
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "pb-3"
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "d-flex flex-row custom-column-name"
-  }, /*#__PURE__*/React.createElement("input", {
-    className: classNames('form-control custom-column-input', {
-      'is-invalid': invalid || !isValidName || isDuplicate
-    }),
-    placeholder: "Column Name",
-    value: name,
-    onChange: event => {
-      _onChange(eventKey, INPUT_TYPE.NAME, event.target.value);
-    }
-  }), /*#__PURE__*/React.createElement(Button, {
-    kind: "ghost",
-    className: "ml-1 px-2",
-    onClick: () => {
-      onDeleteColumn(eventKey);
-    },
-    icon: vsTrash,
-    tooltip: "Delete custom column"
-  }), /*#__PURE__*/React.createElement(Button, _extends({
-    kind: "ghost",
-    className: "btn-drag-handle",
-    onClick: EMPTY_FN
-    // eslint-disable-next-line react/jsx-props-no-spreading
-  }, provided.dragHandleProps, {
-    icon: vsGripper,
-    tooltip: "Drag column to re-order"
-  }))), (!isValidName || isDuplicate) && /*#__PURE__*/React.createElement("p", {
-    className: "validate-label-error text-danger mb-0 mt-2 pl-1"
-  }, !isValidName ? 'Invalid name' : 'Duplicate name')), /*#__PURE__*/React.createElement(InputEditor, {
-    editorSettings: {
-      language: 'deephavenDb'
-    },
-    editorIndex: inputIndex,
-    placeholder: "Column Formula",
-    value: formula,
-    onContentChanged: handleFormulaEditorContentChanged,
-    onTab: onTabInEditor,
-    invalid: invalid
-  })), /*#__PURE__*/React.createElement("hr", null)));
+    disableInteractiveElementBlocking: true,
+    children: (provided, snapshot) => /*#__PURE__*/_jsxs("div", _objectSpread(_objectSpread({
+      className: classNames('draggable-container', {
+        dragging: snapshot.isDragging
+      }),
+      ref: provided.innerRef
+      // eslint-disable-next-line react/jsx-props-no-spreading
+    }, provided.draggableProps), {}, {
+      children: [/*#__PURE__*/_jsxs("div", {
+        className: "custom-column-input-container",
+        children: [/*#__PURE__*/_jsxs("div", {
+          className: "pb-3",
+          children: [/*#__PURE__*/_jsxs("div", {
+            className: "d-flex flex-row custom-column-name",
+            children: [/*#__PURE__*/_jsx("input", {
+              className: classNames('form-control custom-column-input', {
+                'is-invalid': invalid || !isValidName || isDuplicate
+              }),
+              placeholder: "Column Name",
+              value: name,
+              onChange: event => {
+                _onChange(eventKey, INPUT_TYPE.NAME, event.target.value);
+              }
+            }), /*#__PURE__*/_jsx(Button, {
+              kind: "ghost",
+              className: "ml-1 px-2",
+              onClick: () => {
+                onDeleteColumn(eventKey);
+              },
+              icon: vsTrash,
+              tooltip: "Delete custom column"
+            }), /*#__PURE__*/_jsx(Button, _objectSpread(_objectSpread({
+              kind: "ghost",
+              className: "btn-drag-handle",
+              onClick: EMPTY_FN
+              // eslint-disable-next-line react/jsx-props-no-spreading
+            }, provided.dragHandleProps), {}, {
+              icon: vsGripper,
+              tooltip: "Drag column to re-order"
+            }))]
+          }), (!isValidName || isDuplicate) && /*#__PURE__*/_jsx("p", {
+            className: "validate-label-error text-danger mb-0 mt-2 pl-1",
+            children: !isValidName ? 'Invalid name' : 'Duplicate name'
+          })]
+        }), /*#__PURE__*/_jsx(InputEditor, {
+          editorSettings: {
+            language: 'deephavenDb'
+          },
+          editorIndex: inputIndex,
+          placeholder: "Column Formula",
+          value: formula,
+          onContentChanged: handleFormulaEditorContentChanged,
+          onTab: onTabInEditor,
+          invalid: invalid
+        })]
+      }), /*#__PURE__*/_jsx("hr", {})]
+    }))
+  });
 }
 export default CustomColumnInput;
 //# sourceMappingURL=CustomColumnInput.js.map

package/dist/sidebar/CustomColumnInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"CustomColumnInput.js","names":["React","useCallback","classNames","Draggable","Button","vsTrash","vsGripper","DbNameValidator","InputEditor","INPUT_TYPE","Object","freeze","NAME","FORMULA","EMPTY_FN","CustomColumnInput","eventKey","name","inputIndex","formula","onChange","onDeleteColumn","onTabInEditor","invalid","isDuplicate","isValidName","isValidColumnName","handleFormulaEditorContentChanged","formulaValue","undefined","replace","provided","snapshot","dragging","isDragging","innerRef","draggableProps","event","target","value","dragHandleProps","language"],"sources":["../../src/sidebar/CustomColumnInput.tsx"],"sourcesContent":["import React, { useCallback } from 'react';\nimport classNames from 'classnames';\nimport { Draggable } from 'react-beautiful-dnd';\nimport { Button } from '@deephaven/components';\nimport { vsTrash, vsGripper } from '@deephaven/icons';\nimport { DbNameValidator } from '@deephaven/utils';\nimport InputEditor from './InputEditor';\nimport { CustomColumnKey } from './CustomColumnBuilder';\n\nexport interface CustomColumnInputProps {\n  eventKey: string;\n  inputIndex: number;\n  name: string;\n  formula: string;\n  onChange: (\n    eventKey: string,\n    inputType: CustomColumnKey,\n    value: string\n  ) => void;\n  onDeleteColumn: (eventKey: string) => void;\n  onTabInEditor: (editorIndex: number, shiftKey: boolean) => void;\n  invalid: boolean;\n  isDuplicate: boolean;\n}\n\nconst INPUT_TYPE = Object.freeze({\n  NAME: 'name',\n  FORMULA: 'formula',\n});\n\nconst EMPTY_FN = () => {\n  // no-op\n};\n\nfunction CustomColumnInput({\n  eventKey,\n  name,\n  inputIndex,\n  formula,\n  onChange,\n  onDeleteColumn,\n  onTabInEditor,\n  invalid,\n  isDuplicate,\n}: CustomColumnInputProps): JSX.Element {\n  const isValidName = name === '' || DbNameValidator.isValidColumnName(name);\n  const handleFormulaEditorContentChanged = useCallback(\n    (formulaValue?: string) => {\n      if (formulaValue !== undefined) {\n        formulaValue.replace(/(\\r\\n|\\n|\\r)/gm, ''); // remove line break\n        onChange(eventKey, INPUT_TYPE.FORMULA, formulaValue);\n      }\n    },\n    [onChange, eventKey]\n  );\n\n  return (\n    <Draggable\n      draggableId={eventKey}\n      index={inputIndex}\n      disableInteractiveElementBlocking\n    >\n      {(provided, snapshot) => (\n        <div\n          className={classNames('draggable-container', {\n            dragging: snapshot.isDragging,\n          })}\n          ref={provided.innerRef}\n          // eslint-disable-next-line react/jsx-props-no-spreading\n          {...provided.draggableProps}\n        >\n          <div className=\"custom-column-input-container\">\n            <div className=\"pb-3\">\n              <div className=\"d-flex flex-row custom-column-name\">\n                <input\n                  className={classNames('form-control custom-column-input', {\n                    'is-invalid': invalid || !isValidName || isDuplicate,\n                  })}\n                  placeholder=\"Column Name\"\n                  value={name}\n                  onChange={event => {\n                    onChange(eventKey, INPUT_TYPE.NAME, event.target.value);\n                  }}\n                />\n                <Button\n                  kind=\"ghost\"\n                  className=\"ml-1 px-2\"\n                  onClick={() => {\n                    onDeleteColumn(eventKey);\n                  }}\n                  icon={vsTrash}\n                  tooltip=\"Delete custom column\"\n                />\n\n                <Button\n                  kind=\"ghost\"\n                  className=\"btn-drag-handle\"\n                  onClick={EMPTY_FN}\n                  // eslint-disable-next-line react/jsx-props-no-spreading\n                  {...provided.dragHandleProps}\n                  icon={vsGripper}\n                  tooltip=\"Drag column to re-order\"\n                />\n              </div>\n              {(!isValidName || isDuplicate) && (\n                <p className=\"validate-label-error text-danger mb-0 mt-2 pl-1\">\n                  {!isValidName ? 'Invalid name' : 'Duplicate name'}\n                </p>\n              )}\n            </div>\n            <InputEditor\n              editorSettings={{ language: 'deephavenDb' }}\n              editorIndex={inputIndex}\n              placeholder=\"Column Formula\"\n              value={formula}\n              onContentChanged={handleFormulaEditorContentChanged}\n              onTab={onTabInEditor}\n              invalid={invalid}\n            />\n          </div>\n          <hr />\n        </div>\n      )}\n    </Draggable>\n  );\n}\n\nexport default CustomColumnInput;\n"],"mappings":"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"}
+{"version":3,"file":"CustomColumnInput.js","names":["React","useCallback","classNames","Draggable","Button","vsTrash","vsGripper","DbNameValidator","InputEditor","INPUT_TYPE","Object","freeze","NAME","FORMULA","EMPTY_FN","CustomColumnInput","eventKey","name","inputIndex","formula","onChange","onDeleteColumn","onTabInEditor","invalid","isDuplicate","isValidName","isValidColumnName","handleFormulaEditorContentChanged","formulaValue","undefined","replace","provided","snapshot","dragging","isDragging","innerRef","draggableProps","event","target","value","dragHandleProps","language"],"sources":["../../src/sidebar/CustomColumnInput.tsx"],"sourcesContent":["import React, { useCallback } from 'react';\nimport classNames from 'classnames';\nimport { Draggable } from 'react-beautiful-dnd';\nimport { Button } from '@deephaven/components';\nimport { vsTrash, vsGripper } from '@deephaven/icons';\nimport { DbNameValidator } from '@deephaven/utils';\nimport InputEditor from './InputEditor';\nimport { CustomColumnKey } from './CustomColumnBuilder';\n\nexport interface CustomColumnInputProps {\n  eventKey: string;\n  inputIndex: number;\n  name: string;\n  formula: string;\n  onChange: (\n    eventKey: string,\n    inputType: CustomColumnKey,\n    value: string\n  ) => void;\n  onDeleteColumn: (eventKey: string) => void;\n  onTabInEditor: (editorIndex: number, shiftKey: boolean) => void;\n  invalid: boolean;\n  isDuplicate: boolean;\n}\n\nconst INPUT_TYPE = Object.freeze({\n  NAME: 'name',\n  FORMULA: 'formula',\n});\n\nconst EMPTY_FN = () => {\n  // no-op\n};\n\nfunction CustomColumnInput({\n  eventKey,\n  name,\n  inputIndex,\n  formula,\n  onChange,\n  onDeleteColumn,\n  onTabInEditor,\n  invalid,\n  isDuplicate,\n}: CustomColumnInputProps): JSX.Element {\n  const isValidName = name === '' || DbNameValidator.isValidColumnName(name);\n  const handleFormulaEditorContentChanged = useCallback(\n    (formulaValue?: string) => {\n      if (formulaValue !== undefined) {\n        formulaValue.replace(/(\\r\\n|\\n|\\r)/gm, ''); // remove line break\n        onChange(eventKey, INPUT_TYPE.FORMULA, formulaValue);\n      }\n    },\n    [onChange, eventKey]\n  );\n\n  return (\n    <Draggable\n      draggableId={eventKey}\n      index={inputIndex}\n      disableInteractiveElementBlocking\n    >\n      {(provided, snapshot) => (\n        <div\n          className={classNames('draggable-container', {\n            dragging: snapshot.isDragging,\n          })}\n          ref={provided.innerRef}\n          // eslint-disable-next-line react/jsx-props-no-spreading\n          {...provided.draggableProps}\n        >\n          <div className=\"custom-column-input-container\">\n            <div className=\"pb-3\">\n              <div className=\"d-flex flex-row custom-column-name\">\n                <input\n                  className={classNames('form-control custom-column-input', {\n                    'is-invalid': invalid || !isValidName || isDuplicate,\n                  })}\n                  placeholder=\"Column Name\"\n                  value={name}\n                  onChange={event => {\n                    onChange(eventKey, INPUT_TYPE.NAME, event.target.value);\n                  }}\n                />\n                <Button\n                  kind=\"ghost\"\n                  className=\"ml-1 px-2\"\n                  onClick={() => {\n                    onDeleteColumn(eventKey);\n                  }}\n                  icon={vsTrash}\n                  tooltip=\"Delete custom column\"\n                />\n\n                <Button\n                  kind=\"ghost\"\n                  className=\"btn-drag-handle\"\n                  onClick={EMPTY_FN}\n                  // eslint-disable-next-line react/jsx-props-no-spreading\n                  {...provided.dragHandleProps}\n                  icon={vsGripper}\n                  tooltip=\"Drag column to re-order\"\n                />\n              </div>\n              {(!isValidName || isDuplicate) && (\n                <p className=\"validate-label-error text-danger mb-0 mt-2 pl-1\">\n                  {!isValidName ? 'Invalid name' : 'Duplicate name'}\n                </p>\n              )}\n            </div>\n            <InputEditor\n              editorSettings={{ language: 'deephavenDb' }}\n              editorIndex={inputIndex}\n              placeholder=\"Column Formula\"\n              value={formula}\n              onContentChanged={handleFormulaEditorContentChanged}\n              onTab={onTabInEditor}\n              invalid={invalid}\n            />\n          </div>\n          <hr />\n        </div>\n      )}\n    </Draggable>\n  );\n}\n\nexport default CustomColumnInput;\n"],"mappings":";;;;;AAAA,OAAOA,KAAK,IAAIC,WAAW,QAAQ,OAAO;AAC1C,OAAOC,UAAU,MAAM,YAAY;AACnC,SAASC,SAAS,QAAQ,qBAAqB;AAC/C,SAASC,MAAM,QAAQ,uBAAuB;AAC9C,SAASC,OAAO,EAAEC,SAAS,QAAQ,kBAAkB;AACrD,SAASC,eAAe,QAAQ,kBAAkB;AAAC,OAC5CC,WAAW;AAAA;AAAA;AAmBlB,IAAMC,UAAU,GAAGC,MAAM,CAACC,MAAM,CAAC;EAC/BC,IAAI,EAAE,MAAM;EACZC,OAAO,EAAE;AACX,CAAC,CAAC;AAEF,IAAMC,QAAQ,GAAG,MAAM;EACrB;AAAA,CACD;AAED,SAASC,iBAAiB,OAUc;EAAA,IAVb;IACzBC,QAAQ;IACRC,IAAI;IACJC,UAAU;IACVC,OAAO;IACPC,QAAQ,EAARA,SAAQ;IACRC,cAAc;IACdC,aAAa;IACbC,OAAO;IACPC;EACsB,CAAC;EACvB,IAAMC,WAAW,GAAGR,IAAI,KAAK,EAAE,IAAIV,eAAe,CAACmB,iBAAiB,CAACT,IAAI,CAAC;EAC1E,IAAMU,iCAAiC,GAAG1B,WAAW,CAClD2B,YAAqB,IAAK;IACzB,IAAIA,YAAY,KAAKC,SAAS,EAAE;MAC9BD,YAAY,CAACE,OAAO,CAAC,gBAAgB,EAAE,EAAE,CAAC,CAAC,CAAC;MAC5CV,SAAQ,CAACJ,QAAQ,EAAEP,UAAU,CAACI,OAAO,EAAEe,YAAY,CAAC;IACtD;EACF,CAAC,EACD,CAACR,SAAQ,EAAEJ,QAAQ,CAAC,CACrB;EAED,oBACE,KAAC,SAAS;IACR,WAAW,EAAEA,QAAS;IACtB,KAAK,EAAEE,UAAW;IAClB,iCAAiC;IAAA,UAEhC,CAACa,QAAQ,EAAEC,QAAQ,kBAClB;MACE,SAAS,EAAE9B,UAAU,CAAC,qBAAqB,EAAE;QAC3C+B,QAAQ,EAAED,QAAQ,CAACE;MACrB,CAAC,CAAE;MACH,GAAG,EAAEH,QAAQ,CAACI;MACd;IAAA,GACIJ,QAAQ,CAACK,cAAc;MAAA,wBAE3B;QAAK,SAAS,EAAC,+BAA+B;QAAA,wBAC5C;UAAK,SAAS,EAAC,MAAM;UAAA,wBACnB;YAAK,SAAS,EAAC,oCAAoC;YAAA,wBACjD;cACE,SAAS,EAAElC,UAAU,CAAC,kCAAkC,EAAE;gBACxD,YAAY,EAAEqB,OAAO,IAAI,CAACE,WAAW,IAAID;cAC3C,CAAC,CAAE;cACH,WAAW,EAAC,aAAa;cACzB,KAAK,EAAEP,IAAK;cACZ,QAAQ,EAAEoB,KAAK,IAAI;gBACjBjB,SAAQ,CAACJ,QAAQ,EAAEP,UAAU,CAACG,IAAI,EAAEyB,KAAK,CAACC,MAAM,CAACC,KAAK,CAAC;cACzD;YAAE,EACF,eACF,KAAC,MAAM;cACL,IAAI,EAAC,OAAO;cACZ,SAAS,EAAC,WAAW;cACrB,OAAO,EAAE,MAAM;gBACblB,cAAc,CAACL,QAAQ,CAAC;cAC1B,CAAE;cACF,IAAI,EAAEX,OAAQ;cACd,OAAO,EAAC;YAAsB,EAC9B,eAEF,KAAC,MAAM;cACL,IAAI,EAAC,OAAO;cACZ,SAAS,EAAC,iBAAiB;cAC3B,OAAO,EAAES;cACT;YAAA,GACIiB,QAAQ,CAACS,eAAe;cAC5B,IAAI,EAAElC,SAAU;cAChB,OAAO,EAAC;YAAyB,GACjC;UAAA,EACE,EACL,CAAC,CAACmB,WAAW,IAAID,WAAW,kBAC3B;YAAG,SAAS,EAAC,iDAAiD;YAAA,UAC3D,CAACC,WAAW,GAAG,cAAc,GAAG;UAAgB,EAEpD;QAAA,EACG,eACN,KAAC,WAAW;UACV,cAAc,EAAE;YAAEgB,QAAQ,EAAE;UAAc,CAAE;UAC5C,WAAW,EAAEvB,UAAW;UACxB,WAAW,EAAC,gBAAgB;UAC5B,KAAK,EAAEC,OAAQ;UACf,gBAAgB,EAAEQ,iCAAkC;UACpD,KAAK,EAAEL,aAAc;UACrB,OAAO,EAAEC;QAAQ,EACjB;MAAA,EACE,eACN,cAAM;IAAA;EAET,EACS;AAEhB;AAEA,eAAeR,iBAAiB"}

package/dist/sidebar/InputEditor.js

@@ -7,6 +7,8 @@ import React, { Component } from 'react';
 import * as monaco from 'monaco-editor';
 import classNames from 'classnames';
 import "./InputEditor.css";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
 /**
  * A monaco editor that looks like an general input
  */
@@ -150,22 +152,24 @@ export class InputEditor extends Component {
       isEditorFocused,
       isEditorEmpty
     } = this.state;
-    return /*#__PURE__*/React.createElement("div", {
+    return /*#__PURE__*/_jsxs("div", {
       className: classNames('input-editor-wrapper', {
         focused: isEditorFocused,
         invalid
       }, className),
       role: "presentation",
-      onClick: this.handleContainerClick
-    }, /*#__PURE__*/React.createElement("div", {
-      className: "editor-container",
-      ref: editorContainer => {
-        this.editorContainer = editorContainer;
-      },
-      "data-testid": "custom-column-formula"
-    }), isEditorEmpty && !value && placeholder.length > 0 && /*#__PURE__*/React.createElement("div", {
-      className: "editor-placeholder text-muted"
-    }, placeholder));
+      onClick: this.handleContainerClick,
+      children: [/*#__PURE__*/_jsx("div", {
+        className: "editor-container",
+        ref: editorContainer => {
+          this.editorContainer = editorContainer;
+        },
+        "data-testid": "custom-column-formula"
+      }), isEditorEmpty && !value && placeholder.length > 0 && /*#__PURE__*/_jsx("div", {
+        className: "editor-placeholder text-muted",
+        children: placeholder
+      })]
+    });
   }
 }
 _defineProperty(InputEditor, "defaultProps", {

package/dist/sidebar/InputEditor.js.map

@@ -1 +1 @@
-{"version":3,"file":"InputEditor.js","names":["React","Component","monaco","classNames","InputEditor","constructor","props","handleContentChanged","bind","handleEditorFocus","handleEditorBlur","handleContainerClick","handleKeyDown","state","isEditorFocused","isEditorEmpty","editorContainer","componentDidMount","initEditor","componentWillUnmount","destroyEditor","value","editorSettings","inputEditorSettings","copyWithSyntaxHighlighting","fixedOverflowWidgets","folding","fontFamily","glyphMargin","language","lineDecorationsWidth","lineNumbers","minimap","enabled","renderLineHighlight","scrollbar","arrowSize","horizontal","horizontalScrollbarSize","scrollBeyondLastLine","padding","top","bottom","tabCompletion","useTabStops","wordWrap","automaticLayout","Error","editor","create","layout","getModel","updateOptions","tabSize","onKeyDown","onDidChangeModelContent","onDidFocusEditorText","onDidBlurEditorText","dispose","undefined","onContentChanged","getValue","setState","length","focus","event","onTab","editorIndex","code","stopPropagation","preventDefault","shiftKey","render","className","invalid","placeholder","focused"],"sources":["../../src/sidebar/InputEditor.tsx"],"sourcesContent":["import React, { Component, ReactElement } from 'react';\nimport * as monaco from 'monaco-editor';\nimport classNames from 'classnames';\nimport './InputEditor.scss';\n\ninterface InputEditorProps {\n  className?: string;\n  placeholder?: string;\n  value: string;\n  onContentChanged: (value?: string) => void;\n  editorSettings: Partial<monaco.editor.IStandaloneEditorConstructionOptions>;\n  editorIndex: number;\n  onTab: (editorIndex: number, shiftKey: boolean) => void;\n  invalid: boolean;\n}\n\ninterface InputEditorState {\n  isEditorFocused: boolean;\n  isEditorEmpty: boolean;\n}\n/**\n * A monaco editor that looks like an general input\n */\n\nexport class InputEditor extends Component<InputEditorProps, InputEditorState> {\n  static defaultProps = {\n    value: '',\n    onContentChanged: (): void => undefined,\n    editorSettings: {},\n    editorIndex: 0,\n    onTab: (): void => undefined,\n    invalid: false,\n  };\n\n  constructor(props: InputEditorProps) {\n    super(props);\n\n    this.handleContentChanged = this.handleContentChanged.bind(this);\n    this.handleEditorFocus = this.handleEditorFocus.bind(this);\n    this.handleEditorBlur = this.handleEditorBlur.bind(this);\n    this.handleContainerClick = this.handleContainerClick.bind(this);\n    this.handleKeyDown = this.handleKeyDown.bind(this);\n\n    this.state = {\n      isEditorFocused: false,\n      isEditorEmpty: true,\n    };\n    this.editorContainer = null;\n  }\n\n  componentDidMount(): void {\n    this.initEditor();\n  }\n\n  componentWillUnmount(): void {\n    this.destroyEditor();\n  }\n\n  editorContainer: HTMLDivElement | null;\n\n  editor?: monaco.editor.IStandaloneCodeEditor;\n\n  initEditor(): void {\n    const { value, editorSettings } = this.props;\n    const inputEditorSettings = {\n      copyWithSyntaxHighlighting: 'false',\n      fixedOverflowWidgets: true,\n      folding: false,\n      fontFamily: 'Fira Mono',\n      glyphMargin: false,\n      language: 'groovyDB',\n      lineDecorationsWidth: 8,\n      lineNumbers: 'off',\n      minimap: { enabled: false },\n      renderLineHighlight: 'none',\n      scrollbar: {\n        arrowSize: 0,\n        horizontal: 'hidden',\n        horizontalScrollbarSize: 0,\n      },\n      scrollBeyondLastLine: false,\n      padding: {\n        top: 6,\n        bottom: 6,\n      },\n      tabCompletion: 'off',\n      useTabStops: true,\n      value,\n      wordWrap: 'on',\n      automaticLayout: true,\n      ...editorSettings,\n    } as monaco.editor.IStandaloneEditorConstructionOptions;\n    if (!this.editorContainer) {\n      throw new Error('editorContainer is null');\n    }\n    this.editor = monaco.editor.create(\n      this.editorContainer,\n      inputEditorSettings\n    );\n    this.editor.layout();\n\n    // disable tab to spaces in this editor to improve tab navigation\n    this.editor.getModel()?.updateOptions({ tabSize: 0 });\n\n    // monaco does not propagate tab or enter events\n    this.editor.onKeyDown(this.handleKeyDown);\n\n    this.editor.onDidChangeModelContent(this.handleContentChanged);\n    this.editor.onDidFocusEditorText(this.handleEditorFocus);\n    this.editor.onDidBlurEditorText(this.handleEditorBlur);\n  }\n\n  destroyEditor(): void {\n    this.editor?.dispose();\n    this.editor = undefined;\n  }\n\n  handleContentChanged(): void {\n    const { onContentChanged } = this.props;\n    const value = this.editor?.getModel()?.getValue();\n    if (value !== undefined) {\n      this.setState({ isEditorEmpty: value.length === 0 });\n    }\n    onContentChanged(value);\n  }\n\n  handleEditorFocus(): void {\n    this.setState({ isEditorFocused: true });\n  }\n\n  handleEditorBlur(): void {\n    const value = this.editor?.getModel()?.getValue() ?? '';\n    this.setState({\n      isEditorEmpty: value.length === 0,\n      isEditorFocused: false,\n    });\n  }\n\n  // force editor to focus if clicked\n  handleContainerClick(): void {\n    const { isEditorFocused } = this.state;\n    if (isEditorFocused) {\n      return;\n    }\n    this.editor?.focus();\n  }\n\n  handleKeyDown(event: monaco.IKeyboardEvent): void {\n    const { onTab, editorIndex } = this.props;\n    if (event.code === 'Tab') {\n      event.stopPropagation();\n      event.preventDefault();\n      onTab(editorIndex, event.shiftKey);\n    }\n  }\n\n  render(): ReactElement {\n    const { className, invalid, placeholder = '', value } = this.props;\n    const { isEditorFocused, isEditorEmpty } = this.state;\n    return (\n      <div\n        className={classNames(\n          'input-editor-wrapper',\n          {\n            focused: isEditorFocused,\n            invalid,\n          },\n          className\n        )}\n        role=\"presentation\"\n        onClick={this.handleContainerClick}\n      >\n        <div\n          className=\"editor-container\"\n          ref={editorContainer => {\n            this.editorContainer = editorContainer;\n          }}\n          data-testid=\"custom-column-formula\"\n        />\n        {isEditorEmpty && !value && placeholder.length > 0 && (\n          <div className=\"editor-placeholder text-muted\">{placeholder}</div>\n        )}\n      </div>\n    );\n  }\n}\n\nexport default InputEditor;\n"],"mappings":"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"}
+{"version":3,"file":"InputEditor.js","names":["React","Component","monaco","classNames","InputEditor","constructor","props","handleContentChanged","bind","handleEditorFocus","handleEditorBlur","handleContainerClick","handleKeyDown","state","isEditorFocused","isEditorEmpty","editorContainer","componentDidMount","initEditor","componentWillUnmount","destroyEditor","value","editorSettings","inputEditorSettings","copyWithSyntaxHighlighting","fixedOverflowWidgets","folding","fontFamily","glyphMargin","language","lineDecorationsWidth","lineNumbers","minimap","enabled","renderLineHighlight","scrollbar","arrowSize","horizontal","horizontalScrollbarSize","scrollBeyondLastLine","padding","top","bottom","tabCompletion","useTabStops","wordWrap","automaticLayout","Error","editor","create","layout","getModel","updateOptions","tabSize","onKeyDown","onDidChangeModelContent","onDidFocusEditorText","onDidBlurEditorText","dispose","undefined","onContentChanged","getValue","setState","length","focus","event","onTab","editorIndex","code","stopPropagation","preventDefault","shiftKey","render","className","invalid","placeholder","focused"],"sources":["../../src/sidebar/InputEditor.tsx"],"sourcesContent":["import React, { Component, ReactElement } from 'react';\nimport * as monaco from 'monaco-editor';\nimport classNames from 'classnames';\nimport './InputEditor.scss';\n\ninterface InputEditorProps {\n  className?: string;\n  placeholder?: string;\n  value: string;\n  onContentChanged: (value?: string) => void;\n  editorSettings: Partial<monaco.editor.IStandaloneEditorConstructionOptions>;\n  editorIndex: number;\n  onTab: (editorIndex: number, shiftKey: boolean) => void;\n  invalid: boolean;\n}\n\ninterface InputEditorState {\n  isEditorFocused: boolean;\n  isEditorEmpty: boolean;\n}\n/**\n * A monaco editor that looks like an general input\n */\n\nexport class InputEditor extends Component<InputEditorProps, InputEditorState> {\n  static defaultProps = {\n    value: '',\n    onContentChanged: (): void => undefined,\n    editorSettings: {},\n    editorIndex: 0,\n    onTab: (): void => undefined,\n    invalid: false,\n  };\n\n  constructor(props: InputEditorProps) {\n    super(props);\n\n    this.handleContentChanged = this.handleContentChanged.bind(this);\n    this.handleEditorFocus = this.handleEditorFocus.bind(this);\n    this.handleEditorBlur = this.handleEditorBlur.bind(this);\n    this.handleContainerClick = this.handleContainerClick.bind(this);\n    this.handleKeyDown = this.handleKeyDown.bind(this);\n\n    this.state = {\n      isEditorFocused: false,\n      isEditorEmpty: true,\n    };\n    this.editorContainer = null;\n  }\n\n  componentDidMount(): void {\n    this.initEditor();\n  }\n\n  componentWillUnmount(): void {\n    this.destroyEditor();\n  }\n\n  editorContainer: HTMLDivElement | null;\n\n  editor?: monaco.editor.IStandaloneCodeEditor;\n\n  initEditor(): void {\n    const { value, editorSettings } = this.props;\n    const inputEditorSettings = {\n      copyWithSyntaxHighlighting: 'false',\n      fixedOverflowWidgets: true,\n      folding: false,\n      fontFamily: 'Fira Mono',\n      glyphMargin: false,\n      language: 'groovyDB',\n      lineDecorationsWidth: 8,\n      lineNumbers: 'off',\n      minimap: { enabled: false },\n      renderLineHighlight: 'none',\n      scrollbar: {\n        arrowSize: 0,\n        horizontal: 'hidden',\n        horizontalScrollbarSize: 0,\n      },\n      scrollBeyondLastLine: false,\n      padding: {\n        top: 6,\n        bottom: 6,\n      },\n      tabCompletion: 'off',\n      useTabStops: true,\n      value,\n      wordWrap: 'on',\n      automaticLayout: true,\n      ...editorSettings,\n    } as monaco.editor.IStandaloneEditorConstructionOptions;\n    if (!this.editorContainer) {\n      throw new Error('editorContainer is null');\n    }\n    this.editor = monaco.editor.create(\n      this.editorContainer,\n      inputEditorSettings\n    );\n    this.editor.layout();\n\n    // disable tab to spaces in this editor to improve tab navigation\n    this.editor.getModel()?.updateOptions({ tabSize: 0 });\n\n    // monaco does not propagate tab or enter events\n    this.editor.onKeyDown(this.handleKeyDown);\n\n    this.editor.onDidChangeModelContent(this.handleContentChanged);\n    this.editor.onDidFocusEditorText(this.handleEditorFocus);\n    this.editor.onDidBlurEditorText(this.handleEditorBlur);\n  }\n\n  destroyEditor(): void {\n    this.editor?.dispose();\n    this.editor = undefined;\n  }\n\n  handleContentChanged(): void {\n    const { onContentChanged } = this.props;\n    const value = this.editor?.getModel()?.getValue();\n    if (value !== undefined) {\n      this.setState({ isEditorEmpty: value.length === 0 });\n    }\n    onContentChanged(value);\n  }\n\n  handleEditorFocus(): void {\n    this.setState({ isEditorFocused: true });\n  }\n\n  handleEditorBlur(): void {\n    const value = this.editor?.getModel()?.getValue() ?? '';\n    this.setState({\n      isEditorEmpty: value.length === 0,\n      isEditorFocused: false,\n    });\n  }\n\n  // force editor to focus if clicked\n  handleContainerClick(): void {\n    const { isEditorFocused } = this.state;\n    if (isEditorFocused) {\n      return;\n    }\n    this.editor?.focus();\n  }\n\n  handleKeyDown(event: monaco.IKeyboardEvent): void {\n    const { onTab, editorIndex } = this.props;\n    if (event.code === 'Tab') {\n      event.stopPropagation();\n      event.preventDefault();\n      onTab(editorIndex, event.shiftKey);\n    }\n  }\n\n  render(): ReactElement {\n    const { className, invalid, placeholder = '', value } = this.props;\n    const { isEditorFocused, isEditorEmpty } = this.state;\n    return (\n      <div\n        className={classNames(\n          'input-editor-wrapper',\n          {\n            focused: isEditorFocused,\n            invalid,\n          },\n          className\n        )}\n        role=\"presentation\"\n        onClick={this.handleContainerClick}\n      >\n        <div\n          className=\"editor-container\"\n          ref={editorContainer => {\n            this.editorContainer = editorContainer;\n          }}\n          data-testid=\"custom-column-formula\"\n        />\n        {isEditorEmpty && !value && placeholder.length > 0 && (\n          <div className=\"editor-placeholder text-muted\">{placeholder}</div>\n        )}\n      </div>\n    );\n  }\n}\n\nexport default InputEditor;\n"],"mappings":"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"}