@lacspace/logo 1.1.0 → 1.2.0

package/dist/index.d.cts

@@ -143,6 +143,17 @@ declare function generateFavicon(brief: LogoBrief, sizes?: number[]): FaviconSet
 /** From one brief → a full, consistent brand identity. */
 declare function generateBrandKit(brief: LogoBrief): BrandKit;
 
+interface AnimateOptions {
+    /** Total reveal duration in ms (default 1500). */
+    duration?: number;
+    /** Loop forever instead of playing once (default false). */
+    loop?: boolean;
+    /** Add the sweeping shimmer highlight (default true). */
+    shimmer?: boolean;
+}
+/** Wrap a logo (a LogoResult or a brief) in an embedded CSS reveal animation. */
+declare function animateLogo(input: LogoResult | LogoBrief, opts?: AnimateOptions): string;
+
 /** Normalise keywords + brief text into a clean token list. */
 declare function tokenize(brief: LogoBrief): string[];
 
@@ -154,4 +165,4 @@ declare const MOODS: Mood[];
 /** Derive a compact monogram (1–3 letters) from a brand name. */
 declare function initials(name: string, max?: number): string;
 
-export { type Background, type BrandColor, type BrandKit, type Engine, FONTS, type FaviconSet, type FontPair, ICONS, type IconDef, type Interpreted, type Layout, type LogoBrief, type LogoResult, MOODS, type Mood, PALETTES, type Palette, type ShapeKind, generateBrandKit, generateFavicon, generateLogo, generateLogoSet, initials, suggest, tokenize };
+export { type AnimateOptions, type Background, type BrandColor, type BrandKit, type Engine, FONTS, type FaviconSet, type FontPair, ICONS, type IconDef, type Interpreted, type Layout, type LogoBrief, type LogoResult, MOODS, type Mood, PALETTES, type Palette, type ShapeKind, animateLogo, generateBrandKit, generateFavicon, generateLogo, generateLogoSet, initials, suggest, tokenize };

package/dist/index.d.ts

@@ -143,6 +143,17 @@ declare function generateFavicon(brief: LogoBrief, sizes?: number[]): FaviconSet
 /** From one brief → a full, consistent brand identity. */
 declare function generateBrandKit(brief: LogoBrief): BrandKit;
 
+interface AnimateOptions {
+    /** Total reveal duration in ms (default 1500). */
+    duration?: number;
+    /** Loop forever instead of playing once (default false). */
+    loop?: boolean;
+    /** Add the sweeping shimmer highlight (default true). */
+    shimmer?: boolean;
+}
+/** Wrap a logo (a LogoResult or a brief) in an embedded CSS reveal animation. */
+declare function animateLogo(input: LogoResult | LogoBrief, opts?: AnimateOptions): string;
+
 /** Normalise keywords + brief text into a clean token list. */
 declare function tokenize(brief: LogoBrief): string[];
 
@@ -154,4 +165,4 @@ declare const MOODS: Mood[];
 /** Derive a compact monogram (1–3 letters) from a brand name. */
 declare function initials(name: string, max?: number): string;
 
-export { type Background, type BrandColor, type BrandKit, type Engine, FONTS, type FaviconSet, type FontPair, ICONS, type IconDef, type Interpreted, type Layout, type LogoBrief, type LogoResult, MOODS, type Mood, PALETTES, type Palette, type ShapeKind, generateBrandKit, generateFavicon, generateLogo, generateLogoSet, initials, suggest, tokenize };
+export { type AnimateOptions, type Background, type BrandColor, type BrandKit, type Engine, FONTS, type FaviconSet, type FontPair, ICONS, type IconDef, type Interpreted, type Layout, type LogoBrief, type LogoResult, MOODS, type Mood, PALETTES, type Palette, type ShapeKind, animateLogo, generateBrandKit, generateFavicon, generateLogo, generateLogoSet, initials, suggest, tokenize };

package/dist/index.js

