@simpoobusiness/sdk 1.0.9 → 1.0.11

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (30) hide show
  1. package/README.md +94 -65
  2. package/package.json +5 -8
  3. package/dist/api/client.d.ts +0 -1
  4. package/dist/assets/icons.d.ts +0 -1
  5. package/dist/assets/images/placeholder-image.svg +0 -4
  6. package/dist/cjs/index.js +0 -29456
  7. package/dist/cjs/index.js.map +0 -1
  8. package/dist/components/atoms/InfoCard.d.ts +0 -8
  9. package/dist/components/atoms/status-component.d.ts +0 -4
  10. package/dist/components/molecule/ItemEmpty.d.ts +0 -9
  11. package/dist/components/molecule/Table.d.ts +0 -27
  12. package/dist/components/molecule/pagination-component.d.ts +0 -13
  13. package/dist/components/ui/dropdown-menu.d.ts +0 -27
  14. package/dist/components/ui/hover-card.d.ts +0 -6
  15. package/dist/components/ui/skeleton.d.ts +0 -2
  16. package/dist/components/ui/table.d.ts +0 -10
  17. package/dist/components/widgets/inventory/InventoryTable.d.ts +0 -2
  18. package/dist/components/widgets/inventory/item-column.d.ts +0 -22
  19. package/dist/context/SimpooProvider.d.ts +0 -11
  20. package/dist/embed.d.ts +0 -4
  21. package/dist/esm/index.js +0 -29435
  22. package/dist/esm/index.js.map +0 -1
  23. package/dist/index.d.ts +0 -11
  24. package/dist/lib/utils.d.ts +0 -2
  25. package/dist/simpoo-sdk.js +0 -131
  26. package/dist/simpoo-sdk.js.map +0 -1
  27. package/dist/store/actions/utility.d.ts +0 -2
  28. package/dist/store/index.d.ts +0 -16
  29. package/dist/store/reducers/appSlice.d.ts +0 -6
  30. package/dist/styles.css +0 -1110
package/README.md CHANGED
@@ -1,65 +1,94 @@
1
- # @simpoobusiness/sdk
2
-
3
- A React-based SDK for embedding **Simpoo Business components** (like Inventory Table) into your application.
4
-
5
- ---
6
-
7
- ## 🚀 Installation
8
-
9
- Install via npm or yarn:
10
-
11
- ```bash
12
- npm install @simpoobusiness/sdk
13
- # OR
14
- yarn add @simpoobusiness/sdk
15
- ```
16
-
17
- ## ✅ Features
18
-
19
- - 📊 Inventory Table Component – Display real-time inventory.
20
-
21
- - 🔐 Secure API Calls – Uses your Simpoo API key.
22
-
23
- - 🎨 Styled with Tailwind & Responsive UI.
24
-
25
- - ⚡ Lightweight & Easy Integration.
26
-
27
- ## 📦 Usage
28
-
29
- Import and use the SDK components in your React application:
30
-
31
- Wrap your app with the **SimpooProvider** and pass your API key:
32
-
33
- ```jsx
34
- import { SimpooProvider, InventoryTable } from "@simpoobusiness/sdk";
35
-
36
- export default function App() {
37
- return (
38
- <SimpooProvider apiKey="YOUR_API_KEY">
39
- <div style={{ padding: "20px" }}>
40
- <h1>My Inventory</h1>
41
- <InventoryTable />
42
- </div>
43
- </SimpooProvider>
44
- );
45
- }
46
- ```
47
-
48
- > **Note:** Replace `YOUR_API_KEY` with your actual Simpoo Business API key.
49
-
50
- ## 🛠️ Available Components
51
-
52
- - `InventoryTable`: Displays your business inventory.
53
- - More components coming soon!
54
-
55
- ## ⚙️ Props
56
-
57
- Each component may accept specific props. For example, `InventoryTable`:
58
-
59
- | Prop | Type | Description |
60
- | ------ | ------ | ---------------------------- |
61
- | apiKey | string | Your Simpoo Business API key |
62
-
63
- ## 📖 Documentation
64
-
65
- See the [official docs](https://savics407.github.io/simpoo-sdk/) for more details and advanced usage.
1
+ # Simpoo SDK
2
+
3
+ Simpoo SDK allows you to embed inventory widgets into **any website** (HTML, PHP, Next.js, WordPress, etc.) with **just a script and CSS file**.
4
+ No npm installation is required.
5
+
6
+ ---
7
+
8
+ ## 🚀 Quick Start
9
+
10
+ ### Include SDK in Your Website
11
+
12
+ Add these tags inside your `<head>` or before `</body>`:
13
+
14
+ ```html
15
+ <link
16
+ rel="stylesheet"
17
+ href="https://unpkg.com/@simpoobusiness/sdk/dist/simpoo-sdk.css"
18
+ />
19
+ <script src="https://unpkg.com/@simpoobusiness/sdk/dist/simpoo-sdk.js"></script>
20
+ ```
21
+
22
+ Add a container where you want the inventory widget to appear:
23
+
24
+ ```html
25
+ <div id="inventory-widget"></div>
26
+ ```
27
+
28
+ Then initialize and render the widget:
29
+
30
+ ```html
31
+ <script>
32
+ SimpooSDK.init({ apiKey: "YOUR_API_KEY" });
33
+ SimpooSDK.renderInventory("#inventory-widget");
34
+ </script>
35
+ ```
36
+
37
+ ✅ **That's it!** The widget will load with full styling.
38
+
39
+ ---
40
+
41
+ ## 📦 CDN Files
42
+
43
+ - `simpoo-sdk.js` → Main SDK script (React included).
44
+ - `simpoo-sdk.css` → Styles for inventory components.
45
+
46
+ ---
47
+
48
+ ## ⚙️ API Reference
49
+
50
+ ### **SimpooSDK.init(config)**
51
+
52
+ Initialize the SDK with your configuration.
53
+
54
+ **Parameters:**
55
+
56
+ - `config.apiKey` (string) – Your API key.
57
+
58
+ **Example:**
59
+
60
+ ```js
61
+ SimpooSDK.init({ apiKey: "12345" });
62
+ ```
63
+
64
+ ---
65
+
66
+ ### **SimpooSDK.renderInventory(containerSelector)**
67
+
68
+ Render the inventory widget in a container.
69
+
70
+ **Parameters:**
71
+
72
+ - `containerSelector` (string) – CSS selector for the container.
73
+
74
+ **Example:**
75
+
76
+ ```js
77
+ SimpooSDK.renderInventory("#inventory-widget");
78
+ ```
79
+
80
+ ---
81
+
82
+ ## 🔍 Troubleshooting
83
+
84
+ - **Widget not rendering?**
85
+ Ensure the container `<div>` exists and the selector matches.
86
+ - **No styles applied?**
87
+ Make sure `<link rel="stylesheet" href="https://cdn.example.com/simpoo-sdk.css">` is included.
88
+ <!-- *(If missing, the SDK will auto-inject CSS.)* -->
89
+
90
+ ---
91
+
92
+ ## 📄 License
93
+
94
+ MIT
package/package.json CHANGED
@@ -3,7 +3,7 @@
3
3
  "publishConfig": {
4
4
  "access": "public"
5
5
  },
6
- "version": "1.0.9",
6
+ "version": "1.0.11",
7
7
  "main": "dist/cjs/index.js",
8
8
  "module": "dist/esm/index.js",
9
9
  "types": "dist/index.d.ts",
@@ -13,14 +13,11 @@
13
13
  "dist"
14
14
  ],
