taro-uno-ui 1.0.0 → 1.0.2

package/src/app.scss

@@ -1,508 +0,0 @@
-/* 全局样式 */
-page {
-  font-family:
-    -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans',
-    'Helvetica Neue', sans-serif;
-  -webkit-font-smoothing: antialiased;
-  -moz-osx-font-smoothing: grayscale;
-  background-color: #f5f5f5;
-  color: #333;
-  font-size: 28px;
-  line-height: 1.5;
-}
-
-/* 重置样式 */
-* {
-  margin: 0;
-  padding: 0;
-  box-sizing: border-box;
-}
-
-/* 通用容器 */
-.container {
-  width: 100%;
-  min-height: 100vh;
-  padding: 0 32px;
-}
-
-/* 通用布局 */
-.flex {
-  display: flex;
-}
-
-.flex-center {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-}
-
-.flex-between {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-}
-
-.flex-column {
-  display: flex;
-  flex-direction: column;
-}
-
-/* 通用间距 */
-.mt-10 {
-  margin-top: 10px;
-}
-.mt-20 {
-  margin-top: 20px;
-}
-.mt-30 {
-  margin-top: 30px;
-}
-.mt-40 {
-  margin-top: 40px;
-}
-
-.mb-10 {
-  margin-bottom: 10px;
-}
-.mb-20 {
-  margin-bottom: 20px;
-}
-.mb-30 {
-  margin-bottom: 30px;
-}
-.mb-40 {
-  margin-bottom: 40px;
-}
-
-.ml-10 {
-  margin-left: 10px;
-}
-.ml-20 {
-  margin-left: 20px;
-}
-.ml-30 {
-  margin-left: 30px;
-}
-.ml-40 {
-  margin-left: 40px;
-}
-
-.mr-10 {
-  margin-right: 10px;
-}
-.mr-20 {
-  margin-right: 20px;
-}
-.mr-30 {
-  margin-right: 30px;
-}
-.mr-40 {
-  margin-right: 40px;
-}
-
-.pt-10 {
-  padding-top: 10px;
-}
-.pt-20 {
-  padding-top: 20px;
-}
-.pt-30 {
-  padding-top: 30px;
-}
-.pt-40 {
-  padding-top: 40px;
-}
-
-.pb-10 {
-  padding-bottom: 10px;
-}
-.pb-20 {
-  padding-bottom: 20px;
-}
-.pb-30 {
-  padding-bottom: 30px;
-}
-.pb-40 {
-  padding-bottom: 40px;
-}
-
-.pl-10 {
-  padding-left: 10px;
-}
-.pl-20 {
-  padding-left: 20px;
-}
-.pl-30 {
-  padding-left: 30px;
-}
-.pl-40 {
-  padding-left: 40px;
-}
-
-.pr-10 {
-  padding-right: 10px;
-}
-.pr-20 {
-  padding-right: 20px;
-}
-.pr-30 {
-  padding-right: 30px;
-}
-.pr-40 {
-  padding-right: 40px;
-}
-
-/* 文本样式 */
-.text-center {
-  text-align: center;
-}
-.text-left {
-  text-align: left;
-}
-.text-right {
-  text-align: right;
-}
-
-.app {
-  min-height: 100vh;
-  padding: 48px 32px;
-  display: flex;
-  flex-direction: column;
-  gap: 24px;
-}
-
-.app--loading {
-  min-height: 100vh;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-}
-
-.app__greeting {
-  font-size: 36px;
-  font-weight: 600;
-}
-
-.app__platform {
-  font-size: 28px;
-  color: #666;
-}
-
-.app__actions {
-  display: flex;
-  gap: 16px;
-}
-
-.text-primary {
-  color: #0ea5e9;
-}
-.text-secondary {
-  color: #6b7280;
-}
-.text-success {
-  color: #22c55e;
-}
-.text-warning {
-  color: #f59e0b;
-}
-.text-error {
-  color: #ef4444;
-}
-
-.text-xs {
-  font-size: 20px;
-}
-.text-sm {
-  font-size: 24px;
-}
-.text-base {
-  font-size: 28px;
-}
-.text-lg {
-  font-size: 32px;
-}
-.text-xl {
-  font-size: 36px;
-}
-.text-2xl {
-  font-size: 40px;
-}
-.text-3xl {
-  font-size: 48px;
-}
-
-.font-bold {
-  font-weight: bold;
-}
-.font-medium {
-  font-weight: 500;
-}
-.font-normal {
-  font-weight: normal;
-}
-
-/* 边框样式 */
-.border {
-  border: 1px solid #e5e7eb;
-}
-.border-t {
-  border-top: 1px solid #e5e7eb;
-}
-.border-r {
-  border-right: 1px solid #e5e7eb;
-}
-.border-b {
-  border-bottom: 1px solid #e5e7eb;
-}
-.border-l {
-  border-left: 1px solid #e5e7eb;
-}
-
-.rounded {
-  border-radius: 8px;
-}
-.rounded-lg {
-  border-radius: 12px;
-}
-.rounded-xl {
-  border-radius: 16px;
-}
-.rounded-full {
-  border-radius: 9999px;
-}
-
-/* 背景样式 */
-.bg-white {
-  background-color: #ffffff;
-}
-.bg-gray-50 {
-  background-color: #f9fafb;
-}
-.bg-gray-100 {
-  background-color: #f3f4f6;
-}
-.bg-primary {
-  background-color: #0ea5e9;
-}
-.bg-success {
-  background-color: #22c55e;
-}
-.bg-warning {
-  background-color: #f59e0b;
-}
-.bg-error {
-  background-color: #ef4444;
-}
-
-/* 阴影样式 */
-.shadow-sm {
-  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
-}
-.shadow {
-  box-shadow:
-    0 1px 3px 0 rgba(0, 0, 0, 0.1),
-    0 1px 2px 0 rgba(0, 0, 0, 0.06);
-}
-.shadow-md {
-  box-shadow:
-    0 4px 6px -1px rgba(0, 0, 0, 0.1),
-    0 2px 4px -1px rgba(0, 0, 0, 0.06);
-}
-.shadow-lg {
-  box-shadow:
-    0 10px 15px -3px rgba(0, 0, 0, 0.1),
-    0 4px 6px -2px rgba(0, 0, 0, 0.05);
-}
-
-/* 按钮样式 */
-.btn {
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  padding: 12px 24px;
-  border-radius: 8px;
-  font-size: 28px;
-  font-weight: 500;
-  text-align: center;
-  cursor: pointer;
-  transition: all 0.3s ease;
-  border: none;
-  outline: none;
-}
-
-.btn-primary {
-  background-color: #0ea5e9;
-  color: white;
-}
-
-.btn-primary:hover {
-  background-color: #0284c7;
-}
-
-.btn-secondary {
-  background-color: #6b7280;
-  color: white;
-}
-
-.btn-secondary:hover {
-  background-color: #4b5563;
-}
-
-.btn-success {
-  background-color: #22c55e;
-  color: white;
-}
-
-.btn-success:hover {
-  background-color: #16a34a;
-}
-
-.btn-warning {
-  background-color: #f59e0b;
-  color: white;
-}
-
-.btn-warning:hover {
-  background-color: #d97706;
-}
-
-.btn-error {
-  background-color: #ef4444;
-  color: white;
-}
-
-.btn-error:hover {
-  background-color: #dc2626;
-}
-
-/* 响应式设计 */
-@media (max-width: 768px) {
-  .container {
-    padding: 0 16px;
-  }
-
-  .text-3xl {
-    font-size: 36px;
-  }
-  .text-2xl {
-    font-size: 32px;
-  }
-  .text-xl {
-    font-size: 28px;
-  }
-}
-
-/* 动画效果 */
-@keyframes fadeIn {
-  from {
-    opacity: 0;
-  }
-  to {
-    opacity: 1;
-  }
-}
-
-@keyframes slideInUp {
-  from {
-    transform: translateY(100%);
-    opacity: 0;
-  }
-  to {
-    transform: translateY(0);
-    opacity: 1;
-  }
-}
-
-@keyframes slideInDown {
-  from {
-    transform: translateY(-100%);
-    opacity: 0;
-  }
-  to {
-    transform: translateY(0);
-    opacity: 1;
-  }
-}
-
-.fade-in {
-  animation: fadeIn 0.3s ease-in-out;
-}
-
-.slide-in-up {
-  animation: slideInUp 0.3s ease-out;
-}
-
-.slide-in-down {
-  animation: slideInDown 0.3s ease-out;
-}
-
-/* 工具类 */
-.overflow-hidden {
-  overflow: hidden;
-}
-.overflow-auto {
-  overflow: auto;
-}
-.overflow-scroll {
-  overflow: scroll;
-}
-
-.position-relative {
-  position: relative;
-}
-.position-absolute {
-  position: absolute;
-}
-.position-fixed {
-  position: fixed;
-}
-
-.width-full {
-  width: 100%;
-}
-.height-full {
-  height: 100%;
-}
-
-.cursor-pointer {
-  cursor: pointer;
-}
-.cursor-default {
-  cursor: default;
-}
-
-.disabled {
-  opacity: 0.5;
-  cursor: not-allowed;
-  pointer-events: none;
-}
-
-/* 主题变量 */
-:root {
-  --primary-color: #0ea5e9;
-  --secondary-color: #6b7280;
-  --success-color: #22c55e;
-  --warning-color: #f59e0b;
-  --error-color: #ef4444;
-  --text-color: #333333;
-  --text-color-secondary: #6b7280;
-  --border-color: #e5e7eb;
-  --background-color: #f5f5f5;
-  --background-color-white: #ffffff;
-}
-
-/* 暗色主题 */
-@media (prefers-color-scheme: dark) {
-  :root {
-    --primary-color: #0ea5e9;
-    --secondary-color: #9ca3af;
-    --success-color: #22c55e;
-    --warning-color: #f59e0b;
-    --error-color: #ef4444;
-    --text-color: #ffffff;
-    --text-color-secondary: #d1d5db;
-    --border-color: #374151;
-    --background-color: #111827;
-    --background-color-white: #1f2937;
-  }
-}

