@lmb-it/kitsconcerto-native 0.1.243 → 0.1.245

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

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","sources":["../../../../../src/form/inputs/InputTextarea/index.native.tsx"],"sourcesContent":["import React, {\n    forwardRef,\n    useCallback,\n    useEffect,\n    useImperativeHandle,\n    useRef,\n    useState,\n} from \"react\";\nimport type { IKitsInputTextarea } from \"@lmb-it/kitsconcerto-types\";\nimport KitsContainer from \"../../helpers/FormContainer\";\nimport { useSeparator } from \"../../../factory\";\nimport { applyKeyFilter } from \"../InputText/keyFilter.native\";\nimport { keyboardTypeFromKeyFilter } from \"../../helpers/native/keyboardFromFilter\";\nimport {useFormFieldKeyboardNav} from \"../../../hooks/useFormFieldKeyboardNav\";\nimport {mergeRefs} from \"../../../utils/mergeRefs\";\n\n// ✅ correct Gluestack components\nimport {\n    Textarea,\n    TextareaInput,\n} from \"@lmb-it/kitsconcertomobile\";\nimport {useComponentDefaults, useResolvedStyle} from \"@lmb-it/kitsconcerto/hooks\";\nimport { useLanguage } from \"../../../_compat\";\n\ntype NativeTextareaRef = {\n    focus(): void;\n    blur(): void;\n    clear(): void;\n};\n\nconst KitsInputTextarea = forwardRef<\n    NativeTextareaRef,\n    IKitsInputTextarea\n>((rawProps, ref) => {\n    const {mergedProps: props, themeStyle, elementStyles} = useComponentDefaults('Textarea', rawProps);\n    const resolvedThemeStyle = useResolvedStyle(themeStyle);\n    const resolvedRootStyle = useResolvedStyle(elementStyles?.root || {});\n    const { isRTL } = useLanguage();\n    const {\n        id,\n        label,\n        value,\n        defaultValue,\n        onChange,\n        keyFilter,\n        errors,\n        hideError,\n        invalid,\n        isFloatedLabel,\n        disabled,\n        helperText,\n        inputSize,\n        containerStyle,\n        localProps,\n        keyboardNavId,\n        rows,\n        autoResize,\n        maxLength,\n        minLength: _minLength, // submit-time only — RN has no minLength prop\n        // Props that belong on the inner TextareaInput, not the outer wrapper.\n        // Spreading nativeProps onto <Textarea> silently drops them because the\n        // wrapper doesn't render text. Pull them out and forward explicitly so\n        // placeholder, autoCapitalize, autoCorrect etc. actually take effect.\n        placeholder,\n        placeholderTextColor,\n        autoCapitalize,\n        autoCorrect,\n        autoFocus,\n        returnKeyType,\n        ...rest\n    } = props as IKitsInputTextarea & {\n        placeholder?: string;\n        placeholderTextColor?: string;\n        autoCapitalize?: 'none' | 'sentences' | 'words' | 'characters';\n        autoCorrect?: boolean;\n        autoFocus?: boolean;\n        returnKeyType?: string;\n    };\n\n    const resolvedKeyboardType = keyboardTypeFromKeyFilter(keyFilter as any);\n\n    // Calculate height from rows: lineHeight × rows + vertical padding\n    const LINE_HEIGHT = 20;\n    const VERTICAL_PADDING = 16;\n    const calculatedHeight = rows ? (LINE_HEIGHT * rows) + VERTICAL_PADDING : undefined;\n\n    const {inputRef, navProps} = useFormFieldKeyboardNav(keyboardNavId ?? id);\n\n    const isControlled = value !== undefined;\n\n    const { cssProps, nativeProps } = useSeparator<any>({\n        ...(rest as any),\n        ...(localProps as any),\n    });\n\n    const fieldRef = useRef<any>(null);\n\n    /** internal state for uncontrolled mode */\n    const [internalValue, setInternalValue] = useState<string>(\n        () => String(defaultValue ?? \"\")\n    );\n\n    /** sync when controlled */\n    useEffect(() => {\n        if (isControlled) {\n            setInternalValue(String(value ?? \"\"));\n        }\n    }, [isControlled, value]);\n\n    useImperativeHandle(ref, () => ({\n        focus: () => fieldRef.current?.focus?.(),\n        blur: () => fieldRef.current?.blur?.(),\n        clear: () => {\n            if (!isControlled) setInternalValue(\"\");\n            onChange?.({ target: { value: \"\" } } as any);\n        },\n    }));\n\n    const handleChangeText = useCallback(\n        (nextRaw: string) => {\n            const prev = isControlled\n                ? String(value ?? \"\")\n                : internalValue;\n\n            const filtered = keyFilter\n                ? applyKeyFilter(prev, nextRaw, keyFilter as any)\n                : nextRaw;\n\n            if (!isControlled) {\n                setInternalValue(filtered);\n            }\n\n            // Prime-like event\n            onChange?.({ target: { value: filtered } } as any);\n        },\n        [keyFilter, onChange, isControlled, internalValue, value],\n    );\n\n    const displayValue = isControlled\n        ? String(value ?? \"\")\n        : internalValue;\n\n    return (\n        <KitsContainer\n            id={id}\n            helperText={helperText}\n            isFloatedLabel={isFloatedLabel}\n            errors={errors}\n            invalid={invalid}\n            label={label}\n            hideError={hideError}\n            disabled={disabled}\n            inputSize={inputSize}\n            containerStyle={containerStyle}\n            elementStyles={elementStyles}\n        >\n            <Textarea\n                size={inputSize ?? \"md\"}\n                isDisabled={!!disabled}\n                isInvalid={!!invalid}\n                style={{\n                    ...(resolvedRootStyle && Object.keys(resolvedRootStyle).length > 0 ? resolvedRootStyle : resolvedThemeStyle),\n                    ...(cssProps as any),\n                    ...(calculatedHeight ? {height: calculatedHeight, minHeight: calculatedHeight} : {}),\n                }}\n                {...nativeProps}\n            >\n                <TextareaInput\n                    ref={mergeRefs(inputRef, fieldRef)}\n                    value={displayValue}\n                    onChangeText={handleChangeText}\n                    editable={!disabled}\n                    numberOfLines={rows ?? 4}\n                    keyboardType={resolvedKeyboardType}\n                    maxLength={maxLength}\n                    textAlignVertical=\"top\"\n                    // Forward input-level props that were destructured off `props`\n                    // — these would never reach the inner input if we relied on\n                    // `nativeProps` because nativeProps is spread on the outer\n                    // <Textarea> wrapper, which doesn't render text.\n                    placeholder={placeholder}\n                    placeholderTextColor={placeholderTextColor}\n                    autoCapitalize={autoCapitalize}\n                    autoCorrect={autoCorrect}\n                    autoFocus={autoFocus}\n                    returnKeyType={returnKeyType as any}\n                    // Inline padding so the cursor isn't flush against the edge\n                    // when the consumer overrides height via `rows`. Without\n                    // this the height inline-style replaces Gluestack's default\n                    // padding and the caret renders at (0,0) of the textarea.\n                    style={{\n                        paddingHorizontal: 12,\n                        paddingVertical: 8,\n                        textAlign: isRTL ? \"right\" : \"left\",\n                        writingDirection: isRTL ? \"rtl\" : \"ltr\",\n                        // ...(calculatedHeight ? {height: calculatedHeight - VERTICAL_PADDING} : {}),\n                    }}\n                    {...navProps}\n                />\n            </Textarea>\n        </KitsContainer>\n    );\n});\n\nKitsInputTextarea.displayName = \"KitsInputTextarea\";\nexport default KitsInputTextarea;\n"],"names":["forwardRef","useComponentDefaults","useResolvedStyle","useLanguage","keyboardTypeFromKeyFilter","useFormFieldKeyboardNav","useSeparator","useRef","useState","useEffect","useImperativeHandle","useCallback","applyKeyFilter","jsx","KitsContainer","Textarea","TextareaInput","mergeRefs"],"mappings":"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"}
+{"version":3,"file":"index.cjs","sources":["../../../../../src/form/inputs/InputTextarea/index.native.tsx"],"sourcesContent":["import React, {\n    forwardRef,\n    useCallback,\n    useEffect,\n    useImperativeHandle,\n    useRef,\n    useState,\n} from \"react\";\nimport type { IKitsInputTextarea } from \"@lmb-it/kitsconcerto-types\";\nimport KitsContainer from \"../../helpers/FormContainer\";\nimport { useSeparator } from \"../../../factory\";\nimport { applyKeyFilter } from \"../InputText/keyFilter.native\";\nimport { keyboardTypeFromKeyFilter } from \"../../helpers/native/keyboardFromFilter\";\nimport {useFormFieldKeyboardNav} from \"../../../hooks/useFormFieldKeyboardNav\";\nimport {mergeRefs} from \"../../../utils/mergeRefs\";\n\n// ✅ correct Gluestack components\nimport {\n    Textarea,\n    TextareaInput,\n} from \"@lmb-it/kitsconcertomobile\";\nimport {useComponentDefaults, useResolvedStyle} from \"@lmb-it/kitsconcerto/hooks\";\nimport { useLanguage } from \"../../../_compat\";\n\ntype NativeTextareaRef = {\n    focus(): void;\n    blur(): void;\n    clear(): void;\n};\n\nconst KitsInputTextarea = forwardRef<\n    NativeTextareaRef,\n    IKitsInputTextarea\n>((rawProps, ref) => {\n    const {mergedProps: props, themeStyle, elementStyles} = useComponentDefaults('Textarea', rawProps);\n    const resolvedThemeStyle = useResolvedStyle(themeStyle);\n    const resolvedRootStyle = useResolvedStyle(elementStyles?.root || {});\n    const { isRTL } = useLanguage();\n    const {\n        id,\n        label,\n        value,\n        defaultValue,\n        onChange,\n        keyFilter,\n        errors,\n        hideError,\n        invalid,\n        isFloatedLabel,\n        disabled,\n        helperText,\n        inputSize,\n        containerStyle,\n        localProps,\n        keyboardNavId,\n        rows,\n        autoResize,\n        maxLength,\n        minLength: _minLength, // submit-time only — RN has no minLength prop\n        // Props that belong on the inner TextareaInput, not the outer wrapper.\n        // Spreading nativeProps onto <Textarea> silently drops them because the\n        // wrapper doesn't render text. Pull them out and forward explicitly so\n        // placeholder, autoCapitalize, autoCorrect etc. actually take effect.\n        placeholder,\n        placeholderTextColor,\n        autoCapitalize,\n        autoCorrect,\n        autoFocus,\n        returnKeyType,\n        ...rest\n    } = props as IKitsInputTextarea & {\n        placeholder?: string;\n        placeholderTextColor?: string;\n        autoCapitalize?: 'none' | 'sentences' | 'words' | 'characters';\n        autoCorrect?: boolean;\n        autoFocus?: boolean;\n        returnKeyType?: string;\n    };\n\n    const resolvedKeyboardType = keyboardTypeFromKeyFilter(keyFilter as any);\n\n    // Calculate height from rows: lineHeight × rows + vertical padding\n    const LINE_HEIGHT = 20;\n    const VERTICAL_PADDING = 16;\n    const calculatedHeight = rows ? (LINE_HEIGHT * rows) + VERTICAL_PADDING : undefined;\n\n    const {inputRef, navProps} = useFormFieldKeyboardNav(keyboardNavId ?? id);\n\n    const isControlled = value !== undefined;\n\n    const { cssProps, nativeProps } = useSeparator<any>({\n        ...(rest as any),\n        ...(localProps as any),\n    });\n\n    const fieldRef = useRef<any>(null);\n\n    /** internal state for uncontrolled mode */\n    const [internalValue, setInternalValue] = useState<string>(\n        () => String(defaultValue ?? \"\")\n    );\n\n    /** sync when controlled */\n    useEffect(() => {\n        if (isControlled) {\n            setInternalValue(String(value ?? \"\"));\n        }\n    }, [isControlled, value]);\n\n    useImperativeHandle(ref, () => ({\n        focus: () => fieldRef.current?.focus?.(),\n        blur: () => fieldRef.current?.blur?.(),\n        clear: () => {\n            if (!isControlled) setInternalValue(\"\");\n            onChange?.({ target: { value: \"\" } } as any);\n        },\n    }));\n\n    const handleChangeText = useCallback(\n        (nextRaw: string) => {\n            const prev = isControlled\n                ? String(value ?? \"\")\n                : internalValue;\n\n            const filtered = keyFilter\n                ? applyKeyFilter(prev, nextRaw, keyFilter as any)\n                : nextRaw;\n\n            if (!isControlled) {\n                setInternalValue(filtered);\n            }\n\n            // Prime-like event\n            onChange?.({ target: { value: filtered } } as any);\n        },\n        [keyFilter, onChange, isControlled, internalValue, value],\n    );\n\n    const displayValue = isControlled\n        ? String(value ?? \"\")\n        : internalValue;\n\n    return (\n        <KitsContainer\n            id={id}\n            helperText={helperText}\n            isFloatedLabel={isFloatedLabel}\n            errors={errors}\n            invalid={invalid}\n            label={label}\n            hideError={hideError}\n            disabled={disabled}\n            inputSize={inputSize}\n            containerStyle={containerStyle}\n            elementStyles={elementStyles}\n        >\n            <Textarea\n                size={inputSize ?? \"md\"}\n                isDisabled={!!disabled}\n                isInvalid={!!invalid}\n                style={{\n                    ...(resolvedRootStyle && Object.keys(resolvedRootStyle).length > 0 ? resolvedRootStyle : resolvedThemeStyle),\n                    ...(cssProps as any),\n                    ...(calculatedHeight ? {height: calculatedHeight, minHeight: calculatedHeight} : {}),\n                }}\n                {...nativeProps}\n            >\n                <TextareaInput\n                    ref={mergeRefs(inputRef, fieldRef)}\n                    value={displayValue}\n                    onChangeText={handleChangeText}\n                    editable={!disabled}\n                    numberOfLines={rows ?? 4}\n                    keyboardType={resolvedKeyboardType}\n                    maxLength={maxLength}\n                    textAlignVertical=\"top\"\n                    // Forward input-level props that were destructured off `props`\n                    // — these would never reach the inner input if we relied on\n                    // `nativeProps` because nativeProps is spread on the outer\n                    // <Textarea> wrapper, which doesn't render text.\n                    placeholder={placeholder}\n                    placeholderTextColor={placeholderTextColor}\n                    autoCapitalize={autoCapitalize}\n                    autoCorrect={autoCorrect}\n                    autoFocus={autoFocus}\n                    returnKeyType={returnKeyType as any}\n                    // Inline padding so the cursor isn't flush against the edge\n                    // when the consumer overrides height via `rows`. Without\n                    // this the height inline-style replaces Gluestack's default\n                    // padding and the caret renders at (0,0) of the textarea.\n                    style={{\n                        paddingHorizontal: 12,\n                        paddingVertical: 8,\n                        textAlign: isRTL ? \"right\" : \"left\",\n                        writingDirection: isRTL ? \"rtl\" : \"ltr\",\n                        // ...(calculatedHeight ? {height: calculatedHeight - VERTICAL_PADDING} : {}),\n                    }}\n                    {...navProps}\n                />\n            </Textarea>\n        </KitsContainer>\n    );\n});\n\nKitsInputTextarea.displayName = \"KitsInputTextarea\";\nexport default KitsInputTextarea;\n"],"names":["forwardRef","useComponentDefaults","useResolvedStyle","useLanguage","keyboardTypeFromKeyFilter","useFormFieldKeyboardNav","useSeparator","useRef","useState","useEffect","useImperativeHandle","useCallback","applyKeyFilter","jsx","KitsContainer","Textarea","TextareaInput","mergeRefs"],"mappings":"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"}

package/form/inputs/InputTextarea/index.js

@@ -58,6 +58,8 @@ import 'yup';
 import '../../../packages/types/src/Css/map/index.js';
 import '../../../packages/types/src/Theme/shadows.js';
 import '../../../packages/types/src/Theme/defaultTheme.js';
