@wellingtonhlc/shared-ui 0.26.14 → 0.27.0
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/dist/components/FieldControl.d.ts +2 -0
- package/dist/components/FieldControl.d.ts.map +1 -1
- package/dist/components/FieldControl.js +3 -3
- package/dist/components/Filter.d.ts.map +1 -1
- package/dist/components/Filter.js +2 -2
- package/dist/components/Modal.d.ts.map +1 -1
- package/dist/components/Modal.js +3 -3
- package/dist/components/SelectionField.js +1 -1
- package/dist/components/Table.js +1 -1
- package/dist/components/TextareaField.d.ts +2 -0
- package/dist/components/TextareaField.d.ts.map +1 -1
- package/dist/components/TextareaField.js +15 -7
- package/dist/components/Tooltip.js +1 -1
- package/dist/components/Workspace.js +3 -3
- package/dist/styles.css +84 -8
- package/package.json +1 -1
|
@@ -11,6 +11,8 @@ export interface FieldControlProps {
|
|
|
11
11
|
roundedFull?: boolean;
|
|
12
12
|
size?: FormControlSize;
|
|
13
13
|
labelPosition?: 'top' | 'right' | 'bottom' | 'left';
|
|
14
|
+
/** Faz o campo preencher a altura disponivel do container (wrapper e controle crescem). */
|
|
15
|
+
stretch?: boolean;
|
|
14
16
|
disabled?: boolean;
|
|
15
17
|
children?: React.ReactNode | ((props: FormControlRenderProps) => React.ReactNode);
|
|
16
18
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FieldControl.d.ts","sourceRoot":"","sources":["../../src/components/FieldControl.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAEL,KAAK,sBAAsB,EAC3B,KAAK,eAAe,EAErB,MAAM,wBAAwB,CAAC;AAGhC,MAAM,WAAW,iBAAiB;IAChC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC9B,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,YAAY,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAClC,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,IAAI,CAAC,EAAE,eAAe,CAAC;IACvB,aAAa,CAAC,EAAE,KAAK,GAAG,OAAO,GAAG,QAAQ,GAAG,MAAM,CAAC;IACpD,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,CAAC,CAAC,KAAK,EAAE,sBAAsB,KAAK,KAAK,CAAC,SAAS,CAAC,CAAC;CACnF;AAED,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,
|
|
1
|
+
{"version":3,"file":"FieldControl.d.ts","sourceRoot":"","sources":["../../src/components/FieldControl.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAEL,KAAK,sBAAsB,EAC3B,KAAK,eAAe,EAErB,MAAM,wBAAwB,CAAC;AAGhC,MAAM,WAAW,iBAAiB;IAChC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC9B,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,YAAY,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAClC,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,IAAI,CAAC,EAAE,eAAe,CAAC;IACvB,aAAa,CAAC,EAAE,KAAK,GAAG,OAAO,GAAG,QAAQ,GAAG,MAAM,CAAC;IACpD,2FAA2F;IAC3F,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,CAAC,CAAC,KAAK,EAAE,sBAAsB,KAAK,KAAK,CAAC,SAAS,CAAC,CAAC;CACnF;AAED,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CA2HpD,CAAC"}
|
|
@@ -3,7 +3,7 @@ import React from 'react';
|
|
|
3
3
|
import { cn } from '../utils/cn';
|
|
4
4
|
import { fieldWrapper, labelBase, } from './form-control-helpers';
|
|
5
5
|
import { FieldValidationError } from './FieldValidationError';
|
|
6
|
-
export const FieldControl = ({ label, id, wrapperClassName, labelClassName = '', labelAction, labelPosition = 'top', errorMessage, roundedFull = false, size = 'sm', disabled = false, hasValidation = false, children, }) => {
|
|
6
|
+
export const FieldControl = ({ label, id, wrapperClassName, labelClassName = '', labelAction, labelPosition = 'top', errorMessage, roundedFull = false, size = 'sm', stretch = false, disabled = false, hasValidation = false, children, }) => {
|
|
7
7
|
const generatedId = React.useId().replace(/:/g, '');
|
|
8
8
|
const componentId = id ?? `fc-${generatedId}`;
|
|
9
9
|
const errorId = `${componentId}-error`;
|
|
@@ -48,7 +48,7 @@ export const FieldControl = ({ label, id, wrapperClassName, labelClassName = '',
|
|
|
48
48
|
};
|
|
49
49
|
const renderedChildren = typeof children === 'function' ? children(renderProps) : children;
|
|
50
50
|
const renderedLabel = label ? (_jsxs("div", { className: cn('flex items-center justify-between gap-2', isHorizontal && 'shrink-0'), style: { order: labelOrder }, children: [_jsx("label", { htmlFor: componentId, className: mergedLabelClassName, children: label }), labelAction] })) : null;
|
|
51
|
-
return (_jsxs("div", { className: cn(fieldWrapper, wrapperClassName, scopeClass, roundedClass), "data-disabled": disabled || undefined, "data-invalid": !!errorMessage || undefined, children: [_jsx("style", { children: `
|
|
51
|
+
return (_jsxs("div", { className: cn(fieldWrapper, stretch && 'h-full min-h-0', wrapperClassName, scopeClass, roundedClass), "data-disabled": disabled || undefined, "data-invalid": !!errorMessage || undefined, children: [_jsx("style", { children: `
|
|
52
52
|
.${scopeClass} input,
|
|
53
53
|
.${scopeClass} textarea,
|
|
54
54
|
.${scopeClass} select { color: var(--foreground); }
|
|
@@ -68,6 +68,6 @@ export const FieldControl = ({ label, id, wrapperClassName, labelClassName = '',
|
|
|
68
68
|
.${roundedClass} input::placeholder,
|
|
69
69
|
.${roundedClass} textarea::placeholder,
|
|
70
70
|
.${roundedClass} select::placeholder { opacity: 0.5; }
|
|
71
|
-
` }), _jsxs("div", { className: cn('flex gap-2', flexDirection), children: [labelOrder === 0 && renderedLabel, _jsx("div", { style: { order: inputOrder }, className: isHorizontal
|
|
71
|
+
` }), _jsxs("div", { className: cn('flex gap-2', flexDirection, stretch && 'min-h-0 flex-1'), children: [labelOrder === 0 && renderedLabel, _jsx("div", { style: { order: inputOrder }, className: cn(isHorizontal && 'flex-1', stretch && 'min-h-0 flex-1'), children: renderedChildren }), labelOrder === 1 && renderedLabel] }), _jsx(FieldValidationError, { id: errorId, message: errorMessage, hasValidation: hasValidation })] }));
|
|
72
72
|
};
|
|
73
73
|
FieldControl.displayName = 'FieldControl';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Filter.d.ts","sourceRoot":"","sources":["../../src/components/Filter.tsx"],"names":[],"mappings":"AAAA,OAAO,EAQL,KAAK,SAAS,EAEd,KAAK,YAAY,EACjB,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAKf,OAAO,EAAyB,KAAK,0BAA0B,EAAE,MAAM,oBAAoB,CAAC;AAK5F,MAAM,WAAW,eAAe;IAC9B,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,QAAQ,EAAE,SAAS,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,SAAS,CAAC,eAAe,CAAC,KAAK,IAAI,CAAC;IACvD,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,eAAe,CAAC,EAAE,MAAM,CAAC;CAC1B;AAED,MAAM,WAAW,iBAAiB;IAChC,QAAQ,EAAE,SAAS,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,MAAM,WAAW,qBAAqB;IACpC,QAAQ,EAAE,SAAS,CAAC;IACpB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACvC,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,MAAM,WAAW,kBAAmB,SAAQ,IAAI,CAAC,0BAA0B,EAAE,UAAU,CAAC;IACtF,WAAW,CAAC,EAAE,YAAY,CAAC;IAC3B,KAAK,CAAC,EAAE,SAAS,CAAC;CACnB;AAED,UAAU,4BAA4B;IACpC,IAAI,EAAE,OAAO,CAAC;IACd,OAAO,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACjC,SAAS,EAAE,MAAM,CAAC;CACnB;AAED,eAAO,MAAM,uBAAuB,8DAA2D,CAAC;AAEhG,iBAAS,YAAY,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,EAAE,iBAAiB,+
|
|
1
|
+
{"version":3,"file":"Filter.d.ts","sourceRoot":"","sources":["../../src/components/Filter.tsx"],"names":[],"mappings":"AAAA,OAAO,EAQL,KAAK,SAAS,EAEd,KAAK,YAAY,EACjB,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAKf,OAAO,EAAyB,KAAK,0BAA0B,EAAE,MAAM,oBAAoB,CAAC;AAK5F,MAAM,WAAW,eAAe;IAC9B,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,QAAQ,EAAE,SAAS,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,SAAS,CAAC,eAAe,CAAC,KAAK,IAAI,CAAC;IACvD,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,eAAe,CAAC,EAAE,MAAM,CAAC;CAC1B;AAED,MAAM,WAAW,iBAAiB;IAChC,QAAQ,EAAE,SAAS,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,MAAM,WAAW,qBAAqB;IACpC,QAAQ,EAAE,SAAS,CAAC;IACpB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACvC,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,MAAM,WAAW,kBAAmB,SAAQ,IAAI,CAAC,0BAA0B,EAAE,UAAU,CAAC;IACtF,WAAW,CAAC,EAAE,YAAY,CAAC;IAC3B,KAAK,CAAC,EAAE,SAAS,CAAC;CACnB;AAED,UAAU,4BAA4B;IACpC,IAAI,EAAE,OAAO,CAAC;IACd,OAAO,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACjC,SAAS,EAAE,MAAM,CAAC;CACnB;AAED,eAAO,MAAM,uBAAuB,8DAA2D,CAAC;AAEhG,iBAAS,YAAY,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,EAAE,iBAAiB,+BAS/D;AAED,iBAAS,gBAAgB,CAAC,EAAE,QAAQ,EAAE,WAAkB,EAAE,IAAI,EAAE,cAAc,EAAE,YAAY,EAAE,SAAS,EAAE,EAAE,qBAAqB,+BAiB/H;AAED,iBAAS,aAAa,CAAC,EAAE,WAAW,EAAE,KAAiB,EAAE,OAAO,EAAE,GAAG,KAAK,EAAE,EAAE,kBAAkB,+BAmB/F;AAuBD,iBAAS,UAAU,CAAC,EAClB,KAAiB,EACjB,WAAgB,EAChB,QAAQ,EACR,SAAS,EACT,aAAa,EACb,gBAAgB,EAChB,kBAAuB,EACvB,QAAQ,EACR,OAAO,EACP,WAAW,EACX,UAAU,EACV,YAAoB,EACpB,eAAuB,EACvB,eAAe,GAChB,EAAE,eAAe,+BAoDjB;AAED,eAAO,MAAM,MAAM;;;;;CAKlB,CAAC"}
|
|
@@ -8,7 +8,7 @@ import { Card } from './Card';
|
|
|
8
8
|
import { RenderIf } from './RenderIf';
|
|
9
9
|
export const FilterVisibilityContext = createContext(null);
|
|
10
10
|
function FilterFooter({ children, className }) {
|
|
11
|
-
return (_jsx("div", { className: cn('border-app-border flex shrink-0 items-center justify-end gap-2 border-t px-4 py-3', className), children: children }));
|
|
11
|
+
return (_jsx("div", { "data-slot": "filter-footer", className: cn('border-app-border flex shrink-0 items-center justify-end gap-2 border-t px-4 py-3', className), children: children }));
|
|
12
12
|
}
|
|
13
13
|
function FilterVisibility({ children, defaultOpen = true, open: controlledOpen, onOpenChange, className }) {
|
|
14
14
|
const [uncontrolledOpen, setUncontrolledOpen] = useState(defaultOpen);
|
|
@@ -58,7 +58,7 @@ function FilterRoot({ title = 'Filtros', description = '', children, className,
|
|
|
58
58
|
onSubmit?.(event);
|
|
59
59
|
}
|
|
60
60
|
const bodyContent = (_jsxs("div", { className: "flex min-h-0 flex-1 flex-col gap-3", children: [_jsx("div", { className: cn('min-h-0 flex-1 overflow-y-auto [scrollbar-gutter:stable]', contentClassName), children: _jsxs("div", { className: cn('flex flex-col gap-1 py-3 pl-4 pr-1', fieldsClassName), children: [description ? _jsx("p", { className: "text-foreground-muted text-xs leading-5", children: description }) : null, contentChildren] }) }), hasExplicitFooter ? footerChildren : null, !hasExplicitFooter && hasAutomaticActions ? (_jsx(FilterActions, { actionsDisabled: actionsDisabled, clearLabel: clearLabel, isSubmitting: isSubmitting, onClear: onClear, onSubmit: onSubmit, submitLabel: submitLabel })) : null] }));
|
|
61
|
-
return (_jsxs(Card.Root, { id: visibility?.contentId, className: cn('flex h-full w-full min-w-0 flex-col overflow-hidden', maxHeightClassName, className), "data-slot": "filter-root", "data-state": isOpen ? 'open' : 'closed', children: [_jsxs(Card.Title, { children: [_jsx(FilterIcon, { className: "text-primary h-4 w-4" }), title] }), _jsx(Card.Body, { density: "none", className: cn('flex min-h-0 flex-1 flex-col', bodyClassName), children: onSubmit ? _jsx("form", { className: "flex min-h-0 flex-1 flex-col", onSubmit: handleSubmit, children: bodyContent }) : bodyContent })] }));
|
|
61
|
+
return (_jsxs(Card.Root, { id: visibility?.contentId, className: cn('flex h-full w-full min-w-0 flex-col overflow-hidden', maxHeightClassName, className), "data-slot": "filter-root", "data-state": isOpen ? 'open' : 'closed', children: [_jsxs(Card.Title, { "data-slot": "filter-header", children: [_jsx(FilterIcon, { className: "text-primary h-4 w-4" }), title] }), _jsx(Card.Body, { density: "none", className: cn('flex min-h-0 flex-1 flex-col', bodyClassName), children: onSubmit ? _jsx("form", { className: "flex min-h-0 flex-1 flex-col", onSubmit: handleSubmit, children: bodyContent }) : bodyContent })] }));
|
|
62
62
|
}
|
|
63
63
|
export const Filter = {
|
|
64
64
|
Root: FilterRoot,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Modal.d.ts","sourceRoot":"","sources":["../../src/components/Modal.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,KAAK,eAAe,MAAM,wBAAwB,CAAC;AAK1D,MAAM,MAAM,SAAS,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,MAAM,CAAC;AAClE,MAAM,MAAM,YAAY,GAAG,SAAS,GAAG,UAAU,CAAC;AAClD,MAAM,MAAM,YAAY,GAAG,SAAS,GAAG,SAAS,CAAC;AAEjD,MAAM,WAAW,cAAe,SAAQ,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,IAAI,CAAC;IACvF,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,YAAY,CAAC;IACvB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,OAAO,CAAC,EAAE,YAAY,CAAC;IACvB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,kBAAkB,CAAC,EAAE,OAAO,CAAC;CAC9B;AAED,MAAM,WAAW,cAAe,SAAQ,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC;IACjE,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,OAAO,CAAC,EAAE,YAAY,CAAC;IACvB,eAAe,CAAC,EAAE,OAAO,CAAC;CAC3B;AAED,MAAM,WAAW,iBAAkB,SAAQ,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC;IACpE,OAAO,CAAC,EAAE,YAAY,CAAC;IACvB,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAkED,iBAAS,aAAa,CAAC,OAAO,EAAE,KAAK,CAAC,SAAS,EAAE,OAAO,EAAE;IAAE,IAAI,EAAE,OAAO,CAAC;IAAC,MAAM,EAAE,MAAM,IAAI,CAAA;CAAE,4UAW9F;AAED,iBAAS,SAAS,CAAC,EACjB,kBAA0B,EAC1B,QAAgB,EAChB,QAAQ,EACR,SAAS,EACT,OAAmB,EACnB,gBAAgB,EAChB,MAAM,EACN,eAAsB,EACtB,IAAW,EACX,OAAmB,EACnB,YAAY,EACZ,GAAG,KAAK,EACT,EAAE,cAAc,
|
|
1
|
+
{"version":3,"file":"Modal.d.ts","sourceRoot":"","sources":["../../src/components/Modal.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,KAAK,eAAe,MAAM,wBAAwB,CAAC;AAK1D,MAAM,MAAM,SAAS,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,MAAM,CAAC;AAClE,MAAM,MAAM,YAAY,GAAG,SAAS,GAAG,UAAU,CAAC;AAClD,MAAM,MAAM,YAAY,GAAG,SAAS,GAAG,SAAS,CAAC;AAEjD,MAAM,WAAW,cAAe,SAAQ,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,IAAI,CAAC;IACvF,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,YAAY,CAAC;IACvB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,OAAO,CAAC,EAAE,YAAY,CAAC;IACvB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,kBAAkB,CAAC,EAAE,OAAO,CAAC;CAC9B;AAED,MAAM,WAAW,cAAe,SAAQ,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC;IACjE,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,OAAO,CAAC,EAAE,YAAY,CAAC;IACvB,eAAe,CAAC,EAAE,OAAO,CAAC;CAC3B;AAED,MAAM,WAAW,iBAAkB,SAAQ,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC;IACpE,OAAO,CAAC,EAAE,YAAY,CAAC;IACvB,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAkED,iBAAS,aAAa,CAAC,OAAO,EAAE,KAAK,CAAC,SAAS,EAAE,OAAO,EAAE;IAAE,IAAI,EAAE,OAAO,CAAC;IAAC,MAAM,EAAE,MAAM,IAAI,CAAA;CAAE,4UAW9F;AAED,iBAAS,SAAS,CAAC,EACjB,kBAA0B,EAC1B,QAAgB,EAChB,QAAQ,EACR,SAAS,EACT,OAAmB,EACnB,gBAAgB,EAChB,MAAM,EACN,eAAsB,EACtB,IAAW,EACX,OAAmB,EACnB,YAAY,EACZ,GAAG,KAAK,EACT,EAAE,cAAc,qBAqEhB;AAED,iBAAS,WAAW,CAAC,EAAE,SAAS,EAAE,OAAmB,EAAE,SAAiB,EAAE,GAAG,KAAK,EAAE,EAAE,iBAAiB,qBAetG;AAED,iBAAS,SAAS,CAAC,EAAE,SAAS,EAAE,OAAmB,EAAE,eAAuB,EAAE,UAAkB,EAAE,GAAG,KAAK,EAAE,EAAE,cAAc,qBAc3H;AAED,iBAAS,WAAW,CAAC,EAAE,SAAS,EAAE,OAAmB,EAAE,SAAgB,EAAE,GAAG,KAAK,EAAE,EAAE,iBAAiB,qBAcrG;AAED,iBAAS,UAAU,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,KAAK,CAAC,qBAE9F;AAED,iBAAS,gBAAgB,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,WAAW,CAAC,qBAE1G;AAED,eAAO,MAAM,KAAK;;;;;;;;;;;CAWjB,CAAC"}
|
package/dist/components/Modal.js
CHANGED
|
@@ -73,17 +73,17 @@ function ModalRoot({ allowExternalFocus = false, centered = false, children, cla
|
|
|
73
73
|
onOpenChange?.(nextOpen);
|
|
74
74
|
}
|
|
75
75
|
const hasFooter = React.Children.toArray(children).some((child) => React.isValidElement(child) && child.type === ModalFooter);
|
|
76
|
-
return (_jsx(DialogPrimitive.Root, { ...props, open: open, onOpenChange: handleOpenChange, children: _jsxs(DialogPrimitive.Portal, { children: [_jsx(DialogPrimitive.Overlay, { style: { zIndex: overlayZIndex }, className: cn('fixed inset-0 z-[100] bg-black/50 backdrop-blur-[2px]
|
|
76
|
+
return (_jsx(DialogPrimitive.Root, { ...props, open: open, onOpenChange: handleOpenChange, children: _jsxs(DialogPrimitive.Portal, { children: [_jsx(DialogPrimitive.Overlay, { style: { zIndex: overlayZIndex }, className: cn('fixed inset-0 z-[100] bg-black/50 backdrop-blur-[2px]', overlayClassName) }), _jsxs(DialogPrimitive.Content, { onFocusOutside: allowExternalFocus ? (event) => event.preventDefault() : undefined, style: {
|
|
77
77
|
zIndex: contentZIndex,
|
|
78
78
|
width: widthVariants[size],
|
|
79
79
|
...(!centered && offset ? { top: `${offset}px` } : {}),
|
|
80
|
-
}, className: cn('fixed z-[110] grid max-h-[95vh]', hasFooter ? 'grid-rows-[auto_minmax(0,1fr)_auto]' : 'grid-rows-[auto_minmax(0,1fr)]', 'rounded-xl
|
|
80
|
+
}, className: cn('fixed z-[110] grid max-h-[95vh]', hasFooter ? 'grid-rows-[auto_minmax(0,1fr)_auto]' : 'grid-rows-[auto_minmax(0,1fr)]', 'rounded-xl', density === 'default' && 'p-6', density === 'compact' && 'p-4', variant === 'default' && 'border-app-border bg-background-secondary text-foreground border shadow-lg', variant === 'elevated' && 'border-app-border bg-surface text-foreground border shadow-2xl', centered ? 'left-[50%] top-[50%] -translate-x-1/2 -translate-y-1/2' : 'left-[50%] top-[2.5%] -translate-x-1/2', sizeVariants[size], minHeightVariants[size], className), children: [children, showCloseButton ? (_jsxs(DialogPrimitive.Close, { className: cn('absolute right-4 top-4 inline-flex h-8 w-8 items-center justify-center rounded-md', 'text-foreground-muted hover:bg-background hover:text-foreground cursor-pointer transition-colors', 'focus:ring-brand/50 focus:ring-2 focus:ring-offset-2 focus:outline-none disabled:pointer-events-none'), children: [_jsx(XIcon, { className: "size-4" }), _jsx("span", { className: "sr-only", children: "Fechar" })] })) : null] })] }) }));
|
|
81
81
|
}
|
|
82
82
|
function ModalHeader({ className, density = 'default', separated = false, ...props }) {
|
|
83
83
|
return (_jsx("div", { "data-slot": "modal-header", className: cn('flex flex-col text-center sm:text-left', density === 'default' && 'gap-1.5 [&_[data-slot=modal-description]]:text-sm [&_[data-slot=modal-title]]:text-lg', density === 'compact' && 'gap-0.5 [&_[data-slot=modal-description]]:text-xs [&_[data-slot=modal-title]]:text-base', separated && density === 'default' && 'border-app-border border-b pb-4', separated && density === 'compact' && 'border-app-border border-b pb-2', className), ...props }));
|
|
84
84
|
}
|
|
85
85
|
function ModalBody({ className, density = 'default', overflowVisible = false, scrollable = false, ...props }) {
|
|
86
|
-
return (_jsx("div", { "data-slot": "modal-body", className: cn('flex min-h-0 flex-col', density === 'default' && 'space-y-5 text-sm leading-6', density === 'compact' && 'space-y-2 text-xs leading-5', overflowVisible ? 'overflow-visible' : scrollable ? 'overflow-y-auto
|
|
86
|
+
return (_jsx("div", { "data-slot": "modal-body", className: cn('flex min-h-0 flex-col', density === 'default' && 'space-y-5 py-4 text-sm leading-6', density === 'compact' && 'space-y-2 py-2 text-xs leading-5', overflowVisible ? 'overflow-visible' : scrollable ? 'overflow-y-auto pr-1' : 'overflow-visible', className), ...props }));
|
|
87
87
|
}
|
|
88
88
|
function ModalFooter({ className, density = 'default', separated = true, ...props }) {
|
|
89
89
|
return (_jsx("div", { "data-slot": "modal-footer", className: cn('flex flex-col-reverse sm:flex-row sm:justify-end', density === 'default' && 'mt-3 gap-2.5 pt-5', density === 'compact' && 'mt-0 gap-1.5 pt-2', separated && 'border-app-border border-t', className), ...props }));
|
|
@@ -100,6 +100,6 @@ export function SelectionField({ label, description, value, placeholder = 'Selec
|
|
|
100
100
|
? 'cursor-not-allowed'
|
|
101
101
|
: cn('cursor-pointer', !isClearHover &&
|
|
102
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] }));
|
|
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, disabled ? 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] }));
|
|
104
104
|
} }));
|
|
105
105
|
}
|
package/dist/components/Table.js
CHANGED
|
@@ -8,7 +8,7 @@ const Root = forwardRef(({ children, chrome = 'default', className, density = 'd
|
|
|
8
8
|
const tableChildren = childNodes.filter((child) => !isValidElement(child) || child.type !== Pagination);
|
|
9
9
|
const paginationChildren = childNodes.filter((child) => isValidElement(child) && child.type === Pagination);
|
|
10
10
|
const { className: wrapperPropsClassName, ...resolvedWrapperProps } = wrapperProps ?? {};
|
|
11
|
-
return (_jsxs("div", { ...resolvedWrapperProps, "data-slot": "table-root", className: cn('bg-surface flex w-full min-w-0 flex-col overflow-hidden', fill && 'h-full min-h-0 grow', isFramed && 'border-app-border rounded-[var(--radius)] border', isFramed && chrome === 'default' && 'shadow-[0_4px_6px_-1px_rgb(0_0_0/0.07),0_2px_4px_-2px_rgb(0_0_0/0.05)]', density === 'compact' && '[&_td]:py-2 [&_th]:py-2', wrapperPropsClassName, wrapperClassName), children: [_jsx("div", { className: cn('min-h-0 flex-1 overflow-auto', viewportClassName), children: _jsx("table", { ref: ref, className: cn('w-full border-separate border-spacing-0 caption-bottom text-sm text-foreground', className), ...props, children: tableChildren }) }), paginationChildren.length > 0 && (_jsx("div", { className: cn('border-app-border bg-
|
|
11
|
+
return (_jsxs("div", { ...resolvedWrapperProps, "data-slot": "table-root", className: cn('bg-surface flex w-full min-w-0 flex-col overflow-hidden', fill && 'h-full min-h-0 grow', isFramed && 'border-app-border rounded-[var(--radius)] border', isFramed && chrome === 'default' && 'shadow-[0_4px_6px_-1px_rgb(0_0_0/0.07),0_2px_4px_-2px_rgb(0_0_0/0.05)]', density === 'compact' && '[&_td]:py-2 [&_th]:py-2', wrapperPropsClassName, wrapperClassName), children: [_jsx("div", { className: cn('min-h-0 flex-1 overflow-auto', viewportClassName), children: _jsx("table", { ref: ref, className: cn('w-full border-separate border-spacing-0 caption-bottom text-sm text-foreground', className), ...props, children: tableChildren }) }), paginationChildren.length > 0 && (_jsx("div", { "data-slot": "table-pagination", className: cn('border-app-border bg-background-secondary shrink-0 border-t px-3 py-2', density === 'compact' && 'px-3 py-2'), children: paginationChildren }))] }));
|
|
12
12
|
});
|
|
13
13
|
Root.displayName = 'Table.Root';
|
|
14
14
|
const Header = forwardRef(({ className, ...props }, ref) => _jsx("thead", { ref: ref, className: cn('bg-background-secondary', className), ...props }));
|
|
@@ -7,6 +7,8 @@ export interface TextareaFieldProps extends Omit<React.TextareaHTMLAttributes<HT
|
|
|
7
7
|
hasValidation?: boolean;
|
|
8
8
|
roundedFull?: boolean;
|
|
9
9
|
size?: 'xs' | 'sm' | 'md' | 'lg';
|
|
10
|
+
/** Faz o textarea preencher a altura disponivel do container em vez de usar altura fixa. */
|
|
11
|
+
stretch?: boolean;
|
|
10
12
|
}
|
|
11
13
|
export declare const TextareaField: React.ForwardRefExoticComponent<TextareaFieldProps & React.RefAttributes<HTMLTextAreaElement>>;
|
|
12
14
|
//# sourceMappingURL=TextareaField.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TextareaField.d.ts","sourceRoot":"","sources":["../../src/components/TextareaField.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAM1B,MAAM,WAAW,kBAAmB,SAAQ,IAAI,CAAC,KAAK,CAAC,sBAAsB,CAAC,mBAAmB,CAAC,EAAE,MAAM,CAAC;IACzG,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;
|
|
1
|
+
{"version":3,"file":"TextareaField.d.ts","sourceRoot":"","sources":["../../src/components/TextareaField.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAM1B,MAAM,WAAW,kBAAmB,SAAQ,IAAI,CAAC,KAAK,CAAC,sBAAsB,CAAC,mBAAmB,CAAC,EAAE,MAAM,CAAC;IACzG,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IACjC,4FAA4F;IAC5F,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAED,eAAO,MAAM,aAAa,gGA8EzB,CAAC"}
|
|
@@ -3,24 +3,32 @@ import React from 'react';
|
|
|
3
3
|
import { cn } from '../utils/cn';
|
|
4
4
|
import { controlClasses } from './form-control-helpers';
|
|
5
5
|
import { FieldControl } from './FieldControl';
|
|
6
|
-
export const TextareaField = React.forwardRef(({ label, errorMessage, id, className, wrapperClassName = '', labelClassName = '', roundedFull = false, size = 'sm', placeholder, disabled = false, hasValidation = false, ...props }, ref) => {
|
|
6
|
+
export const TextareaField = React.forwardRef(({ label, errorMessage, id, className, wrapperClassName = '', labelClassName = '', roundedFull = false, size = 'sm', stretch = false, placeholder, disabled = false, hasValidation = false, ...props }, ref) => {
|
|
7
7
|
const componentId = id || props.name;
|
|
8
8
|
const sizeMap = {
|
|
9
|
-
xs: '
|
|
10
|
-
sm: '
|
|
11
|
-
md: '
|
|
12
|
-
lg: '
|
|
9
|
+
xs: 'text-xs px-2',
|
|
10
|
+
sm: 'text-sm px-3',
|
|
11
|
+
md: 'text-sm px-4',
|
|
12
|
+
lg: 'text-base px-6',
|
|
13
|
+
};
|
|
14
|
+
const heightMap = {
|
|
15
|
+
xs: 'h-7',
|
|
16
|
+
sm: 'h-9',
|
|
17
|
+
md: 'h-12',
|
|
18
|
+
lg: 'h-14',
|
|
13
19
|
};
|
|
14
20
|
const roundedClass = roundedFull ? 'rounded-full' : size === 'lg' ? 'rounded-lg' : 'rounded-md';
|
|
15
21
|
const sizeClassArr = [];
|
|
16
22
|
if (!props.rows) {
|
|
17
23
|
sizeClassArr.push(sizeMap[size ?? 'sm']);
|
|
24
|
+
if (!stretch)
|
|
25
|
+
sizeClassArr.push(heightMap[size ?? 'sm']);
|
|
18
26
|
sizeClassArr.push(roundedClass);
|
|
19
27
|
}
|
|
20
|
-
return (_jsx(FieldControl, { label: label, id: componentId, labelClassName: labelClassName, wrapperClassName: wrapperClassName, errorMessage: errorMessage, roundedFull: roundedFull, size: size, disabled: disabled, hasValidation: hasValidation, children: ({ controlId, describedBy, errorMessage: controlError, disabled: controlDisabled, label: controlLabel }) => (_jsx("textarea", { ref: ref, ...props, id: controlId, disabled: controlDisabled, placeholder: placeholder ?? controlLabel, "aria-invalid": !!controlError, "aria-describedby": describedBy, className: controlClasses({
|
|
28
|
+
return (_jsx(FieldControl, { label: label, id: componentId, labelClassName: labelClassName, wrapperClassName: wrapperClassName, errorMessage: errorMessage, roundedFull: roundedFull, size: size, stretch: stretch, disabled: disabled, hasValidation: hasValidation, children: ({ controlId, describedBy, errorMessage: controlError, disabled: controlDisabled, label: controlLabel }) => (_jsx("textarea", { ref: ref, ...props, id: controlId, disabled: controlDisabled, placeholder: placeholder ?? controlLabel, "aria-invalid": !!controlError, "aria-describedby": describedBy, className: controlClasses({
|
|
21
29
|
errorMessage: controlError,
|
|
22
30
|
disabled: controlDisabled,
|
|
23
|
-
extra: cn(...sizeClassArr, roundedFull && 'min-h-[2rem] px-4 py-1.5', className),
|
|
31
|
+
extra: cn(...sizeClassArr, roundedFull && 'min-h-[2rem] px-4 py-1.5', stretch && 'h-full min-h-0', className),
|
|
24
32
|
}) })) }));
|
|
25
33
|
});
|
|
26
34
|
TextareaField.displayName = 'TextareaField';
|
|
@@ -36,5 +36,5 @@ export function Tooltip({ children, className, content, delayDuration = 300, ope
|
|
|
36
36
|
return;
|
|
37
37
|
setOpen((current) => !current);
|
|
38
38
|
}
|
|
39
|
-
return (_jsx(TooltipPrimitive.Provider, { delayDuration: delayDuration, children: _jsxs(TooltipPrimitive.Root, { open: openOnClick ? open : undefined, onOpenChange: openOnClick ? handleOpenChange : undefined, children: [_jsx(TooltipPrimitive.Trigger, { asChild: true, ref: triggerRef, onClick: handleTriggerClick, children: children }), _jsx(TooltipPrimitive.Portal, { children: _jsxs(TooltipPrimitive.Content, { ref: contentRef, className: cn('border-app-border bg-surface text-foreground z-
|
|
39
|
+
return (_jsx(TooltipPrimitive.Provider, { delayDuration: delayDuration, children: _jsxs(TooltipPrimitive.Root, { open: openOnClick ? open : undefined, onOpenChange: openOnClick ? handleOpenChange : undefined, children: [_jsx(TooltipPrimitive.Trigger, { asChild: true, ref: triggerRef, onClick: handleTriggerClick, children: children }), _jsx(TooltipPrimitive.Portal, { children: _jsxs(TooltipPrimitive.Content, { ref: contentRef, className: cn('border-app-border bg-surface text-foreground z-[200] rounded-md border px-3 py-1.5 text-xs shadow-lg', 'data-[state=delayed-open]:animate-in data-[state=delayed-open]:fade-in-0 data-[state=closed]:animate-out data-[state=closed]:fade-out-0', className), side: side, sideOffset: sideOffset, children: [content, _jsx(TooltipPrimitive.Arrow, { className: "fill-surface" })] }) })] }) }));
|
|
40
40
|
}
|
|
@@ -15,9 +15,9 @@ function WorkspaceRoot({ filters, children, className, appearance = 'separated'
|
|
|
15
15
|
const isJoined = appearance === 'joined';
|
|
16
16
|
const isFilterOpen = visibility?.open ?? true;
|
|
17
17
|
const result = children;
|
|
18
|
-
return (_jsxs("div", { className: cn('grid min-h-0 flex-1 xl:grid-rows-[minmax(0,1fr)]', isJoined
|
|
19
|
-
? 'gap-0 overflow-hidden rounded-[var(--radius)] border border-app-border bg-background-secondary [&_[data-slot=filter-root]]:rounded-none [&_[data-slot=filter-root]]:border-0 [&_[data-slot=filter-root]]:!border-r [&_[data-slot=filter-root]]:!border-app-border [&_[data-slot=table-root]]
|
|
20
|
-
: 'gap-3', isFilterOpen ? 'xl:grid-cols-[280px_minmax(0,1fr)]' : 'xl:grid-cols-[minmax(0,1fr)]', className), children: [_jsx(RenderIf, { when: isFilterOpen, children: _jsx("aside", { className: "min-h-0 xl:self-stretch xl:[&>*]:h-full xl:[&>*]:min-h-0", children: filters }) }), _jsx("section", { className: cn('flex min-h-0 flex-1 flex-col', isJoined ? 'bg-background-secondary' : 'bg-transparent'), children: _jsx(WorkspaceResultContext.Provider, { value: true, children: _jsxs(RenderCase.Root, { children: [_jsx(RenderCase.If, { when: Boolean(result && (Array.isArray(result) ? result.length > 0 : true)), children: result }), _jsx(RenderCase.Else, { children: _jsx(Card.Root, { className: "flex flex-1 items-center justify-center bg-surface/60 p-8 shadow-sm", children: _jsx(EmptyState, { title: "Nenhum resultado", description: "Ajuste os filtros e pesquise novamente." }) }) })] }) }) })] }));
|
|
18
|
+
return (_jsxs("div", { className: cn('grid h-full min-h-0 flex-1 xl:grid-rows-[minmax(0,1fr)]', isJoined
|
|
19
|
+
? 'gap-0 overflow-hidden rounded-[var(--radius)] border border-app-border bg-background-secondary [&_[data-slot=filter-root]]:rounded-none [&_[data-slot=filter-root]]:border-0 [&_[data-slot=filter-root]]:!border-r [&_[data-slot=filter-root]]:!border-app-border [&_[data-slot=filter-header]]:!h-10 [&_[data-slot=filter-header]]:!rounded-none [&_[data-slot=filter-header]]:!bg-background-secondary [&_[data-slot=filter-footer]]:!px-3 [&_[data-slot=filter-footer]]:!py-2 [&_[data-slot=filter-footer]_button]:!h-8 [&_[data-slot=filter-footer]_button]:!min-h-8 [&_[data-slot=filter-footer]_button]:!px-2.5 [&_[data-slot=filter-footer]_button]:!py-0 [&_[data-slot=filter-footer]_button]:!text-xs [&_[data-slot=table-root]]:!rounded-none [&_[data-slot=table-root]]:!border-0 [&_[data-slot=table-root]]:!shadow-none [&_[data-slot=table-pagination]]:!px-3 [&_[data-slot=table-pagination]]:!py-2'
|
|
20
|
+
: 'gap-3', isFilterOpen ? 'xl:grid-cols-[280px_minmax(0,1fr)]' : 'xl:grid-cols-[minmax(0,1fr)]', className), children: [_jsx(RenderIf, { when: isFilterOpen, children: _jsx("aside", { className: "min-h-0 xl:self-stretch xl:[&>*]:h-full xl:[&>*]:min-h-0", children: filters }) }), _jsx("section", { className: cn('flex h-full min-h-0 flex-1 flex-col', isJoined ? 'bg-background-secondary' : 'bg-transparent'), children: _jsx(WorkspaceResultContext.Provider, { value: true, children: _jsxs(RenderCase.Root, { children: [_jsx(RenderCase.If, { when: Boolean(result && (Array.isArray(result) ? result.length > 0 : true)), children: result }), _jsx(RenderCase.Else, { children: _jsx(Card.Root, { className: "flex flex-1 items-center justify-center bg-surface/60 p-8 shadow-sm", children: _jsx(EmptyState, { title: "Nenhum resultado", description: "Ajuste os filtros e pesquise novamente." }) }) })] }) }) })] }));
|
|
21
21
|
}
|
|
22
22
|
export const Workspace = {
|
|
23
23
|
Root: WorkspaceRoot,
|
package/dist/styles.css
CHANGED
|
@@ -954,6 +954,9 @@ h2.react-datepicker__current-month {
|
|
|
954
954
|
.z-\[110\] {
|
|
955
955
|
z-index: 110;
|
|
956
956
|
}
|
|
957
|
+
.z-\[200\] {
|
|
958
|
+
z-index: 200;
|
|
959
|
+
}
|
|
957
960
|
.z-\[999\] {
|
|
958
961
|
z-index: 999;
|
|
959
962
|
}
|
|
@@ -1209,6 +1212,9 @@ h2.react-datepicker__current-month {
|
|
|
1209
1212
|
.h-56 {
|
|
1210
1213
|
height: calc(var(--spacing) * 56);
|
|
1211
1214
|
}
|
|
1215
|
+
.h-64 {
|
|
1216
|
+
height: calc(var(--spacing) * 64);
|
|
1217
|
+
}
|
|
1212
1218
|
.h-72 {
|
|
1213
1219
|
height: calc(var(--spacing) * 72);
|
|
1214
1220
|
}
|
|
@@ -1542,9 +1548,6 @@ h2.react-datepicker__current-month {
|
|
|
1542
1548
|
.min-w-\[18rem\] {
|
|
1543
1549
|
min-width: 18rem;
|
|
1544
1550
|
}
|
|
1545
|
-
.min-w-\[48rem\] {
|
|
1546
|
-
min-width: 48rem;
|
|
1547
|
-
}
|
|
1548
1551
|
.flex-1 {
|
|
1549
1552
|
flex: 1;
|
|
1550
1553
|
}
|
|
@@ -1620,12 +1623,18 @@ h2.react-datepicker__current-month {
|
|
|
1620
1623
|
.touch-none {
|
|
1621
1624
|
touch-action: none;
|
|
1622
1625
|
}
|
|
1626
|
+
.resize-none {
|
|
1627
|
+
resize: none;
|
|
1628
|
+
}
|
|
1623
1629
|
.list-disc {
|
|
1624
1630
|
list-style-type: disc;
|
|
1625
1631
|
}
|
|
1626
1632
|
.appearance-none {
|
|
1627
1633
|
appearance: none;
|
|
1628
1634
|
}
|
|
1635
|
+
.grid-cols-1 {
|
|
1636
|
+
grid-template-columns: repeat(1, minmax(0, 1fr));
|
|
1637
|
+
}
|
|
1629
1638
|
.grid-cols-2 {
|
|
1630
1639
|
grid-template-columns: repeat(2, minmax(0, 1fr));
|
|
1631
1640
|
}
|
|
@@ -4228,6 +4237,57 @@ h2.react-datepicker__current-month {
|
|
|
4228
4237
|
}
|
|
4229
4238
|
}
|
|
4230
4239
|
}
|
|
4240
|
+
.\[\&_\[data-slot\=filter-footer\]\]\:\!px-3 {
|
|
4241
|
+
& [data-slot=filter-footer] {
|
|
4242
|
+
padding-inline: calc(var(--spacing) * 3) !important;
|
|
4243
|
+
}
|
|
4244
|
+
}
|
|
4245
|
+
.\[\&_\[data-slot\=filter-footer\]\]\:\!py-2 {
|
|
4246
|
+
& [data-slot=filter-footer] {
|
|
4247
|
+
padding-block: calc(var(--spacing) * 2) !important;
|
|
4248
|
+
}
|
|
4249
|
+
}
|
|
4250
|
+
.\[\&_\[data-slot\=filter-footer\]_button\]\:\!h-8 {
|
|
4251
|
+
& [data-slot=filter-footer] button {
|
|
4252
|
+
height: calc(var(--spacing) * 8) !important;
|
|
4253
|
+
}
|
|
4254
|
+
}
|
|
4255
|
+
.\[\&_\[data-slot\=filter-footer\]_button\]\:\!min-h-8 {
|
|
4256
|
+
& [data-slot=filter-footer] button {
|
|
4257
|
+
min-height: calc(var(--spacing) * 8) !important;
|
|
4258
|
+
}
|
|
4259
|
+
}
|
|
4260
|
+
.\[\&_\[data-slot\=filter-footer\]_button\]\:\!px-2\.5 {
|
|
4261
|
+
& [data-slot=filter-footer] button {
|
|
4262
|
+
padding-inline: calc(var(--spacing) * 2.5) !important;
|
|
4263
|
+
}
|
|
4264
|
+
}
|
|
4265
|
+
.\[\&_\[data-slot\=filter-footer\]_button\]\:\!py-0 {
|
|
4266
|
+
& [data-slot=filter-footer] button {
|
|
4267
|
+
padding-block: calc(var(--spacing) * 0) !important;
|
|
4268
|
+
}
|
|
4269
|
+
}
|
|
4270
|
+
.\[\&_\[data-slot\=filter-footer\]_button\]\:\!text-xs {
|
|
4271
|
+
& [data-slot=filter-footer] button {
|
|
4272
|
+
font-size: var(--text-xs) !important;
|
|
4273
|
+
line-height: var(--tw-leading, var(--text-xs--line-height)) !important;
|
|
4274
|
+
}
|
|
4275
|
+
}
|
|
4276
|
+
.\[\&_\[data-slot\=filter-header\]\]\:\!h-10 {
|
|
4277
|
+
& [data-slot=filter-header] {
|
|
4278
|
+
height: calc(var(--spacing) * 10) !important;
|
|
4279
|
+
}
|
|
4280
|
+
}
|
|
4281
|
+
.\[\&_\[data-slot\=filter-header\]\]\:\!rounded-none {
|
|
4282
|
+
& [data-slot=filter-header] {
|
|
4283
|
+
border-radius: 0 !important;
|
|
4284
|
+
}
|
|
4285
|
+
}
|
|
4286
|
+
.\[\&_\[data-slot\=filter-header\]\]\:\!bg-background-secondary {
|
|
4287
|
+
& [data-slot=filter-header] {
|
|
4288
|
+
background-color: var(--color-background-secondary) !important;
|
|
4289
|
+
}
|
|
4290
|
+
}
|
|
4231
4291
|
.\[\&_\[data-slot\=filter-root\]\]\:rounded-none {
|
|
4232
4292
|
& [data-slot=filter-root] {
|
|
4233
4293
|
border-radius: 0;
|
|
@@ -4274,15 +4334,31 @@ h2.react-datepicker__current-month {
|
|
|
4274
4334
|
line-height: var(--tw-leading, var(--text-lg--line-height));
|
|
4275
4335
|
}
|
|
4276
4336
|
}
|
|
4277
|
-
.\[\&_\[data-slot\=table-
|
|
4337
|
+
.\[\&_\[data-slot\=table-pagination\]\]\:\!px-3 {
|
|
4338
|
+
& [data-slot=table-pagination] {
|
|
4339
|
+
padding-inline: calc(var(--spacing) * 3) !important;
|
|
4340
|
+
}
|
|
4341
|
+
}
|
|
4342
|
+
.\[\&_\[data-slot\=table-pagination\]\]\:\!py-2 {
|
|
4343
|
+
& [data-slot=table-pagination] {
|
|
4344
|
+
padding-block: calc(var(--spacing) * 2) !important;
|
|
4345
|
+
}
|
|
4346
|
+
}
|
|
4347
|
+
.\[\&_\[data-slot\=table-root\]\]\:\!rounded-none {
|
|
4278
4348
|
& [data-slot=table-root] {
|
|
4279
|
-
border-radius: 0;
|
|
4349
|
+
border-radius: 0 !important;
|
|
4280
4350
|
}
|
|
4281
4351
|
}
|
|
4282
|
-
.\[\&_\[data-slot\=table-root\]\]
|
|
4352
|
+
.\[\&_\[data-slot\=table-root\]\]\:\!border-0 {
|
|
4283
4353
|
& [data-slot=table-root] {
|
|
4284
|
-
border-style: var(--tw-border-style);
|
|
4285
|
-
border-width: 0px;
|
|
4354
|
+
border-style: var(--tw-border-style) !important;
|
|
4355
|
+
border-width: 0px !important;
|
|
4356
|
+
}
|
|
4357
|
+
}
|
|
4358
|
+
.\[\&_\[data-slot\=table-root\]\]\:\!shadow-none {
|
|
4359
|
+
& [data-slot=table-root] {
|
|
4360
|
+
--tw-shadow: 0 0 #0000 !important;
|
|
4361
|
+
box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow) !important;
|
|
4286
4362
|
}
|
|
4287
4363
|
}
|
|
4288
4364
|
.\[\&_svg\]\:size-3\.5 {
|