@rabex-kit/rabex-ui 0.2.28 → 0.2.30

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,11 +1,11 @@
1
1
  import React from 'react';
2
2
  import { ButtonProps as MuiButtonProps } from '@mui/material';
3
- export declare type ButtonProps = Omit<MuiButtonProps, 'size' | 'color' | 'component' | 'isIcon' | 'variant'> & {
3
+ export declare type ButtonProps = Omit<MuiButtonProps, 'size' | 'color' | 'component' | 'variant'> & {
4
4
  size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';
5
5
  isIcon?: boolean;
6
6
  color?: 'primary' | 'secondary' | 'success' | 'error' | 'info' | 'warning';
7
7
  variant?: 'contained' | 'containedSecondary' | 'outlined' | 'text';
8
8
  component?: React.ElementType;
9
9
  };
10
- declare const Button: React.ForwardRefExoticComponent<Pick<ButtonProps, "form" | "slot" | "style" | "title" | "className" | "classes" | "action" | "centerRipple" | "children" | "disabled" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "sx" | "tabIndex" | "TouchRippleProps" | "touchRippleRef" | "color" | "translate" | "disableElevation" | "disableFocusRipple" | "endIcon" | "fullWidth" | "href" | "size" | "startIcon" | "variant" | "key" | "autoFocus" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "name" | "type" | "value" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "placeholder" | "spellCheck" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "component" | "isIcon"> & React.RefAttributes<HTMLButtonElement>>;
10
+ declare const Button: React.FC<ButtonProps>;
11
11
  export default Button;
@@ -863,41 +863,114 @@ var iconSizes = {
863
863
  xl: 24
864
864
  };
865
865
  // Styled button with shouldForwardProp to exclude 'isIcon' from DOM
866
- var StyledButton = /*#__PURE__*/styled(MuiButton, {
867
- shouldForwardProp: function shouldForwardProp(prop) {
868
- return prop !== 'isIcon';
869
- }
870
- })(function (_ref) {
871
- var size = _ref.size;
872
- return {
873
- display: 'flex',
874
- alignItems: 'center',
875
- '& .MuiButton-startIcon': {
876
- margin: 0
877
- },
878
- '& .MuiButton-endIcon': {
879
- margin: 0
880
- },
881
- '& .MuiSvgIcon-root': {
882
- fontSize: iconSizes[size || 'md']
866
+ /* const StyledButton = styled(MuiButton, {
867
+ shouldForwardProp: (prop) => prop !== 'isIcon',
868
+ })<ButtonProps>(({ theme, size, isIcon }) => ({
869
+ display: 'flex',
870
+ alignItems: 'center',
871
+ // Handle icon styling directly here
872
+ // ...(isIcon && {
873
+ // minWidth: 'unset',
874
+ // ...(size === 'xs' && {
875
+ // width: '24px',
876
+ // height: '24px',
877
+ // padding: theme.spacing(0.5),
878
+ // }),
879
+ // ...(size === 'sm' && {
880
+ // width: '32px',
881
+ // height: '32px',
882
+ // padding: theme.spacing(1),
883
+ // }),
884
+ // ...(size === 'md' && {
885
+ // width: '40px',
886
+ // height: '40px',
887
+ // padding: theme.spacing(1),
888
+ // }),
889
+ // ...(size === 'lg' && {
890
+ // width: '48px',
891
+ // height: '48px',
892
+ // padding: theme.spacing(1.5),
893
+ // }),
894
+ // ...(size === 'xl' && {
895
+ // width: '56px',
896
+ // height: '56px',
897
+ // padding: theme.spacing(2),
898
+ // }),
899
+ // }),
900
+ '& .MuiButton-startIcon': {
901
+ margin: 0,
902
+ },
903
+ '& .MuiButton-endIcon': {
904
+ margin: 0,
905
+ },
906
+ '& .MuiSvgIcon-root': {
907
+ fontSize: iconSizes[size || 'md'],
908
+ },
909
+ })); */
910
+ var Button = function Button(_ref) {
911
+ var _ref$size = _ref.size,
912
+ size = _ref$size === void 0 ? 'md' : _ref$size,
913
+ _ref$isIcon = _ref.isIcon,
914
+ isIcon = _ref$isIcon === void 0 ? false : _ref$isIcon,
915
+ children = _ref.children,
916
+ props = _objectWithoutPropertiesLoose(_ref, _excluded$2);
917
+ var StyledButton = styled(MuiButton, {
918
+ name: 'MuiButton',
919
+ shouldForwardProp: function shouldForwardProp(prop) {
920
+ return prop !== 'isIcon';
883
921
  }
884
- };
885
- });
886
- var Button = /*#__PURE__*/React__default.forwardRef(function (props, ref) {
887
- var _props$size = props.size,
888
- size = _props$size === void 0 ? 'md' : _props$size,
889
- isIcon = props.isIcon,
890
- children = props.children,
891
- rest = _objectWithoutPropertiesLoose(props, _excluded$2);
922
+ })(function (_ref2) {
923
+ return {
924
+ display: 'flex',
925
+ alignItems: 'center',
926
+ '& .MuiButton-startIcon': {
927
+ margin: 0
928
+ },
929
+ '& .MuiButton-endIcon': {
930
+ margin: 0
931
+ },
932
+ '& .MuiSvgIcon-root': {
933
+ fontSize: iconSizes[size]
934
+ }
935
+ };
936
+ });
937
+ var content = isIcon ? children : React__default.createElement(Typography, {
938
+ variant: typographySizes[size].variant,
939
+ weight: typographySizes[size].weight,
940
+ component: "span"
941
+ }, children);
892
942
  return React__default.createElement(StyledButton, Object.assign({
893
- ref: ref,
894
943
  size: size,
895
944
  isIcon: isIcon
896
- }, rest), isIcon ? children : React__default.createElement(Typography, {
897
- variant: typographySizes[size].variant,
898
- weight: typographySizes[size].weight
899
- }, children));
900
- });
945
+ }, props), content);
946
+ };
947
+ // const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(
948
+ // (props, ref) => {
949
+ // const { size = 'md', isIcon = false, children, ...rest } = props;
950
+ //
951
+ // // Handle Typography at the component level, not in styled component
952
+ // const content = isIcon ? children : (
953
+ // <Typography
954
+ // variant={typographySizes[size].variant}
955
+ // weight={typographySizes[size].weight}
956
+ // component="span" // Important: use span to avoid nested block elements
957
+ // >
958
+ // {children}
959
+ // </Typography>
960
+ // );
961
+ //
962
+ // return (
963
+ // <StyledButton
964
+ // ref={ref}
965
+ // size={size}
966
+ // isIcon={isIcon} // This reaches styled component but not DOM
967
+ // {...rest}
968
+ // >
969
+ // {content}
970
+ // </StyledButton>
971
+ // );
972
+ // }
973
+ // );
901
974
  Button.defaultProps = {
902
975
  variant: 'contained',
903
976
  size: 'md',
@@ -2783,6 +2856,7 @@ var components = {
2783
2856
  style: function style(_ref11) {
2784
2857
  var theme = _ref11.theme;
2785
2858
  return {
2859
+ minWidth: '24px',
2786
2860
  width: '24px',
2787
2861
  height: '24px',
2788
2862
  // padding: theme.spacing(3.5, 3.5),
@@ -2798,6 +2872,7 @@ var components = {
2798
2872
  style: function style(_ref12) {
2799
2873
  var theme = _ref12.theme;
2800
2874
  return {
2875
+ minWidth: '32px',
2801
2876
  width: '32px',
2802
2877
  height: '32px',
2803
2878
  // padding: theme.spacing(3.5, 3.5),
@@ -2813,6 +2888,7 @@ var components = {
2813
2888
  style: function style(_ref13) {
2814
2889
  var theme = _ref13.theme;
2815
2890
  return {
2891
+ minWidth: '40px',
2816
2892
  width: '40px',
2817
2893
  height: '40px',
2818
2894
  // padding: theme.spacing(3.5, 3.5),
@@ -2828,6 +2904,7 @@ var components = {
2828
2904
  style: function style(_ref14) {
2829
2905
  var theme = _ref14.theme;
2830
2906
  return {
2907
+ minWidth: '48px',
2831
2908
  width: '48px',
2832
2909
  height: '48px',
2833
2910
  padding: theme.spacing(3),
@@ -2842,6 +2919,7 @@ var components = {
2842
2919
  style: function style(_ref15) {
2843
2920
  var theme = _ref15.theme;
2844
2921
  return {
2922
+ minWidth: '56px',
2845
2923
  width: '56px',
2846
2924
  height: '56px',
2847
2925
  padding: theme.spacing(4),