@aglyn/shared-ui-jsx 1.0.0-beta.143

package/src/lib/components/navigation-view/navigation-view.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../../../../libs/shared/ui/jsx/src/lib/components/navigation-view/navigation-view.tsx"],"sourcesContent":["/**\n * @license\n * Copyright 2026 Aglyn LLC\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *   http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { generateComponentClassKeys } from '@aglyn/shared-ui-theme'\nimport { mergeSxProps } from '@aglyn/shared-ui-theme'\nimport {\n  AppBar,\n  type AppBarProps,\n  Stack,\n  type StackProps,\n  styled,\n  Toolbar,\n} from '@mui/material'\nimport { motion } from 'framer-motion'\nimport { forwardRef, useState } from 'react'\nimport ScrollReaction from '../scroll-reaction'\n\nconst classKeys = generateComponentClassKeys('AglynNavigationDrawer', [\n  'root',\n  'appBar',\n  'toolbar',\n  'appBarLeft',\n  'appBarRight',\n  'content',\n  'bottomAppBar',\n])\n\nconst StyledAppBar = styled<any>(AppBar)<AppBarProps>(({ theme }) => {\n  const tv = (theme as any).vars || theme\n  return {\n    borderBottomWidth: 1,\n    borderBottomStyle: 'solid',\n    borderBottomColor: tv.palette.divider,\n    zIndex: theme.zIndex.appBar,\n    transition: theme.transitions.create(['background-image', 'box-shadow'], {\n      easing: theme.transitions.easing.sharp,\n      duration: theme.transitions.duration.standard,\n    }),\n  }\n})\n\nexport interface NavigationAppBarProps extends AppBarProps {\n  scrollView?: Node | Window\n  disableHideOnScroll?: boolean\n  disableElevateOnScroll?: boolean\n}\n\nexport const NavigationAppBar = forwardRef<any, NavigationAppBarProps>(\n  (props, forwardRef) => {\n    const {\n      disableHideOnScroll,\n      disableElevateOnScroll,\n      scrollView,\n      children,\n      ...rest\n    } = props\n\n    return (\n      <ScrollReaction threshold={50} target={scrollView}>\n        {({ activeWithoutHysteresis, activeWithHysteresis }) => (\n          <StyledAppBar\n            ref={forwardRef}\n            color=\"default\"\n            position=\"relative\"\n            variant=\"elevation\"\n            elevation={\n              activeWithoutHysteresis && !disableElevateOnScroll ? 4 : 0\n            }\n            enableColorOnDark\n            component={disableHideOnScroll ? 'header' : motion.header}\n            animate={\n              disableHideOnScroll\n                ? undefined\n                : {\n                    height: !activeWithHysteresis ? null : 0,\n                    overflow: 'hidden',\n                  }\n            }\n            {...rest}\n          >\n            {children}\n          </StyledAppBar>\n        )}\n      </ScrollReaction>\n    )\n  },\n)\n\nexport interface NavigationViewProps extends StackProps {\n  appBarLeft?: JSX.Children\n  appBarRight?: JSX.Children\n  childrenAfterToolbar?: JSX.Children\n  bottomAppBar?: JSX.Children\n  AppBarProps?: Partial<NavigationAppBarProps>\n  AppBarLeftProps?: Partial<StackProps>\n  AppBarRightProps?: Partial<StackProps>\n  ContentProps?: Partial<StackProps>\n}\n\nexport const NavigationView = forwardRef<any, NavigationViewProps>(\n  (props, forwardRef) => {\n    const {\n      sx,\n      children,\n      appBarLeft,\n      appBarRight,\n      childrenAfterToolbar,\n      bottomAppBar,\n      AppBarProps,\n      AppBarLeftProps,\n      AppBarRightProps,\n      ContentProps,\n      ...rest\n    } = props\n\n    const [scrollView, setScrollView] = useState<Node | Window>(null)\n\n    return (\n      <Stack\n        ref={forwardRef}\n        direction=\"column\"\n        spacing={0}\n        {...rest}\n        sx={mergeSxProps(\n          {\n            alignItems: 'stretch',\n            justifyContent: 'flex-start',\n            flexGrow: 1,\n            height: 1,\n            width: 1,\n            overflow: 'hidden',\n          },\n          sx,\n        )}\n      >\n        <NavigationAppBar\n          scrollView={scrollView}\n          className={classKeys.appBar}\n          {...AppBarProps}\n        >\n          <Toolbar className={classKeys.toolbar}>\n            <Stack\n              direction=\"row\"\n              spacing={2}\n              sx={{\n                alignItems: 'center',\n                justifyContent: 'space-between',\n                width: 1,\n              }}\n            >\n              <Stack\n                direction=\"row\"\n                className={classKeys.appBarLeft}\n                {...AppBarLeftProps}\n                sx={mergeSxProps(\n                  { alignItems: 'center', justifyContent: 'flex-start' },\n                  AppBarLeftProps?.sx,\n                )}\n              >\n                {appBarLeft}\n              </Stack>\n              <Stack\n                direction=\"row\"\n                className={classKeys.appBarRight}\n                {...AppBarRightProps}\n                sx={mergeSxProps(\n                  { alignItems: 'center', justifyContent: 'flex-start' },\n                  AppBarRightProps?.sx,\n                )}\n              >\n                {appBarRight}\n              </Stack>\n            </Stack>\n          </Toolbar>\n          {childrenAfterToolbar}\n        </NavigationAppBar>\n        <Stack\n          ref={setScrollView}\n          component=\"main\"\n          direction=\"column\"\n          className={classKeys.content}\n          {...ContentProps}\n          sx={mergeSxProps(\n            {\n              overflow: 'auto',\n              flexGrow: 1,\n              height: 1,\n              width: 1,\n              bgcolor: 'background.default',\n              zIndex: 1,\n            },\n            ContentProps?.sx,\n          )}\n        >\n          {children}\n        </Stack>\n        <Stack\n          component=\"footer\"\n          direction=\"column\"\n          className={classKeys.bottomAppBar}\n        >\n          {bottomAppBar}\n        </Stack>\n      </Stack>\n    )\n  },\n)\nNavigationView.displayName = 'NavigationView'\n\nexport default NavigationView\n"],"names":["generateComponentClassKeys","mergeSxProps","AppBar","Stack","styled","Toolbar","motion","forwardRef","useState","ScrollReaction","classKeys","StyledAppBar","theme","tv","vars","borderBottomWidth","borderBottomStyle","borderBottomColor","palette","divider","zIndex","appBar","transition","transitions","create","easing","sharp","duration","standard","NavigationAppBar","props","disableHideOnScroll","disableElevateOnScroll","scrollView","children","rest","threshold","target","activeWithoutHysteresis","activeWithHysteresis","ref","color","position","variant","elevation","enableColorOnDark","component","header","animate","undefined","height","overflow","NavigationView","sx","appBarLeft","appBarRight","childrenAfterToolbar","bottomAppBar","AppBarProps","AppBarLeftProps","AppBarRightProps","ContentProps","setScrollView","direction","spacing","alignItems","justifyContent","flexGrow","width","className","toolbar","content","bgcolor","displayName"],"mappings":"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"}

package/src/lib/components/next-link.d.ts

@@ -0,0 +1,27 @@
+/**
+ * @license
+ * Copyright 2024 Aglyn LLC
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import { type LinkProps } from 'next/link';
+import { type AnchorHTMLAttributes } from 'react';
+export interface NextAnchorProps extends AnchorHTMLAttributes<HTMLAnchorElement> {
+}
+export declare const NextAnchor: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme> & NextAnchorProps, Pick<import("react").DetailedHTMLProps<AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, keyof import("react").ClassAttributes<HTMLAnchorElement> | keyof AnchorHTMLAttributes<HTMLAnchorElement>>, {}>;
+export type NextLinkBaseProps = Omit<NextAnchorProps, 'href'> & Omit<LinkProps, 'href'> & JSX.OverrideableComponentProps;
+export interface NextLinkProps extends NextLinkBaseProps, NextLinkBaseProps {
+    hrefTo?: LinkProps['href'];
+}
+export declare const NextLink: import("react").ForwardRefExoticComponent<Omit<NextLinkProps, "ref"> & import("react").RefAttributes<any>>;
+export default NextLink;

package/src/lib/components/next-link.js

@@ -0,0 +1,88 @@
+import { _ as _extends } from "@swc/helpers/_/_extends";
+import { _ as _object_without_properties_loose } from "@swc/helpers/_/_object_without_properties_loose";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * @license
+ * Copyright 2024 Aglyn LLC
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */ import { styled } from "@mui/material/styles";
+import Link from "next/link";
+import { forwardRef, useCallback, useState } from "react";
+import { LinkNavigationReporter } from "./link-navigation-reporter.js";
+// Add support for the sx prop
+export const NextAnchor = styled('a', {
+    name: 'AglynNextLink'
+})({});
+NextAnchor.displayName = 'NextAnchor';
+NextAnchor.aglyn = true;
+export const NextLink = /*#__PURE__*/ forwardRef((props, ref)=>{
+    const { href: _2, hrefTo, replace, scroll, passHref = true, shallow, prefetch, locale, children, onPointerEnter, onTouchStart, onFocus } = props, rest = _object_without_properties_loose(props, [
+        "href",
+        "hrefTo",
+        "replace",
+        "scroll",
+        "passHref",
+        "shallow",
+        "prefetch",
+        "locale",
+        "children",
+        "onPointerEnter",
+        "onTouchStart",
+        "onFocus"
+    ]);
+    // Next prefetches every link that enters the viewport, and for a statically
+    // generated route that means the route's whole RSC payload. On a page whose
+    // header links to five destinations, a visitor who reads the page and leaves
+    // is served all five anyway — measured at 164.5 KB across 5 requests on the
+    // marketing home page, about a sixth of everything that page transfers, and
+    // five tenant invocations besides.
+    //
+    // Prefetching is held until the visitor reaches for a link instead. Pointer,
+    // touch and focus are the three ways that happens, and each precedes the
+    // click by long enough for the payload to land. Flipping Next's own prop is
+    // what re-arms it: `false` suppresses viewport AND hover prefetch in the app
+    // router, so leaving it there would move the fetch onto the click itself.
+    //
+    // An explicit `prefetch` from a caller still decides — `true` for a link
+    // worth paying for up front, `false` for one that must never prefetch.
+    const [reachedFor, setReachedFor] = useState(false);
+    const noteIntent = useCallback(()=>setReachedFor(true), []);
+    const compose = (theirs)=>(event)=>{
+            theirs == null ? void 0 : theirs(event);
+            noteIntent();
+        };
+    return /*#__PURE__*/ _jsxs(Link, _extends({
+        ref: ref,
+        href: hrefTo,
+        locale: locale,
+        passHref: passHref,
+        prefetch: prefetch != null ? prefetch : reachedFor ? undefined : false,
+        replace: replace,
+        scroll: scroll,
+        shallow: shallow,
+        onPointerEnter: compose(onPointerEnter),
+        onTouchStart: compose(onTouchStart),
+        onFocus: compose(onFocus)
+    }, rest, {
+        children: [
+            children,
+            /*#__PURE__*/ _jsx(LinkNavigationReporter, {})
+        ]
+    }));
+});
+NextLink.displayName = 'NextLink';
+NextLink.aglyn = true;
+export default NextLink;
+
+//# sourceMappingURL=next-link.js.map

