fix(components): move remaining classes to config (#1039)

src/runtime/ui.config/overlays/contextMenu.ts

@@ -1,4 +1,4 @@
-import arrow from '../_popperArrow'
+import { arrow } from '../popper'
 
 export default {
   wrapper: 'relative',
@@ -23,4 +23,4 @@ export default {
     scroll: false
   },
   arrow
-}
+}

src/runtime/ui.config/overlays/modal.ts

@@ -4,7 +4,7 @@ export default {
   container: 'flex min-h-full items-end sm:items-center justify-center text-center',
   padding: 'p-4 sm:p-0',
   margin: 'sm:my-8',
-  base: 'relative text-left rtl:text-right overflow-hidden w-full flex flex-col',
+  base: 'relative text-left rtl:text-right overflow-hidden flex flex-col',
   overlay: {
     base: 'fixed inset-0 transition-opacity',
     background: 'bg-gray-200/75 dark:bg-gray-800/75',
@@ -22,8 +22,9 @@ export default {
   ring: '',
   rounded: 'rounded-lg',
   shadow: 'shadow-xl',
-  width: 'sm:max-w-lg',
+  width: 'w-full sm:max-w-lg',
   height: '',
+  fullscreen: 'w-screen h-screen',
   // Syntax for `<TransitionRoot>` component https://headlessui.com/vue/transition#basic-example
   transition: {
     enter: 'ease-out duration-300',
@@ -33,4 +34,4 @@ export default {
     leaveFrom: 'opacity-100 translate-y-0 sm:scale-100',
     leaveTo: 'opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95'
   }
-}
+}

src/runtime/ui.config/overlays/notification.ts

@@ -1,6 +1,7 @@
 export default {
   wrapper: 'w-full pointer-events-auto',
   container: 'relative overflow-hidden',
+  inner: 'w-0 flex-1',
   title: 'text-sm font-medium text-gray-900 dark:text-white',
   description: 'mt-1 text-sm leading-4 text-gray-500 dark:text-gray-400',
   actions: 'flex items-center gap-2 mt-3 flex-shrink-0',

src/runtime/ui.config/overlays/popover.ts

@@ -1,8 +1,9 @@
-import arrow from '../_popperArrow'
+import { arrow } from '../popper'
 
 export default {
   wrapper: 'relative',
   container: 'z-50 group',
+  trigger: 'inline-flex w-full',
   width: '',
   background: 'bg-white dark:bg-gray-900',
   shadow: 'shadow-lg',

src/runtime/ui.config/overlays/slideover.ts

@@ -20,9 +20,14 @@ export default {
   padding: '',
   shadow: 'shadow-xl',
   width: 'w-screen max-w-md',
+  translate: {
+    base: 'translate-x-0',
+    left: '-translate-x-full',
+    right: 'translate-x-full'
+  },
   // Syntax for `<TransitionRoot>` component https://headlessui.com/vue/transition#basic-example
   transition: {
     enter: 'transform transition ease-in-out duration-300',
     leave: 'transform transition ease-in-out duration-200'
   }
-}
+}

src/runtime/ui.config/overlays/tooltip.ts

@@ -1,4 +1,4 @@
-import arrow from '../_popperArrow'
+import { arrow } from '../popper'
 
 export default {
   wrapper: 'relative inline-flex',
@@ -11,6 +11,7 @@ export default {
   ring: 'ring-1 ring-gray-200 dark:ring-gray-800',
   base: '[@media(pointer:coarse)]:hidden h-6 px-2 py-1 text-xs font-normal truncate relative',
   shortcuts: 'hidden md:inline-flex flex-shrink-0 gap-0.5',
+  middot: 'mx-1 text-gray-700 dark:text-gray-200',
   // Syntax for `<Transition>` component https://vuejs.org/guide/built-ins/transition.html#css-based-transitions
   transition: {
     enterActiveClass: 'transition ease-out duration-200',
@@ -24,4 +25,4 @@ export default {
     strategy: 'fixed'
   },
   arrow
-}
+}