Missing composables in global imports

[notKamui]

As of v0.1.0 of this module, the only auto-imported composable is useStyles (from primevue/usestyles).

However, there are other composables that Primevue provides, notably useToast (from primevue/usetoast), useConfirm (from primevue/useconfirm), or even usePrimeVue.

[mertsincan]

Hi,

useToast, useConfirm and usePrimeVue is not a composables. They generate globalProperties for components. For example; $primevue from usePrimeVue

Best Regards,

[notKamui]

Hello,

That is simply not true, per two definitions of composables.

import { inject } from 'vue';

export const PrimeVueToastSymbol = Symbol();

export function useToast() {
    const PrimeVueToast = inject(PrimeVueToastSymbol);

    if (!PrimeVueToast) {
        throw new Error('No PrimeVue Toast provided!');
    }

    return PrimeVueToast;
}

Here's the complete code of useToast for example. Per the naming conventions (use*), it is a composable. Per the fact that it uses the provide/inject by using the inject functions, it is a composable.

If it is not a composable, then it shouldn't be named like so.

In any case, composable or not, I think it would benefit the plugin for these functions to be made available globally, like the other symbols.

Best regards.

[mertsincan]

Hello,

I have examined this issue in depth. I noticed that such imports are made as in the 'Explicit Imports' structure. That's why I added all use structures in the composables file. In order to use your use structures, you must import as;

import { useToast } from '#imports';

Example App;

<template>
  <div>
    <Toast />
    <Panel header="Header">
      <p>
        Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute
        irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
      </p>
    </Panel>
    <Button label="Show" @click="onShow" />
  </div>
</template>

<script setup>
import { useToast } from '#imports';
const toast = useToast();

const onShow = () => {
  toast.add({
    severity: 'success',
    summary: 'Success Message',
    detail: 'Order submitted',
    life: 3000
  });
};
</script>

Best Regards,

[th3coop]

If anyone else comes across this and like me, the suggested fix doesn't work (probably because I don't understand it), the fix over here resolved the issue for me https://github.com/primefaces/primevue/issues/1442#issuecomment-896578571