package/src/lib/components/next-link.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../../../libs/shared/ui/jsx/src/lib/components/next-link.tsx"],"sourcesContent":["/**\n * @license\n * Copyright 2024 Aglyn LLC\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *   http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { styled } from '@mui/material/styles'\nimport Link, { type LinkProps } from 'next/link'\nimport {\n  type AnchorHTMLAttributes,\n  forwardRef,\n  useCallback,\n  useState,\n} from 'react'\nimport { LinkNavigationReporter } from './link-navigation-reporter'\n\nexport interface NextAnchorProps\n  extends AnchorHTMLAttributes<HTMLAnchorElement> {}\n\n// Add support for the sx prop\nexport const NextAnchor = styled('a', {\n  name: 'AglynNextLink',\n})<NextAnchorProps>({})\nNextAnchor.displayName = 'NextAnchor'\nNextAnchor.aglyn = true\n\nexport type NextLinkBaseProps = Omit<NextAnchorProps, 'href'> &\n  Omit<LinkProps, 'href'> &\n  JSX.OverrideableComponentProps\n\nexport interface NextLinkProps extends NextLinkBaseProps, NextLinkBaseProps {\n  hrefTo?: LinkProps['href']\n}\n\nexport const NextLink = forwardRef<any, NextLinkProps>((props, ref) => {\n  const {\n    href: _2,\n    hrefTo,\n    replace,\n    scroll,\n    passHref = true,\n    shallow,\n    prefetch,\n    locale,\n    children,\n    onPointerEnter,\n    onTouchStart,\n    onFocus,\n    ...rest\n  } = props as LinkProps & NextLinkProps\n\n  // Next prefetches every link that enters the viewport, and for a statically\n  // generated route that means the route's whole RSC payload. On a page whose\n  // header links to five destinations, a visitor who reads the page and leaves\n  // is served all five anyway — measured at 164.5 KB across 5 requests on the\n  // marketing home page, about a sixth of everything that page transfers, and\n  // five tenant invocations besides.\n  //\n  // Prefetching is held until the visitor reaches for a link instead. Pointer,\n  // touch and focus are the three ways that happens, and each precedes the\n  // click by long enough for the payload to land. Flipping Next's own prop is\n  // what re-arms it: `false` suppresses viewport AND hover prefetch in the app\n  // router, so leaving it there would move the fetch onto the click itself.\n  //\n  // An explicit `prefetch` from a caller still decides — `true` for a link\n  // worth paying for up front, `false` for one that must never prefetch.\n  const [reachedFor, setReachedFor] = useState(false)\n  const noteIntent = useCallback(() => setReachedFor(true), [])\n  const compose =\n    (theirs: ((event: any) => void) | undefined) => (event: any) => {\n      theirs?.(event)\n      noteIntent()\n    }\n\n  return (\n    <Link\n      ref={ref}\n      href={hrefTo}\n      locale={locale}\n      passHref={passHref}\n      prefetch={prefetch ?? (reachedFor ? undefined : false)}\n      replace={replace}\n      scroll={scroll}\n      shallow={shallow}\n      onPointerEnter={compose(onPointerEnter)}\n      onTouchStart={compose(onTouchStart)}\n      onFocus={compose(onFocus)}\n      {...rest}\n    >\n      {children}\n      {/* null-rendering: drives the global loading overlay off this link's\n          real navigation transition (useLinkStatus), not URL-commit. */}\n      <LinkNavigationReporter />\n    </Link>\n  )\n})\n\nNextLink.displayName = 'NextLink'\nNextLink.aglyn = true\n\nexport default NextLink\n"],"names":["styled","Link","forwardRef","useCallback","useState","LinkNavigationReporter","NextAnchor","name","displayName","aglyn","NextLink","props","ref","href","_2","hrefTo","replace","scroll","passHref","shallow","prefetch","locale","children","onPointerEnter","onTouchStart","onFocus","rest","reachedFor","setReachedFor","noteIntent","compose","theirs","event","undefined"],"mappings":";;;AAAA;;;;;;;;;;;;;;;CAeC,GAED,SAASA,MAAM,QAAQ,uBAAsB;AAC7C,OAAOC,UAA8B,YAAW;AAChD,SAEEC,UAAU,EACVC,WAAW,EACXC,QAAQ,QACH,QAAO;AACd,SAASC,sBAAsB,QAAQ,gCAA4B;AAKnE,8BAA8B;AAC9B,OAAO,MAAMC,aAAaN,OAAO,KAAK;IACpCO,MAAM;AACR,GAAoB,CAAC,GAAE;AACvBD,WAAWE,WAAW,GAAG;AACzBF,WAAWG,KAAK,GAAG;AAUnB,OAAO,MAAMC,yBAAWR,WAA+B,CAACS,OAAOC;IAC7D,MAAM,EACJC,MAAMC,EAAE,EACRC,MAAM,EACNC,OAAO,EACPC,MAAM,EACNC,WAAW,IAAI,EACfC,OAAO,EACPC,QAAQ,EACRC,MAAM,EACNC,QAAQ,EACRC,cAAc,EACdC,YAAY,EACZC,OAAO,EAER,GAAGd,OADCe,wCACDf;;;;;;;;;;;;;;IAEJ,4EAA4E;IAC5E,4EAA4E;IAC5E,6EAA6E;IAC7E,4EAA4E;IAC5E,4EAA4E;IAC5E,mCAAmC;IACnC,EAAE;IACF,6EAA6E;IAC7E,yEAAyE;IACzE,4EAA4E;IAC5E,6EAA6E;IAC7E,0EAA0E;IAC1E,EAAE;IACF,yEAAyE;IACzE,uEAAuE;IACvE,MAAM,CAACgB,YAAYC,cAAc,GAAGxB,SAAS;IAC7C,MAAMyB,aAAa1B,YAAY,IAAMyB,cAAc,OAAO,EAAE;IAC5D,MAAME,UACJ,CAACC,SAA+C,CAACC;YAC/CD,0BAAAA,OAASC;YACTH;QACF;IAEF,qBACE,MAAC5B;QACCW,KAAKA;QACLC,MAAME;QACNM,QAAQA;QACRH,UAAUA;QACVE,QAAQ,EAAEA,mBAAAA,WAAaO,aAAaM,YAAY;QAChDjB,SAASA;QACTC,QAAQA;QACRE,SAASA;QACTI,gBAAgBO,QAAQP;QACxBC,cAAcM,QAAQN;QACtBC,SAASK,QAAQL;OACbC;;YAEHJ;0BAGD,KAACjB;;;AAGP,GAAE;AAEFK,SAASF,WAAW,GAAG;AACvBE,SAASD,KAAK,GAAG;AAEjB,eAAeC,SAAQ"}

