nuxt-musicfyplayer 2.1.2 → 2.1.3

package/README.md

@@ -49,7 +49,7 @@ In the project, use the component `<MusicfyPlayer :config="" />`, where `config`
 
 | Property                              | Description              | Default value |
 |---------------------------------------|--------------------------|---------------|
-| [`config`](#musicfyplayer-composale)  | MusicfyPlayer composable |               |
+| [`config`](#musicfyplayer-composable) | MusicfyPlayer composable |               |
 | `width`                               | Music player width       | `100%`        |
 | `height`                              | Music player height      | `450px`       |
 
@@ -120,7 +120,7 @@ const config = useMusicfyPlayer({
     rlkey: "g7sqo9y5zl3f69oxftzo5auc5"
   },
   image: {
-    src: "https://dimatis.yizack.com/images/reminiscences.jpg",
+    src: "https://dimatis.music/images/reminiscences.jpg",
     alt: "Dimatis - Reminiscences"
   },
   color: {

package/dist/module.d.mts

@@ -4,4 +4,5 @@ interface ModuleOptions {
 }
 declare const _default: _nuxt_schema.NuxtModule<ModuleOptions, ModuleOptions, false>;
 
-export { type ModuleOptions, _default as default };
+export { _default as default };
+export type { ModuleOptions };

package/dist/module.json

@@ -4,9 +4,9 @@
   "compatibility": {
     "nuxt": ">=3.0.0"
   },
-  "version": "2.1.2",
+  "version": "2.1.3",
   "builder": {
-    "@nuxt/module-builder": "0.8.4",
-    "unbuild": "2.0.0"
+    "@nuxt/module-builder": "1.0.0",
+    "unbuild": "3.5.0"
   }
 }

package/dist/runtime/components/MusicfyPlayer.vue

@@ -1,62 +1,52 @@
-<script setup lang='ts'>
-import ColorThief from 'colorthief'
-import type { MusicfyPlayerConfig } from './../types/musicfyplayer'
-import { onMounted, ref, useTemplateRef } from '#imports'
-
-const props = withDefaults(defineProps<{
-  /**
-   * The configuration of the player
-   */
-  config: MusicfyPlayerConfig
-  /**
-   * The width and height of the player
-   * @default '100%'
-   */
-  width?: string
-  /**
-   * The height of the player
-   * @default '450px'
-   */
-  height?: string
-}>(), {
-  width: '100%',
-  height: '450px',
-})
-
-const audio = useTemplateRef<HTMLAudioElement>('audio')
-
-const size = ref({ width: props.width, height: props.height })
-const backgroundColor = ref<string | undefined>()
-
-if (import.meta.client && props.config.colorDetect) {
-  const img = new Image()
-  img.crossOrigin = 'Anonymous'
-  img.src = props.config.imageSrc
-
-  img.onload = () => {
-    const colorThief = new ColorThief()
-    const color = colorThief.getColor(img)
-    backgroundColor.value = color ? `rgb(${color[0]}, ${color[1]}, ${color[2]})` : undefined
-  }
-}
-
-onMounted(async () => {
-  if (!audio.value) return
-  const { mediaElementPlayer } = await import('./../utils/mediaelement')
-  mediaElementPlayer(audio.value, {
-    iconSprite: '',
-    audioHeight: 40,
-    features: ['playpause', 'current', 'duration', 'progress', 'volume', 'tracks', 'fullscreen'],
-    alwaysShowControls: true,
-    timeAndDurationSeparator: '<span></span>',
-    iPadUseNativeControls: false,
-    iPhoneUseNativeControls: false,
-    AndroidUseNativeControls: false,
-  })
-})
-</script>
-
-<template>
+<script setup>
+import ColorThief from "colorthief";
+import { onMounted, ref, useTemplateRef } from "#imports";
+const props = defineProps({
+  config: {
+    type: Object,
+    required: true
+  },
+  width: {
+    type: String,
+    required: false,
+    default: "100%"
+  },
+  height: {
+    type: String,
+    required: false,
+    default: "450px"
+  }
+});
+const audio = useTemplateRef("audio");
+const size = ref({ width: props.width, height: props.height });
+const backgroundColor = ref();
+if (import.meta.client && props.config.colorDetect) {
+  const img = new Image();
+  img.crossOrigin = "Anonymous";
+  img.src = props.config.imageSrc;
+  img.onload = () => {
+    const colorThief = new ColorThief();
+    const color = colorThief.getColor(img);
+    backgroundColor.value = color ? `rgb(${color[0]}, ${color[1]}, ${color[2]})` : void 0;
+  };
+}
+onMounted(async () => {
+  if (!audio.value) return;
+  const { mediaElementPlayer } = await import("./../utils/mediaelement");
+  mediaElementPlayer(audio.value, {
+    iconSprite: "",
+    audioHeight: 40,
+    features: ["playpause", "current", "duration", "progress", "volume", "tracks", "fullscreen"],
+    alwaysShowControls: true,
+    timeAndDurationSeparator: "<span></span>",
+    iPadUseNativeControls: false,
+    iPhoneUseNativeControls: false,
+    AndroidUseNativeControls: false
+  });
+});
+</script>
+
+<template>
   <div class="musicfyplayer" :class="{ [`${config.colorClass}`]: config.colorClass }" :style="{ ...size, backgroundColor }">
     <div class="mp__box">
       <div class="mp__controls">
@@ -75,8 +65,8 @@ onMounted(async () => {
       </div>
     </div>
   </div>
-</template>
-
+</template>
+
 <style>
 @import "./../assets/css/musicfyplayer.css";
-</style>
+</style>

package/dist/runtime/components/MusicfyPlayer.vue.d.ts

@@ -0,0 +1,22 @@
+import type { MusicfyPlayerConfig } from './../types/musicfyplayer.js';
+type __VLS_Props = {
+    /**
+     * The configuration of the player
+     */
+    config: MusicfyPlayerConfig;
+    /**
+     * The width and height of the player
+     * @default '100%'
+     */
+    width?: string;
+    /**
+     * The height of the player
+     * @default '450px'
+     */
+    height?: string;
+};
+declare const _default: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    width: string;
+    height: string;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+export default _default;

package/dist/runtime/composables/musicfyplayer.d.ts

@@ -5,5 +5,5 @@ import type { MusicfyPlayerConfig, MusicfyPlayerComposableConfig } from './../ty
  * @param config - Musicfy Player composable configuration
  * @returns Musicfy Player configuration
  */
-export declare const useMusicfyPlayer: <T extends keyof Providers>(config: MusicfyPlayerComposableConfig<T>) => MusicfyPlayerConfig;
-export declare const defineMusicfyPlayer: <T extends keyof Providers>(config: MusicfyPlayerComposableConfig<T>) => MusicfyPlayerConfig;
+export declare const useMusicfyPlayer: <T extends keyof Providers = "local">(config: MusicfyPlayerComposableConfig<T>) => MusicfyPlayerConfig;
+export declare const defineMusicfyPlayer: <T extends keyof Providers = "local">(config: MusicfyPlayerComposableConfig<T>) => MusicfyPlayerConfig;

package/dist/types.d.mts

@@ -1 +1,3 @@
-export { type ModuleOptions, default } from './module.js'
+export { default } from './module.mjs'
+
+export { type ModuleOptions } from './module.mjs'

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "nuxt-musicfyplayer",
-  "version": "2.1.2",
+  "version": "2.1.3",
   "description": "Embed a simple and beautiful HTML music player from local or hosted audio on your website using MediaElement.js and ColorThief.js",
   "keywords": [
     "nuxt",
@@ -16,19 +16,17 @@
   "author": {
     "name": "Yizack Rangel",
     "email": "yizackr@gmail.com",
-    "url": "https://yizack.com/"
+    "url": "https://yizack.com"
   },
   "license": "MIT",
   "type": "module",
   "exports": {
     ".": {
-      "types": "./dist/types.d.ts",
-      "import": "./dist/module.mjs",
-      "require": "./dist/module.cjs"
+      "types": "./dist/types.d.mts",
+      "import": "./dist/module.mjs"
     }
   },
-  "main": "./dist/module.cjs",
-  "types": "./dist/types.d.ts",
+  "main": "./dist/module.mjs",
   "files": [
     "dist"
   ],
@@ -45,29 +43,22 @@
     "test:watch": "vitest watch"
   },
   "dependencies": {
-    "@nuxt/kit": "^3.15.4",
+    "@nuxt/kit": "^3.16.2",
     "colorthief": "2.4.0",
     "mediaelement": "^7.0.7"
   },
   "devDependencies": {
-    "@nuxt/devtools": "^2.0.0",
-    "@nuxt/eslint-config": "^1.0.1",
-    "@nuxt/module-builder": "^0.8.4",
-    "@nuxt/schema": "^3.15.4",
-    "@nuxt/test-utils": "^3.15.4",
-    "@types/node": "^22.13.1",
-    "changelogen": "^0.5.7",
-    "eslint": "^9.20.0",
-    "nuxt": "^3.15.4",
-    "vitest": "^3.0.5",
-    "vue-tsc": "^2.2.0"
+    "@nuxt/devtools": "^2.3.2",
+    "@nuxt/eslint-config": "^1.3.0",
+    "@nuxt/module-builder": "^1.0.0",
+    "@nuxt/schema": "^3.16.2",
+    "@nuxt/test-utils": "^3.17.2",
+    "@types/node": "^22.14.0",
+    "changelogen": "^0.6.1",
+    "eslint": "^9.24.0",
+    "nuxt": "^3.16.2",
+    "vitest": "^3.1.1",
+    "vue-tsc": "^2.2.8"
   },
-  "changelog": {
-    "repo": {
-      "repo": "Yizack/nuxt-musicfyplayer",
-      "provider": "github",
-      "domain": "github.com"
-    }
-  },
-  "packageManager": "pnpm@10.2.1"
-}
+  "packageManager": "pnpm@10.7.1"
+}

package/dist/module.cjs

@@ -1,5 +0,0 @@
-module.exports = function(...args) {
-  return import('./module.mjs').then(m => m.default.call(this, ...args))
-}
-const _meta = module.exports.meta = require('./module.json')
-module.exports.getMeta = () => Promise.resolve(_meta)

package/dist/module.d.ts

@@ -1,7 +0,0 @@
-import * as _nuxt_schema from '@nuxt/schema';
-
-interface ModuleOptions {
-}
-declare const _default: _nuxt_schema.NuxtModule<ModuleOptions, ModuleOptions, false>;
-
-export { type ModuleOptions, _default as default };

package/dist/types.d.ts

@@ -1 +0,0 @@
-export { type ModuleOptions, default } from './module'