@strategicos/ui 0.8.0 → 0.9.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/README.md +23 -8
- package/THIRD_PARTY_NOTICES.md +2 -2
- package/dist/components/date-input.d.ts +46 -0
- package/dist/components/date-input.d.ts.map +1 -0
- package/dist/components/date-input.js +202 -0
- package/dist/components/date-input.js.map +1 -0
- package/dist/components/date-picker-input.d.ts +49 -0
- package/dist/components/date-picker-input.d.ts.map +1 -0
- package/dist/components/date-picker-input.js +126 -0
- package/dist/components/date-picker-input.js.map +1 -0
- package/dist/components/date-time-picker.d.ts +27 -0
- package/dist/components/date-time-picker.d.ts.map +1 -0
- package/dist/components/date-time-picker.js +77 -0
- package/dist/components/date-time-picker.js.map +1 -0
- package/dist/components/dates.d.ts +94 -0
- package/dist/components/dates.d.ts.map +1 -0
- package/dist/components/dates.js +94 -0
- package/dist/components/dates.js.map +1 -0
- package/dist/components/popover.d.ts +1 -1
- package/dist/components/popover.d.ts.map +1 -1
- package/dist/components/popover.js +9 -2
- package/dist/components/popover.js.map +1 -1
- package/dist/components/time-input.d.ts +16 -0
- package/dist/components/time-input.d.ts.map +1 -0
- package/dist/components/time-input.js +18 -0
- package/dist/components/time-input.js.map +1 -0
- package/package.json +1 -1
- package/src/components/date-input.tsx +287 -0
- package/src/components/date-picker-input.tsx +287 -0
- package/src/components/date-time-picker.tsx +152 -0
- package/src/components/dates.tsx +274 -0
- package/src/components/popover.tsx +10 -0
- package/src/components/time-input.tsx +34 -0
- package/dist/components/date-picker.d.ts +0 -78
- package/dist/components/date-picker.d.ts.map +0 -1
- package/dist/components/date-picker.js +0 -142
- package/dist/components/date-picker.js.map +0 -1
- package/src/components/date-picker.tsx +0 -414
package/README.md
CHANGED
|
@@ -15,7 +15,7 @@ import { cn } from "@strategicos/ui/utils"
|
|
|
15
15
|
|
|
16
16
|
## Componentes
|
|
17
17
|
|
|
18
|
-
`accordion` · `alert` · `alert-dialog` · `avatar` · `badge` · `breadcrumb` · `button` · `calendar` · `card` · `checkbox` · `chip` · `combobox` · `date-picker` · `dialog` · `dropdown-menu` · `dropzone` · `empty-state` · `field` · `input` · `label` · `multi-select` · `page-header` · `pagination` · `password-input` · `popover` · `progress` · `segmented-control` · `select` · `separator` · `sheet` · `sidebar` · `skeleton` · `sonner` · `stat` · `switch` · `table` · `tabs` · `textarea` · `tooltip`
|
|
18
|
+
`accordion` · `alert` · `alert-dialog` · `avatar` · `badge` · `breadcrumb` · `button` · `calendar` · `card` · `checkbox` · `chip` · `combobox` · `date-input` · `date-picker-input` · `date-time-picker` · `dates` · `dialog` · `dropdown-menu` · `dropzone` · `empty-state` · `field` · `input` · `label` · `multi-select` · `page-header` · `pagination` · `password-input` · `popover` · `progress` · `segmented-control` · `select` · `separator` · `sheet` · `sidebar` · `skeleton` · `sonner` · `stat` · `switch` · `table` · `tabs` · `textarea` · `time-input` · `tooltip`
|
|
19
19
|
|
|
20
20
|
Utilitários: `@strategicos/ui/utils` (`cn`) e `@strategicos/ui/hooks/use-mobile` (`useIsMobile`).
|
|
21
21
|
|
|
@@ -31,7 +31,7 @@ Botões de ícone: `icon-xs` 24px, `icon-sm` 30px, `icon` 36px, `icon-lg` 42px.
|
|
|
31
31
|
|
|
32
32
|
## Formulários
|
|
33
33
|
|
|
34
|
-
`Field` monta rótulo, descrição, controle e erro, e liga tudo ao controle de dentro (`id`, `aria-describedby`, `aria-invalid`, `required`). Funciona com `Input`, `PasswordInput`, `Textarea`, `SelectTrigger`, `MultiSelect`, `Combobox`, `
|
|
34
|
+
`Field` monta rótulo, descrição, controle e erro, e liga tudo ao controle de dentro (`id`, `aria-describedby`, `aria-invalid`, `required`). Funciona com `Input`, `PasswordInput`, `Textarea`, `SelectTrigger`, `MultiSelect`, `Combobox`, `DateInput`, `DatePickerInput`, `DateTimePicker` e `TimeInput`.
|
|
35
35
|
|
|
36
36
|
```tsx
|
|
37
37
|
import { Field } from "@strategicos/ui/field"
|
|
@@ -66,16 +66,29 @@ Seleção de um item com busca. Pode criar e excluir opções ali mesmo:
|
|
|
66
66
|
|
|
67
67
|
### Datas
|
|
68
68
|
|
|
69
|
-
|
|
69
|
+
Mesmos nomes e ideias do `@mantine/dates`:
|
|
70
|
+
|
|
71
|
+
| Componente | O que é |
|
|
72
|
+
|---|---|
|
|
73
|
+
| `DateInput` | Digitar a data (dd/mm/aaaa, barras automáticas), com calendário no clique. `withTime`: dd/mm/aaaa hh:mm. |
|
|
74
|
+
| `DatePickerInput` | Campo que abre o calendário. `type="range"` para período. |
|
|
75
|
+
| `DateTimePicker` | Calendário com campo de hora. |
|
|
76
|
+
| `TimeInput` | Só a hora (`<input type="time">`). |
|
|
77
|
+
| `Calendar` | O calendário solto (react-day-picker), em português, semana começando no domingo. |
|
|
78
|
+
|
|
79
|
+
Os valores são texto, como no Mantine 8, nunca `Date` — sem erro de fuso: `"AAAA-MM-DD"` para data e `"AAAA-MM-DD HH:mm:ss"` para data e hora. `parseDateValue`, `toDateValue` e `toDateTimeValue` (`@strategicos/ui/dates`) convertem quando precisar.
|
|
70
80
|
|
|
71
81
|
```tsx
|
|
72
|
-
<
|
|
73
|
-
<
|
|
82
|
+
<DateInput value={inicio} onValueChange={setInicio} maxDate={fim} />
|
|
83
|
+
<DatePickerInput value={prazo} onValueChange={setPrazo} minDate={inicio} clearable />
|
|
84
|
+
<DatePickerInput type="range" value={[inicio, fim]} onValueChange={([i, f]) => salvar(i, f)} withApplyButton />
|
|
85
|
+
<DateTimePicker value={reuniao} onValueChange={setReuniao} />
|
|
74
86
|
```
|
|
75
87
|
|
|
76
|
-
- `
|
|
88
|
+
- `withApplyButton`: rodapé com Cancelar e Aplicar — a escolha só vale no Aplicar, e fechar de outro jeito descarta. Sem ele, escolher já grava (e fecha, nos pickers de data). Desligado por padrão no `DatePickerInput`; ligado no `DateTimePicker`, como no Mantine.
|
|
89
|
+
- `DateInput` grava assim que o texto vira uma data válida. Ao sair do campo, texto incompleto ou fora de `minDate`/`maxDate` volta ao último valor; campo vazio grava `null`.
|
|
90
|
+
- `presets` (`DatePickerInput`): atalhos ao lado do calendário (`{ label: "Fim do mês", value: "2026-10-31" }`).
|
|
77
91
|
- `captionLayout="dropdown"`: seletores de mês e ano, para datas distantes.
|
|
78
|
-
- `Calendar` é o calendário solto (react-day-picker), em português e com a semana começando no domingo.
|
|
79
92
|
|
|
80
93
|
## Quando usar cada um
|
|
81
94
|
|
|
@@ -87,7 +100,9 @@ Seleção de um item com busca. Pode criar e excluir opções ali mesmo:
|
|
|
87
100
|
| Escolher um item de poucas opções | `Select` |
|
|
88
101
|
| Escolher um item com busca, ou criando/excluindo opções | `Combobox` |
|
|
89
102
|
| Escolher vários itens com busca | `MultiSelect` |
|
|
90
|
-
|
|
|
103
|
+
| Data que se digita (ex.: formulários longos, teclado) | `DateInput` |
|
|
104
|
+
| Data ou período escolhidos no calendário | `DatePickerInput` |
|
|
105
|
+
| Data e hora | `DateInput withTime` (digitar) ou `DateTimePicker` (calendário) |
|
|
91
106
|
| Indicador numérico (KPI) | `Stat` |
|
|
92
107
|
| Barra de progresso | `Progress` |
|
|
93
108
|
| Área de envio de arquivos | `Dropzone` |
|
package/THIRD_PARTY_NOTICES.md
CHANGED
|
@@ -28,9 +28,9 @@ SOFTWARE.
|
|
|
28
28
|
|
|
29
29
|
## Tremor
|
|
30
30
|
|
|
31
|
-
`calendar.tsx` e `date-picker.tsx` são derivados do Calendar e do DatePicker do [Tremor](https://github.com/tremorlabs/tremor) (`src/components/Calendar/Calendar.tsx` e `src/components/DatePicker/DatePicker.tsx`), distribuídos sob a Apache License 2.0.
|
|
31
|
+
`calendar.tsx`, `dates.tsx`, `date-picker-input.tsx` e `date-time-picker.tsx` são derivados do Calendar e do DatePicker do [Tremor](https://github.com/tremorlabs/tremor) (`src/components/Calendar/Calendar.tsx` e `src/components/DatePicker/DatePicker.tsx`), distribuídos sob a Apache License 2.0.
|
|
32
32
|
|
|
33
|
-
Modificações feitas pela Strategicos: migração para o react-day-picker v10; estilos trocados pelos tokens do `@strategicos/tokens`; valores em `"AAAA-MM-DD"` em vez de `Date`;
|
|
33
|
+
Modificações feitas pela Strategicos: migração para o react-day-picker v10; estilos trocados pelos tokens do `@strategicos/tokens`; API e nomes reorganizados no modelo do `@mantine/dates` (DatePickerInput, DateTimePicker); valores em texto (`"AAAA-MM-DD"`, `"AAAA-MM-DD HH:mm:ss"`) em vez de `Date`; botões Cancelar/Aplicar opcionais (`withApplyButton`); seleção de período em dois cliques controlada pelo componente; seletor de hora do react-aria trocado pelo `<input type="time">`; integração com o `Field`; textos em português.
|
|
34
34
|
|
|
35
35
|
O Tremor, por sua vez, contém partes do shadcn/ui, do Radix Themes e do Medusa UI, sob a licença MIT.
|
|
36
36
|
|
|
@@ -0,0 +1,46 @@
|
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
import { type FieldControlProps } from "./dates.js";
|
|
3
|
+
/**
|
|
4
|
+
* Data digitada, como o DateInput do Mantine: dd/mm/aaaa com as barras postas
|
|
5
|
+
* sozinhas, e um calendário que abre no clique (ou ↓) para quem prefere
|
|
6
|
+
* escolher. `withTime` acrescenta a hora: dd/mm/aaaa hh:mm.
|
|
7
|
+
*
|
|
8
|
+
* <Field label="Início">
|
|
9
|
+
* <DateInput value={inicio} onValueChange={setInicio} maxDate={fim} />
|
|
10
|
+
* </Field>
|
|
11
|
+
*
|
|
12
|
+
* - Valor: "AAAA-MM-DD" (com `withTime`, "AAAA-MM-DD HH:mm:ss") ou `null`.
|
|
13
|
+
* - Grava assim que o texto vira uma data válida dentro de `minDate`/`maxDate`.
|
|
14
|
+
* Ao sair do campo, texto incompleto ou fora dos limites volta ao último
|
|
15
|
+
* valor válido; campo vazio grava `null`.
|
|
16
|
+
* - Colar "2026-10-15" (ISO) também funciona.
|
|
17
|
+
*
|
|
18
|
+
* Teclado: ↓ abre o calendário e põe o foco nele; Enter confirma o texto; Esc
|
|
19
|
+
* fecha o calendário.
|
|
20
|
+
*/
|
|
21
|
+
declare function DateInput({ value, onValueChange, withTime, minDate, maxDate, placeholder, clearable, withCalendar, captionLayout, disabled, required, name, className, wrapperClassName, onBlur, "aria-invalid": ariaInvalid, ...props }: FieldControlProps & {
|
|
22
|
+
value: string | null;
|
|
23
|
+
onValueChange: (value: string | null) => void;
|
|
24
|
+
/** Data e hora (dd/mm/aaaa hh:mm). */
|
|
25
|
+
withTime?: boolean;
|
|
26
|
+
/** Primeiro dia aceito ("AAAA-MM-DD"). */
|
|
27
|
+
minDate?: string;
|
|
28
|
+
/** Último dia aceito ("AAAA-MM-DD"). */
|
|
29
|
+
maxDate?: string;
|
|
30
|
+
placeholder?: string;
|
|
31
|
+
/** Um X no campo limpa o valor. */
|
|
32
|
+
clearable?: boolean;
|
|
33
|
+
/** Calendário no clique. Sem ele, o campo é só de digitar. */
|
|
34
|
+
withCalendar?: boolean;
|
|
35
|
+
captionLayout?: "label" | "dropdown" | "dropdown-months" | "dropdown-years";
|
|
36
|
+
disabled?: boolean;
|
|
37
|
+
required?: boolean;
|
|
38
|
+
name?: string;
|
|
39
|
+
/** Classes do <input>. */
|
|
40
|
+
className?: string;
|
|
41
|
+
/** Classes do invólucro (largura e posição no layout). */
|
|
42
|
+
wrapperClassName?: string;
|
|
43
|
+
onBlur?: React.FocusEventHandler<HTMLInputElement>;
|
|
44
|
+
}): React.JSX.Element;
|
|
45
|
+
export { DateInput };
|
|
46
|
+
//# sourceMappingURL=date-input.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"date-input.d.ts","sourceRoot":"","sources":["../../src/components/date-input.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAK9B,OAAO,EAEwB,KAAK,iBAAiB,EACpD,MAAM,YAAY,CAAA;AA+CnB;;;;;;;;;;;;;;;;;GAiBG;AACH,iBAAS,SAAS,CAAC,EACjB,KAAK,EACL,aAAa,EACb,QAAgB,EAChB,OAAO,EACP,OAAO,EACP,WAA0D,EAC1D,SAAiB,EACjB,YAAmB,EACnB,aAAa,EACb,QAAQ,EACR,QAAQ,EACR,IAAI,EACJ,SAAS,EACT,gBAAgB,EAChB,MAAM,EACN,cAAc,EAAE,WAAW,EAC3B,GAAG,KAAK,EACT,EAAE,iBAAiB,GAAG;IACrB,KAAK,EAAE,MAAM,GAAG,IAAI,CAAA;IACpB,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAA;IAC7C,sCAAsC;IACtC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,0CAA0C;IAC1C,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,wCAAwC;IACxC,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,mCAAmC;IACnC,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,8DAA8D;IAC9D,YAAY,CAAC,EAAE,OAAO,CAAA;IACtB,aAAa,CAAC,EAAE,OAAO,GAAG,UAAU,GAAG,iBAAiB,GAAG,gBAAgB,CAAA;IAC3E,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,0BAA0B;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,0DAA0D;IAC1D,gBAAgB,CAAC,EAAE,MAAM,CAAA;IACzB,MAAM,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC,gBAAgB,CAAC,CAAA;CACnD,qBAwKA;AAED,OAAO,EAAE,SAAS,EAAE,CAAA"}
|
|
@@ -0,0 +1,202 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
|
+
import * as React from "react";
|
|
4
|
+
import { CalendarIcon } from "lucide-react";
|
|
5
|
+
import { cn } from "../lib/utils.js";
|
|
6
|
+
import { Calendar } from "./calendar.js";
|
|
7
|
+
import { clampDate, ClearButton, formatDate, formatDateTime, inRange, outOfRange, parseDateValue, toDateValue, } from "./dates.js";
|
|
8
|
+
import { Input } from "./input.js";
|
|
9
|
+
import { Popover, PopoverAnchor, PopoverContent } from "./popover.js";
|
|
10
|
+
/** Põe as barras (e o espaço e os dois-pontos da hora) entre os dígitos.
|
|
11
|
+
* Separador só ENTRE grupos já começados: "15" e não "15/" — assim apagar
|
|
12
|
+
* para trás nunca esbarra num separador que volta sozinho. */
|
|
13
|
+
function mask(digits, withTime) {
|
|
14
|
+
const d = digits.slice(0, withTime ? 12 : 8);
|
|
15
|
+
let out = d.slice(0, 2);
|
|
16
|
+
if (d.length > 2)
|
|
17
|
+
out += "/" + d.slice(2, 4);
|
|
18
|
+
if (d.length > 4)
|
|
19
|
+
out += "/" + d.slice(4, 8);
|
|
20
|
+
if (d.length > 8)
|
|
21
|
+
out += " " + d.slice(8, 10);
|
|
22
|
+
if (d.length > 10)
|
|
23
|
+
out += ":" + d.slice(10, 12);
|
|
24
|
+
return out;
|
|
25
|
+
}
|
|
26
|
+
const countDigits = (s) => s.replace(/\D/g, "").length;
|
|
27
|
+
/** Posição do cursor logo depois do n-ésimo dígito do texto mascarado. */
|
|
28
|
+
function caretAfterDigits(masked, n) {
|
|
29
|
+
if (n === 0)
|
|
30
|
+
return 0;
|
|
31
|
+
let seen = 0;
|
|
32
|
+
for (let i = 0; i < masked.length; i++) {
|
|
33
|
+
if (/\d/.test(masked[i]) && ++seen === n)
|
|
34
|
+
return i + 1;
|
|
35
|
+
}
|
|
36
|
+
return masked.length;
|
|
37
|
+
}
|
|
38
|
+
/**
|
|
39
|
+
* Texto digitado → valor. Data completa → "AAAA-MM-DD"; com hora →
|
|
40
|
+
* "AAAA-MM-DD HH:mm:00". Incompleto ou inexistente (31/02) → undefined.
|
|
41
|
+
* `dateOnlyOk`: com hora, aceita só a data (hora 00:00) — vale ao sair do
|
|
42
|
+
* campo, não enquanto se digita (a hora pode estar vindo).
|
|
43
|
+
*/
|
|
44
|
+
function parseTyped(text, withTime, dateOnlyOk) {
|
|
45
|
+
const d = text.replace(/\D/g, "");
|
|
46
|
+
if (d.length < 8)
|
|
47
|
+
return undefined;
|
|
48
|
+
const date = `${d.slice(4, 8)}-${d.slice(2, 4)}-${d.slice(0, 2)}`;
|
|
49
|
+
let v;
|
|
50
|
+
if (!withTime)
|
|
51
|
+
v = date;
|
|
52
|
+
else if (d.length === 12)
|
|
53
|
+
v = `${date} ${d.slice(8, 10)}:${d.slice(10, 12)}:00`;
|
|
54
|
+
else if (dateOnlyOk && d.length === 8)
|
|
55
|
+
v = `${date} 00:00:00`;
|
|
56
|
+
else
|
|
57
|
+
return undefined;
|
|
58
|
+
return parseDateValue(v) ? v : undefined;
|
|
59
|
+
}
|
|
60
|
+
/**
|
|
61
|
+
* Data digitada, como o DateInput do Mantine: dd/mm/aaaa com as barras postas
|
|
62
|
+
* sozinhas, e um calendário que abre no clique (ou ↓) para quem prefere
|
|
63
|
+
* escolher. `withTime` acrescenta a hora: dd/mm/aaaa hh:mm.
|
|
64
|
+
*
|
|
65
|
+
* <Field label="Início">
|
|
66
|
+
* <DateInput value={inicio} onValueChange={setInicio} maxDate={fim} />
|
|
67
|
+
* </Field>
|
|
68
|
+
*
|
|
69
|
+
* - Valor: "AAAA-MM-DD" (com `withTime`, "AAAA-MM-DD HH:mm:ss") ou `null`.
|
|
70
|
+
* - Grava assim que o texto vira uma data válida dentro de `minDate`/`maxDate`.
|
|
71
|
+
* Ao sair do campo, texto incompleto ou fora dos limites volta ao último
|
|
72
|
+
* valor válido; campo vazio grava `null`.
|
|
73
|
+
* - Colar "2026-10-15" (ISO) também funciona.
|
|
74
|
+
*
|
|
75
|
+
* Teclado: ↓ abre o calendário e põe o foco nele; Enter confirma o texto; Esc
|
|
76
|
+
* fecha o calendário.
|
|
77
|
+
*/
|
|
78
|
+
function DateInput({ value, onValueChange, withTime = false, minDate, maxDate, placeholder = withTime ? "dd/mm/aaaa hh:mm" : "dd/mm/aaaa", clearable = false, withCalendar = true, captionLayout, disabled, required, name, className, wrapperClassName, onBlur, "aria-invalid": ariaInvalid, ...props }) {
|
|
79
|
+
const display = React.useCallback((v) => {
|
|
80
|
+
const d = parseDateValue(v);
|
|
81
|
+
return d ? (withTime ? formatDateTime(d) : formatDate(d)) : "";
|
|
82
|
+
}, [withTime]);
|
|
83
|
+
const [text, setText] = React.useState(() => display(value));
|
|
84
|
+
const [open, setOpen] = React.useState(false);
|
|
85
|
+
// Pedido de foco nos dias (↓). Contador, e não booleano: a ↓ com o
|
|
86
|
+
// calendário já aberto também precisa levar o foco.
|
|
87
|
+
const [focusRequest, setFocusRequest] = React.useState(0);
|
|
88
|
+
const [month, setMonth] = React.useState(() => parseDateValue(value));
|
|
89
|
+
const inputRef = React.useRef(null);
|
|
90
|
+
const anchorRef = React.useRef(null);
|
|
91
|
+
const contentRef = React.useRef(null);
|
|
92
|
+
const caret = React.useRef(null);
|
|
93
|
+
// Valor trocado por fora (outro campo, reset do formulário): o texto segue,
|
|
94
|
+
// a menos que já represente esse valor (é o que se está digitando).
|
|
95
|
+
const [prevValue, setPrevValue] = React.useState(value);
|
|
96
|
+
if (value !== prevValue) {
|
|
97
|
+
setPrevValue(value);
|
|
98
|
+
if (parseTyped(text, withTime, true) !== value)
|
|
99
|
+
setText(display(value));
|
|
100
|
+
}
|
|
101
|
+
// Recoloca o cursor onde estava depois que a máscara reescreveu o texto.
|
|
102
|
+
React.useLayoutEffect(() => {
|
|
103
|
+
if (caret.current === null || !inputRef.current)
|
|
104
|
+
return;
|
|
105
|
+
inputRef.current.setSelectionRange(caret.current, caret.current);
|
|
106
|
+
caret.current = null;
|
|
107
|
+
}, [text]);
|
|
108
|
+
const accepts = (v) => !!v && inRange(v, minDate, maxDate);
|
|
109
|
+
function setTyped(next, caretAt) {
|
|
110
|
+
caret.current = caretAt;
|
|
111
|
+
setText(next);
|
|
112
|
+
const v = parseTyped(next, withTime, false);
|
|
113
|
+
if (accepts(v)) {
|
|
114
|
+
setMonth(parseDateValue(v));
|
|
115
|
+
if (v !== value)
|
|
116
|
+
onValueChange(v);
|
|
117
|
+
}
|
|
118
|
+
}
|
|
119
|
+
function handleChange(e) {
|
|
120
|
+
const raw = e.target.value;
|
|
121
|
+
const before = countDigits(raw.slice(0, e.target.selectionStart ?? raw.length));
|
|
122
|
+
const next = mask(raw.replace(/\D/g, ""), withTime);
|
|
123
|
+
setTyped(next, caretAfterDigits(next, before));
|
|
124
|
+
}
|
|
125
|
+
function handlePaste(e) {
|
|
126
|
+
// ISO colado ("2026-10-15", "2026-10-15 14:30") vira o texto brasileiro.
|
|
127
|
+
const d = parseDateValue(e.clipboardData.getData("text").trim());
|
|
128
|
+
if (!d)
|
|
129
|
+
return;
|
|
130
|
+
e.preventDefault();
|
|
131
|
+
setTyped(withTime ? formatDateTime(d) : formatDate(d), null);
|
|
132
|
+
}
|
|
133
|
+
/** Sair do campo (ou Enter): grava o texto válido ou volta ao último valor. */
|
|
134
|
+
function settle() {
|
|
135
|
+
if (!text.trim()) {
|
|
136
|
+
if (value !== null)
|
|
137
|
+
onValueChange(null);
|
|
138
|
+
return;
|
|
139
|
+
}
|
|
140
|
+
const v = parseTyped(text, withTime, true);
|
|
141
|
+
if (accepts(v)) {
|
|
142
|
+
if (v !== value)
|
|
143
|
+
onValueChange(v);
|
|
144
|
+
setText(display(v));
|
|
145
|
+
}
|
|
146
|
+
else {
|
|
147
|
+
setText(display(value));
|
|
148
|
+
}
|
|
149
|
+
}
|
|
150
|
+
// O dia focável do DayPicker é o único com tabindex=0 (o escolhido ou hoje).
|
|
151
|
+
React.useEffect(() => {
|
|
152
|
+
if (!focusRequest)
|
|
153
|
+
return;
|
|
154
|
+
contentRef.current?.querySelector('[role=grid] button[tabindex="0"]')?.focus();
|
|
155
|
+
}, [focusRequest]);
|
|
156
|
+
function openCalendar(focus) {
|
|
157
|
+
if (!withCalendar || disabled)
|
|
158
|
+
return;
|
|
159
|
+
if (!open)
|
|
160
|
+
setMonth(parseDateValue(value));
|
|
161
|
+
setOpen(true);
|
|
162
|
+
if (focus)
|
|
163
|
+
setFocusRequest(n => n + 1);
|
|
164
|
+
}
|
|
165
|
+
function pickDay(day) {
|
|
166
|
+
// Com hora, mantém a hora já digitada (ou a do valor, ou 00:00).
|
|
167
|
+
const current = parseTyped(text, withTime, true) ?? value;
|
|
168
|
+
const time = current && current.length >= 19 ? current.slice(11, 19) : "00:00:00";
|
|
169
|
+
const v = withTime ? `${toDateValue(day)} ${time}` : toDateValue(day);
|
|
170
|
+
onValueChange(v);
|
|
171
|
+
setText(display(v));
|
|
172
|
+
setOpen(false);
|
|
173
|
+
inputRef.current?.focus();
|
|
174
|
+
}
|
|
175
|
+
// Digitado e completo, mas inválido ou fora dos limites: borda de erro já
|
|
176
|
+
// enquanto se digita (o Field, se houver, ainda manda no aria-invalid).
|
|
177
|
+
const typedInvalid = countDigits(text) === (withTime ? 12 : 8) && !accepts(parseTyped(text, withTime, false));
|
|
178
|
+
const min = parseDateValue(minDate);
|
|
179
|
+
const max = parseDateValue(maxDate);
|
|
180
|
+
const selected = parseDateValue(value);
|
|
181
|
+
const showClear = clearable && !!text && !disabled;
|
|
182
|
+
return (_jsxs(Popover, { open: open, onOpenChange: setOpen, children: [_jsx(PopoverAnchor, { asChild: true, children: _jsxs("div", { ref: anchorRef, "data-slot": "date-input-wrapper", className: cn("relative w-full min-w-0", wrapperClassName), children: [_jsx(Input, { ref: inputRef, "data-slot": "date-input", value: text, placeholder: placeholder, disabled: disabled, required: required, name: name, inputMode: "numeric", autoComplete: "off", "aria-haspopup": withCalendar ? "dialog" : undefined, "aria-expanded": withCalendar ? open : undefined, "aria-invalid": ariaInvalid ?? (typedInvalid || undefined), leftSection: _jsx(CalendarIcon, {}), className: cn("tabular-nums", showClear && "pr-9", className), onChange: handleChange, onPaste: handlePaste, onClick: () => { if (!open)
|
|
183
|
+
openCalendar(false); }, onKeyDown: e => {
|
|
184
|
+
if (e.key === "ArrowDown" && withCalendar) {
|
|
185
|
+
e.preventDefault();
|
|
186
|
+
openCalendar(true);
|
|
187
|
+
}
|
|
188
|
+
else if (e.key === "Enter") {
|
|
189
|
+
e.preventDefault();
|
|
190
|
+
settle();
|
|
191
|
+
setOpen(false);
|
|
192
|
+
}
|
|
193
|
+
}, onBlur: e => { settle(); onBlur?.(e); }, ...props }), showClear && (_jsx(ClearButton, { onClick: () => { setText(""); onValueChange(null); inputRef.current?.focus(); } }))] }) }), withCalendar && (_jsx(PopoverContent, { ref: contentRef, className: "w-auto p-0",
|
|
194
|
+
// O foco fica no campo: dá para continuar digitando com o calendário
|
|
195
|
+
// aberto. Só a ↓ leva o foco para os dias.
|
|
196
|
+
onOpenAutoFocus: e => e.preventDefault(), onCloseAutoFocus: e => e.preventDefault(),
|
|
197
|
+
// Clicar no próprio campo não conta como "fora".
|
|
198
|
+
onInteractOutside: e => { if (anchorRef.current?.contains(e.target))
|
|
199
|
+
e.preventDefault(); }, children: _jsx(Calendar, { mode: "single", required: true, selected: selected, onSelect: pickDay, month: month ?? clampDate(new Date(), min, max), onMonthChange: setMonth, startMonth: min, endMonth: max, disabled: outOfRange(min, max), captionLayout: captionLayout }) }))] }));
|
|
200
|
+
}
|
|
201
|
+
export { DateInput };
|
|
202
|
+
//# sourceMappingURL=date-input.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"date-input.js","sourceRoot":"","sources":["../../src/components/date-input.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,49 @@
|
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
import { type PickerBaseProps } from "./dates.js";
|
|
3
|
+
export type DatePreset = {
|
|
4
|
+
label: string;
|
|
5
|
+
value: string;
|
|
6
|
+
};
|
|
7
|
+
export type DateRangeValue = [string | null, string | null];
|
|
8
|
+
export type DateRangePreset = {
|
|
9
|
+
label: string;
|
|
10
|
+
value: [string, string];
|
|
11
|
+
};
|
|
12
|
+
type SingleProps = PickerBaseProps & {
|
|
13
|
+
type?: "default";
|
|
14
|
+
value: string | null;
|
|
15
|
+
onValueChange: (value: string | null) => void;
|
|
16
|
+
presets?: DatePreset[];
|
|
17
|
+
};
|
|
18
|
+
type RangeProps = PickerBaseProps & {
|
|
19
|
+
type: "range";
|
|
20
|
+
value: DateRangeValue;
|
|
21
|
+
onValueChange: (value: DateRangeValue) => void;
|
|
22
|
+
presets?: DateRangePreset[];
|
|
23
|
+
/** Meses lado a lado (no celular é sempre um). Padrão: 2. */
|
|
24
|
+
numberOfColumns?: number;
|
|
25
|
+
};
|
|
26
|
+
/**
|
|
27
|
+
* Campo que abre um calendário para escolher uma data ou um período, como o
|
|
28
|
+
* DatePickerInput do Mantine. Não se digita nele — para digitar, `DateInput`.
|
|
29
|
+
*
|
|
30
|
+
* <Field label="Prazo">
|
|
31
|
+
* <DatePickerInput value={prazo} onValueChange={setPrazo} minDate={inicio} clearable />
|
|
32
|
+
* </Field>
|
|
33
|
+
*
|
|
34
|
+
* <DatePickerInput type="range" value={[inicio, fim]} onValueChange={([i, f]) => …} withApplyButton />
|
|
35
|
+
*
|
|
36
|
+
* - Valor: "AAAA-MM-DD" (ou `[início, fim]` no `type="range"`), `null` quando vazio.
|
|
37
|
+
* - `withApplyButton`: a escolha só vale no Aplicar; fechar de outro jeito
|
|
38
|
+
* descarta. Sem ele, escolher o dia (ou o fim do período) já grava e fecha.
|
|
39
|
+
* - `presets`: atalhos ao lado ("Hoje", "Fim do mês"…); os que caem fora de
|
|
40
|
+
* `minDate`/`maxDate` ficam desabilitados.
|
|
41
|
+
* - Período: o primeiro clique marca o início e o segundo, o fim; se o segundo
|
|
42
|
+
* vier antes, os dois trocam.
|
|
43
|
+
*
|
|
44
|
+
* Teclado: o calendário abre com o foco no dia escolhido (ou hoje); setas
|
|
45
|
+
* andam pelos dias, PageUp/PageDown pelos meses, Enter escolhe, Esc fecha.
|
|
46
|
+
*/
|
|
47
|
+
declare function DatePickerInput(props: SingleProps | RangeProps): React.JSX.Element;
|
|
48
|
+
export { DatePickerInput };
|
|
49
|
+
//# sourceMappingURL=date-picker-input.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"date-picker-input.d.ts","sourceRoot":"","sources":["../../src/components/date-picker-input.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAI9B,OAAO,EAEgD,KAAK,eAAe,EAC1E,MAAM,YAAY,CAAA;AAInB,MAAM,MAAM,UAAU,GAAG;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,MAAM,CAAA;CAAE,CAAA;AACzD,MAAM,MAAM,cAAc,GAAG,CAAC,MAAM,GAAG,IAAI,EAAE,MAAM,GAAG,IAAI,CAAC,CAAA;AAC3D,MAAM,MAAM,eAAe,GAAG;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;CAAE,CAAA;AAExE,KAAK,WAAW,GAAG,eAAe,GAAG;IACnC,IAAI,CAAC,EAAE,SAAS,CAAA;IAChB,KAAK,EAAE,MAAM,GAAG,IAAI,CAAA;IACpB,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAA;IAC7C,OAAO,CAAC,EAAE,UAAU,EAAE,CAAA;CACvB,CAAA;AAED,KAAK,UAAU,GAAG,eAAe,GAAG;IAClC,IAAI,EAAE,OAAO,CAAA;IACb,KAAK,EAAE,cAAc,CAAA;IACrB,aAAa,EAAE,CAAC,KAAK,EAAE,cAAc,KAAK,IAAI,CAAA;IAC9C,OAAO,CAAC,EAAE,eAAe,EAAE,CAAA;IAC3B,6DAA6D;IAC7D,eAAe,CAAC,EAAE,MAAM,CAAA;CACzB,CAAA;AAID;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,iBAAS,eAAe,CAAC,KAAK,EAAE,WAAW,GAAG,UAAU,qBAEvD;AAiOD,OAAO,EAAE,eAAe,EAAE,CAAA"}
|
|
@@ -0,0 +1,126 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
|
+
// Derivado do DatePicker do Tremor (Apache-2.0) e modificado pela Strategicos.
|
|
4
|
+
// Ver THIRD_PARTY_NOTICES.md.
|
|
5
|
+
import * as React from "react";
|
|
6
|
+
import { useIsMobile } from "../hooks/use-mobile.js";
|
|
7
|
+
import { Calendar } from "./calendar.js";
|
|
8
|
+
import { clampDate, formatDate, inRange, outOfRange, parseDateValue, toDateValue, PickerFooter, PickerHint, PickerTrigger, PresetList, } from "./dates.js";
|
|
9
|
+
import { useFieldControl } from "./field.js";
|
|
10
|
+
import { Popover, PopoverContent } from "./popover.js";
|
|
11
|
+
const contentCls = "flex w-auto max-w-[calc(100vw-2rem)] flex-col p-0 sm:flex-row";
|
|
12
|
+
/**
|
|
13
|
+
* Campo que abre um calendário para escolher uma data ou um período, como o
|
|
14
|
+
* DatePickerInput do Mantine. Não se digita nele — para digitar, `DateInput`.
|
|
15
|
+
*
|
|
16
|
+
* <Field label="Prazo">
|
|
17
|
+
* <DatePickerInput value={prazo} onValueChange={setPrazo} minDate={inicio} clearable />
|
|
18
|
+
* </Field>
|
|
19
|
+
*
|
|
20
|
+
* <DatePickerInput type="range" value={[inicio, fim]} onValueChange={([i, f]) => …} withApplyButton />
|
|
21
|
+
*
|
|
22
|
+
* - Valor: "AAAA-MM-DD" (ou `[início, fim]` no `type="range"`), `null` quando vazio.
|
|
23
|
+
* - `withApplyButton`: a escolha só vale no Aplicar; fechar de outro jeito
|
|
24
|
+
* descarta. Sem ele, escolher o dia (ou o fim do período) já grava e fecha.
|
|
25
|
+
* - `presets`: atalhos ao lado ("Hoje", "Fim do mês"…); os que caem fora de
|
|
26
|
+
* `minDate`/`maxDate` ficam desabilitados.
|
|
27
|
+
* - Período: o primeiro clique marca o início e o segundo, o fim; se o segundo
|
|
28
|
+
* vier antes, os dois trocam.
|
|
29
|
+
*
|
|
30
|
+
* Teclado: o calendário abre com o foco no dia escolhido (ou hoje); setas
|
|
31
|
+
* andam pelos dias, PageUp/PageDown pelos meses, Enter escolhe, Esc fecha.
|
|
32
|
+
*/
|
|
33
|
+
function DatePickerInput(props) {
|
|
34
|
+
return props.type === "range" ? _jsx(RangePicker, { ...props }) : _jsx(SinglePicker, { ...props });
|
|
35
|
+
}
|
|
36
|
+
function SinglePicker({ type: _type, value, onValueChange, placeholder = "Selecione a data", minDate, maxDate, clearable = false, withApplyButton = false, presets, valueFormatter = formatDate, captionLayout, size, disabled, className, wrapperClassName, align = "start", onOpenChange, ...props }) {
|
|
37
|
+
const controlProps = useFieldControl(props, { withRequired: false });
|
|
38
|
+
const [open, setOpen] = React.useState(false);
|
|
39
|
+
// Com o Aplicar, a escolha fica aqui até confirmar.
|
|
40
|
+
const [draft, setDraft] = React.useState(value);
|
|
41
|
+
const shown = withApplyButton ? draft : value;
|
|
42
|
+
const selected = parseDateValue(shown);
|
|
43
|
+
const committed = parseDateValue(value);
|
|
44
|
+
const min = parseDateValue(minDate);
|
|
45
|
+
const max = parseDateValue(maxDate);
|
|
46
|
+
function handleOpenChange(o) {
|
|
47
|
+
setOpen(o);
|
|
48
|
+
if (o)
|
|
49
|
+
setDraft(value);
|
|
50
|
+
onOpenChange?.(o);
|
|
51
|
+
}
|
|
52
|
+
function pick(v) {
|
|
53
|
+
if (withApplyButton) {
|
|
54
|
+
setDraft(v);
|
|
55
|
+
return;
|
|
56
|
+
}
|
|
57
|
+
onValueChange(v);
|
|
58
|
+
handleOpenChange(false);
|
|
59
|
+
}
|
|
60
|
+
function apply() {
|
|
61
|
+
if (draft !== value)
|
|
62
|
+
onValueChange(draft);
|
|
63
|
+
handleOpenChange(false);
|
|
64
|
+
}
|
|
65
|
+
return (_jsxs(Popover, { open: open, onOpenChange: handleOpenChange, children: [_jsx(PickerTrigger, { slot: "date-picker-input", text: committed ? valueFormatter(committed) : null, placeholder: placeholder, open: open, size: size, disabled: disabled, clearable: clearable, onClear: () => onValueChange(null), className: className, wrapperClassName: wrapperClassName, controlProps: controlProps }), _jsxs(PopoverContent, { align: align, className: contentCls,
|
|
66
|
+
// O foco vai para o dia (autoFocus do calendário), não para o 1º botão.
|
|
67
|
+
onOpenAutoFocus: e => e.preventDefault(), children: [presets && presets.length > 0 && (_jsx(PresetList, { presets: presets, isActive: v => v === shown, isDisabled: v => !inRange(v, minDate, maxDate), onSelect: pick })), _jsxs("div", { className: "flex flex-col", children: [_jsx(Calendar, { mode: "single", required: true, autoFocus: true, selected: selected, onSelect: d => pick(toDateValue(d)), defaultMonth: selected ?? clampDate(new Date(), min, max), startMonth: min, endMonth: max, disabled: outOfRange(min, max), captionLayout: captionLayout }), withApplyButton && (_jsx(PickerFooter, { onCancel: () => handleOpenChange(false), onApply: apply, children: _jsx(PickerHint, { children: selected ? valueFormatter(selected) : "Nenhuma data" }) }))] })] })] }));
|
|
68
|
+
}
|
|
69
|
+
function RangePicker({ type: _type, value, onValueChange, placeholder = "Selecione o período", minDate, maxDate, clearable = false, withApplyButton = false, presets, numberOfColumns = 2, valueFormatter = formatDate, captionLayout, size, disabled, className, wrapperClassName, align = "start", onOpenChange, ...props }) {
|
|
70
|
+
const controlProps = useFieldControl(props, { withRequired: false });
|
|
71
|
+
const isMobile = useIsMobile();
|
|
72
|
+
const [open, setOpen] = React.useState(false);
|
|
73
|
+
const [draft, setDraft] = React.useState(value);
|
|
74
|
+
// Início escolhido nesta abertura, à espera do fim.
|
|
75
|
+
const [pendingFrom, setPendingFrom] = React.useState(null);
|
|
76
|
+
const shown = withApplyButton ? draft : value;
|
|
77
|
+
const from = parseDateValue(shown[0]);
|
|
78
|
+
const to = parseDateValue(shown[1]);
|
|
79
|
+
const min = parseDateValue(minDate);
|
|
80
|
+
const max = parseDateValue(maxDate);
|
|
81
|
+
const format = (range) => {
|
|
82
|
+
const f = parseDateValue(range[0]);
|
|
83
|
+
const t = parseDateValue(range[1]);
|
|
84
|
+
return f ? `${valueFormatter(f)} – ${t ? valueFormatter(t) : "…"}` : null;
|
|
85
|
+
};
|
|
86
|
+
function handleOpenChange(o) {
|
|
87
|
+
setOpen(o);
|
|
88
|
+
setPendingFrom(null);
|
|
89
|
+
if (o)
|
|
90
|
+
setDraft(value);
|
|
91
|
+
onOpenChange?.(o);
|
|
92
|
+
}
|
|
93
|
+
function commit(range) {
|
|
94
|
+
if (withApplyButton) {
|
|
95
|
+
setDraft(range);
|
|
96
|
+
setPendingFrom(null);
|
|
97
|
+
return;
|
|
98
|
+
}
|
|
99
|
+
onValueChange(range);
|
|
100
|
+
handleOpenChange(false);
|
|
101
|
+
}
|
|
102
|
+
function pickDay(day) {
|
|
103
|
+
if (!pendingFrom) {
|
|
104
|
+
setPendingFrom(day);
|
|
105
|
+
return;
|
|
106
|
+
}
|
|
107
|
+
const [s, e] = day < pendingFrom ? [day, pendingFrom] : [pendingFrom, day];
|
|
108
|
+
commit([toDateValue(s), toDateValue(e)]);
|
|
109
|
+
}
|
|
110
|
+
function apply() {
|
|
111
|
+
if (draft[0] !== value[0] || draft[1] !== value[1])
|
|
112
|
+
onValueChange(draft);
|
|
113
|
+
handleOpenChange(false);
|
|
114
|
+
}
|
|
115
|
+
const hint = pendingFrom
|
|
116
|
+
? "Agora escolha o último dia."
|
|
117
|
+
: withApplyButton && from
|
|
118
|
+
? format(shown)
|
|
119
|
+
: "Escolha o primeiro dia.";
|
|
120
|
+
return (_jsxs(Popover, { open: open, onOpenChange: handleOpenChange, children: [_jsx(PickerTrigger, { slot: "date-picker-input", text: format(value), placeholder: placeholder, open: open, size: size, disabled: disabled, clearable: clearable, onClear: () => onValueChange([null, null]), className: className, wrapperClassName: wrapperClassName, controlProps: controlProps }), _jsxs(PopoverContent, { align: align, className: contentCls, onOpenAutoFocus: e => e.preventDefault(), children: [presets && presets.length > 0 && (_jsx(PresetList, { presets: presets, isActive: v => v[0] === shown[0] && v[1] === shown[1], isDisabled: v => !inRange(v[0], minDate, maxDate) || !inRange(v[1], minDate, maxDate), onSelect: commit })), _jsxs("div", { className: "flex flex-col", children: [_jsx(Calendar, { mode: "range", autoFocus: true, numberOfMonths: isMobile ? 1 : numberOfColumns,
|
|
121
|
+
// O cálculo do período é nosso (pickDay): o do DayPicker já fecha
|
|
122
|
+
// um período de um dia no primeiro clique.
|
|
123
|
+
selected: pendingFrom ? { from: pendingFrom, to: undefined } : { from, to }, onSelect: (_, day) => pickDay(day), defaultMonth: from ?? clampDate(new Date(), min, max), startMonth: min, endMonth: max, disabled: outOfRange(min, max), captionLayout: captionLayout }), _jsx(PickerFooter, { onCancel: withApplyButton ? () => handleOpenChange(false) : undefined, onApply: withApplyButton ? apply : undefined, applyDisabled: !!pendingFrom, children: _jsx(PickerHint, { children: hint }) })] })] })] }));
|
|
124
|
+
}
|
|
125
|
+
export { DatePickerInput };
|
|
126
|
+
//# sourceMappingURL=date-picker-input.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"date-picker-input.js","sourceRoot":"","sources":["../../src/components/date-picker-input.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
import { type PickerBaseProps } from "./dates.js";
|
|
3
|
+
/**
|
|
4
|
+
* Data e hora num calendário com campo de hora, como o DateTimePicker do
|
|
5
|
+
* Mantine. Para digitar a data e a hora direto, `DateInput withTime`.
|
|
6
|
+
*
|
|
7
|
+
* <Field label="Reunião">
|
|
8
|
+
* <DateTimePicker value={inicio} onValueChange={setInicio} />
|
|
9
|
+
* </Field>
|
|
10
|
+
*
|
|
11
|
+
* - Valor: "AAAA-MM-DD HH:mm:ss" ou `null`.
|
|
12
|
+
* - `withApplyButton` vem LIGADO (o botão de confirmar do Mantine): escolhe-se
|
|
13
|
+
* o dia e a hora e grava-se no Aplicar. Desligado, cada mudança já grava e o
|
|
14
|
+
* calendário fica aberto até sair dele.
|
|
15
|
+
* - `defaultTime`: hora usada quando ainda não há valor. Padrão: 00:00.
|
|
16
|
+
* - `minDate`/`maxDate` limitam o DIA ("AAAA-MM-DD").
|
|
17
|
+
*/
|
|
18
|
+
declare function DateTimePicker({ value, onValueChange, placeholder, minDate, maxDate, clearable, withApplyButton, withSeconds, defaultTime, valueFormatter, captionLayout, size, disabled, className, wrapperClassName, align, onOpenChange, ...props }: PickerBaseProps & {
|
|
19
|
+
value: string | null;
|
|
20
|
+
onValueChange: (value: string | null) => void;
|
|
21
|
+
/** Campo de hora com segundos. */
|
|
22
|
+
withSeconds?: boolean;
|
|
23
|
+
/** "HH:mm" usada quando ainda não há valor. */
|
|
24
|
+
defaultTime?: string;
|
|
25
|
+
}): React.JSX.Element;
|
|
26
|
+
export { DateTimePicker };
|
|
27
|
+
//# sourceMappingURL=date-time-picker.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"date-time-picker.d.ts","sourceRoot":"","sources":["../../src/components/date-time-picker.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAG9B,OAAO,EAEwB,KAAK,eAAe,EAClD,MAAM,YAAY,CAAA;AAKnB;;;;;;;;;;;;;;GAcG;AACH,iBAAS,cAAc,CAAC,EACtB,KAAK,EACL,aAAa,EACb,WAAqC,EACrC,OAAO,EACP,OAAO,EACP,SAAiB,EACjB,eAAsB,EACtB,WAAmB,EACnB,WAAqB,EACrB,cAA+B,EAC/B,aAAa,EACb,IAAI,EACJ,QAAQ,EACR,SAAS,EACT,gBAAgB,EAChB,KAAe,EACf,YAAY,EACZ,GAAG,KAAK,EACT,EAAE,eAAe,GAAG;IACnB,KAAK,EAAE,MAAM,GAAG,IAAI,CAAA;IACpB,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAA;IAC7C,kCAAkC;IAClC,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,+CAA+C;IAC/C,WAAW,CAAC,EAAE,MAAM,CAAA;CACrB,qBAsFA;AAQD,OAAO,EAAE,cAAc,EAAE,CAAA"}
|