This component relies on external JavaScript libraries that must be loaded before any conversion can take place.

1. Open the Screen or Block where you intend to perform the image conversion.

2. Drag the Heic2AnyLoader web block from the widget tree and drop it anywhere on your screen (usually at the bottom or top of the widget tree).

   • Note: This block is invisible at runtime but is required for the Client Actions to function.

How to Use

1. Detecting a HEIC File

Don't rely on file extensions (like .heic), as they can be misleading. Use the built-in detection logic.

1. In your logic flow (e.g., the On Change event of an Upload Widget), verify you have the Binary Data of the file.

2. Call the Client Action IsHEIC.

   • Input: Pass the FileBinaryData.

   • Output: Returns a Boolean (IsHEIC).

   • This action checks the "magic bytes" (file signature) to confirm it is truly a HEIC file.

2. Converting the Image

If IsHEIC returns True, proceed to convert the file to a browser-compatible format (PNG).

1. Call the Client Action ConvertImage.

   • Input: HEICFileBinaryData (Binary Data).

   • Input: Quality (Optional Decimal, 0.0 to 1.0. Default is 0.8).

2. The action will return two Text outputs:

   • ConvertedImage: The full Data URL. Bind this directly to an Image Widget (Type: External URL) for immediate preview.

   • ConvertedImage_PureBase64: The raw Base64 string without headers. Use this if you need to convert back to Binary Data (server-side) for database storage.

Example Flow (Upload & Preview)

1. UI: Add an Upload Widget and an Image Widget.

2. Logic: In the On Change action of the Upload Widget:

3. Step A: Call IsHEIC(Upload1.Content).

4. Step B: Add an If node checking IsHEIC.IsHEIC.

   • True Branch: Call ConvertImage. Assign the output ConvertedImage to your local variable bound to the Image Widget.

   • False Branch: Assign the original content (Upload1.Content) to your local variable (use BinaryToBase64 if using External URL source).