@atlaskit/primitives 0.2.1 → 0.2.2
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.partial.js +46 -22
- package/dist/cjs/components/internal/base-box.partial.js +99 -78
- package/dist/cjs/components/internal/types.js +8 -0
- package/dist/cjs/components/internal/utils.js +16 -0
- package/dist/cjs/components/stack.partial.js +46 -22
- package/dist/cjs/constants.js +13 -0
- package/dist/cjs/version.json +1 -1
- package/dist/es2019/components/inline.partial.js +18 -18
- package/dist/es2019/components/internal/base-box.partial.js +75 -70
- package/dist/es2019/components/internal/types.js +1 -0
- package/dist/es2019/components/internal/utils.js +2 -0
- package/dist/es2019/components/stack.partial.js +18 -18
- package/dist/es2019/constants.js +3 -1
- package/dist/es2019/version.json +1 -1
- package/dist/esm/components/inline.partial.js +46 -21
- package/dist/esm/components/internal/base-box.partial.js +100 -79
- package/dist/esm/components/internal/types.js +1 -0
- package/dist/esm/components/internal/utils.js +7 -0
- package/dist/esm/components/stack.partial.js +46 -21
- package/dist/esm/constants.js +3 -1
- package/dist/esm/version.json +1 -1
- package/dist/types/components/box.d.ts +3 -5
- package/dist/types/components/inline.partial.d.ts +16 -18
- package/dist/types/components/internal/base-box.partial.d.ts +49 -50
- package/dist/types/components/internal/types.d.ts +6 -0
- package/dist/types/components/internal/utils.d.ts +3 -0
- package/dist/types/components/stack.partial.d.ts +16 -18
- package/dist/types/components/types.d.ts +49 -0
- package/dist/types/constants.d.ts +2 -0
- package/package.json +4 -2
- package/report.api.md +111 -78
- package/scripts/spacing-codegen-template.tsx +29 -24
- package/scripts/utils.tsx +4 -1
- package/tmp/api-report-tmp.d.ts +88 -77
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
2
1
|
/** @jsx jsx */
|
|
3
2
|
import { forwardRef, memo } from 'react';
|
|
4
3
|
import { css, jsx } from '@emotion/react';
|
|
@@ -38,30 +37,56 @@ var flexGrowMap = {
|
|
|
38
37
|
|
|
39
38
|
/**
|
|
40
39
|
* THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
|
|
41
|
-
* @codegen <<SignedSource::
|
|
40
|
+
* @codegen <<SignedSource::41d7002b7f69aa44d0d8598e07a1afc6>>
|
|
42
41
|
* @codegenId spacing
|
|
43
42
|
* @codegenCommand yarn codegen-styles
|
|
44
43
|
* @codegenParams ["space"]
|
|
45
44
|
* @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-spacing.tsx <<SignedSource::167d3b69b159ae33e74d4ea5ab7eade6>>
|
|
46
45
|
*/
|
|
47
|
-
var spaceMap =
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
46
|
+
var spaceMap = {
|
|
47
|
+
'0': css({
|
|
48
|
+
gap: "var(--ds-space-0, 0px)"
|
|
49
|
+
}),
|
|
50
|
+
'025': css({
|
|
51
|
+
gap: "var(--ds-space-025, 2px)"
|
|
52
|
+
}),
|
|
53
|
+
'050': css({
|
|
54
|
+
gap: "var(--ds-space-050, 4px)"
|
|
55
|
+
}),
|
|
56
|
+
'075': css({
|
|
57
|
+
gap: "var(--ds-space-075, 6px)"
|
|
58
|
+
}),
|
|
59
|
+
'100': css({
|
|
60
|
+
gap: "var(--ds-space-100, 8px)"
|
|
61
|
+
}),
|
|
62
|
+
'150': css({
|
|
63
|
+
gap: "var(--ds-space-150, 12px)"
|
|
64
|
+
}),
|
|
65
|
+
'200': css({
|
|
66
|
+
gap: "var(--ds-space-200, 16px)"
|
|
67
|
+
}),
|
|
68
|
+
'250': css({
|
|
69
|
+
gap: "var(--ds-space-250, 20px)"
|
|
70
|
+
}),
|
|
71
|
+
'300': css({
|
|
72
|
+
gap: "var(--ds-space-300, 24px)"
|
|
73
|
+
}),
|
|
74
|
+
'400': css({
|
|
75
|
+
gap: "var(--ds-space-400, 32px)"
|
|
76
|
+
}),
|
|
77
|
+
'500': css({
|
|
78
|
+
gap: "var(--ds-space-500, 40px)"
|
|
79
|
+
}),
|
|
80
|
+
'600': css({
|
|
81
|
+
gap: "var(--ds-space-600, 48px)"
|
|
82
|
+
}),
|
|
83
|
+
'800': css({
|
|
84
|
+
gap: "var(--ds-space-800, 64px)"
|
|
85
|
+
}),
|
|
86
|
+
'1000': css({
|
|
87
|
+
gap: "var(--ds-space-1000, 80px)"
|
|
88
|
+
})
|
|
89
|
+
};
|
|
65
90
|
/**
|
|
66
91
|
* @codegenEnd
|
|
67
92
|
*/
|
|
@@ -96,7 +121,7 @@ var Stack = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
96
121
|
testId = _ref.testId;
|
|
97
122
|
var justifyContent = spread || alignBlock;
|
|
98
123
|
return jsx("div", {
|
|
99
|
-
css: [baseStyles, space && spaceMap
|
|
124
|
+
css: [baseStyles, space && spaceMap[space], alignItems && alignItemsMap[alignItems], grow && flexGrowMap[grow], justifyContent && justifyContentMap[justifyContent]],
|
|
100
125
|
"data-testid": testId,
|
|
101
126
|
ref: ref
|
|
102
127
|
}, children);
|
package/dist/esm/constants.js
CHANGED
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import { UNSAFE_Breakpoint as Breakpoint, UNSAFE_BreakpointConfig as BreakpointConfig, UNSAFE_BREAKPOINTS_CONFIG as BREAKPOINTS_CONFIG, UNSAFE_BREAKPOINTS_LIST as BREAKPOINTS_LIST } from '@atlaskit/ds-explorations';
|
|
1
2
|
export var LAYERS = {
|
|
2
3
|
card: 100,
|
|
3
4
|
navigation: 200,
|
|
@@ -8,4 +9,5 @@ export var LAYERS = {
|
|
|
8
9
|
flag: 600,
|
|
9
10
|
spotlight: 700,
|
|
10
11
|
tooltip: 800
|
|
11
|
-
};
|
|
12
|
+
};
|
|
13
|
+
export { BREAKPOINTS_CONFIG, BREAKPOINTS_LIST };
|
package/dist/esm/version.json
CHANGED
|
@@ -1,10 +1,8 @@
|
|
|
1
1
|
import { ElementType, FC, ReactElement } from 'react';
|
|
2
2
|
import { BaseBoxProps } from './internal/base-box.partial';
|
|
3
|
-
import {
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
};
|
|
7
|
-
export declare type BoxProps<T extends ElementType = 'div'> = Omit<BaseBoxProps<T>, 'className' | 'UNSAFE_style'> & BoxPropsBase;
|
|
3
|
+
import { BoxResponsiveProp } from './internal/types';
|
|
4
|
+
import { PublicBoxPropsBase } from './types';
|
|
5
|
+
export declare type BoxProps<T extends ElementType = 'div'> = Omit<BaseBoxProps<T>, 'className' | 'UNSAFE_style' | BoxResponsiveProp> & PublicBoxPropsBase;
|
|
8
6
|
declare type BoxComponent<T extends ElementType = 'div'> = (<T extends ElementType = 'div'>(props: BoxProps<T>) => ReactElement | null) & FC<BoxProps<T>>;
|
|
9
7
|
/**
|
|
10
8
|
* __Box__
|
|
@@ -44,31 +44,29 @@ export declare type Spread = 'space-between';
|
|
|
44
44
|
export declare type Grow = 'hug' | 'fill';
|
|
45
45
|
/**
|
|
46
46
|
* THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
|
|
47
|
-
* @codegen <<SignedSource::
|
|
47
|
+
* @codegen <<SignedSource::41d7002b7f69aa44d0d8598e07a1afc6>>
|
|
48
48
|
* @codegenId spacing
|
|
49
49
|
* @codegenCommand yarn codegen-styles
|
|
50
50
|
* @codegenParams ["space"]
|
|
51
51
|
* @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-spacing.tsx <<SignedSource::167d3b69b159ae33e74d4ea5ab7eade6>>
|
|
52
52
|
*/
|
|
53
53
|
declare const spaceMap: {
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
readonly '1000': import("@emotion/react").SerializedStyles;
|
|
69
|
-
};
|
|
54
|
+
readonly '0': import("@emotion/react").SerializedStyles;
|
|
55
|
+
readonly '025': import("@emotion/react").SerializedStyles;
|
|
56
|
+
readonly '050': import("@emotion/react").SerializedStyles;
|
|
57
|
+
readonly '075': import("@emotion/react").SerializedStyles;
|
|
58
|
+
readonly '100': import("@emotion/react").SerializedStyles;
|
|
59
|
+
readonly '150': import("@emotion/react").SerializedStyles;
|
|
60
|
+
readonly '200': import("@emotion/react").SerializedStyles;
|
|
61
|
+
readonly '250': import("@emotion/react").SerializedStyles;
|
|
62
|
+
readonly '300': import("@emotion/react").SerializedStyles;
|
|
63
|
+
readonly '400': import("@emotion/react").SerializedStyles;
|
|
64
|
+
readonly '500': import("@emotion/react").SerializedStyles;
|
|
65
|
+
readonly '600': import("@emotion/react").SerializedStyles;
|
|
66
|
+
readonly '800': import("@emotion/react").SerializedStyles;
|
|
67
|
+
readonly '1000': import("@emotion/react").SerializedStyles;
|
|
70
68
|
};
|
|
71
|
-
export declare type Space = keyof typeof spaceMap
|
|
69
|
+
export declare type Space = keyof typeof spaceMap;
|
|
72
70
|
/**
|
|
73
71
|
* __Inline__
|
|
74
72
|
*
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/** @jsx jsx */
|
|
2
2
|
import { ComponentPropsWithoutRef, ComponentPropsWithRef, ElementType, FC, ReactElement, ReactNode } from 'react';
|
|
3
|
-
import { Layer } from '../../constants';
|
|
3
|
+
import { Breakpoint, Layer } from '../../constants';
|
|
4
4
|
import type { BasePrimitiveProps } from '../types';
|
|
5
5
|
export declare type BaseBoxProps<T extends ElementType = 'div'> = Omit<ComponentPropsWithoutRef<T>, 'as' | 'className' | 'style'> & BasePrimitiveProps & BaseBoxPropsFoundation<T>;
|
|
6
6
|
declare type BaseBoxPropsFoundation<T extends ElementType> = {
|
|
@@ -43,7 +43,7 @@ declare type BaseBoxPropsFoundation<T extends ElementType> = {
|
|
|
43
43
|
/**
|
|
44
44
|
* Defines border width.
|
|
45
45
|
*/
|
|
46
|
-
borderWidth?: BorderWidth
|
|
46
|
+
borderWidth?: BorderWidth | Partial<Record<Breakpoint, BorderWidth>>;
|
|
47
47
|
/**
|
|
48
48
|
* Token representing border color with a fallback.
|
|
49
49
|
*/
|
|
@@ -89,42 +89,42 @@ declare type BaseBoxPropsFoundation<T extends ElementType> = {
|
|
|
89
89
|
*/
|
|
90
90
|
overflowBlock?: OverflowBlock;
|
|
91
91
|
/**
|
|
92
|
-
*
|
|
92
|
+
* Tokens representing CSS shorthand for `paddingBlock` and `paddingInline` together.
|
|
93
93
|
*
|
|
94
94
|
* @see paddingBlock
|
|
95
95
|
* @see paddingInline
|
|
96
96
|
*/
|
|
97
|
-
padding?: Padding
|
|
97
|
+
padding?: Padding | Partial<Record<Breakpoint, Padding>>;
|
|
98
98
|
/**
|
|
99
|
-
*
|
|
99
|
+
* Tokens representing CSS shorthand `paddingBlock`.
|
|
100
100
|
*
|
|
101
101
|
* @see paddingBlockStart
|
|
102
102
|
* @see paddingBlockEnd
|
|
103
103
|
*/
|
|
104
|
-
paddingBlock?: PaddingBlock
|
|
104
|
+
paddingBlock?: PaddingBlock | Partial<Record<Breakpoint, PaddingBlock>>;
|
|
105
105
|
/**
|
|
106
|
-
*
|
|
106
|
+
* Tokens representing CSS `paddingBlockStart`.
|
|
107
107
|
*/
|
|
108
|
-
paddingBlockStart?: PaddingBlockStart
|
|
108
|
+
paddingBlockStart?: PaddingBlockStart | Partial<Record<Breakpoint, PaddingBlockStart>>;
|
|
109
109
|
/**
|
|
110
|
-
*
|
|
110
|
+
* Tokens representing CSS `paddingBlockEnd`.
|
|
111
111
|
*/
|
|
112
|
-
paddingBlockEnd?: PaddingBlockEnd
|
|
112
|
+
paddingBlockEnd?: PaddingBlockEnd | Partial<Record<Breakpoint, PaddingBlockEnd>>;
|
|
113
113
|
/**
|
|
114
|
-
*
|
|
114
|
+
* Tokens representing CSS shorthand `paddingInline`.
|
|
115
115
|
*
|
|
116
116
|
* @see paddingInlineStart
|
|
117
117
|
* @see paddingInlineEnd
|
|
118
118
|
*/
|
|
119
|
-
paddingInline?: PaddingInline
|
|
119
|
+
paddingInline?: PaddingInline | Partial<Record<Breakpoint, PaddingInline>>;
|
|
120
120
|
/**
|
|
121
|
-
*
|
|
121
|
+
* Tokens representing CSS `paddingInlineStart`.
|
|
122
122
|
*/
|
|
123
|
-
paddingInlineStart?: PaddingInlineStart
|
|
123
|
+
paddingInlineStart?: PaddingInlineStart | Partial<Record<Breakpoint, PaddingInlineStart>>;
|
|
124
124
|
/**
|
|
125
|
-
*
|
|
125
|
+
* Tokens representing CSS `paddingInlineEnd`.
|
|
126
126
|
*/
|
|
127
|
-
paddingInlineEnd?: PaddingInlineEnd
|
|
127
|
+
paddingInlineEnd?: PaddingInlineEnd | Partial<Record<Breakpoint, PaddingInlineEnd>>;
|
|
128
128
|
/**
|
|
129
129
|
* Token representing width.
|
|
130
130
|
* @experimental The existing tokens will be replaced to better reflect dimensions.
|
|
@@ -138,7 +138,7 @@ declare type BaseBoxPropsFoundation<T extends ElementType> = {
|
|
|
138
138
|
/**
|
|
139
139
|
* Defines display type and layout. Defaults to `block`.
|
|
140
140
|
*/
|
|
141
|
-
display?: Display
|
|
141
|
+
display?: Display | Partial<Record<Breakpoint, Display>>;
|
|
142
142
|
/**
|
|
143
143
|
* CSS position property.
|
|
144
144
|
*/
|
|
@@ -161,10 +161,11 @@ declare const borderStyleMap: {
|
|
|
161
161
|
readonly none: import("@emotion/react").SerializedStyles;
|
|
162
162
|
readonly solid: import("@emotion/react").SerializedStyles;
|
|
163
163
|
};
|
|
164
|
-
declare type BorderWidth = keyof typeof borderWidthMap;
|
|
164
|
+
export declare type BorderWidth = keyof typeof borderWidthMap;
|
|
165
165
|
declare const borderWidthMap: {
|
|
166
|
-
readonly 'size.
|
|
167
|
-
readonly 'size.
|
|
166
|
+
readonly 'size.0': "var(--ds-width-0)";
|
|
167
|
+
readonly 'size.050': "var(--ds-width-050)";
|
|
168
|
+
readonly 'size.100': "var(--ds-width-100)";
|
|
168
169
|
};
|
|
169
170
|
declare type BorderRadius = keyof typeof borderRadiusMap;
|
|
170
171
|
declare const borderRadiusMap: {
|
|
@@ -196,13 +197,13 @@ declare const alignSelfMap: {
|
|
|
196
197
|
readonly end: import("@emotion/react").SerializedStyles;
|
|
197
198
|
readonly baseline: import("@emotion/react").SerializedStyles;
|
|
198
199
|
};
|
|
199
|
-
declare type Display = keyof typeof displayMap;
|
|
200
|
+
export declare type Display = keyof typeof displayMap;
|
|
200
201
|
declare const displayMap: {
|
|
201
|
-
readonly block:
|
|
202
|
-
readonly inline:
|
|
203
|
-
readonly flex:
|
|
204
|
-
readonly 'inline-flex':
|
|
205
|
-
readonly 'inline-block':
|
|
202
|
+
readonly block: "block";
|
|
203
|
+
readonly inline: "inline";
|
|
204
|
+
readonly flex: "flex";
|
|
205
|
+
readonly 'inline-flex': "inline-flex";
|
|
206
|
+
readonly 'inline-block': "inline-block";
|
|
206
207
|
};
|
|
207
208
|
declare type Position = keyof typeof positionMap;
|
|
208
209
|
declare const positionMap: {
|
|
@@ -304,37 +305,35 @@ export declare type MaxHeight = keyof typeof maxHeightMap;
|
|
|
304
305
|
*/
|
|
305
306
|
/**
|
|
306
307
|
* THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
|
|
307
|
-
* @codegen <<SignedSource::
|
|
308
|
+
* @codegen <<SignedSource::84fd352b0e6509d380a0dcf8ad023ca2>>
|
|
308
309
|
* @codegenId spacing
|
|
309
310
|
* @codegenCommand yarn codegen-styles
|
|
310
311
|
* @codegenParams ["padding"]
|
|
311
312
|
* @codegenDependency ../../../../tokens/src/artifacts/tokens-raw/atlassian-spacing.tsx <<SignedSource::167d3b69b159ae33e74d4ea5ab7eade6>>
|
|
312
313
|
*/
|
|
313
314
|
declare const paddingMap: {
|
|
314
|
-
|
|
315
|
-
|
|
316
|
-
|
|
317
|
-
|
|
318
|
-
|
|
319
|
-
|
|
320
|
-
|
|
321
|
-
|
|
322
|
-
|
|
323
|
-
|
|
324
|
-
|
|
325
|
-
|
|
326
|
-
|
|
327
|
-
|
|
328
|
-
readonly 'space.1000': import("@emotion/react").SerializedStyles;
|
|
329
|
-
};
|
|
315
|
+
readonly 'space.0': "var(--ds-space-0)";
|
|
316
|
+
readonly 'space.025': "var(--ds-space-025)";
|
|
317
|
+
readonly 'space.050': "var(--ds-space-050)";
|
|
318
|
+
readonly 'space.075': "var(--ds-space-075)";
|
|
319
|
+
readonly 'space.100': "var(--ds-space-100)";
|
|
320
|
+
readonly 'space.150': "var(--ds-space-150)";
|
|
321
|
+
readonly 'space.200': "var(--ds-space-200)";
|
|
322
|
+
readonly 'space.250': "var(--ds-space-250)";
|
|
323
|
+
readonly 'space.300': "var(--ds-space-300)";
|
|
324
|
+
readonly 'space.400': "var(--ds-space-400)";
|
|
325
|
+
readonly 'space.500': "var(--ds-space-500)";
|
|
326
|
+
readonly 'space.600': "var(--ds-space-600)";
|
|
327
|
+
readonly 'space.800': "var(--ds-space-800)";
|
|
328
|
+
readonly 'space.1000': "var(--ds-space-1000)";
|
|
330
329
|
};
|
|
331
|
-
export declare type Padding = keyof typeof paddingMap
|
|
332
|
-
export declare type PaddingBlock = keyof typeof paddingMap
|
|
333
|
-
export declare type PaddingBlockStart = keyof typeof paddingMap
|
|
334
|
-
export declare type PaddingBlockEnd = keyof typeof paddingMap
|
|
335
|
-
export declare type PaddingInline = keyof typeof paddingMap
|
|
336
|
-
export declare type PaddingInlineStart = keyof typeof paddingMap
|
|
337
|
-
export declare type PaddingInlineEnd = keyof typeof paddingMap
|
|
330
|
+
export declare type Padding = keyof typeof paddingMap;
|
|
331
|
+
export declare type PaddingBlock = keyof typeof paddingMap;
|
|
332
|
+
export declare type PaddingBlockStart = keyof typeof paddingMap;
|
|
333
|
+
export declare type PaddingBlockEnd = keyof typeof paddingMap;
|
|
334
|
+
export declare type PaddingInline = keyof typeof paddingMap;
|
|
335
|
+
export declare type PaddingInlineStart = keyof typeof paddingMap;
|
|
336
|
+
export declare type PaddingInlineEnd = keyof typeof paddingMap;
|
|
338
337
|
/**
|
|
339
338
|
* @codegenEnd
|
|
340
339
|
*/
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import { SerializedStyles } from '@emotion/react';
|
|
2
|
+
import { Breakpoint } from '../../constants';
|
|
3
|
+
export declare const BOX_RESPONSIVE_PROPS: readonly ["borderWidth", "display", "padding", "paddingBlock", "paddingBlockStart", "paddingBlockEnd", "paddingInline", "paddingInlineStart", "paddingInlineEnd"];
|
|
4
|
+
export declare type BoxResponsiveProp = typeof BOX_RESPONSIVE_PROPS[number];
|
|
5
|
+
export declare type BreakpointIndexedStyle = Record<Breakpoint | 'static', SerializedStyles>;
|
|
6
|
+
export declare type GenericPropertyValue = string | Partial<Record<Breakpoint, string>> | undefined;
|
|
@@ -36,31 +36,29 @@ export declare type Spread = 'space-between';
|
|
|
36
36
|
export declare type Grow = 'hug' | 'fill';
|
|
37
37
|
/**
|
|
38
38
|
* THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
|
|
39
|
-
* @codegen <<SignedSource::
|
|
39
|
+
* @codegen <<SignedSource::41d7002b7f69aa44d0d8598e07a1afc6>>
|
|
40
40
|
* @codegenId spacing
|
|
41
41
|
* @codegenCommand yarn codegen-styles
|
|
42
42
|
* @codegenParams ["space"]
|
|
43
43
|
* @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-spacing.tsx <<SignedSource::167d3b69b159ae33e74d4ea5ab7eade6>>
|
|
44
44
|
*/
|
|
45
45
|
declare const spaceMap: {
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
readonly '1000': import("@emotion/react").SerializedStyles;
|
|
61
|
-
};
|
|
46
|
+
readonly '0': import("@emotion/react").SerializedStyles;
|
|
47
|
+
readonly '025': import("@emotion/react").SerializedStyles;
|
|
48
|
+
readonly '050': import("@emotion/react").SerializedStyles;
|
|
49
|
+
readonly '075': import("@emotion/react").SerializedStyles;
|
|
50
|
+
readonly '100': import("@emotion/react").SerializedStyles;
|
|
51
|
+
readonly '150': import("@emotion/react").SerializedStyles;
|
|
52
|
+
readonly '200': import("@emotion/react").SerializedStyles;
|
|
53
|
+
readonly '250': import("@emotion/react").SerializedStyles;
|
|
54
|
+
readonly '300': import("@emotion/react").SerializedStyles;
|
|
55
|
+
readonly '400': import("@emotion/react").SerializedStyles;
|
|
56
|
+
readonly '500': import("@emotion/react").SerializedStyles;
|
|
57
|
+
readonly '600': import("@emotion/react").SerializedStyles;
|
|
58
|
+
readonly '800': import("@emotion/react").SerializedStyles;
|
|
59
|
+
readonly '1000': import("@emotion/react").SerializedStyles;
|
|
62
60
|
};
|
|
63
|
-
export declare type Space = keyof typeof spaceMap
|
|
61
|
+
export declare type Space = keyof typeof spaceMap;
|
|
64
62
|
/**
|
|
65
63
|
* __Stack__
|
|
66
64
|
*
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import type { CSSProperties } from 'react';
|
|
2
|
+
import { BorderWidth, Display, Padding, PaddingBlock, PaddingBlockEnd, PaddingBlockStart, PaddingInline, PaddingInlineEnd, PaddingInlineStart } from './internal/base-box.partial';
|
|
2
3
|
/**
|
|
3
4
|
* Restricted set of inline styles to be applied to the primitive.
|
|
4
5
|
* Should be avoided where possible, in favor of the pre-defined props and values on the primitive itself.
|
|
@@ -18,3 +19,51 @@ export interface BasePrimitiveProps {
|
|
|
18
19
|
*/
|
|
19
20
|
UNSAFE_style?: CSSProperties;
|
|
20
21
|
}
|
|
22
|
+
export declare type PublicBoxPropsBase = {
|
|
23
|
+
/**
|
|
24
|
+
* Defines border width.
|
|
25
|
+
*/
|
|
26
|
+
borderWidth?: BorderWidth;
|
|
27
|
+
/**
|
|
28
|
+
* Defines display type and layout. Defaults to `block`.
|
|
29
|
+
*/
|
|
30
|
+
display?: Display;
|
|
31
|
+
/**
|
|
32
|
+
* Tokens representing CSS shorthand for `paddingBlock` and `paddingInline` together.
|
|
33
|
+
*
|
|
34
|
+
* @see paddingBlock
|
|
35
|
+
* @see paddingInline
|
|
36
|
+
*/
|
|
37
|
+
padding?: Padding;
|
|
38
|
+
/**
|
|
39
|
+
* Tokens representing CSS shorthand `paddingBlock`.
|
|
40
|
+
*
|
|
41
|
+
* @see paddingBlockStart
|
|
42
|
+
* @see paddingBlockEnd
|
|
43
|
+
*/
|
|
44
|
+
paddingBlock?: PaddingBlock;
|
|
45
|
+
/**
|
|
46
|
+
* Tokens representing CSS `paddingBlockStart`.
|
|
47
|
+
*/
|
|
48
|
+
paddingBlockStart?: PaddingBlockStart;
|
|
49
|
+
/**
|
|
50
|
+
* Tokens representing CSS `paddingBlockEnd`.
|
|
51
|
+
*/
|
|
52
|
+
paddingBlockEnd?: PaddingBlockEnd;
|
|
53
|
+
/**
|
|
54
|
+
* Tokens representing CSS shorthand `paddingInline`.
|
|
55
|
+
*
|
|
56
|
+
* @see paddingInlineStart
|
|
57
|
+
* @see paddingInlineEnd
|
|
58
|
+
*/
|
|
59
|
+
paddingInline?: PaddingInline;
|
|
60
|
+
/**
|
|
61
|
+
* Tokens representing CSS `paddingInlineStart`.
|
|
62
|
+
*/
|
|
63
|
+
paddingInlineStart?: PaddingInlineStart;
|
|
64
|
+
/**
|
|
65
|
+
* Tokens representing CSS `paddingInlineEnd`.
|
|
66
|
+
*/
|
|
67
|
+
paddingInlineEnd?: PaddingInlineEnd;
|
|
68
|
+
customStyles?: CustomStyles;
|
|
69
|
+
};
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import { UNSAFE_Breakpoint as Breakpoint, UNSAFE_BreakpointConfig as BreakpointConfig, UNSAFE_BREAKPOINTS_CONFIG as BREAKPOINTS_CONFIG, UNSAFE_BREAKPOINTS_LIST as BREAKPOINTS_LIST } from '@atlaskit/ds-explorations';
|
|
1
2
|
export declare const LAYERS: {
|
|
2
3
|
readonly card: 100;
|
|
3
4
|
readonly navigation: 200;
|
|
@@ -10,3 +11,4 @@ export declare const LAYERS: {
|
|
|
10
11
|
readonly tooltip: 800;
|
|
11
12
|
};
|
|
12
13
|
export declare type Layer = keyof typeof LAYERS;
|
|
14
|
+
export { BREAKPOINTS_CONFIG, BREAKPOINTS_LIST, type Breakpoint, type BreakpointConfig, };
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/primitives",
|
|
3
|
-
"version": "0.2.
|
|
3
|
+
"version": "0.2.2",
|
|
4
4
|
"description": "Primitives are token-backed low-level building blocks.",
|
|
5
5
|
"author": "Atlassian Pty Ltd",
|
|
6
6
|
"license": "Apache-2.0",
|
|
@@ -37,9 +37,11 @@
|
|
|
37
37
|
"./inline": "./src/components/inline.partial.tsx"
|
|
38
38
|
},
|
|
39
39
|
"dependencies": {
|
|
40
|
+
"@atlaskit/ds-explorations": "*",
|
|
40
41
|
"@atlaskit/tokens": "^1.2.0",
|
|
41
42
|
"@babel/runtime": "^7.0.0",
|
|
42
|
-
"@emotion/react": "^11.7.1"
|
|
43
|
+
"@emotion/react": "^11.7.1",
|
|
44
|
+
"tiny-invariant": "^1.2.0"
|
|
43
45
|
},
|
|
44
46
|
"peerDependencies": {
|
|
45
47
|
"react": "^16.8.0 || ^17.0.0 || ^18.0.0"
|