hyperframes 0.8.71 → 0.8.72

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.
@@ -1,4 +1,4 @@
1
- import{n as Qi}from"./index-CUcdruHw.js";/*!
1
+ import{n as Qi}from"./index-BqUGSWqN.js";/*!
2
2
  * Copyright (c) 2026-present, Vanilagy and contributors
3
3
  *
4
4
  * This Source Code Form is subject to the terms of the Mozilla Public
@@ -1 +1 @@
1
- import{g as P}from"./index-CUcdruHw.js";function j(c,d){for(var s=0;s<d.length;s++){const a=d[s];if(typeof a!="string"&&!Array.isArray(a)){for(const i in a)if(i!=="default"&&!(i in c)){const l=Object.getOwnPropertyDescriptor(a,i);l&&Object.defineProperty(c,i,l.get?l:{enumerable:!0,get:()=>a[i]})}}}return Object.freeze(Object.defineProperty(c,Symbol.toStringTag,{value:"Module"}))}var v={},w;function k(){if(w)return v;w=1,Object.defineProperty(v,"__esModule",{value:!0}),v.default=d;var c=window.OfflineAudioContext||window.webkitOfflineAudioContext;function d(e){var r=a(e);return r.start(0),[i,y,O(e.sampleRate),s].reduce(function(t,o){return o(t)},r.buffer.getChannelData(0))}function s(e){return e.sort(function(r,t){return t.count-r.count}).splice(0,5)[0].tempo}function a(e){var r=e.length,t=e.numberOfChannels,o=e.sampleRate,n=new c(t,r,o),u=n.createBufferSource();u.buffer=e;var f=n.createBiquadFilter();return f.type="lowpass",u.connect(f),f.connect(n.destination),u}function i(e){for(var r=[],t=.9,o=.3,n=15;r.length<n&&t>=o;)r=l(e,t),t-=.05;if(r.length<n)throw new Error("Could not find enough samples for a reliable detection.");return r}function l(e,r){for(var t=[],o=0,n=e.length;o<n;o+=1)e[o]>r&&(t.push(o),o+=1e4);return t}function y(e){var r=[];return e.forEach(function(t,o){for(var n=function(x){var g=e[o+x]-t,_=r.some(function(h){if(h.interval===g)return h.count+=1});_||r.push({interval:g,count:1})},u=0;u<10;u+=1)n(u)}),r}function O(e){return function(r){var t=[];return r.forEach(function(o){if(o.interval!==0){for(var n=60/(o.interval/e);n<90;)n*=2;for(;n>180;)n/=2;n=Math.round(n);var u=t.some(function(f){if(f.tempo===n)return f.count+=o.count});u||t.push({tempo:n,count:o.count})}}),t}}return v}var p,b;function q(){return b||(b=1,p=k().default),p}var m=q();const A=P(m),D=j({__proto__:null,default:A},[m]);export{D as i};
1
+ import{g as P}from"./index-BqUGSWqN.js";function j(c,d){for(var s=0;s<d.length;s++){const a=d[s];if(typeof a!="string"&&!Array.isArray(a)){for(const i in a)if(i!=="default"&&!(i in c)){const l=Object.getOwnPropertyDescriptor(a,i);l&&Object.defineProperty(c,i,l.get?l:{enumerable:!0,get:()=>a[i]})}}}return Object.freeze(Object.defineProperty(c,Symbol.toStringTag,{value:"Module"}))}var v={},w;function k(){if(w)return v;w=1,Object.defineProperty(v,"__esModule",{value:!0}),v.default=d;var c=window.OfflineAudioContext||window.webkitOfflineAudioContext;function d(e){var r=a(e);return r.start(0),[i,y,O(e.sampleRate),s].reduce(function(t,o){return o(t)},r.buffer.getChannelData(0))}function s(e){return e.sort(function(r,t){return t.count-r.count}).splice(0,5)[0].tempo}function a(e){var r=e.length,t=e.numberOfChannels,o=e.sampleRate,n=new c(t,r,o),u=n.createBufferSource();u.buffer=e;var f=n.createBiquadFilter();return f.type="lowpass",u.connect(f),f.connect(n.destination),u}function i(e){for(var r=[],t=.9,o=.3,n=15;r.length<n&&t>=o;)r=l(e,t),t-=.05;if(r.length<n)throw new Error("Could not find enough samples for a reliable detection.");return r}function l(e,r){for(var t=[],o=0,n=e.length;o<n;o+=1)e[o]>r&&(t.push(o),o+=1e4);return t}function y(e){var r=[];return e.forEach(function(t,o){for(var n=function(x){var g=e[o+x]-t,_=r.some(function(h){if(h.interval===g)return h.count+=1});_||r.push({interval:g,count:1})},u=0;u<10;u+=1)n(u)}),r}function O(e){return function(r){var t=[];return r.forEach(function(o){if(o.interval!==0){for(var n=60/(o.interval/e);n<90;)n*=2;for(;n>180;)n/=2;n=Math.round(n);var u=t.some(function(f){if(f.tempo===n)return f.count+=o.count});u||t.push({tempo:n,count:o.count})}}),t}}return v}var p,b;function q(){return b||(b=1,p=k().default),p}var m=q();const A=P(m),D=j({__proto__:null,default:A},[m]);export{D as i};
@@ -2124,6 +2124,8 @@ interface NLEPreviewProps {
2124
2124
  onStageRef?: (ref: React.RefObject<HTMLDivElement | null>) => void;
2125
2125
  /** Reports the authored composition size measured from the loaded preview. */
