@ultraviolet/form 3.17.7 → 4.0.0-beta.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -8,7 +8,7 @@ It is using [React Hook Form](https://react-hook-form.com/) under the hood.
8
8
  ## Get Started
9
9
 
10
10
  ```sh
11
- $ pnpm add @ultraviolet/form @emotion/react @emotion/styled
11
+ $ pnpm add @ultraviolet/ui @ultraviolet/form @emotion/react @emotion/styled
12
12
  ```
13
13
 
14
14
  ### Usage
@@ -2,6 +2,7 @@
2
2
  "use strict";
3
3
  Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
4
4
  const jsxRuntime = require("@emotion/react/jsx-runtime");
5
+ const icons = require("@ultraviolet/icons");
5
6
  const ui = require("@ultraviolet/ui");
6
7
  const reactHookForm = require("react-hook-form");
7
8
  const index = require("../TextInputFieldV2/index.cjs");
@@ -28,13 +29,12 @@ const KeyValueField = ({
28
29
  fields.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx(ui.Stack, { gap: 3, children: fields.map((field, index$1) => /* @__PURE__ */ jsxRuntime.jsxs(ui.Row, { templateColumns: "1fr 1fr auto", gap: 2, alignItems: "end", children: [
29
30
  /* @__PURE__ */ jsxRuntime.jsx(index.TextInputField, { readOnly, required: inputKey.required, name: `${name}.${index$1}.key`, label: inputKey.label, regex: inputKey.regex }),
30
31
  /* @__PURE__ */ jsxRuntime.jsx(index.TextInputField, { readOnly, required: inputValue.required, name: `${name}.${index$1}.value`, label: inputValue.label, placeholder: inputValue.placeholder, type: inputValue.type, autoComplete: "off", regex: inputValue.regex }),
31
- /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { disabled: readOnly, "data-testid": `remove-button-${index$1}`, icon: "delete", variant: "outlined", sentiment: "danger", size: "large", onClick: () => remove(index$1) })
32
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { disabled: readOnly, "data-testid": `remove-button-${index$1}`, variant: "outlined", sentiment: "danger", size: "large", onClick: () => remove(index$1), children: /* @__PURE__ */ jsxRuntime.jsx(icons.DeleteIcon, {}) })
32
33
  ] }, field.id)) }) : null,
33
- /* @__PURE__ */ jsxRuntime.jsx(ui.Stack, { direction: "row", justifyContent: "flex-start", children: /* @__PURE__ */ jsxRuntime.jsx(
34
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Stack, { direction: "row", justifyContent: "flex-start", children: /* @__PURE__ */ jsxRuntime.jsxs(
34
35
  ui.Button,
35
36
  {
36
37
  "data-testid": "add-button",
37
- icon: "plus",
38
38
  variant: "outlined",
39
39
  sentiment: "primary",
40
40
  fullWidth: addButton.fullWidth,
@@ -44,7 +44,10 @@ const KeyValueField = ({
44
44
  key: "",
45
45
  value: ""
46
46
  }),
47
- children: addButton.name
47
+ children: [
48
+ /* @__PURE__ */ jsxRuntime.jsx(icons.PlusIcon, {}),
49
+ addButton.name
50
+ ]
48
51
  }
49
52
  ) })
50
53
  ] });
@@ -1,5 +1,6 @@
1
1
  "use client";
2
2
  import { jsxs, jsx } from "@emotion/react/jsx-runtime";
3
+ import { DeleteIcon, PlusIcon } from "@ultraviolet/icons";
3
4
  import { Stack, Row, Button } from "@ultraviolet/ui";
4
5
  import { useFieldArray } from "react-hook-form";
5
6
  import { TextInputField } from "../TextInputFieldV2/index.js";
