@pyreon/styler 0.24.4 → 0.24.6

package/src/__tests__/inject-rules.browser.test.ts

@@ -1,40 +0,0 @@
-import { describe, expect, it } from 'vitest'
-import { createSheet } from '../sheet'
-
-// Layer 1 of the P0 rocketstyle-collapse slice: the styler injects
-// pre-resolved rule text (captured at build time by the collapse
-// resolver) into the LIVE sheet, idempotently, WITHOUT re-hashing — the
-// class names are already baked into the rules AND into the collapsed
-// _tpl() HTML, so a re-hash would break the contract.
-
-describe('StyleSheet.injectRules (real browser)', () => {
-  it('inserts pre-resolved rules into the live sheet verbatim (no re-hash)', () => {
-    const s = createSheet()
-    const before = s.ruleCountForTest()
-    s.injectRules(['.pyr-abc123{color:rgb(1,2,3)}'], 'k1')
-    expect(s.ruleCountForTest()).toBe(before + 1)
-    // Class name is preserved exactly — proves no re-hash happened.
-    const probe = document.createElement('div')
-    probe.className = 'pyr-abc123'
-    document.body.appendChild(probe)
-    expect(getComputedStyle(probe).color).toBe('rgb(1, 2, 3)')
-    probe.remove()
-  })
-
-  it('is idempotent by key — re-injecting the same bundle adds nothing', () => {
-    const s = createSheet()
-    s.injectRules(['.pyr-dup{color:red}', '.pyr-dup2{color:blue}'], 'dup')
-    const afterFirst = s.ruleCountForTest()
-    s.injectRules(['.pyr-dup{color:red}', '.pyr-dup2{color:blue}'], 'dup')
-    s.injectRules(['.pyr-dup{color:red}', '.pyr-dup2{color:blue}'], 'dup')
-    expect(s.ruleCountForTest()).toBe(afterFirst)
-  })
-
-  it('distinct keys inject independently', () => {
-    const s = createSheet()
-    const before = s.ruleCountForTest()
-    s.injectRules(['.pyr-x{margin:1px}'], 'kx')
-    s.injectRules(['.pyr-y{margin:2px}'], 'ky')
-    expect(s.ruleCountForTest()).toBe(before + 2)
-  })
-})

package/src/__tests__/insertion-effect.test.ts

