sag_components 2.0.0-beta278 → 2.0.0-beta279
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.esm.js +119 -107
- package/dist/index.esm.js.map +1 -1
- package/dist/index.js +119 -107
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
package/dist/index.esm.js
CHANGED
|
@@ -36110,19 +36110,15 @@ const ToggleInput = styled.input`
|
|
|
36110
36110
|
const ToggleSlider = styled.span`
|
|
36111
36111
|
display: block;
|
|
36112
36112
|
position: relative;
|
|
36113
|
-
background: ${
|
|
36114
|
-
|
|
36115
|
-
|
|
36116
|
-
|
|
36117
|
-
} = _ref;
|
|
36118
|
-
return checked ? "#006d6a" : disabled ? "#B1B1B1" : "#D0D0D0";
|
|
36119
|
-
}};
|
|
36113
|
+
background: ${({
|
|
36114
|
+
checked,
|
|
36115
|
+
disabled
|
|
36116
|
+
}) => checked ? "#006d6a" : disabled ? "#B1B1B1" : "#D0D0D0"};
|
|
36120
36117
|
border-radius: 999px;
|
|
36121
36118
|
transition: background 0.2s;
|
|
36122
|
-
${
|
|
36123
|
-
|
|
36124
|
-
|
|
36125
|
-
} = _ref2;
|
|
36119
|
+
${({
|
|
36120
|
+
size
|
|
36121
|
+
}) => {
|
|
36126
36122
|
switch (size) {
|
|
36127
36123
|
case "s":
|
|
36128
36124
|
return css`width: 40px; height: 20px;`;
|
|
@@ -36138,18 +36134,14 @@ const ToggleSlider = styled.span`
|
|
|
36138
36134
|
left: 3px;
|
|
36139
36135
|
top: 50%;
|
|
36140
36136
|
transform: translateY(-50%);
|
|
36141
|
-
background: ${
|
|
36142
|
-
|
|
36143
|
-
|
|
36144
|
-
} = _ref3;
|
|
36145
|
-
return disabled ? "#D0D0D0" : "#fff";
|
|
36146
|
-
}};
|
|
36137
|
+
background: ${({
|
|
36138
|
+
disabled
|
|
36139
|
+
}) => disabled ? "#D0D0D0" : "#fff"};
|
|
36147
36140
|
border-radius: 50%;
|
|
36148
36141
|
transition: left 0.2s, width 0.2s, height 0.2s;
|
|
36149
|
-
${
|
|
36150
|
-
|
|
36151
|
-
|
|
36152
|
-
} = _ref4;
|
|
36142
|
+
${({
|
|
36143
|
+
size
|
|
36144
|
+
}) => {
|
|
36153
36145
|
switch (size) {
|
|
36154
36146
|
case "s":
|
|
36155
36147
|
return css`width: 14px; height: 14px;`;
|
|
@@ -36159,11 +36151,10 @@ const ToggleSlider = styled.span`
|
|
|
36159
36151
|
return css`width: 20px; height: 20px;`;
|
|
36160
36152
|
}
|
|
36161
36153
|
}}
|
|
36162
|
-
left: ${
|
|
36163
|
-
|
|
36164
|
-
|
|
36165
|
-
|
|
36166
|
-
} = _ref5;
|
|
36154
|
+
left: ${({
|
|
36155
|
+
checked,
|
|
36156
|
+
size
|
|
36157
|
+
}) => {
|
|
36167
36158
|
if (!checked) return "3px";
|
|
36168
36159
|
switch (size) {
|
|
36169
36160
|
case "s":
|
|
@@ -36177,9 +36168,9 @@ const ToggleSlider = styled.span`
|
|
|
36177
36168
|
}
|
|
36178
36169
|
`;
|
|
36179
36170
|
|
|
36180
|
-
/**
|
|
36181
|
-
* ToggleSwitch component for on/off states.
|
|
36182
|
-
* Supports small/large sizes and disabled state.
|
|
36171
|
+
/**
|
|
36172
|
+
* ToggleSwitch component for on/off states.
|
|
36173
|
+
* Supports small/large sizes and disabled state.
|
|
36183
36174
|
*/
|
|
36184
36175
|
function ToggleSwitch(_ref) {
|
|
36185
36176
|
let {
|
|
@@ -37021,104 +37012,104 @@ const LoadingText = styled.span`
|
|
|
37021
37012
|
const rotation = keyframes`
|
|
37022
37013
|
0%, 100% {
|
|
37023
37014
|
box-shadow:
|
|
37024
|
-
0px -
|
|
37025
|
-
|
|
37026
|
-
|
|
37027
|
-
|
|
37028
|
-
0px
|
|
37029
|
-
-
|
|
37030
|
-
-
|
|
37031
|
-
-
|
|
37015
|
+
0px -8.32px 0px 0px #1F7677,
|
|
37016
|
+
5.76px -5.76px 0 0px rgba(31, 118, 119,0.2),
|
|
37017
|
+
8px 0px 0 0px rgba(31, 118, 119,0.2),
|
|
37018
|
+
5.6px 5.6px 0 0px rgba(31, 118, 119,0.2),
|
|
37019
|
+
0px 8px 0 0px rgba(31, 118, 119,0.2),
|
|
37020
|
+
-5.76px 5.76px 0 0px rgba(31, 118, 119,0.2),
|
|
37021
|
+
-8.32px 0px 0 0px rgba(31, 118, 119,0.5),
|
|
37022
|
+
-5.76px -5.76px 0 0px rgba(31, 118, 119,0.7);
|
|
37032
37023
|
}
|
|
37033
37024
|
|
|
37034
37025
|
12.5% {
|
|
37035
37026
|
box-shadow:
|
|
37036
|
-
0px -
|
|
37037
|
-
|
|
37038
|
-
|
|
37039
|
-
|
|
37040
|
-
0px
|
|
37041
|
-
-
|
|
37042
|
-
-
|
|
37043
|
-
-
|
|
37027
|
+
0px -8.32px 0px 0px rgba(31, 118, 119,0.7),
|
|
37028
|
+
5.76px -5.76px 0 0px #1F7677,
|
|
37029
|
+
8px 0px 0 0px rgba(31, 118, 119,0.2),
|
|
37030
|
+
5.6px 5.6px 0 0px rgba(31, 118, 119,0.2),
|
|
37031
|
+
0px 8px 0 0px rgba(31, 118, 119,0.2),
|
|
37032
|
+
-5.76px 5.76px 0 0px rgba(31, 118, 119,0.2),
|
|
37033
|
+
-8.32px 0px 0 0px rgba(31, 118, 119,0.2),
|
|
37034
|
+
-5.76px -5.76px 0 0px rgba(31, 118, 119,0.5);
|
|
37044
37035
|
}
|
|
37045
37036
|
|
|
37046
37037
|
25% {
|
|
37047
37038
|
box-shadow:
|
|
37048
|
-
0px -
|
|
37049
|
-
|
|
37050
|
-
|
|
37051
|
-
|
|
37052
|
-
0px
|
|
37053
|
-
-
|
|
37054
|
-
-
|
|
37055
|
-
-
|
|
37039
|
+
0px -8.32px 0px 0px rgba(31, 118, 119,0.5),
|
|
37040
|
+
5.76px -5.76px 0 0px rgba(31, 118, 119,0.7),
|
|
37041
|
+
8px 0px 0 0px #1F7677,
|
|
37042
|
+
5.6px 5.6px 0 0px rgba(31, 118, 119,0.2),
|
|
37043
|
+
0px 8px 0 0px rgba(31, 118, 119,0.2),
|
|
37044
|
+
-5.76px 5.76px 0 0px rgba(31, 118, 119,0.2),
|
|
37045
|
+
-8.32px 0px 0 0px rgba(31, 118, 119,0.2),
|
|
37046
|
+
-5.76px -5.76px 0 0px rgba(31, 118, 119,0.2);
|
|
37056
37047
|
}
|
|
37057
37048
|
|
|
37058
37049
|
37.5% {
|
|
37059
37050
|
box-shadow:
|
|
37060
|
-
0px -
|
|
37061
|
-
|
|
37062
|
-
|
|
37063
|
-
|
|
37064
|
-
0px
|
|
37065
|
-
-
|
|
37066
|
-
-
|
|
37067
|
-
-
|
|
37051
|
+
0px -8.32px 0px 0px rgba(31, 118, 119,0.2),
|
|
37052
|
+
5.76px -5.76px 0 0px rgba(31, 118, 119,0.5),
|
|
37053
|
+
8px 0px 0 0px rgba(31, 118, 119,0.7),
|
|
37054
|
+
5.6px 5.6px 0 0px #1F7677,
|
|
37055
|
+
0px 8px 0 0px rgba(31, 118, 119,0.2),
|
|
37056
|
+
-5.76px 5.76px 0 0px rgba(31, 118, 119,0.2),
|
|
37057
|
+
-8.32px 0px 0 0px rgba(31, 118, 119,0.2),
|
|
37058
|
+
-5.76px -5.76px 0 0px rgba(31, 118, 119,0.2);
|
|
37068
37059
|
}
|
|
37069
37060
|
|
|
37070
37061
|
50% {
|
|
37071
37062
|
box-shadow:
|
|
37072
|
-
0px -
|
|
37073
|
-
|
|
37074
|
-
|
|
37075
|
-
|
|
37076
|
-
0px
|
|
37077
|
-
-
|
|
37078
|
-
-
|
|
37079
|
-
-
|
|
37063
|
+
0px -8.32px 0px 0px rgba(31, 118, 119,0.2),
|
|
37064
|
+
5.76px -5.76px 0 0px rgba(31, 118, 119,0.2),
|
|
37065
|
+
8px 0px 0 0px rgba(31, 118, 119,0.5),
|
|
37066
|
+
5.6px 5.6px 0 0px rgba(31, 118, 119,0.7),
|
|
37067
|
+
0px 8px 0 0px #1F7677,
|
|
37068
|
+
-5.76px 5.76px 0 0px rgba(31, 118, 119,0.2),
|
|
37069
|
+
-8.32px 0px 0 0px rgba(31, 118, 119,0.2),
|
|
37070
|
+
-5.76px -5.76px 0 0px rgba(31, 118, 119,0.2);
|
|
37080
37071
|
}
|
|
37081
37072
|
|
|
37082
37073
|
62.5% {
|
|
37083
37074
|
box-shadow:
|
|
37084
|
-
0px -
|
|
37085
|
-
|
|
37086
|
-
|
|
37087
|
-
|
|
37088
|
-
0px
|
|
37089
|
-
-
|
|
37090
|
-
-
|
|
37091
|
-
-
|
|
37075
|
+
0px -8.32px 0px 0px rgba(31, 118, 119,0.2),
|
|
37076
|
+
5.76px -5.76px 0 0px rgba(31, 118, 119,0.2),
|
|
37077
|
+
8px 0px 0 0px rgba(31, 118, 119,0.2),
|
|
37078
|
+
5.6px 5.6px 0 0px rgba(31, 118, 119,0.5),
|
|
37079
|
+
0px 8px 0 0px rgba(31, 118, 119,0.7),
|
|
37080
|
+
-5.76px 5.76px 0 0px #1F7677,
|
|
37081
|
+
-8.32px 0px 0 0px rgba(31, 118, 119,0.2),
|
|
37082
|
+
-5.76px -5.76px 0 0px rgba(31, 118, 119,0.2);
|
|
37092
37083
|
}
|
|
37093
37084
|
|
|
37094
37085
|
75% {
|
|
37095
37086
|
box-shadow:
|
|
37096
|
-
0px -
|
|
37097
|
-
|
|
37098
|
-
|
|
37099
|
-
|
|
37100
|
-
0px
|
|
37101
|
-
-
|
|
37102
|
-
-
|
|
37103
|
-
-
|
|
37087
|
+
0px -8.32px 0px 0px rgba(31, 118, 119,0.2),
|
|
37088
|
+
5.76px -5.76px 0 0px rgba(31, 118, 119,0.2),
|
|
37089
|
+
8px 0px 0 0px rgba(31, 118, 119,0.2),
|
|
37090
|
+
5.6px 5.6px 0 0px rgba(31, 118, 119,0.2),
|
|
37091
|
+
0px 8px 0 0px rgba(31, 118, 119,0.5),
|
|
37092
|
+
-5.76px 5.76px 0 0px rgba(31, 118, 119,0.7),
|
|
37093
|
+
-8.32px 0px 0 0px #1F7677,
|
|
37094
|
+
-5.76px -5.76px 0 0px rgba(31, 118, 119,0.2);
|
|
37104
37095
|
}
|
|
37105
37096
|
|
|
37106
37097
|
87.5% {
|
|
37107
37098
|
box-shadow:
|
|
37108
|
-
0px -
|
|
37109
|
-
|
|
37110
|
-
|
|
37111
|
-
|
|
37112
|
-
0px
|
|
37113
|
-
-
|
|
37114
|
-
-
|
|
37115
|
-
-
|
|
37099
|
+
0px -8.32px 0px 0px rgba(31, 118, 119,0.2),
|
|
37100
|
+
5.76px -5.76px 0 0px rgba(31, 118, 119,0.2),
|
|
37101
|
+
8px 0px 0 0px rgba(31, 118, 119,0.2),
|
|
37102
|
+
5.6px 5.6px 0 0px rgba(31, 118, 119,0.2),
|
|
37103
|
+
0px 8px 0 0px rgba(31, 118, 119,0.2),
|
|
37104
|
+
-5.76px 5.76px 0 0px rgba(31, 118, 119,0.5),
|
|
37105
|
+
-8.32px 0px 0 0px rgba(31, 118, 119,0.7),
|
|
37106
|
+
-5.76px -5.76px 0 0px #1F7677;
|
|
37116
37107
|
}
|
|
37117
37108
|
`;
|
|
37118
37109
|
const Loader = styled.span`
|
|
37119
|
-
font-size:
|
|
37120
|
-
width:
|
|
37121
|
-
height:
|
|
37110
|
+
font-size: 10px;
|
|
37111
|
+
width: 4px;
|
|
37112
|
+
height: 4px;
|
|
37122
37113
|
border-radius: 50%;
|
|
37123
37114
|
position: relative;
|
|
37124
37115
|
text-indent: -9999em;
|
|
@@ -37855,7 +37846,7 @@ const FilterPop = props => {
|
|
|
37855
37846
|
}));
|
|
37856
37847
|
return {
|
|
37857
37848
|
visibleItems: visible,
|
|
37858
|
-
totalHeight:
|
|
37849
|
+
totalHeight: sortedList.length * itemHeight,
|
|
37859
37850
|
offsetY: startIndex * itemHeight
|
|
37860
37851
|
};
|
|
37861
37852
|
}, [sortedList, scrollTop, itemHeight, overscan, maxHeight]);
|
|
@@ -40365,7 +40356,7 @@ const FieldRow$1 = styled.div`
|
|
|
40365
40356
|
display: flex;
|
|
40366
40357
|
gap: 8px;
|
|
40367
40358
|
align-items: center;
|
|
40368
|
-
|
|
40359
|
+
justify-content: center;
|
|
40369
40360
|
padding: 16px;
|
|
40370
40361
|
`;
|
|
40371
40362
|
const Label$2 = styled.label`
|
|
@@ -40373,6 +40364,7 @@ const Label$2 = styled.label`
|
|
|
40373
40364
|
display: flex;
|
|
40374
40365
|
align-items: center;
|
|
40375
40366
|
gap: 8px;
|
|
40367
|
+
white-space: nowrap;
|
|
40376
40368
|
`;
|
|
40377
40369
|
const Input$1 = styled.input`
|
|
40378
40370
|
width: 64px;
|
|
@@ -40600,7 +40592,7 @@ const RangePop = props => {
|
|
|
40600
40592
|
max: param.type === "percent" ? 100 : param.type === "week" ? 53 : undefined
|
|
40601
40593
|
}));
|
|
40602
40594
|
}
|
|
40603
|
-
}), errors[`field_${idx}`] && /*#__PURE__*/React$1.createElement(ErrorText, null, errors[`field_${idx}`]?.message)))), /*#__PURE__*/React$1.createElement(Label$2, null, paramType)), /*#__PURE__*/React$1.createElement(Actions$1, null, /*#__PURE__*/React$1.createElement(LinkButton, {
|
|
40595
|
+
}), errors[`field_${idx}`] && /*#__PURE__*/React$1.createElement(ErrorText, null, errors[`field_${idx}`]?.message)))), /*#__PURE__*/React$1.createElement(Label$2, null, paramType === 'Week' ? paramType : "")), /*#__PURE__*/React$1.createElement(Actions$1, null, /*#__PURE__*/React$1.createElement(LinkButton, {
|
|
40604
40596
|
leftIcon: "none",
|
|
40605
40597
|
onClick: handleCancel,
|
|
40606
40598
|
rightIcon: "none",
|
|
@@ -41252,13 +41244,23 @@ const TableHeader = ({
|
|
|
41252
41244
|
});
|
|
41253
41245
|
} else if (rangeFilter) {
|
|
41254
41246
|
const currentFilterState = filterState[key];
|
|
41255
|
-
|
|
41256
|
-
|
|
41257
|
-
|
|
41258
|
-
|
|
41259
|
-
|
|
41260
|
-
|
|
41261
|
-
paramType:
|
|
41247
|
+
|
|
41248
|
+
// Determine if this is a price column
|
|
41249
|
+
const isPriceColumn = key.toLowerCase().includes('price') || key.toLowerCase().includes('cost') || key.toLowerCase().includes('amount');
|
|
41250
|
+
|
|
41251
|
+
// Configure RangePop based on column type
|
|
41252
|
+
const rangeConfig = isPriceColumn ? {
|
|
41253
|
+
paramType: '$',
|
|
41254
|
+
params: [{
|
|
41255
|
+
label: 'From $',
|
|
41256
|
+
type: 'price'
|
|
41257
|
+
}, {
|
|
41258
|
+
label: 'To $',
|
|
41259
|
+
type: 'price'
|
|
41260
|
+
}],
|
|
41261
|
+
radioOptions: ['All Prices', 'Custom Range']
|
|
41262
|
+
} : {
|
|
41263
|
+
paramType: 'Week',
|
|
41262
41264
|
params: [{
|
|
41263
41265
|
label: 'From',
|
|
41264
41266
|
type: 'week'
|
|
@@ -41266,7 +41268,17 @@ const TableHeader = ({
|
|
|
41266
41268
|
label: 'To',
|
|
41267
41269
|
type: 'week'
|
|
41268
41270
|
}],
|
|
41269
|
-
radioOptions: ['All
|
|
41271
|
+
radioOptions: ['All Weeks', 'Custom Range']
|
|
41272
|
+
};
|
|
41273
|
+
return /*#__PURE__*/React$1.createElement(RangePop, {
|
|
41274
|
+
menuName: title,
|
|
41275
|
+
width: "300px",
|
|
41276
|
+
height: "auto",
|
|
41277
|
+
buttonColor: "#066768",
|
|
41278
|
+
hoverColor: "#044d4e",
|
|
41279
|
+
paramType: rangeConfig.paramType,
|
|
41280
|
+
params: rangeConfig.params,
|
|
41281
|
+
radioOptions: rangeConfig.radioOptions,
|
|
41270
41282
|
initialValues: currentFilterState ? {
|
|
41271
41283
|
selectedRadio: currentFilterState.selectedRadio,
|
|
41272
41284
|
fields: currentFilterState.fields
|