@seedgrid/fe-components 2026.6.6 → 2026.6.8

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

@@ -831,6 +831,384 @@
         }
       }
     },
+    {
+      "componentId": "form.input.multiselect",
+      "exportName": "SgMultiSelect",
+      "sgMeta": {
+        "version": "0.1",
+        "componentId": "form.input.multiselect",
+        "package": "@seedgrid/fe-components",
+        "exportName": "SgMultiSelect",
+        "slug": "sg-multi-select",
+        "displayName": "SgMultiSelect",
+        "category": "input",
+        "subcategory": "multiselect",
+        "description": "Campo de selecao multipla no estilo select: trigger com chevron que vira check ao abrir e dropdown com checkboxes que mantem a lista aberta.",
+        "tags": [
+          "form",
+          "multiselect",
+          "choice",
+          "checkbox",
+          "rhf"
+        ],
+        "capabilities": [
+          "multi-selection",
+          "search",
+          "clearable",
+          "max-selected",
+          "keyboard"
+        ],
+        "fieldSemantics": [
+          "structuredChoice",
+          "multiChoice",
+          "tags",
+          "categories"
+        ],
+        "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": "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
+          },
+          {
+            "name": "clearable",
+            "type": "boolean",
+            "default": false,
+            "description": "Exibe botao para limpar toda a selecao.",
+            "semanticRole": "behavior",
+            "bindable": true
+          },
+          {
+            "name": "maxSelected",
+            "type": "number",
+            "description": "Limite maximo de itens selecionaveis.",
+            "semanticRole": "validation",
+            "bindable": true
+          },
+          {
+            "name": "placeholder",
+            "type": "string",
+            "description": "Texto exibido quando nada esta selecionado.",
+            "semanticRole": "label",
+            "bindable": true
+          },
+          {
+            "name": "summaryThreshold",
+            "type": "number",
+            "default": 2,
+            "description": "Quantidade de rotulos antes de mostrar 'N selecionadas'.",
+            "semanticRole": "appearance",
+            "bindable": true
+          },
+          {
+            "name": "required",
+            "type": "boolean",
+            "default": false,
+            "description": "Marca o campo como obrigatorio.",
+            "semanticRole": "validation",
+            "bindable": true
+          },
+          {
+            "name": "onEnter",
+            "type": "() => void",
+            "description": "Disparado ao focar o campo.",
+            "semanticRole": "event",
+            "bindable": false
+          },
+          {
+            "name": "onExit",
+            "type": "() => void",
+            "description": "Disparado ao sair do campo.",
+            "semanticRole": "event",
+            "bindable": false
+          }
+        ],
+        "states": [
+          "default",
+          "focused",
+          "open",
+          "disabled",
+          "error"
+        ],
+        "showcase": {
+          "route": "/components/sg-multi-select",
+          "hasPlayground": false,
+          "hasPropsTable": true
+        },
+        "sdui": {
+          "rendererType": "field.multiselect",
+          "acceptsDataBinding": true,
+          "defaultProps": {
+            "searchable": false,
+            "clearable": false,
+            "summaryThreshold": 2
+          }
+        }
+      },
+      "aiHints": {
+        "version": "0.1",
+        "preferredUseCases": [
+          "Selecao de varias opcoes a partir de uma lista fechada (ex.: empresas, categorias, tags).",
+          "Filtros multi-valor em formularios e relatorios.",
+          "Campos relacionais N:N em formularios CRUD."
+        ],
+        "avoidUseCases": [
+          "Escolha unica; nesses casos prefira SgCombobox ou SgRadioGroup.",
+          "Listas muito grandes com busca remota assincrona; nesses casos prefira SgAutocomplete.",
+          "Poucas opcoes sempre visiveis; nesses casos prefira SgCheckboxGroup."
+        ],
+        "synonyms": [
+          "multi select",
+          "multiselect",
+          "selecao multipla",
+          "multiple choice select",
+          "checkbox dropdown"
+        ],
+        "relatedEntityFields": [
+          "empresas",
+          "categorias",
+          "tags",
+          "permissoes",
+          "roles"
+        ],
+        "compositionHints": [
+          "Usar dentro de SgPanel ou SgGroupBox em formularios.",
+          "Combinar com SgCheckboxGroup quando todas as opcoes precisam ficar sempre visiveis."
+        ],
+        "rankingSignals": {
+          "freeText": 0.1,
+          "structuredChoice": 0.95,
+          "date": 0,
+          "number": 0,
+          "denseLayout": 0.7
+        }
+      }
+    },
+    {
+      "componentId": "form.input.multiselectchips",
+      "exportName": "SgMultiSelectChips",
+      "sgMeta": {
+        "version": "0.1",
+        "componentId": "form.input.multiselectchips",
+        "package": "@seedgrid/fe-components",
+        "exportName": "SgMultiSelectChips",
+        "slug": "sg-multi-select-chips",
+        "displayName": "SgMultiSelectChips",
+        "category": "input",
+        "subcategory": "multiselect",
+        "description": "Variante do multi-select onde os itens selecionados viram chips removiveis no trigger; o dropdown com checkboxes e a busca sao iguais ao SgMultiSelect.",
+        "tags": [
+          "form",
+          "multiselect",
+          "chips",
+          "tags",
+          "checkbox",
+          "rhf"
+        ],
+        "capabilities": [
+          "multi-selection",
+          "chips",
+          "search",
+          "clearable",
+          "max-selected",
+          "keyboard"
+        ],
+        "fieldSemantics": [
+          "structuredChoice",
+          "multiChoice",
+          "tags",
+          "categories"
+        ],
+        "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": "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
+          },
+          {
+            "name": "clearable",
+            "type": "boolean",
+            "default": false,
+            "description": "Exibe botao para limpar toda a selecao.",
+            "semanticRole": "behavior",
+            "bindable": true
+          },
+          {
+            "name": "maxSelected",
+            "type": "number",
+            "description": "Limite maximo de itens selecionaveis.",
+            "semanticRole": "validation",
+            "bindable": true
+          },
+          {
+            "name": "placeholder",
+            "type": "string",
+            "description": "Texto exibido quando nada esta selecionado.",
+            "semanticRole": "label",
+            "bindable": true
+          },
+          {
+            "name": "required",
+            "type": "boolean",
+            "default": false,
+            "description": "Marca o campo como obrigatorio.",
+            "semanticRole": "validation",
+            "bindable": true
+          },
+          {
+            "name": "onEnter",
+            "type": "() => void",
+            "description": "Disparado ao focar o campo.",
+            "semanticRole": "event",
+            "bindable": false
+          },
+          {
+            "name": "onExit",
+            "type": "() => void",
+            "description": "Disparado ao sair do campo.",
+            "semanticRole": "event",
+            "bindable": false
+          }
+        ],
+        "states": [
+          "default",
+          "focused",
+          "open",
+          "disabled",
+          "error"
+        ],
+        "showcase": {
+          "route": "/components/sg-multi-select-chips",
+          "hasPlayground": false,
+          "hasPropsTable": true
+        },
+        "sdui": {
+          "rendererType": "field.multiselectchips",
+          "acceptsDataBinding": true,
+          "defaultProps": {
+            "searchable": false,
+            "clearable": false
+          }
+        }
+      },
+      "aiHints": {
+        "version": "0.1",
+        "preferredUseCases": [
+          "Selecao de varias opcoes onde e util ver e remover cada item escolhido individualmente (ex.: tags, destinatarios, empresas).",
+          "Filtros multi-valor em que o usuario precisa enxergar tudo o que ja selecionou.",
+          "Campos relacionais N:N em formularios CRUD com poucos itens visiveis por vez."
+        ],
+        "avoidUseCases": [
+          "Escolha unica; nesses casos prefira SgCombobox ou SgRadioGroup.",
+          "Selecoes muito numerosas onde os chips ocupariam espaco demais; nesses casos prefira SgMultiSelect (resumo 'N selecionadas').",
+          "Listas com busca remota assincrona; nesses casos prefira SgAutocomplete."
+        ],
+        "synonyms": [
+          "multi select chips",
+          "multiselect tags",
+          "selecao multipla com chips",
+          "tag input select",
+          "chips dropdown"
+        ],
+        "relatedEntityFields": [
+          "empresas",
+          "categorias",
+          "tags",
+          "permissoes",
+          "roles",
+          "destinatarios"
+        ],
+        "compositionHints": [
+          "Usar dentro de SgPanel ou SgGroupBox em formularios.",
+          "Preferir a SgMultiSelect quando o numero de selecoes for grande e os chips poluirem o layout."
+        ],
+        "rankingSignals": {
+          "freeText": 0.1,
+          "structuredChoice": 0.95,
+          "date": 0,
+          "number": 0,
+          "denseLayout": 0.6
+        }
+      }
+    },
     {
       "componentId": "form.input.cpf",
       "exportName": "SgInputCPF",
@@ -1518,6 +1896,151 @@
         }
       }
     },
