tc-dazzle-ui 1.0.0 → 1.2.0

package/dist/components/Atoms/Button/Button.d.ts

@@ -0,0 +1,29 @@
+import React from 'react';
+import './Button.css';
+export type ButtonVariant = 'primary' | 'secondary' | 'text';
+export type ButtonState = 'active' | 'hover' | 'disabled';
+export interface ButtonProps {
+    label?: string;
+    variant?: ButtonVariant;
+    disabled?: boolean;
+    showStartIcon?: boolean;
+    showEndIcon?: boolean;
+    showLabel?: boolean;
+    startIcon?: React.ReactNode;
+    endIcon?: React.ReactNode;
+    onClick?: () => void;
+    className?: string;
+}
+export interface ButtonGroupProps {
+    label?: string;
+    variant?: ButtonVariant;
+    disabled?: boolean;
+    showStartIcon?: boolean;
+    startIcon?: React.ReactNode;
+    onButtonClick?: () => void;
+    onDropdownClick?: () => void;
+    className?: string;
+}
+export declare const Button: React.FC<ButtonProps>;
+export declare const ButtonGroup: React.FC<ButtonGroupProps>;
+export default Button;

package/dist/components/Atoms/Button/index.d.ts

@@ -0,0 +1,2 @@
+export { Button, ButtonGroup } from './Button';
+export type { ButtonProps, ButtonGroupProps, ButtonVariant, ButtonState } from './Button';

package/dist/components/Atoms/FilterDropdown/FilterDropdown.d.ts

@@ -0,0 +1,20 @@
+import React from 'react';
+import './FilterDropdown.css';
+export type FilterDropdownSize = 'small' | 'medium';
+export type FilterDropdownState = 'enabled' | 'disabled' | 'focused';
+export interface FilterDropdownOption {
+    value: string;
+    label: string;
+}
+export interface FilterDropdownProps {
+    value?: string;
+    defaultValue?: string;
+    options?: FilterDropdownOption[];
+    placeholder?: string;
+    size?: FilterDropdownSize;
+    disabled?: boolean;
+    onChange?: (value: string) => void;
+    className?: string;
+}
+export declare const FilterDropdown: React.FC<FilterDropdownProps>;
+export default FilterDropdown;

package/dist/components/Atoms/FilterDropdown/index.d.ts

@@ -0,0 +1,2 @@
+export { FilterDropdown } from './FilterDropdown';
+export type { FilterDropdownProps, FilterDropdownOption, FilterDropdownSize, FilterDropdownState } from './FilterDropdown';

package/dist/components/Atoms/GlobalSearch/GlobalSearch.d.ts

@@ -0,0 +1,20 @@
+import React from 'react';
+import './GlobalSearch.css';
+export interface GlobalSearchOption {
+    value: string;
+    label: string;
+}
+export interface GlobalSearchProps {
+    placeholder?: string;
+    filterPlaceholder?: string;
+    filterOptions?: GlobalSearchOption[];
+    filterValue?: string;
+    searchValue?: string;
+    disabled?: boolean;
+    onSearch?: (value: string) => void;
+    onFilterChange?: (value: string) => void;
+    onSubmit?: (searchValue: string, filterValue: string) => void;
+    className?: string;
+}
+export declare const GlobalSearch: React.FC<GlobalSearchProps>;
+export default GlobalSearch;

package/dist/components/Atoms/GlobalSearch/index.d.ts

@@ -0,0 +1,2 @@
+export { GlobalSearch } from './GlobalSearch';
+export type { GlobalSearchProps, GlobalSearchOption } from './GlobalSearch';

package/dist/components/Atoms/IconButton/IconButton.d.ts

@@ -0,0 +1,16 @@
+import React from 'react';
+import './IconButton.css';
+export type IconButtonSize = 'small' | 'medium' | 'large';
+export type IconButtonColor = 'default' | 'primary' | 'secondary';
+export type IconButtonState = 'enabled' | 'hover' | 'disabled';
+export interface IconButtonProps {
+    icon?: React.ReactNode;
+    size?: IconButtonSize;
+    color?: IconButtonColor;
+    disabled?: boolean;
+    onClick?: () => void;
+    ariaLabel?: string;
+    className?: string;
+}
+export declare const IconButton: React.FC<IconButtonProps>;
+export default IconButton;

package/dist/components/Atoms/IconButton/index.d.ts

@@ -0,0 +1,2 @@
+export { IconButton } from './IconButton';
+export type { IconButtonProps, IconButtonSize, IconButtonColor, IconButtonState } from './IconButton';

