@linzjs/step-ag-grid 21.1.4 → 21.2.0

package/dist/index.css

@@ -367,16 +367,27 @@
   flex: 1;
 }
 
+.GridFilterQuick-icon {
+  position: absolute;
+  margin: 8px;
+  pointer-events: none;
+  fill: #6b6966;
+}
+
 .GridFilterQuick-input {
   width: 100%;
   height: 40px;
   min-height: 40px;
   border: 0.06rem solid #beb9b4;
   border-radius: 3px;
-  padding-left: 0.75rem;
+  padding-left: 36px;
   padding-right: 0.75rem;
   font-family: "Open Sans", system-ui, sans-serif;
 }
+.GridFilterQuick-input::placeholder {
+  color: #6b6966;
+  font-style: italic;
+}
 
 .Grid-popoverContainer {
   padding: 0.375rem 0.75rem;

package/dist/src/contexts/GridContext.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { ColDef, GridApi, IRowNode } from "ag-grid-community";
 import { CsvExportParams } from "ag-grid-community";
 import { ColDefT, GridBaseRow } from "../components";

package/dist/src/contexts/GridSubComponentContext.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 export interface GridSubComponentContextType {
     value: any;
     data: any;

package/dist/src/contexts/GridUpdatingContext.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 export type GridUpdatingContextType = {
     checkUpdating: (fields: string | string[], id: number | string) => boolean;
     modifyUpdating: (fields: string | string[], ids: (number | string)[], fn: () => void | Promise<void>) => Promise<void>;

package/dist/src/react-menu3/components/ControlledMenu.d.ts

@@ -4,5 +4,5 @@ export declare const ControlledMenuFr: ({ "aria-label": ariaLabel, className, co
     saveButtonRef?: MutableRefObject<HTMLButtonElement | null>;
 }, externalRef: ForwardedRef<HTMLUListElement>) => import("react/jsx-runtime").JSX.Element | null;
 export declare const ControlledMenu: import("react").ForwardRefExoticComponent<Omit<ControlledMenuProps & {
-    saveButtonRef?: MutableRefObject<HTMLButtonElement | null> | undefined;
+    saveButtonRef?: MutableRefObject<HTMLButtonElement | null>;
 }, "ref"> & import("react").RefAttributes<HTMLUListElement>>;

package/dist/src/react-menu3/components/MenuDivider.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import { BaseProps } from "../types";
 export declare const MenuDivider: import("react").MemoExoticComponent<import("react").ForwardRefExoticComponent<Omit<BaseProps<undefined>, "ref"> & import("react").RefAttributes<HTMLLIElement>>>;

package/dist/src/react-menu3/components/MenuItem.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { BaseProps, ClickEvent, EventHandler, Hoverable, MenuItemTypeProp, RenderProp } from "../types";
 import { withHoveringResultProps } from "../utils/withHovering";
 export type MenuItemModifiers = Readonly<{

package/dist/src/react-menu3/contexts/EventHandlersContext.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { RMEvent } from "../utils";
 export interface EventHandlersContextType {
     handleClose?: () => void;

package/dist/src/react-menu3/contexts/HoverItemContext.d.ts

@@ -1,2 +1 @@
-/// <reference types="react" />
 export declare const HoverItemContext: import("react").Context<HTMLDivElement | HTMLLIElement | ((prevItem: HTMLDivElement | HTMLLIElement) => HTMLDivElement | HTMLLIElement | undefined) | undefined>;

package/dist/src/react-menu3/contexts/ItemSettingsContext.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 export declare const ItemSettingsContext: import("react").Context<{
     submenuCloseDelay: number;
     submenuOpenDelay: number;

package/dist/src/react-menu3/contexts/MenuListContext.d.ts

@@ -1,9 +1,9 @@
 import { MutableRefObject } from "react";
 import { MenuDirection, MenuOverflow } from "../types";
 export declare const MenuListContext: import("react").Context<{
-    overflow?: MenuOverflow | undefined;
-    overflowAmt?: number | undefined;
-    parentMenuRef?: MutableRefObject<any> | undefined;
-    parentDir?: MenuDirection | undefined;
-    reposSubmenu?: boolean | undefined;
+    overflow?: MenuOverflow;
+    overflowAmt?: number;
+    parentMenuRef?: MutableRefObject<any>;
+    parentDir?: MenuDirection;
+    reposSubmenu?: boolean;
 }>;

package/dist/src/react-menu3/contexts/MenuListItemContext.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { FocusPosition } from "../types";
 interface MenuListItemContextType {
     isParentOpen?: boolean;

package/dist/src/react-menu3/contexts/RadioGroupContext.d.ts

@@ -1,7 +1,6 @@
-/// <reference types="react" />
 import { EventHandler, RadioChangeEvent } from "../types";
 export declare const RadioGroupContext: import("react").Context<{
     value?: any;
-    name?: string | undefined;
-    onRadioChange?: EventHandler<RadioChangeEvent> | undefined;
+    name?: string;
+    onRadioChange?: EventHandler<RadioChangeEvent>;
 }>;

package/dist/src/react-menu3/hooks/useMenuState.d.ts

@@ -2,22 +2,20 @@ import { MenuState, MenuStateOptions } from "../types";
 /**
  * A custom Hook which helps manage the states of `ControlledMenu`.
  */
-export declare const useMenuState: (props?: MenuStateOptions) => [
-    {
-        /**
-         * Menu state which should be forwarded to `ControlledMenu`.
-         */
-        state?: MenuState;
-        /**
-         * Stop transition animation. This function value should be forwarded to `ControlledMenu`.
-         */
-        endTransition: () => void;
-    },
+export declare const useMenuState: (props?: MenuStateOptions) => [{
     /**
-     * Open or close menu.
-     *
-     * - If no parameter is supplied, this function will toggle state between open and close phases.
-     * - You can set a boolean parameter to explicitly switch into one of the two phases.
+     * Menu state which should be forwarded to `ControlledMenu`.
      */
-    (open?: boolean) => void
-];
+    state?: MenuState;
+    /**
+     * Stop transition animation. This function value should be forwarded to `ControlledMenu`.
+     */
+    endTransition: () => void;
+}, 
+/**
+ * Open or close menu.
+ *
+ * - If no parameter is supplied, this function will toggle state between open and close phases.
+ * - You can set a boolean parameter to explicitly switch into one of the two phases.
+ */
+(open?: boolean) => void];

package/dist/src/react-menu3/utils/utils.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { unstable_batchedUpdates } from "react-dom";
 import { MenuButtonProps } from "../components/MenuButton";
 import { MenuState, MenuStateOptions } from "../types";

package/dist/step-ag-grid.cjs.js

@@ -3128,9 +3128,9 @@ const GridFilterQuick = ({ quickFilterPlaceholder, defaultValue }) => {
     React.useEffect(() => {
         setQuickFilter(quickFilterValue);
     }, [quickFilterValue, setQuickFilter]);
-    return (jsxRuntime.jsx("div", { className: "GridFilterQuick-container", children: jsxRuntime.jsx("input", { "aria-label": "Search", className: "GridFilterQuick-input", type: "text", placeholder: quickFilterPlaceholder ?? "Search...", value: quickFilterValue, onChange: (event) => {
-                setQuickFilterValue(event.target.value);
-            } }) }));
+    return (jsxRuntime.jsxs("div", { className: "GridFilterQuick-container", children: [jsxRuntime.jsx("div", { className: "GridFilterQuick-icon", children: jsxRuntime.jsx(lui.LuiIcon, { name: "ic_search", alt: "Search", size: "md" }) }), jsxRuntime.jsx("input", { "aria-label": "Search", className: "GridFilterQuick-input", type: "text", placeholder: quickFilterPlaceholder ?? "Search", value: quickFilterValue, onChange: (event) => {
+                    setQuickFilterValue(event.target.value);
+                } })] }));
 };
 
 const GridFilters = ({ children }) => (jsxRuntime.jsx("div", { className: "Grid-container-filters", children: children }));
@@ -4250,43 +4250,42 @@ const GridFormPopoverMenu = (props) => {
                             }, children: jsxRuntime.jsx("div", { className: "subComponent", children: item.subComponent && jsxRuntime.jsx(item.subComponent, {}) }) })) }, `${item.label}_subcomponent`))] }, `${item.label}`))))) }) }));
 };
 
