@jobber/components 7.5.0 → 7.7.0

package/dist/FormField-es.js

@@ -1,242 +1,9 @@
-import React__default, { useState, useEffect, useRef, useImperativeHandle, useId } from 'react';
-import { useShowClear } from '@jobber/hooks';
-import { AnimatePresence, motion } from 'framer-motion';
-import { tokens } from '@jobber/design';
+import React__default, { useEffect, useImperativeHandle, useId, useRef } from 'react';
+import { h as formFieldStyles, m as mergeRefs, c as FormFieldWrapper, i as FormFieldPostFix, u as useAtlantisFormFieldName } from './mergeRefs-es.js';
 import classnames from 'classnames';
-import { B as Button } from './Button-es.js';
-import { I as Icon } from './Icon-es.js';
-import { T as Text } from './Text-es.js';
-import { u as useFormFieldFocus } from './useFormFieldFocus-es.js';
-import { I as InputValidation } from './InputValidation-es.js';
-import { S as Spinner } from './Spinner-es.js';
 import { _ as __rest } from './tslib.es6-es.js';
 import { useFormContext, useForm, useController } from 'react-hook-form';
 
-var formFieldStyles = {"container":"YL-mNv-Bl6g-","wrapper":"_8lhbGTQ-hhg-","disabled":"Tz9LK9ABKMk-","horizontalWrapper":"b5mv1x1H7YE-","textarea":"hGr6YW4AeLM-","safari":"QBCWi9GBgMs-","timeInputLabel":"_0pmqVa2zSE4-","miniLabel":"F1t76G6bDKo-","large":"_9tjyT9QUtP8-","text":"QmMiyoAWp-g-","invalid":"XWDSfe6weSY-","small":"Sw5O4I0lMJg-","inline":"SaORbL7SYWY-","center":"ozy2UoT2vsg-","right":"_3TJdT91YD3c-","maxLength":"W6GrMqLy2qk-","inputWrapper":"-LmjnYRU0r0-","childrenWrapper":"yVXYv6hkuOA-","input":"vtSDcuzNr9Q-","emptyPhoneNumber":"MVhuQuzUBUs-","label":"Dgk00tzlODA-","select":"NwQGiWBWIsc-","externalLabel":"Qb8zQ8n-8vc-","postfix":"yTDzs9h1otI-","affixIcon":"m0YpdssD2dY-","suffix":"_-3mMnjSh6ok-","affixLabel":"-Wzcb0pBh5I-","description":"DHX5ijY3xIw-","toolbar":"AL-2brNI7dk-","spinning":"_8Rzv7CcDW80-"};
-
-/**
- * @internal Reach out to UX Foundations if using this component since it is possible it might change
- */
-function AffixLabel({ label, variation = "prefix", labelRef, }) {
-    const affixLabelClass = classnames(formFieldStyles.affixLabel, {
-        [formFieldStyles.suffix]: variation === "suffix",
-    });
-    if (!label)
-        return null;
-    return (React__default.createElement("div", { ref: labelRef, className: affixLabelClass }, label));
-}
-function AffixIcon({ icon, onClick, ariaLabel, variation = "prefix", size, }) {
-    const affixIconClass = classnames(formFieldStyles.affixIcon, {
-        [formFieldStyles.suffix]: variation === "suffix",
-    });
-    const iconSize = size === "small" ? "small" : "base";
-    if (!icon)
-        return null;
-    return (React__default.createElement("div", { className: affixIconClass }, onClick ? (React__default.createElement(Button
-    /**
-     * We can cast the ariaLabel here as a `Suffix`
-     * requires an ariaLabel if there is an action
-     */
-    , { 
-        /**
-         * We can cast the ariaLabel here as a `Suffix`
-         * requires an ariaLabel if there is an action
-         */
-        ariaLabel: ariaLabel, icon: icon, onClick: onClick, variation: "subtle", type: "tertiary", size: iconSize })) : (React__default.createElement(Icon, { name: icon, size: iconSize, color: "greyBlue" }))));
-}
-
-function FormFieldDescription({ id, description, visible = true, }) {
-    if (!visible)
-        return null;
-    const useStringFormat = !description || typeof description === "string";
-    return (React__default.createElement("div", { id: id, className: formFieldStyles.description }, useStringFormat ? (React__default.createElement(Text, { size: "small", variation: "subdued" }, description)) : (description)));
-}
-
-var styles = {"clearInput":"YmRTd-KeXv4-","spinning":"B25z9B8I3gs-"};
-
-function ClearAction({ onClick, visible, }) {
-    if (!visible)
-        return null;
-    return (React__default.createElement("button", { className: styles.clearInput, onClick: onClick, type: "button", "aria-label": "Clear input", "data-testid": "ATL-FormField-clearButton" },
-        React__default.createElement(Icon, { name: "remove", size: "small" })));
-}
-
-function useToolbar(props) {
-    const isToolbarVisible = props.toolbar !== undefined &&
-        (props.toolbarVisibility === "always" || props.focused);
-    const toolbarAnimationEnd = { opacity: 0, height: 0 };
-    const toolbarAnimationStart = { opacity: 1, height: "auto" };
-    return {
-        isToolbarVisible,
-        toolbarAnimationEnd,
-        toolbarAnimationStart,
-    };
-}
-
-function useIsSafari() {
-    return (globalThis === null || globalThis === void 0 ? void 0 : globalThis.navigator)
-        ? /^((?!chrome|android).)*safari/i.test(navigator.userAgent)
-        : false;
-}
-
-/**
- * Hook for getting the correct styles for the FormField and its children
- */
-function useFormFieldWrapperStyles({ size, align, placeholder, value, invalid, error, max, prefixRef, suffixRef, maxLength, type, disabled, inline, showMiniLabel = true, }) {
-    const isSafari = useIsSafari();
-    const wrapperClasses = classnames(formFieldStyles.wrapper, size && formFieldStyles[size], align && formFieldStyles[align], {
-        [formFieldStyles.miniLabel]: (showMiniLabel && placeholder && value !== "") ||
-            (placeholder && type === "select") ||
-            // Naively assume that if the the type is tel, it is the InputPhoneNumber
-            (placeholder && type === "tel"),
-        [formFieldStyles.text]: type === "textarea" || type === "text",
-        [formFieldStyles.textarea]: type === "textarea",
-        [formFieldStyles.safari]: isSafari && type === "textarea",
-        [formFieldStyles.select]: type === "select",
-        [formFieldStyles.invalid]: invalid !== null && invalid !== void 0 ? invalid : error,
-        [formFieldStyles.disabled]: disabled,
-        [formFieldStyles.maxLength]: maxLength,
-        [formFieldStyles.timeInputLabel]: placeholder && type === "time" && placeholder && value === "",
-    });
-    const containerClasses = classnames(formFieldStyles.container, {
-        [formFieldStyles.inline]: inline,
-    });
-    const wrapperInlineStyle = {
-        ["--formField-maxLength"]: maxLength || max,
-    };
-    const [labelStyle, setLabelStyle] = useState({
-        paddingLeft: undefined,
-        paddingRight: undefined,
-    });
-    useEffect(() => {
-        var _a, _b;
-        setLabelStyle(getAffixPaddding({
-            value,
-            type,
-            prefixWidth: ((_a = prefixRef === null || prefixRef === void 0 ? void 0 : prefixRef.current) === null || _a === void 0 ? void 0 : _a.offsetWidth) || 0,
-            suffixWidth: ((_b = suffixRef === null || suffixRef === void 0 ? void 0 : suffixRef.current) === null || _b === void 0 ? void 0 : _b.offsetWidth) || 0,
-        }));
-    }, [value]);
-    return {
-        inputStyle: formFieldStyles.input,
-        wrapperClasses,
-        containerClasses,
-        wrapperInlineStyle,
-        labelStyle,
-        setLabelStyle,
-    };
-}
-function getAffixPaddding({ value, type, prefixWidth, suffixWidth, }) {
-    const hasValue = value !== "";
-    const newPadding = {
-        paddingLeft: undefined,
-        paddingRight: undefined,
-    };
-    // Naively assume that if the the type is tel, it is the InputPhoneNumber
-    if (type === "tel")
-        return newPadding;
-    if (prefixWidth && !hasValue) {
-        newPadding.paddingLeft = offset(prefixWidth);
-    }
-    if (suffixWidth && !hasValue) {
-        newPadding.paddingRight = offset(suffixWidth);
-    }
-    function offset(width) {
-        return `calc(${width}px + var(--space-smallest)`;
-    }
-    return newPadding;
-}
-
-function FormFieldWrapper({ align, description, descriptionIdentifier, placeholder, value, children, invalid, error, size, prefix, suffix, max, maxLength, type, disabled, inline, identifier, clearable, onClear, readonly, toolbar, toolbarVisibility = "while-editing", showMiniLabel = true, wrapperRef, }) {
-    const prefixRef = useRef(null);
-    const suffixRef = useRef(null);
-    const { wrapperClasses, containerClasses, wrapperInlineStyle, labelStyle } = useFormFieldWrapperStyles({
-        align,
-        max,
-        maxLength,
-        prefixRef,
-        suffixRef,
-        placeholder,
-        value,
-        invalid,
-        error,
-        type,
-        disabled,
-        inline,
-        size,
-        showMiniLabel,
-    });
-    const { focused } = useFormFieldFocus({ wrapperRef });
-    const showClear = useShowClear({
-        clearable,
-        multiline: type === "textarea",
-        focused,
-        hasValue: Boolean(value),
-        disabled,
-        readonly,
-    });
-    const { isToolbarVisible, toolbarAnimationEnd, toolbarAnimationStart } = useToolbar({
-        focused,
-        toolbar,
-        toolbarVisibility,
-    });
-    return (React__default.createElement("div", { className: containerClasses },
-        React__default.createElement("div", { className: wrapperClasses, style: wrapperInlineStyle, "data-testid": "Form-Field-Wrapper", ref: wrapperRef },
-            React__default.createElement(FormFieldInputHorizontalWrapper, null,
-                React__default.createElement(AffixIcon, Object.assign({}, prefix, { size: size })),
-                React__default.createElement(FormFieldInputWrapperStyles, null,
-                    (showMiniLabel || !value) && (React__default.createElement(FormFieldLabel, { htmlFor: identifier, style: (prefixRef === null || prefixRef === void 0 ? void 0 : prefixRef.current) || (suffixRef === null || suffixRef === void 0 ? void 0 : suffixRef.current)
-                            ? labelStyle
-                            : undefined }, placeholder)),
-                    React__default.createElement(AffixLabel, Object.assign({}, prefix, { labelRef: prefixRef })),
-                    React__default.createElement(FormFieldWrapperMain, null, children),
-                    React__default.createElement(AffixLabel, Object.assign({}, suffix, { labelRef: suffixRef, variation: "suffix" }))),
-                React__default.createElement(ClearAction, { onClick: onClear, visible: showClear }),
-                React__default.createElement(AffixIcon, Object.assign({}, suffix, { variation: "suffix", size: size }))),
-            React__default.createElement(FormFieldWrapperToolbar, { toolbarVisibility: toolbarVisibility, isToolbarVisible: isToolbarVisible, toolbarAnimationEnd: toolbarAnimationEnd, toolbarAnimationStart: toolbarAnimationStart, toolbar: toolbar })),
-        React__default.createElement(FormFieldDescription, { visible: !!description && !inline, id: descriptionIdentifier, description: description }),
-        React__default.createElement(InputValidation, { message: error, visible: !!error && !inline })));
-}
-/**
- * @internal Reach out to UX Foundations if using this component since it is possible it might change
- */
-function FormFieldInputHorizontalWrapper({ children, }) {
-    return React__default.createElement("div", { className: formFieldStyles.horizontalWrapper }, children);
-}
-/**
- * @internal Reach out to UX Foundations if using this component since it is possible it might change
- */
-function FormFieldInputWrapperStyles({ children, }) {
-    return React__default.createElement("div", { className: formFieldStyles.inputWrapper }, children);
-}
-/**
- * @internal Reach out to UX Foundations if using this component since it is possible it might change
- */
-function FormFieldWrapperMain({ children, tabIndex = -1, }) {
-    return (React__default.createElement("div", { className: formFieldStyles.childrenWrapper, tabIndex: tabIndex }, children));
-}
-function FormFieldLabel({ children, htmlFor, style, external = false, }) {
-    if (!children)
-        return null;
-    return (React__default.createElement("label", { className: external ? formFieldStyles.externalLabel : formFieldStyles.label, htmlFor: htmlFor, style: style }, children));
-}
-/**
- * @internal Reach out to UX Foundations if using this component since it is possible it might change
- */
-function FormFieldWrapperToolbar({ toolbar, isToolbarVisible, toolbarAnimationEnd, toolbarAnimationStart, toolbarVisibility, }) {
-    return (React__default.createElement(AnimatePresence, { initial: toolbarVisibility === "always" ? false : true }, isToolbarVisible && (React__default.createElement(motion.div, { key: "toolbar", initial: toolbarAnimationEnd, animate: toolbarAnimationStart, exit: toolbarAnimationEnd, transition: {
-            duration: tokens["timing-base"] / 1000,
-            ease: "easeInOut",
-        }, tabIndex: -1 },
-        React__default.createElement("div", { className: formFieldStyles.toolbar, "data-testid": "ATL-InputText-Toolbar" }, toolbar)))));
-}
-
-function FormFieldPostFix({ variation, visible = true, className, }) {
-    if (!visible)
-        return null;
-    return (React__default.createElement("span", { className: classnames(formFieldStyles.postfix, className) }, variation === "select" ? (React__default.createElement(Icon, { name: "arrowDown" })) : (React__default.createElement(Spinner, { size: "small" }))));
-}
-
 /**
  * Combines the actions from the props of the FormField with the actions from react-hook-form. This is used to
  * manage the form state of a field through react-hook-form while providing support for additional callbacks
@@ -309,33 +76,6 @@ function shouldAddPhoneNumberClass(type, value, pattern) {
     return type === "tel" && !value && pattern && pattern[0] === "(";
 }
 
-function useAtlantisFormFieldName({ id, nameProp, }) {
-    /**
-     * Generate a name if one is not supplied, this is the name
-     * that will be used for react-hook-form and not neccessarily
-     * attached to the DOM
-     */
-    const name = nameProp ? nameProp : `generatedName--${id}`;
-    return { name };
-}
-
-/**
- * Given an array of refs, merge them into a single ref callback.
- * This is useful for cases where you need to pass a multiple refs to a component.
- */
-function mergeRefs(refs) {
-    return value => {
-        refs.forEach(ref => {
-            if (typeof ref === "function") {
-                ref(value);
-            }
-            else if (ref != null) {
-                ref.current = value;
-            }
-        });
-    };
-}
-
 /**
  * Hook used to manage the form state of a field through react-hook-form
  */
