@rufous/ui 0.1.84 → 0.1.86
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/main.cjs +376 -90
- package/dist/main.css +536 -115
- package/dist/main.d.cts +71 -4
- package/dist/main.d.ts +71 -4
- package/dist/main.js +693 -410
- package/package.json +1 -1
package/dist/main.js
CHANGED
|
@@ -1264,8 +1264,97 @@ var StandardButton = ({ children, sx, className, ...props }) => {
|
|
|
1264
1264
|
};
|
|
1265
1265
|
var stdButton_default = StandardButton;
|
|
1266
1266
|
|
|
1267
|
-
// lib/
|
|
1267
|
+
// lib/Buttons/Button.tsx
|
|
1268
1268
|
import * as React63 from "react";
|
|
1269
|
+
var Button = React63.forwardRef(
|
|
1270
|
+
({
|
|
1271
|
+
variant = "text",
|
|
1272
|
+
color = "primary",
|
|
1273
|
+
size = "medium",
|
|
1274
|
+
startIcon,
|
|
1275
|
+
endIcon,
|
|
1276
|
+
fullWidth = false,
|
|
1277
|
+
disabled = false,
|
|
1278
|
+
disableElevation = false,
|
|
1279
|
+
loading = false,
|
|
1280
|
+
loadingPosition = "center",
|
|
1281
|
+
component,
|
|
1282
|
+
children,
|
|
1283
|
+
className,
|
|
1284
|
+
style,
|
|
1285
|
+
sx,
|
|
1286
|
+
href,
|
|
1287
|
+
type = "button",
|
|
1288
|
+
...rest
|
|
1289
|
+
}, ref) => {
|
|
1290
|
+
const sxClass = useSx(sx);
|
|
1291
|
+
const classes = [
|
|
1292
|
+
"rf-btn",
|
|
1293
|
+
`rf-btn--${variant}`,
|
|
1294
|
+
`rf-btn--${color}`,
|
|
1295
|
+
`rf-btn--${size}`,
|
|
1296
|
+
fullWidth && "rf-btn--full-width",
|
|
1297
|
+
disableElevation && "rf-btn--no-elevation",
|
|
1298
|
+
disabled && "rf-btn--disabled",
|
|
1299
|
+
loading && "rf-btn--loading",
|
|
1300
|
+
sxClass,
|
|
1301
|
+
className
|
|
1302
|
+
].filter(Boolean).join(" ");
|
|
1303
|
+
const Tag = component || (href ? "a" : "button");
|
|
1304
|
+
const tagProps = { ...rest };
|
|
1305
|
+
if (Tag === "a") {
|
|
1306
|
+
tagProps.href = disabled ? void 0 : href;
|
|
1307
|
+
} else {
|
|
1308
|
+
tagProps.type = type;
|
|
1309
|
+
tagProps.disabled = disabled || loading;
|
|
1310
|
+
}
|
|
1311
|
+
return /* @__PURE__ */ React63.createElement(Tag, { ref, className: classes, style, ...tagProps }, loading && loadingPosition === "start" && /* @__PURE__ */ React63.createElement("span", { className: "rf-btn__loading-indicator rf-btn__loading--start" }, /* @__PURE__ */ React63.createElement(circularProgress_default, { size: size === "small" ? 14 : size === "large" ? 22 : 18 })), startIcon && !loading && /* @__PURE__ */ React63.createElement("span", { className: "rf-btn__start-icon" }, startIcon), loading && loadingPosition === "center" ? /* @__PURE__ */ React63.createElement("span", { className: "rf-btn__loading-indicator" }, /* @__PURE__ */ React63.createElement(circularProgress_default, { size: size === "small" ? 14 : size === "large" ? 22 : 18 })) : /* @__PURE__ */ React63.createElement("span", { className: "rf-btn__label" }, children), endIcon && !loading && /* @__PURE__ */ React63.createElement("span", { className: "rf-btn__end-icon" }, endIcon), loading && loadingPosition === "end" && /* @__PURE__ */ React63.createElement("span", { className: "rf-btn__loading-indicator rf-btn__loading--end" }, /* @__PURE__ */ React63.createElement(circularProgress_default, { size: size === "small" ? 14 : size === "large" ? 22 : 18 })));
|
|
1312
|
+
}
|
|
1313
|
+
);
|
|
1314
|
+
Button.displayName = "Button";
|
|
1315
|
+
|
|
1316
|
+
// lib/Buttons/IconButton.tsx
|
|
1317
|
+
import * as React64 from "react";
|
|
1318
|
+
var IconButton = React64.forwardRef(
|
|
1319
|
+
({
|
|
1320
|
+
color = "default",
|
|
1321
|
+
size = "medium",
|
|
1322
|
+
edge = false,
|
|
1323
|
+
disabled = false,
|
|
1324
|
+
component,
|
|
1325
|
+
children,
|
|
1326
|
+
className,
|
|
1327
|
+
style,
|
|
1328
|
+
sx,
|
|
1329
|
+
href,
|
|
1330
|
+
type = "button",
|
|
1331
|
+
...rest
|
|
1332
|
+
}, ref) => {
|
|
1333
|
+
const sxClass = useSx(sx);
|
|
1334
|
+
const classes = [
|
|
1335
|
+
"rf-icon-btn",
|
|
1336
|
+
`rf-icon-btn--${color}`,
|
|
1337
|
+
`rf-icon-btn--${size}`,
|
|
1338
|
+
edge && `rf-icon-btn--edge-${edge}`,
|
|
1339
|
+
disabled && "rf-icon-btn--disabled",
|
|
1340
|
+
sxClass,
|
|
1341
|
+
className
|
|
1342
|
+
].filter(Boolean).join(" ");
|
|
1343
|
+
const Tag = component || (href ? "a" : "button");
|
|
1344
|
+
const tagProps = { ...rest };
|
|
1345
|
+
if (Tag === "a") {
|
|
1346
|
+
tagProps.href = disabled ? void 0 : href;
|
|
1347
|
+
} else {
|
|
1348
|
+
tagProps.type = type;
|
|
1349
|
+
tagProps.disabled = disabled;
|
|
1350
|
+
}
|
|
1351
|
+
return /* @__PURE__ */ React64.createElement(Tag, { ref, className: classes, style, ...tagProps }, children);
|
|
1352
|
+
}
|
|
1353
|
+
);
|
|
1354
|
+
IconButton.displayName = "IconButton";
|
|
1355
|
+
|
|
1356
|
+
// lib/Dialogs/BaseDialog.tsx
|
|
1357
|
+
import * as React65 from "react";
|
|
1269
1358
|
import { useState as useState2 } from "react";
|
|
1270
1359
|
import { X } from "lucide-react";
|
|
1271
1360
|
var BaseDialog = ({
|
|
@@ -1300,7 +1389,7 @@ var BaseDialog = ({
|
|
|
1300
1389
|
const sxClass = useSx(sx);
|
|
1301
1390
|
if (!open) return null;
|
|
1302
1391
|
const isButtonLoading = isSubmitting || loading;
|
|
1303
|
-
const renderButtons = () => /* @__PURE__ */
|
|
1392
|
+
const renderButtons = () => /* @__PURE__ */ React65.createElement("div", { className: "dialog-footer", style: { justifyContent: buttonAlign } }, showCancelButton && /* @__PURE__ */ React65.createElement(
|
|
1304
1393
|
"button",
|
|
1305
1394
|
{
|
|
1306
1395
|
className: "btn-cancel",
|
|
@@ -1308,7 +1397,7 @@ var BaseDialog = ({
|
|
|
1308
1397
|
disabled: isLoading || isButtonLoading
|
|
1309
1398
|
},
|
|
1310
1399
|
cancelText
|
|
1311
|
-
), onConfirm && /* @__PURE__ */
|
|
1400
|
+
), onConfirm && /* @__PURE__ */ React65.createElement(
|
|
1312
1401
|
"button",
|
|
1313
1402
|
{
|
|
1314
1403
|
className: "btn-confirm",
|
|
@@ -1320,10 +1409,10 @@ var BaseDialog = ({
|
|
|
1320
1409
|
setIsSubmitting(false);
|
|
1321
1410
|
}
|
|
1322
1411
|
},
|
|
1323
|
-
/* @__PURE__ */
|
|
1324
|
-
isButtonLoading && /* @__PURE__ */
|
|
1412
|
+
/* @__PURE__ */ React65.createElement("span", { style: { visibility: isButtonLoading ? "hidden" : "visible" } }, confirmText),
|
|
1413
|
+
isButtonLoading && /* @__PURE__ */ React65.createElement("span", { className: "spinner", style: { position: "absolute" } })
|
|
1325
1414
|
));
|
|
1326
|
-
return /* @__PURE__ */
|
|
1415
|
+
return /* @__PURE__ */ React65.createElement("div", { className: `dialog-overlay ${size === "fullScreen" ? "overlay-fullscreen" : ""}` }, /* @__PURE__ */ React65.createElement(
|
|
1327
1416
|
"div",
|
|
1328
1417
|
{
|
|
1329
1418
|
className: ["dialog-container", size ? `size-${size}` : "", sxClass, className].filter(Boolean).join(" "),
|
|
@@ -1332,15 +1421,15 @@ var BaseDialog = ({
|
|
|
1332
1421
|
minHeight
|
|
1333
1422
|
}
|
|
1334
1423
|
},
|
|
1335
|
-
/* @__PURE__ */
|
|
1424
|
+
/* @__PURE__ */ React65.createElement("div", { className: "dialog-title" }, /* @__PURE__ */ React65.createElement("h2", null, formatTitle ? title?.charAt(0).toUpperCase() + title?.slice(1) : title), showCloseButton && /* @__PURE__ */ React65.createElement("button", { className: "btn-close", onClick: onClose }, /* @__PURE__ */ React65.createElement(
|
|
1336
1425
|
X,
|
|
1337
1426
|
{
|
|
1338
1427
|
size: 18,
|
|
1339
1428
|
color: themeConfig?.icon || "#666666"
|
|
1340
1429
|
}
|
|
1341
1430
|
))),
|
|
1342
|
-
/* @__PURE__ */
|
|
1343
|
-
/* @__PURE__ */
|
|
1431
|
+
/* @__PURE__ */ React65.createElement("div", { className: "dialog-divider" }),
|
|
1432
|
+
/* @__PURE__ */ React65.createElement(
|
|
1344
1433
|
"div",
|
|
1345
1434
|
{
|
|
1346
1435
|
className: "dialog-body",
|
|
@@ -1351,14 +1440,14 @@ var BaseDialog = ({
|
|
|
1351
1440
|
},
|
|
1352
1441
|
children
|
|
1353
1442
|
),
|
|
1354
|
-
/* @__PURE__ */
|
|
1443
|
+
/* @__PURE__ */ React65.createElement("div", { className: "dialog-divider" }),
|
|
1355
1444
|
customButtons || renderButtons()
|
|
1356
1445
|
));
|
|
1357
1446
|
};
|
|
1358
1447
|
var BaseDialog_default = BaseDialog;
|
|
1359
1448
|
|
|
1360
1449
|
// lib/Contexts/rufousThemeProvider.tsx
|
|
1361
|
-
import
|
|
1450
|
+
import React66, {
|
|
1362
1451
|
createContext,
|
|
1363
1452
|
useContext,
|
|
1364
1453
|
useEffect as useEffect2,
|
|
@@ -1395,7 +1484,7 @@ var RufousThemeProvider = ({ children }) => {
|
|
|
1395
1484
|
setCommittedThemeKey(key);
|
|
1396
1485
|
};
|
|
1397
1486
|
const cancelTheme = () => setPreviewThemeKey(committedThemeKey);
|
|
1398
|
-
return /* @__PURE__ */
|
|
1487
|
+
return /* @__PURE__ */ React66.createElement(
|
|
1399
1488
|
RufousThemeContext.Provider,
|
|
1400
1489
|
{
|
|
1401
1490
|
value: {
|
|
@@ -1409,7 +1498,7 @@ var RufousThemeProvider = ({ children }) => {
|
|
|
1409
1498
|
updateSettings: (v) => setSettings(v)
|
|
1410
1499
|
}
|
|
1411
1500
|
},
|
|
1412
|
-
/* @__PURE__ */
|
|
1501
|
+
/* @__PURE__ */ React66.createElement(
|
|
1413
1502
|
"div",
|
|
1414
1503
|
{
|
|
1415
1504
|
className: `theme-${previewThemeKey || committedThemeKey || "default"}`
|
|
@@ -1421,7 +1510,7 @@ var RufousThemeProvider = ({ children }) => {
|
|
|
1421
1510
|
var useRufousTheme = () => useContext(RufousThemeContext);
|
|
1422
1511
|
|
|
1423
1512
|
// lib/CheckBoxes/CheckBox.jsx
|
|
1424
|
-
import
|
|
1513
|
+
import React67 from "react";
|
|
1425
1514
|
var Checkbox = ({
|
|
1426
1515
|
id,
|
|
1427
1516
|
label,
|
|
@@ -1436,7 +1525,7 @@ var Checkbox = ({
|
|
|
1436
1525
|
const handleChange = (e) => {
|
|
1437
1526
|
if (onChange) onChange(e.target.checked);
|
|
1438
1527
|
};
|
|
1439
|
-
return /* @__PURE__ */
|
|
1528
|
+
return /* @__PURE__ */ React67.createElement("div", { className: ["checkbox-wrapper-13", sxClass].filter(Boolean).join(" ") }, /* @__PURE__ */ React67.createElement("label", { className: `${className}`, style }, /* @__PURE__ */ React67.createElement(
|
|
1440
1529
|
"input",
|
|
1441
1530
|
{
|
|
1442
1531
|
id,
|
|
@@ -1445,12 +1534,12 @@ var Checkbox = ({
|
|
|
1445
1534
|
onChange: handleChange,
|
|
1446
1535
|
disabled
|
|
1447
1536
|
}
|
|
1448
|
-
), label && /* @__PURE__ */
|
|
1537
|
+
), label && /* @__PURE__ */ React67.createElement("span", { className: "checkbox-label" }, label)));
|
|
1449
1538
|
};
|
|
1450
1539
|
|
|
1451
1540
|
// lib/TextFields/TextField.tsx
|
|
1452
|
-
import
|
|
1453
|
-
var TextField =
|
|
1541
|
+
import React68, { forwardRef as forwardRef3 } from "react";
|
|
1542
|
+
var TextField = forwardRef3(({
|
|
1454
1543
|
label,
|
|
1455
1544
|
name,
|
|
1456
1545
|
id,
|
|
@@ -1496,7 +1585,7 @@ var TextField = forwardRef(({
|
|
|
1496
1585
|
sxClass,
|
|
1497
1586
|
className
|
|
1498
1587
|
].filter(Boolean).join(" ");
|
|
1499
|
-
const internalRef =
|
|
1588
|
+
const internalRef = React68.useRef(null);
|
|
1500
1589
|
const triggerChange = () => {
|
|
1501
1590
|
if (internalRef.current) {
|
|
1502
1591
|
const nativeInputValueSetter = Object.getOwnPropertyDescriptor(window.HTMLInputElement.prototype, "value")?.set;
|
|
@@ -1544,7 +1633,7 @@ var TextField = forwardRef(({
|
|
|
1544
1633
|
props.onKeyDown(e);
|
|
1545
1634
|
}
|
|
1546
1635
|
};
|
|
1547
|
-
return /* @__PURE__ */
|
|
1636
|
+
return /* @__PURE__ */ React68.createElement("div", { ref, className: rootClasses, style }, /* @__PURE__ */ React68.createElement("div", { className: `rf-text-field__wrapper ${InputProps?.className || ""}`, style: InputProps?.style }, InputProps?.startAdornment && /* @__PURE__ */ React68.createElement("div", { className: "rf-text-field__adornment rf-text-field__adornment--start" }, InputProps.startAdornment), /* @__PURE__ */ React68.createElement(
|
|
1548
1637
|
"input",
|
|
1549
1638
|
{
|
|
1550
1639
|
ref: internalRef,
|
|
@@ -1562,12 +1651,12 @@ var TextField = forwardRef(({
|
|
|
1562
1651
|
...slotProps?.input,
|
|
1563
1652
|
...props
|
|
1564
1653
|
}
|
|
1565
|
-
), InputProps?.endAdornment && /* @__PURE__ */
|
|
1654
|
+
), InputProps?.endAdornment && /* @__PURE__ */ React68.createElement("div", { className: "rf-text-field__adornment rf-text-field__adornment--end" }, InputProps.endAdornment), type === "number" && !disabled && !readOnly && /* @__PURE__ */ React68.createElement("div", { className: "rf-text-field__number-controls" }, /* @__PURE__ */ React68.createElement("button", { type: "button", tabIndex: -1, onClick: handleIncrement, className: "rf-text-field__number-btn" }, /* @__PURE__ */ React68.createElement("svg", { width: "8", height: "5", viewBox: "0 0 8 5", fill: "currentColor" }, /* @__PURE__ */ React68.createElement("path", { d: "M4 0L8 5H0L4 0Z" }))), /* @__PURE__ */ React68.createElement("button", { type: "button", tabIndex: -1, onClick: handleDecrement, className: "rf-text-field__number-btn", style: { marginTop: 2 } }, /* @__PURE__ */ React68.createElement("svg", { width: "8", height: "5", viewBox: "0 0 8 5", fill: "currentColor" }, /* @__PURE__ */ React68.createElement("path", { d: "M4 5L0 0H8L4 5Z" })))), hasLabel && /* @__PURE__ */ React68.createElement("label", { htmlFor: inputId, className: "rf-text-field__label" }, label, " ", required && /* @__PURE__ */ React68.createElement("span", { className: "rf-text-field__asterisk" }, "*")), variant === "outlined" && /* @__PURE__ */ React68.createElement("fieldset", { className: "rf-text-field__notch" }, hasLabel ? /* @__PURE__ */ React68.createElement("legend", { className: "rf-text-field__legend" }, /* @__PURE__ */ React68.createElement("span", null, label, " ", required ? "*" : "")) : /* @__PURE__ */ React68.createElement("legend", { className: "rf-text-field__legend--empty" }))), helperText && /* @__PURE__ */ React68.createElement("div", { className: "rf-text-field__helper-text" }, helperText));
|
|
1566
1655
|
});
|
|
1567
1656
|
TextField.displayName = "TextField";
|
|
1568
1657
|
|
|
1569
1658
|
// lib/TextFields/AddressLookup.tsx
|
|
1570
|
-
import
|
|
1659
|
+
import React69, { useState as useState4, useRef as useRef3, useEffect as useEffect3 } from "react";
|
|
1571
1660
|
import Axios from "axios";
|
|
1572
1661
|
import { Country, State, City } from "country-state-city";
|
|
1573
1662
|
var AddressLookup = ({
|
|
@@ -1742,7 +1831,7 @@ var AddressLookup = ({
|
|
|
1742
1831
|
city: ""
|
|
1743
1832
|
});
|
|
1744
1833
|
};
|
|
1745
|
-
return /* @__PURE__ */
|
|
1834
|
+
return /* @__PURE__ */ React69.createElement("div", { className: "address-lookup-container", style: sx, ref: containerRef }, /* @__PURE__ */ React69.createElement("div", { className: `address-lookup-grid address-lookup-grid-${layout}` }, /* @__PURE__ */ React69.createElement("div", { className: "address-lookup-grid-item col-l1" }, /* @__PURE__ */ React69.createElement(
|
|
1746
1835
|
TextField,
|
|
1747
1836
|
{
|
|
1748
1837
|
label,
|
|
@@ -1775,7 +1864,7 @@ var AddressLookup = ({
|
|
|
1775
1864
|
},
|
|
1776
1865
|
onFocus: () => suggestions.length > 0 && setShowSuggestions(true)
|
|
1777
1866
|
}
|
|
1778
|
-
), loading && /* @__PURE__ */
|
|
1867
|
+
), loading && /* @__PURE__ */ React69.createElement("div", { className: "loading-indicator" }, /* @__PURE__ */ React69.createElement(circularProgress_default, { size: 20 })), showSuggestions && suggestions.length > 0 && /* @__PURE__ */ React69.createElement("div", { className: "autocomplete-dropdown" }, suggestions.map((option, idx) => /* @__PURE__ */ React69.createElement(
|
|
1779
1868
|
"div",
|
|
1780
1869
|
{
|
|
1781
1870
|
key: idx,
|
|
@@ -1786,9 +1875,9 @@ var AddressLookup = ({
|
|
|
1786
1875
|
fetchPlaceDetails(option.placePrediction.placeId, mainText);
|
|
1787
1876
|
}
|
|
1788
1877
|
},
|
|
1789
|
-
/* @__PURE__ */
|
|
1790
|
-
/* @__PURE__ */
|
|
1791
|
-
))), error.addressLine1 && /* @__PURE__ */
|
|
1878
|
+
/* @__PURE__ */ React69.createElement("div", { className: "autocomplete-main-text" }, option?.placePrediction?.structuredFormat?.mainText?.text),
|
|
1879
|
+
/* @__PURE__ */ React69.createElement("div", { className: "autocomplete-secondary-text" }, option?.placePrediction?.structuredFormat?.secondaryText?.text)
|
|
1880
|
+
))), error.addressLine1 && /* @__PURE__ */ React69.createElement("div", { className: "field-error-text" }, error.addressLine1)), layout === "compact" && /* @__PURE__ */ React69.createElement("div", { className: "address-lookup-grid-item col-l2" }, /* @__PURE__ */ React69.createElement(
|
|
1792
1881
|
TextField,
|
|
1793
1882
|
{
|
|
1794
1883
|
label: "Address Line 2",
|
|
@@ -1797,7 +1886,7 @@ var AddressLookup = ({
|
|
|
1797
1886
|
value: value.addressLine2 || "",
|
|
1798
1887
|
onChange: (e) => handleChange("addressLine2", e.target.value)
|
|
1799
1888
|
}
|
|
1800
|
-
)), layout !== "compact" && /* @__PURE__ */
|
|
1889
|
+
)), layout !== "compact" && /* @__PURE__ */ React69.createElement("div", { className: "address-lookup-grid-item col-l2" }, /* @__PURE__ */ React69.createElement(
|
|
1801
1890
|
TextField,
|
|
1802
1891
|
{
|
|
1803
1892
|
label: "Address Line 2",
|
|
@@ -1806,7 +1895,7 @@ var AddressLookup = ({
|
|
|
1806
1895
|
value: value.addressLine2 || "",
|
|
1807
1896
|
onChange: (e) => handleChange("addressLine2", e.target.value)
|
|
1808
1897
|
}
|
|
1809
|
-
)), /* @__PURE__ */
|
|
1898
|
+
)), /* @__PURE__ */ React69.createElement("div", { className: "address-lookup-grid-item col-country" }, /* @__PURE__ */ React69.createElement(
|
|
1810
1899
|
TextField,
|
|
1811
1900
|
{
|
|
1812
1901
|
label: "Country",
|
|
@@ -1819,7 +1908,7 @@ var AddressLookup = ({
|
|
|
1819
1908
|
onChange: (e) => handleCountryChange(e.target.value),
|
|
1820
1909
|
list: "countries-list"
|
|
1821
1910
|
}
|
|
1822
|
-
), /* @__PURE__ */
|
|
1911
|
+
), /* @__PURE__ */ React69.createElement("datalist", { id: "countries-list" }, countries.map((c) => /* @__PURE__ */ React69.createElement("option", { key: c.isoCode, value: c.name }))), error.country && /* @__PURE__ */ React69.createElement("div", { className: "field-error-text" }, error.country)), /* @__PURE__ */ React69.createElement("div", { className: "address-lookup-grid-item col-state" }, /* @__PURE__ */ React69.createElement(
|
|
1823
1912
|
TextField,
|
|
1824
1913
|
{
|
|
1825
1914
|
label: "State",
|
|
@@ -1833,7 +1922,7 @@ var AddressLookup = ({
|
|
|
1833
1922
|
onChange: (e) => handleStateChange(e.target.value),
|
|
1834
1923
|
list: "states-list"
|
|
1835
1924
|
}
|
|
1836
|
-
), /* @__PURE__ */
|
|
1925
|
+
), /* @__PURE__ */ React69.createElement("datalist", { id: "states-list" }, states.map((s) => /* @__PURE__ */ React69.createElement("option", { key: s.isoCode, value: s.name }))), error.state && /* @__PURE__ */ React69.createElement("div", { className: "field-error-text" }, error.state)), /* @__PURE__ */ React69.createElement("div", { className: "address-lookup-grid-item col-city" }, /* @__PURE__ */ React69.createElement(
|
|
1837
1926
|
TextField,
|
|
1838
1927
|
{
|
|
1839
1928
|
label: "City",
|
|
@@ -1847,7 +1936,7 @@ var AddressLookup = ({
|
|
|
1847
1936
|
onChange: (e) => handleChange("city", e.target.value),
|
|
1848
1937
|
list: "cities-list"
|
|
1849
1938
|
}
|
|
1850
|
-
), /* @__PURE__ */
|
|
1939
|
+
), /* @__PURE__ */ React69.createElement("datalist", { id: "cities-list" }, cities.map((c, i) => /* @__PURE__ */ React69.createElement("option", { key: i, value: c.name }))), error.city && /* @__PURE__ */ React69.createElement("div", { className: "field-error-text" }, error.city)), /* @__PURE__ */ React69.createElement("div", { className: "address-lookup-grid-item col-pin" }, /* @__PURE__ */ React69.createElement(
|
|
1851
1940
|
TextField,
|
|
1852
1941
|
{
|
|
1853
1942
|
label: "Pincode",
|
|
@@ -1859,12 +1948,12 @@ var AddressLookup = ({
|
|
|
1859
1948
|
readOnly: googleFields.pincode && !!value.pincode,
|
|
1860
1949
|
onChange: (e) => handleChange("pincode", e.target.value)
|
|
1861
1950
|
}
|
|
1862
|
-
), error.pincode && /* @__PURE__ */
|
|
1951
|
+
), error.pincode && /* @__PURE__ */ React69.createElement("div", { className: "field-error-text" }, error.pincode))));
|
|
1863
1952
|
};
|
|
1864
1953
|
var AddressLookup_default = AddressLookup;
|
|
1865
1954
|
|
|
1866
1955
|
// lib/TextFields/DateField.tsx
|
|
1867
|
-
import
|
|
1956
|
+
import React70, {
|
|
1868
1957
|
useState as useState5,
|
|
1869
1958
|
useRef as useRef4,
|
|
1870
1959
|
useEffect as useEffect4,
|
|
@@ -1885,10 +1974,25 @@ var MONTHS = [
|
|
|
1885
1974
|
"November",
|
|
1886
1975
|
"December"
|
|
1887
1976
|
];
|
|
1977
|
+
var MONTHS_SHORT = [
|
|
1978
|
+
"Jan",
|
|
1979
|
+
"Feb",
|
|
1980
|
+
"Mar",
|
|
1981
|
+
"Apr",
|
|
1982
|
+
"May",
|
|
1983
|
+
"Jun",
|
|
1984
|
+
"Jul",
|
|
1985
|
+
"Aug",
|
|
1986
|
+
"Sep",
|
|
1987
|
+
"Oct",
|
|
1988
|
+
"Nov",
|
|
1989
|
+
"Dec"
|
|
1990
|
+
];
|
|
1888
1991
|
var formatDisplay = (d, fmt = "MM/DD/YYYY") => {
|
|
1889
1992
|
const mm = String(d.getMonth() + 1).padStart(2, "0");
|
|
1890
1993
|
const dd = String(d.getDate()).padStart(2, "0");
|
|
1891
1994
|
const yyyy = String(d.getFullYear());
|
|
1995
|
+
const day = d.getDate();
|
|
1892
1996
|
switch (fmt) {
|
|
1893
1997
|
case "DD/MM/YYYY":
|
|
1894
1998
|
return `${dd}/${mm}/${yyyy}`;
|
|
@@ -1900,13 +2004,49 @@ var formatDisplay = (d, fmt = "MM/DD/YYYY") => {
|
|
|
1900
2004
|
return `${mm}-${dd}-${yyyy}`;
|
|
1901
2005
|
case "YYYY/MM/DD":
|
|
1902
2006
|
return `${yyyy}/${mm}/${dd}`;
|
|
2007
|
+
case "DD MMM YYYY":
|
|
2008
|
+
return `${dd} ${MONTHS_SHORT[d.getMonth()]} ${yyyy}`;
|
|
2009
|
+
case "MMM DD, YYYY":
|
|
2010
|
+
return `${MONTHS_SHORT[d.getMonth()]} ${dd}, ${yyyy}`;
|
|
2011
|
+
case "DD MMMM YYYY":
|
|
2012
|
+
return `${dd} ${MONTHS[d.getMonth()]} ${yyyy}`;
|
|
2013
|
+
case "MMMM DD, YYYY":
|
|
2014
|
+
return `${MONTHS[d.getMonth()]} ${dd}, ${yyyy}`;
|
|
1903
2015
|
case "MM/DD/YYYY":
|
|
1904
2016
|
default:
|
|
1905
2017
|
return `${mm}/${dd}/${yyyy}`;
|
|
1906
2018
|
}
|
|
1907
2019
|
};
|
|
1908
2020
|
var formatTimeDisplay = (h, m, ampm) => `${String(h).padStart(2, "0")}:${String(m).padStart(2, "0")} ${ampm}`;
|
|
2021
|
+
var parseMonthName = (name) => {
|
|
2022
|
+
const lower = name.toLowerCase();
|
|
2023
|
+
let idx = MONTHS.findIndex((m) => m.toLowerCase() === lower);
|
|
2024
|
+
if (idx >= 0) return idx;
|
|
2025
|
+
idx = MONTHS_SHORT.findIndex((m) => m.toLowerCase() === lower);
|
|
2026
|
+
return idx;
|
|
2027
|
+
};
|
|
1909
2028
|
var parseDisplay = (str, fmt = "MM/DD/YYYY") => {
|
|
2029
|
+
if (fmt === "DD MMM YYYY" || fmt === "DD MMMM YYYY") {
|
|
2030
|
+
const parts2 = str.split(" ");
|
|
2031
|
+
if (parts2.length !== 3) return null;
|
|
2032
|
+
const dd2 = parseInt(parts2[0], 10);
|
|
2033
|
+
const mm2 = parseMonthName(parts2[1]);
|
|
2034
|
+
const yyyy2 = parseInt(parts2[2], 10);
|
|
2035
|
+
if (isNaN(dd2) || mm2 < 0 || isNaN(yyyy2) || yyyy2 < 1e3) return null;
|
|
2036
|
+
const d2 = new Date(yyyy2, mm2, dd2);
|
|
2037
|
+
return isNaN(d2.getTime()) ? null : d2;
|
|
2038
|
+
}
|
|
2039
|
+
if (fmt === "MMM DD, YYYY" || fmt === "MMMM DD, YYYY") {
|
|
2040
|
+
const cleaned = str.replace(",", "");
|
|
2041
|
+
const parts2 = cleaned.split(" ").filter(Boolean);
|
|
2042
|
+
if (parts2.length !== 3) return null;
|
|
2043
|
+
const mm2 = parseMonthName(parts2[0]);
|
|
2044
|
+
const dd2 = parseInt(parts2[1], 10);
|
|
2045
|
+
const yyyy2 = parseInt(parts2[2], 10);
|
|
2046
|
+
if (mm2 < 0 || isNaN(dd2) || isNaN(yyyy2) || yyyy2 < 1e3) return null;
|
|
2047
|
+
const d2 = new Date(yyyy2, mm2, dd2);
|
|
2048
|
+
return isNaN(d2.getTime()) ? null : d2;
|
|
2049
|
+
}
|
|
1910
2050
|
const sep = str.includes("/") ? "/" : "-";
|
|
1911
2051
|
const parts = str.split(sep);
|
|
1912
2052
|
if (parts.length !== 3) return null;
|
|
@@ -1964,9 +2104,9 @@ var parseTimeFromISO = (iso) => {
|
|
|
1964
2104
|
if (h === 0) h = 12;
|
|
1965
2105
|
return { h, m, ampm };
|
|
1966
2106
|
};
|
|
1967
|
-
var CalendarIcon = () => /* @__PURE__ */
|
|
1968
|
-
var ChevUp = () => /* @__PURE__ */
|
|
1969
|
-
var ChevDown = () => /* @__PURE__ */
|
|
2107
|
+
var CalendarIcon = () => /* @__PURE__ */ React70.createElement("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }, /* @__PURE__ */ React70.createElement("rect", { x: "3", y: "4", width: "18", height: "18", rx: "2", ry: "2" }), /* @__PURE__ */ React70.createElement("line", { x1: "16", y1: "2", x2: "16", y2: "6" }), /* @__PURE__ */ React70.createElement("line", { x1: "8", y1: "2", x2: "8", y2: "6" }), /* @__PURE__ */ React70.createElement("line", { x1: "3", y1: "10", x2: "21", y2: "10" }));
|
|
2108
|
+
var ChevUp = () => /* @__PURE__ */ React70.createElement("svg", { width: "10", height: "7", viewBox: "0 0 10 7", fill: "currentColor" }, /* @__PURE__ */ React70.createElement("path", { d: "M5 0L10 7H0L5 0Z" }));
|
|
2109
|
+
var ChevDown = () => /* @__PURE__ */ React70.createElement("svg", { width: "10", height: "7", viewBox: "0 0 10 7", fill: "currentColor" }, /* @__PURE__ */ React70.createElement("path", { d: "M5 7L0 0H10L5 7Z" }));
|
|
1970
2110
|
var ITEM_H = 36;
|
|
1971
2111
|
var ScrollColumn = ({ items, selected, onSelect, infinite = true }) => {
|
|
1972
2112
|
const listRef = useRef4(null);
|
|
@@ -2014,15 +2154,15 @@ var ScrollColumn = ({ items, selected, onSelect, infinite = true }) => {
|
|
|
2014
2154
|
}
|
|
2015
2155
|
}, 100);
|
|
2016
2156
|
};
|
|
2017
|
-
return /* @__PURE__ */
|
|
2157
|
+
return /* @__PURE__ */ React70.createElement("div", { className: "rf-timescroll__col-wrapper" }, /* @__PURE__ */ React70.createElement(
|
|
2018
2158
|
"div",
|
|
2019
2159
|
{
|
|
2020
2160
|
className: "rf-timescroll__col",
|
|
2021
2161
|
ref: listRef,
|
|
2022
2162
|
onScroll: handleScroll
|
|
2023
2163
|
},
|
|
2024
|
-
!infinite && /* @__PURE__ */
|
|
2025
|
-
virtualItems.map((label, idx) => /* @__PURE__ */
|
|
2164
|
+
!infinite && /* @__PURE__ */ React70.createElement("div", { className: "rf-timescroll__spacer" }),
|
|
2165
|
+
virtualItems.map((label, idx) => /* @__PURE__ */ React70.createElement(
|
|
2026
2166
|
"div",
|
|
2027
2167
|
{
|
|
2028
2168
|
key: `${label}-${idx}`,
|
|
@@ -2030,8 +2170,8 @@ var ScrollColumn = ({ items, selected, onSelect, infinite = true }) => {
|
|
|
2030
2170
|
},
|
|
2031
2171
|
label
|
|
2032
2172
|
)),
|
|
2033
|
-
!infinite && /* @__PURE__ */
|
|
2034
|
-
), /* @__PURE__ */
|
|
2173
|
+
!infinite && /* @__PURE__ */ React70.createElement("div", { className: "rf-timescroll__spacer" })
|
|
2174
|
+
), /* @__PURE__ */ React70.createElement("div", { className: "rf-timescroll__mask rf-timescroll__mask--top" }), /* @__PURE__ */ React70.createElement("div", { className: "rf-timescroll__mask rf-timescroll__mask--bottom" }));
|
|
2035
2175
|
};
|
|
2036
2176
|
var SpinnerPanel = ({
|
|
2037
2177
|
hour,
|
|
@@ -2042,7 +2182,7 @@ var SpinnerPanel = ({
|
|
|
2042
2182
|
onHourInput,
|
|
2043
2183
|
onMinuteInput,
|
|
2044
2184
|
onAmpmToggle
|
|
2045
|
-
}) => /* @__PURE__ */
|
|
2185
|
+
}) => /* @__PURE__ */ React70.createElement("div", { className: "rf-date-picker__time-row" }, /* @__PURE__ */ React70.createElement("div", { className: "rf-date-picker__time-input-wrap" }, /* @__PURE__ */ React70.createElement("button", { type: "button", className: "rf-date-picker__time-spin-btn", onMouseDown: (e) => e.preventDefault(), onClick: () => onHourChange(1) }, /* @__PURE__ */ React70.createElement(ChevUp, null)), /* @__PURE__ */ React70.createElement(
|
|
2046
2186
|
"input",
|
|
2047
2187
|
{
|
|
2048
2188
|
type: "number",
|
|
@@ -2053,7 +2193,7 @@ var SpinnerPanel = ({
|
|
|
2053
2193
|
onChange: onHourInput,
|
|
2054
2194
|
onMouseDown: (e) => e.stopPropagation()
|
|
2055
2195
|
}
|
|
2056
|
-
), /* @__PURE__ */
|
|
2196
|
+
), /* @__PURE__ */ React70.createElement("button", { type: "button", className: "rf-date-picker__time-spin-btn", onMouseDown: (e) => e.preventDefault(), onClick: () => onHourChange(-1) }, /* @__PURE__ */ React70.createElement(ChevDown, null))), /* @__PURE__ */ React70.createElement("div", { className: "rf-date-picker__time-colon" }, ":"), /* @__PURE__ */ React70.createElement("div", { className: "rf-date-picker__time-input-wrap" }, /* @__PURE__ */ React70.createElement("button", { type: "button", className: "rf-date-picker__time-spin-btn", onMouseDown: (e) => e.preventDefault(), onClick: () => onMinuteChange(1) }, /* @__PURE__ */ React70.createElement(ChevUp, null)), /* @__PURE__ */ React70.createElement(
|
|
2057
2197
|
"input",
|
|
2058
2198
|
{
|
|
2059
2199
|
type: "number",
|
|
@@ -2064,7 +2204,7 @@ var SpinnerPanel = ({
|
|
|
2064
2204
|
onChange: onMinuteInput,
|
|
2065
2205
|
onMouseDown: (e) => e.stopPropagation()
|
|
2066
2206
|
}
|
|
2067
|
-
), /* @__PURE__ */
|
|
2207
|
+
), /* @__PURE__ */ React70.createElement("button", { type: "button", className: "rf-date-picker__time-spin-btn", onMouseDown: (e) => e.preventDefault(), onClick: () => onMinuteChange(-1) }, /* @__PURE__ */ React70.createElement(ChevDown, null))), /* @__PURE__ */ React70.createElement("div", { className: "rf-date-picker__ampm" }, /* @__PURE__ */ React70.createElement(
|
|
2068
2208
|
"button",
|
|
2069
2209
|
{
|
|
2070
2210
|
type: "button",
|
|
@@ -2073,7 +2213,7 @@ var SpinnerPanel = ({
|
|
|
2073
2213
|
onClick: () => onAmpmToggle("AM")
|
|
2074
2214
|
},
|
|
2075
2215
|
"AM"
|
|
2076
|
-
), /* @__PURE__ */
|
|
2216
|
+
), /* @__PURE__ */ React70.createElement(
|
|
2077
2217
|
"button",
|
|
2078
2218
|
{
|
|
2079
2219
|
type: "button",
|
|
@@ -2091,27 +2231,89 @@ var CalendarBody = ({
|
|
|
2091
2231
|
dayCells,
|
|
2092
2232
|
onDayClick,
|
|
2093
2233
|
onPrev,
|
|
2094
|
-
onNext
|
|
2095
|
-
|
|
2096
|
-
|
|
2097
|
-
|
|
2098
|
-
const
|
|
2099
|
-
const
|
|
2100
|
-
|
|
2234
|
+
onNext,
|
|
2235
|
+
onMonthSelect,
|
|
2236
|
+
onYearSelect
|
|
2237
|
+
}) => {
|
|
2238
|
+
const [pickerView, setPickerView] = useState5("calendar");
|
|
2239
|
+
const handleMonthClick = () => {
|
|
2240
|
+
setPickerView(pickerView === "month" ? "calendar" : "month");
|
|
2241
|
+
};
|
|
2242
|
+
const handleYearClick = () => {
|
|
2243
|
+
setPickerView(pickerView === "year" ? "calendar" : "year");
|
|
2244
|
+
};
|
|
2245
|
+
const handleMonthPick = (month) => {
|
|
2246
|
+
onMonthSelect(month);
|
|
2247
|
+
setPickerView("calendar");
|
|
2248
|
+
};
|
|
2249
|
+
const handleYearPick = (year) => {
|
|
2250
|
+
onYearSelect(year);
|
|
2251
|
+
setPickerView("calendar");
|
|
2252
|
+
};
|
|
2253
|
+
const currentYear = todayDate.getFullYear();
|
|
2254
|
+
const yearStart = viewYear - 6;
|
|
2255
|
+
const years = Array.from({ length: 16 }, (_, i) => yearStart + i);
|
|
2256
|
+
return /* @__PURE__ */ React70.createElement(React70.Fragment, null, /* @__PURE__ */ React70.createElement("div", { className: "rf-date-picker__header" }, /* @__PURE__ */ React70.createElement("div", { className: "rf-date-picker__header-labels" }, /* @__PURE__ */ React70.createElement(
|
|
2257
|
+
"span",
|
|
2258
|
+
{
|
|
2259
|
+
className: `rf-date-picker__month-label ${pickerView === "month" ? "rf-date-picker__month-label--active" : ""}`,
|
|
2260
|
+
onClick: handleMonthClick
|
|
2261
|
+
},
|
|
2262
|
+
MONTHS[viewMonth]
|
|
2263
|
+
), /* @__PURE__ */ React70.createElement(
|
|
2264
|
+
"span",
|
|
2265
|
+
{
|
|
2266
|
+
className: `rf-date-picker__year-label ${pickerView === "year" ? "rf-date-picker__year-label--active" : ""}`,
|
|
2267
|
+
onClick: handleYearClick
|
|
2268
|
+
},
|
|
2269
|
+
viewYear
|
|
2270
|
+
)), /* @__PURE__ */ React70.createElement("div", { className: "rf-date-picker__nav" }, pickerView === "year" ? /* @__PURE__ */ React70.createElement(React70.Fragment, null, /* @__PURE__ */ React70.createElement("button", { type: "button", className: "rf-date-picker__nav-btn", onClick: () => onYearSelect(viewYear - 16), "aria-label": "Previous years" }, "\u2039"), /* @__PURE__ */ React70.createElement("button", { type: "button", className: "rf-date-picker__nav-btn", onClick: () => onYearSelect(viewYear + 16), "aria-label": "Next years" }, "\u203A")) : /* @__PURE__ */ React70.createElement(React70.Fragment, null, /* @__PURE__ */ React70.createElement("button", { type: "button", className: "rf-date-picker__nav-btn", onClick: onPrev, "aria-label": "Previous month" }, "\u2039"), /* @__PURE__ */ React70.createElement("button", { type: "button", className: "rf-date-picker__nav-btn", onClick: onNext, "aria-label": "Next month" }, "\u203A")))), pickerView === "month" && /* @__PURE__ */ React70.createElement("div", { className: "rf-date-picker__month-grid" }, MONTHS_SHORT.map((m, idx) => /* @__PURE__ */ React70.createElement(
|
|
2101
2271
|
"button",
|
|
2102
2272
|
{
|
|
2103
|
-
key:
|
|
2273
|
+
key: m,
|
|
2104
2274
|
type: "button",
|
|
2105
2275
|
className: [
|
|
2106
|
-
"rf-date-
|
|
2107
|
-
|
|
2108
|
-
|
|
2276
|
+
"rf-date-picker__month-cell",
|
|
2277
|
+
idx === viewMonth ? "rf-date-picker__month-cell--selected" : "",
|
|
2278
|
+
idx === todayDate.getMonth() && viewYear === currentYear ? "rf-date-picker__month-cell--current" : ""
|
|
2109
2279
|
].filter(Boolean).join(" "),
|
|
2110
|
-
onClick: () =>
|
|
2280
|
+
onClick: () => handleMonthPick(idx)
|
|
2111
2281
|
},
|
|
2112
|
-
|
|
2113
|
-
)
|
|
2114
|
-
|
|
2282
|
+
m
|
|
2283
|
+
))), pickerView === "year" && /* @__PURE__ */ React70.createElement("div", { className: "rf-date-picker__year-grid" }, years.map((y) => /* @__PURE__ */ React70.createElement(
|
|
2284
|
+
"button",
|
|
2285
|
+
{
|
|
2286
|
+
key: y,
|
|
2287
|
+
type: "button",
|
|
2288
|
+
className: [
|
|
2289
|
+
"rf-date-picker__year-cell",
|
|
2290
|
+
y === viewYear ? "rf-date-picker__year-cell--selected" : "",
|
|
2291
|
+
y === currentYear ? "rf-date-picker__year-cell--current" : ""
|
|
2292
|
+
].filter(Boolean).join(" "),
|
|
2293
|
+
onClick: () => handleYearPick(y)
|
|
2294
|
+
},
|
|
2295
|
+
y
|
|
2296
|
+
))), pickerView === "calendar" && /* @__PURE__ */ React70.createElement(React70.Fragment, null, /* @__PURE__ */ React70.createElement("div", { className: "rf-date-picker__weekdays" }, WEEKDAYS.map((w) => /* @__PURE__ */ React70.createElement("div", { key: w, className: "rf-date-picker__weekday" }, w))), /* @__PURE__ */ React70.createElement("div", { className: "rf-date-picker__grid" }, dayCells.map((day, idx) => {
|
|
2297
|
+
if (day === null) return /* @__PURE__ */ React70.createElement("div", { key: `e-${idx}`, className: "rf-date-picker__day rf-date-picker__day--empty" });
|
|
2298
|
+
const cellDate = new Date(viewYear, viewMonth, day);
|
|
2299
|
+
const isSelected = selectedDate ? isSameDay(cellDate, selectedDate) : false;
|
|
2300
|
+
const isToday = isSameDay(cellDate, todayDate);
|
|
2301
|
+
return /* @__PURE__ */ React70.createElement(
|
|
2302
|
+
"button",
|
|
2303
|
+
{
|
|
2304
|
+
key: day,
|
|
2305
|
+
type: "button",
|
|
2306
|
+
className: [
|
|
2307
|
+
"rf-date-picker__day",
|
|
2308
|
+
isSelected ? "rf-date-picker__day--selected" : "",
|
|
2309
|
+
isToday && !isSelected ? "rf-date-picker__day--today" : ""
|
|
2310
|
+
].filter(Boolean).join(" "),
|
|
2311
|
+
onClick: () => onDayClick(day)
|
|
2312
|
+
},
|
|
2313
|
+
day
|
|
2314
|
+
);
|
|
2315
|
+
}))));
|
|
2316
|
+
};
|
|
2115
2317
|
var DateField = ({
|
|
2116
2318
|
label,
|
|
2117
2319
|
value,
|
|
@@ -2169,7 +2371,9 @@ var DateField = ({
|
|
|
2169
2371
|
const MINUTES = Array.from({ length: 60 }, (_, i) => String(i).padStart(2, "0"));
|
|
2170
2372
|
const AMPMS = ["AM", "PM"];
|
|
2171
2373
|
const containerRef = useRef4(null);
|
|
2172
|
-
const
|
|
2374
|
+
const pickerRef = useRef4(null);
|
|
2375
|
+
const [dropUp, setDropUp] = useState5(false);
|
|
2376
|
+
const inputId = useRef4(`rf-df-${Math.random().toString(36).substring(2, 11)}`).current;
|
|
2173
2377
|
useEffect4(() => {
|
|
2174
2378
|
if (value === void 0) return;
|
|
2175
2379
|
if (!value) {
|
|
@@ -2201,6 +2405,13 @@ var DateField = ({
|
|
|
2201
2405
|
document.addEventListener("mousedown", handler);
|
|
2202
2406
|
return () => document.removeEventListener("mousedown", handler);
|
|
2203
2407
|
}, [open]);
|
|
2408
|
+
useEffect4(() => {
|
|
2409
|
+
if (!open || !containerRef.current) return;
|
|
2410
|
+
const rect = containerRef.current.getBoundingClientRect();
|
|
2411
|
+
const spaceBelow = window.innerHeight - rect.bottom;
|
|
2412
|
+
const pickerHeight = 400;
|
|
2413
|
+
setDropUp(spaceBelow < pickerHeight && rect.top > pickerHeight);
|
|
2414
|
+
}, [open]);
|
|
2204
2415
|
const commitDate = useCallback((d, h, m, ap) => {
|
|
2205
2416
|
setSelectedDate(d);
|
|
2206
2417
|
if (!d) {
|
|
@@ -2348,7 +2559,7 @@ var DateField = ({
|
|
|
2348
2559
|
const inputPlaceholder = placeholder || (variant === "outlined" ? " " : void 0);
|
|
2349
2560
|
const todayDate = today();
|
|
2350
2561
|
const isSideVariant = type === "datetime-side" || type === "datetime-scroll";
|
|
2351
|
-
return /* @__PURE__ */
|
|
2562
|
+
return /* @__PURE__ */ React70.createElement("div", { ref: containerRef, className: rootClasses, style }, /* @__PURE__ */ React70.createElement("div", { className: "rf-date-field__anchor" }, /* @__PURE__ */ React70.createElement(
|
|
2352
2563
|
"div",
|
|
2353
2564
|
{
|
|
2354
2565
|
className: "rf-text-field__wrapper",
|
|
@@ -2357,7 +2568,7 @@ var DateField = ({
|
|
|
2357
2568
|
},
|
|
2358
2569
|
style: { cursor: disabled ? "default" : "pointer" }
|
|
2359
2570
|
},
|
|
2360
|
-
/* @__PURE__ */
|
|
2571
|
+
/* @__PURE__ */ React70.createElement(
|
|
2361
2572
|
"input",
|
|
2362
2573
|
{
|
|
2363
2574
|
id: inputId,
|
|
@@ -2373,7 +2584,7 @@ var DateField = ({
|
|
|
2373
2584
|
}
|
|
2374
2585
|
}
|
|
2375
2586
|
),
|
|
2376
|
-
/* @__PURE__ */
|
|
2587
|
+
/* @__PURE__ */ React70.createElement("div", { className: "rf-text-field__adornment rf-text-field__adornment--end" }, /* @__PURE__ */ React70.createElement(
|
|
2377
2588
|
"button",
|
|
2378
2589
|
{
|
|
2379
2590
|
type: "button",
|
|
@@ -2386,20 +2597,22 @@ var DateField = ({
|
|
|
2386
2597
|
},
|
|
2387
2598
|
"aria-label": "Pick date"
|
|
2388
2599
|
},
|
|
2389
|
-
/* @__PURE__ */
|
|
2600
|
+
/* @__PURE__ */ React70.createElement(CalendarIcon, null)
|
|
2390
2601
|
)),
|
|
2391
|
-
label && /* @__PURE__ */
|
|
2392
|
-
variant === "outlined" && /* @__PURE__ */
|
|
2393
|
-
), open && !disabled && /* @__PURE__ */
|
|
2602
|
+
label && /* @__PURE__ */ React70.createElement("label", { htmlFor: inputId, className: "rf-text-field__label" }, label, " ", required && /* @__PURE__ */ React70.createElement("span", { className: "rf-text-field__asterisk" }, "*")),
|
|
2603
|
+
variant === "outlined" && /* @__PURE__ */ React70.createElement("fieldset", { className: "rf-text-field__notch" }, label && /* @__PURE__ */ React70.createElement("legend", { className: "rf-text-field__legend" }, /* @__PURE__ */ React70.createElement("span", null, label, required ? " *" : "")))
|
|
2604
|
+
), open && !disabled && /* @__PURE__ */ React70.createElement(
|
|
2394
2605
|
"div",
|
|
2395
2606
|
{
|
|
2607
|
+
ref: pickerRef,
|
|
2396
2608
|
className: [
|
|
2397
2609
|
"rf-date-picker",
|
|
2398
|
-
isSideVariant ? "rf-date-picker--side" : ""
|
|
2610
|
+
isSideVariant ? "rf-date-picker--side" : "",
|
|
2611
|
+
dropUp ? "rf-date-picker--drop-up" : ""
|
|
2399
2612
|
].filter(Boolean).join(" "),
|
|
2400
2613
|
onMouseDown: (e) => e.preventDefault()
|
|
2401
2614
|
},
|
|
2402
|
-
/* @__PURE__ */
|
|
2615
|
+
/* @__PURE__ */ React70.createElement("div", { className: isSideVariant ? "rf-date-picker__cal-col" : void 0 }, /* @__PURE__ */ React70.createElement(
|
|
2403
2616
|
CalendarBody,
|
|
2404
2617
|
{
|
|
2405
2618
|
viewMonth,
|
|
@@ -2409,9 +2622,11 @@ var DateField = ({
|
|
|
2409
2622
|
dayCells,
|
|
2410
2623
|
onDayClick: handleDayClick,
|
|
2411
2624
|
onPrev: prevMonth,
|
|
2412
|
-
onNext: nextMonth
|
|
2625
|
+
onNext: nextMonth,
|
|
2626
|
+
onMonthSelect: setViewMonth,
|
|
2627
|
+
onYearSelect: setViewYear
|
|
2413
2628
|
}
|
|
2414
|
-
), type === "datetime" && /* @__PURE__ */
|
|
2629
|
+
), type === "datetime" && /* @__PURE__ */ React70.createElement("div", { className: "rf-date-picker__time-section" }, /* @__PURE__ */ React70.createElement("div", { className: "rf-date-picker__time-label" }, "Time"), /* @__PURE__ */ React70.createElement(
|
|
2415
2630
|
SpinnerPanel,
|
|
2416
2631
|
{
|
|
2417
2632
|
hour,
|
|
@@ -2423,8 +2638,8 @@ var DateField = ({
|
|
|
2423
2638
|
onMinuteInput: handleMinuteInput,
|
|
2424
2639
|
onAmpmToggle: handleAmpmToggle
|
|
2425
2640
|
}
|
|
2426
|
-
)), /* @__PURE__ */
|
|
2427
|
-
type === "datetime-side" && /* @__PURE__ */
|
|
2641
|
+
)), /* @__PURE__ */ React70.createElement("div", { className: "rf-date-picker__divider" }), /* @__PURE__ */ React70.createElement("div", { className: "rf-date-picker__footer" }, /* @__PURE__ */ React70.createElement("button", { type: "button", className: "rf-date-picker__footer-btn", onClick: handleToday }, "Today"), /* @__PURE__ */ React70.createElement("button", { type: "button", className: "rf-date-picker__footer-btn rf-date-picker__footer-btn--clear", onClick: handleClear }, "Clear"))),
|
|
2642
|
+
type === "datetime-side" && /* @__PURE__ */ React70.createElement("div", { className: "rf-date-picker__side-panel" }, /* @__PURE__ */ React70.createElement("div", { className: "rf-date-picker__side-label" }, "Time"), /* @__PURE__ */ React70.createElement("div", { className: "rf-date-picker__side-spinner" }, /* @__PURE__ */ React70.createElement(
|
|
2428
2643
|
SpinnerPanel,
|
|
2429
2644
|
{
|
|
2430
2645
|
hour,
|
|
@@ -2436,22 +2651,22 @@ var DateField = ({
|
|
|
2436
2651
|
onMinuteInput: handleMinuteInput,
|
|
2437
2652
|
onAmpmToggle: handleAmpmToggle
|
|
2438
2653
|
}
|
|
2439
|
-
)), /* @__PURE__ */
|
|
2440
|
-
type === "datetime-scroll" && /* @__PURE__ */
|
|
2654
|
+
)), /* @__PURE__ */ React70.createElement("div", { className: "rf-date-picker__side-time-display" }, String(hour).padStart(2, "0"), ":", String(minute).padStart(2, "0"), " ", ampm)),
|
|
2655
|
+
type === "datetime-scroll" && /* @__PURE__ */ React70.createElement("div", { className: "rf-date-picker__side-panel" }, /* @__PURE__ */ React70.createElement("div", { className: "rf-date-picker__side-label" }, "Time"), /* @__PURE__ */ React70.createElement("div", { className: "rf-timescroll" }, /* @__PURE__ */ React70.createElement(
|
|
2441
2656
|
ScrollColumn,
|
|
2442
2657
|
{
|
|
2443
2658
|
items: HOURS,
|
|
2444
2659
|
selected: hour - 1,
|
|
2445
2660
|
onSelect: handleScrollHour
|
|
2446
2661
|
}
|
|
2447
|
-
), /* @__PURE__ */
|
|
2662
|
+
), /* @__PURE__ */ React70.createElement("div", { className: "rf-timescroll__colon" }, ":"), /* @__PURE__ */ React70.createElement(
|
|
2448
2663
|
ScrollColumn,
|
|
2449
2664
|
{
|
|
2450
2665
|
items: MINUTES,
|
|
2451
2666
|
selected: minute,
|
|
2452
2667
|
onSelect: handleScrollMinute
|
|
2453
2668
|
}
|
|
2454
|
-
), /* @__PURE__ */
|
|
2669
|
+
), /* @__PURE__ */ React70.createElement(
|
|
2455
2670
|
ScrollColumn,
|
|
2456
2671
|
{
|
|
2457
2672
|
items: AMPMS,
|
|
@@ -2459,13 +2674,13 @@ var DateField = ({
|
|
|
2459
2674
|
onSelect: handleScrollAmpm,
|
|
2460
2675
|
infinite: false
|
|
2461
2676
|
}
|
|
2462
|
-
)), /* @__PURE__ */
|
|
2463
|
-
)), helperText && /* @__PURE__ */
|
|
2677
|
+
)), /* @__PURE__ */ React70.createElement("div", { className: "rf-date-picker__side-time-display" }, String(hour).padStart(2, "0"), ":", String(minute).padStart(2, "0"), " ", ampm))
|
|
2678
|
+
)), helperText && /* @__PURE__ */ React70.createElement("div", { className: "rf-text-field__helper-text" }, helperText));
|
|
2464
2679
|
};
|
|
2465
2680
|
DateField.displayName = "DateField";
|
|
2466
2681
|
|
|
2467
2682
|
// lib/TextFields/DateRangeField.tsx
|
|
2468
|
-
import
|
|
2683
|
+
import React71, {
|
|
2469
2684
|
useState as useState6,
|
|
2470
2685
|
useRef as useRef5,
|
|
2471
2686
|
useEffect as useEffect5
|
|
@@ -2485,7 +2700,7 @@ var MONTHS2 = [
|
|
|
2485
2700
|
"November",
|
|
2486
2701
|
"December"
|
|
2487
2702
|
];
|
|
2488
|
-
var
|
|
2703
|
+
var MONTHS_SHORT2 = [
|
|
2489
2704
|
"Jan",
|
|
2490
2705
|
"Feb",
|
|
2491
2706
|
"Mar",
|
|
@@ -2522,14 +2737,14 @@ var dateToISO = (d) => {
|
|
|
2522
2737
|
const dd = String(d.getDate()).padStart(2, "0");
|
|
2523
2738
|
return `${y}-${mo}-${dd}`;
|
|
2524
2739
|
};
|
|
2525
|
-
var formatShort = (d) => `${String(d.getDate()).padStart(2, "0")} ${
|
|
2740
|
+
var formatShort = (d) => `${String(d.getDate()).padStart(2, "0")} ${MONTHS_SHORT2[d.getMonth()]} ${d.getFullYear()}`;
|
|
2526
2741
|
var parseInputDate = (str) => {
|
|
2527
2742
|
const s = str.trim();
|
|
2528
2743
|
if (!s) return null;
|
|
2529
2744
|
const shortMatch = s.match(/^(\d{1,2})\s+([A-Za-z]+)\s+(\d{4})$/);
|
|
2530
2745
|
if (shortMatch) {
|
|
2531
2746
|
const day = parseInt(shortMatch[1], 10);
|
|
2532
|
-
const monthIdx =
|
|
2747
|
+
const monthIdx = MONTHS_SHORT2.findIndex((m) => m.toLowerCase() === shortMatch[2].toLowerCase());
|
|
2533
2748
|
const year = parseInt(shortMatch[3], 10);
|
|
2534
2749
|
if (monthIdx !== -1 && day >= 1 && day <= 31 && year >= 1e3) {
|
|
2535
2750
|
const d = new Date(year, monthIdx, day);
|
|
@@ -2594,7 +2809,7 @@ var detectPreset = (start, end) => {
|
|
|
2594
2809
|
if (isSameDay2(start, new Date(2e3, 0, 1)) && isSameDay2(end, today2)) return "all";
|
|
2595
2810
|
return null;
|
|
2596
2811
|
};
|
|
2597
|
-
var CalendarIcon2 = () => /* @__PURE__ */
|
|
2812
|
+
var CalendarIcon2 = () => /* @__PURE__ */ React71.createElement("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }, /* @__PURE__ */ React71.createElement("rect", { x: "3", y: "4", width: "18", height: "18", rx: "2", ry: "2" }), /* @__PURE__ */ React71.createElement("line", { x1: "16", y1: "2", x2: "16", y2: "6" }), /* @__PURE__ */ React71.createElement("line", { x1: "8", y1: "2", x2: "8", y2: "6" }), /* @__PURE__ */ React71.createElement("line", { x1: "3", y1: "10", x2: "21", y2: "10" }));
|
|
2598
2813
|
var RangeCalendarBody = ({
|
|
2599
2814
|
viewYear,
|
|
2600
2815
|
viewMonth,
|
|
@@ -2619,7 +2834,7 @@ var RangeCalendarBody = ({
|
|
|
2619
2834
|
const hasRange = startDate != null && effectiveEnd != null && !isSameDay2(startDate, effectiveEnd);
|
|
2620
2835
|
const lo = startDate && effectiveEnd ? startDate <= effectiveEnd ? startDate : effectiveEnd : null;
|
|
2621
2836
|
const hi = startDate && effectiveEnd ? startDate <= effectiveEnd ? effectiveEnd : startDate : null;
|
|
2622
|
-
return /* @__PURE__ */
|
|
2837
|
+
return /* @__PURE__ */ React71.createElement("div", { className: "rf-dr-calendar" }, /* @__PURE__ */ React71.createElement("div", { className: "rf-dr-calendar__header" }, /* @__PURE__ */ React71.createElement(
|
|
2623
2838
|
"button",
|
|
2624
2839
|
{
|
|
2625
2840
|
type: "button",
|
|
@@ -2629,7 +2844,7 @@ var RangeCalendarBody = ({
|
|
|
2629
2844
|
"aria-label": "Previous month"
|
|
2630
2845
|
},
|
|
2631
2846
|
"\u2039"
|
|
2632
|
-
), /* @__PURE__ */
|
|
2847
|
+
), /* @__PURE__ */ React71.createElement("span", { className: "rf-dr-calendar__month-label" }, MONTHS2[viewMonth], " ", viewYear), /* @__PURE__ */ React71.createElement(
|
|
2633
2848
|
"button",
|
|
2634
2849
|
{
|
|
2635
2850
|
type: "button",
|
|
@@ -2639,9 +2854,9 @@ var RangeCalendarBody = ({
|
|
|
2639
2854
|
"aria-label": "Next month"
|
|
2640
2855
|
},
|
|
2641
2856
|
"\u203A"
|
|
2642
|
-
)), /* @__PURE__ */
|
|
2857
|
+
)), /* @__PURE__ */ React71.createElement("div", { className: "rf-dr-calendar__weekdays" }, WEEKDAYS2.map((w) => /* @__PURE__ */ React71.createElement("div", { key: w, className: "rf-dr-calendar__weekday" }, w))), /* @__PURE__ */ React71.createElement("div", { className: "rf-dr-calendar__grid" }, dayCells.map((day, idx) => {
|
|
2643
2858
|
if (day === null) {
|
|
2644
|
-
return /* @__PURE__ */
|
|
2859
|
+
return /* @__PURE__ */ React71.createElement("div", { key: `e-${idx}`, className: "rf-dr-calendar__cell rf-dr-calendar__cell--empty" });
|
|
2645
2860
|
}
|
|
2646
2861
|
const cellDate = new Date(viewYear, viewMonth, day);
|
|
2647
2862
|
const isStart = startDate ? isSameDay2(cellDate, startDate) : false;
|
|
@@ -2661,7 +2876,7 @@ var RangeCalendarBody = ({
|
|
|
2661
2876
|
isStart || isEnd ? "rf-dr-calendar__day--selected" : "",
|
|
2662
2877
|
isToday && !isStart && !isEnd ? "rf-dr-calendar__day--today" : ""
|
|
2663
2878
|
].filter(Boolean).join(" ");
|
|
2664
|
-
return /* @__PURE__ */
|
|
2879
|
+
return /* @__PURE__ */ React71.createElement(
|
|
2665
2880
|
"div",
|
|
2666
2881
|
{
|
|
2667
2882
|
key: day,
|
|
@@ -2669,7 +2884,7 @@ var RangeCalendarBody = ({
|
|
|
2669
2884
|
onMouseEnter: () => onDayHover(cellDate),
|
|
2670
2885
|
onMouseLeave: () => onDayHover(null)
|
|
2671
2886
|
},
|
|
2672
|
-
/* @__PURE__ */
|
|
2887
|
+
/* @__PURE__ */ React71.createElement(
|
|
2673
2888
|
"button",
|
|
2674
2889
|
{
|
|
2675
2890
|
type: "button",
|
|
@@ -2703,14 +2918,14 @@ var MiniCalendar = ({ selectedDate, todayDate, onSelect, onClose }) => {
|
|
|
2703
2918
|
setViewYear((y) => y + 1);
|
|
2704
2919
|
} else setViewMonth((m) => m + 1);
|
|
2705
2920
|
};
|
|
2706
|
-
return /* @__PURE__ */
|
|
2921
|
+
return /* @__PURE__ */ React71.createElement("div", { className: "rf-dr-mini-cal" }, /* @__PURE__ */ React71.createElement("div", { className: "rf-dr-mini-cal__header" }, /* @__PURE__ */ React71.createElement("button", { type: "button", className: "rf-dr-calendar__nav-btn", onClick: prevMonth }, "\u2039"), /* @__PURE__ */ React71.createElement("span", { className: "rf-dr-calendar__month-label", style: { fontSize: "0.88rem" } }, MONTHS2[viewMonth], " ", viewYear), /* @__PURE__ */ React71.createElement("button", { type: "button", className: "rf-dr-calendar__nav-btn", onClick: nextMonth }, "\u203A")), /* @__PURE__ */ React71.createElement("div", { className: "rf-dr-calendar__weekdays" }, WEEKDAYS2.map((w) => /* @__PURE__ */ React71.createElement("div", { key: w, className: "rf-dr-calendar__weekday" }, w))), /* @__PURE__ */ React71.createElement("div", { className: "rf-dr-calendar__grid" }, dayCells.map((day, idx) => {
|
|
2707
2922
|
if (day === null) {
|
|
2708
|
-
return /* @__PURE__ */
|
|
2923
|
+
return /* @__PURE__ */ React71.createElement("div", { key: `e-${idx}`, className: "rf-dr-calendar__cell rf-dr-calendar__cell--empty" });
|
|
2709
2924
|
}
|
|
2710
2925
|
const cellDate = new Date(viewYear, viewMonth, day);
|
|
2711
2926
|
const isSel = selectedDate ? isSameDay2(cellDate, selectedDate) : false;
|
|
2712
2927
|
const isToday = isSameDay2(cellDate, todayDate);
|
|
2713
|
-
return /* @__PURE__ */
|
|
2928
|
+
return /* @__PURE__ */ React71.createElement("div", { key: day, className: "rf-dr-calendar__cell" }, /* @__PURE__ */ React71.createElement(
|
|
2714
2929
|
"button",
|
|
2715
2930
|
{
|
|
2716
2931
|
type: "button",
|
|
@@ -2918,7 +3133,7 @@ var DateRangeField = ({
|
|
|
2918
3133
|
className
|
|
2919
3134
|
].filter(Boolean).join(" ");
|
|
2920
3135
|
const inputPlaceholder = variant === "outlined" ? " " : void 0;
|
|
2921
|
-
return /* @__PURE__ */
|
|
3136
|
+
return /* @__PURE__ */ React71.createElement("div", { ref: containerRef, className: rootClasses, style }, /* @__PURE__ */ React71.createElement("div", { className: "rf-date-field__anchor" }, /* @__PURE__ */ React71.createElement(
|
|
2922
3137
|
"div",
|
|
2923
3138
|
{
|
|
2924
3139
|
className: "rf-text-field__wrapper",
|
|
@@ -2927,7 +3142,7 @@ var DateRangeField = ({
|
|
|
2927
3142
|
},
|
|
2928
3143
|
style: { cursor: disabled ? "default" : "pointer" }
|
|
2929
3144
|
},
|
|
2930
|
-
/* @__PURE__ */
|
|
3145
|
+
/* @__PURE__ */ React71.createElement(
|
|
2931
3146
|
"input",
|
|
2932
3147
|
{
|
|
2933
3148
|
id: inputId,
|
|
@@ -2943,7 +3158,7 @@ var DateRangeField = ({
|
|
|
2943
3158
|
}
|
|
2944
3159
|
}
|
|
2945
3160
|
),
|
|
2946
|
-
/* @__PURE__ */
|
|
3161
|
+
/* @__PURE__ */ React71.createElement("div", { className: "rf-text-field__adornment rf-text-field__adornment--end" }, /* @__PURE__ */ React71.createElement(
|
|
2947
3162
|
"button",
|
|
2948
3163
|
{
|
|
2949
3164
|
type: "button",
|
|
@@ -2956,13 +3171,13 @@ var DateRangeField = ({
|
|
|
2956
3171
|
},
|
|
2957
3172
|
"aria-label": "Pick date range"
|
|
2958
3173
|
},
|
|
2959
|
-
/* @__PURE__ */
|
|
3174
|
+
/* @__PURE__ */ React71.createElement(CalendarIcon2, null)
|
|
2960
3175
|
)),
|
|
2961
|
-
label && /* @__PURE__ */
|
|
2962
|
-
variant === "outlined" && /* @__PURE__ */
|
|
3176
|
+
label && /* @__PURE__ */ React71.createElement("label", { htmlFor: inputId, className: "rf-text-field__label" }, label, " ", required && /* @__PURE__ */ React71.createElement("span", { className: "rf-text-field__asterisk" }, "*")),
|
|
3177
|
+
variant === "outlined" && /* @__PURE__ */ React71.createElement("fieldset", { className: "rf-text-field__notch" }, label ? /* @__PURE__ */ React71.createElement("legend", { className: "rf-text-field__legend" }, /* @__PURE__ */ React71.createElement("span", null, label, required ? " *" : "")) : /* @__PURE__ */ React71.createElement("legend", { className: "rf-text-field__legend--empty" }))
|
|
2963
3178
|
), open && !disabled && (pickerType === "panel" ? (
|
|
2964
3179
|
/* ── Panel Mode ── */
|
|
2965
|
-
/* @__PURE__ */
|
|
3180
|
+
/* @__PURE__ */ React71.createElement("div", { className: "rf-dr-picker rf-dr-picker--panel", onMouseDown: (e) => e.preventDefault() }, /* @__PURE__ */ React71.createElement("div", { className: "rf-dr-picker__presets" }, PRESETS.map((p, i) => /* @__PURE__ */ React71.createElement(React71.Fragment, { key: p.id }, i > 0 && /* @__PURE__ */ React71.createElement("div", { className: "rf-dr-picker__preset-sep" }), /* @__PURE__ */ React71.createElement(
|
|
2966
3181
|
"button",
|
|
2967
3182
|
{
|
|
2968
3183
|
type: "button",
|
|
@@ -2973,7 +3188,7 @@ var DateRangeField = ({
|
|
|
2973
3188
|
onClick: () => handlePreset(p.id)
|
|
2974
3189
|
},
|
|
2975
3190
|
p.label
|
|
2976
|
-
)))), /* @__PURE__ */
|
|
3191
|
+
)))), /* @__PURE__ */ React71.createElement("div", { className: "rf-dr-picker__manual" }, /* @__PURE__ */ React71.createElement("div", { className: "rf-dr-picker__date-field-wrap" }, /* @__PURE__ */ React71.createElement(
|
|
2977
3192
|
"div",
|
|
2978
3193
|
{
|
|
2979
3194
|
className: [
|
|
@@ -2981,8 +3196,8 @@ var DateRangeField = ({
|
|
|
2981
3196
|
inlineCal === "start" ? "rf-dr-picker__date-field--active" : ""
|
|
2982
3197
|
].filter(Boolean).join(" ")
|
|
2983
3198
|
},
|
|
2984
|
-
/* @__PURE__ */
|
|
2985
|
-
/* @__PURE__ */
|
|
3199
|
+
/* @__PURE__ */ React71.createElement("span", { className: "rf-dr-picker__date-floating-label" }, "Start Date"),
|
|
3200
|
+
/* @__PURE__ */ React71.createElement("div", { className: "rf-dr-picker__date-display" }, /* @__PURE__ */ React71.createElement(
|
|
2986
3201
|
"input",
|
|
2987
3202
|
{
|
|
2988
3203
|
type: "text",
|
|
@@ -2993,7 +3208,7 @@ var DateRangeField = ({
|
|
|
2993
3208
|
onBlur: handleStartInputBlur,
|
|
2994
3209
|
onMouseDown: (e) => e.stopPropagation()
|
|
2995
3210
|
}
|
|
2996
|
-
), /* @__PURE__ */
|
|
3211
|
+
), /* @__PURE__ */ React71.createElement(
|
|
2997
3212
|
"button",
|
|
2998
3213
|
{
|
|
2999
3214
|
type: "button",
|
|
@@ -3002,9 +3217,9 @@ var DateRangeField = ({
|
|
|
3002
3217
|
onClick: () => setInlineCal((v) => v === "start" ? null : "start"),
|
|
3003
3218
|
"aria-label": "Pick start date"
|
|
3004
3219
|
},
|
|
3005
|
-
/* @__PURE__ */
|
|
3220
|
+
/* @__PURE__ */ React71.createElement(CalendarIcon2, null)
|
|
3006
3221
|
))
|
|
3007
|
-
), inlineCal === "start" && /* @__PURE__ */
|
|
3222
|
+
), inlineCal === "start" && /* @__PURE__ */ React71.createElement(
|
|
3008
3223
|
MiniCalendar,
|
|
3009
3224
|
{
|
|
3010
3225
|
selectedDate: draftStart,
|
|
@@ -3015,7 +3230,7 @@ var DateRangeField = ({
|
|
|
3015
3230
|
},
|
|
3016
3231
|
onClose: () => setInlineCal(null)
|
|
3017
3232
|
}
|
|
3018
|
-
)), /* @__PURE__ */
|
|
3233
|
+
)), /* @__PURE__ */ React71.createElement("div", { className: "rf-dr-picker__date-field-wrap" }, /* @__PURE__ */ React71.createElement(
|
|
3019
3234
|
"div",
|
|
3020
3235
|
{
|
|
3021
3236
|
className: [
|
|
@@ -3023,8 +3238,8 @@ var DateRangeField = ({
|
|
|
3023
3238
|
inlineCal === "end" ? "rf-dr-picker__date-field--active" : ""
|
|
3024
3239
|
].filter(Boolean).join(" ")
|
|
3025
3240
|
},
|
|
3026
|
-
/* @__PURE__ */
|
|
3027
|
-
/* @__PURE__ */
|
|
3241
|
+
/* @__PURE__ */ React71.createElement("span", { className: "rf-dr-picker__date-floating-label" }, "End Date"),
|
|
3242
|
+
/* @__PURE__ */ React71.createElement("div", { className: "rf-dr-picker__date-display" }, /* @__PURE__ */ React71.createElement(
|
|
3028
3243
|
"input",
|
|
3029
3244
|
{
|
|
3030
3245
|
type: "text",
|
|
@@ -3035,7 +3250,7 @@ var DateRangeField = ({
|
|
|
3035
3250
|
onBlur: handleEndInputBlur,
|
|
3036
3251
|
onMouseDown: (e) => e.stopPropagation()
|
|
3037
3252
|
}
|
|
3038
|
-
), /* @__PURE__ */
|
|
3253
|
+
), /* @__PURE__ */ React71.createElement(
|
|
3039
3254
|
"button",
|
|
3040
3255
|
{
|
|
3041
3256
|
type: "button",
|
|
@@ -3044,9 +3259,9 @@ var DateRangeField = ({
|
|
|
3044
3259
|
onClick: () => setInlineCal((v) => v === "end" ? null : "end"),
|
|
3045
3260
|
"aria-label": "Pick end date"
|
|
3046
3261
|
},
|
|
3047
|
-
/* @__PURE__ */
|
|
3262
|
+
/* @__PURE__ */ React71.createElement(CalendarIcon2, null)
|
|
3048
3263
|
))
|
|
3049
|
-
), inlineCal === "end" && /* @__PURE__ */
|
|
3264
|
+
), inlineCal === "end" && /* @__PURE__ */ React71.createElement(
|
|
3050
3265
|
MiniCalendar,
|
|
3051
3266
|
{
|
|
3052
3267
|
selectedDate: draftEnd,
|
|
@@ -3057,7 +3272,7 @@ var DateRangeField = ({
|
|
|
3057
3272
|
},
|
|
3058
3273
|
onClose: () => setInlineCal(null)
|
|
3059
3274
|
}
|
|
3060
|
-
)), !inlineCal && /* @__PURE__ */
|
|
3275
|
+
)), !inlineCal && /* @__PURE__ */ React71.createElement("div", { className: "rf-dr-picker__days-section" }, /* @__PURE__ */ React71.createElement("div", { className: "rf-dr-picker__days-row" }, /* @__PURE__ */ React71.createElement("span", { className: "rf-dr-picker__days-label" }, "Days until today"), /* @__PURE__ */ React71.createElement(
|
|
3061
3276
|
"input",
|
|
3062
3277
|
{
|
|
3063
3278
|
type: "number",
|
|
@@ -3068,7 +3283,7 @@ var DateRangeField = ({
|
|
|
3068
3283
|
onMouseDown: (e) => e.stopPropagation(),
|
|
3069
3284
|
placeholder: "\u2014"
|
|
3070
3285
|
}
|
|
3071
|
-
)), /* @__PURE__ */
|
|
3286
|
+
)), /* @__PURE__ */ React71.createElement("div", { className: "rf-dr-picker__days-row" }, /* @__PURE__ */ React71.createElement("span", { className: "rf-dr-picker__days-label" }, "Days from today"), /* @__PURE__ */ React71.createElement(
|
|
3072
3287
|
"input",
|
|
3073
3288
|
{
|
|
3074
3289
|
type: "number",
|
|
@@ -3079,10 +3294,10 @@ var DateRangeField = ({
|
|
|
3079
3294
|
onMouseDown: (e) => e.stopPropagation(),
|
|
3080
3295
|
placeholder: "\u2014"
|
|
3081
3296
|
}
|
|
3082
|
-
))), /* @__PURE__ */
|
|
3297
|
+
))), /* @__PURE__ */ React71.createElement("div", { style: { flex: 1 } }), /* @__PURE__ */ React71.createElement("div", { className: "rf-dr-picker__footer" }, /* @__PURE__ */ React71.createElement("button", { type: "button", className: "rf-dr-picker__close-btn", onClick: handleClose }, "CLOSE"), /* @__PURE__ */ React71.createElement("button", { type: "button", className: "rf-dr-picker__apply-btn", onClick: handleApply }, "APPLY"))))
|
|
3083
3298
|
) : (
|
|
3084
3299
|
/* ── Calendar Mode ── */
|
|
3085
|
-
/* @__PURE__ */
|
|
3300
|
+
/* @__PURE__ */ React71.createElement("div", { className: "rf-dr-picker rf-dr-picker--calendar", onMouseDown: (e) => e.preventDefault() }, /* @__PURE__ */ React71.createElement("div", { className: "rf-dr-picker__calendars" }, /* @__PURE__ */ React71.createElement(
|
|
3086
3301
|
RangeCalendarBody,
|
|
3087
3302
|
{
|
|
3088
3303
|
viewYear: leftViewYear,
|
|
@@ -3097,7 +3312,7 @@ var DateRangeField = ({
|
|
|
3097
3312
|
onNext: nextMonth,
|
|
3098
3313
|
showNext: false
|
|
3099
3314
|
}
|
|
3100
|
-
), /* @__PURE__ */
|
|
3315
|
+
), /* @__PURE__ */ React71.createElement("div", { className: "rf-dr-picker__cal-col-divider" }), /* @__PURE__ */ React71.createElement(
|
|
3101
3316
|
RangeCalendarBody,
|
|
3102
3317
|
{
|
|
3103
3318
|
viewYear: rightViewYear,
|
|
@@ -3112,21 +3327,21 @@ var DateRangeField = ({
|
|
|
3112
3327
|
onNext: nextMonth,
|
|
3113
3328
|
showPrev: false
|
|
3114
3329
|
}
|
|
3115
|
-
)), selecting === "end" && draftStart && /* @__PURE__ */
|
|
3116
|
-
))), helperText && /* @__PURE__ */
|
|
3330
|
+
)), selecting === "end" && draftStart && /* @__PURE__ */ React71.createElement("div", { className: "rf-dr-picker__cal-hint" }, /* @__PURE__ */ React71.createElement("span", { className: "rf-dr-picker__cal-hint-dot" }), /* @__PURE__ */ React71.createElement("span", null, "Select end date \xB7 started from ", /* @__PURE__ */ React71.createElement("strong", null, formatShort(draftStart)))), /* @__PURE__ */ React71.createElement("div", { className: "rf-dr-picker__divider" }), /* @__PURE__ */ React71.createElement("div", { className: "rf-dr-picker__cal-footer" }, draftStart && draftEnd && /* @__PURE__ */ React71.createElement("span", { className: "rf-dr-picker__cal-range-label" }, formatShort(draftStart <= draftEnd ? draftStart : draftEnd), " \u2013 ", formatShort(draftStart <= draftEnd ? draftEnd : draftStart), /* @__PURE__ */ React71.createElement("span", { className: "rf-dr-picker__cal-range-days" }, " ", "(", Math.abs(daysBetween(draftStart, draftEnd)) + 1, " days)")), /* @__PURE__ */ React71.createElement("div", { style: { flex: 1 } }), /* @__PURE__ */ React71.createElement("button", { type: "button", className: "rf-dr-picker__close-btn", onClick: handleClose }, "CLOSE"), /* @__PURE__ */ React71.createElement("button", { type: "button", className: "rf-dr-picker__apply-btn", onClick: handleApply }, "APPLY")))
|
|
3331
|
+
))), helperText && /* @__PURE__ */ React71.createElement("div", { className: "rf-text-field__helper-text" }, helperText));
|
|
3117
3332
|
};
|
|
3118
3333
|
DateRangeField.displayName = "DateRangeField";
|
|
3119
3334
|
|
|
3120
3335
|
// lib/TextFields/Autocomplete.tsx
|
|
3121
|
-
import
|
|
3336
|
+
import React72, {
|
|
3122
3337
|
useState as useState7,
|
|
3123
3338
|
useRef as useRef6,
|
|
3124
3339
|
useEffect as useEffect6,
|
|
3125
3340
|
useCallback as useCallback2
|
|
3126
3341
|
} from "react";
|
|
3127
|
-
var ChevronDownIcon = () => /* @__PURE__ */
|
|
3128
|
-
var CloseSmIcon = ({ size = 16 }) => /* @__PURE__ */
|
|
3129
|
-
var CheckIcon = () => /* @__PURE__ */
|
|
3342
|
+
var ChevronDownIcon = () => /* @__PURE__ */ React72.createElement("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.2", strokeLinecap: "round", strokeLinejoin: "round" }, /* @__PURE__ */ React72.createElement("polyline", { points: "6 9 12 15 18 9" }));
|
|
3343
|
+
var CloseSmIcon = ({ size = 16 }) => /* @__PURE__ */ React72.createElement("svg", { width: size, height: size, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", strokeLinecap: "round" }, /* @__PURE__ */ React72.createElement("line", { x1: "18", y1: "6", x2: "6", y2: "18" }), /* @__PURE__ */ React72.createElement("line", { x1: "6", y1: "6", x2: "18", y2: "18" }));
|
|
3344
|
+
var CheckIcon = () => /* @__PURE__ */ React72.createElement("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", strokeLinecap: "round", strokeLinejoin: "round" }, /* @__PURE__ */ React72.createElement("polyline", { points: "20 6 9 17 4 12" }));
|
|
3130
3345
|
function defaultGetLabel(option) {
|
|
3131
3346
|
if (option === null || option === void 0) return "";
|
|
3132
3347
|
if (typeof option === "string") return option;
|
|
@@ -3352,7 +3567,7 @@ function AutocompleteInner(props, _ref) {
|
|
|
3352
3567
|
className
|
|
3353
3568
|
].filter(Boolean).join(" ");
|
|
3354
3569
|
const inputPlaceholder = placeholder || (variant === "outlined" ? " " : void 0);
|
|
3355
|
-
return /* @__PURE__ */
|
|
3570
|
+
return /* @__PURE__ */ React72.createElement("div", { ref: containerRef, className: rootClasses, style }, /* @__PURE__ */ React72.createElement(
|
|
3356
3571
|
"div",
|
|
3357
3572
|
{
|
|
3358
3573
|
className: "rf-text-field__wrapper",
|
|
@@ -3363,7 +3578,7 @@ function AutocompleteInner(props, _ref) {
|
|
|
3363
3578
|
}
|
|
3364
3579
|
}
|
|
3365
3580
|
},
|
|
3366
|
-
multiple && visibleTags.map((opt, i) => /* @__PURE__ */
|
|
3581
|
+
multiple && visibleTags.map((opt, i) => /* @__PURE__ */ React72.createElement("span", { key: i, className: "rf-autocomplete__tag" }, /* @__PURE__ */ React72.createElement("span", { style: { overflow: "hidden", textOverflow: "ellipsis" } }, getOptionLabel(opt)), /* @__PURE__ */ React72.createElement(
|
|
3367
3582
|
"button",
|
|
3368
3583
|
{
|
|
3369
3584
|
type: "button",
|
|
@@ -3372,10 +3587,10 @@ function AutocompleteInner(props, _ref) {
|
|
|
3372
3587
|
onClick: (e) => removeTag(opt, e),
|
|
3373
3588
|
tabIndex: -1
|
|
3374
3589
|
},
|
|
3375
|
-
/* @__PURE__ */
|
|
3590
|
+
/* @__PURE__ */ React72.createElement(CloseSmIcon, { size: 12 })
|
|
3376
3591
|
))),
|
|
3377
|
-
hiddenCount > 0 && /* @__PURE__ */
|
|
3378
|
-
/* @__PURE__ */
|
|
3592
|
+
hiddenCount > 0 && /* @__PURE__ */ React72.createElement("span", { className: "rf-autocomplete__tag-more" }, "+", hiddenCount, " more"),
|
|
3593
|
+
/* @__PURE__ */ React72.createElement(
|
|
3379
3594
|
"input",
|
|
3380
3595
|
{
|
|
3381
3596
|
ref: inputRef,
|
|
@@ -3397,9 +3612,9 @@ function AutocompleteInner(props, _ref) {
|
|
|
3397
3612
|
"aria-autocomplete": "list"
|
|
3398
3613
|
}
|
|
3399
3614
|
),
|
|
3400
|
-
label && /* @__PURE__ */
|
|
3401
|
-
variant === "outlined" && /* @__PURE__ */
|
|
3402
|
-
/* @__PURE__ */
|
|
3615
|
+
label && /* @__PURE__ */ React72.createElement("label", { htmlFor: inputId, className: "rf-text-field__label" }, label, required && /* @__PURE__ */ React72.createElement("span", { className: "rf-text-field__asterisk" }, " *")),
|
|
3616
|
+
variant === "outlined" && /* @__PURE__ */ React72.createElement("fieldset", { className: "rf-text-field__notch" }, label ? /* @__PURE__ */ React72.createElement("legend", { className: "rf-text-field__legend" }, /* @__PURE__ */ React72.createElement("span", null, label, required ? " *" : "")) : /* @__PURE__ */ React72.createElement("legend", { className: "rf-text-field__legend--empty" })),
|
|
3617
|
+
/* @__PURE__ */ React72.createElement("div", { className: "rf-autocomplete__endgroup" }, hasClearable && /* @__PURE__ */ React72.createElement(
|
|
3403
3618
|
"button",
|
|
3404
3619
|
{
|
|
3405
3620
|
type: "button",
|
|
@@ -3409,8 +3624,8 @@ function AutocompleteInner(props, _ref) {
|
|
|
3409
3624
|
tabIndex: -1,
|
|
3410
3625
|
"aria-label": "Clear"
|
|
3411
3626
|
},
|
|
3412
|
-
/* @__PURE__ */
|
|
3413
|
-
), !freeSolo && /* @__PURE__ */
|
|
3627
|
+
/* @__PURE__ */ React72.createElement(CloseSmIcon, { size: 16 })
|
|
3628
|
+
), !freeSolo && /* @__PURE__ */ React72.createElement(
|
|
3414
3629
|
"button",
|
|
3415
3630
|
{
|
|
3416
3631
|
type: "button",
|
|
@@ -3422,9 +3637,9 @@ function AutocompleteInner(props, _ref) {
|
|
|
3422
3637
|
tabIndex: -1,
|
|
3423
3638
|
"aria-label": open ? "Close" : "Open"
|
|
3424
3639
|
},
|
|
3425
|
-
/* @__PURE__ */
|
|
3640
|
+
/* @__PURE__ */ React72.createElement(ChevronDownIcon, null)
|
|
3426
3641
|
))
|
|
3427
|
-
), helperText && /* @__PURE__ */
|
|
3642
|
+
), helperText && /* @__PURE__ */ React72.createElement("div", { className: `rf-text-field__helper-text${error ? " rf-text-field__helper-text--error" : ""}` }, helperText), open && !disabled && /* @__PURE__ */ React72.createElement("div", { className: "rf-autocomplete__popup", role: "presentation" }, loading ? /* @__PURE__ */ React72.createElement("div", { className: "rf-autocomplete__loading" }, /* @__PURE__ */ React72.createElement("span", { className: "rf-ac-spinner" }), loadingText) : flatEntries.length === 0 ? /* @__PURE__ */ React72.createElement("div", { className: "rf-autocomplete__no-options" }, noOptionsText) : /* @__PURE__ */ React72.createElement("ul", { ref: listRef, className: "rf-autocomplete__listbox", role: "listbox" }, groupBy ? (
|
|
3428
3643
|
// Grouped render
|
|
3429
3644
|
(() => {
|
|
3430
3645
|
const rendered = [];
|
|
@@ -3434,7 +3649,7 @@ function AutocompleteInner(props, _ref) {
|
|
|
3434
3649
|
if (entry.kind === "group") {
|
|
3435
3650
|
if (groupItems.length > 0) {
|
|
3436
3651
|
rendered.push(
|
|
3437
|
-
/* @__PURE__ */
|
|
3652
|
+
/* @__PURE__ */ React72.createElement("li", { key: `g-${currentGroup}`, role: "presentation" }, /* @__PURE__ */ React72.createElement("div", { className: "rf-autocomplete__group-header" }, currentGroup), /* @__PURE__ */ React72.createElement("ul", { className: "rf-autocomplete__group-items", role: "group" }, groupItems))
|
|
3438
3653
|
);
|
|
3439
3654
|
groupItems = [];
|
|
3440
3655
|
}
|
|
@@ -3445,7 +3660,7 @@ function AutocompleteInner(props, _ref) {
|
|
|
3445
3660
|
}
|
|
3446
3661
|
if (ei === flatEntries.length - 1 && groupItems.length > 0) {
|
|
3447
3662
|
rendered.push(
|
|
3448
|
-
/* @__PURE__ */
|
|
3663
|
+
/* @__PURE__ */ React72.createElement("li", { key: `g-${currentGroup}`, role: "presentation" }, /* @__PURE__ */ React72.createElement("div", { className: "rf-autocomplete__group-header" }, currentGroup), /* @__PURE__ */ React72.createElement("ul", { className: "rf-autocomplete__group-items", role: "group" }, groupItems))
|
|
3449
3664
|
);
|
|
3450
3665
|
}
|
|
3451
3666
|
});
|
|
@@ -3457,7 +3672,7 @@ function AutocompleteInner(props, _ref) {
|
|
|
3457
3672
|
const focused = focusedIdx === flatIdx;
|
|
3458
3673
|
const optDisabled = getOptionDisabled?.(option) ?? false;
|
|
3459
3674
|
const label2 = getOptionLabel(option);
|
|
3460
|
-
return /* @__PURE__ */
|
|
3675
|
+
return /* @__PURE__ */ React72.createElement(
|
|
3461
3676
|
"li",
|
|
3462
3677
|
{
|
|
3463
3678
|
key: label2 + flatIdx,
|
|
@@ -3476,22 +3691,22 @@ function AutocompleteInner(props, _ref) {
|
|
|
3476
3691
|
onMouseDown: (e) => e.preventDefault(),
|
|
3477
3692
|
onClick: () => selectOption(option)
|
|
3478
3693
|
},
|
|
3479
|
-
renderOption ? renderOption(option, { selected, focused, index: flatIdx }) : /* @__PURE__ */
|
|
3480
|
-
!renderOption && /* @__PURE__ */
|
|
3694
|
+
renderOption ? renderOption(option, { selected, focused, index: flatIdx }) : /* @__PURE__ */ React72.createElement("span", { style: { flex: 1, overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" } }, label2),
|
|
3695
|
+
!renderOption && /* @__PURE__ */ React72.createElement("span", { className: "rf-autocomplete__option-check" }, /* @__PURE__ */ React72.createElement(CheckIcon, null))
|
|
3481
3696
|
);
|
|
3482
3697
|
}
|
|
3483
3698
|
}
|
|
3484
|
-
var Autocomplete =
|
|
3699
|
+
var Autocomplete = React72.forwardRef(AutocompleteInner);
|
|
3485
3700
|
Autocomplete.displayName = "Autocomplete";
|
|
3486
3701
|
|
|
3487
3702
|
// lib/Progress/RufousLogoLoader.tsx
|
|
3488
|
-
import * as
|
|
3703
|
+
import * as React73 from "react";
|
|
3489
3704
|
var _uid = 0;
|
|
3490
3705
|
var RufousLogoLoader = ({ size = 80, sx, className }) => {
|
|
3491
|
-
const clipId =
|
|
3706
|
+
const clipId = React73.useRef(`rll-${++_uid}`).current;
|
|
3492
3707
|
const height = size * (38.795 / 54.585);
|
|
3493
3708
|
const sxClass = useSx(sx);
|
|
3494
|
-
return /* @__PURE__ */
|
|
3709
|
+
return /* @__PURE__ */ React73.createElement("div", { className: ["rufous-logo-loader", sxClass, className].filter(Boolean).join(" "), style: { width: size, height } }, /* @__PURE__ */ React73.createElement(
|
|
3495
3710
|
"svg",
|
|
3496
3711
|
{
|
|
3497
3712
|
xmlns: "http://www.w3.org/2000/svg",
|
|
@@ -3500,19 +3715,19 @@ var RufousLogoLoader = ({ size = 80, sx, className }) => {
|
|
|
3500
3715
|
height,
|
|
3501
3716
|
className: "rufous-logo-loader__svg"
|
|
3502
3717
|
},
|
|
3503
|
-
/* @__PURE__ */
|
|
3718
|
+
/* @__PURE__ */ React73.createElement("defs", null, /* @__PURE__ */ React73.createElement("clipPath", { id: clipId }, /* @__PURE__ */ React73.createElement(
|
|
3504
3719
|
"path",
|
|
3505
3720
|
{
|
|
3506
3721
|
transform: "translate(2208 18.205)",
|
|
3507
3722
|
d: "M.7,38.8a3.783,3.783,0,0,1-.5-.045l-.031,0A.26.26,0,0,1,0,38.564a.279.279,0,0,1,.14-.2c.222-.126.45-.251.671-.371l.047-.026c.357-.194.8-.435,1.209-.685.783-.479,1.565-.993,2.32-1.489l.033-.022.218-.143.49-.32c.575-.374,1.226-.8,1.824-1.241.98-.726,1.834-1.407,2.611-2.081a22.444,22.444,0,0,0,1.783-1.774A14.2,14.2,0,0,0,12.5,28.749l.012-.016a15.8,15.8,0,0,0,1.151-1.8,10.351,10.351,0,0,0,.586-1.511l0-.011.092-.278a4.425,4.425,0,0,0,.14-.583l.007-.036c.024-.119.048-.243.079-.363a4.639,4.639,0,0,0-.034-2.566c-.064-.212-.126-.43-.184-.636l-.008-.028c-.111-.391-.225-.8-.369-1.181a8.71,8.71,0,0,0-2.279-3.24,14.363,14.363,0,0,0-3.239-2.326c-.75-.4-1.553-.727-2.329-1.046L6.1,13.114l-.157-.065c-.294-.122-.6-.221-.9-.318l-.025-.008c-.19-.061-.427-.136-.649-.218-.108-.04-.265-.172-.252-.229a.7.7,0,0,1,.235-.4.915.915,0,0,1,.449-.112c.383-.029.77-.063,1.165-.1.969-.085,1.971-.174,2.962-.181h.119a13.145,13.145,0,0,1,2.907.315,11.888,11.888,0,0,1,3.128,1.123,10.286,10.286,0,0,1,2.3,1.554.92.92,0,0,1,.273.4,12.722,12.722,0,0,1,.458,3.3c-.009,1.494-.014,2.867-.014,4.2,0,.309.013.588.039.852a1.013,1.013,0,0,0,.078.26l0,.01c.027.067.051.129.077.207.029-.064.054-.116.076-.161l.009-.017.006-.012a.823.823,0,0,0,.076-.189c.051-.247.1-.494.164-.767.136-.618.276-1.257.359-1.9a24.362,24.362,0,0,0,0-6.777,13.01,13.01,0,0,0-.559-2.1c-.061-.185-.125-.382-.187-.579a9.42,9.42,0,0,0-.583-1.469c-.367-.727-.786-1.449-1.184-2.126a9.376,9.376,0,0,0-.643-.918c-.076-.1-.151-.2-.224-.3L15.548,6.3a8.128,8.128,0,0,0-.865-1.057,32.021,32.021,0,0,0-2.466-2.183,12.673,12.673,0,0,0-1.905-1.188c-.48-.256-1-.485-1.462-.687-.221-.1-.457-.2-.683-.306a.663.663,0,0,1-.11-.071L8.039.795c-.027-.02-.058-.043-.1-.069L8.062.667,8.108.644a1.786,1.786,0,0,1,.27-.12A11.679,11.679,0,0,1,11.866,0a13.332,13.332,0,0,1,1.769.121A13.927,13.927,0,0,1,15.9.693l.471.147a10.775,10.775,0,0,1,1.656.658,9.622,9.622,0,0,1,1.768,1.041,32.024,32.024,0,0,1,3.092,2.717,25.62,25.62,0,0,1,2.245,2.829l.084.117c.617.86,1.171,1.777,1.678,2.641.255.435.484.9.687,1.3.14.281.285.572.436.854.262.491.534.977.835,1.516l.005.01q.169.3.337.6c.064.116.13.232.2.347l.027.047c.12.212.244.431.357.651a8.518,8.518,0,0,0,2.121,2.695c.065.024.137.054.212.086l.013.006a1.268,1.268,0,0,0,.376.123.087.087,0,0,0,.063-.02.209.209,0,0,0,.083-.151c0-.083-.08-.153-.157-.22a.694.694,0,0,1-.135-.142c-.134-.216-.273-.436-.407-.649l-.063-.1c-.373-.587-.8-1.251-1.157-1.923s-.666-1.373-.964-2.057l0-.008q-.123-.284-.247-.564a1.707,1.707,0,0,1,.239-1.554l.026-.046.005-.009A12.918,12.918,0,0,1,31.408,9.3,7.814,7.814,0,0,1,33.75,7.612a5.391,5.391,0,0,1,2.218-.444,11.369,11.369,0,0,1,1.882.186,9.211,9.211,0,0,1,2.845,1.022c.138.071.261.135.373.188a4.155,4.155,0,0,0,1.849.464h.093c1.993-.052,4-.14,5.95-.224l.846-.036c.9-.038,1.808-.066,2.682-.093L52.7,8.67l1.007-.031h.041a1.787,1.787,0,0,1,.73.163c.1.051.109.256.109.318,0,.081-.147.169-.257.175-.466.028-.994.043-1.485.043a37.855,37.855,0,0,0-6.3.577A9.221,9.221,0,0,0,42.7,11.3a7.884,7.884,0,0,0-1.565,1.5c-.593.743-1.116,1.545-1.621,2.321l-.121.185c-.228.35-.435.709-.662,1.109l-.041.071c-.136.236-.276.481-.42.717l-.007.012c-.349.572-.709,1.162-1.1,1.716l-.216.307-.01.014a21.585,21.585,0,0,1-1.451,1.907c-1.317,1.485-2.538,2.8-3.734,4.006a30.822,30.822,0,0,1-2.5,2.207c-.548.446-1.139.86-1.71,1.26l-.01.007q-.254.177-.5.355c-.536.379-1.109.78-1.7,1.157-.545.35-1.143.71-1.828,1.1-.842.483-1.586.9-2.275,1.26-.271.144-.553.272-.868.412-.13.058-.3.135-.467.213a6.838,6.838,0,0,1-1.18.3,5.079,5.079,0,0,1,.647-.771l.008-.008c.132-.136.251-.26.365-.393l.048-.056c.566-.667,1.151-1.357,1.7-2.059s1.126-1.439,1.649-2.2c.4-.579.749-1.2,1.134-1.888l.016-.028c.406-.734.826-1.493,1.181-2.266.274-.6.733-1.787.866-2.189l.023-.07c.13-.389.215-.646-.013-.916a.369.369,0,0,1-.041.031l0,0c-.028.021-.055.041-.058.065a2.307,2.307,0,0,1-.146.5,5.257,5.257,0,0,1-.374.709c-.281.468-.536.959-.782,1.434-.2.385-.379.731-.57,1.069a20.042,20.042,0,0,1-1.161,1.871,30.689,30.689,0,0,1-1.985,2.531c-.74.821-1.567,1.648-2.6,2.6a21.448,21.448,0,0,1-2.1,1.669c-.85.606-1.754,1.2-2.688,1.768a17.867,17.867,0,0,1-1.993,1.037c-.994.445-2.066.891-3.185,1.324a12.127,12.127,0,0,1-1.714.514c-.955.213-1.969.413-3.1.611-1.023.18-2.054.328-2.927.449A1.41,1.41,0,0,1,.7,38.8ZM37.945,10.58l-.007,0a.583.583,0,0,0-.223.048.677.677,0,0,0-.437.555.637.637,0,0,0,.426.527.621.621,0,0,0,.209.046h.016a.72.72,0,0,0,.464-.194.676.676,0,0,0,.194-.282l0-.011,0-.005,0-.006,0-.009a.415.415,0,0,0,.014-.109.734.734,0,0,0-.657-.56Z"
|
|
3508
3723
|
}
|
|
3509
3724
|
))),
|
|
3510
|
-
/* @__PURE__ */
|
|
3725
|
+
/* @__PURE__ */ React73.createElement("g", { transform: "translate(-123.275 -24)" }, /* @__PURE__ */ React73.createElement("g", { transform: "translate(-2084.725 5.795)", clipPath: `url(#${clipId})` }, /* @__PURE__ */ React73.createElement("rect", { className: "rufous-ls rufous-ls-1", width: "40", height: "6", transform: "translate(2208 58) rotate(-90)", fill: "#d07f6f" }), /* @__PURE__ */ React73.createElement("rect", { className: "rufous-ls rufous-ls-2", width: "40", height: "6", transform: "translate(2214 58) rotate(-90)", fill: "#c66958" }), /* @__PURE__ */ React73.createElement("rect", { className: "rufous-ls rufous-ls-3", width: "40", height: "7", transform: "translate(2220 58) rotate(-90)", fill: "#bb5341" }), /* @__PURE__ */ React73.createElement("rect", { className: "rufous-ls rufous-ls-4", width: "40", height: "6", transform: "translate(2227 58) rotate(-90)", fill: "#b03a28" }), /* @__PURE__ */ React73.createElement("rect", { className: "rufous-ls rufous-ls-5", width: "40", height: "6", transform: "translate(2233 58) rotate(-90)", fill: "#a41b06" }), /* @__PURE__ */ React73.createElement("rect", { className: "rufous-ls rufous-ls-6", width: "40", height: "6", transform: "translate(2239 58) rotate(-90)", fill: "#8e1604" }), /* @__PURE__ */ React73.createElement("rect", { className: "rufous-ls rufous-ls-7", width: "40", height: "6", transform: "translate(2245 58) rotate(-90)", fill: "#791103" }), /* @__PURE__ */ React73.createElement("rect", { className: "rufous-ls rufous-ls-8", width: "40", height: "5", transform: "translate(2251 58) rotate(-90)", fill: "#640c02" }), /* @__PURE__ */ React73.createElement("rect", { className: "rufous-ls rufous-ls-9", width: "40", height: "7", transform: "translate(2256 58) rotate(-90)", fill: "#500801" })))
|
|
3511
3726
|
));
|
|
3512
3727
|
};
|
|
3513
3728
|
|
|
3514
3729
|
// lib/DataGrid/DataGrid.tsx
|
|
3515
|
-
import
|
|
3730
|
+
import React74, { useState as useState8, useMemo as useMemo2, useRef as useRef8, useEffect as useEffect7 } from "react";
|
|
3516
3731
|
import {
|
|
3517
3732
|
ChevronUp,
|
|
3518
3733
|
ChevronDown,
|
|
@@ -3579,8 +3794,11 @@ function DataGrid({
|
|
|
3579
3794
|
actions,
|
|
3580
3795
|
pageSize: initialPageSize = 10,
|
|
3581
3796
|
pageSizeOptions = [5, 10, 25, 50],
|
|
3582
|
-
title
|
|
3797
|
+
title,
|
|
3798
|
+
className,
|
|
3799
|
+
sx
|
|
3583
3800
|
}) {
|
|
3801
|
+
const sxClass = useSx(sx);
|
|
3584
3802
|
const [columnOverrides, setColumnOverrides] = useState8({});
|
|
3585
3803
|
const resolvedColumns = useMemo2(() => {
|
|
3586
3804
|
return initialColumnsProp.map((col) => {
|
|
@@ -3881,7 +4099,7 @@ function DataGrid({
|
|
|
3881
4099
|
return offset;
|
|
3882
4100
|
};
|
|
3883
4101
|
const hasActiveFilters = advancedFilters.some((f) => f.value);
|
|
3884
|
-
return /* @__PURE__ */
|
|
4102
|
+
return /* @__PURE__ */ React74.createElement("div", { className: ["dg-root", sxClass, className].filter(Boolean).join(" ") }, /* @__PURE__ */ React74.createElement("div", { className: "dg-header" }, /* @__PURE__ */ React74.createElement("div", { className: "dg-header-info" }, /* @__PURE__ */ React74.createElement("h2", null, title), /* @__PURE__ */ React74.createElement("p", null, filteredData.length, " total records")), /* @__PURE__ */ React74.createElement("div", { className: "dg-header-actions" }, /* @__PURE__ */ React74.createElement("div", { className: "dg-search-wrap" }, /* @__PURE__ */ React74.createElement(Search, { size: 15 }), /* @__PURE__ */ React74.createElement(
|
|
3885
4103
|
"input",
|
|
3886
4104
|
{
|
|
3887
4105
|
className: "dg-search",
|
|
@@ -3892,52 +4110,52 @@ function DataGrid({
|
|
|
3892
4110
|
setCurrentPage(1);
|
|
3893
4111
|
}
|
|
3894
4112
|
}
|
|
3895
|
-
)), /* @__PURE__ */
|
|
4113
|
+
)), /* @__PURE__ */ React74.createElement(
|
|
3896
4114
|
"button",
|
|
3897
4115
|
{
|
|
3898
4116
|
className: `dg-icon-btn ${hasActiveFilters ? "active" : ""}`,
|
|
3899
4117
|
onClick: () => setShowAdvancedFilter(true),
|
|
3900
4118
|
title: "Filters"
|
|
3901
4119
|
},
|
|
3902
|
-
/* @__PURE__ */
|
|
3903
|
-
), /* @__PURE__ */
|
|
4120
|
+
/* @__PURE__ */ React74.createElement(Filter, { size: 16 })
|
|
4121
|
+
), /* @__PURE__ */ React74.createElement(
|
|
3904
4122
|
"button",
|
|
3905
4123
|
{
|
|
3906
4124
|
className: "dg-icon-btn",
|
|
3907
4125
|
onClick: () => setShowManageColumns(true),
|
|
3908
4126
|
title: "Manage Columns"
|
|
3909
4127
|
},
|
|
3910
|
-
/* @__PURE__ */
|
|
3911
|
-
), /* @__PURE__ */
|
|
4128
|
+
/* @__PURE__ */ React74.createElement(Columns, { size: 16 })
|
|
4129
|
+
), /* @__PURE__ */ React74.createElement("button", { className: "dg-action-btn", onClick: handleExport }, /* @__PURE__ */ React74.createElement(Download, { size: 14 }), " Export CSV"))), /* @__PURE__ */ React74.createElement("div", { className: "dg-table-wrap" }, /* @__PURE__ */ React74.createElement("table", { className: "dg-table" }, /* @__PURE__ */ React74.createElement("thead", null, /* @__PURE__ */ React74.createElement("tr", null, visibleColumns.map((col, idx) => {
|
|
3912
4130
|
const colField = String(col.field);
|
|
3913
4131
|
const width = columnWidths[colField] || 200;
|
|
3914
4132
|
const leftOffset = getLeftOffset(col, idx);
|
|
3915
4133
|
const rightOffset = getRightOffset(col, idx);
|
|
3916
4134
|
const isSorted = sortField === col.field;
|
|
3917
|
-
return /* @__PURE__ */
|
|
4135
|
+
return /* @__PURE__ */ React74.createElement(
|
|
3918
4136
|
"th",
|
|
3919
4137
|
{
|
|
3920
4138
|
key: colField,
|
|
3921
4139
|
className: `dg-thead-cell${col.pinned === "left" ? " pinned-left" : col.pinned === "right" ? " pinned-right" : ""} ${col.headerClassName || ""}`,
|
|
3922
4140
|
style: { width, minWidth: width, left: leftOffset, right: rightOffset, flex: col.flex }
|
|
3923
4141
|
},
|
|
3924
|
-
/* @__PURE__ */
|
|
4142
|
+
/* @__PURE__ */ React74.createElement("div", { className: "dg-th-inner" }, /* @__PURE__ */ React74.createElement(
|
|
3925
4143
|
"div",
|
|
3926
4144
|
{
|
|
3927
4145
|
className: `dg-th-label${col.sortable === false ? " no-sort" : ""}`,
|
|
3928
4146
|
onClick: () => col.sortable !== false && handleSort(col.field || "")
|
|
3929
4147
|
},
|
|
3930
4148
|
col.headerName,
|
|
3931
|
-
isSorted && sortDirection === "asc" && /* @__PURE__ */
|
|
3932
|
-
isSorted && sortDirection === "desc" && /* @__PURE__ */
|
|
3933
|
-
), /* @__PURE__ */
|
|
4149
|
+
isSorted && sortDirection === "asc" && /* @__PURE__ */ React74.createElement(ChevronUp, { size: 12 }),
|
|
4150
|
+
isSorted && sortDirection === "desc" && /* @__PURE__ */ React74.createElement(ChevronDown, { size: 12 })
|
|
4151
|
+
), /* @__PURE__ */ React74.createElement("div", { className: "dg-th-actions" }, !col.disableColumnMenu && /* @__PURE__ */ React74.createElement(
|
|
3934
4152
|
"button",
|
|
3935
4153
|
{
|
|
3936
4154
|
className: "dg-th-menu-btn",
|
|
3937
4155
|
onClick: (e) => handleMenuOpen(e, colField)
|
|
3938
4156
|
},
|
|
3939
|
-
/* @__PURE__ */
|
|
3940
|
-
), /* @__PURE__ */
|
|
4157
|
+
/* @__PURE__ */ React74.createElement(MoreVertical, { size: 13 })
|
|
4158
|
+
), /* @__PURE__ */ React74.createElement(
|
|
3941
4159
|
"div",
|
|
3942
4160
|
{
|
|
3943
4161
|
className: `dg-resizer${resizingColumn === colField ? " resizing" : ""}`,
|
|
@@ -3950,12 +4168,12 @@ function DataGrid({
|
|
|
3950
4168
|
}
|
|
3951
4169
|
)))
|
|
3952
4170
|
);
|
|
3953
|
-
}), actions && /* @__PURE__ */
|
|
4171
|
+
}), actions && /* @__PURE__ */ React74.createElement("th", { style: { width: 0, padding: 0 } }))), /* @__PURE__ */ React74.createElement("tbody", null, paginatedData.length === 0 ? /* @__PURE__ */ React74.createElement("tr", null, /* @__PURE__ */ React74.createElement("td", { colSpan: visibleColumns.length + (actions ? 1 : 0), className: "dg-empty" }, "No records found")) : paginatedData.map((item) => /* @__PURE__ */ React74.createElement("tr", { key: item.id, className: "dg-tbody-row" }, visibleColumns.map((col, idx) => {
|
|
3954
4172
|
const colField = String(col.field);
|
|
3955
4173
|
const width = columnWidths[colField] || 200;
|
|
3956
4174
|
const leftOffset = getLeftOffset(col, idx);
|
|
3957
4175
|
const rightOffset = getRightOffset(col, idx);
|
|
3958
|
-
return /* @__PURE__ */
|
|
4176
|
+
return /* @__PURE__ */ React74.createElement(
|
|
3959
4177
|
"td",
|
|
3960
4178
|
{
|
|
3961
4179
|
key: `${item.id}-${colField}`,
|
|
@@ -3976,11 +4194,11 @@ function DataGrid({
|
|
|
3976
4194
|
return String(formattedValue ?? "");
|
|
3977
4195
|
})()
|
|
3978
4196
|
);
|
|
3979
|
-
}), actions && /* @__PURE__ */
|
|
4197
|
+
}), actions && /* @__PURE__ */ React74.createElement("td", { className: "dg-row-actions-cell" }, (() => {
|
|
3980
4198
|
const resolvedActions = typeof actions === "function" ? actions(item) : actions;
|
|
3981
4199
|
const visibleActions = resolvedActions.filter((a) => !a.show || a.show(item));
|
|
3982
4200
|
if (visibleActions.length === 0) return null;
|
|
3983
|
-
return /* @__PURE__ */
|
|
4201
|
+
return /* @__PURE__ */ React74.createElement("div", { className: "dg-row-actions" }, /* @__PURE__ */ React74.createElement("div", { className: "dg-action-group" }, visibleActions.map((action, i) => /* @__PURE__ */ React74.createElement(
|
|
3984
4202
|
"button",
|
|
3985
4203
|
{
|
|
3986
4204
|
key: i,
|
|
@@ -3991,7 +4209,7 @@ function DataGrid({
|
|
|
3991
4209
|
},
|
|
3992
4210
|
action.icon
|
|
3993
4211
|
))));
|
|
3994
|
-
})())))))), /* @__PURE__ */
|
|
4212
|
+
})())))))), /* @__PURE__ */ React74.createElement("div", { className: "dg-pagination" }, /* @__PURE__ */ React74.createElement("div", { className: "dg-page-info" }, /* @__PURE__ */ React74.createElement("div", { className: "dg-per-page" }, /* @__PURE__ */ React74.createElement("span", null, "Rows per page:"), /* @__PURE__ */ React74.createElement(
|
|
3995
4213
|
"select",
|
|
3996
4214
|
{
|
|
3997
4215
|
value: pageSize,
|
|
@@ -4000,8 +4218,8 @@ function DataGrid({
|
|
|
4000
4218
|
setCurrentPage(1);
|
|
4001
4219
|
}
|
|
4002
4220
|
},
|
|
4003
|
-
pageSizeOptions.map((o) => /* @__PURE__ */
|
|
4004
|
-
)), /* @__PURE__ */
|
|
4221
|
+
pageSizeOptions.map((o) => /* @__PURE__ */ React74.createElement("option", { key: o, value: o }, o))
|
|
4222
|
+
)), /* @__PURE__ */ React74.createElement("span", null, (currentPage - 1) * pageSize + 1, "\u2013", Math.min(currentPage * pageSize, filteredData.length), " of ", filteredData.length)), /* @__PURE__ */ React74.createElement("div", { className: "dg-page-nav" }, /* @__PURE__ */ React74.createElement("button", { className: "dg-page-btn", disabled: currentPage === 1, onClick: () => setCurrentPage((p) => p - 1) }, /* @__PURE__ */ React74.createElement(ChevronLeft, { size: 15 })), /* @__PURE__ */ React74.createElement("span", { className: "dg-page-fraction" }, currentPage, " / ", totalPages), /* @__PURE__ */ React74.createElement("button", { className: "dg-page-btn", disabled: currentPage === totalPages, onClick: () => setCurrentPage((p) => p + 1) }, /* @__PURE__ */ React74.createElement(ChevronRight, { size: 15 })))), activeMenu && /* @__PURE__ */ React74.createElement(
|
|
4005
4223
|
"div",
|
|
4006
4224
|
{
|
|
4007
4225
|
ref: menuRef,
|
|
@@ -4012,25 +4230,25 @@ function DataGrid({
|
|
|
4012
4230
|
...menuPosition.right !== void 0 ? { right: menuPosition.right } : {}
|
|
4013
4231
|
}
|
|
4014
4232
|
},
|
|
4015
|
-
/* @__PURE__ */
|
|
4016
|
-
/* @__PURE__ */
|
|
4017
|
-
/* @__PURE__ */
|
|
4233
|
+
/* @__PURE__ */ React74.createElement("button", { className: "dg-menu-item", onClick: () => handleSort(activeMenu, "asc") }, /* @__PURE__ */ React74.createElement(ArrowUp, { size: 14 }), " Sort ascending"),
|
|
4234
|
+
/* @__PURE__ */ React74.createElement("button", { className: "dg-menu-item", onClick: () => handleSort(activeMenu, "desc") }, /* @__PURE__ */ React74.createElement(ArrowDown, { size: 14 }), " Sort descending"),
|
|
4235
|
+
/* @__PURE__ */ React74.createElement("div", { className: "dg-menu-divider" }),
|
|
4018
4236
|
(() => {
|
|
4019
4237
|
const col = resolvedColumns.find((c) => c.field === activeMenu);
|
|
4020
4238
|
if (!col) return null;
|
|
4021
|
-
return /* @__PURE__ */
|
|
4239
|
+
return /* @__PURE__ */ React74.createElement(React74.Fragment, null, col.pinned === "left" ? /* @__PURE__ */ React74.createElement("button", { className: "dg-menu-item", onClick: () => togglePin(activeMenu, "left") }, /* @__PURE__ */ React74.createElement(Pin, { size: 14, style: { transform: "rotate(0deg)", opacity: 0.5 } }), " Unpin") : /* @__PURE__ */ React74.createElement("button", { className: "dg-menu-item", onClick: () => togglePin(activeMenu, "left") }, /* @__PURE__ */ React74.createElement(Pin, { size: 14, style: { transform: "rotate(45deg)" } }), " Pin left"), col.pinned === "right" ? /* @__PURE__ */ React74.createElement("button", { className: "dg-menu-item", onClick: () => togglePin(activeMenu, "right") }, /* @__PURE__ */ React74.createElement(Pin, { size: 14, style: { transform: "rotate(0deg)", opacity: 0.5 } }), " Unpin") : /* @__PURE__ */ React74.createElement("button", { className: "dg-menu-item", onClick: () => togglePin(activeMenu, "right") }, /* @__PURE__ */ React74.createElement(Pin, { size: 14, style: { transform: "rotate(-45deg)" } }), " Pin right"));
|
|
4022
4240
|
})(),
|
|
4023
|
-
/* @__PURE__ */
|
|
4024
|
-
/* @__PURE__ */
|
|
4241
|
+
/* @__PURE__ */ React74.createElement("div", { className: "dg-menu-divider" }),
|
|
4242
|
+
/* @__PURE__ */ React74.createElement("button", { className: "dg-menu-item", onClick: () => {
|
|
4025
4243
|
setShowAdvancedFilter(true);
|
|
4026
4244
|
setActiveMenu(null);
|
|
4027
|
-
} }, /* @__PURE__ */
|
|
4028
|
-
/* @__PURE__ */
|
|
4029
|
-
/* @__PURE__ */
|
|
4245
|
+
} }, /* @__PURE__ */ React74.createElement(Filter, { size: 14 }), " Filter\u2026"),
|
|
4246
|
+
/* @__PURE__ */ React74.createElement("button", { className: "dg-menu-item", onClick: () => toggleHide(activeMenu) }, /* @__PURE__ */ React74.createElement(EyeOff, { size: 14 }), " Hide column"),
|
|
4247
|
+
/* @__PURE__ */ React74.createElement("button", { className: "dg-menu-item", onClick: () => {
|
|
4030
4248
|
setShowManageColumns(true);
|
|
4031
4249
|
setActiveMenu(null);
|
|
4032
|
-
} }, /* @__PURE__ */
|
|
4033
|
-
), showManageColumns && /* @__PURE__ */
|
|
4250
|
+
} }, /* @__PURE__ */ React74.createElement(Columns, { size: 14 }), " Manage columns")
|
|
4251
|
+
), showManageColumns && /* @__PURE__ */ React74.createElement("div", { className: "dg-modal-overlay", onClick: () => setShowManageColumns(false) }, /* @__PURE__ */ React74.createElement("div", { className: "dg-modal", onClick: (e) => e.stopPropagation() }, /* @__PURE__ */ React74.createElement("div", { className: "dg-modal-header" }, /* @__PURE__ */ React74.createElement("h3", null, "Manage Columns"), /* @__PURE__ */ React74.createElement("button", { className: "dg-icon-btn", onClick: () => setShowManageColumns(false) }, /* @__PURE__ */ React74.createElement(X2, { size: 18 }))), /* @__PURE__ */ React74.createElement("div", { className: "dg-modal-body" }, /* @__PURE__ */ React74.createElement("div", { className: "dg-search-wrap", style: { marginBottom: 8 } }, /* @__PURE__ */ React74.createElement(Search, { size: 14 }), /* @__PURE__ */ React74.createElement(
|
|
4034
4252
|
"input",
|
|
4035
4253
|
{
|
|
4036
4254
|
className: "dg-search",
|
|
@@ -4042,15 +4260,15 @@ function DataGrid({
|
|
|
4042
4260
|
)), resolvedColumns.filter((c) => c.header.toLowerCase().includes(colSearch.toLowerCase())).map((col) => {
|
|
4043
4261
|
const key = String(col.key);
|
|
4044
4262
|
const isUnhideable = col.hideable === false;
|
|
4045
|
-
return /* @__PURE__ */
|
|
4046
|
-
})), /* @__PURE__ */
|
|
4263
|
+
return /* @__PURE__ */ React74.createElement("div", { key, className: `dg-col-row${isUnhideable ? " disabled" : ""}` }, /* @__PURE__ */ React74.createElement("div", { className: "dg-col-label" }, /* @__PURE__ */ React74.createElement("div", { className: "dg-col-dot", style: { background: col.hidden ? "var(--border-color)" : "var(--primary-color)" } }), col.header), !isUnhideable && /* @__PURE__ */ React74.createElement("button", { className: "dg-icon-btn", onClick: () => toggleHide(key) }, col.hidden ? /* @__PURE__ */ React74.createElement(EyeOff, { size: 14 }) : /* @__PURE__ */ React74.createElement(EyeOff, { size: 14, style: { opacity: 0.4 } })));
|
|
4264
|
+
})), /* @__PURE__ */ React74.createElement("div", { className: "dg-modal-footer" }, /* @__PURE__ */ React74.createElement("button", { className: "dg-action-btn", onClick: () => setColumnOverrides((prev) => {
|
|
4047
4265
|
const next = { ...prev };
|
|
4048
4266
|
resolvedColumns.forEach((c) => {
|
|
4049
4267
|
const k = String(c.key);
|
|
4050
4268
|
next[k] = { ...next[k], hidden: false };
|
|
4051
4269
|
});
|
|
4052
4270
|
return next;
|
|
4053
|
-
}) }, "Show All"), /* @__PURE__ */
|
|
4271
|
+
}) }, "Show All"), /* @__PURE__ */ React74.createElement("button", { className: "dg-action-btn", onClick: () => {
|
|
4054
4272
|
const newOverrides = { ...columnOverrides };
|
|
4055
4273
|
resolvedColumns.forEach((c) => {
|
|
4056
4274
|
if (c.hideable !== false) {
|
|
@@ -4059,21 +4277,21 @@ function DataGrid({
|
|
|
4059
4277
|
}
|
|
4060
4278
|
});
|
|
4061
4279
|
setColumnOverrides(newOverrides);
|
|
4062
|
-
} }, "Hide All")))), showAdvancedFilter && /* @__PURE__ */
|
|
4280
|
+
} }, "Hide All")))), showAdvancedFilter && /* @__PURE__ */ React74.createElement("div", { className: "dg-modal-overlay", onClick: () => setShowAdvancedFilter(false) }, /* @__PURE__ */ React74.createElement("div", { className: "dg-modal dg-modal-wide dg-filter-modal", onClick: (e) => e.stopPropagation() }, /* @__PURE__ */ React74.createElement("div", { className: "dg-modal-header" }, /* @__PURE__ */ React74.createElement("h3", null, "Filters"), /* @__PURE__ */ React74.createElement("button", { className: "dg-icon-btn", onClick: () => setShowAdvancedFilter(false) }, /* @__PURE__ */ React74.createElement(X2, { size: 18 }))), /* @__PURE__ */ React74.createElement("div", { className: "dg-modal-body" }, advancedFilters.map((f, idx) => /* @__PURE__ */ React74.createElement("div", { key: idx }, idx > 0 && /* @__PURE__ */ React74.createElement("div", { className: "dg-filter-logic" }, /* @__PURE__ */ React74.createElement(
|
|
4063
4281
|
"button",
|
|
4064
4282
|
{
|
|
4065
4283
|
className: `dg-logic-btn${f.logic === "AND" ? " active" : ""}`,
|
|
4066
4284
|
onClick: () => setAdvancedFilters((p) => p.map((fi, i) => i === idx ? { ...fi, logic: "AND" } : fi))
|
|
4067
4285
|
},
|
|
4068
4286
|
"AND"
|
|
4069
|
-
), /* @__PURE__ */
|
|
4287
|
+
), /* @__PURE__ */ React74.createElement(
|
|
4070
4288
|
"button",
|
|
4071
4289
|
{
|
|
4072
4290
|
className: `dg-logic-btn${f.logic === "OR" ? " active" : ""}`,
|
|
4073
4291
|
onClick: () => setAdvancedFilters((p) => p.map((fi, i) => i === idx ? { ...fi, logic: "OR" } : fi))
|
|
4074
4292
|
},
|
|
4075
4293
|
"OR"
|
|
4076
|
-
)), /* @__PURE__ */
|
|
4294
|
+
)), /* @__PURE__ */ React74.createElement("div", { className: "dg-filter-row" }, advancedFilters.length > 1 && /* @__PURE__ */ React74.createElement("button", { className: "dg-icon-btn", onClick: () => setAdvancedFilters((p) => p.filter((_, i) => i !== idx)) }, /* @__PURE__ */ React74.createElement(X2, { size: 14 })), /* @__PURE__ */ React74.createElement(
|
|
4077
4295
|
"select",
|
|
4078
4296
|
{
|
|
4079
4297
|
className: "dg-filter-select",
|
|
@@ -4085,20 +4303,20 @@ function DataGrid({
|
|
|
4085
4303
|
setAdvancedFilters((p) => p.map((fi, i) => i === idx ? { ...fi, column: newColKey, operator: defaultOp, value: "" } : fi));
|
|
4086
4304
|
}
|
|
4087
4305
|
},
|
|
4088
|
-
resolvedColumns.map((c) => /* @__PURE__ */
|
|
4306
|
+
resolvedColumns.map((c) => /* @__PURE__ */ React74.createElement("option", { key: String(c.key), value: String(c.key) }, c.header))
|
|
4089
4307
|
), (() => {
|
|
4090
4308
|
const col = resolvedColumns.find((c) => String(c.key) === f.column);
|
|
4091
4309
|
const operators = getOperatorsForType(col?.type);
|
|
4092
4310
|
const hideValue = f.operator === "is empty" || f.operator === "is not empty";
|
|
4093
|
-
return /* @__PURE__ */
|
|
4311
|
+
return /* @__PURE__ */ React74.createElement(React74.Fragment, null, /* @__PURE__ */ React74.createElement(
|
|
4094
4312
|
"select",
|
|
4095
4313
|
{
|
|
4096
4314
|
className: "dg-filter-select dg-filter-select-sm",
|
|
4097
4315
|
value: f.operator,
|
|
4098
4316
|
onChange: (e) => setAdvancedFilters((p) => p.map((fi, i) => i === idx ? { ...fi, operator: e.target.value, value: "" } : fi))
|
|
4099
4317
|
},
|
|
4100
|
-
operators.map((op) => /* @__PURE__ */
|
|
4101
|
-
), !hideValue && col?.type === "date" && /* @__PURE__ */
|
|
4318
|
+
operators.map((op) => /* @__PURE__ */ React74.createElement("option", { key: op.value, value: op.value }, op.label))
|
|
4319
|
+
), !hideValue && col?.type === "date" && /* @__PURE__ */ React74.createElement("div", { className: "dg-filter-datefield" }, /* @__PURE__ */ React74.createElement(
|
|
4102
4320
|
DateField,
|
|
4103
4321
|
{
|
|
4104
4322
|
value: f.value,
|
|
@@ -4107,17 +4325,17 @@ function DataGrid({
|
|
|
4107
4325
|
}
|
|
4108
4326
|
)), !hideValue && col?.type === "status" && (() => {
|
|
4109
4327
|
const options = col.statusOptions || [...new Set(data.map((item) => String(item[col.field || col.key || ""])))].filter((v) => v && v !== "undefined" && v !== "null").sort();
|
|
4110
|
-
return /* @__PURE__ */
|
|
4328
|
+
return /* @__PURE__ */ React74.createElement(
|
|
4111
4329
|
"select",
|
|
4112
4330
|
{
|
|
4113
4331
|
className: "dg-filter-select",
|
|
4114
4332
|
value: f.value,
|
|
4115
4333
|
onChange: (e) => setAdvancedFilters((p) => p.map((fi, i) => i === idx ? { ...fi, value: e.target.value } : fi))
|
|
4116
4334
|
},
|
|
4117
|
-
/* @__PURE__ */
|
|
4118
|
-
options.map((opt) => /* @__PURE__ */
|
|
4335
|
+
/* @__PURE__ */ React74.createElement("option", { value: "" }, "Select\u2026"),
|
|
4336
|
+
options.map((opt) => /* @__PURE__ */ React74.createElement("option", { key: opt, value: opt }, opt))
|
|
4119
4337
|
);
|
|
4120
|
-
})(), !hideValue && col?.type !== "date" && col?.type !== "status" && /* @__PURE__ */
|
|
4338
|
+
})(), !hideValue && col?.type !== "date" && col?.type !== "status" && /* @__PURE__ */ React74.createElement(
|
|
4121
4339
|
"input",
|
|
4122
4340
|
{
|
|
4123
4341
|
type: col?.type === "number" ? "number" : "text",
|
|
@@ -4127,7 +4345,7 @@ function DataGrid({
|
|
|
4127
4345
|
onChange: (e) => setAdvancedFilters((p) => p.map((fi, i) => i === idx ? { ...fi, value: e.target.value } : fi))
|
|
4128
4346
|
}
|
|
4129
4347
|
));
|
|
4130
|
-
})()))), /* @__PURE__ */
|
|
4348
|
+
})()))), /* @__PURE__ */ React74.createElement(
|
|
4131
4349
|
"button",
|
|
4132
4350
|
{
|
|
4133
4351
|
className: "dg-action-btn",
|
|
@@ -4138,9 +4356,9 @@ function DataGrid({
|
|
|
4138
4356
|
setAdvancedFilters((p) => [...p, { column: String(firstCol.key), operator: defaultOp, value: "", logic: "AND" }]);
|
|
4139
4357
|
}
|
|
4140
4358
|
},
|
|
4141
|
-
/* @__PURE__ */
|
|
4359
|
+
/* @__PURE__ */ React74.createElement(Plus, { size: 14 }),
|
|
4142
4360
|
" Add Filter"
|
|
4143
|
-
)), /* @__PURE__ */
|
|
4361
|
+
)), /* @__PURE__ */ React74.createElement("div", { className: "dg-modal-footer" }, /* @__PURE__ */ React74.createElement(
|
|
4144
4362
|
"button",
|
|
4145
4363
|
{
|
|
4146
4364
|
className: "dg-action-btn",
|
|
@@ -4149,13 +4367,13 @@ function DataGrid({
|
|
|
4149
4367
|
setAdvancedFilters([{ column: String(firstCol.key), operator: getDefaultOperator(firstCol?.type), value: "", logic: "AND" }]);
|
|
4150
4368
|
}
|
|
4151
4369
|
},
|
|
4152
|
-
/* @__PURE__ */
|
|
4370
|
+
/* @__PURE__ */ React74.createElement(Trash2, { size: 14 }),
|
|
4153
4371
|
" Reset"
|
|
4154
|
-
), /* @__PURE__ */
|
|
4372
|
+
), /* @__PURE__ */ React74.createElement("button", { className: "submit-btn", onClick: () => setShowAdvancedFilter(false) }, "Apply")))));
|
|
4155
4373
|
}
|
|
4156
4374
|
|
|
4157
4375
|
// lib/Editors/RichTextEditor.tsx
|
|
4158
|
-
import
|
|
4376
|
+
import React75, { useEffect as useEffect8, useRef as useRef9, useState as useState9 } from "react";
|
|
4159
4377
|
import JoditReact from "jodit-react";
|
|
4160
4378
|
var MOBILE_BREAKPOINT = 768;
|
|
4161
4379
|
var TODO_STATES = [
|
|
@@ -4464,7 +4682,7 @@ function RichTextEditor({
|
|
|
4464
4682
|
iconURL: showAll ? "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIj48Y2lyY2xlIGN4PSIxMiIgY3k9IjEyIiByPSIxMSIgc3Ryb2tlPSJibGFjayIgc3Ryb2tlLXdpZHRoPSIyIiBmaWxsPSJub25lIi8+PHBvbHlsaW5lIHBvaW50cz0iOCAxNCAxMiAxMCAxNiAxNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSJibGFjayIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz48L3N2Zz4=" : "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIj48Y2lyY2xlIGN4PSIxMiIgY3k9IjEyIiByPSIxMSIgc3Ryb2tlPSJibGFjayIgc3Ryb2tlLXdpZHRoPSIyIiBmaWxsPSJub25lIi8+PHBvbHlsaW5lIHBvaW50cz0iOCAxMCAxMiAxNCAxNiAxMCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSJibGFjayIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz48L3N2Zz4=",
|
|
4465
4683
|
exec: () => setShowAll((prev) => !prev)
|
|
4466
4684
|
};
|
|
4467
|
-
const config =
|
|
4685
|
+
const config = React75.useMemo(() => {
|
|
4468
4686
|
let uploadConfig = {};
|
|
4469
4687
|
if (uploadUrl) {
|
|
4470
4688
|
const uploadData = {};
|
|
@@ -4580,14 +4798,14 @@ function RichTextEditor({
|
|
|
4580
4798
|
safePluginList: ["changecase", "rteKeyLogger"]
|
|
4581
4799
|
};
|
|
4582
4800
|
}, [isMobile, showAll, isListening, disabled, aiSupport, licenseKey, translationKey, token, uploadUrl, mentions?.arr?.length, height, width, allowResizeY, fullSize, placeholder]);
|
|
4583
|
-
return /* @__PURE__ */
|
|
4801
|
+
return /* @__PURE__ */ React75.createElement(
|
|
4584
4802
|
"div",
|
|
4585
4803
|
{
|
|
4586
4804
|
ref: containerRef,
|
|
4587
4805
|
className: `rte-wrapper ${isListening ? "rte-listening" : ""} ${className}`,
|
|
4588
4806
|
style
|
|
4589
4807
|
},
|
|
4590
|
-
/* @__PURE__ */
|
|
4808
|
+
/* @__PURE__ */ React75.createElement(
|
|
4591
4809
|
JoditReact,
|
|
4592
4810
|
{
|
|
4593
4811
|
ref: editorRef,
|
|
@@ -4598,7 +4816,7 @@ function RichTextEditor({
|
|
|
4598
4816
|
onBlur: (v) => onBlur?.(v)
|
|
4599
4817
|
}
|
|
4600
4818
|
),
|
|
4601
|
-
/* @__PURE__ */
|
|
4819
|
+
/* @__PURE__ */ React75.createElement(
|
|
4602
4820
|
"div",
|
|
4603
4821
|
{
|
|
4604
4822
|
className: "rte-speech-popup",
|
|
@@ -4610,26 +4828,26 @@ function RichTextEditor({
|
|
|
4610
4828
|
pointerEvents: "none"
|
|
4611
4829
|
}
|
|
4612
4830
|
},
|
|
4613
|
-
/* @__PURE__ */
|
|
4614
|
-
/* @__PURE__ */
|
|
4831
|
+
/* @__PURE__ */ React75.createElement("span", { className: "rte-speech-dot" }),
|
|
4832
|
+
/* @__PURE__ */ React75.createElement("span", null, speechText || "\u2026")
|
|
4615
4833
|
),
|
|
4616
|
-
error && /* @__PURE__ */
|
|
4834
|
+
error && /* @__PURE__ */ React75.createElement("p", { className: "rte-error" }, error)
|
|
4617
4835
|
);
|
|
4618
4836
|
}
|
|
4619
4837
|
|
|
4620
4838
|
// lib/Select/Select.tsx
|
|
4621
|
-
import
|
|
4839
|
+
import React76, {
|
|
4622
4840
|
useState as useState10,
|
|
4623
4841
|
useRef as useRef10,
|
|
4624
4842
|
useEffect as useEffect9,
|
|
4625
4843
|
useCallback as useCallback3
|
|
4626
4844
|
} from "react";
|
|
4627
|
-
var ChevronDownIcon2 = () => /* @__PURE__ */
|
|
4628
|
-
var CheckIcon2 = () => /* @__PURE__ */
|
|
4845
|
+
var ChevronDownIcon2 = () => /* @__PURE__ */ React76.createElement("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.2", strokeLinecap: "round", strokeLinejoin: "round" }, /* @__PURE__ */ React76.createElement("polyline", { points: "6 9 12 15 18 9" }));
|
|
4846
|
+
var CheckIcon2 = () => /* @__PURE__ */ React76.createElement("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", strokeLinecap: "round", strokeLinejoin: "round" }, /* @__PURE__ */ React76.createElement("polyline", { points: "20 6 9 17 4 12" }));
|
|
4629
4847
|
function normaliseOptions(options) {
|
|
4630
4848
|
return options.map((o) => typeof o === "string" ? { value: o, label: o } : o);
|
|
4631
4849
|
}
|
|
4632
|
-
var Select =
|
|
4850
|
+
var Select = React76.forwardRef(function Select2(props, ref) {
|
|
4633
4851
|
const {
|
|
4634
4852
|
options: rawOptions,
|
|
4635
4853
|
value,
|
|
@@ -4761,20 +4979,20 @@ var Select = React74.forwardRef(function Select2(props, ref) {
|
|
|
4761
4979
|
if (multiple) {
|
|
4762
4980
|
const labels = getSelectedLabels();
|
|
4763
4981
|
if (labels.length === 0) {
|
|
4764
|
-
return /* @__PURE__ */
|
|
4982
|
+
return /* @__PURE__ */ React76.createElement("div", { className: "rf-select__chips" }, placeholder && /* @__PURE__ */ React76.createElement("span", { className: "rf-select__display rf-select__display--placeholder" }, placeholder));
|
|
4765
4983
|
}
|
|
4766
4984
|
if (labels.length <= 2) {
|
|
4767
|
-
return /* @__PURE__ */
|
|
4985
|
+
return /* @__PURE__ */ React76.createElement("div", { className: "rf-select__chips" }, labels.map((l, i) => /* @__PURE__ */ React76.createElement("span", { key: i, className: "rf-select__chip" }, l)));
|
|
4768
4986
|
}
|
|
4769
|
-
return /* @__PURE__ */
|
|
4987
|
+
return /* @__PURE__ */ React76.createElement("div", { className: "rf-select__chips" }, labels.slice(0, 2).map((l, i) => /* @__PURE__ */ React76.createElement("span", { key: i, className: "rf-select__chip" }, l)), /* @__PURE__ */ React76.createElement("span", { className: "rf-select__count" }, "+", labels.length - 2));
|
|
4770
4988
|
}
|
|
4771
4989
|
const selectedOpt = options.find((o) => o.value === value);
|
|
4772
4990
|
if (selectedOpt) {
|
|
4773
|
-
return /* @__PURE__ */
|
|
4991
|
+
return /* @__PURE__ */ React76.createElement("div", { className: "rf-select__display" }, selectedOpt.label);
|
|
4774
4992
|
}
|
|
4775
|
-
return /* @__PURE__ */
|
|
4993
|
+
return /* @__PURE__ */ React76.createElement("div", { className: `rf-select__display${placeholder ? " rf-select__display--placeholder" : ""}` }, placeholder || "\xA0");
|
|
4776
4994
|
};
|
|
4777
|
-
return /* @__PURE__ */
|
|
4995
|
+
return /* @__PURE__ */ React76.createElement(
|
|
4778
4996
|
"div",
|
|
4779
4997
|
{
|
|
4780
4998
|
ref: (node) => {
|
|
@@ -4785,7 +5003,7 @@ var Select = React74.forwardRef(function Select2(props, ref) {
|
|
|
4785
5003
|
className: rootClasses,
|
|
4786
5004
|
style
|
|
4787
5005
|
},
|
|
4788
|
-
/* @__PURE__ */
|
|
5006
|
+
/* @__PURE__ */ React76.createElement(
|
|
4789
5007
|
"div",
|
|
4790
5008
|
{
|
|
4791
5009
|
className: "rf-text-field__wrapper",
|
|
@@ -4799,15 +5017,15 @@ var Select = React74.forwardRef(function Select2(props, ref) {
|
|
|
4799
5017
|
onKeyDown: handleKeyDown
|
|
4800
5018
|
},
|
|
4801
5019
|
renderDisplay(),
|
|
4802
|
-
label && /* @__PURE__ */
|
|
4803
|
-
variant === "outlined" && /* @__PURE__ */
|
|
4804
|
-
/* @__PURE__ */
|
|
5020
|
+
label && /* @__PURE__ */ React76.createElement("label", { id: inputId, className: "rf-text-field__label" }, label, required && /* @__PURE__ */ React76.createElement("span", { className: "rf-text-field__asterisk" }, " *")),
|
|
5021
|
+
variant === "outlined" && /* @__PURE__ */ React76.createElement("fieldset", { className: "rf-text-field__notch" }, label ? /* @__PURE__ */ React76.createElement("legend", { className: "rf-text-field__legend" }, /* @__PURE__ */ React76.createElement("span", null, label, required ? " *" : "")) : /* @__PURE__ */ React76.createElement("legend", { className: "rf-text-field__legend--empty" })),
|
|
5022
|
+
/* @__PURE__ */ React76.createElement("div", { className: "rf-select__arrow", "aria-hidden": "true" }, /* @__PURE__ */ React76.createElement(ChevronDownIcon2, null))
|
|
4805
5023
|
),
|
|
4806
|
-
helperText && /* @__PURE__ */
|
|
4807
|
-
open && !disabled && /* @__PURE__ */
|
|
5024
|
+
helperText && /* @__PURE__ */ React76.createElement("div", { className: `rf-text-field__helper-text${error ? " rf-text-field__helper-text--error" : ""}` }, helperText),
|
|
5025
|
+
open && !disabled && /* @__PURE__ */ React76.createElement("div", { className: "rf-select__popup", role: "presentation" }, /* @__PURE__ */ React76.createElement("ul", { ref: listRef, className: "rf-select__listbox", role: "listbox", "aria-multiselectable": multiple }, options.map((opt, idx) => {
|
|
4808
5026
|
const selected = isSelected(opt.value);
|
|
4809
5027
|
const focused = focusedIdx === idx;
|
|
4810
|
-
return /* @__PURE__ */
|
|
5028
|
+
return /* @__PURE__ */ React76.createElement(
|
|
4811
5029
|
"li",
|
|
4812
5030
|
{
|
|
4813
5031
|
key: opt.value,
|
|
@@ -4826,8 +5044,8 @@ var Select = React74.forwardRef(function Select2(props, ref) {
|
|
|
4826
5044
|
onMouseDown: (e) => e.preventDefault(),
|
|
4827
5045
|
onClick: () => selectOption(opt)
|
|
4828
5046
|
},
|
|
4829
|
-
/* @__PURE__ */
|
|
4830
|
-
/* @__PURE__ */
|
|
5047
|
+
/* @__PURE__ */ React76.createElement("span", { className: "rf-select__option-label" }, opt.label),
|
|
5048
|
+
/* @__PURE__ */ React76.createElement("span", { className: "rf-select__option-check", "aria-hidden": "true" }, /* @__PURE__ */ React76.createElement(CheckIcon2, null))
|
|
4831
5049
|
);
|
|
4832
5050
|
})))
|
|
4833
5051
|
);
|
|
@@ -4835,7 +5053,7 @@ var Select = React74.forwardRef(function Select2(props, ref) {
|
|
|
4835
5053
|
Select.displayName = "Select";
|
|
4836
5054
|
|
|
4837
5055
|
// lib/Slider/Slider.tsx
|
|
4838
|
-
import
|
|
5056
|
+
import React77, {
|
|
4839
5057
|
useState as useState11,
|
|
4840
5058
|
useRef as useRef11,
|
|
4841
5059
|
useEffect as useEffect10,
|
|
@@ -4850,7 +5068,7 @@ function snapToStep(val, min, step) {
|
|
|
4850
5068
|
function pct(val, min, max) {
|
|
4851
5069
|
return (val - min) / (max - min) * 100;
|
|
4852
5070
|
}
|
|
4853
|
-
var Slider =
|
|
5071
|
+
var Slider = React77.forwardRef(function Slider2(props, ref) {
|
|
4854
5072
|
const {
|
|
4855
5073
|
value,
|
|
4856
5074
|
onChange,
|
|
@@ -4990,7 +5208,7 @@ var Slider = React75.forwardRef(function Slider2(props, ref) {
|
|
|
4990
5208
|
const val = vals[thumb];
|
|
4991
5209
|
const p = pct(val, min, max);
|
|
4992
5210
|
const thumbStyle = orientation === "vertical" ? { bottom: `${p}%`, transform: "translate(-50%, 50%)" } : { left: `${p}%` };
|
|
4993
|
-
return /* @__PURE__ */
|
|
5211
|
+
return /* @__PURE__ */ React77.createElement(
|
|
4994
5212
|
"div",
|
|
4995
5213
|
{
|
|
4996
5214
|
key: thumb,
|
|
@@ -5006,30 +5224,30 @@ var Slider = React75.forwardRef(function Slider2(props, ref) {
|
|
|
5006
5224
|
onPointerDown: (e) => handleThumbPointerDown(e, thumb),
|
|
5007
5225
|
onKeyDown: (e) => handleThumbKeyDown(e, thumb)
|
|
5008
5226
|
},
|
|
5009
|
-
valueLabelDisplay !== "off" && /* @__PURE__ */
|
|
5227
|
+
valueLabelDisplay !== "off" && /* @__PURE__ */ React77.createElement("div", { className: "rf-slider__value-label", "aria-hidden": "true" }, val)
|
|
5010
5228
|
);
|
|
5011
5229
|
};
|
|
5012
|
-
return /* @__PURE__ */
|
|
5230
|
+
return /* @__PURE__ */ React77.createElement("div", { ref, className: rootClasses, style }, label && /* @__PURE__ */ React77.createElement("div", { className: "rf-slider__label" }, label), /* @__PURE__ */ React77.createElement(
|
|
5013
5231
|
"div",
|
|
5014
5232
|
{
|
|
5015
5233
|
ref: trackRef,
|
|
5016
5234
|
className: "rf-slider__track-container",
|
|
5017
5235
|
onPointerDown: handleTrackPointerDown
|
|
5018
5236
|
},
|
|
5019
|
-
/* @__PURE__ */
|
|
5020
|
-
/* @__PURE__ */
|
|
5237
|
+
/* @__PURE__ */ React77.createElement("div", { className: "rf-slider__rail", "aria-hidden": "true" }),
|
|
5238
|
+
/* @__PURE__ */ React77.createElement("div", { className: "rf-slider__track", style: trackStyle, "aria-hidden": "true" }),
|
|
5021
5239
|
computedMarks.map((mark) => {
|
|
5022
5240
|
const p = pct(mark.value, min, max);
|
|
5023
5241
|
const isActive = isRange ? mark.value >= vals[0] && mark.value <= vals[1] : mark.value <= vals[0];
|
|
5024
5242
|
const markStyle = orientation === "vertical" ? { bottom: `${p}%`, transform: "translate(-50%, 50%)" } : { left: `${p}%` };
|
|
5025
|
-
return /* @__PURE__ */
|
|
5243
|
+
return /* @__PURE__ */ React77.createElement(React77.Fragment, { key: mark.value }, /* @__PURE__ */ React77.createElement(
|
|
5026
5244
|
"div",
|
|
5027
5245
|
{
|
|
5028
5246
|
className: `rf-slider__mark${isActive ? " rf-slider__mark--active" : ""}`,
|
|
5029
5247
|
style: markStyle,
|
|
5030
5248
|
"aria-hidden": "true"
|
|
5031
5249
|
}
|
|
5032
|
-
), mark.label && orientation === "horizontal" && /* @__PURE__ */
|
|
5250
|
+
), mark.label && orientation === "horizontal" && /* @__PURE__ */ React77.createElement(
|
|
5033
5251
|
"div",
|
|
5034
5252
|
{
|
|
5035
5253
|
className: "rf-slider__mark-label",
|
|
@@ -5041,13 +5259,13 @@ var Slider = React75.forwardRef(function Slider2(props, ref) {
|
|
|
5041
5259
|
}),
|
|
5042
5260
|
renderThumb(0),
|
|
5043
5261
|
isRange && renderThumb(1)
|
|
5044
|
-
), hasLabelledMarks && orientation === "horizontal" && /* @__PURE__ */
|
|
5262
|
+
), hasLabelledMarks && orientation === "horizontal" && /* @__PURE__ */ React77.createElement("div", { className: "rf-slider__marks-labels", "aria-hidden": "true" }));
|
|
5045
5263
|
});
|
|
5046
5264
|
Slider.displayName = "Slider";
|
|
5047
5265
|
|
|
5048
5266
|
// lib/Switch/Switch.tsx
|
|
5049
|
-
import
|
|
5050
|
-
var Switch =
|
|
5267
|
+
import React78, { useRef as useRef12 } from "react";
|
|
5268
|
+
var Switch = React78.forwardRef(function Switch2(props, ref) {
|
|
5051
5269
|
const {
|
|
5052
5270
|
checked = false,
|
|
5053
5271
|
onChange,
|
|
@@ -5077,7 +5295,7 @@ var Switch = React76.forwardRef(function Switch2(props, ref) {
|
|
|
5077
5295
|
sxClass,
|
|
5078
5296
|
className
|
|
5079
5297
|
].filter(Boolean).join(" ");
|
|
5080
|
-
return /* @__PURE__ */
|
|
5298
|
+
return /* @__PURE__ */ React78.createElement(
|
|
5081
5299
|
"label",
|
|
5082
5300
|
{
|
|
5083
5301
|
ref,
|
|
@@ -5085,7 +5303,7 @@ var Switch = React76.forwardRef(function Switch2(props, ref) {
|
|
|
5085
5303
|
style,
|
|
5086
5304
|
htmlFor: inputId
|
|
5087
5305
|
},
|
|
5088
|
-
/* @__PURE__ */
|
|
5306
|
+
/* @__PURE__ */ React78.createElement(
|
|
5089
5307
|
"input",
|
|
5090
5308
|
{
|
|
5091
5309
|
ref: inputRef,
|
|
@@ -5100,16 +5318,16 @@ var Switch = React76.forwardRef(function Switch2(props, ref) {
|
|
|
5100
5318
|
"aria-checked": checked
|
|
5101
5319
|
}
|
|
5102
5320
|
),
|
|
5103
|
-
/* @__PURE__ */
|
|
5104
|
-
label && /* @__PURE__ */
|
|
5321
|
+
/* @__PURE__ */ React78.createElement("div", { className: "rf-switch__track", "aria-hidden": "true" }, /* @__PURE__ */ React78.createElement("div", { className: "rf-switch__thumb" })),
|
|
5322
|
+
label && /* @__PURE__ */ React78.createElement("span", { className: "rf-switch__label" }, label, required && /* @__PURE__ */ React78.createElement("span", { style: { color: "var(--tf-error-color, #d32f2f)" } }, " *"))
|
|
5105
5323
|
);
|
|
5106
5324
|
});
|
|
5107
5325
|
Switch.displayName = "Switch";
|
|
5108
5326
|
|
|
5109
5327
|
// lib/RadioGroup/RadioGroup.tsx
|
|
5110
|
-
import
|
|
5328
|
+
import React79, { useRef as useRef13, createContext as createContext2, useContext as useContext2 } from "react";
|
|
5111
5329
|
var RadioGroupContext = createContext2({});
|
|
5112
|
-
var Radio =
|
|
5330
|
+
var Radio = React79.forwardRef(function Radio2(props, ref) {
|
|
5113
5331
|
const ctx = useContext2(RadioGroupContext);
|
|
5114
5332
|
const {
|
|
5115
5333
|
value,
|
|
@@ -5140,7 +5358,7 @@ var Radio = React77.forwardRef(function Radio2(props, ref) {
|
|
|
5140
5358
|
isDisabled ? "rf-radio--disabled" : "",
|
|
5141
5359
|
sxClass
|
|
5142
5360
|
].filter(Boolean).join(" ");
|
|
5143
|
-
return /* @__PURE__ */
|
|
5361
|
+
return /* @__PURE__ */ React79.createElement("label", { ref, className: rootClasses, htmlFor: inputId }, /* @__PURE__ */ React79.createElement(
|
|
5144
5362
|
"input",
|
|
5145
5363
|
{
|
|
5146
5364
|
id: inputId,
|
|
@@ -5153,10 +5371,10 @@ var Radio = React77.forwardRef(function Radio2(props, ref) {
|
|
|
5153
5371
|
name,
|
|
5154
5372
|
"aria-checked": isChecked
|
|
5155
5373
|
}
|
|
5156
|
-
), /* @__PURE__ */
|
|
5374
|
+
), /* @__PURE__ */ React79.createElement("div", { className: "rf-radio__control", "aria-hidden": "true" }, /* @__PURE__ */ React79.createElement("div", { className: "rf-radio__ripple" }), /* @__PURE__ */ React79.createElement("div", { className: "rf-radio__outer" }, /* @__PURE__ */ React79.createElement("div", { className: "rf-radio__inner" }))), label && /* @__PURE__ */ React79.createElement("span", { className: "rf-radio__label" }, label));
|
|
5157
5375
|
});
|
|
5158
5376
|
Radio.displayName = "Radio";
|
|
5159
|
-
var RadioGroup =
|
|
5377
|
+
var RadioGroup = React79.forwardRef(function RadioGroup2(props, ref) {
|
|
5160
5378
|
const {
|
|
5161
5379
|
value,
|
|
5162
5380
|
onChange,
|
|
@@ -5180,7 +5398,7 @@ var RadioGroup = React77.forwardRef(function RadioGroup2(props, ref) {
|
|
|
5180
5398
|
sxClass,
|
|
5181
5399
|
className
|
|
5182
5400
|
].filter(Boolean).join(" ");
|
|
5183
|
-
return /* @__PURE__ */
|
|
5401
|
+
return /* @__PURE__ */ React79.createElement(RadioGroupContext.Provider, { value: { value, onChange, name: groupName, disabled, size } }, /* @__PURE__ */ React79.createElement(
|
|
5184
5402
|
"div",
|
|
5185
5403
|
{
|
|
5186
5404
|
ref,
|
|
@@ -5189,8 +5407,8 @@ var RadioGroup = React77.forwardRef(function RadioGroup2(props, ref) {
|
|
|
5189
5407
|
role: "radiogroup",
|
|
5190
5408
|
"aria-label": label
|
|
5191
5409
|
},
|
|
5192
|
-
label && /* @__PURE__ */
|
|
5193
|
-
options ? options.map((opt) => /* @__PURE__ */
|
|
5410
|
+
label && /* @__PURE__ */ React79.createElement("div", { className: "rf-radio-group__label" }, label),
|
|
5411
|
+
options ? options.map((opt) => /* @__PURE__ */ React79.createElement(
|
|
5194
5412
|
Radio,
|
|
5195
5413
|
{
|
|
5196
5414
|
key: opt.value,
|
|
@@ -5204,12 +5422,12 @@ var RadioGroup = React77.forwardRef(function RadioGroup2(props, ref) {
|
|
|
5204
5422
|
RadioGroup.displayName = "RadioGroup";
|
|
5205
5423
|
|
|
5206
5424
|
// lib/Rating/Rating.tsx
|
|
5207
|
-
import
|
|
5425
|
+
import React80, {
|
|
5208
5426
|
useState as useState12,
|
|
5209
5427
|
useRef as useRef14
|
|
5210
5428
|
} from "react";
|
|
5211
5429
|
var starSize = { small: 18, medium: 24, large: 32 };
|
|
5212
|
-
var FilledStarIcon = ({ size }) => /* @__PURE__ */
|
|
5430
|
+
var FilledStarIcon = ({ size }) => /* @__PURE__ */ React80.createElement(
|
|
5213
5431
|
"svg",
|
|
5214
5432
|
{
|
|
5215
5433
|
width: size,
|
|
@@ -5218,9 +5436,9 @@ var FilledStarIcon = ({ size }) => /* @__PURE__ */ React78.createElement(
|
|
|
5218
5436
|
fill: "currentColor",
|
|
5219
5437
|
"aria-hidden": "true"
|
|
5220
5438
|
},
|
|
5221
|
-
/* @__PURE__ */
|
|
5439
|
+
/* @__PURE__ */ React80.createElement("path", { d: "M12 17.27L18.18 21l-1.64-7.03L22 9.24l-7.19-.61L12 2 9.19 8.63 2 9.24l5.46 4.73L5.82 21z" })
|
|
5222
5440
|
);
|
|
5223
|
-
var EmptyStarIcon = ({ size }) => /* @__PURE__ */
|
|
5441
|
+
var EmptyStarIcon = ({ size }) => /* @__PURE__ */ React80.createElement(
|
|
5224
5442
|
"svg",
|
|
5225
5443
|
{
|
|
5226
5444
|
width: size,
|
|
@@ -5231,9 +5449,9 @@ var EmptyStarIcon = ({ size }) => /* @__PURE__ */ React78.createElement(
|
|
|
5231
5449
|
strokeWidth: "1.6",
|
|
5232
5450
|
"aria-hidden": "true"
|
|
5233
5451
|
},
|
|
5234
|
-
/* @__PURE__ */
|
|
5452
|
+
/* @__PURE__ */ React80.createElement("path", { d: "M12 17.27L18.18 21l-1.64-7.03L22 9.24l-7.19-.61L12 2 9.19 8.63 2 9.24l5.46 4.73L5.82 21z" })
|
|
5235
5453
|
);
|
|
5236
|
-
var Rating =
|
|
5454
|
+
var Rating = React80.forwardRef(function Rating2(props, ref) {
|
|
5237
5455
|
const {
|
|
5238
5456
|
value,
|
|
5239
5457
|
onChange,
|
|
@@ -5256,8 +5474,8 @@ var Rating = React78.forwardRef(function Rating2(props, ref) {
|
|
|
5256
5474
|
const currentValue = value ?? 0;
|
|
5257
5475
|
const displayValue = hoverValue !== null ? hoverValue : currentValue;
|
|
5258
5476
|
const iconSize = starSize[size] ?? 24;
|
|
5259
|
-
const renderedFilledIcon = icon ?? /* @__PURE__ */
|
|
5260
|
-
const renderedEmptyIcon = emptyIcon ?? /* @__PURE__ */
|
|
5477
|
+
const renderedFilledIcon = icon ?? /* @__PURE__ */ React80.createElement(FilledStarIcon, { size: iconSize });
|
|
5478
|
+
const renderedEmptyIcon = emptyIcon ?? /* @__PURE__ */ React80.createElement(EmptyStarIcon, { size: iconSize });
|
|
5261
5479
|
const isFilled = (pos) => {
|
|
5262
5480
|
if (highlightSelectedOnly) return displayValue === pos;
|
|
5263
5481
|
return displayValue >= pos - (precision < 1 ? 0.25 : 0);
|
|
@@ -5318,7 +5536,7 @@ var Rating = React78.forwardRef(function Rating2(props, ref) {
|
|
|
5318
5536
|
sxClass,
|
|
5319
5537
|
className
|
|
5320
5538
|
].filter(Boolean).join(" ");
|
|
5321
|
-
return /* @__PURE__ */
|
|
5539
|
+
return /* @__PURE__ */ React80.createElement("div", { ref, className: rootClasses, style }, label && /* @__PURE__ */ React80.createElement("div", { className: "rf-rating__label" }, label), /* @__PURE__ */ React80.createElement(
|
|
5322
5540
|
"div",
|
|
5323
5541
|
{
|
|
5324
5542
|
ref: starsRef,
|
|
@@ -5335,7 +5553,7 @@ var Rating = React78.forwardRef(function Rating2(props, ref) {
|
|
|
5335
5553
|
"rf-rating__item",
|
|
5336
5554
|
isHovered ? "rf-rating__item--hovered" : ""
|
|
5337
5555
|
].filter(Boolean).join(" ");
|
|
5338
|
-
return /* @__PURE__ */
|
|
5556
|
+
return /* @__PURE__ */ React80.createElement(
|
|
5339
5557
|
"button",
|
|
5340
5558
|
{
|
|
5341
5559
|
key: pos,
|
|
@@ -5350,15 +5568,15 @@ var Rating = React78.forwardRef(function Rating2(props, ref) {
|
|
|
5350
5568
|
},
|
|
5351
5569
|
halfFilled ? (
|
|
5352
5570
|
// Half-star: show half filled + half empty
|
|
5353
|
-
/* @__PURE__ */
|
|
5571
|
+
/* @__PURE__ */ React80.createElement("div", { className: "rf-rating__icon-container", style: { position: "relative" } }, /* @__PURE__ */ React80.createElement("span", { className: "rf-rating__icon--empty" }, renderedEmptyIcon), /* @__PURE__ */ React80.createElement(
|
|
5354
5572
|
"span",
|
|
5355
5573
|
{
|
|
5356
5574
|
className: "rf-rating__half-left",
|
|
5357
5575
|
style: { position: "absolute", inset: 0, width: "50%", overflow: "hidden" }
|
|
5358
5576
|
},
|
|
5359
|
-
/* @__PURE__ */
|
|
5577
|
+
/* @__PURE__ */ React80.createElement("span", { className: "rf-rating__icon--filled" }, renderedFilledIcon)
|
|
5360
5578
|
))
|
|
5361
|
-
) : /* @__PURE__ */
|
|
5579
|
+
) : /* @__PURE__ */ React80.createElement("div", { className: "rf-rating__icon-container" }, /* @__PURE__ */ React80.createElement("span", { className: filled ? "rf-rating__icon--filled" : "rf-rating__icon--empty" }, filled ? renderedFilledIcon : renderedEmptyIcon))
|
|
5362
5580
|
);
|
|
5363
5581
|
})
|
|
5364
5582
|
));
|
|
@@ -5366,12 +5584,12 @@ var Rating = React78.forwardRef(function Rating2(props, ref) {
|
|
|
5366
5584
|
Rating.displayName = "Rating";
|
|
5367
5585
|
|
|
5368
5586
|
// lib/ToggleButton/ToggleButton.tsx
|
|
5369
|
-
import
|
|
5587
|
+
import React81, {
|
|
5370
5588
|
createContext as createContext3,
|
|
5371
5589
|
useContext as useContext3
|
|
5372
5590
|
} from "react";
|
|
5373
5591
|
var ToggleGroupContext = createContext3({});
|
|
5374
|
-
var ToggleButton =
|
|
5592
|
+
var ToggleButton = React81.forwardRef(
|
|
5375
5593
|
function ToggleButton2(props, ref) {
|
|
5376
5594
|
const ctx = useContext3(ToggleGroupContext);
|
|
5377
5595
|
const { value, children, disabled: disabledProp, selected: selectedProp, sx } = props;
|
|
@@ -5404,7 +5622,7 @@ var ToggleButton = React79.forwardRef(
|
|
|
5404
5622
|
}
|
|
5405
5623
|
}
|
|
5406
5624
|
};
|
|
5407
|
-
const isIconOnly =
|
|
5625
|
+
const isIconOnly = React81.Children.count(children) === 1 && React81.isValidElement(children) && children.type === "svg";
|
|
5408
5626
|
const btnClasses = [
|
|
5409
5627
|
"rf-toggle-btn",
|
|
5410
5628
|
isSelected ? "rf-toggle-btn--selected" : "",
|
|
@@ -5412,7 +5630,7 @@ var ToggleButton = React79.forwardRef(
|
|
|
5412
5630
|
isIconOnly ? "rf-toggle-btn--icon-only" : "",
|
|
5413
5631
|
sxClass
|
|
5414
5632
|
].filter(Boolean).join(" ");
|
|
5415
|
-
return /* @__PURE__ */
|
|
5633
|
+
return /* @__PURE__ */ React81.createElement(
|
|
5416
5634
|
"button",
|
|
5417
5635
|
{
|
|
5418
5636
|
ref,
|
|
@@ -5427,7 +5645,7 @@ var ToggleButton = React79.forwardRef(
|
|
|
5427
5645
|
}
|
|
5428
5646
|
);
|
|
5429
5647
|
ToggleButton.displayName = "ToggleButton";
|
|
5430
|
-
var ToggleButtonGroup =
|
|
5648
|
+
var ToggleButtonGroup = React81.forwardRef(
|
|
5431
5649
|
function ToggleButtonGroup2(props, ref) {
|
|
5432
5650
|
const {
|
|
5433
5651
|
value,
|
|
@@ -5454,7 +5672,7 @@ var ToggleButtonGroup = React79.forwardRef(
|
|
|
5454
5672
|
sxClass,
|
|
5455
5673
|
className
|
|
5456
5674
|
].filter(Boolean).join(" ");
|
|
5457
|
-
return /* @__PURE__ */
|
|
5675
|
+
return /* @__PURE__ */ React81.createElement(ToggleGroupContext.Provider, { value: { value, onChange, exclusive, size, disabled, color } }, /* @__PURE__ */ React81.createElement(
|
|
5458
5676
|
"div",
|
|
5459
5677
|
{
|
|
5460
5678
|
ref,
|
|
@@ -5470,7 +5688,7 @@ var ToggleButtonGroup = React79.forwardRef(
|
|
|
5470
5688
|
ToggleButtonGroup.displayName = "ToggleButtonGroup";
|
|
5471
5689
|
|
|
5472
5690
|
// lib/Avatar/Avatar.tsx
|
|
5473
|
-
import
|
|
5691
|
+
import React82, { useState as useState13 } from "react";
|
|
5474
5692
|
var DEFAULT_PALETTE = [
|
|
5475
5693
|
"#a41b06",
|
|
5476
5694
|
"#8b1605",
|
|
@@ -5505,7 +5723,7 @@ function getInitials(alt) {
|
|
|
5505
5723
|
}
|
|
5506
5724
|
return words[0][0].toUpperCase();
|
|
5507
5725
|
}
|
|
5508
|
-
var Avatar =
|
|
5726
|
+
var Avatar = React82.forwardRef(
|
|
5509
5727
|
({
|
|
5510
5728
|
src,
|
|
5511
5729
|
alt,
|
|
@@ -5540,7 +5758,7 @@ var Avatar = React80.forwardRef(
|
|
|
5540
5758
|
inlineStyle.backgroundColor = bgColor;
|
|
5541
5759
|
inlineStyle.color = "#ffffff";
|
|
5542
5760
|
}
|
|
5543
|
-
return /* @__PURE__ */
|
|
5761
|
+
return /* @__PURE__ */ React82.createElement("div", { ref, className: classes, style: inlineStyle, "aria-label": alt, role: alt ? "img" : void 0, onClick, tabIndex: onClick ? 0 : void 0 }, showImage ? /* @__PURE__ */ React82.createElement(
|
|
5544
5762
|
"img",
|
|
5545
5763
|
{
|
|
5546
5764
|
src,
|
|
@@ -5549,7 +5767,7 @@ var Avatar = React80.forwardRef(
|
|
|
5549
5767
|
onError: () => setImgError(true),
|
|
5550
5768
|
...imgProps
|
|
5551
5769
|
}
|
|
5552
|
-
) : /* @__PURE__ */
|
|
5770
|
+
) : /* @__PURE__ */ React82.createElement("span", { className: "rf-avatar__initials" }, content));
|
|
5553
5771
|
}
|
|
5554
5772
|
);
|
|
5555
5773
|
Avatar.displayName = "Avatar";
|
|
@@ -5562,7 +5780,7 @@ var AvatarGroup = ({
|
|
|
5562
5780
|
sx
|
|
5563
5781
|
}) => {
|
|
5564
5782
|
const sxClass = useSx(sx);
|
|
5565
|
-
const childArray =
|
|
5783
|
+
const childArray = React82.Children.toArray(children);
|
|
5566
5784
|
const totalCount = childArray.length;
|
|
5567
5785
|
const overflowCount = totalCount > max ? totalCount - (max - 1) : 0;
|
|
5568
5786
|
const visibleChildren = overflowCount > 0 ? childArray.slice(0, max - 1) : childArray;
|
|
@@ -5576,7 +5794,7 @@ var AvatarGroup = ({
|
|
|
5576
5794
|
}
|
|
5577
5795
|
const classes = ["rf-avatar-group", spacingClass, sxClass, className].filter(Boolean).join(" ");
|
|
5578
5796
|
const avatarsToRender = [...visibleChildren].reverse();
|
|
5579
|
-
return /* @__PURE__ */
|
|
5797
|
+
return /* @__PURE__ */ React82.createElement("div", { className: classes, style, role: "group" }, overflowCount > 0 && /* @__PURE__ */ React82.createElement(
|
|
5580
5798
|
Avatar,
|
|
5581
5799
|
{
|
|
5582
5800
|
className: "rf-avatar-group__overflow",
|
|
@@ -5588,7 +5806,7 @@ var AvatarGroup = ({
|
|
|
5588
5806
|
), avatarsToRender.map((child, i) => {
|
|
5589
5807
|
if (typeof spacing === "number") {
|
|
5590
5808
|
const typedChild = child;
|
|
5591
|
-
return
|
|
5809
|
+
return React82.cloneElement(typedChild, {
|
|
5592
5810
|
key: i,
|
|
5593
5811
|
style: {
|
|
5594
5812
|
marginLeft: i < avatarsToRender.length - 1 ? -spacing : 0,
|
|
@@ -5602,7 +5820,7 @@ var AvatarGroup = ({
|
|
|
5602
5820
|
AvatarGroup.displayName = "AvatarGroup";
|
|
5603
5821
|
|
|
5604
5822
|
// lib/Chip/Chip.tsx
|
|
5605
|
-
import
|
|
5823
|
+
import React83 from "react";
|
|
5606
5824
|
var Chip = ({
|
|
5607
5825
|
label,
|
|
5608
5826
|
onDelete,
|
|
@@ -5640,7 +5858,7 @@ var Chip = ({
|
|
|
5640
5858
|
onDelete();
|
|
5641
5859
|
}
|
|
5642
5860
|
};
|
|
5643
|
-
return /* @__PURE__ */
|
|
5861
|
+
return /* @__PURE__ */ React83.createElement(
|
|
5644
5862
|
"div",
|
|
5645
5863
|
{
|
|
5646
5864
|
className: classes,
|
|
@@ -5651,10 +5869,10 @@ var Chip = ({
|
|
|
5651
5869
|
onKeyDown: !disabled ? handleKeyDown : void 0,
|
|
5652
5870
|
"aria-disabled": disabled || void 0
|
|
5653
5871
|
},
|
|
5654
|
-
avatar && /* @__PURE__ */
|
|
5655
|
-
!avatar && icon && /* @__PURE__ */
|
|
5656
|
-
/* @__PURE__ */
|
|
5657
|
-
onDelete && /* @__PURE__ */
|
|
5872
|
+
avatar && /* @__PURE__ */ React83.createElement("span", { className: "rf-chip__avatar" }, avatar),
|
|
5873
|
+
!avatar && icon && /* @__PURE__ */ React83.createElement("span", { className: "rf-chip__icon", "aria-hidden": "true" }, icon),
|
|
5874
|
+
/* @__PURE__ */ React83.createElement("span", { className: "rf-chip__label" }, label),
|
|
5875
|
+
onDelete && /* @__PURE__ */ React83.createElement(
|
|
5658
5876
|
"button",
|
|
5659
5877
|
{
|
|
5660
5878
|
className: "rf-chip__delete",
|
|
@@ -5675,7 +5893,7 @@ var Chip = ({
|
|
|
5675
5893
|
Chip.displayName = "Chip";
|
|
5676
5894
|
|
|
5677
5895
|
// lib/Divider/Divider.tsx
|
|
5678
|
-
import
|
|
5896
|
+
import React84 from "react";
|
|
5679
5897
|
var Divider = ({
|
|
5680
5898
|
orientation = "horizontal",
|
|
5681
5899
|
variant = "fullWidth",
|
|
@@ -5689,7 +5907,7 @@ var Divider = ({
|
|
|
5689
5907
|
sx
|
|
5690
5908
|
}) => {
|
|
5691
5909
|
const sxClass = useSx(sx);
|
|
5692
|
-
const hasChildren =
|
|
5910
|
+
const hasChildren = React84.Children.count(children) > 0;
|
|
5693
5911
|
const variantClass = variant === "inset" ? "rf-divider--inset" : variant === "middle" ? "rf-divider--middle" : "";
|
|
5694
5912
|
const classes = [
|
|
5695
5913
|
"rf-divider",
|
|
@@ -5705,7 +5923,7 @@ var Divider = ({
|
|
|
5705
5923
|
].filter(Boolean).join(" ");
|
|
5706
5924
|
const Tag = component || (hasChildren ? "div" : "hr");
|
|
5707
5925
|
if (!hasChildren) {
|
|
5708
|
-
return /* @__PURE__ */
|
|
5926
|
+
return /* @__PURE__ */ React84.createElement(
|
|
5709
5927
|
Tag,
|
|
5710
5928
|
{
|
|
5711
5929
|
className: classes,
|
|
@@ -5714,7 +5932,7 @@ var Divider = ({
|
|
|
5714
5932
|
}
|
|
5715
5933
|
);
|
|
5716
5934
|
}
|
|
5717
|
-
return /* @__PURE__ */
|
|
5935
|
+
return /* @__PURE__ */ React84.createElement(
|
|
5718
5936
|
Tag,
|
|
5719
5937
|
{
|
|
5720
5938
|
className: classes,
|
|
@@ -5722,13 +5940,13 @@ var Divider = ({
|
|
|
5722
5940
|
role: "separator",
|
|
5723
5941
|
"aria-orientation": orientation
|
|
5724
5942
|
},
|
|
5725
|
-
/* @__PURE__ */
|
|
5943
|
+
/* @__PURE__ */ React84.createElement("span", { className: "rf-divider__text" }, children)
|
|
5726
5944
|
);
|
|
5727
5945
|
};
|
|
5728
5946
|
Divider.displayName = "Divider";
|
|
5729
5947
|
|
|
5730
5948
|
// lib/List/List.tsx
|
|
5731
|
-
import
|
|
5949
|
+
import React85 from "react";
|
|
5732
5950
|
var List = ({
|
|
5733
5951
|
dense = false,
|
|
5734
5952
|
disablePadding = false,
|
|
@@ -5746,7 +5964,7 @@ var List = ({
|
|
|
5746
5964
|
sxClass,
|
|
5747
5965
|
className
|
|
5748
5966
|
].filter(Boolean).join(" ");
|
|
5749
|
-
return /* @__PURE__ */
|
|
5967
|
+
return /* @__PURE__ */ React85.createElement("ul", { className: classes, style }, subheader, children);
|
|
5750
5968
|
};
|
|
5751
5969
|
List.displayName = "List";
|
|
5752
5970
|
var ListItem = ({
|
|
@@ -5770,7 +5988,7 @@ var ListItem = ({
|
|
|
5770
5988
|
sxClass,
|
|
5771
5989
|
className
|
|
5772
5990
|
].filter(Boolean).join(" ");
|
|
5773
|
-
return /* @__PURE__ */
|
|
5991
|
+
return /* @__PURE__ */ React85.createElement("li", { className: classes, style }, /* @__PURE__ */ React85.createElement("div", { className: "rf-list-item__content" }, children), secondaryAction && /* @__PURE__ */ React85.createElement("div", { className: "rf-list-item__secondary-action" }, secondaryAction));
|
|
5774
5992
|
};
|
|
5775
5993
|
ListItem.displayName = "ListItem";
|
|
5776
5994
|
var ListItemText = ({
|
|
@@ -5787,12 +6005,12 @@ var ListItemText = ({
|
|
|
5787
6005
|
inset ? "rf-list-item-text--inset" : "",
|
|
5788
6006
|
sxClass
|
|
5789
6007
|
].filter(Boolean).join(" ");
|
|
5790
|
-
return /* @__PURE__ */
|
|
6008
|
+
return /* @__PURE__ */ React85.createElement("div", { className: classes }, /* @__PURE__ */ React85.createElement("p", { className: "rf-list-item-text__primary", ...primaryTypographyProps }, primary), secondary && /* @__PURE__ */ React85.createElement("p", { className: "rf-list-item-text__secondary", ...secondaryTypographyProps }, secondary));
|
|
5791
6009
|
};
|
|
5792
6010
|
ListItemText.displayName = "ListItemText";
|
|
5793
6011
|
var ListItemIcon = ({ children, sx }) => {
|
|
5794
6012
|
const sxClass = useSx(sx);
|
|
5795
|
-
return /* @__PURE__ */
|
|
6013
|
+
return /* @__PURE__ */ React85.createElement("div", { className: ["rf-list-item-icon", sxClass].filter(Boolean).join(" "), "aria-hidden": "true" }, children);
|
|
5796
6014
|
};
|
|
5797
6015
|
ListItemIcon.displayName = "ListItemIcon";
|
|
5798
6016
|
var ListItemButton = ({
|
|
@@ -5824,7 +6042,7 @@ var ListItemButton = ({
|
|
|
5824
6042
|
"aria-disabled": disabled || void 0
|
|
5825
6043
|
};
|
|
5826
6044
|
if (href) {
|
|
5827
|
-
return /* @__PURE__ */
|
|
6045
|
+
return /* @__PURE__ */ React85.createElement(
|
|
5828
6046
|
"a",
|
|
5829
6047
|
{
|
|
5830
6048
|
href,
|
|
@@ -5835,7 +6053,7 @@ var ListItemButton = ({
|
|
|
5835
6053
|
children
|
|
5836
6054
|
);
|
|
5837
6055
|
}
|
|
5838
|
-
return /* @__PURE__ */
|
|
6056
|
+
return /* @__PURE__ */ React85.createElement(
|
|
5839
6057
|
"button",
|
|
5840
6058
|
{
|
|
5841
6059
|
type: "button",
|
|
@@ -5864,12 +6082,12 @@ var ListSubheader = ({
|
|
|
5864
6082
|
color !== "default" ? `rf-list-subheader--color-${color}` : "",
|
|
5865
6083
|
sxClass
|
|
5866
6084
|
].filter(Boolean).join(" ");
|
|
5867
|
-
return /* @__PURE__ */
|
|
6085
|
+
return /* @__PURE__ */ React85.createElement("li", { className: classes, role: "presentation", "aria-label": typeof children === "string" ? children : void 0 }, children);
|
|
5868
6086
|
};
|
|
5869
6087
|
ListSubheader.displayName = "ListSubheader";
|
|
5870
6088
|
|
|
5871
6089
|
// lib/Typography/Typography.tsx
|
|
5872
|
-
import
|
|
6090
|
+
import React86 from "react";
|
|
5873
6091
|
var VARIANT_ELEMENT_MAP = {
|
|
5874
6092
|
h1: "h1",
|
|
5875
6093
|
h2: "h2",
|
|
@@ -5943,12 +6161,12 @@ var Typography = ({
|
|
|
5943
6161
|
...weightStyle,
|
|
5944
6162
|
...style
|
|
5945
6163
|
};
|
|
5946
|
-
return /* @__PURE__ */
|
|
6164
|
+
return /* @__PURE__ */ React86.createElement(Tag, { className: classes, style: Object.keys(inlineStyle).length > 0 ? inlineStyle : void 0 }, children);
|
|
5947
6165
|
};
|
|
5948
6166
|
Typography.displayName = "Typography";
|
|
5949
6167
|
|
|
5950
6168
|
// lib/Skeleton/Skeleton.tsx
|
|
5951
|
-
import
|
|
6169
|
+
import React87 from "react";
|
|
5952
6170
|
var Skeleton = ({
|
|
5953
6171
|
variant = "text",
|
|
5954
6172
|
width,
|
|
@@ -5984,7 +6202,7 @@ var Skeleton = ({
|
|
|
5984
6202
|
if (variant === "rounded" && !height) {
|
|
5985
6203
|
inlineStyle.height = 140;
|
|
5986
6204
|
}
|
|
5987
|
-
return /* @__PURE__ */
|
|
6205
|
+
return /* @__PURE__ */ React87.createElement(
|
|
5988
6206
|
"span",
|
|
5989
6207
|
{
|
|
5990
6208
|
className: classes,
|
|
@@ -5997,7 +6215,7 @@ var Skeleton = ({
|
|
|
5997
6215
|
Skeleton.displayName = "Skeleton";
|
|
5998
6216
|
|
|
5999
6217
|
// lib/Tooltip/Tooltip.tsx
|
|
6000
|
-
import
|
|
6218
|
+
import React88, {
|
|
6001
6219
|
useCallback as useCallback5,
|
|
6002
6220
|
useEffect as useEffect11,
|
|
6003
6221
|
useRef as useRef15,
|
|
@@ -6188,7 +6406,7 @@ var Tooltip = ({
|
|
|
6188
6406
|
sxClass,
|
|
6189
6407
|
className
|
|
6190
6408
|
].filter(Boolean).join(" ");
|
|
6191
|
-
const tooltipElement = /* @__PURE__ */
|
|
6409
|
+
const tooltipElement = /* @__PURE__ */ React88.createElement(
|
|
6192
6410
|
"div",
|
|
6193
6411
|
{
|
|
6194
6412
|
ref: tooltipRef,
|
|
@@ -6202,7 +6420,7 @@ var Tooltip = ({
|
|
|
6202
6420
|
"aria-hidden": !isOpen
|
|
6203
6421
|
},
|
|
6204
6422
|
title,
|
|
6205
|
-
arrow && /* @__PURE__ */
|
|
6423
|
+
arrow && /* @__PURE__ */ React88.createElement(
|
|
6206
6424
|
"span",
|
|
6207
6425
|
{
|
|
6208
6426
|
className: "rf-tooltip__arrow",
|
|
@@ -6213,7 +6431,7 @@ var Tooltip = ({
|
|
|
6213
6431
|
}
|
|
6214
6432
|
)
|
|
6215
6433
|
);
|
|
6216
|
-
return /* @__PURE__ */
|
|
6434
|
+
return /* @__PURE__ */ React88.createElement(React88.Fragment, null, /* @__PURE__ */ React88.createElement(
|
|
6217
6435
|
"span",
|
|
6218
6436
|
{
|
|
6219
6437
|
ref: anchorRef,
|
|
@@ -6221,14 +6439,14 @@ var Tooltip = ({
|
|
|
6221
6439
|
"aria-describedby": isOpen ? "rf-tooltip" : void 0,
|
|
6222
6440
|
...childProps
|
|
6223
6441
|
},
|
|
6224
|
-
|
|
6442
|
+
React88.cloneElement(children)
|
|
6225
6443
|
), ReactDOM.createPortal(tooltipElement, document.body));
|
|
6226
6444
|
};
|
|
6227
6445
|
Tooltip.displayName = "Tooltip";
|
|
6228
6446
|
|
|
6229
6447
|
// lib/Box/Box.tsx
|
|
6230
|
-
import * as
|
|
6231
|
-
var Box =
|
|
6448
|
+
import * as React89 from "react";
|
|
6449
|
+
var Box = React89.forwardRef(
|
|
6232
6450
|
({
|
|
6233
6451
|
component = "div",
|
|
6234
6452
|
children,
|
|
@@ -6241,6 +6459,23 @@ var Box = React87.forwardRef(
|
|
|
6241
6459
|
margin,
|
|
6242
6460
|
width,
|
|
6243
6461
|
height,
|
|
6462
|
+
minWidth,
|
|
6463
|
+
maxWidth,
|
|
6464
|
+
minHeight,
|
|
6465
|
+
maxHeight,
|
|
6466
|
+
flex,
|
|
6467
|
+
flexWrap,
|
|
6468
|
+
flexGrow,
|
|
6469
|
+
flexShrink,
|
|
6470
|
+
overflow,
|
|
6471
|
+
position,
|
|
6472
|
+
top,
|
|
6473
|
+
right,
|
|
6474
|
+
bottom,
|
|
6475
|
+
left,
|
|
6476
|
+
borderRadius,
|
|
6477
|
+
bgcolor,
|
|
6478
|
+
color,
|
|
6244
6479
|
className,
|
|
6245
6480
|
style,
|
|
6246
6481
|
sx,
|
|
@@ -6257,18 +6492,35 @@ var Box = React87.forwardRef(
|
|
|
6257
6492
|
...margin !== void 0 ? { margin: typeof margin === "number" ? `${margin}px` : margin } : {},
|
|
6258
6493
|
...width !== void 0 ? { width: typeof width === "number" ? `${width}px` : width } : {},
|
|
6259
6494
|
...height !== void 0 ? { height: typeof height === "number" ? `${height}px` : height } : {},
|
|
6495
|
+
...minWidth !== void 0 ? { minWidth: typeof minWidth === "number" ? `${minWidth}px` : minWidth } : {},
|
|
6496
|
+
...maxWidth !== void 0 ? { maxWidth: typeof maxWidth === "number" ? `${maxWidth}px` : maxWidth } : {},
|
|
6497
|
+
...minHeight !== void 0 ? { minHeight: typeof minHeight === "number" ? `${minHeight}px` : minHeight } : {},
|
|
6498
|
+
...maxHeight !== void 0 ? { maxHeight: typeof maxHeight === "number" ? `${maxHeight}px` : maxHeight } : {},
|
|
6499
|
+
...flex !== void 0 ? { flex } : {},
|
|
6500
|
+
...flexWrap !== void 0 ? { flexWrap } : {},
|
|
6501
|
+
...flexGrow !== void 0 ? { flexGrow } : {},
|
|
6502
|
+
...flexShrink !== void 0 ? { flexShrink } : {},
|
|
6503
|
+
...overflow !== void 0 ? { overflow } : {},
|
|
6504
|
+
...position !== void 0 ? { position } : {},
|
|
6505
|
+
...top !== void 0 ? { top: typeof top === "number" ? `${top}px` : top } : {},
|
|
6506
|
+
...right !== void 0 ? { right: typeof right === "number" ? `${right}px` : right } : {},
|
|
6507
|
+
...bottom !== void 0 ? { bottom: typeof bottom === "number" ? `${bottom}px` : bottom } : {},
|
|
6508
|
+
...left !== void 0 ? { left: typeof left === "number" ? `${left}px` : left } : {},
|
|
6509
|
+
...borderRadius !== void 0 ? { borderRadius: typeof borderRadius === "number" ? `${borderRadius}px` : borderRadius } : {},
|
|
6510
|
+
...bgcolor !== void 0 ? { backgroundColor: bgcolor } : {},
|
|
6511
|
+
...color !== void 0 ? { color } : {},
|
|
6260
6512
|
...style
|
|
6261
6513
|
};
|
|
6262
6514
|
const classes = ["rf-box", sxClass, className].filter(Boolean).join(" ");
|
|
6263
6515
|
const Tag = component;
|
|
6264
|
-
return /* @__PURE__ */
|
|
6516
|
+
return /* @__PURE__ */ React89.createElement(Tag, { ref, className: classes, style: inlineStyle, ...rest }, children);
|
|
6265
6517
|
}
|
|
6266
6518
|
);
|
|
6267
6519
|
Box.displayName = "Box";
|
|
6268
6520
|
|
|
6269
6521
|
// lib/Stack/Stack.tsx
|
|
6270
|
-
import * as
|
|
6271
|
-
var Stack =
|
|
6522
|
+
import * as React90 from "react";
|
|
6523
|
+
var Stack = React90.forwardRef(
|
|
6272
6524
|
({
|
|
6273
6525
|
direction = "column",
|
|
6274
6526
|
spacing,
|
|
@@ -6277,6 +6529,8 @@ var Stack = React88.forwardRef(
|
|
|
6277
6529
|
divider,
|
|
6278
6530
|
flexWrap,
|
|
6279
6531
|
useFlexGap = true,
|
|
6532
|
+
flex,
|
|
6533
|
+
overflow,
|
|
6280
6534
|
component = "div",
|
|
6281
6535
|
children,
|
|
6282
6536
|
className,
|
|
@@ -6292,19 +6546,21 @@ var Stack = React88.forwardRef(
|
|
|
6292
6546
|
...justifyContent !== void 0 ? { justifyContent } : {},
|
|
6293
6547
|
...flexWrap !== void 0 ? { flexWrap } : {},
|
|
6294
6548
|
...gapValue !== void 0 && useFlexGap ? { gap: gapValue } : {},
|
|
6549
|
+
...flex !== void 0 ? { flex } : {},
|
|
6550
|
+
...overflow !== void 0 ? { overflow } : {},
|
|
6295
6551
|
...style
|
|
6296
6552
|
};
|
|
6297
6553
|
const classes = ["rf-stack", sxClass, className].filter(Boolean).join(" ");
|
|
6298
6554
|
let content;
|
|
6299
6555
|
if (divider) {
|
|
6300
|
-
const childArray =
|
|
6556
|
+
const childArray = React90.Children.toArray(children).filter(
|
|
6301
6557
|
(child) => child !== null && child !== void 0
|
|
6302
6558
|
);
|
|
6303
6559
|
content = childArray.reduce((acc, child, idx) => {
|
|
6304
6560
|
acc.push(child);
|
|
6305
6561
|
if (idx < childArray.length - 1) {
|
|
6306
6562
|
acc.push(
|
|
6307
|
-
/* @__PURE__ */
|
|
6563
|
+
/* @__PURE__ */ React90.createElement("div", { key: `divider-${idx}`, className: "rf-stack-divider" }, divider)
|
|
6308
6564
|
);
|
|
6309
6565
|
}
|
|
6310
6566
|
return acc;
|
|
@@ -6313,13 +6569,13 @@ var Stack = React88.forwardRef(
|
|
|
6313
6569
|
content = children;
|
|
6314
6570
|
}
|
|
6315
6571
|
const Tag = component;
|
|
6316
|
-
return /* @__PURE__ */
|
|
6572
|
+
return /* @__PURE__ */ React90.createElement(Tag, { ref, className: classes, style: inlineStyle, ...rest }, content);
|
|
6317
6573
|
}
|
|
6318
6574
|
);
|
|
6319
6575
|
Stack.displayName = "Stack";
|
|
6320
6576
|
|
|
6321
6577
|
// lib/Grid/Grid.tsx
|
|
6322
|
-
import * as
|
|
6578
|
+
import * as React91 from "react";
|
|
6323
6579
|
function getBreakpointClass(bp, val) {
|
|
6324
6580
|
if (val === void 0) return "";
|
|
6325
6581
|
if (val === true) return `rf-grid-${bp}-12`;
|
|
@@ -6332,7 +6588,7 @@ function getSpacingGap(spacing) {
|
|
|
6332
6588
|
const base = spacing.xs ?? spacing.sm ?? spacing.md ?? 0;
|
|
6333
6589
|
return `${base * 8}px`;
|
|
6334
6590
|
}
|
|
6335
|
-
var Grid =
|
|
6591
|
+
var Grid = React91.forwardRef(
|
|
6336
6592
|
({
|
|
6337
6593
|
container = false,
|
|
6338
6594
|
item = false,
|
|
@@ -6382,14 +6638,14 @@ var Grid = React89.forwardRef(
|
|
|
6382
6638
|
className
|
|
6383
6639
|
].filter(Boolean).join(" ");
|
|
6384
6640
|
const Tag = component;
|
|
6385
|
-
return /* @__PURE__ */
|
|
6641
|
+
return /* @__PURE__ */ React91.createElement(Tag, { ref, className: classes, style: inlineStyle, ...rest }, children);
|
|
6386
6642
|
}
|
|
6387
6643
|
);
|
|
6388
6644
|
Grid.displayName = "Grid";
|
|
6389
6645
|
|
|
6390
6646
|
// lib/Paper/Paper.tsx
|
|
6391
|
-
import * as
|
|
6392
|
-
var Paper =
|
|
6647
|
+
import * as React92 from "react";
|
|
6648
|
+
var Paper = React92.forwardRef(
|
|
6393
6649
|
({
|
|
6394
6650
|
elevation = 1,
|
|
6395
6651
|
square = false,
|
|
@@ -6411,14 +6667,14 @@ var Paper = React90.forwardRef(
|
|
|
6411
6667
|
className
|
|
6412
6668
|
].filter(Boolean).join(" ");
|
|
6413
6669
|
const Tag = component;
|
|
6414
|
-
return /* @__PURE__ */
|
|
6670
|
+
return /* @__PURE__ */ React92.createElement(Tag, { ref, className: classes, style, ...rest }, children);
|
|
6415
6671
|
}
|
|
6416
6672
|
);
|
|
6417
6673
|
Paper.displayName = "Paper";
|
|
6418
6674
|
|
|
6419
6675
|
// lib/Card/Card.tsx
|
|
6420
|
-
import * as
|
|
6421
|
-
var Card =
|
|
6676
|
+
import * as React93 from "react";
|
|
6677
|
+
var Card = React93.forwardRef(
|
|
6422
6678
|
({
|
|
6423
6679
|
elevation = 1,
|
|
6424
6680
|
variant = "elevation",
|
|
@@ -6437,33 +6693,33 @@ var Card = React91.forwardRef(
|
|
|
6437
6693
|
sxClass,
|
|
6438
6694
|
className
|
|
6439
6695
|
].filter(Boolean).join(" ");
|
|
6440
|
-
return /* @__PURE__ */
|
|
6696
|
+
return /* @__PURE__ */ React93.createElement("div", { ref, className: classes, style, ...rest }, children);
|
|
6441
6697
|
}
|
|
6442
6698
|
);
|
|
6443
6699
|
Card.displayName = "Card";
|
|
6444
|
-
var CardContent =
|
|
6700
|
+
var CardContent = React93.forwardRef(
|
|
6445
6701
|
({ children, className, style, sx, ...rest }, ref) => {
|
|
6446
6702
|
const sxClass = useSx(sx);
|
|
6447
6703
|
const classes = ["rf-card-content", sxClass, className].filter(Boolean).join(" ");
|
|
6448
|
-
return /* @__PURE__ */
|
|
6704
|
+
return /* @__PURE__ */ React93.createElement("div", { ref, className: classes, style, ...rest }, children);
|
|
6449
6705
|
}
|
|
6450
6706
|
);
|
|
6451
6707
|
CardContent.displayName = "CardContent";
|
|
6452
|
-
var CardHeader =
|
|
6708
|
+
var CardHeader = React93.forwardRef(
|
|
6453
6709
|
({ title, subheader, avatar, action, className, style, sx, ...rest }, ref) => {
|
|
6454
6710
|
const sxClass = useSx(sx);
|
|
6455
6711
|
const classes = ["rf-card-header", sxClass, className].filter(Boolean).join(" ");
|
|
6456
|
-
return /* @__PURE__ */
|
|
6712
|
+
return /* @__PURE__ */ React93.createElement("div", { ref, className: classes, style, ...rest }, avatar && /* @__PURE__ */ React93.createElement("div", { className: "rf-card-header-avatar" }, avatar), /* @__PURE__ */ React93.createElement("div", { className: "rf-card-header-content" }, /* @__PURE__ */ React93.createElement("div", { className: "rf-card-header-title" }, title), subheader && /* @__PURE__ */ React93.createElement("div", { className: "rf-card-header-subheader" }, subheader)), action && /* @__PURE__ */ React93.createElement("div", { className: "rf-card-header-action" }, action));
|
|
6457
6713
|
}
|
|
6458
6714
|
);
|
|
6459
6715
|
CardHeader.displayName = "CardHeader";
|
|
6460
|
-
var CardMedia =
|
|
6716
|
+
var CardMedia = React93.forwardRef(
|
|
6461
6717
|
({ component = "div", image, src, height, alt, className, style, sx, ...rest }, ref) => {
|
|
6462
6718
|
const sxClass = useSx(sx);
|
|
6463
6719
|
const classes = ["rf-card-media", sxClass, className].filter(Boolean).join(" ");
|
|
6464
6720
|
const computedHeight = height !== void 0 ? typeof height === "number" ? `${height}px` : height : "200px";
|
|
6465
6721
|
if (component === "img") {
|
|
6466
|
-
return /* @__PURE__ */
|
|
6722
|
+
return /* @__PURE__ */ React93.createElement(
|
|
6467
6723
|
"img",
|
|
6468
6724
|
{
|
|
6469
6725
|
ref,
|
|
@@ -6476,7 +6732,7 @@ var CardMedia = React91.forwardRef(
|
|
|
6476
6732
|
);
|
|
6477
6733
|
}
|
|
6478
6734
|
if (component === "video") {
|
|
6479
|
-
return /* @__PURE__ */
|
|
6735
|
+
return /* @__PURE__ */ React93.createElement(
|
|
6480
6736
|
"video",
|
|
6481
6737
|
{
|
|
6482
6738
|
ref,
|
|
@@ -6492,7 +6748,7 @@ var CardMedia = React91.forwardRef(
|
|
|
6492
6748
|
...image ? { backgroundImage: `url(${image})` } : {},
|
|
6493
6749
|
...style
|
|
6494
6750
|
};
|
|
6495
|
-
return /* @__PURE__ */
|
|
6751
|
+
return /* @__PURE__ */ React93.createElement(
|
|
6496
6752
|
"div",
|
|
6497
6753
|
{
|
|
6498
6754
|
ref,
|
|
@@ -6504,7 +6760,7 @@ var CardMedia = React91.forwardRef(
|
|
|
6504
6760
|
}
|
|
6505
6761
|
);
|
|
6506
6762
|
CardMedia.displayName = "CardMedia";
|
|
6507
|
-
var CardActions =
|
|
6763
|
+
var CardActions = React93.forwardRef(
|
|
6508
6764
|
({ disableSpacing = false, children, className, style, sx, ...rest }, ref) => {
|
|
6509
6765
|
const sxClass = useSx(sx);
|
|
6510
6766
|
const classes = [
|
|
@@ -6513,13 +6769,13 @@ var CardActions = React91.forwardRef(
|
|
|
6513
6769
|
sxClass,
|
|
6514
6770
|
className
|
|
6515
6771
|
].filter(Boolean).join(" ");
|
|
6516
|
-
return /* @__PURE__ */
|
|
6772
|
+
return /* @__PURE__ */ React93.createElement("div", { ref, className: classes, style, ...rest }, children);
|
|
6517
6773
|
}
|
|
6518
6774
|
);
|
|
6519
6775
|
CardActions.displayName = "CardActions";
|
|
6520
6776
|
|
|
6521
6777
|
// lib/Accordion/Accordion.tsx
|
|
6522
|
-
import * as
|
|
6778
|
+
import * as React94 from "react";
|
|
6523
6779
|
import { useState as useState15, useContext as useContext4, createContext as createContext4 } from "react";
|
|
6524
6780
|
var AccordionContext = createContext4({
|
|
6525
6781
|
expanded: false,
|
|
@@ -6527,7 +6783,7 @@ var AccordionContext = createContext4({
|
|
|
6527
6783
|
toggle: () => {
|
|
6528
6784
|
}
|
|
6529
6785
|
});
|
|
6530
|
-
var Accordion =
|
|
6786
|
+
var Accordion = React94.forwardRef(
|
|
6531
6787
|
({
|
|
6532
6788
|
expanded: expandedProp,
|
|
6533
6789
|
defaultExpanded = false,
|
|
@@ -6562,11 +6818,11 @@ var Accordion = React92.forwardRef(
|
|
|
6562
6818
|
sxClass,
|
|
6563
6819
|
className
|
|
6564
6820
|
].filter(Boolean).join(" ");
|
|
6565
|
-
return /* @__PURE__ */
|
|
6821
|
+
return /* @__PURE__ */ React94.createElement(AccordionContext.Provider, { value: { expanded, disabled, toggle } }, /* @__PURE__ */ React94.createElement("div", { ref, className: classes, style, ...rest }, children));
|
|
6566
6822
|
}
|
|
6567
6823
|
);
|
|
6568
6824
|
Accordion.displayName = "Accordion";
|
|
6569
|
-
var ChevronIcon = () => /* @__PURE__ */
|
|
6825
|
+
var ChevronIcon = () => /* @__PURE__ */ React94.createElement(
|
|
6570
6826
|
"svg",
|
|
6571
6827
|
{
|
|
6572
6828
|
xmlns: "http://www.w3.org/2000/svg",
|
|
@@ -6580,9 +6836,9 @@ var ChevronIcon = () => /* @__PURE__ */ React92.createElement(
|
|
|
6580
6836
|
strokeLinejoin: "round",
|
|
6581
6837
|
"aria-hidden": "true"
|
|
6582
6838
|
},
|
|
6583
|
-
/* @__PURE__ */
|
|
6839
|
+
/* @__PURE__ */ React94.createElement("polyline", { points: "6 9 12 15 18 9" })
|
|
6584
6840
|
);
|
|
6585
|
-
var AccordionSummary =
|
|
6841
|
+
var AccordionSummary = React94.forwardRef(
|
|
6586
6842
|
({ expandIcon, children, sx, className, style, ...rest }, ref) => {
|
|
6587
6843
|
const sxClass = useSx(sx);
|
|
6588
6844
|
const { expanded, toggle, disabled } = useContext4(AccordionContext);
|
|
@@ -6596,7 +6852,7 @@ var AccordionSummary = React92.forwardRef(
|
|
|
6596
6852
|
"rf-accordion-summary-icon",
|
|
6597
6853
|
expanded ? "rf-accordion-icon-expanded" : ""
|
|
6598
6854
|
].filter(Boolean).join(" ");
|
|
6599
|
-
return /* @__PURE__ */
|
|
6855
|
+
return /* @__PURE__ */ React94.createElement(
|
|
6600
6856
|
"button",
|
|
6601
6857
|
{
|
|
6602
6858
|
ref,
|
|
@@ -6608,13 +6864,13 @@ var AccordionSummary = React92.forwardRef(
|
|
|
6608
6864
|
"aria-expanded": expanded,
|
|
6609
6865
|
...rest
|
|
6610
6866
|
},
|
|
6611
|
-
/* @__PURE__ */
|
|
6612
|
-
/* @__PURE__ */
|
|
6867
|
+
/* @__PURE__ */ React94.createElement("span", { className: "rf-accordion-summary-content" }, children),
|
|
6868
|
+
/* @__PURE__ */ React94.createElement("span", { className: iconClasses }, expandIcon !== void 0 ? expandIcon : /* @__PURE__ */ React94.createElement(ChevronIcon, null))
|
|
6613
6869
|
);
|
|
6614
6870
|
}
|
|
6615
6871
|
);
|
|
6616
6872
|
AccordionSummary.displayName = "AccordionSummary";
|
|
6617
|
-
var AccordionDetails =
|
|
6873
|
+
var AccordionDetails = React94.forwardRef(
|
|
6618
6874
|
({ children, sx, className, style, ...rest }, ref) => {
|
|
6619
6875
|
const sxClass = useSx(sx);
|
|
6620
6876
|
const { expanded } = useContext4(AccordionContext);
|
|
@@ -6627,13 +6883,13 @@ var AccordionDetails = React92.forwardRef(
|
|
|
6627
6883
|
sxClass,
|
|
6628
6884
|
className
|
|
6629
6885
|
].filter(Boolean).join(" ");
|
|
6630
|
-
return /* @__PURE__ */
|
|
6886
|
+
return /* @__PURE__ */ React94.createElement("div", { className: wrapperClasses }, /* @__PURE__ */ React94.createElement("div", { className: "rf-accordion-details-inner" }, /* @__PURE__ */ React94.createElement("div", { ref, className: detailsClasses, style, ...rest }, children)));
|
|
6631
6887
|
}
|
|
6632
6888
|
);
|
|
6633
6889
|
AccordionDetails.displayName = "AccordionDetails";
|
|
6634
6890
|
|
|
6635
6891
|
// lib/Tabs/Tabs.tsx
|
|
6636
|
-
import
|
|
6892
|
+
import React95, {
|
|
6637
6893
|
useEffect as useEffect12,
|
|
6638
6894
|
useLayoutEffect,
|
|
6639
6895
|
useRef as useRef16,
|
|
@@ -6668,7 +6924,7 @@ var Tab = ({
|
|
|
6668
6924
|
_onClick(value);
|
|
6669
6925
|
}
|
|
6670
6926
|
};
|
|
6671
|
-
return /* @__PURE__ */
|
|
6927
|
+
return /* @__PURE__ */ React95.createElement(
|
|
6672
6928
|
"button",
|
|
6673
6929
|
{
|
|
6674
6930
|
ref: _tabRef,
|
|
@@ -6680,9 +6936,9 @@ var Tab = ({
|
|
|
6680
6936
|
"aria-disabled": disabled,
|
|
6681
6937
|
type: "button"
|
|
6682
6938
|
},
|
|
6683
|
-
icon && (iconPosition === "top" || iconPosition === "start") && /* @__PURE__ */
|
|
6939
|
+
icon && (iconPosition === "top" || iconPosition === "start") && /* @__PURE__ */ React95.createElement("span", { className: "rf-tab__icon" }, icon),
|
|
6684
6940
|
label,
|
|
6685
|
-
icon && (iconPosition === "bottom" || iconPosition === "end") && /* @__PURE__ */
|
|
6941
|
+
icon && (iconPosition === "bottom" || iconPosition === "end") && /* @__PURE__ */ React95.createElement("span", { className: "rf-tab__icon" }, icon)
|
|
6686
6942
|
);
|
|
6687
6943
|
};
|
|
6688
6944
|
Tab.displayName = "Tab";
|
|
@@ -6769,7 +7025,7 @@ var Tabs = ({
|
|
|
6769
7025
|
}
|
|
6770
7026
|
});
|
|
6771
7027
|
});
|
|
6772
|
-
return /* @__PURE__ */
|
|
7028
|
+
return /* @__PURE__ */ React95.createElement("div", { className: rootClasses, style, role: "tablist" }, /* @__PURE__ */ React95.createElement(
|
|
6773
7029
|
"div",
|
|
6774
7030
|
{
|
|
6775
7031
|
ref: tabsListRef,
|
|
@@ -6777,7 +7033,7 @@ var Tabs = ({
|
|
|
6777
7033
|
style: centered ? { justifyContent: "center" } : void 0
|
|
6778
7034
|
},
|
|
6779
7035
|
enrichedChildren,
|
|
6780
|
-
/* @__PURE__ */
|
|
7036
|
+
/* @__PURE__ */ React95.createElement(
|
|
6781
7037
|
"span",
|
|
6782
7038
|
{
|
|
6783
7039
|
className: "rf-tabs__indicator",
|
|
@@ -6788,9 +7044,33 @@ var Tabs = ({
|
|
|
6788
7044
|
));
|
|
6789
7045
|
};
|
|
6790
7046
|
Tabs.displayName = "Tabs";
|
|
7047
|
+
var TabPanel = ({
|
|
7048
|
+
value,
|
|
7049
|
+
activeValue,
|
|
7050
|
+
children,
|
|
7051
|
+
keepMounted = false,
|
|
7052
|
+
className = "",
|
|
7053
|
+
style,
|
|
7054
|
+
sx
|
|
7055
|
+
}) => {
|
|
7056
|
+
const sxClass = useSx(sx);
|
|
7057
|
+
const isActive = value === activeValue;
|
|
7058
|
+
if (!isActive && !keepMounted) return null;
|
|
7059
|
+
return /* @__PURE__ */ React95.createElement(
|
|
7060
|
+
"div",
|
|
7061
|
+
{
|
|
7062
|
+
role: "tabpanel",
|
|
7063
|
+
hidden: !isActive,
|
|
7064
|
+
className: ["rf-tab-panel", sxClass, className].filter(Boolean).join(" "),
|
|
7065
|
+
style
|
|
7066
|
+
},
|
|
7067
|
+
isActive && children
|
|
7068
|
+
);
|
|
7069
|
+
};
|
|
7070
|
+
TabPanel.displayName = "TabPanel";
|
|
6791
7071
|
|
|
6792
7072
|
// lib/Breadcrumbs/Breadcrumbs.tsx
|
|
6793
|
-
import
|
|
7073
|
+
import React96, {
|
|
6794
7074
|
Children as Children3,
|
|
6795
7075
|
useState as useState17
|
|
6796
7076
|
} from "react";
|
|
@@ -6816,7 +7096,7 @@ var Breadcrumbs = ({
|
|
|
6816
7096
|
const after = childArray.slice(totalItems - itemsAfterCollapse);
|
|
6817
7097
|
itemsToRender = [
|
|
6818
7098
|
...before,
|
|
6819
|
-
/* @__PURE__ */
|
|
7099
|
+
/* @__PURE__ */ React96.createElement(
|
|
6820
7100
|
"button",
|
|
6821
7101
|
{
|
|
6822
7102
|
key: "collapse-btn",
|
|
@@ -6833,15 +7113,15 @@ var Breadcrumbs = ({
|
|
|
6833
7113
|
itemsToRender = childArray;
|
|
6834
7114
|
}
|
|
6835
7115
|
const classes = ["rf-breadcrumbs", sxClass, className].filter(Boolean).join(" ");
|
|
6836
|
-
return /* @__PURE__ */
|
|
7116
|
+
return /* @__PURE__ */ React96.createElement("nav", { "aria-label": ariaLabel }, /* @__PURE__ */ React96.createElement("ol", { className: classes, style }, itemsToRender.map((item, index) => {
|
|
6837
7117
|
const isLast = index === itemsToRender.length - 1;
|
|
6838
|
-
return /* @__PURE__ */
|
|
7118
|
+
return /* @__PURE__ */ React96.createElement(React96.Fragment, { key: index }, /* @__PURE__ */ React96.createElement(
|
|
6839
7119
|
"li",
|
|
6840
7120
|
{
|
|
6841
7121
|
className: `rf-breadcrumbs__item${isLast ? " rf-breadcrumbs__current" : ""}`
|
|
6842
7122
|
},
|
|
6843
7123
|
item
|
|
6844
|
-
), !isLast && /* @__PURE__ */
|
|
7124
|
+
), !isLast && /* @__PURE__ */ React96.createElement(
|
|
6845
7125
|
"li",
|
|
6846
7126
|
{
|
|
6847
7127
|
className: "rf-breadcrumbs__separator",
|
|
@@ -6854,7 +7134,7 @@ var Breadcrumbs = ({
|
|
|
6854
7134
|
Breadcrumbs.displayName = "Breadcrumbs";
|
|
6855
7135
|
|
|
6856
7136
|
// lib/Stepper/Stepper.tsx
|
|
6857
|
-
import
|
|
7137
|
+
import React97, {
|
|
6858
7138
|
Children as Children4,
|
|
6859
7139
|
cloneElement as cloneElement2,
|
|
6860
7140
|
isValidElement as isValidElement2
|
|
@@ -6871,7 +7151,7 @@ var DefaultStepIcon = ({
|
|
|
6871
7151
|
completed ? "rf-step-icon--completed" : "",
|
|
6872
7152
|
error ? "rf-step-icon--error" : ""
|
|
6873
7153
|
].filter(Boolean).join(" ");
|
|
6874
|
-
return /* @__PURE__ */
|
|
7154
|
+
return /* @__PURE__ */ React97.createElement("div", { className: classes }, completed ? "\u2713" : error ? "!" : icon);
|
|
6875
7155
|
};
|
|
6876
7156
|
var StepLabel = ({
|
|
6877
7157
|
icon,
|
|
@@ -6893,7 +7173,7 @@ var StepLabel = ({
|
|
|
6893
7173
|
_completed ? "rf-step-label__title--completed" : "",
|
|
6894
7174
|
error ? "rf-step-label__title--error" : ""
|
|
6895
7175
|
].filter(Boolean).join(" ");
|
|
6896
|
-
return /* @__PURE__ */
|
|
7176
|
+
return /* @__PURE__ */ React97.createElement("div", { className: `rf-step-label${sxClass ? ` ${sxClass}` : ""}` }, /* @__PURE__ */ React97.createElement("div", { className: "rf-step-label__icon-container" }, icon ? icon : /* @__PURE__ */ React97.createElement(
|
|
6897
7177
|
IconComp,
|
|
6898
7178
|
{
|
|
6899
7179
|
active: _active,
|
|
@@ -6901,7 +7181,7 @@ var StepLabel = ({
|
|
|
6901
7181
|
error,
|
|
6902
7182
|
icon: _stepIndex + 1
|
|
6903
7183
|
}
|
|
6904
|
-
)), /* @__PURE__ */
|
|
7184
|
+
)), /* @__PURE__ */ React97.createElement("div", { className: "rf-step-label__text" }, /* @__PURE__ */ React97.createElement("span", { className: titleClasses }, children), optional && /* @__PURE__ */ React97.createElement("span", { className: "rf-step-label__optional" }, optional)));
|
|
6905
7185
|
};
|
|
6906
7186
|
StepLabel.displayName = "StepLabel";
|
|
6907
7187
|
var StepContent = ({
|
|
@@ -6910,7 +7190,7 @@ var StepContent = ({
|
|
|
6910
7190
|
_isLast = false
|
|
6911
7191
|
}) => {
|
|
6912
7192
|
const sxClass = useSx(sx);
|
|
6913
|
-
return /* @__PURE__ */
|
|
7193
|
+
return /* @__PURE__ */ React97.createElement(
|
|
6914
7194
|
"div",
|
|
6915
7195
|
{
|
|
6916
7196
|
className: [
|
|
@@ -6930,7 +7210,7 @@ var StepButton = ({
|
|
|
6930
7210
|
_disabled = false
|
|
6931
7211
|
}) => {
|
|
6932
7212
|
const sxClass = useSx(sx);
|
|
6933
|
-
return /* @__PURE__ */
|
|
7213
|
+
return /* @__PURE__ */ React97.createElement(
|
|
6934
7214
|
"button",
|
|
6935
7215
|
{
|
|
6936
7216
|
className: `rf-step-button${sxClass ? ` ${sxClass}` : ""}`,
|
|
@@ -6978,7 +7258,7 @@ var Step = ({
|
|
|
6978
7258
|
}
|
|
6979
7259
|
return child;
|
|
6980
7260
|
});
|
|
6981
|
-
return /* @__PURE__ */
|
|
7261
|
+
return /* @__PURE__ */ React97.createElement(
|
|
6982
7262
|
"div",
|
|
6983
7263
|
{
|
|
6984
7264
|
className: `rf-step${sxClass ? ` ${sxClass}` : ""}`,
|
|
@@ -6993,7 +7273,7 @@ Step.displayName = "Step";
|
|
|
6993
7273
|
var DefaultConnector = ({
|
|
6994
7274
|
completed,
|
|
6995
7275
|
active
|
|
6996
|
-
}) => /* @__PURE__ */
|
|
7276
|
+
}) => /* @__PURE__ */ React97.createElement(
|
|
6997
7277
|
"div",
|
|
6998
7278
|
{
|
|
6999
7279
|
className: [
|
|
@@ -7002,7 +7282,7 @@ var DefaultConnector = ({
|
|
|
7002
7282
|
active ? "rf-step-connector--active" : ""
|
|
7003
7283
|
].filter(Boolean).join(" ")
|
|
7004
7284
|
},
|
|
7005
|
-
/* @__PURE__ */
|
|
7285
|
+
/* @__PURE__ */ React97.createElement("span", { className: "rf-step-connector__line" })
|
|
7006
7286
|
);
|
|
7007
7287
|
var Stepper = ({
|
|
7008
7288
|
activeStep = 0,
|
|
@@ -7025,7 +7305,7 @@ var Stepper = ({
|
|
|
7025
7305
|
sxClass,
|
|
7026
7306
|
className
|
|
7027
7307
|
].filter(Boolean).join(" ");
|
|
7028
|
-
return /* @__PURE__ */
|
|
7308
|
+
return /* @__PURE__ */ React97.createElement("div", { className: classes, style }, childArray.map((child, index) => {
|
|
7029
7309
|
const isActive = index === activeStep;
|
|
7030
7310
|
const isCompleted = nonLinear ? child.props.completed ?? false : index < activeStep;
|
|
7031
7311
|
const isLast = index === totalSteps - 1;
|
|
@@ -7038,7 +7318,7 @@ var Stepper = ({
|
|
|
7038
7318
|
last: isLast
|
|
7039
7319
|
}
|
|
7040
7320
|
);
|
|
7041
|
-
const connectorEl = index > 0 ? connector ? connector : /* @__PURE__ */
|
|
7321
|
+
const connectorEl = index > 0 ? connector ? connector : /* @__PURE__ */ React97.createElement(
|
|
7042
7322
|
DefaultConnector,
|
|
7043
7323
|
{
|
|
7044
7324
|
key: `connector-${index}`,
|
|
@@ -7047,9 +7327,9 @@ var Stepper = ({
|
|
|
7047
7327
|
}
|
|
7048
7328
|
) : null;
|
|
7049
7329
|
if (orientation === "horizontal") {
|
|
7050
|
-
return /* @__PURE__ */
|
|
7330
|
+
return /* @__PURE__ */ React97.createElement(React97.Fragment, { key: index }, connectorEl, enrichedStep);
|
|
7051
7331
|
}
|
|
7052
|
-
return /* @__PURE__ */
|
|
7332
|
+
return /* @__PURE__ */ React97.createElement(React97.Fragment, { key: index }, /* @__PURE__ */ React97.createElement("div", { className: "rf-step__header" }, enrichedStep), !isLast && /* @__PURE__ */ React97.createElement(
|
|
7053
7333
|
DefaultConnector,
|
|
7054
7334
|
{
|
|
7055
7335
|
completed: index < activeStep,
|
|
@@ -7061,13 +7341,13 @@ var Stepper = ({
|
|
|
7061
7341
|
Stepper.displayName = "Stepper";
|
|
7062
7342
|
|
|
7063
7343
|
// lib/Menu/Menu.tsx
|
|
7064
|
-
import
|
|
7344
|
+
import React98, {
|
|
7065
7345
|
useEffect as useEffect13,
|
|
7066
7346
|
useRef as useRef17,
|
|
7067
7347
|
useState as useState18
|
|
7068
7348
|
} from "react";
|
|
7069
7349
|
import ReactDOM2 from "react-dom";
|
|
7070
|
-
var MenuDivider = () => /* @__PURE__ */
|
|
7350
|
+
var MenuDivider = () => /* @__PURE__ */ React98.createElement("hr", { className: "rf-menu-divider", "aria-hidden": "true" });
|
|
7071
7351
|
MenuDivider.displayName = "MenuDivider";
|
|
7072
7352
|
var MenuItem = ({
|
|
7073
7353
|
onClick,
|
|
@@ -7088,7 +7368,7 @@ var MenuItem = ({
|
|
|
7088
7368
|
divider ? "rf-menu-item--divider" : "",
|
|
7089
7369
|
sxClass
|
|
7090
7370
|
].filter(Boolean).join(" ");
|
|
7091
|
-
return /* @__PURE__ */
|
|
7371
|
+
return /* @__PURE__ */ React98.createElement(
|
|
7092
7372
|
"li",
|
|
7093
7373
|
{
|
|
7094
7374
|
className: classes,
|
|
@@ -7103,7 +7383,7 @@ var MenuItem = ({
|
|
|
7103
7383
|
}
|
|
7104
7384
|
}
|
|
7105
7385
|
},
|
|
7106
|
-
icon && /* @__PURE__ */
|
|
7386
|
+
icon && /* @__PURE__ */ React98.createElement("span", { className: "rf-menu-item__icon" }, icon),
|
|
7107
7387
|
children
|
|
7108
7388
|
);
|
|
7109
7389
|
};
|
|
@@ -7115,17 +7395,17 @@ var MenuList = ({
|
|
|
7115
7395
|
sx
|
|
7116
7396
|
}) => {
|
|
7117
7397
|
const sxClass = useSx(sx);
|
|
7118
|
-
return /* @__PURE__ */
|
|
7398
|
+
return /* @__PURE__ */ React98.createElement(
|
|
7119
7399
|
"ul",
|
|
7120
7400
|
{
|
|
7121
7401
|
className: `rf-menu-list${sxClass ? ` ${sxClass}` : ""}`,
|
|
7122
7402
|
role: "menu"
|
|
7123
7403
|
},
|
|
7124
|
-
subheader && /* @__PURE__ */
|
|
7125
|
-
|
|
7126
|
-
if (!
|
|
7404
|
+
subheader && /* @__PURE__ */ React98.createElement("li", { className: "rf-menu-list__subheader", role: "presentation" }, subheader),
|
|
7405
|
+
React98.Children.map(children, (child) => {
|
|
7406
|
+
if (!React98.isValidElement(child)) return child;
|
|
7127
7407
|
if (dense) {
|
|
7128
|
-
return
|
|
7408
|
+
return React98.cloneElement(child, {
|
|
7129
7409
|
dense: true
|
|
7130
7410
|
});
|
|
7131
7411
|
}
|
|
@@ -7202,14 +7482,14 @@ var Menu = ({
|
|
|
7202
7482
|
}, [open, onClose]);
|
|
7203
7483
|
if (!mounted) return null;
|
|
7204
7484
|
const classes = ["rf-menu-paper", sxClass, className].filter(Boolean).join(" ");
|
|
7205
|
-
const portal = /* @__PURE__ */
|
|
7485
|
+
const portal = /* @__PURE__ */ React98.createElement("div", { className: "rf-menu-portal", style: { display: open ? void 0 : "none" } }, /* @__PURE__ */ React98.createElement(
|
|
7206
7486
|
"div",
|
|
7207
7487
|
{
|
|
7208
7488
|
className: "rf-menu-backdrop",
|
|
7209
7489
|
onClick: onClose,
|
|
7210
7490
|
"aria-hidden": "true"
|
|
7211
7491
|
}
|
|
7212
|
-
), /* @__PURE__ */
|
|
7492
|
+
), /* @__PURE__ */ React98.createElement(
|
|
7213
7493
|
"div",
|
|
7214
7494
|
{
|
|
7215
7495
|
ref: paperRef,
|
|
@@ -7224,7 +7504,7 @@ var Menu = ({
|
|
|
7224
7504
|
Menu.displayName = "Menu";
|
|
7225
7505
|
|
|
7226
7506
|
// lib/Drawer/Drawer.tsx
|
|
7227
|
-
import
|
|
7507
|
+
import React99, {
|
|
7228
7508
|
useEffect as useEffect14,
|
|
7229
7509
|
useState as useState19
|
|
7230
7510
|
} from "react";
|
|
@@ -7292,7 +7572,7 @@ var Drawer = ({
|
|
|
7292
7572
|
className
|
|
7293
7573
|
].filter(Boolean).join(" ");
|
|
7294
7574
|
if (variant === "permanent") {
|
|
7295
|
-
return /* @__PURE__ */
|
|
7575
|
+
return /* @__PURE__ */ React99.createElement("div", { className: rootClasses, style }, /* @__PURE__ */ React99.createElement(
|
|
7296
7576
|
"div",
|
|
7297
7577
|
{
|
|
7298
7578
|
className: paperClasses,
|
|
@@ -7302,7 +7582,7 @@ var Drawer = ({
|
|
|
7302
7582
|
));
|
|
7303
7583
|
}
|
|
7304
7584
|
if (variant === "persistent") {
|
|
7305
|
-
return /* @__PURE__ */
|
|
7585
|
+
return /* @__PURE__ */ React99.createElement("div", { className: rootClasses, style }, /* @__PURE__ */ React99.createElement(
|
|
7306
7586
|
"div",
|
|
7307
7587
|
{
|
|
7308
7588
|
className: paperClasses,
|
|
@@ -7311,14 +7591,14 @@ var Drawer = ({
|
|
|
7311
7591
|
children
|
|
7312
7592
|
));
|
|
7313
7593
|
}
|
|
7314
|
-
const drawerContent = /* @__PURE__ */
|
|
7594
|
+
const drawerContent = /* @__PURE__ */ React99.createElement(React99.Fragment, null, /* @__PURE__ */ React99.createElement(
|
|
7315
7595
|
"div",
|
|
7316
7596
|
{
|
|
7317
7597
|
className: `rf-drawer-backdrop${!open ? " rf-drawer-backdrop--hidden" : ""}`,
|
|
7318
7598
|
onClick: onClose,
|
|
7319
7599
|
"aria-hidden": "true"
|
|
7320
7600
|
}
|
|
7321
|
-
), /* @__PURE__ */
|
|
7601
|
+
), /* @__PURE__ */ React99.createElement(
|
|
7322
7602
|
"div",
|
|
7323
7603
|
{
|
|
7324
7604
|
className: paperClasses,
|
|
@@ -7329,14 +7609,14 @@ var Drawer = ({
|
|
|
7329
7609
|
children
|
|
7330
7610
|
));
|
|
7331
7611
|
return ReactDOM3.createPortal(
|
|
7332
|
-
/* @__PURE__ */
|
|
7612
|
+
/* @__PURE__ */ React99.createElement("div", { className: rootClasses, style }, drawerContent),
|
|
7333
7613
|
document.body
|
|
7334
7614
|
);
|
|
7335
7615
|
};
|
|
7336
7616
|
Drawer.displayName = "Drawer";
|
|
7337
7617
|
|
|
7338
7618
|
// lib/Snackbar/Snackbar.tsx
|
|
7339
|
-
import
|
|
7619
|
+
import React100, {
|
|
7340
7620
|
useCallback as useCallback6,
|
|
7341
7621
|
useEffect as useEffect15,
|
|
7342
7622
|
useRef as useRef18,
|
|
@@ -7422,7 +7702,7 @@ var Snackbar = ({
|
|
|
7422
7702
|
].filter(Boolean).join(" ");
|
|
7423
7703
|
const rootClasses = ["rf-snackbar-root", anchorClass].filter(Boolean).join(" ");
|
|
7424
7704
|
const icon = severity !== "default" ? SEVERITY_ICONS[severity] : null;
|
|
7425
|
-
const snackbarEl = /* @__PURE__ */
|
|
7705
|
+
const snackbarEl = /* @__PURE__ */ React100.createElement("div", { className: rootClasses }, /* @__PURE__ */ React100.createElement(
|
|
7426
7706
|
"div",
|
|
7427
7707
|
{
|
|
7428
7708
|
className: snackbarClasses,
|
|
@@ -7433,10 +7713,10 @@ var Snackbar = ({
|
|
|
7433
7713
|
onMouseEnter: handleMouseEnter,
|
|
7434
7714
|
onMouseLeave: handleMouseLeave
|
|
7435
7715
|
},
|
|
7436
|
-
icon && severity !== "default" && /* @__PURE__ */
|
|
7437
|
-
/* @__PURE__ */
|
|
7438
|
-
action && /* @__PURE__ */
|
|
7439
|
-
!action && onClose && /* @__PURE__ */
|
|
7716
|
+
icon && severity !== "default" && /* @__PURE__ */ React100.createElement("span", { className: "rf-snackbar__icon", "aria-hidden": "true" }, icon),
|
|
7717
|
+
/* @__PURE__ */ React100.createElement("span", { className: "rf-snackbar__message" }, message),
|
|
7718
|
+
action && /* @__PURE__ */ React100.createElement("span", { className: "rf-snackbar__action" }, action),
|
|
7719
|
+
!action && onClose && /* @__PURE__ */ React100.createElement(
|
|
7440
7720
|
"button",
|
|
7441
7721
|
{
|
|
7442
7722
|
className: "rf-snackbar__close-btn",
|
|
@@ -7452,7 +7732,7 @@ var Snackbar = ({
|
|
|
7452
7732
|
Snackbar.displayName = "Snackbar";
|
|
7453
7733
|
|
|
7454
7734
|
// lib/Link/Link.tsx
|
|
7455
|
-
import
|
|
7735
|
+
import React101 from "react";
|
|
7456
7736
|
var KNOWN_COLORS = ["primary", "secondary", "textPrimary", "textSecondary", "inherit"];
|
|
7457
7737
|
var Link = ({
|
|
7458
7738
|
href,
|
|
@@ -7483,7 +7763,7 @@ var Link = ({
|
|
|
7483
7763
|
};
|
|
7484
7764
|
const Tag = component || "a";
|
|
7485
7765
|
const computedRel = rel ?? (target === "_blank" ? "noopener noreferrer" : void 0);
|
|
7486
|
-
return /* @__PURE__ */
|
|
7766
|
+
return /* @__PURE__ */ React101.createElement(
|
|
7487
7767
|
Tag,
|
|
7488
7768
|
{
|
|
7489
7769
|
href,
|
|
@@ -7500,7 +7780,7 @@ var Link = ({
|
|
|
7500
7780
|
Link.displayName = "Link";
|
|
7501
7781
|
|
|
7502
7782
|
// lib/Popper/Popper.tsx
|
|
7503
|
-
import
|
|
7783
|
+
import React102, {
|
|
7504
7784
|
useEffect as useEffect16,
|
|
7505
7785
|
useLayoutEffect as useLayoutEffect2,
|
|
7506
7786
|
useRef as useRef19,
|
|
@@ -7636,7 +7916,7 @@ var Popper = ({
|
|
|
7636
7916
|
const content = typeof children === "function" ? children(
|
|
7637
7917
|
{ placement, TransitionProps: transitionProps }
|
|
7638
7918
|
) : children;
|
|
7639
|
-
const popper = /* @__PURE__ */
|
|
7919
|
+
const popper = /* @__PURE__ */ React102.createElement(
|
|
7640
7920
|
"div",
|
|
7641
7921
|
{
|
|
7642
7922
|
ref: popperRef,
|
|
@@ -7647,14 +7927,14 @@ var Popper = ({
|
|
|
7647
7927
|
content
|
|
7648
7928
|
);
|
|
7649
7929
|
if (disablePortal) {
|
|
7650
|
-
return /* @__PURE__ */
|
|
7930
|
+
return /* @__PURE__ */ React102.createElement(React102.Fragment, null, popper);
|
|
7651
7931
|
}
|
|
7652
7932
|
return ReactDOM5.createPortal(popper, document.body);
|
|
7653
7933
|
};
|
|
7654
7934
|
Popper.displayName = "Popper";
|
|
7655
7935
|
|
|
7656
7936
|
// lib/Popover/Popover.tsx
|
|
7657
|
-
import
|
|
7937
|
+
import React103, {
|
|
7658
7938
|
useEffect as useEffect17,
|
|
7659
7939
|
useLayoutEffect as useLayoutEffect3,
|
|
7660
7940
|
useRef as useRef20,
|
|
@@ -7738,14 +8018,14 @@ var Popover = ({
|
|
|
7738
8018
|
paperSxClass
|
|
7739
8019
|
].filter(Boolean).join(" ");
|
|
7740
8020
|
const rootClasses = ["rf-popover-root", sxClass, className].filter(Boolean).join(" ");
|
|
7741
|
-
const content = /* @__PURE__ */
|
|
8021
|
+
const content = /* @__PURE__ */ React103.createElement(React103.Fragment, null, /* @__PURE__ */ React103.createElement(
|
|
7742
8022
|
"div",
|
|
7743
8023
|
{
|
|
7744
8024
|
className: "rf-popover-backdrop",
|
|
7745
8025
|
onClick: onClose,
|
|
7746
8026
|
"aria-hidden": "true"
|
|
7747
8027
|
}
|
|
7748
|
-
), /* @__PURE__ */
|
|
8028
|
+
), /* @__PURE__ */ React103.createElement(
|
|
7749
8029
|
"div",
|
|
7750
8030
|
{
|
|
7751
8031
|
ref: paperRef,
|
|
@@ -7761,17 +8041,17 @@ var Popover = ({
|
|
|
7761
8041
|
children
|
|
7762
8042
|
));
|
|
7763
8043
|
if (disablePortal) {
|
|
7764
|
-
return /* @__PURE__ */
|
|
8044
|
+
return /* @__PURE__ */ React103.createElement("div", { className: `${rootClasses} rf-popover-inline`, style }, content);
|
|
7765
8045
|
}
|
|
7766
8046
|
return ReactDOM6.createPortal(
|
|
7767
|
-
/* @__PURE__ */
|
|
8047
|
+
/* @__PURE__ */ React103.createElement("div", { className: rootClasses, style }, content),
|
|
7768
8048
|
document.body
|
|
7769
8049
|
);
|
|
7770
8050
|
};
|
|
7771
8051
|
Popover.displayName = "Popover";
|
|
7772
8052
|
|
|
7773
8053
|
// lib/Transitions/Transitions.tsx
|
|
7774
|
-
import
|
|
8054
|
+
import React104, {
|
|
7775
8055
|
cloneElement as cloneElement3,
|
|
7776
8056
|
useEffect as useEffect18,
|
|
7777
8057
|
useRef as useRef21,
|
|
@@ -7949,7 +8229,7 @@ var Collapse = ({
|
|
|
7949
8229
|
const exitMs = getTimeout(timeout, "exit");
|
|
7950
8230
|
const dur = state === "entering" || state === "entered" ? enterMs : exitMs;
|
|
7951
8231
|
const containerStyle = orientation === "vertical" ? { height: size === "auto" ? "auto" : typeof size === "number" ? `${size}px` : size } : { width: size === "auto" ? "auto" : typeof size === "number" ? `${size}px` : size };
|
|
7952
|
-
return /* @__PURE__ */
|
|
8232
|
+
return /* @__PURE__ */ React104.createElement(
|
|
7953
8233
|
"div",
|
|
7954
8234
|
{
|
|
7955
8235
|
className: [
|
|
@@ -7962,7 +8242,7 @@ var Collapse = ({
|
|
|
7962
8242
|
...containerStyle
|
|
7963
8243
|
}
|
|
7964
8244
|
},
|
|
7965
|
-
/* @__PURE__ */
|
|
8245
|
+
/* @__PURE__ */ React104.createElement(
|
|
7966
8246
|
"div",
|
|
7967
8247
|
{
|
|
7968
8248
|
ref: innerRef,
|
|
@@ -8003,7 +8283,7 @@ var Zoom = ({
|
|
|
8003
8283
|
Zoom.displayName = "Zoom";
|
|
8004
8284
|
|
|
8005
8285
|
// lib/ImageField/ImageField.tsx
|
|
8006
|
-
import
|
|
8286
|
+
import React105, { useRef as useRef22, useState as useState24, useCallback as useCallback7 } from "react";
|
|
8007
8287
|
function getSizeStyle2(size) {
|
|
8008
8288
|
if (size === "small") return { className: "rf-image-field--small" };
|
|
8009
8289
|
if (size === "large") return { className: "rf-image-field--large" };
|
|
@@ -8015,7 +8295,7 @@ function getSizeStyle2(size) {
|
|
|
8015
8295
|
}
|
|
8016
8296
|
return { className: "rf-image-field--medium" };
|
|
8017
8297
|
}
|
|
8018
|
-
var ImageField =
|
|
8298
|
+
var ImageField = React105.forwardRef(
|
|
8019
8299
|
({
|
|
8020
8300
|
src,
|
|
8021
8301
|
alt = "",
|
|
@@ -8068,7 +8348,7 @@ var ImageField = React103.forwardRef(
|
|
|
8068
8348
|
className
|
|
8069
8349
|
].filter(Boolean).join(" ");
|
|
8070
8350
|
const iconSize = typeof size === "number" ? Math.max(size * 0.25, 16) : size === "small" ? 16 : size === "large" ? 28 : 22;
|
|
8071
|
-
return /* @__PURE__ */
|
|
8351
|
+
return /* @__PURE__ */ React105.createElement(
|
|
8072
8352
|
"div",
|
|
8073
8353
|
{
|
|
8074
8354
|
ref,
|
|
@@ -8080,14 +8360,14 @@ var ImageField = React103.forwardRef(
|
|
|
8080
8360
|
onClick: handleClick,
|
|
8081
8361
|
onKeyDown: handleKeyDown
|
|
8082
8362
|
},
|
|
8083
|
-
displaySrc ? /* @__PURE__ */
|
|
8363
|
+
displaySrc ? /* @__PURE__ */ React105.createElement(
|
|
8084
8364
|
"img",
|
|
8085
8365
|
{
|
|
8086
8366
|
src: displaySrc,
|
|
8087
8367
|
alt,
|
|
8088
8368
|
className: "rf-image-field__img"
|
|
8089
8369
|
}
|
|
8090
|
-
) : /* @__PURE__ */
|
|
8370
|
+
) : /* @__PURE__ */ React105.createElement("div", { className: "rf-image-field__placeholder" }, /* @__PURE__ */ React105.createElement(
|
|
8091
8371
|
cameraIcon_default,
|
|
8092
8372
|
{
|
|
8093
8373
|
width: iconSize,
|
|
@@ -8095,8 +8375,8 @@ var ImageField = React103.forwardRef(
|
|
|
8095
8375
|
color: "var(--text-secondary)"
|
|
8096
8376
|
}
|
|
8097
8377
|
)),
|
|
8098
|
-
/* @__PURE__ */
|
|
8099
|
-
/* @__PURE__ */
|
|
8378
|
+
/* @__PURE__ */ React105.createElement("div", { className: "rf-image-field__overlay" }, /* @__PURE__ */ React105.createElement(cameraIcon_default, { width: iconSize, height: iconSize, color: "#ffffff" }), overlayText && /* @__PURE__ */ React105.createElement("span", { className: "rf-image-field__overlay-text" }, overlayText)),
|
|
8379
|
+
/* @__PURE__ */ React105.createElement(
|
|
8100
8380
|
"input",
|
|
8101
8381
|
{
|
|
8102
8382
|
ref: inputRef,
|
|
@@ -8127,6 +8407,7 @@ export {
|
|
|
8127
8407
|
BaseDialog_default as BaseDialog,
|
|
8128
8408
|
Box,
|
|
8129
8409
|
Breadcrumbs,
|
|
8410
|
+
Button,
|
|
8130
8411
|
cameraIcon_default as CameraIcon,
|
|
8131
8412
|
cancelButton_default as CancelButton,
|
|
8132
8413
|
Card,
|
|
@@ -8162,6 +8443,7 @@ export {
|
|
|
8162
8443
|
Grow,
|
|
8163
8444
|
helpOutlinedIcon_default as HelpOutlinedIcon,
|
|
8164
8445
|
hierarchyIcon_default as HierarchyIcon,
|
|
8446
|
+
IconButton,
|
|
8165
8447
|
ImageField,
|
|
8166
8448
|
inactiveGroupIcon_default as InactiveGroupIcon,
|
|
8167
8449
|
industryIcon_default as IndustryIcon,
|
|
@@ -8226,6 +8508,7 @@ export {
|
|
|
8226
8508
|
suspendUserIcon_default as SuspendUserIcon,
|
|
8227
8509
|
Switch,
|
|
8228
8510
|
Tab,
|
|
8511
|
+
TabPanel,
|
|
8229
8512
|
Tabs,
|
|
8230
8513
|
technicalSkillsIcon_default as TechnicalSkillsIcon,
|
|
8231
8514
|
TextField,
|