feat(web/input): allowCancel option

resource/interface/client/input.lua

@@ -16,10 +16,14 @@ local input
 ---@field step? number
 ---@field description? string
 
+---@class InputDialogOptionsProps
+---@field allowCancel? boolean
+
 ---@param heading string
 ---@param rows string[] | InputDialogRowProps[]
+---@param options InputDialogOptionsProps[]
 ---@return string[] | number[] | boolean[] | nil
-function lib.inputDialog(heading, rows)
+function lib.inputDialog(heading, rows, options)
     if input then return end
     input = promise.new()
 
@@ -35,7 +39,8 @@ function lib.inputDialog(heading, rows)
         action = 'openDialog',
         data = {
             heading = heading,
-            rows = rows
+            rows = rows,
+            options = options
         }
     })
 

web/src/features/dialog/InputDialog.tsx

@@ -15,6 +15,9 @@ import ColorField from './components/fields/color';
 export interface InputProps {
   heading: string;
   rows: Array<IInput | ICheckbox | ISelect | INumber | ISlider | IColorInput>;
+  options?: {
+    allowCancel?: boolean;
+  };
 }
 
 export type FormValues = {
@@ -80,6 +83,7 @@ const InputDialog: React.FC = () => {
         opened={visible}
         onClose={handleClose}
         centered
+        closeOnEscape={fields.options?.allowCancel !== false}
         closeOnClickOutside={false}
         size="xs"
         styles={{ title: { textAlign: 'center', width: '100%', fontSize: 18 } }}
@@ -117,7 +121,13 @@ const InputDialog: React.FC = () => {
               );
             })}
             <Group position="right" spacing={10}>
-              <Button uppercase variant="default" onClick={handleClose} mr={3}>
+              <Button
+                uppercase
+                variant="default"
+                onClick={handleClose}
+                mr={3}
+                disabled={fields.options?.allowCancel === false}
+              >
                 {locale.ui.cancel}
               </Button>
               <Button uppercase variant="light" type="submit">