@@ -458,4 +198,4 @@ function setAutocomplete(autocompleteSetting) {
     return autocompleteSetting;
 }
 
-export { AffixIcon as A, FormFieldInputHorizontalWrapper as F, useAtlantisFormFieldActions as a, useAtlantisFormFieldName as b, useAtlantisReactHookForm as c, FormFieldInputWrapperStyles as d, FormFieldLabel as e, FormFieldWrapper as f, FormFieldWrapperMain as g, FormFieldWrapperToolbar as h, AffixLabel as i, useFormFieldWrapperStyles as j, FormField as k, formFieldStyles as l, FormFieldPostFix as m, mergeRefs as n, useAtlantisFormField as u };
+export { FormField as F, useAtlantisFormFieldActions as a, useAtlantisReactHookForm as b, useAtlantisFormField as u };

package/dist/InputDate/InputDate.d.ts

@@ -1,3 +1,3 @@
 import React from "react";
 import type { InputDateProps } from "./InputDate.types";
-export declare function InputDate(inputProps: InputDateProps): React.JSX.Element;
+export declare const InputDate: React.ForwardRefExoticComponent<InputDateProps & React.RefAttributes<HTMLInputElement>>;

package/dist/InputDate/InputDate.types.d.ts

@@ -1,6 +1,6 @@
-import type { CommonFormFieldProps, FormFieldProps } from "../FormField";
+import type { FormFieldProps } from "../FormField";
 import type { FocusEvents, HTMLInputBaseProps, KeyboardEvents, RebuiltInputCommonProps } from "../sharedHelpers/types";
