@atlaskit/tag-group - npm Package Compare versions

Comparing version 10.0.10 to 10.0.11

CHANGELOG.md

 # @atlaskit/tag-group
 
+## 10.0.11
+
+### Patch Changes
+
+- [`562a5b38aa9`](https://bitbucket.org/atlassian/atlassian-frontend/commits/562a5b38aa9) - Styles have been rewritten in preparation for migrating to compiled.
+
 ## 10.0.10
@@ -4,0 +10,0 @@

dist/cjs/TagGroup/index.js

@@ -12,12 +12,31 @@ "use strict";
 
-var _styles = require("./styles");
+/** @jsx jsx */
+var baseStyles = (0, _core.css)({
+  display: 'flex',
+  width: '100%',
+  flexWrap: 'wrap'
+});
+var justifyStartStyles = (0, _core.css)({
+  justifyContent: 'flex-start'
+});
+var justifyEndStyles = (0, _core.css)({
+  justifyContent: 'flex-end'
+});
+/**
+ * __Tag group__
+ *
+ * A tag group controls the layout and alignment for a collection of tags.
+ *
+ * - [Examples](https://atlassian.design/components/tag-group/examples)
+ * - [Code](https://atlassian.design/components/tag-group/code)
+ * - [Usage](https://atlassian.design/components/tag-group/usage)
+ */
 
-/** @jsx jsx */
-var TagGroup = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
-  var _props$alignment = props.alignment,
-      alignment = _props$alignment === void 0 ? 'start' : _props$alignment,
-      children = props.children;
+var TagGroup = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
+  var _ref$alignment = _ref.alignment,
+      alignment = _ref$alignment === void 0 ? 'start' : _ref$alignment,
+      children = _ref.children;
   return (0, _core.jsx)("div", {
     ref: ref,
-    css: (0, _styles.containerStyles)(alignment)
+    css: [baseStyles, alignment === 'start' && justifyStartStyles, alignment === 'end' && justifyEndStyles]
   }, children);
@@ -24,0 +43,0 @@ });

dist/cjs/version.json

 {
 	"name": "@atlaskit/tag-group",
-	"version": "10.0.10",
+	"version": "10.0.11",
 	"sideEffects": false
 }

dist/es2019/TagGroup/index.js

 /** @jsx jsx */
 import { forwardRef } from 'react';