+import '../../../packages/types/src/Theme/alphaColors.js';
+import '../../../apps/mobile/src/Factory/helpers/cssVarMap.js';
 import '../../../apps/mobile/src/Factory/DimensionsContext.js';
 import useSeparator from '../../../apps/mobile/src/Factory/useSeparator.js';
 import 'i18next';

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../../src/form/inputs/InputTextarea/index.native.tsx"],"sourcesContent":["import React, {\n    forwardRef,\n    useCallback,\n    useEffect,\n    useImperativeHandle,\n    useRef,\n    useState,\n} from \"react\";\nimport type { IKitsInputTextarea } from \"@lmb-it/kitsconcerto-types\";\nimport KitsContainer from \"../../helpers/FormContainer\";\nimport { useSeparator } from \"../../../factory\";\nimport { applyKeyFilter } from \"../InputText/keyFilter.native\";\nimport { keyboardTypeFromKeyFilter } from \"../../helpers/native/keyboardFromFilter\";\nimport {useFormFieldKeyboardNav} from \"../../../hooks/useFormFieldKeyboardNav\";\nimport {mergeRefs} from \"../../../utils/mergeRefs\";\n\n// ✅ correct Gluestack components\nimport {\n    Textarea,\n    TextareaInput,\n} from \"@lmb-it/kitsconcertomobile\";\nimport {useComponentDefaults, useResolvedStyle} from \"@lmb-it/kitsconcerto/hooks\";\nimport { useLanguage } from \"../../../_compat\";\n\ntype NativeTextareaRef = {\n    focus(): void;\n    blur(): void;\n    clear(): void;\n};\n\nconst KitsInputTextarea = forwardRef<\n    NativeTextareaRef,\n    IKitsInputTextarea\n>((rawProps, ref) => {\n    const {mergedProps: props, themeStyle, elementStyles} = useComponentDefaults('Textarea', rawProps);\n    const resolvedThemeStyle = useResolvedStyle(themeStyle);\n    const resolvedRootStyle = useResolvedStyle(elementStyles?.root || {});\n    const { isRTL } = useLanguage();\n    const {\n        id,\n        label,\n        value,\n        defaultValue,\n        onChange,\n        keyFilter,\n        errors,\n        hideError,\n        invalid,\n        isFloatedLabel,\n        disabled,\n        helperText,\n        inputSize,\n        containerStyle,\n        localProps,\n        keyboardNavId,\n        rows,\n        autoResize,\n        maxLength,\n        minLength: _minLength, // submit-time only — RN has no minLength prop\n        // Props that belong on the inner TextareaInput, not the outer wrapper.\n        // Spreading nativeProps onto <Textarea> silently drops them because the\n        // wrapper doesn't render text. Pull them out and forward explicitly so\n        // placeholder, autoCapitalize, autoCorrect etc. actually take effect.\n        placeholder,\n        placeholderTextColor,\n        autoCapitalize,\n        autoCorrect,\n        autoFocus,\n        returnKeyType,\n        ...rest\n    } = props as IKitsInputTextarea & {\n        placeholder?: string;\n        placeholderTextColor?: string;\n        autoCapitalize?: 'none' | 'sentences' | 'words' | 'characters';\n        autoCorrect?: boolean;\n        autoFocus?: boolean;\n        returnKeyType?: string;\n    };\n\n    const resolvedKeyboardType = keyboardTypeFromKeyFilter(keyFilter as any);\n\n    // Calculate height from rows: lineHeight × rows + vertical padding\n    const LINE_HEIGHT = 20;\n    const VERTICAL_PADDING = 16;\n    const calculatedHeight = rows ? (LINE_HEIGHT * rows) + VERTICAL_PADDING : undefined;\n\n    const {inputRef, navProps} = useFormFieldKeyboardNav(keyboardNavId ?? id);\n\n    const isControlled = value !== undefined;\n\n    const { cssProps, nativeProps } = useSeparator<any>({\n        ...(rest as any),\n        ...(localProps as any),\n    });\n\n    const fieldRef = useRef<any>(null);\n\n    /** internal state for uncontrolled mode */\n    const [internalValue, setInternalValue] = useState<string>(\n        () => String(defaultValue ?? \"\")\n    );\n\n    /** sync when controlled */\n    useEffect(() => {\n        if (isControlled) {\n            setInternalValue(String(value ?? \"\"));\n        }\n    }, [isControlled, value]);\n\n    useImperativeHandle(ref, () => ({\n        focus: () => fieldRef.current?.focus?.(),\n        blur: () => fieldRef.current?.blur?.(),\n        clear: () => {\n            if (!isControlled) setInternalValue(\"\");\n            onChange?.({ target: { value: \"\" } } as any);\n        },\n    }));\n\n    const handleChangeText = useCallback(\n        (nextRaw: string) => {\n            const prev = isControlled\n                ? String(value ?? \"\")\n                : internalValue;\n\n            const filtered = keyFilter\n                ? applyKeyFilter(prev, nextRaw, keyFilter as any)\n                : nextRaw;\n\n            if (!isControlled) {\n                setInternalValue(filtered);\n            }\n\n            // Prime-like event\n            onChange?.({ target: { value: filtered } } as any);\n        },\n        [keyFilter, onChange, isControlled, internalValue, value],\n    );\n\n    const displayValue = isControlled\n        ? String(value ?? \"\")\n        : internalValue;\n\n    return (\n        <KitsContainer\n            id={id}\n            helperText={helperText}\n            isFloatedLabel={isFloatedLabel}\n            errors={errors}\n            invalid={invalid}\n            label={label}\n            hideError={hideError}\n            disabled={disabled}\n            inputSize={inputSize}\n            containerStyle={containerStyle}\n            elementStyles={elementStyles}\n        >\n            <Textarea\n                size={inputSize ?? \"md\"}\n                isDisabled={!!disabled}\n                isInvalid={!!invalid}\n                style={{\n                    ...(resolvedRootStyle && Object.keys(resolvedRootStyle).length > 0 ? resolvedRootStyle : resolvedThemeStyle),\n                    ...(cssProps as any),\n                    ...(calculatedHeight ? {height: calculatedHeight, minHeight: calculatedHeight} : {}),\n                }}\n                {...nativeProps}\n            >\n                <TextareaInput\n                    ref={mergeRefs(inputRef, fieldRef)}\n                    value={displayValue}\n                    onChangeText={handleChangeText}\n                    editable={!disabled}\n                    numberOfLines={rows ?? 4}\n                    keyboardType={resolvedKeyboardType}\n                    maxLength={maxLength}\n                    textAlignVertical=\"top\"\n                    // Forward input-level props that were destructured off `props`\n                    // — these would never reach the inner input if we relied on\n                    // `nativeProps` because nativeProps is spread on the outer\n                    // <Textarea> wrapper, which doesn't render text.\n                    placeholder={placeholder}\n                    placeholderTextColor={placeholderTextColor}\n                    autoCapitalize={autoCapitalize}\n                    autoCorrect={autoCorrect}\n                    autoFocus={autoFocus}\n                    returnKeyType={returnKeyType as any}\n                    // Inline padding so the cursor isn't flush against the edge\n                    // when the consumer overrides height via `rows`. Without\n                    // this the height inline-style replaces Gluestack's default\n                    // padding and the caret renders at (0,0) of the textarea.\n                    style={{\n                        paddingHorizontal: 12,\n                        paddingVertical: 8,\n                        textAlign: isRTL ? \"right\" : \"left\",\n                        writingDirection: isRTL ? \"rtl\" : \"ltr\",\n                        // ...(calculatedHeight ? {height: calculatedHeight - VERTICAL_PADDING} : {}),\n                    }}\n                    {...navProps}\n                />\n            </Textarea>\n        </KitsContainer>\n    );\n});\n\nKitsInputTextarea.displayName = \"KitsInputTextarea\";\nexport default KitsInputTextarea;\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../../../../../src/form/inputs/InputTextarea/index.native.tsx"],"sourcesContent":["import React, {\n    forwardRef,\n    useCallback,\n    useEffect,\n    useImperativeHandle,\n    useRef,\n    useState,\n} from \"react\";\nimport type { IKitsInputTextarea } from \"@lmb-it/kitsconcerto-types\";\nimport KitsContainer from \"../../helpers/FormContainer\";\nimport { useSeparator } from \"../../../factory\";\nimport { applyKeyFilter } from \"../InputText/keyFilter.native\";\nimport { keyboardTypeFromKeyFilter } from \"../../helpers/native/keyboardFromFilter\";\nimport {useFormFieldKeyboardNav} from \"../../../hooks/useFormFieldKeyboardNav\";\nimport {mergeRefs} from \"../../../utils/mergeRefs\";\n\n// ✅ correct Gluestack components\nimport {\n    Textarea,\n    TextareaInput,\n} from \"@lmb-it/kitsconcertomobile\";\nimport {useComponentDefaults, useResolvedStyle} from \"@lmb-it/kitsconcerto/hooks\";\nimport { useLanguage } from \"../../../_compat\";\n\ntype NativeTextareaRef = {\n    focus(): void;\n    blur(): void;\n    clear(): void;\n};\n\nconst KitsInputTextarea = forwardRef<\n    NativeTextareaRef,\n    IKitsInputTextarea\n>((rawProps, ref) => {\n    const {mergedProps: props, themeStyle, elementStyles} = useComponentDefaults('Textarea', rawProps);\n    const resolvedThemeStyle = useResolvedStyle(themeStyle);\n    const resolvedRootStyle = useResolvedStyle(elementStyles?.root || {});\n    const { isRTL } = useLanguage();\n    const {\n        id,\n        label,\n        value,\n        defaultValue,\n        onChange,\n        keyFilter,\n        errors,\n        hideError,\n        invalid,\n        isFloatedLabel,\n        disabled,\n        helperText,\n        inputSize,\n        containerStyle,\n        localProps,\n        keyboardNavId,\n        rows,\n        autoResize,\n        maxLength,\n        minLength: _minLength, // submit-time only — RN has no minLength prop\n        // Props that belong on the inner TextareaInput, not the outer wrapper.\n        // Spreading nativeProps onto <Textarea> silently drops them because the\n        // wrapper doesn't render text. Pull them out and forward explicitly so\n        // placeholder, autoCapitalize, autoCorrect etc. actually take effect.\n        placeholder,\n        placeholderTextColor,\n        autoCapitalize,\n        autoCorrect,\n        autoFocus,\n        returnKeyType,\n        ...rest\n    } = props as IKitsInputTextarea & {\n        placeholder?: string;\n        placeholderTextColor?: string;\n        autoCapitalize?: 'none' | 'sentences' | 'words' | 'characters';\n        autoCorrect?: boolean;\n        autoFocus?: boolean;\n        returnKeyType?: string;\n    };\n\n    const resolvedKeyboardType = keyboardTypeFromKeyFilter(keyFilter as any);\n\n    // Calculate height from rows: lineHeight × rows + vertical padding\n    const LINE_HEIGHT = 20;\n    const VERTICAL_PADDING = 16;\n    const calculatedHeight = rows ? (LINE_HEIGHT * rows) + VERTICAL_PADDING : undefined;\n\n    const {inputRef, navProps} = useFormFieldKeyboardNav(keyboardNavId ?? id);\n\n    const isControlled = value !== undefined;\n\n    const { cssProps, nativeProps } = useSeparator<any>({\n        ...(rest as any),\n        ...(localProps as any),\n    });\n\n    const fieldRef = useRef<any>(null);\n\n    /** internal state for uncontrolled mode */\n    const [internalValue, setInternalValue] = useState<string>(\n        () => String(defaultValue ?? \"\")\n    );\n\n    /** sync when controlled */\n    useEffect(() => {\n        if (isControlled) {\n            setInternalValue(String(value ?? \"\"));\n        }\n    }, [isControlled, value]);\n\n    useImperativeHandle(ref, () => ({\n        focus: () => fieldRef.current?.focus?.(),\n        blur: () => fieldRef.current?.blur?.(),\n        clear: () => {\n            if (!isControlled) setInternalValue(\"\");\n            onChange?.({ target: { value: \"\" } } as any);\n        },\n    }));\n\n    const handleChangeText = useCallback(\n        (nextRaw: string) => {\n            const prev = isControlled\n                ? String(value ?? \"\")\n                : internalValue;\n\n            const filtered = keyFilter\n                ? applyKeyFilter(prev, nextRaw, keyFilter as any)\n                : nextRaw;\n\n            if (!isControlled) {\n                setInternalValue(filtered);\n            }\n\n            // Prime-like event\n            onChange?.({ target: { value: filtered } } as any);\n        },\n        [keyFilter, onChange, isControlled, internalValue, value],\n    );\n\n    const displayValue = isControlled\n        ? String(value ?? \"\")\n        : internalValue;\n\n    return (\n        <KitsContainer\n            id={id}\n            helperText={helperText}\n            isFloatedLabel={isFloatedLabel}\n            errors={errors}\n            invalid={invalid}\n            label={label}\n            hideError={hideError}\n            disabled={disabled}\n            inputSize={inputSize}\n            containerStyle={containerStyle}\n            elementStyles={elementStyles}\n        >\n            <Textarea\n                size={inputSize ?? \"md\"}\n                isDisabled={!!disabled}\n                isInvalid={!!invalid}\n                style={{\n                    ...(resolvedRootStyle && Object.keys(resolvedRootStyle).length > 0 ? resolvedRootStyle : resolvedThemeStyle),\n                    ...(cssProps as any),\n                    ...(calculatedHeight ? {height: calculatedHeight, minHeight: calculatedHeight} : {}),\n                }}\n                {...nativeProps}\n            >\n                <TextareaInput\n                    ref={mergeRefs(inputRef, fieldRef)}\n                    value={displayValue}\n                    onChangeText={handleChangeText}\n                    editable={!disabled}\n                    numberOfLines={rows ?? 4}\n                    keyboardType={resolvedKeyboardType}\n                    maxLength={maxLength}\n                    textAlignVertical=\"top\"\n                    // Forward input-level props that were destructured off `props`\n                    // — these would never reach the inner input if we relied on\n                    // `nativeProps` because nativeProps is spread on the outer\n                    // <Textarea> wrapper, which doesn't render text.\n                    placeholder={placeholder}\n                    placeholderTextColor={placeholderTextColor}\n                    autoCapitalize={autoCapitalize}\n                    autoCorrect={autoCorrect}\n                    autoFocus={autoFocus}\n                    returnKeyType={returnKeyType as any}\n                    // Inline padding so the cursor isn't flush against the edge\n                    // when the consumer overrides height via `rows`. Without\n                    // this the height inline-style replaces Gluestack's default\n                    // padding and the caret renders at (0,0) of the textarea.\n                    style={{\n                        paddingHorizontal: 12,\n                        paddingVertical: 8,\n                        textAlign: isRTL ? \"right\" : \"left\",\n                        writingDirection: isRTL ? \"rtl\" : \"ltr\",\n                        // ...(calculatedHeight ? {height: calculatedHeight - VERTICAL_PADDING} : {}),\n                    }}\n                    {...navProps}\n                />\n            </Textarea>\n        </KitsContainer>\n    );\n});\n\nKitsInputTextarea.displayName = \"KitsInputTextarea\";\nexport default KitsInputTextarea;\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA8BA,MAAM,iBAAA,GAAoB,UAAA,CAGxB,CAAC,QAAA,EAAU,GAAA,KAAQ;AACjB,EAAA,MAAM,EAAC,aAAa,KAAA,EAAO,UAAA,EAAY,eAAa,GAAI,oBAAA,CAAqB,YAAY,QAAQ,CAAA;AACjG,EAAA,MAAM,kBAAA,GAAqB,iBAAiB,UAAU,CAAA;AACtD,EAAA,MAAM,iBAAA,GAAoB,gBAAA,CAAiB,aAAA,EAAe,IAAA,IAAQ,EAAE,CAAA;AACpE,EAAA,MAAM,EAAE,KAAA,EAAM,GAAI,WAAA,EAAY;AAC9B,EAAA,MAAM;AAAA,IACF,EAAA;AAAA,IACA,KAAA;AAAA,IACA,KAAA;AAAA,IACA,YAAA;AAAA,IACA,QAAA;AAAA,IACA,SAAA;AAAA,IACA,MAAA;AAAA,IACA,SAAA;AAAA,IACA,OAAA;AAAA,IACA,cAAA;AAAA,IACA,QAAA;AAAA,IACA,UAAA;AAAA,IACA,SAAA;AAAA,IACA,cAAA;AAAA,IACA,UAAA;AAAA,IACA,aAAA;AAAA,IACA,IAAA;AAAA,IACA,UAAA;AAAA,IACA,SAAA;AAAA,IACA,SAAA,EAAW,UAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAKX,WAAA;AAAA,IACA,oBAAA;AAAA,IACA,cAAA;AAAA,IACA,WAAA;AAAA,IACA,SAAA;AAAA,IACA,aAAA;AAAA,IACA,GAAG;AAAA,GACP,GAAI,KAAA;AASJ,EAAA,MAAM,oBAAA,GAAuB,0BAA0B,SAAgB,CAAA;AAGvE,EAAA,MAAM,WAAA,GAAc,EAAA;AACpB,EAAA,MAAM,gBAAA,GAAmB,EAAA;AACzB,EAAA,MAAM,gBAAA,GAAmB,IAAA,GAAQ,WAAA,GAAc,IAAA,GAAQ,gBAAA,GAAmB,MAAA;AAE1E,EAAA,MAAM,EAAC,QAAA,EAAU,QAAA,EAAQ,GAAI,uBAAA,CAAwB,iBAAiB,EAAE,CAAA;AAExE,EAAA,MAAM,eAAe,KAAA,KAAU,MAAA;AAE/B,EAAA,MAAM,EAAE,QAAA,EAAU,WAAA,EAAY,GAAI,YAAA,CAAkB;AAAA,IAChD,GAAI,IAAA;AAAA,IACJ,GAAI;AAAA,GACP,CAAA;AAED,EAAA,MAAM,QAAA,GAAW,OAAY,IAAI,CAAA;AAGjC,EAAA,MAAM,CAAC,aAAA,EAAe,gBAAgB,CAAA,GAAI,QAAA;AAAA,IACtC,MAAM,MAAA,CAAO,YAAA,IAAgB,EAAE;AAAA,GACnC;AAGA,EAAA,SAAA,CAAU,MAAM;AACZ,IAAA,IAAI,YAAA,EAAc;AACd,MAAA,gBAAA,CAAiB,MAAA,CAAO,KAAA,IAAS,EAAE,CAAC,CAAA;AAAA,IACxC;AAAA,EACJ,CAAA,EAAG,CAAC,YAAA,EAAc,KAAK,CAAC,CAAA;AAExB,EAAA,mBAAA,CAAoB,KAAK,OAAO;AAAA,IAC5B,KAAA,EAAO,MAAM,QAAA,CAAS,OAAA,EAAS,KAAA,IAAQ;AAAA,IACvC,IAAA,EAAM,MAAM,QAAA,CAAS,OAAA,EAAS,IAAA,IAAO;AAAA,IACrC,OAAO,MAAM;AACT,MAAA,IAAI,CAAC,YAAA,EAAc,gBAAA,CAAiB,EAAE,CAAA;AACtC,MAAA,QAAA,GAAW,EAAE,MAAA,EAAQ,EAAE,KAAA,EAAO,EAAA,IAAa,CAAA;AAAA,IAC/C;AAAA,GACJ,CAAE,CAAA;AAEF,EAAA,MAAM,gBAAA,GAAmB,WAAA;AAAA,IACrB,CAAC,OAAA,KAAoB;AACjB,MAAA,MAAM,IAAA,GAAO,YAAA,GACP,MAAA,CAAO,KAAA,IAAS,EAAE,CAAA,GAClB,aAAA;AAEN,MAAA,MAAM,WAAW,SAAA,GACX,cAAA,CAAe,IAAA,EAAM,OAAA,EAAS,SAAgB,CAAA,GAC9C,OAAA;AAEN,MAAA,IAAI,CAAC,YAAA,EAAc;AACf,QAAA,gBAAA,CAAiB,QAAQ,CAAA;AAAA,MAC7B;AAGA,MAAA,QAAA,GAAW,EAAE,MAAA,EAAQ,EAAE,KAAA,EAAO,QAAA,IAAmB,CAAA;AAAA,IACrD,CAAA;AAAA,IACA,CAAC,SAAA,EAAW,QAAA,EAAU,YAAA,EAAc,eAAe,KAAK;AAAA,GAC5D;AAEA,EAAA,MAAM,YAAA,GAAe,YAAA,GACf,MAAA,CAAO,KAAA,IAAS,EAAE,CAAA,GAClB,aAAA;AAEN,EAAA,uBACI,GAAA;AAAA,IAAC,aAAA;AAAA,IAAA;AAAA,MACG,EAAA;AAAA,MACA,UAAA;AAAA,MACA,cAAA;AAAA,MACA,MAAA;AAAA,MACA,OAAA;AAAA,MACA,KAAA;AAAA,MACA,SAAA;AAAA,MACA,QAAA;AAAA,MACA,SAAA;AAAA,MACA,cAAA;AAAA,MACA,aAAA;AAAA,MAEA,QAAA,kBAAA,GAAA;AAAA,QAAC,QAAA;AAAA,QAAA;AAAA,UACG,MAAM,SAAA,IAAa,IAAA;AAAA,UACnB,UAAA,EAAY,CAAC,CAAC,QAAA;AAAA,UACd,SAAA,EAAW,CAAC,CAAC,OAAA;AAAA,UACb,KAAA,EAAO;AAAA,YACH,GAAI,qBAAqB,MAAA,CAAO,IAAA,CAAK,iBAAiB,CAAA,CAAE,MAAA,GAAS,IAAI,iBAAA,GAAoB,kBAAA;AAAA,YACzF,GAAI,QAAA;AAAA,YACJ,GAAI,mBAAmB,EAAC,MAAA,EAAQ,kBAAkB,SAAA,EAAW,gBAAA,KAAoB;AAAC,WACtF;AAAA,UACC,GAAG,WAAA;AAAA,UAEJ,QAAA,kBAAA,GAAA;AAAA,YAAC,aAAA;AAAA,YAAA;AAAA,cACG,GAAA,EAAK,SAAA,CAAU,QAAA,EAAU,QAAQ,CAAA;AAAA,cACjC,KAAA,EAAO,YAAA;AAAA,cACP,YAAA,EAAc,gBAAA;AAAA,cACd,UAAU,CAAC,QAAA;AAAA,cACX,eAAe,IAAA,IAAQ,CAAA;AAAA,cACvB,YAAA,EAAc,oBAAA;AAAA,cACd,SAAA;AAAA,cACA,iBAAA,EAAkB,KAAA;AAAA,cAKlB,WAAA;AAAA,cACA,oBAAA;AAAA,cACA,cAAA;AAAA,cACA,WAAA;AAAA,cACA,SAAA;AAAA,cACA,aAAA;AAAA,cAKA,KAAA,EAAO;AAAA,gBACH,iBAAA,EAAmB,EAAA;AAAA,gBACnB,eAAA,EAAiB,CAAA;AAAA,gBACjB,SAAA,EAAW,QAAQ,OAAA,GAAU,MAAA;AAAA,gBAC7B,gBAAA,EAAkB,QAAQ,KAAA,GAAQ;AAAA;AAAA,eAEtC;AAAA,cACC,GAAG;AAAA;AAAA;AACR;AAAA;AACJ;AAAA,GACJ;AAER,CAAC;AAED,iBAAA,CAAkB,WAAA,GAAc,mBAAA;;;;"}

