@atlaskit/primitives 0.5.0 → 0.6.0

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 (30) hide show
  1. package/CHANGELOG.md +6 -0
  2. package/dist/cjs/components/inline.partial.js +23 -91
  3. package/dist/cjs/components/internal/base-box.partial.js +81 -99
  4. package/dist/cjs/components/stack.partial.js +23 -47
  5. package/dist/cjs/version.json +1 -1
  6. package/dist/es2019/components/inline.partial.js +19 -63
  7. package/dist/es2019/components/internal/base-box.partial.js +72 -68
  8. package/dist/es2019/components/stack.partial.js +19 -19
  9. package/dist/es2019/version.json +1 -1
  10. package/dist/esm/components/inline.partial.js +22 -91
  11. package/dist/esm/components/internal/base-box.partial.js +81 -99
  12. package/dist/esm/components/stack.partial.js +22 -47
  13. package/dist/esm/version.json +1 -1
  14. package/dist/types/components/box.d.ts +1 -2
  15. package/dist/types/components/inline.partial.d.ts +23 -37
  16. package/dist/types/components/internal/base-box.partial.d.ts +42 -43
  17. package/dist/types/components/stack.partial.d.ts +21 -19
  18. package/dist/types/components/types.d.ts +0 -46
  19. package/package.json +2 -3
  20. package/report.api.md +91 -136
  21. package/scripts/spacing-codegen-template.tsx +30 -30
  22. package/tmp/api-report-tmp.d.ts +91 -124
  23. package/dist/cjs/components/internal/types.js +0 -8
  24. package/dist/cjs/components/internal/utils.js +0 -16
  25. package/dist/es2019/components/internal/types.js +0 -1
  26. package/dist/es2019/components/internal/utils.js +0 -2
  27. package/dist/esm/components/internal/types.js +0 -1
  28. package/dist/esm/components/internal/utils.js +0 -7
  29. package/dist/types/components/internal/types.d.ts +0 -8
  30. package/dist/types/components/internal/utils.d.ts +0 -3
