@tmlmobilidade/ui 20250227.1959.42 → 20250305.1746.10

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.
@@ -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({ classNames, footer, header, items, }: SidebarProps): import("react/jsx-runtime").JSX.Element;
10
+ export default function Sidebar({ items, }: SidebarProps): import("react/jsx-runtime").JSX.Element;
@@ -1,3 +1,4 @@
1
+ export { default as AppWrapper } from './AppWrapper';
1
2
  export { default as Grid } from './Grid';
2
3
  export { default as Section } from './Section';
3
4
  export { default as Sidebar } from './Sidebar';
@@ -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: (input: string | URL | Request, init?: RequestInit | undefined) => Promise<any>;
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;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@tmlmobilidade/ui",
3
- "version": "20250227.1959.42",
3
+ "version": "20250305.1746.10",
4
4
  "author": "",
5
5
  "license": "ISC",
6
6
  "publishConfig": {