rl-core-front 0.13.0 → 0.13.1

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/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "rl-core-front",
3
- "version": "0.13.0",
3
+ "version": "0.13.1",
4
4
  "description": "Telas e componentes Next.js do core: login com 2FA, usu\u00e1rios, RBAC, auditoria, logs e listagens com filtro din\u00e2mico",
5
5
  "author": "Rodrigo Liberti",
6
6
  "license": "MIT",
@@ -4,6 +4,7 @@ import type { JSX } from "react";
4
4
 
5
5
  import type { FilterDraftValue, FilterField } from "#core/_utils/filter";
6
6
  import { Checkbox } from "#core/components/ui/checkbox";
7
+ import { Combobox } from "#core/components/ui/combobox";
7
8
  import { DateRangePicker } from "#core/components/ui/date-range-picker";
8
9
  import { Input } from "#core/components/ui/input";
9
10
  import { Label } from "#core/components/ui/label";
@@ -99,6 +100,42 @@ export function FilterFieldControl({
99
100
  });
100
101
  };
101
102
 
103
+ /*
104
+ * `SELECT` é lista de registro, e lista de registro não tem tamanho: as
105
+ * linhas de uma coleção são trinta e as coleções, cem. Em caixas de marcar,
106
+ * dois campos desses tomavam o painel inteiro e o resto do filtro ficava
107
+ * abaixo da dobra. O `Combobox` ocupa uma linha, traz busca e mostra o que
108
+ * foi escolhido em etiquetas.
109
+ *
110
+ * `ENUM` fica como está: é conjunto fechado e curto — status, tipo de
111
+ * aquisição —, e ali ver as opções todas de uma vez vale mais do que
112
+ * economizar duas linhas.
113
+ */
114
+ if (field.type === "SELECT") {
115
+ return (
116
+ <div className="space-y-2">
117
+ <span className="text-sm font-medium">{label}</span>
118
+ {field.options?.length ? (
119
+ <Combobox
120
+ multiple
121
+ clearable
122
+ options={field.options.map((option) => ({
123
+ id: option.value,
124
+ name: option.label,
125
+ }))}
126
+ value={selected}
127
+ onChange={(values) => onChange({ values })}
128
+ placeholder={t("filters.all")}
129
+ />
130
+ ) : (
131
+ <p className="text-sm text-muted-foreground">
132
+ {t("filters.noOptions")}
133
+ </p>
134
+ )}
135
+ </div>
136
+ );
137
+ }
138
+
102
139
  return (
103
140
  <fieldset className="space-y-2">
104
141
  <legend className="text-sm font-medium">{label}</legend>