@instructure/ui-tag 8.14.0 → 8.14.1-snapshot.17

package/LICENSE.md

@@ -0,0 +1,27 @@
+---
+title: The MIT License (MIT)
+category: Getting Started
+order: 9
+---
+
+# The MIT License (MIT)
+
+Copyright (c) 2015 Instructure, Inc.
+
+**Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions.**
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/es/Tag/index.js

@@ -26,7 +26,7 @@ var _dec, _dec2, _class, _class2, _temp;
 
 /** @jsx jsx */
 import React, { Component } from 'react';
-import { IconXSolid } from '@instructure/ui-icons';
+import { IconXLine } from '@instructure/ui-icons';
 import { View } from '@instructure/ui-view';
 import { omitProps } from '@instructure/ui-react-utils';
 import { isActiveElement } from '@instructure/ui-dom-utils';
@@ -115,7 +115,7 @@ let Tag = (_dec = withStyle(generateStyle, generateComponentTheme), _dec2 = test
       title: title || (typeof text === 'string' ? text : void 0)
     }), jsx("span", {
       css: styles === null || styles === void 0 ? void 0 : styles.text
-    }, text), onClick && dismissible ? jsx(IconXSolid, {
+    }, text), onClick && dismissible ? jsx(IconXLine, {
       css: styles === null || styles === void 0 ? void 0 : styles.icon
     }) : null);
   }

package/es/Tag/styles.js

@@ -61,7 +61,7 @@ const generateStyle = (componentTheme, props) => {
         lineHeight: `calc(${componentTheme.heightMedium} - (${componentTheme.defaultBorderWidth} * 2))`
       },
       icon: {
-        fontSize: '0.75rem'
+        fontSize: '0.875rem'
       }
     },
     large: {
@@ -73,7 +73,7 @@ const generateStyle = (componentTheme, props) => {
         lineHeight: `calc(${componentTheme.heightLarge} - (${componentTheme.defaultBorderWidth} * 2))`
       },
       icon: {
-        fontSize: '0.875rem'
+        fontSize: '1rem'
       }
     }
   };
@@ -209,7 +209,6 @@ const generateStyle = (componentTheme, props) => {
       label: 'tag__icon',
       marginInlineStart: componentTheme.iconMargin,
       marginInlineEnd: 0,
-      transform: 'translateY(0.0625rem)',
       transition: `all ${componentTheme.transitionTiming}`,
       cursor: 'pointer',
       ...sizeVariants[size].icon,

package/es/Tag/theme.js

@@ -88,7 +88,7 @@ const generateComponentTheme = theme => {
     focusOutlineWidth: borders.widthMedium,
     focusOutlineStyle: borders.style,
     maxWidth: '10rem',
-    iconMargin: spacing.small,
+    iconMargin: spacing.xSmall,
     transitionTiming: '0.2s',
     ...tagVariant('default', {
       borderColor: colors.borderMedium,

package/lib/Tag/index.js

@@ -11,7 +11,7 @@ exports.default = exports.Tag = void 0;
 
 var _react = _interopRequireWildcard(require("react"));
 
-var _IconXSolid = require("@instructure/ui-icons/lib/IconXSolid.js");
+var _IconXLine = require("@instructure/ui-icons/lib/IconXLine.js");
 
 var _View = require("@instructure/ui-view/lib/View");
 
@@ -112,7 +112,7 @@ let Tag = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default), _dec
       title: title || (typeof text === 'string' ? text : void 0)
     }), (0, _emotion.jsx)("span", {
       css: styles === null || styles === void 0 ? void 0 : styles.text
-    }, text), onClick && dismissible ? (0, _emotion.jsx)(_IconXSolid.IconXSolid, {
+    }, text), onClick && dismissible ? (0, _emotion.jsx)(_IconXLine.IconXLine, {
       css: styles === null || styles === void 0 ? void 0 : styles.icon
     }) : null);
   }

package/lib/Tag/styles.js

@@ -68,7 +68,7 @@ const generateStyle = (componentTheme, props) => {
         lineHeight: `calc(${componentTheme.heightMedium} - (${componentTheme.defaultBorderWidth} * 2))`
       },
       icon: {
-        fontSize: '0.75rem'
+        fontSize: '0.875rem'
       }
     },
     large: {
@@ -80,7 +80,7 @@ const generateStyle = (componentTheme, props) => {
         lineHeight: `calc(${componentTheme.heightLarge} - (${componentTheme.defaultBorderWidth} * 2))`
       },
       icon: {
-        fontSize: '0.875rem'
+        fontSize: '1rem'
       }
     }
   };
