@orbit_ui_toolkit/orbitui-kit 0.1.24 → 0.1.26

package/dist/components/Dialog/BaseDialog.d.ts

@@ -7,5 +7,6 @@ export interface BaseDialogProps {
     size?: 'sm' | 'md' | 'lg' | 'xl';
     className?: string;
     showCloseButton?: boolean;
+    theme?: 'light' | 'dark' | 'system';
 }
 export declare const BaseDialog: React.FC<BaseDialogProps>;

package/dist/components/Grid/Grid.d.ts

@@ -1,12 +1,19 @@
 import { default as React } from 'react';
+type ResponsiveValue<T> = T | {
+    sm?: T;
+    md?: T;
+    lg?: T;
+    xl?: T;
+    '2xl'?: T;
+};
 export interface GridItemProps {
     children?: React.ReactNode;
     /** How many columns to span across. 1-12 or 'full' */
-    colSpan?: 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 'full';
+    colSpan?: ResponsiveValue<1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 'full'>;
     /** How many rows to span across. */
-    rowSpan?: 1 | 2 | 3 | 4 | 5 | 6;
+    rowSpan?: ResponsiveValue<1 | 2 | 3 | 4 | 5 | 6>;
     /** Start position in grid */
-    colStart?: number | string;
+    colStart?: ResponsiveValue<number | string>;
     /** Additional classes */
     className?: string;
 }