@@ -128,7 +128,19 @@ var icons_default = [
   { key: "shirt", keywords: ["fashion", "clothing", "apparel", "boutique", "retail", "tshirt", "wear", "style"], svg: "<path d='M8 4 L4 7 L6 10 L8 9 V20 H16 V9 L18 10 L20 7 L16 4 C16 6 8 6 8 4 Z'/>" },
   { key: "balloon", keywords: ["kids", "party", "toy", "children", "fun", "celebration", "birthday", "playful"], svg: "<path d='M12 3 A5 6 0 0 0 12 15 A5 6 0 0 0 12 3 Z'/><path d='M12 15 V17 M11 17 C11 19 13 19 13 21'/>" },
   { key: "palette-art", keywords: ["art", "design", "paint", "creative", "color", "artist", "gallery", "illustration"], svg: "<path d='M12 3 A9 9 0 1 0 12 21 A2 2 0 0 0 12 17 A2 2 0 0 1 14 15 H16 A5 5 0 0 0 21 10 C21 6 17 3 12 3 Z'/><circle cx='8' cy='9' r='1'/><circle cx='12' cy='7' r='1'/><circle cx='16' cy='9' r='1'/>" },
-  { key: "wheat", keywords: ["agriculture", "farm", "organic", "grain", "harvest", "crop", "wheat", "rural"], svg: "<path d='M12 21 V9 M12 9 C10 9 9 7 9 5 C11 5 12 7 12 9 C12 7 13 5 15 5 C15 7 14 9 12 9 M12 13 C10 13 9 11 9 9 M12 13 C14 13 15 11 15 9 M12 17 C10 17 9 15 9 13 M12 17 C14 17 15 15 15 13'/>" }
+  { key: "wheat", keywords: ["agriculture", "farm", "organic", "grain", "harvest", "crop", "wheat", "rural"], svg: "<path d='M12 21 V9 M12 9 C10 9 9 7 9 5 C11 5 12 7 12 9 C12 7 13 5 15 5 C15 7 14 9 12 9 M12 13 C10 13 9 11 9 9 M12 13 C14 13 15 11 15 9 M12 17 C10 17 9 15 9 13 M12 17 C14 17 15 15 15 13'/>" },
+  { key: "umbrella", keywords: ["insurance", "protection", "weather", "umbrella", "coverage", "safe", "shelter"], svg: "<path d='M12 3 A9 6 0 0 1 21 9 H3 A9 6 0 0 1 12 3 Z'/><path d='M12 9 V19 A2 2 0 0 1 8 19'/>" },
+  { key: "tooth", keywords: ["dental", "dentist", "tooth", "orthodontics", "oral", "clinic", "smile"], svg: "<path d='M12 3 C8 3 6 5 6 8 C6 12 7 21 9 21 C10.5 21 10 15 12 15 C14 15 13.5 21 15 21 C17 21 18 12 18 8 C18 5 16 3 12 3 Z'/>" },
+  { key: "glasses", keywords: ["optometry", "eyewear", "glasses", "vision", "optical", "fashion", "sunglasses"], svg: "<circle cx='6' cy='13' r='3'/><circle cx='18' cy='13' r='3'/><path d='M9 13 H15 M3 11 L5 8 H8 M21 11 L19 8 H16'/>" },
+  { key: "headphones", keywords: ["audio", "dj", "music", "headphones", "support", "sound", "gaming", "helpdesk"], svg: "<path d='M4 14 V12 A8 8 0 0 1 20 12 V14'/><rect x='3' y='14' width='3' height='5' rx='1.2'/><rect x='18' y='14' width='3' height='5' rx='1.2'/>" },
+  { key: "microphone", keywords: ["podcast", "audio", "voice", "media", "microphone", "recording", "radio", "singer"], svg: "<rect x='9' y='3' width='6' height='11' rx='3'/><path d='M6 11 A6 6 0 0 0 18 11 M12 17 V21 M9 21 H15'/>" },
+  { key: "hardhat", keywords: ["construction", "build", "contractor", "hardhat", "engineering", "safety", "builder"], svg: "<path d='M4 16 A8 8 0 0 1 20 16 Z'/><path d='M10 8 V4 H14 V8 M2 16 H22'/>" },
+  { key: "people", keywords: ["team", "hr", "community", "people", "agency", "group", "social", "recruiting", "network"], svg: "<circle cx='8' cy='8' r='3'/><circle cx='16' cy='8' r='3'/><path d='M3 20 C3 15 6 14 8 14 C10 14 13 15 13 20 M11 20 C11 16 14 14 16 14 C18 14 21 15 21 20'/>" },
+  { key: "gem", keywords: ["jewelry", "luxury", "gem", "diamond", "premium", "beauty", "boutique", "crystal"], svg: "<path d='M6 3 H18 L22 9 L12 21 L2 9 Z'/><path d='M2 9 H22 M6 3 L9 9 M18 3 L15 9 M9 9 L12 21 L15 9'/>" },
+  { key: "anchor", keywords: ["marine", "nautical", "anchor", "travel", "boat", "sea", "harbor", "shipping"], svg: "<circle cx='12' cy='5' r='2'/><path d='M12 7 V21 M5 13 A7 7 0 0 0 19 13 M8 10 H16'/>" },
+  { key: "compass", keywords: ["travel", "navigation", "compass", "adventure", "explore", "direction", "outdoor", "guide"], svg: "<circle cx='12' cy='12' r='9'/><path d='M15 9 L11 11 L9 15 L13 13 Z'/>" },
+  { key: "spray", keywords: ["cleaning", "service", "spray", "hygiene", "sanitize", "laundry", "housekeeping"], svg: "<rect x='7' y='8' width='6' height='12' rx='1'/><path d='M8 8 V5 H12 V8 M13 6 H16 M13 4 H16 M13 8 H16'/>" },
+  { key: "battery", keywords: ["energy", "power", "battery", "ev", "charge", "electric", "tech", "solar"], svg: "<rect x='3' y='8' width='16' height='8' rx='2'/><path d='M21 11 V13 M6 11 V13 M9 11 V13 M12 11 V13'/>" }
 ];
 
 // src/data/moods.json
