@adminide-stack/yantra-mobile 12.0.128 → 12.0.129-alpha.1

package/lib/features/canvas/generator/DirectorSheet.js

@@ -0,0 +1,163 @@
+import {jsxs,jsx,Fragment}from'react/jsx-runtime';import {useMemo,useState}from'react';import {Text,View,StyleSheet}from'react-native';import {MaterialCommunityIcons}from'@expo/vector-icons';import {useCanvasTheme,themedStyles}from'../canvasTheme.js';import {Pressable,pressedStyle,Segmented,RADIUS,SPACE,TYPE}from'../canvasUi.js';import {SHOT_SIZES,CAMERA_MOVES,CAMERA_ANGLES,FOCAL_LENGTHS,APERTURES,FILM_STOCKS}from'./cameraVocabulary.js';import {GENRES,ERAS,TEMPOS,LIGHTING,PALETTES}from'./cinematicVocabulary.js';import {GeneratorBottomSheet,ChipGrid}from'./BottomSheet.js';import {directionSummary,directedPrompt,directionCount,toggleField}from'./direction.js';var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+const TABS = [{
+  id: "camera",
+  label: "Camera"
+}, {
+  id: "film",
+  label: "Film"
+}, {
+  id: "look",
+  label: "Look"
+}];
+const labelled = (list) => list.map((o) => ({
+  id: o.label,
+  label: o.label,
+  hint: o.hint
+}));
+function DirectorSheet({
+  value,
+  onChange,
+  onClose,
+  prompt
+}) {
+  const theme = useCanvasTheme();
+  const styles = useMemo(() => makeStyles(theme), [theme]);
+  const [tab, setTab] = useState("camera");
+  const {
+    camera,
+    cinematic
+  } = value;
+  const setCamera = (key, v) => onChange(__spreadProps(__spreadValues({}, value), {
+    camera: toggleField(camera, key, v)
+  }));
+  const setFilm = (key, v) => onChange(__spreadProps(__spreadValues({}, value), {
+    cinematic: toggleField(cinematic, key, v)
+  }));
+  const preview = directedPrompt((prompt == null ? void 0 : prompt.trim()) || "Your brief", value);
+  const count = directionCount(value);
+  return /* @__PURE__ */ jsxs(GeneratorBottomSheet, { title: "Direct the shot", onClose, testID: "director-sheet", footer: /* @__PURE__ */ jsxs(View, { style: styles.footer, children: [
+    /* @__PURE__ */ jsx(Text, { style: styles.preview, numberOfLines: 3, children: count ? preview : "Nothing set: the prompt goes as you wrote it." }),
+    count ? /* @__PURE__ */ jsxs(Pressable, { onPress: () => onChange({
+      camera: {},
+      cinematic: {}
+    }), style: ({
+      pressed
+    }) => [styles.reset, pressedStyle(pressed)], accessibilityRole: "button", children: [
+      /* @__PURE__ */ jsx(MaterialCommunityIcons, { name: "restore", size: 14, color: theme.foreground }),
+      /* @__PURE__ */ jsx(Text, { style: styles.resetLabel, children: "Clear" })
+    ] }) : null
+  ] }), children: [
+    /* @__PURE__ */ jsx(Segmented, { options: TABS, value: tab, onChange: setTab, style: styles.tabs }),
+    tab === "camera" ? /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx(ChipGrid, { label: "Shot size", options: labelled(SHOT_SIZES), value: camera.shot, onChange: (v) => setCamera("shot", v) }),
+      /* @__PURE__ */ jsx(ChipGrid, { label: "Move", options: labelled(CAMERA_MOVES), value: camera.move, onChange: (v) => setCamera("move", v) }),
+      /* @__PURE__ */ jsx(ChipGrid, { label: "Angle", options: labelled(CAMERA_ANGLES), value: camera.angle, onChange: (v) => setCamera("angle", v) }),
+      /* @__PURE__ */ jsx(ChipGrid, { label: "Lens", options: FOCAL_LENGTHS.map((f) => ({
+        id: f.mm,
+        label: f.label
+      })), value: camera.lensMm, onChange: (v) => setCamera("lensMm", v) }),
+      /* @__PURE__ */ jsx(ChipGrid, { label: "Aperture", options: labelled(APERTURES), value: camera.aperture, onChange: (v) => setCamera("aperture", v) }),
+      /* @__PURE__ */ jsx(ChipGrid, { label: "Format", options: labelled(FILM_STOCKS), value: camera.stock, onChange: (v) => setCamera("stock", v) })
+    ] }) : tab === "film" ? /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx(ChipGrid, { label: "Genre", options: labelled(GENRES), value: cinematic.genre, onChange: (v) => setFilm("genre", v), swatch: (id) => {
+        const g = GENRES.find((o) => o.label === id);
+        return g ? [g.art.from, g.art.to] : void 0;
+      } }),
+      /* @__PURE__ */ jsx(ChipGrid, { label: "Era", options: labelled(ERAS), value: cinematic.era, onChange: (v) => setFilm("era", v), swatch: (id) => {
+        const e = ERAS.find((o) => o.label === id);
+        return e ? [e.art.from, e.art.to] : void 0;
+      } }),
+      /* @__PURE__ */ jsx(ChipGrid, { label: "Tempo", options: labelled(TEMPOS), value: cinematic.tempo, onChange: (v) => setFilm("tempo", v) })
+    ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx(ChipGrid, { label: "Lighting", options: labelled(LIGHTING), value: cinematic.lighting, onChange: (v) => setFilm("lighting", v), swatch: (id) => {
+        const l = LIGHTING.find((o) => o.label === id);
+        return l ? [l.light.key, l.light.ambient] : void 0;
+      } }),
+      /* @__PURE__ */ jsx(ChipGrid, { label: "Palette", options: labelled(PALETTES), value: cinematic.palette, onChange: (v) => setFilm("palette", v), swatch: (id) => {
+        const p = PALETTES.find((o) => o.label === id);
+        return p ? [...p.swatches] : void 0;
+      } })
+    ] })
+  ] });
+}
+function DirectorPill({
+  value,
+  onPress
+}) {
+  const theme = useCanvasTheme();
+  const styles = useMemo(() => makeStyles(theme), [theme]);
+  const summary = directionSummary(value);
+  const on = Boolean(summary);
+  return /* @__PURE__ */ jsxs(Pressable, { onPress, style: ({
+    pressed
+  }) => [styles.pill, on && styles.pillOn, pressedStyle(pressed)], accessibilityRole: "button", accessibilityLabel: "Camera and film direction", children: [
+    /* @__PURE__ */ jsx(MaterialCommunityIcons, { name: "movie-open-cog-outline", size: 14, color: on ? theme.background : theme.mutedForeground }),
+    /* @__PURE__ */ jsx(Text, { style: [styles.pillLabel, on && styles.pillLabelOn], numberOfLines: 1, children: summary || "Direct" })
+  ] });
+}
+const makeStyles = themedStyles((theme) => StyleSheet.create({
+  tabs: {
+    flexGrow: 0,
+    alignSelf: "flex-start"
+  },
+  footer: {
+    flexDirection: "row",
+    alignItems: "center",
+    gap: SPACE.sm
+  },
+  preview: __spreadProps(__spreadValues({}, TYPE.caption), {
+    flex: 1,
+    fontWeight: "400",
+    color: theme.mutedForeground
+  }),
+  reset: {
+    flexDirection: "row",
+    alignItems: "center",
+    gap: SPACE.xs,
+    minHeight: 32,
+    paddingHorizontal: SPACE.md,
+    borderRadius: RADIUS.pill,
+    backgroundColor: theme.card
+  },
+  resetLabel: __spreadProps(__spreadValues({}, TYPE.label), {
+    color: theme.foreground
+  }),
+  pill: {
+    flexDirection: "row",
+    alignItems: "center",
+    gap: SPACE.sm - 2,
+    minHeight: 36,
+    paddingHorizontal: SPACE.md + 2,
+    borderRadius: RADIUS.pill,
+    backgroundColor: theme.card,
+    maxWidth: 220
+  },
+  pillOn: {
+    backgroundColor: theme.foreground
+  },
+  pillLabel: __spreadProps(__spreadValues({}, TYPE.label), {
+    flexShrink: 1,
+    color: theme.foreground
+  }),
+  pillLabelOn: {
+    color: theme.background
+  }
+}));export{DirectorPill,DirectorSheet};//# sourceMappingURL=DirectorSheet.js.map

