@tmlmobilidade/ui 20250210.1115.1 → 20250226.1358.59

package/dist/cjs/types/src/components/common/Combobox/index.d.ts

@@ -1,5 +1,6 @@
 import { ComboboxProps as MantineComboboxProps } from '@mantine/core';
 export interface DataItem {
+    icon?: React.ReactNode;
     label: string;
     value: string;
 }

package/dist/cjs/types/src/components/common/Tree/index.d.ts

@@ -0,0 +1 @@
+export { getTreeExpandedState, RenderTreeNodePayload, Tree, TreeNodeData, useTree } from '@mantine/core';

package/dist/cjs/types/src/components/common/index.d.ts

@@ -19,3 +19,4 @@ export { default as Text } from './Text';
 export { default as TextArea } from './TextArea';
 export { default as TextInput } from './TextInput';
 export { default as Tooltip } from './Tooltip';
+export * from './Tree';

package/dist/esm/index.js

@@ -4,6 +4,7 @@ import React__default, { createContext, useState, useEffect, useMemo, useContext
 import { clsx } from 'clsx';
 import { DateTime } from 'luxon';
 import { ActionIcon as ActionIcon$1, createTheme, TextInput, Textarea, PasswordInput as PasswordInput$1, Button as Button$1, MantineProvider, Menu as Menu$1, ColorSwatch, Badge as Badge$1, Checkbox as Checkbox$1, useCombobox, Combobox, Group, CheckIcon, PillsInput, Pill, InputBase, Input, SegmentedControl as SegmentedControl$1, Slider as Slider$1, Switch as Switch$1, Text as Text$1, Tooltip as Tooltip$1, Center, rem, Table, Accordion } from '@mantine/core';
+export { Tree, getTreeExpandedState, useTree } from '@mantine/core';
 import { DatesProvider, DateTimePicker as DateTimePicker$1 } from '@mantine/dates';
 import { ModalsProvider, modals as modals$1 } from '@mantine/modals';
 export * from '@mantine/modals';
@@ -1014,6 +1015,7 @@ var styles$k = {"wrapper":"styles-module_wrapper__7zsRX","input":"styles-module_
 function parseComboboxItem(item) {
     if (typeof item === 'string') {
         return {
+            icon: null,
             label: item,
             value: item,
         };
@@ -1036,7 +1038,6 @@ function ComboboxComponent(props) {
     }, [multiple, props.value]);
     // Helper functions
     const getValue = (val) => typeof val === 'string' ? val : val.value;
-    const getLabel = (val) => typeof val === 'string' ? val : val.label;
     /**
      * Resets the value based on initialValue or default state.
      */
@@ -1121,10 +1122,10 @@ function ComboboxComponent(props) {
     function renderValues() {
         if (multiple && Array.isArray(value)) {
             return value.map((item) => {
-                const itemData = data.find(dataItem => getValue(dataItem) === item);
+                const itemData = parseComboboxItem(data.find(dataItem => getValue(dataItem) === item) || '');
                 if (!itemData)
                     return null;
-                return (jsxRuntimeExports.jsx(Pill, { className: styles$k.pill, onRemove: () => removeValue(item), withRemoveButton: true, children: jsxRuntimeExports.jsx("span", { children: parseComboboxItem(itemData)?.label }) }, item));
+                return (jsxRuntimeExports.jsx(Pill, { className: styles$k.pill, onRemove: () => removeValue(item), withRemoveButton: true, children: jsxRuntimeExports.jsxs(Group, { gap: "sm", children: [itemData.icon && jsxRuntimeExports.jsx("span", { className: styles$k.icon, children: itemData.icon }), jsxRuntimeExports.jsx("span", { children: itemData.label })] }) }, item));
             });
         }
         return null;
@@ -1132,10 +1133,13 @@ function ComboboxComponent(props) {
     // Render Combobox Options
     function renderOptions() {
         const filtered = filterData();
-        return (jsxRuntimeExports.jsx(ViewportList, { itemMargin: maxHeight, items: filtered, children: item => (jsxRuntimeExports.jsx(Combobox.Option, { value: getValue(item), active: Array.isArray(value)
-                    && value.some(v => getValue(v) === getValue(item)), children: jsxRuntimeExports.jsxs(Group, { gap: "sm", children: [multiple
-                            && Array.isArray(value)
-                            && value.some(v => getValue(v) === getValue(item)) && jsxRuntimeExports.jsx(CheckIcon, { size: 12 }), jsxRuntimeExports.jsx("span", { children: getLabel(item) })] }) }, getValue(item))) }));
+        return (jsxRuntimeExports.jsx(ViewportList, { itemMargin: maxHeight, items: filtered, children: (item) => {
+                const itemData = parseComboboxItem(item);
+                return (jsxRuntimeExports.jsx(Combobox.Option, { value: itemData.value, active: Array.isArray(value)
+                        && value.some(v => getValue(v) === itemData.value), children: jsxRuntimeExports.jsxs(Group, { gap: "sm", children: [multiple
+                                && Array.isArray(value)
+                                && value.some(v => getValue(v) === itemData.value) && jsxRuntimeExports.jsx(CheckIcon, { size: 12 }), jsxRuntimeExports.jsxs(Group, { gap: "sm", children: [itemData.icon && jsxRuntimeExports.jsx("span", { className: styles$k.icon, children: itemData.icon }), jsxRuntimeExports.jsx("span", { children: itemData.label })] })] }) }, itemData.value));
+            } }));
     }
     // Render Input Field
     function renderInput() {
@@ -1152,14 +1156,14 @@ function ComboboxComponent(props) {
                                         }
                                     } }) }), jsxRuntimeExports.jsx("div", { className: styles$k.pillClearButton, children: renderClearButton() })] }) }) }));
         }
