@cube-dev/ui-kit 0.7.6 → 0.7.10

Sign up to get free protection for your applications and to get access to all the features.
Files changed (49) hide show
  1. package/dist/cjs/components/Root.d.ts +4 -0
  2. package/dist/cjs/components/forms/Checkbox/Checkbox.d.ts +8 -2
  3. package/dist/cjs/components/forms/Checkbox/CheckboxGroup.d.ts +4 -1
  4. package/dist/cjs/components/forms/FieldWrapper.d.ts +7 -1
  5. package/dist/cjs/components/forms/Form/Field.d.ts +2 -0
  6. package/dist/cjs/components/forms/Form/Form.d.ts +3 -0
  7. package/dist/cjs/components/forms/NumberInput/NumberInput.d.ts +6 -1
  8. package/dist/cjs/components/forms/PasswordInput/PasswordInput.d.ts +4 -1
  9. package/dist/cjs/components/forms/RadioGroup/Radio.d.ts +4 -1
  10. package/dist/cjs/components/forms/RadioGroup/RadioGroup.d.ts +11 -1
  11. package/dist/cjs/components/forms/SearchInput/SearchInput.d.ts +4 -1
  12. package/dist/cjs/components/forms/Switch/Switch.d.ts +4 -1
  13. package/dist/cjs/components/forms/TextArea/TextArea.d.ts +4 -1
  14. package/dist/cjs/components/forms/TextInput/TextInput.d.ts +4 -1
  15. package/dist/cjs/components/forms/TextInput/TextInputBase.d.ts +1 -0
  16. package/dist/cjs/index.d.ts +20 -5
  17. package/dist/cjs/index.js +6 -6
  18. package/dist/cjs/index.js.map +1 -1
  19. package/dist/cjs/shared/form.d.ts +4 -2
  20. package/dist/cjs/stories/FormFieldArgs.d.ts +6 -0
  21. package/dist/cjs/styles/styledScrollbar.d.ts +0 -25
  22. package/dist/cjs/tokens.d.ts +7 -0
  23. package/dist/cjs/utils/react/nullableValue.d.ts +18 -0
  24. package/dist/cjs/utils/warnings.d.ts +2 -0
  25. package/dist/mjs/components/Root.d.ts +4 -0
  26. package/dist/mjs/components/forms/Checkbox/Checkbox.d.ts +8 -2
  27. package/dist/mjs/components/forms/Checkbox/CheckboxGroup.d.ts +4 -1
  28. package/dist/mjs/components/forms/FieldWrapper.d.ts +7 -1
  29. package/dist/mjs/components/forms/Form/Field.d.ts +2 -0
  30. package/dist/mjs/components/forms/Form/Form.d.ts +3 -0
  31. package/dist/mjs/components/forms/NumberInput/NumberInput.d.ts +6 -1
  32. package/dist/mjs/components/forms/PasswordInput/PasswordInput.d.ts +4 -1
  33. package/dist/mjs/components/forms/RadioGroup/Radio.d.ts +4 -1
  34. package/dist/mjs/components/forms/RadioGroup/RadioGroup.d.ts +11 -1
  35. package/dist/mjs/components/forms/SearchInput/SearchInput.d.ts +4 -1
  36. package/dist/mjs/components/forms/Switch/Switch.d.ts +4 -1
  37. package/dist/mjs/components/forms/TextArea/TextArea.d.ts +4 -1
  38. package/dist/mjs/components/forms/TextInput/TextInput.d.ts +4 -1
  39. package/dist/mjs/components/forms/TextInput/TextInputBase.d.ts +1 -0
  40. package/dist/mjs/index.d.ts +20 -5
  41. package/dist/mjs/index.js +5 -5
  42. package/dist/mjs/index.js.map +1 -1
  43. package/dist/mjs/shared/form.d.ts +4 -2
  44. package/dist/mjs/stories/FormFieldArgs.d.ts +6 -0
  45. package/dist/mjs/styles/styledScrollbar.d.ts +0 -25
  46. package/dist/mjs/tokens.d.ts +7 -0
  47. package/dist/mjs/utils/react/nullableValue.d.ts +18 -0
  48. package/dist/mjs/utils/warnings.d.ts +2 -0
  49. package/package.json +2 -1
