@studiolxd/brand 49.13.0 → 49.15.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/CHANGELOG.md +36 -0
- package/dist/_shared/tokens.js +10 -11
- package/dist/_types/molecules/SearchForm/SearchForm.d.ts +13 -0
- package/dist/_types/molecules/TreeView/TreeView.d.ts +7 -1
- package/dist/_types/organisms/SiteSearch/SiteSearch.d.ts +6 -5
- package/dist/brand.css +19 -18
- package/dist/search-form.js +30 -24
- package/dist/site-search.css +1 -1
- package/dist/site-search.js +17 -37
- package/dist/tokens.css +19 -18
- package/dist/tree-view.css +1 -1
- package/dist/tree-view.js +54 -53
- package/package.json +1 -1
- package/src/tokens/molecules/site-search.css +11 -13
- package/src/tokens/scss/molecules/_site-search.scss +11 -12
- package/src/tokens/surface-invert.css +0 -1
- package/src/tokens/surface-light.css +0 -1
- package/src/tokens/surface-public.css +7 -2
- package/src/tokens/tokens.json +10 -11
package/CHANGELOG.md
CHANGED
|
@@ -7,6 +7,42 @@ El paquete sigue [semver](https://semver.org/lang/es/): **patch** para bug fixes
|
|
|
7
7
|
regeneración de `dist`, **minor** para componentes/props/variantes/tokens nuevos, **major**
|
|
8
8
|
para breaking changes.
|
|
9
9
|
|
|
10
|
+
## [49.15.0] — 2026-10-02
|
|
11
|
+
|
|
12
|
+
> **Minor.** El árbol de carpetas de creator, más limpio: sin chevron cuando la marca ya
|
|
13
|
+
> dice si la carpeta está abierta, y destinos de arrastre a todo el ancho.
|
|
14
|
+
|
|
15
|
+
### `TreeView` — lo que cambia
|
|
16
|
+
|
|
17
|
+
**Nueva prop `chevron`** (por defecto `true`). Con `chevron={false}` no se pinta ni el
|
|
18
|
+
chevron ni su ranura: solo queda la marca (`icon`/`iconExpanded`), que ocupa su ranura
|
|
19
|
+
fija, así que hojas y ramas siguen alineadas. El clic en la fila sigue abriendo y
|
|
20
|
+
cerrando, y el teclado no cambia.
|
|
21
|
+
|
|
22
|
+
**La sangría pasa de margen del grupo a `padding` de la fila.** Todas las filas miden
|
|
23
|
+
el ancho del árbol en cualquier nivel: el destino de arrastre, la selección y el anillo
|
|
24
|
+
de foco ya no encogen al bajar. Rótulo y marca quedan exactamente donde estaban.
|
|
25
|
+
|
|
26
|
+
## [49.14.0] — 2026-09-20
|
|
27
|
+
|
|
28
|
+
> **Minor.** El buscador, repasado con la página real delante. Seis cambios pedidos por
|
|
29
|
+
> quien lo iba a usar después de verlo en producción, que es cuando se ven las cosas.
|
|
30
|
+
|
|
31
|
+
### `SiteSearch` — lo que cambia
|
|
32
|
+
|
|
33
|
+
Ocupa el ancho de su contenedor y ya no se encoge dentro de una fila flexible o una
|
|
34
|
+
celda de retícula. Entre resultados hay aire de verdad, 32 píxeles, y dentro de cada
|
|
35
|
+
uno 8. **Fuera la línea separadora**: la separación la hace el espacio.
|
|
36
|
+
|
|
37
|
+
El título de cada resultado ya era un `h2`, pero leía al cuerpo de texto y no se
|
|
38
|
+
distinguía; ahora sube un peldaño y lleva interlineado de título. El rastro de
|
|
39
|
+
sección, el extracto y la dirección usan el cuerpo de las páginas públicas.
|
|
40
|
+
|
|
41
|
+
**El campo pasa a ser `SearchForm`**, el mismo del menú, no una copia de su CSS: la
|
|
42
|
+
flecha vive dentro del borde y no hay botón aparte. `SearchForm` gana `className`,
|
|
43
|
+
`describedBy` y `controls`, que no cambian su dibujo. Como consecuencia buscada, el
|
|
44
|
+
campo de la página y el del menú ya no pueden separarse.
|
|
45
|
+
|
|
10
46
|
## [49.13.0] — 2026-09-19
|
|
11
47
|
|
|
12
48
|
> **Minor.** El buscador del sitio. Existían el campo del menú y el autocompletar de la
|
package/dist/_shared/tokens.js
CHANGED
|
@@ -3404,30 +3404,29 @@ var e = {
|
|
|
3404
3404
|
"--planning-grid-pending-opacity": "0.4",
|
|
3405
3405
|
"--public-page-shell-preferences-padding-block": "1.5rem",
|
|
3406
3406
|
"--public-page-shell-preferences-gap": "0.75rem",
|
|
3407
|
+
"--site-search-inline-size": "100%",
|
|
3407
3408
|
"--site-search-gap": "1.5rem",
|
|
3408
|
-
"--site-search-form-gap": "0.5rem",
|
|
3409
|
-
"--site-search-field-basis": "12rem",
|
|
3410
3409
|
"--site-search-block-gap": "0.75rem",
|
|
3411
3410
|
"--site-search-status-font-size": "0.875rem",
|
|
3412
3411
|
"--site-search-status-line-height": "1.5",
|
|
3413
3412
|
"--site-search-status-color": "#4a4a4a",
|
|
3414
3413
|
"--site-search-status-gap": "0.5rem",
|
|
3415
3414
|
"--site-search-status-query-font-weight": "500",
|
|
3416
|
-
"--site-search-results-gap": "
|
|
3417
|
-
"--site-search-result-gap": "0.
|
|
3418
|
-
"--site-search-result-
|
|
3419
|
-
"--site-search-result-
|
|
3420
|
-
"--site-search-result-separator-width": "1px",
|
|
3421
|
-
"--site-search-result-title-font-size": "1rem",
|
|
3415
|
+
"--site-search-results-gap": "2rem",
|
|
3416
|
+
"--site-search-result-gap": "0.5rem",
|
|
3417
|
+
"--site-search-result-title-font-size": "1.25rem",
|
|
3418
|
+
"--site-search-result-title-line-height": "1.3",
|
|
3422
3419
|
"--site-search-result-title-font-weight": "500",
|
|
3423
3420
|
"--site-search-result-title-color": "#111e30",
|
|
3424
|
-
"--site-search-result-section-font-size": "
|
|
3421
|
+
"--site-search-result-section-font-size": "1rem",
|
|
3422
|
+
"--site-search-result-section-line-height": "1.5",
|
|
3425
3423
|
"--site-search-result-section-color": "#4a4a4a",
|
|
3426
|
-
"--site-search-result-excerpt-font-size": "
|
|
3424
|
+
"--site-search-result-excerpt-font-size": "1rem",
|
|
3427
3425
|
"--site-search-result-excerpt-line-height": "1.5",
|
|
3428
3426
|
"--site-search-result-excerpt-color": "#111e30",
|
|
3429
3427
|
"--site-search-result-measure": "70ch",
|
|
3430
|
-
"--site-search-result-url-font-size": "
|
|
3428
|
+
"--site-search-result-url-font-size": "1rem",
|
|
3429
|
+
"--site-search-result-url-line-height": "1.5",
|
|
3431
3430
|
"--site-search-result-url-color": "#4a4a4a",
|
|
3432
3431
|
"--site-search-result-link-hover-line-width": "1px",
|
|
3433
3432
|
"--site-search-result-link-hover-line-offset": "0.25rem",
|
|
@@ -15,6 +15,8 @@ export interface SearchFormMessages {
|
|
|
15
15
|
export interface SearchFormProps {
|
|
16
16
|
/** `id` del campo. Si no se pasa, el componente genera uno estable. */
|
|
17
17
|
id?: string;
|
|
18
|
+
/** Clase del `<form>`, para que quien lo monte lo coloque en su retícula. */
|
|
19
|
+
className?: string;
|
|
18
20
|
/**
|
|
19
21
|
* Nombre del parámetro con el que viaja la consulta en el envío sin JS.
|
|
20
22
|
* @default 'q'
|
|
@@ -67,6 +69,17 @@ export interface SearchFormProps {
|
|
|
67
69
|
size?: 'sm' | 'md' | 'lg' | 'xl';
|
|
68
70
|
/** Deshabilita el campo y el botón. */
|
|
69
71
|
disabled?: boolean;
|
|
72
|
+
/**
|
|
73
|
+
* `id` de lo que describe al campo: el aviso vivo de una página de
|
|
74
|
+
* resultados («23 resultados para «factura»»). El campo lo referencia con
|
|
75
|
+
* `aria-describedby`.
|
|
76
|
+
*/
|
|
77
|
+
describedBy?: string;
|
|
78
|
+
/**
|
|
79
|
+
* `id` de la región que el campo gobierna: la lista de resultados que
|
|
80
|
+
* cambia al buscar. El campo lo referencia con `aria-controls`.
|
|
81
|
+
*/
|
|
82
|
+
controls?: string;
|
|
70
83
|
}
|
|
71
84
|
/**
|
|
72
85
|
* Buscador de sitio: un campo y un botón de envío que llevan a una página de
|
|
@@ -81,6 +81,12 @@ export interface TreeViewProps extends Omit<React.ComponentPropsWithoutRef<'ul'>
|
|
|
81
81
|
* No cambia el marcado: la fila sigue siendo el `role="treeitem"`.
|
|
82
82
|
*/
|
|
83
83
|
nodeRef?: (id: string, el: HTMLElement | null) => void;
|
|
84
|
+
/**
|
|
85
|
+
* Pinta el chevron (y su ranura) en las ramas. Con `false` solo queda la
|
|
86
|
+
* marca (`icon`), que ocupa su propia ranura fija: hojas y ramas siguen
|
|
87
|
+
* alineadas. Default: `true`.
|
|
88
|
+
*/
|
|
89
|
+
chevron?: boolean;
|
|
84
90
|
/** Se añade DESPUÉS de las clases propias. */
|
|
85
91
|
className?: string;
|
|
86
92
|
}
|
|
@@ -99,4 +105,4 @@ export interface TreeViewProps extends Omit<React.ComponentPropsWithoutRef<'ul'>
|
|
|
99
105
|
* para el único estado que sí lo pide: la carpeta que puede recibir lo que se
|
|
100
106
|
* está arrastrando (`dropTarget`).
|
|
101
107
|
*/
|
|
102
|
-
export declare function TreeView({ items, expanded: expandedProp, defaultExpanded, onExpandedChange, selected: selectedProp, defaultSelected, onSelectedChange, label, truncateFromLevel, nodeRef, className, ...rest }: TreeViewProps): import("react/jsx-runtime").JSX.Element;
|
|
108
|
+
export declare function TreeView({ items, expanded: expandedProp, defaultExpanded, onExpandedChange, selected: selectedProp, defaultSelected, onSelectedChange, label, truncateFromLevel, nodeRef, chevron, className, ...rest }: TreeViewProps): import("react/jsx-runtime").JSX.Element;
|
|
@@ -43,15 +43,16 @@ export type SiteSearchRenderLinkProps = ComponentPropsWithoutRef<'a'> & {
|
|
|
43
43
|
* hay nada. Los resultados no están aquí — son datos que llegan por
|
|
44
44
|
* `results`.
|
|
45
45
|
*
|
|
46
|
-
* El
|
|
47
|
-
*
|
|
46
|
+
* El campo es el `SearchForm` del menú del sitio, así que el buscador no
|
|
47
|
+
* emite ningún texto más: la flecha de envío se nombra con `submit`, y su
|
|
48
|
+
* rótulo ya no se ve — es el nombre accesible del adorno dentro del campo.
|
|
48
49
|
*/
|
|
49
50
|
export interface SiteSearchMessages {
|
|
50
51
|
/** Etiqueta del campo, que nombra también la región de búsqueda. */
|
|
51
52
|
label: string;
|
|
52
53
|
/** Pista dentro del campo. */
|
|
53
54
|
placeholder: string;
|
|
54
|
-
/**
|
|
55
|
+
/** Nombre accesible de la flecha de envío, dentro del campo. */
|
|
55
56
|
submit: string;
|
|
56
57
|
/** Lo que se dice antes de la primera búsqueda. */
|
|
57
58
|
idle: string;
|
|
@@ -129,7 +130,7 @@ export interface SiteSearchProps extends Omit<ComponentPropsWithoutRef<'div'>, '
|
|
|
129
130
|
footer?: ReactNode;
|
|
130
131
|
/** Nivel del título de cada resultado. @default 2 */
|
|
131
132
|
headingLevel?: HeadingLevel;
|
|
132
|
-
/** Talla del campo y
|
|
133
|
+
/** Talla del campo y de su flecha. */
|
|
133
134
|
size?: 'sm' | 'md' | 'lg';
|
|
134
135
|
/** Cuántos resultados fantasma se pintan durante la carga. @default 3 */
|
|
135
136
|
loadingRows?: number;
|
|
@@ -146,7 +147,7 @@ export interface SiteSearchProps extends Omit<ComponentPropsWithoutRef<'div'>, '
|
|
|
146
147
|
labelHidden?: boolean;
|
|
147
148
|
/** Pista dentro del campo. Sin ella, sale de `siteSearch.placeholder`. */
|
|
148
149
|
placeholder?: string;
|
|
149
|
-
/**
|
|
150
|
+
/** Nombre accesible de la flecha de envío. Sin él, sale de `siteSearch.submit`. */
|
|
150
151
|
submitLabel?: string;
|
|
151
152
|
/** Nombre accesible de la lista. Sin él, sale de `siteSearch.resultsLabel`. */
|
|
152
153
|
resultsLabel?: string;
|