package/lib/features/canvas/generator/DirectorSheet.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DirectorSheet.js","sources":["../../../../src/features/canvas/generator/DirectorSheet.tsx"],"sourcesContent":["/**\n * Camera + cinematic pickers for the video lane (native twin of the web's\n * camera panel and CinematicModal). Bottom-sheet chip grids instead of the\n * web's ring and wheel: the same vocabulary, picked with a thumb. Every pick\n * toggles, and an empty setup adds nothing to the prompt.\n */\nimport React, { useMemo, useState } from 'react';\nimport { StyleSheet, Text, View } from 'react-native';\nimport { MaterialCommunityIcons } from '@expo/vector-icons';\nimport { useCanvasTheme, themedStyles, type CanvasPalette } from '../canvasTheme';\nimport { Pressable, RADIUS, SPACE, Segmented, TYPE, pressedStyle } from '../canvasUi';\nimport { APERTURES, CAMERA_ANGLES, CAMERA_MOVES, FILM_STOCKS, FOCAL_LENGTHS, SHOT_SIZES } from './cameraVocabulary';\nimport { ERAS, GENRES, LIGHTING, PALETTES, TEMPOS } from './cinematicVocabulary';\nimport { ChipGrid, GeneratorBottomSheet } from './BottomSheet';\nimport { directedPrompt, directionCount, directionSummary, toggleField, type Direction } from './direction';\n\ntype Tab = 'camera' | 'film' | 'look';\nconst TABS: ReadonlyArray<{ id: Tab; label: string }> = [\n    { id: 'camera', label: 'Camera' },\n    { id: 'film', label: 'Film' },\n    { id: 'look', label: 'Look' },\n];\n\nconst labelled = (list: ReadonlyArray<{ label: string; hint?: string }>) =>\n    list.map((o) => ({ id: o.label, label: o.label, hint: o.hint }));\n\nexport function DirectorSheet({\n    value,\n    onChange,\n    onClose,\n    prompt,\n}: {\n    value: Direction;\n    onChange: (next: Direction) => void;\n    onClose: () => void;\n    /** The brief, so the sheet can show what the model will read. */\n    prompt?: string;\n}) {\n    const theme = useCanvasTheme();\n    const styles = useMemo(() => makeStyles(theme), [theme]);\n    const [tab, setTab] = useState<Tab>('camera');\n    const { camera, cinematic } = value;\n    const setCamera = <K extends keyof typeof camera>(key: K, v: (typeof camera)[K]) =>\n        onChange({ ...value, camera: toggleField(camera, key, v) });\n    const setFilm = <K extends keyof typeof cinematic>(key: K, v: (typeof cinematic)[K]) =>\n        onChange({ ...value, cinematic: toggleField(cinematic, key, v) });\n    const preview = directedPrompt(prompt?.trim() || 'Your brief', value);\n    const count = directionCount(value);\n\n    return (\n        <GeneratorBottomSheet\n            title=\"Direct the shot\"\n            onClose={onClose}\n            testID=\"director-sheet\"\n            footer={\n                <View style={styles.footer}>\n                    <Text style={styles.preview} numberOfLines={3}>\n                        {count ? preview : 'Nothing set: the prompt goes as you wrote it.'}\n                    </Text>\n                    {count ? (\n                        <Pressable\n                            onPress={() => onChange({ camera: {}, cinematic: {} })}\n                            style={({ pressed }) => [styles.reset, pressedStyle(pressed)]}\n                            accessibilityRole=\"button\"\n                        >\n                            <MaterialCommunityIcons name=\"restore\" size={14} color={theme.foreground} />\n                            <Text style={styles.resetLabel}>Clear</Text>\n                        </Pressable>\n                    ) : null}\n                </View>\n            }\n        >\n            <Segmented options={TABS} value={tab} onChange={setTab} style={styles.tabs} />\n            {tab === 'camera' ? (\n                <>\n                    <ChipGrid\n                        label=\"Shot size\"\n                        options={labelled(SHOT_SIZES)}\n                        value={camera.shot}\n                        onChange={(v) => setCamera('shot', v)}\n                    />\n                    <ChipGrid\n                        label=\"Move\"\n                        options={labelled(CAMERA_MOVES)}\n                        value={camera.move}\n                        onChange={(v) => setCamera('move', v)}\n                    />\n                    <ChipGrid\n                        label=\"Angle\"\n                        options={labelled(CAMERA_ANGLES)}\n                        value={camera.angle}\n                        onChange={(v) => setCamera('angle', v)}\n                    />\n                    <ChipGrid\n                        label=\"Lens\"\n                        options={FOCAL_LENGTHS.map((f) => ({ id: f.mm, label: f.label }))}\n                        value={camera.lensMm}\n                        onChange={(v) => setCamera('lensMm', v)}\n                    />\n                    <ChipGrid\n                        label=\"Aperture\"\n                        options={labelled(APERTURES)}\n                        value={camera.aperture}\n                        onChange={(v) => setCamera('aperture', v)}\n                    />\n                    <ChipGrid\n                        label=\"Format\"\n                        options={labelled(FILM_STOCKS)}\n                        value={camera.stock}\n                        onChange={(v) => setCamera('stock', v)}\n                    />\n                </>\n            ) : tab === 'film' ? (\n                <>\n                    <ChipGrid\n                        label=\"Genre\"\n                        options={labelled(GENRES)}\n                        value={cinematic.genre}\n                        onChange={(v) => setFilm('genre', v)}\n                        swatch={(id) => {\n                            const g = GENRES.find((o) => o.label === id);\n                            return g ? [g.art.from, g.art.to] : undefined;\n                        }}\n                    />\n                    <ChipGrid\n                        label=\"Era\"\n                        options={labelled(ERAS)}\n                        value={cinematic.era}\n                        onChange={(v) => setFilm('era', v)}\n                        swatch={(id) => {\n                            const e = ERAS.find((o) => o.label === id);\n                            return e ? [e.art.from, e.art.to] : undefined;\n                        }}\n                    />\n                    <ChipGrid\n                        label=\"Tempo\"\n                        options={labelled(TEMPOS)}\n                        value={cinematic.tempo}\n                        onChange={(v) => setFilm('tempo', v)}\n                    />\n                </>\n            ) : (\n                <>\n                    <ChipGrid\n                        label=\"Lighting\"\n                        options={labelled(LIGHTING)}\n                        value={cinematic.lighting}\n                        onChange={(v) => setFilm('lighting', v)}\n                        swatch={(id) => {\n                            const l = LIGHTING.find((o) => o.label === id);\n                            return l ? [l.light.key, l.light.ambient] : undefined;\n                        }}\n                    />\n                    <ChipGrid\n                        label=\"Palette\"\n                        options={labelled(PALETTES)}\n                        value={cinematic.palette}\n                        onChange={(v) => setFilm('palette', v)}\n                        swatch={(id) => {\n                            const p = PALETTES.find((o) => o.label === id);\n                            return p ? [...p.swatches] : undefined;\n                        }}\n                    />\n                </>\n            )}\n        </GeneratorBottomSheet>\n    );\n}\n\n/** The pill that opens the sheet: \"Direct\" when empty, else what is set. */\nexport function DirectorPill({ value, onPress }: { value: Direction; onPress: () => void }) {\n    const theme = useCanvasTheme();\n    const styles = useMemo(() => makeStyles(theme), [theme]);\n    const summary = directionSummary(value);\n    const on = Boolean(summary);\n    return (\n        <Pressable\n            onPress={onPress}\n            style={({ pressed }) => [styles.pill, on && styles.pillOn, pressedStyle(pressed)]}\n            accessibilityRole=\"button\"\n            accessibilityLabel=\"Camera and film direction\"\n        >\n            <MaterialCommunityIcons\n                name=\"movie-open-cog-outline\"\n                size={14}\n                color={on ? theme.background : theme.mutedForeground}\n            />\n            <Text style={[styles.pillLabel, on && styles.pillLabelOn]} numberOfLines={1}>\n                {summary || 'Direct'}\n            </Text>\n        </Pressable>\n    );\n}\n\nconst makeStyles = themedStyles((theme: CanvasPalette) =>\n    StyleSheet.create({\n        tabs: { flexGrow: 0, alignSelf: 'flex-start' },\n        footer: { flexDirection: 'row', alignItems: 'center', gap: SPACE.sm },\n        preview: { ...TYPE.caption, flex: 1, fontWeight: '400', color: theme.mutedForeground },\n        reset: {\n            flexDirection: 'row',\n            alignItems: 'center',\n            gap: SPACE.xs,\n            minHeight: 32,\n            paddingHorizontal: SPACE.md,\n            borderRadius: RADIUS.pill,\n            backgroundColor: theme.card,\n        },\n        resetLabel: { ...TYPE.label, color: theme.foreground },\n        pill: {\n            flexDirection: 'row',\n            alignItems: 'center',\n            gap: SPACE.sm - 2,\n            minHeight: 36,\n            paddingHorizontal: SPACE.md + 2,\n            borderRadius: RADIUS.pill,\n            backgroundColor: theme.card,\n            maxWidth: 220,\n        },\n        pillOn: { backgroundColor: theme.foreground },\n        pillLabel: { ...TYPE.label, flexShrink: 1, color: theme.foreground },\n        pillLabelOn: { color: theme.background },\n    }),\n);\n"],"names":[],"mappings":"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"}

