@mittwald/flow-react-components 1.3.5 → 1.4.0-next.0

package/dist/js/_virtual/_24.locale.mjs

@@ -5,6 +5,7 @@ var __locale_default = {
 	"de-DE": {
 		"mode.editor": "Vorschau beenden",
 		"mode.preview": "Vorschau",
+		"toolbar.attachment": "Datei anhängen",
 		"toolbar.bold": "Fett",
 		"toolbar.code": "Code",
 		"toolbar.italic": "Kursiv",
@@ -12,11 +13,15 @@ var __locale_default = {
 		"toolbar.orderedList": "Sortierte Liste",
 		"toolbar.quote": "Zitat",
 		"toolbar.strikeThrough": "Durchgestrichen",
-		"toolbar.unorderedList": "Liste"
+		"toolbar.unorderedList": "Liste",
+		"upload.failed": "{name} konnte nicht hochgeladen werden",
+		"upload.pending": "{name} wird hochgeladen",
+		"upload.succeeded": "{name} wurde hochgeladen"
 	},
 	"en-US": {
 		"mode.editor": "Exit Preview",
 		"mode.preview": "Preview",
+		"toolbar.attachment": "Attach file",
 		"toolbar.bold": "Bold",
 		"toolbar.code": "Code",
 		"toolbar.italic": "Italic",
@@ -24,7 +29,10 @@ var __locale_default = {
 		"toolbar.orderedList": "Ordered List",
 		"toolbar.quote": "Quote",
 		"toolbar.strikeThrough": "Strike through",
-		"toolbar.unorderedList": "List"
+		"toolbar.unorderedList": "List",
+		"upload.failed": "Could not upload {name}",
+		"upload.pending": "Uploading {name}",
+		"upload.succeeded": "Uploaded {name}"
 	}
 };
 //#endregion

package/dist/js/default.mjs

@@ -68,6 +68,7 @@ import { IconUnorderedList } from "./packages/components/src/components/Icon/com
 import { IconUpload } from "./packages/components/src/components/Icon/components/icons/IconUpload.mjs";
 import { IconView } from "./packages/components/src/components/Icon/components/icons/IconView.mjs";
 import { IconAI } from "./packages/components/src/components/Icon/components/icons/IconAI.mjs";
+import { IconAIHosting } from "./packages/components/src/components/Icon/components/icons/IconAIHosting.mjs";
 import { IconAnalytics } from "./packages/components/src/components/Icon/components/icons/IconAnalytics.mjs";
 import { IconApp } from "./packages/components/src/components/Icon/components/icons/IconApp.mjs";
 import { IconAutoresponder } from "./packages/components/src/components/Icon/components/icons/IconAutoresponder.mjs";
@@ -337,4 +338,4 @@ import { TextField } from "./packages/components/src/components/TextField/TextFi
 import { TimeField } from "./packages/components/src/components/TimeField/TimeField.mjs";
 import { Truncate } from "./packages/components/src/components/Truncate/Truncate.mjs";
 import { TunnelEntry } from "./packages/components/src/components/TunnelEntry/TunnelEntry.mjs";
-export { AbortActionError, AccentBox, Accordion, Action, ActionBatch, ActionGroup, Activity, Alert, AlertBadge, AlertIcon, AlertText, Align, Area, AreaDot, Autocomplete, Avatar, AvatarStack, Badge, Bar, BigNumber, Breadcrumb, BrowserOnly, Button, CartesianChart, CartesianGrid, ChartGrid, ChartLegend, ChartTooltip, Chat, Checkbox, CheckboxButton, CheckboxGroup, ClearPropsContext, CoachMark, CodeBlock, CodeEditor, Color, ColumnLayout, Combine, ComboBox, ComponentDefaultsContext, ComponentDefaultsProvider, ComponentPropsContextProvider, Content, ContextMenu, ContextMenuContent, ContextMenuSection, ContextMenuTrigger, ContextualHelp, ContextualHelpTrigger, CopyButton, CounterBadge, CountryOptions, DatePicker, DateRangePicker, DeprecationWarningContext, DeprecationWarningProvider, DialogTrigger, Div, DonutChart, EmptyView, EmptyViewContainer, FieldDescription, FieldError, FileCard, FileCardList, FileDropZone, FileField, Flex, GridList, GridListItem, Header, HeaderNavigation, Heading, Icon, IconAI, IconAnalytics, IconApp, IconAscending, IconAttachment, IconAutoresponder, IconBackLink, IconBackup, IconBold, IconCamera, IconCertificate, IconChangelog, IconCheck, IconCheckboxChecked, IconCheckboxEmpty, IconCheckboxIndeterminate, IconChevronDown, IconChevronLeft, IconChevronRight, IconChevronUp, IconClose, IconCode, IconContainer, IconContextMenu, IconContextMenuVertical, IconContract, IconContractPartner, IconContributor, IconCopy, IconCronjob, IconCustomer, IconDanger, IconDashboard, IconDatabase, IconDate, IconDelete, IconDeliveryBox, IconDescending, IconDesktop, IconDirectory, IconDnsSubZone, IconDnsZone, IconDomain, IconDownload, IconEdit, IconEmail, IconEmailArchive, IconExtension, IconExternalLink, IconFailed, IconFeedback, IconFile, IconFilter, IconForwardAddress, IconForwardLink, IconHide, IconHome, IconImage, IconInfo, IconInvite, IconInvoice, IconItalic, IconKnowledgeHint, IconLanguage, IconLeadFyndr, IconLink, IconLock, IconLockOpen, IconLogout, IconMainUser, IconMarketplace, IconMaximize, IconMember, IconMenu, IconMinimize, IconMinus, IconMittwald, IconMobile, IconMonitoring, IconMove, IconNewsletter, IconNotification, IconNumber, IconOrder, IconOrderedList, IconPassword, IconPath, IconPause, IconPayment, IconPending, IconPicture, IconPlus, IconProject, IconQuote, IconRadioOff, IconRadioOn, IconRedo, IconRefresh, IconRegistry, IconSave, IconSearch, IconSecurity, IconSend, IconServer, IconSetProvider, IconSettings, IconShare, IconShow, IconSorting, IconSsh, IconSshKey, IconSshSftp, IconStack, IconStar, IconStarFilled, IconStart, IconStrikeThrough, IconSubdomain, IconSucceeded, IconSuccess, IconSupport, IconTerminate, IconTicket, IconTime, IconUnavailable, IconUndo, IconUnorderedList, IconUpload, IconUser, IconVhost, IconView, IconVolume, IconWarning, IllustratedMessage, Image, ImageCropper, Initials, InlineCode, IntlProvider, Kbd, Label, LabeledValue, LayoutCard, Legend, LegendItem, LightBox, LightBoxGallery, LightBoxGalleryItem, LightBoxTrigger, Line, Link, List, ListFilter, ListItem, ListItemView, ListItemViewContent, ListLoaderAsync, ListSorting, ListStaticData, ListSummary, LoadingSpinner, Markdown, MarkdownEditor, MenuItem, MenuTrigger, Message, MessageSeparator, MessageThread, Modal, ModalTrigger, Navigation, NavigationGroup, Notification, NotificationController, NotificationProvider, NumberField, Option, Overlay, OverlayContent, OverlayController, OverlayTrigger, PasswordCreationField, Popover, PopoverContent, PopoverTrigger, ProgressBar, PropsContextProvider, Radio, RadioButton, RadioGroup, RangeCalendar, Rating, RatingSegment, Render, RouterProvider, SearchField, Section, Segment, SegmentedControl, Select, Separator, SettingsProvider, Skeleton, SkeletonText, Slider, SortingFunctions, SuspenseTrigger, Switch, Tab, TabNavigation, TabTitle, Table, TableBody, TableCell, TableColumn, TableFooterRow, TableHeader, TableRow, Tabs, Text, TextArea, TextField, ThemedHtml, TimeField, Tooltip, TooltipTrigger, TranslationProvider, Truncate, TunnelEntry, TypedArea, TypedBar, TypedChartGrid, TypedChartLegend, TypedChartTooltip, TypedLine, TypedList, TypedListFilter, TypedListItem, TypedListLoaderAsync, TypedListSorting, TypedListStaticData, TypedXAxis, TypedYAxis, Wrap, XAxis, YAxis, abortAction, builtInComponentDefaults, dynamic, eventHandlerContext, flags, getRemoteEvent, getResolvedTheme, getTheme, iconCategories, isDateRangeValue, overlayTriggersTunneledTo, propsContext, setTheme, sortByDachFirst, themeHtmlAttribute, typedCartesianChart, typedList, useAriaAnnounceSuspense, useComponentDefaults, useControlledRemoteValueProps, useDesignTokens, useIsMounted, useLanguage, useList, useListMetadata, useLocalizedStringFormatter, useModalController, useNotificationController, useOnChange, useOverlayController, useProps, useTheme as useStoredTheme, useResolvedTheme as useTheme, useTranslationProvider, useWarnDeprecation };
+export { AbortActionError, AccentBox, Accordion, Action, ActionBatch, ActionGroup, Activity, Alert, AlertBadge, AlertIcon, AlertText, Align, Area, AreaDot, Autocomplete, Avatar, AvatarStack, Badge, Bar, BigNumber, Breadcrumb, BrowserOnly, Button, CartesianChart, CartesianGrid, ChartGrid, ChartLegend, ChartTooltip, Chat, Checkbox, CheckboxButton, CheckboxGroup, ClearPropsContext, CoachMark, CodeBlock, CodeEditor, Color, ColumnLayout, Combine, ComboBox, ComponentDefaultsContext, ComponentDefaultsProvider, ComponentPropsContextProvider, Content, ContextMenu, ContextMenuContent, ContextMenuSection, ContextMenuTrigger, ContextualHelp, ContextualHelpTrigger, CopyButton, CounterBadge, CountryOptions, DatePicker, DateRangePicker, DeprecationWarningContext, DeprecationWarningProvider, DialogTrigger, Div, DonutChart, EmptyView, EmptyViewContainer, FieldDescription, FieldError, FileCard, FileCardList, FileDropZone, FileField, Flex, GridList, GridListItem, Header, HeaderNavigation, Heading, Icon, IconAI, IconAIHosting, IconAnalytics, IconApp, IconAscending, IconAttachment, IconAutoresponder, IconBackLink, IconBackup, IconBold, IconCamera, IconCertificate, IconChangelog, IconCheck, IconCheckboxChecked, IconCheckboxEmpty, IconCheckboxIndeterminate, IconChevronDown, IconChevronLeft, IconChevronRight, IconChevronUp, IconClose, IconCode, IconContainer, IconContextMenu, IconContextMenuVertical, IconContract, IconContractPartner, IconContributor, IconCopy, IconCronjob, IconCustomer, IconDanger, IconDashboard, IconDatabase, IconDate, IconDelete, IconDeliveryBox, IconDescending, IconDesktop, IconDirectory, IconDnsSubZone, IconDnsZone, IconDomain, IconDownload, IconEdit, IconEmail, IconEmailArchive, IconExtension, IconExternalLink, IconFailed, IconFeedback, IconFile, IconFilter, IconForwardAddress, IconForwardLink, IconHide, IconHome, IconImage, IconInfo, IconInvite, IconInvoice, IconItalic, IconKnowledgeHint, IconLanguage, IconLeadFyndr, IconLink, IconLock, IconLockOpen, IconLogout, IconMainUser, IconMarketplace, IconMaximize, IconMember, IconMenu, IconMinimize, IconMinus, IconMittwald, IconMobile, IconMonitoring, IconMove, IconNewsletter, IconNotification, IconNumber, IconOrder, IconOrderedList, IconPassword, IconPath, IconPause, IconPayment, IconPending, IconPicture, IconPlus, IconProject, IconQuote, IconRadioOff, IconRadioOn, IconRedo, IconRefresh, IconRegistry, IconSave, IconSearch, IconSecurity, IconSend, IconServer, IconSetProvider, IconSettings, IconShare, IconShow, IconSorting, IconSsh, IconSshKey, IconSshSftp, IconStack, IconStar, IconStarFilled, IconStart, IconStrikeThrough, IconSubdomain, IconSucceeded, IconSuccess, IconSupport, IconTerminate, IconTicket, IconTime, IconUnavailable, IconUndo, IconUnorderedList, IconUpload, IconUser, IconVhost, IconView, IconVolume, IconWarning, IllustratedMessage, Image, ImageCropper, Initials, InlineCode, IntlProvider, Kbd, Label, LabeledValue, LayoutCard, Legend, LegendItem, LightBox, LightBoxGallery, LightBoxGalleryItem, LightBoxTrigger, Line, Link, List, ListFilter, ListItem, ListItemView, ListItemViewContent, ListLoaderAsync, ListSorting, ListStaticData, ListSummary, LoadingSpinner, Markdown, MarkdownEditor, MenuItem, MenuTrigger, Message, MessageSeparator, MessageThread, Modal, ModalTrigger, Navigation, NavigationGroup, Notification, NotificationController, NotificationProvider, NumberField, Option, Overlay, OverlayContent, OverlayController, OverlayTrigger, PasswordCreationField, Popover, PopoverContent, PopoverTrigger, ProgressBar, PropsContextProvider, Radio, RadioButton, RadioGroup, RangeCalendar, Rating, RatingSegment, Render, RouterProvider, SearchField, Section, Segment, SegmentedControl, Select, Separator, SettingsProvider, Skeleton, SkeletonText, Slider, SortingFunctions, SuspenseTrigger, Switch, Tab, TabNavigation, TabTitle, Table, TableBody, TableCell, TableColumn, TableFooterRow, TableHeader, TableRow, Tabs, Text, TextArea, TextField, ThemedHtml, TimeField, Tooltip, TooltipTrigger, TranslationProvider, Truncate, TunnelEntry, TypedArea, TypedBar, TypedChartGrid, TypedChartLegend, TypedChartTooltip, TypedLine, TypedList, TypedListFilter, TypedListItem, TypedListLoaderAsync, TypedListSorting, TypedListStaticData, TypedXAxis, TypedYAxis, Wrap, XAxis, YAxis, abortAction, builtInComponentDefaults, dynamic, eventHandlerContext, flags, getRemoteEvent, getResolvedTheme, getTheme, iconCategories, isDateRangeValue, overlayTriggersTunneledTo, propsContext, setTheme, sortByDachFirst, themeHtmlAttribute, typedCartesianChart, typedList, useAriaAnnounceSuspense, useComponentDefaults, useControlledRemoteValueProps, useDesignTokens, useIsMounted, useLanguage, useList, useListMetadata, useLocalizedStringFormatter, useModalController, useNotificationController, useOnChange, useOverlayController, useProps, useTheme as useStoredTheme, useResolvedTheme as useTheme, useTranslationProvider, useWarnDeprecation };

package/dist/js/flr-universal.mjs

@@ -58,6 +58,7 @@ import { IconUnorderedList } from "./packages/components/src/components/Icon/com
 import { IconUpload } from "./packages/components/src/components/Icon/components/icons/IconUpload.mjs";
 import { IconView } from "./packages/components/src/components/Icon/components/icons/IconView.mjs";
 import { IconAI } from "./packages/components/src/components/Icon/components/icons/IconAI.mjs";
+import { IconAIHosting } from "./packages/components/src/components/Icon/components/icons/IconAIHosting.mjs";
 import { IconAnalytics } from "./packages/components/src/components/Icon/components/icons/IconAnalytics.mjs";
 import { IconApp } from "./packages/components/src/components/Icon/components/icons/IconApp.mjs";
 import { IconAutoresponder } from "./packages/components/src/components/Icon/components/icons/IconAutoresponder.mjs";
@@ -159,4 +160,4 @@ import { SettingsProvider } from "./packages/components/src/components/SettingsP
 import { List } from "./packages/components/src/components/List/List.mjs";
 import { typedList } from "./packages/components/src/components/List/typedList.mjs";
 import { NotificationProvider, useNotificationController } from "./packages/components/src/components/NotificationProvider/NotificationProvider.mjs";
-export { Action, ActionBatch, BrowserOnly, ComponentDefaultsProvider, CountryOptions, DeprecationWarningProvider, IconAI, IconAnalytics, IconApp, IconAscending, IconAttachment, IconAutoresponder, IconBackLink, IconBackup, IconBold, IconCamera, IconCertificate, IconChangelog, IconCheck, IconCheckboxChecked, IconCheckboxEmpty, IconCheckboxIndeterminate, IconChevronDown, IconChevronLeft, IconChevronRight, IconChevronUp, IconClose, IconCode, IconContainer, IconContextMenu, IconContextMenuVertical, IconContract, IconContractPartner, IconContributor, IconCopy, IconCronjob, IconCustomer, IconDanger, IconDashboard, IconDatabase, IconDate, IconDelete, IconDeliveryBox, IconDescending, IconDesktop, IconDirectory, IconDnsSubZone, IconDnsZone, IconDomain, IconDownload, IconEdit, IconEmail, IconEmailArchive, IconExtension, IconExternalLink, IconFailed, IconFeedback, IconFile, IconFilter, IconForwardAddress, IconForwardLink, IconHide, IconHome, IconImage, IconInfo, IconInvite, IconInvoice, IconItalic, IconKnowledgeHint, IconLanguage, IconLeadFyndr, IconLink, IconLock, IconLockOpen, IconLogout, IconMainUser, IconMarketplace, IconMaximize, IconMember, IconMenu, IconMinimize, IconMinus, IconMittwald, IconMobile, IconMonitoring, IconMove, IconNewsletter, IconNotification, IconNumber, IconOrder, IconOrderedList, IconPassword, IconPath, IconPause, IconPayment, IconPending, IconPicture, IconPlus, IconProject, IconQuote, IconRadioOff, IconRadioOn, IconRedo, IconRefresh, IconRegistry, IconSave, IconSearch, IconSecurity, IconSend, IconServer, IconSettings, IconShare, IconShow, IconSorting, IconSsh, IconSshKey, IconSshSftp, IconStack, IconStar, IconStarFilled, IconStart, IconStrikeThrough, IconSubdomain, IconSucceeded, IconSuccess, IconSupport, IconTerminate, IconTicket, IconTime, IconUnavailable, IconUndo, IconUnorderedList, IconUpload, IconUser, IconVhost, IconView, IconVolume, IconWarning, IntlProvider, LightBox, LightBoxTrigger, List, ListItemView, Modal, ModalTrigger, NotificationProvider, OverlayController, Popover, PopoverTrigger, SettingsProvider, Wrap, typedList, useControlledRemoteValueProps, useIsMounted, useLanguage, useModalController, useNotificationController, useOnChange, useOverlayController, useProps };
+export { Action, ActionBatch, BrowserOnly, ComponentDefaultsProvider, CountryOptions, DeprecationWarningProvider, IconAI, IconAIHosting, IconAnalytics, IconApp, IconAscending, IconAttachment, IconAutoresponder, IconBackLink, IconBackup, IconBold, IconCamera, IconCertificate, IconChangelog, IconCheck, IconCheckboxChecked, IconCheckboxEmpty, IconCheckboxIndeterminate, IconChevronDown, IconChevronLeft, IconChevronRight, IconChevronUp, IconClose, IconCode, IconContainer, IconContextMenu, IconContextMenuVertical, IconContract, IconContractPartner, IconContributor, IconCopy, IconCronjob, IconCustomer, IconDanger, IconDashboard, IconDatabase, IconDate, IconDelete, IconDeliveryBox, IconDescending, IconDesktop, IconDirectory, IconDnsSubZone, IconDnsZone, IconDomain, IconDownload, IconEdit, IconEmail, IconEmailArchive, IconExtension, IconExternalLink, IconFailed, IconFeedback, IconFile, IconFilter, IconForwardAddress, IconForwardLink, IconHide, IconHome, IconImage, IconInfo, IconInvite, IconInvoice, IconItalic, IconKnowledgeHint, IconLanguage, IconLeadFyndr, IconLink, IconLock, IconLockOpen, IconLogout, IconMainUser, IconMarketplace, IconMaximize, IconMember, IconMenu, IconMinimize, IconMinus, IconMittwald, IconMobile, IconMonitoring, IconMove, IconNewsletter, IconNotification, IconNumber, IconOrder, IconOrderedList, IconPassword, IconPath, IconPause, IconPayment, IconPending, IconPicture, IconPlus, IconProject, IconQuote, IconRadioOff, IconRadioOn, IconRedo, IconRefresh, IconRegistry, IconSave, IconSearch, IconSecurity, IconSend, IconServer, IconSettings, IconShare, IconShow, IconSorting, IconSsh, IconSshKey, IconSshSftp, IconStack, IconStar, IconStarFilled, IconStart, IconStrikeThrough, IconSubdomain, IconSucceeded, IconSuccess, IconSupport, IconTerminate, IconTicket, IconTime, IconUnavailable, IconUndo, IconUnorderedList, IconUpload, IconUser, IconVhost, IconView, IconVolume, IconWarning, IntlProvider, LightBox, LightBoxTrigger, List, ListItemView, Modal, ModalTrigger, NotificationProvider, OverlayController, Popover, PopoverTrigger, SettingsProvider, Wrap, typedList, useControlledRemoteValueProps, useIsMounted, useLanguage, useModalController, useNotificationController, useOnChange, useOverlayController, useProps };

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

@@ -57,15 +57,32 @@ var ActionModel = class ActionModel {
 			parentAction: ActionModel.useNew({ closeOverlay: action.confirmationModalController }, { parentAction: action.parentAction })
 		});
 	}
