@aerogel/cli 0.0.0-next.44f5953d2450ac149ceabae6448a967b9def9d2a → 0.0.0-next.46a3020f90bb19fb98d8b9c75a7228de4fe76346

package/templates/overrides/components/overrides/ErrorReportModal.vue

@@ -5,20 +5,20 @@
             :current-report="activeReportIndex + 1"
             :total-reports="reports.length"
         />
-        <AGButton color="clear" :disabled="activeReportIndex === 0" @click="activeReportIndex--">
+        <Button color="ghost" :disabled="activeReportIndex === 0" @click="activeReportIndex--">
             {{ previousReportText }}
-        </AGButton>
-        <AGButton color="clear" :disabled="activeReportIndex === reports.length - 1" @click="activeReportIndex++">
+        </Button>
+        <Button color="ghost" :disabled="activeReportIndex === reports.length - 1" @click="activeReportIndex++">
             {{ nextReportText }}
-        </AGButton>
+        </Button>
         <AGErrorReportModalButtons :report="report">
             <template
                 #default="{ url, handler, iconComponent, description }: IAGErrorReportModalButtonsDefaultSlotProps"
             >
-                <AGButton :url="url" :aria-label="description" @click="handler">
+                <Button :url="url" :aria-label="description" @click="handler">
                     <component :is="iconComponent" />
                     {{ description }}
-                </AGButton>
+                </Button>
             </template>
         </AGErrorReportModalButtons>
         <AGMarkdown v-if="report.description" :text="report.description" />

package/templates/overrides/components/overrides/ModalWrapper.vue

@@ -11,12 +11,12 @@
 
 <script setup lang="ts">
 import { ref } from 'vue';
-import { useModalExpose, useModalProps } from '@aerogel/core';
+import { modalExpose, modalProps } from '@aerogel/core';
 import type { IAGHeadlessModal, IAGModal } from '@aerogel/core';
 
-const props = defineProps(useModalProps());
+const props = defineProps(modalProps());
 const $modal = ref<IAGHeadlessModal>();
 
 defineOptions({ inheritAttrs: false });
-defineExpose<IAGModal>(useModalExpose($modal));
+defineExpose(modalExpose($modal));
 </script>

package/templates/overrides/components/overrides/SnackbarNotification.vue

@@ -2,14 +2,14 @@
     <AGHeadlessSnackbar :class="colorClasses">
         <AGMarkdown :text="message" inline />
 
-        <AGButton
+        <Button
             v-for="(action, i) of actions"
             :key="i"
-            :color="color"
+            :variant="color"
             @click="activate(action)"
         >
             {{ action.text }}
-        </AGButton>
+        </Button>
     </AGHeadlessSnackbar>
 </template>
 

package/templates/overrides-story/Overrides.story.vue

@@ -2,21 +2,21 @@
     <Story :layout="{ type: 'grid', width: '90%' }">
         <Variant title="Playground">
             <div class="flex space-x-3">
-                <AGButton @click="$ui.alert(alertTitle, alertMessage)">
+                <Button @click="$ui.alert(alertTitle, alertMessage)">
                     Alert
-                </AGButton>
-                <AGButton @click="$ui.confirm(confirmTitle, confirmMessage)">
+                </Button>
+                <Button @click="$ui.confirm(confirmTitle, confirmMessage)">
                     Confirm
-                </AGButton>
-                <AGButton @click="$ui.loading(loadingMessage, after({ seconds: loadingDuration }))">
+                </Button>
+                <Button @click="$ui.loading(loadingMessage, after({ seconds: loadingDuration }))">
                     Loading
-                </AGButton>
-                <AGButton @click="$ui.showSnackbar(snackbarMessage, snackbarOptions)">
+                </Button>
+                <Button @click="$ui.showSnackbar(snackbarMessage, snackbarOptions)">
                     Snackbar
-                </AGButton>
-                <AGButton @click="$errors.inspect(errorReports)">
+                </Button>
+                <Button @click="$errors.inspect(errorReports)">
                     Error Report
-                </AGButton>
+                </Button>
             </div>
 
             <AGAppOverlays />

package/templates/app/postcss.config.js

@@ -1,6 +0,0 @@
-export default {
-    plugins: {
-        tailwindcss: {},
-        autoprefixer: {},
-    },
-};

package/templates/app/tailwind.config.js

@@ -1,5 +0,0 @@
-/** @type {import('tailwindcss').Config} */
-module.exports = {
-    content: ['./index.html', './src/**/*.{vue,ts}', '<% &contentPath %>'],
-    plugins: [require('@tailwindcss/forms'), require('@tailwindcss/typography')],
-};

package/templates/postcss-pseudo-classes/postcss.config.js

@@ -1,15 +0,0 @@
-const plugins = {
-    tailwindcss: {},
-    autoprefixer: {},
-};
-
-if (process.env.NODE_ENV === 'development') {
-    plugins['postcss-pseudo-classes'] = {
-        blacklist: [],
-        restrictTo: ['focus', 'focus-visible', 'focus-within', 'hover'],
-        allCombinations: true,
-        preserveBeforeAfter: false,
-    };
-}
-
-module.exports = { plugins };