gantri-components 3.0.0-beta.7 → 3.0.0-beta.70

package/README.md

@@ -3,7 +3,7 @@
 ## Adding new icons
 
 1. From [Figma](https://www.figma.com/file/7XptZJEfgLsGIjLT4PAFXY/Gantri-DS-%7C-Atoms?node-id=1%3A9456&t=BvL578PsHUyfuJYh-1), right click on icon from sidebar (Make sure you have the right element selected. They should be 16x16 or 24x24) and click `Copy/Paste as > Copy as SVG`.
-2. Create a new .svg file in the `/assets/icons/__APPROPRIATE_CATEGORY_FOLDER__/` directory with the same name as what appears in [Figma](https://www.figma.com/file/7XptZJEfgLsGIjLT4PAFXY/Gantri-DS-%7C-Atoms?node-id=1%3A9456&t=BvL578PsHUyfuJYh-1) minus `ic_` and `_16` (example: `ic_corner_16` and `ic_corner_24` become `corner` and `corner_24`).
+2. Create a new .svg file in the `/src/assets/icons/__APPROPRIATE_CATEGORY_FOLDER__/` directory with the same name as what appears in [Figma](https://www.figma.com/file/7XptZJEfgLsGIjLT4PAFXY/Gantri-DS-%7C-Atoms?node-id=1%3A9456&t=BvL578PsHUyfuJYh-1) minus `ic_` and `_16` (example: `ic_corner_16` and `ic_corner_24` become `corner` and `corner_24`).
 3. Look at each new svg file and verify that the viewbox is `viewbox="0 0 16 16"` or `viewbox="0 0 24 24"`, as applicable. Update any that are not the appropriate value. If the icons do not look correct when complete, you can try reverting the change or talk to the designers about correcting them.
 4. Update `fill` attributes to reference value `"currentColor"`. `stroke` attributes should also be updated. Be careful to check that the updated icon matches the original icon. Send the icon back to the designers to correct if there are any issues.
 5. Remove IDs and masks. Be careful to check that the updated icon matches the original icon. Send the icon back to the designers to correct if there are any issues.

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

@@ -9,7 +9,7 @@ type DeprecatedSize = 's1' | 's2' | 's3' | 's4' | 's5' | 's6';
 /**
  *
  */
-export type BoxDimension = DeprecatedSize | '.5x' | 'x' | '2x' | '3x' | '4x' | '5x' | '6x' | '7x' | '8x' | '9x' | '10x' | '11x' | '12x' | '16x' | '18x' | '24x' | 'unset' | null | '0' | `${number}px` | `${number}rem` | `${number}vw` | `${number}%` | `calc(${string})`;
+export type BoxDimension = DeprecatedSize | '.5x' | 'x' | '2x' | '3x' | '4x' | '5x' | '6x' | '7x' | '8x' | '9x' | '10x' | '11x' | '12x' | '13x' | '14x' | '15x' | '16x' | '17x' | '18x' | '19x' | '20x' | '24x' | 'unset' | null | '0' | `${number}px` | `${number}rem` | `${number}vw` | `${number}%` | `calc(${string})`;
 type AllowedBoxDimension<T> = T extends BoxDimension ? T : never;
 export interface ResolutionAwarePropBase<T> {
     lg?: AllowedBoxDimension<T>;

package/dist/components/button-menu/button-menu.d.ts

@@ -0,0 +1,5 @@
+import { ButtonMenuProps } from './button-menu.types';
+export declare const ButtonMenu: {
+    <T extends Record<any, any>>(props: ButtonMenuProps<T>): JSX.Element;
+    defaultProps: Partial<ButtonMenuProps<Record<string, unknown>>>;
+};

package/dist/components/button-menu/button-menu.presets.d.ts

@@ -0,0 +1,2 @@
+import { ButtonMenuProps } from './button-menu.types';
+export declare const ButtonMenuPresets: Partial<ButtonMenuProps>;

package/dist/components/button-menu/button-menu.styles.d.ts

@@ -0,0 +1 @@
+export declare const StyledButtonMenuWrapper: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;

package/dist/components/button-menu/button-menu.types.d.ts

@@ -0,0 +1,13 @@
+import { DropdownMenuProps } from '../dropdown-menu/dropdown-menu.types';
+import { ButtonVariant } from '../button/button.types';
+export interface ButtonMenuProps<T = Record<string, unknown>> extends DropdownMenuProps<T> {
+    active?: boolean;
+    buttonClassName?: string;
+    buttonVariant?: ButtonVariant;
+    label?: string;
+    labelTx?: string;
+    labelTxValues?: Record<string, unknown>;
+    onClose?: () => void;
+    onOpen?: () => void;
+    triggerEvent?: 'click' | 'hover' | 'manual';
+}

package/dist/components/button-menu/index.d.ts

@@ -0,0 +1 @@
+export * from './button-menu';

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

@@ -14,6 +14,7 @@ export interface DropdownProps<T> extends Omit<DropdownMenuProps<T>, 'items'> {
     hideErrors?: boolean;
     icon?: ReactElement;
     items?: T[];
+    keepOpenAfterSelection?: boolean;
     keyProperty?: (option?: T) => string;
     labelPosition?: 'top' | 'left';
     labelText?: string;

package/dist/components/dropdown-menu/dropdown-menu.d.ts

@@ -1,5 +1,5 @@
 import { DropdownMenuProps } from './dropdown-menu.types';
 export declare const DropdownMenu: {
-    <T>(props: DropdownMenuProps<T>): JSX.Element;
+    <T extends Record<any, any>>(props: DropdownMenuProps<T>): JSX.Element;
     defaultProps: Partial<DropdownMenuProps<Record<string, unknown>>>;
 };

package/dist/components/dropdown-menu/dropdown-menu.styles.d.ts

@@ -1,5 +1,7 @@
 import { Property } from 'csstype';
+import { Color } from '../../styles';
 export declare const StyledContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {
+    $borderColor: Color;
     $hasHeader?: boolean | undefined;
     $noShadow: boolean;
 }, never>;

package/dist/components/dropdown-menu/dropdown-menu.types.d.ts

@@ -1,8 +1,10 @@
 import { Property } from 'csstype';
 import { ReactNode } from 'react';
 import { Maybe } from '../../global';
+import { Color } from '../../styles';
 export interface DropdownMenuProps<T = Record<string, unknown>> {
     autoSelectFirst?: boolean;
+    borderColor?: Color;
     className?: string;
     header?: ReactNode;
     idProperty?: keyof T;
@@ -10,6 +12,7 @@ export interface DropdownMenuProps<T = Record<string, unknown>> {
     items: T[];
     /** Sets the alignment of the dropdown items. */
     justifyContent?: Property.JustifyContent;
+    keepOpenAfterSelection?: boolean;
     keyProperty?: (item?: T) => string;
     labelProperty?: keyof T | ((item?: T) => string);
     labelPropertyTx?: (item?: T) => string;
@@ -21,6 +24,8 @@ export interface DropdownMenuProps<T = Record<string, unknown>> {
     renderItem?: (item: T) => Maybe<ReactNode>;
     searchType?: 'startsWith' | 'contains' | 'endsWith';
     searchable?: boolean;
+    /** Optionally provide to highlight multiple items as selected. */
+    selectedItems?: T[];
     value?: string | number;
     width?: Property.Width<string | number>;
 }

package/dist/components/filter-button/filter-button.types.d.ts

@@ -1,18 +1,21 @@
 import { ResolutionAwareProp } from '../../types/resolution-aware-prop.type';
 import { ButtonSize } from '../button/button.types';
-import { OnConfirmInteraction } from '../table/components/table-actions-wrapper/hooks';
 export interface FilterButtonProps {
     Content?: JSX.Element;
     applyButtonText?: string;
     applyButtonTx?: string;
     count?: number;
     hideFilterTextInMobile?: boolean;
+    iconLocation?: 'left' | 'right';
+    label?: string;
+    labelTx?: string;
+    labelTxValues?: Record<string, unknown>;
     modalNoTopSpacing?: boolean;
     modalTitle?: string;
     modalTitleTx?: string;
     onApply?: () => void;
     onClose?: () => void;
-    onConfirmInteraction?: OnConfirmInteraction;
+    onConfirmInteraction?: (op: string) => Promise<boolean>;
     onOpen?: () => void;
     onReset?: () => void;
     recordsCount?: number;

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

@@ -1,12 +1,14 @@
 import { Property } from 'csstype';
-import { BoxProps } from '../box/box.types';
+import { BoxDimension, BoxProps } from '../box/box.types';
 import { ResolutionAwareProp } from '../../types/resolution-aware-prop.type';
 export interface FlexProps extends BoxProps {
     alignItems?: ResolutionAwareProp<Property.AlignItems>;
+    columnGap?: ResolutionAwareProp<BoxDimension>;
     direction?: ResolutionAwareProp<any>;
     gap?: ResolutionAwareProp<Property.Gap>;
     height?: ResolutionAwareProp<string>;
     justifyContent?: ResolutionAwareProp<Property.JustifyContent>;
+    rowGap?: ResolutionAwareProp<BoxDimension>;
     width?: ResolutionAwareProp<string>;
     wrap?: ResolutionAwareProp<Property.FlexWrap>;
 }

package/dist/components/icon/generated/arrows/ArrowDiag.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const SvgArrowDiag: React.NamedExoticComponent<object>;
+export default SvgArrowDiag;

package/dist/components/icon/generated/arrows/ArrowDiag24.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const SvgArrowDiag24: React.NamedExoticComponent<object>;
+export default SvgArrowDiag24;

package/dist/components/icon/generated/arrows/index.d.ts

@@ -14,6 +14,8 @@ export { default as ArrowChevronRight } from './ArrowChevronRight';
 export { default as ArrowChevronRight24 } from './ArrowChevronRight24';
 export { default as ArrowChevronUp } from './ArrowChevronUp';
 export { default as ArrowChevronUp24 } from './ArrowChevronUp24';
+export { default as ArrowDiag } from './ArrowDiag';
+export { default as ArrowDiag24 } from './ArrowDiag24';
 export { default as ArrowDown } from './ArrowDown';
 export { default as ArrowDown24 } from './ArrowDown24';
 export { default as ArrowDownload } from './ArrowDownload';

package/dist/components/icon/generated/docs/DocumentLines.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const SvgDocumentLines: React.NamedExoticComponent<object>;
+export default SvgDocumentLines;

package/dist/components/icon/generated/docs/DocumentLines24.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const SvgDocumentLines24: React.NamedExoticComponent<object>;
+export default SvgDocumentLines24;

package/dist/components/icon/generated/docs/index.d.ts

@@ -1,4 +1,6 @@
 export { default as DocumentBlank } from './DocumentBlank';
 export { default as DocumentBlank24 } from './DocumentBlank24';
+export { default as DocumentLines } from './DocumentLines';
+export { default as DocumentLines24 } from './DocumentLines24';
 export { default as Pencil } from './Pencil';
 export { default as Pencil24 } from './Pencil24';

package/dist/components/icon/generated/logos/LogoAppleText24.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const SvgLogoAppleText24: React.NamedExoticComponent<object>;
+export default SvgLogoAppleText24;

package/dist/components/icon/generated/logos/LogoGoogleText24.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const SvgLogoGoogleText24: React.NamedExoticComponent<object>;
+export default SvgLogoGoogleText24;

package/dist/components/icon/generated/logos/index.d.ts

@@ -2,12 +2,14 @@ export { default as LogoAffirm } from './LogoAffirm';
 export { default as LogoAffirmColored } from './LogoAffirmColored';
 export { default as LogoApple } from './LogoApple';
 export { default as LogoAppleText } from './LogoAppleText';
+export { default as LogoAppleText24 } from './LogoAppleText24';
 export { default as LogoBehance } from './LogoBehance';
 export { default as LogoFacebook } from './LogoFacebook';
 export { default as LogoGantri } from './LogoGantri';
 export { default as LogoGithub } from './LogoGithub';
 export { default as LogoGoogle } from './LogoGoogle';
 export { default as LogoGoogleText } from './LogoGoogleText';
+export { default as LogoGoogleText24 } from './LogoGoogleText24';
 export { default as LogoInstagram } from './LogoInstagram';
 export { default as LogoLinkedin } from './LogoLinkedin';
 export { default as LogoPinterest } from './LogoPinterest';

package/dist/components/icon/generated/ui-control/LinesThreeVertical.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const SvgLinesThreeVertical: React.NamedExoticComponent<object>;
+export default SvgLinesThreeVertical;

package/dist/components/icon/generated/ui-control/LinesThreeVertical24.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const SvgLinesThreeVertical24: React.NamedExoticComponent<object>;
+export default SvgLinesThreeVertical24;

package/dist/components/icon/generated/ui-control/LinesTwoDots.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const SvgLinesTwoDots: React.NamedExoticComponent<object>;
+export default SvgLinesTwoDots;

package/dist/components/icon/generated/ui-control/LinesTwoDots24.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const SvgLinesTwoDots24: React.NamedExoticComponent<object>;
+export default SvgLinesTwoDots24;

package/dist/components/icon/generated/ui-control/XSmall.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const SvgXSmall: React.NamedExoticComponent<object>;
+export default SvgXSmall;

package/dist/components/icon/generated/ui-control/XSmall24.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const SvgXSmall24: React.NamedExoticComponent<object>;
+export default SvgXSmall24;

package/dist/components/icon/generated/ui-control/index.d.ts

@@ -15,8 +15,12 @@ export { default as Grid24 } from './Grid24';
 export { default as LeftQuote } from './LeftQuote';
 export { default as LinesThree } from './LinesThree';
 export { default as LinesThree24 } from './LinesThree24';
+export { default as LinesThreeVertical } from './LinesThreeVertical';
+export { default as LinesThreeVertical24 } from './LinesThreeVertical24';
 export { default as LinesTwo } from './LinesTwo';
 export { default as LinesTwo24 } from './LinesTwo24';
+export { default as LinesTwoDots } from './LinesTwoDots';
+export { default as LinesTwoDots24 } from './LinesTwoDots24';
 export { default as Minus } from './Minus';
 export { default as Minus24 } from './Minus24';
 export { default as MinusCircle } from './MinusCircle';
@@ -39,3 +43,5 @@ export { default as ThreeDotsHorizontal } from './ThreeDotsHorizontal';
 export { default as ThreeDotsHorizontal24 } from './ThreeDotsHorizontal24';
 export { default as X } from './X';
 export { default as X24 } from './X24';
+export { default as XSmall } from './XSmall';
+export { default as XSmall24 } from './XSmall24';

package/dist/components/icon/generated/work/Broom.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const SvgBroom: React.NamedExoticComponent<object>;
+export default SvgBroom;

package/dist/components/icon/generated/work/Broom24.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const SvgBroom24: React.NamedExoticComponent<object>;
+export default SvgBroom24;

package/dist/components/icon/generated/work/SdCardFilledExclamation.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const SvgSdCardFilledExclamation: React.NamedExoticComponent<object>;
+export default SvgSdCardFilledExclamation;

package/dist/components/icon/generated/work/SdCardFilledExclamation24.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const SvgSdCardFilledExclamation24: React.NamedExoticComponent<object>;
+export default SvgSdCardFilledExclamation24;

package/dist/components/icon/generated/work/SdCardOutline.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const SvgSdCardOutline: React.NamedExoticComponent<object>;
+export default SvgSdCardOutline;

package/dist/components/icon/generated/work/SdCardOutline24.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const SvgSdCardOutline24: React.NamedExoticComponent<object>;
+export default SvgSdCardOutline24;

package/dist/components/icon/generated/work/Spool.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const SvgSpool: React.NamedExoticComponent<object>;
+export default SvgSpool;

package/dist/components/icon/generated/work/Spool24.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const SvgSpool24: React.NamedExoticComponent<object>;
+export default SvgSpool24;

package/dist/components/icon/generated/work/Tape.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const SvgTape: React.NamedExoticComponent<object>;
+export default SvgTape;

package/dist/components/icon/generated/work/Tape24.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const SvgTape24: React.NamedExoticComponent<object>;
+export default SvgTape24;

package/dist/components/icon/generated/work/index.d.ts

@@ -4,6 +4,8 @@ export { default as BasketFilled } from './BasketFilled';
 export { default as BasketFilled24 } from './BasketFilled24';
 export { default as Box } from './Box';
 export { default as Box24 } from './Box24';
+export { default as Broom } from './Broom';
+export { default as Broom24 } from './Broom24';
 export { default as Corner } from './Corner';
 export { default as Corner24 } from './Corner24';
 export { default as CubeOutline } from './CubeOutline';
@@ -28,8 +30,16 @@ export { default as SandPaper } from './SandPaper';
 export { default as SandPaper24 } from './SandPaper24';
 export { default as SandPrimed } from './SandPrimed';
 export { default as SandPrimed24 } from './SandPrimed24';
+export { default as SdCardFilledExclamation } from './SdCardFilledExclamation';
+export { default as SdCardFilledExclamation24 } from './SdCardFilledExclamation24';
+export { default as SdCardOutline } from './SdCardOutline';
+export { default as SdCardOutline24 } from './SdCardOutline24';
+export { default as Spool } from './Spool';
+export { default as Spool24 } from './Spool24';
 export { default as Sun } from './Sun';
 export { default as Sun24 } from './Sun24';
+export { default as Tape } from './Tape';
+export { default as Tape24 } from './Tape24';
 export { default as TriangleRuler } from './TriangleRuler';
 export { default as TriangleRuler24 } from './TriangleRuler24';
 export { default as TriangleRulerFilled } from './TriangleRulerFilled';

package/dist/components/icon/icon.type.d.ts

@@ -1,2 +1,2 @@
-export declare const IconsList: readonly ["actions:funnel", "actions:funnel_24", "actions:funnel_filled", "actions:funnel_filled_24", "actions:gear", "actions:gear_24", "actions:life_buoy", "actions:life_buoy_24", "actions:link", "actions:link_24", "actions:star", "actions:star_24", "actions:star_filled", "actions:star_filled_24", "actions:star_half", "actions:star_half_24", "actions:thumbs_up", "actions:thumbs_up_24", "actions:trash_can", "actions:trash_can_24", "alert:bell", "alert:bell_24", "alert:bell_filled", "alert:bell_filled_24", "alert:i_circle", "alert:i_circle_24", "alert:lightning_bolt", "alert:lightning_bolt_24", "alert:lightning_bolt_filled", "alert:lightning_bolt_filled_24", "alert:question_mark_circle", "alert:question_mark_circle_24", "alert:warning_triangle", "alert:warning_triangle_24", "animated:loader", "arrows:arrow_chevron_double_down", "arrows:arrow_chevron_double_down_24", "arrows:arrow_chevron_double_left", "arrows:arrow_chevron_double_left_24", "arrows:arrow_chevron_double_right", "arrows:arrow_chevron_double_right_24", "arrows:arrow_chevron_double_up", "arrows:arrow_chevron_double_up_24", "arrows:arrow_chevron_down", "arrows:arrow_chevron_down_24", "arrows:arrow_chevron_left", "arrows:arrow_chevron_left_24", "arrows:arrow_chevron_right", "arrows:arrow_chevron_right_24", "arrows:arrow_chevron_up", "arrows:arrow_chevron_up_24", "arrows:arrow_down", "arrows:arrow_down_24", "arrows:arrow_download", "arrows:arrow_download_24", "arrows:arrow_external", "arrows:arrow_external_24", "arrows:arrow_left", "arrows:arrow_left_24", "arrows:arrow_line_down", "arrows:arrow_line_down_24", "arrows:arrow_line_left", "arrows:arrow_line_left_24", "arrows:arrow_line_right", "arrows:arrow_line_right_24", "arrows:arrow_line_up", "arrows:arrow_line_up_24", "arrows:arrow_return", "arrows:arrow_right", "arrows:arrow_right_24", "arrows:arrow_rotate_two", "arrows:arrow_rotate_two_24", "arrows:arrow_triangle_down", "arrows:arrow_triangle_down_24", "arrows:arrow_triangle_left", "arrows:arrow_triangle_left_24", "arrows:arrow_triangle_right", "arrows:arrow_triangle_right_24", "arrows:arrow_triangle_up", "arrows:arrow_triangle_up_24", "arrows:arrow_triangle_updown", "arrows:arrow_triangle_updown_24", "arrows:arrow_triangle_updown_down_filled", "arrows:arrow_triangle_updown_down_filled_24", "arrows:arrow_triangle_updown_filled", "arrows:arrow_triangle_updown_filled_24", "arrows:arrow_triangle_updown_top_filled", "arrows:arrow_triangle_updown_top_filled_24", "arrows:arrow_up", "arrows:arrow_up_24", "arrows:arrow_updown", "arrows:arrow_updown_24", "arrows:arrow_updown_filled", "arrows:arrow_updown_filled_24", "arrows:arrow_upload", "arrows:arrow_upload_24", "data:chart_bar", "data:chart_bar_24", "docs:document_blank", "docs:document_blank_24", "docs:pencil", "docs:pencil_24", "location:house", "location:house_24", "location:location_california", "location:location_california_24", "location:location_pin", "location:location_pin_24", "logos:logo_affirm", "logos:logo_affirm_colored", "logos:logo_apple", "logos:logo_apple_text", "logos:logo_behance", "logos:logo_facebook", "logos:logo_gantri", "logos:logo_github", "logos:logo_google", "logos:logo_google_text", "logos:logo_instagram", "logos:logo_linkedin", "logos:logo_pinterest", "logos:logo_tiktok", "logos:logo_twitter", "logos:logo_yotpo", "logos:logo_youtube", "machine:difficulty_easy", "machine:difficulty_hard", "machine:difficulty_moderate", "machine:difficulty_multiple", "machine:laptop", "media:photo", "media:photo_24", "media:photo_filled", "media:photo_filled_24", "payment:cash", "payment:cash_24", "payment:credit_card", "payment:credit_card_24", "payment:gift_box", "payment:gift_box_24", "payment:gift_card", "payment:gift_card_24", "payment:shopping_bag", "payment:shopping_bag_24", "people:people", "people:people_24", "people:person", "people:person_24", "people:person_outline", "people:person_outline_24", "time:calendar", "time:calendar_24", "time:clock", "time:clock_24", "time:clock_filled", "time:clock_filled_24", "ui-control:award_ribbon", "ui-control:check_mark", "ui-control:check_mark_24", "ui-control:check_mark_circle_filled", "ui-control:check_mark_circle_filled_24", "ui-control:drag", "ui-control:email", "ui-control:email_24", "ui-control:exclamation_circle_filled", "ui-control:exclamation_circle_filled_24", "ui-control:globe", "ui-control:globe_24", "ui-control:grid", "ui-control:grid_24", "ui-control:left_quote", "ui-control:lines_three", "ui-control:lines_three_24", "ui-control:lines_two", "ui-control:lines_two_24", "ui-control:minus", "ui-control:minus_24", "ui-control:minus_circle", "ui-control:minus_circle_24", "ui-control:minus_circle_filled", "ui-control:minus_circle_filled_24", "ui-control:pause", "ui-control:pause_24", "ui-control:play", "ui-control:plus", "ui-control:plus_24", "ui-control:plus_circle", "ui-control:plus_circle_24", "ui-control:sound_off", "ui-control:sound_off_24", "ui-control:sound_on", "ui-control:three_dots_cluster", "ui-control:three_dots_cluster_24", "ui-control:three_dots_horizontal", "ui-control:three_dots_horizontal_24", "ui-control:x", "ui-control:x_24", "view:eye_open", "view:eye_open_24", "view:magnifying_glass", "view:magnifying_glass_24", "view:magnifying_glass_filled", "view:magnifying_glass_filled_24", "work:assemble", "work:assemble_24", "work:basket_filled", "work:basket_filled_24", "work:box", "work:box_24", "work:corner", "work:corner_24", "work:cube_outline", "work:cube_outline_24", "work:leaf", "work:leaf_24", "work:light_bulb", "work:light_bulb_24", "work:mask", "work:mask_24", "work:no_entry", "work:no_entry_24", "work:p_circle", "work:p_circle_24", "work:print_nozzle", "work:print_nozzle_24", "work:rfid_signal", "work:rfid_signal_24", "work:sand_painted", "work:sand_painted_24", "work:sand_paper", "work:sand_paper_24", "work:sand_primed", "work:sand_primed_24", "work:sun", "work:sun_24", "work:triangle_ruler", "work:triangle_ruler_24", "work:triangle_ruler_filled", "work:tumbler", "work:tumbler_24", "work:water_drop", "work:water_drop_24", "work:water_drop_dotted", "work:water_drop_dotted_24", "work:wrench", "work:wrench_24"];
+export declare const IconsList: readonly ["actions:funnel", "actions:funnel_24", "actions:funnel_filled", "actions:funnel_filled_24", "actions:gear", "actions:gear_24", "actions:life_buoy", "actions:life_buoy_24", "actions:link", "actions:link_24", "actions:star", "actions:star_24", "actions:star_filled", "actions:star_filled_24", "actions:star_half", "actions:star_half_24", "actions:thumbs_up", "actions:thumbs_up_24", "actions:trash_can", "actions:trash_can_24", "alert:bell", "alert:bell_24", "alert:bell_filled", "alert:bell_filled_24", "alert:i_circle", "alert:i_circle_24", "alert:lightning_bolt", "alert:lightning_bolt_24", "alert:lightning_bolt_filled", "alert:lightning_bolt_filled_24", "alert:question_mark_circle", "alert:question_mark_circle_24", "alert:warning_triangle", "alert:warning_triangle_24", "animated:loader", "arrows:arrow_chevron_double_down", "arrows:arrow_chevron_double_down_24", "arrows:arrow_chevron_double_left", "arrows:arrow_chevron_double_left_24", "arrows:arrow_chevron_double_right", "arrows:arrow_chevron_double_right_24", "arrows:arrow_chevron_double_up", "arrows:arrow_chevron_double_up_24", "arrows:arrow_chevron_down", "arrows:arrow_chevron_down_24", "arrows:arrow_chevron_left", "arrows:arrow_chevron_left_24", "arrows:arrow_chevron_right", "arrows:arrow_chevron_right_24", "arrows:arrow_chevron_up", "arrows:arrow_chevron_up_24", "arrows:arrow_diag", "arrows:arrow_diag_24", "arrows:arrow_down", "arrows:arrow_down_24", "arrows:arrow_download", "arrows:arrow_download_24", "arrows:arrow_external", "arrows:arrow_external_24", "arrows:arrow_left", "arrows:arrow_left_24", "arrows:arrow_line_down", "arrows:arrow_line_down_24", "arrows:arrow_line_left", "arrows:arrow_line_left_24", "arrows:arrow_line_right", "arrows:arrow_line_right_24", "arrows:arrow_line_up", "arrows:arrow_line_up_24", "arrows:arrow_return", "arrows:arrow_right", "arrows:arrow_right_24", "arrows:arrow_rotate_two", "arrows:arrow_rotate_two_24", "arrows:arrow_triangle_down", "arrows:arrow_triangle_down_24", "arrows:arrow_triangle_left", "arrows:arrow_triangle_left_24", "arrows:arrow_triangle_right", "arrows:arrow_triangle_right_24", "arrows:arrow_triangle_up", "arrows:arrow_triangle_up_24", "arrows:arrow_triangle_updown", "arrows:arrow_triangle_updown_24", "arrows:arrow_triangle_updown_down_filled", "arrows:arrow_triangle_updown_down_filled_24", "arrows:arrow_triangle_updown_filled", "arrows:arrow_triangle_updown_filled_24", "arrows:arrow_triangle_updown_top_filled", "arrows:arrow_triangle_updown_top_filled_24", "arrows:arrow_up", "arrows:arrow_up_24", "arrows:arrow_updown", "arrows:arrow_updown_24", "arrows:arrow_updown_filled", "arrows:arrow_updown_filled_24", "arrows:arrow_upload", "arrows:arrow_upload_24", "data:chart_bar", "data:chart_bar_24", "docs:document_blank", "docs:document_blank_24", "docs:document_lines", "docs:document_lines_24", "docs:pencil", "docs:pencil_24", "location:house", "location:house_24", "location:location_california", "location:location_california_24", "location:location_pin", "location:location_pin_24", "logos:logo_affirm", "logos:logo_affirm_colored", "logos:logo_apple", "logos:logo_apple_text", "logos:logo_apple_text_24", "logos:logo_behance", "logos:logo_facebook", "logos:logo_gantri", "logos:logo_github", "logos:logo_google", "logos:logo_google_text", "logos:logo_google_text_24", "logos:logo_instagram", "logos:logo_linkedin", "logos:logo_pinterest", "logos:logo_tiktok", "logos:logo_twitter", "logos:logo_yotpo", "logos:logo_youtube", "machine:difficulty_easy", "machine:difficulty_hard", "machine:difficulty_moderate", "machine:difficulty_multiple", "machine:laptop", "media:photo", "media:photo_24", "media:photo_filled", "media:photo_filled_24", "payment:cash", "payment:cash_24", "payment:credit_card", "payment:credit_card_24", "payment:gift_box", "payment:gift_box_24", "payment:gift_card", "payment:gift_card_24", "payment:shopping_bag", "payment:shopping_bag_24", "people:people", "people:people_24", "people:person", "people:person_24", "people:person_outline", "people:person_outline_24", "time:calendar", "time:calendar_24", "time:clock", "time:clock_24", "time:clock_filled", "time:clock_filled_24", "ui-control:award_ribbon", "ui-control:check_mark", "ui-control:check_mark_24", "ui-control:check_mark_circle_filled", "ui-control:check_mark_circle_filled_24", "ui-control:drag", "ui-control:email", "ui-control:email_24", "ui-control:exclamation_circle_filled", "ui-control:exclamation_circle_filled_24", "ui-control:globe", "ui-control:globe_24", "ui-control:grid", "ui-control:grid_24", "ui-control:left_quote", "ui-control:lines_three", "ui-control:lines_three_24", "ui-control:lines_three_vertical", "ui-control:lines_three_vertical_24", "ui-control:lines_two", "ui-control:lines_two_24", "ui-control:lines_two_dots", "ui-control:lines_two_dots_24", "ui-control:minus", "ui-control:minus_24", "ui-control:minus_circle", "ui-control:minus_circle_24", "ui-control:minus_circle_filled", "ui-control:minus_circle_filled_24", "ui-control:pause", "ui-control:pause_24", "ui-control:play", "ui-control:plus", "ui-control:plus_24", "ui-control:plus_circle", "ui-control:plus_circle_24", "ui-control:sound_off", "ui-control:sound_off_24", "ui-control:sound_on", "ui-control:three_dots_cluster", "ui-control:three_dots_cluster_24", "ui-control:three_dots_horizontal", "ui-control:three_dots_horizontal_24", "ui-control:x", "ui-control:x_24", "ui-control:x_small", "ui-control:x_small_24", "view:eye_open", "view:eye_open_24", "view:magnifying_glass", "view:magnifying_glass_24", "view:magnifying_glass_filled", "view:magnifying_glass_filled_24", "work:assemble", "work:assemble_24", "work:basket_filled", "work:basket_filled_24", "work:box", "work:box_24", "work:broom", "work:broom_24", "work:corner", "work:corner_24", "work:cube_outline", "work:cube_outline_24", "work:leaf", "work:leaf_24", "work:light_bulb", "work:light_bulb_24", "work:mask", "work:mask_24", "work:no_entry", "work:no_entry_24", "work:p_circle", "work:p_circle_24", "work:print_nozzle", "work:print_nozzle_24", "work:rfid_signal", "work:rfid_signal_24", "work:sand_painted", "work:sand_painted_24", "work:sand_paper", "work:sand_paper_24", "work:sand_primed", "work:sand_primed_24", "work:sd_card_filled_exclamation", "work:sd_card_filled_exclamation_24", "work:sd_card_outline", "work:sd_card_outline_24", "work:spool", "work:spool_24", "work:sun", "work:sun_24", "work:tape", "work:tape_24", "work:triangle_ruler", "work:triangle_ruler_24", "work:triangle_ruler_filled", "work:tumbler", "work:tumbler_24", "work:water_drop", "work:water_drop_24", "work:water_drop_dotted", "work:water_drop_dotted_24", "work:wrench", "work:wrench_24"];
 export type IconType = typeof IconsList[number];

package/dist/components/index.d.ts

@@ -3,6 +3,7 @@ export * from './badge';
 export * from './box';
 export * from './breadcrumbs';
 export * from './button';
+export * from './button-menu';
 export * from './cell';
 export * from './checkbox';
 export * from './circular-progress';
@@ -21,6 +22,7 @@ export * from './in-view';
 export * from './line';
 export * from './linear-progress';
 export * from './modal';
+export * from './multi-select-list';
 export * from './overlay';
 export * from './pills';
 export * from './radio';
@@ -34,3 +36,4 @@ export * from './text-field';
 export * from './toggle';
 export * from './tooltip';
 export * from './typography';
+export * from './input-group';

package/dist/components/input-group/index.d.ts

@@ -0,0 +1 @@
+export * from './input-group';

package/dist/components/input-group/input-group.d.ts

@@ -0,0 +1,3 @@
+import { FC } from 'react';
+import { InputGroupProps } from './input-group.types';
+export declare const InputGroup: FC<InputGroupProps>;

package/dist/components/input-group/input-group.styles.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+export declare const StyledButton: import("styled-components").StyledComponent<import("react").FC<import("../button/button.types").ButtonProps>, import("styled-components").DefaultTheme, {}, never>;
+export declare const StyledInputGroupContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {
+    $disabled?: boolean | undefined;
+    $size?: string | undefined;
+    $withErrors?: boolean | undefined;
+}, never>;

package/dist/components/input-group/input-group.types.d.ts

@@ -0,0 +1,9 @@
+import { MouseEvent } from 'react';
+import { TextFieldProps } from '../text-field';
+export interface InputGroupProps extends Omit<TextFieldProps, 'rightIcon'> {
+    buttonText?: string;
+    buttonTx?: string;
+    buttonType?: 'submit' | 'button';
+    onClick?: (event: MouseEvent) => void;
+    size?: 'small' | 'large';
+}

package/dist/components/multi-select-list/index.d.ts

@@ -0,0 +1 @@
+export * from './multi-select-list';

package/dist/components/multi-select-list/multi-select-list.d.ts

@@ -0,0 +1,5 @@
+import { MultiSelectListProps } from './multi-select-list.types';
+export declare const MultiSelectList: {
+    <Item extends Record<any, any>>(props: MultiSelectListProps<Item>): JSX.Element;
+    defaultProps: import("./multi-select-list.types").MultiSelectListDefaultProps<Record<string, unknown>>;
+};

package/dist/components/multi-select-list/multi-select-list.presets.d.ts

@@ -0,0 +1,2 @@
+import { MultiSelectListDefaultProps } from './multi-select-list.types';
+export declare const multiSelectListDefaultProps: MultiSelectListDefaultProps<Record<string, unknown>>;

package/dist/components/multi-select-list/multi-select-list.styles.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export declare const StyledFlexItem: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("../flex/flex.types").FlexProps & import("react").RefAttributes<import("../flex/flex.types").FlexProps>>, import("styled-components").DefaultTheme, {}, never>;

package/dist/components/multi-select-list/multi-select-list.types.d.ts

@@ -0,0 +1,11 @@
+import { FlexProps } from '../flex/flex.types';
+export interface MultiSelectListProps<Item extends Record<any, any>> extends Partial<MultiSelectListDefaultProps<Item>>, Partial<FlexProps> {
+    items: Item[];
+    labelPropertyTx?: (item?: Item) => string;
+    setItems: (newItems: Item[]) => void;
+}
+export interface MultiSelectListDefaultProps<Item extends Record<any, any>> {
+    clearButtonText?: string;
+    idProperty: keyof Item;
+    labelProperty: keyof Item | ((item?: Item) => string);
+}

package/dist/components/overlay/overlay.styles.d.ts

@@ -1,3 +1,4 @@
 export declare const StyledContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
 export declare const StyledContent: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
 export declare const StyledBackdrop: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
+export declare const StyledContentBackdrop: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;

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

@@ -2,6 +2,7 @@ import { CSSProperties, ReactNode } from 'react';
 export interface OverlayProps {
     /** Trigger event interactions with this component causes `content` to render, as appropriate. */
     children?: ReactNode;
+    className?: string;
     /** Applied as inline styles to the `children` wrapper. */
     containerStyles?: CSSProperties;
     /** The component to show/hide. */
@@ -25,6 +26,7 @@ export interface OverlayProps {
     parentContainer?: HTMLElement;
     position?: OverlayPosition;
     prerenderContent?: boolean;
+    showBackdropOnManualMode?: boolean;
     triggerEvent?: 'click' | 'hover' | 'manual';
 }
 export interface UseOverlayParams {

package/dist/components/search-field/search-field.d.ts

@@ -1,5 +1,5 @@
 import { SearchFieldProps } from './search-field.types';
 export declare const SearchField: {
-    <T>(props: SearchFieldProps<T>): JSX.Element;
+    <T extends Record<any, any>>(props: SearchFieldProps<T>): JSX.Element;
     defaultProps: Partial<SearchFieldProps<any>>;
 };

package/dist/components/search-field/search-field.styles.d.ts

@@ -1 +1,2 @@
 export declare const StyledSelect: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
+export declare const StyledLoadingContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;

package/dist/components/search-field/search-field.types.d.ts

@@ -6,8 +6,10 @@ import { BlurChangeEvent, DropdownChangeEvent } from '../dropdown';
 export interface SearchFieldProps<T = Record<string, unknown>> extends Omit<DropdownMenuProps<T>, 'items'> {
     borderless?: boolean;
     className?: string;
+    clearButtonText?: string;
     disabled?: boolean;
     dropdownPopupWidth?: Property.Width<string | number>;
+    enableSelectedItemsList?: boolean;
     errorMessage?: ErrorMessageType;
     filterFn?: (searchBy: string, item: T) => boolean;
     hideErrors?: boolean;
@@ -18,9 +20,14 @@ export interface SearchFieldProps<T = Record<string, unknown>> extends Omit<Drop
     labelPosition?: 'top' | 'left';
     labelText?: string;
     labelTx?: string;
+    /**
+     * System will start searching after user has input n digits
+     * There will be no dropdown shown initially, until user enters the n digits and systems begins search.
+     * */
+    minSearchLength?: number;
     name?: string;
     onBlur?: (event: BlurChangeEvent) => void;
-    onChange?: (event: DropdownChangeEvent<T>) => void;
+    onChange?: (event: DropdownChangeEvent<T> | DropdownChangeEvent<T[keyof T][]>) => void;
     onFocus?: (event: FocusEvent<HTMLDivElement>) => void;
     onOpen?: () => void;
     onTextChange?: (value: string) => void;
@@ -29,7 +36,10 @@ export interface SearchFieldProps<T = Record<string, unknown>> extends Omit<Drop
     placeholderTxValues?: {
         [key: string]: string;
     };
-    renderPlaceholder?: (option?: T) => JSX.Element;
+    processing?: boolean;
+    processingText?: string;
+    processingTx?: string;
+    required?: boolean;
     resetSelectionOnDisabled?: boolean;
     /**
      * If internal, the component will search over the provided list of items,
@@ -37,6 +47,7 @@ export interface SearchFieldProps<T = Record<string, unknown>> extends Omit<Drop
      * the new items must be provided after.
      * */
     searchMode?: 'internal' | 'external';
+    selectedItemsList?: (keyof T)[];
     style?: CSSProperties;
     variant?: 'line' | 'filled';
 }

package/dist/components/table/components/cell-reorder-wrapper/cell-reorder-wrapper.types.d.ts

@@ -1,10 +1,10 @@
 import { PropsWithChildren, ReactNode } from 'react';
 import { RowData } from '@tanstack/react-table';
-import { ReorderingProps } from '../../table.types';
+import { RowReorderingProps } from '../../table.types';
 export type CellReorderWrapperProps<TData extends RowData> = PropsWithChildren<{
     FirstColumnContent: JSX.Element | ReactNode;
     /** Rendered when `reordering` is provided, but `reordering.isAvailable === false`. */
     FirstColumnFallback: JSX.Element | ReactNode;
     index: number;
-    reordering: ReorderingProps<TData> | undefined;
+    reordering: RowReorderingProps<TData> | undefined;
 }>;

package/dist/components/table/components/custom-columns-toggle/components/index.d.ts

@@ -0,0 +1 @@
+export * from './user-preferences-toggle';

package/dist/components/table/components/custom-columns-toggle/components/user-preferences-toggle/components/index.d.ts

@@ -0,0 +1,3 @@
+export * from './preference-item-overlay';
+export * from './sortable-preference-item';
+export * from './user-preferences-modal';

package/dist/components/table/components/custom-columns-toggle/components/user-preferences-toggle/components/preference-item-drag-handle/index.d.ts

@@ -0,0 +1 @@
+export * from './preference-item-drag-handle';

package/dist/components/table/components/custom-columns-toggle/components/user-preferences-toggle/components/preference-item-drag-handle/preference-item-drag-handle.d.ts

@@ -0,0 +1,4 @@
+import { FC } from 'react';
+export declare const PreferenceItemDragHandle: FC<{
+    id: string;
+}>;

package/dist/components/table/components/custom-columns-toggle/components/user-preferences-toggle/components/preference-item-drag-handle/preference-item-drag-handle.styles.d.ts

@@ -0,0 +1 @@
+export declare const StyledContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;

package/dist/components/table/components/custom-columns-toggle/components/user-preferences-toggle/components/preference-item-overlay/index.d.ts

@@ -0,0 +1 @@
+export * from './preference-item-overlay';

package/dist/components/table/components/custom-columns-toggle/components/user-preferences-toggle/components/preference-item-overlay/preference-item-overlay.d.ts

@@ -0,0 +1,5 @@
+import { FC } from 'react';
+import { CustomColumnOption } from '../../../../custom-columns-toggle.types';
+export declare const PreferenceItemOverlay: FC<{
+    data: CustomColumnOption;
+}>;

package/dist/components/table/components/custom-columns-toggle/components/user-preferences-toggle/components/preference-item-overlay/preference-item-overlay.styles.d.ts

@@ -0,0 +1 @@
+export declare const StyledContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;