@trackunit/react-form-components 0.0.67 → 0.0.76

package/src/components/RadioGroup/RadioItem.d.ts

@@ -1,23 +1,23 @@
-import { CommonProps } from "@trackunit/react-components";
-import * as React from "react";
-export interface RadioItemProps<V extends string | number = string> extends CommonProps {
-    /**
-     * The label of the radio item.
-     */
-    label: React.ReactNode;
-    /**
-     * The value of the radio item.
-     */
-    value: V;
-    /**
-     * The description of the radio item.
-     */
-    description?: string;
-}
-/**
- * The RadioItem component.
- *
- * @param {RadioItemProps} props - The props for the RadioItem component
- * @returns {JSX.Element} RadioItem component
- */
-export declare const RadioItem: <V extends string | number>({ label, value, dataTestId, className, description, }: RadioItemProps<V>) => JSX.Element;
+import { CommonProps } from "@trackunit/react-components";
+import * as React from "react";
+export interface RadioItemProps<V extends string | number = string> extends CommonProps {
+    /**
+     * The label of the radio item.
+     */
+    label: React.ReactNode;
+    /**
+     * The value of the radio item.
+     */
+    value: V;
+    /**
+     * The description of the radio item.
+     */
+    description?: string;
+}
+/**
+ * The RadioItem component.
+ *
+ * @param {RadioItemProps} props - The props for the RadioItem component
+ * @returns {JSX.Element} RadioItem component
+ */
+export declare const RadioItem: <V extends string | number>({ label, value, dataTestId, className, description, }: RadioItemProps<V>) => JSX.Element;

package/src/components/RadioGroup/index.d.ts

@@ -1,2 +1,2 @@
-export * from "./RadioGroup";
-export * from "./RadioItem";
+export * from "./RadioGroup";
+export * from "./RadioItem";

package/src/components/Schedule/Schedule.d.ts

@@ -1,37 +1,49 @@
-/// <reference types="react" />
-import { CommonProps } from "@trackunit/react-components";
-import { TimeRangeInput } from "../TimeRange";
-export interface ScheduleItem {
-    /**
-     * The label for the schedule item.
-     */
-    label: string;
-    /**
-     * The time range input for the schedule item.
-     */
-    range: TimeRangeInput;
-    /**
-     * Indicates whether the schedule item is active.
-     */
-    isActive: boolean;
-}
-export interface ScheduleProps extends CommonProps {
-    /**
-     * List of schedule rows.
-     */
-    schedule: ScheduleItem[];
-    /**
-     * Called when time range or checkbox changes state.
-     *
-     * @param {ScheduleItem[]} schedules Updated schedule entries
-     * @returns {void}
-     */
-    onChange: (schedules: ScheduleItem[]) => void;
-}
-/**
- * Schedule is used to create a time range entries.
- *
- * @param {ScheduleProps} props - The props for the Schedule component
- * @returns {JSX.Element} Schedule component
- */
-export declare const Schedule: ({ className, dataTestId, schedule, onChange }: ScheduleProps) => JSX.Element;
+/// <reference types="react" />
+import { CommonProps } from "@trackunit/react-components";
+import { TimeRangeInput } from "../TimeRange";
+export interface ScheduleItem {
+    /**
+     * The key for the schedule item.
+     */
+    key?: string;
+    /**
+     * The label for the schedule item.
+     */
+    label: string;
+    /**
+     * The time range input for the schedule item.
+     */
+    range: TimeRangeInput;
+    /**
+     * Indicates whether the schedule item is active.
+     */
+    isActive: boolean;
+    /**
+     * Checkbox text
+     */
+    checkboxLabel?: string;
+}
+export interface ScheduleProps extends CommonProps {
+    /**
+     * List of schedule rows.
+     */
+    schedule: ScheduleItem[];
+    /**
+     * List of invalid keys.
+     */
+    invalidKeys?: string[];
+    /**
+     * Called when time range or checkbox changes state.
+     *
+     * @param {ScheduleItem[]} schedules Updated schedule entries
+     * @returns {void}
+     */
+    onChange: (schedules: ScheduleItem[]) => void;
+}
+/**
+ * Schedule is used to create a time range entries.
+ *
+ * @param {ScheduleProps} props - The props for the Schedule component
+ * @returns {JSX.Element} Schedule component
+ */
+export declare const Schedule: ({ className, dataTestId, schedule, onChange, invalidKeys }: ScheduleProps) => JSX.Element;