package/dist/components/Atoms/Icons/Icons.d.ts

@@ -0,0 +1,14 @@
+import React from 'react';
+import './Icons.css';
+export type IconSize = 'small' | 'medium' | 'large';
+export interface IconProps {
+    size?: IconSize;
+    color?: string;
+    className?: string;
+}
+export declare const InfoIcon: React.FC<IconProps>;
+export declare const SearchIcon: React.FC<IconProps>;
+export declare const ChevronDownIcon: React.FC<IconProps>;
+export declare const ChevronUpIcon: React.FC<IconProps>;
+export declare const CaretDownIcon: React.FC<IconProps>;
+export declare const TeamConnectIcon: React.FC<IconProps>;

package/dist/components/Atoms/Icons/index.d.ts

@@ -0,0 +1,2 @@
+export { InfoIcon, SearchIcon, ChevronDownIcon, ChevronUpIcon, CaretDownIcon, TeamConnectIcon, } from './Icons';
+export type { IconProps, IconSize } from './Icons';

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

@@ -0,0 +1,24 @@
+import React from 'react';
+import './Input.css';
+export type InputType = 'enabled' | 'focused' | 'disabled' | 'prefixed' | 'suffixed' | 'dropdown';
+export interface InputProps {
+    label?: string;
+    placeholder?: string;
+    value?: string;
+    defaultValue?: string;
+    type?: 'text' | 'password' | 'email' | 'number' | 'tel' | 'url';
+    inputType?: InputType;
+    disabled?: boolean;
+    error?: boolean;
+    helperText?: string;
+    prefixIcon?: React.ReactNode;
+    suffixIcon?: React.ReactNode;
+    dropdownValue?: string;
+    onChange?: (e: React.ChangeEvent<HTMLInputElement>) => void;
+    onFocus?: (e: React.FocusEvent<HTMLInputElement>) => void;
+    onBlur?: (e: React.FocusEvent<HTMLInputElement>) => void;
+    onDropdownClick?: () => void;
+    className?: string;
+}
+export declare const Input: React.ForwardRefExoticComponent<InputProps & React.RefAttributes<HTMLInputElement>>;
+export default Input;

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

@@ -0,0 +1,3 @@
+export { Input } from './Input';
+export type { InputProps, InputType } from './Input';
+export { default } from './Input';

package/dist/components/Atoms/Logo/Logo.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+import './Logo.css';
+export type LogoSize = 'small' | 'medium' | 'large';
+export type LogoVariant = 'full' | 'icon';
+export interface LogoProps {
+    size?: LogoSize;
+    variant?: LogoVariant;
+    showSandbox?: boolean;
+    className?: string;
+    onClick?: () => void;
+}
+export declare const Logo: React.FC<LogoProps>;
+export default Logo;

package/dist/components/Atoms/Logo/index.d.ts

@@ -0,0 +1,2 @@
+export { Logo } from './Logo';
+export type { LogoProps, LogoSize, LogoVariant } from './Logo';

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

@@ -0,0 +1,14 @@
+export { Button, ButtonGroup } from './Button';
+export type { ButtonProps, ButtonGroupProps, ButtonVariant, ButtonState } from './Button';
+export { Input } from './Input';
+export type { InputProps, InputType } from './Input';
+export { FilterDropdown } from './FilterDropdown';
+export type { FilterDropdownProps, FilterDropdownOption, FilterDropdownSize, FilterDropdownState } from './FilterDropdown';
+export { GlobalSearch } from './GlobalSearch';
+export type { GlobalSearchProps, GlobalSearchOption } from './GlobalSearch';
+export { IconButton } from './IconButton';
+export type { IconButtonProps, IconButtonSize, IconButtonColor, IconButtonState } from './IconButton';
+export { InfoIcon, SearchIcon, ChevronDownIcon, ChevronUpIcon, CaretDownIcon, TeamConnectIcon } from './Icons';
+export type { IconProps, IconSize } from './Icons';
+export { Logo } from './Logo';
+export type { LogoProps, LogoSize, LogoVariant } from './Logo';

package/dist/components/Molecules/DropdownMenu/DropdownMenu.d.ts

@@ -0,0 +1,16 @@
+import React from 'react';
+import './DropdownMenu.css';
+export interface DropdownMenuItem {
+    id: string;
+    label: string;
+    icon?: React.ReactNode;
+    onClick?: () => void;
+}
+export interface DropdownMenuProps {
+    items: DropdownMenuItem[];
+    selectedId?: string;
+    onItemClick?: (item: DropdownMenuItem) => void;
+    className?: string;
+}
+export declare const DropdownMenu: React.FC<DropdownMenuProps>;
+export default DropdownMenu;

