refactor(config): break ui.config.ts into separate files (#930)

src/runtime/ui.config/layout/card.ts

@@ -0,0 +1,23 @@
+export default {
+  base: 'overflow-hidden',
+  background: 'bg-white dark:bg-gray-900',
+  divide: 'divide-y divide-gray-200 dark:divide-gray-800',
+  ring: 'ring-1 ring-gray-200 dark:ring-gray-800',
+  rounded: 'rounded-lg',
+  shadow: 'shadow',
+  body: {
+    base: '',
+    background: '',
+    padding: 'px-4 py-5 sm:p-6'
+  },
+  header: {
+    base: '',
+    background: '',
+    padding: 'px-4 py-5 sm:px-6'
+  },
+  footer: {
+    base: '',
+    background: '',
+    padding: 'px-4 py-4 sm:px-6'
+  }
+}

src/runtime/ui.config/layout/container.ts

@@ -0,0 +1,5 @@
+export default {
+  base: 'mx-auto',
+  padding: 'px-4 sm:px-6 lg:px-8',
+  constrained: 'max-w-7xl'
+}

src/runtime/ui.config/layout/divider.ts

@@ -0,0 +1,29 @@
+export default {
+  wrapper: {
+    base: 'flex items-center align-center text-center w-full',
+    horizontal: 'flex-row',
+    vertical: 'flex-col'
+  },
+  container: {
+    base: 'font-medium text-gray-700 dark:text-gray-200 flex',
+    horizontal: 'mx-3 whitespace-nowrap',
+    vertical: 'my-2'
+  },
+  border: {
+    base: 'flex border-gray-200 dark:border-gray-800',
+    horizontal: 'w-full',
+    vertical: 'h-full',
+    size: {
+      horizontal: 'border-t',
+      vertical: 'border-s'
+    }
+  },
+  icon: {
+    base: 'flex-shrink-0 w-5 h-5'
+  },
+  avatar: {
+    base: 'flex-shrink-0',
+    size: '2xs'
+  },
+  label: 'text-sm'
+}

src/runtime/ui.config/layout/skeleton.ts

@@ -0,0 +1,5 @@
+export default {
+  base: 'animate-pulse',
+  background: 'bg-gray-100 dark:bg-gray-800',
+  rounded: 'rounded-md'
+}