@lidofinance/lido-app-ui 1.12.0 → 1.14.0

package/dist/cjs/info-tooltip/InfoTooltip.module.css.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"InfoTooltip.module.css.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}

package/dist/cjs/input/Input.cjs

@@ -6,9 +6,9 @@ const react = require('react');
 const cn = require('classnames');
 const Input_module = require('./Input.module.css.cjs');
 const jsxRuntime = require('react/jsx-runtime');
-const Tooltip = require('../tooltip/Tooltip.cjs');
-const IconInfo = require('../icons/components/base/IconInfo.cjs');
+const InfoTooltip = require('../info-tooltip/InfoTooltip.cjs');
 
+/** Bordered text field; `icon` adds a leading icon, `label`/`description`/`error` add the field chrome, `tooltip` puts an info icon next to the label. */
 const Input = /*#__PURE__*/react.forwardRef((_ref, ref) => {
   let {
     size = 'default',
@@ -39,12 +39,8 @@ const Input = /*#__PURE__*/react.forwardRef((_ref, ref) => {
         htmlFor: inputId,
         "data-testid": dataTestId?.label,
         children: label
-      }), tooltip != null ? /*#__PURE__*/jsxRuntime.jsx(Tooltip.Tooltip, {
-        content: tooltip,
-        children: /*#__PURE__*/jsxRuntime.jsx(IconInfo.IconInfo, {
-          className: Input_module.tooltipIcon,
-          "aria-hidden": "true"
-        })
+      }), tooltip != null ? /*#__PURE__*/jsxRuntime.jsx(InfoTooltip.InfoTooltip, {
+        content: tooltip
       }) : null]
     }) : null, /*#__PURE__*/jsxRuntime.jsxs("label", {
       className: cn(Input_module.root, Input_module[size], {

package/dist/cjs/input/Input.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Input.cjs","sources":["../../../src/input/Input.tsx"],"sourcesContent":["import {\n  forwardRef,\n  useId,\n  type InputHTMLAttributes,\n  type ReactNode,\n} from 'react'\n\nimport cn from 'classnames'\n\nimport { IconInfo } from '../icons'\nimport { Tooltip } from '../tooltip'\nimport styles from './Input.module.css'\n\nexport type InputSize = 'default' | 'small'\n\nexport type InputDataTestId = {\n  root?: string\n  label?: string\n  icon?: string\n  input?: string\n  error?: string\n  description?: string\n}\n\nexport type InputProps = Omit<InputHTMLAttributes<HTMLInputElement>, 'size'> & {\n  size?: InputSize\n  icon?: ReactNode\n  label?: ReactNode\n  tooltip?: ReactNode\n  description?: ReactNode\n  error?: ReactNode | boolean\n  dataTestId?: InputDataTestId\n}\n\nexport const Input = forwardRef<HTMLInputElement, InputProps>(\n  (\n    {\n      size = 'default',\n      icon,\n      label,\n      tooltip,\n      description,\n      error,\n      disabled,\n      className,\n      id,\n      dataTestId,\n      ...rest\n    },\n    ref,\n  ) => {\n    const fallbackId = useId()\n    const inputId = id ?? fallbackId\n    const errorId = `${inputId}-error`\n\n    const hasError = Boolean(error)\n    const errorMessage = typeof error === 'boolean' ? null : error\n    const showErrorMessage = errorMessage != null\n\n    return (\n      <div\n        className={cn(styles.field, className)}\n        data-testid={dataTestId?.root}\n      >\n        {label != null ? (\n          <span className={styles.labelRow}>\n            <label\n              className={styles.label}\n              htmlFor={inputId}\n              data-testid={dataTestId?.label}\n            >\n              {label}\n            </label>\n            {tooltip != null ? (\n              <Tooltip content={tooltip}>\n                <IconInfo className={styles.tooltipIcon} aria-hidden='true' />\n              </Tooltip>\n            ) : null}\n          </span>\n        ) : null}\n        <label\n          className={cn(styles.root, styles[size], {\n            [styles.error]: hasError,\n            [styles.disabled]: disabled,\n          })}\n        >\n          {icon ? (\n            <span\n              className={styles.icon}\n              aria-hidden='true'\n              data-testid={dataTestId?.icon}\n            >\n              {icon}\n            </span>\n          ) : null}\n          <input\n            ref={ref}\n            id={inputId}\n            className={styles.input}\n            disabled={disabled}\n            aria-invalid={hasError || undefined}\n            aria-describedby={showErrorMessage ? errorId : undefined}\n            data-testid={dataTestId?.input}\n            {...rest}\n          />\n        </label>\n        {showErrorMessage ? (\n          <p\n            id={errorId}\n            className={styles.errorText}\n            role='alert'\n            data-testid={dataTestId?.error}\n          >\n            {errorMessage}\n          </p>\n        ) : null}\n        {description != null ? (\n          <p\n            className={styles.description}\n            data-testid={dataTestId?.description}\n          >\n            {description}\n          </p>\n        ) : null}\n      </div>\n    )\n  },\n)\n\nInput.displayName = 'Input'\n"],"names":["Input","forwardRef","_ref","ref","size","icon","label","tooltip","description","error","disabled","className","id","dataTestId","rest","fallbackId","useId","inputId","errorId","hasError","Boolean","errorMessage","showErrorMessage","_jsxs","cn","styles","field","root","children","labelRow","_jsx","htmlFor","Tooltip","content","IconInfo","tooltipIcon","input","undefined","errorText","role","displayName"],"mappings":"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"}
+{"version":3,"file":"Input.cjs","sources":["../../../src/input/Input.tsx"],"sourcesContent":["import {\n  forwardRef,\n  useId,\n  type InputHTMLAttributes,\n  type ReactNode,\n} from 'react'\n\nimport cn from 'classnames'\n\nimport { InfoTooltip } from '../info-tooltip'\nimport styles from './Input.module.css'\n\nexport type InputSize = 'default' | 'small'\n\nexport type InputDataTestId = {\n  root?: string\n  label?: string\n  icon?: string\n  input?: string\n  error?: string\n  description?: string\n}\n\nexport type InputProps = Omit<InputHTMLAttributes<HTMLInputElement>, 'size'> & {\n  size?: InputSize\n  icon?: ReactNode\n  label?: ReactNode\n  tooltip?: ReactNode\n  description?: ReactNode\n  error?: ReactNode | boolean\n  dataTestId?: InputDataTestId\n}\n\n/** Bordered text field; `icon` adds a leading icon, `label`/`description`/`error` add the field chrome, `tooltip` puts an info icon next to the label. */\nexport const Input = forwardRef<HTMLInputElement, InputProps>(\n  (\n    {\n      size = 'default',\n      icon,\n      label,\n      tooltip,\n      description,\n      error,\n      disabled,\n      className,\n      id,\n      dataTestId,\n      ...rest\n    },\n    ref,\n  ) => {\n    const fallbackId = useId()\n    const inputId = id ?? fallbackId\n    const errorId = `${inputId}-error`\n\n    const hasError = Boolean(error)\n    const errorMessage = typeof error === 'boolean' ? null : error\n    const showErrorMessage = errorMessage != null\n\n    return (\n      <div\n        className={cn(styles.field, className)}\n        data-testid={dataTestId?.root}\n      >\n        {label != null ? (\n          <span className={styles.labelRow}>\n            <label\n              className={styles.label}\n              htmlFor={inputId}\n              data-testid={dataTestId?.label}\n            >\n              {label}\n            </label>\n            {tooltip != null ? <InfoTooltip content={tooltip} /> : null}\n          </span>\n        ) : null}\n        <label\n          className={cn(styles.root, styles[size], {\n            [styles.error]: hasError,\n            [styles.disabled]: disabled,\n          })}\n        >\n          {icon ? (\n            <span\n              className={styles.icon}\n              aria-hidden='true'\n              data-testid={dataTestId?.icon}\n            >\n              {icon}\n            </span>\n          ) : null}\n          <input\n            ref={ref}\n            id={inputId}\n            className={styles.input}\n            disabled={disabled}\n            aria-invalid={hasError || undefined}\n            aria-describedby={showErrorMessage ? errorId : undefined}\n            data-testid={dataTestId?.input}\n            {...rest}\n          />\n        </label>\n        {showErrorMessage ? (\n          <p\n            id={errorId}\n            className={styles.errorText}\n            role='alert'\n            data-testid={dataTestId?.error}\n          >\n            {errorMessage}\n          </p>\n        ) : null}\n        {description != null ? (\n          <p\n            className={styles.description}\n            data-testid={dataTestId?.description}\n          >\n            {description}\n          </p>\n        ) : null}\n      </div>\n    )\n  },\n)\n\nInput.displayName = 'Input'\n"],"names":["Input","forwardRef","_ref","ref","size","icon","label","tooltip","description","error","disabled","className","id","dataTestId","rest","fallbackId","useId","inputId","errorId","hasError","Boolean","errorMessage","showErrorMessage","_jsxs","cn","styles","field","root","children","labelRow","_jsx","htmlFor","InfoTooltip","content","input","undefined","errorText","role","displayName"],"mappings":"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"}

package/dist/cjs/input/Input.module.css.cjs

@@ -1,6 +1,6 @@
 'use strict';
 
-const styles = {"field":"Input-module_field__INC-m","labelRow":"Input-module_labelRow__AT-Kg","label":"Input-module_label__1UZiS","tooltipIcon":"Input-module_tooltipIcon__W8NYt","root":"Input-module_root__zCKm2","input":"Input-module_input__paElZ","error":"Input-module_error__kcS-O","disabled":"Input-module_disabled__fbybp","default":"Input-module_default__UeWH5","small":"Input-module_small__ESlJP","icon":"Input-module_icon__2IBf9","errorText":"Input-module_errorText__jYCqP","description":"Input-module_description__EVlJm"};
+const styles = {"field":"Input-module_field__INC-m","labelRow":"Input-module_labelRow__AT-Kg","label":"Input-module_label__1UZiS","root":"Input-module_root__zCKm2","input":"Input-module_input__paElZ","error":"Input-module_error__kcS-O","disabled":"Input-module_disabled__fbybp","default":"Input-module_default__UeWH5","small":"Input-module_small__ESlJP","icon":"Input-module_icon__2IBf9","errorText":"Input-module_errorText__jYCqP","description":"Input-module_description__EVlJm"};
 
 module.exports = styles;
 //# sourceMappingURL=Input.module.css.cjs.map

package/dist/cjs/link-provider/Anchor.cjs

@@ -17,13 +17,33 @@ const pickLink = (_ref, href, _ref2) => {
     download
   } = _ref2;
   if (ABSOLUTE_URL.test(href)) return externalComponent;
-  if (href.startsWith('#') || target && target !== '_self' || download !== undefined) return undefined;
+  if (href.startsWith('#') || target && target !== '_self' || download != null && download !== false) return undefined;
   return component;
 };
 
 /** `<a>` that hands in-app hrefs to `LinkProvider`'s `component` and absolute URLs to its `externalComponent`. */
-const Anchor = /*#__PURE__*/react.forwardRef((props, ref) => {
+const Anchor = /*#__PURE__*/react.forwardRef((_ref3, ref) => {
+  let {
+    external,
+    disabled,
+    linkProps,
+    ...rest
+  } = _ref3;
   const links = LinkProvider.useLinkComponents();
+  const props = {
+    ...rest,
+    ...(external && {
+      target: rest.target ?? '_blank',
+      rel: rest.rel ?? 'noopener noreferrer'
+    }),
+    ...(disabled && {
+      href: undefined,
+      onClick: undefined,
+      tabIndex: undefined,
+      role: rest.role ?? 'link',
+      'aria-disabled': true
+    })
+  };
   const {
     href
   } = props;
@@ -32,6 +52,7 @@ const Anchor = /*#__PURE__*/react.forwardRef((props, ref) => {
     if (Link) return /*#__PURE__*/jsxRuntime.jsx(Link, {
       ref: ref,
       ...props,
+      ...linkProps,
       href: href
     });
   }

package/dist/cjs/link-provider/Anchor.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Anchor.cjs","sources":["../../../src/link-provider/Anchor.tsx"],"sourcesContent":["import { forwardRef, type AnchorHTMLAttributes } from 'react'\n\nimport { useLinkComponents, type LinkComponents } from './LinkProvider'\n\nconst ABSOLUTE_URL = /^([a-z][a-z\\d+.-]*:|\\/\\/)/i\n\nconst pickLink = (\n  { component, externalComponent }: LinkComponents,\n  href: string,\n  { target, download }: AnchorHTMLAttributes<HTMLAnchorElement>,\n) => {\n  if (ABSOLUTE_URL.test(href)) return externalComponent\n  if (\n    href.startsWith('#') ||\n    (target && target !== '_self') ||\n    download !== undefined\n  )\n    return undefined\n  return component\n}\n\n/** `<a>` that hands in-app hrefs to `LinkProvider`'s `component` and absolute URLs to its `externalComponent`. */\nexport const Anchor = forwardRef<\n  HTMLAnchorElement,\n  AnchorHTMLAttributes<HTMLAnchorElement>\n>((props, ref) => {\n  const links = useLinkComponents()\n  const { href } = props\n\n  if (href !== undefined) {\n    const Link = pickLink(links, href, props)\n    if (Link) return <Link ref={ref} {...props} href={href} />\n  }\n\n  // eslint-disable-next-line jsx-a11y/anchor-has-content -- children arrive via props\n  return <a ref={ref} {...props} />\n})\n\nAnchor.displayName = 'Anchor'\n"],"names":["ABSOLUTE_URL","pickLink","_ref","href","_ref2","component","externalComponent","target","download","test","startsWith","undefined","Anchor","forwardRef","props","ref","links","useLinkComponents","Link","_jsx","displayName"],"mappings":";;;;;;;;AAIA,MAAMA,YAAY,GAAG,4BAA4B,CAAA;AAEjD,MAAMC,QAAQ,GAAGA,CAAAC,IAAA,EAEfC,IAAY,EAAAC,KAAA,KAET;EAAA,IAHH;IAAEC,SAAS;AAAEC,IAAAA,iBAAAA;AAAkC,GAAC,GAAAJ,IAAA,CAAA;EAAA,IAEhD;IAAEK,MAAM;AAAEC,IAAAA,QAAAA;AAAkD,GAAC,GAAAJ,KAAA,CAAA;EAE7D,IAAIJ,YAAY,CAACS,IAAI,CAACN,IAAI,CAAC,EAAE,OAAOG,iBAAiB,CAAA;AACrD,EAAA,IACEH,IAAI,CAACO,UAAU,CAAC,GAAG,CAAC,IACnBH,MAAM,IAAIA,MAAM,KAAK,OAAQ,IAC9BC,QAAQ,KAAKG,SAAS,EAEtB,OAAOA,SAAS,CAAA;AAClB,EAAA,OAAON,SAAS,CAAA;AAClB,CAAC,CAAA;;AAED;AACO,MAAMO,MAAM,gBAAGC,gBAAU,CAG9B,CAACC,KAAK,EAAEC,GAAG,KAAK;AAChB,EAAA,MAAMC,KAAK,GAAGC,8BAAiB,EAAE,CAAA;EACjC,MAAM;AAAEd,IAAAA,IAAAA;AAAK,GAAC,GAAGW,KAAK,CAAA;EAEtB,IAAIX,IAAI,KAAKQ,SAAS,EAAE;IACtB,MAAMO,IAAI,GAAGjB,QAAQ,CAACe,KAAK,EAAEb,IAAI,EAAEW,KAAK,CAAC,CAAA;AACzC,IAAA,IAAII,IAAI,EAAE,oBAAOC,cAAA,CAACD,IAAI,EAAA;AAACH,MAAAA,GAAG,EAAEA,GAAI;AAAA,MAAA,GAAKD,KAAK;AAAEX,MAAAA,IAAI,EAAEA,IAAAA;AAAK,KAAE,CAAC,CAAA;AAC5D,GAAA;;AAEA;AACA,EAAA,oBAAOgB,cAAA,CAAA,GAAA,EAAA;AAAGJ,IAAAA,GAAG,EAAEA,GAAI;IAAA,GAAKD,KAAAA;AAAK,GAAG,CAAC,CAAA;AACnC,CAAC,EAAC;AAEFF,MAAM,CAACQ,WAAW,GAAG,QAAQ;;;;"}
+{"version":3,"file":"Anchor.cjs","sources":["../../../src/link-provider/Anchor.tsx"],"sourcesContent":["import { forwardRef, type AnchorHTMLAttributes } from 'react'\n\nimport {\n  useLinkComponents,\n  type LinkComponents,\n  type LinkRouterProps,\n} from './LinkProvider'\n\nconst ABSOLUTE_URL = /^([a-z][a-z\\d+.-]*:|\\/\\/)/i\n\nexport type AnchorProps = AnchorHTMLAttributes<HTMLAnchorElement> & {\n  /** Opens in a new tab: defaults `target` to `_blank` and `rel` to `noopener noreferrer`; an explicit `rel` wins. */\n  external?: boolean\n  /** Renders an href-less `role='link'` with `aria-disabled`, and drops `onClick`. */\n  disabled?: boolean\n  /** Router-only props (e.g. `prefetch`), passed to `LinkProvider` components and never to a plain `<a>`. */\n  linkProps?: LinkRouterProps\n}\n\nconst pickLink = (\n  { component, externalComponent }: LinkComponents,\n  href: string,\n  { target, download }: AnchorHTMLAttributes<HTMLAnchorElement>,\n) => {\n  if (ABSOLUTE_URL.test(href)) return externalComponent\n  if (\n    href.startsWith('#') ||\n    (target && target !== '_self') ||\n    (download != null && download !== false)\n  )\n    return undefined\n  return component\n}\n\n/** `<a>` that hands in-app hrefs to `LinkProvider`'s `component` and absolute URLs to its `externalComponent`. */\nexport const Anchor = forwardRef<HTMLAnchorElement, AnchorProps>(\n  ({ external, disabled, linkProps, ...rest }, ref) => {\n    const links = useLinkComponents()\n    const props: AnchorHTMLAttributes<HTMLAnchorElement> = {\n      ...rest,\n      ...(external && {\n        target: rest.target ?? '_blank',\n        rel: rest.rel ?? 'noopener noreferrer',\n      }),\n      ...(disabled && {\n        href: undefined,\n        onClick: undefined,\n        tabIndex: undefined,\n        role: rest.role ?? 'link',\n        'aria-disabled': true,\n      }),\n    }\n    const { href } = props\n\n    if (href !== undefined) {\n      const Link = pickLink(links, href, props)\n      if (Link) return <Link ref={ref} {...props} {...linkProps} href={href} />\n    }\n\n    // eslint-disable-next-line jsx-a11y/anchor-has-content -- children arrive via props\n    return <a ref={ref} {...props} />\n  },\n)\n\nAnchor.displayName = 'Anchor'\n"],"names":["ABSOLUTE_URL","pickLink","_ref","href","_ref2","component","externalComponent","target","download","test","startsWith","undefined","Anchor","forwardRef","_ref3","ref","external","disabled","linkProps","rest","links","useLinkComponents","props","rel","onClick","tabIndex","role","Link","_jsx","displayName"],"mappings":";;;;;;;;AAQA,MAAMA,YAAY,GAAG,4BAA4B,CAAA;AAWjD,MAAMC,QAAQ,GAAGA,CAAAC,IAAA,EAEfC,IAAY,EAAAC,KAAA,KAET;EAAA,IAHH;IAAEC,SAAS;AAAEC,IAAAA,iBAAAA;AAAkC,GAAC,GAAAJ,IAAA,CAAA;EAAA,IAEhD;IAAEK,MAAM;AAAEC,IAAAA,QAAAA;AAAkD,GAAC,GAAAJ,KAAA,CAAA;EAE7D,IAAIJ,YAAY,CAACS,IAAI,CAACN,IAAI,CAAC,EAAE,OAAOG,iBAAiB,CAAA;EACrD,IACEH,IAAI,CAACO,UAAU,CAAC,GAAG,CAAC,IACnBH,MAAM,IAAIA,MAAM,KAAK,OAAQ,IAC7BC,QAAQ,IAAI,IAAI,IAAIA,QAAQ,KAAK,KAAM,EAExC,OAAOG,SAAS,CAAA;AAClB,EAAA,OAAON,SAAS,CAAA;AAClB,CAAC,CAAA;;AAED;AACO,MAAMO,MAAM,gBAAGC,gBAAU,CAC9B,CAAAC,KAAA,EAA6CC,GAAG,KAAK;EAAA,IAApD;IAAEC,QAAQ;IAAEC,QAAQ;IAAEC,SAAS;IAAE,GAAGC,IAAAA;AAAK,GAAC,GAAAL,KAAA,CAAA;AACzC,EAAA,MAAMM,KAAK,GAAGC,8BAAiB,EAAE,CAAA;AACjC,EAAA,MAAMC,KAA8C,GAAG;AACrD,IAAA,GAAGH,IAAI;AACP,IAAA,IAAIH,QAAQ,IAAI;AACdT,MAAAA,MAAM,EAAEY,IAAI,CAACZ,MAAM,IAAI,QAAQ;AAC/BgB,MAAAA,GAAG,EAAEJ,IAAI,CAACI,GAAG,IAAI,qBAAA;AACnB,KAAC,CAAC;AACF,IAAA,IAAIN,QAAQ,IAAI;AACdd,MAAAA,IAAI,EAAEQ,SAAS;AACfa,MAAAA,OAAO,EAAEb,SAAS;AAClBc,MAAAA,QAAQ,EAAEd,SAAS;AACnBe,MAAAA,IAAI,EAAEP,IAAI,CAACO,IAAI,IAAI,MAAM;AACzB,MAAA,eAAe,EAAE,IAAA;KAClB,CAAA;GACF,CAAA;EACD,MAAM;AAAEvB,IAAAA,IAAAA;AAAK,GAAC,GAAGmB,KAAK,CAAA;EAEtB,IAAInB,IAAI,KAAKQ,SAAS,EAAE;IACtB,MAAMgB,IAAI,GAAG1B,QAAQ,CAACmB,KAAK,EAAEjB,IAAI,EAAEmB,KAAK,CAAC,CAAA;AACzC,IAAA,IAAIK,IAAI,EAAE,oBAAOC,cAAA,CAACD,IAAI,EAAA;AAACZ,MAAAA,GAAG,EAAEA,GAAI;AAAA,MAAA,GAAKO,KAAK;AAAA,MAAA,GAAMJ,SAAS;AAAEf,MAAAA,IAAI,EAAEA,IAAAA;AAAK,KAAE,CAAC,CAAA;AAC3E,GAAA;;AAEA;AACA,EAAA,oBAAOyB,cAAA,CAAA,GAAA,EAAA;AAAGb,IAAAA,GAAG,EAAEA,GAAI;IAAA,GAAKO,KAAAA;AAAK,GAAG,CAAC,CAAA;AACnC,CACF,EAAC;AAEDV,MAAM,CAACiB,WAAW,GAAG,QAAQ;;;;"}

package/dist/cjs/link-provider/LinkProvider.cjs

@@ -6,7 +6,7 @@ const react = require('react');
 const jsxRuntime = require('react/jsx-runtime');
 
 const LinkContext = /*#__PURE__*/react.createContext({});
-/** Renders app-ui links with your components: `component` for in-app hrefs (e.g. Next.js `Link`), `externalComponent` for absolute URLs; both must forward `ref` to an `<a>`. Pass stable references (module-level, not inline functions): inline ones remount every link on each render. */
+/** Renders app-ui links with your components: `component` for in-app hrefs (e.g. Next.js `Link`), `externalComponent` for absolute URLs; both must be `forwardRef` components that forward `ref` to an `<a>`. Pass stable references (module-level, not inline functions): inline ones remount every link on each render. In-app hash links, `download` links and non-`_self` `target` links stay a plain `<a>`; absolute URLs always go to `externalComponent` when set. `TextLink`, `NavLink`, `SmallCard`, `LinkButton`, `Tag`, `Breadcrumbs` items and `Logo` with `href` use it. */
 const LinkProvider = _ref => {
   let {
     component,

package/dist/cjs/link-provider/LinkProvider.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"LinkProvider.cjs","sources":["../../../src/link-provider/LinkProvider.tsx"],"sourcesContent":["import {\n  createContext,\n  useContext,\n  useMemo,\n  type AnchorHTMLAttributes,\n  type ReactNode,\n  type Ref,\n} from 'react'\n\nexport type LinkComponentProps = AnchorHTMLAttributes<HTMLAnchorElement> & {\n  href: string\n  ref?: Ref<HTMLAnchorElement>\n}\n\nexport type LinkComponent = (props: LinkComponentProps) => ReactNode\n\nexport type LinkComponents = {\n  component?: LinkComponent\n  externalComponent?: LinkComponent\n}\n\nconst LinkContext = createContext<LinkComponents>({})\n\nexport type LinkProviderProps = LinkComponents & {\n  children?: ReactNode\n}\n\n/** Renders app-ui links with your components: `component` for in-app hrefs (e.g. Next.js `Link`), `externalComponent` for absolute URLs; both must forward `ref` to an `<a>`. Pass stable references (module-level, not inline functions): inline ones remount every link on each render. */\nexport const LinkProvider = ({\n  component,\n  externalComponent,\n  children,\n}: LinkProviderProps) => {\n  const value = useMemo(\n    () => ({ component, externalComponent }),\n    [component, externalComponent],\n  )\n  return <LinkContext.Provider value={value}>{children}</LinkContext.Provider>\n}\n\nexport const useLinkComponents = () => useContext(LinkContext)\n"],"names":["LinkContext","createContext","LinkProvider","_ref","component","externalComponent","children","value","useMemo","_jsx","Provider","useLinkComponents","useContext"],"mappings":";;;;;;;AAqBA,MAAMA,WAAW,gBAAGC,mBAAa,CAAiB,EAAE,CAAC,CAAA;AAMrD;AACaC,MAAAA,YAAY,GAAGC,IAAA,IAIH;EAAA,IAJI;IAC3BC,SAAS;IACTC,iBAAiB;AACjBC,IAAAA,QAAAA;AACiB,GAAC,GAAAH,IAAA,CAAA;AAClB,EAAA,MAAMI,KAAK,GAAGC,aAAO,CACnB,OAAO;IAAEJ,SAAS;AAAEC,IAAAA,iBAAAA;AAAkB,GAAC,CAAC,EACxC,CAACD,SAAS,EAAEC,iBAAiB,CAC/B,CAAC,CAAA;AACD,EAAA,oBAAOI,cAAA,CAACT,WAAW,CAACU,QAAQ,EAAA;AAACH,IAAAA,KAAK,EAAEA,KAAM;AAAAD,IAAAA,QAAA,EAAEA,QAAAA;AAAQ,GAAuB,CAAC,CAAA;AAC9E,EAAC;AAEM,MAAMK,iBAAiB,GAAGA,MAAMC,gBAAU,CAACZ,WAAW;;;;;"}
+{"version":3,"file":"LinkProvider.cjs","sources":["../../../src/link-provider/LinkProvider.tsx"],"sourcesContent":["import {\n  createContext,\n  useContext,\n  useMemo,\n  type AnchorHTMLAttributes,\n  type ReactNode,\n  type Ref,\n} from 'react'\n\n/** Augment via `declare module '@lidofinance/lido-app-ui'` to type router-only props (e.g. Next's `prefetch`), set per link with `linkProps`. */\n// eslint-disable-next-line @typescript-eslint/no-empty-object-type\nexport interface LinkRouterProps {}\n\nexport type LinkComponentProps = AnchorHTMLAttributes<HTMLAnchorElement> &\n  LinkRouterProps & {\n    href: string\n    ref?: Ref<HTMLAnchorElement>\n  }\n\n/** Wrap adapters in `forwardRef`: under React 18 `ref` arrives as the second argument, never as a prop. */\nexport type LinkComponent = (props: LinkComponentProps) => ReactNode\n\nexport type LinkComponents = {\n  /** Renders in-app hrefs (relative, not hash, `download` or non-`_self` `target`). */\n  component?: LinkComponent\n  /** Renders absolute URLs, including `mailto:` and protocol-relative `//`. */\n  externalComponent?: LinkComponent\n}\n\nconst LinkContext = createContext<LinkComponents>({})\n\nexport type LinkProviderProps = LinkComponents & {\n  children?: ReactNode\n}\n\n/** Renders app-ui links with your components: `component` for in-app hrefs (e.g. Next.js `Link`), `externalComponent` for absolute URLs; both must be `forwardRef` components that forward `ref` to an `<a>`. Pass stable references (module-level, not inline functions): inline ones remount every link on each render. In-app hash links, `download` links and non-`_self` `target` links stay a plain `<a>`; absolute URLs always go to `externalComponent` when set. `TextLink`, `NavLink`, `SmallCard`, `LinkButton`, `Tag`, `Breadcrumbs` items and `Logo` with `href` use it. */\nexport const LinkProvider = ({\n  component,\n  externalComponent,\n  children,\n}: LinkProviderProps) => {\n  const value = useMemo(\n    () => ({ component, externalComponent }),\n    [component, externalComponent],\n  )\n  return <LinkContext.Provider value={value}>{children}</LinkContext.Provider>\n}\n\nexport const useLinkComponents = () => useContext(LinkContext)\n"],"names":["LinkContext","createContext","LinkProvider","_ref","component","externalComponent","children","value","useMemo","_jsx","Provider","useLinkComponents","useContext"],"mappings":";;;;;;;AA6BA,MAAMA,WAAW,gBAAGC,mBAAa,CAAiB,EAAE,CAAC,CAAA;AAMrD;AACaC,MAAAA,YAAY,GAAGC,IAAA,IAIH;EAAA,IAJI;IAC3BC,SAAS;IACTC,iBAAiB;AACjBC,IAAAA,QAAAA;AACiB,GAAC,GAAAH,IAAA,CAAA;AAClB,EAAA,MAAMI,KAAK,GAAGC,aAAO,CACnB,OAAO;IAAEJ,SAAS;AAAEC,IAAAA,iBAAAA;AAAkB,GAAC,CAAC,EACxC,CAACD,SAAS,EAAEC,iBAAiB,CAC/B,CAAC,CAAA;AACD,EAAA,oBAAOI,cAAA,CAACT,WAAW,CAACU,QAAQ,EAAA;AAACH,IAAAA,KAAK,EAAEA,KAAM;AAAAD,IAAAA,QAAA,EAAEA,QAAAA;AAAQ,GAAuB,CAAC,CAAA;AAC9E,EAAC;AAEM,MAAMK,iBAAiB,GAAGA,MAAMC,gBAAU,CAACZ,WAAW;;;;;"}

package/dist/cjs/logo/Logo.cjs

@@ -33,13 +33,17 @@ const WORDMARK = /*#__PURE__*/jsxRuntime.jsx("span", {
     })
   })
 });
+
+/** Lido droplet with wordmark and an optional product name. */
 const Logo = /*#__PURE__*/react.forwardRef((_ref, ref) => {
   let {
     variant = 'full',
     product,
     href,
+    external,
     onClick,
     className,
+    dataTestId,
     ...rest
   } = _ref;
   const label = product ? `Lido ${product}` : 'Lido';
@@ -53,6 +57,7 @@ const Logo = /*#__PURE__*/react.forwardRef((_ref, ref) => {
         "aria-hidden": "true"
       }), /*#__PURE__*/jsxRuntime.jsx("span", {
         className: Logo_module.product,
+        "data-testid": dataTestId?.product,
         children: product
       })]
     }) : null]
@@ -63,7 +68,9 @@ const Logo = /*#__PURE__*/react.forwardRef((_ref, ref) => {
       ref: ref,
       className: cn(classes, Logo_module.interactive),
       "aria-label": label,
+      "data-testid": dataTestId?.root,
       href,
+      external: href ? external : undefined,
       onClick,
       ...rest,
       children: content
@@ -74,6 +81,7 @@ const Logo = /*#__PURE__*/react.forwardRef((_ref, ref) => {
     role: "img",
     "aria-label": label,
     className: classes,
+    "data-testid": dataTestId?.root,
     ...rest,
     children: content
   });

package/dist/cjs/logo/Logo.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Logo.cjs","sources":["../../../src/logo/Logo.tsx"],"sourcesContent":["import { forwardRef, type HTMLAttributes, type Ref } from 'react'\n\nimport cn from 'classnames'\n\nimport { ActionElement, type ActionElementProps } from '../utils'\nimport styles from './Logo.module.css'\n\nexport type LogoVariant = 'full' | 'compact' | 'auto'\n\nexport type LogoProps = Omit<HTMLAttributes<HTMLElement>, 'children'> & {\n  variant?: LogoVariant\n  product?: string\n  href?: string\n}\n\nconst DROPLET = (\n  <svg\n    className={styles.droplet}\n    viewBox='38 26 23 32'\n    fill='currentColor'\n    aria-hidden='true'\n  >\n    <path\n      fillRule='evenodd'\n      clipRule='evenodd'\n      d='M49.485 26L57.6 38.398l-8.116 4.613-8.117-4.613L49.485 26zM43.85 37.81l5.634-8.602 5.633 8.601-5.633 3.201-5.634-3.2z'\n    />\n    <path d='M49.478 45.736l-9.416-5.35-.255.39c-2.896 4.428-2.25 10.226 1.554 13.945 4.48 4.372 11.747 4.372 16.233 0 3.812-3.719 4.458-9.517 1.554-13.945l-.254-.39-9.416 5.35z' />\n  </svg>\n)\n\nconst WORDMARK = (\n  <span className={styles.wordmark}>\n    <svg\n      className={styles.wordmarkSvg}\n      viewBox='61 26 101 32'\n      fill='currentColor'\n      aria-hidden='true'\n    >\n      <path d='M90.17 50.449H79.462V33.551h3.267v13.917h7.441v2.981zm16.422 0h-3.267V33.551h3.267V50.45zm13.242 0V33.551h5.597c.85 0 1.54.029 2.062.093 1.351.156 2.519.624 3.492 1.398.988.773 1.735 1.767 2.244 2.98.515 1.207.769 2.534.769 3.982 0 1.448-.254 2.775-.769 3.988-.516 1.207-1.264 2.193-2.244 2.967-.98.773-2.141 1.242-3.492 1.398-.53.064-1.219.092-2.062.092h-5.597zm5.597-3.002c.85 0 1.474-.043 1.873-.12a3.218 3.218 0 001.801-1.001 5.002 5.002 0 001.082-1.923 7.97 7.97 0 00.363-2.406 7.96 7.96 0 00-.371-2.442c-.239-.76-.602-1.398-1.096-1.916a3.123 3.123 0 00-1.779-.972c-.399-.078-1.023-.12-1.873-.12h-2.279V47.44h2.279v.007zm28.191 3.357c-1.707 0-3.188-.362-4.458-1.093a7.432 7.432 0 01-2.919-3.102c-.675-1.327-1.009-2.867-1.009-4.613 0-1.745.334-3.285 1.009-4.613.683-1.327 1.656-2.356 2.919-3.087 1.263-.738 2.751-1.1 4.458-1.1 1.706 0 3.187.37 4.457 1.1a7.27 7.27 0 012.904 3.087c.683 1.328 1.024 2.868 1.024 4.613 0 1.746-.341 3.286-1.024 4.613-.675 1.328-1.641 2.364-2.904 3.102-1.263.73-2.751 1.093-4.457 1.093zm.094-3.002c1.06 0 1.946-.242 2.664-.717.719-.476 1.264-1.15 1.619-2.016.363-.865.538-1.887.538-3.065 0-1.817-.422-3.237-1.271-4.259-.849-1.021-2.098-1.54-3.746-1.54-1.06 0-1.946.242-2.664.717-.719.476-1.264 1.15-1.619 2.016-.363.865-.538 1.887-.538 3.066 0 1.816.421 3.236 1.271 4.258.849 1.022 2.098 1.54 3.746 1.54z' />\n    </svg>\n  </span>\n)\n\nexport const Logo = forwardRef<HTMLElement, LogoProps>(\n  ({ variant = 'full', product, href, onClick, className, ...rest }, ref) => {\n    const label = product ? `Lido ${product}` : 'Lido'\n    const content = (\n      <>\n        <span className={styles.mark}>\n          {DROPLET}\n          {variant === 'compact' ? null : WORDMARK}\n        </span>\n        {product ? (\n          <>\n            <span className={styles.divider} aria-hidden='true' />\n            <span className={styles.product}>{product}</span>\n          </>\n        ) : null}\n      </>\n    )\n    const classes = cn(styles.root, styles[variant], className)\n\n    if (href || onClick) {\n      return (\n        <ActionElement\n          ref={ref as Ref<HTMLAnchorElement | HTMLButtonElement>}\n          className={cn(classes, styles.interactive)}\n          aria-label={label}\n          {...({ href, onClick, ...rest } as ActionElementProps)}\n        >\n          {content}\n        </ActionElement>\n      )\n    }\n\n    return (\n      <span\n        ref={ref as Ref<HTMLSpanElement>}\n        role='img'\n        aria-label={label}\n        className={classes}\n        {...rest}\n      >\n        {content}\n      </span>\n    )\n  },\n)\n\nLogo.displayName = 'Logo'\n"],"names":["DROPLET","_jsxs","className","styles","droplet","viewBox","fill","children","_jsx","fillRule","clipRule","d","WORDMARK","wordmark","wordmarkSvg","Logo","forwardRef","_ref","ref","variant","product","href","onClick","rest","label","content","_Fragment","mark","divider","classes","cn","root","ActionElement","interactive","role","displayName"],"mappings":"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"}
+{"version":3,"file":"Logo.cjs","sources":["../../../src/logo/Logo.tsx"],"sourcesContent":["import {\n  forwardRef,\n  type AnchorHTMLAttributes,\n  type HTMLAttributes,\n  type Ref,\n} from 'react'\n\nimport cn from 'classnames'\n\nimport { ActionElement } from '../utils'\nimport styles from './Logo.module.css'\n\nexport type LogoVariant = 'full' | 'compact' | 'auto'\n\nexport type LogoDataTestId = { root?: string; product?: string }\n\nexport type LogoProps = Omit<HTMLAttributes<HTMLElement>, 'children'> &\n  Pick<AnchorHTMLAttributes<HTMLAnchorElement>, 'target' | 'download'> & {\n    /** `full` shows the wordmark, `compact` drops it, `auto` drops it below `--lido-app-ui-breakpoint-logo` (1024px), overridable per instance with `--lido-app-ui-logo-breakpoint`. */\n    variant?: LogoVariant\n    /** Product name shown after a divider and added to the accessible name. */\n    product?: string\n    /** Renders a link; with only `onClick` it renders a button, otherwise a plain `role=\"img\"` element. */\n    href?: string\n    /** Opens the link in a new tab; needs `href`. */\n    external?: boolean\n    dataTestId?: LogoDataTestId\n  }\n\nconst DROPLET = (\n  <svg\n    className={styles.droplet}\n    viewBox='38 26 23 32'\n    fill='currentColor'\n    aria-hidden='true'\n  >\n    <path\n      fillRule='evenodd'\n      clipRule='evenodd'\n      d='M49.485 26L57.6 38.398l-8.116 4.613-8.117-4.613L49.485 26zM43.85 37.81l5.634-8.602 5.633 8.601-5.633 3.201-5.634-3.2z'\n    />\n    <path d='M49.478 45.736l-9.416-5.35-.255.39c-2.896 4.428-2.25 10.226 1.554 13.945 4.48 4.372 11.747 4.372 16.233 0 3.812-3.719 4.458-9.517 1.554-13.945l-.254-.39-9.416 5.35z' />\n  </svg>\n)\n\nconst WORDMARK = (\n  <span className={styles.wordmark}>\n    <svg\n      className={styles.wordmarkSvg}\n      viewBox='61 26 101 32'\n      fill='currentColor'\n      aria-hidden='true'\n    >\n      <path d='M90.17 50.449H79.462V33.551h3.267v13.917h7.441v2.981zm16.422 0h-3.267V33.551h3.267V50.45zm13.242 0V33.551h5.597c.85 0 1.54.029 2.062.093 1.351.156 2.519.624 3.492 1.398.988.773 1.735 1.767 2.244 2.98.515 1.207.769 2.534.769 3.982 0 1.448-.254 2.775-.769 3.988-.516 1.207-1.264 2.193-2.244 2.967-.98.773-2.141 1.242-3.492 1.398-.53.064-1.219.092-2.062.092h-5.597zm5.597-3.002c.85 0 1.474-.043 1.873-.12a3.218 3.218 0 001.801-1.001 5.002 5.002 0 001.082-1.923 7.97 7.97 0 00.363-2.406 7.96 7.96 0 00-.371-2.442c-.239-.76-.602-1.398-1.096-1.916a3.123 3.123 0 00-1.779-.972c-.399-.078-1.023-.12-1.873-.12h-2.279V47.44h2.279v.007zm28.191 3.357c-1.707 0-3.188-.362-4.458-1.093a7.432 7.432 0 01-2.919-3.102c-.675-1.327-1.009-2.867-1.009-4.613 0-1.745.334-3.285 1.009-4.613.683-1.327 1.656-2.356 2.919-3.087 1.263-.738 2.751-1.1 4.458-1.1 1.706 0 3.187.37 4.457 1.1a7.27 7.27 0 012.904 3.087c.683 1.328 1.024 2.868 1.024 4.613 0 1.746-.341 3.286-1.024 4.613-.675 1.328-1.641 2.364-2.904 3.102-1.263.73-2.751 1.093-4.457 1.093zm.094-3.002c1.06 0 1.946-.242 2.664-.717.719-.476 1.264-1.15 1.619-2.016.363-.865.538-1.887.538-3.065 0-1.817-.422-3.237-1.271-4.259-.849-1.021-2.098-1.54-3.746-1.54-1.06 0-1.946.242-2.664.717-.719.476-1.264 1.15-1.619 2.016-.363.865-.538 1.887-.538 3.066 0 1.816.421 3.236 1.271 4.258.849 1.022 2.098 1.54 3.746 1.54z' />\n    </svg>\n  </span>\n)\n\n/** Lido droplet with wordmark and an optional product name. */\nexport const Logo = forwardRef<HTMLElement, LogoProps>(\n  (\n    {\n      variant = 'full',\n      product,\n      href,\n      external,\n      onClick,\n      className,\n      dataTestId,\n      ...rest\n    },\n    ref,\n  ) => {\n    const label = product ? `Lido ${product}` : 'Lido'\n    const content = (\n      <>\n        <span className={styles.mark}>\n          {DROPLET}\n          {variant === 'compact' ? null : WORDMARK}\n        </span>\n        {product ? (\n          <>\n            <span className={styles.divider} aria-hidden='true' />\n            <span className={styles.product} data-testid={dataTestId?.product}>\n              {product}\n            </span>\n          </>\n        ) : null}\n      </>\n    )\n    const classes = cn(styles.root, styles[variant], className)\n\n    if (href || onClick) {\n      return (\n        <ActionElement\n          ref={ref as Ref<HTMLAnchorElement | HTMLButtonElement>}\n          className={cn(classes, styles.interactive)}\n          aria-label={label}\n          data-testid={dataTestId?.root}\n          {...{\n            href,\n            external: href ? external : undefined,\n            onClick,\n            ...rest,\n          }}\n        >\n          {content}\n        </ActionElement>\n      )\n    }\n\n    return (\n      <span\n        ref={ref as Ref<HTMLSpanElement>}\n        role='img'\n        aria-label={label}\n        className={classes}\n        data-testid={dataTestId?.root}\n        {...rest}\n      >\n        {content}\n      </span>\n    )\n  },\n)\n\nLogo.displayName = 'Logo'\n"],"names":["DROPLET","_jsxs","className","styles","droplet","viewBox","fill","children","_jsx","fillRule","clipRule","d","WORDMARK","wordmark","wordmarkSvg","Logo","forwardRef","_ref","ref","variant","product","href","external","onClick","dataTestId","rest","label","content","_Fragment","mark","divider","classes","cn","root","ActionElement","interactive","undefined","role","displayName"],"mappings":"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"}

package/dist/cjs/message-box/MessageBox.cjs

@@ -17,6 +17,7 @@ const variantIcons = {
   error: IconWarning.IconWarning,
   success: IconCheck.IconCheck
 };
+/** Inline note in a form or card, e.g. to explain a delay, a fee or a risk. */
 const MessageBox = _ref => {
   let {
     variant = 'default',

package/dist/cjs/message-box/MessageBox.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"MessageBox.cjs","sources":["../../../src/message-box/MessageBox.tsx"],"sourcesContent":["import type { HTMLAttributes, ReactNode } from 'react'\n\nimport { IconCheck, IconInfo, IconShield, IconWarning } from '../icons'\nimport cn from 'classnames'\n\nimport styles from './MessageBox.module.css'\n\nexport type MessageBoxVariant =\n  | 'default'\n  | 'info'\n  | 'warning'\n  | 'error'\n  | 'success'\n\nconst variantIcons = {\n  default: IconInfo,\n  info: IconShield,\n  warning: IconWarning,\n  error: IconWarning,\n  success: IconCheck,\n}\n\nexport type MessageBoxDataTestId = {\n  root?: string\n  icon?: string\n  headline?: string\n  description?: string\n}\n\nexport type MessageBoxProps = HTMLAttributes<HTMLDivElement> & {\n  variant?: MessageBoxVariant\n  icon?: boolean\n  headline?: ReactNode\n  dataTestId?: MessageBoxDataTestId\n}\n\nexport const MessageBox = ({\n  variant = 'default',\n  icon = true,\n  headline,\n  className,\n  children,\n  dataTestId,\n  ...rest\n}: MessageBoxProps) => {\n  const Icon = variantIcons[variant]\n\n  return (\n    <div\n      className={cn(styles.box, styles[variant], className)}\n      data-testid={dataTestId?.root}\n      {...rest}\n    >\n      {icon ? (\n        <span\n          className={styles.icon}\n          aria-hidden='true'\n          data-testid={dataTestId?.icon}\n        >\n          <Icon />\n        </span>\n      ) : null}\n      <div className={styles.text}>\n        {headline != null ? (\n          <div className={styles.headline} data-testid={dataTestId?.headline}>\n            {headline}\n          </div>\n        ) : null}\n        <div\n          className={styles.description}\n          data-testid={dataTestId?.description}\n        >\n          {children}\n        </div>\n      </div>\n    </div>\n  )\n}\n"],"names":["variantIcons","default","IconInfo","info","IconShield","warning","IconWarning","error","success","IconCheck","MessageBox","_ref","variant","icon","headline","className","children","dataTestId","rest","Icon","_jsxs","cn","styles","box","root","_jsx","text","description"],"mappings":";;;;;;;;;;;;AAcA,MAAMA,YAAY,GAAG;AACnBC,EAAAA,OAAO,EAAEC,iBAAQ;AACjBC,EAAAA,IAAI,EAAEC,qBAAU;AAChBC,EAAAA,OAAO,EAAEC,uBAAW;AACpBC,EAAAA,KAAK,EAAED,uBAAW;AAClBE,EAAAA,OAAO,EAAEC,mBAAAA;AACX,CAAC,CAAA;AAgBYC,MAAAA,UAAU,GAAGC,IAAA,IAQH;EAAA,IARI;AACzBC,IAAAA,OAAO,GAAG,SAAS;AACnBC,IAAAA,IAAI,GAAG,IAAI;IACXC,QAAQ;IACRC,SAAS;IACTC,QAAQ;IACRC,UAAU;IACV,GAAGC,IAAAA;AACY,GAAC,GAAAP,IAAA,CAAA;AAChB,EAAA,MAAMQ,IAAI,GAAGnB,YAAY,CAACY,OAAO,CAAC,CAAA;AAElC,EAAA,oBACEQ,eAAA,CAAA,KAAA,EAAA;AACEL,IAAAA,SAAS,EAAEM,EAAE,CAACC,iBAAM,CAACC,GAAG,EAAED,iBAAM,CAACV,OAAO,CAAC,EAAEG,SAAS,CAAE;IACtD,aAAaE,EAAAA,UAAU,EAAEO,IAAK;AAAA,IAAA,GAC1BN,IAAI;IAAAF,QAAA,EAAA,CAEPH,IAAI,gBACHY,cAAA,CAAA,MAAA,EAAA;MACEV,SAAS,EAAEO,iBAAM,CAACT,IAAK;AACvB,MAAA,aAAA,EAAY,MAAM;MAClB,aAAaI,EAAAA,UAAU,EAAEJ,IAAK;AAAAG,MAAAA,QAAA,eAE9BS,cAAA,CAACN,IAAI,EAAE,EAAA,CAAA;AAAC,KACJ,CAAC,GACL,IAAI,eACRC,eAAA,CAAA,KAAA,EAAA;MAAKL,SAAS,EAAEO,iBAAM,CAACI,IAAK;AAAAV,MAAAA,QAAA,EACzBF,CAAAA,QAAQ,IAAI,IAAI,gBACfW,cAAA,CAAA,KAAA,EAAA;QAAKV,SAAS,EAAEO,iBAAM,CAACR,QAAS;QAAC,aAAaG,EAAAA,UAAU,EAAEH,QAAS;AAAAE,QAAAA,QAAA,EAChEF,QAAAA;AAAQ,OACN,CAAC,GACJ,IAAI,eACRW,cAAA,CAAA,KAAA,EAAA;QACEV,SAAS,EAAEO,iBAAM,CAACK,WAAY;QAC9B,aAAaV,EAAAA,UAAU,EAAEU,WAAY;AAAAX,QAAAA,QAAA,EAEpCA,QAAAA;AAAQ,OACN,CAAC,CAAA;AAAA,KACH,CAAC,CAAA;AAAA,GACH,CAAC,CAAA;AAEV;;;;"}
+{"version":3,"file":"MessageBox.cjs","sources":["../../../src/message-box/MessageBox.tsx"],"sourcesContent":["import type { HTMLAttributes, ReactNode } from 'react'\n\nimport { IconCheck, IconInfo, IconShield, IconWarning } from '../icons'\nimport cn from 'classnames'\n\nimport styles from './MessageBox.module.css'\n\nexport type MessageBoxVariant =\n  | 'default'\n  | 'info'\n  | 'warning'\n  | 'error'\n  | 'success'\n\nconst variantIcons = {\n  default: IconInfo,\n  info: IconShield,\n  warning: IconWarning,\n  error: IconWarning,\n  success: IconCheck,\n}\n\nexport type MessageBoxDataTestId = {\n  root?: string\n  icon?: string\n  headline?: string\n  description?: string\n}\n\nexport type MessageBoxProps = HTMLAttributes<HTMLDivElement> & {\n  /** `default` neutral, `info` blue, `warning` orange, `error` red, `success` green. */\n  variant?: MessageBoxVariant\n  /** Toggles the leading glyph, which is picked from the variant. */\n  icon?: boolean\n  headline?: ReactNode\n  dataTestId?: MessageBoxDataTestId\n}\n\n/** Inline note in a form or card, e.g. to explain a delay, a fee or a risk. */\nexport const MessageBox = ({\n  variant = 'default',\n  icon = true,\n  headline,\n  className,\n  children,\n  dataTestId,\n  ...rest\n}: MessageBoxProps) => {\n  const Icon = variantIcons[variant]\n\n  return (\n    <div\n      className={cn(styles.box, styles[variant], className)}\n      data-testid={dataTestId?.root}\n      {...rest}\n    >\n      {icon ? (\n        <span\n          className={styles.icon}\n          aria-hidden='true'\n          data-testid={dataTestId?.icon}\n        >\n          <Icon />\n        </span>\n      ) : null}\n      <div className={styles.text}>\n        {headline != null ? (\n          <div className={styles.headline} data-testid={dataTestId?.headline}>\n            {headline}\n          </div>\n        ) : null}\n        <div\n          className={styles.description}\n          data-testid={dataTestId?.description}\n        >\n          {children}\n        </div>\n      </div>\n    </div>\n  )\n}\n"],"names":["variantIcons","default","IconInfo","info","IconShield","warning","IconWarning","error","success","IconCheck","MessageBox","_ref","variant","icon","headline","className","children","dataTestId","rest","Icon","_jsxs","cn","styles","box","root","_jsx","text","description"],"mappings":";;;;;;;;;;;;AAcA,MAAMA,YAAY,GAAG;AACnBC,EAAAA,OAAO,EAAEC,iBAAQ;AACjBC,EAAAA,IAAI,EAAEC,qBAAU;AAChBC,EAAAA,OAAO,EAAEC,uBAAW;AACpBC,EAAAA,KAAK,EAAED,uBAAW;AAClBE,EAAAA,OAAO,EAAEC,mBAAAA;AACX,CAAC,CAAA;AAkBD;AACaC,MAAAA,UAAU,GAAGC,IAAA,IAQH;EAAA,IARI;AACzBC,IAAAA,OAAO,GAAG,SAAS;AACnBC,IAAAA,IAAI,GAAG,IAAI;IACXC,QAAQ;IACRC,SAAS;IACTC,QAAQ;IACRC,UAAU;IACV,GAAGC,IAAAA;AACY,GAAC,GAAAP,IAAA,CAAA;AAChB,EAAA,MAAMQ,IAAI,GAAGnB,YAAY,CAACY,OAAO,CAAC,CAAA;AAElC,EAAA,oBACEQ,eAAA,CAAA,KAAA,EAAA;AACEL,IAAAA,SAAS,EAAEM,EAAE,CAACC,iBAAM,CAACC,GAAG,EAAED,iBAAM,CAACV,OAAO,CAAC,EAAEG,SAAS,CAAE;IACtD,aAAaE,EAAAA,UAAU,EAAEO,IAAK;AAAA,IAAA,GAC1BN,IAAI;IAAAF,QAAA,EAAA,CAEPH,IAAI,gBACHY,cAAA,CAAA,MAAA,EAAA;MACEV,SAAS,EAAEO,iBAAM,CAACT,IAAK;AACvB,MAAA,aAAA,EAAY,MAAM;MAClB,aAAaI,EAAAA,UAAU,EAAEJ,IAAK;AAAAG,MAAAA,QAAA,eAE9BS,cAAA,CAACN,IAAI,EAAE,EAAA,CAAA;AAAC,KACJ,CAAC,GACL,IAAI,eACRC,eAAA,CAAA,KAAA,EAAA;MAAKL,SAAS,EAAEO,iBAAM,CAACI,IAAK;AAAAV,MAAAA,QAAA,EACzBF,CAAAA,QAAQ,IAAI,IAAI,gBACfW,cAAA,CAAA,KAAA,EAAA;QAAKV,SAAS,EAAEO,iBAAM,CAACR,QAAS;QAAC,aAAaG,EAAAA,UAAU,EAAEH,QAAS;AAAAE,QAAAA,QAAA,EAChEF,QAAAA;AAAQ,OACN,CAAC,GACJ,IAAI,eACRW,cAAA,CAAA,KAAA,EAAA;QACEV,SAAS,EAAEO,iBAAM,CAACK,WAAY;QAC9B,aAAaV,EAAAA,UAAU,EAAEU,WAAY;AAAAX,QAAAA,QAAA,EAEpCA,QAAAA;AAAQ,OACN,CAAC,CAAA;AAAA,KACH,CAAC,CAAA;AAAA,GACH,CAAC,CAAA;AAEV;;;;"}

package/dist/cjs/modal/Modal.cjs

@@ -8,10 +8,11 @@ const Modal_module = require('./Modal.module.css.cjs');
 const jsxRuntime = require('react/jsx-runtime');
 const Portal = require('../hooks/Portal.cjs');
 const useBodyScrollLock = require('../hooks/useBodyScrollLock.cjs');
+const useHideOthers = require('../hooks/useHideOthers.cjs');
 const useFocusTrap = require('../hooks/useFocusTrap.cjs');
 const useEscape = require('../hooks/useEscape.cjs');
-const IconButton = require('../icon-button/IconButton.cjs');
-const IconCross = require('../icons/components/base/IconCross.cjs');
+const useOutsideClick = require('../hooks/useOutsideClick.cjs');
+const CloseButton = require('../icon-button/CloseButton.cjs');
 
 const ModalDialog = /*#__PURE__*/react.forwardRef((_ref, ref) => {
   let {
@@ -19,60 +20,103 @@ const ModalDialog = /*#__PURE__*/react.forwardRef((_ref, ref) => {
     subtitle,
     onClose,
     withOverlay = false,
+    inertOthers = false,
     bodyFill = false,
     lockScroll = true,
     closeOnEscape = true,
     closeOnOverlayClick = true,
+    initialFocus,
     children,
     className,
     dataTestId,
     ...rest
   } = _ref;
   const titleId = react.useId();
+  const subtitleId = react.useId();
   const [cardEl, setCardEl] = react.useState(null);
-  const backdropMouseDown = react.useRef(false);
+  // Captured during render: a child's autoFocus is applied at commit, after this.
+  const [returnFocus] = react.useState(() => typeof document === 'undefined' ? null : document.activeElement);
+  const overlayRef = react.useRef(null);
+  const headerRef = react.useRef(null);
+  const pressedScrim = react.useRef(false);
   react.useImperativeHandle(ref, () => cardEl, [cardEl]);
-  useBodyScrollLock.useBodyScrollLock(withOverlay && lockScroll);
-  useFocusTrap.useFocusTrap(cardEl, withOverlay);
+  useBodyScrollLock.useBodyScrollLock({
+    enabled: withOverlay && lockScroll
+  });
+  // Before the trap: cleanups run in order, so inert lifts before focus returns to the opener.
+  useHideOthers.useHideOthers(cardEl, withOverlay && inertOthers);
+  useFocusTrap.useFocusTrap(cardEl, {
+    enabled: withOverlay,
+    initialFocus,
+    returnFocus
+  });
   // Stays registered with closeOnEscape={false} so Escape doesn't fall through to an underlying overlay.
-  useEscape.useEscape(withOverlay, () => {
+  useEscape.useEscape(() => {
     if (closeOnEscape) onClose?.();
+  }, {
+    enabled: withOverlay
   });
-  const handleOverlayMouseDown = event => {
-    backdropMouseDown.current = event.target === event.currentTarget;
+
+  // Sticky header on mobile: scroll-padding keeps focused fields from landing under it (WCAG 2.4.11).
+  react.useEffect(() => {
+    const overlay = overlayRef.current;
+    const header = headerRef.current;
+    if (!withOverlay || !overlay || !header) return;
+    if (typeof ResizeObserver === 'undefined') return;
+    const measure = () => overlay.style.setProperty('--local-header-height', `${header.offsetHeight + 8}px`);
+    measure();
+    const observer = new ResizeObserver(measure);
+    observer.observe(header);
+    return () => observer.disconnect();
+  }, [withOverlay, cardEl]);
+
+  // Joins the outside-click stack even with closeOnOverlayClick={false}, so presses here never reach an overlay underneath.
+  // Decided at pointerdown: the handler only runs while this is the top layer.
+  useOutsideClick.useOutsideClick(cardEl, event => {
+    pressedScrim.current = !(event.button > 0) && event.target === overlayRef.current;
+  }, {
+    enabled: withOverlay
+  });
+  const handleCardPointerDown = event => {
+    pressedScrim.current = false;
+    rest.onPointerDown?.(event);
   };
   const handleOverlayClick = event => {
-    if (closeOnOverlayClick && backdropMouseDown.current && event.target === event.currentTarget) {
+    if (closeOnOverlayClick && pressedScrim.current && event.target === event.currentTarget) {
       onClose?.();
     }
+    pressedScrim.current = false;
   };
   const card = /*#__PURE__*/jsxRuntime.jsxs("div", {
     role: "dialog",
     "aria-modal": withOverlay || undefined,
     "aria-labelledby": title ? titleId : undefined,
+    "aria-describedby": subtitle != null ? subtitleId : undefined,
     "data-testid": dataTestId?.root,
     ...rest,
+    onPointerDown: handleCardPointerDown,
     ref: setCardEl,
     className: cn(Modal_module.card, bodyFill && Modal_module.cardBodyFill, className),
     children: [/*#__PURE__*/jsxRuntime.jsxs("div", {
+      ref: headerRef,
       className: Modal_module.headerGroup,
       children: [/*#__PURE__*/jsxRuntime.jsxs("div", {
         className: Modal_module.header,
         children: [/*#__PURE__*/jsxRuntime.jsx("span", {
+          role: "heading",
+          "aria-level": 2,
           id: titleId,
           className: cn(Modal_module.title, !title && Modal_module.titleHidden),
           "data-testid": dataTestId?.title,
           children: title
-        }), onClose ? /*#__PURE__*/jsxRuntime.jsx(IconButton.IconButton, {
-          variant: "outline",
-          "aria-label": "Close",
-          icon: /*#__PURE__*/jsxRuntime.jsx(IconCross.IconCross, {}),
+        }), onClose ? /*#__PURE__*/jsxRuntime.jsx(CloseButton.CloseButton, {
           onClick: onClose,
           dataTestId: {
             root: dataTestId?.closeButton
           }
         }) : null]
       }), subtitle != null ? /*#__PURE__*/jsxRuntime.jsx("p", {
+        id: subtitleId,
         className: Modal_module.subtitle,
         "data-testid": dataTestId?.subtitle,
         children: subtitle
@@ -89,8 +133,8 @@ const ModalDialog = /*#__PURE__*/react.forwardRef((_ref, ref) => {
     // Pointer-only: a focusable backdrop would add a tab stop before the dialog; keyboard closes via Escape.
     // eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions
     jsxRuntime.jsx("div", {
+      ref: overlayRef,
       className: Modal_module.overlay,
-      onMouseDown: handleOverlayMouseDown,
       onClick: handleOverlayClick,
       "data-testid": dataTestId?.overlay,
       children: card
@@ -100,7 +144,13 @@ const ModalDialog = /*#__PURE__*/react.forwardRef((_ref, ref) => {
 ModalDialog.displayName = 'ModalDialog';
 
 // Hooks live in ModalDialog so they run once the portal has mounted its content.
-const Modal = /*#__PURE__*/react.forwardRef((props, ref) => {
+/** Dialog card for supply, borrow and repay flows; with `withOverlay` it is portaled and closes on Escape and scrim click, traps focus and locks body scroll. `ModalCard` is the bare card. */
+const Modal = /*#__PURE__*/react.forwardRef((_ref2, ref) => {
+  let {
+    open = true,
+    ...props
+  } = _ref2;
+  if (!open) return null;
   const dialog = /*#__PURE__*/jsxRuntime.jsx(ModalDialog, {
     ref: ref,
     ...props
@@ -110,6 +160,14 @@ const Modal = /*#__PURE__*/react.forwardRef((props, ref) => {
   }) : dialog;
 });
 Modal.displayName = 'Modal';
+/** The bare dialog card with no portal or overlay behavior; you own positioning. */
+const ModalCard = /*#__PURE__*/react.forwardRef((props, ref) => /*#__PURE__*/jsxRuntime.jsx(ModalDialog, {
+  ref: ref,
+  ...props,
+  withOverlay: false
+}));
+ModalCard.displayName = 'ModalCard';
 
 exports.Modal = Modal;
+exports.ModalCard = ModalCard;
 //# sourceMappingURL=Modal.cjs.map

package/dist/cjs/modal/Modal.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Modal.cjs","sources":["../../../src/modal/Modal.tsx"],"sourcesContent":["import {\n  forwardRef,\n  useId,\n  useImperativeHandle,\n  useRef,\n  useState,\n  type ComponentPropsWithoutRef,\n  type MouseEvent,\n  type ReactNode,\n} from 'react'\n\nimport { Portal, useBodyScrollLock, useEscape, useFocusTrap } from '../hooks'\nimport { IconButton } from '../icon-button'\nimport { IconCross } from '../icons'\nimport cn from 'classnames'\n\nimport styles from './Modal.module.css'\n\nexport type ModalDataTestId = {\n  root?: string\n  title?: string\n  subtitle?: string\n  closeButton?: string\n  body?: string\n  overlay?: string\n}\n\nexport type ModalProps = Omit<\n  ComponentPropsWithoutRef<'div'>,\n  'title' | 'children'\n> & {\n  title?: ReactNode\n  subtitle?: ReactNode\n  onClose?: () => void\n  /** Wraps the card in a portaled scrim; enables Escape, focus trap and scroll lock. */\n  withOverlay?: boolean\n  bodyFill?: boolean\n  /** Opt out of body scroll lock (overlay only). Default true. */\n  lockScroll?: boolean\n  /** Opt out of Escape-to-close (overlay only). Default true. */\n  closeOnEscape?: boolean\n  /** Opt out of closing on scrim click (overlay only). Default true. */\n  closeOnOverlayClick?: boolean\n  children: ReactNode\n  dataTestId?: ModalDataTestId\n}\n\nconst ModalDialog = forwardRef<HTMLDivElement, ModalProps>(\n  (\n    {\n      title,\n      subtitle,\n      onClose,\n      withOverlay = false,\n      bodyFill = false,\n      lockScroll = true,\n      closeOnEscape = true,\n      closeOnOverlayClick = true,\n      children,\n      className,\n      dataTestId,\n      ...rest\n    },\n    ref,\n  ) => {\n    const titleId = useId()\n    const [cardEl, setCardEl] = useState<HTMLDivElement | null>(null)\n    const backdropMouseDown = useRef(false)\n\n    useImperativeHandle(ref, () => cardEl as HTMLDivElement, [cardEl])\n    useBodyScrollLock(withOverlay && lockScroll)\n    useFocusTrap(cardEl, withOverlay)\n    // Stays registered with closeOnEscape={false} so Escape doesn't fall through to an underlying overlay.\n    useEscape(withOverlay, () => {\n      if (closeOnEscape) onClose?.()\n    })\n\n    const handleOverlayMouseDown = (event: MouseEvent<HTMLDivElement>) => {\n      backdropMouseDown.current = event.target === event.currentTarget\n    }\n\n    const handleOverlayClick = (event: MouseEvent<HTMLDivElement>) => {\n      if (\n        closeOnOverlayClick &&\n        backdropMouseDown.current &&\n        event.target === event.currentTarget\n      ) {\n        onClose?.()\n      }\n    }\n\n    const card = (\n      <div\n        role='dialog'\n        aria-modal={withOverlay || undefined}\n        aria-labelledby={title ? titleId : undefined}\n        data-testid={dataTestId?.root}\n        {...rest}\n        ref={setCardEl}\n        className={cn(styles.card, bodyFill && styles.cardBodyFill, className)}\n      >\n        <div className={styles.headerGroup}>\n          <div className={styles.header}>\n            <span\n              id={titleId}\n              className={cn(styles.title, !title && styles.titleHidden)}\n              data-testid={dataTestId?.title}\n            >\n              {title}\n            </span>\n            {onClose ? (\n              <IconButton\n                variant='outline'\n                aria-label='Close'\n                icon={<IconCross />}\n                onClick={onClose}\n                dataTestId={{ root: dataTestId?.closeButton }}\n              />\n            ) : null}\n          </div>\n          {subtitle != null ? (\n            <p className={styles.subtitle} data-testid={dataTestId?.subtitle}>\n              {subtitle}\n            </p>\n          ) : null}\n        </div>\n        <div className={styles.body} data-testid={dataTestId?.body}>\n          {children}\n        </div>\n      </div>\n    )\n\n    if (!withOverlay) return card\n\n    return (\n      // Pointer-only: a focusable backdrop would add a tab stop before the dialog; keyboard closes via Escape.\n      // eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions\n      <div\n        className={styles.overlay}\n        onMouseDown={handleOverlayMouseDown}\n        onClick={handleOverlayClick}\n        data-testid={dataTestId?.overlay}\n      >\n        {card}\n      </div>\n    )\n  },\n)\n\nModalDialog.displayName = 'ModalDialog'\n\n// Hooks live in ModalDialog so they run once the portal has mounted its content.\nexport const Modal = forwardRef<HTMLDivElement, ModalProps>((props, ref) => {\n  const dialog = <ModalDialog ref={ref} {...props} />\n  return props.withOverlay ? <Portal>{dialog}</Portal> : dialog\n})\n\nModal.displayName = 'Modal'\n"],"names":["ModalDialog","forwardRef","_ref","ref","title","subtitle","onClose","withOverlay","bodyFill","lockScroll","closeOnEscape","closeOnOverlayClick","children","className","dataTestId","rest","titleId","useId","cardEl","setCardEl","useState","backdropMouseDown","useRef","useImperativeHandle","useBodyScrollLock","useFocusTrap","useEscape","handleOverlayMouseDown","event","current","target","currentTarget","handleOverlayClick","card","_jsxs","role","undefined","root","cn","styles","cardBodyFill","headerGroup","header","_jsx","id","titleHidden","IconButton","variant","icon","IconCross","onClick","closeButton","body","overlay","onMouseDown","displayName","Modal","props","dialog","Portal"],"mappings":"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"}
+{"version":3,"file":"Modal.cjs","sources":["../../../src/modal/Modal.tsx"],"sourcesContent":["import {\n  forwardRef,\n  useEffect,\n  useId,\n  useImperativeHandle,\n  useRef,\n  useState,\n  type ComponentPropsWithoutRef,\n  type MouseEvent,\n  type PointerEvent,\n  type ReactNode,\n  type RefObject,\n} from 'react'\n\nimport {\n  Portal,\n  useBodyScrollLock,\n  useEscape,\n  useFocusTrap,\n  useHideOthers,\n  useOutsideClick,\n} from '../hooks'\nimport { CloseButton } from '../icon-button'\nimport cn from 'classnames'\n\nimport styles from './Modal.module.css'\n\nexport type ModalDataTestId = {\n  root?: string\n  title?: string\n  subtitle?: string\n  closeButton?: string\n  body?: string\n  overlay?: string\n}\n\nexport type ModalProps = Omit<\n  ComponentPropsWithoutRef<'div'>,\n  'title' | 'children'\n> & {\n  title?: ReactNode\n  subtitle?: ReactNode\n  onClose?: () => void\n  /** Controlled visibility; omitted means open, so mounting still opens it. */\n  open?: boolean\n  /** Wraps the card in a portaled scrim; enables Escape, focus trap, scroll lock. */\n  withOverlay?: boolean\n  /** With `withOverlay`, makes every other body child inert (including the app root); body-level roots (toasts, live regions) stay live with `data-lido-overlay-keep`. */\n  inertOthers?: boolean\n  /** Stretches the body; only matters full-screen on mobile. */\n  bodyFill?: boolean\n  /** Opt out of body scroll lock (overlay only). Default true. */\n  lockScroll?: boolean\n  /** Opt out of Escape-to-close (overlay only). Default true. */\n  closeOnEscape?: boolean\n  /** Opt out of closing on scrim click (overlay only). Default true. */\n  closeOnOverlayClick?: boolean\n  /** Element focused on open; defaults to the first tabbable (Close when `onClose` is set). An `autoFocus` child also keeps focus. */\n  initialFocus?: RefObject<HTMLElement | null>\n  children: ReactNode\n  dataTestId?: ModalDataTestId\n}\n\nconst ModalDialog = forwardRef<HTMLDivElement, ModalProps>(\n  (\n    {\n      title,\n      subtitle,\n      onClose,\n      withOverlay = false,\n      inertOthers = false,\n      bodyFill = false,\n      lockScroll = true,\n      closeOnEscape = true,\n      closeOnOverlayClick = true,\n      initialFocus,\n      children,\n      className,\n      dataTestId,\n      ...rest\n    },\n    ref,\n  ) => {\n    const titleId = useId()\n    const subtitleId = useId()\n    const [cardEl, setCardEl] = useState<HTMLDivElement | null>(null)\n    // Captured during render: a child's autoFocus is applied at commit, after this.\n    const [returnFocus] = useState(() =>\n      typeof document === 'undefined'\n        ? null\n        : (document.activeElement as HTMLElement | null),\n    )\n    const overlayRef = useRef<HTMLDivElement>(null)\n    const headerRef = useRef<HTMLDivElement>(null)\n    const pressedScrim = useRef(false)\n\n    useImperativeHandle(ref, () => cardEl as HTMLDivElement, [cardEl])\n    useBodyScrollLock({ enabled: withOverlay && lockScroll })\n    // Before the trap: cleanups run in order, so inert lifts before focus returns to the opener.\n    useHideOthers(cardEl, withOverlay && inertOthers)\n    useFocusTrap(cardEl, { enabled: withOverlay, initialFocus, returnFocus })\n    // Stays registered with closeOnEscape={false} so Escape doesn't fall through to an underlying overlay.\n    useEscape(\n      () => {\n        if (closeOnEscape) onClose?.()\n      },\n      { enabled: withOverlay },\n    )\n\n    // Sticky header on mobile: scroll-padding keeps focused fields from landing under it (WCAG 2.4.11).\n    useEffect(() => {\n      const overlay = overlayRef.current\n      const header = headerRef.current\n      if (!withOverlay || !overlay || !header) return\n      if (typeof ResizeObserver === 'undefined') return\n      const measure = () =>\n        overlay.style.setProperty(\n          '--local-header-height',\n          `${header.offsetHeight + 8}px`,\n        )\n      measure()\n      const observer = new ResizeObserver(measure)\n      observer.observe(header)\n      return () => observer.disconnect()\n    }, [withOverlay, cardEl])\n\n    // Joins the outside-click stack even with closeOnOverlayClick={false}, so presses here never reach an overlay underneath.\n    // Decided at pointerdown: the handler only runs while this is the top layer.\n    useOutsideClick(\n      cardEl,\n      (event) => {\n        pressedScrim.current =\n          !(event.button > 0) && event.target === overlayRef.current\n      },\n      { enabled: withOverlay },\n    )\n\n    const handleCardPointerDown = (event: PointerEvent<HTMLDivElement>) => {\n      pressedScrim.current = false\n      rest.onPointerDown?.(event)\n    }\n\n    const handleOverlayClick = (event: MouseEvent<HTMLDivElement>) => {\n      if (\n        closeOnOverlayClick &&\n        pressedScrim.current &&\n        event.target === event.currentTarget\n      ) {\n        onClose?.()\n      }\n      pressedScrim.current = false\n    }\n\n    const card = (\n      <div\n        role='dialog'\n        aria-modal={withOverlay || undefined}\n        aria-labelledby={title ? titleId : undefined}\n        aria-describedby={subtitle != null ? subtitleId : undefined}\n        data-testid={dataTestId?.root}\n        {...rest}\n        onPointerDown={handleCardPointerDown}\n        ref={setCardEl}\n        className={cn(styles.card, bodyFill && styles.cardBodyFill, className)}\n      >\n        <div ref={headerRef} className={styles.headerGroup}>\n          <div className={styles.header}>\n            <span\n              role='heading'\n              aria-level={2}\n              id={titleId}\n              className={cn(styles.title, !title && styles.titleHidden)}\n              data-testid={dataTestId?.title}\n            >\n              {title}\n            </span>\n            {onClose ? (\n              <CloseButton\n                onClick={onClose}\n                dataTestId={{ root: dataTestId?.closeButton }}\n              />\n            ) : null}\n          </div>\n          {subtitle != null ? (\n            <p\n              id={subtitleId}\n              className={styles.subtitle}\n              data-testid={dataTestId?.subtitle}\n            >\n              {subtitle}\n            </p>\n          ) : null}\n        </div>\n        <div className={styles.body} data-testid={dataTestId?.body}>\n          {children}\n        </div>\n      </div>\n    )\n\n    if (!withOverlay) return card\n\n    return (\n      // Pointer-only: a focusable backdrop would add a tab stop before the dialog; keyboard closes via Escape.\n      // eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions\n      <div\n        ref={overlayRef}\n        className={styles.overlay}\n        onClick={handleOverlayClick}\n        data-testid={dataTestId?.overlay}\n      >\n        {card}\n      </div>\n    )\n  },\n)\n\nModalDialog.displayName = 'ModalDialog'\n\n// Hooks live in ModalDialog so they run once the portal has mounted its content.\n/** Dialog card for supply, borrow and repay flows; with `withOverlay` it is portaled and closes on Escape and scrim click, traps focus and locks body scroll. `ModalCard` is the bare card. */\nexport const Modal = forwardRef<HTMLDivElement, ModalProps>(\n  ({ open = true, ...props }, ref) => {\n    if (!open) return null\n    const dialog = <ModalDialog ref={ref} {...props} />\n    return props.withOverlay ? <Portal>{dialog}</Portal> : dialog\n  },\n)\n\nModal.displayName = 'Modal'\n\nexport type ModalCardProps = Omit<\n  ModalProps,\n  | 'open'\n  | 'withOverlay'\n  | 'inertOthers'\n  | 'lockScroll'\n  | 'closeOnEscape'\n  | 'closeOnOverlayClick'\n  | 'initialFocus'\n>\n\n/** The bare dialog card with no portal or overlay behavior; you own positioning. */\nexport const ModalCard = forwardRef<HTMLDivElement, ModalCardProps>(\n  (props, ref) => <ModalDialog ref={ref} {...props} withOverlay={false} />,\n)\n\nModalCard.displayName = 'ModalCard'\n"],"names":["ModalDialog","forwardRef","_ref","ref","title","subtitle","onClose","withOverlay","inertOthers","bodyFill","lockScroll","closeOnEscape","closeOnOverlayClick","initialFocus","children","className","dataTestId","rest","titleId","useId","subtitleId","cardEl","setCardEl","useState","returnFocus","document","activeElement","overlayRef","useRef","headerRef","pressedScrim","useImperativeHandle","useBodyScrollLock","enabled","useHideOthers","useFocusTrap","useEscape","useEffect","overlay","current","header","ResizeObserver","measure","style","setProperty","offsetHeight","observer","observe","disconnect","useOutsideClick","event","button","target","handleCardPointerDown","onPointerDown","handleOverlayClick","currentTarget","card","_jsxs","role","undefined","root","cn","styles","cardBodyFill","headerGroup","_jsx","id","titleHidden","CloseButton","onClick","closeButton","body","displayName","Modal","_ref2","open","props","dialog","Portal","ModalCard"],"mappings":"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"}

package/dist/cjs/nav-link/NavLink.cjs

@@ -9,6 +9,7 @@ const NavLink_module = require('./NavLink.module.css.cjs');
 const jsxRuntime = require('react/jsx-runtime');
 const IconLink = require('../icons/components/base/IconLink.cjs');
 
+/** Top-navigation link for a Header; pass `aria-current` for sections active on sub-routes (HeaderNav centers any truthy value). */
 const NavLink = /*#__PURE__*/react.forwardRef((_ref, ref) => {
   let {
     active = false,
@@ -16,24 +17,25 @@ const NavLink = /*#__PURE__*/react.forwardRef((_ref, ref) => {
     external = false,
     className,
     children,
-    target,
-    rel,
+    dataTestId,
     ...rest
   } = _ref;
   return /*#__PURE__*/jsxRuntime.jsxs(Anchor.Anchor, {
     ref: ref,
     className: cn(NavLink_module.link, active && NavLink_module.active, className),
     "aria-current": active ? 'page' : undefined,
-    target: target ?? (external ? '_blank' : undefined),
-    rel: rel ?? (external ? 'noopener noreferrer' : undefined),
+    external: external,
+    "data-testid": dataTestId?.root,
     ...rest,
     children: [icon != null ? /*#__PURE__*/jsxRuntime.jsx("span", {
       className: NavLink_module.icon,
       "aria-hidden": "true",
+      "data-testid": dataTestId?.icon,
       children: icon
     }) : null, children, external ? /*#__PURE__*/jsxRuntime.jsx("span", {
       className: NavLink_module.icon,
       "aria-hidden": "true",
+      "data-testid": dataTestId?.externalIcon,
       children: /*#__PURE__*/jsxRuntime.jsx(IconLink.IconLink, {})
     }) : null]
   });

package/dist/cjs/nav-link/NavLink.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"NavLink.cjs","sources":["../../../src/nav-link/NavLink.tsx"],"sourcesContent":["import { forwardRef, type AnchorHTMLAttributes, type ReactNode } from 'react'\n\nimport cn from 'classnames'\n\nimport { IconLink } from '../icons'\nimport { Anchor } from '../link-provider/Anchor'\nimport styles from './NavLink.module.css'\n\nexport type NavLinkProps = AnchorHTMLAttributes<HTMLAnchorElement> & {\n  active?: boolean\n  icon?: ReactNode\n  external?: boolean\n}\n\nexport const NavLink = forwardRef<HTMLAnchorElement, NavLinkProps>(\n  (\n    {\n      active = false,\n      icon,\n      external = false,\n      className,\n      children,\n      target,\n      rel,\n      ...rest\n    },\n    ref,\n  ) => (\n    <Anchor\n      ref={ref}\n      className={cn(styles.link, active && styles.active, className)}\n      aria-current={active ? 'page' : undefined}\n      target={target ?? (external ? '_blank' : undefined)}\n      rel={rel ?? (external ? 'noopener noreferrer' : undefined)}\n      {...rest}\n    >\n      {icon != null ? (\n        <span className={styles.icon} aria-hidden='true'>\n          {icon}\n        </span>\n      ) : null}\n      {children}\n      {external ? (\n        <span className={styles.icon} aria-hidden='true'>\n          <IconLink />\n        </span>\n      ) : null}\n    </Anchor>\n  ),\n)\n\nNavLink.displayName = 'NavLink'\n"],"names":["NavLink","forwardRef","_ref","ref","active","icon","external","className","children","target","rel","rest","_jsxs","Anchor","cn","styles","link","undefined","_jsx","IconLink","displayName"],"mappings":";;;;;;;;;;;AAcO,MAAMA,OAAO,gBAAGC,gBAAU,CAC/B,CAAAC,IAAA,EAWEC,GAAG,KAAA;EAAA,IAVH;AACEC,IAAAA,MAAM,GAAG,KAAK;IACdC,IAAI;AACJC,IAAAA,QAAQ,GAAG,KAAK;IAChBC,SAAS;IACTC,QAAQ;IACRC,MAAM;IACNC,GAAG;IACH,GAAGC,IAAAA;AACL,GAAC,GAAAT,IAAA,CAAA;EAAA,oBAGDU,eAAA,CAACC,aAAM,EAAA;AACLV,IAAAA,GAAG,EAAEA,GAAI;AACTI,IAAAA,SAAS,EAAEO,EAAE,CAACC,cAAM,CAACC,IAAI,EAAEZ,MAAM,IAAIW,cAAM,CAACX,MAAM,EAAEG,SAAS,CAAE;AAC/D,IAAA,cAAA,EAAcH,MAAM,GAAG,MAAM,GAAGa,SAAU;IAC1CR,MAAM,EAAEA,MAAM,KAAKH,QAAQ,GAAG,QAAQ,GAAGW,SAAS,CAAE;IACpDP,GAAG,EAAEA,GAAG,KAAKJ,QAAQ,GAAG,qBAAqB,GAAGW,SAAS,CAAE;AAAA,IAAA,GACvDN,IAAI;AAAAH,IAAAA,QAAA,EAEPH,CAAAA,IAAI,IAAI,IAAI,gBACXa,cAAA,CAAA,MAAA,EAAA;MAAMX,SAAS,EAAEQ,cAAM,CAACV,IAAK;AAAC,MAAA,aAAA,EAAY,MAAM;AAAAG,MAAAA,QAAA,EAC7CH,IAAAA;KACG,CAAC,GACL,IAAI,EACPG,QAAQ,EACRF,QAAQ,gBACPY,cAAA,CAAA,MAAA,EAAA;MAAMX,SAAS,EAAEQ,cAAM,CAACV,IAAK;AAAC,MAAA,aAAA,EAAY,MAAM;AAAAG,MAAAA,QAAA,eAC9CU,cAAA,CAACC,iBAAQ,EAAE,EAAA,CAAA;KACP,CAAC,GACL,IAAI,CAAA;AAAA,GACF,CAAC,CAAA;AAAA,CAEb,EAAC;AAEDnB,OAAO,CAACoB,WAAW,GAAG,SAAS;;;;"}
+{"version":3,"file":"NavLink.cjs","sources":["../../../src/nav-link/NavLink.tsx"],"sourcesContent":["import { forwardRef, type AnchorHTMLAttributes, type ReactNode } from 'react'\n\nimport cn from 'classnames'\n\nimport { IconLink } from '../icons'\nimport { Anchor, type AnchorProps } from '../link-provider/Anchor'\nimport styles from './NavLink.module.css'\n\nexport type NavLinkDataTestId = {\n  root?: string\n  icon?: string\n  externalIcon?: string\n}\n\nexport type NavLinkProps = AnchorHTMLAttributes<HTMLAnchorElement> & {\n  /** Marks the current page: sets `aria-current=\"page\"` and the active style. */\n  active?: boolean\n  /** Leading icon. */\n  icon?: ReactNode\n  /** Opens in a new tab and appends the external-link arrow. */\n  external?: boolean\n  linkProps?: AnchorProps['linkProps']\n  dataTestId?: NavLinkDataTestId\n}\n\n/** Top-navigation link for a Header; pass `aria-current` for sections active on sub-routes (HeaderNav centers any truthy value). */\nexport const NavLink = forwardRef<HTMLAnchorElement, NavLinkProps>(\n  (\n    {\n      active = false,\n      icon,\n      external = false,\n      className,\n      children,\n      dataTestId,\n      ...rest\n    },\n    ref,\n  ) => (\n    <Anchor\n      ref={ref}\n      className={cn(styles.link, active && styles.active, className)}\n      aria-current={active ? 'page' : undefined}\n      external={external}\n      data-testid={dataTestId?.root}\n      {...rest}\n    >\n      {icon != null ? (\n        <span\n          className={styles.icon}\n          aria-hidden='true'\n          data-testid={dataTestId?.icon}\n        >\n          {icon}\n        </span>\n      ) : null}\n      {children}\n      {external ? (\n        <span\n          className={styles.icon}\n          aria-hidden='true'\n          data-testid={dataTestId?.externalIcon}\n        >\n          <IconLink />\n        </span>\n      ) : null}\n    </Anchor>\n  ),\n)\n\nNavLink.displayName = 'NavLink'\n"],"names":["NavLink","forwardRef","_ref","ref","active","icon","external","className","children","dataTestId","rest","_jsxs","Anchor","cn","styles","link","undefined","root","_jsx","externalIcon","IconLink","displayName"],"mappings":";;;;;;;;;;;AAyBA;AACO,MAAMA,OAAO,gBAAGC,gBAAU,CAC/B,CAAAC,IAAA,EAUEC,GAAG,KAAA;EAAA,IATH;AACEC,IAAAA,MAAM,GAAG,KAAK;IACdC,IAAI;AACJC,IAAAA,QAAQ,GAAG,KAAK;IAChBC,SAAS;IACTC,QAAQ;IACRC,UAAU;IACV,GAAGC,IAAAA;AACL,GAAC,GAAAR,IAAA,CAAA;EAAA,oBAGDS,eAAA,CAACC,aAAM,EAAA;AACLT,IAAAA,GAAG,EAAEA,GAAI;AACTI,IAAAA,SAAS,EAAEM,EAAE,CAACC,cAAM,CAACC,IAAI,EAAEX,MAAM,IAAIU,cAAM,CAACV,MAAM,EAAEG,SAAS,CAAE;AAC/D,IAAA,cAAA,EAAcH,MAAM,GAAG,MAAM,GAAGY,SAAU;AAC1CV,IAAAA,QAAQ,EAAEA,QAAS;IACnB,aAAaG,EAAAA,UAAU,EAAEQ,IAAK;AAAA,IAAA,GAC1BP,IAAI;AAAAF,IAAAA,QAAA,EAEPH,CAAAA,IAAI,IAAI,IAAI,gBACXa,cAAA,CAAA,MAAA,EAAA;MACEX,SAAS,EAAEO,cAAM,CAACT,IAAK;AACvB,MAAA,aAAA,EAAY,MAAM;MAClB,aAAaI,EAAAA,UAAU,EAAEJ,IAAK;AAAAG,MAAAA,QAAA,EAE7BH,IAAAA;KACG,CAAC,GACL,IAAI,EACPG,QAAQ,EACRF,QAAQ,gBACPY,cAAA,CAAA,MAAA,EAAA;MACEX,SAAS,EAAEO,cAAM,CAACT,IAAK;AACvB,MAAA,aAAA,EAAY,MAAM;MAClB,aAAaI,EAAAA,UAAU,EAAEU,YAAa;AAAAX,MAAAA,QAAA,eAEtCU,cAAA,CAACE,iBAAQ,EAAE,EAAA,CAAA;KACP,CAAC,GACL,IAAI,CAAA;AAAA,GACF,CAAC,CAAA;AAAA,CAEb,EAAC;AAEDpB,OAAO,CAACqB,WAAW,GAAG,SAAS;;;;"}