package/dist/components/Molecules/DropdownMenu/index.d.ts

@@ -0,0 +1,2 @@
+export { DropdownMenu } from './DropdownMenu';
+export type { DropdownMenuProps, DropdownMenuItem } from './DropdownMenu';

package/dist/components/Molecules/HeaderMenu/HeaderMenu.d.ts

@@ -0,0 +1,18 @@
+import React from 'react';
+import type { DropdownMenuItem } from '../DropdownMenu';
+import './HeaderMenu.css';
+export interface HeaderMenuItem {
+    id: string;
+    label: string;
+    icon?: React.ReactNode;
+    dropdownItems?: DropdownMenuItem[];
+}
+export interface HeaderMenuProps {
+    items: HeaderMenuItem[];
+    onItemClick?: (item: HeaderMenuItem) => void;
+    onDropdownItemClick?: (menuItem: HeaderMenuItem, dropdownItem: DropdownMenuItem) => void;
+    className?: string;
+}
+export declare const defaultIcons: Record<string, React.ReactNode>;
+export declare const HeaderMenu: React.FC<HeaderMenuProps>;
+export default HeaderMenu;

package/dist/components/Molecules/HeaderMenu/index.d.ts

@@ -0,0 +1,2 @@
+export { HeaderMenu, defaultIcons } from './HeaderMenu';
+export type { HeaderMenuProps, HeaderMenuItem } from './HeaderMenu';

package/dist/components/Molecules/Search/Search.d.ts

@@ -0,0 +1,19 @@
+import React from 'react';
+import type { GlobalSearchOption } from '../../Atoms';
+import './Search.css';
+export interface SearchProps {
+    placeholder?: string;
+    filterPlaceholder?: string;
+    filterOptions?: GlobalSearchOption[];
+    filterValue?: string;
+    searchValue?: string;
+    disabled?: boolean;
+    showInfoIcon?: boolean;
+    onSearch?: (value: string) => void;
+    onFilterChange?: (value: string) => void;
+    onSubmit?: (searchValue: string, filterValue: string) => void;
+    onInfoClick?: () => void;
+    className?: string;
+}
+export declare const Search: React.FC<SearchProps>;
+export default Search;

package/dist/components/Molecules/Search/index.d.ts

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

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

@@ -0,0 +1,6 @@
+export { Search } from './Search';
+export type { SearchProps } from './Search';
+export { DropdownMenu } from './DropdownMenu';
+export type { DropdownMenuProps, DropdownMenuItem } from './DropdownMenu';
+export { HeaderMenu, defaultIcons } from './HeaderMenu';
+export type { HeaderMenuProps, HeaderMenuItem } from './HeaderMenu';

package/dist/components/Organisms/MainHeader/MainHeader.d.ts

@@ -0,0 +1,20 @@
+import React from 'react';
+import type { HeaderMenuItem } from '../../Molecules';
+import type { DropdownMenuItem } from '../../Molecules';
+import type { GlobalSearchOption } from '../../Atoms';
+import './MainHeader.css';
+export interface MainHeaderProps {
+    showSandbox?: boolean;
+    menuItems?: HeaderMenuItem[];
+    searchFilterOptions?: GlobalSearchOption[];
+    searchPlaceholder?: string;
+    searchFilterPlaceholder?: string;
+    onLogoClick?: () => void;
+    onSearch?: (searchValue: string, filterValue: string) => void;
+    onMenuItemClick?: (menuItem: HeaderMenuItem) => void;
+    onDropdownItemClick?: (menuItem: HeaderMenuItem, dropdownItem: DropdownMenuItem) => void;
+    onInfoClick?: () => void;
+    className?: string;
+}
+export declare const MainHeader: React.FC<MainHeaderProps>;
+export default MainHeader;

package/dist/components/Organisms/MainHeader/index.d.ts

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

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

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

package/dist/components/TC Dazzle UI/FilterDropdown/FilterDropdown.d.ts

@@ -0,0 +1,20 @@
+import React from 'react';
+import './FilterDropdown.css';
+export type FilterDropdownSize = 'small' | 'medium';
+export type FilterDropdownState = 'enabled' | 'disabled' | 'focused';
+export interface FilterDropdownOption {
+    value: string;
+    label: string;
+}
+export interface FilterDropdownProps {
+    value?: string;
+    defaultValue?: string;
+    options?: FilterDropdownOption[];
+    placeholder?: string;
+    size?: FilterDropdownSize;
+    disabled?: boolean;
+    onChange?: (value: string) => void;
+    className?: string;
+}
+export declare const FilterDropdown: React.FC<FilterDropdownProps>;
+export default FilterDropdown;