package/lib/features/canvas/generator/ReframePreview.js

@@ -0,0 +1,122 @@
+import {jsxs,jsx}from'react/jsx-runtime';import {useMemo}from'react';import {View,Text,StyleSheet,Image}from'react-native';import {MaterialCommunityIcons}from'@expo/vector-icons';import {useCanvasTheme,themedStyles}from'../canvasTheme.js';import {RADIUS,SPACE,TYPE}from'../canvasUi.js';import {previewOutDims,fitPreview,stackPreviewPanels,pictureBox,previewBarColor}from'./reframeGeometry.js';var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+const PREVIEW_MAX_H = 176;
+const PREVIEW_MAX_W = 300;
+const MATCH_PENDING = "#3a3a40";
+const pct = (part, whole) => `${part / whole * 100}%`;
+function ReframePreview({
+  kind,
+  uri,
+  src,
+  choice
+}) {
+  const theme = useCanvasTheme();
+  const styles = useMemo(() => makeStyles(theme), [theme]);
+  if (!src) return null;
+  const out = previewOutDims(src, choice);
+  if (!out) return null;
+  const size = fitPreview(out, PREVIEW_MAX_W, PREVIEW_MAX_H);
+  const picture = (style, blur) => uri ? /* @__PURE__ */ jsx(Image, { source: {
+    uri
+  }, style: [styles.abs, style], resizeMode: "stretch", blurRadius: blur }) : /* @__PURE__ */ jsx(View, { style: [styles.abs, style, styles.placeholder], children: /* @__PURE__ */ jsx(MaterialCommunityIcons, { name: kind === "video" ? "video-outline" : "image-outline", size: 20, color: "rgba(255,255,255,0.4)" }) });
+  if (kind === "video" && choice.fit === "stack") {
+    const panels = stackPreviewPanels(src, out);
+    if (panels.length) {
+      return /* @__PURE__ */ jsxs(View, { style: styles.wrap, testID: "reframe-preview", accessibilityLabel: "Stack preview", children: [
+        /* @__PURE__ */ jsx(View, { style: [styles.frame, size, {
+          backgroundColor: "#000"
+        }], children: panels.map((p, i) => {
+          const k = p.size.w / p.crop.w;
+          return /* @__PURE__ */ jsx(View, { style: [styles.abs, styles.clip, {
+            left: pct(p.at.x, out.width),
+            top: pct(p.at.y, out.height),
+            width: pct(p.size.w, out.width),
+            height: pct(p.size.h, out.height)
+          }], children: picture({
+            left: pct(-p.crop.x * k, p.size.w),
+            top: pct(-p.crop.y * k, p.size.h),
+            width: pct(src.width * k, p.size.w),
+            height: pct(src.height * k, p.size.h)
+          }) }, `stack-${i}`);
+        }) }),
+        /* @__PURE__ */ jsx(Text, { style: styles.caption, children: "Approximate: the render finds the panels in the footage itself." })
+      ] });
+    }
+  }
+  const fit = choice.fit === "crop" ? "crop" : "fit";
+  const box = pictureBox(src, out, fit, choice.focus);
+  const cover = pictureBox(src, out, "crop");
+  const bar = fit === "fit" ? previewBarColor(kind, choice.bars) : null;
+  const blurBars = fit === "fit" && kind === "video" && choice.bars === "blur";
+  return /* @__PURE__ */ jsxs(View, { style: styles.wrap, testID: "reframe-preview", accessibilityLabel: "Reframe preview", children: [
+    /* @__PURE__ */ jsxs(View, { style: [styles.frame, size, {
+      backgroundColor: bar != null ? bar : blurBars ? "#000" : MATCH_PENDING
+    }], children: [
+      blurBars ? picture({
+        left: pct(cover.x, out.width),
+        top: pct(cover.y, out.height),
+        width: pct(cover.width, out.width),
+        height: pct(cover.height, out.height),
+        opacity: 0.85
+      }, 12) : null,
+      picture({
+        left: pct(box.x, out.width),
+        top: pct(box.y, out.height),
+        width: pct(box.width, out.width),
+        height: pct(box.height, out.height)
+      })
+    ] }),
+    /* @__PURE__ */ jsxs(Text, { style: styles.caption, children: [
+      out.width,
+      " x ",
+      out.height,
+      fit === "fit" && kind === "video" && choice.bars === "match" ? " \xB7 bars take the colour of the frame edges" : ""
+    ] })
+  ] });
+}
+const makeStyles = themedStyles((theme) => StyleSheet.create({
+  wrap: {
+    alignItems: "center",
+    gap: SPACE.xs
+  },
+  frame: {
+    overflow: "hidden",
+    borderRadius: RADIUS.sm,
+    borderWidth: StyleSheet.hairlineWidth,
+    borderColor: theme.borderStrong
+  },
+  abs: {
+    position: "absolute"
+  },
+  clip: {
+    overflow: "hidden"
+  },
+  placeholder: {
+    backgroundColor: "#1c1c20",
+    alignItems: "center",
+    justifyContent: "center"
+  },
+  caption: __spreadProps(__spreadValues({}, TYPE.caption), {
+    fontWeight: "400",
+    fontVariant: ["tabular-nums"],
+    color: theme.mutedForeground,
+    textAlign: "center"
+  })
+}));export{ReframePreview};//# sourceMappingURL=ReframePreview.js.map

