IK-2461 Distort perspective improvements by SwarnimDoegar · Pull Request #8 · imagekit-developer/imagekit-editor

SwarnimDoegar · 2026-02-04T11:12:44Z

No description provided.

ahnv · 2026-02-11T05:20:04Z

@codex review

chatgpt-codex-connector

💡 Codex Review

Here are some automated review suggestions for this pull request.

Reviewed commit: 9e33b570b2

ℹ️ About Codex in GitHub

Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you

Open a pull request for review
Mark a draft as ready
Comment "@codex review".

If Codex has suggestions, it will comment; otherwise it will react with 👍.

Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".

chatgpt-codex-connector · 2026-02-11T05:30:22Z

packages/imagekit-editor-dev/src/schema/index.ts

+) {
+  const { distort, distortType, distortPerspective } = value
+  if (distort && distortType === "perspective" && distortPerspective) {
+    const perspective: PerspectiveObject = structuredClone(distortPerspective)


Replace structuredClone in perspective validation

The new validatePerspectiveDistort path now calls structuredClone before any checks, which will throw in runtimes that do not implement that API (for example older Safari/WebView builds and older Node-based test environments). In those environments, enabling perspective distortion causes validation to crash instead of returning form errors, so users cannot apply the transformation.

Useful? React with 👍 / 👎.

chatgpt-codex-connector · 2026-02-11T05:30:22Z

packages/imagekit-editor-dev/src/components/sidebar/transformation-config-sidebar.tsx

-                          Number(val) > field.fieldProps.max
+                          Number(numSafeVal) > field.fieldProps.max
                        ) {
                          setValue(field.name, field.fieldProps.max)


Keep clamped text-slider values as strings

When a slider value exceeds max, this branch writes a number (field.fieldProps.max) into form state, but distortArcDegree now validates as a string regex. If validation runs before blur normalization (for example via immediate submit/trigger), the resolver reports a type error and blocks applying an otherwise valid clamped value. The min branch already stringifies, so max should be handled consistently.

Useful? React with 👍 / 👎.

Invalid comment

Copilot

Pull request overview

Improves distort-perspective handling and related UI/schema behaviors, including new perspective validation logic and several formatting/typing cleanups across the editor.

Changes:

Added/updated schema handling for distort perspective + arc degree inputs (including support for N-prefixed negatives).
Introduced validatePerspectiveDistort and wired it into schema refinements.
Updated several UI components (slider behavior, zoom defaults, typed error props, lint suppressions) and reformatted code for consistency.

Reviewed changes

Copilot reviewed 18 out of 18 changed files in this pull request and generated 5 comments.

Show a summary per file

File	Description
packages/imagekit-editor-dev/src/schema/transformation.ts	Refactors validators and tightens typings for `refineUnsharpenMask` and optional float preprocessing.
packages/imagekit-editor-dev/src/schema/index.ts	Updates transformation schemas/formatters, adds perspective validation helper, and changes distort arc to slider + string-based schema.
packages/imagekit-editor-dev/src/components/toolbar/toolbar.tsx	Adds Biome suppression comment for non-null assertion on image metadata access.
packages/imagekit-editor-dev/src/components/sidebar/transformation-config-sidebar.tsx	Adds typed error props for custom inputs; updates slider/input handling (incl. `N` negatives) and defaultValue plumbing.
packages/imagekit-editor-dev/src/components/sidebar/sortable-transformation-item.tsx	Formatting-only changes and minor handler cleanup.
packages/imagekit-editor-dev/src/components/header/index.tsx	Adds Biome suppression comments for non-null assertion usage.
packages/imagekit-editor-dev/src/components/editor/ListView.tsx	Adds Biome suppression comment for non-null assertion on image metadata access.
packages/imagekit-editor-dev/src/components/editor/GridView.tsx	Adds Biome suppression comment for non-null assertion on image metadata access.
packages/imagekit-editor-dev/src/components/common/ZoomInput.tsx	Refactors zoom math and hook usage; loosens `defaultValue` typing.
packages/imagekit-editor-dev/src/components/common/RadioCardField.tsx	Uses Chakra `As` typing for icons; adds a11y lint suppression comment.
packages/imagekit-editor-dev/src/components/common/PaddingInput.tsx	Introduces typed error structures and refactors formatting/props; adds a11y lint suppression comments.
packages/imagekit-editor-dev/src/components/common/Hover.tsx	Minor formatting and event listener string normalization.
packages/imagekit-editor-dev/src/components/common/GradientPicker.tsx	Formatting refactor; adds error logging when gradient parsing fails.
packages/imagekit-editor-dev/src/components/common/DistortPerspectiveInput.tsx	Rebuilds perspective input UI and introduces typed errors; normalizes input to uppercase.
packages/imagekit-editor-dev/src/components/common/CornerRadiusInput.tsx	Introduces typed error structures and refactors formatting/props; adds a11y lint suppression comments.
packages/imagekit-editor-dev/src/components/common/ColorPickerField.tsx	Imports `ColorPickerProps` as a type-only import.
packages/imagekit-editor-dev/src/components/common/CheckboxCardField.tsx	Uses Chakra `As` typing for icons; adds a11y lint suppression comments.
packages/imagekit-editor-dev/src/components/RetryableImage.tsx	Adjusts effect dependencies suppression and ref typing; changes `beginLoad(0)` to `beginLoad()`.

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

Copilot · 2026-02-11T09:47:59Z

packages/imagekit-editor-dev/src/components/sidebar/transformation-config-sidebar.tsx

+                        field.fieldProps?.inputType ||
+                        field.fieldProps?.autoOption
+                          ? "text"
+                          : "number"


This ternary condition has incorrect operator precedence: field.fieldProps?.inputType being any non-empty string makes the whole condition truthy, forcing the input type to always be \"text\" even if inputType was intended to be used (e.g., \"number\"). Parenthesize the condition and/or explicitly prioritize inputType (e.g., field.fieldProps?.inputType ?? (field.fieldProps?.autoOption ? \"text\" : \"number\")).

Suggested change

field.fieldProps?.inputType ||

field.fieldProps?.autoOption

? "text"

: "number"

field.fieldProps?.inputType ??

(field.fieldProps?.autoOption ? "text" : "number")

Copilot · 2026-02-11T09:47:59Z

packages/imagekit-editor-dev/src/schema/index.ts

+    const perspective: PerspectiveObject = JSON.parse(JSON.stringify(distortPerspective))
+    const coords = Object.keys(perspective).reduce(
+      (acc, key) => {
+        const value = perspective[key as keyof typeof perspective]
+        if (!value) {
+          acc[key as keyof PerspectiveObject] = value
+        }
+        const numString = value.toUpperCase().replace(/^N/, "-")
+        acc[key as keyof PerspectiveObject] = parseInt(numString as string, 10)
+        return acc
+      },


In the reducer, the if (!value) branch doesn't short-circuit, so empty strings still go through toUpperCase() and parseInt(), producing NaN and overwriting the earlier assignment. If the intent is to allow partial input without validation, you should return acc (or continue-equivalent) when value is empty, and only parse when value is non-empty.

Copilot · 2026-02-11T09:48:00Z

packages/imagekit-editor-dev/src/schema/index.ts

+            distortArcDegree: z
+              .string()
+              .regex(/^[-N]?\d+$/)
+              .optional(),


The previous numeric validation for distortArcDegree enforced a range (e.g., min/max). After switching to a string+regex, the schema no longer prevents out-of-range values like 9999. Consider adding a .refine(...) that parses the value (including N -> negative) and enforces the supported range.

Suggested change

.optional(),

.optional()

.refine(

(val) => {

// Allow undefined due to .optional()

if (val === undefined) {

return true

}

// Handle "N" prefix as an alternative negative sign

const isNNegative = val.startsWith("N")

const isDashNegative = val.startsWith("-")

const unsignedPart = isNNegative || isDashNegative ? val.slice(1) : val

const parsed = Number.parseInt(unsignedPart, 10)

if (Number.isNaN(parsed)) {

return false

}

const signedValue =

isNNegative || isDashNegative ? -parsed : parsed

// Enforce supported range for arc distortion degrees

return signedValue >= -360 && signedValue <= 360

},

{

message:

"distortArcDegree must be between -360 and 360 degrees",

},

),

Copilot · 2026-02-11T09:48:00Z

packages/imagekit-editor-dev/src/components/common/DistortPerspectiveInput.tsx

+
+export type PerspectiveErrors = Record<string, CornerErrors>
+
+type DistorPerspectiveFieldProps = {


Typo in type name: DistorPerspectiveFieldProps should be DistortPerspectiveFieldProps for consistency with DistortPerspectiveInput and to avoid propagating the misspelling across imports/usages.

packages/imagekit-editor-dev/src/components/common/ZoomInput.tsx

Improved distort perspective implementation

4014c00

SwarnimDoegar changed the base branch from main to IK-2461/enhancements February 5, 2026 07:39

SwarnimDoegar and others added 5 commits February 5, 2026 18:36

Merge branch 'IK-2461/enhancements' into IK-2461-improvements

151e4f8

Fix linting issues

50b44b5

Fix type and linting issues

199d437

Fix more linting errors

6f761cd

Fixed formatting issues

9e33b57

chatgpt-codex-connector bot reviewed Feb 11, 2026

View reviewed changes

Do not use structured clone

ae16d31

SwarnimDoegar requested a review from Copilot February 11, 2026 09:46

Copilot AI reviewed Feb 11, 2026

View reviewed changes

SwarnimDoegar added 2 commits February 11, 2026 20:44

Fix formatting

b99e7c9

Move to strict type

2deab3d

hrhv changed the base branch from IK-2461/enhancements to harshit/enhancements February 13, 2026 09:16

hrhv merged commit 0e59f47 into imagekit-developer:harshit/enhancements Feb 13, 2026
1 check passed

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

IK-2461 Distort perspective improvements#8

IK-2461 Distort perspective improvements#8
hrhv merged 9 commits intoimagekit-developer:harshit/enhancementsfrom
SwarnimDoegar:IK-2461-improvements

SwarnimDoegar commented Feb 4, 2026

Uh oh!

ahnv commented Feb 11, 2026

Uh oh!

chatgpt-codex-connector bot left a comment

Uh oh!

chatgpt-codex-connector bot Feb 11, 2026

Uh oh!

SwarnimDoegar Feb 11, 2026

Uh oh!

chatgpt-codex-connector bot Feb 11, 2026

Uh oh!

SwarnimDoegar Feb 11, 2026

Uh oh!

Copilot AI left a comment

Uh oh!

Copilot AI Feb 11, 2026

Uh oh!

Copilot AI Feb 11, 2026

Uh oh!

Copilot AI Feb 11, 2026

Uh oh!

Copilot AI Feb 11, 2026

Uh oh!

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

-              .optional(),
+              .optional()
+              .refine(
+                (val) => {
+                  // Allow undefined due to .optional()
+                  if (val === undefined) {
+                    return true
+                  }
+                  // Handle "N" prefix as an alternative negative sign
+                  const isNNegative = val.startsWith("N")
+                  const isDashNegative = val.startsWith("-")
+                  const unsignedPart = isNNegative || isDashNegative ? val.slice(1) : val
+                  const parsed = Number.parseInt(unsignedPart, 10)
+                  if (Number.isNaN(parsed)) {
+                    return false
+                  }
+                  const signedValue =
+                    isNNegative || isDashNegative ? -parsed : parsed
+                  // Enforce supported range for arc distortion degrees
+                  return signedValue >= -360 && signedValue <= 360
+                },
+                {
+                  message:
+                    "distortArcDegree must be between -360 and 360 degrees",
+                },
+              ),


		export type PerspectiveErrors = Record<string, CornerErrors>

		type DistorPerspectiveFieldProps = {

Conversation

SwarnimDoegar commented Feb 4, 2026

Uh oh!

ahnv commented Feb 11, 2026

Uh oh!

chatgpt-codex-connector bot left a comment

Choose a reason for hiding this comment

💡 Codex Review

Uh oh!

chatgpt-codex-connector bot Feb 11, 2026

Choose a reason for hiding this comment

Uh oh!

SwarnimDoegar Feb 11, 2026

Choose a reason for hiding this comment

Uh oh!

chatgpt-codex-connector bot Feb 11, 2026

Choose a reason for hiding this comment

Uh oh!

SwarnimDoegar Feb 11, 2026

Choose a reason for hiding this comment

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull request overview

Reviewed changes

Uh oh!

Copilot AI Feb 11, 2026

Choose a reason for hiding this comment

Uh oh!

Copilot AI Feb 11, 2026

Choose a reason for hiding this comment

Uh oh!

Copilot AI Feb 11, 2026

Choose a reason for hiding this comment

Uh oh!

Copilot AI Feb 11, 2026

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants