diff --git a/src/index.ts b/src/index.ts index 5fd703693..23df75ecf 100644 --- a/src/index.ts +++ b/src/index.ts @@ -9,7 +9,8 @@ import type { ILineUpOptions, ITaggleOptions } from './config'; export * from './builder'; export * from './config'; -export { default as AEventDispatcher, IEventContext, IEventHandler, IEventListener } from './internal/AEventDispatcher'; +export { default as AEventDispatcher } from './internal/AEventDispatcher'; +export type { IEventContext, IEventHandler, IEventListener } from './internal/AEventDispatcher'; export type { ISequence, IForEachAble } from './internal/interable'; export type { ILookUpArray } from './internal/math'; export * from './internal/mathInterfaces'; diff --git a/src/model/index.ts b/src/model/index.ts index b1d83452d..ce6963196 100644 --- a/src/model/index.ts +++ b/src/model/index.ts @@ -12,13 +12,8 @@ export * from './IArrayColumn'; export { toCategories } from './internalCategorical'; -export { - ScaleMappingFunction, - ScriptMappingFunction, - mappingFunctions, - IScriptMappingFunctionType, - IScriptMappingFunctionContext, -} from './MappingFunction'; +export { ScaleMappingFunction, ScriptMappingFunction, mappingFunctions } from './MappingFunction'; +export type { IScriptMappingFunctionType, IScriptMappingFunctionContext } from './MappingFunction'; export { DEFAULT_CATEGORICAL_COLOR_FUNCTION, ReplacementColorMappingFunction } from './CategoricalColorMappingFunction'; export { CustomColorMappingFunction, diff --git a/src/provider/index.ts b/src/provider/index.ts index 376046e70..05df2e834 100644 --- a/src/provider/index.ts +++ b/src/provider/index.ts @@ -5,6 +5,7 @@ export * from './LocalDataProvider'; export * from './RemoteDataProvider'; export { deriveColors, deriveColumnDescriptions, exportRanking, exportTable } from './utils'; export * from './interfaces'; -export { tasksAll, IRenderTaskExecutor } from './tasks'; +export { tasksAll } from './tasks'; +export type { IRenderTaskExecutor } from './tasks'; export type { CompareLookup } from './sort'; export type { ITopNGetter, IGroupMeta } from './internal'; diff --git a/src/ui/SelectionManager.ts b/src/ui/SelectionManager.ts index cd45e7d3d..b428cf920 100644 --- a/src/ui/SelectionManager.ts +++ b/src/ui/SelectionManager.ts @@ -27,6 +27,7 @@ export declare function selectRange(from: number, to: number, additional: boolea export default class SelectionManager extends AEventDispatcher { static readonly EVENT_SELECT_RANGE = 'selectRange'; private static readonly MIN_DISTANCE = 10; + private static readonly MAX_X_DISTANCE = 30; private readonly hr: HTMLHRElement; @@ -51,21 +52,28 @@ export default class SelectionManager extends AEventDispatcher { this.body.removeEventListener('mouseup', mouseUp); this.body.removeEventListener('mouseleave', mouseUp); - if (!this.start) { + this.body.classList.remove(cssClass('selection-active')); + this.hr.classList.remove(cssClass('selection-active')); + const start = this.start; + this.start = null; + + if (!start) { return; } + + const valid = Math.abs(start.x - evt.clientX) < SelectionManager.MAX_X_DISTANCE; + if (!valid) { + return; + } + const row = engineCssClass('tr'); - const startNode = this.start.node.classList.contains(row) - ? this.start.node - : this.start.node.closest(`.${row}`); + + const startNode = start.node.classList.contains(row) ? start.node : start.node.closest(`.${row}`); + // somehow on firefox the mouseUp will be triggered on the original node // thus search the node explicitly const end = this.body.ownerDocument!.elementFromPoint(evt.clientX, evt.clientY) as HTMLElement; const endNode = end.classList.contains(row) ? end : end.closest(`.${row}`); - this.start = null; - - this.body.classList.remove(cssClass('selection-active')); - this.hr.classList.remove(cssClass('selection-active')); this.select(evt.ctrlKey, startNode, endNode); }; @@ -74,9 +82,12 @@ export default class SelectionManager extends AEventDispatcher { 'mousedown', (evt) => { const r = root.getBoundingClientRect(); + const inSelectionColumn = (evt.target as HTMLElement).closest(`.${cssClass('renderer-selection')}`); + if (!inSelectionColumn) { + return; + } this.start = { x: evt.clientX, y: evt.clientY, xShift: r.left, yShift: r.top, node: evt.target as HTMLElement }; - this.body.classList.add(cssClass('selection-active')); body.addEventListener('mousemove', mouseMove, { passive: true, }); @@ -122,10 +133,15 @@ export default class SelectionManager extends AEventDispatcher { private showHint(end: MouseEvent) { const start = this.start!; + const sx = start.x; const sy = start.y; + const ex = end.clientX; const ey = end.clientY; - const visible = Math.abs(sy - ey) > SelectionManager.MIN_DISTANCE; + const visible = + Math.abs(sy - ey) > SelectionManager.MIN_DISTANCE && Math.abs(sx - ex) < SelectionManager.MAX_X_DISTANCE; + + this.body.classList.toggle(cssClass('selection-active'), visible); this.hr.classList.toggle(cssClass('selection-active'), visible); this.hr.style.transform = `translate(${start.x - start.xShift}px,${sy - start.yShift}px)scale(1,${Math.abs( ey - sy diff --git a/src/ui/index.ts b/src/ui/index.ts index 6c16d4b3a..c0e1534ac 100644 --- a/src/ui/index.ts +++ b/src/ui/index.ts @@ -7,7 +7,9 @@ export { default as LineUp } from './LineUp'; export * from './LineUp'; export { default as ALineUp } from './ALineUp'; export * from './panel'; -export { default as SlopeGraph, ISlopeGraphOptions } from './SlopeGraph'; +export { default as SlopeGraph } from './SlopeGraph'; +export type { ISlopeGraphOptions } from './SlopeGraph'; export * from './taggle'; export { default as SelectionIndicator } from './SelectionIndicator'; -export { default as RenderColumn, IRenderers } from './RenderColumn'; +export { default as RenderColumn } from './RenderColumn'; +export type { IRenderers } from './RenderColumn'; diff --git a/src/ui/taggle/index.ts b/src/ui/taggle/index.ts index 637f8121d..db714e3b4 100644 --- a/src/ui/taggle/index.ts +++ b/src/ui/taggle/index.ts @@ -1,4 +1,5 @@ export * from './rules'; export { default, default as Taggle } from './Taggle'; export * from './Taggle'; -export { default as TaggleRenderer, ITaggleRendererOptions } from './TaggleRenderer'; +export { default as TaggleRenderer } from './TaggleRenderer'; +export type { ITaggleRendererOptions } from './TaggleRenderer';