@atlaskit/primitives 0.12.5 → 0.12.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -1,5 +1,11 @@
1
1
  # @atlaskit/primitives
2
2
 
3
+ ## 0.12.6
4
+
5
+ ### Patch Changes
6
+
7
+ - [`3be327cdd6a`](https://bitbucket.org/atlassian/atlassian-frontend/commits/3be327cdd6a) - Allow styles to be applied to Inline through xcss.
8
+
3
9
  ## 0.12.5
4
10
 
5
11
  ### Patch Changes
@@ -7,6 +7,7 @@ exports.default = void 0;
7
7
  var _react = require("react");
8
8
  var _react2 = require("@emotion/react");
9
9
  var _styleMaps = require("../xcss/style-maps.partial");
10
+ var _xcss = require("../xcss/xcss");
10
11
  /* eslint-disable @repo/internal/styles/no-exported-styles */
11
12
  /** @jsx jsx */
12
13
 
@@ -99,6 +100,7 @@ var Inline = /*#__PURE__*/(0, _react.memo)( /*#__PURE__*/(0, _react.forwardRef)(
99
100
  space = _ref2.space,
100
101
  rowSpace = _ref2.rowSpace,
101
102
  separator = _ref2.separator,
103
+ xcss = _ref2.xcss,
102
104
  testId = _ref2.testId,
103
105
  rawChildren = _ref2.children;
104
106
  var Component = as || 'div';
@@ -109,8 +111,11 @@ var Inline = /*#__PURE__*/(0, _react.memo)( /*#__PURE__*/(0, _react.forwardRef)(
109
111
  }, separator && index > 0 ? separatorComponent : null, child);
110
112
  }) : rawChildren;
111
113
  var justifyContent = spread || alignInline;
114
+ var className = xcss && (0, _xcss.parseXcss)(xcss);
112
115
  return (0, _react2.jsx)(Component, {
113
- css: [baseStyles, space && _styleMaps.spaceStylesMap.gap[space], justifyContent && justifyContentMap[justifyContent], grow && flexGrowMap[grow], alignItems && alignItemsMap[alignItems], shouldWrap && flexWrapStyles, rowSpace && _styleMaps.spaceStylesMap.rowGap[rowSpace]],
116
+ css: [
117
+ // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage
118
+ className, baseStyles, space && _styleMaps.spaceStylesMap.gap[space], justifyContent && justifyContentMap[justifyContent], grow && flexGrowMap[grow], alignItems && alignItemsMap[alignItems], shouldWrap && flexWrapStyles, rowSpace && _styleMaps.spaceStylesMap.rowGap[rowSpace]],
114
119
  "data-testid": testId,
115
120
  ref: ref
116
121
  }, children);
@@ -1,5 +1,5 @@
1
1
  {
2
2
  "name": "@atlaskit/primitives",
3
- "version": "0.12.5",
3
+ "version": "0.12.6",
4
4
  "sideEffects": false
5
5
  }
@@ -3,6 +3,7 @@
3
3
  import { Children, forwardRef, Fragment, memo } from 'react';
4
4
  import { css, jsx } from '@emotion/react';
5
5
  import { spaceStylesMap } from '../xcss/style-maps.partial';
6
+ import { parseXcss } from '../xcss/xcss';
6
7
  const alignItemsMap = {
7
8
  center: css({
8
9
  alignItems: 'center'
@@ -89,6 +90,7 @@ const Inline = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(({
89
90
  space,
90
91
  rowSpace,
91
92
  separator,
93
+ xcss,
92
94
  testId,
93
95
  children: rawChildren
94
96
  }, ref) => {
@@ -100,8 +102,11 @@ const Inline = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(({
100
102
  }, separator && index > 0 ? separatorComponent : null, child);
101
103
  }) : rawChildren;
102
104
  const justifyContent = spread || alignInline;
105
+ const className = xcss && parseXcss(xcss);
103
106
  return jsx(Component, {
104
- css: [baseStyles, space && spaceStylesMap.gap[space], justifyContent && justifyContentMap[justifyContent], grow && flexGrowMap[grow], alignItems && alignItemsMap[alignItems], shouldWrap && flexWrapStyles, rowSpace && spaceStylesMap.rowGap[rowSpace]],
107
+ css: [
108
+ // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage
109
+ className, baseStyles, space && spaceStylesMap.gap[space], justifyContent && justifyContentMap[justifyContent], grow && flexGrowMap[grow], alignItems && alignItemsMap[alignItems], shouldWrap && flexWrapStyles, rowSpace && spaceStylesMap.rowGap[rowSpace]],
105
110
  "data-testid": testId,
106
111
  ref: ref
107
112
  }, children);
@@ -1,5 +1,5 @@
1
1
  {
2
2
  "name": "@atlaskit/primitives",
3
- "version": "0.12.5",
3
+ "version": "0.12.6",
4
4
  "sideEffects": false
5
5
  }
@@ -3,6 +3,7 @@
3
3
  import { Children, forwardRef, Fragment, memo } from 'react';
4
4
  import { css, jsx } from '@emotion/react';
5
5
  import { spaceStylesMap } from '../xcss/style-maps.partial';
6
+ import { parseXcss } from '../xcss/xcss';
6
7
  var alignItemsMap = {
7
8
  center: css({
8
9
  alignItems: 'center'
@@ -92,6 +93,7 @@ var Inline = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function (_ref2, ref) {
92
93
  space = _ref2.space,
93
94
  rowSpace = _ref2.rowSpace,
94
95
  separator = _ref2.separator,
96
+ xcss = _ref2.xcss,
95
97
  testId = _ref2.testId,
96
98
  rawChildren = _ref2.children;
97
99
  var Component = as || 'div';
@@ -102,8 +104,11 @@ var Inline = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function (_ref2, ref) {
102
104
  }, separator && index > 0 ? separatorComponent : null, child);
103
105
  }) : rawChildren;
104
106
  var justifyContent = spread || alignInline;
107
+ var className = xcss && parseXcss(xcss);
105
108
  return jsx(Component, {
106
- css: [baseStyles, space && spaceStylesMap.gap[space], justifyContent && justifyContentMap[justifyContent], grow && flexGrowMap[grow], alignItems && alignItemsMap[alignItems], shouldWrap && flexWrapStyles, rowSpace && spaceStylesMap.rowGap[rowSpace]],
109
+ css: [
110
+ // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage
111
+ className, baseStyles, space && spaceStylesMap.gap[space], justifyContent && justifyContentMap[justifyContent], grow && flexGrowMap[grow], alignItems && alignItemsMap[alignItems], shouldWrap && flexWrapStyles, rowSpace && spaceStylesMap.rowGap[rowSpace]],
107
112
  "data-testid": testId,
108
113
  ref: ref
109
114
  }, children);
@@ -1,5 +1,5 @@
1
1
  {
2
2
  "name": "@atlaskit/primitives",
3
- "version": "0.12.5",
3
+ "version": "0.12.6",
4
4
  "sideEffects": false
5
5
  }
@@ -1,6 +1,7 @@
1
1
  /** @jsx jsx */
2
2
  import { ElementType, ReactNode } from 'react';
3
3
  import { type Space } from '../xcss/style-maps.partial';
4
+ import { type InlineXCSS } from '../xcss/xcss';
4
5
  export interface InlineProps<T extends ElementType = 'div'> {
5
6
  /**
6
7
  * The DOM element to render as the Inline. Defaults to `div`.
@@ -39,6 +40,10 @@ export interface InlineProps<T extends ElementType = 'div'> {
39
40
  * Renders a separator string between each child.
40
41
  */
41
42
  separator?: string;
43
+ /**
44
+ * Safe subset of styles that can be applied as a classname.
45
+ */
46
+ xcss?: InlineXCSS | Array<InlineXCSS | false | undefined>;
42
47
  /**
43
48
  * A unique string that appears as data attribute data-testid in the rendered code, serving as a hook for automated tests.
44
49
  */
@@ -71,5 +76,5 @@ export type Grow = 'hug' | 'fill';
71
76
  * ```
72
77
  *
73
78
  */
74
- declare const Inline: import("react").MemoExoticComponent<import("react").ForwardRefExoticComponent<Pick<InlineProps<ElementType<any>>, "as" | "children" | "testId" | "alignInline" | "alignBlock" | "shouldWrap" | "spread" | "grow" | "space" | "rowSpace" | "separator"> & import("react").RefAttributes<any>>>;
79
+ declare const Inline: import("react").MemoExoticComponent<import("react").ForwardRefExoticComponent<Pick<InlineProps<ElementType<any>>, "as" | "children" | "testId" | "alignInline" | "alignBlock" | "shouldWrap" | "spread" | "grow" | "space" | "rowSpace" | "separator" | "xcss"> & import("react").RefAttributes<any>>>;
75
80
  export default Inline;
@@ -28,7 +28,7 @@ declare const inlineWrapper: (style: any) => {
28
28
  };
29
29
  type XCSS = ReturnType<typeof boxWrapper> | ReturnType<typeof inlineWrapper>;
30
30
  type AllowedBoxStyles = keyof SafeCSSObject;
31
- type AllowedInlineStyles = 'backgroundColor' | 'padding';
31
+ type Spacing = 'columnGap' | 'gap' | 'inset' | 'insetBlock' | 'insetBlockEnd' | 'insetBlockStart' | 'insetInline' | 'insetInlineEnd' | 'insetInlineStart' | 'outlineOffset' | 'padding' | 'paddingBlock' | 'paddingBlockEnd' | 'paddingBlockStart' | 'paddingBottom' | 'paddingInline' | 'paddingInlineEnd' | 'paddingInlineStart' | 'paddingLeft' | 'paddingRight' | 'paddingTop' | 'rowGap';
32
32
  /**
33
33
  * ### xcss
34
34
  *
@@ -41,8 +41,8 @@ type AllowedInlineStyles = 'backgroundColor' | 'padding';
41
41
  * })
42
42
  * ```
43
43
  */
44
- export declare function xcss<Primitive extends typeof Box | typeof Inline = typeof Box>(style: Primitive extends typeof Box ? ScopedSafeCSSObject<AllowedBoxStyles> | ScopedSafeCSSObject<AllowedBoxStyles>[] : Primitive extends typeof Inline ? ScopedSafeCSSObject<AllowedInlineStyles> | ScopedSafeCSSObject<AllowedInlineStyles>[] : never): {
45
- readonly [uniqueSymbol]: Primitive extends (<T extends import("react").ElementType<any> = "div">(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 import("react").MemoExoticComponent<import("react").ForwardRefExoticComponent<Pick<import("../index").InlineProps<import("react").ElementType<any>>, "as" | "children" | "testId" | "alignInline" | "alignBlock" | "shouldWrap" | "spread" | "grow" | "space" | "rowSpace" | "separator"> & import("react").RefAttributes<any>>> ? InlineStyles : never;
44
+ export declare function xcss<Primitive extends typeof Box | typeof Inline = typeof Box>(style: Primitive extends typeof Box ? ScopedSafeCSSObject<AllowedBoxStyles> | ScopedSafeCSSObject<AllowedBoxStyles>[] : Primitive extends typeof Inline ? ScopedSafeCSSObject<Spacing> | ScopedSafeCSSObject<Spacing>[] : never): {
45
+ readonly [uniqueSymbol]: Primitive extends (<T extends import("react").ElementType<any> = "div">(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 import("react").MemoExoticComponent<import("react").ForwardRefExoticComponent<Pick<import("../index").InlineProps<import("react").ElementType<any>>, "as" | "children" | "testId" | "alignInline" | "alignBlock" | "shouldWrap" | "spread" | "grow" | "space" | "rowSpace" | "separator" | "xcss"> & import("react").RefAttributes<any>>> ? InlineStyles : never;
46
46
  };
47
47
  declare const boxTag: unique symbol;
48
48
  export type BoxStyles = SerializedStyles & {
@@ -1,6 +1,7 @@
1
1
  /** @jsx jsx */
2
2
  import { ElementType, ReactNode } from 'react';
3
3
  import { type Space } from '../xcss/style-maps.partial';
4
+ import { type InlineXCSS } from '../xcss/xcss';
4
5
  export interface InlineProps<T extends ElementType = 'div'> {
5
6
  /**
6
7
  * The DOM element to render as the Inline. Defaults to `div`.
@@ -39,6 +40,10 @@ export interface InlineProps<T extends ElementType = 'div'> {
39
40
  * Renders a separator string between each child.
40
41
  */
41
42
  separator?: string;
43
+ /**
44
+ * Safe subset of styles that can be applied as a classname.
45
+ */
46
+ xcss?: InlineXCSS | Array<InlineXCSS | false | undefined>;
42
47
  /**
43
48
  * A unique string that appears as data attribute data-testid in the rendered code, serving as a hook for automated tests.
44
49
  */
@@ -71,5 +76,5 @@ export type Grow = 'hug' | 'fill';
71
76
  * ```
72
77
  *
73
78
  */
74
- declare const Inline: import("react").MemoExoticComponent<import("react").ForwardRefExoticComponent<Pick<InlineProps<ElementType<any>>, "as" | "children" | "testId" | "alignInline" | "alignBlock" | "shouldWrap" | "spread" | "grow" | "space" | "rowSpace" | "separator"> & import("react").RefAttributes<any>>>;
79
+ declare const Inline: import("react").MemoExoticComponent<import("react").ForwardRefExoticComponent<Pick<InlineProps<ElementType<any>>, "as" | "children" | "testId" | "alignInline" | "alignBlock" | "shouldWrap" | "spread" | "grow" | "space" | "rowSpace" | "separator" | "xcss"> & import("react").RefAttributes<any>>>;
75
80
  export default Inline;
@@ -28,7 +28,7 @@ declare const inlineWrapper: (style: any) => {
28
28
  };
29
29
  type XCSS = ReturnType<typeof boxWrapper> | ReturnType<typeof inlineWrapper>;
30
30
  type AllowedBoxStyles = keyof SafeCSSObject;
31
- type AllowedInlineStyles = 'backgroundColor' | 'padding';
31
+ type Spacing = 'columnGap' | 'gap' | 'inset' | 'insetBlock' | 'insetBlockEnd' | 'insetBlockStart' | 'insetInline' | 'insetInlineEnd' | 'insetInlineStart' | 'outlineOffset' | 'padding' | 'paddingBlock' | 'paddingBlockEnd' | 'paddingBlockStart' | 'paddingBottom' | 'paddingInline' | 'paddingInlineEnd' | 'paddingInlineStart' | 'paddingLeft' | 'paddingRight' | 'paddingTop' | 'rowGap';
32
32
  /**
33
33
  * ### xcss
34
34
  *
@@ -41,8 +41,8 @@ type AllowedInlineStyles = 'backgroundColor' | 'padding';
41
41
  * })
42
42
  * ```
43
43
  */
44
- export declare function xcss<Primitive extends typeof Box | typeof Inline = typeof Box>(style: Primitive extends typeof Box ? ScopedSafeCSSObject<AllowedBoxStyles> | ScopedSafeCSSObject<AllowedBoxStyles>[] : Primitive extends typeof Inline ? ScopedSafeCSSObject<AllowedInlineStyles> | ScopedSafeCSSObject<AllowedInlineStyles>[] : never): {
45
- readonly [uniqueSymbol]: Primitive extends (<T extends import("react").ElementType<any> = "div">(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 import("react").MemoExoticComponent<import("react").ForwardRefExoticComponent<Pick<import("../index").InlineProps<import("react").ElementType<any>>, "as" | "children" | "testId" | "alignInline" | "alignBlock" | "shouldWrap" | "spread" | "grow" | "space" | "rowSpace" | "separator"> & import("react").RefAttributes<any>>> ? InlineStyles : never;
44
+ export declare function xcss<Primitive extends typeof Box | typeof Inline = typeof Box>(style: Primitive extends typeof Box ? ScopedSafeCSSObject<AllowedBoxStyles> | ScopedSafeCSSObject<AllowedBoxStyles>[] : Primitive extends typeof Inline ? ScopedSafeCSSObject<Spacing> | ScopedSafeCSSObject<Spacing>[] : never): {
45
+ readonly [uniqueSymbol]: Primitive extends (<T extends import("react").ElementType<any> = "div">(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 import("react").MemoExoticComponent<import("react").ForwardRefExoticComponent<Pick<import("../index").InlineProps<import("react").ElementType<any>>, "as" | "children" | "testId" | "alignInline" | "alignBlock" | "shouldWrap" | "spread" | "grow" | "space" | "rowSpace" | "separator" | "xcss"> & import("react").RefAttributes<any>>> ? InlineStyles : never;
46
46
  };
47
47
  declare const boxTag: unique symbol;
48
48
  export type BoxStyles = SerializedStyles & {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/primitives",
3
- "version": "0.12.5",
3
+ "version": "0.12.6",
4
4
  "description": "Primitives are token-backed low-level building blocks.",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
package/report.api.md CHANGED
@@ -58,9 +58,6 @@ const alignSelfMap: {
58
58
  // @public (undocumented)
59
59
  type AllowedBoxStyles = keyof SafeCSSObject;
60
60
 
61
- // @public (undocumented)
62
- type AllowedInlineStyles = 'backgroundColor' | 'padding';
63
-
64
61
  // @public (undocumented)
65
62
  type As =
66
63
  | 'article'
@@ -456,6 +453,7 @@ export const Inline: MemoExoticComponent<
456
453
  | 'space'
457
454
  | 'spread'
458
455
  | 'testId'
456
+ | 'xcss'
459
457
  > &
460
458
  RefAttributes<any>
461
459
  >
@@ -475,6 +473,7 @@ export interface InlineProps<T extends ElementType = 'div'> {
475
473
  space?: Space;
476
474
  spread?: Spread;
477
475
  testId?: string;
476
+ xcss?: Array<InlineXCSS | false | undefined> | InlineXCSS;
478
477
  }
479
478
 
480
479
  // @public (undocumented)
@@ -488,6 +487,11 @@ type InlineStyles = SerializedStyles & {
488
487
  // @public (undocumented)
489
488
  const inlineTag: unique symbol;
490
489
 
490
+ // @public (undocumented)
491
+ type InlineXCSS = {
492
+ readonly [uniqueSymbol]: InlineStyles;
493
+ };
494
+
491
495
  // @public (undocumented)
492
496
  type Layer = keyof typeof layerMap;
493
497
 
@@ -627,6 +631,31 @@ const spaceMap: {
627
631
  'space.1000': 'var(--ds-space-1000)';
628
632
  };
629
633
 
634
+ // @public (undocumented)
635
+ type Spacing =
636
+ | 'columnGap'
637
+ | 'gap'
638
+ | 'inset'
639
+ | 'insetBlock'
640
+ | 'insetBlockEnd'
641
+ | 'insetBlockStart'
642
+ | 'insetInline'
643
+ | 'insetInlineEnd'
644
+ | 'insetInlineStart'
645
+ | 'outlineOffset'
646
+ | 'padding'
647
+ | 'paddingBlock'
648
+ | 'paddingBlockEnd'
649
+ | 'paddingBlockStart'
650
+ | 'paddingBottom'
651
+ | 'paddingInline'
652
+ | 'paddingInlineEnd'
653
+ | 'paddingInlineStart'
654
+ | 'paddingLeft'
655
+ | 'paddingRight'
656
+ | 'paddingTop'
657
+ | 'rowGap';
658
+
630
659
  // @public (undocumented)
631
660
  type Spread = 'space-between';
632
661
 
@@ -800,9 +829,7 @@ export function xcss<Primitive extends typeof Box | typeof Inline = typeof Box>(
800
829
  | ScopedSafeCSSObject<AllowedBoxStyles>
801
830
  | ScopedSafeCSSObject<AllowedBoxStyles>[]
802
831
  : Primitive extends typeof Inline
803
- ?
804
- | ScopedSafeCSSObject<AllowedInlineStyles>
805
- | ScopedSafeCSSObject<AllowedInlineStyles>[]
832
+ ? ScopedSafeCSSObject<Spacing> | ScopedSafeCSSObject<Spacing>[]
806
833
  : never,
807
834
  ): {
808
835
  readonly [uniqueSymbol]: Primitive extends (<
@@ -827,6 +854,7 @@ export function xcss<Primitive extends typeof Box | typeof Inline = typeof Box>(
827
854
  | 'space'
828
855
  | 'spread'
829
856
  | 'testId'
857
+ | 'xcss'
830
858
  > &
831
859
  RefAttributes<any>
832
860
  >
@@ -47,9 +47,6 @@ const alignSelfMap: {
47
47
  // @public (undocumented)
48
48
  type AllowedBoxStyles = keyof SafeCSSObject;
49
49
 
50
- // @public (undocumented)
51
- type AllowedInlineStyles = 'backgroundColor' | 'padding';
52
-
53
50
  // @public (undocumented)
54
51
  type As = 'article' | 'aside' | 'dialog' | 'div' | 'footer' | 'header' | 'li' | 'main' | 'nav' | 'ol' | 'section' | 'span' | 'ul';
55
52
 
@@ -403,7 +400,7 @@ type Grow_2 = 'fill' | 'hug';
403
400
  type Height = Dimension;
404
401
 
405
402
  // @public
406
- export const Inline: MemoExoticComponent<ForwardRefExoticComponent<Pick<InlineProps<ElementType<any>>, "alignBlock" | "alignInline" | "as" | "children" | "grow" | "rowSpace" | "separator" | "shouldWrap" | "space" | "spread" | "testId"> & RefAttributes<any>>>;
403
+ export const Inline: MemoExoticComponent<ForwardRefExoticComponent<Pick<InlineProps<ElementType<any>>, "alignBlock" | "alignInline" | "as" | "children" | "grow" | "rowSpace" | "separator" | "shouldWrap" | "space" | "spread" | "testId" | "xcss"> & RefAttributes<any>>>;
407
404
 
408
405
  // @public (undocumented)
409
406
  export interface InlineProps<T extends ElementType = 'div'> {
@@ -419,6 +416,7 @@ export interface InlineProps<T extends ElementType = 'div'> {
419
416
  space?: Space;
420
417
  spread?: Spread;
421
418
  testId?: string;
419
+ xcss?: Array<InlineXCSS | false | undefined> | InlineXCSS;
422
420
  }
423
421
 
424
422
  // @public (undocumented)
@@ -432,6 +430,11 @@ type InlineStyles = SerializedStyles & {
432
430
  // @public (undocumented)
433
431
  const inlineTag: unique symbol;
434
432
 
433
+ // @public (undocumented)
434
+ type InlineXCSS = {
435
+ readonly [uniqueSymbol]: InlineStyles;
436
+ };
437
+
435
438
  // @public (undocumented)
436
439
  type Layer = keyof typeof layerMap;
437
440
 
@@ -563,6 +566,9 @@ const spaceMap: {
563
566
  'space.1000': "var(--ds-space-1000)";
564
567
  };
565
568
 
569
+ // @public (undocumented)
570
+ type Spacing = 'columnGap' | 'gap' | 'inset' | 'insetBlock' | 'insetBlockEnd' | 'insetBlockStart' | 'insetInline' | 'insetInlineEnd' | 'insetInlineStart' | 'outlineOffset' | 'padding' | 'paddingBlock' | 'paddingBlockEnd' | 'paddingBlockStart' | 'paddingBottom' | 'paddingInline' | 'paddingInlineEnd' | 'paddingInlineStart' | 'paddingLeft' | 'paddingRight' | 'paddingTop' | 'rowGap';
571
+
566
572
  // @public (undocumented)
567
573
  type Spread = 'space-between';
568
574
 
@@ -715,8 +721,8 @@ const UNSAFE_media: {
715
721
  type Width = Dimension;
716
722
 
717
723
  // @public
718
- export function xcss<Primitive extends typeof Box | typeof Inline = typeof Box>(style: Primitive extends typeof Box ? ScopedSafeCSSObject<AllowedBoxStyles> | ScopedSafeCSSObject<AllowedBoxStyles>[] : Primitive extends typeof Inline ? ScopedSafeCSSObject<AllowedInlineStyles> | ScopedSafeCSSObject<AllowedInlineStyles>[] : never): {
719
- readonly [uniqueSymbol]: Primitive extends (<T extends ElementType<any> = "div">(props: BoxProps<T>) => ReactElement<any, JSXElementConstructor<any>| string> | null) & FC<BoxProps<"div">> ? BoxStyles : Primitive extends MemoExoticComponent<ForwardRefExoticComponent<Pick<InlineProps<ElementType<any>>, "alignBlock" | "alignInline" | "as" | "children" | "grow" | "rowSpace" | "separator" | "shouldWrap" | "space" | "spread" | "testId"> & RefAttributes<any>>> ? InlineStyles : never;
724
+ export function xcss<Primitive extends typeof Box | typeof Inline = typeof Box>(style: Primitive extends typeof Box ? ScopedSafeCSSObject<AllowedBoxStyles> | ScopedSafeCSSObject<AllowedBoxStyles>[] : Primitive extends typeof Inline ? ScopedSafeCSSObject<Spacing> | ScopedSafeCSSObject<Spacing>[] : never): {
725
+ readonly [uniqueSymbol]: Primitive extends (<T extends ElementType<any> = "div">(props: BoxProps<T>) => ReactElement<any, JSXElementConstructor<any>| string> | null) & FC<BoxProps<"div">> ? BoxStyles : Primitive extends MemoExoticComponent<ForwardRefExoticComponent<Pick<InlineProps<ElementType<any>>, "alignBlock" | "alignInline" | "as" | "children" | "grow" | "rowSpace" | "separator" | "shouldWrap" | "space" | "spread" | "testId" | "xcss"> & RefAttributes<any>>> ? InlineStyles : never;
720
726
  };
721
727
 
722
728
  // (No @packageDocumentation comment for this package)