+	/**
+	* Resolves an overlay reference against this action's overlay context.
+	*
+	* Returns `undefined` unless the action carries one of the overlay props –
+	* `Action` relies on that to tell whether it owns a surrounding `Modal`'s
+	* controller.
+	*/
 	getOverlayController(from) {
-		const getController = (controller) => {
-			if (controller === void 0) return;
-			if (from instanceof OverlayController) return from;
-			if (typeof from === "string") return this.overlayContext[from];
-			if ("overlay" in from) return this.getOverlayController(from.overlay);
-			return this.getOverlayController("Modal");
-		};
-		return getController(this.actionProps.openOverlay) ?? getController(this.actionProps.closeOverlay) ?? getController(this.actionProps.toggleOverlay) ?? getController(this.actionProps.openModal ? "Modal" : void 0) ?? getController(this.actionProps.closeModal ? "Modal" : void 0) ?? getController(this.actionProps.toggleModal ? "Modal" : void 0);
+		return this.hasOverlayProps ? this.resolveOverlayReference(from) : void 0;
+	}
+	get hasOverlayProps() {
+		const { openOverlay, closeOverlay, toggleOverlay, openModal, closeModal, toggleModal } = this.actionProps;
+		return [
+			openOverlay,
+			closeOverlay,
+			toggleOverlay,
+			openModal,
+			closeModal,
+			toggleModal
+		].some(Boolean);
+	}
+	resolveOverlayReference(from) {
+		if (from instanceof OverlayController) return from;
+		if (typeof from === "string") return this.overlayContext.byType[from];
+		if (from === true || !("overlay" in from) || from.overlay === void 0) return this.overlayContext.nearest;
+		return this.resolveOverlayReference(from.overlay);
 	}
 	static getCloseOverlayOptions = (options) => {
 		if (options === void 0 || options instanceof OverlayController || typeof options === "string" || options === true) return;

package/dist/js/packages/components/src/components/Action/models/ActionModel.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ActionModel.mjs","names":[],"sources":["../../../../../../../../src/components/Action/models/ActionModel.tsx"],"sourcesContent":["import { useContext } from \"react\";\nimport { OverlayController } from \"@/lib/controller\";\nimport invariant from \"invariant\";\nimport { type ActionProps } from \"@/components/Action/types\";\nimport { actionContext } from \"@/components/Action/context\";\nimport { ActionState } from \"@/components/Action/models/ActionState\";\nimport { ActionExecution } from \"@/components/Action/models/ActionExecution\";\nimport { ActionStateContext } from \"@/components/Action/models/ActionStateContext\";\nimport type { OverlayContext } from \"@/lib/controller/overlay/context\";\nimport { useOverlayContext } from \"@/lib/controller/overlay/context\";\nimport type { FlowComponentName } from \"@/components/propTypes\";\nimport type {\n  CloseModalOptions,\n  CloseOverlayOptions,\n} from \"@/lib/controller/overlay/OverlayController\";\n\ninterface InitObject {\n  actionProps: ActionProps;\n  parentAction?: ActionModel;\n  confirmationModalController: OverlayController;\n  needsConfirmation: boolean;\n  overlayContext: OverlayContext;\n  state: ActionState;\n}\n\nexport class ActionModel {\n  public state: ActionState;\n  public needsConfirmation: boolean;\n  public readonly actionProps: ActionProps;\n  public readonly parentAction?: ActionModel;\n  public readonly confirmationModalController: OverlayController;\n  public readonly overlayContext: OverlayContext;\n\n  private constructor(init: InitObject) {\n    const {\n      actionProps,\n      needsConfirmation,\n      parentAction,\n      overlayContext,\n      confirmationModalController,\n      state,\n    } = init;\n\n    this.actionProps = actionProps;\n    this.parentAction = parentAction;\n    this.confirmationModalController = confirmationModalController;\n    this.needsConfirmation = needsConfirmation;\n    this.overlayContext = overlayContext;\n    this.state = state;\n  }\n\n  public static useNew(\n    actionProps: ActionProps,\n    init: Partial<InitObject> = {},\n  ): ActionModel {\n    const parentAction = useContext(actionContext);\n    const overlayContext = useOverlayContext();\n    const confirmationModalController = OverlayController.useNew();\n    const state = ActionState.useNew();\n\n    return new ActionModel({\n      parentAction,\n      overlayContext,\n      confirmationModalController,\n      needsConfirmation: false,\n      actionProps,\n      state,\n      ...init,\n    });\n  }\n\n  public static use(): ActionModel {\n    const c = useContext(actionContext);\n    invariant(!!c, \"Action context is not defined\");\n    ActionStateContext.useRegisterState(c.state);\n    return c;\n  }\n\n  public static useConfirmationAction(): ActionModel {\n    const action = ActionModel.use();\n\n    return new ActionModel({\n      actionProps: action.actionProps,\n      confirmationModalController: action.confirmationModalController,\n      overlayContext: action.overlayContext,\n      state: action.state,\n      needsConfirmation: false,\n      parentAction: ActionModel.useNew(\n        {\n          closeOverlay: action.confirmationModalController,\n        },\n        {\n          parentAction: action.parentAction,\n        },\n      ),\n    });\n  }\n\n  public getOverlayController(\n    from:\n      | FlowComponentName\n      | OverlayController\n      | CloseOverlayOptions\n      | CloseModalOptions,\n  ): OverlayController | undefined {\n    const getController = (\n      controller?:\n        | OverlayController\n        | FlowComponentName\n        | CloseOverlayOptions\n        | CloseModalOptions,\n    ): OverlayController | undefined => {\n      if (controller === undefined) {\n        return undefined;\n      }\n      if (from instanceof OverlayController) {\n        return from;\n      }\n      if (typeof from === \"string\") {\n        return this.overlayContext[from];\n      }\n      if (\"overlay\" in from) {\n        return this.getOverlayController(from.overlay);\n      }\n      return this.getOverlayController(\"Modal\");\n    };\n\n    return (\n      getController(this.actionProps.openOverlay) ??\n      getController(this.actionProps.closeOverlay) ??\n      getController(this.actionProps.toggleOverlay) ??\n      getController(this.actionProps.openModal ? \"Modal\" : undefined) ??\n      getController(this.actionProps.closeModal ? \"Modal\" : undefined) ??\n      getController(this.actionProps.toggleModal ? \"Modal\" : undefined)\n    );\n  }\n\n  public static getCloseOverlayOptions = (\n    options?:\n      | OverlayController\n      | FlowComponentName\n      | CloseOverlayOptions\n      | CloseModalOptions\n      | true,\n  ) => {\n    if (\n      options === undefined ||\n      options instanceof OverlayController ||\n      typeof options === \"string\" ||\n      options === true\n    ) {\n      return undefined;\n    }\n    return options;\n  };\n\n  public execute = (...args: unknown[]): void => {\n    new ActionExecution(this).execute(...args);\n  };\n}\n"],"mappings":";;;;;;;;;;;AAyBA,IAAa,cAAb,MAAa,YAAY;CACvB;CACA;CACA;CACA;CACA;CACA;CAEA,YAAoB,MAAkB;EACpC,MAAM,EACJ,aACA,mBACA,cACA,gBACA,6BACA,UACE;EAEJ,KAAK,cAAc;EACnB,KAAK,eAAe;EACpB,KAAK,8BAA8B;EACnC,KAAK,oBAAoB;EACzB,KAAK,iBAAiB;EACtB,KAAK,QAAQ;CACf;CAEA,OAAc,OACZ,aACA,OAA4B,CAAC,GAChB;EACb,MAAM,eAAe,WAAW,aAAa;EAC7C,MAAM,iBAAiB,kBAAkB;EACzC,MAAM,8BAA8B,kBAAkB,OAAO;EAC7D,MAAM,QAAQ,YAAY,OAAO;EAEjC,OAAO,IAAI,YAAY;GACrB;GACA;GACA;GACA,mBAAmB;GACnB;GACA;GACA,GAAG;EACL,CAAC;CACH;CAEA,OAAc,MAAmB;EAC/B,MAAM,IAAI,WAAW,aAAa;EAClC,UAAU,CAAC,CAAC,GAAG,+BAA+B;EAC9C,mBAAmB,iBAAiB,EAAE,KAAK;EAC3C,OAAO;CACT;CAEA,OAAc,wBAAqC;EACjD,MAAM,SAAS,YAAY,IAAI;EAE/B,OAAO,IAAI,YAAY;GACrB,aAAa,OAAO;GACpB,6BAA6B,OAAO;GACpC,gBAAgB,OAAO;GACvB,OAAO,OAAO;GACd,mBAAmB;GACnB,cAAc,YAAY,OACxB,EACE,cAAc,OAAO,4BACvB,GACA,EACE,cAAc,OAAO,aACvB,CACF;EACF,CAAC;CACH;CAEA,qBACE,MAK+B;EAC/B,MAAM,iBACJ,eAKkC;GAClC,IAAI,eAAe,KAAA,GACjB;GAEF,IAAI,gBAAgB,mBAClB,OAAO;GAET,IAAI,OAAO,SAAS,UAClB,OAAO,KAAK,eAAe;GAE7B,IAAI,aAAa,MACf,OAAO,KAAK,qBAAqB,KAAK,OAAO;GAE/C,OAAO,KAAK,qBAAqB,OAAO;EAC1C;EAEA,OACE,cAAc,KAAK,YAAY,WAAW,KAC1C,cAAc,KAAK,YAAY,YAAY,KAC3C,cAAc,KAAK,YAAY,aAAa,KAC5C,cAAc,KAAK,YAAY,YAAY,UAAU,KAAA,CAAS,KAC9D,cAAc,KAAK,YAAY,aAAa,UAAU,KAAA,CAAS,KAC/D,cAAc,KAAK,YAAY,cAAc,UAAU,KAAA,CAAS;CAEpE;CAEA,OAAc,0BACZ,YAMG;EACH,IACE,YAAY,KAAA,KACZ,mBAAmB,qBACnB,OAAO,YAAY,YACnB,YAAY,MAEZ;EAEF,OAAO;CACT;CAEA,WAAkB,GAAG,SAA0B;EAC7C,IAAI,gBAAgB,IAAI,CAAC,CAAC,QAAQ,GAAG,IAAI;CAC3C;AACF"}
+{"version":3,"file":"ActionModel.mjs","names":[],"sources":["../../../../../../../../src/components/Action/models/ActionModel.tsx"],"sourcesContent":["import { useContext } from \"react\";\nimport { OverlayController } from \"@/lib/controller\";\nimport invariant from \"invariant\";\nimport { type ActionProps } from \"@/components/Action/types\";\nimport { actionContext } from \"@/components/Action/context\";\nimport { ActionState } from \"@/components/Action/models/ActionState\";\nimport { ActionExecution } from \"@/components/Action/models/ActionExecution\";\nimport { ActionStateContext } from \"@/components/Action/models/ActionStateContext\";\nimport type { OverlayContext } from \"@/lib/controller/overlay/context\";\nimport { useOverlayContext } from \"@/lib/controller/overlay/context\";\nimport type { OverlayReference } from \"@/lib/controller/overlay/OverlayController\";\n\ninterface InitObject {\n  actionProps: ActionProps;\n  parentAction?: ActionModel;\n  confirmationModalController: OverlayController;\n  needsConfirmation: boolean;\n  overlayContext: OverlayContext;\n  state: ActionState;\n}\n\nexport class ActionModel {\n  public state: ActionState;\n  public needsConfirmation: boolean;\n  public readonly actionProps: ActionProps;\n  public readonly parentAction?: ActionModel;\n  public readonly confirmationModalController: OverlayController;\n  public readonly overlayContext: OverlayContext;\n\n  private constructor(init: InitObject) {\n    const {\n      actionProps,\n      needsConfirmation,\n      parentAction,\n      overlayContext,\n      confirmationModalController,\n      state,\n    } = init;\n\n    this.actionProps = actionProps;\n    this.parentAction = parentAction;\n    this.confirmationModalController = confirmationModalController;\n    this.needsConfirmation = needsConfirmation;\n    this.overlayContext = overlayContext;\n    this.state = state;\n  }\n\n  public static useNew(\n    actionProps: ActionProps,\n    init: Partial<InitObject> = {},\n  ): ActionModel {\n    const parentAction = useContext(actionContext);\n    const overlayContext = useOverlayContext();\n    const confirmationModalController = OverlayController.useNew();\n    const state = ActionState.useNew();\n\n    return new ActionModel({\n      parentAction,\n      overlayContext,\n      confirmationModalController,\n      needsConfirmation: false,\n      actionProps,\n      state,\n      ...init,\n    });\n  }\n\n  public static use(): ActionModel {\n    const c = useContext(actionContext);\n    invariant(!!c, \"Action context is not defined\");\n    ActionStateContext.useRegisterState(c.state);\n    return c;\n  }\n\n  public static useConfirmationAction(): ActionModel {\n    const action = ActionModel.use();\n\n    return new ActionModel({\n      actionProps: action.actionProps,\n      confirmationModalController: action.confirmationModalController,\n      overlayContext: action.overlayContext,\n      state: action.state,\n      needsConfirmation: false,\n      parentAction: ActionModel.useNew(\n        {\n          closeOverlay: action.confirmationModalController,\n        },\n        {\n          parentAction: action.parentAction,\n        },\n      ),\n    });\n  }\n\n  /**\n   * Resolves an overlay reference against this action's overlay context.\n   *\n   * Returns `undefined` unless the action carries one of the overlay props –\n   * `Action` relies on that to tell whether it owns a surrounding `Modal`'s\n   * controller.\n   */\n  public getOverlayController(\n    from: OverlayReference,\n  ): OverlayController | undefined {\n    return this.hasOverlayProps\n      ? this.resolveOverlayReference(from)\n      : undefined;\n  }\n\n  private get hasOverlayProps(): boolean {\n    const {\n      openOverlay,\n      closeOverlay,\n      toggleOverlay,\n      openModal,\n      closeModal,\n      toggleModal,\n    } = this.actionProps;\n\n    return [\n      openOverlay,\n      closeOverlay,\n      toggleOverlay,\n      openModal,\n      closeModal,\n      toggleModal,\n    ].some(Boolean);\n  }\n\n  private resolveOverlayReference(\n    from: OverlayReference,\n  ): OverlayController | undefined {\n    if (from instanceof OverlayController) {\n      return from;\n    }\n    if (typeof from === \"string\") {\n      return this.overlayContext.byType[from];\n    }\n    // `true` and options without an `overlay` both mean \"the nearest one\".\n    if (from === true || !(\"overlay\" in from) || from.overlay === undefined) {\n      return this.overlayContext.nearest;\n    }\n    return this.resolveOverlayReference(from.overlay);\n  }\n\n  public static getCloseOverlayOptions = (options?: OverlayReference) => {\n    if (\n      options === undefined ||\n      options instanceof OverlayController ||\n      typeof options === \"string\" ||\n      options === true\n    ) {\n      return undefined;\n    }\n    return options;\n  };\n\n  public execute = (...args: unknown[]): void => {\n    new ActionExecution(this).execute(...args);\n  };\n}\n"],"mappings":";;;;;;;;;;;AAqBA,IAAa,cAAb,MAAa,YAAY;CACvB;CACA;CACA;CACA;CACA;CACA;CAEA,YAAoB,MAAkB;EACpC,MAAM,EACJ,aACA,mBACA,cACA,gBACA,6BACA,UACE;EAEJ,KAAK,cAAc;EACnB,KAAK,eAAe;EACpB,KAAK,8BAA8B;EACnC,KAAK,oBAAoB;EACzB,KAAK,iBAAiB;EACtB,KAAK,QAAQ;CACf;CAEA,OAAc,OACZ,aACA,OAA4B,CAAC,GAChB;EACb,MAAM,eAAe,WAAW,aAAa;EAC7C,MAAM,iBAAiB,kBAAkB;EACzC,MAAM,8BAA8B,kBAAkB,OAAO;EAC7D,MAAM,QAAQ,YAAY,OAAO;EAEjC,OAAO,IAAI,YAAY;GACrB;GACA;GACA;GACA,mBAAmB;GACnB;GACA;GACA,GAAG;EACL,CAAC;CACH;CAEA,OAAc,MAAmB;EAC/B,MAAM,IAAI,WAAW,aAAa;EAClC,UAAU,CAAC,CAAC,GAAG,+BAA+B;EAC9C,mBAAmB,iBAAiB,EAAE,KAAK;EAC3C,OAAO;CACT;CAEA,OAAc,wBAAqC;EACjD,MAAM,SAAS,YAAY,IAAI;EAE/B,OAAO,IAAI,YAAY;GACrB,aAAa,OAAO;GACpB,6BAA6B,OAAO;GACpC,gBAAgB,OAAO;GACvB,OAAO,OAAO;GACd,mBAAmB;GACnB,cAAc,YAAY,OACxB,EACE,cAAc,OAAO,4BACvB,GACA,EACE,cAAc,OAAO,aACvB,CACF;EACF,CAAC;CACH;;;;;;;;CASA,qBACE,MAC+B;EAC/B,OAAO,KAAK,kBACR,KAAK,wBAAwB,IAAI,IACjC,KAAA;CACN;CAEA,IAAY,kBAA2B;EACrC,MAAM,EACJ,aACA,cACA,eACA,WACA,YACA,gBACE,KAAK;EAET,OAAO;GACL;GACA;GACA;GACA;GACA;GACA;EACF,CAAC,CAAC,KAAK,OAAO;CAChB;CAEA,wBACE,MAC+B;EAC/B,IAAI,gBAAgB,mBAClB,OAAO;EAET,IAAI,OAAO,SAAS,UAClB,OAAO,KAAK,eAAe,OAAO;EAGpC,IAAI,SAAS,QAAQ,EAAE,aAAa,SAAS,KAAK,YAAY,KAAA,GAC5D,OAAO,KAAK,eAAe;EAE7B,OAAO,KAAK,wBAAwB,KAAK,OAAO;CAClD;CAEA,OAAc,0BAA0B,YAA+B;EACrE,IACE,YAAY,KAAA,KACZ,mBAAmB,qBACnB,OAAO,YAAY,YACnB,YAAY,MAEZ;EAEF,OAAO;CACT;CAEA,WAAkB,GAAG,SAA0B;EAC7C,IAAI,gBAAgB,IAAI,CAAC,CAAC,QAAQ,GAAG,IAAI;CAC3C;AACF"}

