@yamada-ui/react 2.0.10-dev-20260224132828 → 2.0.10-dev-20260226095744

package/dist/types/core/components/create-component.d.ts

@@ -1,9 +1,11 @@
 import { AnyString, Dict, Merge } from "../../utils/index.js";
 import { ComponentSlotStyle, ComponentStyle, System, WithoutThemeProps } from "../system/index.types.js";
 import { StyledOptions } from "../system/styled.js";
+import "../system/index.js";
 import { CSSObject, CSSSlotObject } from "../css/index.types.js";
+import "../css/index.js";
 import { As, Component as Component$1, HTMLStyledProps } from "./index.types.js";
-import * as react897 from "react";
+import * as react26 from "react";
 import { FC, FunctionComponent } from "react";
 
 //#region src/core/components/create-component.d.ts
@@ -34,8 +36,8 @@ declare function createComponent<Y extends object = {}, M extends ComponentStyle
     className,
     ...options
   }?: ComponentOptions) => (...superProps: SuperProps<H>[]) => Component<D_1, H>;
-  ComponentContext: react897.Context<D>;
-  PropsContext: react897.Context<Partial<Y> | undefined>;
+  ComponentContext: react26.Context<D>;
+  PropsContext: react26.Context<Partial<Y> | undefined>;
   useComponentContext: () => D;
   usePropsContext: () => Partial<Y> | undefined;
   withContext: <D_1 extends AsWithFragment = "div", H extends Y = Y, R extends keyof H = keyof H>(el: D_1 | FC<WithoutThemeProps<H, M, R>>, {
@@ -57,16 +59,16 @@ declare function createSlotComponent<Y extends object = {}, M extends ComponentS
     className,
     ...options
   }?: ComponentOptions) => (...superProps: SuperProps<R>[]) => Component<H, R>;
-  ComponentContext: react897.Context<D>;
-  PropsContext: react897.Context<Partial<Y> | undefined>;
-  StyleContext: react897.Context<CSSSlotObject<ComponentSlotName<M>>>;
+  ComponentContext: react26.Context<D>;
+  PropsContext: react26.Context<Partial<Y> | undefined>;
+  StyleContext: react26.Context<CSSSlotObject<ComponentSlotName<M>>>;
   useClassNames: () => {
     [key: string]: string;
   };
   useComponentContext: () => D;
   usePropsContext: () => Partial<Y> | undefined;
   useStyleContext: () => CSSSlotObject<ComponentSlotName<M>>;