package/src/components/Schedule/Schedule.variants.d.ts

@@ -1,2 +1,2 @@
-export declare const cvaScheduleItem: (props?: import("class-variance-authority/dist/types").ClassProp | undefined) => string;
-export declare const cvaScheduleItemText: (props?: import("class-variance-authority/dist/types").ClassProp | undefined) => string;
+export declare const cvaScheduleItem: (props?: import("class-variance-authority/dist/types").ClassProp | undefined) => string;
+export declare const cvaScheduleItemText: (props?: import("class-variance-authority/dist/types").ClassProp | undefined) => string;

package/src/components/Search/Search.d.ts

@@ -1,62 +1,62 @@
-import { CommonProps } from "@trackunit/react-components";
-import * as React from "react";
-import { TextInputProps } from "../TextInput/TextInput";
-export interface SearchProps extends CommonProps, TextInputProps {
-    /**
-     * The name for the HTML element.
-     */
-    name?: string;
-    /**
-     * Placeholder string to be shown in the search box.
-     */
-    placeholder?: string;
-    /**
-     * Whether the search box should widen to take up full width while in focus or not.
-     * If disabled, the search box takes up full width when not in focus.
-     */
-    widenInputOnFocus?: boolean;
-    /**
-     * Whether the border for the search box should be displayed while the search box is not in focus.
-     */
-    showBorderWhenNotInFocus?: boolean;
-    /**
-     * Value rendered in the search box.
-     */
-    value?: string;
-    /**
-     * Whether the search box is disabled or not.
-     */
-    disabled?: boolean;
-    /**
-     * Specify what if any permission the user agent has to provide automated assistance in filling out search values.
-     */
-    autoComplete?: string;
-    /**
-     * Event that occurs when the user releases a key.
-     */
-    onKeyUp?: (evt: React.KeyboardEvent<HTMLInputElement>) => void;
-    /**
-     * Event that occurs when there is a change.
-     */
-    onChange?: (evt: React.ChangeEvent<HTMLInputElement>) => void;
-    /**
-     * Event that occurs when the search box is on focus.
-     */
-    onFocus?: (evt: React.FocusEvent<HTMLInputElement>) => void;
-    /**
-     * Event that occurs when search box is blurred.
-     */
-    onBlur?: (evt: React.FocusEvent<HTMLInputElement>) => void;
-    /**
-     * Event that search box is cleared.
-     */
-    onClear?: () => void;
-    ref?: React.Ref<HTMLInputElement | undefined>;
-}
-/**
- * The Search component is used to render a search input field.
- *
- * @param {SearchProps} props - The props for the Search component
- * @returns {JSX.Element} Search component
- */
-export declare const Search: ({ className, placeholder, value, widenInputOnFocus, showBorderWhenNotInFocus, disabled, onKeyUp, onChange, onFocus, onBlur, name, onClear, dataTestId, autoComplete, ref, ...rest }: SearchProps) => JSX.Element;
+import { CommonProps } from "@trackunit/react-components";
+import * as React from "react";
+import { TextInputProps } from "../TextInput/TextInput";
+export interface SearchProps extends CommonProps, TextInputProps {
+    /**
+     * The name for the HTML element.
+     */
+    name?: string;
+    /**
+     * Placeholder string to be shown in the search box.
+     */
+    placeholder?: string;
+    /**
+     * Whether the search box should widen to take up full width while in focus or not.
+     * If disabled, the search box takes up full width when not in focus.
+     */
+    widenInputOnFocus?: boolean;
+    /**
+     * Whether the border for the search box should be displayed while the search box is not in focus.
+     */
+    showBorderWhenNotInFocus?: boolean;
+    /**
+     * Value rendered in the search box.
+     */
+    value?: string;
+    /**
+     * Whether the search box is disabled or not.
+     */
+    disabled?: boolean;
+    /**
+     * Specify what if any permission the user agent has to provide automated assistance in filling out search values.
+     */
+    autoComplete?: string;
+    /**
+     * Event that occurs when the user releases a key.
+     */
+    onKeyUp?: (evt: React.KeyboardEvent<HTMLInputElement>) => void;
+    /**
+     * Event that occurs when there is a change.
+     */
+    onChange?: (evt: React.ChangeEvent<HTMLInputElement>) => void;
+    /**
+     * Event that occurs when the search box is on focus.
+     */
+    onFocus?: (evt: React.FocusEvent<HTMLInputElement>) => void;
+    /**
+     * Event that occurs when search box is blurred.
+     */
+    onBlur?: (evt: React.FocusEvent<HTMLInputElement>) => void;
+    /**
+     * Event that search box is cleared.
+     */
+    onClear?: () => void;
+    ref?: React.Ref<HTMLInputElement | undefined>;
+}
+/**
+ * The Search component is used to render a search input field.
+ *
+ * @param {SearchProps} props - The props for the Search component
+ * @returns {JSX.Element} Search component
+ */
+export declare const Search: ({ className, placeholder, value, widenInputOnFocus, showBorderWhenNotInFocus, disabled, onKeyUp, onChange, onFocus, onBlur, name, onClear, dataTestId, autoComplete, ref, ...rest }: SearchProps) => JSX.Element;

