@mich8060/unified-design-system 0.2.8 → 0.2.10

package/dist/design-system/components/EmptyState/EmptyState.types.d.ts

@@ -0,0 +1,11 @@
+import type { HTMLAttributes, ReactNode } from "react";
+export type EmptyStateAlign = "left" | "center";
+export interface EmptyStateProps extends HTMLAttributes<HTMLDivElement> {
+    title: ReactNode;
+    description?: ReactNode;
+    icon?: string;
+    iconSize?: number;
+    action?: ReactNode;
+    secondaryAction?: ReactNode;
+    align?: EmptyStateAlign;
+}

package/dist/design-system/components/EmptyState/index.d.ts

@@ -0,0 +1,2 @@
+export { EmptyState } from "./EmptyState";
+export type { EmptyStateProps } from "./EmptyState.types";

package/dist/design-system/components/Icon/Icon.d.ts

@@ -1,3 +1,4 @@
+import React from "react";
 import "./_icon.scss";
 import type { IconProps } from "./Icon.types";
 /**
@@ -7,4 +8,10 @@ import type { IconProps } from "./Icon.types";
  * @param {string} appearance - Optional: "regular" | "bold" | "thin" | "light" | "duotone" | "fill" (default: "regular")
  * @param {object} props - Additional props to pass to the icon component
  */
-export default function Icon({ name, size, appearance, ...props }: IconProps): import("react/jsx-runtime").JSX.Element | null;
+declare function Icon({ name, size, appearance, ...props }: IconProps): React.ReactElement<{
+    size?: number;
+    weight?: string;
+    className?: string;
+} & Record<string, unknown>, string | React.JSXElementConstructor<any>> | null;
+declare const _default: React.MemoExoticComponent<typeof Icon>;
+export default _default;

package/dist/design-system/components/Menu/Menu.d.ts

@@ -1,37 +1,8 @@
 import React from "react";
-import PropTypes from "prop-types";
 import "./_menu.scss";
 import type { MenuProps } from "./Menu.types";
-declare function Menu({ title, className, navItems, brands, activeBrand, onBrandChange, activeMode, onModeChange, showBrand, showSearch, showBrandSwitcher, showNav, showModeToggle, showUser, userName, userInitials, userAvatarSrc, accountMenuItems, identity, }: MenuProps): import("react/jsx-runtime").JSX.Element;
+declare function Menu({ title, className, navItems, brands, activeBrand, onBrandChange, activeMode, onModeChange, showBrand, showSearch, showBrandSwitcher, showNav, showModeToggle, showUser, userName, userInitials, userAvatarSrc, accountMenuItems, identity, defaultExpanded, }: MenuProps): import("react/jsx-runtime").JSX.Element;
 declare namespace Menu {
-    var propTypes: {
-        title: PropTypes.Requireable<string>;
-        className: PropTypes.Requireable<string>;
-        navItems: PropTypes.Requireable<(PropTypes.InferProps<{
-            label: PropTypes.Validator<string>;
-            icon: PropTypes.Validator<string>;
-            path: PropTypes.Requireable<string>;
-            children: PropTypes.Requireable<(PropTypes.InferProps<{
-                label: PropTypes.Validator<string>;
-                path: PropTypes.Validator<string>;
-            }> | null | undefined)[]>;
-        }> | null | undefined)[]>;
-        brands: PropTypes.Requireable<(string | null | undefined)[]>;
-        activeBrand: PropTypes.Requireable<string>;
-        onBrandChange: PropTypes.Requireable<(...args: any[]) => any>;
-        activeMode: PropTypes.Requireable<string>;
-        onModeChange: PropTypes.Requireable<(...args: any[]) => any>;
-        showBrand: PropTypes.Requireable<boolean>;
-        showSearch: PropTypes.Requireable<boolean>;
-        showBrandSwitcher: PropTypes.Requireable<boolean>;
-        showNav: PropTypes.Requireable<boolean>;
-        showModeToggle: PropTypes.Requireable<boolean>;
-        showUser: PropTypes.Requireable<boolean>;
-        userName: PropTypes.Requireable<string>;
-        userInitials: PropTypes.Requireable<string>;
-        userAvatarSrc: PropTypes.Requireable<string>;
-        accountMenuItems: PropTypes.Requireable<any[]>;
-    };
     var defaultProps: {
         title: string;
     };

package/dist/design-system/components/Menu/Menu.types.d.ts

@@ -45,4 +45,6 @@ export interface MenuProps extends Omit<HTMLAttributes<HTMLElement>, "onChange">
     userAvatarSrc?: string;
     accountMenuItems?: unknown[];
     identity?: string;
+    /** Initial expanded/collapsed state of the sidebar rail. */
+    defaultExpanded?: boolean;
 }

