@grasp-labs/ds-react-components 0.19.0 → 0.21.0

package/dist/components/datePicker/index.d.ts

@@ -1,2 +1,2 @@
-export { DatePicker } from './datePicker';
-export type { DatePickerProps } from './datePicker';
+export { DatePicker } from './DatePicker';
+export type { DatePickerProps } from './DatePicker';

package/dist/components/passwordTextBox/PasswordTextBox.d.ts

@@ -0,0 +1,15 @@
+import { BaseTextBoxProps } from '../baseTextBox';
+export type PasswordTextBoxProps = Omit<BaseTextBoxProps, "type"> & {
+    /** Tooltip text shown when password is hidden (hovering over the show button) */
+    showPasswordLabel?: string;
+    /** Tooltip text shown when password is visible (hovering over the hide button) */
+    hidePasswordLabel?: string;
+};
+/**
+ * A password input field with visibility toggle button.
+ * Extends TextBox with eye icon to show/hide password and optional tooltip.
+ *
+ * @param props - The props for the PasswordTextBox component.
+ * @returns The rendered password input with toggle button.
+ */
+export declare const PasswordTextBox: ({ showPasswordLabel, hidePasswordLabel, disabled, ...props }: PasswordTextBoxProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/passwordTextBox/index.d.ts

@@ -0,0 +1,2 @@
+export { PasswordTextBox } from './PasswordTextBox';
+export type { PasswordTextBoxProps } from './PasswordTextBox';

package/dist/components/stepper/Step.d.ts

@@ -0,0 +1,18 @@
+import { ReactNode } from 'react';
+export type StepProps = {
+    /** Label displayed next to the step indicator */
+    label: string;
+    /** Content to display when this step is active */
+    children?: ReactNode;
+};
+/**
+ * A step component to be used as children of Stepper.
+ * Renders its children wrapped in a flex container.
+ *
+ * @param props - The props for the Step component.
+ * @returns The rendered step content.
+ */
+export declare const Step: {
+    ({ children }: StepProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};

package/dist/components/stepper/StepConnector.d.ts

@@ -0,0 +1,13 @@
+import { StepStatus } from './StepIndicator';
+export type StepConnectorProps = {
+    /** Status of the preceding step */
+    status: StepStatus;
+};
+/**
+ * A horizontal line connecting two step indicators.
+ * Changes color based on completion state.
+ *
+ * @param props - The props for the StepConnector component.
+ * @returns The rendered connector line.
+ */
+export declare const StepConnector: ({ status }: StepConnectorProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/stepper/StepIndicator.d.ts

@@ -0,0 +1,10 @@
+export type StepStatus = "complete" | "active" | "incomplete";
+export type StepIndicatorProps = {
+    /** Label displayed next to the step indicator */
+    label: string;
+    /** Zero-based index of the step */
+    index: number;
+    /** Current status of the step */
+    status: StepStatus;
+};
+export declare const StepIndicator: ({ label, index, status }: StepIndicatorProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/stepper/Stepper.d.ts

@@ -0,0 +1,14 @@
+import { ReactNode } from 'react';
+export type StepperProps = {
+    /** Current active step index (0-based) */
+    currentStep: number;
+    /** Step components defining the stepper content */
+    children: ReactNode;
+    /** Action buttons to display at the bottom */
+    actions?: ReactNode;
+    /** Whether to show connecting lines between steps */
+    showConnectors?: boolean;
+    /** Additional CSS classes for the container */
+    className?: string;
+};
+export declare const Stepper: ({ currentStep, children, actions, showConnectors, className, }: StepperProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/stepper/index.d.ts

@@ -0,0 +1,5 @@
+export { Step } from './Step';
+export type { StepProps } from './Step';
+export { Stepper } from './Stepper';
+export type { StepperProps } from './Stepper';
+export type { StepStatus } from './StepIndicator';

package/dist/components/tooltip/Tooltip.d.ts

@@ -0,0 +1,20 @@
+import { ReactNode } from 'react';
+import { PopoverPlacement } from '../popover';
+export type TooltipProps = {
+    /** The element that triggers the tooltip on hover */
+    children: ReactNode;
+    /** The text or content to display in the tooltip */
+    content: ReactNode;
+    /** Preferred placement of the tooltip */
+    placement?: PopoverPlacement;
+    /** Additional CSS classes for the tooltip content */
+    className?: string;
+};
+/**
+ * A tooltip component that displays contextual information on hover.
+ * Wraps Popover with automatic show/hide state management.
+ *
+ * @param props - The props for the Tooltip component.
+ * @returns The rendered tooltip with trigger element.
+ */
+export declare const Tooltip: ({ children, content, placement, className, }: TooltipProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/tooltip/index.d.ts

@@ -0,0 +1,2 @@
+export { Tooltip } from './Tooltip';
+export type { TooltipProps } from './Tooltip';

package/dist/icons/icons.d.ts

@@ -96,6 +96,18 @@ export declare const icons: {
         desc?: string;
         descId?: string;
     }>>;
+    readonly eye: import('react').LazyExoticComponent<import('react').FunctionComponent<import('react').SVGProps<SVGSVGElement> & {
+        title?: string;
+        titleId?: string;
+        desc?: string;
+        descId?: string;
+    }>>;
+    readonly eyeOff: import('react').LazyExoticComponent<import('react').FunctionComponent<import('react').SVGProps<SVGSVGElement> & {
+        title?: string;
+        titleId?: string;
+        desc?: string;
+        descId?: string;
+    }>>;
     readonly expandDown: import('react').LazyExoticComponent<import('react').FunctionComponent<import('react').SVGProps<SVGSVGElement> & {
         title?: string;
         titleId?: string;
@@ -233,6 +245,8 @@ export declare const DetailsIcon: IconComponent;
 export declare const EarthIcon: IconComponent;
 export declare const ErrorFilledIcon: IconComponent;
 export declare const ErrorOutlinedIcon: IconComponent;
+export declare const EyeIcon: IconComponent;
+export declare const EyeOffIcon: IconComponent;
 export declare const ExpandDownIcon: IconComponent;
 export declare const ExpandRightIcon: IconComponent;
 export declare const ExpandIcon: IconComponent;