@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 +6 -0
- package/dist/cjs/components/inline.js +6 -1
- package/dist/cjs/version.json +1 -1
- package/dist/es2019/components/inline.js +6 -1
- package/dist/es2019/version.json +1 -1
- package/dist/esm/components/inline.js +6 -1
- package/dist/esm/version.json +1 -1
- package/dist/types/components/inline.d.ts +6 -1
- package/dist/types/xcss/xcss.d.ts +3 -3
- package/dist/types-ts4.5/components/inline.d.ts +6 -1
- package/dist/types-ts4.5/xcss/xcss.d.ts +3 -3
- package/package.json +1 -1
- package/report.api.md +34 -6
- package/tmp/api-report-tmp.d.ts +12 -6
package/CHANGELOG.md
CHANGED
|
@@ -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: [
|
|
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);
|
package/dist/cjs/version.json
CHANGED
|
@@ -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: [
|
|
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);
|
package/dist/es2019/version.json
CHANGED
|
@@ -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: [
|
|
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);
|
package/dist/esm/version.json
CHANGED
|
@@ -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
|
|
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<
|
|
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
|
|
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<
|
|
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
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
|
>
|
package/tmp/api-report-tmp.d.ts
CHANGED
|
@@ -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<
|
|
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)
|