@revolist/revogrid 4.10.21 → 4.10.22

package/dist/revo-grid/revogr-clipboard_3.entry.js.map

@@ -1 +1 @@
-{"version":3,"names":["Clipboard","onPaste","e","this","readonly","clipboardData","getData","isHTML","types","indexOf","data","dataText","beforePaste","emit","raw","event","defaultPrevented","parsedData","detail","table","htmlParse","textParse","beforePasteApply","parsed","pasteRegion","afterPasteApply","preventDefault","copyStarted","beforeCopy","copyRegion","undefined","cutStarted","beforeCut","clearRegion","doCopy","beforeCopyApply","parserCopy","setData","map","rgRow","join","result","rows","split","y","push","fragment","document","createRange","createContextualFragment","querySelector","Array","from","cells","cell","innerText","window","revogrEditStyleCss","RevogrEditStyle0","RevoEdit","currentEditor","preventSaveOnClose","cancelChanges","beforeDisconnect","_b","_a","call","onAutoSave","val","getValue","_c","beforeAutoSave","canSave","onSave","preventFocus","editCell","cellEdit","rgCol","x","type","prop","componentWillRender","column","editor","isEditorCtrConstructible","focusNext","closeEdit","TextEditor","componentDidRender","element","firstElementChild","disconnectedCallback","saveOnClose","render","h","Host","class","EDIT_INPUT_WR","additionalData","RowOrderService","constructor","config","currentCell","previousRow","endOrder","newRow","getCell","positionChanged","clear","startOrder","move","getRow","itemIndex","el","top","getBoundingClientRect","topRelative","getItemByPosition","absolutePosition","start","end","cols","left","leftRelative","OrderEditor","events","rowMoveFunc","debounce","rowOrderService","rowDrag","Object","assign","rowType","dragStart","originalEvent","length","clearOrder","pos","dragStartEvent","rowDragStart","text","DRAGG_TEXT","model","getSourceItem","dataStore","moveMove","mouseUp","mouseLeave","name","listener","addEventListener","forEach","v","removeEventListener","rowDragEnd","rowMouseMove","connectedCallback","to","dropEvent","rowDropped","rowOrderChange","parent","dimensionRow","state","dimensionCol"],"sources":["src/components/clipboard/revogr-clipboard.tsx","src/components/editors/revogr-edit-style.scss?tag=revogr-edit","src/components/editors/revogr-edit.tsx","src/components/order/order-row.service.ts","src/components/order/revogr-order-editor.tsx"],"sourcesContent":["import {\n  Component,\n  Listen,\n  Method,\n  Event,\n  EventEmitter,\n  Prop,\n} from '@stencil/core';\nimport { DataFormat } from '@type';\n/**\n * This Clipboard provides functionality for handling clipboard events in a web application.\n */\n@Component({ tag: 'revogr-clipboard' })\nexport class Clipboard {\n  /**\n   * If readonly mode - disabled Paste event\n   */\n  @Prop() readonly: boolean;\n\n  /**\n   * Paste 1. Fired before paste applied to the grid\n   * defaultPrevented - if true, paste will be canceled\n   */\n  @Event({ eventName: 'beforepaste' }) beforePaste: EventEmitter<{\n    raw: string;\n    isHTML: boolean;\n    event: ClipboardEvent;\n    dataText: string;\n  }>;\n\n  /**\n   * Paste 2. Fired before paste applied to the grid and after data parsed\n   */\n  @Event({ eventName: 'beforepasteapply' })\n  beforePasteApply: EventEmitter<{\n    raw: string;\n    parsed: string[][];\n    event: ClipboardEvent;\n  }>;\n\n  /**\n   * Paste 3. Internal method. When data region is ready pass it to the top.\n   * @property {string[][]} data - data to paste\n   * @property {boolean} defaultPrevented - if true, paste will be canceled\n   */\n  @Event({ eventName: 'pasteregion' })\n  pasteRegion: EventEmitter<string[][]>;\n\n  /**\n   * Paste 4. Fired after paste applied to the grid\n   * defaultPrevented - if true, paste will be canceled\n   */\n  @Event({ eventName: 'afterpasteapply' }) afterPasteApply: EventEmitter<{\n    raw: string;\n    parsed: string[][];\n    event: ClipboardEvent;\n  }>;\n\n  /**\n   * Cut 1. Fired before cut triggered\n   * defaultPrevented - if true, cut will be canceled\n   */\n  @Event({ eventName: 'beforecut' }) beforeCut: EventEmitter<{\n    event: ClipboardEvent;\n  }>;\n\n  /**\n   * Cut 2. Clears region when cut is done\n   */\n  @Event({ eventName: 'clearregion' }) clearRegion: EventEmitter<DataTransfer>;\n\n  /**\n   * Copy 1. Fired before copy triggered\n   * defaultPrevented - if true, copy will be canceled\n   */\n  @Event({ eventName: 'beforecopy' }) beforeCopy: EventEmitter<{\n    event: ClipboardEvent;\n  }>;\n\n  /**\n   * Copy Method 1. Fired before copy applied to the clipboard from outside.\n   * defaultPrevented - if true, copy will be canceled\n   */\n  @Event({ eventName: 'beforecopyapply' }) beforeCopyApply: EventEmitter<{\n    event: DataTransfer;\n    data?: string[][];\n  }>;\n\n  /**\n   * Copy 2. Fired when region copied\n   * defaultPrevented - if true, copy will be canceled\n   */\n  @Event({ eventName: 'copyregion' })\n  copyRegion: EventEmitter<DataTransfer>;\n\n  @Listen('paste', { target: 'document' }) onPaste(e: ClipboardEvent) {\n    // if readonly do nothing\n    if (this.readonly) {\n      return;\n    }\n    const clipboardData = this.getData(e);\n    const isHTML = (clipboardData?.types.indexOf('text/html') || -1) > -1;\n    const data = (isHTML\n      ? clipboardData?.getData('text/html')\n      : clipboardData?.getData('text')) || '';\n    const dataText = clipboardData?.getData('text') || '';\n\n    const beforePaste = this.beforePaste.emit({\n      raw: data,\n      dataText,\n      isHTML,\n      event: e,\n    });\n\n    if (beforePaste.defaultPrevented) {\n      return;\n    }\n\n    let parsedData: string[][];\n    // if html, then search for table if no table fallback to regular text parsing\n    if (beforePaste.detail.isHTML) {\n      const table = this.htmlParse(beforePaste.detail.raw);\n      // fallback to text if not possible to parse as html\n      parsedData = table || this.textParse(dataText || '');\n    } else {\n      parsedData = this.textParse(beforePaste.detail.raw);\n    }\n    const beforePasteApply = this.beforePasteApply.emit({\n      raw: data,\n      parsed: parsedData,\n      event: e,\n    });\n    if (beforePasteApply.defaultPrevented) {\n      return;\n    }\n    this.pasteRegion.emit(beforePasteApply.detail.parsed);\n    // post paste action\n    const afterPasteApply = this.afterPasteApply.emit({\n      raw: data,\n      parsed: parsedData,\n      event: e,\n    });\n    // keep default behavior if needed\n    if (afterPasteApply.defaultPrevented) {\n      return;\n    }\n    e.preventDefault();\n  }\n\n  /**\n   * Listen to copy event and emit copy region event\n   */\n  @Listen('copy', { target: 'document' }) copyStarted(e: ClipboardEvent) {\n    const beforeCopy = this.beforeCopy.emit({\n      event: e,\n    });\n    if (beforeCopy.defaultPrevented) {\n      return;\n    }\n    const data = this.getData(beforeCopy.detail.event);\n    this.copyRegion.emit(data || undefined);\n    e.preventDefault();\n  }\n\n  /**\n   * Listen to copy event and emit copy region event\n   */\n  @Listen('cut', { target: 'document' }) cutStarted(e: ClipboardEvent) {\n    const beforeCut = this.beforeCut.emit({\n      event: e,\n    });\n    if (beforeCut.defaultPrevented) {\n      return;\n    }\n    const data = this.getData(beforeCut.detail.event);\n    this.copyStarted(e);\n\n    // if readonly do nothing\n    if (this.readonly) {\n      return;\n    }\n\n    this.clearRegion.emit(data || undefined);\n    e.preventDefault();\n  }\n\n  @Method() async doCopy(e: DataTransfer, data?: DataFormat[][]) {\n    const beforeCopyApply = this.beforeCopyApply.emit({\n      event: e,\n      data,\n    });\n    if (beforeCopyApply.defaultPrevented) {\n      return;\n    }\n    const parsed = data ? this.parserCopy(data) : '';\n    e.setData('text/plain', parsed);\n  }\n\n  parserCopy(data: DataFormat[][]) {\n    return data.map(rgRow => rgRow.join('\\t')).join('\\n');\n  }\n\n  private textParse(data: string) {\n    const result: string[][] = [];\n    const rows = data.split(/\\r\\n|\\n|\\r/);\n    for (let y in rows) {\n      result.push(rows[y].split('\\t'));\n    }\n    return result;\n  }\n\n  private htmlParse(data: string) {\n    const result: string[][] = [];\n    const fragment = document.createRange().createContextualFragment(data);\n    const table = fragment.querySelector('table');\n    if (!table) {\n      return null;\n    }\n    for (const rgRow of Array.from(table.rows)) {\n      result.push(Array.from(rgRow.cells).map(cell => cell.innerText));\n    }\n    return result;\n  }\n\n  private getData(e: ClipboardEvent) {\n    return (\n      e.clipboardData ||\n      (window as unknown as { clipboardData: DataTransfer | null })\n        ?.clipboardData\n    );\n  }\n}\n","revogr-edit {\n  display: block;\n  position: absolute;\n  background-color: #fff;\n\n  input {\n    height: 100%;\n    width: 100%;\n    box-sizing: border-box;\n  }\n\n  revo-dropdown {\n    height: 100%;\n\n    &.shrink {\n      fieldset legend > span {\n        display: none;\n      }\n    }\n  }\n}\n","import {\n  Component,\n  Event,\n  EventEmitter,\n  Prop,\n  h,\n  Element,\n  Host,\n  Method,\n} from '@stencil/core';\nimport { EDIT_INPUT_WR } from '../../utils/consts';\nimport { TextEditor } from './text-editor';\nimport { ColumnDataSchemaModel } from '@type';\nimport {\n  EditCell,\n  EditorCtr,\n  SaveDataDetails,\n  EditorBase,\n  SaveData,\n} from '@type';\n\nimport { isEditorCtrConstructible } from './edit.utils';\n\n/**\n * Represents a cell editor in a grid.\n * It manages the editing of cells by handling events, saving data, rendering the editor UI,\n * and managing the lifecycle of the editor instance.\n */\n@Component({\n  tag: 'revogr-edit',\n  styleUrl: 'revogr-edit-style.scss',\n})\nexport class RevoEdit {\n  /**\n   * Cell to edit data.\n   */\n  @Prop() editCell: EditCell;\n\n  /**\n   * Column data for editor.\n   */\n  @Prop() column: ColumnDataSchemaModel | null;\n  /**\n   * Custom editors register\n   */\n  @Prop() editor: EditorCtr | null;\n\n  /**\n   * Save on editor close. Defines if data should be saved on editor close.\n   */\n  @Prop() saveOnClose = false;\n  /**\n   * Additional data to pass to renderer\n   */\n  @Prop() additionalData: any;\n\n  /**\n   * Cell edit event\n   */\n  @Event({ eventName: 'celledit' }) cellEdit: EventEmitter<SaveDataDetails>;\n\n  /**\n   * Close editor event\n   * pass true if requires focus next\n   */\n  @Event({ eventName: 'closeedit' }) closeEdit: EventEmitter<\n    boolean | undefined\n  >;\n\n  /** Edit session editor */\n  @Element() element: HTMLElement;\n  private currentEditor: EditorBase | null = null;\n  private preventSaveOnClose = false;\n\n  /**\n   * Cancel pending changes flag. Editor will be closed without autosave.\n   */\n  @Method() async cancelChanges() {\n    this.preventSaveOnClose = true;\n  }\n\n  /**\n   * Before editor got disconnected.\n   * Can be triggered multiple times before actual disconnect.\n   */\n  @Method() async beforeDisconnect() {\n    this.currentEditor?.beforeDisconnect?.();\n  }\n\n  onAutoSave() {\n    this.preventSaveOnClose = true;\n    const val = this.currentEditor?.getValue?.();\n    // For Editor plugin internal usage.\n    // When you want to prevent save and use custom save of your own.\n    if (this.currentEditor?.beforeAutoSave) {\n      const canSave = this.currentEditor.beforeAutoSave(val);\n      if (canSave === false) {\n        return;\n      }\n    }\n    this.onSave(val, true);\n  }\n\n  /**\n   * Callback triggered when cell editor saved.\n   * Closes editor when called.\n   * @param preventFocus - if true, editor will not be closed & next cell will not be focused.\n   */\n  onSave(val?: SaveData, preventFocus?: boolean) {\n    this.preventSaveOnClose = true;\n    if (this.editCell) {\n      this.cellEdit.emit({\n        rgCol: this.editCell.x,\n        rgRow: this.editCell.y,\n        type: this.editCell.type,\n        prop: this.editCell.prop,\n        val,\n        preventFocus,\n      });\n    }\n  }\n\n  componentWillRender() {\n    // Active editor present and not yet closed.\n    if (this.currentEditor || !this.column) {\n      return;\n    }\n    this.preventSaveOnClose = false;\n\n    // Custom editor usage.\n    // Start with TextEditor (editors/text.tsx) for Custom editor.\n    // It can be class or function\n    if (this.editor) {\n      // if editor is constructible\n      if (isEditorCtrConstructible(this.editor)) {\n        this.currentEditor = new this.editor(\n          this.column,\n          // save callback\n          (e, preventFocus) => {\n            this.onSave(e, preventFocus);\n          },\n          // cancel callback\n          focusNext => {\n            this.preventSaveOnClose = true;\n            this.closeEdit.emit(focusNext);\n          },\n        );\n      // if editor is function\n      } else {\n        this.currentEditor = this.editor(\n          this.column,\n          // save callback\n          (e, preventFocus) => {\n            this.onSave(e, preventFocus);\n          },\n          // cancel callback\n          focusNext => {\n            this.preventSaveOnClose = true;\n            this.closeEdit.emit(focusNext);\n          },\n        );\n      }\n      return;\n    }\n    // Default text editor usage\n    this.currentEditor = new TextEditor(this.column, (e, preventFocus) =>\n      this.onSave(e, preventFocus),\n    );\n  }\n\n  componentDidRender() {\n    if (!this.currentEditor) {\n      return;\n    }\n    this.currentEditor.element = this.element.firstElementChild;\n    this.currentEditor.componentDidRender?.();\n  }\n\n  disconnectedCallback() {\n    if (this.saveOnClose) {\n      // Can not be cancelled by `preventSaveOnClose` prop.\n      // Editor requires `getValue` to be able to save.\n      if (!this.preventSaveOnClose) {\n        this.onAutoSave();\n      }\n    }\n\n    this.preventSaveOnClose = false;\n    if (!this.currentEditor) {\n      return;\n    }\n\n    this.currentEditor.disconnectedCallback?.();\n    this.currentEditor.element = null;\n    this.currentEditor = null;\n  }\n\n  render() {\n    if (this.currentEditor) {\n      this.currentEditor.editCell = this.editCell;\n      return (\n        <Host class={EDIT_INPUT_WR}>\n          {this.currentEditor.render(h, this.additionalData)}\n        </Host>\n      );\n    }\n    return '';\n  }\n}\n","import { getItemByPosition } from '@store';\nimport { DimensionSettingsState, PositionItem, Cell } from '@type';\n\ntype EventData = { el: HTMLElement; rows: DimensionSettingsState; cols: DimensionSettingsState };\ninterface Config {\n  positionChanged(from: number, to: number): void;\n}\n\nexport default class RowOrderService {\n  private currentCell: Cell | null = null;\n  private previousRow: number | null = null;\n\n  constructor(private config: Config) {}\n\n  /** Drag finished, calculate and apply changes */\n  endOrder(e: MouseEvent, data: EventData) {\n    if (this.currentCell === null) {\n      return;\n    }\n    const newRow = this.getCell(e, data);\n\n    // if position changed\n    if (newRow.y !== this.currentCell.y) {\n      // rgRow dragged out table\n      if (newRow.y < 0) {\n        newRow.y = 0;\n      }\n      // rgRow dragged to the top\n      else if (newRow.y < this.currentCell.y) {\n        newRow.y++;\n      }\n      this.config.positionChanged(this.currentCell.y, newRow.y);\n    }\n    this.clear();\n  }\n\n  /** Drag started, reserve initial cell for farther use */\n  startOrder(e: MouseEvent, data: EventData): Cell {\n    this.currentCell = this.getCell(e, data);\n    return this.currentCell;\n  }\n\n  move(y: number, data: EventData): PositionItem | null {\n    const rgRow = this.getRow(y, data);\n    // if rgRow same as previous or below range (-1 = 0) do nothing\n    if (this.previousRow === rgRow.itemIndex || rgRow.itemIndex < -1) {\n      return null;\n    }\n    this.previousRow = rgRow.itemIndex;\n    return rgRow;\n  }\n\n  /** Drag stopped, probably cursor outside of document area */\n  clear() {\n    this.currentCell = null;\n    this.previousRow = null;\n  }\n\n  /** Calculate cell based on x, y position */\n  getRow(y: number, { el, rows }: EventData): PositionItem {\n    const { top } = el.getBoundingClientRect();\n    const topRelative = y - top;\n    const rgRow = getItemByPosition(rows, topRelative);\n    const absolutePosition = {\n      itemIndex: rgRow.itemIndex,\n      start: rgRow.start + top,\n      end: rgRow.end + top,\n    };\n    return absolutePosition;\n  }\n\n  /** Calculate cell based on x, y position */\n  getCell({ x, y }: Cell, { el, rows, cols }: EventData): Cell {\n    const { top, left } = el.getBoundingClientRect();\n    const topRelative = y - top;\n    const leftRelative = x - left;\n    const rgRow = getItemByPosition(rows, topRelative);\n    const rgCol = getItemByPosition(cols, leftRelative);\n    return { x: rgCol.itemIndex, y: rgRow.itemIndex };\n  }\n}\n","import { Component, Method, Event, EventEmitter, Prop } from '@stencil/core';\nimport debounce from 'lodash/debounce';\n\nimport { DSourceState, getSourceItem } from '@store';\nimport { DRAGG_TEXT } from '../../utils/consts';\nimport RowOrderService from './order-row.service';\nimport {\n  DimensionRows,\n  DataType,\n  DimensionSettingsState,\n  DragStartEvent,\n  PositionItem,\n  Cell,\n} from '@type';\nimport { Observable } from '../../utils';\n\n/**\n * Component for handling row order editor.\n */\n@Component({ tag: 'revogr-order-editor' })\nexport class OrderEditor {\n  // #region Properties\n  /** Parent element */\n  @Prop() parent: HTMLElement;\n  /** Dimension settings Y */\n  @Prop() dimensionRow: Observable<DimensionSettingsState>;\n  /** Dimension settings X */\n  @Prop() dimensionCol: Observable<DimensionSettingsState>;\n\n  /** Static stores, not expected to change during component lifetime */\n  @Prop() dataStore: Observable<DSourceState<DataType, DimensionRows>>;\n\n  @Prop() rowType: DimensionRows;\n  // #endregion\n\n  // #region Events\n  /** Row drag started */\n  @Event({ eventName: 'rowdragstartinit', cancelable: true })\n  rowDragStart: EventEmitter<{\n    cell: Cell;\n    text: string;\n    pos: PositionItem;\n    event: MouseEvent;\n    rowType: DimensionRows;\n    model: any;\n  }>;\n\n  /** Row drag ended started */\n  @Event({ eventName: 'rowdragendinit' })\n  rowDragEnd: EventEmitter<{ rowType: DimensionRows }>;\n\n  /** Row move started */\n  @Event({ eventName: 'rowdragmoveinit', cancelable: true })\n  rowDrag: EventEmitter<PositionItem & { rowType: DimensionRows }>;\n\n  /** Row mouse move started */\n  @Event({ eventName: 'rowdragmousemove', cancelable: true })\n  rowMouseMove: EventEmitter<Cell & { rowType: DimensionRows }>;\n\n  /** Row dragged, new range ready to be applied */\n  @Event({ eventName: 'rowdropinit', cancelable: true })\n  rowDropped: EventEmitter<{\n    from: number;\n    to: number;\n    rowType: DimensionRows;\n  }>;\n\n  /** Row drag ended finished. Time to apply data */\n  @Event({ eventName: 'roworderchange' })\n  rowOrderChange: EventEmitter<{\n    from: number;\n    to: number;\n    rowType: DimensionRows;\n  }>;\n\n  // #endregion\n\n  // #region Private\n  private rowOrderService: RowOrderService;\n  private events: {\n    name: keyof DocumentEventMap;\n    listener: (e: MouseEvent) => void;\n  }[] = [];\n  private rowMoveFunc = debounce((y: number) => {\n    const rgRow = this.rowOrderService.move(y, this.getData());\n    if (rgRow !== null) {\n      this.rowDrag.emit({\n        ...rgRow,\n        rowType: this.rowType,\n      });\n    }\n  }, 5);\n  // #endregion\n\n  // #region Methods\n  @Method() async dragStart(e: DragStartEvent) {\n    e.originalEvent.preventDefault();\n\n    // extra check if previous ended\n    if (this.events.length) {\n      this.clearOrder();\n    }\n\n    const data = this.getData();\n    const cell = this.rowOrderService.startOrder(e.originalEvent, data);\n    const pos = this.rowOrderService.getRow(e.originalEvent.y, data);\n    const dragStartEvent = this.rowDragStart.emit({\n      cell,\n      text: DRAGG_TEXT,\n      pos,\n      event: e.originalEvent,\n      rowType: this.rowType,\n      model: getSourceItem(this.dataStore, pos.itemIndex),\n    });\n    if (dragStartEvent.defaultPrevented) {\n      return;\n    }\n\n    const moveMove = (e: MouseEvent) => this.move(e);\n    const mouseUp = (e: MouseEvent) => this.endOrder(e);\n    const mouseLeave = () => this.clearOrder();\n\n    this.events.push(\n      {\n        name: 'mousemove',\n        listener: moveMove,\n      },\n      {\n        name: 'mouseup',\n        listener: mouseUp,\n      },\n      {\n        name: 'mouseleave',\n        listener: mouseLeave,\n      },\n    );\n    document.addEventListener('mousemove', moveMove);\n    // Action finished inside of the document\n    document.addEventListener('mouseup', mouseUp);\n    document.addEventListener('mouseleave', mouseLeave);\n  }\n\n  @Method() async endOrder(e: MouseEvent) {\n    this.rowOrderService.endOrder(e, this.getData());\n    this.clearOrder();\n  }\n\n  @Method() async clearOrder() {\n    this.rowOrderService.clear();\n    this.events.forEach(v => document.removeEventListener(v.name, v.listener));\n    this.events.length = 0;\n    this.rowDragEnd.emit({ rowType: this.rowType });\n  }\n  // #endregion\n\n  move({ x, y }: { x: number; y: number }) {\n    this.rowMouseMove.emit({ x, y, rowType: this.rowType });\n    this.rowMoveFunc(y);\n  }\n\n  connectedCallback() {\n    this.rowOrderService = new RowOrderService({\n      positionChanged: (from: number, to: number) => {\n        const dropEvent = this.rowDropped.emit({\n          from,\n          to,\n          rowType: this.rowType,\n        });\n        if (dropEvent.defaultPrevented) {\n          return;\n        }\n        this.rowOrderChange.emit(dropEvent.detail);\n      },\n    });\n  }\n\n  private getData() {\n    return {\n      el: this.parent,\n      rows: this.dimensionRow.state,\n      cols: this.dimensionCol.state,\n    };\n  }\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["Clipboard","onPaste","e","this","readonly","clipboardData","getData","isHTML","types","indexOf","data","dataText","beforePaste","emit","raw","event","defaultPrevented","parsedData","detail","table","htmlParse","textParse","beforePasteApply","parsed","pasteRegion","afterPasteApply","preventDefault","copyStarted","beforeCopy","copyRegion","undefined","cutStarted","beforeCut","clearRegion","doCopy","beforeCopyApply","parserCopy","setData","map","rgRow","join","result","rows","split","y","push","fragment","document","createRange","createContextualFragment","querySelector","Array","from","cells","cell","innerText","window","revogrEditStyleCss","RevogrEditStyle0","RevoEdit","currentEditor","preventSaveOnClose","cancelChanges","beforeDisconnect","_b","_a","call","onAutoSave","val","getValue","_c","beforeAutoSave","canSave","onSave","preventFocus","editCell","cellEdit","rgCol","x","type","prop","componentWillRender","column","editor","isEditorCtrConstructible","focusNext","closeEdit","TextEditor","componentDidRender","element","firstElementChild","disconnectedCallback","saveOnClose","render","h","Host","class","EDIT_INPUT_WR","additionalData","RowOrderService","constructor","config","currentCell","previousRow","endOrder","newRow","getCell","positionChanged","clear","startOrder","move","getRow","itemIndex","el","top","getBoundingClientRect","topRelative","getItemByPosition","absolutePosition","start","end","cols","left","leftRelative","OrderEditor","events","rowMoveFunc","debounce","rowOrderService","rowDrag","Object","assign","rowType","dragStart","originalEvent","length","clearOrder","pos","dragStartEvent","rowDragStart","text","DRAGG_TEXT","model","getSourceItem","dataStore","moveMove","mouseUp","mouseLeave","name","listener","addEventListener","forEach","v","removeEventListener","rowDragEnd","rowMouseMove","connectedCallback","to","dropEvent","rowDropped","rowOrderChange","parent","dimensionRow","state","dimensionCol"],"sources":["src/components/clipboard/revogr-clipboard.tsx","src/components/editors/revogr-edit-style.scss?tag=revogr-edit","src/components/editors/revogr-edit.tsx","src/components/order/order-row.service.ts","src/components/order/revogr-order-editor.tsx"],"sourcesContent":["import {\n  Component,\n  Listen,\n  Method,\n  Event,\n  EventEmitter,\n  Prop,\n} from '@stencil/core';\nimport { DataFormat } from '@type';\n/**\n * This Clipboard provides functionality for handling clipboard events in a web application.\n */\n@Component({ tag: 'revogr-clipboard' })\nexport class Clipboard {\n  /**\n   * If readonly mode - disabled Paste event\n   */\n  @Prop() readonly: boolean;\n\n  /**\n   * Paste 1. Fired before paste applied to the grid\n   * defaultPrevented - if true, paste will be canceled\n   */\n  @Event({ eventName: 'beforepaste' }) beforePaste: EventEmitter<{\n    raw: string;\n    isHTML: boolean;\n    event: ClipboardEvent;\n    dataText: string;\n  }>;\n\n  /**\n   * Paste 2. Fired before paste applied to the grid and after data parsed\n   */\n  @Event({ eventName: 'beforepasteapply' })\n  beforePasteApply: EventEmitter<{\n    raw: string;\n    parsed: string[][];\n    event: ClipboardEvent;\n  }>;\n\n  /**\n   * Paste 3. Internal method. When data region is ready pass it to the top.\n   * @property {string[][]} data - data to paste\n   * @property {boolean} defaultPrevented - if true, paste will be canceled\n   */\n  @Event({ eventName: 'pasteregion' })\n  pasteRegion: EventEmitter<string[][]>;\n\n  /**\n   * Paste 4. Fired after paste applied to the grid\n   * defaultPrevented - if true, paste will be canceled\n   */\n  @Event({ eventName: 'afterpasteapply' }) afterPasteApply: EventEmitter<{\n    raw: string;\n    parsed: string[][];\n    event: ClipboardEvent;\n  }>;\n\n  /**\n   * Cut 1. Fired before cut triggered\n   * defaultPrevented - if true, cut will be canceled\n   */\n  @Event({ eventName: 'beforecut' }) beforeCut: EventEmitter<{\n    event: ClipboardEvent;\n  }>;\n\n  /**\n   * Cut 2. Clears region when cut is done\n   */\n  @Event({ eventName: 'clearregion' }) clearRegion: EventEmitter<DataTransfer>;\n\n  /**\n   * Copy 1. Fired before copy triggered\n   * defaultPrevented - if true, copy will be canceled\n   */\n  @Event({ eventName: 'beforecopy' }) beforeCopy: EventEmitter<{\n    event: ClipboardEvent;\n  }>;\n\n  /**\n   * Copy Method 1. Fired before copy applied to the clipboard from outside.\n   * defaultPrevented - if true, copy will be canceled\n   */\n  @Event({ eventName: 'beforecopyapply' }) beforeCopyApply: EventEmitter<{\n    event: DataTransfer;\n    data?: string[][];\n  }>;\n\n  /**\n   * Copy 2. Fired when region copied\n   * defaultPrevented - if true, copy will be canceled\n   */\n  @Event({ eventName: 'copyregion' })\n  copyRegion: EventEmitter<DataTransfer>;\n\n  @Listen('paste', { target: 'document' }) onPaste(e: ClipboardEvent) {\n    // if readonly do nothing\n    if (this.readonly) {\n      return;\n    }\n    const clipboardData = this.getData(e);\n    const isHTML = (clipboardData?.types.indexOf('text/html') || -1) > -1;\n    const data = (isHTML\n      ? clipboardData?.getData('text/html')\n      : clipboardData?.getData('text')) || '';\n    const dataText = clipboardData?.getData('text') || '';\n\n    const beforePaste = this.beforePaste.emit({\n      raw: data,\n      dataText,\n      isHTML,\n      event: e,\n    });\n\n    if (beforePaste.defaultPrevented) {\n      return;\n    }\n\n    let parsedData: string[][];\n    // if html, then search for table if no table fallback to regular text parsing\n    if (beforePaste.detail.isHTML) {\n      const table = this.htmlParse(beforePaste.detail.raw);\n      // fallback to text if not possible to parse as html\n      parsedData = table || this.textParse(dataText || '');\n    } else {\n      parsedData = this.textParse(beforePaste.detail.raw);\n    }\n    const beforePasteApply = this.beforePasteApply.emit({\n      raw: data,\n      parsed: parsedData,\n      event: e,\n    });\n    if (beforePasteApply.defaultPrevented) {\n      return;\n    }\n    this.pasteRegion.emit(beforePasteApply.detail.parsed);\n    // post paste action\n    const afterPasteApply = this.afterPasteApply.emit({\n      raw: data,\n      parsed: parsedData,\n      event: e,\n    });\n    // keep default behavior if needed\n    if (afterPasteApply.defaultPrevented) {\n      return;\n    }\n    e.preventDefault();\n  }\n\n  /**\n   * Listen to copy event and emit copy region event\n   */\n  @Listen('copy', { target: 'document' }) copyStarted(e: ClipboardEvent) {\n    const beforeCopy = this.beforeCopy.emit({\n      event: e,\n    });\n    if (beforeCopy.defaultPrevented) {\n      return;\n    }\n    const data = this.getData(beforeCopy.detail.event);\n    this.copyRegion.emit(data || undefined);\n    e.preventDefault();\n  }\n\n  /**\n   * Listen to copy event and emit copy region event\n   */\n  @Listen('cut', { target: 'document' }) cutStarted(e: ClipboardEvent) {\n    const beforeCut = this.beforeCut.emit({\n      event: e,\n    });\n    if (beforeCut.defaultPrevented) {\n      return;\n    }\n    const data = this.getData(beforeCut.detail.event);\n    this.copyStarted(e);\n\n    // if readonly do nothing\n    if (this.readonly) {\n      return;\n    }\n\n    this.clearRegion.emit(data || undefined);\n    e.preventDefault();\n  }\n\n  @Method() async doCopy(e: DataTransfer, data?: DataFormat[][]) {\n    const beforeCopyApply = this.beforeCopyApply.emit({\n      event: e,\n      data,\n    });\n    if (beforeCopyApply.defaultPrevented) {\n      return;\n    }\n    const parsed = data ? this.parserCopy(data) : '';\n    e.setData('text/plain', parsed);\n  }\n\n  parserCopy(data: DataFormat[][]) {\n    return data.map(rgRow => rgRow.join('\\t')).join('\\n');\n  }\n\n  private textParse(data: string) {\n    const result: string[][] = [];\n    const rows = data.split(/\\r\\n|\\n|\\r/);\n    for (let y in rows) {\n      result.push(rows[y].split('\\t'));\n    }\n    return result;\n  }\n\n  private htmlParse(data: string) {\n    const result: string[][] = [];\n    const fragment = document.createRange().createContextualFragment(data);\n    const table = fragment.querySelector('table');\n    if (!table) {\n      return null;\n    }\n    for (const rgRow of Array.from(table.rows)) {\n      result.push(Array.from(rgRow.cells).map(cell => cell.innerText));\n    }\n    return result;\n  }\n\n  private getData(e: ClipboardEvent) {\n    return (\n      e.clipboardData ||\n      (window as unknown as { clipboardData: DataTransfer | null })\n        ?.clipboardData\n    );\n  }\n}\n","revogr-edit {\n  display: block;\n  position: absolute;\n  background-color: #fff;\n\n  input {\n    height: 100%;\n    width: 100%;\n    box-sizing: border-box;\n  }\n\n  revo-dropdown {\n    height: 100%;\n\n    &.shrink {\n      fieldset legend > span {\n        display: none;\n      }\n    }\n  }\n}\n","import {\n  Component,\n  Event,\n  EventEmitter,\n  Prop,\n  h,\n  Element,\n  Host,\n  Method,\n} from '@stencil/core';\nimport { EDIT_INPUT_WR } from '../../utils/consts';\nimport { TextEditor } from './text-editor';\nimport { ColumnDataSchemaModel } from '@type';\nimport {\n  EditCell,\n  EditorCtr,\n  SaveDataDetails,\n  EditorBase,\n} from '@type';\n\nimport { isEditorCtrConstructible } from './edit.utils';\n\n/**\n * Represents a cell editor in a grid.\n * It manages the editing of cells by handling events, saving data, rendering the editor UI,\n * and managing the lifecycle of the editor instance.\n */\n@Component({\n  tag: 'revogr-edit',\n  styleUrl: 'revogr-edit-style.scss',\n})\nexport class RevoEdit {\n  /**\n   * Cell to edit data.\n   */\n  @Prop() editCell: EditCell;\n\n  /**\n   * Column data for editor.\n   */\n  @Prop() column: ColumnDataSchemaModel | null;\n  /**\n   * Custom editors register\n   */\n  @Prop() editor: EditorCtr | null;\n\n  /**\n   * Save on editor close. Defines if data should be saved on editor close.\n   */\n  @Prop() saveOnClose = false;\n  /**\n   * Additional data to pass to renderer\n   */\n  @Prop() additionalData: any;\n\n  /**\n   * Cell edit event\n   */\n  @Event({ eventName: 'celledit' }) cellEdit: EventEmitter<SaveDataDetails>;\n\n  /**\n   * Close editor event\n   * pass true if requires focus next\n   */\n  @Event({ eventName: 'closeedit' }) closeEdit: EventEmitter<\n    boolean | undefined\n  >;\n\n  /** Edit session editor */\n  @Element() element: HTMLElement;\n  private currentEditor: EditorBase | null = null;\n  private preventSaveOnClose = false;\n\n  /**\n   * Cancel pending changes flag. Editor will be closed without autosave.\n   */\n  @Method() async cancelChanges() {\n    this.preventSaveOnClose = true;\n  }\n\n  /**\n   * Before editor got disconnected.\n   * Can be triggered multiple times before actual disconnect.\n   */\n  @Method() async beforeDisconnect() {\n    this.currentEditor?.beforeDisconnect?.();\n  }\n\n  onAutoSave() {\n    this.preventSaveOnClose = true;\n    const val = this.currentEditor?.getValue?.();\n    // For Editor plugin internal usage.\n    // When you want to prevent save and use custom save of your own.\n    if (this.currentEditor?.beforeAutoSave) {\n      const canSave = this.currentEditor.beforeAutoSave(val);\n      if (canSave === false) {\n        return;\n      }\n    }\n    this.onSave(val, true);\n  }\n\n  /**\n   * Callback triggered when cell editor saved.\n   * Closes editor when called.\n   * @param preventFocus - if true, editor will not be closed & next cell will not be focused.\n   */\n  onSave(val?: any, preventFocus?: boolean) {\n    this.preventSaveOnClose = true;\n    if (this.editCell) {\n      this.cellEdit.emit({\n        rgCol: this.editCell.x,\n        rgRow: this.editCell.y,\n        type: this.editCell.type,\n        prop: this.editCell.prop,\n        val,\n        preventFocus,\n      });\n    }\n  }\n\n  componentWillRender() {\n    // Active editor present and not yet closed.\n    if (this.currentEditor || !this.column) {\n      return;\n    }\n    this.preventSaveOnClose = false;\n\n    // Custom editor usage.\n    // Start with TextEditor (editors/text.tsx) for Custom editor.\n    // It can be class or function\n    if (this.editor) {\n      // if editor is constructible\n      if (isEditorCtrConstructible(this.editor)) {\n        this.currentEditor = new this.editor(\n          this.column,\n          // save callback\n          (e, preventFocus) => {\n            this.onSave(e, preventFocus);\n          },\n          // cancel callback\n          focusNext => {\n            this.preventSaveOnClose = true;\n            this.closeEdit.emit(focusNext);\n          },\n        );\n      // if editor is function\n      } else {\n        this.currentEditor = this.editor(\n          this.column,\n          // save callback\n          (e, preventFocus) => {\n            this.onSave(e, preventFocus);\n          },\n          // cancel callback\n          focusNext => {\n            this.preventSaveOnClose = true;\n            this.closeEdit.emit(focusNext);\n          },\n        );\n      }\n      return;\n    }\n    // Default text editor usage\n    this.currentEditor = new TextEditor(this.column, (e, preventFocus) =>\n      this.onSave(e, preventFocus),\n    );\n  }\n\n  componentDidRender() {\n    if (!this.currentEditor) {\n      return;\n    }\n    this.currentEditor.element = this.element.firstElementChild;\n    this.currentEditor.componentDidRender?.();\n  }\n\n  disconnectedCallback() {\n    if (this.saveOnClose) {\n      // Can not be cancelled by `preventSaveOnClose` prop.\n      // Editor requires `getValue` to be able to save.\n      if (!this.preventSaveOnClose) {\n        this.onAutoSave();\n      }\n    }\n\n    this.preventSaveOnClose = false;\n    if (!this.currentEditor) {\n      return;\n    }\n\n    this.currentEditor.disconnectedCallback?.();\n    this.currentEditor.element = null;\n    this.currentEditor = null;\n  }\n\n  render() {\n    if (this.currentEditor) {\n      this.currentEditor.editCell = this.editCell;\n      return (\n        <Host class={EDIT_INPUT_WR}>\n          {this.currentEditor.render(h, this.additionalData)}\n        </Host>\n      );\n    }\n    return '';\n  }\n}\n","import { getItemByPosition } from '@store';\nimport { DimensionSettingsState, PositionItem, Cell } from '@type';\n\ntype EventData = { el: HTMLElement; rows: DimensionSettingsState; cols: DimensionSettingsState };\ninterface Config {\n  positionChanged(from: number, to: number): void;\n}\n\nexport default class RowOrderService {\n  private currentCell: Cell | null = null;\n  private previousRow: number | null = null;\n\n  constructor(private config: Config) {}\n\n  /** Drag finished, calculate and apply changes */\n  endOrder(e: MouseEvent, data: EventData) {\n    if (this.currentCell === null) {\n      return;\n    }\n    const newRow = this.getCell(e, data);\n\n    // if position changed\n    if (newRow.y !== this.currentCell.y) {\n      // rgRow dragged out table\n      if (newRow.y < 0) {\n        newRow.y = 0;\n      }\n      // rgRow dragged to the top\n      else if (newRow.y < this.currentCell.y) {\n        newRow.y++;\n      }\n      this.config.positionChanged(this.currentCell.y, newRow.y);\n    }\n    this.clear();\n  }\n\n  /** Drag started, reserve initial cell for farther use */\n  startOrder(e: MouseEvent, data: EventData): Cell {\n    this.currentCell = this.getCell(e, data);\n    return this.currentCell;\n  }\n\n  move(y: number, data: EventData): PositionItem | null {\n    const rgRow = this.getRow(y, data);\n    // if rgRow same as previous or below range (-1 = 0) do nothing\n    if (this.previousRow === rgRow.itemIndex || rgRow.itemIndex < -1) {\n      return null;\n    }\n    this.previousRow = rgRow.itemIndex;\n    return rgRow;\n  }\n\n  /** Drag stopped, probably cursor outside of document area */\n  clear() {\n    this.currentCell = null;\n    this.previousRow = null;\n  }\n\n  /** Calculate cell based on x, y position */\n  getRow(y: number, { el, rows }: EventData): PositionItem {\n    const { top } = el.getBoundingClientRect();\n    const topRelative = y - top;\n    const rgRow = getItemByPosition(rows, topRelative);\n    const absolutePosition = {\n      itemIndex: rgRow.itemIndex,\n      start: rgRow.start + top,\n      end: rgRow.end + top,\n    };\n    return absolutePosition;\n  }\n\n  /** Calculate cell based on x, y position */\n  getCell({ x, y }: Cell, { el, rows, cols }: EventData): Cell {\n    const { top, left } = el.getBoundingClientRect();\n    const topRelative = y - top;\n    const leftRelative = x - left;\n    const rgRow = getItemByPosition(rows, topRelative);\n    const rgCol = getItemByPosition(cols, leftRelative);\n    return { x: rgCol.itemIndex, y: rgRow.itemIndex };\n  }\n}\n","import { Component, Method, Event, EventEmitter, Prop } from '@stencil/core';\nimport debounce from 'lodash/debounce';\n\nimport { DSourceState, getSourceItem } from '@store';\nimport { DRAGG_TEXT } from '../../utils/consts';\nimport RowOrderService from './order-row.service';\nimport {\n  DimensionRows,\n  DataType,\n  DimensionSettingsState,\n  DragStartEvent,\n  PositionItem,\n  Cell,\n} from '@type';\nimport { Observable } from '../../utils';\n\n/**\n * Component for handling row order editor.\n */\n@Component({ tag: 'revogr-order-editor' })\nexport class OrderEditor {\n  // #region Properties\n  /** Parent element */\n  @Prop() parent: HTMLElement;\n  /** Dimension settings Y */\n  @Prop() dimensionRow: Observable<DimensionSettingsState>;\n  /** Dimension settings X */\n  @Prop() dimensionCol: Observable<DimensionSettingsState>;\n\n  /** Static stores, not expected to change during component lifetime */\n  @Prop() dataStore: Observable<DSourceState<DataType, DimensionRows>>;\n\n  @Prop() rowType: DimensionRows;\n  // #endregion\n\n  // #region Events\n  /** Row drag started */\n  @Event({ eventName: 'rowdragstartinit', cancelable: true })\n  rowDragStart: EventEmitter<{\n    cell: Cell;\n    text: string;\n    pos: PositionItem;\n    event: MouseEvent;\n    rowType: DimensionRows;\n    model: any;\n  }>;\n\n  /** Row drag ended started */\n  @Event({ eventName: 'rowdragendinit' })\n  rowDragEnd: EventEmitter<{ rowType: DimensionRows }>;\n\n  /** Row move started */\n  @Event({ eventName: 'rowdragmoveinit', cancelable: true })\n  rowDrag: EventEmitter<PositionItem & { rowType: DimensionRows }>;\n\n  /** Row mouse move started */\n  @Event({ eventName: 'rowdragmousemove', cancelable: true })\n  rowMouseMove: EventEmitter<Cell & { rowType: DimensionRows }>;\n\n  /** Row dragged, new range ready to be applied */\n  @Event({ eventName: 'rowdropinit', cancelable: true })\n  rowDropped: EventEmitter<{\n    from: number;\n    to: number;\n    rowType: DimensionRows;\n  }>;\n\n  /** Row drag ended finished. Time to apply data */\n  @Event({ eventName: 'roworderchange' })\n  rowOrderChange: EventEmitter<{\n    from: number;\n    to: number;\n    rowType: DimensionRows;\n  }>;\n\n  // #endregion\n\n  // #region Private\n  private rowOrderService: RowOrderService;\n  private events: {\n    name: keyof DocumentEventMap;\n    listener: (e: MouseEvent) => void;\n  }[] = [];\n  private rowMoveFunc = debounce((y: number) => {\n    const rgRow = this.rowOrderService.move(y, this.getData());\n    if (rgRow !== null) {\n      this.rowDrag.emit({\n        ...rgRow,\n        rowType: this.rowType,\n      });\n    }\n  }, 5);\n  // #endregion\n\n  // #region Methods\n  @Method() async dragStart(e: DragStartEvent) {\n    e.originalEvent.preventDefault();\n\n    // extra check if previous ended\n    if (this.events.length) {\n      this.clearOrder();\n    }\n\n    const data = this.getData();\n    const cell = this.rowOrderService.startOrder(e.originalEvent, data);\n    const pos = this.rowOrderService.getRow(e.originalEvent.y, data);\n    const dragStartEvent = this.rowDragStart.emit({\n      cell,\n      text: DRAGG_TEXT,\n      pos,\n      event: e.originalEvent,\n      rowType: this.rowType,\n      model: getSourceItem(this.dataStore, pos.itemIndex),\n    });\n    if (dragStartEvent.defaultPrevented) {\n      return;\n    }\n\n    const moveMove = (e: MouseEvent) => this.move(e);\n    const mouseUp = (e: MouseEvent) => this.endOrder(e);\n    const mouseLeave = () => this.clearOrder();\n\n    this.events.push(\n      {\n        name: 'mousemove',\n        listener: moveMove,\n      },\n      {\n        name: 'mouseup',\n        listener: mouseUp,\n      },\n      {\n        name: 'mouseleave',\n        listener: mouseLeave,\n      },\n    );\n    document.addEventListener('mousemove', moveMove);\n    // Action finished inside of the document\n    document.addEventListener('mouseup', mouseUp);\n    document.addEventListener('mouseleave', mouseLeave);\n  }\n\n  @Method() async endOrder(e: MouseEvent) {\n    this.rowOrderService.endOrder(e, this.getData());\n    this.clearOrder();\n  }\n\n  @Method() async clearOrder() {\n    this.rowOrderService.clear();\n    this.events.forEach(v => document.removeEventListener(v.name, v.listener));\n    this.events.length = 0;\n    this.rowDragEnd.emit({ rowType: this.rowType });\n  }\n  // #endregion\n\n  move({ x, y }: { x: number; y: number }) {\n    this.rowMouseMove.emit({ x, y, rowType: this.rowType });\n    this.rowMoveFunc(y);\n  }\n\n  connectedCallback() {\n    this.rowOrderService = new RowOrderService({\n      positionChanged: (from: number, to: number) => {\n        const dropEvent = this.rowDropped.emit({\n          from,\n          to,\n          rowType: this.rowType,\n        });\n        if (dropEvent.defaultPrevented) {\n          return;\n        }\n        this.rowOrderChange.emit(dropEvent.detail);\n      },\n    });\n  }\n\n  private getData() {\n    return {\n      el: this.parent,\n      rows: this.dimensionRow.state,\n      cols: this.dimensionCol.state,\n    };\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/revo-grid/text-editor-c799aad2.js.map

@@ -1 +1 @@
-{"version":3,"names":["TextEditor","constructor","data","saveCallback","this","editInput","element","editCell","undefined","componentDidRender","timeout","_a","focus","onKeyDown","e","isEnter","isEnterKeyValue","key","isKeyTab","isTab","target","isComposing","beforeDisconnect","getValue","blur","value","render","h","_additionalData","type","enterKeyHint","_b","val","ref","el"],"sources":["src/components/editors/text-editor.ts"],"sourcesContent":["import { type VNode, h as createElement } from '@stencil/core';\nimport { isEnterKeyValue, isTab } from '../../utils/key.utils';\nimport { timeout } from '../../utils';\nimport { ColumnDataSchemaModel } from '@type';\nimport { EditCell, EditorBase, SaveData } from '@type';\n\n/**\n * Represents a cell editor in a grid.\n *\n * It's a good place to start with your own editor.\n * It manages the editing of cells by handling events, saving data, rendering the editor UI, and managing the lifecycle of the editor instance.\n */\n\n/**\n * Callback triggered on cell editor save\n * Closes editor when called\n * @param preventFocus - if true editor will not be closed and next cell will not be focused\n */\nexport type SaveCallback = (value: SaveData | undefined, preventFocus: boolean) => void;\n\nexport class TextEditor implements EditorBase {\n  editInput: HTMLInputElement | null = null;\n\n  element: Element | null = null;\n  editCell?: EditCell = undefined;\n\n  constructor(\n    public data: ColumnDataSchemaModel,\n    private saveCallback?: SaveCallback,\n  ) {}\n\n  /**\n   * Callback triggered on cell editor render\n   */\n  async componentDidRender(): Promise<void> {\n    if (this.editInput) {\n      await timeout();\n      this.editInput?.focus();\n    }\n  }\n\n  onKeyDown(e: KeyboardEvent) {\n    const isEnter = isEnterKeyValue(e.key);\n    const isKeyTab = isTab(e.key);\n\n    if (\n      (isKeyTab || isEnter) &&\n      e.target &&\n      this.saveCallback &&\n      !e.isComposing\n    ) {\n      // blur is needed to avoid autoscroll\n      this.beforeDisconnect();\n      // request callback which will close cell after all\n      this.saveCallback(this.getValue(), isKeyTab);\n    }\n  }\n\n  /**\n   * IMPORTANT: Prevent scroll glitches when editor is closed and focus is on current input element.\n   */\n  beforeDisconnect() {\n    this.editInput?.blur();\n  }\n\n  /**\n   * Get value from input\n   */\n  getValue() {\n    return this.editInput?.value;\n  }\n\n  /**\n   * Render method for Editor plugin.\n   * Renders input element with passed data from cell.\n   *\n   * @required @method\n   * @param {Function} h - h function from stencil render.\n   * @param {Object} _additionalData - additional data from plugin.\n   * @returns {VNode} - input element.\n   */\n  render(h: typeof createElement, _additionalData: any): VNode | VNode[] {\n    return h('input', {\n      type: 'text',\n      enterKeyHint: 'enter',\n      // set input value from cell data\n      value: this.editCell?.val ?? '',\n      // save input element as ref for further usage\n      ref: (el: HTMLInputElement | null) => {\n        this.editInput = el;\n      },\n      // listen to keydown event on input element\n      onKeyDown: (e: KeyboardEvent) => this.onKeyDown(e),\n    });\n  }\n}\n"],"mappings":";;;6GAoBaA,EAMX,WAAAC,CACSC,EACCC,GADDC,KAAAF,OACCE,KAAAD,eAPVC,KAAAC,UAAqC,KAErCD,KAAAE,QAA0B,KAC1BF,KAAAG,SAAsBC,S,CAUtB,wBAAMC,G,MACJ,GAAIL,KAAKC,UAAW,OACZK,KACNC,EAAAP,KAAKC,aAAS,MAAAM,SAAA,SAAAA,EAAEC,O,EAIpB,SAAAC,CAAUC,GACR,MAAMC,EAAUC,EAAgBF,EAAEG,KAClC,MAAMC,EAAWC,EAAML,EAAEG,KAEzB,IACGC,GAAYH,IACbD,EAAEM,QACFhB,KAAKD,eACJW,EAAEO,YACH,CAEAjB,KAAKkB,mBAELlB,KAAKD,aAAaC,KAAKmB,WAAYL,E,EAOvC,gBAAAI,G,OACEX,EAAAP,KAAKC,aAAS,MAAAM,SAAA,SAAAA,EAAEa,M,CAMlB,QAAAD,G,MACE,OAAOZ,EAAAP,KAAKC,aAAS,MAAAM,SAAA,SAAAA,EAAEc,K,CAYzB,MAAAC,CAAOC,EAAyBC,G,QAC9B,OAAOD,EAAE,QAAS,CAChBE,KAAM,OACNC,aAAc,QAEdL,OAAOM,GAAApB,EAAAP,KAAKG,YAAQ,MAAAI,SAAA,SAAAA,EAAEqB,OAAG,MAAAD,SAAA,EAAAA,EAAI,GAE7BE,IAAMC,IACJ9B,KAAKC,UAAY6B,CAAE,EAGrBrB,UAAYC,GAAqBV,KAAKS,UAAUC,I","ignoreList":[]}
+{"version":3,"names":["TextEditor","constructor","data","saveCallback","this","editInput","element","editCell","undefined","componentDidRender","timeout","_a","focus","onKeyDown","e","isEnter","isEnterKeyValue","key","isKeyTab","isTab","target","isComposing","beforeDisconnect","getValue","blur","value","render","h","_additionalData","type","enterKeyHint","_b","val","ref","el"],"sources":["src/components/editors/text-editor.ts"],"sourcesContent":["import { type VNode, h as createElement } from '@stencil/core';\nimport { isEnterKeyValue, isTab } from '../../utils/key.utils';\nimport { timeout } from '../../utils';\nimport type { EditCell, EditorBase, ColumnDataSchemaModel } from '@type';\n\n/**\n * Represents a cell editor in a grid.\n *\n * It's a good place to start with your own editor.\n * It manages the editing of cells by handling events, saving data, rendering the editor UI, and managing the lifecycle of the editor instance.\n */\n\n/**\n * Callback triggered on cell editor save\n * Closes editor when called\n * @param preventFocus - if true editor will not be closed and next cell will not be focused\n */\nexport type SaveCallback = (value: any, preventFocus: boolean) => void;\n\nexport class TextEditor implements EditorBase {\n  editInput: HTMLInputElement | null = null;\n\n  element: Element | null = null;\n  editCell?: EditCell = undefined;\n\n  constructor(\n    public data: ColumnDataSchemaModel,\n    private saveCallback?: SaveCallback,\n  ) {}\n\n  /**\n   * Callback triggered on cell editor render\n   */\n  async componentDidRender(): Promise<void> {\n    if (this.editInput) {\n      await timeout();\n      this.editInput?.focus();\n    }\n  }\n\n  onKeyDown(e: KeyboardEvent) {\n    const isEnter = isEnterKeyValue(e.key);\n    const isKeyTab = isTab(e.key);\n\n    if (\n      (isKeyTab || isEnter) &&\n      e.target &&\n      this.saveCallback &&\n      !e.isComposing\n    ) {\n      // blur is needed to avoid autoscroll\n      this.beforeDisconnect();\n      // request callback which will close cell after all\n      this.saveCallback(this.getValue(), isKeyTab);\n    }\n  }\n\n  /**\n   * IMPORTANT: Prevent scroll glitches when editor is closed and focus is on current input element.\n   */\n  beforeDisconnect() {\n    this.editInput?.blur();\n  }\n\n  /**\n   * Get value from input\n   */\n  getValue() {\n    return this.editInput?.value;\n  }\n\n  /**\n   * Render method for Editor plugin.\n   * Renders input element with passed data from cell.\n   *\n   * @required @method\n   * @param {Function} h - h function from stencil render.\n   * @param {Object} _additionalData - additional data from plugin.\n   * @returns {VNode} - input element.\n   */\n  render(h: typeof createElement, _additionalData: any): VNode | VNode[] {\n    return h('input', {\n      type: 'text',\n      enterKeyHint: 'enter',\n      // set input value from cell data\n      value: this.editCell?.val ?? '',\n      // save input element as ref for further usage\n      ref: (el: HTMLInputElement | null) => {\n        this.editInput = el;\n      },\n      // listen to keydown event on input element\n      onKeyDown: (e: KeyboardEvent) => this.onKeyDown(e),\n    });\n  }\n}\n"],"mappings":";;;6GAmBaA,EAMX,WAAAC,CACSC,EACCC,GADDC,KAAAF,OACCE,KAAAD,eAPVC,KAAAC,UAAqC,KAErCD,KAAAE,QAA0B,KAC1BF,KAAAG,SAAsBC,S,CAUtB,wBAAMC,G,MACJ,GAAIL,KAAKC,UAAW,OACZK,KACNC,EAAAP,KAAKC,aAAS,MAAAM,SAAA,SAAAA,EAAEC,O,EAIpB,SAAAC,CAAUC,GACR,MAAMC,EAAUC,EAAgBF,EAAEG,KAClC,MAAMC,EAAWC,EAAML,EAAEG,KAEzB,IACGC,GAAYH,IACbD,EAAEM,QACFhB,KAAKD,eACJW,EAAEO,YACH,CAEAjB,KAAKkB,mBAELlB,KAAKD,aAAaC,KAAKmB,WAAYL,E,EAOvC,gBAAAI,G,OACEX,EAAAP,KAAKC,aAAS,MAAAM,SAAA,SAAAA,EAAEa,M,CAMlB,QAAAD,G,MACE,OAAOZ,EAAAP,KAAKC,aAAS,MAAAM,SAAA,SAAAA,EAAEc,K,CAYzB,MAAAC,CAAOC,EAAyBC,G,QAC9B,OAAOD,EAAE,QAAS,CAChBE,KAAM,OACNC,aAAc,QAEdL,OAAOM,GAAApB,EAAAP,KAAKG,YAAQ,MAAAI,SAAA,SAAAA,EAAEqB,OAAG,MAAAD,SAAA,EAAAA,EAAI,GAE7BE,IAAMC,IACJ9B,KAAKC,UAAY6B,CAAE,EAGrBrB,UAAYC,GAAqBV,KAAKS,UAAUC,I","ignoreList":[]}

package/dist/types/components/editors/revogr-edit.d.ts

@@ -1,6 +1,6 @@
 import { EventEmitter } from '../../stencil-public-runtime';
 import { ColumnDataSchemaModel } from "../../types/index";
-import { EditCell, EditorCtr, SaveDataDetails, SaveData } from "../../types/index";
+import { EditCell, EditorCtr, SaveDataDetails } from "../../types/index";
 /**
  * Represents a cell editor in a grid.
  * It manages the editing of cells by handling events, saving data, rendering the editor UI,
@@ -55,7 +55,7 @@ export declare class RevoEdit {
      * Closes editor when called.
      * @param preventFocus - if true, editor will not be closed & next cell will not be focused.
      */
-    onSave(val?: SaveData, preventFocus?: boolean): void;
+    onSave(val?: any, preventFocus?: boolean): void;
     componentWillRender(): void;
     componentDidRender(): void;
     disconnectedCallback(): void;

package/dist/types/components/editors/text-editor.d.ts

@@ -1,6 +1,5 @@
 import { type VNode, h as createElement } from '../../stencil-public-runtime';
-import { ColumnDataSchemaModel } from "../../types/index";
-import { EditCell, EditorBase, SaveData } from "../../types/index";
+import type { EditCell, EditorBase, ColumnDataSchemaModel } from "../../types/index";
 /**
  * Represents a cell editor in a grid.
  *
@@ -12,7 +11,7 @@ import { EditCell, EditorBase, SaveData } from "../../types/index";
  * Closes editor when called
  * @param preventFocus - if true editor will not be closed and next cell will not be focused
  */
-export type SaveCallback = (value: SaveData | undefined, preventFocus: boolean) => void;
+export type SaveCallback = (value: any, preventFocus: boolean) => void;
 export declare class TextEditor implements EditorBase {
     data: ColumnDataSchemaModel;
     private saveCallback?;

package/dist/types/components/overlay/revogr-overlay-selection.d.ts

@@ -210,7 +210,7 @@ export declare class OverlaySelection {
     /**
      * Selection & Keyboard
      */
-    selectionServiceSet(s: Observable<SelectionStoreState>): void;
+    selectionServiceSet(selectionStore: Observable<SelectionStoreState>): void;
     /** Autofill */
     createAutoFillService(): void;
     /** Columns */

package/dist/types/components/revoGrid/revo-grid.d.ts

@@ -431,13 +431,19 @@ export declare class RevoGridComponent {
      */
     refresh(type?: DimensionRows | 'all'): Promise<void>;
     /**
-     * Sets data at specified cell.
+     * Refreshes data at specified cell.
      * Useful for performance optimization.
      * No viewport update will be triggered.
+     *
+     * @example
+     * const grid = document.querySelector('revo-grid');
+     * grid.setDataAt({ row: 0, col: 0, val: 'test' }); // refresh
      */
-    setDataAt(data: {
+    setDataAt({ row, col, colType, rowType, val, skipDataUpdate }: {
         row: number;
         col: number;
+        val?: any;
+        skipDataUpdate?: boolean;
     } & AllDimensionType): Promise<void | undefined>;
     /**
      * Scrolls viewport to specified row by index.

package/dist/types/components.d.ts

@@ -256,9 +256,10 @@ export namespace Components {
          */
         "setCellsFocus": (cellStart?: Cell, cellEnd?: Cell, colType?: string, rowType?: string) => Promise<void>;
         /**
-          * Sets data at specified cell. Useful for performance optimization. No viewport update will be triggered.
+          * Refreshes data at specified cell. Useful for performance optimization. No viewport update will be triggered.
+          * @example const grid = document.querySelector('revo-grid'); grid.setDataAt({ row: 0, col: 0, val: 'test' }); // refresh
          */
-        "setDataAt": (data: { row: number; col: number; } & AllDimensionType) => Promise<void | undefined>;
+        "setDataAt": ({ row, col, colType, rowType, val, skipDataUpdate }: { row: number; col: number; val?: any; skipDataUpdate?: boolean; } & AllDimensionType) => Promise<void | undefined>;
         /**
           * Source - defines main data source. Can be an Object or 2 dimensional array([][]); Keys/indexes referenced from columns Prop.
          */
@@ -2023,11 +2024,11 @@ declare namespace LocalJSX {
         /**
           * Column data store.
          */
-        "colData"?: Observable<DSourceState<ColumnRegular, DimensionCols>>;
+        "colData": Observable<DSourceState<ColumnRegular, DimensionCols>>;
         /**
           * Row data store.
          */
-        "dataStore"?: Observable<DSourceState<DataType, DimensionRows>>;
+        "dataStore": Observable<DSourceState<DataType, DimensionRows>>;
         /**
           * Dimension settings X.
          */
@@ -2159,7 +2160,7 @@ declare namespace LocalJSX {
         /**
           * Selection, range, focus.
          */
-        "selectionStore"?: Observable<SelectionStoreState>;
+        "selectionStore": Observable<SelectionStoreState>;
         /**
           * Enable revogr-clipboard component (read more in revogr-clipboard component). Allows copy/paste.
          */

package/dist/types/services/data.provider.d.ts

@@ -23,7 +23,7 @@ export declare class DataProvider {
         from: number;
         to: number;
     }): void;
-    setCellData({ type, rowIndex, prop, val }: BeforeSaveDataDetails, mutate?: boolean): void;
+    setCellData({ type, rowIndex, prop, val }: Pick<BeforeSaveDataDetails, 'type' | 'rowIndex' | 'prop' | 'val'>, mutate?: boolean): void;
     setRangeData(data: DataLookup, type: DimensionRows): void;
     refresh(type?: DimensionRows | 'all'): void;
     refreshItems(type?: DimensionRows): void;

package/dist/types/types/selection.d.ts

@@ -81,7 +81,6 @@ export type RangeAreaCss = {
     width: string;
     height: string;
 };
-export type SaveData = string;
 export type SaveDataDetails = {
     rgRow: RowIndex;
     rgCol: ColIndex;
@@ -95,7 +94,7 @@ export interface BeforeSaveDataDetails extends ColumnDataSchemaModel {
     /**
      * Value from editor to save, not part of the model value yet
      */
-    val?: SaveData;
+    val?: any;
 }
 export type BeforeRangeSaveDataDetails = {
     data: DataLookup;
@@ -107,7 +106,7 @@ export type AfterEditEvent = BeforeRangeSaveDataDetails | BeforeSaveDataDetails;
  * Edit cell info for store
  */
 export interface EditCellStore extends Cell {
-    val?: SaveData;
+    val?: any;
 }
 /**
  * Edit cell info for editor
@@ -127,13 +126,13 @@ export type EditorCtr = EditorCtrCallable | EditorCtrConstructible;
  * Editor component callable function
  */
 export type EditorCtrCallable = {
-    (column: ColumnDataSchemaModel, save: (value: SaveData, preventFocus?: boolean) => void, close: (focusNext?: boolean) => void): EditorBase;
+    (column: ColumnDataSchemaModel, save: (value?: any, preventFocus?: boolean) => void, close: (focusNext?: boolean) => void): EditorBase;
 };
 /**
  * Editor component constructible class
  */
 export interface EditorCtrConstructible {
-    new (column: ColumnDataSchemaModel, save: (value: SaveData, preventFocus?: boolean) => void, close: (focusNext?: boolean) => void): EditorBase;
+    new (column: ColumnDataSchemaModel, save: (value: any, preventFocus?: boolean) => void, close: (focusNext?: boolean) => void): EditorBase;
 }
 /**
  * Editor interface

package/dist/types/types/viewport.interfaces.d.ts

@@ -24,8 +24,6 @@ export type ViewportColumn = {
     colStore: Observable<DSourceState<ColumnRegular, DimensionCols>>;
 } & Partial<JSX.RevogrViewportScroll> & Partial<JSX.RevogrHeader>;
 export type ViewportData = {
-    /** Selection connection */
-    segmentSelectionStore: Observable<SelectionStoreState>;
     /** Slot to put data */
     slot: SlotType;
     style?: {

package/hydrate/index.js

@@ -9506,13 +9506,13 @@ class OverlaySelection {
     /**
      * Selection & Keyboard
      */
-    selectionServiceSet(s) {
+    selectionServiceSet(selectionStore) {
         // clear subscriptions
         this.unsubscribeSelectionStore.forEach(v => v());
         this.unsubscribeSelectionStore.length = 0;
-        this.unsubscribeSelectionStore.push(s.onChange('nextFocus', v => v && this.doFocus(v, v)));
+        this.unsubscribeSelectionStore.push(selectionStore.onChange('nextFocus', v => v && this.doFocus(v, v)));
         this.keyboardService = new KeyboardService({
-            selectionStore: s,
+            selectionStore,
             range: r => !!r && this.triggerRangeEvent(r),
             focus: (f, changes, focusNextViewport) => {
                 if (focusNextViewport) {
@@ -9651,7 +9651,7 @@ class OverlaySelection {
                 nodes.push(hAsync("revogr-order-editor", { ref: e => (this.orderEditor = e), dataStore: this.dataStore, dimensionRow: this.dimensionRow, dimensionCol: this.dimensionCol, parent: this.element, rowType: this.types.rowType, onRowdragstartinit: e => this.rowDragStart(e) }));
             }
         }
-        return (hAsync(Host, { key: 'fd6df8683517315fb5cfdd70578a2cec1887aa5a', class: { mobile: this.isMobileDevice }, onDblClick: (e) => this.onElementDblClick(e), onMouseDown: (e) => this.onElementMouseDown(e), onTouchStart: (e) => this.onElementMouseDown(e, true) }, nodes, hAsync("slot", { key: '80a81a3492fbb6900690ce8a1fd0103e2f611d7e', name: "data" })));
+        return (hAsync(Host, { key: '16eb46317cda519daf53f0b347700e8c1cdbd144', class: { mobile: this.isMobileDevice }, onDblClick: (e) => this.onElementDblClick(e), onMouseDown: (e) => this.onElementMouseDown(e), onTouchStart: (e) => this.onElementMouseDown(e, true) }, nodes, hAsync("slot", { key: '8e71ab9946f8b8251aaee867c6551e1fada92c6d', name: "data" })));
     }
     /**
      * Executes the focus operation on the specified range of cells.
@@ -12713,7 +12713,7 @@ class ViewportService {
                 segmentSelection.setLastCell(rgRow.lastCell);
                 // register selection store for Row
                 const rowSelectionStore = this.registerRow(rgRow.position.y, rgRow.type);
-                const rowDef = Object.assign(Object.assign({ colType: val }, rgRow), { rowSelectionStore, segmentSelectionStore: segmentSelection.store, ref: (e) => config.selectionStoreConnector.registerSection(e), onSetrange: e => {
+                const rowDef = Object.assign(Object.assign({ colType: val }, rgRow), { rowSelectionStore, selectionStore: segmentSelection.store, ref: (e) => config.selectionStoreConnector.registerSection(e), onSetrange: e => {
                         segmentSelection.setRangeArea(e.detail);
                     }, onSettemprange: e => segmentSelection.setTempArea(e.detail), onFocuscell: e => {
                         // todo: multi focus
@@ -13916,15 +13916,27 @@ class RevoGridComponent {
         this.dataProvider.refresh(type);
     }
     /**
-     * Sets data at specified cell.
+     * Refreshes data at specified cell.
      * Useful for performance optimization.
      * No viewport update will be triggered.
+     *
+     * @example
+     * const grid = document.querySelector('revo-grid');
+     * grid.setDataAt({ row: 0, col: 0, val: 'test' }); // refresh
      */
-    async setDataAt(data) {
-        const dataElement = this.element.querySelector(`revogr-data[type="${data.rowType}"][col-type="${data.colType}"]`);
+    async setDataAt({ row, col, colType = 'rgCol', rowType = 'rgRow', val, skipDataUpdate = false }) {
+        if (this.dataProvider && !skipDataUpdate) {
+            this.dataProvider.setCellData({
+                type: rowType,
+                rowIndex: row,
+                prop: col,
+                val,
+            }, false);
+        }
+        const dataElement = this.element.querySelector(`revogr-data[type="${rowType}"][col-type="${colType}"]`);
         return dataElement === null || dataElement === void 0 ? void 0 : dataElement.updateCell({
-            row: data.row,
-            col: data.col,
+            row,
+            col,
         });
     }
     /**
@@ -14627,13 +14639,13 @@ class RevoGridComponent {
             // Render viewport data (vertical sections)
             view.dataPorts.forEach(data => {
                 const key = `${data.type}_${view.type}`;
-                const dataView = (hAsync("revogr-overlay-selection", Object.assign({}, data, { isMobileDevice: isMobile, selectionStore: data.segmentSelectionStore, onSelectall: () => { var _a; return (_a = this.selectionStoreConnector) === null || _a === void 0 ? void 0 : _a.selectAll(); }, editors: this.editors, readonly: this.readonly, range: this.range, useClipboard: this.useClipboard, applyChangesOnClose: this.applyOnClose, additionalData: this.additionalData, slot: data.slot, onBeforenextvpfocus: (e) => { var _a; return (_a = this.selectionStoreConnector) === null || _a === void 0 ? void 0 : _a.beforeNextFocusCell(e.detail); }, onCanceledit: () => { var _a; return (_a = this.selectionStoreConnector) === null || _a === void 0 ? void 0 : _a.setEdit(false); }, onSetedit: ({ detail }) => {
+                const dataView = (hAsync("revogr-overlay-selection", Object.assign({}, data, { isMobileDevice: isMobile, onSelectall: () => { var _a; return (_a = this.selectionStoreConnector) === null || _a === void 0 ? void 0 : _a.selectAll(); }, editors: this.editors, readonly: this.readonly, range: this.range, useClipboard: this.useClipboard, applyChangesOnClose: this.applyOnClose, additionalData: this.additionalData, slot: data.slot, onBeforenextvpfocus: (e) => { var _a; return (_a = this.selectionStoreConnector) === null || _a === void 0 ? void 0 : _a.beforeNextFocusCell(e.detail); }, onCanceledit: () => { var _a; return (_a = this.selectionStoreConnector) === null || _a === void 0 ? void 0 : _a.setEdit(false); }, onSetedit: ({ detail }) => {
                         var _a;
                         const event = this.beforeeditstart.emit(detail);
                         if (!event.defaultPrevented) {
                             (_a = this.selectionStoreConnector) === null || _a === void 0 ? void 0 : _a.setEdit(detail.val);
                         }
-                    } }), hAsync("revogr-data", Object.assign({}, data, { colType: view.type, key: key, readonly: this.readonly, range: this.range, rowClass: this.rowClass, rowSelectionStore: data.rowSelectionStore, additionalData: this.additionalData, jobsBeforeRender: this.jobsBeforeRender, slot: DATA_SLOT }), hAsync("slot", { name: `data-${view.type}-${data.type}` })), hAsync("revogr-temp-range", { selectionStore: data.segmentSelectionStore, dimensionRow: data.dimensionRow, dimensionCol: data.dimensionCol }), hAsync("revogr-focus", { colData: data.colData, dataStore: data.dataStore, focusTemplate: this.focusTemplate, rowType: data.type, colType: view.type, selectionStore: data.segmentSelectionStore, dimensionRow: data.dimensionRow, dimensionCol: data.dimensionCol }, hAsync("slot", { name: `focus-${view.type}-${data.type}` }))));
+                    } }), hAsync("revogr-data", Object.assign({}, data, { colType: view.type, key: key, readonly: this.readonly, range: this.range, rowClass: this.rowClass, rowSelectionStore: data.rowSelectionStore, additionalData: this.additionalData, jobsBeforeRender: this.jobsBeforeRender, slot: DATA_SLOT }), hAsync("slot", { name: `data-${view.type}-${data.type}` })), hAsync("revogr-temp-range", { selectionStore: data.selectionStore, dimensionRow: data.dimensionRow, dimensionCol: data.dimensionCol }), hAsync("revogr-focus", { colData: data.colData, dataStore: data.dataStore, focusTemplate: this.focusTemplate, rowType: data.type, colType: view.type, selectionStore: data.selectionStore, dimensionRow: data.dimensionRow, dimensionCol: data.dimensionCol }, hAsync("slot", { name: `focus-${view.type}-${data.type}` }))));
                 dataViews.push(dataView);
             });
             // Add viewport scroll in the end

package/hydrate/index.mjs

@@ -9502,13 +9502,13 @@ class OverlaySelection {
     /**
      * Selection & Keyboard
      */
-    selectionServiceSet(s) {
+    selectionServiceSet(selectionStore) {
         // clear subscriptions
         this.unsubscribeSelectionStore.forEach(v => v());
         this.unsubscribeSelectionStore.length = 0;
-        this.unsubscribeSelectionStore.push(s.onChange('nextFocus', v => v && this.doFocus(v, v)));
+        this.unsubscribeSelectionStore.push(selectionStore.onChange('nextFocus', v => v && this.doFocus(v, v)));
         this.keyboardService = new KeyboardService({
-            selectionStore: s,
+            selectionStore,
             range: r => !!r && this.triggerRangeEvent(r),
             focus: (f, changes, focusNextViewport) => {
                 if (focusNextViewport) {
@@ -9647,7 +9647,7 @@ class OverlaySelection {
                 nodes.push(hAsync("revogr-order-editor", { ref: e => (this.orderEditor = e), dataStore: this.dataStore, dimensionRow: this.dimensionRow, dimensionCol: this.dimensionCol, parent: this.element, rowType: this.types.rowType, onRowdragstartinit: e => this.rowDragStart(e) }));
             }
         }
-        return (hAsync(Host, { key: 'fd6df8683517315fb5cfdd70578a2cec1887aa5a', class: { mobile: this.isMobileDevice }, onDblClick: (e) => this.onElementDblClick(e), onMouseDown: (e) => this.onElementMouseDown(e), onTouchStart: (e) => this.onElementMouseDown(e, true) }, nodes, hAsync("slot", { key: '80a81a3492fbb6900690ce8a1fd0103e2f611d7e', name: "data" })));
+        return (hAsync(Host, { key: '16eb46317cda519daf53f0b347700e8c1cdbd144', class: { mobile: this.isMobileDevice }, onDblClick: (e) => this.onElementDblClick(e), onMouseDown: (e) => this.onElementMouseDown(e), onTouchStart: (e) => this.onElementMouseDown(e, true) }, nodes, hAsync("slot", { key: '8e71ab9946f8b8251aaee867c6551e1fada92c6d', name: "data" })));
     }
     /**
      * Executes the focus operation on the specified range of cells.
@@ -12709,7 +12709,7 @@ class ViewportService {
                 segmentSelection.setLastCell(rgRow.lastCell);
                 // register selection store for Row
                 const rowSelectionStore = this.registerRow(rgRow.position.y, rgRow.type);
-                const rowDef = Object.assign(Object.assign({ colType: val }, rgRow), { rowSelectionStore, segmentSelectionStore: segmentSelection.store, ref: (e) => config.selectionStoreConnector.registerSection(e), onSetrange: e => {
+                const rowDef = Object.assign(Object.assign({ colType: val }, rgRow), { rowSelectionStore, selectionStore: segmentSelection.store, ref: (e) => config.selectionStoreConnector.registerSection(e), onSetrange: e => {
                         segmentSelection.setRangeArea(e.detail);
                     }, onSettemprange: e => segmentSelection.setTempArea(e.detail), onFocuscell: e => {
                         // todo: multi focus
@@ -13912,15 +13912,27 @@ class RevoGridComponent {
         this.dataProvider.refresh(type);
     }
     /**
-     * Sets data at specified cell.
+     * Refreshes data at specified cell.
      * Useful for performance optimization.
      * No viewport update will be triggered.
+     *
+     * @example
+     * const grid = document.querySelector('revo-grid');
+     * grid.setDataAt({ row: 0, col: 0, val: 'test' }); // refresh
      */
-    async setDataAt(data) {
-        const dataElement = this.element.querySelector(`revogr-data[type="${data.rowType}"][col-type="${data.colType}"]`);
+    async setDataAt({ row, col, colType = 'rgCol', rowType = 'rgRow', val, skipDataUpdate = false }) {
+        if (this.dataProvider && !skipDataUpdate) {
+            this.dataProvider.setCellData({
+                type: rowType,
+                rowIndex: row,
+                prop: col,
+                val,
+            }, false);
+        }
+        const dataElement = this.element.querySelector(`revogr-data[type="${rowType}"][col-type="${colType}"]`);
         return dataElement === null || dataElement === void 0 ? void 0 : dataElement.updateCell({
-            row: data.row,
-            col: data.col,
+            row,
+            col,
         });
     }
     /**
@@ -14623,13 +14635,13 @@ class RevoGridComponent {
             // Render viewport data (vertical sections)
             view.dataPorts.forEach(data => {
                 const key = `${data.type}_${view.type}`;
-                const dataView = (hAsync("revogr-overlay-selection", Object.assign({}, data, { isMobileDevice: isMobile, selectionStore: data.segmentSelectionStore, onSelectall: () => { var _a; return (_a = this.selectionStoreConnector) === null || _a === void 0 ? void 0 : _a.selectAll(); }, editors: this.editors, readonly: this.readonly, range: this.range, useClipboard: this.useClipboard, applyChangesOnClose: this.applyOnClose, additionalData: this.additionalData, slot: data.slot, onBeforenextvpfocus: (e) => { var _a; return (_a = this.selectionStoreConnector) === null || _a === void 0 ? void 0 : _a.beforeNextFocusCell(e.detail); }, onCanceledit: () => { var _a; return (_a = this.selectionStoreConnector) === null || _a === void 0 ? void 0 : _a.setEdit(false); }, onSetedit: ({ detail }) => {
+                const dataView = (hAsync("revogr-overlay-selection", Object.assign({}, data, { isMobileDevice: isMobile, onSelectall: () => { var _a; return (_a = this.selectionStoreConnector) === null || _a === void 0 ? void 0 : _a.selectAll(); }, editors: this.editors, readonly: this.readonly, range: this.range, useClipboard: this.useClipboard, applyChangesOnClose: this.applyOnClose, additionalData: this.additionalData, slot: data.slot, onBeforenextvpfocus: (e) => { var _a; return (_a = this.selectionStoreConnector) === null || _a === void 0 ? void 0 : _a.beforeNextFocusCell(e.detail); }, onCanceledit: () => { var _a; return (_a = this.selectionStoreConnector) === null || _a === void 0 ? void 0 : _a.setEdit(false); }, onSetedit: ({ detail }) => {
                         var _a;
                         const event = this.beforeeditstart.emit(detail);
                         if (!event.defaultPrevented) {
                             (_a = this.selectionStoreConnector) === null || _a === void 0 ? void 0 : _a.setEdit(detail.val);
                         }
-                    } }), hAsync("revogr-data", Object.assign({}, data, { colType: view.type, key: key, readonly: this.readonly, range: this.range, rowClass: this.rowClass, rowSelectionStore: data.rowSelectionStore, additionalData: this.additionalData, jobsBeforeRender: this.jobsBeforeRender, slot: DATA_SLOT }), hAsync("slot", { name: `data-${view.type}-${data.type}` })), hAsync("revogr-temp-range", { selectionStore: data.segmentSelectionStore, dimensionRow: data.dimensionRow, dimensionCol: data.dimensionCol }), hAsync("revogr-focus", { colData: data.colData, dataStore: data.dataStore, focusTemplate: this.focusTemplate, rowType: data.type, colType: view.type, selectionStore: data.segmentSelectionStore, dimensionRow: data.dimensionRow, dimensionCol: data.dimensionCol }, hAsync("slot", { name: `focus-${view.type}-${data.type}` }))));
+                    } }), hAsync("revogr-data", Object.assign({}, data, { colType: view.type, key: key, readonly: this.readonly, range: this.range, rowClass: this.rowClass, rowSelectionStore: data.rowSelectionStore, additionalData: this.additionalData, jobsBeforeRender: this.jobsBeforeRender, slot: DATA_SLOT }), hAsync("slot", { name: `data-${view.type}-${data.type}` })), hAsync("revogr-temp-range", { selectionStore: data.selectionStore, dimensionRow: data.dimensionRow, dimensionCol: data.dimensionCol }), hAsync("revogr-focus", { colData: data.colData, dataStore: data.dataStore, focusTemplate: this.focusTemplate, rowType: data.type, colType: view.type, selectionStore: data.selectionStore, dimensionRow: data.dimensionRow, dimensionCol: data.dimensionCol }, hAsync("slot", { name: `focus-${view.type}-${data.type}` }))));
                 dataViews.push(dataView);
             });
             // Add viewport scroll in the end

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@revolist/revogrid",
-  "version": "4.10.21",
+  "version": "4.10.22",
   "type": "module",
   "description": "Virtual reactive data grid spreadsheet component - RevoGrid.",
   "license": "MIT",

package/standalone/revo-grid.js

@@ -3032,7 +3032,7 @@ class ViewportService {
                 segmentSelection.setLastCell(rgRow.lastCell);
                 // register selection store for Row
                 const rowSelectionStore = this.registerRow(rgRow.position.y, rgRow.type);
-                const rowDef = Object.assign(Object.assign({ colType: val }, rgRow), { rowSelectionStore, segmentSelectionStore: segmentSelection.store, ref: (e) => config.selectionStoreConnector.registerSection(e), onSetrange: e => {
+                const rowDef = Object.assign(Object.assign({ colType: val }, rgRow), { rowSelectionStore, selectionStore: segmentSelection.store, ref: (e) => config.selectionStoreConnector.registerSection(e), onSetrange: e => {
                         segmentSelection.setRangeArea(e.detail);
                     }, onSettemprange: e => segmentSelection.setTempArea(e.detail), onFocuscell: e => {
                         // todo: multi focus
@@ -3594,15 +3594,27 @@ const RevoGridComponent = /*@__PURE__*/ proxyCustomElement(class RevoGridCompone
         this.dataProvider.refresh(type);
     }
     /**
-     * Sets data at specified cell.
+     * Refreshes data at specified cell.
      * Useful for performance optimization.
      * No viewport update will be triggered.
+     *
+     * @example
+     * const grid = document.querySelector('revo-grid');
+     * grid.setDataAt({ row: 0, col: 0, val: 'test' }); // refresh
      */
-    async setDataAt(data) {
-        const dataElement = this.element.querySelector(`revogr-data[type="${data.rowType}"][col-type="${data.colType}"]`);
+    async setDataAt({ row, col, colType = 'rgCol', rowType = 'rgRow', val, skipDataUpdate = false }) {
+        if (this.dataProvider && !skipDataUpdate) {
+            this.dataProvider.setCellData({
+                type: rowType,
+                rowIndex: row,
+                prop: col,
+                val,
+            }, false);
+        }
+        const dataElement = this.element.querySelector(`revogr-data[type="${rowType}"][col-type="${colType}"]`);
         return dataElement === null || dataElement === void 0 ? void 0 : dataElement.updateCell({
-            row: data.row,
-            col: data.col,
+            row,
+            col,
         });
     }
     /**
@@ -4305,13 +4317,13 @@ const RevoGridComponent = /*@__PURE__*/ proxyCustomElement(class RevoGridCompone
             // Render viewport data (vertical sections)
             view.dataPorts.forEach(data => {
                 const key = `${data.type}_${view.type}`;
-                const dataView = (h("revogr-overlay-selection", Object.assign({}, data, { isMobileDevice: isMobile, selectionStore: data.segmentSelectionStore, onSelectall: () => { var _a; return (_a = this.selectionStoreConnector) === null || _a === void 0 ? void 0 : _a.selectAll(); }, editors: this.editors, readonly: this.readonly, range: this.range, useClipboard: this.useClipboard, applyChangesOnClose: this.applyOnClose, additionalData: this.additionalData, slot: data.slot, onBeforenextvpfocus: (e) => { var _a; return (_a = this.selectionStoreConnector) === null || _a === void 0 ? void 0 : _a.beforeNextFocusCell(e.detail); }, onCanceledit: () => { var _a; return (_a = this.selectionStoreConnector) === null || _a === void 0 ? void 0 : _a.setEdit(false); }, onSetedit: ({ detail }) => {
+                const dataView = (h("revogr-overlay-selection", Object.assign({}, data, { isMobileDevice: isMobile, onSelectall: () => { var _a; return (_a = this.selectionStoreConnector) === null || _a === void 0 ? void 0 : _a.selectAll(); }, editors: this.editors, readonly: this.readonly, range: this.range, useClipboard: this.useClipboard, applyChangesOnClose: this.applyOnClose, additionalData: this.additionalData, slot: data.slot, onBeforenextvpfocus: (e) => { var _a; return (_a = this.selectionStoreConnector) === null || _a === void 0 ? void 0 : _a.beforeNextFocusCell(e.detail); }, onCanceledit: () => { var _a; return (_a = this.selectionStoreConnector) === null || _a === void 0 ? void 0 : _a.setEdit(false); }, onSetedit: ({ detail }) => {
                         var _a;
                         const event = this.beforeeditstart.emit(detail);
                         if (!event.defaultPrevented) {
                             (_a = this.selectionStoreConnector) === null || _a === void 0 ? void 0 : _a.setEdit(detail.val);
                         }
-                    } }), h("revogr-data", Object.assign({}, data, { colType: view.type, key: key, readonly: this.readonly, range: this.range, rowClass: this.rowClass, rowSelectionStore: data.rowSelectionStore, additionalData: this.additionalData, jobsBeforeRender: this.jobsBeforeRender, slot: DATA_SLOT }), h("slot", { name: `data-${view.type}-${data.type}` })), h("revogr-temp-range", { selectionStore: data.segmentSelectionStore, dimensionRow: data.dimensionRow, dimensionCol: data.dimensionCol }), h("revogr-focus", { colData: data.colData, dataStore: data.dataStore, focusTemplate: this.focusTemplate, rowType: data.type, colType: view.type, selectionStore: data.segmentSelectionStore, dimensionRow: data.dimensionRow, dimensionCol: data.dimensionCol }, h("slot", { name: `focus-${view.type}-${data.type}` }))));
+                    } }), h("revogr-data", Object.assign({}, data, { colType: view.type, key: key, readonly: this.readonly, range: this.range, rowClass: this.rowClass, rowSelectionStore: data.rowSelectionStore, additionalData: this.additionalData, jobsBeforeRender: this.jobsBeforeRender, slot: DATA_SLOT }), h("slot", { name: `data-${view.type}-${data.type}` })), h("revogr-temp-range", { selectionStore: data.selectionStore, dimensionRow: data.dimensionRow, dimensionCol: data.dimensionCol }), h("revogr-focus", { colData: data.colData, dataStore: data.dataStore, focusTemplate: this.focusTemplate, rowType: data.type, colType: view.type, selectionStore: data.selectionStore, dimensionRow: data.dimensionRow, dimensionCol: data.dimensionCol }, h("slot", { name: `focus-${view.type}-${data.type}` }))));
                 dataViews.push(dataView);
             });
             // Add viewport scroll in the end