package/dist/design-system/components/Modal/Modal.d.ts

@@ -23,4 +23,6 @@ import type { ModalProps } from "./Modal.types";
  * @param {React.ReactNode} children       - Modal body content
  * @param {object}        props            - Additional props spread onto the dialog element
  */
-export default function Modal({ open, onClose, title, subtitle, badge, header, footer, size, closeOnBackdrop, closeOnEscape, container, className, children, ...props }: ModalProps): React.ReactPortal | null;
+declare function Modal({ open, onClose, title, subtitle, badge, header, footer, size, closeOnBackdrop, closeOnEscape, container, className, children, ...props }: ModalProps): React.ReactPortal | null;
+declare const _default: React.MemoExoticComponent<typeof Modal>;
+export default _default;

package/dist/design-system/components/Table/Table.d.ts

@@ -1,3 +1,4 @@
+import React from "react";
 import "./_table.scss";
 import type { TableProps } from "./Table.types";
 /**
@@ -8,10 +9,6 @@ import type { TableProps } from "./Table.types";
  * @param {object} props - Additional props to pass to the table element
  */
 declare function Table({ columns, data, className, bodyWeight, ...props }: TableProps): import("react/jsx-runtime").JSX.Element;
-declare namespace Table {
-    var Cell: typeof TableCell;
-}
-export default Table;
 /**
  * TableCell component - flexible cell that can render different content types
  * @param {string} type - Cell type: 'header' or 'cell'
@@ -20,10 +17,8 @@ export default Table;
  * @param {number} rowIndex - Row index
  * @param {number} colIndex - Column index
  */
-declare function TableCell({ type, column, row, rowIndex, colIndex }: {
-    type: any;
-    column: any;
-    row: any;
-    rowIndex: any;
-    colIndex: any;
-}): import("react/jsx-runtime").JSX.Element;
+declare const TableCell: React.NamedExoticComponent<object>;
+declare const MemoizedTable: typeof Table & {
+    Cell: typeof TableCell;
+};
+export default MemoizedTable;

package/dist/design-system/components/Tabs/TabItem.d.ts