package/dist/js/packages/components/src/components/CheckboxButton/CheckboxButton.mjs

@@ -22,7 +22,6 @@ var CheckboxButton = flowComponent("CheckboxButton", (props) => {
 		className: clsx(fieldProps.className, CheckboxButton_module_default.checkboxButton, className),
 		children: [/* @__PURE__ */ jsx(FieldErrorCaptureContext, { children: /* @__PURE__ */ jsx(Checkbox, {
 			...rest,
-			className: CheckboxButton_module_default.checkbox,
 			inputClassName: clsx(inputClassName, CheckboxButton_module_default.input),
 			children: /* @__PURE__ */ jsx(PropsContextProvider, {
 				props: mergedPropsContext,

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

@@ -1 +1 @@
-{"version":3,"file":"CheckboxButton.mjs","names":[],"sources":["../../../../../../../src/components/CheckboxButton/CheckboxButton.tsx"],"sourcesContent":["import styles from \"./CheckboxButton.module.scss\";\nimport clsx from \"clsx\";\nimport type { PropsContext } from \"@/lib/propsContext\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport type { CheckboxProps } from \"@/components/Checkbox\";\nimport { Checkbox } from \"@/components/Checkbox\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport { useFieldComponent } from \"@/lib/hooks/useFieldComponent\";\n\nexport interface CheckboxButtonProps\n  extends CheckboxProps, FlowComponentProps<HTMLInputElement> {}\n\n/** @flr-generate all */\nexport const CheckboxButton = flowComponent(\"CheckboxButton\", (props) => {\n  const { children, className, inputClassName, ...rest } = props;\n\n  const {\n    fieldPropsContext,\n    fieldProps,\n    FieldErrorView,\n    FieldErrorCaptureContext,\n  } = useFieldComponent(props, \"CheckboxButton\");\n\n  const mergedPropsContext: PropsContext = {\n    Text: {\n      className: styles.label,\n    },\n    Content: {\n      className: styles.content,\n    },\n    ...fieldPropsContext,\n  };\n\n  return (\n    <div\n      {...fieldProps}\n      className={clsx(fieldProps.className, styles.checkboxButton, className)}\n    >\n      <FieldErrorCaptureContext>\n        <Checkbox\n          {...rest}\n          className={styles.checkbox}\n          inputClassName={clsx(inputClassName, styles.input)}\n        >\n          <PropsContextProvider props={mergedPropsContext}>\n            {children}\n          </PropsContextProvider>\n        </Checkbox>\n      </FieldErrorCaptureContext>\n      <FieldErrorView />\n    </div>\n  );\n});\n\nexport default CheckboxButton;\n"],"mappings":";;;;;;;;;;;AAcA,IAAa,iBAAiB,cAAc,mBAAmB,UAAU;CACvE,MAAM,EAAE,UAAU,WAAW,gBAAgB,GAAG,SAAS;CAEzD,MAAM,EACJ,mBACA,YACA,gBACA,6BACE,kBAAkB,OAAO,gBAAgB;CAE7C,MAAM,qBAAmC;EACvC,MAAM,EACJ,WAAW,8BAAO,MACpB;EACA,SAAS,EACP,WAAW,8BAAO,QACpB;EACA,GAAG;CACL;CAEA,OACE,qBAAC,OAAD;EACE,GAAI;EACJ,WAAW,KAAK,WAAW,WAAW,8BAAO,gBAAgB,SAAS;EAFxE,UAAA,CAIE,oBAAC,0BAAD,EAAA,UACE,oBAAC,UAAD;GACE,GAAI;GACJ,WAAW,8BAAO;GAClB,gBAAgB,KAAK,gBAAgB,8BAAO,KAAK;GAEjD,UAAA,oBAAC,sBAAD;IAAsB,OAAO;IAC1B;GACmB,CAAA;EACd,CAAA,EACc,CAAA,GAC1B,oBAAC,gBAAD,CAAiB,CAAA,CACd;;AAET,CAAC"}
+{"version":3,"file":"CheckboxButton.mjs","names":[],"sources":["../../../../../../../src/components/CheckboxButton/CheckboxButton.tsx"],"sourcesContent":["import styles from \"./CheckboxButton.module.scss\";\nimport clsx from \"clsx\";\nimport type { PropsContext } from \"@/lib/propsContext\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport type { CheckboxProps } from \"@/components/Checkbox\";\nimport { Checkbox } from \"@/components/Checkbox\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport { useFieldComponent } from \"@/lib/hooks/useFieldComponent\";\n\nexport interface CheckboxButtonProps\n  extends CheckboxProps, FlowComponentProps<HTMLInputElement> {}\n\n/** @flr-generate all */\nexport const CheckboxButton = flowComponent(\"CheckboxButton\", (props) => {\n  const { children, className, inputClassName, ...rest } = props;\n\n  const {\n    fieldPropsContext,\n    fieldProps,\n    FieldErrorView,\n    FieldErrorCaptureContext,\n  } = useFieldComponent(props, \"CheckboxButton\");\n\n  const mergedPropsContext: PropsContext = {\n    Text: {\n      className: styles.label,\n    },\n    Content: {\n      className: styles.content,\n    },\n    ...fieldPropsContext,\n  };\n\n  return (\n    <div\n      {...fieldProps}\n      className={clsx(fieldProps.className, styles.checkboxButton, className)}\n    >\n      <FieldErrorCaptureContext>\n        <Checkbox {...rest} inputClassName={clsx(inputClassName, styles.input)}>\n          <PropsContextProvider props={mergedPropsContext}>\n            {children}\n          </PropsContextProvider>\n        </Checkbox>\n      </FieldErrorCaptureContext>\n      <FieldErrorView />\n    </div>\n  );\n});\n\nexport default CheckboxButton;\n"],"mappings":";;;;;;;;;;;AAcA,IAAa,iBAAiB,cAAc,mBAAmB,UAAU;CACvE,MAAM,EAAE,UAAU,WAAW,gBAAgB,GAAG,SAAS;CAEzD,MAAM,EACJ,mBACA,YACA,gBACA,6BACE,kBAAkB,OAAO,gBAAgB;CAE7C,MAAM,qBAAmC;EACvC,MAAM,EACJ,WAAW,8BAAO,MACpB;EACA,SAAS,EACP,WAAW,8BAAO,QACpB;EACA,GAAG;CACL;CAEA,OACE,qBAAC,OAAD;EACE,GAAI;EACJ,WAAW,KAAK,WAAW,WAAW,8BAAO,gBAAgB,SAAS;EAFxE,UAAA,CAIE,oBAAC,0BAAD,EAAA,UACE,oBAAC,UAAD;GAAU,GAAI;GAAM,gBAAgB,KAAK,gBAAgB,8BAAO,KAAK;GACnE,UAAA,oBAAC,sBAAD;IAAsB,OAAO;IAC1B;GACmB,CAAA;EACd,CAAA,EACc,CAAA,GAC1B,oBAAC,gBAAD,CAAiB,CAAA,CACd;;AAET,CAAC"}

package/dist/js/packages/components/src/components/CheckboxButton/CheckboxButton.module.mjs

@@ -6,16 +6,14 @@ var input = "flow--checkbox-button--input";
 var readonly = "flow--checkbox-button--readonly";
 var content = "flow--checkbox-button--content";
 var label = "flow--checkbox-button--label";
-var checkbox = "flow--checkbox-button--checkbox";
 var CheckboxButton_module_default = {
 	checkboxButton,
 	input,
 	readonly,
 	content,
-	label,
-	checkbox
+	label
 };
 //#endregion
-export { checkbox, checkboxButton, content, CheckboxButton_module_default as default, input, label, readonly };
+export { checkboxButton, content, CheckboxButton_module_default as default, input, label, readonly };
 
 //# sourceMappingURL=CheckboxButton.module.mjs.map

package/dist/js/packages/components/src/components/CheckboxButton/CheckboxButton.module.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"CheckboxButton.module.mjs","names":[],"sources":["../../../../../../../src/components/CheckboxButton/CheckboxButton.module.scss"],"sourcesContent":["@use \"@/styles/mixins/formControl\";\n\n.checkboxButton {\n  @include formControl.formHiddenInputScrollBehaviorFix;\n\n  align-self: normal;\n  width: fit-content;\n\n  .input {\n    @include formControl.formControl();\n\n    & {\n      order: unset;\n      height: 100%;\n    }\n\n    /* With content */\n    &:focus-within:not([data-selected], [data-focus-visible]) {\n      border-color: var(--form-control--border-color--default);\n    }\n\n    &[data-invalid]:not([data-selected]) {\n      border-color: var(--form-control--border-color--invalid);\n      background-color: var(--form-control--background-color--invalid);\n    }\n\n    &:has(.content) {\n      display: grid;\n      grid-template:\n        \"icon label\" auto\n        \".    content\" 1fr\n        / auto 1fr;\n\n      .label {\n        font-weight: var(--font-weight--bold);\n      }\n    }\n  }\n\n  /* Elements */\n  .checkbox {\n    flex-grow: 1;\n  }\n\n  .label {\n    grid-area: label;\n  }\n\n  .content {\n    grid-area: content;\n  }\n}\n"],"mappings":""}
+{"version":3,"file":"CheckboxButton.module.mjs","names":[],"sources":["../../../../../../../src/components/CheckboxButton/CheckboxButton.module.scss"],"sourcesContent":["@use \"@/styles/mixins/formControl\";\n\n.checkboxButton {\n  @include formControl.formHiddenInputScrollBehaviorFix;\n\n  align-self: normal;\n  width: fit-content;\n\n  .input {\n    @include formControl.formControl();\n\n    & {\n      order: unset;\n    }\n\n    /* With content */\n    &:focus-within:not([data-selected], [data-focus-visible]) {\n      border-color: var(--form-control--border-color--default);\n    }\n\n    &[data-invalid]:not([data-selected]) {\n      border-color: var(--form-control--border-color--invalid);\n      background-color: var(--form-control--background-color--invalid);\n    }\n\n    &:has(.content) {\n      display: grid;\n      grid-template-areas:\n        \"icon label\"\n        \".    content\";\n      grid-template-rows: auto 1fr;\n\n      .label {\n        font-weight: var(--font-weight--bold);\n      }\n    }\n  }\n\n  /* Elements */\n  .label {\n    grid-area: label;\n  }\n\n  .content {\n    grid-area: content;\n  }\n}\n"],"mappings":""}

package/dist/js/packages/components/src/components/ContextMenu/ContextMenu.mjs

@@ -6,7 +6,7 @@ import { useOverlayController } from "../../lib/controller/overlay/useOverlayCon
 import { Action } from "../Action/Action.mjs";
 import { OverlayContextProvider } from "../../lib/controller/overlay/OverlayContextProvider.mjs";
 import { Popover } from "../Popover/Popover.mjs";
-import { getAriaSelectionMode, getCloseOverlayType, getMenuItemSelectionVariant } from "./lib.mjs";
+import { closesOnSelect, getAriaSelectionMode, getMenuItemSelectionVariant } from "./lib.mjs";
 import ContextMenuContentView from "../../views/ContextMenuContentView.mjs";
 import ContextMenu_module_default from "./ContextMenu.module.mjs";
 import { OverlayContentSuspendWatcher } from "../../lib/controller/overlay/OverlayContentSuspendWatcher.mjs";
@@ -51,7 +51,7 @@ var ContextMenu = flowComponent("ContextMenu", (props) => {
 					children: /* @__PURE__ */ jsx(PropsContextProvider, {
 						props: propsContext,
 						children: /* @__PURE__ */ jsx(Action, {
-							closeOverlay: getCloseOverlayType(selectionMode),
+							closeOverlay: closesOnSelect(selectionMode),
 							children
 						})
 					})

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

@@ -1 +1 @@
-{"version":3,"file":"ContextMenu.mjs","names":[],"sources":["../../../../../../../src/components/ContextMenu/ContextMenu.tsx"],"sourcesContent":["import { Action } from \"@/components/Action\";\nimport type { ContextMenuSelectionMode } from \"@/components/ContextMenu/lib\";\nimport {\n  getAriaSelectionMode,\n  getCloseOverlayType,\n  getMenuItemSelectionVariant,\n} from \"@/components/ContextMenu/lib\";\nimport type { MenuItemProps } from \"@/components/MenuItem\";\nimport { Popover, type PopoverProps } from \"@/components/Popover/Popover\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport { useOverlayController } from \"@/lib/controller\";\nimport { OverlayContextProvider } from \"@/lib/controller/overlay/OverlayContextProvider\";\nimport type { PropsContext } from \"@/lib/propsContext\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport ContextMenuContentView from \"@/views/ContextMenuContentView\";\nimport type * as Aria from \"react-aria-components\";\nimport styles from \"./ContextMenu.module.scss\";\nimport { OverlayContentSuspendWatcher } from \"@/lib/controller/overlay/OverlayContentSuspendWatcher\";\n\nexport interface ContextMenuProps\n  extends\n    Omit<PopoverProps, \"withTip\" | \"modality\">,\n    Pick<\n      Aria.MenuProps<MenuItemProps>,\n      | \"onAction\"\n      | \"selectedKeys\"\n      | \"defaultSelectedKeys\"\n      | \"onSelectionChange\"\n      | \"disabledKeys\"\n      | \"renderEmptyState\"\n    >,\n    FlowComponentProps {\n  /** The type of selection that is allowed in the context menu. */\n  selectionMode?: ContextMenuSelectionMode;\n  /** Sets the context menu to a fixed width. */\n  width?: string | number;\n}\n\n/** @flr-generate all */\nexport const ContextMenu = flowComponent(\"ContextMenu\", (props) => {\n  const {\n    children,\n    onAction,\n    selectionMode,\n    selectedKeys,\n    defaultSelectedKeys,\n    disabledKeys,\n    onSelectionChange,\n    renderEmptyState,\n    ref,\n    controller: overlayControllerFromProps,\n    ...rest\n  } = props;\n\n  const overlayControllerFromContext = useOverlayController(\"ContextMenu\", {\n    reuseControllerFromContext: true,\n  });\n\n  const overlayController =\n    overlayControllerFromProps ?? overlayControllerFromContext;\n\n  const selectionVariant = getMenuItemSelectionVariant(selectionMode);\n\n  const propsContext: PropsContext = {\n    MenuItem: {\n      selectionVariant,\n      Avatar: {\n        size: \"l\",\n      },\n    },\n\n    Section: {\n      MenuItem: {\n        Avatar: {\n          size: \"l\",\n        },\n      },\n      renderContextMenuSection: true,\n    },\n\n    ContextMenuSection: {\n      MenuItem: {\n        Avatar: {\n          size: \"l\",\n        },\n      },\n    },\n  };\n\n  return (\n    <OverlayContentSuspendWatcher overlayController={overlayController}>\n      <Popover\n        {...rest}\n        className={styles.popover}\n        controller={overlayController}\n        isDialogContent={false}\n      >\n        <OverlayContextProvider\n          type=\"ContextMenu\"\n          controller={overlayController}\n        >\n          <ContextMenuContentView\n            className={styles.contextMenu}\n            onAction={onAction}\n            selectionMode={getAriaSelectionMode(selectionMode)}\n            selectedKeys={selectedKeys}\n            defaultSelectedKeys={defaultSelectedKeys}\n            disabledKeys={disabledKeys}\n            onSelectionChange={onSelectionChange}\n            renderEmptyState={renderEmptyState}\n            ref={ref}\n          >\n            <PropsContextProvider props={propsContext}>\n              <Action closeOverlay={getCloseOverlayType(selectionMode)}>\n                {children}\n              </Action>\n            </PropsContextProvider>\n          </ContextMenuContentView>\n        </OverlayContextProvider>\n      </Popover>\n    </OverlayContentSuspendWatcher>\n  );\n});\n\nexport default ContextMenu;\n"],"mappings":";;;;;;;;;;;;;;;AAwCA,IAAa,cAAc,cAAc,gBAAgB,UAAU;CACjE,MAAM,EACJ,UACA,UACA,eACA,cACA,qBACA,cACA,mBACA,kBACA,KACA,YAAY,4BACZ,GAAG,SACD;CAEJ,MAAM,+BAA+B,qBAAqB,eAAe,EACvE,4BAA4B,KAC9B,CAAC;CAED,MAAM,oBACJ,8BAA8B;CAIhC,MAAM,eAA6B;EACjC,UAAU;GACR,kBAJqB,4BAA4B,aAIjD;GACA,QAAQ,EACN,MAAM,IACR;EACF;EAEA,SAAS;GACP,UAAU,EACR,QAAQ,EACN,MAAM,IACR,EACF;GACA,0BAA0B;EAC5B;EAEA,oBAAoB,EAClB,UAAU,EACR,QAAQ,EACN,MAAM,IACR,EACF,EACF;CACF;CAEA,OACE,oBAAC,8BAAD;EAAiD;EAC/C,UAAA,oBAAC,SAAD;GACE,GAAI;GACJ,WAAW,2BAAO;GAClB,YAAY;GACZ,iBAAiB;GAEjB,UAAA,oBAAC,wBAAD;IACE,MAAK;IACL,YAAY;IAEZ,UAAA,oBAAC,wBAAD;KACE,WAAW,2BAAO;KACR;KACV,eAAe,qBAAqB,aAAa;KACnC;KACO;KACP;KACK;KACD;KACb;KAEL,UAAA,oBAAC,sBAAD;MAAsB,OAAO;MAC3B,UAAA,oBAAC,QAAD;OAAQ,cAAc,oBAAoB,aAAa;OACpD;MACK,CAAA;KACY,CAAA;IACA,CAAA;GACF,CAAA;EACjB,CAAA;CACmB,CAAA;AAElC,CAAC"}
+{"version":3,"file":"ContextMenu.mjs","names":[],"sources":["../../../../../../../src/components/ContextMenu/ContextMenu.tsx"],"sourcesContent":["import { Action } from \"@/components/Action\";\nimport type { ContextMenuSelectionMode } from \"@/components/ContextMenu/lib\";\nimport {\n  getAriaSelectionMode,\n  closesOnSelect,\n  getMenuItemSelectionVariant,\n} from \"@/components/ContextMenu/lib\";\nimport type { MenuItemProps } from \"@/components/MenuItem\";\nimport { Popover, type PopoverProps } from \"@/components/Popover/Popover\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport { useOverlayController } from \"@/lib/controller\";\nimport { OverlayContextProvider } from \"@/lib/controller/overlay/OverlayContextProvider\";\nimport type { PropsContext } from \"@/lib/propsContext\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport ContextMenuContentView from \"@/views/ContextMenuContentView\";\nimport type * as Aria from \"react-aria-components\";\nimport styles from \"./ContextMenu.module.scss\";\nimport { OverlayContentSuspendWatcher } from \"@/lib/controller/overlay/OverlayContentSuspendWatcher\";\n\nexport interface ContextMenuProps\n  extends\n    Omit<PopoverProps, \"withTip\" | \"modality\">,\n    Pick<\n      Aria.MenuProps<MenuItemProps>,\n      | \"onAction\"\n      | \"selectedKeys\"\n      | \"defaultSelectedKeys\"\n      | \"onSelectionChange\"\n      | \"disabledKeys\"\n      | \"renderEmptyState\"\n    >,\n    FlowComponentProps {\n  /** The type of selection that is allowed in the context menu. */\n  selectionMode?: ContextMenuSelectionMode;\n  /** Sets the context menu to a fixed width. */\n  width?: string | number;\n}\n\n/** @flr-generate all */\nexport const ContextMenu = flowComponent(\"ContextMenu\", (props) => {\n  const {\n    children,\n    onAction,\n    selectionMode,\n    selectedKeys,\n    defaultSelectedKeys,\n    disabledKeys,\n    onSelectionChange,\n    renderEmptyState,\n    ref,\n    controller: overlayControllerFromProps,\n    ...rest\n  } = props;\n\n  const overlayControllerFromContext = useOverlayController(\"ContextMenu\", {\n    reuseControllerFromContext: true,\n  });\n\n  const overlayController =\n    overlayControllerFromProps ?? overlayControllerFromContext;\n\n  const selectionVariant = getMenuItemSelectionVariant(selectionMode);\n\n  const propsContext: PropsContext = {\n    MenuItem: {\n      selectionVariant,\n      Avatar: {\n        size: \"l\",\n      },\n    },\n\n    Section: {\n      MenuItem: {\n        Avatar: {\n          size: \"l\",\n        },\n      },\n      renderContextMenuSection: true,\n    },\n\n    ContextMenuSection: {\n      MenuItem: {\n        Avatar: {\n          size: \"l\",\n        },\n      },\n    },\n  };\n\n  return (\n    <OverlayContentSuspendWatcher overlayController={overlayController}>\n      <Popover\n        {...rest}\n        className={styles.popover}\n        controller={overlayController}\n        isDialogContent={false}\n      >\n        <OverlayContextProvider\n          type=\"ContextMenu\"\n          controller={overlayController}\n        >\n          <ContextMenuContentView\n            className={styles.contextMenu}\n            onAction={onAction}\n            selectionMode={getAriaSelectionMode(selectionMode)}\n            selectedKeys={selectedKeys}\n            defaultSelectedKeys={defaultSelectedKeys}\n            disabledKeys={disabledKeys}\n            onSelectionChange={onSelectionChange}\n            renderEmptyState={renderEmptyState}\n            ref={ref}\n          >\n            <PropsContextProvider props={propsContext}>\n              <Action closeOverlay={closesOnSelect(selectionMode)}>\n                {children}\n              </Action>\n            </PropsContextProvider>\n          </ContextMenuContentView>\n        </OverlayContextProvider>\n      </Popover>\n    </OverlayContentSuspendWatcher>\n  );\n});\n\nexport default ContextMenu;\n"],"mappings":";;;;;;;;;;;;;;;AAwCA,IAAa,cAAc,cAAc,gBAAgB,UAAU;CACjE,MAAM,EACJ,UACA,UACA,eACA,cACA,qBACA,cACA,mBACA,kBACA,KACA,YAAY,4BACZ,GAAG,SACD;CAEJ,MAAM,+BAA+B,qBAAqB,eAAe,EACvE,4BAA4B,KAC9B,CAAC;CAED,MAAM,oBACJ,8BAA8B;CAIhC,MAAM,eAA6B;EACjC,UAAU;GACR,kBAJqB,4BAA4B,aAIjD;GACA,QAAQ,EACN,MAAM,IACR;EACF;EAEA,SAAS;GACP,UAAU,EACR,QAAQ,EACN,MAAM,IACR,EACF;GACA,0BAA0B;EAC5B;EAEA,oBAAoB,EAClB,UAAU,EACR,QAAQ,EACN,MAAM,IACR,EACF,EACF;CACF;CAEA,OACE,oBAAC,8BAAD;EAAiD;EAC/C,UAAA,oBAAC,SAAD;GACE,GAAI;GACJ,WAAW,2BAAO;GAClB,YAAY;GACZ,iBAAiB;GAEjB,UAAA,oBAAC,wBAAD;IACE,MAAK;IACL,YAAY;IAEZ,UAAA,oBAAC,wBAAD;KACE,WAAW,2BAAO;KACR;KACV,eAAe,qBAAqB,aAAa;KACnC;KACO;KACP;KACK;KACD;KACb;KAEL,UAAA,oBAAC,sBAAD;MAAsB,OAAO;MAC3B,UAAA,oBAAC,QAAD;OAAQ,cAAc,eAAe,aAAa;OAC/C;MACK,CAAA;KACY,CAAA;IACA,CAAA;GACF,CAAA;EACjB,CAAA;CACmB,CAAA;AAElC,CAAC"}

package/dist/js/packages/components/src/components/ContextMenu/components/ContextMenuSection/ContextMenuSection.mjs

@@ -3,7 +3,7 @@
 import { PropsContextProvider } from "../../../../lib/propsContext/components/PropsContextProvider.mjs";
 import { flowComponent } from "../../../../lib/componentFactory/flowComponent.mjs";
 import { Action } from "../../../Action/Action.mjs";
-import { getAriaSelectionMode, getCloseOverlayType, getMenuItemSelectionVariant } from "../../lib.mjs";
+import { closesOnSelect, getAriaSelectionMode, getMenuItemSelectionVariant } from "../../lib.mjs";
 import ContextMenu_module_default from "../../ContextMenu.module.mjs";
 import { jsx } from "react/jsx-runtime";
 import * as Aria from "react-aria-components";
@@ -29,7 +29,7 @@ var ContextMenuSection = flowComponent("ContextMenuSection", (props) => {
 			children: /* @__PURE__ */ jsx(Action, {
 				skip: true,
 				children: /* @__PURE__ */ jsx(Action, {
-					closeOverlay: getCloseOverlayType(selectionMode),
+					closeOverlay: closesOnSelect(selectionMode),
 					children
 				})
 			})

package/dist/js/packages/components/src/components/ContextMenu/components/ContextMenuSection/ContextMenuSection.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ContextMenuSection.mjs","names":[],"sources":["../../../../../../../../../src/components/ContextMenu/components/ContextMenuSection/ContextMenuSection.tsx"],"sourcesContent":["import * as Aria from \"react-aria-components\";\nimport type { PropsWithChildren } from \"react\";\nimport type { PropsContext } from \"@/lib/propsContext\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport styles from \"../../ContextMenu.module.scss\";\nimport type { ContextMenuSelectionMode } from \"@/components/ContextMenu/lib\";\nimport {\n  getAriaSelectionMode,\n  getCloseOverlayType,\n  getMenuItemSelectionVariant,\n} from \"@/components/ContextMenu/lib\";\nimport { Action } from \"@/components/Action\";\nimport type { MenuItemProps } from \"@/components/MenuItem\";\n\nexport type ContextMenuSectionProps = PropsWithChildren &\n  FlowComponentProps &\n  Pick<\n    Aria.MenuSectionProps<MenuItemProps>,\n    \"defaultSelectedKeys\" | \"selectedKeys\"\n  > & {\n    selectionMode?: ContextMenuSelectionMode;\n  };\n\n/** @flr-generate all */\nexport const ContextMenuSection = flowComponent(\n  \"ContextMenuSection\",\n  (props) => {\n    const { children, selectionMode, ref, ...rest } = props;\n\n    const selectionVariant = getMenuItemSelectionVariant(selectionMode);\n\n    const propsContext: PropsContext = {\n      Heading: {\n        level: 5,\n        wrapWith: <Aria.Header />,\n      },\n      MenuItem: {\n        selectionVariant,\n      },\n    };\n\n    return (\n      <Aria.MenuSection\n        ref={ref}\n        {...rest}\n        selectionMode={getAriaSelectionMode(selectionMode)}\n        className={styles.section}\n      >\n        <PropsContextProvider props={propsContext}>\n          <Action skip>\n            <Action closeOverlay={getCloseOverlayType(selectionMode)}>\n              {children}\n            </Action>\n          </Action>\n        </PropsContextProvider>\n      </Aria.MenuSection>\n    );\n  },\n  { type: \"layout\" },\n);\n\nexport default ContextMenuSection;\n"],"mappings":";;;;;;;;;;;AA0BA,IAAa,qBAAqB,cAChC,uBACC,UAAU;CACT,MAAM,EAAE,UAAU,eAAe,KAAK,GAAG,SAAS;CAElD,MAAM,mBAAmB,4BAA4B,aAAa;CAElE,MAAM,eAA6B;EACjC,SAAS;GACP,OAAO;GACP,UAAU,oBAAC,KAAK,QAAN,CAAc,CAAA;EAC1B;EACA,UAAU,EACR,iBACF;CACF;CAEA,OACE,oBAAC,KAAK,aAAN;EACO;EACL,GAAI;EACJ,eAAe,qBAAqB,aAAa;EACjD,WAAW,2BAAO;EAElB,UAAA,oBAAC,sBAAD;GAAsB,OAAO;GAC3B,UAAA,oBAAC,QAAD;IAAQ,MAAA;IACN,UAAA,oBAAC,QAAD;KAAQ,cAAc,oBAAoB,aAAa;KACpD;IACK,CAAA;GACF,CAAA;EACY,CAAA;CACN,CAAA;AAEtB,GACA,EAAE,MAAM,SAAS,CACnB"}
+{"version":3,"file":"ContextMenuSection.mjs","names":[],"sources":["../../../../../../../../../src/components/ContextMenu/components/ContextMenuSection/ContextMenuSection.tsx"],"sourcesContent":["import * as Aria from \"react-aria-components\";\nimport type { PropsWithChildren } from \"react\";\nimport type { PropsContext } from \"@/lib/propsContext\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport styles from \"../../ContextMenu.module.scss\";\nimport type { ContextMenuSelectionMode } from \"@/components/ContextMenu/lib\";\nimport {\n  getAriaSelectionMode,\n  closesOnSelect,\n  getMenuItemSelectionVariant,\n} from \"@/components/ContextMenu/lib\";\nimport { Action } from \"@/components/Action\";\nimport type { MenuItemProps } from \"@/components/MenuItem\";\n\nexport type ContextMenuSectionProps = PropsWithChildren &\n  FlowComponentProps &\n  Pick<\n    Aria.MenuSectionProps<MenuItemProps>,\n    \"defaultSelectedKeys\" | \"selectedKeys\"\n  > & {\n    selectionMode?: ContextMenuSelectionMode;\n  };\n\n/** @flr-generate all */\nexport const ContextMenuSection = flowComponent(\n  \"ContextMenuSection\",\n  (props) => {\n    const { children, selectionMode, ref, ...rest } = props;\n\n    const selectionVariant = getMenuItemSelectionVariant(selectionMode);\n\n    const propsContext: PropsContext = {\n      Heading: {\n        level: 5,\n        wrapWith: <Aria.Header />,\n      },\n      MenuItem: {\n        selectionVariant,\n      },\n    };\n\n    return (\n      <Aria.MenuSection\n        ref={ref}\n        {...rest}\n        selectionMode={getAriaSelectionMode(selectionMode)}\n        className={styles.section}\n      >\n        <PropsContextProvider props={propsContext}>\n          <Action skip>\n            <Action closeOverlay={closesOnSelect(selectionMode)}>\n              {children}\n            </Action>\n          </Action>\n        </PropsContextProvider>\n      </Aria.MenuSection>\n    );\n  },\n  { type: \"layout\" },\n);\n\nexport default ContextMenuSection;\n"],"mappings":";;;;;;;;;;;AA0BA,IAAa,qBAAqB,cAChC,uBACC,UAAU;CACT,MAAM,EAAE,UAAU,eAAe,KAAK,GAAG,SAAS;CAElD,MAAM,mBAAmB,4BAA4B,aAAa;CAElE,MAAM,eAA6B;EACjC,SAAS;GACP,OAAO;GACP,UAAU,oBAAC,KAAK,QAAN,CAAc,CAAA;EAC1B;EACA,UAAU,EACR,iBACF;CACF;CAEA,OACE,oBAAC,KAAK,aAAN;EACO;EACL,GAAI;EACJ,eAAe,qBAAqB,aAAa;EACjD,WAAW,2BAAO;EAElB,UAAA,oBAAC,sBAAD;GAAsB,OAAO;GAC3B,UAAA,oBAAC,QAAD;IAAQ,MAAA;IACN,UAAA,oBAAC,QAAD;KAAQ,cAAc,eAAe,aAAa;KAC/C;IACK,CAAA;GACF,CAAA;EACY,CAAA;CACN,CAAA;AAEtB,GACA,EAAE,MAAM,SAAS,CACnB"}

package/dist/js/packages/components/src/components/ContextMenu/lib.mjs

@@ -7,10 +7,14 @@ var getAriaSelectionMode = (selectionMode) => {
 var getMenuItemSelectionVariant = (selectionMode) => {
 	return selectionMode === "single" || selectionMode === "multiple" ? "control" : selectionMode;
 };
-var getCloseOverlayType = (selectionMode) => {
-	return selectionMode === "multiple" || selectionMode === "switch" ? void 0 : "ContextMenu";
+/**
+* Whether selecting an item closes the menu. A mode that collects several
+* selections keeps it open.
+*/
+var closesOnSelect = (selectionMode) => {
+	return selectionMode !== "multiple" && selectionMode !== "switch";
 };
 //#endregion
-export { getAriaSelectionMode, getCloseOverlayType, getMenuItemSelectionVariant };
+export { closesOnSelect, getAriaSelectionMode, getMenuItemSelectionVariant };
 
 //# sourceMappingURL=lib.mjs.map

package/dist/js/packages/components/src/components/ContextMenu/lib.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"lib.mjs","names":[],"sources":["../../../../../../../src/components/ContextMenu/lib.ts"],"sourcesContent":["export type ContextMenuSelectionMode =\n  \"single\" | \"multiple\" | \"navigation\" | \"switch\";\n\nexport const getAriaSelectionMode = (\n  selectionMode?: ContextMenuSelectionMode,\n) => {\n  return selectionMode === \"navigation\"\n    ? \"none\"\n    : selectionMode === \"switch\"\n      ? \"multiple\"\n      : selectionMode;\n};\n\nexport const getMenuItemSelectionVariant = (\n  selectionMode?: ContextMenuSelectionMode,\n) => {\n  return selectionMode === \"single\" || selectionMode === \"multiple\"\n    ? \"control\"\n    : selectionMode;\n};\n\nexport const getCloseOverlayType = (\n  selectionMode?: ContextMenuSelectionMode,\n) => {\n  return selectionMode === \"multiple\" || selectionMode === \"switch\"\n    ? undefined\n    : \"ContextMenu\";\n};\n"],"mappings":";;;AAGA,IAAa,wBACX,kBACG;CACH,OAAO,kBAAkB,eACrB,SACA,kBAAkB,WAChB,aACA;AACR;AAEA,IAAa,+BACX,kBACG;CACH,OAAO,kBAAkB,YAAY,kBAAkB,aACnD,YACA;AACN;AAEA,IAAa,uBACX,kBACG;CACH,OAAO,kBAAkB,cAAc,kBAAkB,WACrD,KAAA,IACA;AACN"}
+{"version":3,"file":"lib.mjs","names":[],"sources":["../../../../../../../src/components/ContextMenu/lib.ts"],"sourcesContent":["export type ContextMenuSelectionMode =\n  \"single\" | \"multiple\" | \"navigation\" | \"switch\";\n\nexport const getAriaSelectionMode = (\n  selectionMode?: ContextMenuSelectionMode,\n) => {\n  return selectionMode === \"navigation\"\n    ? \"none\"\n    : selectionMode === \"switch\"\n      ? \"multiple\"\n      : selectionMode;\n};\n\nexport const getMenuItemSelectionVariant = (\n  selectionMode?: ContextMenuSelectionMode,\n) => {\n  return selectionMode === \"single\" || selectionMode === \"multiple\"\n    ? \"control\"\n    : selectionMode;\n};\n\n/**\n * Whether selecting an item closes the menu. A mode that collects several\n * selections keeps it open.\n */\nexport const closesOnSelect = (selectionMode?: ContextMenuSelectionMode) => {\n  return selectionMode !== \"multiple\" && selectionMode !== \"switch\";\n};\n"],"mappings":";;;AAGA,IAAa,wBACX,kBACG;CACH,OAAO,kBAAkB,eACrB,SACA,kBAAkB,WAChB,aACA;AACR;AAEA,IAAa,+BACX,kBACG;CACH,OAAO,kBAAkB,YAAY,kBAAkB,aACnD,YACA;AACN;;;;;AAMA,IAAa,kBAAkB,kBAA6C;CAC1E,OAAO,kBAAkB,cAAc,kBAAkB;AAC3D"}

package/dist/js/packages/components/src/components/CopyButton/CopyButton.mjs

@@ -14,10 +14,11 @@ import { onlyText } from "react-children-utilities";
 //#region src/components/CopyButton/CopyButton.tsx
 /** @flr-generate all */
 var CopyButton = flowComponent("CopyButton", (props) => {
-	const { text = "", ref, variant = "plain", color = "secondary", ...buttonProps } = props;
+	const { text = "", ref, variant = "plain", color = "secondary", onCopy, ...buttonProps } = props;
 	const tooltip = useLocalizedStringFormatter(__locale_default, "CopyButton").format("copy");
-	const copyValue = () => {
-		copy(onlyText(text));
+	const copyValue = async () => {
+		const copiedText = onlyText(text);
+		if (await copy(copiedText)) onCopy?.(copiedText);
 	};
 	return /* @__PURE__ */ jsxs(TooltipTrigger, { children: [/* @__PURE__ */ jsx(Action, {
 		onAction: copyValue,

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

@@ -1 +1 @@
-{"version":3,"file":"CopyButton.mjs","names":[],"sources":["../../../../../../../src/components/CopyButton/CopyButton.tsx"],"sourcesContent":["import copy from \"copy-to-clipboard\";\nimport type { ButtonProps } from \"@/components/Button\";\nimport { Button } from \"@/components/Button\";\nimport { IconCopy } from \"@/components/Icon/components/icons\";\nimport locales from \"./locales/*.locale.json\";\nimport { useLocalizedStringFormatter } from \"@/components/TranslationProvider/useLocalizedStringFormatter\";\nimport { Tooltip, TooltipTrigger } from \"@/components/Tooltip\";\nimport { onlyText } from \"react-children-utilities\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport { Action } from \"@/components/Action\";\n\nexport interface CopyButtonProps\n  extends\n    Omit<ButtonProps, \"onPress\" | \"aria-label\" | \"render\">,\n    FlowComponentProps<HTMLButtonElement> {\n  /** The text to copy. */\n  text?: string;\n}\n\n/** @flr-generate all */\nexport const CopyButton = flowComponent(\"CopyButton\", (props) => {\n  const {\n    text = \"\",\n    ref,\n    variant = \"plain\",\n    color = \"secondary\",\n    ...buttonProps\n  } = props;\n\n  const stringFormatter = useLocalizedStringFormatter(locales, \"CopyButton\");\n\n  const tooltip = stringFormatter.format(\"copy\");\n\n  const copyValue = () => {\n    copy(onlyText(text));\n  };\n\n  return (\n    <TooltipTrigger>\n      <Action onAction={copyValue} showFeedback>\n        <Button\n          aria-label={tooltip}\n          {...buttonProps}\n          ref={ref}\n          variant={variant}\n          color={color}\n        >\n          <IconCopy />\n        </Button>\n      </Action>\n      <Tooltip>{tooltip}</Tooltip>\n    </TooltipTrigger>\n  );\n});\n\nexport default CopyButton;\n"],"mappings":";;;;;;;;;;;;;;;AAqBA,IAAa,aAAa,cAAc,eAAe,UAAU;CAC/D,MAAM,EACJ,OAAO,IACP,KACA,UAAU,SACV,QAAQ,aACR,GAAG,gBACD;CAIJ,MAAM,UAFkB,4BAA4B,kBAAS,YAE7C,CAAA,CAAgB,OAAO,MAAM;CAE7C,MAAM,kBAAkB;EACtB,KAAK,SAAS,IAAI,CAAC;CACrB;CAEA,OACE,qBAAC,gBAAD,EAAA,UAAA,CACE,oBAAC,QAAD;EAAQ,UAAU;EAAW,cAAA;EAC3B,UAAA,oBAAC,QAAD;GACE,cAAY;GACZ,GAAI;GACC;GACI;GACF;GAEP,UAAA,oBAAC,UAAD,CAAW,CAAA;EACL,CAAA;CACF,CAAA,GACR,oBAAC,SAAD,EAAA,UAAU,QAAiB,CAAA,CACb,EAAA,CAAA;AAEpB,CAAC"}
+{"version":3,"file":"CopyButton.mjs","names":[],"sources":["../../../../../../../src/components/CopyButton/CopyButton.tsx"],"sourcesContent":["import copy from \"copy-to-clipboard\";\nimport type { ButtonProps } from \"@/components/Button\";\nimport { Button } from \"@/components/Button\";\nimport { IconCopy } from \"@/components/Icon/components/icons\";\nimport locales from \"./locales/*.locale.json\";\nimport { useLocalizedStringFormatter } from \"@/components/TranslationProvider/useLocalizedStringFormatter\";\nimport { Tooltip, TooltipTrigger } from \"@/components/Tooltip\";\nimport { onlyText } from \"react-children-utilities\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport { Action } from \"@/components/Action\";\n\nexport interface CopyButtonProps\n  extends\n    Omit<ButtonProps, \"onPress\" | \"aria-label\" | \"render\">,\n    FlowComponentProps<HTMLButtonElement> {\n  /** The text to copy. */\n  text?: string;\n  /**\n   * Called with the copied text once it has been written to the clipboard. Not\n   * called when copying fails.\n   */\n  onCopy?: (text: string) => void;\n}\n\n/** @flr-generate all */\nexport const CopyButton = flowComponent(\"CopyButton\", (props) => {\n  const {\n    text = \"\",\n    ref,\n    variant = \"plain\",\n    color = \"secondary\",\n    onCopy,\n    ...buttonProps\n  } = props;\n\n  const stringFormatter = useLocalizedStringFormatter(locales, \"CopyButton\");\n\n  const tooltip = stringFormatter.format(\"copy\");\n\n  const copyValue = async () => {\n    const copiedText = onlyText(text);\n    if (await copy(copiedText)) {\n      onCopy?.(copiedText);\n    }\n  };\n\n  return (\n    <TooltipTrigger>\n      <Action onAction={copyValue} showFeedback>\n        <Button\n          aria-label={tooltip}\n          {...buttonProps}\n          ref={ref}\n          variant={variant}\n          color={color}\n        >\n          <IconCopy />\n        </Button>\n      </Action>\n      <Tooltip>{tooltip}</Tooltip>\n    </TooltipTrigger>\n  );\n});\n\nexport default CopyButton;\n"],"mappings":";;;;;;;;;;;;;;;AA0BA,IAAa,aAAa,cAAc,eAAe,UAAU;CAC/D,MAAM,EACJ,OAAO,IACP,KACA,UAAU,SACV,QAAQ,aACR,QACA,GAAG,gBACD;CAIJ,MAAM,UAFkB,4BAA4B,kBAAS,YAE7C,CAAA,CAAgB,OAAO,MAAM;CAE7C,MAAM,YAAY,YAAY;EAC5B,MAAM,aAAa,SAAS,IAAI;EAChC,IAAI,MAAM,KAAK,UAAU,GACvB,SAAS,UAAU;CAEvB;CAEA,OACE,qBAAC,gBAAD,EAAA,UAAA,CACE,oBAAC,QAAD;EAAQ,UAAU;EAAW,cAAA;EAC3B,UAAA,oBAAC,QAAD;GACE,cAAY;GACZ,GAAI;GACC;GACI;GACF;GAEP,UAAA,oBAAC,UAAD,CAAW,CAAA;EACL,CAAA;CACF,CAAA,GACR,oBAAC,SAAD,EAAA,UAAU,QAAiB,CAAA,CACb,EAAA,CAAA;AAEpB,CAAC"}

package/dist/js/packages/components/src/components/Icon/components/icons/IconAIHosting.mjs

@@ -0,0 +1,19 @@
+"use client"
+/* */
+import { useContextIcon } from "../IconSetProvider.mjs";
+import IconView$1 from "../../../../views/IconView.mjs";
+import "react";
+import { jsx } from "react/jsx-runtime";
+import { IconAIHosting } from "@mittwald/flow-icons";
+//#region src/components/Icon/components/icons/IconAIHosting.tsx
+var IconAIHosting$1 = (props) => {
+	const Icon = useContextIcon("AIHosting") ?? IconAIHosting;
+	return /* @__PURE__ */ jsx(IconView$1, {
+		...props,
+		children: /* @__PURE__ */ jsx(Icon, {})
+	});
+};
+//#endregion
+export { IconAIHosting$1 as IconAIHosting, IconAIHosting$1 as default };
+
+//# sourceMappingURL=IconAIHosting.mjs.map

package/dist/js/packages/components/src/components/Icon/components/icons/IconAIHosting.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"IconAIHosting.mjs","names":[],"sources":["../../../../../../../../../src/components/Icon/components/icons/IconAIHosting.tsx"],"sourcesContent":["/* auto-generated file */\nimport React, { type ComponentProps, type FC } from \"react\";\nimport { IconAIHosting as IconImport } from \"@mittwald/flow-icons\";\nimport { type Icon } from \"@/components/Icon\";\nimport View from \"@/views/IconView\";\nimport { useContextIcon } from \"../IconSetProvider\";\n\nexport const IconAIHosting: FC<\n  Omit<ComponentProps<typeof Icon>, \"children\">\n> = (props) => {\n  const fromContext = useContextIcon(\"AIHosting\");\n  const Icon = fromContext ?? IconImport;\n  return (\n    <View {...props}>\n      <Icon />\n    </View>\n  );\n};\n\nexport default IconAIHosting;\n"],"mappings":";;;;;;;;AAOA,IAAa,mBAER,UAAU;CAEb,MAAM,OADc,eAAe,WACtB,KAAe;CAC5B,OACE,oBAAC,YAAD;EAAM,GAAI;EACR,UAAA,oBAAC,MAAD,CAAO,CAAA;CACH,CAAA;AAEV"}

package/dist/js/packages/components/src/components/Image/Image.mjs

@@ -7,8 +7,8 @@ import { jsx } from "react/jsx-runtime";
 //#region src/components/Image/Image.tsx
 /** @flr-generate all */
 var Image = flowComponent("Image", (props) => {
-	const { className, withBorder, style, aspectRatio, width, height, ref, ...rest } = props;
-	const rootClassName = clsx(Image_module_default.image, withBorder && Image_module_default.border, aspectRatio && Image_module_default.aspectRatio, className);
+	const { className, withBorder, withRoundedCorners = true, style, aspectRatio, width, height, ref, ...rest } = props;
+	const rootClassName = clsx(Image_module_default.image, withBorder && Image_module_default.border, withRoundedCorners && Image_module_default.roundedCorners, aspectRatio && Image_module_default.aspectRatio, className);
 	return /* @__PURE__ */ jsx("img", {
 		ref,
 		className: rootClassName,

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

@@ -1 +1 @@
-{"version":3,"file":"Image.mjs","names":[],"sources":["../../../../../../../src/components/Image/Image.tsx"],"sourcesContent":["import type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport clsx from \"clsx\";\nimport type { ComponentProps } from \"react\";\nimport styles from \"./Image.module.scss\";\n\nexport interface ImageProps\n  extends\n    Omit<ComponentProps<\"img\">, \"ref\">,\n    FlowComponentProps<HTMLImageElement> {\n  /** Display the image with border and rounded edges. */\n  withBorder?: boolean;\n  /**\n   * The aspect ratio of the images container. Larger images will be centered\n   * and their overflow will be hidden.\n   */\n  aspectRatio?: number;\n}\n\n/** @flr-generate all */\nexport const Image = flowComponent(\"Image\", (props) => {\n  const {\n    className,\n    withBorder,\n    style,\n    aspectRatio,\n    width,\n    height,\n    ref,\n    ...rest\n  } = props;\n\n  const rootClassName = clsx(\n    styles.image,\n    withBorder && styles.border,\n    aspectRatio && styles.aspectRatio,\n    className,\n  );\n\n  return (\n    <img\n      ref={ref}\n      className={rootClassName}\n      style={{\n        ...style,\n        ...(aspectRatio !== undefined && { aspectRatio }),\n        ...(width !== undefined && { width }),\n        ...(height !== undefined && { height }),\n      }}\n      {...rest}\n    />\n  );\n});\n\nexport default Image;\n"],"mappings":";;;;;;;;AAoBA,IAAa,QAAQ,cAAc,UAAU,UAAU;CACrD,MAAM,EACJ,WACA,YACA,OACA,aACA,OACA,QACA,KACA,GAAG,SACD;CAEJ,MAAM,gBAAgB,KACpB,qBAAO,OACP,cAAc,qBAAO,QACrB,eAAe,qBAAO,aACtB,SACF;CAEA,OACE,oBAAC,OAAD;EACO;EACL,WAAW;EACX,OAAO;GACL,GAAG;GACH,GAAI,gBAAgB,KAAA,KAAa,EAAE,YAAY;GAC/C,GAAI,UAAU,KAAA,KAAa,EAAE,MAAM;GACnC,GAAI,WAAW,KAAA,KAAa,EAAE,OAAO;EACvC;EACA,GAAI;CACL,CAAA;AAEL,CAAC"}
+{"version":3,"file":"Image.mjs","names":[],"sources":["../../../../../../../src/components/Image/Image.tsx"],"sourcesContent":["import type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport clsx from \"clsx\";\nimport type { ComponentProps } from \"react\";\nimport styles from \"./Image.module.scss\";\n\nexport interface ImageProps\n  extends\n    Omit<ComponentProps<\"img\">, \"ref\">,\n    FlowComponentProps<HTMLImageElement> {\n  /** Display the image with a border. */\n  withBorder?: boolean;\n  /**\n   * Display the image with rounded corners.\n   *\n   * @default true\n   */\n  withRoundedCorners?: boolean;\n  /**\n   * The aspect ratio of the images container. Larger images will be centered\n   * and their overflow will be hidden.\n   */\n  aspectRatio?: number;\n}\n\n/** @flr-generate all */\nexport const Image = flowComponent(\"Image\", (props) => {\n  const {\n    className,\n    withBorder,\n    withRoundedCorners = true,\n    style,\n    aspectRatio,\n    width,\n    height,\n    ref,\n    ...rest\n  } = props;\n\n  const rootClassName = clsx(\n    styles.image,\n    withBorder && styles.border,\n    withRoundedCorners && styles.roundedCorners,\n    aspectRatio && styles.aspectRatio,\n    className,\n  );\n\n  return (\n    <img\n      ref={ref}\n      className={rootClassName}\n      style={{\n        ...style,\n        ...(aspectRatio !== undefined && { aspectRatio }),\n        ...(width !== undefined && { width }),\n        ...(height !== undefined && { height }),\n      }}\n      {...rest}\n    />\n  );\n});\n\nexport default Image;\n"],"mappings":";;;;;;;;AA0BA,IAAa,QAAQ,cAAc,UAAU,UAAU;CACrD,MAAM,EACJ,WACA,YACA,qBAAqB,MACrB,OACA,aACA,OACA,QACA,KACA,GAAG,SACD;CAEJ,MAAM,gBAAgB,KACpB,qBAAO,OACP,cAAc,qBAAO,QACrB,sBAAsB,qBAAO,gBAC7B,eAAe,qBAAO,aACtB,SACF;CAEA,OACE,oBAAC,OAAD;EACO;EACL,WAAW;EACX,OAAO;GACL,GAAG;GACH,GAAI,gBAAgB,KAAA,KAAa,EAAE,YAAY;GAC/C,GAAI,UAAU,KAAA,KAAa,EAAE,MAAM;GACnC,GAAI,WAAW,KAAA,KAAa,EAAE,OAAO;EACvC;EACA,GAAI;CACL,CAAA;AAEL,CAAC"}

package/dist/js/packages/components/src/components/Image/Image.module.mjs

@@ -3,13 +3,15 @@
 //#region src/components/Image/Image.module.scss
 var image = "flow--image";
 var border = "flow--image--border";
+var roundedCorners = "flow--image--rounded-corners";
 var aspectRatio = "flow--image--aspect-ratio";
 var Image_module_default = {
 	image,
 	border,
+	roundedCorners,
 	aspectRatio
 };
 //#endregion
-export { aspectRatio, border, Image_module_default as default, image };
+export { aspectRatio, border, Image_module_default as default, image, roundedCorners };
 
 //# sourceMappingURL=Image.module.mjs.map

package/dist/js/packages/components/src/components/Image/Image.module.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Image.module.mjs","names":[],"sources":["../../../../../../../src/components/Image/Image.module.scss"],"sourcesContent":[".image {\n  max-width: 100%;\n\n  &.border {\n    border-width: var(--image--border-width);\n    border-style: var(--image--border-style);\n    border-radius: var(--image--corner-radius);\n    border-color: var(--image--border-color);\n    overflow: hidden;\n  }\n\n  &:where(.aspectRatio) {\n    overflow-clip-margin: unset;\n    object-fit: cover;\n    width: fit-content;\n    overflow: hidden;\n  }\n}\n"],"mappings":""}
+{"version":3,"file":"Image.module.mjs","names":[],"sources":["../../../../../../../src/components/Image/Image.module.scss"],"sourcesContent":[".image {\n  max-width: 100%;\n\n  &.border {\n    border-width: var(--image--border-width);\n    border-style: var(--image--border-style);\n    border-color: var(--image--border-color);\n  }\n\n  &.roundedCorners {\n    border-radius: var(--image--corner-radius);\n    overflow: hidden;\n  }\n\n  &:where(.aspectRatio) {\n    overflow-clip-margin: unset;\n    object-fit: cover;\n    width: fit-content;\n    overflow: hidden;\n  }\n}\n"],"mappings":""}

package/dist/js/packages/components/src/components/List/components/Header/components/AllFiltersModal/AllFiltersModal.mjs

@@ -4,7 +4,7 @@ import { IconFilter } from "../../../../../Icon/components/icons/IconFilter.mjs"
 import { useLocalizedStringFormatter } from "../../../../../TranslationProvider/useLocalizedStringFormatter.mjs";
 import { useOverlayController } from "../../../../../../lib/controller/overlay/useOverlayController.mjs";
 import ButtonView from "../../../../../../views/ButtonView.mjs";
-import SkeletonTextView from "../../../../../../views/SkeletonTextView.mjs";
+import { SkeletonText } from "../../../../../SkeletonText/SkeletonText.mjs";
 import __locale_default from "../../../../../../../../../_virtual/_16.locale.mjs";
 import HeadingView from "../../../../../../views/HeadingView.mjs";
 import TextView from "../../../../../../views/TextView.mjs";
@@ -67,7 +67,7 @@ var AllFiltersModal = (props) => {
 					/* @__PURE__ */ jsx(ContentView, { children: /* @__PURE__ */ jsx(SectionView, { children: [...accordions] }) }),
 					/* @__PURE__ */ jsxs(ActionGroupView, { children: [/* @__PURE__ */ jsx(ButtonView, {
 						onPress: () => controller.close(),
-						children: /* @__PURE__ */ jsx(TextView, { children: isInitiallyLoading ? /* @__PURE__ */ jsx(SkeletonTextView, { width: "16ch" }) : stringFormatter.format("results.show", { totalItemCount }) })
+						children: /* @__PURE__ */ jsx(TextView, { children: isInitiallyLoading ? /* @__PURE__ */ jsx(SkeletonText, { width: "16ch" }) : stringFormatter.format("results.show", { totalItemCount }) })
 					}), /* @__PURE__ */ jsx(ButtonView, {
 						color: "secondary",
 						variant: "soft",

package/dist/js/packages/components/src/components/List/components/Header/components/AllFiltersModal/AllFiltersModal.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"AllFiltersModal.mjs","names":[],"sources":["../../../../../../../../../../../src/components/List/components/Header/components/AllFiltersModal/AllFiltersModal.tsx"],"sourcesContent":["import type { FC } from \"react\";\nimport { IconFilter } from \"@/components/Icon/components/icons\";\nimport ButtonView from \"@/views/ButtonView\";\nimport { useList } from \"@/components/List\";\nimport styles from \"@/components/List/components/Header/Header.module.scss\";\nimport { useLocalizedStringFormatter } from \"@/components/TranslationProvider/useLocalizedStringFormatter\";\nimport locales from \"../../../../locales/*.locale.json\";\nimport ContentView from \"@/views/ContentView\";\nimport SectionView from \"@/views/SectionView\";\nimport { FilterAccordion } from \"@/components/List/components/Header/components/AllFiltersModal/FilterAccordion\";\nimport { ViewModeAccordion } from \"@/components/List/components/Header/components/AllFiltersModal/ViewModeAccordion\";\nimport TextView from \"@/views/TextView\";\nimport { SortingAccordion } from \"@/components/List/components/Header/components/AllFiltersModal/SortingAccordion\";\nimport ActionGroupView from \"@/views/ActionGroupView\";\nimport { useOverlayController } from \"@/lib/controller\";\nimport HeadingView from \"@/views/HeadingView\";\nimport clsx from \"clsx\";\nimport Modal, { ModalTrigger } from \"@/components/Modal\";\nimport SkeletonTextView from \"@/views/SkeletonTextView\";\nimport { useAvailableViewModes } from \"../../lib\";\n\ninterface Props {\n  isDisabled?: boolean;\n}\n\nexport const AllFiltersModal: FC<Props> = (props) => {\n  const { isDisabled } = props;\n  const list = useList();\n  const stringFormatter = useLocalizedStringFormatter(locales, \"List\");\n\n  const isInitiallyLoading = list.loader.useIsInitiallyLoading();\n  const totalItemCount =\n    list.batches.getTotalItemsCount() ?? list.items.entries.length;\n\n  const availableViewModes = useAvailableViewModes();\n\n  const accordionCount =\n    (availableViewModes.length > 1 ? 1 : 0) +\n    (list.sorting.length > 0 ? 1 : 0) +\n    list.filters.length;\n\n  const expandAccordions = accordionCount <= 2;\n\n  const filterAccordions = list.filters.map((f) => (\n    <FilterAccordion\n      filter={f}\n      key={f.name}\n      expandAccordions={expandAccordions}\n    />\n  ));\n\n  const accordions = [\n    availableViewModes.length > 1 && (\n      <ViewModeAccordion key=\"viewMode\" expandAccordions={expandAccordions} />\n    ),\n    list.sorting.length > 0 && (\n      <SortingAccordion key=\"sorting\" expandAccordions={expandAccordions} />\n    ),\n    ...filterAccordions,\n  ].filter(Boolean);\n\n  const hasSecondaryFilters = list.filters.some(\n    (f) => f.priority === \"secondary\",\n  );\n\n  const controller = useOverlayController(\"Modal\", {\n    reuseControllerFromContext: false,\n  });\n\n  if (accordions.length === 0) {\n    return null;\n  }\n\n  return (\n    <ModalTrigger controller={controller}>\n      <ButtonView\n        className={clsx(\n          styles.hideOnMobile,\n          hasSecondaryFilters ? undefined : styles.hideOnDesktop,\n        )}\n        variant=\"outline\"\n        color=\"secondary\"\n        isDisabled={isDisabled}\n      >\n        <TextView>{stringFormatter.format(\"filters.all\")}</TextView>\n        <IconFilter />\n      </ButtonView>\n\n      <ButtonView\n        className={styles.hideOnDesktop}\n        variant=\"outline\"\n        color=\"secondary\"\n        aria-label={stringFormatter.format(\"filters.all\")}\n      >\n        <IconFilter />\n      </ButtonView>\n\n      <Modal offCanvas controller={controller}>\n        <HeadingView>{stringFormatter.format(\"filters.all\")}</HeadingView>\n        <ContentView>\n          <SectionView>{...accordions}</SectionView>\n        </ContentView>\n\n        <ActionGroupView>\n          <ButtonView onPress={() => controller.close()}>\n            <TextView>\n              {isInitiallyLoading ? (\n                <SkeletonTextView width=\"16ch\" />\n              ) : (\n                stringFormatter.format(\"results.show\", {\n                  totalItemCount,\n                })\n              )}\n            </TextView>\n          </ButtonView>\n          <ButtonView\n            color=\"secondary\"\n            variant=\"soft\"\n            onPress={() => {\n              list.resetFilters();\n              controller.close();\n            }}\n          >\n            {stringFormatter.format(\"reset\")}\n          </ButtonView>\n        </ActionGroupView>\n      </Modal>\n    </ModalTrigger>\n  );\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAyBA,IAAa,mBAA8B,UAAU;CACnD,MAAM,EAAE,eAAe;CACvB,MAAM,OAAO,QAAQ;CACrB,MAAM,kBAAkB,4BAA4B,kBAAS,MAAM;CAEnE,MAAM,qBAAqB,KAAK,OAAO,sBAAsB;CAC7D,MAAM,iBACJ,KAAK,QAAQ,mBAAmB,KAAK,KAAK,MAAM,QAAQ;CAE1D,MAAM,qBAAqB,sBAAsB;CAOjD,MAAM,oBAJH,mBAAmB,SAAS,IAAI,IAAI,MACpC,KAAK,QAAQ,SAAS,IAAI,IAAI,KAC/B,KAAK,QAAQ,UAE4B;CAE3C,MAAM,mBAAmB,KAAK,QAAQ,KAAK,MACzC,oBAAC,iBAAD;EACE,QAAQ;EAEU;CACnB,GAFM,EAAE,IAER,CACF;CAED,MAAM,aAAa;EACjB,mBAAmB,SAAS,KAC1B,oBAAC,mBAAD,EAAoD,iBAAmB,GAAhD,UAAgD;EAEzE,KAAK,QAAQ,SAAS,KACpB,oBAAC,kBAAD,EAAkD,iBAAmB,GAA/C,SAA+C;EAEvE,GAAG;CACL,CAAC,CAAC,OAAO,OAAO;CAEhB,MAAM,sBAAsB,KAAK,QAAQ,MACtC,MAAM,EAAE,aAAa,WACxB;CAEA,MAAM,aAAa,qBAAqB,SAAS,EAC/C,4BAA4B,MAC9B,CAAC;CAED,IAAI,WAAW,WAAW,GACxB,OAAO;CAGT,OACE,qBAAC,cAAD;EAA0B;EAA1B,UAAA;GACE,qBAAC,YAAD;IACE,WAAW,KACT,sBAAO,cACP,sBAAsB,KAAA,IAAY,sBAAO,aAC3C;IACA,SAAQ;IACR,OAAM;IACM;IAPd,UAAA,CASE,oBAAC,UAAD,EAAA,UAAW,gBAAgB,OAAO,aAAa,EAAY,CAAA,GAC3D,oBAAC,YAAD,CAAa,CAAA,CACH;;GAEZ,oBAAC,YAAD;IACE,WAAW,sBAAO;IAClB,SAAQ;IACR,OAAM;IACN,cAAY,gBAAgB,OAAO,aAAa;IAEhD,UAAA,oBAAC,YAAD,CAAa,CAAA;GACH,CAAA;GAEZ,qBAAC,OAAD;IAAO,WAAA;IAAsB;IAA7B,UAAA;KACE,oBAAC,aAAD,EAAA,UAAc,gBAAgB,OAAO,aAAa,EAAe,CAAA;KACjE,oBAAC,aAAD,EAAA,UACE,oBAAC,aAAD,EAAA,UAAA,CAAa,GAAI,UAAwB,EAAA,CAAA,EAC9B,CAAA;KAEb,qBAAC,iBAAD,EAAA,UAAA,CACE,oBAAC,YAAD;MAAY,eAAe,WAAW,MAAM;MAC1C,UAAA,oBAAC,UAAD,EAAA,UACG,qBACC,oBAAC,kBAAD,EAAkB,OAAM,OAAQ,CAAA,IAEhC,gBAAgB,OAAO,gBAAgB,EACrC,eACF,CAAC,EAEK,CAAA;KACA,CAAA,GACZ,oBAAC,YAAD;MACE,OAAM;MACN,SAAQ;MACR,eAAe;OACb,KAAK,aAAa;OAClB,WAAW,MAAM;MACnB;MAEC,UAAA,gBAAgB,OAAO,OAAO;KACrB,CAAA,CACG,EAAA,CAAA;IACZ;;EACK;;AAElB"}
+{"version":3,"file":"AllFiltersModal.mjs","names":[],"sources":["../../../../../../../../../../../src/components/List/components/Header/components/AllFiltersModal/AllFiltersModal.tsx"],"sourcesContent":["import type { FC } from \"react\";\nimport { IconFilter } from \"@/components/Icon/components/icons\";\nimport ButtonView from \"@/views/ButtonView\";\nimport { useList } from \"@/components/List\";\nimport styles from \"@/components/List/components/Header/Header.module.scss\";\nimport { useLocalizedStringFormatter } from \"@/components/TranslationProvider/useLocalizedStringFormatter\";\nimport locales from \"../../../../locales/*.locale.json\";\nimport ContentView from \"@/views/ContentView\";\nimport SectionView from \"@/views/SectionView\";\nimport { FilterAccordion } from \"@/components/List/components/Header/components/AllFiltersModal/FilterAccordion\";\nimport { ViewModeAccordion } from \"@/components/List/components/Header/components/AllFiltersModal/ViewModeAccordion\";\nimport TextView from \"@/views/TextView\";\nimport { SortingAccordion } from \"@/components/List/components/Header/components/AllFiltersModal/SortingAccordion\";\nimport ActionGroupView from \"@/views/ActionGroupView\";\nimport { useOverlayController } from \"@/lib/controller\";\nimport HeadingView from \"@/views/HeadingView\";\nimport clsx from \"clsx\";\nimport Modal, { ModalTrigger } from \"@/components/Modal\";\nimport { SkeletonText } from \"@/components/SkeletonText\";\nimport { useAvailableViewModes } from \"../../lib\";\n\ninterface Props {\n  isDisabled?: boolean;\n}\n\nexport const AllFiltersModal: FC<Props> = (props) => {\n  const { isDisabled } = props;\n  const list = useList();\n  const stringFormatter = useLocalizedStringFormatter(locales, \"List\");\n\n  const isInitiallyLoading = list.loader.useIsInitiallyLoading();\n  const totalItemCount =\n    list.batches.getTotalItemsCount() ?? list.items.entries.length;\n\n  const availableViewModes = useAvailableViewModes();\n\n  const accordionCount =\n    (availableViewModes.length > 1 ? 1 : 0) +\n    (list.sorting.length > 0 ? 1 : 0) +\n    list.filters.length;\n\n  const expandAccordions = accordionCount <= 2;\n\n  const filterAccordions = list.filters.map((f) => (\n    <FilterAccordion\n      filter={f}\n      key={f.name}\n      expandAccordions={expandAccordions}\n    />\n  ));\n\n  const accordions = [\n    availableViewModes.length > 1 && (\n      <ViewModeAccordion key=\"viewMode\" expandAccordions={expandAccordions} />\n    ),\n    list.sorting.length > 0 && (\n      <SortingAccordion key=\"sorting\" expandAccordions={expandAccordions} />\n    ),\n    ...filterAccordions,\n  ].filter(Boolean);\n\n  const hasSecondaryFilters = list.filters.some(\n    (f) => f.priority === \"secondary\",\n  );\n\n  const controller = useOverlayController(\"Modal\", {\n    reuseControllerFromContext: false,\n  });\n\n  if (accordions.length === 0) {\n    return null;\n  }\n\n  return (\n    <ModalTrigger controller={controller}>\n      <ButtonView\n        className={clsx(\n          styles.hideOnMobile,\n          hasSecondaryFilters ? undefined : styles.hideOnDesktop,\n        )}\n        variant=\"outline\"\n        color=\"secondary\"\n        isDisabled={isDisabled}\n      >\n        <TextView>{stringFormatter.format(\"filters.all\")}</TextView>\n        <IconFilter />\n      </ButtonView>\n\n      <ButtonView\n        className={styles.hideOnDesktop}\n        variant=\"outline\"\n        color=\"secondary\"\n        aria-label={stringFormatter.format(\"filters.all\")}\n      >\n        <IconFilter />\n      </ButtonView>\n\n      <Modal offCanvas controller={controller}>\n        <HeadingView>{stringFormatter.format(\"filters.all\")}</HeadingView>\n        <ContentView>\n          <SectionView>{...accordions}</SectionView>\n        </ContentView>\n\n        <ActionGroupView>\n          <ButtonView onPress={() => controller.close()}>\n            <TextView>\n              {isInitiallyLoading ? (\n                <SkeletonText width=\"16ch\" />\n              ) : (\n                stringFormatter.format(\"results.show\", {\n                  totalItemCount,\n                })\n              )}\n            </TextView>\n          </ButtonView>\n          <ButtonView\n            color=\"secondary\"\n            variant=\"soft\"\n            onPress={() => {\n              list.resetFilters();\n              controller.close();\n            }}\n          >\n            {stringFormatter.format(\"reset\")}\n          </ButtonView>\n        </ActionGroupView>\n      </Modal>\n    </ModalTrigger>\n  );\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAyBA,IAAa,mBAA8B,UAAU;CACnD,MAAM,EAAE,eAAe;CACvB,MAAM,OAAO,QAAQ;CACrB,MAAM,kBAAkB,4BAA4B,kBAAS,MAAM;CAEnE,MAAM,qBAAqB,KAAK,OAAO,sBAAsB;CAC7D,MAAM,iBACJ,KAAK,QAAQ,mBAAmB,KAAK,KAAK,MAAM,QAAQ;CAE1D,MAAM,qBAAqB,sBAAsB;CAOjD,MAAM,oBAJH,mBAAmB,SAAS,IAAI,IAAI,MACpC,KAAK,QAAQ,SAAS,IAAI,IAAI,KAC/B,KAAK,QAAQ,UAE4B;CAE3C,MAAM,mBAAmB,KAAK,QAAQ,KAAK,MACzC,oBAAC,iBAAD;EACE,QAAQ;EAEU;CACnB,GAFM,EAAE,IAER,CACF;CAED,MAAM,aAAa;EACjB,mBAAmB,SAAS,KAC1B,oBAAC,mBAAD,EAAoD,iBAAmB,GAAhD,UAAgD;EAEzE,KAAK,QAAQ,SAAS,KACpB,oBAAC,kBAAD,EAAkD,iBAAmB,GAA/C,SAA+C;EAEvE,GAAG;CACL,CAAC,CAAC,OAAO,OAAO;CAEhB,MAAM,sBAAsB,KAAK,QAAQ,MACtC,MAAM,EAAE,aAAa,WACxB;CAEA,MAAM,aAAa,qBAAqB,SAAS,EAC/C,4BAA4B,MAC9B,CAAC;CAED,IAAI,WAAW,WAAW,GACxB,OAAO;CAGT,OACE,qBAAC,cAAD;EAA0B;EAA1B,UAAA;GACE,qBAAC,YAAD;IACE,WAAW,KACT,sBAAO,cACP,sBAAsB,KAAA,IAAY,sBAAO,aAC3C;IACA,SAAQ;IACR,OAAM;IACM;IAPd,UAAA,CASE,oBAAC,UAAD,EAAA,UAAW,gBAAgB,OAAO,aAAa,EAAY,CAAA,GAC3D,oBAAC,YAAD,CAAa,CAAA,CACH;;GAEZ,oBAAC,YAAD;IACE,WAAW,sBAAO;IAClB,SAAQ;IACR,OAAM;IACN,cAAY,gBAAgB,OAAO,aAAa;IAEhD,UAAA,oBAAC,YAAD,CAAa,CAAA;GACH,CAAA;GAEZ,qBAAC,OAAD;IAAO,WAAA;IAAsB;IAA7B,UAAA;KACE,oBAAC,aAAD,EAAA,UAAc,gBAAgB,OAAO,aAAa,EAAe,CAAA;KACjE,oBAAC,aAAD,EAAA,UACE,oBAAC,aAAD,EAAA,UAAA,CAAa,GAAI,UAAwB,EAAA,CAAA,EAC9B,CAAA;KAEb,qBAAC,iBAAD,EAAA,UAAA,CACE,oBAAC,YAAD;MAAY,eAAe,WAAW,MAAM;MAC1C,UAAA,oBAAC,UAAD,EAAA,UACG,qBACC,oBAAC,cAAD,EAAc,OAAM,OAAQ,CAAA,IAE5B,gBAAgB,OAAO,gBAAgB,EACrC,eACF,CAAC,EAEK,CAAA;KACA,CAAA,GACZ,oBAAC,YAAD;MACE,OAAM;MACN,SAAQ;MACR,eAAe;OACb,KAAK,aAAa;OAClB,WAAW,MAAM;MACnB;MAEC,UAAA,gBAAgB,OAAO,OAAO;KACrB,CAAA,CACG,EAAA,CAAA;IACZ;;EACK;;AAElB"}

package/dist/js/packages/components/src/components/List/components/Header/components/AllFiltersModal/FilterAccordionDateRange.mjs

@@ -2,9 +2,9 @@
 /* */
 import { useLocalizedStringFormatter } from "../../../../../TranslationProvider/useLocalizedStringFormatter.mjs";
 import ButtonView from "../../../../../../views/ButtonView.mjs";
+import { Flex } from "../../../../../Flex/Flex.mjs";
 import __locale_default from "../../../../../../../../../_virtual/_16.locale.mjs";
 import RangeCalendarView from "../../../../../../views/RangeCalendarView.mjs";
-import FlexView from "../../../../../../views/FlexView.mjs";
 import "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/List/components/Header/components/AllFiltersModal/FilterAccordionDateRange.tsx
@@ -12,7 +12,7 @@ var FilterAccordionDateRange = (props) => {
 	const { filter } = props;
 	const currentValue = filter.getValue();
 	const stringFormatter = useLocalizedStringFormatter(__locale_default, "List");
-	return /* @__PURE__ */ jsxs(FlexView, {
+	return /* @__PURE__ */ jsxs(Flex, {
 		direction: "column",
 		gap: "m",
 		children: [/* @__PURE__ */ jsx(RangeCalendarView, {

package/dist/js/packages/components/src/components/List/components/Header/components/AllFiltersModal/FilterAccordionDateRange.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"FilterAccordionDateRange.mjs","names":[],"sources":["../../../../../../../../../../../src/components/List/components/Header/components/AllFiltersModal/FilterAccordionDateRange.tsx"],"sourcesContent":["import { type FC } from \"react\";\nimport ButtonView from \"@/views/ButtonView\";\nimport FlexView from \"@/views/FlexView\";\nimport { useLocalizedStringFormatter } from \"@/components/TranslationProvider/useLocalizedStringFormatter\";\nimport locales from \"../../../../locales/*.locale.json\";\nimport RangeCalendarView from \"@/views/RangeCalendarView\";\nimport type { AnyDateRangeFilter } from \"@/components/List/model/filter/types\";\n\ninterface Props {\n  filter: AnyDateRangeFilter;\n}\n\nexport const FilterAccordionDateRange: FC<Props> = (props) => {\n  const { filter } = props;\n\n  const currentValue = filter.getValue();\n\n  const stringFormatter = useLocalizedStringFormatter(locales, \"List\");\n\n  return (\n    <FlexView direction=\"column\" gap=\"m\">\n      <RangeCalendarView\n        {...filter.dateRangeOptions}\n        value={currentValue}\n        onChange={(range) => {\n          filter.setValue(range);\n        }}\n      />\n      {currentValue && (\n        <ButtonView\n          size=\"s\"\n          color=\"secondary\"\n          variant=\"soft\"\n          onPress={() => filter.clear()}\n        >\n          {stringFormatter.format(\"filters.clearSelection\")}\n        </ButtonView>\n      )}\n    </FlexView>\n  );\n};\n"],"mappings":";;;;;;;;;;AAYA,IAAa,4BAAuC,UAAU;CAC5D,MAAM,EAAE,WAAW;CAEnB,MAAM,eAAe,OAAO,SAAS;CAErC,MAAM,kBAAkB,4BAA4B,kBAAS,MAAM;CAEnE,OACE,qBAAC,UAAD;EAAU,WAAU;EAAS,KAAI;EAAjC,UAAA,CACE,oBAAC,mBAAD;GACE,GAAI,OAAO;GACX,OAAO;GACP,WAAW,UAAU;IACnB,OAAO,SAAS,KAAK;GACvB;EACD,CAAA,GACA,gBACC,oBAAC,YAAD;GACE,MAAK;GACL,OAAM;GACN,SAAQ;GACR,eAAe,OAAO,MAAM;GAE3B,UAAA,gBAAgB,OAAO,wBAAwB;EACtC,CAAA,CAEN;;AAEd"}
+{"version":3,"file":"FilterAccordionDateRange.mjs","names":[],"sources":["../../../../../../../../../../../src/components/List/components/Header/components/AllFiltersModal/FilterAccordionDateRange.tsx"],"sourcesContent":["import { type FC } from \"react\";\nimport ButtonView from \"@/views/ButtonView\";\nimport { Flex } from \"@/components/Flex\";\nimport { useLocalizedStringFormatter } from \"@/components/TranslationProvider/useLocalizedStringFormatter\";\nimport locales from \"../../../../locales/*.locale.json\";\nimport RangeCalendarView from \"@/views/RangeCalendarView\";\nimport type { AnyDateRangeFilter } from \"@/components/List/model/filter/types\";\n\ninterface Props {\n  filter: AnyDateRangeFilter;\n}\n\nexport const FilterAccordionDateRange: FC<Props> = (props) => {\n  const { filter } = props;\n\n  const currentValue = filter.getValue();\n\n  const stringFormatter = useLocalizedStringFormatter(locales, \"List\");\n\n  return (\n    <Flex direction=\"column\" gap=\"m\">\n      <RangeCalendarView\n        {...filter.dateRangeOptions}\n        value={currentValue}\n        onChange={(range) => {\n          filter.setValue(range);\n        }}\n      />\n      {currentValue && (\n        <ButtonView\n          size=\"s\"\n          color=\"secondary\"\n          variant=\"soft\"\n          onPress={() => filter.clear()}\n        >\n          {stringFormatter.format(\"filters.clearSelection\")}\n        </ButtonView>\n      )}\n    </Flex>\n  );\n};\n"],"mappings":";;;;;;;;;;AAYA,IAAa,4BAAuC,UAAU;CAC5D,MAAM,EAAE,WAAW;CAEnB,MAAM,eAAe,OAAO,SAAS;CAErC,MAAM,kBAAkB,4BAA4B,kBAAS,MAAM;CAEnE,OACE,qBAAC,MAAD;EAAM,WAAU;EAAS,KAAI;EAA7B,UAAA,CACE,oBAAC,mBAAD;GACE,GAAI,OAAO;GACX,OAAO;GACP,WAAW,UAAU;IACnB,OAAO,SAAS,KAAK;GACvB;EACD,CAAA,GACA,gBACC,oBAAC,YAAD;GACE,MAAK;GACL,OAAM;GACN,SAAQ;GACR,eAAe,OAAO,MAAM;GAE3B,UAAA,gBAAgB,OAAO,wBAAwB;EACtC,CAAA,CAEV;;AAEV"}

package/dist/js/packages/components/src/components/List/components/Header/components/AllFiltersModal/FilterAccordionRadioGroup.mjs

@@ -2,10 +2,10 @@
 /* */
 import { useLocalizedStringFormatter } from "../../../../../TranslationProvider/useLocalizedStringFormatter.mjs";
 import ButtonView from "../../../../../../views/ButtonView.mjs";
+import { Flex } from "../../../../../Flex/Flex.mjs";
 import __locale_default from "../../../../../../../../../_virtual/_16.locale.mjs";
 import RadioGroupView from "../../../../../../views/RadioGroupView.mjs";
 import RadioView from "../../../../../../views/RadioView.mjs";
-import FlexView from "../../../../../../views/FlexView.mjs";
 import "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/List/components/Header/components/AllFiltersModal/FilterAccordionRadioGroup.tsx
@@ -14,7 +14,7 @@ var FilterAccordionRadioGroup = (props) => {
 	const activeKeys = filter.values.filter((v) => v.isActive).map((v) => v.id);
 	const name = filter.name ?? filter.property;
 	const stringFormatter = useLocalizedStringFormatter(__locale_default, "List");
-	return /* @__PURE__ */ jsxs(FlexView, {
+	return /* @__PURE__ */ jsxs(Flex, {
 		direction: "column",
 		gap: "m",
 		children: [/* @__PURE__ */ jsx(RadioGroupView, {