@ultraviolet/form 3.13.7 → 3.13.9

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.
@@ -16,7 +16,10 @@ const VerificationCodeField = ({
16
16
  required,
17
17
  type = "number",
18
18
  disabled,
19
- validate
19
+ validate,
20
+ labelDescription,
21
+ success,
22
+ helper
20
23
  }) => {
21
24
  const {
22
25
  getError
@@ -41,20 +44,13 @@ const VerificationCodeField = ({
41
44
  }
42
45
  }
43
46
  });
44
- return /* @__PURE__ */ jsxRuntime.jsxs(ui.Stack, { className, gap: 1, justifyContent: "center", alignItems: "center", direction: "column", "aria-label": "verification-code-field", children: [
45
- label ? /* @__PURE__ */ jsxRuntime.jsx("label", { id: `${id}-label`, htmlFor: `${id}-0`, style: {
46
- cursor: "pointer",
47
- flexShrink: 0
48
- }, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { as: "p", variant: "body", prominence: "strong", children: label }) }) : null,
49
- /* @__PURE__ */ jsxRuntime.jsx(ui.VerificationCode, { inputId: id, error: !!error, placeholder, fields, onChange: (event) => {
50
- onChange?.(event);
51
- field.onChange(event);
52
- }, onComplete: (event) => {
53
- onComplete?.(event);
54
- }, type, disabled, required }),
55
- error ? /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { as: "small", variant: "caption", sentiment: "danger", children: getError({
56
- label: label || "verification-code-field"
57
- }, error) }) : null
58
- ] });
47
+ return /* @__PURE__ */ jsxRuntime.jsx(ui.VerificationCode, { className, inputId: id, placeholder, fields, onChange: (event) => {
48
+ onChange?.(event);
49
+ field.onChange(event);
50
+ }, onComplete: (event) => {
51
+ onComplete?.(event);
52
+ }, type, disabled, required, error: getError({
53
+ label: label || "verification-code-field"
54
+ }, error), label, labelDescription, success, helper });
59
55
  };
60
56
  exports.VerificationCodeField = VerificationCodeField;
@@ -2,11 +2,11 @@ import { VerificationCode } from '@ultraviolet/ui';
2
2
  import type { ComponentProps } from 'react';
3
3
  import type { FieldPath, FieldValues } from 'react-hook-form';
4
4
  import type { BaseFieldProps } from '../../types';
5
- type VerificationCodeFieldProps<TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues>> = BaseFieldProps<TFieldValues, TName> & Partial<Pick<ComponentProps<typeof VerificationCode>, 'disabled' | 'error' | 'fields' | 'initialValue' | 'onChange' | 'onComplete' | 'placeholder' | 'required' | 'type'>> & {
5
+ type VerificationCodeFieldProps<TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues>> = BaseFieldProps<TFieldValues, TName> & Partial<Pick<ComponentProps<typeof VerificationCode>, 'disabled' | 'error' | 'fields' | 'initialValue' | 'onChange' | 'onComplete' | 'placeholder' | 'required' | 'type' | 'labelDescription' | 'success' | 'helper'>> & {
6
6
  className?: string;
7
7
  id?: string;
8
8
  name: string;
9
9
  label?: string;
10
10
  };
11
- export declare const VerificationCodeField: <TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({ className, fields, id, label, name, onChange, onComplete, placeholder, required, type, disabled, validate, }: VerificationCodeFieldProps<TFieldValues, TName>) => import("@emotion/react/jsx-runtime").JSX.Element;
11
+ export declare const VerificationCodeField: <TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({ className, fields, id, label, name, onChange, onComplete, placeholder, required, type, disabled, validate, labelDescription, success, helper, }: VerificationCodeFieldProps<TFieldValues, TName>) => import("@emotion/react/jsx-runtime").JSX.Element;
12
12
  export {};
@@ -1,5 +1,5 @@
1
- import { jsxs, jsx } from "@emotion/react/jsx-runtime";
2
- import { Stack, Text, VerificationCode } from "@ultraviolet/ui";
1
+ import { jsx } from "@emotion/react/jsx-runtime";
2
+ import { VerificationCode } from "@ultraviolet/ui";
3
3
  import { useController } from "react-hook-form";
4
4
  import { useErrors } from "../../providers/ErrorContext/index.js";
5
5
  const VerificationCodeField = ({
@@ -14,7 +14,10 @@ const VerificationCodeField = ({
14
14
  required,
15
15
  type = "number",
16
16
  disabled,
17
- validate
17
+ validate,
18
+ labelDescription,
19
+ success,
20
+ helper
18
21
  }) => {
19
22
  const {
20
23
  getError
@@ -39,21 +42,14 @@ const VerificationCodeField = ({
39
42
  }
40
43
  }
41
44
  });
42
- return /* @__PURE__ */ jsxs(Stack, { className, gap: 1, justifyContent: "center", alignItems: "center", direction: "column", "aria-label": "verification-code-field", children: [
43
- label ? /* @__PURE__ */ jsx("label", { id: `${id}-label`, htmlFor: `${id}-0`, style: {
44
- cursor: "pointer",
45
- flexShrink: 0
46
- }, children: /* @__PURE__ */ jsx(Text, { as: "p", variant: "body", prominence: "strong", children: label }) }) : null,
47
- /* @__PURE__ */ jsx(VerificationCode, { inputId: id, error: !!error, placeholder, fields, onChange: (event) => {
48
- onChange?.(event);
49
- field.onChange(event);
50
- }, onComplete: (event) => {
51
- onComplete?.(event);
52
- }, type, disabled, required }),
53
- error ? /* @__PURE__ */ jsx(Text, { as: "small", variant: "caption", sentiment: "danger", children: getError({
54
- label: label || "verification-code-field"
55
- }, error) }) : null
56
- ] });
45
+ return /* @__PURE__ */ jsx(VerificationCode, { className, inputId: id, placeholder, fields, onChange: (event) => {
46
+ onChange?.(event);
47
+ field.onChange(event);
48
+ }, onComplete: (event) => {
49
+ onComplete?.(event);
50
+ }, type, disabled, required, error: getError({
51
+ label: label || "verification-code-field"
52
+ }, error), label, labelDescription, success, helper });
57
53
  };
58
54
  export {
59
55
  VerificationCodeField
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ultraviolet/form",
3
- "version": "3.13.7",
3
+ "version": "3.13.9",
4
4
  "description": "Ultraviolet Form",
5
5
  "homepage": "https://github.com/scaleway/ultraviolet#readme",
6
6
  "repository": {
@@ -71,8 +71,8 @@
71
71
  "@babel/runtime": "7.26.0",
72
72
  "react-hook-form": "7.54.2",
73
73
  "react-select": "5.8.3",
74
- "@ultraviolet/themes": "1.15.0",
75
- "@ultraviolet/ui": "1.84.0"
74
+ "@ultraviolet/themes": "1.16.0",
75
+ "@ultraviolet/ui": "1.84.2"
76
76
  },
77
77
  "scripts": {
78
78
  "build:profile": "npx vite-bundle-visualizer -c vite.config.ts",