package/form/inputs/PhoneInput/index.cjs

@@ -61,6 +61,8 @@ require('yup');
 require('../../../packages/types/src/Css/map/index.cjs');
 require('../../../packages/types/src/Theme/shadows.cjs');
 require('../../../packages/types/src/Theme/defaultTheme.cjs');
+require('../../../packages/types/src/Theme/alphaColors.cjs');
+require('../../../apps/mobile/src/Factory/helpers/cssVarMap.cjs');
 require('../../../apps/mobile/src/Factory/DimensionsContext.cjs');
 var useSeparator = require('../../../apps/mobile/src/Factory/useSeparator.cjs');
 require('i18next');

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

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","sources":["../../../../../src/form/inputs/PhoneInput/index.native.tsx"],"sourcesContent":["import type {IKitsPhoneInput} from \"@lmb-it/kitsconcerto-types\";\nimport {KitsContainer, KitsInputText, Icon} from \"../../../_compat\";\nimport {useImperativeHandle, useMemo} from \"react\";\nimport {useSeparator} from \"../../../factory\";\nimport {usePhoneInput} from \"./usePhoneInput\";\nimport {SvgUri} from \"react-native-svg\";\nimport {View} from \"react-native\";\nimport {useComponentDefaults, useResolvedStyle} from \"@lmb-it/kitsconcerto/hooks\";\n\n\nconst KitsPhoneComponent =\n    (\n        {\n            ref,\n            isWithCountryCode,\n            label,\n            value,\n            placeholder,\n            onChange,\n            invalid,\n            disabled,\n            required,\n            errors,\n            hideError,\n            id,\n            defaultCountry,\n            inputSize,\n            isFloatedLabel,\n            leftAddon,\n            rightAddon,\n            includedCountries,\n            excludedCountries,\n            outputFormat='string',\n            ...props\n        }: IKitsPhoneInput\n    ) => {\n        const { mergedProps: _mergedProps, themeStyle, elementStyles } = useComponentDefaults('PhoneInput', props as any, 'Input');\n        const resolvedThemeStyle = useResolvedStyle(themeStyle);\n        const resolvedRootStyle = useResolvedStyle(elementStyles?.root || {});\n        const {nativeProps} = useSeparator<any>(props);\n\n        const {\n            displayValue,\n            e164Value,\n            objectValue,\n            countryFlagUrl,\n            countryISO,\n            handleChange,\n        } = usePhoneInput({\n            value,\n            onChange,\n            outputFormat,\n            isWithCountryCode,\n            defaultCountry,\n            includedCountries,\n            excludedCountries,\n        });\n\n        useImperativeHandle(ref, () => ({\n            value: outputFormat === 'object' ? (objectValue ?? e164Value) : e164Value,\n            setValue: (v: any) => handleChange(typeof v === \"string\" ? v : \"\"),\n        }));\n\n        const flagAddon = useMemo(() => {\n            if (!isWithCountryCode) return leftAddon;\n\n            if (countryFlagUrl) {\n                return (\n                    <View style={{width: 20, height: 20, overflow: 'hidden', borderRadius: 2}}>\n                        <SvgUri\n                            uri={countryFlagUrl}\n                            width={20}\n                            height={20}\n                        />\n                    </View>\n                );\n            }\n\n            return <Icon name=\"phone\" size={'2xs'}/>;\n        }, [isWithCountryCode, countryFlagUrl, countryISO, leftAddon]);\n\n        return (\n            <KitsContainer\n                id={id}\n                inputSize={inputSize}\n                isFloatedLabel={isFloatedLabel}\n                errors={errors}\n                required={required}\n                hideError={hideError}\n                label={label}\n                elementStyles={elementStyles}\n            >\n                <KitsInputText\n                    id={`${id}-phone`}\n                    keyboardNavId={id}\n                    value={displayValue}\n                    rightAddon={rightAddon}\n                    leftAddon={flagAddon}\n                    onChange={(e: any) => handleChange(e.target.value)}\n                    invalid={invalid}\n                    disabled={disabled}\n                    keyboardType=\"phone-pad\"\n                    placeholder={placeholder ?? (isWithCountryCode ? \"+1 (555) 123-4567\" : \"\")}\n                    localProps={Object.keys(themeStyle).length ? { style: { width: '100%', ...(themeStyle as any) } } : undefined}\n                />\n            </KitsContainer>\n        );\n    }\n\n\nexport default KitsPhoneComponent;\n"],"names":["useComponentDefaults","useResolvedStyle","useSeparator","usePhoneInput","useImperativeHandle","useMemo","jsx","View","SvgUri","Icon","KitsContainer","KitsInputText"],"mappings":"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"}
+{"version":3,"file":"index.cjs","sources":["../../../../../src/form/inputs/PhoneInput/index.native.tsx"],"sourcesContent":["import type {IKitsPhoneInput} from \"@lmb-it/kitsconcerto-types\";\nimport {KitsContainer, KitsInputText, Icon} from \"../../../_compat\";\nimport {useImperativeHandle, useMemo} from \"react\";\nimport {useSeparator} from \"../../../factory\";\nimport {usePhoneInput} from \"./usePhoneInput\";\nimport {SvgUri} from \"react-native-svg\";\nimport {View} from \"react-native\";\nimport {useComponentDefaults, useResolvedStyle} from \"@lmb-it/kitsconcerto/hooks\";\n\n\nconst KitsPhoneComponent =\n    (\n        {\n            ref,\n            isWithCountryCode,\n            label,\n            value,\n            placeholder,\n            onChange,\n            invalid,\n            disabled,\n            required,\n            errors,\n            hideError,\n            id,\n            defaultCountry,\n            inputSize,\n            isFloatedLabel,\n            leftAddon,\n            rightAddon,\n            includedCountries,\n            excludedCountries,\n            outputFormat='string',\n            ...props\n        }: IKitsPhoneInput\n    ) => {\n        const { mergedProps: _mergedProps, themeStyle, elementStyles } = useComponentDefaults('PhoneInput', props as any, 'Input');\n        const resolvedThemeStyle = useResolvedStyle(themeStyle);\n        const resolvedRootStyle = useResolvedStyle(elementStyles?.root || {});\n        const {nativeProps} = useSeparator<any>(props);\n\n        const {\n            displayValue,\n            e164Value,\n            objectValue,\n            countryFlagUrl,\n            countryISO,\n            handleChange,\n        } = usePhoneInput({\n            value,\n            onChange,\n            outputFormat,\n            isWithCountryCode,\n            defaultCountry,\n            includedCountries,\n            excludedCountries,\n        });\n\n        useImperativeHandle(ref, () => ({\n            value: outputFormat === 'object' ? (objectValue ?? e164Value) : e164Value,\n            setValue: (v: any) => handleChange(typeof v === \"string\" ? v : \"\"),\n        }));\n\n        const flagAddon = useMemo(() => {\n            if (!isWithCountryCode) return leftAddon;\n\n            if (countryFlagUrl) {\n                return (\n                    <View style={{width: 20, height: 20, overflow: 'hidden', borderRadius: 2}}>\n                        <SvgUri\n                            uri={countryFlagUrl}\n                            width={20}\n                            height={20}\n                        />\n                    </View>\n                );\n            }\n\n            return <Icon name=\"phone\" size={'2xs'}/>;\n        }, [isWithCountryCode, countryFlagUrl, countryISO, leftAddon]);\n\n        return (\n            <KitsContainer\n                id={id}\n                inputSize={inputSize}\n                isFloatedLabel={isFloatedLabel}\n                errors={errors}\n                required={required}\n                hideError={hideError}\n                label={label}\n                elementStyles={elementStyles}\n            >\n                <KitsInputText\n                    id={`${id}-phone`}\n                    keyboardNavId={id}\n                    value={displayValue}\n                    rightAddon={rightAddon}\n                    leftAddon={flagAddon}\n                    onChange={(e: any) => handleChange(e.target.value)}\n                    invalid={invalid}\n                    disabled={disabled}\n                    keyboardType=\"phone-pad\"\n                    placeholder={placeholder ?? (isWithCountryCode ? \"+1 (555) 123-4567\" : \"\")}\n                    localProps={Object.keys(themeStyle).length ? { style: { width: '100%', ...(themeStyle as any) } } : undefined}\n                />\n            </KitsContainer>\n        );\n    }\n\n\nexport default KitsPhoneComponent;\n"],"names":["useComponentDefaults","useResolvedStyle","useSeparator","usePhoneInput","useImperativeHandle","useMemo","jsx","View","SvgUri","Icon","KitsContainer","KitsInputText"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAUA,MAAM,qBACF,CACI;AAAA,EACI,GAAA;AAAA,EACA,iBAAA;AAAA,EACA,KAAA;AAAA,EACA,KAAA;AAAA,EACA,WAAA;AAAA,EACA,QAAA;AAAA,EACA,OAAA;AAAA,EACA,QAAA;AAAA,EACA,QAAA;AAAA,EACA,MAAA;AAAA,EACA,SAAA;AAAA,EACA,EAAA;AAAA,EACA,cAAA;AAAA,EACA,SAAA;AAAA,EACA,cAAA;AAAA,EACA,SAAA;AAAA,EACA,UAAA;AAAA,EACA,iBAAA;AAAA,EACA,iBAAA;AAAA,EACA,YAAA,GAAa,QAAA;AAAA,EACb,GAAG;AACP,CAAA,KACC;AACD,EAAA,MAAM,EAAE,aAAa,YAAA,EAAc,UAAA,EAAY,eAAc,GAAIA,4BAAA,CAAqB,YAAA,EAAc,KAAA,EAAc,OAAO,CAAA;AACzH,EAA2BC,yBAAiB,UAAU;AACtD,EAA0BA,wBAAA,CAAiB,aAAA,EAAe,IAAA,IAAQ,EAAE;AACpE,EAAsBC,oBAAA,CAAkB,KAAK;AAE7C,EAAA,MAAM;AAAA,IACF,YAAA;AAAA,IACA,SAAA;AAAA,IACA,WAAA;AAAA,IACA,cAAA;AAAA,IACA,UAAA;AAAA,IACA;AAAA,MACAC,2BAAA,CAAc;AAAA,IACd,KAAA;AAAA,IACA,QAAA;AAAA,IACA,YAAA;AAAA,IACA,iBAAA;AAAA,IACA,cAAA;AAAA,IACA,iBAAA;AAAA,IACA;AAAA,GACH,CAAA;AAED,EAAAC,yBAAA,CAAoB,KAAK,OAAO;AAAA,IAC5B,KAAA,EAAO,YAAA,KAAiB,QAAA,GAAY,WAAA,IAAe,SAAA,GAAa,SAAA;AAAA,IAChE,QAAA,EAAU,CAAC,CAAA,KAAW,YAAA,CAAa,OAAO,CAAA,KAAM,QAAA,GAAW,IAAI,EAAE;AAAA,GACrE,CAAE,CAAA;AAEF,EAAA,MAAM,SAAA,GAAYC,cAAQ,MAAM;AAC5B,IAAA,IAAI,CAAC,mBAAmB,OAAO,SAAA;AAE/B,IAAA,IAAI,cAAA,EAAgB;AAChB,MAAA,uBACIC,cAAA,CAACC,gBAAA,EAAA,EAAK,KAAA,EAAO,EAAC,KAAA,EAAO,EAAA,EAAI,MAAA,EAAQ,EAAA,EAAI,QAAA,EAAU,QAAA,EAAU,YAAA,EAAc,CAAA,EAAC,EACpE,QAAA,kBAAAD,cAAA;AAAA,QAACE,UAAA;AAAA,QAAA;AAAA,UACG,GAAA,EAAK,cAAA;AAAA,UACL,KAAA,EAAO,EAAA;AAAA,UACP,MAAA,EAAQ;AAAA;AAAA,OACZ,EACJ,CAAA;AAAA,IAER;AAEA,IAAA,uBAAOF,cAAA,CAACG,iBAAA,EAAA,EAAK,IAAA,EAAK,OAAA,EAAQ,MAAM,KAAA,EAAM,CAAA;AAAA,EAC1C,GAAG,CAAC,iBAAA,EAAmB,cAAA,EAAgB,UAAA,EAAY,SAAS,CAAC,CAAA;AAE7D,EAAA,uBACIH,cAAA;AAAA,IAACI,sBAAA;AAAA,IAAA;AAAA,MACG,EAAA;AAAA,MACA,SAAA;AAAA,MACA,cAAA;AAAA,MACA,MAAA;AAAA,MACA,QAAA;AAAA,MACA,SAAA;AAAA,MACA,KAAA;AAAA,MACA,aAAA;AAAA,MAEA,QAAA,kBAAAJ,cAAA;AAAA,QAACK,sBAAA;AAAA,QAAA;AAAA,UACG,EAAA,EAAI,GAAG,EAAE,CAAA,MAAA,CAAA;AAAA,UACT,aAAA,EAAe,EAAA;AAAA,UACf,KAAA,EAAO,YAAA;AAAA,UACP,UAAA;AAAA,UACA,SAAA,EAAW,SAAA;AAAA,UACX,UAAU,CAAC,CAAA,KAAW,YAAA,CAAa,CAAA,CAAE,OAAO,KAAK,CAAA;AAAA,UACjD,OAAA;AAAA,UACA,QAAA;AAAA,UACA,YAAA,EAAa,WAAA;AAAA,UACb,WAAA,EAAa,WAAA,KAAgB,iBAAA,GAAoB,mBAAA,GAAsB,EAAA,CAAA;AAAA,UACvE,UAAA,EAAY,MAAA,CAAO,IAAA,CAAK,UAAU,EAAE,MAAA,GAAS,EAAE,KAAA,EAAO,EAAE,KAAA,EAAO,MAAA,EAAQ,GAAI,UAAA,IAAqB,GAAI;AAAA;AAAA;AACxG;AAAA,GACJ;AAER;;;;"}

package/form/inputs/PhoneInput/index.js

@@ -57,6 +57,8 @@ import 'yup';
 import '../../../packages/types/src/Css/map/index.js';
 import '../../../packages/types/src/Theme/shadows.js';
 import '../../../packages/types/src/Theme/defaultTheme.js';
+import '../../../packages/types/src/Theme/alphaColors.js';
+import '../../../apps/mobile/src/Factory/helpers/cssVarMap.js';
 import '../../../apps/mobile/src/Factory/DimensionsContext.js';
 import useSeparator from '../../../apps/mobile/src/Factory/useSeparator.js';
 import 'i18next';

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../../src/form/inputs/PhoneInput/index.native.tsx"],"sourcesContent":["import type {IKitsPhoneInput} from \"@lmb-it/kitsconcerto-types\";\nimport {KitsContainer, KitsInputText, Icon} from \"../../../_compat\";\nimport {useImperativeHandle, useMemo} from \"react\";\nimport {useSeparator} from \"../../../factory\";\nimport {usePhoneInput} from \"./usePhoneInput\";\nimport {SvgUri} from \"react-native-svg\";\nimport {View} from \"react-native\";\nimport {useComponentDefaults, useResolvedStyle} from \"@lmb-it/kitsconcerto/hooks\";\n\n\nconst KitsPhoneComponent =\n    (\n        {\n            ref,\n            isWithCountryCode,\n            label,\n            value,\n            placeholder,\n            onChange,\n            invalid,\n            disabled,\n            required,\n            errors,\n            hideError,\n            id,\n            defaultCountry,\n            inputSize,\n            isFloatedLabel,\n            leftAddon,\n            rightAddon,\n            includedCountries,\n            excludedCountries,\n            outputFormat='string',\n            ...props\n        }: IKitsPhoneInput\n    ) => {\n        const { mergedProps: _mergedProps, themeStyle, elementStyles } = useComponentDefaults('PhoneInput', props as any, 'Input');\n        const resolvedThemeStyle = useResolvedStyle(themeStyle);\n        const resolvedRootStyle = useResolvedStyle(elementStyles?.root || {});\n        const {nativeProps} = useSeparator<any>(props);\n\n        const {\n            displayValue,\n            e164Value,\n            objectValue,\n            countryFlagUrl,\n            countryISO,\n            handleChange,\n        } = usePhoneInput({\n            value,\n            onChange,\n            outputFormat,\n            isWithCountryCode,\n            defaultCountry,\n            includedCountries,\n            excludedCountries,\n        });\n\n        useImperativeHandle(ref, () => ({\n            value: outputFormat === 'object' ? (objectValue ?? e164Value) : e164Value,\n            setValue: (v: any) => handleChange(typeof v === \"string\" ? v : \"\"),\n        }));\n\n        const flagAddon = useMemo(() => {\n            if (!isWithCountryCode) return leftAddon;\n\n            if (countryFlagUrl) {\n                return (\n                    <View style={{width: 20, height: 20, overflow: 'hidden', borderRadius: 2}}>\n                        <SvgUri\n                            uri={countryFlagUrl}\n                            width={20}\n                            height={20}\n                        />\n                    </View>\n                );\n            }\n\n            return <Icon name=\"phone\" size={'2xs'}/>;\n        }, [isWithCountryCode, countryFlagUrl, countryISO, leftAddon]);\n\n        return (\n            <KitsContainer\n                id={id}\n                inputSize={inputSize}\n                isFloatedLabel={isFloatedLabel}\n                errors={errors}\n                required={required}\n                hideError={hideError}\n                label={label}\n                elementStyles={elementStyles}\n            >\n                <KitsInputText\n                    id={`${id}-phone`}\n                    keyboardNavId={id}\n                    value={displayValue}\n                    rightAddon={rightAddon}\n                    leftAddon={flagAddon}\n                    onChange={(e: any) => handleChange(e.target.value)}\n                    invalid={invalid}\n                    disabled={disabled}\n                    keyboardType=\"phone-pad\"\n                    placeholder={placeholder ?? (isWithCountryCode ? \"+1 (555) 123-4567\" : \"\")}\n                    localProps={Object.keys(themeStyle).length ? { style: { width: '100%', ...(themeStyle as any) } } : undefined}\n                />\n            </KitsContainer>\n        );\n    }\n\n\nexport default KitsPhoneComponent;\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../../../../../src/form/inputs/PhoneInput/index.native.tsx"],"sourcesContent":["import type {IKitsPhoneInput} from \"@lmb-it/kitsconcerto-types\";\nimport {KitsContainer, KitsInputText, Icon} from \"../../../_compat\";\nimport {useImperativeHandle, useMemo} from \"react\";\nimport {useSeparator} from \"../../../factory\";\nimport {usePhoneInput} from \"./usePhoneInput\";\nimport {SvgUri} from \"react-native-svg\";\nimport {View} from \"react-native\";\nimport {useComponentDefaults, useResolvedStyle} from \"@lmb-it/kitsconcerto/hooks\";\n\n\nconst KitsPhoneComponent =\n    (\n        {\n            ref,\n            isWithCountryCode,\n            label,\n            value,\n            placeholder,\n            onChange,\n            invalid,\n            disabled,\n            required,\n            errors,\n            hideError,\n            id,\n            defaultCountry,\n            inputSize,\n            isFloatedLabel,\n            leftAddon,\n            rightAddon,\n            includedCountries,\n            excludedCountries,\n            outputFormat='string',\n            ...props\n        }: IKitsPhoneInput\n    ) => {\n        const { mergedProps: _mergedProps, themeStyle, elementStyles } = useComponentDefaults('PhoneInput', props as any, 'Input');\n        const resolvedThemeStyle = useResolvedStyle(themeStyle);\n        const resolvedRootStyle = useResolvedStyle(elementStyles?.root || {});\n        const {nativeProps} = useSeparator<any>(props);\n\n        const {\n            displayValue,\n            e164Value,\n            objectValue,\n            countryFlagUrl,\n            countryISO,\n            handleChange,\n        } = usePhoneInput({\n            value,\n            onChange,\n            outputFormat,\n            isWithCountryCode,\n            defaultCountry,\n            includedCountries,\n            excludedCountries,\n        });\n\n        useImperativeHandle(ref, () => ({\n            value: outputFormat === 'object' ? (objectValue ?? e164Value) : e164Value,\n            setValue: (v: any) => handleChange(typeof v === \"string\" ? v : \"\"),\n        }));\n\n        const flagAddon = useMemo(() => {\n            if (!isWithCountryCode) return leftAddon;\n\n            if (countryFlagUrl) {\n                return (\n                    <View style={{width: 20, height: 20, overflow: 'hidden', borderRadius: 2}}>\n                        <SvgUri\n                            uri={countryFlagUrl}\n                            width={20}\n                            height={20}\n                        />\n                    </View>\n                );\n            }\n\n            return <Icon name=\"phone\" size={'2xs'}/>;\n        }, [isWithCountryCode, countryFlagUrl, countryISO, leftAddon]);\n\n        return (\n            <KitsContainer\n                id={id}\n                inputSize={inputSize}\n                isFloatedLabel={isFloatedLabel}\n                errors={errors}\n                required={required}\n                hideError={hideError}\n                label={label}\n                elementStyles={elementStyles}\n            >\n                <KitsInputText\n                    id={`${id}-phone`}\n                    keyboardNavId={id}\n                    value={displayValue}\n                    rightAddon={rightAddon}\n                    leftAddon={flagAddon}\n                    onChange={(e: any) => handleChange(e.target.value)}\n                    invalid={invalid}\n                    disabled={disabled}\n                    keyboardType=\"phone-pad\"\n                    placeholder={placeholder ?? (isWithCountryCode ? \"+1 (555) 123-4567\" : \"\")}\n                    localProps={Object.keys(themeStyle).length ? { style: { width: '100%', ...(themeStyle as any) } } : undefined}\n                />\n            </KitsContainer>\n        );\n    }\n\n\nexport default KitsPhoneComponent;\n"],"names":[],"mappings":"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"}

