@tmlmobilidade/ui 20250227.1959.42 → 20250305.1754.42
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/cjs/index.js +140 -98
- package/dist/cjs/index.js.map +1 -1
- package/dist/cjs/types/src/components/layout/AppWrapper/Header/index.d.ts +1 -0
- package/dist/cjs/types/src/components/layout/AppWrapper/Options/index.d.ts +1 -0
- package/dist/cjs/types/src/components/layout/AppWrapper/index.d.ts +11 -0
- package/dist/cjs/types/src/components/layout/Sidebar/index.d.ts +1 -14
- package/dist/cjs/types/src/components/layout/index.d.ts +1 -0
- package/dist/cjs/types/src/lib/utils.d.ts +1 -1
- package/dist/esm/index.js +141 -100
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/types/src/components/layout/AppWrapper/Header/index.d.ts +1 -0
- package/dist/esm/types/src/components/layout/AppWrapper/Options/index.d.ts +1 -0
- package/dist/esm/types/src/components/layout/AppWrapper/index.d.ts +11 -0
- package/dist/esm/types/src/components/layout/Sidebar/index.d.ts +1 -14
- package/dist/esm/types/src/components/layout/index.d.ts +1 -0
- package/dist/esm/types/src/lib/utils.d.ts +1 -1
- package/dist/index.d.ts +22 -25
- package/dist/styles.css +153 -67
- package/package.json +1 -1
@@ -0,0 +1 @@
|
|
1
|
+
export default function Header(): import("react/jsx-runtime").JSX.Element;
|
@@ -0,0 +1 @@
|
|
1
|
+
export default function AppOptions(): import("react/jsx-runtime").JSX.Element;
|
@@ -0,0 +1,11 @@
|
|
1
|
+
import { SidebarItemProps } from '../Sidebar';
|
2
|
+
interface AppWrapperProps {
|
3
|
+
children: React.ReactNode;
|
4
|
+
icon: React.ReactNode | {
|
5
|
+
href: string;
|
6
|
+
icon: React.ReactNode;
|
7
|
+
};
|
8
|
+
sidebarItems: SidebarItemProps[];
|
9
|
+
}
|
10
|
+
export default function AppWrapper({ children, icon, sidebarItems, }: AppWrapperProps): import("react/jsx-runtime").JSX.Element;
|
11
|
+
export {};
|
@@ -3,21 +3,8 @@ export interface SidebarItemProps {
|
|
3
3
|
href: string;
|
4
4
|
icon: React.ReactNode;
|
5
5
|
label: string;
|
6
|
-
permission?: {
|
7
|
-
action: string;
|
8
|
-
scope: string;
|
9
|
-
};
|
10
6
|
}
|
11
7
|
export interface SidebarProps {
|
12
|
-
classNames?: {
|
13
|
-
container?: string;
|
14
|
-
footer?: string;
|
15
|
-
header?: string;
|
16
|
-
navButton?: string;
|
17
|
-
navWrapper?: string;
|
18
|
-
};
|
19
|
-
footer?: React.ReactNode;
|
20
|
-
header?: React.ReactNode;
|
21
8
|
items: SidebarItemProps[];
|
22
9
|
}
|
23
|
-
export default function Sidebar({
|
10
|
+
export default function Sidebar({ items, }: SidebarProps): import("react/jsx-runtime").JSX.Element;
|
@@ -19,7 +19,7 @@ export declare const truncate: (str: null | string, length: number) => null | st
|
|
19
19
|
* @param {...Parameters<typeof fetch>} args - The arguments to pass to the fetch function.
|
20
20
|
* @returns {Promise<any>} - A promise that resolves to the JSON response.
|
21
21
|
*/
|
22
|
-
export declare const fetcher: (
|
22
|
+
export declare const fetcher: (...args: Parameters<typeof fetch>) => Promise<any>;
|
23
23
|
/**
|
24
24
|
* Capitalizes first letters of words in string.
|
25
25
|
* @param {string} str String to be modified
|
package/dist/index.d.ts
CHANGED
@@ -377,6 +377,27 @@ interface DataTableTitleProps<T> {
|
|
377
377
|
|
378
378
|
declare function DataTable<T>({ records, ...props }: DataTableProps<T>): react_jsx_runtime.JSX.Element;
|
379
379
|
|
380
|
+
interface SidebarItemProps {
|
381
|
+
disabled?: boolean;
|
382
|
+
href: string;
|
383
|
+
icon: React.ReactNode;
|
384
|
+
label: string;
|
385
|
+
}
|
386
|
+
interface SidebarProps {
|
387
|
+
items: SidebarItemProps[];
|
388
|
+
}
|
389
|
+
declare function Sidebar({ items, }: SidebarProps): react_jsx_runtime.JSX.Element;
|
390
|
+
|
391
|
+
interface AppWrapperProps {
|
392
|
+
children: React.ReactNode;
|
393
|
+
icon: React.ReactNode | {
|
394
|
+
href: string;
|
395
|
+
icon: React.ReactNode;
|
396
|
+
};
|
397
|
+
sidebarItems: SidebarItemProps[];
|
398
|
+
}
|
399
|
+
declare function AppWrapper({ children, icon, sidebarItems, }: AppWrapperProps): react_jsx_runtime.JSX.Element;
|
400
|
+
|
380
401
|
interface Props$1 extends React.HTMLAttributes<HTMLDivElement> {
|
381
402
|
columns?: 'a' | 'aab' | 'ab' | 'abb' | 'abc' | 'abcd';
|
382
403
|
gap?: 'lg' | 'md' | 'none' | 'sm' | 'xl' | 'xs';
|
@@ -395,30 +416,6 @@ interface SectionProps {
|
|
395
416
|
}
|
396
417
|
declare function Section({ children, classNames, description, icon, title, titleAs, }: SectionProps): react_jsx_runtime.JSX.Element;
|
397
418
|
|
398
|
-
interface SidebarItemProps {
|
399
|
-
disabled?: boolean;
|
400
|
-
href: string;
|
401
|
-
icon: React.ReactNode;
|
402
|
-
label: string;
|
403
|
-
permission?: {
|
404
|
-
action: string;
|
405
|
-
scope: string;
|
406
|
-
};
|
407
|
-
}
|
408
|
-
interface SidebarProps {
|
409
|
-
classNames?: {
|
410
|
-
container?: string;
|
411
|
-
footer?: string;
|
412
|
-
header?: string;
|
413
|
-
navButton?: string;
|
414
|
-
navWrapper?: string;
|
415
|
-
};
|
416
|
-
footer?: React.ReactNode;
|
417
|
-
header?: React.ReactNode;
|
418
|
-
items: SidebarItemProps[];
|
419
|
-
}
|
420
|
-
declare function Sidebar({ classNames, footer, header, items, }: SidebarProps): react_jsx_runtime.JSX.Element;
|
421
|
-
|
422
419
|
interface SurfaceProps$1 {
|
423
420
|
children: React.ReactNode;
|
424
421
|
padding?: 'lg' | 'md' | 'sm' | 'xl';
|
@@ -572,4 +569,4 @@ declare function useSearchQuery<T>(data: T[], { accessors, customSearch, debounc
|
|
572
569
|
setSearchQuery: React$1.Dispatch<React$1.SetStateAction<string | undefined>>;
|
573
570
|
};
|
574
571
|
|
575
|
-
export { ActionIcon, Badge, Button, CMIcon, CMLogo, Checkbox, ComboboxComponent as Combobox, type DataItem, DataTable, type DataTableColumn, type DataTableColumnProps, type DataTableHeaderProps, type DataTableProps, type DataTableRowProps, type DataTableSearchProps, type DataTableTitleProps, DateTimePicker, DeleteActionIcon, Description, FileButton, Grid, Label, Menu, PasswordInput, Section, SegmentedControl, Sidebar, SimpleSurface, Slider, Spacer, Surface, Switch, TMLogo, TMLogoDark, TMLogoLight, Tag, Text, Component$1 as TextArea, Component as TextInput, ThemeDark, ThemeLight, ThemeProvider, ThemeSwitcher, Themer, type ToastPromiseParams, type ToastProps, Tooltip, useScreenSize, useSearchQuery, useTheme, useToast };
|
572
|
+
export { ActionIcon, AppWrapper, Badge, Button, CMIcon, CMLogo, Checkbox, ComboboxComponent as Combobox, type DataItem, DataTable, type DataTableColumn, type DataTableColumnProps, type DataTableHeaderProps, type DataTableProps, type DataTableRowProps, type DataTableSearchProps, type DataTableTitleProps, DateTimePicker, DeleteActionIcon, Description, FileButton, Grid, Label, Menu, PasswordInput, Section, SegmentedControl, Sidebar, SimpleSurface, Slider, Spacer, Surface, Switch, TMLogo, TMLogoDark, TMLogoLight, Tag, Text, Component$1 as TextArea, Component as TextInput, ThemeDark, ThemeLight, ThemeProvider, ThemeSwitcher, Themer, type ToastPromiseParams, type ToastProps, Tooltip, useScreenSize, useSearchQuery, useTheme, useToast };
|
package/dist/styles.css
CHANGED
@@ -1471,6 +1471,151 @@ breakpoint-mobile {
|
|
1471
1471
|
/* * */
|
1472
1472
|
/* CONTAINER */
|
1473
1473
|
|
1474
|
+
.styles-module_container__tduxg {
|
1475
|
+
height: 100%;
|
1476
|
+
display: flex;
|
1477
|
+
flex-direction: column;
|
1478
|
+
gap: var(--size-spacing-xs);
|
1479
|
+
justify-content: space-between;
|
1480
|
+
z-index: 25;
|
1481
|
+
overflow-y: auto;
|
1482
|
+
border-right: 1px solid var(--color-system-border-100);
|
1483
|
+
background-color: var(--color-system-background-100);
|
1484
|
+
box-shadow: 0 0 10px -5px rgba(0, 0, 0, 0.2);
|
1485
|
+
}
|
1486
|
+
|
1487
|
+
/* * */
|
1488
|
+
/* NAV WRAPPER */
|
1489
|
+
|
1490
|
+
.styles-module_navWrapper__Xb59N {
|
1491
|
+
width: 100%;
|
1492
|
+
display: flex;
|
1493
|
+
flex-direction: column;
|
1494
|
+
align-items: center;
|
1495
|
+
gap: var(--size-spacing-md);
|
1496
|
+
padding: var(--size-spacing-lg);
|
1497
|
+
}
|
1498
|
+
|
1499
|
+
/* * */
|
1500
|
+
/* NAV BUTTON */
|
1501
|
+
|
1502
|
+
.styles-module_navButton__kTv0k {
|
1503
|
+
font-size: 26px;
|
1504
|
+
color: var(--color-system-text-100);
|
1505
|
+
background-color: transparent;
|
1506
|
+
border: 2px solid transparent;
|
1507
|
+
border-radius: var(--border-radius-xs);
|
1508
|
+
transition: all 0.5s ease-in;
|
1509
|
+
|
1510
|
+
&.styles-module_selected__w-GVG {
|
1511
|
+
color: var(--color-contrast);
|
1512
|
+
background-color: var(--color-primary);
|
1513
|
+
border-color: var(--color-secondary);
|
1514
|
+
}
|
1515
|
+
|
1516
|
+
&.styles-module_disabled__lxQjN {
|
1517
|
+
color: var(--color-system-text-300);
|
1518
|
+
cursor: not-allowed;
|
1519
|
+
}
|
1520
|
+
|
1521
|
+
&:hover:not(.styles-module_disabled__lxQjN) {
|
1522
|
+
color: var(--color-contrast);
|
1523
|
+
background-color: var(--color-secondary);
|
1524
|
+
}
|
1525
|
+
}
|
1526
|
+
/* * */
|
1527
|
+
/* CONTAINER */
|
1528
|
+
|
1529
|
+
.styles-module_container__G0H4W {
|
1530
|
+
display: flex;
|
1531
|
+
flex-direction: row;
|
1532
|
+
align-items: center;
|
1533
|
+
justify-content: space-between;
|
1534
|
+
width: 100%;
|
1535
|
+
height: 100%;
|
1536
|
+
z-index: 50;
|
1537
|
+
padding: var(--size-spacing-sm);
|
1538
|
+
padding-left: 20px;
|
1539
|
+
background-color: var(--color-system-background-100);
|
1540
|
+
border-bottom: 1px solid var(--color-system-border-100);
|
1541
|
+
box-shadow: 0 0 10px -5px rgba(0, 0, 0, 0.2);
|
1542
|
+
}
|
1543
|
+
|
1544
|
+
@media (prefers-color-scheme: dark) {
|
1545
|
+
.styles-module_container__G0H4W {
|
1546
|
+
background-color: var(--color-system-background-100);
|
1547
|
+
}
|
1548
|
+
}
|
1549
|
+
|
1550
|
+
/* * */
|
1551
|
+
/* GREETING */
|
1552
|
+
|
1553
|
+
.styles-module_greeting__Zw9r- {
|
1554
|
+
color: var(--color-system-text-100);
|
1555
|
+
font-size: 14px;
|
1556
|
+
font-weight: 700;
|
1557
|
+
text-transform: uppercase;
|
1558
|
+
line-height: 1;
|
1559
|
+
}
|
1560
|
+
|
1561
|
+
/* * */
|
1562
|
+
/* OPTIONS */
|
1563
|
+
|
1564
|
+
.styles-module_options__RyJJ1 {
|
1565
|
+
display: flex;
|
1566
|
+
flex-direction: row;
|
1567
|
+
gap: var(--size-md);
|
1568
|
+
}
|
1569
|
+
|
1570
|
+
/* * */
|
1571
|
+
/* CONTAINER */
|
1572
|
+
|
1573
|
+
.styles-module_container__V2XNO {
|
1574
|
+
width: 100%;
|
1575
|
+
height: 100%;
|
1576
|
+
display: grid;
|
1577
|
+
grid-template-rows: 50px 1fr;
|
1578
|
+
grid-template-columns: 85px 1fr;
|
1579
|
+
border-top: 1px solid var(--color-system-border-100);
|
1580
|
+
}
|
1581
|
+
|
1582
|
+
/* * */
|
1583
|
+
/* APP ICON */
|
1584
|
+
|
1585
|
+
.styles-module_appIcon__QFZYG {
|
1586
|
+
display: flex;
|
1587
|
+
align-items: center;
|
1588
|
+
padding: var(--size-spacing-sm);
|
1589
|
+
width: 100%;
|
1590
|
+
height: 100%;
|
1591
|
+
z-index: 100;
|
1592
|
+
background-color: var(--color-system-background-100);
|
1593
|
+
border-bottom: 1px solid var(--color-system-border-100);
|
1594
|
+
border-right: 1px solid var(--color-system-border-100);
|
1595
|
+
box-shadow: 0 0 15px -5px rgba(0, 0, 0, 0.1);
|
1596
|
+
}
|
1597
|
+
|
1598
|
+
@media (prefers-color-scheme: dark) {
|
1599
|
+
.styles-module_appIcon__QFZYG {
|
1600
|
+
background-color: var(--color-system-background-100);
|
1601
|
+
}
|
1602
|
+
}
|
1603
|
+
|
1604
|
+
/* * */
|
1605
|
+
/* CONTENT */
|
1606
|
+
|
1607
|
+
.styles-module_content__N1Zgw {
|
1608
|
+
overflow: auto;
|
1609
|
+
width: 100%;
|
1610
|
+
height: 100%;
|
1611
|
+
padding: var(--size-spacing-sm);
|
1612
|
+
background-color: var(--color-system-background-200);
|
1613
|
+
z-index: 0;
|
1614
|
+
}
|
1615
|
+
|
1616
|
+
/* * */
|
1617
|
+
/* CONTAINER */
|
1618
|
+
|
1474
1619
|
.styles-module_container__u-Ao- {
|
1475
1620
|
display: grid;
|
1476
1621
|
grid-template-rows: 1fr;;
|
@@ -1663,73 +1808,6 @@ breakpoint-mobile {
|
|
1663
1808
|
.styles-module_icon__ut-ws {
|
1664
1809
|
color: var(--color-system-border-100);
|
1665
1810
|
}
|
1666
|
-
/* * */
|
1667
|
-
/* CONTAINER */
|
1668
|
-
|
1669
|
-
.styles-module_container__tduxg {
|
1670
|
-
height: 100%;
|
1671
|
-
display: flex;
|
1672
|
-
flex-direction: column;
|
1673
|
-
gap: var(--size-spacing-xs);
|
1674
|
-
justify-content: space-between;
|
1675
|
-
z-index: 25;
|
1676
|
-
overflow-y: auto;
|
1677
|
-
border-right: 1px solid var(--color-system-border-100);
|
1678
|
-
background-color: var(--color-system-background-100);
|
1679
|
-
}
|
1680
|
-
|
1681
|
-
/* * */
|
1682
|
-
/* NAV WRAPPER */
|
1683
|
-
|
1684
|
-
.styles-module_navWrapper__Xb59N {
|
1685
|
-
width: 100%;
|
1686
|
-
display: flex;
|
1687
|
-
flex-direction: column;
|
1688
|
-
align-items: center;
|
1689
|
-
gap: var(--size-spacing-md);
|
1690
|
-
padding: var(--size-spacing-lg);
|
1691
|
-
}
|
1692
|
-
|
1693
|
-
/* * */
|
1694
|
-
/* NAV BUTTON */
|
1695
|
-
|
1696
|
-
.styles-module_navButton__kTv0k {
|
1697
|
-
font-size: 26px;
|
1698
|
-
color: var(--color-system-text-100);
|
1699
|
-
background-color: transparent;
|
1700
|
-
border: 2px solid transparent;
|
1701
|
-
border-radius: var(--border-radius-xs);
|
1702
|
-
transition: all 0.5s ease-in;
|
1703
|
-
|
1704
|
-
&.styles-module_selected__w-GVG {
|
1705
|
-
color: var(--color-contrast);
|
1706
|
-
background-color: var(--color-primary);
|
1707
|
-
border-color: var(--color-secondary);
|
1708
|
-
}
|
1709
|
-
|
1710
|
-
&.styles-module_disabled__lxQjN {
|
1711
|
-
color: var(--color-system-text-300);
|
1712
|
-
cursor: not-allowed;
|
1713
|
-
}
|
1714
|
-
|
1715
|
-
&:hover:not(.styles-module_disabled__lxQjN) {
|
1716
|
-
color: var(--color-contrast);
|
1717
|
-
background-color: var(--color-secondary);
|
1718
|
-
}
|
1719
|
-
}
|
1720
|
-
|
1721
|
-
|
1722
|
-
.styles-module_header__Rc7hw {
|
1723
|
-
border-bottom: 1px solid var(--color-system-border-100);
|
1724
|
-
padding: var(--size-spacing-sm) 0;
|
1725
|
-
}
|
1726
|
-
|
1727
|
-
.styles-module_footer__1qqil {
|
1728
|
-
padding: var(--size-spacing-sm) 0;
|
1729
|
-
margin-top: auto;
|
1730
|
-
border-top: 1px solid var(--color-system-border-100);
|
1731
|
-
}
|
1732
|
-
|
1733
1811
|
/* * */
|
1734
1812
|
/* SURFACE / ROOT */
|
1735
1813
|
|
@@ -3515,6 +3593,14 @@ fieldset:disabled .mantine-active:active {
|
|
3515
3593
|
color: var(--input-disabled-color);
|
3516
3594
|
}
|
3517
3595
|
|
3596
|
+
/* Fixes odd Firefox behavior in Select – https://github.com/mantinedev/mantine/issues/7476 */
|
3597
|
+
|
3598
|
+
@supports (-moz-appearance: none) {
|
3599
|
+
.m_8fb7ebe7[readonly][aria-haspopup] {
|
3600
|
+
pointer-events: none;
|
3601
|
+
}
|
3602
|
+
}
|
3603
|
+
|
3518
3604
|
.m_82577fc2 {
|
3519
3605
|
pointer-events: var(--section-pointer-events);
|
3520
3606
|
position: absolute;
|