@teseor/css 1.14.1 → 1.14.3

package/dist/index.css

@@ -11,7 +11,7 @@
 @layer tokens{:root{color-scheme:light dark;--ui-color-text: light-dark(var(--ui-color-neutral-900), var(--ui-color-neutral-100));--ui-color-text-muted: light-dark(var(--ui-color-neutral-500), var(--ui-color-neutral-400));--ui-color-text-inverse: light-dark(var(--ui-color-neutral-50), var(--ui-color-neutral-900));--ui-color-bg: light-dark(var(--ui-color-neutral-50), var(--ui-color-neutral-900));--ui-color-bg-subtle: light-dark(var(--ui-color-neutral-100), var(--ui-color-neutral-800));--ui-color-bg-muted: light-dark(var(--ui-color-neutral-200), var(--ui-color-neutral-700));--ui-color-border: light-dark(var(--ui-color-neutral-200), var(--ui-color-neutral-700));--ui-color-border-strong: light-dark(var(--ui-color-neutral-300), var(--ui-color-neutral-600));--ui-color-interactive: var(--ui-color-primary);--ui-color-interactive-hover: var(--ui-color-primary-dark);--ui-color-focus: var(--ui-color-primary-light);--ui-opacity-disabled: 0.5;--ui-opacity-loading: 0.7;--ui-overlay-bg: rgb(0 0 0 / 0.5);--ui-overlay-bg-light: rgb(255 255 255 / 0.7);--ui-overlay-bg-blur: rgb(0 0 0 / 0.3);--ui-overlay-bg-subtle: rgb(0 0 0 / 0.1)}}
 @layer themes{[data-theme=light]{color-scheme:light}[data-theme=dark]{color-scheme:dark}@media(forced-colors: active){:root{--ui-color-focus: Highlight}}@media(prefers-contrast: more){:root{--ui-color-border: light-dark(var(--ui-color-neutral-400), var(--ui-color-neutral-400));--ui-color-border-strong: light-dark(var(--ui-color-neutral-600), var(--ui-color-neutral-300));--ui-color-text-muted: light-dark(var(--ui-color-neutral-600), var(--ui-color-neutral-300));--ui-color-bg-subtle: light-dark(var(--ui-color-neutral-200), var(--ui-color-neutral-700))}}@media(prefers-contrast: less){:root{--ui-color-border: var(--ui-color-neutral-150);--ui-color-border-strong: var(--ui-color-neutral-200)}}}
 @layer tokens{:root{--ui-spacing-xs: var(--ui-space-1);--ui-spacing-sm: var(--ui-space-2);--ui-spacing-md: var(--ui-space-4);--ui-spacing-lg: var(--ui-space-6);--ui-spacing-xl: var(--ui-space-8);--ui-spacing-gutter: var(--ui-space-4);--ui-spacing-section: var(--ui-space-8)}}
