@mittwald/flow-react-components 1.6.0-next.37 → 1.6.0-next.39

package/dist/js/packages/components/src/components/Action/models/ActionState.mjs

@@ -1,9 +1,9 @@
 "use client"
 /* */
-import useSelector from "../../../lib/mobx/useSelector.mjs";
-import { useStatic } from "../../../lib/hooks/useStatic.mjs";
 import { ActionState as ActionState$1, actionStateDurations } from "../../../../../components-base/src/action/ActionState.mjs";
 import "../../../../../components-base/src/index.mjs";
+import useSelector from "../../../lib/mobx/useSelector.mjs";
+import { useStatic } from "../../../lib/hooks/useStatic.mjs";
 //#region src/components/Action/models/ActionState.ts
 var duration = actionStateDurations;
 /**

package/dist/js/packages/components/src/components/Calendar/components/RangeCalendar/helpers/useCalendarDateRangePresets.mjs

@@ -4,9 +4,9 @@ import { useLocalizedStringFormatter } from "../../../../TranslationProvider/use
 import __locale_default from "../../../../../../../../_virtual/_7.locale.mjs";
 import { useContext, useMemo } from "react";
 import { RangeCalendarStateContext } from "react-aria-components";
-import invariant from "invariant";
 import { CalendarDate, toCalendarDate } from "@internationalized/date";
 import { DateTime } from "luxon";
+import invariant from "invariant";
 //#region src/components/Calendar/components/RangeCalendar/helpers/useCalendarDateRangePresets.ts
 var clampCalendarDate = (date, minDate, maxDate) => {
 	if (minDate && date.compare(minDate) < 0) return minDate;

package/dist/js/packages/components/src/components/Link/Link.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Link.mjs","names":["styles","_Fragment","_jsx"],"sources":["../../../../../../../src/components/Link/Link.tsx"],"sourcesContent":["import type {\n  ComponentProps,\n  ComponentType,\n  CSSProperties,\n  MouseEvent,\n  PropsWithChildren,\n} from \"react\";\nimport { useContext } from \"react\";\nimport * as Aria from \"react-aria-components\";\nimport { dynamic, type PropsContext } from \"@/lib/propsContext\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport styles from \"./Link.module.scss\";\nimport clsx from \"clsx\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport {\n  type AlphaColor,\n  isAlphaColor,\n  type PropsWithClassName,\n} from \"@/lib/types/props\";\nimport { linkContext } from \"@/components/Link/context\";\nimport { LinkIcon } from \"@/components/Link/components/LinkIcon\";\nimport { handleLinkClick, useRouter } from \"@react-aria/utils\";\nimport { UiComponentTunnelExit } from \"@/components/UiComponentTunnel/UiComponentTunnelExit\";\nimport { SkeletonTextContent } from \"@/components/SkeletonMode/components/SkeletonTextContent\";\nimport { useSkeletonMode } from \"@/components/SkeletonMode/skeletonModeContext\";\nimport { hasContent } from \"@/components/SkeletonMode/lib/hasContent\";\nimport { containsTextChild } from \"@/lib/react/remote\";\n\nexport interface LinkProps\n  extends\n    PropsWithChildren<Omit<Aria.LinkProps, \"children\" | \"slot\" | \"className\">>,\n    FlowComponentProps<HTMLAnchorElement>,\n    PropsWithClassName {\n  /** Whether the link should be styled for being displayed inside a text. */\n  inline?: boolean;\n  /** An alternative link component. */\n  linkComponent?: ComponentType<Omit<ComponentProps<\"a\">, \"ref\">>;\n  /** The color of the link. @default \"default\" */\n  color?: \"default\" | AlphaColor;\n  /** Marks the link as the currently active one, e.g. in a navigation. */\n  \"aria-current\"?: string;\n  /**\n   * The name of the slot the link is placed in. In action groups: `primary` (at\n   * the end), `secondary` (before the primary action) or `abort` (at the\n   * start).\n   */\n  slot?: string;\n  /** The whiteSpace css value of the element. */\n  whiteSpace?: CSSProperties[\"whiteSpace\"];\n  /** The size of the element. @default \"m\" */\n  size?: \"s\" | \"m\";\n  /** @internal */\n  unstyled?: boolean;\n}\n\n/** @flr-generate all */\nexport const Link = flowComponent(\"Link\", (props) => {\n  const {\n    children,\n    className,\n    inline,\n    linkComponent: linkComponentFromProps,\n    color = \"default\",\n    unstyled = false,\n    \"aria-current\": ariaCurrent,\n    ref,\n    slot: ignoredSlotProp,\n    style,\n    whiteSpace,\n    size = \"m\",\n    onClickCapture: onClickCaptureFromProps,\n    target,\n    download,\n    ...rest\n  } = props;\n\n  const { linkComponent: linkComponentFromContext } = useContext(linkContext);\n  const isSkeleton = useSkeletonMode();\n  const Link = linkComponentFromProps\n    ? (linkComponentFromProps as typeof Aria.Link)\n    : props.href && linkComponentFromContext\n      ? (linkComponentFromContext as typeof Aria.Link)\n      : Aria.Link;\n\n  const router = useRouter();\n\n  /**\n   * An interactive child (e.g. a Button) stops click propagation via React\n   * Aria's `usePress`, so the anchor's own `onClick` never runs and navigation\n   * falls back to a full page load. Handling it in the capture phase (top-down,\n   * before the child) keeps navigation client-side. Only needed for React\n   * Aria's `<a>`; custom link components handle navigation themselves.\n   */\n  const handleClickCapture =\n    Link === Aria.Link && props.href\n      ? (event: MouseEvent<HTMLAnchorElement>) => {\n          onClickCaptureFromProps?.(event);\n          if (event.target !== event.currentTarget) {\n            handleLinkClick(event, router, props.href, props.routerOptions);\n          }\n        }\n      : onClickCaptureFromProps;\n\n  const rootClassName = unstyled\n    ? className\n    : clsx(\n        styles.link,\n        inline && styles.inline,\n        isAlphaColor(color) && styles[color],\n        size === \"s\" && styles[\"size-s\"],\n        className,\n      );\n\n  const propsContext: PropsContext = {\n    Icon: {\n      tunnel: {\n        component: \"Link\",\n        id: \"icon\",\n      },\n      className: styles.icon,\n      size: \"s\",\n    },\n    AlertText: {\n      className: styles.alertText,\n    },\n    AccentBox: { className: styles.accentBox },\n    LayoutCard: { className: styles.layoutCard },\n    Button: {\n      elementType: \"span\",\n      className: styles.button,\n      size: props.size,\n      color: props.color === \"default\" ? undefined : props.color,\n      isDisabled: props.isDisabled,\n      children: dynamic((buttonProps) => (\n        <>\n          {buttonProps.children}\n          <LinkIcon download={download} target={target} unstyled={unstyled} />\n        </>\n      )),\n    },\n  };\n\n  const unsupportedTypingsLinkProps = ariaCurrent\n    ? ({\n        \"aria-current\": true,\n      } as Record<string, unknown>)\n    : {};\n\n  /* Without text of its own — a Link styled as a Button, a Link around a\n     LayoutCard — the content follows its own skeleton rules instead of\n     becoming a text bar. */\n  const hasOnlyElements = hasContent(children) && !containsTextChild(children);\n\n  const textBars = (\n    <SkeletonTextContent defaultWidth=\"6em\">{children}</SkeletonTextContent>\n  );\n\n  const content = (\n    <PropsContextProvider props={propsContext}>\n      {hasOnlyElements ? children : textBars}\n      <LinkIcon\n        withZeroWidthJoiner\n        unstyled={unstyled}\n        target={target}\n        download={download}\n      >\n        <UiComponentTunnelExit id={\"icon\"} component={\"Link\"} />\n      </LinkIcon>\n    </PropsContextProvider>\n  );\n\n  /* react-aria's Link drops `inert`, and a skeleton needs no anchor. */\n  if (isSkeleton) {\n    return (\n      <span className={rootClassName} style={{ ...style, whiteSpace }} inert>\n        {content}\n      </span>\n    );\n  }\n\n  return (\n    <Link\n      {...unsupportedTypingsLinkProps}\n      {...rest}\n      target={target}\n      download={download}\n      onClickCapture={handleClickCapture}\n      className={rootClassName}\n      ref={ref}\n      style={{ ...style, whiteSpace }}\n    >\n      {content}\n    </Link>\n  );\n});\n\nexport default Link;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAyDA,IAAa,OAAO,cAAc,SAAS,UAAU;CACnD,MAAM,EACJ,UACA,WACA,QACA,eAAe,wBACf,QAAQ,WACR,WAAW,OACX,gBAAgB,aAChB,KACA,MAAM,iBACN,OACA,YACA,OAAO,KACP,gBAAgB,yBAChB,QACA,UACA,GAAG,SACD;CAEJ,MAAM,EAAE,eAAe,6BAA6B,WAAW,WAAW;CAC1E,MAAM,aAAa,gBAAgB;CACnC,MAAM,OAAO,yBACR,yBACD,MAAM,QAAQ,2BACX,2BACD,KAAK;CAEX,MAAM,SAAS,UAAU;;;;;;;;CASzB,MAAM,qBACJ,SAAS,KAAK,QAAQ,MAAM,QACvB,UAAyC;EACxC,0BAA0B,KAAK;EAC/B,IAAI,MAAM,WAAW,MAAM,eACzB,gBAAgB,OAAO,QAAQ,MAAM,MAAM,MAAM,aAAa;CAElE,IACA;CAEN,MAAM,gBAAgB,WAClB,YACA,KACEA,oBAAO,MACP,UAAUA,oBAAO,QACjB,aAAa,KAAK,KAAKA,oBAAO,QAC9B,SAAS,OAAOA,oBAAO,WACvB,SACF;CAEJ,MAAM,eAA6B;EACjC,MAAM;GACJ,QAAQ;IACN,WAAW;IACX,IAAI;GACN;GACA,WAAWA,oBAAO;GAClB,MAAM;EACR;EACA,WAAW,EACT,WAAWA,oBAAO,UACpB;EACA,WAAW,EAAE,WAAWA,oBAAO,UAAU;EACzC,YAAY,EAAE,WAAWA,oBAAO,WAAW;EAC3C,QAAQ;GACN,aAAa;GACb,WAAWA,oBAAO;GAClB,MAAM,MAAM;GACZ,OAAO,MAAM,UAAU,YAAY,KAAA,IAAY,MAAM;GACrD,YAAY,MAAM;GAClB,UAAU,SAAS,gBACjB,qBAAAC,YAAA,EAAA,UAAA,CACG,YAAY,UACb,oBAAC,UAAD;IAAoB;IAAkB;IAAkB;GAAW,CAAA,CACnE,EAAA,CAAA,CACH;EACH;CACF;CAEA,MAAM,8BAA8B,cAC/B,EACC,gBAAgB,KAClB,IACA,CAAC;CAKL,MAAM,kBAAkB,WAAW,QAAQ,KAAK,CAAC,kBAAkB,QAAQ;CAM3E,MAAM,UACJ,qBAAC,sBAAD;EAAsB,OAAO;EAA7B,UAAA,CACG,kBAAkB,WALrBC,oBAAC,qBAAD;GAAqB,cAAa;GAAO;EAA8B,CAKvC,GAC9B,oBAAC,UAAD;GACE,qBAAA;GACU;GACF;GACE;GAEV,UAAA,oBAAC,uBAAD;IAAuB,IAAI;IAAQ,WAAW;GAAS,CAAA;EAC/C,CAAA,CACU;;CAIxB,IAAI,YACF,OACE,oBAAC,QAAD;EAAM,WAAW;EAAe,OAAO;GAAE,GAAG;GAAO;EAAW;EAAG,OAAA;EAC9D,UAAA;CACG,CAAA;CAIV,OACE,oBAAC,MAAD;EACE,GAAI;EACJ,GAAI;EACI;EACE;EACV,gBAAgB;EAChB,WAAW;EACN;EACL,OAAO;GAAE,GAAG;GAAO;EAAW;EAE7B,UAAA;CACG,CAAA;AAEV,CAAC"}
+{"version":3,"file":"Link.mjs","names":["styles","_Fragment","_jsx"],"sources":["../../../../../../../src/components/Link/Link.tsx"],"sourcesContent":["import type {\n  ComponentProps,\n  ComponentType,\n  CSSProperties,\n  MouseEvent,\n  PropsWithChildren,\n} from \"react\";\nimport { useContext } from \"react\";\nimport * as Aria from \"react-aria-components\";\nimport { dynamic, type PropsContext } from \"@/lib/propsContext\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport styles from \"./Link.module.scss\";\nimport clsx from \"clsx\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport {\n  type AlphaColor,\n  isAlphaColor,\n  type PropsWithClassName,\n} from \"@/lib/types/props\";\nimport { linkContext } from \"@/components/Link/context\";\nimport { LinkIcon } from \"@/components/Link/components/LinkIcon\";\nimport { handleLinkClick, useRouter } from \"@react-aria/utils\";\nimport { UiComponentTunnelExit } from \"@/components/UiComponentTunnel/UiComponentTunnelExit\";\nimport { SkeletonTextContent } from \"@/components/SkeletonMode/components/SkeletonTextContent\";\nimport { useSkeletonMode } from \"@/components/SkeletonMode/skeletonModeContext\";\nimport { hasContent } from \"@/components/SkeletonMode/lib/hasContent\";\nimport { containsTextChild } from \"@/lib/react/remote\";\n\nexport interface LinkProps\n  extends\n    PropsWithChildren<\n      Omit<Aria.LinkProps, \"children\" | \"slot\" | \"className\" | \"aria-current\">\n    >,\n    FlowComponentProps<HTMLAnchorElement>,\n    PropsWithClassName {\n  /** Whether the link should be styled for being displayed inside a text. */\n  inline?: boolean;\n  /** An alternative link component. */\n  linkComponent?: ComponentType<Omit<ComponentProps<\"a\">, \"ref\">>;\n  /** The color of the link. @default \"default\" */\n  color?: \"default\" | AlphaColor;\n  /** Marks the link as the currently active one, e.g. in a navigation. */\n  \"aria-current\"?: string;\n  /**\n   * The name of the slot the link is placed in. In action groups: `primary` (at\n   * the end), `secondary` (before the primary action) or `abort` (at the\n   * start).\n   */\n  slot?: string;\n  /** The whiteSpace css value of the element. */\n  whiteSpace?: CSSProperties[\"whiteSpace\"];\n  /** The size of the element. @default \"m\" */\n  size?: \"s\" | \"m\";\n  /** @internal */\n  unstyled?: boolean;\n}\n\n/** @flr-generate all */\nexport const Link = flowComponent(\"Link\", (props) => {\n  const {\n    children,\n    className,\n    inline,\n    linkComponent: linkComponentFromProps,\n    color = \"default\",\n    unstyled = false,\n    \"aria-current\": ariaCurrent,\n    ref,\n    slot: ignoredSlotProp,\n    style,\n    whiteSpace,\n    size = \"m\",\n    onClickCapture: onClickCaptureFromProps,\n    target,\n    download,\n    ...rest\n  } = props;\n\n  const { linkComponent: linkComponentFromContext } = useContext(linkContext);\n  const isSkeleton = useSkeletonMode();\n  const Link = linkComponentFromProps\n    ? (linkComponentFromProps as typeof Aria.Link)\n    : props.href && linkComponentFromContext\n      ? (linkComponentFromContext as typeof Aria.Link)\n      : Aria.Link;\n\n  const router = useRouter();\n\n  /**\n   * An interactive child (e.g. a Button) stops click propagation via React\n   * Aria's `usePress`, so the anchor's own `onClick` never runs and navigation\n   * falls back to a full page load. Handling it in the capture phase (top-down,\n   * before the child) keeps navigation client-side. Only needed for React\n   * Aria's `<a>`; custom link components handle navigation themselves.\n   */\n  const handleClickCapture =\n    Link === Aria.Link && props.href\n      ? (event: MouseEvent<HTMLAnchorElement>) => {\n          onClickCaptureFromProps?.(event);\n          if (event.target !== event.currentTarget) {\n            handleLinkClick(event, router, props.href, props.routerOptions);\n          }\n        }\n      : onClickCaptureFromProps;\n\n  const rootClassName = unstyled\n    ? className\n    : clsx(\n        styles.link,\n        inline && styles.inline,\n        isAlphaColor(color) && styles[color],\n        size === \"s\" && styles[\"size-s\"],\n        className,\n      );\n\n  const propsContext: PropsContext = {\n    Icon: {\n      tunnel: {\n        component: \"Link\",\n        id: \"icon\",\n      },\n      className: styles.icon,\n      size: \"s\",\n    },\n    AlertText: {\n      className: styles.alertText,\n    },\n    AccentBox: { className: styles.accentBox },\n    LayoutCard: { className: styles.layoutCard },\n    Button: {\n      elementType: \"span\",\n      className: styles.button,\n      size: props.size,\n      color: props.color === \"default\" ? undefined : props.color,\n      isDisabled: props.isDisabled,\n      children: dynamic((buttonProps) => (\n        <>\n          {buttonProps.children}\n          <LinkIcon download={download} target={target} unstyled={unstyled} />\n        </>\n      )),\n    },\n  };\n\n  const unsupportedTypingsLinkProps = ariaCurrent\n    ? ({\n        \"aria-current\": true,\n      } as Record<string, unknown>)\n    : {};\n\n  /* Without text of its own — a Link styled as a Button, a Link around a\n     LayoutCard — the content follows its own skeleton rules instead of\n     becoming a text bar. */\n  const hasOnlyElements = hasContent(children) && !containsTextChild(children);\n\n  const textBars = (\n    <SkeletonTextContent defaultWidth=\"6em\">{children}</SkeletonTextContent>\n  );\n\n  const content = (\n    <PropsContextProvider props={propsContext}>\n      {hasOnlyElements ? children : textBars}\n      <LinkIcon\n        withZeroWidthJoiner\n        unstyled={unstyled}\n        target={target}\n        download={download}\n      >\n        <UiComponentTunnelExit id={\"icon\"} component={\"Link\"} />\n      </LinkIcon>\n    </PropsContextProvider>\n  );\n\n  /* react-aria's Link drops `inert`, and a skeleton needs no anchor. */\n  if (isSkeleton) {\n    return (\n      <span className={rootClassName} style={{ ...style, whiteSpace }} inert>\n        {content}\n      </span>\n    );\n  }\n\n  return (\n    <Link\n      {...unsupportedTypingsLinkProps}\n      {...rest}\n      target={target}\n      download={download}\n      onClickCapture={handleClickCapture}\n      className={rootClassName}\n      ref={ref}\n      style={{ ...style, whiteSpace }}\n    >\n      {content}\n    </Link>\n  );\n});\n\nexport default Link;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AA2DA,IAAa,OAAO,cAAc,SAAS,UAAU;CACnD,MAAM,EACJ,UACA,WACA,QACA,eAAe,wBACf,QAAQ,WACR,WAAW,OACX,gBAAgB,aAChB,KACA,MAAM,iBACN,OACA,YACA,OAAO,KACP,gBAAgB,yBAChB,QACA,UACA,GAAG,SACD;CAEJ,MAAM,EAAE,eAAe,6BAA6B,WAAW,WAAW;CAC1E,MAAM,aAAa,gBAAgB;CACnC,MAAM,OAAO,yBACR,yBACD,MAAM,QAAQ,2BACX,2BACD,KAAK;CAEX,MAAM,SAAS,UAAU;;;;;;;;CASzB,MAAM,qBACJ,SAAS,KAAK,QAAQ,MAAM,QACvB,UAAyC;EACxC,0BAA0B,KAAK;EAC/B,IAAI,MAAM,WAAW,MAAM,eACzB,gBAAgB,OAAO,QAAQ,MAAM,MAAM,MAAM,aAAa;CAElE,IACA;CAEN,MAAM,gBAAgB,WAClB,YACA,KACEA,oBAAO,MACP,UAAUA,oBAAO,QACjB,aAAa,KAAK,KAAKA,oBAAO,QAC9B,SAAS,OAAOA,oBAAO,WACvB,SACF;CAEJ,MAAM,eAA6B;EACjC,MAAM;GACJ,QAAQ;IACN,WAAW;IACX,IAAI;GACN;GACA,WAAWA,oBAAO;GAClB,MAAM;EACR;EACA,WAAW,EACT,WAAWA,oBAAO,UACpB;EACA,WAAW,EAAE,WAAWA,oBAAO,UAAU;EACzC,YAAY,EAAE,WAAWA,oBAAO,WAAW;EAC3C,QAAQ;GACN,aAAa;GACb,WAAWA,oBAAO;GAClB,MAAM,MAAM;GACZ,OAAO,MAAM,UAAU,YAAY,KAAA,IAAY,MAAM;GACrD,YAAY,MAAM;GAClB,UAAU,SAAS,gBACjB,qBAAAC,YAAA,EAAA,UAAA,CACG,YAAY,UACb,oBAAC,UAAD;IAAoB;IAAkB;IAAkB;GAAW,CAAA,CACnE,EAAA,CAAA,CACH;EACH;CACF;CAEA,MAAM,8BAA8B,cAC/B,EACC,gBAAgB,KAClB,IACA,CAAC;CAKL,MAAM,kBAAkB,WAAW,QAAQ,KAAK,CAAC,kBAAkB,QAAQ;CAM3E,MAAM,UACJ,qBAAC,sBAAD;EAAsB,OAAO;EAA7B,UAAA,CACG,kBAAkB,WALrBC,oBAAC,qBAAD;GAAqB,cAAa;GAAO;EAA8B,CAKvC,GAC9B,oBAAC,UAAD;GACE,qBAAA;GACU;GACF;GACE;GAEV,UAAA,oBAAC,uBAAD;IAAuB,IAAI;IAAQ,WAAW;GAAS,CAAA;EAC/C,CAAA,CACU;;CAIxB,IAAI,YACF,OACE,oBAAC,QAAD;EAAM,WAAW;EAAe,OAAO;GAAE,GAAG;GAAO;EAAW;EAAG,OAAA;EAC9D,UAAA;CACG,CAAA;CAIV,OACE,oBAAC,MAAD;EACE,GAAI;EACJ,GAAI;EACI;EACE;EACV,gBAAgB;EAChB,WAAW;EACN;EACL,OAAO;GAAE,GAAG;GAAO;EAAW;EAE7B,UAAA;CACG,CAAA;AAEV,CAAC"}

package/dist/js/packages/components/src/components/List/model/ListViewMode.mjs

@@ -1,9 +1,9 @@
 "use client"
 /* */
-import useSelector from "../../../lib/mobx/useSelector.mjs";
-import { useStatic } from "../../../lib/hooks/useStatic.mjs";
 import { ListViewMode as ListViewMode$1 } from "../../../../../components-base/src/list/viewMode/ListViewMode.mjs";
 import "../../../../../components-base/src/index.mjs";
+import useSelector from "../../../lib/mobx/useSelector.mjs";
+import { useStatic } from "../../../lib/hooks/useStatic.mjs";
 //#region src/components/List/model/ListViewMode.ts
 /**
 * React's view of the list's layout mode.

package/dist/js/packages/components/src/components/List/model/ReactTable.mjs

@@ -1,11 +1,11 @@
 "use client"
 /* */
-import useSelector from "../../../lib/mobx/useSelector.mjs";
-import { useStatic } from "../../../lib/hooks/useStatic.mjs";
 import { getListColumn } from "../../../../../components-base/src/list/ListModelContext.mjs";
 import { mergeHiddenSorting } from "../../../../../components-base/src/list/sorting/ListSorting.mjs";
 import { ListTable } from "../../../../../components-base/src/list/table/ListTable.mjs";
 import "../../../../../components-base/src/index.mjs";
+import useSelector from "../../../lib/mobx/useSelector.mjs";
+import { useStatic } from "../../../lib/hooks/useStatic.mjs";
 import { Filter } from "./filter/Filter.mjs";
 import { useEffect, useEffectEvent, useState } from "react";
 import { getCoreRowModel, getFacetedUniqueValues, getFilteredRowModel, getPaginationRowModel, getSortedRowModel } from "@tanstack/table-core";

package/dist/js/packages/components/src/components/List/model/loading/IncrementalLoaderState.mjs

@@ -1,9 +1,9 @@
 "use client"
 /* */
-import useSelector from "../../../../lib/mobx/useSelector.mjs";
-import { useStatic } from "../../../../lib/hooks/useStatic.mjs";
 import { ListLoaderState } from "../../../../../../components-base/src/list/loading/ListLoaderState.mjs";
 import "../../../../../../components-base/src/index.mjs";
+import useSelector from "../../../../lib/mobx/useSelector.mjs";
+import { useStatic } from "../../../../lib/hooks/useStatic.mjs";
 //#region src/components/List/model/loading/IncrementalLoaderState.ts
 /**
 * React's view of the list's loading state.

package/dist/js/packages/components/src/components/Table/components/TableCell/TableCell.mjs

@@ -3,7 +3,6 @@
 import { SkeletonText } from "../../../SkeletonText/SkeletonText.mjs";
 import { SkeletonRawText } from "../../../SkeletonMode/components/SkeletonRawText/SkeletonRawText.mjs";
 import Table_module_default from "../../Table.module.mjs";
-import { TableColumn } from "../TableColumn/TableColumn.mjs";
 import clsx from "clsx";
 import { Suspense } from "react";
 import { jsx } from "react/jsx-runtime";
@@ -12,20 +11,14 @@ import * as Aria from "react-aria-components";
 /** @flr-generate all */
 var TableCell = (props) => {
 	const { children, className, rowHeader, horizontalAlign = "start", ...rest } = props;
-	const rootClassName = clsx(Table_module_default.cell, horizontalAlign !== "start" && Table_module_default[`horizontal-align-${horizontalAlign}`], className);
-	const content = /* @__PURE__ */ jsx(Suspense, {
-		fallback: /* @__PURE__ */ jsx(SkeletonText, { width: "100px" }),
-		children: /* @__PURE__ */ jsx(SkeletonRawText, { children })
-	});
-	if (rowHeader) return /* @__PURE__ */ jsx(TableColumn, {
-		className: rootClassName,
-		...rest,
-		children: content
-	});
+	const rootClassName = clsx(Table_module_default.cell, rowHeader && Table_module_default.column, horizontalAlign !== "start" && Table_module_default[`horizontal-align-${horizontalAlign}`], className);
 	return /* @__PURE__ */ jsx(Aria.Cell, {
 		className: rootClassName,
 		...rest,
-		children: content
+		children: /* @__PURE__ */ jsx(Suspense, {
+			fallback: /* @__PURE__ */ jsx(SkeletonText, { width: "100px" }),
+			children: /* @__PURE__ */ jsx(SkeletonRawText, { children })
+		})
 	});
 };
 //#endregion

package/dist/js/packages/components/src/components/Table/components/TableCell/TableCell.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"TableCell.mjs","names":["styles"],"sources":["../../../../../../../../../src/components/Table/components/TableCell/TableCell.tsx"],"sourcesContent":["import type { FC, PropsWithChildren } from \"react\";\nimport { Suspense } from \"react\";\nimport * as Aria from \"react-aria-components\";\nimport clsx from \"clsx\";\nimport styles from \"../../Table.module.scss\";\nimport { SkeletonText } from \"@/components/SkeletonText\";\nimport { TableColumn } from \"@/components/Table/components/TableColumn/TableColumn\";\nimport { SkeletonRawText } from \"@/components/SkeletonMode/components/SkeletonRawText\";\n\nexport interface TableCellProps\n  extends\n    Omit<Aria.CellProps, \"children\" | \"style\" | \"render\">,\n    PropsWithChildren {\n  /** Use cell as row header */\n  rowHeader?: boolean;\n  /** Horizontal alignment of the cell content @default \"start\" */\n  horizontalAlign?: \"start\" | \"center\" | \"end\";\n}\n\n/** @flr-generate all */\nexport const TableCell: FC<TableCellProps> = (props) => {\n  const {\n    children,\n    className,\n    rowHeader,\n    horizontalAlign = \"start\",\n    ...rest\n  } = props;\n\n  const rootClassName = clsx(\n    styles.cell,\n    horizontalAlign !== \"start\" &&\n      styles[`horizontal-align-${horizontalAlign}`],\n    className,\n  );\n\n  const content = (\n    <Suspense fallback={<SkeletonText width=\"100px\" />}>\n      <SkeletonRawText>{children}</SkeletonRawText>\n    </Suspense>\n  );\n\n  if (rowHeader) {\n    return (\n      <TableColumn className={rootClassName} {...rest}>\n        {content}\n      </TableColumn>\n    );\n  }\n\n  return (\n    <Aria.Cell className={rootClassName} {...rest}>\n      {content}\n    </Aria.Cell>\n  );\n};\n\nexport default TableCell;\n"],"mappings":";;;;;;;;;;;;AAoBA,IAAa,aAAiC,UAAU;CACtD,MAAM,EACJ,UACA,WACA,WACA,kBAAkB,SAClB,GAAG,SACD;CAEJ,MAAM,gBAAgB,KACpBA,qBAAO,MACP,oBAAoB,WAClBA,qBAAO,oBAAoB,oBAC7B,SACF;CAEA,MAAM,UACJ,oBAAC,UAAD;EAAU,UAAU,oBAAC,cAAD,EAAc,OAAM,QAAS,CAAA;EAC/C,UAAA,oBAAC,iBAAD,EAAkB,SAA0B,CAAA;CACpC,CAAA;CAGZ,IAAI,WACF,OACE,oBAAC,aAAD;EAAa,WAAW;EAAe,GAAI;EACxC,UAAA;CACU,CAAA;CAIjB,OACE,oBAAC,KAAK,MAAN;EAAW,WAAW;EAAe,GAAI;EACtC,UAAA;CACQ,CAAA;AAEf"}
+{"version":3,"file":"TableCell.mjs","names":["styles"],"sources":["../../../../../../../../../src/components/Table/components/TableCell/TableCell.tsx"],"sourcesContent":["import type { FC, PropsWithChildren } from \"react\";\nimport { Suspense } from \"react\";\nimport * as Aria from \"react-aria-components\";\nimport clsx from \"clsx\";\nimport styles from \"../../Table.module.scss\";\nimport { SkeletonText } from \"@/components/SkeletonText\";\nimport { SkeletonRawText } from \"@/components/SkeletonMode/components/SkeletonRawText\";\n\nexport interface TableCellProps\n  extends\n    Omit<Aria.CellProps, \"children\" | \"style\" | \"render\">,\n    PropsWithChildren {\n  /**\n   * Styles the cell as a row header. Its semantics come from the column: the\n   * first column, or the one with `isRowHeader`.\n   */\n  rowHeader?: boolean;\n  /** Horizontal alignment of the cell content @default \"start\" */\n  horizontalAlign?: \"start\" | \"center\" | \"end\";\n}\n\n/** @flr-generate all */\nexport const TableCell: FC<TableCellProps> = (props) => {\n  const {\n    children,\n    className,\n    rowHeader,\n    horizontalAlign = \"start\",\n    ...rest\n  } = props;\n\n  const rootClassName = clsx(\n    styles.cell,\n    rowHeader && styles.column,\n    horizontalAlign !== \"start\" &&\n      styles[`horizontal-align-${horizontalAlign}`],\n    className,\n  );\n\n  return (\n    <Aria.Cell className={rootClassName} {...rest}>\n      <Suspense fallback={<SkeletonText width=\"100px\" />}>\n        <SkeletonRawText>{children}</SkeletonRawText>\n      </Suspense>\n    </Aria.Cell>\n  );\n};\n\nexport default TableCell;\n"],"mappings":";;;;;;;;;;;AAsBA,IAAa,aAAiC,UAAU;CACtD,MAAM,EACJ,UACA,WACA,WACA,kBAAkB,SAClB,GAAG,SACD;CAEJ,MAAM,gBAAgB,KACpBA,qBAAO,MACP,aAAaA,qBAAO,QACpB,oBAAoB,WAClBA,qBAAO,oBAAoB,oBAC7B,SACF;CAEA,OACE,oBAAC,KAAK,MAAN;EAAW,WAAW;EAAe,GAAI;EACvC,UAAA,oBAAC,UAAD;GAAU,UAAU,oBAAC,cAAD,EAAc,OAAM,QAAS,CAAA;GAC/C,UAAA,oBAAC,iBAAD,EAAkB,SAA0B,CAAA;EACpC,CAAA;CACD,CAAA;AAEf"}

