@particle-academy/react-fancy 5.48.0 → 5.49.0

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 (92) hide show
  1. package/CHANGELOG.md +32 -0
  2. package/dist/FauxClient.types-Dtk9aRs6.d.cts +64 -0
  3. package/dist/FauxClient.types-Dtk9aRs6.d.ts +64 -0
  4. package/dist/{ImageViewer.types-BaqlDeuo.d.cts → ImageViewer.types-BDTxBYEN.d.ts} +9 -0
  5. package/dist/{ImageViewer.types-BaqlDeuo.d.ts → ImageViewer.types-CtqaA6KV.d.cts} +9 -0
  6. package/dist/{PdfViewer.types-_u6vboSl.d.ts → PdfViewer.types-Bgn9EmZT.d.cts} +8 -0
  7. package/dist/{PdfViewer.types-_u6vboSl.d.cts → PdfViewer.types-xnPpdjJa.d.ts} +8 -0
  8. package/dist/button.cjs +4 -4
  9. package/dist/button.js +2 -2
  10. package/dist/{chunk-ICQJ6475.cjs → chunk-3XJKJQSY.cjs} +4 -4
  11. package/dist/{chunk-ICQJ6475.cjs.map → chunk-3XJKJQSY.cjs.map} +1 -1
  12. package/dist/{chunk-JVGJHIIQ.js → chunk-62WPAKFS.js} +3 -3
  13. package/dist/{chunk-JVGJHIIQ.js.map → chunk-62WPAKFS.js.map} +1 -1
  14. package/dist/{chunk-MQ4ULIOU.cjs → chunk-EEKXWXYO.cjs} +4 -4
  15. package/dist/{chunk-MQ4ULIOU.cjs.map → chunk-EEKXWXYO.cjs.map} +1 -1
  16. package/dist/{chunk-ND5D7GJB.cjs → chunk-FNYUUVOK.cjs} +5 -5
  17. package/dist/{chunk-ND5D7GJB.cjs.map → chunk-FNYUUVOK.cjs.map} +1 -1
  18. package/dist/{chunk-25ZOOUFG.js → chunk-GMNMJLZO.js} +3 -3
  19. package/dist/{chunk-25ZOOUFG.js.map → chunk-GMNMJLZO.js.map} +1 -1
  20. package/dist/{chunk-MRARASNZ.cjs → chunk-I6XHZ3S2.cjs} +4 -4
  21. package/dist/{chunk-MRARASNZ.cjs.map → chunk-I6XHZ3S2.cjs.map} +1 -1
  22. package/dist/{chunk-P7WMYJ5I.js → chunk-JHDO6CRT.js} +3 -3
  23. package/dist/{chunk-P7WMYJ5I.js.map → chunk-JHDO6CRT.js.map} +1 -1
  24. package/dist/{chunk-TX6VUYBC.js → chunk-K74R6IEB.js} +4 -4
  25. package/dist/{chunk-TX6VUYBC.js.map → chunk-K74R6IEB.js.map} +1 -1
  26. package/dist/{chunk-ZMD3PIYF.cjs → chunk-KST6GW2B.cjs} +6 -6
  27. package/dist/{chunk-ZMD3PIYF.cjs.map → chunk-KST6GW2B.cjs.map} +1 -1
  28. package/dist/{chunk-V35A6B7A.cjs → chunk-LP3HMRQT.cjs} +13 -4
  29. package/dist/chunk-LP3HMRQT.cjs.map +1 -0
  30. package/dist/{chunk-BFKCVSNK.cjs → chunk-LRNWD26Z.cjs} +5 -3
  31. package/dist/chunk-LRNWD26Z.cjs.map +1 -0
  32. package/dist/{chunk-KO2HLNBB.js → chunk-MQEV7XEG.js} +4 -4
  33. package/dist/{chunk-KO2HLNBB.js.map → chunk-MQEV7XEG.js.map} +1 -1
  34. package/dist/{chunk-WWUKTXPX.cjs → chunk-ODAPI4QJ.cjs} +11 -11
  35. package/dist/{chunk-WWUKTXPX.cjs.map → chunk-ODAPI4QJ.cjs.map} +1 -1
  36. package/dist/{chunk-XJXQG34J.js → chunk-QXYO76NZ.js} +5 -3
  37. package/dist/chunk-QXYO76NZ.js.map +1 -0
  38. package/dist/{chunk-S5ZYG5MG.cjs → chunk-RLC2BE3D.cjs} +15 -15
  39. package/dist/{chunk-S5ZYG5MG.cjs.map → chunk-RLC2BE3D.cjs.map} +1 -1
  40. package/dist/{chunk-QSAYIYEB.js → chunk-SK4AEUO4.js} +3 -3
  41. package/dist/{chunk-QSAYIYEB.js.map → chunk-SK4AEUO4.js.map} +1 -1
  42. package/dist/{chunk-RBEQLBKI.cjs → chunk-TKDUT7ZA.cjs} +6 -6
  43. package/dist/{chunk-RBEQLBKI.cjs.map → chunk-TKDUT7ZA.cjs.map} +1 -1
  44. package/dist/{chunk-SOYORSLZ.js → chunk-VKRQHLM5.js} +13 -4
  45. package/dist/chunk-VKRQHLM5.js.map +1 -0
  46. package/dist/{chunk-DMFJJ73P.js → chunk-VM5BNL4L.js} +3 -3
  47. package/dist/{chunk-DMFJJ73P.js.map → chunk-VM5BNL4L.js.map} +1 -1
  48. package/dist/{chunk-QDVDBUJM.cjs → chunk-WBJRFWZE.cjs} +26 -5
  49. package/dist/chunk-WBJRFWZE.cjs.map +1 -0
  50. package/dist/{chunk-MUCXXYDN.js → chunk-XOWWNG7D.js} +26 -5
  51. package/dist/chunk-XOWWNG7D.js.map +1 -0
  52. package/dist/{chunk-JJRD3WX3.js → chunk-ZLYOMQ2J.js} +3 -3
  53. package/dist/{chunk-JJRD3WX3.js.map → chunk-ZLYOMQ2J.js.map} +1 -1
  54. package/dist/content-renderer.cjs +5 -5
  55. package/dist/content-renderer.js +2 -2
  56. package/dist/editor.cjs +5 -5
  57. package/dist/editor.js +3 -3
  58. package/dist/faux-client.d.cts +2 -63
  59. package/dist/faux-client.d.ts +2 -63
  60. package/dist/image-viewer.cjs +4 -2
  61. package/dist/image-viewer.d.cts +3 -2
  62. package/dist/image-viewer.d.ts +3 -2
  63. package/dist/image-viewer.js +3 -1
  64. package/dist/{index-CgPpIw_O.d.cts → index-AesVUjQE.d.cts} +2 -2
  65. package/dist/{index-IeivGsNg.d.ts → index-D3wJ8hrZ.d.ts} +2 -2
  66. package/dist/index.cjs +47 -47
  67. package/dist/index.d.cts +5 -4
  68. package/dist/index.d.ts +5 -4
  69. package/dist/index.js +12 -12
  70. package/dist/json-editor.cjs +14 -14
  71. package/dist/json-editor.js +3 -3
  72. package/dist/magic-wand.cjs +4 -4
  73. package/dist/magic-wand.js +3 -3
  74. package/dist/media-viewer.cjs +6 -4
  75. package/dist/media-viewer.d.cts +4 -3
  76. package/dist/media-viewer.d.ts +4 -3
  77. package/dist/media-viewer.js +5 -3
  78. package/dist/pdf-viewer.cjs +4 -2
  79. package/dist/pdf-viewer.d.cts +2 -1
  80. package/dist/pdf-viewer.d.ts +2 -1
  81. package/dist/pdf-viewer.js +3 -1
  82. package/dist/prompt-input.cjs +4 -4
  83. package/dist/prompt-input.js +3 -3
  84. package/dist/reason-tag.cjs +4 -4
  85. package/dist/reason-tag.js +3 -3
  86. package/package.json +1 -1
  87. package/dist/chunk-BFKCVSNK.cjs.map +0 -1
  88. package/dist/chunk-MUCXXYDN.js.map +0 -1
  89. package/dist/chunk-QDVDBUJM.cjs.map +0 -1
  90. package/dist/chunk-SOYORSLZ.js.map +0 -1
  91. package/dist/chunk-V35A6B7A.cjs.map +0 -1
  92. package/dist/chunk-XJXQG34J.js.map +0 -1
@@ -1,5 +1,6 @@
1
1
  'use strict';
2
2
 
3
+ var chunkDUOZSOSB_cjs = require('./chunk-DUOZSOSB.cjs');
3
4
  var chunkT6YELZPJ_cjs = require('./chunk-T6YELZPJ.cjs');
4
5
  var chunkZU5Q77OT_cjs = require('./chunk-ZU5Q77OT.cjs');
5
6
  var react = require('react');
@@ -31,7 +32,9 @@ var ImageViewer = react.forwardRef(
31
32
  onLoad,
32
33
  onError,
33
34
  className,
34
- style
35
+ style,
36
+ frame = false,
37
+ frameProps
35
38
  }, ref) => {
36
39
  const containerRef = react.useRef(null);
37
40
  const [status, setStatus] = react.useState("loading");
@@ -80,15 +83,17 @@ var ImageViewer = react.forwardRef(
80
83
  [setViewport, minZoom, maxZoom]
81
84
  );
82
85
  const reset = react.useCallback(() => setViewport(DEFAULT_VIEWPORT), [setViewport]);
83
- const showControls = (controls ?? zoomable) && interactive;
86
+ const showControls = !frame && (controls ?? zoomable) && interactive;
84
87
  const transform = `translate(${current.panX}px, ${current.panY}px) scale(${current.zoom})`;
85
- return /* @__PURE__ */ jsxRuntime.jsxs(
88
+ const viewer = /* @__PURE__ */ jsxRuntime.jsxs(
86
89
  "div",
87
90
  {
88
91
  ref,
89
92
  "data-react-fancy-image-viewer": "",
90
93
  className: chunkZU5Q77OT_cjs.cn(
91
94
  "relative isolate overflow-hidden rounded-md select-none",
95
+ // In the frame it fills the frame's body; standalone, the caller sizes it.
96
+ frame && "h-full w-full rounded-none",
92
97
  checkerboard ? "fancy-checkerboard" : "bg-zinc-100 dark:bg-zinc-900",
93
98
  className
94
99
  ),
@@ -190,10 +195,26 @@ var ImageViewer = react.forwardRef(
190
195
  ]
191
196
  }
192
197
  );
198
+ if (!frame) return viewer;
199
+ return /* @__PURE__ */ jsxRuntime.jsx(
200
+ chunkDUOZSOSB_cjs.FauxClient,
201
+ {
202
+ variant: "device",
203
+ controls: true,
204
+ fill: true,
205
+ applyZoom: false,
206
+ zoom: current.zoom,
207
+ onZoomChange: (z) => z === 1 ? reset() : zoomBy(z / current.zoom),
208
+ minZoom,
209
+ maxZoom,
210
+ ...frameProps,
211
+ children: viewer
212
+ }
213
+ );
193
214
  }
194
215
  );
195
216
  ImageViewer.displayName = "ImageViewer";
196
217
 
197
218
  exports.ImageViewer = ImageViewer;