package/src/lib/components/popper-styled.component.d.ts

@@ -0,0 +1,25 @@
+/**
+ * @license
+ * Copyright 2023 Aglyn LLC
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import { type PopperProps as MuiPopperProps } from '@mui/material/Popper';
+import { HTMLAttributes } from 'react';
+export declare const PopperStyledArrowComponent: import("@emotion/styled").StyledComponent<Pick<HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<any>, keyof import("react").RefAttributes<any> | keyof HTMLAttributes<HTMLDivElement>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
+export interface PopperStyledComponentProps extends MuiPopperProps {
+    disableArrow?: boolean;
+    arrowGap?: number | string;
+}
+export declare const PopperStyledComponent: import("@emotion/styled").StyledComponent<MuiPopperProps & import("react").RefAttributes<HTMLDivElement> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme> & PopperStyledComponentProps, {}, {}>;
+export default PopperStyledComponent;

package/src/lib/components/popper-styled.component.js

@@ -0,0 +1,129 @@
+import { _ as _extends } from "@swc/helpers/_/_extends";
+import { _ as _object_without_properties_loose } from "@swc/helpers/_/_object_without_properties_loose";
+import { jsx as _jsx } from "react/jsx-runtime";
+/**
+ * @license
+ * Copyright 2023 Aglyn LLC
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */ import { generateComponentClassKeys, styled } from "@aglyn/shared-ui-theme";
+import { _isEqualitySameType } from "@aglyn/shared-util-tools";
+import MuiPopper from "@mui/material/Popper";
+import clsx from "clsx";
+import { forwardRef } from "react";
+const classKeys = generateComponentClassKeys('AglynPopperStyled', [
+    'arrow'
+]);
+export const PopperStyledArrowComponent = styled(/*#__PURE__*/ forwardRef((props, ref)=>{
+    const { className } = props, rest = _object_without_properties_loose(props, [
+        "className"
+    ]);
+    return /*#__PURE__*/ _jsx("div", _extends({
+        ref: ref,
+        className: clsx(classKeys.arrow, className)
+    }, rest));
+}), {
+    name: 'AglynPopperArrow'
+})({
+    position: 'absolute',
+    fontSize: 7,
+    width: '3em',
+    height: '3em',
+    '&::before': {
+        content: '""',
+        margin: 'auto',
+        display: 'block',
+        width: 0,
+        height: 0,
+        borderStyle: 'solid'
+    }
+});
+export const PopperStyledComponent = styled(MuiPopper, {
+    name: 'AglynPopperStyled',
+    shouldForwardProp: (prop)=>!_isEqualitySameType(prop, null, 'disableArrow', 'arrowGap')
+})(({ theme, disableArrow, arrowGap = 2 })=>{
+    const tv = theme.vars || theme;
+    return {
+        zIndex: 1,
+        '& > div': {
+            position: 'relative'
+        },
+        '&[data-popper-placement*="bottom"]': {
+            '& > div': {
+                marginTop: !disableArrow ? arrowGap != null ? arrowGap : 2 : 0
+            },
+            [`& .${classKeys.arrow}`]: {
+                top: 0,
+                left: 0,
+                marginTop: '-0.9em',
+                width: '3em',
+                height: '1em',
+                '&::before': {
+                    borderWidth: '0 1em 1em 1em',
+                    borderColor: `transparent transparent ${tv.palette.primary.main} transparent`
+                }
+            }
+        },
+        '&[data-popper-placement*="top"]': {
+            '& > div': {
+                marginBottom: !disableArrow ? arrowGap != null ? arrowGap : 2 : 0
+            },
+            [`& .${classKeys.arrow}`]: {
+                bottom: 0,
+                left: 0,
+                marginBottom: '-0.9em',
+                width: '3em',
+                height: '1em',
+                '&::before': {
+                    borderWidth: '1em 1em 0 1em',
+                    borderColor: `${tv.palette.primary.main} transparent transparent transparent`
+                }
+            }
+        },
+        '&[data-popper-placement*="right"]': {
+            '& > div': {
+                marginLeft: !disableArrow ? arrowGap != null ? arrowGap : 2 : 0
+            },
+            [`& .${classKeys.arrow}`]: {
+                left: 0,
+                marginLeft: '-0.9em',
+                height: '3em',
+                width: '1em',
+                '&::before': {
+                    borderWidth: '1em 1em 1em 0',
+                    borderColor: `transparent ${tv.palette.primary.main} transparent transparent`
+                }
+            }
+        },
+        '&[data-popper-placement*="left"]': {
+            '& > div': {
+                marginRight: !disableArrow ? arrowGap != null ? arrowGap : 2 : 0
+            },
+            [`& .${classKeys.arrow}`]: {
+                right: 0,
+                marginRight: '-0.9em',
+                height: '3em',
+                width: '1em',
+                '&::before': {
+                    borderWidth: '1em 0 1em 1em',
+                    borderColor: `transparent transparent transparent ${tv.palette.primary.main}`
+                }
+            }
+        }
+    };
+});
+PopperStyledComponent.displayName = 'PopperStyledComponent';
+PopperStyledComponent.aglyn = true;
+export default PopperStyledComponent;
+
+//# sourceMappingURL=popper-styled.component.js.map