+    {
+      "componentId": "form.input.textsearch",
+      "exportName": "SgInputTextSearch",
+      "sgMeta": {
+        "version": "0.1",
+        "componentId": "form.input.textsearch",
+        "package": "@seedgrid/fe-components",
+        "exportName": "SgInputTextSearch",
+        "slug": "sg-input-text-search",
+        "displayName": "SgInputTextSearch",
+        "category": "input",
+        "subcategory": "search",
+        "description": "Campo de busca que embrulha o SgInputText com debounce sem dependencia externa: onChange imediato e onSearchChange disparado apos o debounce com o termo normalizado (trim + gate por minChars).",
+        "tags": [
+          "form",
+          "search",
+          "debounce",
+          "text",
+          "filter"
+        ],
+        "capabilities": [
+          "debounce",
+          "min-chars-gate",
+          "distinct",
+          "controlled"
+        ],
+        "fieldSemantics": [
+          "freeText",
+          "search",
+          "filter"
+        ],
+        "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": "placeholder",
+            "type": "string",
+            "description": "Texto de apoio dentro do input.",
+            "semanticRole": "label",
+            "bindable": true
+          },
+          {
+            "name": "minChars",
+            "type": "number",
+            "default": 3,
+            "description": "Minimo de caracteres (apos trim) para disparar onSearchChange; 0 caracteres tambem dispara (limpar busca).",
+            "semanticRole": "behavior",
+            "bindable": true
+          },
+          {
+            "name": "debounceMs",
+            "type": "number",
+            "default": 350,
+            "description": "Atraso do debounce em milissegundos antes de disparar onSearchChange.",
+            "semanticRole": "behavior",
+            "bindable": true
+          },
+          {
+            "name": "onChange",
+            "type": "(value: string) => void",
+            "description": "Disparado imediatamente a cada digitacao, com o valor cru.",
+            "semanticRole": "event",
+            "bindable": false
+          },
+          {
+            "name": "onSearchChange",
+            "type": "(value: string) => void",
+            "required": true,
+            "description": "Disparado apos o debounce, com o termo normalizado.",
+            "semanticRole": "event",
+            "bindable": false
+          }
+        ],
+        "states": [
+          "default",
+          "focused",
+          "disabled",
+          "error"
+        ],
+        "showcase": {
+          "route": "/components/sg-input-text-search",
+          "hasPlayground": false,
+          "hasPropsTable": true
+        },
+        "sdui": {
+          "rendererType": "field.textsearch",
+          "acceptsDataBinding": true,
+          "defaultProps": {
+            "minChars": 3,
+            "debounceMs": 350
+          }
+        }
+      },
+      "aiHints": {
+        "version": "0.1",
+        "preferredUseCases": [
+          "Campo de busca/filtro que dispara requisicoes apos o usuario parar de digitar.",
+          "Filtragem de listas, tabelas ou grids com termo de pesquisa debounced.",
+          "Buscas onde se quer evitar disparos a cada tecla e exigir um minimo de caracteres."
+        ],
+        "avoidUseCases": [
+          "Entrada de texto comum sem busca; nesses casos prefira SgInputText.",
+          "Selecao a partir de uma lista fechada; nesses casos prefira SgAutocomplete ou SgCombobox.",
+          "Busca instantanea sem debounce; nesses casos use SgInputText com onChange direto."
+        ],
+        "synonyms": [
+          "search input",
+          "search field",
+          "campo de busca",
+          "debounced search",
+          "filtro de busca"
+        ],
+        "relatedEntityFields": [
+          "query",
+          "search",
+          "term",
+          "filter",
+          "busca"
+        ],
+        "compositionHints": [
+          "Combinar com SgDatatable ou listas para filtrar resultados.",
+          "Agrupar com SgPanel/SgToolBar em cabecalhos de listagem."
+        ],
+        "rankingSignals": {
+          "freeText": 0.9,
+          "structuredChoice": 0.1,
+          "date": 0,
+          "number": 0,
+          "denseLayout": 0.7
+        }
+      }
+    },
     {
       "componentId": "form.input.number",
       "exportName": "SgInputNumber",

package/dist/i18n/en-US.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"en-US.d.ts","sourceRoot":"","sources":["../../src/i18n/en-US.ts"],"names":[],"mappings":"AAAA,QAAA,MAAM,IAAI,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CA8MhC,CAAC;AAEF,eAAe,IAAI,CAAC"}
+{"version":3,"file":"en-US.d.ts","sourceRoot":"","sources":["../../src/i18n/en-US.ts"],"names":[],"mappings":"AAAA,QAAA,MAAM,IAAI,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAgNhC,CAAC;AAEF,eAAe,IAAI,CAAC"}