198
- //# sourceMappingURL=chunk-QDVDBUJM.cjs.map
199
- //# sourceMappingURL=chunk-QDVDBUJM.cjs.map
219
+ //# sourceMappingURL=chunk-WBJRFWZE.cjs.map
220
+ //# sourceMappingURL=chunk-WBJRFWZE.cjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/components/ImageViewer/ImageViewer.tsx"],"names":["forwardRef","useRef","useState","useCallback","usePanZoom","jsxs","cn","jsx","FauxClient"],"mappings":";;;;;;;;AAYA,IAAM,mBAAwC,EAAE,IAAA,EAAM,GAAG,IAAA,EAAM,CAAA,EAAG,MAAM,CAAA,EAAE;AAE1E,IAAM,UAAA,GAAmE;AAAA,EACvE,OAAA,EAAS,8BAAA;AAAA,EACT,KAAA,EAAO,4BAAA;AAAA,EACP,IAAA,EAAM;AACR,CAAA;AAEA,SAAS,KAAA,CAAM,CAAA,EAAW,GAAA,EAAa,GAAA,EAAqB;AAC1D,EAAA,OAAO,KAAK,GAAA,CAAI,GAAA,EAAK,KAAK,GAAA,CAAI,GAAA,EAAK,CAAC,CAAC,CAAA;AACvC;AAcO,IAAM,WAAA,GAAcA,gBAAA;AAAA,EACzB,CACE;AAAA,IACE,GAAA;AAAA,IACA,GAAA,GAAM,EAAA;AAAA,IACN,GAAA,GAAM,SAAA;AAAA,IACN,QAAA,GAAW,IAAA;AAAA,IACX,QAAA,GAAW,IAAA;AAAA,IACX,QAAA;AAAA,IACA,OAAA,GAAU,IAAA;AAAA,IACV,OAAA,GAAU,CAAA;AAAA,IACV,YAAA,GAAe,IAAA;AAAA,IACf,QAAA;AAAA,IACA,eAAA;AAAA,IACA,gBAAA;AAAA,IACA,MAAA;AAAA,IACA,OAAA;AAAA,IACA,SAAA;AAAA,IACA,KAAA;AAAA,IACA,KAAA,GAAQ,KAAA;AAAA,IACR;AAAA,KAEF,GAAA,KACG;AACH,IAAA,MAAM,YAAA,GAAeC,aAAuB,IAAI,CAAA;AAChD,IAAA,MAAM,CAAC,MAAA,EAAQ,SAAS,CAAA,GAAIC,eAAyC,SAAS,CAAA;AAG9E,IAAA,MAAM,eAAe,QAAA,KAAa,MAAA;AAClC,IAAA,MAAM,CAAC,QAAA,EAAU,WAAW,CAAA,GAAIA,cAAA;AAAA,MAC9B,eAAA,IAAmB;AAAA,KACrB;AACA,IAAA,MAAM,OAAA,GAAU,eAAe,QAAA,GAAY,QAAA;AAC3C,IAAA,MAAM,UAAA,GAAaD,aAAO,OAAO,CAAA;AACjC,IAAA,UAAA,CAAW,OAAA,GAAU,OAAA;AAErB,IAAA,MAAM,WAAA,GAAcE,iBAAA;AAAA,MAClB,CACE,IAAA,KAGG;AACH,QAAA,MAAM,WACJ,OAAO,IAAA,KAAS,aAAa,IAAA,CAAK,UAAA,CAAW,OAAO,CAAA,GAAI,IAAA;AAC1D,QAAA,IAAI,CAAC,YAAA,EAAc,WAAA,CAAY,QAAQ,CAAA;AACvC,QAAA,gBAAA,GAAmB,QAAQ,CAAA;AAAA,MAC7B,CAAA;AAAA,MACA,CAAC,cAAc,gBAAgB;AAAA,KACjC;AAEA,IAAA,MAAM,cAAc,MAAA,KAAW,QAAA;AAC/B,IAAA,MAAM,EAAE,cAAA,EAAgB,SAAA,EAAU,GAAIC,4BAAA,CAAW;AAAA,MAC/C,QAAA,EAAU,OAAA;AAAA,MACV,WAAA;AAAA,MACA,OAAA;AAAA,MACA,OAAA;AAAA,MACA,UAAU,QAAA,IAAY,WAAA;AAAA,MACtB,UAAU,QAAA,IAAY,WAAA;AAAA,MACtB;AAAA,KACD,CAAA;AAGD,IAAA,MAAM,MAAA,GAASD,iBAAA;AAAA,MACb,CAAC,MAAA,KAAmB;AAClB,QAAA,MAAM,KAAK,YAAA,CAAa,OAAA;AACxB,QAAA,IAAI,CAAC,EAAA,EAAI;AACT,QAAA,MAAM,IAAA,GAAO,GAAG,qBAAA,EAAsB;AACtC,QAAA,MAAM,EAAA,GAAK,KAAK,KAAA,GAAQ,CAAA;AACxB,QAAA,MAAM,EAAA,GAAK,KAAK,MAAA,GAAS,CAAA;AACzB,QAAA,WAAA,CAAY,CAAC,IAAA,KAAS;AACpB,UAAA,MAAM,UAAU,KAAA,CAAM,IAAA,CAAK,IAAA,GAAO,MAAA,EAAQ,SAAS,OAAO,CAAA;AAC1D,UAAA,MAAM,KAAA,GAAQ,UAAU,IAAA,CAAK,IAAA;AAC7B,UAAA,OAAO;AAAA,YACL,IAAA,EAAM,OAAA;AAAA,YACN,IAAA,EAAM,EAAA,GAAA,CAAM,EAAA,GAAK,IAAA,CAAK,IAAA,IAAQ,KAAA;AAAA,YAC9B,IAAA,EAAM,EAAA,GAAA,CAAM,EAAA,GAAK,IAAA,CAAK,IAAA,IAAQ;AAAA,WAChC;AAAA,QACF,CAAC,CAAA;AAAA,MACH,CAAA;AAAA,MACA,CAAC,WAAA,EAAa,OAAA,EAAS,OAAO;AAAA,KAChC;AAEA,IAAA,MAAM,KAAA,GAAQA,kBAAY,MAAM,WAAA,CAAY,gBAAgB,CAAA,EAAG,CAAC,WAAW,CAAC,CAAA;AAE5E,IAAA,MAAM,YAAA,GAAe,CAAC,KAAA,KAAU,QAAA,IAAY,QAAA,CAAA,IAAa,WAAA;AACzD,IAAA,MAAM,SAAA,GAAY,aAAa,OAAA,CAAQ,IAAI,OAAO,OAAA,CAAQ,IAAI,CAAA,UAAA,EAAa,OAAA,CAAQ,IAAI,CAAA,CAAA,CAAA;AAEvF,IAAA,MAAM,MAAA,mBACJE,eAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,GAAA;AAAA,QACA,+BAAA,EAA8B,EAAA;AAAA,QAC9B,SAAA,EAAWC,oBAAA;AAAA,UACT,yDAAA;AAAA;AAAA,UAEA,KAAA,IAAS,4BAAA;AAAA,UACT,eACI,oBAAA,GACA,8BAAA;AAAA,UACJ;AAAA,SACF;AAAA,QACA,KAAA;AAAA,QAEA,QAAA,EAAA;AAAA,0BAAAC,cAAA;AAAA,YAAC,KAAA;AAAA,YAAA;AAAA,cACC,GAAA,EAAK,YAAA;AAAA,cACL,gBAAA,EAAe,EAAA;AAAA,cACf,SAAA,EAAWD,oBAAA;AAAA,gBACT,mDAAA;AAAA,gBACA,SAAA,GACI,iBAAA,GACA,QAAA,IAAY,WAAA,GACV,aAAA,GACA;AAAA,eACR;AAAA,cACA,KAAA,EACE;AAAA,gBACE,SAAA;AAAA,gBACA,eAAA,EAAiB,KAAA;AAAA,gBACjB,UAAA,EAAY,WAAA;AAAA,gBACZ,WAAA,EAAa,QAAA,IAAY,QAAA,GAAW,MAAA,GAAS;AAAA,eAC/C;AAAA,cAEF,aAAA,EAAe,WAAW,KAAA,GAAQ,MAAA;AAAA,cACjC,GAAG,cAAA;AAAA,cAEJ,QAAA,kBAAAC,cAAA;AAAA,gBAAC,KAAA;AAAA,gBAAA;AAAA,kBACC,GAAA;AAAA,kBACA,GAAA;AAAA,kBACA,SAAA,EAAW,KAAA;AAAA,kBACX,QAAQ,MAAM;AACZ,oBAAA,SAAA,CAAU,QAAQ,CAAA;AAClB,oBAAA,MAAA,IAAS;AAAA,kBACX,CAAA;AAAA,kBACA,SAAS,MAAM;AACb,oBAAA,SAAA,CAAU,OAAO,CAAA;AACjB,oBAAA,OAAA,IAAU;AAAA,kBACZ,CAAA;AAAA,kBACA,SAAA,EAAWD,oBAAA;AAAA,oBACT,2BAAA;AAAA,oBACA,WAAW,OAAA,IAAW,QAAA;AAAA,oBACtB,WAAW,GAAG;AAAA;AAChB;AAAA;AACF;AAAA,WACF;AAAA,UAEC,WAAW,OAAA,oBACVD,eAAA;AAAA,YAAC,KAAA;AAAA,YAAA;AAAA,cACC,qCAAA,EAAoC,EAAA;AAAA,cACpC,SAAA,EAAU,2HAAA;AAAA,cAEV,QAAA,EAAA;AAAA,gCAAAE,cAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,aAAA,EAAc,QAAA,EAAA,qBAAA,EAAwB,CAAA;AAAA,gCACtDA,cAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,wCAAA,EAA0C,iBAAO,GAAA,EAAI;AAAA;AAAA;AAAA,WACvE;AAAA,UAGD,YAAA,oBACCF,eAAA;AAAA,YAAC,KAAA;AAAA,YAAA;AAAA,cACC,wCAAA,EAAuC,EAAA;AAAA,cACvC,SAAA,EAAU,2MAAA;AAAA,cAEV,QAAA,EAAA;AAAA,gCAAAE,cAAA;AAAA,kBAAC,QAAA;AAAA,kBAAA;AAAA,oBACC,IAAA,EAAK,QAAA;AAAA,oBACL,YAAA,EAAW,UAAA;AAAA,oBACX,OAAA,EAAS,MAAM,MAAA,CAAO,CAAA,GAAI,IAAI,CAAA;AAAA,oBAC9B,SAAA,EAAU,kHAAA;AAAA,oBACX,QAAA,EAAA;AAAA;AAAA,iBAED;AAAA,gCACAF,eAAA;AAAA,kBAAC,QAAA;AAAA,kBAAA;AAAA,oBACC,IAAA,EAAK,QAAA;AAAA,oBACL,YAAA,EAAW,YAAA;AAAA,oBACX,OAAA,EAAS,KAAA;AAAA,oBACT,SAAA,EAAU,qGAAA;AAAA,oBAET,QAAA,EAAA;AAAA,sBAAA,IAAA,CAAK,KAAA,CAAM,OAAA,CAAQ,IAAA,GAAO,GAAG,CAAA;AAAA,sBAAE;AAAA;AAAA;AAAA,iBAClC;AAAA,gCACAE,cAAA;AAAA,kBAAC,QAAA;AAAA,kBAAA;AAAA,oBACC,IAAA,EAAK,QAAA;AAAA,oBACL,YAAA,EAAW,SAAA;AAAA,oBACX,OAAA,EAAS,MAAM,MAAA,CAAO,IAAI,CAAA;AAAA,oBAC1B,SAAA,EAAU,kHAAA;AAAA,oBACX,QAAA,EAAA;AAAA;AAAA;AAED;AAAA;AAAA;AACF;AAAA;AAAA,KAEJ;AAGF,IAAA,IAAI,CAAC,OAAO,OAAO,MAAA;AAInB,IAAA,uBACEA,cAAA;AAAA,MAACC,4BAAA;AAAA,MAAA;AAAA,QACC,OAAA,EAAQ,QAAA;AAAA,QACR,QAAA,EAAQ,IAAA;AAAA,QACR,IAAA,EAAI,IAAA;AAAA,QACJ,SAAA,EAAW,KAAA;AAAA,QACX,MAAM,OAAA,CAAQ,IAAA;AAAA,QACd,YAAA,EAAc,CAAC,CAAA,KAAO,CAAA,KAAM,CAAA,GAAI,OAAM,GAAI,MAAA,CAAO,CAAA,GAAI,OAAA,CAAQ,IAAI,CAAA;AAAA,QACjE,OAAA;AAAA,QACA,OAAA;AAAA,QACC,GAAG,UAAA;AAAA,QAEH,QAAA,EAAA;AAAA;AAAA,KACH;AAAA,EAEJ;AACF;AAEA,WAAA,CAAY,WAAA,GAAc,aAAA","file":"chunk-WBJRFWZE.cjs","sourcesContent":["import { FauxClient } from \"../FauxClient\";\nimport {\n forwardRef,\n useCallback,\n useRef,\n useState,\n type CSSProperties,\n} from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { usePanZoom } from \"../../hooks/use-pan-zoom\";\nimport type { ImageViewerProps, ImageViewerViewport } from \"./ImageViewer.types\";\n\nconst DEFAULT_VIEWPORT: ImageViewerViewport = { panX: 0, panY: 0, zoom: 1 };\n\nconst fitClasses: Record<NonNullable<ImageViewerProps[\"fit\"]>, string> = {\n contain: \"h-full w-full object-contain\",\n cover: \"h-full w-full object-cover\",\n none: \"max-w-none object-none\",\n};\n\nfunction clamp(n: number, min: number, max: number): number {\n return Math.min(max, Math.max(min, n));\n}\n\n/**\n * A standalone image viewer: fits the image to its container, with optional\n * Ctrl/⌘+wheel zoom, click-drag panning, and a transparency checkerboard. Works\n * anywhere on its own and is also what `<MediaViewer>` renders for images.\n *\n * The pan/zoom viewport is controllable (`viewport` + `onViewportChange`) so an\n * agent bridge can drive it; it's uncontrolled by default.\n *\n * ```tsx\n * <ImageViewer src=\"/logo.png\" alt=\"logo.png\" style={{ height: 320 }} />\n * ```\n */\nexport const ImageViewer = forwardRef<HTMLDivElement, ImageViewerProps>(\n (\n {\n src,\n alt = \"\",\n fit = \"contain\",\n zoomable = true,\n pannable = true,\n controls,\n minZoom = 0.25,\n maxZoom = 8,\n checkerboard = true,\n viewport,\n defaultViewport,\n onViewportChange,\n onLoad,\n onError,\n className,\n style,\n frame = false,\n frameProps,\n },\n ref,\n ) => {\n const containerRef = useRef<HTMLDivElement>(null);\n const [status, setStatus] = useState<\"loading\" | \"loaded\" | \"error\">(\"loading\");\n\n // Controllable viewport supporting functional updates (usePanZoom needs them).\n const isControlled = viewport !== undefined;\n const [internal, setInternal] = useState<ImageViewerViewport>(\n defaultViewport ?? DEFAULT_VIEWPORT,\n );\n const current = isControlled ? viewport! : internal;\n const currentRef = useRef(current);\n currentRef.current = current;\n\n const setViewport = useCallback(\n (\n next:\n | ImageViewerViewport\n | ((prev: ImageViewerViewport) => ImageViewerViewport),\n ) => {\n const resolved =\n typeof next === \"function\" ? next(currentRef.current) : next;\n if (!isControlled) setInternal(resolved);\n onViewportChange?.(resolved);\n },\n [isControlled, onViewportChange],\n );\n\n const interactive = status === \"loaded\";\n const { containerProps, isPanning } = usePanZoom({\n viewport: current,\n setViewport,\n minZoom,\n maxZoom,\n pannable: pannable && interactive,\n zoomable: zoomable && interactive,\n containerRef,\n });\n\n // Zoom about the container centre — used by the +/− buttons.\n const zoomBy = useCallback(\n (factor: number) => {\n const el = containerRef.current;\n if (!el) return;\n const rect = el.getBoundingClientRect();\n const cx = rect.width / 2;\n const cy = rect.height / 2;\n setViewport((prev) => {\n const newZoom = clamp(prev.zoom * factor, minZoom, maxZoom);\n const ratio = newZoom / prev.zoom;\n return {\n zoom: newZoom,\n panX: cx - (cx - prev.panX) * ratio,\n panY: cy - (cy - prev.panY) * ratio,\n };\n });\n },\n [setViewport, minZoom, maxZoom],\n );\n\n const reset = useCallback(() => setViewport(DEFAULT_VIEWPORT), [setViewport]);\n\n const showControls = !frame && (controls ?? zoomable) && interactive;\n const transform = `translate(${current.panX}px, ${current.panY}px) scale(${current.zoom})`;\n\n const viewer = (\n <div\n ref={ref}\n data-react-fancy-image-viewer=\"\"\n className={cn(\n \"relative isolate overflow-hidden rounded-md select-none\",\n // In the frame it fills the frame's body; standalone, the caller sizes it.\n frame && \"h-full w-full rounded-none\",\n checkerboard\n ? \"fancy-checkerboard\"\n : \"bg-zinc-100 dark:bg-zinc-900\",\n className,\n )}\n style={style}\n >\n <div\n ref={containerRef}\n data-canvas-bg=\"\"\n className={cn(\n \"absolute inset-0 flex items-center justify-center\",\n isPanning\n ? \"cursor-grabbing\"\n : pannable && interactive\n ? \"cursor-grab\"\n : \"\",\n )}\n style={\n {\n transform,\n transformOrigin: \"0 0\",\n willChange: \"transform\",\n touchAction: zoomable || pannable ? \"none\" : undefined,\n } as CSSProperties\n }\n onDoubleClick={zoomable ? reset : undefined}\n {...containerProps}\n >\n <img\n src={src}\n alt={alt}\n draggable={false}\n onLoad={() => {\n setStatus(\"loaded\");\n onLoad?.();\n }}\n onError={() => {\n setStatus(\"error\");\n onError?.();\n }}\n className={cn(\n \"pointer-events-none block\",\n status === \"error\" && \"hidden\",\n fitClasses[fit],\n )}\n />\n </div>\n\n {status === \"error\" && (\n <div\n data-react-fancy-image-viewer-error=\"\"\n className=\"absolute inset-0 flex flex-col items-center justify-center gap-1 p-4 text-center text-sm text-zinc-500 dark:text-zinc-400\"\n >\n <span className=\"font-medium\">Couldn&apos;t load image</span>\n <span className=\"max-w-full truncate text-xs opacity-70\">{alt || src}</span>\n </div>\n )}\n\n {showControls && (\n <div\n data-react-fancy-image-viewer-controls=\"\"\n className=\"absolute bottom-2 right-2 flex items-center gap-0.5 rounded-md border border-zinc-200 bg-white/90 p-0.5 text-zinc-700 shadow-sm backdrop-blur dark:border-zinc-700 dark:bg-zinc-900/90 dark:text-zinc-200\"\n >\n <button\n type=\"button\"\n aria-label=\"Zoom out\"\n onClick={() => zoomBy(1 / 1.25)}\n className=\"flex h-6 w-6 items-center justify-center rounded text-base leading-none hover:bg-zinc-100 dark:hover:bg-zinc-800\"\n >\n −\n </button>\n <button\n type=\"button\"\n aria-label=\"Reset zoom\"\n onClick={reset}\n className=\"min-w-[3rem] rounded px-1 text-center text-xs tabular-nums hover:bg-zinc-100 dark:hover:bg-zinc-800\"\n >\n {Math.round(current.zoom * 100)}%\n </button>\n <button\n type=\"button\"\n aria-label=\"Zoom in\"\n onClick={() => zoomBy(1.25)}\n className=\"flex h-6 w-6 items-center justify-center rounded text-base leading-none hover:bg-zinc-100 dark:hover:bg-zinc-800\"\n >\n +\n </button>\n </div>\n )}\n </div>\n );\n\n if (!frame) return viewer;\n\n // The frame's bar drives the image's own zoom (about the centre), and the\n // image's boxed bar steps aside: one set of controls, revealed on hover.\n return (\n <FauxClient\n variant=\"device\"\n controls\n fill\n applyZoom={false}\n zoom={current.zoom}\n onZoomChange={(z) => (z === 1 ? reset() : zoomBy(z / current.zoom))}\n minZoom={minZoom}\n maxZoom={maxZoom}\n {...frameProps}\n >\n {viewer}\n </FauxClient>\n );\n },\n);\n\nImageViewer.displayName = \"ImageViewer\";\n"]}
@@ -1,3 +1,4 @@
1
+ import { FauxClient } from './chunk-XWXV6HSK.js';
1
2
  import { usePanZoom } from './chunk-CPY7NHXM.js';
