@navinc/base-react-components/dist/wayfinder/input/index.js

Nav's Pattern Library

var __rest = (this && this.__rest) || function (s, e) {
    var t = {};
    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
        t[p] = s[p];
    if (s != null && typeof Object.getOwnPropertySymbols === "function")
        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
                t[p[i]] = s[p[i]];
        }
    return t;
};
import { jsx as _jsx } from "react/jsx-runtime";
import { forwardRef } from 'react';
import { InputWrapper } from '../input-components/index.js';
import { BasePatternInput } from '../../base-input/base-pattern-input/base-pattern-input.js';
import { BasePhoneNumberInput } from '../../base-input/base-phone-number-input/base-phone-number-input.js';
import { BaseStringInput } from '../../base-input/base-string-input/base-string-input.js';
import { BaseZipCodeExtendedInput, BaseZipCodeInput } from '../../base-input/base-zip-code-input/base-zip-code-input.js';
import { BaseIntegerInput } from '../../base-input/base-integer-input/base-integer-input.js';
import { BaseAddressTypeahead } from '../../base-input/base-address-typeahead/base-address-typeahead.js';
import { BaseUSDInput } from '../../base-input/base-usd-input/base-usd-input.js';
import { BaseDateInput } from '../../base-input/base-date-input/base-date-input.js';
import { cva } from 'class-variance-authority';
import { cn } from '../../cn.js';
export const baseInputVariantsConfig = {
    variants: {
        disabled: {
            false: 'bg-surface',
            true: 'bg-surfaceDim',
        },
        hasValue: {
            true: '',
        },
        hasError: {
            true: '!border-error',
            false: 'border-outlineVariant',
        },
    },
    compoundVariants: [
        {
            disabled: true,
            hasValue: true,
            class: 'text-onSurfaceVariant',
        },
    ],
};
export const inputVariants = cva('body1 w-full p-150 rounded-200 text-onSurface border border-solid hover:enabled:border-outline active:enabled:border-primary focus:enabled:border-primary placeholder:text-onSurfaceDim', baseInputVariantsConfig);
export const withInputStyles = (Component) => forwardRef((_a, ref) => {
    var { $error } = _a, props = __rest(_a, ["$error"]);
    return (_jsx(Component, Object.assign({ ref: ref }, props, { className: cn(inputVariants({
            disabled: props.disabled,
            hasValue: !!props.value,
            hasError: !!$error,
            className: props.className,
        })) })));
});
export const withInputWrapper = (Component) => forwardRef((_a, ref) => {
    var { error, label, optional, required, helperText, className, 'data-testid': dataTestId } = _a, props = __rest(_a, ["error", "label", "optional", "required", "helperText", "className", 'data-testid']);
    return (_jsx(InputWrapper, { label,
        optional,
        required,
        errorText: error,
        helperText,
        className,
        'data-testid': dataTestId, children: _jsx(Component, Object.assign({ ref: ref, "$error": error }, props)) }));
});
const BaseTextarea = (props) => (_jsx("textarea", Object.assign({}, props)));
export const StringInput = withInputStyles(BaseStringInput);
export const PatternInput = withInputStyles(BasePatternInput);
export const PhoneNumberInput = withInputStyles(BasePhoneNumberInput);
export const ZipCodeInput = withInputStyles(BaseZipCodeInput);
export const ZipCodeExtendedInput = withInputStyles(BaseZipCodeExtendedInput);
export const IntegerInput = withInputStyles(BaseIntegerInput);
export const AddressTypeahead = withInputStyles(BaseAddressTypeahead);
export const USDInput = withInputStyles(BaseUSDInput);
export const DateInput = withInputStyles(BaseDateInput);
export const TextareaInput = withInputStyles(BaseTextarea);
export const StringField = withInputWrapper(StringInput);
export const PatternField = withInputWrapper(PatternInput);
export const PhoneNumberField = withInputWrapper(PhoneNumberInput);
export const ZipCodeField = withInputWrapper(ZipCodeInput);
export const ZipCodeExtendedField = withInputWrapper(ZipCodeExtendedInput);
export const IntegerField = withInputWrapper(IntegerInput);
export const AddressTypeaheadField = withInputWrapper(AddressTypeahead);
export const USDField = withInputWrapper(USDInput);
export const DateField = withInputWrapper(DateInput);
export const TextareaField = withInputWrapper(TextareaInput);
//# sourceMappingURL=index.js.map