@linzjs/step-ag-grid 6.1.1 → 7.0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (46) hide show
  1. package/dist/index.css +12 -2
  2. package/dist/index.js +378 -203
  3. package/dist/index.js.map +1 -1
  4. package/dist/src/components/GridPopoverHook.d.ts +1 -1
  5. package/dist/src/components/gridForm/GridFormMultiSelect.d.ts +17 -12
  6. package/dist/src/components/gridPopoverEdit/GridPopoutEditMultiSelect.d.ts +1 -1
  7. package/dist/src/contexts/GridSubComponentContext.d.ts +1 -0
  8. package/dist/src/lui/ActionButton.d.ts +4 -2
  9. package/dist/src/lui/FormError.d.ts +2 -1
  10. package/dist/src/lui/TextAreaInput.d.ts +1 -1
  11. package/dist/src/lui/TextInputFormatted.d.ts +1 -1
  12. package/dist/src/react-menu3/utils/utils.d.ts +1 -0
  13. package/dist/src/utils/textMatcher.d.ts +13 -0
  14. package/dist/src/utils/textValidator.d.ts +3 -2
  15. package/dist/src/utils/util.d.ts +2 -1
  16. package/dist/step-ag-grid.esm.js +379 -205
  17. package/dist/step-ag-grid.esm.js.map +1 -1
  18. package/package.json +9 -8
  19. package/src/components/GridPopoverHook.tsx +7 -1
  20. package/src/components/gridForm/GridFormDropDown.tsx +1 -0
  21. package/src/components/gridForm/GridFormMultiSelect.tsx +290 -188
  22. package/src/components/gridForm/GridFormPopoverMenu.tsx +1 -0
  23. package/src/components/gridForm/GridFormSubComponentTextArea.tsx +2 -2
  24. package/src/components/gridForm/GridFormSubComponentTextInput.tsx +3 -5
  25. package/src/components/gridForm/GridFormTextArea.tsx +13 -13
  26. package/src/components/gridForm/GridFormTextInput.tsx +3 -8
  27. package/src/components/gridPopoverEdit/GridPopoutEditMultiSelect.ts +3 -3
  28. package/src/contexts/GridSubComponentContext.ts +2 -0
  29. package/src/lui/ActionButton.scss +10 -0
  30. package/src/lui/ActionButton.tsx +36 -10
  31. package/src/lui/FormError.scss +7 -0
  32. package/src/lui/FormError.tsx +4 -13
  33. package/src/lui/TextAreaInput.tsx +1 -1
  34. package/src/lui/TextInputFormatted.tsx +1 -1
  35. package/src/react-menu3/components/ControlledMenu.tsx +3 -2
  36. package/src/react-menu3/components/MenuList.tsx +2 -12
  37. package/src/react-menu3/hooks/useItems.ts +5 -2
  38. package/src/react-menu3/utils/utils.ts +15 -0
  39. package/src/stories/components/ActionButton.stories.tsx +11 -0
  40. package/src/stories/grid/FormTest.tsx +1 -1
  41. package/src/stories/grid/GridPopoutEditMultiSelect.stories.tsx +93 -17
  42. package/src/styles/Grid.scss +12 -0
  43. package/src/styles/lui-overrides.scss +0 -2
  44. package/src/utils/textMatcher.ts +31 -0
  45. package/src/utils/textValidator.ts +6 -3
  46. package/src/utils/util.ts +6 -7
@@ -2,7 +2,7 @@
2
2
  import { GridBaseRow } from "./Grid";
3
3
  export interface GridPopoverHookProps<RowType> {
4
4
  className: string | undefined;
5
- invalid?: () => Promise<boolean | string | null> | boolean | string | null;
5
+ invalid?: () => Promise<JSX.Element | boolean | string | null | undefined> | JSX.Element | boolean | string | null | undefined;
6
6
  save?: (selectedRows: RowType[]) => Promise<boolean>;
7
7
  }
