@sfperusacdev/sf-ui 0.1.32 → 0.1.33
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/sf-ui.css +1 -1
- package/dist/sf-ui.js +45 -45
- package/dist/sf-ui.js.map +1 -1
- package/dist/sf-ui.umd.cjs +1 -1
- package/dist/sf-ui.umd.cjs.map +1 -1
- package/dist/types/src/components/cards/KPICard.d.ts +4 -1
- package/dist/types/src/components/dashboard/DetailSidePanel.d.ts +4 -1
- package/package.json +1 -1
|
@@ -25,13 +25,16 @@ export type KPICardProps = {
|
|
|
25
25
|
/** Controla el borde superior de 3px (.sf-kpi-card). Por defecto true en "stacked" (como hoy) y false en
|
|
26
26
|
* "leading-icon" (el mockup no lo tiene). */
|
|
27
27
|
accentBar?: boolean;
|
|
28
|
+
/** Por defecto (false) el label se trunca en una línea (acabado actual). Con true se permite el salto de línea:
|
|
29
|
+
* para tarjetas angostas (5 KPI en la columna izquierda con la ficha abierta, mockup 031). */
|
|
30
|
+
labelWrap?: boolean;
|
|
28
31
|
/** Solo aplica a `layout="leading-icon"` (el tile `.sf-kpi-tile`). En "stacked" el icono va en
|
|
29
32
|
* `.sf-card-icon`, que no depende del tono, y esta prop se ignora. Por defecto "solid" = aspecto actual. */
|
|
30
33
|
iconStyle?: KPICardIconStyle;
|
|
31
34
|
className?: string;
|
|
32
35
|
onClick?: () => void;
|
|
33
36
|
};
|
|
34
|
-
export declare const KPICard: ({ label, value, sublabel, icon, iconClassName, trend, trendLabel, accentTone, progress, layout, accentBar, iconStyle, className, onClick, }: KPICardProps) => import("react").JSX.Element;
|
|
37
|
+
export declare const KPICard: ({ label, value, sublabel, icon, iconClassName, trend, trendLabel, accentTone, progress, layout, accentBar, iconStyle, labelWrap, className, onClick, }: KPICardProps) => import("react").JSX.Element;
|
|
35
38
|
type KPIGridProps = {
|
|
36
39
|
children: ReactNode;
|
|
37
40
|
cols?: 2 | 3 | 4 | 5;
|
|
@@ -18,6 +18,9 @@ export type DetailSidePanelProps = {
|
|
|
18
18
|
headerAction?: ReactNode;
|
|
19
19
|
/** Icono del bloque de identidad (tile 44px). */
|
|
20
20
|
icon?: ReactNode;
|
|
21
|
+
/** Tamaño del tile de identidad. "sm" (por defecto) = 44px, el acabado actual. "lg" = 112×84px, para una foto
|
|
22
|
+
* de la entidad (mockup 031 Vehículos). No cambia nada más del bloque. */
|
|
23
|
+
iconSize?: "sm" | "lg";
|
|
21
24
|
/** Encabezado del bloque de identidad, 18px bold — p.ej. la placa. */
|
|
22
25
|
heading: string;
|
|
23
26
|
/** Badge del bloque de identidad — p.ej. el estado operativo. */
|
|
@@ -32,4 +35,4 @@ export type DetailSidePanelProps = {
|
|
|
32
35
|
width?: number | string;
|
|
33
36
|
className?: string;
|
|
34
37
|
};
|
|
35
|
-
export declare const DetailSidePanel: ({ title, onClose, headerAction, icon, heading, badge, rows, align, actions, sectionTitle, items, width, className, }: DetailSidePanelProps) => import("react").JSX.Element;
|
|
38
|
+
export declare const DetailSidePanel: ({ title, onClose, headerAction, icon, iconSize, heading, badge, rows, align, actions, sectionTitle, items, width, className, }: DetailSidePanelProps) => import("react").JSX.Element;
|
package/package.json
CHANGED