@rabex-kit/rabex-ui 0.2.74 → 0.2.76

package/dist/Switch/index.d.ts

@@ -0,0 +1,32 @@
+import React from 'react';
+import { SwitchProps as MuiSwitchProps } from '@mui/material';
+export declare type SwitchProps = MuiSwitchProps;
+declare module '@mui/material/Switch' {
+    interface SwitchPropsSizeOverrides {
+        small: true;
+        medium: true;
+        sm: true;
+        xs: true;
+        '2xs': true;
+    }
+}
+/**
+ * Rabex Switch
+ *
+ * A thin wrapper around MUI Switch.
+ *
+ * Styling and behavior are controlled exclusively via theme overrides.
+ * This keeps the component lightweight, predictable, and consistent
+ * across the application.
+ *
+ * @example
+ * ```tsx
+ * import { Switch } from '@rabex-kit/rabex-ui';
+ *
+ * <Switch checked={value} onChange={handleChange} />
+ * ```
+ *
+ * For labeling, always use `FormControlLabel`.
+ */
+declare const Switch: React.FC<SwitchProps>;
+export default Switch;

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

@@ -0,0 +1,18 @@
+import { Theme } from '@mui/material';
+declare const _default: {
+    components: {
+        defaultProps?: Partial<import("@mui/material").SwitchProps> | undefined;
+        styleOverrides?: Partial<Record<"root" | "edgeStart" | "edgeEnd" | "switchBase" | "colorPrimary" | "colorSecondary" | "sizeSmall" | "sizeMedium" | "checked" | "disabled" | "input" | "thumb" | "track", string | number | boolean | import("@mui/styled-engine").CSSObject | import("@mui/styled-engine").ComponentSelector | import("@mui/styled-engine").Keyframes | import("@mui/styled-engine").SerializedStyles | import("@mui/styled-engine").ArrayCSSInterpolation | ((props: {
+            ownerState: import("@mui/material").SwitchProps & Record<string, unknown>;
+        } & {
+            theme: Pick<Theme, "unstable_sx" | "unstable_sxConfig" | "mixins" | "palette" | "shadows" | "transitions" | "typography" | "zIndex" | "unstable_strictMode" | "shape" | "breakpoints" | "direction" | "spacing">;
+        } & Record<string, unknown>) => import("@mui/styled-engine").CSSInterpolation) | null | undefined>> | undefined;
+        variants?: {
+            props: Partial<import("@mui/material").SwitchProps>;
+            style: import("@mui/styled-engine").Interpolation<{
+                theme: Theme;
+            }>;
+        }[] | undefined;
+    };
+};
+export default _default;

package/dist/index.d.ts

@@ -117,5 +117,6 @@ import UploadButton, { UploadButtonProps } from './UploadButton';
 import Zoom, { ZoomProps } from './Zoom';
 import SegmentedControl, { SegmentedControlProps } from './SegmentedControl';
 import SegmentedControlTab, { SegmentedControlTabProps } from './SegmentedControlTab';