package/lib/features/canvas/generator/ReframePreview.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ReframePreview.js","sources":["../../../../src/features/canvas/generator/ReframePreview.tsx"],"sourcesContent":["/**\n * Reframe live preview (native twin of web EditToolPanel ReframePreview): the\n * output frame as a padded View, the picture placed in it as the render will\n * place it. Fit shows the bars (a still's are black or white, a clip's match\n * or blur), crop shows what stays, and for a clip Stack shows the two halves\n * stacked. Image + Views only: no canvas, no WebView.\n */\nimport React, { useMemo } from 'react';\nimport { Image, StyleSheet, Text, View } from 'react-native';\nimport { MaterialCommunityIcons } from '@expo/vector-icons';\nimport { useCanvasTheme, themedStyles, type CanvasPalette } from '../canvasTheme';\nimport { RADIUS, SPACE, TYPE } from '../canvasUi';\nimport type { Dims, ReframeChoice } from '../reframe';\nimport { fitPreview, pictureBox, previewBarColor, previewOutDims, stackPreviewPanels } from './reframeGeometry';\n\nconst PREVIEW_MAX_H = 176;\nconst PREVIEW_MAX_W = 300;\n/** Bars the render samples from the edges; the phone cannot, so it shows a neutral stand-in. */\nconst MATCH_PENDING = '#3a3a40';\n\nconst pct = (part: number, whole: number) => `${(part / whole) * 100}%` as `${number}%`;\n\nexport function ReframePreview({\n    kind,\n    uri,\n    src,\n    choice,\n}: {\n    kind: 'image' | 'video';\n    /** A still of the media: the image itself, or a frame of the clip. Null draws a placeholder. */\n    uri: string | null;\n    src: Dims | null;\n    choice: ReframeChoice;\n}) {\n    const theme = useCanvasTheme();\n    const styles = useMemo(() => makeStyles(theme), [theme]);\n    if (!src) return null;\n    const out = previewOutDims(src, choice);\n    if (!out) return null;\n    const size = fitPreview(out, PREVIEW_MAX_W, PREVIEW_MAX_H);\n    const picture = (style: object, blur?: number) =>\n        uri ? (\n            <Image source={{ uri }} style={[styles.abs, style]} resizeMode=\"stretch\" blurRadius={blur} />\n        ) : (\n            <View style={[styles.abs, style, styles.placeholder]}>\n                <MaterialCommunityIcons\n                    name={kind === 'video' ? 'video-outline' : 'image-outline'}\n                    size={20}\n                    color=\"rgba(255,255,255,0.4)\"\n                />\n            </View>\n        );\n\n    if (kind === 'video' && choice.fit === 'stack') {\n        const panels = stackPreviewPanels(src, out);\n        if (panels.length) {\n            return (\n                <View style={styles.wrap} testID=\"reframe-preview\" accessibilityLabel=\"Stack preview\">\n                    <View style={[styles.frame, size, { backgroundColor: '#000' }]}>\n                        {panels.map((p, i) => {\n                            const k = p.size.w / p.crop.w;\n                            return (\n                                <View\n                                    key={`stack-${i}`}\n                                    style={[\n                                        styles.abs,\n                                        styles.clip,\n                                        {\n                                            left: pct(p.at.x, out.width),\n                                            top: pct(p.at.y, out.height),\n                                            width: pct(p.size.w, out.width),\n                                            height: pct(p.size.h, out.height),\n                                        },\n                                    ]}\n                                >\n                                    {picture({\n                                        left: pct(-p.crop.x * k, p.size.w),\n                                        top: pct(-p.crop.y * k, p.size.h),\n                                        width: pct(src.width * k, p.size.w),\n                                        height: pct(src.height * k, p.size.h),\n                                    })}\n                                </View>\n                            );\n                        })}\n                    </View>\n                    <Text style={styles.caption}>Approximate: the render finds the panels in the footage itself.</Text>\n                </View>\n            );\n        }\n    }\n\n    const fit = choice.fit === 'crop' ? 'crop' : 'fit';\n    const box = pictureBox(src, out, fit, choice.focus);\n    const cover = pictureBox(src, out, 'crop');\n    const bar = fit === 'fit' ? previewBarColor(kind, choice.bars) : null;\n    const blurBars = fit === 'fit' && kind === 'video' && choice.bars === 'blur';\n    return (\n        <View style={styles.wrap} testID=\"reframe-preview\" accessibilityLabel=\"Reframe preview\">\n            <View style={[styles.frame, size, { backgroundColor: bar ?? (blurBars ? '#000' : MATCH_PENDING) }]}>\n                {blurBars\n                    ? picture(\n                          {\n                              left: pct(cover.x, out.width),\n                              top: pct(cover.y, out.height),\n                              width: pct(cover.width, out.width),\n                              height: pct(cover.height, out.height),\n                              opacity: 0.85,\n                          },\n                          12,\n                      )\n                    : null}\n                {picture({\n                    left: pct(box.x, out.width),\n                    top: pct(box.y, out.height),\n                    width: pct(box.width, out.width),\n                    height: pct(box.height, out.height),\n                })}\n            </View>\n            <Text style={styles.caption}>\n                {out.width} x {out.height}\n                {fit === 'fit' && kind === 'video' && choice.bars === 'match'\n                    ? ' · bars take the colour of the frame edges'\n                    : ''}\n            </Text>\n        </View>\n    );\n}\n\nconst makeStyles = themedStyles((theme: CanvasPalette) =>\n    StyleSheet.create({\n        wrap: { alignItems: 'center', gap: SPACE.xs },\n        frame: {\n            overflow: 'hidden',\n            borderRadius: RADIUS.sm,\n            borderWidth: StyleSheet.hairlineWidth,\n            borderColor: theme.borderStrong,\n        },\n        abs: { position: 'absolute' },\n        clip: { overflow: 'hidden' },\n        placeholder: { backgroundColor: '#1c1c20', alignItems: 'center', justifyContent: 'center' },\n        caption: {\n            ...TYPE.caption,\n            fontWeight: '400',\n            fontVariant: ['tabular-nums'],\n            color: theme.mutedForeground,\n            textAlign: 'center',\n        },\n    }),\n);\n"],"names":[],"mappings":"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"}

