npm - @mittwald/flow-react-components - Versions diffs - 0.2.0-alpha.551 → 0.2.0-alpha.553 - Mend

@mittwald/flow-react-components 0.2.0-alpha.551 → 0.2.0-alpha.553

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (165) hide show

package/dist/js/_virtual/_.locale.json@bb0db7b5021f874310cbe5b6cc3d9cac.mjs CHANGED Viewed

@@ -1,6 +1,6 @@
 "use client"
 /* */
-const locales = {"de-DE": {  "mode.editor": `Editor`,
+const locales = {"de-DE": {  "mode.editor": `Vorschau beenden`,
   "mode.preview": `Vorschau`,
   "toolbar.bold": `Fett`,
   "toolbar.code": `Code`,
@@ -10,7 +10,7 @@ const locales = {"de-DE": {  "mode.editor": `Editor`,
   "toolbar.quote": `Zitat`,
   "toolbar.strikeThrough": `Durchgestrichen`,
   "toolbar.unorderedList": `Liste`,
-},"en-US": {  "mode.editor": `Editor`,
+},"en-US": {  "mode.editor": `Exit Preview`,
   "mode.preview": `Preview`,
   "toolbar.bold": `Bold`,
   "toolbar.code": `Code`,

package/dist/js/components/src/components/Action/Action.mjs CHANGED Viewed

@@ -52,6 +52,7 @@ const Action = flowComponent(
     const actionModel = actionModelFromProps ?? newActionModel;
     const propsContext = {
       Button: actionButtonContext,
+      SubmitButton: actionButtonContext,
       Link: {
         onPress: dynamic(() => ActionModel.use().execute)
       },

package/dist/js/components/src/components/Action/Action.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Action.mjs","sources":["../../../../../../src/components/Action/Action.tsx"],"sourcesContent":["import { ActionModel as ActionModel } from \"@/components/Action/models/ActionModel\";\nimport type { PropsContext } from \"@/lib/propsContext\";\nimport { dynamic, PropsContextProvider } from \"@/lib/propsContext\";\nimport { ActionContextProvider } from \"@/components/Action/context\";\nimport { useActionStateContext } from \"@/components/Action/models/ActionStateContext\";\nimport { useConfirmationModalButtonSlot } from \"@/components/Action/hooks/useConfirmationModalButtonSlot\";\nimport { useActionButtonState } from \"@/components/Action/hooks/useActionButtonState\";\nimport type { ComponentPropsContext } from \"@/lib/propsContext/types\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\n\nconst actionButtonContext: ComponentPropsContext<\"Button\"> = {\n onPress: dynamic((props) => {\n const action = ActionModel.use();\n const confirmAction = ActionModel.useConfirmationAction();\n const isConfirmationButton =\n useConfirmationModalButtonSlot(props) === \"primary\";\n const isAbortButton = useConfirmationModalButtonSlot(props) === \"abort\";\n if (isAbortButton) {\n return action.confirmationModalController.close;\n }\n return isConfirmationButton ? confirmAction.execute : action.execute;\n }),\n\n isPending: dynamic((props) => {\n const actionState = useActionButtonState(props);\n return props.isPending ?? actionState === \"isPending\";\n }),\n\n isSucceeded: dynamic((props) => {\n const actionState = useActionButtonState(props);\n return props.isSucceeded ?? actionState === \"isSucceeded\";\n }),\n\n isFailed: dynamic((props) => {\n const actionState = useActionButtonState(props);\n return props.isFailed ?? actionState === \"isFailed\";\n }),\n\n \"aria-disabled\": dynamic((props) => {\n const state = useActionButtonState(props);\n const someActionInContextIsBusy = useActionStateContext().useIsBusy();\n return (\n props[\"aria-disabled\"] ??\n (state === \"isExecuting\" \|\| someActionInContextIsBusy)\n );\n }),\n};\n\nexport const Action = flowComponent(\n \"Action\",\n (props) => {\n const {\n children,\n actionModel: actionModelFromProps,\n ...actionProps\n } = props;\n const newActionModel = ActionModel.useNew(actionProps);\n const actionModel = actionModelFromProps ?? newActionModel;\n\n const propsContext: PropsContext = {\n Button: actionButtonContext,\n\n Link: {\n onPress: dynamic(() => ActionModel.use().execute),\n },\n\n MenuItem: {\n onAction: dynamic(() => ActionModel.use().execute),\n },\n\n Modal: {\n slot: dynamic((props) => {\n const { slot } = props;\n const action = ActionModel.use();\n action.needsConfirmation = slot === \"actionConfirm\";\n return slot;\n }),\n isDismissable: dynamic((props) => {\n const action = ActionModel.use();\n const actionState = action.state.useValue();\n return actionState === \"isExecuting\" \|\| actionState === \"isPending\"\n ? false\n : props.isDismissable;\n }),\n controller: dynamic(() => {\n const action = ActionModel.use();\n return action.needsConfirmation\n ? action.confirmationModalController\n : action.getOverlayController(\"Modal\");\n }),\n ActionGroup: {\n Button: actionButtonContext,\n },\n },\n };\n\n return (\n <ActionContextProvider value={actionModel}>\n <PropsContextProvider props={propsContext}>\n {children}\n </PropsContextProvider>\n </ActionContextProvider>\n );\n },\n {\n type: \"provider\",\n },\n);\n\nexport default Action;\n"],"names":["props"],"mappings":"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"}
1	+ {"version":3,"file":"Action.mjs","sources":["../../../../../../src/components/Action/Action.tsx"],"sourcesContent":["import { ActionModel as ActionModel } from \"@/components/Action/models/ActionModel\";\nimport type { PropsContext } from \"@/lib/propsContext\";\nimport { dynamic, PropsContextProvider } from \"@/lib/propsContext\";\nimport { ActionContextProvider } from \"@/components/Action/context\";\nimport { useActionStateContext } from \"@/components/Action/models/ActionStateContext\";\nimport { useConfirmationModalButtonSlot } from \"@/components/Action/hooks/useConfirmationModalButtonSlot\";\nimport { useActionButtonState } from \"@/components/Action/hooks/useActionButtonState\";\nimport type { ComponentPropsContext } from \"@/lib/propsContext/types\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\n\nconst actionButtonContext: ComponentPropsContext<\"Button\"> = {\n onPress: dynamic((props) => {\n const action = ActionModel.use();\n const confirmAction = ActionModel.useConfirmationAction();\n const isConfirmationButton =\n useConfirmationModalButtonSlot(props) === \"primary\";\n const isAbortButton = useConfirmationModalButtonSlot(props) === \"abort\";\n if (isAbortButton) {\n return action.confirmationModalController.close;\n }\n return isConfirmationButton ? confirmAction.execute : action.execute;\n }),\n\n isPending: dynamic((props) => {\n const actionState = useActionButtonState(props);\n return props.isPending ?? actionState === \"isPending\";\n }),\n\n isSucceeded: dynamic((props) => {\n const actionState = useActionButtonState(props);\n return props.isSucceeded ?? actionState === \"isSucceeded\";\n }),\n\n isFailed: dynamic((props) => {\n const actionState = useActionButtonState(props);\n return props.isFailed ?? actionState === \"isFailed\";\n }),\n\n \"aria-disabled\": dynamic((props) => {\n const state = useActionButtonState(props);\n const someActionInContextIsBusy = useActionStateContext().useIsBusy();\n return (\n props[\"aria-disabled\"] ??\n (state === \"isExecuting\" \|\| someActionInContextIsBusy)\n );\n }),\n};\n\nexport const Action = flowComponent(\n \"Action\",\n (props) => {\n const {\n children,\n actionModel: actionModelFromProps,\n ...actionProps\n } = props;\n const newActionModel = ActionModel.useNew(actionProps);\n const actionModel = actionModelFromProps ?? newActionModel;\n\n const propsContext: PropsContext = {\n Button: actionButtonContext,\n\n SubmitButton: actionButtonContext,\n\n Link: {\n onPress: dynamic(() => ActionModel.use().execute),\n },\n\n MenuItem: {\n onAction: dynamic(() => ActionModel.use().execute),\n },\n\n Modal: {\n slot: dynamic((props) => {\n const { slot } = props;\n const action = ActionModel.use();\n action.needsConfirmation = slot === \"actionConfirm\";\n return slot;\n }),\n isDismissable: dynamic((props) => {\n const action = ActionModel.use();\n const actionState = action.state.useValue();\n return actionState === \"isExecuting\" \|\| actionState === \"isPending\"\n ? false\n : props.isDismissable;\n }),\n controller: dynamic(() => {\n const action = ActionModel.use();\n return action.needsConfirmation\n ? action.confirmationModalController\n : action.getOverlayController(\"Modal\");\n }),\n ActionGroup: {\n Button: actionButtonContext,\n },\n },\n };\n\n return (\n <ActionContextProvider value={actionModel}>\n <PropsContextProvider props={propsContext}>\n {children}\n </PropsContextProvider>\n </ActionContextProvider>\n );\n },\n {\n type: \"provider\",\n },\n);\n\nexport default Action;\n"],"names":["props"],"mappings":"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"}

package/dist/js/components/src/components/Action/models/ActionState.mjs CHANGED Viewed

@@ -89,5 +89,5 @@ class ActionState {
   }
 }
-export { ActionState };
+export { ActionState, duration };
 //# sourceMappingURL=ActionState.mjs.map

package/dist/js/components/src/components/Action/models/ActionState.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ActionState.mjs","sources":["../../../../../../../src/components/Action/models/ActionState.ts"],"sourcesContent":["import {\n action as mobxAction,\n computed,\n makeObservable,\n observable,\n} from \"mobx\";\nimport useSelector from \"@/lib/mobx/useSelector\";\nimport { sleep } from \"@/lib/promises/sleep\";\nimport { useStatic } from \"@/lib/hooks/useStatic\";\n\nexport type ActionStateValue =\n \| \"isIdle\"\n \| \"isSucceeded\"\n \| \"isPending\"\n \| \"isExecuting\"\n \| \"isFailed\";\n\~~nconst~~ duration = {\n pending: 1000,\n succeeded: 1500,\n failed: 2000,\n};\n\nexport class ActionState {\n private showFeedback?: boolean;\n public state: ActionStateValue = \"isIdle\";\n private setPendingTimeout: number \| undefined;\n public error: unknown;\n private isAsync = false;\n\n public constructor() {\n makeObservable(this, {\n state: observable,\n updateState: mobxAction,\n isBusy: computed,\n });\n }\n\n public static useNew(): ActionState {\n return useStatic(() => new ActionState());\n }\n\n public updateState(newState: ActionStateValue): void {\n this.state = newState;\n }\n\n public useValue(): ActionStateValue {\n return useSelector(() => this.state, [this]);\n }\n\n public useIsBusy(): boolean {\n return useSelector(() => this.isBusy, [this]);\n }\n\n public get isBusy(): boolean {\n return this.state !== \"isIdle\";\n }\n\n public onAsyncStart(): void {\n this.isAsync = true;\n this.updateState(\"isExecuting\");\n this.setPendingTimeout = window.setTimeout(\n () => this.startPending(),\n duration.pending,\n );\n }\n\n public async onSucceeded(): Promise<void> {\n await this.onDone();\n }\n\n public async onFailed(error?: unknown): Promise<void> {\n this.error = error ?? new Error(\"Unknown error\");\n await this.onDone();\n }\n\n public withFeedback(feedback?: boolean): ActionState {\n this.showFeedback = feedback;\n return this;\n }\n\n private async startFailedFeedback(): Promise<void> {\n this.updateState(\"isFailed\");\n await sleep(duration.failed);\n this.resetAfterDone();\n }\n\n private async startSucceededFeedback(): Promise<void> {\n this.updateState(\"isSucceeded\");\n await sleep(duration.succeeded);\n this.resetAfterDone();\n }\n\n private resetAfterDone(): void {\n this.updateState(\"isIdle\");\n this.isAsync = false;\n this.error = undefined;\n }\n\n private async onDone(): Promise<void> {\n if (this.setPendingTimeout) {\n window.clearTimeout(this.setPendingTimeout);\n }\n if (this.error) {\n await this.startFailedFeedback();\n } else if (\n this.showFeedback !== false &&\n (this.showFeedback \|\| this.isAsync)\n ) {\n await this.startSucceededFeedback();\n } else {\n this.resetAfterDone();\n }\n }\n\n private startPending(): void {\n this.updateState(\"isPending\");\n }\n}\n"],"names":["mobxAction"],"mappings":";;;;;~~AAiBA~~,MAAM,QAAA,GAAW;AAAA,~~EACf~~,OAAA,EAAS,GAAA;AAAA,EACT,SAAA,EAAW,IAAA;AAAA,EACX,MAAA,EAAQ;AACV~~,CAAA~~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"}
1	+ {"version":3,"file":"ActionState.mjs","sources":["../../../../../../../src/components/Action/models/ActionState.ts"],"sourcesContent":["import {\n action as mobxAction,\n computed,\n makeObservable,\n observable,\n} from \"mobx\";\nimport useSelector from \"@/lib/mobx/useSelector\";\nimport { sleep } from \"@/lib/promises/sleep\";\nimport { useStatic } from \"@/lib/hooks/useStatic\";\n\nexport type ActionStateValue =\n \| \"isIdle\"\n \| \"isSucceeded\"\n \| \"isPending\"\n \| \"isExecuting\"\n \| \"isFailed\";\n\nexport const duration = {\n pending: 1000,\n succeeded: 1500,\n failed: 2000,\n};\n\nexport class ActionState {\n private showFeedback?: boolean;\n public state: ActionStateValue = \"isIdle\";\n private setPendingTimeout: number \| undefined;\n public error: unknown;\n private isAsync = false;\n\n public constructor() {\n makeObservable(this, {\n state: observable,\n updateState: mobxAction,\n isBusy: computed,\n });\n }\n\n public static useNew(): ActionState {\n return useStatic(() => new ActionState());\n }\n\n public updateState(newState: ActionStateValue): void {\n this.state = newState;\n }\n\n public useValue(): ActionStateValue {\n return useSelector(() => this.state, [this]);\n }\n\n public useIsBusy(): boolean {\n return useSelector(() => this.isBusy, [this]);\n }\n\n public get isBusy(): boolean {\n return this.state !== \"isIdle\";\n }\n\n public onAsyncStart(): void {\n this.isAsync = true;\n this.updateState(\"isExecuting\");\n this.setPendingTimeout = window.setTimeout(\n () => this.startPending(),\n duration.pending,\n );\n }\n\n public async onSucceeded(): Promise<void> {\n await this.onDone();\n }\n\n public async onFailed(error?: unknown): Promise<void> {\n this.error = error ?? new Error(\"Unknown error\");\n await this.onDone();\n }\n\n public withFeedback(feedback?: boolean): ActionState {\n this.showFeedback = feedback;\n return this;\n }\n\n private async startFailedFeedback(): Promise<void> {\n this.updateState(\"isFailed\");\n await sleep(duration.failed);\n this.resetAfterDone();\n }\n\n private async startSucceededFeedback(): Promise<void> {\n this.updateState(\"isSucceeded\");\n await sleep(duration.succeeded);\n this.resetAfterDone();\n }\n\n private resetAfterDone(): void {\n this.updateState(\"isIdle\");\n this.isAsync = false;\n this.error = undefined;\n }\n\n private async onDone(): Promise<void> {\n if (this.setPendingTimeout) {\n window.clearTimeout(this.setPendingTimeout);\n }\n if (this.error) {\n await this.startFailedFeedback();\n } else if (\n this.showFeedback !== false &&\n (this.showFeedback \|\| this.isAsync)\n ) {\n await this.startSucceededFeedback();\n } else {\n this.resetAfterDone();\n }\n }\n\n private startPending(): void {\n this.updateState(\"isPending\");\n }\n}\n"],"names":["mobxAction"],"mappings":"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"}

package/dist/js/components/src/components/Autocomplete/Autocomplete.mjs CHANGED Viewed

@@ -61,7 +61,7 @@ const Autocomplete = flowComponent("Autocomplete", (props) => {
   } = useFieldComponent(props);
   const propsContext = {
     SearchField: inputProps,
-    TextField: inputProps,
+    TextField: { ...inputProps, inputContext: Aria.AutocompleteContext },
     Option: {
       tunnelId: "options"
     },

package/dist/js/components/src/components/Autocomplete/Autocomplete.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Autocomplete.mjs","sources":["../../../../../../src/components/Autocomplete/Autocomplete.tsx"],"sourcesContent":["import { useRef, type PropsWithChildren } from \"react\";\nimport type { PropsWithClassName } from \"@/lib/types/props\";\nimport { type PropsContext, PropsContextProvider } from \"@/lib/propsContext\";\nimport * as Aria from \"react-aria-components\";\nimport { useOverlayController } from \"@/lib/controller\";\nimport {\n flowComponent,\n type FlowComponentProps,\n} from \"@/lib/componentFactory/flowComponent\";\nimport type { SearchFieldProps } from \"@/components/SearchField\";\nimport type { TextFieldProps } from \"@/components/TextField\";\nimport Options from \"@/components/Options\";\nimport { TunnelExit } from \"@mittwald/react-tunnel\";\nimport locales from \"./locales/.locale.json\";\nimport Text from \"@/components/Text\";\nimport styles from \"./Autocomplete.module.scss\";\nimport {\n UNSAFE_PortalProvider,\n useFocusWithin,\n useLocalizedStringFormatter,\n} from \"react-aria\";\nimport { emitElementValueChange } from \"@/lib/react/emitElementValueChange\";\nimport { useFieldComponent } from \"@/lib/hooks/useFieldComponent\";\nexport interface AutocompleteProps\n extends PropsWithChildren,\n PropsWithClassName,\n FlowComponentProps,\n Omit<Aria.AutocompleteProps, \"children\" \| \"onInputChange\" \| \"inputValue\"> {\n isInvalid?: boolean;\n}\n\n/* @flr-generate all */\nexport const Autocomplete = flowComponent(\"Autocomplete\", (props) => {\n const { children, isInvalid, ...rest } = props;\n\n const { contains } = Aria.useFilter({ sensitivity: \"base\" });\n const stringFormatter = useLocalizedStringFormatter(locales);\n const container = useRef(null);\n const triggerRef = useRef<HTMLInputElement>(null);\n\n const controller = useOverlayController(\"Popover\", {\n reuseControllerFromContext: false,\n });\n\n const focusWithin = useFocusWithin({\n onBlurWithin: controller.close,\n });\n\n const inputProps: SearchFieldProps & TextFieldProps = {\n onKeyDown: (e) => {\n if (e.key === \"Enter\" && controller.isOpen) {\n e.preventDefault();\n }\n },\n isInvalid,\n ref: triggerRef,\n };\n\n const renderEmptyState = () => (\n <Text className={styles.empty}>\n {stringFormatter.format(\"autocomplete.empty\")}\n </Text>\n );\n\n const handleOnInputChange = (value: string) => {\n if (!value) {\n controller.close();\n } else if (!controller.isOpen) {\n controller.open();\n }\n };\n\n const handleOptionAction = (key: Aria.Key) => {\n const inputElement = triggerRef.current;\n if (inputElement) {\n // Set value on input element and trigger change event\n emitElementValueChange(inputElement, String(key));\n }\n controller.close();\n };\n\n const {\n FieldErrorView,\n FieldErrorCaptureContext,\n fieldPropsContext,\n fieldProps,\n } = useFieldComponent(props);\n\n const propsContext: PropsContext = {\n SearchField: inputProps,\n TextField: inputProps,\n Option: {\n tunnelId: \"options\",\n },\n Popover: {\n className: styles.popover,\n },\n ...fieldPropsContext,\n };\n\n return (\n <div {...fieldProps}>\n <FieldErrorCaptureContext>\n <PropsContextProvider props={propsContext}>\n <div {...focusWithin.focusWithinProps} ref={container}>\n <UNSAFE_PortalProvider getContainer={() => container.current}>\n <Aria.Autocomplete\n onInputChange={handleOnInputChange}\n filter={contains}\n disableAutoFocusFirst\n {...rest}\n >\n {children}\n <Options\n onAction={handleOptionAction}\n triggerRef={triggerRef}\n controller={controller}\n renderEmptyState={renderEmptyState}\n isNonModal\n placement=\"bottom start\"\n >\n <TunnelExit id=\"options\" />\n </Options>\n </Aria.Autocomplete>\n </UNSAFE_PortalProvider>\n </div>\n </PropsContextProvider>\n </FieldErrorCaptureContext>\n <FieldErrorView />\n </div>\n );\n});\n\nexport default Autocomplete;\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAgCO,MAAM,YAAA,GAAe,aAAA,CAAc,cAAA,EAAgB,CAAC,KAAA,KAAU;AACnE,EAAA,MAAM,EAAE,QAAA,EAAU,SAAA,EAAW,GAAG,MAAK,GAAI,KAAA;AAEzC,EAAA,MAAM,EAAE,UAAS,GAAI,IAAA,CAAK,UAAU,EAAE,WAAA,EAAa,QAAQ,CAAA;AAC3D,EAAA,MAAM,eAAA,GAAkB,4BAA4B,OAAO,CAAA;AAC3D,EAAA,MAAM,SAAA,GAAY,OAAO,IAAI,CAAA;AAC7B,EAAA,MAAM,UAAA,GAAa,OAAyB,IAAI,CAAA;AAEhD,EAAA,MAAM,UAAA,GAAa,qBAAqB,SAAA,EAAW;AAAA,IACjD,0BAAA,EAA4B;AAAA,GAC7B,CAAA;AAED,EAAA,MAAM,cAAc,cAAA,CAAe;AAAA,IACjC,cAAc,UAAA,CAAW;AAAA,GAC1B,CAAA;AAED,EAAA,MAAM,UAAA,GAAgD;AAAA,IACpD,SAAA,EAAW,CAAC,CAAA,KAAM;AAChB,MAAA,IAAI,CAAA,CAAE,GAAA,KAAQ,OAAA,IAAW,UAAA,CAAW,MAAA,EAAQ;AAC1C,QAAA,CAAA,CAAE,cAAA,EAAe;AAAA,MACnB;AAAA,IACF,CAAA;AAAA,IACA,SAAA;AAAA,IACA,GAAA,EAAK;AAAA,GACP;AAEA,EAAA,MAAM,gBAAA,GAAmB,sBACvB,GAAA,CAAC,IAAA,EAAA,EAAK,SAAA,EAAW,OAAO,KAAA,EACrB,QAAA,EAAA,eAAA,CAAgB,MAAA,CAAO,oBAAoB,CAAA,EAC9C,CAAA;AAGF,EAAA,MAAM,mBAAA,GAAsB,CAAC,KAAA,KAAkB;AAC7C,IAAA,IAAI,CAAC,KAAA,EAAO;AACV,MAAA,UAAA,CAAW,KAAA,EAAM;AAAA,IACnB,CAAA,MAAA,IAAW,CAAC,UAAA,CAAW,MAAA,EAAQ;AAC7B,MAAA,UAAA,CAAW,IAAA,EAAK;AAAA,IAClB;AAAA,EACF,CAAA;AAEA,EAAA,MAAM,kBAAA,GAAqB,CAAC,GAAA,KAAkB;AAC5C,IAAA,MAAM,eAAe,UAAA,CAAW,OAAA;AAChC,IAAA,IAAI,YAAA,EAAc;AAEhB,MAAA,sBAAA,CAAuB,YAAA,EAAc,MAAA,CAAO,GAAG,CAAC,CAAA;AAAA,IAClD;AACA,IAAA,UAAA,CAAW,KAAA,EAAM;AAAA,EACnB,CAAA;AAEA,EAAA,MAAM;AAAA,IACJ,cAAA;AAAA,IACA,wBAAA;AAAA,IACA,iBAAA;AAAA,IACA;AAAA,GACF,GAAI,kBAAkB,KAAK,CAAA;AAE3B,EAAA,MAAM,YAAA,GAA6B;AAAA,IACjC,WAAA,EAAa,UAAA;AAAA,IACb,~~SAAA~~,~~EAAW~~,UAAA;AAAA,~~IACX~~,MAAA,EAAQ;AAAA,MACN,QAAA,EAAU;AAAA,KACZ;AAAA,IACA,OAAA,EAAS;AAAA,MACP,WAAW,MAAA,CAAO;AAAA,KACpB;AAAA,IACA,GAAG;AAAA,GACL;AAEA,EAAA,uBACE,IAAA,CAAC,KAAA,EAAA,EAAK,GAAG,UAAA,EACP,QAAA,EAAA;AAAA,oBAAA,GAAA,CAAC,4BACC,QAAA,kBAAA,GAAA,CAAC,oBAAA,EAAA,EAAqB,KAAA,EAAO,YAAA,EAC3B,8BAAC,KAAA,EAAA,EAAK,GAAG,WAAA,CAAY,gBAAA,EAAkB,KAAK,SAAA,EAC1C,QAAA,kBAAA,GAAA,CAAC,yBAAsB,YAAA,EAAc,MAAM,UAAU,OAAA,EACnD,QAAA,kBAAA,IAAA;AAAA,MAAC,IAAA,CAAK,YAAA;AAAA,MAAL;AAAA,QACC,aAAA,EAAe,mBAAA;AAAA,QACf,MAAA,EAAQ,QAAA;AAAA,QACR,qBAAA,EAAqB,IAAA;AAAA,QACpB,GAAG,IAAA;AAAA,QAEH,QAAA,EAAA;AAAA,UAAA,QAAA;AAAA,0BACD,GAAA;AAAA,YAAC,OAAA;AAAA,YAAA;AAAA,cACC,QAAA,EAAU,kBAAA;AAAA,cACV,UAAA;AAAA,cACA,UAAA;AAAA,cACA,gBAAA;AAAA,cACA,UAAA,EAAU,IAAA;AAAA,cACV,SAAA,EAAU,cAAA;AAAA,cAEV,QAAA,kBAAA,GAAA,CAAC,UAAA,EAAA,EAAW,EAAA,EAAG,SAAA,EAAU;AAAA;AAAA;AAC3B;AAAA;AAAA,KACF,EACF,CAAA,EACF,CAAA,EACF,CAAA,EACF,CAAA;AAAA,wBACC,cAAA,EAAA,EAAe;AAAA,GAAA,EAClB,CAAA;AAEJ,CAAC;;;;"}
1	+ {"version":3,"file":"Autocomplete.mjs","sources":["../../../../../../src/components/Autocomplete/Autocomplete.tsx"],"sourcesContent":["import { useRef, type PropsWithChildren } from \"react\";\nimport type { PropsWithClassName } from \"@/lib/types/props\";\nimport { type PropsContext, PropsContextProvider } from \"@/lib/propsContext\";\nimport * as Aria from \"react-aria-components\";\nimport { useOverlayController } from \"@/lib/controller\";\nimport {\n flowComponent,\n type FlowComponentProps,\n} from \"@/lib/componentFactory/flowComponent\";\nimport type { SearchFieldProps } from \"@/components/SearchField\";\nimport type { TextFieldProps } from \"@/components/TextField\";\nimport Options from \"@/components/Options\";\nimport { TunnelExit } from \"@mittwald/react-tunnel\";\nimport locales from \"./locales/.locale.json\";\nimport Text from \"@/components/Text\";\nimport styles from \"./Autocomplete.module.scss\";\nimport {\n UNSAFE_PortalProvider,\n useFocusWithin,\n useLocalizedStringFormatter,\n} from \"react-aria\";\nimport { emitElementValueChange } from \"@/lib/react/emitElementValueChange\";\nimport { useFieldComponent } from \"@/lib/hooks/useFieldComponent\";\nexport interface AutocompleteProps\n extends PropsWithChildren,\n PropsWithClassName,\n FlowComponentProps,\n Omit<Aria.AutocompleteProps, \"children\" \| \"onInputChange\" \| \"inputValue\"> {\n isInvalid?: boolean;\n}\n\n/* @flr-generate all */\nexport const Autocomplete = flowComponent(\"Autocomplete\", (props) => {\n const { children, isInvalid, ...rest } = props;\n\n const { contains } = Aria.useFilter({ sensitivity: \"base\" });\n const stringFormatter = useLocalizedStringFormatter(locales);\n const container = useRef(null);\n const triggerRef = useRef<HTMLInputElement>(null);\n\n const controller = useOverlayController(\"Popover\", {\n reuseControllerFromContext: false,\n });\n\n const focusWithin = useFocusWithin({\n onBlurWithin: controller.close,\n });\n\n const inputProps: SearchFieldProps & TextFieldProps = {\n onKeyDown: (e) => {\n if (e.key === \"Enter\" && controller.isOpen) {\n e.preventDefault();\n }\n },\n isInvalid,\n ref: triggerRef,\n };\n\n const renderEmptyState = () => (\n <Text className={styles.empty}>\n {stringFormatter.format(\"autocomplete.empty\")}\n </Text>\n );\n\n const handleOnInputChange = (value: string) => {\n if (!value) {\n controller.close();\n } else if (!controller.isOpen) {\n controller.open();\n }\n };\n\n const handleOptionAction = (key: Aria.Key) => {\n const inputElement = triggerRef.current;\n if (inputElement) {\n // Set value on input element and trigger change event\n emitElementValueChange(inputElement, String(key));\n }\n controller.close();\n };\n\n const {\n FieldErrorView,\n FieldErrorCaptureContext,\n fieldPropsContext,\n fieldProps,\n } = useFieldComponent(props);\n\n const propsContext: PropsContext = {\n SearchField: inputProps,\n TextField: { ...inputProps, inputContext: Aria.AutocompleteContext },\n Option: {\n tunnelId: \"options\",\n },\n Popover: {\n className: styles.popover,\n },\n ...fieldPropsContext,\n };\n\n return (\n <div {...fieldProps}>\n <FieldErrorCaptureContext>\n <PropsContextProvider props={propsContext}>\n <div {...focusWithin.focusWithinProps} ref={container}>\n <UNSAFE_PortalProvider getContainer={() => container.current}>\n <Aria.Autocomplete\n onInputChange={handleOnInputChange}\n filter={contains}\n disableAutoFocusFirst\n {...rest}\n >\n {children}\n <Options\n onAction={handleOptionAction}\n triggerRef={triggerRef}\n controller={controller}\n renderEmptyState={renderEmptyState}\n isNonModal\n placement=\"bottom start\"\n >\n <TunnelExit id=\"options\" />\n </Options>\n </Aria.Autocomplete>\n </UNSAFE_PortalProvider>\n </div>\n </PropsContextProvider>\n </FieldErrorCaptureContext>\n <FieldErrorView />\n </div>\n );\n});\n\nexport default Autocomplete;\n"],"names":[],"mappings":"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"}

package/dist/js/components/src/components/Button/Button.mjs CHANGED Viewed

@@ -104,7 +104,7 @@ const Button = flowComponent("Button", (props) => {
       className: rootClassName,
       ref,
       slot,
-      "data-readonly": isReadOnly,
+      ...isReadOnly === true ? { "data-readonly": true } : {},
       ...restProps,
       children: [
         /* @__PURE__ */ jsx(PropsContextProvider, { props: propsContext, children: /* @__PURE__ */ jsx(Wrap, { if: !unstyled, children: /* @__PURE__ */ jsx("span", { className: styles.content, children: /* @__PURE__ */ jsx(Wrap, { if: isStringContent, children: /* @__PURE__ */ jsx(Text, { className: styles.text, children }) }) }) }) }),

package/dist/js/components/src/components/Button/Button.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Button.mjs","sources":["../../../../../../src/components/Button/Button.tsx"],"sourcesContent":["import type { PropsWithChildren } from \"react\";\nimport styles from \"./Button.module.scss\";\nimport * as Aria from \"react-aria-components\";\nimport clsx from \"clsx\";\nimport type { PropsContext } from \"@/lib/propsContext\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport { IconFailed, IconSucceeded } from \"@/components/Icon/components/icons\";\nimport { Wrap } from \"@/components/Wrap\";\nimport { Text } from \"@/components/Text\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport LoadingSpinner from \"@/components/LoadingSpinner/LoadingSpinner\";\nimport { useAriaAnnounceActionState } from \"@/components/Action/lib/ariaLive\";\n\nexport interface ButtonProps\n extends PropsWithChildren<Aria.ButtonProps>,\n FlowComponentProps<HTMLButtonElement> {\n /** Slot for button placement in action groups. /\n slot?: string;\n /* The color of the button. @default \"primary\" /\n color?: \"primary\" \| \"accent\" \| \"secondary\" \| \"danger\" \| \"dark\" \| \"light\";\n /* The visual variant of the button. @default \"solid\" /\n variant?: \"plain\" \| \"solid\" \| \"soft\" \| \"outline\";\n /* The size of the button. @default \"m\" /\n size?: \"m\" \| \"s\";\n /* Disables button but keeps it focusable. /\n \"aria-disabled\"?: boolean;\n /* Whether the button is in a pending state. /\n isPending?: boolean;\n /* Whether the button is in a succeeded state. /\n isSucceeded?: boolean;\n /* Whether the button is in a failed state. /\n isFailed?: boolean;\n /* Whether the button is in a read only state. /\n isReadOnly?: boolean;\n /* @internal /\n unstyled?: boolean;\n /* @internal /\n ariaSlot?: string \| null;\n}\n\nconst disablePendingProps = (props: ButtonProps) => {\n if (\n props.isPending \|\|\n props.isSucceeded \|\|\n props.isFailed \|\|\n props[\"aria-disabled\"] \|\|\n props.isReadOnly\n ) {\n props = { ...props };\n props.onPress = undefined;\n props.onPressStart = undefined;\n props.onPressEnd = undefined;\n props.onPressChange = undefined;\n props.onPressUp = undefined;\n props.onKeyDown = undefined;\n props.onKeyUp = undefined;\n props.type = \"button\";\n }\n\n return props;\n};\n\n/* @flr-generate all /\nexport const Button = flowComponent(\"Button\", (props) => {\n props = disablePendingProps(props);\n\n const {\n color = \"primary\",\n variant = \"solid\",\n children,\n className,\n size = \"m\",\n isPending,\n isSucceeded,\n isFailed,\n \"aria-disabled\": ariaDisabled,\n ref,\n slot: ignoredSlotProp,\n ariaSlot: slot,\n unstyled,\n isReadOnly,\n ...restProps\n } = props;\n\n const rootClassName = unstyled\n ? className\n : clsx(\n styles.button,\n isPending && styles.isPending,\n isSucceeded && styles.isSucceeded,\n isFailed && styles.isFailed,\n styles[`size-${size}`],\n styles[color],\n styles[variant],\n className,\n /\n Workaround warning: The Aria.Button does not support \"aria-disabled\"\n * by now, so this Button will be visually disabled via CSS.\n */\n ariaDisabled && styles.ariaDisabled,\n );\n\n useAriaAnnounceActionState(\n isPending\n ? \"isPending\"\n : isSucceeded\n ? \"isSucceeded\"\n : isFailed\n ? \"isFailed\"\n : \"isIdle\",\n );\n\n const propsContext: PropsContext = {\n Icon: {\n className: styles.icon,\n \"aria-hidden\": true,\n size,\n },\n Text: {\n className: styles.text,\n },\n Avatar: {\n className: styles.avatar,\n },\n CounterBadge: {\n className: styles.counterBadge,\n },\n Image: {\n className: styles.image,\n },\n };\n\n const StateIconComponent = isSucceeded\n ? IconSucceeded\n : isFailed\n ? IconFailed\n : isPending\n ? LoadingSpinner\n : undefined;\n\n const stateIcon = StateIconComponent && (\n <StateIconComponent\n size={size}\n className={styles.stateIcon}\n status={isFailed ? \"danger\" : isSucceeded ? \"success\" : undefined}\n />\n );\n\n const isStringContent = typeof children === \"string\";\n\n return (\n <Aria.Button\n className={rootClassName}\n ref={ref}\n slot={slot}\n data-readonly={~~isReadOnly~~}\n {...restProps}\n >\n <PropsContextProvider props={propsContext}>\n <Wrap if={!unstyled}>\n <span className={styles.content}>\n <Wrap if={isStringContent}>\n <Text className={styles.text}>{children}</Text>\n </Wrap>\n </span>\n </Wrap>\n </PropsContextProvider>\n {stateIcon}\n </Aria.Button>\n );\n});\n\nexport default Button;\n"],"names":[],"mappings":"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~~MACA~~,eAAA,~~EAAe~~,~~UAAA~~;AAAA,~~MACd~~,GAAG,SAAA;AAAA,MAEJ,QAAA,EAAA;AAAA,wBAAA,GAAA,CAAC,oBAAA,EAAA,EAAqB,KAAA,EAAO,YAAA,EAC3B,QAAA,kBAAA,GAAA,CAAC,IAAA,EAAA,EAAK,EAAA,EAAI,CAAC,QAAA,EACT,QAAA,kBAAA,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAW,MAAA,CAAO,OAAA,EACtB,8BAAC,IAAA,EAAA,EAAK,EAAA,EAAI,eAAA,EACR,QAAA,kBAAA,GAAA,CAAC,IAAA,EAAA,EAAK,SAAA,EAAW,MAAA,CAAO,IAAA,EAAO,QAAA,EAAS,CAAA,EAC1C,CAAA,EACF,CAAA,EACF,CAAA,EACF,CAAA;AAAA,QACC;AAAA;AAAA;AAAA,GACH;AAEJ,CAAC;;;;"}
1	+ {"version":3,"file":"Button.mjs","sources":["../../../../../../src/components/Button/Button.tsx"],"sourcesContent":["import type { PropsWithChildren } from \"react\";\nimport styles from \"./Button.module.scss\";\nimport * as Aria from \"react-aria-components\";\nimport clsx from \"clsx\";\nimport type { PropsContext } from \"@/lib/propsContext\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport { IconFailed, IconSucceeded } from \"@/components/Icon/components/icons\";\nimport { Wrap } from \"@/components/Wrap\";\nimport { Text } from \"@/components/Text\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport LoadingSpinner from \"@/components/LoadingSpinner/LoadingSpinner\";\nimport { useAriaAnnounceActionState } from \"@/components/Action/lib/ariaLive\";\n\nexport interface ButtonProps\n extends PropsWithChildren<Aria.ButtonProps>,\n FlowComponentProps<HTMLButtonElement> {\n /** Slot for button placement in action groups. /\n slot?: string;\n /* The color of the button. @default \"primary\" /\n color?: \"primary\" \| \"accent\" \| \"secondary\" \| \"danger\" \| \"dark\" \| \"light\";\n /* The visual variant of the button. @default \"solid\" /\n variant?: \"plain\" \| \"solid\" \| \"soft\" \| \"outline\";\n /* The size of the button. @default \"m\" /\n size?: \"m\" \| \"s\";\n /* Disables button but keeps it focusable. /\n \"aria-disabled\"?: boolean;\n /* Whether the button is in a pending state. /\n isPending?: boolean;\n /* Whether the button is in a succeeded state. /\n isSucceeded?: boolean;\n /* Whether the button is in a failed state. /\n isFailed?: boolean;\n /* Whether the button is in a read only state. /\n isReadOnly?: boolean;\n /* @internal /\n unstyled?: boolean;\n /* @internal /\n ariaSlot?: string \| null;\n}\n\nconst disablePendingProps = (props: ButtonProps) => {\n if (\n props.isPending \|\|\n props.isSucceeded \|\|\n props.isFailed \|\|\n props[\"aria-disabled\"] \|\|\n props.isReadOnly\n ) {\n props = { ...props };\n props.onPress = undefined;\n props.onPressStart = undefined;\n props.onPressEnd = undefined;\n props.onPressChange = undefined;\n props.onPressUp = undefined;\n props.onKeyDown = undefined;\n props.onKeyUp = undefined;\n props.type = \"button\";\n }\n\n return props;\n};\n\n/* @flr-generate all /\nexport const Button = flowComponent(\"Button\", (props) => {\n props = disablePendingProps(props);\n\n const {\n color = \"primary\",\n variant = \"solid\",\n children,\n className,\n size = \"m\",\n isPending,\n isSucceeded,\n isFailed,\n \"aria-disabled\": ariaDisabled,\n ref,\n slot: ignoredSlotProp,\n ariaSlot: slot,\n unstyled,\n isReadOnly,\n ...restProps\n } = props;\n\n const rootClassName = unstyled\n ? className\n : clsx(\n styles.button,\n isPending && styles.isPending,\n isSucceeded && styles.isSucceeded,\n isFailed && styles.isFailed,\n styles[`size-${size}`],\n styles[color],\n styles[variant],\n className,\n /\n Workaround warning: The Aria.Button does not support \"aria-disabled\"\n * by now, so this Button will be visually disabled via CSS.\n */\n ariaDisabled && styles.ariaDisabled,\n );\n\n useAriaAnnounceActionState(\n isPending\n ? \"isPending\"\n : isSucceeded\n ? \"isSucceeded\"\n : isFailed\n ? \"isFailed\"\n : \"isIdle\",\n );\n\n const propsContext: PropsContext = {\n Icon: {\n className: styles.icon,\n \"aria-hidden\": true,\n size,\n },\n Text: {\n className: styles.text,\n },\n Avatar: {\n className: styles.avatar,\n },\n CounterBadge: {\n className: styles.counterBadge,\n },\n Image: {\n className: styles.image,\n },\n };\n\n const StateIconComponent = isSucceeded\n ? IconSucceeded\n : isFailed\n ? IconFailed\n : isPending\n ? LoadingSpinner\n : undefined;\n\n const stateIcon = StateIconComponent && (\n <StateIconComponent\n size={size}\n className={styles.stateIcon}\n status={isFailed ? \"danger\" : isSucceeded ? \"success\" : undefined}\n />\n );\n\n const isStringContent = typeof children === \"string\";\n\n return (\n <Aria.Button\n className={rootClassName}\n ref={ref}\n slot={slot}\n {...(isReadOnly === true ? { \"data-readonly\": true } : {})}\n {...restProps}\n >\n <PropsContextProvider props={propsContext}>\n <Wrap if={!unstyled}>\n <span className={styles.content}>\n <Wrap if={isStringContent}>\n <Text className={styles.text}>{children}</Text>\n </Wrap>\n </span>\n </Wrap>\n </PropsContextProvider>\n {stateIcon}\n </Aria.Button>\n );\n});\n\nexport default Button;\n"],"names":[],"mappings":"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"}

package/dist/js/components/src/components/CartesianChart/CartesianChart.mjs CHANGED Viewed

@@ -2,12 +2,116 @@
 /* */
 import { jsx, jsxs } from 'react/jsx-runtime';
 import * as Recharts from 'recharts';
-import { Children, cloneElement, useRef, useState, useEffect } from 'react';
-import { Area } from './components/Area/Area.mjs';
+import { Children, useRef, useState, useEffect } from 'react';
 import clsx from 'clsx';
 import styles from './CartesianChart.module.scss.mjs';
 import { Wrap } from '../Wrap/Wrap.mjs';
+import '../AccentBox/AccentBox.mjs';
+import '../../lib/propsContext/propsContext.mjs';
+import '../../lib/propsContext/components/PropsContextProvider.mjs';
+import '../Button/Button.mjs';
+import '@tabler/icons-react';
+import '../Icon/Icon.mjs';
+import '../../views/IconView.mjs';
+import '@mittwald/react-tunnel';
+import '../SuspenseTrigger/SuspenseTrigger.mjs';
+import 'react-aria';
+import '../Action/Action.mjs';
+import '@react-aria/live-announcer';
+import '../ActionGroup/ActionGroup.mjs';
+import '../Alert/Alert.mjs';
+import '../AlertBadge/AlertBadge.mjs';
+import '../Align/Align.mjs';
+import '../Autocomplete/Autocomplete.mjs';
+import '../Avatar/Avatar.mjs';
+import '../Badge/Badge.mjs';
+import 'react-aria-components';
+import 'mobx';
+import '../../lib/controller/overlay/context.mjs';
+import 'remeda';
+import '@react-aria/utils';
+import 'dot-prop';
+import '../Heading/Heading.mjs';
+import '../Text/Text.mjs';
 import { CartesianGrid } from './components/CartesianGrid/CartesianGrid.mjs';
+import '../Checkbox/Checkbox.mjs';
+import '../CheckboxButton/CheckboxButton.mjs';
+import '../CheckboxGroup/CheckboxGroup.mjs';
+import '../../lib/propsContext/inherit/PropsContextLevelProvider.mjs';
+import 'react-syntax-highlighter';
+import '../CopyButton/CopyButton.mjs';
+import '../ColumnLayout/ColumnLayout.mjs';
+import '../ComboBox/ComboBox.mjs';
+import '../../lib/propsContext/components/ComponentPropsContextProvider.mjs';
+import '../Content/Content.mjs';
+import '../ContextMenu/ContextMenu.mjs';
+import '../MenuItem/MenuItem.mjs';
+import '../ContextMenu/components/ContextMenuTrigger/ContextMenuTrigger.mjs';
+import '../ContextMenu/components/ContextMenuSection/ContextMenuSection.mjs';
+import '../ContextualHelp/ContextualHelp.mjs';
+import '../ContextualHelp/components/ContextualHelpTrigger/ContextualHelpTrigger.mjs';
+import '../CounterBadge/CounterBadge.mjs';
+import '../CountryOptions/CountryOptions.mjs';
+import '../DatePicker/DatePicker.mjs';
+import '../DateRangePicker/DateRangePicker.mjs';
+import '../FieldDescription/FieldDescription.mjs';
+import '../FieldError/FieldError.mjs';
+import '../FileCard/FileCard.mjs';
+import '../FileCardList/FileCardList.mjs';
+import '../FileDropZone/FileDropZone.mjs';
+import '../FileField/FileField.mjs';
+import '../Header/Header.mjs';
+import '../Image/Image.mjs';
+import '../Initials/Initials.mjs';
+import '../Label/Label.mjs';
+import '../LayoutCard/LayoutCard.mjs';
+import '../OverlayTrigger/components/MenuTrigger/MenuTrigger.mjs';
+import '../../views/DialogTriggerView.mjs';
+import '../LightBox/LightBox.mjs';
+import '../Link/Link.mjs';
+import 'invariant';
+import '../../views/ListItemViewContentView.mjs';
+import '../../views/ButtonView.mjs';
+import '../../views/ContextMenuTriggerView.mjs';
+import '../List/components/ListSummary/ListSummary.mjs';
+import '../List/listContext.mjs';
+import '../List/List.mjs';
+import 'react-markdown';
+import 'remark-gfm';
+import '../MarkdownEditor/MarkdownEditor.mjs';
+import '../Message/Message.mjs';
+import '../MessageThread/MessageThread.mjs';
+import '../Modal/Modal.mjs';
+import '../Navigation/Navigation.mjs';
+import '../Navigation/components/NavigationGroup/NavigationGroup.mjs';
+import '../NotificationProvider/NotificationProvider.mjs';
+import 'luxon';
+import '../NumberField/NumberField.mjs';
+import '../Option/Option.mjs';
+import '../../views/OverlayContentView.mjs';
+import '../../views/ClearPropsContextView.mjs';
+import '../../views/LoadingSpinnerView.mjs';
+import '../PasswordCreationField/PasswordCreationField.mjs';
+import '../Popover/components/PopoverTrigger/PopoverTrigger.mjs';
+import '../Popover/Popover.mjs';
+import '../ProgressBar/ProgressBar.mjs';
+import '../RadioGroup/RadioGroup.mjs';
+import '../RadioGroup/components/Radio/Radio.mjs';
+import '../RadioGroup/components/RadioButton/RadioButton.mjs';
+import '../SearchField/SearchField.mjs';
+import '../Section/Section.mjs';
+import '../SegmentedControl/SegmentedControl.mjs';
+import '../SegmentedControl/components/Segment/Segment.mjs';
+import '../Select/Select.mjs';
+import '../SettingsProvider/SettingsProvider.mjs';
+import '../Slider/Slider.mjs';
+import '../Switch/Switch.mjs';
+import '../Tabs/Tabs.mjs';
+import '../Tabs/components/Tab/context.mjs';
+import '../TextArea/TextArea.mjs';
+import '../TextField/TextField.mjs';
+import '../TimeField/TimeField.mjs';
+import '../TranslationProvider/TranslationProvider.mjs';
 const CartesianChart = (props) => {
   const {
@@ -20,28 +124,13 @@ const CartesianChart = (props) => {
     ...rest
   } = props;
   const rootClassName = clsx(styles.cartesianChart, className);
-  const areasWithoutDots = [];
-  const areasWithDots = [];
   const otherChildren = [];
   const gridChildren = [];
-  Children.forEach(children, (child, index) => {
+  Children.forEach(children, (child) => {
     if (!child) return;
     const element = child;
     if (element.type === CartesianGrid) {
       gridChildren.push(element);
-    } else if (element.type === Area) {
-      areasWithoutDots.push(
-        cloneElement(element, {
-          onlyDots: false,
-          key: `area-${index}`
-        })
-      );
-      areasWithDots.push(
-        cloneElement(element, {
-          onlyDots: true,
-          key: `area-dots-${index}`
-        })
-      );
     } else {
       otherChildren.push(element);
     }
@@ -79,13 +168,19 @@ const CartesianChart = (props) => {
     {
       style: { height, flex: flexGrow ? 1 : void 0 },
       ref: chartContainerRef,
-      children: /* @__PURE__ */ jsx(Recharts.ResponsiveContainer, { children: /* @__PURE__ */ jsxs(Recharts.AreaChart, { data, className: rootClassName, ...rest, children: [
-        !showEmptyView && gridChildren,
-        areasWithoutDots,
-        otherChildren,
-        areasWithDots,
-        showEmptyView && viewDimensions && /* @__PURE__ */ jsx("foreignObject", { ...viewDimensions, children: /* @__PURE__ */ jsx("div", { className: styles.emptyViewContainer, children: /* @__PURE__ */ jsx(EmptyView, { data }) }) })
-      ] }) })
+      children: /* @__PURE__ */ jsx(Recharts.ResponsiveContainer, { children: /* @__PURE__ */ jsxs(
+        Recharts.ComposedChart,
+        {
+          data,
+          className: rootClassName,
+          ...rest,
+          children: [
+            !showEmptyView && gridChildren,
+            otherChildren,
+            showEmptyView && viewDimensions && /* @__PURE__ */ jsx("foreignObject", { ...viewDimensions, children: /* @__PURE__ */ jsx("div", { className: styles.emptyViewContainer, children: /* @__PURE__ */ jsx(EmptyView, { data }) }) })
+          ]
+        }
+      ) })
     }
   ) });
 };

package/dist/js/components/src/components/CartesianChart/CartesianChart.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CartesianChart.mjs","sources":["../../../../../../src/components/CartesianChart/CartesianChart.tsx"],"sourcesContent":["import * as Recharts from \"recharts\";\nimport ~~type { CategoricalChartProps } from \"recharts/types/chart/generateCategoricalChart\";\nimport~~ React, {\n Children,\n ~~cloneElement,\n~~ useEffect,\n useRef,\n useState,\n type FC,\n type PropsWithChildren,\n type ReactElement,\n type SVGProps,\n} from \"react\";\nimport ~~{ Area, type AreaProps } from \"./components/Area\";\nimport~~ clsx from \"clsx\";\nimport styles from \"./CartesianChart.module.scss\";\nimport Wrap from \"../Wrap\";\nimport { CartesianGrid } from \"~~@/components/CartesianChart/components/CartesianGrid~~\";\n\nexport interface CartesianChartEmptyViewProps {\n data?: ~~CategoricalChartProps~~[\"data\"];\n}\n\nexport interface CartesianChartProps\n extends Pick<\n ~~CategoricalChartProps,\~~n \"data\" \| \"className\" \| \"syncId\" \| \"syncMethod\"\n >,\n PropsWithChildren {\n height?: string;\n /** View that is provided when data is empty/undefined /\n emptyView?: React.ComponentType<CartesianChartEmptyViewProps>;\n /\n Allow the height controlling container to set flex-grow: 1. Can only be\n * used in combination with `height`\n /\n flexGrow?: boolean;\n}\n\n/* @flr-generate all */\nexport const CartesianChart: FC<CartesianChartProps> = (props) => {\n const {\n children,\n data,\n className,\n height,\n flexGrow,\n emptyView: EmptyView,\n ...rest\n } = props;\n const rootClassName = clsx(styles.cartesianChart, className);\n\n ~~// render order: grid, areas without dots, other children, areas with dots\n // this is needed to ensure that the dots will always overlay the areas\n~~ const ~~areasWithoutDots: ReactElement[] = [];\n const areasWithDots: ReactElement[] = [];\n const~~ otherChildren: ReactElement[] = [];\n const gridChildren: ReactElement[] = [];\n\n Children.forEach(children, (child~~, index~~) => {\n if (!child) return;\n const element = child as ReactElement;\n\n if (element.type === CartesianGrid) {\n gridChildren.push(element);\n } else ~~if (element.type === Area)~~ {\n areasWithoutDots.push(\n cloneElement(element as ReactElement<AreaProps>, {\n onlyDots: false,\n key: `area-${index}`,\n }),\n );\n areasWithDots.push(\n cloneElement(element as ReactElement<AreaProps>, {\n onlyDots: true,\n key: `area-dots-${index}`,\n }),\n );\n } else {\n otherChildren.push(element);\n }\n });\n\n const showEmptyView = (!data \|\| data.length === 0) && EmptyView;\n\n const chartContainerRef = useRef<HTMLDivElement>(null);\n const [viewDimensions, setViewDimensions] = useState<Partial<\n SVGProps<SVGForeignObjectElement>\n > \| null>(null);\n\n // resizing the foreignObject for the EmptyView on size changes\n useEffect(() => {\n if (showEmptyView) {\n const updateDimensions = () => {\n const svg = chartContainerRef.current?.querySelector(\n \"svg\",\n ) as SVGSVGElement \| null;\n if (!svg) return;\n\n const clip = svg.querySelector(\"clipPath rect\");\n if (clip) {\n const x = parseFloat(clip.getAttribute(\"x\") ?? \"0\");\n const y = parseFloat(clip.getAttribute(\"y\") ?? \"0\");\n const width = parseFloat(clip.getAttribute(\"width\") ?? \"0\");\n const height = parseFloat(clip.getAttribute(\"height\") ?? \"0\");\n setViewDimensions({ x, y, width, height });\n }\n };\n\n updateDimensions();\n\n const container = chartContainerRef.current;\n const observer = new ResizeObserver(updateDimensions);\n if (container) observer.observe(container);\n\n return () => {\n observer.disconnect();\n };\n }\n }, []);\n\n return (\n <Wrap if={height}>\n <div\n style={{ height, flex: flexGrow ? 1 : undefined }}\n ref={chartContainerRef}\n >\n <Recharts.ResponsiveContainer>\n <Recharts.~~AreaChart~~ data={data} className={rootClassName} {...rest}>\n {!showEmptyView && gridChildren}\n {~~areasWithoutDots}\n {~~otherChildren}\n {~~areasWithDots}\n {~~showEmptyView && viewDimensions && (\n <foreignObject {...viewDimensions}>\n <div className={styles.emptyViewContainer}>\n <EmptyView data={data} />\n </div>\n </foreignObject>\n )}\n </Recharts.~~AreaChart~~>\n </Recharts.ResponsiveContainer>\n </div>\n </Wrap>\n );\n};\n\nexport default CartesianChart;\n"],"names":["height"],"mappings":"~~;;;;;;;;;AAwCO~~,MAAM,cAAA,GAA0C,CAAC,KAAA,KAAU;AAChE,EAAA,MAAM;AAAA,IACJ,QAAA;AAAA,IACA,IAAA;AAAA,IACA,SAAA;AAAA,IACA,MAAA;AAAA,IACA,QAAA;AAAA,IACA,SAAA,EAAW,SAAA;AAAA,IACX,GAAG;AAAA,GACL,GAAI,KAAA;AACJ,EAAA,MAAM,aAAA,GAAgB,IAAA,CAAK,MAAA,CAAO,cAAA,EAAgB,SAAS,CAAA;~~AAI3D~~,EAAA,MAAM,~~mBAAmC,EAAC;AAC1C,EAAA,MAAM,~~gBAAgC,EAAC;AACvC,EAAA,MAAM,~~gBAAgC,EAAC;AACvC,EAAA,MAAM,~~eAA+B,EAAC;AAEtC,EAAA,QAAA,CAAS,OAAA,CAAQ,QAAA,EAAU,CAAC,KAAA,~~EAAO,KAAA,~~KAAU;~~AAC3C~~,IAAA,IAAI,CAAC,KAAA,EAAO;AACZ,IAAA,MAAM,OAAA,GAAU,KAAA;AAEhB,IAAA,IAAI,OAAA,CAAQ,SAAS,aAAA,EAAe;AAClC,MAAA,YAAA,CAAa,KAAK,OAAO,CAAA;AAAA,IAC3B,CAAA,MAAA,IAAW,OAAA,CAAQ,IAAA,KAAS,IAAA,EAAM;AAChC,MAAA,gBAAA,CAAiB,IAAA;AAAA,QACf,aAAa,OAAA,EAAoC;AAAA,UAC/C,QAAA,EAAU,KAAA;AAAA,UACV,GAAA,EAAK,QAAQ,KAAK,CAAA;AAAA,SACnB;AAAA,OACH;AACA,MAAA,aAAA,CAAc,IAAA;AAAA,QACZ,aAAa,OAAA,EAAoC;AAAA,UAC/C,QAAA,EAAU,IAAA;AAAA,UACV,GAAA,EAAK,aAAa,KAAK,CAAA;AAAA,SACxB;AAAA,OACH;AAAA,IACF,CAAA,MAAO;AACL,MAAA,aAAA,CAAc,KAAK,OAAO,CAAA;AAAA,IAC5B;AAAA,EACF,CAAC,CAAA;AAED,EAAA,MAAM,aAAA,GAAA,CAAiB,CAAC,IAAA,IAAQ,IAAA,CAAK,WAAW,CAAA,KAAM,SAAA;AAEtD,EAAA,MAAM,iBAAA,GAAoB,OAAuB,IAAI,CAAA;AACrD,EAAA,MAAM,CAAC,cAAA,EAAgB,iBAAiB,CAAA,GAAI,SAElC,IAAI,CAAA;AAGd,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,IAAI,aAAA,EAAe;AACjB,MAAA,MAAM,mBAAmB,MAAM;AAC7B,QAAA,MAAM,GAAA,GAAM,kBAAkB,OAAA,EAAS,aAAA;AAAA,UACrC;AAAA,SACF;AACA,QAAA,IAAI,CAAC,GAAA,EAAK;AAEV,QAAA,MAAM,IAAA,GAAO,GAAA,CAAI,aAAA,CAAc,eAAe,CAAA;AAC9C,QAAA,IAAI,IAAA,EAAM;AACR,UAAA,MAAM,IAAI,UAAA,CAAW,IAAA,CAAK,YAAA,CAAa,GAAG,KAAK,GAAG,CAAA;AAClD,UAAA,MAAM,IAAI,UAAA,CAAW,IAAA,CAAK,YAAA,CAAa,GAAG,KAAK,GAAG,CAAA;AAClD,UAAA,MAAM,QAAQ,UAAA,CAAW,IAAA,CAAK,YAAA,CAAa,OAAO,KAAK,GAAG,CAAA;AAC1D,UAAA,MAAMA,UAAS,UAAA,CAAW,IAAA,CAAK,YAAA,CAAa,QAAQ,KAAK,GAAG,CAAA;AAC5D,UAAA,iBAAA,CAAkB,EAAE,CAAA,EAAG,CAAA,EAAG,KAAA,EAAO,MAAA,EAAAA,SAAQ,CAAA;AAAA,QAC3C;AAAA,MACF,CAAA;AAEA,MAAA,gBAAA,EAAiB;AAEjB,MAAA,MAAM,YAAY,iBAAA,CAAkB,OAAA;AACpC,MAAA,MAAM,QAAA,GAAW,IAAI,cAAA,CAAe,gBAAgB,CAAA;AACpD,MAAA,IAAI,SAAA,EAAW,QAAA,CAAS,OAAA,CAAQ,SAAS,CAAA;AAEzC,MAAA,OAAO,MAAM;AACX,QAAA,QAAA,CAAS,UAAA,EAAW;AAAA,MACtB,CAAA;AAAA,IACF;AAAA,EACF,CAAA,EAAG,EAAE,CAAA;AAEL,EAAA,uBACE,GAAA,CAAC,IAAA,EAAA,EAAK,EAAA,EAAI,MAAA,EACR,QAAA,kBAAA,GAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,OAAO,EAAE,MAAA,EAAQ,IAAA,EAAM,QAAA,GAAW,IAAI,MAAA,EAAU;AAAA,MAChD,GAAA,EAAK,iBAAA;AAAA,MAEL,QAAA,kBAAA,GAAA,CAAC,QAAA,CAAS,mBAAA,EAAT,EACC,QAAA,kBAAA,IAAA,~~CAAC~~,QAAA,CAAS,~~SAAA~~,~~EAAT~~,~~EAAmB~~,IAAA,~~EAAY~~,SAAA,EAAW,aAAA,~~EAAgB~~,GAAG,IAAA,~~EAC3D~~,QAAA,EAAA;AAAA,~~QAAA~~,CAAC,aAAA,IAAiB,YAAA;AAAA,~~QAClB~~,~~gBAAA;AAAA,QACA,~~aAAA;AAAA,~~QACA~~,aAAA~~;AAAA~~,~~QACA,aAAA,~~IAAiB,cAAA,oBAChB,GAAA,CAAC,eAAA,EAAA,EAAe,GAAG,cAAA,EACjB,QAAA,kBAAA,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,OAAO,kBAAA,EACrB,QAAA,kBAAA,GAAA,CAAC,SAAA,EAAA,EAAU,IAAA,EAAY,GACzB,CAAA,EACF;AAAA,~~OAAA~~,~~EAEJ,CAAA,~~EACF;AAAA;AAAA,GACF,EACF,CAAA;AAEJ;;;;"}
1	+ {"version":3,"file":"CartesianChart.mjs","sources":["../../../../../../src/components/CartesianChart/CartesianChart.tsx"],"sourcesContent":["import * as Recharts from \"recharts\";\nimport React, {\n Children,\n useEffect,\n useRef,\n useState,\n type ComponentProps,\n type FC,\n type PropsWithChildren,\n type ReactElement,\n type SVGProps,\n} from \"react\";\nimport clsx from \"clsx\";\nimport styles from \"./CartesianChart.module.scss\";\nimport Wrap from \"../Wrap\";\nimport { CartesianGrid } from \"../public\";\n\nexport interface CartesianChartEmptyViewProps {\n data?: ComponentProps<typeof Recharts.ComposedChart>[\"data\"];\n}\n\nexport interface CartesianChartProps\n extends Pick<\n ComponentProps<typeof Recharts.ComposedChart>,\n \"data\" \| \"className\" \| \"syncId\" \| \"syncMethod\"\n >,\n PropsWithChildren {\n height?: string;\n /** View that is provided when data is empty/undefined /\n emptyView?: React.ComponentType<CartesianChartEmptyViewProps>;\n /\n Allow the height controlling container to set flex-grow: 1. Can only be\n * used in combination with `height`\n /\n flexGrow?: boolean;\n}\n\n/* @flr-generate all */\nexport const CartesianChart: FC<CartesianChartProps> = (props) => {\n const {\n children,\n data,\n className,\n height,\n flexGrow,\n emptyView: EmptyView,\n ...rest\n } = props;\n const rootClassName = clsx(styles.cartesianChart, className);\n\n const otherChildren: ReactElement[] = [];\n const gridChildren: ReactElement[] = [];\n\n Children.forEach(children, (child) => {\n if (!child) return;\n const element = child as ReactElement;\n\n if (element.type === CartesianGrid) {\n gridChildren.push(element);\n } else {\n otherChildren.push(element);\n }\n });\n\n const showEmptyView = (!data \|\| data.length === 0) && EmptyView;\n\n const chartContainerRef = useRef<HTMLDivElement>(null);\n const [viewDimensions, setViewDimensions] = useState<Partial<\n SVGProps<SVGForeignObjectElement>\n > \| null>(null);\n\n // resizing the foreignObject for the EmptyView on size changes\n useEffect(() => {\n if (showEmptyView) {\n const updateDimensions = () => {\n const svg = chartContainerRef.current?.querySelector(\n \"svg\",\n ) as SVGSVGElement \| null;\n if (!svg) return;\n\n const clip = svg.querySelector(\"clipPath rect\");\n if (clip) {\n const x = parseFloat(clip.getAttribute(\"x\") ?? \"0\");\n const y = parseFloat(clip.getAttribute(\"y\") ?? \"0\");\n const width = parseFloat(clip.getAttribute(\"width\") ?? \"0\");\n const height = parseFloat(clip.getAttribute(\"height\") ?? \"0\");\n setViewDimensions({ x, y, width, height });\n }\n };\n\n updateDimensions();\n\n const container = chartContainerRef.current;\n const observer = new ResizeObserver(updateDimensions);\n if (container) observer.observe(container);\n\n return () => {\n observer.disconnect();\n };\n }\n }, []);\n\n return (\n <Wrap if={height}>\n <div\n style={{ height, flex: flexGrow ? 1 : undefined }}\n ref={chartContainerRef}\n >\n <Recharts.ResponsiveContainer>\n <Recharts.ComposedChart\n data={data}\n className={rootClassName}\n {...rest}\n >\n {!showEmptyView && gridChildren}\n {otherChildren}\n {showEmptyView && viewDimensions && (\n <foreignObject {...viewDimensions}>\n <div className={styles.emptyViewContainer}>\n <EmptyView data={data} />\n </div>\n </foreignObject>\n )}\n </Recharts.ComposedChart>\n </Recharts.ResponsiveContainer>\n </div>\n </Wrap>\n );\n};\n\nexport default CartesianChart;\n"],"names":["height"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAsCO,MAAM,cAAA,GAA0C,CAAC,KAAA,KAAU;AAChE,EAAA,MAAM;AAAA,IACJ,QAAA;AAAA,IACA,IAAA;AAAA,IACA,SAAA;AAAA,IACA,MAAA;AAAA,IACA,QAAA;AAAA,IACA,SAAA,EAAW,SAAA;AAAA,IACX,GAAG;AAAA,GACL,GAAI,KAAA;AACJ,EAAA,MAAM,aAAA,GAAgB,IAAA,CAAK,MAAA,CAAO,cAAA,EAAgB,SAAS,CAAA;AAE3D,EAAA,MAAM,gBAAgC,EAAC;AACvC,EAAA,MAAM,eAA+B,EAAC;AAEtC,EAAA,QAAA,CAAS,OAAA,CAAQ,QAAA,EAAU,CAAC,KAAA,KAAU;AACpC,IAAA,IAAI,CAAC,KAAA,EAAO;AACZ,IAAA,MAAM,OAAA,GAAU,KAAA;AAEhB,IAAA,IAAI,OAAA,CAAQ,SAAS,aAAA,EAAe;AAClC,MAAA,YAAA,CAAa,KAAK,OAAO,CAAA;AAAA,IAC3B,CAAA,MAAO;AACL,MAAA,aAAA,CAAc,KAAK,OAAO,CAAA;AAAA,IAC5B;AAAA,EACF,CAAC,CAAA;AAED,EAAA,MAAM,aAAA,GAAA,CAAiB,CAAC,IAAA,IAAQ,IAAA,CAAK,WAAW,CAAA,KAAM,SAAA;AAEtD,EAAA,MAAM,iBAAA,GAAoB,OAAuB,IAAI,CAAA;AACrD,EAAA,MAAM,CAAC,cAAA,EAAgB,iBAAiB,CAAA,GAAI,SAElC,IAAI,CAAA;AAGd,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,IAAI,aAAA,EAAe;AACjB,MAAA,MAAM,mBAAmB,MAAM;AAC7B,QAAA,MAAM,GAAA,GAAM,kBAAkB,OAAA,EAAS,aAAA;AAAA,UACrC;AAAA,SACF;AACA,QAAA,IAAI,CAAC,GAAA,EAAK;AAEV,QAAA,MAAM,IAAA,GAAO,GAAA,CAAI,aAAA,CAAc,eAAe,CAAA;AAC9C,QAAA,IAAI,IAAA,EAAM;AACR,UAAA,MAAM,IAAI,UAAA,CAAW,IAAA,CAAK,YAAA,CAAa,GAAG,KAAK,GAAG,CAAA;AAClD,UAAA,MAAM,IAAI,UAAA,CAAW,IAAA,CAAK,YAAA,CAAa,GAAG,KAAK,GAAG,CAAA;AAClD,UAAA,MAAM,QAAQ,UAAA,CAAW,IAAA,CAAK,YAAA,CAAa,OAAO,KAAK,GAAG,CAAA;AAC1D,UAAA,MAAMA,UAAS,UAAA,CAAW,IAAA,CAAK,YAAA,CAAa,QAAQ,KAAK,GAAG,CAAA;AAC5D,UAAA,iBAAA,CAAkB,EAAE,CAAA,EAAG,CAAA,EAAG,KAAA,EAAO,MAAA,EAAAA,SAAQ,CAAA;AAAA,QAC3C;AAAA,MACF,CAAA;AAEA,MAAA,gBAAA,EAAiB;AAEjB,MAAA,MAAM,YAAY,iBAAA,CAAkB,OAAA;AACpC,MAAA,MAAM,QAAA,GAAW,IAAI,cAAA,CAAe,gBAAgB,CAAA;AACpD,MAAA,IAAI,SAAA,EAAW,QAAA,CAAS,OAAA,CAAQ,SAAS,CAAA;AAEzC,MAAA,OAAO,MAAM;AACX,QAAA,QAAA,CAAS,UAAA,EAAW;AAAA,MACtB,CAAA;AAAA,IACF;AAAA,EACF,CAAA,EAAG,EAAE,CAAA;AAEL,EAAA,uBACE,GAAA,CAAC,IAAA,EAAA,EAAK,EAAA,EAAI,MAAA,EACR,QAAA,kBAAA,GAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,OAAO,EAAE,MAAA,EAAQ,IAAA,EAAM,QAAA,GAAW,IAAI,MAAA,EAAU;AAAA,MAChD,GAAA,EAAK,iBAAA;AAAA,MAEL,QAAA,kBAAA,GAAA,CAAC,QAAA,CAAS,mBAAA,EAAT,EACC,QAAA,kBAAA,IAAA;AAAA,QAAC,QAAA,CAAS,aAAA;AAAA,QAAT;AAAA,UACC,IAAA;AAAA,UACA,SAAA,EAAW,aAAA;AAAA,UACV,GAAG,IAAA;AAAA,UAEH,QAAA,EAAA;AAAA,YAAA,CAAC,aAAA,IAAiB,YAAA;AAAA,YAClB,aAAA;AAAA,YACA,aAAA,IAAiB,cAAA,oBAChB,GAAA,CAAC,eAAA,EAAA,EAAe,GAAG,cAAA,EACjB,QAAA,kBAAA,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,OAAO,kBAAA,EACrB,QAAA,kBAAA,GAAA,CAAC,SAAA,EAAA,EAAU,IAAA,EAAY,GACzB,CAAA,EACF;AAAA;AAAA;AAAA,OAEJ,EACF;AAAA;AAAA,GACF,EACF,CAAA;AAEJ;;;;"}

package/dist/js/components/src/components/CartesianChart/components/Area/Area.mjs CHANGED Viewed

@@ -7,23 +7,17 @@ import tokens from '../../../../../../design-tokens/dist/variables.json.mjs';
 import { AreaDot } from '../AreaDot/AreaDot.mjs';
 const Area = (props) => {
-  const {
-    color = "sea-green",
-    stackId = 1,
-    fillOpacity = 1,
-    onlyDots = true,
-    ...rest
-  } = props;
+  const { color = "sea-green", stackId = 1, fillOpacity = 1, ...rest } = props;
   return /* @__PURE__ */ jsx(
     Recharts.Area,
     {
       stackId,
       fillOpacity,
       ...rest,
-      activeDot: onlyDots ? /* @__PURE__ */ jsx(AreaDot, { color: `var(--color--categorical--${color})` }) : false,
-      fill: onlyDots ? "none" : `var(--color--categorical--${color})`,
-      stroke: onlyDots ? "none" : tokens.area["border-color"].value,
-      strokeWidth: onlyDots ? void 0 : tokens.area["border-width"].value
+      activeDot: /* @__PURE__ */ jsx(AreaDot, { color: `var(--color--categorical--${color})` }),
+      fill: `var(--color--categorical--${color})`,
+      stroke: tokens.area["border-color"].value,
+      strokeWidth: tokens.area["border-width"].value
     }
   );
 };

package/dist/js/components/src/components/CartesianChart/components/Area/Area.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Area.mjs","sources":["../../../../../../../../src/components/CartesianChart/components/Area/Area.tsx"],"sourcesContent":["import { type FC } from \"react\";\nimport * as Recharts from \"recharts\";\nimport tokens from \"@mittwald/flow-design-tokens/variables.json\";\nimport { AreaDot } from \"../AreaDot\";\nimport type { CategoricalColor } from \"@/lib/tokens/CategoricalColors\";\n\nexport interface AreaProps\n extends Pick<\n Recharts.AreaProps,\n \| \"className\"\n \| \"dataKey\"\n \| \"stackId\"\n \| \"fillOpacity\"\n \| \"key\"\n \| \"xAxisId\"\n \| \"yAxisId\"\n \| \"type\"\n \| \"unit\"\n > {\n /** The color of the area. @default \"sea-green\" /\n color?: CategoricalColor;\n ~~/* @internal /\n onlyDots?: boolean;\n~~}\n\n/* @flr-generate all */\nexport const Area: FC<AreaProps> = (props) => {\n const {\n color = \"sea-green\"~~,\n~~ stackId = 1~~,\n~~ fillOpacity = 1~~,\n onlyDots~~ ~~= true,\n~~ ...rest\n } = props;\n\n return (\n <Recharts.Area\n stackId={stackId}\n fillOpacity={fillOpacity}\n {...rest}\n activeDot={~~\n onlyDots ? (\n~~ <AreaDot color={`var(--color--categorical--${color})`} ~~/>\n ) : (\n false\n )\n~~ }\n fill={~~onlyDots ? \"none\" :~~ `var(--color--categorical--${color})`}\n stroke={~~onlyDots ? \"none\" :~~ tokens.area[\"border-color\"].value}\n strokeWidth={~~onlyDots ? undefined :~~ tokens.area[\"border-width\"].value}\n />\n );\n};\n\nexport default Area;\n"],"names":[],"mappings":";;;;;;~~AA0BO~~,MAAM,IAAA,GAAsB,CAAC,KAAA,KAAU;AAC5C,EAAA,MAAM~~;AAAA~~,~~IACJ~~,~~KAAA~~,~~GAAQ,~~WAAA~~;AAAA~~,~~IACR~~,OAAA,GAAU,~~CAAA;AAAA~~,~~IACV,~~WAAA,GAAc,CAAA~~;AAAA~~,~~IACd~~,~~QAAA~~,~~GAAW,~~IAAA~~;AAAA~~,~~IACX~~,~~GAAG;AAAA,GACL,~~GAAI,KAAA;~~AAEJ~~,EAAA,uBACE,GAAA;AAAA,IAAC,QAAA,CAAS,IAAA;AAAA,IAAT;AAAA,MACC,OAAA;AAAA,MACA,WAAA;AAAA,MACC,GAAG,IAAA;AAAA,MACJ,~~SAAA~~,~~EACE,2BACE,~~GAAA,CAAC,OAAA,EAAA,EAAQ,~~OAAO~~,CAAA,0BAAA,EAA6B,KAAK,~~KAAK~~,CAAA,~~GAEvD~~,~~KAAA~~;AAAA,~~MAGJ~~,IAAA,EAAM,~~QAAA~~,~~GAAW,MAAA,GAAS,CAAA,0BAAA,EAA6B,~~KAAK,CAAA,CAAA,CAAA;AAAA,~~MAC5D~~,~~QAAQ,QAAA,GAAW,~~MAAA,~~GAAS~~,MAAA,CAAO,IAAA,CAAK,cAAc,CAAA,CAAE,KAAA;AAAA,~~MACxD~~,~~aAAa~~,~~QAAA~~,~~GAAW,~~MAAA,~~GAAY,MAAA,~~CAAO,IAAA,CAAK,cAAc,CAAA,CAAE;AAAA;AAAA,~~GAClE~~;AAEJ;;;;"}
1	+ {"version":3,"file":"Area.mjs","sources":["../../../../../../../../src/components/CartesianChart/components/Area/Area.tsx"],"sourcesContent":["import { type FC } from \"react\";\nimport * as Recharts from \"recharts\";\nimport tokens from \"@mittwald/flow-design-tokens/variables.json\";\nimport { AreaDot } from \"../AreaDot\";\nimport type { CategoricalColor } from \"@/lib/tokens/CategoricalColors\";\n\nexport interface AreaProps\n extends Pick<\n Recharts.AreaProps,\n \| \"className\"\n \| \"dataKey\"\n \| \"stackId\"\n \| \"fillOpacity\"\n \| \"key\"\n \| \"xAxisId\"\n \| \"yAxisId\"\n \| \"type\"\n \| \"unit\"\n > {\n /** The color of the area. @default \"sea-green\" /\n color?: CategoricalColor;\n}\n\n/* @flr-generate all */\nexport const Area: FC<AreaProps> = (props) => {\n const { color = \"sea-green\", stackId = 1, fillOpacity = 1, ...rest } = props;\n\n return (\n <Recharts.Area\n stackId={stackId}\n fillOpacity={fillOpacity}\n {...rest}\n activeDot={<AreaDot color={`var(--color--categorical--${color})`} />}\n fill={`var(--color--categorical--${color})`}\n stroke={tokens.area[\"border-color\"].value}\n strokeWidth={tokens.area[\"border-width\"].value}\n />\n );\n};\n\nexport default Area;\n"],"names":[],"mappings":";;;;;;AAwBO,MAAM,IAAA,GAAsB,CAAC,KAAA,KAAU;AAC5C,EAAA,MAAM,EAAE,QAAQ,WAAA,EAAa,OAAA,GAAU,GAAG,WAAA,GAAc,CAAA,EAAG,GAAG,IAAA,EAAK,GAAI,KAAA;AAEvE,EAAA,uBACE,GAAA;AAAA,IAAC,QAAA,CAAS,IAAA;AAAA,IAAT;AAAA,MACC,OAAA;AAAA,MACA,WAAA;AAAA,MACC,GAAG,IAAA;AAAA,MACJ,2BAAW,GAAA,CAAC,OAAA,EAAA,EAAQ,KAAA,EAAO,CAAA,0BAAA,EAA6B,KAAK,CAAA,CAAA,CAAA,EAAK,CAAA;AAAA,MAClE,IAAA,EAAM,6BAA6B,KAAK,CAAA,CAAA,CAAA;AAAA,MACxC,MAAA,EAAQ,MAAA,CAAO,IAAA,CAAK,cAAc,CAAA,CAAE,KAAA;AAAA,MACpC,WAAA,EAAa,MAAA,CAAO,IAAA,CAAK,cAAc,CAAA,CAAE;AAAA;AAAA,GAC3C;AAEJ;;;;"}

package/dist/js/components/src/components/CartesianChart/components/YAxis/YAxis.mjs CHANGED Viewed

@@ -5,7 +5,7 @@ import * as Recharts from 'recharts';
 import tokens from '../../../../../../design-tokens/dist/variables.json.mjs';
 const YAxis = (props) => {
-  const { domain = [0, (dataMax) => dataMax / 2], ...rest } = props;
+  const { domain, ...rest } = props;
   return /* @__PURE__ */ jsx(
     Recharts.YAxis,
     {

package/dist/js/components/src/components/CartesianChart/components/YAxis/YAxis.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"YAxis.mjs","sources":["../../../../../../../../src/components/CartesianChart/components/YAxis/YAxis.tsx"],"sourcesContent":["import type { FC } from \"react\";\nimport * as Recharts from \"recharts\";\nimport tokens from \"@mittwald/flow-design-tokens/variables.json\";\n\nexport type YAxisProps = Pick<\n Recharts.YAxisProps,\n \| \"className\"\n \| \"dataKey\"\n \| \"orientation\"\n \| \"allowDecimals\"\n \| \"interval\"\n \| \"minTickGap\"\n \| \"scale\"\n \| \"type\"\n \| \"domain\"\n \| \"hide\"\n \| \"unit\"\n \| \"tickFormatter\"\n>;\n\n/** @flr-generate all */\nexport const YAxis: FC<YAxisProps> = (props) => {\n const { domain ~~= [0~~, ~~(dataMax) => dataMax / 2],~~ ...rest } = props;\n\n return (\n <Recharts.YAxis\n {...rest}\n allowDataOverflow\n domain={domain}\n fontSize={tokens.axis[\"font-size\"].value}\n tick={{\n fill: tokens.axis[\"text-color\"].value,\n }}\n tickMargin={parseInt(tokens.axis.spacing.value)}\n tickSize={parseInt(tokens.axis[\"tick-size\"].value)}\n />\n );\n};\n\nexport default YAxis;\n"],"names":[],"mappings":";;;;AAqBO,MAAM,KAAA,GAAwB,CAAC,KAAA,KAAU;AAC9C,EAAA,MAAM,EAAE,MAAA,~~GAAS~~,~~CAAC,CAAA,EAAG,CAAC,OAAA,KAAY,OAAA,GAAU,CAAC,CAAA,EAAG,~~GAAG,IAAA,EAAK,GAAI,KAAA;~~AAE5D~~,EAAA,uBACE,GAAA;AAAA,IAAC,QAAA,CAAS,KAAA;AAAA,IAAT;AAAA,MACE,GAAG,IAAA;AAAA,MACJ,iBAAA,EAAiB,IAAA;AAAA,MACjB,MAAA;AAAA,MACA,QAAA,EAAU,MAAA,CAAO,IAAA,CAAK,WAAW,CAAA,CAAE,KAAA;AAAA,MACnC,IAAA,EAAM;AAAA,QACJ,IAAA,EAAM,MAAA,CAAO,IAAA,CAAK,YAAY,CAAA,CAAE;AAAA,OAClC;AAAA,MACA,UAAA,EAAY,QAAA,CAAS,MAAA,CAAO,IAAA,CAAK,QAAQ,KAAK,CAAA;AAAA,MAC9C,UAAU,QAAA,CAAS,MAAA,CAAO,IAAA,CAAK,WAAW,EAAE,KAAK;AAAA;AAAA,GACnD;AAEJ;;;;"}
1	+ {"version":3,"file":"YAxis.mjs","sources":["../../../../../../../../src/components/CartesianChart/components/YAxis/YAxis.tsx"],"sourcesContent":["import type { FC } from \"react\";\nimport * as Recharts from \"recharts\";\nimport tokens from \"@mittwald/flow-design-tokens/variables.json\";\n\nexport type YAxisProps = Pick<\n Recharts.YAxisProps,\n \| \"className\"\n \| \"dataKey\"\n \| \"orientation\"\n \| \"allowDecimals\"\n \| \"interval\"\n \| \"minTickGap\"\n \| \"scale\"\n \| \"type\"\n \| \"domain\"\n \| \"hide\"\n \| \"unit\"\n \| \"tickFormatter\"\n>;\n\n/** @flr-generate all */\nexport const YAxis: FC<YAxisProps> = (props) => {\n const { domain, ...rest } = props;\n\n return (\n <Recharts.YAxis\n {...rest}\n allowDataOverflow\n domain={domain}\n fontSize={tokens.axis[\"font-size\"].value}\n tick={{\n fill: tokens.axis[\"text-color\"].value,\n }}\n tickMargin={parseInt(tokens.axis.spacing.value)}\n tickSize={parseInt(tokens.axis[\"tick-size\"].value)}\n />\n );\n};\n\nexport default YAxis;\n"],"names":[],"mappings":";;;;AAqBO,MAAM,KAAA,GAAwB,CAAC,KAAA,KAAU;AAC9C,EAAA,MAAM,EAAE,MAAA,EAAQ,GAAG,IAAA,EAAK,GAAI,KAAA;AAE5B,EAAA,uBACE,GAAA;AAAA,IAAC,QAAA,CAAS,KAAA;AAAA,IAAT;AAAA,MACE,GAAG,IAAA;AAAA,MACJ,iBAAA,EAAiB,IAAA;AAAA,MACjB,MAAA;AAAA,MACA,QAAA,EAAU,MAAA,CAAO,IAAA,CAAK,WAAW,CAAA,CAAE,KAAA;AAAA,MACnC,IAAA,EAAM;AAAA,QACJ,IAAA,EAAM,MAAA,CAAO,IAAA,CAAK,YAAY,CAAA,CAAE;AAAA,OAClC;AAAA,MACA,UAAA,EAAY,QAAA,CAAS,MAAA,CAAO,IAAA,CAAK,QAAQ,KAAK,CAAA;AAAA,MAC9C,UAAU,QAAA,CAAS,MAAA,CAAO,IAAA,CAAK,WAAW,EAAE,KAAK;AAAA;AAAA,GACnD;AAEJ;;;;"}

package/dist/js/components/src/components/Checkbox/Checkbox.mjs CHANGED Viewed

@@ -19,7 +19,7 @@ import { useObjectRef } from '@react-aria/utils';
 import { useMakeFocusable } from '../../lib/hooks/dom/useMakeFocusable.mjs';
 const Checkbox = flowComponent("Checkbox", (props) => {
-  const { children, className, ref, inputClassName, ...rest } = props;
+  const { children, className, ref, inputClassName, inputRef, ...rest } = props;
   const {
     FieldErrorView,
     FieldErrorCaptureContext,
@@ -27,7 +27,11 @@ const Checkbox = flowComponent("Checkbox", (props) => {
     fieldProps
   } = useFieldComponent(props);
   const localCheckboxRef = useObjectRef(ref);
-  useMakeFocusable(localCheckboxRef);
+  const localInputCheckboxRef = useObjectRef(inputRef);
+  useMakeFocusable(
+    localCheckboxRef,
+    () => localInputCheckboxRef.current?.focus()
+  );
   return /* @__PURE__ */ jsxs(
     "div",
     {
@@ -35,10 +39,18 @@ const Checkbox = flowComponent("Checkbox", (props) => {
       className: clsx(styles.checkbox, className, fieldProps.className),
       ref: localCheckboxRef,
       children: [
-        /* @__PURE__ */ jsx(FieldErrorCaptureContext, { children: /* @__PURE__ */ jsx(Aria.Checkbox, { ...rest, className: clsx(inputClassName, styles.input), children: ({ isSelected, isIndeterminate }) => /* @__PURE__ */ jsxs(PropsContextProvider, { props: fieldPropsContext, children: [
-          isSelected ? /* @__PURE__ */ jsx(IconCheckboxChecked, { className: styles.icon }) : isIndeterminate ? /* @__PURE__ */ jsx(IconCheckboxIndeterminate, { className: styles.icon }) : /* @__PURE__ */ jsx(IconCheckboxEmpty, { className: styles.icon }),
-          children
-        ] }) }) }),
+        /* @__PURE__ */ jsx(FieldErrorCaptureContext, { children: /* @__PURE__ */ jsx(
+          Aria.Checkbox,
+          {
+            ...rest,
+            inputRef: localInputCheckboxRef,
+            className: clsx(inputClassName, styles.input),
+            children: ({ isSelected, isIndeterminate }) => /* @__PURE__ */ jsxs(PropsContextProvider, { props: fieldPropsContext, children: [
+              isSelected ? /* @__PURE__ */ jsx(IconCheckboxChecked, { className: styles.icon }) : isIndeterminate ? /* @__PURE__ */ jsx(IconCheckboxIndeterminate, { className: styles.icon }) : /* @__PURE__ */ jsx(IconCheckboxEmpty, { className: styles.icon }),
+              children
+            ] })
+          }
+        ) }),
         /* @__PURE__ */ jsx(FieldErrorView, {})
       ]
     }

package/dist/js/components/src/components/Checkbox/Checkbox.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Checkbox.mjs","sources":["../../../../../../src/components/Checkbox/Checkbox.tsx"],"sourcesContent":["import {\n IconCheckboxChecked,\n IconCheckboxEmpty,\n IconCheckboxIndeterminate,\n} from \"@/components/Icon/components/icons\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport clsx from \"clsx\";\nimport type { PropsWithChildren } from \"react\";\nimport * as Aria from \"react-aria-components\";\nimport styles from \"./Checkbox.module.scss\";\nimport { useFieldComponent } from \"@/lib/hooks/useFieldComponent\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport { useObjectRef } from \"@react-aria/utils\";\nimport { useMakeFocusable } from \"@/lib/hooks/dom/useMakeFocusable\";\n\nexport interface CheckboxProps\n extends PropsWithChildren<Omit<Aria.CheckboxProps, \"children\">>,\n FlowComponentProps {\n inputClassName?: string;\n}\n\n/** @flr-generate all */\nexport const Checkbox = flowComponent(\"Checkbox\", (props) => {\n const { children, className, ref, inputClassName, ...rest } = props;\n\n const {\n FieldErrorView,\n FieldErrorCaptureContext,\n fieldPropsContext,\n fieldProps,\n } = useFieldComponent(props);\n\n const localCheckboxRef = useObjectRef(ref);\n useMakeFocusable(localCheckboxRef);\n\n return (\n <div\n {...fieldProps}\n className={clsx(styles.checkbox, className, fieldProps.className)}\n ref={localCheckboxRef}\n >\n <FieldErrorCaptureContext>\n <Aria.Checkbox {...rest} className={clsx(inputClassName, styles.input)}>\n {({ isSelected, isIndeterminate }) => (\n <PropsContextProvider props={fieldPropsContext}>\n {isSelected ? (\n <IconCheckboxChecked className={styles.icon} />\n ) : isIndeterminate ? (\n <IconCheckboxIndeterminate className={styles.icon} />\n ) : (\n <IconCheckboxEmpty className={styles.icon} />\n )}\n {children}\n </PropsContextProvider>\n )}\n </Aria.Checkbox>\n </FieldErrorCaptureContext>\n <FieldErrorView />\n </div>\n );\n});\n\nexport default Checkbox;\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;~~AAuBO~~,MAAM,QAAA,GAAW,aAAA,CAAc,UAAA,EAAY,CAAC,KAAA,KAAU;AAC3D,EAAA,MAAM,EAAE,~~QAAA~~,~~EAAU,~~SAAA,EAAW,~~KAAK~~,~~cAAA~~,~~EAAgB~~,GAAG,MAAK,GAAI,KAAA;~~AAE9D~~,EAAA,MAAM;AAAA,IACJ,cAAA;AAAA,IACA,wBAAA;AAAA,IACA,iBAAA;AAAA,IACA;AAAA,GACF,GAAI,kBAAkB,KAAK,CAAA;AAE3B,EAAA,MAAM,gBAAA,GAAmB,aAAa,GAAG,CAAA;AACzC,EAAA,~~gBAAA~~,~~CAAiB~~,~~gBAAgB~~,CAAA;~~AAEjC~~,EAAA,uBACE,IAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACE,GAAG,UAAA;AAAA,MACJ,WAAW,IAAA,CAAK,MAAA,CAAO,QAAA,EAAU,SAAA,EAAW,WAAW,SAAS,CAAA;AAAA,MAChE,GAAA,EAAK,gBAAA;AAAA,MAEL,QAAA,EAAA;AAAA,wBAAA,GAAA,CAAC,wBAAA,EAAA,EACC,~~8BAAC~~,IAAA,CAAK,QAAA,~~EAAL~~,~~EAAe~~,GAAG,IAAA,~~EAAM~~,~~WAAW~~,IAAA,CAAK,cAAA,EAAgB,~~OAAO~~,KAAK,CAAA,~~EAClE~~,~~WAAC~~,EAAE,UAAA,EAAY,~~iBAAgB~~,~~qBAC9B~~,IAAA,CAAC,oBAAA,EAAA,EAAqB,~~KAAA~~,~~EAAO,~~iBAAA,EAC1B,QAAA,EAAA;AAAA,~~UAAA~~,UAAA,uBACE,mBAAA,EAAA,EAAoB,SAAA,EAAW,MAAA,CAAO,IAAA,EAAM,IAC3C,eAAA,mBACF,GAAA,CAAC,yBAAA,EAAA,EAA0B,SAAA,EAAW,OAAO,IAAA,EAAM,CAAA,uBAElD,iBAAA,EAAA,EAAkB,SAAA,EAAW,OAAO,IAAA,EAAM,CAAA;AAAA,~~UAE5C~~;AAAA,~~SAAA~~,EACH,~~GAEJ~~,~~CAAA,~~EACF,CAAA;AAAA,4BACC,cAAA,EAAA,EAAe;AAAA;AAAA;AAAA,GAClB;AAEJ,CAAC;;;;"}
1	+ {"version":3,"file":"Checkbox.mjs","sources":["../../../../../../src/components/Checkbox/Checkbox.tsx"],"sourcesContent":["import {\n IconCheckboxChecked,\n IconCheckboxEmpty,\n IconCheckboxIndeterminate,\n} from \"@/components/Icon/components/icons\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport clsx from \"clsx\";\nimport type { PropsWithChildren, RefObject } from \"react\";\nimport * as Aria from \"react-aria-components\";\nimport styles from \"./Checkbox.module.scss\";\nimport { useFieldComponent } from \"@/lib/hooks/useFieldComponent\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport { useObjectRef } from \"@react-aria/utils\";\nimport { useMakeFocusable } from \"@/lib/hooks/dom/useMakeFocusable\";\n\nexport interface CheckboxProps\n extends PropsWithChildren<Omit<Aria.CheckboxProps, \"children\">>,\n FlowComponentProps {\n inputClassName?: string;\n inputRef?: RefObject<HTMLInputElement \| null>;\n}\n\n/** @flr-generate all */\nexport const Checkbox = flowComponent(\"Checkbox\", (props) => {\n const { children, className, ref, inputClassName, inputRef, ...rest } = props;\n\n const {\n FieldErrorView,\n FieldErrorCaptureContext,\n fieldPropsContext,\n fieldProps,\n } = useFieldComponent(props);\n\n const localCheckboxRef = useObjectRef(ref);\n const localInputCheckboxRef = useObjectRef(inputRef);\n useMakeFocusable(localCheckboxRef, () =>\n localInputCheckboxRef.current?.focus(),\n );\n\n return (\n <div\n {...fieldProps}\n className={clsx(styles.checkbox, className, fieldProps.className)}\n ref={localCheckboxRef}\n >\n <FieldErrorCaptureContext>\n <Aria.Checkbox\n {...rest}\n inputRef={localInputCheckboxRef}\n className={clsx(inputClassName, styles.input)}\n >\n {({ isSelected, isIndeterminate }) => (\n <PropsContextProvider props={fieldPropsContext}>\n {isSelected ? (\n <IconCheckboxChecked className={styles.icon} />\n ) : isIndeterminate ? (\n <IconCheckboxIndeterminate className={styles.icon} />\n ) : (\n <IconCheckboxEmpty className={styles.icon} />\n )}\n {children}\n </PropsContextProvider>\n )}\n </Aria.Checkbox>\n </FieldErrorCaptureContext>\n <FieldErrorView />\n </div>\n );\n});\n\nexport default Checkbox;\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;AAwBO,MAAM,QAAA,GAAW,aAAA,CAAc,UAAA,EAAY,CAAC,KAAA,KAAU;AAC3D,EAAA,MAAM,EAAE,UAAU,SAAA,EAAW,GAAA,EAAK,gBAAgB,QAAA,EAAU,GAAG,MAAK,GAAI,KAAA;AAExE,EAAA,MAAM;AAAA,IACJ,cAAA;AAAA,IACA,wBAAA;AAAA,IACA,iBAAA;AAAA,IACA;AAAA,GACF,GAAI,kBAAkB,KAAK,CAAA;AAE3B,EAAA,MAAM,gBAAA,GAAmB,aAAa,GAAG,CAAA;AACzC,EAAA,MAAM,qBAAA,GAAwB,aAAa,QAAQ,CAAA;AACnD,EAAA,gBAAA;AAAA,IAAiB,gBAAA;AAAA,IAAkB,MACjC,qBAAA,CAAsB,OAAA,EAAS,KAAA;AAAM,GACvC;AAEA,EAAA,uBACE,IAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACE,GAAG,UAAA;AAAA,MACJ,WAAW,IAAA,CAAK,MAAA,CAAO,QAAA,EAAU,SAAA,EAAW,WAAW,SAAS,CAAA;AAAA,MAChE,GAAA,EAAK,gBAAA;AAAA,MAEL,QAAA,EAAA;AAAA,wBAAA,GAAA,CAAC,wBAAA,EAAA,EACC,QAAA,kBAAA,GAAA;AAAA,UAAC,IAAA,CAAK,QAAA;AAAA,UAAL;AAAA,YACE,GAAG,IAAA;AAAA,YACJ,QAAA,EAAU,qBAAA;AAAA,YACV,SAAA,EAAW,IAAA,CAAK,cAAA,EAAgB,MAAA,CAAO,KAAK,CAAA;AAAA,YAE3C,QAAA,EAAA,CAAC,EAAE,UAAA,EAAY,eAAA,uBACd,IAAA,CAAC,oBAAA,EAAA,EAAqB,OAAO,iBAAA,EAC1B,QAAA,EAAA;AAAA,cAAA,UAAA,uBACE,mBAAA,EAAA,EAAoB,SAAA,EAAW,MAAA,CAAO,IAAA,EAAM,IAC3C,eAAA,mBACF,GAAA,CAAC,yBAAA,EAAA,EAA0B,SAAA,EAAW,OAAO,IAAA,EAAM,CAAA,uBAElD,iBAAA,EAAA,EAAkB,SAAA,EAAW,OAAO,IAAA,EAAM,CAAA;AAAA,cAE5C;AAAA,aAAA,EACH;AAAA;AAAA,SAEJ,EACF,CAAA;AAAA,4BACC,cAAA,EAAA,EAAe;AAAA;AAAA;AAAA,GAClB;AAEJ,CAAC;;;;"}

package/dist/js/components/src/components/CheckboxButton/CheckboxButton.mjs CHANGED Viewed

@@ -12,7 +12,7 @@ import { useObjectRef } from '@react-aria/utils';
 import { useMakeFocusable } from '../../lib/hooks/dom/useMakeFocusable.mjs';
 const CheckboxButton = flowComponent("CheckboxButton", (props) => {
-  const { children, className, ref, inputClassName, ...rest } = props;
+  const { children, className, ref, inputRef, inputClassName, ...rest } = props;
   const {
     fieldPropsContext,
     fieldProps,
@@ -29,7 +29,11 @@ const CheckboxButton = flowComponent("CheckboxButton", (props) => {
     ...fieldPropsContext
   };
   const localCheckboxButtonRef = useObjectRef(ref);
-  useMakeFocusable(localCheckboxButtonRef);
+  const localInputCheckboxRef = useObjectRef(inputRef);
+  useMakeFocusable(
+    localCheckboxButtonRef,
+    () => localInputCheckboxRef.current?.focus()
+  );
   return /* @__PURE__ */ jsxs(
     "div",
     {
@@ -37,7 +41,15 @@ const CheckboxButton = flowComponent("CheckboxButton", (props) => {
       className: clsx(fieldProps.className, styles.checkboxButton, className),
       ref: localCheckboxButtonRef,
       children: [
-        /* @__PURE__ */ jsx(FieldErrorCaptureContext, { children: /* @__PURE__ */ jsx(Checkbox, { ...rest, inputClassName: clsx(inputClassName, styles.input), children: /* @__PURE__ */ jsx(PropsContextProvider, { props: mergedPropsContext, children }) }) }),
+        /* @__PURE__ */ jsx(FieldErrorCaptureContext, { children: /* @__PURE__ */ jsx(
+          Checkbox,
+          {
+            ...rest,
+            inputRef: localInputCheckboxRef,
+            inputClassName: clsx(inputClassName, styles.input),
+            children: /* @__PURE__ */ jsx(PropsContextProvider, { props: mergedPropsContext, children })
+          }
+        ) }),
         /* @__PURE__ */ jsx(FieldErrorView, {})
       ]
     }

package/dist/js/components/src/components/CheckboxButton/CheckboxButton.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CheckboxButton.mjs","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\";\nimport { useObjectRef } from \"@react-aria/utils\";\nimport { useMakeFocusable } from \"@/lib/hooks/dom/useMakeFocusable\";\n\nexport interface CheckboxButtonProps\n extends CheckboxProps~~,\n~~ FlowComponentProps {}\n\n/** @flr-generate all */\nexport const CheckboxButton = flowComponent(\"CheckboxButton\", (props) => {\n const { children, className, ref, inputClassName, ...rest } = props;\n\n const {\n fieldPropsContext,\n fieldProps,\n FieldErrorView,\n FieldErrorCaptureContext,\n } = useFieldComponent(props);\n\n const mergedPropsContext: PropsContext = {\n Text: {\n className: styles.label,\n },\n Content: {\n className: styles.content,\n },\n ...fieldPropsContext,\n };\n\n const localCheckboxButtonRef = useObjectRef(ref);\n useMakeFocusable(localCheckboxButtonRef);\n\n return (\n <div\n {...fieldProps}\n className={clsx(fieldProps.className, styles.checkboxButton, className)}\n ref={localCheckboxButtonRef}\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"],"names":[],"mappings":";;;;;;;;;;;~~AAiBO~~,MAAM,cAAA,GAAiB,aAAA,CAAc,gBAAA,EAAkB,CAAC,KAAA,KAAU;AACvE,EAAA,MAAM,EAAE,~~QAAA~~,~~EAAU,~~SAAA,EAAW,~~KAAK~~,cAAA,EAAgB,GAAG,MAAK,GAAI,KAAA;~~AAE9D~~,EAAA,MAAM;AAAA,IACJ,iBAAA;AAAA,IACA,UAAA;AAAA,IACA,cAAA;AAAA,IACA;AAAA,GACF,GAAI,kBAAkB,KAAK,CAAA;AAE3B,EAAA,MAAM,kBAAA,GAAmC;AAAA,IACvC,IAAA,EAAM;AAAA,MACJ,WAAW,MAAA,CAAO;AAAA,KACpB;AAAA,IACA,OAAA,EAAS;AAAA,MACP,WAAW,MAAA,CAAO;AAAA,KACpB;AAAA,IACA,GAAG;AAAA,GACL;AAEA,EAAA,MAAM,sBAAA,GAAyB,aAAa,GAAG,CAAA;AAC/C,EAAA,~~gBAAA~~,~~CAAiB~~,~~sBAAsB~~,CAAA;~~AAEvC~~,EAAA,uBACE,IAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACE,GAAG,UAAA;AAAA,MACJ,WAAW,IAAA,CAAK,UAAA,CAAW,SAAA,EAAW,MAAA,CAAO,gBAAgB,SAAS,CAAA;AAAA,MACtE,GAAA,EAAK,sBAAA;AAAA,MAEL,QAAA,EAAA;AAAA,wBAAA,GAAA,CAAC,~~4BACC~~,QAAA,kBAAA,GAAA,~~CAAC~~,QAAA,~~EAAA~~,~~EAAU~~,GAAG,IAAA,~~EAAM~~,~~gBAAgB~~,IAAA,CAAK,cAAA,EAAgB,MAAA,CAAO,KAAK,~~GACnE~~,QAAA,kBAAA,GAAA,CAAC,oBAAA,EAAA,EAAqB,~~OAAO~~,kBAAA,EAC1B,QAAA,EACH,~~GACF~~,~~CAAA,~~EACF,CAAA;AAAA,4BACC,cAAA,EAAA,EAAe;AAAA;AAAA;AAAA,GAClB;AAEJ,CAAC;;;;"}
1	+ {"version":3,"file":"CheckboxButton.mjs","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\";\nimport { useObjectRef } from \"@react-aria/utils\";\nimport { useMakeFocusable } from \"@/lib/hooks/dom/useMakeFocusable\";\nimport type { RefObject } from \"react\";\n\nexport interface CheckboxButtonProps extends CheckboxProps, FlowComponentProps {\n inputRef?: RefObject<HTMLInputElement \| null>;\n}\n\n/** @flr-generate all */\nexport const CheckboxButton = flowComponent(\"CheckboxButton\", (props) => {\n const { children, className, ref, inputRef, inputClassName, ...rest } = props;\n\n const {\n fieldPropsContext,\n fieldProps,\n FieldErrorView,\n FieldErrorCaptureContext,\n } = useFieldComponent(props);\n\n const mergedPropsContext: PropsContext = {\n Text: {\n className: styles.label,\n },\n Content: {\n className: styles.content,\n },\n ...fieldPropsContext,\n };\n\n const localCheckboxButtonRef = useObjectRef(ref);\n const localInputCheckboxRef = useObjectRef(inputRef);\n\n useMakeFocusable(localCheckboxButtonRef, () =>\n localInputCheckboxRef.current?.focus(),\n );\n\n return (\n <div\n {...fieldProps}\n className={clsx(fieldProps.className, styles.checkboxButton, className)}\n ref={localCheckboxButtonRef}\n >\n <FieldErrorCaptureContext>\n <Checkbox\n {...rest}\n inputRef={localInputCheckboxRef}\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"],"names":[],"mappings":";;;;;;;;;;;AAkBO,MAAM,cAAA,GAAiB,aAAA,CAAc,gBAAA,EAAkB,CAAC,KAAA,KAAU;AACvE,EAAA,MAAM,EAAE,UAAU,SAAA,EAAW,GAAA,EAAK,UAAU,cAAA,EAAgB,GAAG,MAAK,GAAI,KAAA;AAExE,EAAA,MAAM;AAAA,IACJ,iBAAA;AAAA,IACA,UAAA;AAAA,IACA,cAAA;AAAA,IACA;AAAA,GACF,GAAI,kBAAkB,KAAK,CAAA;AAE3B,EAAA,MAAM,kBAAA,GAAmC;AAAA,IACvC,IAAA,EAAM;AAAA,MACJ,WAAW,MAAA,CAAO;AAAA,KACpB;AAAA,IACA,OAAA,EAAS;AAAA,MACP,WAAW,MAAA,CAAO;AAAA,KACpB;AAAA,IACA,GAAG;AAAA,GACL;AAEA,EAAA,MAAM,sBAAA,GAAyB,aAAa,GAAG,CAAA;AAC/C,EAAA,MAAM,qBAAA,GAAwB,aAAa,QAAQ,CAAA;AAEnD,EAAA,gBAAA;AAAA,IAAiB,sBAAA;AAAA,IAAwB,MACvC,qBAAA,CAAsB,OAAA,EAAS,KAAA;AAAM,GACvC;AAEA,EAAA,uBACE,IAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACE,GAAG,UAAA;AAAA,MACJ,WAAW,IAAA,CAAK,UAAA,CAAW,SAAA,EAAW,MAAA,CAAO,gBAAgB,SAAS,CAAA;AAAA,MACtE,GAAA,EAAK,sBAAA;AAAA,MAEL,QAAA,EAAA;AAAA,wBAAA,GAAA,CAAC,wBAAA,EAAA,EACC,QAAA,kBAAA,GAAA;AAAA,UAAC,QAAA;AAAA,UAAA;AAAA,YACE,GAAG,IAAA;AAAA,YACJ,QAAA,EAAU,qBAAA;AAAA,YACV,cAAA,EAAgB,IAAA,CAAK,cAAA,EAAgB,MAAA,CAAO,KAAK,CAAA;AAAA,YAEjD,QAAA,kBAAA,GAAA,CAAC,oBAAA,EAAA,EAAqB,KAAA,EAAO,kBAAA,EAC1B,QAAA,EACH;AAAA;AAAA,SACF,EACF,CAAA;AAAA,4BACC,cAAA,EAAA,EAAe;AAAA;AAAA;AAAA,GAClB;AAEJ,CAAC;;;;"}