@n3e/styled 1.0.0

package/solid/cjs/index.d.ts

@@ -0,0 +1,498 @@
+import { Component } from 'solid-js';
+import * as CSS from 'csstype';
+
+declare const PSEUDO_ELEMENTS: readonly ["after", "backdrop", "before", "cue", "cueRegion", "firstLetter", "firstLine", "fileSelectorButton", "marker", "placeholder", "selection"];
+declare const PSEUDO_ELEMENT_FUNCTIONS: readonly ["part", "slotted"];
+declare const PSEUDO_CLASSES: readonly ["active", "anyLink", "autofill", "checked", "default", "defined", "disabled", "empty", "enabled", "first", "firstChild", "firstOfType", "fullscreen", "focus", "focusVisible", "focusWithin", "hover", "indeterminate", "inRange", "invalid", "lastChild", "lastOfType", "left", "link", "modal", "onlyChild", "onlyOfType", "optional", "outOfRange", "pictureInPicture", "placeholderShown", "paused", "playing", "readOnly", "readWrite", "required", "right", "root", "scope", "target", "valid", "visited"];
+declare const PCF_STRING: readonly ["host", "lang"];
+declare const PCF_STRING_ARRAY: readonly ["is", "not", "where"];
+declare const PCF_NUMBER_OR_STRING: readonly ["nthChild", "nthLastChild", "nthLastOfType", "nthOfType"];
+
+type CSSAttributes = object & CSS.Properties & CSS.PropertiesHyphen;
+interface PropsFunction {
+    (arg: unknown): false | undefined | CSSProperties;
+}
+interface CSSNestedAttributes {
+    [key: string]: CSSAttributes | PropsFunction | CSSNestedAttributes;
+}
+type CSSProperties = CSSAttributes | CSSNestedAttributes;
+type UnknownProp = {
+    [key: string]: unknown;
+};
+
+type MediaTypes = 'print' | 'screen';
+type TypeMethods = {
+    [key in MediaTypes]: () => MediaQueryAPI;
+};
+interface DefinedFeatures {
+    anyPointer(arg: 'fine' | 'coarse' | 'none'): MediaQueryAPI;
+    colorGamut(arg: 'srgb' | 'p3' | 'rec2020'): MediaQueryAPI;
+    displayMode(arg: 'fullscreen' | 'standalone' | 'minimal-ui' | 'browser'): MediaQueryAPI;
+    orientation(arg: 'landscape' | 'portrait'): MediaQueryAPI;
+    overflowBlock(arg: 'none' | 'scroll' | 'optional-paged' | 'paged'): MediaQueryAPI;
+    pointer(arg: 'fine' | 'coarse' | 'none'): MediaQueryAPI;
+    prefersColorScheme(arg: 'light' | 'dark'): MediaQueryAPI;
+    prefersContrast(arg: 'no-preference' | 'more' | 'less'): MediaQueryAPI;
+    scripting(arg: 'none' | 'initial-only' | 'enabled'): MediaQueryAPI;
+    update(arg: 'none' | 'slow' | 'fast'): MediaQueryAPI;
+}
+interface RangeFeatures {
+    height(arg: string): MediaQueryAPI;
+    minHeight(arg: string): MediaQueryAPI;
+    maxHeight(arg: string): MediaQueryAPI;
+    width(arg: string): MediaQueryAPI;
+    minWidth(arg: string): MediaQueryAPI;
+    maxWidth(arg: string): MediaQueryAPI;
+    /**
+     * Test aspect ratio of the viewport by supplying
+     * a `ratio` CSS data type.
+     *
+     * @example
+     * mq().aspectRatio('1/1')
+     */
+    aspectRatio(arg: string): MediaQueryAPI;
+    /**
+     * Test minimum aspect ratio of the viewport by supplying
+     * a `ratio` CSS data type.
+     *
+     * @example
+     * mq().minAspectRatio('8/5')
+     */
+    minAspectRatio(arg: string): MediaQueryAPI;
+    /**
+     * Test maximum aspect ratio of the viewport by supplying
+     * a `ratio` CSS data type.
+     *
+     * @example
+     * mq().maxAspectRatio('3/2')
+     */
+    maxAspectRatio(arg: string): MediaQueryAPI;
+    /**
+     * Test the bits per color component (red, green, blue) of
+     * the output device by supplying an `integer` CSS data type.
+     *
+     * Leave empty to test any device.
+     *
+     * @example
+     * mq().color()
+     */
+    color(arg?: number): MediaQueryAPI;
+    /**
+     * Test the minimum bits per color component (red, green, blue) of
+     * the output device by supplying an `integer` CSS data type.
+     *
+     * Leave empty to test any device.
+     *
+     * @example
+     * mq().minColor(8)
+     */
+    minColor(arg?: number): MediaQueryAPI;
+    /**
+     * Test the maximum bits per color component (red, green, blue) of
+     * the output device by supplying an `integer` CSS data type.
+     *
+     * Leave empty to test any device.
+     *
+     * @example
+     * mq().maxColor(8)
+     */
+    maxColor(arg?: number): MediaQueryAPI;
+    /**
+     * Test the number of entries in the output device's color lookup
+     * table by supplying an `integer` CSS data type.
+     *
+     * Leave empty to test any device.
+     *
+     * @example
+     * mq().colorIndex()
+     */
+    colorIndex(arg?: number): MediaQueryAPI;
+    /**
+     * Test the minimum number of entries in the output device's
+     * color lookup table by supplying an `integer` CSS data type.
+     *
+     * Leave empty to test any device.
+     *
+     * @example
+     * mq().minColorIndex(1500)
+     */
+    minColorIndex(arg?: number): MediaQueryAPI;
+    /**
+     * Test the maximum number of entries in the output device's
+     * color lookup table by supplying an `integer` CSS data type.
+     *
+     * Leave empty to test any device.
+     *
+     * @example
+     * mq().maxColorIndex(1500)
+     */
+    maxColorIndex(arg?: number): MediaQueryAPI;
+    /**
+     * Test the number of bits per pixel in the monochrome frame
+     * buffer of the output device  by supplying an `integer`
+     * CSS data type.
+     *
+     * Leave empty to test non-monochrome device.
+     *
+     * @example
+     * mq().monochrome()
+     * @example
+     * mq().monochrome(0)
+     */
+    monochrome(arg?: number): MediaQueryAPI;
+    /**
+     * Test the minimum number of bits per pixel in the monochrome
+     * frame buffer of the output device  by supplying an `integer`
+     * CSS data type.
+     *
+     * Leave empty to test non-monochrome device.
+     *
+     * @example
+     * mq().minMonochrome()
+     * @example
+     * mq().minMonochrome(0)
+     */
+    minMonochrome(arg?: number): MediaQueryAPI;
+    /**
+     * Test the maximum number of bits per pixel in the monochrome
+     * frame buffer of the output device  by supplying an `integer`
+     * CSS data type.
+     *
+     * Leave empty to test non-monochrome device.
+     *
+     * @example
+     * mq().maxMonochrome()
+     * @example
+     * mq().maxMonochrome(0)
+     */
+    maxMonochrome(arg?: number): MediaQueryAPI;
+    /**
+     * Test the pixel density of the output device by supplying
+     * a `resolution` CSS data type.
+     *
+     * @example
+     * mq().resolution('150dpi')
+     */
+    resolution(arg: string): MediaQueryAPI;
+    /**
+     * Test the minimum pixel density of the output device by
+     * supplying a `resolution` CSS data type.
+     *
+     * @example
+     * mq().minResolution('72dpi')
+     */
+    minResolution(arg: string): MediaQueryAPI;
+    /**
+     * Test the maximum pixel density of the output device by
+     * supplying a `resolution` CSS data type.
+     *
+     * @example
+     * mq().maxResolution('300dpi')
+     */
+    maxResolution(arg: string): MediaQueryAPI;
+}
+interface ToggleFeatures {
+    anyHover(arg: 'none' | 'hover'): MediaQueryAPI;
+    hover(arg: 'none' | 'hover'): MediaQueryAPI;
+    forcedColors(arg: 'none' | 'active'): MediaQueryAPI;
+    grid(arg: '0' | '1'): MediaQueryAPI;
+    invertedColors(arg: 'none' | 'inverted'): MediaQueryAPI;
+    overflowInline(arg: 'none' | 'scroll'): MediaQueryAPI;
+    prefersReducedMotion(arg: 'no-preference' | 'reduce'): MediaQueryAPI;
+}
+type FeatureMethods = Prettify<DefinedFeatures & RangeFeatures & ToggleFeatures>;
+interface MediaQueryAPI extends TypeMethods, FeatureMethods {
+    /**
+     * Creates range feature to query the `min-width`
+     * of the viewport against the given value in `pixels`.
+     *
+     * @example
+     * mq().from(768) // '@media (min-width: 768px)'
+     */
+    from(arg: number): MediaQueryAPI;
+    /**
+     * Creates range feature to query the `max-width`
+     * of the viewport against the given value in `pixels`.
+     *
+     * @example
+     * mq().to(991) // '@media (max-width: 991px)'
+     */
+    to(arg: number): MediaQueryAPI;
+    feature(name: string, value?: number | string): MediaQueryAPI;
+    toString(): string;
+}
+
+type PseudoClass = CreateType<typeof PSEUDO_CLASSES[number], string>;
+type PseudoClassFunctionString = CreateType<typeof PCF_STRING[number], (arg: string) => string>;
+type PseudoClassFunctionStringArray = CreateType<typeof PCF_STRING_ARRAY[number], (...args: string[]) => string>;
+type PseudoClassFunctionNumberOrString = CreateType<typeof PCF_NUMBER_OR_STRING[number], (arg: number | string) => string>;
+type PseudoClasses = Prettify<PseudoClass & PseudoClassFunctionString & PseudoClassFunctionStringArray & PseudoClassFunctionNumberOrString>;
+type PseudoElement = CreateType<typeof PSEUDO_ELEMENTS[number], string>;
+type PseudoElementFunction = CreateType<typeof PSEUDO_ELEMENT_FUNCTIONS[number], (arg: string) => string>;
+type PseudoElements = Prettify<PseudoElement & PseudoElementFunction>;
+type ComponentSelector = string | {
+    toString(): string;
+};
+interface Combinators {
+    or(...data: string[]): string;
+    and(...data: string[]): string;
+}
+interface StyleHelper extends Combinators, PseudoClasses, PseudoElements {
+    attribute(name: string): AttributeAPI;
+    data(attribute: string): AttributeAPI;
+    /**
+     * Helper to create descendent selector(s) accepts both
+     * complex CSS selector(s) OR StyledComponent(s)
+     */
+    selector<T extends ComponentSelector>(...data: T[]): string;
+    /**
+     * Prop base styles where key is the prop name and
+     * value can be Object Styles OR a function that
+     * accepts an argument and renders styles based on
+     * the given value
+     *
+     * @example
+     * [style.prop('isActive')]: {
+     *    ...rules
+     * }
+     * @example
+     * [style.prop('alignment')]: (alignment) => ({
+     *    textAlign: alignment
+     * })
+     */
+    prop<P>(name: Extract<keyof P, string>): string;
+    props: {
+        /**
+         * Prop matcher function to test `all` given prop names
+         * exist AND its value is not false.
+         *
+         * Value can be Object Styles OR a function that accepts
+         * props object as its only argument.
+         *
+         * @example
+         * [style.props.all(
+         *    'isChecked',
+         *    'border'
+         * )]: {
+         *    ...rules
+         * }
+         * @example
+         * [style.props.all(
+         *    'isChecked',
+         *    'borderColor'
+         * )]: ({ borderColor }) => ({
+         *    border: `4px dashed ${borderColor}`
+         * })
+         */
+        all<P>(...names: Extract<keyof P, string>[]): string;
+        /**
+         * Prop matcher function to test `any` given prop names
+         * exist AND its value is not false.
+         *
+         * Value can be Object Styles OR a function that accepts
+         * props object as its only argument.
+         *
+         * @example
+         * [style.props.any(
+         *    'isChecked',
+         *    'border'
+         * )]: {
+         *    ...rules
+         * }
+         * @example
+         * [style.props.any(
+         *    'isChecked',
+         *    'borderColor'
+         * )]: ({ borderColor = 'pink' }) => ({
+         *    border: `4px dashed ${borderColor}`
+         * })
+         */
+        any<P>(...names: Extract<keyof P, string>[]): string;
+        /**
+         * Prop matcher function to test that the given props do not exist.
+         *
+         * @example
+         * [style.props.not(
+         *    'config',
+         *    'hasGutters'
+         * )]: {
+         *    ...rules
+         * }
+         */
+        not<P>(...names: Extract<keyof P, string>[]): string;
+    };
+}
+interface AttributeAPI {
+    equals(...items: string[]): string;
+    /** Attribute selector for matching whole word */
+    contains(...items: string[]): string;
+    /** Attribute selector for matching substring */
+    containsAny(...items: string[]): string;
+    startsWith(...items: string[]): string;
+    endsWith(...items: string[]): string;
+    toString(): string;
+}
+
+type CreateType<T extends PropertyKey, V> = {
+    [K in keyof PropertyKey as T]: V;
+};
+type Prettify<T> = {
+    [K in keyof T]: T[K];
+} & unknown;
+
+type EnhancedType<T, P> = T extends GenericComponent ? GenericComponent<P> : StyledComponent<P>;
+interface EnhancedProps<T, P> {
+    styles: CSSProperties;
+    toString(): string;
+    /**
+     * Harness the styles and propTypes from other
+     * components simply by "extending" them.
+     *
+     * You can even pass plain object literal(s) as
+     * arguments on top of styled components including
+     * `generic`(s).
+     */
+    extend<K>(...items: ExtendableItem[]): EnhancedType<T, P & K>;
+    /**
+     * Provides a mechanism to passing string based CSS
+     * styles.
+     *
+     * This is mainly used for global styles, At-rules
+     * such as `@keyframe`, `@font-face`, `@counter-style`
+     * etc.
+     */
+    withCSS(...styles: string[]): EnhancedType<T, P>;
+}
+type StyledComponent<P = UnknownProp> = Component<P> & EnhancedProps<StyledComponent, P>;
+interface FactoryHOC<P> {
+    <K>(C: Component<K>): StyledComponent<P & K>;
+}
+type GenericComponent<P = UnknownProp> = FactoryHOC<P> & EnhancedProps<GenericComponent, P>;
+type ExtendableItem = CSSProperties | GenericComponent | StyledComponent;
+
+/**
+ * API for creating React styled component(s)
+ */
+declare const styled: {
+    generic: <P = UnknownProp>(arg?: CSSProperties | undefined) => GenericComponent<P>;
+    object: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    a: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    abbr: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    address: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    area: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    article: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    aside: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    audio: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    b: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    base: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    bdi: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    bdo: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    blockquote: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    body: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    br: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    button: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    canvas: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    caption: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    cite: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    code: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    col: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    colgroup: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    data: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    datalist: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    dd: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    del: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    details: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    dfn: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    dialog: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    div: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    dl: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    dt: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    em: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    embed: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    fieldset: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    figcaption: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    figure: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    footer: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    form: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    h1: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    h2: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    h3: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    h4: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    h5: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    h6: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    head: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    header: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    hgroup: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    hr: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    html: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    i: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    iframe: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    img: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    input: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    ins: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    kbd: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    label: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    legend: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    li: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    link: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    main: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    map: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    mark: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    math: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    menu: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    meta: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    meter: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    nav: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    noscript: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    ol: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    optgroup: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    option: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    output: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    p: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    picture: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    portal: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    pre: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    progress: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    q: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    rp: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    rt: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    ruby: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    s: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    samp: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    script: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    section: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    select: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    small: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    source: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    span: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    strong: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    style: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    sub: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    summary: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    sup: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    svg: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    table: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    tbody: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    td: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    textarea: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    tfoot: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    th: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    thead: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    time: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    title: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    tr: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    track: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    u: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    ul: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    var: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    video: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+    wbr: <P_1 = UnknownProp>(arg?: CSSProperties | undefined) => StyledComponent<P_1>;
+};
+
+declare const mq: (...mediaTypes: MediaTypes[]) => MediaQueryAPI;
+
+declare const style: StyleHelper;
+
+declare const getStyles: () => string;
+
+export { CSSProperties, StyledComponent, styled as default, getStyles, mq, style };

