@houssemdi2000/design-system 1.2.0 → 1.3.1

package/dist/components/SecureText/SecureText.d.ts

@@ -0,0 +1,14 @@
+import React from "react";
+import "./SecureText.css";
+export interface SecureTextProps {
+    value: string;
+    masked?: boolean;
+    copyable?: boolean;
+    maskChar?: string;
+    revealLabel?: string;
+    copyLabel?: string;
+    onCopy?: () => void;
+    isDarkMode?: boolean;
+    width?: number | string;
+}
+export declare const SecureText: React.FC<SecureTextProps>;

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

@@ -0,0 +1,8 @@
+declare const _default: {
+    title: string;
+    component: import("react").FC<import("./SecureText").SecureTextProps>;
+};
+export default _default;
+export declare const Default: () => import("react/jsx-runtime").JSX.Element;
+export declare const DarkMode: () => import("react/jsx-runtime").JSX.Element;
+export declare const NoMask: () => import("react/jsx-runtime").JSX.Element;

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

@@ -0,0 +1 @@
+export * from './SecureText';

package/dist/components/Select/Select.d.ts

@@ -8,6 +8,7 @@ export interface SelectOption {
 }
 export interface SelectProps {
     label?: string;
+    goal?: string;
     value: string | number;
     onChange: (value: string | number) => void;
     options: SelectOption[];
@@ -18,5 +19,6 @@ export interface SelectProps {
     focusShadow?: string;
     errorColor?: string;
     style?: React.CSSProperties;
+    isDarkMode?: boolean;
 }
 export declare const Select: React.FC<SelectProps>;

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

@@ -0,0 +1,22 @@
+import React from "react";
+import "./Sidebar.css";
+export interface SidebarItem {
+    label: string;
+    icon?: React.ReactNode;
+    href?: string;
+    onClick?: () => void;
+    active?: boolean;
+}
+export interface SidebarProps {
+    logo?: React.ReactNode;
+    items?: SidebarItem[];
+    footer?: React.ReactNode;
+    collapsed?: boolean;
+    onToggle?: (collapsed: boolean) => void;
+    width?: number;
+    collapsedWidth?: number;
+    isDarkMode?: boolean;
+    sticky?: boolean;
+    style?: React.CSSProperties;
+}
+export declare const Sidebar: React.FC<SidebarProps>;

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

@@ -0,0 +1,6 @@
+declare const _default: {
+    title: string;
+    component: import("react").FC<import("./Sidebar").SidebarProps>;
+};
+export default _default;
+export declare const Default: () => import("react/jsx-runtime").JSX.Element;

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

@@ -0,0 +1 @@
+export * from './Sidebar';

package/dist/components/Slider/SmartSlider.d.ts

@@ -0,0 +1,17 @@
+import React from "react";
+import "./SmartSlider.css";
+export type SliderValue = number | [number, number];
+export interface SmartSliderProps {
+    min?: number;
+    max?: number;
+    step?: number;
+    value?: SliderValue;
+    defaultValue?: SliderValue;
+    range?: boolean;
+    disabled?: boolean;
+    showTooltip?: boolean;
+    showLabels?: boolean;
+    isDarkMode?: boolean;
+    onChange?: (value: SliderValue) => void;
+}
+export declare const SmartSlider: React.FC<SmartSliderProps>;

package/dist/components/Slider/SmartSlider.stories.d.ts

@@ -0,0 +1,7 @@
+declare const _default: {
+    title: string;
+    component: import("react").FC<import("./SmartSlider").SmartSliderProps>;
+};
+export default _default;
+export declare const Default: () => import("react/jsx-runtime").JSX.Element;
+export declare const Range: () => import("react/jsx-runtime").JSX.Element;

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

@@ -0,0 +1,23 @@
+import React from "react";
+import "./SmartTable.css";
+export interface TableColumn<T> {
+    key: keyof T;
+    label: string;
+    width?: string;
+    align?: "left" | "center" | "right";
+    render?: (value: T[keyof T], row: T) => React.ReactNode;
+    sortable?: boolean;
+}
+export interface SmartTableProps<T> {
+    data: T[];
+    columns: TableColumn<T>[];
+    loading?: boolean;
+    clickable?: boolean;
+    onRowClick?: (row: T) => void;
+    striped?: boolean;
+    bordered?: boolean;
+    emptyText?: string;
+    isDarkMode?: boolean;
+    enableSorting?: boolean;
+}
+export declare function SmartTable<T>({ data, columns, loading, clickable, onRowClick, striped, bordered, emptyText, isDarkMode, enableSorting, }: SmartTableProps<T>): import("react/jsx-runtime").JSX.Element;

package/dist/components/Table/SmartTable.stories.d.ts

@@ -0,0 +1,10 @@
+import { SmartTable } from "./SmartTable";
+declare const _default: {
+    title: string;
+    component: typeof SmartTable;
+};
+export default _default;
+export declare const FullTable: () => import("react/jsx-runtime").JSX.Element;
+export declare const WithFilterBar: () => import("react/jsx-runtime").JSX.Element;
+export declare const WithPagination: () => import("react/jsx-runtime").JSX.Element;
+export declare const WithSorting: () => import("react/jsx-runtime").JSX.Element;

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

@@ -0,0 +1 @@
+export * from './SmartTable';

package/dist/components/TableFilterBar/TableFilterBar.d.ts

@@ -0,0 +1,42 @@
+import React from "react";
+import "./TableFilterBar.css";
+export type FilterType = "text" | "select" | "checkbox" | "radio";
+export interface BaseFilter {
+    key: string;
+    label: string;
+    width?: "large" | "medium" | "small";
+}
+export interface TextFilter extends BaseFilter {
+    type: "text";
+    placeholder?: string;
+}
+export interface SelectFilter extends BaseFilter {
+    type: "select";
+    options: {
+        label: string;
+        value: string;
+    }[];
+}
+export interface CheckboxFilter extends BaseFilter {
+    type: "checkbox";
+}
+export interface RadioFilter extends BaseFilter {
+    type: "radio";
+    options: {
+        label: string;
+        value: string;
+    }[];
+}
+export type TableFilter = TextFilter | SelectFilter | CheckboxFilter | RadioFilter;
+export interface TableFilterBarProps {
+    filters: TableFilter[];
+    values: Record<string, any>;
+    position?: "left" | "center" | "right";
+    onChange: (key: string, value: any) => void;
+    onReset?: () => void;
+    isDarkMode?: boolean;
+    gap?: number;
+    collapsible?: boolean;
+    resetButton?: React.ReactNode;
+}
+export declare const TableFilterBar: React.FC<TableFilterBarProps>;

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

@@ -0,0 +1,7 @@
+import React from "react";
+declare const _default: {
+    title: string;
+    component: React.FC<import("./TableFilterBar").TableFilterBarProps>;
+};
+export default _default;
+export declare const Default: () => import("react/jsx-runtime").JSX.Element;

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

@@ -0,0 +1 @@
+export * from './TableFilterBar';

package/dist/components/Tag/Tag.d.ts

@@ -0,0 +1,13 @@
+import React from "react";
+import "./Tag.css";
+export interface TagProps {
+    label: string;
+    variant?: "filled" | "outline" | "soft";
+    color?: string;
+    background?: string;
+    borderColor?: string;
+    closable?: boolean;
+    disabled?: boolean;
+    style?: React.CSSProperties;
+}
+export declare const Tag: React.FC<TagProps>;

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

@@ -0,0 +1,7 @@
+declare const _default: {
+    title: string;
+    component: import("react").FC<import("./Tag").TagProps>;
+};
+export default _default;
+export declare const Closable: () => import("react/jsx-runtime").JSX.Element;
+export declare const Outline: () => import("react/jsx-runtime").JSX.Element;

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

@@ -0,0 +1 @@
+export * from "./Tag";

package/dist/components/Text/Text.d.ts

@@ -0,0 +1,18 @@
+import React from "react";
+import "./Text.css";
+type TextAs = "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "p" | "span" | "label" | "small" | "div";
+type TextVariant = "title" | "subtitle" | "body" | "caption" | "overline" | "error" | "success" | "muted";
+type TextWeight = "regular" | "medium" | "bold";
+type TextAlign = "left" | "center" | "right";
+export interface TextProps {
+    as?: TextAs;
+    variant?: TextVariant;
+    weight?: TextWeight;
+    align?: TextAlign;
+    color?: string;
+    isDarkMode?: boolean;
+    children: React.ReactNode;
+    className?: string;
+}
+export declare const Text: React.FC<TextProps>;
+export {};

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

@@ -0,0 +1,8 @@
+declare const _default: {
+    title: string;
+    component: import("react").FC<import("./Text").TextProps>;
+};
+export default _default;
+export declare const Title: () => import("react/jsx-runtime").JSX.Element;
+export declare const paragraph: () => import("react/jsx-runtime").JSX.Element;
+export declare const Bloc: () => import("react/jsx-runtime").JSX.Element;

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

@@ -0,0 +1 @@
+export * from './Text';

package/dist/components/Theme/ThemeContext.d.ts

@@ -0,0 +1,12 @@
+import React from "react";
+import { Theme } from "./types";
+interface ThemeContextType {
+    theme: Theme;
+    toggleDarkMode: () => void;
+    setCustomTheme: (t: Partial<Theme>) => void;
+}
+export declare const useTheme: () => ThemeContextType;
+export declare const ThemeProvider: React.FC<{
+    children: React.ReactNode;
+}>;
+export {};

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

@@ -0,0 +1,2 @@
+export * from "./ThemeContext";
+export * from "./types";

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

@@ -0,0 +1,7 @@
+export interface Theme {
+    primary: string;
+    background: string;
+    text: string;
+    border: string;
+    mode: "light" | "dark";
+}

package/dist/components/TimeLine/SmartTimeLine.d.ts

@@ -0,0 +1,22 @@
+import React from "react";
+import "./SmartTimeLine.css";
+export type TimelineOrientation = "vertical" | "horizontal";
+export type TimelineStatus = "default" | "success" | "warning" | "error" | "info";
+export interface TimelineItem {
+    id: string | number;
+    title: string;
+    description?: string;
+    date?: string;
+    status?: TimelineStatus;
+    icon?: React.ReactNode;
+    content?: React.ReactNode;
+}
+export interface SmartTimelineProps {
+    items: TimelineItem[];
+    orientation?: TimelineOrientation;
+    showLine?: boolean;
+    clickable?: boolean;
+    isDarkMode?: boolean;
+    onItemClick?: (item: TimelineItem) => void;
+}
+export declare const SmartTimeline: React.FC<SmartTimelineProps>;

package/dist/components/TimeLine/SmartTimeLine.stories.d.ts

@@ -0,0 +1,6 @@
+declare const _default: {
+    title: string;
+    component: import("react").FC<import("./SmartTimeLine").SmartTimelineProps>;
+};
+export default _default;
+export declare const Default: () => import("react/jsx-runtime").JSX.Element;

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

@@ -0,0 +1 @@
+export * from "./SmartTimeLine";

package/dist/components/Toast/ToastContext.d.ts

@@ -6,9 +6,10 @@ export interface Toast {
     message: string;
     variant?: ToastVariant;
     duration?: number;
+    position?: "top-right" | "top-left" | "bottom-right" | "bottom-left";
 }
 interface ToastContextType {
-    addToast: (msg: string, variant?: ToastVariant, duration?: number) => void;
+    addToast: (msg: string, variant?: ToastVariant, duration?: number, position?: "top-right" | "top-left" | "bottom-right" | "bottom-left") => void;
 }
 export declare const useToast: () => ToastContextType;
 export declare const ToastProvider: React.FC<{

package/dist/components/index.d.ts

@@ -13,3 +13,21 @@ export * from './TextField';
 export * from './Radio';
 export * from './Select';
 export * from './Toast';
+export * from './Modal';
+export * from './Tag';
+export * from './Theme';
+export * from './Table';
+export * from './Pagination';
+export * from './TableFilterBar';
+export * from './Text';
+export * from './TimeLine';
+export * from './Carousel';
+export * from './Navbar';
+export * from './Sidebar';
+export * from './Footer';
+export * from './Layout';
+export * from './DragDrop';
+export * from './SecureText';
+export * from './Loading';
+export * from './Avatar';
+export * from './ProfileMenu';