package/form/inputs/RadiusPicker/components/NumericRadiusInput.cjs

@@ -11,6 +11,7 @@ require('yup');
 require('../../../../packages/types/src/Css/map/index.cjs');
 require('../../../../packages/types/src/Theme/shadows.cjs');
 require('../../../../packages/types/src/Theme/defaultTheme.cjs');
+require('../../../../packages/types/src/Theme/alphaColors.cjs');
 var index_native = require('../../InputText/index.cjs');
 
 const NumericRadiusInput = ({

package/form/inputs/RadiusPicker/components/NumericRadiusInput.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"NumericRadiusInput.cjs","sources":["../../../../../../src/form/inputs/RadiusPicker/components/NumericRadiusInput.tsx"],"sourcesContent":["import React, {useEffect, useState} from \"react\";\nimport type {RadiusUnit} from \"@lmb-it/kitsconcerto-types\";\nimport {EKeyFilter} from \"@lmb-it/kitsconcerto-types\";\nimport {KitsInputText} from \"../../../../_compat\";\n\ninterface Props {\n    value: number;\n    unit: RadiusUnit;\n    min: number;\n    max: number;\n    disabled?: boolean;\n    readOnly?: boolean;\n    label?: string;\n    onCommit: (next: number) => void;\n}\n\n/**\n * Local-state numeric input with commit-on-blur semantics. Allows the user\n * to type freely (including a temporarily-empty field) while a controlled\n * `value` is shown as the fallback. On blur or Enter, the parsed number is\n * forwarded to `onCommit`, which is responsible for clamping + applying.\n */\nexport const NumericRadiusInput: React.FC<Props> = ({\n    value,\n    unit,\n    min,\n    max,\n    disabled,\n    readOnly,\n    label,\n    onCommit,\n}) => {\n    const [draft, setDraft] = useState<string>(String(value));\n\n    useEffect(() => {\n        setDraft(String(value));\n    }, [value]);\n\n    const commit = () => {\n        const parsed = Number.parseFloat(draft);\n        if (Number.isFinite(parsed)) {\n            onCommit(parsed);\n        } else {\n            setDraft(String(value));\n        }\n    };\n\n    return (\n        <KitsInputText\n            value={draft}\n            label={label}\n            disabled={disabled || readOnly}\n            keyFilter={EKeyFilter.Number}\n            keyboardType=\"decimal-pad\"\n            onChange={(next: any) => setDraft(typeof next === \"string\" ? next : (next?.target?.value ?? \"\"))}\n            onBlur={commit as any}\n            onSubmitEditing={commit}\n        />\n    );\n};\n\nexport default NumericRadiusInput;\n"],"names":["useState","useEffect","jsx","KitsInputText","EKeyFilter"],"mappings":";;;;;;;;;;;;;;;AAsBO,MAAM,qBAAsC,CAAC;AAAA,EAChD,KAAA;AAAA,EACA,IAAA;AAAA,EACA,GAAA;AAAA,EACA,GAAA;AAAA,EACA,QAAA;AAAA,EACA,QAAA;AAAA,EACA,KAAA;AAAA,EACA;AACJ,CAAA,KAAM;AACF,EAAA,MAAM,CAAC,KAAA,EAAO,QAAQ,IAAIA,cAAA,CAAiB,MAAA,CAAO,KAAK,CAAC,CAAA;AAExD,EAAAC,eAAA,CAAU,MAAM;AACZ,IAAA,QAAA,CAAS,MAAA,CAAO,KAAK,CAAC,CAAA;AAAA,EAC1B,CAAA,EAAG,CAAC,KAAK,CAAC,CAAA;AAEV,EAAA,MAAM,SAAS,MAAM;AACjB,IAAA,MAAM,MAAA,GAAS,MAAA,CAAO,UAAA,CAAW,KAAK,CAAA;AACtC,IAAA,IAAI,MAAA,CAAO,QAAA,CAAS,MAAM,CAAA,EAAG;AACzB,MAAA,QAAA,CAAS,MAAM,CAAA;AAAA,IACnB,CAAA,MAAO;AACH,MAAA,QAAA,CAAS,MAAA,CAAO,KAAK,CAAC,CAAA;AAAA,IAC1B;AAAA,EACJ,CAAA;AAEA,EAAA,uBACIC,cAAA;AAAA,IAACC,oBAAA;AAAA,IAAA;AAAA,MACG,KAAA,EAAO,KAAA;AAAA,MACP,KAAA;AAAA,MACA,UAAU,QAAA,IAAY,QAAA;AAAA,MACtB,WAAWC,gBAAA,CAAW,MAAA;AAAA,MACtB,YAAA,EAAa,aAAA;AAAA,MACb,QAAA,EAAU,CAAC,IAAA,KAAc,QAAA,CAAS,OAAO,IAAA,KAAS,QAAA,GAAW,IAAA,GAAQ,IAAA,EAAM,MAAA,EAAQ,KAAA,IAAS,EAAG,CAAA;AAAA,MAC/F,MAAA,EAAQ,MAAA;AAAA,MACR,eAAA,EAAiB;AAAA;AAAA,GACrB;AAER;;;;"}
+{"version":3,"file":"NumericRadiusInput.cjs","sources":["../../../../../../src/form/inputs/RadiusPicker/components/NumericRadiusInput.tsx"],"sourcesContent":["import React, {useEffect, useState} from \"react\";\nimport type {RadiusUnit} from \"@lmb-it/kitsconcerto-types\";\nimport {EKeyFilter} from \"@lmb-it/kitsconcerto-types\";\nimport {KitsInputText} from \"../../../../_compat\";\n\ninterface Props {\n    value: number;\n    unit: RadiusUnit;\n    min: number;\n    max: number;\n    disabled?: boolean;\n    readOnly?: boolean;\n    label?: string;\n    onCommit: (next: number) => void;\n}\n\n/**\n * Local-state numeric input with commit-on-blur semantics. Allows the user\n * to type freely (including a temporarily-empty field) while a controlled\n * `value` is shown as the fallback. On blur or Enter, the parsed number is\n * forwarded to `onCommit`, which is responsible for clamping + applying.\n */\nexport const NumericRadiusInput: React.FC<Props> = ({\n    value,\n    unit,\n    min,\n    max,\n    disabled,\n    readOnly,\n    label,\n    onCommit,\n}) => {\n    const [draft, setDraft] = useState<string>(String(value));\n\n    useEffect(() => {\n        setDraft(String(value));\n    }, [value]);\n\n    const commit = () => {\n        const parsed = Number.parseFloat(draft);\n        if (Number.isFinite(parsed)) {\n            onCommit(parsed);\n        } else {\n            setDraft(String(value));\n        }\n    };\n\n    return (\n        <KitsInputText\n            value={draft}\n            label={label}\n            disabled={disabled || readOnly}\n            keyFilter={EKeyFilter.Number}\n            keyboardType=\"decimal-pad\"\n            onChange={(next: any) => setDraft(typeof next === \"string\" ? next : (next?.target?.value ?? \"\"))}\n            onBlur={commit as any}\n            onSubmitEditing={commit}\n        />\n    );\n};\n\nexport default NumericRadiusInput;\n"],"names":["useState","useEffect","jsx","KitsInputText","EKeyFilter"],"mappings":";;;;;;;;;;;;;;;;AAsBO,MAAM,qBAAsC,CAAC;AAAA,EAChD,KAAA;AAAA,EACA,IAAA;AAAA,EACA,GAAA;AAAA,EACA,GAAA;AAAA,EACA,QAAA;AAAA,EACA,QAAA;AAAA,EACA,KAAA;AAAA,EACA;AACJ,CAAA,KAAM;AACF,EAAA,MAAM,CAAC,KAAA,EAAO,QAAQ,IAAIA,cAAA,CAAiB,MAAA,CAAO,KAAK,CAAC,CAAA;AAExD,EAAAC,eAAA,CAAU,MAAM;AACZ,IAAA,QAAA,CAAS,MAAA,CAAO,KAAK,CAAC,CAAA;AAAA,EAC1B,CAAA,EAAG,CAAC,KAAK,CAAC,CAAA;AAEV,EAAA,MAAM,SAAS,MAAM;AACjB,IAAA,MAAM,MAAA,GAAS,MAAA,CAAO,UAAA,CAAW,KAAK,CAAA;AACtC,IAAA,IAAI,MAAA,CAAO,QAAA,CAAS,MAAM,CAAA,EAAG;AACzB,MAAA,QAAA,CAAS,MAAM,CAAA;AAAA,IACnB,CAAA,MAAO;AACH,MAAA,QAAA,CAAS,MAAA,CAAO,KAAK,CAAC,CAAA;AAAA,IAC1B;AAAA,EACJ,CAAA;AAEA,EAAA,uBACIC,cAAA;AAAA,IAACC,oBAAA;AAAA,IAAA;AAAA,MACG,KAAA,EAAO,KAAA;AAAA,MACP,KAAA;AAAA,MACA,UAAU,QAAA,IAAY,QAAA;AAAA,MACtB,WAAWC,gBAAA,CAAW,MAAA;AAAA,MACtB,YAAA,EAAa,aAAA;AAAA,MACb,QAAA,EAAU,CAAC,IAAA,KAAc,QAAA,CAAS,OAAO,IAAA,KAAS,QAAA,GAAW,IAAA,GAAQ,IAAA,EAAM,MAAA,EAAQ,KAAA,IAAS,EAAG,CAAA;AAAA,MAC/F,MAAA,EAAQ,MAAA;AAAA,MACR,eAAA,EAAiB;AAAA;AAAA,GACrB;AAER;;;;"}

package/form/inputs/RadiusPicker/components/NumericRadiusInput.js

@@ -9,6 +9,7 @@ import 'yup';
 import '../../../../packages/types/src/Css/map/index.js';
 import '../../../../packages/types/src/Theme/shadows.js';
 import '../../../../packages/types/src/Theme/defaultTheme.js';
+import '../../../../packages/types/src/Theme/alphaColors.js';
 import KitsInputText from '../../InputText/index.js';
 
 const NumericRadiusInput = ({

package/form/inputs/RadiusPicker/components/NumericRadiusInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"NumericRadiusInput.js","sources":["../../../../../../src/form/inputs/RadiusPicker/components/NumericRadiusInput.tsx"],"sourcesContent":["import React, {useEffect, useState} from \"react\";\nimport type {RadiusUnit} from \"@lmb-it/kitsconcerto-types\";\nimport {EKeyFilter} from \"@lmb-it/kitsconcerto-types\";\nimport {KitsInputText} from \"../../../../_compat\";\n\ninterface Props {\n    value: number;\n    unit: RadiusUnit;\n    min: number;\n    max: number;\n    disabled?: boolean;\n    readOnly?: boolean;\n    label?: string;\n    onCommit: (next: number) => void;\n}\n\n/**\n * Local-state numeric input with commit-on-blur semantics. Allows the user\n * to type freely (including a temporarily-empty field) while a controlled\n * `value` is shown as the fallback. On blur or Enter, the parsed number is\n * forwarded to `onCommit`, which is responsible for clamping + applying.\n */\nexport const NumericRadiusInput: React.FC<Props> = ({\n    value,\n    unit,\n    min,\n    max,\n    disabled,\n    readOnly,\n    label,\n    onCommit,\n}) => {\n    const [draft, setDraft] = useState<string>(String(value));\n\n    useEffect(() => {\n        setDraft(String(value));\n    }, [value]);\n\n    const commit = () => {\n        const parsed = Number.parseFloat(draft);\n        if (Number.isFinite(parsed)) {\n            onCommit(parsed);\n        } else {\n            setDraft(String(value));\n        }\n    };\n\n    return (\n        <KitsInputText\n            value={draft}\n            label={label}\n            disabled={disabled || readOnly}\n            keyFilter={EKeyFilter.Number}\n            keyboardType=\"decimal-pad\"\n            onChange={(next: any) => setDraft(typeof next === \"string\" ? next : (next?.target?.value ?? \"\"))}\n            onBlur={commit as any}\n            onSubmitEditing={commit}\n        />\n    );\n};\n\nexport default NumericRadiusInput;\n"],"names":[],"mappings":";;;;;;;;;;;;;AAsBO,MAAM,qBAAsC,CAAC;AAAA,EAChD,KAAA;AAAA,EACA,IAAA;AAAA,EACA,GAAA;AAAA,EACA,GAAA;AAAA,EACA,QAAA;AAAA,EACA,QAAA;AAAA,EACA,KAAA;AAAA,EACA;AACJ,CAAA,KAAM;AACF,EAAA,MAAM,CAAC,KAAA,EAAO,QAAQ,IAAI,QAAA,CAAiB,MAAA,CAAO,KAAK,CAAC,CAAA;AAExD,EAAA,SAAA,CAAU,MAAM;AACZ,IAAA,QAAA,CAAS,MAAA,CAAO,KAAK,CAAC,CAAA;AAAA,EAC1B,CAAA,EAAG,CAAC,KAAK,CAAC,CAAA;AAEV,EAAA,MAAM,SAAS,MAAM;AACjB,IAAA,MAAM,MAAA,GAAS,MAAA,CAAO,UAAA,CAAW,KAAK,CAAA;AACtC,IAAA,IAAI,MAAA,CAAO,QAAA,CAAS,MAAM,CAAA,EAAG;AACzB,MAAA,QAAA,CAAS,MAAM,CAAA;AAAA,IACnB,CAAA,MAAO;AACH,MAAA,QAAA,CAAS,MAAA,CAAO,KAAK,CAAC,CAAA;AAAA,IAC1B;AAAA,EACJ,CAAA;AAEA,EAAA,uBACI,GAAA;AAAA,IAAC,aAAA;AAAA,IAAA;AAAA,MACG,KAAA,EAAO,KAAA;AAAA,MACP,KAAA;AAAA,MACA,UAAU,QAAA,IAAY,QAAA;AAAA,MACtB,WAAW,UAAA,CAAW,MAAA;AAAA,MACtB,YAAA,EAAa,aAAA;AAAA,MACb,QAAA,EAAU,CAAC,IAAA,KAAc,QAAA,CAAS,OAAO,IAAA,KAAS,QAAA,GAAW,IAAA,GAAQ,IAAA,EAAM,MAAA,EAAQ,KAAA,IAAS,EAAG,CAAA;AAAA,MAC/F,MAAA,EAAQ,MAAA;AAAA,MACR,eAAA,EAAiB;AAAA;AAAA,GACrB;AAER;;;;"}
+{"version":3,"file":"NumericRadiusInput.js","sources":["../../../../../../src/form/inputs/RadiusPicker/components/NumericRadiusInput.tsx"],"sourcesContent":["import React, {useEffect, useState} from \"react\";\nimport type {RadiusUnit} from \"@lmb-it/kitsconcerto-types\";\nimport {EKeyFilter} from \"@lmb-it/kitsconcerto-types\";\nimport {KitsInputText} from \"../../../../_compat\";\n\ninterface Props {\n    value: number;\n    unit: RadiusUnit;\n    min: number;\n    max: number;\n    disabled?: boolean;\n    readOnly?: boolean;\n    label?: string;\n    onCommit: (next: number) => void;\n}\n\n/**\n * Local-state numeric input with commit-on-blur semantics. Allows the user\n * to type freely (including a temporarily-empty field) while a controlled\n * `value` is shown as the fallback. On blur or Enter, the parsed number is\n * forwarded to `onCommit`, which is responsible for clamping + applying.\n */\nexport const NumericRadiusInput: React.FC<Props> = ({\n    value,\n    unit,\n    min,\n    max,\n    disabled,\n    readOnly,\n    label,\n    onCommit,\n}) => {\n    const [draft, setDraft] = useState<string>(String(value));\n\n    useEffect(() => {\n        setDraft(String(value));\n    }, [value]);\n\n    const commit = () => {\n        const parsed = Number.parseFloat(draft);\n        if (Number.isFinite(parsed)) {\n            onCommit(parsed);\n        } else {\n            setDraft(String(value));\n        }\n    };\n\n    return (\n        <KitsInputText\n            value={draft}\n            label={label}\n            disabled={disabled || readOnly}\n            keyFilter={EKeyFilter.Number}\n            keyboardType=\"decimal-pad\"\n            onChange={(next: any) => setDraft(typeof next === \"string\" ? next : (next?.target?.value ?? \"\"))}\n            onBlur={commit as any}\n            onSubmitEditing={commit}\n        />\n    );\n};\n\nexport default NumericRadiusInput;\n"],"names":[],"mappings":";;;;;;;;;;;;;;AAsBO,MAAM,qBAAsC,CAAC;AAAA,EAChD,KAAA;AAAA,EACA,IAAA;AAAA,EACA,GAAA;AAAA,EACA,GAAA;AAAA,EACA,QAAA;AAAA,EACA,QAAA;AAAA,EACA,KAAA;AAAA,EACA;AACJ,CAAA,KAAM;AACF,EAAA,MAAM,CAAC,KAAA,EAAO,QAAQ,IAAI,QAAA,CAAiB,MAAA,CAAO,KAAK,CAAC,CAAA;AAExD,EAAA,SAAA,CAAU,MAAM;AACZ,IAAA,QAAA,CAAS,MAAA,CAAO,KAAK,CAAC,CAAA;AAAA,EAC1B,CAAA,EAAG,CAAC,KAAK,CAAC,CAAA;AAEV,EAAA,MAAM,SAAS,MAAM;AACjB,IAAA,MAAM,MAAA,GAAS,MAAA,CAAO,UAAA,CAAW,KAAK,CAAA;AACtC,IAAA,IAAI,MAAA,CAAO,QAAA,CAAS,MAAM,CAAA,EAAG;AACzB,MAAA,QAAA,CAAS,MAAM,CAAA;AAAA,IACnB,CAAA,MAAO;AACH,MAAA,QAAA,CAAS,MAAA,CAAO,KAAK,CAAC,CAAA;AAAA,IAC1B;AAAA,EACJ,CAAA;AAEA,EAAA,uBACI,GAAA;AAAA,IAAC,aAAA;AAAA,IAAA;AAAA,MACG,KAAA,EAAO,KAAA;AAAA,MACP,KAAA;AAAA,MACA,UAAU,QAAA,IAAY,QAAA;AAAA,MACtB,WAAW,UAAA,CAAW,MAAA;AAAA,MACtB,YAAA,EAAa,aAAA;AAAA,MACb,QAAA,EAAU,CAAC,IAAA,KAAc,QAAA,CAAS,OAAO,IAAA,KAAS,QAAA,GAAW,IAAA,GAAQ,IAAA,EAAM,MAAA,EAAQ,KAAA,IAAS,EAAG,CAAA;AAAA,MAC/F,MAAA,EAAQ,MAAA;AAAA,MACR,eAAA,EAAiB;AAAA;AAAA,GACrB;AAER;;;;"}

package/form/selects/AutoComplete/index.cjs

@@ -62,6 +62,8 @@ require('yup');
 require('../../../packages/types/src/Css/map/index.cjs');
 require('../../../packages/types/src/Theme/shadows.cjs');
 require('../../../packages/types/src/Theme/defaultTheme.cjs');
+require('../../../packages/types/src/Theme/alphaColors.cjs');
+require('../../../apps/mobile/src/Factory/helpers/cssVarMap.cjs');
 require('../../../apps/mobile/src/Factory/DimensionsContext.cjs');
 var useSeparator = require('../../../apps/mobile/src/Factory/useSeparator.cjs');
 require('i18next');

package/form/selects/AutoComplete/index.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","sources":["../../../../../src/form/selects/AutoComplete/index.native.tsx"],"sourcesContent":["import React from \"react\";\nimport KitsContainer from \"../../helpers/FormContainer\";\nimport {AutoComplete, useSeparator} from \"@lmb-it/kitsconcertomobile\";\nimport type { IAutoCompleteElement } from \"@lmb-it/kitsconcerto-types\";\nimport { useAutoCompleteLogic } from \"../hooks/useAutoCompleteLogic\";\nimport { useComponentDefaults, useResolvedStyle } from \"../../../hooks\";\nimport { useKitsTheme } from \"../../../contexts/Theme\";\n\nconst KitsAutoComplete = ({ ref, ...rawProps }: IAutoCompleteElement) => {\n    const { mergedProps: props, themeStyle, elementStyles } = useComponentDefaults('AutoComplete', rawProps, 'Select');\n    const resolvedThemeStyle = useResolvedStyle(themeStyle);\n    const resolvedRootStyle = useResolvedStyle(elementStyles?.root || {});\n    const {\n        id,\n        rightAddon,\n        leftAddon,\n        errors,\n        invalid,\n        label,\n        hideError,\n        disabled,\n        required,\n        isFloatedLabel,\n        inputSize = \"md\",\n        forceSelection,\n        completeMethod,\n        helperText,\n        withArrow,\n        placeholder,\n        isMultiple,\n        localProps,\n        delay,\n        minLength,\n        selectionLimit,\n        showEmptyMessage,\n        emptyMessage,\n        attached,\n        containerStyle,\n    } = props;\n\n    const { nativeProps } = useSeparator<HTMLSelectElement>(props);\n\n    const { resolveToken } = useKitsTheme();\n    const primaryColor = resolveToken('primary');\n    const borderColor = resolveToken('border');\n\n    const {\n        inputValue,\n        setInputValue,\n        filteredList,\n        search,\n        handleOnChange,\n        list,\n        childrenKey,\n        labelKey,\n    } = useAutoCompleteLogic({ isMultiple, forceSelection, completeMethod, ref });\n\n    const hasThemeStyle = Object.keys(themeStyle).length > 0;\n\n\n    const Element = <AutoComplete\n        disabled={disabled}\n        placeholder={placeholder}\n        value={inputValue}\n        forceSelection={forceSelection}\n        suggestions={Array.isArray(filteredList) ? filteredList : list}\n        completeMethod={search}\n        dropdown={withArrow}\n        multiple={isMultiple}\n        field={labelKey}\n        invalid={!!invalid}\n        emptyMessage={emptyMessage ?? \"No results found\"}\n        {...(delay != null ? { delay } : {})}\n        {...(minLength != null ? { minLength } : {})}\n        {...(selectionLimit != null ? { selectionLimit } : {})}\n        showEmptyMessage={showEmptyMessage ?? true}\n        optionGroupChildren={childrenKey ?? undefined}\n        optionGroupLabel={childrenKey ? labelKey : undefined}\n        style={{ width: \"100%\", borderRadius: 0, border:'none', backgroundColor:'transparent' }}\n        inputStyle={{ flexDirection: \"row\", borderRadius: 0, border:'none', width: \"100%\",backgroundColor:'transparent', ...(resolvedRootStyle || resolvedThemeStyle) }}\n        onChange={(event) => {\n            setInputValue(event.value);\n            handleOnChange(event);\n        }}\n        {...(localProps ?? {})}\n    />\n\n    if (attached) {\n        return Element;\n    }\n\n    // KitsContainer's `inputGroup` wrapper defaults to `overflow: 'hidden'`\n    // (so rounded borders clip the input cleanly). For AutoComplete that\n    // would clip the floating suggestions panel back to the input's bounds\n    // — the panel renders but is invisible, which is the \"list never\n    // appears\" symptom on mobile. Force `overflow: 'visible'` on the\n    // container chain so the panel can escape.\n    const overflowEscape = {\n        ...elementStyles,\n        container: {\n            ...(elementStyles?.container || {}),\n            overflow: 'visible' as const,\n        },\n        inputGroup: {\n            ...(elementStyles?.inputGroup || {}),\n            overflow: 'visible' as const,\n        },\n    };\n\n    return (\n        <KitsContainer\n            id={id}\n            inputSize={inputSize}\n            isFloatedLabel={isFloatedLabel}\n            hideError={hideError}\n            rightAddon={rightAddon}\n            leftAddon={leftAddon}\n            required={required}\n            helperText={helperText}\n            errors={errors}\n            invalid={invalid}\n            label={label}\n            containerStyle={containerStyle}\n            elementStyles={overflowEscape}\n        >\n            {Element}\n        </KitsContainer>\n    );\n};\n\nexport default KitsAutoComplete;\n"],"names":["useComponentDefaults","useResolvedStyle","useSeparator","useKitsTheme","useAutoCompleteLogic","jsx","AutoComplete","KitsContainer"],"mappings":"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"}
+{"version":3,"file":"index.cjs","sources":["../../../../../src/form/selects/AutoComplete/index.native.tsx"],"sourcesContent":["import React from \"react\";\nimport KitsContainer from \"../../helpers/FormContainer\";\nimport {AutoComplete, useSeparator} from \"@lmb-it/kitsconcertomobile\";\nimport type { IAutoCompleteElement } from \"@lmb-it/kitsconcerto-types\";\nimport { useAutoCompleteLogic } from \"../hooks/useAutoCompleteLogic\";\nimport { useComponentDefaults, useResolvedStyle } from \"../../../hooks\";\nimport { useKitsTheme } from \"../../../contexts/Theme\";\n\nconst KitsAutoComplete = ({ ref, ...rawProps }: IAutoCompleteElement) => {\n    const { mergedProps: props, themeStyle, elementStyles } = useComponentDefaults('AutoComplete', rawProps, 'Select');\n    const resolvedThemeStyle = useResolvedStyle(themeStyle);\n    const resolvedRootStyle = useResolvedStyle(elementStyles?.root || {});\n    const {\n        id,\n        rightAddon,\n        leftAddon,\n        errors,\n        invalid,\n        label,\n        hideError,\n        disabled,\n        required,\n        isFloatedLabel,\n        inputSize = \"md\",\n        forceSelection,\n        completeMethod,\n        helperText,\n        withArrow,\n        placeholder,\n        isMultiple,\n        localProps,\n        delay,\n        minLength,\n        selectionLimit,\n        showEmptyMessage,\n        emptyMessage,\n        attached,\n        containerStyle,\n    } = props;\n\n    const { nativeProps } = useSeparator<HTMLSelectElement>(props);\n\n    const { resolveToken } = useKitsTheme();\n    const primaryColor = resolveToken('primary');\n    const borderColor = resolveToken('border');\n\n    const {\n        inputValue,\n        setInputValue,\n        filteredList,\n        search,\n        handleOnChange,\n        list,\n        childrenKey,\n        labelKey,\n    } = useAutoCompleteLogic({ isMultiple, forceSelection, completeMethod, ref });\n\n    const hasThemeStyle = Object.keys(themeStyle).length > 0;\n\n\n    const Element = <AutoComplete\n        disabled={disabled}\n        placeholder={placeholder}\n        value={inputValue}\n        forceSelection={forceSelection}\n        suggestions={Array.isArray(filteredList) ? filteredList : list}\n        completeMethod={search}\n        dropdown={withArrow}\n        multiple={isMultiple}\n        field={labelKey}\n        invalid={!!invalid}\n        emptyMessage={emptyMessage ?? \"No results found\"}\n        {...(delay != null ? { delay } : {})}\n        {...(minLength != null ? { minLength } : {})}\n        {...(selectionLimit != null ? { selectionLimit } : {})}\n        showEmptyMessage={showEmptyMessage ?? true}\n        optionGroupChildren={childrenKey ?? undefined}\n        optionGroupLabel={childrenKey ? labelKey : undefined}\n        style={{ width: \"100%\", borderRadius: 0, border:'none', backgroundColor:'transparent' }}\n        inputStyle={{ flexDirection: \"row\", borderRadius: 0, border:'none', width: \"100%\",backgroundColor:'transparent', ...(resolvedRootStyle || resolvedThemeStyle) }}\n        onChange={(event) => {\n            setInputValue(event.value);\n            handleOnChange(event);\n        }}\n        {...(localProps ?? {})}\n    />\n\n    if (attached) {\n        return Element;\n    }\n\n    // KitsContainer's `inputGroup` wrapper defaults to `overflow: 'hidden'`\n    // (so rounded borders clip the input cleanly). For AutoComplete that\n    // would clip the floating suggestions panel back to the input's bounds\n    // — the panel renders but is invisible, which is the \"list never\n    // appears\" symptom on mobile. Force `overflow: 'visible'` on the\n    // container chain so the panel can escape.\n    const overflowEscape = {\n        ...elementStyles,\n        container: {\n            ...(elementStyles?.container || {}),\n            overflow: 'visible' as const,\n        },\n        inputGroup: {\n            ...(elementStyles?.inputGroup || {}),\n            overflow: 'visible' as const,\n        },\n    };\n\n    return (\n        <KitsContainer\n            id={id}\n            inputSize={inputSize}\n            isFloatedLabel={isFloatedLabel}\n            hideError={hideError}\n            rightAddon={rightAddon}\n            leftAddon={leftAddon}\n            required={required}\n            helperText={helperText}\n            errors={errors}\n            invalid={invalid}\n            label={label}\n            containerStyle={containerStyle}\n            elementStyles={overflowEscape}\n        >\n            {Element}\n        </KitsContainer>\n    );\n};\n\nexport default KitsAutoComplete;\n"],"names":["useComponentDefaults","useResolvedStyle","useSeparator","useKitsTheme","useAutoCompleteLogic","jsx","AutoComplete","KitsContainer"],"mappings":"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"}

