@atlaskit/primitives 1.0.8 → 1.0.10

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

@@ -1,18 +1,19 @@
 import type { CSSProperties } from 'react';
-import { type BoxXCSS } from '../xcss/xcss';
+import type { XCSS } from '../xcss/xcss';
 export type BasePrimitiveProps = {
     /**
      * A unique string that appears as data attribute `data-testid` in the rendered code, serving as a hook for automated tests.
      */
     testId?: string;
     /**
-     * Inline styles to be applied to the primitive.
+     * Inline styles to be applied to the primitive. Only apply as a last resort, or where
+     * styles cannot otherwise be calculated outside of the runtime of the component they're applied.
      */
     style?: CSSProperties;
     /**
      * Apply a subset of permitted styles, powered by Atlassian Design System tokens.
      */
-    xcss?: BoxXCSS | BoxXCSS[];
+    xcss?: XCSS | Array<XCSS | false | undefined>;
     /**
      * Accessible role
      */

package/dist/types/xcss/xcss.d.ts

@@ -1,8 +1,6 @@
-/// <reference types="react" />
 import { css as cssEmotion } from '@emotion/react';
 import type { CSSPropertiesWithMultiValues, SerializedStyles } from '@emotion/serialize';
 import type * as CSS from 'csstype';
-import { Box } from '../index';
 import type { MediaQuery } from '../responsive/types';
 import { TokenisedProps } from './style-maps.partial';
 declare const uniqueSymbol: unique symbol;
@@ -11,25 +9,20 @@ declare const uniqueSymbol: unique symbol;
  * @returns a collection of styles that can be applied to the respective primitive
  */
 type ParsedXcss = ReturnType<typeof cssEmotion> | ReturnType<typeof cssEmotion>[];
-export declare const parseXcss: (args: XCSS | XCSSArray) => ParsedXcss;
+export declare const parseXcss: (args: XCSS | (XCSS | false | undefined)[]) => ParsedXcss;
+type AllMedia = MediaQuery | '@media screen and (forced-colors: active), screen and (-ms-high-contrast: active)' | '@media (prefers-color-scheme: dark)' | '@media (prefers-color-scheme: light)' | '@media (prefers-reduced-motion: reduce)';
 type CSSMediaQueries = {
-    [MQ in MediaQuery]?: Omit<SafeCSSObject, MediaQuery>;
+    [MQ in AllMedia]?: Omit<SafeCSSObject, AllMedia>;
 };
 type CSSPseudos = {
-    [Pseudo in CSS.Pseudos]?: Omit<SafeCSSObject, CSS.Pseudos | MediaQuery>;
+    [Pseudo in CSS.Pseudos]?: Omit<SafeCSSObject, CSS.Pseudos | AllMedia>;
 };
-type SafeCSSObject = CSSPseudos & TokenisedProps & CSSMediaQueries & Omit<CSSPropertiesWithMultiValues, keyof TokenisedProps>;
-type ScopedSafeCSSObject<T extends keyof SafeCSSObject> = Pick<SafeCSSObject, T>;
-declare const boxWrapper: (style: any) => {
-    readonly [uniqueSymbol]: BoxStyles;
+type AtRulesWithoutMedia = Exclude<CSS.AtRules, '@media'>;
+type CSSAtRules = {
+    [AtRule in AtRulesWithoutMedia as `${AtRule}${string}`]?: Omit<SafeCSSObject, AtRulesWithoutMedia>;
 };
-declare const spaceWrapper: (style: any) => {
-    readonly [uniqueSymbol]: SpaceStyles;
-};
-type XCSS = ReturnType<typeof boxWrapper> | ReturnType<typeof spaceWrapper>;
-type XCSSArray = Array<XCSS | false | undefined>;
-type AllowedBoxStyles = keyof SafeCSSObject;
-type Spacing = 'columnGap' | 'gap' | 'inset' | 'insetBlock' | 'insetBlockEnd' | 'insetBlockStart' | 'insetInline' | 'insetInlineEnd' | 'insetInlineStart' | 'margin' | 'marginBlock' | 'marginBlockEnd' | 'marginBlockStart' | 'marginInline' | 'marginInlineEnd' | 'marginInlineStart' | 'outlineOffset' | 'padding' | 'paddingBlock' | 'paddingBlockEnd' | 'paddingBlockStart' | 'paddingBottom' | 'paddingInline' | 'paddingInlineEnd' | 'paddingInlineStart' | 'paddingLeft' | 'paddingRight' | 'paddingTop' | 'rowGap';
+type SafeCSSObject = CSSPseudos & CSSAtRules & TokenisedProps & CSSMediaQueries & Omit<CSSPropertiesWithMultiValues, keyof TokenisedProps>;
+export type XCSS = ReturnType<typeof xcss>;
 /**
  * ### xcss
  *
@@ -42,18 +35,7 @@ type Spacing = 'columnGap' | 'gap' | 'inset' | 'insetBlock' | 'insetBlockEnd' |
  * })
  * ```
  */
-export declare function xcss<Primitive extends typeof Box | void = typeof Box>(style: Primitive extends typeof Box ? ScopedSafeCSSObject<AllowedBoxStyles> | ScopedSafeCSSObject<AllowedBoxStyles>[] : Primitive extends void ? ScopedSafeCSSObject<Spacing> | ScopedSafeCSSObject<Spacing>[] : never): {
-    readonly [uniqueSymbol]: Primitive extends (<T extends import("react").ElementType<any>>(props: import("../index").BoxProps<T>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | null) & import("react").FC<import("../index").BoxProps<"div">> ? BoxStyles : Primitive extends void ? SpaceStyles : never;
-};
-declare const boxTag: unique symbol;
-declare const spaceTag: unique symbol;
-export type BoxStyles = SerializedStyles & {
-    [boxTag]: true;
-};
-export type SpaceStyles = SerializedStyles & {
-    [spaceTag]: true;
+export declare function xcss(style: SafeCSSObject): {
+    readonly [uniqueSymbol]: SerializedStyles;
 };
-export type BoxXCSS = {
-    readonly [uniqueSymbol]: BoxStyles;
-} | false | undefined;
 export {};

package/dist/types-ts4.5/components/flex.d.ts

@@ -133,5 +133,5 @@ declare const Flex: import("react").MemoExoticComponent<import("react").ForwardR
      * Forwarded ref element
      */
     ref?: any;
-} & BasePrimitiveProps, "gap" | "rowGap" | "columnGap" | "alignItems" | "direction" | "justifyContent" | "as" | "children" | "wrap" | keyof BasePrimitiveProps> & import("react").RefAttributes<any>>>;
+} & BasePrimitiveProps, "gap" | "rowGap" | "columnGap" | "alignItems" | "direction" | "justifyContent" | "wrap" | "as" | "children" | keyof BasePrimitiveProps> & import("react").RefAttributes<any>>>;
 export default Flex;

package/dist/types-ts4.5/components/inline.d.ts

@@ -113,5 +113,5 @@ declare const Inline: import("react").MemoExoticComponent<import("react").Forwar
      * Forwarded ref element
      */
     ref?: any;
-} & BasePrimitiveProps, "as" | "children" | "space" | "separator" | keyof BasePrimitiveProps | "alignInline" | "alignBlock" | "shouldWrap" | "spread" | "grow" | "rowSpace"> & import("react").RefAttributes<any>>>;
+} & BasePrimitiveProps, "space" | "separator" | "as" | "children" | keyof BasePrimitiveProps | "alignInline" | "alignBlock" | "shouldWrap" | "spread" | "grow" | "rowSpace"> & import("react").RefAttributes<any>>>;
 export default Inline;

