pixel-react 1.8.6 → 1.8.7
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/.yarn/install-state.gz +0 -0
- package/lib/components/Button/Button.d.ts +2 -2
- package/lib/components/ChooseFile/ChooseFile.d.ts +3 -2
- package/lib/index.d.ts +4 -4
- package/lib/index.esm.js +27 -31
- package/lib/index.esm.js.map +1 -1
- package/lib/index.js +27 -31
- package/lib/index.js.map +1 -1
- package/package.json +3 -3
- package/src/components/Button/Button.tsx +3 -4
- package/src/components/ChooseFile/ChooseFile.tsx +3 -4
package/lib/index.js
CHANGED
@@ -1019,7 +1019,6 @@ const Typography = ({
|
|
1019
1019
|
});
|
1020
1020
|
};
|
1021
1021
|
|
1022
|
-
const areEqual$2 = (prevProps, nextProps) => prevProps.selectedFile?.name === nextProps.selectedFile?.name;
|
1023
1022
|
const Button$1 = /*#__PURE__*/React.forwardRef(({
|
1024
1023
|
variant = 'primary',
|
1025
1024
|
backgroundColor,
|
@@ -1079,7 +1078,6 @@ const Button$1 = /*#__PURE__*/React.forwardRef(({
|
|
1079
1078
|
}), iconPosition === 'right' && renderIcon()]
|
1080
1079
|
});
|
1081
1080
|
});
|
1082
|
-
var Button$2 = /*#__PURE__*/React.memo(Button$1, areEqual$2);
|
1083
1081
|
|
1084
1082
|
var css_248z$1f = ".fontXs {\n font-family: \"Poppins\";\n font-size: 10px;\n}\n\n.fontSm, .ff-drawer-container .ff-drawer .ff-drawer-header .ff-drawer-title {\n font-family: \"Poppins\";\n font-size: 12px;\n}\n\n.fontMd {\n font-family: \"Poppins\";\n font-size: 14px;\n}\n\n.fontLg {\n font-family: \"Poppins\";\n font-size: 16px;\n}\n\n.fontXL {\n font-family: \"Poppins\";\n font-size: 18px;\n}\n\n.font2Xl {\n font-family: \"Poppins\";\n font-size: 24px;\n}\n\n.font-size-8 {\n font-family: \"Poppins\";\n font-size: 8px;\n}\n\n.font-size-20 {\n font-family: \"Poppins\";\n font-size: 20px;\n}\n\n.font-size-32 {\n font-family: \"Poppins\";\n font-size: 32px;\n}\n\n.font-size-80 {\n font-family: \"Poppins\";\n font-size: 80px;\n}\n\n.ff-drawer-container .ff-overlay {\n position: fixed;\n inset: 0;\n background-color: var(--drawer-title-color);\n opacity: 0.5;\n z-index: 999;\n}\n.ff-drawer-container .child-drawer-overlay {\n z-index: 999;\n}\n.ff-drawer-container .ff-drawer {\n margin-bottom: 4px;\n position: fixed;\n right: 0;\n bottom: 0;\n top: 87px;\n background-color: var(--primary-button-text-color);\n z-index: 999;\n transform: translateX(100%);\n opacity: 0;\n}\n.ff-drawer-container .ff-drawer--open {\n transform: translateX(0);\n opacity: 1;\n}\n.ff-drawer-container .ff-drawer--small {\n width: 444px;\n}\n.ff-drawer-container .ff-drawer--medium {\n width: 666px;\n}\n.ff-drawer-container .ff-drawer--large {\n width: 888px;\n}\n.ff-drawer-container .ff-drawer--x-large {\n width: calc(100vw - 10px);\n}\n.ff-drawer-container .ff-drawer--open, .ff-drawer-container .ff-drawer--medium, .ff-drawer-container .ff-drawer--large, .ff-drawer-container .ff-drawer--x-large {\n transition: all 0.4s ease-in-out;\n border-radius: 5px;\n border: 1px solid var(--border-color);\n}\n.ff-drawer-container .ff-drawer .ff-drawer-header {\n padding: 4px 8px 4px 8px;\n display: flex;\n gap: 10px;\n border-bottom: 1px solid var(--border-color);\n}\n.ff-drawer-container .ff-drawer .ff-drawer-header .ff-drawer-title {\n font-weight: 600;\n color: var(--drawer-title-color);\n display: flex;\n align-items: center;\n gap: 12px;\n}\n.ff-drawer-container .ff-drawer .ff-drawer-header .ff-close-icon {\n height: 16px;\n width: 16px;\n border-radius: 4px;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n.ff-drawer-container .ff-drawer .ff-drawer-header .ff-drawer-action-section {\n width: 100%;\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 8px;\n height: 24px;\n}\n.ff-drawer-container .ff-drawer .ff-drawer-header .ff-drawer-action-section .ff-action-button {\n display: flex;\n align-items: center;\n gap: 5px;\n}\n.ff-drawer-container .ff-drawer .ff-drawer-header .ff-drawer-action-section .ff-action-button .ff-expand-collapse-button {\n cursor: pointer;\n background-color: var(--button-bg-color);\n outline: none;\n border: none;\n margin: 0;\n border: 1px solid transparent;\n display: flex;\n align-items: center;\n justify-content: center;\n border-radius: 8px;\n}\n.ff-drawer-container .ff-drawer .ff-drawer-header .ff-drawer-action-section .ff-action-button .ff-custom-header {\n background-color: var(--drawer-footer-bg);\n width: 100%;\n}\n.ff-drawer-container .ff-drawer .ff-drawer-body {\n background-color: var(--drawer-footer-bg);\n overflow-y: auto;\n}\n.ff-drawer-container .ff-drawer .ff-drawer-footer {\n position: fixed;\n bottom: 0;\n left: 0;\n right: 0;\n padding: 4px 8px 4px 8px;\n display: flex;\n justify-content: space-between;\n border-top: 1px solid var(--drawer-footer-border);\n z-index: 1000;\n background-color: var(--base-bg-color);\n transform: translateY(3px);\n border-radius: 0 0 4px 4px;\n}\n.ff-drawer-container .ff-drawer .ff-drawer-footer .button-container {\n display: flex;\n justify-content: flex-end;\n gap: 8px;\n}\n.ff-drawer-container .ff-drawer .ff-drawer-footer .ff-custom-footer {\n background-color: var(--drawer-footer-bg);\n width: 100%;\n border-radius: 0 0 8px 8px;\n}";
|
1085
1083
|
styleInject(css_248z$1f);
|
@@ -1266,17 +1264,17 @@ const Drawer = ({
|
|
1266
1264
|
children: customFooter || footerContent || jsxRuntime.jsxs(jsxRuntime.Fragment, {
|
1267
1265
|
children: [jsxRuntime.jsxs("div", {
|
1268
1266
|
className: "button-container",
|
1269
|
-
children: [leftSecondaryButtonProps.label && jsxRuntime.jsx(Button$
|
1267
|
+
children: [leftSecondaryButtonProps.label && jsxRuntime.jsx(Button$1, {
|
1270
1268
|
...leftSecondaryButtonProps,
|
1271
1269
|
onClick: leftPrimaryButtonProps.onClick,
|
1272
1270
|
variant: "secondary",
|
1273
1271
|
transparentBackground: true
|
1274
|
-
}), leftPrimaryButtonProps.label && jsxRuntime.jsx(Button$
|
1272
|
+
}), leftPrimaryButtonProps.label && jsxRuntime.jsx(Button$1, {
|
1275
1273
|
...leftPrimaryButtonProps,
|
1276
1274
|
onClick: leftPrimaryButtonProps.onClick,
|
1277
1275
|
variant: "primary",
|
1278
1276
|
transparentBackground: true
|
1279
|
-
}), leftTertiaryButtonProps?.label && jsxRuntime.jsx(Button$
|
1277
|
+
}), leftTertiaryButtonProps?.label && jsxRuntime.jsx(Button$1, {
|
1280
1278
|
...leftTertiaryButtonProps,
|
1281
1279
|
onClick: leftTertiaryButtonProps.onClick,
|
1282
1280
|
variant: "tertiary",
|
@@ -1284,17 +1282,17 @@ const Drawer = ({
|
|
1284
1282
|
})]
|
1285
1283
|
}), jsxRuntime.jsxs("div", {
|
1286
1284
|
className: "button-container",
|
1287
|
-
children: [rightTertiaryButtonProps?.label && jsxRuntime.jsx(Button$
|
1285
|
+
children: [rightTertiaryButtonProps?.label && jsxRuntime.jsx(Button$1, {
|
1288
1286
|
...rightTertiaryButtonProps,
|
1289
1287
|
onClick: rightTertiaryButtonProps.onClick,
|
1290
1288
|
variant: "tertiary",
|
1291
1289
|
transparentBackground: true
|
1292
|
-
}), secondaryButtonProps.label && jsxRuntime.jsx(Button$
|
1290
|
+
}), secondaryButtonProps.label && jsxRuntime.jsx(Button$1, {
|
1293
1291
|
...secondaryButtonProps,
|
1294
1292
|
onClick: onCancel,
|
1295
1293
|
variant: "secondary",
|
1296
1294
|
transparentBackground: true
|
1297
|
-
}), primaryButtonProps.label && jsxRuntime.jsx(Button$
|
1295
|
+
}), primaryButtonProps.label && jsxRuntime.jsx(Button$1, {
|
1298
1296
|
...primaryButtonProps,
|
1299
1297
|
onClick: primaryButtonProps.onClick,
|
1300
1298
|
variant: "primary",
|
@@ -1758,7 +1756,7 @@ const Dropdown$2 = /*#__PURE__*/React.forwardRef(({
|
|
1758
1756
|
})
|
1759
1757
|
}), withSelectButton && filteredOptions.length > 0 && jsxRuntime.jsx("div", {
|
1760
1758
|
className: "select-button-container",
|
1761
|
-
children: jsxRuntime.jsx(Button$
|
1759
|
+
children: jsxRuntime.jsx(Button$1, {
|
1762
1760
|
label: "Select",
|
1763
1761
|
variant: "tertiary",
|
1764
1762
|
onClick: onSelectClick
|
@@ -2220,11 +2218,11 @@ const Toaster = ({
|
|
2220
2218
|
children: toastMessage
|
2221
2219
|
}), variant === 'confirm' && jsxRuntime.jsxs("div", {
|
2222
2220
|
className: "ff-toaster-content__prompt",
|
2223
|
-
children: [jsxRuntime.jsx(Button$
|
2221
|
+
children: [jsxRuntime.jsx(Button$1, {
|
2224
2222
|
onClick: handleClose,
|
2225
2223
|
variant: "secondary",
|
2226
2224
|
children: "Cancel"
|
2227
|
-
}), jsxRuntime.jsx(Button$
|
2225
|
+
}), jsxRuntime.jsx(Button$1, {
|
2228
2226
|
onClick: onConfirmation,
|
2229
2227
|
variant: "delete",
|
2230
2228
|
children: confirmationText
|
@@ -4343,7 +4341,7 @@ const Dropzone = ({
|
|
4343
4341
|
selectedValue: selectedRadioOption?.value,
|
4344
4342
|
onChange: handleOptionChange
|
4345
4343
|
})]
|
4346
|
-
}) : jsxRuntime.jsx(Button$
|
4344
|
+
}) : jsxRuntime.jsx(Button$1, {
|
4347
4345
|
variant: "primary",
|
4348
4346
|
label: buttonLabel,
|
4349
4347
|
className: 'choose-file-btn',
|
@@ -6425,7 +6423,7 @@ var _excluded$1 = ["style"],
|
|
6425
6423
|
// It knows to compare individual style props and ignore the wrapper object.
|
6426
6424
|
// See https://reactjs.org/docs/react-api.html#reactmemo
|
6427
6425
|
|
6428
|
-
function areEqual
|
6426
|
+
function areEqual(prevProps, nextProps) {
|
6429
6427
|
var prevStyle = prevProps.style,
|
6430
6428
|
prevRest = _objectWithoutPropertiesLoose$3(prevProps, _excluded$1);
|
6431
6429
|
var nextStyle = nextProps.style,
|
@@ -6437,7 +6435,7 @@ function areEqual$1(prevProps, nextProps) {
|
|
6437
6435
|
// See https://reactjs.org/docs/react-component.html#shouldcomponentupdate
|
6438
6436
|
|
6439
6437
|
function shouldComponentUpdate(nextProps, nextState) {
|
6440
|
-
return !areEqual
|
6438
|
+
return !areEqual(this.props, nextProps) || shallowDiffers(this.state, nextState);
|
6441
6439
|
}
|
6442
6440
|
|
6443
6441
|
var LazyLoad = /*#__PURE__*/Object.freeze({
|
@@ -6446,7 +6444,7 @@ var LazyLoad = /*#__PURE__*/Object.freeze({
|
|
6446
6444
|
FixedSizeList: FixedSizeList,
|
6447
6445
|
VariableSizeGrid: VariableSizeGrid,
|
6448
6446
|
VariableSizeList: VariableSizeList,
|
6449
|
-
areEqual: areEqual
|
6447
|
+
areEqual: areEqual,
|
6450
6448
|
shouldComponentUpdate: shouldComponentUpdate
|
6451
6449
|
});
|
6452
6450
|
|
@@ -9546,12 +9544,12 @@ const MiniModal = /*#__PURE__*/React.forwardRef(({
|
|
9546
9544
|
children: footerContent
|
9547
9545
|
}) : isIconModel ? jsxRuntime.jsx(jsxRuntime.Fragment, {}) : jsxRuntime.jsxs("footer", {
|
9548
9546
|
className: "modal-footer",
|
9549
|
-
children: [jsxRuntime.jsx(Button$
|
9547
|
+
children: [jsxRuntime.jsx(Button$1, {
|
9550
9548
|
variant: "primary",
|
9551
9549
|
className: "btn-cancel",
|
9552
9550
|
onClick: cancelButtonProps?.onClick,
|
9553
9551
|
label: cancelButtonProps?.text
|
9554
|
-
}), jsxRuntime.jsx(Button$
|
9552
|
+
}), jsxRuntime.jsx(Button$1, {
|
9555
9553
|
variant: "secondary",
|
9556
9554
|
className: "btn-proceed",
|
9557
9555
|
label: proceedButtonProps?.text,
|
@@ -21055,12 +21053,12 @@ const CustomDatePicker = ({
|
|
21055
21053
|
})]
|
21056
21054
|
}), !dateOnly && jsxRuntime.jsxs("div", {
|
21057
21055
|
className: "ff-date-picker-controls",
|
21058
|
-
children: [jsxRuntime.jsx(Button$
|
21056
|
+
children: [jsxRuntime.jsx(Button$1, {
|
21059
21057
|
className: "ff-date-picker-button",
|
21060
21058
|
variant: "secondary",
|
21061
21059
|
onClick: handleCancel,
|
21062
21060
|
label: "Cancel"
|
21063
|
-
}), jsxRuntime.jsx(Button$
|
21061
|
+
}), jsxRuntime.jsx(Button$1, {
|
21064
21062
|
className: "ff-date-picker-button",
|
21065
21063
|
variant: "primary",
|
21066
21064
|
onClick: handleSave,
|
@@ -29868,7 +29866,7 @@ const Branches = ({
|
|
29868
29866
|
})]
|
29869
29867
|
}) : jsxRuntime.jsx("div", {
|
29870
29868
|
className: "ff-connecting-branch-browser-button",
|
29871
|
-
children: jsxRuntime.jsx(Button$
|
29869
|
+
children: jsxRuntime.jsx(Button$1, {
|
29872
29870
|
id: `ff-sequential-branch-add-${machineInstanceId}`,
|
29873
29871
|
variant: "tertiary",
|
29874
29872
|
label: addInstanceLabel,
|
@@ -30032,7 +30030,7 @@ const SequentialConnectingBranch = ({
|
|
30032
30030
|
className: "ff-branch-arrow"
|
30033
30031
|
})
|
30034
30032
|
}), isMachineInstances && jsxRuntime.jsx(jsxRuntime.Fragment, {
|
30035
|
-
children: jsxRuntime.jsx(Button$
|
30033
|
+
children: jsxRuntime.jsx(Button$1, {
|
30036
30034
|
variant: "tertiary",
|
30037
30035
|
label: "Add Environment",
|
30038
30036
|
size: "small",
|
@@ -30158,7 +30156,7 @@ const AttachmentButton = ({
|
|
30158
30156
|
fontWeight: "semi-bold",
|
30159
30157
|
lineHeight: '18px',
|
30160
30158
|
children: label
|
30161
|
-
}), (!showSelectedFiles || selectedFiles.length === 0) && jsxRuntime.jsx(Button$
|
30159
|
+
}), (!showSelectedFiles || selectedFiles.length === 0) && jsxRuntime.jsx(Button$1, {
|
30162
30160
|
variant: buttonVariant,
|
30163
30161
|
label: buttonLabel,
|
30164
30162
|
size: "medium",
|
@@ -37538,11 +37536,11 @@ const CreateVariableSlider = ({
|
|
37538
37536
|
const FooterContent = () => {
|
37539
37537
|
return jsxRuntime.jsxs("div", {
|
37540
37538
|
className: "ff-create-slider-footer",
|
37541
|
-
children: [jsxRuntime.jsx(Button$
|
37539
|
+
children: [jsxRuntime.jsx(Button$1, {
|
37542
37540
|
onClick: onClose,
|
37543
37541
|
label: "Cancel",
|
37544
37542
|
variant: "tertiary"
|
37545
|
-
}), jsxRuntime.jsx(Button$
|
37543
|
+
}), jsxRuntime.jsx(Button$1, {
|
37546
37544
|
variant: "primary",
|
37547
37545
|
label: "create",
|
37548
37546
|
type: "submit",
|
@@ -37801,7 +37799,6 @@ const ProgressBar = ({
|
|
37801
37799
|
});
|
37802
37800
|
};
|
37803
37801
|
|
37804
|
-
const areEqual = (prevProps, nextProps) => prevProps.selectedFile?.name === nextProps.selectedFile?.name;
|
37805
37802
|
const ChooseFile = ({
|
37806
37803
|
variant = 'primary',
|
37807
37804
|
size = 'small',
|
@@ -37818,7 +37815,7 @@ const ChooseFile = ({
|
|
37818
37815
|
handleCloseIcon
|
37819
37816
|
}) => {
|
37820
37817
|
return jsxRuntime.jsx("div", {
|
37821
|
-
children: jsxRuntime.jsx(Button$
|
37818
|
+
children: jsxRuntime.jsx(Button$1, {
|
37822
37819
|
variant: variant,
|
37823
37820
|
label: label,
|
37824
37821
|
type: type,
|
@@ -37836,7 +37833,6 @@ const ChooseFile = ({
|
|
37836
37833
|
})
|
37837
37834
|
});
|
37838
37835
|
};
|
37839
|
-
var ChooseFile$1 = /*#__PURE__*/React.memo(ChooseFile, areEqual);
|
37840
37836
|
|
37841
37837
|
var css_248z$8 = "/* Container Styling */\n.ff-script-switch-container {\n display: flex;\n background-color: var(--base-bg-color);\n height: 24px;\n width: 48px;\n border-radius: 6px;\n border: 1px solid var(--border-color);\n align-items: center;\n justify-content: center;\n /* Button Styling */\n /* Active Button */\n}\n.ff-script-switch-container .ff-script-switch-button {\n padding: 0.1px;\n border: none;\n border-radius: 4px;\n cursor: pointer;\n outline: none;\n transition: all 0.3s ease;\n /* Button Hover Effect */\n}\n.ff-script-switch-container .ff-script-switch-button:hover {\n background-color: var(--hover-color);\n color: var(--brand-color);\n}\n.ff-script-switch-container .ff-script-switch-button.active {\n background-color: var(--ff-line-number-bg);\n color: var(--base-bg-color);\n}";
|
37842
37838
|
styleInject(css_248z$8);
|
@@ -51231,11 +51227,11 @@ const PopUpModal = ({
|
|
51231
51227
|
})]
|
51232
51228
|
}), jsxRuntime.jsxs("div", {
|
51233
51229
|
className: 'warning_modal_footer_button',
|
51234
|
-
children: [jsxRuntime.jsx(Button$
|
51230
|
+
children: [jsxRuntime.jsx(Button$1, {
|
51235
51231
|
variant: "secondary",
|
51236
51232
|
label: firstButtonLabel,
|
51237
51233
|
onClick: onClose
|
51238
|
-
}), jsxRuntime.jsx(Button$
|
51234
|
+
}), jsxRuntime.jsx(Button$1, {
|
51239
51235
|
variant: buttonVariant || 'warning',
|
51240
51236
|
label: secondButtonLabel,
|
51241
51237
|
onClick: onContinue
|
@@ -53396,12 +53392,12 @@ exports.Avatar = Avatar;
|
|
53396
53392
|
exports.BASE64_REGEX = BASE64_REGEX;
|
53397
53393
|
exports.BINARY_NUMBER_REGEX = BINARY_NUMBER_REGEX;
|
53398
53394
|
exports.BarChart = BarChart;
|
53399
|
-
exports.Button = Button$
|
53395
|
+
exports.Button = Button$1;
|
53400
53396
|
exports.CREDIT_CARD_REGEX = CREDIT_CARD_REGEX;
|
53401
53397
|
exports.CURRENCY_GENERIC_REGEX = CURRENCY_GENERIC_REGEX;
|
53402
53398
|
exports.Checkbox = Checkbox;
|
53403
53399
|
exports.Chip = Chip;
|
53404
|
-
exports.ChooseFile = ChooseFile
|
53400
|
+
exports.ChooseFile = ChooseFile;
|
53405
53401
|
exports.Col = Col;
|
53406
53402
|
exports.Comments = Comments;
|
53407
53403
|
exports.ConditionalDropdown = ConditionalDropdown;
|