GitFOSS

declare module "styled-container-query" {
  import * as React from "react";
  import styledComponents from "styled-components";

  export type ContainerQueryRule = {
    minWidth?: string;
    maxWidth?: string;
    minHeight?: string;
    maxHeight?: string;
  };

  export type ContainerQueryRules = {
    [className: string]: ContainerQueryRule;
  };

  export function matchQueries(
    rules: ContainerQueryRules,
    size: { width?: number | null; height?: number | null },
  ): string[];

  export function withQueryContainer<P = any>(
    StyledComponent: React.ComponentType<P>,
    rules: ContainerQueryRules,
  ): React.ForwardRefExoticComponent<
    React.PropsWithoutRef<
      P & { children?: React.ReactNode; query?: ContainerQueryRules }
    > &
      React.RefAttributes<any>
  >;

  export function unitToPx(
    element: Element | null,
    value: string,
    prop: "width" | "height" | string,
  ): number;

  export interface StyledContainerQuery {
    <Props = any>(
      component: React.ComponentType<Props> | string,
    ): styledComponents.ThemedStyledFunction<any, any, {}, never>;

    a: any;
    abbr: any;
    address: any;
    area: any;
    article: any;
    aside: any;
    audio: any;
    b: any;
    base: any;
    bdi: any;
    bdo: any;
    big: any;
    blockquote: any;
    body: any;
    br: any;
    button: any;
    canvas: any;
    caption: any;
    cite: any;
    code: any;
    col: any;
    colgroup: any;
    data: any;
    datalist: any;
    dd: any;
    del: any;
    details: any;
    dfn: any;
    dialog: any;
    div: any;
    dl: any;
    dt: any;
    em: any;
    embed: any;
    fieldset: any;
    figcaption: any;
    figure: any;
    footer: any;
    form: any;
    h1: any;
    h2: any;
    h3: any;
    h4: any;
    h5: any;
    h6: any;
    head: any;
    header: any;
    hgroup: any;
    hr: any;
    html: any;
    i: any;
    iframe: any;
    img: any;
    input: any;
    ins: any;
    kbd: any;
    keygen: any;
    label: any;
    legend: any;
    li: any;
    link: any;
    main: any;
    map: any;
    mark: any;
    marquee: any;
    menu: any;
    menuitem: any;
    meta: any;
    meter: any;
    nav: any;
    noscript: any;
    object: any;
    ol: any;
    optgroup: any;
    option: any;
    output: any;
    p: any;
    param: any;
    picture: any;
    pre: any;
    progress: any;
    q: any;
    rp: any;
    rt: any;
    ruby: any;
    s: any;
    samp: any;
    script: any;
    section: any;
    select: any;
    small: any;
    source: any;
    span: any;
    strong: any;
    style: any;
    sub: any;
    summary: any;
    sup: any;
    table: any;
    tbody: any;
    td: any;
    textarea: any;
    tfoot: any;
    th: any;
    thead: any;
    time: any;
    title: any;
    tr: any;
    track: any;
    u: any;
    ul: any;
    var: any;
    video: any;
    wbr: any;
    circle: any;
    clipPath: any;
    defs: any;
    ellipse: any;
    foreignObject: any;
    g: any;
    image: any;
    line: any;
    linearGradient: any;
    marker: any;
    mask: any;
    path: any;
    pattern: any;
    polygon: any;
    polyline: any;
    radialGradient: any;
    rect: any;
    stop: any;
    svg: any;
    text: any;
    tspan: any;

    [element: string]: any;
  }

  const styledContainerQuery: StyledContainerQuery;
  export { styledContainerQuery as styledCQ };
  export default styledContainerQuery;
}