package/src/components/Search/index.d.ts

@@ -1 +1 @@
-export * from "./Search";
+export * from "./Search";

package/src/components/Select/CreatableSelect.d.ts

@@ -1,38 +1,38 @@
-import React from "react";
-import { GroupBase } from "react-select";
-import { SelectProps } from "./useSelect";
-interface CreateableSelectProps<Option, IsAsync extends boolean = false, IsMulti extends boolean = false, Group extends GroupBase<Option> = GroupBase<Option>> extends SelectProps<Option, IsAsync, IsMulti, Group> {
-    /**
-     * To hide the label.
-     */
-    hideLabel?: boolean;
-    /**
-     * Description for the select component.
-     */
-    description?: string;
-    /**
-     * Whether the component is invalid.
-     */
-    isInvalid?: boolean;
-    /**
-     * Info of the select component.
-     */
-    info?: React.ReactNode;
-    /**
-     * Error of the select component.
-     */
-    error?: React.ReactNode;
-    /**
-     * Size of the component.
-     */
-    size?: SelectSize;
-}
-export type SelectSize = "small" | "default";
-/**
- * The CreatableSelect component.
- *
- * @param {CreateableSelectProps} props - The props for the CreatableSelect component
- * @returns {JSX.Element} CreatableSelect component
- */
-export declare const CreatableSelect: <Option, IsAsync extends boolean = false, IsMulti extends boolean = false, Group extends GroupBase<Option> = GroupBase<Option>>(props: CreateableSelectProps<Option, IsAsync, IsMulti, Group>) => JSX.Element;
-export {};
+import React from "react";
+import { GroupBase } from "react-select";
+import { SelectProps } from "./useSelect";
+interface CreateableSelectProps<Option, IsAsync extends boolean = false, IsMulti extends boolean = false, Group extends GroupBase<Option> = GroupBase<Option>> extends SelectProps<Option, IsAsync, IsMulti, Group> {
+    /**
+     * To hide the label.
+     */
+    hideLabel?: boolean;
+    /**
+     * Description for the select component.
+     */
+    description?: string;
+    /**
+     * Whether the component is invalid.
+     */
+    isInvalid?: boolean;
+    /**
+     * Info of the select component.
+     */
+    info?: React.ReactNode;
+    /**
+     * Error of the select component.
+     */
+    error?: React.ReactNode;
+    /**
+     * Size of the component.
+     */
+    size?: SelectSize;
+}
+export type SelectSize = "small" | "default";
+/**
+ * The CreatableSelect component.
+ *
+ * @param {CreateableSelectProps} props - The props for the CreatableSelect component
+ * @returns {JSX.Element} CreatableSelect component
+ */
+export declare const CreatableSelect: <Option, IsAsync extends boolean = false, IsMulti extends boolean = false, Group extends GroupBase<Option> = GroupBase<Option>>(props: CreateableSelectProps<Option, IsAsync, IsMulti, Group>) => JSX.Element;
+export {};

