diff --git a/packages/splitjs/index.d.ts b/packages/splitjs/index.d.ts index a50b330c..a39df01b 100644 --- a/packages/splitjs/index.d.ts +++ b/packages/splitjs/index.d.ts @@ -37,7 +37,7 @@ declare namespace Split { gutterAlign?: string // Snap to minimum size offset in pixels. - snapOffset?: number + snapOffset?: number | number[] dragInterval?: number diff --git a/packages/splitjs/src/split.js b/packages/splitjs/src/split.js index 52ad2e82..6e1871c3 100644 --- a/packages/splitjs/src/split.js +++ b/packages/splitjs/src/split.js @@ -167,6 +167,7 @@ const Split = (idsOption, options = {}) => { const gutterSize = getOption(options, 'gutterSize', 10) const gutterAlign = getOption(options, 'gutterAlign', 'center') const snapOffset = getOption(options, 'snapOffset', 30) + const snapOffsets = Array.isArray(snapOffset) ? snapOffset : ids.map(() => snapOffset) const dragInterval = getOption(options, 'dragInterval', 1) const direction = getOption(options, 'direction', HORIZONTAL) const cursor = getOption( @@ -297,20 +298,20 @@ const Split = (idsOption, options = {}) => { // If within snapOffset of min or max, set offset to min or max. // snapOffset buffers a.minSize and b.minSize, so logic is opposite for both. // Include the appropriate gutter sizes to prevent overflows. - if (offset <= a.minSize + snapOffset + this[aGutterSize]) { + if (offset <= a.minSize + a.snapOffset + this[aGutterSize]) { offset = a.minSize + this[aGutterSize] } else if ( offset >= - this.size - (b.minSize + snapOffset + this[bGutterSize]) + this.size - (b.minSize + b.snapOffset + this[bGutterSize]) ) { offset = this.size - (b.minSize + this[bGutterSize]) } - if (offset >= a.maxSize - snapOffset + this[aGutterSize]) { + if (offset >= a.maxSize - a.snapOffset + this[aGutterSize]) { offset = a.maxSize + this[aGutterSize] } else if ( offset <= - this.size - (b.maxSize - snapOffset + this[bGutterSize]) + this.size - (b.maxSize - b.snapOffset + this[bGutterSize]) ) { offset = this.size - (b.maxSize + this[bGutterSize]) } @@ -589,6 +590,7 @@ const Split = (idsOption, options = {}) => { size: sizes[i], minSize: minSizes[i], maxSize: maxSizes[i], + snapOffset: snapOffsets[i], i, }