filestack/filestack-js

transform-ui - crop options missing

guillermo-vazquez opened this issue · 3 comments

Related to the transform-ui crop functionality, Only '16/9' option is visible.
Free, circle and square options are missing, for both default and explicit config (radios property).


Screenshot 2024-01-26 at 1 01 42 PM

We were using the below CDN, then we noticed the problem.
https://static.filestackapi.com/transforms-ui/2.x.x/transforms.umd.min.js

Downgrading to below, solved our problem.
https://static.filestackapi.com/transforms-ui/2.0.2/transforms.umd.min.js

The problem seems to be introduced on below.
https://static.filestackapi.com/transforms-ui/2.0.3/transforms.umd.min.js

The problem is visible and reproducible on your own demo page.
https://www.filestack.com/docs/transformations/ui/web/

Expected Behavior

Chop options free, circle, square and '16/9', expected on default or explicit config.

Current Behavior

Chop options free, circle and square are missing.

Possible Solution

Steps to Reproduce (for bugs)

The error is visible and reproducible on your own demo page.
https://www.filestack.com/docs/transformations/ui/web/

Additional Screenshots

transforms-ui/2.0.3

Screenshot 2024-01-26 at 2 14 15 PM

transforms-ui/2.0.2

Screenshot 2024-01-26 at 2 16 27 PM

Context

We got our work around, but anyone using the transform-ui 2.x.x is impacted by this defect.

Your Environment

We were using the below CDN, then we notice that the problem.
https://static.filestackapi.com/transforms-ui/2.x.x/transforms.umd.min.js

Downgrading to below, solved our problem.
https://static.filestackapi.com/transforms-ui/2.0.2/transforms.umd.min.js

The problem seems to be introduced on below.
https://static.filestackapi.com/transforms-ui/2.0.3/transforms.umd.min.js

Downgrade to 2.0.2 is not working for me. The following works:

const tr = new FilestackTransform('API_KEY');

tr.setConfig({
    editor: {
        transforms: {
            ratios: [
                {
                    icon:      'crop_free',
                    // default:   true,
                    // name:      'Custom',
                    // shape:     'rect',
                    // lockRatio: false,
                    isShow:    true,
                },
                {
                    icon:      'panorama_fish_eye',
                    // name:      'Circle',
                    // shape:     'circle',
                    // lockRatio: true,
                    isShow:    true,
                },
                {
                    icon:      'crop_square',
                    // name:      'Square',
                    // shape:     'rect',
                    // ratio:     1,
                    // lockRatio: true,
                    isShow:    true,
                },
                {
                    icon:      'crop_16_9',
                    // name:      '16/9',
                    // shape:     'rect',
                    // ratio:     16/9,
                    // lockRatio: true,
                    isShow:    true,
                },
            ],
        },
    },
});

https://github.com/filestack/filestack-js/assets/266818/dbd69df7-e367-4d9b-892a-595370e9c75e

Showcase

A downgrade to 2.0.2 worked for me.

A downgrade to 2.0.2 worked for me.