@oxyhq/bloom 0.89.0 → 1.0.0

package/src/__tests__/Field.test.tsx

@@ -1,55 +0,0 @@
-import React from 'react';
-import { Text } from 'react-native';
-import { render } from '@testing-library/react-native';
-
-import { BloomThemeProvider } from '../theme/BloomThemeProvider';
-import { Field } from '../field';
-
-function renderWithTheme(ui: React.ReactElement) {
-  return render(
-    <BloomThemeProvider mode="light" colorPreset="teal">
-      {ui}
-    </BloomThemeProvider>,
-  );
-}
-
-describe('Field', () => {
-  it('renders label, children and description', () => {
-    const { getByText } = renderWithTheme(
-      <Field label="Username" description="Pick something unique">
-        <Text>input</Text>
-      </Field>,
-    );
-    expect(getByText('Username')).toBeTruthy();
-    expect(getByText('input')).toBeTruthy();
-    expect(getByText('Pick something unique')).toBeTruthy();
-  });
-
-  it('renders the error and hides the description when invalid', () => {
-    const { getByText, queryByText } = renderWithTheme(
-      <Field label="Email" description="We never share it" error="Invalid email">
-        <Text>input</Text>
-      </Field>,
-    );
-    expect(getByText('Invalid email')).toBeTruthy();
-    expect(queryByText('We never share it')).toBeNull();
-  });
-
-  it('marks the error message with the alert role', () => {
-    const { getByText } = renderWithTheme(
-      <Field label="Email" error="Required">
-        <Text>input</Text>
-      </Field>,
-    );
-    expect(getByText('Required').props.accessibilityRole).toBe('alert');
-  });
-
-  it('renders the required marker through the label', () => {
-    const { getByLabelText } = renderWithTheme(
-      <Field label="Email" required>
-        <Text>input</Text>
-      </Field>,
-    );
-    expect(getByLabelText('required')).toBeTruthy();
-  });
-});

package/src/__tests__/FontLoader.native.test.tsx