2
3
  import { cn } from './chunk-MMW2JGKZ.js';
3
4
  import { forwardRef, useRef, useState, useCallback } from 'react';
@@ -29,7 +30,9 @@ var ImageViewer = forwardRef(
29
30
  onLoad,
30
31
  onError,
31
32
  className,
32
- style
33
+ style,
34
+ frame = false,
35
+ frameProps
33
36
  }, ref) => {
34
37
  const containerRef = useRef(null);
35
38
  const [status, setStatus] = useState("loading");
@@ -78,15 +81,17 @@ var ImageViewer = forwardRef(
78
81
  [setViewport, minZoom, maxZoom]
79
82
  );
80
83
  const reset = useCallback(() => setViewport(DEFAULT_VIEWPORT), [setViewport]);
81
- const showControls = (controls ?? zoomable) && interactive;
84
+ const showControls = !frame && (controls ?? zoomable) && interactive;
82
85
  const transform = `translate(${current.panX}px, ${current.panY}px) scale(${current.zoom})`;
83
- return /* @__PURE__ */ jsxs(
86
+ const viewer = /* @__PURE__ */ jsxs(
84
87
  "div",
85
88
  {
86
89
  ref,
87
90
  "data-react-fancy-image-viewer": "",
88
91
  className: cn(
89
92
  "relative isolate overflow-hidden rounded-md select-none",
93
+ // In the frame it fills the frame's body; standalone, the caller sizes it.
94
+ frame && "h-full w-full rounded-none",
90
95
  checkerboard ? "fancy-checkerboard" : "bg-zinc-100 dark:bg-zinc-900",
91
96
  className
92
97
  ),
@@ -188,10 +193,26 @@ var ImageViewer = forwardRef(
188
193
  ]
189
194
  }
190
195
  );
196
+ if (!frame) return viewer;
197
+ return /* @__PURE__ */ jsx(
198
+ FauxClient,
199
+ {
200
+ variant: "device",
201
+ controls: true,
202
+ fill: true,
203
+ applyZoom: false,
204
+ zoom: current.zoom,
205
+ onZoomChange: (z) => z === 1 ? reset() : zoomBy(z / current.zoom),
206
+ minZoom,
207
+ maxZoom,
208
+ ...frameProps,
209
+ children: viewer
210
+ }
211
+ );
191
212
  }
192
213
  );
193
214
  ImageViewer.displayName = "ImageViewer";
194
215
 
195
216
  export { ImageViewer };
196
- //# sourceMappingURL=chunk-MUCXXYDN.js.map
197
- //# sourceMappingURL=chunk-MUCXXYDN.js.map
217
+ //# sourceMappingURL=chunk-XOWWNG7D.js.map
218
+ //# sourceMappingURL=chunk-XOWWNG7D.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/components/ImageViewer/ImageViewer.tsx"],"names":[],"mappings":";;;;;;AAYA,IAAM,mBAAwC,EAAE,IAAA,EAAM,GAAG,IAAA,EAAM,CAAA,EAAG,MAAM,CAAA,EAAE;AAE1E,IAAM,UAAA,GAAmE;AAAA,EACvE,OAAA,EAAS,8BAAA;AAAA,EACT,KAAA,EAAO,4BAAA;AAAA,EACP,IAAA,EAAM;AACR,CAAA;AAEA,SAAS,KAAA,CAAM,CAAA,EAAW,GAAA,EAAa,GAAA,EAAqB;AAC1D,EAAA,OAAO,KAAK,GAAA,CAAI,GAAA,EAAK,KAAK,GAAA,CAAI,GAAA,EAAK,CAAC,CAAC,CAAA;AACvC;AAcO,IAAM,WAAA,GAAc,UAAA;AAAA,EACzB,CACE;AAAA,IACE,GAAA;AAAA,IACA,GAAA,GAAM,EAAA;AAAA,IACN,GAAA,GAAM,SAAA;AAAA,IACN,QAAA,GAAW,IAAA;AAAA,IACX,QAAA,GAAW,IAAA;AAAA,IACX,QAAA;AAAA,IACA,OAAA,GAAU,IAAA;AAAA,IACV,OAAA,GAAU,CAAA;AAAA,IACV,YAAA,GAAe,IAAA;AAAA,IACf,QAAA;AAAA,IACA,eAAA;AAAA,IACA,gBAAA;AAAA,IACA,MAAA;AAAA,IACA,OAAA;AAAA,IACA,SAAA;AAAA,IACA,KAAA;AAAA,IACA,KAAA,GAAQ,KAAA;AAAA,IACR;AAAA,KAEF,GAAA,KACG;AACH,IAAA,MAAM,YAAA,GAAe,OAAuB,IAAI,CAAA;AAChD,IAAA,MAAM,CAAC,MAAA,EAAQ,SAAS,CAAA,GAAI,SAAyC,SAAS,CAAA;AAG9E,IAAA,MAAM,eAAe,QAAA,KAAa,MAAA;AAClC,IAAA,MAAM,CAAC,QAAA,EAAU,WAAW,CAAA,GAAI,QAAA;AAAA,MAC9B,eAAA,IAAmB;AAAA,KACrB;AACA,IAAA,MAAM,OAAA,GAAU,eAAe,QAAA,GAAY,QAAA;AAC3C,IAAA,MAAM,UAAA,GAAa,OAAO,OAAO,CAAA;AACjC,IAAA,UAAA,CAAW,OAAA,GAAU,OAAA;AAErB,IAAA,MAAM,WAAA,GAAc,WAAA;AAAA,MAClB,CACE,IAAA,KAGG;AACH,QAAA,MAAM,WACJ,OAAO,IAAA,KAAS,aAAa,IAAA,CAAK,UAAA,CAAW,OAAO,CAAA,GAAI,IAAA;AAC1D,QAAA,IAAI,CAAC,YAAA,EAAc,WAAA,CAAY,QAAQ,CAAA;AACvC,QAAA,gBAAA,GAAmB,QAAQ,CAAA;AAAA,MAC7B,CAAA;AAAA,MACA,CAAC,cAAc,gBAAgB;AAAA,KACjC;AAEA,IAAA,MAAM,cAAc,MAAA,KAAW,QAAA;AAC/B,IAAA,MAAM,EAAE,cAAA,EAAgB,SAAA,EAAU,GAAI,UAAA,CAAW;AAAA,MAC/C,QAAA,EAAU,OAAA;AAAA,MACV,WAAA;AAAA,MACA,OAAA;AAAA,MACA,OAAA;AAAA,MACA,UAAU,QAAA,IAAY,WAAA;AAAA,MACtB,UAAU,QAAA,IAAY,WAAA;AAAA,MACtB;AAAA,KACD,CAAA;AAGD,IAAA,MAAM,MAAA,GAAS,WAAA;AAAA,MACb,CAAC,MAAA,KAAmB;AAClB,QAAA,MAAM,KAAK,YAAA,CAAa,OAAA;AACxB,QAAA,IAAI,CAAC,EAAA,EAAI;AACT,QAAA,MAAM,IAAA,GAAO,GAAG,qBAAA,EAAsB;AACtC,QAAA,MAAM,EAAA,GAAK,KAAK,KAAA,GAAQ,CAAA;AACxB,QAAA,MAAM,EAAA,GAAK,KAAK,MAAA,GAAS,CAAA;AACzB,QAAA,WAAA,CAAY,CAAC,IAAA,KAAS;AACpB,UAAA,MAAM,UAAU,KAAA,CAAM,IAAA,CAAK,IAAA,GAAO,MAAA,EAAQ,SAAS,OAAO,CAAA;AAC1D,UAAA,MAAM,KAAA,GAAQ,UAAU,IAAA,CAAK,IAAA;AAC7B,UAAA,OAAO;AAAA,YACL,IAAA,EAAM,OAAA;AAAA,YACN,IAAA,EAAM,EAAA,GAAA,CAAM,EAAA,GAAK,IAAA,CAAK,IAAA,IAAQ,KAAA;AAAA,YAC9B,IAAA,EAAM,EAAA,GAAA,CAAM,EAAA,GAAK,IAAA,CAAK,IAAA,IAAQ;AAAA,WAChC;AAAA,QACF,CAAC,CAAA;AAAA,MACH,CAAA;AAAA,MACA,CAAC,WAAA,EAAa,OAAA,EAAS,OAAO;AAAA,KAChC;AAEA,IAAA,MAAM,KAAA,GAAQ,YAAY,MAAM,WAAA,CAAY,gBAAgB,CAAA,EAAG,CAAC,WAAW,CAAC,CAAA;AAE5E,IAAA,MAAM,YAAA,GAAe,CAAC,KAAA,KAAU,QAAA,IAAY,QAAA,CAAA,IAAa,WAAA;AACzD,IAAA,MAAM,SAAA,GAAY,aAAa,OAAA,CAAQ,IAAI,OAAO,OAAA,CAAQ,IAAI,CAAA,UAAA,EAAa,OAAA,CAAQ,IAAI,CAAA,CAAA,CAAA;AAEvF,IAAA,MAAM,MAAA,mBACJ,IAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,GAAA;AAAA,QACA,+BAAA,EAA8B,EAAA;AAAA,QAC9B,SAAA,EAAW,EAAA;AAAA,UACT,yDAAA;AAAA;AAAA,UAEA,KAAA,IAAS,4BAAA;AAAA,UACT,eACI,oBAAA,GACA,8BAAA;AAAA,UACJ;AAAA,SACF;AAAA,QACA,KAAA;AAAA,QAEA,QAAA,EAAA;AAAA,0BAAA,GAAA;AAAA,YAAC,KAAA;AAAA,YAAA;AAAA,cACC,GAAA,EAAK,YAAA;AAAA,cACL,gBAAA,EAAe,EAAA;AAAA,cACf,SAAA,EAAW,EAAA;AAAA,gBACT,mDAAA;AAAA,gBACA,SAAA,GACI,iBAAA,GACA,QAAA,IAAY,WAAA,GACV,aAAA,GACA;AAAA,eACR;AAAA,cACA,KAAA,EACE;AAAA,gBACE,SAAA;AAAA,gBACA,eAAA,EAAiB,KAAA;AAAA,gBACjB,UAAA,EAAY,WAAA;AAAA,gBACZ,WAAA,EAAa,QAAA,IAAY,QAAA,GAAW,MAAA,GAAS;AAAA,eAC/C;AAAA,cAEF,aAAA,EAAe,WAAW,KAAA,GAAQ,MAAA;AAAA,cACjC,GAAG,cAAA;AAAA,cAEJ,QAAA,kBAAA,GAAA;AAAA,gBAAC,KAAA;AAAA,gBAAA;AAAA,kBACC,GAAA;AAAA,kBACA,GAAA;AAAA,kBACA,SAAA,EAAW,KAAA;AAAA,kBACX,QAAQ,MAAM;AACZ,oBAAA,SAAA,CAAU,QAAQ,CAAA;AAClB,oBAAA,MAAA,IAAS;AAAA,kBACX,CAAA;AAAA,kBACA,SAAS,MAAM;AACb,oBAAA,SAAA,CAAU,OAAO,CAAA;AACjB,oBAAA,OAAA,IAAU;AAAA,kBACZ,CAAA;AAAA,kBACA,SAAA,EAAW,EAAA;AAAA,oBACT,2BAAA;AAAA,oBACA,WAAW,OAAA,IAAW,QAAA;AAAA,oBACtB,WAAW,GAAG;AAAA;AAChB;AAAA;AACF;AAAA,WACF;AAAA,UAEC,WAAW,OAAA,oBACV,IAAA;AAAA,YAAC,KAAA;AAAA,YAAA;AAAA,cACC,qCAAA,EAAoC,EAAA;AAAA,cACpC,SAAA,EAAU,2HAAA;AAAA,cAEV,QAAA,EAAA;AAAA,gCAAA,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,aAAA,EAAc,QAAA,EAAA,qBAAA,EAAwB,CAAA;AAAA,gCACtD,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,wCAAA,EAA0C,iBAAO,GAAA,EAAI;AAAA;AAAA;AAAA,WACvE;AAAA,UAGD,YAAA,oBACC,IAAA;AAAA,YAAC,KAAA;AAAA,YAAA;AAAA,cACC,wCAAA,EAAuC,EAAA;AAAA,cACvC,SAAA,EAAU,2MAAA;AAAA,cAEV,QAAA,EAAA;AAAA,gCAAA,GAAA;AAAA,kBAAC,QAAA;AAAA,kBAAA;AAAA,oBACC,IAAA,EAAK,QAAA;AAAA,oBACL,YAAA,EAAW,UAAA;AAAA,oBACX,OAAA,EAAS,MAAM,MAAA,CAAO,CAAA,GAAI,IAAI,CAAA;AAAA,oBAC9B,SAAA,EAAU,kHAAA;AAAA,oBACX,QAAA,EAAA;AAAA;AAAA,iBAED;AAAA,gCACA,IAAA;AAAA,kBAAC,QAAA;AAAA,kBAAA;AAAA,oBACC,IAAA,EAAK,QAAA;AAAA,oBACL,YAAA,EAAW,YAAA;AAAA,oBACX,OAAA,EAAS,KAAA;AAAA,oBACT,SAAA,EAAU,qGAAA;AAAA,oBAET,QAAA,EAAA;AAAA,sBAAA,IAAA,CAAK,KAAA,CAAM,OAAA,CAAQ,IAAA,GAAO,GAAG,CAAA;AAAA,sBAAE;AAAA;AAAA;AAAA,iBAClC;AAAA,gCACA,GAAA;AAAA,kBAAC,QAAA;AAAA,kBAAA;AAAA,oBACC,IAAA,EAAK,QAAA;AAAA,oBACL,YAAA,EAAW,SAAA;AAAA,oBACX,OAAA,EAAS,MAAM,MAAA,CAAO,IAAI,CAAA;AAAA,oBAC1B,SAAA,EAAU,kHAAA;AAAA,oBACX,QAAA,EAAA;AAAA;AAAA;AAED;AAAA;AAAA;AACF;AAAA;AAAA,KAEJ;AAGF,IAAA,IAAI,CAAC,OAAO,OAAO,MAAA;AAInB,IAAA,uBACE,GAAA;AAAA,MAAC,UAAA;AAAA,MAAA;AAAA,QACC,OAAA,EAAQ,QAAA;AAAA,QACR,QAAA,EAAQ,IAAA;AAAA,QACR,IAAA,EAAI,IAAA;AAAA,QACJ,SAAA,EAAW,KAAA;AAAA,QACX,MAAM,OAAA,CAAQ,IAAA;AAAA,QACd,YAAA,EAAc,CAAC,CAAA,KAAO,CAAA,KAAM,CAAA,GAAI,OAAM,GAAI,MAAA,CAAO,CAAA,GAAI,OAAA,CAAQ,IAAI,CAAA;AAAA,QACjE,OAAA;AAAA,QACA,OAAA;AAAA,QACC,GAAG,UAAA;AAAA,QAEH,QAAA,EAAA;AAAA;AAAA,KACH;AAAA,EAEJ;AACF;AAEA,WAAA,CAAY,WAAA,GAAc,aAAA","file":"chunk-XOWWNG7D.js","sourcesContent":["import { FauxClient } from \"../FauxClient\";\nimport {\n forwardRef,\n useCallback,\n useRef,\n useState,\n type CSSProperties,\n} from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { usePanZoom } from \"../../hooks/use-pan-zoom\";\nimport type { ImageViewerProps, ImageViewerViewport } from \"./ImageViewer.types\";\n\nconst DEFAULT_VIEWPORT: ImageViewerViewport = { panX: 0, panY: 0, zoom: 1 };\n\nconst fitClasses: Record<NonNullable<ImageViewerProps[\"fit\"]>, string> = {\n contain: \"h-full w-full object-contain\",\n cover: \"h-full w-full object-cover\",\n none: \"max-w-none object-none\",\n};\n\nfunction clamp(n: number, min: number, max: number): number {\n return Math.min(max, Math.max(min, n));\n}\n\n/**\n * A standalone image viewer: fits the image to its container, with optional\n * Ctrl/⌘+wheel zoom, click-drag panning, and a transparency checkerboard. Works\n * anywhere on its own and is also what `<MediaViewer>` renders for images.\n *\n * The pan/zoom viewport is controllable (`viewport` + `onViewportChange`) so an\n * agent bridge can drive it; it's uncontrolled by default.\n *\n * ```tsx\n * <ImageViewer src=\"/logo.png\" alt=\"logo.png\" style={{ height: 320 }} />\n * ```\n */\nexport const ImageViewer = forwardRef<HTMLDivElement, ImageViewerProps>(\n (\n {\n src,\n alt = \"\",\n fit = \"contain\",\n zoomable = true,\n pannable = true,\n controls,\n minZoom = 0.25,\n maxZoom = 8,\n checkerboard = true,\n viewport,\n defaultViewport,\n onViewportChange,\n onLoad,\n onError,\n className,\n style,\n frame = false,\n frameProps,\n },\n ref,\n ) => {\n const containerRef = useRef<HTMLDivElement>(null);\n const [status, setStatus] = useState<\"loading\" | \"loaded\" | \"error\">(\"loading\");\n\n // Controllable viewport supporting functional updates (usePanZoom needs them).\n const isControlled = viewport !== undefined;\n const [internal, setInternal] = useState<ImageViewerViewport>(\n defaultViewport ?? DEFAULT_VIEWPORT,\n );\n const current = isControlled ? viewport! : internal;\n const currentRef = useRef(current);\n currentRef.current = current;\n\n const setViewport = useCallback(\n (\n next:\n | ImageViewerViewport\n | ((prev: ImageViewerViewport) => ImageViewerViewport),\n ) => {\n const resolved =\n typeof next === \"function\" ? next(currentRef.current) : next;\n if (!isControlled) setInternal(resolved);\n onViewportChange?.(resolved);\n },\n [isControlled, onViewportChange],\n );\n\n const interactive = status === \"loaded\";\n const { containerProps, isPanning } = usePanZoom({\n viewport: current,\n setViewport,\n minZoom,\n maxZoom,\n pannable: pannable && interactive,\n zoomable: zoomable && interactive,\n containerRef,\n });\n\n // Zoom about the container centre — used by the +/− buttons.\n const zoomBy = useCallback(\n (factor: number) => {\n const el = containerRef.current;\n if (!el) return;\n const rect = el.getBoundingClientRect();\n const cx = rect.width / 2;\n const cy = rect.height / 2;\n setViewport((prev) => {\n const newZoom = clamp(prev.zoom * factor, minZoom, maxZoom);\n const ratio = newZoom / prev.zoom;\n return {\n zoom: newZoom,\n panX: cx - (cx - prev.panX) * ratio,\n panY: cy - (cy - prev.panY) * ratio,\n };\n });\n },\n [setViewport, minZoom, maxZoom],\n );\n\n const reset = useCallback(() => setViewport(DEFAULT_VIEWPORT), [setViewport]);\n\n const showControls = !frame && (controls ?? zoomable) && interactive;\n const transform = `translate(${current.panX}px, ${current.panY}px) scale(${current.zoom})`;\n\n const viewer = (\n <div\n ref={ref}\n data-react-fancy-image-viewer=\"\"\n className={cn(\n \"relative isolate overflow-hidden rounded-md select-none\",\n // In the frame it fills the frame's body; standalone, the caller sizes it.\n frame && \"h-full w-full rounded-none\",\n checkerboard\n ? \"fancy-checkerboard\"\n : \"bg-zinc-100 dark:bg-zinc-900\",\n className,\n )}\n style={style}\n >\n <div\n ref={containerRef}\n data-canvas-bg=\"\"\n className={cn(\n \"absolute inset-0 flex items-center justify-center\",\n isPanning\n ? \"cursor-grabbing\"\n : pannable && interactive\n ? \"cursor-grab\"\n : \"\",\n )}\n style={\n {\n transform,\n transformOrigin: \"0 0\",\n willChange: \"transform\",\n touchAction: zoomable || pannable ? \"none\" : undefined,\n } as CSSProperties\n }\n onDoubleClick={zoomable ? reset : undefined}\n {...containerProps}\n >\n <img\n src={src}\n alt={alt}\n draggable={false}\n onLoad={() => {\n setStatus(\"loaded\");\n onLoad?.();\n }}\n onError={() => {\n setStatus(\"error\");\n onError?.();\n }}\n className={cn(\n \"pointer-events-none block\",\n status === \"error\" && \"hidden\",\n fitClasses[fit],\n )}\n />\n </div>\n\n {status === \"error\" && (\n <div\n data-react-fancy-image-viewer-error=\"\"\n className=\"absolute inset-0 flex flex-col items-center justify-center gap-1 p-4 text-center text-sm text-zinc-500 dark:text-zinc-400\"\n >\n <span className=\"font-medium\">Couldn&apos;t load image</span>\n <span className=\"max-w-full truncate text-xs opacity-70\">{alt || src}</span>\n </div>\n )}\n\n {showControls && (\n <div\n data-react-fancy-image-viewer-controls=\"\"\n className=\"absolute bottom-2 right-2 flex items-center gap-0.5 rounded-md border border-zinc-200 bg-white/90 p-0.5 text-zinc-700 shadow-sm backdrop-blur dark:border-zinc-700 dark:bg-zinc-900/90 dark:text-zinc-200\"\n >\n <button\n type=\"button\"\n aria-label=\"Zoom out\"\n onClick={() => zoomBy(1 / 1.25)}\n className=\"flex h-6 w-6 items-center justify-center rounded text-base leading-none hover:bg-zinc-100 dark:hover:bg-zinc-800\"\n >\n −\n </button>\n <button\n type=\"button\"\n aria-label=\"Reset zoom\"\n onClick={reset}\n className=\"min-w-[3rem] rounded px-1 text-center text-xs tabular-nums hover:bg-zinc-100 dark:hover:bg-zinc-800\"\n >\n {Math.round(current.zoom * 100)}%\n </button>\n <button\n type=\"button\"\n aria-label=\"Zoom in\"\n onClick={() => zoomBy(1.25)}\n className=\"flex h-6 w-6 items-center justify-center rounded text-base leading-none hover:bg-zinc-100 dark:hover:bg-zinc-800\"\n >\n +\n </button>\n </div>\n )}\n </div>\n );\n\n if (!frame) return viewer;\n\n // The frame's bar drives the image's own zoom (about the centre), and the\n // image's boxed bar steps aside: one set of controls, revealed on hover.\n return (\n <FauxClient\n variant=\"device\"\n controls\n fill\n applyZoom={false}\n zoom={current.zoom}\n onZoomChange={(z) => (z === 1 ? reset() : zoomBy(z / current.zoom))}\n minZoom={minZoom}\n maxZoom={maxZoom}\n {...frameProps}\n >\n {viewer}\n </FauxClient>\n );\n },\n);\n\nImageViewer.displayName = \"ImageViewer\";\n"]}
@@ -1,4 +1,4 @@
1
- import { sanitizeHref } from './chunk-XJXQG34J.js';
1
+ import { sanitizeHref } from './chunk-QXYO76NZ.js';
2
2
  import { resolve } from './chunk-45BBNJQD.js';
