@giro-ds/react 11.2.0 → 12.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.cjs +623 -469
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.ts +388 -224
- package/dist/index.esm.js +625 -469
- package/dist/index.esm.js.map +1 -1
- package/dist/styles.css +5 -5
- package/package.json +5 -5
package/dist/index.cjs
CHANGED
|
@@ -33,12 +33,13 @@ var React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
|
|
|
33
33
|
|
|
34
34
|
var styles$v = {"AvatarRoot":"Avatar-module__AvatarRoot___7eNx7","AvatarRoot--sm":"Avatar-module__AvatarRoot--sm___LVHoe","AvatarRoot--lg":"Avatar-module__AvatarRoot--lg___QWux5","AvatarImage":"Avatar-module__AvatarImage___-H6iH","AvatarFallback":"Avatar-module__AvatarFallback___RDyNV"};
|
|
35
35
|
|
|
36
|
-
const Avatar = ({ icon, size = 'lg', src, className,
|
|
36
|
+
const Avatar = ({ icon, size = 'lg', src, className, text, ...rest }) => {
|
|
37
37
|
const AvatarClass = clsx(styles$v.AvatarRoot, {
|
|
38
38
|
[styles$v['AvatarRoot--lg']]: size === 'lg',
|
|
39
39
|
[styles$v['AvatarRoot--sm']]: size === 'sm',
|
|
40
40
|
}, className);
|
|
41
|
-
|
|
41
|
+
const truncatedText = text ? text.slice(0, 2) : undefined;
|
|
42
|
+
return (jsxRuntime.jsxs(radixUi.Avatar.Root, { className: AvatarClass, ...rest, children: [src && (jsxRuntime.jsx(radixUi.Avatar.Image, { className: styles$v.AvatarImage, src: src, alt: "Avatar" })), jsxRuntime.jsx(radixUi.Avatar.Fallback, { className: styles$v.AvatarFallback, children: icon || truncatedText })] }));
|
|
42
43
|
};
|
|
43
44
|
|
|
44
45
|
var styles$u = {"badge__status":"Badge-module__badge__status___-u3xv","badge":"Badge-module__badge___ZbEBU","badgeContainer":"Badge-module__badgeContainer___Guw9Z","badge__empty":"Badge-module__badge__empty___u8ccy","badge__flex":"Badge-module__badge__flex___DSJHW","badge__status__empty":"Badge-module__badge__status__empty___h8L4e","badge__status__flex":"Badge-module__badge__status__flex___703Q6","badge__status__filterBadge":"Badge-module__badge__status__filterBadge___DhjGU"};
|
|
@@ -83,7 +84,7 @@ const Tooltip = ({ children, text, side = 'bottom', align = 'start', maxWidth, s
|
|
|
83
84
|
|
|
84
85
|
var styles$s = {"button":"Button-module__button___18Bed","button-lg":"Button-module__button-lg___-A8B9","button-sm":"Button-module__button-sm___L7aT7","button-filled":"Button-module__button-filled___IQx1z","button-outlined":"Button-module__button-outlined___hLkLN","button-text":"Button-module__button-text___8GFeA","buttonWithIcon":"Button-module__buttonWithIcon___8ehK1","buttonIconPosition-left":"Button-module__buttonIconPosition-left___uOY6b","buttonIconPosition-right":"Button-module__buttonIconPosition-right___eswRS","buttonIconPosition-both":"Button-module__buttonIconPosition-both___1Lith","buttonNoContent":"Button-module__buttonNoContent___Tc9jk","buttonIconOnly":"Button-module__buttonIconOnly___aifk4","buttonIconLeft":"Button-module__buttonIconLeft___RICR3","buttonIconRight":"Button-module__buttonIconRight___71lu2","buttonFullWidth":"Button-module__buttonFullWidth___tXuVE","disabled":"Button-module__disabled___UzdWL","buttonLoading":"Button-module__buttonLoading___RGdNw","buttonContentHidden":"Button-module__buttonContentHidden___CoCiN","buttonLoadingSpinner":"Button-module__buttonLoadingSpinner___oZxEU","spin":"Button-module__spin___kQKH9"};
|
|
85
86
|
|
|
86
|
-
const Button =
|
|
87
|
+
const Button = ({ ref, as, children, variant = 'filled', iconPosition = 'left', href, to, external = false, target, rel, disabled = false, onClick, size = 'lg', scale = 1, className, type = 'button', id, icon, fullWidth = false, ariaLabel, iconOnly = false, loading = false, tooltipText, tooltipSide = 'top', tooltipAlign = 'center', ...rest }) => {
|
|
87
88
|
const generatedId = React.useId();
|
|
88
89
|
const componentId = id || generatedId;
|
|
89
90
|
const getComponent = () => {
|
|
@@ -199,7 +200,7 @@ const Button = React.forwardRef(({ as, children, variant = 'filled', iconPositio
|
|
|
199
200
|
return (jsxRuntime.jsx(Tooltip, { text: tooltipText, side: tooltipSide, align: tooltipAlign, children: jsxRuntime.jsx(Component, { ...baseProps, ...getNavigationProps(), children: renderContent() }) }));
|
|
200
201
|
}
|
|
201
202
|
return (jsxRuntime.jsx(Component, { ...baseProps, ...getNavigationProps(), children: renderContent() }));
|
|
202
|
-
}
|
|
203
|
+
};
|
|
203
204
|
Button.displayName = 'Button';
|
|
204
205
|
|
|
205
206
|
function buildFormatLongFn(args) {
|
|
@@ -1376,30 +1377,42 @@ const offsetFormatCache = {};
|
|
|
1376
1377
|
const offsetCache = {};
|
|
1377
1378
|
|
|
1378
1379
|
/**
|
|
1379
|
-
* The function
|
|
1380
|
+
* The function returns UTC offset in minutes for the given date in specified
|
|
1380
1381
|
* time zone.
|
|
1381
1382
|
*
|
|
1382
1383
|
* Unlike `Date.prototype.getTimezoneOffset`, this function returns the value
|
|
1383
1384
|
* mirrored to the sign of the offset in the time zone. For Asia/Singapore
|
|
1384
|
-
* (UTC+8), `tzOffset` returns 480
|
|
1385
|
+
* (UTC+8), `tzOffset` returns `480`, while `getTimezoneOffset` returns `-480`.
|
|
1385
1386
|
*
|
|
1386
|
-
*
|
|
1387
|
-
*
|
|
1387
|
+
* It uses `Intl.DateTimeFormat` internally to access otherwise unavailable
|
|
1388
|
+
* runtime's time zone data, and falls back to basic manual parsing if Intl API
|
|
1389
|
+
* is not supported (e.g., older Node.js versions, React Native's Hermes, etc.).
|
|
1388
1390
|
*
|
|
1389
|
-
* @
|
|
1391
|
+
* @param timeZone - Time zone name (IANA or UTC offset).
|
|
1392
|
+
* @param date - Date to check the offset for.
|
|
1393
|
+
*
|
|
1394
|
+
* @returns UTC offset in minutes (e.g., `480` for date in UTC+8).
|
|
1390
1395
|
*/
|
|
1391
1396
|
function tzOffset(timeZone, date) {
|
|
1392
1397
|
try {
|
|
1398
|
+
// Create `Intl.DateTimeFormat` with `"longOffset"` that gives us consistent
|
|
1399
|
+
// date strings like `"5/19/2026, GMT-08:00"`.
|
|
1393
1400
|
const format = offsetFormatCache[timeZone] ||= new Intl.DateTimeFormat("en-US", {
|
|
1394
1401
|
timeZone,
|
|
1395
1402
|
timeZoneName: "longOffset"
|
|
1396
1403
|
}).format;
|
|
1404
|
+
|
|
1405
|
+
// Get `"-08:00"`.
|
|
1397
1406
|
const offsetStr = format(date).split("GMT")[1];
|
|
1407
|
+
|
|
1408
|
+
// Avoid parsing the same offset string.
|
|
1398
1409
|
if (offsetStr in offsetCache) return offsetCache[offsetStr];
|
|
1410
|
+
|
|
1411
|
+
// Calculate offset from `["-08", "00"]` and cache it.
|
|
1399
1412
|
return calcOffset(offsetStr, offsetStr.split(":"));
|
|
1400
1413
|
} catch {
|
|
1401
|
-
// Fallback to manual parsing if the runtime doesn't support
|
|
1402
|
-
// See: https://github.com/nodejs/node/issues/53419
|
|
1414
|
+
// Fallback to manual parsing if the runtime doesn't support
|
|
1415
|
+
// `±HH:MM/±HHMM/±HH`. See: https://github.com/nodejs/node/issues/53419.
|
|
1403
1416
|
if (timeZone in offsetCache) return offsetCache[timeZone];
|
|
1404
1417
|
const captures = timeZone?.match(offsetRe);
|
|
1405
1418
|
if (captures) return calcOffset(timeZone, captures.slice(1));
|
|
@@ -1415,30 +1428,69 @@ function calcOffset(cacheStr, values) {
|
|
|
1415
1428
|
return offsetCache[cacheStr] = hours * 60 + minutes > 0 ? hours * 60 + minutes + seconds : hours * 60 - minutes - seconds;
|
|
1416
1429
|
}
|
|
1417
1430
|
|
|
1431
|
+
// TZDate stores time in two `Date` objects because native `Date` can only
|
|
1432
|
+
// expose local fields in the system time zone.
|
|
1433
|
+
//
|
|
1434
|
+
// The external date (`this`) stores the real timestamp. It is the value used by
|
|
1435
|
+
// `getTime()`, `valueOf()`, UTC getters/setters, comparisons, and arithmetic.
|
|
1436
|
+
// Its local getters are not used for target-zone fields because they would read
|
|
1437
|
+
// the timestamp through the system time zone.
|
|
1438
|
+
//
|
|
1439
|
+
// The internal date (`this.internal`) stores the target-zone wall-clock fields.
|
|
1440
|
+
// We read and write those fields through UTC getters/setters so the host system
|
|
1441
|
+
// time zone cannot reinterpret them. For example, `getHours()` returns
|
|
1442
|
+
// `internal.getUTCHours()`, and `setHours()` writes `internal.setUTCHours(...)`.
|
|
1443
|
+
//
|
|
1444
|
+
// Syncing moves data between the two representations:
|
|
1445
|
+
//
|
|
1446
|
+
// - `syncToInternal` starts from the external timestamp and rebuilds internal
|
|
1447
|
+
// wall-clock fields using `this.timeZone` offset.
|
|
1448
|
+
//
|
|
1449
|
+
// - `syncFromInternal` starts from internal wall-clock fields, writes them into
|
|
1450
|
+
// the external date, then adjusts that timestamp for the system/target offset
|
|
1451
|
+
// difference and DST edge cases.
|
|
1452
|
+
//
|
|
1453
|
+
// The public TZDate value is the combination of both: external is the instant,
|
|
1454
|
+
// internal is the wall-clock view of that instant in `this.timeZone`.
|
|
1455
|
+
|
|
1418
1456
|
class TZDateMini extends Date {
|
|
1419
1457
|
//#region static
|
|
1420
1458
|
|
|
1421
1459
|
constructor(...args) {
|
|
1422
1460
|
super();
|
|
1461
|
+
|
|
1462
|
+
// Time zone string is always the last string argument unless date string
|
|
1463
|
+
// is passed (as a single argument).
|
|
1423
1464
|
if (args.length > 1 && typeof args[args.length - 1] === "string") {
|
|
1424
1465
|
this.timeZone = args.pop();
|
|
1425
1466
|
}
|
|
1426
1467
|
this.internal = new Date();
|
|
1468
|
+
|
|
1469
|
+
// Validate the time zone by checking its offset.
|
|
1427
1470
|
if (isNaN(tzOffset(this.timeZone, this))) {
|
|
1428
1471
|
this.setTime(NaN);
|
|
1429
1472
|
} else {
|
|
1430
1473
|
if (!args.length) {
|
|
1474
|
+
// No arguments passed: use current time
|
|
1431
1475
|
this.setTime(Date.now());
|
|
1432
1476
|
} else if (typeof args[0] === "number" && (args.length === 1 || args.length === 2 && typeof args[1] !== "number")) {
|
|
1477
|
+
// Timestamp passed: use it as is
|
|
1433
1478
|
this.setTime(args[0]);
|
|
1434
1479
|
} else if (typeof args[0] === "string") {
|
|
1480
|
+
// `Date` string passed: parse it as external date
|
|
1435
1481
|
this.setTime(+new Date(args[0]));
|
|
1436
1482
|
} else if (args[0] instanceof Date) {
|
|
1483
|
+
// `Date` passed: use its timestamp
|
|
1437
1484
|
this.setTime(+args[0]);
|
|
1438
1485
|
} else {
|
|
1486
|
+
// `Date` values passed:
|
|
1487
|
+
|
|
1488
|
+
// Set it as external date.
|
|
1439
1489
|
this.setTime(+new Date(...args));
|
|
1440
|
-
|
|
1441
|
-
|
|
1490
|
+
|
|
1491
|
+
// Adjust internal and external dates considering that we might have
|
|
1492
|
+
// landed on the DST hour.
|
|
1493
|
+
adjustToSystemTZ(this, args);
|
|
1442
1494
|
}
|
|
1443
1495
|
}
|
|
1444
1496
|
}
|
|
@@ -1455,8 +1507,8 @@ class TZDateMini extends Date {
|
|
|
1455
1507
|
}
|
|
1456
1508
|
getTimezoneOffset() {
|
|
1457
1509
|
const offset = -tzOffset(this.timeZone, this);
|
|
1458
|
-
// Remove the seconds offset
|
|
1459
|
-
//
|
|
1510
|
+
// Remove the seconds offset using `Math.floor` for negative UTC time zones
|
|
1511
|
+
// and `Math.ceil` for positive UTC time zones.
|
|
1460
1512
|
return offset > 0 ? Math.floor(offset) : Math.ceil(offset);
|
|
1461
1513
|
}
|
|
1462
1514
|
|
|
@@ -1464,8 +1516,11 @@ class TZDateMini extends Date {
|
|
|
1464
1516
|
|
|
1465
1517
|
//#region time
|
|
1466
1518
|
|
|
1467
|
-
setTime(
|
|
1519
|
+
setTime(_time) {
|
|
1520
|
+
// Use the native `setTime` to the external date time.
|
|
1468
1521
|
Date.prototype.setTime.apply(this, arguments);
|
|
1522
|
+
|
|
1523
|
+
// Then apply it to the internal date adjusting to the timezone offset.
|
|
1469
1524
|
syncToInternal(this);
|
|
1470
1525
|
return +this;
|
|
1471
1526
|
}
|
|
@@ -1511,23 +1566,40 @@ Object.getOwnPropertyNames(Date.prototype).forEach(method => {
|
|
|
1511
1566
|
});
|
|
1512
1567
|
|
|
1513
1568
|
/**
|
|
1514
|
-
*
|
|
1569
|
+
* @internal
|
|
1570
|
+
* Function syncs time to internal date, applying the current time zone offset.
|
|
1515
1571
|
*
|
|
1516
|
-
* @param {Date} date - Date to sync
|
|
1572
|
+
* @param {Date} date - `Date` to sync
|
|
1517
1573
|
*/
|
|
1518
1574
|
function syncToInternal(date) {
|
|
1575
|
+
// Start internal from the same real timestamp as external.
|
|
1519
1576
|
date.internal.setTime(+date);
|
|
1520
|
-
|
|
1577
|
+
|
|
1578
|
+
// Shift internal by the target offset so its UTC fields become the target-zone
|
|
1579
|
+
// wall-clock fields for the external timestamp.
|
|
1580
|
+
//
|
|
1581
|
+
// o internal UTC fields: 2024-02-11 00:00
|
|
1582
|
+
// |
|
|
1583
|
+
// | + Asia/Singapore offset (+08:00)
|
|
1584
|
+
// v
|
|
1585
|
+
// x internal UTC fields: 2024-02-11 08:00
|
|
1586
|
+
//
|
|
1587
|
+
date.internal.setUTCSeconds(date.internal.getUTCSeconds() -
|
|
1588
|
+
// Round after converting minutes to seconds to avoid fractional offset
|
|
1589
|
+
// precision errors from historical offsets.
|
|
1590
|
+
Math.round(-tzOffset(date.timeZone, date) * 60));
|
|
1521
1591
|
}
|
|
1522
1592
|
|
|
1523
1593
|
/**
|
|
1524
|
-
*
|
|
1525
|
-
*
|
|
1594
|
+
* @internal
|
|
1595
|
+
* Function syncs internal wall-clock fields into the external date.
|
|
1526
1596
|
*
|
|
1527
1597
|
* @param {Date} date - The date to sync
|
|
1528
1598
|
*/
|
|
1529
1599
|
function syncFromInternal(date) {
|
|
1530
|
-
//
|
|
1600
|
+
// Copy target-zone wall-clock fields from internal into external using native
|
|
1601
|
+
// local setters. At this point external holds the right field values but they
|
|
1602
|
+
// are interpreted in the system time zone; `adjustToSystemTZ` fixes that.
|
|
1531
1603
|
Date.prototype.setFullYear.call(date, date.internal.getUTCFullYear(), date.internal.getUTCMonth(), date.internal.getUTCDate());
|
|
1532
1604
|
Date.prototype.setHours.call(date, date.internal.getUTCHours(), date.internal.getUTCMinutes(), date.internal.getUTCSeconds(), date.internal.getUTCMilliseconds());
|
|
1533
1605
|
|
|
@@ -1536,115 +1608,271 @@ function syncFromInternal(date) {
|
|
|
1536
1608
|
}
|
|
1537
1609
|
|
|
1538
1610
|
/**
|
|
1611
|
+
* @internal
|
|
1539
1612
|
* Function adjusts the date to the system time zone. It uses the time zone
|
|
1540
1613
|
* differences to calculate the offset and adjust the date.
|
|
1541
1614
|
*
|
|
1542
|
-
*
|
|
1615
|
+
* We use it when constructing `TZDate` and syncing the external date from
|
|
1616
|
+
* the internal one.
|
|
1617
|
+
*
|
|
1618
|
+
* @param {TZDate} date - `TZDate` to adjust.
|
|
1543
1619
|
*/
|
|
1544
|
-
function adjustToSystemTZ(date) {
|
|
1545
|
-
//
|
|
1546
|
-
|
|
1547
|
-
//
|
|
1548
|
-
|
|
1549
|
-
|
|
1620
|
+
function adjustToSystemTZ(date, constructorArgs) {
|
|
1621
|
+
// Keep the intended target-zone wall-clock value before native Date/system
|
|
1622
|
+
// time zone normalization can move it. Later corrections compare against this
|
|
1623
|
+
// value to distinguish intended DST normalization from accidental drift.
|
|
1624
|
+
const expectedInternalTime = Array.isArray(constructorArgs) ? constructorArgsToInternalTime(constructorArgs) : +date.internal;
|
|
1625
|
+
//#region Initial offset calculation
|
|
1626
|
+
|
|
1627
|
+
// Current target time zone offset at the native timestamp. It may include
|
|
1628
|
+
// historical offset seconds, which we preserve for the seconds adjustment.
|
|
1629
|
+
const offsetWithSeconds = tzOffset(date.timeZone, date);
|
|
1630
|
+
|
|
1631
|
+
// Minute-precision target offset used by minute-based timestamp adjustments.
|
|
1632
|
+
// Historical offsets can contain seconds, so we strip the fractional minute
|
|
1633
|
+
// here and handle remaining seconds in the seconds adjustment below.
|
|
1634
|
+
const offset = offsetWithSeconds > 0 ? Math.floor(offsetWithSeconds) : Math.ceil(offsetWithSeconds);
|
|
1635
|
+
|
|
1636
|
+
//#endregion
|
|
1637
|
+
|
|
1550
1638
|
//#region System DST adjustment
|
|
1551
1639
|
|
|
1552
|
-
//
|
|
1553
|
-
//
|
|
1554
|
-
// up on the DST hour:
|
|
1555
|
-
//
|
|
1556
|
-
// $ TZ=America/New_York node
|
|
1557
|
-
// > new Date(2020, 2, 8, 1).toString()
|
|
1558
|
-
// 'Sun Mar 08 2020 01:00:00 GMT-0500 (Eastern Standard Time)'
|
|
1559
|
-
// > new Date(2020, 2, 8, 2).toString()
|
|
1560
|
-
// 'Sun Mar 08 2020 03:00:00 GMT-0400 (Eastern Daylight Time)'
|
|
1561
|
-
// > new Date(2020, 2, 8, 3).toString()
|
|
1562
|
-
// 'Sun Mar 08 2020 03:00:00 GMT-0400 (Eastern Daylight Time)'
|
|
1563
|
-
// > new Date(2020, 2, 8, 4).toString()
|
|
1564
|
-
// 'Sun Mar 08 2020 04:00:00 GMT-0400 (Eastern Daylight Time)'
|
|
1640
|
+
// Native `Date` may normalize the requested wall time when the system time
|
|
1641
|
+
// zone skips that hour for DST.
|
|
1565
1642
|
//
|
|
1566
|
-
//
|
|
1567
|
-
//
|
|
1568
|
-
//
|
|
1569
|
-
//
|
|
1570
|
-
// However we want to adjust only if that's the DST hour the change happenes,
|
|
1571
|
-
// not the hour where DST moves to.
|
|
1643
|
+
// We compare the system wall-clock hour represented by the external date with
|
|
1644
|
+
// the wall-clock hour stored in the internal date. If they differ, the next
|
|
1645
|
+
// offset-diff calculation may need the previous system offset, because the
|
|
1646
|
+
// current external timestamp is already after the system DST jump.
|
|
1572
1647
|
|
|
1573
|
-
//
|
|
1574
|
-
//
|
|
1648
|
+
// Previous-hour reference used to detect whether the system offset changed
|
|
1649
|
+
// immediately before the current native timestamp.
|
|
1575
1650
|
const prevHour = new Date(+date);
|
|
1576
|
-
|
|
1577
|
-
//
|
|
1651
|
+
|
|
1652
|
+
// Use UTC math so subtracting one hour cannot be normalized back into the
|
|
1653
|
+
// same missing local DST hour.
|
|
1578
1654
|
prevHour.setUTCHours(prevHour.getUTCHours() - 1);
|
|
1579
1655
|
|
|
1580
|
-
//
|
|
1656
|
+
// Current system offset at the native timestamp.
|
|
1581
1657
|
const systemOffset = -new Date(+date).getTimezoneOffset();
|
|
1658
|
+
|
|
1659
|
+
// System offset one real hour before the native timestamp.
|
|
1582
1660
|
const prevHourSystemOffset = -new Date(+prevHour).getTimezoneOffset();
|
|
1661
|
+
|
|
1662
|
+
// Non-zero when the system offset changed between `prevHour` and `date`.
|
|
1583
1663
|
const systemDSTChange = systemOffset - prevHourSystemOffset;
|
|
1584
|
-
// Detect the DST shift. System DST change will occur both on
|
|
1585
|
-
const dstShift = Date.prototype.getHours.apply(date) !== date.internal.getUTCHours();
|
|
1586
1664
|
|
|
1587
|
-
//
|
|
1588
|
-
|
|
1665
|
+
// System offset to use in the later system-target offset difference.
|
|
1666
|
+
// Defaults to the current system offset and switches to the previous offset
|
|
1667
|
+
// only when native `Date` normalized a missing system wall time.
|
|
1668
|
+
let systemOffsetForDiff = systemOffset;
|
|
1669
|
+
if (systemDSTChange && systemOffset !== offset) {
|
|
1670
|
+
// System wall-clock hour represented by the current external timestamp.
|
|
1671
|
+
const systemHour = Date.prototype.getHours.apply(date);
|
|
1672
|
+
|
|
1673
|
+
// Target wall-clock hour currently stored in internal fields. Constructors
|
|
1674
|
+
// get it from arguments because internal may have already been synced from
|
|
1675
|
+
// the normalized external timestamp; setters get it directly from internal.
|
|
1676
|
+
const expectedHour = Array.isArray(constructorArgs) ? constructorArgs[3] || 0 : date.internal.getUTCHours();
|
|
1677
|
+
if (systemHour !== expectedHour) {
|
|
1678
|
+
// Check whether using the current system offset would keep the target
|
|
1679
|
+
// offset unchanged. If so, the only DST jump we crossed is the system
|
|
1680
|
+
// one, so the diff should use the pre-DST system offset.
|
|
1681
|
+
const testDate = new Date(+date);
|
|
1682
|
+
|
|
1683
|
+
// Difference that the later offset-diff step would apply with the
|
|
1684
|
+
// current system offset.
|
|
1685
|
+
const testOffsetDiff = systemOffset - offset;
|
|
1686
|
+
if (testOffsetDiff) testDate.setUTCMinutes(testDate.getUTCMinutes() + testOffsetDiff);
|
|
1687
|
+
|
|
1688
|
+
// Target offset after applying the current system offset difference.
|
|
1689
|
+
const testOffsetWithSeconds = tzOffset(date.timeZone, testDate);
|
|
1690
|
+
|
|
1691
|
+
// Target offset without historical seconds, matching `offset`.
|
|
1692
|
+
const testOffset = testOffsetWithSeconds > 0 ? Math.floor(testOffsetWithSeconds) : Math.ceil(testOffsetWithSeconds);
|
|
1693
|
+
if (testOffset === offset) systemOffsetForDiff = prevHourSystemOffset;
|
|
1694
|
+
}
|
|
1695
|
+
}
|
|
1589
1696
|
|
|
1590
1697
|
//#endregion
|
|
1591
1698
|
|
|
1592
1699
|
//#region System diff adjustment
|
|
1593
1700
|
|
|
1594
|
-
//
|
|
1595
|
-
//
|
|
1596
|
-
//
|
|
1597
|
-
|
|
1598
|
-
|
|
1599
|
-
|
|
1701
|
+
// Move external from the system-zone interpretation of internal fields toward
|
|
1702
|
+
// the timestamp that represents those fields in the target time zone.
|
|
1703
|
+
//
|
|
1704
|
+
// At this point native `Date` has treated the internal wall-clock fields as if
|
|
1705
|
+
// they belonged to the system zone. The system-target offset difference moves
|
|
1706
|
+
// external by the distance between that system interpretation and the target
|
|
1707
|
+
// interpretation.
|
|
1708
|
+
|
|
1709
|
+
// Difference between the system offset selected above and the minute-precision
|
|
1710
|
+
// target offset. Positive values move external forward; negative values move
|
|
1711
|
+
// it backward.
|
|
1712
|
+
const offsetDiff = systemOffsetForDiff - offset;
|
|
1713
|
+
if (offsetDiff)
|
|
1714
|
+
// Apply the system-target minute difference to external. Internal is
|
|
1715
|
+
// rebuilt from the final external timestamp after all adjustments are
|
|
1716
|
+
// complete.
|
|
1717
|
+
//
|
|
1718
|
+
// o external as target: 2023-01-31 23:00
|
|
1719
|
+
// |
|
|
1720
|
+
// | add `offsetDiff`
|
|
1721
|
+
// v
|
|
1722
|
+
// x external as target: 2023-02-01 12:00
|
|
1723
|
+
//
|
|
1724
|
+
Date.prototype.setUTCMinutes.call(date, Date.prototype.getUTCMinutes.call(date) + offsetDiff);
|
|
1600
1725
|
|
|
1601
1726
|
//#endregion
|
|
1602
1727
|
|
|
1603
|
-
//#region Seconds
|
|
1728
|
+
//#region Seconds system diff adjustment
|
|
1729
|
+
|
|
1730
|
+
// Historical time zone offsets can include seconds, but the minute-based
|
|
1731
|
+
// offset adjustment above intentionally used minute precision.
|
|
1732
|
+
//
|
|
1733
|
+
// This adjustment applies the remaining seconds difference to external. For
|
|
1734
|
+
// example, historical Singapore used UTC+06:55:25, while ISO formatting shows
|
|
1735
|
+
// only `+06:55`; without the seconds correction, setter paths keep the wrong
|
|
1736
|
+
// wall-clock seconds.
|
|
1604
1737
|
|
|
1738
|
+
// Clone external as a native `Date` so we can inspect how the system time zone
|
|
1739
|
+
// represents the same timestamp.
|
|
1605
1740
|
const systemDate = new Date(+date);
|
|
1606
|
-
|
|
1741
|
+
|
|
1742
|
+
// Zero UTC seconds before reading system seconds. Any remaining local seconds
|
|
1743
|
+
// then come from the system time zone offset rather than from the timestamp's
|
|
1744
|
+
// own seconds value.
|
|
1607
1745
|
systemDate.setUTCSeconds(0);
|
|
1608
|
-
|
|
1746
|
+
|
|
1747
|
+
// Seconds part contributed by the system time zone offset. Negative offsets
|
|
1748
|
+
// need wrapping because `Date#getSeconds()` returns values in the 0..59 range.
|
|
1609
1749
|
const systemSecondsOffset = systemOffset > 0 ? systemDate.getSeconds() : (systemDate.getSeconds() - 60) % 60;
|
|
1610
1750
|
|
|
1611
|
-
//
|
|
1751
|
+
// Seconds part contributed by the target time zone offset.
|
|
1612
1752
|
const secondsOffset = Math.round(-(tzOffset(date.timeZone, date) * 60)) % 60;
|
|
1613
|
-
if (secondsOffset || systemSecondsOffset)
|
|
1614
|
-
|
|
1753
|
+
if (secondsOffset || systemSecondsOffset)
|
|
1754
|
+
// Apply the remaining second-level system-target difference to external.
|
|
1755
|
+
//
|
|
1756
|
+
// o external as Asia/Singapore: 1900-01-01 00:00:56
|
|
1757
|
+
// |
|
|
1758
|
+
// | + `secondsOffset`
|
|
1759
|
+
// | + `systemSecondsOffset`
|
|
1760
|
+
// v
|
|
1761
|
+
// x external as Asia/Singapore: 1900-01-01 00:00:31
|
|
1762
|
+
//
|
|
1615
1763
|
Date.prototype.setUTCSeconds.call(date, Date.prototype.getUTCSeconds.call(date) + secondsOffset + systemSecondsOffset);
|
|
1616
|
-
}
|
|
1617
1764
|
|
|
1618
1765
|
//#endregion
|
|
1619
1766
|
|
|
1620
1767
|
//#region Post-adjustment DST fix
|
|
1621
1768
|
|
|
1622
|
-
|
|
1623
|
-
//
|
|
1624
|
-
//
|
|
1625
|
-
|
|
1769
|
+
// The first system-target offset move can cross a target-zone DST boundary.
|
|
1770
|
+
//
|
|
1771
|
+
// When that happens, the target offset at the new external timestamp differs
|
|
1772
|
+
// from the target offset used for `offsetDiff`. We compare the original move
|
|
1773
|
+
// with the move that would be calculated at the new timestamp, then apply the
|
|
1774
|
+
// difference to external.
|
|
1775
|
+
|
|
1776
|
+
// Target offset at the current external timestamp, including historical
|
|
1777
|
+
// seconds for the later seconds adjustment.
|
|
1778
|
+
const postOffsetWithSeconds = tzOffset(date.timeZone, date);
|
|
1779
|
+
|
|
1780
|
+
// Minute-precision target offset at the current external timestamp.
|
|
1781
|
+
const postOffset = postOffsetWithSeconds > 0 ? Math.floor(postOffsetWithSeconds) : Math.ceil(postOffsetWithSeconds);
|
|
1782
|
+
|
|
1783
|
+
// System offset at the current external timestamp.
|
|
1626
1784
|
const postSystemOffset = -new Date(+date).getTimezoneOffset();
|
|
1785
|
+
|
|
1786
|
+
// System-target offset difference at the current external timestamp.
|
|
1627
1787
|
const postOffsetDiff = postSystemOffset - postOffset;
|
|
1788
|
+
|
|
1789
|
+
// Whether the target offset changed after the first offset move.
|
|
1628
1790
|
const offsetChanged = postOffset !== offset;
|
|
1791
|
+
|
|
1792
|
+
// Difference between the current offset move and the move already applied.
|
|
1629
1793
|
const postDiff = postOffsetDiff - offsetDiff;
|
|
1630
|
-
|
|
1794
|
+
|
|
1795
|
+
// If the first offset move already normalized a target DST gap forward, the
|
|
1796
|
+
// generic post-DST correction below would undo that valid normalization. This
|
|
1797
|
+
// happens, for example, with America/New_York 02:00 during spring-forward when
|
|
1798
|
+
// the system zone also changes offset around the same instant.
|
|
1799
|
+
const targetDSTShift = postOffset - offset;
|
|
1800
|
+
|
|
1801
|
+
// Candidate timestamp that would represent the requested wall-clock time with
|
|
1802
|
+
// the post-transition target offset. If it still does not round-trip to the
|
|
1803
|
+
// requested wall-clock fields, the requested time is inside a target DST gap.
|
|
1804
|
+
const postOffsetCandidate = expectedInternalTime - postOffset * 60 * 1000;
|
|
1805
|
+
|
|
1806
|
+
// Only positive target offset shifts are spring-forward gaps. Negative shifts
|
|
1807
|
+
// are fall-back overlaps and still need the regular post-adjustment path.
|
|
1808
|
+
const normalizedTargetDSTGap = targetDSTShift > 0 && targetInternalTime(date) - expectedInternalTime === targetDSTShift * 60 * 1000 && targetInternalTime(date, postOffsetCandidate) !== expectedInternalTime;
|
|
1809
|
+
if (offsetChanged && postDiff && !normalizedTargetDSTGap) {
|
|
1810
|
+
// Apply the target-DST correction to external. In the backward-crossing case
|
|
1811
|
+
// shown here, this lands on an intermediate value that needs `offsetChange`
|
|
1812
|
+
// below.
|
|
1813
|
+
//
|
|
1814
|
+
// o external as America/New_York: 2023-03-12 03:00 EDT
|
|
1815
|
+
// |
|
|
1816
|
+
// | + `postDiff`
|
|
1817
|
+
// v
|
|
1818
|
+
// x external as America/New_York: 2023-03-12 01:00 EST
|
|
1819
|
+
//
|
|
1631
1820
|
Date.prototype.setUTCMinutes.call(date, Date.prototype.getUTCMinutes.call(date) + postDiff);
|
|
1632
1821
|
|
|
1633
|
-
//
|
|
1634
|
-
//
|
|
1822
|
+
// Target offset after applying `postDiff`. It may change again if the
|
|
1823
|
+
// correction itself crosses a target-zone DST boundary.
|
|
1824
|
+
const newOffsetWithSeconds = tzOffset(date.timeZone, date);
|
|
1635
1825
|
|
|
1636
|
-
|
|
1637
|
-
|
|
1638
|
-
|
|
1639
|
-
|
|
1826
|
+
// Minute-precision target offset after applying `postDiff`.
|
|
1827
|
+
const newOffset = newOffsetWithSeconds > 0 ? Math.floor(newOffsetWithSeconds) : Math.ceil(newOffsetWithSeconds);
|
|
1828
|
+
|
|
1829
|
+
// Offset change caused by the `postDiff` move itself.
|
|
1640
1830
|
const offsetChange = postOffset - newOffset;
|
|
1641
|
-
|
|
1642
|
-
|
|
1831
|
+
|
|
1832
|
+
// If the correction moved external backward across the target DST boundary,
|
|
1833
|
+
// apply the boundary change so external lands on the valid target-zone
|
|
1834
|
+
// timestamp. Forward crossings are already normalized by native Date, and
|
|
1835
|
+
// applying this correction there would undo the valid post-DST result.
|
|
1836
|
+
if (offsetChange && postDiff < 0) {
|
|
1837
|
+
// Apply the second target-DST correction to external.
|
|
1838
|
+
//
|
|
1839
|
+
// o external as America/New_York: 2023-03-12 01:00 EST
|
|
1840
|
+
// |
|
|
1841
|
+
// | + `offsetChange`
|
|
1842
|
+
// v
|
|
1843
|
+
// x external as America/New_York: 2023-03-12 03:00 EDT
|
|
1844
|
+
//
|
|
1643
1845
|
Date.prototype.setUTCMinutes.call(date, Date.prototype.getUTCMinutes.call(date) + offsetChange);
|
|
1644
1846
|
}
|
|
1645
1847
|
}
|
|
1646
1848
|
|
|
1647
1849
|
//#endregion
|
|
1850
|
+
|
|
1851
|
+
// Rebuild internal wall-clock fields from the final external timestamp.
|
|
1852
|
+
syncToInternal(date);
|
|
1853
|
+
|
|
1854
|
+
// Native Date can normalize historical system offsets with minute and second
|
|
1855
|
+
// precision before we adjust to the target time zone. Correct only small
|
|
1856
|
+
// historical drift so DST gap normalization (usually one hour) remains intact.
|
|
1857
|
+
const expectedTime = constructorArgs ? expectedInternalTime : expectedInternalTime + secondsOffset * 1000;
|
|
1858
|
+
const drift = expectedTime - +date.internal;
|
|
1859
|
+
if (drift && Math.abs(drift) < 30 * 60 * 1000) {
|
|
1860
|
+
Date.prototype.setTime.call(date, +date + drift);
|
|
1861
|
+
syncToInternal(date);
|
|
1862
|
+
}
|
|
1863
|
+
}
|
|
1864
|
+
function constructorArgsToInternalTime(args) {
|
|
1865
|
+
// Mirror Date's date-value constructor defaults while preserving explicit
|
|
1866
|
+
// `undefined` behavior. Missing month/day default, but passed `undefined`
|
|
1867
|
+
// should remain invalid just like `Date.UTC(year, undefined, ...)`.
|
|
1868
|
+
return Date.UTC(args[0], args.length > 1 ? args[1] : 0, args.length > 2 ? args[2] : 1, ...args.slice(3));
|
|
1869
|
+
}
|
|
1870
|
+
function targetInternalTime(date, time) {
|
|
1871
|
+
// Compute the target-zone wall-clock representation for a timestamp without
|
|
1872
|
+
// mutating the TZDate. This mirrors syncToInternal for temporary checks.
|
|
1873
|
+
const internal = new Date(time ?? +date);
|
|
1874
|
+
internal.setUTCSeconds(internal.getUTCSeconds() - Math.round(-tzOffset(date.timeZone, internal) * 60));
|
|
1875
|
+
return +internal;
|
|
1648
1876
|
}
|
|
1649
1877
|
|
|
1650
1878
|
class TZDate extends TZDateMini {
|
|
@@ -2458,7 +2686,7 @@ const ptBR = {
|
|
|
2458
2686
|
},
|
|
2459
2687
|
};
|
|
2460
2688
|
|
|
2461
|
-
var styles$r = {"root":"Calendar-module__root___vQEhz","day":"Calendar-module__day___dseUA","day_button":"Calendar-module__day_button___r3WNU","caption_label":"Calendar-module__caption_label___Dhkie","button_next":"Calendar-module__button_next___iRaNz","button_previous":"Calendar-module__button_previous___r7JBs","chevron":"Calendar-module__chevron___NPDg-","nav":"Calendar-module__nav___MT3Dm","dropdowns":"Calendar-module__dropdowns___xBVtv","dropdown":"Calendar-module__dropdown___D7OlW","dropdown_root":"Calendar-module__dropdown_root___v4DlK","month_caption":"Calendar-module__month_caption___P3Hlu","month":"Calendar-module__month___0RA-L","months":"Calendar-module__months___rmJdy","month_grid":"Calendar-module__month_grid___f6YkX","weekday":"Calendar-module__weekday___Spb2f","week_number":"Calendar-module__week_number___EXJD9","today":"Calendar-module__today___U36wP","outside":"Calendar-module__outside___UeJFZ","selected":"Calendar-module__selected___5Nryr","disabled":"Calendar-module__disabled___T3658","hidden":"Calendar-module__hidden___uL3uc","
|
|
2689
|
+
var styles$r = {"root":"Calendar-module__root___vQEhz","day":"Calendar-module__day___dseUA","day_button":"Calendar-module__day_button___r3WNU","caption_label":"Calendar-module__caption_label___Dhkie","button_next":"Calendar-module__button_next___iRaNz","button_previous":"Calendar-module__button_previous___r7JBs","chevron":"Calendar-module__chevron___NPDg-","nav":"Calendar-module__nav___MT3Dm","dropdowns":"Calendar-module__dropdowns___xBVtv","dropdown":"Calendar-module__dropdown___D7OlW","dropdown_root":"Calendar-module__dropdown_root___v4DlK","month_caption":"Calendar-module__month_caption___P3Hlu","month":"Calendar-module__month___0RA-L","months":"Calendar-module__months___rmJdy","month_grid":"Calendar-module__month_grid___f6YkX","weekday":"Calendar-module__weekday___Spb2f","week_number":"Calendar-module__week_number___EXJD9","today":"Calendar-module__today___U36wP","outside":"Calendar-module__outside___UeJFZ","selected":"Calendar-module__selected___5Nryr","disabled":"Calendar-module__disabled___T3658","hidden":"Calendar-module__hidden___uL3uc","range_middle":"Calendar-module__range_middle___Uv4gt","range_start":"Calendar-module__range_start___c1eNH","range_end":"Calendar-module__range_end___4qDh5","focusable":"Calendar-module__focusable___V7w-Q","weeks_before_enter":"Calendar-module__weeks_before_enter___O1ytQ","slide_in_left":"Calendar-module__slide_in_left___hfrfr","weeks_before_exit":"Calendar-module__weeks_before_exit___v7nDr","slide_out_left":"Calendar-module__slide_out_left___kib4j","weeks_after_enter":"Calendar-module__weeks_after_enter___CEtsD","slide_in_right":"Calendar-module__slide_in_right___ldL0M","weeks_after_exit":"Calendar-module__weeks_after_exit___F8Edz","slide_out_right":"Calendar-module__slide_out_right___X2hxE","caption_after_enter":"Calendar-module__caption_after_enter___0ek1H","fade_in":"Calendar-module__fade_in___YyYoZ","caption_after_exit":"Calendar-module__caption_after_exit___RA1iK","fade_out":"Calendar-module__fade_out___lNcmB","caption_before_enter":"Calendar-module__caption_before_enter___j6sMK","caption_before_exit":"Calendar-module__caption_before_exit___rntl-","calendar_grid_wrapper":"Calendar-module__calendar_grid_wrapper___OX0TR","caption_grid_btn":"Calendar-module__caption_grid_btn___qD0-E","caption_year_chevron":"Calendar-module__caption_year_chevron___4ghQV","caption_grid_label":"Calendar-module__caption_grid_label___93Wx4","gridOverlay":"Calendar-module__gridOverlay___Za-y0","gridOverlayCaption":"Calendar-module__gridOverlayCaption___p4OUO","gridOverlayYearsNav":"Calendar-module__gridOverlayYearsNav___U6S-V","gridCells":"Calendar-module__gridCells___Y8DaG","gridCellsYears":"Calendar-module__gridCellsYears___jEV52","gridCell":"Calendar-module__gridCell___RV1co","gridCellActive":"Calendar-module__gridCellActive___UBi5y","gridNavBtn":"Calendar-module__gridNavBtn___Jligz","chevronNavBtnPrev":"Calendar-module__chevronNavBtnPrev___ifEps","chevronNavBtnNext":"Calendar-module__chevronNavBtnNext___qmghm","chevron_wrapper":"Calendar-module__chevron_wrapper___BfN9a"};
|
|
2462
2690
|
|
|
2463
2691
|
const FLUENT_CHEVRON_MAP = {
|
|
2464
2692
|
down: reactIcons.ChevronDown16Regular,
|
|
@@ -2480,15 +2708,19 @@ const GridMonthCaption = ({ calendarMonth, displayIndex: _displayIndex, ...divPr
|
|
|
2480
2708
|
return (jsxRuntime.jsxs("div", { ...divProps, children: [jsxRuntime.jsx("span", { className: styles$r.caption_grid_label, children: monthLabel }), jsxRuntime.jsxs("button", { type: "button", className: styles$r.caption_grid_btn, "aria-pressed": view === "years", onClick: onYearLabelClick, children: [yearLabel, view !== "days" ? (jsxRuntime.jsx("span", { className: styles$r.chevron_wrapper, children: jsxRuntime.jsx(reactIcons.ChevronUp16Regular, { className: styles$r.caption_year_chevron, "aria-hidden": true }) })) : (jsxRuntime.jsx("span", { className: styles$r.chevron_wrapper, children: jsxRuntime.jsx(reactIcons.ChevronDown16Regular, { className: styles$r.caption_year_chevron, "aria-hidden": true }) }))] })] }));
|
|
2481
2709
|
};
|
|
2482
2710
|
const YEARS_PER_PAGE = 20;
|
|
2483
|
-
const Calendar = ({ selected, currentDate, defaultMonth, startMonth, endMonth, onDaySelect, onDateChange, onClear
|
|
2711
|
+
const Calendar = ({ mode = "single", selected, selectedRange, currentDate, defaultMonth, startMonth, endMonth, onDaySelect, onRangeSelect, onDateChange, onClear, minDate, maxDate, disabled, format: _format, locale = "pt-br", autoFocus, numberOfMonths, className, style, scale = 1, id, "aria-label": ariaLabel, ...rest }) => {
|
|
2484
2712
|
const animate = true;
|
|
2485
2713
|
const [internalSelected, setInternalSelected] = React.useState(selected ?? undefined);
|
|
2714
|
+
const [internalRange, setInternalRange] = React.useState(selectedRange ?? undefined);
|
|
2486
2715
|
const [internalDisplayMonth, setInternalDisplayMonth] = React.useState(() => currentDate ?? defaultMonth ?? new Date());
|
|
2487
2716
|
const [gridView, setGridView] = React.useState("days");
|
|
2488
2717
|
const [yearPageStart, setYearPageStart] = React.useState(() => (currentDate ?? defaultMonth ?? new Date()).getFullYear() - 9);
|
|
2489
2718
|
const resolvedSelected = selected !== undefined
|
|
2490
2719
|
? (selected ?? undefined)
|
|
2491
2720
|
: internalSelected;
|
|
2721
|
+
const resolvedRange = selectedRange !== undefined
|
|
2722
|
+
? (selectedRange ?? undefined)
|
|
2723
|
+
: internalRange;
|
|
2492
2724
|
const resolvedLocale = locale === "pt-br" ? ptBR : enUS;
|
|
2493
2725
|
const intlLocale = locale === "pt-br" ? "pt-BR" : "en-US";
|
|
2494
2726
|
const disabledMatchers = [
|
|
@@ -2501,6 +2733,33 @@ const Calendar = ({ selected, currentDate, defaultMonth, startMonth, endMonth, o
|
|
|
2501
2733
|
if (date) {
|
|
2502
2734
|
onDaySelect?.(date);
|
|
2503
2735
|
}
|
|
2736
|
+
else {
|
|
2737
|
+
onClear?.();
|
|
2738
|
+
}
|
|
2739
|
+
};
|
|
2740
|
+
const handleRangeSelect = (range, selectedDay) => {
|
|
2741
|
+
const current = resolvedRange;
|
|
2742
|
+
// Desselecionar: apenas um dia marcado (to ausente ou to = from) e o usuário clicou nele
|
|
2743
|
+
const isSingleDaySelected = current?.from != null &&
|
|
2744
|
+
(current.to == null || current.from.getTime() === current.to.getTime());
|
|
2745
|
+
if (isSingleDaySelected && current?.from?.getTime() === selectedDay.getTime()) {
|
|
2746
|
+
setInternalRange(undefined);
|
|
2747
|
+
onRangeSelect?.(undefined);
|
|
2748
|
+
onClear?.();
|
|
2749
|
+
return;
|
|
2750
|
+
}
|
|
2751
|
+
// Range completo (from ≠ to): reinicia a seleção com o dia clicado
|
|
2752
|
+
const isComplete = current?.from != null &&
|
|
2753
|
+
current?.to != null &&
|
|
2754
|
+
current.from.getTime() !== current.to.getTime();
|
|
2755
|
+
if (isComplete) {
|
|
2756
|
+
const fresh = { from: selectedDay, to: undefined };
|
|
2757
|
+
setInternalRange(fresh);
|
|
2758
|
+
onRangeSelect?.(fresh);
|
|
2759
|
+
return;
|
|
2760
|
+
}
|
|
2761
|
+
setInternalRange(range);
|
|
2762
|
+
onRangeSelect?.(range);
|
|
2504
2763
|
};
|
|
2505
2764
|
const handleMonthChange = (date) => {
|
|
2506
2765
|
setInternalDisplayMonth(date);
|
|
@@ -2547,18 +2806,20 @@ const Calendar = ({ selected, currentDate, defaultMonth, startMonth, endMonth, o
|
|
|
2547
2806
|
const sharedDayPickerProps = {
|
|
2548
2807
|
classNames: styles$r,
|
|
2549
2808
|
animate,
|
|
2550
|
-
mode: "single",
|
|
2551
|
-
selected: resolvedSelected,
|
|
2552
|
-
onSelect: handleSelect,
|
|
2553
2809
|
startMonth,
|
|
2554
2810
|
endMonth,
|
|
2555
2811
|
disabled: disabledMatchers.length > 0 ? disabledMatchers : undefined,
|
|
2556
2812
|
locale: resolvedLocale,
|
|
2557
2813
|
autoFocus,
|
|
2558
2814
|
"aria-label": ariaLabel,
|
|
2815
|
+
captionLayout: "label",
|
|
2816
|
+
numberOfMonths,
|
|
2817
|
+
month: resolvedDisplayMonth,
|
|
2818
|
+
onMonthChange: handleMonthChange,
|
|
2819
|
+
components: { MonthCaption: GridMonthCaption, Chevron: CustomChevron },
|
|
2559
2820
|
};
|
|
2560
2821
|
const containerStyle = { '--giro-scale': scale };
|
|
2561
|
-
return (jsxRuntime.jsx(GridCtx.Provider, { value: gridCtxValue, children: jsxRuntime.jsxs("div", { className: clsx(styles$r.calendar_grid_wrapper, className), style: { ...containerStyle, ...style }, children: [jsxRuntime.jsx(reactDayPicker.DayPicker, { id: id, ...sharedDayPickerProps, ...rest,
|
|
2822
|
+
return (jsxRuntime.jsx(GridCtx.Provider, { value: gridCtxValue, children: jsxRuntime.jsxs("div", { className: clsx(styles$r.calendar_grid_wrapper, className), style: { ...containerStyle, ...style }, children: [mode === "range" ? (jsxRuntime.jsx(reactDayPicker.DayPicker, { id: id, ...sharedDayPickerProps, ...rest, mode: "range", selected: resolvedRange, onSelect: handleRangeSelect })) : (jsxRuntime.jsx(reactDayPicker.DayPicker, { id: id, ...sharedDayPickerProps, ...rest, mode: "single", selected: resolvedSelected, onSelect: handleSelect })), gridView !== "days" && (jsxRuntime.jsxs("div", { className: `${styles$r.gridOverlay}${gridView === "years" ? ` ${styles$r.gridOverlayYears}` : ""}`, role: "dialog", "aria-modal": "true", "aria-label": gridView === "months" ? "Selecione o mês" : "Selecione o ano", children: [gridView === "months" && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs("div", { className: styles$r.gridOverlayCaption, children: [jsxRuntime.jsx("span", { className: styles$r.caption_grid_label, children: new Intl.DateTimeFormat(intlLocale, { month: "long" }).format(resolvedDisplayMonth) }), jsxRuntime.jsxs("button", { type: "button", className: styles$r.caption_grid_btn, onClick: () => setGridView("days"), "aria-label": "Fechar sele\u00E7\u00E3o de m\u00EAs", children: [displayedYear, jsxRuntime.jsx("span", { className: styles$r.chevron_wrapper, children: jsxRuntime.jsx(reactIcons.ChevronUp16Regular, { className: styles$r.caption_year_chevron, "aria-hidden": true }) })] })] }), jsxRuntime.jsx("div", { className: styles$r.gridCells, children: monthsGrid.map(({ index, label, disabled: monthDisabled }) => (jsxRuntime.jsx("button", { type: "button", disabled: monthDisabled, className: `${styles$r.gridCell}${displayedMonthIndex === index ? ` ${styles$r.gridCellActive}` : ""}`, onClick: () => handleGridMonthSelect(index), children: label }, index))) })] })), gridView === "years" && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs("div", { className: styles$r.gridOverlayCaption, children: [jsxRuntime.jsx("span", { className: styles$r.caption_grid_label, children: new Intl.DateTimeFormat(intlLocale, { month: "long" }).format(resolvedDisplayMonth) }), jsxRuntime.jsxs("button", { type: "button", className: styles$r.caption_grid_btn, onClick: () => setGridView("days"), "aria-label": "Fechar sele\u00E7\u00E3o de ano", children: [displayedYear, jsxRuntime.jsx("span", { className: styles$r.chevron_wrapper, children: jsxRuntime.jsx(reactIcons.ChevronUp16Regular, { className: styles$r.caption_year_chevron, "aria-hidden": true }) })] }), jsxRuntime.jsxs("div", { className: styles$r.gridOverlayYearsNav, children: [jsxRuntime.jsx("button", { type: "button", className: styles$r.gridNavBtn, disabled: !canGoPrevYears, onClick: () => setYearPageStart((s) => s - YEARS_PER_PAGE), "aria-label": "Anos anteriores", children: jsxRuntime.jsx("span", { className: styles$r.chevron_wrapper, children: jsxRuntime.jsx(reactIcons.ChevronLeft16Regular, { className: styles$r.chevronNavBtnPrev, "aria-hidden": true }) }) }), jsxRuntime.jsx("button", { type: "button", className: styles$r.gridNavBtn, disabled: !canGoNextYears, onClick: () => setYearPageStart((s) => s + YEARS_PER_PAGE), "aria-label": "Pr\u00F3ximos anos", children: jsxRuntime.jsx("span", { className: styles$r.chevron_wrapper, children: jsxRuntime.jsx(reactIcons.ChevronRight16Regular, { className: styles$r.chevronNavBtnNext, "aria-hidden": true }) }) })] })] }), jsxRuntime.jsx("div", { className: `${styles$r.gridCells} ${styles$r.gridCellsYears}`, children: yearsInPage.map((year) => (jsxRuntime.jsx("button", { type: "button", className: `${styles$r.gridCell}${displayedYear === year ? ` ${styles$r.gridCellActive}` : ""}`, onClick: () => handleGridYearSelect(year), children: year }, year))) })] }))] }))] }) }));
|
|
2562
2823
|
};
|
|
2563
2824
|
|
|
2564
2825
|
var styles$q = {"container":"Callout-module__container___dggFW","withTitle":"Callout-module__withTitle___e-HEg","brand":"Callout-module__brand___YHDPQ","success":"Callout-module__success___RPS0Q","alert":"Callout-module__alert___LVlJM","content":"Callout-module__content___g44Qz","icon":"Callout-module__icon___4CBkz","subcontent":"Callout-module__subcontent___5hz-f","title":"Callout-module__title___IPSdE","text":"Callout-module__text___0Ys48","dismiss":"Callout-module__dismiss___ZaycS"};
|
|
@@ -2618,7 +2879,15 @@ const Chips = ({ children, leftIcon, rightIcon, variant = 'neutral', disabled =
|
|
|
2618
2879
|
...style,
|
|
2619
2880
|
};
|
|
2620
2881
|
const isInteractive = typeof rest.onClick === 'function';
|
|
2621
|
-
|
|
2882
|
+
const { onKeyDown: userOnKeyDown, ...otherRest } = rest;
|
|
2883
|
+
const handleKeyDown = (e) => {
|
|
2884
|
+
userOnKeyDown?.(e);
|
|
2885
|
+
if (!e.defaultPrevented && isInteractive && !disabled && (e.key === 'Enter' || e.key === ' ')) {
|
|
2886
|
+
e.preventDefault();
|
|
2887
|
+
rest.onClick?.(e);
|
|
2888
|
+
}
|
|
2889
|
+
};
|
|
2890
|
+
return (jsxRuntime.jsxs("div", { className: chipsClass, "aria-disabled": disabled, style: colorStyle, role: isInteractive ? 'button' : undefined, tabIndex: isInteractive ? (disabled ? -1 : 0) : undefined, onKeyDown: handleKeyDown, ...otherRest, children: [leftIcon && (jsxRuntime.jsx("span", { className: styles$n.iconLeft, "aria-hidden": "true", children: leftIcon })), jsxRuntime.jsx("span", { className: styles$n.title, children: children }), rightIcon && (jsxRuntime.jsx("span", { className: styles$n.iconRight, "aria-hidden": "true", children: rightIcon }))] }));
|
|
2622
2891
|
};
|
|
2623
2892
|
const MemoizedChips = React.memo(Chips);
|
|
2624
2893
|
MemoizedChips.displayName = 'Chips';
|
|
@@ -2629,10 +2898,10 @@ function Container({ children, className }) {
|
|
|
2629
2898
|
return (jsxRuntime.jsx("main", { className: clsx(styles$m['container'], 'mx-auto', className), children: children }));
|
|
2630
2899
|
}
|
|
2631
2900
|
|
|
2632
|
-
var styles$l = {"Content":"Popover-module__Content___RIETg"};
|
|
2901
|
+
var styles$l = {"Content":"Popover-module__Content___RIETg","Arrow":"Popover-module__Arrow___ue4Mg"};
|
|
2633
2902
|
|
|
2634
2903
|
const Popover = ({ trigger, content, side = "left", align = "start", sideOffset = 8, open, onOpenChange, asAnchor = false, onOpenAutoFocus, onCloseAutoFocus, showArrow = false, className, ...rest }) => {
|
|
2635
|
-
return (jsxRuntime.jsxs(radixUi.Popover.Root, { open: open, onOpenChange: onOpenChange, ...rest, children: [asAnchor ? (jsxRuntime.jsx(radixUi.Popover.Anchor, { asChild: true, children: trigger })) : (jsxRuntime.jsx(radixUi.Popover.Trigger, { asChild: true, children: trigger })), jsxRuntime.jsx(radixUi.Popover.Portal, { children: jsxRuntime.jsxs(radixUi.Popover.Content, { className: clsx(styles$l.Content, className), sideOffset: sideOffset, side: side, align: align, onOpenAutoFocus: asAnchor ? (e) => e.preventDefault() : onOpenAutoFocus, onCloseAutoFocus: asAnchor ? (e) => e.preventDefault() : onCloseAutoFocus, onInteractOutside: asAnchor ? (e) => e.preventDefault() : undefined, children: [content, showArrow && jsxRuntime.jsx(radixUi.Popover.Arrow, {})] }) })] }));
|
|
2904
|
+
return (jsxRuntime.jsxs(radixUi.Popover.Root, { open: open, onOpenChange: onOpenChange, ...rest, children: [asAnchor ? (jsxRuntime.jsx(radixUi.Popover.Anchor, { asChild: true, children: trigger })) : (jsxRuntime.jsx(radixUi.Popover.Trigger, { asChild: true, children: trigger })), jsxRuntime.jsx(radixUi.Popover.Portal, { children: jsxRuntime.jsxs(radixUi.Popover.Content, { className: clsx(styles$l.Content, className), sideOffset: sideOffset, side: side, align: align, onOpenAutoFocus: asAnchor ? (e) => e.preventDefault() : onOpenAutoFocus, onCloseAutoFocus: asAnchor ? (e) => e.preventDefault() : onCloseAutoFocus, onInteractOutside: asAnchor ? (e) => e.preventDefault() : undefined, children: [content, showArrow && jsxRuntime.jsx(radixUi.Popover.Arrow, { className: styles$l.Arrow })] }) })] }));
|
|
2636
2905
|
};
|
|
2637
2906
|
|
|
2638
2907
|
function useInputKeyboardValue(externalRef) {
|
|
@@ -2831,7 +3100,7 @@ const ACCENT_OPTIONS = {
|
|
|
2831
3100
|
* <VirtualKeyboard targetRef={inputRef} value={value} onChange={setValue} />
|
|
2832
3101
|
* ```
|
|
2833
3102
|
*/
|
|
2834
|
-
const VirtualKeyboard = ({ variant = 'native', type = 'default', value = '', onChange, onKeyPress, onTypeChange, maxLength, Emoji = false, className, id,
|
|
3103
|
+
const VirtualKeyboard = ({ variant = 'native', type = 'default', value = '', onChange, onKeyPress, onTypeChange, maxLength, Emoji = false, className, id, placeholder = 'Digite aqui...', helperText, error, errorMessage, targetRef, textFieldScale = 1, showEnterKey = true, showTypeSwitchKey = true, }) => {
|
|
2835
3104
|
const [layoutName, setLayoutName] = React.useState('default');
|
|
2836
3105
|
const [capsLockOn, setCapsLockOn] = React.useState(false);
|
|
2837
3106
|
const [accentMenu, setAccentMenu] = React.useState(null);
|
|
@@ -3346,7 +3615,7 @@ const VirtualKeyboard = ({ variant = 'native', type = 'default', value = '', onC
|
|
|
3346
3615
|
if (variant === 'native' && typeof document !== 'undefined') {
|
|
3347
3616
|
return reactDom.createPortal(jsxRuntime.jsx("div", { id: id, className: clsx(styles$k.overlay, { [styles$k.overlayOpen]: isOpen }, styles$k[`layout--${visualType}`], className), children: keyboardEl }), document.body);
|
|
3348
3617
|
}
|
|
3349
|
-
return (jsxRuntime.jsxs("div", { id: id, className: clsx(styles$k.container, styles$k[`mode--${variant}`], styles$k[`layout--${visualType}`], className), children: [variant === 'fixed' && (jsxRuntime.jsx("div", { className: styles$k.textFieldContainer, children: jsxRuntime.jsx(TextField, { placeholder:
|
|
3618
|
+
return (jsxRuntime.jsxs("div", { id: id, className: clsx(styles$k.container, styles$k[`mode--${variant}`], styles$k[`layout--${visualType}`], className), children: [variant === 'fixed' && (jsxRuntime.jsx("div", { className: styles$k.textFieldContainer, children: jsxRuntime.jsx(TextField, { placeholder: placeholder, value: value, onChange: onChange, helperText: helperText, error: error, errorMessage: errorMessage, readOnly: true, disableAutoComplete: true, maxLength: maxLength, attachedToVirtualKeyboard: true, className: styles$k.textFieldWrapper, scale: textFieldScale }) })), keyboardEl] }));
|
|
3350
3619
|
};
|
|
3351
3620
|
|
|
3352
3621
|
var styles$j = {"container":"TextField-module__container___WJHFR","inputWrapper":"TextField-module__inputWrapper___INjfd","inputContainer":"TextField-module__inputContainer___3EsFJ","icon":"TextField-module__icon___p1vwi","clearButton":"TextField-module__clearButton___kgOot","inputWithIcon":"TextField-module__inputWithIcon___shqkL","helperText":"TextField-module__helperText___d5QGC","error":"TextField-module__error___IGQzp","disabled":"TextField-module__disabled___roIKP","attachedToVirtualKeyboard":"TextField-module__attachedToVirtualKeyboard___fuO2O","errorWithMessage":"TextField-module__errorWithMessage___m-5AA","clearButtonIcon":"TextField-module__clearButtonIcon___Z2iyc"};
|
|
@@ -3375,7 +3644,7 @@ const LabelComponent = ({ children, htmlFor, required = false, tooltip = false,
|
|
|
3375
3644
|
return container;
|
|
3376
3645
|
};
|
|
3377
3646
|
|
|
3378
|
-
const TextField$1 =
|
|
3647
|
+
const TextField$1 = ({ ref, className, style, value, label, placeholder, type = 'text', onChange, disabled = false, maxLength, required = false, helperText, tooltipText, tooltipSide = 'bottom', tooltipAlign = 'start', errorMessage, error, id, icon, scale = 1, onBlur, onFocus, name, persistIcon = false, virtualKeyboard, attachedToVirtualKeyboard, disableAutoComplete = false, ...rest }) => {
|
|
3379
3648
|
const normalizeValue = (val) => {
|
|
3380
3649
|
return val === undefined || val === null ? '' : String(val);
|
|
3381
3650
|
};
|
|
@@ -3426,7 +3695,7 @@ const TextField$1 = React.forwardRef(({ className, style, value, label, placehol
|
|
|
3426
3695
|
setIsFocused(true);
|
|
3427
3696
|
onFocus?.(e);
|
|
3428
3697
|
}, [onFocus]);
|
|
3429
|
-
const showCustomIcon = inputValue.trim().length === 0 && icon;
|
|
3698
|
+
const showCustomIcon = (inputValue.trim().length === 0 || persistIcon) && icon;
|
|
3430
3699
|
const showClearIcon = isFocused && inputValue.trim().length > 0;
|
|
3431
3700
|
const hasError = Boolean(inputError) || Boolean(error);
|
|
3432
3701
|
const displayHelperText = (error ? errorMessage : undefined) || inputError || helperText || '\u00A0';
|
|
@@ -3436,14 +3705,13 @@ const TextField$1 = React.forwardRef(({ className, style, value, label, placehol
|
|
|
3436
3705
|
? `${componentId}-helper`
|
|
3437
3706
|
: undefined;
|
|
3438
3707
|
const containerStyle = { '--giro-scale': scale };
|
|
3439
|
-
const containerClass = clsx(styles$j.container, {
|
|
3708
|
+
const containerClass = clsx(styles$j.container, className, {
|
|
3440
3709
|
[styles$j.attachedToVirtualKeyboard]: attachedToVirtualKeyboard,
|
|
3441
3710
|
[styles$j.disabled]: disabled,
|
|
3442
3711
|
[styles$j.error]: error,
|
|
3443
3712
|
[styles$j.errorWithMessage]: !!errorMessage,
|
|
3444
|
-
[className]: className,
|
|
3445
3713
|
});
|
|
3446
|
-
return (jsxRuntime.jsxs("div", { className: containerClass, style: { ...containerStyle, ...style }, children: [label && (jsxRuntime.jsx(LabelComponent, { scale: scale, htmlFor: componentId, required: required, tooltip:
|
|
3714
|
+
return (jsxRuntime.jsxs("div", { className: containerClass, style: { ...containerStyle, ...style }, children: [label && (jsxRuntime.jsx(LabelComponent, { scale: scale, htmlFor: componentId, required: required, tooltip: !!tooltipText, tooltipText: tooltipText, side: tooltipSide, align: tooltipAlign, error: hasError, disabled: disabled, children: label })), jsxRuntime.jsxs("div", { className: styles$j.inputWrapper, children: [jsxRuntime.jsxs("div", { className: styles$j.inputContainer, children: [jsxRuntime.jsx("input", { ...rest, ref: setInputRefs, id: componentId, name: name, type: type, value: inputValue, placeholder: placeholder, onChange: handleChange, onFocus: handleFocus, onBlur: handleBlur, maxLength: maxLength, disabled: disabled, "aria-invalid": hasError, "aria-required": required, "aria-describedby": helperId, inputMode: (virtualKeyboard === 'default' || virtualKeyboard === 'numeric') ? 'none' : rest.inputMode, autoComplete: (disableAutoComplete || virtualKeyboard === 'default' || virtualKeyboard === 'numeric') ? 'off' : rest.autoComplete, className: clsx({
|
|
3447
3715
|
[styles$j.inputWithIcon]: showCustomIcon || showClearIcon,
|
|
3448
3716
|
}) }), showCustomIcon && jsxRuntime.jsx("span", { className: styles$j.icon, children: icon }), showClearIcon && (jsxRuntime.jsx("button", { type: "button", className: styles$j.clearButton, onMouseDown: (e) => {
|
|
3449
3717
|
e.preventDefault();
|
|
@@ -3454,7 +3722,7 @@ const TextField$1 = React.forwardRef(({ className, style, value, label, placehol
|
|
|
3454
3722
|
onChange?.(val);
|
|
3455
3723
|
}
|
|
3456
3724
|
} }) }))] }));
|
|
3457
|
-
}
|
|
3725
|
+
};
|
|
3458
3726
|
TextField$1.displayName = 'TextField';
|
|
3459
3727
|
var TextField = React.memo(TextField$1);
|
|
3460
3728
|
|
|
@@ -3784,7 +4052,7 @@ const matchesAccept = (file, accept) => {
|
|
|
3784
4052
|
return fileType === type;
|
|
3785
4053
|
});
|
|
3786
4054
|
};
|
|
3787
|
-
const FileUpload =
|
|
4055
|
+
const FileUpload = ({ ref, value, onChange, helperText, error = false, errorMessage, maxFileSize, maxFilesQuantity, disabled = false, className, id, accept, multiple = true, description = 'Clique ou arraste os arquivos aqui', descriptionErrorMessage = 'Falha ao subir um ou mais arquivos.', ...rest }) => {
|
|
3788
4056
|
const generatedId = React.useId();
|
|
3789
4057
|
const componentId = id || generatedId;
|
|
3790
4058
|
const helperId = `${componentId}-helper`;
|
|
@@ -3919,12 +4187,12 @@ const FileUpload = React.forwardRef(({ value, onChange, helperText, error = fals
|
|
|
3919
4187
|
}
|
|
3920
4188
|
}, children: jsxRuntime.jsx(reactIcons.Dismiss16Regular, { "aria-hidden": "true" }) })] }, `${file.name}-${index}`));
|
|
3921
4189
|
}) }))] }), displayedHelper && (jsxRuntime.jsx("span", { id: helperId, role: isError ? 'alert' : undefined, className: clsx(styles$e.helperText, isError && styles$e.errorText), children: displayedHelper }))] }));
|
|
3922
|
-
}
|
|
4190
|
+
};
|
|
3923
4191
|
FileUpload.displayName = 'FileUpload';
|
|
3924
4192
|
|
|
3925
4193
|
var styles$d = {"container":"Filter-module__container___cqntK","panel":"Filter-module__panel___19HqD","search":"Filter-module__search___f0gzj","list":"Filter-module__list___UpBk1","item":"Filter-module__item___oNdeY","itemSelected":"Filter-module__itemSelected___JIpJV","itemText":"Filter-module__itemText___RS--0","itemDisabled":"Filter-module__itemDisabled___X-ktg","itemIcon":"Filter-module__itemIcon___RjJSa","noResults":"Filter-module__noResults___3m6pn","footer":"Filter-module__footer___yYS5j","buttonContent":"Filter-module__buttonContent___28fKe","buttonArrow":"Filter-module__buttonArrow___VJlpc","buttonIcon":"Filter-module__buttonIcon___OOBpZ","triggerWrapper":"Filter-module__triggerWrapper___ptPRL","triggerContent":"Filter-module__triggerContent___LYo9j","body":"Filter-module__body___qsyhk","combinedFooter":"Filter-module__combinedFooter___kTnHP"};
|
|
3926
4194
|
|
|
3927
|
-
const Combined = ({ buttonText = 'Filtrar', icon, variant = 'outlined', disabled = false, className, title = 'Filtrar', drawerWidth = "fit-content",
|
|
4195
|
+
const Combined = ({ buttonText = 'Filtrar', icon, variant = 'outlined', disabled = false, className, title = 'Filtrar', drawerWidth = "fit-content", appliedFilterCount = 0, drawerHeaderContent, children, onApply, onClear, onOpen, onClose, id, ...rest }) => {
|
|
3928
4196
|
const [isOpen, setIsOpen] = React.useState(false);
|
|
3929
4197
|
const handleOpen = React.useCallback(() => {
|
|
3930
4198
|
setIsOpen(true);
|
|
@@ -3941,12 +4209,12 @@ const Combined = ({ buttonText = 'Filtrar', icon, variant = 'outlined', disabled
|
|
|
3941
4209
|
const handleClear = React.useCallback(() => {
|
|
3942
4210
|
onClear?.();
|
|
3943
4211
|
}, [onClear]);
|
|
3944
|
-
return (jsxRuntime.jsxs("div", { className: clsx(styles$d.triggerWrapper, className), id: id, ...rest, children: [jsxRuntime.jsx(Button, { variant: variant, disabled: disabled, icon: icon ?? jsxRuntime.jsx(reactIcons.FilterRegular, {}), iconPosition: "left", onClick: handleOpen, children: jsxRuntime.jsxs("span", { className: styles$d.triggerContent, children: [buttonText,
|
|
4212
|
+
return (jsxRuntime.jsxs("div", { className: clsx(styles$d.triggerWrapper, className), id: id, ...rest, children: [jsxRuntime.jsx(Button, { variant: variant, disabled: disabled, icon: icon ?? jsxRuntime.jsx(reactIcons.FilterRegular, {}), iconPosition: "left", onClick: handleOpen, children: jsxRuntime.jsxs("span", { className: styles$d.triggerContent, children: [buttonText, appliedFilterCount > 0 && (jsxRuntime.jsx(Badge, { badgeValue: appliedFilterCount, filterVariant: true }))] }) }), jsxRuntime.jsx(Drawer, { isOpen: isOpen, onClose: handleClose, title: title, customWidth: drawerWidth, closeOnOverlayClick: true, closeOnEscape: true, headerContent: drawerHeaderContent, footer: jsxRuntime.jsxs("div", { className: styles$d.combinedFooter, children: [jsxRuntime.jsx(Button, { variant: "outlined", onClick: handleClear, children: "Limpar" }), jsxRuntime.jsx(Button, { onClick: handleApply, children: "Aplicar" })] }), children: jsxRuntime.jsx("div", { className: styles$d.body, children: children }) })] }));
|
|
3945
4213
|
};
|
|
3946
4214
|
|
|
3947
4215
|
var styles$c = {"search":"Search-module__search___u3QsV","searchLeftIcon":"Search-module__searchLeftIcon___OKOBq","disabled":"Search-module__disabled___adbxO","inputWithClearIcon":"Search-module__inputWithClearIcon___cqvkq","searchClearIcon":"Search-module__searchClearIcon___qX9-h"};
|
|
3948
4216
|
|
|
3949
|
-
const Search =
|
|
4217
|
+
const Search = ({ ref, placeholder = 'Dica do que deve ser buscado', disabled = false, value, onChange, onKeyDown, onFocus, onBlur, onClear, onClick, onMouseDown, searchMode = 'instant', onSearch, id, scale = 1, className, style, virtualKeyboard, 'data-testid': testId, ...rest }) => {
|
|
3950
4218
|
const [internalValue, setInternalValue] = React.useState('');
|
|
3951
4219
|
const { internalRef: inputRef, setRefs: setInputRefs } = useInputKeyboardValue(ref);
|
|
3952
4220
|
const isControlled = value !== undefined && onChange !== undefined;
|
|
@@ -4018,7 +4286,7 @@ const Search = React.forwardRef(({ placeholder = 'Dica do que deve ser buscado',
|
|
|
4018
4286
|
setInternalValue(val);
|
|
4019
4287
|
}
|
|
4020
4288
|
} }) }))] }));
|
|
4021
|
-
}
|
|
4289
|
+
};
|
|
4022
4290
|
Search.displayName = 'Search';
|
|
4023
4291
|
|
|
4024
4292
|
const Simple = ({ items, type = 'multiple', selectedIds, onApplyFilter, placeholder = 'Selecionar...', enableSearch = false, buttonText = 'Filter', icon, variant = 'outlined', onOpen, onClose, side = 'bottom', align = 'start', disabled = false, className, selectedDate, onDateSelect, onClearDate, minDate, maxDate, locale = 'pt-br', id, ...rest }) => {
|
|
@@ -4137,42 +4405,38 @@ const Filter = ({ mode = 'simple', ...props }) => {
|
|
|
4137
4405
|
return jsxRuntime.jsx(Simple, { ...props });
|
|
4138
4406
|
};
|
|
4139
4407
|
|
|
4140
|
-
var styles$b = {"
|
|
4141
|
-
|
|
4142
|
-
var styles$a = {"root":"Radio-module__root___7ElY2","wrapper":"Radio-module__wrapper___NYQ1y","disabled":"Radio-module__disabled___RZ0be","labelText":"Radio-module__labelText___Wkb41","item":"Radio-module__item___3Kvj7","itemWrapper":"Radio-module__itemWrapper___5KbM1","labelWrapper":"Radio-module__labelWrapper___LOHmJ","indicator":"Radio-module__indicator___TJ5hz"};
|
|
4143
|
-
|
|
4144
|
-
const Radio = ({ items, onValueChange, defaultValue, name, id, ariaLabel, orientation = 'vertical', scale = 1, className, style, ...rest }) => {
|
|
4145
|
-
const generatedId = React.useId();
|
|
4146
|
-
const componentId = id || generatedId;
|
|
4147
|
-
return (jsxRuntime.jsx(radixUi.RadioGroup.Root, { id: componentId, className: clsx(styles$a.root, className), style: { '--giro-scale': scale, ...style }, defaultValue: defaultValue, onValueChange: onValueChange, name: name, "aria-label": ariaLabel, "data-orientation": orientation, orientation: orientation, ...rest, children: items.map(({ id, value, disabled, label }) => {
|
|
4148
|
-
const itemKey = id ?? value;
|
|
4149
|
-
const uniqueId = `${componentId}-item-${value}`;
|
|
4150
|
-
return (jsxRuntime.jsx("div", { className: clsx(styles$a.wrapper, { [styles$a.disabled]: disabled }), children: jsxRuntime.jsxs("label", { className: styles$a.labelWrapper, htmlFor: uniqueId, children: [jsxRuntime.jsx("div", { className: styles$a.itemWrapper, children: jsxRuntime.jsx(radixUi.RadioGroup.Item, { disabled: disabled, className: styles$a.item, value: value, id: uniqueId, "data-disabled": disabled, children: jsxRuntime.jsx(radixUi.RadioGroup.Indicator, { className: styles$a.indicator }) }) }), jsxRuntime.jsx("span", { className: styles$a.labelText, children: label })] }) }, itemKey));
|
|
4151
|
-
}) }));
|
|
4152
|
-
};
|
|
4408
|
+
var styles$b = {"listItem":"ListItem-module__listItem___ljWE5","listItemRow":"ListItem-module__listItemRow___Ur5aJ","listItem-checkbox":"ListItem-module__listItem-checkbox___-cn1b","listItem-icon":"ListItem-module__listItem-icon___B-LXx","listItem-text":"ListItem-module__listItem-text___pLRU7","listItemDisabled":"ListItem-module__listItemDisabled___8gsyb","listItemWrapperText":"ListItem-module__listItemWrapperText___tT-Yj","listItemWrapperIcon":"ListItem-module__listItemWrapperIcon___qK4Ct","listItemTitle":"ListItem-module__listItemTitle___lpf-A","listItemSubtext":"ListItem-module__listItemSubtext___WDxHE","listItemChevron":"ListItem-module__listItemChevron___fCuqf","listItemChevronExpanded":"ListItem-module__listItemChevronExpanded___HYTON","listItemChildren":"ListItem-module__listItemChildren___H3Vur"};
|
|
4153
4409
|
|
|
4154
|
-
const ListItem = ({ id, className, variant = 'text', text,
|
|
4410
|
+
const ListItem = ({ id, className, variant = 'text', text, subText, disabled = false, checked = false, selected = false, onClick, onChange, icon, customWidth, scale = 1, children, defaultExpanded = false, expanded, onExpandedChange, ...rest }) => {
|
|
4155
4411
|
const componentId = React.useId();
|
|
4156
4412
|
const itemId = id || componentId;
|
|
4157
4413
|
const [internalChecked, setInternalChecked] = React.useState(checked);
|
|
4158
4414
|
const [internalSelected, setInternalSelected] = React.useState(selected);
|
|
4415
|
+
const [internalExpanded, setInternalExpanded] = React.useState(expanded ?? defaultExpanded);
|
|
4416
|
+
const [childrenCheckedMap, setChildrenCheckedMap] = React.useState({});
|
|
4417
|
+
const childrenCount = variant === 'checkbox'
|
|
4418
|
+
? React.Children.toArray(children).filter(child => React.isValidElement(child) && !child.props.disabled).length
|
|
4419
|
+
: 0;
|
|
4420
|
+
const checkedCount = Object.values(childrenCheckedMap).filter(Boolean).length;
|
|
4421
|
+
const isIndeterminate = childrenCount > 0 && checkedCount > 0 && checkedCount < childrenCount;
|
|
4422
|
+
const hasChildren = React.Children.count(children) > 0;
|
|
4159
4423
|
const handleCheckboxClick = React.useCallback((e) => {
|
|
4160
4424
|
if (disabled)
|
|
4161
4425
|
return;
|
|
4162
|
-
const newChecked = !internalChecked;
|
|
4426
|
+
const newChecked = isIndeterminate ? true : !internalChecked;
|
|
4163
4427
|
setInternalChecked(newChecked);
|
|
4164
|
-
|
|
4165
|
-
|
|
4166
|
-
|
|
4167
|
-
|
|
4168
|
-
|
|
4169
|
-
|
|
4170
|
-
|
|
4171
|
-
|
|
4172
|
-
onChange?.(true);
|
|
4428
|
+
if (childrenCount > 0) {
|
|
4429
|
+
const newMap = {};
|
|
4430
|
+
React.Children.forEach(children, (child, index) => {
|
|
4431
|
+
if (React.isValidElement(child) && !child.props.disabled) {
|
|
4432
|
+
newMap[index] = newChecked;
|
|
4433
|
+
}
|
|
4434
|
+
});
|
|
4435
|
+
setChildrenCheckedMap(newMap);
|
|
4173
4436
|
}
|
|
4437
|
+
onChange?.(newChecked);
|
|
4174
4438
|
onClick?.(e);
|
|
4175
|
-
}, [disabled, internalChecked, onChange, onClick]);
|
|
4439
|
+
}, [disabled, internalChecked, isIndeterminate, childrenCount, onChange, onClick, children]);
|
|
4176
4440
|
const handleTextOrIconClick = React.useCallback((e) => {
|
|
4177
4441
|
if (disabled)
|
|
4178
4442
|
return;
|
|
@@ -4180,16 +4444,55 @@ const ListItem = ({ id, className, variant = 'text', text, name, subText, disabl
|
|
|
4180
4444
|
setInternalSelected(newSelected);
|
|
4181
4445
|
onClick?.(e);
|
|
4182
4446
|
}, [disabled, internalSelected, onClick]);
|
|
4447
|
+
const handleChildChange = React.useCallback((index, childChecked) => {
|
|
4448
|
+
setChildrenCheckedMap(prev => {
|
|
4449
|
+
const next = { ...prev, [index]: childChecked };
|
|
4450
|
+
const total = childrenCount;
|
|
4451
|
+
const checked = Object.values(next).filter(Boolean).length;
|
|
4452
|
+
if (checked === 0) {
|
|
4453
|
+
setInternalChecked(false);
|
|
4454
|
+
onChange?.(false);
|
|
4455
|
+
}
|
|
4456
|
+
else if (checked === total) {
|
|
4457
|
+
setInternalChecked(true);
|
|
4458
|
+
onChange?.(true);
|
|
4459
|
+
}
|
|
4460
|
+
return next;
|
|
4461
|
+
});
|
|
4462
|
+
}, [childrenCount, onChange]);
|
|
4463
|
+
const handleClick = React.useCallback((e) => {
|
|
4464
|
+
if (hasChildren) {
|
|
4465
|
+
if (disabled)
|
|
4466
|
+
return;
|
|
4467
|
+
const newExpanded = !internalExpanded;
|
|
4468
|
+
setInternalExpanded(newExpanded);
|
|
4469
|
+
onExpandedChange?.(newExpanded);
|
|
4470
|
+
return;
|
|
4471
|
+
}
|
|
4472
|
+
switch (variant) {
|
|
4473
|
+
case 'checkbox':
|
|
4474
|
+
handleCheckboxClick(e);
|
|
4475
|
+
break;
|
|
4476
|
+
case 'text':
|
|
4477
|
+
case 'icon':
|
|
4478
|
+
default:
|
|
4479
|
+
handleTextOrIconClick(e);
|
|
4480
|
+
break;
|
|
4481
|
+
}
|
|
4482
|
+
}, [hasChildren, disabled, internalExpanded, onExpandedChange, variant, handleCheckboxClick, handleTextOrIconClick]);
|
|
4183
4483
|
const handleKeyDown = React.useCallback((e) => {
|
|
4184
4484
|
if (!disabled && (e.key === 'Enter' || e.key === ' ')) {
|
|
4185
4485
|
e.preventDefault();
|
|
4486
|
+
if (hasChildren) {
|
|
4487
|
+
const newExpanded = !internalExpanded;
|
|
4488
|
+
setInternalExpanded(newExpanded);
|
|
4489
|
+
onExpandedChange?.(newExpanded);
|
|
4490
|
+
return;
|
|
4491
|
+
}
|
|
4186
4492
|
switch (variant) {
|
|
4187
4493
|
case 'checkbox':
|
|
4188
4494
|
handleCheckboxClick(e);
|
|
4189
4495
|
break;
|
|
4190
|
-
case 'radio':
|
|
4191
|
-
handleRadioClick(e);
|
|
4192
|
-
break;
|
|
4193
4496
|
case 'text':
|
|
4194
4497
|
case 'icon':
|
|
4195
4498
|
default:
|
|
@@ -4197,54 +4500,80 @@ const ListItem = ({ id, className, variant = 'text', text, name, subText, disabl
|
|
|
4197
4500
|
break;
|
|
4198
4501
|
}
|
|
4199
4502
|
}
|
|
4200
|
-
}, [disabled, variant, handleCheckboxClick,
|
|
4503
|
+
}, [disabled, hasChildren, internalExpanded, onExpandedChange, variant, handleCheckboxClick, handleTextOrIconClick]);
|
|
4201
4504
|
React.useEffect(() => {
|
|
4202
4505
|
setInternalChecked(checked);
|
|
4203
4506
|
}, [checked]);
|
|
4204
4507
|
React.useEffect(() => {
|
|
4205
4508
|
setInternalSelected(selected);
|
|
4206
4509
|
}, [selected]);
|
|
4510
|
+
React.useEffect(() => {
|
|
4511
|
+
if (expanded !== undefined)
|
|
4512
|
+
setInternalExpanded(expanded);
|
|
4513
|
+
}, [expanded]);
|
|
4514
|
+
React.useEffect(() => {
|
|
4515
|
+
if (!internalExpanded || variant !== 'checkbox' || childrenCount === 0)
|
|
4516
|
+
return;
|
|
4517
|
+
setChildrenCheckedMap(prev => {
|
|
4518
|
+
let changed = false;
|
|
4519
|
+
const next = { ...prev };
|
|
4520
|
+
React.Children.forEach(children, (child, index) => {
|
|
4521
|
+
if (React.isValidElement(child) && !child.props.disabled && !(index in next)) {
|
|
4522
|
+
next[index] = internalChecked;
|
|
4523
|
+
changed = true;
|
|
4524
|
+
}
|
|
4525
|
+
});
|
|
4526
|
+
return changed ? next : prev;
|
|
4527
|
+
});
|
|
4528
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
4529
|
+
}, [internalExpanded, childrenCount, variant]);
|
|
4207
4530
|
const renderVariantContent = React.useCallback(() => {
|
|
4208
|
-
const validVariants = ['text', 'checkbox', '
|
|
4531
|
+
const validVariants = ['text', 'checkbox', 'icon'];
|
|
4209
4532
|
const currentVariant = validVariants.includes(variant) ? variant : 'text';
|
|
4210
4533
|
switch (currentVariant) {
|
|
4211
4534
|
case 'checkbox':
|
|
4212
|
-
return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(Checkbox, { checked: internalChecked, disabled: disabled, onCheckedChange: () => handleCheckboxClick({}) }), jsxRuntime.jsxs("div", { className: styles$b
|
|
4213
|
-
case 'radio':
|
|
4214
|
-
return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("div", { className: styles$b['zds-list-item__wrapper-radio'], children: jsxRuntime.jsx("span", { className: styles$b['zds-list-item__radio'], "aria-hidden": "true", children: jsxRuntime.jsx(Radio, { name: name, onValueChange: () => handleRadioClick({}), items: [{
|
|
4215
|
-
value: value || '',
|
|
4216
|
-
label: '',
|
|
4217
|
-
disabled: disabled
|
|
4218
|
-
}], "aria-labelledby": `${itemId}-text` }) }) }), jsxRuntime.jsxs("div", { className: styles$b['zds-list-item__wrapper-text'], children: [jsxRuntime.jsx("span", { id: `${itemId}-text`, className: styles$b['zds-list-item__title'], onClick: handleRadioClick, children: text }), showSubText && subText && (jsxRuntime.jsx("span", { id: `${itemId}-subtext`, className: styles$b['zds-list-item__subtext'], children: subText }))] })] }));
|
|
4535
|
+
return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("span", { "aria-hidden": "true", onClick: hasChildren ? (e) => e.stopPropagation() : undefined, children: jsxRuntime.jsx(Checkbox, { checked: internalChecked, indeterminate: isIndeterminate, disabled: disabled, scale: scale, onCheckedChange: () => handleCheckboxClick({}) }) }), jsxRuntime.jsxs("div", { className: styles$b.listItemWrapperText, children: [jsxRuntime.jsx("span", { id: `${itemId}-text`, className: styles$b.listItemTitle, onClick: hasChildren ? (e) => { e.stopPropagation(); handleCheckboxClick(e); } : undefined, children: text }), subText && (jsxRuntime.jsx("span", { id: `${itemId}-subtext`, className: styles$b.listItemSubtext, children: subText }))] })] }));
|
|
4219
4536
|
case 'icon':
|
|
4220
|
-
return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("div", { className: styles$b
|
|
4537
|
+
return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("div", { className: styles$b.listItemWrapperIcon, children: icon }), jsxRuntime.jsxs("div", { className: styles$b.listItemWrapperText, children: [jsxRuntime.jsx("span", { id: `${itemId}-text`, className: styles$b.listItemTitle, children: text }), subText && (jsxRuntime.jsx("span", { id: `${itemId}-subtext`, className: styles$b.listItemSubtext, children: subText }))] })] }));
|
|
4221
4538
|
case 'text':
|
|
4222
4539
|
default:
|
|
4223
|
-
return (jsxRuntime.jsxs("div", { className: styles$b
|
|
4540
|
+
return (jsxRuntime.jsxs("div", { className: styles$b.listItemWrapperText, children: [jsxRuntime.jsx("span", { id: `${itemId}-text`, className: styles$b.listItemTitle, children: text }), subText && (jsxRuntime.jsx("span", { id: `${itemId}-subtext`, className: styles$b.listItemSubtext, children: subText }))] }));
|
|
4224
4541
|
}
|
|
4225
|
-
}, [variant, itemId, internalChecked, disabled, handleCheckboxClick,
|
|
4226
|
-
const listItemClass = clsx(styles$b
|
|
4227
|
-
[styles$b[`
|
|
4228
|
-
[styles$b
|
|
4229
|
-
[styles$b['zds-list-item--hovered']]: hovered,
|
|
4542
|
+
}, [variant, itemId, internalChecked, isIndeterminate, disabled, handleCheckboxClick, text, subText, icon, scale, hasChildren]);
|
|
4543
|
+
const listItemClass = clsx(styles$b.listItem, {
|
|
4544
|
+
[styles$b[`listItem-${variant}`]]: variant,
|
|
4545
|
+
[styles$b.listItemDisabled]: disabled,
|
|
4230
4546
|
[className || '']: className
|
|
4231
4547
|
});
|
|
4232
|
-
const
|
|
4233
|
-
|
|
4234
|
-
|
|
4235
|
-
|
|
4236
|
-
|
|
4237
|
-
|
|
4238
|
-
|
|
4548
|
+
const ariaChecked = variant === 'checkbox' ? internalChecked : undefined;
|
|
4549
|
+
const ariaRole = variant === 'checkbox' ? 'checkbox' : 'option';
|
|
4550
|
+
return (jsxRuntime.jsxs("li", { id: itemId, className: listItemClass, "data-testid": "list-item", style: {
|
|
4551
|
+
'--giro-scale': scale,
|
|
4552
|
+
...(customWidth != null ? { width: customWidth } : {}),
|
|
4553
|
+
}, ...rest, children: [jsxRuntime.jsxs("div", { role: ariaRole, className: styles$b.listItemRow, tabIndex: disabled ? -1 : 0, onClick: handleClick, onKeyDown: handleKeyDown, "aria-selected": variant === 'text' || variant === 'icon' ? internalSelected : undefined, "aria-disabled": disabled, "aria-checked": ariaChecked, "aria-expanded": hasChildren ? internalExpanded : undefined, "aria-labelledby": `${itemId}-text`, "aria-describedby": subText ? `${itemId}-subtext` : undefined, children: [renderVariantContent(), hasChildren && (jsxRuntime.jsx("span", { "data-testid": "list-item-chevron", "aria-hidden": "true", className: clsx(styles$b.listItemChevron, {
|
|
4554
|
+
[styles$b.listItemChevronExpanded]: internalExpanded,
|
|
4555
|
+
}), children: jsxRuntime.jsx(reactIcons.ChevronDown16Regular, {}) }))] }), hasChildren && internalExpanded && (jsxRuntime.jsx("ul", { className: styles$b.listItemChildren, role: "group", children: variant === 'checkbox'
|
|
4556
|
+
? React.Children.map(children, (child, index) => React.isValidElement(child)
|
|
4557
|
+
? React.cloneElement(child, {
|
|
4558
|
+
checked: child.props.disabled
|
|
4559
|
+
? child.props.checked
|
|
4560
|
+
: (childrenCheckedMap[index] ?? internalChecked),
|
|
4561
|
+
onChange: (childChecked) => {
|
|
4562
|
+
child.props.onChange?.(childChecked);
|
|
4563
|
+
handleChildChange(index, childChecked);
|
|
4564
|
+
},
|
|
4565
|
+
})
|
|
4566
|
+
: child)
|
|
4567
|
+
: children }))] }));
|
|
4239
4568
|
};
|
|
4240
4569
|
|
|
4241
|
-
var styles$
|
|
4570
|
+
var styles$a = {"content":"Menu-module__content___pnDF6","subContent":"Menu-module__subContent___O9T-y","itemsWrapper":"Menu-module__itemsWrapper___Fcg71","item":"Menu-module__item___S3HKY","subTrigger":"Menu-module__subTrigger___CdnJE","itemSubText":"Menu-module__itemSubText___U1HFP","itemIcon":"Menu-module__itemIcon___iyxmZ","wrapperText":"Menu-module__wrapperText___PomUe","itemText":"Menu-module__itemText___2fd2B","chevronIcon":"Menu-module__chevronIcon___Gda-U","searchWrapper":"Menu-module__searchWrapper___e0knQ","emptyState":"Menu-module__emptyState___3wh-S","loadingMore":"Menu-module__loadingMore___fUCvH"};
|
|
4242
4571
|
|
|
4243
4572
|
const MenuItem = React.memo(({ item, isSelected, onSelect }) => {
|
|
4244
4573
|
const handleSelect = () => {
|
|
4245
4574
|
onSelect(item);
|
|
4246
4575
|
};
|
|
4247
|
-
return (jsxRuntime.jsxs(radixUi.DropdownMenu.Item, { className: clsx(styles$
|
|
4576
|
+
return (jsxRuntime.jsxs(radixUi.DropdownMenu.Item, { className: clsx(styles$a.item), "data-selected": isSelected || undefined, onSelect: handleSelect, disabled: item.disabled, children: [item.icon && jsxRuntime.jsx("span", { className: styles$a.itemIcon, children: item.icon }), jsxRuntime.jsxs("div", { className: styles$a.wrapperText, children: [jsxRuntime.jsx("span", { className: styles$a.itemText, children: item.text }), item.subText && (jsxRuntime.jsx("span", { className: styles$a.itemSubText, children: item.subText }))] })] }));
|
|
4248
4577
|
});
|
|
4249
4578
|
MenuItem.displayName = 'MenuItem';
|
|
4250
4579
|
|
|
@@ -4472,7 +4801,7 @@ const Menu = ({ items, children, onItemSelect, search, enableInfiniteScroll, onS
|
|
|
4472
4801
|
const renderMenuItem = React.useCallback((item, key) => {
|
|
4473
4802
|
const hasChildren = item.children && item.children.length > 0;
|
|
4474
4803
|
if (hasChildren) {
|
|
4475
|
-
return (jsxRuntime.jsxs(radixUi.DropdownMenu.Sub, { children: [jsxRuntime.jsxs(radixUi.DropdownMenu.SubTrigger, { className: styles$
|
|
4804
|
+
return (jsxRuntime.jsxs(radixUi.DropdownMenu.Sub, { children: [jsxRuntime.jsxs(radixUi.DropdownMenu.SubTrigger, { className: styles$a.subTrigger, disabled: item.disabled, children: [item.icon && (jsxRuntime.jsx("span", { className: styles$a.itemIcon, children: item.icon })), jsxRuntime.jsxs("div", { className: styles$a.wrapperText, children: [jsxRuntime.jsx("span", { className: styles$a.itemText, children: item.text }), item.subText && (jsxRuntime.jsx("span", { className: styles$a.itemSubText, children: item.subText }))] }), jsxRuntime.jsx(reactIcons.ChevronRight16Filled, { className: styles$a.chevronIcon })] }), jsxRuntime.jsx(radixUi.DropdownMenu.Portal, { children: jsxRuntime.jsx(radixUi.DropdownMenu.SubContent, { className: styles$a.subContent, sideOffset: 16, collisionPadding: 20, children: item.children.map((childItem, childIndex) => renderMenuItem(childItem, `${key}-${childIndex}`)) }) })] }, key));
|
|
4476
4805
|
}
|
|
4477
4806
|
return (jsxRuntime.jsx(MenuItem, { item: item, isSelected: isItemSelected(item), onSelect: handleItemSelect }, key));
|
|
4478
4807
|
}, [handleItemSelect, isItemSelected]);
|
|
@@ -4483,7 +4812,7 @@ const Menu = ({ items, children, onItemSelect, search, enableInfiniteScroll, onS
|
|
|
4483
4812
|
hasReachedEndRef.current = false;
|
|
4484
4813
|
}
|
|
4485
4814
|
};
|
|
4486
|
-
return (jsxRuntime.jsxs(radixUi.DropdownMenu.Root, { open: open, onOpenChange: handleOpenChange, children: [jsxRuntime.jsx(radixUi.DropdownMenu.Trigger, { asChild: true, children: triggerWithScale }), jsxRuntime.jsx(radixUi.DropdownMenu.Portal, { children: jsxRuntime.jsxs(radixUi.DropdownMenu.Content, { className: clsx(styles$
|
|
4815
|
+
return (jsxRuntime.jsxs(radixUi.DropdownMenu.Root, { open: open, onOpenChange: handleOpenChange, children: [jsxRuntime.jsx(radixUi.DropdownMenu.Trigger, { asChild: true, children: triggerWithScale }), jsxRuntime.jsx(radixUi.DropdownMenu.Portal, { children: jsxRuntime.jsxs(radixUi.DropdownMenu.Content, { className: clsx(styles$a.content, className), style: { ...containerStyle, ...style }, sideOffset: 8, align: align, onPointerDown: () => { closedByPointerRef.current = true; }, onInteractOutside: () => { closedByPointerRef.current = true; }, onCloseAutoFocus: (e) => {
|
|
4487
4816
|
if (closedByPointerRef.current) {
|
|
4488
4817
|
e.preventDefault();
|
|
4489
4818
|
closedByPointerRef.current = false;
|
|
@@ -4492,10 +4821,10 @@ const Menu = ({ items, children, onItemSelect, search, enableInfiniteScroll, onS
|
|
|
4492
4821
|
if (search) {
|
|
4493
4822
|
e.stopPropagation();
|
|
4494
4823
|
}
|
|
4495
|
-
}, ...rest, children: [search && (jsxRuntime.jsx("div", { className: styles$
|
|
4824
|
+
}, ...rest, children: [search && (jsxRuntime.jsx("div", { className: styles$a.searchWrapper, children: jsxRuntime.jsx(Search, { placeholder: "Buscar", onChange: handleSearchChange, value: searchInput, onKeyDown: handleSearchKeyDown }) })), jsxRuntime.jsxs("div", { className: styles$a.itemsWrapper, ref: itemsWrapperRef, style: { maxHeight: maxHeightStyle }, children: [filteredItems.length > 0 ? (filteredItems.map((item, index) => renderMenuItem(item, item.value || item.text || `item-${index}`))) : (jsxRuntime.jsx("div", { className: styles$a.emptyState, children: "Nenhum item encontrado" })), enableInfiniteScroll && isLoadingMore && (jsxRuntime.jsx("div", { className: styles$a.loadingMore, children: "Carregando mais itens..." })), enableInfiniteScroll && (jsxRuntime.jsx("div", { ref: sentinelRef, "data-scroll-sentinel": true, style: { height: '1px', visibility: 'hidden' } }))] })] }) })] }));
|
|
4496
4825
|
};
|
|
4497
4826
|
|
|
4498
|
-
var styles$
|
|
4827
|
+
var styles$9 = {"modalOverlay":"Modal-module__modalOverlay___rI8Wz","modalContent":"Modal-module__modalContent___6Cgb1","modalContent--fullscreen":"Modal-module__modalContent--fullscreen___QeBlG","modalHeader":"Modal-module__modalHeader___IuHIg","modalTitle":"Modal-module__modalTitle___9VDmr","modalBody":"Modal-module__modalBody___ohjQm","modalFooter":"Modal-module__modalFooter___TEqdK"};
|
|
4499
4828
|
|
|
4500
4829
|
const Modal = ({ isOpen = false, onClose, title, children, headerContent, closeOnOverlayClick = true, className, id, footer, customWidth, customHeight, fullscreen = false, ...rest }) => {
|
|
4501
4830
|
const contentRef = React__namespace.useRef(null);
|
|
@@ -4508,13 +4837,13 @@ const Modal = ({ isOpen = false, onClose, title, children, headerContent, closeO
|
|
|
4508
4837
|
e.preventDefault();
|
|
4509
4838
|
contentRef.current?.focus();
|
|
4510
4839
|
};
|
|
4511
|
-
return (jsxRuntime.jsx(radixUi.Dialog.Root, { open: isOpen, onOpenChange: handleOpenChange, ...rest, children: jsxRuntime.jsxs(radixUi.Dialog.Portal, { children: [jsxRuntime.jsx(radixUi.Dialog.Overlay, { className: styles$
|
|
4840
|
+
return (jsxRuntime.jsx(radixUi.Dialog.Root, { open: isOpen, onOpenChange: handleOpenChange, ...rest, children: jsxRuntime.jsxs(radixUi.Dialog.Portal, { children: [jsxRuntime.jsx(radixUi.Dialog.Overlay, { className: styles$9.modalOverlay }), jsxRuntime.jsxs(radixUi.Dialog.Content, { ref: contentRef, className: clsx(styles$9.modalContent, fullscreen && styles$9['modalContent--fullscreen'], className), id: id, style: {
|
|
4512
4841
|
'--modal-custom-width': customWidth,
|
|
4513
4842
|
'--modal-custom-height': customHeight,
|
|
4514
|
-
}, onInteractOutside: !closeOnOverlayClick ? (e) => e.preventDefault() : undefined, onOpenAutoFocus: handleOpenAutoFocus, "aria-labelledby": id ? `${id}-title` : 'modal-title', tabIndex: -1, children: [jsxRuntime.jsxs("header", { className: styles$
|
|
4843
|
+
}, onInteractOutside: !closeOnOverlayClick ? (e) => e.preventDefault() : undefined, onOpenAutoFocus: handleOpenAutoFocus, "aria-labelledby": id ? `${id}-title` : 'modal-title', tabIndex: -1, children: [jsxRuntime.jsxs("header", { className: styles$9.modalHeader, children: [title && (jsxRuntime.jsx(radixUi.Dialog.Title, { className: styles$9.modalTitle, id: id ? `${id}-title` : 'modal-title', children: title })), headerContent && (jsxRuntime.jsx("div", { children: headerContent })), jsxRuntime.jsx(radixUi.Dialog.Close, { asChild: true, children: jsxRuntime.jsx(Button, { variant: "outlined", iconOnly: true, icon: jsxRuntime.jsx(reactIcons.Dismiss16Regular, {}), size: "lg", tooltipText: 'Fechar' }) })] }), jsxRuntime.jsx("section", { className: styles$9.modalBody, children: children }), footer && (jsxRuntime.jsx("footer", { className: styles$9.modalFooter, children: footer }))] })] }) }));
|
|
4515
4844
|
};
|
|
4516
4845
|
|
|
4517
|
-
var styles$
|
|
4846
|
+
var styles$8 = {"quantity":"Quantity-module__quantity___-vndR","quantityInput":"Quantity-module__quantityInput___xZG-v","disabled":"Quantity-module__disabled___X6p5l"};
|
|
4518
4847
|
|
|
4519
4848
|
const Quantity = ({ value = 0, onChange, disabled = false, decimal = false, decimalPlaces = 2, size = 'lg', id, valueIncrement = 1, scale = 1, className, style, inputSize, minValue = 0, maxValue = 9999, decrementAriaLabel = 'Decrease quantity', incrementAriaLabel = 'Increase quantity', inputAriaLabel = 'Quantity', ...rest }) => {
|
|
4520
4849
|
const initialValue = Math.min(Math.max(value, minValue), maxValue);
|
|
@@ -4695,11 +5024,23 @@ const Quantity = ({ value = 0, onChange, disabled = false, decimal = false, deci
|
|
|
4695
5024
|
const inputSizeValue = inputSize !== undefined ? inputSize : Math.max(1, inputValue.length);
|
|
4696
5025
|
const uniqueId = React.useId();
|
|
4697
5026
|
const inputId = id || uniqueId;
|
|
4698
|
-
return (jsxRuntime.jsxs("div", { className: clsx(styles$
|
|
5027
|
+
return (jsxRuntime.jsxs("div", { className: clsx(styles$8.quantity, { [styles$8.disabled]: disabled }, className), style: { '--giro-scale': scale, ...style }, ...rest, children: [jsxRuntime.jsx(Button, { variant: 'outlined', size: size, type: 'button', iconOnly: true, icon: jsxRuntime.jsx(reactIcons.Subtract16Regular, {}), onClick: decrement, disabled: disabled || isMinValue, "aria-label": decrementAriaLabel, tooltipText: 'Diminuir', scale: scale }), jsxRuntime.jsx("input", { ref: inputRef, className: clsx(styles$8.quantityInput, { [styles$8.disabled]: disabled }), type: 'text', value: inputValue, onChange: handleInputChange, onBlur: handleBlur, onKeyDown: handleInputKeyDown, id: inputId, step: stepValue, "aria-label": inputAriaLabel, role: 'spinbutton', "aria-valuenow": internalValue, "aria-valuemin": minValue, "aria-valuemax": maxValue, disabled: disabled, inputMode: decimal ? 'decimal' : 'numeric', size: inputSizeValue }), jsxRuntime.jsx(Button, { variant: 'outlined', size: size, type: 'button', iconOnly: true, onClick: increment, disabled: disabled || isMaxValue, "aria-label": incrementAriaLabel, icon: jsxRuntime.jsx(reactIcons.Add16Regular, {}), tooltipText: 'Aumentar', scale: scale })] }));
|
|
4699
5028
|
};
|
|
4700
5029
|
const memorizedQuantity = React.memo(Quantity);
|
|
4701
5030
|
memorizedQuantity.displayName = 'Quantity';
|
|
4702
5031
|
|
|
5032
|
+
var styles$7 = {"root":"Radio-module__root___7ElY2","wrapper":"Radio-module__wrapper___NYQ1y","disabled":"Radio-module__disabled___RZ0be","labelText":"Radio-module__labelText___Wkb41","item":"Radio-module__item___3Kvj7","itemWrapper":"Radio-module__itemWrapper___5KbM1","labelWrapper":"Radio-module__labelWrapper___LOHmJ","indicator":"Radio-module__indicator___TJ5hz"};
|
|
5033
|
+
|
|
5034
|
+
const Radio = ({ items, onValueChange, defaultValue, name, id, ariaLabel, orientation = 'vertical', scale = 1, className, style, ...rest }) => {
|
|
5035
|
+
const generatedId = React.useId();
|
|
5036
|
+
const componentId = id || generatedId;
|
|
5037
|
+
return (jsxRuntime.jsx(radixUi.RadioGroup.Root, { id: componentId, className: clsx(styles$7.root, className), style: { '--giro-scale': scale, ...style }, defaultValue: defaultValue, onValueChange: onValueChange, name: name, "aria-label": ariaLabel, "data-orientation": orientation, orientation: orientation, ...rest, children: items.map(({ id, value, disabled, label }) => {
|
|
5038
|
+
const itemKey = id ?? value;
|
|
5039
|
+
const uniqueId = `${componentId}-item-${value}`;
|
|
5040
|
+
return (jsxRuntime.jsx("div", { className: clsx(styles$7.wrapper, { [styles$7.disabled]: disabled }), children: jsxRuntime.jsxs("label", { className: styles$7.labelWrapper, htmlFor: uniqueId, children: [jsxRuntime.jsx("div", { className: styles$7.itemWrapper, children: jsxRuntime.jsx(radixUi.RadioGroup.Item, { disabled: disabled, className: styles$7.item, value: value, id: uniqueId, "data-disabled": disabled, children: jsxRuntime.jsx(radixUi.RadioGroup.Indicator, { className: styles$7.indicator }) }) }), jsxRuntime.jsx("span", { className: styles$7.labelText, children: label })] }) }, itemKey));
|
|
5041
|
+
}) }));
|
|
5042
|
+
};
|
|
5043
|
+
|
|
4703
5044
|
var styles$6 = {"fieldContainer":"Select-module__fieldContainer___zkWSZ","trigger":"Select-module__trigger___xZVUG","disabled":"Select-module__disabled___kkzG-","open":"Select-module__open___bTuTy","error":"Select-module__error___yikGO","hasValue":"Select-module__hasValue___56T9r","triggerText":"Select-module__triggerText___tfXlq","triggerIcon":"Select-module__triggerIcon___Smobj","content":"Select-module__content___Eftze","viewport":"Select-module__viewport___mMGOo","group":"Select-module__group___wErLt","container":"Select-module__container___U1UI1","containerLabel":"Select-module__containerLabel___-5qpN","searchWrapper":"Select-module__searchWrapper___H01Wp","item":"Select-module__item___72Rnu","subTitle":"Select-module__subTitle___FdYBH","checkboxItem":"Select-module__checkboxItem___Ehw-a","checkboxContent":"Select-module__checkboxContent___7eKLC","itemWrapper":"Select-module__itemWrapper___nPovg","title":"Select-module__title___bqW3p","icon":"Select-module__icon___RH27W","itemIndicator":"Select-module__itemIndicator___4DBU-","textContent":"Select-module__textContent___k1SLX","helper":"Select-module__helper___pTp7X","errorMessage":"Select-module__errorMessage___--vrn","noResults":"Select-module__noResults___IxsAN","loadingMore":"Select-module__loadingMore___DjAUE","expandableItemContainer":"Select-module__expandableItemContainer___w4ZIb","chevron":"Select-module__chevron___Kgee3","childrenWrapper":"Select-module__childrenWrapper___2NnS-"};
|
|
4704
5045
|
|
|
4705
5046
|
const CheckboxSelectItem = ({ text, subTitle, disabled, checked, onCheckedChange, value, ...restProps }) => {
|
|
@@ -4775,13 +5116,13 @@ const ExpandableSelectItem = ({ item, variant, onSelect, selectedValues, level =
|
|
|
4775
5116
|
}, role: "button", tabIndex: item.disabled ? -1 : 0, "data-disabled": item.disabled || undefined, "data-selected": isSelected && !hasChildren ? 'true' : undefined, "data-testid": `select-item-${item.value}`, children: [variant === 'icon' && item.icon && (jsxRuntime.jsx("span", { className: styles$6.icon, children: item.icon })), jsxRuntime.jsxs("div", { className: styles$6.textContent, children: [jsxRuntime.jsx("div", { className: styles$6.title, children: item.text }), item.subTitle && jsxRuntime.jsx("div", { className: styles$6.subTitle, children: item.subTitle })] }), hasChildren && (jsxRuntime.jsx("span", { className: styles$6.chevron, children: isExpanded ? jsxRuntime.jsx(reactIcons.ChevronDown16Regular, {}) : jsxRuntime.jsx(reactIcons.ChevronRight16Regular, {}) }))] }) }), hasChildren && isExpanded && (jsxRuntime.jsx("div", { className: styles$6.childrenWrapper, children: item.children.map((child) => (jsxRuntime.jsx(ExpandableSelectItem, { item: child, variant: variant, onSelect: onSelect, selectedValues: selectedValues, level: level + 1 }, child.id || child.value))) }))] }));
|
|
4776
5117
|
};
|
|
4777
5118
|
|
|
4778
|
-
const SelectItem =
|
|
5119
|
+
const SelectItem = ({ ref, text, subTitle, icon, disabled, value, variant, disableFocusOnHover, ...restProps }) => {
|
|
4779
5120
|
return (jsxRuntime.jsxs("div", { className: clsx(styles$6.itemWrapper, {
|
|
4780
5121
|
[styles$6.disabled]: disabled,
|
|
4781
5122
|
}), "data-disabled": disabled || undefined, "data-testid": `select-item-${value}`, ref: ref, children: [variant === 'icon' && icon && (jsxRuntime.jsx("span", { className: styles$6.icon, children: icon })), jsxRuntime.jsxs(radixUi.Select.Item, { className: clsx(styles$6.item, {
|
|
4782
5123
|
[styles$6.disabled]: disabled,
|
|
4783
5124
|
}), value: value, disabled: disabled, onPointerMove: disableFocusOnHover ? (e) => e.preventDefault() : undefined, ...restProps, children: [jsxRuntime.jsx(radixUi.Select.ItemText, { className: styles$6.title, children: text }), subTitle && jsxRuntime.jsx("div", { className: styles$6.subTitle, children: subTitle }), jsxRuntime.jsx(radixUi.Select.ItemIndicator, { className: styles$6.itemIndicator })] })] }));
|
|
4784
|
-
}
|
|
5125
|
+
};
|
|
4785
5126
|
SelectItem.displayName = 'SelectItem';
|
|
4786
5127
|
|
|
4787
5128
|
const initialState = {
|
|
@@ -4816,7 +5157,7 @@ function selectReducer(state, action) {
|
|
|
4816
5157
|
return state;
|
|
4817
5158
|
}
|
|
4818
5159
|
}
|
|
4819
|
-
function useSelectLogic({ value, required = false, search = false, onValueChange, onOpenChange, enableApiSearch = false, onApiSearch, isSearching = false, }) {
|
|
5160
|
+
function useSelectLogic({ value, required = false, search = false, onValueChange, onOpenChange, enableApiSearch = false, onApiSearch, isSearching = false, error, }) {
|
|
4820
5161
|
const [state, dispatch] = React.useReducer(selectReducer, {
|
|
4821
5162
|
...initialState,
|
|
4822
5163
|
selectedValues: Array.isArray(value) ? value : value ? [value] : [],
|
|
@@ -4843,6 +5184,14 @@ function useSelectLogic({ value, required = false, search = false, onValueChange
|
|
|
4843
5184
|
const newValues = Array.isArray(value) ? value : value ? [value] : [];
|
|
4844
5185
|
dispatch({ type: 'SET_SELECTED_VALUES', payload: newValues });
|
|
4845
5186
|
}, [value]);
|
|
5187
|
+
React.useEffect(() => {
|
|
5188
|
+
if (error !== undefined) {
|
|
5189
|
+
dispatch({ type: 'SET_ERROR', payload: error });
|
|
5190
|
+
if (error) {
|
|
5191
|
+
dispatch({ type: 'SET_TOUCHED', payload: true });
|
|
5192
|
+
}
|
|
5193
|
+
}
|
|
5194
|
+
}, [error]);
|
|
4846
5195
|
React.useEffect(() => {
|
|
4847
5196
|
if (state.isOpen && search) {
|
|
4848
5197
|
setTimeout(() => {
|
|
@@ -5009,7 +5358,7 @@ function useSelectLogic({ value, required = false, search = false, onValueChange
|
|
|
5009
5358
|
};
|
|
5010
5359
|
}
|
|
5011
5360
|
|
|
5012
|
-
const Select = ({ items, onValueChange, onOpenChange, variant, required = false, value, label, helperText, placeholder = 'Selecione', maxWidth, search = false, errorMessage, disabled = false, className, style, 'aria-label': ariaLabel, 'data-testid': testId,
|
|
5361
|
+
const Select = ({ items, onValueChange, onOpenChange, variant, required = false, value, label, helperText, placeholder = 'Selecione', maxWidth, search = false, error, errorMessage, disabled = false, className, style, 'aria-label': ariaLabel, 'data-testid': testId, tooltipText, tooltipSide = 'bottom', tooltipAlign = 'start', enableInfiniteScroll = false, onScrollEnd, isLoadingMore = false, enableApiSearch = false, onApiSearch, isSearching = false, scale = 1, ...rest }) => {
|
|
5013
5362
|
const componentId = React.useId();
|
|
5014
5363
|
const selectId = `select-${componentId}`;
|
|
5015
5364
|
const viewportRef = React.useRef(null);
|
|
@@ -5023,6 +5372,7 @@ const Select = ({ items, onValueChange, onOpenChange, variant, required = false,
|
|
|
5023
5372
|
enableApiSearch,
|
|
5024
5373
|
onApiSearch,
|
|
5025
5374
|
isSearching,
|
|
5375
|
+
error,
|
|
5026
5376
|
});
|
|
5027
5377
|
React.useEffect(() => {
|
|
5028
5378
|
const viewport = viewportRef.current;
|
|
@@ -5090,7 +5440,7 @@ const Select = ({ items, onValueChange, onOpenChange, variant, required = false,
|
|
|
5090
5440
|
onApiSearch('');
|
|
5091
5441
|
}
|
|
5092
5442
|
};
|
|
5093
|
-
return (jsxRuntime.jsx(radixUi.Select.Root, { value: variant === 'checkbox' || (search && state.isOpen) ? '' : (state.selectedValues[0] || ''), onValueChange: variant === 'checkbox' ? undefined : actions.handleSingleSelect, required: required, open: state.isOpen, onOpenChange: actions.setOpen, disabled: disabled, ...rest, children: jsxRuntime.jsxs("div", { className: clsx(styles$6.container, className), style: { ...containerStyle, ...style }, "data-testid": testId, children: [jsxRuntime.jsx("div", { className: styles$6.fieldContainer, children: jsxRuntime.jsxs("div", { className: styles$6.containerLabel, children: [jsxRuntime.jsx(LabelComponent, { htmlFor: selectId, required: required, tooltipText: tooltipText, tooltip:
|
|
5443
|
+
return (jsxRuntime.jsx(radixUi.Select.Root, { value: variant === 'checkbox' || (search && state.isOpen) ? '' : (state.selectedValues[0] || ''), onValueChange: variant === 'checkbox' ? undefined : actions.handleSingleSelect, required: required, open: state.isOpen, onOpenChange: actions.setOpen, disabled: disabled, ...rest, children: jsxRuntime.jsxs("div", { className: clsx(styles$6.container, className), style: { ...containerStyle, ...style }, "data-testid": testId, children: [jsxRuntime.jsx("div", { className: styles$6.fieldContainer, children: jsxRuntime.jsxs("div", { className: styles$6.containerLabel, children: [jsxRuntime.jsx(LabelComponent, { htmlFor: selectId, required: required, tooltipText: tooltipText, tooltip: !!tooltipText, side: tooltipSide, align: tooltipAlign, error: state.hasError && state.touched, disabled: disabled, scale: scale, children: label }), jsxRuntime.jsxs(radixUi.Select.Trigger, { className: clsx(styles$6.trigger, {
|
|
5094
5444
|
[styles$6.error]: state.hasError && state.touched,
|
|
5095
5445
|
[styles$6.disabled]: disabled,
|
|
5096
5446
|
[styles$6.hasValue]: state.selectedValues.length > 0,
|
|
@@ -5115,276 +5465,55 @@ const Select = ({ items, onValueChange, onOpenChange, variant, required = false,
|
|
|
5115
5465
|
};
|
|
5116
5466
|
Select.displayName = 'Select';
|
|
5117
5467
|
|
|
5118
|
-
var styles$5 = {"tableContainer":"Table-
|
|
5468
|
+
var styles$5 = {"wrapper":"Table-module__wrapper___KMc04","tableContainer":"Table-module__tableContainer___byysv","tableHeader":"Table-module__tableHeader___urbxZ","bulkActionsBar":"Table-module__bulkActionsBar___Irfnt","bulkActionsInfo":"Table-module__bulkActionsInfo___pLTb6","bulkActionsClearButton":"Table-module__bulkActionsClearButton___jjQTq","bulkActionsLabel":"Table-module__bulkActionsLabel___QB3N9","bulkActionsButtons":"Table-module__bulkActionsButtons___1anDO","tablePagination":"Table-module__tablePagination___MbqJy","table":"Table-module__table___9xCJC","tableHead":"Table-module__tableHead___oVEa6","tableTh":"Table-module__tableTh___U02-Y","tableThContent":"Table-module__tableThContent___61AqT","tableSortButton":"Table-module__tableSortButton___ZgLkx","tableBody":"Table-module__tableBody___fq4Aa","tableTd":"Table-module__tableTd___OfW9v","tableRow":"Table-module__tableRow___COJNu","checkboxCell":"Table-module__checkboxCell___B9vHM","tableSortIconNeutral":"Table-module__tableSortIconNeutral___uvnHs","tableSortIcon":"Table-module__tableSortIcon___YVa2Q","tableHeaderLeft":"Table-module__tableHeaderLeft___gtnru","tableHeaderSearchContainer":"Table-module__tableHeaderSearchContainer___Yy8-s","tableHeaderSearch":"Table-module__tableHeaderSearch___swewU","tableHeaderFilters":"Table-module__tableHeaderFilters___ncatO","tableHeaderFilterLabel":"Table-module__tableHeaderFilterLabel___r3DI-","tableHeaderFilterItems":"Table-module__tableHeaderFilterItems___kQDsY","tablePaginationSelect":"Table-module__tablePaginationSelect___l2aYm","tablePaginationLabel":"Table-module__tablePaginationLabel___S9VOr","tablePaginationSelectInput":"Table-module__tablePaginationSelectInput___wdhOQ","tablePaginationInfo":"Table-module__tablePaginationInfo___r1v8R","tablePaginationControls":"Table-module__tablePaginationControls___IL8rm","tablePaginationButton":"Table-module__tablePaginationButton___SNDQq","tableScrollWrapper":"Table-module__tableScrollWrapper___SvEOw","tableEmptyCell":"Table-module__tableEmptyCell___N5a9t","tableEmpty":"Table-module__tableEmpty___0yPZ0","tableEmptyContent":"Table-module__tableEmptyContent___uNWpN","tableEmptyText":"Table-module__tableEmptyText___7kY7Q","tableEmptyTitle":"Table-module__tableEmptyTitle___Y-7z8","tableEmptyCaption":"Table-module__tableEmptyCaption___4PZ14","tableCellMaxHeight":"Table-module__tableCellMaxHeight___-tcyU"};
|
|
5119
5469
|
|
|
5120
|
-
|
|
5121
|
-
* Componente de ícone SVG para estado vazio da tabela
|
|
5122
|
-
* Exibe um ícone de lupa com design personalizado do Zanthus Design System
|
|
5123
|
-
* @returns Elemento SVG para estado vazio
|
|
5124
|
-
*/
|
|
5125
|
-
const EmptyRows150Color = () => (jsxRuntime.jsxs("svg", { width: '150', height: '150', viewBox: '0 0 150 150', fill: 'none', xmlns: 'http://www.w3.org/2000/svg', children: [jsxRuntime.jsx("circle", { cx: '75', cy: '75', r: '75', fill: '#E8E8EE' }), jsxRuntime.jsx("path", { d: 'M67.6111 63.3889C69.36 63.3889 70.7778 64.8067 70.7778 66.5556V81.3333C70.7778 83.0822 69.36 84.5 67.6111 84.5C65.8622 84.5 64.4444 83.0822 64.4444 81.3333V66.5556C64.4444 64.8067 65.8622 63.3889 67.6111 63.3889ZM67.6111 59.1667C69.943 59.1667 71.8333 57.2763 71.8333 54.9444C71.8333 52.6126 69.943 50.7222 67.6111 50.7222C65.2792 50.7222 63.3889 52.6126 63.3889 54.9444C63.3889 57.2763 65.2792 59.1667 67.6111 59.1667ZM67.6111 37C84.5172 37 98.2222 50.7051 98.2222 67.6111C98.2222 74.9235 95.6583 81.637 91.3803 86.9017L112.073 107.594C113.309 108.831 113.309 110.836 112.073 112.073C110.948 113.197 109.189 113.299 107.949 112.379L107.594 112.073L86.9017 91.3803C81.637 95.6583 74.9235 98.2222 67.6111 98.2222C50.7051 98.2222 37 84.5172 37 67.6111C37 50.7051 50.7051 37 67.6111 37ZM67.6111 43.3333C54.2029 43.3333 43.3333 54.2029 43.3333 67.6111C43.3333 81.0194 54.2029 91.8889 67.6111 91.8889C81.0194 91.8889 91.8889 81.0194 91.8889 67.6111C91.8889 54.2029 81.0194 43.3333 67.6111 43.3333Z', fill: '#3B45F2' })] }));
|
|
5126
|
-
|
|
5127
|
-
/*! *****************************************************************************
|
|
5128
|
-
Copyright (c) Microsoft Corporation. All rights reserved.
|
|
5129
|
-
Licensed under the Apache License, Version 2.0 (the "License"); you may not use
|
|
5130
|
-
this file except in compliance with the License. You may obtain a copy of the
|
|
5131
|
-
License at http://www.apache.org/licenses/LICENSE-2.0
|
|
5132
|
-
|
|
5133
|
-
THIS CODE IS PROVIDED ON AN *AS IS* BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
|
|
5134
|
-
KIND, EITHER EXPRESS OR IMPLIED, INCLUDING WITHOUT LIMITATION ANY IMPLIED
|
|
5135
|
-
WARRANTIES OR CONDITIONS OF TITLE, FITNESS FOR A PARTICULAR PURPOSE,
|
|
5136
|
-
MERCHANTABLITY OR NON-INFRINGEMENT.
|
|
5137
|
-
|
|
5138
|
-
See the Apache Version 2.0 License for specific language governing permissions
|
|
5139
|
-
and limitations under the License.
|
|
5140
|
-
***************************************************************************** */
|
|
5141
|
-
|
|
5142
|
-
var __assign = function() {
|
|
5143
|
-
__assign = Object.assign || function __assign(t) {
|
|
5144
|
-
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
5145
|
-
s = arguments[i];
|
|
5146
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
|
|
5147
|
-
}
|
|
5148
|
-
return t;
|
|
5149
|
-
};
|
|
5150
|
-
return __assign.apply(this, arguments);
|
|
5151
|
-
};
|
|
5152
|
-
|
|
5153
|
-
function __rest(s, e) {
|
|
5154
|
-
var t = {};
|
|
5155
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
5156
|
-
t[p] = s[p];
|
|
5157
|
-
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
5158
|
-
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
5159
|
-
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
5160
|
-
t[p[i]] = s[p[i]];
|
|
5161
|
-
}
|
|
5162
|
-
return t;
|
|
5163
|
-
}
|
|
5164
|
-
|
|
5165
|
-
var uid = (function () {
|
|
5166
|
-
return Math.random()
|
|
5167
|
-
.toString(36)
|
|
5168
|
-
.substring(6);
|
|
5169
|
-
});
|
|
5470
|
+
const EmptyState = ({ emptyIcon, emptyTitle, emptyText }) => (jsxRuntime.jsxs("div", { className: styles$5.tableEmpty, children: [jsxRuntime.jsx("div", { className: styles$5.tableEmptyContent, children: emptyIcon ?? jsxRuntime.jsx(reactIcons.SearchInfo20Regular, {}) }), jsxRuntime.jsxs("div", { className: styles$5.tableEmptyText, children: [jsxRuntime.jsx("h3", { className: styles$5.tableEmptyTitle, children: emptyTitle ?? 'Nenhum dado encontrado' }), jsxRuntime.jsx("p", { className: styles$5.tableEmptyCaption, children: emptyText ?? 'Nenhum registro encontrado' })] })] }));
|
|
5170
5471
|
|
|
5171
|
-
var
|
|
5172
|
-
var _b = _a.animate, animate = _b === void 0 ? true : _b, _c = _a.backgroundColor, backgroundColor = _c === void 0 ? '#f5f6f7' : _c, _d = _a.backgroundOpacity, backgroundOpacity = _d === void 0 ? 1 : _d, _e = _a.baseUrl, baseUrl = _e === void 0 ? '' : _e, children = _a.children, _f = _a.foregroundColor, foregroundColor = _f === void 0 ? '#eee' : _f, _g = _a.foregroundOpacity, foregroundOpacity = _g === void 0 ? 1 : _g, _h = _a.gradientRatio, gradientRatio = _h === void 0 ? 2 : _h, uniqueKey = _a.uniqueKey, _j = _a.rtl, rtl = _j === void 0 ? false : _j, _k = _a.speed, speed = _k === void 0 ? 1.2 : _k, _l = _a.style, style = _l === void 0 ? {} : _l, _m = _a.title, title = _m === void 0 ? 'Loading...' : _m, _o = _a.beforeMask, beforeMask = _o === void 0 ? null : _o, props = __rest(_a, ["animate", "backgroundColor", "backgroundOpacity", "baseUrl", "children", "foregroundColor", "foregroundOpacity", "gradientRatio", "uniqueKey", "rtl", "speed", "style", "title", "beforeMask"]);
|
|
5173
|
-
var fixedId = uniqueKey || uid();
|
|
5174
|
-
var idClip = "".concat(fixedId, "-diff");
|
|
5175
|
-
var idGradient = "".concat(fixedId, "-animated-diff");
|
|
5176
|
-
var idAria = "".concat(fixedId, "-aria");
|
|
5177
|
-
var rtlStyle = rtl ? { transform: 'scaleX(-1)' } : null;
|
|
5178
|
-
var dur = "".concat(speed, "s");
|
|
5179
|
-
var from = "".concat(gradientRatio * -1, " 0");
|
|
5180
|
-
var to = "".concat(gradientRatio, " 0");
|
|
5181
|
-
return (React.createElement("svg", __assign({ "aria-labelledby": idAria, role: "img", style: __assign(__assign({}, style), rtlStyle) }, props),
|
|
5182
|
-
title ? React.createElement("title", { id: idAria }, title) : null,
|
|
5183
|
-
beforeMask && React.isValidElement(beforeMask) ? beforeMask : null,
|
|
5184
|
-
React.createElement("rect", { role: "presentation", x: "0", y: "0", width: "100%", height: "100%", clipPath: "url(".concat(baseUrl, "#").concat(idClip, ")"), style: { fill: "url(".concat(baseUrl, "#").concat(idGradient, ")") } }),
|
|
5185
|
-
React.createElement("defs", null,
|
|
5186
|
-
React.createElement("clipPath", { id: idClip }, children),
|
|
5187
|
-
React.createElement("linearGradient", { id: idGradient, gradientTransform: "translate(".concat(from, ")") },
|
|
5188
|
-
React.createElement("stop", { offset: "0%", stopColor: backgroundColor, stopOpacity: backgroundOpacity }),
|
|
5189
|
-
React.createElement("stop", { offset: "50%", stopColor: foregroundColor, stopOpacity: foregroundOpacity }),
|
|
5190
|
-
React.createElement("stop", { offset: "100%", stopColor: backgroundColor, stopOpacity: backgroundOpacity }),
|
|
5191
|
-
animate && (React.createElement("animateTransform", { attributeName: "gradientTransform", type: "translate", values: "".concat(from, "; 0 0; ").concat(to), dur: dur, repeatCount: "indefinite" }))))));
|
|
5192
|
-
};
|
|
5193
|
-
|
|
5194
|
-
var ContentLoader = function (props) {
|
|
5195
|
-
return props.children ? React.createElement(SVG, __assign({}, props)) : React.createElement(ReactContentLoaderFacebook, __assign({}, props));
|
|
5196
|
-
};
|
|
5472
|
+
var styles$4 = {"toggle":"ToggleButton-module__toggle___c1Ym-","item":"ToggleButton-module__item___2Qll-","toggle-lg":"ToggleButton-module__toggle-lg___8f3lo","item-lg":"ToggleButton-module__item-lg___479w-","toggle-sm":"ToggleButton-module__toggle-sm___SAGGb","item-sm":"ToggleButton-module__item-sm___4ju--","toggleIconLeft":"ToggleButton-module__toggleIconLeft___VwgKk","toggleWithIcon":"ToggleButton-module__toggleWithIcon___WbCr7","toggleIconOnly":"ToggleButton-module__toggleIconOnly___4iMEp","group":"ToggleButton-module__group___BoR-e"};
|
|
5197
5473
|
|
|
5198
|
-
|
|
5199
|
-
|
|
5200
|
-
|
|
5201
|
-
|
|
5202
|
-
|
|
5203
|
-
|
|
5204
|
-
|
|
5205
|
-
|
|
5206
|
-
/**
|
|
5207
|
-
* Componente de loading para lista de tabela
|
|
5208
|
-
* Simula o carregamento de dados em formato de tabela usando ContentLoader
|
|
5209
|
-
* @param props - Propriedades adicionais para o ContentLoader
|
|
5210
|
-
* @returns Elemento de loading animado
|
|
5211
|
-
*/
|
|
5212
|
-
const LoaderList = (props) => (jsxRuntime.jsxs(ContentLoader, { speed: 1, width: "100%", viewBox: "0 0 1272 652", backgroundColor: "#F5F5F7", foregroundColor: "#FFFFFF", ...props, children: [jsxRuntime.jsx("rect", { x: "0", y: "0", rx: "8", ry: "8", width: "1272", height: "44" }), jsxRuntime.jsx("rect", { x: "0", y: "76", rx: "12", ry: "12", width: "402", height: "24" }), jsxRuntime.jsx("rect", { x: "0", y: "116", rx: "8", ry: "8", width: "280", height: "16" }), jsxRuntime.jsx("rect", { x: "426", y: "76", rx: "12", ry: "12", width: "244", height: "24" }), jsxRuntime.jsx("rect", { x: "426", y: "116", rx: "8", ry: "8", width: "178", height: "16" }), jsxRuntime.jsx("rect", { x: "694", y: "76", rx: "12", ry: "12", width: "244", height: "24" }), jsxRuntime.jsx("rect", { x: "694", y: "116", rx: "8", ry: "8", width: "178", height: "16" }), jsxRuntime.jsx("rect", { x: "962", y: "76", rx: "12", ry: "12", width: "143", height: "24" }), jsxRuntime.jsx("rect", { x: "962", y: "116", rx: "8", ry: "8", width: "90", height: "16" }), jsxRuntime.jsx("rect", { x: "1129", y: "76", rx: "12", ry: "12", width: "143", height: "24" }), jsxRuntime.jsx("rect", { x: "1129", y: "116", rx: "8", ry: "8", width: "90", height: "16" }), jsxRuntime.jsx("rect", { x: "0", y: "164", rx: "12", ry: "12", width: "402", height: "24" }), jsxRuntime.jsx("rect", { x: "0", y: "204", rx: "8", ry: "8", width: "280", height: "16" }), jsxRuntime.jsx("rect", { x: "426", y: "164", rx: "12", ry: "12", width: "244", height: "24" }), jsxRuntime.jsx("rect", { x: "426", y: "204", rx: "8", ry: "8", width: "178", height: "16" }), jsxRuntime.jsx("rect", { x: "694", y: "164", rx: "12", ry: "12", width: "244", height: "24" }), jsxRuntime.jsx("rect", { x: "694", y: "204", rx: "8", ry: "8", width: "178", height: "16" }), jsxRuntime.jsx("rect", { x: "962", y: "164", rx: "12", ry: "12", width: "143", height: "24" }), jsxRuntime.jsx("rect", { x: "962", y: "204", rx: "8", ry: "8", width: "90", height: "16" }), jsxRuntime.jsx("rect", { x: "1129", y: "164", rx: "12", ry: "12", width: "143", height: "24" }), jsxRuntime.jsx("rect", { x: "1129", y: "204", rx: "8", ry: "8", width: "90", height: "16" }), jsxRuntime.jsx("rect", { x: "0", y: "252", rx: "12", ry: "12", width: "402", height: "24" }), jsxRuntime.jsx("rect", { x: "0", y: "292", rx: "8", ry: "8", width: "280", height: "16" }), jsxRuntime.jsx("rect", { x: "426", y: "252", rx: "12", ry: "12", width: "244", height: "24" }), jsxRuntime.jsx("rect", { x: "426", y: "292", rx: "8", ry: "8", width: "178", height: "16" }), jsxRuntime.jsx("rect", { x: "694", y: "252", rx: "12", ry: "12", width: "244", height: "24" }), jsxRuntime.jsx("rect", { x: "694", y: "292", rx: "8", ry: "8", width: "178", height: "16" }), jsxRuntime.jsx("rect", { x: "962", y: "252", rx: "12", ry: "12", width: "143", height: "24" }), jsxRuntime.jsx("rect", { x: "962", y: "292", rx: "8", ry: "8", width: "90", height: "16" }), jsxRuntime.jsx("rect", { x: "1129", y: "252", rx: "12", ry: "12", width: "143", height: "24" }), jsxRuntime.jsx("rect", { x: "1129", y: "292", rx: "8", ry: "8", width: "90", height: "16" }), jsxRuntime.jsx("rect", { x: "0", y: "340", rx: "12", ry: "12", width: "402", height: "24" }), jsxRuntime.jsx("rect", { x: "0", y: "380", rx: "8", ry: "8", width: "280", height: "16" }), jsxRuntime.jsx("rect", { x: "426", y: "340", rx: "12", ry: "12", width: "244", height: "24" }), jsxRuntime.jsx("rect", { x: "426", y: "380", rx: "8", ry: "8", width: "178", height: "16" }), jsxRuntime.jsx("rect", { x: "694", y: "340", rx: "12", ry: "12", width: "244", height: "24" }), jsxRuntime.jsx("rect", { x: "694", y: "380", rx: "8", ry: "8", width: "178", height: "16" }), jsxRuntime.jsx("rect", { x: "962", y: "340", rx: "12", ry: "12", width: "143", height: "24" }), jsxRuntime.jsx("rect", { x: "962", y: "380", rx: "8", ry: "8", width: "90", height: "16" }), jsxRuntime.jsx("rect", { x: "1129", y: "340", rx: "12", ry: "12", width: "143", height: "24" }), jsxRuntime.jsx("rect", { x: "1129", y: "380", rx: "8", ry: "8", width: "90", height: "16" }), jsxRuntime.jsx("rect", { x: "0", y: "428", rx: "12", ry: "12", width: "402", height: "24" }), jsxRuntime.jsx("rect", { x: "0", y: "468", rx: "8", ry: "8", width: "280", height: "16" }), jsxRuntime.jsx("rect", { x: "426", y: "428", rx: "12", ry: "12", width: "244", height: "24" }), jsxRuntime.jsx("rect", { x: "426", y: "468", rx: "8", ry: "8", width: "178", height: "16" }), jsxRuntime.jsx("rect", { x: "694", y: "428", rx: "12", ry: "12", width: "244", height: "24" }), jsxRuntime.jsx("rect", { x: "694", y: "468", rx: "8", ry: "8", width: "178", height: "16" }), jsxRuntime.jsx("rect", { x: "962", y: "428", rx: "12", ry: "12", width: "143", height: "24" }), jsxRuntime.jsx("rect", { x: "962", y: "468", rx: "8", ry: "8", width: "90", height: "16" }), jsxRuntime.jsx("rect", { x: "1129", y: "428", rx: "12", ry: "12", width: "143", height: "24" }), jsxRuntime.jsx("rect", { x: "1129", y: "468", rx: "8", ry: "8", width: "90", height: "16" }), jsxRuntime.jsx("rect", { x: "0", y: "516", rx: "12", ry: "12", width: "402", height: "24" }), jsxRuntime.jsx("rect", { x: "0", y: "556", rx: "8", ry: "8", width: "280", height: "16" }), jsxRuntime.jsx("rect", { x: "426", y: "516", rx: "12", ry: "12", width: "244", height: "24" }), jsxRuntime.jsx("rect", { x: "426", y: "556", rx: "8", ry: "8", width: "178", height: "16" }), jsxRuntime.jsx("rect", { x: "694", y: "516", rx: "12", ry: "12", width: "244", height: "24" }), jsxRuntime.jsx("rect", { x: "694", y: "556", rx: "8", ry: "8", width: "178", height: "16" }), jsxRuntime.jsx("rect", { x: "962", y: "516", rx: "12", ry: "12", width: "143", height: "24" }), jsxRuntime.jsx("rect", { x: "962", y: "556", rx: "8", ry: "8", width: "90", height: "16" }), jsxRuntime.jsx("rect", { x: "1129", y: "516", rx: "12", ry: "12", width: "143", height: "24" }), jsxRuntime.jsx("rect", { x: "1129", y: "556", rx: "8", ry: "8", width: "90", height: "16" }), jsxRuntime.jsx("rect", { x: "0", y: "604", rx: "8", ry: "8", width: "1272", height: "48" })] }));
|
|
5213
|
-
|
|
5214
|
-
const useSelection = (dataSource, rowSelection) => {
|
|
5215
|
-
const [internalKeys, setInternalKeys] = React.useState([]);
|
|
5216
|
-
const selectedKeys = rowSelection?.selectedRowKeys ?? internalKeys;
|
|
5217
|
-
const selectedSet = React.useMemo(() => new Set(selectedKeys), [selectedKeys]);
|
|
5218
|
-
const handleChange = React.useCallback((newKeys) => {
|
|
5219
|
-
const newRows = dataSource.filter((_, index) => newKeys.includes(index));
|
|
5220
|
-
if (rowSelection?.selectedRowKeys !== undefined) {
|
|
5221
|
-
rowSelection.onChange?.(newKeys, newRows);
|
|
5222
|
-
}
|
|
5223
|
-
else {
|
|
5224
|
-
setInternalKeys(newKeys);
|
|
5225
|
-
rowSelection?.onChange?.(newKeys, newRows);
|
|
5226
|
-
}
|
|
5227
|
-
}, [dataSource, rowSelection]);
|
|
5228
|
-
const toggleRow = React.useCallback((key) => {
|
|
5229
|
-
const newKeys = selectedSet.has(key)
|
|
5230
|
-
? selectedKeys.filter(k => k !== key)
|
|
5231
|
-
: [...selectedKeys, key];
|
|
5232
|
-
handleChange(newKeys);
|
|
5233
|
-
}, [selectedKeys, selectedSet, handleChange]);
|
|
5234
|
-
const selectableKeys = React.useMemo(() => (dataSource
|
|
5235
|
-
.map((row, index) => ({ index, disabled: rowSelection?.getCheckboxProps?.(row, index)?.disabled }))
|
|
5236
|
-
.filter(({ disabled }) => !disabled)
|
|
5237
|
-
.map(({ index }) => index)), [dataSource, rowSelection]);
|
|
5238
|
-
const toggleAll = React.useCallback(() => {
|
|
5239
|
-
const isAllSelectableSelected = selectableKeys.every(k => selectedSet.has(k));
|
|
5240
|
-
const newKeys = isAllSelectableSelected
|
|
5241
|
-
? selectedKeys.filter(k => !selectableKeys.includes(k))
|
|
5242
|
-
: [...new Set([...selectedKeys, ...selectableKeys])];
|
|
5243
|
-
handleChange(newKeys);
|
|
5244
|
-
}, [selectableKeys, selectedKeys, selectedSet, handleChange]);
|
|
5245
|
-
const isAllSelected = selectableKeys.length > 0 && selectableKeys.every(k => selectedSet.has(k));
|
|
5246
|
-
const isIndeterminate = selectableKeys.some(k => selectedSet.has(k)) && !isAllSelected;
|
|
5247
|
-
return {
|
|
5248
|
-
selectedSet,
|
|
5249
|
-
selectedKeys,
|
|
5250
|
-
toggleRow,
|
|
5251
|
-
toggleAll,
|
|
5252
|
-
isAllSelected,
|
|
5253
|
-
isIndeterminate,
|
|
5254
|
-
};
|
|
5255
|
-
};
|
|
5256
|
-
const renderCell = (column, row, index) => {
|
|
5257
|
-
if (column.render) {
|
|
5258
|
-
return column.render(row, index);
|
|
5259
|
-
}
|
|
5260
|
-
const value = row[column.key];
|
|
5261
|
-
switch (column.type) {
|
|
5262
|
-
case 'datetime':
|
|
5263
|
-
if (!value)
|
|
5264
|
-
return '';
|
|
5265
|
-
try {
|
|
5266
|
-
const date = new Date(value);
|
|
5267
|
-
return dateFns.format(date, column.format || 'dd/MM/yyyy', { locale: ptBR$1 });
|
|
5268
|
-
}
|
|
5269
|
-
catch {
|
|
5270
|
-
return value;
|
|
5271
|
-
}
|
|
5272
|
-
default:
|
|
5273
|
-
return value;
|
|
5474
|
+
const Toggle = ({ pressed, defaultPressed, onPressedChange, disabled = false, className, children, id, size = 'lg', scale = 1, style, tooltipText, tooltipSide = 'top', tooltipAlign = 'center', icon, iconOnly = false, mode: _mode, selectionType: _type, value: _value, defaultValue: _defaultValue, onValueChange: _onValueChange, orientation: _orientation, items: _items, ...rest }) => {
|
|
5475
|
+
const toggle = (jsxRuntime.jsx(radixUi.Toggle.Root, { pressed: pressed, defaultPressed: defaultPressed, onPressedChange: onPressedChange, disabled: disabled, className: clsx(styles$4.toggle, styles$4[`toggle-${size}`], {
|
|
5476
|
+
[styles$4.toggleIconOnly]: iconOnly,
|
|
5477
|
+
[styles$4.toggleWithIcon]: !!icon && !iconOnly,
|
|
5478
|
+
}, className), id: id, style: { '--giro-scale': scale, ...style }, ...rest, children: iconOnly ? (jsxRuntime.jsx("span", { className: styles$4.toggleIconLeft, "aria-hidden": "true", children: icon })) : (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [icon && jsxRuntime.jsx("span", { className: styles$4.toggleIconLeft, "aria-hidden": "true", children: icon }), children] })) }));
|
|
5479
|
+
if (tooltipText) {
|
|
5480
|
+
return (jsxRuntime.jsx(Tooltip, { text: tooltipText, side: tooltipSide, align: tooltipAlign, children: toggle }));
|
|
5274
5481
|
}
|
|
5482
|
+
return toggle;
|
|
5275
5483
|
};
|
|
5276
|
-
|
|
5277
|
-
|
|
5278
|
-
|
|
5279
|
-
|
|
5280
|
-
|
|
5281
|
-
|
|
5282
|
-
|
|
5283
|
-
|
|
5284
|
-
|
|
5285
|
-
|
|
5286
|
-
|
|
5287
|
-
|
|
5288
|
-
|
|
5289
|
-
|
|
5290
|
-
return (jsxRuntime.jsx(Checkbox, { checked: selectedSet.has(index), onCheckedChange: () => toggleRow(index), disabled: props.disabled }));
|
|
5291
|
-
},
|
|
5292
|
-
align: 'center',
|
|
5484
|
+
|
|
5485
|
+
const ToggleGroup = ({ selectionType = 'single', value, defaultValue, onValueChange, orientation = 'horizontal', disabled = false, items = [], children, className, id, size = 'lg', scale = 1, style, tooltipText, tooltipSide = 'top', tooltipAlign = 'center', mode: _mode, icon: _icon, iconOnly: _iconOnly, pressed: _pressed, defaultPressed: _defaultPressed, onPressedChange: _onPressedChange, ...rest }) => {
|
|
5486
|
+
const rootProps = selectionType === 'multiple'
|
|
5487
|
+
? {
|
|
5488
|
+
type: 'multiple',
|
|
5489
|
+
value: value,
|
|
5490
|
+
defaultValue: defaultValue,
|
|
5491
|
+
onValueChange: onValueChange,
|
|
5492
|
+
}
|
|
5493
|
+
: {
|
|
5494
|
+
type: 'single',
|
|
5495
|
+
value: value,
|
|
5496
|
+
defaultValue: defaultValue,
|
|
5497
|
+
onValueChange: onValueChange,
|
|
5293
5498
|
};
|
|
5294
|
-
|
|
5295
|
-
|
|
5296
|
-
|
|
5297
|
-
|
|
5298
|
-
|
|
5499
|
+
const group = (jsxRuntime.jsx(radixUi.ToggleGroup.Root, { ...rootProps, orientation: orientation, disabled: disabled, className: clsx(styles$4.group, className), id: id, style: { '--giro-scale': scale, ...style }, ...rest, children: children ??
|
|
5500
|
+
items.map((item) => (jsxRuntime.jsx(radixUi.ToggleGroup.Item, { value: item.value, disabled: item.disabled, className: clsx(styles$4.item, styles$4[`item-${size}`], {
|
|
5501
|
+
[styles$4.toggleIconOnly]: item.iconOnly,
|
|
5502
|
+
[styles$4.toggleWithIcon]: !!item.icon && !item.iconOnly,
|
|
5503
|
+
}), style: { '--giro-scale': scale }, children: item.iconOnly ? (jsxRuntime.jsx("span", { className: styles$4.toggleIconLeft, "aria-hidden": "true", children: item.icon })) : (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [item.icon && jsxRuntime.jsx("span", { className: styles$4.toggleIconLeft, "aria-hidden": "true", children: item.icon }), item.label] })) }, item.value))) }));
|
|
5504
|
+
if (tooltipText) {
|
|
5505
|
+
return (jsxRuntime.jsx(Tooltip, { text: tooltipText, side: tooltipSide, align: tooltipAlign, children: group }));
|
|
5299
5506
|
}
|
|
5300
|
-
|
|
5301
|
-
return (jsxRuntime.jsx("div", { className: clsx(styles$5.tableContainer, className), ...rest, children: jsxRuntime.jsx("div", { className: styles$5.tableScrollWrapper, children: jsxRuntime.jsxs("table", { className: styles$5.table, role: "table", "aria-label": "Tabela de dados", "aria-describedby": loading ? `${tableId}-loading` : undefined, "aria-rowcount": dataSource.length + 1, children: [jsxRuntime.jsx("thead", { className: styles$5.tableHead, children: jsxRuntime.jsx("tr", { children: finalColumns.map((column) => (jsxRuntime.jsx("th", { className: clsx(styles$5.tableTh, column.align && `text-${column.align}`), style: column.style, children: jsxRuntime.jsx("div", { className: styles$5.tableThContent, children: column.label }) }, column.key))) }) }), jsxRuntime.jsx("tbody", { className: styles$5.tableBody, children: dataSource.length > 0 ? (dataSource.map((row, index) => {
|
|
5302
|
-
const rowProps = onRow?.(row, index) || {};
|
|
5303
|
-
return (jsxRuntime.jsx("tr", { className: clsx(styles$5.tableRow, rowProps.className), onClick: rowProps.onClick, onDoubleClick: rowProps.onDoubleClick, children: finalColumns.map((column) => (jsxRuntime.jsx("td", { className: clsx(styles$5.tableTd, column.align && `text-${column.align}`), children: renderCell(column, row, index) }, column.key))) }, index));
|
|
5304
|
-
})) : (jsxRuntime.jsx("tr", { children: jsxRuntime.jsx("td", { colSpan: finalColumns.length, className: styles$5.tableEmptyCell, children: emptyText }) })) })] }) }) }));
|
|
5305
|
-
};
|
|
5306
|
-
|
|
5307
|
-
const isCalendarFilter = (filter) => {
|
|
5308
|
-
return filter.type === 'calendar';
|
|
5309
|
-
};
|
|
5310
|
-
const isCheckboxFilter = (filter) => {
|
|
5311
|
-
return filter.type === 'multiple' || filter.type === 'single';
|
|
5312
|
-
};
|
|
5313
|
-
const TableHeader = ({ searchValue = '', onSearchChange, onSearch, searchPlaceholder = 'Pesquisar...', showSearch = true, showFilters = false, filters, filterItems = [], className = '', ...rest }) => {
|
|
5314
|
-
const [internalSearchValue, setInternalSearchValue] = React.useState(searchValue);
|
|
5315
|
-
React.useEffect(() => {
|
|
5316
|
-
setInternalSearchValue(searchValue);
|
|
5317
|
-
}, [searchValue]);
|
|
5318
|
-
const handleInputChange = (e) => {
|
|
5319
|
-
const value = e.target.value;
|
|
5320
|
-
setInternalSearchValue(value);
|
|
5321
|
-
if (value === '' && onSearchChange) {
|
|
5322
|
-
onSearchChange('');
|
|
5323
|
-
}
|
|
5324
|
-
};
|
|
5325
|
-
const handleKeyDown = (e) => {
|
|
5326
|
-
if (e.key === 'Enter') {
|
|
5327
|
-
e.preventDefault();
|
|
5328
|
-
if (onSearch) {
|
|
5329
|
-
onSearch(internalSearchValue);
|
|
5330
|
-
}
|
|
5331
|
-
else if (onSearchChange) {
|
|
5332
|
-
onSearchChange(internalSearchValue);
|
|
5333
|
-
}
|
|
5334
|
-
}
|
|
5335
|
-
};
|
|
5336
|
-
const hasFilters = filters || (filterItems && filterItems.length > 0);
|
|
5337
|
-
return (jsxRuntime.jsxs("div", { className: `${styles$5.tableHeader} ${className}`.trim(), ...rest, children: [showSearch && (onSearchChange || onSearch) && (jsxRuntime.jsx("div", { className: styles$5.tableHeaderSearchContainer, children: jsxRuntime.jsx(Search, { value: internalSearchValue, onChange: handleInputChange, onKeyDown: handleKeyDown, placeholder: searchPlaceholder, className: styles$5.tableHeaderSearch }) })), showFilters && (jsxRuntime.jsx("div", { className: styles$5.tableHeaderFilters, children: hasFilters ? (jsxRuntime.jsxs("div", { className: styles$5.tableHeaderFiltersContent, children: [filters && (jsxRuntime.jsx("div", { className: styles$5.tableHeaderCustomFilters, children: filters })), jsxRuntime.jsxs("div", { className: styles$5.tableHeaderFiltersWrapper, children: [jsxRuntime.jsx("span", { className: styles$5.tableHeaderFilterLabel, children: "Filtros" }), jsxRuntime.jsx("div", { className: styles$5.tableHeaderFilterItems, children: filterItems && filterItems.map((filterItem, index) => {
|
|
5338
|
-
const commonProps = {
|
|
5339
|
-
buttonText: filterItem.buttonText,
|
|
5340
|
-
icon: filterItem.icon,
|
|
5341
|
-
side: filterItem.side,
|
|
5342
|
-
align: filterItem.align,
|
|
5343
|
-
disabled: filterItem.disabled,
|
|
5344
|
-
variant: 'outlined',
|
|
5345
|
-
onOpen: () => filterItem.onToggle?.(true),
|
|
5346
|
-
onClose: () => filterItem.onToggle?.(false),
|
|
5347
|
-
};
|
|
5348
|
-
if (isCalendarFilter(filterItem)) {
|
|
5349
|
-
return (jsxRuntime.jsx(Filter, { ...commonProps, type: "calendar", selectedDate: filterItem.selectedDate, onDateSelect: filterItem.onDateSelect, onClearDate: filterItem.onClear, minDate: filterItem.minDate, maxDate: filterItem.maxDate, placeholder: filterItem.placeholder }, filterItem.id || index));
|
|
5350
|
-
}
|
|
5351
|
-
if (isCheckboxFilter(filterItem)) {
|
|
5352
|
-
return (jsxRuntime.jsx(Filter, { ...commonProps, type: filterItem.type, items: filterItem.items, selectedIds: filterItem.selectedIds, onApplyFilter: filterItem.onSelectionChange, placeholder: filterItem.placeholder, enableSearch: filterItem.enableSearch }, filterItem.id || index));
|
|
5353
|
-
}
|
|
5354
|
-
console.warn('TableHeader: Tipo de filtro não reconhecido:', filterItem);
|
|
5355
|
-
return null;
|
|
5356
|
-
}) })] })] })) : (jsxRuntime.jsx("div", { className: styles$5.tableHeaderFiltersPlaceholder, children: jsxRuntime.jsx("span", { children: "Nenhum filtro dispon\u00EDvel" }) })) }))] }));
|
|
5507
|
+
return group;
|
|
5357
5508
|
};
|
|
5358
5509
|
|
|
5359
|
-
const
|
|
5360
|
-
|
|
5361
|
-
|
|
5362
|
-
|
|
5363
|
-
|
|
5364
|
-
const canGoNext = currentPage < totalPages && !disabled;
|
|
5365
|
-
const handlePrevious = () => {
|
|
5366
|
-
if (canGoPrev) {
|
|
5367
|
-
onPageChange(currentPage - 1);
|
|
5368
|
-
}
|
|
5369
|
-
};
|
|
5370
|
-
const handleNext = () => {
|
|
5371
|
-
if (canGoNext) {
|
|
5372
|
-
onPageChange(currentPage + 1);
|
|
5373
|
-
}
|
|
5374
|
-
};
|
|
5375
|
-
const handleItemsPerPageChange = (event) => {
|
|
5376
|
-
const newItemsPerPage = Number(event.target.value);
|
|
5377
|
-
onItemsPerPageChange(newItemsPerPage);
|
|
5378
|
-
};
|
|
5379
|
-
return (jsxRuntime.jsxs("div", { className: `${styles$5.tablePagination} ${className}`.trim(), ...rest, children: [jsxRuntime.jsxs("div", { className: styles$5.tablePaginationSelect, children: [jsxRuntime.jsx("label", { htmlFor: "items-per-page", className: styles$5.tablePaginationLabel, children: "Itens por p\u00E1gina" }), jsxRuntime.jsx("select", { id: "items-per-page", value: itemsPerPage, onChange: handleItemsPerPageChange, disabled: disabled, className: styles$5.tablePaginationSelectInput, children: pageSizeOptions.map((option) => (jsxRuntime.jsx("option", { value: option, children: option }, option))) })] }), jsxRuntime.jsx("div", { className: styles$5.tablePaginationInfo, children: jsxRuntime.jsx("span", { children: totalItems > 0
|
|
5380
|
-
? `${startItem}–${endItem} de ${totalItems}`
|
|
5381
|
-
: '0 itens' }) }), jsxRuntime.jsxs("div", { className: styles$5.tablePaginationControls, children: [jsxRuntime.jsx("button", { className: styles$5.tablePaginationButton, onClick: handlePrevious, disabled: !canGoPrev, "aria-label": "P\u00E1gina anterior", children: jsxRuntime.jsx(reactIcons.ChevronLeft16Regular, {}) }), jsxRuntime.jsx("button", { className: styles$5.tablePaginationButton, onClick: handleNext, disabled: !canGoNext, "aria-label": "Pr\u00F3xima p\u00E1gina", children: jsxRuntime.jsx(reactIcons.ChevronRight16Regular, {}) })] })] }));
|
|
5510
|
+
const ToggleButton = ({ mode = 'simple', ...props }) => {
|
|
5511
|
+
if (mode === 'combined') {
|
|
5512
|
+
return jsxRuntime.jsx(ToggleGroup, { ...props });
|
|
5513
|
+
}
|
|
5514
|
+
return jsxRuntime.jsx(Toggle, { ...props });
|
|
5382
5515
|
};
|
|
5383
5516
|
|
|
5384
|
-
var styles$4 = {"wrapper":"Table-module__wrapper___KMc04","tableContainer":"Table-module__tableContainer___byysv","tableHeader":"Table-module__tableHeader___urbxZ","bulkActionsBar":"Table-module__bulkActionsBar___Irfnt","bulkActionsInfo":"Table-module__bulkActionsInfo___pLTb6","bulkActionsClearButton":"Table-module__bulkActionsClearButton___jjQTq","bulkActionsLabel":"Table-module__bulkActionsLabel___QB3N9","bulkActionsButtons":"Table-module__bulkActionsButtons___1anDO","tablePagination":"Table-module__tablePagination___MbqJy","table":"Table-module__table___9xCJC","tableHead":"Table-module__tableHead___oVEa6","tableTh":"Table-module__tableTh___U02-Y","tableThContent":"Table-module__tableThContent___61AqT","tableSortButton":"Table-module__tableSortButton___ZgLkx","tableBody":"Table-module__tableBody___fq4Aa","tableTd":"Table-module__tableTd___OfW9v","tableRow":"Table-module__tableRow___COJNu","checkboxCell":"Table-module__checkboxCell___B9vHM","tableSortIconNeutral":"Table-module__tableSortIconNeutral___uvnHs","tableSortIcon":"Table-module__tableSortIcon___YVa2Q","tableHeaderSearchContainer":"Table-module__tableHeaderSearchContainer___Yy8-s","tableHeaderSearch":"Table-module__tableHeaderSearch___swewU","tableHeaderFilters":"Table-module__tableHeaderFilters___ncatO","tableHeaderFilterLabel":"Table-module__tableHeaderFilterLabel___r3DI-","tableHeaderFilterItems":"Table-module__tableHeaderFilterItems___kQDsY","tablePaginationSelect":"Table-module__tablePaginationSelect___l2aYm","tablePaginationLabel":"Table-module__tablePaginationLabel___S9VOr","tablePaginationSelectInput":"Table-module__tablePaginationSelectInput___wdhOQ","tablePaginationInfo":"Table-module__tablePaginationInfo___r1v8R","tablePaginationControls":"Table-module__tablePaginationControls___IL8rm","tablePaginationButton":"Table-module__tablePaginationButton___SNDQq","tableScrollWrapper":"Table-module__tableScrollWrapper___SvEOw","tableEmptyCell":"Table-module__tableEmptyCell___N5a9t","tableEmpty":"Table-module__tableEmpty___0yPZ0","tableEmptyContent":"Table-module__tableEmptyContent___uNWpN","tableEmptyText":"Table-module__tableEmptyText___7kY7Q","tableEmptyTitle":"Table-module__tableEmptyTitle___Y-7z8","tableEmptyCaption":"Table-module__tableEmptyCaption___4PZ14","tableCellMaxHeight":"Table-module__tableCellMaxHeight___-tcyU"};
|
|
5385
|
-
|
|
5386
|
-
const EmptyState = ({ emptyIcon, emptyTitle, emptyText }) => (jsxRuntime.jsxs("div", { className: styles$4.tableEmpty, children: [jsxRuntime.jsx("div", { className: styles$4.tableEmptyContent, children: emptyIcon ?? jsxRuntime.jsx(reactIcons.SearchInfo20Regular, {}) }), jsxRuntime.jsxs("div", { className: styles$4.tableEmptyText, children: [jsxRuntime.jsx("h3", { className: styles$4.tableEmptyTitle, children: emptyTitle ?? 'Nenhum dado encontrado' }), jsxRuntime.jsx("p", { className: styles$4.tableEmptyCaption, children: emptyText ?? 'Nenhum registro encontrado' })] })] }));
|
|
5387
|
-
|
|
5388
5517
|
const TableV2 = ({ columns, data, rowSelection: rowSelectionConfig, enableSorting = true, bulkActions, header, footer, loading = false, emptyIcon, emptyTitle, emptyText, onRow, className, }) => {
|
|
5389
5518
|
const isRowSelectionEnabled = !!rowSelectionConfig;
|
|
5390
5519
|
const isControlled = rowSelectionConfig?.selectedRowKeys !== undefined;
|
|
@@ -5394,6 +5523,19 @@ const TableV2 = ({ columns, data, rowSelection: rowSelectionConfig, enableSortin
|
|
|
5394
5523
|
setPendingSearch(header.searchValue);
|
|
5395
5524
|
}
|
|
5396
5525
|
}, [header?.searchValue]);
|
|
5526
|
+
const [activeView, setActiveView] = React.useState(header?.viewToggle?.value ??
|
|
5527
|
+
header?.viewToggle?.defaultValue ??
|
|
5528
|
+
header?.viewToggle?.items?.[0]?.value ??
|
|
5529
|
+
'');
|
|
5530
|
+
React.useEffect(() => {
|
|
5531
|
+
if (header?.viewToggle?.value !== undefined) {
|
|
5532
|
+
setActiveView(header.viewToggle.value);
|
|
5533
|
+
}
|
|
5534
|
+
}, [header?.viewToggle?.value]);
|
|
5535
|
+
const currentViewData = header?.viewToggle?.views?.[activeView];
|
|
5536
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
5537
|
+
const effectiveColumns = (currentViewData?.columns ?? columns);
|
|
5538
|
+
const effectiveData = currentViewData?.data ?? data;
|
|
5397
5539
|
const [rowSelectionState, setRowSelectionState] = React.useState({});
|
|
5398
5540
|
const rowSelectionRef = React.useRef({});
|
|
5399
5541
|
const externalSelectionState = React.useMemo(() => {
|
|
@@ -5415,13 +5557,13 @@ const TableV2 = ({ columns, data, rowSelection: rowSelectionConfig, enableSortin
|
|
|
5415
5557
|
size: 48,
|
|
5416
5558
|
enableSorting: false,
|
|
5417
5559
|
enableColumnFilter: false,
|
|
5418
|
-
header: ({ table: t }) => (jsxRuntime.jsx("div", { className: styles$
|
|
5419
|
-
cell: ({ row }) => (jsxRuntime.jsx("div", { className: styles$
|
|
5560
|
+
header: ({ table: t }) => (jsxRuntime.jsx("div", { className: styles$5.checkboxCell, children: jsxRuntime.jsx(Checkbox, { checked: t.getIsAllPageRowsSelected(), indeterminate: t.getIsSomePageRowsSelected(), disabled: rowSelectionConfig?.disableSelectAll, onCheckedChange: (checked) => t.toggleAllPageRowsSelected(checked) }) })),
|
|
5561
|
+
cell: ({ row }) => (jsxRuntime.jsx("div", { className: styles$5.checkboxCell, children: jsxRuntime.jsx(Checkbox, { checked: row.getIsSelected(), disabled: !row.getCanSelect(), onCheckedChange: (checked) => row.toggleSelected(checked) }) })),
|
|
5420
5562
|
}), [rowSelectionConfig?.disableSelectAll]);
|
|
5421
|
-
const resolvedColumns = React.useMemo(() => (isRowSelectionEnabled ? [selectionColumn, ...
|
|
5563
|
+
const resolvedColumns = React.useMemo(() => (isRowSelectionEnabled ? [selectionColumn, ...effectiveColumns] : effectiveColumns), [isRowSelectionEnabled, selectionColumn, effectiveColumns]);
|
|
5422
5564
|
const showSearch = !!(header?.onSearchChange);
|
|
5423
5565
|
const table = reactTable.useReactTable({
|
|
5424
|
-
data,
|
|
5566
|
+
data: effectiveData,
|
|
5425
5567
|
columns: resolvedColumns,
|
|
5426
5568
|
defaultColumn: { minSize: 44, size: 0 },
|
|
5427
5569
|
state: {
|
|
@@ -5464,7 +5606,7 @@ const TableV2 = ({ columns, data, rowSelection: rowSelectionConfig, enableSortin
|
|
|
5464
5606
|
const totalPages = footer ? Math.ceil(effectiveTotalItems / pageSize) : 0;
|
|
5465
5607
|
const canGoPrev = pageIndex > 0;
|
|
5466
5608
|
const canGoNext = pageIndex + 1 < totalPages;
|
|
5467
|
-
const skeletonRowCount = footer ? pageSize : (
|
|
5609
|
+
const skeletonRowCount = footer ? pageSize : (effectiveData.length > 0 ? effectiveData.length : pageSize);
|
|
5468
5610
|
const selectedRows = React.useMemo(() => table
|
|
5469
5611
|
.getCoreRowModel()
|
|
5470
5612
|
.rows.filter((r) => effectiveRowSelection[r.id])
|
|
@@ -5494,24 +5636,38 @@ const TableV2 = ({ columns, data, rowSelection: rowSelectionConfig, enableSortin
|
|
|
5494
5636
|
setPagination({ pageIndex: 0, pageSize: size });
|
|
5495
5637
|
footer?.onPageSizeChange?.(size);
|
|
5496
5638
|
};
|
|
5497
|
-
return (jsxRuntime.jsxs("div", { className: clsx(styles$
|
|
5639
|
+
return (jsxRuntime.jsxs("div", { className: clsx(styles$5.wrapper, className), children: [showBulkActions && (jsxRuntime.jsxs("div", { className: styles$5.bulkActionsBar, children: [jsxRuntime.jsxs("div", { className: styles$5.bulkActionsInfo, children: [jsxRuntime.jsx(Button, { variant: "text", iconOnly: true, icon: jsxRuntime.jsx(reactIcons.Dismiss16Regular, {}), ariaLabel: "Limpar sele\u00E7\u00E3o", onClick: handleClearSelection, className: styles$5.bulkActionsClearButton }), jsxRuntime.jsx("span", { className: styles$5.bulkActionsLabel, children: bulkActions.label
|
|
5498
5640
|
? bulkActions.label(selectedCount, selectedRows)
|
|
5499
|
-
: `${selectedCount} ${selectedCount === 1 ? 'item selecionado' : 'itens selecionados'}` })] }), jsxRuntime.jsx("div", { className: styles$
|
|
5500
|
-
|
|
5501
|
-
|
|
5502
|
-
|
|
5503
|
-
|
|
5504
|
-
|
|
5505
|
-
|
|
5506
|
-
|
|
5507
|
-
|
|
5508
|
-
|
|
5509
|
-
|
|
5510
|
-
|
|
5511
|
-
|
|
5512
|
-
|
|
5513
|
-
|
|
5514
|
-
|
|
5641
|
+
: `${selectedCount} ${selectedCount === 1 ? 'item selecionado' : 'itens selecionados'}` })] }), jsxRuntime.jsx("div", { className: styles$5.bulkActionsButtons, children: bulkActions.actions.map((action, index) => (jsxRuntime.jsx(Button, { variant: action.variant ?? 'outlined', type: "button", disabled: action.disabled, onClick: action.onClick, size: "sm", children: action.label }, index))) })] })), header && (jsxRuntime.jsxs("div", { className: styles$5.tableHeader, children: [jsxRuntime.jsxs("div", { className: styles$5.tableHeaderLeft, children: [showSearch && (jsxRuntime.jsx("div", { className: styles$5.tableHeaderSearchContainer, children: jsxRuntime.jsx(Search, { value: pendingSearch, virtualKeyboard: header.virtualKeyboard, searchMode: header?.searchMode ?? "on-enter", onChange: (e) => {
|
|
5642
|
+
setPendingSearch(e.target.value);
|
|
5643
|
+
}, onSearch: (val) => {
|
|
5644
|
+
if (footer) {
|
|
5645
|
+
setPagination((prev) => ({ ...prev, pageIndex: 0 }));
|
|
5646
|
+
footer?.onPageChange?.(1);
|
|
5647
|
+
}
|
|
5648
|
+
header?.onSearchChange?.(val);
|
|
5649
|
+
}, onClear: () => {
|
|
5650
|
+
setPendingSearch('');
|
|
5651
|
+
if (footer) {
|
|
5652
|
+
setPagination((prev) => ({ ...prev, pageIndex: 0 }));
|
|
5653
|
+
footer?.onPageChange?.(1);
|
|
5654
|
+
}
|
|
5655
|
+
header?.onSearchChange?.('');
|
|
5656
|
+
}, placeholder: header.searchPlaceholder ?? 'Pesquisar...', className: styles$5.tableHeaderSearch }) })), header.viewToggle && (jsxRuntime.jsx(ToggleButton, { mode: "combined", selectionType: "single", value: activeView, onValueChange: (val) => {
|
|
5657
|
+
if (!val)
|
|
5658
|
+
return;
|
|
5659
|
+
setActiveView(val);
|
|
5660
|
+
if (footer) {
|
|
5661
|
+
setPagination((prev) => ({ ...prev, pageIndex: 0 }));
|
|
5662
|
+
footer?.onPageChange?.(1);
|
|
5663
|
+
}
|
|
5664
|
+
header.viewToggle?.onValueChange?.(val);
|
|
5665
|
+
}, items: header.viewToggle.items.map((item) => ({
|
|
5666
|
+
value: item.value,
|
|
5667
|
+
icon: item.icon,
|
|
5668
|
+
iconOnly: true,
|
|
5669
|
+
tooltipText: item.tooltipText,
|
|
5670
|
+
})) }))] }), !!header.filterItems?.length && (jsxRuntime.jsxs("div", { className: styles$5.tableHeaderFilters, children: [header.filterItems.some((item) => item.type !== 'combined') && (jsxRuntime.jsx("span", { className: styles$5.tableHeaderFilterLabel, children: "Filtros" })), jsxRuntime.jsx("div", { className: styles$5.tableHeaderFilterItems, children: header.filterItems.map((filterItem, index) => {
|
|
5515
5671
|
const commonProps = {
|
|
5516
5672
|
buttonText: filterItem.buttonText,
|
|
5517
5673
|
icon: filterItem.icon,
|
|
@@ -5523,36 +5679,36 @@ const TableV2 = ({ columns, data, rowSelection: rowSelectionConfig, enableSortin
|
|
|
5523
5679
|
onClose: () => filterItem.onToggle?.(false),
|
|
5524
5680
|
};
|
|
5525
5681
|
if (filterItem.type === 'combined') {
|
|
5526
|
-
return (jsxRuntime.jsx(Filter, { mode: "combined", buttonText: filterItem.buttonText, icon: filterItem.icon, title: filterItem.title, drawerWidth: filterItem.drawerWidth,
|
|
5682
|
+
return (jsxRuntime.jsx(Filter, { mode: "combined", buttonText: filterItem.buttonText, icon: filterItem.icon, title: filterItem.title, drawerWidth: filterItem.drawerWidth, appliedFilterCount: filterItem.activeCount, drawerHeaderContent: filterItem.drawerHeaderContent, onApply: filterItem.onApply, onClear: filterItem.onClear, variant: filterItem.variant ?? 'outlined', disabled: filterItem.disabled, children: filterItem.children }, filterItem.id ?? index));
|
|
5527
5683
|
}
|
|
5528
5684
|
if (filterItem.type === 'calendar') {
|
|
5529
5685
|
return (jsxRuntime.jsx(Filter, { ...commonProps, type: "calendar", selectedDate: filterItem.selectedDate, onDateSelect: filterItem.onDateSelect, onClearDate: filterItem.onClear, minDate: filterItem.minDate, maxDate: filterItem.maxDate, locale: filterItem.locale, placeholder: filterItem.placeholder }, filterItem.id ?? index));
|
|
5530
5686
|
}
|
|
5531
5687
|
return (jsxRuntime.jsx(Filter, { ...commonProps, type: filterItem.type, items: filterItem.items, selectedIds: filterItem.selectedIds, onApplyFilter: filterItem.onSelectionChange, placeholder: filterItem.placeholder, enableSearch: filterItem.enableSearch }, filterItem.id ?? index));
|
|
5532
|
-
}) })] }))] })), jsxRuntime.jsx("div", { className: styles$
|
|
5688
|
+
}) })] }))] })), jsxRuntime.jsx("div", { className: styles$5.tableContainer, children: jsxRuntime.jsx("div", { className: styles$5.tableScrollWrapper, children: jsxRuntime.jsxs("table", { className: styles$5.table, "aria-label": "Tabela de dados", "aria-rowcount": data.length + 1, children: [jsxRuntime.jsx("thead", { className: styles$5.tableHead, children: table.getHeaderGroups().map((headerGroup) => (jsxRuntime.jsx("tr", { children: headerGroup.headers.map((col) => (jsxRuntime.jsx("th", { className: styles$5.tableTh, style: {
|
|
5533
5689
|
textAlign: col.column.columnDef.meta?.align,
|
|
5534
5690
|
width: col.column.columnDef.size || undefined,
|
|
5535
5691
|
minWidth: col.column.columnDef.minSize,
|
|
5536
5692
|
maxWidth: col.column.columnDef.maxSize !== Number.MAX_SAFE_INTEGER
|
|
5537
5693
|
? col.column.columnDef.maxSize
|
|
5538
5694
|
: undefined,
|
|
5539
|
-
}, children: jsxRuntime.jsx("div", { className: styles$
|
|
5695
|
+
}, children: jsxRuntime.jsx("div", { className: styles$5.tableThContent, children: col.isPlaceholder ? null : col.column.getCanSort() ? (jsxRuntime.jsxs("button", { type: "button", className: styles$5.tableSortButton, onClick: col.column.getToggleSortingHandler(), "aria-label": `Ordenar por ${typeof col.column.columnDef.header === 'string' ? col.column.columnDef.header : col.id}`, children: [reactTable.flexRender(col.column.columnDef.header, col.getContext()), col.column.getIsSorted() === 'asc' ? (jsxRuntime.jsx(reactIcons.ArrowSortUp16Regular, { className: styles$5.tableSortIcon })) : col.column.getIsSorted() === 'desc' ? (jsxRuntime.jsx(reactIcons.ArrowSortDown16Regular, { className: styles$5.tableSortIcon })) : (jsxRuntime.jsx(reactIcons.ArrowSort16Regular, { className: clsx(styles$5.tableSortIcon, styles$5.tableSortIconNeutral) }))] })) : (reactTable.flexRender(col.column.columnDef.header, col.getContext())) }) }, col.id))) }, headerGroup.id))) }), jsxRuntime.jsx("tbody", { className: styles$5.tableBody, children: loading ? (Array.from({ length: skeletonRowCount }).map((_, rowIdx) => (jsxRuntime.jsx("tr", { className: styles$5.tableRow, children: table.getVisibleLeafColumns().map((col) => (jsxRuntime.jsx("td", { className: styles$5.tableTd, children: jsxRuntime.jsx(Skeleton, {}) }, col.id))) }, `skeleton-row-${rowIdx}`)))) : table.getRowModel().rows.length > 0 ? (table.getRowModel().rows.map((row, index) => {
|
|
5540
5696
|
const rowProps = onRow?.(row.original, index) ?? {};
|
|
5541
|
-
return (jsxRuntime.jsx("tr", { className: clsx(styles$
|
|
5697
|
+
return (jsxRuntime.jsx("tr", { className: clsx(styles$5.tableRow, rowProps.className), onClick: rowProps.onClick, onDoubleClick: rowProps.onDoubleClick, children: row.getVisibleCells().map((cell) => (jsxRuntime.jsx("td", { className: styles$5.tableTd, style: {
|
|
5542
5698
|
textAlign: cell.column.columnDef.meta?.align,
|
|
5543
5699
|
width: cell.column.columnDef.size || undefined,
|
|
5544
5700
|
minWidth: cell.column.columnDef.minSize,
|
|
5545
5701
|
maxWidth: cell.column.columnDef.maxSize !== Number.MAX_SAFE_INTEGER
|
|
5546
5702
|
? cell.column.columnDef.maxSize
|
|
5547
5703
|
: undefined,
|
|
5548
|
-
}, children:
|
|
5549
|
-
})) : (jsxRuntime.jsx("tr", { children: jsxRuntime.jsx("td", { colSpan: table.getVisibleLeafColumns().length, className: styles$
|
|
5704
|
+
}, children: jsxRuntime.jsx("div", { className: styles$5.tableCellMaxHeight, style: { maxHeight: cell.column.columnDef.meta?.maxHeight ?? '64px' }, children: reactTable.flexRender(cell.column.columnDef.cell, cell.getContext()) }) }, cell.id))) }, row.id));
|
|
5705
|
+
})) : (jsxRuntime.jsx("tr", { children: jsxRuntime.jsx("td", { colSpan: table.getVisibleLeafColumns().length, className: styles$5.tableEmptyCell, children: jsxRuntime.jsx(EmptyState, { emptyIcon: emptyIcon, emptyTitle: emptyTitle, emptyText: emptyText }) }) })) })] }) }) }), footer && (jsxRuntime.jsxs("div", { className: styles$5.tablePagination, children: [jsxRuntime.jsxs("div", { className: styles$5.tablePaginationSelect, children: [jsxRuntime.jsx("label", { htmlFor: "tablev2-page-size", className: styles$5.tablePaginationLabel, children: "Itens por p\u00E1gina" }), jsxRuntime.jsx("select", { id: "tablev2-page-size", value: pageSize, onChange: handlePageSizeChange, className: styles$5.tablePaginationSelectInput, children: (footer.pageSizeOptions ?? [10, 25, 50, 100]).map((opt) => (jsxRuntime.jsx("option", { value: opt, children: opt }, opt))) })] }), jsxRuntime.jsx("div", { className: styles$5.tablePaginationInfo, children: jsxRuntime.jsx("span", { children: totalPages > 0
|
|
5550
5706
|
? `${pageIndex + 1} de ${totalPages}`
|
|
5551
|
-
: '0 páginas' }) }), jsxRuntime.jsxs("div", { className: styles$
|
|
5707
|
+
: '0 páginas' }) }), jsxRuntime.jsxs("div", { className: styles$5.tablePaginationControls, children: [jsxRuntime.jsx("button", { className: styles$5.tablePaginationButton, onClick: () => {
|
|
5552
5708
|
const newPage = pageIndex - 1;
|
|
5553
5709
|
setPagination((prev) => ({ ...prev, pageIndex: newPage }));
|
|
5554
5710
|
footer?.onPageChange?.(newPage + 1);
|
|
5555
|
-
}, disabled: !canGoPrev, "aria-label": "P\u00E1gina anterior", children: jsxRuntime.jsx(reactIcons.ChevronLeft16Regular, {}) }), jsxRuntime.jsx("button", { className: styles$
|
|
5711
|
+
}, disabled: !canGoPrev, "aria-label": "P\u00E1gina anterior", children: jsxRuntime.jsx(reactIcons.ChevronLeft16Regular, {}) }), jsxRuntime.jsx("button", { className: styles$5.tablePaginationButton, onClick: () => {
|
|
5556
5712
|
const newPage = pageIndex + 1;
|
|
5557
5713
|
setPagination((prev) => ({ ...prev, pageIndex: newPage }));
|
|
5558
5714
|
footer?.onPageChange?.(newPage + 1);
|
|
@@ -5561,7 +5717,7 @@ const TableV2 = ({ columns, data, rowSelection: rowSelectionConfig, enableSortin
|
|
|
5561
5717
|
|
|
5562
5718
|
var styles$3 = {"container":"TextArea-module__container___WEBC-","inputWrapper":"TextArea-module__inputWrapper___-omPx","inputContainer":"TextArea-module__inputContainer___0-jKY","footer":"TextArea-module__footer___7XMlj","helperText":"TextArea-module__helperText___709rD","charCount":"TextArea-module__charCount___zdbxM","error":"TextArea-module__error___DWDms","disabled":"TextArea-module__disabled___lHxCa"};
|
|
5563
5719
|
|
|
5564
|
-
const TextArea =
|
|
5720
|
+
const TextArea = ({ ref, className, value, label, placeholder, onChange, disabled = false, maxLength, required = false, helperText, tooltipText, tooltipSide = 'bottom', tooltipAlign = 'start', errorMessage, error, id, onBlur, onFocus, name, resize = 'vertical', charCount = false, height, virtualKeyboard, ...rest }) => {
|
|
5565
5721
|
const normalizeValue = (val) => {
|
|
5566
5722
|
return val === undefined || val === null ? '' : String(val);
|
|
5567
5723
|
};
|
|
@@ -5593,24 +5749,24 @@ const TextArea = React.forwardRef(({ className, value, label, placeholder, onCha
|
|
|
5593
5749
|
onFocus?.(e);
|
|
5594
5750
|
}, [onFocus]);
|
|
5595
5751
|
const hasError = Boolean(textareaError) || Boolean(error);
|
|
5596
|
-
const displayHelperText = (error ? errorMessage : undefined) || textareaError || helperText
|
|
5752
|
+
const displayHelperText = (error ? errorMessage : undefined) || textareaError || helperText;
|
|
5597
5753
|
const helperId = (textareaError || error)
|
|
5598
5754
|
? `${componentId}-error`
|
|
5599
5755
|
: helperText
|
|
5600
5756
|
? `${componentId}-helper`
|
|
5601
5757
|
: undefined;
|
|
5602
5758
|
const containerClass = clsx(styles$3.container, disabled && styles$3.disabled, hasError && !disabled && styles$3.error, className);
|
|
5603
|
-
return (jsxRuntime.jsxs("div", { className: containerClass, children: [label && (jsxRuntime.jsx(LabelComponent, { htmlFor: componentId, required: required, tooltip:
|
|
5759
|
+
return (jsxRuntime.jsxs("div", { className: containerClass, children: [label && (jsxRuntime.jsx(LabelComponent, { htmlFor: componentId, required: required, tooltip: !!tooltipText, tooltipText: tooltipText, side: tooltipSide, align: tooltipAlign, error: hasError, disabled: disabled, children: label })), jsxRuntime.jsxs("div", { className: styles$3.inputWrapper, children: [jsxRuntime.jsx("div", { className: styles$3.inputContainer, children: jsxRuntime.jsx("textarea", { ...rest, ref: setTextareaRefs, id: componentId, name: name, value: textareaValue, placeholder: placeholder, onChange: handleChange, onFocus: handleFocus, onBlur: handleBlur, maxLength: maxLength, disabled: disabled, "aria-invalid": hasError, "aria-required": required, "aria-describedby": helperId, style: { resize, height }, inputMode: (virtualKeyboard === 'default' || virtualKeyboard === 'numeric') ? 'none' : rest.inputMode }) }), (((error && errorMessage) || textareaError || helperText) || (charCount && maxLength)) && (jsxRuntime.jsxs("div", { className: styles$3.footer, children: [((error && errorMessage) || textareaError || helperText) && (jsxRuntime.jsx("span", { id: helperId, className: styles$3.helperText, "aria-live": hasError ? 'polite' : undefined, children: displayHelperText })), charCount && maxLength && (jsxRuntime.jsxs("span", { className: styles$3.charCount, children: [textareaValue.length, "/", maxLength] }))] }))] }), (virtualKeyboard === 'default' || virtualKeyboard === 'numeric') && (jsxRuntime.jsx("div", { className: "virtualKeyboardWrapper", children: jsxRuntime.jsx(VirtualKeyboard, { variant: "native", type: virtualKeyboard, maxLength: maxLength, value: textareaValue, targetRef: textareaRef, onChange: (val) => {
|
|
5604
5760
|
if (!disabled && (!maxLength || val.length <= maxLength)) {
|
|
5605
5761
|
setTextareaValue(val);
|
|
5606
5762
|
onChange?.(val);
|
|
5607
5763
|
}
|
|
5608
5764
|
} }) }))] }));
|
|
5609
|
-
}
|
|
5765
|
+
};
|
|
5610
5766
|
TextArea.displayName = 'TextArea';
|
|
5611
5767
|
var TextArea_default = React.memo(TextArea);
|
|
5612
5768
|
|
|
5613
|
-
var styles$2 = {"toastViewport":"Toast-module__toastViewport___Ns71-","toastRoot":"Toast-module__toastRoot___ZtA3x","slideIn":"Toast-module__slideIn___QcXWP","toastTitle":"Toast-module__toastTitle___WbjNH","toastContent":"Toast-module__toastContent___IY5QB","toastClose":"Toast-module__toastClose___FqVsT","Icon":"Toast-module__Icon___ERU9c","iconInfo":"Toast-module__iconInfo___G-II3","iconSuccess":"Toast-module__iconSuccess___N8iF1","iconAlert":"Toast-module__iconAlert___SSf8u"};
|
|
5769
|
+
var styles$2 = {"toastViewport":"Toast-module__toastViewport___Ns71-","toastRoot":"Toast-module__toastRoot___ZtA3x","slideIn":"Toast-module__slideIn___QcXWP","fadeOut":"Toast-module__fadeOut___0WaGy","toastTitle":"Toast-module__toastTitle___WbjNH","toastContent":"Toast-module__toastContent___IY5QB","toastClose":"Toast-module__toastClose___FqVsT","Icon":"Toast-module__Icon___ERU9c","iconInfo":"Toast-module__iconInfo___G-II3","iconSuccess":"Toast-module__iconSuccess___N8iF1","iconAlert":"Toast-module__iconAlert___SSf8u"};
|
|
5614
5770
|
|
|
5615
5771
|
/**
|
|
5616
5772
|
* Contexto React que armazena o estado e as ações do sistema de Toast.
|
|
@@ -6151,15 +6307,13 @@ exports.Radio = Radio;
|
|
|
6151
6307
|
exports.Search = Search;
|
|
6152
6308
|
exports.Select = Select;
|
|
6153
6309
|
exports.Switch = Switch;
|
|
6154
|
-
exports.Table = Table;
|
|
6155
|
-
exports.TableHeader = TableHeader;
|
|
6156
|
-
exports.TablePagination = TablePagination;
|
|
6157
6310
|
exports.TableV2 = TableV2;
|
|
6158
6311
|
exports.TextArea = TextArea_default;
|
|
6159
6312
|
exports.TextField = TextField;
|
|
6160
6313
|
exports.Toast = Toast;
|
|
6161
6314
|
exports.ToastContainer = ToastContainer;
|
|
6162
6315
|
exports.ToastProvider = ToastProvider;
|
|
6316
|
+
exports.ToggleButton = ToggleButton;
|
|
6163
6317
|
exports.Tooltip = Tooltip;
|
|
6164
6318
|
exports.VerificationCode = VerificationCode;
|
|
6165
6319
|
exports.VirtualKeyboard = VirtualKeyboard;
|