@motor-hero/ui-kit 0.50.0 → 0.51.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/components/combobox.d.ts +7 -0
- package/dist/components/combobox.d.ts.map +1 -1
- package/dist/components/multi-combobox.d.ts +1 -1
- package/dist/components/multi-combobox.d.ts.map +1 -1
- package/dist/index.cjs +25 -3
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +25 -3
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
- package/src/components/combobox.tsx +22 -1
- package/src/components/multi-combobox.tsx +14 -3
|
@@ -6,6 +6,10 @@ export interface ComboboxOption {
|
|
|
6
6
|
/** Optional leading decoration rendered before the label (icon, colored
|
|
7
7
|
* dot) — purely visual, doesn't affect filtering/matching. */
|
|
8
8
|
icon?: React.ReactNode;
|
|
9
|
+
/** Linha secundária abaixo do rótulo na lista (ex.: e-mail de uma pessoa,
|
|
10
|
+
* para separar homônimos). No gatilho vira o `title`. Entra na busca do
|
|
11
|
+
* modo cliente. */
|
|
12
|
+
description?: string;
|
|
9
13
|
}
|
|
10
14
|
export interface ComboboxProps {
|
|
11
15
|
options: ComboboxOption[];
|
|
@@ -59,4 +63,7 @@ export interface ComboboxProps {
|
|
|
59
63
|
* estado de erro) e fica com a borda vermelha quando inválido.
|
|
60
64
|
*/
|
|
61
65
|
export declare function Combobox({ options, value, onChange, placeholder, searchPlaceholder, emptyMessage, disabled, id, className, "aria-invalid": ariaInvalid, "aria-describedby": ariaDescribedby, onSearchChange, onLoadMore, loading, hasMore, selectedOption, creatable, formatCreateLabel, deselectable, }: ComboboxProps): React.JSX.Element;
|
|
66
|
+
export declare function OptionText({ option }: {
|
|
67
|
+
option: ComboboxOption;
|
|
68
|
+
}): React.JSX.Element;
|
|
62
69
|
//# sourceMappingURL=combobox.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"combobox.d.ts","sourceRoot":"","sources":["../../src/components/combobox.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAM/B,MAAM,WAAW,cAAc;IAC9B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;kEAC8D;IAC9D,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;
|
|
1
|
+
{"version":3,"file":"combobox.d.ts","sourceRoot":"","sources":["../../src/components/combobox.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAM/B,MAAM,WAAW,cAAc;IAC9B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;kEAC8D;IAC9D,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB;;uBAEmB;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;CACrB;AAED,MAAM,WAAW,aAAa;IAC7B,OAAO,EAAE,cAAc,EAAE,CAAC;IAC1B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,oDAAoD;IACpD,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,oCAAoC;IACpC,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,+CAA+C;IAC/C,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,cAAc,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,OAAO,CAAC;IAC5C,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B;qEACiE;IACjE,cAAc,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1C,0DAA0D;IAC1D,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;IACxB,uEAAuE;IACvE,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,yDAAyD;IACzD,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;wDACoD;IACpD,cAAc,CAAC,EAAE,cAAc,CAAC;IAChC;;yDAEqD;IACrD,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,4DAA4D;IAC5D,iBAAiB,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,MAAM,CAAC;IAC/C;mFAC+E;IAC/E,YAAY,CAAC,EAAE,OAAO,CAAC;CACvB;AAED;;;;;;;;;;;;;GAaG;AACH,wBAAgB,QAAQ,CAAC,EACxB,OAAO,EACP,KAAK,EACL,QAAQ,EACR,WAA4B,EAC5B,iBAA+B,EAC/B,YAA6C,EAC7C,QAAQ,EACR,EAAE,EACF,SAAS,EACT,cAAc,EAAE,WAAW,EAC3B,kBAAkB,EAAE,eAAe,EACnC,cAAc,EACd,UAAU,EACV,OAAO,EACP,OAAO,EACP,cAAc,EACd,SAAS,EACT,iBAAiB,EACjB,YAAY,GACZ,EAAE,aAAa,qBA0Lf;AAED,wBAAgB,UAAU,CAAC,EAAE,MAAM,EAAE,EAAE;IAAE,MAAM,EAAE,cAAc,CAAA;CAAE,qBAchE"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"multi-combobox.d.ts","sourceRoot":"","sources":["../../src/components/multi-combobox.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAK9B,OAAO,KAAK,
|
|
1
|
+
{"version":3,"file":"multi-combobox.d.ts","sourceRoot":"","sources":["../../src/components/multi-combobox.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAK9B,OAAO,EAAE,KAAK,cAAc,EAAc,MAAM,YAAY,CAAA;AAE5D,MAAM,WAAW,kBAAkB;IACjC,OAAO,EAAE,cAAc,EAAE,CAAA;IACzB,KAAK,EAAE,MAAM,EAAE,CAAA;IACf,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,IAAI,CAAA;IACnC,oDAAoD;IACpD,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,oCAAoC;IACpC,iBAAiB,CAAC,EAAE,MAAM,CAAA;IAC1B,+CAA+C;IAC/C,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,cAAc,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,OAAO,CAAA;IAC3C,kBAAkB,CAAC,EAAE,MAAM,CAAA;IAC3B;qEACiE;IACjE,cAAc,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAA;IACzC,0DAA0D;IAC1D,UAAU,CAAC,EAAE,MAAM,IAAI,CAAA;IACvB,uEAAuE;IACvE,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,yDAAyD;IACzD,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB;+DAC2D;IAC3D,eAAe,CAAC,EAAE,cAAc,EAAE,CAAA;CACnC;AAED;;;;;;;;;;;;;;GAcG;AACH,wBAAgB,aAAa,CAAC,EAC5B,OAAO,EACP,KAAK,EACL,QAAQ,EACR,WAA4B,EAC5B,iBAA+B,EAC/B,YAA6C,EAC7C,QAAQ,EACR,EAAE,EACF,SAAS,EACT,cAAc,EAAE,WAAW,EAC3B,kBAAkB,EAAE,eAAe,EACnC,cAAc,EACd,UAAU,EACV,OAAO,EACP,OAAO,EACP,eAAe,GAChB,EAAE,kBAAkB,qBA4MpB"}
|
package/dist/index.cjs
CHANGED
|
@@ -926,6 +926,7 @@ function Combobox({
|
|
|
926
926
|
import_cmdk.Command.Item,
|
|
927
927
|
{
|
|
928
928
|
value: isServer ? option.value : option.label,
|
|
929
|
+
keywords: option.description ? [option.description] : void 0,
|
|
929
930
|
disabled: option.disabled,
|
|
930
931
|
onSelect: () => handleSelect(option.value),
|
|
931
932
|
className: "relative flex cursor-pointer select-none items-center gap-2 rounded-sm px-2 py-2.5 text-sm outline-none data-[selected=true]:bg-accent data-[selected=true]:text-accent-foreground data-[disabled=true]:pointer-events-none data-[disabled=true]:opacity-50 sm:py-1.5",
|
|
@@ -940,7 +941,7 @@ function Combobox({
|
|
|
940
941
|
}
|
|
941
942
|
),
|
|
942
943
|
option.icon,
|
|
943
|
-
/* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
|
|
944
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsx)(OptionText, { option })
|
|
944
945
|
]
|
|
945
946
|
},
|
|
946
947
|
option.value
|
|
@@ -981,6 +982,21 @@ function Combobox({
|
|
|
981
982
|
] })
|
|
982
983
|
] });
|
|
983
984
|
}
|
|
985
|
+
function OptionText({ option }) {
|
|
986
|
+
if (!option.description)
|
|
987
|
+
return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { className: "truncate", children: option.label });
|
|
988
|
+
return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("span", { className: "flex min-w-0 flex-col", children: [
|
|
989
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { className: "truncate", children: option.label }),
|
|
990
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
|
|
991
|
+
"span",
|
|
992
|
+
{
|
|
993
|
+
title: option.description,
|
|
994
|
+
className: "truncate text-xs text-muted-foreground",
|
|
995
|
+
children: option.description
|
|
996
|
+
}
|
|
997
|
+
)
|
|
998
|
+
] });
|
|
999
|
+
}
|
|
984
1000
|
|
|
985
1001
|
// src/components/confirm-dialog.tsx
|
|
986
1002
|
var AlertDialog = __toESM(require("@radix-ui/react-alert-dialog"), 1);
|
|
@@ -1898,6 +1914,10 @@ function MultiCombobox({
|
|
|
1898
1914
|
for (const [key, option] of byValue) labelCache.current.set(key, option);
|
|
1899
1915
|
});
|
|
1900
1916
|
const selected = value.map((v) => byValue.get(v) ?? labelCache.current.get(v)).filter((option) => option !== void 0);
|
|
1917
|
+
const labelCounts = /* @__PURE__ */ new Map();
|
|
1918
|
+
for (const option of selected)
|
|
1919
|
+
labelCounts.set(option.label, (labelCounts.get(option.label) ?? 0) + 1);
|
|
1920
|
+
const chipLabel = (option) => option.description && (labelCounts.get(option.label) ?? 0) > 1 ? `${option.label} \xB7 ${option.description}` : option.label;
|
|
1901
1921
|
const { listRef, sentinelRef } = useInfiniteScrollSentinel({
|
|
1902
1922
|
enabled: isServer && !!hasMore,
|
|
1903
1923
|
loading,
|
|
@@ -1936,9 +1956,10 @@ function MultiCombobox({
|
|
|
1936
1956
|
selected.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "text-muted-foreground", children: placeholder }) : selected.map((option) => /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
|
|
1937
1957
|
"span",
|
|
1938
1958
|
{
|
|
1959
|
+
title: option.description,
|
|
1939
1960
|
className: "inline-flex items-center gap-1 rounded bg-secondary px-1.5 py-0.5 text-xs text-secondary-foreground",
|
|
1940
1961
|
children: [
|
|
1941
|
-
option
|
|
1962
|
+
chipLabel(option),
|
|
1942
1963
|
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
|
1943
1964
|
"button",
|
|
1944
1965
|
{
|
|
@@ -1990,6 +2011,7 @@ function MultiCombobox({
|
|
|
1990
2011
|
import_cmdk2.Command.Item,
|
|
1991
2012
|
{
|
|
1992
2013
|
value: isServer ? option.value : option.label,
|
|
2014
|
+
keywords: option.description ? [option.description] : void 0,
|
|
1993
2015
|
disabled: option.disabled,
|
|
1994
2016
|
onSelect: () => toggleValue(option.value),
|
|
1995
2017
|
className: "relative flex cursor-pointer select-none items-center gap-2 rounded-sm px-2 py-2.5 text-sm outline-none data-[selected=true]:bg-accent data-[selected=true]:text-accent-foreground data-[disabled=true]:pointer-events-none data-[disabled=true]:opacity-50 sm:py-1.5",
|
|
@@ -2003,7 +2025,7 @@ function MultiCombobox({
|
|
|
2003
2025
|
)
|
|
2004
2026
|
}
|
|
2005
2027
|
),
|
|
2006
|
-
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
|
2028
|
+
/* @__PURE__ */ (0, import_jsx_runtime21.jsx)(OptionText, { option })
|
|
2007
2029
|
]
|
|
2008
2030
|
},
|
|
2009
2031
|
option.value
|