@@ -844,6 +856,23 @@ function generateBrandKit(brief) {
   };
 }
 
-export { FONTS, ICONS, MOODS, PALETTES, generateBrandKit, generateFavicon, generateLogo, generateLogoSet, initials, suggest, tokenize };
+// src/animate.ts
+function animateLogo(input, opts = {}) {
+  const result = "svg" in input ? input : generateLogo(input);
+  const w = result.width;
+  const h = result.height;
+  const dur = opts.duration ?? 1500;
+  const iter = opts.loop ? "infinite" : "1";
+  const shimmer = opts.shimmer !== false;
+  const style = `<style>@keyframes lac-in{0%{opacity:0;transform:scale(.9)}60%{opacity:1}100%{opacity:1;transform:scale(1)}}@keyframes lac-wipe{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}@keyframes lac-shim{0%{transform:translateX(${(-w * 0.6).toFixed(0)}px) skewX(-16deg)}55%{transform:translateX(${(w * 1.2).toFixed(0)}px) skewX(-16deg)}100%{transform:translateX(${(w * 1.2).toFixed(0)}px) skewX(-16deg)}}.lac-root{transform-origin:50% 50%;animation:lac-in ${dur}ms cubic-bezier(.2,.75,.2,1) ${iter} both,lac-wipe ${Math.round(dur * 0.7)}ms cubic-bezier(.4,0,.2,1) ${iter} both}.lac-shim{animation:lac-shim ${Math.round(dur * 1.25)}ms ease ${iter} both;mix-blend-mode:overlay}@media(prefers-reduced-motion:reduce){.lac-root{animation:none;clip-path:none}.lac-shim{display:none}}</style>`;
+  const shimDefs = shimmer ? `<linearGradient id="lac-shim-g" x1="0" y1="0" x2="1" y2="0"><stop offset="0" stop-color="#fff" stop-opacity="0"/><stop offset=".5" stop-color="#fff" stop-opacity=".55"/><stop offset="1" stop-color="#fff" stop-opacity="0"/></linearGradient>` : "";
+  const shimRect = shimmer ? `<rect class="lac-shim" x="0" y="0" width="${(w * 0.4).toFixed(0)}" height="${h}" fill="url(#lac-shim-g)"/>` : "";
+  let svg = result.svg.replace(/^<svg /, `<svg class="lac-root" `);
+  svg = svg.replace(/(<svg\b[^>]*>)/, `$1${style}<defs>${shimDefs}</defs>`);
+  svg = svg.replace(/<\/svg>\s*$/, `${shimRect}</svg>`);
+  return svg;
+}
+
+export { FONTS, ICONS, MOODS, PALETTES, animateLogo, generateBrandKit, generateFavicon, generateLogo, generateLogoSet, initials, suggest, tokenize };
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map