+/**
+ * Convert array of 16 byte values to UUID string format of the form:
+ * XXXXXXXX-XXXX-XXXX-XXXX-XXXXXXXXXXXX
+ */
+var byteToHex = [];
+for (var i = 0; i < 256; ++i) {
+  byteToHex.push((i + 0x100).toString(16).slice(1));
+}
+function unsafeStringify(arr, offset = 0) {
+  // Note: Be careful editing this code!  It's been tuned for performance
+  // and works in ways you may not expect. See https://github.com/uuidjs/uuid/pull/434
+  //
+  // Note to future-self: No, you can't remove the `toLowerCase()` call.
+  // REF: https://github.com/uuidjs/uuid/pull/677#issuecomment-1757351351
+  return (byteToHex[arr[offset + 0]] + byteToHex[arr[offset + 1]] + byteToHex[arr[offset + 2]] + byteToHex[arr[offset + 3]] + '-' + byteToHex[arr[offset + 4]] + byteToHex[arr[offset + 5]] + '-' + byteToHex[arr[offset + 6]] + byteToHex[arr[offset + 7]] + '-' + byteToHex[arr[offset + 8]] + byteToHex[arr[offset + 9]] + '-' + byteToHex[arr[offset + 10]] + byteToHex[arr[offset + 11]] + byteToHex[arr[offset + 12]] + byteToHex[arr[offset + 13]] + byteToHex[arr[offset + 14]] + byteToHex[arr[offset + 15]]).toLowerCase();
+}
+
 // Unique ID creation requires a high quality random # generator. In the browser we therefore
 // require the crypto API and do not support built-in fallback to lower quality random number
 // generators (like Math.random()).