package/solid/cjs/index.js

@@ -0,0 +1,2 @@
+/** @license styled v0.1.0. Copyright (c) N3E. */
+'use strict';Object.defineProperty(exports,'__esModule',{value:!0});var e=require('solid-js'),t=require('solid-js/web');const r='undefined'!=typeof window,n=e=>t=>typeof t===e,o=n('function'),s=n('number'),a=n('string'),i=n('object'),l=e=>t=>t===e,c=l(!0),d=l(!1),u=l(null),p=l(void 0),m=e=>i(e)&&!u(e)&&!Array.isArray(e),h=e=>a(e)||s(e),f=e=>u(e)||p(e),{stringify:y}=JSON,g=e=>(...t)=>`${e}-${(e=>(e=>{let t=-2128831035;for(let r=0;r<e.length;r++)t^=e.charCodeAt(r),t=16777619*t>>>0;return t})(y(e,((e,t)=>o(t)?`[Function ${e}]`:t))).toString(36))(t)}`,b=g('e'),v=g('s'),S=g('d'),w=g('c'),$=(...e)=>e.join(''),C=e=>t=>$(t,e),j=e=>t=>$(e,t),O=j('.'),x=(e,t)=>{return t.split('||').flatMap((r=e,e=>r.map(C(e))));var r},k=e=>e.join('||'),R=e=>(...t)=>t.filter(Boolean).join(e),E=R(' '),T=e=>`(${e})`,_=(e,t)=>Object.entries(t).reduce(((t,[r,n])=>({...t,[r]:m(n)&&r in e?_(e[r],n):n})),{...e}),M=e=>e.trim().replace(/([A-Z])+/g,'-$1').toLowerCase(),A=(...e)=>t=>e.some((e=>t.startsWith(e))),L=e=>e.replace(/ {2}|\r\n|\n|\r/gm,'').trim(),P='@media',q=['print','screen'],W=['host','lang','is','not','where','nthChild','nthLastChild','nthLastOfType','nthOfType'],N='all',D='any',I='not',B='only',H='data-styled-sheet',F=(e,t)=>{const n=r?window:global,o=`__STYLED_${e}_REGISTER`;return o in n||Object.defineProperty(n,o,{value:Object.freeze(t())}),n[o]},G=e=>({add:(t,r)=>e.get(t)||e.set(t,{...r(),toString:()=>t}).get(t),get:t=>e.get(t),has:t=>e.has(t),__getDataStore:()=>new Map(e)}),Y=F('CACHE',(()=>G(new Map))),z=F('SHEET',(()=>{const e=new Map,t=([e,t])=>`<style ${H}="${e}">${t.css()}</style>`;return{...G(e),getStyles:()=>[...e].map(t).join('')}})),J=F('PROPS',(()=>({...G(new Map),names:new Set}))),{getStyles:U}=z,V=l('content'),Z=A('@container',P,'@supports'),K=A(':','[',' ','>','~','+','.'),Q=e=>()=>e,X=(e,t)=>{const r=V(e)||s(t)?y:L;return`${M(e)}:${r(t)};`},ee=e=>(t,r)=>r.reduceRight(e,t),te=(e,t)=>`${t}{${e}}`,re=ee(te),ne=ee(((e,t)=>({[t]:{...e}}))),oe=(e,t,r)=>n=>{const o=1===r.length?n[r[0]]:n,s=t(o);return m(s)?ne(s,e):{}},se=(...e)=>{const[t]=e,r=[e.map(O).join('')],n=(e,r,s,a)=>{const i=o(e),l=!J.has(s),c=J.get(s),[d,u]=(p=e,Object.entries(p).reduce((([e,t],[r,n])=>[h(n)?$(e,X(r,n)):e,m(n)||o(n)?{...t,[r]:n}:t]),['',{}]));var p;const f=Z(s)?[...a,s]:a,y=K(s)?x(r,s):r;return Object.entries(u).reduce(((e,[r,o])=>{if(!l)return e;const{computables:s,rules:a}=n(o,y,r,f);return{baseClassName:t,computables:[...e.computables,...s],rules:[...e.rules,...a]}}),{baseClassName:t,computables:l?[]:[{...c,identity:i?w:Q(S(e)),yield:i?oe(a,e,c.keys):Q(e)}],rules:l&&d?[re(te(d,y.join()),f)]:[]})};return e=>n(e,r,'',[])},ae=(e,t=H)=>'undefined'==typeof document?void 0:document.querySelector(`style[${t}=${e}]`)||(e=>{const t=document.createElement(e),r={appendTo:e=>e.appendChild(t)&&r,withAttribute:(e,n)=>t.setAttribute(e,n)||r,unwrap:()=>t};return r})('style').withAttribute(t,e).appendTo(document.head).unwrap(),ie=(e,t)=>(t.textContent||'').includes(e),le=e=>t=>{if(!ie(t,e)){const r=document.createTextNode(t);e.appendChild(r)}},ce=(e,t=e.sheet)=>r=>{try{if(t&&!ie(r,e)){const e=t.cssRules.length;t.insertRule(r,e)}}catch(e){console.error(`DOMException: Failed to parse "${r}"`)}},de=(e,t)=>n=>{const o=Y.has(e),{baseClassName:s,computables:a,globals:i=[],rules:l}=Y.add(e,t);if(!o){const t=()=>((e,t=ae(e))=>{const n=new Map,o=r&&c(window.__STYLED_SLOW_MODE)?le:ce;return{inject:(e,r)=>{n.has(e)||(t&&r.forEach(o(t)),n.set(e,r))},css:()=>[...n.values()].flat().join('')}})(s);z.add(s,t).inject(e,[...l,...i])}return a.length?n(e):[]},ue=e=>{const t=r=>Y.get(r).computables.reduce(((n,o)=>{if(!o.predicate(e))return n;const s=o.yield(e),a=o.identity(s),i=`${a} (${r})`;return[...n,a,...de(i,(()=>se(Y.get(r).baseClassName,a)(s)))(t)]}),[]);return t},pe=(e,t,r=[])=>(n={})=>{const o=b({name:e,...n}),s=s=>((e,t)=>{for(const r in t)Object.defineProperty(e,r,{value:t[r]});return e})(s,{styles:n,toString:()=>O(o),extend:(...o)=>{const s=(a=n,o.reduce(((e,t)=>{const r=t||{},n=r.styles||r;return _(e,n)}),a));var a;return pe(e,t,r)(s)},withCSS:(...r)=>pe(e,t,r)(n)});return s(t?t({classIdentity:o,displayName:`styled.${e}`,styleRules:n,plainStyles:r}):t=>pe(e,me(t),r)(n))},me=r=>({classIdentity:n,styleRules:o,plainStyles:s})=>{const i=((e,t)=>{const r=v(e),n=()=>({...se(r)(e),...t.length&&{globals:t.map(L)}});return e=>[r,...de(r,n)(ue(e))]})(o,s);return o=>{const s=[...a(r)?[...J.names]:[],'class','component'],[,l]=e.splitProps(o,s),c=e.mergeProps({component:r,get class(){return E(n,...i(o),o.class)}},l);return t.Dynamic(c)}},he=['a','abbr','address','area','article','aside','audio','b','base','bdi','bdo','blockquote','body','br','button','canvas','caption','cite','code','col','colgroup','data','datalist','dd','del','details','dfn','dialog','div','dl','dt','em','embed','fieldset','figcaption','figure','footer','form','h1','h2','h3','h4','h5','h6','head','header','hgroup','hr','html','i','iframe','img','input','ins','kbd','label','legend','li','link','main','map','mark','math','menu','meta','meter','nav','noscript','object','ol','optgroup','option','output','p','picture','portal','pre','progress','q','rp','rt','ruby','s','samp','script','section','select','small','source','span','strong','style','sub','summary','sup','svg','table','tbody','td','textarea','tfoot','th','thead','time','title','tr','track','u','ul','var','video','wbr'].reduce(((e,t)=>({...e,[t]:pe(t,me(t))})),{generic:pe('generic')}),fe=C('px'),ye=[...q,'anyPointer','colorGamut','displayMode','orientation','overflowBlock','pointer','prefersColorScheme','prefersContrast','scripting','update','anyHover','hover','forcedColors','grid','invertedColors','overflowInline','prefersReducedMotion',...((...e)=>t=>t.reduce(((t,r)=>{return[...t,...e.map(C((n=r,n.charAt(0).toUpperCase()+n.slice(1)))),r];var n}),[]))('min','max')(['height','width','aspectRatio','color','colorIndex','monochrome','resolution'])],ge=R(' and '),be=R(', '),ve=e=>t=>!f(e[t])&&!d(e[t]),Se=(e,t)=>{const r={[N]:e=>t.every(ve(e)),[D]:e=>t.some(ve(e)),[I]:e=>t.every((e=>t=>f(e[t]))(e)),[B]:e=>ve(e)(t[0])};return t.forEach((e=>J.names.add(e))),{keys:t,predicate:r[e]}},we=e=>(...t)=>J.add(`props.${e}(${t})`,(()=>Se(e,t))).toString(),$e=e=>(...t)=>k(t.map(e)),Ce={and:(...e)=>k(e.reduce(x,[''])),or:(...e)=>k(e)},je=e=>(t,r)=>[...t,...r].reduce(((t,n)=>{const o=$(e,M(n)),s=r.includes(n);return{...t,[n]:s?(...e)=>$(o,T(e)):o}}),{}),Oe=je('::')(['after','backdrop','before','cue','cueRegion','firstLetter','firstLine','fileSelectorButton','marker','placeholder','selection'],['part','slotted']),xe=je(':')(['active','anyLink','autofill','checked','default','defined','disabled','empty','enabled','first','firstChild','firstOfType','fullscreen','focus','focusVisible','focusWithin','hover','indeterminate','inRange','invalid','lastChild','lastOfType','left','link','modal','onlyChild','onlyOfType','optional','outOfRange','pictureInPicture','placeholderShown','paused','playing','readOnly','readWrite','required','right','root','scope','target','valid','visited'],W),ke=e=>`[${e}]`,Re=e=>{const t=M(e),r=e=>r=>ke($(t,e,y(r)));return{equals:$e(r('=')),contains:$e(r('~=')),containsAny:$e(r('*=')),startsWith:$e(r('^=')),endsWith:$e(r('$=')),toString:()=>ke(t)}},Ee={...Ce,...Oe,...xe,attribute:Re,data:e=>Re(`data-${e}`),selector:$e(j(' ')),prop:we(B),props:{[N]:we(N),[D]:we(D),[I]:we(I)}};exports.default=he,exports.getStyles=U,exports.mq=(...e)=>{const t=new Set(e),r=new Set,n=(e,t)=>r.add(T([M(e),t].filter(h).join(':'))),o={...ye.reduce(((e,r)=>({...e,[r]:q.includes(r)?()=>t.add(r)&&o:e=>n(r,e)&&o})),{}),feature:(e,t)=>n(e,t)&&o,from:e=>o.minWidth(fe(e)),to:e=>o.maxWidth(fe(e)),toString:()=>E(P,ge(be(...t),...r))};return o},exports.style=Ee;