-export interface InputDateRebuiltProps extends Omit<HTMLInputBaseProps, "maxLength">, FocusEvents<HTMLInputElement | HTMLTextAreaElement>, KeyboardEvents<HTMLInputElement | HTMLTextAreaElement>, Omit<RebuiltInputCommonProps, "clearable" | "prefix" | "suffix" | "showMiniLabel"> {
+export interface InputDateProps extends Omit<HTMLInputBaseProps, "maxLength">, FocusEvents<HTMLInputElement | HTMLTextAreaElement>, KeyboardEvents<HTMLInputElement | HTMLTextAreaElement>, Omit<RebuiltInputCommonProps, "clearable" | "prefix" | "suffix" | "showMiniLabel" | "version"> {
     /**
      * A Date object value
      * (e.g., `new Date("11/11/2011")`)
@@ -34,31 +34,3 @@ export interface InputDateRebuiltProps extends Omit<HTMLInputBaseProps, "maxLeng
      */
     readonly emptyValueLabel?: string;
 }
-/**
- * @deprecated Use the v2 InputDate component instead (version={2}).
- */
-export interface InputDateProps extends Omit<CommonFormFieldProps, "clearable">, Pick<FormFieldProps, "readonly" | "disabled" | "onEnter" | "onFocus" | "inputRef" | "validations" | "placeholder" | "onChange" | "onBlur"> {
-    /**
-     * A Date object value
-     * (e.g., `new Date("11/11/2011")`)
-     * */
-    readonly value?: Date;
-    onChange(newValue: Date): void;
-    /**
-     * The maximum selectable date.
-     */
-    readonly maxDate?: Date;
-    /**
-     * The minimum selectable date.
-     */
-    readonly minDate?: Date;
-    /**
-     * Whether to show the calendar icon
-     * @default true
-     */
-    readonly showIcon?: boolean;
-    /**
-     * Text to display instead of a date value
-     */
-    readonly emptyValueLabel?: string;
-}

package/dist/InputDate/index.cjs

@@ -1,17 +1,23 @@
 'use strict';
 
-var React = require('react');
-var omit = require('../omit-cjs.js');
-var FormField = require('../FormField-cjs.js');
+var InputDate = require('../InputDate-cjs.js');
+require('react');
+require('../DatePicker-cjs.js');
 require('classnames');
-require('../tslib.es6-cjs.js');
-require('react-hook-form');
+require('../clsx-cjs.js');
+require('../floating-ui.react-cjs.js');
+require('../index.esm-cjs.js');
+require('react/jsx-runtime');
+require('react-dom');
+require('../floating-ui.react-dom-cjs.js');
 require('@jobber/hooks');
-require('framer-motion');
-require('@jobber/design');
+require('../Typography-cjs.js');
 require('../Button-cjs.js');
-var DatePicker = require('../DatePicker-cjs.js');
-var InputText_index = require('../InputText/index.cjs');
+require('../tslib.es6-cjs.js');
+require('react-router-dom');
+require('../Icon-cjs.js');
+require('@jobber/design');
+require('../omit-cjs.js');
 require('../_commonjsHelpers-cjs.js');
 require('../_getAllKeys-cjs.js');
 require('../isTypedArray-cjs.js');
@@ -23,165 +29,18 @@ require('../keysIn-cjs.js');
 require('../_baseAssignValue-cjs.js');
 require('../_baseFlatten-cjs.js');
 require('../_setToString-cjs.js');
-require('../Icon-cjs.js');
+require('../AtlantisContext-cjs.js');
+require('../InputText/index.cjs');
+require('../FormField-cjs.js');
+require('../mergeRefs-cjs.js');
+require('framer-motion');
 require('../Text-cjs.js');
-require('../Typography-cjs.js');
 require('../useFormFieldFocus-cjs.js');
 require('../InputValidation-cjs.js');
 require('../Spinner-cjs.js');
-require('react-router-dom');
-require('../clsx-cjs.js');
-require('../floating-ui.react-cjs.js');
-require('../index.esm-cjs.js');
-require('react/jsx-runtime');
-require('react-dom');
-require('../floating-ui.react-dom-cjs.js');
-require('../AtlantisContext-cjs.js');
+require('react-hook-form');
 require('../filterDataAttributes-cjs.js');
 
-// eslint-disable-next-line import/no-deprecated
-function InputDate$1(inputProps) {
-    const formFieldActionsRef = React.useRef(null);
-    return (React.createElement(DatePicker.DatePicker, { selected: inputProps.value, onChange: inputProps.onChange, disabled: inputProps.disabled, readonly: inputProps.readonly, fullWidth: !inputProps.inline, minDate: inputProps.minDate, maxDate: inputProps.maxDate, smartAutofocus: false, activator: activatorProps => {
-            const { onChange, onClick, value } = activatorProps;
-            const newActivatorProps = omit.omit(activatorProps, ["activator"]);
-            const [isFocused, setIsFocused] = React.useState(false);
-            const suffix = inputProps.showIcon !== false
-                ? {
-                    icon: "calendar",
-                    ariaLabel: "Show calendar",
-                    onClick: !inputProps.disabled && onClick && onClick,
-                }
-                : undefined;
-            // Set form field to formatted date string immediately, to avoid validations
-            //  triggering incorrectly when it blurs (to handle the datepicker UI click)
-            React.useEffect(() => {
-                var _a;
-                value && ((_a = formFieldActionsRef.current) === null || _a === void 0 ? void 0 : _a.setValue(value));
-            }, [value]);
-            const showEmptyValueLabel = !value && !isFocused;
-            return (
-            // We prevent the picker from opening on focus for keyboard navigation, so to maintain a good UX for mouse users we want to open the picker on click
-            React.createElement("div", { onClick: onClick },
-                React.createElement(FormField.FormField, Object.assign({}, newActivatorProps, inputProps, { value: showEmptyValueLabel ? inputProps.emptyValueLabel || "" : value, placeholder: inputProps.placeholder, onChange: (_, event) => {
-                        onChange && onChange(event);
-                    }, onBlur: () => {
-                        inputProps.onBlur && inputProps.onBlur();
-                        activatorProps.onBlur && activatorProps.onBlur();
-                        setIsFocused(false);
-                    }, onFocus: () => {
-                        inputProps.onFocus && inputProps.onFocus();
-                        activatorProps.onFocus && activatorProps.onFocus();
-                        setIsFocused(true);
-                    }, onKeyUp: event => {
-                        var _a;
-                        if (inputProps.showIcon === false &&
-                            event.key === "ArrowDown") {
-                            (_a = activatorProps.onClick) === null || _a === void 0 ? void 0 : _a.call(activatorProps);
-                        }
-                    }, actionsRef: formFieldActionsRef, suffix: suffix }))));
-        } }));
-}
-
-function useInputDateActivatorActions({ onChange, onBlur, onFocus, }) {
-    const [isFocused, setIsFocused] = React.useState(false);
-    function handleChange(_newValue, event) {
-        onChange === null || onChange === void 0 ? void 0 : onChange(event);
-    }
-    function handleFocus(event) {
-        onFocus === null || onFocus === void 0 ? void 0 : onFocus(event);
-        setIsFocused(true);
-    }
-    function handleBlur(event) {
-        onBlur === null || onBlur === void 0 ? void 0 : onBlur(event);
-        setIsFocused(false);
-    }
-    return {
-        handleBlur,
-        handleChange,
-        handleFocus,
-        isFocused,
-    };
-}
-
-const InputDateRebuilt = React.forwardRef((props, forwardedRef) => {
-    const { onChange } = props;
-    const isCalendarOpenRef = React.useRef(false);
-    const inputFocusedRef = React.useRef(false);
-    const compositeFocusedRef = React.useRef(false);
-    const lastBlurEventRef = React.useRef(null);
-    return (React.createElement(DatePicker.DatePicker, { selected: props.value, onChange: newValue => {
-            onChange(newValue);
-        }, disabled: props.disabled, readonly: props.readOnly, fullWidth: !props.inline, minDate: props.minDate, maxDate: props.maxDate, smartAutofocus: false, activator: InputDateActivator, onOpenChange: open => {
-            var _a;
-            isCalendarOpenRef.current = open;
-            // When calendar closes, fire onBlur if input is also not focused
-            if (!open &&
-                !inputFocusedRef.current &&
-                compositeFocusedRef.current &&
-                lastBlurEventRef.current) {
-                compositeFocusedRef.current = false;
-                (_a = props.onBlur) === null || _a === void 0 ? void 0 : _a.call(props, lastBlurEventRef.current);
-            }
-        } }));
-    function InputDateActivator(activatorProps) {
-        const { onClick, value } = activatorProps;
-        const { handleChange, handleFocus, handleBlur, isFocused } = useInputDateActivatorActions({
-            onChange: activatorProps.onChange,
-            onFocus: event => {
-                var _a, _b;
-                inputFocusedRef.current = true;
-                // Fire parent's onFocus only when the composite component first receives focus
-                if (!compositeFocusedRef.current) {
-                    compositeFocusedRef.current = true;
-                    (_a = props.onFocus) === null || _a === void 0 ? void 0 : _a.call(props, event);
-                }
-                (_b = activatorProps.onFocus) === null || _b === void 0 ? void 0 : _b.call(activatorProps);
-            },
-            onBlur: event => {
-                var _a, _b;
-                inputFocusedRef.current = false;
-                lastBlurEventRef.current = event;
-                // Only fire parent's onBlur if calendar is also closed
-                if (!isCalendarOpenRef.current && compositeFocusedRef.current) {
-                    compositeFocusedRef.current = false;
-                    (_a = props.onBlur) === null || _a === void 0 ? void 0 : _a.call(props, event);
-                }
-                (_b = activatorProps.onBlur) === null || _b === void 0 ? void 0 : _b.call(activatorProps);
-            },
-        });
-        const suffix = props.showIcon !== false
-            ? {
-                icon: "calendar",
-                ariaLabel: "Show calendar",
-                onClick: !props.disabled && onClick && onClick,
-            }
-            : undefined;
-        const showEmptyValueLabel = !value && !isFocused;
-        return (
-        // We prevent the picker from opening on focus for keyboard navigation, so to maintain a good UX for mouse users we want to open the picker on click
-        React.createElement("div", { onClick: onClick },
-            React.createElement(InputText_index.InputText, { "aria-describedby": activatorProps.ariaDescribedBy, "aria-labelledby": activatorProps.ariaLabelledBy, "aria-required": activatorProps.ariaRequired === "true" ? true : false, autoFocus: props.autoFocus, id: activatorProps.id, autoComplete: props.autoComplete, disabled: props.disabled, error: props.error, readOnly: props.readOnly, placeholder: props.placeholder, size: props.size, inline: props.inline, align: props.align, description: props.description, invalid: props.invalid, required: props.required, name: props.name, version: 2, value: showEmptyValueLabel ? props.emptyValueLabel || "" : value || "", ref: forwardedRef, suffix: suffix, onFocus: handleFocus, onBlur: handleBlur, onKeyDown: event => {
-                    var _a, _b;
-                    if (props.showIcon === false && event.key === "ArrowDown") {
-                        (_a = activatorProps.onClick) === null || _a === void 0 ? void 0 : _a.call(activatorProps);
-                    }
-                    (_b = props.onKeyDown) === null || _b === void 0 ? void 0 : _b.call(props, event);
-                }, onChange: handleChange })));
-    }
-});
-InputDateRebuilt.displayName = "InputDateRebuilt";
 
-function isNewInputDateProps(props) {
-    return props.version === 2;
-}
-const InputDate = React.forwardRef(function InputDateShim(props, ref) {
-    if (isNewInputDateProps(props)) {
-        return React.createElement(InputDateRebuilt, Object.assign({}, props, { ref: ref }));
-    }
-    else {
-        return React.createElement(InputDate$1, Object.assign({}, props));
-    }
-});
 
-exports.InputDate = InputDate;
+exports.InputDate = InputDate.InputDate;

package/dist/InputDate/index.d.ts

@@ -1,4 +1,2 @@
-import React from "react";
-import type { InputDateProps as InputDateLegacyProps, InputDateRebuiltProps } from "./InputDate.types";
-export type InputDateProps = InputDateLegacyProps | InputDateRebuiltProps;
-export declare const InputDate: React.ForwardRefExoticComponent<InputDateProps & React.RefAttributes<HTMLInputElement>>;
+export type { InputDateProps } from "./InputDate.types";
+export { InputDate } from "./InputDate";