package/src/lib/components/popper-styled.component.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../../../libs/shared/ui/jsx/src/lib/components/popper-styled.component.tsx"],"sourcesContent":["/**\n * @license\n * Copyright 2023 Aglyn LLC\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *   http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { generateComponentClassKeys, styled } from '@aglyn/shared-ui-theme'\nimport { _isEqualitySameType } from '@aglyn/shared-util-tools'\nimport MuiPopper, {\n  type PopperProps as MuiPopperProps,\n} from '@mui/material/Popper'\nimport clsx from 'clsx'\nimport { forwardRef, HTMLAttributes } from 'react'\n\nconst classKeys = generateComponentClassKeys('AglynPopperStyled', ['arrow'])\n\nexport const PopperStyledArrowComponent = styled(\n  forwardRef<any, HTMLAttributes<HTMLDivElement>>((props, ref) => {\n    const { className, ...rest } = props\n    return (\n      <div ref={ref} className={clsx(classKeys.arrow, className)} {...rest} />\n    )\n  }),\n  {\n    name: 'AglynPopperArrow',\n  },\n)({\n  position: 'absolute',\n  fontSize: 7,\n  width: '3em',\n  height: '3em',\n  '&::before': {\n    content: '\"\"',\n    margin: 'auto',\n    display: 'block',\n    width: 0,\n    height: 0,\n    borderStyle: 'solid',\n  },\n})\n\nexport interface PopperStyledComponentProps extends MuiPopperProps {\n  disableArrow?: boolean\n  arrowGap?: number | string\n}\n\nexport const PopperStyledComponent = styled(MuiPopper, {\n  name: 'AglynPopperStyled',\n  shouldForwardProp: (prop) =>\n    !_isEqualitySameType(prop, null, 'disableArrow', 'arrowGap'),\n})<PopperStyledComponentProps>(({ theme, disableArrow, arrowGap = 2 }) => {\n  const tv = (theme as any).vars || theme\n  return {\n    zIndex: 1,\n    '& > div': {\n      position: 'relative',\n    },\n    '&[data-popper-placement*=\"bottom\"]': {\n      '& > div': {\n        marginTop: !disableArrow ? arrowGap ?? 2 : 0,\n      },\n      [`& .${classKeys.arrow}`]: {\n        top: 0,\n        left: 0,\n        marginTop: '-0.9em',\n        width: '3em',\n        height: '1em',\n        '&::before': {\n          borderWidth: '0 1em 1em 1em',\n          borderColor: `transparent transparent ${tv.palette.primary.main} transparent`,\n        },\n      },\n    },\n    '&[data-popper-placement*=\"top\"]': {\n      '& > div': {\n        marginBottom: !disableArrow ? arrowGap ?? 2 : 0,\n      },\n      [`& .${classKeys.arrow}`]: {\n        bottom: 0,\n        left: 0,\n        marginBottom: '-0.9em',\n        width: '3em',\n        height: '1em',\n        '&::before': {\n          borderWidth: '1em 1em 0 1em',\n          borderColor: `${tv.palette.primary.main} transparent transparent transparent`,\n        },\n      },\n    },\n    '&[data-popper-placement*=\"right\"]': {\n      '& > div': {\n        marginLeft: !disableArrow ? arrowGap ?? 2 : 0,\n      },\n      [`& .${classKeys.arrow}`]: {\n        left: 0,\n        marginLeft: '-0.9em',\n        height: '3em',\n        width: '1em',\n        '&::before': {\n          borderWidth: '1em 1em 1em 0',\n          borderColor: `transparent ${tv.palette.primary.main} transparent transparent`,\n        },\n      },\n    },\n    '&[data-popper-placement*=\"left\"]': {\n      '& > div': {\n        marginRight: !disableArrow ? arrowGap ?? 2 : 0,\n      },\n      [`& .${classKeys.arrow}`]: {\n        right: 0,\n        marginRight: '-0.9em',\n        height: '3em',\n        width: '1em',\n        '&::before': {\n          borderWidth: '1em 0 1em 1em',\n          borderColor: `transparent transparent transparent ${tv.palette.primary.main}`,\n        },\n      },\n    },\n  }\n})\n\nPopperStyledComponent.displayName = 'PopperStyledComponent'\nPopperStyledComponent.aglyn = true\n\nexport default PopperStyledComponent\n"],"names":["generateComponentClassKeys","styled","_isEqualitySameType","MuiPopper","clsx","forwardRef","classKeys","PopperStyledArrowComponent","props","ref","className","rest","div","arrow","name","position","fontSize","width","height","content","margin","display","borderStyle","PopperStyledComponent","shouldForwardProp","prop","theme","disableArrow","arrowGap","tv","vars","zIndex","marginTop","top","left","borderWidth","borderColor","palette","primary","main","marginBottom","bottom","marginLeft","marginRight","right","displayName","aglyn"],"mappings":"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"}

package/src/lib/components/quota-readout.component.d.ts

@@ -0,0 +1,69 @@
+import { type TypographyProps } from '@mui/material';
+/**
+ * A standing "N/M <noun> on your plan" readout for an enforced quota
+ * (AGL-2113).
+ *
+ * WHY THIS EXISTS. A per-site quota is a plan differentiator the customer is
+ * paying for, and most of the console only ever mentioned one at the moment
+ * it refused a click — `Product limit reached (100) — upgrade in Billing`.
+ * That is the number arriving as a rejection: the operator learns their cap
+ * by hitting it, cannot see how close they are before that, and cannot tell
+ * whether an upgrade would help without first being blocked. Two cards
+ * (`locations-card`, `registers-card`) already rendered a standing readout;
+ * five siblings enforcing the same class of quota did not, and this component
+ * is what makes that a property of the shared UI rather than of whoever wrote
+ * the card.
+ *
+ * DELIBERATELY PRESENTATIONAL. It takes numbers, not an org doc, and it does
+ * NOT call `checkQuota` — this lib may not depend on `@aglyn/aglyn`, and more
+ * importantly the caller already holds the quota result it uses to gate its
+ * own controls. Recomputing here would let the readout and the gate disagree,
+ * which is the AGL-1716 defect (a card whose head-count came from a
+ * `limit()`-ed listener while the gate counted properly) in a new place.
+ *
+ * `ready` IS LOAD-BEARING and is not a nicety. `checkQuota(undefined, …)`
+ * resolves the FREE tier rather than "unknown", so a readout rendered before
+ * the org doc lands tells a paying customer they are on `0/0`. While `ready`
+ * is false this shows the count it does know and says the plan is still being
+ * read, which is the honest answer.
+ *
+ * NOT IN THE BARREL (AGL-1290). Console-only; import by subpath:
+ * `@aglyn/shared-ui-jsx/components/quota-readout.component`.
+ */
+export interface QuotaReadoutProps extends Omit<TypographyProps<'div'>, 'children'> {
+    /**
+     * Whether the plan behind `limit` has actually resolved. False renders the
+     * count without a denominator — never a denominator invented from an
+     * unresolved org.
+     */
+    ready: boolean;
+    /** How many of the thing exist right now. */
+    used: number;
+    /**
+     * The plan's cap. `Number.POSITIVE_INFINITY` (which is what `UNLIMITED`
+     * is) renders as `∞`. Ignored entirely while `ready` is false.
+     */
+    limit: number;
+    /** Singular noun, lowercase — e.g. `product`, `redirect`, `record`. */
+    noun: string;
+    /** Plural, when it is not `noun + 's'` — e.g. `entries` for `entry`. */
+    nounPlural?: string;
+    /**
+     * For a quota that RESETS, the period it counts over — e.g. `this month`.
+     *
+     * Omitted, the readout says "on your plan", which is true of a standing
+     * count (products, redirects) and a lie about a monthly one: `340/500
+     * campaign emails on your plan` reads as a lifetime allowance, so a
+     * customer at 340 believes they have 160 left forever rather than until
+     * the 1st. Supplied, it replaces that tail — `340/500 campaign emails
+     * this month`.
+     *
+     * A string rather than a boolean because the reset window is the caller's
+     * fact, not this component's: every monthly counter in the product is
+     * keyed `YYYY-MM`, but nothing here reads the counter and a component that
+     * hardcoded "month" would be asserting a period it cannot see.
+     */
+    period?: string;
+}
+export declare const QuotaReadoutComponent: import("react").ForwardRefExoticComponent<Omit<QuotaReadoutProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+export default QuotaReadoutComponent;