package/dist/i18n/en-US.js

@@ -146,6 +146,8 @@ const enUS = {
     "components.dialog.close": "Close",
     "components.popup.ariaLabel": "Popup",
     "components.inputs.select.placeholder": "Select",
+    "components.inputs.multiSelect.summary": "{count} selected",
+    "components.inputs.multiSelect.removeChip": "Remove {label}",
     "components.inputs.stepper.increase": "Increase value",
     "components.inputs.stepper.decrease": "Decrease value",
     "components.textEditor.placeholder": "Type here...",

package/dist/i18n/es.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"es.d.ts","sourceRoot":"","sources":["../../src/i18n/es.ts"],"names":[],"mappings":"AAAA,QAAA,MAAM,EAAE,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CA8M9B,CAAC;AAEF,eAAe,EAAE,CAAC"}
+{"version":3,"file":"es.d.ts","sourceRoot":"","sources":["../../src/i18n/es.ts"],"names":[],"mappings":"AAAA,QAAA,MAAM,EAAE,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAgN9B,CAAC;AAEF,eAAe,EAAE,CAAC"}

package/dist/i18n/es.js

@@ -146,6 +146,8 @@ const es = {
     "components.dialog.close": "Cerrar",
     "components.popup.ariaLabel": "Popup",
     "components.inputs.select.placeholder": "Seleccionar",
+    "components.inputs.multiSelect.summary": "{count} seleccionadas",
+    "components.inputs.multiSelect.removeChip": "Quitar {label}",
     "components.inputs.stepper.increase": "Aumentar valor",
     "components.inputs.stepper.decrease": "Disminuir valor",
     "components.textEditor.placeholder": "Escribe aqui...",

package/dist/i18n/fr.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"fr.d.ts","sourceRoot":"","sources":["../../src/i18n/fr.ts"],"names":[],"mappings":"AAAA,QAAA,MAAM,EAAE,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CA8M9B,CAAC;AAEF,eAAe,EAAE,CAAC"}
+{"version":3,"file":"fr.d.ts","sourceRoot":"","sources":["../../src/i18n/fr.ts"],"names":[],"mappings":"AAAA,QAAA,MAAM,EAAE,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAgN9B,CAAC;AAEF,eAAe,EAAE,CAAC"}