8
8
  export declare const useGridPopoverHook: <RowType extends GridBaseRow>(props: GridPopoverHookProps<RowType>) => {
@@ -2,22 +2,27 @@
2
2
  import "../../styles/GridFormMultiSelect.scss";
3
3
  import { GridBaseRow } from "../Grid";
4
4
  import { CellEditorCommon } from "../GridCell";
5
- interface MultiFinalSelectOption<ValueType> {
6
- value: ValueType;
7
- label?: JSX.Element | string;
5
+ export interface MultiSelectOption {
6
+ value: any;
7
+ label?: string;
8
8
  subComponent?: (props: any) => JSX.Element;
9
- }
10
- export type MultiSelectOption<ValueType> = ValueType | MultiFinalSelectOption<ValueType>;
11
- export interface SelectedOptionResult<ValueType> extends MultiFinalSelectOption<ValueType> {
12
9
  subValue?: any;
10
+ filter?: string;
11
+ checked?: boolean;
12
+ }
13
+ export interface GridFormMultiSelectGroup {
14
+ header: string;
15
+ filter?: string;
13
16
  }
14
- export interface GridFormMultiSelectProps<RowType extends GridBaseRow, ValueType> extends CellEditorCommon {
17
+ export interface GridFormMultiSelectProps<RowType extends GridBaseRow> extends CellEditorCommon {
15
18
  className?: "GridMultiSelect-containerSmall" | "GridMultiSelect-containerMedium" | "GridMultiSelect-containerLarge" | "GridMultiSelect-containerUnlimited" | string | undefined;
16
19
  filtered?: boolean;
17
20
  filterPlaceholder?: string;
18
- onSave?: (selectedRows: RowType[], selectedOptions: SelectedOptionResult<ValueType>[]) => Promise<boolean>;
19
- options: MultiSelectOption<ValueType>[] | ((selectedRows: RowType[]) => Promise<MultiSelectOption<ValueType>[]> | MultiSelectOption<ValueType>[]);
20
- initialSelectedValues?: (selectedRows: RowType[]) => any[] | Record<string, null | any>;
21
+ filterHelpText?: string | ((filter: string, options: MultiSelectOption[]) => string | undefined);
22
+ onSelectFilter?: (filter: string, options: MultiSelectOption[]) => void;
23
+ onSave?: (selectedRows: RowType[], selectedOptions: MultiSelectOption[]) => Promise<boolean>;
24
+ headers?: GridFormMultiSelectGroup[];
25
+ options: MultiSelectOption[] | ((selectedRows: RowType[]) => Promise<MultiSelectOption[]> | MultiSelectOption[]);
26
+ invalid?: (selectedRows: RowType[], selectedOptions: MultiSelectOption[]) => boolean;
21
27
  }
22
- export declare const GridFormMultiSelect: <RowType extends GridBaseRow, ValueType>(props: GridFormMultiSelectProps<RowType, ValueType>) => JSX.Element;
23
- export {};
28
+ export declare const GridFormMultiSelect: <RowType extends GridBaseRow>(props: GridFormMultiSelectProps<RowType>) => JSX.Element;
@@ -2,4 +2,4 @@ import { ColDefT, GenericCellEditorProps } from "../GridCell";
2
2
  import { GridBaseRow } from "../Grid";
3
3
  import { GridFormMultiSelectProps } from "../gridForm/GridFormMultiSelect";
4
4
  import { GenericCellColDef } from "../gridRender/GridRenderGenericCell";
5
- export declare const GridPopoutEditMultiSelect: <RowType extends GridBaseRow, ValueType>(colDef: GenericCellColDef<RowType>, props: GenericCellEditorProps<GridFormMultiSelectProps<RowType, ValueType>>) => ColDefT<RowType>;
5
+ export declare const GridPopoutEditMultiSelect: <RowType extends GridBaseRow>(colDef: GenericCellColDef<RowType>, props: GenericCellEditorProps<GridFormMultiSelectProps<RowType>>) => ColDefT<RowType>;
@@ -5,5 +5,6 @@ export interface GridSubComponentContextType {
5
5
  setValue: (value: string) => void;
6
6
  setValid: (valid: boolean) => void;
7
7
  triggerSave: () => Promise<void>;
8
+ context: any;
8
9
  }
9
10
  export declare const GridSubComponentContext: import("react").Context<GridSubComponentContextType>;
@@ -10,9 +10,11 @@ export interface ActionButtonProps {
10
10
  title?: string;
11
11
  dataTestId?: string;
12
12
  size?: "xs" | "sm" | "md" | "lg" | "xl" | "ns";
13
- className?: string;
13
+ iconPosition?: "left" | "right";
14
+ className?: "ActionButton-fill" | string;
14
15
  onAction: () => Promise<void> | void;
15
16
  externalSetInProgress?: () => void;
16
17
  level?: LuiButtonProps["level"];
18
+ style?: React.CSSProperties;
17
19
  }
18
- export declare const ActionButton: ({ icon, name, inProgressName, dataTestId, className, title, onAction, externalSetInProgress, size, level, "aria-label": ariaLabel, }: ActionButtonProps) => JSX.Element;
20
+ export declare const ActionButton: ({ icon, name, inProgressName, dataTestId, style, className, title, onAction, externalSetInProgress, size, iconPosition, level, "aria-label": ariaLabel, }: ActionButtonProps) => JSX.Element;
@@ -1,6 +1,7 @@
1
1
  /// <reference types="react" />
2
+ import "./FormError.scss";
2
3
  export interface FormErrorProps {
3
4
  helpText?: string;
4
- error?: string | boolean | null;
5
+ error?: JSX.Element | string | boolean | null;
5
6
  }
6
7
  export declare const FormError: (props: FormErrorProps) => JSX.Element;
@@ -5,6 +5,6 @@ export interface LuiTextAreaInputProps extends InputHTMLAttributes<HTMLTextAreaE
5
5
  label?: JSX.Element | string;
6
6
  mandatory?: boolean;
7
7
  helpText?: string;
8
- error?: string | boolean | null;
8
+ error?: JSX.Element | string | boolean | null;
9
9
  }
10
10
  export declare const TextAreaInput: (props: LuiTextAreaInputProps) => JSX.Element;
@@ -3,7 +3,7 @@ import { DetailedHTMLProps, InputHTMLAttributes } from "react";
3
3
  export interface LuiTextInputProps extends DetailedHTMLProps<InputHTMLAttributes<HTMLInputElement>, HTMLInputElement> {
4
4
  value: string;
5
5
  helpText?: string;
6
- error?: string | boolean | null;
6
+ error?: JSX.Element | string | boolean | null;
7
7
  formatted?: string;
8
8
  }
9
9
  export declare const TextInputFormatted: (props: LuiTextInputProps) => JSX.Element;
@@ -34,3 +34,4 @@ export declare function commonProps(isDisabled?: boolean, isHovering?: boolean):
34
34
  tabIndex: number;
35
35
  };
36
36
  export declare const indexOfNode: (nodeList: NodeListOf<Node>, node: Node) => number;
37
+ export declare const focusFirstInput: (container: any) => boolean;
@@ -0,0 +1,13 @@
1
+ /**
2
+ * Text matching with wildcards and multiple matchers.
3
+ *
4
+ * "L" => L*
5
+ * "L*" => L*
6
+ * "*L*" => *L*
7
+ * "*L" => *L
8
+ * "A B" => A* and B*
9
+ * "A B, C" => (A* and B*) or C*
10
+ *
11
+ * Returns ture if there's a text match.
12
+ */
13
+ export declare const textMatch: (text: string | undefined | null, filter: string) => boolean;
@@ -1,8 +1,9 @@
1
+ /// <reference types="react" />
1
2
  import { GridBaseRow } from "../components/Grid";
2
3
  export interface TextInputValidatorProps<RowType extends GridBaseRow> {
3
4
  required?: boolean;
4
5
  maxLength?: number;
5
6
  maxBytes?: number;
6
- invalid?: (value: string, data: RowType) => string | null;
7
+ invalid?: (value: string, data: RowType, context: any) => JSX.Element | string | null;
7
8
  }
8
- export declare const TextInputValidator: <RowType extends GridBaseRow>(props: TextInputValidatorProps<RowType>, value: string | null, data: RowType) => string | null;
9
+ export declare const TextInputValidator: <RowType extends GridBaseRow>(props: TextInputValidatorProps<RowType>, value: string | null, data: RowType, context: any) => string | JSX.Element | null;
@@ -1,4 +1,5 @@
1
- export declare const isNotEmpty: (obj: Set<any> | Map<any, any> | Record<any, any> | any[] | undefined) => boolean;
1
+ export declare const isNotEmpty: (value?: any) => boolean;
2
2
  export declare const wait: (timeoutMs: number) => Promise<(string | null)[]>;
3
3
  export declare const isFloat: (value: string) => boolean;
4
4
  export declare const hasParentClass: (className: string, child: Node) => boolean;
5
+ export declare const stringByteLengthIsInvalid: (str: string, maxBytes: number) => boolean;