@@ -1,119 +0,0 @@
-import type { VNode } from '@pyreon/core'
-import { describe, expect, it } from 'vitest'
-import { styled } from '../styled'
-
-describe('style injection (className generation)', () => {
-  describe('dynamic styled components', () => {
-    it('generates a proper className for dynamic CSS', () => {
-      const Comp = styled('div')`
-        color: ${(props: any) => props.$color};
-      `
-
-      const vnode = Comp({ $color: 'red' }) as VNode
-
-      // Class should be present and properly generated
-      expect(vnode.props.class).toMatch(/^pyr-[0-9a-z]+$/)
-    })
-
-    it('works with multiple dynamic components', () => {
-      const Comp1 = styled('div')`
-        color: ${(p: any) => p.$c};
-      `
-      const Comp2 = styled('span')`
-        font-size: ${(p: any) => p.$s};
-      `
-
-      const vnode1 = Comp1({ $c: 'red' }) as VNode
-      const vnode2 = Comp2({ $s: '16px' }) as VNode
-
-      expect(vnode1.props.class).toMatch(/^pyr-/)
-      expect(vnode2.props.class).toMatch(/^pyr-/)
-      expect(vnode1.props.class).not.toBe(vnode2.props.class)
-    })
-
-    it('handles different prop values producing different classNames', () => {
-      const Comp = styled('div')`
-        color: ${(p: any) => p.$color};
-      `
-
-      const colors = ['blue', 'green', 'yellow', 'purple', 'orange']
-      const classNames = new Set<string>()
-
-      for (const color of colors) {
-        const vnode = Comp({ $color: color }) as VNode
-        expect(vnode.props.class).toMatch(/^pyr-/)
-        classNames.add(vnode.props.class as string)
-      }
-
-      // Different colors should produce different classNames
-      expect(classNames.size).toBe(colors.length)
-    })
-
-    it('same dynamic CSS produces same className', () => {
-      const Comp = styled('div')`
-        color: ${(p: any) => p.$color};
-      `
-
-      const vnode1 = Comp({ $color: 'red' }) as VNode
-      const cls1 = vnode1.props.class as string
-
-      const _vnode2 = Comp({ $color: 'blue' }) as VNode
-
-      const vnode3 = Comp({ $color: 'red' }) as VNode // back to red
-      const cls3 = vnode3.props.class as string
-
-      // Same resolved CSS -> same className
-      expect(cls1).toBe(cls3)
-    })
-  })
-
-  describe('static styled components', () => {
-    it('static components compute class at creation time', () => {
-      // Static components compute class at creation time
-      const Comp = styled('div')`
-        display: flex;
-        color: red;
-      `
-
-      const vnode = Comp({}) as VNode
-
-      expect(vnode.props.class).toMatch(/^pyr-[0-9a-z]+$/)
-    })
-
-    it('static className is stable across calls', () => {
-      const Comp = styled('div')`
-        display: flex;
-      `
-
-      const vnode1 = Comp({}) as VNode
-      const cls1 = vnode1.props.class as string
-
-      const _vnode2 = Comp({}) as VNode
-      const vnode3 = Comp({}) as VNode
-      const cls3 = vnode3.props.class as string
-
-      expect(cls1).toBe(cls3)
-    })
-  })
-
-  describe('theme-dependent components', () => {
-    it('produces different className for different resolved CSS', () => {
-      // In Pyreon, theme is accessed via useTheme() inside the component.
-      // Without ThemeProvider context, theme is {} (default).
-      // We test via direct prop-based dynamic interpolation instead.
-      const Comp = styled('div')`
-        background: ${(p: any) => p.$bg};
-      `
-
-      const vnode1 = Comp({ $bg: 'white' }) as VNode
-      const cls1 = vnode1.props.class as string
-
-      const vnode2 = Comp({ $bg: 'black' }) as VNode
-      const cls2 = vnode2.props.class as string
-
-      expect(cls1).not.toBe(cls2)
-      expect(cls1).toMatch(/^pyr-/)
-      expect(cls2).toMatch(/^pyr-/)
-    })
-  })
-})

package/src/__tests__/integration-dom.test.ts

@@ -1,58 +0,0 @@
-import type { VNode } from '@pyreon/core'
-import { afterEach, describe, expect, it } from 'vitest'
-import { sheet } from '../sheet'
-import { styled } from '../styled'
-
-// ─── Integration tests ───────────────────────────────────────────────────────
-
-describe('Styler integration — styled + sheet', () => {
-  afterEach(() => {
-    sheet.reset()
-  })
-
-  it('styled("div") with CSS applies a pyr- class to element', () => {
-    const Box = styled('div')`
-      color: red;
-      display: flex;
-    `
-    const vnode = Box({}) as VNode
-    expect(vnode.type).toBe('div')
-    expect(vnode.props.class).toMatch(/^pyr-[0-9a-z]+$/)
-  })
-
-  it('dynamic styled with props-based interpolation produces different classes', () => {
-    const Box = styled('div')`
-      color: ${((props: Record<string, unknown>) => (props.color as string) || 'black') as any};
-    `
-    const vnode1 = Box({ color: 'red' }) as VNode
-    const vnode2 = Box({ color: 'blue' }) as VNode
-    // Dynamic interpolations produce different CSS, different hashes
-    expect(vnode1.props.class).toMatch(/^pyr-/)
-    expect(vnode2.props.class).toMatch(/^pyr-/)
-    expect(vnode1.props.class).not.toBe(vnode2.props.class)
-  })
-
-  it('multiple styled components get different classes from same sheet', () => {
-    const Red = styled('span')`
-      color: red;
-    `
-    const Blue = styled('span')`
-      color: blue;
-    `
-    const vnodeRed = Red({}) as VNode
-    const vnodeBlue = Blue({}) as VNode
-    expect(vnodeRed.props.class).toMatch(/^pyr-/)
-    expect(vnodeBlue.props.class).toMatch(/^pyr-/)
-    expect(vnodeRed.props.class).not.toBe(vnodeBlue.props.class)
-  })
-
-  it('@layer declarations exist in stylesheet (pyreon layer)', () => {
-    // The sheet mounts on construction and injects @layer pyreon;
-    // Verify the sheet has been mounted and can insert rules
-    const className = sheet.insert('display: grid;')
-    expect(className).toMatch(/^pyr-/)
-    // Same CSS returns same class (dedup works)
-    const className2 = sheet.insert('display: grid;')
-    expect(className2).toBe(className)
-  })
-})

