@5even7/dlc-ui 0.2.18 → 0.2.20

package/dist/chunks/avatar-creator-DiAmhpRa.mjs

@@ -0,0 +1,687 @@
+import { c as createEmitter } from './emitter-CxLYMSbw.mjs';
+import { b as buildControlsFromSchema, s as sanitizeSvg, a as applySize, d as svgToDataUri, e as escapeXml } from './controls-B5_ctvvA.mjs';
+import { i as identicon, m as mergedDicebearSchema, s as schema, a as schema$1, b as schema$2, c as schema$3, d as schema$4, e as schema$5, f as schema$6, g as schema$7, n as normalizeDicebearOptions, h as defineDicebearStyle } from './identicon-BUdMd-yf.mjs';
+
+/**
+ * DiceBear provider — vendored @dicebear/core@9.4.2 + 8 CC0 styles.
+ *
+ * Style *definitions* (upstream schemas + metadata) are statically bundled so
+ * `getStyleDefinitions()` / `getStyleDefinition()` stay synchronous; the heavy
+ * per-style *rendering modules* (components) load on demand through
+ * `loadDicebearStyle()` / `loadAvatarStyle()` — 这是组件字符串路径内部用的。
+ * 纯函数路径请直接 `import { lorelei } from '../styles'` 并传给
+ * `createAvatarSvg(styleModule, options)`：同步、tree-shaking、零注册表。
+ *
+ * The default style (identicon, ~13 KB) is also bundled statically, so the
+ * default component path renders with zero network wait.
+ *
+ * Every style keeps its upstream schema untouched (the only tweak is that
+ * color patterns accept 8-digit #rrggbbaa hex for alpha support).
+ * `providerOptions` are validated against the merged schema (core options +
+ * style options) so that names, types, defaults and array semantics match
+ * upstream exactly; unknown or mistyped parameters produce warnings (or
+ * errors in strict mode) instead of being silently dropped.
+ */
+
+const STYLE_SCHEMAS = {
+  identicon: schema$7,
+  lorelei: schema$6,
+  'lorelei-neutral': schema$5,
+  notionists: schema$4,
+  'notionists-neutral': schema$3,
+  'open-peeps': schema$2,
+  rings: schema$1,
+  shapes: schema
+};
+
+/**
+ * Upstream style metadata (title/creator/source/homepage/license), extracted
+ * from the vendored style modules so the registry stays synchronous. The
+ * full rendering modules are loaded on demand; the metadata never changes
+ * per-load, so a static table keeps definitions stable and cheap.
+ */
+const STYLE_META = {
+  identicon: {
+    title: 'Identicon',
+    creator: 'DiceBear',
+    source: 'https://www.dicebear.com',
+    homepage: 'https://www.dicebear.com',
+    license: 'CC0 1.0',
+    licenseUrl: 'https://creativecommons.org/publicdomain/zero/1.0/'
+  },
+  lorelei: {
+    title: 'Lorelei',
+    creator: 'Lisa Wischofsky',
+    source: 'https://www.figma.com/community/file/1198749693280469639',
+    homepage: 'https://www.instagram.com/lischi_art/',
+    license: 'CC0 1.0',
+    licenseUrl: 'https://creativecommons.org/publicdomain/zero/1.0/'
+  },
+  'lorelei-neutral': {
+    title: 'Lorelei Neutral',
+    creator: 'Lisa Wischofsky',
+    source: 'https://www.figma.com/community/file/1198749693280469639',
+    homepage: 'https://www.instagram.com/lischi_art/',
+    license: 'CC0 1.0',
+    licenseUrl: 'https://creativecommons.org/publicdomain/zero/1.0/'
+  },
+  notionists: {
+    title: 'Notionists',
+    creator: 'Zoish',
+    source: 'https://heyzoish.gumroad.com/l/notionists',
+    homepage: 'https://bio.link/heyzoish',
+    license: 'CC0 1.0',
+    licenseUrl: 'https://creativecommons.org/publicdomain/zero/1.0/'
+  },
+  'notionists-neutral': {
+    title: 'Notionists Neutral',
+    creator: 'Zoish',
+    source: 'https://heyzoish.gumroad.com/l/notionists',
+    homepage: 'https://bio.link/heyzoish',
+    license: 'CC0 1.0',
+    licenseUrl: 'https://creativecommons.org/publicdomain/zero/1.0/'
+  },
+  'open-peeps': {
+    title: 'Open Peeps',
+    creator: 'Pablo Stanley',
+    source: 'https://www.openpeeps.com/',
+    homepage: 'https://twitter.com/pablostanley',
+    license: 'CC0 1.0',
+    licenseUrl: 'https://creativecommons.org/publicdomain/zero/1.0/'
+  },
+  rings: {
+    title: 'Rings',
+    creator: 'DiceBear',
+    source: 'https://www.dicebear.com',
+    homepage: 'https://www.dicebear.com',
+    license: 'CC0 1.0',
+    licenseUrl: 'https://creativecommons.org/publicdomain/zero/1.0/'
+  },
+  shapes: {
+    title: 'Shapes',
+    creator: 'DiceBear',
+    source: 'https://www.dicebear.com',
+    homepage: 'https://www.dicebear.com',
+    license: 'CC0 1.0',
+    licenseUrl: 'https://creativecommons.org/publicdomain/zero/1.0/'
+  }
+};
+
+// Explicit per-style loader map — rollup can only analyze static import()
+// targets, so each vendored style module becomes its own lazy chunk.
+const STYLE_LOADERS = {
+  identicon: () => import('./identicon-BUdMd-yf.mjs').then(function (n) { return n.j; }),
+  lorelei: () => import('./index-_sf_14Zu.mjs').then(function (n) { return n.m; }),
+  'lorelei-neutral': () => import('./index-BtH8Lbra.mjs').then(function (n) { return n.m; }),
+  notionists: () => import('./index-BchW1tWE.mjs').then(function (n) { return n.m; }),
+  'notionists-neutral': () => import('./index-C02dvGLD.mjs').then(function (n) { return n.m; }),
+  'open-peeps': () => import('./index-w5Pzdwhv.mjs').then(function (n) { return n.m; }),
+  rings: () => import('./index-CFybYBA1.mjs').then(function (n) { return n.m; }),
+  shapes: () => import('./index-DgI872-7.mjs').then(function (n) { return n.m; })
+};
+
+const loadedStyles = new Map();
+const loadingStyles = new Map();
+
+// 默认画风静态打进主包：createAvatarSvg() 默认路径无需任何异步等待。
+loadedStyles.set('identicon', identicon);
+
+/**
+ * Load (and cache) a dicebear style rendering module. Concurrent calls for
+ * the same style share a single import; different styles stay independent.
+ */
+function loadDicebearStyle(styleId) {
+  const loader = STYLE_LOADERS[styleId];
+  if (!loader) return Promise.reject(new Error(`dlc-avatar-creator: unknown dicebear style "${styleId}"`));
+  if (loadedStyles.has(styleId)) return Promise.resolve(loadedStyles.get(styleId));
+  if (!loadingStyles.has(styleId)) {
+    loadingStyles.set(styleId, loader().then((module) => {
+      const meta = STYLE_META[styleId];
+      const title = EN_TITLES[styleId] || meta.title || styleId;
+      loadedStyles.set(styleId, defineDicebearStyle({
+        id: styleId,
+        module,
+        schema: STYLE_SCHEMAS[styleId],
+        meta,
+        label: (ZH_LABELS[styleId] || title) + '（' + title + '）',
+        title
+      }));
+      loadingStyles.delete(styleId);
+      return loadedStyles.get(styleId);
+    }).catch((error) => {
+      loadingStyles.delete(styleId);
+      throw error;
+    }));
+  }
+  return loadingStyles.get(styleId);
+}
+
+/** 同步判断某个 dicebear 画风模块是否已经就绪（组件字符串路径占位用）。 */
+function isDicebearStyleLoaded(styleId) {
+  return loadedStyles.has(styleId);
+}
+
+const ZH_LABELS = {
+  identicon: '几何标识',
+  lorelei: '洛蕾莱',
+  'lorelei-neutral': '洛蕾莱 · 中性',
+  notionists: '概念派',
+  'notionists-neutral': '概念派 · 中性',
+  'open-peeps': '开放小人',
+  rings: '同心圆环',
+  shapes: '几何形状'
+};
+// 上游 vendored meta.title 有个别样板标题不准确（notionists-neutral 写成了
+// 'Notionists' 而非官方 'Notionists Neutral'），这里统一补上官方英文名，保证
+// getStyleDefinitions() 的 label / title 展示正确。
+const EN_TITLES = {
+  'notionists-neutral': 'Notionists Neutral'
+};
+
+function buildStyleDefinitions() {
+  const definitions = [];
+  for (const id of Object.keys(STYLE_META)) {
+    const meta = STYLE_META[id];
+    const schema = mergedSchema(id);
+    const title = EN_TITLES[id] || meta.title || id;
+    definitions.push({
+      id,
+      label: (ZH_LABELS[id] || title) + '（' + title + '）',
+      provider: 'dicebear',
+      title,
+      designer: meta.creator || '',
+      homepage: meta.homepage || '',
+      source: meta.source || '',
+      license: meta.license || 'MIT',
+      licenseUrl: meta.licenseUrl || '',
+      schema,
+      controls: buildControlsFromSchema(schema)
+    });
+  }
+  return definitions;
+}
+
+function mergedSchema(styleId) {
+  const schema = STYLE_SCHEMAS[styleId];
+  if (!schema) return null;
+  return mergedDicebearSchema(schema);
+}
+
+const dicebearProvider = {
+  id: 'dicebear',
+  label: 'DiceBear',
+  styles: buildStyleDefinitions(),
+
+  getStyleDefinition(styleId) {
+    return this.styles.find((style) => style.id === styleId);
+  },
+
+  /**
+   * Validate & normalize providerOptions against the merged upstream schema.
+   * Returns { normalized, warnings } — unknown keys / invalid values are
+   * never silently dropped.
+   *
+   * Color arrays accept any CSS color: hex (#fff / #ffffff / #ffffffff,
+   * with or without the hash), rgb() / rgba() / hsl() / hsla() (comma or
+   * modern syntax), CSS named colors ('red', 'green', …) and 'transparent'.
+   * Everything is normalized to a 6/8-digit hex (or 'transparent') before
+   * schema validation, so hex colors behave the same as the common-layer
+   * `background` option.
+   */
+  normalizeOptions(styleId, options, { strict = false } = {}) {
+    const schema = mergedSchema(styleId);
+    if (!schema) {
+      throw new Error(`dlc-avatar-creator: unknown dicebear style "${styleId}"`);
+    }
+    return normalizeDicebearOptions(schema, options, { strict });
+  },
+
+  /**
+   * Render a style from seed + common options + normalized native options.
+   * Synchronous — throws a clear error if the style module is not loaded yet
+   * (call loadDicebearStyle() / loadAvatarStyle() first).
+   */
+  render({ style: styleId, seed, size, background, options, strict = false }) {
+    const styleObj = loadedStyles.get(styleId);
+    if (!styleObj) {
+      if (!STYLE_LOADERS[styleId]) {
+        throw new Error(`dlc-avatar-creator: unknown dicebear style "${styleId}"`);
+      }
+      throw new Error(
+        `dlc-avatar-creator: dicebear style "${styleId}" is not loaded yet — ` +
+        `import { ${styleId} } from '@5even7/dlc-ui/avatar-creator/styles' and pass it to createAvatarSvg/createAvatarCreator`
+      );
+    }
+    return styleObj.render({ seed, size, background, options, strict });
+  }
+};
+
+/**
+ * Provider registry — the only place that knows about providers.
+ * dlc-avatar-creator resolves `provider` + `style` through here and never
+ * hardcodes generator internals anywhere else.
+ *
+ * Load-on-demand model:
+ *  - dicebear: definitions are static (schemas bundled); each style's heavy
+ *    rendering module loads via loadDicebearStyle() / loadAvatarStyle().
+ *  - humation: the whole module (~0.7 MB manifest) is one lazy chunk; a stub
+ *    keeps the registry / getProviders() working before it is loaded.
+ */
+
+const humationStub = {
+  id: 'humation',
+  label: 'Humation',
+  loaded: false,
+  // Placeholder so getProviders() lists humation-1 before the chunk loads;
+  // replaced by the real definition once humation is loaded.
+  styles: [{ id: 'humation-1' }],
+  getStyleDefinition() { return undefined; },
+  normalizeOptions() {
+    throw new Error('dlc-avatar-creator: humation is not loaded yet — `import { humation } from \'@5even7/dlc-ui/avatar-creator/styles/humation\'` and pass it to createAvatarSvg/createAvatarCreator');
+  },
+  render() {
+    throw new Error('dlc-avatar-creator: humation is not loaded yet — `import { humation } from \'@5even7/dlc-ui/avatar-creator/styles/humation\'` and pass it to createAvatarSvg/createAvatarCreator');
+  }
+};
+
+let humationLoading = null;
+
+function loadHumation() {
+  if (!humationLoading) {
+    humationLoading = import('./humation-B9OPUGL7.mjs').then((module) => {
+      const provider = module.humationProvider || module.default;
+      humationStub.styles = provider.styles;
+      humationStub.getStyleDefinition = provider.getStyleDefinition.bind(provider);
+      humationStub.normalizeOptions = provider.normalizeOptions.bind(provider);
+      humationStub.render = provider.render.bind(provider);
+      humationStub.loaded = true;
+      return provider;
+    });
+  }
+  return humationLoading;
+}
+
+const PROVIDERS = [dicebearProvider, humationStub];
+
+function getProviders() {
+  return PROVIDERS.map((provider) => ({
+    id: provider.id,
+    label: provider.label,
+    styles: provider.styles.map((style) => style.id)
+  }));
+}
+
+function getProvider(providerId) {
+  if (typeof providerId !== 'string') return undefined;
+  const id = providerId.includes(':') ? providerId.split(':')[0] : providerId;
+  return PROVIDERS.find((provider) => provider.id === id);
+}
+
+function getStyleDefinition(providerId, styleId) {
+  const provider = getProvider(providerId);
+  if (!provider) return undefined;
+  return provider.getStyleDefinition(styleId);
+}
+
+function getStyleDefinitions() {
+  const definitions = [];
+  for (const provider of PROVIDERS) definitions.push(...provider.styles);
+  return definitions;
+}
+
+function resolveStyle(providerId, styleId) {
+  if (typeof styleId === 'string' && styleId.includes(':') && !providerId) {
+    const [resolvedProvider, resolvedStyle] = styleId.split(':');
+    return { provider: resolvedProvider, style: resolvedStyle };
+  }
+  return { provider: providerId, style: styleId };
+}
+
+/**
+ * Load one avatar style's rendering module (cached; safe to call repeatedly
+ * and concurrently — the same style shares a single import). Resolves to the
+ * loaded provider/style module so callers can inspect it; rejects for
+ * unknown providers or styles.
+ */
+function loadAvatarStyle(providerId, styleId) {
+  if (typeof providerId !== 'string' || providerId === '') {
+    return Promise.reject(new Error('dlc-avatar-creator: provider is required'));
+  }
+  const provider = getProvider(providerId);
+  if (!provider) {
+    return Promise.reject(new Error(`dlc-avatar-creator: unknown provider "${providerId}"`));
+  }
+  if (providerId === 'humation') {
+    return loadHumation();
+  }
+  if (providerId === 'dicebear') {
+    if (typeof styleId !== 'string' || styleId === '') {
+      return Promise.reject(new Error('dlc-avatar-creator: style is required for dicebear'));
+    }
+    return loadDicebearStyle(styleId);
+  }
+  return Promise.reject(new Error(`dlc-avatar-creator: provider "${providerId}" has no style loader`));
+}
+
+/** 同步判断某个画风是否已加载（组件字符串路径首次渲染时决定要不要显示占位）。 */
+function isAvatarStyleLoaded(providerId, styleId) {
+  if (providerId === 'dicebear') return isDicebearStyleLoaded(styleId);
+  if (providerId === 'humation') return humationStub.loaded === true;
+  return false;
+}
+
+/**
+ * dlc-avatar-creator facade.
+ *
+ * Pure SVG generation (createAvatarSvg) + DOM controller (createAvatarCreator).
+ *
+ * Two option layers, exactly as designed:
+ *
+ *   createAvatarCreator(el, {
+ *     provider: 'dicebear',        // 'dicebear' | 'humation'
+ *     style: 'lorelei',
+ *     seed: 'user-123',
+ *     size: 160,                   // common layer
+ *     background: '#fff',          // common layer
+ *     providerOptions: {           // native upstream params, validated vs schema
+ *       hair: ['variant01'],
+ *       glasses: ['variant02'],
+ *       flip: true,
+ *       rotate: 10,
+ *       scale: 90
+ *     },
+ *     strict: false                // true -> throw on unrecognized/invalid params
+ *   });
+ *
+ * Only renders an SVG into the container — no forms, no downloads, no npm
+ * packages. UI widgets are the caller's job, driven by getStyleDefinitions().
+ */
+
+function defaultSeed() {
+  return Math.random().toString(36).slice(2, 10);
+}
+
+function normalizeSize(value) {
+  if (value == null || value === '') return undefined;
+  const num = Number(value);
+  if (Number.isFinite(num) && num > 0) return num;
+  throw new Error(`dlc-avatar-creator: invalid size "${value}"`);
+}
+
+function normalizeString(value, fallback) {
+  if (typeof value !== 'string' || value.trim() === '') return fallback;
+  return value.trim();
+}
+
+function deepClone(value) {
+  if (typeof structuredClone === 'function') return structuredClone(value);
+  return JSON.parse(JSON.stringify(value));
+}
+
+/**
+ * Pure renderer（Element / DiceBear 式）：
+ *   import { lorelei } from '@5even7/dlc-ui/avatar-creator/styles'
+ *   createAvatarSvg(lorelei, { seed: 'x', size: 160, providerOptions: { hair: [...] } })
+ * 画风是 import 进来的模块：同步渲染、可 tree-shaking、无需注册表/预加载。
+ * Returns { svg, width, height, warnings, metadata }. No DOM involved.
+ */
+function createAvatarSvg(style, options = {}) {
+  if (!style || typeof style.render !== 'function') {
+    throw new Error(
+      "dlc-avatar-creator: a style module is required — import one from '@5even7/dlc-ui/avatar-creator/styles', " +
+      "e.g. `import { lorelei } from '@5even7/dlc-ui/avatar-creator/styles'`"
+    );
+  }
+  const seed = normalizeString(options.seed, defaultSeed());
+  const size = normalizeSize(options.size);
+  const background = options.background;
+  const strict = options.strict === true;
+
+  const result = style.render({
+    seed,
+    size,
+    background,
+    options: options.providerOptions || {},
+    strict
+  });
+
+  let svg = sanitizeSvg(result.svg);
+  if (size != null) svg = applySize(svg, size);
+  return {
+    svg,
+    width: result.width,
+    height: result.height,
+    warnings: result.warnings,
+    metadata: { ...result.metadata, size, background: background !== undefined ? String(background) : undefined }
+  };
+}
+const AVATAR_POSTER_HTML = '<div class="dlc-avatar-poster" aria-hidden="true"></div>';
+
+/**
+ * DOM controller — mounts the avatar SVG into a container and keeps it in
+ * sync with setter calls.
+ */
+function createAvatarCreator(container, options = {}) {
+  if (!container || typeof container.appendChild !== 'function') {
+    throw new Error('dlc-avatar-creator: container element is required');
+  }
+
+  const emitter = createEmitter();
+  const state = {
+    provider: options.provider || 'dicebear',
+    style: options.style,
+    seed: options.seed,
+    size: options.size,
+    background: options.background,
+    providerOptions: options.providerOptions ? deepClone(options.providerOptions) : {},
+    strict: options.strict === true
+  };
+
+  const element = document.createElement('div');
+  element.className = 'dlc-avatar-creator';
+  container.appendChild(element);
+
+  function warnAll(warnings) {
+    for (const warning of warnings) emitter.emit('warning', warning);
+  }
+
+  /**
+   * 用候选状态渲染并提交：createAvatarSvg 抛错时 state / DOM 都保持原样
+   * （原子化），避免 setSize(-1) 之类的失败调用把控制器留在脏状态。
+   * 提交是异步的（首次会按需加载样式模块，之后命中缓存直接渲染），
+   * 失败时发出 'error' 事件并 reject，state / DOM 不变。
+   */
+  let commitSeq = 0;
+  let lastApplied = null;
+  let pendingCommit = null;
+  let readyFired = false;
+
+  async function commit(next = {}) {
+    const seq = ++commitSeq;
+    const candidate = {
+      provider: next.provider !== undefined ? next.provider : state.provider,
+      style: next.style !== undefined ? next.style : state.style,
+      seed: next.seed !== undefined ? next.seed : state.seed,
+      size: next.size !== undefined ? next.size : state.size,
+      background: next.background !== undefined ? next.background : state.background,
+      providerOptions: next.providerOptions !== undefined
+        ? deepClone(next.providerOptions || {})
+        : deepClone(state.providerOptions || {}),
+      strict: next.strict !== undefined ? next.strict === true : state.strict
+    };
+    const promise = (async () => {
+      try {
+        let styleObj = candidate.style;
+        const applyResult = (result) => {
+          Object.assign(state, candidate);
+          element.innerHTML = result.svg;
+          element.style.width = '';
+          element.style.height = '';
+          element.setAttribute('data-provider', escapeXml(result.metadata.provider));
+          element.setAttribute('data-style', escapeXml(result.metadata.style));
+          warnAll(result.warnings);
+          lastApplied = result;
+          // 'ready' 表示首次真正上屏的提交完成；被后续提交取代的初始提交不算。
+          if (!readyFired) {
+            readyFired = true;
+            queueMicrotask(() => emitter.emit('ready', { ...result, state: controller.state }));
+          }
+          return result;
+        };
+        const renderCurrent = (style) => createAvatarSvg(style, {
+          seed: candidate.seed,
+          size: candidate.size,
+          background: candidate.background,
+          providerOptions: candidate.providerOptions,
+          strict: candidate.strict
+        });
+
+        // 字符串路径（模板/CDN 用）：走 provider 注册表，内部按需加载画风模块；
+        // 模块路径（script 用）：直接使用 import 进来的画风对象，同步渲染。
+        if (typeof styleObj !== 'object' || styleObj === null || typeof styleObj.render !== 'function') {
+          const { provider: providerInput, style: styleInput } = resolveStyle(candidate.provider, candidate.style);
+          const provider = getProvider(providerInput || 'dicebear');
+          if (!provider) {
+            throw new Error(`dlc-avatar-creator: unknown provider "${providerInput}" (available: dicebear, humation)`);
+          }
+          let styleId = normalizeString(styleInput, provider.styles[0] ? provider.styles[0].id : undefined);
+          // 显式传入的非法 style 仍然报错；从 state 继承的旧 style 在换 provider
+          // 后不属于新 provider 时回退到新 provider 的默认样式（与 emo setType 一致）。
+          if (next.style === undefined && styleId && !getStyleDefinition(provider.id, styleId)) {
+            styleId = provider.styles[0] ? provider.styles[0].id : styleId;
+          }
+          // 画风模块还没就绪时先显示占位，避免白屏；失败时恢复原样。
+          let restore = null;
+          if (!isAvatarStyleLoaded(provider.id, styleId)) {
+            const previousHtml = element.innerHTML;
+            element.innerHTML = AVATAR_POSTER_HTML;
+            if (typeof candidate.size === 'number' && candidate.size > 0) {
+              element.style.width = `${candidate.size}px`;
+              element.style.height = `${candidate.size}px`;
+            }
+            restore = () => {
+              element.innerHTML = previousHtml;
+              element.style.width = '';
+              element.style.height = '';
+            };
+          }
+          try {
+            const loaded = await loadAvatarStyle(provider.id, styleId);
+            if (!getStyleDefinition(provider.id, styleId)) {
+              throw new Error(`dlc-avatar-creator: unknown style "${styleId}" for provider "${provider.id}"`);
+            }
+            styleObj = provider.id === 'humation'
+              ? {
+                  ...provider.styles[0],
+                  render: (renderOptions) => provider.render({ style: provider.styles[0].id, ...renderOptions })
+                }
+              : loaded;
+          } catch (error) {
+            if (restore) restore();
+            throw error;
+          }
+        }
+        if (seq !== commitSeq) {
+          // 已被更新的提交取代：state / DOM 交给新提交，返回当前已提交的结果。
+          return { superseded: true, ...(lastApplied ? { result: lastApplied } : {}) };
+        }
+        return applyResult(renderCurrent(styleObj));
+      } catch (error) {
+        if (seq !== commitSeq) return { superseded: true };
+        emitter.emit('error', error);
+        throw error;
+      }
+    })();
+    pendingCommit = promise;
+    return promise;
+  }
+
+  function render() {
+    return commit();
+  }
+
+  const settlePending = () => (pendingCommit ? pendingCommit.catch(() => null) : Promise.resolve());
+
+  const controller = {
+    element,
+
+    get state() {
+      return { ...state, providerOptions: deepClone(state.providerOptions) };
+    },
+
+    async getSvg() {
+      await settlePending();
+      return (await render()).svg;
+    },
+
+    async getResult() {
+      await settlePending();
+      return render();
+    },
+
+    async toDataUri() {
+      await settlePending();
+      return svgToDataUri((await render()).svg);
+    },
+
+    setOptions(next = {}) {
+      const promise = commit(next);
+      promise.then((result) => {
+        if (result && result.superseded) return;
+        emitter.emit('change', { ...result, state: this.state });
+      }).catch(() => {});
+      return promise;
+    },
+
+    setProvider(provider) {
+      return this.setOptions({ provider });
+    },
+
+    setStyle(style) {
+      return this.setOptions({ style });
+    },
+
+    setSeed(seed) {
+      return this.setOptions({ seed });
+    },
+
+    setSize(size) {
+      return this.setOptions({ size });
+    },
+
+    setBackground(background) {
+      return this.setOptions({ background });
+    },
+
+    setProviderOptions(providerOptions) {
+      return this.setOptions({ providerOptions });
+    },
+
+    randomize() {
+      return this.setOptions({ seed: defaultSeed() });
+    },
+
+    on(event, fn) {
+      return emitter.on(event, fn);
+    },
+
+    off(event, fn) {
+      return emitter.off(event, fn);
+    },
+
+    destroy() {
+      element.innerHTML = '';
+      if (element.parentNode) element.parentNode.removeChild(element);
+    },
+
+    dispose() {
+      return this.destroy();
+    }
+  };
+
+  // 首次渲染按需加载样式；加载失败已通过 'error' 事件上报，'ready' 不触发。
+  render().catch(() => {});
+  return controller;
+}
+
+export { createAvatarSvg as a, getProviders as b, createAvatarCreator as c, getStyleDefinition as d, getStyleDefinitions as e, dicebearProvider as f, getProvider as g };