@@ -14,13 +21,13 @@ declare const GridItem: React.FC<GridItemProps>;
 export interface GridProps {
     children: React.ReactNode;
     /** Number of columns. 1-12 */
-    cols?: 1 | 2 | 3 | 4 | 5 | 6 | 8 | 10 | 12;
+    cols?: ResponsiveValue<1 | 2 | 3 | 4 | 5 | 6 | 8 | 10 | 12>;
     /** Gap size (tailwind spacing scale) */
-    gap?: 0 | 1 | 2 | 3 | 4 | 5 | 6 | 8 | 10 | 12;
+    gap?: ResponsiveValue<0 | 1 | 2 | 3 | 4 | 5 | 6 | 8 | 10 | 12>;
     /** Vertical Gap */
-    gapY?: number;
+    gapY?: ResponsiveValue<number>;
     /** Horizontal Gap */
-    gapX?: number;
+    gapX?: ResponsiveValue<number>;
     /** CSS Grid flow direction */
     flow?: 'row' | 'col' | 'row-dense' | 'col-dense';
     /** Align items */

package/dist/components/Input/Input.d.ts

@@ -1,13 +1,16 @@
 import { default as React } from 'react';
-export interface InputProps extends React.InputHTMLAttributes<HTMLInputElement> {
+export interface InputProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'size'> {
     label?: string;
     error?: string;
+    helperText?: string;
     leftIcon?: React.ReactNode;
     rightIcon?: React.ReactNode;
     variant?: 'default' | 'glass' | 'dark';
+    size?: 'sm' | 'md' | 'lg';
     rounded?: 'none' | 'sm' | 'md' | 'lg' | 'full';
     shadow?: boolean;
     focusRing?: boolean;
     focusRingColor?: string;
+    containerClassName?: string;
 }
 export declare const Input: React.ForwardRefExoticComponent<InputProps & React.RefAttributes<HTMLInputElement>>;

package/dist/components/Input/Input.stories.d.ts

@@ -4,8 +4,11 @@ declare const meta: Meta<typeof Input>;
 export default meta;
 type Story = StoryObj<typeof Input>;
 export declare const Default: Story;
-export declare const WithLabel: Story;
+export declare const Small: Story;
+export declare const Large: Story;
+export declare const Glass: Story;
+export declare const Dark: Story;
 export declare const WithError: Story;
-export declare const Password: Story;
-export declare const WithIcons: Story;
-export declare const WithRightIcon: Story;
+export declare const WithHelperText: Story;
+export declare const Disabled: Story;
+export declare const Required: Story;

package/dist/components/calendar/Calendar.d.ts

@@ -0,0 +1,7 @@
+import { default as React } from 'react';
+import { CalendarProps } from './types';
+/**
+ * Reusable Calendar component mimicking Microsoft Teams UI.
+ * Supports Month and Week views, event management (CRUD), accessibility, and dark mode.
+ */
+export declare const Calendar: React.FC<CalendarProps>;

package/dist/components/calendar/Calendar.stories.d.ts

@@ -0,0 +1,8 @@
+import { Meta, StoryObj } from '@storybook/react';
+import { Calendar } from './Calendar';
+declare const meta: Meta<typeof Calendar>;
+export default meta;
+type Story = StoryObj<typeof Calendar>;
+export declare const Default: Story;
+export declare const Empty: Story;
+export declare const LargeModal: Story;

package/dist/components/calendar/CalendarGrid.d.ts

@@ -0,0 +1,10 @@
+import { default as React } from 'react';
+import { CalendarView, DayInfo, CalendarEvent } from './types';
+interface CalendarGridProps {
+    view: CalendarView;
+    days: DayInfo[];
+    onDateClick: (date: Date) => void;
+    onEventClick: (event: CalendarEvent) => void;
+}
+export declare const CalendarGrid: React.FC<CalendarGridProps>;
+export {};

package/dist/components/calendar/CalendarHeader.d.ts

@@ -0,0 +1,14 @@
+import { CalendarView } from './types';
+interface CalendarHeaderProps {
+    currentDate: Date;
+    view: CalendarView;
+    onPrev: () => void;
+    onNext: () => void;
+    onToday: () => void;
+    onViewChange: (view: CalendarView) => void;
+    searchQuery: string;
+    onSearchChange: (query: string) => void;
+    onScheduleClick: () => void;
+}
+export declare const CalendarHeader: React.FC<CalendarHeaderProps>;
+export {};

package/dist/components/calendar/EventListSidebar.d.ts

@@ -0,0 +1,12 @@
+import { default as React } from 'react';
+import { CalendarEvent } from './types';
+interface EventListSidebarProps {
+    isOpen: boolean;
+    onClose: () => void;
+    date: Date;
+    events: CalendarEvent[];
+    onEventClick: (event: CalendarEvent) => void;
+    onScheduleClick: () => void;
+}
+export declare const EventListSidebar: React.FC<EventListSidebarProps>;
+export {};

package/dist/components/calendar/EventModal.d.ts

@@ -0,0 +1,17 @@
+import { default as React } from 'react';
+import { CalendarEvent } from './types';
+interface EventModalProps {
+    isOpen: boolean;
+    onClose: () => void;
+    event?: CalendarEvent | null;
+    selectedDate: Date;
+    onSave: (event: Omit<CalendarEvent, 'id'> & {
+        id?: string;
+    }) => void;
+    onDelete?: (id: string) => void;
+    defaultSize?: 'sm' | 'md' | 'lg' | 'xl';
+    lockDate?: boolean;
+    theme?: 'light' | 'dark' | 'system';
+}
+export declare const EventModal: React.FC<EventModalProps>;
+export {};

package/dist/components/calendar/types.d.ts

@@ -0,0 +1,29 @@
+export type CalendarView = 'month' | 'week' | 'day';
+export interface CalendarEvent {
+    id: string;
+    title: string;
+    start: Date;
+    end: Date;
+    description?: string;
+    color?: string;
+}
+export interface CalendarProps {
+    events?: CalendarEvent[];
+    onAddEvent?: (event: Omit<CalendarEvent, 'id'>) => void;
+    onUpdateEvent?: (event: CalendarEvent) => void;
+    onDeleteEvent?: (id: string) => void;
+    modalSize?: 'sm' | 'md' | 'lg' | 'xl';
+    className?: string;
+    theme?: 'light' | 'dark' | 'system';
+}
+export interface DayInfo {
+    date: Date;
+    isCurrentMonth: boolean;
+    isToday: boolean;
+    isCurrentDay: boolean;
+    events: CalendarEvent[];
+}
+export interface TimeSlot {
+    time: Date;
+    events: CalendarEvent[];
+}

package/dist/components/calendar/utils.d.ts

@@ -0,0 +1,14 @@
+import { CalendarEvent, DayInfo } from './types';
+export declare const getMonthDays: (currentDate: Date, events: CalendarEvent[]) => DayInfo[];
+/**
+ * Generates an array of days for a week view
+ */
+export declare const getWeekDays: (currentDate: Date, events: CalendarEvent[]) => DayInfo[];
+/**
+ * Formats a time range for display
+ */
+export declare const formatTimeRange: (start: Date, end: Date) => string;
+/**
+ * Helper to get status color based on event
+ */
+export declare const getEventColorClasses: (color?: string) => string;

package/dist/index.d.ts

@@ -19,4 +19,7 @@ export * from './components/Stack';
 export * from './components/Dialog/BaseDialog';
 export * from './components/DataTable/DataTable';
 export * from './components/MovieTicket/MovieTicket';
-export * from './components/Badge/Badge';
+export { Badge } from './components/Badge/Badge';
+export type { BadgeProps } from './components/Badge/Badge';
+export * from './components/calendar/Calendar';
+export * from './components/calendar/types';