package/dist/i18n/fr.js

@@ -146,6 +146,8 @@ const fr = {
     "components.dialog.close": "Fermer",
     "components.popup.ariaLabel": "Fenetre",
     "components.inputs.select.placeholder": "Selectionner",
+    "components.inputs.multiSelect.summary": "{count} selectionnees",
+    "components.inputs.multiSelect.removeChip": "Retirer {label}",
     "components.inputs.stepper.increase": "Augmenter la valeur",
     "components.inputs.stepper.decrease": "Diminuer la valeur",
     "components.textEditor.placeholder": "Tapez ici...",

package/dist/i18n/pt-BR.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"pt-BR.d.ts","sourceRoot":"","sources":["../../src/i18n/pt-BR.ts"],"names":[],"mappings":"AAAA,QAAA,MAAM,IAAI,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CA8MhC,CAAC;AAEF,eAAe,IAAI,CAAC"}
+{"version":3,"file":"pt-BR.d.ts","sourceRoot":"","sources":["../../src/i18n/pt-BR.ts"],"names":[],"mappings":"AAAA,QAAA,MAAM,IAAI,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAgNhC,CAAC;AAEF,eAAe,IAAI,CAAC"}

package/dist/i18n/pt-BR.js

@@ -146,6 +146,8 @@ const ptBR = {
     "components.dialog.close": "Fechar",
     "components.popup.ariaLabel": "Popup",
     "components.inputs.select.placeholder": "Selecione",
+    "components.inputs.multiSelect.summary": "{count} selecionadas",
+    "components.inputs.multiSelect.removeChip": "Remover {label}",
     "components.inputs.stepper.increase": "Aumentar valor",
     "components.inputs.stepper.decrease": "Diminuir valor",
     "components.textEditor.placeholder": "Digite aqui...",

package/dist/i18n/pt-PT.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"pt-PT.d.ts","sourceRoot":"","sources":["../../src/i18n/pt-PT.ts"],"names":[],"mappings":"AAAA,QAAA,MAAM,IAAI,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CA8MhC,CAAC;AAEF,eAAe,IAAI,CAAC"}
+{"version":3,"file":"pt-PT.d.ts","sourceRoot":"","sources":["../../src/i18n/pt-PT.ts"],"names":[],"mappings":"AAAA,QAAA,MAAM,IAAI,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAgNhC,CAAC;AAEF,eAAe,IAAI,CAAC"}