-let getRandomValues;
-const rnds8 = new Uint8Array(16);
+
+var getRandomValues;
+var rnds8 = new Uint8Array(16);
 function rng() {
   // lazy load so that environments that need to polyfill have a chance to do so
   if (!getRandomValues) {
     // getRandomValues needs to be invoked in a context where "this" is a Crypto implementation.
     getRandomValues = typeof crypto !== 'undefined' && crypto.getRandomValues && crypto.getRandomValues.bind(crypto);
-
     if (!getRandomValues) {
       throw new Error('crypto.getRandomValues() not supported. See https://github.com/uuidjs/uuid#getrandomvalues-not-supported');
     }
   }
-
   return getRandomValues(rnds8);
 }
 
-/**
- * Convert array of 16 byte values to UUID string format of the form:
- * XXXXXXXX-XXXX-XXXX-XXXX-XXXXXXXXXXXX
- */
-
-const byteToHex = [];
-
-for (let i = 0; i < 256; ++i) {
-  byteToHex.push((i + 0x100).toString(16).slice(1));
-}
-
-function unsafeStringify(arr, offset = 0) {
-  // Note: Be careful editing this code!  It's been tuned for performance
-  // and works in ways you may not expect. See https://github.com/uuidjs/uuid/pull/434
-  return byteToHex[arr[offset + 0]] + byteToHex[arr[offset + 1]] + byteToHex[arr[offset + 2]] + byteToHex[arr[offset + 3]] + '-' + byteToHex[arr[offset + 4]] + byteToHex[arr[offset + 5]] + '-' + byteToHex[arr[offset + 6]] + byteToHex[arr[offset + 7]] + '-' + byteToHex[arr[offset + 8]] + byteToHex[arr[offset + 9]] + '-' + byteToHex[arr[offset + 10]] + byteToHex[arr[offset + 11]] + byteToHex[arr[offset + 12]] + byteToHex[arr[offset + 13]] + byteToHex[arr[offset + 14]] + byteToHex[arr[offset + 15]];
-}
-
-const randomUUID = typeof crypto !== 'undefined' && crypto.randomUUID && crypto.randomUUID.bind(crypto);
+var randomUUID = typeof crypto !== 'undefined' && crypto.randomUUID && crypto.randomUUID.bind(crypto);
 var native = {
   randomUUID
 };
@@ -4295,13 +4294,12 @@ function v4(options, buf, offset) {
   if (native.randomUUID && !buf && !options) {
     return native.randomUUID();
   }
-
   options = options || {};
-  const rnds = options.random || (options.rng || rng)(); // Per 4.4, set bits for version and `clock_seq_hi_and_reserved`
+  var rnds = options.random || (options.rng || rng)();
 
+  // Per 4.4, set bits for version and `clock_seq_hi_and_reserved`
   rnds[6] = rnds[6] & 0x0f | 0x40;
-  rnds[8] = rnds[8] & 0x3f | 0x80; // Copy bytes to buffer, if provided
-
+  rnds[8] = rnds[8] & 0x3f | 0x80;
   return unsafeStringify(rnds);
 }
 
@@ -4580,13 +4578,18 @@ const GridContextProvider = (props) => {
     const { modifyUpdating, checkUpdating } = React.useContext(GridUpdatingContext);
     const [gridApi, setGridApi] = React.useState();
     const [gridReady, setGridReady] = React.useState(false);
-    const [quickFilter, setQuickFilter] = React.useState("");
+    const [quickFilter, _setQuickFilter] = React.useState("");
     const [invisibleColumnIds, _setInvisibleColumnIds] = React.useState();
     const testId = React.useRef();
     const idsBeforeUpdate = React.useRef([]);
     const prePopupFocusedCell = React.useRef();
     const [externallySelectedItemsAreInSync, setExternallySelectedItemsAreInSync] = React.useState(false);
     const externalFilters = React.useRef([]);
+    const setQuickFilter = React.useCallback((filter) => {
+        // If we don't clear the focused cell focus switches back to grid when typing in the quick filter input
+        gridApi?.clearFocusedCell();
+        _setQuickFilter(filter);
+    }, [gridApi]);
     /**
      * Make extra sure the GridCellFillerColId never gets added to invisibleColumnIds as it's dynamically determined
      */