@atlaskit/primitives 8.0.1 → 8.2.0

package/CHANGELOG.md

@@ -1,5 +1,25 @@
 # @atlaskit/primitives
 
+## 8.2.0
+
+### Minor Changes
+
+- [#114203](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/114203)
+  [`fb57afa892329`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/fb57afa892329) -
+  Added `:visited:hover` XCSS pseudo combination.
+
+## 8.1.0
+
+### Minor Changes
+
+- [#113286](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/113286)
+  [`7c318f9ea8f09`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/7c318f9ea8f09) -
+  Added support for skeleton color tokens as XCSS background colors.
+
+### Patch Changes
+
+- Updated dependencies
+
 ## 8.0.1
 
 ### Patch Changes

package/constellation/box/usage.mdx

@@ -21,7 +21,8 @@ section wrappers.
 Box, being generic in nature, can be "over-used", so it’s important to consider situations where
 more specific and expressive primitives could be used. For example, use
 [inline](/components/primitives/inline/usage) and [stack](/components/primitives/stack/usage) to
-manage horizontal and vertical layouts, respectively.
+manage horizontal and vertical layouts, or [pressable](/components/primitives/pressable/usage) to
+build custom buttons.
 
 ## Styling
 
@@ -41,4 +42,5 @@ Display behavior is set by using the available props or using
 
 - [Manage horizontal layout using an inline component](/components/primitives/inline/usage)
 - [Manage vertical layout using a stack component](/components/primitives/stack/usage)
+- [Build custom buttons using a pressable component](/components/primitives/pressable/usage)
 - [Use design tokens in code with XCSS](/components/primitives/XCSS/usage)

package/constellation/overview/index.mdx

@@ -42,6 +42,10 @@ Additional layouts not well-expressed by these core primitives can also be compo
 - CSS Grid (see [grid](/components/primitives/grid))
 - Bleed (see [bleed](/components/primitives/bleed))
 
+Interactive primitives can be used to build:
+
+- buttons (see [pressable](/components/primitives/pressable))
+
 ## Installation
 
 To install primitive components, add @atlaskit/primitives as a dependency on your project:
@@ -92,4 +96,5 @@ and vertical `Stack` components.
 - [Grid](/components/primitives/grid/examples)
 - [Bleed](/components/primitives/bleed/examples)
 - [Flex](/components/primitives/flex/examples)
+- [Pressable](/components/primitives/pressable/examples)
 - [xcss](/components/primitives/xcss/usage)

package/dist/cjs/components/anchor.js

@@ -88,7 +88,7 @@ var AnchorNoRef = function AnchorNoRef(_ref, ref) {
     action: 'clicked',
     componentName: componentName || 'Anchor',
     packageName: "@atlaskit/primitives",
-    packageVersion: "8.0.1",
+    packageVersion: "8.2.0",
     analyticsData: analyticsContext,
     actionSubject: 'link'
   });

package/dist/cjs/components/pressable.js

@@ -81,7 +81,7 @@ var Pressable = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
     action: 'clicked',
     componentName: componentName || 'Pressable',
     packageName: "@atlaskit/primitives",
-    packageVersion: "8.0.1",
+    packageVersion: "8.2.0",
     analyticsData: analyticsContext,
     actionSubject: 'button'
   });

package/dist/es2019/components/anchor.js

@@ -74,7 +74,7 @@ const AnchorNoRef = ({
     action: 'clicked',
     componentName: componentName || 'Anchor',
     packageName: "@atlaskit/primitives",
-    packageVersion: "8.0.1",
+    packageVersion: "8.2.0",
     analyticsData: analyticsContext,
     actionSubject: 'link'
   });

package/dist/es2019/components/pressable.js

@@ -67,7 +67,7 @@ const Pressable = /*#__PURE__*/forwardRef(({
     action: 'clicked',
     componentName: componentName || 'Pressable',
     packageName: "@atlaskit/primitives",
-    packageVersion: "8.0.1",
+    packageVersion: "8.2.0",
     analyticsData: analyticsContext,
     actionSubject: 'button'
   });

package/dist/esm/components/anchor.js

@@ -78,7 +78,7 @@ var AnchorNoRef = function AnchorNoRef(_ref, ref) {
     action: 'clicked',
     componentName: componentName || 'Anchor',
     packageName: "@atlaskit/primitives",
-    packageVersion: "8.0.1",
+    packageVersion: "8.2.0",
     analyticsData: analyticsContext,
     actionSubject: 'link'
   });

package/dist/esm/components/pressable.js

@@ -71,7 +71,7 @@ var Pressable = /*#__PURE__*/forwardRef(function (_ref, ref) {
     action: 'clicked',
     componentName: componentName || 'Pressable',
     packageName: "@atlaskit/primitives",
-    packageVersion: "8.0.1",
+    packageVersion: "8.2.0",
     analyticsData: analyticsContext,
     actionSubject: 'button'
   });

package/dist/types/xcss/xcss.d.ts

@@ -1645,7 +1645,7 @@ type AllMedia = MediaQuery | '@media screen and (forced-colors: active), screen
 type CSSMediaQueries = {
     [MQ in AllMedia]?: Omit<SafeCSSObject, AllMedia>;
 };
-type ChainedCSSPseudos = ':visited:active' | ':active:visited' | ':hover::before' | ':hover::after' | ':focus-visible::before' | ':focus-visible::after' | ':focus:not(:focus-visible)';
+type ChainedCSSPseudos = ':visited:active' | ':visited:hover' | ':active:visited' | ':hover::before' | ':hover::after' | ':focus-visible::before' | ':focus-visible::after' | ':focus:not(:focus-visible)';
 type CSSPseudos = {
     [Pseudo in CSS.Pseudos | ChainedCSSPseudos]?: Omit<SafeCSSObject, CSS.Pseudos | AllMedia>;
 };

package/dist/types-ts4.5/xcss/xcss.d.ts

@@ -1645,7 +1645,7 @@ type AllMedia = MediaQuery | '@media screen and (forced-colors: active), screen
 type CSSMediaQueries = {
     [MQ in AllMedia]?: Omit<SafeCSSObject, AllMedia>;
 };
-type ChainedCSSPseudos = ':visited:active' | ':active:visited' | ':hover::before' | ':hover::after' | ':focus-visible::before' | ':focus-visible::after' | ':focus:not(:focus-visible)';
+type ChainedCSSPseudos = ':visited:active' | ':visited:hover' | ':active:visited' | ':hover::before' | ':hover::after' | ':focus-visible::before' | ':focus-visible::after' | ':focus:not(:focus-visible)';
 type CSSPseudos = {
     [Pseudo in CSS.Pseudos | ChainedCSSPseudos]?: Omit<SafeCSSObject, CSS.Pseudos | AllMedia>;
 };

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/primitives",
-	"version": "8.0.1",
+	"version": "8.2.0",
 	"description": "Primitives are token-backed low-level building blocks.",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -128,7 +128,7 @@
 		"@atlaskit/css": "^0.3.0",
 		"@atlaskit/ds-lib": "^2.3.0",
 		"@atlaskit/interaction-context": "^2.1.0",
-		"@atlaskit/tokens": "^1.52.0",
+		"@atlaskit/tokens": "^1.53.0",
 		"@atlaskit/visually-hidden": "^1.4.0",
 		"@babel/runtime": "^7.0.0",
 		"@emotion/react": "^11.7.1",