lee/Recordly
1
0
Fork 0
mirror of https://github.com/webadderallorg/Recordly.git synced 2026-09-24 14:55:37 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat(export): add native aspect ratio option for background-free exports

Browse Source
This commit is contained in:
webadderall
2026-03-14 22:53:01 +11:00
parent 55a65073c7
commit e5e869e654
3 changed files with 39 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/utils/aspectRatioUtils.ts
+13 -5
View File
@@ -1,4 +1,4 @@
export const ASPECT_RATIOS = ['16:9', '9:16', '1:1', '4:3', '4:5', '16:10', '10:16'] as const;
export const ASPECT_RATIOS = ['native', '16:9', '9:16', '1:1', '4:3', '4:5', '16:10', '10:16'] as const;
export type AspectRatio = typeof ASPECT_RATIOS[number];
@@ -7,8 +7,9 @@ export type AspectRatio = typeof ASPECT_RATIOS[number];
* Uses exhaustive type checking to ensure all AspectRatio cases are handled.
* If TypeScript errors here, a new ratio was added to the type but not handled.
*/
export function getAspectRatioValue(aspectRatio: AspectRatio): number {
export function getAspectRatioValue(aspectRatio: AspectRatio, nativeAspectRatio = 16 / 9): number {
switch (aspectRatio) {
case 'native': return nativeAspectRatio > 0 ? nativeAspectRatio : 16 / 9;
case '16:9': return 16 / 9;
case '9:16': return 9 / 16;
case '1:1': return 1;
@@ -26,9 +27,10 @@ export function getAspectRatioValue(aspectRatio: AspectRatio): number {
export function getAspectRatioDimensions(
aspectRatio: AspectRatio,
baseWidth: number
baseWidth: number,
nativeAspectRatio?: number,
): { width: number; height: number } {
const ratio = getAspectRatioValue(aspectRatio);
const ratio = getAspectRatioValue(aspectRatio, nativeAspectRatio);
return {
width: baseWidth,
height: baseWidth / ratio,
@@ -36,11 +38,17 @@ export function getAspectRatioDimensions(
}
export function getAspectRatioLabel(aspectRatio: AspectRatio): string {
if (aspectRatio === 'native') {
return 'Native';
}
return aspectRatio;
}
export function formatAspectRatioForCSS(aspectRatio: AspectRatio): string {
export function formatAspectRatioForCSS(aspectRatio: AspectRatio, nativeAspectRatio = 16 / 9): string {
if (aspectRatio === 'native') {
return `${nativeAspectRatio > 0 ? nativeAspectRatio : 16 / 9}`;
}
return aspectRatio.replace(':', '/');
}