libreria-astro-lefebvre 0.2.33 → 0.2.35

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/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "libreria-astro-lefebvre",
3
- "version": "0.2.33",
3
+ "version": "0.2.35",
4
4
  "description": "Librería de componentes Astro, React y Vue para Lefebvre",
5
5
  "author": "Equipo web desarrollo Lefebvre",
6
6
  "type": "module",
@@ -54,7 +54,7 @@ export const metadata: ComponentMetadata = {
54
54
  { name: 'name', type: 'text', help: 'Texto visible del ítem del menú principal', label: 'Texto del ítem', example_value: 'Cómo funciona' },
55
55
  { name: 'link', type: 'text', help: 'URL de destino del ítem. Debe ser la ruta completa (no se le concatena "subdirectory")', label: 'URL del ítem', example_value: '/genia-l/conoce-genia-l/' },
56
56
  { name: 'target', type: 'select', help: 'Cómo se abre el enlace: "_self" en la misma pestaña, "_blank" en una pestaña nueva', label: 'Apertura del enlace', options: ['_self', '_blank'], options_labels: ['Misma pestaña', 'Nueva pestaña'], example_value: '_self' },
57
- { name: 'featured', type: 'boolean', help: 'Muestra este ítem como el nombre del sitio (tipografía serif en negrita), junto al logo. En móvil sale de la hamburguesa. Actívalo solo en un ítem', label: 'Mostrar como marca del sitio', options: ['false', 'true'], options_labels: ['Falso', 'Verdadero'], example_value: false },
57
+ { name: 'featured', type: 'boolean', help: 'Muestra este ítem como el nombre del sitio (tipografía serif en negrita), junto al logo. En móvil sale de la hamburguesa. Si no lo tocas, se aplica al primer ítem del menú personalizado; ponlo en Falso para desactivarlo', label: 'Mostrar como marca del sitio', options: ['false', 'true'], options_labels: ['Falso', 'Verdadero'], example_value: true },
58
58
  ]
59
59
  }
60
60
  },
@@ -91,8 +91,13 @@ const categories: MenuItem[] = (categoriesProp && categoriesProp.length > 0)
91
91
 
92
92
  // El CTA se pinta dos veces (barra superior en móvil, fila del menú en escritorio); solo uno es visible a la vez.
93
93
  // Ítem marcado como "featured" (p. ej. GenIA-L): estilo "Lead/Bold". En móvil sale de la hamburguesa y va en la barra superior.
94
- // El menú por defecto no tiene ninguno; cada página decide cuál destacar.
95
- const firstItem = categories.find((c: any) => String(c.featured) === 'true');
94
+ // Gana el primero marcado explícitamente a true; si no hay ninguno, el primer ítem del menú solo si su campo está sin definir
95
+ // (con "false" se desactiva). El menú por defecto no destaca ninguno.
96
+ const hasCustomMenu = !!(categoriesProp && categoriesProp.length > 0);
97
+ const isUnset = (v: unknown) => v === undefined || v === null || v === '';
98
+ const firstItem = hasCustomMenu
99
+ ? (categories.find((c: any) => String(c.featured) === 'true') ?? (isUnset((categories[0] as any)?.featured) ? categories[0] : undefined))
100
+ : undefined;
96
101
  const firstItemClass = 'font-heading text-xl not-italic font-semibold leading-7 tracking-[-0.05px] text-[#1b1b1b] whitespace-nowrap';
97
102
  const ctaClass = 'h-12 max-[375px] px-3 md:px-5 py-3 font-body font-semibold max-[375px]:text-sm max-[375px]:leading-[21px] text-base leading-6 border-1 border-[#d71635] bg-[#d71635] text-[#ffffff] hover:border-[#71131f] hover:bg-[#71131f] transition-all duration-300 rounded-full cursor-pointer shadow-[0_2px_4px_-2px_rgba(107,58,8,0.08),0_4px_8px_-2px_rgba(107,58,8,0.04)] whitespace-nowrap';
98
103
 
@@ -100,18 +105,18 @@ const categories: MenuItem[] = (categoriesProp && categoriesProp.length > 0)
100
105
  ---
101
106
 
102
107
  <header class="sticky top-0 w-full font-body bg-[rgba(250,250,245,0.80)] backdrop-blur-lg z-50 flex flex-col justify-center align-center items-center p-0">
103
- <div class="px-4 min-[992px]:px-8 py-3 min-[992px]:py-1 w-full">
108
+ <div class="px-4 [@media(min-width:992px)]:px-8 py-3 [@media(min-width:992px)]:py-1 w-full">
104
109
 
105
- <div class="max-w-[1376px] flex items-center justify-between gap-2 mx-auto">
110
+ <div class="max-w-[1376px] flex items-center justify-between gap-2 mx-auto p-2">
106
111
  <div class="flex items-center gap-3 min-w-0">
107
112
  <a href="https://lefebvre.es" class="flex items-center shrink-0">
108
113
  <img src="https://assets.lefebvre.es/media/logos-2/svg/lefebvre.svg" class="h-7 w-auto" alt="Lefebvre" width="104" height="28" loading={loading}>
109
114
  </a>
110
115
  {firstItem && (
111
- <a href={firstItem.link} target={firstItem.target ?? '_self'} class={`${firstItemClass} min-w-0 truncate min-[992px]:hidden`}>{firstItem.name}</a>
116
+ <a href={firstItem.link} target={firstItem.target ?? '_self'} class={`${firstItemClass} min-w-0 truncate [@media(min-width:992px)]:hidden`}>{firstItem.name}</a>
112
117
  )}
113
118
  </div>
114
- <div class="flex items-center gap-2 shrink-0 min-[992px]:hidden">
119
+ <div class="flex items-center gap-2 shrink-0 [@media(min-width:992px)]:hidden">
115
120
  {label && (
116
121
  <div class="flex items-center gap-4">
117
122
  <a href={url} class={ctaClass}>{label}</a>
@@ -131,7 +136,7 @@ const categories: MenuItem[] = (categoriesProp && categoriesProp.length > 0)
131
136
 
132
137
  </div>
133
138
  </div>
134
- <nav class="hidden min-[992px]:block w-full px-8">
139
+ <nav class="hidden [@media(min-width:992px)]:block w-full px-8">
135
140
  <div class="max-w-[1376px] flex items-center gap-6 mx-auto">
136
141
  <ul class="flex items-center justify-start">
137
142
  {categories.map((category, index) => {
@@ -183,7 +188,7 @@ const categories: MenuItem[] = (categoriesProp && categoriesProp.length > 0)
183
188
  </div>
184
189
  </nav>
185
190
 
186
- <nav class="hidden min-[992px]:hidden w-full bg-white border-[#e1c8b4]" id="navbar-default">
191
+ <nav class="hidden [@media(min-width:992px)]:hidden w-full bg-white border-[#e1c8b4]" id="navbar-default">
187
192
  <div class="max-w-screen-xl flex flex-wrap items-center justify-between mx-auto">
188
193
 
189
194
  <div class="w-full">