package/src/__tests__/integration.test.ts

@@ -1,179 +0,0 @@
-import type { VNode } from '@pyreon/core'
-import { describe, expect, it } from 'vitest'
-import { css } from '../css'
-import { styled } from '../styled'
-
-describe('integration', () => {
-  describe('nested css results', () => {
-    it('resolves nested css tagged templates', () => {
-      const flexCSS = css`
-        display: flex;
-      `
-      const Comp = styled('div')`
-        ${flexCSS}
-        color: red;
-      `
-      const vnode = Comp({}) as VNode
-      expect(vnode.props.class).toMatch(/^pyr-/)
-    })
-
-    it('resolves conditional css (logical AND pattern)', () => {
-      const isWeb = true
-      const Comp = styled('div')`
-        ${isWeb &&
-        css`
-          box-sizing: border-box;
-        `};
-        display: flex;
-      `
-      const vnode = Comp({}) as VNode
-      expect(vnode.props.class).toMatch(/^pyr-/)
-    })
-
-    it('handles false conditional css', () => {
-      const isWeb = false
-      const Comp = styled('div')`
-        ${isWeb &&
-        css`
-          box-sizing: border-box;
-        `};
-        display: flex;
-      `
-      const vnode = Comp({}) as VNode
-      expect(vnode.props.class).toMatch(/^pyr-/)
-    })
-  })
-
-  describe('array interpolations (makeItResponsive pattern)', () => {
-    it('resolves array of css results (simulating breakpoints)', () => {
-      // Simulates what makeItResponsive returns: array of css results per breakpoint
-      const breakpointStyles = [
-        css`
-          color: red;
-        `,
-        css`
-          @media (min-width: 48em) {
-            color: blue;
-          }
-        `,
-        css`
-          @media (min-width: 62em) {
-            color: green;
-          }
-        `,
-      ]
-
-      const Comp = styled('div')`
-        display: flex;
-        ${breakpointStyles};
-      `
-      const vnode = Comp({}) as VNode
-      expect(vnode.props.class).toMatch(/^pyr-/)
-    })
-
-    it('resolves function returning array (makeItResponsive full pattern)', () => {
-      // makeItResponsive returns a function (props) => CSSResult[]
-      const responsiveFn = (props: any) => {
-        const theme = props.$element || {}
-        return [
-          css`
-            color: ${theme.color || 'black'};
-          `,
-          theme.breakpoint
-            ? css`
-                @media (min-width: 48em) {
-                  color: ${theme.breakpoint};
-                }
-              `
-            : '',
-        ]
-      }
-
-      const Comp = styled('div')`
-        display: flex;
-        ${responsiveFn};
-      `
-      const vnode = Comp({ $element: { color: 'red', breakpoint: 'blue' } }) as VNode
-      expect(vnode.props.class).toMatch(/^pyr-/)
-    })
-  })
-
-  describe('createMediaQueries pattern', () => {
-    it('css called as function (css(...args)) wrapping in @media', () => {
-      // Simulates createMediaQueries: builds functions that call css(...args)
-      const createMedia = (breakpoint: number, rootSize: number) => {
-        const emSize = breakpoint / rootSize
-        return (...args: any[]) =>
-          css`
-            @media only screen and (min-width: ${emSize}em) {
-              ${css(...(args as [TemplateStringsArray, ...any[]]))};
-            }
-          `
-      }
-
-      const md = createMedia(768, 16)
-      const result = md`
-        color: blue;
-      `
-
-      // Wrap in a styled component
-      const Comp = styled('div')`
-        color: red;
-        ${result};
-      `
-      const vnode = Comp({}) as VNode
-      expect(vnode.props.class).toMatch(/^pyr-/)
-    })
-
-    it('zero-breakpoint passthrough (css(...args) without @media)', () => {
-      // Breakpoint 0 means no @media wrapper
-      const passthrough = (...args: any[]) => css(...(args as [TemplateStringsArray, ...any[]]))
-
-      const result = passthrough`color: red;`
-
-      const Comp = styled('div')`
-        ${result};
-      `
-      const vnode = Comp({}) as VNode
-      expect(vnode.props.class).toMatch(/^pyr-/)
-    })
-  })
-
-  describe('complex styled patterns', () => {
-    it('function interpolation with prop-based conditional', () => {
-      const Comp = styled('div')`
-        display: flex;
-        ${({ $contentType }: any) => $contentType === 'content' && 'flex: 1;'};
-      `
-      const vnode = Comp({ $contentType: 'content' }) as VNode
-      expect(vnode.props.class).toMatch(/^pyr-/)
-    })
-
-    it('platform-specific CSS (compile-time constant)', () => {
-      const __WEB__ = true
-      const platformCSS = __WEB__ ? 'box-sizing: border-box;' : ''
-
-      const Comp = styled('div')`
-        ${platformCSS};
-        display: flex;
-      `
-      const vnode = Comp({}) as VNode
-      expect(vnode.props.class).toMatch(/^pyr-/)
-    })
-
-    it('multiple function interpolations', () => {
-      const Comp = styled('div')`
-        color: ${(p: any) => p.$color || 'black'};
-        font-size: ${(p: any) => p.$size || '16px'};
-      `
-      const vnode = Comp({ $color: 'red', $size: '20px' }) as VNode
-      expect(vnode.props.class).toMatch(/^pyr-/)
-    })
-
-    it('empty template produces no className', () => {
-      const Comp = styled('div')``
-      const vnode = Comp({}) as VNode
-      expect(vnode.props.class).toBeFalsy()
-    })
-  })
-})

