@valcis/brand 2.0.4 → 2.0.5

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 CHANGED
@@ -21,8 +21,9 @@ import { Logo } from '@valcis/brand';
21
21
  // Completo: >valcis|
22
22
  <Logo variant="full" size={40} />
23
23
 
24
- // Animado con cursor blink
25
- <Logo variant="full" size={32} animated />
24
+ // El logo full viene animado por defecto (cursor blink)
25
+ // Para desactivarlo:
26
+ <Logo variant="full" size={32} animated={false} />
26
27
  ```
27
28
 
28
29
  ### Props
@@ -31,7 +32,7 @@ import { Logo } from '@valcis/brand';
31
32
  |------|------|---------|-------------|
32
33
  | `variant` | `'icon' \| 'full'` | `'icon'` | Variante del logo |
33
34
  | `size` | `number \| 'sm' \| 'md' \| 'lg' \| 'xl'` | `24` | Tamaño en px o preset |
34
- | `animated` | `boolean` | `false` | Animación CSS-only (respeta `prefers-reduced-motion`) |
35
+ | `animated` | `boolean` | `true` (full) / `false` (icon) | Animación CSS-only (respeta `prefers-reduced-motion`) |
35
36
  | `accentColor` | `string` | — | Color de brackets/chevron/cursor |
36
37
  | `textColor` | `string` | — | Color de letras |
37
38
  | `className` | `string` | — | Clase CSS adicional |
package/dist/index.js CHANGED
@@ -92,13 +92,14 @@ function resolveSize(size) {
92
92
  var Logo = ({
93
93
  variant = "icon",
94
94
  size = 24,
95
- animated = false,
95
+ animated,
96
96
  accentColor,
97
97
  textColor,
98
98
  className,
99
99
  style,
100
100
  ariaLabel
101
101
  }) => {
102
+ const isAnimated = animated ?? variant === "full";
102
103
  const px = resolveSize(size);
103
104
  const viewBox = VIEWBOXES[variant] ?? VIEWBOXES.icon;
104
105
  const ratio = ASPECT_RATIOS[variant] ?? ASPECT_RATIOS.icon;
@@ -107,7 +108,7 @@ var Logo = ({
107
108
  const accent = accentColor ?? "var(--valcis-logo-accent, var(--primary, currentColor))";
108
109
  const text = textColor ?? "var(--valcis-logo-text, currentColor)";
109
110
  const isDecorative = !ariaLabel;
110
- const cursorAnimation = animated && variant === "full" ? `
111
+ const cursorAnimation = isAnimated && variant === "full" ? `
111
112
  @keyframes valcis-cursor-blink {
112
113
  0%, 100% { opacity: 1; }
113
114
  50% { opacity: 0; }
@@ -116,7 +117,7 @@ var Logo = ({
116
117
  .valcis-cursor-blink { animation: valcis-cursor-blink 1s step-end infinite; }
117
118
  }
118
119
  ` : void 0;
119
- const pulseAnimation = animated && variant === "icon" ? `
120
+ const pulseAnimation = isAnimated && variant === "icon" ? `
120
121
  @keyframes valcis-logo-pulse {
121
122
  0%, 100% { opacity: 1; }
122
123
  50% { opacity: 0.6; }
@@ -136,7 +137,7 @@ var Logo = ({
136
137
  fill: "none",
137
138
  width,
138
139
  height,
139
- className: [animated && variant === "icon" ? "valcis-logo-animated" : "", className].filter(Boolean).join(" ") || void 0,
140
+ className: [isAnimated && variant === "icon" ? "valcis-logo-animated" : "", className].filter(Boolean).join(" ") || void 0,
140
141
  style,
141
142
  role: "img",
142
143
  "aria-hidden": isDecorative ? true : void 0,
@@ -160,7 +161,7 @@ var Logo = ({
160
161
  {
161
162
  d: CURSOR_PATH,
162
163
  fill: accent,
163
- className: animated ? "valcis-cursor-blink" : void 0
164
+ className: isAnimated ? "valcis-cursor-blink" : void 0
164
165
  }
165
166
  ) })
166
167
  ] })
package/dist/index.mjs CHANGED
@@ -34,13 +34,14 @@ function resolveSize(size) {
34
34
  var Logo = ({
35
35
  variant = "icon",
36
36
  size = 24,
37
- animated = false,
37
+ animated,
38
38
  accentColor,
39
39
  textColor,
40
40
  className,
41
41
  style,
42
42
  ariaLabel
43
43
  }) => {
44
+ const isAnimated = animated ?? variant === "full";
44
45
  const px = resolveSize(size);
45
46
  const viewBox = VIEWBOXES[variant] ?? VIEWBOXES.icon;
46
47
  const ratio = ASPECT_RATIOS[variant] ?? ASPECT_RATIOS.icon;
@@ -49,7 +50,7 @@ var Logo = ({
49
50
  const accent = accentColor ?? "var(--valcis-logo-accent, var(--primary, currentColor))";
50
51
  const text = textColor ?? "var(--valcis-logo-text, currentColor)";
51
52
  const isDecorative = !ariaLabel;
52
- const cursorAnimation = animated && variant === "full" ? `
53
+ const cursorAnimation = isAnimated && variant === "full" ? `
53
54
  @keyframes valcis-cursor-blink {
54
55
  0%, 100% { opacity: 1; }
55
56
  50% { opacity: 0; }
@@ -58,7 +59,7 @@ var Logo = ({
58
59
  .valcis-cursor-blink { animation: valcis-cursor-blink 1s step-end infinite; }
59
60
  }
60
61
  ` : void 0;
61
- const pulseAnimation = animated && variant === "icon" ? `
62
+ const pulseAnimation = isAnimated && variant === "icon" ? `
62
63
  @keyframes valcis-logo-pulse {
63
64
  0%, 100% { opacity: 1; }
64
65
  50% { opacity: 0.6; }
@@ -78,7 +79,7 @@ var Logo = ({
78
79
  fill: "none",
79
80
  width,
80
81
  height,
81
- className: [animated && variant === "icon" ? "valcis-logo-animated" : "", className].filter(Boolean).join(" ") || void 0,
82
+ className: [isAnimated && variant === "icon" ? "valcis-logo-animated" : "", className].filter(Boolean).join(" ") || void 0,
82
83
  style,
83
84
  role: "img",
84
85
  "aria-hidden": isDecorative ? true : void 0,
@@ -102,7 +103,7 @@ var Logo = ({
102
103
  {
103
104
  d: CURSOR_PATH,
104
105
  fill: accent,
105
- className: animated ? "valcis-cursor-blink" : void 0
106
+ className: isAnimated ? "valcis-cursor-blink" : void 0
106
107
  }
107
108
  ) })
108
109
  ] })
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@valcis/brand",
3
- "version": "2.0.4",
3
+ "version": "2.0.5",
4
4
  "description": "Componentes de marca valcis: Logo SVG y Footer React con soporte SSR",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.mjs",