@engrate/components 0.1.25 → 0.1.27

package/dist/components/ui/Sidebar/Sidebar.d.ts

@@ -101,5 +101,45 @@ declare function SidebarLogo({ ...props }: SidebarLogoProps): import("react/jsx-
 declare namespace SidebarLogo {
     var displayName: string;
 }
-export { Sidebar, SidebarHeader, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupLabel, SidebarItem, SidebarTrigger, SidebarSeparator, SidebarLogo, sidebarVariants, sidebarItemVariants, useSidebarContext, };
-export type { SidebarProps, SidebarHeaderProps, SidebarContentProps, SidebarFooterProps, SidebarGroupProps, SidebarGroupLabelProps, SidebarItemProps, SidebarTriggerProps, SidebarSeparatorProps, SidebarLogoProps, };
+interface SidebarSubContextValue {
+    open: boolean;
+    setOpen: (open: boolean) => void;
+}
+declare function useSidebarSubContext(): SidebarSubContextValue;
+interface SidebarSubProps extends React.HTMLAttributes<HTMLDivElement> {
+    /** Whether the sub-items are open by default */
+    defaultOpen?: boolean;
+    /** Controlled open state */
+    open?: boolean;
+    /** Callback when open state changes */
+    onOpenChange?: (open: boolean) => void;
+}
+/**
+ * Wraps a SidebarSubTrigger and SidebarSubContent to create an expandable
+ * navigation item with sub-items.
+ *
+ * When the sidebar is expanded the sub-items collapse/expand inline.
+ * When the sidebar is collapsed they appear in a popover on hover.
+ *
+ * @example
+ * ```tsx
+ * <SidebarSub>
+ *   <SidebarSubTrigger icon={<Zap />}>Power Tariffs</SidebarSubTrigger>
+ *   <SidebarSubContent>
+ *     <SidebarItem>Spot Prices</SidebarItem>
+ *     <SidebarItem>Forward Prices</SidebarItem>
+ *   </SidebarSubContent>
+ * </SidebarSub>
+ * ```
+ */
+declare const SidebarSub: React.ForwardRefExoticComponent<SidebarSubProps & React.RefAttributes<HTMLDivElement>>;
+interface SidebarSubTriggerProps extends React.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof sidebarItemVariants> {
+    /** Icon to display before the label */
+    icon?: React.ReactNode;
+}
+declare const SidebarSubTrigger: React.ForwardRefExoticComponent<SidebarSubTriggerProps & React.RefAttributes<HTMLButtonElement>>;
+interface SidebarSubContentProps extends React.HTMLAttributes<HTMLDivElement> {
+}
+declare const SidebarSubContent: React.ForwardRefExoticComponent<SidebarSubContentProps & React.RefAttributes<HTMLDivElement>>;
+export { Sidebar, SidebarHeader, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupLabel, SidebarItem, SidebarTrigger, SidebarSeparator, SidebarLogo, SidebarSub, SidebarSubTrigger, SidebarSubContent, sidebarVariants, sidebarItemVariants, useSidebarContext, useSidebarSubContext, };
+export type { SidebarProps, SidebarHeaderProps, SidebarContentProps, SidebarFooterProps, SidebarGroupProps, SidebarGroupLabelProps, SidebarItemProps, SidebarTriggerProps, SidebarSeparatorProps, SidebarLogoProps, SidebarSubProps, SidebarSubTriggerProps, SidebarSubContentProps, };

package/dist/components/ui/Sidebar/index.d.ts

@@ -1 +1 @@
-export { Sidebar, SidebarHeader, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupLabel, SidebarItem, SidebarTrigger, SidebarSeparator, sidebarVariants, sidebarItemVariants, useSidebarContext, type SidebarProps, type SidebarHeaderProps, type SidebarContentProps, type SidebarFooterProps, type SidebarGroupProps, type SidebarGroupLabelProps, type SidebarItemProps, type SidebarTriggerProps, type SidebarSeparatorProps, } from './Sidebar';
+export { Sidebar, SidebarHeader, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupLabel, SidebarItem, SidebarTrigger, SidebarSeparator, SidebarSub, SidebarSubTrigger, SidebarSubContent, sidebarVariants, sidebarItemVariants, useSidebarContext, useSidebarSubContext, type SidebarProps, type SidebarHeaderProps, type SidebarContentProps, type SidebarFooterProps, type SidebarGroupProps, type SidebarGroupLabelProps, type SidebarItemProps, type SidebarTriggerProps, type SidebarSeparatorProps, type SidebarSubProps, type SidebarSubTriggerProps, type SidebarSubContentProps, } from './Sidebar';

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

@@ -0,0 +1,115 @@
+import { VariantProps } from 'class-variance-authority';
+import * as React from 'react';
+declare const stepperVariants: (props?: ({
+    orientation?: "horizontal" | "vertical" | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string;
+declare const miniStepperVariants: (props?: ({
+    size?: "default" | "sm" | "lg" | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string;
+declare const miniStepperIndicatorVariants: (props?: ({
+    size?: "default" | "sm" | "lg" | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string;
+declare const miniStepperSeparatorVariants: (props?: ({
+    size?: "default" | "sm" | "lg" | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string;
+interface StepperProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof stepperVariants> {
+    /** Visual style — `"default"` for compound component, `"mini"` for inline compact stepper */
+    variant?: 'default' | 'mini';
+    /** The current active step (1-indexed) */
+    activeStep?: number;
+    /** Orientation of the stepper (default variant only) */
+    orientation?: 'horizontal' | 'vertical';
+    /** Total number of steps (mini variant only) */
+    totalSteps?: number;
+    /** Indicator size (mini variant only) */
+    size?: 'sm' | 'default' | 'lg' | null;
+    /** Labels for each step, used as aria-label (mini variant only) */
+    labels?: string[];
+    /** Callback when a step indicator is clicked (mini variant only) */
+    onStepClick?: (step: number) => void;
+}
+/**
+ * Root container for the stepper component.
+ * Displays progress through a multi-step process.
+ *
+ * Use `variant="default"` (or omit) for a compound component with titles/descriptions.
+ * Use `variant="mini"` for a compact inline stepper with numbered dots and connectors.
+ *
+ * @example
+ * ```tsx
+ * // Default — compound component
+ * <Stepper activeStep={2}>
+ *   <StepperItem step={1}>
+ *     <StepperTrigger>
+ *       <StepperIndicator />
+ *       <StepperTitle>Step 1</StepperTitle>
+ *     </StepperTrigger>
+ *     <StepperSeparator />
+ *   </StepperItem>
+ *   <StepperItem step={2}>
+ *     <StepperTrigger>
+ *       <StepperIndicator />
+ *       <StepperTitle>Step 2</StepperTitle>
+ *     </StepperTrigger>
+ *   </StepperItem>
+ * </Stepper>
+ *
+ * // Mini — compact inline
+ * <Stepper variant="mini" totalSteps={4} activeStep={2} />
+ * <Stepper variant="mini" totalSteps={3} activeStep={2} size="sm" labels={['A','B','C']} />
+ * ```
+ */
+declare const Stepper: React.ForwardRefExoticComponent<StepperProps & React.RefAttributes<HTMLDivElement>>;
+declare const stepperItemVariants: (props?: ({
+    orientation?: "horizontal" | "vertical" | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string;
+interface StepperItemProps extends React.HTMLAttributes<HTMLDivElement> {
+    /** Step number (1-indexed) */
+    step: number;
+}
+/**
+ * Individual step item. Wraps the trigger, separator, and any content.
+ */
+declare const StepperItem: React.ForwardRefExoticComponent<StepperItemProps & React.RefAttributes<HTMLDivElement>>;
+declare const stepperTriggerVariants: (props?: ({
+    orientation?: "horizontal" | "vertical" | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string;
+interface StepperTriggerProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
+}
+/**
+ * Clickable trigger for a step. Contains the indicator and labels.
+ */
+declare const StepperTrigger: React.ForwardRefExoticComponent<StepperTriggerProps & React.RefAttributes<HTMLButtonElement>>;
+declare const stepperIndicatorVariants: (props?: ({
+    size?: "default" | "sm" | "lg" | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string;
+interface StepperIndicatorProps extends React.HTMLAttributes<HTMLSpanElement>, VariantProps<typeof stepperIndicatorVariants> {
+}
+/**
+ * Visual indicator showing the step number or completion state.
+ * Automatically shows a check icon for completed steps.
+ */
+declare const StepperIndicator: React.ForwardRefExoticComponent<StepperIndicatorProps & React.RefAttributes<HTMLSpanElement>>;
+interface StepperTitleProps extends React.HTMLAttributes<HTMLSpanElement> {
+}
+/**
+ * Title text for a step.
+ */
+declare const StepperTitle: React.ForwardRefExoticComponent<StepperTitleProps & React.RefAttributes<HTMLSpanElement>>;
+interface StepperDescriptionProps extends React.HTMLAttributes<HTMLParagraphElement> {
+}
+/**
+ * Description text for a step.
+ */
+declare const StepperDescription: React.ForwardRefExoticComponent<StepperDescriptionProps & React.RefAttributes<HTMLParagraphElement>>;
+declare const stepperSeparatorVariants: (props?: ({
+    orientation?: "horizontal" | "vertical" | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string;
+interface StepperSeparatorProps extends React.HTMLAttributes<HTMLDivElement> {
+}
+/**
+ * Separator line between steps. Indicates completion status.
+ */
+declare const StepperSeparator: React.ForwardRefExoticComponent<StepperSeparatorProps & React.RefAttributes<HTMLDivElement>>;
+export { Stepper, stepperVariants, miniStepperVariants, miniStepperIndicatorVariants, miniStepperSeparatorVariants, StepperItem, stepperItemVariants, StepperTrigger, stepperTriggerVariants, StepperIndicator, stepperIndicatorVariants, StepperTitle, StepperDescription, StepperSeparator, stepperSeparatorVariants, };
+export type { StepperProps, StepperItemProps, StepperTriggerProps, StepperIndicatorProps, StepperTitleProps, StepperDescriptionProps, StepperSeparatorProps, };

package/dist/components/ui/Stepper/index.d.ts

@@ -0,0 +1,2 @@
+export { Stepper, stepperVariants, miniStepperVariants, miniStepperIndicatorVariants, miniStepperSeparatorVariants, StepperItem, stepperItemVariants, StepperTrigger, stepperTriggerVariants, StepperIndicator, stepperIndicatorVariants, StepperTitle, StepperDescription, StepperSeparator, stepperSeparatorVariants, } from './Stepper';
+export type { StepperProps, StepperItemProps, StepperTriggerProps, StepperIndicatorProps, StepperTitleProps, StepperDescriptionProps, StepperSeparatorProps, } from './Stepper';

package/dist/components/ui/Table/Table.d.ts

@@ -12,6 +12,8 @@ declare const tableHeadVariants: (props?: ({
     size?: "default" | "compact" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
 interface TableProps extends React.HTMLAttributes<HTMLTableElement>, VariantProps<typeof tableVariants> {
+    /** Add visible horizontal borders between table rows */
+    bordered?: boolean;
 }
 /**
  * Table root component following Engrate brand guidelines.

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

@@ -38,6 +38,7 @@ export * from './Skeleton';
 export * from './Slider';
 export * from './Spinner';
 export * from './Stack';
+export * from './Stepper';
 export * from './Switch';
 export * from './Table';
 export * from './TabList';