Release v1.2.5

CHANGELOG.md

@@ -1,5 +1,13 @@
 # CHANGELOG
 
+<a name="1.2.5"></a>
+
+### 1.2.5 (2022-01-24)
+
+- Update core and example dependencies
+- Update example to use Tailwind 3.0
+- Remove @vue/compiler-sfc (as of vue 3.2.13+ and @vitejs/plugin-vue 1.9.0+ is no longer required as a peer dependency)
+
 <a name="1.2.4"></a>
 
 ### 1.2.4 (2021-11-16)

example/package.json

@@ -8,14 +8,13 @@
     "serve": "vite preview"
   },
   "dependencies": {
-    "vue": "^3.2.22"
+    "vue": "^3.2.29"
   },
   "devDependencies": {
-    "@vitejs/plugin-vue": "^1.9.4",
-    "@vue/compiler-sfc": "^3.2.22",
-    "autoprefixer": "^10.4.0",
-    "postcss": "^8.3.11",
-    "tailwindcss": "^2.2.19",
-    "vite": "^2.6.14"
+    "@vitejs/plugin-vue": "^2.1.0",
+    "autoprefixer": "^10.4.2",
+    "postcss": "^8.4.5",
+    "tailwindcss": "^3.0.16",
+    "vite": "^2.7.13"
   }
 }

example/src/App.vue

@@ -20,7 +20,7 @@
         <div class="w-full max-w-sm">
           <Notification
             v-slot="{ notifications, close }"
-            enter="transform ease-out duration-300 transition"
+            enter="ease-out duration-300 transition"
             enter-from="translate-y-2 opacity-0 sm:translate-y-0 sm:translate-x-4"
             enter-to="translate-y-0 opacity-100 sm:translate-x-0"
             leave="transition ease-in duration-500"
@@ -36,7 +36,7 @@
             >
               <div class="p-4">
                 <div class="flex items-start">
-                  <div class="flex-shrink-0">
+                  <div class="shrink-0">
                     <svg
                       class="w-6 h-6 text-green-400"
                       xmlns="http://www.w3.org/2000/svg"
@@ -61,7 +61,7 @@
                       {{ notification.text }}
                     </p>
                   </div>
-                  <div class="flex flex-shrink-0 ml-4">
+                  <div class="flex ml-4 shrink-0">
                     <button
                       class="inline-flex text-gray-400 bg-white rounded-md hover:text-gray-500 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-gray-400"
                       @click="close(notification.id)"
@@ -98,7 +98,7 @@
         <div class="w-full max-w-sm">
           <Notification
             v-slot="{ notifications }"
-            enter="transform ease-out duration-300 transition"
+            enter="ease-out duration-300 transition"
             enter-from="translate-y-2 opacity-0 sm:translate-y-0 sm:translate-x-4"
             enter-to="translate-y-0 opacity-100 sm:translate-x-0"
             leave="transition ease-in duration-500"

example/tailwind.config.js

@@ -1,12 +1,7 @@
 module.exports = {
-  mode: 'jit',
-  purge: ['./index.html', './src/**/*.{vue,js}'],
-  darkMode: false,
+  content: ['./index.html', './src/**/*.{vue,js}'],
   theme: {
     extend: {},
   },
-  variants: {
-    extend: {},
-  },
   plugins: [],
 }