@cube-dev/ui-kit 0.13.6 → 0.14.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cube-dev/ui-kit",
-  "version": "0.13.6",
+  "version": "0.14.0",
   "description": "UIKit for Cube Projects",
   "keywords": [
     "uikit"
@@ -14,59 +14,59 @@
   },
   "dependencies": {
     "@ant-design/icons": "^4.7.0",
-    "@react-aria/button": "^3.3.4",
-    "@react-aria/checkbox": "^3.3.1",
-    "@react-aria/combobox": "^3.2.1",
-    "@react-aria/dialog": "^3.1.4",
-    "@react-aria/focus": "^3.5.0",
-    "@react-aria/i18n": "^3.3.4",
-    "@react-aria/interactions": "^3.7.0",
-    "@react-aria/listbox": "^3.5.0",
-    "@react-aria/menu": "3.6.1",
-    "@react-aria/numberfield": "^3.1.1",
-    "@react-aria/overlays": "^3.7.5",
-    "@react-aria/radio": "^3.1.6",
-    "@react-aria/searchfield": "^3.2.2",
-    "@react-aria/select": "^3.7.1",
-    "@react-aria/selection": "^3.9.1",
-    "@react-aria/separator": "3.1.6",
-    "@react-aria/slider": "3.2.1",
-    "@react-aria/ssr": "^3.2.0",
-    "@react-aria/switch": "^3.1.3",
-    "@react-aria/textfield": "^3.5.0",
-    "@react-aria/tooltip": "^3.1.3",
-    "@react-aria/utils": "^3.11.0",
-    "@react-aria/visually-hidden": "^3.3.1",
-    "@react-spectrum/utils": "^3.6.3",
-    "@react-stately/checkbox": "^3.1.0",
-    "@react-stately/collections": "^3.3.4",
-    "@react-stately/combobox": "3.0.1",
-    "@react-stately/list": "^3.5.1",
-    "@react-stately/menu": "3.4.1",
-    "@react-stately/numberfield": "^3.0.2",
-    "@react-stately/overlays": "^3.1.6",
-    "@react-stately/radio": "^3.3.2",
-    "@react-stately/searchfield": "^3.1.3",
-    "@react-stately/select": "^3.2.1",
-    "@react-stately/slider": "3.2.1",
-    "@react-stately/toggle": "^3.2.3",
-    "@react-stately/tooltip": "^3.0.8",
-    "@react-stately/tree": "^3.3.1",
-    "@react-stately/utils": "^3.5.0",
-    "@react-types/button": "^3.4.1",
-    "@react-types/checkbox": "^3.2.5",
-    "@react-types/combobox": "^3.2.1",
-    "@react-types/dialog": "^3.3.4",
-    "@react-types/menu": "3.7.1",
-    "@react-types/numberfield": "^3.1.3",
-    "@react-types/overlays": "^3.5.5",
-    "@react-types/radio": "^3.1.2",
-    "@react-types/select": "^3.6.1",
-    "@react-types/shared": "^3.10.1",
-    "@react-types/slider": "3.2.1",
-    "@react-types/switch": "^3.1.2",
-    "@react-types/textfield": "^3.3.0",
-    "@react-types/tooltip": "^3.1.5",
+    "@react-aria/button": "3.6.2",
+    "@react-aria/checkbox": "3.6.0",
+    "@react-aria/combobox": "3.4.2",
+    "@react-aria/dialog": "3.4.0",
+    "@react-aria/focus": "3.9.0",
+    "@react-aria/i18n": "3.6.1",
+    "@react-aria/interactions": "3.12.0",
+    "@react-aria/listbox": "3.7.0",
+    "@react-aria/menu": "3.6.2",
+    "@react-aria/numberfield": "3.3.2",
+    "@react-aria/overlays": "3.11.0",
+    "@react-aria/radio": "3.4.0",
+    "@react-aria/searchfield": "3.4.2",
+    "@react-aria/select": "3.8.2",
+    "@react-aria/selection": "3.11.0",
+    "@react-aria/separator": "3.2.4",
+    "@react-aria/slider": "3.2.2",
+    "@react-aria/ssr": "3.3.0",
+    "@react-aria/switch": "3.2.4",
+    "@react-aria/textfield": "3.7.2",
+    "@react-aria/tooltip": "3.3.2",
+    "@react-aria/utils": "3.14.0",
+    "@react-aria/visually-hidden": "3.5.0",
+    "@react-spectrum/utils": "3.7.4",
+    "@react-stately/checkbox": "3.3.0",
+    "@react-stately/collections": "3.4.4",
+    "@react-stately/combobox": "3.2.2",
+    "@react-stately/list": "3.5.4",
+    "@react-stately/menu": "3.4.2",
+    "@react-stately/numberfield": "3.2.2",
+    "@react-stately/overlays": "3.4.2",
+    "@react-stately/radio": "3.6.0",
+    "@react-stately/searchfield": "3.3.2",
+    "@react-stately/select": "3.3.2",
+    "@react-stately/slider": "3.2.2",
+    "@react-stately/toggle": "3.4.2",
+    "@react-stately/tooltip": "3.2.2",
+    "@react-stately/tree": "3.3.4",
+    "@react-stately/utils": "3.5.1",
+    "@react-types/button": "3.6.2",
+    "@react-types/checkbox": "3.4.0",
+    "@react-types/combobox": "3.5.4",
+    "@react-types/dialog": "3.4.4",
+    "@react-types/menu": "3.7.2",
+    "@react-types/numberfield": "3.3.4",
+    "@react-types/overlays": "3.6.4",
+    "@react-types/radio": "3.3.0",
+    "@react-types/select": "3.6.4",
+    "@react-types/shared": "3.15.0",
+    "@react-types/slider": "3.3.0",
+    "@react-types/switch": "3.2.4",
+    "@react-types/textfield": "3.6.0",
+    "@react-types/tooltip": "3.2.4",
     "clipboard-copy": "^4.0.1",
     "clsx": "^1.1.1",
     "email-validator": "^2.0.4",

package/types/components/forms/Form/Form.d.ts

@@ -11,11 +11,11 @@ export interface CubeFormProps<T extends FieldTypes = FieldTypes> extends FormBa
     name?: string;
     /** Default field values */
     defaultValues?: Partial<T>;
-    /** Trigger when any value of Field changed */
+    /** Trigger when any value of the Field is changed */
     onValuesChange?: CubeFormInstance<T>['onValuesChange'];
-    /** Trigger when form submit and success */
+    /** Trigger on form submit and success */
     onSubmit?: CubeFormInstance<T>['onSubmit'];
-    /** Trigger when form submit and failed */
+    /** Trigger on form submit and failed */
     onSubmitFailed?: (any?: any) => void | Promise<any>;
     /** Set form instance created by useForm */
     form?: CubeFormInstance<T, CubeFormData<T>>;

package/types/components/forms/Form/SubmitError.d.ts

@@ -3,4 +3,4 @@ import { CubeAlertProps } from '../../content/Alert';
 /**
  * An alert that shows a form error message received from the onSubmit callback.
  */
-export declare function SubmitError(props: CubeAlertProps): JSX.Element | null;
+export declare const SubmitError: (props: CubeAlertProps) => JSX.Element | null;

package/types/components/forms/Form/index.d.ts

@@ -13,7 +13,7 @@ declare const Form: (<T extends import("./types").FieldTypes>(props: import("./F
 } & {
     Item: typeof Field;
     useForm: typeof useForm;
-    SubmitError: typeof SubmitError;
+    SubmitError: (props: CubeAlertProps) => JSX.Element | null;
 };
 export { useFormProps, Form, Field, useForm, FormContext, SubmitError };
 export type { CubeFormProps } from './Form';

package/types/components/forms/Form/useForm.d.ts

@@ -9,7 +9,7 @@ export declare class CubeFormInstance<T extends FieldTypes, TFormData extends Cu
     private fields;
     ref: {};
     isSubmitting: boolean;
-    submitError: ReactNode;
+    submitError: unknown;
     onValuesChange: (data: T) => void | Promise<void>;
     onSubmit: (data: T) => void | Promise<void>;
     constructor(forceReRender?: () => void);

package/types/test/render.d.ts

@@ -1,4 +1,64 @@
 import React from 'react';
 import { RenderOptions } from '@testing-library/react';
+import { CubeFormInstance, CubeFormProps } from '../components/forms';
 export declare function renderWithRoot(ui: React.ReactElement, options?: Omit<RenderOptions, 'queries' | 'wrapper'>): import("@testing-library/react").RenderResult<typeof import("@testing-library/dom/types/queries"), HTMLElement>;
+export declare function renderWithForm(ui: React.ReactElement, options?: Omit<RenderOptions, 'queries' | 'wrapper'> & {
+    formProps?: Partial<Omit<CubeFormProps, 'form'>>;
+}): {
+    readonly formInstance: CubeFormInstance<any, import("../components/forms/Form/useForm").CubeFormData<any>>;
+    readonly container: HTMLElement;
+    readonly baseElement: Element;
+    readonly debug: (baseElement?: Element | DocumentFragment | (Element | DocumentFragment)[] | undefined, maxLength?: number | undefined, options?: import("pretty-format").PrettyFormatOptions | undefined) => void;
+    readonly rerender: (ui: React.ReactElement<any, string | React.JSXElementConstructor<any>>) => void;
+    readonly unmount: () => void;
+    readonly asFragment: () => DocumentFragment;
+    readonly getByLabelText: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").SelectorMatcherOptions | undefined) => HTMLElement;
+    readonly getAllByLabelText: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").SelectorMatcherOptions | undefined) => HTMLElement[];
+    readonly queryByLabelText: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").SelectorMatcherOptions | undefined) => HTMLElement | null;
+    readonly queryAllByLabelText: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").SelectorMatcherOptions | undefined) => HTMLElement[];
+    readonly findByLabelText: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").SelectorMatcherOptions | undefined, waitForElementOptions?: import("@testing-library/react").waitForOptions | undefined) => Promise<HTMLElement>;
+    readonly findAllByLabelText: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").SelectorMatcherOptions | undefined, waitForElementOptions?: import("@testing-library/react").waitForOptions | undefined) => Promise<HTMLElement[]>;
+    readonly getByPlaceholderText: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined) => HTMLElement;
+    readonly getAllByPlaceholderText: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined) => HTMLElement[];
+    readonly queryByPlaceholderText: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined) => HTMLElement | null;
+    readonly queryAllByPlaceholderText: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined) => HTMLElement[];
+    readonly findByPlaceholderText: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined, waitForElementOptions?: import("@testing-library/react").waitForOptions | undefined) => Promise<HTMLElement>;
+    readonly findAllByPlaceholderText: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined, waitForElementOptions?: import("@testing-library/react").waitForOptions | undefined) => Promise<HTMLElement[]>;
+    readonly getByText: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").SelectorMatcherOptions | undefined) => HTMLElement;
+    readonly getAllByText: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").SelectorMatcherOptions | undefined) => HTMLElement[];
+    readonly queryByText: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").SelectorMatcherOptions | undefined) => HTMLElement | null;
+    readonly queryAllByText: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").SelectorMatcherOptions | undefined) => HTMLElement[];
+    readonly findByText: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").SelectorMatcherOptions | undefined, waitForElementOptions?: import("@testing-library/react").waitForOptions | undefined) => Promise<HTMLElement>;
+    readonly findAllByText: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").SelectorMatcherOptions | undefined, waitForElementOptions?: import("@testing-library/react").waitForOptions | undefined) => Promise<HTMLElement[]>;
+    readonly getByAltText: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined) => HTMLElement;
+    readonly getAllByAltText: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined) => HTMLElement[];
+    readonly queryByAltText: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined) => HTMLElement | null;
+    readonly queryAllByAltText: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined) => HTMLElement[];
+    readonly findByAltText: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined, waitForElementOptions?: import("@testing-library/react").waitForOptions | undefined) => Promise<HTMLElement>;
+    readonly findAllByAltText: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined, waitForElementOptions?: import("@testing-library/react").waitForOptions | undefined) => Promise<HTMLElement[]>;
+    readonly getByTitle: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined) => HTMLElement;
+    readonly getAllByTitle: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined) => HTMLElement[];
+    readonly queryByTitle: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined) => HTMLElement | null;
+    readonly queryAllByTitle: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined) => HTMLElement[];
+    readonly findByTitle: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined, waitForElementOptions?: import("@testing-library/react").waitForOptions | undefined) => Promise<HTMLElement>;
+    readonly findAllByTitle: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined, waitForElementOptions?: import("@testing-library/react").waitForOptions | undefined) => Promise<HTMLElement[]>;
+    readonly getByDisplayValue: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined) => HTMLElement;
+    readonly getAllByDisplayValue: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined) => HTMLElement[];
+    readonly queryByDisplayValue: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined) => HTMLElement | null;
+    readonly queryAllByDisplayValue: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined) => HTMLElement[];
+    readonly findByDisplayValue: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined, waitForElementOptions?: import("@testing-library/react").waitForOptions | undefined) => Promise<HTMLElement>;
+    readonly findAllByDisplayValue: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined, waitForElementOptions?: import("@testing-library/react").waitForOptions | undefined) => Promise<HTMLElement[]>;
+    readonly getByRole: (role: import("@testing-library/react").ByRoleMatcher, options?: import("@testing-library/react").ByRoleOptions | undefined) => HTMLElement;
+    readonly getAllByRole: (role: import("@testing-library/react").ByRoleMatcher, options?: import("@testing-library/react").ByRoleOptions | undefined) => HTMLElement[];
+    readonly queryByRole: (role: import("@testing-library/react").ByRoleMatcher, options?: import("@testing-library/react").ByRoleOptions | undefined) => HTMLElement | null;
+    readonly queryAllByRole: (role: import("@testing-library/react").ByRoleMatcher, options?: import("@testing-library/react").ByRoleOptions | undefined) => HTMLElement[];
+    readonly findByRole: (role: import("@testing-library/react").ByRoleMatcher, options?: import("@testing-library/react").ByRoleOptions | undefined, waitForElementOptions?: import("@testing-library/react").waitForOptions | undefined) => Promise<HTMLElement>;
+    readonly findAllByRole: (role: import("@testing-library/react").ByRoleMatcher, options?: import("@testing-library/react").ByRoleOptions | undefined, waitForElementOptions?: import("@testing-library/react").waitForOptions | undefined) => Promise<HTMLElement[]>;
+    readonly getByTestId: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined) => HTMLElement;
+    readonly getAllByTestId: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined) => HTMLElement[];
+    readonly queryByTestId: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined) => HTMLElement | null;
+    readonly queryAllByTestId: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined) => HTMLElement[];
+    readonly findByTestId: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined, waitForElementOptions?: import("@testing-library/react").waitForOptions | undefined) => Promise<HTMLElement>;
+    readonly findAllByTestId: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined, waitForElementOptions?: import("@testing-library/react").waitForOptions | undefined) => Promise<HTMLElement[]>;
+};
 export * from '@testing-library/react';