@@ -1,3 +1,4 @@
+import React from "react";
 interface TabItemProps {
     label?: string | number;
     appearance?: "underline" | "block" | "block-inverted";
@@ -9,5 +10,6 @@ interface TabItemProps {
     onClick?: (...args: unknown[]) => void;
     [key: string]: unknown;
 }
-export default function TabItem({ label, active, icon, tag, tagVariant, className, onClick, ...props }: TabItemProps): import("react/jsx-runtime").JSX.Element;
-export {};
+declare function TabItem({ label, active, icon, tag, tagVariant, className, onClick, ...props }: TabItemProps): import("react/jsx-runtime").JSX.Element;
+declare const _default: React.MemoExoticComponent<typeof TabItem>;
+export default _default;

package/dist/design-system/components/Tabs/Tabs.d.ts

@@ -1,3 +1,4 @@
+import React from "react";
 import "./_tabs.scss";
 import type { TabsProps } from "./Tabs.types";
 /**
@@ -12,4 +13,6 @@ import type { TabsProps } from "./Tabs.types";
  * @param {string} className - Additional CSS classes
  * @param {object} props - Additional props to pass to the tabs container
  */
-export default function Tabs({ tabs, appearance, activeTab, fill, scrollable, onTabChange, className, ...props }: TabsProps): import("react/jsx-runtime").JSX.Element | null;
+declare function Tabs({ tabs, appearance, activeTab, fill, scrollable, onTabChange, className, ...props }: TabsProps): import("react/jsx-runtime").JSX.Element | null;
+declare const _default: React.MemoExoticComponent<typeof Tabs>;
+export default _default;

package/dist/design-system/components/TextInput/index.d.ts

@@ -1,3 +1,4 @@
 export { default } from "./TextInput";
 export { default as TextInput } from "./TextInput";
+export { default as Input } from "./TextInput";
 export type { TextInputProps } from "./TextInput.types";

package/dist/design-system/index.d.ts

@@ -11,11 +11,13 @@ export * from "./components/Card";
 export * from "./components/Checkbox";
 export * from "./components/Chip";
 export * from "./components/Code";
+export * from "./components/Container";
 export * from "./components/Datepicker";
 export * from "./components/Dialog";
 export * from "./components/Divider";
 export * from "./components/DotStatus";
 export * from "./components/Dropdown";
+export * from "./components/EmptyState";
 export * from "./components/EventCard";
 export * from "./components/Field";
 export * from "./components/FileUpload";
@@ -49,3 +51,4 @@ export type { MenuProps, MenuNavItem, MenuChildItem, MenuMode } from "./componen
 export { AppShell } from "../app-shell/AppShell";
 export type { AppShellProps, AppShellSlots, AppShellSectionProps } from "../app-shell/AppShell";
 export type { ShellLayoutConfig, ContainerMode, DensityMode, PaddingMode, } from "../app-shell/layout.types";
+export * from "./theme";

package/dist/design-system/theme/ThemeProvider.d.ts

@@ -0,0 +1,13 @@
+import React from "react";
+import type { ColorMode, ResolvedTheme, ThemeController, ThemeEngine } from "./theme.types";
+interface ThemeProviderProps<BrandName extends string> {
+    theme: ThemeEngine<BrandName>;
+    initialBrand?: BrandName;
+    initialMode?: ColorMode;
+    target?: HTMLElement | null;
+    children: React.ReactNode;
+}
+export declare function ThemeProvider<BrandName extends string>({ theme, initialBrand, initialMode, target, children, }: ThemeProviderProps<BrandName>): import("react/jsx-runtime").JSX.Element;
+export declare function useThemeController<BrandName extends string = string>(): ThemeController<BrandName>;
+export declare function useTheme<BrandName extends string = string>(): ResolvedTheme<BrandName>;
+export {};

package/dist/design-system/theme/createBrand.d.ts

@@ -0,0 +1,7 @@
+import type { BrandDefinition, ColorMode, CssVarMap } from "./theme.types";
+export interface CreateBrandOptions {
+    className?: string;
+    tokens?: CssVarMap;
+    modeTokens?: Partial<Record<ColorMode, CssVarMap>>;
+}
+export declare function createBrand<BrandName extends string>(name: BrandName, options?: CreateBrandOptions): BrandDefinition<BrandName>;

package/dist/design-system/theme/createTheme.d.ts

@@ -0,0 +1,2 @@
+import type { ThemeDefinition, ThemeEngine } from "./theme.types";
+export declare function createTheme<BrandName extends string>(definition: ThemeDefinition<BrandName>): ThemeEngine<BrandName>;

package/dist/design-system/theme/index.d.ts

@@ -0,0 +1,4 @@
+export { createBrand } from "./createBrand";
+export { createTheme } from "./createTheme";
+export { ThemeProvider, useTheme, useThemeController } from "./ThemeProvider";
+export type { BrandDefinition, ColorMode, CssVarMap, CssVarName, ModeDefinition, ResolvedTheme, Theme, ThemeController, ThemeDefinition, ThemeEngine, } from "./theme.types";

package/dist/design-system/theme/theme.types.d.ts

@@ -0,0 +1,55 @@
+export type CssVarName = `--${string}`;
+export type CssVarMap = Readonly<Record<CssVarName, string>>;
+export type ColorMode = "light" | "dark";
+export interface BrandDefinition<BrandName extends string = string> {
+    name: BrandName;
+    className: string;
+    tokens?: CssVarMap;
+    modeTokens?: Partial<Record<ColorMode, CssVarMap>>;
+}
+export interface ModeDefinition {
+    name: ColorMode;
+    className: string;
+    tokens?: CssVarMap;
+}
+export interface ThemeDefinition<BrandName extends string = string> {
+    baseTokens?: CssVarMap;
+    brands: Record<BrandName, BrandDefinition<BrandName>>;
+    modes?: Partial<Record<ColorMode, ModeDefinition>>;
+    defaultBrand: BrandName;
+    defaultMode?: ColorMode;
+}
+export interface ResolvedTheme<BrandName extends string = string> {
+    brand: BrandName;
+    mode: ColorMode;
+    classNames: {
+        brand: string;
+        mode: string;
+    };
+    cssVars: CssVarMap;
+}
+export interface ThemeEngine<BrandName extends string = string> {
+    readonly definition: ThemeDefinition<BrandName>;
+    resolve(input?: {
+        brand?: BrandName;
+        mode?: ColorMode;
+        overrides?: CssVarMap;
+    }): ResolvedTheme<BrandName>;
+    applyToElement(element: HTMLElement, theme: ResolvedTheme<BrandName>): void;
+}
+/**
+ * Public theme API type returned by createTheme().
+ * This alias keeps naming concise for consumers while remaining backwards compatible.
+ */
+export type Theme<BrandName extends string = string> = ThemeEngine<BrandName>;
+export interface ThemeController<BrandName extends string = string> {
+    getSnapshot(): ResolvedTheme<BrandName>;
+    subscribe(listener: () => void): () => void;
+    setBrand(brand: BrandName): void;
+    setMode(mode: ColorMode): void;
+    setTheme(next: {
+        brand?: BrandName;
+        mode?: ColorMode;
+    }): void;
+    setTarget(element: HTMLElement | null): void;
+}