-:root{--ui-input-height: var(--ui-row-2);--ui-input-padding-x: var(--ui-space-2);--ui-input-padding-y: var(--ui-space-1);--ui-input-radius: var(--ui-radius-md);--ui-input-border-width: var(--ui-border-width-sm);--ui-input-bg: var(--ui-color-bg);--ui-input-border: var(--ui-color-border);--ui-input-border-focus: var(--ui-color-interactive);--ui-input-text: var(--ui-color-text);--ui-input-placeholder: var(--ui-color-text-muted)}
+@layer tokens{:root{--ui-input-height: var(--ui-row-2);--ui-input-padding-x: var(--ui-space-2);--ui-input-padding-y: var(--ui-space-1);--ui-input-radius: var(--ui-radius-md);--ui-input-border-width: var(--ui-border-width-sm);--ui-input-bg: var(--ui-color-bg);--ui-input-border: var(--ui-color-border);--ui-input-border-focus: var(--ui-color-interactive);--ui-input-text: var(--ui-color-text);--ui-input-placeholder: var(--ui-color-text-muted)}}
 @layer reset{*,*::before,*::after{box-sizing:border-box;margin:0}}
 @layer base{.ui-root{font-family:var(--ui-font-sans, system-ui, -apple-system, blinkmacsystemfont, Segoe UI, roboto, Helvetica Neue, arial, sans-serif);font-size:var(--ui-font-size-md, 1rem);line-height:var(--ui-leading-md, calc(0.5rem * 3));color:var(--ui-color-text, hsl(220, 10%, 10%));background:var(--ui-color-bg, hsl(220, 10%, 98%))}}
 @layer base{h1{margin-block-end:var(--ui-space-4);font-size:var(--ui-heading-1-size);font-weight:var(--ui-heading-1-weight);line-height:var(--ui-heading-1-line-height);letter-spacing:var(--ui-heading-1-tracking)}h2{margin-block-end:var(--ui-space-3);font-size:var(--ui-heading-2-size);font-weight:var(--ui-heading-2-weight);line-height:var(--ui-heading-2-line-height);letter-spacing:var(--ui-heading-2-tracking)}h3{margin-block-end:var(--ui-space-2);font-size:var(--ui-heading-3-size);font-weight:var(--ui-heading-3-weight);line-height:var(--ui-heading-3-line-height);letter-spacing:var(--ui-heading-3-tracking)}h4{margin-block-end:var(--ui-space-2);font-size:var(--ui-heading-4-size);font-weight:var(--ui-heading-4-weight);line-height:var(--ui-heading-4-line-height);letter-spacing:var(--ui-heading-4-tracking)}h5,h6{margin-block-end:var(--ui-space-1);font-size:var(--ui-heading-5-size);font-weight:var(--ui-heading-5-weight);line-height:var(--ui-heading-5-line-height);letter-spacing:var(--ui-heading-5-tracking)}p{margin-block-end:var(--ui-space-2);font-size:var(--ui-body-size);line-height:var(--ui-body-line-height);letter-spacing:var(--ui-body-tracking)}p:last-child{margin-block-end:0}strong,b{font-weight:var(--ui-weight-bold);line-height:0}small{font-size:var(--ui-caption-size);line-height:0}code{padding:0 var(--ui-space-1);font-family:var(--ui-font-mono);font-size:var(--ui-body-sm-size);line-height:0;vertical-align:baseline;background:var(--ui-color-bg-muted);border-radius:var(--ui-radius-sm)}pre{padding:var(--ui-space-2);margin-block-end:var(--ui-space-2);overflow-x:auto;font-family:var(--ui-font-mono);font-size:var(--ui-body-sm-size);line-height:var(--ui-body-sm-line-height);background:var(--ui-color-bg-muted);border-radius:var(--ui-radius-md)}pre code{padding:0;background:none}a{text-decoration:underline;color:var(--ui-color-primary);transition:color var(--ui-duration-fast) var(--ui-ease-default)}a:hover{color:var(--ui-color-primary-hover)}a:visited{color:var(--ui-color-primary)}@media(width < 45.625rem){h1{font-size:var(--ui-font-size-2xl);line-height:var(--ui-leading-2xl)}h2{font-size:var(--ui-font-size-xl);line-height:var(--ui-leading-xl)}h3{font-size:var(--ui-font-size-lg);line-height:var(--ui-leading-sm)}h4{font-size:1.125rem;line-height:var(--ui-leading-sm)}}@media(width > 67.5rem){h1{font-size:calc(var(--ui-unit)*6);line-height:calc(var(--ui-unit)*7)}h2{font-size:var(--ui-font-size-4xl);line-height:var(--ui-leading-4xl)}}}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@teseor/css",
-  "version": "1.14.1",
+  "version": "1.14.3",
   "description": "CSS library - reset, primitives, components, utilities",
   "license": "MIT",
   "author": "letanure",

package/src/base/index.scss

@@ -1,2 +1,2 @@
-@forward "./root/root";
+@forward "./root";
 @forward "./typography/typography";

package/src/base/root.docs.json

