@chenzy-design/svelte 0.1.0

package/dist/spin/Spin.a11y.test.js

@@ -0,0 +1,27 @@
+// Spin a11y：role=status + aria-live=polite 公布加载。
+// 经 SpinA11yFixture（不注入 children，使 inline 形态生效；harness 会恒注入空 children → wrapper）。
+import { describe, it, expect } from 'vitest';
+import { render } from '@testing-library/svelte';
+import { expectNoAxeViolations } from '../test-utils/a11y.js';
+import SpinA11yFixture from './SpinA11yFixture.svelte';
+describe('Spin a11y', () => {
+    it('inline：role=status + aria-live + aria-label（来自 locale），无 axe violations', async () => {
+        const { container } = render(SpinA11yFixture, {
+            props: { props: { spinning: true } },
+        });
+        const root = container.querySelector('.cd-spin');
+        expect(root?.getAttribute('role')).toBe('status');
+        expect(root?.getAttribute('aria-live')).toBe('polite');
+        // 无 tip 时取 locale 的 Spin.loading 作为可访问名。
+        expect(root?.getAttribute('aria-label')).toBeTruthy();
+        await expectNoAxeViolations(container);
+    });
+    it('inline + tip：tip 文本作为可访问名，无 axe violations', async () => {
+        const { container } = render(SpinA11yFixture, {
+            props: { props: { spinning: true, tip: 'Loading data' } },
+        });
+        const tip = container.querySelector('.cd-spin__tip');
+        expect(tip?.textContent).toContain('Loading data');
+        await expectNoAxeViolations(container);
+    });
+});

package/dist/spin/Spin.svelte