-export { theme, Typography, Button, LoadingButton, Tabs, Tab, Box, Grid, NoSsr, Skeleton, Stack, Chip, Paper, Divider, Checkbox, Radio, Tooltip, Avatar, Breadcrumbs, CurrencyPairsTitle, List, ListItem, ListItemButton, ListItemIcon, ListItemAvatar, ListItemSecondaryAction, ListSubHeader, ListItemText, SvgIcon, ToggleButton, ToggleButtonGroup, TabPanel, IconButton, Select, SelectItem, DynamicBackground, DynamicBackgroundContainer, Table, TableHead, TableBody, TableRow, TableCell, TableContainer, TablePagination, TableFooter, TableSortLabel, RTable, RTableHead, RTableRow, Input, InputLabel, RadioGroup, FormLabel, FormControl, FormGroup, FormControlLabel, FormHelperText, TabContext, TabList, Link, useTheme, useCopyToClipboard, useMediaQuery, useOnScreen, useScrollTrigger, useTime, useWindowSize, useResponsive, numberUtils, searchUtils, Slider, InputAdornment, Accordion, AccordionDetails, AccordionActions, AccordionSummary, Stepper, StepContent, StepConnector, StepButton, StepIcon, Step, StepLabel, MobileStepper, CssBaseline, Backdrop, Modal, ModalContent, Container, Alert, AlertAction, AlertTimer, AlertTitle, UploadButton, Snackbar, SnackbarContent, LinearProgress, CircularProgress, TextField, FormikTextField, FormikInput, FormikSelect, MenuItem, ThemeProvider, styled, MenuList, Menu, Popover, Popper, Fade, Autocomplete, Zoom, Collapse, Grow, Slide, Dialog, DialogActions, DialogContent, DialogTitle, SwipeableDrawer, SeeMore, ClickAwayListener, Pagination, PaginationItem, Drawer, SliderContent, SegmentedControl, SegmentedControlTab, };
-export type { Theme, CSSObject, TypographyProps, ButtonProps, LoadingButtonProps, TabsProps, TabProps, BoxProps, GridProps, NoSsrProps, SkeletonProps, StackProps, ChipProps, PaperProps, DividerProps, CheckboxProps, RadioProps, TooltipProps, BreadcrumbsProps, ListProps, ListItemProps, ListItemAvatarProps, ListItemButtonProps, ListItemIconProps, ListItemTextProps, ListItemSecondaryActionProps, ListSubHeaderProps, SvgIconProps, ToggleButtonProps, ToggleButtonGroupProps, TabPanelProps, IconButtonProps, AvatarProps, CurrencyPairsTitleProps, SelectProps, SelectItemProps, DynamicBackgroundProps, DynamicBackgroundContainerProps, TableProps, TableHeadProps, TableBodyProps, TableRowProps, TableCellProps, TableContainerProps, TablePaginationProps, TableFooterProps, TableSortLabelProps, RTableProps, RTableRowProps, RTableHeadProps, InputProps, InputLabelProps, RadioGroupProps, FormLabelProps, FormControlProps, FormGroupProps, FormControlLabelProps, FormHelperTextProps, TabContextProps, TabListProps, LinkProps, SliderProps, InputAdornmentProps, AccordionProps, AccordionDetailsProps, AccordionActionsProps, AccordionSummaryProps, StepperProps, StepContentProps, StepConnectorProps, StepButtonProps, StepIconProps, StepProps, StepLabelProps, MobileStepperProps, Palette, PaletteColor, BackdropProps, ModalProps, ModalContentProps, ContainerProps, AlertProps, AlertActionProps, AlertTimerProps, AlertTitleProps, UploadButtonProps, SnackbarProps, SnackbarContentProps, LinearProgressProps, CircularProgressProps, TextFieldProps, FormikTextFieldProps, FormikInputProps, FormikSelectProps, MenuItemProps, MenuListProps, MenuProps, PopoverProps, PopperProps, ZoomProps, CollapseProps, FadeProps, AutocompleteProps, GrowProps, SlideProps, DialogProps, DialogActionsProps, DialogContentProps, DialogTitleProps, SwipeableDrawerProps, SeeMoreProps, ClickAwayListenerProps, PaginationProps, PaginationItemProps, DrawerProps, SliderContentProps, SegmentedControlProps, SegmentedControlTabProps };
+import Switch, { SwitchProps } from './Switch';
+export { theme, Typography, Button, LoadingButton, Tabs, Tab, Box, Grid, NoSsr, Skeleton, Stack, Chip, Paper, Divider, Checkbox, Radio, Tooltip, Avatar, Breadcrumbs, CurrencyPairsTitle, List, ListItem, ListItemButton, ListItemIcon, ListItemAvatar, ListItemSecondaryAction, ListSubHeader, ListItemText, SvgIcon, ToggleButton, ToggleButtonGroup, TabPanel, IconButton, Select, SelectItem, DynamicBackground, DynamicBackgroundContainer, Table, TableHead, TableBody, TableRow, TableCell, TableContainer, TablePagination, TableFooter, TableSortLabel, RTable, RTableHead, RTableRow, Input, InputLabel, RadioGroup, FormLabel, FormControl, FormGroup, FormControlLabel, FormHelperText, TabContext, TabList, Link, useTheme, useCopyToClipboard, useMediaQuery, useOnScreen, useScrollTrigger, useTime, useWindowSize, useResponsive, numberUtils, searchUtils, Slider, InputAdornment, Accordion, AccordionDetails, AccordionActions, AccordionSummary, Stepper, StepContent, StepConnector, StepButton, StepIcon, Step, StepLabel, MobileStepper, CssBaseline, Backdrop, Modal, ModalContent, Container, Alert, AlertAction, AlertTimer, AlertTitle, UploadButton, Snackbar, SnackbarContent, LinearProgress, CircularProgress, TextField, FormikTextField, FormikInput, FormikSelect, MenuItem, ThemeProvider, styled, MenuList, Menu, Popover, Popper, Fade, Autocomplete, Zoom, Collapse, Grow, Slide, Dialog, DialogActions, DialogContent, DialogTitle, SwipeableDrawer, SeeMore, ClickAwayListener, Pagination, PaginationItem, Drawer, SliderContent, SegmentedControl, SegmentedControlTab, Switch, };
+export type { Theme, CSSObject, TypographyProps, ButtonProps, LoadingButtonProps, TabsProps, TabProps, BoxProps, GridProps, NoSsrProps, SkeletonProps, StackProps, ChipProps, PaperProps, DividerProps, CheckboxProps, RadioProps, TooltipProps, BreadcrumbsProps, ListProps, ListItemProps, ListItemAvatarProps, ListItemButtonProps, ListItemIconProps, ListItemTextProps, ListItemSecondaryActionProps, ListSubHeaderProps, SvgIconProps, ToggleButtonProps, ToggleButtonGroupProps, TabPanelProps, IconButtonProps, AvatarProps, CurrencyPairsTitleProps, SelectProps, SelectItemProps, DynamicBackgroundProps, DynamicBackgroundContainerProps, TableProps, TableHeadProps, TableBodyProps, TableRowProps, TableCellProps, TableContainerProps, TablePaginationProps, TableFooterProps, TableSortLabelProps, RTableProps, RTableRowProps, RTableHeadProps, InputProps, InputLabelProps, RadioGroupProps, FormLabelProps, FormControlProps, FormGroupProps, FormControlLabelProps, FormHelperTextProps, TabContextProps, TabListProps, LinkProps, SliderProps, InputAdornmentProps, AccordionProps, AccordionDetailsProps, AccordionActionsProps, AccordionSummaryProps, StepperProps, StepContentProps, StepConnectorProps, StepButtonProps, StepIconProps, StepProps, StepLabelProps, MobileStepperProps, Palette, PaletteColor, BackdropProps, ModalProps, ModalContentProps, ContainerProps, AlertProps, AlertActionProps, AlertTimerProps, AlertTitleProps, UploadButtonProps, SnackbarProps, SnackbarContentProps, LinearProgressProps, CircularProgressProps, TextFieldProps, FormikTextFieldProps, FormikInputProps, FormikSelectProps, MenuItemProps, MenuListProps, MenuProps, PopoverProps, PopperProps, ZoomProps, CollapseProps, FadeProps, AutocompleteProps, GrowProps, SlideProps, DialogProps, DialogActionsProps, DialogContentProps, DialogTitleProps, SwipeableDrawerProps, SeeMoreProps, ClickAwayListenerProps, PaginationProps, PaginationItemProps, DrawerProps, SliderContentProps, SegmentedControlProps, SegmentedControlTabProps, SwitchProps, };

