Selecting Index fields by css selectors

[prima-ca]

I note that the fields in my Index views all look some-what like this:

    <td>
        <div class="text-left text-left" resource="[object Object]"><span class="whitespace-no-wrap">Text Field</span>
        </div>
    </td>

And I just think it's a crying shame that in that itty bitty spot that's being wasted with all that "[object Object]" that y'all can't insert something more useful, like {$resource}.{$field}, which would allow one to apply targeted CSS on a given column.

In somewhat of the same vein, I find it remarkable that y'all are generating entire tables which also have no attributes allowing CSS targeting.

<table cellpadding="0" cellspacing="0" data-testid="resource-table" class="table w-full table-tight">

Now perhaps those strange resource attributes are being caused by some non-official plugin, I'm not rightly sure. I've taken a lookie-loo at them there TextField.vue but I can't rightly make heads or tails of the little stinker. I'm darn sure I don't see any reference to resource.

<template>
  <div :class="`text-${field.textAlign}`">
    <template v-if="hasValue">
      <div v-if="field.asHtml" v-html="field.value"></div>
      <span v-else class="whitespace-no-wrap">{{ field.value }}</span>
    </template>
    <p v-else>&mdash;</p>
  </div>
</template>

<script>
export default {
  props: ['resourceName', 'field'],

  computed: {
    /**
     * Determine if the field has a value other than null.
     */
    hasValue() {
      return this.field.value !== null
    },
  },
}
</script>

Could any of you kind folk lend me a piece of your noggin' to solve this mystery?