@lmb-it/kitsconcerto-native 0.1.277 → 0.1.284

package/form/controls/TriStateCheckbox/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../../src/form/controls/TriStateCheckbox/index.native.tsx"],"sourcesContent":["import {TriStateCheckbox as TriStateCheckboxMobile, type TriStateCheckboxProps} from \"@lmb-it/kitsconcertomobile\";\nimport {useSelectionController} from \"../../../hooks\";\n\nexport const TriStateCheckbox = (props:TriStateCheckboxProps)=>{\n    const { value, onChange } = useSelectionController({\n        mode: 'tristate',\n        defaultValue: false // Start at false\n    });\n\n    return <TriStateCheckboxMobile value={value} onChange={()=>onChange()} {...props} />\n}\n"],"names":["TriStateCheckboxMobile"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAGO,MAAM,gBAAA,GAAmB,CAAC,KAAA,KAA8B;AAC3D,EAAA,MAAM,EAAE,KAAA,EAAO,QAAA,EAAS,GAAI,sBAAA,CAAuB;AAAA,IAC/C,IAAA,EAAM,UAAA;AAAA,IACN,YAAA,EAAc;AAAA;AAAA,GACjB,CAAA;AAED,EAAA,uBAAO,GAAA,CAACA,sBAAuB,KAAA,EAAc,QAAA,EAAU,MAAI,QAAA,EAAS,EAAI,GAAG,KAAA,EAAO,CAAA;AACtF;;;;"}
+{"version":3,"file":"index.js","sources":["../../../../../src/form/controls/TriStateCheckbox/index.native.tsx"],"sourcesContent":["import {TriStateCheckbox as TriStateCheckboxMobile, type TriStateCheckboxProps} from \"@lmb-it/kitsconcertomobile\";\nimport {useSelectionController} from \"../../../hooks\";\n\nexport const TriStateCheckbox = (props:TriStateCheckboxProps)=>{\n    const { value, onChange } = useSelectionController({\n        mode: 'tristate',\n        defaultValue: false // Start at false\n    });\n\n    return <TriStateCheckboxMobile value={value} onChange={()=>onChange()} {...props} />\n}\n"],"names":["TriStateCheckboxMobile"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAGO,MAAM,gBAAA,GAAmB,CAAC,KAAA,KAA8B;AAC3D,EAAA,MAAM,EAAE,KAAA,EAAO,QAAA,EAAS,GAAI,sBAAA,CAAuB;AAAA,IAC/C,IAAA,EAAM,UAAA;AAAA,IACN,YAAA,EAAc;AAAA;AAAA,GACjB,CAAA;AAED,EAAA,uBAAO,GAAA,CAACA,sBAAuB,KAAA,EAAc,QAAA,EAAU,MAAI,QAAA,EAAS,EAAI,GAAG,KAAA,EAAO,CAAA;AACtF;;;;"}

package/form/file-pickers/index.cjs

@@ -9,6 +9,7 @@ require('react');
 require('axios');
 require('../../contexts/DialogContext.cjs');
 require('../../contexts/PermissionsContext.cjs');
+require('../../contexts/BreadcrumbContext.cjs');
 require('../selects/SelectContext.cjs');
 
 const FilePicker = (props) => {

package/form/file-pickers/index.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","sources":["../../../../src/form/file-pickers/index.native.tsx"],"sourcesContent":["import React, { type FC } from \"react\";\nimport type {IFileUploader} from \"@lmb-it/kitsconcerto-types\";\nimport MainUploader from \"./MainUploader\";\nimport {KitsContainer} from \"../../_compat\";\n\nconst FilePicker: FC<IFileUploader> = (props) => {\n    const { id, helperText, disabled, label, errors, hideError, invalid } = props;\n\n    return (\n        <KitsContainer\n            id={id}\n            className={\"file-picker-component\"}\n            disabled={disabled}\n            label={label}\n            hideError={hideError}\n            errors={errors}\n            invalid={invalid}\n            helperText={helperText}\n            bare\n            isFloatedLabel={false}\n        >\n            <MainUploader name={id} {...props} />\n        </KitsContainer>\n    );\n};\n\nexport default FilePicker;\n"],"names":["jsx","KitsContainer","MainUploader"],"mappings":";;;;;;;;;;;;;AAKA,MAAM,UAAA,GAAgC,CAAC,KAAA,KAAU;AAC7C,EAAA,MAAM,EAAE,IAAI,UAAA,EAAY,QAAA,EAAU,OAAO,MAAA,EAAQ,SAAA,EAAW,SAAQ,GAAI,KAAA;AAExE,EAAA,uBACIA,cAAA;AAAA,IAACC,oBAAA;AAAA,IAAA;AAAA,MACG,EAAA;AAAA,MACA,SAAA,EAAW,uBAAA;AAAA,MACX,QAAA;AAAA,MACA,KAAA;AAAA,MACA,SAAA;AAAA,MACA,MAAA;AAAA,MACA,OAAA;AAAA,MACA,UAAA;AAAA,MACA,IAAA,EAAI,IAAA;AAAA,MACJ,cAAA,EAAgB,KAAA;AAAA,MAEhB,QAAA,kBAAAD,cAAA,CAACE,sBAAA,EAAA,EAAa,IAAA,EAAM,EAAA,EAAK,GAAG,KAAA,EAAO;AAAA;AAAA,GACvC;AAER;;;;"}
+{"version":3,"file":"index.cjs","sources":["../../../../src/form/file-pickers/index.native.tsx"],"sourcesContent":["import React, { type FC } from \"react\";\nimport type {IFileUploader} from \"@lmb-it/kitsconcerto-types\";\nimport MainUploader from \"./MainUploader\";\nimport {KitsContainer} from \"../../_compat\";\n\nconst FilePicker: FC<IFileUploader> = (props) => {\n    const { id, helperText, disabled, label, errors, hideError, invalid } = props;\n\n    return (\n        <KitsContainer\n            id={id}\n            className={\"file-picker-component\"}\n            disabled={disabled}\n            label={label}\n            hideError={hideError}\n            errors={errors}\n            invalid={invalid}\n            helperText={helperText}\n            bare\n            isFloatedLabel={false}\n        >\n            <MainUploader name={id} {...props} />\n        </KitsContainer>\n    );\n};\n\nexport default FilePicker;\n"],"names":["jsx","KitsContainer","MainUploader"],"mappings":";;;;;;;;;;;;;;AAKA,MAAM,UAAA,GAAgC,CAAC,KAAA,KAAU;AAC7C,EAAA,MAAM,EAAE,IAAI,UAAA,EAAY,QAAA,EAAU,OAAO,MAAA,EAAQ,SAAA,EAAW,SAAQ,GAAI,KAAA;AAExE,EAAA,uBACIA,cAAA;AAAA,IAACC,oBAAA;AAAA,IAAA;AAAA,MACG,EAAA;AAAA,MACA,SAAA,EAAW,uBAAA;AAAA,MACX,QAAA;AAAA,MACA,KAAA;AAAA,MACA,SAAA;AAAA,MACA,MAAA;AAAA,MACA,OAAA;AAAA,MACA,UAAA;AAAA,MACA,IAAA,EAAI,IAAA;AAAA,MACJ,cAAA,EAAgB,KAAA;AAAA,MAEhB,QAAA,kBAAAD,cAAA,CAACE,sBAAA,EAAA,EAAa,IAAA,EAAM,EAAA,EAAK,GAAG,KAAA,EAAO;AAAA;AAAA,GACvC;AAER;;;;"}

package/form/file-pickers/index.js

@@ -5,6 +5,7 @@ import 'react';
 import 'axios';
 import '../../contexts/DialogContext.js';
 import '../../contexts/PermissionsContext.js';
+import '../../contexts/BreadcrumbContext.js';
 import '../selects/SelectContext.js';
 
 const FilePicker = (props) => {

package/form/file-pickers/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../src/form/file-pickers/index.native.tsx"],"sourcesContent":["import React, { type FC } from \"react\";\nimport type {IFileUploader} from \"@lmb-it/kitsconcerto-types\";\nimport MainUploader from \"./MainUploader\";\nimport {KitsContainer} from \"../../_compat\";\n\nconst FilePicker: FC<IFileUploader> = (props) => {\n    const { id, helperText, disabled, label, errors, hideError, invalid } = props;\n\n    return (\n        <KitsContainer\n            id={id}\n            className={\"file-picker-component\"}\n            disabled={disabled}\n            label={label}\n            hideError={hideError}\n            errors={errors}\n            invalid={invalid}\n            helperText={helperText}\n            bare\n            isFloatedLabel={false}\n        >\n            <MainUploader name={id} {...props} />\n        </KitsContainer>\n    );\n};\n\nexport default FilePicker;\n"],"names":[],"mappings":";;;;;;;;;AAKA,MAAM,UAAA,GAAgC,CAAC,KAAA,KAAU;AAC7C,EAAA,MAAM,EAAE,IAAI,UAAA,EAAY,QAAA,EAAU,OAAO,MAAA,EAAQ,SAAA,EAAW,SAAQ,GAAI,KAAA;AAExE,EAAA,uBACI,GAAA;AAAA,IAAC,aAAA;AAAA,IAAA;AAAA,MACG,EAAA;AAAA,MACA,SAAA,EAAW,uBAAA;AAAA,MACX,QAAA;AAAA,MACA,KAAA;AAAA,MACA,SAAA;AAAA,MACA,MAAA;AAAA,MACA,OAAA;AAAA,MACA,UAAA;AAAA,MACA,IAAA,EAAI,IAAA;AAAA,MACJ,cAAA,EAAgB,KAAA;AAAA,MAEhB,QAAA,kBAAA,GAAA,CAAC,YAAA,EAAA,EAAa,IAAA,EAAM,EAAA,EAAK,GAAG,KAAA,EAAO;AAAA;AAAA,GACvC;AAER;;;;"}
+{"version":3,"file":"index.js","sources":["../../../../src/form/file-pickers/index.native.tsx"],"sourcesContent":["import React, { type FC } from \"react\";\nimport type {IFileUploader} from \"@lmb-it/kitsconcerto-types\";\nimport MainUploader from \"./MainUploader\";\nimport {KitsContainer} from \"../../_compat\";\n\nconst FilePicker: FC<IFileUploader> = (props) => {\n    const { id, helperText, disabled, label, errors, hideError, invalid } = props;\n\n    return (\n        <KitsContainer\n            id={id}\n            className={\"file-picker-component\"}\n            disabled={disabled}\n            label={label}\n            hideError={hideError}\n            errors={errors}\n            invalid={invalid}\n            helperText={helperText}\n            bare\n            isFloatedLabel={false}\n        >\n            <MainUploader name={id} {...props} />\n        </KitsContainer>\n    );\n};\n\nexport default FilePicker;\n"],"names":[],"mappings":";;;;;;;;;;AAKA,MAAM,UAAA,GAAgC,CAAC,KAAA,KAAU;AAC7C,EAAA,MAAM,EAAE,IAAI,UAAA,EAAY,QAAA,EAAU,OAAO,MAAA,EAAQ,SAAA,EAAW,SAAQ,GAAI,KAAA;AAExE,EAAA,uBACI,GAAA;AAAA,IAAC,aAAA;AAAA,IAAA;AAAA,MACG,EAAA;AAAA,MACA,SAAA,EAAW,uBAAA;AAAA,MACX,QAAA;AAAA,MACA,KAAA;AAAA,MACA,SAAA;AAAA,MACA,MAAA;AAAA,MACA,OAAA;AAAA,MACA,UAAA;AAAA,MACA,IAAA,EAAI,IAAA;AAAA,MACJ,cAAA,EAAgB,KAAA;AAAA,MAEhB,QAAA,kBAAA,GAAA,CAAC,YAAA,EAAA,EAAa,IAAA,EAAM,EAAA,EAAK,GAAG,KAAA,EAAO;AAAA;AAAA,GACvC;AAER;;;;"}

package/form/helpers/FormContainer/index.cjs

@@ -89,6 +89,7 @@ require('../../../apps/mobile/src/Core/Input/Field.cjs');
 require('../../../apps/mobile/src/Core/Input/Slot.cjs');
 require('../../../contexts/DialogContext.cjs');
 require('../../../contexts/PermissionsContext.cjs');
+require('../../../contexts/BreadcrumbContext.cjs');
 var useResolvedElementStyles = require('../../../hooks/useResolvedElementStyles.cjs');
 var useThemedFont = require('../../../hooks/useThemedFont.cjs');
 var KitsThemeProvider_native = require('../../../contexts/Theme/KitsThemeProvider.cjs');

package/form/helpers/FormContainer/index.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","sources":["../../../../../src/form/helpers/FormContainer/index.native.tsx"],"sourcesContent":["import React, { type FC, type PropsWithChildren, useMemo } from \"react\";\nimport { View } from \"react-native\";\nimport { uniqueId } from \"lodash\";\nimport ErrorMessage from \"../ErrorMessage\";\nimport type {IKitsContainer} from \"@lmb-it/kitsconcerto-types\";\nimport {\n    FormControl,\n    FormControlHelper,\n    FormControlHelperText,\n    style as resolveStyle,\n} from \"@lmb-it/kitsconcertomobile\"\nimport { Label, Text, useKitsTheme } from \"../../../_compat\";\nimport {useResolvedElementStyles, useThemedFont} from \"@lmb-it/kitsconcerto/hooks\";\n\n/**\n * KitsContainer (native) — wraps all form inputs with label, addons, helper\n * text, and errors. Mirror of the web variant: a pure renderer that does NO\n * independent theme lookup. Every slot style comes from `elementStyles`\n * passed by the parent input (already merged through the\n *   FormElement < Input/Select < InputText/DropdownSelect/… < per-instance slots\n * chain by the parent's `useComponentDefaults` call).\n *\n * Addon rendering is inlined here (matches web FormContainer). There is NO\n * `Addons` component on either platform anymore — the previous native Addons\n * helper re-resolved tokens and hardcoded `borderRadius / borderWidth /\n * padding / backgroundColor / borderColor` defaults that clobbered\n * `kitsTheme.components.*.leftAddon.style` overrides. Both bugs are fixed by\n * deleting the indirection.\n *\n * Element slots applied here (identical contract to web):\n *   container  → outer FormControl wrapper\n *   label      → Label component (plain Text path on native — see Label.native)\n *   inputGroup → input group wrapper (around addons + input). On native this\n *                wrapper carries the visual border that web gets from the\n *                `.p-inputgroup` CSS class.\n *   leftAddon  → left addon View\n *   rightAddon → right addon View\n *   helperText → helper text below the group\n *   error      → error message below the group\n *\n * The `root` slot is NOT applied here — it is applied by the parent form\n * input component directly to the inner Input/Textarea element.\n */\nconst KitsContainer: FC<PropsWithChildren<IKitsContainer>> = (props) => {\n    const {\n        id,\n        helperText,\n        children,\n        rightAddon,\n        leftAddon,\n        errors,\n        invalid,\n        required,\n        hideError,\n        label,\n        isFloatedLabel,\n        containerStyle,\n        disabled,\n        bare,\n        elementStyles: parentElementStyles,\n    } = props;\n\n    // Pure renderer: resolve the elementStyles passed in by the parent.\n    // No `useComponentDefaults('FormContainer', …)` lookup — that key is\n    // intentionally not part of the consumer-facing theme contract.\n    const elStyles = useResolvedElementStyles(parentElementStyles || {});\n    const { resolveToken } = useKitsTheme();\n    const themedFont = useThemedFont('body');\n\n    // Generate a unique element ID (for parity with web; not used in native labels)\n    const elementId = id ? `${id}_element` : uniqueId(\"element_\");\n\n    // Derive label placement from the label prop\n    const placement = useMemo(() => {\n        if (label && typeof label === 'object' && 'placement' in label) {\n            return label.placement; // \"RL\" | \"B\" | \"T\"\n        }\n        return \"T\"; // default: top\n    }, [label]);\n\n    // Determine layout direction based on placement\n    // T = top (column, label first), B = bottom (column-reverse), RL = side-by-side (row)\n    const isHorizontal = placement === \"RL\";\n    const isBottom = placement === \"B\";\n\n    // Label uses the plain Text path (NOT the FormControlLabel path) because\n    // @lmb-it/kitsconcertomobile's FormControlLabelText strips arbitrary\n    // inline styles, which broke `kitsTheme.components.Input.label.style`\n    // overrides on native. The plain Text path forwards `style` directly.\n    const labelElement = !isFloatedLabel ? (\n        <Label label={label} elementId={elementId} required={required} style={elStyles.label || undefined} />\n    ) : null;\n\n    /**\n     * Inline addon renderer. Mirrors the dispatch web uses in FormContainer\n     * (string → text, ReactElement → element) AND adds the function-arg\n     * branch native needs because lucide-react-native icons are passed as\n     * functions `(props) => <Icon …/>`. The function-arg branch never runs\n     * on web (web never goes through this code) so it cannot affect web.\n     */\n    const renderAddon = (\n        addon: IKitsContainer[\"leftAddon\"] | IKitsContainer[\"rightAddon\"],\n    ) => {\n        if (!addon) return null;\n        if (typeof addon === \"string\" || typeof addon === \"number\") {\n            return <Text fontSize={14}>{addon}</Text>;\n        }\n        if (typeof addon === \"function\") {\n            return (addon as (args: { size: number }) => React.ReactNode)({ size: 16 });\n        }\n        if (React.isValidElement(addon)) {\n            return addon;\n        }\n        return null;\n    };\n\n    // Resolved inputGroup wrapper style. The default theme provides\n    // `Input.inputGroup.style.{borderColor, borderRadius, borderWidth, height}`\n    // — these are what give the group its visual frame. Defaults are layered\n    // *under* the user's resolved style, so a per-instance override always wins.\n    //\n    // The `invalid` border color is applied as a fallback default (after\n    // theme defaults, before user `inputGroup.borderColor` override). When\n    // `bare` is set, the whole frame is suppressed (matches web's\n    // `bareInputGroupStyle`).\n    const inputGroupStyle = useMemo(() => {\n        if (bare) {\n            // Bare mode (FilePicker, Radio, Checkbox group, …): drop ALL\n            // inputGroup chrome including `height: 52` from the theme. Web's\n            // FormContainer does the same — it passes `style={{}}` when\n            // bare (see helpers/FormContainer/index.web.tsx, the bare\n            // branch of the row Flex). Without this, the non-classic file\n            // uploader's 200px dashed drop zone was being squashed to 52px.\n            return {\n                width: \"100%\" as const,\n                borderWidth: 0,\n                borderRadius: 0,\n                overflow: \"visible\" as const,\n            };\n        }\n        const userStyle = elStyles.inputGroup || {};\n        const userOverrodeBorderColor = \"borderColor\" in userStyle;\n        return {\n            width: \"100%\" as const,\n            flexDirection: \"row\" as const,\n            alignItems: \"stretch\" as const,\n            overflow: \"hidden\" as const,\n            ...userStyle,\n            ...(invalid && !userOverrodeBorderColor\n                ? { borderColor: resolveToken(\"danger\") }\n                : {}),\n        };\n    }, [bare, elStyles.inputGroup, invalid, resolveToken]);\n\n    // Addon baseline chrome — mirrors what PrimeReact's `.p-inputgroup-addon`\n    // CSS class gives web addons (gray fill + horizontal padding + 1px\n    // separator border on the input-facing edge). On web these defaults\n    // come from CSS; on native we must apply them inline. Theme overrides\n    // (`elStyles.leftAddon` / `rightAddon`) are spread LAST so per-instance\n    // values always win. The separator border colour falls back to the\n    // inputGroup border colour for visual continuity.\n    const addonSeparatorColor = (\n        (elStyles.inputGroup && elStyles.inputGroup.borderColor) ||\n        resolveToken(\"border\")\n    );\n    const addonBaseStyle = {\n        alignItems: \"center\" as const,\n        justifyContent: \"center\" as const,\n        paddingHorizontal: 12,\n        paddingVertical: 8,\n        backgroundColor: resolveToken(\"bg-input\"),\n    };\n\n    const contentElement = (\n        <View style={inputGroupStyle}>\n            {leftAddon ? (\n                <View\n                    style={{\n                        ...addonBaseStyle,\n                        borderEndWidth: 1,\n                        borderEndColor: addonSeparatorColor,\n                        ...(elStyles.leftAddon || {}),\n                    }}\n                >\n                    {renderAddon(leftAddon)}\n                </View>\n            ) : null}\n\n            {/* `justifyContent: 'center'` vertically centres the inner Input\n                inside the 52px-tall inputGroup (matching web, where flex\n                items default to vertical alignment via the inputGroup row\n                + the input's intrinsic line-box centring). Without this,\n                placeholders and selected values sat near the top edge of\n                the input. Tall children that already fill the height\n                (textarea) are unaffected because `justifyContent: 'center'`\n                is a no-op on items that match the parent's cross-axis. */}\n            <View style={{ flex: 1, justifyContent: 'center' }}>{children}</View>\n\n            {rightAddon ? (\n                <View\n                    style={{\n                        ...addonBaseStyle,\n                        borderStartWidth: 1,\n                        borderStartColor: addonSeparatorColor,\n                        ...(elStyles.rightAddon || {}),\n                    }}\n                >\n                    {renderAddon(rightAddon)}\n                </View>\n            ) : null}\n        </View>\n    );\n\n    const containerRnStyle = useMemo(\n        () => (containerStyle && Object.keys(containerStyle).length ? resolveStyle(containerStyle) : {}),\n        [containerStyle],\n    );\n\n    return(\n        <FormControl\n            isInvalid={invalid}\n            size=\"md\"\n            isDisabled={disabled}\n            isReadOnly={disabled}\n            isRequired={required}\n            style={{\n                width:'100%', gap: 4,\n                // `bare` strips the container's DEFAULT frame, but must not\n                // override an explicit `container` slot. Spread it FIRST so a\n                // user's borderRadius / borderWidth / overflow (e.g. an Object\n                // or Group styled as a card) wins over the reset.\n                ...(bare ? { borderWidth: 0, borderRadius: 0, overflow: 'visible' } : {}),\n                ...(elStyles.container || {}),\n                ...(containerRnStyle || {}),\n            }}\n        >\n            {isHorizontal ? (\n                <View style={{ flexDirection: 'row', alignItems: 'center', gap: 8, width: '100%' }}>\n                    {labelElement}\n                    <View style={{ flex: 1 }}>{contentElement}</View>\n                </View>\n            ) : isBottom ? (\n                <>\n                    {contentElement}\n                    {labelElement}\n                </>\n            ) : (\n                <>\n                    {labelElement}\n                    {contentElement}\n                </>\n            )}\n            {helperText && typeof helperText !== \"function\" && <FormControlHelper>\n                <FormControlHelperText style={{...(themedFont ? {fontFamily: themedFont} : {}), ...(elStyles.helperText || {})}}>\n                    {helperText}\n                </FormControlHelperText>\n            </FormControlHelper>}\n\n            {!hideError && <ErrorMessage invalid={invalid} errors={errors} style={elStyles.error || undefined} />}\n        </FormControl>\n    )\n};\n\nexport default KitsContainer;\n"],"names":["useResolvedElementStyles","useKitsTheme","useThemedFont","uniqueId","useMemo","jsx","Label","Text","jsxs","View","resolveStyle","FormControl","Fragment","FormControlHelper","FormControlHelperText","ErrorMessage"],"mappings":"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"}
+{"version":3,"file":"index.cjs","sources":["../../../../../src/form/helpers/FormContainer/index.native.tsx"],"sourcesContent":["import React, { type FC, type PropsWithChildren, useMemo } from \"react\";\nimport { View } from \"react-native\";\nimport { uniqueId } from \"lodash\";\nimport ErrorMessage from \"../ErrorMessage\";\nimport type {IKitsContainer} from \"@lmb-it/kitsconcerto-types\";\nimport {\n    FormControl,\n    FormControlHelper,\n    FormControlHelperText,\n    style as resolveStyle,\n} from \"@lmb-it/kitsconcertomobile\"\nimport { Label, Text, useKitsTheme } from \"../../../_compat\";\nimport {useResolvedElementStyles, useThemedFont} from \"@lmb-it/kitsconcerto/hooks\";\n\n/**\n * KitsContainer (native) — wraps all form inputs with label, addons, helper\n * text, and errors. Mirror of the web variant: a pure renderer that does NO\n * independent theme lookup. Every slot style comes from `elementStyles`\n * passed by the parent input (already merged through the\n *   FormElement < Input/Select < InputText/DropdownSelect/… < per-instance slots\n * chain by the parent's `useComponentDefaults` call).\n *\n * Addon rendering is inlined here (matches web FormContainer). There is NO\n * `Addons` component on either platform anymore — the previous native Addons\n * helper re-resolved tokens and hardcoded `borderRadius / borderWidth /\n * padding / backgroundColor / borderColor` defaults that clobbered\n * `kitsTheme.components.*.leftAddon.style` overrides. Both bugs are fixed by\n * deleting the indirection.\n *\n * Element slots applied here (identical contract to web):\n *   container  → outer FormControl wrapper\n *   label      → Label component (plain Text path on native — see Label.native)\n *   inputGroup → input group wrapper (around addons + input). On native this\n *                wrapper carries the visual border that web gets from the\n *                `.p-inputgroup` CSS class.\n *   leftAddon  → left addon View\n *   rightAddon → right addon View\n *   helperText → helper text below the group\n *   error      → error message below the group\n *\n * The `root` slot is NOT applied here — it is applied by the parent form\n * input component directly to the inner Input/Textarea element.\n */\nconst KitsContainer: FC<PropsWithChildren<IKitsContainer>> = (props) => {\n    const {\n        id,\n        helperText,\n        children,\n        rightAddon,\n        leftAddon,\n        errors,\n        invalid,\n        required,\n        hideError,\n        label,\n        isFloatedLabel,\n        containerStyle,\n        disabled,\n        bare,\n        elementStyles: parentElementStyles,\n    } = props;\n\n    // Pure renderer: resolve the elementStyles passed in by the parent.\n    // No `useComponentDefaults('FormContainer', …)` lookup — that key is\n    // intentionally not part of the consumer-facing theme contract.\n    const elStyles = useResolvedElementStyles(parentElementStyles || {});\n    const { resolveToken } = useKitsTheme();\n    const themedFont = useThemedFont('body');\n\n    // Generate a unique element ID (for parity with web; not used in native labels)\n    const elementId = id ? `${id}_element` : uniqueId(\"element_\");\n\n    // Derive label placement from the label prop\n    const placement = useMemo(() => {\n        if (label && typeof label === 'object' && 'placement' in label) {\n            return label.placement; // \"RL\" | \"B\" | \"T\"\n        }\n        return \"T\"; // default: top\n    }, [label]);\n\n    // Determine layout direction based on placement\n    // T = top (column, label first), B = bottom (column-reverse), RL = side-by-side (row)\n    const isHorizontal = placement === \"RL\";\n    const isBottom = placement === \"B\";\n\n    // Label uses the plain Text path (NOT the FormControlLabel path) because\n    // @lmb-it/kitsconcertomobile's FormControlLabelText strips arbitrary\n    // inline styles, which broke `kitsTheme.components.Input.label.style`\n    // overrides on native. The plain Text path forwards `style` directly.\n    const labelElement = !isFloatedLabel ? (\n        <Label label={label} elementId={elementId} required={required} style={elStyles.label || undefined} />\n    ) : null;\n\n    /**\n     * Inline addon renderer. Mirrors the dispatch web uses in FormContainer\n     * (string → text, ReactElement → element) AND adds the function-arg\n     * branch native needs because lucide-react-native icons are passed as\n     * functions `(props) => <Icon …/>`. The function-arg branch never runs\n     * on web (web never goes through this code) so it cannot affect web.\n     */\n    const renderAddon = (\n        addon: IKitsContainer[\"leftAddon\"] | IKitsContainer[\"rightAddon\"],\n    ) => {\n        if (!addon) return null;\n        if (typeof addon === \"string\" || typeof addon === \"number\") {\n            return <Text fontSize={14}>{addon}</Text>;\n        }\n        if (typeof addon === \"function\") {\n            return (addon as (args: { size: number }) => React.ReactNode)({ size: 16 });\n        }\n        if (React.isValidElement(addon)) {\n            return addon;\n        }\n        return null;\n    };\n\n    // Resolved inputGroup wrapper style. The default theme provides\n    // `Input.inputGroup.style.{borderColor, borderRadius, borderWidth, height}`\n    // — these are what give the group its visual frame. Defaults are layered\n    // *under* the user's resolved style, so a per-instance override always wins.\n    //\n    // The `invalid` border color is applied as a fallback default (after\n    // theme defaults, before user `inputGroup.borderColor` override). When\n    // `bare` is set, the whole frame is suppressed (matches web's\n    // `bareInputGroupStyle`).\n    const inputGroupStyle = useMemo(() => {\n        if (bare) {\n            // Bare mode (FilePicker, Radio, Checkbox group, …): drop ALL\n            // inputGroup chrome including `height: 52` from the theme. Web's\n            // FormContainer does the same — it passes `style={{}}` when\n            // bare (see helpers/FormContainer/index.web.tsx, the bare\n            // branch of the row Flex). Without this, the non-classic file\n            // uploader's 200px dashed drop zone was being squashed to 52px.\n            return {\n                width: \"100%\" as const,\n                borderWidth: 0,\n                borderRadius: 0,\n                overflow: \"visible\" as const,\n            };\n        }\n        const userStyle = elStyles.inputGroup || {};\n        const userOverrodeBorderColor = \"borderColor\" in userStyle;\n        return {\n            width: \"100%\" as const,\n            flexDirection: \"row\" as const,\n            alignItems: \"stretch\" as const,\n            overflow: \"hidden\" as const,\n            ...userStyle,\n            ...(invalid && !userOverrodeBorderColor\n                ? { borderColor: resolveToken(\"danger\") }\n                : {}),\n        };\n    }, [bare, elStyles.inputGroup, invalid, resolveToken]);\n\n    // Addon baseline chrome — mirrors what PrimeReact's `.p-inputgroup-addon`\n    // CSS class gives web addons (gray fill + horizontal padding + 1px\n    // separator border on the input-facing edge). On web these defaults\n    // come from CSS; on native we must apply them inline. Theme overrides\n    // (`elStyles.leftAddon` / `rightAddon`) are spread LAST so per-instance\n    // values always win. The separator border colour falls back to the\n    // inputGroup border colour for visual continuity.\n    const addonSeparatorColor = (\n        (elStyles.inputGroup && elStyles.inputGroup.borderColor) ||\n        resolveToken(\"border\")\n    );\n    const addonBaseStyle = {\n        alignItems: \"center\" as const,\n        justifyContent: \"center\" as const,\n        paddingHorizontal: 12,\n        paddingVertical: 8,\n        backgroundColor: resolveToken(\"bg-input\"),\n    };\n\n    const contentElement = (\n        <View style={inputGroupStyle}>\n            {leftAddon ? (\n                <View\n                    style={{\n                        ...addonBaseStyle,\n                        borderEndWidth: 1,\n                        borderEndColor: addonSeparatorColor,\n                        ...(elStyles.leftAddon || {}),\n                    }}\n                >\n                    {renderAddon(leftAddon)}\n                </View>\n            ) : null}\n\n            {/* `justifyContent: 'center'` vertically centres the inner Input\n                inside the 52px-tall inputGroup (matching web, where flex\n                items default to vertical alignment via the inputGroup row\n                + the input's intrinsic line-box centring). Without this,\n                placeholders and selected values sat near the top edge of\n                the input. Tall children that already fill the height\n                (textarea) are unaffected because `justifyContent: 'center'`\n                is a no-op on items that match the parent's cross-axis. */}\n            <View style={{ flex: 1, justifyContent: 'center' }}>{children}</View>\n\n            {rightAddon ? (\n                <View\n                    style={{\n                        ...addonBaseStyle,\n                        borderStartWidth: 1,\n                        borderStartColor: addonSeparatorColor,\n                        ...(elStyles.rightAddon || {}),\n                    }}\n                >\n                    {renderAddon(rightAddon)}\n                </View>\n            ) : null}\n        </View>\n    );\n\n    const containerRnStyle = useMemo(\n        () => (containerStyle && Object.keys(containerStyle).length ? resolveStyle(containerStyle) : {}),\n        [containerStyle],\n    );\n\n    return(\n        <FormControl\n            isInvalid={invalid}\n            size=\"md\"\n            isDisabled={disabled}\n            isReadOnly={disabled}\n            isRequired={required}\n            style={{\n                width:'100%', gap: 4,\n                // `bare` strips the container's DEFAULT frame, but must not\n                // override an explicit `container` slot. Spread it FIRST so a\n                // user's borderRadius / borderWidth / overflow (e.g. an Object\n                // or Group styled as a card) wins over the reset.\n                ...(bare ? { borderWidth: 0, borderRadius: 0, overflow: 'visible' } : {}),\n                ...(elStyles.container || {}),\n                ...(containerRnStyle || {}),\n            }}\n        >\n            {isHorizontal ? (\n                <View style={{ flexDirection: 'row', alignItems: 'center', gap: 8, width: '100%' }}>\n                    {labelElement}\n                    <View style={{ flex: 1 }}>{contentElement}</View>\n                </View>\n            ) : isBottom ? (\n                <>\n                    {contentElement}\n                    {labelElement}\n                </>\n            ) : (\n                <>\n                    {labelElement}\n                    {contentElement}\n                </>\n            )}\n            {helperText && typeof helperText !== \"function\" && <FormControlHelper>\n                <FormControlHelperText style={{...(themedFont ? {fontFamily: themedFont} : {}), ...(elStyles.helperText || {})}}>\n                    {helperText}\n                </FormControlHelperText>\n            </FormControlHelper>}\n\n            {!hideError && <ErrorMessage invalid={invalid} errors={errors} style={elStyles.error || undefined} />}\n        </FormControl>\n    )\n};\n\nexport default KitsContainer;\n"],"names":["useResolvedElementStyles","useKitsTheme","useThemedFont","uniqueId","useMemo","jsx","Label","Text","jsxs","View","resolveStyle","FormControl","Fragment","FormControlHelper","FormControlHelperText","ErrorMessage"],"mappings":"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"}

