@sinco/react 1.2.0 → 1.2.2-rc.2
Sign up to get free protection for your applications and to get access to all the features.
- package/index.esm.css +9 -9
- package/index.esm.js +105 -22
- package/package.json +1 -1
- package/src/lib/Components/CardRadio.d.ts +2 -2
- package/src/lib/Components/FooterAction.d.ts +2 -2
package/index.esm.css
CHANGED
@@ -1,20 +1,20 @@
|
|
1
|
-
#react-
|
2
|
-
animation: react-
|
1
|
+
#react-module_path1__Aym94 {
|
2
|
+
animation: react-module_spin__r5eLZ 3s linear infinite;
|
3
3
|
}
|
4
4
|
|
5
|
-
#react-
|
6
|
-
animation: react-
|
5
|
+
#react-module_path2__3IZeX {
|
6
|
+
animation: react-module_spin__r5eLZ 3s linear infinite 0.2s;
|
7
7
|
}
|
8
8
|
|
9
|
-
#react-
|
10
|
-
animation: react-
|
9
|
+
#react-module_path3__VghnM {
|
10
|
+
animation: react-module_spin__r5eLZ 3s linear infinite 0.7s;
|
11
11
|
}
|
12
12
|
|
13
|
-
#react-
|
14
|
-
animation: react-
|
13
|
+
#react-module_path4__Nydjg {
|
14
|
+
animation: react-module_spin__r5eLZ 3s linear infinite 1.2s;
|
15
15
|
}
|
16
16
|
|
17
|
-
@keyframes react-
|
17
|
+
@keyframes react-module_spin__r5eLZ {
|
18
18
|
0% {
|
19
19
|
opacity: 1;
|
20
20
|
}
|
package/index.esm.js
CHANGED
@@ -6039,7 +6039,8 @@ var components = {
|
|
6039
6039
|
paddingBlock: 10
|
6040
6040
|
},
|
6041
6041
|
root: {
|
6042
|
-
minHeight: 40
|
6042
|
+
minHeight: 40,
|
6043
|
+
textTransform: "none"
|
6043
6044
|
}
|
6044
6045
|
}
|
6045
6046
|
},
|
@@ -6242,6 +6243,9 @@ var components = {
|
|
6242
6243
|
}
|
6243
6244
|
},
|
6244
6245
|
MuiChip: {
|
6246
|
+
defaultProps: {
|
6247
|
+
color: "primary"
|
6248
|
+
},
|
6245
6249
|
styleOverrides: {
|
6246
6250
|
sizeSmall: {
|
6247
6251
|
height: 16
|
@@ -6268,6 +6272,69 @@ var components = {
|
|
6268
6272
|
".MuiChip-deleteIconMedium": {
|
6269
6273
|
height: 20,
|
6270
6274
|
width: 20
|
6275
|
+
},
|
6276
|
+
color: "#101840de",
|
6277
|
+
".MuiChip-deleteIcon": {
|
6278
|
+
color: "#1018408a",
|
6279
|
+
"&:hover": {
|
6280
|
+
color: "#1018408a"
|
6281
|
+
}
|
6282
|
+
}
|
6283
|
+
},
|
6284
|
+
filled: {
|
6285
|
+
"&.MuiChip-filledPrimary": {
|
6286
|
+
backgroundColor: "#BCD0E3",
|
6287
|
+
"&:hover": {
|
6288
|
+
backgroundColor: "#BCD0E3 !important",
|
6289
|
+
"&.MuiChip-clickableColorPrimary": {
|
6290
|
+
backgroundColor: "#8FB1D0 !important"
|
6291
|
+
}
|
6292
|
+
}
|
6293
|
+
},
|
6294
|
+
"&.MuiChip-filledSecondary": {
|
6295
|
+
backgroundColor: "#B3EBF2",
|
6296
|
+
"&:hover": {
|
6297
|
+
backgroundColor: "#B3EBF2 !important",
|
6298
|
+
"&.MuiChip-clickableColorSecondary": {
|
6299
|
+
backgroundColor: "#80DEEA !important"
|
6300
|
+
}
|
6301
|
+
}
|
6302
|
+
},
|
6303
|
+
"&.MuiChip-filledError": {
|
6304
|
+
backgroundColor: "#F1C7C7",
|
6305
|
+
"&:hover": {
|
6306
|
+
backgroundColor: "#F1C7C7 !important",
|
6307
|
+
"&.MuiChip-clickableColorError": {
|
6308
|
+
backgroundColor: "#E8A1A1 !important"
|
6309
|
+
}
|
6310
|
+
}
|
6311
|
+
},
|
6312
|
+
"&.MuiChip-filledSuccess": {
|
6313
|
+
backgroundColor: "#DDEFC4",
|
6314
|
+
"&:hover": {
|
6315
|
+
backgroundColor: "#DDEFC4 !important",
|
6316
|
+
"&.MuiChip-clickableColorSuccess": {
|
6317
|
+
backgroundColor: "#C7E49D !important"
|
6318
|
+
}
|
6319
|
+
}
|
6320
|
+
},
|
6321
|
+
"&.MuiChip-filledInfo": {
|
6322
|
+
backgroundColor: "#C0E2EE",
|
6323
|
+
"&:hover": {
|
6324
|
+
backgroundColor: "#C0E2EE !important",
|
6325
|
+
"&.MuiChip-clickableColorInfo": {
|
6326
|
+
backgroundColor: "#96CFE2 !important"
|
6327
|
+
}
|
6328
|
+
}
|
6329
|
+
},
|
6330
|
+
"&.MuiChip-filledWarning": {
|
6331
|
+
backgroundColor: "#FEDAB3",
|
6332
|
+
"&:hover": {
|
6333
|
+
backgroundColor: "#FEDAB3 !important",
|
6334
|
+
"&.MuiChip-clickableColorWarning": {
|
6335
|
+
backgroundColor: "#FDC280 !important"
|
6336
|
+
}
|
6337
|
+
}
|
6271
6338
|
}
|
6272
6339
|
}
|
6273
6340
|
}
|
@@ -6664,17 +6731,31 @@ var components = {
|
|
6664
6731
|
},
|
6665
6732
|
MuiList: {
|
6666
6733
|
defaultProps: {
|
6667
|
-
dense:
|
6734
|
+
dense: false
|
6668
6735
|
},
|
6669
6736
|
styleOverrides: {
|
6670
|
-
|
6671
|
-
".
|
6672
|
-
|
6737
|
+
root: {
|
6738
|
+
"& .MuiButtonBase-root ": {
|
6739
|
+
marginBlock: 0,
|
6740
|
+
padding: 0
|
6741
|
+
},
|
6742
|
+
"& .MuiListItem-root": {
|
6743
|
+
padding: "8px 16px 8px 16px"
|
6744
|
+
},
|
6745
|
+
"& .MuiListItemText-root": {
|
6746
|
+
marginBlock: " 4.4px !important"
|
6673
6747
|
}
|
6674
6748
|
},
|
6675
6749
|
dense: {
|
6676
|
-
".MuiListItem-dense": {
|
6677
|
-
padding: "
|
6750
|
+
"& .MuiListItem-dense": {
|
6751
|
+
padding: "4px 16px 4px 16px",
|
6752
|
+
"& .MuiListItemIcon-root": {
|
6753
|
+
minWidth: "30px"
|
6754
|
+
},
|
6755
|
+
"& .MuiButtonBase-root": {
|
6756
|
+
marginBlock: 0,
|
6757
|
+
padding: 0
|
6758
|
+
}
|
6678
6759
|
}
|
6679
6760
|
}
|
6680
6761
|
}
|
@@ -14181,7 +14262,7 @@ var DrawerComponent = function DrawerComponent(_ref) {
|
|
14181
14262
|
var FooterAction = function FooterAction(_ref) {
|
14182
14263
|
var leftContent = _ref.leftContent,
|
14183
14264
|
rightContent = _ref.rightContent,
|
14184
|
-
|
14265
|
+
children = _ref.children;
|
14185
14266
|
return React__default.createElement(AppBar$1, {
|
14186
14267
|
position: "fixed",
|
14187
14268
|
color: "inherit",
|
@@ -14196,7 +14277,7 @@ var FooterAction = function FooterAction(_ref) {
|
|
14196
14277
|
}
|
14197
14278
|
}, leftContent, React__default.createElement(Box$2, {
|
14198
14279
|
flexGrow: 1
|
14199
|
-
}), React__default.createElement(Box$2, null,
|
14280
|
+
}), React__default.createElement(Box$2, null, children), rightContent));
|
14200
14281
|
};
|
14201
14282
|
|
14202
14283
|
var useProgress = function useProgress(timeProgress, lote) {
|
@@ -14504,9 +14585,11 @@ var ProgressSinco = function ProgressSinco(_ref) {
|
|
14504
14585
|
};
|
14505
14586
|
|
14506
14587
|
var CardRadio = function CardRadio(_ref) {
|
14588
|
+
var _ref2;
|
14507
14589
|
var _ref$RadioPosition = _ref.RadioPosition,
|
14508
14590
|
RadioPosition = _ref$RadioPosition === void 0 ? 'right' : _ref$RadioPosition,
|
14509
|
-
|
14591
|
+
_ref$state = _ref.state,
|
14592
|
+
state = _ref$state === void 0 ? 'default' : _ref$state,
|
14510
14593
|
media = _ref.media,
|
14511
14594
|
header = _ref.header,
|
14512
14595
|
content = _ref.content,
|
@@ -14517,24 +14600,24 @@ var CardRadio = function CardRadio(_ref) {
|
|
14517
14600
|
value = _ref.value,
|
14518
14601
|
onChange = _ref.onChange,
|
14519
14602
|
checked = _ref.checked;
|
14520
|
-
var _useState = useState(checked !== null &&
|
14603
|
+
var _useState = useState((_ref2 = checked || state === 'active') !== null && _ref2 !== void 0 ? _ref2 : false),
|
14521
14604
|
_useState2 = _slicedToArray(_useState, 2),
|
14522
14605
|
isChecked = _useState2[0],
|
14523
14606
|
setIsChecked = _useState2[1];
|
14524
|
-
var _useState3 = useState(
|
14607
|
+
var _useState3 = useState(state === 'active'),
|
14525
14608
|
_useState4 = _slicedToArray(_useState3, 1),
|
14526
14609
|
isActive = _useState4[0];
|
14527
14610
|
var handleClick = function handleClick() {
|
14528
|
-
if (
|
14611
|
+
if (state === 'disabled') return;
|
14529
14612
|
setIsChecked(!isChecked);
|
14530
14613
|
onChange(value);
|
14531
14614
|
};
|
14532
14615
|
var getBackgroundColor = function getBackgroundColor() {
|
14533
|
-
if (
|
14534
|
-
return isChecked ? color === 'primary' ? '#E4ECF4' : color === 'secondary' ? '#00BCD414' : '#FBFBFB' : 'transparent';
|
14616
|
+
if (state === 'disabled') return '';
|
14617
|
+
return isChecked || isActive ? color === 'primary' ? '#E4ECF4' : color === 'secondary' ? '#00BCD414' : '#FBFBFB' : 'transparent';
|
14535
14618
|
};
|
14536
14619
|
var getBorderColor = function getBorderColor() {
|
14537
|
-
return isChecked ? color === 'primary' ? '#2063A080' : color === 'secondary' ? '#00BCD480' : '#00BCD4' : '#0000001F';
|
14620
|
+
return isChecked || isActive ? color === 'primary' ? '#2063A080' : color === 'secondary' ? '#00BCD480' : '#00BCD4' : '#0000001F';
|
14538
14621
|
};
|
14539
14622
|
var getHoverColor = function getHoverColor() {
|
14540
14623
|
return color === 'primary' ? '#2063A00A' : color === 'secondary' ? '#00BCD40A' : 'FBFBFB';
|
@@ -14549,7 +14632,7 @@ var CardRadio = function CardRadio(_ref) {
|
|
14549
14632
|
border: "solid 1px ".concat(getBorderColor()),
|
14550
14633
|
sx: {
|
14551
14634
|
'&:hover': {
|
14552
|
-
backgroundColor: checked ? 'none' :
|
14635
|
+
backgroundColor: checked ? 'none' : state === 'disabled' ? 'inherit' : getHoverColor()
|
14553
14636
|
},
|
14554
14637
|
cursor: 'pointer'
|
14555
14638
|
},
|
@@ -14565,16 +14648,16 @@ var CardRadio = function CardRadio(_ref) {
|
|
14565
14648
|
gap: 1
|
14566
14649
|
}, media && React__default.createElement(Stack$1, null, media), React__default.createElement(Stack$1, null, header && React__default.createElement(Typography$1, {
|
14567
14650
|
variant: "subtitle2",
|
14568
|
-
color:
|
14569
|
-
},
|
14651
|
+
color: state === 'disabled' ? 'text.disabled' : isActive ? 'text.primary' : 'text.primary'
|
14652
|
+
}, header), content && React__default.createElement(Typography$1, {
|
14570
14653
|
variant: "caption",
|
14571
|
-
color:
|
14654
|
+
color: state === 'disabled' ? 'text.disabled' : isActive ? 'text.secondary' : 'text.secondary'
|
14572
14655
|
}, content))), React__default.createElement(Stack$1, {
|
14573
14656
|
justifyContent: topRadioPosition === true ? 'flex-start' : 'center'
|
14574
14657
|
}, React__default.createElement(Radio$1, {
|
14575
|
-
checked: isChecked,
|
14658
|
+
checked: isChecked || isChecked,
|
14576
14659
|
color: color,
|
14577
|
-
disabled:
|
14660
|
+
disabled: state === 'disabled'
|
14578
14661
|
}))));
|
14579
14662
|
};
|
14580
14663
|
|
package/package.json
CHANGED
@@ -1,11 +1,11 @@
|
|
1
1
|
import React, { FC } from 'react';
|
2
2
|
type RadioPosition = 'left' | 'right';
|
3
|
-
type
|
3
|
+
type Radiostate = 'active' | 'disabled' | 'default';
|
4
4
|
type CardRadioColors = 'primary' | 'secondary';
|
5
5
|
export interface CardRadioProps {
|
6
6
|
RadioPosition?: RadioPosition;
|
7
7
|
topRadioPosition?: boolean;
|
8
|
-
|
8
|
+
state?: Radiostate;
|
9
9
|
media?: React.ReactNode;
|
10
10
|
header?: React.ReactNode | string;
|
11
11
|
content?: React.ReactNode | string;
|
@@ -1,8 +1,8 @@
|
|
1
1
|
import React from 'react';
|
2
2
|
interface FooterActionsProperties {
|
3
|
-
|
3
|
+
children?: React.ReactNode | string;
|
4
4
|
leftContent?: React.ReactNode;
|
5
5
|
rightContent?: React.ReactNode;
|
6
6
|
}
|
7
|
-
export declare const FooterAction: ({ leftContent, rightContent,
|
7
|
+
export declare const FooterAction: ({ leftContent, rightContent, children, }: FooterActionsProperties) => React.JSX.Element;
|
8
8
|
export {};
|