stijlbreuk-dev / vue-split-grid Goto Github PK

Link to reproduce

Removing a column does not recalculate width, however, adding a column does.

Link to reproduce

SplitGridGutter.vue checks for

gridData.direction === 'vertical'

in multiple places, however, SplitGrid.vue's direction prop has a validator requiring it to be either 'row' or 'column':

    direction: {
      type: String,
      default: 'column',
      validator: val => ['column', 'row'].includes(val)
    },

I'm not sure which file needs fixing.
@Stijlbreuk what do you think?

First of all I would like to thank you for this plugin.

I'm using split grid for an application that needs to be responsive. To do this I'm listening to window resize events and together with some computed properties I'm setting the split-grid configuration as such:

<split-grid
      slot="content-body"
      class="row no-gutters"
      direction="column"
      :strict-mode="true"
      :column-min-sizes="{ 0: minSizeForFirstPane, 2: minSizeForSecondPane }"
      :column-snap-offset="calculateSnapOffsetBasedOnWindowWidth"
      @drag="onGridDrag"
    >

Where minSizeForFirstPane and minSizeForSecondPane are both computed based on a window size which is updated on window resize event (and can assure you that this works perfectly).

However, I have noticed that the split grid doesn't listen to those changes or propagates down the chain to it's children (split grid area or gutter).

I have tried using a :key attribute on the split grid component and this works well as it will update each time the key is changed, however, this is messing up with my 2nd pane which contains an iframe loaded by a 3rd party service which after update is being removed from DOM.

Would more watchers for other configuration settings than sizeUnit and sizeValue help re-render the component without using a key ?

Is there any way to understand when does the animation end or starts? I need animationend event.

See title. I think this solution is prone to conflicts, as the uuid is too simple

https://github.com/stijlbreuk/vue-split-grid/blob/master/src/mixins/uuid.js