package/src/app.tsx

@@ -1,44 +0,0 @@
-import React from 'react';
-import { View, Text } from '@tarojs/components';
-import { AppProvider, useAppContext } from './providers';
-import { Button } from './components/basic/Button';
-import './app.scss';
-import './styles/reset.scss';
-import './styles/base.scss';
-
-const AppShell: React.FC = () => {
-  const { platform, theme, isReady } = useAppContext();
-
-  const handleToggleTheme = () => {
-    theme.toggleTheme();
-  };
-
-  if (!isReady) {
-    return (
-      <View className="app app--loading">
-        <Text>初始化中...</Text>
-      </View>
-    );
-  }
-
-  return (
-    <View className="app">
-      <Text className="app__greeting">欢迎使用 Taro Uno UI</Text>
-      <Text className="app__platform">当前运行环境: {platform.name}</Text>
-
-      <View className="app__actions">
-        <Button type="primary" onClick={handleToggleTheme}>
-          {theme.isDark ? '切换至浅色主题' : '切换至暗色主题'}
-        </Button>
-      </View>
-    </View>
-  );
-};
-
-const App: React.FC = () => (
-  <AppProvider>
-    <AppShell />
-  </AppProvider>
-);
-
-export default App;

package/src/components/basic/Button/Button.styles.ts

