@atlaskit/primitives 0.6.0 → 0.7.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 (62) hide show
  1. package/.eslintrc.js +3 -0
  2. package/CHANGELOG.md +8 -0
  3. package/dist/cjs/components/box.js +3 -40
  4. package/dist/cjs/components/inline.partial.js +1 -0
  5. package/dist/cjs/components/internal/base-box.js +61 -0
  6. package/dist/cjs/components/stack.partial.js +1 -0
  7. package/dist/cjs/internal/style-maps.partial.js +370 -0
  8. package/dist/cjs/internal/xcss.js +17 -7
  9. package/dist/cjs/version.json +1 -1
  10. package/dist/es2019/components/box.js +1 -37
  11. package/dist/es2019/components/inline.partial.js +1 -0
  12. package/dist/es2019/components/internal/base-box.js +52 -0
  13. package/dist/es2019/components/stack.partial.js +1 -0
  14. package/dist/es2019/internal/style-maps.partial.js +341 -0
  15. package/dist/es2019/internal/xcss.js +13 -7
  16. package/dist/es2019/version.json +1 -1
  17. package/dist/esm/components/box.js +2 -40
  18. package/dist/esm/components/inline.partial.js +1 -0
  19. package/dist/esm/components/internal/base-box.js +53 -0
  20. package/dist/esm/components/stack.partial.js +1 -0
  21. package/dist/esm/internal/style-maps.partial.js +340 -0
  22. package/dist/esm/internal/xcss.js +17 -7
  23. package/dist/esm/version.json +1 -1
  24. package/dist/types/components/box.d.ts +1 -1
  25. package/dist/types/components/internal/base-box.d.ts +83 -0
  26. package/dist/types/components/types.d.ts +1 -1
  27. package/dist/types/internal/style-maps.partial.d.ts +396 -0
  28. package/dist/types/internal/xcss.d.ts +5 -5
  29. package/package.json +2 -1
  30. package/report.api.md +206 -327
  31. package/scripts/__tests__/__snapshots__/codegen.test.tsx.snap +313 -363
  32. package/scripts/border-codegen-template.tsx +79 -0
  33. package/scripts/codegen-file-templates/align-self.tsx +9 -0
  34. package/scripts/codegen-file-templates/border-style.tsx +6 -0
  35. package/scripts/codegen-file-templates/dimensions.tsx +17 -0
  36. package/scripts/codegen-file-templates/display.tsx +6 -0
  37. package/scripts/codegen-file-templates/flex-grow.tsx +6 -0
  38. package/scripts/codegen-file-templates/flex-shrink.tsx +6 -0
  39. package/scripts/codegen-file-templates/flex.tsx +5 -0
  40. package/scripts/codegen-file-templates/layer.tsx +13 -0
  41. package/scripts/codegen-file-templates/overflow.tsx +20 -0
  42. package/scripts/codegen-file-templates/position.tsx +8 -0
  43. package/scripts/codegen-styles.tsx +80 -120
  44. package/scripts/color-codegen-template.tsx +9 -19
  45. package/scripts/misc-codegen-template.tsx +20 -40
  46. package/scripts/spacing-codegen-template.tsx +5 -12
  47. package/scripts/utils.tsx +15 -4
  48. package/tmp/api-report-tmp.d.ts +201 -326
  49. package/dist/cjs/components/internal/base-box.partial.js +0 -825
  50. package/dist/cjs/internal/color-map.js +0 -42
  51. package/dist/cjs/internal/style-maps.js +0 -130
  52. package/dist/es2019/components/internal/base-box.partial.js +0 -842
  53. package/dist/es2019/internal/color-map.js +0 -35
  54. package/dist/es2019/internal/style-maps.js +0 -117
  55. package/dist/esm/components/internal/base-box.partial.js +0 -820
  56. package/dist/esm/internal/color-map.js +0 -35
  57. package/dist/esm/internal/style-maps.js +0 -117
  58. package/dist/types/components/internal/base-box.partial.d.ts +0 -521
  59. package/dist/types/internal/color-map.d.ts +0 -36
  60. package/dist/types/internal/style-maps.d.ts +0 -151
  61. package/scripts/color-map-template.tsx +0 -52
  62. package/scripts/dimension-codegen-template.tsx +0 -75