package/src/__tests__/keyframes.test.ts

@@ -1,68 +0,0 @@
-import { afterEach, describe, expect, it } from 'vitest'
-import { keyframes } from '../keyframes'
-import { sheet } from '../sheet'
-
-describe('keyframes', () => {
-  afterEach(() => {
-    sheet.reset()
-  })
-
-  it('returns a KeyframesResult with a name property', () => {
-    const fadeIn = keyframes`
-      from { opacity: 0; }
-      to { opacity: 1; }
-    `
-    expect(fadeIn.name).toMatch(/^pyr-kf-/)
-  })
-
-  it('returns pyr-kf- prefix', () => {
-    const fadeIn = keyframes`
-      from { opacity: 0; }
-      to { opacity: 1; }
-    `
-    expect(fadeIn.name).toMatch(/^pyr-kf-[0-9a-z]+$/)
-  })
-
-  it('is deterministic — same input produces same name', () => {
-    const a = keyframes`from { opacity: 0; } to { opacity: 1; }`
-    const b = keyframes`from { opacity: 0; } to { opacity: 1; }`
-    expect(a.name).toBe(b.name)
-  })
-
-  it('different input produces different names', () => {
-    const fadeIn = keyframes`from { opacity: 0; } to { opacity: 1; }`
-    const slideIn = keyframes`from { transform: translateX(-100%); } to { transform: translateX(0); }`
-    expect(fadeIn.name).not.toBe(slideIn.name)
-  })
-
-  it('supports interpolation values', () => {
-    const from = 0
-    const to = 1
-    const anim = keyframes`
-      from { opacity: ${from}; }
-      to { opacity: ${to}; }
-    `
-    expect(anim.name).toMatch(/^pyr-kf-/)
-  })
-
-  it('toString returns the animation name', () => {
-    const fadeIn = keyframes`from { opacity: 0; } to { opacity: 1; }`
-    expect(fadeIn.toString()).toBe(fadeIn.name)
-  })
-
-  it('can be used in template literals for animation property', () => {
-    const fadeIn = keyframes`from { opacity: 0; } to { opacity: 1; }`
-    const animationValue = `${fadeIn} 0.3s ease-in`
-    expect(animationValue).toContain(fadeIn.name)
-    expect(animationValue).toContain('0.3s ease-in')
-  })
-
-  it('handles complex keyframe definitions', () => {
-    const pulse = keyframes`
-      0% { transform: scale(1); }
-      50% { transform: scale(1.1); }
-      100% { transform: scale(1); }
-    `
-    expect(pulse.name).toMatch(/^pyr-kf-/)
-  })
-})

package/src/__tests__/memory-growth.test.ts