@@ -1,130 +0,0 @@
-import { CSSProperties } from 'react';
-
-export const buttonStyles: Record<string, CSSProperties> = {
-  // 基础样式
-  base: {
-    display: 'inline-flex',
-    alignItems: 'center',
-    justifyContent: 'center',
-    borderRadius: 6,
-    border: '1px solid transparent',
-    cursor: 'pointer',
-    transition: 'all 0.2s ease',
-    fontSize: 14,
-    fontWeight: 500,
-    outline: 'none',
-    boxSizing: 'border-box' as const,
-  },
-
-  // 尺寸样式
-  small: {
-    padding: '6px 12px',
-    fontSize: 12,
-    height: 28,
-  },
-  medium: {
-    padding: '8px 16px',
-    fontSize: 14,
-    height: 32,
-  },
-  large: {
-    padding: '12px 24px',
-    fontSize: 16,
-    height: 40,
-  },
-
-  // 类型样式
-  default: {
-    backgroundColor: '#ffffff',
-    color: '#374151',
-    borderColor: '#d1d5db',
-  },
-  primary: {
-    backgroundColor: '#3b82f6',
-    color: '#ffffff',
-    borderColor: '#3b82f6',
-  },
-  success: {
-    backgroundColor: '#10b981',
-    color: '#ffffff',
-    borderColor: '#10b981',
-  },
-  warning: {
-    backgroundColor: '#f59e0b',
-    color: '#ffffff',
-    borderColor: '#f59e0b',
-  },
-  danger: {
-    backgroundColor: '#ef4444',
-    color: '#ffffff',
-    borderColor: '#ef4444',
-  },
-
-  // 变体样式
-  solid: {},
-  outline: {
-    backgroundColor: 'transparent',
-    borderWidth: 1,
-  },
-  ghost: {
-    backgroundColor: 'transparent',
-    borderColor: 'transparent',
-  },
-  text: {
-    backgroundColor: 'transparent',
-    borderColor: 'transparent',
-    borderWidth: 0,
-    padding: 0,
-  },
-
-  // 形状样式
-  defaultShape: {
-    borderRadius: 6,
-  },
-  round: {
-    borderRadius: 16,
-  },
-  circle: {
-    borderRadius: '50%',
-    width: 32,
-    height: 32,
-    padding: 0,
-  },
-
-  // 状态样式
-  disabled: {
-    opacity: 0.5,
-    cursor: 'not-allowed',
-  },
-  loading: {
-    opacity: 0.7,
-    cursor: 'not-allowed',
-  },
-
-  // 内容样式
-  icon: {
-    marginRight: 6,
-    display: 'flex',
-    alignItems: 'center',
-  },
-  buttonText: {
-    textAlign: 'center' as const,
-  },
-  loadingContent: {
-    display: 'flex',
-    alignItems: 'center',
-    gap: 6,
-  },
-  loadingIcon: {
-    width: 14,
-    height: 14,
-    border: '2px solid transparent',
-    borderTopColor: 'currentColor',
-    borderRadius: '50%',
-    animation: 'spin 1s linear infinite',
-  },
-  loadingText: {
-    fontSize: 'inherit',
-    color: 'inherit',
-  },
-};