-import { jsx } from '@emotion/core';
-import { containerStyles } from './styles';
-const TagGroup = /*#__PURE__*/forwardRef((props, ref) => {
-  const {
-    alignment = 'start',
-    children
-  } = props;
+import { css, jsx } from '@emotion/core';
+const baseStyles = css({
+  display: 'flex',
+  width: '100%',
+  flexWrap: 'wrap'
+});
+const justifyStartStyles = css({
+  justifyContent: 'flex-start'
+});
+const justifyEndStyles = css({
+  justifyContent: 'flex-end'
+});
+/**
+ * __Tag group__
+ *
+ * A tag group controls the layout and alignment for a collection of tags.
+ *
+ * - [Examples](https://atlassian.design/components/tag-group/examples)
+ * - [Code](https://atlassian.design/components/tag-group/code)
+ * - [Usage](https://atlassian.design/components/tag-group/usage)
+ */
+
+const TagGroup = /*#__PURE__*/forwardRef(({
+  alignment = 'start',
+  children
+}, ref) => {
   return jsx("div", {
     ref: ref,
-    css: containerStyles(alignment)
+    css: [baseStyles, alignment === 'start' && justifyStartStyles, alignment === 'end' && justifyEndStyles]
   }, children);
 });
 export default TagGroup;

dist/es2019/version.json

 {
 	"name": "@atlaskit/tag-group",
-	"version": "10.0.10",
+	"version": "10.0.11",
 	"sideEffects": false
 }

dist/esm/TagGroup/index.js

 /** @jsx jsx */
 import { forwardRef } from 'react';
-import { jsx } from '@emotion/core';
-import { containerStyles } from './styles';
-var TagGroup = /*#__PURE__*/forwardRef(function (props, ref) {
-  var _props$alignment = props.alignment,
-      alignment = _props$alignment === void 0 ? 'start' : _props$alignment,
-      children = props.children;
+import { css, jsx } from '@emotion/core';
+var baseStyles = css({
+  display: 'flex',
+  width: '100%',
+  flexWrap: 'wrap'
+});
+var justifyStartStyles = css({
+  justifyContent: 'flex-start'
+});
+var justifyEndStyles = css({
+  justifyContent: 'flex-end'
+});
+/**
+ * __Tag group__
+ *
+ * A tag group controls the layout and alignment for a collection of tags.
+ *
+ * - [Examples](https://atlassian.design/components/tag-group/examples)
+ * - [Code](https://atlassian.design/components/tag-group/code)
+ * - [Usage](https://atlassian.design/components/tag-group/usage)
+ */
+
+var TagGroup = /*#__PURE__*/forwardRef(function (_ref, ref) {
+  var _ref$alignment = _ref.alignment,
+      alignment = _ref$alignment === void 0 ? 'start' : _ref$alignment,
+      children = _ref.children;
   return jsx("div", {
     ref: ref,
-    css: containerStyles(alignment)
+    css: [baseStyles, alignment === 'start' && justifyStartStyles, alignment === 'end' && justifyEndStyles]
   }, children);
 });
 export default TagGroup;

dist/esm/version.json

 {
 	"name": "@atlaskit/tag-group",
-	"version": "10.0.10",
+	"version": "10.0.11",
 	"sideEffects": false
 }

dist/types/TagGroup/index.d.ts

 /** @jsx jsx */
 import { ReactNode } from 'react';
 declare type Alignment = 'start' | 'end';
-interface Props {
-    /** Whether the tags should be left-aligned or right-aligned. */
+interface TagGroupProps {
+    /**
+     * Whether the tags should be left-aligned or right-aligned.
+     */
     alignment?: Alignment;
-    /** Tags to render within the tag group. */
+    /**
+     * Tags to render within the tag group.
+     */
     children: ReactNode;
 }
-declare const TagGroup: import("react").ForwardRefExoticComponent<Props & import("react").RefAttributes<any>>;
+/**
+ * __Tag group__
+ *
+ * A tag group controls the layout and alignment for a collection of tags.
+ *
+ * - [Examples](https://atlassian.design/components/tag-group/examples)
+ * - [Code](https://atlassian.design/components/tag-group/code)
+ * - [Usage](https://atlassian.design/components/tag-group/usage)
+ */
+declare const TagGroup: import("react").ForwardRefExoticComponent<TagGroupProps & import("react").RefAttributes<any>>;
 export default TagGroup;

package.json

 {
   "name": "@atlaskit/tag-group",
-  "version": "10.0.10",
+  "version": "10.0.11",
   "description": "A tag group controls the layout and alignment for a collection of tags.",
@@ -16,3 +16,3 @@ "publishConfig": {
   "sideEffects": false,
-  "atlaskit:src": "src/index.ts",
+  "atlaskit:src": "src/index.tsx",
   "homepage": "https://atlassian.design/components/tag-group/",
@@ -22,3 +22,2 @@ "atlassian": {
     "deprecatedAutoEntryPoints": true,
-    "inPublicMirror": true,
     "releaseModel": "scheduled",
@@ -38,3 +37,2 @@ "website": {
     "@atlaskit/avatar": "^20.4.0",
-    "@atlaskit/build-utils": "*",
     "@atlaskit/docs": "*",
@@ -61,3 +59,8 @@ "@atlaskit/section-message": "^6.1.0",
       "theming": "tokens",
-      "deprecation": "no-deprecated-imports"
+      "deprecation": "no-deprecated-imports",
+      "styling": [
+        "emotion",
+        "static"
+      ],
+      "design-system": "v1"
     }
@@ -64,0 +67,0 @@ },

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

23014

increased by6.57%

Dev dependency count

13

decreased by-7.14%

Lines of code

164

increased by34.43%

Worsened metrics

Number of package files

16

decreased by-20%

No dependency changes