package/lib/features/canvas/generator/RunLogCard.js

@@ -0,0 +1,119 @@
+import {jsxs,jsx}from'react/jsx-runtime';import {useMemo,useState,useEffect}from'react';import {View,ActivityIndicator,Text,ScrollView,StyleSheet}from'react-native';import {MaterialCommunityIcons}from'@expo/vector-icons';import {useCanvasTheme,themedStyles}from'../canvasTheme.js';import {Pressable,pressedStyle,SPACE,RADIUS,TYPE}from'../canvasUi.js';import {runIsActive,runHeadline,formatWorked}from'./runLog.js';var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+function RunLogCard({
+  run
+}) {
+  var _a;
+  const theme = useCanvasTheme();
+  const styles = useMemo(() => makeStyles(theme), [theme]);
+  const active = runIsActive(run);
+  const [open, setOpen] = useState(false);
+  const [now, setNow] = useState(() => Date.now());
+  useEffect(() => {
+    if (!active) return void 0;
+    setNow(Date.now());
+    const timer = setInterval(() => setNow(Date.now()), 1e3);
+    return () => clearInterval(timer);
+  }, [active]);
+  const last = (_a = run.steps[run.steps.length - 1]) == null ? void 0 : _a.line;
+  const failed = !active && run.error !== void 0;
+  return /* @__PURE__ */ jsxs(View, { style: styles.card, testID: "run-log", children: [
+    /* @__PURE__ */ jsxs(Pressable, { onPress: () => setOpen((v) => !v), style: ({
+      pressed
+    }) => [styles.head, pressedStyle(pressed)], accessibilityRole: "button", accessibilityState: {
+      expanded: open
+    }, children: [
+      active ? /* @__PURE__ */ jsx(ActivityIndicator, { size: "small", color: theme.foreground }) : /* @__PURE__ */ jsx(MaterialCommunityIcons, { name: failed ? "alert-circle-outline" : "check", size: 16, color: failed ? theme.destructiveText : theme.foreground }),
+      /* @__PURE__ */ jsx(Text, { style: styles.headline, children: runHeadline(run, now) }),
+      /* @__PURE__ */ jsx(Text, { style: styles.title, numberOfLines: 1, children: run.title }),
+      /* @__PURE__ */ jsx(MaterialCommunityIcons, { name: open ? "chevron-down" : "chevron-right", size: 16, color: theme.mutedForeground })
+    ] }),
+    open && run.steps.length > 0 ? /* @__PURE__ */ jsx(ScrollView, { style: styles.steps, nestedScrollEnabled: true, children: run.steps.map((step, i) => /* @__PURE__ */ jsxs(View, { style: styles.step, children: [
+      /* @__PURE__ */ jsx(Text, { style: styles.stepAt, children: formatWorked(step.at - run.startedAt) }),
+      /* @__PURE__ */ jsx(Text, { style: styles.stepLine, children: step.line })
+    ] }, `${step.at}-${i}`)) }) : open ? /* @__PURE__ */ jsx(Text, { style: [styles.row, styles.muted], children: "No steps were reported." }) : active && last ? /* @__PURE__ */ jsx(Text, { style: [styles.row, styles.muted], numberOfLines: 1, children: last }) : null,
+    run.summary ? /* @__PURE__ */ jsx(Text, { style: [styles.row, styles.summary], children: run.summary }) : null,
+    run.error !== void 0 ? /* @__PURE__ */ jsx(Text, { style: [styles.row, styles.error], children: run.error }) : null
+  ] });
+}
+const makeStyles = themedStyles((theme) => StyleSheet.create({
+  card: {
+    borderRadius: RADIUS.lg,
+    backgroundColor: theme.card,
+    borderWidth: StyleSheet.hairlineWidth,
+    borderColor: theme.border,
+    overflow: "hidden"
+  },
+  head: {
+    flexDirection: "row",
+    alignItems: "center",
+    gap: SPACE.sm,
+    minHeight: 40,
+    paddingHorizontal: SPACE.md
+  },
+  headline: __spreadProps(__spreadValues({}, TYPE.label), {
+    color: theme.foreground
+  }),
+  title: __spreadProps(__spreadValues({}, TYPE.caption), {
+    flex: 1,
+    fontWeight: "400",
+    color: theme.mutedForeground
+  }),
+  steps: {
+    maxHeight: 176,
+    borderTopWidth: StyleSheet.hairlineWidth,
+    borderTopColor: theme.border,
+    paddingHorizontal: SPACE.md,
+    paddingVertical: SPACE.sm
+  },
+  step: {
+    flexDirection: "row",
+    gap: SPACE.sm,
+    paddingVertical: 2
+  },
+  stepAt: __spreadProps(__spreadValues({}, TYPE.caption), {
+    width: 48,
+    textAlign: "right",
+    fontWeight: "400",
+    fontVariant: ["tabular-nums"],
+    color: theme.mutedForeground
+  }),
+  stepLine: __spreadProps(__spreadValues({}, TYPE.caption), {
+    flex: 1,
+    fontWeight: "400",
+    color: theme.mutedForeground
+  }),
+  row: __spreadProps(__spreadValues({}, TYPE.caption), {
+    fontWeight: "400",
+    borderTopWidth: StyleSheet.hairlineWidth,
+    borderTopColor: theme.border,
+    paddingHorizontal: SPACE.md,
+    paddingVertical: SPACE.sm
+  }),
+  muted: {
+    color: theme.mutedForeground
+  },
+  summary: {
+    color: theme.foreground
+  },
+  error: {
+    color: theme.destructiveText
+  }
+}));export{RunLogCard};//# sourceMappingURL=RunLogCard.js.map