package/form/helpers/FormContainer/index.js

@@ -85,6 +85,7 @@ import '../../../apps/mobile/src/Core/Input/Field.js';
 import '../../../apps/mobile/src/Core/Input/Slot.js';
 import '../../../contexts/DialogContext.js';
 import '../../../contexts/PermissionsContext.js';
+import '../../../contexts/BreadcrumbContext.js';
 import useResolvedElementStyles from '../../../hooks/useResolvedElementStyles.js';
 import useThemedFont from '../../../hooks/useThemedFont.js';
 import { useKitsTheme } from '../../../contexts/Theme/KitsThemeProvider.js';

package/form/helpers/FormContainer/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../../src/form/helpers/FormContainer/index.native.tsx"],"sourcesContent":["import React, { type FC, type PropsWithChildren, useMemo } from \"react\";\nimport { View } from \"react-native\";\nimport { uniqueId } from \"lodash\";\nimport ErrorMessage from \"../ErrorMessage\";\nimport type {IKitsContainer} from \"@lmb-it/kitsconcerto-types\";\nimport {\n    FormControl,\n    FormControlHelper,\n    FormControlHelperText,\n    style as resolveStyle,\n} from \"@lmb-it/kitsconcertomobile\"\nimport { Label, Text, useKitsTheme } from \"../../../_compat\";\nimport {useResolvedElementStyles, useThemedFont} from \"@lmb-it/kitsconcerto/hooks\";\n\n/**\n * KitsContainer (native) — wraps all form inputs with label, addons, helper\n * text, and errors. Mirror of the web variant: a pure renderer that does NO\n * independent theme lookup. Every slot style comes from `elementStyles`\n * passed by the parent input (already merged through the\n *   FormElement < Input/Select < InputText/DropdownSelect/… < per-instance slots\n * chain by the parent's `useComponentDefaults` call).\n *\n * Addon rendering is inlined here (matches web FormContainer). There is NO\n * `Addons` component on either platform anymore — the previous native Addons\n * helper re-resolved tokens and hardcoded `borderRadius / borderWidth /\n * padding / backgroundColor / borderColor` defaults that clobbered\n * `kitsTheme.components.*.leftAddon.style` overrides. Both bugs are fixed by\n * deleting the indirection.\n *\n * Element slots applied here (identical contract to web):\n *   container  → outer FormControl wrapper\n *   label      → Label component (plain Text path on native — see Label.native)\n *   inputGroup → input group wrapper (around addons + input). On native this\n *                wrapper carries the visual border that web gets from the\n *                `.p-inputgroup` CSS class.\n *   leftAddon  → left addon View\n *   rightAddon → right addon View\n *   helperText → helper text below the group\n *   error      → error message below the group\n *\n * The `root` slot is NOT applied here — it is applied by the parent form\n * input component directly to the inner Input/Textarea element.\n */\nconst KitsContainer: FC<PropsWithChildren<IKitsContainer>> = (props) => {\n    const {\n        id,\n        helperText,\n        children,\n        rightAddon,\n        leftAddon,\n        errors,\n        invalid,\n        required,\n        hideError,\n        label,\n        isFloatedLabel,\n        containerStyle,\n        disabled,\n        bare,\n        elementStyles: parentElementStyles,\n    } = props;\n\n    // Pure renderer: resolve the elementStyles passed in by the parent.\n    // No `useComponentDefaults('FormContainer', …)` lookup — that key is\n    // intentionally not part of the consumer-facing theme contract.\n    const elStyles = useResolvedElementStyles(parentElementStyles || {});\n    const { resolveToken } = useKitsTheme();\n    const themedFont = useThemedFont('body');\n\n    // Generate a unique element ID (for parity with web; not used in native labels)\n    const elementId = id ? `${id}_element` : uniqueId(\"element_\");\n\n    // Derive label placement from the label prop\n    const placement = useMemo(() => {\n        if (label && typeof label === 'object' && 'placement' in label) {\n            return label.placement; // \"RL\" | \"B\" | \"T\"\n        }\n        return \"T\"; // default: top\n    }, [label]);\n\n    // Determine layout direction based on placement\n    // T = top (column, label first), B = bottom (column-reverse), RL = side-by-side (row)\n    const isHorizontal = placement === \"RL\";\n    const isBottom = placement === \"B\";\n\n    // Label uses the plain Text path (NOT the FormControlLabel path) because\n    // @lmb-it/kitsconcertomobile's FormControlLabelText strips arbitrary\n    // inline styles, which broke `kitsTheme.components.Input.label.style`\n    // overrides on native. The plain Text path forwards `style` directly.\n    const labelElement = !isFloatedLabel ? (\n        <Label label={label} elementId={elementId} required={required} style={elStyles.label || undefined} />\n    ) : null;\n\n    /**\n     * Inline addon renderer. Mirrors the dispatch web uses in FormContainer\n     * (string → text, ReactElement → element) AND adds the function-arg\n     * branch native needs because lucide-react-native icons are passed as\n     * functions `(props) => <Icon …/>`. The function-arg branch never runs\n     * on web (web never goes through this code) so it cannot affect web.\n     */\n    const renderAddon = (\n        addon: IKitsContainer[\"leftAddon\"] | IKitsContainer[\"rightAddon\"],\n    ) => {\n        if (!addon) return null;\n        if (typeof addon === \"string\" || typeof addon === \"number\") {\n            return <Text fontSize={14}>{addon}</Text>;\n        }\n        if (typeof addon === \"function\") {\n            return (addon as (args: { size: number }) => React.ReactNode)({ size: 16 });\n        }\n        if (React.isValidElement(addon)) {\n            return addon;\n        }\n        return null;\n    };\n\n    // Resolved inputGroup wrapper style. The default theme provides\n    // `Input.inputGroup.style.{borderColor, borderRadius, borderWidth, height}`\n    // — these are what give the group its visual frame. Defaults are layered\n    // *under* the user's resolved style, so a per-instance override always wins.\n    //\n    // The `invalid` border color is applied as a fallback default (after\n    // theme defaults, before user `inputGroup.borderColor` override). When\n    // `bare` is set, the whole frame is suppressed (matches web's\n    // `bareInputGroupStyle`).\n    const inputGroupStyle = useMemo(() => {\n        if (bare) {\n            // Bare mode (FilePicker, Radio, Checkbox group, …): drop ALL\n            // inputGroup chrome including `height: 52` from the theme. Web's\n            // FormContainer does the same — it passes `style={{}}` when\n            // bare (see helpers/FormContainer/index.web.tsx, the bare\n            // branch of the row Flex). Without this, the non-classic file\n            // uploader's 200px dashed drop zone was being squashed to 52px.\n            return {\n                width: \"100%\" as const,\n                borderWidth: 0,\n                borderRadius: 0,\n                overflow: \"visible\" as const,\n            };\n        }\n        const userStyle = elStyles.inputGroup || {};\n        const userOverrodeBorderColor = \"borderColor\" in userStyle;\n        return {\n            width: \"100%\" as const,\n            flexDirection: \"row\" as const,\n            alignItems: \"stretch\" as const,\n            overflow: \"hidden\" as const,\n            ...userStyle,\n            ...(invalid && !userOverrodeBorderColor\n                ? { borderColor: resolveToken(\"danger\") }\n                : {}),\n        };\n    }, [bare, elStyles.inputGroup, invalid, resolveToken]);\n\n    // Addon baseline chrome — mirrors what PrimeReact's `.p-inputgroup-addon`\n    // CSS class gives web addons (gray fill + horizontal padding + 1px\n    // separator border on the input-facing edge). On web these defaults\n    // come from CSS; on native we must apply them inline. Theme overrides\n    // (`elStyles.leftAddon` / `rightAddon`) are spread LAST so per-instance\n    // values always win. The separator border colour falls back to the\n    // inputGroup border colour for visual continuity.\n    const addonSeparatorColor = (\n        (elStyles.inputGroup && elStyles.inputGroup.borderColor) ||\n        resolveToken(\"border\")\n    );\n    const addonBaseStyle = {\n        alignItems: \"center\" as const,\n        justifyContent: \"center\" as const,\n        paddingHorizontal: 12,\n        paddingVertical: 8,\n        backgroundColor: resolveToken(\"bg-input\"),\n    };\n\n    const contentElement = (\n        <View style={inputGroupStyle}>\n            {leftAddon ? (\n                <View\n                    style={{\n                        ...addonBaseStyle,\n                        borderEndWidth: 1,\n                        borderEndColor: addonSeparatorColor,\n                        ...(elStyles.leftAddon || {}),\n                    }}\n                >\n                    {renderAddon(leftAddon)}\n                </View>\n            ) : null}\n\n            {/* `justifyContent: 'center'` vertically centres the inner Input\n                inside the 52px-tall inputGroup (matching web, where flex\n                items default to vertical alignment via the inputGroup row\n                + the input's intrinsic line-box centring). Without this,\n                placeholders and selected values sat near the top edge of\n                the input. Tall children that already fill the height\n                (textarea) are unaffected because `justifyContent: 'center'`\n                is a no-op on items that match the parent's cross-axis. */}\n            <View style={{ flex: 1, justifyContent: 'center' }}>{children}</View>\n\n            {rightAddon ? (\n                <View\n                    style={{\n                        ...addonBaseStyle,\n                        borderStartWidth: 1,\n                        borderStartColor: addonSeparatorColor,\n                        ...(elStyles.rightAddon || {}),\n                    }}\n                >\n                    {renderAddon(rightAddon)}\n                </View>\n            ) : null}\n        </View>\n    );\n\n    const containerRnStyle = useMemo(\n        () => (containerStyle && Object.keys(containerStyle).length ? resolveStyle(containerStyle) : {}),\n        [containerStyle],\n    );\n\n    return(\n        <FormControl\n            isInvalid={invalid}\n            size=\"md\"\n            isDisabled={disabled}\n            isReadOnly={disabled}\n            isRequired={required}\n            style={{\n                width:'100%', gap: 4,\n                // `bare` strips the container's DEFAULT frame, but must not\n                // override an explicit `container` slot. Spread it FIRST so a\n                // user's borderRadius / borderWidth / overflow (e.g. an Object\n                // or Group styled as a card) wins over the reset.\n                ...(bare ? { borderWidth: 0, borderRadius: 0, overflow: 'visible' } : {}),\n                ...(elStyles.container || {}),\n                ...(containerRnStyle || {}),\n            }}\n        >\n            {isHorizontal ? (\n                <View style={{ flexDirection: 'row', alignItems: 'center', gap: 8, width: '100%' }}>\n                    {labelElement}\n                    <View style={{ flex: 1 }}>{contentElement}</View>\n                </View>\n            ) : isBottom ? (\n                <>\n                    {contentElement}\n                    {labelElement}\n                </>\n            ) : (\n                <>\n                    {labelElement}\n                    {contentElement}\n                </>\n            )}\n            {helperText && typeof helperText !== \"function\" && <FormControlHelper>\n                <FormControlHelperText style={{...(themedFont ? {fontFamily: themedFont} : {}), ...(elStyles.helperText || {})}}>\n                    {helperText}\n                </FormControlHelperText>\n            </FormControlHelper>}\n\n            {!hideError && <ErrorMessage invalid={invalid} errors={errors} style={elStyles.error || undefined} />}\n        </FormControl>\n    )\n};\n\nexport default KitsContainer;\n"],"names":["resolveStyle"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA2CA,MAAM,aAAA,GAAuD,CAAC,KAAA,KAAU;AACpE,EAAA,MAAM;AAAA,IACF,EAAA;AAAA,IACA,UAAA;AAAA,IACA,QAAA;AAAA,IACA,UAAA;AAAA,IACA,SAAA;AAAA,IACA,MAAA;AAAA,IACA,OAAA;AAAA,IACA,QAAA;AAAA,IACA,SAAA;AAAA,IACA,KAAA;AAAA,IACA,cAAA;AAAA,IACA,cAAA;AAAA,IACA,QAAA;AAAA,IACA,IAAA;AAAA,IACA,aAAA,EAAe;AAAA,GACnB,GAAI,KAAA;AAKJ,EAAA,MAAM,QAAA,GAAW,wBAAA,CAAyB,mBAAA,IAAuB,EAAE,CAAA;AACnE,EAAA,MAAM,EAAE,YAAA,EAAa,GAAI,YAAA,EAAa;AACtC,EAAA,MAAM,UAAA,GAAa,cAAc,MAAM,CAAA;AAGvC,EAAA,MAAM,YAAY,EAAA,GAAK,CAAA,EAAG,EAAE,CAAA,QAAA,CAAA,GAAa,SAAS,UAAU,CAAA;AAG5D,EAAA,MAAM,SAAA,GAAY,QAAQ,MAAM;AAC5B,IAAA,IAAI,KAAA,IAAS,OAAO,KAAA,KAAU,QAAA,IAAY,eAAe,KAAA,EAAO;AAC5D,MAAA,OAAO,KAAA,CAAM,SAAA;AAAA,IACjB;AACA,IAAA,OAAO,GAAA;AAAA,EACX,CAAA,EAAG,CAAC,KAAK,CAAC,CAAA;AAIV,EAAA,MAAM,eAAe,SAAA,KAAc,IAAA;AACnC,EAAA,MAAM,WAAW,SAAA,KAAc,GAAA;AAM/B,EAAA,MAAM,YAAA,GAAe,CAAC,cAAA,mBAClB,GAAA,CAAC,KAAA,EAAA,EAAM,KAAA,EAAc,SAAA,EAAsB,QAAA,EAAoB,KAAA,EAAO,QAAA,CAAS,KAAA,IAAS,MAAA,EAAW,CAAA,GACnG,IAAA;AASJ,EAAA,MAAM,WAAA,GAAc,CAChB,KAAA,KACC;AACD,IAAA,IAAI,CAAC,OAAO,OAAO,IAAA;AACnB,IAAA,IAAI,OAAO,KAAA,KAAU,QAAA,IAAY,OAAO,UAAU,QAAA,EAAU;AACxD,MAAA,uBAAO,GAAA,CAAC,IAAA,EAAA,EAAK,QAAA,EAAU,EAAA,EAAK,QAAA,EAAA,KAAA,EAAM,CAAA;AAAA,IACtC;AACA,IAAA,IAAI,OAAO,UAAU,UAAA,EAAY;AAC7B,MAAA,OAAQ,KAAA,CAAsD,EAAE,IAAA,EAAM,EAAA,EAAI,CAAA;AAAA,IAC9E;AACA,IAAA,IAAI,KAAA,CAAM,cAAA,CAAe,KAAK,CAAA,EAAG;AAC7B,MAAA,OAAO,KAAA;AAAA,IACX;AACA,IAAA,OAAO,IAAA;AAAA,EACX,CAAA;AAWA,EAAA,MAAM,eAAA,GAAkB,QAAQ,MAAM;AAClC,IAAA,IAAI,IAAA,EAAM;AAON,MAAA,OAAO;AAAA,QACH,KAAA,EAAO,MAAA;AAAA,QACP,WAAA,EAAa,CAAA;AAAA,QACb,YAAA,EAAc,CAAA;AAAA,QACd,QAAA,EAAU;AAAA,OACd;AAAA,IACJ;AACA,IAAA,MAAM,SAAA,GAAY,QAAA,CAAS,UAAA,IAAc,EAAC;AAC1C,IAAA,MAAM,0BAA0B,aAAA,IAAiB,SAAA;AACjD,IAAA,OAAO;AAAA,MACH,KAAA,EAAO,MAAA;AAAA,MACP,aAAA,EAAe,KAAA;AAAA,MACf,UAAA,EAAY,SAAA;AAAA,MACZ,QAAA,EAAU,QAAA;AAAA,MACV,GAAG,SAAA;AAAA,MACH,GAAI,OAAA,IAAW,CAAC,uBAAA,GACV,EAAE,aAAa,YAAA,CAAa,QAAQ,CAAA,EAAE,GACtC;AAAC,KACX;AAAA,EACJ,GAAG,CAAC,IAAA,EAAM,SAAS,UAAA,EAAY,OAAA,EAAS,YAAY,CAAC,CAAA;AASrD,EAAA,MAAM,sBACD,QAAA,CAAS,UAAA,IAAc,SAAS,UAAA,CAAW,WAAA,IAC5C,aAAa,QAAQ,CAAA;AAEzB,EAAA,MAAM,cAAA,GAAiB;AAAA,IACnB,UAAA,EAAY,QAAA;AAAA,IACZ,cAAA,EAAgB,QAAA;AAAA,IAChB,iBAAA,EAAmB,EAAA;AAAA,IACnB,eAAA,EAAiB,CAAA;AAAA,IACjB,eAAA,EAAiB,aAAa,UAAU;AAAA,GAC5C;AAEA,EAAA,MAAM,cAAA,mBACF,IAAA,CAAC,IAAA,EAAA,EAAK,KAAA,EAAO,eAAA,EACR,QAAA,EAAA;AAAA,IAAA,SAAA,mBACG,GAAA;AAAA,MAAC,IAAA;AAAA,MAAA;AAAA,QACG,KAAA,EAAO;AAAA,UACH,GAAG,cAAA;AAAA,UACH,cAAA,EAAgB,CAAA;AAAA,UAChB,cAAA,EAAgB,mBAAA;AAAA,UAChB,GAAI,QAAA,CAAS,SAAA,IAAa;AAAC,SAC/B;AAAA,QAEC,sBAAY,SAAS;AAAA;AAAA,KAC1B,GACA,IAAA;AAAA,oBAUJ,GAAA,CAAC,QAAK,KAAA,EAAO,EAAE,MAAM,CAAA,EAAG,cAAA,EAAgB,QAAA,EAAS,EAAI,QAAA,EAAS,CAAA;AAAA,IAE7D,UAAA,mBACG,GAAA;AAAA,MAAC,IAAA;AAAA,MAAA;AAAA,QACG,KAAA,EAAO;AAAA,UACH,GAAG,cAAA;AAAA,UACH,gBAAA,EAAkB,CAAA;AAAA,UAClB,gBAAA,EAAkB,mBAAA;AAAA,UAClB,GAAI,QAAA,CAAS,UAAA,IAAc;AAAC,SAChC;AAAA,QAEC,sBAAY,UAAU;AAAA;AAAA,KAC3B,GACA;AAAA,GAAA,EACR,CAAA;AAGJ,EAAA,MAAM,gBAAA,GAAmB,OAAA;AAAA,IACrB,MAAO,cAAA,IAAkB,MAAA,CAAO,IAAA,CAAK,cAAc,EAAE,MAAA,GAASA,KAAA,CAAa,cAAc,CAAA,GAAI,EAAC;AAAA,IAC9F,CAAC,cAAc;AAAA,GACnB;AAEA,EAAA,uBACI,IAAA;AAAA,IAAC,WAAA;AAAA,IAAA;AAAA,MACG,SAAA,EAAW,OAAA;AAAA,MACX,IAAA,EAAK,IAAA;AAAA,MACL,UAAA,EAAY,QAAA;AAAA,MACZ,UAAA,EAAY,QAAA;AAAA,MACZ,UAAA,EAAY,QAAA;AAAA,MACZ,KAAA,EAAO;AAAA,QACH,KAAA,EAAM,MAAA;AAAA,QAAQ,GAAA,EAAK,CAAA;AAAA;AAAA;AAAA;AAAA;AAAA,QAKnB,GAAI,IAAA,GAAO,EAAE,WAAA,EAAa,CAAA,EAAG,cAAc,CAAA,EAAG,QAAA,EAAU,SAAA,EAAU,GAAI,EAAC;AAAA,QACvE,GAAI,QAAA,CAAS,SAAA,IAAa,EAAC;AAAA,QAC3B,GAAI,oBAAoB;AAAC,OAC7B;AAAA,MAEC,QAAA,EAAA;AAAA,QAAA,YAAA,mBACG,IAAA,CAAC,IAAA,EAAA,EAAK,KAAA,EAAO,EAAE,aAAA,EAAe,KAAA,EAAO,UAAA,EAAY,QAAA,EAAU,GAAA,EAAK,CAAA,EAAG,KAAA,EAAO,MAAA,EAAO,EAC5E,QAAA,EAAA;AAAA,UAAA,YAAA;AAAA,8BACA,IAAA,EAAA,EAAK,KAAA,EAAO,EAAE,IAAA,EAAM,CAAA,IAAM,QAAA,EAAA,cAAA,EAAe;AAAA,SAAA,EAC9C,CAAA,GACA,2BACA,IAAA,CAAA,QAAA,EAAA,EACK,QAAA,EAAA;AAAA,UAAA,cAAA;AAAA,UACA;AAAA,SAAA,EACL,oBAEA,IAAA,CAAA,QAAA,EAAA,EACK,QAAA,EAAA;AAAA,UAAA,YAAA;AAAA,UACA;AAAA,SAAA,EACL,CAAA;AAAA,QAEH,UAAA,IAAc,OAAO,UAAA,KAAe,UAAA,oBAAc,GAAA,CAAC,qBAChD,QAAA,kBAAA,GAAA,CAAC,qBAAA,EAAA,EAAsB,KAAA,EAAO,EAAC,GAAI,UAAA,GAAa,EAAC,UAAA,EAAY,UAAA,EAAU,GAAI,EAAC,EAAI,GAAI,QAAA,CAAS,UAAA,IAAc,EAAC,EAAE,EACzG,QAAA,EAAA,UAAA,EACL,CAAA,EACJ,CAAA;AAAA,QAEC,CAAC,6BAAa,GAAA,CAAC,YAAA,EAAA,EAAa,SAAkB,MAAA,EAAgB,KAAA,EAAO,QAAA,CAAS,KAAA,IAAS,MAAA,EAAW;AAAA;AAAA;AAAA,GACvG;AAER;;;;"}
+{"version":3,"file":"index.js","sources":["../../../../../src/form/helpers/FormContainer/index.native.tsx"],"sourcesContent":["import React, { type FC, type PropsWithChildren, useMemo } from \"react\";\nimport { View } from \"react-native\";\nimport { uniqueId } from \"lodash\";\nimport ErrorMessage from \"../ErrorMessage\";\nimport type {IKitsContainer} from \"@lmb-it/kitsconcerto-types\";\nimport {\n    FormControl,\n    FormControlHelper,\n    FormControlHelperText,\n    style as resolveStyle,\n} from \"@lmb-it/kitsconcertomobile\"\nimport { Label, Text, useKitsTheme } from \"../../../_compat\";\nimport {useResolvedElementStyles, useThemedFont} from \"@lmb-it/kitsconcerto/hooks\";\n\n/**\n * KitsContainer (native) — wraps all form inputs with label, addons, helper\n * text, and errors. Mirror of the web variant: a pure renderer that does NO\n * independent theme lookup. Every slot style comes from `elementStyles`\n * passed by the parent input (already merged through the\n *   FormElement < Input/Select < InputText/DropdownSelect/… < per-instance slots\n * chain by the parent's `useComponentDefaults` call).\n *\n * Addon rendering is inlined here (matches web FormContainer). There is NO\n * `Addons` component on either platform anymore — the previous native Addons\n * helper re-resolved tokens and hardcoded `borderRadius / borderWidth /\n * padding / backgroundColor / borderColor` defaults that clobbered\n * `kitsTheme.components.*.leftAddon.style` overrides. Both bugs are fixed by\n * deleting the indirection.\n *\n * Element slots applied here (identical contract to web):\n *   container  → outer FormControl wrapper\n *   label      → Label component (plain Text path on native — see Label.native)\n *   inputGroup → input group wrapper (around addons + input). On native this\n *                wrapper carries the visual border that web gets from the\n *                `.p-inputgroup` CSS class.\n *   leftAddon  → left addon View\n *   rightAddon → right addon View\n *   helperText → helper text below the group\n *   error      → error message below the group\n *\n * The `root` slot is NOT applied here — it is applied by the parent form\n * input component directly to the inner Input/Textarea element.\n */\nconst KitsContainer: FC<PropsWithChildren<IKitsContainer>> = (props) => {\n    const {\n        id,\n        helperText,\n        children,\n        rightAddon,\n        leftAddon,\n        errors,\n        invalid,\n        required,\n        hideError,\n        label,\n        isFloatedLabel,\n        containerStyle,\n        disabled,\n        bare,\n        elementStyles: parentElementStyles,\n    } = props;\n\n    // Pure renderer: resolve the elementStyles passed in by the parent.\n    // No `useComponentDefaults('FormContainer', …)` lookup — that key is\n    // intentionally not part of the consumer-facing theme contract.\n    const elStyles = useResolvedElementStyles(parentElementStyles || {});\n    const { resolveToken } = useKitsTheme();\n    const themedFont = useThemedFont('body');\n\n    // Generate a unique element ID (for parity with web; not used in native labels)\n    const elementId = id ? `${id}_element` : uniqueId(\"element_\");\n\n    // Derive label placement from the label prop\n    const placement = useMemo(() => {\n        if (label && typeof label === 'object' && 'placement' in label) {\n            return label.placement; // \"RL\" | \"B\" | \"T\"\n        }\n        return \"T\"; // default: top\n    }, [label]);\n\n    // Determine layout direction based on placement\n    // T = top (column, label first), B = bottom (column-reverse), RL = side-by-side (row)\n    const isHorizontal = placement === \"RL\";\n    const isBottom = placement === \"B\";\n\n    // Label uses the plain Text path (NOT the FormControlLabel path) because\n    // @lmb-it/kitsconcertomobile's FormControlLabelText strips arbitrary\n    // inline styles, which broke `kitsTheme.components.Input.label.style`\n    // overrides on native. The plain Text path forwards `style` directly.\n    const labelElement = !isFloatedLabel ? (\n        <Label label={label} elementId={elementId} required={required} style={elStyles.label || undefined} />\n    ) : null;\n\n    /**\n     * Inline addon renderer. Mirrors the dispatch web uses in FormContainer\n     * (string → text, ReactElement → element) AND adds the function-arg\n     * branch native needs because lucide-react-native icons are passed as\n     * functions `(props) => <Icon …/>`. The function-arg branch never runs\n     * on web (web never goes through this code) so it cannot affect web.\n     */\n    const renderAddon = (\n        addon: IKitsContainer[\"leftAddon\"] | IKitsContainer[\"rightAddon\"],\n    ) => {\n        if (!addon) return null;\n        if (typeof addon === \"string\" || typeof addon === \"number\") {\n            return <Text fontSize={14}>{addon}</Text>;\n        }\n        if (typeof addon === \"function\") {\n            return (addon as (args: { size: number }) => React.ReactNode)({ size: 16 });\n        }\n        if (React.isValidElement(addon)) {\n            return addon;\n        }\n        return null;\n    };\n\n    // Resolved inputGroup wrapper style. The default theme provides\n    // `Input.inputGroup.style.{borderColor, borderRadius, borderWidth, height}`\n    // — these are what give the group its visual frame. Defaults are layered\n    // *under* the user's resolved style, so a per-instance override always wins.\n    //\n    // The `invalid` border color is applied as a fallback default (after\n    // theme defaults, before user `inputGroup.borderColor` override). When\n    // `bare` is set, the whole frame is suppressed (matches web's\n    // `bareInputGroupStyle`).\n    const inputGroupStyle = useMemo(() => {\n        if (bare) {\n            // Bare mode (FilePicker, Radio, Checkbox group, …): drop ALL\n            // inputGroup chrome including `height: 52` from the theme. Web's\n            // FormContainer does the same — it passes `style={{}}` when\n            // bare (see helpers/FormContainer/index.web.tsx, the bare\n            // branch of the row Flex). Without this, the non-classic file\n            // uploader's 200px dashed drop zone was being squashed to 52px.\n            return {\n                width: \"100%\" as const,\n                borderWidth: 0,\n                borderRadius: 0,\n                overflow: \"visible\" as const,\n            };\n        }\n        const userStyle = elStyles.inputGroup || {};\n        const userOverrodeBorderColor = \"borderColor\" in userStyle;\n        return {\n            width: \"100%\" as const,\n            flexDirection: \"row\" as const,\n            alignItems: \"stretch\" as const,\n            overflow: \"hidden\" as const,\n            ...userStyle,\n            ...(invalid && !userOverrodeBorderColor\n                ? { borderColor: resolveToken(\"danger\") }\n                : {}),\n        };\n    }, [bare, elStyles.inputGroup, invalid, resolveToken]);\n\n    // Addon baseline chrome — mirrors what PrimeReact's `.p-inputgroup-addon`\n    // CSS class gives web addons (gray fill + horizontal padding + 1px\n    // separator border on the input-facing edge). On web these defaults\n    // come from CSS; on native we must apply them inline. Theme overrides\n    // (`elStyles.leftAddon` / `rightAddon`) are spread LAST so per-instance\n    // values always win. The separator border colour falls back to the\n    // inputGroup border colour for visual continuity.\n    const addonSeparatorColor = (\n        (elStyles.inputGroup && elStyles.inputGroup.borderColor) ||\n        resolveToken(\"border\")\n    );\n    const addonBaseStyle = {\n        alignItems: \"center\" as const,\n        justifyContent: \"center\" as const,\n        paddingHorizontal: 12,\n        paddingVertical: 8,\n        backgroundColor: resolveToken(\"bg-input\"),\n    };\n\n    const contentElement = (\n        <View style={inputGroupStyle}>\n            {leftAddon ? (\n                <View\n                    style={{\n                        ...addonBaseStyle,\n                        borderEndWidth: 1,\n                        borderEndColor: addonSeparatorColor,\n                        ...(elStyles.leftAddon || {}),\n                    }}\n                >\n                    {renderAddon(leftAddon)}\n                </View>\n            ) : null}\n\n            {/* `justifyContent: 'center'` vertically centres the inner Input\n                inside the 52px-tall inputGroup (matching web, where flex\n                items default to vertical alignment via the inputGroup row\n                + the input's intrinsic line-box centring). Without this,\n                placeholders and selected values sat near the top edge of\n                the input. Tall children that already fill the height\n                (textarea) are unaffected because `justifyContent: 'center'`\n                is a no-op on items that match the parent's cross-axis. */}\n            <View style={{ flex: 1, justifyContent: 'center' }}>{children}</View>\n\n            {rightAddon ? (\n                <View\n                    style={{\n                        ...addonBaseStyle,\n                        borderStartWidth: 1,\n                        borderStartColor: addonSeparatorColor,\n                        ...(elStyles.rightAddon || {}),\n                    }}\n                >\n                    {renderAddon(rightAddon)}\n                </View>\n            ) : null}\n        </View>\n    );\n\n    const containerRnStyle = useMemo(\n        () => (containerStyle && Object.keys(containerStyle).length ? resolveStyle(containerStyle) : {}),\n        [containerStyle],\n    );\n\n    return(\n        <FormControl\n            isInvalid={invalid}\n            size=\"md\"\n            isDisabled={disabled}\n            isReadOnly={disabled}\n            isRequired={required}\n            style={{\n                width:'100%', gap: 4,\n                // `bare` strips the container's DEFAULT frame, but must not\n                // override an explicit `container` slot. Spread it FIRST so a\n                // user's borderRadius / borderWidth / overflow (e.g. an Object\n                // or Group styled as a card) wins over the reset.\n                ...(bare ? { borderWidth: 0, borderRadius: 0, overflow: 'visible' } : {}),\n                ...(elStyles.container || {}),\n                ...(containerRnStyle || {}),\n            }}\n        >\n            {isHorizontal ? (\n                <View style={{ flexDirection: 'row', alignItems: 'center', gap: 8, width: '100%' }}>\n                    {labelElement}\n                    <View style={{ flex: 1 }}>{contentElement}</View>\n                </View>\n            ) : isBottom ? (\n                <>\n                    {contentElement}\n                    {labelElement}\n                </>\n            ) : (\n                <>\n                    {labelElement}\n                    {contentElement}\n                </>\n            )}\n            {helperText && typeof helperText !== \"function\" && <FormControlHelper>\n                <FormControlHelperText style={{...(themedFont ? {fontFamily: themedFont} : {}), ...(elStyles.helperText || {})}}>\n                    {helperText}\n                </FormControlHelperText>\n            </FormControlHelper>}\n\n            {!hideError && <ErrorMessage invalid={invalid} errors={errors} style={elStyles.error || undefined} />}\n        </FormControl>\n    )\n};\n\nexport default KitsContainer;\n"],"names":["resolveStyle"],"mappings":"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"}

package/form/inputs/ColorPicker/index.cjs

@@ -11,6 +11,7 @@ var useFormInputController_native = require('../../helpers/useFormInputControlle
 var colorPickerStyle_native = require('./colorPickerStyle.cjs');
 require('../../../contexts/DialogContext.cjs');
 require('../../../contexts/PermissionsContext.cjs');
+require('../../../contexts/BreadcrumbContext.cjs');
 var useComponentDefaults = require('../../../hooks/useComponentDefaults.cjs');
 var useResolvedStyle = require('../../../hooks/useResolvedStyle.cjs');
 var KitsThemeProvider_native = require('../../../contexts/Theme/KitsThemeProvider.cjs');

package/form/inputs/ColorPicker/index.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","sources":["../../../../../src/form/inputs/ColorPicker/index.native.tsx"],"sourcesContent":["import React, {useState} from \"react\";\nimport { View } from \"react-native\";\nimport ColorPicker, { colorKit, HueSlider, OpacitySlider, Panel1, PreviewText, Swatches, type ColorFormatsObject } from 'reanimated-color-picker';\nimport type { IKitsInputColorPicker } from \"@lmb-it/kitsconcerto-types\";\nimport KitsContainer from \"../../helpers/FormContainer\";\nimport { useFormInputController } from \"../../helpers/useFormInputController\";\nimport { createColorPickerStyle } from './colorPickerStyle';\nimport {useComponentDefaults, useResolvedStyle} from \"@lmb-it/kitsconcerto/hooks\";\nimport {useKitsTheme} from \"../../../contexts/Theme\";\n\nconst KitsInputColorPicker = ({ ref, ...rawProps }: IKitsInputColorPicker) => {\n    const { mergedProps: props, themeStyle, elementStyles } = useComponentDefaults('ColorPicker', rawProps, 'Input');\n    const resolvedThemeStyle = useResolvedStyle(themeStyle);\n    const resolvedRootStyle = useResolvedStyle(elementStyles?.root || {});\n    const {resolveToken} = useKitsTheme();\n    const colorPickerStyle = createColorPickerStyle(resolveToken);\n    const {\n        id,\n        label,\n        required,\n        disabled,\n        errors,\n        invalid,\n        helperText,\n        value,\n        defaultValue,\n        onChange,\n        leftAddon,\n        rightAddon,\n        colorFormat, // optional: may not be used directly in reanimated-color-picker\n        localProps = {},\n        ...rest\n    } = props;\n\n    const customSwatches = new Array(6).fill('#fff').map(() => colorKit.randomRgbColor().hex());\n\n    const [resultColor, setResultColor] = useState(customSwatches[0]);\n\n\n\n    // Unified controlled/uncontrolled logic\n    const { value: displayValue, emitChange, onWorkletChange, currentReanimatedValue } = useFormInputController<any>({\n        value,\n        defaultValue,\n        onChange\n    });\n\n    const onColorChange = (color: ColorFormatsObject) => {\n        'worklet';\n        onWorkletChange(color.hex);\n    };\n\n\n    return (\n        <KitsContainer\n            id={id}\n            label={label}\n            helperText={helperText}\n            errors={errors}\n            invalid={invalid}\n            disabled={disabled}\n            required={required}\n            leftAddon={leftAddon}\n            rightAddon={rightAddon}\n            elementStyles={elementStyles}\n        >\n            {/* Addons are rendered by KitsContainer (matches every other input\n                + web behaviour). This component owns only the picker surface. */}\n            <View style={{ width: \"100%\", ...(resolvedRootStyle && Object.keys(resolvedRootStyle).length > 0 ? resolvedRootStyle : resolvedThemeStyle) }}>\n                <ColorPicker\n                    value={resultColor}\n                    sliderThickness={25}\n                    thumbSize={24}\n                    thumbShape='circle'\n                    onChange={onColorChange}\n                    onCompleteJS={(color: ColorFormatsObject)=>emitChange(color.hex)}\n                    style={colorPickerStyle.picker}\n                    boundedThumb\n                >\n                    <Panel1 style={colorPickerStyle.panelStyle} />\n                    <HueSlider style={colorPickerStyle.sliderStyle} />\n                    <OpacitySlider style={colorPickerStyle.sliderStyle} />\n\n                    {/*<Divider />*/}\n                    <Swatches\n                        style={colorPickerStyle.swatchesContainer}\n                        swatchStyle={colorPickerStyle.swatchStyle}\n                        colors={customSwatches}\n                    />\n                    {/*<Divider />*/}\n\n                    <PreviewText style={colorPickerStyle.previewTxt} colorFormat='hwba' />\n                </ColorPicker>\n            </View>\n        </KitsContainer>\n    );\n};\n\nexport default KitsInputColorPicker;\n"],"names":["useComponentDefaults","useResolvedStyle","useKitsTheme","createColorPickerStyle","colorKit","useState","useFormInputController","jsx","KitsContainer","View","jsxs","Panel1","HueSlider","OpacitySlider","Swatches","PreviewText"],"mappings":"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"}
+{"version":3,"file":"index.cjs","sources":["../../../../../src/form/inputs/ColorPicker/index.native.tsx"],"sourcesContent":["import React, {useState} from \"react\";\nimport { View } from \"react-native\";\nimport ColorPicker, { colorKit, HueSlider, OpacitySlider, Panel1, PreviewText, Swatches, type ColorFormatsObject } from 'reanimated-color-picker';\nimport type { IKitsInputColorPicker } from \"@lmb-it/kitsconcerto-types\";\nimport KitsContainer from \"../../helpers/FormContainer\";\nimport { useFormInputController } from \"../../helpers/useFormInputController\";\nimport { createColorPickerStyle } from './colorPickerStyle';\nimport {useComponentDefaults, useResolvedStyle} from \"@lmb-it/kitsconcerto/hooks\";\nimport {useKitsTheme} from \"../../../contexts/Theme\";\n\nconst KitsInputColorPicker = ({ ref, ...rawProps }: IKitsInputColorPicker) => {\n    const { mergedProps: props, themeStyle, elementStyles } = useComponentDefaults('ColorPicker', rawProps, 'Input');\n    const resolvedThemeStyle = useResolvedStyle(themeStyle);\n    const resolvedRootStyle = useResolvedStyle(elementStyles?.root || {});\n    const {resolveToken} = useKitsTheme();\n    const colorPickerStyle = createColorPickerStyle(resolveToken);\n    const {\n        id,\n        label,\n        required,\n        disabled,\n        errors,\n        invalid,\n        helperText,\n        value,\n        defaultValue,\n        onChange,\n        leftAddon,\n        rightAddon,\n        colorFormat, // optional: may not be used directly in reanimated-color-picker\n        localProps = {},\n        ...rest\n    } = props;\n\n    const customSwatches = new Array(6).fill('#fff').map(() => colorKit.randomRgbColor().hex());\n\n    const [resultColor, setResultColor] = useState(customSwatches[0]);\n\n\n\n    // Unified controlled/uncontrolled logic\n    const { value: displayValue, emitChange, onWorkletChange, currentReanimatedValue } = useFormInputController<any>({\n        value,\n        defaultValue,\n        onChange\n    });\n\n    const onColorChange = (color: ColorFormatsObject) => {\n        'worklet';\n        onWorkletChange(color.hex);\n    };\n\n\n    return (\n        <KitsContainer\n            id={id}\n            label={label}\n            helperText={helperText}\n            errors={errors}\n            invalid={invalid}\n            disabled={disabled}\n            required={required}\n            leftAddon={leftAddon}\n            rightAddon={rightAddon}\n            elementStyles={elementStyles}\n        >\n            {/* Addons are rendered by KitsContainer (matches every other input\n                + web behaviour). This component owns only the picker surface. */}\n            <View style={{ width: \"100%\", ...(resolvedRootStyle && Object.keys(resolvedRootStyle).length > 0 ? resolvedRootStyle : resolvedThemeStyle) }}>\n                <ColorPicker\n                    value={resultColor}\n                    sliderThickness={25}\n                    thumbSize={24}\n                    thumbShape='circle'\n                    onChange={onColorChange}\n                    onCompleteJS={(color: ColorFormatsObject)=>emitChange(color.hex)}\n                    style={colorPickerStyle.picker}\n                    boundedThumb\n                >\n                    <Panel1 style={colorPickerStyle.panelStyle} />\n                    <HueSlider style={colorPickerStyle.sliderStyle} />\n                    <OpacitySlider style={colorPickerStyle.sliderStyle} />\n\n                    {/*<Divider />*/}\n                    <Swatches\n                        style={colorPickerStyle.swatchesContainer}\n                        swatchStyle={colorPickerStyle.swatchStyle}\n                        colors={customSwatches}\n                    />\n                    {/*<Divider />*/}\n\n                    <PreviewText style={colorPickerStyle.previewTxt} colorFormat='hwba' />\n                </ColorPicker>\n            </View>\n        </KitsContainer>\n    );\n};\n\nexport default KitsInputColorPicker;\n"],"names":["useComponentDefaults","useResolvedStyle","useKitsTheme","createColorPickerStyle","colorKit","useState","useFormInputController","jsx","KitsContainer","View","jsxs","Panel1","HueSlider","OpacitySlider","Swatches","PreviewText"],"mappings":"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"}