2126
2126
  onCompositionSizeChange?: (size: PreviewCompositionSize | null) => void;
2127
+ /** Draws the picture edge to edge in this box, without Studio's inset band. */
2128
+ fillBox?: boolean;
2127
2129
  }
2128
2130
  declare const NLEPreview: react.NamedExoticComponent<NLEPreviewProps>;
2129
2131
 
@@ -5,7 +5,7 @@
5
5
  <meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover" />
6
6
  <link rel="icon" type="image/svg+xml" href="/favicon.svg" />
7
7
  <title>HyperFrames Studio</title>
8
- <script type="module" crossorigin src="/assets/index-CUcdruHw.js"></script>
8
+ <script type="module" crossorigin src="/assets/index-BqUGSWqN.js"></script>
9
9
  <link rel="stylesheet" crossorigin href="/assets/index-0w6iIlwZ.css">
10
10
  </head>
11
11
  <body>
@@ -29672,7 +29672,7 @@ function getPreviewPlayerKey({
29672
29672
  }
29673
29673
  var ZOOM_HUD_TIMEOUT_MS = 1200;
29674
29674
  var ZOOM_SETTLE_MS = 200;
29675
- var PREVIEW_STAGE_INSET_PX = 16;
29675
+ var PREVIEW_STAGE_INSET_PX = 8;
29676
29676
  var SHADOW_IFRAME_STYLE = {
29677
29677
  position: "absolute",
29678
29678
  inset: 0,
@@ -29691,9 +29691,9 @@ function loadInitialZoom() {
29691
29691
  panY: stored.panY
29692
29692
  } : DEFAULT_PREVIEW_ZOOM;
29693
29693
  }
29694
- function resolvePreviewStageSize(viewportWidth, viewportHeight, compositionSize, portrait, gutterPx = 0) {
29695
- const availableWidth = Math.max(0, viewportWidth - PREVIEW_STAGE_INSET_PX - 2 * gutterPx);
29696
- const availableHeight = Math.max(0, viewportHeight - PREVIEW_STAGE_INSET_PX - 2 * gutterPx);
29694
+ function resolvePreviewStageSize(viewportWidth, viewportHeight, compositionSize, portrait, gutterPx = 0, insetPx = PREVIEW_STAGE_INSET_PX) {
29695
+ const availableWidth = Math.max(0, viewportWidth - 2 * (insetPx + gutterPx));
29696
+ const availableHeight = Math.max(0, viewportHeight - 2 * (insetPx + gutterPx));
29697
29697
  const aspectRatio = compositionSize && compositionSize.width > 0 && compositionSize.height > 0 ? compositionSize.width / compositionSize.height : portrait ? 9 / 16 : 16 / 9;
29698
29698
  if (availableWidth === 0 || availableHeight === 0) {
29699
29699
  return { width: 0, height: 0 };
@@ -29724,7 +29724,8 @@ var NLEPreview = memo19(function NLEPreview2({
29724
29724
  directUrl,
29725
29725
  suppressLoadingOverlay,
29726
29726
  onStageRef,
29727
- onCompositionSizeChange
29727
+ onCompositionSizeChange,
29728
+ fillBox
29728
29729
  }) {
29729
29730
  const activeKey = getPreviewPlayerKey({ projectId, directUrl });
29730
29731
  const viewportRef = useRef56(null);
@@ -29743,6 +29744,7 @@ var NLEPreview = memo19(function NLEPreview2({
29743
29744
  const reportPreviewFirstFrame = usePreviewFirstFrameTelemetry(previewSlots);
29744
29745
  const [compositionSize, setCompositionSize] = useState37(null);
29745
29746
  const gutterPx = usePreviewGuidesStore((s) => s.rulerVisible ? RULER_GUTTER_PX : 0);
29747
+ const insetPx = fillBox ? 0 : PREVIEW_STAGE_INSET_PX;
29746
29748
  const [stageSize, setStageSize] = useState37(() => resolvePreviewStageSize(0, 0, null, portrait));
29747
29749
  const zoomRef = useRef56(loadInitialZoom());
29748
29750
  const [settledZoom, setSettledZoom] = useState37(() => zoomRef.current);
@@ -29763,14 +29765,21 @@ var NLEPreview = memo19(function NLEPreview2({
29763
29765
  const updateStageSize = () => {
29764
29766
  const rect = viewport.getBoundingClientRect();
29765
29767
  setStageSize(
29766
- resolvePreviewStageSize(rect.width, rect.height, compositionSize, portrait, gutterPx)
29768
+ resolvePreviewStageSize(
29769
+ rect.width,
29770
+ rect.height,
29771
+ compositionSize,
29772
+ portrait,
29773
+ gutterPx,
29774
+ insetPx
29775
+ )
29767
29776
  );
29768
29777
  };
29769
29778
  updateStageSize();
29770
29779
  const observer = new ResizeObserver(updateStageSize);
29771
29780
  observer.observe(viewport);
29772
29781
  return () => observer.disconnect();
29773
- }, [compositionSize, portrait, gutterPx]);
29782
+ }, [compositionSize, portrait, gutterPx, insetPx]);
29774
29783
  const onCompositionSizeChangeRef = useRef56(onCompositionSizeChange);
29775
29784
  onCompositionSizeChangeRef.current = onCompositionSizeChange;
29776
29785
  const updateCompositionSizeFromPreview = useCallback45(() => {
@@ -29996,77 +30005,84 @@ var NLEPreview = memo19(function NLEPreview2({
29996
30005
  "div",
29997
30006
  {
29998
30007
  ref: viewportRef,
29999
- className: "relative flex-1 flex items-center justify-center p-2 overflow-hidden min-h-0 outline-hidden focus:ring-1 focus:ring-studio-accent/40 bg-[var(--studio-preview-bg,var(--color-neutral-950))]",
30008
+ className: "relative flex-1 flex items-center justify-center overflow-hidden min-h-0 outline-hidden focus:ring-1 focus:ring-studio-accent/40 bg-[var(--studio-preview-bg,var(--color-neutral-950))]",
30000
30009
  tabIndex: 0,
30001
30010
  "aria-label": "Composition preview",
30002
30011
  children: [
30003
- /* @__PURE__ */ jsx86("div", { className: "absolute inset-2 flex items-center justify-center pointer-events-none", children: /* @__PURE__ */ jsxs61(
30012
+ /* @__PURE__ */ jsx86(
30004
30013
  "div",
30005
30014
  {
30006
- ref: stageRef,
30007
- className: "relative shrink-0 pointer-events-auto",
30008
- style: {
30009
- width: `${stageSize.width}px`,
30010
- height: `${stageSize.height}px`,
30011
- transform: `translate3d(${toDomPrecision(initial.panX)}px, ${toDomPrecision(initial.panY)}px, 0) scale(${toDomPrecision(initial.zoomPercent / 100)})`,
30012
- // resolvePreviewWheelZoom cursor math assumes center-center pivot
30013
- transformOrigin: "center center"
30014
- },
30015
- "data-testid": "preview-zoom-stage",
30016
- children: [
30017
- directUrl?.includes("/components/") && /* @__PURE__ */ jsx86(
30018
- Player,
30019
- {
30020
- projectId,
30021
- onLoad: () => {
30022
- },
30023
- portrait,
30024
- suppressLoadingOverlay: true,
30025
- style: { position: "absolute", inset: 0, zIndex: 0 }
30015
+ className: "absolute flex items-center justify-center pointer-events-none",
30016
+ style: { inset: insetPx },
30017
+ children: /* @__PURE__ */ jsxs61(
30018
+ "div",
30019
+ {
30020
+ ref: stageRef,
30021
+ className: "relative shrink-0 pointer-events-auto",
30022
+ style: {
30023
+ width: `${stageSize.width}px`,
30024
+ height: `${stageSize.height}px`,
30025
+ transform: `translate3d(${toDomPrecision(initial.panX)}px, ${toDomPrecision(initial.panY)}px, 0) scale(${toDomPrecision(initial.zoomPercent / 100)})`,
30026
+ // resolvePreviewWheelZoom cursor math assumes center-center pivot
30027
+ transformOrigin: "center center"
30026
30028
  },
30027
- `backdrop-${projectId}`
30028
- ),
30029
- previewSlots.map(
30030
- (slot) => slot.role === "live" ? /* @__PURE__ */ jsx86(
30031
- Player,
30032
- {
30033
- ref: setPreviewIframeRef,
30034
- projectId: directUrl ? void 0 : projectId,
30035
- directUrl,
30036
- onLoad: () => {
30037
- updateCompositionSizeFromPreview();
30038
- onIframeLoad();
30039
- applyInitialZoom();
30040
- },
30041
- onCompositionLoadingChange,
30042
- onPainted: (details) => reportPreviewFirstFrame(slot, details),
30043
- portrait,
30044
- suppressLoadingOverlay,
30045
- style: directUrl?.includes("/components/") ? { position: "absolute", inset: 0, zIndex: 1 } : void 0
30046
- },
30047
- `${activeKey}-${slot.gen}`
30048
- ) : (
30049
- // Loads hidden behind the live slot until promoted.
30050
- /* @__PURE__ */ jsx86(
30029
+ "data-testid": "preview-zoom-stage",
30030
+ children: [
30031
+ directUrl?.includes("/components/") && /* @__PURE__ */ jsx86(
30051
30032
  Player,
30052
30033
  {
30053
- ref: setShadowIframeNode,
30054
- directUrl: slot.url,
30055
- onLoad: () => onShadowIframeLoad(slot.gen),
30056
- onReadyToShowChange: (ready) => onShadowReadyChange(slot.gen, ready),
30057
- onPainted: (details) => reportPreviewFirstFrame(slot, details),
30058
- onPreviewError: (message) => onShadowError(slot.gen, message),
30034
+ projectId,
30035
+ onLoad: () => {
30036
+ },
30059
30037
  portrait,
30060
30038
  suppressLoadingOverlay: true,
30061
- style: SHADOW_IFRAME_STYLE
30039
+ style: { position: "absolute", inset: 0, zIndex: 0 }
30062
30040
  },
30063
- `${activeKey}-${slot.gen}`
30041
+ `backdrop-${projectId}`
30042
+ ),
30043
+ previewSlots.map(
30044
+ (slot) => slot.role === "live" ? /* @__PURE__ */ jsx86(
30045
+ Player,
30046
+ {
30047
+ ref: setPreviewIframeRef,
30048
+ projectId: directUrl ? void 0 : projectId,
30049
+ directUrl,
30050
+ onLoad: () => {
30051
+ updateCompositionSizeFromPreview();
30052
+ onIframeLoad();
30053
+ applyInitialZoom();
30054
+ },
30055
+ onCompositionLoadingChange,
30056
+ onPainted: (details) => reportPreviewFirstFrame(slot, details),
30057
+ portrait,
30058
+ suppressLoadingOverlay,
30059
+ style: directUrl?.includes("/components/") ? { position: "absolute", inset: 0, zIndex: 1 } : void 0
30060
+ },
30061
+ `${activeKey}-${slot.gen}`
30062
+ ) : (
30063
+ // Loads hidden behind the live slot until promoted.
30064
+ /* @__PURE__ */ jsx86(
30065
+ Player,
30066
+ {
30067
+ ref: setShadowIframeNode,
30068
+ directUrl: slot.url,
30069
+ onLoad: () => onShadowIframeLoad(slot.gen),
30070
+ onReadyToShowChange: (ready) => onShadowReadyChange(slot.gen, ready),
30071
+ onPainted: (details) => reportPreviewFirstFrame(slot, details),
30072
+ onPreviewError: (message) => onShadowError(slot.gen, message),
30073
+ portrait,
30074
+ suppressLoadingOverlay: true,
30075
+ style: SHADOW_IFRAME_STYLE
30076
+ },
30077
+ `${activeKey}-${slot.gen}`
30078
+ )
30079
+ )
30064
30080
  )
30065
- )
30066
- )
30067
- ]
30081
+ ]
30082
+ }
30083
+ )
30068
30084
  }
30069
- ) }),
30085
+ ),
30070
30086
  /* @__PURE__ */ jsx86(
30071
30087
  "div",
30072
30088
  {