@@ -1,146 +0,0 @@
-import React from 'react';
-import { Text, type TextProps } from 'react-native';
-import { render } from '@testing-library/react-native';
-
-type UseFontsResult = readonly [boolean, Error | null];
-
-let mockUseFontsResult: UseFontsResult = [true, null];
-
-jest.mock('expo-font', () => ({
-  useFonts: () => mockUseFontsResult,
-}));
-
-import { FontLoader } from '../fonts/FontLoader.native';
-
-function setUseFontsResult(result: UseFontsResult): void {
-  mockUseFontsResult = result;
-}
-
-type TextWithDefaults = typeof Text & {
-  defaultProps?: Partial<TextProps>;
-};
-
-function resetTextDefaults(): void {
-  (Text as TextWithDefaults).defaultProps = undefined;
-}
-
-describe('FontLoader (native)', () => {
-  beforeEach(() => {
-    resetTextDefaults();
-  });
-
-  afterEach(() => {
-    setUseFontsResult([true, null]);
-    resetTextDefaults();
-  });
-
-  it('renders children when fonts are loaded and enabled', () => {
-    setUseFontsResult([true, null]);
-    const { getByText, queryByText } = render(
-      <FontLoader enabled fallback={<Text>fallback</Text>}>
-        <Text>content</Text>
-      </FontLoader>,
-    );
-    expect(getByText('content')).toBeTruthy();
-    expect(queryByText('fallback')).toBeNull();
-  });
-
-  it('renders fallback while fonts are loading and enabled', () => {
-    setUseFontsResult([false, null]);
-    const { getByText, queryByText } = render(
-      <FontLoader enabled fallback={<Text>fallback</Text>}>
-        <Text>content</Text>
-      </FontLoader>,
-    );
-    expect(getByText('fallback')).toBeTruthy();
-    expect(queryByText('content')).toBeNull();
-  });
-
-  it('renders null fallback by default while loading', () => {
-    setUseFontsResult([false, null]);
-    const { queryByText } = render(
-      <FontLoader enabled>
-        <Text>content</Text>
-      </FontLoader>,
-    );
-    expect(queryByText('content')).toBeNull();
-  });
-
-  it('renders children when disabled, regardless of load state', () => {
-    setUseFontsResult([false, null]);
-    const { getByText } = render(
-      <FontLoader enabled={false} fallback={<Text>fallback</Text>}>
-        <Text>content</Text>
-      </FontLoader>,
-    );
-    expect(getByText('content')).toBeTruthy();
-  });
-
-  it('renders children when disabled even with a loaded result', () => {
-    setUseFontsResult([true, null]);
-    const { getByText } = render(
-      <FontLoader enabled={false}>
-        <Text>content</Text>
-      </FontLoader>,
-    );
-    expect(getByText('content')).toBeTruthy();
-  });
-
-  it('prepends BlomusModernus to Text.defaultProps.style once fonts are loaded', () => {
-    setUseFontsResult([true, null]);
-    render(
-      <FontLoader enabled>
-        <Text>content</Text>
-      </FontLoader>,
-    );
-    const defaults = (Text as TextWithDefaults).defaultProps;
-    expect(defaults?.style).toEqual({ fontFamily: 'BlomusModernus' });
-  });
-
-  it('does not touch Text.defaultProps until fonts are loaded', () => {
-    setUseFontsResult([false, null]);
-    render(
-      <FontLoader enabled>
-        <Text>content</Text>
-      </FontLoader>,
-    );
-    expect((Text as TextWithDefaults).defaultProps?.style).toBeUndefined();
-  });
-
-  it('preserves a pre-existing default style by appending it after BlomusModernus', () => {
-    const preExisting = { color: '#abcdef' } as const;
-    (Text as TextWithDefaults).defaultProps = { style: preExisting };
-    setUseFontsResult([true, null]);
-    render(
-      <FontLoader enabled>
-        <Text>content</Text>
-      </FontLoader>,
-    );
-    const style = (Text as TextWithDefaults).defaultProps?.style;
-    expect(Array.isArray(style)).toBe(true);
-    if (Array.isArray(style)) {
-      expect(style[0]).toEqual({ fontFamily: 'BlomusModernus' });
-      expect(style[1]).toBe(preExisting);
-    }
-  });
-
-  it('is idempotent across multiple FontLoader mounts', () => {
-    setUseFontsResult([true, null]);
-    const first = render(
-      <FontLoader enabled>
-        <Text>first</Text>
-      </FontLoader>,
-    );
-    first.unmount();
-    const second = render(
-      <FontLoader enabled>
-        <Text>second</Text>
-      </FontLoader>,
-    );
-    second.unmount();
-    const style = (Text as TextWithDefaults).defaultProps?.style;
-    // Should still be the single, plain BlomusModernus object — not nested
-    // arrays or duplicated entries.
-    expect(style).toEqual({ fontFamily: 'BlomusModernus' });
-  });
-});

package/src/__tests__/FrostedIconButton.test.tsx

