@linzjs/step-ag-grid 31.2.1 → 31.2.3

package/package.json

@@ -2,7 +2,7 @@
   "name": "@linzjs/step-ag-grid",
   "repository": "github:linz/step-ag-grid.git",
   "license": "MIT",
-  "version": "31.2.1",
+  "version": "31.2.3",
   "keywords": [
     "aggrid",
     "ag-grid",
@@ -76,7 +76,7 @@
   },
   "devDependencies": {
     "@chromatic-com/storybook": "^4.1.3",
-    "@linzjs/lui": "^24.3.1",
+    "@linzjs/lui": "^24.16.0",
     "@linzjs/windows": "^9.5.6",
     "@rollup/plugin-commonjs": "^28.0.9",
     "@rollup/plugin-json": "^6.1.0",

package/src/components/gridForm/GridFormPopoverMenu.tsx

@@ -139,10 +139,9 @@ export const GridFormPopoverMenu = <TData extends GridBaseRow>(props: GridFormPo
               <MenuDivider key={`$$divider_${index}`} />
             ) : (
               !item.hidden && (
-                <Fragment key={`${String(item.label)}`}>
+                <Fragment key={`fragment__${index}`}>
                   {item.subMenu ? (
                     <SubMenu
-                      key={`${String(item.label)}`}
                       disabled={!!item.disabled}
                       label={item.label as string}
                       title={item.disabled && typeof item.disabled !== 'boolean' ? item.disabled : ''}
@@ -151,7 +150,6 @@ export const GridFormPopoverMenu = <TData extends GridBaseRow>(props: GridFormPo
                     </SubMenu>
                   ) : (
                     <MenuItem
-                      key={`${String(item.label)}`}
                       onClick={(e: ClickEvent) => void onMenuItemClick(e, item)}
                       disabled={!!item.disabled}
                       title={item.disabled && typeof item.disabled !== 'boolean' ? item.disabled : ''}
@@ -160,7 +158,7 @@ export const GridFormPopoverMenu = <TData extends GridBaseRow>(props: GridFormPo
                     </MenuItem>
                   )}
                   {item.subComponent && subComponentSelected === item && (
-                    <FocusableItem className={'LuiDeprecatedForms'} key={`${String(item.label)}_subcomponent`}>
+                    <FocusableItem className={'LuiDeprecatedForms'}>
                       {() => (
                         <GridSubComponentContext.Provider
                           value={{

package/src/lui/ActionButton.tsx

@@ -22,6 +22,7 @@ export interface ActionButtonProps {
   className?: 'ActionButton-fill' | 'ActionButton-tight' | string;
   onClick: () => Promise<void> | void;
   level?: LuiButtonProps['level'];
+  intent?: LuiButtonProps['intent'];
   style?: CSSProperties;
   disabled?: boolean;
 }
@@ -42,6 +43,7 @@ export const ActionButton = ({
   size = 'sm',
   iconPosition = 'left',
   level = 'tertiary',
+  intent,
   'aria-label': ariaLabel,
 }: ActionButtonProps): ReactElement => {
   const [inProgress, setInProgress] = useState(false);
@@ -70,6 +72,7 @@ export const ActionButton = ({
       data-testid={dataTestId}
       type={'button'}
       level={level}
+      intent={intent}
       title={title ?? ariaLabel ?? name}
       buttonProps={{ 'aria-label': ariaLabel ?? name }}
       className={clsx(

package/src/stories/grid/gridFormStatic/GridFormPopoverMenu.stories.tsx

@@ -24,6 +24,15 @@ export default {
 const Template: StoryFn<typeof GridFormPopoverMenu> = (props) => {
   const configs: [string, GridFormPopoverMenuProps<GridBaseRow>][] = [
     ['No options', { options: () => [] }],
+    [
+      'Elements',
+      {
+        options: () => [
+          { label: <i>El1</i>, value: 1 },
+          { label: <i>El2</i>, value: 2 },
+        ],
+      },
+    ],
     [
       'Enabled/disabled/hidden and divider',
       {
@@ -43,12 +52,12 @@ const Template: StoryFn<typeof GridFormPopoverMenu> = (props) => {
     <div className={'react-menu-inline-test'}>
       <GridContextProvider>
         {configs.map((config, index) => (
-          <>
+          <div key={index}>
             <h6 ref={anchorRefs[index]}>{config[0]}</h6>
             <GridPopoverContext.Provider value={{ anchorRef: anchorRefs[index] } as any as GridPopoverContextType<any>}>
-              <GridFormPopoverMenu {...props} {...config[1]} />
+              <GridFormPopoverMenu {...props} {...config[1]} defaultAction={() => {}} />
             </GridPopoverContext.Provider>
-          </>
+          </div>
         ))}
       </GridContextProvider>
     </div>