package/src/lib/components/quota-readout.component.js

@@ -0,0 +1,52 @@
+/**
+ * @license
+ * Copyright 2026 Aglyn LLC
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */ 'use client';
+import { _ as _extends } from "@swc/helpers/_/_extends";
+import { _ as _object_without_properties_loose } from "@swc/helpers/_/_object_without_properties_loose";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Typography } from "@mui/material";
+import { forwardRef } from "react";
+/** `∞` for an unlimited cap, the number otherwise. */ function formatLimit(limit) {
+    return Number.isFinite(limit) ? String(limit) : '∞';
+}
+export const QuotaReadoutComponent = /*#__PURE__*/ forwardRef((props, ref)=>{
+    const { ready, used, limit, noun, nounPlural, period } = props, rest = _object_without_properties_loose(props, [
+        "ready",
+        "used",
+        "limit",
+        "noun",
+        "nounPlural",
+        "period"
+    ]);
+    const plural = nounPlural != null ? nounPlural : `${noun}s`;
+    const word = used === 1 ? noun : plural;
+    // A resetting quota says WHEN it resets; a standing one says the count is
+    // the plan's. Both tails are about the denominator, so neither renders
+    // while `ready` is false and there is no denominator to qualify.
+    const tail = period != null ? period : 'on your plan';
+    return /*#__PURE__*/ _jsx(Typography, _extends({
+        variant: "caption",
+        color: "text.secondary",
+        component: "div",
+        ref: ref
+    }, rest, {
+        children: ready ? `${used}/${formatLimit(limit)} ${plural} ${tail}` : `${used} ${word} · checking your plan…`
+    }));
+});
+QuotaReadoutComponent.displayName = 'QuotaReadoutComponent';
+export default QuotaReadoutComponent;
+
+//# sourceMappingURL=quota-readout.component.js.map