3
3
  import { Icon } from './chunk-IVRYSSM7.js';
4
4
  import { cn } from './chunk-MMW2JGKZ.js';
@@ -453,5 +453,5 @@ Button.displayName = "Button";
453
453
  var Action = Button;
454
454
 
455
455
  export { Action, Button };
456
- //# sourceMappingURL=chunk-JJRD3WX3.js.map
457
- //# sourceMappingURL=chunk-JJRD3WX3.js.map
456
+ //# sourceMappingURL=chunk-ZLYOMQ2J.js.map
457
+ //# sourceMappingURL=chunk-ZLYOMQ2J.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/Button/Button.colors.ts","../src/components/Button/Button.tsx"],"names":[],"mappings":"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","file":"chunk-JJRD3WX3.js","sourcesContent":["// AUTO-GENERATED by scripts/gen-button-colors — do not edit by hand.\n// Literal Tailwind class strings for every color in the v4 palette so the\n// scanner can detect them in the published dist (template-built names are\n// invisible to Tailwind's JIT). Regenerate after changing the palette.\nimport type { Color } from \"../../utils/types\";\n\nexport const buttonColorClasses: Record<Color, string> = {\n // The host's colour, from CSS variables -- no dark: variant, because a\n // host that themes per mode scopes the variables themselves.\n brand: \"bg-brand text-brand-contrast border border-brand hover:bg-brand-hover\",\n slate: \"bg-slate-500 text-white border border-slate-600 hover:bg-slate-600 dark:bg-slate-600 dark:border-slate-500 dark:hover:bg-slate-500\",\n gray: \"bg-gray-500 text-white border border-gray-600 hover:bg-gray-600 dark:bg-gray-600 dark:border-gray-500 dark:hover:bg-gray-500\",\n zinc: \"bg-zinc-500 text-white border border-zinc-600 hover:bg-zinc-600 dark:bg-zinc-600 dark:border-zinc-500 dark:hover:bg-zinc-500\",\n neutral: \"bg-neutral-500 text-white border border-neutral-600 hover:bg-neutral-600 dark:bg-neutral-600 dark:border-neutral-500 dark:hover:bg-neutral-500\",\n stone: \"bg-stone-500 text-white border border-stone-600 hover:bg-stone-600 dark:bg-stone-600 dark:border-stone-500 dark:hover:bg-stone-500\",\n red: \"bg-red-500 text-white border border-red-600 hover:bg-red-600 dark:bg-red-600 dark:border-red-500 dark:hover:bg-red-500\",\n orange: \"bg-orange-500 text-white border border-orange-600 hover:bg-orange-600 dark:bg-orange-600 dark:border-orange-500 dark:hover:bg-orange-500\",\n amber: \"bg-amber-400 text-amber-950 border border-amber-500 hover:bg-amber-500 dark:bg-amber-300 dark:text-amber-950 dark:border-amber-400 dark:hover:bg-amber-400\",\n yellow: \"bg-yellow-400 text-yellow-950 border border-yellow-500 hover:bg-yellow-500 dark:bg-yellow-300 dark:text-yellow-950 dark:border-yellow-400 dark:hover:bg-yellow-400\",\n lime: \"bg-lime-400 text-lime-950 border border-lime-500 hover:bg-lime-500 dark:bg-lime-300 dark:text-lime-950 dark:border-lime-400 dark:hover:bg-lime-400\",\n green: \"bg-green-500 text-white border border-green-600 hover:bg-green-600 dark:bg-green-600 dark:border-green-500 dark:hover:bg-green-500\",\n emerald: \"bg-emerald-500 text-white border border-emerald-600 hover:bg-emerald-600 dark:bg-emerald-600 dark:border-emerald-500 dark:hover:bg-emerald-500\",\n teal: \"bg-teal-500 text-white border border-teal-600 hover:bg-teal-600 dark:bg-teal-600 dark:border-teal-500 dark:hover:bg-teal-500\",\n cyan: \"bg-cyan-500 text-white border border-cyan-600 hover:bg-cyan-600 dark:bg-cyan-600 dark:border-cyan-500 dark:hover:bg-cyan-500\",\n sky: \"bg-sky-500 text-white border border-sky-600 hover:bg-sky-600 dark:bg-sky-600 dark:border-sky-500 dark:hover:bg-sky-500\",\n blue: \"bg-blue-500 text-white border border-blue-600 hover:bg-blue-600 dark:bg-blue-600 dark:border-blue-500 dark:hover:bg-blue-500\",\n indigo: \"bg-indigo-500 text-white border border-indigo-600 hover:bg-indigo-600 dark:bg-indigo-600 dark:border-indigo-500 dark:hover:bg-indigo-500\",\n violet: \"bg-violet-500 text-white border border-violet-600 hover:bg-violet-600 dark:bg-violet-600 dark:border-violet-500 dark:hover:bg-violet-500\",\n purple: \"bg-purple-500 text-white border border-purple-600 hover:bg-purple-600 dark:bg-purple-600 dark:border-purple-500 dark:hover:bg-purple-500\",\n fuchsia: \"bg-fuchsia-500 text-white border border-fuchsia-600 hover:bg-fuchsia-600 dark:bg-fuchsia-600 dark:border-fuchsia-500 dark:hover:bg-fuchsia-500\",\n pink: \"bg-pink-500 text-white border border-pink-600 hover:bg-pink-600 dark:bg-pink-600 dark:border-pink-500 dark:hover:bg-pink-500\",\n rose: \"bg-rose-500 text-white border border-rose-600 hover:bg-rose-600 dark:bg-rose-600 dark:border-rose-500 dark:hover:bg-rose-500\",\n};\n\nexport const buttonGhostClasses: Record<Color, string> = {\n // The host's colour, from CSS variables -- no dark: variant, because a\n // host that themes per mode scopes the variables themselves.\n brand: \"bg-transparent text-brand hover:bg-brand/10\",\n slate: \"bg-transparent text-slate-600 hover:bg-slate-50 dark:text-slate-400 dark:hover:bg-slate-950/50\",\n gray: \"bg-transparent text-gray-600 hover:bg-gray-50 dark:text-gray-400 dark:hover:bg-gray-950/50\",\n zinc: \"bg-transparent text-zinc-600 hover:bg-zinc-50 dark:text-zinc-400 dark:hover:bg-zinc-950/50\",\n neutral: \"bg-transparent text-neutral-600 hover:bg-neutral-50 dark:text-neutral-400 dark:hover:bg-neutral-950/50\",\n stone: \"bg-transparent text-stone-600 hover:bg-stone-50 dark:text-stone-400 dark:hover:bg-stone-950/50\",\n red: \"bg-transparent text-red-600 hover:bg-red-50 dark:text-red-400 dark:hover:bg-red-950/50\",\n orange: \"bg-transparent text-orange-600 hover:bg-orange-50 dark:text-orange-400 dark:hover:bg-orange-950/50\",\n amber: \"bg-transparent text-amber-600 hover:bg-amber-50 dark:text-amber-400 dark:hover:bg-amber-950/50\",\n yellow: \"bg-transparent text-yellow-600 hover:bg-yellow-50 dark:text-yellow-400 dark:hover:bg-yellow-950/50\",\n lime: \"bg-transparent text-lime-600 hover:bg-lime-50 dark:text-lime-400 dark:hover:bg-lime-950/50\",\n green: \"bg-transparent text-green-600 hover:bg-green-50 dark:text-green-400 dark:hover:bg-green-950/50\",\n emerald: \"bg-transparent text-emerald-600 hover:bg-emerald-50 dark:text-emerald-400 dark:hover:bg-emerald-950/50\",\n teal: \"bg-transparent text-teal-600 hover:bg-teal-50 dark:text-teal-400 dark:hover:bg-teal-950/50\",\n cyan: \"bg-transparent text-cyan-600 hover:bg-cyan-50 dark:text-cyan-400 dark:hover:bg-cyan-950/50\",\n sky: \"bg-transparent text-sky-600 hover:bg-sky-50 dark:text-sky-400 dark:hover:bg-sky-950/50\",\n blue: \"bg-transparent text-blue-600 hover:bg-blue-50 dark:text-blue-400 dark:hover:bg-blue-950/50\",\n indigo: \"bg-transparent text-indigo-600 hover:bg-indigo-50 dark:text-indigo-400 dark:hover:bg-indigo-950/50\",\n violet: \"bg-transparent text-violet-600 hover:bg-violet-50 dark:text-violet-400 dark:hover:bg-violet-950/50\",\n purple: \"bg-transparent text-purple-600 hover:bg-purple-50 dark:text-purple-400 dark:hover:bg-purple-950/50\",\n fuchsia: \"bg-transparent text-fuchsia-600 hover:bg-fuchsia-50 dark:text-fuchsia-400 dark:hover:bg-fuchsia-950/50\",\n pink: \"bg-transparent text-pink-600 hover:bg-pink-50 dark:text-pink-400 dark:hover:bg-pink-950/50\",\n rose: \"bg-transparent text-rose-600 hover:bg-rose-50 dark:text-rose-400 dark:hover:bg-rose-950/50\",\n};\n","import { forwardRef, type AnchorHTMLAttributes, type ElementType, type ForwardedRef, type ReactNode } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { sanitizeHref } from \"../../utils/sanitize\";\nimport { resolve } from \"../../data/emoji-utils\";\nimport { Icon } from \"../Icon/Icon\";\nimport type { ButtonProps } from \"./Button.types\";\nimport type { ButtonColor, Size } from \"../../utils/types\";\nimport {\n buttonColorClasses as colorClasses,\n buttonGhostClasses as ghostColorClasses,\n} from \"./Button.colors\";\n\nconst iconSizeMap: Record<Size, \"xs\" | \"sm\" | \"md\" | \"lg\" | \"xl\"> = {\n xs: \"xs\",\n sm: \"xs\",\n md: \"sm\",\n lg: \"md\",\n xl: \"lg\",\n};\n\nconst alertIconSizeMap: Record<Size, \"xs\" | \"sm\" | \"md\" | \"lg\" | \"xl\"> = {\n xs: \"xs\",\n sm: \"xs\",\n md: \"xs\",\n lg: \"sm\",\n xl: \"sm\",\n};\n\n// ---------------------------------------------------------------------------\n// Color classes\n//\n// Solid + ghost color maps live in ./Button.colors (AUTO-GENERATED, all 22\n// Tailwind v4 hues as literal strings). The state-color classes below\n// (default/active/checked/warn) branch on flags, not specific colors.\n// ---------------------------------------------------------------------------\n\nconst defaultClasses =\n \"bg-white text-zinc-700 border border-zinc-200 hover:bg-zinc-50 hover:border-zinc-300 dark:bg-zinc-800 dark:text-zinc-300 dark:border-zinc-700 dark:hover:bg-zinc-700\";\n\nconst activeClasses =\n \"bg-blue-500 text-white border border-blue-600 hover:bg-blue-600 dark:bg-blue-600 dark:border-blue-500 dark:hover:bg-blue-500\";\n\nconst checkedClasses =\n \"bg-emerald-500 text-white border border-emerald-600 hover:bg-emerald-600 dark:bg-emerald-600 dark:border-emerald-500 dark:hover:bg-emerald-500\";\n\nconst warnClasses =\n \"bg-amber-50 text-amber-700 border border-amber-200 hover:bg-amber-100 dark:bg-amber-900/30 dark:text-amber-300 dark:border-amber-700 dark:hover:bg-amber-900/50\";\n\nconst ghostDefaultClasses =\n \"bg-transparent text-zinc-700 hover:bg-zinc-100 dark:text-zinc-300 dark:hover:bg-zinc-800\";\n\nconst ghostActiveClasses =\n \"bg-blue-50 text-blue-700 hover:bg-blue-100 dark:bg-blue-950/50 dark:text-blue-300 dark:hover:bg-blue-950\";\n\nconst ghostCheckedClasses =\n \"bg-emerald-50 text-emerald-700 hover:bg-emerald-100 dark:bg-emerald-950/50 dark:text-emerald-300 dark:hover:bg-emerald-950\";\n\nconst ghostWarnClasses =\n \"bg-transparent text-amber-700 hover:bg-amber-50 dark:text-amber-300 dark:hover:bg-amber-950/50\";\n\n// ---------------------------------------------------------------------------\n// Size helpers\n// ---------------------------------------------------------------------------\n\nconst horizontalSize: Record<Size, string> = {\n xs: \"px-2 py-1 text-xs\",\n sm: \"px-2 py-1 text-xs\",\n md: \"px-3 py-1.5 text-sm\",\n lg: \"px-4 py-2.5 text-base\",\n xl: \"px-5 py-3 text-lg\",\n};\n\nconst circleSize: Record<Size, string> = {\n xs: \"w-7 h-7 text-xs\",\n sm: \"w-8 h-8 text-xs\",\n md: \"w-10 h-10 text-sm\",\n lg: \"w-12 h-12 text-base\",\n xl: \"w-14 h-14 text-lg\",\n};\n\nconst iconSize: Record<Size, string> = {\n xs: \"w-3 h-3\",\n sm: \"w-3 h-3\",\n md: \"w-4 h-4\",\n lg: \"w-5 h-5\",\n xl: \"w-6 h-6\",\n};\n\nconst avatarSize: Record<Size, string> = {\n xs: \"w-4 h-4\",\n sm: \"w-4 h-4\",\n md: \"w-5 h-5\",\n lg: \"w-6 h-6\",\n xl: \"w-7 h-7\",\n};\n\nconst alertIconSize: Record<Size, string> = {\n xs: \"w-2 h-2\",\n sm: \"w-2.5 h-2.5\",\n md: \"w-3 h-3\",\n lg: \"w-4 h-4\",\n xl: \"w-4 h-4\",\n};\n\nconst badgeSize: Record<Size, string> = {\n xs: \"text-[10px] px-1 min-w-[14px] h-3.5\",\n sm: \"text-[10px] px-1.5 min-w-[16px] h-4\",\n md: \"text-[11px] px-1.5 min-w-[18px] h-[18px]\",\n lg: \"text-xs px-2 min-w-[22px] h-5\",\n xl: \"text-xs px-2 min-w-[24px] h-5\",\n};\n\nconst externalIconOffset: Record<Size, string> = {\n xs: \"0.75rem\",\n sm: \"0.75rem\",\n md: \"1rem\",\n lg: \"1.25rem\",\n xl: \"1.5rem\",\n};\n\n// ---------------------------------------------------------------------------\n// Helpers\n// ---------------------------------------------------------------------------\n\nfunction isColored(color?: ButtonColor, active?: boolean, checked?: boolean): boolean {\n return !!(color || active || checked);\n}\n\nfunction getColorClasses(\n color?: ButtonColor,\n active?: boolean,\n checked?: boolean,\n warn?: boolean,\n ghost?: boolean,\n): string {\n if (ghost) {\n if (color) return ghostColorClasses[color];\n if (checked) return ghostCheckedClasses;\n if (active) return ghostActiveClasses;\n if (warn) return ghostWarnClasses;\n return ghostDefaultClasses;\n }\n if (color) return colorClasses[color];\n if (checked) return checkedClasses;\n if (active) return activeClasses;\n if (warn) return warnClasses;\n return defaultClasses;\n}\n\nfunction getIconColorClasses(\n color?: ButtonColor,\n active?: boolean,\n checked?: boolean,\n warn?: boolean,\n ghost?: boolean,\n): string {\n if (ghost) {\n // Ghost variant: icon inherits currentColor from the button text\n return \"text-current\";\n }\n // A filled button's icon takes the label's colour — whatever that colour class\n // says, including a host's per-mode `text-brand-contrast` and the dark labels on\n // amber / yellow / lime. Hard-coded white was invisible on any light fill.\n if (color || active || checked) return \"text-current\";\n if (warn) return \"text-amber-600 dark:text-amber-400\";\n return \"text-zinc-500 dark:text-zinc-400\";\n}\n\nfunction getBadgeClasses(\n color?: ButtonColor,\n active?: boolean,\n checked?: boolean,\n warn?: boolean,\n ghost?: boolean,\n): string {\n if (ghost) {\n return \"bg-current/10 text-current\";\n }\n // Tinted with the label's own colour, for the same reason as the icon.\n if (isColored(color, active, checked)) return \"bg-current/20 text-current\";\n if (warn) return \"bg-amber-200 text-amber-800 dark:bg-amber-800 dark:text-amber-200\";\n return \"bg-zinc-200 text-zinc-700 dark:bg-zinc-600 dark:text-zinc-200\";\n}\n\n// ---------------------------------------------------------------------------\n// Placement parsing\n// ---------------------------------------------------------------------------\n\ntype PlacementAxis = \"left\" | \"right\" | \"top\" | \"bottom\";\n\nfunction parsePlacement(iconPlace: string): { primary: PlacementAxis; secondary?: PlacementAxis } {\n const parts = iconPlace.split(\" \") as PlacementAxis[];\n return { primary: parts[0], secondary: parts[1] };\n}\n\nfunction isVerticalPrimary(primary: PlacementAxis): boolean {\n return primary === \"top\" || primary === \"bottom\";\n}\n\n// ---------------------------------------------------------------------------\n// Sort parsing\n// ---------------------------------------------------------------------------\n\ntype ElementKey = \"e\" | \"i\" | \"a\" | \"b\";\nconst DEFAULT_SORT = \"eiab\";\n\nfunction parseSortOrder(sort?: string): ElementKey[] {\n const chars = (sort ?? DEFAULT_SORT).split(\"\") as ElementKey[];\n const valid: ElementKey[] = [];\n const seen = new Set<string>();\n for (const c of chars) {\n if (\"eiab\".includes(c) && !seen.has(c)) {\n valid.push(c);\n seen.add(c);\n }\n }\n // Add missing keys in default order\n for (const c of DEFAULT_SORT.split(\"\") as ElementKey[]) {\n if (!seen.has(c)) valid.push(c);\n }\n return valid;\n}\n\n// ---------------------------------------------------------------------------\n// Component\n// ---------------------------------------------------------------------------\n\nexport const Button = forwardRef<HTMLButtonElement, ButtonProps>(\n (\n {\n children,\n className,\n variant = \"default\",\n color,\n size = \"md\",\n active,\n checked,\n warn,\n alert: alertProp,\n icon,\n iconTrailing,\n iconPlace = \"left\",\n alertIcon,\n alertIconTrailing,\n emoji,\n emojiTrailing,\n avatar,\n avatarTrailing,\n badge,\n badgeTrailing,\n sort,\n loading = false,\n disabled,\n href,\n as: As,\n responsive,\n labelClassName,\n ...props\n },\n ref,\n ) => {\n const isCircle = variant === \"circle\";\n const isGhost = variant === \"ghost\";\n const { primary, secondary } = parsePlacement(iconPlace);\n const isVertical = isVerticalPrimary(primary);\n const isCompound = !!secondary;\n const needsWrapper = isVertical || isCompound;\n const isReversed = iconPlace === \"right\";\n\n // -----------------------------------------------------------------------\n // Sizing — always use horizontalSize for the button itself\n // -----------------------------------------------------------------------\n const sizeClass = isCircle ? circleSize[size] : horizontalSize[size];\n\n // -----------------------------------------------------------------------\n // Build decorative elements\n // -----------------------------------------------------------------------\n const iconColorCls = getIconColorClasses(color, active, checked, warn, isGhost);\n\n const buildElement = (key: ElementKey, trailing: boolean): ReactNode => {\n switch (key) {\n case \"e\": {\n const slug = trailing ? emojiTrailing : emoji;\n if (!slug) return null;\n const char = resolve(slug);\n if (!char) return null;\n return (\n <span key={`emoji-${trailing ? \"t\" : \"l\"}`} data-action-emoji>\n {char}\n </span>\n );\n }\n case \"i\": {\n if (loading && !trailing) {\n return (\n <span\n key=\"spinner\"\n className={cn(\"animate-spin border-2 border-current border-t-transparent rounded-full\", iconSize[size])}\n />\n );\n }\n const iconSlug = trailing ? iconTrailing : icon;\n if (!iconSlug) return null;\n // For vertical/compound placements, icons render outside the button — not inside\n if (needsWrapper) return null;\n return (\n <span\n key={`icon-${trailing ? \"t\" : \"l\"}`}\n data-action-icon={trailing ? \"trailing\" : \"leading\"}\n className={cn(\"inline-flex items-center flex-shrink-0\", iconColorCls)}\n >\n <Icon name={iconSlug} size={iconSizeMap[size]} />\n </span>\n );\n }\n case \"a\": {\n if (!avatar) return null;\n const isTrailing = avatarTrailing ?? false;\n if (isTrailing !== trailing) return null;\n return (\n <img\n key=\"avatar\"\n src={avatar}\n alt=\"\"\n className={cn(avatarSize[size], \"rounded-full object-cover flex-shrink-0\")}\n data-action-avatar\n />\n );\n }\n case \"b\": {\n if (!badge) return null;\n const isTrailing = badgeTrailing ?? false;\n if (isTrailing !== trailing) return null;\n return (\n <span\n key=\"badge\"\n className={cn(\n \"inline-flex items-center justify-center font-medium rounded-full\",\n badgeSize[size],\n getBadgeClasses(color, active, checked, warn, isGhost),\n )}\n data-action-badge\n >\n {badge}\n </span>\n );\n }\n default:\n return null;\n }\n };\n\n // Alert icon element\n const renderAlertIcon = (trailing: boolean): ReactNode => {\n if (!alertIcon) return null;\n const isTrailing = alertIconTrailing ?? false;\n if (isTrailing !== trailing) return null;\n const alertIconEl = <Icon name={alertIcon} size={alertIconSizeMap[size]} />;\n return (\n <span\n key=\"alert-icon\"\n className=\"relative inline-flex flex-shrink-0\"\n data-action-alert\n >\n <span className=\"text-red-500 dark:text-red-400 animate-pulse\">\n {alertIconEl}\n </span>\n <span className=\"absolute inset-0 flex items-center justify-center text-red-400 dark:text-red-300 animate-ping opacity-75\">\n {alertIconEl}\n </span>\n </span>\n );\n };\n\n const sortOrder = parseSortOrder(sort);\n\n const leadingElements: ReactNode[] = [];\n const trailingElements: ReactNode[] = [];\n\n for (const key of sortOrder) {\n const leading = buildElement(key, false);\n if (leading) leadingElements.push(leading);\n const trailing = buildElement(key, true);\n if (trailing) trailingElements.push(trailing);\n }\n\n // Insert alert icon\n const leadingAlert = renderAlertIcon(false);\n if (leadingAlert) leadingElements.push(leadingAlert);\n const trailingAlert = renderAlertIcon(true);\n if (trailingAlert) trailingElements.push(trailingAlert);\n\n // -----------------------------------------------------------------------\n // Classes\n // -----------------------------------------------------------------------\n const classes = cn(\n // `text-left` overrides the UA <button> center default so a wrapped,\n // width-constrained multi-word label stacks left-aligned. Overridable —\n // twMerge lets a `text-center` / `text-right` in `className` win.\n \"inline-flex items-center justify-center text-left font-medium transition-all duration-200\",\n \"focus:outline-none focus:ring-2 focus:ring-offset-1\",\n \"disabled:opacity-50 disabled:cursor-not-allowed\",\n isCircle ? \"rounded-full\" : \"rounded-lg\",\n sizeClass,\n getColorClasses(color, active, checked, warn, isGhost),\n !isCircle && !needsWrapper && \"gap-2\",\n !isCircle && needsWrapper && \"gap-2\",\n isReversed && !needsWrapper && \"flex-row-reverse\",\n alertProp && \"animate-pulse\",\n className,\n );\n\n // -----------------------------------------------------------------------\n // Content\n // -----------------------------------------------------------------------\n const content = isCircle ? (\n <>\n {loading ? (\n <span\n className={cn(\n \"animate-spin border-2 border-current border-t-transparent rounded-full\",\n iconSize[size],\n )}\n />\n ) : (\n icon ? <Icon name={icon} size={iconSizeMap[size]} /> : children\n )}\n </>\n ) : (\n <>\n {leadingElements}\n {children != null && (\n <span\n data-react-fancy-button-label=\"\"\n className={cn(\n // A button label must stay on one line. When a host flex layout\n // squeezes the button, `whitespace-nowrap` keeps the label and any\n // trailing icon/arrow together instead of wrapping and stacking the\n // icon below it (the classic \"send\" over \"→\" break). `min-w-0` keeps\n // the span shrinkable so `truncate`/ellipsis still works; multi-line\n // wrapping is opt-in via `labelClassName` (\"whitespace-normal\") or\n // the `responsive` prop.\n \"min-w-0 whitespace-nowrap\",\n // `responsive` collapses to icon-only when squeezed, while keeping\n // the label readable to screen readers.\n responsive && \"sr-only sm:not-sr-only\",\n labelClassName,\n )}\n >\n {children}\n </span>\n )}\n {trailingElements}\n </>\n );\n\n // -----------------------------------------------------------------------\n // Build the button element\n // -----------------------------------------------------------------------\n const safeHref = sanitizeHref(href);\n // Anchor mode renders `as` when provided (e.g. a router's <Link> for\n // client-side navigation — Inertia, React Router, Next). Previously `as`\n // fell through ...props onto the <a> where React silently DROPS a\n // function-valued unknown attribute — so `<Button as={Link}>` looked fine\n // but did a full page load. `as` only applies in anchor mode; without an\n // href (or when disabled) the plain <button> renders as always.\n const Anchor = (As ?? \"a\") as ElementType;\n const buttonEl = safeHref && !disabled ? (\n // Anchor mode forwards the same rest props as the <button> branch so\n // onClick / target / rel / ref / ARIA / data-* reach the <a> (issue #7).\n <Anchor\n ref={ref as ForwardedRef<HTMLAnchorElement>}\n href={safeHref}\n className={classes}\n data-react-fancy-button=\"\"\n data-react-fancy-action=\"\"\n {...(props as AnchorHTMLAttributes<HTMLAnchorElement>)}\n >\n {content}\n </Anchor>\n ) : (\n <button\n ref={ref}\n className={classes}\n disabled={disabled || loading}\n data-react-fancy-button=\"\"\n data-react-fancy-action=\"\"\n {...props}\n >\n {content}\n </button>\n );\n\n // -----------------------------------------------------------------------\n // Wrap for vertical/compound icon placement\n // The icon is absolutely positioned so it never shifts the button.\n // -----------------------------------------------------------------------\n if (needsWrapper && (icon || iconTrailing)) {\n const iconSlug = icon ?? iconTrailing;\n const offset = externalIconOffset[size];\n\n // Determine position styles for the icon\n const posStyle: React.CSSProperties = { position: \"absolute\" };\n\n // Primary axis: which side of the button\n if (primary === \"top\") {\n posStyle.bottom = \"100%\";\n posStyle.marginBottom = \"0.125rem\";\n } else if (primary === \"bottom\") {\n posStyle.top = \"100%\";\n posStyle.marginTop = \"0.125rem\";\n } else if (primary === \"left\") {\n posStyle.right = \"100%\";\n posStyle.marginRight = \"0.125rem\";\n } else if (primary === \"right\") {\n posStyle.left = \"100%\";\n posStyle.marginLeft = \"0.125rem\";\n }\n\n // Secondary axis: cross-axis alignment\n if (isVerticalPrimary(primary)) {\n // Vertical primary → secondary controls horizontal position\n if (secondary === \"left\") {\n posStyle.left = \"0\";\n } else if (secondary === \"right\") {\n posStyle.right = \"0\";\n } else {\n // center (default)\n posStyle.left = \"50%\";\n posStyle.transform = \"translateX(-50%)\";\n }\n } else {\n // Horizontal primary → secondary controls vertical position\n if (secondary === \"top\") {\n posStyle.top = \"0\";\n } else if (secondary === \"bottom\") {\n posStyle.bottom = \"0\";\n } else {\n // center (default)\n posStyle.top = \"50%\";\n posStyle.transform = \"translateY(-50%)\";\n }\n }\n\n const externalIcon = (\n <span\n className={cn(\"absolute flex-shrink-0\", iconColorCls)}\n style={posStyle}\n >\n <Icon name={iconSlug!} size={iconSizeMap[size]} />\n </span>\n );\n\n return (\n <span\n data-react-fancy-action-group=\"\"\n className=\"relative inline-flex\"\n >\n {buttonEl}\n {externalIcon}\n </span>\n );\n }\n\n return buttonEl;\n },\n);\n\nButton.displayName = \"Button\";\n\n/**\n * @deprecated Renamed to {@link Button}. `Action` remains as an alias for\n * backward compatibility and will be removed in a future major version.\n * Prefer importing `Button` from \"@particle-academy/react-fancy\".\n */\nexport const Action = Button;\n"]}
1
+ {"version":3,"sources":["../src/components/Button/Button.colors.ts","../src/components/Button/Button.tsx"],"names":[],"mappings":"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","file":"chunk-ZLYOMQ2J.js","sourcesContent":["// AUTO-GENERATED by scripts/gen-button-colors — do not edit by hand.\n// Literal Tailwind class strings for every color in the v4 palette so the\n// scanner can detect them in the published dist (template-built names are\n// invisible to Tailwind's JIT). Regenerate after changing the palette.\nimport type { Color } from \"../../utils/types\";\n\nexport const buttonColorClasses: Record<Color, string> = {\n // The host's colour, from CSS variables -- no dark: variant, because a\n // host that themes per mode scopes the variables themselves.\n brand: \"bg-brand text-brand-contrast border border-brand hover:bg-brand-hover\",\n slate: \"bg-slate-500 text-white border border-slate-600 hover:bg-slate-600 dark:bg-slate-600 dark:border-slate-500 dark:hover:bg-slate-500\",\n gray: \"bg-gray-500 text-white border border-gray-600 hover:bg-gray-600 dark:bg-gray-600 dark:border-gray-500 dark:hover:bg-gray-500\",\n zinc: \"bg-zinc-500 text-white border border-zinc-600 hover:bg-zinc-600 dark:bg-zinc-600 dark:border-zinc-500 dark:hover:bg-zinc-500\",\n neutral: \"bg-neutral-500 text-white border border-neutral-600 hover:bg-neutral-600 dark:bg-neutral-600 dark:border-neutral-500 dark:hover:bg-neutral-500\",\n stone: \"bg-stone-500 text-white border border-stone-600 hover:bg-stone-600 dark:bg-stone-600 dark:border-stone-500 dark:hover:bg-stone-500\",\n red: \"bg-red-500 text-white border border-red-600 hover:bg-red-600 dark:bg-red-600 dark:border-red-500 dark:hover:bg-red-500\",\n orange: \"bg-orange-500 text-white border border-orange-600 hover:bg-orange-600 dark:bg-orange-600 dark:border-orange-500 dark:hover:bg-orange-500\",\n amber: \"bg-amber-400 text-amber-950 border border-amber-500 hover:bg-amber-500 dark:bg-amber-300 dark:text-amber-950 dark:border-amber-400 dark:hover:bg-amber-400\",\n yellow: \"bg-yellow-400 text-yellow-950 border border-yellow-500 hover:bg-yellow-500 dark:bg-yellow-300 dark:text-yellow-950 dark:border-yellow-400 dark:hover:bg-yellow-400\",\n lime: \"bg-lime-400 text-lime-950 border border-lime-500 hover:bg-lime-500 dark:bg-lime-300 dark:text-lime-950 dark:border-lime-400 dark:hover:bg-lime-400\",\n green: \"bg-green-500 text-white border border-green-600 hover:bg-green-600 dark:bg-green-600 dark:border-green-500 dark:hover:bg-green-500\",\n emerald: \"bg-emerald-500 text-white border border-emerald-600 hover:bg-emerald-600 dark:bg-emerald-600 dark:border-emerald-500 dark:hover:bg-emerald-500\",\n teal: \"bg-teal-500 text-white border border-teal-600 hover:bg-teal-600 dark:bg-teal-600 dark:border-teal-500 dark:hover:bg-teal-500\",\n cyan: \"bg-cyan-500 text-white border border-cyan-600 hover:bg-cyan-600 dark:bg-cyan-600 dark:border-cyan-500 dark:hover:bg-cyan-500\",\n sky: \"bg-sky-500 text-white border border-sky-600 hover:bg-sky-600 dark:bg-sky-600 dark:border-sky-500 dark:hover:bg-sky-500\",\n blue: \"bg-blue-500 text-white border border-blue-600 hover:bg-blue-600 dark:bg-blue-600 dark:border-blue-500 dark:hover:bg-blue-500\",\n indigo: \"bg-indigo-500 text-white border border-indigo-600 hover:bg-indigo-600 dark:bg-indigo-600 dark:border-indigo-500 dark:hover:bg-indigo-500\",\n violet: \"bg-violet-500 text-white border border-violet-600 hover:bg-violet-600 dark:bg-violet-600 dark:border-violet-500 dark:hover:bg-violet-500\",\n purple: \"bg-purple-500 text-white border border-purple-600 hover:bg-purple-600 dark:bg-purple-600 dark:border-purple-500 dark:hover:bg-purple-500\",\n fuchsia: \"bg-fuchsia-500 text-white border border-fuchsia-600 hover:bg-fuchsia-600 dark:bg-fuchsia-600 dark:border-fuchsia-500 dark:hover:bg-fuchsia-500\",\n pink: \"bg-pink-500 text-white border border-pink-600 hover:bg-pink-600 dark:bg-pink-600 dark:border-pink-500 dark:hover:bg-pink-500\",\n rose: \"bg-rose-500 text-white border border-rose-600 hover:bg-rose-600 dark:bg-rose-600 dark:border-rose-500 dark:hover:bg-rose-500\",\n};\n\nexport const buttonGhostClasses: Record<Color, string> = {\n // The host's colour, from CSS variables -- no dark: variant, because a\n // host that themes per mode scopes the variables themselves.\n brand: \"bg-transparent text-brand hover:bg-brand/10\",\n slate: \"bg-transparent text-slate-600 hover:bg-slate-50 dark:text-slate-400 dark:hover:bg-slate-950/50\",\n gray: \"bg-transparent text-gray-600 hover:bg-gray-50 dark:text-gray-400 dark:hover:bg-gray-950/50\",\n zinc: \"bg-transparent text-zinc-600 hover:bg-zinc-50 dark:text-zinc-400 dark:hover:bg-zinc-950/50\",\n neutral: \"bg-transparent text-neutral-600 hover:bg-neutral-50 dark:text-neutral-400 dark:hover:bg-neutral-950/50\",\n stone: \"bg-transparent text-stone-600 hover:bg-stone-50 dark:text-stone-400 dark:hover:bg-stone-950/50\",\n red: \"bg-transparent text-red-600 hover:bg-red-50 dark:text-red-400 dark:hover:bg-red-950/50\",\n orange: \"bg-transparent text-orange-600 hover:bg-orange-50 dark:text-orange-400 dark:hover:bg-orange-950/50\",\n amber: \"bg-transparent text-amber-600 hover:bg-amber-50 dark:text-amber-400 dark:hover:bg-amber-950/50\",\n yellow: \"bg-transparent text-yellow-600 hover:bg-yellow-50 dark:text-yellow-400 dark:hover:bg-yellow-950/50\",\n lime: \"bg-transparent text-lime-600 hover:bg-lime-50 dark:text-lime-400 dark:hover:bg-lime-950/50\",\n green: \"bg-transparent text-green-600 hover:bg-green-50 dark:text-green-400 dark:hover:bg-green-950/50\",\n emerald: \"bg-transparent text-emerald-600 hover:bg-emerald-50 dark:text-emerald-400 dark:hover:bg-emerald-950/50\",\n teal: \"bg-transparent text-teal-600 hover:bg-teal-50 dark:text-teal-400 dark:hover:bg-teal-950/50\",\n cyan: \"bg-transparent text-cyan-600 hover:bg-cyan-50 dark:text-cyan-400 dark:hover:bg-cyan-950/50\",\n sky: \"bg-transparent text-sky-600 hover:bg-sky-50 dark:text-sky-400 dark:hover:bg-sky-950/50\",\n blue: \"bg-transparent text-blue-600 hover:bg-blue-50 dark:text-blue-400 dark:hover:bg-blue-950/50\",\n indigo: \"bg-transparent text-indigo-600 hover:bg-indigo-50 dark:text-indigo-400 dark:hover:bg-indigo-950/50\",\n violet: \"bg-transparent text-violet-600 hover:bg-violet-50 dark:text-violet-400 dark:hover:bg-violet-950/50\",\n purple: \"bg-transparent text-purple-600 hover:bg-purple-50 dark:text-purple-400 dark:hover:bg-purple-950/50\",\n fuchsia: \"bg-transparent text-fuchsia-600 hover:bg-fuchsia-50 dark:text-fuchsia-400 dark:hover:bg-fuchsia-950/50\",\n pink: \"bg-transparent text-pink-600 hover:bg-pink-50 dark:text-pink-400 dark:hover:bg-pink-950/50\",\n rose: \"bg-transparent text-rose-600 hover:bg-rose-50 dark:text-rose-400 dark:hover:bg-rose-950/50\",\n};\n","import { forwardRef, type AnchorHTMLAttributes, type ElementType, type ForwardedRef, type ReactNode } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { sanitizeHref } from \"../../utils/sanitize\";\nimport { resolve } from \"../../data/emoji-utils\";\nimport { Icon } from \"../Icon/Icon\";\nimport type { ButtonProps } from \"./Button.types\";\nimport type { ButtonColor, Size } from \"../../utils/types\";\nimport {\n buttonColorClasses as colorClasses,\n buttonGhostClasses as ghostColorClasses,\n} from \"./Button.colors\";\n\nconst iconSizeMap: Record<Size, \"xs\" | \"sm\" | \"md\" | \"lg\" | \"xl\"> = {\n xs: \"xs\",\n sm: \"xs\",\n md: \"sm\",\n lg: \"md\",\n xl: \"lg\",\n};\n\nconst alertIconSizeMap: Record<Size, \"xs\" | \"sm\" | \"md\" | \"lg\" | \"xl\"> = {\n xs: \"xs\",\n sm: \"xs\",\n md: \"xs\",\n lg: \"sm\",\n xl: \"sm\",\n};\n\n// ---------------------------------------------------------------------------\n// Color classes\n//\n// Solid + ghost color maps live in ./Button.colors (AUTO-GENERATED, all 22\n// Tailwind v4 hues as literal strings). The state-color classes below\n// (default/active/checked/warn) branch on flags, not specific colors.\n// ---------------------------------------------------------------------------\n\nconst defaultClasses =\n \"bg-white text-zinc-700 border border-zinc-200 hover:bg-zinc-50 hover:border-zinc-300 dark:bg-zinc-800 dark:text-zinc-300 dark:border-zinc-700 dark:hover:bg-zinc-700\";\n\nconst activeClasses =\n \"bg-blue-500 text-white border border-blue-600 hover:bg-blue-600 dark:bg-blue-600 dark:border-blue-500 dark:hover:bg-blue-500\";\n\nconst checkedClasses =\n \"bg-emerald-500 text-white border border-emerald-600 hover:bg-emerald-600 dark:bg-emerald-600 dark:border-emerald-500 dark:hover:bg-emerald-500\";\n\nconst warnClasses =\n \"bg-amber-50 text-amber-700 border border-amber-200 hover:bg-amber-100 dark:bg-amber-900/30 dark:text-amber-300 dark:border-amber-700 dark:hover:bg-amber-900/50\";\n\nconst ghostDefaultClasses =\n \"bg-transparent text-zinc-700 hover:bg-zinc-100 dark:text-zinc-300 dark:hover:bg-zinc-800\";\n\nconst ghostActiveClasses =\n \"bg-blue-50 text-blue-700 hover:bg-blue-100 dark:bg-blue-950/50 dark:text-blue-300 dark:hover:bg-blue-950\";\n\nconst ghostCheckedClasses =\n \"bg-emerald-50 text-emerald-700 hover:bg-emerald-100 dark:bg-emerald-950/50 dark:text-emerald-300 dark:hover:bg-emerald-950\";\n\nconst ghostWarnClasses =\n \"bg-transparent text-amber-700 hover:bg-amber-50 dark:text-amber-300 dark:hover:bg-amber-950/50\";\n\n// ---------------------------------------------------------------------------\n// Size helpers\n// ---------------------------------------------------------------------------\n\nconst horizontalSize: Record<Size, string> = {\n xs: \"px-2 py-1 text-xs\",\n sm: \"px-2 py-1 text-xs\",\n md: \"px-3 py-1.5 text-sm\",\n lg: \"px-4 py-2.5 text-base\",\n xl: \"px-5 py-3 text-lg\",\n};\n\nconst circleSize: Record<Size, string> = {\n xs: \"w-7 h-7 text-xs\",\n sm: \"w-8 h-8 text-xs\",\n md: \"w-10 h-10 text-sm\",\n lg: \"w-12 h-12 text-base\",\n xl: \"w-14 h-14 text-lg\",\n};\n\nconst iconSize: Record<Size, string> = {\n xs: \"w-3 h-3\",\n sm: \"w-3 h-3\",\n md: \"w-4 h-4\",\n lg: \"w-5 h-5\",\n xl: \"w-6 h-6\",\n};\n\nconst avatarSize: Record<Size, string> = {\n xs: \"w-4 h-4\",\n sm: \"w-4 h-4\",\n md: \"w-5 h-5\",\n lg: \"w-6 h-6\",\n xl: \"w-7 h-7\",\n};\n\nconst alertIconSize: Record<Size, string> = {\n xs: \"w-2 h-2\",\n sm: \"w-2.5 h-2.5\",\n md: \"w-3 h-3\",\n lg: \"w-4 h-4\",\n xl: \"w-4 h-4\",\n};\n\nconst badgeSize: Record<Size, string> = {\n xs: \"text-[10px] px-1 min-w-[14px] h-3.5\",\n sm: \"text-[10px] px-1.5 min-w-[16px] h-4\",\n md: \"text-[11px] px-1.5 min-w-[18px] h-[18px]\",\n lg: \"text-xs px-2 min-w-[22px] h-5\",\n xl: \"text-xs px-2 min-w-[24px] h-5\",\n};\n\nconst externalIconOffset: Record<Size, string> = {\n xs: \"0.75rem\",\n sm: \"0.75rem\",\n md: \"1rem\",\n lg: \"1.25rem\",\n xl: \"1.5rem\",\n};\n\n// ---------------------------------------------------------------------------\n// Helpers\n// ---------------------------------------------------------------------------\n\nfunction isColored(color?: ButtonColor, active?: boolean, checked?: boolean): boolean {\n return !!(color || active || checked);\n}\n\nfunction getColorClasses(\n color?: ButtonColor,\n active?: boolean,\n checked?: boolean,\n warn?: boolean,\n ghost?: boolean,\n): string {\n if (ghost) {\n if (color) return ghostColorClasses[color];\n if (checked) return ghostCheckedClasses;\n if (active) return ghostActiveClasses;\n if (warn) return ghostWarnClasses;\n return ghostDefaultClasses;\n }\n if (color) return colorClasses[color];\n if (checked) return checkedClasses;\n if (active) return activeClasses;\n if (warn) return warnClasses;\n return defaultClasses;\n}\n\nfunction getIconColorClasses(\n color?: ButtonColor,\n active?: boolean,\n checked?: boolean,\n warn?: boolean,\n ghost?: boolean,\n): string {\n if (ghost) {\n // Ghost variant: icon inherits currentColor from the button text\n return \"text-current\";\n }\n // A filled button's icon takes the label's colour — whatever that colour class\n // says, including a host's per-mode `text-brand-contrast` and the dark labels on\n // amber / yellow / lime. Hard-coded white was invisible on any light fill.\n if (color || active || checked) return \"text-current\";\n if (warn) return \"text-amber-600 dark:text-amber-400\";\n return \"text-zinc-500 dark:text-zinc-400\";\n}\n\nfunction getBadgeClasses(\n color?: ButtonColor,\n active?: boolean,\n checked?: boolean,\n warn?: boolean,\n ghost?: boolean,\n): string {\n if (ghost) {\n return \"bg-current/10 text-current\";\n }\n // Tinted with the label's own colour, for the same reason as the icon.\n if (isColored(color, active, checked)) return \"bg-current/20 text-current\";\n if (warn) return \"bg-amber-200 text-amber-800 dark:bg-amber-800 dark:text-amber-200\";\n return \"bg-zinc-200 text-zinc-700 dark:bg-zinc-600 dark:text-zinc-200\";\n}\n\n// ---------------------------------------------------------------------------\n// Placement parsing\n// ---------------------------------------------------------------------------\n\ntype PlacementAxis = \"left\" | \"right\" | \"top\" | \"bottom\";\n\nfunction parsePlacement(iconPlace: string): { primary: PlacementAxis; secondary?: PlacementAxis } {\n const parts = iconPlace.split(\" \") as PlacementAxis[];\n return { primary: parts[0], secondary: parts[1] };\n}\n\nfunction isVerticalPrimary(primary: PlacementAxis): boolean {\n return primary === \"top\" || primary === \"bottom\";\n}\n\n// ---------------------------------------------------------------------------\n// Sort parsing\n// ---------------------------------------------------------------------------\n\ntype ElementKey = \"e\" | \"i\" | \"a\" | \"b\";\nconst DEFAULT_SORT = \"eiab\";\n\nfunction parseSortOrder(sort?: string): ElementKey[] {\n const chars = (sort ?? DEFAULT_SORT).split(\"\") as ElementKey[];\n const valid: ElementKey[] = [];\n const seen = new Set<string>();\n for (const c of chars) {\n if (\"eiab\".includes(c) && !seen.has(c)) {\n valid.push(c);\n seen.add(c);\n }\n }\n // Add missing keys in default order\n for (const c of DEFAULT_SORT.split(\"\") as ElementKey[]) {\n if (!seen.has(c)) valid.push(c);\n }\n return valid;\n}\n\n// ---------------------------------------------------------------------------\n// Component\n// ---------------------------------------------------------------------------\n\nexport const Button = forwardRef<HTMLButtonElement, ButtonProps>(\n (\n {\n children,\n className,\n variant = \"default\",\n color,\n size = \"md\",\n active,\n checked,\n warn,\n alert: alertProp,\n icon,\n iconTrailing,\n iconPlace = \"left\",\n alertIcon,\n alertIconTrailing,\n emoji,\n emojiTrailing,\n avatar,\n avatarTrailing,\n badge,\n badgeTrailing,\n sort,\n loading = false,\n disabled,\n href,\n as: As,\n responsive,\n labelClassName,\n ...props\n },\n ref,\n ) => {\n const isCircle = variant === \"circle\";\n const isGhost = variant === \"ghost\";\n const { primary, secondary } = parsePlacement(iconPlace);\n const isVertical = isVerticalPrimary(primary);\n const isCompound = !!secondary;\n const needsWrapper = isVertical || isCompound;\n const isReversed = iconPlace === \"right\";\n\n // -----------------------------------------------------------------------\n // Sizing — always use horizontalSize for the button itself\n // -----------------------------------------------------------------------\n const sizeClass = isCircle ? circleSize[size] : horizontalSize[size];\n\n // -----------------------------------------------------------------------\n // Build decorative elements\n // -----------------------------------------------------------------------\n const iconColorCls = getIconColorClasses(color, active, checked, warn, isGhost);\n\n const buildElement = (key: ElementKey, trailing: boolean): ReactNode => {\n switch (key) {\n case \"e\": {\n const slug = trailing ? emojiTrailing : emoji;\n if (!slug) return null;\n const char = resolve(slug);\n if (!char) return null;\n return (\n <span key={`emoji-${trailing ? \"t\" : \"l\"}`} data-action-emoji>\n {char}\n </span>\n );\n }\n case \"i\": {\n if (loading && !trailing) {\n return (\n <span\n key=\"spinner\"\n className={cn(\"animate-spin border-2 border-current border-t-transparent rounded-full\", iconSize[size])}\n />\n );\n }\n const iconSlug = trailing ? iconTrailing : icon;\n if (!iconSlug) return null;\n // For vertical/compound placements, icons render outside the button — not inside\n if (needsWrapper) return null;\n return (\n <span\n key={`icon-${trailing ? \"t\" : \"l\"}`}\n data-action-icon={trailing ? \"trailing\" : \"leading\"}\n className={cn(\"inline-flex items-center flex-shrink-0\", iconColorCls)}\n >\n <Icon name={iconSlug} size={iconSizeMap[size]} />\n </span>\n );\n }\n case \"a\": {\n if (!avatar) return null;\n const isTrailing = avatarTrailing ?? false;\n if (isTrailing !== trailing) return null;\n return (\n <img\n key=\"avatar\"\n src={avatar}\n alt=\"\"\n className={cn(avatarSize[size], \"rounded-full object-cover flex-shrink-0\")}\n data-action-avatar\n />\n );\n }\n case \"b\": {\n if (!badge) return null;\n const isTrailing = badgeTrailing ?? false;\n if (isTrailing !== trailing) return null;\n return (\n <span\n key=\"badge\"\n className={cn(\n \"inline-flex items-center justify-center font-medium rounded-full\",\n badgeSize[size],\n getBadgeClasses(color, active, checked, warn, isGhost),\n )}\n data-action-badge\n >\n {badge}\n </span>\n );\n }\n default:\n return null;\n }\n };\n\n // Alert icon element\n const renderAlertIcon = (trailing: boolean): ReactNode => {\n if (!alertIcon) return null;\n const isTrailing = alertIconTrailing ?? false;\n if (isTrailing !== trailing) return null;\n const alertIconEl = <Icon name={alertIcon} size={alertIconSizeMap[size]} />;\n return (\n <span\n key=\"alert-icon\"\n className=\"relative inline-flex flex-shrink-0\"\n data-action-alert\n >\n <span className=\"text-red-500 dark:text-red-400 animate-pulse\">\n {alertIconEl}\n </span>\n <span className=\"absolute inset-0 flex items-center justify-center text-red-400 dark:text-red-300 animate-ping opacity-75\">\n {alertIconEl}\n </span>\n </span>\n );\n };\n\n const sortOrder = parseSortOrder(sort);\n\n const leadingElements: ReactNode[] = [];\n const trailingElements: ReactNode[] = [];\n\n for (const key of sortOrder) {\n const leading = buildElement(key, false);\n if (leading) leadingElements.push(leading);\n const trailing = buildElement(key, true);\n if (trailing) trailingElements.push(trailing);\n }\n\n // Insert alert icon\n const leadingAlert = renderAlertIcon(false);\n if (leadingAlert) leadingElements.push(leadingAlert);\n const trailingAlert = renderAlertIcon(true);\n if (trailingAlert) trailingElements.push(trailingAlert);\n\n // -----------------------------------------------------------------------\n // Classes\n // -----------------------------------------------------------------------\n const classes = cn(\n // `text-left` overrides the UA <button> center default so a wrapped,\n // width-constrained multi-word label stacks left-aligned. Overridable —\n // twMerge lets a `text-center` / `text-right` in `className` win.\n \"inline-flex items-center justify-center text-left font-medium transition-all duration-200\",\n \"focus:outline-none focus:ring-2 focus:ring-offset-1\",\n \"disabled:opacity-50 disabled:cursor-not-allowed\",\n isCircle ? \"rounded-full\" : \"rounded-lg\",\n sizeClass,\n getColorClasses(color, active, checked, warn, isGhost),\n !isCircle && !needsWrapper && \"gap-2\",\n !isCircle && needsWrapper && \"gap-2\",\n isReversed && !needsWrapper && \"flex-row-reverse\",\n alertProp && \"animate-pulse\",\n className,\n );\n\n // -----------------------------------------------------------------------\n // Content\n // -----------------------------------------------------------------------\n const content = isCircle ? (\n <>\n {loading ? (\n <span\n className={cn(\n \"animate-spin border-2 border-current border-t-transparent rounded-full\",\n iconSize[size],\n )}\n />\n ) : (\n icon ? <Icon name={icon} size={iconSizeMap[size]} /> : children\n )}\n </>\n ) : (\n <>\n {leadingElements}\n {children != null && (\n <span\n data-react-fancy-button-label=\"\"\n className={cn(\n // A button label must stay on one line. When a host flex layout\n // squeezes the button, `whitespace-nowrap` keeps the label and any\n // trailing icon/arrow together instead of wrapping and stacking the\n // icon below it (the classic \"send\" over \"→\" break). `min-w-0` keeps\n // the span shrinkable so `truncate`/ellipsis still works; multi-line\n // wrapping is opt-in via `labelClassName` (\"whitespace-normal\") or\n // the `responsive` prop.\n \"min-w-0 whitespace-nowrap\",\n // `responsive` collapses to icon-only when squeezed, while keeping\n // the label readable to screen readers.\n responsive && \"sr-only sm:not-sr-only\",\n labelClassName,\n )}\n >\n {children}\n </span>\n )}\n {trailingElements}\n </>\n );\n\n // -----------------------------------------------------------------------\n // Build the button element\n // -----------------------------------------------------------------------\n const safeHref = sanitizeHref(href);\n // Anchor mode renders `as` when provided (e.g. a router's <Link> for\n // client-side navigation — Inertia, React Router, Next). Previously `as`\n // fell through ...props onto the <a> where React silently DROPS a\n // function-valued unknown attribute — so `<Button as={Link}>` looked fine\n // but did a full page load. `as` only applies in anchor mode; without an\n // href (or when disabled) the plain <button> renders as always.\n const Anchor = (As ?? \"a\") as ElementType;\n const buttonEl = safeHref && !disabled ? (\n // Anchor mode forwards the same rest props as the <button> branch so\n // onClick / target / rel / ref / ARIA / data-* reach the <a> (issue #7).\n <Anchor\n ref={ref as ForwardedRef<HTMLAnchorElement>}\n href={safeHref}\n className={classes}\n data-react-fancy-button=\"\"\n data-react-fancy-action=\"\"\n {...(props as AnchorHTMLAttributes<HTMLAnchorElement>)}\n >\n {content}\n </Anchor>\n ) : (\n <button\n ref={ref}\n className={classes}\n disabled={disabled || loading}\n data-react-fancy-button=\"\"\n data-react-fancy-action=\"\"\n {...props}\n >\n {content}\n </button>\n );\n\n // -----------------------------------------------------------------------\n // Wrap for vertical/compound icon placement\n // The icon is absolutely positioned so it never shifts the button.\n // -----------------------------------------------------------------------\n if (needsWrapper && (icon || iconTrailing)) {\n const iconSlug = icon ?? iconTrailing;\n const offset = externalIconOffset[size];\n\n // Determine position styles for the icon\n const posStyle: React.CSSProperties = { position: \"absolute\" };\n\n // Primary axis: which side of the button\n if (primary === \"top\") {\n posStyle.bottom = \"100%\";\n posStyle.marginBottom = \"0.125rem\";\n } else if (primary === \"bottom\") {\n posStyle.top = \"100%\";\n posStyle.marginTop = \"0.125rem\";\n } else if (primary === \"left\") {\n posStyle.right = \"100%\";\n posStyle.marginRight = \"0.125rem\";\n } else if (primary === \"right\") {\n posStyle.left = \"100%\";\n posStyle.marginLeft = \"0.125rem\";\n }\n\n // Secondary axis: cross-axis alignment\n if (isVerticalPrimary(primary)) {\n // Vertical primary → secondary controls horizontal position\n if (secondary === \"left\") {\n posStyle.left = \"0\";\n } else if (secondary === \"right\") {\n posStyle.right = \"0\";\n } else {\n // center (default)\n posStyle.left = \"50%\";\n posStyle.transform = \"translateX(-50%)\";\n }\n } else {\n // Horizontal primary → secondary controls vertical position\n if (secondary === \"top\") {\n posStyle.top = \"0\";\n } else if (secondary === \"bottom\") {\n posStyle.bottom = \"0\";\n } else {\n // center (default)\n posStyle.top = \"50%\";\n posStyle.transform = \"translateY(-50%)\";\n }\n }\n\n const externalIcon = (\n <span\n className={cn(\"absolute flex-shrink-0\", iconColorCls)}\n style={posStyle}\n >\n <Icon name={iconSlug!} size={iconSizeMap[size]} />\n </span>\n );\n\n return (\n <span\n data-react-fancy-action-group=\"\"\n className=\"relative inline-flex\"\n >\n {buttonEl}\n {externalIcon}\n </span>\n );\n }\n\n return buttonEl;\n },\n);\n\nButton.displayName = \"Button\";\n\n/**\n * @deprecated Renamed to {@link Button}. `Action` remains as an alias for\n * backward compatibility and will be removed in a future major version.\n * Prefer importing `Button` from \"@particle-academy/react-fancy\".\n */\nexport const Action = Button;\n"]}
@@ -1,23 +1,23 @@
1
1
  'use strict';
