@snowcone-app/sdk 0.1.10

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.
package/CHANGELOG.md ADDED
@@ -0,0 +1,136 @@
1
+ # Changelog
2
+
3
+ All notable changes to the Merch SDK will be documented in this file.
4
+
5
+ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
6
+ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
7
+
8
+ ## [0.1.9] - 2025-10-16
9
+
10
+ ### Added
11
+ - **DOM-Based URL Resolution** - Intelligent URL resolution for transformed assets
12
+ - Added `resolveUrlFromDOM()` to find actual rendered URLs in the DOM
13
+ - Automatically resolves Vercel Blob Storage URLs from v0.dev
14
+ - Fuzzy filename matching to handle URL transformations with suffixes
15
+ - Perfect for environments where image URLs are transformed at runtime
16
+
17
+ ### Changed
18
+ - **Enhanced URL Normalization** - Multi-tier resolution strategy
19
+ 1. First attempts to find actual URL in DOM (for v0/Blob Storage)
20
+ 2. Falls back to `window.location.origin` conversion
21
+ 3. Warns about localhost URLs for better developer experience
22
+
23
+ ### Fixed
24
+ - Relative URLs now work correctly in v0.dev and Vercel Blob Storage environments
25
+ - Mockup generation can access transformed image URLs with hash suffixes
26
+
27
+ ## [0.1.8] - 2025-10-16
28
+
29
+ ### Added
30
+ - **Automatic URL Normalization** - Relative artwork URLs are now automatically converted to absolute URLs
31
+ - Added `normalizeImageUrl()` utility function in `utils/url.ts`
32
+ - Supports `/images/art.jpg`, `./art.jpg`, `../art.jpg` patterns
33
+ - Browser-only conversion using `window.location.origin`
34
+ - SSR-safe with helpful warnings
35
+
36
+ ### Changed
37
+ - **Design Generation** - All artwork URLs are normalized in `createDesignForPlacements()`
38
+ - Handles placement designs, provided images, and default URLs
39
+ - Single source of truth for URL normalization
40
+ - **Validation** - Updated `validateImageUrl()` to accept relative URLs
41
+ - Now allows: absolute URLs, relative URLs, protocol-relative URLs, data URLs
42
+ - Clear error messages for invalid formats
43
+
44
+ ### Fixed
45
+ - Artwork URLs no longer require absolute paths - relative paths work seamlessly
46
+ - Better developer experience matching Next.js image patterns
47
+
48
+ ## [0.1.7] - 2025-10-16
49
+
50
+ ### Changed
51
+ - Version bump to maintain parity with @snowcone-app/ui 0.1.11
52
+ - No functional changes in this release
53
+
54
+ ## [0.1.0] - 2025-10-10
55
+
56
+ ### ⚠️ Alpha Release
57
+
58
+ This is the first alpha release of the Merch SDK. The API is functional but may change based on feedback. Breaking changes are expected before 1.0.0.
59
+
60
+ ### Added
61
+
62
+ - **Product Data API**
63
+ - `getProduct(productId)` - Fetch single product by ID
64
+ - `listProducts(options)` - List products with pagination
65
+ - Full TypeScript type definitions for product catalog data
66
+
67
+ - **Mockup Generation**
68
+ - `generateMockupUrl()` - Generate real-time mockup URLs
69
+ - Support for artwork positioning with `ImageAlignment` types
70
+ - Placement-aware mockup rendering (Front, Back, Sleeve, etc.)
71
+
72
+ - **Configuration**
73
+ - `config()` - Global SDK configuration
74
+ - Environment variable support for Next.js
75
+ - Mock mode for development without API calls
76
+
77
+ - **React Hooks** (Optional)
78
+ - `useRealtimeMockup()` - React hook for mockup generation
79
+ - Automatic state management for mockup URLs
80
+
81
+ ### Features
82
+
83
+ - **Mock Mode** - Develop without API calls using built-in mock data
84
+ - **TypeScript First** - Full type safety with exported types
85
+ - **Environment Variables** - Automatic configuration from Next.js env vars
86
+ - **Headless Design** - Framework-agnostic core, optional React bindings
87
+
88
+ ### Development
89
+
90
+ - Monorepo structure with pnpm workspaces
91
+ - Example implementations in Next.js and Remix
92
+ - Comprehensive test coverage
93
+
94
+ ### Documentation
95
+
96
+ - LLM-optimized README with clear examples
97
+ - Inline JSDoc comments for all public APIs
98
+ - TypeScript definitions for IDE autocomplete
99
+
100
+ ---
101
+
102
+ **Note on Versioning**: This is a pre-1.0 release. We follow semver, but breaking changes may occur in minor versions (0.x.y) as we iterate based on real-world usage. Pin your versions or use exact version numbers during alpha.
103
+
104
+ **Migration from 0.0.14**: If you were using the previous 0.0.14 version, this is a significant refactor. Please refer to the README for updated API patterns.
105
+
106
+ ---
107
+
108
+ ## Development Roadmap
109
+
110
+ See [ROADMAP.md](../../ROADMAP.md) for planned features and timeline.
111
+
112
+ ### Coming Soon (0.2.0)
113
+
114
+ - Advanced mockup caching strategies
115
+ - Batch mockup generation
116
+ - Product search and filtering
117
+ - Design/artwork management APIs
118
+
119
+ ### Future Releases
120
+
121
+ - Webhooks for mockup generation
122
+ - Order management APIs
123
+ - User account integration
124
+ - Analytics and tracking
125
+
126
+ ---
127
+
128
+ ## Support
129
+
130
+ - **Issues**: [GitHub Issues](https://github.com/merch-dev/ui-components/issues)
131
+ - **Discussions**: [GitHub Discussions](https://github.com/merch-dev/ui-components/discussions)
132
+ - **Docs**: [developers.snowcone.app](https://developers.snowcone.app)
133
+
134
+ ---
135
+
136
+ **Built for developers. Optimized for LLMs.** 🤖
package/README.md ADDED
@@ -0,0 +1,195 @@
1
+ # @snowcone-app/sdk
2
+
3
+ **JavaScript/TypeScript SDK for product mockups and print-on-demand**
4
+
5
+ Merch provides a simple SDK for fetching product data and generating real-time merchandise mockups. Use it to visualize artwork on t-shirts, posters, mugs, and more.
6
+
7
+ ## Installation
8
+
9
+ ```bash
10
+ npm install @snowcone-app/sdk
11
+ # or
12
+ yarn add @snowcone-app/sdk
13
+ # or
14
+ pnpm add @snowcone-app/sdk
15
+ ```
16
+
17
+ ## Quick Start
18
+
19
+ ```typescript
20
+ import { getProduct, listProducts, generateMockupUrl } from '@snowcone-app/sdk';
21
+
22
+ // Fetch a product by ID
23
+ const product = await getProduct('BEEB77');
24
+ console.log(product.name); // "Bella + Canvas 3001 Unisex Jersey Short Sleeve Tee"
25
+
26
+ // List all products
27
+ const products = await listProducts({ limit: 10 });
28
+ console.log(`Found ${products.length} products`);
29
+
30
+ // Generate a mockup URL
31
+ const mockupUrl = generateMockupUrl({
32
+ productId: 'BEEB77',
33
+ variantId: 'white-sm',
34
+ artworkUrl: 'https://example.com/artwork.png',
35
+ placement: 'Front',
36
+ alignment: 'center'
37
+ });
38
+ console.log(mockupUrl); // URL to mockup image
39
+ ```
40
+
41
+ ## Configuration
42
+
43
+ Configure the SDK to point to your Merch endpoint:
44
+
45
+ ```typescript
46
+ import { config } from '@snowcone-app/sdk';
47
+
48
+ config({
49
+ endpoint: 'https://api.snowcone.app',
50
+ mockupUrl: 'https://mockup.snowcone.app',
51
+ accountId: 'your-account-id',
52
+ mode: 'live' // or 'mock' for development
53
+ });
54
+ ```
55
+
56
+ **Environment Variables (Next.js):**
57
+ ```bash
58
+ NEXT_PUBLIC_MERCH_ENDPOINT=https://api.snowcone.app
59
+ NEXT_PUBLIC_MERCH_MOCKUP_URL=https://mockup.snowcone.app
60
+ NEXT_PUBLIC_MERCH_ACCOUNT_ID=your-account-id
61
+ ```
62
+
63
+ The SDK automatically reads these environment variables if not configured explicitly.
64
+
65
+ ## Core Functions
66
+
67
+ ### Product Data
68
+
69
+ ```typescript
70
+ // Get a single product
71
+ const product = await getProduct(productId: string, options?: {
72
+ endpoint?: string;
73
+ mode?: 'mock' | 'live' | 'meilisearch';
74
+ });
75
+
76
+ // List products
77
+ const products = await listProducts(options?: {
78
+ limit?: number;
79
+ offset?: number;
80
+ endpoint?: string;
81
+ mode?: 'mock' | 'live' | 'meilisearch';
82
+ });
83
+ ```
84
+
85
+ **Product Object Structure:**
86
+ ```typescript
87
+ {
88
+ id: string; // Product ID (e.g., "BEEB77")
89
+ name: string; // Product name
90
+ description?: string; // Product description
91
+ basePrice: number; // Base price in cents
92
+ variants: Variant[]; // Color/size variants
93
+ placements: Placement[]; // Print areas (Front, Back, etc.)
94
+ mockup: {
95
+ blankUrl: string; // Blank product image URL
96
+ };
97
+ }
98
+ ```
99
+
100
+ ### Mockup Generation
101
+
102
+ ```typescript
103
+ import { generateMockupUrl } from '@snowcone-app/sdk';
104
+
105
+ const url = generateMockupUrl({
106
+ productId: string; // Required: Product ID
107
+ variantId?: string; // Optional: Specific variant (color/size)
108
+ artworkUrl: string; // Required: URL to artwork image
109
+ placement?: string; // Optional: Print area (default: 'Front')
110
+ alignment?: ImageAlignment; // Optional: How to position artwork
111
+ mode?: 'mock' | 'live'; // Optional: Mock or live rendering
112
+ });
113
+
114
+ // ImageAlignment options:
115
+ // 'center' | 'top' | 'bottom' | 'left' | 'right' |
116
+ // 'far-left' | 'far-right' | 'far-top' | 'far-bottom'
117
+ ```
118
+
119
+ ### React Hooks (Optional)
120
+
121
+ For React applications, use the React-specific exports:
122
+
123
+ ```typescript
124
+ import { useRealtimeMockup } from '@snowcone-app/sdk/react';
125
+
126
+ function MyComponent() {
127
+ const { mockupUrl, isGenerating } = useRealtimeMockup({
128
+ productId: 'BEEB77',
129
+ artworkUrl: artwork.src,
130
+ placement: 'Front',
131
+ alignment: 'center'
132
+ });
133
+
134
+ return <img src={mockupUrl} alt="Product mockup" />;
135
+ }
136
+ ```
137
+
138
+ ## TypeScript Support
139
+
140
+ Full TypeScript definitions are included. Import types:
141
+
142
+ ```typescript
143
+ import type {
144
+ CatalogProduct,
145
+ Variant,
146
+ Placement,
147
+ ImageAlignment
148
+ } from '@snowcone-app/sdk';
149
+ ```
150
+
151
+ ## Development Mode
152
+
153
+ Use mock mode for development without API calls:
154
+
155
+ ```typescript
156
+ config({ mode: 'mock' });
157
+
158
+ // Returns mock product data
159
+ const product = await getProduct('BEEB77');
160
+ ```
161
+
162
+ ## API Reference
163
+
164
+ See full API documentation at: [https://developers.snowcone.app/sdk](https://developers.snowcone.app/sdk)
165
+
166
+ ## React Components
167
+
168
+ For pre-built React components, install `@snowcone-app/ui`:
169
+
170
+ ```bash
171
+ npm install @snowcone-app/ui
172
+ ```
173
+
174
+ See: [@snowcone-app/ui on npm](https://www.npmjs.com/package/@snowcone-app/ui)
175
+
176
+ ## Examples
177
+
178
+ - [Next.js Example](https://github.com/merch-dev/ui-components/tree/main/examples/next-js)
179
+ - [Basic Product Display](https://github.com/merch-dev/ui-components/tree/main/examples/next-js/app/demos)
180
+
181
+ ## Support
182
+
183
+ - **Issues:** [GitHub Issues](https://github.com/merch-dev/ui-components/issues)
184
+ - **Discussions:** [GitHub Discussions](https://github.com/merch-dev/ui-components/discussions)
185
+ - **Docs:** [developers.snowcone.app](https://developers.snowcone.app)
186
+
187
+ ## License
188
+
189
+ MIT © [driuqzy](mailto:driuqzy@gmail.com)
190
+
191
+ ---
192
+
193
+ **Built for developers. Optimized for LLMs.** 🤖
194
+
195
+ > This SDK is designed to work seamlessly with AI coding assistants like Claude, GitHub Copilot, and Cursor. Clear types, explicit examples, and predictable patterns make it easy for LLMs to generate correct code.
@@ -0,0 +1,12 @@
1
+ // src/dev-fetcher.ts
2
+ function createDevFetcher(baseUrl) {
3
+ return async function devFetch(input, init) {
4
+ const url = input.startsWith("http") ? input : `${baseUrl}${input}`;
5
+ const res = await fetch(url, init);
6
+ return res;
7
+ };
8
+ }
9
+
10
+ export {
11
+ createDevFetcher
12
+ };