@@ -1,137 +0,0 @@
-import React from 'react';
-import { Text, type ViewStyle } from 'react-native';
-import { render, fireEvent } from '@testing-library/react-native';
-
-import { BloomThemeProvider } from '../theme/BloomThemeProvider';
-import { FrostedIconButton } from '../frosted-icon-button';
-import { buildTheme } from '../theme/build-theme';
-import { parseRgb } from '../theme/color-utils';
-import { resolveFrostedPalette, resolveFrostedSize } from '../frosted-icon-button/shared';
-
-function renderWithTheme(ui: React.ReactElement) {
-  return render(
-    <BloomThemeProvider mode="dark" colorPreset="blue">
-      {ui}
-    </BloomThemeProvider>,
-  );
-}
-
-function findGeometry(style: unknown): ViewStyle | undefined {
-  const arr = Array.isArray(style) ? style : [style];
-  return arr.find(
-    (s): s is ViewStyle => typeof s === 'object' && s !== null && 'width' in s,
-  );
-}
-
-/** A minimal icon element that accepts a `fill` prop (like a Bloom icon). */
-function MockIcon({ fill, testID }: { fill?: string; testID?: string }) {
-  return React.createElement('MockIcon', { fill, testID });
-}
-
-describe('FrostedIconButton (native)', () => {
-  it('renders its icon content', () => {
-    const { getByText } = renderWithTheme(
-      <FrostedIconButton accessibilityLabel="Back" icon={<Text>x</Text>} />,
-    );
-    expect(getByText('x')).toBeTruthy();
-  });
-
-  it('calls onPress when pressed', () => {
-    const onPress = jest.fn();
-    const { getByTestId } = renderWithTheme(
-      <FrostedIconButton testID="btn" accessibilityLabel="Back" onPress={onPress} icon={<Text>x</Text>} />,
-    );
-    fireEvent.press(getByTestId('btn'));
-    expect(onPress).toHaveBeenCalledTimes(1);
-  });
-
-  it('marks the disabled a11y state and drops the press handler', () => {
-    const onPress = jest.fn();
-    const { getByTestId } = renderWithTheme(
-      <FrostedIconButton testID="btn" disabled accessibilityLabel="Back" onPress={onPress} icon={<Text>x</Text>} />,
-    );
-    const btn = getByTestId('btn');
-    expect(btn.props.accessibilityState).toEqual({ disabled: true, selected: false });
-    expect(btn.props.onPress).toBeUndefined();
-  });
-
-  it('reports the selected a11y state when active', () => {
-    const { getByTestId } = renderWithTheme(
-      <FrostedIconButton testID="btn" active accessibilityLabel="Mute" icon={<Text>x</Text>} />,
-    );
-    expect(getByTestId('btn').props.accessibilityState).toEqual({ disabled: false, selected: true });
-  });
-
-  it('injects the theme icon color as a fallback fill on a bare icon', () => {
-    const { getByTestId } = renderWithTheme(
-      <FrostedIconButton accessibilityLabel="Back" icon={<MockIcon testID="ic" />} />,
-    );
-    // Frosted (rest) icon color === foreground token.
-    expect(getByTestId('ic').props.fill).toMatch(/^rgb/);
-  });
-
-  it('never overrides an explicit fill on the icon', () => {
-    const { getByTestId } = renderWithTheme(
-      <FrostedIconButton accessibilityLabel="Back" icon={<MockIcon testID="ic" fill="rgb(1, 2, 3)" />} />,
-    );
-    expect(getByTestId('ic').props.fill).toBe('rgb(1, 2, 3)');
-  });
-
-  it('resolves preset sizes to concrete geometry (md=36, sm=32)', () => {
-    const { getByTestId, rerender } = renderWithTheme(
-      <FrostedIconButton testID="btn" size="md" accessibilityLabel="Back" icon={<Text>x</Text>} />,
-    );
-    expect(findGeometry(getByTestId('btn').props.style)?.width).toBe(36);
-    rerender(
-      <BloomThemeProvider mode="dark" colorPreset="blue">
-        <FrostedIconButton testID="btn" size="sm" accessibilityLabel="Back" icon={<Text>x</Text>} />
-      </BloomThemeProvider>,
-    );
-    expect(findGeometry(getByTestId('btn').props.style)?.width).toBe(32);
-  });
-
-  it('accepts children as an icon alias', () => {
-    const { getByText } = renderWithTheme(
-      <FrostedIconButton accessibilityLabel="Back">
-        <Text>★</Text>
-      </FrostedIconButton>,
-    );
-    expect(getByText('★')).toBeTruthy();
-  });
-});
-
-// Browser-independent proof of the visual contract: the frosted surface is a
-// LIGHT translucent tint on a dark theme (never a dark card fill), so it reads on
-// a solid dark page. Pure token math — no renderer / platform involved.
-describe('FrostedIconButton palette math', () => {
-  it('dark surface is a light low-opacity tint that composites lighter than the page', () => {
-    const theme = buildTheme('blue', 'dark');
-    const palette = resolveFrostedPalette(theme.colors, true);
-
-    const base = parseRgb(palette.surface);
-    expect(base).not.toBeNull();
-    if (!base) throw new Error('unreachable');
-    // Light base (foreground), not a dark card.
-    expect(base.r).toBeGreaterThanOrEqual(200);
-
-    // Low opacity → composited over rgb(11,11,15) it is clearly lighter.
-    expect(palette.surface).toMatch(/, 0\.14\)$/);
-    const a = 0.14;
-    const page = 11;
-    const composite = Math.round(page * (1 - a) + base.r * a);
-    expect(composite - page).toBeGreaterThanOrEqual(15);
-  });
-
-  it('active surface is the opaque primary token (solid on-state, no alpha)', () => {
-    const theme = buildTheme('blue', 'dark');
-    const palette = resolveFrostedPalette(theme.colors, true);
-    expect(palette.activeSurface).toBe(theme.colors.primary);
-    expect(palette.activeSurface).toMatch(/^rgb\(/);
-  });
-
-  it('scales a numeric size to a concrete diameter + icon box', () => {
-    const geo = resolveFrostedSize(44);
-    expect(geo.diameter).toBe(44);
-    expect(geo.iconBox).toBe(Math.round(44 * 0.56));
-  });
-});