package/lib/features/canvas/generator/RunLogCard.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RunLogCard.js","sources":["../../../../src/features/canvas/generator/RunLogCard.tsx"],"sourcesContent":["/**\n * The receipt for a run (native twin of web `RunLogCard`): \"Worked for 4m 19s\",\n * the steps behind a chevron, and one line of what came out. Live while the run\n * is on (the clock ticks, the latest step shows), then it settles.\n */\nimport React, { useEffect, useMemo, useState } from 'react';\nimport { ActivityIndicator, ScrollView, StyleSheet, Text, View } from 'react-native';\nimport { MaterialCommunityIcons } from '@expo/vector-icons';\nimport { useCanvasTheme, themedStyles, type CanvasPalette } from '../canvasTheme';\nimport { Pressable, RADIUS, SPACE, TYPE, pressedStyle } from '../canvasUi';\nimport { formatWorked, runHeadline, runIsActive, type RunLog } from './runLog';\n\nexport function RunLogCard({ run }: { run: RunLog }) {\n    const theme = useCanvasTheme();\n    const styles = useMemo(() => makeStyles(theme), [theme]);\n    const active = runIsActive(run);\n    const [open, setOpen] = useState(false);\n    const [now, setNow] = useState(() => Date.now());\n\n    useEffect(() => {\n        if (!active) return undefined;\n        setNow(Date.now());\n        const timer = setInterval(() => setNow(Date.now()), 1000);\n        return () => clearInterval(timer);\n    }, [active]);\n\n    const last = run.steps[run.steps.length - 1]?.line;\n    const failed = !active && run.error !== undefined;\n\n    return (\n        <View style={styles.card} testID=\"run-log\">\n            <Pressable\n                onPress={() => setOpen((v) => !v)}\n                style={({ pressed }) => [styles.head, pressedStyle(pressed)]}\n                accessibilityRole=\"button\"\n                accessibilityState={{ expanded: open }}\n            >\n                {active ? (\n                    <ActivityIndicator size=\"small\" color={theme.foreground} />\n                ) : (\n                    <MaterialCommunityIcons\n                        name={failed ? 'alert-circle-outline' : 'check'}\n                        size={16}\n                        color={failed ? theme.destructiveText : theme.foreground}\n                    />\n                )}\n                <Text style={styles.headline}>{runHeadline(run, now)}</Text>\n                <Text style={styles.title} numberOfLines={1}>\n                    {run.title}\n                </Text>\n                <MaterialCommunityIcons\n                    name={open ? 'chevron-down' : 'chevron-right'}\n                    size={16}\n                    color={theme.mutedForeground}\n                />\n            </Pressable>\n\n            {open && run.steps.length > 0 ? (\n                <ScrollView style={styles.steps} nestedScrollEnabled>\n                    {run.steps.map((step, i) => (\n                        <View key={`${step.at}-${i}`} style={styles.step}>\n                            <Text style={styles.stepAt}>{formatWorked(step.at - run.startedAt)}</Text>\n                            <Text style={styles.stepLine}>{step.line}</Text>\n                        </View>\n                    ))}\n                </ScrollView>\n            ) : open ? (\n                <Text style={[styles.row, styles.muted]}>No steps were reported.</Text>\n            ) : active && last ? (\n                <Text style={[styles.row, styles.muted]} numberOfLines={1}>\n                    {last}\n                </Text>\n            ) : null}\n\n            {run.summary ? <Text style={[styles.row, styles.summary]}>{run.summary}</Text> : null}\n            {run.error !== undefined ? <Text style={[styles.row, styles.error]}>{run.error}</Text> : null}\n        </View>\n    );\n}\n\nconst makeStyles = themedStyles((theme: CanvasPalette) =>\n    StyleSheet.create({\n        card: {\n            borderRadius: RADIUS.lg,\n            backgroundColor: theme.card,\n            borderWidth: StyleSheet.hairlineWidth,\n            borderColor: theme.border,\n            overflow: 'hidden',\n        },\n        head: {\n            flexDirection: 'row',\n            alignItems: 'center',\n            gap: SPACE.sm,\n            minHeight: 40,\n            paddingHorizontal: SPACE.md,\n        },\n        headline: { ...TYPE.label, color: theme.foreground },\n        title: { ...TYPE.caption, flex: 1, fontWeight: '400', color: theme.mutedForeground },\n        steps: {\n            maxHeight: 176,\n            borderTopWidth: StyleSheet.hairlineWidth,\n            borderTopColor: theme.border,\n            paddingHorizontal: SPACE.md,\n            paddingVertical: SPACE.sm,\n        },\n        step: { flexDirection: 'row', gap: SPACE.sm, paddingVertical: 2 },\n        stepAt: {\n            ...TYPE.caption,\n            width: 48,\n            textAlign: 'right',\n            fontWeight: '400',\n            fontVariant: ['tabular-nums'],\n            color: theme.mutedForeground,\n        },\n        stepLine: { ...TYPE.caption, flex: 1, fontWeight: '400', color: theme.mutedForeground },\n        row: {\n            ...TYPE.caption,\n            fontWeight: '400',\n            borderTopWidth: StyleSheet.hairlineWidth,\n            borderTopColor: theme.border,\n            paddingHorizontal: SPACE.md,\n            paddingVertical: SPACE.sm,\n        },\n        muted: { color: theme.mutedForeground },\n        summary: { color: theme.foreground },\n        error: { color: theme.destructiveText },\n    }),\n);\n"],"names":[],"mappings":"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"}