package/form/inputs/ColorPicker/index.js

@@ -7,6 +7,7 @@ import { useFormInputController } from '../../helpers/useFormInputController/use
 import { createColorPickerStyle } from './colorPickerStyle.js';
 import '../../../contexts/DialogContext.js';
 import '../../../contexts/PermissionsContext.js';
+import '../../../contexts/BreadcrumbContext.js';
 import useComponentDefaults from '../../../hooks/useComponentDefaults.js';
 import useResolvedStyle from '../../../hooks/useResolvedStyle.js';
 import { useKitsTheme } from '../../../contexts/Theme/KitsThemeProvider.js';

package/form/inputs/ColorPicker/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../../src/form/inputs/ColorPicker/index.native.tsx"],"sourcesContent":["import React, {useState} from \"react\";\nimport { View } from \"react-native\";\nimport ColorPicker, { colorKit, HueSlider, OpacitySlider, Panel1, PreviewText, Swatches, type ColorFormatsObject } from 'reanimated-color-picker';\nimport type { IKitsInputColorPicker } from \"@lmb-it/kitsconcerto-types\";\nimport KitsContainer from \"../../helpers/FormContainer\";\nimport { useFormInputController } from \"../../helpers/useFormInputController\";\nimport { createColorPickerStyle } from './colorPickerStyle';\nimport {useComponentDefaults, useResolvedStyle} from \"@lmb-it/kitsconcerto/hooks\";\nimport {useKitsTheme} from \"../../../contexts/Theme\";\n\nconst KitsInputColorPicker = ({ ref, ...rawProps }: IKitsInputColorPicker) => {\n    const { mergedProps: props, themeStyle, elementStyles } = useComponentDefaults('ColorPicker', rawProps, 'Input');\n    const resolvedThemeStyle = useResolvedStyle(themeStyle);\n    const resolvedRootStyle = useResolvedStyle(elementStyles?.root || {});\n    const {resolveToken} = useKitsTheme();\n    const colorPickerStyle = createColorPickerStyle(resolveToken);\n    const {\n        id,\n        label,\n        required,\n        disabled,\n        errors,\n        invalid,\n        helperText,\n        value,\n        defaultValue,\n        onChange,\n        leftAddon,\n        rightAddon,\n        colorFormat, // optional: may not be used directly in reanimated-color-picker\n        localProps = {},\n        ...rest\n    } = props;\n\n    const customSwatches = new Array(6).fill('#fff').map(() => colorKit.randomRgbColor().hex());\n\n    const [resultColor, setResultColor] = useState(customSwatches[0]);\n\n\n\n    // Unified controlled/uncontrolled logic\n    const { value: displayValue, emitChange, onWorkletChange, currentReanimatedValue } = useFormInputController<any>({\n        value,\n        defaultValue,\n        onChange\n    });\n\n    const onColorChange = (color: ColorFormatsObject) => {\n        'worklet';\n        onWorkletChange(color.hex);\n    };\n\n\n    return (\n        <KitsContainer\n            id={id}\n            label={label}\n            helperText={helperText}\n            errors={errors}\n            invalid={invalid}\n            disabled={disabled}\n            required={required}\n            leftAddon={leftAddon}\n            rightAddon={rightAddon}\n            elementStyles={elementStyles}\n        >\n            {/* Addons are rendered by KitsContainer (matches every other input\n                + web behaviour). This component owns only the picker surface. */}\n            <View style={{ width: \"100%\", ...(resolvedRootStyle && Object.keys(resolvedRootStyle).length > 0 ? resolvedRootStyle : resolvedThemeStyle) }}>\n                <ColorPicker\n                    value={resultColor}\n                    sliderThickness={25}\n                    thumbSize={24}\n                    thumbShape='circle'\n                    onChange={onColorChange}\n                    onCompleteJS={(color: ColorFormatsObject)=>emitChange(color.hex)}\n                    style={colorPickerStyle.picker}\n                    boundedThumb\n                >\n                    <Panel1 style={colorPickerStyle.panelStyle} />\n                    <HueSlider style={colorPickerStyle.sliderStyle} />\n                    <OpacitySlider style={colorPickerStyle.sliderStyle} />\n\n                    {/*<Divider />*/}\n                    <Swatches\n                        style={colorPickerStyle.swatchesContainer}\n                        swatchStyle={colorPickerStyle.swatchStyle}\n                        colors={customSwatches}\n                    />\n                    {/*<Divider />*/}\n\n                    <PreviewText style={colorPickerStyle.previewTxt} colorFormat='hwba' />\n                </ColorPicker>\n            </View>\n        </KitsContainer>\n    );\n};\n\nexport default KitsInputColorPicker;\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../../../../../src/form/inputs/ColorPicker/index.native.tsx"],"sourcesContent":["import React, {useState} from \"react\";\nimport { View } from \"react-native\";\nimport ColorPicker, { colorKit, HueSlider, OpacitySlider, Panel1, PreviewText, Swatches, type ColorFormatsObject } from 'reanimated-color-picker';\nimport type { IKitsInputColorPicker } from \"@lmb-it/kitsconcerto-types\";\nimport KitsContainer from \"../../helpers/FormContainer\";\nimport { useFormInputController } from \"../../helpers/useFormInputController\";\nimport { createColorPickerStyle } from './colorPickerStyle';\nimport {useComponentDefaults, useResolvedStyle} from \"@lmb-it/kitsconcerto/hooks\";\nimport {useKitsTheme} from \"../../../contexts/Theme\";\n\nconst KitsInputColorPicker = ({ ref, ...rawProps }: IKitsInputColorPicker) => {\n    const { mergedProps: props, themeStyle, elementStyles } = useComponentDefaults('ColorPicker', rawProps, 'Input');\n    const resolvedThemeStyle = useResolvedStyle(themeStyle);\n    const resolvedRootStyle = useResolvedStyle(elementStyles?.root || {});\n    const {resolveToken} = useKitsTheme();\n    const colorPickerStyle = createColorPickerStyle(resolveToken);\n    const {\n        id,\n        label,\n        required,\n        disabled,\n        errors,\n        invalid,\n        helperText,\n        value,\n        defaultValue,\n        onChange,\n        leftAddon,\n        rightAddon,\n        colorFormat, // optional: may not be used directly in reanimated-color-picker\n        localProps = {},\n        ...rest\n    } = props;\n\n    const customSwatches = new Array(6).fill('#fff').map(() => colorKit.randomRgbColor().hex());\n\n    const [resultColor, setResultColor] = useState(customSwatches[0]);\n\n\n\n    // Unified controlled/uncontrolled logic\n    const { value: displayValue, emitChange, onWorkletChange, currentReanimatedValue } = useFormInputController<any>({\n        value,\n        defaultValue,\n        onChange\n    });\n\n    const onColorChange = (color: ColorFormatsObject) => {\n        'worklet';\n        onWorkletChange(color.hex);\n    };\n\n\n    return (\n        <KitsContainer\n            id={id}\n            label={label}\n            helperText={helperText}\n            errors={errors}\n            invalid={invalid}\n            disabled={disabled}\n            required={required}\n            leftAddon={leftAddon}\n            rightAddon={rightAddon}\n            elementStyles={elementStyles}\n        >\n            {/* Addons are rendered by KitsContainer (matches every other input\n                + web behaviour). This component owns only the picker surface. */}\n            <View style={{ width: \"100%\", ...(resolvedRootStyle && Object.keys(resolvedRootStyle).length > 0 ? resolvedRootStyle : resolvedThemeStyle) }}>\n                <ColorPicker\n                    value={resultColor}\n                    sliderThickness={25}\n                    thumbSize={24}\n                    thumbShape='circle'\n                    onChange={onColorChange}\n                    onCompleteJS={(color: ColorFormatsObject)=>emitChange(color.hex)}\n                    style={colorPickerStyle.picker}\n                    boundedThumb\n                >\n                    <Panel1 style={colorPickerStyle.panelStyle} />\n                    <HueSlider style={colorPickerStyle.sliderStyle} />\n                    <OpacitySlider style={colorPickerStyle.sliderStyle} />\n\n                    {/*<Divider />*/}\n                    <Swatches\n                        style={colorPickerStyle.swatchesContainer}\n                        swatchStyle={colorPickerStyle.swatchStyle}\n                        colors={customSwatches}\n                    />\n                    {/*<Divider />*/}\n\n                    <PreviewText style={colorPickerStyle.previewTxt} colorFormat='hwba' />\n                </ColorPicker>\n            </View>\n        </KitsContainer>\n    );\n};\n\nexport default KitsInputColorPicker;\n"],"names":[],"mappings":"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"}

