@peculiar/react-components 0.0.2-alpha.268 → 0.0.2-alpha.272

package/dist/types/Autocomplete/autocomplete.d.ts

@@ -8,7 +8,7 @@ export declare type AutocompleteRenderGroupParams = {
     group: string;
     children?: React.ReactNode;
 };
-export declare type AutocompleteProps<T, Multiple extends boolean | undefined> = UseAutocompleteProps<T, Multiple> & {
+export declare type AutocompleteProps<T, Multiple extends boolean | undefined = undefined> = UseAutocompleteProps<T, Multiple> & {
     /**
      * The short hint displayed in the `input` before the user enters a value.
      */
@@ -43,6 +43,14 @@ export declare type AutocompleteProps<T, Multiple extends boolean | undefined> =
      * If `true`, the `input` element is required.
      */
     required?: boolean;
+    /**
+     * Text to display when in the create button element.
+     */
+    createOptionText?: string;
+    /**
+     * If `true`, the create button element will be shown.
+     */
+    allowCreateOption?: boolean;
     /**
      * Render the root element.
      */
@@ -55,11 +63,15 @@ export declare type AutocompleteProps<T, Multiple extends boolean | undefined> =
      * The label to display when the tags are truncated (`limitTags`).
      */
     getLimitTagsText?: (more: number) => string;
+    /**
+     * Callback fired when the create button clicked.
+     */
+    onCreate?: (event: React.SyntheticEvent, value: string) => void;
 };
 /**
  *
  */
-export declare function Autocomplete<T, Multiple extends boolean | undefined>(props: AutocompleteProps<T, Multiple>): JSX.Element;
+export declare function Autocomplete<T, Multiple extends boolean | undefined = undefined>(props: AutocompleteProps<T, Multiple>): JSX.Element;
 export declare namespace Autocomplete {
     var defaultProps: {
         disableSearch: boolean;
@@ -68,5 +80,7 @@ export declare namespace Autocomplete {
         loadingText: string;
         limitTags: number;
         required: boolean;
+        allowCreateOption: boolean;
+        createOptionText: string;
     };
 }

package/dist/types/Chip/chip.d.ts

@@ -1,4 +1,7 @@
 import * as React from 'react';
+/**
+ * Types.
+ */
 declare type BaseProps = {
     /**
      * The content of the component.
@@ -24,6 +27,14 @@ declare type BaseProps = {
      * The className of the component.
      */
     className?: string;
+    /**
+     * Element placed before the children.
+     */
+    startContent?: React.ReactElement;
+    /**
+     * The component used for the root node.
+     */
+    component?: React.ElementType;
     /**
      * Callback function fired when the delete icon is clicked. If set, the delete icon will be shown.
      */
@@ -34,5 +45,8 @@ declare type BaseProps = {
     onClick?: React.MouseEventHandler<HTMLElement>;
     'data-testid'?: string;
 };
+/**
+ *
+ */
 export declare const Chip: React.ForwardRefExoticComponent<BaseProps & React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
 export {};

package/dist/types/hooks/use_autocomplete.d.ts

@@ -14,7 +14,7 @@ export declare type AutocompleteGroupedOption<T> = {
     group: string;
     options: T[];
 };
-export declare type UseAutocompleteProps<T, Multiple extends boolean | undefined> = {
+export declare type UseAutocompleteProps<T, Multiple extends boolean | undefined = undefined> = {
     /**
      * This prop is used to help implement the accessibility logic.
      * If you don't provide an id it will fall back to a randomly generated one.
@@ -69,9 +69,10 @@ export declare type UseAutocompleteProps<T, Multiple extends boolean | undefined
      */
     onInputChange?: (event: React.SyntheticEvent, value: string) => void;
 };
-export declare type UseAutocompleteReturnType<T, Multiple extends boolean | undefined> = {
+export declare type UseAutocompleteReturnType<T, Multiple extends boolean | undefined = undefined> = {
     groupedOptions: T[] | AutocompleteGroupedOption<T>[];
     value: AutocompleteValue<T, Multiple>;
+    searchValue: string;
     popupOpen: boolean;
     id: string;
     getOptionProps: (option: T, index: number) => React.HTMLAttributes<HTMLLIElement>;
@@ -87,4 +88,4 @@ export declare type UseAutocompleteReturnType<T, Multiple extends boolean | unde
     };
     getOptionLabel?: (option: T) => string;
 };
-export declare function useAutocomplete<T, Multiple extends boolean | undefined>(props: UseAutocompleteProps<T, Multiple>): UseAutocompleteReturnType<T, Multiple>;
+export declare function useAutocomplete<T, Multiple extends boolean | undefined = undefined>(props: UseAutocompleteProps<T, Multiple>): UseAutocompleteReturnType<T, Multiple>;

package/dist/types/styles/colors/additional.d.ts

@@ -1,6 +1,5 @@
 export declare const additional: {
     success: string;
-    attention: string;
     'extra-1': string;
     'extra-2': string;
 };

package/dist/types/styles/colors/attention.d.ts

@@ -0,0 +1,26 @@
+export declare const generateAttentionColors: (hex?: string) => {
+    'attention-tint-5': string;
+    'attention-tint-4': string;
+    'attention-tint-3': string;
+    'attention-tint-2': string;
+    'attention-tint-1': string;
+    attention: string;
+    'attention-shade-1': string;
+    'attention-shade-2': string;
+    'attention-shade-3': string;
+    'attention-shade-4': string;
+    'attention-shade-5': string;
+};
+export declare const attention: {
+    'attention-tint-5': string;
+    'attention-tint-4': string;
+    'attention-tint-3': string;
+    'attention-tint-2': string;
+    'attention-tint-1': string;
+    attention: string;
+    'attention-shade-1': string;
+    'attention-shade-2': string;
+    'attention-shade-3': string;
+    'attention-shade-4': string;
+    'attention-shade-5': string;
+};

package/dist/types/styles/colors/index.d.ts

@@ -2,4 +2,5 @@ export { grayscale } from './grayscale';
 export { primary, generatePrimaryColors } from './primary';
 export { secondary, generateSecondaryColors } from './secondary';
 export { wrong, generateWrongColors } from './wrong';
+export { attention, generateAttentionColors } from './attention';
 export { additional } from './additional';

package/dist/types/styles/types.d.ts

@@ -1,4 +1,4 @@
-export declare type ColorType = ('primary-tint-5' | 'primary-tint-4' | 'primary-tint-3' | 'primary-tint-2' | 'primary-tint-1' | 'primary' | 'primary-shade-1' | 'primary-shade-2' | 'primary-shade-3' | 'primary-shade-4' | 'primary-shade-5' | 'secondary-tint-5' | 'secondary-tint-4' | 'secondary-tint-3' | 'secondary-tint-2' | 'secondary-tint-1' | 'secondary' | 'secondary-shade-1' | 'secondary-shade-2' | 'secondary-shade-3' | 'secondary-shade-4' | 'secondary-shade-5' | 'wrong-tint-5' | 'wrong-tint-4' | 'wrong-tint-3' | 'wrong-tint-2' | 'wrong-tint-1' | 'wrong' | 'wrong-shade-1' | 'wrong-shade-2' | 'wrong-shade-3' | 'wrong-shade-4' | 'wrong-shade-5' | 'success' | 'attention' | 'extra-1' | 'extra-2' | 'black' | 'gray-10' | 'gray-9' | 'gray-8' | 'gray-7' | 'gray-6' | 'gray-5' | 'gray-4' | 'gray-3' | 'gray-2' | 'gray-1' | 'white' | 'primary-contrast' | 'secondary-contrast' | 'wrong-contrast');
+export declare type ColorType = ('primary-tint-5' | 'primary-tint-4' | 'primary-tint-3' | 'primary-tint-2' | 'primary-tint-1' | 'primary' | 'primary-shade-1' | 'primary-shade-2' | 'primary-shade-3' | 'primary-shade-4' | 'primary-shade-5' | 'primary-contrast' | 'secondary-tint-5' | 'secondary-tint-4' | 'secondary-tint-3' | 'secondary-tint-2' | 'secondary-tint-1' | 'secondary' | 'secondary-shade-1' | 'secondary-shade-2' | 'secondary-shade-3' | 'secondary-shade-4' | 'secondary-shade-5' | 'secondary-contrast' | 'wrong-tint-5' | 'wrong-tint-4' | 'wrong-tint-3' | 'wrong-tint-2' | 'wrong-tint-1' | 'wrong' | 'wrong-shade-1' | 'wrong-shade-2' | 'wrong-shade-3' | 'wrong-shade-4' | 'wrong-shade-5' | 'wrong-contrast' | 'attention-tint-5' | 'attention-tint-4' | 'attention-tint-3' | 'attention-tint-2' | 'attention-tint-1' | 'attention' | 'attention-shade-1' | 'attention-shade-2' | 'attention-shade-3' | 'attention-shade-4' | 'attention-shade-5' | 'black' | 'gray-10' | 'gray-9' | 'gray-8' | 'gray-7' | 'gray-6' | 'gray-5' | 'gray-4' | 'gray-3' | 'gray-2' | 'gray-1' | 'white' | 'success' | 'extra-1' | 'extra-2');
 export declare type ShadowType = ('light-low' | 'light-medium' | 'light-hight' | 'dark-medium' | 'dark-hight');
 export declare type TypographyPropertiesType = {
     weight: string;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@peculiar/react-components",
   "private": false,
-  "version": "0.0.2-alpha.268+12499cf",
+  "version": "0.0.2-alpha.272+5f0f16a",
   "author": "PeculiarVentures Team",
   "description": "A simple and customizable component library to build faster, beautiful, and more accessible React applications.",
   "keywords": [
@@ -41,7 +41,7 @@
   "dependencies": {
     "@emotion/core": "^10.1.1",
     "@emotion/css": "^11.7.1",
-    "@peculiar/color": "^0.0.2-alpha.268+12499cf",
+    "@peculiar/color": "^0.0.2-alpha.272+5f0f16a",
     "@popperjs/core": "^2.11.2",
     "@types/flat": "^5.0.2",
     "@types/react-transition-group": "^4.4.4",
@@ -84,5 +84,5 @@
     "node": ">=12.x"
   },
   "license": "MIT",
-  "gitHead": "12499cf9659fc2b9ef6d29296a24c2b5876c47fc"
+  "gitHead": "5f0f16a50e6f2513a902ccae1fb1e3fa25c6d5a4"
 }