scbj

<template>
  <JkTable
    :columns="columns"
    :items="sortedComponents"
    row-height="48px"
    @current-change="onCurrentChange"
    @sort="onSort"
  >
    <template #cell:type="{ item }">
      <TypeIcon :type="item.type" />

scbj

export interface ColumnProps {
  label: string
  justify?: 'left' | 'center' | 'right' | 'stretch'
  fontFamily?: 'monospace'
  width?: 'auto' | `${number}fr`
}

export interface ColumnWithSlot extends ColumnProps {
  slotName: string
}

scbj

import { computed, Ref, ref, watch } from 'vue'

import { ColumnProps } from '@/components/jk/table-2/types'

const minColumnWidth = 80
const defaultColumnWidth = '1fr'

/** Checks if the object is an instance of HTMLElement */
function isHtmlElement(obj: object): obj is HTMLElement {
  return obj instanceof HTMLElement

scbj

<template>
  <table class="jk-table" :aria-label="ariaLabel" :aria-rowcount="items.length">
    <thead>
      <tr>
        <th
          v-for="(column, index) in columns"
          :key="index"
          class="jk-table__header-cell-container"
        >
          <div