package/dist/rabex-ui.cjs.development.js

@@ -123,6 +123,7 @@ var MuiStepper = _interopDefault(require('@mui/material/Stepper/Stepper.js'));
 var MuiSwipeableDrawer = _interopDefault(require('@mui/material/SwipeableDrawer/SwipeableDrawer.js'));
 var ClickAwayListener$1 = require('@mui/base/ClickAwayListener');
 var MuiZoom = _interopDefault(require('@mui/material/Zoom/Zoom.js'));
+var MuiSwitch = _interopDefault(require('@mui/material/Switch/Switch.js'));
 
 /**
  * The accordion component allows the user to show and hide sections of related content on a page.
@@ -5971,6 +5972,108 @@ var RabexSkeleton = {
   components: components$a
 };
 
+var SIZE_MAP = {
+  sm: {
+    trackWidth: 60,
+    trackHeight: 32,
+    thumb: 24,
+    translateX: 28,
+    top: 2,
+    left: 2
+  },
+  xs: {
+    trackWidth: 44,
+    trackHeight: 24,
+    thumb: 16,
+    translateX: 20,
+    top: 2,
+    left: 2
+  },
+  '2xs': {
+    trackWidth: 32,
+    trackHeight: 16,
+    thumb: 12,
+    translateX: 16,
+    top: 0,
+    left: 0
+  }
+};
+var components$b = {
+  styleOverrides: {
+    root: function root(_ref) {
+      var ownerState = _ref.ownerState,
+        theme = _ref.theme;
+      var size = SIZE_MAP[ownerState.size] || SIZE_MAP['2xs'];
+      return {
+        padding: 0,
+        width: size.trackWidth,
+        height: size.trackHeight,
+        marginRight: 8,
+        '&.Mui-disabled + .MuiFormControlLabel-label': {
+          color: theme.palette.textColor[400],
+          opacity: '32%'
+        },
+        '& + .MuiFormControlLabel-label': {
+          color: theme.palette.textColor[900]
+        }
+      };
+    },
+    switchBase: function switchBase(_ref2) {
+      var ownerState = _ref2.ownerState,
+        theme = _ref2.theme;
+      var size = SIZE_MAP[ownerState.size] || SIZE_MAP['2xs'];
+      return {
+        padding: 0,
+        margin: 2,
+        top: size.top,
+        left: size.left,
+        '&.Mui-checked': {
+          transform: "translateX(" + size.translateX + "px)",
+          color: theme.palette.base[50],
+          '& + .MuiSwitch-track': {
+            backgroundColor: theme.palette.primary[500],
+            opacity: 1
+          }
+        },
+        '&.Mui-disabled': {
+          color: theme.palette.base[200],
+          opacity: '32%',
+          '& + .MuiSwitch-track': {
+            backgroundColor: theme.palette.base[200],
+            opacity: '32%'
+          }
+        }
+      };
+    },
+    thumb: function thumb(_ref3) {
+      var ownerState = _ref3.ownerState,
+        theme = _ref3.theme;
+      var size = SIZE_MAP[ownerState.size] || SIZE_MAP['2xs'];
+      return {
+        width: size.thumb,
+        height: size.thumb,
+        backgroundColor: theme.palette.base[50],
+        boxShadow: 'none'
+      };
+    },
+    track: function track(_ref4) {
+      var ownerState = _ref4.ownerState,
+        theme = _ref4.theme;
+      var size = SIZE_MAP[ownerState.size] || SIZE_MAP['2xs'];
+      return {
+        width: size.trackWidth,
+        height: size.trackHeight,
+        borderRadius: size.trackHeight / 2,
+        backgroundColor: theme.palette.base[300],
+        opacity: 1
+      };
+    }
+  }
+};
+var RabexSwitch = {
+  components: components$b
+};
+
 var getDesignTokens = function getDesignTokens(_ref) {
   var deviceType = _ref.deviceType,
     _ref$mode = _ref.mode,
@@ -6034,7 +6137,8 @@ var getDesignTokens = function getDesignTokens(_ref) {
       MuiGrid: RabexGrid.components,
       MuiLoadingButton: RabexLoadingButton.components,
       MuiAutocomplete: RabexAutocomplete.components,
-      MuiSkeleton: RabexSkeleton.components
+      MuiSkeleton: RabexSkeleton.components,
+      MuiSwitch: RabexSwitch.components
     }),
     palette: _extends({}, mode === 'light' ? createPalette(RabexLightPalette) : createPalette(RabexDarkPalette)),
     typography: RabexTypography.typography,
@@ -7200,6 +7304,28 @@ var SegmentedControlTab = /*#__PURE__*/styled(function (props) {
 });
 SegmentedControlTab.defaultProps = {};
 
+/**
+ * Rabex Switch
+ *
+ * A thin wrapper around MUI Switch.
+ *
+ * Styling and behavior are controlled exclusively via theme overrides.
+ * This keeps the component lightweight, predictable, and consistent
+ * across the application.
+ *
+ * @example
+ * ```tsx
+ * import { Switch } from '@rabex-kit/rabex-ui';
+ *
+ * <Switch checked={value} onChange={handleChange} />
+ * ```
+ *
+ * For labeling, always use `FormControlLabel`.
+ */
+var Switch = function Switch(props) {
+  return React__default.createElement(MuiSwitch, Object.assign({}, props));
+};
+
 exports.useMediaQuery = useMediaQuery;
 exports.useScrollTrigger = useScrollTrigger_js;
 exports.useTheme = useTheme$1;
@@ -7299,6 +7425,7 @@ exports.StepLabel = StepLabel;
 exports.Stepper = Stepper;
 exports.SvgIcon = SvgIcon;
 exports.SwipeableDrawer = SwipeableDrawer;
+exports.Switch = Switch;
 exports.Tab = Tab;
 exports.TabContext = TabContext;
 exports.TabList = TabList;