Assets - Add template slots to Vue components

[FrittenKeeZ]

We're attempting to create an enhanced Assets fieldtype with additional functionality, but in order for that to be a good experience for editors, it would be nice to expose various Vue slots in AssetRow and AssetTile (and further AssetsFieldtype) components.

For AssetRow and AssetTile I'd like to have these:

<slot name="controls-before" :asset="asset" />
<slot name="controls-after" :asset="asset" />

For AssetsFieldtype I'd like to have these:

<asset-tile>
    <template v-slot:controls-before="{ asset }">
        <slot name="tile-controls-before" :asset="asset" />
    </template>
    <template v-slot:controls-after="{ asset }">
        <slot name="tile-controls-after" :asset="asset" />
    </template>
</asset-tile>

<tr is="assetRow">
    <template v-slot:controls-before="{ asset }">
        <slot name="row-controls-before" :asset="asset" />
    </template>
    <template v-slot:controls-after="{ asset }">
        <slot name="row-controls-after" :asset="asset" />
    </template>
</tr>

With this it would be much easier to implement something like this:

<assets-fieldtype
    ref="assets"
    v-model="assets"
    :config="config"
    :meta="meta"
    :handle="handle"
    :read-only="readOnly"
    :name-prefix="namePrefix"
    :field-path-prefix="fieldPathPrefix"
>
    <template v-slot:row-controls-before="{ asset }">
        <button>Do stuff</button>
    </template>
</assets-fieldtype>

[jackmcdade]

What stuff would you like to do that you can't do with an Action? Would love real world use cases to validate the idea. :)

[FrittenKeeZ]

@jackmcdade We want to implement cropping using Cropper.js - current feature of our custom built CMS - but we'd need to handle crops for each entry.

This way we'd save the data as something like:

assets:
  - asset: asset::image.jpg
    crops:
      1_1:
        x: 42
        y: 24
        width: 200
      16_9:
        x: 0
        y: 0
        width: 1920