diff --git a/app/client/packages/icons/package.json b/app/client/packages/icons/package.json
index d19fa9bd799..351d24c894f 100644
--- a/app/client/packages/icons/package.json
+++ b/app/client/packages/icons/package.json
@@ -6,11 +6,11 @@
"main": "src/index.ts",
"scripts": {
"build": "yarn cleanup && figmagic && yarn optimize-icons && yarn generate-components && yarn generate-index && yarn generate-stories && yarn prettier . --write --log-level=silent",
- "cleanup": "ts-node ./src/utils/cleanup.ts",
- "optimize-icons": "ts-node ./src/utils/optimizeIcons.ts",
- "generate-components": "ts-node ./src/utils/generateComponents.ts",
- "generate-index": "ts-node ./src/utils/generateIndex.ts",
- "generate-stories": "ts-node ./src/utils/generateStories.ts",
+ "cleanup": "npx ts-node ./src/utils/cleanup.ts",
+ "optimize-icons": "npx ts-node ./src/utils/optimizeIcons.ts",
+ "generate-components": "npx ts-node ./src/utils/generateComponents.ts",
+ "generate-index": "npx ts-node ./src/utils/generateIndex.ts",
+ "generate-stories": "npx ts-node ./src/utils/generateStories.ts",
"lint": "yarn g:lint",
"prettier": "yarn g:prettier"
},
diff --git a/app/client/packages/icons/src/components/Icons/EmailInputIcon.tsx b/app/client/packages/icons/src/components/Icons/EmailInputIcon.tsx
new file mode 100644
index 00000000000..e67d3318303
--- /dev/null
+++ b/app/client/packages/icons/src/components/Icons/EmailInputIcon.tsx
@@ -0,0 +1,2 @@
+import React from "react";
+export const EmailInputIcon = () => ;
diff --git a/app/client/packages/icons/src/components/Icons/InlineButtonsIcon.tsx b/app/client/packages/icons/src/components/Icons/InlineButtonsIcon.tsx
index 83ccec3e0a6..ec89d44edf4 100644
--- a/app/client/packages/icons/src/components/Icons/InlineButtonsIcon.tsx
+++ b/app/client/packages/icons/src/components/Icons/InlineButtonsIcon.tsx
@@ -1,2 +1,2 @@
import React from "react";
-export const InlineButtonsIcon = () => ;
+export const InlineButtonsIcon = () => ;
diff --git a/app/client/packages/icons/src/components/Icons/InputIcon.tsx b/app/client/packages/icons/src/components/Icons/InputIcon.tsx
index fd209ac8da7..586c75fc3ae 100644
--- a/app/client/packages/icons/src/components/Icons/InputIcon.tsx
+++ b/app/client/packages/icons/src/components/Icons/InputIcon.tsx
@@ -1,2 +1,2 @@
import React from "react";
-export const InputIcon = () => ;
+export const InputIcon = () => ;
diff --git a/app/client/packages/icons/src/components/Icons/MultilineInputIcon.tsx b/app/client/packages/icons/src/components/Icons/MultilineInputIcon.tsx
new file mode 100644
index 00000000000..3401be75a15
--- /dev/null
+++ b/app/client/packages/icons/src/components/Icons/MultilineInputIcon.tsx
@@ -0,0 +1,2 @@
+import React from "react";
+export const MultilineInputIcon = () => ;
diff --git a/app/client/packages/icons/src/components/Icons/NumberInputIcon.tsx b/app/client/packages/icons/src/components/Icons/NumberInputIcon.tsx
new file mode 100644
index 00000000000..312eb87ee69
--- /dev/null
+++ b/app/client/packages/icons/src/components/Icons/NumberInputIcon.tsx
@@ -0,0 +1,2 @@
+import React from "react";
+export const NumberInputIcon = () => ;
diff --git a/app/client/packages/icons/src/components/Icons/ParagraphIcon.tsx b/app/client/packages/icons/src/components/Icons/ParagraphIcon.tsx
index fb72170e2af..fd3d7eb0387 100644
--- a/app/client/packages/icons/src/components/Icons/ParagraphIcon.tsx
+++ b/app/client/packages/icons/src/components/Icons/ParagraphIcon.tsx
@@ -1,2 +1,2 @@
import React from "react";
-export const ParagraphIcon = () => ;
+export const ParagraphIcon = () => ;
diff --git a/app/client/packages/icons/src/components/Icons/PasswordInputIcon.tsx b/app/client/packages/icons/src/components/Icons/PasswordInputIcon.tsx
new file mode 100644
index 00000000000..133f72e44a8
--- /dev/null
+++ b/app/client/packages/icons/src/components/Icons/PasswordInputIcon.tsx
@@ -0,0 +1,2 @@
+import React from "react";
+export const PasswordInputIcon = () => ;
diff --git a/app/client/packages/icons/src/components/Icons/ToolbarButtonsIcon.tsx b/app/client/packages/icons/src/components/Icons/ToolbarButtonsIcon.tsx
index 2c1e7aa2a33..2d708cf1564 100644
--- a/app/client/packages/icons/src/components/Icons/ToolbarButtonsIcon.tsx
+++ b/app/client/packages/icons/src/components/Icons/ToolbarButtonsIcon.tsx
@@ -1,2 +1,2 @@
import React from "react";
-export const ToolbarButtonsIcon = () => ;
+export const ToolbarButtonsIcon = () => ;
diff --git a/app/client/packages/icons/src/components/Thumbnails/EmailInputThumbnail.tsx b/app/client/packages/icons/src/components/Thumbnails/EmailInputThumbnail.tsx
new file mode 100644
index 00000000000..aa1f63d557f
--- /dev/null
+++ b/app/client/packages/icons/src/components/Thumbnails/EmailInputThumbnail.tsx
@@ -0,0 +1,2 @@
+import React from "react";
+export const EmailInputThumbnail = () => ;
diff --git a/app/client/packages/icons/src/components/Thumbnails/InlineButtonsThumbnail.tsx b/app/client/packages/icons/src/components/Thumbnails/InlineButtonsThumbnail.tsx
index 435cb6fce61..962f9362bdb 100644
--- a/app/client/packages/icons/src/components/Thumbnails/InlineButtonsThumbnail.tsx
+++ b/app/client/packages/icons/src/components/Thumbnails/InlineButtonsThumbnail.tsx
@@ -1,2 +1,2 @@
import React from "react";
-export const InlineButtonsThumbnail = () => ;
+export const InlineButtonsThumbnail = () => ;
diff --git a/app/client/packages/icons/src/components/Thumbnails/KeyValueThumbnail.tsx b/app/client/packages/icons/src/components/Thumbnails/KeyValueThumbnail.tsx
index 848c466cfcc..75c3eaf36fd 100644
--- a/app/client/packages/icons/src/components/Thumbnails/KeyValueThumbnail.tsx
+++ b/app/client/packages/icons/src/components/Thumbnails/KeyValueThumbnail.tsx
@@ -1,2 +1,2 @@
import React from "react";
-export const KeyValueThumbnail = () => ;
+export const KeyValueThumbnail = () => ;
diff --git a/app/client/packages/icons/src/components/Thumbnails/MultilineInputThumbnail.tsx b/app/client/packages/icons/src/components/Thumbnails/MultilineInputThumbnail.tsx
new file mode 100644
index 00000000000..48552883c82
--- /dev/null
+++ b/app/client/packages/icons/src/components/Thumbnails/MultilineInputThumbnail.tsx
@@ -0,0 +1,2 @@
+import React from "react";
+export const MultilineInputThumbnail = () => ;
diff --git a/app/client/packages/icons/src/components/Thumbnails/NumberInputThumbnail.tsx b/app/client/packages/icons/src/components/Thumbnails/NumberInputThumbnail.tsx
new file mode 100644
index 00000000000..2253ba3a9d8
--- /dev/null
+++ b/app/client/packages/icons/src/components/Thumbnails/NumberInputThumbnail.tsx
@@ -0,0 +1,2 @@
+import React from "react";
+export const NumberInputThumbnail = () => ;
diff --git a/app/client/packages/icons/src/components/Thumbnails/PasswordInputThumbnail.tsx b/app/client/packages/icons/src/components/Thumbnails/PasswordInputThumbnail.tsx
new file mode 100644
index 00000000000..5a96845987b
--- /dev/null
+++ b/app/client/packages/icons/src/components/Thumbnails/PasswordInputThumbnail.tsx
@@ -0,0 +1,2 @@
+import React from "react";
+export const PasswordInputThumbnail = () => ;
diff --git a/app/client/packages/icons/src/components/Thumbnails/SelectThumbnail.tsx b/app/client/packages/icons/src/components/Thumbnails/SelectThumbnail.tsx
new file mode 100644
index 00000000000..ccd690d38e6
--- /dev/null
+++ b/app/client/packages/icons/src/components/Thumbnails/SelectThumbnail.tsx
@@ -0,0 +1,2 @@
+import React from "react";
+export const SelectThumbnail = () => ;
diff --git a/app/client/packages/icons/src/components/Thumbnails/StatsBoxThumbnail.tsx b/app/client/packages/icons/src/components/Thumbnails/StatsBoxThumbnail.tsx
index a0d6fb9df10..cd43593d6bf 100644
--- a/app/client/packages/icons/src/components/Thumbnails/StatsBoxThumbnail.tsx
+++ b/app/client/packages/icons/src/components/Thumbnails/StatsBoxThumbnail.tsx
@@ -1,2 +1,2 @@
import React from "react";
-export const StatsBoxThumbnail = () => ;
+export const StatsBoxThumbnail = () => ;
diff --git a/app/client/packages/icons/src/components/Thumbnails/ToolbarButtonsThumbnail.tsx b/app/client/packages/icons/src/components/Thumbnails/ToolbarButtonsThumbnail.tsx
index d7d2c5f8ea2..ed1c8efdb09 100644
--- a/app/client/packages/icons/src/components/Thumbnails/ToolbarButtonsThumbnail.tsx
+++ b/app/client/packages/icons/src/components/Thumbnails/ToolbarButtonsThumbnail.tsx
@@ -1,2 +1,2 @@
import React from "react";
-export const ToolbarButtonsThumbnail = () => ;
+export const ToolbarButtonsThumbnail = () => ;
diff --git a/app/client/packages/icons/src/icons/Icons/EmailInput.svg b/app/client/packages/icons/src/icons/Icons/EmailInput.svg
new file mode 100644
index 00000000000..bfa99701a0c
--- /dev/null
+++ b/app/client/packages/icons/src/icons/Icons/EmailInput.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/app/client/packages/icons/src/icons/Icons/InlineButtons.svg b/app/client/packages/icons/src/icons/Icons/InlineButtons.svg
index b1a16d021bf..181c56090b7 100644
--- a/app/client/packages/icons/src/icons/Icons/InlineButtons.svg
+++ b/app/client/packages/icons/src/icons/Icons/InlineButtons.svg
@@ -1 +1 @@
-
\ No newline at end of file
+
\ No newline at end of file
diff --git a/app/client/packages/icons/src/icons/Icons/Input.svg b/app/client/packages/icons/src/icons/Icons/Input.svg
index 7b6ecec7559..25374e66620 100644
--- a/app/client/packages/icons/src/icons/Icons/Input.svg
+++ b/app/client/packages/icons/src/icons/Icons/Input.svg
@@ -1 +1 @@
-
\ No newline at end of file
+
\ No newline at end of file
diff --git a/app/client/packages/icons/src/icons/Icons/MultilineInput.svg b/app/client/packages/icons/src/icons/Icons/MultilineInput.svg
new file mode 100644
index 00000000000..8a22e9046ae
--- /dev/null
+++ b/app/client/packages/icons/src/icons/Icons/MultilineInput.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/app/client/packages/icons/src/icons/Icons/NumberInput.svg b/app/client/packages/icons/src/icons/Icons/NumberInput.svg
new file mode 100644
index 00000000000..c7066fe43c1
--- /dev/null
+++ b/app/client/packages/icons/src/icons/Icons/NumberInput.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/app/client/packages/icons/src/icons/Icons/Paragraph.svg b/app/client/packages/icons/src/icons/Icons/Paragraph.svg
index e4db2e49130..a8614fc19f6 100644
--- a/app/client/packages/icons/src/icons/Icons/Paragraph.svg
+++ b/app/client/packages/icons/src/icons/Icons/Paragraph.svg
@@ -1 +1 @@
-
\ No newline at end of file
+
\ No newline at end of file
diff --git a/app/client/packages/icons/src/icons/Icons/PasswordInput.svg b/app/client/packages/icons/src/icons/Icons/PasswordInput.svg
new file mode 100644
index 00000000000..f811fbaf802
--- /dev/null
+++ b/app/client/packages/icons/src/icons/Icons/PasswordInput.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/app/client/packages/icons/src/icons/Icons/ToolbarButtons.svg b/app/client/packages/icons/src/icons/Icons/ToolbarButtons.svg
index aabcb5d2828..6e3d173668d 100644
--- a/app/client/packages/icons/src/icons/Icons/ToolbarButtons.svg
+++ b/app/client/packages/icons/src/icons/Icons/ToolbarButtons.svg
@@ -1 +1 @@
-
\ No newline at end of file
+
\ No newline at end of file
diff --git a/app/client/packages/icons/src/icons/Thumbnails/EmailInput.svg b/app/client/packages/icons/src/icons/Thumbnails/EmailInput.svg
new file mode 100644
index 00000000000..9b9b1ef3aaa
--- /dev/null
+++ b/app/client/packages/icons/src/icons/Thumbnails/EmailInput.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/app/client/packages/icons/src/icons/Thumbnails/InlineButtons.svg b/app/client/packages/icons/src/icons/Thumbnails/InlineButtons.svg
index 2d2eee68265..7b49ab0f6d3 100644
--- a/app/client/packages/icons/src/icons/Thumbnails/InlineButtons.svg
+++ b/app/client/packages/icons/src/icons/Thumbnails/InlineButtons.svg
@@ -1 +1 @@
-
\ No newline at end of file
+
\ No newline at end of file
diff --git a/app/client/packages/icons/src/icons/Thumbnails/KeyValue.svg b/app/client/packages/icons/src/icons/Thumbnails/KeyValue.svg
index 345c0cba411..33bd1718d53 100644
--- a/app/client/packages/icons/src/icons/Thumbnails/KeyValue.svg
+++ b/app/client/packages/icons/src/icons/Thumbnails/KeyValue.svg
@@ -1 +1 @@
-
\ No newline at end of file
+
\ No newline at end of file
diff --git a/app/client/packages/icons/src/icons/Thumbnails/MultilineInput.svg b/app/client/packages/icons/src/icons/Thumbnails/MultilineInput.svg
new file mode 100644
index 00000000000..66589cd1b78
--- /dev/null
+++ b/app/client/packages/icons/src/icons/Thumbnails/MultilineInput.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/app/client/packages/icons/src/icons/Thumbnails/NumberInput.svg b/app/client/packages/icons/src/icons/Thumbnails/NumberInput.svg
new file mode 100644
index 00000000000..ffa9620cfbf
--- /dev/null
+++ b/app/client/packages/icons/src/icons/Thumbnails/NumberInput.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/app/client/packages/icons/src/icons/Thumbnails/PasswordInput.svg b/app/client/packages/icons/src/icons/Thumbnails/PasswordInput.svg
new file mode 100644
index 00000000000..35c869668fb
--- /dev/null
+++ b/app/client/packages/icons/src/icons/Thumbnails/PasswordInput.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/app/client/packages/icons/src/icons/Thumbnails/Select.svg b/app/client/packages/icons/src/icons/Thumbnails/Select.svg
new file mode 100644
index 00000000000..1cc7734f2db
--- /dev/null
+++ b/app/client/packages/icons/src/icons/Thumbnails/Select.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/app/client/packages/icons/src/icons/Thumbnails/StatsBox.svg b/app/client/packages/icons/src/icons/Thumbnails/StatsBox.svg
index 481dd39d8bf..b08a7d7b59c 100644
--- a/app/client/packages/icons/src/icons/Thumbnails/StatsBox.svg
+++ b/app/client/packages/icons/src/icons/Thumbnails/StatsBox.svg
@@ -1 +1 @@
-
\ No newline at end of file
+
\ No newline at end of file
diff --git a/app/client/packages/icons/src/icons/Thumbnails/ToolbarButtons.svg b/app/client/packages/icons/src/icons/Thumbnails/ToolbarButtons.svg
index 324c791c646..11a42e87461 100644
--- a/app/client/packages/icons/src/icons/Thumbnails/ToolbarButtons.svg
+++ b/app/client/packages/icons/src/icons/Thumbnails/ToolbarButtons.svg
@@ -1 +1 @@
-
\ No newline at end of file
+
\ No newline at end of file
diff --git a/app/client/packages/icons/src/index.ts b/app/client/packages/icons/src/index.ts
index 4c2b340d420..dba7f48ff6b 100644
--- a/app/client/packages/icons/src/index.ts
+++ b/app/client/packages/icons/src/index.ts
@@ -2,6 +2,7 @@ export { ButtonThumbnail } from "./components/Thumbnails/ButtonThumbnail";
export { CheckboxGroupThumbnail } from "./components/Thumbnails/CheckboxGroupThumbnail";
export { CheckboxThumbnail } from "./components/Thumbnails/CheckboxThumbnail";
export { CurrencyInputThumbnail } from "./components/Thumbnails/CurrencyInputThumbnail";
+export { EmailInputThumbnail } from "./components/Thumbnails/EmailInputThumbnail";
export { HeadingThumbnail } from "./components/Thumbnails/HeadingThumbnail";
export { IconButtonThumbnail } from "./components/Thumbnails/IconButtonThumbnail";
export { InlineButtonsThumbnail } from "./components/Thumbnails/InlineButtonsThumbnail";
@@ -9,10 +10,14 @@ export { InputThumbnail } from "./components/Thumbnails/InputThumbnail";
export { KeyValueThumbnail } from "./components/Thumbnails/KeyValueThumbnail";
export { MenuButtonThumbnail } from "./components/Thumbnails/MenuButtonThumbnail";
export { ModalThumbnail } from "./components/Thumbnails/ModalThumbnail";
+export { MultilineInputThumbnail } from "./components/Thumbnails/MultilineInputThumbnail";
+export { NumberInputThumbnail } from "./components/Thumbnails/NumberInputThumbnail";
export { ParagraphThumbnail } from "./components/Thumbnails/ParagraphThumbnail";
+export { PasswordInputThumbnail } from "./components/Thumbnails/PasswordInputThumbnail";
export { PhoneInputThumbnail } from "./components/Thumbnails/PhoneInputThumbnail";
export { RadioGroupThumbnail } from "./components/Thumbnails/RadioGroupThumbnail";
export { SectionThumbnail } from "./components/Thumbnails/SectionThumbnail";
+export { SelectThumbnail } from "./components/Thumbnails/SelectThumbnail";
export { StatsBoxThumbnail } from "./components/Thumbnails/StatsBoxThumbnail";
export { SwitchGroupThumbnail } from "./components/Thumbnails/SwitchGroupThumbnail";
export { SwitchThumbnail } from "./components/Thumbnails/SwitchThumbnail";
@@ -23,6 +28,7 @@ export { ButtonIcon } from "./components/Icons/ButtonIcon";
export { CheckboxGroupIcon } from "./components/Icons/CheckboxGroupIcon";
export { CheckboxIcon } from "./components/Icons/CheckboxIcon";
export { CurrencyInputIcon } from "./components/Icons/CurrencyInputIcon";
+export { EmailInputIcon } from "./components/Icons/EmailInputIcon";
export { HeadingIcon } from "./components/Icons/HeadingIcon";
export { IconButtonIcon } from "./components/Icons/IconButtonIcon";
export { InlineButtonsIcon } from "./components/Icons/InlineButtonsIcon";
@@ -30,7 +36,10 @@ export { InputIcon } from "./components/Icons/InputIcon";
export { KeyValueIcon } from "./components/Icons/KeyValueIcon";
export { MenuButtonIcon } from "./components/Icons/MenuButtonIcon";
export { ModalIcon } from "./components/Icons/ModalIcon";
+export { MultilineInputIcon } from "./components/Icons/MultilineInputIcon";
+export { NumberInputIcon } from "./components/Icons/NumberInputIcon";
export { ParagraphIcon } from "./components/Icons/ParagraphIcon";
+export { PasswordInputIcon } from "./components/Icons/PasswordInputIcon";
export { PhoneInputIcon } from "./components/Icons/PhoneInputIcon";
export { RadioGroupIcon } from "./components/Icons/RadioGroupIcon";
export { SectionIcon } from "./components/Icons/SectionIcon";
diff --git a/app/client/packages/icons/src/stories/Icons.mdx b/app/client/packages/icons/src/stories/Icons.mdx
index 1b0b8918ff3..dba05e9f1dd 100644
--- a/app/client/packages/icons/src/stories/Icons.mdx
+++ b/app/client/packages/icons/src/stories/Icons.mdx
@@ -4,6 +4,7 @@ import { ButtonIcon } from "../components/Icons/ButtonIcon";
import { CheckboxGroupIcon } from "../components/Icons/CheckboxGroupIcon";
import { CheckboxIcon } from "../components/Icons/CheckboxIcon";
import { CurrencyInputIcon } from "../components/Icons/CurrencyInputIcon";
+import { EmailInputIcon } from "../components/Icons/EmailInputIcon";
import { HeadingIcon } from "../components/Icons/HeadingIcon";
import { IconButtonIcon } from "../components/Icons/IconButtonIcon";
import { InlineButtonsIcon } from "../components/Icons/InlineButtonsIcon";
@@ -11,7 +12,10 @@ import { InputIcon } from "../components/Icons/InputIcon";
import { KeyValueIcon } from "../components/Icons/KeyValueIcon";
import { MenuButtonIcon } from "../components/Icons/MenuButtonIcon";
import { ModalIcon } from "../components/Icons/ModalIcon";
+import { MultilineInputIcon } from "../components/Icons/MultilineInputIcon";
+import { NumberInputIcon } from "../components/Icons/NumberInputIcon";
import { ParagraphIcon } from "../components/Icons/ParagraphIcon";
+import { PasswordInputIcon } from "../components/Icons/PasswordInputIcon";
import { PhoneInputIcon } from "../components/Icons/PhoneInputIcon";
import { RadioGroupIcon } from "../components/Icons/RadioGroupIcon";
import { SectionIcon } from "../components/Icons/SectionIcon";
@@ -35,6 +39,7 @@ export const Icons = () => {
+
@@ -42,7 +47,10 @@ export const Icons = () => {
+
+
+
diff --git a/app/client/packages/icons/src/stories/Thumbnails.mdx b/app/client/packages/icons/src/stories/Thumbnails.mdx
index be746899971..e3a7a1f9238 100644
--- a/app/client/packages/icons/src/stories/Thumbnails.mdx
+++ b/app/client/packages/icons/src/stories/Thumbnails.mdx
@@ -4,6 +4,7 @@ import { ButtonThumbnail } from "../components/Thumbnails/ButtonThumbnail";
import { CheckboxGroupThumbnail } from "../components/Thumbnails/CheckboxGroupThumbnail";
import { CheckboxThumbnail } from "../components/Thumbnails/CheckboxThumbnail";
import { CurrencyInputThumbnail } from "../components/Thumbnails/CurrencyInputThumbnail";
+import { EmailInputThumbnail } from "../components/Thumbnails/EmailInputThumbnail";
import { HeadingThumbnail } from "../components/Thumbnails/HeadingThumbnail";
import { IconButtonThumbnail } from "../components/Thumbnails/IconButtonThumbnail";
import { InlineButtonsThumbnail } from "../components/Thumbnails/InlineButtonsThumbnail";
@@ -11,10 +12,14 @@ import { InputThumbnail } from "../components/Thumbnails/InputThumbnail";
import { KeyValueThumbnail } from "../components/Thumbnails/KeyValueThumbnail";
import { MenuButtonThumbnail } from "../components/Thumbnails/MenuButtonThumbnail";
import { ModalThumbnail } from "../components/Thumbnails/ModalThumbnail";
+import { MultilineInputThumbnail } from "../components/Thumbnails/MultilineInputThumbnail";
+import { NumberInputThumbnail } from "../components/Thumbnails/NumberInputThumbnail";
import { ParagraphThumbnail } from "../components/Thumbnails/ParagraphThumbnail";
+import { PasswordInputThumbnail } from "../components/Thumbnails/PasswordInputThumbnail";
import { PhoneInputThumbnail } from "../components/Thumbnails/PhoneInputThumbnail";
import { RadioGroupThumbnail } from "../components/Thumbnails/RadioGroupThumbnail";
import { SectionThumbnail } from "../components/Thumbnails/SectionThumbnail";
+import { SelectThumbnail } from "../components/Thumbnails/SelectThumbnail";
import { StatsBoxThumbnail } from "../components/Thumbnails/StatsBoxThumbnail";
import { SwitchGroupThumbnail } from "../components/Thumbnails/SwitchGroupThumbnail";
import { SwitchThumbnail } from "../components/Thumbnails/SwitchThumbnail";
@@ -35,6 +40,7 @@ export const Icons = () => {
+
@@ -42,10 +48,14 @@ export const Icons = () => {
+
+
+
+
diff --git a/app/client/packages/icons/tsconfig.json b/app/client/packages/icons/tsconfig.json
index d31268cb1b2..5adfaa06925 100644
--- a/app/client/packages/icons/tsconfig.json
+++ b/app/client/packages/icons/tsconfig.json
@@ -4,7 +4,8 @@
"ts-node": {
"compilerOptions": {
"module": "commonjs",
- "types": ["node"]
+ "types": ["node"],
+ "verbatimModuleSyntax": false
}
}
}
diff --git a/app/client/src/WidgetProvider/constants.ts b/app/client/src/WidgetProvider/constants.ts
index daf5e58f320..8e9c50c7bca 100644
--- a/app/client/src/WidgetProvider/constants.ts
+++ b/app/client/src/WidgetProvider/constants.ts
@@ -82,6 +82,7 @@ export interface AnvilConfig {
export interface WidgetBaseConfiguration {
name: string;
+ displayOrder?: number;
iconSVG?: string;
thumbnailSVG?: string;
hideCard?: boolean;
diff --git a/app/client/src/WidgetProvider/factory/index.tsx b/app/client/src/WidgetProvider/factory/index.tsx
index b29097283f6..936a0a9fb57 100644
--- a/app/client/src/WidgetProvider/factory/index.tsx
+++ b/app/client/src/WidgetProvider/factory/index.tsx
@@ -129,6 +129,7 @@ class WidgetFactory {
isDeprecated: !!config.isDeprecated,
replacement: config.replacement,
displayName: config.name,
+ displayOrder: config.displayOrder,
key: generateReactKey(),
iconSVG: config.iconSVG,
thumbnailSVG: config.thumbnailSVG,
diff --git a/app/client/src/pages/Editor/utils.tsx b/app/client/src/pages/Editor/utils.tsx
index 35d0df62e59..c2df29c9a38 100644
--- a/app/client/src/pages/Editor/utils.tsx
+++ b/app/client/src/pages/Editor/utils.tsx
@@ -2,7 +2,7 @@ import React from "react";
import ReactDOM from "react-dom";
import { useEffect, useMemo, useState } from "react";
import { useLocation } from "react-router";
-import { debounce, random } from "lodash";
+import { debounce, random, sortBy } from "lodash";
import type {
WidgetCardsGroupedByTags,
WidgetTags,
@@ -40,6 +40,7 @@ import {
EditorViewMode,
} from "ee/entities/IDE/constants";
import { FocusEntity } from "navigation/FocusEntity";
+import { objectKeys } from "@appsmith/utils";
export const draggableElement = (
id: string,
@@ -331,6 +332,15 @@ export const groupWidgetCardsByTags = (widgetCards: WidgetCardProps[]) => {
}
});
+ objectKeys(groupedCards).forEach((tag) => {
+ if (tag === WIDGET_TAGS.SUGGESTED_WIDGETS) return;
+
+ groupedCards[tag] = sortBy(groupedCards[tag], [
+ "displayOrder",
+ "displayName",
+ ]);
+ });
+
return groupedCards;
};
diff --git a/app/client/src/selectors/editorSelectors.tsx b/app/client/src/selectors/editorSelectors.tsx
index d509a48aab6..247cd906b83 100644
--- a/app/client/src/selectors/editorSelectors.tsx
+++ b/app/client/src/selectors/editorSelectors.tsx
@@ -348,6 +348,7 @@ export const getWidgetCards = createSelector(
const {
detachFromLayout = false,
displayName,
+ displayOrder,
iconSVG,
isSearchWildcard,
key,
@@ -375,6 +376,7 @@ export const getWidgetCards = createSelector(
columns,
detachFromLayout,
displayName,
+ displayOrder,
icon: iconSVG,
thumbnail: thumbnailSVG,
IconCmp,
diff --git a/app/client/src/widgets/BaseWidget.tsx b/app/client/src/widgets/BaseWidget.tsx
index df17d804493..3d507769353 100644
--- a/app/client/src/widgets/BaseWidget.tsx
+++ b/app/client/src/widgets/BaseWidget.tsx
@@ -571,6 +571,7 @@ export interface WidgetCardProps {
type: WidgetType;
key?: string;
displayName: string;
+ displayOrder?: number;
icon: string;
thumbnail?: string;
isBeta?: boolean;
diff --git a/app/client/src/widgets/index.ts b/app/client/src/widgets/index.ts
index b6be1c75837..e4f7c3ca0f9 100644
--- a/app/client/src/widgets/index.ts
+++ b/app/client/src/widgets/index.ts
@@ -81,6 +81,10 @@ import { WDSModalWidget } from "./wds/WDSModalWidget";
import { WDSStatsWidget } from "./wds/WDSStatsWidget";
import { WDSKeyValueWidget } from "./wds/WDSKeyValueWidget";
import { WDSInlineButtonsWidget } from "./wds/WDSInlineButtonsWidget";
+import { WDSEmailInputWidget } from "./wds/WDSEmailInputWidget";
+import { WDSPasswordInputWidget } from "./wds/WDSPasswordInputWidget";
+import { WDSNumberInputWidget } from "./wds/WDSNumberInputWidget";
+import { WDSMultilineInputWidget } from "./wds/WDSMultilineInputWidget";
const LegacyWidgets = [
CanvasWidget,
@@ -173,6 +177,10 @@ const WDSWidgets = [
WDSStatsWidget,
WDSKeyValueWidget,
WDSInlineButtonsWidget,
+ WDSEmailInputWidget,
+ WDSPasswordInputWidget,
+ WDSNumberInputWidget,
+ WDSMultilineInputWidget,
];
const Widgets = [
diff --git a/app/client/src/widgets/wds/WDSCurrencyInputWidget/config/propertyPaneConfig/contentConfig.ts b/app/client/src/widgets/wds/WDSCurrencyInputWidget/config/propertyPaneConfig/contentConfig.ts
index c3f2d815371..4df85db375a 100644
--- a/app/client/src/widgets/wds/WDSCurrencyInputWidget/config/propertyPaneConfig/contentConfig.ts
+++ b/app/client/src/widgets/wds/WDSCurrencyInputWidget/config/propertyPaneConfig/contentConfig.ts
@@ -1,11 +1,17 @@
import { CurrencyTypeOptions } from "constants/Currency";
import { ValidationTypes } from "constants/WidgetValidation";
import { AutocompleteDataType } from "utils/autocomplete/AutocompleteDataType";
+import { propertyPaneContentConfig as WdsInputWidgetPropertyPaneContentConfig } from "widgets/wds/WDSInputWidget/config/propertyPaneConfig/contentConfig";
import * as validations from "./validations";
import { countryToFlag } from "../../widget/helpers";
+const inputTypeSectionConfig = WdsInputWidgetPropertyPaneContentConfig.find(
+ (config) => config.sectionName === "Type",
+);
+
export const propertyPaneContentConfig = [
+ inputTypeSectionConfig,
{
sectionName: "Data",
children: [
diff --git a/app/client/src/widgets/wds/WDSEmailInputWidget/index.ts b/app/client/src/widgets/wds/WDSEmailInputWidget/index.ts
new file mode 100644
index 00000000000..11c4b32d1f4
--- /dev/null
+++ b/app/client/src/widgets/wds/WDSEmailInputWidget/index.ts
@@ -0,0 +1,3 @@
+import { WDSEmailInputWidget } from "./widget";
+
+export { WDSEmailInputWidget };
diff --git a/app/client/src/widgets/wds/WDSEmailInputWidget/widget/index.tsx b/app/client/src/widgets/wds/WDSEmailInputWidget/widget/index.tsx
new file mode 100644
index 00000000000..332d42413c7
--- /dev/null
+++ b/app/client/src/widgets/wds/WDSEmailInputWidget/widget/index.tsx
@@ -0,0 +1,36 @@
+import { WDSInputWidget } from "widgets/wds/WDSInputWidget";
+import { EmailInputIcon, EmailInputThumbnail } from "appsmith-icons";
+import { WIDGET_TAGS } from "constants/WidgetConstants";
+import { INPUT_TYPES } from "widgets/wds/WDSInputWidget/constants";
+import type { WidgetBaseConfiguration } from "WidgetProvider/constants";
+
+class WDSEmailInputWidget extends WDSInputWidget {
+ static type = "WDS_EMAIL_INPUT_WIDGET";
+
+ static getConfig(): WidgetBaseConfiguration {
+ return {
+ ...super.getConfig(),
+ displayOrder: undefined,
+ tags: [WIDGET_TAGS.INPUTS],
+ name: "Email Input",
+ };
+ }
+
+ static getDefaults() {
+ return {
+ ...super.getDefaults(),
+ inputType: INPUT_TYPES.EMAIL,
+ widgetName: "EmailInput",
+ };
+ }
+
+ static getMethods() {
+ return {
+ ...super.getMethods(),
+ IconCmp: EmailInputIcon,
+ ThumbnailCmp: EmailInputThumbnail,
+ };
+ }
+}
+
+export { WDSEmailInputWidget };
diff --git a/app/client/src/widgets/wds/WDSInputWidget/config/metaConfig.ts b/app/client/src/widgets/wds/WDSInputWidget/config/metaConfig.ts
index e5b0ab73b13..a62239251e8 100644
--- a/app/client/src/widgets/wds/WDSInputWidget/config/metaConfig.ts
+++ b/app/client/src/widgets/wds/WDSInputWidget/config/metaConfig.ts
@@ -2,6 +2,7 @@ import { WIDGET_TAGS } from "constants/WidgetConstants";
export const metaConfig = {
name: "Input",
+ displayOrder: 1,
tags: [WIDGET_TAGS.SUGGESTED_WIDGETS, WIDGET_TAGS.INPUTS],
needsMeta: true,
searchTags: [
diff --git a/app/client/src/widgets/wds/WDSInputWidget/config/propertyPaneConfig/contentConfig.ts b/app/client/src/widgets/wds/WDSInputWidget/config/propertyPaneConfig/contentConfig.ts
index 6131968e70b..175acb771c0 100644
--- a/app/client/src/widgets/wds/WDSInputWidget/config/propertyPaneConfig/contentConfig.ts
+++ b/app/client/src/widgets/wds/WDSInputWidget/config/propertyPaneConfig/contentConfig.ts
@@ -12,7 +12,7 @@ import type { InputWidgetProps } from "../../widget/types";
export const propertyPaneContentConfig = [
{
- sectionName: "Data",
+ sectionName: "Type",
children: [
{
helpText: "Changes the type of data captured in the input",
@@ -40,12 +40,25 @@ export const propertyPaneContentConfig = [
label: "Email",
value: "EMAIL",
},
+ {
+ label: "Phone number",
+ value: "PHONE_NUMBER",
+ },
+ {
+ label: "Currency",
+ value: "CURRENCY",
+ },
],
isBindProperty: false,
isTriggerProperty: false,
updateHook: inputTypeUpdateHook,
dependencies: ["defaultText"],
},
+ ],
+ },
+ {
+ sectionName: "Data",
+ children: [
{
helpText:
"Sets the default text of the widget. The text is updated if the default text changes",
diff --git a/app/client/src/widgets/wds/WDSInputWidget/constants.ts b/app/client/src/widgets/wds/WDSInputWidget/constants.ts
index 025c99c5725..945c8e0b646 100644
--- a/app/client/src/widgets/wds/WDSInputWidget/constants.ts
+++ b/app/client/src/widgets/wds/WDSInputWidget/constants.ts
@@ -7,3 +7,13 @@ export const INPUT_TYPES = {
PHONE_NUMBER: "PHONE_NUMBER",
MULTI_LINE_TEXT: "MULTI_LINE_TEXT",
} as const;
+
+export const INPUT_TYPE_TO_WIDGET_TYPE_MAP = {
+ [INPUT_TYPES.TEXT]: "WDS_INPUT_WIDGET",
+ [INPUT_TYPES.EMAIL]: "WDS_EMAIL_INPUT_WIDGET",
+ [INPUT_TYPES.NUMBER]: "WDS_NUMBER_INPUT_WIDGET",
+ [INPUT_TYPES.PASSWORD]: "WDS_PASSWORD_INPUT_WIDGET",
+ [INPUT_TYPES.MULTI_LINE_TEXT]: "WDS_MULTILINE_INPUT_WIDGET",
+ [INPUT_TYPES.CURRENCY]: "WDS_CURRENCY_INPUT_WIDGET",
+ [INPUT_TYPES.PHONE_NUMBER]: "WDS_PHONE_INPUT_WIDGET",
+};
diff --git a/app/client/src/widgets/wds/WDSInputWidget/widget/helper.ts b/app/client/src/widgets/wds/WDSInputWidget/widget/helper.ts
index 7154611fbd0..acc3392993d 100644
--- a/app/client/src/widgets/wds/WDSInputWidget/widget/helper.ts
+++ b/app/client/src/widgets/wds/WDSInputWidget/widget/helper.ts
@@ -11,8 +11,11 @@ import {
import type { InputType } from "../component/types";
import type { WidgetProps } from "widgets/BaseWidget";
-import { INPUT_TYPES } from "../constants";
import type { InputWidgetProps, Validation } from "./types";
+import { INPUT_TYPE_TO_WIDGET_TYPE_MAP, INPUT_TYPES } from "../constants";
+import type { PropertyUpdates } from "WidgetProvider/constants";
+import { getDefaultISDCode } from "widgets/wds/WDSPhoneInputWidget/constants";
+import { getDefaultCurrency } from "widgets/wds/WDSCurrencyInputWidget/constants";
/**
* parses text to number if inputType is number
@@ -131,11 +134,9 @@ export const validateInput = (props: InputWidgetProps): Validation => {
export function inputTypeUpdateHook(
props: WidgetProps,
propertyName: string,
- // TODO: Fix this the next time the file is edited
- // eslint-disable-next-line @typescript-eslint/no-explicit-any
- propertyValue: any,
+ propertyValue: InputType,
) {
- const updates = [
+ const updates: PropertyUpdates[] = [
{
propertyPath: propertyName,
propertyValue: propertyValue,
@@ -149,5 +150,35 @@ export function inputTypeUpdateHook(
propertyValue: isInputTypeEmailOrPassword(propertyValue),
});
+ // we will also change the widgetType based on the inputType
+ updates.push({
+ propertyPath: "type",
+ propertyValue: INPUT_TYPE_TO_WIDGET_TYPE_MAP[propertyValue],
+ });
+
+ // in case we are chaging to phone input type & there is no
+ // defaultDiaCode property in the widget, we will default the country code to US
+ if (
+ props.defaultDialCode === undefined &&
+ propertyValue === INPUT_TYPES.PHONE_NUMBER
+ ) {
+ updates.push({
+ propertyPath: "defaultDialCode",
+ propertyValue: getDefaultISDCode().dial_code,
+ });
+ }
+
+ // in case we are changing to currency input type & there is no
+ // defaultCurrency property in the widget, we will default the currency to USD
+ if (
+ props.defaultCurrencyCode === undefined &&
+ propertyValue === INPUT_TYPES.CURRENCY
+ ) {
+ updates.push({
+ propertyPath: "defaultCurrencyCode",
+ propertyValue: getDefaultCurrency().currency,
+ });
+ }
+
return updates;
}
diff --git a/app/client/src/widgets/wds/WDSInputWidget/widget/index.tsx b/app/client/src/widgets/wds/WDSInputWidget/widget/index.tsx
index 8e266721181..71698b222a2 100644
--- a/app/client/src/widgets/wds/WDSInputWidget/widget/index.tsx
+++ b/app/client/src/widgets/wds/WDSInputWidget/widget/index.tsx
@@ -13,11 +13,12 @@ import { WDSBaseInputWidget } from "../../WDSBaseInputWidget";
import type { DerivedPropertiesMap } from "WidgetProvider/factory";
import { EventType } from "constants/AppsmithActionConstants/ActionConstants";
import type { KeyDownEvent } from "widgets/wds/WDSBaseInputWidget/component/types";
+import type { WidgetBaseConfiguration } from "WidgetProvider/constants";
class WDSInputWidget extends WDSBaseInputWidget {
static type = "WDS_INPUT_WIDGET";
- static getConfig() {
+ static getConfig(): WidgetBaseConfiguration {
return config.metaConfig;
}
diff --git a/app/client/src/widgets/wds/WDSKeyValueWidget/widget/index.tsx b/app/client/src/widgets/wds/WDSKeyValueWidget/widget/index.tsx
index 6e1be032329..492a94305d1 100644
--- a/app/client/src/widgets/wds/WDSKeyValueWidget/widget/index.tsx
+++ b/app/client/src/widgets/wds/WDSKeyValueWidget/widget/index.tsx
@@ -1,12 +1,16 @@
+import { WIDGET_TAGS } from "constants/WidgetConstants";
import { WDSInputWidget } from "widgets/wds/WDSInputWidget";
import { KeyValueIcon, KeyValueThumbnail } from "appsmith-icons";
+import type { WidgetBaseConfiguration } from "WidgetProvider/constants";
class WDSKeyValueWidget extends WDSInputWidget {
static type = "WDS_KEY_VALUE_WIDGET";
- static getConfig() {
+ static getConfig(): WidgetBaseConfiguration {
return {
...super.getConfig(),
+ displayOrder: undefined,
+ tags: [WIDGET_TAGS.INPUTS],
name: "KeyValue",
};
}
diff --git a/app/client/src/widgets/wds/WDSMultilineInputWidget/index.ts b/app/client/src/widgets/wds/WDSMultilineInputWidget/index.ts
new file mode 100644
index 00000000000..92291887523
--- /dev/null
+++ b/app/client/src/widgets/wds/WDSMultilineInputWidget/index.ts
@@ -0,0 +1,3 @@
+import { WDSMultilineInputWidget } from "./widget";
+
+export { WDSMultilineInputWidget };
diff --git a/app/client/src/widgets/wds/WDSMultilineInputWidget/widget/index.tsx b/app/client/src/widgets/wds/WDSMultilineInputWidget/widget/index.tsx
new file mode 100644
index 00000000000..d7174375c8b
--- /dev/null
+++ b/app/client/src/widgets/wds/WDSMultilineInputWidget/widget/index.tsx
@@ -0,0 +1,36 @@
+import { WIDGET_TAGS } from "constants/WidgetConstants";
+import { WDSInputWidget } from "widgets/wds/WDSInputWidget";
+import { MultilineInputIcon, MultilineInputThumbnail } from "appsmith-icons";
+import { INPUT_TYPES } from "widgets/wds/WDSInputWidget/constants";
+import type { WidgetBaseConfiguration } from "WidgetProvider/constants";
+
+class WDSMultilineInputWidget extends WDSInputWidget {
+ static type = "WDS_MULTILINE_INPUT_WIDGET";
+
+ static getConfig(): WidgetBaseConfiguration {
+ return {
+ ...super.getConfig(),
+ displayOrder: undefined,
+ tags: [WIDGET_TAGS.INPUTS],
+ name: "Multiline Input",
+ };
+ }
+
+ static getDefaults() {
+ return {
+ ...super.getDefaults(),
+ inputType: INPUT_TYPES.MULTI_LINE_TEXT,
+ widgetName: "MultilineInput",
+ };
+ }
+
+ static getMethods() {
+ return {
+ ...super.getMethods(),
+ IconCmp: MultilineInputIcon,
+ ThumbnailCmp: MultilineInputThumbnail,
+ };
+ }
+}
+
+export { WDSMultilineInputWidget };
diff --git a/app/client/src/widgets/wds/WDSNumberInputWidget/index.ts b/app/client/src/widgets/wds/WDSNumberInputWidget/index.ts
new file mode 100644
index 00000000000..def29a56ac8
--- /dev/null
+++ b/app/client/src/widgets/wds/WDSNumberInputWidget/index.ts
@@ -0,0 +1,3 @@
+import { WDSNumberInputWidget } from "./widget";
+
+export { WDSNumberInputWidget };
diff --git a/app/client/src/widgets/wds/WDSNumberInputWidget/widget/index.tsx b/app/client/src/widgets/wds/WDSNumberInputWidget/widget/index.tsx
new file mode 100644
index 00000000000..f5404cf22d7
--- /dev/null
+++ b/app/client/src/widgets/wds/WDSNumberInputWidget/widget/index.tsx
@@ -0,0 +1,36 @@
+import { WIDGET_TAGS } from "constants/WidgetConstants";
+import { WDSInputWidget } from "widgets/wds/WDSInputWidget";
+import { NumberInputIcon, NumberInputThumbnail } from "appsmith-icons";
+import { INPUT_TYPES } from "widgets/wds/WDSInputWidget/constants";
+import type { WidgetBaseConfiguration } from "WidgetProvider/constants";
+
+class WDSNumberInputWidget extends WDSInputWidget {
+ static type = "WDS_NUMBER_INPUT_WIDGET";
+
+ static getConfig(): WidgetBaseConfiguration {
+ return {
+ ...super.getConfig(),
+ displayOrder: undefined,
+ tags: [WIDGET_TAGS.INPUTS],
+ name: "Number Input",
+ };
+ }
+
+ static getDefaults() {
+ return {
+ ...super.getDefaults(),
+ inputType: INPUT_TYPES.NUMBER,
+ widgetName: "NumberInput",
+ };
+ }
+
+ static getMethods() {
+ return {
+ ...super.getMethods(),
+ IconCmp: NumberInputIcon,
+ ThumbnailCmp: NumberInputThumbnail,
+ };
+ }
+}
+
+export { WDSNumberInputWidget };
diff --git a/app/client/src/widgets/wds/WDSPasswordInputWidget/index.ts b/app/client/src/widgets/wds/WDSPasswordInputWidget/index.ts
new file mode 100644
index 00000000000..01b9eb9090e
--- /dev/null
+++ b/app/client/src/widgets/wds/WDSPasswordInputWidget/index.ts
@@ -0,0 +1,3 @@
+import { WDSPasswordInputWidget } from "./widget";
+
+export { WDSPasswordInputWidget };
diff --git a/app/client/src/widgets/wds/WDSPasswordInputWidget/widget/index.tsx b/app/client/src/widgets/wds/WDSPasswordInputWidget/widget/index.tsx
new file mode 100644
index 00000000000..69b17b523d8
--- /dev/null
+++ b/app/client/src/widgets/wds/WDSPasswordInputWidget/widget/index.tsx
@@ -0,0 +1,36 @@
+import { WIDGET_TAGS } from "constants/WidgetConstants";
+import { WDSInputWidget } from "widgets/wds/WDSInputWidget";
+import { PasswordInputIcon, PasswordInputThumbnail } from "appsmith-icons";
+import { INPUT_TYPES } from "widgets/wds/WDSInputWidget/constants";
+import type { WidgetBaseConfiguration } from "WidgetProvider/constants";
+
+class WDSPasswordInputWidget extends WDSInputWidget {
+ static type = "WDS_PASSWORD_INPUT_WIDGET";
+
+ static getConfig(): WidgetBaseConfiguration {
+ return {
+ ...super.getConfig(),
+ displayOrder: undefined,
+ tags: [WIDGET_TAGS.INPUTS],
+ name: "Password Input",
+ };
+ }
+
+ static getDefaults() {
+ return {
+ ...super.getDefaults(),
+ inputType: INPUT_TYPES.PASSWORD,
+ widgetName: "PasswordInput",
+ };
+ }
+
+ static getMethods() {
+ return {
+ ...super.getMethods(),
+ IconCmp: PasswordInputIcon,
+ ThumbnailCmp: PasswordInputThumbnail,
+ };
+ }
+}
+
+export { WDSPasswordInputWidget };
diff --git a/app/client/src/widgets/wds/WDSPhoneInputWidget/config/propertyPaneConfig/contentConfig.ts b/app/client/src/widgets/wds/WDSPhoneInputWidget/config/propertyPaneConfig/contentConfig.ts
index d019a42fc51..12446c69935 100644
--- a/app/client/src/widgets/wds/WDSPhoneInputWidget/config/propertyPaneConfig/contentConfig.ts
+++ b/app/client/src/widgets/wds/WDSPhoneInputWidget/config/propertyPaneConfig/contentConfig.ts
@@ -2,11 +2,17 @@ import { ISDCodeOptions } from "constants/ISDCodes_v2";
import type { ISDCodeProps } from "constants/ISDCodes_v2";
import { ValidationTypes } from "constants/WidgetValidation";
import { AutocompleteDataType } from "utils/autocomplete/AutocompleteDataType";
+import { propertyPaneContentConfig as WdsInputWidgetPropertyPaneContentConfig } from "widgets/wds/WDSInputWidget/config/propertyPaneConfig/contentConfig";
import { countryToFlag } from "../../widget/helpers";
import { defaultValueValidation } from "./validations";
+const inputTypeSectionConfig = WdsInputWidgetPropertyPaneContentConfig.find(
+ (config) => config.sectionName === "Type",
+);
+
export const propertyPaneContentConfig = [
+ inputTypeSectionConfig,
{
sectionName: "Data",
children: [
diff --git a/app/client/src/widgets/wds/constants.ts b/app/client/src/widgets/wds/constants.ts
index 3f8a0cf326c..a4ac01a32eb 100644
--- a/app/client/src/widgets/wds/constants.ts
+++ b/app/client/src/widgets/wds/constants.ts
@@ -53,6 +53,10 @@ export const WDS_V2_WIDGET_MAP = {
STATBOX_WIDGET: "WDS_STATS_WIDGET",
KEY_VALUE_WIDGET: "WDS_KEY_VALUE_WIDGET",
INLINE_BUTTONS_WIDGET: "WDS_INLINE_BUTTONS_WIDGET",
+ EMAIL_INPUT_WIDGET: "WDS_EMAIL_INPUT_WIDGET",
+ PASSWORD_INPUT_WIDGET: "WDS_PASSWORD_INPUT_WIDGET",
+ NUMBER_INPUT_WIDGET: "WDS_NUMBER_INPUT_WIDGET",
+ MULTILINE_INPUT_WIDGET: "WDS_MULTILINE_INPUT_WIDGET",
// Anvil layout widgets
ZONE_WIDGET: anvilWidgets.ZONE_WIDGET,