package/form/selects/AutoComplete/index.js

@@ -58,6 +58,8 @@ import 'yup';
 import '../../../packages/types/src/Css/map/index.js';
 import '../../../packages/types/src/Theme/shadows.js';
 import '../../../packages/types/src/Theme/defaultTheme.js';
+import '../../../packages/types/src/Theme/alphaColors.js';
+import '../../../apps/mobile/src/Factory/helpers/cssVarMap.js';
 import '../../../apps/mobile/src/Factory/DimensionsContext.js';
 import useSeparator from '../../../apps/mobile/src/Factory/useSeparator.js';
 import 'i18next';

package/form/selects/AutoComplete/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../../src/form/selects/AutoComplete/index.native.tsx"],"sourcesContent":["import React from \"react\";\nimport KitsContainer from \"../../helpers/FormContainer\";\nimport {AutoComplete, useSeparator} from \"@lmb-it/kitsconcertomobile\";\nimport type { IAutoCompleteElement } from \"@lmb-it/kitsconcerto-types\";\nimport { useAutoCompleteLogic } from \"../hooks/useAutoCompleteLogic\";\nimport { useComponentDefaults, useResolvedStyle } from \"../../../hooks\";\nimport { useKitsTheme } from \"../../../contexts/Theme\";\n\nconst KitsAutoComplete = ({ ref, ...rawProps }: IAutoCompleteElement) => {\n    const { mergedProps: props, themeStyle, elementStyles } = useComponentDefaults('AutoComplete', rawProps, 'Select');\n    const resolvedThemeStyle = useResolvedStyle(themeStyle);\n    const resolvedRootStyle = useResolvedStyle(elementStyles?.root || {});\n    const {\n        id,\n        rightAddon,\n        leftAddon,\n        errors,\n        invalid,\n        label,\n        hideError,\n        disabled,\n        required,\n        isFloatedLabel,\n        inputSize = \"md\",\n        forceSelection,\n        completeMethod,\n        helperText,\n        withArrow,\n        placeholder,\n        isMultiple,\n        localProps,\n        delay,\n        minLength,\n        selectionLimit,\n        showEmptyMessage,\n        emptyMessage,\n        attached,\n        containerStyle,\n    } = props;\n\n    const { nativeProps } = useSeparator<HTMLSelectElement>(props);\n\n    const { resolveToken } = useKitsTheme();\n    const primaryColor = resolveToken('primary');\n    const borderColor = resolveToken('border');\n\n    const {\n        inputValue,\n        setInputValue,\n        filteredList,\n        search,\n        handleOnChange,\n        list,\n        childrenKey,\n        labelKey,\n    } = useAutoCompleteLogic({ isMultiple, forceSelection, completeMethod, ref });\n\n    const hasThemeStyle = Object.keys(themeStyle).length > 0;\n\n\n    const Element = <AutoComplete\n        disabled={disabled}\n        placeholder={placeholder}\n        value={inputValue}\n        forceSelection={forceSelection}\n        suggestions={Array.isArray(filteredList) ? filteredList : list}\n        completeMethod={search}\n        dropdown={withArrow}\n        multiple={isMultiple}\n        field={labelKey}\n        invalid={!!invalid}\n        emptyMessage={emptyMessage ?? \"No results found\"}\n        {...(delay != null ? { delay } : {})}\n        {...(minLength != null ? { minLength } : {})}\n        {...(selectionLimit != null ? { selectionLimit } : {})}\n        showEmptyMessage={showEmptyMessage ?? true}\n        optionGroupChildren={childrenKey ?? undefined}\n        optionGroupLabel={childrenKey ? labelKey : undefined}\n        style={{ width: \"100%\", borderRadius: 0, border:'none', backgroundColor:'transparent' }}\n        inputStyle={{ flexDirection: \"row\", borderRadius: 0, border:'none', width: \"100%\",backgroundColor:'transparent', ...(resolvedRootStyle || resolvedThemeStyle) }}\n        onChange={(event) => {\n            setInputValue(event.value);\n            handleOnChange(event);\n        }}\n        {...(localProps ?? {})}\n    />\n\n    if (attached) {\n        return Element;\n    }\n\n    // KitsContainer's `inputGroup` wrapper defaults to `overflow: 'hidden'`\n    // (so rounded borders clip the input cleanly). For AutoComplete that\n    // would clip the floating suggestions panel back to the input's bounds\n    // — the panel renders but is invisible, which is the \"list never\n    // appears\" symptom on mobile. Force `overflow: 'visible'` on the\n    // container chain so the panel can escape.\n    const overflowEscape = {\n        ...elementStyles,\n        container: {\n            ...(elementStyles?.container || {}),\n            overflow: 'visible' as const,\n        },\n        inputGroup: {\n            ...(elementStyles?.inputGroup || {}),\n            overflow: 'visible' as const,\n        },\n    };\n\n    return (\n        <KitsContainer\n            id={id}\n            inputSize={inputSize}\n            isFloatedLabel={isFloatedLabel}\n            hideError={hideError}\n            rightAddon={rightAddon}\n            leftAddon={leftAddon}\n            required={required}\n            helperText={helperText}\n            errors={errors}\n            invalid={invalid}\n            label={label}\n            containerStyle={containerStyle}\n            elementStyles={overflowEscape}\n        >\n            {Element}\n        </KitsContainer>\n    );\n};\n\nexport default KitsAutoComplete;\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../../../../../src/form/selects/AutoComplete/index.native.tsx"],"sourcesContent":["import React from \"react\";\nimport KitsContainer from \"../../helpers/FormContainer\";\nimport {AutoComplete, useSeparator} from \"@lmb-it/kitsconcertomobile\";\nimport type { IAutoCompleteElement } from \"@lmb-it/kitsconcerto-types\";\nimport { useAutoCompleteLogic } from \"../hooks/useAutoCompleteLogic\";\nimport { useComponentDefaults, useResolvedStyle } from \"../../../hooks\";\nimport { useKitsTheme } from \"../../../contexts/Theme\";\n\nconst KitsAutoComplete = ({ ref, ...rawProps }: IAutoCompleteElement) => {\n    const { mergedProps: props, themeStyle, elementStyles } = useComponentDefaults('AutoComplete', rawProps, 'Select');\n    const resolvedThemeStyle = useResolvedStyle(themeStyle);\n    const resolvedRootStyle = useResolvedStyle(elementStyles?.root || {});\n    const {\n        id,\n        rightAddon,\n        leftAddon,\n        errors,\n        invalid,\n        label,\n        hideError,\n        disabled,\n        required,\n        isFloatedLabel,\n        inputSize = \"md\",\n        forceSelection,\n        completeMethod,\n        helperText,\n        withArrow,\n        placeholder,\n        isMultiple,\n        localProps,\n        delay,\n        minLength,\n        selectionLimit,\n        showEmptyMessage,\n        emptyMessage,\n        attached,\n        containerStyle,\n    } = props;\n\n    const { nativeProps } = useSeparator<HTMLSelectElement>(props);\n\n    const { resolveToken } = useKitsTheme();\n    const primaryColor = resolveToken('primary');\n    const borderColor = resolveToken('border');\n\n    const {\n        inputValue,\n        setInputValue,\n        filteredList,\n        search,\n        handleOnChange,\n        list,\n        childrenKey,\n        labelKey,\n    } = useAutoCompleteLogic({ isMultiple, forceSelection, completeMethod, ref });\n\n    const hasThemeStyle = Object.keys(themeStyle).length > 0;\n\n\n    const Element = <AutoComplete\n        disabled={disabled}\n        placeholder={placeholder}\n        value={inputValue}\n        forceSelection={forceSelection}\n        suggestions={Array.isArray(filteredList) ? filteredList : list}\n        completeMethod={search}\n        dropdown={withArrow}\n        multiple={isMultiple}\n        field={labelKey}\n        invalid={!!invalid}\n        emptyMessage={emptyMessage ?? \"No results found\"}\n        {...(delay != null ? { delay } : {})}\n        {...(minLength != null ? { minLength } : {})}\n        {...(selectionLimit != null ? { selectionLimit } : {})}\n        showEmptyMessage={showEmptyMessage ?? true}\n        optionGroupChildren={childrenKey ?? undefined}\n        optionGroupLabel={childrenKey ? labelKey : undefined}\n        style={{ width: \"100%\", borderRadius: 0, border:'none', backgroundColor:'transparent' }}\n        inputStyle={{ flexDirection: \"row\", borderRadius: 0, border:'none', width: \"100%\",backgroundColor:'transparent', ...(resolvedRootStyle || resolvedThemeStyle) }}\n        onChange={(event) => {\n            setInputValue(event.value);\n            handleOnChange(event);\n        }}\n        {...(localProps ?? {})}\n    />\n\n    if (attached) {\n        return Element;\n    }\n\n    // KitsContainer's `inputGroup` wrapper defaults to `overflow: 'hidden'`\n    // (so rounded borders clip the input cleanly). For AutoComplete that\n    // would clip the floating suggestions panel back to the input's bounds\n    // — the panel renders but is invisible, which is the \"list never\n    // appears\" symptom on mobile. Force `overflow: 'visible'` on the\n    // container chain so the panel can escape.\n    const overflowEscape = {\n        ...elementStyles,\n        container: {\n            ...(elementStyles?.container || {}),\n            overflow: 'visible' as const,\n        },\n        inputGroup: {\n            ...(elementStyles?.inputGroup || {}),\n            overflow: 'visible' as const,\n        },\n    };\n\n    return (\n        <KitsContainer\n            id={id}\n            inputSize={inputSize}\n            isFloatedLabel={isFloatedLabel}\n            hideError={hideError}\n            rightAddon={rightAddon}\n            leftAddon={leftAddon}\n            required={required}\n            helperText={helperText}\n            errors={errors}\n            invalid={invalid}\n            label={label}\n            containerStyle={containerStyle}\n            elementStyles={overflowEscape}\n        >\n            {Element}\n        </KitsContainer>\n    );\n};\n\nexport default KitsAutoComplete;\n"],"names":[],"mappings":"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"}

