@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.
Files changed (35) hide show
  1. package/CHANGELOG.md +6 -0
  2. package/dist/cjs/components/inline.partial.js +46 -22
  3. package/dist/cjs/components/internal/base-box.partial.js +99 -78
  4. package/dist/cjs/components/internal/types.js +8 -0
  5. package/dist/cjs/components/internal/utils.js +16 -0
  6. package/dist/cjs/components/stack.partial.js +46 -22
  7. package/dist/cjs/constants.js +13 -0
  8. package/dist/cjs/version.json +1 -1
  9. package/dist/es2019/components/inline.partial.js +18 -18
  10. package/dist/es2019/components/internal/base-box.partial.js +75 -70
  11. package/dist/es2019/components/internal/types.js +1 -0
  12. package/dist/es2019/components/internal/utils.js +2 -0
  13. package/dist/es2019/components/stack.partial.js +18 -18
  14. package/dist/es2019/constants.js +3 -1
  15. package/dist/es2019/version.json +1 -1
  16. package/dist/esm/components/inline.partial.js +46 -21
  17. package/dist/esm/components/internal/base-box.partial.js +100 -79
  18. package/dist/esm/components/internal/types.js +1 -0
  19. package/dist/esm/components/internal/utils.js +7 -0
  20. package/dist/esm/components/stack.partial.js +46 -21
  21. package/dist/esm/constants.js +3 -1
  22. package/dist/esm/version.json +1 -1
  23. package/dist/types/components/box.d.ts +3 -5
  24. package/dist/types/components/inline.partial.d.ts +16 -18
  25. package/dist/types/components/internal/base-box.partial.d.ts +49 -50
  26. package/dist/types/components/internal/types.d.ts +6 -0
  27. package/dist/types/components/internal/utils.d.ts +3 -0
  28. package/dist/types/components/stack.partial.d.ts +16 -18
  29. package/dist/types/components/types.d.ts +49 -0
  30. package/dist/types/constants.d.ts +2 -0
  31. package/package.json +4 -2
  32. package/report.api.md +111 -78
  33. package/scripts/spacing-codegen-template.tsx +29 -24
  34. package/scripts/utils.tsx +4 -1
  35. 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::0e30ffcc6aef7932f9d8ff2543327236>>
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 = Object.fromEntries(['gap'].map(function (property) {
48
- return [property, {
49
- '0': css(_defineProperty({}, property, "var(--ds-space-0, 0px)")),
50
- '025': css(_defineProperty({}, property, "var(--ds-space-025, 2px)")),
51
- '050': css(_defineProperty({}, property, "var(--ds-space-050, 4px)")),
52
- '075': css(_defineProperty({}, property, "var(--ds-space-075, 6px)")),
53
- '100': css(_defineProperty({}, property, "var(--ds-space-100, 8px)")),
54
- '150': css(_defineProperty({}, property, "var(--ds-space-150, 12px)")),
55
- '200': css(_defineProperty({}, property, "var(--ds-space-200, 16px)")),
56
- '250': css(_defineProperty({}, property, "var(--ds-space-250, 20px)")),
57
- '300': css(_defineProperty({}, property, "var(--ds-space-300, 24px)")),
58
- '400': css(_defineProperty({}, property, "var(--ds-space-400, 32px)")),
59
- '500': css(_defineProperty({}, property, "var(--ds-space-500, 40px)")),
60
- '600': css(_defineProperty({}, property, "var(--ds-space-600, 48px)")),
61
- '800': css(_defineProperty({}, property, "var(--ds-space-800, 64px)")),
62
- '1000': css(_defineProperty({}, property, "var(--ds-space-1000, 80px)"))
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.gap[space], alignItems && alignItemsMap[alignItems], grow && flexGrowMap[grow], justifyContent && justifyContentMap[justifyContent]],
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);
@@ -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 };
@@ -1,5 +1,5 @@
1
1
  {
2
2
  "name": "@atlaskit/primitives",
3
- "version": "0.2.1",
3
+ "version": "0.2.2",
4
4
  "sideEffects": false
5
5
  }
@@ -1,10 +1,8 @@
1
1
  import { ElementType, FC, ReactElement } from 'react';
2
2
  import { BaseBoxProps } from './internal/base-box.partial';
3
- import { CustomStyles } from './types';
4
- declare type BoxPropsBase = {
5
- customStyles?: CustomStyles;
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::0e30ffcc6aef7932f9d8ff2543327236>>
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
- [k: string]: {
55
- readonly '0': import("@emotion/react").SerializedStyles;
56
- readonly '025': import("@emotion/react").SerializedStyles;
57
- readonly '050': import("@emotion/react").SerializedStyles;
58
- readonly '075': import("@emotion/react").SerializedStyles;
59
- readonly '100': import("@emotion/react").SerializedStyles;
60
- readonly '150': import("@emotion/react").SerializedStyles;
61
- readonly '200': import("@emotion/react").SerializedStyles;
62
- readonly '250': import("@emotion/react").SerializedStyles;
63
- readonly '300': import("@emotion/react").SerializedStyles;
64
- readonly '400': import("@emotion/react").SerializedStyles;
65
- readonly '500': import("@emotion/react").SerializedStyles;
66
- readonly '600': import("@emotion/react").SerializedStyles;
67
- readonly '800': import("@emotion/react").SerializedStyles;
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.gap;
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
- * Shorthand for `paddingBlock` and `paddingInline` together.
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
- * Token representing CSS shorthand `paddingBlock`.
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
- * Token representing CSS `paddingBlockStart`.
106
+ * Tokens representing CSS `paddingBlockStart`.
107
107
  */
108
- paddingBlockStart?: PaddingBlockStart;
108
+ paddingBlockStart?: PaddingBlockStart | Partial<Record<Breakpoint, PaddingBlockStart>>;
109
109
  /**
110
- * Token representing CSS `paddingBlockEnd`.
110
+ * Tokens representing CSS `paddingBlockEnd`.
111
111
  */
112
- paddingBlockEnd?: PaddingBlockEnd;
112
+ paddingBlockEnd?: PaddingBlockEnd | Partial<Record<Breakpoint, PaddingBlockEnd>>;
113
113
  /**
114
- * Token representing CSS shorthand `paddingInline`.
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
- * Token representing CSS `paddingInlineStart`.
121
+ * Tokens representing CSS `paddingInlineStart`.
122
122
  */
123
- paddingInlineStart?: PaddingInlineStart;
123
+ paddingInlineStart?: PaddingInlineStart | Partial<Record<Breakpoint, PaddingInlineStart>>;
124
124
  /**
125
- * Token representing CSS `paddingInlineEnd`.
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.050': import("@emotion/react").SerializedStyles;
167
- readonly 'size.100': import("@emotion/react").SerializedStyles;
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: import("@emotion/react").SerializedStyles;
202
- readonly inline: import("@emotion/react").SerializedStyles;
203
- readonly flex: import("@emotion/react").SerializedStyles;
204
- readonly 'inline-flex': import("@emotion/react").SerializedStyles;
205
- readonly 'inline-block': import("@emotion/react").SerializedStyles;
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::6da0ceaa2c227230e3a93bc724ff8648>>
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
- [k: string]: {
315
- readonly 'space.0': import("@emotion/react").SerializedStyles;
316
- readonly 'space.025': import("@emotion/react").SerializedStyles;
317
- readonly 'space.050': import("@emotion/react").SerializedStyles;
318
- readonly 'space.075': import("@emotion/react").SerializedStyles;
319
- readonly 'space.100': import("@emotion/react").SerializedStyles;
320
- readonly 'space.150': import("@emotion/react").SerializedStyles;
321
- readonly 'space.200': import("@emotion/react").SerializedStyles;
322
- readonly 'space.250': import("@emotion/react").SerializedStyles;
323
- readonly 'space.300': import("@emotion/react").SerializedStyles;
324
- readonly 'space.400': import("@emotion/react").SerializedStyles;
325
- readonly 'space.500': import("@emotion/react").SerializedStyles;
326
- readonly 'space.600': import("@emotion/react").SerializedStyles;
327
- readonly 'space.800': import("@emotion/react").SerializedStyles;
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.padding;
332
- export declare type PaddingBlock = keyof typeof paddingMap.paddingBlock;
333
- export declare type PaddingBlockStart = keyof typeof paddingMap.paddingBlockStart;
334
- export declare type PaddingBlockEnd = keyof typeof paddingMap.paddingBlockEnd;
335
- export declare type PaddingInline = keyof typeof paddingMap.paddingInline;
336
- export declare type PaddingInlineStart = keyof typeof paddingMap.paddingInlineStart;
337
- export declare type PaddingInlineEnd = keyof typeof paddingMap.paddingInlineEnd;
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;
@@ -0,0 +1,3 @@
1
+ import { GenericPropertyValue } from './types';
2
+ export declare const isResponsiveStyleProp: (propertyValue: GenericPropertyValue) => propertyValue is object;
3
+ export declare const isStaticStyleProp: (propertyValue: GenericPropertyValue) => propertyValue is string;
@@ -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::0e30ffcc6aef7932f9d8ff2543327236>>
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
- [k: string]: {
47
- readonly '0': import("@emotion/react").SerializedStyles;
48
- readonly '025': import("@emotion/react").SerializedStyles;
49
- readonly '050': import("@emotion/react").SerializedStyles;
50
- readonly '075': import("@emotion/react").SerializedStyles;
51
- readonly '100': import("@emotion/react").SerializedStyles;
52
- readonly '150': import("@emotion/react").SerializedStyles;
53
- readonly '200': import("@emotion/react").SerializedStyles;
54
- readonly '250': import("@emotion/react").SerializedStyles;
55
- readonly '300': import("@emotion/react").SerializedStyles;
56
- readonly '400': import("@emotion/react").SerializedStyles;
57
- readonly '500': import("@emotion/react").SerializedStyles;
58
- readonly '600': import("@emotion/react").SerializedStyles;
59
- readonly '800': import("@emotion/react").SerializedStyles;
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.gap;
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.1",
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"