package/src/components/Select/FieldContainer.d.ts

@@ -1,20 +1,20 @@
-import * as React from "react";
-export interface SelectContainerProps {
-    children: React.ReactElement;
-    label?: string;
-    hideLabel?: boolean;
-    hasError?: boolean;
-    id?: string;
-    description?: string;
-    error?: React.ReactNode;
-    info?: React.ReactNode;
-    dataTestId?: string;
-    isDisabled?: boolean;
-}
-/**
- * The SelectContainer component.
- *
- * @param {SelectContainerProps} props - The props for the SelectContainer component
- * @returns {JSX.Element} SelectContainer component
- */
-export declare const SelectContainer: ({ children, label, hideLabel, id, hasError, error, description, info, dataTestId, isDisabled, }: SelectContainerProps) => JSX.Element;
+import * as React from "react";
+export interface SelectContainerProps {
+    children: React.ReactElement;
+    label?: string;
+    hideLabel?: boolean;
+    hasError?: boolean;
+    id?: string;
+    description?: string;
+    error?: React.ReactNode;
+    info?: React.ReactNode;
+    dataTestId?: string;
+    isDisabled?: boolean;
+}
+/**
+ * The SelectContainer component.
+ *
+ * @param {SelectContainerProps} props - The props for the SelectContainer component
+ * @returns {JSX.Element} SelectContainer component
+ */
+export declare const SelectContainer: ({ children, label, hideLabel, id, hasError, error, description, info, dataTestId, isDisabled, }: SelectContainerProps) => JSX.Element;

package/src/components/Select/Select.d.ts

@@ -1,18 +1,18 @@
-/// <reference types="react" />
-import { GroupBase } from "react-select";
-import { SelectProps } from "./useSelect";
-export interface SelectOption<T extends string> {
-    label: string;
-    value: T;
-    disabled?: boolean;
-}
-/**
- * Selects are input components used to choose a value from a set.
- *
- * @param {SelectProps} props - The props for the Select component
- * @returns {JSX.Element} Select component
- */
-export declare const Select: {
-    <Option, IsAsync extends boolean = false, IsMulti extends boolean = false, Group extends GroupBase<Option> = GroupBase<Option>>(props: SelectProps<Option, IsAsync, IsMulti, Group>): JSX.Element;
-    displayName: string;
-};
+/// <reference types="react" />
+import { GroupBase } from "react-select";
+import { SelectProps } from "./useSelect";
+export interface SelectOption<T extends string> {
+    label: string;
+    value: T;
+    disabled?: boolean;
+}
+/**
+ * Selects are input components used to choose a value from a set.
+ *
+ * @param {SelectProps} props - The props for the Select component
+ * @returns {JSX.Element} Select component
+ */
+export declare const Select: {
+    <Option, IsAsync extends boolean = false, IsMulti extends boolean = false, Group extends GroupBase<Option> = GroupBase<Option>>(props: SelectProps<Option, IsAsync, IsMulti, Group>): JSX.Element;
+    displayName: string;
+};

package/src/components/Select/SelectMenuItem/SelectMenuItem.d.ts

