@seedgrid/fe-components 2026.9.2 → 2026.9.3

package/dist/ai/seedgrid-components.manifest.json

@@ -1796,9 +1796,9 @@
           },
           {
             "name": "options",
-            "type": "{ label: string; value: string | number; disabled?: boolean }[]",
+            "type": "{ label: string; value: string | number; chipLabel?: string; disabled?: boolean }[]",
             "required": true,
-            "description": "Lista de opcoes disponiveis.",
+            "description": "Lista de opcoes disponiveis. `label` aparece na lista; `chipLabel` (opcional) e' o texto curto do item ja' selecionado (o resumo do campo), ex.: label \"3 - Filial Centro\" e chipLabel \"3\".",
             "semanticRole": "data",
             "bindable": false
           },
@@ -2132,9 +2132,9 @@
           },
           {
             "name": "options",
-            "type": "{ label: string; value: string | number; disabled?: boolean }[]",
+            "type": "{ label: string; value: string | number; chipLabel?: string; disabled?: boolean }[]",
             "required": true,
-            "description": "Lista de opcoes disponiveis.",
+            "description": "Lista de opcoes disponiveis. `label` aparece na lista; `chipLabel` (opcional) e' o texto curto do item ja' selecionado (o chip), ex.: label \"3 - Filial Centro\" e chipLabel \"3\".",
             "semanticRole": "data",
             "bindable": false
           },

package/dist/inputs/SgMultiSelect.meta.js