2
2
 
3
3
  require('./chunk-S3TRSECD.cjs');
4
- var chunkND5D7GJB_cjs = require('./chunk-ND5D7GJB.cjs');
5
- require('./chunk-BFKCVSNK.cjs');
4
+ var chunkFNYUUVOK_cjs = require('./chunk-FNYUUVOK.cjs');
5
+ require('./chunk-LRNWD26Z.cjs');
6
6
  require('./chunk-ZU5Q77OT.cjs');
7
7
 
8
8
 
9
9
 
10
10
  Object.defineProperty(exports, "ContentRenderer", {
11
11
  enumerable: true,
12
- get: function () { return chunkND5D7GJB_cjs.ContentRenderer; }
12
+ get: function () { return chunkFNYUUVOK_cjs.ContentRenderer; }
13
13
  });
14
14
  Object.defineProperty(exports, "registerExtension", {
15
15
  enumerable: true,
16
- get: function () { return chunkND5D7GJB_cjs.registerExtension; }
16
+ get: function () { return chunkFNYUUVOK_cjs.registerExtension; }
17
17
  });
18
18
  Object.defineProperty(exports, "registerExtensions", {
19
19
  enumerable: true,
20
- get: function () { return chunkND5D7GJB_cjs.registerExtensions; }
20
+ get: function () { return chunkFNYUUVOK_cjs.registerExtensions; }
21
21
  });
