import { AccordionProps as AccordionProps$1 } from '@mui/material/Accordion'; import { OverridableComponent, OverridableTypeMap } from '@mui/material/OverridableComponent'; import { ElementType, ForwardRefExoticComponent, ReactNode, ReactElement, HTMLAttributes, Context, PropsWithChildren, ImgHTMLAttributes, CSSProperties } from 'react'; import { PaperTypeMap, PaperProps as PaperProps$1 } from '@mui/material/Paper'; export { PaperPropsVariantOverrides, PaperTypeMap } from '@mui/material/Paper'; import { AccordionDetailsProps as AccordionDetailsProps$1 } from '@mui/material/AccordionDetails'; import { AccordionSummaryTypeMap, AccordionSummaryProps as AccordionSummaryProps$1 } from '@mui/material/AccordionSummary'; export { AccordionSummaryTypeMap } from '@mui/material/AccordionSummary'; import { CardTypeMap, CardProps as CardProps$1 } from '@mui/material/Card'; export { CardPropsColorOverrides, CardTypeMap } from '@mui/material/Card'; import { CardHeaderTypeMap, CardHeaderProps as CardHeaderProps$1 } from '@mui/material/CardHeader'; export { CardHeaderPropsWithComponent, CardHeaderTypeMap, OverridableCardHeader } from '@mui/material/CardHeader'; import { BoxProps as BoxProps$1 } from '@mui/material/Box'; import { BoxTypeMap } from '@mui/system/Box'; export { BoxTypeMap } from '@mui/system/Box'; import { LoadingButtonTypeMap, LoadingButtonProps } from '@mui/lab/LoadingButton'; export { LoadingButtonTypeMap } from '@mui/lab/LoadingButton'; import { ButtonTypeMap } from '@mui/material'; export { ToggleButton, ToggleButtonGroup } from '@mui/material'; import { MenuProps as MenuProps$1 } from '@mui/material/Menu'; import { AlertProps as AlertProps$1 } from '@mui/material/Alert'; export { AlertColor, AlertPropsColorOverrides, AlertPropsVariantOverrides } from '@mui/material/Alert'; import { AlertTitleProps as AlertTitleProps$1 } from '@mui/material/AlertTitle'; import { TypographyTypeMap, TypographyProps as TypographyProps$1 } from '@mui/material/Typography'; export { TypographyPropsVariantOverrides, TypographyTypeMap } from '@mui/material/Typography'; import { AppBarTypeMap, AppBarProps as AppBarProps$1 } from '@mui/material/AppBar'; export { AppBarPropsColorOverrides, AppBarTypeMap } from '@mui/material/AppBar'; import { AutocompleteProps as AutocompleteProps$1 } from '@mui/material/Autocomplete'; export { AutocompleteChangeDetails, AutocompleteChangeReason, AutocompleteCloseReason, AutocompleteInputChangeReason, AutocompleteOwnerState, AutocompletePropsSizeOverrides, AutocompleteRenderGetTagProps, AutocompleteRenderGroupParams, AutocompleteRenderInputParams, AutocompleteRenderOptionState, createFilterOptions } from '@mui/material/Autocomplete'; import { ChipTypeMap, ChipProps as ChipProps$1 } from '@mui/material/Chip'; export { ChipPropsColorOverrides, ChipPropsSizeOverrides, ChipPropsVariantOverrides, ChipTypeMap } from '@mui/material/Chip'; import { AvatarTypeMap, AvatarProps as AvatarProps$1 } from '@mui/material/Avatar'; export { AvatarPropsVariantOverrides, AvatarTypeMap } from '@mui/material/Avatar'; import { BackdropTypeMap, BackdropProps as BackdropProps$1 } from '@mui/material/Backdrop'; export { BackdropComponentsPropsOverrides, BackdropTypeMap } from '@mui/material/Backdrop'; import { BadgeTypeMap, BadgeProps as BadgeProps$1 } from '@mui/material/Badge'; export { BadgeOrigin, BadgePropsColorOverrides, BadgePropsVariantOverrides } from '@mui/material/Badge'; import { BreadcrumbsTypeMap, BreadcrumbsProps as BreadcrumbsProps$1 } from '@mui/material/Breadcrumbs'; export { BreadcrumbsTypeMap } from '@mui/material/Breadcrumbs'; import { CardActionsProps as CardActionsProps$1 } from '@mui/material/CardActions'; import { CardContentTypeMap, CardContentProps as CardContentProps$1 } from '@mui/material/CardContent'; export { CardContentTypeMap } from '@mui/material/CardContent'; import { ButtonBaseTypeMap } from '@mui/material/ButtonBase'; import { CheckboxProps as CheckboxProps$1 } from '@mui/material/Checkbox'; export { CheckboxPropsColorOverrides, CheckboxPropsSizeOverrides } from '@mui/material/Checkbox'; import { CircularProgressProps as CircularProgressProps$1 } from '@mui/material/CircularProgress'; export { CircularProgressPropsColorOverrides } from '@mui/material/CircularProgress'; import { CollapseProps as CollapseProps$1 } from '@mui/material/Collapse'; import { TransitionProps } from '@mui/material/transitions'; import { ListItemButtonTypeMap, ListItemButtonProps as ListItemButtonProps$1 } from '@mui/material/ListItemButton'; export { ListItemButtonBaseProps, ListItemButtonTypeMap } from '@mui/material/ListItemButton'; import { DrawerProps as DrawerProps$1 } from '@mui/material/Drawer'; import { IconButtonTypeMap, IconButtonProps as IconButtonProps$1 } from '@mui/material/IconButton'; export { IconButtonPropsColorOverrides, IconButtonPropsSizeOverrides, IconButtonTypeMap } from '@mui/material/IconButton'; import { ContainerTypeMap, ContainerProps as ContainerProps$1 } from '@mui/material/Container'; export { ContainerTypeMap } from '@mui/material/Container'; import { GridValidRowModel, DataGridProps as DataGridProps$1 } from '@mui/x-data-grid'; export { GRID_COLUMN_MENU_SLOTS, GRID_COLUMN_MENU_SLOT_PROPS, GridApi, GridColumnHeaders, GridColumnMenu, GridExperimentalFeatures, GridExportExtension, GridExportFormat, GridInitialState, GridState, GridToolbarExportProps, useGridApiContext, useGridApiRef, useGridRootProps } from '@mui/x-data-grid'; export * from '@mui/x-data-grid/components'; export * from '@mui/x-data-grid/constants'; export * from '@mui/x-data-grid/hooks'; export * from '@mui/x-data-grid/locales'; export * from '@mui/x-data-grid/models'; export * from '@mui/x-data-grid/context'; export * from '@mui/x-data-grid/colDef'; export * from '@mui/x-data-grid/utils'; import { DatePickerProps as DatePickerProps$1 } from '@mui/x-date-pickers/DatePicker'; import { InputLabelTypeMap, InputLabelProps as InputLabelProps$1 } from '@mui/material/InputLabel'; export { InputLabelPropsSizeOverrides, InputLabelTypeMap } from '@mui/material/InputLabel'; import { DateTimePickerProps as DateTimePickerProps$1 } from '@mui/x-date-pickers/DateTimePicker'; import { DialogProps as DialogProps$1 } from '@mui/material/Dialog'; import { DialogActionsProps as DialogActionsProps$1 } from '@mui/material/DialogActions'; import { DialogContentProps as DialogContentProps$1 } from '@mui/material/DialogContent'; import { DialogContentTextTypeMap, DialogContentTextProps as DialogContentTextProps$1 } from '@mui/material/DialogContentText'; export { DialogContentTextTypeMap } from '@mui/material/DialogContentText'; import { DialogTitleTypeMap, DialogTitleProps as DialogTitleProps$1 } from '@mui/material/DialogTitle'; export { DialogTitleTypeMap } from '@mui/material/DialogTitle'; import { DividerTypeMap, DividerProps as DividerProps$1 } from '@mui/material/Divider'; export { DividerPropsVariantOverrides, DividerTypeMap } from '@mui/material/Divider'; import { FabTypeMap, FabProps as FabProps$1 } from '@mui/material/Fab'; export { FabPropsColorOverrides, FabPropsSizeOverrides, FabPropsVariantOverrides, FabTypeMap } from '@mui/material/Fab'; import { LinkTypeMap, LinkProps as LinkProps$1 } from '@mui/material/Link'; export { LinkBaseProps, LinkTypeMap } from '@mui/material/Link'; import { FormControlTypeMap, FormControlProps as FormControlProps$1 } from '@mui/material/FormControl'; export { FormControlPropsColorOverrides, FormControlPropsSizeOverrides, FormControlState, FormControlTypeMap, useFormControl } from '@mui/material/FormControl'; import { FormControlLabelProps as FormControlLabelProps$1 } from '@mui/material/FormControlLabel'; import { FormGroupProps as FormGroupProps$1 } from '@mui/material/FormGroup'; import { FormHelperTextTypeMap, FormHelperTextProps as FormHelperTextProps$1 } from '@mui/material/FormHelperText'; export { FormHelperTextPropsVariantOverrides, FormHelperTextTypeMap } from '@mui/material/FormHelperText'; import { FormLabelTypeMap, FormLabelProps as FormLabelProps$1 } from '@mui/material/FormLabel'; export { ExtendFormLabelTypeMap, FormLabelBaseProps, FormLabelOwnProps, FormLabelPropsColorOverrides, FormLabelTypeMap } from '@mui/material/FormLabel'; import { Grid2TypeMap, Grid2Props } from '@mui/material/Unstable_Grid2'; export { Grid2Slot, Grid2TypeMap } from '@mui/material/Unstable_Grid2'; import { InputProps as InputProps$1 } from '@mui/material/Input'; import { InputAdornmentTypeMap, InputAdornmentProps as InputAdornmentProps$1 } from '@mui/material/InputAdornment'; export { InputAdornmentTypeMap } from '@mui/material/InputAdornment'; import { LinearProgressProps as LinearProgressProps$1 } from '@mui/material/LinearProgress'; export { LinearProgressPropsColorOverrides } from '@mui/material/LinearProgress'; import { ListTypeMap, ListProps as ListProps$1 } from '@mui/material/List'; export { ExtendList, ExtendListTypeMap, ListTypeMap } from '@mui/material/List'; import { ListItemProps as ListItemProps$1, ListItemTypeMap } from '@mui/material/ListItem'; export { ListItemBaseProps, ListItemComponentsPropsOverrides, ListItemTypeMap } from '@mui/material/ListItem'; import { ListItemAvatarProps as ListItemAvatarProps$1 } from '@mui/material/ListItemAvatar'; import { ListItemIconProps as ListItemIconProps$1 } from '@mui/material/ListItemIcon'; import { ListItemTextProps as ListItemTextProps$1 } from '@mui/material/ListItemText'; import { LocalizationProviderProps } from '@mui/x-date-pickers'; import { MenuItemTypeMap, MenuItemProps as MenuItemProps$1 } from '@mui/material/MenuItem'; export { MenuItemTypeMap } from '@mui/material/MenuItem'; import { OutlinedInputProps as OutlinedInputProps$1 } from '@mui/material/OutlinedInput'; import { SelectProps as SelectProps$1 } from '@mui/material/Select'; export { SelectChangeEvent } from '@mui/material/Select'; import { PopoverProps as PopoverProps$1 } from '@mui/material/Popover'; export { PopoverActions, PopoverOrigin, PopoverPosition, PopoverReference, getOffsetLeft, getOffsetTop } from '@mui/material/Popover'; import { RadioProps as RadioProps$1 } from '@mui/material/Radio'; export { RadioPropsColorOverrides, RadioPropsSizeOverrides } from '@mui/material/Radio'; import { RadioGroupProps as RadioGroupProps$1 } from '@mui/material/RadioGroup'; export { RadioGroupClassKey } from '@mui/material/RadioGroup'; import { SkeletonTypeMap, SkeletonProps as SkeletonProps$1 } from '@mui/material/Skeleton'; export { SkeletonPropsVariantOverrides, SkeletonTypeMap } from '@mui/material/Skeleton'; import { SnackbarProps as SnackbarProps$1 } from '@mui/material/Snackbar'; export { SnackbarCloseReason, SnackbarOrigin } from '@mui/material/Snackbar'; import { StackTypeMap, StackProps as StackProps$1 } from '@mui/material/Stack'; export { StackTypeMap } from '@mui/material/Stack'; import { StepperTypeMap, StepperProps as StepperProps$1 } from '@mui/material/Stepper'; import { SwitchProps as SwitchProps$1 } from '@mui/material/Switch'; export { SwitchPropsColorOverrides, SwitchPropsSizeOverrides } from '@mui/material/Switch'; import { TabTypeMap, TabProps as TabProps$1 } from '@mui/material/Tab'; export { TabTypeMap } from '@mui/material/Tab'; import { TableTypeMap, TableProps as TableProps$1 } from '@mui/material/Table'; export { TablePropsSizeOverrides, TableTypeMap } from '@mui/material/Table'; import { TableBodyTypeMap, TableBodyProps as TableBodyProps$1 } from '@mui/material/TableBody'; export { TableBodyTypeMap } from '@mui/material/TableBody'; import { TableCellProps as TableCellProps$1 } from '@mui/material/TableCell'; export { SortDirection, TableCellPropsSizeOverrides, TableCellPropsVariantOverrides } from '@mui/material/TableCell'; import { TableContainerTypeMap, TableContainerProps as TableContainerProps$1 } from '@mui/material/TableContainer'; export { TableContainerTypeMap } from '@mui/material/TableContainer'; import { TableFooterTypeMap, TableFooterProps as TableFooterProps$1 } from '@mui/material/TableFooter'; export { TableFooterTypeMap } from '@mui/material/TableFooter'; import { TableHeadTypeMap, TableHeadProps as TableHeadProps$1 } from '@mui/material/TableHead'; export { TableHeadTypeMap } from '@mui/material/TableHead'; import { TableRowTypeMap, TableRowProps as TableRowProps$1 } from '@mui/material/TableRow'; export { TableRowTypeMap } from '@mui/material/TableRow'; import { TabsTypeMap, TabsProps as TabsProps$1 } from '@mui/material/Tabs'; export { TabsActions, TabsPropsIndicatorColorOverrides, TabsTypeMap } from '@mui/material/Tabs'; import { TextFieldProps as TextFieldProps$1 } from '@mui/material/TextField'; export { BaseTextFieldProps, FilledTextFieldProps, OutlinedTextFieldProps, StandardTextFieldProps, TextFieldPropsColorOverrides, TextFieldPropsSizeOverrides } from '@mui/material/TextField'; import { TimePickerProps as TimePickerProps$1 } from '@mui/x-date-pickers/TimePicker'; import { ToolbarTypeMap, ToolbarProps as ToolbarProps$1 } from '@mui/material/Toolbar'; export { ToolbarPropsVariantOverrides, ToolbarTypeMap } from '@mui/material/Toolbar'; import { TooltipProps as TooltipProps$1 } from '@mui/material/Tooltip'; import { Theme as Theme$1, CssVarsTheme, SupportedColorScheme } from '@mui/material/styles'; export { useColorScheme } from '@mui/material/styles'; import { CssVarsProviderConfig } from '@mui/system'; /** * Copyright (c) 2023, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type PaperProps = { /** * The component used for the root node. Either a string to use a HTML element or a component. */ component?: C; } & Omit, 'component'>; /** * The Paper component is a container for displaying content on an elevated surface. * * Demos: * * - [Card (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/surfaces-card) * - [Card (MUI)](https://mui.com/material-ui/react-card/) * - [Paper (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/surfaces-paper) * - [Paper](https://mui.com/material-ui/react-paper/) * * API: * * - [Paper API](https://mui.com/material-ui/api/paper/) * * @remarks * - ✔️ Props of the native component are also available. * - ✅ `component` prop is supported. * - ✅ The `ref` is forwarded to the root element. * * @template C - The type of the component. * @param props - The props for the Paper component. * @param ref - The ref to be forwarded to the MuiPaper component. * @returns The rendered Paper component. */ declare const Paper: OverridableComponent>; /** * Copyright (c) 2024, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type AccordionProps = { /** * The component used for the root node. Either a string to use a HTML element or a component. */ component?: C; } & Omit; /** * The Accordion component lets users show and hide sections of related content on a page. * * Demos: * * - [Accordion (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/surfaces-accordion) * - [Accordion (MUI)](https://mui.com/material-ui/react-accordion/) * * API: * * - [Accordion API](https://mui.com/material-ui/api/accordion/) * - inherits [Paper API](https://mui.com/material-ui/api/paper/) * * @remarks * - ✔️ Props of the [Paper](https://mui.com/material-ui/api/paper/) component are also available. * - ✅ `component` prop is supported. * - ✅ The `ref` is forwarded to the root element. * * @template C - The type of the component. * @param props - The props for the Accordion component. * @param ref - The ref to be forwarded to the MuiAccordion component. * @returns The rendered Accordion component. */ declare const Accordion: OverridableComponent>; /** * Copyright (c) 2023, WSO2 LLC. (https://www.wso2.com). All Rights Reserved. * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type AccordionDetailsProps = AccordionDetailsProps$1; /** * The Accordion Details component is the wrapper for the Accordion content. * * Demos: * * - [Accordion (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/surfaces-accordion) * - [Accordion (MUI)](https://mui.com/material-ui/react-accordion/) * * API: * * - [AccordionDetails API](https://mui.com/material-ui/api/accordion-details/) * * @remarks * - ✔️ Props of the native component are also available. * - ❌ `component` prop is not supported. * - ✅ The `ref` is forwarded to the root element. * * @param props - The props for the AccordionDetails component. * @param ref - The ref to be forwarded to the MuiAccordionDetails component. * @returns The rendered AccordionDetails component. */ declare const AccordionDetails: ForwardRefExoticComponent; /** * Copyright (c) 2023, WSO2 LLC. (https://www.wso2.com). All Rights Reserved. * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type AccordionSummaryProps = { /** * The component used for the root node. Either a string to use a HTML element or a component. */ component?: C; } & Omit, 'component'>; /** * The Accordion Summary component is the wrapper for the Accordion header, which expands or collapses the content when clicked. * * Demos: * * - [Accordion (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/surfaces-accordion) * - [Accordion (MUI)](https://mui.com/material-ui/react-accordion/) * * API: * * - [AccordionSummary API](https://mui.com/material-ui/api/accordion-summary/) * - inherits [ButtonBase API](https://mui.com/material-ui/api/button-base/) * * @remarks * - ✔️ Props of the [ButtonBase](https://mui.com/material-ui/api/button-base/) component are also available. * - ✅ `component` prop is supported. * - ✅ The `ref` is forwarded to the root element. * * @template C - The type of the component. * @param props - The props for the AccordionSummary component. * @param ref - The ref to be forwarded to the MuiAccordionSummary component. * @returns The rendered AccordionSummary component. */ declare const AccordionSummary: OverridableComponent>; /** * Copyright (c) 2023, WSO2 LLC. (https://www.wso2.com). All Rights Reserved. * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type CardProps = { /** * The component used for the root node. Either a string to use a HTML element or a component. */ component?: C; } & Omit, 'component'>; /** * The Card component contain content and actions about a single subject. * * Demos: * * - [Card (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/surfaces-card) * - [Card (MUI)](https://mui.com/material-ui/react-card/) * * API: * * - [Card API](https://mui.com/material-ui/api/card/) * - inherits [Paper API](https://mui.com/material-ui/api/paper/) * * @remarks * - ✔️ Props of the [Paper](https://mui.com/material-ui/api/paper/) component are also available. * - ✅ `component` prop is supported. * - ✅ The `ref` is forwarded to the root element. * * @template C - The type of the component. * @param props - The props for the Card component. * @param ref - The ref to be forwarded to the MuiCard component. * @returns The rendered Card component. */ declare const Card: OverridableComponent>; /** * Copyright (c) 2023, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type CardHeaderProps = { /** * The component used for the root node. Either a string to use a HTML element or a component. */ component?: C; } & Omit, 'component'>; /** * The Card Header component is an optional wrapper for the Card header. * * Demos: * * - [Card (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/surfaces-card) * - [Card (MUI)](https://mui.com/material-ui/react-card/) * * API: * * - [CardHeader API](https://mui.com/material-ui/api/card-header/) * * @remarks * - ✔️ Props of the native component are also available. * - ✅ `component` prop is supported. * - ✅ The `ref` is forwarded to the root element. * * @template C - The type of the component. * @param props - The props for the CardHeader component. * @param ref - The ref to be forwarded to the MuiCardHeader component. * @returns The rendered CardHeader component. */ declare const CardHeader: OverridableComponent>; /** * Copyright (c) 2023, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type BoxProps = { /** * The component used for the root node. Either a string to use a HTML element or a component. */ component?: C; } & Omit, 'component'>; /** * The Box component is a generic, theme-aware container with access to CSS utilities from MUI System. * * Demos: * * - [Box (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/layout-box) * - [Box (MUI)](https://mui.com/material-ui/react-box/) * * API: * * - [Box API](https://mui.com/material-ui/api/box/) * * @remarks * - ✔️ Props of the native component are also available. * - ✅ `component` prop is supported. * - ✅ The `ref` is forwarded to the root element. * * @template C - The type of the component. * @param props - The props for the Badge component. * @param ref - The ref to be forwarded to the MuiBadge component. * @returns The rendered Badge component. */ declare const Box: OverridableComponent>; /** * Copyright (c) 2023-2024, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type CarouselStep = { /** * Action to be performed on the step. * @example */ action?: ReactNode; /** * The description of the step. * @example description */ description?: ReactNode; /** * The illustration to be displayed in the step. * @example icon */ illustration?: ReactElement; /** * The title of the step. * @example title */ title: ReactNode; }; type CarouselProps = Omit, 'title'> & { /** * Specifies whether to auto play the carousel. */ autoPlay?: boolean; /** * Specifies the interval between slide transitions. */ autoPlayInterval?: number; /** * The text to be displayed in the next button. */ nextButtonText?: string; /** * The text to be displayed in the previous button. */ previousButtonText?: string; /** * The steps to be displayed in the carousel. */ steps: CarouselStep[]; /** * The title of the carousel. * @example title */ title?: ReactNode; }; /** * The Carousel component can be used to slide through content. * * Demos: * * - [Carousel(Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/patterns-carousel) * * API: * * - inherits [Box API](https://mui.com/material-ui/api/box/) * * @remarks * - ✨ This is a custom component that is not available in the Material-UI library. * - ✔️ Props of the [Box](https://mui.com/material-ui/api/box/) component are also available. * - ✅ `component` prop is supported. * - ✅ The `ref` is forwarded to the root element. * * @template C - The type of the component. * @param props - The props for the Carousel component. * @param ref - The ref to be forwarded to the Box component. * @returns The rendered Carousel component. */ declare const Carousel: OverridableComponent>; /** * Copyright (c) 2022, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type ButtonProps = { /** * The component used for the root node. Either a string to use a HTML element or a component. */ component?: C; } & Omit, 'component'>; /** * The Button component allow users to take actions, and make choices, with a single tap. * * Demos: * * - [Button (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/inputs-button) * - [Button (MUI)](https://mui.com/material-ui/react-button/) * * API: * * - [LoadingButton API](https://mui.com/material-ui/api/loading-button/) * - inherits [Button API](https://mui.com/material-ui/api/button/) * * @remarks * - ✔️ Props of the [ButtonBase](https://mui.com/material-ui/api/button-base/) component are also available. * - ✅ `component` prop is supported. * - ✅ The `ref` is forwarded to the root element. * * @template C - The type of the component. * @param props - The props for the Button component. * @param ref - The ref to be forwarded to the MuiButton component. * @returns The rendered Button component. */ declare const Button: OverridableComponent>; /** * Copyright (c) 2023, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type MenuProps = { /** * The component used for the root node. Either a string to use a HTML element or a component. */ component?: C; } & Omit; /** * A Menus display a list of choices on temporary surfaces. * * Demos: * * - [App Bar (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/surfaces-app-bar) * - [App Bar (MUI)](https://mui.com/material-ui/react-app-bar/) * - [Menu (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/navigation-menu) * - [Menu (MUI)](https://mui.com/material-ui/react-menu/) * * API: * * - [Menu API](https://mui.com/material-ui/api/menu/) * - inherits [Popover API](https://mui.com/material-ui/api/popover/) * * @remarks * - ✔️ Props of the native component are also available. * - FIXME: ⚠️ `component` prop is temporarily not supported due to https://github.com/wso2/oxygen-ui/issues/283 * - ✅ The `ref` is forwarded to the root element. * * @template C - The type of the component. * @param props - The props for the List component. * @param ref - The ref to be forwarded to the MuiList component. * @returns The rendered List component. */ declare const Menu: ForwardRefExoticComponent; /** * Copyright (c) 2023, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type UserDropdownMenuProps = Omit, 'open' | 'anchorEl'> & { /** * List item icon. */ actionIcon?: ReactNode; /** * List item button text. */ actionText?: string; /** * Footer content. */ footerContent?: ReactNode[]; /** * Menu items to be added to the dropdown menu. */ menuItems?: ReactNode[]; /** * Current mode. */ mode?: string; /** * Array list of modes */ modes?: ModeList[]; /** * Heading of the modes list. */ modesHeading?: string; /** * Callback function on list item action trigger. */ onActionTrigger?: () => void; /** * Callback function on mode change. */ onModeChange?: (mode: string) => void; /** * Callback function on navigation to logged user's profile. */ onUserProfileNavigation?: () => void; /** * Props sent to the menu trigger Button component. */ triggerOptions?: Omit & Record; /** * Logged user information. */ user?: UserTemplate; }; type ModeList = { /** * Icon of the mode. */ icon?: string | ReactElement; /** * Display name of the mode. */ name: string; }; type UserTemplate = { /** * Email of logged user. */ email?: string; /** * Image link of logged user. */ image?: string; /** * Display name of logged user. */ name?: string; }; /** * The User Dropdown Menu lets you display a dropdown menu with user information and actions. * * Demos: * * - [UserDropdownMenu (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/data-display-image) * * API: * * - inherits [Menu API](https://mui.com/material-ui/api/menu/) * * @remarks * - ✨ This is a custom component that is not available in the Material-UI library. * - ✔️ Props of the native component are also available. * - FIXME: ⚠️ `component` prop is temporarily not supported due to https://github.com/wso2/oxygen-ui/issues/283 * - ✅ The `ref` is forwarded to the root element. * * @param props - The props for the UserDropdownMenu component. * @param ref - The ref to be forwarded to the Menu component. * @returns The rendered UserDropdownMenu component. */ declare const UserDropdownMenu: ForwardRefExoticComponent; /** * Copyright (c) 2023, WSO2 LLC. (https://www.wso2.com). All Rights Reserved. * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type AccountOverviewProps = Omit, 'title'> & { /** * Account completion steps. */ accountCompletionSteps?: AccountCompletionSteps[]; /** * Account completion steps title. */ accountCompletionStepsTitle?: string; /** * Account progress. */ accountProgress: number; /** * Card header props. */ cardHeaderProps?: CardHeaderProps; /** * Card Subheader. * @example subheader */ subheader?: ReactNode; /** * Card Title. * @example title */ title: ReactNode; /** * Logged user information. */ user: UserTemplate; }; type AccountCompletionSteps = CarouselStep; /** * The Account Overview component lets you display the progress of the user's account. * It includes the user's profile picture, name, email, account progress and account completion steps. * * Demos: * * - [Account Overview (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/patterns-account-overview) * * API: * * - inherits [Card API](https://mui.com/material-ui/api/card/) * * @remarks * - ✨ This is a custom component that is not available in the Material-UI library. * - ✔️ Props of the [Paper](https://mui.com/material-ui/api/card/) component are also available. * - ✅ `component` prop is supported. * - ✅ The `ref` is forwarded to the root element. * * @template C - The type of the component. * @param props - The props for the AccountOverview component. * @param ref - The ref to be forwarded to the Card component. * @returns The rendered AccountOverview component. */ declare const AccountOverview: OverridableComponent>; /** * Copyright (c) 2023, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type ActionCardProps = CardProps & { /** * The text to be displayed in the action button. */ actionText: string; /** * The description of the card. */ description: string; /** * The image to be displayed in the card. */ image: ReactNode; /** * Callback method to be called when the action button is clicked. */ onActionClick: () => void; /** * The title of the card. */ title: string; }; /** * The Action Card component is an extended version of the `Card` component with an action button. * * Demos: * * - [Action Card (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/surfaces-action-card) * * API: * * - inherits [Card API](https://mui.com/material-ui/api/card/) * * @remarks * - ✨ This is a custom component that is not available in the Material-UI library. * - ✔️ Props of the [Paper](https://mui.com/material-ui/api/card/) component are also available. * - ✅ `component` prop is supported. * - ✅ The `ref` is forwarded to the root element. * * @template C - The type of the component. * @param props - The props for the ActionCard component. * @param ref - The ref to be forwarded to the Card component. * @returns The rendered ActionCard component. */ declare const ActionCard: OverridableComponent>; /** * Copyright (c) 2023, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type AlertProps = { /** * The component used for the root node. Either a string to use a HTML element or a component. */ component?: C; } & Omit; /** * The Alert component displays brief messages to the user without interrupting their use of the app. * * Demos: * * - [Alert (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/feedback-alert) * - [Alert (MUI)](https://mui.com/material-ui/react-alert/) * * API: * * - [Alert API](https://mui.com/material-ui/api/alert/) * - inherits [Paper API](https://mui.com/material-ui/api/paper/) * * @remarks * - ✔️ Props of the [Paper](https://mui.com/material-ui/api/paper/) component are also available. * - ✅ `component` prop is supported. * - ✅ The `ref` is forwarded to the root element. * * @template C - The type of the component. * @param props - The props for the Alert component. * @param ref - The ref to be forwarded to the MuiAlert component. * @returns The rendered Alert component. */ declare const Alert: OverridableComponent>; /** * Copyright (c) 2023, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type TypographyProps = { /** * The component used for the root node. Either a string to use a HTML element or a component. */ component?: C; } & Omit, 'component'>; /** * The Typography can present your design and content as clearly and efficiently as possible. * * Demos: * * - [Breadcrumbs (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/navigation-breadcrumbs) * - [Breadcrumbs (MUI)](https://mui.com/material-ui/react-breadcrumbs/) * - [Typography (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/data-display-typography) * - [Typography (MUI)](https://mui.com/material-ui/react-typography/) * * API: * * - [Typography API](https://mui.com/material-ui/api/typography/) * * @remarks * - ✔️ Props of the native component are also available. * - ✅ `component` prop is supported. * - ✅ The `ref` is forwarded to the root element. * * @template C - The type of the component. * @param props - The props for the Typography component. * @param ref - The ref to be forwarded to the MuiTypography component. * @returns The rendered Typography component. */ declare const Typography: OverridableComponent>; /** * Copyright (c) 2023, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type AlertTitleProps = { /** * The component used for the root node. Either a string to use a HTML element or a component. */ component?: C; } & Omit; /** * The Alert Title component can be used to display a title for the Alert component. * * Demos: * * - [Alert (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/feedback-alert) * - [Alert (MUI)](https://mui.com/material-ui/react-alert/) * * API: * * - [AlertTitle API](https://mui.com/material-ui/api/alert-title/) * - inherits [Typography API](https://mui.com/material-ui/api/typography/) * * @remarks * - ✔️ Props of the [Typography](https://mui.com/material-ui/api/typography/) component are also available. * - ✅ `component` prop is supported. * - ✅ The `ref` is forwarded to the root element. * * @template C - The type of the component. * @param props - The props for the AlertTitle component. * @param ref - The ref to be forwarded to the MuiAlertTitle component. * @returns The rendered AlertTitle component. */ declare const AlertTitle: OverridableComponent>; /** * Copyright (c) 2022, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type AppBarProps = { /** * The component used for the root node. Either a string to use a HTML element or a component. */ component?: C; } & Omit, 'component'>; /** * The App Bar component displays information and actions relating to the current screen. * * Demos: * * - [App Bar (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/surfaces-app-bar) * - [App Bar (MUI)](https://mui.com/material-ui/react-app-bar/) * * API: * * - [AppBar API](https://mui.com/material-ui/api/app-bar/) * - inherits [Paper API](https://mui.com/material-ui/api/paper/) * * @remarks * - ✔️ Props of the [Paper](https://mui.com/material-ui/api/paper/) component are also available. * - ✅ `component` prop is supported. * - ✅ The `ref` is forwarded to the root element. * * @template C - The type of the component. * @param props - The props for the AppBar component. * @param ref - The ref to be forwarded to the MuiAppBar component. * @returns The rendered AppBar component. */ declare const AppBar: OverridableComponent>; /** * Copyright (c) 2023, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type AppShellProps = BoxProps & { /** * Footer component. */ footer?: ReactNode; /** * Header component. */ header?: ReactNode; /** * Navigation component. */ navigation?: ReactNode; }; /** * The App Shell component is a layout component that can be used to create a common Header - Navbar - Footer - Aside - Content layout pattern. * * Demos: * * - [App Shell (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/layout-app-shell) * * API: * * - inherits [Box API](https://mui.com/material-ui/api/box/) * * @remarks * - ✨ This is a custom component that is not available in the Material-UI library. * - ✔️ Props of the [Box](https://mui.com/material-ui/api/box/) component are also available. * - ✅ `component` prop is supported. * - ✅ The `ref` is forwarded to the root element. * * @template C - The type of the component. * @param props - The props for the AppShell component. * @param ref - The ref to be forwarded to the Box component. * @returns The rendered AppShell component. */ declare const AppShell: OverridableComponent>; /** * Copyright (c) 2023, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type ChipProps = { /** * The component used for the root node. Either a string to use a HTML element or a component. */ component?: C; } & Omit, 'component'>; /** * The Chips are compact elements that represent an input, attribute, or action. * * Demos: * * - [Chip (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/data-display-chip) * - [Chip (MUI)](https://mui.com/material-ui/react-chip/) * * API: * * - [Chip API](https://mui.com/material-ui/api/chip/) * * @remarks * - ✔️ Props of the native component are also available. * - ✅ `component` prop is supported. * - ✅ The `ref` is forwarded to the root element. * * @template C - The type of the component. * @param props - The props for the Chip component. * @param ref - The ref to be forwarded to the MuiChip component. * @returns The rendered Chip component. */ declare const Chip: OverridableComponent>; /** * Copyright (c) 2023, WSO2 LLC. (https://www.wso2.com). All Rights Reserved. * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type AutocompleteProps = AutocompleteProps$1; /** * The Autocomplete is a normal text input enhanced by a panel of suggested options. * * Demos: * * - [Autocomplete (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/inputs-autocomplete) * - [Autocomplete (MUI)](https://mui.com/material-ui/react-autocomplete/) * * API: * * - [Autocomplete API](https://mui.com/material-ui/api/autocomplete/) * * @remarks * - ✔️ Props of the native component are also available. * - ❌ `component` prop is not supported. * - ❌ The component cannot hold a `ref`. * * @param props - The props for the Accordion component. * @param ref - The ref to be forwarded to the MuiAccordion component. * @returns The rendered Accordion component. */ declare const Autocomplete: ForwardRefExoticComponent>; /** * Copyright (c) 2023, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type AvatarProps = { /** * Text for the random background color generator. */ backgroundColorRandomizer?: string; /** * The component used for the root node. Either a string to use a HTML element or a component. */ component?: C; /** * If `true`, the background color will be randomly generated. */ randomBackgroundColor?: boolean; } & Omit, 'component'>; /** * Avatars are found throughout material design with uses in everything from tables to dialog menus. * * Demos: * * - [Avatar (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/data-display-avatar) * - [Avatar (MUI)](https://mui.com/material-ui/react-avatar/) * * API: * * - [Avatar API](https://mui.com/material-ui/api/avatar/) * * @remarks * - ✔️ Props of the native component are also available. * - ✅ `component` prop is supported. * - ✅ The `ref` is forwarded to the root element. * * @template C - The type of the component. * @param props - The props for the Avatar component. * @param ref - The ref to be forwarded to the MuiAvatar component. * @returns The rendered Avatar component. */ declare const Avatar: OverridableComponent>; /** * Copyright (c) 2023, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type BackdropProps = { /** * The component used for the root node. Either a string to use a HTML element or a component. */ component?: C; } & Omit, 'component'>; /** * The Backdrop component narrows the user's focus to a particular element on the screen. * * Demos: * * - [Backdrop (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/feedback-backdrop) * - [Backdrop (MUI)](https://mui.com/material-ui/react-backdrop/) * * API: * * - [Backdrop API](https://mui.com/material-ui/api/backdrop/) * - inherits [Fade API](https://mui.com/material-ui/api/fade/) * * @remarks * - ✔️ Props of the [Fade](https://mui.com/material-ui/api/fade/) component are also available. * - ✅ `component` prop is supported. * - ✅ The `ref` is forwarded to the root element. * * @template C - The type of the component. * @param props - The props for the Backdrop component. * @param ref - The ref to be forwarded to the MuiBackdrop component. * @returns The rendered Backdrop component. */ declare const Backdrop: OverridableComponent>; /** * Copyright (c) 2023, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type BadgeProps = { /** * The component used for the root node. Either a string to use a HTML element or a component. */ component?: C; } & Omit, 'component'>; /** * The Badge component generates a small badge to the top-right of its child(ren). * * Demos: * * - [Avatar (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/data-display-avatar) * - [Badge (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/data-display-badge/) * - [Avatar (MUI)](https://mui.com/material-ui/react-avatar/) * - [Badge (MUI)](https://mui.com/material-ui/react-badge/) * * API: * * - [Badge API](https://mui.com/material-ui/api/badge/) * * @remarks * - ✔️ Props of the native component are also available. * - ✅ `component` prop is supported. * - ✅ The `ref` is forwarded to the root element. * * @template C - The type of the component. * @param props - The props for the Badge component. * @param ref - The ref to be forwarded to the MuiBadge component. * @returns The rendered Badge component. */ declare const Badge: OverridableComponent>; /** * Copyright (c) 2023, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type BreadcrumbsProps = { /** * The component used for the root node. Either a string to use a HTML element or a component. */ component?: C; } & Omit, 'component'>; /** * The Breadcrumbs component is a list of links that help visualize a page's location within * a site's hierarchical structure, it allows navigation up to any of the ancestors. * * Demos: * * - [Breadcrumbs (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/navigation-breadcrumbs) * - [Breadcrumbs (MUI)](https://mui.com/material-ui/react-breadcrumbs/) * * API: * * - [Breadcrumbs API](https://mui.com/material-ui/api/breadcrumbs/) * * @remarks * - ✔️ Props of the [Typography](https://mui.com/material-ui/api/typography/) component are also available. * - ✅ `component` prop is supported. * - ✅ The `ref` is forwarded to the root element. * * @template C - The type of the component. * @param props - The props for the Breadcrumbs component. * @param ref - The ref to be forwarded to the MuiBreadcrumbs component. * @returns The rendered Breadcrumbs component. */ declare const Breadcrumbs: OverridableComponent>; /** * Copyright (c) 2023, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type CardActionsProps = CardActionsProps$1; /** * The Card Actions component is an optional wrapper that groups a set of buttons. * * Demos: * * - [Card (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/surfaces-card) * - [Card (MUI)](https://mui.com/material-ui/react-card/) * * API: * * - [CardActions API](https://mui.com/material-ui/api/card-actions/) * * @remarks * - ✔️ Props of the native component are also available. * - ❌ `component` prop is not supported. * - ✅ The `ref` is forwarded to the root element. * * @param props - The props for the CardActions component. * @param ref - The ref to be forwarded to the MuiCardActions component. * @returns The rendered CardActions component. */ declare const CardActions: ForwardRefExoticComponent; /** * Copyright (c) 2023, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type CardContentProps = { /** * The component used for the root node. Either a string to use a HTML element or a component. */ component?: C; } & Omit, 'component'>; /** * The Card Content component is the wrapper for the Card content. * * Demos: * * - [Card (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/surfaces-card) * - [Card (MUI)](https://mui.com/material-ui/react-card/) * * API: * * - [CardContent API](https://mui.com/material-ui/api/card-content/) * * @remarks * - ✔️ Props of the native component are also available. * - ✅ `component` prop is supported. * - ✅ The `ref` is forwarded to the root element. * * @template C - The type of the component. * @param props - The props for the CardContent component. * @param ref - The ref to be forwarded to the MuiCardContent component. * @returns The rendered CardContent component. */ declare const CardContent: OverridableComponent>; /** * Copyright (c) 2023, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type CheckboxProps = { /** * The component used for the root node. Either a string to use a HTML element or a component. */ component?: C; } & Omit; /** * The Checkboxes allow the user to select one or more items from a set. * * Demos: * * - [Checkbox (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/inputs-checkbox) * - [Checkbox (MUI)](https://mui.com/material-ui/react-checkbox/) * - [Transfer List (Oxygen UI)](TODO: Add a link after implementing: Tracker: https://github.com/wso2/oxygen-ui/issues/2) * - [Transfer List (MUI)](https://mui.com/material-ui/react-transfer-list/) * * API: * * - [Checkbox API](https://mui.com/material-ui/api/checkbox/) * - inherits [ButtonBase API](https://mui.com/material-ui/api/button-base/) * * @remarks * - ✔️ Props of the [ButtonBase](https://mui.com/material-ui/api/button-base/) component are also available. * - ✅ `component` prop is supported. * - ✅ The `ref` is forwarded to the root element. * * @template C - The type of the component. * @param props - The props for the Checkbox component. * @param ref - The ref to be forwarded to the MuiCheckbox component. * @returns The rendered Checkbox component. */ declare const Checkbox: OverridableComponent>; /** * Copyright (c) 2023, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type CircularProgressProps = CircularProgressProps$1; /** * The Circular Progress indicators commonly known as spinners, express an unspecified wait * time or display the length of a process. * * Demos: * * TODO: Merge two progress components into one. * - [Progress (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/feedback-circular-progress) * - [Progress (MUI)](https://mui.com/material-ui/react-progress/) * * API: * * - [CircularProgress API](https://mui.com/material-ui/api/circular-progress/) * * @remarks * - ✔️ Props of the native component are also available. * - ❌ `component` prop is not supported. * - ✅ The `ref` is forwarded to the root element. * * @param props - The props for the CircularProgress component. * @param ref - The ref to be forwarded to the MuiCircularProgress component. * @returns The rendered CircularProgress component. */ declare const CircularProgress: ForwardRefExoticComponent; /** * Copyright (c) 2023, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type CircularProgressAvatarProps = Omit & { /** * Props sent to the Avatar component. */ avatarOptions?: Omit; /** * Props sent to the Badge component. */ badgeOptions?: Omit; /** * Value prop sent to CircularProgress component. */ progress?: number; }; /** * The Circular Progress Avatar is a Avatar variant with a circular progress and a badge. * * Demos: * * // TODO: Move this demo to the Progress demo. * - [Circular Progress Avatar (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/data-display-circular-progress-avatar) * * API: * * - [CircularProgress API](https://mui.com/material-ui/api/circular-progress/) * * @remarks * - ✨ This is a custom component that is not available in the Material-UI library. * - ✔️ Props of the native component are also available. * - ❌ `component` prop is not supported. * - ✅ The `ref` is forwarded to the root element. * * @param props - The props for the CircularProgressAvatar component. * @param ref - The ref to be forwarded to the Box component. * @returns The rendered CircularProgressAvatar component. */ declare const CircularProgressAvatar: ForwardRefExoticComponent; /** * Copyright (c) 2023, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type CodeProps = TypographyProps & { /** * Shows the code block with a filled background. * @default true */ filled?: boolean; /** * Renders the code block with an outline. * @default false */ outlined?: boolean; }; /** * The Code can represent an inline or block code without syntax highlight. * * Demos: * * - [Code (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/data-display-code) * * API: * * - inherits [Typography API](https://mui.com/material-ui/api/typography/) * * @remarks * - ✨ This is a custom component that is not available in the Material-UI library. * - ✔️ Props of the [Typography](https://mui.com/material-ui/api/typography/) component are also available. * - ✅ `component` prop is supported. * - ✅ The `ref` is forwarded to the root element. * * @template C - The type of the component. * @param props - The props for the Code component. * @param ref - The ref to be forwarded to the Typography component. * @returns The rendered Code component. */ declare const Code: OverridableComponent>; /** * Copyright (c) 2024, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type CollapseProps> = { /** * The component used for the root node. Either a string to use a HTML element or a component. */ component?: C; } & Omit; /** * A Transition component to expand from the start edge of the child element. * * Demos: * * - [Card (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/surfaces-card) * - [Card (MUI)](https://mui.com/material-ui/react-card/) * - [Lists (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/data-display-list) * - [Lists (MUI)](https://mui.com/material-ui/react-list/) * - [Collapse (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/utils-collapse) * - [Transitions (MUI)](https://mui.com/material-ui/transitions/) * * API: * * - [Collapse API](https://mui.com/material-ui/api/collapse/) * - inherits [Transition API](http://reactcommunity.org/react-transition-group/transition/#Transition-props) * * @remarks * - ✔️ Props of the [Transition](https://mui.com/material-ui/transitions/) component are also available. * - ✅ `component` prop is supported. * - ✅ The `ref` is forwarded to the root element. * * @template C - The type of the component. * @param props - The props for the Collapse component. * @param ref - The ref to be forwarded to the MuiCollapse component. * @returns The rendered Collapse component. */ declare const Collapse: OverridableComponent; /** * Copyright (c) 2023, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type ListItemButtonProps = { /** * The component used for the root node. Either a string to use a HTML element or a component. */ component?: C; } & Omit, 'component'>; /** * The List Item Button an action element to be used inside a list item. * * Demos: * * - [Lists (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/data-display-list) * - [Lists (MUI)](https://mui.com/material-ui/react-list/) * * API: * * - [ListItemButton API](https://mui.com/material-ui/api/list-item-button/) * - inherits [ButtonBase API](https://mui.com/material-ui/api/button-base/) * * @remarks * - ✔️ Props of the [ButtonBase](https://mui.com/material-ui/api/button-base/) component are also available. * - ✅ `component` prop is supported. * - ✅ The `ref` is forwarded to the root element. * * @template C - The type of the component. * @param props - The props for the ListItemButton component. * @param ref - The ref to be forwarded to the MuiListItemButton component. * @returns The rendered ListItemButton component. */ declare const ListItemButton: OverridableComponent>; /** * Copyright (c) 2023, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type DrawerProps = { /** * The component used for the root node. Either a string to use a HTML element or a component. */ component?: C; } & Omit; /** * The navigation drawers (or "sidebars") provide ergonomic access to destinations in a site or * app functionality such as switching accounts. * * Demos: * * - [Drawer (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/navigation-drawer) * - [Drawer (MUI)](https://mui.com/material-ui/react-drawer/) * * API: * * - [Drawer API](https://mui.com/material-ui/api/drawer/) * * @remarks * - ✔️ Props of the native component are also available. * - FIXME: ⚠️ `component` prop is temporarily not supported due to https://github.com/wso2/oxygen-ui/issues/283 * - ✅ The `ref` is forwarded to the root element. * * @template C - The type of the component. * @param props - The props for the Drawer component. * @param ref - The ref to be forwarded to the MuiDrawer component. * @returns The rendered Drawer component. */ declare const Drawer: ForwardRefExoticComponent; /** * Copyright (c) 2023, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type NavbarItemProps = ListItemButtonProps & Pick & { /** * Icon for the Navbar item. * @example */ icon?: ReactNode; /** * Unique id for the item. */ id?: string; /** * Label to display on the UI. * @example Overview */ label: ReactNode; /** * Tag to display on the UI. * @example Beta */ tag?: string; /** * Tag color variant. */ tagClassName?: 'premium' | 'beta' | 'new' | 'experimental'; }; /** * Copyright (c) 2023, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type NavbarProps = DrawerProps & { /** * Is the Navbar collapsible. If `true`, a hamburger will be shown. */ collapsible?: boolean; /** * The fill color variant of the Navbar. */ fill?: 'gradient' | 'solid'; /** * Set of Navbar Items. */ items?: NavbarItems[]; /** * Callback to be called when the hamburger is clicked. */ onOpen?: () => void; /** * Navbar toggle icon. * @default */ toggleIcon?: ReactNode; }; type NavbarItems = { /** * Icon for the item set. */ id?: string; /** * Set of Navbar Items. */ items: NavbarItemProps[]; /** * label for the item set. */ label?: string; }; /** * The Navbar component is used to provide a navigation bar for the application. * * Demos: * * - [Navvar (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/navigation-navbar) * * API: * * - inherits [Drawer API](https://mui.com/material-ui/api/drawer/) * * @remarks * - ✨ This is a custom component that is not available in the Material-UI library. * - ✔️ Props of the [Drawer](https://mui.com/material-ui/api/drawer/) component are also available. * - ✅ `component` prop is supported. * - ✅ The `ref` is forwarded to the root element. * * @template C - The type of the component. * @param props - The props for the Navbar component. * @param ref - The ref to be forwarded to the Drawer component. * @returns The rendered Navbar component. */ declare const Navbar: ForwardRefExoticComponent; /** * Copyright (c) 2023, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type CollapsibleNavbarItemProps = NavbarItemProps & Pick & { /** * Is the item expanded. */ expanded?: boolean; /** * Set of sub items. */ items: NavbarItemProps[]; }; /** * The Collapsible Navbar Item is a custom component that is used to render a collapsible item in the Navbar. * * Demos: * * - [Collapsible Navbar Item (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/navigation-collapsible-navbar-item) * * API: * * - inherits [ListItemButton API](https://mui.com/material-ui/api/list-item-button/) * * @remarks * - ✨ This is a custom component that is not available in the Material-UI library. * - ✔️ Props of the [ButtonBase](https://mui.com/material-ui/api/button-base/) component are also available. * - ✅ `component` prop is supported. * - ✅ The `ref` is forwarded to the root element. * * @template C - The type of the component. * @param props - The props for the CollapsibleNavbarItem component. * @param ref - The ref to be forwarded to the Box component. * @returns The rendered CollapsibleNavbarItem component. */ declare const CollapsibleNavbarItem: OverridableComponent>; /** * Copyright (c) 2023, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type ColorModeToggleProps = { /** * The component used for the root node. Either a string to use a HTML element or a component. */ component?: C; } & Omit, 'component'>; /** * The Toggle to switch between the two palette modes: light (the default) and dark. * * Demos: * * - [Color Mode Toggle (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/theme-color-mode-toggle--overview) * * API: * * - [IconButton API](https://mui.com/material-ui/api/icon-button/) * * @remarks * - ✨ This is a custom component that is not available in the Material-UI library. * - ✔️ Props of the [ButtonBase](https://mui.com/material-ui/api/button-base/) component are also available. * - ✅ `component` prop is supported. * - ✅ The `ref` is forwarded to the root element. * * @template C - The type of the component. * @param props - The props for the ColorModeToggle component. * @param ref - The ref to be forwarded to the IconButton component. * @returns The rendered ColorModeToggle component. */ declare const ColorModeToggle: OverridableComponent>; /** * Copyright (c) 2023, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type ContainerProps = { /** * The component used for the root node. Either a string to use a HTML element or a component. */ component?: C; } & Omit, 'component'>; /** * The container centers your content horizontally. It's the most basic layout element. * * Demos: * * - [Container (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/layout-container) * - [Container (MUI)](https://mui.com/material-ui/react-container/) * * API: * * - [Container API](https://mui.com/material-ui/api/container/) * * @remarks * - ✔️ Props of the native component are also available. * - ✅ `component` prop is supported. * - ✅ The `ref` is forwarded to the root element. * * @template C - The type of the component. * @param props - The props for the Container component. * @param ref - The ref to be forwarded to the MuiContainer component. * @returns The rendered Container component. */ declare const Container: OverridableComponent>; /** * Copyright (c) 2023, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type CountryFlagProps = { /** * The two-letter/three-letter/three-digit country code of the flag. */ countryCode: string; /** * The height of the flag. */ height?: string; } & HTMLAttributes; /** * @deprecated Use the {@link CountryFlagProps} instead. * This will be removed in the next major release (v2.0.0). */ type CountryFlagsProps = CountryFlagProps; /** * The Toggle to switch between the two palette modes: light (the default) and dark. * * Demos: * * - [Country Flag (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/icons-country-flags) * * @remarks * - ✨ This is a custom component that is not available in the Material-UI library. * - ✔️ Props of the native component are also available. * - ❌ `component` prop is not supported. * - ✅ The `ref` is forwarded to the root element. * * @param props - The props for the CountryFlag component. * @param ref - The ref to be forwarded to the WorldFlag component. * @returns The rendered CountryFlag component. */ declare const CountryFlag: ForwardRefExoticComponent; /** * Copyright (c) 2023, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type DataGridProps = DataGridProps$1; /** * The Data Grid component is built with React and TypeScript to provide a smooth UX for manipulating * an unlimited set of data. It features an intuitive API for real-time updates as well as theming * and custom templates—all with blazing-fast performance. * * Demos: * * - [Data Grid (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/data-display-datagrid) * - [Data Grid (MUI X)](https://mui.com/x/react-data-grid/) * * API: * * - [DataGrid API](https://mui.com/x/api/data-grid/data-grid/) * * @remarks * - ✔️ Props of the native component are also available. * - ❌ `component` prop is not supported. * - ✅ The `ref` is forwarded to the root element. * * @param props - The props for the DataGrid component. * @param ref - The ref to be forwarded to the MuiDataGrid component. * @returns The rendered DataGrid component. */ declare const DataGrid: ForwardRefExoticComponent; /** * Copyright (c) 2023, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type InputLabelProps = { /** * The component used for the root node. Either a string to use a HTML element or a component. */ component?: C; } & Omit, 'component'>; /** * The Form Label component is used to provide a label for the form inputs. * * Demos: * * - [Text Field (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/inputs-text-field) * - [Text Field (MUI)](https://mui.com/material-ui/react-text-field/) * * API: * * - [InputLabel API](https://mui.com/material-ui/api/input-label/) * - inherits [FormLabel API](https://mui.com/material-ui/api/form-label/) * * @remarks * - ✔️ Props of the [FormLabel](https://mui.com/material-ui/api/form-label/) component are also available. * - ✅ `component` prop is supported. * - ✅ The `ref` is forwarded to the root element. * * @template C - The type of the component. * @param props - The props for the InputLabel component. * @param ref - The ref to be forwarded to the MuiInputLabel component. * @returns The rendered InputLabel component. */ declare const InputLabel: OverridableComponent>; /** * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type DatePickerProps = { /** * Props for the label of the DatePicker. * This is used to customize the label of the DatePicker. */ InputLabelProps?: InputLabelProps; } & DatePickerProps$1; /** * The DatePicker component lets you select date values. * * Demos: * * - [DatePicker (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/inputs-date-picker) * - [DatePicker (MUI)](https://mui.com/x/react-date-pickers/date-picker/) * * API: * * - [DatePicker API](https://mui.com/x/react-date-pickers/date-picker/#api) * * @remarks * - ✅ Props of the native component are also available * - ❌ `component` prop is not supported. * - ✅ The `ref` is forwarded to the root element. * * @param props - The props for the DatePicker component. * @param ref - The ref to be forwarded to the MuiDatePicker component. * @returns The rendered DatePicker component. */ declare const DatePicker: ForwardRefExoticComponent; /** * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type DateTimePickerProps = { /** * Props for the label of the DateTimePicker. * This is used to customize the label of the DateTimePicker. */ InputLabelProps?: InputLabelProps; } & DateTimePickerProps$1; /** * The DateTimePicker component lets you select date and time values. * * Demos: * * - [DateTimePicker (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/inputs-date-time-picker) * - [DateTimePicker (MUI)](https://mui.com/x/react-date-pickers/date-time-picker/) * * API: * * - [DateTimePicker API](https://mui.com/x/react-date-pickers/date-time-picker/#api) * * @remarks * - ✅ Props of the native component are also available * - ❌ `component` prop is not supported. * - ✅ The `ref` is forwarded to the root element. * * @param props - The props for the DateTimePicker component. * @param ref - The ref to be forwarded to the MuiDateTimePickerComponent. * @returns The rendered DateTimePicker component. */ declare const DateTimePicker: ForwardRefExoticComponent; /** * Copyright (c) 2024, WSO2 LLC. (https://www.wso2.com). All Rights Reserved. * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type DialogProps = { /** * The component used for the root node. Either a string to use a HTML element or a component. */ component?: C; } & Omit; /** * Dialogs inform users about a task and can contain critical information, require decisions, or involve multiple tasks. * * Demos: * * - [Dialog (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/feedback-dialog) * - [Dialog (MUI)](https://mui.com/material-ui/react-dialog/) * * API: * * - [Dialog API](https://mui.com/material-ui/api/dialog/) * - inherits [Modal API](https://mui.com/material-ui/api/modal/) * * @remarks * - ✔️ Props of the [Modal](https://mui.com/material-ui/api/modal/) component are also available. * - FIXME: ⚠️ `component` prop is temporarily not supported due to https://github.com/wso2/oxygen-ui/issues/283 * - ✅ The `ref` is forwarded to the root element. * * @template C - The type of the component. * @param props - The props for the Dialog component. * @param ref - The ref to be forwarded to the MuiDialog component. * @returns The rendered Dialog component. */ declare const Dialog: ForwardRefExoticComponent; /** * Copyright (c) 2024, WSO2 LLC. (https://www.wso2.com). All Rights Reserved. * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type DialogActionsProps = DialogActionsProps$1; /** * The Dialog Actions is an optional container for a Dialog's Buttons. * * Demos: * * - [Dialog (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/feedback-dialog) * - [Dialog (MUI)](https://mui.com/material-ui/react-dialog/) * * API: * * - [DialogActions API](https://mui.com/material-ui/api/dialog-actions/) * * @remarks * - ✔️ Props of the native component are also available. * - ❌ `component` prop is not supported. * - ✅ The `ref` is forwarded to the root element. * * @param props - The props for the DialogActions component. * @param ref - The ref to be forwarded to the MuiDialogActions component. * @returns The rendered DialogActions component. */ declare const DialogActions: ForwardRefExoticComponent; /** * Copyright (c) 2024, WSO2 LLC. (https://www.wso2.com). All Rights Reserved. * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type DialogContentProps = DialogContentProps$1; /** * The Dialog Content is an optional container for displaying the Dialog's content. * * Demos: * * - [Dialog (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/feedback-dialog) * - [Dialog (MUI)](https://mui.com/material-ui/react-dialog/) * * API: * * - [DialogContent API](https://mui.com/material-ui/api/dialog-content/) * * @remarks * - ✔️ Props of the native component are also available. * - ❌ `component` prop is not supported. * - ✅ The `ref` is forwarded to the root element. * * @param props - The props for the DialogContent component. * @param ref - The ref to be forwarded to the MuiDialogContent component. * @returns The rendered DialogContent component. */ declare const DialogContent: ForwardRefExoticComponent; /** * Copyright (c) 2024, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type DialogContentTextProps = { /** * The component used for the root node. Either a string to use a HTML element or a component. */ component?: C; } & Omit, 'component'>; /** * The Dialog Content Text is a wrapper for text inside of ``. * * Demos: * * - [Dialog (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/feedback-dialog) * - [Dialog (MUI)](https://mui.com/material-ui/react-dialog/) * * API: * * - [DialogContentText API](https://mui.com/material-ui/api/dialog-content-text/) * - inherits [Typography API](https://mui.com/material-ui/api/typography/) * * @remarks * - ✔️ Props of the [Typography](https://mui.com/material-ui/api/typography/) component are also available. * - ✅ `component` prop is supported. * - ✅ The `ref` is forwarded to the root element. * * @template C - The type of the component. * @param props - The props for the DialogContentText component. * @param ref - The ref to be forwarded to the MuiDialogContentText component. * @returns The rendered DialogContentText component. */ declare const DialogContentText: OverridableComponent>; /** * Copyright (c) 2024, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type DialogTitleProps = { /** * The component used for the root node. Either a string to use a HTML element or a component. */ component?: C; } & Omit, 'component'>; /** * The Dialog Content Text is a wrapper used for the title of a Dialog. * * Demos: * * - [Dialog (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/feedback-dialog) * - [Dialog (MUI)](https://mui.com/material-ui/react-dialog/) * * API: * * - [DialogTitle API](https://mui.com/material-ui/api/dialog-title/) * - inherits [Typography API](https://mui.com/material-ui/api/typography/) * * @remarks * - ✔️ Props of the [Typography](https://mui.com/material-ui/api/typography/) component are also available. * - ✅ `component` prop is supported. * - ✅ The `ref` is forwarded to the root element. * * @template C - The type of the component. * @param props - The props for the DialogTitle component. * @param ref - The ref to be forwarded to the MuiDialogTitle component. * @returns The rendered DialogTitle component. */ declare const DialogTitle: OverridableComponent>; /** * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ /** * Props interface of {@link DnDContext} */ type DnDContextProps = { /** * Utility function to generate a unique component ID. */ generateComponentId: (prefix?: string) => string; /** * Node object. */ node: any | null; /** * Setter for the node object. * @param node - Node object. */ setNode: (node: any) => void; }; /** * Context object for managing the Drag & Drop context. * * Demos: * * - [Drag & Drop (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/navigation-drag-and-drop--overview) * * API: * * - [DnDContext API (Oxygen UI)](// TODO: TBD) * * @remarks * - ✨ This is a custom context that is not available in the Material-UI library. * * @param props - The props for the DnDContext component. * @returns The rendered DnDContext component. */ declare const DnDContext: Context; /** * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ /** * Props interface of {@link DnDProvider} */ type DnDProviderProps = unknown; /** * This component provides Drag & Drop context to its children. * * Demos: * * - [Drag & Drop (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/navigation-drag-and-drop--overview) * * API: * * - [DnDProvider API (Oxygen UI)](// TODO: TBD) * * @remarks * - ✨ This is a custom provider that is not available in the Material-UI library. * * @param props - The props for the DnDProvider component. * @returns The rendered DnDProvider component. */ declare const DnDProvider: ({ children }: PropsWithChildren) => ReactElement; /** * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ /** * Props interface of {@link DraggableNode} */ type DraggableNodeProps = BoxProps & { /** * The node that is being dragged. */ node: any; }; /** * DraggableNode component can be used to make any node draggable within a drag-and-drop context. * * Demos: * * - [Drag & Drop (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/navigation-drag-and-drop--overview) * * API: * * - inherits [Box API](https://mui.com/material-ui/api/box/) * * @remarks * - ✨ This is a custom component that is not available in the Material-UI library. * - ✔️ Props of the [Box](https://mui.com/material-ui/api/box/) component are also available. * - ✅ `component` prop is supported. * - ✅ The `ref` is forwarded to the root element. * * @template C - The type of the component. * @param props - The props for the DraggableNode component. * @param ref - The ref to be forwarded to the Box component. * @returns The rendered DraggableNode component. */ declare const DraggableNode: OverridableComponent>; /** * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type DroppableNode = any; /** * Props interface of {@link DroppableContainer} * TODO: Extending `any` as a temp workaround to overcome the TS issue. * Tracker: https://github.com/wso2/oxygen-ui/issues/326. */ type DroppableContainerProps = BoxProps & { /** * Function to render the children of the droppable container. * * @param props - The props to be passed to the children. * @returns The rendered children. */ children: (props: { dragHandlers: DragHandlers; getDragItemProps: GetDragItemProps; nodes: DroppableNode[]; }) => ReactNode; /** * The nodes to be rendered inside the droppable container. */ nodes: DroppableNode[]; /** * Callback to handle the order change of nodes. * * @param newOrder - The new order of nodes. */ onOrderChange?: (newOrder: DroppableNode[]) => void; } & any; /** * Interface for the props of a draggable item. */ interface DragItemProps { /** * The class name to be applied to the draggable item. */ className?: string; /** * Indicates whether the item is draggable. */ draggable: boolean; /** * Function to handle the drag end event. */ onDragEnd: () => void; /** * Function to handle the drag enter event. */ onDragEnter: () => void; /** * Function to handle the drag start event. */ onDragStart: () => void; } /** * Type for the function to get the props of a draggable item. * * @param index - The index of the draggable item. * @returns The props of the draggable item. */ type GetDragItemProps = (index: number) => DragItemProps; /** * Interface for the drag handlers. */ interface DragHandlers { /** * Function to handle the drag end event. */ onDragEnd: () => void; /** * Function to handle the drag enter event. * * @param index - The index of the item being dragged over. */ onDragEnter: (index: number) => void; /** * Function to handle the drag start event. * * @param index - The index of the item being dragged. */ onDragStart: (index: number) => void; } /** * DroppableContainer component can be used to handle the re-ordering of nodes within a drag-and-drop context. * * Demos: * * - [Drag & Drop (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/navigation-drag-and-drop--overview) * * API: * * - inherits [Box API](https://mui.com/material-ui/api/box/) * * @remarks * - ✨ This is a custom component that is not available in the Material-UI library. * - ✔️ Props of the [Box](https://mui.com/material-ui/api/box/) component are also available. * - ✅ `component` prop is supported. * - ✅ The `ref` is forwarded to the root element. * * @template C - The type of the component. * @param props - The props for the DroppableContainer component. * @param ref - The ref to be forwarded to the Box component. * @returns The rendered DroppableContainer component. */ declare const DroppableContainer: OverridableComponent>; /** * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ /** * Props interface of {@link useDnD} */ type UseDnDProps = DnDContextProps; /** * Hook that provides Drag & Drop context. * * This hook allows elements to access drag-and-drop related data and functions * provided by the Drag & Drop context. It returns an object containing * the context values defined in the Drag & Drop context. * * @returns An object containing the context values of the Drag & Drop context. * * @throws Will throw an error if the hook is used outside of a Drag & Drop provider. * * @example * ```tsx * const { node, setNode } = useDnD(); * * useEffect(() => { * // Perform drag-and-drop related operations * }, []); * ``` */ declare const useDnD: () => UseDnDProps; /** * Copyright (c) 2023, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type DividerProps = { /** * The component used for the root node. Either a string to use a HTML element or a component. */ component?: C; } & Omit, 'component'>; /** * The Divider provides a thin, unobtrusive line for grouping elements to reinforce visual hierarchy. * * Demos: * * - [Divider (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/data-display-divider) * - [Divider (MUI)](https://mui.com/material-ui/react-divider/) * - [Lists (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/data-display-list) * - [Lists (MUI)](https://mui.com/material-ui/react-list/) * * API: * * - [Divider API](https://mui.com/material-ui/api/divider/) * * @remarks * - ✔️ Props of the native component are also available. * - ✅ `component` prop is supported. * - ✅ The `ref` is forwarded to the root element. * * @template C - The type of the component. * @param props - The props for the Divider component. * @param ref - The ref to be forwarded to the MuiDivider component. * @returns The rendered Divider component. */ declare const Divider: OverridableComponent>; /** * Copyright (c) 2023, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type FabProps = { /** * The component used for the root node. Either a string to use a HTML element or a component. */ component?: C; } & Omit, 'component'>; /** * A Floating Action Button (FAB) performs the primary, or most common, action on a screen. * * Demos: * * - [Floating Action Button (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/inputs-fab) * - [Floating Action Button (MUI)](https://mui.com/material-ui/react-floating-action-button/) * * API: * * - [Fab API](https://mui.com/material-ui/api/fab/) * - inherits [ButtonBase API](https://mui.com/material-ui/api/button-base/) * * @remarks * - ✔️ Props of the [ButtonBase](https://mui.com/material-ui/api/button-base/) component are also available. * - ✅ `component` prop is supported. * - ✅ The `ref` is forwarded to the root element. * * @template C - The type of the component. * @param props - The props for the Fab component. * @param ref - The ref to be forwarded to the MuiFab component. * @returns The rendered Fab component. */ declare const Fab: OverridableComponent>; /** * Copyright (c) 2023, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type LinkProps = { /** * The component used for the root node. Either a string to use a HTML element or a component. */ component?: C; } & Omit, 'component'>; /** * A Link allows you to easily customize anchor elements with your theme colors and typography styles. * * Demos: * * - [Breadcrumbs (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/navigation-breadcrumbs) * - [Breadcrumbs (MUI)](https://mui.com/material-ui/react-breadcrumbs/) * - [Links (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/navigation-link) * - [Links (MUI)](https://mui.com/material-ui/react-link/) * * API: * * - [Link API](https://mui.com/material-ui/api/link/) * - inherits [Typography API](https://mui.com/material-ui/api/typography/) * * @remarks * - ✔️ Props of the [Typography](https://mui.com/material-ui/api/typography/) component are also available. * - ✅ `component` prop is supported. * - ✅ The `ref` is forwarded to the root element. * * @template C - The type of the component. * @param props - The props for the Link component. * @param ref - The ref to be forwarded to the MuiLink component. * @returns The rendered Link component. */ declare const Link: OverridableComponent>; /** * Copyright (c) 2023, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type FooterProps = BoxProps & { /** * Copyright to display. */ copyright?: ReactNode; /** * Footer links. */ links?: LinkProps[]; /** * Determine the max-width of the footer container. */ maxWidth?: ContainerProps['maxWidth']; }; /** * The Footers display a set of links and a copyright at the bottom of the application. * * Demos: * * - [Footer (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/navigation-footer) * * @remarks * - ✨ This is a custom component that is not available in the Material-UI library. * - ✔️ Props of the [Box](https://mui.com/material-ui/api/box/) component are also available. * - ✅ `component` prop is supported. * - ✅ The `ref` is forwarded to the root element. * * @template C - The type of the component. * @param props - The props for the Footer component. * @param ref - The ref to be forwarded to the Box component. * @returns The rendered Footer component. */ declare const Footer: OverridableComponent>; /** * Copyright (c) 2023, WSO2 LLC. (https://www.wso2.com). All Rights Reserved. * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type FormControlProps = { /** * The component used for the root node. Either a string to use a HTML element or a component. */ component?: C; } & Omit, 'component'>; /** * The Form Control apply a common state to form inputs; FormLabel, FormHelperText, Input, InputLabel. * * Demos: * * - [Checkbox (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/inputs-checkbox) * - [Checkbox (MUI)](https://mui.com/material-ui/react-checkbox/) * - [Radio Group (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/inputs-radio-group) * - [Radio Group (MUI)](https://mui.com/material-ui/react-radio-button/) * - [Switch (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/inputs-switch) * - [Switch (MUI)](https://mui.com/material-ui/react-switch/) * - [Text Field (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/inputs-text-field) * - [Text Field (MUI)](https://mui.com/material-ui/react-text-field/) * * API: * * - [FormControl API](https://mui.com/material-ui/api/form-control/) * * @remarks * - ✔️ Props of the native component are also available. * - ✅ `component` prop is supported. * - ✅ The `ref` is forwarded to the root element. * * @template C - The type of the component. * @param props - The props for the FormControl component. * @param ref - The ref to be forwarded to the MuiFormControl component. * @returns The rendered FormControl component. */ declare const FormControl: OverridableComponent>; /** * Copyright (c) 2023, WSO2 LLC. (https://www.wso2.com). All Rights Reserved. * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type FormControlLabelProps = FormControlLabelProps$1; /** * The Form Control Label can be used to display a label for a form control. * * Demos: * * - [Checkbox (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/inputs-checkbox) * - [Checkbox (MUI)](https://mui.com/material-ui/react-checkbox/) * - [Radio Group (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/inputs-radio-group) * - [Radio Group (MUI)](https://mui.com/material-ui/react-radio-button/) * - [Switch (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/inputs-switch) * - [Switch (MUI)](https://mui.com/material-ui/react-switch/) * * API: * * - [FormControlLabel API](https://mui.com/material-ui/api/form-control-label/) * * @remarks * - ✔️ Props of the native component are also available. * - ❌ `component` prop is not supported. * - ✅ The `ref` is forwarded to the root element. * * @param props - The props for the FormControlLabel component. * @param ref - The ref to be forwarded to the MuiFormControlLabel component. * @returns The rendered FormControlLabel component. */ declare const FormControlLabel: ForwardRefExoticComponent; /** * Copyright (c) 2023, WSO2 LLC. (https://www.wso2.com). All Rights Reserved. * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type FormGroupProps = FormGroupProps$1; /** * The Form Group is a helpful wrapper used to group selection control components. * * Demos: * * - [Checkbox (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/inputs-checkbox) * - [Checkbox (MUI)](https://mui.com/material-ui/react-checkbox/) * - [Switch (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/inputs-switch) * - [Switch (MUI)](https://mui.com/material-ui/react-switch/) * * API: * * - [FormGroup API](https://mui.com/material-ui/api/form-group/) * @remarks * - ✔️ Props of the native component are also available. * - ❌ `component` prop is not supported. * - ✅ The `ref` is forwarded to the root element. * * @param props - The props for the FormGroup component. * @param ref - The ref to be forwarded to the MuiFormGroup component. * @returns The rendered FormGroup component. */ declare const FormGroup: ForwardRefExoticComponent; /** * Copyright (c) 2023, WSO2 LLC. (https://www.wso2.com). All Rights Reserved. * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type FormHelperTextProps = { /** * The component used for the root node. Either a string to use a HTML element or a component. */ component?: C; } & Omit, 'component'>; /** * A Form Helper Text component is used to provide additional information about the form inputs. * * Demos: * * - [Text Field (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/inputs-text-field) * - [Text Field (MUI)](https://mui.com/material-ui/react-text-field/) * * API: * * - [FormHelperText API](https://mui.com/material-ui/api/form-helper-text/) * * @remarks * - ✔️ Props of the native component are also available. * - ✅ `component` prop is supported. * - ✅ The `ref` is forwarded to the root element. * * @template C - The type of the component. * @param props - The props for the Fab component. * @param ref - The ref to be forwarded to the MuiFab component. * @returns The rendered Fab component. */ declare const FormHelperText: OverridableComponent>; /** * Copyright (c) 2023, WSO2 LLC. (https://www.wso2.com). All Rights Reserved. * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type FormLabelProps = { /** * The component used for the root node. Either a string to use a HTML element or a component. */ component?: C; } & Omit, 'component'>; /** * A Form Label component is used to provide a label for the form inputs. * * Demos: * * - [Checkbox (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/inputs-checkbox) * - [Checkbox (MUI)](https://mui.com/material-ui/react-checkbox/) * - [Radio Group (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/inputs-radio-group) * - [Radio Group (MUI)](https://mui.com/material-ui/react-radio-button/) * - [Switch (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/inputs-switch) * - [Switch (MUI)](https://mui.com/material-ui/react-switch/) * * API: * * - [FormLabel API](https://mui.com/material-ui/api/form-label/) * * @remarks * - ✔️ Props of the native component are also available. * - ✅ `component` prop is supported. * - ✅ The `ref` is forwarded to the root element. * * @template C - The type of the component. * @param props - The props for the Fab component. * @param ref - The ref to be forwarded to the MuiFab component. * @returns The rendered Fab component. */ declare const FormLabel: OverridableComponent>; /** * Copyright (c) 2023, WSO2 LLC. (https://www.wso2.com). All Rights Reserved. * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type GridProps = { /** * The component used for the root node. Either a string to use a HTML element or a component. */ component?: C; } & Omit, 'component'>; /** * The Grid adapts to screen size and orientation, ensuring consistency across layouts. * * Demos: * * - [Grid (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/layout-grid) * - [Grid (MUI)](https://mui.com/material-ui/react-grid2/) * * API: * * - [Grid API](https://mui.com/material-ui/api/grid-2/) * * @remarks * - ✔️ Props of the native component are also available. * - ✅ `component` prop is supported. * - ✅ The `ref` is forwarded to the root element. * * @template C - The type of the component. * @param props - The props for the FormControl component. * @param ref - The ref to be forwarded to the MuiFormControl component. * @returns The rendered FormControl component. */ declare const Grid: OverridableComponent>; /** * Copyright (c) 2023, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type HeaderProps = AppBarProps & { /** * Brand information. */ brand?: BrandTemplate; /** * Left aligned elements to be rendered. * @remarks This will be rendered on the left side of the header following the brand section. */ leftAlignedElements?: ReactNode[]; /** * List of modes. */ modes?: ModeList[]; /** * Navbar toggle icon. */ navbarToggleIcon?: ReactNode; /** * Function to handle the collapsible hamburger click. */ onCollapsibleHamburgerClick?: () => void; /** * Right aligned elements to be rendered. * @remarks This will be rendered on the right side of the header preceding the user dropdown section. */ rightAlignedElements?: ReactNode[]; /** * Should show the collapsible hamburger icon? */ showCollapsibleHamburger?: boolean; /** * Logged user information. */ user?: UserTemplate; /** * Props to modify the action menu item in the user dropdown menu. */ userDropdownMenu?: UserDropdownMenuHeaderProps; }; type UserDropdownMenuHeaderProps = { /** * Action icon for the user dropdown menu. */ actionIcon?: ReactNode; /** * Action text for the user dropdown menu. */ actionText?: string; /** * Footer content. */ footerContent?: ReactNode[]; /** * Menu items to be added to the user dropdown menu. */ menuItems?: ReactNode[]; /** * Callback to be called on clicking on the action button. */ onActionClick?: () => void; triggerOptions?: Omit & Record; }; type BrandTemplate = { /** * Logo for the brand template. */ logo?: { /** * Desktop logo for the brand template. */ desktop?: ReactNode; /** * Mobile logo for the brand template. */ mobile?: ReactNode; }; /** * Function on clicking on the brand logo and name. */ onClick?: () => void; /** * Title of the brand, portal name or company. */ title?: ReactNode; }; /** * The Header displays the brand, left aligned elements, right aligned elements, and the user dropdown menu. * * Demos: * * - [Header (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/navigation-header) * * API: * * - [AppBar API](https://mui.com/material-ui/api/app-bar/) * * @remarks * - ✨ This is a custom component that is not available in the Material-UI library. * - ✔️ Props of the [AppBar](https://mui.com/material-ui/api/app-bar//) component are also available. * - ✅ `component` prop is supported. * - ✅ The `ref` is forwarded to the root element. * * @template C - The type of the component. * @param props - The props for the Header component. * @param ref - The ref to be forwarded to the AppBar component. * @returns The rendered Header component. */ declare const Header: OverridableComponent>; /** * Copyright (c) 2023, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ /** * @deprecated Use the string literal i.e. "contained" or "text" instead. * This will be removed in the next major release (v2.0.0). */ declare enum IconButtonVariants { CONTAINED = "contained", TEXT = "text" } type IconButtonProps = { /** * The component used for the root node. Either a string to use a HTML element or a component. */ component?: C; /** * The variant of the icon button. */ variant?: IconButtonVariants | 'contained' | 'text'; } & Omit, 'component'>; /** * The Icon Button component is used to render a button with an icon. * * Demos: * * - [Button (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/inputs-button) * - [Button (MUI)](https://mui.com/material-ui/react-button/) * * API: * * - [IconButton API](https://mui.com/material-ui/api/icon-button/) * - inherits [ButtonBase API](https://mui.com/material-ui/api/button-base/) * * @remarks * - ✔️ Props of the native component are also available. * - ✅ `component` prop is supported. * - ✅ The `ref` is forwarded to the root element. * * @template C - The type of the component. * @param props - The props for the IconButton component. * @param ref - The ref to be forwarded to the MuiIconButton component. * @returns The rendered IconButton component. */ declare const IconButton: OverridableComponent>; /** * Copyright (c) 2022, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type ImageProps = ImgHTMLAttributes; /** * The Footers display a set of links and a copyright at the bottom of the application. * * TODO: Refer improvement issue if this Image component is required. * @see {@link https://github.com/wso2/oxygen-ui/issues/65} * * Demos: * * - [Image (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/data-display-image) * * @remarks * - ✨ This is a custom component that is not available in the Material-UI library. * - ✔️ Props of the native component are also available. * - ❌ `component` prop is not supported. * - ✅ The `ref` is forwarded to the root element. * * @param props - The props for the Image component. * @param ref - The ref to be forwarded to the img component. * @returns The rendered Image component. */ declare const Image: ForwardRefExoticComponent; /** * Copyright (c) 2023, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type InputProps = InputProps$1; /** * The Input component is used to render a text input field. * * Demos: * * - [Text Field (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/inputs-text-field) * - [Text Field (MUI)](https://mui.com/material-ui/react-text-field/) * * API: * * - [Input API](https://mui.com/material-ui/api/input/) * - inherits [InputBase API](https://mui.com/material-ui/api/input-base/) * * @remarks * - ✔️ Props of the native component are also available. * - ❌ `component` prop is not supported. * - ✅ The `ref` is forwarded to the root element. * * @param props - The props for the Input component. * @param ref - The ref to be forwarded to the MuiInput component. * @returns The rendered Input component. */ declare const Input: ForwardRefExoticComponent; /** * Copyright (c) 2023, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type InputAdornmentProps = { /** * The component used for the root node. Either a string to use a HTML element or a component. */ component?: C; } & Omit, 'component'>; /** * The Input Adornment can be used to add a prefix, a suffix, or an action to an input. For instance, * you can use an icon button to hide or reveal the password. * * Demos: * * - [Text Field (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/inputs-text-field) * - [Text Field (MUI)](https://mui.com/material-ui/react-text-field/) * * API: * * - [InputAdornment API](https://mui.com/material-ui/api/input-adornment/) * * @remarks * - ✔️ Props of the native component are also available. * - ✅ `component` prop is supported. * - ✅ The `ref` is forwarded to the root element. * * @template C - The type of the component. * @param props - The props for the InputAdornment component. * @param ref - The ref to be forwarded to the MuiInputAdornment component. * @returns The rendered InputAdornment component. */ declare const InputAdornment: OverridableComponent>; /** * Copyright (c) 2023, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type LinearProgressProps = LinearProgressProps$1; /** * The Linear Progress component is used to show the progress of a task in a linear fashion. * * Demos: * * TODO: Merge two progress components into one. * - [Progress (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/feedback-circular-progress) * - [Progress (MUI)](https://mui.com/material-ui/react-progress/) * * API: * * - [LinearProgress API](https://mui.com/material-ui/api/linear-progress/) * * @remarks * - ✔️ Props of the native component are also available. * - ❌ `component` prop is not supported. * - ✅ The `ref` is forwarded to the root element. * * @param props - The props for the LinearProgress component. * @param ref - The ref to be forwarded to the MuiLinearProgress component. * @returns The rendered LinearProgress component. */ declare const LinearProgress: ForwardRefExoticComponent; /** * Copyright (c) 2023, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type ListProps = { /** * The component used for the root node. Either a string to use a HTML element or a component. */ component?: C; } & Omit, 'component'>; /** * A Lists is a continuous, vertical index of text or images. * * Demos: * * - [Lists (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/data-display-list) * - [Lists (MUI)](https://mui.com/material-ui/react-list/) * - [Transfer List (Oxygen UI)](TODO: Add a link after implementing: Tracker: https://github.com/wso2/oxygen-ui/issues/2) * - [Transfer List (MUI)](https://mui.com/material-ui/react-transfer-list/) * * API: * * - [List API](https://mui.com/material-ui/api/list/) * * @remarks * - ✔️ Props of the native component are also available. * - ✅ `component` prop is supported. * - ✅ The `ref` is forwarded to the root element. * * @template C - The type of the component. * @param props - The props for the List component. * @param ref - The ref to be forwarded to the MuiList component. * @returns The rendered List component. */ declare const List: OverridableComponent>; /** * Copyright (c) 2023, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type ListItemProps = { /** * The component used for the root node. Either a string to use a HTML element or a component. */ component?: C; } & Omit, 'component'>; /** * The List Item is a common list item that renders as an
  • by default. * * Demos: * * - [Lists (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/data-display-list) * - [Transfer List (Oxygen UI)](TODO: Add a link after implementing: Tracker: https://github.com/wso2/oxygen-ui/issues/2) * - [Lists (MUI)](https://mui.com/material-ui/react-list/) * - [Transfer List (MUI)](https://mui.com/material-ui/react-transfer-list/) * * API: * * - [ListItem API](https://mui.com/material-ui/api/list-item/) * * @remarks * - ✔️ Props of the native component are also available. * - ✅ `component` prop is supported. * - ✅ The `ref` is forwarded to the root element. * * @template C - The type of the component. * @param props - The props for the ListItem component. * @param ref - The ref to be forwarded to the MuiListItem component. * @returns The rendered ListItem component. */ declare const ListItem: OverridableComponent>; /** * Copyright (c) 2023, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type ListItemAvatarProps = ListItemAvatarProps$1; /** * The List Item Avatar component is used to display an avatar in a list item. * * Demos: * * - [Lists (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/data-display-list) * - [Lists (MUI)](https://mui.com/material-ui/react-list/) * * API: * * - [ListItemAvatar API](https://mui.com/material-ui/api/list-item-avatar/) * * @remarks * - ✔️ Props of the native component are also available. * - ❌ `component` prop is not supported. * - ✅ The `ref` is forwarded to the root element. * * @param props - The props for the ListItemAvatar component. * @param ref - The ref to be forwarded to the MuiListItemAvatar component. * @returns The rendered ListItemAvatar component. */ declare const ListItemAvatar: ForwardRefExoticComponent; /** * Copyright (c) 2023, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type ListItemIconProps = ListItemIconProps$1; /** * The List Item Icon component is used to display an icon in a list item. * * Demos: * * - [Lists (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/data-display-list) * - [Lists (MUI)](https://mui.com/material-ui/react-list/) * * API: * * - [ListItemIcon API](https://mui.com/material-ui/api/list-item-icon/) * * @remarks * - ✔️ Props of the native component are also available. * - ❌ `component` prop is not supported. * - ✅ The `ref` is forwarded to the root element. * * @param props - The props for the ListItemIcon component. * @param ref - The ref to be forwarded to the MuiListItemIcon component. * @returns The rendered ListItemIcon component. */ declare const ListItemIcon: ForwardRefExoticComponent; /** * Copyright (c) 2023, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type ListItemTextProps = ListItemTextProps$1; /** * The List Item Text component is used to display text in a list item. * * Demos: * * - [Lists (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/data-display-list) * - [Lists (MUI)](https://mui.com/material-ui/react-list/) * * API: * * - [ListItemText API](https://mui.com/material-ui/api/list-item-text/) * * @remarks * - ✔️ Props of the native component are also available. * - ❌ `component` prop is not supported. * - ✅ The `ref` is forwarded to the root element. * * @param props - The props for the ListItemText component. * @param ref - The ref to be forwarded to the MuiListItemText component. * @returns The rendered ListItemText component. */ declare const ListItemText: ForwardRefExoticComponent; /** * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ /** * Oxygen UI wrapper for MUI's LocalizationProvider. * Behaves exactly the same as the MUI version. * * Example usage: * ```tsx * import { AdapterDayjs } from '@mui/x-date-pickers/AdapterDayjs'; * import { LocalizationProvider } from '@oxygen-ui/react/LocalizationProvider'; * * * * * ``` * * @see https://mui.com/x/react-date-pickers/localization/ */ declare const LocalizationProvider: (props: LocalizationProviderProps) => ReactElement; /** * Copyright (c) 2023, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type MenuItemProps = { /** * The component used for the root node. Either a string to use a HTML element or a component. */ component?: C; } & Omit, 'component'>; /** * The Menu Item component is used to display a single item inside a menu. * * Demos: * * - [Menu (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/navigation-menu) * - [Menu (MUI)](https://mui.com/material-ui/react-menu/) * * API: * * - [MenuItem API](https://mui.com/material-ui/api/menu-item/) * - inherits [ButtonBase API](https://mui.com/material-ui/api/button-base/) * * @remarks * - ✔️ Props of the [ButtonBase](https://mui.com/material-ui/api/button-base/) component are also available. * - ✅ `component` prop is supported. * - ✅ The `ref` is forwarded to the root element. * * @template C - The type of the component. * @param props - The props for the MenuItem component. * @param ref - The ref to be forwarded to the MuiMenuItem component. * @returns The rendered MenuItem component. */ declare const MenuItem: OverridableComponent>; /** * Copyright (c) 2023, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type OutlinedInputProps = OutlinedInputProps$1; /** * The Outlined Input component is used to render a text input field with an outlined border. * * Demos: * * - [Text Field (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/inputs-text-field) * - [Text Field (MUI)](https://mui.com/material-ui/react-text-field/) * * API: * * - [OutlinedInput API](https://mui.com/material-ui/api/outlined-input/) * - inherits [InputBase API](https://mui.com/material-ui/api/input-base/) * * @remarks * - ✔️ Props of the native component are also available. * - ❌ `component` prop is not supported. * - ✅ The `ref` is forwarded to the root element. * * @param props - The props for the OutlinedInput component. * @param ref - The ref to be forwarded to the MuiOutlinedInput component. * @returns The rendered OutlinedInput component. */ declare const OutlinedInput: ForwardRefExoticComponent; /** * Copyright (c) 2023, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type PhoneNumberInputProps = BoxProps & { /** * Props sent to the InputLabel component. * * Refer props: {@link https://mui.com/material-ui/api/input-label/} */ InputLabelProps?: InputLabelProps; /** * Props sent to the OutlinedInput component. * * Refer props: {@link https://mui.com/material-ui/api/outlined-input/} */ OutlinedInputProps?: Omit; /** * Props sent to the Select component. * * Refer props: {@link https://mui.com/material-ui/api/select/} */ SelectProps?: Omit; /** * Dial code state value. * * @example '+94' */ dialCodeValue?: string; /** * Label for the phone number input. */ label: string; /** * Callback function to be called when the dialCode or phoneNumber changes. */ onChange?: (dialCode: string, phoneNumber: string) => void; /** * Phone number state value. * * @example '787878787' */ phoneNumberValue?: string; /** * Placeholder text for the phone number input. */ placeholder?: string; }; /** * The Phone Number Input component is used to get the phone number input from the user. * * Demos: * * - [Phone Number Input (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/inputs-phone-number-input) * * API: * * - inherits [Box API](https://mui.com/material-ui/api/box/) * * @remarks * - ✨ This is a custom component that is not available in the Material-UI library. * - ✔️ Props of the [Box](https://mui.com/material-ui/api/box/) component are also available. * - ✅ `component` prop is supported. * - ✅ The `ref` is forwarded to the root element. * * @template C - The type of the component. * @param props - The props for the PhoneNumberInput component. * @param ref - The ref to be forwarded to the Box component. * @returns The rendered PhoneNumberInput component. */ declare const PhoneNumberInput: OverridableComponent>; /** * Copyright (c) 2023, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type PopoverProps = { /** * The component used for the root node. Either a string to use a HTML element or a component. */ component?: C; } & Omit; /** * A Popover can be used to display some content on top of another. * * Demos: * * - [Menu (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/navigation-menu) * - [Menu (MUI)](https://mui.com/material-ui/react-menu/) * - [Popover (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/utils-popover) * - [Popover (MUI)](https://mui.com/material-ui/react-popover/) * * API: * * - [Popover API](https://mui.com/material-ui/api/popover/) * - inherits [Modal API](https://mui.com/material-ui/api/modal/) * * @remarks * - ✔️ Props of the [Modal](https://mui.com/material-ui/api/modal/) component are also available. * - FIXME: ⚠️ `component` prop is temporarily not supported due to https://github.com/wso2/oxygen-ui/issues/283 * - ✅ The `ref` is forwarded to the root element. * * @template C - The type of the component. * @param props - The props for the Popover component. * @param ref - The ref to be forwarded to the MuiPopover component. * @returns The rendered Popover component. */ declare const Popover: ForwardRefExoticComponent; /** * Copyright (c) 2023, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type RadioProps = { /** * The component used for the root node. Either a string to use a HTML element or a component. */ component?: C; } & Omit; /** * A Radio component is used to allow users to select a single option from a list of options. * * Demos: * * - [Radio Group (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/inputs-radio-group) * - [Radio Group (MUI)](https://mui.com/material-ui/react-radio-button/) * * API: * * - [Radio API](https://mui.com/material-ui/api/radio/) * - inherits [ButtonBase API](https://mui.com/material-ui/api/button-base/) * * @remarks * - ✔️ Props of the [ButtonBase](https://mui.com/material-ui/api/button-base/) component are also available. * - ✅ `component` prop is supported. * - ✅ The `ref` is forwarded to the root element. * * @template C - The type of the component. * @param props - The props for the Radio component. * @param ref - The ref to be forwarded to the MuiRadio component. * @returns The rendered Radio component. */ declare const Radio: OverridableComponent>; /** * Copyright (c) 2023, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type RadioGroupProps = RadioGroupProps$1; /** * The Radio Group allows the user to select one option from a set. * * Demos: * * - [Radio Group (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/inputs-radio-group) * - [Radio Group (MUI)](https://mui.com/material-ui/react-radio-button/) * * API: * * - [RadioGroup API](https://mui.com/material-ui/api/radio-group/) * - inherits [FormGroup API](https://mui.com/material-ui/api/form-group/) * * @remarks * - ✔️ Props of the [FormGroup](https://mui.com/material-ui/api/form-group/) component are also available. * - ❌ `component` prop is not supported. * - ✅ The `ref` is forwarded to the root element. * * @param props - The props for the RadioGroup component. * @param ref - The ref to be forwarded to the MuiRadioGroup component. * @returns The rendered RadioGroup component. */ declare const RadioGroup: ForwardRefExoticComponent; /** * Copyright (c) 2023, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type SelectProps = SelectProps$1 & { /** * Props for the `InputLabel` component. */ InputLabelProps?: InputLabelProps; }; /** * The Select components are used for collecting user provided information from a list of options. * * Demos: * * - [Select (Oxygen UI)](https://mui.com/material-ui/react-select/) * - [Select (MUI)](https://mui.com/material-ui/react-select/) * * API: * * - [Select API](https://mui.com/material-ui/api/select/) * - inherits [OutlinedInput API](https://mui.com/material-ui/api/outlined-input/) * * @remarks * - ✔️ Props of the [OutlinedInput](https://mui.com/material-ui/api/outlined-input/) component are also available. * - ❌ `component` prop is not supported. * - ✅ The `ref` is forwarded to the root element. * * @param props - The props for the Select component. * @param ref - The ref to be forwarded to the MuiSelect component. * @returns The rendered Select component. */ declare const Select: ForwardRefExoticComponent; /** * Copyright (c) 2022, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type SignInProps = BoxProps & { /** * URL for the login box logo. */ logoUrl?: string; /** * Different Sign In Options. */ signInOptions?: ReactElement; /** * URL for the sign up. */ signUpUrl?: string; }; /** * The Sign In component is a custom component that is used to render a sign-in form. * * Demos: * * - [Sign In (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/patterns-sign-in--overview) * * API: * * - inherits [Box API](https://mui.com/material-ui/api/box/) * * @remarks * - ✨ This is a custom component that is not available in the Material-UI library. * - ✔️ Props of the [Box](https://mui.com/material-ui/api/box/) component are also available. * - ✅ `component` prop is supported. * - ✅ The `ref` is forwarded to the root element. * * @template C - The type of the component. * @param props - The props for the SignIn component. * @param ref - The ref to be forwarded to the Box component. * @returns The rendered SignIn component. */ declare const SignIn: OverridableComponent>; /** * Copyright (c) 2023, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type SkeletonProps = { /** * The component used for the root node. Either a string to use a HTML element or a component. */ component?: C; } & Omit, 'component'>; /** * The Skeleton displays a placeholder preview of your content before the data gets loaded to reduce load-time frustration. * * Demos: * * - [Skeleton (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/feedback-skeleton) * - [Skeleton (MUI)](https://mui.com/material-ui/react-skeleton/) * * API: * * - [Skeleton API](https://mui.com/material-ui/api/skeleton/) * * @remarks * - ✔️ Props of the native component are also available. * - ✅ `component` prop is supported. * - ✅ The `ref` is forwarded to the root element. * * @template C - The type of the component. * @param props - The props for the Skeleton component. * @param ref - The ref to be forwarded to the MuiSkeleton component. * @returns The rendered Skeleton component. */ declare const Skeleton: OverridableComponent>; /** * Copyright (c) 2023, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type SnackbarProps = SnackbarProps$1; /** * The Snackbar (also known as toasts) is used for brief notifications of processes that have been or will be performed. * * Demos: * * - [Snackbar (Oxygen UI)]](https://wso2.github.io/oxygen-ui/react/?path=/docs/feedback-snackbar--overview) * - [Snackbar (MUI)](https://mui.com/material-ui/react-snackbar/) * * API: * * - [Snackbar API](https://mui.com/material-ui/api/snackbar/) * * @remarks * - ✔️ Props of the native component are also available. * - ❌ `component` prop is not supported. * - ✅ The `ref` is forwarded to the root element. * * @param props - The props for the Snackbar component. * @param ref - The ref to be forwarded to the MuiSnackbar component. * @returns The rendered Snackbar component. */ declare const Snackbar: ForwardRefExoticComponent; /** * Copyright (c) 2024, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type StackProps = { /** * The component used for the root node. Either a string to use a HTML element or a component. */ component?: C; } & Omit, 'component'>; /** * The Stack is a container component for arranging elements vertically or horizontally. * * Demos: * * - [Stack (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/layout-stack) * - [Stack (MUI)](https://mui.com/material-ui/react-stack/) * * API: * * - [Stack API](https://mui.com/material-ui/api/stack/) * * @remarks * - ✔️ Props of the native component are also available. * - ✅ `component` prop is supported. * - ✅ The `ref` is forwarded to the root element. * * @template C - The type of the component. * @param props - The props for the Stack component. * @param ref - The ref to be forwarded to the MuiStack component. * @returns The rendered Stack component. */ declare const Stack: OverridableComponent>; /** * Copyright (c) 2023-2024, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type StepperProps = { /** * The component used for the root node. Either a string to use an HTML element or a component. */ component?: C; } & Omit, 'component'>; /** * The Stepper component is used to display a series of steps in a defined sequence. * * Demos: * * - [Stepper (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/navigation-stepper) * - [Stepper (MUI)](https://mui.com/material-ui/react-stepper/) * * API: * * - [Stepper API](https://mui.com/material-ui/api/stepper/) * * @remarks * - ✔️ Props of the native component are also available. * - ✅ `component` prop is supported. * - ✅ The `ref` is forwarded to the root element. * * @template C - The type of the component. * @param props - The props for the Stepper component. * @param ref - The ref to be forwarded to the MuiStepper component. * @returns The rendered Stepper component. */ declare const Stepper: OverridableComponent>; /** * Copyright (c) 2023, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type SwitchProps = { /** * The component used for the root node. Either a string to use a HTML element or a component. */ component?: C; } & Omit; /** * The Switch toggles the state of a single setting on or off. * * Demos: * * - [Switch (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/inputs-switch) * - [Switch (MUI)](https://mui.com/material-ui/react-switch/) * - [Transfer List (Oxygen UI)](TODO: Add a link after implementing: Tracker: https://github.com/wso2/oxygen-ui/issues/2) * - [Transfer List (MUI)](https://mui.com/material-ui/react-transfer-list/) * * API: * * - [Switch API](https://mui.com/material-ui/api/switch/) * - inherits [IconButton API](https://mui.com/material-ui/api/icon-button/) * * @remarks * - ✔️ Props of the [IconButton](https://mui.com/material-ui/api/icon-button/) component are also available. * - ✅ `component` prop is supported. * - ✅ The `ref` is forwarded to the root element. * * @template C - The type of the component. * @param props - The props for the Switch component. * @param ref - The ref to be forwarded to the MuiSwitch component. * @returns The rendered Switch component. */ declare const Switch: OverridableComponent>; /** * Copyright (c) 2023, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type TabProps = { /** * The component used for the root node. Either a string to use a HTML element or a component. */ component?: C; } & Omit, 'component'>; /** * The Tab component is used to create a tab in a tab list. * * Demos: * * - [Tabs (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/navigation-tab) * - [Tabs (MUI)](https://mui.com/material-ui/react-tabs/) * * API: * * - [Tab API](https://mui.com/material-ui/api/tab/) * - inherits [ButtonBase API](https://mui.com/material-ui/api/button-base/) * * @remarks * - ✔️ Props of the [ButtonBase](https://mui.com/material-ui/api/button-base/) component are also available. * - ✅ `component` prop is supported. * - ✅ The `ref` is forwarded to the root element. * * @template C - The type of the component. * @param props - The props for the Tab component. * @param ref - The ref to be forwarded to the MuiTab component. * @returns The rendered Tab component. */ declare const Tab: OverridableComponent>; /** * Copyright (c) 2024, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type TableProps = { /** * The component used for the root node. Either a string to use a HTML element or a component. */ component?: C; } & Omit, 'component'>; /** * The Table component lets display sets of data * * Demos: * * - [Table (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/data-display-table) * - [Table (MUI)](https://mui.com/material-ui/react-table/) * * API: * * - [Table API](https://mui.com/material-ui/api/table/) * * @remarks * - ✅ `component` prop is supported. * - ✅ The `ref` is forwarded to the root element. * * @template C - The type of the component. * @param props - The props for the Table component. * @param ref - The ref to be forwarded to the MuiTable component. * @returns The rendered Table component. */ declare const Table: ForwardRefExoticComponent; /** * Copyright (c) 2024, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type TableBodyProps = { /** * The component used for the root node. Either a string to use a HTML element or a component. */ component?: C; } & Omit, 'component'>; /** * The TableBody component lets display a body of the Table * * API: * - [TableBody API](https://mui.com/material-ui/api/table-head/) * * @remarks * - ✅ `component` prop is supported. * - ✅ The `ref` is forwarded to the root element. * * @template C - The type of the component. * @param props - The props for the TableBody component. * @param ref - The ref to be forwarded to the MuiTable component. * @returns The rendered TableBody component. */ declare const TableBody: ForwardRefExoticComponent; /** * Copyright (c) 2024, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type TableCellProps = { /** * Additional class names for the TableCell. */ className?: string; /** * The component used for the root node. Either a string to use a HTML element or a component. */ component?: C; } & Omit; /** * The TableCell component lets display a cell of the Table * * * API: * - [TableCell API](https://mui.com/material-ui/api/table-cell/) * * @remarks * - ✔️ Props of the native component are also available. * - ✅ `component` prop is supported. * - ✅ The `ref` is forwarded to the root element. * * @template C - The type of the component. * @param props - The props for the TableCell component. * @param ref - The ref to be forwarded to the MuiTableCell component. * @returns The rendered TableCell component. */ declare const TableCell: ForwardRefExoticComponent; /** * Copyright (c) 2024, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type TableContainerProps = { /** * The component used for the root node. Either a string to use a HTML element or a component. */ component?: C; } & Omit, 'component'>; /** * The TableContainer component lets display a container of the table * * Demos: * * - [Table](https://mui.com/material-ui/react-table/) * * API: * * - [TableContainer API](https://mui.com/material-ui/api/table-container/) * @remarks * - ✅ `component` prop is supported. * - ✅ The `ref` is forwarded to the root element. * * @template C - The type of the component. * @param props - The props for the Table component. * @param ref - The ref to be forwarded to the MuiTable component. * @returns The rendered Tablee component. */ declare const TableContainer: ForwardRefExoticComponent; /** * Copyright (c) 2024, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type TableFooterProps = { /** * The component used for the root node. Either a string to use a HTML element or a component. */ component?: C; } & Omit, 'component'>; /** * The TableFooter component lets display a footer of the table * * * API: * - [TableFooter API](https://mui.com/material-ui/api/table-footer/) * * @remarks * - ✅ `component` prop is supported. * - ✅ The `ref` is forwarded to the root element. * * @template C - The type of the component. * @param props - The props for the TableFooter component. * @param ref - The ref to be forwarded to the MuiTableFooter component. * @returns The rendered TableFooter component. */ declare const TableFooter: ForwardRefExoticComponent; /** * Copyright (c) 2024, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type TableHeadProps = { /** * The component used for the root node. Either a string to use a HTML element or a component. */ component?: C; } & Omit, 'component'>; /** * The TableHead component lets display a header of the Table * * * API: * - [TableHead API](https://mui.com/material-ui/api/table-head/) * * @remarks * - ✅ `component` prop is supported. * - ✅ The `ref` is forwarded to the root element. * * @template C - The type of the component. * @param props - The props for the Table component. * @param ref - The ref to be forwarded to the MuiTable component. * @returns The rendered Tablee component. */ declare const TableHead: ForwardRefExoticComponent; /** * Copyright (c) 2024, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type TableRowProps = { /** * The component used for the root node. Either a string to use a HTML element or a component. */ component?: C; /** * If `true`, the table row will not have a bottom border. * @default false * @optional * @type boolean */ hideBorder?: boolean; } & Omit, 'component'>; /** * The TableRow component lets display a row of data * * * API: * - [TableRow API](https://mui.com/material-ui/api/table-row/) * * @remarks * - ✅ `component` prop is supported. * - ✅ The `ref` is forwarded to the root element. * * @template C - The type of the component. * @param props - The props for the Table component. * @param ref - The ref to be forwarded to the MuiTable component. * @returns The rendered Tablee component. */ declare const TableRow: ForwardRefExoticComponent; /** * Copyright (c) 2023, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type TabPanelProps = BoxProps & { index: number; value: number; }; /** * TabPanel component can be used with Tabs component to implement the content of the tab views. * * Demos: * * - [TabPanel (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/navigation-tab-panel--overview) * * API: * * - inherits [Card API](https://mui.com/material-ui/api/card/) * * @remarks * - ✨ This is a custom component that is not available in the Material-UI library. * - ✔️ Props of the [Box](https://mui.com/material-ui/api/box/) component are also available. * - ✅ `component` prop is supported. * - ✅ The `ref` is forwarded to the root element. * * @template C - The type of the component. * @param props - The props for the TabPanel component. * @param ref - The ref to be forwarded to the Box component. * @returns The rendered TabPanel component. */ declare const TabPanel: OverridableComponent>; /** * Copyright (c) 2023, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type TabsProps = { /** * The component used for the root node. Either a string to use a HTML element or a component. */ component?: C; } & Omit, 'component'>; /** * The Skeleton displays a placeholder preview of your content before the data gets loaded to reduce load-time frustration. * * Demos: * * - [Skeleton (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/feedback-skeleton) * - [Skeleton (MUI)](https://mui.com/material-ui/react-skeleton/) * * API: * * - [Skeleton API](https://mui.com/material-ui/api/skeleton/) * * @remarks * - ✔️ Props of the native component are also available. * - ✅ `component` prop is supported. * - ✅ The `ref` is forwarded to the root element. * * @deprecated Use the `Tab` component directly from `@oxygen-ui/react/Tab` instead. * Tracker: https://github.com/wso2/oxygen-ui/issues/340 * * @template C - The type of the component. * @param props - The props for the Skeleton component. * @param ref - The ref to be forwarded to the MuiSkeleton component. * @returns The rendered Skeleton component. */ declare const Tabs: ForwardRefExoticComponent; /** * Copyright (c) 2023, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ /** * @deprecated Use the string literal i.e. "password" or "text" instead. * This will be removed in the next major release (v2.0.0). */ declare enum TextFieldInputTypes { INPUT_PASSWORD = "password", INPUT_TEXT = "text" } type TextFieldProps = { /** * The component used for the root node. Either a string to use a HTML element or a component. */ component?: C; /** * Criteria for user input. */ criteria?: string[]; } & Omit; /** * The Text Fields let users enter and edit text.. * * Demos: * * - [Autocomplete (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/inputs-autocomplete) * - [Autocomplete (MUI)](https://mui.com/material-ui/react-autocomplete/) * - [Text Field (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/inputs-text-field) * - [Text Field (MUI)](https://mui.com/material-ui/react-text-field/) * * API: * * - [TextField API](https://mui.com/material-ui/api/text-field/) * - inherits [FormControl API](https://mui.com/material-ui/api/form-control/) * * @remarks * - ✔️ Props of the [FormControl](https://mui.com/material-ui/api/form-control/) component are also available. * - ✅ `component` prop is supported. * - ✅ The `ref` is forwarded to the root element. * * @template C - The type of the component. * @param props - The props for the TextField component. * @param ref - The ref to be forwarded to the MuiTextField component. * @returns The rendered TextField component. */ declare const TextField: OverridableComponent>; /** * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type TimePickerProps = { /** * Props for the label of the TimePicker. * This is used to customize the label of the TimePicker. */ InputLabelProps?: InputLabelProps; } & TimePickerProps$1; /** * The TimePicker component lets you select time values. * * Demos: * * - [TimePicker (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/inputs-time-picker) * - [TimePicker (MUI)](https://mui.com/x/react-date-pickers/time-picker/) * * API: * * - [TimePicker API](https://mui.com/x/react-date-pickers/time-picker/#api) * * @remarks * - ✅ Props of the native component are also available * - ❌ `component` prop is not supported. * - ❌ The component cannot hold a ref. * * @param props - The props for the TimePicker component. * @param ref - The ref to be forwarded to the MuiTimePicker component. * @returns The rendered TimePicker component. */ declare const TimePicker: ForwardRefExoticComponent; /** * Copyright (c) 2023, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type ToolbarProps = { /** * The component used for the root node. Either a string to use a HTML element or a component. */ component?: C; } & Omit, 'component'>; /** * The Toolbar component is a container for grouping elements such as AppBar. * * Demos: * * - [App Bar (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/surfaces-app-bar) * - [App Bar (MUI)](https://mui.com/material-ui/react-app-bar/) * * API: * * - [Toolbar API](https://mui.com/material-ui/api/toolbar/) * * @remarks * - ✔️ Props of the native component are also available. * - ✅ `component` prop is supported. * - ✅ The `ref` is forwarded to the root element. * * @template C - The type of the component. * @param props - The props for the Skeleton component. * @param ref - The ref to be forwarded to the MuiSkeleton component. * @returns The rendered Skeleton component. */ declare const Toolbar: OverridableComponent>; /** * Copyright (c) 2023, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type TooltipProps = TooltipProps$1; /** * Tooltips display informative text when users hover over, focus on, or tap an element. * * Demos: * * - [Tooltip (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/data-display-tooltip) * - [Tooltip (MUI)](https://mui.com/material-ui/react-tooltip/) * * API: * * - [Tooltip API](https://mui.com/material-ui/api/tooltip/) * * @remarks * - ✔️ Props of the native component are also available. * - ❌ `component` prop is not supported. * - ✅ The `ref` is forwarded to the root element. * * @param props - The props for the Tooltip component. * @param ref - The ref to be forwarded to the MuiTooltip component. * @returns The rendered Tooltip component. */ declare const Tooltip: ForwardRefExoticComponent; /** * Copyright (c) 2023-2024, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type WizardProps = BoxProps & { /** * Allow backward navigation. This will show a button allowing you to navigate backwards. */ allowBackwardNavigation?: boolean; /** * Allow cancel. This will show a button allowing you to cancel the wizard. */ allowCancel?: boolean; /** * Animate the slide transition. */ animateOnSlide?: boolean; /** * Cancel button text. */ cancelButtonText?: string; /** * Finish button text. */ finishButtonText?: string; /** * Next button text. */ nextButtonText?: string; /** * Callback to be called when the cancel button is clicked. */ onCancelButtonClick: () => Promise; /** * Callback to be called when the finish button is clicked. */ onFinishButtonClick: () => Promise; /** * Callback to be called when the next button is clicked. */ onNextButtonClick: () => Promise; /** * Callback to be called when the previous button is clicked. */ onPreviousButtonClick: () => Promise; /** * Previous button text. */ previousButtonText?: string; /** * Steps to be rendered. */ steps: ReactElement[]; /** * Subtitle of the wizard. */ subtitle: string; /** * Title of the wizard. */ title: string; }; /** * The Wizard lets you create a step-by-step wizard with a progress bar. * * Demos: * * - [Wizard (Oxygen UI)](https://wso2.github.io/oxygen-ui/react/?path=/docs/patterns-wizard) * * API: * * - inherits [Box API](https://mui.com/material-ui/api/box/) * * @remarks * - ✨ This is a custom component that is not available in the Material-UI library. * - ✔️ Props of the [Box](https://mui.com/material-ui/api/box/) component are also available. * - ✅ `component` prop is supported. * - ✅ The `ref` is forwarded to the root element. * * @template C - The type of the component. * @param props - The props for the Wizard component. * @param ref - The ref to be forwarded to the Box component. * @returns The rendered Wizard component. */ declare const Wizard: OverridableComponent>; /** * Copyright (c) 2022, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ declare function extendTheme(options: any, ...args: any): Omit & CssVarsTheme; /** * Copyright (c) 2022, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type ThemeProviderProps = Partial> & { /** * The node used to attach the color-scheme attribute * @default document */ colorSchemeNode?: Element | null | undefined; /** * The CSS selector for attaching the generated custom properties * @default ':root' */ colorSchemeSelector?: string; /** * The document used to perform `disableTransitionOnChange` feature * @default document */ documentNode?: Document | null; /** * The window that attaches the 'storage' event listener * @default window */ storageWindow?: Window | null; theme?: { colorSchemes: Record>; cssVarPrefix?: string | undefined; } | undefined; }; declare const ThemeProvider: ({ children, theme, ...rest }: PropsWithChildren) => ReactElement; /** * Copyright (c) 2024, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ /** * Augment the Theme interface with the custom properties for the existing keys. */ declare module '@mui/material/styles' { interface PaletteOptions { customComponents: { AppShell: { Main: { background: string; }; MainWrapper: { background: string; }; }; Footer: { background: string; }; Navbar: { background: string; }; }; gradients: { primary: { stop1: string; stop2: string; }; }; } interface Palette { customComponents: { AppShell: { Main: { background: string; }; MainWrapper: { background: string; }; }; Code: { background: string; }; Footer: { background: string; }; Navbar: { background: string; collapsibleItemBackground: string; }; }; gradients: { primary: { stop1: string; stop2: string; }; }; } interface TypographyVariants { body3: CSSProperties; body4: CSSProperties; body5: CSSProperties; display1: CSSProperties; display2: CSSProperties; } interface TypographyVariantsOptions { body3?: CSSProperties; body4?: CSSProperties; body5?: CSSProperties; display1?: CSSProperties; display2?: CSSProperties; } } /** * Augment the Typography to add the custom variants. */ declare module '@mui/material/Typography' { interface TypographyPropsVariantOverrides { body3: true; body4: true; body5: true; display1: true; display2: true; } } /** * Custom property augmentations. */ interface CustomTheme { customComponents?: { AppShell: { properties: { mainBorderTopLeftRadius: string; navBarTopPosition: string; padding: CSSProperties['padding']; }; }; Chip?: { properties?: { 'beta-background'?: string; 'beta-border-color'?: string; 'beta-text-color'?: string; border?: string; 'border-radius'?: string; 'coming-soon-background'?: string; 'coming-soon-border-color'?: string; 'coming-soon-text-color'?: string; 'default-background'?: string; 'default-border-color'?: string; 'default-text-color'?: string; 'experimental-background'?: string; 'experimental-border-color'?: string; 'experimental-text-color'?: string; 'font-weight'?: string; 'icon-stroke-width'?: string; 'line-height'?: string; 'new-background'?: string; 'new-border-color'?: string; 'new-text-color'?: string; 'premium-background'?: string; 'premium-border-color'?: string; 'premium-text-color'?: string; 'text-fill-color'?: string; 'text-transform'?: string; }; }; Header?: { properties?: { 'min-height'?: string; }; }; Navbar?: { properties?: { 'mini-variant-width'?: string; width?: string; }; }; Stepper?: { properties?: Record; }; }; } type Theme = Omit & CssVarsTheme & CustomTheme; /** * Copyright (c) 2022, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ declare const useTheme: () => T; /** * Copyright (c) 2023, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ interface UsePastelColorGenerator { /** * Generated color. */ color: string; /** * Function to update the text. * @param newText - New text to generate the color from. * @returns void */ updateText: (newText: string) => void; } /** * Hook to generate a pastel color based on the given text. * * @example * const {color, updateText} = usePastelColorGenerator('John Doe'); * console.log(color); // hsl(0 70% 80% / 50%) * updateText('Jane Doe'); * console.log(color); // hsl(240 70% 80% / 50%) * * @param initialText - Text to generate the color from. * @returns Generated color and a function to update the text. */ declare const usePastelColorGenerator: (initialText: string) => UsePastelColorGenerator; /** * Copyright (c) 2023, WSO2 LLC. (https://www.wso2.com). * * WSO2 LLC. licenses this file to you under the Apache License, * Version 2.0 (the "License"); you may not use this file except * in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, * software distributed under the License is distributed on an * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * KIND, either express or implied. See the License for the * specific language governing permissions and limitations * under the License. */ type GenerateColor = (display: string) => string; /** * Generate a pastel color based on the given text. * * @example * const color = generatePastelColor('John Doe'); * console.log(color); // hsl(0 70% 80% / 50%) * * @param text - Text to generate the color from. * @returns Generated color. */ declare const generatePastelColor: GenerateColor; export { Accordion, AccordionDetails, AccordionDetailsProps, AccordionProps, AccordionSummary, AccordionSummaryProps, AccountCompletionSteps, AccountOverview, AccountOverviewProps, ActionCard, ActionCardProps, Alert, AlertProps, AlertTitle, AlertTitleProps, AppBar, AppBarProps, AppShell, AppShellProps, Autocomplete, AutocompleteProps, Avatar, AvatarProps, Backdrop, BackdropProps, Badge, BadgeProps, Box, BoxProps, BrandTemplate, Breadcrumbs, BreadcrumbsProps, Button, ButtonProps, Card, CardActions, CardActionsProps, CardContent, CardContentProps, CardHeader, CardHeaderProps, CardProps, Carousel, CarouselProps, CarouselStep, Checkbox, CheckboxProps, Chip, ChipProps, CircularProgress, CircularProgressAvatar, CircularProgressAvatarProps, CircularProgressProps, Code, CodeProps, Collapse, CollapseProps, CollapsibleNavbarItem, CollapsibleNavbarItemProps, ColorModeToggle, ColorModeToggleProps, Container, ContainerProps, CountryFlag, CountryFlagProps, CountryFlagsProps, DataGrid, DataGridProps, DatePicker, DatePickerProps, DateTimePicker, DateTimePickerProps, Dialog, DialogActions, DialogActionsProps, DialogContent, DialogContentProps, DialogContentText, DialogContentTextProps, DialogProps, DialogTitle, DialogTitleProps, Divider, DividerProps, DnDContext, DnDContextProps, DnDProvider, DnDProviderProps, DragHandlers, DragItemProps, DraggableNode, DraggableNodeProps, Drawer, DrawerProps, DroppableContainer, DroppableContainerProps, Fab, FabProps, Footer, FooterProps, FormControl, FormControlLabel, FormControlLabelProps, FormControlProps, FormGroup, FormGroupProps, FormHelperText, FormHelperTextProps, FormLabel, FormLabelProps, GetDragItemProps, Grid, GridProps, Header, HeaderProps, IconButton, IconButtonProps, IconButtonVariants, Image, ImageProps, Input, InputAdornment, InputAdornmentProps, InputLabel, InputLabelProps, InputProps, LinearProgress, LinearProgressProps, Link, LinkProps, List, ListItem, ListItemAvatar, ListItemAvatarProps, ListItemButton, ListItemButtonProps, ListItemIcon, ListItemIconProps, ListItemProps, ListItemText, ListItemTextProps, ListProps, LocalizationProvider, Menu, MenuItem, MenuItemProps, MenuProps, ModeList, Navbar, NavbarItems, NavbarProps, OutlinedInput, OutlinedInputProps, Paper, PaperProps, PhoneNumberInput, PhoneNumberInputProps, Popover, PopoverProps, Radio, RadioGroup, RadioGroupProps, RadioProps, Select, SelectProps, SignIn, SignInProps, Skeleton, SkeletonProps, Snackbar, SnackbarProps, Stack, StackProps, Stepper, StepperProps, Switch, SwitchProps, Tab, TabPanel, TabPanelProps, TabProps, Table, TableBody, TableBodyProps, TableCell, TableCellProps, TableContainer, TableContainerProps, TableFooter, TableFooterProps, TableHead, TableHeadProps, TableProps, TableRow, TableRowProps, Tabs, TabsProps, TextField, TextFieldInputTypes, TextFieldProps, Theme, ThemeProvider, TimePicker, TimePickerProps, Toolbar, ToolbarProps, Tooltip, TooltipProps, Typography, TypographyProps, UseDnDProps, UsePastelColorGenerator, UserDropdownMenu, UserDropdownMenuHeaderProps, UserDropdownMenuProps, UserTemplate, Wizard, WizardProps, generatePastelColor as default, extendTheme, useDnD, usePastelColorGenerator, useTheme };