@@ -26,13 +27,12 @@ const KeyValueField = ({
26
27
  fields.length > 0 ? /* @__PURE__ */ jsx(Stack, { gap: 3, children: fields.map((field, index) => /* @__PURE__ */ jsxs(Row, { templateColumns: "1fr 1fr auto", gap: 2, alignItems: "end", children: [
27
28
  /* @__PURE__ */ jsx(TextInputField, { readOnly, required: inputKey.required, name: `${name}.${index}.key`, label: inputKey.label, regex: inputKey.regex }),
28
29
  /* @__PURE__ */ jsx(TextInputField, { readOnly, required: inputValue.required, name: `${name}.${index}.value`, label: inputValue.label, placeholder: inputValue.placeholder, type: inputValue.type, autoComplete: "off", regex: inputValue.regex }),
29
- /* @__PURE__ */ jsx(Button, { disabled: readOnly, "data-testid": `remove-button-${index}`, icon: "delete", variant: "outlined", sentiment: "danger", size: "large", onClick: () => remove(index) })
30
+ /* @__PURE__ */ jsx(Button, { disabled: readOnly, "data-testid": `remove-button-${index}`, variant: "outlined", sentiment: "danger", size: "large", onClick: () => remove(index), children: /* @__PURE__ */ jsx(DeleteIcon, {}) })
30
31
  ] }, field.id)) }) : null,
31
- /* @__PURE__ */ jsx(Stack, { direction: "row", justifyContent: "flex-start", children: /* @__PURE__ */ jsx(
32
+ /* @__PURE__ */ jsx(Stack, { direction: "row", justifyContent: "flex-start", children: /* @__PURE__ */ jsxs(
32
33
  Button,
33
34
  {
34
35
  "data-testid": "add-button",
35
- icon: "plus",
36
36
  variant: "outlined",
37
37
  sentiment: "primary",
38
38
  fullWidth: addButton.fullWidth,
@@ -42,7 +42,10 @@ const KeyValueField = ({
42
42
  key: "",
43
43
  value: ""
44
44
  }),
45
- children: addButton.name
45
+ children: [
46
+ /* @__PURE__ */ jsx(PlusIcon, {}),
47
+ addButton.name
48
+ ]
46
49
  }
47
50
  ) })
48
51
  ] });
@@ -8,8 +8,6 @@ const Submit = ({
8
8
  children,
9
9
  className,
10
10
  disabled = false,
11
- icon,
12
- iconPosition,
13
11
  size,
14
12
  variant = "filled",
15
13
  sentiment = "primary",
@@ -22,6 +20,6 @@ const Submit = ({
22
20
  isValid
23
21
  } = reactHookForm.useFormState();
24
22
  const isDisabled = disabled || isSubmitting || !isValid;
25
- return /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { className, disabled: isDisabled, icon, iconPosition, isLoading: isSubmitting, size, type: "submit", variant, sentiment, tooltip, fullWidth, onClick, children });
23
+ return /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { className, disabled: isDisabled, isLoading: isSubmitting, size, type: "submit", variant, sentiment, tooltip, fullWidth, onClick, children });
26
24
  };
27
25
  exports.Submit = Submit;
@@ -4,8 +4,6 @@ type SubmitProps = {
4
4
  children?: ReactNode;
5
5
  className?: string;
6
6
  disabled?: boolean;
7
- icon?: ComponentProps<typeof Button>['icon'];
8
- iconPosition?: ComponentProps<typeof Button>['iconPosition'];
9
7
  size?: ComponentProps<typeof Button>['size'];
10
8
  variant?: ComponentProps<typeof Button>['variant'];
11
9
  sentiment?: ComponentProps<typeof Button>['sentiment'];
@@ -13,5 +11,5 @@ type SubmitProps = {
13
11
  fullWidth?: ComponentProps<typeof Button>['fullWidth'];
14
12
  onClick?: ComponentProps<typeof Button>['onClick'];
15
13
  };
16
- export declare const Submit: ({ children, className, disabled, icon, iconPosition, size, variant, sentiment, tooltip, fullWidth, onClick, }: SubmitProps) => import("@emotion/react/jsx-runtime").JSX.Element;
14
+ export declare const Submit: ({ children, className, disabled, size, variant, sentiment, tooltip, fullWidth, onClick, }: SubmitProps) => import("@emotion/react/jsx-runtime").JSX.Element;
17
15
  export {};
@@ -6,8 +6,6 @@ const Submit = ({
6
6
  children,
7
7
  className,
8
8
  disabled = false,
9
- icon,
10
- iconPosition,
11
9
  size,
12
10
  variant = "filled",
13
11
  sentiment = "primary",
@@ -20,7 +18,7 @@ const Submit = ({
20
18
  isValid
21
19
  } = useFormState();
22
20
  const isDisabled = disabled || isSubmitting || !isValid;
23
- return /* @__PURE__ */ jsx(Button, { className, disabled: isDisabled, icon, iconPosition, isLoading: isSubmitting, size, type: "submit", variant, sentiment, tooltip, fullWidth, onClick, children });
21
+ return /* @__PURE__ */ jsx(Button, { className, disabled: isDisabled, isLoading: isSubmitting, size, type: "submit", variant, sentiment, tooltip, fullWidth, onClick, children });
24
22
  };
25
23
  export {
26
24
  Submit
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ultraviolet/form",
3
- "version": "3.17.7",
3
+ "version": "4.0.0-beta.1",
4
4
  "description": "Ultraviolet Form",
5
5
  "homepage": "https://github.com/scaleway/ultraviolet#readme",
6
6
  "repository": {
@@ -54,7 +54,8 @@
54
54
  "@emotion/react": "11.14.0",
55
55
  "@emotion/styled": "11.14.0",
56
56
  "react": "18.x || 19.x",
57
- "react-dom": "18.x || 19.x"
57
+ "react-dom": "18.x || 19.x",
58
+ "@ultraviolet/ui": "2.0.0-beta.1"
58
59
  },
59
60
  "devDependencies": {
60
61
  "@babel/core": "7.26.10",
@@ -65,14 +66,15 @@
65
66
  "@types/react-dom": "19.0.4",
66
67
  "react": "19.0.0",
67
68
  "react-dom": "19.0.0",
69
+ "@ultraviolet/ui": "2.0.0-beta.1",
68
70
  "@utils/test": "0.0.1"
69
71
  },
70
72
  "dependencies": {
71
73
  "@babel/runtime": "7.27.1",
72
74
  "react-hook-form": "7.55.0",
73
75
  "react-select": "5.10.0",
74
- "@ultraviolet/ui": "1.95.4",
75
- "@ultraviolet/themes": "1.17.0"
76
+ "@ultraviolet/icons": "4.0.0-beta.1",
77
+ "@ultraviolet/themes": "2.0.0-beta.0"
76
78
  },
77
79
  "scripts": {
78
80
  "build:profile": "npx vite-bundle-visualizer -c vite.config.ts",