-  withContext: <H extends AsWithFragment = "div", R extends Dict = (H extends keyof react897.JSX.IntrinsicElements ? HTMLStyledProps<H> : Dict<any>)>(el: FC<R> | H, slot?: ComponentSlot<ComponentSlotName<M>>, {
+  withContext: <H extends AsWithFragment = "div", R extends Dict = (H extends keyof react26.JSX.IntrinsicElements ? HTMLStyledProps<H> : Dict<any>)>(el: FC<R> | H, slot?: ComponentSlot<ComponentSlotName<M>>, {
     name,
     className,
     withContext,

package/dist/types/core/components/index.types.d.ts

@@ -1,5 +1,6 @@
 import { Merge } from "../../utils/index.js";
 import { CSSProps } from "../css/index.types.js";
+import "../css/index.js";
 import * as React from "react";
 
 //#region src/core/components/index.types.d.ts

package/dist/types/core/components/use-component-style.d.ts

@@ -1,6 +1,8 @@
 import { Dict } from "../../utils/index.js";
 import { ComponentSlotStyle, ComponentStyle, WithoutThemeProps } from "../system/index.types.js";
+import "../system/index.js";
 import { CSSObject, CSSSlotObject } from "../css/index.types.js";
+import "../css/index.js";
 import { ComponentSlot, ComponentSlotName } from "./create-component.js";
 
 //#region src/core/components/use-component-style.d.ts
@@ -8,9 +10,9 @@ declare function getSlotClassName<Y extends string>(className?: string, slot?: C
 declare function mergeSlotCSS<Y extends string>(slot?: ComponentSlot<Y>, style?: CSSSlotObject<Y>, css?: CSSObject | CSSObject[]): CSSObject | CSSObject[] | undefined;
 interface UseStyleOptions<Y extends Dict = Dict, M extends ComponentSlotStyle | ComponentStyle = ComponentStyle, D extends keyof Y = keyof Y, H extends boolean = false> {
   className?: string;
-  style?: M;
   hasSlot?: H;
   slot?: ComponentSlot<ComponentSlotName<M>>;
+  style?: M;
   transferProps?: D[];
 }
 interface UseComponentStyleOptions<Y extends Dict = Dict, M extends ComponentSlotStyle | ComponentStyle = ComponentStyle, D extends keyof Y = keyof Y> extends Omit<UseStyleOptions<Y, M, D>, "hasSlot" | "slot"> {}

package/dist/types/core/components/utils.d.ts

@@ -1,4 +1,5 @@
 import { System } from "../system/index.types.js";
+import "../system/index.js";
 
 //#region src/core/components/utils.d.ts
 declare function getDisplayName(name: string, fallback?: string): string;

package/dist/types/core/constant.d.ts

@@ -1,4 +1,5 @@
 import { LayersConfig } from "./system/index.types.js";
+import "./system/index.js";
 
 //#region src/core/constant.d.ts
 declare const COLOR_MODE_STORAGE_KEY = "color-mode";

package/dist/types/core/css/calc.d.ts

@@ -1,4 +1,5 @@
 import { ThemeToken } from "../system/create-system.js";
+import "../system/index.js";
 import { Transform } from "./utils.js";
 
 //#region src/core/css/calc.d.ts

package/dist/types/core/css/config.d.ts

@@ -1,4 +1,5 @@
 import { ThemeToken } from "../system/create-system.js";
+import "../system/index.js";
 import { display } from "./display.js";
 import { colorScheme } from "./color-scheme.js";
 import { CSSProperties } from "./index.types.js";

package/dist/types/core/css/css.d.ts

@@ -1,5 +1,6 @@
 import { Dict } from "../../utils/index.js";
 import { System, UsageTheme } from "../system/index.types.js";
+import "../system/index.js";
 import { CSSObjectOrFunction } from "./index.types.js";
 import { StyleConfig } from "./config.js";
 

package/dist/types/core/css/index.types.d.ts

@@ -1,5 +1,6 @@
 import { AnyString } from "../../utils/index.js";
 import { Breakpoint, KeyframeIdent, System, ThemePath, ThemeTokens } from "../system/index.types.js";
+import "../system/index.js";
 import { AnySelector, ConditionProperty, ConditionProps } from "./conditions.js";
 import { StyleProps } from "./styles.js";
 import * as CSS from "csstype";
@@ -32,12 +33,12 @@ type CSSSlotObject<Y$1 extends string = string> = { [M in Y$1]?: CSSObject };
 type CSSModifierObject<Y$1 extends CSSObject | CSSSlotObject = CSSObject> = { [M in "base" | AnyString]?: Y$1 };
 type CSSKeyframeObject = { [M in `${number}%` | KeyframeIdent]?: CSSFlatObject };
 interface CSSAnimationObject {
+  keyframes: Token<CSSKeyframeObject, "keyframes">;
   delay?: Token<CSS.Property.AnimationDelay>;
   direction?: Token<CSS.Property.AnimationDirection>;
   duration?: Token<CSS.Property.AnimationDuration, "durations">;
   fillMode?: Token<CSS.Property.AnimationFillMode>;
   iterationCount?: Token<CSS.Property.AnimationIterationCount>;
-  keyframes: Token<CSSKeyframeObject, "keyframes">;
   playState?: Token<CSS.Property.AnimationPlayState>;
   timingFunction?: Token<CSS.Property.AnimationTimingFunction, "easings">;
 }

package/dist/types/core/css/styles.d.ts

@@ -1,5 +1,6 @@
 import { AnyString } from "../../utils/index.js";
 import { ColorScheme, ThemeTokens } from "../system/index.types.js";
+import "../system/index.js";
 import { display } from "./display.js";
 import { colorScheme } from "./color-scheme.js";
 import { CSSObject, StyleValueWithCondition } from "./index.types.js";
@@ -3847,21 +3848,216 @@ type ZIndexProperty = (typeof zIndexProperties)[number];
 declare const zIndexProperties: readonly ["zIndex", "z"];
 interface StyleProps {
   /**
-   * Apply other styles defined in `theme.styles`.
+   * ### container
+   *
+   * Container size queries with the <code>@container</code> at-rule apply styles to an element based on the dimensions of its container.
+   *
+   * @baseline `Widely available`
+   * @widely_available_date 2025-08-14
+   * @newly_available_date 2023-02-14
+   *
+   * @see https://developer.mozilla.org/docs/Web/CSS/Reference/At-rules/@container
    */
-  apply?: StyleValueWithCondition<AnyString, "apply">;
+  _container?: {
+    [key: string]: any;
+    aspectRatio?: CSS.Property.AspectRatio;
+    blockSize?: CSS.Property.BlockSize | number | ThemeTokens["sizes"];
+    css?: CSSObject;
+    h?: CSS.Property.Height | number | ThemeTokens["sizes"];
+    height?: CSS.Property.Height | number | ThemeTokens["sizes"];
+    inlineSize?: CSS.Property.InlineSize | number | ThemeTokens["sizes"];
+    maxAspectRatio?: CSS.Property.AspectRatio;
+    maxBlockSize?: CSS.Property.MaxBlockSize | number | ThemeTokens["sizes"];
+    maxH?: CSS.Property.MaxHeight | number | ThemeTokens["sizes"];
+    maxHeight?: CSS.Property.MaxHeight | number | ThemeTokens["sizes"];
+    maxInlineSize?: CSS.Property.MaxInlineSize | number | ThemeTokens["sizes"];
+    maxW?: CSS.Property.MaxWidth | number | ThemeTokens["sizes"];
+    maxWidth?: CSS.Property.MaxWidth | number | ThemeTokens["sizes"];
+    minAspectRatio?: CSS.Property.AspectRatio;
+    minBlockSize?: CSS.Property.MinBlockSize | number | ThemeTokens["sizes"];
+    minH?: CSS.Property.MinHeight | number | ThemeTokens["sizes"];
+    minHeight?: CSS.Property.MinHeight | number | ThemeTokens["sizes"];
+    minInlineSize?: CSS.Property.MinInlineSize | number | ThemeTokens["sizes"];
+    minW?: CSS.Property.MinWidth | number | ThemeTokens["sizes"];
+    minWidth?: CSS.Property.MinWidth | number | ThemeTokens["sizes"];
+    name?: AnyString;
+    orientation?: "landscape" | "portrait" | AnyString;
+    query?: AnyString;
+    w?: CSS.Property.Width | number | ThemeTokens["sizes"];
+    width?: CSS.Property.Width | number | ThemeTokens["sizes"];
+  }[];
   /**
-   * Apply layer styles defined in `theme.layerStyles`.
+   * ### keyframes
+   *
+   * The <code>animation</code> CSS property animates an element's style over time, using keyframes described in <code>@keyframes</code> rules.
+   *
+   * @baseline `Widely available`
+   * @widely_available_date 2018-03-30
+   * @newly_available_date 2015-09-30
+   *
+   * @see https://developer.mozilla.org/docs/Web/CSS/Reference/At-rules/@keyframes
    */
-  layerStyle?: StyleValueWithCondition<AnyString, "layerStyles">;
+  _keyframes?: StyleValueWithCondition<AnyString | {
+    [key: string]: CSSObject;
+  }, "keyframes">;
   /**
-   * Apply text styles defined in `theme.textStyles`.
+   * ### media
+   *
+   * The <code>@media</code> CSS rule conditionally applies styles based on the output device type, its capabilities, and the user's preferences. Media queries are composed of an optional media type such as <code>screen</code> or <code>print</code>, and one or more mandatory media features, such as <code>prefers-reduced-animations</code>.
+   *
+   * @baseline `Widely available`
+   * @widely_available_date 2018-01-29
+   * @newly_available_date 2015-07-29
+   *
+   * @see https://developer.mozilla.org/docs/Web/CSS/Reference/At-rules/@media
    */
-  textStyle?: StyleValueWithCondition<AnyString, "textStyles">;
+  _landscape?: StyleValueWithCondition<CSSObject>;
   /**
-   * Set color scheme variables.
+   * ### media
+   *
+   * The <code>@media</code> CSS rule conditionally applies styles based on the output device type, its capabilities, and the user's preferences. Media queries are composed of an optional media type such as <code>screen</code> or <code>print</code>, and one or more mandatory media features, such as <code>prefers-reduced-animations</code>.
+   *
+   * @baseline `Widely available`
+   * @widely_available_date 2018-01-29
+   * @newly_available_date 2015-07-29
+   *
+   * @see https://developer.mozilla.org/docs/Web/CSS/Reference/At-rules/@media
    */
-  colorScheme?: StyleValueWithCondition<AnyString | ColorScheme>;
+  _media?: {
+    [key: string]: any;
+    anyHover?: "hover" | "none" | AnyString;
+    anyPointer?: "coarse" | "fine" | "none" | AnyString;
+    aspectRatio?: CSS.Property.AspectRatio;
+    color?: AnyString | number;
+    colorGamut?: "p3" | "rec2020" | "srgb" | AnyString;
+    colorIndex?: AnyString | number;
+    css?: CSSObject;
+    deviceAspectRatio?: CSS.Property.AspectRatio;
+    deviceHeight?: CSS.Property.Height | number | ThemeTokens["sizes"];
+    deviceWidth?: CSS.Property.Width | number | ThemeTokens["sizes"];
+    displayMode?: "browser" | "fullscreen" | "minimal-ui" | "picture-in-picture" | "standalone" | "window-controls-overlay" | AnyString;
+    dynamicRange?: "high" | "standard" | AnyString;
+    forcedColors?: "active" | "none" | AnyString;
+    grid?: 0 | 1 | "AnyString";
+    h?: CSS.Property.Height | number | ThemeTokens["sizes"];
+    height?: CSS.Property.Height | number | ThemeTokens["sizes"];
+    hover?: "hover" | "none" | AnyString;
+    invertedColors?: "inverted" | "none" | AnyString;
+    maxColor?: AnyString | number;
+    maxColorIndex?: AnyString | number;
+    maxDeviceAspectRatio?: CSS.Property.AspectRatio;
+    maxDeviceHeight?: CSS.Property.MaxHeight | number | ThemeTokens["sizes"];
+    maxH?: CSS.Property.MaxHeight | number | ThemeTokens["sizes"];
+    maxHeight?: CSS.Property.MaxHeight | number | ThemeTokens["sizes"];
+    maxMonochrome?: AnyString | number;
+    maxResolution?: AnyString;
+    maxW?: CSS.Property.MaxWidth | number | ThemeTokens["sizes"];
+    maxWidth?: CSS.Property.MaxWidth | number | ThemeTokens["sizes"];
+    mazDeviceWidth?: CSS.Property.Width | number | ThemeTokens["sizes"];
+    minColor?: AnyString | number;
+    minColorIndex?: AnyString | number;
+    minDeviceAspectRatio?: CSS.Property.AspectRatio;
+    minDeviceHeight?: CSS.Property.MinHeight | number | ThemeTokens["sizes"];
+    minDeviceWidth?: CSS.Property.Width | number | ThemeTokens["sizes"];
+    minH?: CSS.Property.MinHeight | number | ThemeTokens["sizes"];
+    minHeight?: CSS.Property.MinHeight | number | ThemeTokens["sizes"];
+    minMonochrome?: AnyString | number;
+    minResolution?: AnyString;
+    minW?: CSS.Property.MinWidth | number | ThemeTokens["sizes"];
+    minWidth?: CSS.Property.MinWidth | number | ThemeTokens["sizes"];
+    monochrome?: AnyString | number;
+    orientation?: "landscape" | "portrait" | AnyString;
+    overflowBlock?: "none" | "optional-paged" | "paged" | "scroll" | AnyString;
+    overflowInline?: "none" | "scroll" | AnyString;
+    pointer?: "coarse" | "fine" | "none" | AnyString;
+    prefersColorScheme?: "dark" | "light" | AnyString;
+    prefersContrast?: "custom" | "high" | "low" | "no-preference" | AnyString;
+    prefersReducedMotion?: "no-preference" | "reduce" | AnyString;
+    query?: AnyString;
+    resolution?: AnyString;
+    scan?: "interlace" | "progressive" | AnyString;
+    scripting?: "enabled" | "initial-only" | "none" | AnyString;
+    type?: "all" | "print" | "screen" | "speech" | AnyString;
+    update?: "fast" | "none" | "slow" | AnyString;
+    videoDynamicRange?: "high" | "standard" | AnyString;
+    w?: CSS.Property.Width | number | ThemeTokens["sizes"];
+    width?: CSS.Property.Width | number | ThemeTokens["sizes"];
+  }[];
+  /**
+   * ### media
+   *
+   * The <code>@media</code> CSS rule conditionally applies styles based on the output device type, its capabilities, and the user's preferences. Media queries are composed of an optional media type such as <code>screen</code> or <code>print</code>, and one or more mandatory media features, such as <code>prefers-reduced-animations</code>.
+   *
+   * @baseline `Widely available`
+   * @widely_available_date 2018-01-29
+   * @newly_available_date 2015-07-29
+   *
+   * @see https://developer.mozilla.org/docs/Web/CSS/Reference/At-rules/@media
+   */
+  _mediaDark?: StyleValueWithCondition<CSSObject>;
+  /**
+   * ### media
+   *
+   * The <code>@media</code> CSS rule conditionally applies styles based on the output device type, its capabilities, and the user's preferences. Media queries are composed of an optional media type such as <code>screen</code> or <code>print</code>, and one or more mandatory media features, such as <code>prefers-reduced-animations</code>.
+   *
+   * @baseline `Widely available`
+   * @widely_available_date 2018-01-29
+   * @newly_available_date 2015-07-29
+   *
+   * @see https://developer.mozilla.org/docs/Web/CSS/Reference/At-rules/@media
+   */
+  _mediaLight?: StyleValueWithCondition<CSSObject>;
+  /**
+   * ### media
+   *
+   * The <code>@media</code> CSS rule conditionally applies styles based on the output device type, its capabilities, and the user's preferences. Media queries are composed of an optional media type such as <code>screen</code> or <code>print</code>, and one or more mandatory media features, such as <code>prefers-reduced-animations</code>.
+   *
+   * @baseline `Widely available`
+   * @widely_available_date 2018-01-29
+   * @newly_available_date 2015-07-29
+   *
+   * @see https://developer.mozilla.org/docs/Web/CSS/Reference/At-rules/@media
+   */
+  _mediaReduceMotion?: StyleValueWithCondition<CSSObject>;
+  /**
+   * ### media
+   *
+   * The <code>@media</code> CSS rule conditionally applies styles based on the output device type, its capabilities, and the user's preferences. Media queries are composed of an optional media type such as <code>screen</code> or <code>print</code>, and one or more mandatory media features, such as <code>prefers-reduced-animations</code>.
+   *
+   * @baseline `Widely available`
+   * @widely_available_date 2018-01-29
+   * @newly_available_date 2015-07-29
+   *
+   * @see https://developer.mozilla.org/docs/Web/CSS/Reference/At-rules/@media
+   */
+  _portrait?: StyleValueWithCondition<CSSObject>;
+  /**
+   * ### media
+   *
+   * The <code>@media</code> CSS rule conditionally applies styles based on the output device type, its capabilities, and the user's preferences. Media queries are composed of an optional media type such as <code>screen</code> or <code>print</code>, and one or more mandatory media features, such as <code>prefers-reduced-animations</code>.
+   *
+   * @baseline `Widely available`
+   * @widely_available_date 2018-01-29
+   * @newly_available_date 2015-07-29
+   *
+   * @see https://developer.mozilla.org/docs/Web/CSS/Reference/At-rules/@media
+   */
+  _print?: StyleValueWithCondition<CSSObject>;
+  /**
+   * ### supports
+   *
+   * The <code>@supports</code> at-rule applies styles based on a browser's support for CSS features, such as a CSS property and value. Also known as feature queries.
+   *
+   * @baseline `Widely available`
+   * @widely_available_date 2018-03-30
+   * @newly_available_date 2015-09-30
+   *
+   * @see https://developer.mozilla.org/docs/Web/CSS/Reference/At-rules/@supports
+   */
+  _supports?: {
+    css?: CSSObject;
+    query?: AnyString;
+  }[];
   /**
    * ### accent-color
    *
@@ -4142,6 +4338,10 @@ interface StyleProps {
    * @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/appearance
    */
   appearance?: StyleValueWithCondition<CSS.Property.Appearance>;
+  /**
+   * Apply other styles defined in `theme.styles`.
+   */
+  apply?: StyleValueWithCondition<AnyString, "apply">;
   /**
    * ### aspect-ratio
    *
@@ -6097,6 +6297,10 @@ interface StyleProps {
    * @deprecated
    */
   colorRendering?: StyleValueWithCondition<CSS.Property.ColorRendering>;
+  /**
+   * Set color scheme variables.
+   */
+  colorScheme?: StyleValueWithCondition<AnyString | ColorScheme>;
   /**
    * ### column-count
    *
@@ -7927,6 +8131,10 @@ interface StyleProps {
    * @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/justify-self
    */
   justifySelf?: StyleValueWithCondition<CSS.Property.JustifySelf>;
+  /**
+   * Apply layer styles defined in `theme.layerStyles`.
+   */
+  layerStyle?: StyleValueWithCondition<AnyString, "layerStyles">;
   /**
    * ### line-height
    *
@@ -11402,6 +11610,10 @@ interface StyleProps {
    * @experimental
    */
   textSpacingTrim?: StyleValueWithCondition<CSS.Property.TextSpacingTrim>;
+  /**
+   * Apply text styles defined in `theme.textStyles`.
+   */
+  textStyle?: StyleValueWithCondition<AnyString, "textStyles">;
   /**
    * ### text-transform
    *
@@ -11994,217 +12206,6 @@ interface StyleProps {
    * @see https://developer.mozilla.org/docs/Web/CSS/Reference/Properties/zoom
    */
   zoom?: StyleValueWithCondition<CSS.Property.Zoom>;
-  /**
-   * ### container
-   *
-   * Container size queries with the <code>@container</code> at-rule apply styles to an element based on the dimensions of its container.
-   *
-   * @baseline `Widely available`
-   * @widely_available_date 2025-08-14
-   * @newly_available_date 2023-02-14
-   *
-   * @see https://developer.mozilla.org/docs/Web/CSS/Reference/At-rules/@container
-   */
-  _container?: {
-    name?: AnyString;
-    css?: CSSObject;
-    [key: string]: any;
-    aspectRatio?: CSS.Property.AspectRatio;
-    blockSize?: CSS.Property.BlockSize | number | ThemeTokens["sizes"];
-    h?: CSS.Property.Height | number | ThemeTokens["sizes"];
-    height?: CSS.Property.Height | number | ThemeTokens["sizes"];
-    inlineSize?: CSS.Property.InlineSize | number | ThemeTokens["sizes"];
-    maxAspectRatio?: CSS.Property.AspectRatio;
-    maxBlockSize?: CSS.Property.MaxBlockSize | number | ThemeTokens["sizes"];
-    maxH?: CSS.Property.MaxHeight | number | ThemeTokens["sizes"];
-    maxHeight?: CSS.Property.MaxHeight | number | ThemeTokens["sizes"];
-    maxInlineSize?: CSS.Property.MaxInlineSize | number | ThemeTokens["sizes"];
-    maxW?: CSS.Property.MaxWidth | number | ThemeTokens["sizes"];
-    maxWidth?: CSS.Property.MaxWidth | number | ThemeTokens["sizes"];
-    minAspectRatio?: CSS.Property.AspectRatio;
-    minBlockSize?: CSS.Property.MinBlockSize | number | ThemeTokens["sizes"];
-    minH?: CSS.Property.MinHeight | number | ThemeTokens["sizes"];
-    minHeight?: CSS.Property.MinHeight | number | ThemeTokens["sizes"];
-    minInlineSize?: CSS.Property.MinInlineSize | number | ThemeTokens["sizes"];
-    minW?: CSS.Property.MinWidth | number | ThemeTokens["sizes"];
-    minWidth?: CSS.Property.MinWidth | number | ThemeTokens["sizes"];
-    orientation?: "landscape" | "portrait" | AnyString;
-    query?: AnyString;
-    w?: CSS.Property.Width | number | ThemeTokens["sizes"];
-    width?: CSS.Property.Width | number | ThemeTokens["sizes"];
-  }[];
-  /**
-   * ### keyframes
-   *
-   * The <code>animation</code> CSS property animates an element's style over time, using keyframes described in <code>@keyframes</code> rules.
-   *
-   * @baseline `Widely available`
-   * @widely_available_date 2018-03-30
-   * @newly_available_date 2015-09-30
-   *
-   * @see https://developer.mozilla.org/docs/Web/CSS/Reference/At-rules/@keyframes
-   */
-  _keyframes?: StyleValueWithCondition<AnyString | {
-    [key: string]: CSSObject;
-  }, "keyframes">;
-  /**
-   * ### media
-   *
-   * The <code>@media</code> CSS rule conditionally applies styles based on the output device type, its capabilities, and the user's preferences. Media queries are composed of an optional media type such as <code>screen</code> or <code>print</code>, and one or more mandatory media features, such as <code>prefers-reduced-animations</code>.
-   *
-   * @baseline `Widely available`
-   * @widely_available_date 2018-01-29
-   * @newly_available_date 2015-07-29
-   *
-   * @see https://developer.mozilla.org/docs/Web/CSS/Reference/At-rules/@media
-   */
-  _landscape?: StyleValueWithCondition<CSSObject>;
-  /**
-   * ### media
-   *
-   * The <code>@media</code> CSS rule conditionally applies styles based on the output device type, its capabilities, and the user's preferences. Media queries are composed of an optional media type such as <code>screen</code> or <code>print</code>, and one or more mandatory media features, such as <code>prefers-reduced-animations</code>.
-   *
-   * @baseline `Widely available`
-   * @widely_available_date 2018-01-29
-   * @newly_available_date 2015-07-29
-   *
-   * @see https://developer.mozilla.org/docs/Web/CSS/Reference/At-rules/@media
-   */
-  _media?: {
-    type?: "all" | "print" | "screen" | "speech" | AnyString;
-    css?: CSSObject;
-    [key: string]: any;
-    anyHover?: "hover" | "none" | AnyString;
-    anyPointer?: "coarse" | "fine" | "none" | AnyString;
-    aspectRatio?: CSS.Property.AspectRatio;
-    color?: AnyString | number;
-    colorGamut?: "p3" | "rec2020" | "srgb" | AnyString;
-    colorIndex?: AnyString | number;
-    deviceAspectRatio?: CSS.Property.AspectRatio;
-    deviceHeight?: CSS.Property.Height | number | ThemeTokens["sizes"];
-    deviceWidth?: CSS.Property.Width | number | ThemeTokens["sizes"];
-    displayMode?: "browser" | "fullscreen" | "minimal-ui" | "picture-in-picture" | "standalone" | "window-controls-overlay" | AnyString;
-    dynamicRange?: "high" | "standard" | AnyString;
-    forcedColors?: "active" | "none" | AnyString;
-    grid?: 0 | 1 | "AnyString";
-    h?: CSS.Property.Height | number | ThemeTokens["sizes"];
-    height?: CSS.Property.Height | number | ThemeTokens["sizes"];
-    hover?: "hover" | "none" | AnyString;
-    invertedColors?: "inverted" | "none" | AnyString;
-    maxColor?: AnyString | number;
-    maxColorIndex?: AnyString | number;
-    maxDeviceAspectRatio?: CSS.Property.AspectRatio;
-    maxDeviceHeight?: CSS.Property.MaxHeight | number | ThemeTokens["sizes"];
-    maxH?: CSS.Property.MaxHeight | number | ThemeTokens["sizes"];
-    maxHeight?: CSS.Property.MaxHeight | number | ThemeTokens["sizes"];
-    maxMonochrome?: AnyString | number;
-    maxResolution?: AnyString;
-    maxW?: CSS.Property.MaxWidth | number | ThemeTokens["sizes"];
-    maxWidth?: CSS.Property.MaxWidth | number | ThemeTokens["sizes"];
-    mazDeviceWidth?: CSS.Property.Width | number | ThemeTokens["sizes"];
-    minColor?: AnyString | number;
-    minColorIndex?: AnyString | number;
-    minDeviceAspectRatio?: CSS.Property.AspectRatio;
-    minDeviceHeight?: CSS.Property.MinHeight | number | ThemeTokens["sizes"];
-    minDeviceWidth?: CSS.Property.Width | number | ThemeTokens["sizes"];
-    minH?: CSS.Property.MinHeight | number | ThemeTokens["sizes"];
-    minHeight?: CSS.Property.MinHeight | number | ThemeTokens["sizes"];
-    minMonochrome?: AnyString | number;
-    minResolution?: AnyString;
-    minW?: CSS.Property.MinWidth | number | ThemeTokens["sizes"];
-    minWidth?: CSS.Property.MinWidth | number | ThemeTokens["sizes"];
-    monochrome?: AnyString | number;
-    orientation?: "landscape" | "portrait" | AnyString;
-    overflowBlock?: "none" | "optional-paged" | "paged" | "scroll" | AnyString;
-    overflowInline?: "none" | "scroll" | AnyString;
-    pointer?: "coarse" | "fine" | "none" | AnyString;
-    prefersColorScheme?: "dark" | "light" | AnyString;
-    prefersContrast?: "custom" | "high" | "low" | "no-preference" | AnyString;
-    prefersReducedMotion?: "no-preference" | "reduce" | AnyString;
-    query?: AnyString;
-    resolution?: AnyString;
-    scan?: "interlace" | "progressive" | AnyString;
-    scripting?: "enabled" | "initial-only" | "none" | AnyString;
-    update?: "fast" | "none" | "slow" | AnyString;
-    videoDynamicRange?: "high" | "standard" | AnyString;
-    w?: CSS.Property.Width | number | ThemeTokens["sizes"];
-    width?: CSS.Property.Width | number | ThemeTokens["sizes"];
-  }[];
-  /**
-   * ### media
-   *
-   * The <code>@media</code> CSS rule conditionally applies styles based on the output device type, its capabilities, and the user's preferences. Media queries are composed of an optional media type such as <code>screen</code> or <code>print</code>, and one or more mandatory media features, such as <code>prefers-reduced-animations</code>.
-   *
-   * @baseline `Widely available`
-   * @widely_available_date 2018-01-29
-   * @newly_available_date 2015-07-29
-   *
-   * @see https://developer.mozilla.org/docs/Web/CSS/Reference/At-rules/@media
-   */
-  _mediaDark?: StyleValueWithCondition<CSSObject>;
-  /**
-   * ### media
-   *
-   * The <code>@media</code> CSS rule conditionally applies styles based on the output device type, its capabilities, and the user's preferences. Media queries are composed of an optional media type such as <code>screen</code> or <code>print</code>, and one or more mandatory media features, such as <code>prefers-reduced-animations</code>.
-   *
-   * @baseline `Widely available`
-   * @widely_available_date 2018-01-29
-   * @newly_available_date 2015-07-29
-   *
-   * @see https://developer.mozilla.org/docs/Web/CSS/Reference/At-rules/@media
-   */
-  _mediaLight?: StyleValueWithCondition<CSSObject>;
-  /**
-   * ### media
-   *
-   * The <code>@media</code> CSS rule conditionally applies styles based on the output device type, its capabilities, and the user's preferences. Media queries are composed of an optional media type such as <code>screen</code> or <code>print</code>, and one or more mandatory media features, such as <code>prefers-reduced-animations</code>.
-   *
-   * @baseline `Widely available`
-   * @widely_available_date 2018-01-29
-   * @newly_available_date 2015-07-29
-   *
-   * @see https://developer.mozilla.org/docs/Web/CSS/Reference/At-rules/@media
-   */
-  _mediaReduceMotion?: StyleValueWithCondition<CSSObject>;
-  /**
-   * ### media
-   *
-   * The <code>@media</code> CSS rule conditionally applies styles based on the output device type, its capabilities, and the user's preferences. Media queries are composed of an optional media type such as <code>screen</code> or <code>print</code>, and one or more mandatory media features, such as <code>prefers-reduced-animations</code>.
-   *
-   * @baseline `Widely available`
-   * @widely_available_date 2018-01-29
-   * @newly_available_date 2015-07-29
-   *
-   * @see https://developer.mozilla.org/docs/Web/CSS/Reference/At-rules/@media
-   */
-  _portrait?: StyleValueWithCondition<CSSObject>;
-  /**
-   * ### media
-   *
-   * The <code>@media</code> CSS rule conditionally applies styles based on the output device type, its capabilities, and the user's preferences. Media queries are composed of an optional media type such as <code>screen</code> or <code>print</code>, and one or more mandatory media features, such as <code>prefers-reduced-animations</code>.
-   *
-   * @baseline `Widely available`
-   * @widely_available_date 2018-01-29
-   * @newly_available_date 2015-07-29
-   *
-   * @see https://developer.mozilla.org/docs/Web/CSS/Reference/At-rules/@media
-   */
-  _print?: StyleValueWithCondition<CSSObject>;
-  /**
-   * ### supports
-   *
-   * The <code>@supports</code> at-rule applies styles based on a browser's support for CSS features, such as a CSS property and value. Also known as feature queries.
-   *
-   * @baseline `Widely available`
-   * @widely_available_date 2018-03-30
-   * @newly_available_date 2015-09-30
-   *
-   * @see https://developer.mozilla.org/docs/Web/CSS/Reference/At-rules/@supports
-   */
-  _supports?: {
-    css?: CSSObject;
-    query?: AnyString;
-  }[];
 }
 //#endregion
 export { AnimationProperty, AspectRatioProperty, AtRuleStyleProperty, BlurProperty, BorderProperty, ColorProperty, DurationProperty, EasingProperty, FontProperty, GradientProperty, KeyframeProperty, PseudoStyleProperty, RadiusProperty, ShadowProperty, ShorthandStyleProperty, SizeProperty, SpaceProperty, StandardStyleProperty, StyleProperty, StyleProps, StyledStyleProperty, Styles, VariableLengthProperty, ZIndexProperty, animationProperties, aspectRatioProperties, atRuleStyles, blurProperties, borderProperties, colorProperties, durationProperties, easingProperties, fontProperties, gradientProperties, keyframeProperties, pseudoStyles, radiusProperties, shadowProperties, shorthandStyles, sizeProperties, spaceProperties, standardStyles, styleProperties, styledStyles, styles, variableLengthProperties, zIndexProperties };

package/dist/types/core/css/token.d.ts

@@ -1,4 +1,5 @@
 import { ThemeToken } from "../system/create-system.js";
+import "../system/index.js";
 import { Transform } from "./utils.js";
 
 //#region src/core/css/token.d.ts

package/dist/types/core/css/use-css.d.ts

@@ -1,4 +1,5 @@
 import { StyledTheme, System, UsageTheme } from "../system/index.types.js";
+import "../system/index.js";
 import { CSSObject, CSSObjectOrFunction } from "./index.types.js";
 
 //#region src/core/css/use-css.d.ts