Make an area around checkbox in table inactive

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@soramitsu/soramitsu-js-ui",
-  "version": "0.8.5",
+  "version": "0.8.6",
   "private": false,
   "publishConfig": {
     "registry": "https://nexus.iroha.tech/repository/npm-soramitsu/"

src/components/Table/STable.vue

@@ -117,7 +117,7 @@ export default class STable extends Mixins(SizeMixin) {
    */
   @Prop({ default: false, type: Boolean }) readonly highlightCurrentRow!: boolean
   /**
-   * A key of the current row. Can be `string` or `number`
+   * A key of the row. Can be 'Function(row)', `string` or `number`
    */
   @Prop({ type: [Function, String, Number] }) readonly rowKey!: ((row: any) => string | number) | string | number
   /**
@@ -278,7 +278,9 @@ export default class STable extends Mixins(SizeMixin) {
   }
 
   handleRowClick (row: any, column: ElTableColumn, event: MouseEvent): void {
-    this.$emit('row-click', row, column, event)
+    if (column.type !== 'selection') {
+      this.$emit('row-click', row, column, event)
+    }
   }
 
   handleRowContextMenu (row: any, column: ElTableColumn, event: MouseEvent): void {

src/components/Table/STableColumn.vue

@@ -192,9 +192,9 @@ export default class STableColumn extends Vue {
     const size = (this.sTable || {}).size
     if (!this.width && this.type === 'selection' && size) {
       return !tableBorder ? ({
-        [Size.SMALL]: '30',
-        [Size.MEDIUM]: '32',
-        [Size.BIG]: '36'
+        [Size.SMALL]: '46',
+        [Size.MEDIUM]: '48',
+        [Size.BIG]: '52'
       }[size]) : ({
         [Size.SMALL]: '42',
         [Size.MEDIUM]: '44',

src/stories/Table/STable.stories.ts

@@ -43,6 +43,7 @@ export const configurable = () => ({
                :border="border"
                :show-header="showHeader"
                :highlight-current-row="highlightCurrentRow"
+               @row-click="alert('click')"
              >
                <s-table-column type="selection"></s-table-column>
                <s-table-column prop="date" label="Date" width="180"></s-table-column>
@@ -77,6 +78,11 @@ export const configurable = () => ({
     highlightCurrentRow: {
       default: boolean('Highlight current row', false)
     }
+  },
+  methods: {
+    alert (message: string) {
+      alert(message)
+    }
   }
 })
 

src/styles/table.scss

@@ -27,8 +27,8 @@
   padding-left: 16px;
   padding-right: 16px;
 }
-.el-table:not(.el-table--border) .el-table-column--selection > .cell {
-  padding-right: 0;
+.el-table:not(.el-table--border) .el-table-column--selection + td > .cell {
+  padding-left: 0;
 }
 .el-table--border th:first-child .cell,
 .el-table--border td:first-child .cell {