package/dist/js/packages/components/src/components/Table/components/TableColumn/TableColumn.mjs

@@ -3,17 +3,19 @@
 import { PropsContextProvider } from "../../../../lib/propsContext/components/PropsContextProvider.mjs";
 import { SkeletonRawText } from "../../../SkeletonMode/components/SkeletonRawText/SkeletonRawText.mjs";
 import Table_module_default from "../../Table.module.mjs";
+import { useIsFirstColumn } from "../TableHeader/context.mjs";
 import clsx from "clsx";
 import { jsx } from "react/jsx-runtime";
 import * as Aria from "react-aria-components";
 //#region src/components/Table/components/TableColumn/TableColumn.tsx
 /** @flr-generate all */
 var TableColumn = (props) => {
-	const { children, className, horizontalAlign = "start", width, minWidth, ...rest } = props;
+	const { children, className, horizontalAlign = "start", width, minWidth, isRowHeader, ...rest } = props;
+	const isFirstColumn = useIsFirstColumn();
 	const rootClassName = clsx(Table_module_default.column, horizontalAlign !== "start" && Table_module_default[`horizontal-align-${horizontalAlign}`], className);
 	const propsContext = { Checkbox: { slot: null } };
 	return /* @__PURE__ */ jsx(Aria.Column, {
-		isRowHeader: true,
+		isRowHeader: isRowHeader ?? isFirstColumn ?? true,
 		className: rootClassName,
 		...rest,
 		style: {

package/dist/js/packages/components/src/components/Table/components/TableColumn/TableColumn.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"TableColumn.mjs","names":["styles"],"sources":["../../../../../../../../../src/components/Table/components/TableColumn/TableColumn.tsx"],"sourcesContent":["import type { FC, PropsWithChildren } from \"react\";\nimport * as Aria from \"react-aria-components\";\nimport clsx from \"clsx\";\nimport styles from \"../../Table.module.scss\";\nimport { type PropsContext, PropsContextProvider } from \"@/lib/propsContext\";\nimport { SkeletonRawText } from \"@/components/SkeletonMode/components/SkeletonRawText\";\n\nexport interface TableColumnProps\n  extends\n    Omit<\n      Aria.ColumnProps,\n      \"children\" | \"width\" | \"minWidth\" | \"maxWidth\" | \"style\"\n    >,\n    PropsWithChildren {\n  /** Horizontal alignment of the cell content @default \"start\" */\n  horizontalAlign?: \"start\" | \"center\" | \"end\";\n  /** The width of the column. */\n  width?: number | string;\n  /** The minimum width of the column. */\n  minWidth?: number | string;\n}\n\n/** @flr-generate all */\nexport const TableColumn: FC<TableColumnProps> = (props) => {\n  const {\n    children,\n    className,\n    horizontalAlign = \"start\",\n    width,\n    minWidth,\n    ...rest\n  } = props;\n  const rootClassName = clsx(\n    styles.column,\n    horizontalAlign !== \"start\" &&\n      styles[`horizontal-align-${horizontalAlign}`],\n    className,\n  );\n\n  const propsContext: PropsContext = { Checkbox: { slot: null } };\n\n  return (\n    <Aria.Column\n      isRowHeader\n      className={rootClassName}\n      {...rest}\n      style={{ width, minWidth }}\n    >\n      <PropsContextProvider props={propsContext}>\n        <SkeletonRawText>{children}</SkeletonRawText>\n      </PropsContextProvider>\n    </Aria.Column>\n  );\n};\n\nexport default TableColumn;\n"],"mappings":";;;;;;;;;;AAuBA,IAAa,eAAqC,UAAU;CAC1D,MAAM,EACJ,UACA,WACA,kBAAkB,SAClB,OACA,UACA,GAAG,SACD;CACJ,MAAM,gBAAgB,KACpBA,qBAAO,QACP,oBAAoB,WAClBA,qBAAO,oBAAoB,oBAC7B,SACF;CAEA,MAAM,eAA6B,EAAE,UAAU,EAAE,MAAM,KAAK,EAAE;CAE9D,OACE,oBAAC,KAAK,QAAN;EACE,aAAA;EACA,WAAW;EACX,GAAI;EACJ,OAAO;GAAE;GAAO;EAAS;EAEzB,UAAA,oBAAC,sBAAD;GAAsB,OAAO;GAC3B,UAAA,oBAAC,iBAAD,EAAkB,SAA0B,CAAA;EACxB,CAAA;CACX,CAAA;AAEjB"}
+{"version":3,"file":"TableColumn.mjs","names":["styles"],"sources":["../../../../../../../../../src/components/Table/components/TableColumn/TableColumn.tsx"],"sourcesContent":["import type { FC, PropsWithChildren } from \"react\";\nimport * as Aria from \"react-aria-components\";\nimport clsx from \"clsx\";\nimport styles from \"../../Table.module.scss\";\nimport { type PropsContext, PropsContextProvider } from \"@/lib/propsContext\";\nimport { SkeletonRawText } from \"@/components/SkeletonMode/components/SkeletonRawText\";\nimport { useIsFirstColumn } from \"@/components/Table/components/TableHeader/context\";\n\nexport interface TableColumnProps\n  extends\n    Omit<\n      Aria.ColumnProps,\n      \"children\" | \"width\" | \"minWidth\" | \"maxWidth\" | \"style\"\n    >,\n    PropsWithChildren {\n  /** Horizontal alignment of the cell content @default \"start\" */\n  horizontalAlign?: \"start\" | \"center\" | \"end\";\n  /** The width of the column. */\n  width?: number | string;\n  /** The minimum width of the column. */\n  minWidth?: number | string;\n}\n\n/** @flr-generate all */\nexport const TableColumn: FC<TableColumnProps> = (props) => {\n  const {\n    children,\n    className,\n    horizontalAlign = \"start\",\n    width,\n    minWidth,\n    isRowHeader,\n    ...rest\n  } = props;\n  const isFirstColumn = useIsFirstColumn();\n\n  const rootClassName = clsx(\n    styles.column,\n    horizontalAlign !== \"start\" &&\n      styles[`horizontal-align-${horizontalAlign}`],\n    className,\n  );\n\n  const propsContext: PropsContext = { Checkbox: { slot: null } };\n\n  return (\n    <Aria.Column\n      isRowHeader={isRowHeader ?? isFirstColumn ?? true}\n      className={rootClassName}\n      {...rest}\n      style={{ width, minWidth }}\n    >\n      <PropsContextProvider props={propsContext}>\n        <SkeletonRawText>{children}</SkeletonRawText>\n      </PropsContextProvider>\n    </Aria.Column>\n  );\n};\n\nexport default TableColumn;\n"],"mappings":";;;;;;;;;;;AAwBA,IAAa,eAAqC,UAAU;CAC1D,MAAM,EACJ,UACA,WACA,kBAAkB,SAClB,OACA,UACA,aACA,GAAG,SACD;CACJ,MAAM,gBAAgB,iBAAiB;CAEvC,MAAM,gBAAgB,KACpBA,qBAAO,QACP,oBAAoB,WAClBA,qBAAO,oBAAoB,oBAC7B,SACF;CAEA,MAAM,eAA6B,EAAE,UAAU,EAAE,MAAM,KAAK,EAAE;CAE9D,OACE,oBAAC,KAAK,QAAN;EACE,aAAa,eAAe,iBAAiB;EAC7C,WAAW;EACX,GAAI;EACJ,OAAO;GAAE;GAAO;EAAS;EAEzB,UAAA,oBAAC,sBAAD;GAAsB,OAAO;GAC3B,UAAA,oBAAC,iBAAD,EAAkB,SAA0B,CAAA;EACxB,CAAA;CACX,CAAA;AAEjB"}

package/dist/js/packages/components/src/components/Table/components/TableHeader/TableHeader.mjs

@@ -1,7 +1,9 @@
 "use client"
 /* */
 import Table_module_default from "../../Table.module.mjs";
+import { IsFirstColumnContext } from "./context.mjs";
 import clsx from "clsx";
+import { Children } from "react";
 import { jsx } from "react/jsx-runtime";
 import * as Aria from "react-aria-components";
 //#region src/components/Table/components/TableHeader/TableHeader.tsx
@@ -9,10 +11,14 @@ import * as Aria from "react-aria-components";
 var TableHeader = (props) => {
 	const { children, className, ...rest } = props;
 	const rootClassName = clsx(Table_module_default.header, className);
+	const columns = typeof children === "function" ? children : Children.toArray(children).map((column, index) => /* @__PURE__ */ jsx(IsFirstColumnContext, {
+		value: index === 0,
+		children: column
+	}, index));
 	return /* @__PURE__ */ jsx(Aria.TableHeader, {
 		className: rootClassName,
 		...rest,
-		children
+		children: columns
 	});
 };
 //#endregion

package/dist/js/packages/components/src/components/Table/components/TableHeader/TableHeader.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"TableHeader.mjs","names":["styles"],"sources":["../../../../../../../../../src/components/Table/components/TableHeader/TableHeader.tsx"],"sourcesContent":["import type { FC } from \"react\";\nimport * as Aria from \"react-aria-components\";\nimport clsx from \"clsx\";\nimport styles from \"../../Table.module.scss\";\n\nexport type TableHeaderProps = Aria.TableHeaderProps<never>;\n\n/** @flr-generate all */\nexport const TableHeader: FC<TableHeaderProps> = (props) => {\n  const { children, className, ...rest } = props;\n\n  const rootClassName = clsx(styles.header, className);\n\n  return (\n    <Aria.TableHeader className={rootClassName} {...rest}>\n      {children}\n    </Aria.TableHeader>\n  );\n};\n\nexport default TableHeader;\n"],"mappings":";;;;;;;;AAQA,IAAa,eAAqC,UAAU;CAC1D,MAAM,EAAE,UAAU,WAAW,GAAG,SAAS;CAEzC,MAAM,gBAAgB,KAAKA,qBAAO,QAAQ,SAAS;CAEnD,OACE,oBAAC,KAAK,aAAN;EAAkB,WAAW;EAAe,GAAI;EAC7C;CACe,CAAA;AAEtB"}
+{"version":3,"file":"TableHeader.mjs","names":["styles"],"sources":["../../../../../../../../../src/components/Table/components/TableHeader/TableHeader.tsx"],"sourcesContent":["import { Children, type FC } from \"react\";\nimport * as Aria from \"react-aria-components\";\nimport clsx from \"clsx\";\nimport styles from \"../../Table.module.scss\";\nimport { IsFirstColumnContext } from \"./context\";\n\nexport type TableHeaderProps = Aria.TableHeaderProps<never>;\n\n/** @flr-generate all */\nexport const TableHeader: FC<TableHeaderProps> = (props) => {\n  const { children, className, ...rest } = props;\n\n  const rootClassName = clsx(styles.header, className);\n\n  // Assumes the first child renders a column; a wrapper that renders nothing\n  // leaves the table without row header column, and react-aria throws.\n  const columns =\n    typeof children === \"function\"\n      ? children\n      : Children.toArray(children).map((column, index) => (\n          <IsFirstColumnContext key={index} value={index === 0}>\n            {column}\n          </IsFirstColumnContext>\n        ));\n\n  return (\n    <Aria.TableHeader className={rootClassName} {...rest}>\n      {columns}\n    </Aria.TableHeader>\n  );\n};\n\nexport default TableHeader;\n"],"mappings":";;;;;;;;;;AASA,IAAa,eAAqC,UAAU;CAC1D,MAAM,EAAE,UAAU,WAAW,GAAG,SAAS;CAEzC,MAAM,gBAAgB,KAAKA,qBAAO,QAAQ,SAAS;CAInD,MAAM,UACJ,OAAO,aAAa,aAChB,WACA,SAAS,QAAQ,QAAQ,CAAC,CAAC,KAAK,QAAQ,UACtC,oBAAC,sBAAD;EAAkC,OAAO,UAAU;EAChD,UAAA;CACmB,GAFK,KAEL,CACvB;CAEP,OACE,oBAAC,KAAK,aAAN;EAAkB,WAAW;EAAe,GAAI;EAC7C,UAAA;CACe,CAAA;AAEtB"}

package/dist/js/packages/components/src/components/Table/components/TableHeader/context.mjs

@@ -0,0 +1,14 @@
+"use client"
+/* */
+import { createContext, useContext } from "react";
+//#region src/components/Table/components/TableHeader/context.ts
+/**
+* Whether a column is the first of its `TableHeader`. Undefined outside a
+* header that can tell, e.g. with dynamic `columns`.
+*/
+var IsFirstColumnContext = createContext(void 0);
+var useIsFirstColumn = () => useContext(IsFirstColumnContext);
+//#endregion
+export { IsFirstColumnContext, useIsFirstColumn };
+
+//# sourceMappingURL=context.mjs.map

package/dist/js/packages/components/src/components/Table/components/TableHeader/context.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"context.mjs","names":[],"sources":["../../../../../../../../../src/components/Table/components/TableHeader/context.ts"],"sourcesContent":["import { createContext, useContext } from \"react\";\n\n/**\n * Whether a column is the first of its `TableHeader`. Undefined outside a\n * header that can tell, e.g. with dynamic `columns`.\n */\nexport const IsFirstColumnContext = createContext<boolean | undefined>(\n  undefined,\n);\n\nexport const useIsFirstColumn = () => useContext(IsFirstColumnContext);\n"],"mappings":";;;;;;;;AAMA,IAAa,uBAAuB,cAClC,KAAA,CACF;AAEA,IAAa,yBAAyB,WAAW,oBAAoB"}

package/dist/js/packages/components/src/lib/controller/overlay/OverlayController.mjs

@@ -1,70 +1,22 @@
 "use client"
 /* */
+import { OverlayState } from "../../../../../components-base/src/overlay/OverlayState.mjs";
+import "../../../../../components-base/src/index.mjs";
 import useSelector from "../../mobx/useSelector.mjs";
 import { useStatic } from "../../hooks/useStatic.mjs";
 import { useCloseOverlayConfirmationController } from "./useCloseOverlayConfirmationController.mjs";
 import { useEffect, useRef } from "react";
-import { action, computed, makeObservable, observable, runInAction } from "mobx";
 //#region src/lib/controller/overlay/OverlayController.ts
-var OverlayController = class OverlayController {
-	isOpen = false;
-	isContentSuspended = false;
-	onOpenHandlers = /* @__PURE__ */ new Set();
-	onCloseHandlers = /* @__PURE__ */ new Set();
-	onOpenChangeHandlers = /* @__PURE__ */ new Set();
-	showConfirmationModal = false;
-	closeIsConfirmed = false;
-	confirmOnCloseFromOptions;
-	/**
-	* Every mounted component that has an opinion on close confirmation
-	* contributes one entry here – e.g. a `Modal` with a `confirmOnClose` prop
-	* and a `Form` tracking its dirty state. Combining them instead of assigning
-	* a single flag keeps them from overwriting each other.
-	*/
-	confirmOnCloseSources = observable.map();
-	/**
-	* Active grants that allow closing without a confirmation. Each entry is
-	* scoped to an ongoing operation that legitimately closes the overlay – e.g.
-	* a `Form` submit – and is dropped again when that operation has finished, so
-	* an operation that does _not_ close the overlay leaves the confirmation
-	* armed.
-	*/
-	closeWithoutConfirmationGrants = /* @__PURE__ */ new Set();
-	/**
-	* The open state a `setOpen` call is currently applying. Handlers run before
-	* `isOpen` is assigned, so a handler that calls `setOpen` again would not be
-	* caught by the equality check at the top and would recurse.
-	*/
-	openStateInFlight;
-	constructor(options = {}) {
-		makeObservable(this, {
-			isOpen: observable,
-			isContentSuspended: observable,
-			showConfirmationModal: observable,
-			confirmOnCloseEnabled: computed,
-			open: action.bound,
-			close: action.bound,
-			toggle: action.bound,
-			setOpen: action.bound,
-			syncOpen: action.bound,
-			setIsContentSuspended: action.bound,
-			confirmClose: action.bound,
-			cancelConfirmation: action.bound
-		});
-		const { isDefaultOpen = false, confirmOnClose = false } = options;
-		this.isOpen = isDefaultOpen;
-		this.confirmOnCloseFromOptions = confirmOnClose;
-	}
-	/** Whether closing this overlay currently requires a confirmation. */
-	get confirmOnCloseEnabled() {
-		if (this.confirmOnCloseSources.size === 0) return this.confirmOnCloseFromOptions;
-		return Array.from(this.confirmOnCloseSources.values()).some(Boolean);
-	}
+/**
+* The state is `OverlayState` from `@mittwald/flow-components-base`, shared
+* with every remote binding; this adds the hooks.
+*/
+var OverlayController = class OverlayController extends OverlayState {
 	useUpdateOptions(options = {}) {
 		const { onOpen, onClose, onOpenChange, confirmOnClose } = options;
-		this.useOnHandler(onOpen, (h) => this.addOpenStateHandler(h, this.onOpenHandlers));
-		this.useOnHandler(onClose, (h) => this.addOpenStateHandler(h, this.onCloseHandlers));
-		this.useOnHandler(onOpenChange, (h) => this.addOpenStateHandler(h, this.onOpenChangeHandlers));
+		this.useOnHandler(onOpen, (h) => this.addOnOpen(h));
+		this.useOnHandler(onClose, (h) => this.addOnClose(h));
+		this.useOnHandler(onOpenChange, (h) => this.addOnOpenChange(h));
 		this.useConfirmOnCloseSource(confirmOnClose);
 	}
 	/**
@@ -86,12 +38,6 @@ var OverlayController = class OverlayController {
 			confirmOnClose
 		]);
 	}
-	setConfirmOnCloseSource(source, confirmOnClose) {
-		runInAction(() => this.confirmOnCloseSources.set(source, confirmOnClose));
-	}
-	removeConfirmOnCloseSource(source) {
-		runInAction(() => this.confirmOnCloseSources.delete(source));
-	}
 	/**
 	* Can be used to execute a callback when the Overlay has unmounted – means
 	* after any closing animation.
@@ -119,81 +65,9 @@ var OverlayController = class OverlayController {
 		controller.useUpdateOptions(options);
 		return controller;
 	}
-	addOpenStateHandler(handler, handlersSet) {
-		handlersSet.add(handler);
-		return () => {
-			handlersSet.delete(handler);
-		};
-	}
 	useOnHandler(handler, addHandlerFn) {
 		useEffect(() => handler ? addHandlerFn(handler) : void 0, [handler, this]);
 	}
-	executeHandlers(isOpen, handlers) {
-		return Array.from(handlers).map((handler) => handler(isOpen)).some((result) => result === false);
-	}
-	executeOnClose() {
-		return this.executeHandlers(false, this.onCloseHandlers);
-	}
-	executeOnOpen() {
-		return this.executeHandlers(true, this.onOpenHandlers);
-	}
-	executeOnOpenChange(isOpen) {
-		return this.executeHandlers(isOpen, this.onOpenChangeHandlers);
-	}
-	addOnClose(handler) {
-		return this.addOpenStateHandler(handler, this.onCloseHandlers);
-	}
-	addOnOpen(handler) {
-		return this.addOpenStateHandler(handler, this.onOpenHandlers);
-	}
-	addOnOpenChange(handler) {
-		return this.addOpenStateHandler(handler, this.onOpenChangeHandlers);
-	}
-	open() {
-		this.setOpen(true);
-	}
-	close(options) {
-		this.setOpen(false, options);
-	}
-	toggle() {
-		this.setOpen(!this.isOpen);
-	}
-	setOpen(toOpen, options = {}) {
-		if (this.isOpen === toOpen || this.openStateInFlight === toOpen) return;
-		this.openStateInFlight = toOpen;
-		try {
-			this.applyOpenState(toOpen, options);
-		} finally {
-			this.openStateInFlight = void 0;
-		}
-	}
-	/**
-	* Sets the open state without running any handler. Use it to mirror a
-	* controlled `isOpen` prop, whose change comes from the consumer – notifying
-	* them of their own state would echo it back.
-	*/
-	syncOpen(toOpen) {
-		this.isOpen = toOpen;
-	}
-	applyOpenState(toOpen, options) {
-		const { bypassConfirmation = false } = options;
-		if (toOpen === false) {
-			const closeIsConfirmed = this.closeIsConfirmed;
-			this.closeIsConfirmed = false;
-			if (this.confirmOnCloseEnabled && !closeIsConfirmed && this.closeWithoutConfirmationGrants.size === 0 && !bypassConfirmation) {
-				this.showConfirmationModal = true;
-				return;
-			}
-		}
-		let aborted;
-		if (toOpen) aborted = this.executeOnOpen();
-		else aborted = this.executeOnClose();
-		if (!aborted) aborted = this.executeOnOpenChange(toOpen);
-		if (!aborted) this.isOpen = toOpen;
-	}
-	setIsContentSuspended(to) {
-		this.isContentSuspended = to;
-	}
 	useIsOpen() {
 		return useSelector(() => this.isOpen);
 	}
@@ -209,28 +83,6 @@ var OverlayController = class OverlayController {
 	useConfirmationController() {
 		return useCloseOverlayConfirmationController(this);
 	}
-	/**
-	* Allows closing this overlay without a confirmation until the returned
-	* disposer is called. Use it around an operation that may legitimately close
-	* the overlay – e.g. a `Form` submit, where a "discard unsaved changes?"
-	* prompt would be nonsense – and dispose it as soon as that operation has
-	* finished. An operation that ends without closing the overlay therefore
-	* leaves the confirmation armed (#2775).
-	*/
-	grantCloseWithoutConfirmation() {
-		const grant = {};
-		this.closeWithoutConfirmationGrants.add(grant);
-		return () => {
-			this.closeWithoutConfirmationGrants.delete(grant);
-		};
-	}
-	confirmClose() {
-		this.closeIsConfirmed = true;
-		this.showConfirmationModal = false;
-	}
-	cancelConfirmation() {
-		this.showConfirmationModal = false;
-	}
 };
 //#endregion
 export { OverlayController };

package/dist/js/packages/components/src/lib/controller/overlay/OverlayController.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"OverlayController.mjs","names":[],"sources":["../../../../../../../../src/lib/controller/overlay/OverlayController.ts"],"sourcesContent":["import {\n  action,\n  computed,\n  makeObservable,\n  observable,\n  runInAction,\n} from \"mobx\";\nimport useSelector from \"@/lib/mobx/useSelector\";\nimport { useStatic } from \"@/lib/hooks/useStatic\";\nimport { useEffect, useRef, type DependencyList } from \"react\";\nimport { useCloseOverlayConfirmationController } from \"@/lib/controller/overlay/useCloseOverlayConfirmationController\";\nimport type { FlowComponentName } from \"@/components/propTypes\";\n\nexport type OverlayOpenHandler = () => unknown;\nexport type OverlayCloseHandler = () => unknown;\nexport type OverlayOpenStateHandler = (isOpen: boolean) => unknown;\ntype AnyOverlayOpenStateHandler =\n  OverlayOpenHandler | OverlayCloseHandler | OverlayOpenStateHandler;\n\ntype DisposerFn = () => void;\n\nexport interface CloseOverlayOptions {\n  /**\n   * The overlay to close. Omitted, the nearest enclosing overlay is closed –\n   * the same thing `closeOverlay={true}` means.\n   */\n  overlay?: FlowComponentName | OverlayController;\n  bypassConfirmation?: boolean;\n}\n\nexport interface OnOverlayClosedOptions {\n  dependencies?: DependencyList;\n}\n\nexport type CloseModalOptions = Omit<CloseOverlayOptions, \"overlay\">;\n\n/**\n * Every way an action can point at an overlay: by the Flow component name it\n * registers under, by controller, by options, or with `true` – the nearest\n * enclosing overlay, whatever its name.\n */\nexport type OverlayReference =\n  FlowComponentName | OverlayController | CloseOverlayOptions | true;\n\ntype CloseOptions = CloseOverlayOptions | CloseModalOptions;\n\nexport interface OverlayControllerOptions {\n  isDefaultOpen?: boolean;\n  onOpen?: OverlayOpenHandler;\n  onClose?: OverlayCloseHandler;\n  onOpenChange?: OverlayOpenStateHandler;\n  /**\n   * Whether closing the overlay must be confirmed. `undefined` means \"no\n   * opinion\": the value is not contributed at all, so other sources (e.g. a\n   * `Modal`'s `confirmOnClose` prop or a dirty `Form`) still decide.\n   */\n  confirmOnClose?: boolean;\n}\n\ntype ConstructorOptions = Pick<\n  OverlayControllerOptions,\n  \"isDefaultOpen\" | \"confirmOnClose\"\n>;\n\nexport class OverlayController {\n  public isOpen = false;\n  public isContentSuspended = false;\n  private onOpenHandlers = new Set<OverlayOpenHandler>();\n  private onCloseHandlers = new Set<OverlayCloseHandler>();\n  private onOpenChangeHandlers = new Set<OverlayOpenStateHandler>();\n\n  public showConfirmationModal = false;\n  public closeIsConfirmed = false;\n  private readonly confirmOnCloseFromOptions: boolean;\n  /**\n   * Every mounted component that has an opinion on close confirmation\n   * contributes one entry here – e.g. a `Modal` with a `confirmOnClose` prop\n   * and a `Form` tracking its dirty state. Combining them instead of assigning\n   * a single flag keeps them from overwriting each other.\n   */\n  private confirmOnCloseSources = observable.map<object, boolean>();\n  /**\n   * Active grants that allow closing without a confirmation. Each entry is\n   * scoped to an ongoing operation that legitimately closes the overlay – e.g.\n   * a `Form` submit – and is dropped again when that operation has finished, so\n   * an operation that does _not_ close the overlay leaves the confirmation\n   * armed.\n   */\n  private closeWithoutConfirmationGrants = new Set<object>();\n  /**\n   * The open state a `setOpen` call is currently applying. Handlers run before\n   * `isOpen` is assigned, so a handler that calls `setOpen` again would not be\n   * caught by the equality check at the top and would recurse.\n   */\n  private openStateInFlight: boolean | undefined;\n\n  public constructor(options: ConstructorOptions = {}) {\n    makeObservable(this, {\n      isOpen: observable,\n      isContentSuspended: observable,\n      showConfirmationModal: observable,\n      confirmOnCloseEnabled: computed,\n      open: action.bound,\n      close: action.bound,\n      toggle: action.bound,\n      setOpen: action.bound,\n      syncOpen: action.bound,\n      setIsContentSuspended: action.bound,\n      confirmClose: action.bound,\n      cancelConfirmation: action.bound,\n    });\n    const { isDefaultOpen = false, confirmOnClose = false } = options;\n    this.isOpen = isDefaultOpen;\n    this.confirmOnCloseFromOptions = confirmOnClose;\n  }\n\n  /** Whether closing this overlay currently requires a confirmation. */\n  public get confirmOnCloseEnabled(): boolean {\n    if (this.confirmOnCloseSources.size === 0) {\n      return this.confirmOnCloseFromOptions;\n    }\n    return Array.from(this.confirmOnCloseSources.values()).some(Boolean);\n  }\n\n  public useUpdateOptions(options: OverlayControllerOptions = {}): void {\n    const { onOpen, onClose, onOpenChange, confirmOnClose } = options;\n\n    this.useOnHandler(onOpen, (h) =>\n      this.addOpenStateHandler(h, this.onOpenHandlers),\n    );\n    this.useOnHandler(onClose, (h) =>\n      this.addOpenStateHandler(h, this.onCloseHandlers),\n    );\n    this.useOnHandler(onOpenChange, (h) =>\n      this.addOpenStateHandler(h, this.onOpenChangeHandlers),\n    );\n\n    this.useConfirmOnCloseSource(confirmOnClose);\n  }\n\n  /**\n   * Registers the calling component as a close confirmation source for as long\n   * as it is mounted. `undefined` contributes nothing at all.\n   */\n  private useConfirmOnCloseSource(confirmOnClose: boolean | undefined): void {\n    const source = useStatic((): object => ({}));\n\n    useEffect(() => {\n      if (confirmOnClose === undefined) {\n        this.removeConfirmOnCloseSource(source);\n        return;\n      }\n      this.setConfirmOnCloseSource(source, confirmOnClose);\n      return () => this.removeConfirmOnCloseSource(source);\n    }, [this, source, confirmOnClose]);\n  }\n\n  private setConfirmOnCloseSource(source: object, confirmOnClose: boolean) {\n    runInAction(() => this.confirmOnCloseSources.set(source, confirmOnClose));\n  }\n\n  private removeConfirmOnCloseSource(source: object) {\n    runInAction(() => this.confirmOnCloseSources.delete(source));\n  }\n\n  /**\n   * Can be used to execute a callback when the Overlay has unmounted – means\n   * after any closing animation.\n   *\n   * NOTICE: This hook only works inside the corresponding Overlay!\n   */\n  public useOnClosed(\n    callback: () => unknown,\n    options: OnOverlayClosedOptions = {},\n  ) {\n    const { dependencies = [] } = options;\n    const isOpen = this.useIsOpen();\n    const wasOpen = useRef(this.isOpen);\n\n    this.useUpdateOptions({\n      onOpen: () => {\n        wasOpen.current = true;\n      },\n    });\n\n    useEffect(() => {\n      return () => {\n        if (!isOpen && wasOpen.current) {\n          wasOpen.current = false;\n          callback();\n        }\n      };\n    }, [isOpen, ...dependencies]);\n  }\n\n  public static useNew(\n    options: OverlayControllerOptions = {},\n  ): OverlayController {\n    const controller = useStatic(() => new OverlayController(options));\n    controller.useUpdateOptions(options);\n    return controller;\n  }\n\n  private addOpenStateHandler<T extends AnyOverlayOpenStateHandler>(\n    handler: T,\n    handlersSet: Set<T>,\n  ): DisposerFn {\n    handlersSet.add(handler);\n    return () => {\n      handlersSet.delete(handler);\n    };\n  }\n\n  private useOnHandler<T extends AnyOverlayOpenStateHandler>(\n    handler: T | undefined,\n    addHandlerFn: (handler: T) => DisposerFn,\n  ) {\n    useEffect(\n      () => (handler ? addHandlerFn(handler) : undefined),\n      [handler, this],\n    );\n  }\n\n  private executeHandlers(\n    isOpen: boolean,\n    handlers: Set<\n      OverlayOpenHandler | OverlayCloseHandler | OverlayOpenStateHandler\n    >,\n  ): boolean {\n    const handlerResult = Array.from(handlers).map((handler) =>\n      handler(isOpen),\n    );\n    return handlerResult.some((result) => result === false);\n  }\n\n  private executeOnClose(): boolean {\n    return this.executeHandlers(false, this.onCloseHandlers);\n  }\n\n  private executeOnOpen(): boolean {\n    return this.executeHandlers(true, this.onOpenHandlers);\n  }\n\n  private executeOnOpenChange(isOpen: boolean): boolean {\n    return this.executeHandlers(isOpen, this.onOpenChangeHandlers);\n  }\n\n  public addOnClose(handler: OverlayCloseHandler) {\n    return this.addOpenStateHandler(handler, this.onCloseHandlers);\n  }\n\n  public addOnOpen(handler: OverlayOpenHandler) {\n    return this.addOpenStateHandler(handler, this.onOpenHandlers);\n  }\n\n  public addOnOpenChange(handler: OverlayOpenStateHandler) {\n    return this.addOpenStateHandler(handler, this.onOpenChangeHandlers);\n  }\n\n  public open(): void {\n    this.setOpen(true);\n  }\n\n  public close(options?: CloseOptions): void {\n    this.setOpen(false, options);\n  }\n\n  public toggle(): void {\n    this.setOpen(!this.isOpen);\n  }\n\n  public setOpen(toOpen: boolean, options: CloseOptions = {}): void {\n    if (this.isOpen === toOpen || this.openStateInFlight === toOpen) {\n      return;\n    }\n\n    this.openStateInFlight = toOpen;\n    try {\n      this.applyOpenState(toOpen, options);\n    } finally {\n      this.openStateInFlight = undefined;\n    }\n  }\n\n  /**\n   * Sets the open state without running any handler. Use it to mirror a\n   * controlled `isOpen` prop, whose change comes from the consumer – notifying\n   * them of their own state would echo it back.\n   */\n  public syncOpen(toOpen: boolean): void {\n    this.isOpen = toOpen;\n  }\n\n  private applyOpenState(toOpen: boolean, options: CloseOptions): void {\n    const { bypassConfirmation = false } = options;\n\n    if (toOpen === false) {\n      // The confirmation is a one-shot permission for exactly this close\n      // attempt – consume it here instead of only when a close succeeds, so it\n      // cannot survive an aborted close and disarm later attempts.\n      const closeIsConfirmed = this.closeIsConfirmed;\n      this.closeIsConfirmed = false;\n\n      if (\n        this.confirmOnCloseEnabled &&\n        !closeIsConfirmed &&\n        this.closeWithoutConfirmationGrants.size === 0 &&\n        !bypassConfirmation\n      ) {\n        this.showConfirmationModal = true;\n        return;\n      }\n    }\n\n    let aborted: boolean;\n    if (toOpen) {\n      aborted = this.executeOnOpen();\n    } else {\n      aborted = this.executeOnClose();\n    }\n    if (!aborted) {\n      aborted = this.executeOnOpenChange(toOpen);\n    }\n\n    if (!aborted) {\n      this.isOpen = toOpen;\n    }\n  }\n\n  public setIsContentSuspended(to: boolean): void {\n    this.isContentSuspended = to;\n  }\n\n  public useIsOpen() {\n    return useSelector(() => this.isOpen);\n  }\n\n  public useIsContentSuspended() {\n    return useSelector(() => this.isContentSuspended);\n  }\n\n  public useShowConfirmationModal() {\n    return useSelector(() => this.showConfirmationModal);\n  }\n\n  public useConfirmOnCloseEnabled() {\n    return useSelector(() => this.confirmOnCloseEnabled);\n  }\n\n  public useConfirmationController() {\n    return useCloseOverlayConfirmationController(this);\n  }\n\n  /**\n   * Allows closing this overlay without a confirmation until the returned\n   * disposer is called. Use it around an operation that may legitimately close\n   * the overlay – e.g. a `Form` submit, where a \"discard unsaved changes?\"\n   * prompt would be nonsense – and dispose it as soon as that operation has\n   * finished. An operation that ends without closing the overlay therefore\n   * leaves the confirmation armed (#2775).\n   */\n  public grantCloseWithoutConfirmation(): DisposerFn {\n    const grant = {};\n    this.closeWithoutConfirmationGrants.add(grant);\n    return () => {\n      this.closeWithoutConfirmationGrants.delete(grant);\n    };\n  }\n\n  public confirmClose(): void {\n    this.closeIsConfirmed = true;\n    this.showConfirmationModal = false;\n  }\n\n  public cancelConfirmation(): void {\n    this.showConfirmationModal = false;\n  }\n}\n"],"mappings":";;;;;;;;AAgEA,IAAa,oBAAb,MAAa,kBAAkB;CAC7B,SAAgB;CAChB,qBAA4B;CAC5B,iCAAyB,IAAI,IAAwB;CACrD,kCAA0B,IAAI,IAAyB;CACvD,uCAA+B,IAAI,IAA6B;CAEhE,wBAA+B;CAC/B,mBAA0B;CAC1B;;;;;;;CAOA,wBAAgC,WAAW,IAAqB;;;;;;;;CAQhE,iDAAyC,IAAI,IAAY;;;;;;CAMzD;CAEA,YAAmB,UAA8B,CAAC,GAAG;EACnD,eAAe,MAAM;GACnB,QAAQ;GACR,oBAAoB;GACpB,uBAAuB;GACvB,uBAAuB;GACvB,MAAM,OAAO;GACb,OAAO,OAAO;GACd,QAAQ,OAAO;GACf,SAAS,OAAO;GAChB,UAAU,OAAO;GACjB,uBAAuB,OAAO;GAC9B,cAAc,OAAO;GACrB,oBAAoB,OAAO;EAC7B,CAAC;EACD,MAAM,EAAE,gBAAgB,OAAO,iBAAiB,UAAU;EAC1D,KAAK,SAAS;EACd,KAAK,4BAA4B;CACnC;;CAGA,IAAW,wBAAiC;EAC1C,IAAI,KAAK,sBAAsB,SAAS,GACtC,OAAO,KAAK;EAEd,OAAO,MAAM,KAAK,KAAK,sBAAsB,OAAO,CAAC,CAAC,CAAC,KAAK,OAAO;CACrE;CAEA,iBAAwB,UAAoC,CAAC,GAAS;EACpE,MAAM,EAAE,QAAQ,SAAS,cAAc,mBAAmB;EAE1D,KAAK,aAAa,SAAS,MACzB,KAAK,oBAAoB,GAAG,KAAK,cAAc,CACjD;EACA,KAAK,aAAa,UAAU,MAC1B,KAAK,oBAAoB,GAAG,KAAK,eAAe,CAClD;EACA,KAAK,aAAa,eAAe,MAC/B,KAAK,oBAAoB,GAAG,KAAK,oBAAoB,CACvD;EAEA,KAAK,wBAAwB,cAAc;CAC7C;;;;;CAMA,wBAAgC,gBAA2C;EACzE,MAAM,SAAS,iBAAyB,CAAC,EAAE;EAE3C,gBAAgB;GACd,IAAI,mBAAmB,KAAA,GAAW;IAChC,KAAK,2BAA2B,MAAM;IACtC;GACF;GACA,KAAK,wBAAwB,QAAQ,cAAc;GACnD,aAAa,KAAK,2BAA2B,MAAM;EACrD,GAAG;GAAC;GAAM;GAAQ;EAAc,CAAC;CACnC;CAEA,wBAAgC,QAAgB,gBAAyB;EACvE,kBAAkB,KAAK,sBAAsB,IAAI,QAAQ,cAAc,CAAC;CAC1E;CAEA,2BAAmC,QAAgB;EACjD,kBAAkB,KAAK,sBAAsB,OAAO,MAAM,CAAC;CAC7D;;;;;;;CAQA,YACE,UACA,UAAkC,CAAC,GACnC;EACA,MAAM,EAAE,eAAe,CAAC,MAAM;EAC9B,MAAM,SAAS,KAAK,UAAU;EAC9B,MAAM,UAAU,OAAO,KAAK,MAAM;EAElC,KAAK,iBAAiB,EACpB,cAAc;GACZ,QAAQ,UAAU;EACpB,EACF,CAAC;EAED,gBAAgB;GACd,aAAa;IACX,IAAI,CAAC,UAAU,QAAQ,SAAS;KAC9B,QAAQ,UAAU;KAClB,SAAS;IACX;GACF;EACF,GAAG,CAAC,QAAQ,GAAG,YAAY,CAAC;CAC9B;CAEA,OAAc,OACZ,UAAoC,CAAC,GAClB;EACnB,MAAM,aAAa,gBAAgB,IAAI,kBAAkB,OAAO,CAAC;EACjE,WAAW,iBAAiB,OAAO;EACnC,OAAO;CACT;CAEA,oBACE,SACA,aACY;EACZ,YAAY,IAAI,OAAO;EACvB,aAAa;GACX,YAAY,OAAO,OAAO;EAC5B;CACF;CAEA,aACE,SACA,cACA;EACA,gBACS,UAAU,aAAa,OAAO,IAAI,KAAA,GACzC,CAAC,SAAS,IAAI,CAChB;CACF;CAEA,gBACE,QACA,UAGS;EAIT,OAHsB,MAAM,KAAK,QAAQ,CAAC,CAAC,KAAK,YAC9C,QAAQ,MAAM,CAET,CAAA,CAAc,MAAM,WAAW,WAAW,KAAK;CACxD;CAEA,iBAAkC;EAChC,OAAO,KAAK,gBAAgB,OAAO,KAAK,eAAe;CACzD;CAEA,gBAAiC;EAC/B,OAAO,KAAK,gBAAgB,MAAM,KAAK,cAAc;CACvD;CAEA,oBAA4B,QAA0B;EACpD,OAAO,KAAK,gBAAgB,QAAQ,KAAK,oBAAoB;CAC/D;CAEA,WAAkB,SAA8B;EAC9C,OAAO,KAAK,oBAAoB,SAAS,KAAK,eAAe;CAC/D;CAEA,UAAiB,SAA6B;EAC5C,OAAO,KAAK,oBAAoB,SAAS,KAAK,cAAc;CAC9D;CAEA,gBAAuB,SAAkC;EACvD,OAAO,KAAK,oBAAoB,SAAS,KAAK,oBAAoB;CACpE;CAEA,OAAoB;EAClB,KAAK,QAAQ,IAAI;CACnB;CAEA,MAAa,SAA8B;EACzC,KAAK,QAAQ,OAAO,OAAO;CAC7B;CAEA,SAAsB;EACpB,KAAK,QAAQ,CAAC,KAAK,MAAM;CAC3B;CAEA,QAAe,QAAiB,UAAwB,CAAC,GAAS;EAChE,IAAI,KAAK,WAAW,UAAU,KAAK,sBAAsB,QACvD;EAGF,KAAK,oBAAoB;EACzB,IAAI;GACF,KAAK,eAAe,QAAQ,OAAO;EACrC,UAAU;GACR,KAAK,oBAAoB,KAAA;EAC3B;CACF;;;;;;CAOA,SAAgB,QAAuB;EACrC,KAAK,SAAS;CAChB;CAEA,eAAuB,QAAiB,SAA6B;EACnE,MAAM,EAAE,qBAAqB,UAAU;EAEvC,IAAI,WAAW,OAAO;GAIpB,MAAM,mBAAmB,KAAK;GAC9B,KAAK,mBAAmB;GAExB,IACE,KAAK,yBACL,CAAC,oBACD,KAAK,+BAA+B,SAAS,KAC7C,CAAC,oBACD;IACA,KAAK,wBAAwB;IAC7B;GACF;EACF;EAEA,IAAI;EACJ,IAAI,QACF,UAAU,KAAK,cAAc;OAE7B,UAAU,KAAK,eAAe;EAEhC,IAAI,CAAC,SACH,UAAU,KAAK,oBAAoB,MAAM;EAG3C,IAAI,CAAC,SACH,KAAK,SAAS;CAElB;CAEA,sBAA6B,IAAmB;EAC9C,KAAK,qBAAqB;CAC5B;CAEA,YAAmB;EACjB,OAAO,kBAAkB,KAAK,MAAM;CACtC;CAEA,wBAA+B;EAC7B,OAAO,kBAAkB,KAAK,kBAAkB;CAClD;CAEA,2BAAkC;EAChC,OAAO,kBAAkB,KAAK,qBAAqB;CACrD;CAEA,2BAAkC;EAChC,OAAO,kBAAkB,KAAK,qBAAqB;CACrD;CAEA,4BAAmC;EACjC,OAAO,sCAAsC,IAAI;CACnD;;;;;;;;;CAUA,gCAAmD;EACjD,MAAM,QAAQ,CAAC;EACf,KAAK,+BAA+B,IAAI,KAAK;EAC7C,aAAa;GACX,KAAK,+BAA+B,OAAO,KAAK;EAClD;CACF;CAEA,eAA4B;EAC1B,KAAK,mBAAmB;EACxB,KAAK,wBAAwB;CAC/B;CAEA,qBAAkC;EAChC,KAAK,wBAAwB;CAC/B;AACF"}
+{"version":3,"file":"OverlayController.mjs","names":[],"sources":["../../../../../../../../src/lib/controller/overlay/OverlayController.ts"],"sourcesContent":["import {\n  OverlayState,\n  type AnyOverlayOpenStateHandler,\n  type DisposerFn,\n  type OverlayCloseHandler,\n  type OverlayCloseOptions,\n  type OverlayOpenHandler,\n  type OverlayOpenStateHandler,\n} from \"@mittwald/flow-components-base\";\nimport useSelector from \"@/lib/mobx/useSelector\";\nimport { useStatic } from \"@/lib/hooks/useStatic\";\nimport { useEffect, useRef, type DependencyList } from \"react\";\nimport { useCloseOverlayConfirmationController } from \"@/lib/controller/overlay/useCloseOverlayConfirmationController\";\nimport type { FlowComponentName } from \"@/components/propTypes\";\n\nexport type {\n  OverlayCloseHandler,\n  OverlayOpenHandler,\n  OverlayOpenStateHandler,\n} from \"@mittwald/flow-components-base\";\n\nexport interface CloseOverlayOptions extends OverlayCloseOptions {\n  /**\n   * The overlay to close. Omitted, the nearest enclosing overlay is closed –\n   * the same thing `closeOverlay={true}` means.\n   */\n  overlay?: FlowComponentName | OverlayController;\n}\n\nexport interface OnOverlayClosedOptions {\n  dependencies?: DependencyList;\n}\n\nexport type CloseModalOptions = Omit<CloseOverlayOptions, \"overlay\">;\n\n/**\n * Every way an action can point at an overlay: by the Flow component name it\n * registers under, by controller, by options, or with `true` – the nearest\n * enclosing overlay, whatever its name.\n */\nexport type OverlayReference =\n  FlowComponentName | OverlayController | CloseOverlayOptions | true;\n\ntype CloseOptions = CloseOverlayOptions | CloseModalOptions;\n\nexport interface OverlayControllerOptions {\n  isDefaultOpen?: boolean;\n  onOpen?: OverlayOpenHandler;\n  onClose?: OverlayCloseHandler;\n  onOpenChange?: OverlayOpenStateHandler;\n  /**\n   * Whether closing the overlay must be confirmed. `undefined` means \"no\n   * opinion\": the value is not contributed at all, so other sources (e.g. a\n   * `Modal`'s `confirmOnClose` prop or a dirty `Form`) still decide.\n   */\n  confirmOnClose?: boolean;\n}\n\n/**\n * The state is `OverlayState` from `@mittwald/flow-components-base`, shared\n * with every remote binding; this adds the hooks.\n */\nexport class OverlayController extends OverlayState<CloseOptions> {\n  public useUpdateOptions(options: OverlayControllerOptions = {}): void {\n    const { onOpen, onClose, onOpenChange, confirmOnClose } = options;\n\n    this.useOnHandler(onOpen, (h) => this.addOnOpen(h));\n    this.useOnHandler(onClose, (h) => this.addOnClose(h));\n    this.useOnHandler(onOpenChange, (h) => this.addOnOpenChange(h));\n\n    this.useConfirmOnCloseSource(confirmOnClose);\n  }\n\n  /**\n   * Registers the calling component as a close confirmation source for as long\n   * as it is mounted. `undefined` contributes nothing at all.\n   */\n  private useConfirmOnCloseSource(confirmOnClose: boolean | undefined): void {\n    const source = useStatic((): object => ({}));\n\n    useEffect(() => {\n      if (confirmOnClose === undefined) {\n        this.removeConfirmOnCloseSource(source);\n        return;\n      }\n      this.setConfirmOnCloseSource(source, confirmOnClose);\n      return () => this.removeConfirmOnCloseSource(source);\n    }, [this, source, confirmOnClose]);\n  }\n\n  /**\n   * Can be used to execute a callback when the Overlay has unmounted – means\n   * after any closing animation.\n   *\n   * NOTICE: This hook only works inside the corresponding Overlay!\n   */\n  public useOnClosed(\n    callback: () => unknown,\n    options: OnOverlayClosedOptions = {},\n  ) {\n    const { dependencies = [] } = options;\n    const isOpen = this.useIsOpen();\n    const wasOpen = useRef(this.isOpen);\n\n    this.useUpdateOptions({\n      onOpen: () => {\n        wasOpen.current = true;\n      },\n    });\n\n    useEffect(() => {\n      return () => {\n        if (!isOpen && wasOpen.current) {\n          wasOpen.current = false;\n          callback();\n        }\n      };\n    }, [isOpen, ...dependencies]);\n  }\n\n  public static useNew(\n    options: OverlayControllerOptions = {},\n  ): OverlayController {\n    const controller = useStatic(() => new OverlayController(options));\n    controller.useUpdateOptions(options);\n    return controller;\n  }\n\n  private useOnHandler<T extends AnyOverlayOpenStateHandler>(\n    handler: T | undefined,\n    addHandlerFn: (handler: T) => DisposerFn,\n  ) {\n    useEffect(\n      () => (handler ? addHandlerFn(handler) : undefined),\n      [handler, this],\n    );\n  }\n\n  public useIsOpen() {\n    return useSelector(() => this.isOpen);\n  }\n\n  public useIsContentSuspended() {\n    return useSelector(() => this.isContentSuspended);\n  }\n\n  public useShowConfirmationModal() {\n    return useSelector(() => this.showConfirmationModal);\n  }\n\n  public useConfirmOnCloseEnabled() {\n    return useSelector(() => this.confirmOnCloseEnabled);\n  }\n\n  public useConfirmationController() {\n    return useCloseOverlayConfirmationController(this);\n  }\n}\n"],"mappings":";;;;;;;;;;;;;AA8DA,IAAa,oBAAb,MAAa,0BAA0B,aAA2B;CAChE,iBAAwB,UAAoC,CAAC,GAAS;EACpE,MAAM,EAAE,QAAQ,SAAS,cAAc,mBAAmB;EAE1D,KAAK,aAAa,SAAS,MAAM,KAAK,UAAU,CAAC,CAAC;EAClD,KAAK,aAAa,UAAU,MAAM,KAAK,WAAW,CAAC,CAAC;EACpD,KAAK,aAAa,eAAe,MAAM,KAAK,gBAAgB,CAAC,CAAC;EAE9D,KAAK,wBAAwB,cAAc;CAC7C;;;;;CAMA,wBAAgC,gBAA2C;EACzE,MAAM,SAAS,iBAAyB,CAAC,EAAE;EAE3C,gBAAgB;GACd,IAAI,mBAAmB,KAAA,GAAW;IAChC,KAAK,2BAA2B,MAAM;IACtC;GACF;GACA,KAAK,wBAAwB,QAAQ,cAAc;GACnD,aAAa,KAAK,2BAA2B,MAAM;EACrD,GAAG;GAAC;GAAM;GAAQ;EAAc,CAAC;CACnC;;;;;;;CAQA,YACE,UACA,UAAkC,CAAC,GACnC;EACA,MAAM,EAAE,eAAe,CAAC,MAAM;EAC9B,MAAM,SAAS,KAAK,UAAU;EAC9B,MAAM,UAAU,OAAO,KAAK,MAAM;EAElC,KAAK,iBAAiB,EACpB,cAAc;GACZ,QAAQ,UAAU;EACpB,EACF,CAAC;EAED,gBAAgB;GACd,aAAa;IACX,IAAI,CAAC,UAAU,QAAQ,SAAS;KAC9B,QAAQ,UAAU;KAClB,SAAS;IACX;GACF;EACF,GAAG,CAAC,QAAQ,GAAG,YAAY,CAAC;CAC9B;CAEA,OAAc,OACZ,UAAoC,CAAC,GAClB;EACnB,MAAM,aAAa,gBAAgB,IAAI,kBAAkB,OAAO,CAAC;EACjE,WAAW,iBAAiB,OAAO;EACnC,OAAO;CACT;CAEA,aACE,SACA,cACA;EACA,gBACS,UAAU,aAAa,OAAO,IAAI,KAAA,GACzC,CAAC,SAAS,IAAI,CAChB;CACF;CAEA,YAAmB;EACjB,OAAO,kBAAkB,KAAK,MAAM;CACtC;CAEA,wBAA+B;EAC7B,OAAO,kBAAkB,KAAK,kBAAkB;CAClD;CAEA,2BAAkC;EAChC,OAAO,kBAAkB,KAAK,qBAAqB;CACrD;CAEA,2BAAkC;EAChC,OAAO,kBAAkB,KAAK,qBAAqB;CACrD;CAEA,4BAAmC;EACjC,OAAO,sCAAsC,IAAI;CACnD;AACF"}

package/dist/js/packages/components-base/src/index.mjs

@@ -17,4 +17,5 @@ import { ListSearch } from "./list/search/ListSearch.mjs";
 import { ListSorting, mergeHiddenSorting } from "./list/sorting/ListSorting.mjs";
 import { ListTable } from "./list/table/ListTable.mjs";
 import { ListViewMode } from "./list/viewMode/ListViewMode.mjs";
-export { ActionState, ListBatchesController, ListDateRangeFilter, ListFilter, ListItemCollection, ListLoaderState, ListSearch, ListSorting, ListTable, ListViewMode, actionStateDurations, formatListDateRange, getListColumn, getListDataLoaderOptions, getListDateTimeRangeUpdate, isListDateTimeRangeEndBeforeStart, listDateTimeRangeFieldsFromValue, mergeHiddenSorting, resolveListDateRange, toListCalendarDate, toListTime };
+import { OverlayState } from "./overlay/OverlayState.mjs";
+export { ActionState, ListBatchesController, ListDateRangeFilter, ListFilter, ListItemCollection, ListLoaderState, ListSearch, ListSorting, ListTable, ListViewMode, OverlayState, actionStateDurations, formatListDateRange, getListColumn, getListDataLoaderOptions, getListDateTimeRangeUpdate, isListDateTimeRangeEndBeforeStart, listDateTimeRangeFieldsFromValue, mergeHiddenSorting, resolveListDateRange, toListCalendarDate, toListTime };