@@ -216,7 +216,6 @@ const generateStyle = (componentTheme, props) => {
       label: 'tag__icon',
       marginInlineStart: componentTheme.iconMargin,
       marginInlineEnd: 0,
-      transform: 'translateY(0.0625rem)',
       transition: `all ${componentTheme.transitionTiming}`,
       cursor: 'pointer',
       ...sizeVariants[size].icon,

package/lib/Tag/theme.js

@@ -96,7 +96,7 @@ const generateComponentTheme = theme => {
     focusOutlineWidth: borders.widthMedium,
     focusOutlineStyle: borders.style,
     maxWidth: '10rem',
-    iconMargin: spacing.small,
+    iconMargin: spacing.xSmall,
     transitionTiming: '0.2s',
     ...tagVariant('default', {
       borderColor: colors.borderMedium,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@instructure/ui-tag",
-  "version": "8.14.0",
+  "version": "8.14.1-snapshot.17+737c5b359",
   "description": "A tag component",
   "author": "Instructure, Inc. Engineering and Product Design",
   "type": "commonjs",
@@ -25,22 +25,22 @@
   "license": "MIT",
   "dependencies": {
     "@babel/runtime": "^7.13.10",
-    "@instructure/console": "8.14.0",
-    "@instructure/emotion": "8.14.0",
-    "@instructure/shared-types": "8.14.0",
-    "@instructure/ui-color-utils": "8.14.0",
-    "@instructure/ui-dom-utils": "8.14.0",
-    "@instructure/ui-icons": "8.14.0",
-    "@instructure/ui-react-utils": "8.14.0",
-    "@instructure/ui-testable": "8.14.0",
-    "@instructure/ui-view": "8.14.0",
+    "@instructure/console": "8.14.1-snapshot.17+737c5b359",
+    "@instructure/emotion": "8.14.1-snapshot.17+737c5b359",
+    "@instructure/shared-types": "8.14.1-snapshot.17+737c5b359",
+    "@instructure/ui-color-utils": "8.14.1-snapshot.17+737c5b359",
+    "@instructure/ui-dom-utils": "8.14.1-snapshot.17+737c5b359",
+    "@instructure/ui-icons": "8.14.1-snapshot.17+737c5b359",
+    "@instructure/ui-react-utils": "8.14.1-snapshot.17+737c5b359",
+    "@instructure/ui-testable": "8.14.1-snapshot.17+737c5b359",
+    "@instructure/ui-view": "8.14.1-snapshot.17+737c5b359",
     "prop-types": "^15"
   },
   "devDependencies": {
-    "@instructure/ui-babel-preset": "8.14.0",
-    "@instructure/ui-test-locator": "8.14.0",
-    "@instructure/ui-test-utils": "8.14.0",
-    "@instructure/ui-themes": "8.14.0"
+    "@instructure/ui-babel-preset": "8.14.1-snapshot.17+737c5b359",
+    "@instructure/ui-test-locator": "8.14.1-snapshot.17+737c5b359",
+    "@instructure/ui-test-utils": "8.14.1-snapshot.17+737c5b359",
+    "@instructure/ui-themes": "8.14.1-snapshot.17+737c5b359"
   },
   "peerDependencies": {
     "react": ">=16.8 <=17"
@@ -48,5 +48,6 @@
   "publishConfig": {
     "access": "public"
   },
-  "sideEffects": false
+  "sideEffects": false,
+  "gitHead": "737c5b359b44421c8a6f91c31d55f1579d8c96d9"
 }

package/src/Tag/index.tsx

@@ -24,7 +24,7 @@
 /** @jsx jsx */
 import React, { Component } from 'react'
 
-import { IconXSolid } from '@instructure/ui-icons'
+import { IconXLine } from '@instructure/ui-icons'
 import { View } from '@instructure/ui-view'
 import type { ViewProps } from '@instructure/ui-view'
 import { omitProps } from '@instructure/ui-react-utils'
@@ -129,7 +129,7 @@ class Tag extends Component<TagProps> {
         title={title || (typeof text === 'string' ? text : undefined)}
       >
         <span css={styles?.text}>{text}</span>
-        {onClick && dismissible ? <IconXSolid css={styles?.icon} /> : null}
+        {onClick && dismissible ? <IconXLine css={styles?.icon} /> : null}
       </View>
     )
   }

package/src/Tag/styles.ts

@@ -59,7 +59,7 @@ const generateStyle = (componentTheme: TagTheme, props: TagProps): TagStyle => {
       text: {
         lineHeight: `calc(${componentTheme.heightMedium} - (${componentTheme.defaultBorderWidth} * 2))`
       },
-      icon: { fontSize: '0.75rem' }
+      icon: { fontSize: '0.875rem' }
     },
     large: {
       tag: {
@@ -69,7 +69,7 @@ const generateStyle = (componentTheme: TagTheme, props: TagProps): TagStyle => {
       text: {
         lineHeight: `calc(${componentTheme.heightLarge} - (${componentTheme.defaultBorderWidth} * 2))`
       },
-      icon: { fontSize: '0.875rem' }
+      icon: { fontSize: '1rem' }
     }
   }
 
@@ -213,7 +213,6 @@ const generateStyle = (componentTheme: TagTheme, props: TagProps): TagStyle => {
       label: 'tag__icon',
       marginInlineStart: componentTheme.iconMargin,
       marginInlineEnd: 0,
-      transform: 'translateY(0.0625rem)',
       transition: `all ${componentTheme.transitionTiming}`,
       cursor: 'pointer',
       ...sizeVariants[size!].icon,

package/src/Tag/theme.ts

@@ -118,7 +118,7 @@ const generateComponentTheme = (theme: Theme): TagTheme => {
     focusOutlineWidth: borders.widthMedium,
     focusOutlineStyle: borders.style,
     maxWidth: '10rem',
-    iconMargin: spacing.small,
+    iconMargin: spacing.xSmall,
     transitionTiming: '0.2s',
 
     ...tagVariant('default', {