accessing shortcodes without `this`

[mayank99]

Is your feature request related to a problem? Please describe.

When using .11ty.js templates, shortcodes are accessed using this (as per docs).

It is no secret that this can be very confusing and brittle.

export default function() {
  // this works inside named functions
}

export default () => {
  // this doesn't work inside arrow functions
}

export default function() {
  const obj = {
    fn: function() {
       // this doesn't work inside objects
    }
  };
}

Describe the solution you'd like

Would it make sense to provide a global object instead? For comparison, Astro provides an Astro global which contains page-specific information as well as some shared globals.

This could look like:

export default () => {
  Eleventy.myShortCode()
}

Alternatively, it could be passed as a param to the render function, which is better than this but still leaves the responsibility on the consumer to share it across different files.

export default (data, Eleventy) => {
  // …
}

Or it could be provided as a magic import.

import { Eleventy } from "11ty:global";

Describe alternatives you've considered

No response

Additional context

No response