@@ -1,42 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.default = void 0;
7
- /**
8
- * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
9
- *
10
- * The color map is used to map a background color token to a matching text color that will meet contrast.
11
- *
12
- * @codegen <<SignedSource::d168519874a16bbb92cfbfd4747a39b4>>
13
- * @codegenCommand yarn codegen-styles
14
- * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-light.tsx <<SignedSource::10aa7e87eca39e4d6594a764e78e0698>>
15
- */
16
- var _default = {
17
- 'neutral.bold': 'inverse',
18
- 'neutral.bold.hovered': 'inverse',
19
- 'neutral.bold.pressed': 'inverse',
20
- 'selected.bold': 'inverse',
21
- 'selected.bold.hovered': 'inverse',
22
- 'selected.bold.pressed': 'inverse',
23
- 'brand.bold': 'inverse',
24
- 'brand.bold.hovered': 'inverse',
25
- 'brand.bold.pressed': 'inverse',
26
- 'danger.bold': 'inverse',
27
- 'danger.bold.hovered': 'inverse',
28
- 'danger.bold.pressed': 'inverse',
29
- 'warning.bold': 'warning.inverse',
30
- 'warning.bold.hovered': 'warning.inverse',
31
- 'warning.bold.pressed': 'warning.inverse',
32
- 'success.bold': 'inverse',
33
- 'success.bold.hovered': 'inverse',
34
- 'success.bold.pressed': 'inverse',
35
- 'discovery.bold': 'inverse',
36
- 'discovery.bold.hovered': 'inverse',
37
- 'discovery.bold.pressed': 'inverse',
38
- 'information.bold': 'inverse',
39
- 'information.bold.hovered': 'inverse',
40
- 'information.bold.pressed': 'inverse'
41
- };
42
- exports.default = _default;
@@ -1,130 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.textColorMap = exports.paddingMap = exports.dimensionMap = exports.borderWidthMap = exports.borderRadiusMap = exports.borderColorMap = exports.backgroundColorMap = void 0;
7
- /* eslint-disable @atlaskit/design-system/no-unsafe-design-token-usage */
8
-
9
- // TODO: All of these maps need to be codegen'd
10
- var backgroundColorMap = {
11
- disabled: "var(--ds-background-disabled, #091e4289)",
12
- input: "var(--ds-background-input, #FAFBFC)",
13
- 'inverse.subtle': "var(--ds-background-inverse-subtle, #00000029)",
14
- neutral: "var(--ds-background-neutral, #DFE1E6)",
15
- 'neutral.subtle': "var(--ds-background-neutral-subtle, transparent)",
16
- 'neutral.bold': "var(--ds-background-neutral-bold, #42526E)",
17
- selected: "var(--ds-background-selected, #DEEBFF)",
18
- 'selected.bold': "var(--ds-background-selected-bold, #0052CC)",
19
- 'brand.bold': "var(--ds-background-brand-bold, #0052CC)",
20
- danger: "var(--ds-background-danger, #FFEBE6)",
21
- 'danger.bold': "var(--ds-background-danger-bold, #DE350B)",
22
- warning: "var(--ds-background-warning, #FFFAE6)",
23
- 'warning.bold': "var(--ds-background-warning-bold, #FFAB00)",
24
- success: "var(--ds-background-success, #E3FCEF)",
25
- 'success.bold': "var(--ds-background-success-bold, #00875A)",
26
- discovery: "var(--ds-background-discovery, #EAE6FF)",
27
- 'discovery.bold': "var(--ds-background-discovery-bold, #5243AA)",
28
- information: "var(--ds-background-information, #DEEBFF)",
29
- 'information.bold': "var(--ds-background-information-bold, #0052CC)",
30
- 'color.blanket': "var(--ds-blanket, #091e4289)",
31
- 'color.blanket.selected': "var(--ds-blanket-selected, #388BFF14)",
32
- 'color.blanket.danger': "var(--ds-blanket-danger, #EF5C4814)",
33
- 'elevation.surface': "var(--ds-surface, #FFFFFF)",
34
- 'elevation.surface.overlay': "var(--ds-surface-overlay, #FFFFFF)",
35
- 'elevation.surface.raised': "var(--ds-surface-raised, #FFFFFF)",
36
- 'elevation.surface.sunken': "var(--ds-surface-sunken, #F4F5F7)"
37
- };
38
- exports.backgroundColorMap = backgroundColorMap;
39
- var borderColorMap = {
40
- 'color.border': "var(--ds-border, #091e4221)",
41
- disabled: "var(--ds-border-disabled, #FAFBFC)",
42
- focused: "var(--ds-border-focused, #4C9AFF)",
43
- input: "var(--ds-border-input, #FAFBFC)",
44
- inverse: "var(--ds-border-inverse, #FFFFFF)",
45
- selected: "var(--ds-border-selected, #0052CC)",
46
- brand: "var(--ds-border-brand, #0052CC)",
47
- danger: "var(--ds-border-danger, #FF5630)",
48
- warning: "var(--ds-border-warning, #FFC400)",
49
- success: "var(--ds-border-success, #00875A)",
50
- discovery: "var(--ds-border-discovery, #998DD9)",
51
- information: "var(--ds-border-information, #0065FF)",
52
- bold: "var(--ds-border-bold, #344563)"
53
- };
54
- exports.borderColorMap = borderColorMap;
55
- var borderWidthMap = {
56
- 'size.0': "var(--ds-width-0, 0)",
57
- 'size.050': "var(--ds-width-050, 1px)",
58
- 'size.100': "var(--ds-width-100, 2px)"
59
- };
60
- exports.borderWidthMap = borderWidthMap;
61
- var borderRadiusMap = {
62
- 'radius.400': "var(--ds-radius-400, 16px)",
63
- 'radius.300': "var(--ds-radius-300, 12px)",
64
- 'radius.100': "var(--ds-radius-100, 4px)",
65
- 'radius.050': "var(--ds-radius-050, 2px)",
66
- 'radius.200': "var(--ds-radius-200, 8px)"
67
- };
68
- exports.borderRadiusMap = borderRadiusMap;
69
- var paddingMap = {
70
- 'space.0': "var(--ds-space-0, 0px)",
71
- 'space.025': "var(--ds-space-025, 2px)",
72
- 'space.050': "var(--ds-space-050, 4px)",
73
- 'space.075': "var(--ds-space-075, 6px)",
74
- 'space.100': "var(--ds-space-100, 8px)",
75
- 'space.150': "var(--ds-space-150, 12px)",
76
- 'space.200': "var(--ds-space-200, 16px)",
77
- 'space.250': "var(--ds-space-250, 20px)",
78
- 'space.300': "var(--ds-space-300, 24px)",
79
- 'space.400': "var(--ds-space-400, 32px)",
80
- 'space.500': "var(--ds-space-500, 40px)",
81
- 'space.600': "var(--ds-space-600, 48px)",
82
- 'space.800': "var(--ds-space-800, 64px)",
83
- 'space.1000': "var(--ds-space-1000, 80px)"
84
- };
85
- exports.paddingMap = paddingMap;
86
- var textColorMap = {
87
- 'color.text': "var(--ds-text, #172B4D)",
88
- 'accent.red': "var(--ds-text-accent-red, #DE350B)",
89
- 'accent.red.bolder': "var(--ds-text-accent-red-bolder, #BF2600)",
90
- 'accent.orange': "var(--ds-text-accent-orange, #F18D13)",
91
- 'accent.orange.bolder': "var(--ds-text-accent-orange-bolder, #B65C02)",
92
- 'accent.yellow': "var(--ds-text-accent-yellow, #FF991F)",
93
- 'accent.yellow.bolder': "var(--ds-text-accent-yellow-bolder, #FF8B00)",
94
- 'accent.green': "var(--ds-text-accent-green, #00875A)",
95
- 'accent.green.bolder': "var(--ds-text-accent-green-bolder, #006644)",
96
- 'accent.teal': "var(--ds-text-accent-teal, #00A3BF)",
97
- 'accent.teal.bolder': "var(--ds-text-accent-teal-bolder, #008DA6)",
98
- 'accent.blue': "var(--ds-text-accent-blue, #0052CC)",
99
- 'accent.blue.bolder': "var(--ds-text-accent-blue-bolder, #0747A6)",
100
- 'accent.purple': "var(--ds-text-accent-purple, #5243AA)",
101
- 'accent.purple.bolder': "var(--ds-text-accent-purple-bolder, #403294)",
102
- 'accent.magenta': "var(--ds-text-accent-magenta, #E774BB)",
103
- 'accent.magenta.bolder': "var(--ds-text-accent-magenta-bolder, #DA62AC)",
104
- 'accent.gray': "var(--ds-text-accent-gray, #505F79)",
105
- 'accent.gray.bolder': "var(--ds-text-accent-gray-bolder, #172B4D)",
106
- disabled: "var(--ds-text-disabled, #A5ADBA)",
107
- inverse: "var(--ds-text-inverse, #FFFFFF)",
108
- selected: "var(--ds-text-selected, #0052CC)",
109
- brand: "var(--ds-text-brand, #0065FF)",
110
- danger: "var(--ds-text-danger, #DE350B)",
111
- warning: "var(--ds-text-warning, #974F0C)",
112
- 'warning.inverse': "var(--ds-text-warning-inverse, #172B4D)",
113
- success: "var(--ds-text-success, #006644)",
114
- discovery: "var(--ds-text-discovery, #403294)",
115
- information: "var(--ds-text-information, #0052CC)",
116
- subtlest: "var(--ds-text-subtlest, #7A869A)",
117
- subtle: "var(--ds-text-subtle, #42526E)"
118
- };
119
- exports.textColorMap = textColorMap;
120
- var dimensionMap = {
121
- '100%': '100%',
122
- 'size.100': '16px',
123
- 'size.200': '24px',
124
- 'size.300': '32px',
125
- 'size.400': '40px',
126
- 'size.500': '48px',
127
- 'size.600': '96px',
128
- 'size.1000': '192px'
129
- };
130
- exports.dimensionMap = dimensionMap;