sag_components 2.0.0-beta234 → 2.0.0-beta236
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.
- package/dist/index.d.ts +1 -2
- package/dist/index.esm.js +52 -66
- package/dist/index.esm.js.map +1 -1
- package/dist/index.js +52 -66
- package/dist/index.js.map +1 -1
- package/dist/types/components/ToggleSwitch/ToggleSwitch.d.ts +1 -2
- package/package.json +1 -1
package/dist/index.d.ts
CHANGED
|
@@ -1416,13 +1416,12 @@ declare function Tooltip(props: any): react_jsx_runtime.JSX.Element;
|
|
|
1416
1416
|
* ToggleSwitch component for on/off states.
|
|
1417
1417
|
* Supports small/large sizes and disabled state.
|
|
1418
1418
|
*/
|
|
1419
|
-
declare function ToggleSwitch({ checked, onChange, size, disabled,
|
|
1419
|
+
declare function ToggleSwitch({ checked, onChange, size, disabled, ...props }: {
|
|
1420
1420
|
[x: string]: any;
|
|
1421
1421
|
checked: any;
|
|
1422
1422
|
onChange: any;
|
|
1423
1423
|
size?: string;
|
|
1424
1424
|
disabled?: boolean;
|
|
1425
|
-
aa: any;
|
|
1426
1425
|
}): react_jsx_runtime.JSX.Element;
|
|
1427
1426
|
declare namespace ToggleSwitch {
|
|
1428
1427
|
namespace propTypes {
|
package/dist/index.esm.js
CHANGED
|
@@ -24167,22 +24167,21 @@ const DeleteIcon = styled.div`
|
|
|
24167
24167
|
position: absolute;
|
|
24168
24168
|
`;
|
|
24169
24169
|
|
|
24170
|
-
const QuickFilterDropdownSingle =
|
|
24171
|
-
|
|
24172
|
-
|
|
24173
|
-
|
|
24174
|
-
|
|
24175
|
-
|
|
24176
|
-
|
|
24177
|
-
|
|
24178
|
-
|
|
24179
|
-
|
|
24180
|
-
|
|
24181
|
-
|
|
24182
|
-
|
|
24183
|
-
|
|
24184
|
-
|
|
24185
|
-
} = _ref;
|
|
24170
|
+
const QuickFilterDropdownSingle = ({
|
|
24171
|
+
label,
|
|
24172
|
+
hoverColor,
|
|
24173
|
+
options,
|
|
24174
|
+
selectedValue,
|
|
24175
|
+
placeHolder,
|
|
24176
|
+
onChange,
|
|
24177
|
+
disabled,
|
|
24178
|
+
width,
|
|
24179
|
+
error,
|
|
24180
|
+
errorMessage,
|
|
24181
|
+
xIconShow,
|
|
24182
|
+
labelColor,
|
|
24183
|
+
showLabelOnTop
|
|
24184
|
+
}) => {
|
|
24186
24185
|
const [isFocused, setIsFocused] = useState(false);
|
|
24187
24186
|
const [showOptions, setShowOptions] = useState(false);
|
|
24188
24187
|
const [inputValue, setInputValue] = useState("");
|
|
@@ -24639,26 +24638,25 @@ const IconContainer$2 = styled.div`
|
|
|
24639
24638
|
cursor: pointer;
|
|
24640
24639
|
`;
|
|
24641
24640
|
|
|
24642
|
-
const QuickFilterDropdownMultiSelection =
|
|
24643
|
-
|
|
24644
|
-
|
|
24645
|
-
|
|
24646
|
-
|
|
24647
|
-
|
|
24648
|
-
|
|
24649
|
-
|
|
24650
|
-
|
|
24651
|
-
|
|
24652
|
-
|
|
24653
|
-
|
|
24654
|
-
|
|
24655
|
-
|
|
24656
|
-
|
|
24657
|
-
|
|
24658
|
-
|
|
24659
|
-
|
|
24660
|
-
|
|
24661
|
-
} = _ref;
|
|
24641
|
+
const QuickFilterDropdownMultiSelection = ({
|
|
24642
|
+
label,
|
|
24643
|
+
labelEmptyValue,
|
|
24644
|
+
options,
|
|
24645
|
+
selectedValue,
|
|
24646
|
+
placeHolder,
|
|
24647
|
+
onChange,
|
|
24648
|
+
required,
|
|
24649
|
+
disabled,
|
|
24650
|
+
width,
|
|
24651
|
+
height,
|
|
24652
|
+
error,
|
|
24653
|
+
errorMessage,
|
|
24654
|
+
labelColor,
|
|
24655
|
+
xIconShow,
|
|
24656
|
+
checkBoxColor,
|
|
24657
|
+
showLabelOnTop,
|
|
24658
|
+
dropdownHeight
|
|
24659
|
+
}) => {
|
|
24662
24660
|
const [isFocused, setIsFocused] = useState(false);
|
|
24663
24661
|
const [showOptions, setShowOptions] = useState(false);
|
|
24664
24662
|
const [inputValue, setInputValue] = useState('');
|
|
@@ -36089,12 +36087,6 @@ const ToggleSwitchLabel = styled.label`
|
|
|
36089
36087
|
position: relative;
|
|
36090
36088
|
cursor: pointer;
|
|
36091
36089
|
user-select: none;
|
|
36092
|
-
// opacity: ${_ref => {
|
|
36093
|
-
let {
|
|
36094
|
-
disabled
|
|
36095
|
-
} = _ref;
|
|
36096
|
-
return disabled ? 0.5 : 1;
|
|
36097
|
-
}};
|
|
36098
36090
|
`;
|
|
36099
36091
|
const ToggleInput = styled.input`
|
|
36100
36092
|
display: none;
|
|
@@ -36102,19 +36094,15 @@ const ToggleInput = styled.input`
|
|
|
36102
36094
|
const ToggleSlider = styled.span`
|
|
36103
36095
|
display: block;
|
|
36104
36096
|
position: relative;
|
|
36105
|
-
background: ${
|
|
36106
|
-
|
|
36107
|
-
|
|
36108
|
-
|
|
36109
|
-
} = _ref2;
|
|
36110
|
-
return checked ? disabled ? "#7bb1b0" : "#006d6a" : disabled ? "#B1B1B1" : "#cfd8dc";
|
|
36111
|
-
}};
|
|
36097
|
+
background: ${({
|
|
36098
|
+
checked,
|
|
36099
|
+
disabled
|
|
36100
|
+
}) => checked ? "#006d6a" : disabled ? "#B1B1B1" : "#D0D0D0"};
|
|
36112
36101
|
border-radius: 999px;
|
|
36113
36102
|
transition: background 0.2s;
|
|
36114
|
-
${
|
|
36115
|
-
|
|
36116
|
-
|
|
36117
|
-
} = _ref3;
|
|
36103
|
+
${({
|
|
36104
|
+
size
|
|
36105
|
+
}) => {
|
|
36118
36106
|
switch (size) {
|
|
36119
36107
|
case "s":
|
|
36120
36108
|
return css`width: 40px; height: 20px;`;
|
|
@@ -36130,13 +36118,14 @@ const ToggleSlider = styled.span`
|
|
|
36130
36118
|
left: 3px;
|
|
36131
36119
|
top: 50%;
|
|
36132
36120
|
transform: translateY(-50%);
|
|
36133
|
-
background:
|
|
36121
|
+
background: ${({
|
|
36122
|
+
disabled
|
|
36123
|
+
}) => disabled ? "#D0D0D0" : "#fff"};
|
|
36134
36124
|
border-radius: 50%;
|
|
36135
36125
|
transition: left 0.2s, width 0.2s, height 0.2s;
|
|
36136
|
-
${
|
|
36137
|
-
|
|
36138
|
-
|
|
36139
|
-
} = _ref4;
|
|
36126
|
+
${({
|
|
36127
|
+
size
|
|
36128
|
+
}) => {
|
|
36140
36129
|
switch (size) {
|
|
36141
36130
|
case "s":
|
|
36142
36131
|
return css`width: 14px; height: 14px;`;
|
|
@@ -36146,11 +36135,10 @@ const ToggleSlider = styled.span`
|
|
|
36146
36135
|
return css`width: 20px; height: 20px;`;
|
|
36147
36136
|
}
|
|
36148
36137
|
}}
|
|
36149
|
-
left: ${
|
|
36150
|
-
|
|
36151
|
-
|
|
36152
|
-
|
|
36153
|
-
} = _ref5;
|
|
36138
|
+
left: ${({
|
|
36139
|
+
checked,
|
|
36140
|
+
size
|
|
36141
|
+
}) => {
|
|
36154
36142
|
if (!checked) return "3px";
|
|
36155
36143
|
switch (size) {
|
|
36156
36144
|
case "s":
|
|
@@ -36174,13 +36162,11 @@ function ToggleSwitch(_ref) {
|
|
|
36174
36162
|
onChange,
|
|
36175
36163
|
size = "m",
|
|
36176
36164
|
disabled = false,
|
|
36177
|
-
aa,
|
|
36178
36165
|
...props
|
|
36179
36166
|
} = _ref;
|
|
36180
36167
|
return /*#__PURE__*/React$1.createElement(ToggleSwitchLabel, {
|
|
36181
36168
|
size: size,
|
|
36182
|
-
disabled: disabled
|
|
36183
|
-
aa: true
|
|
36169
|
+
disabled: disabled
|
|
36184
36170
|
}, /*#__PURE__*/React$1.createElement(ToggleInput, _extends$1({
|
|
36185
36171
|
type: "checkbox",
|
|
36186
36172
|
checked: checked,
|