kitunga-web 0.1.95 → 0.1.96
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/features/feedback/components/Loading/AppLoading.d.ts.map +1 -1
- package/dist/features/feedback/components/Loading/AppLoading.js +2 -2
- package/dist/features/feedback/components/Loading/AppLoading.js.map +1 -1
- package/dist/features/inputs/components/Inputs/SearchInput.d.ts +3 -1
- package/dist/features/inputs/components/Inputs/SearchInput.d.ts.map +1 -1
- package/dist/features/inputs/components/Inputs/SearchInput.js +2 -2
- package/dist/features/inputs/components/Inputs/SearchInput.js.map +1 -1
- package/dist/features/selects/components/Selects/CustomSelect.d.ts +11 -3
- package/dist/features/selects/components/Selects/CustomSelect.d.ts.map +1 -1
- package/dist/features/selects/components/Selects/CustomSelect.js +13 -14
- package/dist/features/selects/components/Selects/CustomSelect.js.map +1 -1
- package/dist/features/selects/components/Selects/CustomSelect.module.css +46 -28
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AppLoading.d.ts","sourceRoot":"","sources":["../../../../../src/features/feedback/components/Loading/AppLoading.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGvC,KAAK,WAAW,GAAG,QAAQ,GAAG,MAAM,GAAG,YAAY,CAAC;AACpD,KAAK,WAAW,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAEtC,UAAU,eAAe;IACvB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,IAAI,CAAC,EAAE,WAAW,CAAC;IACnB,IAAI,CAAC,EAAE,WAAW,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,MAAM,CAAC,EAAE,SAAS,CAAC;CACpB;AAED,MAAM,CAAC,OAAO,UAAU,UAAU,CAAC,EACjC,
|
|
1
|
+
{"version":3,"file":"AppLoading.d.ts","sourceRoot":"","sources":["../../../../../src/features/feedback/components/Loading/AppLoading.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGvC,KAAK,WAAW,GAAG,QAAQ,GAAG,MAAM,GAAG,YAAY,CAAC;AACpD,KAAK,WAAW,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAEtC,UAAU,eAAe;IACvB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,IAAI,CAAC,EAAE,WAAW,CAAC;IACnB,IAAI,CAAC,EAAE,WAAW,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,MAAM,CAAC,EAAE,SAAS,CAAC;CACpB;AAED,MAAM,CAAC,OAAO,UAAU,UAAU,CAAC,EACjC,OAAO,EACP,QAAQ,EACR,IAAe,EACf,IAAW,EACX,SAAc,EACd,MAAM,GACP,EAAE,eAAe,2CA+BjB"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import styles from './AppLoading.module.css';
|
|
3
|
-
export default function AppLoading({ message
|
|
3
|
+
export default function AppLoading({ message, subtitle, mode = 'inline', size = 'md', className = '', footer, }) {
|
|
4
4
|
const containerClassName = [
|
|
5
5
|
styles.container,
|
|
6
6
|
styles[mode],
|
|
@@ -12,6 +12,6 @@ export default function AppLoading({ message = 'A carregar...', subtitle, mode =
|
|
|
12
12
|
styles.spinner,
|
|
13
13
|
styles[`spinner_${size}`],
|
|
14
14
|
].join(' ');
|
|
15
|
-
return (_jsx("div", { className: containerClassName, role: "status", "aria-live": "polite", children: _jsxs("div", { className: styles.content, children: [_jsx("span", { className: spinnerClassName, "aria-hidden": "true" }), _jsxs("div", { className: styles.textGroup, children: [_jsx("p", { className: styles.message, children: message }), subtitle ? _jsx("p", { className: styles.subtitle, children: subtitle }) : null] }), footer ? _jsx("div", { className: styles.footer, children: footer }) : null] }) }));
|
|
15
|
+
return (_jsx("div", { className: containerClassName, role: "status", "aria-live": "polite", children: _jsxs("div", { className: styles.content, children: [_jsx("span", { className: spinnerClassName, "aria-hidden": "true" }), (message || subtitle) && (_jsxs("div", { className: styles.textGroup, children: [message ? _jsx("p", { className: styles.message, children: message }) : null, subtitle ? _jsx("p", { className: styles.subtitle, children: subtitle }) : null] })), footer ? _jsx("div", { className: styles.footer, children: footer }) : null] }) }));
|
|
16
16
|
}
|
|
17
17
|
//# sourceMappingURL=AppLoading.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AppLoading.js","sourceRoot":"","sources":["../../../../../src/features/feedback/components/Loading/AppLoading.tsx"],"names":[],"mappings":";AACA,OAAO,MAAM,MAAM,yBAAyB,CAAC;AAc7C,MAAM,CAAC,OAAO,UAAU,UAAU,CAAC,EACjC,OAAO,
|
|
1
|
+
{"version":3,"file":"AppLoading.js","sourceRoot":"","sources":["../../../../../src/features/feedback/components/Loading/AppLoading.tsx"],"names":[],"mappings":";AACA,OAAO,MAAM,MAAM,yBAAyB,CAAC;AAc7C,MAAM,CAAC,OAAO,UAAU,UAAU,CAAC,EACjC,OAAO,EACP,QAAQ,EACR,IAAI,GAAG,QAAQ,EACf,IAAI,GAAG,IAAI,EACX,SAAS,GAAG,EAAE,EACd,MAAM,GACU;IAEhB,MAAM,kBAAkB,GAAG;QACzB,MAAM,CAAC,SAAS;QAChB,MAAM,CAAC,IAAI,CAAC;QACZ,SAAS;KACV;SACE,MAAM,CAAC,OAAO,CAAC;SACf,IAAI,CAAC,GAAG,CAAC,CAAC;IAEb,MAAM,gBAAgB,GAAG;QACvB,MAAM,CAAC,OAAO;QACd,MAAM,CAAC,WAAW,IAAI,EAAE,CAAC;KAC1B,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IAEZ,OAAO,CACL,cAAK,SAAS,EAAE,kBAAkB,EAAE,IAAI,EAAC,QAAQ,eAAW,QAAQ,YAClE,eAAK,SAAS,EAAE,MAAM,CAAC,OAAO,aAC5B,eAAM,SAAS,EAAE,gBAAgB,iBAAc,MAAM,GAAG,EAGvD,CAAC,OAAO,IAAI,QAAQ,CAAC,IAAI,CACxB,eAAK,SAAS,EAAE,MAAM,CAAC,SAAS,aAC7B,OAAO,CAAC,CAAC,CAAC,YAAG,SAAS,EAAE,MAAM,CAAC,OAAO,YAAG,OAAO,GAAK,CAAC,CAAC,CAAC,IAAI,EAC5D,QAAQ,CAAC,CAAC,CAAC,YAAG,SAAS,EAAE,MAAM,CAAC,QAAQ,YAAG,QAAQ,GAAK,CAAC,CAAC,CAAC,IAAI,IAC5D,CACP,EACA,MAAM,CAAC,CAAC,CAAC,cAAK,SAAS,EAAE,MAAM,CAAC,MAAM,YAAG,MAAM,GAAO,CAAC,CAAC,CAAC,IAAI,IAC1D,GACF,CACP,CAAC;AACJ,CAAC"}
|
|
@@ -4,10 +4,12 @@ export interface SearchInputProps {
|
|
|
4
4
|
onChange?: (value: string) => void;
|
|
5
5
|
onFocus?: () => void;
|
|
6
6
|
onBlur?: () => void;
|
|
7
|
+
onKeyDown?: (event: React.KeyboardEvent<HTMLInputElement>) => void;
|
|
8
|
+
autoFocus?: boolean;
|
|
7
9
|
disabled?: boolean;
|
|
8
10
|
className?: string;
|
|
9
11
|
size?: 'sm' | 'md' | 'lg';
|
|
10
12
|
showClearButton?: boolean;
|
|
11
13
|
}
|
|
12
|
-
export default function SearchInput({ placeholder, value, onChange, onFocus, onBlur, disabled, className, size, showClearButton, }: SearchInputProps): import("react/jsx-runtime").JSX.Element;
|
|
14
|
+
export default function SearchInput({ placeholder, value, onChange, onFocus, onBlur, onKeyDown, autoFocus, disabled, className, size, showClearButton, }: SearchInputProps): import("react/jsx-runtime").JSX.Element;
|
|
13
15
|
//# sourceMappingURL=SearchInput.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SearchInput.d.ts","sourceRoot":"","sources":["../../../../../src/features/inputs/components/Inputs/SearchInput.tsx"],"names":[],"mappings":"AAIA,MAAM,WAAW,gBAAgB;IAC/B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IAC1B,eAAe,CAAC,EAAE,OAAO,CAAC;CAC3B;AAED,MAAM,CAAC,OAAO,UAAU,WAAW,CAAC,EAClC,WAA4B,EAC5B,KAAU,EACV,QAAQ,EACR,OAAO,EACP,MAAM,EACN,QAAgB,EAChB,SAAc,EACd,IAAW,EACX,eAAsB,GACvB,EAAE,gBAAgB,
|
|
1
|
+
{"version":3,"file":"SearchInput.d.ts","sourceRoot":"","sources":["../../../../../src/features/inputs/components/Inputs/SearchInput.tsx"],"names":[],"mappings":"AAIA,MAAM,WAAW,gBAAgB;IAC/B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,SAAS,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,aAAa,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IACnE,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IAC1B,eAAe,CAAC,EAAE,OAAO,CAAC;CAC3B;AAED,MAAM,CAAC,OAAO,UAAU,WAAW,CAAC,EAClC,WAA4B,EAC5B,KAAU,EACV,QAAQ,EACR,OAAO,EACP,MAAM,EACN,SAAS,EACT,SAAiB,EACjB,QAAgB,EAChB,SAAc,EACd,IAAW,EACX,eAAsB,GACvB,EAAE,gBAAgB,2CAkClB"}
|
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { Search, X } from 'lucide-react';
|
|
3
3
|
import styles from './SearchInput.module.css';
|
|
4
|
-
export default function SearchInput({ placeholder = "Pesquisar...", value = '', onChange, onFocus, onBlur, disabled = false, className = '', size = 'md', showClearButton = true, }) {
|
|
4
|
+
export default function SearchInput({ placeholder = "Pesquisar...", value = '', onChange, onFocus, onBlur, onKeyDown, autoFocus = false, disabled = false, className = '', size = 'md', showClearButton = true, }) {
|
|
5
5
|
const containerClasses = [
|
|
6
6
|
styles.searchContainer,
|
|
7
7
|
styles[size],
|
|
8
8
|
className
|
|
9
9
|
].filter(Boolean).join(' ');
|
|
10
|
-
return (_jsxs("div", { className: containerClasses, children: [_jsx(Search, { size: 18, className: styles.searchIcon }), _jsx("input", { type: "text", placeholder: placeholder, value: value, onChange: (e) => onChange === null || onChange === void 0 ? void 0 : onChange(e.target.value), onFocus: onFocus, onBlur: onBlur, disabled: disabled, className: styles.searchInput }), showClearButton && value && (_jsx("button", { className: styles.clearButton, onClick: () => onChange === null || onChange === void 0 ? void 0 : onChange(''), title: "Limpar busca", tabIndex: -1, children: _jsx(X, { size: 16 }) }))] }));
|
|
10
|
+
return (_jsxs("div", { className: containerClasses, children: [_jsx(Search, { size: 18, className: styles.searchIcon }), _jsx("input", { type: "text", placeholder: placeholder, value: value, onChange: (e) => onChange === null || onChange === void 0 ? void 0 : onChange(e.target.value), onFocus: onFocus, onBlur: onBlur, onKeyDown: onKeyDown, autoFocus: autoFocus, disabled: disabled, className: styles.searchInput }), showClearButton && value && (_jsx("button", { className: styles.clearButton, onClick: () => onChange === null || onChange === void 0 ? void 0 : onChange(''), title: "Limpar busca", tabIndex: -1, children: _jsx(X, { size: 16 }) }))] }));
|
|
11
11
|
}
|
|
12
12
|
//# sourceMappingURL=SearchInput.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SearchInput.js","sourceRoot":"","sources":["../../../../../src/features/inputs/components/Inputs/SearchInput.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,MAAM,EAAE,CAAC,EAAE,MAAM,cAAc,CAAC;AACzC,OAAO,MAAM,MAAM,0BAA0B,CAAC;
|
|
1
|
+
{"version":3,"file":"SearchInput.js","sourceRoot":"","sources":["../../../../../src/features/inputs/components/Inputs/SearchInput.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,MAAM,EAAE,CAAC,EAAE,MAAM,cAAc,CAAC;AACzC,OAAO,MAAM,MAAM,0BAA0B,CAAC;AAgB9C,MAAM,CAAC,OAAO,UAAU,WAAW,CAAC,EAClC,WAAW,GAAG,cAAc,EAC5B,KAAK,GAAG,EAAE,EACV,QAAQ,EACR,OAAO,EACP,MAAM,EACN,SAAS,EACT,SAAS,GAAG,KAAK,EACjB,QAAQ,GAAG,KAAK,EAChB,SAAS,GAAG,EAAE,EACd,IAAI,GAAG,IAAI,EACX,eAAe,GAAG,IAAI,GACL;IACjB,MAAM,gBAAgB,GAAG;QACvB,MAAM,CAAC,eAAe;QACtB,MAAM,CAAC,IAAI,CAAC;QACZ,SAAS;KACV,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IAE5B,OAAO,CACL,eAAK,SAAS,EAAE,gBAAgB,aAC9B,KAAC,MAAM,IAAC,IAAI,EAAE,EAAE,EAAE,SAAS,EAAE,MAAM,CAAC,UAAU,GAAI,EAClD,gBACE,IAAI,EAAC,MAAM,EACX,WAAW,EAAE,WAAW,EACxB,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAG,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,EAC3C,OAAO,EAAE,OAAO,EAChB,MAAM,EAAE,MAAM,EACd,SAAS,EAAE,SAAS,EACpB,SAAS,EAAE,SAAS,EACpB,QAAQ,EAAE,QAAQ,EAClB,SAAS,EAAE,MAAM,CAAC,WAAW,GAC7B,EACD,eAAe,IAAI,KAAK,IAAI,CAC3B,iBACE,SAAS,EAAE,MAAM,CAAC,WAAW,EAC7B,OAAO,EAAE,GAAG,EAAE,CAAC,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAG,EAAE,CAAC,EAC7B,KAAK,EAAC,cAAc,EACpB,QAAQ,EAAE,CAAC,CAAC,YAEZ,KAAC,CAAC,IAAC,IAAI,EAAE,EAAE,GAAI,GACR,CACV,IACG,CACP,CAAC;AACJ,CAAC"}
|
|
@@ -27,13 +27,21 @@ export interface CustomSelectProps {
|
|
|
27
27
|
collapsible?: boolean;
|
|
28
28
|
dropdownMinWidth?: number;
|
|
29
29
|
dropdownAlign?: 'left' | 'right';
|
|
30
|
-
/**
|
|
30
|
+
/** SearchInput fixo no topo do dropdown — para listas longas
|
|
31
31
|
* (ex.: países). Filtro accent-insensitive por label, selectedLabel
|
|
32
32
|
* e value (o "244" encontra "Angola (+244)"). */
|
|
33
33
|
searchable?: boolean;
|
|
34
34
|
searchPlaceholder?: string;
|
|
35
|
-
|
|
36
|
-
|
|
35
|
+
/** Tamanho do SearchInput no dropdown (default 'md'). */
|
|
36
|
+
searchSize?: 'sm' | 'md' | 'lg';
|
|
37
|
+
/** O empty quando o filtro não encontra nada — o mesmo
|
|
38
|
+
* SearchEmptyState das tabelas; actionLabel mostra o botão que
|
|
39
|
+
* limpa a pesquisa. */
|
|
40
|
+
searchEmptyProps?: {
|
|
41
|
+
title?: string;
|
|
42
|
+
description?: string;
|
|
43
|
+
actionLabel?: string;
|
|
44
|
+
};
|
|
37
45
|
}
|
|
38
46
|
declare const CustomSelect: React.FC<CustomSelectProps>;
|
|
39
47
|
export default CustomSelect;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CustomSelect.d.ts","sourceRoot":"","sources":["../../../../../src/features/selects/components/Selects/CustomSelect.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAsC,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"CustomSelect.d.ts","sourceRoot":"","sources":["../../../../../src/features/selects/components/Selects/CustomSelect.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAsC,MAAM,OAAO,CAAC;AAM3D,MAAM,WAAW,MAAM;IACrB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;0DAEsD;IACtD,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CACxB;AAED,MAAM,WAAW,iBAAiB;IAChC,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,OAAO,EAAE,MAAM,EAAE,CAAC;IAClB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,SAAS,GAAG,MAAM,CAAC;IAC7B,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IAC1B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,aAAa,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IACjC;;sDAEkD;IAClD,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,yDAAyD;IACzD,UAAU,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IAChC;;4BAEwB;IACxB,gBAAgB,CAAC,EAAE;QACjB,KAAK,CAAC,EAAE,MAAM,CAAC;QACf,WAAW,CAAC,EAAE,MAAM,CAAC;QACrB,WAAW,CAAC,EAAE,MAAM,CAAC;KACtB,CAAC;CACH;AAED,QAAA,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAkM7C,CAAC;AAEF,eAAe,YAAY,CAAC"}
|
|
@@ -1,14 +1,15 @@
|
|
|
1
1
|
'use client';
|
|
2
2
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
3
|
import { useState, useRef, useEffect } from 'react';
|
|
4
|
-
import { ChevronDown, Check
|
|
4
|
+
import { ChevronDown, Check } from 'lucide-react';
|
|
5
|
+
import SearchInput from '../../../inputs/components/Inputs/SearchInput';
|
|
6
|
+
import SearchEmptyState from '../../../feedback/components/EmptyStates/SearchEmptyState/SearchEmptyState';
|
|
5
7
|
import styles from './CustomSelect.module.css';
|
|
6
|
-
const CustomSelect = ({ id, name, value, onChange, options, placeholder = 'Selecione uma opção', required = false, className = '', disabled = false, leftIcon, hasError = false, variant = 'default', size = 'md', valueBold = false, collapsible = false, dropdownMinWidth, dropdownAlign = 'right', searchable = false, searchPlaceholder,
|
|
8
|
+
const CustomSelect = ({ id, name, value, onChange, options, placeholder = 'Selecione uma opção', required = false, className = '', disabled = false, leftIcon, hasError = false, variant = 'default', size = 'md', valueBold = false, collapsible = false, dropdownMinWidth, dropdownAlign = 'right', searchable = false, searchPlaceholder, searchSize = 'md', searchEmptyProps, }) => {
|
|
7
9
|
var _a, _b;
|
|
8
10
|
const [isOpen, setIsOpen] = useState(false);
|
|
9
11
|
const [search, setSearch] = useState('');
|
|
10
12
|
const selectRef = useRef(null);
|
|
11
|
-
const searchInputRef = useRef(null);
|
|
12
13
|
const selectedOption = value && value.trim() !== ''
|
|
13
14
|
? options.find(option => option.value === value) || null
|
|
14
15
|
: null;
|
|
@@ -22,14 +23,12 @@ const CustomSelect = ({ id, name, value, onChange, options, placeholder = 'Selec
|
|
|
22
23
|
normalize(option.value).includes(query) ||
|
|
23
24
|
(option.selectedLabel ? normalize(option.selectedLabel).includes(query) : false))
|
|
24
25
|
: options;
|
|
25
|
-
// Ao
|
|
26
|
+
// Ao fechar, a pesquisa morre — o próximo open recomeça limpo
|
|
27
|
+
// (o autofocus vem do próprio SearchInput ao montar).
|
|
26
28
|
useEffect(() => {
|
|
27
|
-
var _a;
|
|
28
|
-
if (isOpen && searchable)
|
|
29
|
-
(_a = searchInputRef.current) === null || _a === void 0 ? void 0 : _a.focus();
|
|
30
29
|
if (!isOpen)
|
|
31
30
|
setSearch('');
|
|
32
|
-
}, [isOpen
|
|
31
|
+
}, [isOpen]);
|
|
33
32
|
const toggleDropdown = () => {
|
|
34
33
|
if (disabled)
|
|
35
34
|
return;
|
|
@@ -53,24 +52,24 @@ const CustomSelect = ({ id, name, value, onChange, options, placeholder = 'Selec
|
|
|
53
52
|
document.removeEventListener('mousedown', handleClickOutside);
|
|
54
53
|
};
|
|
55
54
|
}, []);
|
|
56
|
-
return (_jsxs("div", { className: `${styles.customSelect} ${styles[size]} ${variant === 'flat' ? styles.flat : ''} ${className} ${isOpen ? styles.open : ''} ${hasError ? styles.error : ''} ${collapsible ? styles.collapsible : ''}`, ref: selectRef, children: [name && (_jsx("input", { type: "hidden", id: id, name: name, value: value || '', required: required })), _jsxs("div", { className: `${styles.selectedValue} ${disabled ? styles.disabled : ''} ${
|
|
55
|
+
return (_jsxs("div", { className: `${styles.customSelect} ${styles[size]} ${variant === 'flat' ? styles.flat : ''} ${className} ${isOpen ? styles.open : ''} ${hasError ? styles.error : ''} ${collapsible ? styles.collapsible : ''}`, ref: selectRef, children: [name && (_jsx("input", { type: "hidden", id: id, name: name, value: value || '', required: required })), _jsxs("div", { className: `${styles.selectedValue} ${disabled ? styles.disabled : ''} ${leftIcon && !(selectedOption === null || selectedOption === void 0 ? void 0 : selectedOption.icon) ? styles.hasLeftIcon : ''}`, onClick: toggleDropdown, role: "button", tabIndex: disabled ? -1 : 0, onKeyDown: (e) => {
|
|
57
56
|
if (disabled)
|
|
58
57
|
return;
|
|
59
58
|
if (e.key === 'Enter' || e.key === ' ') {
|
|
60
59
|
e.preventDefault();
|
|
61
60
|
toggleDropdown();
|
|
62
61
|
}
|
|
63
|
-
}, children: [displayIcon &&
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
62
|
+
}, children: [(selectedOption === null || selectedOption === void 0 ? void 0 : selectedOption.icon) ? (_jsx("span", { className: styles.triggerIconFrame, children: displayIcon })) : (displayIcon && _jsx("span", { className: styles.leftIcon, children: displayIcon })), _jsx("span", { className: `${styles.valueText} ${!value ? styles.placeholder : ''} ${valueBold ? styles.valueBold : ''}`.trim(), children: selectedOption ? (_b = selectedOption.selectedLabel) !== null && _b !== void 0 ? _b : selectedOption.label : placeholder }), _jsx(ChevronDown, { size: 16, className: `${styles.arrow} ${isOpen ? styles.rotate : ''}` })] }), isOpen && (_jsx("div", { className: `${styles.dropdown} ${dropdownAlign === 'left' ? styles.dropdownLeft : styles.dropdownRight}`, style: dropdownMinWidth ? { minWidth: `${dropdownMinWidth}px` } : undefined, children: _jsxs("div", { className: styles.dropdownPanel, children: [searchable && (_jsx("div", { className: styles.searchRow, onClick: (e) => e.stopPropagation(), children: _jsx(SearchInput, { value: search, onChange: setSearch, placeholder: searchPlaceholder !== null && searchPlaceholder !== void 0 ? searchPlaceholder : 'Pesquisar...', size: searchSize, onKeyDown: (e) => {
|
|
63
|
+
if (e.key === 'Enter')
|
|
64
|
+
e.preventDefault();
|
|
65
|
+
} }) })), _jsxs("div", { className: styles.dropdownList, role: "listbox", children: [visibleOptions.map((option) => (_jsxs("div", { className: `${styles.option} ${value === option.value ? styles.selected : ''} ${option.disabled ? styles.disabledOption : ''}`, onClick: () => handleSelect(option), onKeyDown: (e) => {
|
|
67
66
|
if (option.disabled)
|
|
68
67
|
return;
|
|
69
68
|
if (e.key === 'Enter' || e.key === ' ') {
|
|
70
69
|
e.preventDefault();
|
|
71
70
|
handleSelect(option);
|
|
72
71
|
}
|
|
73
|
-
}, role: "option", "aria-selected": value === option.value, "aria-disabled": option.disabled ? true : undefined, tabIndex: option.disabled ? -1 : 0, children: [_jsxs("span", { className: styles.optionText, children: [option.icon && (_jsx("span", { className: styles.optionIcon, children: option.icon })), _jsx("span", { children: option.label })] }), value === option.value && (_jsx(Check, { size: 14, className: styles.checkIcon }))] }, option.value))), visibleOptions.length === 0 && (_jsx(
|
|
72
|
+
}, role: "option", "aria-selected": value === option.value, "aria-disabled": option.disabled ? true : undefined, tabIndex: option.disabled ? -1 : 0, children: [_jsxs("span", { className: styles.optionText, children: [option.icon && (_jsx("span", { className: styles.optionIcon, children: option.icon })), _jsx("span", { children: option.label })] }), value === option.value && (_jsx(Check, { size: 14, className: styles.checkIcon }))] }, option.value))), visibleOptions.length === 0 && (_jsx(SearchEmptyState, { title: searchEmptyProps === null || searchEmptyProps === void 0 ? void 0 : searchEmptyProps.title, description: searchEmptyProps === null || searchEmptyProps === void 0 ? void 0 : searchEmptyProps.description, actionLabel: searchEmptyProps === null || searchEmptyProps === void 0 ? void 0 : searchEmptyProps.actionLabel, onAction: () => setSearch('') }))] })] }) }))] }));
|
|
74
73
|
};
|
|
75
74
|
export default CustomSelect;
|
|
76
75
|
//# sourceMappingURL=CustomSelect.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CustomSelect.js","sourceRoot":"","sources":["../../../../../src/features/selects/components/Selects/CustomSelect.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAc,EAAE,QAAQ,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAC3D,OAAO,EAAE,WAAW,EAAE,KAAK,EAAE,MAAM,
|
|
1
|
+
{"version":3,"file":"CustomSelect.js","sourceRoot":"","sources":["../../../../../src/features/selects/components/Selects/CustomSelect.tsx"],"names":[],"mappings":"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"}
|
|
@@ -190,49 +190,67 @@
|
|
|
190
190
|
overflow-y: auto;
|
|
191
191
|
}
|
|
192
192
|
|
|
193
|
+
/* O filtro é o SearchInput da casa — a row só lhe dá respiro
|
|
194
|
+
uniforme (spacing-sm-large em todos os lados) + o divider com a
|
|
195
|
+
lista. */
|
|
193
196
|
.searchRow {
|
|
194
|
-
|
|
195
|
-
align-items: center;
|
|
196
|
-
height: 40px;
|
|
197
|
-
padding: 0 var(--spacing-md);
|
|
197
|
+
padding: var(--spacing-sm-large);
|
|
198
198
|
border-bottom: 1px solid var(--border-divider);
|
|
199
199
|
}
|
|
200
200
|
|
|
201
|
-
.
|
|
201
|
+
.optionText {
|
|
202
202
|
display: inline-flex;
|
|
203
203
|
align-items: center;
|
|
204
|
-
|
|
205
|
-
flex-shrink: 0;
|
|
206
|
-
margin-right: var(--spacing-xs);
|
|
204
|
+
min-width: 0;
|
|
207
205
|
}
|
|
208
206
|
|
|
209
|
-
|
|
210
|
-
|
|
211
|
-
|
|
212
|
-
|
|
213
|
-
|
|
214
|
-
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
|
|
207
|
+
/* Moldura circular para ícones de opção (bandeiras, avatares, imagens)
|
|
208
|
+
— 24px cover: img/svg filhos enchem e o círculo corta. Emoji/texto
|
|
209
|
+
herda um font-size próprio (o .option span da casa encolhia-o).
|
|
210
|
+
O trigger usa a mesma moldura, como flex child com gap md. */
|
|
211
|
+
.optionIcon,
|
|
212
|
+
.triggerIconFrame {
|
|
213
|
+
display: inline-flex;
|
|
214
|
+
align-items: center;
|
|
215
|
+
justify-content: center;
|
|
216
|
+
width: 24px;
|
|
217
|
+
height: 24px;
|
|
218
|
+
border-radius: 50%;
|
|
219
|
+
overflow: hidden;
|
|
220
|
+
flex-shrink: 0;
|
|
218
221
|
}
|
|
219
222
|
|
|
220
|
-
.
|
|
221
|
-
|
|
223
|
+
.optionText .optionIcon,
|
|
224
|
+
.triggerIconFrame {
|
|
225
|
+
font-size: 1.125rem;
|
|
222
226
|
}
|
|
223
227
|
|
|
224
|
-
.
|
|
225
|
-
|
|
226
|
-
|
|
227
|
-
|
|
228
|
+
.optionIcon > img,
|
|
229
|
+
.optionIcon > svg,
|
|
230
|
+
.triggerIconFrame > img,
|
|
231
|
+
.triggerIconFrame > svg {
|
|
232
|
+
width: 100%;
|
|
233
|
+
height: 100%;
|
|
234
|
+
object-fit: cover;
|
|
235
|
+
display: block;
|
|
228
236
|
}
|
|
229
237
|
|
|
230
238
|
.optionIcon {
|
|
231
|
-
|
|
232
|
-
|
|
233
|
-
|
|
234
|
-
|
|
235
|
-
|
|
239
|
+
margin-right: var(--spacing-md);
|
|
240
|
+
}
|
|
241
|
+
|
|
242
|
+
.triggerIconFrame {
|
|
243
|
+
margin-right: var(--spacing-md);
|
|
244
|
+
}
|
|
245
|
+
|
|
246
|
+
/* sm: a moldura encolhe com a régua (35px de row). */
|
|
247
|
+
.customSelect.sm .optionIcon {
|
|
248
|
+
width: 20px;
|
|
249
|
+
height: 20px;
|
|
250
|
+
}
|
|
251
|
+
|
|
252
|
+
.customSelect.sm .optionText .optionIcon {
|
|
253
|
+
font-size: 0.9rem;
|
|
236
254
|
}
|
|
237
255
|
|
|
238
256
|
.noResults {
|