22
22
  //# sourceMappingURL=content-renderer.cjs.map
23
23
  //# sourceMappingURL=content-renderer.cjs.map
@@ -1,6 +1,6 @@
1
1
  import './chunk-AUTW5O4W.js';
2
- export { ContentRenderer, registerExtension, registerExtensions } from './chunk-25ZOOUFG.js';
3
- import './chunk-XJXQG34J.js';
2
+ export { ContentRenderer, registerExtension, registerExtensions } from './chunk-GMNMJLZO.js';
3
+ import './chunk-QXYO76NZ.js';
4
4
  import './chunk-MMW2JGKZ.js';
5
5
  //# sourceMappingURL=content-renderer.js.map
6
6
  //# sourceMappingURL=content-renderer.js.map
package/dist/editor.cjs CHANGED
@@ -1,13 +1,13 @@
1
1
  'use strict';
2
2
 
3
- var chunkWWUKTXPX_cjs = require('./chunk-WWUKTXPX.cjs');
3
+ var chunkODAPI4QJ_cjs = require('./chunk-ODAPI4QJ.cjs');
4
4
  require('./chunk-HPNIEYSJ.cjs');
5
5
  require('./chunk-T6YELZPJ.cjs');
6
- require('./chunk-ND5D7GJB.cjs');
6
+ require('./chunk-FNYUUVOK.cjs');
7
7
  require('./chunk-G7227RTY.cjs');