@@ -1,220 +0,0 @@
-import { afterEach, beforeEach, describe, expect, it } from 'vitest'
-import { createSheet } from '../sheet'
-
-describe('memory growth', () => {
-  describe('bounded cache prevents unbounded growth (DOM mode)', () => {
-    it('cache stays bounded with maxCacheSize', () => {
-      const maxSize = 50
-      const s = createSheet({ maxCacheSize: maxSize })
-
-      for (let i = 0; i < maxSize * 3; i++) {
-        s.insert(`property-${i}: value-${i};`)
-      }
-
-      expect(s.cacheSize).toBeLessThanOrEqual(maxSize * 1.5)
-    })
-
-    it('cache eviction preserves recent entries', () => {
-      const maxSize = 20
-      const s = createSheet({ maxCacheSize: maxSize })
-
-      for (let i = 0; i < maxSize; i++) {
-        s.insert(`old-prop-${i}: old-val-${i};`)
-      }
-
-      const recentClasses: string[] = []
-      for (let i = 0; i < 5; i++) {
-        recentClasses.push(s.insert(`new-prop-${i}: new-val-${i};`))
-      }
-
-      for (let i = 0; i < 5; i++) {
-        const cls = s.insert(`new-prop-${i}: new-val-${i};`)
-        expect(cls).toBe(recentClasses[i])
-      }
-    })
-
-    it('handles rapid insertions without memory issues', () => {
-      const s = createSheet({ maxCacheSize: 100 })
-      const iterations = 1000
-
-      for (let i = 0; i < iterations; i++) {
-        s.insert(`rapid-${i}: value;`)
-      }
-
-      expect(s.cacheSize).toBeLessThan(iterations)
-      expect(s.cacheSize).toBeGreaterThan(0)
-    })
-  })
-
-  describe('default cache (large limit, DOM mode)', () => {
-    beforeEach(() => {
-      document.querySelectorAll('style[data-pyreon-styler]').forEach((el) => {
-        el.remove()
-      })
-    })
-
-    it('default cache handles many unique rules', () => {
-      const s = createSheet()
-
-      for (let i = 0; i < 500; i++) {
-        s.insert(`default-prop-${i}: value-${i};`)
-      }
-
-      expect(s.cacheSize).toBe(500)
-    })
-
-    it('deduplication prevents growth from repeated rules', () => {
-      const s = createSheet()
-
-      for (let cycle = 0; cycle < 100; cycle++) {
-        for (let i = 0; i < 10; i++) {
-          s.insert(`repeated-${i}: value;`)
-        }
-      }
-
-      expect(s.cacheSize).toBe(10)
-    })
-  })
-
-  // Regression: `evictIfNeeded()` historically trimmed ONLY `this.cache`.
-  // `insertCache` (keyed by full CSS text — the large keys) and the live
-  // `<style>` tag's `cssRules` were never evicted, so `maxCacheSize`
-  // bounded the smallest of the three layers while the two memory-heavy
-  // ones grew for the process lifetime. These tests inspect the two
-  // previously-unbounded layers directly. Bisect-verified.
-  describe('lockstep eviction bounds insertCache + DOM cssRules', () => {
-    beforeEach(() => {
-      document.querySelectorAll('style[data-pyreon-styler]').forEach((el) => {
-        el.remove()
-      })
-    })
-
-    it('insertCache stays bounded under N >> maxCacheSize unique inserts', () => {
-      const maxSize = 50
-      const s = createSheet({ maxCacheSize: maxSize })
-      const N = maxSize * 6
-
-      for (let i = 0; i < N; i++) s.insert(`prop-${i}: value-${i};`)
-
-      const ic = (s as unknown as { insertCache: Map<string, string> }).insertCache
-      // Pre-fix: ic.size === N (insertCache never evicted). Post-fix it
-      // tracks `cache`, which trims oldest 10% on each overflow.
-      expect(s.cacheSize).toBeLessThanOrEqual(maxSize * 1.5)
-      expect(ic.size).toBeLessThanOrEqual(maxSize * 1.5)
-      expect(ic.size).toBeLessThan(N)
-    })
-
-    it('live DOM cssRules count does not grow unbounded', () => {
-      const maxSize = 30
-      const s = createSheet({ maxCacheSize: maxSize })
-
-      for (let i = 0; i < maxSize; i++) s.insert(`a-${i}: ${i};`)
-      const el = document.querySelector('style[data-pyreon-styler]') as HTMLStyleElement
-      expect(el?.sheet).toBeTruthy()
-
-      for (let i = 0; i < maxSize * 5; i++) s.insert(`b-${i}: ${i};`)
-
-      const after = el.sheet!.cssRules.length
-      // Pre-fix: `after` ≈ maxSize*6 (+@layer decl) — every unique insert
-      // appended a rule, none ever deleted. Post-fix: eviction calls
-      // deleteRule in lockstep, so the live rule count stays within
-      // ~1.5× maxSize no matter how many uniques flowed through.
-      expect(after).toBeLessThanOrEqual(maxSize * 1.5 + 2)
-    })
-
-    it('dedup still works after eviction cycles', () => {
-      const maxSize = 20
-      const s = createSheet({ maxCacheSize: maxSize })
-
-      const recent: string[] = []
-      for (let i = 0; i < 5; i++) recent.push(s.insert(`keep-${i}: v;`))
-      // Overflow to force eviction of older entries (not `recent`).
-      for (let i = 0; i < maxSize * 3; i++) s.insert(`churn-${i}: v;`)
-      // Recent entries: re-inserting yields the SAME deterministic
-      // className and exactly one live DOM rule each.
-      for (let i = 0; i < 5; i++) expect(s.insert(`keep-${i}: v;`)).toBe(recent[i])
-
-      const el = document.querySelector('style[data-pyreon-styler]') as HTMLStyleElement
-      let keepRules = 0
-      for (let i = 0; i < el.sheet!.cssRules.length; i++) {
-        const r = el.sheet!.cssRules[i]
-        if (r && r.cssText.includes('keep-0')) keepRules++
-      }
-      expect(keepRules).toBe(1)
-    })
-  })
-
-  describe('SSR mode memory', () => {
-    let originalDocument: typeof document
-
-    beforeEach(() => {
-      originalDocument = globalThis.document
-      // @ts-expect-error - intentionally deleting for SSR simulation
-      delete globalThis.document
-    })
-
-    afterEach(() => {
-      globalThis.document = originalDocument
-    })
-
-    it('reset prevents SSR buffer accumulation across requests', () => {
-      const s = createSheet()
-
-      for (let i = 0; i < 100; i++) {
-        s.insert(`req1-prop-${i}: value;`)
-      }
-      expect(s.getStyles().length).toBeGreaterThan(0)
-
-      s.reset()
-      expect(s.getStyles()).toBe('')
-
-      s.insert('req2-single: value;')
-      expect(s.getStyles()).not.toContain('req1-prop')
-    })
-
-    it('keyframes cache does not grow unboundedly', () => {
-      const s = createSheet({ maxCacheSize: 20 })
-
-      for (let i = 0; i < 50; i++) {
-        s.insertKeyframes(`anim-${i}`, `from { opacity: ${i}; } to { opacity: 1; }`)
-      }
-
-      expect(s.cacheSize).toBeLessThanOrEqual(50)
-    })
-
-    it('global rules cache does not grow unboundedly', () => {
-      const s = createSheet({ maxCacheSize: 20 })
-
-      for (let i = 0; i < 50; i++) {
-        s.insertGlobal(`body { prop${i}: val${i}; }`)
-      }
-
-      expect(s.cacheSize).toBeLessThanOrEqual(50)
-    })
-
-    it('SSR buffer grows with unique rules (expected behavior)', () => {
-      const s = createSheet()
-      const ruleCount = 100
-
-      for (let i = 0; i < ruleCount; i++) {
-        s.insert(`ssr-prop-${i}: value;`)
-      }
-
-      const styles = s.getStyles()
-      for (let i = 0; i < ruleCount; i++) {
-        expect(styles).toContain(`ssr-prop-${i}`)
-      }
-    })
-
-    it('SSR buffer does not duplicate identical rules', () => {
-      const s = createSheet()
-
-      for (let cycle = 0; cycle < 10; cycle++) {
-        s.insert('color: red;')
-      }
-
-      const matches = s.getStyles().match(/color: red;/g)
-      expect(matches).toHaveLength(1)
-    })
-  })
-})

package/src/__tests__/native-marker.test.ts

@@ -1,9 +0,0 @@
-import { isNativeCompat } from '@pyreon/core'
-import { describe, expect, it } from 'vitest'
-import { ThemeProvider } from '../ThemeProvider'
-
-describe('native-compat marker — @pyreon/styler', () => {
-  it('ThemeProvider is marked native', () => {
-    expect(isNativeCompat(ThemeProvider)).toBe(true)
-  })
-})