vue-split-grid icon indicating copy to clipboard operation
vue-split-grid copied to clipboard

gridData 'direction' conflict

Open ChuckFields opened this issue 5 years ago • 1 comments

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?

ChuckFields avatar Sep 27 '19 16:09 ChuckFields

This actually seems to be a bug, gridData.direction is used to bind either the vsg_gutter-horizontal or vsg_gutter-vertical class to a gutter. SplitGrid.vue injects the gridData.direction value by using Vue's provide/inject but because SplitGrid.vue only allows the direction to be row or column so none of the vsg_gutter-* classes can ever be bound to the gutter elements.

We aim to keep the property names and events for this Vue wrapper of Split Grid consistent with the original library. column and row are used by the direction option in Split Grid. To keep it consistent SplitGridGutter.vue will be changed to check if gridData.direction is equal to either column or row.

Since the vsg_gutter-* classes were never bound to the gutter and because the naming of the classes is not consistent with SplitGrid we could also change vsg_gutter-horizontal and vsg_gutter-vertical to respectively vsg_gutter-row and vsg_gutter-column. I'm curious to see what you think @ChuckFields and @peerbolte

nino-vrijman avatar Oct 14 '19 19:10 nino-vrijman