@@ -1,49 +1,49 @@
-import { CommonProps } from "@trackunit/react-components";
-import * as React from "react";
-interface SelectMenuItemProps extends CommonProps {
-    /**
-     * An string to render as a item label.
-     *
-     */
-    label: string;
-    /**
-     * An handler for click on element
-     */
-    onClick?: React.MouseEventHandler<HTMLDivElement>;
-    /**
-     * A boolean prop to set menu item to selected state
-     */
-    selected?: boolean;
-    /**
-     * A boolean prop to set menu item to focused state
-     * used for keyboard navigation
-     */
-    focused?: boolean;
-    /**
-     * A boolean prop to set menu item to disabled state
-     * used in disabled select options
-     */
-    disabled?: boolean;
-}
-export interface SingleSelectMenuItemProps extends SelectMenuItemProps {
-    /**
-     * An React element to render before the text in the select.
-     * This is typically used to render an icon.
-     */
-    icon?: JSX.Element;
-}
-/**
- * A single select menu item is a basic wrapper around Menu item designed to be used as a single value render in Select list
- *
- * @param {SelectMenuItemProps} props - The props for the SingleSelectMenuItem
- * @returns {JSX.Element} SingleSelectMenuItem
- */
-export declare const SingleSelectMenuItem: ({ label, icon, onClick, selected, dataTestId, focused, disabled, }: SingleSelectMenuItemProps) => JSX.Element;
-/**
- * A multi select menu item is a basic wrapper around Menu item designed to be used as a multi value render in Select list
- *
- * @param {SelectMenuItemProps} props - The props for the MultiSelectMenuItem
- * @returns {JSX.Element} multi select menu item
- */
-export declare const MultiSelectMenuItem: ({ label, onClick, selected, dataTestId, focused, disabled, }: SelectMenuItemProps) => JSX.Element;
-export {};
+import { CommonProps } from "@trackunit/react-components";
+import * as React from "react";
+interface SelectMenuItemProps extends CommonProps {
+    /**
+     * An string to render as a item label.
+     *
+     */
+    label: string;
+    /**
+     * An handler for click on element
+     */
+    onClick?: React.MouseEventHandler<HTMLDivElement>;
+    /**
+     * A boolean prop to set menu item to selected state
+     */
+    selected?: boolean;
+    /**
+     * A boolean prop to set menu item to focused state
+     * used for keyboard navigation
+     */
+    focused?: boolean;
+    /**
+     * A boolean prop to set menu item to disabled state
+     * used in disabled select options
+     */
+    disabled?: boolean;
+}
+export interface SingleSelectMenuItemProps extends SelectMenuItemProps {
+    /**
+     * An React element to render before the text in the select.
+     * This is typically used to render an icon.
+     */
+    icon?: JSX.Element;
+}
+/**
+ * A single select menu item is a basic wrapper around Menu item designed to be used as a single value render in Select list
+ *
+ * @param {SelectMenuItemProps} props - The props for the SingleSelectMenuItem
+ * @returns {JSX.Element} SingleSelectMenuItem
+ */
+export declare const SingleSelectMenuItem: ({ label, icon, onClick, selected, dataTestId, focused, disabled, }: SingleSelectMenuItemProps) => JSX.Element;
+/**
+ * A multi select menu item is a basic wrapper around Menu item designed to be used as a multi value render in Select list
+ *
+ * @param {SelectMenuItemProps} props - The props for the MultiSelectMenuItem
+ * @returns {JSX.Element} multi select menu item
+ */
+export declare const MultiSelectMenuItem: ({ label, onClick, selected, dataTestId, focused, disabled, }: SelectMenuItemProps) => JSX.Element;
+export {};

package/src/components/Select/TagWithWidth.d.ts