@@ -4,10 +4,14 @@ export interface CubeRootProps extends BaseProps {
4
4
  tokens?: {
5
5
  [key: string]: string;
6
6
  };
7
+ bodyStyles?: {
8
+ [key: string]: string;
9
+ };
7
10
  fonts?: boolean;
8
11
  publicUrl?: string;
9
12
  router?: any;
10
13
  font?: string;
11
14
  monospaceFont?: string;
15
+ applyLegacyTokens?: boolean;
12
16
  }
13
17
  export declare const Root: (allProps: CubeRootProps) => JSX.Element;
@@ -8,9 +8,15 @@ export interface CubeCheckboxProps extends BaseProps, AriaCheckboxProps, FormFie
8
8
  * Checkboxes allow users to select multiple items from a list of individual items,
9
9
  * or to mark one individual item as selected.
10
10
  */
11
- declare let _Checkbox: import("react").ForwardRefExoticComponent<CubeCheckboxProps & import("react").RefAttributes<import("@react-types/shared").FocusableRefValue<HTMLElement, HTMLElement>>> & {
11
+ declare let _Checkbox: import("react").ForwardRefExoticComponent<Omit<CubeCheckboxProps, "isSelected" | "defaultSelected"> & {
12
+ isSelected?: any;
13
+ defaultSelected?: any;
14
+ } & import("react").RefAttributes<import("@react-types/shared").FocusableRefValue<HTMLElement, HTMLElement>>> & {
12
15
  cubeInputType: string;
13
- Group: import("react").ForwardRefExoticComponent<import("./CheckboxGroup").CubeCheckboxGroupProps & import("react").RefAttributes<unknown>> & {
16
+ Group: import("react").ForwardRefExoticComponent<Omit<import("./CheckboxGroup").CubeCheckboxGroupProps, "value" | "defaultValue"> & {
17
+ value?: any;
18
+ defaultValue?: any;
19
+ } & import("react").RefAttributes<unknown>> & {
14
20
  cubeInputType: string;
15
21
  };
16
22
  };
@@ -9,7 +9,10 @@ export interface CubeCheckboxGroupProps extends BaseProps, AriaCheckboxGroupProp
9
9
  * Checkbox groups allow users to select a single option from a list of mutually exclusive options.
10
10
  * All possible options are exposed up front for users to compare.
11
11
  */
12
- declare const _CheckboxGroup: import("react").ForwardRefExoticComponent<CubeCheckboxGroupProps & import("react").RefAttributes<unknown>> & {
12
+ declare const _CheckboxGroup: import("react").ForwardRefExoticComponent<Omit<CubeCheckboxGroupProps, "value" | "defaultValue"> & {
13
+ value?: any;
14
+ defaultValue?: any;
15
+ } & import("react").RefAttributes<unknown>> & {
13
16
  cubeInputType: string;
14
17
  };
15
18
  export { _CheckboxGroup as CheckboxGroup };
@@ -5,15 +5,21 @@ export declare type CubeFieldWrapperProps = {
5
5
  as: string;
6
6
  labelPosition: LabelPosition;
7
7
  label?: string;
8
+ labelStyles?: Styles;
8
9
  styles?: Styles;
10
+ /** Whether the input is required */
9
11
  isRequired?: boolean;
12
+ /** Whether the input is disabled */
10
13
  isDisabled?: boolean;
11
- labelStyles?: Styles;
12
14
  necessityIndicator?: NecessityIndicator;
13
15
  labelProps?: any;
14
16
  fieldProps?: any;
17
+ /** Custom message for the field. It will be placed below the label and the input */
15
18
  message?: string | ReactNode;
19
+ /** Styles for the message */
16
20
  messageStyles?: Styles;
21
+ /** The description for the field. It will be placed below the label */
22
+ description?: string;
17
23
  Component?: JSX.Element;
18
24
  validationState?: ValidationState;
19
25
  requiredMark?: boolean;
@@ -19,6 +19,8 @@ export interface CubeFieldProps extends OptionalFieldBaseProps {
19
19
  form?: CubeFormInstance;
20
20
  /** The message for the field or text for the error */
21
21
  message?: string;
22
+ /** The description for the field */
23
+ description?: ReactNode;
22
24
  /** Tooltip for the label that explains something. */
23
25
  tooltip?: ReactNode;
24
26
  /** Field name. It's used as a key the form data. */
@@ -2,6 +2,7 @@ import { FormHTMLAttributes } from 'react';
2
2
  import { CubeFormInstance, CubeFormData } from './useForm';
3
3
  import { BaseProps, ContainerStyleProps } from '../../types';
4
4
  import { FormBaseProps } from '../../../shared';
5
+ import { Styles } from '../../../styles/types';
5
6
  export declare const FormContext: import("react").Context<{}>;
6
7
  export declare function useFormProps(props: any): any;
7
8
  export interface CubeFormProps extends FormBaseProps, BaseProps, ContainerStyleProps, Pick<FormHTMLAttributes<HTMLFormElement>, 'action' | 'autoComplete' | 'encType' | 'method' | 'target'> {
@@ -19,6 +20,8 @@ export interface CubeFormProps extends FormBaseProps, BaseProps, ContainerStyleP
19
20
  onSubmitFailed?: (any?: any) => void | Promise<any>;
20
21
  /** Set form instance created by useForm */
21
22
  form?: CubeFormInstance;
23
+ /** The size of the side area with labels. Only for `labelPosition="side"` */
24
+ labelWidth?: Styles['width'];
22
25
  }
23
26
  /**
24
27
  * Forms allow users to enter data that can be submitted while providing alignment and styling for form fields.
@@ -2,11 +2,16 @@
2
2
  import { CubeTextInputBaseProps } from '../TextInput/TextInputBase';
3
3
  import { AriaNumberFieldProps } from '@react-types/numberfield';
4
4
  export interface CubeNumberInputProps extends Omit<CubeTextInputBaseProps, 'defaultValue' | 'value' | 'onChange'>, AriaNumberFieldProps {
5
+ /** Whether or to hide stepper */
6
+ hideStepper?: boolean;
5
7
  }
6
8
  /**
7
9
  * NumberFields allow users to enter a number, and increment or decrement the value using stepper buttons.
8
10
  */
9
- declare const _NumberInput: import("react").ForwardRefExoticComponent<Pick<any, string | number | symbol> & import("react").RefAttributes<unknown>> & {
11
+ declare const _NumberInput: import("react").ForwardRefExoticComponent<Omit<CubeNumberInputProps, "value" | "defaultValue"> & {
12
+ value?: any;
13
+ defaultValue?: any;
14
+ } & import("react").RefAttributes<unknown>> & {
10
15
  cubeInputType: string;
11
16
  };
12
17
  export { _NumberInput as NumberInput };
@@ -5,7 +5,10 @@ import { CubeTextInputBaseProps } from '../TextInput/TextInputBase';
5
5
  * with a keyboard. Various decorations can be displayed around the field to
6
6
  * communicate the entry requirements.
7
7
  */
8
- declare const _PasswordInput: import("react").ForwardRefExoticComponent<CubeTextInputBaseProps & import("react").RefAttributes<unknown>> & {
8
+ declare const _PasswordInput: import("react").ForwardRefExoticComponent<Omit<CubeTextInputBaseProps, "value" | "defaultValue"> & {
9
+ value?: any;
10
+ defaultValue?: any;
11
+ } & import("react").RefAttributes<unknown>> & {
9
12
  cubeInputType: string;
10
13
  };
11
14
  export { _PasswordInput as PasswordInput };
@@ -13,7 +13,10 @@ declare function RadioButton(props: CubeRadioProps, ref: any): JSX.Element;
13
13
  * All possible options are exposed up front for users to compare.
14
14
  */
15
15
  declare const _Radio: import("react").ForwardRefExoticComponent<CubeRadioProps & import("react").RefAttributes<unknown>> & {
16
- Group: import("react").ForwardRefExoticComponent<Pick<any, string | number | symbol> & import("react").RefAttributes<unknown>> & {
16
+ Group: import("react").ForwardRefExoticComponent<Omit<import("./RadioGroup").CubeRadioGroupProps, "value" | "defaultValue"> & {
17
+ value?: any;
18
+ defaultValue?: any;
19
+ } & import("react").RefAttributes<unknown>> & {
17
20
  cubeInputType: string;
18
21
  };
19
22
  Button: import("react").ForwardRefExoticComponent<CubeRadioProps & import("react").RefAttributes<unknown>>;
@@ -1,9 +1,19 @@
1
1
  /// <reference types="react" />
2
+ import { Styles } from '../../../styles/types';
3
+ import { BaseProps } from '../../types';
4
+ import { AriaRadioGroupProps } from '@react-types/radio';
5
+ import { FormFieldProps } from '../../../shared';
6
+ export interface CubeRadioGroupProps extends BaseProps, AriaRadioGroupProps, FormFieldProps {
7
+ groupStyles?: Styles;
8
+ }
2
9
  /**
3
10
  * Radio groups allow users to select a single option from a list of mutually exclusive options.
4
11
  * All possible options are exposed up front for users to compare.
5
12
  */
6
- declare const _RadioGroup: import("react").ForwardRefExoticComponent<Pick<any, string | number | symbol> & import("react").RefAttributes<unknown>> & {
13
+ declare const _RadioGroup: import("react").ForwardRefExoticComponent<Omit<CubeRadioGroupProps, "value" | "defaultValue"> & {
14
+ value?: any;
15
+ defaultValue?: any;
16
+ } & import("react").RefAttributes<unknown>> & {
7
17
  cubeInputType: string;
8
18
  };
9
19
  export { _RadioGroup as RadioGroup };
@@ -4,4 +4,7 @@ export interface CubeSearchInputProps extends CubeTextInputBaseProps {
4
4
  /** Whether the search input is clearable using ESC keyboard button or clear button inside the input */
5
5
  isClearable?: boolean;
6
6
  }
7
- export declare const SearchInput: import("react").ForwardRefExoticComponent<CubeSearchInputProps & import("react").RefAttributes<unknown>>;
7
+ export declare const SearchInput: import("react").ForwardRefExoticComponent<Omit<CubeSearchInputProps, "value" | "defaultValue"> & {
8
+ value?: any;
9
+ defaultValue?: any;
10
+ } & import("react").RefAttributes<unknown>>;
@@ -12,7 +12,10 @@ export interface CubeSwitchProps extends BaseProps, OuterStyleProps, BlockStyleP
12
12
  * Switches allow users to turn an individual option on or off.
13
13
  * They are usually used to activate or deactivate a specific setting.
14
14
  */
15
- declare let _Switch: import("react").ForwardRefExoticComponent<CubeSwitchProps & import("react").RefAttributes<unknown>> & {
15
+ declare let _Switch: import("react").ForwardRefExoticComponent<Omit<CubeSwitchProps, "isSelected" | "defaultSelected"> & {
16
+ isSelected?: any;
17
+ defaultSelected?: any;
18
+ } & import("react").RefAttributes<unknown>> & {
16
19
  cubeInputType: string;
17
20
  };
18
21
  export { _Switch as Switch };
@@ -12,7 +12,10 @@ export interface CubeTextAreaProps extends CubeTextInputBaseProps {
12
12
  * with a keyboard. Various decorations can be displayed around the field to
13
13
  * communicate the entry requirements.
14
14
  */
15
- declare const _TextArea: import("react").ForwardRefExoticComponent<CubeTextAreaProps & import("react").RefAttributes<unknown>> & {
15
+ declare const _TextArea: import("react").ForwardRefExoticComponent<Omit<CubeTextAreaProps, "value" | "defaultValue"> & {
16
+ value?: any;
17
+ defaultValue?: any;
18
+ } & import("react").RefAttributes<unknown>> & {
16
19
  cubeInputType: string;
17
20
  };
18
21
  export { _TextArea as TextArea };
@@ -5,7 +5,10 @@ import { CubeTextInputBaseProps } from './TextInputBase';
5
5
  * with a keyboard. Various decorations can be displayed around the field to
6
6
  * communicate the entry requirements.
7
7
  */
8
- declare const _TextInput: import("react").ForwardRefExoticComponent<CubeTextInputBaseProps & import("react").RefAttributes<unknown>> & {
8
+ declare const _TextInput: import("react").ForwardRefExoticComponent<Omit<CubeTextInputBaseProps, "value" | "defaultValue"> & {
9
+ value?: any;
10
+ defaultValue?: any;
11
+ } & import("react").RefAttributes<unknown>> & {
9
12
  cubeInputType: string;
10
13
  };
11
14
  export { _TextInput as TextInput };
@@ -35,6 +35,7 @@ export interface CubeTextInputBaseProps extends BaseProps, PositionStyleProps, D
35
35
  rows?: number;
36
36
  /** The resize CSS property sets whether an element is resizable, and if so, in which directions. */
37
37
  resize?: Styles['resize'];
38
+ /** The size of the input */
38
39
  size?: 'small' | 'default' | 'large' | string;
39
40
  }
40
41
  declare const _TextInputBase: import("react").ForwardRefExoticComponent<CubeTextInputBaseProps & import("react").RefAttributes<unknown>>;
@@ -150,19 +150,34 @@ export type { CubeTextProps, CubeTitleProps, CubeParagraphProps };
150
150
  export { useContextStyles, StyleProvider } from './providers/StylesProvider';
151
151
  export { Provider } from './provider';
152
152
  export type { useProviderProps } from './provider';
153
- declare const Input: import("react").ForwardRefExoticComponent<import("./components/forms/TextInput/TextInputBase").CubeTextInputBaseProps & import("react").RefAttributes<unknown>> & {
153
+ declare const Input: import("react").ForwardRefExoticComponent<Omit<import("./components/forms/TextInput/TextInputBase").CubeTextInputBaseProps, "value" | "defaultValue"> & {
154
+ value?: any;
155
+ defaultValue?: any;
156
+ } & import("react").RefAttributes<unknown>> & {
154
157
  cubeInputType: string;
155
158
  } & {
156
- Text: import("react").ForwardRefExoticComponent<import("./components/forms/TextInput/TextInputBase").CubeTextInputBaseProps & import("react").RefAttributes<unknown>> & {
159
+ Text: import("react").ForwardRefExoticComponent<Omit<import("./components/forms/TextInput/TextInputBase").CubeTextInputBaseProps, "value" | "defaultValue"> & {
160
+ value?: any;
161
+ defaultValue?: any;
162
+ } & import("react").RefAttributes<unknown>> & {
157
163
  cubeInputType: string;
158
164
  };
159
- Password: import("react").ForwardRefExoticComponent<import("./components/forms/TextInput/TextInputBase").CubeTextInputBaseProps & import("react").RefAttributes<unknown>> & {
165
+ Password: import("react").ForwardRefExoticComponent<Omit<import("./components/forms/TextInput/TextInputBase").CubeTextInputBaseProps, "value" | "defaultValue"> & {
166
+ value?: any;
167
+ defaultValue?: any;
168
+ } & import("react").RefAttributes<unknown>> & {
160
169
  cubeInputType: string;
161
170
  };
162
- Number: import("react").ForwardRefExoticComponent<Pick<any, string | number | symbol> & import("react").RefAttributes<unknown>> & {
171
+ Number: import("react").ForwardRefExoticComponent<Omit<import("./components/forms/NumberInput/NumberInput").CubeNumberInputProps, "value" | "defaultValue"> & {
172
+ value?: any;
173
+ defaultValue?: any;
174
+ } & import("react").RefAttributes<unknown>> & {
163
175
  cubeInputType: string;
164
176
  };
165
- TextArea: import("react").ForwardRefExoticComponent<import("./components/forms/TextArea/TextArea").CubeTextAreaProps & import("react").RefAttributes<unknown>> & {
177
+ TextArea: import("react").ForwardRefExoticComponent<Omit<import("./components/forms/TextArea/TextArea").CubeTextAreaProps, "value" | "defaultValue"> & {
178
+ value?: any;
179
+ defaultValue?: any;
180
+ } & import("react").RefAttributes<unknown>> & {
166
181
  cubeInputType: string;
167
182
  };
168
183
  File: import("react").ForwardRefExoticComponent<import("./components/forms/FileInput/FileInput").CubeFileInputProps & import("react").RefAttributes<unknown>>;