one-ewallet-otc-ui 0.0.3 → 0.0.4

package/README.md

@@ -58,7 +58,18 @@ function App() {
 }
 ```
 
-### 2. Using OtcModal Component
+### 2. Import Styles (Required)
+
+**Important:** You must import the component library's styles in your application entry file:
+
+```tsx
+// In your main.tsx or App.tsx
+import 'one-ewallet-otc-ui/style.css'
+// or
+import 'one-ewallet-otc-ui/dist/style.css'
+```
+
+### 3. Using OtcModal Component
 
 `OtcModal` is an OTC trading modal component:
 
@@ -89,7 +100,7 @@ function MyComponent() {
 | `userAddress` | `string` | ✅ | - | User Sui wallet address |
 | `lang` | `'ZH' \| 'EN'` | ❌ | `'EN'` | Interface language |
 
-### 3. Using Withdraw Component
+### 4. Using Withdraw Component
 
 `Withdraw` is a withdrawal component that requires SuiClient support:
 
@@ -147,6 +158,8 @@ import { createRoot } from 'react-dom/client'
 import { SuiClientProvider, createNetworkConfig, useSuiClient } from '@onelabs/dapp-kit'
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
 import { OtcModal, Withdraw } from 'one-ewallet-otc-ui'
+// Import styles
+import 'one-ewallet-otc-ui/style.css'
 
 // Create Sui network configuration
 const { networkConfig } = createNetworkConfig({
@@ -212,7 +225,16 @@ createRoot(document.getElementById('root')!).render(<App />)
 
 ## 🎨 Styling
 
-The component library includes built-in styles, so no additional CSS imports are needed. Styles are written in SCSS and are automatically bundled.
+**Important:** You must import the component library's styles in your application entry file:
+
+```tsx
+// In your main.tsx or App.tsx
+import 'one-ewallet-otc-ui/style.css'
+// or
+import 'one-ewallet-otc-ui/dist/style.css'
+```
+
+The component library includes built-in styles written in SCSS. The styles are automatically bundled into `dist/style.css` during the build process. Make sure to import this CSS file in your application for the components to display correctly.
 
 ## 🔌 API Endpoints
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "one-ewallet-otc-ui",
-  "version": "0.0.3",
+  "version": "0.0.4",
   "type": "module",
   "files": [
     "dist"
@@ -13,8 +13,13 @@
       "import": "./dist/index.es.js",
       "require": "./dist/index.umd.js",
       "types": "./dist/types/components/index.d.ts"
+    },
+    "./style.css": {
+      "import": "./dist/style.css",
+      "require": "./dist/style.css"
     }
   },
+  "style": "./dist/style.css",
   "scripts": {
     "dev": "vite",
     "build": "tsc && vite build",