@uni-sw/u-design

服务于企业级产品的设计体系，基于确定和自然的设计价值观上的模块化解决方案，让设计者和开发者专注于更好的用户体验。

特性

• 🎨 丰富组件: 提供基础组件、布局组件、业务组件和扩展组件四大类，满足企业级应用需求
• 💡 TypeScript 支持: 完整的类型定义，提供更好的开发体验和代码提示
• 🎯 主题定制: 基于 Less 变量的主题定制能力，支持暗黑模式
• 📱 响应式设计: 适配不同设备尺寸，提供一致的用户体验
• 🔧 易于使用: 简洁的 API 设计，快速上手
• 🌐 国际化支持: 内置多语言支持

安装

# 使用 npm 安装
npm install @uni-sw/u-design

# 使用 yarn 安装
yarn add @uni-sw/u-design

环境要求

• React >= 16.9.0
• React DOM >= 16.9.0

快速开始

完整引入

import React from 'react';
import { UButton, UInput, UTable } from '@uni-sw/u-design';

function App() {
  return (
    <div>
      <UButton type="primary">点击我</UButton>
    </div>
  );
}

export default App;

按需引入

import { UButton } from '@uni-sw/u-design';

// 或者在 babel-plugin-import 配置下自动引入样式

基础示例

import React from 'react';
import { UButton, UInput, UDatePicker } from '@uni-sw/u-design';

function Example() {
  const handleClick = () => {
    console.log('按钮被点击');
  };

  return (
    <div>
      <UButton type="primary" onClick={handleClick}>
        主要按钮
      </UButton>

      <UInput placeholder="请输入内容" />

      <UDatePicker placeholder="选择日期" />
    </div>
  );
}

export default Example;