-        const itemData = data.find(dataItem => getValue(dataItem) === value);
+        const itemData = parseComboboxItem(data.find(dataItem => getValue(dataItem) === value) || '');
         return (jsxRuntimeExports.jsx(Combobox.Target, { children: searchable ? (jsxRuntimeExports.jsx(InputBase, { className: styles$k.input, onChange: handleSearchChange, onClick: () => combobox.openDropdown(), onFocus: () => combobox.openDropdown(), placeholder: "Search value", rightSection: renderClearButton(), type: "text", value: search, onBlur: () => {
                     combobox.closeDropdown();
-                    setSearch(itemData ? parseComboboxItem(itemData)?.label : '');
+                    setSearch(itemData ? itemData.label : '');
                 }, rightSectionPointerEvents: value === null ? 'none' : 'all' })) : (jsxRuntimeExports.jsx(InputBase, { className: styles$k.input, component: "button", onClick: () => combobox.openDropdown(), onFocus: () => combobox.openDropdown(), rightSection: renderClearButton(), type: "button", onBlur: () => {
                     combobox.closeDropdown();
                     setSearch(value?.toString() || '');
-                }, rightSectionPointerEvents: value === null ? 'none' : 'all', pointer: true, children: itemData ? parseComboboxItem(itemData)?.label : jsxRuntimeExports.jsx(Input.Placeholder, { className: styles$k.placeholder, children: "Pick value" }) })) }));
+                }, rightSectionPointerEvents: value === null ? 'none' : 'all', pointer: true, children: itemData ? (jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [jsxRuntimeExports.jsx("span", { className: styles$k.icon, children: itemData.icon }), itemData.label] })) : (jsxRuntimeExports.jsx(Input.Placeholder, { className: styles$k.placeholder, children: "Pick value" })) })) }));
     }
     return (jsxRuntimeExports.jsxs("div", { className: cn(styles$k.wrapper, className), style: { width: fullWidth ? '100%' : undefined }, children: [label && jsxRuntimeExports.jsx("label", { className: styles$k.label, children: label }), description && jsxRuntimeExports.jsx("p", { className: styles$k.description, children: description }), error && jsxRuntimeExports.jsx("p", { className: styles$k.error, children: error }), jsxRuntimeExports.jsxs(Combobox, { store: combobox, withinPortal: false, onOptionSubmit: (val) => {
                     updateValue(val);