Merge pull request #3 from cwist2/bugfix/fix-composable

Fix composable use

src/index.ts

@@ -1,4 +1,5 @@
-import { App, inject, InjectionKey, reactive } from 'vue';
+import { App, reactive } from 'vue';
+import { matchMediaKey } from './useApi';
 
 declare module '@vue/runtime-core' {
   interface ComponentCustomProperties {
@@ -80,16 +81,6 @@ function populateRules(
   return rules;
 }
 
-export const VueMatchMediaPluginSymbol: InjectionKey<VueMatchMediaPlugin> = Symbol(
-  'VueMatchMediaPlugin'
-);
-export function useMatchMedia(): VueMatchMediaPlugin {
-  const matchMediaPlugin = inject(VueMatchMediaPluginSymbol);
-  if (!matchMediaPlugin) throw new Error('No VueMatchMediaPlugin provided!!!');
-
-  return matchMediaPlugin;
-}
-
 export function createVueMatchMediaPlugin(
   options?: VueMatchMediaPluginOptions
 ): VueMatchMediaPlugin {
@@ -152,9 +143,10 @@ export function createVueMatchMediaPlugin(
         );
 
         app.config.globalProperties.$matchMedia = matchMediaObservable;
-
-        app.provide(VueMatchMediaPluginSymbol, matchMediaObservable);
+        app.provide(matchMediaKey, matchMediaObservable)
       }
     },
   };
 }
+
+export { useMatchMedia } from './useApi';

src/useApi.ts

@@ -0,0 +1,17 @@
+import { inject, InjectionKey } from 'vue';
+
+const hasSymbol =
+  typeof Symbol === 'function' && typeof Symbol.toStringTag === 'symbol'
+
+const PolySymbol = (name: string) =>
+  hasSymbol
+    ? Symbol(name)
+    : name
+
+export const matchMediaKey = /*#__PURE__*/ PolySymbol(
+  'mm'
+) as InjectionKey<Record<string, boolean>>
+
+export function useMatchMedia(): Record<string, boolean> {
+  return inject(matchMediaKey)!
+}