@atlaskit/primitives 8.0.1 → 8.1.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.
- package/CHANGELOG.md +12 -0
- package/constellation/box/usage.mdx +3 -1
- package/constellation/overview/index.mdx +5 -0
- package/dist/cjs/components/anchor.js +1 -1
- package/dist/cjs/components/pressable.js +1 -1
- package/dist/es2019/components/anchor.js +1 -1
- package/dist/es2019/components/pressable.js +1 -1
- package/dist/esm/components/anchor.js +1 -1
- package/dist/esm/components/pressable.js +1 -1
- package/package.json +2 -2
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,17 @@
|
|
|
1
1
|
# @atlaskit/primitives
|
|
2
2
|
|
|
3
|
+
## 8.1.0
|
|
4
|
+
|
|
5
|
+
### Minor Changes
|
|
6
|
+
|
|
7
|
+
- [#113286](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/113286)
|
|
8
|
+
[`7c318f9ea8f09`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/7c318f9ea8f09) -
|
|
9
|
+
Added support for skeleton color tokens as XCSS background colors.
|
|
10
|
+
|
|
11
|
+
### Patch Changes
|
|
12
|
+
|
|
13
|
+
- Updated dependencies
|
|
14
|
+
|
|
3
15
|
## 8.0.1
|
|
4
16
|
|
|
5
17
|
### Patch Changes
|
|
@@ -21,7 +21,8 @@ section wrappers.
|
|
|
21
21
|
Box, being generic in nature, can be "over-used", so it’s important to consider situations where
|
|
22
22
|
more specific and expressive primitives could be used. For example, use
|
|
23
23
|
[inline](/components/primitives/inline/usage) and [stack](/components/primitives/stack/usage) to
|
|
24
|
-
manage horizontal and vertical layouts,
|
|
24
|
+
manage horizontal and vertical layouts, or [pressable](/components/primitives/pressable/usage) to
|
|
25
|
+
build custom buttons.
|
|
25
26
|
|
|
26
27
|
## Styling
|
|
27
28
|
|
|
@@ -41,4 +42,5 @@ Display behavior is set by using the available props or using
|
|
|
41
42
|
|
|
42
43
|
- [Manage horizontal layout using an inline component](/components/primitives/inline/usage)
|
|
43
44
|
- [Manage vertical layout using a stack component](/components/primitives/stack/usage)
|
|
45
|
+
- [Build custom buttons using a pressable component](/components/primitives/pressable/usage)
|
|
44
46
|
- [Use design tokens in code with XCSS](/components/primitives/XCSS/usage)
|
|
@@ -42,6 +42,10 @@ Additional layouts not well-expressed by these core primitives can also be compo
|
|
|
42
42
|
- CSS Grid (see [grid](/components/primitives/grid))
|
|
43
43
|
- Bleed (see [bleed](/components/primitives/bleed))
|
|
44
44
|
|
|
45
|
+
Interactive primitives can be used to build:
|
|
46
|
+
|
|
47
|
+
- buttons (see [pressable](/components/primitives/pressable))
|
|
48
|
+
|
|
45
49
|
## Installation
|
|
46
50
|
|
|
47
51
|
To install primitive components, add @atlaskit/primitives as a dependency on your project:
|
|
@@ -92,4 +96,5 @@ and vertical `Stack` components.
|
|
|
92
96
|
- [Grid](/components/primitives/grid/examples)
|
|
93
97
|
- [Bleed](/components/primitives/bleed/examples)
|
|
94
98
|
- [Flex](/components/primitives/flex/examples)
|
|
99
|
+
- [Pressable](/components/primitives/pressable/examples)
|
|
95
100
|
- [xcss](/components/primitives/xcss/usage)
|
|
@@ -88,7 +88,7 @@ var AnchorNoRef = function AnchorNoRef(_ref, ref) {
|
|
|
88
88
|
action: 'clicked',
|
|
89
89
|
componentName: componentName || 'Anchor',
|
|
90
90
|
packageName: "@atlaskit/primitives",
|
|
91
|
-
packageVersion: "8.0
|
|
91
|
+
packageVersion: "8.1.0",
|
|
92
92
|
analyticsData: analyticsContext,
|
|
93
93
|
actionSubject: 'link'
|
|
94
94
|
});
|
|
@@ -81,7 +81,7 @@ var Pressable = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
|
|
|
81
81
|
action: 'clicked',
|
|
82
82
|
componentName: componentName || 'Pressable',
|
|
83
83
|
packageName: "@atlaskit/primitives",
|
|
84
|
-
packageVersion: "8.0
|
|
84
|
+
packageVersion: "8.1.0",
|
|
85
85
|
analyticsData: analyticsContext,
|
|
86
86
|
actionSubject: 'button'
|
|
87
87
|
});
|
|
@@ -67,7 +67,7 @@ const Pressable = /*#__PURE__*/forwardRef(({
|
|
|
67
67
|
action: 'clicked',
|
|
68
68
|
componentName: componentName || 'Pressable',
|
|
69
69
|
packageName: "@atlaskit/primitives",
|
|
70
|
-
packageVersion: "8.0
|
|
70
|
+
packageVersion: "8.1.0",
|
|
71
71
|
analyticsData: analyticsContext,
|
|
72
72
|
actionSubject: 'button'
|
|
73
73
|
});
|
|
@@ -78,7 +78,7 @@ var AnchorNoRef = function AnchorNoRef(_ref, ref) {
|
|
|
78
78
|
action: 'clicked',
|
|
79
79
|
componentName: componentName || 'Anchor',
|
|
80
80
|
packageName: "@atlaskit/primitives",
|
|
81
|
-
packageVersion: "8.0
|
|
81
|
+
packageVersion: "8.1.0",
|
|
82
82
|
analyticsData: analyticsContext,
|
|
83
83
|
actionSubject: 'link'
|
|
84
84
|
});
|
|
@@ -71,7 +71,7 @@ var Pressable = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
71
71
|
action: 'clicked',
|
|
72
72
|
componentName: componentName || 'Pressable',
|
|
73
73
|
packageName: "@atlaskit/primitives",
|
|
74
|
-
packageVersion: "8.0
|
|
74
|
+
packageVersion: "8.1.0",
|
|
75
75
|
analyticsData: analyticsContext,
|
|
76
76
|
actionSubject: 'button'
|
|
77
77
|
});
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/primitives",
|
|
3
|
-
"version": "8.0
|
|
3
|
+
"version": "8.1.0",
|
|
4
4
|
"description": "Primitives are token-backed low-level building blocks.",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"registry": "https://registry.npmjs.org/"
|
|
@@ -128,7 +128,7 @@
|
|
|
128
128
|
"@atlaskit/css": "^0.3.0",
|
|
129
129
|
"@atlaskit/ds-lib": "^2.3.0",
|
|
130
130
|
"@atlaskit/interaction-context": "^2.1.0",
|
|
131
|
-
"@atlaskit/tokens": "^1.
|
|
131
|
+
"@atlaskit/tokens": "^1.53.0",
|
|
132
132
|
"@atlaskit/visually-hidden": "^1.4.0",
|
|
133
133
|
"@babel/runtime": "^7.0.0",
|
|
134
134
|
"@emotion/react": "^11.7.1",
|