8
8
  require('./chunk-TXTRTTG7.cjs');
9
9
  require('./chunk-3WGRVDQR.cjs');
10
- require('./chunk-BFKCVSNK.cjs');
10
+ require('./chunk-LRNWD26Z.cjs');
11
11
  require('./chunk-L3V3BYVS.cjs');
12
12
  require('./chunk-J2DI6RMR.cjs');
13
13
  require('./chunk-57FQGQJK.cjs');
@@ -19,11 +19,11 @@ require('./chunk-ZU5Q77OT.cjs');
19
19
 
20
20
  Object.defineProperty(exports, "Editor", {
21
21
  enumerable: true,
22
- get: function () { return chunkWWUKTXPX_cjs.Editor; }
22
+ get: function () { return chunkODAPI4QJ_cjs.Editor; }
23
23
  });
24
24
  Object.defineProperty(exports, "useEditor", {
25
25
  enumerable: true,
26
- get: function () { return chunkWWUKTXPX_cjs.useEditor; }
26
+ get: function () { return chunkODAPI4QJ_cjs.useEditor; }
27
27
  });
28
28
  //# sourceMappingURL=editor.cjs.map
29
29
  //# sourceMappingURL=editor.cjs.map
package/dist/editor.js CHANGED
@@ -1,11 +1,11 @@
1
- export { Editor, useEditor } from './chunk-TX6VUYBC.js';
1
+ export { Editor, useEditor } from './chunk-K74R6IEB.js';
2
2
  import './chunk-FWCREAIT.js';