package/dist/types-ts4.5/components/stack.d.ts

@@ -87,5 +87,5 @@ declare const Stack: import("react").MemoExoticComponent<import("react").Forward
      * Forwarded ref element
      */
     ref?: any;
-} & BasePrimitiveProps, "as" | "children" | "space" | keyof BasePrimitiveProps | "alignInline" | "alignBlock" | "spread" | "grow"> & import("react").RefAttributes<any>>>;
+} & BasePrimitiveProps, "space" | "as" | "children" | keyof BasePrimitiveProps | "alignInline" | "alignBlock" | "spread" | "grow"> & import("react").RefAttributes<any>>>;
 export default Stack;

package/dist/types-ts4.5/components/types.d.ts

@@ -1,18 +1,19 @@
 import type { CSSProperties } from 'react';
-import { type BoxXCSS } from '../xcss/xcss';
+import type { XCSS } from '../xcss/xcss';
 export type BasePrimitiveProps = {
     /**
      * A unique string that appears as data attribute `data-testid` in the rendered code, serving as a hook for automated tests.
      */
     testId?: string;
     /**
-     * Inline styles to be applied to the primitive.
+     * Inline styles to be applied to the primitive. Only apply as a last resort, or where
+     * styles cannot otherwise be calculated outside of the runtime of the component they're applied.
      */
     style?: CSSProperties;
     /**
      * Apply a subset of permitted styles, powered by Atlassian Design System tokens.
      */
-    xcss?: BoxXCSS | BoxXCSS[];
+    xcss?: XCSS | Array<XCSS | false | undefined>;
     /**
      * Accessible role
      */

package/dist/types-ts4.5/xcss/xcss.d.ts

@@ -1,8 +1,6 @@
-/// <reference types="react" />
 import { css as cssEmotion } from '@emotion/react';
 import type { CSSPropertiesWithMultiValues, SerializedStyles } from '@emotion/serialize';
 import type * as CSS from 'csstype';
-import { Box } from '../index';
 import type { MediaQuery } from '../responsive/types';
 import { TokenisedProps } from './style-maps.partial';
 declare const uniqueSymbol: unique symbol;
@@ -11,25 +9,20 @@ declare const uniqueSymbol: unique symbol;
  * @returns a collection of styles that can be applied to the respective primitive
  */
 type ParsedXcss = ReturnType<typeof cssEmotion> | ReturnType<typeof cssEmotion>[];
-export declare const parseXcss: (args: XCSS | XCSSArray) => ParsedXcss;
+export declare const parseXcss: (args: XCSS | (XCSS | false | undefined)[]) => ParsedXcss;
+type AllMedia = MediaQuery | '@media screen and (forced-colors: active), screen and (-ms-high-contrast: active)' | '@media (prefers-color-scheme: dark)' | '@media (prefers-color-scheme: light)' | '@media (prefers-reduced-motion: reduce)';
 type CSSMediaQueries = {
-    [MQ in MediaQuery]?: Omit<SafeCSSObject, MediaQuery>;
+    [MQ in AllMedia]?: Omit<SafeCSSObject, AllMedia>;
 };
 type CSSPseudos = {
-    [Pseudo in CSS.Pseudos]?: Omit<SafeCSSObject, CSS.Pseudos | MediaQuery>;
+    [Pseudo in CSS.Pseudos]?: Omit<SafeCSSObject, CSS.Pseudos | AllMedia>;
 };
-type SafeCSSObject = CSSPseudos & TokenisedProps & CSSMediaQueries & Omit<CSSPropertiesWithMultiValues, keyof TokenisedProps>;
-type ScopedSafeCSSObject<T extends keyof SafeCSSObject> = Pick<SafeCSSObject, T>;
-declare const boxWrapper: (style: any) => {
-    readonly [uniqueSymbol]: BoxStyles;
+type AtRulesWithoutMedia = Exclude<CSS.AtRules, '@media'>;
+type CSSAtRules = {
+    [AtRule in AtRulesWithoutMedia as `${AtRule}${string}`]?: Omit<SafeCSSObject, AtRulesWithoutMedia>;
 };
-declare const spaceWrapper: (style: any) => {
-    readonly [uniqueSymbol]: SpaceStyles;
-};
-type XCSS = ReturnType<typeof boxWrapper> | ReturnType<typeof spaceWrapper>;
-type XCSSArray = Array<XCSS | false | undefined>;
-type AllowedBoxStyles = keyof SafeCSSObject;
-type Spacing = 'columnGap' | 'gap' | 'inset' | 'insetBlock' | 'insetBlockEnd' | 'insetBlockStart' | 'insetInline' | 'insetInlineEnd' | 'insetInlineStart' | 'margin' | 'marginBlock' | 'marginBlockEnd' | 'marginBlockStart' | 'marginInline' | 'marginInlineEnd' | 'marginInlineStart' | 'outlineOffset' | 'padding' | 'paddingBlock' | 'paddingBlockEnd' | 'paddingBlockStart' | 'paddingBottom' | 'paddingInline' | 'paddingInlineEnd' | 'paddingInlineStart' | 'paddingLeft' | 'paddingRight' | 'paddingTop' | 'rowGap';
+type SafeCSSObject = CSSPseudos & CSSAtRules & TokenisedProps & CSSMediaQueries & Omit<CSSPropertiesWithMultiValues, keyof TokenisedProps>;
+export type XCSS = ReturnType<typeof xcss>;
 /**
  * ### xcss
  *
@@ -42,18 +35,7 @@ type Spacing = 'columnGap' | 'gap' | 'inset' | 'insetBlock' | 'insetBlockEnd' |
  * })
  * ```
  */
-export declare function xcss<Primitive extends typeof Box | void = typeof Box>(style: Primitive extends typeof Box ? ScopedSafeCSSObject<AllowedBoxStyles> | ScopedSafeCSSObject<AllowedBoxStyles>[] : Primitive extends void ? ScopedSafeCSSObject<Spacing> | ScopedSafeCSSObject<Spacing>[] : never): {
-    readonly [uniqueSymbol]: Primitive extends (<T extends import("react").ElementType<any>>(props: import("../index").BoxProps<T>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | null) & import("react").FC<import("../index").BoxProps<"div">> ? BoxStyles : Primitive extends void ? SpaceStyles : never;
-};
-declare const boxTag: unique symbol;
-declare const spaceTag: unique symbol;
-export type BoxStyles = SerializedStyles & {
-    [boxTag]: true;
-};
-export type SpaceStyles = SerializedStyles & {
-    [spaceTag]: true;
+export declare function xcss(style: SafeCSSObject): {
+    readonly [uniqueSymbol]: SerializedStyles;
 };
-export type BoxXCSS = {
-    readonly [uniqueSymbol]: BoxStyles;
-} | false | undefined;
 export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/primitives",
-  "version": "1.0.8",
+  "version": "1.0.10",
   "description": "Primitives are token-backed low-level building blocks.",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
@@ -22,7 +22,7 @@
       "category": "Primitives",
       "name": "Primitives",
       "status": {
-        "type": "closed-beta"
+        "type": "beta"
       },
       "pages": [
         {
@@ -31,7 +31,7 @@
           "folder": "overview",
           "slug": "primitives/overview",
           "status": {
-            "type": "closed-beta"
+            "type": "beta"
           }
         },
         {
@@ -40,7 +40,7 @@
           "slug": "primitives/box",
           "id": "@atlaskit/primitives/box",
           "status": {
-            "type": "closed-beta"
+            "type": "beta"
           }
         },
         {
@@ -49,7 +49,7 @@
           "slug": "primitives/inline",
           "id": "@atlaskit/primitives/inline",
           "status": {
-            "type": "closed-beta"
+            "type": "beta"
           }
         },
         {
@@ -58,7 +58,7 @@
           "slug": "primitives/stack",
           "id": "@atlaskit/primitives/stack",
           "status": {
-            "type": "closed-beta"
+            "type": "beta"
           }
         },
         {
@@ -67,7 +67,7 @@
           "slug": "primitives/flex",
           "id": "@atlaskit/primitives/flex",
           "status": {
-            "type": "closed-beta"
+            "type": "beta"
           }
         },
         {
@@ -76,7 +76,7 @@
           "slug": "primitives/grid",
           "id": "@atlaskit/primitives/grid",
           "status": {
-            "type": "closed-beta"
+            "type": "beta"
           }
         },
         {
@@ -85,16 +85,16 @@
           "slug": "primitives/bleed",
           "id": "@atlaskit/primitives/bleed",
           "status": {
-            "type": "closed-beta"
+            "type": "beta"
           }
         },
         {
-          "title": "xCSS",
+          "title": "xcss",
           "folder": "xcss",
           "slug": "primitives/xcss",
           "id": "@atlaskit/primitives/xcss",
           "status": {
-            "type": "closed-beta"
+            "type": "beta"
           }
         },
         {
@@ -103,7 +103,7 @@
           "slug": "primitives/responsive",
           "id": "@atlaskit/primitives/responsive",
           "status": {
-            "type": "closed-beta"
+            "type": "beta"
           }
         }
       ]
@@ -114,7 +114,7 @@
   },
   "dependencies": {
     "@atlaskit/focus-ring": "^1.3.0",
-    "@atlaskit/tokens": "^1.13.0",
+    "@atlaskit/tokens": "^1.14.0",
     "@babel/runtime": "^7.0.0",
     "@emotion/react": "^11.7.1",
     "@emotion/serialize": "^1.1.0",
@@ -181,4 +181,4 @@
     "./responsive": "./src/responsive/index.tsx"
   },
   "prettier": "@atlassian/atlassian-frontend-prettier-config-1.0.0"
-}
+}

package/report.api.md

@@ -15,8 +15,6 @@
 <!--SECTION START: Main Entry Types-->
 
 ```ts
-/// <reference types="react" />
-
 import { ComponentPropsWithoutRef } from 'react';
 import { ComponentPropsWithRef } from 'react';
 import type * as CSS_2 from 'csstype';
@@ -26,7 +24,6 @@ import { ElementType } from 'react';
 import { FC } from 'react';
 import { ForwardRefExoticComponent } from 'react';
 import { jsx } from '@emotion/react';
-import { JSXElementConstructor } from 'react';
 import { MemoExoticComponent } from 'react';
 import { ReactElement } from 'react';
 import { ReactNode } from 'react';
@@ -84,7 +81,15 @@ const alignItemsMap_2: {
 };
 
 // @public (undocumented)
-type AllowedBoxStyles = keyof SafeCSSObject;
+type AllMedia =
+  | '@media (prefers-color-scheme: dark)'
+  | '@media (prefers-color-scheme: light)'
+  | '@media (prefers-reduced-motion: reduce)'
+  | '@media screen and (forced-colors: active), screen and (-ms-high-contrast: active)'
+  | MediaQuery;
+
+// @public (undocumented)
+type AtRulesWithoutMedia = Exclude<CSS_2.AtRules, '@media'>;
 
 // @public (undocumented)
 type AutoComplete<T extends string> = Omit<string, T> | T;
@@ -241,7 +246,7 @@ type BaseBoxPropsFoundation<T extends ElementType> = {
 type BasePrimitiveProps = {
   testId?: string;
   style?: CSSProperties;
-  xcss?: BoxXCSS | BoxXCSS[];
+  xcss?: Array<XCSS | false | undefined> | XCSS;
   role?: string;
 };
 
@@ -337,22 +342,6 @@ export type BoxProps<T extends ElementType> = Omit<
   BasePrimitiveProps &
   BaseBoxPropsFoundation<T>;
 
-// @public (undocumented)
-type BoxStyles = SerializedStyles & {
-  [boxTag]: true;
-};
-
-// @public (undocumented)
-const boxTag: unique symbol;
-
-// @public (undocumented)
-type BoxXCSS =
-  | false
-  | undefined
-  | {
-      readonly [uniqueSymbol]: BoxStyles;
-    };
-
 // @public
 export type Breakpoint = 'lg' | 'md' | 'sm' | 'xl' | 'xs' | 'xxs';
 
@@ -361,14 +350,22 @@ type ClassName = {
   className?: string;
 };
 
+// @public (undocumented)
+type CSSAtRules = {
+  [AtRule in AtRulesWithoutMedia as `${AtRule}${string}`]?: Omit<
+    SafeCSSObject,
+    AtRulesWithoutMedia
+  >;
+};
+
 // @public (undocumented)
 type CSSMediaQueries = {
-  [MQ in MediaQuery]?: Omit<SafeCSSObject, MediaQuery>;
+  [MQ in AllMedia]?: Omit<SafeCSSObject, AllMedia>;
 };
 
 // @public (undocumented)
 type CSSPseudos = {
-  [Pseudo in CSS_2.Pseudos]?: Omit<SafeCSSObject, CSS_2.Pseudos | MediaQuery>;
+  [Pseudo in CSS_2.Pseudos]?: Omit<SafeCSSObject, AllMedia | CSS_2.Pseudos>;
 };
 
 // @public (undocumented)
@@ -815,16 +812,11 @@ export type PressableProps = Omit<
 
 // @public (undocumented)
 type SafeCSSObject = CSSPseudos &
+  CSSAtRules &
   TokenisedProps &
   CSSMediaQueries &
   Omit<CSSPropertiesWithMultiValues, keyof TokenisedProps>;
 
-// @public (undocumented)
-type ScopedSafeCSSObject<T extends keyof SafeCSSObject> = Pick<
-  SafeCSSObject,
-  T
->;
-
 // @public (undocumented)
 export type Shadow = keyof typeof shadowMap;
 
@@ -866,46 +858,6 @@ const spaceMap: {
   'space.1000': 'var(--ds-space-1000)';
 };
 
-// @public (undocumented)
-type SpaceStyles = SerializedStyles & {
-  [spaceTag]: true;
-};
-
-// @public (undocumented)
-const spaceTag: unique symbol;
-
-// @public (undocumented)
-type Spacing =
-  | 'columnGap'
-  | 'gap'
-  | 'inset'
-  | 'insetBlock'
-  | 'insetBlockEnd'
-  | 'insetBlockStart'
-  | 'insetInline'
-  | 'insetInlineEnd'
-  | 'insetInlineStart'
-  | 'margin'
-  | 'marginBlock'
-  | 'marginBlockEnd'
-  | 'marginBlockStart'
-  | 'marginInline'
-  | 'marginInlineEnd'
-  | 'marginInlineStart'
-  | 'outlineOffset'
-  | 'padding'
-  | 'paddingBlock'
-  | 'paddingBlockEnd'
-  | 'paddingBlockStart'
-  | 'paddingBottom'
-  | 'paddingInline'
-  | 'paddingInlineEnd'
-  | 'paddingInlineStart'
-  | 'paddingLeft'
-  | 'paddingRight'
-  | 'paddingTop'
-  | 'rowGap';
-
 // @public (undocumented)
 type Spread = 'space-between';
 
@@ -1126,24 +1078,12 @@ export const UNSAFE_media: {
 // @public (undocumented)
 type Wrap = keyof typeof flexWrapMap;
 
+// @public (undocumented)
+type XCSS = ReturnType<typeof xcss>;
+
 // @public
-export function xcss<Primitive extends typeof Box | void = typeof Box>(
-  style: Primitive extends typeof Box
-    ?
-        | ScopedSafeCSSObject<AllowedBoxStyles>
-        | ScopedSafeCSSObject<AllowedBoxStyles>[]
-    : Primitive extends void
-    ? ScopedSafeCSSObject<Spacing> | ScopedSafeCSSObject<Spacing>[]
-    : never,
-): {
-  readonly [uniqueSymbol]: Primitive extends (<T extends ElementType<any>>(
-    props: BoxProps<T>,
-  ) => ReactElement<any, JSXElementConstructor<any> | string> | null) &
-    FC<BoxProps<'div'>>
-    ? BoxStyles
-    : Primitive extends void
-    ? SpaceStyles
-    : never;
+export function xcss(style: SafeCSSObject): {
+  readonly [uniqueSymbol]: SerializedStyles;
 };
 
 // (No @packageDocumentation comment for this package)

package/tmp/api-report-tmp.d.ts

@@ -4,8 +4,6 @@
 
 ```ts
 
-/// <reference types="react" />
-
 import { ComponentPropsWithoutRef } from 'react';
 import { ComponentPropsWithRef } from 'react';
 import type * as CSS_2 from 'csstype';
@@ -15,7 +13,6 @@ import { ElementType } from 'react';
 import { FC } from 'react';
 import { ForwardRefExoticComponent } from 'react';
 import { jsx } from '@emotion/react';
-import { JSXElementConstructor } from 'react';
 import { MemoExoticComponent } from 'react';
 import { ReactElement } from 'react';
 import { ReactNode } from 'react';
@@ -73,7 +70,10 @@ const alignItemsMap_2: {
 };
 
 // @public (undocumented)
-type AllowedBoxStyles = keyof SafeCSSObject;
+type AllMedia = '@media (prefers-color-scheme: dark)' | '@media (prefers-color-scheme: light)' | '@media (prefers-reduced-motion: reduce)' | '@media screen and (forced-colors: active), screen and (-ms-high-contrast: active)' | MediaQuery;
+
+// @public (undocumented)
+type AtRulesWithoutMedia = Exclude<CSS_2.AtRules, '@media'>;
 
 // @public (undocumented)
 type AutoComplete<T extends string> = Omit<string, T> | T;
@@ -224,7 +224,7 @@ type BaseBoxPropsFoundation<T extends ElementType> = {
 type BasePrimitiveProps = {
     testId?: string;
     style?: CSSProperties;
-    xcss?: BoxXCSS | BoxXCSS[];
+    xcss?: Array<XCSS | false | undefined> | XCSS;
     role?: string;
 };
 
@@ -303,19 +303,6 @@ type BoxComponent<T extends ElementType = 'div'> = (<T extends ElementType>(prop
 // @public (undocumented)
 export type BoxProps<T extends ElementType> = Omit<ComponentPropsWithoutRef<T>, 'as' | 'className'> & BasePrimitiveProps & BaseBoxPropsFoundation<T>;
 
-// @public (undocumented)
-type BoxStyles = SerializedStyles & {
-    [boxTag]: true;
-};
-
-// @public (undocumented)
-const boxTag: unique symbol;
-
-// @public (undocumented)
-type BoxXCSS = false | undefined | {
-    readonly [uniqueSymbol]: BoxStyles;
-};
-
 // @public
 export type Breakpoint = 'lg' | 'md' | 'sm' | 'xl' | 'xs' | 'xxs';
 
@@ -324,14 +311,19 @@ type ClassName = {
     className?: string;
 };
 
+// @public (undocumented)
+type CSSAtRules = {
+    [AtRule in AtRulesWithoutMedia as `${AtRule}${string}`]?: Omit<SafeCSSObject, AtRulesWithoutMedia>;
+};
+
 // @public (undocumented)
 type CSSMediaQueries = {
-    [MQ in MediaQuery]?: Omit<SafeCSSObject, MediaQuery>;
+    [MQ in AllMedia]?: Omit<SafeCSSObject, AllMedia>;
 };
 
 // @public (undocumented)
 type CSSPseudos = {
-    [Pseudo in CSS_2.Pseudos]?: Omit<SafeCSSObject, CSS_2.Pseudos | MediaQuery>;
+    [Pseudo in CSS_2.Pseudos]?: Omit<SafeCSSObject, AllMedia | CSS_2.Pseudos>;
 };
 
 // @public (undocumented)
@@ -558,10 +550,7 @@ export type PressableProps = Omit<BaseBoxProps<'button'>, 'as' | 'children' | 'd
 };
 
 // @public (undocumented)
-type SafeCSSObject = CSSPseudos & TokenisedProps & CSSMediaQueries & Omit<CSSPropertiesWithMultiValues, keyof TokenisedProps>;
-
-// @public (undocumented)
-type ScopedSafeCSSObject<T extends keyof SafeCSSObject> = Pick<SafeCSSObject, T>;
+type SafeCSSObject = CSSPseudos & CSSAtRules & TokenisedProps & CSSMediaQueries & Omit<CSSPropertiesWithMultiValues, keyof TokenisedProps>;
 
 // @public (undocumented)
 export type Shadow = keyof typeof shadowMap;
@@ -599,17 +588,6 @@ const spaceMap: {
     'space.1000': "var(--ds-space-1000)";
 };
 
-// @public (undocumented)
-type SpaceStyles = SerializedStyles & {
-    [spaceTag]: true;
-};
-
-// @public (undocumented)
-const spaceTag: unique symbol;
-
-// @public (undocumented)
-type Spacing = 'columnGap' | 'gap' | 'inset' | 'insetBlock' | 'insetBlockEnd' | 'insetBlockStart' | 'insetInline' | 'insetInlineEnd' | 'insetInlineStart' | 'margin' | 'marginBlock' | 'marginBlockEnd' | 'marginBlockStart' | 'marginInline' | 'marginInlineEnd' | 'marginInlineStart' | 'outlineOffset' | 'padding' | 'paddingBlock' | 'paddingBlockEnd' | 'paddingBlockStart' | 'paddingBottom' | 'paddingInline' | 'paddingInlineEnd' | 'paddingInlineStart' | 'paddingLeft' | 'paddingRight' | 'paddingTop' | 'rowGap';
-
 // @public (undocumented)
 type Spread = 'space-between';
 
@@ -800,9 +778,12 @@ export const UNSAFE_media: {
 // @public (undocumented)
 type Wrap = keyof typeof flexWrapMap;
 
+// @public (undocumented)
+type XCSS = ReturnType<typeof xcss>;
+
 // @public
-export function xcss<Primitive extends typeof Box | void = typeof Box>(style: Primitive extends typeof Box ? ScopedSafeCSSObject<AllowedBoxStyles> | ScopedSafeCSSObject<AllowedBoxStyles>[] : Primitive extends void ? ScopedSafeCSSObject<Spacing> | ScopedSafeCSSObject<Spacing>[] : never): {
-    readonly [uniqueSymbol]: Primitive extends (<T extends ElementType<any>>(props: BoxProps<T>) => ReactElement<any, JSXElementConstructor<any>| string> | null) & FC<BoxProps<"div">> ? BoxStyles : Primitive extends void ? SpaceStyles : never;
+export function xcss(style: SafeCSSObject): {
+    readonly [uniqueSymbol]: SerializedStyles;
 };
 
 // (No @packageDocumentation comment for this package)

package/constellation/accessibility/examples.mdx

@@ -1,9 +0,0 @@
----
-title: Accessibility
-description: Primitives accessibility.
-order: 0
----
-
-## Default
-
-This is placeholder text.