Skip to main content

Documentation Index

Fetch the complete documentation index at: https://autorender.mintlify.app/llms.txt

Use this file to discover all available pages before exploring further.

Installation

npm install @autorender/sdk-core

Features

This package contains:
  • Upload SDK: Core upload functionality
  • ViewTag SDK: Image transformation and responsive image generation

Upload SDK Usage

import { createUploader } from '@autorender/sdk-core';
import '@autorender/sdk-core/styles';

const uploader = createUploader({
  apiKey: 'your-api-key',
  target: '#uploader-container',
  type: 'inline',
  allowMultiple: true,
  onSuccess: ({ files }) => {
    console.log('Uploaded:', files);
  },
});

ViewTag SDK Usage

Basic Setup

import { createAR } from '@autorender/sdk-core';

const AR = createAR({
  baseUrl: 'https://assets.autorender.io',
  workspace: 'ws_123',
});

Generate Image URLs

// Simple URL generation
const url = AR.url('products/shoe.jpg', {
  w: 400,
  h: 400,
  fit: 'cover'
});
// Output: https://assets.autorender.io/ws_123/w_400,h_400,c_fill,f_auto,q_auto/products/shoe.jpg

// Get transformation string only
const transformString = AR.transformString({ w: 300, h: 300, fit: 'cover', q: 70 });
// Output: w_300,h_300,c_fill,q_70

Generate Video URLs

// MP4
const mp4Url = AR.url('docs/skateboarding.mp4', { w: 960, h: 540 });

// HLS master playlist
const hlsUrl = AR.url('st_240_360_480_720/docs/skateboarding.mp4/ar-master.m3u8');

// DASH manifest
const dashUrl = AR.url('processing/docs/skateboarding.mp4/dash/manifest.mpd');

API Reference

createAR(config: CreateARConfig): ARInstance

Creates a new AutoRender client instance for image transformations. Config Options:
  • baseUrl?: string - Base URL (default: 'https://assets.autorender.io')
  • workspace: string - Your workspace ID
  • defaults?: { f?: string, q?: string | number } - Default transformations
  • deviceBreakpoints?: number[] - Device breakpoints for responsive images
  • imageBreakpoints?: number[] - Image breakpoints for responsive images