@ds-mo/ui 14.36.0 → 15.0.0

package/dist/mcp-data/registry/icon.json

@@ -2,7 +2,7 @@
   "$schema": "https://ui.shadcn.com/schema/registry-item.json",
   "name": "icon",
   "title": "Icon",
-  "description": "Secure, lazily loaded renderer for canonical IcoMo system and flag glyphs, decorative by default with optional graphic semantics.",
+  "description": "Secure, lazily loaded renderer for canonical IcoMo system, flag, and map glyphs, decorative by default with optional graphic semantics.",
   "type": "registry:ui",
   "meta": {
     "library": "@ds-mo/ui",
@@ -13,10 +13,11 @@
     "intent": {
       "audience": "general",
       "status": "stable",
-      "summary": "Secure, lazily loaded renderer for canonical IcoMo system and flag glyphs, decorative by default with optional graphic semantics.",
+      "summary": "Secure, lazily loaded renderer for canonical IcoMo system, flag, and map glyphs, decorative by default with optional graphic semantics.",
       "useWhen": [
         "An approved IcoMo system glyph supplements visible text or control chrome.",
         "A canonical flag glyph communicates a country or region with adjacent text or an explicit localized label.",
+        "A canonical map glyph marks an entity or state on a map surface.",
         "A standalone non-interactive symbol conveys meaning that is unavailable from nearby text."
       ],
       "avoidWhen": [
@@ -59,7 +60,7 @@
       "states": [
         "Omitted color inherits currentColor from the owning context. Explicit semantic aliases and CSS-variable references are available when the icon has an independent color role.",
         "Prefer the owning control's isInactive or native disabled state over manually selecting tertiary or quaternary so visual treatment and inactive semantics remain synchronized.",
-        "Built-in glyph lookup accepts exact canonical IcoMo export names only. Names beginning with Flag select the flag catalog automatically.",
+        "Built-in glyph lookup accepts exact canonical IcoMo export names only. The system, flag, and map catalogs are selected by which one owns the name, never by its prefix, so system glyphs such as Flag, FlagFilled, MapPage, and MapPin resolve correctly.",
         "A cache miss lazy-loads into a fixed-size box without layout shift. Unknown names, failed loads, and rejected markup leave that box empty.",
         "Critical first-paint glyphs may be pre-registered before rendering; all resolved glyphs share a global cache.",
         "Every SVG is validated at the render boundary and injected as parsed DOM nodes so app-registered markup cannot bypass executable-content or external-reference checks."
@@ -200,7 +201,7 @@
       "peerDependencies": {
         "required": [
           "@ds-mo/tokens ^6.5.1",
-          "@ds-mo/icons ^7.0.0"
+          "@ds-mo/icons ^8.1.0"
         ],
         "frameworks": "Custom Elements; React 18/19 wrappers; Vue 3 wrappers; Angular 19-22 standalone adapters."
       }
@@ -220,7 +221,7 @@
     },
     {
       "path": "src/wc/components/Icon/Icon.tsx",
-      "content": "import { Component, Prop, Element, State, Watch, h, Host } from '@stencil/core';\nimport { flagIconLoaders } from './flag-icon-catalog';\nimport { systemIconLoaders } from './system-icon-catalog';\nimport { iconCache, iconCacheKey } from './icon-cache';\nimport { parseIconSvg } from './icon-svg';\n\nexport type IconSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl';\n\nexport type IconColorToken =\n  // Hierarchy\n  | 'primary'\n  | 'secondary'\n  | 'tertiary'\n  | 'quaternary'\n  // Intent — bold contrast (default)\n  | 'brand'\n  | 'negative'\n  | 'positive'\n  | 'warning'\n  | 'caution'\n  | 'ai'\n  | 'guide'\n  | 'neutral'\n  // Intent — faint\n  | 'faint-brand'\n  | 'faint-negative'\n  | 'faint-positive'\n  | 'faint-warning'\n  | 'faint-caution'\n  | 'faint-ai'\n  | 'faint-neutral'\n  // Intent — medium\n  | 'medium-brand'\n  | 'medium-negative'\n  | 'medium-positive'\n  | 'medium-warning'\n  | 'medium-caution'\n  | 'medium-ai'\n  | 'medium-neutral'\n  // Intent — bold (explicit)\n  | 'bold-brand'\n  | 'bold-negative'\n  | 'bold-positive'\n  | 'bold-warning'\n  | 'bold-caution'\n  | 'bold-ai'\n  | 'bold-neutral'\n  // Intent — strong\n  | 'strong-brand'\n  | 'strong-negative'\n  | 'strong-positive'\n  | 'strong-warning'\n  | 'strong-caution'\n  | 'strong-ai'\n  | 'strong-neutral'\n  // Contextual\n  | 'on-strong'\n  | 'on-bold'\n  // Pass-through\n  | 'inherit';\n\nexport type IconColor = IconColorToken | `var(--${string})`;\n\n@Component({\n  tag: 'ds-icon',\n  styleUrl: 'Icon.css',\n  scoped: true,\n})\nexport class Icon {\n  @Element() el!: HTMLElement;\n\n  /** Exact canonical IcoMo export name, including the `Flag` prefix for flags. */\n  @Prop() name: string = '';\n  /** Iconography size token. Maps to `--dimension-iconography-{size}`. Default `md` = 20 px. */\n  @Prop() size: IconSize = 'md';\n  /**\n   * Semantic foreground color token, or a raw CSS var reference. `tertiary`\n   * and the still-fainter `quaternary` are restricted to icons inside genuinely\n   * inactive/disabled UI or to purely decorative icons; informative icons must\n   * retain sufficient contrast.\n   */\n  @Prop() color: IconColor = 'inherit';\n  /** Accessible label. Sets `role=\"img\"` and `aria-label`. Omit for decorative icons. */\n  @Prop() label: string | undefined;\n\n  /** Resolved SVG markup — set synchronously on cache hit, async after a lazy load. */\n  @State() private svg: string = '';\n\n  /** Guards against out-of-order async resolutions when `name`/`flag` change quickly. */\n  private loadToken = 0;\n\n  /**\n   * Cache hit → render synchronously (pre-registered via `registerIcons` or\n   * previously loaded). Miss → fire the per-icon lazy loader; the glyph pops in\n   * when the (tiny, per-icon) chunk resolves and stays cached for every other\n   * ds-icon instance.\n   */\n  private resolveSvg() {\n    const flag = this.name.startsWith('Flag');\n    const key = iconCacheKey(this.name, flag);\n    const token = ++this.loadToken;\n\n    const cached = iconCache().get(key);\n    if (cached !== undefined) {\n      this.svg = cached;\n      return;\n    }\n\n    // Own-key lookup only: names resolve by exact canonical IcoMo export key —\n    // never meta.json aliases (not in the maps) and never inherited prototype\n    // keys ('constructor', 'toString', …) that a bare index access would hit.\n    const loaders = flag ? flagIconLoaders : systemIconLoaders;\n    const loader = Object.prototype.hasOwnProperty.call(loaders, this.name)\n      ? loaders[this.name]\n      : undefined;\n    if (!loader) {\n      this.svg = '';\n      return;\n    }\n\n    loader()\n      .then(svg => {\n        iconCache().set(key, svg);\n        if (token === this.loadToken) this.svg = svg;\n      })\n      .catch(() => {\n        if (token === this.loadToken) this.svg = '';\n      });\n  }\n\n  componentWillLoad() {\n    // Fire-and-forget: do not return the promise — a cache miss must not block\n    // the parent render tree on a network fetch.\n    this.resolveSvg();\n  }\n\n  /** Last markup injected into the DOM — skips redundant re-parse on unrelated re-renders. */\n  private renderedSvg: string | null = null;\n\n  private updateSvg() {\n    const container = this.el.querySelector<HTMLElement>('.icon__svg');\n    if (!container) return;\n    if (this.svg === this.renderedSvg) return;\n    this.renderedSvg = this.svg;\n\n    // Validate + inject as parsed DOM nodes — never innerHTML. Keeps ds-icon\n    // Trusted-Types compatible and rejects executable/foreign content in\n    // glyph strings (registerIcons accepts app-provided markup).\n    const svg = this.svg ? parseIconSvg(this.svg) : null;\n    if (!svg) {\n      container.replaceChildren();\n      return;\n    }\n\n    // Stencil's scoped CSS cannot reach injected elements (no sc-* class).\n    // Apply width/height as inline styles so sizing works regardless of scope class.\n    svg.removeAttribute('width');\n    svg.removeAttribute('height');\n    // Prevent SVG from being natively focusable (Firefox/IE default) while\n    // sitting inside an aria-hidden parent — fixes aria-hidden-focus violation.\n    svg.setAttribute('focusable', 'false');\n    svg.setAttribute('aria-hidden', 'true');\n    svg.style.display = 'block';\n    svg.style.flexShrink = '0';\n    svg.style.width = '100%';\n    svg.style.height = '100%';\n    container.replaceChildren(svg);\n  }\n\n  @Watch('name')\n  onIconChange() {\n    this.resolveSvg();\n  }\n\n  componentDidRender() {\n    this.updateSvg();\n  }\n\n  render() {\n    const isCustomColor = typeof this.color === 'string' && this.color.startsWith('var(--');\n\n    const cls: Record<string, boolean> = {\n      icon: true,\n      [`icon--size-${this.size}`]: true,\n      [`icon--color-${this.color}`]: !!this.color && !isCustomColor && this.color !== 'inherit',\n      'icon--color-inherit': this.color === 'inherit',\n    };\n\n    const style = isCustomColor ? { color: this.color as string } : undefined;\n\n    return (\n      <Host style={{ display: 'inline-flex', alignItems: 'center', justifyContent: 'center' }}>\n        <span\n          class={cls}\n          style={style}\n          role={this.label ? 'img' : 'presentation'}\n          aria-label={this.label}\n          aria-hidden={!this.label ? 'true' : undefined}\n        >\n          <span class=\"icon__svg\" />\n        </span>\n      </Host>\n    );\n  }\n}\n",
+      "content": "import { Component, Prop, Element, State, Watch, h, Host } from '@stencil/core';\nimport { flagIconLoaders } from './flag-icon-catalog';\nimport { systemIconLoaders } from './system-icon-catalog';\nimport { mapIconLoaders } from './map-icon-catalog';\nimport { iconCache, iconCacheKey, resolveIconCategory } from './icon-cache';\nimport type { IconCategory } from './icon-cache';\nimport { parseIconSvg } from './icon-svg';\n\n/** One lazy-loader catalog per IcoMo category, keyed so routing stays a lookup. */\nconst ICON_LOADERS: Record<IconCategory, Record<string, () => Promise<string>>> = {\n  system: systemIconLoaders,\n  flag: flagIconLoaders,\n  map: mapIconLoaders,\n};\n\nexport type IconSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl';\n\nexport type IconColorToken =\n  // Hierarchy\n  | 'primary'\n  | 'secondary'\n  | 'tertiary'\n  | 'quaternary'\n  // Intent — bold contrast (default)\n  | 'brand'\n  | 'negative'\n  | 'positive'\n  | 'warning'\n  | 'caution'\n  | 'ai'\n  | 'guide'\n  | 'neutral'\n  // Intent — faint\n  | 'faint-brand'\n  | 'faint-negative'\n  | 'faint-positive'\n  | 'faint-warning'\n  | 'faint-caution'\n  | 'faint-ai'\n  | 'faint-neutral'\n  // Intent — medium\n  | 'medium-brand'\n  | 'medium-negative'\n  | 'medium-positive'\n  | 'medium-warning'\n  | 'medium-caution'\n  | 'medium-ai'\n  | 'medium-neutral'\n  // Intent — bold (explicit)\n  | 'bold-brand'\n  | 'bold-negative'\n  | 'bold-positive'\n  | 'bold-warning'\n  | 'bold-caution'\n  | 'bold-ai'\n  | 'bold-neutral'\n  // Intent — strong\n  | 'strong-brand'\n  | 'strong-negative'\n  | 'strong-positive'\n  | 'strong-warning'\n  | 'strong-caution'\n  | 'strong-ai'\n  | 'strong-neutral'\n  // Contextual\n  | 'on-strong'\n  | 'on-bold'\n  // Pass-through\n  | 'inherit';\n\nexport type IconColor = IconColorToken | `var(--${string})`;\n\n@Component({\n  tag: 'ds-icon',\n  styleUrl: 'Icon.css',\n  scoped: true,\n})\nexport class Icon {\n  @Element() el!: HTMLElement;\n\n  /** Exact canonical IcoMo export name, including the `Flag` prefix for flags. */\n  @Prop() name: string = '';\n  /** Iconography size token. Maps to `--dimension-iconography-{size}`. Default `md` = 20 px. */\n  @Prop() size: IconSize = 'md';\n  /**\n   * Semantic foreground color token, or a raw CSS var reference. `tertiary`\n   * and the still-fainter `quaternary` are restricted to icons inside genuinely\n   * inactive/disabled UI or to purely decorative icons; informative icons must\n   * retain sufficient contrast.\n   */\n  @Prop() color: IconColor = 'inherit';\n  /** Accessible label. Sets `role=\"img\"` and `aria-label`. Omit for decorative icons. */\n  @Prop() label: string | undefined;\n\n  /** Resolved SVG markup — set synchronously on cache hit, async after a lazy load. */\n  @State() private svg: string = '';\n\n  /** Guards against out-of-order async resolutions when `name`/`flag` change quickly. */\n  private loadToken = 0;\n\n  /**\n   * Cache hit → render synchronously (pre-registered via `registerIcons` or\n   * previously loaded). Miss → fire the per-icon lazy loader; the glyph pops in\n   * when the (tiny, per-icon) chunk resolves and stays cached for every other\n   * ds-icon instance.\n   */\n  private resolveSvg() {\n    const category = resolveIconCategory(this.name);\n    const key = iconCacheKey(this.name, category);\n    const token = ++this.loadToken;\n\n    const cached = iconCache().get(key);\n    if (cached !== undefined) {\n      this.svg = cached;\n      return;\n    }\n\n    // Own-key lookup only: names resolve by exact canonical IcoMo export key —\n    // never meta.json aliases (not in the maps) and never inherited prototype\n    // keys ('constructor', 'toString', …) that a bare index access would hit.\n    const loaders = ICON_LOADERS[category];\n    const loader = Object.prototype.hasOwnProperty.call(loaders, this.name)\n      ? loaders[this.name]\n      : undefined;\n    if (!loader) {\n      this.svg = '';\n      return;\n    }\n\n    loader()\n      .then(svg => {\n        iconCache().set(key, svg);\n        if (token === this.loadToken) this.svg = svg;\n      })\n      .catch(() => {\n        if (token === this.loadToken) this.svg = '';\n      });\n  }\n\n  componentWillLoad() {\n    // Fire-and-forget: do not return the promise — a cache miss must not block\n    // the parent render tree on a network fetch.\n    this.resolveSvg();\n  }\n\n  /** Last markup injected into the DOM — skips redundant re-parse on unrelated re-renders. */\n  private renderedSvg: string | null = null;\n\n  private updateSvg() {\n    const container = this.el.querySelector<HTMLElement>('.icon__svg');\n    if (!container) return;\n    if (this.svg === this.renderedSvg) return;\n    this.renderedSvg = this.svg;\n\n    // Validate + inject as parsed DOM nodes — never innerHTML. Keeps ds-icon\n    // Trusted-Types compatible and rejects executable/foreign content in\n    // glyph strings (registerIcons accepts app-provided markup).\n    const svg = this.svg ? parseIconSvg(this.svg) : null;\n    if (!svg) {\n      container.replaceChildren();\n      return;\n    }\n\n    // Stencil's scoped CSS cannot reach injected elements (no sc-* class).\n    // Apply width/height as inline styles so sizing works regardless of scope class.\n    svg.removeAttribute('width');\n    svg.removeAttribute('height');\n    // Prevent SVG from being natively focusable (Firefox/IE default) while\n    // sitting inside an aria-hidden parent — fixes aria-hidden-focus violation.\n    svg.setAttribute('focusable', 'false');\n    svg.setAttribute('aria-hidden', 'true');\n    svg.style.display = 'block';\n    svg.style.flexShrink = '0';\n    svg.style.width = '100%';\n    svg.style.height = '100%';\n    container.replaceChildren(svg);\n  }\n\n  @Watch('name')\n  onIconChange() {\n    this.resolveSvg();\n  }\n\n  componentDidRender() {\n    this.updateSvg();\n  }\n\n  render() {\n    const isCustomColor = typeof this.color === 'string' && this.color.startsWith('var(--');\n\n    const cls: Record<string, boolean> = {\n      icon: true,\n      [`icon--size-${this.size}`]: true,\n      [`icon--color-${this.color}`]: !!this.color && !isCustomColor && this.color !== 'inherit',\n      'icon--color-inherit': this.color === 'inherit',\n    };\n\n    const style = isCustomColor ? { color: this.color as string } : undefined;\n\n    return (\n      <Host style={{ display: 'inline-flex', alignItems: 'center', justifyContent: 'center' }}>\n        <span\n          class={cls}\n          style={style}\n          role={this.label ? 'img' : 'presentation'}\n          aria-label={this.label}\n          aria-hidden={!this.label ? 'true' : undefined}\n        >\n          <span class=\"icon__svg\" />\n        </span>\n      </Host>\n    );\n  }\n}\n",
       "type": "registry:ui"
     },
     {
@@ -230,7 +231,7 @@
     },
     {
       "path": "src/wc/components/Icon/icon-cache.ts",
-      "content": "/**\n * Shared SVG glyph cache for ds-icon.\n *\n * Keyed on a global symbol so every module instance (the compiled Stencil chunk\n * inside dist/components and any direct source import, e.g. via `@ds-mo/ui/utils`)\n * reads and writes the same cache. Without this, `registerIcons` called from an\n * app would fill a different Map than the one ds-icon resolves from.\n */\nconst CACHE_KEY = Symbol.for('ds-mo.icon-svg-cache');\n\ntype IconCacheMap = Map<string, string>;\n\ntype GlobalWithIconCache = { [CACHE_KEY]?: IconCacheMap };\n\nexport function iconCacheKey(name: string, flag: boolean): string {\n  return flag ? `flag:${name}` : `system:${name}`;\n}\n\nexport function iconCache(): IconCacheMap {\n  const g = globalThis as GlobalWithIconCache;\n  return (g[CACHE_KEY] ??= new Map());\n}\n\n/**\n * Pre-register glyphs so ds-icon renders them synchronously — no lazy-chunk\n * fetch, no first-paint pop-in. Import the SVG strings from `@ds-mo/icons`\n * in the app (statically, so they ship in the app's own bundle):\n *\n * ```ts\n * import { Bell } from '@ds-mo/icons/svg/Bell';\n * import { FlagUnitedStates } from '@ds-mo/icons/svg/flags/FlagUnitedStates';\n * import { registerIcons } from '@ds-mo/ui/utils';\n *\n * registerIcons({ Bell });\n * registerIcons({ FlagUnitedStates });\n * ```\n *\n * Icons that are not registered still work — they lazy-load on first render\n * and stay cached afterwards.\n */\nexport function registerIcons(icons: Record<string, string>, options?: { flag?: boolean }): void {\n  const cache = iconCache();\n  for (const [name, svg] of Object.entries(icons)) {\n    const flag = options?.flag ?? name.startsWith('Flag');\n    cache.set(iconCacheKey(name, flag), svg);\n  }\n}\n",
+      "content": "/**\n * Shared SVG glyph cache for ds-icon.\n *\n * Keyed on a global symbol so every module instance (the compiled Stencil chunk\n * inside dist/components and any direct source import, e.g. via `@ds-mo/ui/utils`)\n * reads and writes the same cache. Without this, `registerIcons` called from an\n * app would fill a different Map than the one ds-icon resolves from.\n */\nimport { flagIconLoaders } from './flag-icon-catalog';\nimport { mapIconLoaders } from './map-icon-catalog';\n\nconst CACHE_KEY = Symbol.for('ds-mo.icon-svg-cache');\n\ntype IconCacheMap = Map<string, string>;\n\ntype GlobalWithIconCache = { [CACHE_KEY]?: IconCacheMap };\n\n/** IcoMo ships each glyph in exactly one category; the catalogs mirror that split. */\nexport type IconCategory = 'system' | 'flag' | 'map';\n\nexport function iconCacheKey(name: string, category: IconCategory): string {\n  return `${category}:${name}`;\n}\n\nfunction hasOwn(loaders: Record<string, unknown>, name: string): boolean {\n  return Object.prototype.hasOwnProperty.call(loaders, name);\n}\n\n/**\n * Pick the catalog a name belongs to by own-key membership — never by prefix.\n *\n * A prefix test looks equivalent and is not. IcoMo ships `Flag`/`FlagFilled` as\n * *system* icons (a generic flag glyph, not a country) and `MapNavigation`,\n * `MapPage`, `MapPin`, `MapStreet` as system icons too, while every genuine\n * flag/map export carries the category prefix. So `startsWith('Flag')` or\n * `startsWith('Map')` misroutes those six to a catalog that does not contain\n * them, the own-key lookup misses, and ds-icon renders nothing with no error.\n *\n * Only the two prefixed catalogs are consulted; anything else is system. That\n * keeps the system catalog — 400 loaders, by far the largest — out of the\n * `@ds-mo/ui/utils` entry, which exists to hand apps `registerIcons`.\n *\n * Test order is not a tie-break: `generate-icon-catalog.mjs` fails the build if\n * IcoMo ever ships one name in two categories, so at most one can match.\n *\n * Names in no catalog resolve as system, which is what lets an app register a\n * glyph of its own under a custom name and have ds-icon read it back.\n */\nexport function resolveIconCategory(name: string): IconCategory {\n  if (hasOwn(flagIconLoaders, name)) return 'flag';\n  if (hasOwn(mapIconLoaders, name)) return 'map';\n  return 'system';\n}\n\nexport function iconCache(): IconCacheMap {\n  const g = globalThis as GlobalWithIconCache;\n  return (g[CACHE_KEY] ??= new Map());\n}\n\n/**\n * Pre-register glyphs so ds-icon renders them synchronously — no lazy-chunk\n * fetch, no first-paint pop-in. Import the SVG strings from `@ds-mo/icons`\n * in the app (statically, so they ship in the app's own bundle):\n *\n * ```ts\n * import { Bell } from '@ds-mo/icons/svg/Bell';\n * import { FlagUnitedStates } from '@ds-mo/icons/svg/flags/FlagUnitedStates';\n * import { MapGeofence } from '@ds-mo/icons/svg/map/MapGeofence';\n * import { registerIcons } from '@ds-mo/ui/utils';\n *\n * registerIcons({ Bell });\n * registerIcons({ FlagUnitedStates });\n * registerIcons({ MapGeofence });\n * ```\n *\n * The category comes from the name, exactly as ds-icon derives it, so a\n * registration is always readable by the element that needs it. Glyphs under a\n * name IcoMo does not ship — an app's own marker artwork, say — register as\n * system and resolve the same way.\n *\n * There is deliberately no category override. ds-icon has no such override when\n * it reads, so forcing a different category on write could only produce an\n * entry nothing ever reads.\n *\n * Icons that are not registered still work — they lazy-load on first render\n * and stay cached afterwards.\n */\nexport function registerIcons(icons: Record<string, string>): void {\n  const cache = iconCache();\n  for (const [name, svg] of Object.entries(icons)) {\n    cache.set(iconCacheKey(name, resolveIconCategory(name)), svg);\n  }\n}\n",
       "type": "registry:ui"
     },
     {
@@ -238,9 +239,14 @@
       "content": "/**\n * Glyph markup validation + Trusted-Types-safe parsing for ds-icon.\n *\n * Glyphs normally come from the trusted @ds-mo/icons build pipeline, but\n * `registerIcons` accepts arbitrary app-provided strings and injection is a\n * sink — so every glyph is validated at the render boundary. Injection uses\n * parsed DOM nodes (never innerHTML), which keeps ds-icon working under a\n * strict CSP with `require-trusted-types-for 'script'`.\n */\n\n/** Structural view of an element so the walk is unit-testable without a DOM. */\nexport interface IconSvgElementLike {\n  localName: string;\n  getAttributeNames(): string[];\n  getAttribute(name: string): string | null;\n  children: ArrayLike<IconSvgElementLike>;\n}\n\n/** Elements that can execute or embed foreign content — never valid in a glyph. */\nconst FORBIDDEN_ELEMENTS = new Set([\n  'script',\n  'foreignobject',\n  'iframe',\n  'object',\n  'embed',\n  'animation', // SVG 1.2 external-content element (distinct from animate/animateTransform)\n]);\n\nfunction isValidIconSvgElement(el: IconSvgElementLike): boolean {\n  if (FORBIDDEN_ELEMENTS.has(el.localName.toLowerCase())) return false;\n\n  for (const attr of el.getAttributeNames()) {\n    const lower = attr.toLowerCase();\n    // Event handler attributes (onclick, onload, …) — any casing.\n    if (lower.startsWith('on')) return false;\n    // References must stay internal (#gradient-id); rejects javascript:, data:,\n    // and external URLs on <use>, <a>, <image>, …\n    if (lower === 'href' || lower === 'xlink:href') {\n      const value = el.getAttribute(attr) ?? '';\n      if (!value.startsWith('#')) return false;\n    }\n  }\n\n  for (let i = 0; i < el.children.length; i++) {\n    if (!isValidIconSvgElement(el.children[i])) return false;\n  }\n\n  return true;\n}\n\n/** True when `root` is an `<svg>` whose whole tree passes validation. */\nexport function isValidIconSvgRoot(root: IconSvgElementLike | null): boolean {\n  return root != null && root.localName === 'svg' && isValidIconSvgElement(root);\n}\n\n/**\n * Parse + validate glyph markup. Returns a detached `<svg>` element ready to\n * append (appending adopts it into the document), or `null` when the markup\n * is not well-formed XML, not rooted at `<svg>`, or fails validation —\n * ds-icon renders an empty fixed-size box in that case.\n */\nexport function parseIconSvg(svg: string): SVGElement | null {\n  if (typeof DOMParser === 'undefined') return null;\n\n  const doc = new DOMParser().parseFromString(svg, 'image/svg+xml');\n  // Malformed XML yields a parsererror document (root or nested, per browser).\n  if (doc.querySelector('parsererror')) return null;\n\n  const root = doc.documentElement as unknown as IconSvgElementLike;\n  if (!isValidIconSvgRoot(root)) return null;\n\n  return doc.documentElement as unknown as SVGElement;\n}\n",
       "type": "registry:ui"
     },
+    {
+      "path": "src/wc/components/Icon/map-icon-catalog.ts",
+      "content": "/** Auto-generated by scripts/generate-icon-catalog.mjs — do not edit. */\n\nexport const mapIconLoaders: Record<string, () => Promise<string>> = {\n  MapEntityAsset: () => import('@ds-mo/icons/svg/map/MapEntityAsset').then(m => m.MapEntityAsset),\n  MapEntityPerson: () => import('@ds-mo/icons/svg/map/MapEntityPerson').then(m => m.MapEntityPerson),\n  MapEntityTravelGroup: () => import('@ds-mo/icons/svg/map/MapEntityTravelGroup').then(m => m.MapEntityTravelGroup),\n  MapEntityVehicle: () => import('@ds-mo/icons/svg/map/MapEntityVehicle').then(m => m.MapEntityVehicle),\n  MapExclamation: () => import('@ds-mo/icons/svg/map/MapExclamation').then(m => m.MapExclamation),\n  MapGatewayReconnect: () => import('@ds-mo/icons/svg/map/MapGatewayReconnect').then(m => m.MapGatewayReconnect),\n  MapGatewayStrikethrough: () => import('@ds-mo/icons/svg/map/MapGatewayStrikethrough').then(m => m.MapGatewayStrikethrough),\n  MapGeofence: () => import('@ds-mo/icons/svg/map/MapGeofence').then(m => m.MapGeofence),\n  MapKey: () => import('@ds-mo/icons/svg/map/MapKey').then(m => m.MapKey),\n  MapLightning: () => import('@ds-mo/icons/svg/map/MapLightning').then(m => m.MapLightning),\n  MapLockClosed: () => import('@ds-mo/icons/svg/map/MapLockClosed').then(m => m.MapLockClosed),\n  MapPencil: () => import('@ds-mo/icons/svg/map/MapPencil').then(m => m.MapPencil),\n  MapPlus: () => import('@ds-mo/icons/svg/map/MapPlus').then(m => m.MapPlus),\n  MapRewind: () => import('@ds-mo/icons/svg/map/MapRewind').then(m => m.MapRewind),\n  MapShieldCircle: () => import('@ds-mo/icons/svg/map/MapShieldCircle').then(m => m.MapShieldCircle),\n  MapTarget: () => import('@ds-mo/icons/svg/map/MapTarget').then(m => m.MapTarget),\n};\n",
+      "type": "registry:ui"
+    },
     {
       "path": "src/wc/components/Icon/system-icon-catalog.ts",
-      "content": "/** Auto-generated by scripts/generate-icon-catalog.mjs — do not edit. */\n\nexport const systemIconLoaders: Record<string, () => Promise<string>> = {\n  AI: () => import('@ds-mo/icons/svg/AI').then(m => m.AI),\n  AIChip: () => import('@ds-mo/icons/svg/AIChip').then(m => m.AIChip),\n  AINew: () => import('@ds-mo/icons/svg/AINew').then(m => m.AINew),\n  AISparkle: () => import('@ds-mo/icons/svg/AISparkle').then(m => m.AISparkle),\n  AUX: () => import('@ds-mo/icons/svg/AUX').then(m => m.AUX),\n  AUXFilled: () => import('@ds-mo/icons/svg/AUXFilled').then(m => m.AUXFilled),\n  AndroidFilled: () => import('@ds-mo/icons/svg/AndroidFilled').then(m => m.AndroidFilled),\n  ArrowDown: () => import('@ds-mo/icons/svg/ArrowDown').then(m => m.ArrowDown),\n  ArrowLeft: () => import('@ds-mo/icons/svg/ArrowLeft').then(m => m.ArrowLeft),\n  ArrowPath: () => import('@ds-mo/icons/svg/ArrowPath').then(m => m.ArrowPath),\n  ArrowRight: () => import('@ds-mo/icons/svg/ArrowRight').then(m => m.ArrowRight),\n  ArrowUp: () => import('@ds-mo/icons/svg/ArrowUp').then(m => m.ArrowUp),\n  ArrowsDiagonal: () => import('@ds-mo/icons/svg/ArrowsDiagonal').then(m => m.ArrowsDiagonal),\n  ArrowsDiff: () => import('@ds-mo/icons/svg/ArrowsDiff').then(m => m.ArrowsDiff),\n  ArrowsDiffDisabled: () => import('@ds-mo/icons/svg/ArrowsDiffDisabled').then(m => m.ArrowsDiffDisabled),\n  ArrowsVertical: () => import('@ds-mo/icons/svg/ArrowsVertical').then(m => m.ArrowsVertical),\n  AtSign: () => import('@ds-mo/icons/svg/AtSign').then(m => m.AtSign),\n  Avatar: () => import('@ds-mo/icons/svg/Avatar').then(m => m.Avatar),\n  BackslashBrackets: () => import('@ds-mo/icons/svg/BackslashBrackets').then(m => m.BackslashBrackets),\n  BatteryCharging: () => import('@ds-mo/icons/svg/BatteryCharging').then(m => m.BatteryCharging),\n  BatteryEmpty: () => import('@ds-mo/icons/svg/BatteryEmpty').then(m => m.BatteryEmpty),\n  BatteryFull: () => import('@ds-mo/icons/svg/BatteryFull').then(m => m.BatteryFull),\n  BatteryHalf: () => import('@ds-mo/icons/svg/BatteryHalf').then(m => m.BatteryHalf),\n  BatteryLow: () => import('@ds-mo/icons/svg/BatteryLow').then(m => m.BatteryLow),\n  Beaker: () => import('@ds-mo/icons/svg/Beaker').then(m => m.Beaker),\n  Bell: () => import('@ds-mo/icons/svg/Bell').then(m => m.Bell),\n  BellCircle: () => import('@ds-mo/icons/svg/BellCircle').then(m => m.BellCircle),\n  BellExclamation: () => import('@ds-mo/icons/svg/BellExclamation').then(m => m.BellExclamation),\n  BellFilled: () => import('@ds-mo/icons/svg/BellFilled').then(m => m.BellFilled),\n  BellRinging: () => import('@ds-mo/icons/svg/BellRinging').then(m => m.BellRinging),\n  BellWifi: () => import('@ds-mo/icons/svg/BellWifi').then(m => m.BellWifi),\n  BlackWhite: () => import('@ds-mo/icons/svg/BlackWhite').then(m => m.BlackWhite),\n  BlankUI: () => import('@ds-mo/icons/svg/BlankUI').then(m => m.BlankUI),\n  Bluetooth: () => import('@ds-mo/icons/svg/Bluetooth').then(m => m.Bluetooth),\n  Bolt: () => import('@ds-mo/icons/svg/Bolt').then(m => m.Bolt),\n  BoltFilled: () => import('@ds-mo/icons/svg/BoltFilled').then(m => m.BoltFilled),\n  Bookmark: () => import('@ds-mo/icons/svg/Bookmark').then(m => m.Bookmark),\n  Box: () => import('@ds-mo/icons/svg/Box').then(m => m.Box),\n  Braces: () => import('@ds-mo/icons/svg/Braces').then(m => m.Braces),\n  BracketsCircle: () => import('@ds-mo/icons/svg/BracketsCircle').then(m => m.BracketsCircle),\n  Bug: () => import('@ds-mo/icons/svg/Bug').then(m => m.Bug),\n  BuildingFacility: () => import('@ds-mo/icons/svg/BuildingFacility').then(m => m.BuildingFacility),\n  BuildingHome: () => import('@ds-mo/icons/svg/BuildingHome').then(m => m.BuildingHome),\n  BuildingOffice: () => import('@ds-mo/icons/svg/BuildingOffice').then(m => m.BuildingOffice),\n  BuildingPublic: () => import('@ds-mo/icons/svg/BuildingPublic').then(m => m.BuildingPublic),\n  BuildingShop: () => import('@ds-mo/icons/svg/BuildingShop').then(m => m.BuildingShop),\n  Bulb: () => import('@ds-mo/icons/svg/Bulb').then(m => m.Bulb),\n  Calculator: () => import('@ds-mo/icons/svg/Calculator').then(m => m.Calculator),\n  Calendar: () => import('@ds-mo/icons/svg/Calendar').then(m => m.Calendar),\n  CalendarClock: () => import('@ds-mo/icons/svg/CalendarClock').then(m => m.CalendarClock),\n  CameraA: () => import('@ds-mo/icons/svg/CameraA').then(m => m.CameraA),\n  CameraB: () => import('@ds-mo/icons/svg/CameraB').then(m => m.CameraB),\n  Card: () => import('@ds-mo/icons/svg/Card').then(m => m.Card),\n  CardPerson: () => import('@ds-mo/icons/svg/CardPerson').then(m => m.CardPerson),\n  Cart: () => import('@ds-mo/icons/svg/Cart').then(m => m.Cart),\n  Chart: () => import('@ds-mo/icons/svg/Chart').then(m => m.Chart),\n  Check: () => import('@ds-mo/icons/svg/Check').then(m => m.Check),\n  CheckCircle: () => import('@ds-mo/icons/svg/CheckCircle').then(m => m.CheckCircle),\n  CheckCircleFilled: () => import('@ds-mo/icons/svg/CheckCircleFilled').then(m => m.CheckCircleFilled),\n  CheckDouble: () => import('@ds-mo/icons/svg/CheckDouble').then(m => m.CheckDouble),\n  ChevronDown: () => import('@ds-mo/icons/svg/ChevronDown').then(m => m.ChevronDown),\n  ChevronDownUp: () => import('@ds-mo/icons/svg/ChevronDownUp').then(m => m.ChevronDownUp),\n  ChevronLeft: () => import('@ds-mo/icons/svg/ChevronLeft').then(m => m.ChevronLeft),\n  ChevronLeftDouble: () => import('@ds-mo/icons/svg/ChevronLeftDouble').then(m => m.ChevronLeftDouble),\n  ChevronRight: () => import('@ds-mo/icons/svg/ChevronRight').then(m => m.ChevronRight),\n  ChevronRightDouble: () => import('@ds-mo/icons/svg/ChevronRightDouble').then(m => m.ChevronRightDouble),\n  ChevronUp: () => import('@ds-mo/icons/svg/ChevronUp').then(m => m.ChevronUp),\n  ChevronUpDown: () => import('@ds-mo/icons/svg/ChevronUpDown').then(m => m.ChevronUpDown),\n  Circle: () => import('@ds-mo/icons/svg/Circle').then(m => m.Circle),\n  CircleArrow: () => import('@ds-mo/icons/svg/CircleArrow').then(m => m.CircleArrow),\n  CircleArrowsDiff: () => import('@ds-mo/icons/svg/CircleArrowsDiff').then(m => m.CircleArrowsDiff),\n  CircleArrowsDiffDisabled: () => import('@ds-mo/icons/svg/CircleArrowsDiffDisabled').then(m => m.CircleArrowsDiffDisabled),\n  CircleConcentricFilled: () => import('@ds-mo/icons/svg/CircleConcentricFilled').then(m => m.CircleConcentricFilled),\n  CircleConcentricThree: () => import('@ds-mo/icons/svg/CircleConcentricThree').then(m => m.CircleConcentricThree),\n  CircleConcentricTwo: () => import('@ds-mo/icons/svg/CircleConcentricTwo').then(m => m.CircleConcentricTwo),\n  CircleExclamation: () => import('@ds-mo/icons/svg/CircleExclamation').then(m => m.CircleExclamation),\n  CircleExclamationFilled: () => import('@ds-mo/icons/svg/CircleExclamationFilled').then(m => m.CircleExclamationFilled),\n  CircleFastForward: () => import('@ds-mo/icons/svg/CircleFastForward').then(m => m.CircleFastForward),\n  CircleFilled: () => import('@ds-mo/icons/svg/CircleFilled').then(m => m.CircleFilled),\n  CircleGrid: () => import('@ds-mo/icons/svg/CircleGrid').then(m => m.CircleGrid),\n  CirclePlay: () => import('@ds-mo/icons/svg/CirclePlay').then(m => m.CirclePlay),\n  CircleQuestion: () => import('@ds-mo/icons/svg/CircleQuestion').then(m => m.CircleQuestion),\n  CircleSlash: () => import('@ds-mo/icons/svg/CircleSlash').then(m => m.CircleSlash),\n  Clipboard: () => import('@ds-mo/icons/svg/Clipboard').then(m => m.Clipboard),\n  ClipboardCheck: () => import('@ds-mo/icons/svg/ClipboardCheck').then(m => m.ClipboardCheck),\n  Clock: () => import('@ds-mo/icons/svg/Clock').then(m => m.Clock),\n  ClockDefer: () => import('@ds-mo/icons/svg/ClockDefer').then(m => m.ClockDefer),\n  ClockFilled: () => import('@ds-mo/icons/svg/ClockFilled').then(m => m.ClockFilled),\n  ClockSixteenHour: () => import('@ds-mo/icons/svg/ClockSixteenHour').then(m => m.ClockSixteenHour),\n  Cloud: () => import('@ds-mo/icons/svg/Cloud').then(m => m.Cloud),\n  CloudEllipses: () => import('@ds-mo/icons/svg/CloudEllipses').then(m => m.CloudEllipses),\n  CloudLightning: () => import('@ds-mo/icons/svg/CloudLightning').then(m => m.CloudLightning),\n  CloudRain: () => import('@ds-mo/icons/svg/CloudRain').then(m => m.CloudRain),\n  CloudRainSun: () => import('@ds-mo/icons/svg/CloudRainSun').then(m => m.CloudRainSun),\n  CloudSun: () => import('@ds-mo/icons/svg/CloudSun').then(m => m.CloudSun),\n  CloudWind: () => import('@ds-mo/icons/svg/CloudWind').then(m => m.CloudWind),\n  Cluster: () => import('@ds-mo/icons/svg/Cluster').then(m => m.Cluster),\n  Coin: () => import('@ds-mo/icons/svg/Coin').then(m => m.Coin),\n  CoinStack: () => import('@ds-mo/icons/svg/CoinStack').then(m => m.CoinStack),\n  CoinStackGeneral: () => import('@ds-mo/icons/svg/CoinStackGeneral').then(m => m.CoinStackGeneral),\n  Compass: () => import('@ds-mo/icons/svg/Compass').then(m => m.Compass),\n  Copy: () => import('@ds-mo/icons/svg/Copy').then(m => m.Copy),\n  Crop: () => import('@ds-mo/icons/svg/Crop').then(m => m.Crop),\n  Cross: () => import('@ds-mo/icons/svg/Cross').then(m => m.Cross),\n  CrossCircle: () => import('@ds-mo/icons/svg/CrossCircle').then(m => m.CrossCircle),\n  CrossCircleFilled: () => import('@ds-mo/icons/svg/CrossCircleFilled').then(m => m.CrossCircleFilled),\n  Cube: () => import('@ds-mo/icons/svg/Cube').then(m => m.Cube),\n  Cup: () => import('@ds-mo/icons/svg/Cup').then(m => m.Cup),\n  CursorPointer: () => import('@ds-mo/icons/svg/CursorPointer').then(m => m.CursorPointer),\n  CursorPointerMinus: () => import('@ds-mo/icons/svg/CursorPointerMinus').then(m => m.CursorPointerMinus),\n  CursorPointerPlus: () => import('@ds-mo/icons/svg/CursorPointerPlus').then(m => m.CursorPointerPlus),\n  Dashboard: () => import('@ds-mo/icons/svg/Dashboard').then(m => m.Dashboard),\n  DeviceAIDashcamPlus: () => import('@ds-mo/icons/svg/DeviceAIDashcamPlus').then(m => m.DeviceAIDashcamPlus),\n  DeviceAssetTracker: () => import('@ds-mo/icons/svg/DeviceAssetTracker').then(m => m.DeviceAssetTracker),\n  DeviceDVR: () => import('@ds-mo/icons/svg/DeviceDVR').then(m => m.DeviceDVR),\n  DeviceDashcam: () => import('@ds-mo/icons/svg/DeviceDashcam').then(m => m.DeviceDashcam),\n  DeviceDashcamLiveStream: () => import('@ds-mo/icons/svg/DeviceDashcamLiveStream').then(m => m.DeviceDashcamLiveStream),\n  DeviceDoorSensor: () => import('@ds-mo/icons/svg/DeviceDoorSensor').then(m => m.DeviceDoorSensor),\n  DeviceMobile: () => import('@ds-mo/icons/svg/DeviceMobile').then(m => m.DeviceMobile),\n  DeviceMobileTwo: () => import('@ds-mo/icons/svg/DeviceMobileTwo').then(m => m.DeviceMobileTwo),\n  DeviceOmnicam: () => import('@ds-mo/icons/svg/DeviceOmnicam').then(m => m.DeviceOmnicam),\n  DeviceSensor: () => import('@ds-mo/icons/svg/DeviceSensor').then(m => m.DeviceSensor),\n  DeviceTablet: () => import('@ds-mo/icons/svg/DeviceTablet').then(m => m.DeviceTablet),\n  DeviceVehicleGateway: () => import('@ds-mo/icons/svg/DeviceVehicleGateway').then(m => m.DeviceVehicleGateway),\n  Devices: () => import('@ds-mo/icons/svg/Devices').then(m => m.Devices),\n  Document: () => import('@ds-mo/icons/svg/Document').then(m => m.Document),\n  DocumentArrow: () => import('@ds-mo/icons/svg/DocumentArrow').then(m => m.DocumentArrow),\n  DocumentChart: () => import('@ds-mo/icons/svg/DocumentChart').then(m => m.DocumentChart),\n  DocumentDollar: () => import('@ds-mo/icons/svg/DocumentDollar').then(m => m.DocumentDollar),\n  DocumentGear: () => import('@ds-mo/icons/svg/DocumentGear').then(m => m.DocumentGear),\n  DocumentInverted: () => import('@ds-mo/icons/svg/DocumentInverted').then(m => m.DocumentInverted),\n  DocumentPencil: () => import('@ds-mo/icons/svg/DocumentPencil').then(m => m.DocumentPencil),\n  DocumentPlus: () => import('@ds-mo/icons/svg/DocumentPlus').then(m => m.DocumentPlus),\n  DocumentQuestion: () => import('@ds-mo/icons/svg/DocumentQuestion').then(m => m.DocumentQuestion),\n  DocumentReceipt: () => import('@ds-mo/icons/svg/DocumentReceipt').then(m => m.DocumentReceipt),\n  DocumentStacked: () => import('@ds-mo/icons/svg/DocumentStacked').then(m => m.DocumentStacked),\n  Dot: () => import('@ds-mo/icons/svg/Dot').then(m => m.Dot),\n  DotFilled: () => import('@ds-mo/icons/svg/DotFilled').then(m => m.DotFilled),\n  DotPath: () => import('@ds-mo/icons/svg/DotPath').then(m => m.DotPath),\n  Download: () => import('@ds-mo/icons/svg/Download').then(m => m.Download),\n  Drag: () => import('@ds-mo/icons/svg/Drag').then(m => m.Drag),\n  Ellipses: () => import('@ds-mo/icons/svg/Ellipses').then(m => m.Ellipses),\n  Email: () => import('@ds-mo/icons/svg/Email').then(m => m.Email),\n  Engine: () => import('@ds-mo/icons/svg/Engine').then(m => m.Engine),\n  Enter: () => import('@ds-mo/icons/svg/Enter').then(m => m.Enter),\n  EntityAsset: () => import('@ds-mo/icons/svg/EntityAsset').then(m => m.EntityAsset),\n  EntityAssetFilled: () => import('@ds-mo/icons/svg/EntityAssetFilled').then(m => m.EntityAssetFilled),\n  EntityDriver: () => import('@ds-mo/icons/svg/EntityDriver').then(m => m.EntityDriver),\n  EntityDriverFilled: () => import('@ds-mo/icons/svg/EntityDriverFilled').then(m => m.EntityDriverFilled),\n  EntityTravelGroup: () => import('@ds-mo/icons/svg/EntityTravelGroup').then(m => m.EntityTravelGroup),\n  EntityTravelGroupFilled: () => import('@ds-mo/icons/svg/EntityTravelGroupFilled').then(m => m.EntityTravelGroupFilled),\n  EntityVehicle: () => import('@ds-mo/icons/svg/EntityVehicle').then(m => m.EntityVehicle),\n  EntityVehicleCharging: () => import('@ds-mo/icons/svg/EntityVehicleCharging').then(m => m.EntityVehicleCharging),\n  EntityVehicleChargingFilled: () => import('@ds-mo/icons/svg/EntityVehicleChargingFilled').then(m => m.EntityVehicleChargingFilled),\n  EntityVehicleFilled: () => import('@ds-mo/icons/svg/EntityVehicleFilled').then(m => m.EntityVehicleFilled),\n  EntityVehicleImmobilized: () => import('@ds-mo/icons/svg/EntityVehicleImmobilized').then(m => m.EntityVehicleImmobilized),\n  EntityVehicleImmobilizedFilled: () => import('@ds-mo/icons/svg/EntityVehicleImmobilizedFilled').then(m => m.EntityVehicleImmobilizedFilled),\n  ErrorTriangle: () => import('@ds-mo/icons/svg/ErrorTriangle').then(m => m.ErrorTriangle),\n  ErrorTriangleFilled: () => import('@ds-mo/icons/svg/ErrorTriangleFilled').then(m => m.ErrorTriangleFilled),\n  ErrorTriangleSimpleFilled: () => import('@ds-mo/icons/svg/ErrorTriangleSimpleFilled').then(m => m.ErrorTriangleSimpleFilled),\n  Export: () => import('@ds-mo/icons/svg/Export').then(m => m.Export),\n  ExternalLink: () => import('@ds-mo/icons/svg/ExternalLink').then(m => m.ExternalLink),\n  Eye: () => import('@ds-mo/icons/svg/Eye').then(m => m.Eye),\n  EyeDisabled: () => import('@ds-mo/icons/svg/EyeDisabled').then(m => m.EyeDisabled),\n  EyeLock: () => import('@ds-mo/icons/svg/EyeLock').then(m => m.EyeLock),\n  FastForward: () => import('@ds-mo/icons/svg/FastForward').then(m => m.FastForward),\n  FastForwardSkip: () => import('@ds-mo/icons/svg/FastForwardSkip').then(m => m.FastForwardSkip),\n  Filters: () => import('@ds-mo/icons/svg/Filters').then(m => m.Filters),\n  FitToScreen: () => import('@ds-mo/icons/svg/FitToScreen').then(m => m.FitToScreen),\n  Flag: () => import('@ds-mo/icons/svg/Flag').then(m => m.Flag),\n  FlagFilled: () => import('@ds-mo/icons/svg/FlagFilled').then(m => m.FlagFilled),\n  FloppyDisk: () => import('@ds-mo/icons/svg/FloppyDisk').then(m => m.FloppyDisk),\n  Folder: () => import('@ds-mo/icons/svg/Folder').then(m => m.Folder),\n  FolderFilled: () => import('@ds-mo/icons/svg/FolderFilled').then(m => m.FolderFilled),\n  FuelPump: () => import('@ds-mo/icons/svg/FuelPump').then(m => m.FuelPump),\n  FullScreen: () => import('@ds-mo/icons/svg/FullScreen').then(m => m.FullScreen),\n  FullScreenExit: () => import('@ds-mo/icons/svg/FullScreenExit').then(m => m.FullScreenExit),\n  Gauge: () => import('@ds-mo/icons/svg/Gauge').then(m => m.Gauge),\n  GaugeTemperature: () => import('@ds-mo/icons/svg/GaugeTemperature').then(m => m.GaugeTemperature),\n  Gear: () => import('@ds-mo/icons/svg/Gear').then(m => m.Gear),\n  GearCheck: () => import('@ds-mo/icons/svg/GearCheck').then(m => m.GearCheck),\n  Geofence: () => import('@ds-mo/icons/svg/Geofence').then(m => m.Geofence),\n  GeofenceCircle: () => import('@ds-mo/icons/svg/GeofenceCircle').then(m => m.GeofenceCircle),\n  GeofenceDiamond: () => import('@ds-mo/icons/svg/GeofenceDiamond').then(m => m.GeofenceDiamond),\n  GeofenceSquare: () => import('@ds-mo/icons/svg/GeofenceSquare').then(m => m.GeofenceSquare),\n  GlobeNetwork: () => import('@ds-mo/icons/svg/GlobeNetwork').then(m => m.GlobeNetwork),\n  GlobeWorldMap: () => import('@ds-mo/icons/svg/GlobeWorldMap').then(m => m.GlobeWorldMap),\n  Graph: () => import('@ds-mo/icons/svg/Graph').then(m => m.Graph),\n  GraphArrow: () => import('@ds-mo/icons/svg/GraphArrow').then(m => m.GraphArrow),\n  GraphBars: () => import('@ds-mo/icons/svg/GraphBars').then(m => m.GraphBars),\n  GraphDecreasing: () => import('@ds-mo/icons/svg/GraphDecreasing').then(m => m.GraphDecreasing),\n  GraphIncreasing: () => import('@ds-mo/icons/svg/GraphIncreasing').then(m => m.GraphIncreasing),\n  Hamburger: () => import('@ds-mo/icons/svg/Hamburger').then(m => m.Hamburger),\n  HandHeart: () => import('@ds-mo/icons/svg/HandHeart').then(m => m.HandHeart),\n  HandOpen: () => import('@ds-mo/icons/svg/HandOpen').then(m => m.HandOpen),\n  Headset: () => import('@ds-mo/icons/svg/Headset').then(m => m.Headset),\n  History: () => import('@ds-mo/icons/svg/History').then(m => m.History),\n  HourGlass: () => import('@ds-mo/icons/svg/HourGlass').then(m => m.HourGlass),\n  Image: () => import('@ds-mo/icons/svg/Image').then(m => m.Image),\n  Import: () => import('@ds-mo/icons/svg/Import').then(m => m.Import),\n  ImportClock: () => import('@ds-mo/icons/svg/ImportClock').then(m => m.ImportClock),\n  Inbox: () => import('@ds-mo/icons/svg/Inbox').then(m => m.Inbox),\n  IosFilled: () => import('@ds-mo/icons/svg/IosFilled').then(m => m.IosFilled),\n  Jerrycan: () => import('@ds-mo/icons/svg/Jerrycan').then(m => m.Jerrycan),\n  KeyA: () => import('@ds-mo/icons/svg/KeyA').then(m => m.KeyA),\n  KeyB: () => import('@ds-mo/icons/svg/KeyB').then(m => m.KeyB),\n  KeyCmd: () => import('@ds-mo/icons/svg/KeyCmd').then(m => m.KeyCmd),\n  KeyShift: () => import('@ds-mo/icons/svg/KeyShift').then(m => m.KeyShift),\n  LED: () => import('@ds-mo/icons/svg/LED').then(m => m.LED),\n  Layers: () => import('@ds-mo/icons/svg/Layers').then(m => m.Layers),\n  Leaf: () => import('@ds-mo/icons/svg/Leaf').then(m => m.Leaf),\n  LeftCollapse: () => import('@ds-mo/icons/svg/LeftCollapse').then(m => m.LeftCollapse),\n  LeftCollapseB: () => import('@ds-mo/icons/svg/LeftCollapseB').then(m => m.LeftCollapseB),\n  LeftExpand: () => import('@ds-mo/icons/svg/LeftExpand').then(m => m.LeftExpand),\n  LeftExpandB: () => import('@ds-mo/icons/svg/LeftExpandB').then(m => m.LeftExpandB),\n  LeftTurnSignal: () => import('@ds-mo/icons/svg/LeftTurnSignal').then(m => m.LeftTurnSignal),\n  LetterB: () => import('@ds-mo/icons/svg/LetterB').then(m => m.LetterB),\n  LetterC: () => import('@ds-mo/icons/svg/LetterC').then(m => m.LetterC),\n  LetterI: () => import('@ds-mo/icons/svg/LetterI').then(m => m.LetterI),\n  License: () => import('@ds-mo/icons/svg/License').then(m => m.License),\n  LicensePlate: () => import('@ds-mo/icons/svg/LicensePlate').then(m => m.LicensePlate),\n  Lifebuoy: () => import('@ds-mo/icons/svg/Lifebuoy').then(m => m.Lifebuoy),\n  Link: () => import('@ds-mo/icons/svg/Link').then(m => m.Link),\n  List: () => import('@ds-mo/icons/svg/List').then(m => m.List),\n  Loads: () => import('@ds-mo/icons/svg/Loads').then(m => m.Loads),\n  LocationPin: () => import('@ds-mo/icons/svg/LocationPin').then(m => m.LocationPin),\n  LocationPinArrows: () => import('@ds-mo/icons/svg/LocationPinArrows').then(m => m.LocationPinArrows),\n  LocationPinDisabled: () => import('@ds-mo/icons/svg/LocationPinDisabled').then(m => m.LocationPinDisabled),\n  LocationPinDollar: () => import('@ds-mo/icons/svg/LocationPinDollar').then(m => m.LocationPinDollar),\n  LockClosed: () => import('@ds-mo/icons/svg/LockClosed').then(m => m.LockClosed),\n  LockClosedFilled: () => import('@ds-mo/icons/svg/LockClosedFilled').then(m => m.LockClosedFilled),\n  LockOpen: () => import('@ds-mo/icons/svg/LockOpen').then(m => m.LockOpen),\n  Logout: () => import('@ds-mo/icons/svg/Logout').then(m => m.Logout),\n  Logs: () => import('@ds-mo/icons/svg/Logs').then(m => m.Logs),\n  LogsMagnifyingGlass: () => import('@ds-mo/icons/svg/LogsMagnifyingGlass').then(m => m.LogsMagnifyingGlass),\n  MagnifyingGlass: () => import('@ds-mo/icons/svg/MagnifyingGlass').then(m => m.MagnifyingGlass),\n  MagnifyingGlassGraph: () => import('@ds-mo/icons/svg/MagnifyingGlassGraph').then(m => m.MagnifyingGlassGraph),\n  MagnifyingGlassZoomIn: () => import('@ds-mo/icons/svg/MagnifyingGlassZoomIn').then(m => m.MagnifyingGlassZoomIn),\n  MagnifyingGlassZoomOut: () => import('@ds-mo/icons/svg/MagnifyingGlassZoomOut').then(m => m.MagnifyingGlassZoomOut),\n  MapNavigation: () => import('@ds-mo/icons/svg/MapNavigation').then(m => m.MapNavigation),\n  MapPage: () => import('@ds-mo/icons/svg/MapPage').then(m => m.MapPage),\n  MapPin: () => import('@ds-mo/icons/svg/MapPin').then(m => m.MapPin),\n  MarkRead: () => import('@ds-mo/icons/svg/MarkRead').then(m => m.MarkRead),\n  Match: () => import('@ds-mo/icons/svg/Match').then(m => m.Match),\n  MessageBubble: () => import('@ds-mo/icons/svg/MessageBubble').then(m => m.MessageBubble),\n  MessageBubbleStack: () => import('@ds-mo/icons/svg/MessageBubbleStack').then(m => m.MessageBubbleStack),\n  Messaging: () => import('@ds-mo/icons/svg/Messaging').then(m => m.Messaging),\n  Mic: () => import('@ds-mo/icons/svg/Mic').then(m => m.Mic),\n  MicMute: () => import('@ds-mo/icons/svg/MicMute').then(m => m.MicMute),\n  Minimize: () => import('@ds-mo/icons/svg/Minimize').then(m => m.Minimize),\n  Monitor: () => import('@ds-mo/icons/svg/Monitor').then(m => m.Monitor),\n  Notification: () => import('@ds-mo/icons/svg/Notification').then(m => m.Notification),\n  NumberTen: () => import('@ds-mo/icons/svg/NumberTen').then(m => m.NumberTen),\n  OctagonSubtract: () => import('@ds-mo/icons/svg/OctagonSubtract').then(m => m.OctagonSubtract),\n  Odometer: () => import('@ds-mo/icons/svg/Odometer').then(m => m.Odometer),\n  OverviewAI: () => import('@ds-mo/icons/svg/OverviewAI').then(m => m.OverviewAI),\n  PanelCollapse: () => import('@ds-mo/icons/svg/PanelCollapse').then(m => m.PanelCollapse),\n  PanelExpand: () => import('@ds-mo/icons/svg/PanelExpand').then(m => m.PanelExpand),\n  Paperclip: () => import('@ds-mo/icons/svg/Paperclip').then(m => m.Paperclip),\n  PaperplaneSend: () => import('@ds-mo/icons/svg/PaperplaneSend').then(m => m.PaperplaneSend),\n  Paragraph: () => import('@ds-mo/icons/svg/Paragraph').then(m => m.Paragraph),\n  ParagraphCheck: () => import('@ds-mo/icons/svg/ParagraphCheck').then(m => m.ParagraphCheck),\n  ParagraphPencil: () => import('@ds-mo/icons/svg/ParagraphPencil').then(m => m.ParagraphPencil),\n  Pause: () => import('@ds-mo/icons/svg/Pause').then(m => m.Pause),\n  PauseFilled: () => import('@ds-mo/icons/svg/PauseFilled').then(m => m.PauseFilled),\n  Pencil: () => import('@ds-mo/icons/svg/Pencil').then(m => m.Pencil),\n  PencilSquiggle: () => import('@ds-mo/icons/svg/PencilSquiggle').then(m => m.PencilSquiggle),\n  Person: () => import('@ds-mo/icons/svg/Person').then(m => m.Person),\n  PersonAt: () => import('@ds-mo/icons/svg/PersonAt').then(m => m.PersonAt),\n  PersonConnect: () => import('@ds-mo/icons/svg/PersonConnect').then(m => m.PersonConnect),\n  PersonFrame: () => import('@ds-mo/icons/svg/PersonFrame').then(m => m.PersonFrame),\n  PersonGear: () => import('@ds-mo/icons/svg/PersonGear').then(m => m.PersonGear),\n  PersonGroup: () => import('@ds-mo/icons/svg/PersonGroup').then(m => m.PersonGroup),\n  PersonGroupArrows: () => import('@ds-mo/icons/svg/PersonGroupArrows').then(m => m.PersonGroupArrows),\n  PersonGroupThree: () => import('@ds-mo/icons/svg/PersonGroupThree').then(m => m.PersonGroupThree),\n  PersonManager: () => import('@ds-mo/icons/svg/PersonManager').then(m => m.PersonManager),\n  PersonShield: () => import('@ds-mo/icons/svg/PersonShield').then(m => m.PersonShield),\n  PersonStar: () => import('@ds-mo/icons/svg/PersonStar').then(m => m.PersonStar),\n  Phone: () => import('@ds-mo/icons/svg/Phone').then(m => m.Phone),\n  PhoneDisconnect: () => import('@ds-mo/icons/svg/PhoneDisconnect').then(m => m.PhoneDisconnect),\n  PicmanFilled: () => import('@ds-mo/icons/svg/PicmanFilled').then(m => m.PicmanFilled),\n  Pin: () => import('@ds-mo/icons/svg/Pin').then(m => m.Pin),\n  PipBottomLeft: () => import('@ds-mo/icons/svg/PipBottomLeft').then(m => m.PipBottomLeft),\n  PipBottomRight: () => import('@ds-mo/icons/svg/PipBottomRight').then(m => m.PipBottomRight),\n  PipTopLeft: () => import('@ds-mo/icons/svg/PipTopLeft').then(m => m.PipTopLeft),\n  PipTopRight: () => import('@ds-mo/icons/svg/PipTopRight').then(m => m.PipTopRight),\n  Play: () => import('@ds-mo/icons/svg/Play').then(m => m.Play),\n  PlayFilled: () => import('@ds-mo/icons/svg/PlayFilled').then(m => m.PlayFilled),\n  Plug: () => import('@ds-mo/icons/svg/Plug').then(m => m.Plug),\n  Plus: () => import('@ds-mo/icons/svg/Plus').then(m => m.Plus),\n  PlusCircle: () => import('@ds-mo/icons/svg/PlusCircle').then(m => m.PlusCircle),\n  Preferences: () => import('@ds-mo/icons/svg/Preferences').then(m => m.Preferences),\n  Printer: () => import('@ds-mo/icons/svg/Printer').then(m => m.Printer),\n  PunchCard: () => import('@ds-mo/icons/svg/PunchCard').then(m => m.PunchCard),\n  Puzzle: () => import('@ds-mo/icons/svg/Puzzle').then(m => m.Puzzle),\n  PuzzleJoined: () => import('@ds-mo/icons/svg/PuzzleJoined').then(m => m.PuzzleJoined),\n  Redo: () => import('@ds-mo/icons/svg/Redo').then(m => m.Redo),\n  Refresh: () => import('@ds-mo/icons/svg/Refresh').then(m => m.Refresh),\n  Restore: () => import('@ds-mo/icons/svg/Restore').then(m => m.Restore),\n  RewardRibbon: () => import('@ds-mo/icons/svg/RewardRibbon').then(m => m.RewardRibbon),\n  Rewind: () => import('@ds-mo/icons/svg/Rewind').then(m => m.Rewind),\n  RewindSkip: () => import('@ds-mo/icons/svg/RewindSkip').then(m => m.RewindSkip),\n  RewindSkipFilled: () => import('@ds-mo/icons/svg/RewindSkipFilled').then(m => m.RewindSkipFilled),\n  RightCollapse: () => import('@ds-mo/icons/svg/RightCollapse').then(m => m.RightCollapse),\n  RightCollapseB: () => import('@ds-mo/icons/svg/RightCollapseB').then(m => m.RightCollapseB),\n  RightExpand: () => import('@ds-mo/icons/svg/RightExpand').then(m => m.RightExpand),\n  RightExpandB: () => import('@ds-mo/icons/svg/RightExpandB').then(m => m.RightExpandB),\n  RightTurnSignal: () => import('@ds-mo/icons/svg/RightTurnSignal').then(m => m.RightTurnSignal),\n  Rotate: () => import('@ds-mo/icons/svg/Rotate').then(m => m.Rotate),\n  Satellite: () => import('@ds-mo/icons/svg/Satellite').then(m => m.Satellite),\n  Scan: () => import('@ds-mo/icons/svg/Scan').then(m => m.Scan),\n  Scissor: () => import('@ds-mo/icons/svg/Scissor').then(m => m.Scissor),\n  Scope: () => import('@ds-mo/icons/svg/Scope').then(m => m.Scope),\n  Seatbelt: () => import('@ds-mo/icons/svg/Seatbelt').then(m => m.Seatbelt),\n  SeatbeltBuckle: () => import('@ds-mo/icons/svg/SeatbeltBuckle').then(m => m.SeatbeltBuckle),\n  SectionList: () => import('@ds-mo/icons/svg/SectionList').then(m => m.SectionList),\n  Shapes: () => import('@ds-mo/icons/svg/Shapes').then(m => m.Shapes),\n  ShareCircles: () => import('@ds-mo/icons/svg/ShareCircles').then(m => m.ShareCircles),\n  ShareCirclesFilled: () => import('@ds-mo/icons/svg/ShareCirclesFilled').then(m => m.ShareCirclesFilled),\n  SharePaperplane: () => import('@ds-mo/icons/svg/SharePaperplane').then(m => m.SharePaperplane),\n  Shield: () => import('@ds-mo/icons/svg/Shield').then(m => m.Shield),\n  ShieldCheck: () => import('@ds-mo/icons/svg/ShieldCheck').then(m => m.ShieldCheck),\n  ShieldCheckmarkFilled: () => import('@ds-mo/icons/svg/ShieldCheckmarkFilled').then(m => m.ShieldCheckmarkFilled),\n  ShieldCircle: () => import('@ds-mo/icons/svg/ShieldCircle').then(m => m.ShieldCircle),\n  ShieldCircleFilled: () => import('@ds-mo/icons/svg/ShieldCircleFilled').then(m => m.ShieldCircleFilled),\n  ShieldCross: () => import('@ds-mo/icons/svg/ShieldCross').then(m => m.ShieldCross),\n  ShieldCrossFilled: () => import('@ds-mo/icons/svg/ShieldCrossFilled').then(m => m.ShieldCrossFilled),\n  ShieldFilled: () => import('@ds-mo/icons/svg/ShieldFilled').then(m => m.ShieldFilled),\n  ShieldLock: () => import('@ds-mo/icons/svg/ShieldLock').then(m => m.ShieldLock),\n  ShieldLockFilled: () => import('@ds-mo/icons/svg/ShieldLockFilled').then(m => m.ShieldLockFilled),\n  ShieldPerson: () => import('@ds-mo/icons/svg/ShieldPerson').then(m => m.ShieldPerson),\n  ShoppingBag: () => import('@ds-mo/icons/svg/ShoppingBag').then(m => m.ShoppingBag),\n  Snowflake: () => import('@ds-mo/icons/svg/Snowflake').then(m => m.Snowflake),\n  SpeakerPhone: () => import('@ds-mo/icons/svg/SpeakerPhone').then(m => m.SpeakerPhone),\n  SpeedometerArrow: () => import('@ds-mo/icons/svg/SpeedometerArrow').then(m => m.SpeedometerArrow),\n  SpeedometerLeft: () => import('@ds-mo/icons/svg/SpeedometerLeft').then(m => m.SpeedometerLeft),\n  SpeedometerRight: () => import('@ds-mo/icons/svg/SpeedometerRight').then(m => m.SpeedometerRight),\n  SpikeCirclePercentage: () => import('@ds-mo/icons/svg/SpikeCirclePercentage').then(m => m.SpikeCirclePercentage),\n  SpikeCirclePercentageFilled: () => import('@ds-mo/icons/svg/SpikeCirclePercentageFilled').then(m => m.SpikeCirclePercentageFilled),\n  Square: () => import('@ds-mo/icons/svg/Square').then(m => m.Square),\n  SquareArrowTopRight: () => import('@ds-mo/icons/svg/SquareArrowTopRight').then(m => m.SquareArrowTopRight),\n  SquareCheck: () => import('@ds-mo/icons/svg/SquareCheck').then(m => m.SquareCheck),\n  SquareCheckFilled: () => import('@ds-mo/icons/svg/SquareCheckFilled').then(m => m.SquareCheckFilled),\n  SquareDollar: () => import('@ds-mo/icons/svg/SquareDollar').then(m => m.SquareDollar),\n  SquareDollarFilled: () => import('@ds-mo/icons/svg/SquareDollarFilled').then(m => m.SquareDollarFilled),\n  SquareDottedMinus: () => import('@ds-mo/icons/svg/SquareDottedMinus').then(m => m.SquareDottedMinus),\n  SquareFilled: () => import('@ds-mo/icons/svg/SquareFilled').then(m => m.SquareFilled),\n  SquareGrid: () => import('@ds-mo/icons/svg/SquareGrid').then(m => m.SquareGrid),\n  SquarePencil: () => import('@ds-mo/icons/svg/SquarePencil').then(m => m.SquarePencil),\n  SquarePlus: () => import('@ds-mo/icons/svg/SquarePlus').then(m => m.SquarePlus),\n  SquareSubtract: () => import('@ds-mo/icons/svg/SquareSubtract').then(m => m.SquareSubtract),\n  SquareSubtractFilled: () => import('@ds-mo/icons/svg/SquareSubtractFilled').then(m => m.SquareSubtractFilled),\n  Star: () => import('@ds-mo/icons/svg/Star').then(m => m.Star),\n  StarFilled: () => import('@ds-mo/icons/svg/StarFilled').then(m => m.StarFilled),\n  Stopwatch: () => import('@ds-mo/icons/svg/Stopwatch').then(m => m.Stopwatch),\n  Street: () => import('@ds-mo/icons/svg/Street').then(m => m.Street),\n  Subtract: () => import('@ds-mo/icons/svg/Subtract').then(m => m.Subtract),\n  SubtractCircle: () => import('@ds-mo/icons/svg/SubtractCircle').then(m => m.SubtractCircle),\n  SubtractCircleFilled: () => import('@ds-mo/icons/svg/SubtractCircleFilled').then(m => m.SubtractCircleFilled),\n  Table: () => import('@ds-mo/icons/svg/Table').then(m => m.Table),\n  Tag: () => import('@ds-mo/icons/svg/Tag').then(m => m.Tag),\n  Target: () => import('@ds-mo/icons/svg/Target').then(m => m.Target),\n  TargetDollar: () => import('@ds-mo/icons/svg/TargetDollar').then(m => m.TargetDollar),\n  Text: () => import('@ds-mo/icons/svg/Text').then(m => m.Text),\n  ThemeDark: () => import('@ds-mo/icons/svg/ThemeDark').then(m => m.ThemeDark),\n  ThemeLight: () => import('@ds-mo/icons/svg/ThemeLight').then(m => m.ThemeLight),\n  ThumbsDown: () => import('@ds-mo/icons/svg/ThumbsDown').then(m => m.ThumbsDown),\n  ThumbsDownFilled: () => import('@ds-mo/icons/svg/ThumbsDownFilled').then(m => m.ThumbsDownFilled),\n  ThumbsUp: () => import('@ds-mo/icons/svg/ThumbsUp').then(m => m.ThumbsUp),\n  ThumbsUpFilled: () => import('@ds-mo/icons/svg/ThumbsUpFilled').then(m => m.ThumbsUpFilled),\n  TirePressure: () => import('@ds-mo/icons/svg/TirePressure').then(m => m.TirePressure),\n  Toggle: () => import('@ds-mo/icons/svg/Toggle').then(m => m.Toggle),\n  TrafficLight: () => import('@ds-mo/icons/svg/TrafficLight').then(m => m.TrafficLight),\n  Trash: () => import('@ds-mo/icons/svg/Trash').then(m => m.Trash),\n  Trophy: () => import('@ds-mo/icons/svg/Trophy').then(m => m.Trophy),\n  TurnSignal: () => import('@ds-mo/icons/svg/TurnSignal').then(m => m.TurnSignal),\n  TurnSignalFilled: () => import('@ds-mo/icons/svg/TurnSignalFilled').then(m => m.TurnSignalFilled),\n  Undo: () => import('@ds-mo/icons/svg/Undo').then(m => m.Undo),\n  Upgrade: () => import('@ds-mo/icons/svg/Upgrade').then(m => m.Upgrade),\n  Upload: () => import('@ds-mo/icons/svg/Upload').then(m => m.Upload),\n  VehicleTrailer: () => import('@ds-mo/icons/svg/VehicleTrailer').then(m => m.VehicleTrailer),\n  VehicleTruck: () => import('@ds-mo/icons/svg/VehicleTruck').then(m => m.VehicleTruck),\n  VehicleTruckMagnifyingGlass: () => import('@ds-mo/icons/svg/VehicleTruckMagnifyingGlass').then(m => m.VehicleTruckMagnifyingGlass),\n  Video: () => import('@ds-mo/icons/svg/Video').then(m => m.Video),\n  ViewMenu: () => import('@ds-mo/icons/svg/ViewMenu').then(m => m.ViewMenu),\n  Volume: () => import('@ds-mo/icons/svg/Volume').then(m => m.Volume),\n  VolumeFilled: () => import('@ds-mo/icons/svg/VolumeFilled').then(m => m.VolumeFilled),\n  VolumeMute: () => import('@ds-mo/icons/svg/VolumeMute').then(m => m.VolumeMute),\n  VolumeMuteFilled: () => import('@ds-mo/icons/svg/VolumeMuteFilled').then(m => m.VolumeMuteFilled),\n  WandSparkle: () => import('@ds-mo/icons/svg/WandSparkle').then(m => m.WandSparkle),\n  Waveform: () => import('@ds-mo/icons/svg/Waveform').then(m => m.Waveform),\n  Webhooks: () => import('@ds-mo/icons/svg/Webhooks').then(m => m.Webhooks),\n  Whistle: () => import('@ds-mo/icons/svg/Whistle').then(m => m.Whistle),\n  WifiHorizontal: () => import('@ds-mo/icons/svg/WifiHorizontal').then(m => m.WifiHorizontal),\n  WifiTower: () => import('@ds-mo/icons/svg/WifiTower').then(m => m.WifiTower),\n  WifiVertical: () => import('@ds-mo/icons/svg/WifiVertical').then(m => m.WifiVertical),\n  WifiVerticalFilled: () => import('@ds-mo/icons/svg/WifiVerticalFilled').then(m => m.WifiVerticalFilled),\n  WifiVerticalFilledDisabled: () => import('@ds-mo/icons/svg/WifiVerticalFilledDisabled').then(m => m.WifiVerticalFilledDisabled),\n  WorkflowA: () => import('@ds-mo/icons/svg/WorkflowA').then(m => m.WorkflowA),\n  WorkflowB: () => import('@ds-mo/icons/svg/WorkflowB').then(m => m.WorkflowB),\n  Wrench: () => import('@ds-mo/icons/svg/Wrench').then(m => m.Wrench),\n  ZoomBackOut: () => import('@ds-mo/icons/svg/ZoomBackOut').then(m => m.ZoomBackOut),\n};\n",
+      "content": "/** Auto-generated by scripts/generate-icon-catalog.mjs — do not edit. */\n\nexport const systemIconLoaders: Record<string, () => Promise<string>> = {\n  AIAsterisk: () => import('@ds-mo/icons/svg/AIAsterisk').then(m => m.AIAsterisk),\n  AIChip: () => import('@ds-mo/icons/svg/AIChip').then(m => m.AIChip),\n  AICompass: () => import('@ds-mo/icons/svg/AICompass').then(m => m.AICompass),\n  AISparkle: () => import('@ds-mo/icons/svg/AISparkle').then(m => m.AISparkle),\n  AUX1: () => import('@ds-mo/icons/svg/AUX1').then(m => m.AUX1),\n  AUXFilled: () => import('@ds-mo/icons/svg/AUXFilled').then(m => m.AUXFilled),\n  Android: () => import('@ds-mo/icons/svg/Android').then(m => m.Android),\n  AndroidFilled: () => import('@ds-mo/icons/svg/AndroidFilled').then(m => m.AndroidFilled),\n  ArrowCircle: () => import('@ds-mo/icons/svg/ArrowCircle').then(m => m.ArrowCircle),\n  ArrowDown: () => import('@ds-mo/icons/svg/ArrowDown').then(m => m.ArrowDown),\n  ArrowLeft: () => import('@ds-mo/icons/svg/ArrowLeft').then(m => m.ArrowLeft),\n  ArrowRight: () => import('@ds-mo/icons/svg/ArrowRight').then(m => m.ArrowRight),\n  ArrowTopRightSquare: () => import('@ds-mo/icons/svg/ArrowTopRightSquare').then(m => m.ArrowTopRightSquare),\n  ArrowUp: () => import('@ds-mo/icons/svg/ArrowUp').then(m => m.ArrowUp),\n  ArrowZoomBack: () => import('@ds-mo/icons/svg/ArrowZoomBack').then(m => m.ArrowZoomBack),\n  ArrowsDiagonal: () => import('@ds-mo/icons/svg/ArrowsDiagonal').then(m => m.ArrowsDiagonal),\n  ArrowsDiff: () => import('@ds-mo/icons/svg/ArrowsDiff').then(m => m.ArrowsDiff),\n  ArrowsDiffCircle: () => import('@ds-mo/icons/svg/ArrowsDiffCircle').then(m => m.ArrowsDiffCircle),\n  ArrowsDiffCircleStrikethrough: () => import('@ds-mo/icons/svg/ArrowsDiffCircleStrikethrough').then(m => m.ArrowsDiffCircleStrikethrough),\n  ArrowsDiffStrikethrough: () => import('@ds-mo/icons/svg/ArrowsDiffStrikethrough').then(m => m.ArrowsDiffStrikethrough),\n  ArrowsVertical: () => import('@ds-mo/icons/svg/ArrowsVertical').then(m => m.ArrowsVertical),\n  AtSign: () => import('@ds-mo/icons/svg/AtSign').then(m => m.AtSign),\n  BackslashBrackets: () => import('@ds-mo/icons/svg/BackslashBrackets').then(m => m.BackslashBrackets),\n  BatteryCharging: () => import('@ds-mo/icons/svg/BatteryCharging').then(m => m.BatteryCharging),\n  BatteryEmpty: () => import('@ds-mo/icons/svg/BatteryEmpty').then(m => m.BatteryEmpty),\n  BatteryFull: () => import('@ds-mo/icons/svg/BatteryFull').then(m => m.BatteryFull),\n  BatteryHalf: () => import('@ds-mo/icons/svg/BatteryHalf').then(m => m.BatteryHalf),\n  BatteryLow: () => import('@ds-mo/icons/svg/BatteryLow').then(m => m.BatteryLow),\n  Beaker: () => import('@ds-mo/icons/svg/Beaker').then(m => m.Beaker),\n  Bell: () => import('@ds-mo/icons/svg/Bell').then(m => m.Bell),\n  BellDot: () => import('@ds-mo/icons/svg/BellDot').then(m => m.BellDot),\n  BellFilled: () => import('@ds-mo/icons/svg/BellFilled').then(m => m.BellFilled),\n  BellRinging: () => import('@ds-mo/icons/svg/BellRinging').then(m => m.BellRinging),\n  BellWifi: () => import('@ds-mo/icons/svg/BellWifi').then(m => m.BellWifi),\n  BlackWhite: () => import('@ds-mo/icons/svg/BlackWhite').then(m => m.BlackWhite),\n  BlankUI: () => import('@ds-mo/icons/svg/BlankUI').then(m => m.BlankUI),\n  Bluetooth: () => import('@ds-mo/icons/svg/Bluetooth').then(m => m.Bluetooth),\n  Bolt: () => import('@ds-mo/icons/svg/Bolt').then(m => m.Bolt),\n  BoltFilled: () => import('@ds-mo/icons/svg/BoltFilled').then(m => m.BoltFilled),\n  Bookmark: () => import('@ds-mo/icons/svg/Bookmark').then(m => m.Bookmark),\n  Box: () => import('@ds-mo/icons/svg/Box').then(m => m.Box),\n  Braces: () => import('@ds-mo/icons/svg/Braces').then(m => m.Braces),\n  BracketsCircle: () => import('@ds-mo/icons/svg/BracketsCircle').then(m => m.BracketsCircle),\n  Bug: () => import('@ds-mo/icons/svg/Bug').then(m => m.Bug),\n  BuildingFacility: () => import('@ds-mo/icons/svg/BuildingFacility').then(m => m.BuildingFacility),\n  BuildingHome: () => import('@ds-mo/icons/svg/BuildingHome').then(m => m.BuildingHome),\n  BuildingOffice: () => import('@ds-mo/icons/svg/BuildingOffice').then(m => m.BuildingOffice),\n  BuildingPublic: () => import('@ds-mo/icons/svg/BuildingPublic').then(m => m.BuildingPublic),\n  BuildingShop: () => import('@ds-mo/icons/svg/BuildingShop').then(m => m.BuildingShop),\n  Bulb: () => import('@ds-mo/icons/svg/Bulb').then(m => m.Bulb),\n  Calculator: () => import('@ds-mo/icons/svg/Calculator').then(m => m.Calculator),\n  Calendar: () => import('@ds-mo/icons/svg/Calendar').then(m => m.Calendar),\n  CalendarClock: () => import('@ds-mo/icons/svg/CalendarClock').then(m => m.CalendarClock),\n  Camera: () => import('@ds-mo/icons/svg/Camera').then(m => m.Camera),\n  Card: () => import('@ds-mo/icons/svg/Card').then(m => m.Card),\n  CardPerson: () => import('@ds-mo/icons/svg/CardPerson').then(m => m.CardPerson),\n  Cart: () => import('@ds-mo/icons/svg/Cart').then(m => m.Cart),\n  Chart: () => import('@ds-mo/icons/svg/Chart').then(m => m.Chart),\n  Check: () => import('@ds-mo/icons/svg/Check').then(m => m.Check),\n  CheckCircle: () => import('@ds-mo/icons/svg/CheckCircle').then(m => m.CheckCircle),\n  CheckCircleFilled: () => import('@ds-mo/icons/svg/CheckCircleFilled').then(m => m.CheckCircleFilled),\n  CheckDouble: () => import('@ds-mo/icons/svg/CheckDouble').then(m => m.CheckDouble),\n  CheckSquare: () => import('@ds-mo/icons/svg/CheckSquare').then(m => m.CheckSquare),\n  CheckSquareFilled: () => import('@ds-mo/icons/svg/CheckSquareFilled').then(m => m.CheckSquareFilled),\n  ChevronDown: () => import('@ds-mo/icons/svg/ChevronDown').then(m => m.ChevronDown),\n  ChevronDownUp: () => import('@ds-mo/icons/svg/ChevronDownUp').then(m => m.ChevronDownUp),\n  ChevronLeft: () => import('@ds-mo/icons/svg/ChevronLeft').then(m => m.ChevronLeft),\n  ChevronLeftDouble: () => import('@ds-mo/icons/svg/ChevronLeftDouble').then(m => m.ChevronLeftDouble),\n  ChevronRight: () => import('@ds-mo/icons/svg/ChevronRight').then(m => m.ChevronRight),\n  ChevronRightDouble: () => import('@ds-mo/icons/svg/ChevronRightDouble').then(m => m.ChevronRightDouble),\n  ChevronUp: () => import('@ds-mo/icons/svg/ChevronUp').then(m => m.ChevronUp),\n  ChevronUpDown: () => import('@ds-mo/icons/svg/ChevronUpDown').then(m => m.ChevronUpDown),\n  Circle: () => import('@ds-mo/icons/svg/Circle').then(m => m.Circle),\n  CircleConcentricFilled: () => import('@ds-mo/icons/svg/CircleConcentricFilled').then(m => m.CircleConcentricFilled),\n  CircleConcentricThree: () => import('@ds-mo/icons/svg/CircleConcentricThree').then(m => m.CircleConcentricThree),\n  CircleConcentricTwo: () => import('@ds-mo/icons/svg/CircleConcentricTwo').then(m => m.CircleConcentricTwo),\n  CircleDiamond: () => import('@ds-mo/icons/svg/CircleDiamond').then(m => m.CircleDiamond),\n  CircleFilled: () => import('@ds-mo/icons/svg/CircleFilled').then(m => m.CircleFilled),\n  CircleGrid: () => import('@ds-mo/icons/svg/CircleGrid').then(m => m.CircleGrid),\n  CircleSlash: () => import('@ds-mo/icons/svg/CircleSlash').then(m => m.CircleSlash),\n  Clipboard: () => import('@ds-mo/icons/svg/Clipboard').then(m => m.Clipboard),\n  ClipboardCheck: () => import('@ds-mo/icons/svg/ClipboardCheck').then(m => m.ClipboardCheck),\n  Clock: () => import('@ds-mo/icons/svg/Clock').then(m => m.Clock),\n  ClockDefer: () => import('@ds-mo/icons/svg/ClockDefer').then(m => m.ClockDefer),\n  ClockFilled: () => import('@ds-mo/icons/svg/ClockFilled').then(m => m.ClockFilled),\n  ClockSixteenHour: () => import('@ds-mo/icons/svg/ClockSixteenHour').then(m => m.ClockSixteenHour),\n  Cloud: () => import('@ds-mo/icons/svg/Cloud').then(m => m.Cloud),\n  CloudEllipses: () => import('@ds-mo/icons/svg/CloudEllipses').then(m => m.CloudEllipses),\n  CloudLightning: () => import('@ds-mo/icons/svg/CloudLightning').then(m => m.CloudLightning),\n  CloudRain: () => import('@ds-mo/icons/svg/CloudRain').then(m => m.CloudRain),\n  CloudRainSun: () => import('@ds-mo/icons/svg/CloudRainSun').then(m => m.CloudRainSun),\n  CloudSun: () => import('@ds-mo/icons/svg/CloudSun').then(m => m.CloudSun),\n  CloudWind: () => import('@ds-mo/icons/svg/CloudWind').then(m => m.CloudWind),\n  Coin: () => import('@ds-mo/icons/svg/Coin').then(m => m.Coin),\n  CoinStack: () => import('@ds-mo/icons/svg/CoinStack').then(m => m.CoinStack),\n  CoinStackGeneral: () => import('@ds-mo/icons/svg/CoinStackGeneral').then(m => m.CoinStackGeneral),\n  CombustionEngine: () => import('@ds-mo/icons/svg/CombustionEngine').then(m => m.CombustionEngine),\n  Compass: () => import('@ds-mo/icons/svg/Compass').then(m => m.Compass),\n  Copy: () => import('@ds-mo/icons/svg/Copy').then(m => m.Copy),\n  Crop: () => import('@ds-mo/icons/svg/Crop').then(m => m.Crop),\n  Cross: () => import('@ds-mo/icons/svg/Cross').then(m => m.Cross),\n  CrossCircle: () => import('@ds-mo/icons/svg/CrossCircle').then(m => m.CrossCircle),\n  CrossCircleFilled: () => import('@ds-mo/icons/svg/CrossCircleFilled').then(m => m.CrossCircleFilled),\n  Cube: () => import('@ds-mo/icons/svg/Cube').then(m => m.Cube),\n  Cup: () => import('@ds-mo/icons/svg/Cup').then(m => m.Cup),\n  CursorPointer: () => import('@ds-mo/icons/svg/CursorPointer').then(m => m.CursorPointer),\n  CursorPointerMinus: () => import('@ds-mo/icons/svg/CursorPointerMinus').then(m => m.CursorPointerMinus),\n  CursorPointerPlus: () => import('@ds-mo/icons/svg/CursorPointerPlus').then(m => m.CursorPointerPlus),\n  Dashboard: () => import('@ds-mo/icons/svg/Dashboard').then(m => m.Dashboard),\n  DeviceAIDashcamPlus: () => import('@ds-mo/icons/svg/DeviceAIDashcamPlus').then(m => m.DeviceAIDashcamPlus),\n  DeviceAssetTracker: () => import('@ds-mo/icons/svg/DeviceAssetTracker').then(m => m.DeviceAssetTracker),\n  DeviceCameraCeiling: () => import('@ds-mo/icons/svg/DeviceCameraCeiling').then(m => m.DeviceCameraCeiling),\n  DeviceDVR: () => import('@ds-mo/icons/svg/DeviceDVR').then(m => m.DeviceDVR),\n  DeviceDashcam: () => import('@ds-mo/icons/svg/DeviceDashcam').then(m => m.DeviceDashcam),\n  DeviceDashcamLiveStream: () => import('@ds-mo/icons/svg/DeviceDashcamLiveStream').then(m => m.DeviceDashcamLiveStream),\n  DeviceDoorSensor: () => import('@ds-mo/icons/svg/DeviceDoorSensor').then(m => m.DeviceDoorSensor),\n  DeviceMobile: () => import('@ds-mo/icons/svg/DeviceMobile').then(m => m.DeviceMobile),\n  DeviceMobileTwo: () => import('@ds-mo/icons/svg/DeviceMobileTwo').then(m => m.DeviceMobileTwo),\n  DeviceOmnicam: () => import('@ds-mo/icons/svg/DeviceOmnicam').then(m => m.DeviceOmnicam),\n  DeviceSensor: () => import('@ds-mo/icons/svg/DeviceSensor').then(m => m.DeviceSensor),\n  DeviceTablet: () => import('@ds-mo/icons/svg/DeviceTablet').then(m => m.DeviceTablet),\n  DeviceVehicleGateway: () => import('@ds-mo/icons/svg/DeviceVehicleGateway').then(m => m.DeviceVehicleGateway),\n  Devices: () => import('@ds-mo/icons/svg/Devices').then(m => m.Devices),\n  Document: () => import('@ds-mo/icons/svg/Document').then(m => m.Document),\n  DocumentArrow: () => import('@ds-mo/icons/svg/DocumentArrow').then(m => m.DocumentArrow),\n  DocumentChart: () => import('@ds-mo/icons/svg/DocumentChart').then(m => m.DocumentChart),\n  DocumentDollar: () => import('@ds-mo/icons/svg/DocumentDollar').then(m => m.DocumentDollar),\n  DocumentGear: () => import('@ds-mo/icons/svg/DocumentGear').then(m => m.DocumentGear),\n  DocumentInverted: () => import('@ds-mo/icons/svg/DocumentInverted').then(m => m.DocumentInverted),\n  DocumentLogs: () => import('@ds-mo/icons/svg/DocumentLogs').then(m => m.DocumentLogs),\n  DocumentLogsMagnifyingGlass: () => import('@ds-mo/icons/svg/DocumentLogsMagnifyingGlass').then(m => m.DocumentLogsMagnifyingGlass),\n  DocumentPencil: () => import('@ds-mo/icons/svg/DocumentPencil').then(m => m.DocumentPencil),\n  DocumentPlus: () => import('@ds-mo/icons/svg/DocumentPlus').then(m => m.DocumentPlus),\n  DocumentQuestion: () => import('@ds-mo/icons/svg/DocumentQuestion').then(m => m.DocumentQuestion),\n  DocumentReceipt: () => import('@ds-mo/icons/svg/DocumentReceipt').then(m => m.DocumentReceipt),\n  DocumentStacked: () => import('@ds-mo/icons/svg/DocumentStacked').then(m => m.DocumentStacked),\n  DollarSquare: () => import('@ds-mo/icons/svg/DollarSquare').then(m => m.DollarSquare),\n  DollarSquareFilled: () => import('@ds-mo/icons/svg/DollarSquareFilled').then(m => m.DollarSquareFilled),\n  Dot: () => import('@ds-mo/icons/svg/Dot').then(m => m.Dot),\n  DotFilled: () => import('@ds-mo/icons/svg/DotFilled').then(m => m.DotFilled),\n  Download: () => import('@ds-mo/icons/svg/Download').then(m => m.Download),\n  DragDots: () => import('@ds-mo/icons/svg/DragDots').then(m => m.DragDots),\n  Ellipses: () => import('@ds-mo/icons/svg/Ellipses').then(m => m.Ellipses),\n  Email: () => import('@ds-mo/icons/svg/Email').then(m => m.Email),\n  EntityAsset: () => import('@ds-mo/icons/svg/EntityAsset').then(m => m.EntityAsset),\n  EntityAssetFilled: () => import('@ds-mo/icons/svg/EntityAssetFilled').then(m => m.EntityAssetFilled),\n  EntityPerson: () => import('@ds-mo/icons/svg/EntityPerson').then(m => m.EntityPerson),\n  EntityPersonFilled: () => import('@ds-mo/icons/svg/EntityPersonFilled').then(m => m.EntityPersonFilled),\n  EntityTravelGroup: () => import('@ds-mo/icons/svg/EntityTravelGroup').then(m => m.EntityTravelGroup),\n  EntityTravelGroupFilled: () => import('@ds-mo/icons/svg/EntityTravelGroupFilled').then(m => m.EntityTravelGroupFilled),\n  EntityVehicle: () => import('@ds-mo/icons/svg/EntityVehicle').then(m => m.EntityVehicle),\n  EntityVehicleCharging: () => import('@ds-mo/icons/svg/EntityVehicleCharging').then(m => m.EntityVehicleCharging),\n  EntityVehicleChargingFilled: () => import('@ds-mo/icons/svg/EntityVehicleChargingFilled').then(m => m.EntityVehicleChargingFilled),\n  EntityVehicleFilled: () => import('@ds-mo/icons/svg/EntityVehicleFilled').then(m => m.EntityVehicleFilled),\n  EntityVehicleImmobilized: () => import('@ds-mo/icons/svg/EntityVehicleImmobilized').then(m => m.EntityVehicleImmobilized),\n  EntityVehicleImmobilizedFilled: () => import('@ds-mo/icons/svg/EntityVehicleImmobilizedFilled').then(m => m.EntityVehicleImmobilizedFilled),\n  ExclamationBell: () => import('@ds-mo/icons/svg/ExclamationBell').then(m => m.ExclamationBell),\n  ExclamationCircle: () => import('@ds-mo/icons/svg/ExclamationCircle').then(m => m.ExclamationCircle),\n  ExclamationCircleFilled: () => import('@ds-mo/icons/svg/ExclamationCircleFilled').then(m => m.ExclamationCircleFilled),\n  ExclamationTriangle: () => import('@ds-mo/icons/svg/ExclamationTriangle').then(m => m.ExclamationTriangle),\n  ExclamationTriangleFilled: () => import('@ds-mo/icons/svg/ExclamationTriangleFilled').then(m => m.ExclamationTriangleFilled),\n  Export: () => import('@ds-mo/icons/svg/Export').then(m => m.Export),\n  ExternalLink: () => import('@ds-mo/icons/svg/ExternalLink').then(m => m.ExternalLink),\n  Eye: () => import('@ds-mo/icons/svg/Eye').then(m => m.Eye),\n  EyeLock: () => import('@ds-mo/icons/svg/EyeLock').then(m => m.EyeLock),\n  EyeStrikethrough: () => import('@ds-mo/icons/svg/EyeStrikethrough').then(m => m.EyeStrikethrough),\n  FastForward: () => import('@ds-mo/icons/svg/FastForward').then(m => m.FastForward),\n  FastForwardCircle: () => import('@ds-mo/icons/svg/FastForwardCircle').then(m => m.FastForwardCircle),\n  FastForwardSkip: () => import('@ds-mo/icons/svg/FastForwardSkip').then(m => m.FastForwardSkip),\n  Filters: () => import('@ds-mo/icons/svg/Filters').then(m => m.Filters),\n  FitToScreen: () => import('@ds-mo/icons/svg/FitToScreen').then(m => m.FitToScreen),\n  Flag: () => import('@ds-mo/icons/svg/Flag').then(m => m.Flag),\n  FlagFilled: () => import('@ds-mo/icons/svg/FlagFilled').then(m => m.FlagFilled),\n  FloppyDisk: () => import('@ds-mo/icons/svg/FloppyDisk').then(m => m.FloppyDisk),\n  Folder: () => import('@ds-mo/icons/svg/Folder').then(m => m.Folder),\n  FolderFilled: () => import('@ds-mo/icons/svg/FolderFilled').then(m => m.FolderFilled),\n  FuelPump: () => import('@ds-mo/icons/svg/FuelPump').then(m => m.FuelPump),\n  FullScreen: () => import('@ds-mo/icons/svg/FullScreen').then(m => m.FullScreen),\n  FullScreenExit: () => import('@ds-mo/icons/svg/FullScreenExit').then(m => m.FullScreenExit),\n  Gauge: () => import('@ds-mo/icons/svg/Gauge').then(m => m.Gauge),\n  GaugeTemperature: () => import('@ds-mo/icons/svg/GaugeTemperature').then(m => m.GaugeTemperature),\n  Gear: () => import('@ds-mo/icons/svg/Gear').then(m => m.Gear),\n  GearCheck: () => import('@ds-mo/icons/svg/GearCheck').then(m => m.GearCheck),\n  Geofence: () => import('@ds-mo/icons/svg/Geofence').then(m => m.Geofence),\n  GeofenceCircle: () => import('@ds-mo/icons/svg/GeofenceCircle').then(m => m.GeofenceCircle),\n  GeofenceDiamond: () => import('@ds-mo/icons/svg/GeofenceDiamond').then(m => m.GeofenceDiamond),\n  GeofenceSquare: () => import('@ds-mo/icons/svg/GeofenceSquare').then(m => m.GeofenceSquare),\n  GlobeNetwork: () => import('@ds-mo/icons/svg/GlobeNetwork').then(m => m.GlobeNetwork),\n  GlobeWorldMap: () => import('@ds-mo/icons/svg/GlobeWorldMap').then(m => m.GlobeWorldMap),\n  Graph: () => import('@ds-mo/icons/svg/Graph').then(m => m.Graph),\n  GraphArrow: () => import('@ds-mo/icons/svg/GraphArrow').then(m => m.GraphArrow),\n  GraphBars: () => import('@ds-mo/icons/svg/GraphBars').then(m => m.GraphBars),\n  GraphDecreasing: () => import('@ds-mo/icons/svg/GraphDecreasing').then(m => m.GraphDecreasing),\n  GraphIncreasing: () => import('@ds-mo/icons/svg/GraphIncreasing').then(m => m.GraphIncreasing),\n  Hamburger: () => import('@ds-mo/icons/svg/Hamburger').then(m => m.Hamburger),\n  HandHeart: () => import('@ds-mo/icons/svg/HandHeart').then(m => m.HandHeart),\n  HandOpen: () => import('@ds-mo/icons/svg/HandOpen').then(m => m.HandOpen),\n  Headset: () => import('@ds-mo/icons/svg/Headset').then(m => m.Headset),\n  History: () => import('@ds-mo/icons/svg/History').then(m => m.History),\n  HourGlass: () => import('@ds-mo/icons/svg/HourGlass').then(m => m.HourGlass),\n  Image: () => import('@ds-mo/icons/svg/Image').then(m => m.Image),\n  Import: () => import('@ds-mo/icons/svg/Import').then(m => m.Import),\n  ImportClock: () => import('@ds-mo/icons/svg/ImportClock').then(m => m.ImportClock),\n  Inbox: () => import('@ds-mo/icons/svg/Inbox').then(m => m.Inbox),\n  IosFilled: () => import('@ds-mo/icons/svg/IosFilled').then(m => m.IosFilled),\n  Jerrycan: () => import('@ds-mo/icons/svg/Jerrycan').then(m => m.Jerrycan),\n  KeyA: () => import('@ds-mo/icons/svg/KeyA').then(m => m.KeyA),\n  KeyB: () => import('@ds-mo/icons/svg/KeyB').then(m => m.KeyB),\n  KeyCmd: () => import('@ds-mo/icons/svg/KeyCmd').then(m => m.KeyCmd),\n  KeyEnter: () => import('@ds-mo/icons/svg/KeyEnter').then(m => m.KeyEnter),\n  KeyShift: () => import('@ds-mo/icons/svg/KeyShift').then(m => m.KeyShift),\n  LED: () => import('@ds-mo/icons/svg/LED').then(m => m.LED),\n  Layers: () => import('@ds-mo/icons/svg/Layers').then(m => m.Layers),\n  Leaf: () => import('@ds-mo/icons/svg/Leaf').then(m => m.Leaf),\n  LeftCollapse: () => import('@ds-mo/icons/svg/LeftCollapse').then(m => m.LeftCollapse),\n  LeftCollapseB: () => import('@ds-mo/icons/svg/LeftCollapseB').then(m => m.LeftCollapseB),\n  LeftExpand: () => import('@ds-mo/icons/svg/LeftExpand').then(m => m.LeftExpand),\n  LeftExpandB: () => import('@ds-mo/icons/svg/LeftExpandB').then(m => m.LeftExpandB),\n  LetterBCircle: () => import('@ds-mo/icons/svg/LetterBCircle').then(m => m.LetterBCircle),\n  LetterCCircle: () => import('@ds-mo/icons/svg/LetterCCircle').then(m => m.LetterCCircle),\n  LetterICircle: () => import('@ds-mo/icons/svg/LetterICircle').then(m => m.LetterICircle),\n  LicenseCard: () => import('@ds-mo/icons/svg/LicenseCard').then(m => m.LicenseCard),\n  LicensePlate: () => import('@ds-mo/icons/svg/LicensePlate').then(m => m.LicensePlate),\n  Lifebuoy: () => import('@ds-mo/icons/svg/Lifebuoy').then(m => m.Lifebuoy),\n  Link: () => import('@ds-mo/icons/svg/Link').then(m => m.Link),\n  List: () => import('@ds-mo/icons/svg/List').then(m => m.List),\n  Loads: () => import('@ds-mo/icons/svg/Loads').then(m => m.Loads),\n  LocationPin: () => import('@ds-mo/icons/svg/LocationPin').then(m => m.LocationPin),\n  LocationPinArrows: () => import('@ds-mo/icons/svg/LocationPinArrows').then(m => m.LocationPinArrows),\n  LocationPinDollar: () => import('@ds-mo/icons/svg/LocationPinDollar').then(m => m.LocationPinDollar),\n  LocationPinStrikethrough: () => import('@ds-mo/icons/svg/LocationPinStrikethrough').then(m => m.LocationPinStrikethrough),\n  LockClosed: () => import('@ds-mo/icons/svg/LockClosed').then(m => m.LockClosed),\n  LockClosedFilled: () => import('@ds-mo/icons/svg/LockClosedFilled').then(m => m.LockClosedFilled),\n  LockOpen: () => import('@ds-mo/icons/svg/LockOpen').then(m => m.LockOpen),\n  Logout: () => import('@ds-mo/icons/svg/Logout').then(m => m.Logout),\n  MagnifyingGlass: () => import('@ds-mo/icons/svg/MagnifyingGlass').then(m => m.MagnifyingGlass),\n  MagnifyingGlassGraph: () => import('@ds-mo/icons/svg/MagnifyingGlassGraph').then(m => m.MagnifyingGlassGraph),\n  MagnifyingGlassZoomIn: () => import('@ds-mo/icons/svg/MagnifyingGlassZoomIn').then(m => m.MagnifyingGlassZoomIn),\n  MagnifyingGlassZoomOut: () => import('@ds-mo/icons/svg/MagnifyingGlassZoomOut').then(m => m.MagnifyingGlassZoomOut),\n  MailMessage: () => import('@ds-mo/icons/svg/MailMessage').then(m => m.MailMessage),\n  MapNavigation: () => import('@ds-mo/icons/svg/MapNavigation').then(m => m.MapNavigation),\n  MapPage: () => import('@ds-mo/icons/svg/MapPage').then(m => m.MapPage),\n  MapPin: () => import('@ds-mo/icons/svg/MapPin').then(m => m.MapPin),\n  MapStreet: () => import('@ds-mo/icons/svg/MapStreet').then(m => m.MapStreet),\n  Match: () => import('@ds-mo/icons/svg/Match').then(m => m.Match),\n  MessageBubble: () => import('@ds-mo/icons/svg/MessageBubble').then(m => m.MessageBubble),\n  MessageBubbleStack: () => import('@ds-mo/icons/svg/MessageBubbleStack').then(m => m.MessageBubbleStack),\n  Mic: () => import('@ds-mo/icons/svg/Mic').then(m => m.Mic),\n  MicStrikethrough: () => import('@ds-mo/icons/svg/MicStrikethrough').then(m => m.MicStrikethrough),\n  Minimize: () => import('@ds-mo/icons/svg/Minimize').then(m => m.Minimize),\n  Minus: () => import('@ds-mo/icons/svg/Minus').then(m => m.Minus),\n  MinusCircle: () => import('@ds-mo/icons/svg/MinusCircle').then(m => m.MinusCircle),\n  MinusCircleFilled: () => import('@ds-mo/icons/svg/MinusCircleFilled').then(m => m.MinusCircleFilled),\n  MinusOctagon: () => import('@ds-mo/icons/svg/MinusOctagon').then(m => m.MinusOctagon),\n  MinusSquare: () => import('@ds-mo/icons/svg/MinusSquare').then(m => m.MinusSquare),\n  MinusSquareFilled: () => import('@ds-mo/icons/svg/MinusSquareFilled').then(m => m.MinusSquareFilled),\n  Monitor: () => import('@ds-mo/icons/svg/Monitor').then(m => m.Monitor),\n  Notification: () => import('@ds-mo/icons/svg/Notification').then(m => m.Notification),\n  NumberTen: () => import('@ds-mo/icons/svg/NumberTen').then(m => m.NumberTen),\n  Odometer: () => import('@ds-mo/icons/svg/Odometer').then(m => m.Odometer),\n  PanelCollapse: () => import('@ds-mo/icons/svg/PanelCollapse').then(m => m.PanelCollapse),\n  PanelExpand: () => import('@ds-mo/icons/svg/PanelExpand').then(m => m.PanelExpand),\n  Paperclip: () => import('@ds-mo/icons/svg/Paperclip').then(m => m.Paperclip),\n  PaperplaneSend: () => import('@ds-mo/icons/svg/PaperplaneSend').then(m => m.PaperplaneSend),\n  Paragraph: () => import('@ds-mo/icons/svg/Paragraph').then(m => m.Paragraph),\n  ParagraphCheck: () => import('@ds-mo/icons/svg/ParagraphCheck').then(m => m.ParagraphCheck),\n  ParagraphPencil: () => import('@ds-mo/icons/svg/ParagraphPencil').then(m => m.ParagraphPencil),\n  PathArrow: () => import('@ds-mo/icons/svg/PathArrow').then(m => m.PathArrow),\n  PathDot: () => import('@ds-mo/icons/svg/PathDot').then(m => m.PathDot),\n  PathNodes: () => import('@ds-mo/icons/svg/PathNodes').then(m => m.PathNodes),\n  Pause: () => import('@ds-mo/icons/svg/Pause').then(m => m.Pause),\n  PauseFilled: () => import('@ds-mo/icons/svg/PauseFilled').then(m => m.PauseFilled),\n  Pencil: () => import('@ds-mo/icons/svg/Pencil').then(m => m.Pencil),\n  PencilSquare: () => import('@ds-mo/icons/svg/PencilSquare').then(m => m.PencilSquare),\n  PencilSquiggle: () => import('@ds-mo/icons/svg/PencilSquiggle').then(m => m.PencilSquiggle),\n  Person: () => import('@ds-mo/icons/svg/Person').then(m => m.Person),\n  PersonAt: () => import('@ds-mo/icons/svg/PersonAt').then(m => m.PersonAt),\n  PersonCircle: () => import('@ds-mo/icons/svg/PersonCircle').then(m => m.PersonCircle),\n  PersonConnect: () => import('@ds-mo/icons/svg/PersonConnect').then(m => m.PersonConnect),\n  PersonGear: () => import('@ds-mo/icons/svg/PersonGear').then(m => m.PersonGear),\n  PersonGroup: () => import('@ds-mo/icons/svg/PersonGroup').then(m => m.PersonGroup),\n  PersonGroupArrows: () => import('@ds-mo/icons/svg/PersonGroupArrows').then(m => m.PersonGroupArrows),\n  PersonGroupThree: () => import('@ds-mo/icons/svg/PersonGroupThree').then(m => m.PersonGroupThree),\n  PersonManager: () => import('@ds-mo/icons/svg/PersonManager').then(m => m.PersonManager),\n  PersonShield: () => import('@ds-mo/icons/svg/PersonShield').then(m => m.PersonShield),\n  PersonSquare: () => import('@ds-mo/icons/svg/PersonSquare').then(m => m.PersonSquare),\n  PersonStar: () => import('@ds-mo/icons/svg/PersonStar').then(m => m.PersonStar),\n  Phone: () => import('@ds-mo/icons/svg/Phone').then(m => m.Phone),\n  PhoneStrikethrough: () => import('@ds-mo/icons/svg/PhoneStrikethrough').then(m => m.PhoneStrikethrough),\n  PicmanFilled: () => import('@ds-mo/icons/svg/PicmanFilled').then(m => m.PicmanFilled),\n  Pin: () => import('@ds-mo/icons/svg/Pin').then(m => m.Pin),\n  PipBottomLeft: () => import('@ds-mo/icons/svg/PipBottomLeft').then(m => m.PipBottomLeft),\n  PipBottomRight: () => import('@ds-mo/icons/svg/PipBottomRight').then(m => m.PipBottomRight),\n  PipTopLeft: () => import('@ds-mo/icons/svg/PipTopLeft').then(m => m.PipTopLeft),\n  PipTopRight: () => import('@ds-mo/icons/svg/PipTopRight').then(m => m.PipTopRight),\n  Play: () => import('@ds-mo/icons/svg/Play').then(m => m.Play),\n  PlayCircle: () => import('@ds-mo/icons/svg/PlayCircle').then(m => m.PlayCircle),\n  PlayFilled: () => import('@ds-mo/icons/svg/PlayFilled').then(m => m.PlayFilled),\n  Plug: () => import('@ds-mo/icons/svg/Plug').then(m => m.Plug),\n  Plus: () => import('@ds-mo/icons/svg/Plus').then(m => m.Plus),\n  PlusCircle: () => import('@ds-mo/icons/svg/PlusCircle').then(m => m.PlusCircle),\n  PlusSquare: () => import('@ds-mo/icons/svg/PlusSquare').then(m => m.PlusSquare),\n  Preferences: () => import('@ds-mo/icons/svg/Preferences').then(m => m.Preferences),\n  Printer: () => import('@ds-mo/icons/svg/Printer').then(m => m.Printer),\n  PunchCard: () => import('@ds-mo/icons/svg/PunchCard').then(m => m.PunchCard),\n  Puzzle: () => import('@ds-mo/icons/svg/Puzzle').then(m => m.Puzzle),\n  PuzzleTwo: () => import('@ds-mo/icons/svg/PuzzleTwo').then(m => m.PuzzleTwo),\n  QuestionCircle: () => import('@ds-mo/icons/svg/QuestionCircle').then(m => m.QuestionCircle),\n  Redo: () => import('@ds-mo/icons/svg/Redo').then(m => m.Redo),\n  Refresh: () => import('@ds-mo/icons/svg/Refresh').then(m => m.Refresh),\n  Restore: () => import('@ds-mo/icons/svg/Restore').then(m => m.Restore),\n  RewardRibbon: () => import('@ds-mo/icons/svg/RewardRibbon').then(m => m.RewardRibbon),\n  Rewind: () => import('@ds-mo/icons/svg/Rewind').then(m => m.Rewind),\n  RewindSkip: () => import('@ds-mo/icons/svg/RewindSkip').then(m => m.RewindSkip),\n  RewindSkipFilled: () => import('@ds-mo/icons/svg/RewindSkipFilled').then(m => m.RewindSkipFilled),\n  RightCollapse: () => import('@ds-mo/icons/svg/RightCollapse').then(m => m.RightCollapse),\n  RightCollapseB: () => import('@ds-mo/icons/svg/RightCollapseB').then(m => m.RightCollapseB),\n  RightExpand: () => import('@ds-mo/icons/svg/RightExpand').then(m => m.RightExpand),\n  RightExpandB: () => import('@ds-mo/icons/svg/RightExpandB').then(m => m.RightExpandB),\n  Rotate: () => import('@ds-mo/icons/svg/Rotate').then(m => m.Rotate),\n  Satellite: () => import('@ds-mo/icons/svg/Satellite').then(m => m.Satellite),\n  Scan: () => import('@ds-mo/icons/svg/Scan').then(m => m.Scan),\n  Scissor: () => import('@ds-mo/icons/svg/Scissor').then(m => m.Scissor),\n  Scope: () => import('@ds-mo/icons/svg/Scope').then(m => m.Scope),\n  Seatbelt: () => import('@ds-mo/icons/svg/Seatbelt').then(m => m.Seatbelt),\n  SeatbeltBuckle: () => import('@ds-mo/icons/svg/SeatbeltBuckle').then(m => m.SeatbeltBuckle),\n  SectionList: () => import('@ds-mo/icons/svg/SectionList').then(m => m.SectionList),\n  Shapes: () => import('@ds-mo/icons/svg/Shapes').then(m => m.Shapes),\n  Share: () => import('@ds-mo/icons/svg/Share').then(m => m.Share),\n  ShareFilled: () => import('@ds-mo/icons/svg/ShareFilled').then(m => m.ShareFilled),\n  Shield: () => import('@ds-mo/icons/svg/Shield').then(m => m.Shield),\n  ShieldCheck: () => import('@ds-mo/icons/svg/ShieldCheck').then(m => m.ShieldCheck),\n  ShieldCheckmarkFilled: () => import('@ds-mo/icons/svg/ShieldCheckmarkFilled').then(m => m.ShieldCheckmarkFilled),\n  ShieldCircle: () => import('@ds-mo/icons/svg/ShieldCircle').then(m => m.ShieldCircle),\n  ShieldCircleFilled: () => import('@ds-mo/icons/svg/ShieldCircleFilled').then(m => m.ShieldCircleFilled),\n  ShieldCross: () => import('@ds-mo/icons/svg/ShieldCross').then(m => m.ShieldCross),\n  ShieldCrossFilled: () => import('@ds-mo/icons/svg/ShieldCrossFilled').then(m => m.ShieldCrossFilled),\n  ShieldFilled: () => import('@ds-mo/icons/svg/ShieldFilled').then(m => m.ShieldFilled),\n  ShieldLock: () => import('@ds-mo/icons/svg/ShieldLock').then(m => m.ShieldLock),\n  ShieldLockFilled: () => import('@ds-mo/icons/svg/ShieldLockFilled').then(m => m.ShieldLockFilled),\n  ShieldPerson: () => import('@ds-mo/icons/svg/ShieldPerson').then(m => m.ShieldPerson),\n  ShoppingBag: () => import('@ds-mo/icons/svg/ShoppingBag').then(m => m.ShoppingBag),\n  Snowflake: () => import('@ds-mo/icons/svg/Snowflake').then(m => m.Snowflake),\n  Speaker: () => import('@ds-mo/icons/svg/Speaker').then(m => m.Speaker),\n  SpeakerFilled: () => import('@ds-mo/icons/svg/SpeakerFilled').then(m => m.SpeakerFilled),\n  SpeakerPhone: () => import('@ds-mo/icons/svg/SpeakerPhone').then(m => m.SpeakerPhone),\n  SpeakerStrikethrough: () => import('@ds-mo/icons/svg/SpeakerStrikethrough').then(m => m.SpeakerStrikethrough),\n  SpeakerStrikethroughFilled: () => import('@ds-mo/icons/svg/SpeakerStrikethroughFilled').then(m => m.SpeakerStrikethroughFilled),\n  SpeedometerArrow: () => import('@ds-mo/icons/svg/SpeedometerArrow').then(m => m.SpeedometerArrow),\n  SpeedometerLeft: () => import('@ds-mo/icons/svg/SpeedometerLeft').then(m => m.SpeedometerLeft),\n  SpeedometerRight: () => import('@ds-mo/icons/svg/SpeedometerRight').then(m => m.SpeedometerRight),\n  SpikeCirclePercentage: () => import('@ds-mo/icons/svg/SpikeCirclePercentage').then(m => m.SpikeCirclePercentage),\n  SpikeCirclePercentageFilled: () => import('@ds-mo/icons/svg/SpikeCirclePercentageFilled').then(m => m.SpikeCirclePercentageFilled),\n  Square: () => import('@ds-mo/icons/svg/Square').then(m => m.Square),\n  SquareDottedMinus: () => import('@ds-mo/icons/svg/SquareDottedMinus').then(m => m.SquareDottedMinus),\n  SquareFilled: () => import('@ds-mo/icons/svg/SquareFilled').then(m => m.SquareFilled),\n  SquareGrid: () => import('@ds-mo/icons/svg/SquareGrid').then(m => m.SquareGrid),\n  Star: () => import('@ds-mo/icons/svg/Star').then(m => m.Star),\n  StarFilled: () => import('@ds-mo/icons/svg/StarFilled').then(m => m.StarFilled),\n  Stopwatch: () => import('@ds-mo/icons/svg/Stopwatch').then(m => m.Stopwatch),\n  Table: () => import('@ds-mo/icons/svg/Table').then(m => m.Table),\n  Tag: () => import('@ds-mo/icons/svg/Tag').then(m => m.Tag),\n  Target: () => import('@ds-mo/icons/svg/Target').then(m => m.Target),\n  TargetDollar: () => import('@ds-mo/icons/svg/TargetDollar').then(m => m.TargetDollar),\n  Text: () => import('@ds-mo/icons/svg/Text').then(m => m.Text),\n  ThemeDark: () => import('@ds-mo/icons/svg/ThemeDark').then(m => m.ThemeDark),\n  ThemeLight: () => import('@ds-mo/icons/svg/ThemeLight').then(m => m.ThemeLight),\n  ThumbsDown: () => import('@ds-mo/icons/svg/ThumbsDown').then(m => m.ThumbsDown),\n  ThumbsDownFilled: () => import('@ds-mo/icons/svg/ThumbsDownFilled').then(m => m.ThumbsDownFilled),\n  ThumbsUp: () => import('@ds-mo/icons/svg/ThumbsUp').then(m => m.ThumbsUp),\n  ThumbsUpFilled: () => import('@ds-mo/icons/svg/ThumbsUpFilled').then(m => m.ThumbsUpFilled),\n  TirePressure: () => import('@ds-mo/icons/svg/TirePressure').then(m => m.TirePressure),\n  Toggle: () => import('@ds-mo/icons/svg/Toggle').then(m => m.Toggle),\n  TrafficLight: () => import('@ds-mo/icons/svg/TrafficLight').then(m => m.TrafficLight),\n  Trash: () => import('@ds-mo/icons/svg/Trash').then(m => m.Trash),\n  Triangle: () => import('@ds-mo/icons/svg/Triangle').then(m => m.Triangle),\n  TriangleFilled: () => import('@ds-mo/icons/svg/TriangleFilled').then(m => m.TriangleFilled),\n  Trophy: () => import('@ds-mo/icons/svg/Trophy').then(m => m.Trophy),\n  TurnSignal: () => import('@ds-mo/icons/svg/TurnSignal').then(m => m.TurnSignal),\n  TurnSignalFilled: () => import('@ds-mo/icons/svg/TurnSignalFilled').then(m => m.TurnSignalFilled),\n  TurnSignalLeft: () => import('@ds-mo/icons/svg/TurnSignalLeft').then(m => m.TurnSignalLeft),\n  TurnSignalRight: () => import('@ds-mo/icons/svg/TurnSignalRight').then(m => m.TurnSignalRight),\n  Undo: () => import('@ds-mo/icons/svg/Undo').then(m => m.Undo),\n  Upgrade: () => import('@ds-mo/icons/svg/Upgrade').then(m => m.Upgrade),\n  Upload: () => import('@ds-mo/icons/svg/Upload').then(m => m.Upload),\n  VehicleTrailer: () => import('@ds-mo/icons/svg/VehicleTrailer').then(m => m.VehicleTrailer),\n  VehicleTruck: () => import('@ds-mo/icons/svg/VehicleTruck').then(m => m.VehicleTruck),\n  VehicleTruckMagnifyingGlass: () => import('@ds-mo/icons/svg/VehicleTruckMagnifyingGlass').then(m => m.VehicleTruckMagnifyingGlass),\n  Video: () => import('@ds-mo/icons/svg/Video').then(m => m.Video),\n  ViewMenu: () => import('@ds-mo/icons/svg/ViewMenu').then(m => m.ViewMenu),\n  WandSparkle: () => import('@ds-mo/icons/svg/WandSparkle').then(m => m.WandSparkle),\n  Waveform: () => import('@ds-mo/icons/svg/Waveform').then(m => m.Waveform),\n  Webhooks: () => import('@ds-mo/icons/svg/Webhooks').then(m => m.Webhooks),\n  Whistle: () => import('@ds-mo/icons/svg/Whistle').then(m => m.Whistle),\n  WifiHorizontal: () => import('@ds-mo/icons/svg/WifiHorizontal').then(m => m.WifiHorizontal),\n  WifiTower: () => import('@ds-mo/icons/svg/WifiTower').then(m => m.WifiTower),\n  WifiVertical: () => import('@ds-mo/icons/svg/WifiVertical').then(m => m.WifiVertical),\n  WifiVerticalStrikethrough: () => import('@ds-mo/icons/svg/WifiVerticalStrikethrough').then(m => m.WifiVerticalStrikethrough),\n  Workflow: () => import('@ds-mo/icons/svg/Workflow').then(m => m.Workflow),\n  Wrench: () => import('@ds-mo/icons/svg/Wrench').then(m => m.Wrench),\n};\n",
       "type": "registry:ui"
     }
   ]

package/dist/mcp-data/registry/input-date.json

@@ -486,7 +486,7 @@
       "peerDependencies": {
         "required": [
           "@ds-mo/tokens ^6.5.1",
-          "@ds-mo/icons ^7.0.0"
+          "@ds-mo/icons ^8.1.0"
         ],
         "frameworks": "Custom Elements; React 18/19 wrappers; Vue 3 wrappers; Angular 19-22 standalone adapters."
       }

package/dist/mcp-data/registry/input-time.json

@@ -505,7 +505,7 @@
       "peerDependencies": {
         "required": [
           "@ds-mo/tokens ^6.5.1",
-          "@ds-mo/icons ^7.0.0"
+          "@ds-mo/icons ^8.1.0"
         ],
         "frameworks": "Custom Elements; React 18/19 wrappers; Vue 3 wrappers; Angular 19-22 standalone adapters."
       }

package/dist/mcp-data/registry/input.json

@@ -743,7 +743,7 @@
       "peerDependencies": {
         "required": [
           "@ds-mo/tokens ^6.5.1",
-          "@ds-mo/icons ^7.0.0"
+          "@ds-mo/icons ^8.1.0"
         ],
         "frameworks": "Custom Elements; React 18/19 wrappers; Vue 3 wrappers; Angular 19-22 standalone adapters."
       }
@@ -768,7 +768,7 @@
     },
     {
       "path": "src/wc/components/Input/Input.tsx",
-      "content": "import {\n  AttachInternals,\n  Component,\n  Prop,\n  State,\n  Event,\n  EventEmitter,\n  Element,\n  Method,\n  Watch,\n  h,\n  Host,\n} from '@stencil/core';\nimport {\n  controlWidthClass,\n  CONTROL_TEXT_VARIANT,\n  DEFAULT_REQUIRED_MESSAGE,\n  restoreStringFormState,\n  setFormControlValue,\n  setRequiredValidity,\n  type ControlWidth,\n} from '../../utils';\n\nexport type InputType = 'text' | 'email' | 'tel' | 'url' | 'search' | 'password' | 'number';\nexport type InputSize = 'lg' | 'md' | 'sm' | 'xs';\nexport type InputWidth = ControlWidth;\nexport type InputTextAlign = 'start' | 'end';\n\nconst CONTROL_ADORNMENT = 'ds-select, ds-button-unfilled, ds-button-filled';\n\nfunction isControlAdornment(element: Element): boolean {\n  return element.matches(CONTROL_ADORNMENT) || Boolean(element.querySelector(CONTROL_ADORNMENT));\n}\n\nconst ICON_SIZE: Record<InputSize, 'lg' | 'md' | 'sm' | 'xs'> = {\n  lg: 'lg',\n  md: 'md',\n  sm: 'sm',\n  xs: 'xs',\n};\n\nconst CLEAR_BUTTON_SIZE: Record<InputSize, 'md' | 'sm' | 'xs'> = {\n  lg: 'md',\n  md: 'sm',\n  sm: 'xs',\n  xs: 'xs',\n};\n\nlet idCounter = 0;\n\n@Component({\n  tag: 'ds-input',\n  styleUrl: 'Input.css',\n  scoped: true,\n  formAssociated: true,\n})\nexport class Input {\n  @Element() el!: HTMLElement;\n  @AttachInternals() internals!: ElementInternals;\n\n  private generatedId = `ds-input-${++idCounter}`;\n  private errorId = `${this.generatedId}-error`;\n\n  @Prop({ mutable: true }) value: string = '';\n  @Prop({ reflect: true }) name: string | undefined;\n  @Prop({ reflect: true }) form: string | undefined;\n  @Prop({ reflect: true }) disabled: boolean = false;\n  /** Keeps the value focusable and submittable while preventing edits. */\n  @Prop({ reflect: true }) readOnly: boolean = false;\n  @Prop({ reflect: true }) required: boolean = false;\n  @Prop() requiredMessage: string = DEFAULT_REQUIRED_MESSAGE;\n  @Prop() clearLabel: string = 'Clear';\n  @Prop() showPasswordLabel: string = 'Show password';\n  @Prop() hidePasswordLabel: string = 'Hide password';\n  @Prop() placeholder: string | undefined;\n  @Prop() type: InputType = 'text';\n  /** Minimum accepted value when type is number. */\n  @Prop() min: number | undefined;\n  /** Maximum accepted value when type is number. */\n  @Prop() max: number | undefined;\n  /** Numeric increment used by native stepping and constraint validation. */\n  @Prop() step: number | undefined;\n  /** Align the editable value; number steppers follow the same inline edge. */\n  @Prop() textAlign: InputTextAlign = 'start';\n  /** Native browser autofill hint. */\n  @Prop({ attribute: 'autocomplete' }) autoComplete: string | undefined;\n  /** Preferred virtual keyboard without changing the value semantics. */\n  @Prop({ attribute: 'inputmode' }) inputMode: string = '';\n  /** Preferred virtual-keyboard action label. */\n  @Prop({ attribute: 'enterkeyhint' }) enterKeyHint: string = '';\n  /** Control density. */\n  @Prop() size: InputSize = 'md';\n  /** Width fit — fill the parent (default) or hug the available content. */\n  @Prop() width: InputWidth = 'fill';\n  /** Show the standard inset border, including focused and invalid strokes. */\n  @Prop() hasBorder: boolean = true;\n  /** Show the standard hover and pressed fill when the field is not embedded in interactive chrome. */\n  @Prop() hasInteractionFill: boolean = true;\n  /** Optional leading icon name. */\n  @Prop() icon: string | undefined;\n  @Prop() isInactive: boolean = false;\n  @Prop() autoFocus: boolean = false;\n  @Prop() error: boolean = false;\n  @Prop() errorMessage: string | undefined;\n  /** Associates the internal input with an external <label>. */\n  @Prop() inputId: string | undefined;\n  @Prop({ attribute: 'aria-label' }) ariaLabel: string | null = null;\n  @Prop({ attribute: 'aria-labelledby' }) ariaLabelledby: string | undefined;\n  @Prop({ attribute: 'aria-describedby' }) ariaDescribedby: string | undefined;\n  /** Identifies the results or popup controlled by the editable field. */\n  @Prop({ attribute: 'aria-controls' }) ariaControls: string | undefined;\n  /** Identifies the active descendant while focus remains in the editable field. */\n  @Prop({ attribute: 'aria-activedescendant' }) ariaActiveDescendant: string | undefined;\n\n  @Event() dsChange!: EventEmitter<string>;\n  @Event() dsClear!: EventEmitter<void>;\n\n  private initialValue = '';\n  private inputEl?: HTMLInputElement;\n  @State() private formDisabled = false;\n  @State() private hasPrefix = false;\n  @State() private hasPrefixControl = false;\n  @State() private hasSuffix = false;\n  @State() private hasSuffixControl = false;\n  @State() private focused = false;\n  @State() private touched = false;\n  @State() private passwordRevealed = false;\n  private restorePasswordFocus = false;\n\n  componentWillLoad() {\n    this.initialValue = this.value;\n    this.syncAdornmentSlots();\n    this.syncFormValue();\n  }\n\n  componentDidRender() {\n    this.syncAdornmentSlots();\n    if (!this.restorePasswordFocus) return;\n    this.restorePasswordFocus = false;\n    this.inputEl?.focus({ preventScroll: true });\n  }\n\n  @Watch('type')\n  onTypeChange() {\n    if (this.type !== 'password') this.passwordRevealed = false;\n  }\n\n  private syncAdornmentSlots() {\n    const prefixNodes = [...this.el.querySelectorAll('[slot=\"prefix\"]')];\n    const suffixNodes = [...this.el.querySelectorAll('[slot=\"suffix\"]')];\n    const hasPrefix = prefixNodes.length > 0;\n    const hasPrefixControl = prefixNodes.some(isControlAdornment);\n    const hasSuffix = suffixNodes.length > 0;\n    const hasSuffixControl = suffixNodes.some(isControlAdornment);\n    if (hasPrefix !== this.hasPrefix) this.hasPrefix = hasPrefix;\n    if (hasPrefixControl !== this.hasPrefixControl) this.hasPrefixControl = hasPrefixControl;\n    if (hasSuffix !== this.hasSuffix) this.hasSuffix = hasSuffix;\n    if (hasSuffixControl !== this.hasSuffixControl) this.hasSuffixControl = hasSuffixControl;\n  }\n\n  @Watch('value')\n  @Watch('disabled')\n  @Watch('isInactive')\n  @Watch('required')\n  syncFormValue() {\n    const inactive = this.isInactive || this.disabled || this.formDisabled;\n    setFormControlValue(this.internals, this.value, { inactive });\n    const missing = this.required && !inactive && this.value.length === 0;\n    setRequiredValidity(this.internals, missing, this.requiredMessage);\n  }\n\n  formDisabledCallback(disabled: boolean) {\n    this.formDisabled = disabled;\n    this.syncFormValue();\n  }\n\n  formResetCallback() {\n    this.value = this.initialValue;\n    this.passwordRevealed = false;\n  }\n\n  formStateRestoreCallback(state: string | File | FormData | null) {\n    this.value = restoreStringFormState(state);\n  }\n\n  @Method()\n  async setFocus() {\n    this.inputEl?.focus();\n  }\n\n  private handleInput = (e: Event) => {\n    this.value = (e.target as HTMLInputElement).value;\n    this.dsChange.emit(this.value);\n  };\n\n  private handleFocus = () => {\n    this.focused = true;\n  };\n\n  private handleBlur = () => {\n    this.focused = false;\n    this.touched = true;\n  };\n\n  private handleClear = () => {\n    this.value = '';\n    this.dsChange.emit('');\n    this.dsClear.emit();\n    this.inputEl?.focus();\n  };\n\n  private handleTogglePassword = () => {\n    this.passwordRevealed = !this.passwordRevealed;\n    this.restorePasswordFocus = true;\n  };\n\n  private numericStepDisabled(direction: 1 | -1): boolean {\n    if (this.value.trim() === '') return false;\n    const value = Number(this.value);\n    if (!Number.isFinite(value)) return false;\n    if (direction > 0 && this.max !== undefined) return value >= this.max;\n    if (direction < 0 && this.min !== undefined) return value <= this.min;\n    return false;\n  }\n\n  private handleNumericStep = (direction: 1 | -1) => {\n    const input = this.inputEl;\n    if (!input || input.disabled || input.readOnly || this.numericStepDisabled(direction)) return;\n\n    const previous = input.value;\n    if (direction > 0) input.stepUp();\n    else input.stepDown();\n    input.focus({ preventScroll: true });\n    if (input.value === previous) return;\n\n    this.value = input.value;\n    this.dsChange.emit(this.value);\n  };\n\n  private renderNumericStepper(inactive: boolean) {\n    const incrementDisabled = inactive || this.readOnly || this.numericStepDisabled(1);\n    const decrementDisabled = inactive || this.readOnly || this.numericStepDisabled(-1);\n\n    return (\n      <span class=\"input-control__number-stepper\">\n        <button\n          type=\"button\"\n          class=\"input-control__number-step input-control__number-step--increment ds-focus-ring-inset ds-interaction-fill\"\n          disabled={incrementDisabled}\n          tabIndex={-1}\n          aria-hidden=\"true\"\n          onClick={() => this.handleNumericStep(1)}\n        >\n          <ds-icon\n            class=\"input-control__number-step-icon ds-interaction-fill__content\"\n            name=\"ChevronUp\"\n            size=\"xs\"\n            color=\"inherit\"\n          />\n        </button>\n        <button\n          type=\"button\"\n          class=\"input-control__number-step input-control__number-step--decrement ds-focus-ring-inset ds-interaction-fill\"\n          disabled={decrementDisabled}\n          tabIndex={-1}\n          aria-hidden=\"true\"\n          onClick={() => this.handleNumericStep(-1)}\n        >\n          <ds-icon\n            class=\"input-control__number-step-icon ds-interaction-fill__content\"\n            name=\"ChevronDown\"\n            size=\"xs\"\n            color=\"inherit\"\n          />\n        </button>\n      </span>\n    );\n  }\n\n  render() {\n    const inputId = this.inputId ?? this.generatedId;\n    const inactive = this.isInactive || this.disabled || this.formDisabled;\n    const filled = this.value.length > 0;\n    const dirty = this.value !== this.initialValue;\n    const showClear = this.type === 'search' && filled && !inactive && !this.readOnly;\n    const showPasswordToggle = this.type === 'password';\n    const nativeType = showPasswordToggle && this.passwordRevealed ? 'text' : this.type;\n    const showError = this.error && Boolean(this.errorMessage);\n    const textVariant = CONTROL_TEXT_VARIANT[this.size];\n    const iconSize = ICON_SIZE[this.size];\n    const numeric = this.type === 'number';\n    const resolvedAutoComplete = this.autoComplete ?? (this.type === 'search' ? 'off' : undefined);\n    const suppressBrowserChrome = this.type === 'search' || this.type === 'password';\n\n    const describedBy =\n      [this.ariaDescribedby, showError ? this.errorId : undefined].filter(Boolean).join(' ') ||\n      undefined;\n\n    return (\n      <Host\n        class={{\n          'input-host': true,\n          'ds-field-stack': true,\n          'ds-field-stack--supporting-inset': !this.hasBorder,\n          'ds-control-inactive': inactive,\n          [`ds-control--${this.size}`]: true,\n          ...controlWidthClass(this.width),\n        }}\n        data-disabled={inactive ? '' : undefined}\n        data-readonly={this.readOnly ? '' : undefined}\n        data-required={this.required ? '' : undefined}\n        data-invalid={this.error ? '' : undefined}\n        data-filled={filled ? '' : undefined}\n        data-focused={this.focused ? '' : undefined}\n        data-dirty={dirty ? '' : undefined}\n        data-touched={this.touched ? '' : undefined}\n      >\n        <div\n          class={{\n            'input-control': true,\n            'input-control--number': numeric,\n            'input-control--align-start': this.textAlign === 'start',\n            'input-control--align-end': this.textAlign === 'end',\n            'ds-control-frame': true,\n            'input-control--bordered': this.hasBorder,\n            'input-control--error': this.hasBorder && this.error,\n            'input-control--prefix-control': this.hasPrefixControl,\n            'input-control--suffix-control': this.hasSuffixControl,\n            'ds-interaction-fill': this.hasInteractionFill,\n            [`ds-control--${this.size}`]: true,\n          }}\n        >\n          {numeric && this.textAlign === 'end' && this.renderNumericStepper(inactive)}\n          {this.icon && (\n            <span\n              class=\"input-control__prefix ds-control-icon-box ds-interaction-fill__content\"\n              aria-hidden=\"true\"\n            >\n              <ds-icon name={this.icon} size={iconSize} color=\"inherit\" />\n            </span>\n          )}\n          <span\n            class={{\n              'input-control__prefix-text': true,\n              'ds-control-label-box': !this.hasPrefixControl,\n              'ds-interaction-fill__content': true,\n              'input-control__prefix-text--control': this.hasPrefixControl,\n              'input-control__prefix-text--empty': !this.hasPrefix,\n            }}\n          >\n            <slot name=\"prefix\" onSlotchange={() => this.syncAdornmentSlots()} />\n            {this.hasPrefixControl && (\n              <ds-divider\n                class=\"input-control__adornment-divider\"\n                orientation=\"vertical\"\n                length=\"var(--ds-control-icon)\"\n              />\n            )}\n          </span>\n          <input\n            ref={element => {\n              this.inputEl = element;\n            }}\n            type={nativeType}\n            id={inputId}\n            value={this.value}\n            placeholder={this.placeholder}\n            min={numeric ? this.min : undefined}\n            max={numeric ? this.max : undefined}\n            step={numeric ? this.step : undefined}\n            disabled={inactive}\n            readOnly={this.readOnly}\n            required={this.required}\n            autoFocus={this.autoFocus}\n            autoComplete={resolvedAutoComplete}\n            autoCapitalize={suppressBrowserChrome ? 'none' : undefined}\n            autoCorrect={suppressBrowserChrome ? 'off' : undefined}\n            spellcheck={suppressBrowserChrome ? false : undefined}\n            inputMode={this.inputMode || undefined}\n            enterKeyHint={this.enterKeyHint || undefined}\n            class={`native-input native-input--align-${this.textAlign} ds-control-label-box ds-text--${textVariant.replace('text-', '')} ds-text--regular ds-interaction-fill__content`}\n            aria-label={this.ariaLabel}\n            aria-labelledby={this.ariaLabelledby}\n            aria-describedby={describedBy}\n            aria-controls={this.ariaControls}\n            aria-activedescendant={this.ariaActiveDescendant}\n            aria-invalid={this.error ? 'true' : undefined}\n            onInput={this.handleInput}\n            onFocus={this.handleFocus}\n            onBlur={this.handleBlur}\n          />\n          <span\n            class={{\n              'input-control__suffix': true,\n              'ds-control-label-box': !this.hasSuffixControl,\n              'input-control__suffix--control': this.hasSuffixControl,\n              'input-control__suffix--empty': !this.hasSuffix,\n            }}\n          >\n            {this.hasSuffixControl && (\n              <ds-divider\n                class=\"input-control__adornment-divider\"\n                orientation=\"vertical\"\n                length=\"var(--ds-control-icon)\"\n              />\n            )}\n            <slot name=\"suffix\" onSlotchange={() => this.syncAdornmentSlots()} />\n          </span>\n          {showClear && (\n            <ds-button-unfilled\n              class=\"input-control__clear\"\n              variant=\"icon\"\n              size={CLEAR_BUTTON_SIZE[this.size]}\n              icon=\"CrossCircle\"\n              hasBorder={false}\n              rounded\n              ariaLabel={this.clearLabel}\n              onDsClick={this.handleClear}\n            />\n          )}\n          {showPasswordToggle && (\n            <ds-button-unfilled\n              class=\"input-control__trailing-action\"\n              variant=\"icon\"\n              size={this.size}\n              icon={this.passwordRevealed ? 'EyeDisabled' : 'Eye'}\n              hasBorder={false}\n              isInset\n              isInactive={inactive}\n              ariaLabel={this.passwordRevealed ? this.hidePasswordLabel : this.showPasswordLabel}\n              onDsClick={this.handleTogglePassword}\n            />\n          )}\n          {numeric && this.textAlign === 'start' && this.renderNumericStepper(inactive)}\n        </div>\n        {showError && (\n          <ds-text\n            class=\"error-text\"\n            as=\"div\"\n            variant=\"text-body-small\"\n            color=\"negative\"\n            textId={this.errorId}\n            role=\"alert\"\n          >\n            {this.errorMessage}\n          </ds-text>\n        )}\n      </Host>\n    );\n  }\n}\n",
+      "content": "import {\n  AttachInternals,\n  Component,\n  Prop,\n  State,\n  Event,\n  EventEmitter,\n  Element,\n  Method,\n  Watch,\n  h,\n  Host,\n} from '@stencil/core';\nimport {\n  controlWidthClass,\n  CONTROL_TEXT_VARIANT,\n  DEFAULT_REQUIRED_MESSAGE,\n  restoreStringFormState,\n  setFormControlValue,\n  setRequiredValidity,\n  type ControlWidth,\n} from '../../utils';\n\nexport type InputType = 'text' | 'email' | 'tel' | 'url' | 'search' | 'password' | 'number';\nexport type InputSize = 'lg' | 'md' | 'sm' | 'xs';\nexport type InputWidth = ControlWidth;\nexport type InputTextAlign = 'start' | 'end';\n\nconst CONTROL_ADORNMENT = 'ds-select, ds-button-unfilled, ds-button-filled';\n\nfunction isControlAdornment(element: Element): boolean {\n  return element.matches(CONTROL_ADORNMENT) || Boolean(element.querySelector(CONTROL_ADORNMENT));\n}\n\nconst ICON_SIZE: Record<InputSize, 'lg' | 'md' | 'sm' | 'xs'> = {\n  lg: 'lg',\n  md: 'md',\n  sm: 'sm',\n  xs: 'xs',\n};\n\nconst CLEAR_BUTTON_SIZE: Record<InputSize, 'md' | 'sm' | 'xs'> = {\n  lg: 'md',\n  md: 'sm',\n  sm: 'xs',\n  xs: 'xs',\n};\n\nlet idCounter = 0;\n\n@Component({\n  tag: 'ds-input',\n  styleUrl: 'Input.css',\n  scoped: true,\n  formAssociated: true,\n})\nexport class Input {\n  @Element() el!: HTMLElement;\n  @AttachInternals() internals!: ElementInternals;\n\n  private generatedId = `ds-input-${++idCounter}`;\n  private errorId = `${this.generatedId}-error`;\n\n  @Prop({ mutable: true }) value: string = '';\n  @Prop({ reflect: true }) name: string | undefined;\n  @Prop({ reflect: true }) form: string | undefined;\n  @Prop({ reflect: true }) disabled: boolean = false;\n  /** Keeps the value focusable and submittable while preventing edits. */\n  @Prop({ reflect: true }) readOnly: boolean = false;\n  @Prop({ reflect: true }) required: boolean = false;\n  @Prop() requiredMessage: string = DEFAULT_REQUIRED_MESSAGE;\n  @Prop() clearLabel: string = 'Clear';\n  @Prop() showPasswordLabel: string = 'Show password';\n  @Prop() hidePasswordLabel: string = 'Hide password';\n  @Prop() placeholder: string | undefined;\n  @Prop() type: InputType = 'text';\n  /** Minimum accepted value when type is number. */\n  @Prop() min: number | undefined;\n  /** Maximum accepted value when type is number. */\n  @Prop() max: number | undefined;\n  /** Numeric increment used by native stepping and constraint validation. */\n  @Prop() step: number | undefined;\n  /** Align the editable value; number steppers follow the same inline edge. */\n  @Prop() textAlign: InputTextAlign = 'start';\n  /** Native browser autofill hint. */\n  @Prop({ attribute: 'autocomplete' }) autoComplete: string | undefined;\n  /** Preferred virtual keyboard without changing the value semantics. */\n  @Prop({ attribute: 'inputmode' }) inputMode: string = '';\n  /** Preferred virtual-keyboard action label. */\n  @Prop({ attribute: 'enterkeyhint' }) enterKeyHint: string = '';\n  /** Control density. */\n  @Prop() size: InputSize = 'md';\n  /** Width fit — fill the parent (default) or hug the available content. */\n  @Prop() width: InputWidth = 'fill';\n  /** Show the standard inset border, including focused and invalid strokes. */\n  @Prop() hasBorder: boolean = true;\n  /** Show the standard hover and pressed fill when the field is not embedded in interactive chrome. */\n  @Prop() hasInteractionFill: boolean = true;\n  /** Optional leading icon name. */\n  @Prop() icon: string | undefined;\n  @Prop() isInactive: boolean = false;\n  @Prop() autoFocus: boolean = false;\n  @Prop() error: boolean = false;\n  @Prop() errorMessage: string | undefined;\n  /** Associates the internal input with an external <label>. */\n  @Prop() inputId: string | undefined;\n  @Prop({ attribute: 'aria-label' }) ariaLabel: string | null = null;\n  @Prop({ attribute: 'aria-labelledby' }) ariaLabelledby: string | undefined;\n  @Prop({ attribute: 'aria-describedby' }) ariaDescribedby: string | undefined;\n  /** Identifies the results or popup controlled by the editable field. */\n  @Prop({ attribute: 'aria-controls' }) ariaControls: string | undefined;\n  /** Identifies the active descendant while focus remains in the editable field. */\n  @Prop({ attribute: 'aria-activedescendant' }) ariaActiveDescendant: string | undefined;\n\n  @Event() dsChange!: EventEmitter<string>;\n  @Event() dsClear!: EventEmitter<void>;\n\n  private initialValue = '';\n  private inputEl?: HTMLInputElement;\n  @State() private formDisabled = false;\n  @State() private hasPrefix = false;\n  @State() private hasPrefixControl = false;\n  @State() private hasSuffix = false;\n  @State() private hasSuffixControl = false;\n  @State() private focused = false;\n  @State() private touched = false;\n  @State() private passwordRevealed = false;\n  private restorePasswordFocus = false;\n\n  componentWillLoad() {\n    this.initialValue = this.value;\n    this.syncAdornmentSlots();\n    this.syncFormValue();\n  }\n\n  componentDidRender() {\n    this.syncAdornmentSlots();\n    if (!this.restorePasswordFocus) return;\n    this.restorePasswordFocus = false;\n    this.inputEl?.focus({ preventScroll: true });\n  }\n\n  @Watch('type')\n  onTypeChange() {\n    if (this.type !== 'password') this.passwordRevealed = false;\n  }\n\n  private syncAdornmentSlots() {\n    const prefixNodes = [...this.el.querySelectorAll('[slot=\"prefix\"]')];\n    const suffixNodes = [...this.el.querySelectorAll('[slot=\"suffix\"]')];\n    const hasPrefix = prefixNodes.length > 0;\n    const hasPrefixControl = prefixNodes.some(isControlAdornment);\n    const hasSuffix = suffixNodes.length > 0;\n    const hasSuffixControl = suffixNodes.some(isControlAdornment);\n    if (hasPrefix !== this.hasPrefix) this.hasPrefix = hasPrefix;\n    if (hasPrefixControl !== this.hasPrefixControl) this.hasPrefixControl = hasPrefixControl;\n    if (hasSuffix !== this.hasSuffix) this.hasSuffix = hasSuffix;\n    if (hasSuffixControl !== this.hasSuffixControl) this.hasSuffixControl = hasSuffixControl;\n  }\n\n  @Watch('value')\n  @Watch('disabled')\n  @Watch('isInactive')\n  @Watch('required')\n  syncFormValue() {\n    const inactive = this.isInactive || this.disabled || this.formDisabled;\n    setFormControlValue(this.internals, this.value, { inactive });\n    const missing = this.required && !inactive && this.value.length === 0;\n    setRequiredValidity(this.internals, missing, this.requiredMessage);\n  }\n\n  formDisabledCallback(disabled: boolean) {\n    this.formDisabled = disabled;\n    this.syncFormValue();\n  }\n\n  formResetCallback() {\n    this.value = this.initialValue;\n    this.passwordRevealed = false;\n  }\n\n  formStateRestoreCallback(state: string | File | FormData | null) {\n    this.value = restoreStringFormState(state);\n  }\n\n  @Method()\n  async setFocus() {\n    this.inputEl?.focus();\n  }\n\n  private handleInput = (e: Event) => {\n    this.value = (e.target as HTMLInputElement).value;\n    this.dsChange.emit(this.value);\n  };\n\n  private handleFocus = () => {\n    this.focused = true;\n  };\n\n  private handleBlur = () => {\n    this.focused = false;\n    this.touched = true;\n  };\n\n  private handleClear = () => {\n    this.value = '';\n    this.dsChange.emit('');\n    this.dsClear.emit();\n    this.inputEl?.focus();\n  };\n\n  private handleTogglePassword = () => {\n    this.passwordRevealed = !this.passwordRevealed;\n    this.restorePasswordFocus = true;\n  };\n\n  private numericStepDisabled(direction: 1 | -1): boolean {\n    if (this.value.trim() === '') return false;\n    const value = Number(this.value);\n    if (!Number.isFinite(value)) return false;\n    if (direction > 0 && this.max !== undefined) return value >= this.max;\n    if (direction < 0 && this.min !== undefined) return value <= this.min;\n    return false;\n  }\n\n  private handleNumericStep = (direction: 1 | -1) => {\n    const input = this.inputEl;\n    if (!input || input.disabled || input.readOnly || this.numericStepDisabled(direction)) return;\n\n    const previous = input.value;\n    if (direction > 0) input.stepUp();\n    else input.stepDown();\n    input.focus({ preventScroll: true });\n    if (input.value === previous) return;\n\n    this.value = input.value;\n    this.dsChange.emit(this.value);\n  };\n\n  private renderNumericStepper(inactive: boolean) {\n    const incrementDisabled = inactive || this.readOnly || this.numericStepDisabled(1);\n    const decrementDisabled = inactive || this.readOnly || this.numericStepDisabled(-1);\n\n    return (\n      <span class=\"input-control__number-stepper\">\n        <button\n          type=\"button\"\n          class=\"input-control__number-step input-control__number-step--increment ds-focus-ring-inset ds-interaction-fill\"\n          disabled={incrementDisabled}\n          tabIndex={-1}\n          aria-hidden=\"true\"\n          onClick={() => this.handleNumericStep(1)}\n        >\n          <ds-icon\n            class=\"input-control__number-step-icon ds-interaction-fill__content\"\n            name=\"ChevronUp\"\n            size=\"xs\"\n            color=\"inherit\"\n          />\n        </button>\n        <button\n          type=\"button\"\n          class=\"input-control__number-step input-control__number-step--decrement ds-focus-ring-inset ds-interaction-fill\"\n          disabled={decrementDisabled}\n          tabIndex={-1}\n          aria-hidden=\"true\"\n          onClick={() => this.handleNumericStep(-1)}\n        >\n          <ds-icon\n            class=\"input-control__number-step-icon ds-interaction-fill__content\"\n            name=\"ChevronDown\"\n            size=\"xs\"\n            color=\"inherit\"\n          />\n        </button>\n      </span>\n    );\n  }\n\n  render() {\n    const inputId = this.inputId ?? this.generatedId;\n    const inactive = this.isInactive || this.disabled || this.formDisabled;\n    const filled = this.value.length > 0;\n    const dirty = this.value !== this.initialValue;\n    const showClear = this.type === 'search' && filled && !inactive && !this.readOnly;\n    const showPasswordToggle = this.type === 'password';\n    const nativeType = showPasswordToggle && this.passwordRevealed ? 'text' : this.type;\n    const showError = this.error && Boolean(this.errorMessage);\n    const textVariant = CONTROL_TEXT_VARIANT[this.size];\n    const iconSize = ICON_SIZE[this.size];\n    const numeric = this.type === 'number';\n    const resolvedAutoComplete = this.autoComplete ?? (this.type === 'search' ? 'off' : undefined);\n    const suppressBrowserChrome = this.type === 'search' || this.type === 'password';\n\n    const describedBy =\n      [this.ariaDescribedby, showError ? this.errorId : undefined].filter(Boolean).join(' ') ||\n      undefined;\n\n    return (\n      <Host\n        class={{\n          'input-host': true,\n          'ds-field-stack': true,\n          'ds-field-stack--supporting-inset': !this.hasBorder,\n          'ds-control-inactive': inactive,\n          [`ds-control--${this.size}`]: true,\n          ...controlWidthClass(this.width),\n        }}\n        data-disabled={inactive ? '' : undefined}\n        data-readonly={this.readOnly ? '' : undefined}\n        data-required={this.required ? '' : undefined}\n        data-invalid={this.error ? '' : undefined}\n        data-filled={filled ? '' : undefined}\n        data-focused={this.focused ? '' : undefined}\n        data-dirty={dirty ? '' : undefined}\n        data-touched={this.touched ? '' : undefined}\n      >\n        <div\n          class={{\n            'input-control': true,\n            'input-control--number': numeric,\n            'input-control--align-start': this.textAlign === 'start',\n            'input-control--align-end': this.textAlign === 'end',\n            'ds-control-frame': true,\n            'input-control--bordered': this.hasBorder,\n            'input-control--error': this.hasBorder && this.error,\n            'input-control--prefix-control': this.hasPrefixControl,\n            'input-control--suffix-control': this.hasSuffixControl,\n            'ds-interaction-fill': this.hasInteractionFill,\n            [`ds-control--${this.size}`]: true,\n          }}\n        >\n          {numeric && this.textAlign === 'end' && this.renderNumericStepper(inactive)}\n          {this.icon && (\n            <span\n              class=\"input-control__prefix ds-control-icon-box ds-interaction-fill__content\"\n              aria-hidden=\"true\"\n            >\n              <ds-icon name={this.icon} size={iconSize} color=\"inherit\" />\n            </span>\n          )}\n          <span\n            class={{\n              'input-control__prefix-text': true,\n              'ds-control-label-box': !this.hasPrefixControl,\n              'ds-interaction-fill__content': true,\n              'input-control__prefix-text--control': this.hasPrefixControl,\n              'input-control__prefix-text--empty': !this.hasPrefix,\n            }}\n          >\n            <slot name=\"prefix\" onSlotchange={() => this.syncAdornmentSlots()} />\n            {this.hasPrefixControl && (\n              <ds-divider\n                class=\"input-control__adornment-divider\"\n                orientation=\"vertical\"\n                length=\"var(--ds-control-icon)\"\n              />\n            )}\n          </span>\n          <input\n            ref={element => {\n              this.inputEl = element;\n            }}\n            type={nativeType}\n            id={inputId}\n            value={this.value}\n            placeholder={this.placeholder}\n            min={numeric ? this.min : undefined}\n            max={numeric ? this.max : undefined}\n            step={numeric ? this.step : undefined}\n            disabled={inactive}\n            readOnly={this.readOnly}\n            required={this.required}\n            autoFocus={this.autoFocus}\n            autoComplete={resolvedAutoComplete}\n            autoCapitalize={suppressBrowserChrome ? 'none' : undefined}\n            autoCorrect={suppressBrowserChrome ? 'off' : undefined}\n            spellcheck={suppressBrowserChrome ? false : undefined}\n            inputMode={this.inputMode || undefined}\n            enterKeyHint={this.enterKeyHint || undefined}\n            class={`native-input native-input--align-${this.textAlign} ds-control-label-box ds-text--${textVariant.replace('text-', '')} ds-text--regular ds-interaction-fill__content`}\n            aria-label={this.ariaLabel}\n            aria-labelledby={this.ariaLabelledby}\n            aria-describedby={describedBy}\n            aria-controls={this.ariaControls}\n            aria-activedescendant={this.ariaActiveDescendant}\n            aria-invalid={this.error ? 'true' : undefined}\n            onInput={this.handleInput}\n            onFocus={this.handleFocus}\n            onBlur={this.handleBlur}\n          />\n          <span\n            class={{\n              'input-control__suffix': true,\n              'ds-control-label-box': !this.hasSuffixControl,\n              'input-control__suffix--control': this.hasSuffixControl,\n              'input-control__suffix--empty': !this.hasSuffix,\n            }}\n          >\n            {this.hasSuffixControl && (\n              <ds-divider\n                class=\"input-control__adornment-divider\"\n                orientation=\"vertical\"\n                length=\"var(--ds-control-icon)\"\n              />\n            )}\n            <slot name=\"suffix\" onSlotchange={() => this.syncAdornmentSlots()} />\n          </span>\n          {showClear && (\n            <ds-button-unfilled\n              class=\"input-control__clear\"\n              variant=\"icon\"\n              size={CLEAR_BUTTON_SIZE[this.size]}\n              icon=\"CrossCircle\"\n              hasBorder={false}\n              rounded\n              ariaLabel={this.clearLabel}\n              onDsClick={this.handleClear}\n            />\n          )}\n          {showPasswordToggle && (\n            <ds-button-unfilled\n              class=\"input-control__trailing-action\"\n              variant=\"icon\"\n              size={this.size}\n              icon={this.passwordRevealed ? 'EyeStrikethrough' : 'Eye'}\n              hasBorder={false}\n              isInset\n              isInactive={inactive}\n              ariaLabel={this.passwordRevealed ? this.hidePasswordLabel : this.showPasswordLabel}\n              onDsClick={this.handleTogglePassword}\n            />\n          )}\n          {numeric && this.textAlign === 'start' && this.renderNumericStepper(inactive)}\n        </div>\n        {showError && (\n          <ds-text\n            class=\"error-text\"\n            as=\"div\"\n            variant=\"text-body-small\"\n            color=\"negative\"\n            textId={this.errorId}\n            role=\"alert\"\n          >\n            {this.errorMessage}\n          </ds-text>\n        )}\n      </Host>\n    );\n  }\n}\n",
       "type": "registry:ui"
     }
   ]

package/dist/mcp-data/registry/loader.json

@@ -172,7 +172,7 @@
       "peerDependencies": {
         "required": [
           "@ds-mo/tokens ^6.5.1",
-          "@ds-mo/icons ^7.0.0"
+          "@ds-mo/icons ^8.1.0"
         ],
         "frameworks": "Custom Elements; React 18/19 wrappers; Vue 3 wrappers; Angular 19-22 standalone adapters."
       }

package/dist/mcp-data/registry/markdown.json

@@ -123,7 +123,7 @@
       "peerDependencies": {
         "required": [
           "@ds-mo/tokens ^6.5.1",
-          "@ds-mo/icons ^7.0.0"
+          "@ds-mo/icons ^8.1.0"
         ],
         "frameworks": "Custom Elements; React 18/19 wrappers; Vue 3 wrappers; Angular 19-22 standalone adapters."
       }