3
3
  import './chunk-CPY7NHXM.js';
4
- import './chunk-25ZOOUFG.js';
4
+ import './chunk-GMNMJLZO.js';
5
5
  import './chunk-FBWUXSKH.js';
6
6
  import './chunk-5U2DZ7AV.js';
7
7
  import './chunk-CHADHN6M.js';
8
- import './chunk-XJXQG34J.js';
8
+ import './chunk-QXYO76NZ.js';
9
9
  import './chunk-NRXK42LO.js';
10
10
  import './chunk-MQ6VGG62.js';
11
11
  import './chunk-RGANGU7X.js';
@@ -1,66 +1,5 @@
1
1
  import * as react from 'react';
2
- import { HTMLAttributes, ReactNode } from 'react';
3
-
4
- interface FauxClientProps extends Omit<HTMLAttributes<HTMLDivElement>, "children"> {
5
- /** Chrome style: a browser window, a device bezel, or no chrome. */
6
- variant?: "browser" | "device" | "bare";
7
- /** Address-bar / title text (browser variant). */
8
- url?: ReactNode;
9
- /** Right-aligned meta text in the bar (browser variant). */
10
- meta?: ReactNode;
11
- /** Show the macOS traffic-light dots (browser variant). */
12
- dots?: boolean;
13
- /**
14
- * Logical content width in px. When set, children render at this width and are
15
- * scaled to fit (see {@link FauxClientProps.scale}) — for downscaled previews
16
- * of full pages/apps. Omit to render children at natural size (chrome only).
17
- */
18
- width?: number;
19
- /** `"fit"` scales the logical {@link FauxClientProps.width} to the frame; a number is a fixed scale. */
20
- scale?: number | "fit";
21
- /**
22
- * A zoom bar (−, percentage, +) and a full-screen button, in the frame's
23
- * bottom-right corner. `true` for both; `{ zoom: false }` or
24
- * `{ fullscreen: false }` to leave one out. Default `false`.
25
- */
26
- controls?: boolean | {
27
- zoom?: boolean;
28
- fullscreen?: boolean;
29
- };
30
- /** The zoom, 1 = fit. Controllable, so an agent can read and set it. */
31
- zoom?: number;
32
- defaultZoom?: number;
33
- onZoomChange?: (zoom: number) => void;
34
- /** Default 0.5. */
35
- minZoom?: number;
36
- /** Default 4. */
37
- maxZoom?: number;
38
- /**
39
- * Called when the frame enters or leaves full screen, however it happened
40
- * (the button, Esc, the browser). The frame also carries
41
- * `data-fullscreen="true"` while it is, for styling the content.
42
- */
43
- onFullscreenChange?: (fullscreen: boolean) => void;
44
- /**
45
- * Take the parent's height, and give the content whatever the chrome leaves.
46
- * For content that sizes itself to its box (a slide viewer, a spreadsheet)
47
- * rather than to what is in it. Default `false`.
48
- */
49
- fill?: boolean;
50
- /**
51
- * `false`: the frame shows the zoom controls and keeps the zoom state, but
52
- * does not scale the content; the content reads `zoom` (via `onZoomChange` or
53
- * a controlled `zoom`) and zooms itself. For content that fits itself to its
54
- * box (a slide viewer), which a scaled frame only re-fits. Default `true`.
55
- */
56
- applyZoom?: boolean;
57
- className?: string;
58
- /** Class for the browser bar. */
59
- barClassName?: string;
60
- /** Class for the content viewport. */
61
- bodyClassName?: string;
62
- children?: ReactNode;
63
- }
2
+ import { F as FauxClientProps } from './FauxClient.types-Dtk9aRs6.cjs';
64
3
 
65
4
  /**
66
5
  * A frame that mimics a browser window or device, rendering **real UI** inside.
@@ -75,4 +14,4 @@ interface FauxClientProps extends Omit<HTMLAttributes<HTMLDivElement>, "children
75
14
  */
76
15
  declare const FauxClient: react.ForwardRefExoticComponent<FauxClientProps & react.RefAttributes<HTMLDivElement>>;
77
16
 
78
- export { FauxClient, type FauxClientProps };
17
+ export { FauxClient, FauxClientProps };