@@ -1,17 +1,17 @@
-/// <reference types="react" />
-import { TagProps } from "@trackunit/react-components";
-type TagsPropsNoRef = Omit<TagProps, "ref">;
-interface TagWithWidthProps extends TagsPropsNoRef {
-    onWidthKnown?: ({ width }: {
-        width: number;
-    }) => void;
-}
-/**
- * Extended Tag component with information about its own width.
- * Used in the select component.
- *
- * @param {TagProps} props - The props for the tag component
- * @returns {JSX.Element} TagWithWidth component
- */
-export declare const TagWithWidth: ({ onWidthKnown, children, ...rest }: TagWithWidthProps) => JSX.Element;
-export {};
+/// <reference types="react" />
+import { TagProps } from "@trackunit/react-components";
+type TagsPropsNoRef = Omit<TagProps, "ref">;
+interface TagWithWidthProps extends TagsPropsNoRef {
+    onWidthKnown?: ({ width }: {
+        width: number;
+    }) => void;
+}
+/**
+ * Extended Tag component with information about its own width.
+ * Used in the select component.
+ *
+ * @param {TagProps} props - The props for the tag component
+ * @returns {JSX.Element} TagWithWidth component
+ */
+export declare const TagWithWidth: ({ onWidthKnown, children, ...rest }: TagWithWidthProps) => JSX.Element;
+export {};

package/src/components/Select/TagsContainer.d.ts

@@ -1,45 +1,45 @@
-/// <reference types="react" />
-interface TagsContainerItem {
-    /**
-     * A text value to be passed to tags inside container
-     */
-    text: string;
-    /**
-     * OnClick handler for a tags
-     */
-    onClick: () => void;
-    /**
-     * A flag to set tags to readonly mode (without close button)
-     */
-    disabled: boolean;
-}
-interface TagsContainerProps {
-    /**
-     * An items to be rendered inside container if they fit available space. If they overlap then the counter will be displayed.
-     */
-    items: TagsContainerItem[];
-    /**
-     * An css property to set a custom width for container
-     * Default behavior is to take 100% width of parent element
-     * You can provide a value with unit (pixels, percents, rem, etc)
-     *
-     * @memberof TagsContainerProps
-     */
-    width?: string;
-    /**
-     * In case you have a gap between items then you can provide it to be used in calculation of available space,
-     * default value is 5, so if you don't need it then provide 0
-     *
-     * @memberof TagsContainerProps
-     */
-    itemsGap?: number;
-    postFix: JSX.Element;
-}
-/**
- * TagsContainer component to display tags in limited space when children can't fit space it displays counter
- *
- * @param {TagsContainerProps} props - The props for the TagContainer
- * @returns {JSX.Element} TagsContainer
- */
-export declare const TagsContainer: ({ items, width, itemsGap, postFix }: TagsContainerProps) => JSX.Element;
-export {};
+/// <reference types="react" />
+interface TagsContainerItem {
+    /**
+     * A text value to be passed to tags inside container
+     */
+    text: string;
+    /**
+     * OnClick handler for a tags
+     */
+    onClick: () => void;
+    /**
+     * A flag to set tags to readonly mode (without close button)
+     */
+    disabled: boolean;
+}
+interface TagsContainerProps {
+    /**
+     * An items to be rendered inside container if they fit available space. If they overlap then the counter will be displayed.
+     */
+    items: TagsContainerItem[];
+    /**
+     * An css property to set a custom width for container
+     * Default behavior is to take 100% width of parent element
+     * You can provide a value with unit (pixels, percents, rem, etc)
+     *
+     * @memberof TagsContainerProps
+     */
+    width?: string;
+    /**
+     * In case you have a gap between items then you can provide it to be used in calculation of available space,
+     * default value is 5, so if you don't need it then provide 0
+     *
+     * @memberof TagsContainerProps
+     */
+    itemsGap?: number;
+    postFix: JSX.Element;
+}
+/**
+ * TagsContainer component to display tags in limited space when children can't fit space it displays counter
+ *
+ * @param {TagsContainerProps} props - The props for the TagContainer
+ * @returns {JSX.Element} TagsContainer
+ */
+export declare const TagsContainer: ({ items, width, itemsGap, postFix }: TagsContainerProps) => JSX.Element;
+export {};