@carto/ps-react-ui 1.2.6 → 1.3.0

package/dist/types/components/index.d.ts

@@ -10,7 +10,8 @@ export * from './list/types';
 export { SectionContainer } from './section-container/section-container.component';
 export * from './section-container/types';
 export { SimpleSelect } from './selects/simple-select/simple-select.component';
-export { AutocompleteSelect } from './selects/autocomplete-select/autocomplete-select.component';
+export { AutocompleteSelect } from './selects/autocomplete/autocomplete-select/autocomplete-select.component';
+export { AutocompleteSelectSimple } from './selects/autocomplete/autocomplete-select-simple/autocomplete-select-simple.component';
 export { createOptionsFromArray } from './selects/simple-select/create-options-from-array.utils';
 export * from './selects/types';
 export { Table } from './table/table.component';

package/dist/types/components/selects/{autocomplete-select → autocomplete/autocomplete-select}/autocomplete-select.component.d.ts

@@ -1,4 +1,4 @@
-import { AutocompleteSelectProps } from '../types';
+import { AutocompleteSelectProps } from '../../types';
 /**
  * AutocompleteSelect component
  *
@@ -22,16 +22,12 @@ import { AutocompleteSelectProps } from '../types';
  * ```jsx
  *  <AutocompleteSelect
  *    options={[
- *      { value: '1', label: 'Option 1' },
- *      { value: '2', label: 'Option 2' },
+ *      { value: '1', label: 'Option 1', group: 'Group 1' },
+ *      { value: '2', label: 'Option 2', group: 'Group 1' },
  *    ]}
  *    hasAll={true}
  *    grouped={true}
  *    label='Select'
- *    divisionType={{
- *      singular: 'option',
- *      plural: 'options',
- *    }}
  *    placeholder='Select'
  *    selectAllLabel='Select all'
  *    size='small'
@@ -40,4 +36,4 @@ import { AutocompleteSelectProps } from '../types';
  *  />;
  * ```
  */
-export declare function AutocompleteSelect({ options, grouped, hasAll, label, placeholder, selectAllLabel, size, value, onChange, ...props }: AutocompleteSelectProps): JSX.Element;
+export declare function AutocompleteSelect({ options, grouped, hasAll, label, placeholder, selectAllLabel, size, texts, value, RenderInputProps, onChange, ...props }: AutocompleteSelectProps): JSX.Element;

package/dist/types/components/selects/autocomplete/autocomplete-select-simple/autocomplete-select-simple.component.d.ts

@@ -0,0 +1,35 @@
+import { AutocompleteSelectSimpleProps } from '../../types';
+/**
+ * AutocompleteSelectSimple component
+ *
+ * @param {AutocompleteSelectSimpleProps} props - Material UI Autocomplete props
+ *
+ * @defaultValues
+ *
+ * | Prop | Value |
+ * | --- | --- |
+ * | `grouped` | `false` |
+ * | `placeholder` | `'Select'` |
+ * | `size` | `'small'` |
+ *
+ * @remarks
+ * The AutocompleteSelectSimple component is a wrapper around the Material UI Autocomplete component. More information about the props can be found here: https://v4.mui.com/api/autocomplete
+ *
+ * @example
+ *
+ * ```jsx
+ *  <AutocompleteSelectSimple
+ *    options={[
+ *      { value: '1', label: 'Option 1', group: 'Group 1' },
+ *      { value: '2', label: 'Option 2', group: 'Group 1' },
+ *    ]}
+ *    grouped={true}
+ *    label='Select'
+ *    placeholder='Select'
+ *    size='small'
+ *    value={value}
+ *    onChange={onChange}
+ *  />;
+ * ```
+ */
+export declare function AutocompleteSelectSimple({ options, grouped, label, placeholder, size, value, onChange, ...props }: AutocompleteSelectSimpleProps): JSX.Element;

package/dist/types/components/selects/autocomplete/commons/autocomplete-select-option.component.d.ts

@@ -0,0 +1,2 @@
+import { OptionProps } from '../../types';
+export declare function AutocompleteSelectOption({ option, state: { selected }, simple, }: OptionProps): JSX.Element;

package/dist/types/components/selects/types.d.ts

@@ -1,6 +1,7 @@
 import type { ChangeEvent, ReactNode } from 'react';
 import type { SelectProps } from '@material-ui/core/Select';
 import { AutocompleteChangeDetails, AutocompleteChangeReason, AutocompleteProps, AutocompleteRenderOptionState, Value } from '@material-ui/lab';
+import { TextFieldProps } from '@material-ui/core';
 export interface SelectOption {
     label: string;
     value: string | number;
@@ -13,11 +14,23 @@ export interface SimpleSelectProps extends SelectProps {
 export interface OptionProps<T = SelectOption> {
     option: T;
     state: AutocompleteRenderOptionState;
+    simple?: boolean;
 }
 export interface AutocompleteSelectProps<T = SelectOption, Multiple extends boolean | undefined = true, DisableClearable extends boolean | undefined = undefined, FreeSolo extends boolean | undefined = undefined> extends Omit<AutocompleteProps<T, Multiple, DisableClearable, FreeSolo>, 'onChange' | 'renderInput'> {
     grouped?: boolean;
     hasAll?: boolean;
     label?: ReactNode;
     selectAllLabel?: string;
+    RenderInputProps?: TextFieldProps;
+    texts?: {
+        renderTags: {
+            selected: string;
+        };
+    };
+    onChange: (event: ChangeEvent<unknown>, options: Value<T, Multiple, DisableClearable, FreeSolo>, reason: AutocompleteChangeReason, detail?: AutocompleteChangeDetails<T>) => void;
+}
+export interface AutocompleteSelectSimpleProps<T = SelectOption, Multiple extends boolean | undefined = false, DisableClearable extends boolean | undefined = undefined, FreeSolo extends boolean | undefined = undefined> extends Omit<AutocompleteProps<T, Multiple, DisableClearable, FreeSolo>, 'onChange' | 'renderInput'> {
+    grouped?: boolean;
+    label?: ReactNode;
     onChange: (event: ChangeEvent<unknown>, options: Value<T, Multiple, DisableClearable, FreeSolo>, reason: AutocompleteChangeReason, detail?: AutocompleteChangeDetails<T>) => void;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@carto/ps-react-ui",
-  "version": "1.2.6",
+  "version": "1.3.0",
   "description": "CARTO's Professional Service React UI library",
   "files": [
     "dist"

package/dist/types/components/selects/autocomplete-select/autocomplete-select-option.component.d.ts

@@ -1,2 +0,0 @@
-import { OptionProps } from '../types';
-export declare function AutocompleteSelectOption({ option, state: { selected }, }: OptionProps): JSX.Element;