@wellingtonhlc/shared-ui 0.25.0 → 0.25.2
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 +13 -0
- package/dist/components/DateField.d.ts +2 -0
- package/dist/components/DateField.d.ts.map +1 -1
- package/dist/components/DateField.js +57 -12
- package/dist/components/SelectionField.d.ts.map +1 -1
- package/dist/components/SelectionField.js +23 -3
- package/dist/components/Sidebar.js +1 -1
- package/dist/components/TabsUnderlined.d.ts.map +1 -1
- package/dist/components/TabsUnderlined.js +6 -4
- package/dist/index.d.ts +1 -1
- package/dist/index.d.ts.map +1 -1
- package/dist/styles.css +41 -15
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -192,6 +192,19 @@ Componentes disponiveis na API publica:
|
|
|
192
192
|
| Controle de renderizacao | `RenderIf`, `RenderCase` |
|
|
193
193
|
| Tema | `ThemePreferencesSelector` |
|
|
194
194
|
|
|
195
|
+
## DateField
|
|
196
|
+
|
|
197
|
+
`DateField` centraliza entrada de data, data e hora, ou apenas hora. Use `mode`
|
|
198
|
+
para declarar o formato esperado pelo campo:
|
|
199
|
+
|
|
200
|
+
```tsx
|
|
201
|
+
<DateField label="Data" value="2026-06-16" onChange={setDate} mode="date" />
|
|
202
|
+
<DateField label="Data e hora" value="2026-06-16T14:30" onChange={setDateTime} mode="dateTime" />
|
|
203
|
+
<DateField label="Hora" value="14:30" onChange={setTime} mode="time" />
|
|
204
|
+
```
|
|
205
|
+
|
|
206
|
+
`enableTime` permanece suportado como alias legado para `mode="dateTime"`.
|
|
207
|
+
|
|
195
208
|
## AppShell.Topbar.Button
|
|
196
209
|
|
|
197
210
|
Use `AppShell.Topbar.Button` para acoes de icone na barra superior, como notificacoes,
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
+
export type DateFieldMode = 'date' | 'dateTime' | 'time';
|
|
2
3
|
export interface DateFieldProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'size' | 'type' | 'value' | 'onChange'> {
|
|
3
4
|
label?: string;
|
|
4
5
|
value?: string | Date | null;
|
|
@@ -9,6 +10,7 @@ export interface DateFieldProps extends Omit<React.InputHTMLAttributes<HTMLInput
|
|
|
9
10
|
labelClassName?: string;
|
|
10
11
|
size?: 'sm' | 'md' | 'lg';
|
|
11
12
|
roundedFull?: boolean;
|
|
13
|
+
mode?: DateFieldMode;
|
|
12
14
|
enableTime?: boolean;
|
|
13
15
|
timeIntervals?: number;
|
|
14
16
|
noPortal?: boolean;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DateField.d.ts","sourceRoot":"","sources":["../../src/components/DateField.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"DateField.d.ts","sourceRoot":"","sources":["../../src/components/DateField.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAY1B,MAAM,MAAM,aAAa,GAAG,MAAM,GAAG,UAAU,GAAG,MAAM,CAAC;AA6FzD,MAAM,WAAW,cAAe,SAAQ,IAAI,CAAC,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,OAAO,GAAG,UAAU,CAAC;IAC/H,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,GAAG,IAAI,GAAG,IAAI,CAAC;IAC7B,QAAQ,CAAC,EAAE,CAAC,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC,GAAG,KAAK,CAAC,kBAAkB,CAAC,gBAAgB,CAAC,CAAC;IAClF,QAAQ,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,gBAAgB,CAAC,CAAC;IACvC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IAC1B,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,IAAI,CAAC,EAAE,aAAa,CAAC;IACrB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,eAAO,MAAM,SAAS,yFA6IrB,CAAC"}
|
|
@@ -33,6 +33,19 @@ function toDateTimeString(value) {
|
|
|
33
33
|
const pad = (n) => String(n).padStart(2, '0');
|
|
34
34
|
return `${date.getFullYear()}-${pad(date.getMonth() + 1)}-${pad(date.getDate())}T${pad(date.getHours())}:${pad(date.getMinutes())}`;
|
|
35
35
|
}
|
|
36
|
+
function toTimeOnlyString(value) {
|
|
37
|
+
if (value === undefined)
|
|
38
|
+
return undefined;
|
|
39
|
+
if (value === null || value === '')
|
|
40
|
+
return '';
|
|
41
|
+
if (typeof value === 'string' && /^\d{2}:\d{2}$/.test(value))
|
|
42
|
+
return value;
|
|
43
|
+
const date = value instanceof Date ? value : new Date(value);
|
|
44
|
+
if (Number.isNaN(date.getTime()))
|
|
45
|
+
return '';
|
|
46
|
+
const pad = (n) => String(n).padStart(2, '0');
|
|
47
|
+
return `${pad(date.getHours())}:${pad(date.getMinutes())}`;
|
|
48
|
+
}
|
|
36
49
|
function toDateOnlyObject(value) {
|
|
37
50
|
const str = toDateOnlyString(value);
|
|
38
51
|
if (!str)
|
|
@@ -47,11 +60,39 @@ function toDateTimeObject(value) {
|
|
|
47
60
|
const date = value instanceof Date ? value : new Date(value);
|
|
48
61
|
return Number.isNaN(date.getTime()) ? null : date;
|
|
49
62
|
}
|
|
63
|
+
function toTimeOnlyObject(value) {
|
|
64
|
+
const str = toTimeOnlyString(value);
|
|
65
|
+
if (!str)
|
|
66
|
+
return null;
|
|
67
|
+
const [hours, minutes] = str.split(':').map(Number);
|
|
68
|
+
const d = new Date();
|
|
69
|
+
d.setHours(hours, minutes, 0, 0);
|
|
70
|
+
return Number.isNaN(d.getTime()) ? null : d;
|
|
71
|
+
}
|
|
50
72
|
function toOptionalDate(value) {
|
|
51
73
|
if (typeof value !== 'string' || !value)
|
|
52
74
|
return undefined;
|
|
53
75
|
return toDateOnlyObject(value) ?? undefined;
|
|
54
76
|
}
|
|
77
|
+
function getDateFieldMode(mode, enableTime) {
|
|
78
|
+
if (mode)
|
|
79
|
+
return mode;
|
|
80
|
+
return enableTime ? 'dateTime' : 'date';
|
|
81
|
+
}
|
|
82
|
+
function toInputValueByMode(mode, value) {
|
|
83
|
+
if (mode === 'time')
|
|
84
|
+
return toTimeOnlyString(value);
|
|
85
|
+
if (mode === 'dateTime')
|
|
86
|
+
return toDateTimeString(value);
|
|
87
|
+
return toDateOnlyString(value);
|
|
88
|
+
}
|
|
89
|
+
function toDateObjectByMode(mode, value) {
|
|
90
|
+
if (mode === 'time')
|
|
91
|
+
return toTimeOnlyObject(value);
|
|
92
|
+
if (mode === 'dateTime')
|
|
93
|
+
return toDateTimeObject(value);
|
|
94
|
+
return toDateOnlyObject(value);
|
|
95
|
+
}
|
|
55
96
|
function assignRef(ref, value) {
|
|
56
97
|
if (!ref)
|
|
57
98
|
return;
|
|
@@ -61,7 +102,7 @@ function assignRef(ref, value) {
|
|
|
61
102
|
}
|
|
62
103
|
ref.current = value;
|
|
63
104
|
}
|
|
64
|
-
export const DateField = React.forwardRef(({ label, onChange, onBlur, inputRef, disabled, errorMessage, id, className, wrapperClassName, labelClassName, size = 'sm', roundedFull = false, noPortal = false, enableTime = false, timeIntervals = 5, value, name, placeholder, min, max, autoComplete = 'off', autoFocus, }, ref) => {
|
|
105
|
+
export const DateField = React.forwardRef(({ label, onChange, onBlur, inputRef, disabled, errorMessage, id, className, wrapperClassName, labelClassName, size = 'sm', roundedFull = false, noPortal = false, mode, enableTime = false, timeIntervals = 5, value, name, placeholder, min, max, autoComplete = 'off', autoFocus, }, ref) => {
|
|
65
106
|
const sizeMap = {
|
|
66
107
|
sm: 'h-9 text-sm px-3 rounded-md',
|
|
67
108
|
md: 'h-12 text-sm px-4 rounded-md',
|
|
@@ -69,14 +110,16 @@ export const DateField = React.forwardRef(({ label, onChange, onBlur, inputRef,
|
|
|
69
110
|
};
|
|
70
111
|
const sizeClass = sizeMap[size ?? 'sm'];
|
|
71
112
|
const hiddenInputRef = React.useRef(null);
|
|
72
|
-
const
|
|
73
|
-
const
|
|
74
|
-
const
|
|
75
|
-
const
|
|
113
|
+
const resolvedMode = getDateFieldMode(mode, enableTime);
|
|
114
|
+
const isTimeOnly = resolvedMode === 'time';
|
|
115
|
+
const isDateTime = resolvedMode === 'dateTime';
|
|
116
|
+
const isDateOnly = resolvedMode === 'date';
|
|
117
|
+
const normalizedValue = toInputValueByMode(resolvedMode, value);
|
|
118
|
+
const [selectedDate, setSelectedDate] = React.useState(() => toDateObjectByMode(resolvedMode, value));
|
|
76
119
|
React.useEffect(() => {
|
|
77
120
|
if (value !== undefined)
|
|
78
|
-
setSelectedDate(
|
|
79
|
-
}, [value,
|
|
121
|
+
setSelectedDate(toDateObjectByMode(resolvedMode, value));
|
|
122
|
+
}, [value, resolvedMode]);
|
|
80
123
|
React.useEffect(() => {
|
|
81
124
|
if (hiddenInputRef.current && normalizedValue !== undefined) {
|
|
82
125
|
hiddenInputRef.current.value = normalizedValue;
|
|
@@ -101,7 +144,7 @@ export const DateField = React.forwardRef(({ label, onChange, onBlur, inputRef,
|
|
|
101
144
|
const handleDateChange = (nextDate) => {
|
|
102
145
|
const resolved = Array.isArray(nextDate) ? (nextDate[0] ?? null) : nextDate;
|
|
103
146
|
setSelectedDate(resolved);
|
|
104
|
-
emitChange(
|
|
147
|
+
emitChange(toInputValueByMode(resolvedMode, resolved) ?? '');
|
|
105
148
|
};
|
|
106
149
|
return (_jsx(FieldControl, { label: label, id: id || name, wrapperClassName: wrapperClassName, labelClassName: labelClassName, errorMessage: errorMessage, roundedFull: roundedFull, size: size, disabled: disabled, children: ({ controlId, describedBy, errorMessage: controlError, disabled: controlDisabled }) => (_jsxs("div", { className: "relative", children: [_jsx("input", { type: "hidden", ref: (node) => {
|
|
107
150
|
hiddenInputRef.current = node;
|
|
@@ -116,12 +159,14 @@ export const DateField = React.forwardRef(({ label, onChange, onBlur, inputRef,
|
|
|
116
159
|
currentTarget: hiddenInputRef.current,
|
|
117
160
|
};
|
|
118
161
|
onBlur(syntheticEvent);
|
|
119
|
-
}, ...(
|
|
120
|
-
? { showTimeSelect: true, timeIntervals, dateFormat: '
|
|
121
|
-
:
|
|
162
|
+
}, ...(isTimeOnly
|
|
163
|
+
? { showTimeSelect: true, showTimeSelectOnly: true, timeIntervals, dateFormat: 'HH:mm', timeFormat: 'HH:mm', timeCaption: 'Hora' }
|
|
164
|
+
: isDateTime
|
|
165
|
+
? { showTimeSelect: true, timeIntervals, dateFormat: 'dd/MM/yyyy HH:mm', timeFormat: 'HH:mm', timeCaption: 'Hora' }
|
|
166
|
+
: { dateFormat: 'dd/MM/yyyy', minDate: toOptionalDate(min), maxDate: toOptionalDate(max) }), locale: "pt-BR", placeholderText: placeholder ?? label, disabled: controlDisabled, showPopperArrow: false, popperClassName: "app-datepicker-popper", calendarClassName: "app-datepicker", wrapperClassName: "w-full", formatWeekDay: (day) => day.slice(0, 3), ariaDescribedBy: describedBy, ariaInvalid: controlError ? 'true' : undefined, autoComplete: autoComplete, autoFocus: autoFocus, className: controlClasses({
|
|
122
167
|
errorMessage: controlError,
|
|
123
168
|
disabled: controlDisabled,
|
|
124
169
|
extra: cn(className, 'w-full cursor-pointer pr-10', sizeClass),
|
|
125
|
-
}) }), _jsx("div", { className: "pointer-events-none absolute top-1/2 right-3 flex -translate-y-1/2 items-center justify-center", children:
|
|
170
|
+
}) }), _jsx("div", { className: "pointer-events-none absolute top-1/2 right-3 flex -translate-y-1/2 items-center justify-center", children: isDateOnly ? _jsx(Calendar, { className: "text-foreground-muted h-4 w-4" }) : _jsx(CalendarClock, { className: "text-foreground-muted h-4 w-4" }) })] })) }));
|
|
126
171
|
});
|
|
127
172
|
DateField.displayName = 'DateField';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SelectionField.d.ts","sourceRoot":"","sources":["../../src/components/SelectionField.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAAkB,KAAK,eAAe,EAAE,KAAK,kBAAkB,EAAE,MAAM,wBAAwB,CAAC;AAIvG,MAAM,WAAW,qBAAqB;IACpC,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACzB,IAAI,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;CACtB;AAED,MAAM,MAAM,kBAAkB,GAAG,eAAe,CAAC;AACjD,MAAM,MAAM,qBAAqB,GAAG,kBAAkB,CAAC;AAEvD,KAAK,qBAAqB,GAAG,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,GAAG;IAC3E,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB,CAAC;AAEF,MAAM,WAAW,mBACf,SAAQ,IAAI,CACV,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAC7C,UAAU,GAAG,WAAW,GAAG,UAAU,GAAG,UAAU,GAAG,OAAO,CAC7D;IACD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,KAAK,CAAC,EAAE,qBAAqB,GAAG,IAAI,CAAC;IACrC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC5B,WAAW,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC,qBAAqB,CAAC,CAAC;IACxD,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,IAAI,CAAC,EAAE,kBAAkB,CAAC;IAC1B,OAAO,CAAC,EAAE,qBAAqB,CAAC;IAChC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,aAAa,CAAC,EAAE,KAAK,GAAG,OAAO,GAAG,QAAQ,GAAG,MAAM,CAAC;IACpD,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AAuDD,wBAAgB,cAAc,CAAC,EAC7B,KAAK,EACL,WAAW,EACX,KAAK,EACL,WAAqC,EACrC,IAAI,EACJ,SAAS,EACT,WAAW,EACX,SAAiB,EACjB,QAAgB,EAChB,OAAe,EACf,QAAgB,EAChB,YAAY,EACZ,IAAW,EACX,OAAmB,EACnB,YAAY,EACZ,aAA4B,EAC5B,YAA+B,EAC/B,SAAS,EACT,gBAAgB,EAChB,cAAc,EACd,aAAqB,EACrB,OAAO,EACP,OAAO,EACP,KAAK,EAAE,YAAY,EACnB,IAAe,EACf,GAAG,kBAAkB,EACtB,EAAE,mBAAmB,
|
|
1
|
+
{"version":3,"file":"SelectionField.d.ts","sourceRoot":"","sources":["../../src/components/SelectionField.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAAkB,KAAK,eAAe,EAAE,KAAK,kBAAkB,EAAE,MAAM,wBAAwB,CAAC;AAIvG,MAAM,WAAW,qBAAqB;IACpC,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACzB,IAAI,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;CACtB;AAED,MAAM,MAAM,kBAAkB,GAAG,eAAe,CAAC;AACjD,MAAM,MAAM,qBAAqB,GAAG,kBAAkB,CAAC;AAEvD,KAAK,qBAAqB,GAAG,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,GAAG;IAC3E,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB,CAAC;AAEF,MAAM,WAAW,mBACf,SAAQ,IAAI,CACV,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAC7C,UAAU,GAAG,WAAW,GAAG,UAAU,GAAG,UAAU,GAAG,OAAO,CAC7D;IACD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,KAAK,CAAC,EAAE,qBAAqB,GAAG,IAAI,CAAC;IACrC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC5B,WAAW,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC,qBAAqB,CAAC,CAAC;IACxD,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,IAAI,CAAC,EAAE,kBAAkB,CAAC;IAC1B,OAAO,CAAC,EAAE,qBAAqB,CAAC;IAChC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,aAAa,CAAC,EAAE,KAAK,GAAG,OAAO,GAAG,QAAQ,GAAG,MAAM,CAAC;IACpD,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AAuDD,wBAAgB,cAAc,CAAC,EAC7B,KAAK,EACL,WAAW,EACX,KAAK,EACL,WAAqC,EACrC,IAAI,EACJ,SAAS,EACT,WAAW,EACX,SAAiB,EACjB,QAAgB,EAChB,OAAe,EACf,QAAgB,EAChB,YAAY,EACZ,IAAW,EACX,OAAmB,EACnB,YAAY,EACZ,aAA4B,EAC5B,YAA+B,EAC/B,SAAS,EACT,gBAAgB,EAChB,cAAc,EACd,aAAqB,EACrB,OAAO,EACP,OAAO,EACP,KAAK,EAAE,YAAY,EACnB,IAAe,EACf,GAAG,kBAAkB,EACtB,EAAE,mBAAmB,qBAiMrB"}
|
|
@@ -58,11 +58,28 @@ export function SelectionField({ label, description, value, placeholder = 'Selec
|
|
|
58
58
|
const generatedDescriptionId = React.useId().replace(/:/g, '');
|
|
59
59
|
const describedById = description ? `${generatedDescriptionId}-description` : undefined;
|
|
60
60
|
const showClear = clearable && hasValue && !disabled && !loading && !!onClear;
|
|
61
|
+
const [isClearHover, setIsClearHover] = React.useState(false);
|
|
61
62
|
function handleClear(event) {
|
|
62
63
|
event.stopPropagation();
|
|
63
64
|
onClear?.();
|
|
64
65
|
}
|
|
65
|
-
|
|
66
|
+
function handleClearMouseEnter() {
|
|
67
|
+
setIsClearHover(true);
|
|
68
|
+
}
|
|
69
|
+
function handleClearMouseLeave() {
|
|
70
|
+
setIsClearHover(false);
|
|
71
|
+
}
|
|
72
|
+
function handleOpen(event) {
|
|
73
|
+
if (disabled || loading || event.defaultPrevented) {
|
|
74
|
+
return;
|
|
75
|
+
}
|
|
76
|
+
if (onClick) {
|
|
77
|
+
onClick(event);
|
|
78
|
+
return;
|
|
79
|
+
}
|
|
80
|
+
triggerSlot?.props.onClick?.(event);
|
|
81
|
+
}
|
|
82
|
+
const triggerClassName = cn('inline-flex cursor-pointer shrink-0 items-center justify-center rounded-md border border-transparent bg-transparent text-foreground-muted transition-colors', 'focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-brand/30 disabled:pointer-events-none disabled:opacity-50', actionSizeClass[size]);
|
|
66
83
|
const selectionTrigger = triggerSlot
|
|
67
84
|
? React.cloneElement(triggerSlot, {
|
|
68
85
|
'aria-label': triggerSlot.props['aria-label'] ?? selectTooltip,
|
|
@@ -79,7 +96,10 @@ export function SelectionField({ label, description, value, placeholder = 'Selec
|
|
|
79
96
|
errorMessage: controlError,
|
|
80
97
|
disabled: disabled || loading,
|
|
81
98
|
variant,
|
|
82
|
-
extra: cn('group flex items-center overflow-hidden', !hasValue && '
|
|
83
|
-
|
|
99
|
+
extra: cn('group flex items-center overflow-hidden border-dashed', !hasValue && 'bg-[color-mix(in_srgb,var(--brand)_5%,var(--surface))]', hasValue && 'bg-surface', disabled || loading
|
|
100
|
+
? 'cursor-not-allowed'
|
|
101
|
+
: cn('cursor-pointer', !isClearHover &&
|
|
102
|
+
'hover:border-[color-mix(in_srgb,var(--brand)_58%,var(--app-border))] hover:bg-[color-mix(in_srgb,var(--brand)_8%,var(--surface))]'), size === 'lg' ? 'rounded-lg' : 'rounded-md', controlSizeClass[size], controlGapClass[size], resolvedIcon ? controlIconPaddingClass[size] : controlLeadingPaddingClass[size], controlClassName),
|
|
103
|
+
}), "data-empty": !hasValue || undefined, "data-loading": loading || undefined, onClick: handleOpen, children: [resolvedIcon ? (_jsx("span", { className: cn('inline-flex shrink-0 items-center justify-center rounded-md text-foreground-muted', !hasValue && 'text-[color-mix(in_srgb,var(--brand)_72%,var(--foreground-muted))]', actionSizeClass[size], iconSizeClass[size]), "aria-hidden": "true", children: resolvedIcon })) : null, _jsxs("div", { className: cn('min-w-0 flex-1 text-left', textGapClass[size]), children: [_jsxs("div", { className: "flex min-w-0 items-center gap-2", children: [_jsxs("span", { className: cn('min-w-0 truncate font-semibold', hasValue ? 'text-foreground' : 'text-foreground-muted'), children: [title, required && !hasValue ? _jsx("span", { "aria-hidden": "true", children: " *" }) : null] }), meta ? (_jsx("span", { className: "border-app-border bg-background text-foreground-muted shrink-0 rounded border px-1.5 py-0.5 font-mono text-[0.65rem] leading-none", children: meta })) : null] }), subtitle ? (_jsx("p", { className: cn('text-foreground-muted truncate text-xs font-medium', (size === 'xs' || size === 'sm') && 'sr-only'), children: subtitle })) : null] }), shortcutHint ? (_jsx("kbd", { className: "border-app-border bg-background text-foreground-muted hidden shrink-0 rounded border px-1.5 py-1 font-mono text-[0.65rem] leading-none sm:inline-flex", children: shortcutHint })) : null, showClear ? (_jsx("button", { type: "button", "aria-label": clearTooltip, className: cn('inline-flex cursor-pointer shrink-0 items-center justify-center rounded-md border border-transparent bg-transparent text-foreground-muted transition-colors', 'hover:bg-[color-mix(in_srgb,var(--destructive)_10%,transparent)] hover:text-[var(--destructive)]', 'focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--destructive)]/25', actionSizeClass[size]), title: clearTooltip, onClick: handleClear, onMouseEnter: handleClearMouseEnter, onMouseLeave: handleClearMouseLeave, children: _jsx(X, { "aria-hidden": "true" }) })) : null, _jsx("span", { onClick: stopPropagation, children: selectionTrigger })] }), description ? (_jsx("p", { id: describedById, className: "mt-1 text-xs font-medium text-foreground-muted", children: description })) : null] }));
|
|
84
104
|
} }));
|
|
85
105
|
}
|
|
@@ -2,7 +2,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
|
2
2
|
import { forwardRef, useEffect, useMemo, useRef, useState } from 'react';
|
|
3
3
|
import { cn } from '../utils/cn';
|
|
4
4
|
const Root = forwardRef(function SidebarRoot({ ariaLabel = 'Menu lateral', children, className, desktopWidthClass = 'lg:w-72', isOpen, mobileWidthClass = 'w-72', }, ref) {
|
|
5
|
-
return (_jsx("aside", { ref: ref, "aria-label": ariaLabel, "data-open": isOpen, className: cn('border-app-border bg-background-secondary fixed inset-y-0 left-0 z-40 flex h-full w-20 shrink-0 -translate-x-full flex-col justify-between overflow-visible border-r px-2
|
|
5
|
+
return (_jsx("aside", { ref: ref, "aria-label": ariaLabel, "data-open": isOpen, className: cn('border-app-border bg-background-secondary fixed inset-y-0 left-0 z-40 flex h-full w-20 shrink-0 -translate-x-full flex-col justify-between overflow-visible border-r px-2 transition-[width,transform] duration-300 ease-in-out data-[open=true]:w-4/5 data-[open=true]:translate-x-0 md:static md:z-[60] md:w-20 md:translate-x-0 md:shadow-none md:data-[open=true]:w-72', isOpen && `${mobileWidthClass} ${desktopWidthClass}`, className), children: children }));
|
|
6
6
|
});
|
|
7
7
|
function Content({ ariaLabel = 'Navegação principal', children, className }) {
|
|
8
8
|
return (_jsx("nav", { "aria-label": ariaLabel, className: cn('flex min-h-0 w-full flex-1 flex-col', className), children: children }));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TabsUnderlined.d.ts","sourceRoot":"","sources":["../../src/components/TabsUnderlined.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAqB,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAK1D,MAAM,WAAW,iBAAiB;IAChC,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED,MAAM,WAAW,mBAAmB;IAClC,KAAK,EAAE,iBAAiB,EAAE,CAAC;IAC3B,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,gBAAgB,CAAC,EAAE,MAAM,CAAC;CAC3B;AAED,wBAAgB,cAAc,CAAC,EAC7B,SAAS,EACT,gBAAgB,EAChB,YAAY,EACZ,KAAK,EACL,aAAa,EACb,aAAa,EACb,gBAAgB,EAChB,KAAK,GACN,EAAE,mBAAmB,+
|
|
1
|
+
{"version":3,"file":"TabsUnderlined.d.ts","sourceRoot":"","sources":["../../src/components/TabsUnderlined.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAqB,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAK1D,MAAM,WAAW,iBAAiB;IAChC,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED,MAAM,WAAW,mBAAmB;IAClC,KAAK,EAAE,iBAAiB,EAAE,CAAC;IAC3B,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,gBAAgB,CAAC,EAAE,MAAM,CAAC;CAC3B;AAED,wBAAgB,cAAc,CAAC,EAC7B,SAAS,EACT,gBAAgB,EAChB,YAAY,EACZ,KAAK,EACL,aAAa,EACb,aAAa,EACb,gBAAgB,EAChB,KAAK,GACN,EAAE,mBAAmB,+BA8CrB"}
|
|
@@ -4,15 +4,17 @@ import * as Tabs from '@radix-ui/react-tabs';
|
|
|
4
4
|
import { cn } from '../utils/cn';
|
|
5
5
|
export function TabsUnderlined({ className, contentClassName, defaultValue, items, listClassName, onValueChange, triggerClassName, value, }) {
|
|
6
6
|
const visibleItems = useMemo(() => items.filter((item) => item.visible ?? true), [items]);
|
|
7
|
-
const initialValue = defaultValue && visibleItems.some((item) => item.id === defaultValue)
|
|
7
|
+
const initialValue = defaultValue && visibleItems.some((item) => item.id === defaultValue)
|
|
8
|
+
? defaultValue
|
|
9
|
+
: visibleItems[0]?.id || '';
|
|
8
10
|
const [internalValue, setInternalValue] = useState(initialValue);
|
|
9
11
|
const resolvedValue = value ?? internalValue;
|
|
10
12
|
function handleValueChange(nextValue) {
|
|
11
13
|
setInternalValue(nextValue);
|
|
12
14
|
onValueChange?.(nextValue);
|
|
13
15
|
}
|
|
14
|
-
return (_jsx("div", { className: cn('border-app-border bg-surface flex h-full flex-col rounded-xl border', className), children: _jsxs(Tabs.Root, { value: resolvedValue, onValueChange: handleValueChange, className: "flex flex-1 flex-col", children: [_jsx(Tabs.List, { className: cn('border-app-border flex gap-1 border-b text-sm', listClassName), children: visibleItems.map((item) => (_jsx(TabTrigger, { value: item.id, className: triggerClassName, children: item.label }, item.id))) }), visibleItems.map((item) => (_jsx(Tabs.Content, { value: item.id, className: cn('flex h-full flex-1 flex-col overflow-hidden', contentClassName), children: item.children }, item.id)))] }) }));
|
|
16
|
+
return (_jsx("div", { className: cn('border-app-border bg-surface flex h-full flex-col rounded-xl border', className), children: _jsxs(Tabs.Root, { value: resolvedValue, onValueChange: handleValueChange, className: "flex flex-1 flex-col", children: [_jsx(Tabs.List, { className: cn('border-app-border flex gap-1 border-b bg-[color-mix(in_srgb,var(--foreground-muted)_5%,var(--surface))] text-sm', listClassName), children: visibleItems.map((item) => (_jsx(TabTrigger, { value: item.id, className: triggerClassName, children: item.label }, item.id))) }), visibleItems.map((item) => (_jsx(Tabs.Content, { value: item.id, className: cn('flex h-full flex-1 flex-col overflow-hidden', contentClassName), children: item.children }, item.id)))] }) }));
|
|
15
17
|
}
|
|
16
|
-
function TabTrigger({ children, className, value }) {
|
|
17
|
-
return (_jsx(Tabs.Trigger, { value: value, className: cn('text-foreground-muted hover:text-foreground focus-visible:ring-brand/50 data-[state=active]:border-app-border data-[state=active]:border-b-surface data-[state=active]:text-foreground -mb-px inline-flex cursor-pointer items-center border border-t-0 border-transparent px-3 py-2 text-sm font-medium transition-colors first:border-l-0 focus:outline-none focus-visible:ring-2', className), children: children }));
|
|
18
|
+
function TabTrigger({ children, className, value, }) {
|
|
19
|
+
return (_jsx(Tabs.Trigger, { value: value, className: cn('text-foreground-muted hover:text-foreground focus-visible:ring-brand/50 data-[state=active]:border-app-border data-[state=active]:border-b-surface data-[state=active]:bg-surface data-[state=active]:text-foreground -mb-px inline-flex cursor-pointer items-center border border-t-0 border-transparent bg-[color-mix(in_srgb,var(--foreground-muted)_7%,var(--surface))] px-3 py-2 text-sm font-medium transition-colors first:border-l-0 hover:bg-[color-mix(in_srgb,var(--foreground-muted)_10%,var(--surface))] focus:outline-none focus-visible:ring-2', className), children: children }));
|
|
18
20
|
}
|
package/dist/index.d.ts
CHANGED
|
@@ -21,7 +21,7 @@ export { SearchField, type SearchFieldProps } from './components/SearchField';
|
|
|
21
21
|
export { SelectionField, type SelectionDisplayValue, type SelectionFieldProps, type SelectionFieldSize, type SelectionFieldVariant, } from './components/SelectionField';
|
|
22
22
|
export { Switch, type SwitchProps } from './components/Switch';
|
|
23
23
|
export { TextareaField, type TextareaFieldProps } from './components/TextareaField';
|
|
24
|
-
export { DateField, type DateFieldProps } from './components/DateField';
|
|
24
|
+
export { DateField, type DateFieldMode, type DateFieldProps } from './components/DateField';
|
|
25
25
|
export { DecimalField, type DecimalFieldProps } from './components/DecimalField';
|
|
26
26
|
export { Pagination, type PaginationProps, type PaginationSize } from './components/Pagination';
|
|
27
27
|
export { Page, type PageActionButtonProps, type PageActionsAlign, type PageActionsElement, type PageActionsHelpContentProps, type PageActionsPreferences, type PageActionsPosition, type PageActionsProps, type PageActionsSeparatorProps, type PageActionsSize, type PageDescriptionProps, type PageTitleProps, } from './components/Page';
|
package/dist/index.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,YAAY,CAAC;AAChC,OAAO,EACL,QAAQ,EACR,KAAK,mBAAmB,EACxB,KAAK,iBAAiB,EACtB,KAAK,oBAAoB,EACzB,KAAK,sBAAsB,EAC3B,KAAK,yBAAyB,EAC9B,KAAK,mBAAmB,GACzB,MAAM,uBAAuB,CAAC;AAC/B,OAAO,EACL,oBAAoB,EACpB,eAAe,EACf,wBAAwB,EACxB,KAAK,yBAAyB,EAC9B,KAAK,2BAA2B,EAChC,KAAK,oBAAoB,EACzB,KAAK,oBAAoB,EACzB,KAAK,qBAAqB,EAC1B,KAAK,6BAA6B,GACnC,MAAM,8BAA8B,CAAC;AACtC,OAAO,EAAE,KAAK,EAAE,KAAK,UAAU,EAAE,KAAK,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAC/E,OAAO,EAAE,MAAM,EAAE,KAAK,WAAW,EAAE,KAAK,UAAU,EAAE,KAAK,aAAa,EAAE,MAAM,qBAAqB,CAAC;AACpG,OAAO,EACL,kBAAkB,EAClB,KAAK,wBAAwB,EAC7B,KAAK,uBAAuB,EAC5B,KAAK,yBAAyB,EAC9B,KAAK,8BAA8B,GACpC,MAAM,iCAAiC,CAAC;AACzC,OAAO,EAAE,aAAa,EAAE,KAAK,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AACpF,OAAO,EAAE,UAAU,EAAE,WAAW,EAAE,KAAK,eAAe,EAAE,MAAM,yBAAyB,CAAC;AACxF,OAAO,EAAE,UAAU,EAAE,KAAK,eAAe,EAAE,KAAK,iBAAiB,EAAE,MAAM,yBAAyB,CAAC;AACnG,OAAO,EAAE,YAAY,EAAE,KAAK,iBAAiB,EAAE,MAAM,2BAA2B,CAAC;AACjF,OAAO,EAAE,aAAa,EAAE,KAAK,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AACpF,OAAO,EAAE,oBAAoB,EAAE,MAAM,mCAAmC,CAAC;AACzE,OAAO,EAAE,KAAK,EAAE,KAAK,cAAc,EAAE,KAAK,YAAY,EAAE,KAAK,cAAc,EAAE,KAAK,iBAAiB,EAAE,KAAK,SAAS,EAAE,KAAK,YAAY,EAAE,MAAM,oBAAoB,CAAC;AACnK,OAAO,EAAE,gBAAgB,EAAE,KAAK,qBAAqB,EAAE,KAAK,iBAAiB,EAAE,MAAM,+BAA+B,CAAC;AACrH,OAAO,EAAE,SAAS,EAAE,KAAK,qBAAqB,EAAE,KAAK,cAAc,EAAE,KAAK,gBAAgB,EAAE,MAAM,wBAAwB,CAAC;AAC3H,OAAO,EAAE,UAAU,EAAE,KAAK,mBAAmB,EAAE,KAAK,eAAe,EAAE,MAAM,yBAAyB,CAAC;AACrG,OAAO,EAAE,UAAU,EAAE,KAAK,oBAAoB,EAAE,KAAK,mBAAmB,EAAE,MAAM,yBAAyB,CAAC;AAC1G,OAAO,EAAE,QAAQ,EAAE,KAAK,aAAa,EAAE,MAAM,uBAAuB,CAAC;AACrE,OAAO,EAAE,WAAW,EAAE,KAAK,gBAAgB,EAAE,KAAK,WAAW,EAAE,MAAM,0BAA0B,CAAC;AAChG,OAAO,EAAE,WAAW,EAAE,KAAK,gBAAgB,EAAE,MAAM,0BAA0B,CAAC;AAC9E,OAAO,EACL,cAAc,EACd,KAAK,qBAAqB,EAC1B,KAAK,mBAAmB,EACxB,KAAK,kBAAkB,EACvB,KAAK,qBAAqB,GAC3B,MAAM,6BAA6B,CAAC;AACrC,OAAO,EAAE,MAAM,EAAE,KAAK,WAAW,EAAE,MAAM,qBAAqB,CAAC;AAC/D,OAAO,EAAE,aAAa,EAAE,KAAK,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AACpF,OAAO,EAAE,SAAS,EAAE,KAAK,cAAc,EAAE,MAAM,wBAAwB,CAAC;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}
|
package/dist/styles.css
CHANGED
|
@@ -1552,9 +1552,6 @@ h2.react-datepicker__current-month {
|
|
|
1552
1552
|
.animate-pulse {
|
|
1553
1553
|
animation: var(--animate-pulse);
|
|
1554
1554
|
}
|
|
1555
|
-
.cursor-default {
|
|
1556
|
-
cursor: default;
|
|
1557
|
-
}
|
|
1558
1555
|
.cursor-not-allowed {
|
|
1559
1556
|
cursor: not-allowed;
|
|
1560
1557
|
}
|
|
@@ -1917,6 +1914,12 @@ h2.react-datepicker__current-month {
|
|
|
1917
1914
|
background-color: color-mix(in srgb,var(--foreground-muted) 5%,var(--surface));
|
|
1918
1915
|
}
|
|
1919
1916
|
}
|
|
1917
|
+
.bg-\[color-mix\(in_srgb\,var\(--foreground-muted\)_7\%\,var\(--surface\)\)\] {
|
|
1918
|
+
background-color: var(--foreground-muted);
|
|
1919
|
+
@supports (color: color-mix(in lab, red, red)) {
|
|
1920
|
+
background-color: color-mix(in srgb,var(--foreground-muted) 7%,var(--surface));
|
|
1921
|
+
}
|
|
1922
|
+
}
|
|
1920
1923
|
.bg-\[color-mix\(in_srgb\,var\(--foreground-muted\)_8\%\,var\(--surface\)\)\] {
|
|
1921
1924
|
background-color: var(--foreground-muted);
|
|
1922
1925
|
@supports (color: color-mix(in lab, red, red)) {
|
|
@@ -2611,10 +2614,6 @@ h2.react-datepicker__current-month {
|
|
|
2611
2614
|
--tw-shadow: 0 16px 36px -24px var(--tw-shadow-color, color-mix(in srgb,#000 50%,transparent));
|
|
2612
2615
|
box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
|
|
2613
2616
|
}
|
|
2614
|
-
.shadow-\[0_20px_45px_-20px_color-mix\(in_srgb\,\#000_45\%\,transparent\)\] {
|
|
2615
|
-
--tw-shadow: 0 20px 45px -20px var(--tw-shadow-color, color-mix(in srgb,#000 45%,transparent));
|
|
2616
|
-
box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
|
|
2617
|
-
}
|
|
2618
2617
|
.shadow-\[inset_0_0_0_1px_color-mix\(in_srgb\,\#fff_32\%\,transparent\)\,0_8px_18px_-14px_rgba\(0\,0\,0\,0\.55\)\] {
|
|
2619
2618
|
--tw-shadow: inset 0 0 0 1px var(--tw-shadow-color, color-mix(in srgb,#fff 32%,transparent)), 0 8px 18px -14px var(--tw-shadow-color, rgba(0,0,0,0.55));
|
|
2620
2619
|
box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
|
|
@@ -2863,6 +2862,16 @@ h2.react-datepicker__current-month {
|
|
|
2863
2862
|
}
|
|
2864
2863
|
}
|
|
2865
2864
|
}
|
|
2865
|
+
.hover\:border-\[color-mix\(in_srgb\,var\(--brand\)_58\%\,var\(--app-border\)\)\] {
|
|
2866
|
+
&:hover {
|
|
2867
|
+
@media (hover: hover) {
|
|
2868
|
+
border-color: var(--brand);
|
|
2869
|
+
@supports (color: color-mix(in lab, red, red)) {
|
|
2870
|
+
border-color: color-mix(in srgb,var(--brand) 58%,var(--app-border));
|
|
2871
|
+
}
|
|
2872
|
+
}
|
|
2873
|
+
}
|
|
2874
|
+
}
|
|
2866
2875
|
.hover\:border-\[var\(--destructive\)\] {
|
|
2867
2876
|
&:hover {
|
|
2868
2877
|
@media (hover: hover) {
|
|
@@ -2938,6 +2947,16 @@ h2.react-datepicker__current-month {
|
|
|
2938
2947
|
}
|
|
2939
2948
|
}
|
|
2940
2949
|
}
|
|
2950
|
+
.hover\:bg-\[color-mix\(in_srgb\,var\(--brand\)_8\%\,var\(--surface\)\)\] {
|
|
2951
|
+
&:hover {
|
|
2952
|
+
@media (hover: hover) {
|
|
2953
|
+
background-color: var(--brand);
|
|
2954
|
+
@supports (color: color-mix(in lab, red, red)) {
|
|
2955
|
+
background-color: color-mix(in srgb,var(--brand) 8%,var(--surface));
|
|
2956
|
+
}
|
|
2957
|
+
}
|
|
2958
|
+
}
|
|
2959
|
+
}
|
|
2941
2960
|
.hover\:bg-\[color-mix\(in_srgb\,var\(--brand\)_10\%\,transparent\)\] {
|
|
2942
2961
|
&:hover {
|
|
2943
2962
|
@media (hover: hover) {
|
|
@@ -3008,6 +3027,16 @@ h2.react-datepicker__current-month {
|
|
|
3008
3027
|
}
|
|
3009
3028
|
}
|
|
3010
3029
|
}
|
|
3030
|
+
.hover\:bg-\[color-mix\(in_srgb\,var\(--foreground-muted\)_10\%\,var\(--surface\)\)\] {
|
|
3031
|
+
&:hover {
|
|
3032
|
+
@media (hover: hover) {
|
|
3033
|
+
background-color: var(--foreground-muted);
|
|
3034
|
+
@supports (color: color-mix(in lab, red, red)) {
|
|
3035
|
+
background-color: color-mix(in srgb,var(--foreground-muted) 10%,var(--surface));
|
|
3036
|
+
}
|
|
3037
|
+
}
|
|
3038
|
+
}
|
|
3039
|
+
}
|
|
3011
3040
|
.hover\:bg-\[color-mix\(in_srgb\,var\(--status-danger-text\,\#b91c1c\)_88\%\,\#000\)\] {
|
|
3012
3041
|
&:hover {
|
|
3013
3042
|
@media (hover: hover) {
|
|
@@ -3550,6 +3579,11 @@ h2.react-datepicker__current-month {
|
|
|
3550
3579
|
border-bottom-color: var(--color-surface);
|
|
3551
3580
|
}
|
|
3552
3581
|
}
|
|
3582
|
+
.data-\[state\=active\]\:bg-surface {
|
|
3583
|
+
&[data-state="active"] {
|
|
3584
|
+
background-color: var(--color-surface);
|
|
3585
|
+
}
|
|
3586
|
+
}
|
|
3553
3587
|
.data-\[state\=active\]\:text-foreground {
|
|
3554
3588
|
&[data-state="active"] {
|
|
3555
3589
|
color: var(--color-foreground);
|
|
@@ -3763,14 +3797,6 @@ h2.react-datepicker__current-month {
|
|
|
3763
3797
|
}
|
|
3764
3798
|
}
|
|
3765
3799
|
}
|
|
3766
|
-
.md\:data-\[open\=true\]\:shadow-\[4px_0_20px_-6px_color-mix\(in_srgb\,\#000_15\%\,transparent\)\] {
|
|
3767
|
-
@media (width >= 48rem) {
|
|
3768
|
-
&[data-open="true"] {
|
|
3769
|
-
--tw-shadow: 4px 0 20px -6px var(--tw-shadow-color, color-mix(in srgb,#000 15%,transparent));
|
|
3770
|
-
box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
|
|
3771
|
-
}
|
|
3772
|
-
}
|
|
3773
|
-
}
|
|
3774
3800
|
.lg\:w-72 {
|
|
3775
3801
|
@media (width >= 64rem) {
|
|
3776
3802
|
width: calc(var(--spacing) * 72);
|