package/form/inputs/Datepicker/index.cjs

@@ -10,6 +10,7 @@ var index_native = require('../../helpers/FormContainer/index.cjs');
 var useFormInputController_native = require('../../helpers/useFormInputController/useFormInputController.cjs');
 require('../../../contexts/DialogContext.cjs');
 require('../../../contexts/PermissionsContext.cjs');
+require('../../../contexts/BreadcrumbContext.cjs');
 var useComponentDefaults = require('../../../hooks/useComponentDefaults.cjs');
 var useResolvedStyle = require('../../../hooks/useResolvedStyle.cjs');
 var useThemedFont = require('../../../hooks/useThemedFont.cjs');

package/form/inputs/Datepicker/index.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","sources":["../../../../../src/form/inputs/Datepicker/index.native.tsx"],"sourcesContent":["import React, { useCallback, useState } from 'react';\nimport { Modal, Platform, Pressable, View } from 'react-native';\nimport DateTimePicker, {\n    DateTimePickerAndroid,\n    type DatePickerOptions,\n} from '@react-native-community/datetimepicker';\nimport type { IKitsInputCalendar } from '@lmb-it/kitsconcerto-types';\nimport KitsContainer from '../../helpers/FormContainer';\nimport { useFormInputController } from '../../helpers/useFormInputController';\nimport { Text } from '../../../_compat';\nimport {\n    useComponentDefaults,\n    useResolvedStyle,\n    useThemedFont,\n} from '@lmb-it/kitsconcerto/hooks';\nimport { useKitsTheme } from '../../../contexts/Theme';\n\n/**\n * KitsInputCalendar (native).\n *\n * The previous implementation painted the native `DateTimePicker` underneath\n * an absolute-positioned cover with `pointerEvents='none'`. Taps fell through\n * to the native widget — but on iOS that widget renders as a small \"pill\"\n * centred in its parent, so the rest of the full-width row was un-tappable\n * even though it looked like an input.\n *\n * The picker is now opened *imperatively* on tap:\n *   • Android → `DateTimePickerAndroid.open(...)` (modal dialog).\n *   • iOS     → a `Modal` hosting an inline spinner `DateTimePicker`.\n *\n * The visible field is a single `Pressable` styled exactly like the other\n * inputs — `Input.root` + theme `root` slot — so design tokens\n * (background, border via FormContainer's `inputGroup`, font, colour)\n * stay in charge of the look. The Pressable fills the FormContainer's\n * inner cell via `flex: 1`, so the entire row becomes a tap target.\n */\nconst KitsInputCalendar = <T = DatePickerOptions,>({\n    ref: _ref,\n    placeholder,\n    ...rawProps\n}: IKitsInputCalendar<T>) => {\n    const { mergedProps: props, themeStyle, elementStyles } = useComponentDefaults(\n        'Datepicker',\n        rawProps as any,\n        'Input',\n    );\n    const resolvedThemeStyle = useResolvedStyle(themeStyle);\n    const resolvedRootStyle = useResolvedStyle(elementStyles?.root || {});\n    const { resolveToken } = useKitsTheme();\n    const themedFont = useThemedFont('body');\n\n    const {\n        id,\n        label,\n        helperText,\n        errors,\n        invalid,\n        required,\n        hideError,\n        disabled,\n        isFloatedLabel,\n        leftAddon,\n        rightAddon,\n        value,\n        defaultValue,\n        onChange,\n        containerStyle,\n        localProps = {} as DatePickerOptions,\n    } = props as any;\n\n    const { value: internalVal, emitChange } = useFormInputController<Date | null>({\n        value: value as Date | null,\n        defaultValue: defaultValue as Date | null,\n        onChange: (event) => {\n            onChange?.(event.target.value);\n        },\n    });\n\n    const val: Date | null = internalVal instanceof Date ? internalVal : null;\n\n    // Inline iOS picker visibility — Android uses the imperative API and never\n    // needs this state.\n    const [iosOpen, setIosOpen] = useState(false);\n\n    const handleNativeChange = useCallback(\n        (_event: any, picked?: Date) => {\n            if (picked) emitChange(picked);\n        },\n        [emitChange],\n    );\n\n    const openPicker = useCallback(() => {\n        if (disabled) return;\n        if (Platform.OS === 'android') {\n            DateTimePickerAndroid.open({\n                value: val ?? new Date(),\n                mode: 'date',\n                onChange: handleNativeChange,\n                ...(localProps as any),\n            });\n            return;\n        }\n        setIosOpen(true);\n    }, [disabled, val, handleNativeChange, localProps]);\n\n    // `Input.root` carries `color: 'text'` and the font-size used by every\n    // other input. We layer the per-instance `root` slot on top so consumers\n    // can still override colour, fontWeight, padding, etc. via theme tokens.\n    const rootStyle =\n        resolvedRootStyle && Object.keys(resolvedRootStyle).length\n            ? resolvedRootStyle\n            : resolvedThemeStyle;\n\n    const valueColor =\n        (rootStyle as any)?.color ?? resolveToken('text-primary');\n    // Placeholder colour mirrors the muted token used by Select/InputText.\n    const placeholderColor = resolveToken('text-muted');\n\n    const isEmpty = !val;\n    const displayText = val\n        ? val.toLocaleDateString()\n        : (placeholder as string | undefined) ?? '';\n\n    return (\n        <KitsContainer\n            id={id}\n            helperText={helperText}\n            errors={errors}\n            invalid={invalid}\n            label={label}\n            required={required}\n            hideError={hideError}\n            isFloatedLabel={isFloatedLabel}\n            disabled={disabled}\n            leftAddon={leftAddon}\n            rightAddon={rightAddon}\n            containerStyle={containerStyle}\n            elementStyles={elementStyles}\n        >\n            {/* The Pressable IS the input surface.\n                `flex: 1, alignSelf: 'stretch'` makes the tap target fill the\n                full row provided by FormContainer's inner `<View flex: 1>`\n                cell — including the horizontal padding, the empty area to\n                the right of the value, everything. `justifyContent: 'center'`\n                vertically centres the text the same way other inputs are\n                centred inside the 52-px inputGroup. */}\n            <Pressable\n                onPress={openPicker}\n                disabled={disabled}\n                accessibilityRole=\"button\"\n                accessibilityState={{ disabled: !!disabled }}\n                accessibilityLabel={\n                    typeof label === 'string'\n                        ? label\n                        : (label as any)?.text ?? 'Date picker'\n                }\n                style={({ pressed }) => ({\n                    flex: 1,\n                    alignSelf: 'stretch',\n                    justifyContent: 'center',\n                    paddingHorizontal: 12,\n                    opacity: pressed && !disabled ? 0.7 : 1,\n                    // `root` slot wins last — backgroundColor, color,\n                    // borderRadius, fontSize etc. all flow from the theme.\n                    ...(rootStyle || {}),\n                })}\n            >\n                <Text\n                    style={{\n                        ...(themedFont ? { fontFamily: themedFont } : {}),\n                        fontSize: (rootStyle as any)?.fontSize ?? 14,\n                        color: isEmpty ? placeholderColor : valueColor,\n                    }}\n                    numberOfLines={1}\n                >\n                    {displayText}\n                </Text>\n            </Pressable>\n\n            {Platform.OS === 'ios' && iosOpen ? (\n                <Modal\n                    transparent\n                    animationType=\"fade\"\n                    visible={iosOpen}\n                    onRequestClose={() => setIosOpen(false)}\n                >\n                    {/* Scrim — tap outside dismisses, matches Dialog UX. */}\n                    <Pressable\n                        onPress={() => setIosOpen(false)}\n                        style={{\n                            flex: 1,\n                            backgroundColor: 'rgba(0,0,0,0.4)',\n                            justifyContent: 'flex-end',\n                        }}\n                    >\n                        {/* Sheet — swallow taps so the scrim doesn't dismiss\n                            while the user is spinning the wheels. */}\n                        <Pressable\n                            onPress={() => {\n                                /* swallow */\n                            }}\n                            style={{\n                                backgroundColor:\n                                    (rootStyle as any)?.backgroundColor ??\n                                    resolveToken('surface-card'),\n                                borderTopLeftRadius: 16,\n                                borderTopRightRadius: 16,\n                                paddingTop: 8,\n                                paddingBottom: 24,\n                            }}\n                        >\n                            {/* Header row with a \"Done\" affordance. The\n                                wheel commits values as the user spins on\n                                iOS, so the button only dismisses the\n                                sheet — no extra emitChange needed. */}\n                            <View\n                                style={{\n                                    flexDirection: 'row',\n                                    justifyContent: 'flex-end',\n                                    paddingHorizontal: 16,\n                                    paddingBottom: 4,\n                                }}\n                            >\n                                <Pressable\n                                    onPress={() => setIosOpen(false)}\n                                    accessibilityRole=\"button\"\n                                    accessibilityLabel=\"Done\"\n                                    hitSlop={8}\n                                >\n                                    <Text\n                                        style={{\n                                            ...(themedFont\n                                                ? { fontFamily: themedFont }\n                                                : {}),\n                                            color: resolveToken('primary'),\n                                            fontWeight: '600',\n                                            fontSize: 16,\n                                        }}\n                                    >\n                                        Done\n                                    </Text>\n                                </Pressable>\n                            </View>\n                            <DateTimePicker\n                                value={val ?? new Date()}\n                                mode=\"date\"\n                                display=\"spinner\"\n                                onChange={handleNativeChange}\n                                disabled={disabled}\n                                {...(localProps as any)}\n                            />\n                        </Pressable>\n                    </Pressable>\n                </Modal>\n            ) : null}\n        </KitsContainer>\n    );\n};\n\nexport default KitsInputCalendar;\n"],"names":["useComponentDefaults","useResolvedStyle","useKitsTheme","useThemedFont","useFormInputController","useState","useCallback","Platform","DateTimePickerAndroid","jsxs","KitsContainer","jsx","Pressable","Text","Modal","View"],"mappings":"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"}
+{"version":3,"file":"index.cjs","sources":["../../../../../src/form/inputs/Datepicker/index.native.tsx"],"sourcesContent":["import React, { useCallback, useState } from 'react';\nimport { Modal, Platform, Pressable, View } from 'react-native';\nimport DateTimePicker, {\n    DateTimePickerAndroid,\n    type DatePickerOptions,\n} from '@react-native-community/datetimepicker';\nimport type { IKitsInputCalendar } from '@lmb-it/kitsconcerto-types';\nimport KitsContainer from '../../helpers/FormContainer';\nimport { useFormInputController } from '../../helpers/useFormInputController';\nimport { Text } from '../../../_compat';\nimport {\n    useComponentDefaults,\n    useResolvedStyle,\n    useThemedFont,\n} from '@lmb-it/kitsconcerto/hooks';\nimport { useKitsTheme } from '../../../contexts/Theme';\n\n/**\n * KitsInputCalendar (native).\n *\n * The previous implementation painted the native `DateTimePicker` underneath\n * an absolute-positioned cover with `pointerEvents='none'`. Taps fell through\n * to the native widget — but on iOS that widget renders as a small \"pill\"\n * centred in its parent, so the rest of the full-width row was un-tappable\n * even though it looked like an input.\n *\n * The picker is now opened *imperatively* on tap:\n *   • Android → `DateTimePickerAndroid.open(...)` (modal dialog).\n *   • iOS     → a `Modal` hosting an inline spinner `DateTimePicker`.\n *\n * The visible field is a single `Pressable` styled exactly like the other\n * inputs — `Input.root` + theme `root` slot — so design tokens\n * (background, border via FormContainer's `inputGroup`, font, colour)\n * stay in charge of the look. The Pressable fills the FormContainer's\n * inner cell via `flex: 1`, so the entire row becomes a tap target.\n */\nconst KitsInputCalendar = <T = DatePickerOptions,>({\n    ref: _ref,\n    placeholder,\n    ...rawProps\n}: IKitsInputCalendar<T>) => {\n    const { mergedProps: props, themeStyle, elementStyles } = useComponentDefaults(\n        'Datepicker',\n        rawProps as any,\n        'Input',\n    );\n    const resolvedThemeStyle = useResolvedStyle(themeStyle);\n    const resolvedRootStyle = useResolvedStyle(elementStyles?.root || {});\n    const { resolveToken } = useKitsTheme();\n    const themedFont = useThemedFont('body');\n\n    const {\n        id,\n        label,\n        helperText,\n        errors,\n        invalid,\n        required,\n        hideError,\n        disabled,\n        isFloatedLabel,\n        leftAddon,\n        rightAddon,\n        value,\n        defaultValue,\n        onChange,\n        containerStyle,\n        localProps = {} as DatePickerOptions,\n    } = props as any;\n\n    const { value: internalVal, emitChange } = useFormInputController<Date | null>({\n        value: value as Date | null,\n        defaultValue: defaultValue as Date | null,\n        onChange: (event) => {\n            onChange?.(event.target.value);\n        },\n    });\n\n    const val: Date | null = internalVal instanceof Date ? internalVal : null;\n\n    // Inline iOS picker visibility — Android uses the imperative API and never\n    // needs this state.\n    const [iosOpen, setIosOpen] = useState(false);\n\n    const handleNativeChange = useCallback(\n        (_event: any, picked?: Date) => {\n            if (picked) emitChange(picked);\n        },\n        [emitChange],\n    );\n\n    const openPicker = useCallback(() => {\n        if (disabled) return;\n        if (Platform.OS === 'android') {\n            DateTimePickerAndroid.open({\n                value: val ?? new Date(),\n                mode: 'date',\n                onChange: handleNativeChange,\n                ...(localProps as any),\n            });\n            return;\n        }\n        setIosOpen(true);\n    }, [disabled, val, handleNativeChange, localProps]);\n\n    // `Input.root` carries `color: 'text'` and the font-size used by every\n    // other input. We layer the per-instance `root` slot on top so consumers\n    // can still override colour, fontWeight, padding, etc. via theme tokens.\n    const rootStyle =\n        resolvedRootStyle && Object.keys(resolvedRootStyle).length\n            ? resolvedRootStyle\n            : resolvedThemeStyle;\n\n    const valueColor =\n        (rootStyle as any)?.color ?? resolveToken('text-primary');\n    // Placeholder colour mirrors the muted token used by Select/InputText.\n    const placeholderColor = resolveToken('text-muted');\n\n    const isEmpty = !val;\n    const displayText = val\n        ? val.toLocaleDateString()\n        : (placeholder as string | undefined) ?? '';\n\n    return (\n        <KitsContainer\n            id={id}\n            helperText={helperText}\n            errors={errors}\n            invalid={invalid}\n            label={label}\n            required={required}\n            hideError={hideError}\n            isFloatedLabel={isFloatedLabel}\n            disabled={disabled}\n            leftAddon={leftAddon}\n            rightAddon={rightAddon}\n            containerStyle={containerStyle}\n            elementStyles={elementStyles}\n        >\n            {/* The Pressable IS the input surface.\n                `flex: 1, alignSelf: 'stretch'` makes the tap target fill the\n                full row provided by FormContainer's inner `<View flex: 1>`\n                cell — including the horizontal padding, the empty area to\n                the right of the value, everything. `justifyContent: 'center'`\n                vertically centres the text the same way other inputs are\n                centred inside the 52-px inputGroup. */}\n            <Pressable\n                onPress={openPicker}\n                disabled={disabled}\n                accessibilityRole=\"button\"\n                accessibilityState={{ disabled: !!disabled }}\n                accessibilityLabel={\n                    typeof label === 'string'\n                        ? label\n                        : (label as any)?.text ?? 'Date picker'\n                }\n                style={({ pressed }) => ({\n                    flex: 1,\n                    alignSelf: 'stretch',\n                    justifyContent: 'center',\n                    paddingHorizontal: 12,\n                    opacity: pressed && !disabled ? 0.7 : 1,\n                    // `root` slot wins last — backgroundColor, color,\n                    // borderRadius, fontSize etc. all flow from the theme.\n                    ...(rootStyle || {}),\n                })}\n            >\n                <Text\n                    style={{\n                        ...(themedFont ? { fontFamily: themedFont } : {}),\n                        fontSize: (rootStyle as any)?.fontSize ?? 14,\n                        color: isEmpty ? placeholderColor : valueColor,\n                    }}\n                    numberOfLines={1}\n                >\n                    {displayText}\n                </Text>\n            </Pressable>\n\n            {Platform.OS === 'ios' && iosOpen ? (\n                <Modal\n                    transparent\n                    animationType=\"fade\"\n                    visible={iosOpen}\n                    onRequestClose={() => setIosOpen(false)}\n                >\n                    {/* Scrim — tap outside dismisses, matches Dialog UX. */}\n                    <Pressable\n                        onPress={() => setIosOpen(false)}\n                        style={{\n                            flex: 1,\n                            backgroundColor: 'rgba(0,0,0,0.4)',\n                            justifyContent: 'flex-end',\n                        }}\n                    >\n                        {/* Sheet — swallow taps so the scrim doesn't dismiss\n                            while the user is spinning the wheels. */}\n                        <Pressable\n                            onPress={() => {\n                                /* swallow */\n                            }}\n                            style={{\n                                backgroundColor:\n                                    (rootStyle as any)?.backgroundColor ??\n                                    resolveToken('surface-card'),\n                                borderTopLeftRadius: 16,\n                                borderTopRightRadius: 16,\n                                paddingTop: 8,\n                                paddingBottom: 24,\n                            }}\n                        >\n                            {/* Header row with a \"Done\" affordance. The\n                                wheel commits values as the user spins on\n                                iOS, so the button only dismisses the\n                                sheet — no extra emitChange needed. */}\n                            <View\n                                style={{\n                                    flexDirection: 'row',\n                                    justifyContent: 'flex-end',\n                                    paddingHorizontal: 16,\n                                    paddingBottom: 4,\n                                }}\n                            >\n                                <Pressable\n                                    onPress={() => setIosOpen(false)}\n                                    accessibilityRole=\"button\"\n                                    accessibilityLabel=\"Done\"\n                                    hitSlop={8}\n                                >\n                                    <Text\n                                        style={{\n                                            ...(themedFont\n                                                ? { fontFamily: themedFont }\n                                                : {}),\n                                            color: resolveToken('primary'),\n                                            fontWeight: '600',\n                                            fontSize: 16,\n                                        }}\n                                    >\n                                        Done\n                                    </Text>\n                                </Pressable>\n                            </View>\n                            <DateTimePicker\n                                value={val ?? new Date()}\n                                mode=\"date\"\n                                display=\"spinner\"\n                                onChange={handleNativeChange}\n                                disabled={disabled}\n                                {...(localProps as any)}\n                            />\n                        </Pressable>\n                    </Pressable>\n                </Modal>\n            ) : null}\n        </KitsContainer>\n    );\n};\n\nexport default KitsInputCalendar;\n"],"names":["useComponentDefaults","useResolvedStyle","useKitsTheme","useThemedFont","useFormInputController","useState","useCallback","Platform","DateTimePickerAndroid","jsxs","KitsContainer","jsx","Pressable","Text","Modal","View"],"mappings":"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"}

package/form/inputs/Datepicker/index.js

@@ -6,6 +6,7 @@ import KitsContainer from '../../helpers/FormContainer/index.js';
 import { useFormInputController } from '../../helpers/useFormInputController/useFormInputController.js';
 import '../../../contexts/DialogContext.js';
 import '../../../contexts/PermissionsContext.js';
+import '../../../contexts/BreadcrumbContext.js';
 import useComponentDefaults from '../../../hooks/useComponentDefaults.js';
 import useResolvedStyle from '../../../hooks/useResolvedStyle.js';
 import useThemedFont from '../../../hooks/useThemedFont.js';

package/form/inputs/Datepicker/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../../src/form/inputs/Datepicker/index.native.tsx"],"sourcesContent":["import React, { useCallback, useState } from 'react';\nimport { Modal, Platform, Pressable, View } from 'react-native';\nimport DateTimePicker, {\n    DateTimePickerAndroid,\n    type DatePickerOptions,\n} from '@react-native-community/datetimepicker';\nimport type { IKitsInputCalendar } from '@lmb-it/kitsconcerto-types';\nimport KitsContainer from '../../helpers/FormContainer';\nimport { useFormInputController } from '../../helpers/useFormInputController';\nimport { Text } from '../../../_compat';\nimport {\n    useComponentDefaults,\n    useResolvedStyle,\n    useThemedFont,\n} from '@lmb-it/kitsconcerto/hooks';\nimport { useKitsTheme } from '../../../contexts/Theme';\n\n/**\n * KitsInputCalendar (native).\n *\n * The previous implementation painted the native `DateTimePicker` underneath\n * an absolute-positioned cover with `pointerEvents='none'`. Taps fell through\n * to the native widget — but on iOS that widget renders as a small \"pill\"\n * centred in its parent, so the rest of the full-width row was un-tappable\n * even though it looked like an input.\n *\n * The picker is now opened *imperatively* on tap:\n *   • Android → `DateTimePickerAndroid.open(...)` (modal dialog).\n *   • iOS     → a `Modal` hosting an inline spinner `DateTimePicker`.\n *\n * The visible field is a single `Pressable` styled exactly like the other\n * inputs — `Input.root` + theme `root` slot — so design tokens\n * (background, border via FormContainer's `inputGroup`, font, colour)\n * stay in charge of the look. The Pressable fills the FormContainer's\n * inner cell via `flex: 1`, so the entire row becomes a tap target.\n */\nconst KitsInputCalendar = <T = DatePickerOptions,>({\n    ref: _ref,\n    placeholder,\n    ...rawProps\n}: IKitsInputCalendar<T>) => {\n    const { mergedProps: props, themeStyle, elementStyles } = useComponentDefaults(\n        'Datepicker',\n        rawProps as any,\n        'Input',\n    );\n    const resolvedThemeStyle = useResolvedStyle(themeStyle);\n    const resolvedRootStyle = useResolvedStyle(elementStyles?.root || {});\n    const { resolveToken } = useKitsTheme();\n    const themedFont = useThemedFont('body');\n\n    const {\n        id,\n        label,\n        helperText,\n        errors,\n        invalid,\n        required,\n        hideError,\n        disabled,\n        isFloatedLabel,\n        leftAddon,\n        rightAddon,\n        value,\n        defaultValue,\n        onChange,\n        containerStyle,\n        localProps = {} as DatePickerOptions,\n    } = props as any;\n\n    const { value: internalVal, emitChange } = useFormInputController<Date | null>({\n        value: value as Date | null,\n        defaultValue: defaultValue as Date | null,\n        onChange: (event) => {\n            onChange?.(event.target.value);\n        },\n    });\n\n    const val: Date | null = internalVal instanceof Date ? internalVal : null;\n\n    // Inline iOS picker visibility — Android uses the imperative API and never\n    // needs this state.\n    const [iosOpen, setIosOpen] = useState(false);\n\n    const handleNativeChange = useCallback(\n        (_event: any, picked?: Date) => {\n            if (picked) emitChange(picked);\n        },\n        [emitChange],\n    );\n\n    const openPicker = useCallback(() => {\n        if (disabled) return;\n        if (Platform.OS === 'android') {\n            DateTimePickerAndroid.open({\n                value: val ?? new Date(),\n                mode: 'date',\n                onChange: handleNativeChange,\n                ...(localProps as any),\n            });\n            return;\n        }\n        setIosOpen(true);\n    }, [disabled, val, handleNativeChange, localProps]);\n\n    // `Input.root` carries `color: 'text'` and the font-size used by every\n    // other input. We layer the per-instance `root` slot on top so consumers\n    // can still override colour, fontWeight, padding, etc. via theme tokens.\n    const rootStyle =\n        resolvedRootStyle && Object.keys(resolvedRootStyle).length\n            ? resolvedRootStyle\n            : resolvedThemeStyle;\n\n    const valueColor =\n        (rootStyle as any)?.color ?? resolveToken('text-primary');\n    // Placeholder colour mirrors the muted token used by Select/InputText.\n    const placeholderColor = resolveToken('text-muted');\n\n    const isEmpty = !val;\n    const displayText = val\n        ? val.toLocaleDateString()\n        : (placeholder as string | undefined) ?? '';\n\n    return (\n        <KitsContainer\n            id={id}\n            helperText={helperText}\n            errors={errors}\n            invalid={invalid}\n            label={label}\n            required={required}\n            hideError={hideError}\n            isFloatedLabel={isFloatedLabel}\n            disabled={disabled}\n            leftAddon={leftAddon}\n            rightAddon={rightAddon}\n            containerStyle={containerStyle}\n            elementStyles={elementStyles}\n        >\n            {/* The Pressable IS the input surface.\n                `flex: 1, alignSelf: 'stretch'` makes the tap target fill the\n                full row provided by FormContainer's inner `<View flex: 1>`\n                cell — including the horizontal padding, the empty area to\n                the right of the value, everything. `justifyContent: 'center'`\n                vertically centres the text the same way other inputs are\n                centred inside the 52-px inputGroup. */}\n            <Pressable\n                onPress={openPicker}\n                disabled={disabled}\n                accessibilityRole=\"button\"\n                accessibilityState={{ disabled: !!disabled }}\n                accessibilityLabel={\n                    typeof label === 'string'\n                        ? label\n                        : (label as any)?.text ?? 'Date picker'\n                }\n                style={({ pressed }) => ({\n                    flex: 1,\n                    alignSelf: 'stretch',\n                    justifyContent: 'center',\n                    paddingHorizontal: 12,\n                    opacity: pressed && !disabled ? 0.7 : 1,\n                    // `root` slot wins last — backgroundColor, color,\n                    // borderRadius, fontSize etc. all flow from the theme.\n                    ...(rootStyle || {}),\n                })}\n            >\n                <Text\n                    style={{\n                        ...(themedFont ? { fontFamily: themedFont } : {}),\n                        fontSize: (rootStyle as any)?.fontSize ?? 14,\n                        color: isEmpty ? placeholderColor : valueColor,\n                    }}\n                    numberOfLines={1}\n                >\n                    {displayText}\n                </Text>\n            </Pressable>\n\n            {Platform.OS === 'ios' && iosOpen ? (\n                <Modal\n                    transparent\n                    animationType=\"fade\"\n                    visible={iosOpen}\n                    onRequestClose={() => setIosOpen(false)}\n                >\n                    {/* Scrim — tap outside dismisses, matches Dialog UX. */}\n                    <Pressable\n                        onPress={() => setIosOpen(false)}\n                        style={{\n                            flex: 1,\n                            backgroundColor: 'rgba(0,0,0,0.4)',\n                            justifyContent: 'flex-end',\n                        }}\n                    >\n                        {/* Sheet — swallow taps so the scrim doesn't dismiss\n                            while the user is spinning the wheels. */}\n                        <Pressable\n                            onPress={() => {\n                                /* swallow */\n                            }}\n                            style={{\n                                backgroundColor:\n                                    (rootStyle as any)?.backgroundColor ??\n                                    resolveToken('surface-card'),\n                                borderTopLeftRadius: 16,\n                                borderTopRightRadius: 16,\n                                paddingTop: 8,\n                                paddingBottom: 24,\n                            }}\n                        >\n                            {/* Header row with a \"Done\" affordance. The\n                                wheel commits values as the user spins on\n                                iOS, so the button only dismisses the\n                                sheet — no extra emitChange needed. */}\n                            <View\n                                style={{\n                                    flexDirection: 'row',\n                                    justifyContent: 'flex-end',\n                                    paddingHorizontal: 16,\n                                    paddingBottom: 4,\n                                }}\n                            >\n                                <Pressable\n                                    onPress={() => setIosOpen(false)}\n                                    accessibilityRole=\"button\"\n                                    accessibilityLabel=\"Done\"\n                                    hitSlop={8}\n                                >\n                                    <Text\n                                        style={{\n                                            ...(themedFont\n                                                ? { fontFamily: themedFont }\n                                                : {}),\n                                            color: resolveToken('primary'),\n                                            fontWeight: '600',\n                                            fontSize: 16,\n                                        }}\n                                    >\n                                        Done\n                                    </Text>\n                                </Pressable>\n                            </View>\n                            <DateTimePicker\n                                value={val ?? new Date()}\n                                mode=\"date\"\n                                display=\"spinner\"\n                                onChange={handleNativeChange}\n                                disabled={disabled}\n                                {...(localProps as any)}\n                            />\n                        </Pressable>\n                    </Pressable>\n                </Modal>\n            ) : null}\n        </KitsContainer>\n    );\n};\n\nexport default KitsInputCalendar;\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../../../../../src/form/inputs/Datepicker/index.native.tsx"],"sourcesContent":["import React, { useCallback, useState } from 'react';\nimport { Modal, Platform, Pressable, View } from 'react-native';\nimport DateTimePicker, {\n    DateTimePickerAndroid,\n    type DatePickerOptions,\n} from '@react-native-community/datetimepicker';\nimport type { IKitsInputCalendar } from '@lmb-it/kitsconcerto-types';\nimport KitsContainer from '../../helpers/FormContainer';\nimport { useFormInputController } from '../../helpers/useFormInputController';\nimport { Text } from '../../../_compat';\nimport {\n    useComponentDefaults,\n    useResolvedStyle,\n    useThemedFont,\n} from '@lmb-it/kitsconcerto/hooks';\nimport { useKitsTheme } from '../../../contexts/Theme';\n\n/**\n * KitsInputCalendar (native).\n *\n * The previous implementation painted the native `DateTimePicker` underneath\n * an absolute-positioned cover with `pointerEvents='none'`. Taps fell through\n * to the native widget — but on iOS that widget renders as a small \"pill\"\n * centred in its parent, so the rest of the full-width row was un-tappable\n * even though it looked like an input.\n *\n * The picker is now opened *imperatively* on tap:\n *   • Android → `DateTimePickerAndroid.open(...)` (modal dialog).\n *   • iOS     → a `Modal` hosting an inline spinner `DateTimePicker`.\n *\n * The visible field is a single `Pressable` styled exactly like the other\n * inputs — `Input.root` + theme `root` slot — so design tokens\n * (background, border via FormContainer's `inputGroup`, font, colour)\n * stay in charge of the look. The Pressable fills the FormContainer's\n * inner cell via `flex: 1`, so the entire row becomes a tap target.\n */\nconst KitsInputCalendar = <T = DatePickerOptions,>({\n    ref: _ref,\n    placeholder,\n    ...rawProps\n}: IKitsInputCalendar<T>) => {\n    const { mergedProps: props, themeStyle, elementStyles } = useComponentDefaults(\n        'Datepicker',\n        rawProps as any,\n        'Input',\n    );\n    const resolvedThemeStyle = useResolvedStyle(themeStyle);\n    const resolvedRootStyle = useResolvedStyle(elementStyles?.root || {});\n    const { resolveToken } = useKitsTheme();\n    const themedFont = useThemedFont('body');\n\n    const {\n        id,\n        label,\n        helperText,\n        errors,\n        invalid,\n        required,\n        hideError,\n        disabled,\n        isFloatedLabel,\n        leftAddon,\n        rightAddon,\n        value,\n        defaultValue,\n        onChange,\n        containerStyle,\n        localProps = {} as DatePickerOptions,\n    } = props as any;\n\n    const { value: internalVal, emitChange } = useFormInputController<Date | null>({\n        value: value as Date | null,\n        defaultValue: defaultValue as Date | null,\n        onChange: (event) => {\n            onChange?.(event.target.value);\n        },\n    });\n\n    const val: Date | null = internalVal instanceof Date ? internalVal : null;\n\n    // Inline iOS picker visibility — Android uses the imperative API and never\n    // needs this state.\n    const [iosOpen, setIosOpen] = useState(false);\n\n    const handleNativeChange = useCallback(\n        (_event: any, picked?: Date) => {\n            if (picked) emitChange(picked);\n        },\n        [emitChange],\n    );\n\n    const openPicker = useCallback(() => {\n        if (disabled) return;\n        if (Platform.OS === 'android') {\n            DateTimePickerAndroid.open({\n                value: val ?? new Date(),\n                mode: 'date',\n                onChange: handleNativeChange,\n                ...(localProps as any),\n            });\n            return;\n        }\n        setIosOpen(true);\n    }, [disabled, val, handleNativeChange, localProps]);\n\n    // `Input.root` carries `color: 'text'` and the font-size used by every\n    // other input. We layer the per-instance `root` slot on top so consumers\n    // can still override colour, fontWeight, padding, etc. via theme tokens.\n    const rootStyle =\n        resolvedRootStyle && Object.keys(resolvedRootStyle).length\n            ? resolvedRootStyle\n            : resolvedThemeStyle;\n\n    const valueColor =\n        (rootStyle as any)?.color ?? resolveToken('text-primary');\n    // Placeholder colour mirrors the muted token used by Select/InputText.\n    const placeholderColor = resolveToken('text-muted');\n\n    const isEmpty = !val;\n    const displayText = val\n        ? val.toLocaleDateString()\n        : (placeholder as string | undefined) ?? '';\n\n    return (\n        <KitsContainer\n            id={id}\n            helperText={helperText}\n            errors={errors}\n            invalid={invalid}\n            label={label}\n            required={required}\n            hideError={hideError}\n            isFloatedLabel={isFloatedLabel}\n            disabled={disabled}\n            leftAddon={leftAddon}\n            rightAddon={rightAddon}\n            containerStyle={containerStyle}\n            elementStyles={elementStyles}\n        >\n            {/* The Pressable IS the input surface.\n                `flex: 1, alignSelf: 'stretch'` makes the tap target fill the\n                full row provided by FormContainer's inner `<View flex: 1>`\n                cell — including the horizontal padding, the empty area to\n                the right of the value, everything. `justifyContent: 'center'`\n                vertically centres the text the same way other inputs are\n                centred inside the 52-px inputGroup. */}\n            <Pressable\n                onPress={openPicker}\n                disabled={disabled}\n                accessibilityRole=\"button\"\n                accessibilityState={{ disabled: !!disabled }}\n                accessibilityLabel={\n                    typeof label === 'string'\n                        ? label\n                        : (label as any)?.text ?? 'Date picker'\n                }\n                style={({ pressed }) => ({\n                    flex: 1,\n                    alignSelf: 'stretch',\n                    justifyContent: 'center',\n                    paddingHorizontal: 12,\n                    opacity: pressed && !disabled ? 0.7 : 1,\n                    // `root` slot wins last — backgroundColor, color,\n                    // borderRadius, fontSize etc. all flow from the theme.\n                    ...(rootStyle || {}),\n                })}\n            >\n                <Text\n                    style={{\n                        ...(themedFont ? { fontFamily: themedFont } : {}),\n                        fontSize: (rootStyle as any)?.fontSize ?? 14,\n                        color: isEmpty ? placeholderColor : valueColor,\n                    }}\n                    numberOfLines={1}\n                >\n                    {displayText}\n                </Text>\n            </Pressable>\n\n            {Platform.OS === 'ios' && iosOpen ? (\n                <Modal\n                    transparent\n                    animationType=\"fade\"\n                    visible={iosOpen}\n                    onRequestClose={() => setIosOpen(false)}\n                >\n                    {/* Scrim — tap outside dismisses, matches Dialog UX. */}\n                    <Pressable\n                        onPress={() => setIosOpen(false)}\n                        style={{\n                            flex: 1,\n                            backgroundColor: 'rgba(0,0,0,0.4)',\n                            justifyContent: 'flex-end',\n                        }}\n                    >\n                        {/* Sheet — swallow taps so the scrim doesn't dismiss\n                            while the user is spinning the wheels. */}\n                        <Pressable\n                            onPress={() => {\n                                /* swallow */\n                            }}\n                            style={{\n                                backgroundColor:\n                                    (rootStyle as any)?.backgroundColor ??\n                                    resolveToken('surface-card'),\n                                borderTopLeftRadius: 16,\n                                borderTopRightRadius: 16,\n                                paddingTop: 8,\n                                paddingBottom: 24,\n                            }}\n                        >\n                            {/* Header row with a \"Done\" affordance. The\n                                wheel commits values as the user spins on\n                                iOS, so the button only dismisses the\n                                sheet — no extra emitChange needed. */}\n                            <View\n                                style={{\n                                    flexDirection: 'row',\n                                    justifyContent: 'flex-end',\n                                    paddingHorizontal: 16,\n                                    paddingBottom: 4,\n                                }}\n                            >\n                                <Pressable\n                                    onPress={() => setIosOpen(false)}\n                                    accessibilityRole=\"button\"\n                                    accessibilityLabel=\"Done\"\n                                    hitSlop={8}\n                                >\n                                    <Text\n                                        style={{\n                                            ...(themedFont\n                                                ? { fontFamily: themedFont }\n                                                : {}),\n                                            color: resolveToken('primary'),\n                                            fontWeight: '600',\n                                            fontSize: 16,\n                                        }}\n                                    >\n                                        Done\n                                    </Text>\n                                </Pressable>\n                            </View>\n                            <DateTimePicker\n                                value={val ?? new Date()}\n                                mode=\"date\"\n                                display=\"spinner\"\n                                onChange={handleNativeChange}\n                                disabled={disabled}\n                                {...(localProps as any)}\n                            />\n                        </Pressable>\n                    </Pressable>\n                </Modal>\n            ) : null}\n        </KitsContainer>\n    );\n};\n\nexport default KitsInputCalendar;\n"],"names":[],"mappings":"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"}

package/form/inputs/InputLocation/index.cjs

@@ -9,6 +9,7 @@ var googlePlaces_native = require('./googlePlaces.cjs');
 var SelectContext = require('../../selects/SelectContext.cjs');
 require('../../../contexts/DialogContext.cjs');
 require('../../../contexts/PermissionsContext.cjs');
+require('../../../contexts/BreadcrumbContext.cjs');
 
 const KitsInputLocation = ({
   id,

package/form/inputs/InputLocation/index.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","sources":["../../../../../src/form/inputs/InputLocation/index.tsx"],"sourcesContent":["import React, {useCallback, useMemo, useRef, useState} from \"react\";\nimport Experian from \"./Experian\";\nimport type {IKitsInputLocation, IRef} from \"@lmb-it/kitsconcerto-types\";\nimport {FormSelect} from \"../../../_compat\";\n// Platform-forked Google transport: legacy Web Service on native\n// (`googlePlaces.native.ts` — RN has no CORS), Places API (New) on web\n// (`googlePlaces.web.ts` — browsers block the legacy endpoints). Same\n// normalized contract on both sides (`googlePlaces.types.ts`), so the\n// Suggestion / IAddressFormat output is unchanged. There is deliberately NO\n// bare `googlePlaces.ts` — a bare sibling wins resolution over the platform\n// files and ships the wrong transport (the v0.1.238 regression).\nimport {googleAutocomplete, googleDetails} from \"./googlePlaces\";\n\ntype Suggestion = {\n    label: string;\n    value: string;\n    format?: string;\n};\n\nconst KitsInputLocation = ({\n                               id,\n                               label,\n                               errors,\n                               invalid,\n                               value,\n                               hideError,\n                               onAddressClick,\n                               onChange,\n                               disabled,\n                               placeholder,\n                               countryISO = \"AUS\",\n                               helperText,\n                               provider,\n                               apiKey,\n                               labelKey = \"label\",\n                               valueKey = \"value\",\n                               // list,\n                               ...rest\n                           }: IKitsInputLocation) => {\n    if (!apiKey) throw new Error(\"API KEY NOT PROVIDED\");\n\n    const selectRef = useRef<IRef>(null);\n    const [suggestions, setSuggestions] = useState<Suggestion[]>([]);\n    // In-flight Details dedupe: on web PrimeReact fires BOTH onChange and\n    // onSelect for a single pick, which would double the (billed) Details\n    // call. First one in wins; cleared when the fetch settles.\n    const pendingDetailsRef = useRef<string | null>(null);\n\n    const experian = useMemo(\n        () => (provider !== \"google\" ? new Experian(apiKey) : null),\n        [provider, apiKey]\n    );\n\n    const search = useCallback(\n        async (query: string): Promise<Suggestion[]> => {\n            if (query.length < 4) return [];\n\n            try {\n                if (provider === \"google\") {\n                    const mapped = await googleAutocomplete(query, apiKey, countryISO);\n                    setSuggestions(mapped);\n                    return mapped;\n                } else {\n                    const res = await experian?.searchAddress(query, countryISO);\n                    const mapped = res?.data?.result?.suggestions?.map((s: any) => ({\n                        label: s.text,\n                        value: s.global_address_key,\n                        format: s.format,\n                    })) || [];\n                    setSuggestions(mapped);\n                    return mapped;\n                }\n            } catch {\n                setSuggestions([]);\n                return [];\n            }\n        },\n        [provider, apiKey, countryISO, experian]\n    );\n\n    const onPickAddress = useCallback(\n        async (event: any, rawItem?: any) => {\n            // rawItem is the full suggestion { label, value } passed as second arg by the hook\n            const selected = rawItem ?? event;\n\n            if (!selected) return;\n\n            // WEB (PrimeReact) routes more than item objects through here:\n            // typed text arrives as a plain STRING, and a forceSelection\n            // blur-clear arrives as the raw change event with a null value.\n            // Reading `selected[labelKey]` on those wiped the consumer's\n            // controlled value with `undefined`. Pass strings through\n            // verbatim; propagate a clear as ''. Native only ever sends item\n            // objects, so both branches are no-ops there.\n            if (typeof selected === \"string\") {\n                onChange?.({target: {value: selected}} as any);\n                return;\n            }\n            if (!(valueKey in selected)) {\n                onChange?.({\n                    target: {value: selected?.target?.value ?? \"\"},\n                } as any);\n                return;\n            }\n\n            const placeId = selected[valueKey];\n\n            onChange?.({\n                target: {value: selected[labelKey]},\n            } as any);\n\n            if (!onAddressClick || !placeId) return;\n\n            if (provider === \"google\") {\n                // Web fires onChange AND onSelect for one pick — fetch once.\n                if (pendingDetailsRef.current === placeId) return;\n                pendingDetailsRef.current = placeId;\n                try {\n                    const details = await googleDetails(placeId, apiKey);\n\n                    // Build rich address format: each component has a `long` and `short` value.\n                    const richAddress: Record<string, any> = {\n                        formatted_address: details.formattedAddress,\n                        place_id: placeId,\n                        latitude: details.latitude,\n                        longitude: details.longitude,\n                    };\n\n                    details.components.forEach((c) => {\n                        if (c.type && !(c.type in richAddress)) {\n                            richAddress[c.type] = {\n                                long: c.long,\n                                short: c.short,\n                            };\n                        }\n                    });\n\n                    onAddressClick(richAddress);\n                } finally {\n                    pendingDetailsRef.current = null;\n                }\n            } else {\n                const res = await experian?.formatAddress(placeId);\n                if (res?.data?.result) { // @ts-ignore\n                    onAddressClick(res.data.result);\n                }\n            }\n        },\n        [\n            provider,\n            apiKey,\n            valueKey,\n            labelKey,\n            onChange,\n            onAddressClick,\n            experian,\n        ]\n    );\n\n    return (\n        <FormSelect\n            ref={selectRef}\n            id={id}\n            shape=\"autocomplete\"\n            value={value}\n            label={label}\n            placeholder={placeholder}\n            labelKey={labelKey}\n            valueKey={valueKey}\n            onChange={onPickAddress}\n            isMultiple={false}\n            forceSelection\n            completeMethod={search}\n            list={suggestions}\n            helperText={helperText}\n            hideError={hideError}\n            disabled={disabled}\n            invalid={invalid}\n            errors={errors}\n            {...rest}\n        />\n    );\n};\n\nexport default KitsInputLocation;\n"],"names":["useRef","useState","useMemo","Experian","useCallback","googleAutocomplete","googleDetails","jsx","FormSelect"],"mappings":"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"}
+{"version":3,"file":"index.cjs","sources":["../../../../../src/form/inputs/InputLocation/index.tsx"],"sourcesContent":["import React, {useCallback, useMemo, useRef, useState} from \"react\";\nimport Experian from \"./Experian\";\nimport type {IKitsInputLocation, IRef} from \"@lmb-it/kitsconcerto-types\";\nimport {FormSelect} from \"../../../_compat\";\n// Platform-forked Google transport: legacy Web Service on native\n// (`googlePlaces.native.ts` — RN has no CORS), Places API (New) on web\n// (`googlePlaces.web.ts` — browsers block the legacy endpoints). Same\n// normalized contract on both sides (`googlePlaces.types.ts`), so the\n// Suggestion / IAddressFormat output is unchanged. There is deliberately NO\n// bare `googlePlaces.ts` — a bare sibling wins resolution over the platform\n// files and ships the wrong transport (the v0.1.238 regression).\nimport {googleAutocomplete, googleDetails} from \"./googlePlaces\";\n\ntype Suggestion = {\n    label: string;\n    value: string;\n    format?: string;\n};\n\nconst KitsInputLocation = ({\n                               id,\n                               label,\n                               errors,\n                               invalid,\n                               value,\n                               hideError,\n                               onAddressClick,\n                               onChange,\n                               disabled,\n                               placeholder,\n                               countryISO = \"AUS\",\n                               helperText,\n                               provider,\n                               apiKey,\n                               labelKey = \"label\",\n                               valueKey = \"value\",\n                               // list,\n                               ...rest\n                           }: IKitsInputLocation) => {\n    if (!apiKey) throw new Error(\"API KEY NOT PROVIDED\");\n\n    const selectRef = useRef<IRef>(null);\n    const [suggestions, setSuggestions] = useState<Suggestion[]>([]);\n    // In-flight Details dedupe: on web PrimeReact fires BOTH onChange and\n    // onSelect for a single pick, which would double the (billed) Details\n    // call. First one in wins; cleared when the fetch settles.\n    const pendingDetailsRef = useRef<string | null>(null);\n\n    const experian = useMemo(\n        () => (provider !== \"google\" ? new Experian(apiKey) : null),\n        [provider, apiKey]\n    );\n\n    const search = useCallback(\n        async (query: string): Promise<Suggestion[]> => {\n            if (query.length < 4) return [];\n\n            try {\n                if (provider === \"google\") {\n                    const mapped = await googleAutocomplete(query, apiKey, countryISO);\n                    setSuggestions(mapped);\n                    return mapped;\n                } else {\n                    const res = await experian?.searchAddress(query, countryISO);\n                    const mapped = res?.data?.result?.suggestions?.map((s: any) => ({\n                        label: s.text,\n                        value: s.global_address_key,\n                        format: s.format,\n                    })) || [];\n                    setSuggestions(mapped);\n                    return mapped;\n                }\n            } catch {\n                setSuggestions([]);\n                return [];\n            }\n        },\n        [provider, apiKey, countryISO, experian]\n    );\n\n    const onPickAddress = useCallback(\n        async (event: any, rawItem?: any) => {\n            // rawItem is the full suggestion { label, value } passed as second arg by the hook\n            const selected = rawItem ?? event;\n\n            if (!selected) return;\n\n            // WEB (PrimeReact) routes more than item objects through here:\n            // typed text arrives as a plain STRING, and a forceSelection\n            // blur-clear arrives as the raw change event with a null value.\n            // Reading `selected[labelKey]` on those wiped the consumer's\n            // controlled value with `undefined`. Pass strings through\n            // verbatim; propagate a clear as ''. Native only ever sends item\n            // objects, so both branches are no-ops there.\n            if (typeof selected === \"string\") {\n                onChange?.({target: {value: selected}} as any);\n                return;\n            }\n            if (!(valueKey in selected)) {\n                onChange?.({\n                    target: {value: selected?.target?.value ?? \"\"},\n                } as any);\n                return;\n            }\n\n            const placeId = selected[valueKey];\n\n            onChange?.({\n                target: {value: selected[labelKey]},\n            } as any);\n\n            if (!onAddressClick || !placeId) return;\n\n            if (provider === \"google\") {\n                // Web fires onChange AND onSelect for one pick — fetch once.\n                if (pendingDetailsRef.current === placeId) return;\n                pendingDetailsRef.current = placeId;\n                try {\n                    const details = await googleDetails(placeId, apiKey);\n\n                    // Build rich address format: each component has a `long` and `short` value.\n                    const richAddress: Record<string, any> = {\n                        formatted_address: details.formattedAddress,\n                        place_id: placeId,\n                        latitude: details.latitude,\n                        longitude: details.longitude,\n                    };\n\n                    details.components.forEach((c) => {\n                        if (c.type && !(c.type in richAddress)) {\n                            richAddress[c.type] = {\n                                long: c.long,\n                                short: c.short,\n                            };\n                        }\n                    });\n\n                    onAddressClick(richAddress);\n                } finally {\n                    pendingDetailsRef.current = null;\n                }\n            } else {\n                const res = await experian?.formatAddress(placeId);\n                if (res?.data?.result) { // @ts-ignore\n                    onAddressClick(res.data.result);\n                }\n            }\n        },\n        [\n            provider,\n            apiKey,\n            valueKey,\n            labelKey,\n            onChange,\n            onAddressClick,\n            experian,\n        ]\n    );\n\n    return (\n        <FormSelect\n            ref={selectRef}\n            id={id}\n            shape=\"autocomplete\"\n            value={value}\n            label={label}\n            placeholder={placeholder}\n            labelKey={labelKey}\n            valueKey={valueKey}\n            onChange={onPickAddress}\n            isMultiple={false}\n            forceSelection\n            completeMethod={search}\n            list={suggestions}\n            helperText={helperText}\n            hideError={hideError}\n            disabled={disabled}\n            invalid={invalid}\n            errors={errors}\n            {...rest}\n        />\n    );\n};\n\nexport default KitsInputLocation;\n"],"names":["useRef","useState","useMemo","Experian","useCallback","googleAutocomplete","googleDetails","jsx","FormSelect"],"mappings":";;;;;;;;;;;;;AAmBA,MAAM,oBAAoB,CAAC;AAAA,EACI,EAAA;AAAA,EACA,KAAA;AAAA,EACA,MAAA;AAAA,EACA,OAAA;AAAA,EACA,KAAA;AAAA,EACA,SAAA;AAAA,EACA,cAAA;AAAA,EACA,QAAA;AAAA,EACA,QAAA;AAAA,EACA,WAAA;AAAA,EACA,UAAA,GAAa,KAAA;AAAA,EACb,UAAA;AAAA,EACA,QAAA;AAAA,EACA,MAAA;AAAA,EACA,QAAA,GAAW,OAAA;AAAA,EACX,QAAA,GAAW,OAAA;AAAA;AAAA,EAEX,GAAG;AACP,CAAA,KAA0B;AACjD,EAAA,IAAI,CAAC,MAAA,EAAQ,MAAM,IAAI,MAAM,sBAAsB,CAAA;AAEnD,EAAA,MAAM,SAAA,GAAYA,aAAa,IAAI,CAAA;AACnC,EAAA,MAAM,CAAC,WAAA,EAAa,cAAc,CAAA,GAAIC,cAAA,CAAuB,EAAE,CAAA;AAI/D,EAAA,MAAM,iBAAA,GAAoBD,aAAsB,IAAI,CAAA;AAEpD,EAAA,MAAM,QAAA,GAAWE,aAAA;AAAA,IACb,MAAO,QAAA,KAAa,QAAA,GAAW,IAAIC,gBAAA,CAAS,MAAM,CAAA,GAAI,IAAA;AAAA,IACtD,CAAC,UAAU,MAAM;AAAA,GACrB;AAEA,EAAA,MAAM,MAAA,GAASC,iBAAA;AAAA,IACX,OAAO,KAAA,KAAyC;AAC5C,MAAA,IAAI,KAAA,CAAM,MAAA,GAAS,CAAA,EAAG,OAAO,EAAC;AAE9B,MAAA,IAAI;AACA,QAAA,IAAI,aAAa,QAAA,EAAU;AACvB,UAAA,MAAM,MAAA,GAAS,MAAMC,sCAAA,CAAmB,KAAA,EAAO,QAAQ,UAAU,CAAA;AACjE,UAAA,cAAA,CAAe,MAAM,CAAA;AACrB,UAAA,OAAO,MAAA;AAAA,QACX,CAAA,MAAO;AACH,UAAA,MAAM,GAAA,GAAM,MAAM,QAAA,EAAU,aAAA,CAAc,OAAO,UAAU,CAAA;AAC3D,UAAA,MAAM,SAAS,GAAA,EAAK,IAAA,EAAM,QAAQ,WAAA,EAAa,GAAA,CAAI,CAAC,CAAA,MAAY;AAAA,YAC5D,OAAO,CAAA,CAAE,IAAA;AAAA,YACT,OAAO,CAAA,CAAE,kBAAA;AAAA,YACT,QAAQ,CAAA,CAAE;AAAA,WACd,CAAE,KAAK,EAAC;AACR,UAAA,cAAA,CAAe,MAAM,CAAA;AACrB,UAAA,OAAO,MAAA;AAAA,QACX;AAAA,MACJ,CAAA,CAAA,MAAQ;AACJ,QAAA,cAAA,CAAe,EAAE,CAAA;AACjB,QAAA,OAAO,EAAC;AAAA,MACZ;AAAA,IACJ,CAAA;AAAA,IACA,CAAC,QAAA,EAAU,MAAA,EAAQ,UAAA,EAAY,QAAQ;AAAA,GAC3C;AAEA,EAAA,MAAM,aAAA,GAAgBD,iBAAA;AAAA,IAClB,OAAO,OAAY,OAAA,KAAkB;AAEjC,MAAA,MAAM,WAAW,OAAA,IAAW,KAAA;AAE5B,MAAA,IAAI,CAAC,QAAA,EAAU;AASf,MAAA,IAAI,OAAO,aAAa,QAAA,EAAU;AAC9B,QAAA,QAAA,GAAW,EAAC,MAAA,EAAQ,EAAC,KAAA,EAAO,QAAA,IAAiB,CAAA;AAC7C,QAAA;AAAA,MACJ;AACA,MAAA,IAAI,EAAE,YAAY,QAAA,CAAA,EAAW;AACzB,QAAA,QAAA,GAAW;AAAA,UACP,QAAQ,EAAC,KAAA,EAAO,QAAA,EAAU,MAAA,EAAQ,SAAS,EAAA;AAAE,SACzC,CAAA;AACR,QAAA;AAAA,MACJ;AAEA,MAAA,MAAM,OAAA,GAAU,SAAS,QAAQ,CAAA;AAEjC,MAAA,QAAA,GAAW;AAAA,QACP,MAAA,EAAQ,EAAC,KAAA,EAAO,QAAA,CAAS,QAAQ,CAAA;AAAC,OAC9B,CAAA;AAER,MAAA,IAAI,CAAC,cAAA,IAAkB,CAAC,OAAA,EAAS;AAEjC,MAAA,IAAI,aAAa,QAAA,EAAU;AAEvB,QAAA,IAAI,iBAAA,CAAkB,YAAY,OAAA,EAAS;AAC3C,QAAA,iBAAA,CAAkB,OAAA,GAAU,OAAA;AAC5B,QAAA,IAAI;AACA,UAAA,MAAM,OAAA,GAAU,MAAME,iCAAA,CAAc,OAAA,EAAS,MAAM,CAAA;AAGnD,UAAA,MAAM,WAAA,GAAmC;AAAA,YACrC,mBAAmB,OAAA,CAAQ,gBAAA;AAAA,YAC3B,QAAA,EAAU,OAAA;AAAA,YACV,UAAU,OAAA,CAAQ,QAAA;AAAA,YAClB,WAAW,OAAA,CAAQ;AAAA,WACvB;AAEA,UAAA,OAAA,CAAQ,UAAA,CAAW,OAAA,CAAQ,CAAC,CAAA,KAAM;AAC9B,YAAA,IAAI,CAAA,CAAE,IAAA,IAAQ,EAAE,CAAA,CAAE,QAAQ,WAAA,CAAA,EAAc;AACpC,cAAA,WAAA,CAAY,CAAA,CAAE,IAAI,CAAA,GAAI;AAAA,gBAClB,MAAM,CAAA,CAAE,IAAA;AAAA,gBACR,OAAO,CAAA,CAAE;AAAA,eACb;AAAA,YACJ;AAAA,UACJ,CAAC,CAAA;AAED,UAAA,cAAA,CAAe,WAAW,CAAA;AAAA,QAC9B,CAAA,SAAE;AACE,UAAA,iBAAA,CAAkB,OAAA,GAAU,IAAA;AAAA,QAChC;AAAA,MACJ,CAAA,MAAO;AACH,QAAA,MAAM,GAAA,GAAM,MAAM,QAAA,EAAU,aAAA,CAAc,OAAO,CAAA;AACjD,QAAA,IAAI,GAAA,EAAK,MAAM,MAAA,EAAQ;AACnB,UAAA,cAAA,CAAe,GAAA,CAAI,KAAK,MAAM,CAAA;AAAA,QAClC;AAAA,MACJ;AAAA,IACJ,CAAA;AAAA,IACA;AAAA,MACI,QAAA;AAAA,MACA,MAAA;AAAA,MACA,QAAA;AAAA,MACA,QAAA;AAAA,MACA,QAAA;AAAA,MACA,cAAA;AAAA,MACA;AAAA;AACJ,GACJ;AAEA,EAAA,uBACIC,cAAA;AAAA,IAACC,qBAAA;AAAA,IAAA;AAAA,MACG,GAAA,EAAK,SAAA;AAAA,MACL,EAAA;AAAA,MACA,KAAA,EAAM,cAAA;AAAA,MACN,KAAA;AAAA,MACA,KAAA;AAAA,MACA,WAAA;AAAA,MACA,QAAA;AAAA,MACA,QAAA;AAAA,MACA,QAAA,EAAU,aAAA;AAAA,MACV,UAAA,EAAY,KAAA;AAAA,MACZ,cAAA,EAAc,IAAA;AAAA,MACd,cAAA,EAAgB,MAAA;AAAA,MAChB,IAAA,EAAM,WAAA;AAAA,MACN,UAAA;AAAA,MACA,SAAA;AAAA,MACA,QAAA;AAAA,MACA,OAAA;AAAA,MACA,MAAA;AAAA,MACC,GAAG;AAAA;AAAA,GACR;AAER;;;;"}

package/form/inputs/InputLocation/index.js

@@ -5,6 +5,7 @@ import { googleAutocomplete, googleDetails } from './googlePlaces.js';
 import FormSelect from '../../selects/SelectContext.js';
 import '../../../contexts/DialogContext.js';
 import '../../../contexts/PermissionsContext.js';
+import '../../../contexts/BreadcrumbContext.js';
 
 const KitsInputLocation = ({
   id,