package/dist/components/TC Dazzle UI/FilterDropdown/index.d.ts

@@ -0,0 +1,2 @@
+export { FilterDropdown } from './FilterDropdown';
+export type { FilterDropdownProps, FilterDropdownOption, FilterDropdownSize, FilterDropdownState } from './FilterDropdown';

package/dist/components/TC Dazzle UI/GlobalSearch/GlobalSearch.d.ts

@@ -0,0 +1,20 @@
+import React from 'react';
+import './GlobalSearch.css';
+export interface GlobalSearchOption {
+    value: string;
+    label: string;
+}
+export interface GlobalSearchProps {
+    placeholder?: string;
+    filterPlaceholder?: string;
+    filterOptions?: GlobalSearchOption[];
+    filterValue?: string;
+    searchValue?: string;
+    disabled?: boolean;
+    onSearch?: (value: string) => void;
+    onFilterChange?: (value: string) => void;
+    onSubmit?: (searchValue: string, filterValue: string) => void;
+    className?: string;
+}
+export declare const GlobalSearch: React.FC<GlobalSearchProps>;
+export default GlobalSearch;

package/dist/components/TC Dazzle UI/GlobalSearch/index.d.ts

@@ -0,0 +1,2 @@
+export { GlobalSearch } from './GlobalSearch';
+export type { GlobalSearchProps, GlobalSearchOption } from './GlobalSearch';

package/dist/components/TC Dazzle UI/IconButton/IconButton.d.ts

@@ -0,0 +1,16 @@
+import React from 'react';
+import './IconButton.css';
+export type IconButtonSize = 'small' | 'medium' | 'large';
+export type IconButtonColor = 'default' | 'primary' | 'secondary';
+export type IconButtonState = 'enabled' | 'hover' | 'disabled';
+export interface IconButtonProps {
+    icon?: React.ReactNode;
+    size?: IconButtonSize;
+    color?: IconButtonColor;
+    disabled?: boolean;
+    onClick?: () => void;
+    ariaLabel?: string;
+    className?: string;
+}
+export declare const IconButton: React.FC<IconButtonProps>;
+export default IconButton;

package/dist/components/TC Dazzle UI/IconButton/index.d.ts

@@ -0,0 +1,2 @@
+export { IconButton } from './IconButton';
+export type { IconButtonProps, IconButtonSize, IconButtonColor, IconButtonState } from './IconButton';

package/dist/components/TC Dazzle UI/Icons/Icons.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+import './Icons.css';
+export type IconSize = 'small' | 'medium' | 'large';
+export interface IconProps {
+    size?: IconSize;
+    color?: string;
+    className?: string;
+}
+export declare const InfoIcon: React.FC<IconProps>;
+export declare const SearchIcon: React.FC<IconProps>;
+export declare const ChevronDownIcon: React.FC<IconProps>;
+export declare const ChevronUpIcon: React.FC<IconProps>;
+export declare const CaretDownIcon: React.FC<IconProps>;

package/dist/components/TC Dazzle UI/Icons/index.d.ts

@@ -0,0 +1,2 @@
+export { InfoIcon, SearchIcon, ChevronDownIcon, ChevronUpIcon, CaretDownIcon, } from './Icons';
+export type { IconProps, IconSize } from './Icons';

package/dist/components/TC Dazzle UI/index.d.ts

@@ -2,3 +2,11 @@ export { Button, ButtonGroup } from './Button';
 export type { ButtonProps, ButtonGroupProps, ButtonVariant, ButtonState } from './Button';
 export { Input } from './Input';
 export type { InputProps, InputType } from './Input';
+export { FilterDropdown } from './FilterDropdown';
+export type { FilterDropdownProps, FilterDropdownOption, FilterDropdownSize, FilterDropdownState } from './FilterDropdown';
+export { GlobalSearch } from './GlobalSearch';
+export type { GlobalSearchProps, GlobalSearchOption } from './GlobalSearch';
+export { IconButton } from './IconButton';
+export type { IconButtonProps, IconButtonSize, IconButtonColor, IconButtonState } from './IconButton';
+export { InfoIcon, SearchIcon, ChevronDownIcon, ChevronUpIcon, CaretDownIcon } from './Icons';
+export type { IconProps, IconSize } from './Icons';