@@ -0,0 +1,35 @@
+{
+  "id": "root",
+  "type": "token",
+  "title": "Root",
+  "description": "Base styles applied to the .root class: font family, size, line-height, color, and background",
+  "skipValidation": true,
+  "sections": [
+    {
+      "title": "Usage",
+      "description": "Add the .ui-root class to the html or body element to establish baseline typography and color.",
+      "examples": [
+        {
+          "title": "Basic setup",
+          "items": [
+            {
+              "tag": "div",
+              "class": "ui-root",
+              "children": [
+                {
+                  "tag": "p",
+                  "text": "Text inherits font-family, size, line-height, and color from .ui-root"
+                }
+              ]
+            }
+          ],
+          "code": "<html class=\"ui-root\">\n  <body>\n    <!-- All children inherit base styles -->\n  </body>\n</html>"
+        },
+        {
+          "title": "Tokens applied",
+          "code": ".ui-root {\n  font-family: var(--ui-font-sans);\n  font-size: var(--ui-font-size-md);\n  line-height: var(--ui-leading-md);\n  color: var(--ui-color-text);\n  background: var(--ui-color-bg);\n}"
+        }
+      ]
+    }
+  ]
+}

package/src/base/{root/root.scss → root.scss}

@@ -1,4 +1,4 @@
-@use '../../config/tokens/variables' as t;
+@use '../config/tokens/variables' as t;
 
 @layer base {
   .root {

package/src/components/actions/button/button.visual.spec.ts

@@ -1,6 +1,10 @@
 import { resolve } from 'node:path';
 import { expect, test } from '@playwright/test';
-import { saveForLostPixel, setupVisualTestFromDocs, validateGridRhythm } from '../../../testing';
+import {
+  saveForLostPixel,
+  setupVisualTestFromDocs,
+  validateGridRhythm,
+} from '../../../../test-utils';
 
 const DOCS_PATH = resolve(__dirname, 'button.docs.json');
 

package/src/components/actions/button-group/button-group.visual.spec.ts

@@ -1,6 +1,10 @@
 import { resolve } from 'node:path';
 import { expect, test } from '@playwright/test';
-import { saveForLostPixel, setupVisualTestFromDocs, validateGridRhythm } from '../../../testing';
+import {
+  saveForLostPixel,
+  setupVisualTestFromDocs,
+  validateGridRhythm,
+} from '../../../../test-utils';
 
 const DOCS_PATH = resolve(__dirname, 'button-group.docs.json');
 

package/src/components/actions/close-button/close-button.visual.spec.ts

@@ -1,6 +1,10 @@
 import { resolve } from 'node:path';
 import { expect, test } from '@playwright/test';
-import { saveForLostPixel, setupVisualTestFromDocs, validateGridRhythm } from '../../../testing';
+import {
+  saveForLostPixel,
+  setupVisualTestFromDocs,
+  validateGridRhythm,
+} from '../../../../test-utils';
 
 const DOCS_PATH = resolve(__dirname, 'close-button.docs.json');
 

package/src/components/content/divider/divider.visual.spec.ts

@@ -1,6 +1,10 @@
 import { resolve } from 'node:path';
 import { expect, test } from '@playwright/test';
-import { saveForLostPixel, setupVisualTestFromDocs, validateGridRhythm } from '../../../testing';
+import {
+  saveForLostPixel,
+  setupVisualTestFromDocs,
+  validateGridRhythm,
+} from '../../../../test-utils';
 
 const DOCS_PATH = resolve(__dirname, 'divider.docs.json');
 

package/src/components/content/scroll-area/scroll-area.visual.spec.ts

@@ -1,6 +1,10 @@
 import { resolve } from 'node:path';
 import { expect, test } from '@playwright/test';
-import { saveForLostPixel, setupVisualTestFromDocs, validateGridRhythm } from '../../../testing';
+import {
+  saveForLostPixel,
+  setupVisualTestFromDocs,
+  validateGridRhythm,
+} from '../../../../test-utils';
 
 const DOCS_PATH = resolve(__dirname, 'scroll-area.docs.json');
 

package/src/components/content/spacer/spacer.visual.spec.ts

@@ -1,6 +1,6 @@
 import { resolve } from 'node:path';
 import { expect, test } from '@playwright/test';
-import { saveForLostPixel, setupVisualTestFromDocs } from '../../../testing';
+import { saveForLostPixel, setupVisualTestFromDocs } from '../../../../test-utils';
 
 const DOCS_PATH = resolve(__dirname, 'spacer.docs.json');
 

package/src/components/data-display/avatar/avatar.visual.spec.ts

@@ -1,6 +1,10 @@
 import { resolve } from 'node:path';
 import { expect, test } from '@playwright/test';
-import { saveForLostPixel, setupVisualTestFromDocs, validateGridRhythm } from '../../../testing';
+import {
+  saveForLostPixel,
+  setupVisualTestFromDocs,
+  validateGridRhythm,
+} from '../../../../test-utils';
 
 const DOCS_PATH = resolve(__dirname, 'avatar.docs.json');
 

package/src/components/data-display/badge/badge.visual.spec.ts

@@ -1,6 +1,10 @@
 import { resolve } from 'node:path';
 import { expect, test } from '@playwright/test';
-import { saveForLostPixel, setupVisualTestFromDocs, validateGridRhythm } from '../../../testing';
+import {
+  saveForLostPixel,
+  setupVisualTestFromDocs,
+  validateGridRhythm,
+} from '../../../../test-utils';
 
 const DOCS_PATH = resolve(__dirname, 'badge.docs.json');
 

package/src/components/data-display/card/card.visual.spec.ts

@@ -1,6 +1,10 @@
 import { resolve } from 'node:path';
 import { expect, test } from '@playwright/test';
-import { saveForLostPixel, setupVisualTestFromDocs, validateGridRhythm } from '../../../testing';
+import {
+  saveForLostPixel,
+  setupVisualTestFromDocs,
+  validateGridRhythm,
+} from '../../../../test-utils';
 
 const DOCS_PATH = resolve(__dirname, 'card.docs.json');
 

package/src/components/data-display/data-list/data-list.visual.spec.ts

@@ -1,6 +1,10 @@
 import { resolve } from 'node:path';
 import { expect, test } from '@playwright/test';
-import { saveForLostPixel, setupVisualTestFromDocs, validateGridRhythm } from '../../../testing';
+import {
+  saveForLostPixel,
+  setupVisualTestFromDocs,
+  validateGridRhythm,
+} from '../../../../test-utils';
 
 const DOCS_PATH = resolve(__dirname, 'data-list.docs.json');
 

package/src/components/data-display/icon/icon.visual.spec.ts

@@ -1,6 +1,10 @@
 import { resolve } from 'node:path';
 import { expect, test } from '@playwright/test';
-import { saveForLostPixel, setupVisualTestFromDocs, validateGridRhythm } from '../../../testing';
+import {
+  saveForLostPixel,
+  setupVisualTestFromDocs,
+  validateGridRhythm,
+} from '../../../../test-utils';
 
 const DOCS_PATH = resolve(__dirname, 'icon.docs.json');
 

package/src/components/data-display/image/image.visual.spec.ts

@@ -1,6 +1,10 @@
 import { resolve } from 'node:path';
 import { expect, test } from '@playwright/test';
-import { saveForLostPixel, setupVisualTestFromDocs, validateGridRhythm } from '../../../testing';
+import {
+  saveForLostPixel,
+  setupVisualTestFromDocs,
+  validateGridRhythm,
+} from '../../../../test-utils';
 
 const DOCS_PATH = resolve(__dirname, 'image.docs.json');
 

package/src/components/data-display/stat/stat.visual.spec.ts

@@ -1,6 +1,10 @@
 import { resolve } from 'node:path';
 import { expect, test } from '@playwright/test';
-import { saveForLostPixel, setupVisualTestFromDocs, validateGridRhythm } from '../../../testing';
+import {
+  saveForLostPixel,
+  setupVisualTestFromDocs,
+  validateGridRhythm,
+} from '../../../../test-utils';
 
 const DOCS_PATH = resolve(__dirname, 'stat.docs.json');
 

package/src/components/data-display/status/status.visual.spec.ts

@@ -1,6 +1,10 @@
 import { resolve } from 'node:path';
 import { expect, test } from '@playwright/test';
-import { saveForLostPixel, setupVisualTestFromDocs, validateGridRhythm } from '../../../testing';
+import {
+  saveForLostPixel,
+  setupVisualTestFromDocs,
+  validateGridRhythm,
+} from '../../../../test-utils';
 
 const DOCS_PATH = resolve(__dirname, 'status.docs.json');
 

package/src/components/data-display/table/table.visual.spec.ts

@@ -1,6 +1,10 @@
 import { resolve } from 'node:path';
 import { expect, test } from '@playwright/test';
-import { saveForLostPixel, setupVisualTestFromDocs, validateGridRhythm } from '../../../testing';
+import {
+  saveForLostPixel,
+  setupVisualTestFromDocs,
+  validateGridRhythm,
+} from '../../../../test-utils';
 
 const DOCS_PATH = resolve(__dirname, 'table.docs.json');
 

package/src/components/data-display/tag/tag.visual.spec.ts

@@ -1,6 +1,10 @@
 import { resolve } from 'node:path';
 import { expect, test } from '@playwright/test';
-import { saveForLostPixel, setupVisualTestFromDocs, validateGridRhythm } from '../../../testing';
+import {
+  saveForLostPixel,
+  setupVisualTestFromDocs,
+  validateGridRhythm,
+} from '../../../../test-utils';
 
 const DOCS_PATH = resolve(__dirname, 'tag.docs.json');
 

package/src/components/disclosure/accordion/accordion.visual.spec.ts

@@ -1,6 +1,10 @@
 import { resolve } from 'node:path';
 import { expect, test } from '@playwright/test';
-import { saveForLostPixel, setupVisualTestFromDocs, validateGridRhythm } from '../../../testing';
+import {
+  saveForLostPixel,
+  setupVisualTestFromDocs,
+  validateGridRhythm,
+} from '../../../../test-utils';
 
 const DOCS_PATH = resolve(__dirname, 'accordion.docs.json');
 

package/src/components/disclosure/disclosure/disclosure.visual.spec.ts

@@ -1,6 +1,10 @@
 import { resolve } from 'node:path';
 import { expect, test } from '@playwright/test';
-import { saveForLostPixel, setupVisualTestFromDocs, validateGridRhythm } from '../../../testing';
+import {
+  saveForLostPixel,
+  setupVisualTestFromDocs,
+  validateGridRhythm,
+} from '../../../../test-utils';
 
 const DOCS_PATH = resolve(__dirname, 'disclosure.docs.json');
 

package/src/components/feedback/alert/alert.visual.spec.ts

@@ -1,6 +1,10 @@
 import { resolve } from 'node:path';
 import { expect, test } from '@playwright/test';
-import { saveForLostPixel, setupVisualTestFromDocs, validateGridRhythm } from '../../../testing';
+import {
+  saveForLostPixel,
+  setupVisualTestFromDocs,
+  validateGridRhythm,
+} from '../../../../test-utils';
 
 const DOCS_PATH = resolve(__dirname, 'alert.docs.json');
 

package/src/components/feedback/progress/progress.visual.spec.ts

@@ -1,6 +1,10 @@
 import { resolve } from 'node:path';
 import { expect, test } from '@playwright/test';
-import { saveForLostPixel, setupVisualTestFromDocs, validateGridRhythm } from '../../../testing';
+import {
+  saveForLostPixel,
+  setupVisualTestFromDocs,
+  validateGridRhythm,
+} from '../../../../test-utils';
 
 const DOCS_PATH = resolve(__dirname, 'progress.docs.json');
 

package/src/components/feedback/progress-circle/progress-circle.visual.spec.ts

@@ -1,6 +1,10 @@
 import { resolve } from 'node:path';
 import { expect, test } from '@playwright/test';
-import { saveForLostPixel, setupVisualTestFromDocs, validateGridRhythm } from '../../../testing';
+import {
+  saveForLostPixel,
+  setupVisualTestFromDocs,
+  validateGridRhythm,
+} from '../../../../test-utils';
 
 const DOCS_PATH = resolve(__dirname, 'progress-circle.docs.json');
 

package/src/components/feedback/skeleton/skeleton.visual.spec.ts

@@ -1,6 +1,10 @@
 import { resolve } from 'node:path';
 import { expect, test } from '@playwright/test';
-import { saveForLostPixel, setupVisualTestFromDocs, validateGridRhythm } from '../../../testing';
+import {
+  saveForLostPixel,
+  setupVisualTestFromDocs,
+  validateGridRhythm,
+} from '../../../../test-utils';
 
 const DOCS_PATH = resolve(__dirname, 'skeleton.docs.json');
 

package/src/components/feedback/spinner/spinner.visual.spec.ts

@@ -1,6 +1,10 @@
 import { resolve } from 'node:path';
 import { expect, test } from '@playwright/test';
-import { saveForLostPixel, setupVisualTestFromDocs, validateGridRhythm } from '../../../testing';
+import {
+  saveForLostPixel,
+  setupVisualTestFromDocs,
+  validateGridRhythm,
+} from '../../../../test-utils';
 
 const DOCS_PATH = resolve(__dirname, 'spinner.docs.json');
 

package/src/components/feedback/toast/toast.visual.spec.ts

@@ -1,6 +1,10 @@
 import { resolve } from 'node:path';
 import { expect, test } from '@playwright/test';
-import { saveForLostPixel, setupVisualTestFromDocs, validateGridRhythm } from '../../../testing';
+import {
+  saveForLostPixel,
+  setupVisualTestFromDocs,
+  validateGridRhythm,
+} from '../../../../test-utils';
 
 const DOCS_PATH = resolve(__dirname, 'toast.docs.json');
 

package/src/components/forms/checkbox/checkbox.visual.spec.ts

@@ -1,6 +1,10 @@
 import { resolve } from 'node:path';
 import { expect, test } from '@playwright/test';
-import { saveForLostPixel, setupVisualTestFromDocs, validateGridRhythm } from '../../../testing';
+import {
+  saveForLostPixel,
+  setupVisualTestFromDocs,
+  validateGridRhythm,
+} from '../../../../test-utils';
 
 const DOCS_PATH = resolve(__dirname, 'checkbox.docs.json');
 

package/src/components/forms/checkbox-group/checkbox-group.visual.spec.ts

@@ -1,6 +1,10 @@
 import { resolve } from 'node:path';
 import { expect, test } from '@playwright/test';
-import { saveForLostPixel, setupVisualTestFromDocs, validateGridRhythm } from '../../../testing';
+import {
+  saveForLostPixel,
+  setupVisualTestFromDocs,
+  validateGridRhythm,
+} from '../../../../test-utils';
 
 const DOCS_PATH = resolve(__dirname, 'checkbox-group.docs.json');
 

package/src/components/forms/field/field.visual.spec.ts

@@ -1,6 +1,10 @@
 import { resolve } from 'node:path';
 import { expect, test } from '@playwright/test';
-import { saveForLostPixel, setupVisualTestFromDocs, validateGridRhythm } from '../../../testing';
+import {
+  saveForLostPixel,
+  setupVisualTestFromDocs,
+  validateGridRhythm,
+} from '../../../../test-utils';
 
 const DOCS_PATH = resolve(__dirname, 'field.docs.json');
 

package/src/components/forms/fieldset/fieldset.visual.spec.ts

@@ -1,6 +1,10 @@
 import { resolve } from 'node:path';
 import { expect, test } from '@playwright/test';
-import { saveForLostPixel, setupVisualTestFromDocs, validateGridRhythm } from '../../../testing';
+import {
+  saveForLostPixel,
+  setupVisualTestFromDocs,
+  validateGridRhythm,
+} from '../../../../test-utils';
 
 const DOCS_PATH = resolve(__dirname, 'fieldset.docs.json');
 

package/src/components/forms/form/form.visual.spec.ts

@@ -1,6 +1,10 @@
 import { resolve } from 'node:path';
 import { expect, test } from '@playwright/test';
-import { saveForLostPixel, setupVisualTestFromDocs, validateGridRhythm } from '../../../testing';
+import {
+  saveForLostPixel,
+  setupVisualTestFromDocs,
+  validateGridRhythm,
+} from '../../../../test-utils';
 
 const DOCS_PATH = resolve(__dirname, 'form.docs.json');
 

package/src/components/forms/form-error/form-error.visual.spec.ts

@@ -1,6 +1,10 @@
 import { resolve } from 'node:path';
 import { expect, test } from '@playwright/test';
-import { saveForLostPixel, setupVisualTestFromDocs, validateGridRhythm } from '../../../testing';
+import {
+  saveForLostPixel,
+  setupVisualTestFromDocs,
+  validateGridRhythm,
+} from '../../../../test-utils';
 
 const DOCS_PATH = resolve(__dirname, 'form-error.docs.json');
 

package/src/components/forms/form-helper/form-helper.visual.spec.ts

@@ -1,6 +1,10 @@
 import { resolve } from 'node:path';
 import { expect, test } from '@playwright/test';
-import { saveForLostPixel, setupVisualTestFromDocs, validateGridRhythm } from '../../../testing';
+import {
+  saveForLostPixel,
+  setupVisualTestFromDocs,
+  validateGridRhythm,
+} from '../../../../test-utils';
 
 const DOCS_PATH = resolve(__dirname, 'form-helper.docs.json');
 

package/src/components/forms/input/input.visual.spec.ts

@@ -1,6 +1,10 @@
 import { resolve } from 'node:path';
 import { expect, test } from '@playwright/test';
-import { saveForLostPixel, setupVisualTestFromDocs, validateGridRhythm } from '../../../testing';
+import {
+  saveForLostPixel,
+  setupVisualTestFromDocs,
+  validateGridRhythm,
+} from '../../../../test-utils';
 
 const DOCS_PATH = resolve(__dirname, 'input.docs.json');
 

package/src/components/forms/label/label.visual.spec.ts

@@ -1,6 +1,10 @@
 import { resolve } from 'node:path';
 import { expect, test } from '@playwright/test';
-import { saveForLostPixel, setupVisualTestFromDocs, validateGridRhythm } from '../../../testing';
+import {
+  saveForLostPixel,
+  setupVisualTestFromDocs,
+  validateGridRhythm,
+} from '../../../../test-utils';
 
 const DOCS_PATH = resolve(__dirname, 'label.docs.json');
 

package/src/components/forms/number-input/number-input.visual.spec.ts

@@ -1,6 +1,10 @@
 import { resolve } from 'node:path';
 import { expect, test } from '@playwright/test';
-import { saveForLostPixel, setupVisualTestFromDocs, validateGridRhythm } from '../../../testing';
+import {
+  saveForLostPixel,
+  setupVisualTestFromDocs,
+  validateGridRhythm,
+} from '../../../../test-utils';
 
 const DOCS_PATH = resolve(__dirname, 'number-input.docs.json');
 

package/src/components/forms/password-input/password-input.visual.spec.ts

@@ -1,6 +1,10 @@
 import { resolve } from 'node:path';
 import { expect, test } from '@playwright/test';
-import { saveForLostPixel, setupVisualTestFromDocs, validateGridRhythm } from '../../../testing';
+import {
+  saveForLostPixel,
+  setupVisualTestFromDocs,
+  validateGridRhythm,
+} from '../../../../test-utils';
 
 const DOCS_PATH = resolve(__dirname, 'password-input.docs.json');
 

package/src/components/forms/radio/radio.visual.spec.ts

@@ -1,6 +1,10 @@
 import { resolve } from 'node:path';
 import { expect, test } from '@playwright/test';
-import { saveForLostPixel, setupVisualTestFromDocs, validateGridRhythm } from '../../../testing';
+import {
+  saveForLostPixel,
+  setupVisualTestFromDocs,
+  validateGridRhythm,
+} from '../../../../test-utils';
 
 const DOCS_PATH = resolve(__dirname, 'radio.docs.json');
 

package/src/components/forms/radio-group/radio-group.visual.spec.ts

@@ -1,6 +1,10 @@
 import { resolve } from 'node:path';
 import { expect, test } from '@playwright/test';
-import { saveForLostPixel, setupVisualTestFromDocs, validateGridRhythm } from '../../../testing';
+import {
+  saveForLostPixel,
+  setupVisualTestFromDocs,
+  validateGridRhythm,
+} from '../../../../test-utils';
 
 const DOCS_PATH = resolve(__dirname, 'radio-group.docs.json');
 

package/src/components/forms/search-input/search-input.visual.spec.ts

@@ -1,6 +1,10 @@
 import { resolve } from 'node:path';
 import { expect, test } from '@playwright/test';
-import { saveForLostPixel, setupVisualTestFromDocs, validateGridRhythm } from '../../../testing';
+import {
+  saveForLostPixel,
+  setupVisualTestFromDocs,
+  validateGridRhythm,
+} from '../../../../test-utils';
 
 const DOCS_PATH = resolve(__dirname, 'search-input.docs.json');
 

package/src/components/forms/select/select.visual.spec.ts

@@ -1,6 +1,10 @@
 import { resolve } from 'node:path';
 import { expect, test } from '@playwright/test';
-import { saveForLostPixel, setupVisualTestFromDocs, validateGridRhythm } from '../../../testing';
+import {
+  saveForLostPixel,
+  setupVisualTestFromDocs,
+  validateGridRhythm,
+} from '../../../../test-utils';
 
 const DOCS_PATH = resolve(__dirname, 'select.docs.json');
 

package/src/components/forms/slider/slider.visual.spec.ts

@@ -1,6 +1,10 @@
 import { resolve } from 'node:path';
 import { expect, test } from '@playwright/test';
-import { saveForLostPixel, setupVisualTestFromDocs, validateGridRhythm } from '../../../testing';
+import {
+  saveForLostPixel,
+  setupVisualTestFromDocs,
+  validateGridRhythm,
+} from '../../../../test-utils';
 
 const DOCS_PATH = resolve(__dirname, 'slider.docs.json');
 

package/src/components/forms/textarea/textarea.visual.spec.ts

@@ -1,6 +1,10 @@
 import { resolve } from 'node:path';
 import { expect, test } from '@playwright/test';
-import { saveForLostPixel, setupVisualTestFromDocs, validateGridRhythm } from '../../../testing';
+import {
+  saveForLostPixel,
+  setupVisualTestFromDocs,
+  validateGridRhythm,
+} from '../../../../test-utils';
 
 const DOCS_PATH = resolve(__dirname, 'textarea.docs.json');
 

package/src/components/forms/toggle/toggle.visual.spec.ts

@@ -1,6 +1,10 @@
 import { resolve } from 'node:path';
 import { expect, test } from '@playwright/test';
-import { saveForLostPixel, setupVisualTestFromDocs, validateGridRhythm } from '../../../testing';
+import {
+  saveForLostPixel,
+  setupVisualTestFromDocs,
+  validateGridRhythm,
+} from '../../../../test-utils';
 
 const DOCS_PATH = resolve(__dirname, 'toggle.docs.json');
 

package/src/components/navigation/breadcrumb/breadcrumb.visual.spec.ts

@@ -1,6 +1,10 @@
 import { resolve } from 'node:path';
 import { expect, test } from '@playwright/test';
-import { saveForLostPixel, setupVisualTestFromDocs, validateGridRhythm } from '../../../testing';
+import {
+  saveForLostPixel,
+  setupVisualTestFromDocs,
+  validateGridRhythm,
+} from '../../../../test-utils';
 
 const DOCS_PATH = resolve(__dirname, 'breadcrumb.docs.json');