@@ -166,7 +166,7 @@ type BaseBoxPropsFoundation<T extends ElementType> = {
166
166
  backgroundColor?: BackgroundColor;
167
167
  shadow?: Shadow;
168
168
  borderStyle?: BorderStyle;
169
- borderWidth?: BorderWidth | ResponsiveObject<BorderWidth>;
169
+ borderWidth?: BorderWidth;
170
170
  borderColor?: BorderColor;
171
171
  borderRadius?: BorderRadius;
172
172
  layer?: Layer;
@@ -177,16 +177,16 @@ type BaseBoxPropsFoundation<T extends ElementType> = {
177
177
  overflow?: Overflow;
178
178
  overflowInline?: OverflowInline;
179
179
  overflowBlock?: OverflowBlock;
180
- padding?: Padding | ResponsiveObject<Padding>;
181
- paddingBlock?: PaddingBlock | ResponsiveObject<PaddingBlock>;
182
- paddingBlockStart?: PaddingBlockStart | ResponsiveObject<PaddingBlockStart>;
183
- paddingBlockEnd?: PaddingBlockEnd | ResponsiveObject<PaddingBlockEnd>;
184
- paddingInline?: PaddingInline | ResponsiveObject<PaddingInline>;
185
- paddingInlineStart?: PaddingInlineStart | ResponsiveObject<PaddingInlineStart>;
186
- paddingInlineEnd?: PaddingInlineEnd | ResponsiveObject<PaddingInlineEnd>;
180
+ padding?: Padding;
181
+ paddingBlock?: PaddingBlock;
182
+ paddingBlockStart?: PaddingBlockStart;
183
+ paddingBlockEnd?: PaddingBlockEnd;
184
+ paddingInline?: PaddingInline;
185
+ paddingInlineStart?: PaddingInlineStart;
186
+ paddingInlineEnd?: PaddingInlineEnd;
187
187
  width?: Width;
188
188
  height?: Height;
189
- display?: Display | ResponsiveObject<Display>;
189
+ display?: Display;
190
190
  position?: Position;
191
191
  ref?: ComponentPropsWithRef<T>['ref'];
192
192
  };
@@ -275,9 +275,9 @@ type BorderWidth_2 = keyof typeof borderWidthMap_2;
275
275
 
276
276
  // @public (undocumented)
277
277
  const borderWidthMap: {
278
- readonly 'size.0': "var(--ds-width-0)";
279
- readonly 'size.050': "var(--ds-width-050)";
280
- readonly 'size.100': "var(--ds-width-100)";
278
+ readonly 'size.0': SerializedStyles;
279
+ readonly 'size.050': SerializedStyles;
280
+ readonly 'size.100': SerializedStyles;
281
281
  };
282
282
 
283
283
  // @public (undocumented)
@@ -290,17 +290,11 @@ const borderWidthMap_2: {
290
290
  // @public
291
291
  export const Box: BoxComponent;
292
292
 
293
- // @public (undocumented)
294
- const BOX_RESPONSIVE_PROPS: readonly ["borderWidth", "display", "padding", "paddingBlock", "paddingBlockStart", "paddingBlockEnd", "paddingInline", "paddingInlineStart", "paddingInlineEnd"];
295
-
296
293
  // @public (undocumented)
297
294
  type BoxComponent<T extends ElementType = 'div'> = (<T extends ElementType = 'div'>(props: BoxProps<T>) => ReactElement | null) & FC<BoxProps<T>>;
298
295
 
299
296
  // @public (undocumented)
300
- export type BoxProps<T extends ElementType = 'div'> = Omit<BaseBoxProps<T>, 'className' | BoxResponsiveProp> & PublicBoxPropsBase;
301
-
302
- // @public (undocumented)
303
- type BoxResponsiveProp = typeof BOX_RESPONSIVE_PROPS[number];
297
+ export type BoxProps<T extends ElementType = 'div'> = Omit<BaseBoxProps<T>, 'className'> & PublicBoxPropsBase;
304
298
 
305
299
  // @public (undocumented)
306
300
  type BoxStyles = SerializedStyles_2 & {
@@ -316,9 +310,6 @@ type BoxXCSS = {
316
310
  readonly styles: BoxStyles;
317
311
  };
318
312
 
319
- // @public
320
- type Breakpoint = 'lg' | 'md' | 'sm' | 'xl' | 'xs' | 'xxl' | 'xxs';
321
-
322
313
  // @public (undocumented)
323
314
  const dimensionMap: {
324
315
  readonly '100%': "100%";
@@ -336,11 +327,11 @@ type Display = keyof typeof displayMap;
336
327
 
337
328
  // @public (undocumented)
338
329
  const displayMap: {
339
- readonly block: "block";
340
- readonly inline: "inline";
341
- readonly flex: "flex";
342
- readonly 'inline-flex': "inline-flex";
343
- readonly 'inline-block': "inline-block";
330
+ readonly block: SerializedStyles;
331
+ readonly inline: SerializedStyles;
332
+ readonly flex: SerializedStyles;
333
+ readonly 'inline-flex': SerializedStyles;
334
+ readonly 'inline-block': SerializedStyles;
344
335
  };
345
336
 
346
337
  // @public (undocumented)
@@ -369,6 +360,12 @@ const flexShrinkMap: {
369
360
  readonly '1': SerializedStyles;
370
361
  };
371
362
 
363
+ // @public (undocumented)
364
+ type Gap = keyof typeof inlineSpaceMap.gap;
365
+
366
+ // @public (undocumented)
367
+ type Gap_2 = keyof typeof stackSpaceMap.gap;
368
+
372
369
  // @public (undocumented)
373
370
  type Grow = 'fill' | 'hug';
374
371
 
@@ -404,14 +401,34 @@ export interface InlineProps<T extends ElementType = 'div'> {
404
401
  children: ReactNode;
405
402
  grow?: Grow;
406
403
  ref?: ComponentPropsWithRef<T>['ref'];
407
- rowSpace?: RowSpace;
404
+ rowSpace?: RowGap;
408
405
  separator?: string;
409
406
  shouldWrap?: boolean;
410
- space?: Space;
407
+ space?: Gap;
411
408
  spread?: Spread;
412
409
  testId?: string;
413
410
  }
414
411
 
412
+ // @public
413
+ const inlineSpaceMap: {
414
+ [k: string]: {
415
+ readonly '0': SerializedStyles;
416
+ readonly '025': SerializedStyles;
417
+ readonly '050': SerializedStyles;
418
+ readonly '075': SerializedStyles;
419
+ readonly '100': SerializedStyles;
420
+ readonly '150': SerializedStyles;
421
+ readonly '200': SerializedStyles;
422
+ readonly '250': SerializedStyles;
423
+ readonly '300': SerializedStyles;
424
+ readonly '400': SerializedStyles;
425
+ readonly '500': SerializedStyles;
426
+ readonly '600': SerializedStyles;
427
+ readonly '800': SerializedStyles;
428
+ readonly '1000': SerializedStyles;
429
+ };
430
+ };
431
+
415
432
  // @public (undocumented)
416
433
  type InlineStyles = SerializedStyles_2 & {
417
434
  [inlineTag]: true;
@@ -476,45 +493,47 @@ const overflowMap: {
476
493
  };
477
494
 
478
495
  // @public (undocumented)
479
- type Padding = keyof typeof paddingMap;
496
+ type Padding = keyof typeof paddingMap.padding;
480
497
 
481
498
  // @public (undocumented)
482
499
  type Padding_2 = keyof typeof paddingMap_2;
483
500
 
484
501
  // @public (undocumented)
485
- type PaddingBlock = keyof typeof paddingMap;
502
+ type PaddingBlock = keyof typeof paddingMap.paddingBlock;
486
503
 
487
504
  // @public (undocumented)
488
- type PaddingBlockEnd = keyof typeof paddingMap;
505
+ type PaddingBlockEnd = keyof typeof paddingMap.paddingBlockEnd;
489
506
 
490
507
  // @public (undocumented)
491
- type PaddingBlockStart = keyof typeof paddingMap;
508
+ type PaddingBlockStart = keyof typeof paddingMap.paddingBlockStart;
492
509
 
493
510
  // @public (undocumented)
494
- type PaddingInline = keyof typeof paddingMap;
511
+ type PaddingInline = keyof typeof paddingMap.paddingInline;
495
512
 
496
513
  // @public (undocumented)
497
- type PaddingInlineEnd = keyof typeof paddingMap;
514
+ type PaddingInlineEnd = keyof typeof paddingMap.paddingInlineEnd;
498
515
 
499
516
  // @public (undocumented)
500
- type PaddingInlineStart = keyof typeof paddingMap;
517
+ type PaddingInlineStart = keyof typeof paddingMap.paddingInlineStart;
501
518
 
502
519
  // @public
503
520
  const paddingMap: {
504
- readonly 'space.0': "var(--ds-space-0)";
505
- readonly 'space.025': "var(--ds-space-025)";
506
- readonly 'space.050': "var(--ds-space-050)";
507
- readonly 'space.075': "var(--ds-space-075)";
508
- readonly 'space.100': "var(--ds-space-100)";
509
- readonly 'space.150': "var(--ds-space-150)";
510
- readonly 'space.200': "var(--ds-space-200)";
511
- readonly 'space.250': "var(--ds-space-250)";
512
- readonly 'space.300': "var(--ds-space-300)";
513
- readonly 'space.400': "var(--ds-space-400)";
514
- readonly 'space.500': "var(--ds-space-500)";
515
- readonly 'space.600': "var(--ds-space-600)";
516
- readonly 'space.800': "var(--ds-space-800)";
517
- readonly 'space.1000': "var(--ds-space-1000)";
521
+ [k: string]: {
522
+ readonly 'space.0': SerializedStyles;
523
+ readonly 'space.025': SerializedStyles;
524
+ readonly 'space.050': SerializedStyles;
525
+ readonly 'space.075': SerializedStyles;
526
+ readonly 'space.100': SerializedStyles;
527
+ readonly 'space.150': SerializedStyles;
528
+ readonly 'space.200': SerializedStyles;
529
+ readonly 'space.250': SerializedStyles;
530
+ readonly 'space.300': SerializedStyles;
531
+ readonly 'space.400': SerializedStyles;
532
+ readonly 'space.500': SerializedStyles;
533
+ readonly 'space.600': SerializedStyles;
534
+ readonly 'space.800': SerializedStyles;
535
+ readonly 'space.1000': SerializedStyles;
536
+ };
518
537
  };
519
538
 
520
539
  // @public (undocumented)
@@ -548,41 +567,11 @@ const positionMap: {
548
567
 
549
568
  // @public (undocumented)
550
569
  type PublicBoxPropsBase = {
551
- borderWidth?: BorderWidth;
552
- display?: Display;
553
- padding?: Padding;
554
- paddingBlock?: PaddingBlock;
555
- paddingBlockStart?: PaddingBlockStart;
556
- paddingBlockEnd?: PaddingBlockEnd;
557
- paddingInline?: PaddingInline;
558
- paddingInlineStart?: PaddingInlineStart;
559
- paddingInlineEnd?: PaddingInlineEnd;
560
570
  xcss?: BoxXCSS;
561
571
  };
562
572
 
563
- // @public
564
- type ResponsiveObject<T> = Partial<Record<Breakpoint, T>>;
565
-
566
573
  // @public (undocumented)
567
- type RowSpace = keyof typeof rowSpaceMap;
568
-
569
- // @public (undocumented)
570
- const rowSpaceMap: {
571
- readonly '0': SerializedStyles;
572
- readonly '025': SerializedStyles;
573
- readonly '050': SerializedStyles;
574
- readonly '075': SerializedStyles;
575
- readonly '100': SerializedStyles;
576
- readonly '150': SerializedStyles;
577
- readonly '200': SerializedStyles;
578
- readonly '250': SerializedStyles;
579
- readonly '300': SerializedStyles;
580
- readonly '400': SerializedStyles;
581
- readonly '500': SerializedStyles;
582
- readonly '600': SerializedStyles;
583
- readonly '800': SerializedStyles;
584
- readonly '1000': SerializedStyles;
585
- };
574
+ type RowGap = keyof typeof inlineSpaceMap.rowGap;
586
575
 
587
576
  // @public (undocumented)
588
577
  type SafeCSSObject = CSSPseudos & TokenisedProps & Omit<CSSPropertiesWithMultiValues, keyof TokenisedProps>;
@@ -602,48 +591,6 @@ const shadowMap: {
602
591
  readonly raised: SerializedStyles;
603
592
  };
604
593
 
605
- // @public (undocumented)
606
- type Space = keyof typeof spaceMap;
607
-
608
- // @public (undocumented)
609
- type Space_2 = keyof typeof spaceMap_2;
610
-
611
- // @public
612
- const spaceMap: {
613
- readonly '0': SerializedStyles;
614
- readonly '025': SerializedStyles;
615
- readonly '050': SerializedStyles;
616
- readonly '075': SerializedStyles;
617
- readonly '100': SerializedStyles;
618
- readonly '150': SerializedStyles;
619
- readonly '200': SerializedStyles;
620
- readonly '250': SerializedStyles;
621
- readonly '300': SerializedStyles;
622
- readonly '400': SerializedStyles;
623
- readonly '500': SerializedStyles;
624
- readonly '600': SerializedStyles;
625
- readonly '800': SerializedStyles;
626
- readonly '1000': SerializedStyles;
627
- };
628
-
629
- // @public
630
- const spaceMap_2: {
631
- readonly '0': SerializedStyles;
632
- readonly '025': SerializedStyles;
633
- readonly '050': SerializedStyles;
634
- readonly '075': SerializedStyles;
635
- readonly '100': SerializedStyles;
636
- readonly '150': SerializedStyles;
637
- readonly '200': SerializedStyles;
638
- readonly '250': SerializedStyles;
639
- readonly '300': SerializedStyles;
640
- readonly '400': SerializedStyles;
641
- readonly '500': SerializedStyles;
642
- readonly '600': SerializedStyles;
643
- readonly '800': SerializedStyles;
644
- readonly '1000': SerializedStyles;
645
- };
646
-
647
594
  // @public (undocumented)
648
595
  type Spread = 'space-between';
649
596
 
@@ -661,11 +608,31 @@ export interface StackProps<T extends ElementType = 'div'> {
661
608
  children: ReactNode;
662
609
  grow?: Grow_2;
663
610
  ref?: ComponentPropsWithRef<T>['ref'];
664
- space?: Space_2;
611
+ space?: Gap_2;
665
612
  spread?: Spread_2;
666
613
  testId?: string;
667
614
  }
668
615
 
616
+ // @public
617
+ const stackSpaceMap: {
618
+ [k: string]: {
619
+ readonly '0': SerializedStyles;
620
+ readonly '025': SerializedStyles;
621
+ readonly '050': SerializedStyles;
622
+ readonly '075': SerializedStyles;
623
+ readonly '100': SerializedStyles;
624
+ readonly '150': SerializedStyles;
625
+ readonly '200': SerializedStyles;
626
+ readonly '250': SerializedStyles;
627
+ readonly '300': SerializedStyles;
628
+ readonly '400': SerializedStyles;
629
+ readonly '500': SerializedStyles;
630
+ readonly '600': SerializedStyles;
631
+ readonly '800': SerializedStyles;
632
+ readonly '1000': SerializedStyles;
633
+ };
634
+ };
635
+
669
636
  // @public (undocumented)
670
637
  type TextColor = keyof typeof textColorMap;
671
638
 
@@ -1,8 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.BOX_RESPONSIVE_PROPS = void 0;
7
- var BOX_RESPONSIVE_PROPS = ['borderWidth', 'display', 'padding', 'paddingBlock', 'paddingBlockStart', 'paddingBlockEnd', 'paddingInline', 'paddingInlineStart', 'paddingInlineEnd'];
8
- exports.BOX_RESPONSIVE_PROPS = BOX_RESPONSIVE_PROPS;
@@ -1,16 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
- Object.defineProperty(exports, "__esModule", {
5
- value: true
6
- });
7
- exports.isStaticStyleProp = exports.isResponsiveStyleProp = void 0;
8
- var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
9
- var isResponsiveStyleProp = function isResponsiveStyleProp(propertyValue) {
10
- return (0, _typeof2.default)(propertyValue) === 'object';
11
- };
12
- exports.isResponsiveStyleProp = isResponsiveStyleProp;
13
- var isStaticStyleProp = function isStaticStyleProp(propertyValue) {
14
- return typeof propertyValue === 'string';
15
- };
16
- exports.isStaticStyleProp = isStaticStyleProp;
@@ -1 +0,0 @@
1
- export const BOX_RESPONSIVE_PROPS = ['borderWidth', 'display', 'padding', 'paddingBlock', 'paddingBlockStart', 'paddingBlockEnd', 'paddingInline', 'paddingInlineStart', 'paddingInlineEnd'];
@@ -1,2 +0,0 @@
1
- export const isResponsiveStyleProp = propertyValue => typeof propertyValue === 'object';
2
- export const isStaticStyleProp = propertyValue => typeof propertyValue === 'string';
@@ -1 +0,0 @@
1
- export var BOX_RESPONSIVE_PROPS = ['borderWidth', 'display', 'padding', 'paddingBlock', 'paddingBlockStart', 'paddingBlockEnd', 'paddingInline', 'paddingInlineStart', 'paddingInlineEnd'];
@@ -1,7 +0,0 @@
1
- import _typeof from "@babel/runtime/helpers/typeof";
2
- export var isResponsiveStyleProp = function isResponsiveStyleProp(propertyValue) {
3
- return _typeof(propertyValue) === 'object';
4
- };
5
- export var isStaticStyleProp = function isStaticStyleProp(propertyValue) {
6
- return typeof propertyValue === 'string';
7
- };
@@ -1,8 +0,0 @@
1
- import { SerializedStyles } from '@emotion/react';
2
- import { ResponsiveCSSObject, ResponsiveObject } from '../../helpers/responsive';
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 StaticResponsiveCSSObject = ResponsiveCSSObject & {
6
- static: SerializedStyles;
7
- };
8
- export declare type GenericPropertyValue = string | ResponsiveObject<string> | undefined;
@@ -1,3 +0,0 @@
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;