15
15
  "scripts": {
16
- "docs": "typedoc --out docs src",
16
+ "docs": "typedoc --out docs src/embed.tsx",
17
17
  "clean": "rimraf dist",
18
- "build": "npm run clean && npm run build:css && npm run build:types && rollup -c --bundleConfigAsCjs",
19
- "build:types": "tsc -p tsconfig.build.json",
20
- "build:css": "postcss src/styles/tailwind.css -o dist/styles.css",
21
- "build:watch": "rollup -c --watch --bundleConfigAsCjs",
22
- "prepare": "npm run build",
23
- "publish:npm": "npm run build && npm publish --access public"
18
+ "build": "npm run clean && rollup -c --bundleConfigAsCjs",
19
+ "build:watch": "rollup -c rollup.config.js --watch --bundleConfigAsCjs",
20
+ "publish:npm": "npm publish --access public"
24
21
  },
25
22
  "keywords": [
26
23
  "sdk",
package/dist/api/client.d.ts DELETED
@@ -1 +0,0 @@
1
- export declare const createApiClient: (apiKey: string) => Axios.AxiosInstance;
package/dist/assets/icons.d.ts DELETED
@@ -1 +0,0 @@
1
- export declare const icons: Icons;
package/dist/assets/images/placeholder-image.svg DELETED
@@ -1,4 +0,0 @@
1
- <svg width="120" height="120" viewBox="0 0 120 120" fill="none" xmlns="http://www.w3.org/2000/svg">
2
- <rect width="120" height="120" rx="12" fill="#E1E3EA"/>
3
- <path d="M40.1667 85.5H79.8333C82.9629 85.5 85.5 82.9629 85.5 79.8333V40.1667C85.5 37.0371 82.9629 34.5 79.8333 34.5H40.1667C37.0371 34.5 34.5 37.0371 34.5 40.1667V79.8333C34.5 82.9629 37.0371 85.5 40.1667 85.5ZM40.1667 85.5L71.3333 54.3333L85.5 68.5M54.3333 50.0833C54.3333 52.4305 52.4305 54.3333 50.0833 54.3333C47.7361 54.3333 45.8333 52.4305 45.8333 50.0833C45.8333 47.7361 47.7361 45.8333 50.0833 45.8333C52.4305 45.8333 54.3333 47.7361 54.3333 50.0833Z" stroke="#5E6278" stroke-width="4" stroke-linecap="round" stroke-linejoin="round"/>
4
- </svg>