package/src/lib/components/quota-readout.component.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../../../libs/shared/ui/jsx/src/lib/components/quota-readout.component.tsx"],"sourcesContent":["/**\n * @license\n * Copyright 2026 Aglyn LLC\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *   http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n'use client'\n\nimport { Typography, type TypographyProps } from '@mui/material'\nimport { forwardRef } from 'react'\n\n/**\n * A standing \"N/M &lt;noun&gt; on your plan\" readout for an enforced quota\n * (AGL-2113).\n *\n * WHY THIS EXISTS. A per-site quota is a plan differentiator the customer is\n * paying for, and most of the console only ever mentioned one at the moment\n * it refused a click — `Product limit reached (100) — upgrade in Billing`.\n * That is the number arriving as a rejection: the operator learns their cap\n * by hitting it, cannot see how close they are before that, and cannot tell\n * whether an upgrade would help without first being blocked. Two cards\n * (`locations-card`, `registers-card`) already rendered a standing readout;\n * five siblings enforcing the same class of quota did not, and this component\n * is what makes that a property of the shared UI rather than of whoever wrote\n * the card.\n *\n * DELIBERATELY PRESENTATIONAL. It takes numbers, not an org doc, and it does\n * NOT call `checkQuota` — this lib may not depend on `@aglyn/aglyn`, and more\n * importantly the caller already holds the quota result it uses to gate its\n * own controls. Recomputing here would let the readout and the gate disagree,\n * which is the AGL-1716 defect (a card whose head-count came from a\n * `limit()`-ed listener while the gate counted properly) in a new place.\n *\n * `ready` IS LOAD-BEARING and is not a nicety. `checkQuota(undefined, …)`\n * resolves the FREE tier rather than \"unknown\", so a readout rendered before\n * the org doc lands tells a paying customer they are on `0/0`. While `ready`\n * is false this shows the count it does know and says the plan is still being\n * read, which is the honest answer.\n *\n * NOT IN THE BARREL (AGL-1290). Console-only; import by subpath:\n * `@aglyn/shared-ui-jsx/components/quota-readout.component`.\n */\nexport interface QuotaReadoutProps\n  extends Omit<TypographyProps<'div'>, 'children'> {\n  /**\n   * Whether the plan behind `limit` has actually resolved. False renders the\n   * count without a denominator — never a denominator invented from an\n   * unresolved org.\n   */\n  ready: boolean\n  /** How many of the thing exist right now. */\n  used: number\n  /**\n   * The plan's cap. `Number.POSITIVE_INFINITY` (which is what `UNLIMITED`\n   * is) renders as `∞`. Ignored entirely while `ready` is false.\n   */\n  limit: number\n  /** Singular noun, lowercase — e.g. `product`, `redirect`, `record`. */\n  noun: string\n  /** Plural, when it is not `noun + 's'` — e.g. `entries` for `entry`. */\n  nounPlural?: string\n  /**\n   * For a quota that RESETS, the period it counts over — e.g. `this month`.\n   *\n   * Omitted, the readout says \"on your plan\", which is true of a standing\n   * count (products, redirects) and a lie about a monthly one: `340/500\n   * campaign emails on your plan` reads as a lifetime allowance, so a\n   * customer at 340 believes they have 160 left forever rather than until\n   * the 1st. Supplied, it replaces that tail — `340/500 campaign emails\n   * this month`.\n   *\n   * A string rather than a boolean because the reset window is the caller's\n   * fact, not this component's: every monthly counter in the product is\n   * keyed `YYYY-MM`, but nothing here reads the counter and a component that\n   * hardcoded \"month\" would be asserting a period it cannot see.\n   */\n  period?: string\n}\n\n/** `∞` for an unlimited cap, the number otherwise. */\nfunction formatLimit(limit: number): string {\n  return Number.isFinite(limit) ? String(limit) : '∞'\n}\n\nexport const QuotaReadoutComponent = forwardRef<\n  HTMLDivElement,\n  QuotaReadoutProps\n>((props, ref) => {\n  const { ready, used, limit, noun, nounPlural, period, ...rest } = props\n  const plural = nounPlural ?? `${noun}s`\n  const word = used === 1 ? noun : plural\n  // A resetting quota says WHEN it resets; a standing one says the count is\n  // the plan's. Both tails are about the denominator, so neither renders\n  // while `ready` is false and there is no denominator to qualify.\n  const tail = period ?? 'on your plan'\n  return (\n    <Typography\n      variant=\"caption\"\n      color=\"text.secondary\"\n      component=\"div\"\n      ref={ref}\n      {...rest}\n    >\n      {ready\n        ? `${used}/${formatLimit(limit)} ${plural} ${tail}`\n        : `${used} ${word} · checking your plan…`}\n    </Typography>\n  )\n})\nQuotaReadoutComponent.displayName = 'QuotaReadoutComponent'\n\nexport default QuotaReadoutComponent\n"],"names":["Typography","forwardRef","formatLimit","limit","Number","isFinite","String","QuotaReadoutComponent","props","ref","ready","used","noun","nounPlural","period","rest","plural","word","tail","variant","color","component","displayName"],"mappings":"AAAA;;;;;;;;;;;;;;;CAeC,GACD;;;;AAEA,SAASA,UAAU,QAA8B,gBAAe;AAChE,SAASC,UAAU,QAAQ,QAAO;AAsElC,oDAAoD,GACpD,SAASC,YAAYC,KAAa;IAChC,OAAOC,OAAOC,QAAQ,CAACF,SAASG,OAAOH,SAAS;AAClD;AAEA,OAAO,MAAMI,sCAAwBN,WAGnC,CAACO,OAAOC;IACR,MAAM,EAAEC,KAAK,EAAEC,IAAI,EAAER,KAAK,EAAES,IAAI,EAAEC,UAAU,EAAEC,MAAM,EAAW,GAAGN,OAATO,wCAASP;;;;;;;;IAClE,MAAMQ,SAASH,qBAAAA,aAAc,GAAGD,KAAK,CAAC,CAAC;IACvC,MAAMK,OAAON,SAAS,IAAIC,OAAOI;IACjC,0EAA0E;IAC1E,uEAAuE;IACvE,iEAAiE;IACjE,MAAME,OAAOJ,iBAAAA,SAAU;IACvB,qBACE,KAACd;QACCmB,SAAQ;QACRC,OAAM;QACNC,WAAU;QACVZ,KAAKA;OACDM;kBAEHL,QACG,GAAGC,KAAK,CAAC,EAAET,YAAYC,OAAO,CAAC,EAAEa,OAAO,CAAC,EAAEE,MAAM,GACjD,GAAGP,KAAK,CAAC,EAAEM,KAAK,sBAAsB,CAAC;;AAGjD,GAAE;AACFV,sBAAsBe,WAAW,GAAG;AAEpC,eAAef,sBAAqB"}

package/src/lib/components/resizeable-stack.d.ts

@@ -0,0 +1,4 @@
+export interface ResizeableStackProps extends JSX.OverrideableComponentProps {
+    children: JSX.Children;
+}
+export declare const ResizeableStack: import("react").ForwardRefExoticComponent<Omit<ResizeableStackProps, "ref"> & import("react").RefAttributes<any>>;

package/src/lib/components/resizeable-stack.js

@@ -0,0 +1,23 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+/**
+ * @license
+ * Copyright 2023 Aglyn LLC
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */ import { forwardRef } from "react";
+export const ResizeableStack = /*#__PURE__*/ forwardRef((props, ref)=>{
+    const { jjj } = props;
+    return /*#__PURE__*/ _jsx("div", {});
+});
+
+//# sourceMappingURL=resizeable-stack.js.map

package/src/lib/components/resizeable-stack.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../../../libs/shared/ui/jsx/src/lib/components/resizeable-stack.tsx"],"sourcesContent":["/**\n * @license\n * Copyright 2023 Aglyn LLC\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *   http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\nimport { forwardRef } from 'react'\n\nexport interface ResizeableStackProps extends JSX.OverrideableComponentProps {\n  children: JSX.Children\n}\n\nexport const ResizeableStack = forwardRef<any, ResizeableStackProps>(\n  (props, ref) => {\n    const { jjj } = props\n\n    return <div></div>\n  },\n)\n"],"names":["forwardRef","ResizeableStack","props","ref","jjj","div"],"mappings":";AAAA;;;;;;;;;;;;;;;CAeC,GACD,SAASA,UAAU,QAAQ,QAAO;AAMlC,OAAO,MAAMC,gCAAkBD,WAC7B,CAACE,OAAOC;IACN,MAAM,EAAEC,GAAG,EAAE,GAAGF;IAEhB,qBAAO,KAACG;AACV,GACD"}

package/src/lib/components/row-actions-menu.component.d.ts

@@ -0,0 +1,53 @@
+import { type ReactNode } from 'react';
+export interface RowActionsMenuItem {
+    key: string;
+    label: string;
+    icon?: ReactNode;
+    /**
+     * Where the item navigates. An item that carries one renders as a real
+     * anchor, so it can be middle-clicked into a new tab, copied, or opened
+     * from the browser's own context menu — the affordances a click handler
+     * cannot offer however faithfully it calls `router.push`.
+     */
+    href?: string;
+    /** `href` leaves the console, so it opens in a new tab. */
+    external?: boolean;
+    /** For items that open a dialog rather than navigate. */
+    onClick?: () => void;
+    /** Renders the row in the error colour, for destructive actions. */
+    destructive?: boolean;
+    disabled?: boolean;
+    /**
+     * Why the item cannot be used, shown as its tooltip. Mirrors the quick
+     * action's `unavailableReason`: a control that is present but inert says
+     * nothing on its own, and an absent one and an inapplicable one look alike.
+     */
+    disabledReason?: string;
+}
+export interface RowActionsMenuProps {
+    items: RowActionsMenuItem[];
+    /** Distinguishes this row's menu for screen readers. */
+    label?: string;
+}
+/**
+ * Overflow menu for a table row's secondary actions (AGL-701).
+ *
+ * The DataGrid lists get this from `GridActionsCellItem showInMenu`, but the
+ * screens table is hand-rolled markup driven by a `renderRowActions`
+ * render-prop, so `showInMenu` is not available to it and it needs a real
+ * menu of its own.
+ *
+ * Every handler closes the menu first. Delete opens a confirmation, and a
+ * menu left standing over that dialog reads as though the click missed.
+ *
+ * An item that names an `href` is an ANCHOR, not a handler — a navigation
+ * action must be middle-clickable and copyable like any other link. It still
+ * renders as a menu item: the anchor is the MenuItem's own root element, so
+ * it inherits the item's colour, padding and focus ring rather than the
+ * browser's link styling.
+ */
+export declare function RowActionsMenu(props: RowActionsMenuProps): import("react").JSX.Element;
+export declare namespace RowActionsMenu {
+    var displayName: string;
+}
+export default RowActionsMenu;