Include spellcheck prop to input

Author: Kubit

src/components/input/input.styled.ts

@@ -176,7 +176,10 @@ export const InputStyled = styled.input<InputStyledProps>`
   }
 
   &:focus-visible {
-    ${inputFocusWidthMixin}
+    ${({ styles, state }) =>
+      styles?.[state]?.focusVisibleCustom
+        ? getStyles(styles?.[state]?.focusVisibleCustom)
+        : inputFocusWidthMixin}
   }
 
   &[data-truncate='true'] {

src/components/input/inputStandAlone.tsx

@@ -105,6 +105,7 @@ const InputStandAloneComponent = (
         required={props.required}
         rightIcon={props.rightIcon}
         role={props.role}
+        spellCheck={props.spellCheck}
         state={state}
         styles={styles}
         type={props.type}

src/components/input/stories/argtypes.ts

@@ -220,6 +220,17 @@ export const argtypes = (variants: IThemeObjectVariants, themeSelected: string):
         category: CATEGORY_CONTROL.MODIFIERS,
       },
     },
+    spellCheck: {
+      description: 'Specifies whether the value of the input should be checked for spelling errors',
+      control: { type: 'boolean' },
+      type: { name: 'boolean' },
+      table: {
+        type: {
+          summary: 'boolean',
+        },
+        category: CATEGORY_CONTROL.MODIFIERS,
+      },
+    },
     inputMode: {
       description: 'inputMode for the input',
       type: { name: 'string' },

src/components/input/types/input.ts

@@ -362,6 +362,7 @@ export type IInputStandAlone = IInputComponents & {
   truncate?: boolean;
   disabledArrowUpDownInputNumber?: boolean;
   placeholder?: string;
+  spellCheck?: boolean;
   autocomplete?: AUTOCOMPLETE_TYPE;
   autoCapitalize?:
     | 'off'