package/form/selects/Dropdown/index.cjs

@@ -61,6 +61,8 @@ require('yup');
 require('../../../packages/types/src/Css/map/index.cjs');
 require('../../../packages/types/src/Theme/shadows.cjs');
 require('../../../packages/types/src/Theme/defaultTheme.cjs');
+require('../../../packages/types/src/Theme/alphaColors.cjs');
+require('../../../apps/mobile/src/Factory/helpers/cssVarMap.cjs');
 require('../../../apps/mobile/src/Factory/DimensionsContext.cjs');
 require('i18next');
 require('react-i18next');

package/form/selects/Dropdown/index.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","sources":["../../../../../src/form/selects/Dropdown/index.native.tsx"],"sourcesContent":["import React from \"react\";\nimport { Dropdown } from \"@lmb-it/kitsconcertomobile\";\nimport type { IDropdownSelect } from \"@lmb-it/kitsconcerto-types\";\nimport { KitsContainer } from \"../../../_compat\";\nimport { ClHelper } from \"../../helpers/Functions\";\nimport { useSelectBase } from \"../hooks/useSelectBase\";\nimport {useComponentDefaults, useResolvedStyle} from \"../../../hooks\";\n\nconst KitsDropdown = ({ className, ref, ...rawProps }: IDropdownSelect) => {\n    const {mergedProps: props, themeStyle, elementStyles} = useComponentDefaults('DropdownSelect', rawProps, 'Select');\n    const resolvedThemeStyle = useResolvedStyle(themeStyle);\n    const resolvedRootStyle = useResolvedStyle(elementStyles?.root || {});\n    const {\n        id,\n        rightAddon,\n        leftAddon,\n        errors,\n        invalid,\n        disabled,\n        required,\n        label,\n        localProps,\n        helperText,\n        isFloatedLabel,\n        withFilter,\n        attached,\n        inputSize,\n        placeholder,\n        hideError,\n        virtualScroll,\n        emptyFilterMessage,\n        filterBy,\n        loading,\n        showClear,\n        containerStyle\n    } = props;\n\n    const { list, keys, onChange, selectedValue } = useSelectBase();\n\n    const ClState = ClHelper({\n        inputSize: inputSize ?? \"\",\n        isChecked: false,\n        isInvalid: !!invalid,\n        isDisabled: !!disabled,\n    });\n\n    const dropdownValue = selectedValue != null && typeof selectedValue !== 'object'\n        ? selectedValue.toString()\n        : selectedValue;\n\n    const Element = (\n        <Dropdown\n            emptyFilterMessage={emptyFilterMessage}\n            value={dropdownValue}\n            placeholder={placeholder}\n            options={Array.isArray(list) ? list : []}\n            disabled={disabled}\n            loading={loading}\n            showClear={showClear ?? (!required && selectedValue != null)}\n            style={{ width: '100%', height: attached ? '100%' : undefined, borderRadius: 0, ...(resolvedRootStyle && Object.keys(resolvedRootStyle).length > 0 ? resolvedRootStyle : resolvedThemeStyle) }}\n            onChange={onChange}\n            {...keys}\n            invalid={hideError && !!invalid}\n            filter={!!withFilter}\n            filterBy={filterBy ?? 'label'}\n            virtualScrollerOptions={virtualScroll}\n            className={`w-full ${className ?? ''} ${ClState}`}\n            {...(localProps ? localProps : {})}\n        />\n    );\n\n    if (attached) {\n        return Element;\n    }\n\n    return (\n        <KitsContainer\n            id={id}\n            inputSize={inputSize}\n            isFloatedLabel={isFloatedLabel}\n            rightAddon={rightAddon}\n            leftAddon={leftAddon}\n            required={required}\n            hideError={hideError}\n            errors={errors}\n            helperText={helperText}\n            invalid={invalid}\n            label={label}\n            containerStyle={containerStyle}\n            elementStyles={elementStyles}\n        >\n            {Element}\n        </KitsContainer>\n    );\n}\nexport default KitsDropdown;\n"],"names":["useComponentDefaults","useResolvedStyle","useSelectBase","ClHelper","jsx","Dropdown","KitsContainer"],"mappings":"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"}
+{"version":3,"file":"index.cjs","sources":["../../../../../src/form/selects/Dropdown/index.native.tsx"],"sourcesContent":["import React from \"react\";\nimport { Dropdown } from \"@lmb-it/kitsconcertomobile\";\nimport type { IDropdownSelect } from \"@lmb-it/kitsconcerto-types\";\nimport { KitsContainer } from \"../../../_compat\";\nimport { ClHelper } from \"../../helpers/Functions\";\nimport { useSelectBase } from \"../hooks/useSelectBase\";\nimport {useComponentDefaults, useResolvedStyle} from \"../../../hooks\";\n\nconst KitsDropdown = ({ className, ref, ...rawProps }: IDropdownSelect) => {\n    const {mergedProps: props, themeStyle, elementStyles} = useComponentDefaults('DropdownSelect', rawProps, 'Select');\n    const resolvedThemeStyle = useResolvedStyle(themeStyle);\n    const resolvedRootStyle = useResolvedStyle(elementStyles?.root || {});\n    const {\n        id,\n        rightAddon,\n        leftAddon,\n        errors,\n        invalid,\n        disabled,\n        required,\n        label,\n        localProps,\n        helperText,\n        isFloatedLabel,\n        withFilter,\n        attached,\n        inputSize,\n        placeholder,\n        hideError,\n        virtualScroll,\n        emptyFilterMessage,\n        filterBy,\n        loading,\n        showClear,\n        containerStyle\n    } = props;\n\n    const { list, keys, onChange, selectedValue } = useSelectBase();\n\n    const ClState = ClHelper({\n        inputSize: inputSize ?? \"\",\n        isChecked: false,\n        isInvalid: !!invalid,\n        isDisabled: !!disabled,\n    });\n\n    const dropdownValue = selectedValue != null && typeof selectedValue !== 'object'\n        ? selectedValue.toString()\n        : selectedValue;\n\n    const Element = (\n        <Dropdown\n            emptyFilterMessage={emptyFilterMessage}\n            value={dropdownValue}\n            placeholder={placeholder}\n            options={Array.isArray(list) ? list : []}\n            disabled={disabled}\n            loading={loading}\n            showClear={showClear ?? (!required && selectedValue != null)}\n            style={{ width: '100%', height: attached ? '100%' : undefined, borderRadius: 0, ...(resolvedRootStyle && Object.keys(resolvedRootStyle).length > 0 ? resolvedRootStyle : resolvedThemeStyle) }}\n            onChange={onChange}\n            {...keys}\n            invalid={hideError && !!invalid}\n            filter={!!withFilter}\n            filterBy={filterBy ?? 'label'}\n            virtualScrollerOptions={virtualScroll}\n            className={`w-full ${className ?? ''} ${ClState}`}\n            {...(localProps ? localProps : {})}\n        />\n    );\n\n    if (attached) {\n        return Element;\n    }\n\n    return (\n        <KitsContainer\n            id={id}\n            inputSize={inputSize}\n            isFloatedLabel={isFloatedLabel}\n            rightAddon={rightAddon}\n            leftAddon={leftAddon}\n            required={required}\n            hideError={hideError}\n            errors={errors}\n            helperText={helperText}\n            invalid={invalid}\n            label={label}\n            containerStyle={containerStyle}\n            elementStyles={elementStyles}\n        >\n            {Element}\n        </KitsContainer>\n    );\n}\nexport default KitsDropdown;\n"],"names":["useComponentDefaults","useResolvedStyle","useSelectBase","ClHelper","jsx","Dropdown","KitsContainer"],"mappings":"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"}

