@snowcone-app/ui 0.4.8 → 0.4.9

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 CHANGED
@@ -1,5 +1,14 @@
1
1
  # Changelog
2
2
 
3
+ ## 0.4.9
4
+
5
+ ### Patch Changes
6
+
7
+ - [#1150](https://github.com/snowcone-app/snowcone-monorepo/pull/1150) [`06997b2`](https://github.com/snowcone-app/snowcone-monorepo/commit/06997b211736d906d16eb9edeb186404f5acb19c) Thanks [@kevinsproles](https://github.com/kevinsproles)! - Spread-mode printables now use JSON canvas-state realtime mode: `WebSocketConfig.spreadCrops` carries the spread/group artboard geometry (piece rects keyed by placement label), and `RealtimeProvider.setSpreadCrops` sends it on the realtime config so the server slices each rendered spread artboard into per-placement images — no client pixel upload.
8
+
9
+ - Updated dependencies [[`06997b2`](https://github.com/snowcone-app/snowcone-monorepo/commit/06997b211736d906d16eb9edeb186404f5acb19c)]:
10
+ - @snowcone-app/sdk@0.20.2
11
+
3
12
  ## 0.4.8
4
13
 
5
14
  ### Patch Changes
package/dist/index.cjs CHANGED
@@ -5969,6 +5969,9 @@ function RealtimeProvider({
5969
5969
  const placementSettingsOverridesRef = (0, import_react25.useRef)({});
5970
5970
  const lastSentVariantIdRef = (0, import_react25.useRef)(null);
5971
5971
  const lastSentBgRef = (0, import_react25.useRef)(void 0);
5972
+ const spreadCropsRef = (0, import_react25.useRef)(void 0);
5973
+ const [spreadCropsVersion, setSpreadCropsVersion] = (0, import_react25.useState)(0);
5974
+ const lastSentSpreadCropsRef = (0, import_react25.useRef)("null");
5972
5975
  const lastSentColorsRef = (0, import_react25.useRef)({});
5973
5976
  const realtimeMockup = (0, import_react26.useRealtimeMockup)({
5974
5977
  wsUrl,
@@ -6155,6 +6158,7 @@ function RealtimeProvider({
6155
6158
  configSentRef.current = false;
6156
6159
  lastSentVariantIdRef.current = null;
6157
6160
  lastSentBgRef.current = void 0;
6161
+ lastSentSpreadCropsRef.current = "null";
6158
6162
  lastSentColorsRef.current = {};
6159
6163
  };
6160
6164
  }
@@ -6177,7 +6181,9 @@ function RealtimeProvider({
6177
6181
  const isFirstSend = !configSentRef.current;
6178
6182
  const variantChanged = lastSentVariantIdRef.current !== null && lastSentVariantIdRef.current !== variantId;
6179
6183
  const bgChanged = configSentRef.current && lastSentBgRef.current !== mockupBg;
6180
- if (!isFirstSend && !variantChanged && !bgChanged) {
6184
+ const spreadCropsJson = JSON.stringify(spreadCropsRef.current ?? null);
6185
+ const spreadCropsChanged = configSentRef.current && lastSentSpreadCropsRef.current !== spreadCropsJson;
6186
+ if (!isFirstSend && !variantChanged && !bgChanged && !spreadCropsChanged) {
6181
6187
  return;
6182
6188
  }
6183
6189
  const mockupIds = [];
@@ -6195,6 +6201,7 @@ function RealtimeProvider({
6195
6201
  shop,
6196
6202
  width: mockupWidth,
6197
6203
  ...mockupBg ? { bg: mockupBg } : {},
6204
+ ...spreadCropsRef.current ? { spreadCrops: spreadCropsRef.current } : {},
6198
6205
  placementSettings: { ...placementSettingsOverridesRef.current }
6199
6206
  } : {
6200
6207
  productId,
@@ -6204,6 +6211,7 @@ function RealtimeProvider({
6204
6211
  seal: "bypass-sig-for-k6-load-test",
6205
6212
  width: mockupWidth,
6206
6213
  ...mockupBg ? { bg: mockupBg } : {},
6214
+ ...spreadCropsRef.current ? { spreadCrops: spreadCropsRef.current } : {},
6207
6215
  placementSettings: { ...placementSettingsOverridesRef.current }
6208
6216
  };
6209
6217
  if (variantChanged) {
@@ -6216,6 +6224,7 @@ function RealtimeProvider({
6216
6224
  configSentRef.current = true;
6217
6225
  lastSentVariantIdRef.current = variantId;
6218
6226
  lastSentBgRef.current = mockupBg;
6227
+ lastSentSpreadCropsRef.current = spreadCropsJson;
6219
6228
  setTimeout(() => {
6220
6229
  const colorPlacements = placements.filter((p) => p.type === "color");
6221
6230
  colorPlacements.forEach((p) => {
@@ -6234,7 +6243,8 @@ function RealtimeProvider({
6234
6243
  sendConfigRaw,
6235
6244
  sendColorBlobTracked,
6236
6245
  mockupWidth,
6237
- mockupBg
6246
+ mockupBg,
6247
+ spreadCropsVersion
6238
6248
  ]);
6239
6249
  (0, import_react25.useEffect)(() => {
6240
6250
  if (!isEnabled || !isConnected || !isConfigured || !productContext?.product)
@@ -6268,6 +6278,17 @@ function RealtimeProvider({
6268
6278
  },
6269
6279
  [updatePlacementSettingsRaw]
6270
6280
  );
6281
+ const setSpreadCrops = (0, import_react25.useCallback)(
6282
+ (crops) => {
6283
+ const next = crops && Object.keys(crops).length > 0 ? crops : void 0;
6284
+ if (JSON.stringify(next ?? null) === JSON.stringify(spreadCropsRef.current ?? null)) {
6285
+ return;
6286
+ }
6287
+ spreadCropsRef.current = next;
6288
+ setSpreadCropsVersion((v) => v + 1);
6289
+ },
6290
+ []
6291
+ );
6271
6292
  const enableRealtime = (0, import_react25.useCallback)(() => {
6272
6293
  setIsEnabled(true);
6273
6294
  }, []);
@@ -6553,6 +6574,7 @@ function RealtimeProvider({
6553
6574
  sendCanvasState,
6554
6575
  updateMockupIds: updateMockupIdsRaw,
6555
6576
  updatePlacementSettings: updatePlacementSettingsWrapped,
6577
+ setSpreadCrops,
6556
6578
  getMockupResultsImmediate: () => mockupResultsRef.current,
6557
6579
  subscribeMockupResults: stableSubscribeMockupResults,
6558
6580
  subscribeMockupResultById: stableSubscribeMockupResultById,
@@ -6589,6 +6611,7 @@ function RealtimeProvider({
6589
6611
  sendCanvasState,
6590
6612
  updateMockupIdsRaw,
6591
6613
  updatePlacementSettingsWrapped,
6614
+ setSpreadCrops,
6592
6615
  stableSubscribeMockupResults,
6593
6616
  stableSubscribeMockupResultById,
6594
6617
  notifyPendingExport,