@@ -14,7 +14,7 @@ export const sgMeta = {
     props: [
         { name: "id", type: "string", required: true, description: "Identificador unico do campo.", semanticRole: "data", bindable: false },
         { name: "label", type: "string", description: "Rotulo exibido ao usuario.", semanticRole: "label", bindable: true },
-        { name: "options", type: "{ label: string; value: string | number; disabled?: boolean }[]", description: "Lista de opcoes disponiveis.", semanticRole: "data", bindable: false },
+        { name: "options", type: "{ label: string; value: string | number; chipLabel?: string; disabled?: boolean }[]", description: "Lista de opcoes disponiveis. `label` aparece na lista; `chipLabel` (opcional) e' o texto curto do item ja' selecionado (o resumo do campo), ex.: label \"3 - Filial Centro\" e chipLabel \"3\".", semanticRole: "data", bindable: false },
         { name: "value", type: "(string | number)[]", description: "Array de valores selecionados.", semanticRole: "value", bindable: true },
         { name: "onChange", type: "(value: (string | number)[]) => void", description: "Callback com o array atualizado de valores.", semanticRole: "event", bindable: false },
         { name: "searchable", type: "boolean", default: false, description: "Exibe campo de busca no topo do dropdown.", semanticRole: "behavior", bindable: true },

package/dist/inputs/SgMultiSelectChips.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SgMultiSelectChips.d.ts","sourceRoot":"","sources":["../../src/inputs/SgMultiSelectChips.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAqB,KAAK,aAAa,EAAE,MAAM,QAAQ,CAAC;AAI/D,OAAO,KAAK,EAAE,mBAAmB,EAAE,wBAAwB,EAAE,MAAM,oBAAoB,CAAC;AAExF,YAAY,EAAE,mBAAmB,EAAE,wBAAwB,EAAE,MAAM,oBAAoB,CAAC;AAExF,MAAM,MAAM,uBAAuB,GAAG,aAAa,GAAG;IACpD,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB,YAAY,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC/B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,EAAE,mBAAmB,EAAE,CAAC;IAC/B,KAAK,CAAC,EAAE,wBAAwB,EAAE,CAAC;IACnC,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,wBAAwB,EAAE,KAAK,IAAI,CAAC;IACvD,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;CACrB,CAAC;AAwPF,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,QAAQ,CAAC,uBAAuB,CAAC,2CAsB1E"}
+{"version":3,"file":"SgMultiSelectChips.d.ts","sourceRoot":"","sources":["../../src/inputs/SgMultiSelectChips.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAqB,KAAK,aAAa,EAAE,MAAM,QAAQ,CAAC;AAI/D,OAAO,KAAK,EAAE,mBAAmB,EAAE,wBAAwB,EAAE,MAAM,oBAAoB,CAAC;AAExF,YAAY,EAAE,mBAAmB,EAAE,wBAAwB,EAAE,MAAM,oBAAoB,CAAC;AAExF,MAAM,MAAM,uBAAuB,GAAG,aAAa,GAAG;IACpD,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB,YAAY,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC/B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,EAAE,mBAAmB,EAAE,CAAC;IAC/B,KAAK,CAAC,EAAE,wBAAwB,EAAE,CAAC;IACnC,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,wBAAwB,EAAE,KAAK,IAAI,CAAC;IACvD,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;CACrB,CAAC;AA8PF,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,QAAQ,CAAC,uBAAuB,CAAC,2CAsB1E"}

package/dist/inputs/SgMultiSelectChips.js

@@ -100,7 +100,7 @@ function SgMultiSelectChipsBase(props) {
                                     ms.handleListKeyDown(event);
                                 }
                             }
-                        }, children: [_jsx("div", { className: "flex min-w-0 flex-1 flex-wrap items-center gap-1.5", children: ms.selectedOptions.length === 0 ? (_jsx("span", { className: "px-1 text-[var(--sg-input-placeholder,hsl(var(--muted-foreground)))]", children: resolvedPlaceholder })) : (ms.selectedOptions.map((option) => (_jsxs("span", { className: "inline-flex max-w-full items-center gap-1 rounded-full border border-border bg-muted/60 py-0.5 pl-2 pr-1 text-xs text-foreground", children: [_jsx("span", { className: "truncate", children: option.label }), !isDisabled ? (_jsx("button", { type: "button", "data-sg-chip-remove": "true", tabIndex: -1, className: "flex h-4 w-4 shrink-0 items-center justify-center rounded-full text-foreground/60 hover:bg-foreground/10 hover:text-foreground", onMouseDown: (event) => {
+                        }, children: [_jsx("div", { className: "flex min-w-0 flex-1 flex-wrap items-center gap-1.5", children: ms.selectedOptions.length === 0 ? (_jsx("span", { className: "px-1 text-[var(--sg-input-placeholder,hsl(var(--muted-foreground)))]", children: resolvedPlaceholder })) : (ms.selectedOptions.map((option) => (_jsxs("span", { className: "inline-flex max-w-full items-center gap-1 rounded-full border border-border bg-muted/60 py-0.5 pl-2 pr-1 text-xs text-foreground", children: [_jsx("span", { className: "truncate", title: option.chipLabel !== undefined ? option.label : undefined, children: option.chipLabel ?? option.label }), !isDisabled ? (_jsx("button", { type: "button", "data-sg-chip-remove": "true", tabIndex: -1, className: "flex h-4 w-4 shrink-0 items-center justify-center rounded-full text-foreground/60 hover:bg-foreground/10 hover:text-foreground", onMouseDown: (event) => {
                                                 event.preventDefault();
                                                 event.stopPropagation();
                                                 ms.ignoreBlurRef.current = true;

package/dist/inputs/SgMultiSelectChips.meta.js

@@ -14,7 +14,7 @@ export const sgMeta = {
     props: [
         { name: "id", type: "string", required: true, description: "Identificador unico do campo.", semanticRole: "data", bindable: false },
         { name: "label", type: "string", description: "Rotulo exibido ao usuario.", semanticRole: "label", bindable: true },
-        { name: "options", type: "{ label: string; value: string | number; disabled?: boolean }[]", description: "Lista de opcoes disponiveis.", semanticRole: "data", bindable: false },
+        { name: "options", type: "{ label: string; value: string | number; chipLabel?: string; disabled?: boolean }[]", description: "Lista de opcoes disponiveis. `label` aparece na lista; `chipLabel` (opcional) e' o texto curto do item ja' selecionado (o chip), ex.: label \"3 - Filial Centro\" e chipLabel \"3\".", semanticRole: "data", bindable: false },
         { name: "value", type: "(string | number)[]", description: "Array de valores selecionados.", semanticRole: "value", bindable: true },
         { name: "onChange", type: "(value: (string | number)[]) => void", description: "Callback com o array atualizado de valores.", semanticRole: "event", bindable: false },
         { name: "searchable", type: "boolean", default: false, description: "Exibe campo de busca no topo do dropdown.", semanticRole: "behavior", bindable: true },

package/dist/inputs/useSgMultiSelect.d.ts

@@ -1,8 +1,14 @@
 import React from "react";
 export type SgMultiSelectOptionValue = string | number;
 export type SgMultiSelectOption = {
+    /** Texto da lista (e o que a busca procura). */
     label: string;
     value: SgMultiSelectOptionValue;
+    /**
+     * Texto curto do item JA selecionado: o chip do SgMultiSelectChips e o resumo do SgMultiSelect.
+     * Sem ele, vale o `label`. Ex.: `label: "3 - Filial Centro"`, `chipLabel: "3"`.
+     */
+    chipLabel?: string;
     disabled?: boolean;
 };
 export declare function valueEquals(left: SgMultiSelectOptionValue, right: SgMultiSelectOptionValue): boolean;

package/dist/inputs/useSgMultiSelect.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useSgMultiSelect.d.ts","sourceRoot":"","sources":["../../src/inputs/useSgMultiSelect.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,MAAM,MAAM,wBAAwB,GAAG,MAAM,GAAG,MAAM,CAAC;AAEvD,MAAM,MAAM,mBAAmB,GAAG;IAChC,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,wBAAwB,CAAC;IAChC,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAEF,wBAAgB,WAAW,CAAC,IAAI,EAAE,wBAAwB,EAAE,KAAK,EAAE,wBAAwB,WAE1F;AAED,MAAM,MAAM,sBAAsB,GAAG;IACnC,OAAO,EAAE,mBAAmB,EAAE,CAAC;IAC/B,KAAK,CAAC,EAAE,wBAAwB,EAAE,CAAC;IACnC,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,wBAAwB,EAAE,KAAK,IAAI,CAAC;IACvD,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU,EAAE,OAAO,CAAC;IACpB,YAAY,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;CAChC,CAAC;AAEF;;;;;GAKG;AACH,wBAAgB,gBAAgB,CAAC,MAAM,EAAE,sBAAsB;;;;;;;;;;;;;;;;uCAyB7C,wBAAwB;oCA6C7B,mBAAmB;wCAgBd,wBAAwB;;;;wCA4E9B,KAAK,CAAC,aAAa;EAiE9B"}
+{"version":3,"file":"useSgMultiSelect.d.ts","sourceRoot":"","sources":["../../src/inputs/useSgMultiSelect.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,MAAM,MAAM,wBAAwB,GAAG,MAAM,GAAG,MAAM,CAAC;AAEvD,MAAM,MAAM,mBAAmB,GAAG;IAChC,gDAAgD;IAChD,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,wBAAwB,CAAC;IAChC;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAEF,wBAAgB,WAAW,CAAC,IAAI,EAAE,wBAAwB,EAAE,KAAK,EAAE,wBAAwB,WAE1F;AAED,MAAM,MAAM,sBAAsB,GAAG;IACnC,OAAO,EAAE,mBAAmB,EAAE,CAAC;IAC/B,KAAK,CAAC,EAAE,wBAAwB,EAAE,CAAC;IACnC,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,wBAAwB,EAAE,KAAK,IAAI,CAAC;IACvD,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU,EAAE,OAAO,CAAC;IACpB,YAAY,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;CAChC,CAAC;AAEF;;;;;GAKG;AACH,wBAAgB,gBAAgB,CAAC,MAAM,EAAE,sBAAsB;;;;;;;;;;;;;;;;uCAyB7C,wBAAwB;oCAgD7B,mBAAmB;wCAgBd,wBAAwB;;;;wCA4E9B,KAAK,CAAC,aAAa;EAiE9B"}

package/dist/inputs/useSgMultiSelect.js

@@ -37,7 +37,10 @@ export function useSgMultiSelect(params) {
     }, [options, query, searchable]);
     const selectedLabels = React.useMemo(() => {
         return resolvedValue
-            .map((entry) => options.find((option) => valueEquals(option.value, entry))?.label)
+            .map((entry) => {
+            const option = options.find((candidate) => valueEquals(candidate.value, entry));
+            return option ? (option.chipLabel ?? option.label) : undefined;
+        })
             .filter((label) => Boolean(label));
     }, [options, resolvedValue]);
     const selectedOptions = React.useMemo(() => {