package/form/selects/Dropdown/index.js

@@ -57,6 +57,8 @@ import 'yup';
 import '../../../packages/types/src/Css/map/index.js';
 import '../../../packages/types/src/Theme/shadows.js';
 import '../../../packages/types/src/Theme/defaultTheme.js';
+import '../../../packages/types/src/Theme/alphaColors.js';
+import '../../../apps/mobile/src/Factory/helpers/cssVarMap.js';
 import '../../../apps/mobile/src/Factory/DimensionsContext.js';
 import 'i18next';
 import 'react-i18next';

package/form/selects/Dropdown/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../../src/form/selects/Dropdown/index.native.tsx"],"sourcesContent":["import React from \"react\";\nimport { Dropdown } from \"@lmb-it/kitsconcertomobile\";\nimport type { IDropdownSelect } from \"@lmb-it/kitsconcerto-types\";\nimport { KitsContainer } from \"../../../_compat\";\nimport { ClHelper } from \"../../helpers/Functions\";\nimport { useSelectBase } from \"../hooks/useSelectBase\";\nimport {useComponentDefaults, useResolvedStyle} from \"../../../hooks\";\n\nconst KitsDropdown = ({ className, ref, ...rawProps }: IDropdownSelect) => {\n    const {mergedProps: props, themeStyle, elementStyles} = useComponentDefaults('DropdownSelect', rawProps, 'Select');\n    const resolvedThemeStyle = useResolvedStyle(themeStyle);\n    const resolvedRootStyle = useResolvedStyle(elementStyles?.root || {});\n    const {\n        id,\n        rightAddon,\n        leftAddon,\n        errors,\n        invalid,\n        disabled,\n        required,\n        label,\n        localProps,\n        helperText,\n        isFloatedLabel,\n        withFilter,\n        attached,\n        inputSize,\n        placeholder,\n        hideError,\n        virtualScroll,\n        emptyFilterMessage,\n        filterBy,\n        loading,\n        showClear,\n        containerStyle\n    } = props;\n\n    const { list, keys, onChange, selectedValue } = useSelectBase();\n\n    const ClState = ClHelper({\n        inputSize: inputSize ?? \"\",\n        isChecked: false,\n        isInvalid: !!invalid,\n        isDisabled: !!disabled,\n    });\n\n    const dropdownValue = selectedValue != null && typeof selectedValue !== 'object'\n        ? selectedValue.toString()\n        : selectedValue;\n\n    const Element = (\n        <Dropdown\n            emptyFilterMessage={emptyFilterMessage}\n            value={dropdownValue}\n            placeholder={placeholder}\n            options={Array.isArray(list) ? list : []}\n            disabled={disabled}\n            loading={loading}\n            showClear={showClear ?? (!required && selectedValue != null)}\n            style={{ width: '100%', height: attached ? '100%' : undefined, borderRadius: 0, ...(resolvedRootStyle && Object.keys(resolvedRootStyle).length > 0 ? resolvedRootStyle : resolvedThemeStyle) }}\n            onChange={onChange}\n            {...keys}\n            invalid={hideError && !!invalid}\n            filter={!!withFilter}\n            filterBy={filterBy ?? 'label'}\n            virtualScrollerOptions={virtualScroll}\n            className={`w-full ${className ?? ''} ${ClState}`}\n            {...(localProps ? localProps : {})}\n        />\n    );\n\n    if (attached) {\n        return Element;\n    }\n\n    return (\n        <KitsContainer\n            id={id}\n            inputSize={inputSize}\n            isFloatedLabel={isFloatedLabel}\n            rightAddon={rightAddon}\n            leftAddon={leftAddon}\n            required={required}\n            hideError={hideError}\n            errors={errors}\n            helperText={helperText}\n            invalid={invalid}\n            label={label}\n            containerStyle={containerStyle}\n            elementStyles={elementStyles}\n        >\n            {Element}\n        </KitsContainer>\n    );\n}\nexport default KitsDropdown;\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../../../../../src/form/selects/Dropdown/index.native.tsx"],"sourcesContent":["import React from \"react\";\nimport { Dropdown } from \"@lmb-it/kitsconcertomobile\";\nimport type { IDropdownSelect } from \"@lmb-it/kitsconcerto-types\";\nimport { KitsContainer } from \"../../../_compat\";\nimport { ClHelper } from \"../../helpers/Functions\";\nimport { useSelectBase } from \"../hooks/useSelectBase\";\nimport {useComponentDefaults, useResolvedStyle} from \"../../../hooks\";\n\nconst KitsDropdown = ({ className, ref, ...rawProps }: IDropdownSelect) => {\n    const {mergedProps: props, themeStyle, elementStyles} = useComponentDefaults('DropdownSelect', rawProps, 'Select');\n    const resolvedThemeStyle = useResolvedStyle(themeStyle);\n    const resolvedRootStyle = useResolvedStyle(elementStyles?.root || {});\n    const {\n        id,\n        rightAddon,\n        leftAddon,\n        errors,\n        invalid,\n        disabled,\n        required,\n        label,\n        localProps,\n        helperText,\n        isFloatedLabel,\n        withFilter,\n        attached,\n        inputSize,\n        placeholder,\n        hideError,\n        virtualScroll,\n        emptyFilterMessage,\n        filterBy,\n        loading,\n        showClear,\n        containerStyle\n    } = props;\n\n    const { list, keys, onChange, selectedValue } = useSelectBase();\n\n    const ClState = ClHelper({\n        inputSize: inputSize ?? \"\",\n        isChecked: false,\n        isInvalid: !!invalid,\n        isDisabled: !!disabled,\n    });\n\n    const dropdownValue = selectedValue != null && typeof selectedValue !== 'object'\n        ? selectedValue.toString()\n        : selectedValue;\n\n    const Element = (\n        <Dropdown\n            emptyFilterMessage={emptyFilterMessage}\n            value={dropdownValue}\n            placeholder={placeholder}\n            options={Array.isArray(list) ? list : []}\n            disabled={disabled}\n            loading={loading}\n            showClear={showClear ?? (!required && selectedValue != null)}\n            style={{ width: '100%', height: attached ? '100%' : undefined, borderRadius: 0, ...(resolvedRootStyle && Object.keys(resolvedRootStyle).length > 0 ? resolvedRootStyle : resolvedThemeStyle) }}\n            onChange={onChange}\n            {...keys}\n            invalid={hideError && !!invalid}\n            filter={!!withFilter}\n            filterBy={filterBy ?? 'label'}\n            virtualScrollerOptions={virtualScroll}\n            className={`w-full ${className ?? ''} ${ClState}`}\n            {...(localProps ? localProps : {})}\n        />\n    );\n\n    if (attached) {\n        return Element;\n    }\n\n    return (\n        <KitsContainer\n            id={id}\n            inputSize={inputSize}\n            isFloatedLabel={isFloatedLabel}\n            rightAddon={rightAddon}\n            leftAddon={leftAddon}\n            required={required}\n            hideError={hideError}\n            errors={errors}\n            helperText={helperText}\n            invalid={invalid}\n            label={label}\n            containerStyle={containerStyle}\n            elementStyles={elementStyles}\n        >\n            {Element}\n        </KitsContainer>\n    );\n}\nexport default KitsDropdown;\n"],"names":[],"mappings":"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"}

