@payfit/unity-components
Version:
129 lines (128 loc) • 4.2 kB
TypeScript
import { TaskProps } from './RawTask.js';
export declare const rawSubTask: import('tailwind-variants').TVReturnType<{
[key: string]: {
[key: string]: import('tailwind-merge').ClassNameValue | {
number?: import('tailwind-merge').ClassNameValue;
text?: import('tailwind-merge').ClassNameValue;
base?: import('tailwind-merge').ClassNameValue;
dot?: import('tailwind-merge').ClassNameValue;
element?: import('tailwind-merge').ClassNameValue;
};
};
} | {
taskStatus: {
uncompleted: import('tailwind-merge').ClassNameValue | {
number?: import('tailwind-merge').ClassNameValue;
text?: import('tailwind-merge').ClassNameValue;
base?: import('tailwind-merge').ClassNameValue;
dot?: import('tailwind-merge').ClassNameValue;
element?: import('tailwind-merge').ClassNameValue;
};
completed: import('tailwind-merge').ClassNameValue | {
number?: import('tailwind-merge').ClassNameValue;
text?: import('tailwind-merge').ClassNameValue;
base?: import('tailwind-merge').ClassNameValue;
dot?: import('tailwind-merge').ClassNameValue;
element?: import('tailwind-merge').ClassNameValue;
};
locked: import('tailwind-merge').ClassNameValue | {
number?: import('tailwind-merge').ClassNameValue;
text?: import('tailwind-merge').ClassNameValue;
base?: import('tailwind-merge').ClassNameValue;
dot?: import('tailwind-merge').ClassNameValue;
element?: import('tailwind-merge').ClassNameValue;
};
};
}, {
base: string[];
dot: string[];
text: string[];
element: string[];
number: string[];
}, undefined, {
taskStatus: {
uncompleted: string;
completed: string;
locked: string;
};
}, {
base: string[];
number: string[];
element: string[];
text: string[];
lock: string[];
}, import('tailwind-variants').TVReturnType<{
taskStatus: {
uncompleted: string;
completed: string;
locked: string;
};
}, {
base: string[];
number: string[];
element: string[];
text: string[];
lock: string[];
}, undefined, {
taskStatus: {
uncompleted: string;
completed: string;
locked: string;
};
}, {
base: string[];
number: string[];
element: string[];
text: string[];
lock: string[];
}, import('tailwind-variants').TVReturnType<{
taskStatus: {
uncompleted: string;
completed: string;
locked: string;
};
}, {
base: string[];
number: string[];
element: string[];
text: string[];
lock: string[];
}, undefined, unknown, unknown, undefined>>>;
export interface SubTaskProps extends Omit<TaskProps, 'taskNumber'> {
/** internal prop to disable the button, do not use this prop */
isDisabled?: boolean;
}
/**
* The `SubTask` component represents an individual subtask item within a TaskGroup that can be either a link or button.
* It supports various visual states including completed, uncompleted, locked.
* The component adapts its behavior based on whether an href is provided and displays
* a dot indicator instead of a numbered badge to distinguish it from main Task components.
*
* ```tsx
* // Link-based subtask for navigation within a task group
* <RawSubTask
* uniqueId="profile-setup"
* label="Complete Profile Information"
* taskStatus="uncompleted"
* href="/onboarding/profile"
* />
*
* // Button-based subtask for custom interactions
* <RawSubTask
* uniqueId="validate-email"
* label="Validate Email Address"
* taskStatus="completed"
* onPress={() => handleEmailValidation()}
* />
*
* // Locked subtask that cannot be interacted with
* <RawSubTask
* uniqueId="final-approval"
* label="Manager Approval"
* taskStatus="locked"
* />
* ```
* @see {@link SubTaskProps} for all available props
*/
declare const RawSubTask: import('react').ForwardRefExoticComponent<SubTaskProps & import('react').RefAttributes<HTMLLIElement>>;
export { RawSubTask };