package/dist/i18n/pt-PT.js

@@ -146,6 +146,8 @@ const ptPT = {
     "components.dialog.close": "Fechar",
     "components.popup.ariaLabel": "Popup",
     "components.inputs.select.placeholder": "Selecione",
+    "components.inputs.multiSelect.summary": "{count} selecionadas",
+    "components.inputs.multiSelect.removeChip": "Remover {label}",
     "components.inputs.stepper.increase": "Aumentar valor",
     "components.inputs.stepper.decrease": "Diminuir valor",
     "components.textEditor.placeholder": "Escreva aqui...",

package/dist/index.d.ts

@@ -1,5 +1,7 @@
 export { SgInputText } from "./inputs/SgInputText";
 export type { SgInputTextProps } from "./inputs/SgInputText";
+export { SgInputTextSearch } from "./inputs/SgInputTextSearch";
+export type { SgInputTextSearchProps } from "./inputs/SgInputTextSearch";
 export { SgInputNumber } from "./inputs/SgInputNumber";
 export type { SgInputNumberProps } from "./inputs/SgInputNumber";
 export { SgInputCurrency } from "./inputs/SgInputCurrency";
@@ -32,6 +34,10 @@ export { SgAutocomplete } from "./inputs/SgAutocomplete";
 export type { SgAutocompleteItem, SgAutocompleteProps } from "./inputs/SgAutocomplete";
 export { SgCombobox } from "./inputs/SgCombobox";
 export type { SgComboboxProps, SgComboboxSource } from "./inputs/SgCombobox";
+export { SgMultiSelect } from "./inputs/SgMultiSelect";
+export type { SgMultiSelectProps, SgMultiSelectOption, SgMultiSelectOptionValue } from "./inputs/SgMultiSelect";
+export { SgMultiSelectChips } from "./inputs/SgMultiSelectChips";
+export type { SgMultiSelectChipsProps } from "./inputs/SgMultiSelectChips";
 export { SgTextEditor } from "./inputs/SgTextEditor";
 export type { SgTextEditorProps, SgTextEditorSaveMeta } from "./inputs/SgTextEditor";
 export { SgRating } from "./inputs/SgRating";