package/form/selects/ListBox/index.cjs

@@ -65,6 +65,8 @@ require('yup');
 require('../../../packages/types/src/Css/map/index.cjs');
 require('../../../packages/types/src/Theme/shadows.cjs');
 require('../../../packages/types/src/Theme/defaultTheme.cjs');
+require('../../../packages/types/src/Theme/alphaColors.cjs');
+require('../../../apps/mobile/src/Factory/helpers/cssVarMap.cjs');
 require('i18next');
 require('react-i18next');
 require('../../../apps/mobile/src/Core/AutoComplete/index.cjs');

package/form/selects/ListBox/index.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","sources":["../../../../../src/form/selects/ListBox/index.native.tsx"],"sourcesContent":["import React, { useCallback, useMemo, useState } from \"react\";\nimport { ScrollView, Pressable, TextInput } from \"react-native\";\nimport { VStack, Box, Text } from '../../../_compat';\nimport type { IListBoxSelect } from \"@lmb-it/kitsconcerto-types\";\nimport { useSelectBase } from \"../hooks/useSelectBase\";\nimport KitsContainer from \"../../helpers/FormContainer\";\nimport { resolveThemeTokenForNative } from \"@lmb-it/kitsconcertomobile\";\nimport { useComponentDefaults, useResolvedStyle } from \"@lmb-it/kitsconcerto/hooks\";\n\nconst KitsListBox = (rawProps: IListBoxSelect) => {\n    const { mergedProps: props, themeStyle, elementStyles } = useComponentDefaults('ListBox', rawProps, 'Select');\n    const resolvedThemeStyle = useResolvedStyle(themeStyle);\n    const resolvedRootStyle = useResolvedStyle(elementStyles?.root || {});\n    const {\n        id,\n        label,\n        disabled,\n        invalid,\n        errors,\n        helperText,\n        inputSize = \"md\",\n        isMultiple,\n        withFilter,\n        filterBy,\n        hideError,\n    } = props;\n\n    const { list, labelKey, valueKey, childrenKey, onChange, selectedValue } = useSelectBase();\n\n    const [filterText, setFilterText] = useState(\"\");\n\n    const t = resolveThemeTokenForNative;\n    const primaryBg = t('highlight-bg') || t('primary.100') || '#E8EAF6';\n    const primaryText = t('primary.700') || '#303F9F';\n    const borderClr = invalid ? (t('danger') || '#EF4444') : (t('border') || '#D1D5DB');\n    const textColor = t('text') || '#1F2937';\n    const placeholderColor = t('text-secondary') || '#9CA3AF';\n    const groupBg = t('surface-ground') || '#F9FAFB';\n\n    const isSelected = useCallback((val: any) => {\n        if (isMultiple && Array.isArray(selectedValue)) {\n            return selectedValue.includes(val);\n        }\n        return selectedValue === val;\n    }, [isMultiple, selectedValue]);\n\n    const onSelect = useCallback((val: any, item: any) => {\n        if (isMultiple && Array.isArray(selectedValue)) {\n            const newVals = selectedValue.includes(val)\n                ? selectedValue.filter((v: any) => v !== val)\n                : [...selectedValue, val];\n            onChange({ target: { value: newVals } }, newVals);\n        } else {\n            onChange({ target: { value: val } }, item);\n        }\n    }, [isMultiple, selectedValue, onChange]);\n\n    const filteredList = useMemo(() => {\n        if (!withFilter || !filterText.trim()) return list;\n        const query = filterText.toLowerCase();\n        const searchKey = filterBy || labelKey;\n\n        if (childrenKey) {\n            return list.reduce((acc: any[], group: any) => {\n                const children = group[childrenKey];\n                if (Array.isArray(children)) {\n                    const matched = children.filter((item: any) =>\n                        String(item[searchKey] ?? \"\").toLowerCase().includes(query)\n                    );\n                    if (matched.length > 0) {\n                        acc.push({ ...group, [childrenKey]: matched });\n                    }\n                }\n                return acc;\n            }, []);\n        }\n\n        return list.filter((item: any) =>\n            String(item[searchKey] ?? \"\").toLowerCase().includes(query)\n        );\n    }, [list, filterText, withFilter, filterBy, labelKey, childrenKey]);\n\n    const renderItem = (item: any, index: number) => {\n        const val = item[valueKey];\n        const selected = isSelected(val);\n        return (\n            <Pressable\n                key={`${val}-${index}`}\n                style={{\n                    padding: 10,\n                    backgroundColor: selected ? primaryBg : 'transparent',\n                }}\n                onPress={() => !disabled && onSelect(val, item)}\n            >\n                <Text\n                    color={selected ? primaryText : textColor}\n                    fontWeight={selected ? \"bold\" : \"normal\"}\n                    size={inputSize}\n                >\n                    {item[labelKey]}\n                </Text>\n            </Pressable>\n        );\n    };\n\n    const renderGroupedItems = () => {\n        return filteredList.map((group: any, gi: number) => {\n            const children = group[childrenKey!];\n            if (!Array.isArray(children)) {\n                return renderItem(group, gi);\n            }\n            return (\n                <Box key={`group-${gi}`}>\n                    <Box style={{ backgroundColor: groupBg, paddingHorizontal: 12, paddingVertical: 8 }}>\n                        <Text fontWeight=\"600\" color={textColor} size={inputSize}>\n                            {group[labelKey]}\n                        </Text>\n                    </Box>\n                    {children.map((item: any, ci: number) => renderItem(item, ci))}\n                </Box>\n            );\n        });\n    };\n\n    return (\n        <KitsContainer\n            id={id}\n            label={label}\n            invalid={!!invalid}\n            hideError={hideError}\n            helperText={helperText}\n            errors={errors}\n            elementStyles={elementStyles}\n        >\n            <Box\n                borderWidth={1}\n                borderColor={borderClr}\n                borderRadius=\"$sm\"\n                height={250}\n                opacity={disabled ? 0.5 : 1}\n                style={resolvedRootStyle && Object.keys(resolvedRootStyle).length ? resolvedRootStyle : (Object.keys(resolvedThemeStyle).length ? resolvedThemeStyle : undefined)}\n            >\n                {withFilter && (\n                    <TextInput\n                        value={filterText}\n                        onChangeText={setFilterText}\n                        placeholder=\"Search...\"\n                        placeholderTextColor={placeholderColor}\n                        style={{\n                            borderBottomWidth: 1,\n                            borderBottomColor: borderClr,\n                            paddingHorizontal: 12,\n                            paddingVertical: 8,\n                            fontSize: 14,\n                            color: textColor,\n                        }}\n                    />\n                )}\n                <ScrollView>\n                    <VStack>\n                        {childrenKey\n                            ? renderGroupedItems()\n                            : filteredList.map((item: any, i: number) => renderItem(item, i))\n                        }\n                    </VStack>\n                </ScrollView>\n            </Box>\n        </KitsContainer>\n    );\n};\n\nexport default KitsListBox;\n"],"names":["useComponentDefaults","useResolvedStyle","useSelectBase","useState","resolveThemeTokenForNative","useCallback","useMemo","jsx","Pressable","Text","Box","KitsContainer","jsxs","TextInput","ScrollView","VStack"],"mappings":"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"}
+{"version":3,"file":"index.cjs","sources":["../../../../../src/form/selects/ListBox/index.native.tsx"],"sourcesContent":["import React, { useCallback, useMemo, useState } from \"react\";\nimport { ScrollView, Pressable, TextInput } from \"react-native\";\nimport { VStack, Box, Text } from '../../../_compat';\nimport type { IListBoxSelect } from \"@lmb-it/kitsconcerto-types\";\nimport { useSelectBase } from \"../hooks/useSelectBase\";\nimport KitsContainer from \"../../helpers/FormContainer\";\nimport { resolveThemeTokenForNative } from \"@lmb-it/kitsconcertomobile\";\nimport { useComponentDefaults, useResolvedStyle } from \"@lmb-it/kitsconcerto/hooks\";\n\nconst KitsListBox = (rawProps: IListBoxSelect) => {\n    const { mergedProps: props, themeStyle, elementStyles } = useComponentDefaults('ListBox', rawProps, 'Select');\n    const resolvedThemeStyle = useResolvedStyle(themeStyle);\n    const resolvedRootStyle = useResolvedStyle(elementStyles?.root || {});\n    const {\n        id,\n        label,\n        disabled,\n        invalid,\n        errors,\n        helperText,\n        inputSize = \"md\",\n        isMultiple,\n        withFilter,\n        filterBy,\n        hideError,\n    } = props;\n\n    const { list, labelKey, valueKey, childrenKey, onChange, selectedValue } = useSelectBase();\n\n    const [filterText, setFilterText] = useState(\"\");\n\n    const t = resolveThemeTokenForNative;\n    const primaryBg = t('highlight-bg') || t('primary.100') || '#E8EAF6';\n    const primaryText = t('primary.700') || '#303F9F';\n    const borderClr = invalid ? (t('danger') || '#EF4444') : (t('border') || '#D1D5DB');\n    const textColor = t('text') || '#1F2937';\n    const placeholderColor = t('text-secondary') || '#9CA3AF';\n    const groupBg = t('surface-ground') || '#F9FAFB';\n\n    const isSelected = useCallback((val: any) => {\n        if (isMultiple && Array.isArray(selectedValue)) {\n            return selectedValue.includes(val);\n        }\n        return selectedValue === val;\n    }, [isMultiple, selectedValue]);\n\n    const onSelect = useCallback((val: any, item: any) => {\n        if (isMultiple && Array.isArray(selectedValue)) {\n            const newVals = selectedValue.includes(val)\n                ? selectedValue.filter((v: any) => v !== val)\n                : [...selectedValue, val];\n            onChange({ target: { value: newVals } }, newVals);\n        } else {\n            onChange({ target: { value: val } }, item);\n        }\n    }, [isMultiple, selectedValue, onChange]);\n\n    const filteredList = useMemo(() => {\n        if (!withFilter || !filterText.trim()) return list;\n        const query = filterText.toLowerCase();\n        const searchKey = filterBy || labelKey;\n\n        if (childrenKey) {\n            return list.reduce((acc: any[], group: any) => {\n                const children = group[childrenKey];\n                if (Array.isArray(children)) {\n                    const matched = children.filter((item: any) =>\n                        String(item[searchKey] ?? \"\").toLowerCase().includes(query)\n                    );\n                    if (matched.length > 0) {\n                        acc.push({ ...group, [childrenKey]: matched });\n                    }\n                }\n                return acc;\n            }, []);\n        }\n\n        return list.filter((item: any) =>\n            String(item[searchKey] ?? \"\").toLowerCase().includes(query)\n        );\n    }, [list, filterText, withFilter, filterBy, labelKey, childrenKey]);\n\n    const renderItem = (item: any, index: number) => {\n        const val = item[valueKey];\n        const selected = isSelected(val);\n        return (\n            <Pressable\n                key={`${val}-${index}`}\n                style={{\n                    padding: 10,\n                    backgroundColor: selected ? primaryBg : 'transparent',\n                }}\n                onPress={() => !disabled && onSelect(val, item)}\n            >\n                <Text\n                    color={selected ? primaryText : textColor}\n                    fontWeight={selected ? \"bold\" : \"normal\"}\n                    size={inputSize}\n                >\n                    {item[labelKey]}\n                </Text>\n            </Pressable>\n        );\n    };\n\n    const renderGroupedItems = () => {\n        return filteredList.map((group: any, gi: number) => {\n            const children = group[childrenKey!];\n            if (!Array.isArray(children)) {\n                return renderItem(group, gi);\n            }\n            return (\n                <Box key={`group-${gi}`}>\n                    <Box style={{ backgroundColor: groupBg, paddingHorizontal: 12, paddingVertical: 8 }}>\n                        <Text fontWeight=\"600\" color={textColor} size={inputSize}>\n                            {group[labelKey]}\n                        </Text>\n                    </Box>\n                    {children.map((item: any, ci: number) => renderItem(item, ci))}\n                </Box>\n            );\n        });\n    };\n\n    return (\n        <KitsContainer\n            id={id}\n            label={label}\n            invalid={!!invalid}\n            hideError={hideError}\n            helperText={helperText}\n            errors={errors}\n            elementStyles={elementStyles}\n        >\n            <Box\n                borderWidth={1}\n                borderColor={borderClr}\n                borderRadius=\"$sm\"\n                height={250}\n                opacity={disabled ? 0.5 : 1}\n                style={resolvedRootStyle && Object.keys(resolvedRootStyle).length ? resolvedRootStyle : (Object.keys(resolvedThemeStyle).length ? resolvedThemeStyle : undefined)}\n            >\n                {withFilter && (\n                    <TextInput\n                        value={filterText}\n                        onChangeText={setFilterText}\n                        placeholder=\"Search...\"\n                        placeholderTextColor={placeholderColor}\n                        style={{\n                            borderBottomWidth: 1,\n                            borderBottomColor: borderClr,\n                            paddingHorizontal: 12,\n                            paddingVertical: 8,\n                            fontSize: 14,\n                            color: textColor,\n                        }}\n                    />\n                )}\n                <ScrollView>\n                    <VStack>\n                        {childrenKey\n                            ? renderGroupedItems()\n                            : filteredList.map((item: any, i: number) => renderItem(item, i))\n                        }\n                    </VStack>\n                </ScrollView>\n            </Box>\n        </KitsContainer>\n    );\n};\n\nexport default KitsListBox;\n"],"names":["useComponentDefaults","useResolvedStyle","useSelectBase","useState","resolveThemeTokenForNative","useCallback","useMemo","jsx","Pressable","Text","Box","KitsContainer","jsxs","TextInput","ScrollView","VStack"],"mappings":"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"}

package/form/selects/ListBox/index.js

@@ -61,6 +61,8 @@ import 'yup';
 import '../../../packages/types/src/Css/map/index.js';
 import '../../../packages/types/src/Theme/shadows.js';
 import '../../../packages/types/src/Theme/defaultTheme.js';
+import '../../../packages/types/src/Theme/alphaColors.js';
+import '../../../apps/mobile/src/Factory/helpers/cssVarMap.js';
 import 'i18next';
 import 'react-i18next';
 import '../../../apps/mobile/src/Core/AutoComplete/index.js';