package/src/__tests__/FrostedIconButton.web.test.tsx

@@ -1,246 +0,0 @@
-/**
- * @jest-environment jsdom
- */
-
-import React from 'react';
-import { act } from 'react';
-import { createRoot, type Root } from 'react-dom/client';
-import { getByRole, fireEvent } from '@testing-library/dom';
-import { renderToStaticMarkup } from 'react-dom/server';
-import '@testing-library/jest-dom';
-
-import { BloomThemeProvider } from '../theme/BloomThemeProvider';
-import { FrostedIconButton } from '../frosted-icon-button/FrostedIconButton.web';
-import { parseRgb } from '../theme/color-utils';
-
-(globalThis as { IS_REACT_ACT_ENVIRONMENT?: boolean }).IS_REACT_ACT_ENVIRONMENT = true;
-
-let container: HTMLDivElement;
-let root: Root;
-
-function mount(ui: React.ReactElement, mode: 'light' | 'dark' = 'dark'): HTMLElement {
-  act(() => {
-    root.render(
-      <BloomThemeProvider mode={mode} colorPreset="blue">
-        {ui}
-      </BloomThemeProvider>,
-    );
-  });
-  return container;
-}
-
-beforeEach(() => {
-  container = document.createElement('div');
-  document.body.appendChild(container);
-  root = createRoot(container);
-});
-
-afterEach(() => {
-  act(() => root.unmount());
-  container.remove();
-});
-
-// Mention's measured dark page background — the "invisible circle" bug composited
-// a near-black `card` fill onto this and vanished. The frosted chip must read.
-const PAGE_DARK = { r: 11, g: 11, b: 15 };
-
-/** Composite an `rgba(...)` surface over an opaque background (source-over). */
-function compositeOver(surface: string, bg: { r: number; g: number; b: number }) {
-  const base = parseRgb(surface);
-  const m = /rgba?\(([^)]+)\)/i.exec(surface);
-  const rawAlpha = m?.[1]?.split(',')[3];
-  const a = rawAlpha === undefined ? 1 : Number(rawAlpha);
-  if (!base) throw new Error(`not an rgba string: ${surface}`);
-  return {
-    r: Math.round(bg.r * (1 - a) + base.r * a),
-    g: Math.round(bg.g * (1 - a) + base.g * a),
-    b: Math.round(bg.b * (1 - a) + base.b * a),
-  };
-}
-
-describe('FrostedIconButton.web', () => {
-  it('renders a real <button> with the accessible label', () => {
-    const c = mount(<FrostedIconButton accessibilityLabel="Back" icon={<span>x</span>} />);
-    const btn = getByRole(c, 'button', { name: 'Back' });
-    expect(btn.tagName).toBe('BUTTON');
-    expect(btn).toHaveClass('bloom-frosted-icon-btn');
-  });
-
-  it('self-injects its interaction stylesheet once', () => {
-    mount(<FrostedIconButton accessibilityLabel="Back" icon={<span>x</span>} />);
-    mount(<FrostedIconButton accessibilityLabel="Fwd" icon={<span>y</span>} />);
-    expect(document.querySelectorAll('#bloom-frosted-icon-button-web-css')).toHaveLength(1);
-  });
-
-  // THE bug this component exists to prevent: on a dark SOLID page, a `card`-fill
-  // circle composited to near-black and vanished. Prove the frosted surface is a
-  // LIGHT tint that reads as a distinct, clearly-lighter circle on rgb(11,11,15).
-  describe('reads on a solid dark background (nothing behind it)', () => {
-    it('uses a low-opacity LIGHT tint distinguishable from the page', () => {
-      const c = mount(<FrostedIconButton accessibilityLabel="Back" icon={<span>x</span>} />);
-      const btn = getByRole(c, 'button');
-      const surface = btn.style.backgroundColor;
-
-      // Not the page color, and a genuine translucent (rgba) surface.
-      expect(surface).not.toBe('rgb(11, 11, 15)');
-      expect(surface).toMatch(/^rgba\(/);
-
-      // The tint's BASE color is light (each channel high) — a light frost, not a
-      // dark card fill.
-      const base = parseRgb(surface);
-      if (!base) throw new Error('unreachable');
-      expect(base.r).toBeGreaterThanOrEqual(200);
-      expect(base.g).toBeGreaterThanOrEqual(200);
-      expect(base.b).toBeGreaterThanOrEqual(200);
-
-      // Composited over the page it is clearly LIGHTER than rgb(11,11,15).
-      const composite = compositeOver(surface, PAGE_DARK);
-      expect(composite.r - PAGE_DARK.r).toBeGreaterThanOrEqual(15);
-      expect(composite.g - PAGE_DARK.g).toBeGreaterThanOrEqual(15);
-      expect(composite.b - PAGE_DARK.b).toBeGreaterThanOrEqual(15);
-    });
-
-    it('renders a hairline ring and a shadow that survive dark mode', () => {
-      const c = mount(<FrostedIconButton accessibilityLabel="Back" icon={<span>x</span>} />);
-      const btn = getByRole(c, 'button');
-      // Ring: a translucent border COLOR is present inline (per-instance token).
-      expect(btn.style.borderColor).toMatch(/^rgba\(/);
-      // The hairline border-style/width live in the self-injected stylesheet.
-      const css = document.getElementById('bloom-frosted-icon-button-web-css')?.textContent ?? '';
-      expect(css).toMatch(/border-style:\s*solid/);
-      expect(css).toMatch(/border-width:\s*1px/);
-      // Shadow is NOT killed in dark mode.
-      expect(btn.style.boxShadow).not.toBe('');
-      expect(btn.style.boxShadow).toMatch(/rgba?\(/);
-    });
-
-    // jsdom's CSS engine drops `backdrop-filter`, so assert it via SSR style
-    // serialization — which emits EVERY style key exactly as the browser receives
-    // it (react-dom writes the same inline style on a real DOM <button>).
-    it('emits a real CSS backdrop-filter blur when frosted (and drops it when active)', () => {
-      const frosted = renderToStaticMarkup(
-        <BloomThemeProvider mode="dark" colorPreset="blue">
-          <FrostedIconButton accessibilityLabel="Back" icon={<span>x</span>} />
-        </BloomThemeProvider>,
-      );
-      expect(frosted).toMatch(/backdrop-filter:\s*blur\(\d+px\)/);
-
-      const active = renderToStaticMarkup(
-        <BloomThemeProvider mode="dark" colorPreset="blue">
-          <FrostedIconButton accessibilityLabel="Back" active icon={<span>x</span>} />
-        </BloomThemeProvider>,
-      );
-      // Active is solid: no blur (either absent or explicitly "none").
-      expect(active).not.toMatch(/backdrop-filter:\s*blur\(/);
-    });
-  });
-
-  describe('active (solid "on") state', () => {
-    it('fills opaque (no rgba alpha), drops the blur, and sets aria-pressed', () => {
-      const c = mount(<FrostedIconButton accessibilityLabel="Mute" active icon={<span>x</span>} />);
-      const btn = getByRole(c, 'button');
-      // Opaque solid fill — an `rgb(...)` (not translucent `rgba`).
-      expect(btn.style.backgroundColor).toMatch(/^rgb\(/);
-      expect(btn.style.backgroundColor).not.toMatch(/^rgba\(/);
-      expect(btn).toHaveAttribute('aria-pressed', 'true');
-      expect(btn).toHaveAttribute('data-active', 'true');
-      const bf = btn.style.getPropertyValue('backdrop-filter');
-      expect(bf === '' || bf === 'none').toBe(true);
-    });
-
-    it('reports aria-pressed=false when not active', () => {
-      const c = mount(<FrostedIconButton accessibilityLabel="Mute" icon={<span>x</span>} />);
-      expect(getByRole(c, 'button')).toHaveAttribute('aria-pressed', 'false');
-    });
-  });
-
-  describe('icon color', () => {
-    it('injects the theme icon color as a fallback fill on a bare icon', () => {
-      const c = mount(
-        <FrostedIconButton accessibilityLabel="Back" icon={<svg data-testid="ic" />} />,
-      );
-      const icon = c.querySelector('[data-testid="ic"]');
-      expect(icon?.getAttribute('fill')).toMatch(/^rgb/);
-    });
-
-    it('never overrides an explicit fill on the icon', () => {
-      const c = mount(
-        <FrostedIconButton
-          accessibilityLabel="Back"
-          icon={<svg data-testid="ic" fill="rgb(1, 2, 3)" />}
-        />,
-      );
-      expect(c.querySelector('[data-testid="ic"]')?.getAttribute('fill')).toBe('rgb(1, 2, 3)');
-    });
-  });
-
-  describe('light theme', () => {
-    it('uses a subtle DARK tint (base near-black) distinguishable from a white page', () => {
-      const c = mount(
-        <FrostedIconButton accessibilityLabel="Back" icon={<span>x</span>} />,
-        'light',
-      );
-      const surface = getByRole(c, 'button').style.backgroundColor;
-      expect(surface).toMatch(/^rgba\(/);
-      const base = parseRgb(surface);
-      if (!base) throw new Error('unreachable');
-      expect(base.r).toBeLessThanOrEqual(60);
-      expect(base.g).toBeLessThanOrEqual(60);
-      expect(base.b).toBeLessThanOrEqual(60);
-    });
-  });
-
-  describe('behavior', () => {
-    it('fires both onClick and onPress on click', () => {
-      const onClick = jest.fn();
-      const onPress = jest.fn();
-      const c = mount(
-        <FrostedIconButton
-          accessibilityLabel="Back"
-          onClick={onClick}
-          onPress={onPress}
-          icon={<span>x</span>}
-        />,
-      );
-      act(() => {
-        fireEvent.click(getByRole(c, 'button'));
-      });
-      expect(onClick).toHaveBeenCalledTimes(1);
-      expect(onPress).toHaveBeenCalledTimes(1);
-    });
-
-    it('does not fire handlers when disabled', () => {
-      const onPress = jest.fn();
-      const c = mount(
-        <FrostedIconButton accessibilityLabel="Back" disabled onPress={onPress} icon={<span>x</span>} />,
-      );
-      const btn = getByRole(c, 'button');
-      expect(btn).toBeDisabled();
-      act(() => {
-        fireEvent.click(btn);
-      });
-      expect(onPress).not.toHaveBeenCalled();
-    });
-
-    it('applies preset sizes (md = 36px, sm = 32px)', () => {
-      const c = mount(<FrostedIconButton accessibilityLabel="Back" size="md" icon={<span>x</span>} />);
-      expect(getByRole(c, 'button').style.width).toBe('36px');
-      const c2 = mount(<FrostedIconButton accessibilityLabel="Back" size="sm" icon={<span>x</span>} />);
-      expect(getByRole(c2, 'button').style.width).toBe('32px');
-    });
-
-    it('does not crash on an array-form style prop (StyleProp flattening)', () => {
-      const showBorder = false;
-      const c = mount(
-        <FrostedIconButton
-          accessibilityLabel="Back"
-          icon={<span>x</span>}
-          style={[{ marginTop: 8 }, showBorder && { borderColor: 'rgb(9, 9, 9)' }]}
-        />,
-      );
-      const btn = getByRole(c, 'button');
-      expect(btn.style.marginTop).toBe('8px');
-      expect(btn.getAttribute('style') ?? '').not.toMatch(/(^|;)\s*0\s*:/);
-    });
-  });
-});

package/src/__tests__/InputGroup.test.tsx

@@ -1,47 +0,0 @@
-import React from 'react';
-import { Text } from 'react-native';
-import { render } from '@testing-library/react-native';
-
-import { BloomThemeProvider } from '../theme/BloomThemeProvider';
-import { InputGroup } from '../input-group';
-
-function renderWithTheme(ui: React.ReactElement) {
-  return render(
-    <BloomThemeProvider mode="light" colorPreset="teal">
-      {ui}
-    </BloomThemeProvider>,
-  );
-}
-
-describe('InputGroup', () => {
-  it('renders addons and the input', () => {
-    const { getByText } = renderWithTheme(
-      <InputGroup>
-        <InputGroup.Addon>https://</InputGroup.Addon>
-        <Text>field</Text>
-        <InputGroup.Addon divider>
-          <Text>Go</Text>
-        </InputGroup.Addon>
-      </InputGroup>,
-    );
-    expect(getByText('https://')).toBeTruthy();
-    expect(getByText('field')).toBeTruthy();
-    expect(getByText('Go')).toBeTruthy();
-  });
-
-  it('exposes Addon as a static member', () => {
-    expect(InputGroup.Addon).toBeTruthy();
-  });
-
-  it('marks disabled state for accessibility', () => {
-    const { getByTestId } = renderWithTheme(
-      <InputGroup disabled testID="group">
-        <Text>field</Text>
-      </InputGroup>,
-    );
-    // `aria-disabled`, not `accessibilityState`: the group is a `View`, so
-    // react-native-web has no `disabled` prop to derive the attribute from and
-    // never reads `accessibilityState`. React Native folds this back into it.
-    expect(getByTestId('group').props['aria-disabled']).toBe(true);
-  });
-});