@mittwald/flow-react-components 0.2.0-alpha.804 → 0.2.0-alpha.806

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

@@ -0,0 +1,7 @@
+"use client"
+/* */
+const tunnelProviderPrefix = "@mittwald/flow/tunnel/";
+const getTunnelProviderId = (componentName) => `${tunnelProviderPrefix}${componentName}`;
+
+export { getTunnelProviderId };
+//# sourceMappingURL=lib.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"lib.mjs","sources":["../../../../../../../src/components/UiComponentTunnel/lib.ts"],"sourcesContent":["import type { FlowComponentName } from \"../propTypes\";\n\nconst tunnelProviderPrefix = \"@mittwald/flow/tunnel/\";\n\nexport const getTunnelProviderId = (componentName: FlowComponentName) =>\n  `${tunnelProviderPrefix}${componentName}`;\n"],"names":[],"mappings":"AAEA,MAAM,oBAAA,GAAuB,wBAAA;AAEtB,MAAM,sBAAsB,CAAC,aAAA,KAClC,CAAA,EAAG,oBAAoB,GAAG,aAAa,CAAA;;;;"}

package/dist/js/packages/components/src/components/propTypes/index.mjs

@@ -2,6 +2,7 @@ const propsContextSupportingComponentsMap = {
   AccentBox: true,
   Action: true,
   ActionGroup: true,
+  Accordion: true,
   Avatar: true,
   Autocomplete: true,
   Alert: true,
@@ -12,6 +13,7 @@ const propsContextSupportingComponentsMap = {
   Badge: true,
   Button: true,
   CodeEditor: true,
+  Chat: true,
   Checkbox: true,
   CheckboxButton: true,
   CheckboxGroup: true,
@@ -46,6 +48,7 @@ const propsContextSupportingComponentsMap = {
   LightBox: true,
   Link: true,
   List: true,
+  ListItemView: true,
   ListSummary: true,
   MarkdownEditor: true,
   MenuItem: true,
@@ -68,6 +71,7 @@ const propsContextSupportingComponentsMap = {
   Rating: true,
   SearchField: true,
   Section: true,
+  SectionHeader: true,
   Segment: true,
   SegmentedControl: true,
   Select: true,

package/dist/js/packages/components/src/components/propTypes/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","sources":["../../../../../../../src/components/propTypes/index.ts"],"sourcesContent":["import type { TextProps } from \"@/components/Text\";\nimport type { ButtonProps } from \"@/components/Button\";\nimport type { IconProps } from \"@/components/Icon\";\nimport type { LabelProps } from \"@/components/Label\";\nimport type { ContentProps } from \"@/components/Content\";\nimport type { LayoutCardProps } from \"@/components/LayoutCard\";\nimport type { LinkProps } from \"@/components/Link\";\nimport type { LightBoxProps } from \"@/components/LightBox\";\nimport type { FieldErrorProps } from \"@/components/FieldError\";\nimport type { FieldDescriptionProps } from \"@/components/FieldDescription\";\nimport type { AlertProps } from \"@/components/Alert\";\nimport type { HeadingProps } from \"@/components/Heading\";\nimport type { InitialsProps } from \"@/components/Initials\";\nimport type { ImageProps } from \"@/components/Image\";\nimport type { CopyButtonProps } from \"@/components/CopyButton\";\nimport type { HeaderProps } from \"@/components/Header/\";\nimport type { SwitchProps } from \"@/components/Switch\";\nimport type { AlertBadgeProps } from \"@/components/AlertBadge\";\nimport type { ActionGroupProps } from \"@/components/ActionGroup\";\nimport type { AvatarProps } from \"@/components/Avatar\";\nimport type { ActionProps } from \"@/components/Action\";\nimport type {\n  ContextMenuProps,\n  ContextMenuTriggerProps,\n  MenuItemProps,\n} from \"@/components/ContextMenu\";\nimport type { SelectProps } from \"@/components/Select\";\nimport type {\n  RadioButtonProps,\n  RadioGroupProps,\n  RadioProps,\n} from \"@/components/RadioGroup\";\nimport type { TextFieldProps } from \"@/components/TextField\";\nimport type { NumberFieldProps } from \"@/components/NumberField\";\nimport type { TextAreaProps } from \"@/components/TextArea\";\nimport type { CheckboxGroupProps } from \"@/components/CheckboxGroup\";\nimport type { CheckboxProps } from \"@/components/Checkbox\";\nimport type { CheckboxButtonProps } from \"@/components/CheckboxButton\";\nimport type { TabsProps } from \"@/components/Tabs\";\nimport type { ModalProps } from \"@/components/Modal\";\nimport type { SectionProps } from \"@/components/Section\";\nimport type { SliderProps } from \"@/components/Slider\";\nimport type { CounterBadgeProps } from \"@/components/CounterBadge\";\nimport type { FlowComponentName } from \"@/components/propTypes/types\";\nimport type {\n  ContextualHelpProps,\n  ContextualHelpTriggerProps,\n} from \"@/components/ContextualHelp\";\nimport type { PopoverProps, PopoverTriggerProps } from \"@/components/Popover\";\nimport type { ContextMenuSectionProps } from \"@/components/ContextMenu/components/ContextMenuSection\";\nimport type { ListProps } from \"@/components/List\";\nimport type { PasswordCreationFieldProps } from \"@/components/PasswordCreationField\";\nimport type { SearchFieldProps } from \"@/components/SearchField\";\nimport type { BadgeProps } from \"@/components/Badge\";\nimport type { DatePickerProps } from \"@/components/DatePicker\";\nimport type * as Aria from \"react-aria-components\";\nimport type { DateRangePickerProps } from \"@/components/DateRangePicker\";\nimport type { TimeFieldProps } from \"@/components/TimeField\";\nimport type { AlertIconProps } from \"@/components/AlertIcon\";\nimport type { ListSummaryProps } from \"@/components/List/components/ListSummary/ListSummary\";\nimport type { SegmentedControlProps } from \"@/components/SegmentedControl\";\nimport type { SegmentProps } from \"@/components/SegmentedControl/components/Segment\";\nimport type { FileCardProps } from \"@/components/FileCard\";\nimport type { FileFieldProps } from \"@/components/FileField\";\nimport type { AlignProps } from \"@/components/Align\";\nimport type { CountryOptionsProps } from \"src/components/CountryOptions\";\nimport type { ComboBoxProps } from \"@/components/ComboBox\";\nimport type { OptionProps } from \"@/components/Option\";\nimport type { MessageProps } from \"@/components/Message\";\nimport type { MessageThreadProps } from \"@/components/MessageThread\";\nimport type { FileCardListProps } from \"@/components/FileCardList\";\nimport type { AccentBoxProps } from \"@/components/AccentBox\";\nimport type { ColumnLayoutProps } from \"@/components/ColumnLayout\";\nimport type { MenuTriggerProps } from \"@/components/OverlayTrigger\";\nimport type { ProgressBarProps } from \"@/components/ProgressBar\";\nimport type { FileDropZoneProps } from \"@/components/FileDropZone\";\nimport type { NavigationProps } from \"@/components/Navigation\";\nimport type { NavigationGroupProps } from \"@/components/Navigation/components/NavigationGroup\";\nimport type { AutocompleteProps } from \"@/components/Autocomplete/Autocomplete\";\nimport type { OptionsProps } from \"@/components/Options/Options\";\nimport type { MarkdownEditorProps } from \"@/components/MarkdownEditor\";\nimport type { AlertTextProps } from \"@/components/AlertText\";\nimport type { IllustratedMessageProps } from \"@/components/IllustratedMessage\";\nimport type { RatingProps } from \"@/components/Rating\";\nimport type { CodeEditorProps } from \"@/components/CodeEditor\";\nimport type { KbdProps } from \"@/components/Kbd/Kbd\";\n\nexport * from \"./types\";\n\nexport interface FlowComponentPropsTypes {\n  AccentBox: AccentBoxProps;\n  Action: ActionProps;\n  ActionGroup: ActionGroupProps;\n  Alert: AlertProps;\n  AlertBadge: AlertBadgeProps;\n  AlertIcon: AlertIconProps;\n  AlertText: AlertTextProps;\n  Align: AlignProps;\n  Avatar: AvatarProps;\n  Autocomplete: AutocompleteProps;\n  Badge: BadgeProps;\n  Button: ButtonProps;\n  CodeEditor: CodeEditorProps;\n  Checkbox: CheckboxProps;\n  CheckboxButton: CheckboxButtonProps;\n  CheckboxGroup: CheckboxGroupProps;\n  ColumnLayout: ColumnLayoutProps;\n  ComboBox: ComboBoxProps;\n  Content: ContentProps;\n  ContextMenu: ContextMenuProps;\n  ContextMenuSection: ContextMenuSectionProps;\n  ContextMenuTrigger: ContextMenuTriggerProps;\n  ContextualHelp: ContextualHelpProps;\n  ContextualHelpTrigger: ContextualHelpTriggerProps;\n  CopyButton: CopyButtonProps;\n  CounterBadge: CounterBadgeProps;\n  CountryOptions: CountryOptionsProps;\n  DatePicker: DatePickerProps<Aria.DateValue>;\n  DateRangePicker: DateRangePickerProps<Aria.DateValue>;\n  FieldDescription: FieldDescriptionProps;\n  FieldError: FieldErrorProps;\n  FileCard: FileCardProps;\n  FileCardList: FileCardListProps;\n  FileField: FileFieldProps;\n  FileDropZone: FileDropZoneProps;\n  Header: HeaderProps;\n  Heading: HeadingProps;\n  Icon: IconProps;\n  IllustratedMessage: IllustratedMessageProps;\n  Image: ImageProps;\n  Initials: InitialsProps;\n  Label: LabelProps;\n  LayoutCard: LayoutCardProps;\n  LightBox: LightBoxProps;\n  Link: LinkProps;\n  List: ListProps<never>;\n  ListSummary: ListSummaryProps;\n  MarkdownEditor: MarkdownEditorProps;\n  MenuItem: MenuItemProps;\n  MenuTrigger: MenuTriggerProps;\n  Message: MessageProps;\n  MessageThread: MessageThreadProps;\n  Modal: ModalProps;\n  Navigation: NavigationProps;\n  NavigationGroup: NavigationGroupProps;\n  NumberField: NumberFieldProps;\n  Option: OptionProps;\n  Options: OptionsProps;\n  Popover: PopoverProps;\n  PopoverTrigger: PopoverTriggerProps;\n  PasswordCreationField: PasswordCreationFieldProps;\n  ProgressBar: ProgressBarProps;\n  Radio: RadioProps;\n  RadioButton: RadioButtonProps;\n  RadioGroup: RadioGroupProps;\n  Rating: RatingProps;\n  SearchField: SearchFieldProps;\n  Section: SectionProps;\n  Segment: SegmentProps;\n  SegmentedControl: SegmentedControlProps;\n  Select: SelectProps;\n  Kbd: KbdProps;\n  Slider: SliderProps;\n  Switch: SwitchProps;\n  Tabs: TabsProps;\n  TabTitle: TabsProps;\n  Text: TextProps;\n  TextArea: TextAreaProps;\n  TextField: TextFieldProps;\n  TimeField: TimeFieldProps;\n}\n\nconst propsContextSupportingComponentsMap: Record<\n  keyof FlowComponentPropsTypes,\n  true\n> = {\n  AccentBox: true,\n  Action: true,\n  ActionGroup: true,\n  Avatar: true,\n  Autocomplete: true,\n  Alert: true,\n  AlertBadge: true,\n  AlertIcon: true,\n  AlertText: true,\n  Align: true,\n  Badge: true,\n  Button: true,\n  CodeEditor: true,\n  Checkbox: true,\n  CheckboxButton: true,\n  CheckboxGroup: true,\n  ColumnLayout: true,\n  ComboBox: true,\n  Content: true,\n  ContextMenu: true,\n  ContextMenuSection: true,\n  ContextMenuTrigger: true,\n  ContextualHelp: true,\n  ContextualHelpTrigger: true,\n  CopyButton: true,\n  CounterBadge: true,\n  CountryOptions: true,\n  DatePicker: true,\n  DateRangePicker: true,\n  FieldDescription: true,\n  FieldError: true,\n  FileCard: true,\n  FileCardList: true,\n  FileField: true,\n  FileDropZone: true,\n  Header: true,\n  Heading: true,\n  Icon: true,\n  IllustratedMessage: true,\n  Image: true,\n  Initials: true,\n  Kbd: true,\n  Label: true,\n  LayoutCard: true,\n  LightBox: true,\n  Link: true,\n  List: true,\n  ListSummary: true,\n  MarkdownEditor: true,\n  MenuItem: true,\n  MenuTrigger: true,\n  Message: true,\n  MessageThread: true,\n  Modal: true,\n  Navigation: true,\n  NavigationGroup: true,\n  NumberField: true,\n  Radio: true,\n  Option: true,\n  Options: true,\n  Popover: true,\n  PopoverTrigger: true,\n  PasswordCreationField: true,\n  ProgressBar: true,\n  RadioButton: true,\n  RadioGroup: true,\n  Rating: true,\n  SearchField: true,\n  Section: true,\n  Segment: true,\n  SegmentedControl: true,\n  Select: true,\n  Slider: true,\n  Switch: true,\n  Tabs: true,\n  TabTitle: true,\n  TestComponent: true,\n  Text: true,\n  TextArea: true,\n  TextField: true,\n  TimeField: true,\n};\n\nexport const propsContextSupportingComponents = Object.keys(\n  propsContextSupportingComponentsMap,\n) as FlowComponentName[];\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.mjs","sources":["../../../../../../../src/components/propTypes/index.ts"],"sourcesContent":["import type { TextProps } from \"@/components/Text\";\nimport type { ButtonProps } from \"@/components/Button\";\nimport type { IconProps } from \"@/components/Icon\";\nimport type { LabelProps } from \"@/components/Label\";\nimport type { ContentProps } from \"@/components/Content\";\nimport type { LayoutCardProps } from \"@/components/LayoutCard\";\nimport type { LinkProps } from \"@/components/Link\";\nimport type { LightBoxProps } from \"@/components/LightBox\";\nimport type { FieldErrorProps } from \"@/components/FieldError\";\nimport type { FieldDescriptionProps } from \"@/components/FieldDescription\";\nimport type { AlertProps } from \"@/components/Alert\";\nimport type { HeadingProps } from \"@/components/Heading\";\nimport type { InitialsProps } from \"@/components/Initials\";\nimport type { ImageProps } from \"@/components/Image\";\nimport type { CopyButtonProps } from \"@/components/CopyButton\";\nimport type { HeaderProps } from \"@/components/Header/\";\nimport type { SwitchProps } from \"@/components/Switch\";\nimport type { AlertBadgeProps } from \"@/components/AlertBadge\";\nimport type { ActionGroupProps } from \"@/components/ActionGroup\";\nimport type { AvatarProps } from \"@/components/Avatar\";\nimport type { ActionProps } from \"@/components/Action\";\nimport type {\n  ContextMenuProps,\n  ContextMenuTriggerProps,\n  MenuItemProps,\n} from \"@/components/ContextMenu\";\nimport type { SelectProps } from \"@/components/Select\";\nimport type {\n  RadioButtonProps,\n  RadioGroupProps,\n  RadioProps,\n} from \"@/components/RadioGroup\";\nimport type { TextFieldProps } from \"@/components/TextField\";\nimport type { NumberFieldProps } from \"@/components/NumberField\";\nimport type { TextAreaProps } from \"@/components/TextArea\";\nimport type { CheckboxGroupProps } from \"@/components/CheckboxGroup\";\nimport type { CheckboxProps } from \"@/components/Checkbox\";\nimport type { CheckboxButtonProps } from \"@/components/CheckboxButton\";\nimport type { TabsProps } from \"@/components/Tabs\";\nimport type { ModalProps } from \"@/components/Modal\";\nimport type { SectionProps } from \"@/components/Section\";\nimport type { SliderProps } from \"@/components/Slider\";\nimport type { CounterBadgeProps } from \"@/components/CounterBadge\";\nimport type { FlowComponentName } from \"@/components/propTypes/types\";\nimport type {\n  ContextualHelpProps,\n  ContextualHelpTriggerProps,\n} from \"@/components/ContextualHelp\";\nimport type { PopoverProps, PopoverTriggerProps } from \"@/components/Popover\";\nimport type { ContextMenuSectionProps } from \"@/components/ContextMenu/components/ContextMenuSection\";\nimport type { ListItemViewContentProps, ListProps } from \"@/components/List\";\nimport type { PasswordCreationFieldProps } from \"@/components/PasswordCreationField\";\nimport type { SearchFieldProps } from \"@/components/SearchField\";\nimport type { BadgeProps } from \"@/components/Badge\";\nimport type { DatePickerProps } from \"@/components/DatePicker\";\nimport type * as Aria from \"react-aria-components\";\nimport type { DateRangePickerProps } from \"@/components/DateRangePicker\";\nimport type { TimeFieldProps } from \"@/components/TimeField\";\nimport type { AlertIconProps } from \"@/components/AlertIcon\";\nimport type { ListSummaryProps } from \"@/components/List/components/ListSummary/ListSummary\";\nimport type { SegmentedControlProps } from \"@/components/SegmentedControl\";\nimport type { SegmentProps } from \"@/components/SegmentedControl/components/Segment\";\nimport type { FileCardProps } from \"@/components/FileCard\";\nimport type { FileFieldProps } from \"@/components/FileField\";\nimport type { AlignProps } from \"@/components/Align\";\nimport type { CountryOptionsProps } from \"src/components/CountryOptions\";\nimport type { ComboBoxProps } from \"@/components/ComboBox\";\nimport type { OptionProps } from \"@/components/Option\";\nimport type { MessageProps } from \"@/components/Message\";\nimport type { MessageThreadProps } from \"@/components/MessageThread\";\nimport type { FileCardListProps } from \"@/components/FileCardList\";\nimport type { AccentBoxProps } from \"@/components/AccentBox\";\nimport type { ColumnLayoutProps } from \"@/components/ColumnLayout\";\nimport type { MenuTriggerProps } from \"@/components/OverlayTrigger\";\nimport type { ProgressBarProps } from \"@/components/ProgressBar\";\nimport type { FileDropZoneProps } from \"@/components/FileDropZone\";\nimport type { NavigationProps } from \"@/components/Navigation\";\nimport type { NavigationGroupProps } from \"@/components/Navigation/components/NavigationGroup\";\nimport type { AutocompleteProps } from \"@/components/Autocomplete/Autocomplete\";\nimport type { OptionsProps } from \"@/components/Options/Options\";\nimport type { MarkdownEditorProps } from \"@/components/MarkdownEditor\";\nimport type { AlertTextProps } from \"@/components/AlertText\";\nimport type { IllustratedMessageProps } from \"@/components/IllustratedMessage\";\nimport type { RatingProps } from \"@/components/Rating\";\nimport type { CodeEditorProps } from \"@/components/CodeEditor\";\nimport type { KbdProps } from \"@/components/Kbd/Kbd\";\nimport type { AccordionProps } from \"@/components/Accordion\";\nimport type { ChatProps } from \"../Chat\";\nimport type { SectionHeaderProps } from \"../Section/components/SectionHeader/SectionHeader\";\n\nexport * from \"./types\";\n\nexport interface FlowComponentPropsTypes {\n  AccentBox: AccentBoxProps;\n  Action: ActionProps;\n  ActionGroup: ActionGroupProps;\n  Accordion: AccordionProps;\n  Alert: AlertProps;\n  AlertBadge: AlertBadgeProps;\n  AlertIcon: AlertIconProps;\n  AlertText: AlertTextProps;\n  Align: AlignProps;\n  Avatar: AvatarProps;\n  Autocomplete: AutocompleteProps;\n  Badge: BadgeProps;\n  Button: ButtonProps;\n  CodeEditor: CodeEditorProps;\n  Chat: ChatProps;\n  Checkbox: CheckboxProps;\n  CheckboxButton: CheckboxButtonProps;\n  CheckboxGroup: CheckboxGroupProps;\n  ColumnLayout: ColumnLayoutProps;\n  ComboBox: ComboBoxProps;\n  Content: ContentProps;\n  ContextMenu: ContextMenuProps;\n  ContextMenuSection: ContextMenuSectionProps;\n  ContextMenuTrigger: ContextMenuTriggerProps;\n  ContextualHelp: ContextualHelpProps;\n  ContextualHelpTrigger: ContextualHelpTriggerProps;\n  CopyButton: CopyButtonProps;\n  CounterBadge: CounterBadgeProps;\n  CountryOptions: CountryOptionsProps;\n  DatePicker: DatePickerProps<Aria.DateValue>;\n  DateRangePicker: DateRangePickerProps<Aria.DateValue>;\n  FieldDescription: FieldDescriptionProps;\n  FieldError: FieldErrorProps;\n  FileCard: FileCardProps;\n  FileCardList: FileCardListProps;\n  FileField: FileFieldProps;\n  FileDropZone: FileDropZoneProps;\n  Header: HeaderProps;\n  Heading: HeadingProps;\n  Icon: IconProps;\n  IllustratedMessage: IllustratedMessageProps;\n  Image: ImageProps;\n  Initials: InitialsProps;\n  Label: LabelProps;\n  LayoutCard: LayoutCardProps;\n  LightBox: LightBoxProps;\n  Link: LinkProps;\n  List: ListProps<never>;\n  ListItemView: ListItemViewContentProps;\n  ListSummary: ListSummaryProps;\n  MarkdownEditor: MarkdownEditorProps;\n  MenuItem: MenuItemProps;\n  MenuTrigger: MenuTriggerProps;\n  Message: MessageProps;\n  MessageThread: MessageThreadProps;\n  Modal: ModalProps;\n  Navigation: NavigationProps;\n  NavigationGroup: NavigationGroupProps;\n  NumberField: NumberFieldProps;\n  Option: OptionProps;\n  Options: OptionsProps;\n  Popover: PopoverProps;\n  PopoverTrigger: PopoverTriggerProps;\n  PasswordCreationField: PasswordCreationFieldProps;\n  ProgressBar: ProgressBarProps;\n  Radio: RadioProps;\n  RadioButton: RadioButtonProps;\n  RadioGroup: RadioGroupProps;\n  Rating: RatingProps;\n  SearchField: SearchFieldProps;\n  Section: SectionProps;\n  Segment: SegmentProps;\n  SegmentedControl: SegmentedControlProps;\n  Select: SelectProps;\n  Kbd: KbdProps;\n  SectionHeader: SectionHeaderProps;\n  Slider: SliderProps;\n  Switch: SwitchProps;\n  Tabs: TabsProps;\n  TabTitle: TabsProps;\n  Text: TextProps;\n  TextArea: TextAreaProps;\n  TextField: TextFieldProps;\n  TimeField: TimeFieldProps;\n}\n\nconst propsContextSupportingComponentsMap: Record<\n  keyof FlowComponentPropsTypes,\n  true\n> = {\n  AccentBox: true,\n  Action: true,\n  ActionGroup: true,\n  Accordion: true,\n  Avatar: true,\n  Autocomplete: true,\n  Alert: true,\n  AlertBadge: true,\n  AlertIcon: true,\n  AlertText: true,\n  Align: true,\n  Badge: true,\n  Button: true,\n  CodeEditor: true,\n  Chat: true,\n  Checkbox: true,\n  CheckboxButton: true,\n  CheckboxGroup: true,\n  ColumnLayout: true,\n  ComboBox: true,\n  Content: true,\n  ContextMenu: true,\n  ContextMenuSection: true,\n  ContextMenuTrigger: true,\n  ContextualHelp: true,\n  ContextualHelpTrigger: true,\n  CopyButton: true,\n  CounterBadge: true,\n  CountryOptions: true,\n  DatePicker: true,\n  DateRangePicker: true,\n  FieldDescription: true,\n  FieldError: true,\n  FileCard: true,\n  FileCardList: true,\n  FileField: true,\n  FileDropZone: true,\n  Header: true,\n  Heading: true,\n  Icon: true,\n  IllustratedMessage: true,\n  Image: true,\n  Initials: true,\n  Kbd: true,\n  Label: true,\n  LayoutCard: true,\n  LightBox: true,\n  Link: true,\n  List: true,\n  ListItemView: true,\n  ListSummary: true,\n  MarkdownEditor: true,\n  MenuItem: true,\n  MenuTrigger: true,\n  Message: true,\n  MessageThread: true,\n  Modal: true,\n  Navigation: true,\n  NavigationGroup: true,\n  NumberField: true,\n  Radio: true,\n  Option: true,\n  Options: true,\n  Popover: true,\n  PopoverTrigger: true,\n  PasswordCreationField: true,\n  ProgressBar: true,\n  RadioButton: true,\n  RadioGroup: true,\n  Rating: true,\n  SearchField: true,\n  Section: true,\n  SectionHeader: true,\n  Segment: true,\n  SegmentedControl: true,\n  Select: true,\n  Slider: true,\n  Switch: true,\n  Tabs: true,\n  TabTitle: true,\n  TestComponent: true,\n  Text: true,\n  TextArea: true,\n  TextField: true,\n  TimeField: true,\n};\n\nexport const propsContextSupportingComponents = Object.keys(\n  propsContextSupportingComponentsMap,\n) as FlowComponentName[];\n"],"names":[],"mappings":"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"}

package/dist/js/packages/components/src/lib/componentFactory/flowComponent.mjs

@@ -2,19 +2,20 @@
 /* */
 import { jsx } from 'react/jsx-runtime';
 import { memo, cloneElement } from 'react';
-import { TunnelEntry } from '@mittwald/react-tunnel';
 import { SlotContextProvider } from '../slotContext/SlotContextProvider.mjs';
 import { useProps } from '../hooks/useProps.mjs';
 import { useComponentPropsContext } from '../propsContext/propsContext.mjs';
 import { ComponentPropsContextProvider } from '../propsContext/components/ComponentPropsContextProvider.mjs';
 import { ClearPropsContext } from '../propsContext/components/ClearPropsContext.mjs';
 import ClearPropsContextView from '../../views/ClearPropsContextView.mjs';
+import { UiComponentTunnelProvider } from '../../components/UiComponentTunnel/UiComponentTunnelProvider.mjs';
+import { UiComponentTunnelEntry } from '../../components/UiComponentTunnel/UiComponentTunnelEntry.mjs';
 
 function flowComponent(componentName, ImplementationComponentType, options = {}) {
   const { type = "ui", isRemoteComponent = false } = options;
   const MemoizedImplementationComponentType = memo(ImplementationComponentType);
   function Component(props) {
-    const { tunnelId, wrapWith, ...propsWithContext } = useProps(
+    const { tunnel, wrapWith, ...propsWithContext } = useProps(
       componentName,
       props
     );
@@ -22,6 +23,9 @@ function flowComponent(componentName, ImplementationComponentType, options = {})
     const componentProps = useComponentPropsContext(componentName);
     ImplementationComponentType.displayName = `FlowComponentImpl(${componentName})`;
     let element = /* @__PURE__ */ jsx(MemoizedImplementationComponentType, { ...implementationTypeProps });
+    if (type === "ui" || type === "layout") {
+      element = /* @__PURE__ */ jsx(UiComponentTunnelProvider, { component: componentName, children: element });
+    }
     element = /* @__PURE__ */ jsx(ComponentPropsContextProvider, { componentProps, children: element });
     if (type === "ui") {
       if (isRemoteComponent) {
@@ -36,8 +40,8 @@ function flowComponent(componentName, ImplementationComponentType, options = {})
     if (wrapWith) {
       element = cloneElement(wrapWith, void 0, element);
     }
-    if (tunnelId) {
-      element = /* @__PURE__ */ jsx(TunnelEntry, { id: tunnelId, children: element });
+    if (tunnel) {
+      element = /* @__PURE__ */ jsx(UiComponentTunnelEntry, { id: tunnel.id, component: tunnel.component, children: element });
     }
     return element;
   }

package/dist/js/packages/components/src/lib/componentFactory/flowComponent.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"flowComponent.mjs","sources":["../../../../../../../src/lib/componentFactory/flowComponent.tsx"],"sourcesContent":["import type {\n  FlowComponentName,\n  FlowComponentProps as FlowComponentPropsOfName,\n} from \"@/components/propTypes\";\nimport type {\n  ComponentProps,\n  ComponentType,\n  FunctionComponent,\n  ReactElement,\n  ReactNode,\n  RefAttributes,\n} from \"react\";\nimport { cloneElement, memo } from \"react\";\nimport type { PropsWithTunnel } from \"@/lib/types/props\";\nimport { TunnelEntry } from \"@mittwald/react-tunnel\";\nimport SlotContextProvider from \"@/lib/slotContext/SlotContextProvider\";\nimport { useProps } from \"@/lib/hooks/useProps\";\nimport { useComponentPropsContext } from \"@/lib/propsContext/propsContext\";\nimport { ComponentPropsContextProvider } from \"@/components/ComponentPropsContextProvider\";\nimport { ClearPropsContext } from \"@/components/ClearPropsContext\";\nimport ClearPropsContextView from \"@/views/ClearPropsContextView\";\n\ntype RefType<T> = T extends RefAttributes<infer R> ? R : undefined;\n\nexport interface FlowComponentProps<R = HTMLDivElement>\n  extends PropsWithTunnel, RefAttributes<R> {\n  wrapWith?: ReactElement;\n}\n\nexport type FlowComponentImplementationProps<C extends FlowComponentName> =\n  Omit<FlowComponentPropsOfName<C>, keyof FlowComponentProps> &\n    RefAttributes<RefType<FlowComponentPropsOfName<C>>>;\n\ntype FlowComponentImplementationType<C extends FlowComponentName> =\n  ComponentType<FlowComponentImplementationProps<C>>;\n\ntype FlowComponentType<C extends FlowComponentName> = FunctionComponent<\n  FlowComponentPropsOfName<C> &\n    RefAttributes<RefType<FlowComponentPropsOfName<C>>>\n>;\n\nexport type FlowComponentProvisionType = \"provider\" | \"ui\" | \"layout\";\n\ninterface Options {\n  type?: FlowComponentProvisionType;\n  isRemoteComponent?: boolean;\n}\n\nexport function flowComponent<C extends FlowComponentName>(\n  componentName: C,\n  ImplementationComponentType: FlowComponentImplementationType<C>,\n  options: Options = {},\n): FlowComponentType<C> {\n  type Props = FlowComponentPropsOfName<C> &\n    RefAttributes<RefType<FlowComponentPropsOfName<C>>>;\n\n  const { type = \"ui\", isRemoteComponent = false } = options;\n\n  const MemoizedImplementationComponentType = memo(ImplementationComponentType);\n\n  function Component(props: Props) {\n    const { tunnelId, wrapWith, ...propsWithContext } = useProps(\n      componentName,\n      props as FlowComponentPropsOfName<C>,\n    ) as FlowComponentProps<RefType<FlowComponentPropsOfName<C>>>;\n\n    const implementationTypeProps = propsWithContext as ComponentProps<\n      typeof ImplementationComponentType\n    >;\n\n    const componentProps = useComponentPropsContext(componentName);\n\n    ImplementationComponentType.displayName = `FlowComponentImpl(${componentName})`;\n\n    let element: ReactNode = (\n      <MemoizedImplementationComponentType {...implementationTypeProps} />\n    );\n\n    element = (\n      <ComponentPropsContextProvider componentProps={componentProps}>\n        {element}\n      </ComponentPropsContextProvider>\n    );\n\n    if (type === \"ui\") {\n      /**\n       * Protect the inside of UI components for accidental prop changes through\n       * the Props Context.\n       */\n      if (isRemoteComponent) {\n        element = <ClearPropsContext>{element}</ClearPropsContext>;\n      } else {\n        /**\n         * In case of a UI component that does not have a remote counterpart\n         * (like the Modal component), the <ClearPropsContext> must be\n         * additionally applied on the host side by using the\n         * <ClearPropsContextView>.\n         *\n         * This prevents Props Contexts created by parent components on the host\n         * side affecting the children of this UI component.\n         */\n        element = (\n          <ClearPropsContext>\n            <ClearPropsContextView>{element}</ClearPropsContextView>\n          </ClearPropsContext>\n        );\n      }\n    }\n\n    if (\"slot\" in props && !!props.slot && typeof props.slot === \"string\") {\n      element = (\n        <SlotContextProvider slot={props.slot} component={componentName}>\n          {element}\n        </SlotContextProvider>\n      );\n    }\n\n    if (wrapWith) {\n      element = cloneElement(wrapWith, undefined, element);\n    }\n\n    if (tunnelId) {\n      element = <TunnelEntry id={tunnelId}>{element}</TunnelEntry>;\n    }\n    return element;\n  }\n\n  Component.displayName = `FlowComponent(${componentName})`;\n  return memo(Component);\n}\n"],"names":[],"mappings":";;;;;;;;;;AAgDO,SAAS,aAAA,CACd,aAAA,EACA,2BAAA,EACA,OAAA,GAAmB,EAAC,EACE;AAItB,EAAA,MAAM,EAAE,IAAA,GAAO,IAAA,EAAM,iBAAA,GAAoB,OAAM,GAAI,OAAA;AAEnD,EAAA,MAAM,mCAAA,GAAsC,KAAK,2BAA2B,CAAA;AAE5E,EAAA,SAAS,UAAU,KAAA,EAAc;AAC/B,IAAA,MAAM,EAAE,QAAA,EAAU,QAAA,EAAU,GAAG,kBAAiB,GAAI,QAAA;AAAA,MAClD,aAAA;AAAA,MACA;AAAA,KACF;AAEA,IAAA,MAAM,uBAAA,GAA0B,gBAAA;AAIhC,IAAA,MAAM,cAAA,GAAiB,yBAAyB,aAAa,CAAA;AAE7D,IAAA,2BAAA,CAA4B,WAAA,GAAc,qBAAqB,aAAa,CAAA,CAAA,CAAA;AAE5E,IAAA,IAAI,OAAA,mBACF,GAAA,CAAC,mCAAA,EAAA,EAAqC,GAAG,uBAAA,EAAyB,CAAA;AAGpE,IAAA,OAAA,mBACE,GAAA,CAAC,6BAAA,EAAA,EAA8B,cAAA,EAC5B,QAAA,EAAA,OAAA,EACH,CAAA;AAGF,IAAA,IAAI,SAAS,IAAA,EAAM;AAKjB,MAAA,IAAI,iBAAA,EAAmB;AACrB,QAAA,OAAA,mBAAU,GAAA,CAAC,qBAAmB,QAAA,EAAA,OAAA,EAAQ,CAAA;AAAA,MACxC,CAAA,MAAO;AAUL,QAAA,OAAA,mBACE,GAAA,CAAC,iBAAA,EAAA,EACC,QAAA,kBAAA,GAAA,CAAC,qBAAA,EAAA,EAAuB,mBAAQ,CAAA,EAClC,CAAA;AAAA,MAEJ;AAAA,IACF;AAEA,IAAA,IAAI,MAAA,IAAU,SAAS,CAAC,CAAC,MAAM,IAAA,IAAQ,OAAO,KAAA,CAAM,IAAA,KAAS,QAAA,EAAU;AACrE,MAAA,OAAA,uBACG,mBAAA,EAAA,EAAoB,IAAA,EAAM,MAAM,IAAA,EAAM,SAAA,EAAW,eAC/C,QAAA,EAAA,OAAA,EACH,CAAA;AAAA,IAEJ;AAEA,IAAA,IAAI,QAAA,EAAU;AACZ,MAAA,OAAA,GAAU,YAAA,CAAa,QAAA,EAAU,MAAA,EAAW,OAAO,CAAA;AAAA,IACrD;AAEA,IAAA,IAAI,QAAA,EAAU;AACZ,MAAA,OAAA,mBAAU,GAAA,CAAC,WAAA,EAAA,EAAY,EAAA,EAAI,QAAA,EAAW,QAAA,EAAA,OAAA,EAAQ,CAAA;AAAA,IAChD;AACA,IAAA,OAAO,OAAA;AAAA,EACT;AAEA,EAAA,SAAA,CAAU,WAAA,GAAc,iBAAiB,aAAa,CAAA,CAAA,CAAA;AACtD,EAAA,OAAO,KAAK,SAAS,CAAA;AACvB;;;;"}
+{"version":3,"file":"flowComponent.mjs","sources":["../../../../../../../src/lib/componentFactory/flowComponent.tsx"],"sourcesContent":["import type {\n  FlowComponentName,\n  FlowComponentProps as FlowComponentPropsOfName,\n} from \"@/components/propTypes\";\nimport type {\n  ComponentProps,\n  ComponentType,\n  FunctionComponent,\n  ReactElement,\n  ReactNode,\n  RefAttributes,\n} from \"react\";\nimport { cloneElement, memo } from \"react\";\nimport type { PropsWithTunnel } from \"@/lib/types/props\";\nimport SlotContextProvider from \"@/lib/slotContext/SlotContextProvider\";\nimport { useProps } from \"@/lib/hooks/useProps\";\nimport { useComponentPropsContext } from \"@/lib/propsContext/propsContext\";\nimport { ComponentPropsContextProvider } from \"@/components/ComponentPropsContextProvider\";\nimport { ClearPropsContext } from \"@/components/ClearPropsContext\";\nimport ClearPropsContextView from \"@/views/ClearPropsContextView\";\nimport { UiComponentTunnelProvider } from \"@/components/UiComponentTunnel/UiComponentTunnelProvider\";\nimport { UiComponentTunnelEntry } from \"@/components/UiComponentTunnel/UiComponentTunnelEntry\";\n\ntype RefType<T> = T extends RefAttributes<infer R> ? R : undefined;\n\nexport interface FlowComponentProps<R = HTMLDivElement>\n  extends PropsWithTunnel, RefAttributes<R> {\n  wrapWith?: ReactElement;\n}\n\nexport type FlowComponentImplementationProps<C extends FlowComponentName> =\n  Omit<FlowComponentPropsOfName<C>, keyof FlowComponentProps> &\n    RefAttributes<RefType<FlowComponentPropsOfName<C>>>;\n\ntype FlowComponentImplementationType<C extends FlowComponentName> =\n  ComponentType<FlowComponentImplementationProps<C>>;\n\ntype FlowComponentType<C extends FlowComponentName> = FunctionComponent<\n  FlowComponentPropsOfName<C> &\n    RefAttributes<RefType<FlowComponentPropsOfName<C>>>\n>;\n\nexport type FlowComponentProvisionType = \"provider\" | \"ui\" | \"layout\";\n\ninterface Options {\n  type?: FlowComponentProvisionType;\n  isRemoteComponent?: boolean;\n}\n\nexport function flowComponent<C extends FlowComponentName>(\n  componentName: C,\n  ImplementationComponentType: FlowComponentImplementationType<C>,\n  options: Options = {},\n): FlowComponentType<C> {\n  type Props = FlowComponentPropsOfName<C> &\n    RefAttributes<RefType<FlowComponentPropsOfName<C>>>;\n\n  const { type = \"ui\", isRemoteComponent = false } = options;\n\n  const MemoizedImplementationComponentType = memo(ImplementationComponentType);\n\n  function Component(props: Props) {\n    const { tunnel, wrapWith, ...propsWithContext } = useProps(\n      componentName,\n      props as FlowComponentPropsOfName<C>,\n    ) as FlowComponentProps<RefType<FlowComponentPropsOfName<C>>>;\n\n    const implementationTypeProps = propsWithContext as ComponentProps<\n      typeof ImplementationComponentType\n    >;\n\n    const componentProps = useComponentPropsContext(componentName);\n\n    ImplementationComponentType.displayName = `FlowComponentImpl(${componentName})`;\n\n    let element: ReactNode = (\n      <MemoizedImplementationComponentType {...implementationTypeProps} />\n    );\n\n    if (type === \"ui\" || type === \"layout\") {\n      element = (\n        <UiComponentTunnelProvider component={componentName}>\n          {element}\n        </UiComponentTunnelProvider>\n      );\n    }\n\n    element = (\n      <ComponentPropsContextProvider componentProps={componentProps}>\n        {element}\n      </ComponentPropsContextProvider>\n    );\n\n    if (type === \"ui\") {\n      /**\n       * Protect the inside of UI components for accidental prop changes through\n       * the Props Context.\n       */\n      if (isRemoteComponent) {\n        element = <ClearPropsContext>{element}</ClearPropsContext>;\n      } else {\n        /**\n         * In case of a UI component that does not have a remote counterpart\n         * (like the Modal component), the <ClearPropsContext> must be\n         * additionally applied on the host side by using the\n         * <ClearPropsContextView>.\n         *\n         * This prevents Props Contexts created by parent components on the host\n         * side affecting the children of this UI component.\n         */\n        element = (\n          <ClearPropsContext>\n            <ClearPropsContextView>{element}</ClearPropsContextView>\n          </ClearPropsContext>\n        );\n      }\n    }\n\n    if (\"slot\" in props && !!props.slot && typeof props.slot === \"string\") {\n      element = (\n        <SlotContextProvider slot={props.slot} component={componentName}>\n          {element}\n        </SlotContextProvider>\n      );\n    }\n\n    if (wrapWith) {\n      element = cloneElement(wrapWith, undefined, element);\n    }\n\n    if (tunnel) {\n      element = (\n        <UiComponentTunnelEntry id={tunnel.id} component={tunnel.component}>\n          {element}\n        </UiComponentTunnelEntry>\n      );\n    }\n\n    return element;\n  }\n\n  Component.displayName = `FlowComponent(${componentName})`;\n  return memo(Component);\n}\n"],"names":[],"mappings":";;;;;;;;;;;AAiDO,SAAS,aAAA,CACd,aAAA,EACA,2BAAA,EACA,OAAA,GAAmB,EAAC,EACE;AAItB,EAAA,MAAM,EAAE,IAAA,GAAO,IAAA,EAAM,iBAAA,GAAoB,OAAM,GAAI,OAAA;AAEnD,EAAA,MAAM,mCAAA,GAAsC,KAAK,2BAA2B,CAAA;AAE5E,EAAA,SAAS,UAAU,KAAA,EAAc;AAC/B,IAAA,MAAM,EAAE,MAAA,EAAQ,QAAA,EAAU,GAAG,kBAAiB,GAAI,QAAA;AAAA,MAChD,aAAA;AAAA,MACA;AAAA,KACF;AAEA,IAAA,MAAM,uBAAA,GAA0B,gBAAA;AAIhC,IAAA,MAAM,cAAA,GAAiB,yBAAyB,aAAa,CAAA;AAE7D,IAAA,2BAAA,CAA4B,WAAA,GAAc,qBAAqB,aAAa,CAAA,CAAA,CAAA;AAE5E,IAAA,IAAI,OAAA,mBACF,GAAA,CAAC,mCAAA,EAAA,EAAqC,GAAG,uBAAA,EAAyB,CAAA;AAGpE,IAAA,IAAI,IAAA,KAAS,IAAA,IAAQ,IAAA,KAAS,QAAA,EAAU;AACtC,MAAA,OAAA,mBACE,GAAA,CAAC,yBAAA,EAAA,EAA0B,SAAA,EAAW,aAAA,EACnC,QAAA,EAAA,OAAA,EACH,CAAA;AAAA,IAEJ;AAEA,IAAA,OAAA,mBACE,GAAA,CAAC,6BAAA,EAAA,EAA8B,cAAA,EAC5B,QAAA,EAAA,OAAA,EACH,CAAA;AAGF,IAAA,IAAI,SAAS,IAAA,EAAM;AAKjB,MAAA,IAAI,iBAAA,EAAmB;AACrB,QAAA,OAAA,mBAAU,GAAA,CAAC,qBAAmB,QAAA,EAAA,OAAA,EAAQ,CAAA;AAAA,MACxC,CAAA,MAAO;AAUL,QAAA,OAAA,mBACE,GAAA,CAAC,iBAAA,EAAA,EACC,QAAA,kBAAA,GAAA,CAAC,qBAAA,EAAA,EAAuB,mBAAQ,CAAA,EAClC,CAAA;AAAA,MAEJ;AAAA,IACF;AAEA,IAAA,IAAI,MAAA,IAAU,SAAS,CAAC,CAAC,MAAM,IAAA,IAAQ,OAAO,KAAA,CAAM,IAAA,KAAS,QAAA,EAAU;AACrE,MAAA,OAAA,uBACG,mBAAA,EAAA,EAAoB,IAAA,EAAM,MAAM,IAAA,EAAM,SAAA,EAAW,eAC/C,QAAA,EAAA,OAAA,EACH,CAAA;AAAA,IAEJ;AAEA,IAAA,IAAI,QAAA,EAAU;AACZ,MAAA,OAAA,GAAU,YAAA,CAAa,QAAA,EAAU,MAAA,EAAW,OAAO,CAAA;AAAA,IACrD;AAEA,IAAA,IAAI,MAAA,EAAQ;AACV,MAAA,OAAA,mBACE,GAAA,CAAC,0BAAuB,EAAA,EAAI,MAAA,CAAO,IAAI,SAAA,EAAW,MAAA,CAAO,WACtD,QAAA,EAAA,OAAA,EACH,CAAA;AAAA,IAEJ;AAEA,IAAA,OAAO,OAAA;AAAA,EACT;AAEA,EAAA,SAAA,CAAU,WAAA,GAAc,iBAAiB,aAAa,CAAA,CAAA,CAAA;AACtD,EAAA,OAAO,KAAK,SAAS,CAAA;AACvB;;;;"}

package/dist/js/packages/components/src/lib/hooks/useFieldComponent.mjs

@@ -6,8 +6,10 @@ import formFieldStyles from '../../components/FormField/FormField.module.scss.mj
 import { useFieldError } from './useFieldError.mjs';
 import clsx from 'clsx';
 
-const useFieldComponent = (props) => {
-  const { FieldErrorView, FieldErrorCaptureContext } = useFieldError();
+const useFieldComponent = (props, component) => {
+  const { FieldErrorView, FieldErrorCaptureContext } = useFieldError({
+    component
+  });
   const fieldPropsContext = {
     Label: {
       className: formFieldStyles.label,

package/dist/js/packages/components/src/lib/hooks/useFieldComponent.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"useFieldComponent.mjs","sources":["../../../../../../../src/lib/hooks/useFieldComponent.tsx"],"sourcesContent":["import type { FC, PropsWithChildren } from \"react\";\nimport { type PropsContext } from \"@/lib/propsContext\";\nimport formFieldStyles from \"@/components/FormField/FormField.module.scss\";\nimport { useFieldError } from \"@/lib/hooks/useFieldError\";\nimport clsx, { type ClassValue } from \"clsx\";\n\ninterface FieldComponentProps {\n  className?: ClassValue;\n  isRequired?: boolean;\n  isDisabled?: boolean;\n}\n\nexport interface UseFieldComponent {\n  FieldErrorCaptureContext: FC<PropsWithChildren>;\n  FieldErrorView: FC;\n  fieldPropsContext: PropsContext;\n  fieldProps: {\n    className?: ReturnType<typeof clsx>;\n  };\n}\n\nexport const useFieldComponent = (\n  props: FieldComponentProps,\n): UseFieldComponent => {\n  const { FieldErrorView, FieldErrorCaptureContext } = useFieldError();\n\n  // setting up the props context for all components that\n  // are part of a form control\n  const fieldPropsContext: PropsContext = {\n    Label: {\n      className: formFieldStyles.label,\n      optional: !props.isRequired,\n      isDisabled: !!props.isDisabled,\n    },\n    FieldDescription: {\n      className: formFieldStyles.fieldDescription,\n    },\n  };\n\n  return {\n    FieldErrorView,\n    FieldErrorCaptureContext,\n    fieldPropsContext,\n    fieldProps: {\n      className: clsx(formFieldStyles.formField),\n    },\n  } as const;\n};\n"],"names":[],"mappings":";;;;;;AAqBO,MAAM,iBAAA,GAAoB,CAC/B,KAAA,KACsB;AACtB,EAAA,MAAM,EAAE,cAAA,EAAgB,wBAAA,EAAyB,GAAI,aAAA,EAAc;AAInE,EAAA,MAAM,iBAAA,GAAkC;AAAA,IACtC,KAAA,EAAO;AAAA,MACL,WAAW,eAAA,CAAgB,KAAA;AAAA,MAC3B,QAAA,EAAU,CAAC,KAAA,CAAM,UAAA;AAAA,MACjB,UAAA,EAAY,CAAC,CAAC,KAAA,CAAM;AAAA,KACtB;AAAA,IACA,gBAAA,EAAkB;AAAA,MAChB,WAAW,eAAA,CAAgB;AAAA;AAC7B,GACF;AAEA,EAAA,OAAO;AAAA,IACL,cAAA;AAAA,IACA,wBAAA;AAAA,IACA,iBAAA;AAAA,IACA,UAAA,EAAY;AAAA,MACV,SAAA,EAAW,IAAA,CAAK,eAAA,CAAgB,SAAS;AAAA;AAC3C,GACF;AACF;;;;"}
+{"version":3,"file":"useFieldComponent.mjs","sources":["../../../../../../../src/lib/hooks/useFieldComponent.tsx"],"sourcesContent":["import type { FC, PropsWithChildren } from \"react\";\nimport { type PropsContext } from \"@/lib/propsContext\";\nimport formFieldStyles from \"@/components/FormField/FormField.module.scss\";\nimport { useFieldError } from \"@/lib/hooks/useFieldError\";\nimport clsx, { type ClassValue } from \"clsx\";\nimport type { FlowComponentName } from \"@/components/propTypes\";\n\ninterface FieldComponentProps {\n  className?: ClassValue;\n  isRequired?: boolean;\n  isDisabled?: boolean;\n}\n\nexport interface UseFieldComponent {\n  FieldErrorCaptureContext: FC<PropsWithChildren>;\n  FieldErrorView: FC;\n  fieldPropsContext: PropsContext;\n  fieldProps: {\n    className?: ReturnType<typeof clsx>;\n  };\n}\n\nexport const useFieldComponent = (\n  props: FieldComponentProps,\n  component: FlowComponentName,\n): UseFieldComponent => {\n  const { FieldErrorView, FieldErrorCaptureContext } = useFieldError({\n    component,\n  });\n\n  // setting up the props context for all components that\n  // are part of a form control\n  const fieldPropsContext: PropsContext = {\n    Label: {\n      className: formFieldStyles.label,\n      optional: !props.isRequired,\n      isDisabled: !!props.isDisabled,\n    },\n    FieldDescription: {\n      className: formFieldStyles.fieldDescription,\n    },\n  };\n\n  return {\n    FieldErrorView,\n    FieldErrorCaptureContext,\n    fieldPropsContext,\n    fieldProps: {\n      className: clsx(formFieldStyles.formField),\n    },\n  } as const;\n};\n"],"names":[],"mappings":";;;;;;AAsBO,MAAM,iBAAA,GAAoB,CAC/B,KAAA,EACA,SAAA,KACsB;AACtB,EAAA,MAAM,EAAE,cAAA,EAAgB,wBAAA,EAAyB,GAAI,aAAA,CAAc;AAAA,IACjE;AAAA,GACD,CAAA;AAID,EAAA,MAAM,iBAAA,GAAkC;AAAA,IACtC,KAAA,EAAO;AAAA,MACL,WAAW,eAAA,CAAgB,KAAA;AAAA,MAC3B,QAAA,EAAU,CAAC,KAAA,CAAM,UAAA;AAAA,MACjB,UAAA,EAAY,CAAC,CAAC,KAAA,CAAM;AAAA,KACtB;AAAA,IACA,gBAAA,EAAkB;AAAA,MAChB,WAAW,eAAA,CAAgB;AAAA;AAC7B,GACF;AAEA,EAAA,OAAO;AAAA,IACL,cAAA;AAAA,IACA,wBAAA;AAAA,IACA,iBAAA;AAAA,IACA,UAAA,EAAY;AAAA,MACV,SAAA,EAAW,IAAA,CAAK,eAAA,CAAgB,SAAS;AAAA;AAC3C,GACF;AACF;;;;"}

package/dist/js/packages/components/src/lib/hooks/useFieldError.mjs

@@ -5,17 +5,17 @@ import React, { useId, useMemo } from 'react';
 import '../propsContext/propsContext.mjs';
 import { PropsContextProvider } from '../propsContext/components/PropsContextProvider.mjs';
 import formFieldStyles from '../../components/FormField/FormField.module.scss.mjs';
-import { TunnelExit } from '@mittwald/react-tunnel';
 import { ClearPropsContext } from '../propsContext/components/ClearPropsContext.mjs';
 import { useProps } from './useProps.mjs';
+import { UiComponentTunnelExit } from '../../components/UiComponentTunnel/UiComponentTunnelExit.mjs';
 
-const useFieldError = (tunnelIdFromProps) => {
+const useFieldError = (options) => {
   const id = useId();
-  const currentTunnelId = useProps("FieldError", {}).tunnelId;
-  const tunnelId = currentTunnelId ?? `${id}.fieldError`;
+  const currentTunnelId = useProps("FieldError", {}).tunnel?.id;
+  const tunnelId = options.tunnelId ?? currentTunnelId ?? `${id}.fieldError`;
   const fieldErrorCapturePropsContext = {
     FieldError: {
-      tunnelId,
+      tunnel: { id: tunnelId, component: options.component },
       className: formFieldStyles.fieldError
     }
   };
@@ -36,7 +36,7 @@ const useFieldError = (tunnelIdFromProps) => {
     if (currentTunnelId) {
       return null;
     }
-    return /* @__PURE__ */ jsx(TunnelExit, { id: tunnelId, children: (children) => {
+    return /* @__PURE__ */ jsx(UiComponentTunnelExit, { id: tunnelId, component: options.component, children: (children) => {
       const childrenArray = React.Children.toArray(children);
       return /* @__PURE__ */ jsx(ClearPropsContext, { children: childrenArray[0] });
     } });

package/dist/js/packages/components/src/lib/hooks/useFieldError.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"useFieldError.mjs","sources":["../../../../../../../src/lib/hooks/useFieldError.tsx"],"sourcesContent":["import React, { type FC, type PropsWithChildren, useId, useMemo } from \"react\";\nimport { type PropsContext, PropsContextProvider } from \"@/lib/propsContext\";\nimport formFieldStyles from \"@/components/FormField/FormField.module.scss\";\nimport { TunnelExit } from \"@mittwald/react-tunnel\";\nimport ClearPropsContext from \"@/lib/propsContext/components/ClearPropsContext\";\nimport { useProps } from \"@/lib/hooks/useProps\";\n\nexport const useFieldError = (tunnelIdFromProps?: string) => {\n  const id = useId();\n  const currentTunnelId = useProps(\"FieldError\", {}).tunnelId;\n  const tunnelId = tunnelIdFromProps ?? currentTunnelId ?? `${id}.fieldError`;\n\n  const fieldErrorCapturePropsContext: PropsContext = {\n    FieldError: {\n      tunnelId,\n      className: formFieldStyles.fieldError,\n    },\n  };\n\n  const FieldErrorCaptureContext: FC<PropsWithChildren> = useMemo(\n    () => (props) => {\n      return (\n        <PropsContextProvider\n          props={fieldErrorCapturePropsContext}\n          dependencies={[tunnelId]}\n        >\n          {props.children}\n        </PropsContextProvider>\n      );\n    },\n    [tunnelId],\n  );\n\n  const FieldErrorView = () => {\n    if (currentTunnelId) {\n      return null;\n    }\n\n    return (\n      <TunnelExit id={tunnelId}>\n        {(children) => {\n          const childrenArray = React.Children.toArray(children);\n          return <ClearPropsContext>{childrenArray[0]}</ClearPropsContext>;\n        }}\n      </TunnelExit>\n    );\n  };\n\n  return {\n    FieldErrorCaptureContext,\n    FieldErrorView,\n  } as const;\n};\n"],"names":[],"mappings":";;;;;;;;;AAOO,MAAM,aAAA,GAAgB,CAAC,iBAAA,KAA+B;AAC3D,EAAA,MAAM,KAAK,KAAA,EAAM;AACjB,EAAA,MAAM,eAAA,GAAkB,QAAA,CAAS,YAAA,EAAc,EAAE,CAAA,CAAE,QAAA;AACnD,EAAA,MAAM,QAAA,GAAgC,eAAA,IAAmB,CAAA,EAAG,EAAE,CAAA,WAAA,CAAA;AAE9D,EAAA,MAAM,6BAAA,GAA8C;AAAA,IAClD,UAAA,EAAY;AAAA,MACV,QAAA;AAAA,MACA,WAAW,eAAA,CAAgB;AAAA;AAC7B,GACF;AAEA,EAAA,MAAM,wBAAA,GAAkD,OAAA;AAAA,IACtD,MAAM,CAAC,KAAA,KAAU;AACf,MAAA,uBACE,GAAA;AAAA,QAAC,oBAAA;AAAA,QAAA;AAAA,UACC,KAAA,EAAO,6BAAA;AAAA,UACP,YAAA,EAAc,CAAC,QAAQ,CAAA;AAAA,UAEtB,QAAA,EAAA,KAAA,CAAM;AAAA;AAAA,OACT;AAAA,IAEJ,CAAA;AAAA,IACA,CAAC,QAAQ;AAAA,GACX;AAEA,EAAA,MAAM,iBAAiB,MAAM;AAC3B,IAAA,IAAI,eAAA,EAAiB;AACnB,MAAA,OAAO,IAAA;AAAA,IACT;AAEA,IAAA,uBACE,GAAA,CAAC,UAAA,EAAA,EAAW,EAAA,EAAI,QAAA,EACb,WAAC,QAAA,KAAa;AACb,MAAA,MAAM,aAAA,GAAgB,KAAA,CAAM,QAAA,CAAS,OAAA,CAAQ,QAAQ,CAAA;AACrD,MAAA,uBAAO,GAAA,CAAC,iBAAA,EAAA,EAAmB,QAAA,EAAA,aAAA,CAAc,CAAC,CAAA,EAAE,CAAA;AAAA,IAC9C,CAAA,EACF,CAAA;AAAA,EAEJ,CAAA;AAEA,EAAA,OAAO;AAAA,IACL,wBAAA;AAAA,IACA;AAAA,GACF;AACF;;;;"}
+{"version":3,"file":"useFieldError.mjs","sources":["../../../../../../../src/lib/hooks/useFieldError.tsx"],"sourcesContent":["import React, { type FC, type PropsWithChildren, useId, useMemo } from \"react\";\nimport { type PropsContext, PropsContextProvider } from \"@/lib/propsContext\";\nimport formFieldStyles from \"@/components/FormField/FormField.module.scss\";\nimport ClearPropsContext from \"@/lib/propsContext/components/ClearPropsContext\";\nimport { useProps } from \"@/lib/hooks/useProps\";\nimport { UiComponentTunnelExit } from \"@/components/UiComponentTunnel/UiComponentTunnelExit\";\nimport type { FlowComponentName } from \"@/components/propTypes\";\n\nexport interface UseFieldErrorOptions {\n  tunnelId?: string;\n  component: FlowComponentName;\n}\n\nexport const useFieldError = (options: UseFieldErrorOptions) => {\n  const id = useId();\n  const currentTunnelId = useProps(\"FieldError\", {}).tunnel?.id;\n  const tunnelId = options.tunnelId ?? currentTunnelId ?? `${id}.fieldError`;\n\n  const fieldErrorCapturePropsContext: PropsContext = {\n    FieldError: {\n      tunnel: { id: tunnelId, component: options.component },\n      className: formFieldStyles.fieldError,\n    },\n  };\n\n  const FieldErrorCaptureContext: FC<PropsWithChildren> = useMemo(\n    () => (props) => {\n      return (\n        <PropsContextProvider\n          props={fieldErrorCapturePropsContext}\n          dependencies={[tunnelId]}\n        >\n          {props.children}\n        </PropsContextProvider>\n      );\n    },\n    [tunnelId],\n  );\n\n  const FieldErrorView = () => {\n    if (currentTunnelId) {\n      return null;\n    }\n\n    return (\n      <UiComponentTunnelExit id={tunnelId} component={options.component}>\n        {(children) => {\n          const childrenArray = React.Children.toArray(children);\n          return <ClearPropsContext>{childrenArray[0]}</ClearPropsContext>;\n        }}\n      </UiComponentTunnelExit>\n    );\n  };\n\n  return {\n    FieldErrorCaptureContext,\n    FieldErrorView,\n  } as const;\n};\n"],"names":[],"mappings":";;;;;;;;;AAaO,MAAM,aAAA,GAAgB,CAAC,OAAA,KAAkC;AAC9D,EAAA,MAAM,KAAK,KAAA,EAAM;AACjB,EAAA,MAAM,kBAAkB,QAAA,CAAS,YAAA,EAAc,EAAE,EAAE,MAAA,EAAQ,EAAA;AAC3D,EAAA,MAAM,QAAA,GAAW,OAAA,CAAQ,QAAA,IAAY,eAAA,IAAmB,GAAG,EAAE,CAAA,WAAA,CAAA;AAE7D,EAAA,MAAM,6BAAA,GAA8C;AAAA,IAClD,UAAA,EAAY;AAAA,MACV,QAAQ,EAAE,EAAA,EAAI,QAAA,EAAU,SAAA,EAAW,QAAQ,SAAA,EAAU;AAAA,MACrD,WAAW,eAAA,CAAgB;AAAA;AAC7B,GACF;AAEA,EAAA,MAAM,wBAAA,GAAkD,OAAA;AAAA,IACtD,MAAM,CAAC,KAAA,KAAU;AACf,MAAA,uBACE,GAAA;AAAA,QAAC,oBAAA;AAAA,QAAA;AAAA,UACC,KAAA,EAAO,6BAAA;AAAA,UACP,YAAA,EAAc,CAAC,QAAQ,CAAA;AAAA,UAEtB,QAAA,EAAA,KAAA,CAAM;AAAA;AAAA,OACT;AAAA,IAEJ,CAAA;AAAA,IACA,CAAC,QAAQ;AAAA,GACX;AAEA,EAAA,MAAM,iBAAiB,MAAM;AAC3B,IAAA,IAAI,eAAA,EAAiB;AACnB,MAAA,OAAO,IAAA;AAAA,IACT;AAEA,IAAA,uBACE,GAAA,CAAC,yBAAsB,EAAA,EAAI,QAAA,EAAU,WAAW,OAAA,CAAQ,SAAA,EACrD,WAAC,QAAA,KAAa;AACb,MAAA,MAAM,aAAA,GAAgB,KAAA,CAAM,QAAA,CAAS,OAAA,CAAQ,QAAQ,CAAA;AACrD,MAAA,uBAAO,GAAA,CAAC,iBAAA,EAAA,EAAmB,QAAA,EAAA,aAAA,CAAc,CAAC,CAAA,EAAE,CAAA;AAAA,IAC9C,CAAA,EACF,CAAA;AAAA,EAEJ,CAAA;AAEA,EAAA,OAAO;AAAA,IACL,wBAAA;AAAA,IACA;AAAA,GACF;AACF;;;;"}

package/dist/js/packages/components/src/lib/types/props.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"props.mjs","sources":["../../../../../../../src/lib/types/props.ts"],"sourcesContent":["import type { ExoticComponent, HTMLAttributes } from \"react\";\n\nexport const statusTypes = [\n  \"info\",\n  \"success\",\n  \"warning\",\n  \"danger\",\n  \"unavailable\",\n] as const;\n\nexport type Status = (typeof statusTypes)[number];\n\nexport type PropsWithStatus<T extends Status = Status, P = unknown> = P & {\n  /** The elements status */\n  status?: T;\n};\n\nexport interface PropsWithTunnel {\n  /** @internal */\n  tunnelId?: string | null;\n}\n\nexport interface PropsWithClassName {\n  /** The elements class name. */\n  className?: string;\n}\n\nexport type PropsWithElementType<\n  T extends keyof HTMLElementTagNameMap = never,\n> = HTMLAttributes<HTMLElement> & {\n  elementType?: T | ExoticComponent;\n};\n\nexport type ContainerBreakpointSize = \"xs\" | \"s\" | \"m\" | \"l\" | \"xl\";\n\nexport interface PropsWithContainerBreakpointSize {\n  containerBreakpointSize?: ContainerBreakpointSize;\n}\n\nexport const alphaColors = [\n  \"dark\",\n  \"light\",\n  \"dark-static\",\n  \"light-static\",\n] as const;\n\nexport type AlphaColor = (typeof alphaColors)[number];\n\nexport function isAlphaColor(color: string): color is AlphaColor {\n  return alphaColors.includes(color as AlphaColor);\n}\n"],"names":[],"mappings":"AAEO,MAAM,WAAA,GAAc;AAAA,EACzB,MAAA;AAAA,EACA,SAAA;AAAA,EACA,SAAA;AAAA,EACA,QAAA;AAAA,EACA;AACF;AA+BO,MAAM,WAAA,GAAc;AAAA,EACzB,MAAA;AAAA,EACA,OAAA;AAAA,EACA,aAAA;AAAA,EACA;AACF;AAIO,SAAS,aAAa,KAAA,EAAoC;AAC/D,EAAA,OAAO,WAAA,CAAY,SAAS,KAAmB,CAAA;AACjD;;;;"}
+{"version":3,"file":"props.mjs","sources":["../../../../../../../src/lib/types/props.ts"],"sourcesContent":["import type { FlowComponentName } from \"@/components/propTypes\";\nimport type { ExoticComponent, HTMLAttributes } from \"react\";\n\nexport const statusTypes = [\n  \"info\",\n  \"success\",\n  \"warning\",\n  \"danger\",\n  \"unavailable\",\n] as const;\n\nexport type Status = (typeof statusTypes)[number];\n\nexport type PropsWithStatus<T extends Status = Status, P = unknown> = P & {\n  /** The elements status */\n  status?: T;\n};\n\nexport interface PropsWithTunnel {\n  /** @internal */\n  tunnel?: {\n    id: string;\n    component: FlowComponentName;\n  } | null;\n}\n\nexport interface PropsWithClassName {\n  /** The elements class name. */\n  className?: string;\n}\n\nexport type PropsWithElementType<\n  T extends keyof HTMLElementTagNameMap = never,\n> = HTMLAttributes<HTMLElement> & {\n  elementType?: T | ExoticComponent;\n};\n\nexport type ContainerBreakpointSize = \"xs\" | \"s\" | \"m\" | \"l\" | \"xl\";\n\nexport interface PropsWithContainerBreakpointSize {\n  containerBreakpointSize?: ContainerBreakpointSize;\n}\n\nexport const alphaColors = [\n  \"dark\",\n  \"light\",\n  \"dark-static\",\n  \"light-static\",\n] as const;\n\nexport type AlphaColor = (typeof alphaColors)[number];\n\nexport function isAlphaColor(color: string): color is AlphaColor {\n  return alphaColors.includes(color as AlphaColor);\n}\n"],"names":[],"mappings":"AAGO,MAAM,WAAA,GAAc;AAAA,EACzB,MAAA;AAAA,EACA,SAAA;AAAA,EACA,SAAA;AAAA,EACA,QAAA;AAAA,EACA;AACF;AAkCO,MAAM,WAAA,GAAc;AAAA,EACzB,MAAA;AAAA,EACA,OAAA;AAAA,EACA,aAAA;AAAA,EACA;AACF;AAIO,SAAS,aAAa,KAAA,EAAoC;AAC/D,EAAA,OAAO,WAAA,CAAY,SAAS,KAAmB,CAAA;AACjD;;;;"}

package/dist/types/components/Accordion/Accordion.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Accordion.d.ts","sourceRoot":"","sources":["../../../../src/components/Accordion/Accordion.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,EAAE,EAAE,iBAAiB,EAAa,MAAM,OAAO,CAAC;AAW9E,MAAM,WAAW,cAAe,SAAQ,iBAAiB,CACvD,cAAc,CAAC,KAAK,CAAC,CACtB;IACC,0DAA0D;IAC1D,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,8DAA8D;IAC9D,OAAO,CAAC,EAAE,SAAS,GAAG,SAAS,CAAC;CACjC;AAED,wBAAwB;AACxB,eAAO,MAAM,SAAS,EAAE,EAAE,CAAC,cAAc,CAuExC,CAAC;AAEF,eAAe,SAAS,CAAC"}
+{"version":3,"file":"Accordion.d.ts","sourceRoot":"","sources":["../../../../src/components/Accordion/Accordion.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,EAAE,EAAE,iBAAiB,EAAa,MAAM,OAAO,CAAC;AAY9E,MAAM,WAAW,cAAe,SAAQ,iBAAiB,CACvD,cAAc,CAAC,KAAK,CAAC,CACtB;IACC,0DAA0D;IAC1D,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,8DAA8D;IAC9D,OAAO,CAAC,EAAE,SAAS,GAAG,SAAS,CAAC;CACjC;AAED,wBAAwB;AACxB,eAAO,MAAM,SAAS,EAAE,EAAE,CAAC,cAAc,CA8ExC,CAAC;AAEF,eAAe,SAAS,CAAC"}

package/dist/types/components/ActionGroup/ActionGroup.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ActionGroup.d.ts","sourceRoot":"","sources":["../../../../src/components/ActionGroup/ActionGroup.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAK/C,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,sCAAsC,CAAC;AAE/E,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,mBAAmB,CAAC;AAK5D,MAAM,WAAW,gBACf,SACE,iBAAiB,EACjB,kBAAkB,CAAC,cAAc,CAAC,EAClC,kBAAkB;IACpB,4EAA4E;IAC5E,OAAO,CAAC,EAAE,GAAG,GAAG,GAAG,CAAC;CACrB;AAED,wBAAwB;AACxB,eAAO,MAAM,WAAW,qGAkDvB,CAAC;AAEF,eAAe,WAAW,CAAC"}
+{"version":3,"file":"ActionGroup.d.ts","sourceRoot":"","sources":["../../../../src/components/ActionGroup/ActionGroup.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAK/C,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,sCAAsC,CAAC;AAE/E,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,mBAAmB,CAAC;AAI5D,MAAM,WAAW,gBACf,SACE,iBAAiB,EACjB,kBAAkB,CAAC,cAAc,CAAC,EAClC,kBAAkB;IACpB,4EAA4E;IAC5E,OAAO,CAAC,EAAE,GAAG,GAAG,GAAG,CAAC;CACrB;AAED,wBAAwB;AACxB,eAAO,MAAM,WAAW,qGAgDvB,CAAC;AAEF,eAAe,WAAW,CAAC"}

package/dist/types/components/Autocomplete/Autocomplete.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Autocomplete.d.ts","sourceRoot":"","sources":["../../../../src/components/Autocomplete/Autocomplete.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAU,KAAK,iBAAiB,EAAE,MAAM,OAAO,CAAC;AACvD,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,mBAAmB,CAAC;AAE5D,OAAO,KAAK,IAAI,MAAM,uBAAuB,CAAC;AAE9C,OAAO,EAEL,KAAK,kBAAkB,EACxB,MAAM,sCAAsC,CAAC;AAkB9C,MAAM,WAAW,iBACf,SACE,iBAAiB,EACjB,kBAAkB,EAClB,kBAAkB,CAAC,gBAAgB,CAAC,EACpC,IAAI,CACF,IAAI,CAAC,iBAAiB,EACtB,UAAU,GAAG,eAAe,GAAG,YAAY,GAAG,mBAAmB,GAAG,KAAK,CAC1E;CAAG;AAER,wBAAwB;AACxB,eAAO,MAAM,YAAY,wGAqGvB,CAAC;AAEH,eAAe,YAAY,CAAC"}
+{"version":3,"file":"Autocomplete.d.ts","sourceRoot":"","sources":["../../../../src/components/Autocomplete/Autocomplete.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAU,KAAK,iBAAiB,EAAE,MAAM,OAAO,CAAC;AACvD,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,mBAAmB,CAAC;AAE5D,OAAO,KAAK,IAAI,MAAM,uBAAuB,CAAC;AAE9C,OAAO,EAEL,KAAK,kBAAkB,EACxB,MAAM,sCAAsC,CAAC;AAkB9C,MAAM,WAAW,iBACf,SACE,iBAAiB,EACjB,kBAAkB,EAClB,kBAAkB,CAAC,gBAAgB,CAAC,EACpC,IAAI,CACF,IAAI,CAAC,iBAAiB,EACtB,UAAU,GAAG,eAAe,GAAG,YAAY,GAAG,mBAAmB,GAAG,KAAK,CAC1E;CAAG;AAER,wBAAwB;AACxB,eAAO,MAAM,YAAY,wGA2GvB,CAAC;AAEH,eAAe,YAAY,CAAC"}

package/dist/types/components/CartesianChart/CartesianChart.d.ts

@@ -1,12 +1,10 @@
 import { ComposedChart } from 'recharts';
 import { default as React, ComponentProps, ComponentType, FC, PropsWithChildren, ReactNode } from 'react';
+import { ChartDataValue, DataKeyProp } from './types';
 /** @deprecated Use a ReactNode instead */
 export interface CartesianChartEmptyViewProps {
     data?: ComponentProps<typeof ComposedChart>["data"];
 }
-export type ChartDataValue = Record<string, unknown>;
-export type DataKey<TData> = keyof TData | (() => keyof TData) | number;
-export type DataKeyValue<TData, TDataKey extends DataKey<TData>> = TDataKey extends keyof TData ? TData[TDataKey] : TDataKey extends () => infer K ? K extends keyof TData ? TData[K] : TData[keyof TData] : TData[keyof TData];
 export interface CartesianChartProps<TData = ChartDataValue> extends Pick<ComponentProps<typeof ComposedChart>, "className" | "syncId" | "syncMethod">, PropsWithChildren {
     data?: TData[];
     height?: string;
@@ -20,14 +18,14 @@ export interface CartesianChartProps<TData = ChartDataValue> extends Pick<Compon
 }
 /** @flr-generate all */
 export declare const CartesianChart: FC<CartesianChartProps>;
-export declare const typedCartesianChart: <TData = ChartDataValue>() => {
+export declare const typedCartesianChart: <TData extends ChartDataValue<any> = ChartDataValue<any>, XAxisDataKey extends DataKeyProp<TData> = DataKeyProp<TData>>() => {
     Chart: ComponentType<CartesianChartProps<TData>>;
-    Area: React.ComponentType<import('./components/Area').AreaProps<TData>>;
-    XAxis: <const TProp extends DataKey<TData>, TMatcherValue = DataKeyValue<TData, TProp>>(props: import('./components/XAxis').XAxisProps<TData, TProp, TMatcherValue>) => ReactNode;
-    YAxis: <const TProp extends DataKey<TData>, TMatcherValue_1 = DataKeyValue<TData, TProp>>(props: import('./components/YAxis').YAxisProps<TData, TProp, TMatcherValue_1>) => ReactNode;
+    Area: React.ComponentType<import('./components/Area').AreaPropsByDataKeyProp<TData>>;
+    XAxis: <const TProp extends XAxisDataKey, XAxisDataKeyValue = import('./types').DataKeyValue<TData, TProp>>(props: import('./components/XAxis').XAxisProps<TData, TProp, XAxisDataKeyValue>) => ReactNode;
+    YAxis: <const TProp extends keyof TData, TMatcherValue = import('./types').DataKeyValue<TData, TProp>>(props: import('./components/YAxis').YAxisProps<TData, TProp, TMatcherValue>) => ReactNode;
     Grid: React.ComponentType<import('./components/ChartGrid').ChartGridProps>;
     Legend: React.ComponentType<import('./components/ChartLegend').ChartLegendProps>;
-    Tooltip: React.ComponentType<import('./components/ChartTooltip').ChartTooltipProps<TData>>;
+    Tooltip: React.ComponentType<import('./components/ChartTooltip').ChartTooltipProps<TData, XAxisDataKey>>;
     Line: React.ComponentType<import('./components/Line').LineProps<TData>>;
 };
 export default CartesianChart;

package/dist/types/components/CartesianChart/CartesianChart.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CartesianChart.d.ts","sourceRoot":"","sources":["../../../../src/components/CartesianChart/CartesianChart.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAuB,MAAM,UAAU,CAAC;AAC9D,OAAO,KAAK,EAAE,EACZ,KAAK,cAAc,EACnB,KAAK,aAAa,EAClB,KAAK,EAAE,EAEP,KAAK,iBAAiB,EACtB,KAAK,SAAS,EAEf,MAAM,OAAO,CAAC;AAef,0CAA0C;AAC1C,MAAM,WAAW,4BAA4B;IAC3C,IAAI,CAAC,EAAE,cAAc,CAAC,OAAO,aAAa,CAAC,CAAC,MAAM,CAAC,CAAC;CACrD;AAED,MAAM,MAAM,cAAc,GAAG,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;AACrD,MAAM,MAAM,OAAO,CAAC,KAAK,IAAI,MAAM,KAAK,GAAG,CAAC,MAAM,MAAM,KAAK,CAAC,GAAG,MAAM,CAAC;AACxE,MAAM,MAAM,YAAY,CACtB,KAAK,EACL,QAAQ,SAAS,OAAO,CAAC,KAAK,CAAC,IAC7B,QAAQ,SAAS,MAAM,KAAK,GAC5B,KAAK,CAAC,QAAQ,CAAC,GACf,QAAQ,SAAS,MAAM,MAAM,CAAC,GAC5B,CAAC,SAAS,MAAM,KAAK,GACnB,KAAK,CAAC,CAAC,CAAC,GACR,KAAK,CAAC,MAAM,KAAK,CAAC,GACpB,KAAK,CAAC,MAAM,KAAK,CAAC,CAAC;AAEzB,MAAM,WAAW,mBAAmB,CAAC,KAAK,GAAG,cAAc,CACzD,SACE,IAAI,CACF,cAAc,CAAC,OAAO,aAAa,CAAC,EACpC,WAAW,GAAG,QAAQ,GAAG,YAAY,CACtC,EACD,iBAAiB;IACnB,IAAI,CAAC,EAAE,KAAK,EAAE,CAAC;IAEf,MAAM,CAAC,EAAE,MAAM,CAAC;IAEhB,yDAAyD;IACzD,SAAS,CAAC,EAAE,SAAS,CAAC;IAEtB;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,wBAAwB;AACxB,eAAO,MAAM,cAAc,EAAE,EAAE,CAAC,mBAAmB,CAuDlD,CAAC;AAEF,eAAO,MAAM,mBAAmB,GAAI,KAAK,GAAG,cAAc;WAC/B,aAAa,CAAC,mBAAmB,CAAC,KAAK,CAAC,CAAC;;;;;;;;CAQlE,CAAC;AAEH,eAAe,cAAc,CAAC"}
+{"version":3,"file":"CartesianChart.d.ts","sourceRoot":"","sources":["../../../../src/components/CartesianChart/CartesianChart.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAuB,MAAM,UAAU,CAAC;AAC9D,OAAO,KAAK,EAAE,EACZ,KAAK,cAAc,EACnB,KAAK,aAAa,EAClB,KAAK,EAAE,EAEP,KAAK,iBAAiB,EACtB,KAAK,SAAS,EAEf,MAAM,OAAO,CAAC;AAMf,OAAO,KAAK,EACV,cAAc,EACd,WAAW,EACZ,MAAM,mCAAmC,CAAC;AAS3C,0CAA0C;AAC1C,MAAM,WAAW,4BAA4B;IAC3C,IAAI,CAAC,EAAE,cAAc,CAAC,OAAO,aAAa,CAAC,CAAC,MAAM,CAAC,CAAC;CACrD;AAED,MAAM,WAAW,mBAAmB,CAAC,KAAK,GAAG,cAAc,CACzD,SACE,IAAI,CACF,cAAc,CAAC,OAAO,aAAa,CAAC,EACpC,WAAW,GAAG,QAAQ,GAAG,YAAY,CACtC,EACD,iBAAiB;IACnB,IAAI,CAAC,EAAE,KAAK,EAAE,CAAC;IAEf,MAAM,CAAC,EAAE,MAAM,CAAC;IAEhB,yDAAyD;IACzD,SAAS,CAAC,EAAE,SAAS,CAAC;IAEtB;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,wBAAwB;AACxB,eAAO,MAAM,cAAc,EAAE,EAAE,CAAC,mBAAmB,CAuDlD,CAAC;AAEF,eAAO,MAAM,mBAAmB,GAE9B,KAAK,SAAS,cAAc,CAAC,GAAG,CAAC,GAAG,cAAc,CAAC,GAAG,CAAC,EACvD,YAAY,SAAS,WAAW,CAAC,KAAK,CAAC,GAAG,WAAW,CAAC,KAAK,CAAC;WAEnC,aAAa,CAAC,mBAAmB,CAAC,KAAK,CAAC,CAAC;;;;;;;;CAQlE,CAAC;AAEH,eAAe,cAAc,CAAC"}

package/dist/types/components/CartesianChart/components/Area/Area.d.ts

@@ -1,14 +1,19 @@
 import { ComponentType, FC } from 'react';
 import { CategoricalWithCustomColor } from '../../../../lib/tokens/CategoricalColors';
-import { ChartDataValue, DataKey } from '../../CartesianChart';
+import { ChartDataValue, DataKeyProp, DataKeyWithLabel } from '../../types';
 import * as Recharts from "recharts";
-export interface AreaProps<TData = ChartDataValue> extends Pick<Recharts.AreaProps, "className" | "stackId" | "fillOpacity" | "key" | "xAxisId" | "yAxisId" | "type" | "unit"> {
-    dataKey: DataKey<TData>;
+type AreaBaseProps = Pick<Recharts.AreaProps, "className" | "stackId" | "fillOpacity" | "key" | "xAxisId" | "yAxisId" | "type" | "unit"> & {
     /** The color of the area. @default "sea-green" */
     color?: CategoricalWithCustomColor;
+};
+export interface AreaPropsByDataKeyProp<TData extends ChartDataValue = ChartDataValue> extends AreaBaseProps {
+    dataKey: DataKeyProp<TData>;
 }
+export interface AreaPropsByDataKey<TData extends ChartDataValue = ChartDataValue> extends AreaBaseProps, DataKeyWithLabel<TData> {
+}
+export type AreaProps<TData extends ChartDataValue = ChartDataValue> = AreaPropsByDataKey<TData> | AreaPropsByDataKeyProp<TData>;
 /** @flr-generate all */
 export declare const Area: FC<AreaProps>;
-export declare const TypedArea: <T = ChartDataValue>() => ComponentType<AreaProps<T>>;
+export declare const TypedArea: <TData extends ChartDataValue = ChartDataValue>() => ComponentType<AreaPropsByDataKeyProp<TData>>;
 export default Area;
 //# sourceMappingURL=Area.d.ts.map

package/dist/types/components/CartesianChart/components/Area/Area.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Area.d.ts","sourceRoot":"","sources":["../../../../../../src/components/CartesianChart/components/Area/Area.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,aAAa,EAAE,KAAK,EAAE,EAAE,MAAM,OAAO,CAAC;AACpD,OAAO,KAAK,QAAQ,MAAM,UAAU,CAAC;AAGrC,OAAO,KAAK,EAAE,0BAA0B,EAAE,MAAM,gCAAgC,CAAC;AAEjF,OAAO,KAAK,EACV,cAAc,EACd,OAAO,EACR,MAAM,4CAA4C,CAAC;AAEpD,MAAM,WAAW,SAAS,CAAC,KAAK,GAAG,cAAc,CAAE,SAAQ,IAAI,CAC7D,QAAQ,CAAC,SAAS,EAChB,WAAW,GACX,SAAS,GACT,aAAa,GACb,KAAK,GACL,SAAS,GACT,SAAS,GACT,MAAM,GACN,MAAM,CACT;IACC,OAAO,EAAE,OAAO,CAAC,KAAK,CAAC,CAAC;IACxB,kDAAkD;IAClD,KAAK,CAAC,EAAE,0BAA0B,CAAC;CACpC;AAED,wBAAwB;AACxB,eAAO,MAAM,IAAI,EAAE,EAAE,CAAC,SAAS,CAuB9B,CAAC;AAEF,eAAO,MAAM,SAAS,GAAI,CAAC,GAAG,cAAc,OAClC,aAAa,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,CAAC;AAEtC,eAAe,IAAI,CAAC"}
+{"version":3,"file":"Area.d.ts","sourceRoot":"","sources":["../../../../../../src/components/CartesianChart/components/Area/Area.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,aAAa,EAAE,KAAK,EAAE,EAAE,MAAM,OAAO,CAAC;AACpD,OAAO,KAAK,QAAQ,MAAM,UAAU,CAAC;AAGrC,OAAO,KAAK,EAAE,0BAA0B,EAAE,MAAM,gCAAgC,CAAC;AAEjF,OAAO,EACL,KAAK,cAAc,EACnB,KAAK,WAAW,EAChB,KAAK,gBAAgB,EAEtB,MAAM,mCAAmC,CAAC;AAE3C,KAAK,aAAa,GAAG,IAAI,CACvB,QAAQ,CAAC,SAAS,EAChB,WAAW,GACX,SAAS,GACT,aAAa,GACb,KAAK,GACL,SAAS,GACT,SAAS,GACT,MAAM,GACN,MAAM,CACT,GAAG;IACF,kDAAkD;IAClD,KAAK,CAAC,EAAE,0BAA0B,CAAC;CACpC,CAAC;AAEF,MAAM,WAAW,sBAAsB,CACrC,KAAK,SAAS,cAAc,GAAG,cAAc,CAC7C,SAAQ,aAAa;IACrB,OAAO,EAAE,WAAW,CAAC,KAAK,CAAC,CAAC;CAC7B;AAED,MAAM,WAAW,kBAAkB,CACjC,KAAK,SAAS,cAAc,GAAG,cAAc,CAE7C,SAAQ,aAAa,EAAE,gBAAgB,CAAC,KAAK,CAAC;CAAG;AAEnD,MAAM,MAAM,SAAS,CAAC,KAAK,SAAS,cAAc,GAAG,cAAc,IAC/D,kBAAkB,CAAC,KAAK,CAAC,GACzB,sBAAsB,CAAC,KAAK,CAAC,CAAC;AAElC,wBAAwB;AACxB,eAAO,MAAM,IAAI,EAAE,EAAE,CAAC,SAAS,CAwB9B,CAAC;AAEF,eAAO,MAAM,SAAS,GAAI,KAAK,SAAS,cAAc,GAAG,cAAc,OAC7D,aAAa,CAAC,sBAAsB,CAAC,KAAK,CAAC,CAAC,CAAC;AAEvD,eAAe,IAAI,CAAC"}

package/dist/types/components/CartesianChart/components/ChartLegend/ChartLegend.d.ts

@@ -1,6 +1,6 @@
 import { ComponentType, FC } from 'react';
 import * as Recharts from "recharts";
-export type ChartLegendFormatter = (text: string) => string;
+export type ChartLegendFormatter = (text: string, index: number) => string;
 export interface WithChartLegendFormatters {
     /**
      * A formatter function for the texts of the Legend. Can be used for purposes

package/dist/types/components/CartesianChart/components/ChartLegend/ChartLegend.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ChartLegend.d.ts","sourceRoot":"","sources":["../../../../../../src/components/CartesianChart/components/ChartLegend/ChartLegend.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAC/C,OAAO,KAAK,QAAQ,MAAM,UAAU,CAAC;AAGrC,MAAM,MAAM,oBAAoB,GAAG,CAAC,IAAI,EAAE,MAAM,KAAK,MAAM,CAAC;AAE5D,MAAM,WAAW,yBAAyB;IACxC;;;OAGG;IACH,SAAS,CAAC,EAAE,oBAAoB,CAAC;CAClC;AAED,MAAM,MAAM,gBAAgB,GAAG,IAAI,CACjC,QAAQ,CAAC,WAAW,EACpB,WAAW,GAAG,eAAe,CAC9B,GACC,yBAAyB,CAAC;AAE5B,wBAAwB;AACxB,eAAO,MAAM,WAAW,EAAE,EAAE,CAAC,gBAAgB,CAS5C,CAAC;AAEF,eAAO,MAAM,gBAAgB,QACZ,aAAa,CAAC,gBAAgB,CAAC,CAAC;AAEjD,eAAe,WAAW,CAAC"}
+{"version":3,"file":"ChartLegend.d.ts","sourceRoot":"","sources":["../../../../../../src/components/CartesianChart/components/ChartLegend/ChartLegend.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAC/C,OAAO,KAAK,QAAQ,MAAM,UAAU,CAAC;AAGrC,MAAM,MAAM,oBAAoB,GAAG,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;AAE3E,MAAM,WAAW,yBAAyB;IACxC;;;OAGG;IACH,SAAS,CAAC,EAAE,oBAAoB,CAAC;CAClC;AAED,MAAM,MAAM,gBAAgB,GAAG,IAAI,CACjC,QAAQ,CAAC,WAAW,EACpB,WAAW,GAAG,eAAe,CAC9B,GACC,yBAAyB,CAAC;AAE5B,wBAAwB;AACxB,eAAO,MAAM,WAAW,EAAE,EAAE,CAAC,gBAAgB,CAS5C,CAAC;AAEF,eAAO,MAAM,gBAAgB,QACZ,aAAa,CAAC,gBAAgB,CAAC,CAAC;AAEjD,eAAe,WAAW,CAAC"}

package/dist/types/components/CartesianChart/components/ChartLegend/LegendContent.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"LegendContent.d.ts","sourceRoot":"","sources":["../../../../../../src/components/CartesianChart/components/ChartLegend/LegendContent.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,+CAA+C,CAAC;AAC3E,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,eAAe,CAAC;AAC/D,OAAO,KAAK,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAGhC,KAAK,iBAAiB,GAAG,IAAI,CAAC,KAAK,EAAE,WAAW,CAAC,GAAG,yBAAyB,CAAC;AAE9E,QAAA,MAAM,aAAa,EAAE,EAAE,CAAC,iBAAiB,CA+BxC,CAAC;AAEF,eAAe,aAAa,CAAC"}
+{"version":3,"file":"LegendContent.d.ts","sourceRoot":"","sources":["../../../../../../src/components/CartesianChart/components/ChartLegend/LegendContent.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,+CAA+C,CAAC;AAC3E,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,eAAe,CAAC;AAC/D,OAAO,KAAK,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAKhC,KAAK,iBAAiB,GAAG,IAAI,CAAC,KAAK,EAAE,WAAW,CAAC,GAAG,yBAAyB,CAAC;AAE9E,QAAA,MAAM,aAAa,EAAE,EAAE,CAAC,iBAAiB,CAkCxC,CAAC;AAEF,eAAe,aAAa,CAAC"}

package/dist/types/components/CartesianChart/components/ChartTooltip/ChartTooltip.d.ts

@@ -1,34 +1,14 @@
-import { ComponentType, FC } from 'react';
+import { FC } from 'react';
 import { TooltipProps } from 'recharts';
 import { NameType, ValueType } from 'recharts/types/component/DefaultTooltipContent';
-import { TooltipPayloadItem } from './TooltipLegendItem';
-import { ChartDataValue } from '../../CartesianChart';
-export type TooltipLineFormatter<TData> = (value: TData[keyof TData], name: keyof TData, index: number, unit?: TooltipPayloadItem["unit"]) => Promise<string> | string;
-export type TooltipHeadingFormatter<TData> = (title: TData[keyof TData]) => Promise<string> | string;
-export type TooltipLProgressBarFormatter<TData> = (value: TData[keyof TData], unit?: TooltipPayloadItem["unit"]) => Promise<string> | string;
-export interface WithTooltipFormatters<TData> {
-    /**
-     * A formatter function for the lines in the tooltip. Can be used for purposes
-     * like translations.
-     */
-    formatter?: TooltipLineFormatter<TData>;
-    /**
-     * A formatter function for the heading of the tooltip. Can be used for
-     * purposes like translations.
-     */
-    headingFormatter?: TooltipHeadingFormatter<TData>;
-    /**
-     * A formatter function for the progressBar of the tooltip. Can be used for
-     * purposes like translations.
-     */
-    progressBarFormatter?: TooltipLProgressBarFormatter<TData>;
-}
-export interface ChartTooltipProps<TData = ChartDataValue> extends Pick<TooltipProps<ValueType, NameType>, "wrapperClassName" | "allowEscapeViewBox">, WithTooltipFormatters<TData> {
+import { ChartDataValue } from '../../types';
+import { WithTooltipFormatters } from './types';
+export { TypedChartTooltip } from './types';
+export interface ChartTooltipProps<TData extends ChartDataValue = ChartDataValue, XAxisDataKey extends keyof TData = keyof TData> extends Pick<TooltipProps<ValueType, NameType>, "wrapperClassName" | "allowEscapeViewBox">, WithTooltipFormatters<TData, XAxisDataKey> {
     /** Show progress bar for stacked areas @default "true" */
     showProgressBar?: boolean;
 }
 /** @flr-generate all */
 export declare const ChartTooltip: FC<ChartTooltipProps>;
-export declare const TypedChartTooltip: <T = ChartDataValue>() => ComponentType<ChartTooltipProps<T>>;
 export default ChartTooltip;
 //# sourceMappingURL=ChartTooltip.d.ts.map

package/dist/types/components/CartesianChart/components/ChartTooltip/ChartTooltip.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ChartTooltip.d.ts","sourceRoot":"","sources":["../../../../../../src/components/CartesianChart/components/ChartTooltip/ChartTooltip.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,KAAK,aAAa,EAAE,KAAK,EAAE,EAAY,MAAM,OAAO,CAAC;AACrE,OAAO,EAAW,KAAK,YAAY,EAAE,MAAM,UAAU,CAAC;AACtD,OAAO,KAAK,EACV,QAAQ,EACR,SAAS,EACV,MAAM,gDAAgD,CAAC;AACxD,OAAO,EAAE,KAAK,kBAAkB,EAAE,MAAM,uEAAuE,CAAC;AAKhH,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,4CAA4C,CAAC;AAEjF,MAAM,MAAM,oBAAoB,CAAC,KAAK,IAAI,CACxC,KAAK,EAAE,KAAK,CAAC,MAAM,KAAK,CAAC,EACzB,IAAI,EAAE,MAAM,KAAK,EACjB,KAAK,EAAE,MAAM,EACb,IAAI,CAAC,EAAE,kBAAkB,CAAC,MAAM,CAAC,KAC9B,OAAO,CAAC,MAAM,CAAC,GAAG,MAAM,CAAC;AAE9B,MAAM,MAAM,uBAAuB,CAAC,KAAK,IAAI,CAC3C,KAAK,EAAE,KAAK,CAAC,MAAM,KAAK,CAAC,KACtB,OAAO,CAAC,MAAM,CAAC,GAAG,MAAM,CAAC;AAE9B,MAAM,MAAM,4BAA4B,CAAC,KAAK,IAAI,CAChD,KAAK,EAAE,KAAK,CAAC,MAAM,KAAK,CAAC,EACzB,IAAI,CAAC,EAAE,kBAAkB,CAAC,MAAM,CAAC,KAC9B,OAAO,CAAC,MAAM,CAAC,GAAG,MAAM,CAAC;AAE9B,MAAM,WAAW,qBAAqB,CAAC,KAAK;IAC1C;;;OAGG;IACH,SAAS,CAAC,EAAE,oBAAoB,CAAC,KAAK,CAAC,CAAC;IACxC;;;OAGG;IACH,gBAAgB,CAAC,EAAE,uBAAuB,CAAC,KAAK,CAAC,CAAC;IAClD;;;OAGG;IACH,oBAAoB,CAAC,EAAE,4BAA4B,CAAC,KAAK,CAAC,CAAC;CAC5D;AAED,MAAM,WAAW,iBAAiB,CAAC,KAAK,GAAG,cAAc,CACvD,SACE,IAAI,CACF,YAAY,CAAC,SAAS,EAAE,QAAQ,CAAC,EACjC,kBAAkB,GAAG,oBAAoB,CAC1C,EACD,qBAAqB,CAAC,KAAK,CAAC;IAC9B,0DAA0D;IAC1D,eAAe,CAAC,EAAE,OAAO,CAAC;CAC3B;AAED,wBAAwB;AACxB,eAAO,MAAM,YAAY,EAAE,EAAE,CAAC,iBAAiB,CAiC9C,CAAC;AAEF,eAAO,MAAM,iBAAiB,GAAI,CAAC,GAAG,cAAc,OAClC,aAAa,CAAC,iBAAiB,CAAC,CAAC,CAAC,CAAC,CAAC;AAEtD,eAAe,YAAY,CAAC"}
+{"version":3,"file":"ChartTooltip.d.ts","sourceRoot":"","sources":["../../../../../../src/components/CartesianChart/components/ChartTooltip/ChartTooltip.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,KAAK,EAAE,EAAY,MAAM,OAAO,CAAC;AACjD,OAAO,EAAW,KAAK,YAAY,EAAE,MAAM,UAAU,CAAC;AACtD,OAAO,KAAK,EACV,QAAQ,EACR,SAAS,EACV,MAAM,gDAAgD,CAAC;AAKxD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,mCAAmC,CAAC;AACxE,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,2DAA2D,CAAC;AAEvG,OAAO,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAE5C,MAAM,WAAW,iBAAiB,CAChC,KAAK,SAAS,cAAc,GAAG,cAAc,EAC7C,YAAY,SAAS,MAAM,KAAK,GAAG,MAAM,KAAK,CAE9C,SACE,IAAI,CACF,YAAY,CAAC,SAAS,EAAE,QAAQ,CAAC,EACjC,kBAAkB,GAAG,oBAAoB,CAC1C,EACD,qBAAqB,CAAC,KAAK,EAAE,YAAY,CAAC;IAC5C,0DAA0D;IAC1D,eAAe,CAAC,EAAE,OAAO,CAAC;CAC3B;AAED,wBAAwB;AACxB,eAAO,MAAM,YAAY,EAAE,EAAE,CAAC,iBAAiB,CAiC9C,CAAC;AAEF,eAAe,YAAY,CAAC"}

package/dist/types/components/CartesianChart/components/ChartTooltip/TooltipContent.d.ts

@@ -1,8 +1,8 @@
 import { TooltipContentProps as RechartTooltipContentProps } from 'recharts';
 import { NameType, ValueType } from 'recharts/types/component/DefaultTooltipContent';
 import { WithTooltipFormatters } from '../..';
-import { ChartDataValue } from '../../CartesianChart';
-export interface TooltipContentProps<TData = ChartDataValue> extends WithTooltipFormatters<TData>, Omit<RechartTooltipContentProps<ValueType, NameType>, "formatter"> {
+import { ChartDataValue } from '../../types';
+export interface TooltipContentProps<TData extends ChartDataValue = ChartDataValue, TTooltipLabelValue extends keyof TData = keyof TData> extends WithTooltipFormatters<TData, TTooltipLabelValue>, Omit<RechartTooltipContentProps<ValueType, NameType>, "formatter"> {
     showProgressBar?: boolean;
 }
 //# sourceMappingURL=TooltipContent.d.ts.map

package/dist/types/components/CartesianChart/components/ChartTooltip/TooltipContent.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TooltipContent.d.ts","sourceRoot":"","sources":["../../../../../../src/components/CartesianChart/components/ChartTooltip/TooltipContent.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,mBAAmB,IAAI,0BAA0B,EAAE,MAAM,UAAU,CAAC;AAClF,OAAO,KAAK,EACV,QAAQ,EACR,SAAS,EACV,MAAM,gDAAgD,CAAC;AAGxD,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,6BAA6B,CAAC;AAKzE,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,4CAA4C,CAAC;AAEjF,MAAM,WAAW,mBAAmB,CAAC,KAAK,GAAG,cAAc,CACzD,SACE,qBAAqB,CAAC,KAAK,CAAC,EAC5B,IAAI,CAAC,0BAA0B,CAAC,SAAS,EAAE,QAAQ,CAAC,EAAE,WAAW,CAAC;IACpE,eAAe,CAAC,EAAE,OAAO,CAAC;CAC3B"}
+{"version":3,"file":"TooltipContent.d.ts","sourceRoot":"","sources":["../../../../../../src/components/CartesianChart/components/ChartTooltip/TooltipContent.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,mBAAmB,IAAI,0BAA0B,EAAE,MAAM,UAAU,CAAC;AAClF,OAAO,KAAK,EACV,QAAQ,EACR,SAAS,EACV,MAAM,gDAAgD,CAAC;AAGxD,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,6BAA6B,CAAC;AAMzE,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,mCAAmC,CAAC;AAExE,MAAM,WAAW,mBAAmB,CAClC,KAAK,SAAS,cAAc,GAAG,cAAc,EAC7C,kBAAkB,SAAS,MAAM,KAAK,GAAG,MAAM,KAAK,CAEpD,SACE,qBAAqB,CAAC,KAAK,EAAE,kBAAkB,CAAC,EAChD,IAAI,CAAC,0BAA0B,CAAC,SAAS,EAAE,QAAQ,CAAC,EAAE,WAAW,CAAC;IACpE,eAAe,CAAC,EAAE,OAAO,CAAC;CAC3B"}

package/dist/types/components/CartesianChart/components/ChartTooltip/TooltipProgressBar.d.ts

@@ -1,8 +1,8 @@
 import { FC } from 'react';
 import { TooltipPayloadItem } from './TooltipLegendItem';
 import { WithTooltipFormatters } from '../..';
-import { ChartDataValue } from '../../CartesianChart';
-interface TooltipProgressBarProps<TData = ChartDataValue> extends Pick<WithTooltipFormatters<TData>, "progressBarFormatter"> {
+import { ChartDataValue } from '../../types';
+interface TooltipProgressBarProps<TData extends ChartDataValue = ChartDataValue, TTooltipLabelValue extends keyof TData = keyof TData> extends Pick<WithTooltipFormatters<TData, TTooltipLabelValue>, "progressBarFormatter"> {
     items: TooltipPayloadItem[];
 }
 export declare const TooltipProgressBar: FC<TooltipProgressBarProps>;

package/dist/types/components/CartesianChart/components/ChartTooltip/TooltipProgressBar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TooltipProgressBar.d.ts","sourceRoot":"","sources":["../../../../../../src/components/CartesianChart/components/ChartTooltip/TooltipProgressBar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAGhC,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,uEAAuE,CAAC;AAGhH,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,6BAA6B,CAAC;AAEzE,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,4CAA4C,CAAC;AAGjF,UAAU,uBAAuB,CAAC,KAAK,GAAG,cAAc,CAAE,SAAQ,IAAI,CACpE,qBAAqB,CAAC,KAAK,CAAC,EAC5B,sBAAsB,CACvB;IACC,KAAK,EAAE,kBAAkB,EAAE,CAAC;CAC7B;AAED,eAAO,MAAM,kBAAkB,EAAE,EAAE,CAAC,uBAAuB,CAgD1D,CAAC"}
+{"version":3,"file":"TooltipProgressBar.d.ts","sourceRoot":"","sources":["../../../../../../src/components/CartesianChart/components/ChartTooltip/TooltipProgressBar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAGhC,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,uEAAuE,CAAC;AAGhH,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,6BAA6B,CAAC;AAGzE,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,mCAAmC,CAAC;AAExE,UAAU,uBAAuB,CAC/B,KAAK,SAAS,cAAc,GAAG,cAAc,EAC7C,kBAAkB,SAAS,MAAM,KAAK,GAAG,MAAM,KAAK,CACpD,SAAQ,IAAI,CACZ,qBAAqB,CAAC,KAAK,EAAE,kBAAkB,CAAC,EAChD,sBAAsB,CACvB;IACC,KAAK,EAAE,kBAAkB,EAAE,CAAC;CAC7B;AAED,eAAO,MAAM,kBAAkB,EAAE,EAAE,CAAC,uBAAuB,CAsD1D,CAAC"}

package/dist/types/components/CartesianChart/components/ChartTooltip/index.d.ts

@@ -1,2 +1,3 @@
 export * from './ChartTooltip';
+export * from './types';
 //# sourceMappingURL=index.d.ts.map

package/dist/types/components/CartesianChart/components/ChartTooltip/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/components/CartesianChart/components/ChartTooltip/index.ts"],"names":[],"mappings":"AAAA,cAAc,gBAAgB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/components/CartesianChart/components/ChartTooltip/index.ts"],"names":[],"mappings":"AAAA,cAAc,gBAAgB,CAAC;AAC/B,cAAc,SAAS,CAAC"}

package/dist/types/components/CartesianChart/components/ChartTooltip/types.d.ts

@@ -0,0 +1,26 @@
+import { ChartTooltipProps } from '../..';
+import { ComponentType } from 'react';
+import { ChartDataValue, DataKeyProp } from '../../types';
+import { TooltipPayloadItem } from './TooltipLegendItem';
+export declare const TypedChartTooltip: <TData extends ChartDataValue = ChartDataValue, XAxisDataKey extends DataKeyProp<TData> = DataKeyProp<TData>>() => ComponentType<ChartTooltipProps<TData, XAxisDataKey>>;
+export type TooltipLineFormatter<TData extends ChartDataValue> = (value: TData[keyof TData], name: DataKeyProp<TData>, index: number, unit?: TooltipPayloadItem["unit"]) => Promise<string> | string;
+export type TooltipHeadingFormatter<TTitleType> = (title: TTitleType) => Promise<string> | string;
+export type TooltipLProgressBarFormatter = (value: number, unit?: TooltipPayloadItem["unit"]) => Promise<string> | string;
+export interface WithTooltipFormatters<TData extends ChartDataValue, TitleDataKey extends keyof TData = keyof TData> {
+    /**
+     * A formatter function for the lines in the tooltip. Can be used for purposes
+     * like translations.
+     */
+    formatter?: TooltipLineFormatter<Exclude<TData, TitleDataKey>>;
+    /**
+     * A formatter function for the heading of the tooltip. Can be used for
+     * purposes like translations.
+     */
+    headingFormatter?: TooltipHeadingFormatter<TData[TitleDataKey]>;
+    /**
+     * A formatter function for the progressBar of the tooltip. Can be used for
+     * purposes like translations.
+     */
+    progressBarFormatter?: TooltipLProgressBarFormatter;
+}
+//# sourceMappingURL=types.d.ts.map

package/dist/types/components/CartesianChart/components/ChartTooltip/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../../../src/components/CartesianChart/components/ChartTooltip/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAEL,KAAK,iBAAiB,EACvB,MAAM,6BAA6B,CAAC;AACrC,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAC3C,OAAO,KAAK,EACV,cAAc,EACd,WAAW,EACZ,MAAM,mCAAmC,CAAC;AAC3C,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,uEAAuE,CAAC;AAEhH,eAAO,MAAM,iBAAiB,GAC5B,KAAK,SAAS,cAAc,GAAG,cAAc,EAC7C,YAAY,SAAS,WAAW,CAAC,KAAK,CAAC,GAAG,WAAW,CAAC,KAAK,CAAC,OAEjC,aAAa,CACtC,iBAAiB,CAAC,KAAK,EAAE,YAAY,CAAC,CACvC,CAAC;AACJ,MAAM,MAAM,oBAAoB,CAAC,KAAK,SAAS,cAAc,IAAI,CAC/D,KAAK,EAAE,KAAK,CAAC,MAAM,KAAK,CAAC,EACzB,IAAI,EAAE,WAAW,CAAC,KAAK,CAAC,EACxB,KAAK,EAAE,MAAM,EACb,IAAI,CAAC,EAAE,kBAAkB,CAAC,MAAM,CAAC,KAC9B,OAAO,CAAC,MAAM,CAAC,GAAG,MAAM,CAAC;AAE9B,MAAM,MAAM,uBAAuB,CAAC,UAAU,IAAI,CAChD,KAAK,EAAE,UAAU,KACd,OAAO,CAAC,MAAM,CAAC,GAAG,MAAM,CAAC;AAE9B,MAAM,MAAM,4BAA4B,GAAG,CACzC,KAAK,EAAE,MAAM,EACb,IAAI,CAAC,EAAE,kBAAkB,CAAC,MAAM,CAAC,KAC9B,OAAO,CAAC,MAAM,CAAC,GAAG,MAAM,CAAC;AAE9B,MAAM,WAAW,qBAAqB,CACpC,KAAK,SAAS,cAAc,EAC5B,YAAY,SAAS,MAAM,KAAK,GAAG,MAAM,KAAK;IAE9C;;;OAGG;IACH,SAAS,CAAC,EAAE,oBAAoB,CAAC,OAAO,CAAC,KAAK,EAAE,YAAY,CAAC,CAAC,CAAC;IAC/D;;;OAGG;IACH,gBAAgB,CAAC,EAAE,uBAAuB,CAAC,KAAK,CAAC,YAAY,CAAC,CAAC,CAAC;IAChE;;;OAGG;IACH,oBAAoB,CAAC,EAAE,4BAA4B,CAAC;CACrD"}

package/dist/types/components/CartesianChart/components/Line/Line.d.ts

@@ -1,14 +1,14 @@
 import { ComponentType, FC } from 'react';
 import { CategoricalWithCustomColor } from '../../../../lib/tokens/CategoricalColors';
-import { ChartDataValue, DataKey } from '../../CartesianChart';
+import { ChartDataValue, DataKey } from '../../types';
 import * as Recharts from "recharts";
-export interface LineProps<TData = ChartDataValue> extends Pick<Recharts.LineProps, "className" | "key" | "xAxisId" | "yAxisId" | "type" | "unit"> {
+export interface LineProps<TData extends ChartDataValue = ChartDataValue> extends Pick<Recharts.LineProps, "className" | "key" | "xAxisId" | "yAxisId" | "type" | "unit"> {
     dataKey?: DataKey<TData>;
     /** The color of the line. @default "sea-green" */
     color?: CategoricalWithCustomColor;
 }
 /** @flr-generate all */
 export declare const Line: FC<LineProps>;
-export declare const TypedLine: <T = ChartDataValue>() => ComponentType<LineProps<T>>;
+export declare const TypedLine: <T extends ChartDataValue = ChartDataValue>() => ComponentType<LineProps<T>>;
 export default Line;
 //# sourceMappingURL=Line.d.ts.map

package/dist/types/components/CartesianChart/components/Line/Line.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Line.d.ts","sourceRoot":"","sources":["../../../../../../src/components/CartesianChart/components/Line/Line.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,aAAa,EAAE,KAAK,EAAE,EAAE,MAAM,OAAO,CAAC;AACpD,OAAO,KAAK,QAAQ,MAAM,UAAU,CAAC;AAGrC,OAAO,KAAK,EAAE,0BAA0B,EAAE,MAAM,gCAAgC,CAAC;AAEjF,OAAO,KAAK,EACV,cAAc,EACd,OAAO,EACR,MAAM,4CAA4C,CAAC;AAEpD,MAAM,WAAW,SAAS,CAAC,KAAK,GAAG,cAAc,CAAE,SAAQ,IAAI,CAC7D,QAAQ,CAAC,SAAS,EAClB,WAAW,GAAG,KAAK,GAAG,SAAS,GAAG,SAAS,GAAG,MAAM,GAAG,MAAM,CAC9D;IACC,OAAO,CAAC,EAAE,OAAO,CAAC,KAAK,CAAC,CAAC;IACzB,kDAAkD;IAClD,KAAK,CAAC,EAAE,0BAA0B,CAAC;CACpC;AAED,wBAAwB;AACxB,eAAO,MAAM,IAAI,EAAE,EAAE,CAAC,SAAS,CAiB9B,CAAC;AAEF,eAAO,MAAM,SAAS,GAAI,CAAC,GAAG,cAAc,OAClC,aAAa,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,CAAC;AAEtC,eAAe,IAAI,CAAC"}
+{"version":3,"file":"Line.d.ts","sourceRoot":"","sources":["../../../../../../src/components/CartesianChart/components/Line/Line.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,aAAa,EAAE,KAAK,EAAE,EAAE,MAAM,OAAO,CAAC;AACpD,OAAO,KAAK,QAAQ,MAAM,UAAU,CAAC;AAGrC,OAAO,KAAK,EAAE,0BAA0B,EAAE,MAAM,gCAAgC,CAAC;AAEjF,OAAO,KAAK,EACV,cAAc,EACd,OAAO,EACR,MAAM,mCAAmC,CAAC;AAE3C,MAAM,WAAW,SAAS,CACxB,KAAK,SAAS,cAAc,GAAG,cAAc,CAC7C,SAAQ,IAAI,CACZ,QAAQ,CAAC,SAAS,EAClB,WAAW,GAAG,KAAK,GAAG,SAAS,GAAG,SAAS,GAAG,MAAM,GAAG,MAAM,CAC9D;IACC,OAAO,CAAC,EAAE,OAAO,CAAC,KAAK,CAAC,CAAC;IACzB,kDAAkD;IAClD,KAAK,CAAC,EAAE,0BAA0B,CAAC;CACpC;AAED,wBAAwB;AACxB,eAAO,MAAM,IAAI,EAAE,EAAE,CAAC,SAAS,CAiB9B,CAAC;AAEF,eAAO,MAAM,SAAS,GAAI,CAAC,SAAS,cAAc,GAAG,cAAc,OACzD,aAAa,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,CAAC;AAEtC,eAAe,IAAI,CAAC"}

package/dist/types/components/CartesianChart/components/XAxis/XAxis.d.ts

@@ -1,9 +1,9 @@
 import { FC } from 'react';
-import { ChartDataValue, DataKey, DataKeyValue } from '../../CartesianChart';
+import { ChartDataValue, DataKey, DataKeyValue } from '../../types';
 import * as Recharts from "recharts";
-export type XAxisProps<TData = ChartDataValue, TDataKey extends DataKey<TData> = DataKey<TData>, TDataMatch = DataKeyValue<TData, TDataKey>> = Pick<Recharts.XAxisProps, "className" | "orientation" | "allowDecimals" | "allowDataOverflow" | "interval" | "minTickGap" | "scale" | "type" | "domain" | "hide" | "unit"> & {
+export type XAxisProps<TData extends ChartDataValue = ChartDataValue, TDataKey extends DataKey<TData> = DataKey<TData>, TDataKeyValue = DataKeyValue<TData, TDataKey>> = Pick<Recharts.XAxisProps, "className" | "orientation" | "allowDecimals" | "allowDataOverflow" | "interval" | "minTickGap" | "scale" | "type" | "domain" | "hide" | "unit"> & {
     dataKey?: TDataKey;
-    tickFormatter?: (value: TDataMatch, index: number) => string;
+    tickFormatter?: (value: TDataKeyValue, index: number) => string;
 };
 /** @flr-generate all */
 export declare const XAxis: FC<XAxisProps>;