@@ -0,0 +1,293 @@
+<!--
+  Spin — see specs/components/feedback/Spin.spec.md
+  加载指示器：inline / wrapper / fullscreen 三形态。
+  delay 去抖 + minShowTime 最短显示 由 @chenzy-design/core createSpinController 提供（必须复用，不重复实现）。
+  红线 #1：spinning 是受控输入，effective 是内部派生显示态，绝不回写 spinning，仅触发 onShow/onHide。
+  红线 #3：定时器/订阅全部在 $effect 命令式管理 + cleanup，无 DOM 几何测量。
+  role=status (aria-live=polite) 公布加载；wrapper 内容 aria-busy；reduced-motion 退化为呼吸。
+-->
+<script lang="ts">
+  import type { Snippet } from 'svelte';
+  import { createSpinController, type SpinController } from '@chenzy-design/core';
+  import { useLocale } from '../locale-provider/index.js';
+
+  type Size = 'small' | 'default' | 'large';
+
+  interface Props {
+    spinning?: boolean;
+    size?: Size;
+    tip?: string;
+    delay?: number;
+    minShowTime?: number;
+    fullscreen?: boolean;
+    wrapperClassName?: string;
+    ariaLabel?: string;
+    indicator?: Snippet<[{ size: Size }]>;
+    children?: Snippet;
+    onShow?: () => void;
+    onHide?: () => void;
+  }
+
+  let {
+    spinning = true,
+    size = 'default',
+    tip = '',
+    delay = 0,
+    minShowTime = 0,
+    fullscreen = false,
+    wrapperClassName = '',
+    ariaLabel,
+    indicator,
+    children,
+    onShow,
+    onHide,
+  }: Props = $props();
+
+  const loc = useLocale();
+
+  // effective：内部派生显示态，render 读它决定显隐（红线 #1）。
+  let effective = $state(false);
+  // controller 在 client $effect 命令式创建（SSR 安全），不在 render 路径触碰定时器。
+  let ctrl: SpinController | null = $state(null);
+
+  // effect A：mount 时创建 controller 并订阅；依赖 delay/minShowTime（变化才重建）。
+  // 不依赖 spinning：避免 spinning 变化重建 controller 丢失去抖/最短显示状态。
+  $effect(() => {
+    const controller = createSpinController({ delay, minShowTime, spinning });
+    ctrl = controller;
+    effective = controller.getEffective();
+    const unsub = controller.subscribe((v) => {
+      effective = v;
+      if (v) onShow?.();
+      else onHide?.();
+    });
+    return () => {
+      unsub();
+      controller.destroy();
+      ctrl = null;
+    };
+  });
+
+  // effect B：仅依赖 spinning + ctrl，把受控请求推给 controller（红线 #1：只推入，不回写）。
+  $effect(() => {
+    ctrl?.setSpinning(spinning);
+  });
+
+  const isWrapper = $derived(children !== undefined && !fullscreen);
+  const isFullscreen = $derived(fullscreen);
+  const isInline = $derived(!isWrapper && !isFullscreen);
+
+  const hasTip = $derived(tip.length > 0);
+  // 有 tip 时 tip 文本作为可访问名；无 tip 时用 ariaLabel。
+  const statusLabel = $derived(hasTip ? undefined : (ariaLabel ?? loc().t('Spin.loading')));
+
+  const indicatorClass = $derived(`cd-spin__indicator cd-spin__indicator--${size}`);
+</script>
+
+{#snippet defaultIndicator()}
+  <svg
+    class={indicatorClass}
+    viewBox="0 0 24 24"
+    aria-hidden="true"
+    focusable="false"
+  >
+    <circle
+      class="cd-spin__track"
+      cx="12"
+      cy="12"
+      r="10"
+      fill="none"
+      stroke="var(--cd-spin-track-color)"
+      stroke-width="2.5"
+    />
+    <circle
+      class="cd-spin__arc"
+      cx="12"
+      cy="12"
+      r="10"
+      fill="none"
+      stroke="var(--cd-spin-color)"
+      stroke-width="2.5"
+      stroke-linecap="round"
+      stroke-dasharray="47 63"
+    />
+  </svg>
+{/snippet}
+
+{#snippet spinner()}
+  {#if indicator}
+    {@render indicator({ size })}
+  {:else}
+    {@render defaultIndicator()}
+  {/if}
+{/snippet}
+
+{#if isInline}
+  <div
+    class="cd-spin cd-spin--{size}"
+    role="status"
+    aria-live="polite"
+    aria-label={statusLabel}
+  >
+    {@render spinner()}
+    {#if hasTip}
+      <div class="cd-spin__tip">{tip}</div>
+    {/if}
+  </div>
+{:else if isFullscreen}
+  {#if effective}
+    <div
+      class="cd-spin cd-spin--{size} cd-spin--fullscreen"
+      role="status"
+      aria-live="polite"
+      aria-label={statusLabel}
+    >
+      <div class="cd-spin__box">
+        {@render spinner()}
+        {#if hasTip}
+          <div class="cd-spin__tip">{tip}</div>
+        {/if}
+      </div>
+    </div>
+  {/if}
+{:else}
+  <div class="cd-spin-wrapper {wrapperClassName}">
+    <div
+      class="cd-spin__content"
+      class:cd-spin__content--blur={effective}
+      aria-busy={effective ? true : undefined}
+      inert={effective ? true : undefined}
+    >
+      {@render children?.()}
+    </div>
+    {#if effective}
+      <div
+        class="cd-spin__overlay cd-spin--{size}"
+        role="status"
+        aria-live="polite"
+        aria-label={statusLabel}
+      >
+        <div class="cd-spin__box">
+          {@render spinner()}
+          {#if hasTip}
+            <div class="cd-spin__tip">{tip}</div>
+          {/if}
+        </div>
+      </div>
+    {/if}
+  </div>
+{/if}
+
+<style>
+  .cd-spin {
+    display: inline-flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    gap: var(--cd-spin-tip-gap);
+    color: var(--cd-spin-color);
+  }
+
+  .cd-spin__indicator {
+    display: block;
+    inline-size: var(--cd-spin-size-default);
+    block-size: var(--cd-spin-size-default);
+    animation: cd-spin-rotate var(--cd-spin-duration) linear infinite;
+  }
+  .cd-spin__indicator--small {
+    inline-size: var(--cd-spin-size-small);
+    block-size: var(--cd-spin-size-small);
+  }
+  .cd-spin__indicator--default {
+    inline-size: var(--cd-spin-size-default);
+    block-size: var(--cd-spin-size-default);
+  }
+  .cd-spin__indicator--large {
+    inline-size: var(--cd-spin-size-large);
+    block-size: var(--cd-spin-size-large);
+  }
+
+  .cd-spin__tip {
+    color: var(--cd-spin-tip-color);
+    font-size: var(--cd-font-size-body);
+    text-align: center;
+  }
+
+  /* wrapper 形态 */
+  .cd-spin-wrapper {
+    position: relative;
+  }
+  .cd-spin__content {
+    transition: opacity var(--cd-spin-fade-duration) var(--cd-motion-ease-standard);
+  }
+  .cd-spin__content--blur {
+    opacity: 0.5;
+    pointer-events: none;
+    user-select: none;
+  }
+  .cd-spin__overlay {
+    position: absolute;
+    inset: 0;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    z-index: var(--cd-spin-z);
+    background: var(--cd-spin-mask-bg);
+    animation: cd-spin-fade var(--cd-spin-fade-duration) var(--cd-motion-ease-standard);
+  }
+
+  /* fullscreen 形态 */
+  .cd-spin--fullscreen {
+    position: fixed;
+    inset: 0;
+    z-index: var(--cd-spin-z-fullscreen);
+    background: var(--cd-spin-mask-bg);
+    animation: cd-spin-fade var(--cd-spin-fade-duration) var(--cd-motion-ease-standard);
+  }
+
+  .cd-spin__box {
+    display: inline-flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    gap: var(--cd-spin-tip-gap);
+    color: var(--cd-spin-color);
+  }
+
+  @keyframes cd-spin-rotate {
+    to {
+      transform: rotate(360deg);
+    }
+  }
+  @keyframes cd-spin-fade {
+    from {
+      opacity: 0;
+    }
+    to {
+      opacity: 1;
+    }
+  }
+
+  @media (prefers-reduced-motion: reduce) {
+    .cd-spin__indicator {
+      animation: cd-spin-pulse var(--cd-spin-duration-reduced) ease-in-out infinite;
+    }
+    .cd-spin__overlay,
+    .cd-spin--fullscreen {
+      animation: none;
+    }
+    .cd-spin__content {
+      transition: none;
+    }
+  }
+
+  @keyframes cd-spin-pulse {
+    0%,
+    100% {
+      opacity: 1;
+    }
+    50% {
+      opacity: 0.4;
+    }
+  }
+</style>

package/dist/spin/Spin.svelte.d.ts

@@ -0,0 +1,22 @@
+import type { Snippet } from 'svelte';
+type Size = 'small' | 'default' | 'large';
+interface Props {
+    spinning?: boolean;
+    size?: Size;
+    tip?: string;
+    delay?: number;
+    minShowTime?: number;
+    fullscreen?: boolean;
+    wrapperClassName?: string;
+    ariaLabel?: string;
+    indicator?: Snippet<[{
+        size: Size;
+    }]>;
+    children?: Snippet;
+    onShow?: () => void;
+    onHide?: () => void;
+}
+declare const Spin: import("svelte").Component<Props, {}, "">;
+type Spin = ReturnType<typeof Spin>;
+export default Spin;
+//# sourceMappingURL=Spin.svelte.d.ts.map

package/dist/spin/Spin.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Spin.svelte.d.ts","sourceRoot":"","sources":["../../src/spin/Spin.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,QAAQ,CAAC;AAKpC,KAAK,IAAI,GAAG,OAAO,GAAG,SAAS,GAAG,OAAO,CAAC;AAE1C,UAAU,KAAK;IACb,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,IAAI,CAAC;IACZ,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,OAAO,CAAC,CAAC;QAAE,IAAI,EAAE,IAAI,CAAA;KAAE,CAAC,CAAC,CAAC;IACtC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;CACrB;AAwHH,QAAA,MAAM,IAAI,2CAAwC,CAAC;AACnD,KAAK,IAAI,GAAG,UAAU,CAAC,OAAO,IAAI,CAAC,CAAC;AACpC,eAAe,IAAI,CAAC"}

package/dist/spin/SpinA11yFixture.svelte

@@ -0,0 +1,18 @@
+<!--
+  Spin a11y 测试夹具：不注入 children，使 inline 形态生效。
+  （renderWithLocale 的 harness 恒注入空 children snippet，会让 Spin 走 wrapper 形态。）
+  自带 LocaleProvider，故测试直接 render 本夹具。
+-->
+<script lang="ts">
+  import { LocaleProvider } from '../locale-provider/index.js';
+  import Spin from './Spin.svelte';
+
+  interface Props {
+    props?: Record<string, unknown>;
+  }
+  let { props = {} }: Props = $props();
+</script>
+
+<LocaleProvider locale="en_US">
+  <Spin {...props} />
+</LocaleProvider>

package/dist/spin/SpinA11yFixture.svelte.d.ts

@@ -0,0 +1,7 @@
+interface Props {
+    props?: Record<string, unknown>;
+}
+declare const SpinA11yFixture: import("svelte").Component<Props, {}, "">;
+type SpinA11yFixture = ReturnType<typeof SpinA11yFixture>;
+export default SpinA11yFixture;
+//# sourceMappingURL=SpinA11yFixture.svelte.d.ts.map

package/dist/spin/SpinA11yFixture.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SpinA11yFixture.svelte.d.ts","sourceRoot":"","sources":["../../src/spin/SpinA11yFixture.svelte.ts"],"names":[],"mappings":"AAOE,UAAU,KAAK;IACb,KAAK,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;CACjC;AAeH,QAAA,MAAM,eAAe,2CAAwC,CAAC;AAC9D,KAAK,eAAe,GAAG,UAAU,CAAC,OAAO,eAAe,CAAC,CAAC;AAC1D,eAAe,eAAe,CAAC"}

package/dist/spin/index.d.ts

@@ -0,0 +1,3 @@
+export { default as Spin } from './Spin.svelte';
+export { meta as spinMeta } from './meta.js';
+//# sourceMappingURL=index.d.ts.map

package/dist/spin/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/spin/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,IAAI,EAAE,MAAM,eAAe,CAAC;AAChD,OAAO,EAAE,IAAI,IAAI,QAAQ,EAAE,MAAM,WAAW,CAAC"}

package/dist/spin/index.js

@@ -0,0 +1,2 @@
+export { default as Spin } from './Spin.svelte';
+export { meta as spinMeta } from './meta.js';

package/dist/spin/meta.d.ts

@@ -0,0 +1,102 @@
+/**
+ * Machine-readable component metadata for AI/docs consumption.
+ * Spin — see specs/components/feedback/Spin.spec.md
+ */
+export declare const meta: {
+    readonly name: "Spin";
+    readonly category: "feedback";
+    readonly description: "加载指示器：inline / wrapper / fullscreen 三形态；delay 去抖 + minShowTime 最短显示（复用 @chenzy-design/core createSpinController）；role=status + aria-live=polite 公布加载，wrapper 内容 aria-busy；reduced-motion 下旋转退化为呼吸。spinning 受控不回写，显隐变化仅触发 onShow/onHide。";
+    readonly exports: readonly ["Spin"];
+    readonly props: readonly [{
+        readonly name: "spinning";
+        readonly type: "boolean";
+        readonly default: "true";
+        readonly desc: "是否加载态；受控不回写";
+    }, {
+        readonly name: "size";
+        readonly type: "'small'|'default'|'large'";
+        readonly default: "'default'";
+    }, {
+        readonly name: "tip";
+        readonly type: "string";
+        readonly default: "''";
+        readonly desc: "指示器下方文案，空则不渲染";
+    }, {
+        readonly name: "delay";
+        readonly type: "number";
+        readonly default: "0";
+        readonly desc: "延迟显示 ms（去抖）";
+    }, {
+        readonly name: "minShowTime";
+        readonly type: "number";
+        readonly default: "0";
+        readonly desc: "最短显示 ms";
+    }, {
+        readonly name: "fullscreen";
+        readonly type: "boolean";
+        readonly default: "false";
+        readonly desc: "全屏固定覆盖";
+    }, {
+        readonly name: "wrapperClassName";
+        readonly type: "string";
+        readonly default: "''";
+        readonly desc: "wrapper 外层自定义类";
+    }, {
+        readonly name: "ariaLabel";
+        readonly type: "string";
+        readonly default: "'加载中'";
+        readonly desc: "无 tip 时的可访问名";
+    }, {
+        readonly name: "indicator";
+        readonly type: "Snippet<[{ size }]>";
+        readonly default: "undefined";
+        readonly desc: "自定义指示器";
+    }, {
+        readonly name: "children";
+        readonly type: "Snippet";
+        readonly default: "undefined";
+        readonly desc: "提供则进入 wrapper 模式包裹内容";
+    }, {
+        readonly name: "onShow";
+        readonly type: "() => void";
+        readonly default: "undefined";
+        readonly desc: "effective false→true";
+    }, {
+        readonly name: "onHide";
+        readonly type: "() => void";
+        readonly default: "undefined";
+        readonly desc: "effective true→false";
+    }];
+    readonly events: readonly [{
+        readonly name: "onShow";
+        readonly desc: "有效显示态由 false 变 true（delay 后真正显示时触发）";
+    }, {
+        readonly name: "onHide";
+        readonly desc: "有效显示态由 true 变 false（满足 minShowTime 后隐藏时触发）";
+    }];
+    readonly slots: readonly [{
+        readonly name: "children";
+        readonly desc: "wrapper 模式下被遮罩包裹的内容";
+    }, {
+        readonly name: "indicator";
+        readonly desc: "自定义指示器（接收 { size }）";
+    }];
+    readonly a11y: {
+        readonly hasRole: true;
+        readonly focusable: false;
+        readonly note: "role=status + aria-live=polite（隐式 aria-atomic）公布加载；无 tip 时 aria-label，有 tip 时 tip 文本即可访问名；wrapper 内容 effectiveSpinning 时 aria-busy=true 并 inert 阻断交互；内置 SVG aria-hidden；不捕获焦点；reduced-motion 旋转退化为 opacity 呼吸。";
+    };
+    readonly tokens: readonly ["--cd-spin-color", "--cd-spin-track-color", "--cd-spin-size-small", "--cd-spin-size-default", "--cd-spin-size-large", "--cd-spin-duration", "--cd-spin-duration-reduced", "--cd-spin-tip-gap", "--cd-spin-tip-color", "--cd-spin-mask-bg", "--cd-spin-z", "--cd-spin-z-fullscreen", "--cd-spin-fade-duration"];
+    readonly responsive: false;
+    readonly examples: readonly [{
+        readonly title: "inline";
+        readonly code: "<Spin spinning />";
+    }, {
+        readonly title: "wrapper 包裹卡片";
+        readonly code: "<Spin spinning={loading}>\n  <Card>内容</Card>\n</Spin>";
+    }, {
+        readonly title: "带 tip";
+        readonly code: "<Spin spinning tip=\"加载中…\" />";
+    }];
+};
+//# sourceMappingURL=meta.d.ts.map

package/dist/spin/meta.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"meta.d.ts","sourceRoot":"","sources":["../../src/spin/meta.ts"],"names":[],"mappings":"AAAA;;;GAGG;AACH,eAAO,MAAM,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAmEP,CAAC"}

package/dist/spin/meta.js

@@ -0,0 +1,71 @@
+/**
+ * Machine-readable component metadata for AI/docs consumption.
+ * Spin — see specs/components/feedback/Spin.spec.md
+ */
+export const meta = {
+    name: 'Spin',
+    category: 'feedback',
+    description: '加载指示器：inline / wrapper / fullscreen 三形态；delay 去抖 + minShowTime 最短显示（复用 @chenzy-design/core createSpinController）；role=status + aria-live=polite 公布加载，wrapper 内容 aria-busy；reduced-motion 下旋转退化为呼吸。spinning 受控不回写，显隐变化仅触发 onShow/onHide。',
+    exports: ['Spin'],
+    props: [
+        { name: 'spinning', type: 'boolean', default: 'true', desc: '是否加载态；受控不回写' },
+        { name: 'size', type: "'small'|'default'|'large'", default: "'default'" },
+        { name: 'tip', type: 'string', default: "''", desc: '指示器下方文案，空则不渲染' },
+        { name: 'delay', type: 'number', default: '0', desc: '延迟显示 ms（去抖）' },
+        { name: 'minShowTime', type: 'number', default: '0', desc: '最短显示 ms' },
+        { name: 'fullscreen', type: 'boolean', default: 'false', desc: '全屏固定覆盖' },
+        { name: 'wrapperClassName', type: 'string', default: "''", desc: 'wrapper 外层自定义类' },
+        { name: 'ariaLabel', type: 'string', default: "'加载中'", desc: '无 tip 时的可访问名' },
+        {
+            name: 'indicator',
+            type: 'Snippet<[{ size }]>',
+            default: 'undefined',
+            desc: '自定义指示器',
+        },
+        {
+            name: 'children',
+            type: 'Snippet',
+            default: 'undefined',
+            desc: '提供则进入 wrapper 模式包裹内容',
+        },
+        { name: 'onShow', type: '() => void', default: 'undefined', desc: 'effective false→true' },
+        { name: 'onHide', type: '() => void', default: 'undefined', desc: 'effective true→false' },
+    ],
+    events: [
+        { name: 'onShow', desc: '有效显示态由 false 变 true（delay 后真正显示时触发）' },
+        { name: 'onHide', desc: '有效显示态由 true 变 false（满足 minShowTime 后隐藏时触发）' },
+    ],
+    slots: [
+        { name: 'children', desc: 'wrapper 模式下被遮罩包裹的内容' },
+        { name: 'indicator', desc: '自定义指示器（接收 { size }）' },
+    ],
+    a11y: {
+        hasRole: true,
+        focusable: false,
+        note: 'role=status + aria-live=polite（隐式 aria-atomic）公布加载；无 tip 时 aria-label，有 tip 时 tip 文本即可访问名；wrapper 内容 effectiveSpinning 时 aria-busy=true 并 inert 阻断交互；内置 SVG aria-hidden；不捕获焦点；reduced-motion 旋转退化为 opacity 呼吸。',
+    },
+    tokens: [
+        '--cd-spin-color',
+        '--cd-spin-track-color',
+        '--cd-spin-size-small',
+        '--cd-spin-size-default',
+        '--cd-spin-size-large',
+        '--cd-spin-duration',
+        '--cd-spin-duration-reduced',
+        '--cd-spin-tip-gap',
+        '--cd-spin-tip-color',
+        '--cd-spin-mask-bg',
+        '--cd-spin-z',
+        '--cd-spin-z-fullscreen',
+        '--cd-spin-fade-duration',
+    ],
+    responsive: false,
+    examples: [
+        { title: 'inline', code: '<Spin spinning />' },
+        {
+            title: 'wrapper 包裹卡片',
+            code: '<Spin spinning={loading}>\n  <Card>内容</Card>\n</Spin>',
+        },
+        { title: '带 tip', code: '<Spin spinning tip="加载中…" />' },
+    ],
+};

package/dist/steps/Steps.a11y.test.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=Steps.a11y.test.d.ts.map

package/dist/steps/Steps.a11y.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Steps.a11y.test.d.ts","sourceRoot":"","sources":["../../src/steps/Steps.a11y.test.ts"],"names":[],"mappings":""}

package/dist/steps/Steps.a11y.test.js

@@ -0,0 +1,35 @@
+// Steps a11y：<ol> 步骤列表；当前步 aria-current=step；nav 型外包 nav[aria-label]。
+//  - 视觉隐藏的状态文本（.cd-sr-only）令颜色非唯一信息载体（WCAG 1.4.1）。
+// jsdom 只断言静态 ARIA + axe（roving 键盘留给真实浏览器）。
+import { describe, it, expect } from 'vitest';
+import { renderWithLocale, expectNoAxeViolations } from '../test-utils/a11y.js';
+import Steps from './Steps.svelte';
+const steps = [
+    { title: 'Start' },
+    { title: 'Verify' },
+    { title: 'Done' },
+];
+describe('Steps a11y', () => {
+    it('默认渲染：ol 列表 + 当前步 aria-current=step，无 axe violations', async () => {
+        const { container } = renderWithLocale(Steps, {
+            props: { steps, current: 1 },
+        });
+        expect(container.querySelector('ol.cd-steps')).not.toBeNull();
+        expect(container.querySelectorAll('li.cd-steps__item')).toHaveLength(3);
+        const current = container.querySelector('[aria-current="step"]');
+        expect(current).not.toBeNull();
+        // 每步含视觉隐藏状态文本（颜色非唯一信息载体）。
+        expect(container.querySelectorAll('.cd-sr-only').length).toBeGreaterThan(0);
+        await expectNoAxeViolations(container);
+    });
+    it('nav 型：外包 nav[aria-label]，步骤为可点 button，无 axe violations', async () => {
+        const { container } = renderWithLocale(Steps, {
+            props: { steps, type: 'nav', current: 0 },
+        });
+        const nav = container.querySelector('nav');
+        expect(nav).not.toBeNull();
+        expect(nav?.getAttribute('aria-label')).toBeTruthy();
+        expect(container.querySelectorAll('button.cd-steps__head')).toHaveLength(3);
+        await expectNoAxeViolations(container);
+    });
+});

package/dist/steps/Steps.kbd.test.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=Steps.kbd.test.d.ts.map

package/dist/steps/Steps.kbd.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Steps.kbd.test.d.ts","sourceRoot":"","sources":["../../src/steps/Steps.kbd.test.ts"],"names":[],"mappings":""}