@tessera-ui/core 0.4.1 → 0.5.0

package/dist/tessera-ui/p-StBQmS8h.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"p-StBQmS8h.js","sources":["src/components/icon/icon-registry.ts","src/components/icon/icon.css?tag=ts-icon&encapsulation=shadow","src/components/icon/icon.tsx"],"sourcesContent":["/**\n * Icon Registry\n *\n * A global registry for SVG icon strings. Components look up icons by name\n * from this registry. Works with any icon library — register SVG strings\n * directly or use the Lucide helper (`registerLucideIcons`).\n */\n\nconst registry = new Map<string, string>();\n\n/**\n * Register multiple icons at once.\n * @param icons - A map of icon name to SVG string.\n */\nexport function registerIcons(icons: Record<string, string>): void {\n  for (const [name, svg] of Object.entries(icons)) {\n    registry.set(name, svg);\n  }\n}\n\n/**\n * Register a single icon.\n * @param name - The icon name used in `<ts-icon name=\"...\">`.\n * @param svg  - The full SVG markup string.\n */\nexport function registerIcon(name: string, svg: string): void {\n  registry.set(name, svg);\n}\n\n/**\n * Retrieve an icon's SVG string by name.\n * @returns The SVG string, or `undefined` if the icon is not registered.\n */\nexport function getIcon(name: string): string | undefined {\n  return registry.get(name);\n}\n\n/**\n * List all registered icon names.\n */\nexport function getRegisteredIconNames(): string[] {\n  return Array.from(registry.keys());\n}\n","/* ==========================================================================\n   ts-icon — Shadow DOM Scoped Styles\n\n   Component tokens (Tier 3):\n     --ts-icon-size    Width & height of the icon\n     --ts-icon-color   Fill / stroke color\n   ========================================================================== */\n\n:host {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  vertical-align: middle;\n\n  --ts-icon-size: 1em;\n  --ts-icon-color: currentColor;\n\n  width: var(--ts-icon-size);\n  height: var(--ts-icon-size);\n  color: var(--ts-icon-color);\n  line-height: 0;\n}\n\n/* ---- Sizes ---- */\n:host([size=\"xs\"]) { --ts-icon-size: 12px; }\n:host([size=\"sm\"]) { --ts-icon-size: 14px; }\n:host([size=\"md\"]) { --ts-icon-size: 16px; }\n:host([size=\"lg\"]) { --ts-icon-size: 18px; }\n:host([size=\"xl\"]) { --ts-icon-size: 20px; }\n\n/* ---- Slotted SVG ---- */\n::slotted(svg) {\n  width: 100%;\n  height: 100%;\n  fill: currentColor;\n}\n\n/* ---- Registry SVG ---- */\nspan {\n  display: contents;\n}\n\nspan > svg {\n  width: 100%;\n  height: 100%;\n  fill: none;\n  stroke: currentColor;\n}\n\n/* ---- External image ---- */\nimg {\n  width: 100%;\n  height: 100%;\n}\n","import { Component, Prop, h, Host, Element, Watch, State } from '@stencil/core';\nimport type { TsSize } from '../../types';\nimport { getIcon } from './icon-registry';\n\ntype LucideNode = [string, Record<string, string>][];\n\n/** Cached reference to the Lucide icons map — loaded lazily on first use. */\nlet lucideCache: Record<string, LucideNode> | null = null;\n\n/**\n * Converts a PascalCase or kebab-case icon name to the PascalCase key used by Lucide.\n * e.g. \"search\" → \"Search\", \"arrow-left\" → \"ArrowLeft\"\n */\nfunction toLucideKey(name: string): string {\n  return name\n    .split('-')\n    .map((part: string) => part.charAt(0).toUpperCase() + part.slice(1))\n    .join('');\n}\n\n/**\n * Renders a Lucide icon node array to an SVG string.\n */\nfunction renderLucideSvg(nodes: LucideNode): string {\n  const children = nodes\n    .map(([tag, attrs]: [string, Record<string, string>]) => {\n      const attrStr = Object.entries(attrs)\n        .map(([k, v]: [string, string]) => `${k}=\"${v}\"`)\n        .join(' ');\n      return `<${tag} ${attrStr}/>`;\n    })\n    .join('');\n  return `<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"100%\" height=\"100%\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">${children}</svg>`;\n}\n\n/**\n * @slot - Default slot for inline SVG content.\n *\n * @part img - The img element (when using src prop).\n * @part svg - The container for resolved SVG content (when using name prop).\n */\n@Component({\n  tag: 'ts-icon',\n  styleUrl: 'icon.css',\n  shadow: true,\n})\nexport class TsIcon {\n  @Element() el!: HTMLElement;\n\n  /** Icon name — resolves from custom registry first, then built-in Lucide icons. Accepts kebab-case or PascalCase. */\n  @Prop({ reflect: true }) name?: string;\n\n  /** URL to an external SVG icon file. */\n  @Prop() src?: string;\n\n  /** The icon's size. */\n  @Prop({ reflect: true }) size: TsSize = 'md';\n\n  /** Accessible label. When set, applies role=\"img\" and aria-label. When absent, sets aria-hidden=\"true\". */\n  @Prop() label?: string;\n\n  /** CSS color value applied to the icon. */\n  @Prop({ reflect: true }) color: string = 'currentColor';\n\n  @State() private svgContent?: string;\n\n  @Watch('name')\n  nameChanged(): void {\n    this.loadIcon();\n  }\n\n  componentWillLoad(): void {\n    return this.loadIcon() as unknown as void;\n  }\n\n  /**\n   * Checks whether built-in Lucide icons are disabled via data-icons=\"none\"\n   * on any ancestor element.\n   */\n  private isBuiltInDisabled(): boolean {\n    return this.el.closest('[data-icons=\"none\"]') !== null;\n  }\n\n  private async loadIcon(): Promise<void> {\n    if (this.name && !this.src) {\n      // 1. Check custom registry first (allows overrides)\n      const registered = getIcon(this.name);\n      if (registered) {\n        this.svgContent = registered;\n        return;\n      }\n\n      // 2. If built-in icons are disabled via data-icons=\"none\", stop here\n      if (this.isBuiltInDisabled()) {\n        this.svgContent = undefined;\n        return;\n      }\n\n      // 3. Lazy-load Lucide icons (only fetched on first name lookup)\n      if (!lucideCache) {\n        try {\n          // eslint-disable-next-line @typescript-eslint/no-explicit-any\n          const mod: { icons: Record<string, LucideNode> } = await import('lucide') as any;\n          lucideCache = mod.icons;\n        } catch {\n          this.svgContent = undefined;\n          return;\n        }\n      }\n\n      const key = toLucideKey(this.name);\n      const lucideIcon = lucideCache[key];\n      if (lucideIcon) {\n        this.svgContent = renderLucideSvg(lucideIcon);\n        return;\n      }\n\n      this.svgContent = undefined;\n    } else {\n      this.svgContent = undefined;\n    }\n  }\n\n  // eslint-disable-next-line @typescript-eslint/explicit-function-return-type\n  render() {\n    const hasLabel = !!this.label;\n\n    return (\n      <Host\n        class={{\n          'ts-icon': true,\n          [`ts-icon--${this.size}`]: true,\n        }}\n        role={hasLabel ? 'img' : undefined}\n        aria-label={hasLabel ? this.label : undefined}\n        aria-hidden={hasLabel ? undefined : 'true'}\n        style={{ '--ts-icon-color': this.color }}\n      >\n        {this.src ? (\n          <img src={this.src} alt=\"\" part=\"img\" />\n        ) : this.svgContent ? (\n          <span part=\"svg\" innerHTML={this.svgContent}></span>\n        ) : (\n          <slot />\n        )}\n      </Host>\n    );\n  }\n}\n"],"names":[],"mappings":"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"}