@zendeskgarden/react-tags 9.0.0-next.7 → 9.0.0-next.9

package/dist/esm/elements/Avatar.js

@@ -0,0 +1,16 @@
+/**
+* Copyright Zendesk, Inc.
+*
+* Use of this source code is governed under the Apache License, Version 2.0
+* found at http://www.apache.org/licenses/LICENSE-2.0.
+*/
+import React__default from 'react';
+import '../styled/StyledTag.js';
+import { StyledAvatar } from '../styled/StyledAvatar.js';
+import '../styled/StyledClose.js';
+
+const AvatarComponent = props => React__default.createElement(StyledAvatar, props);
+AvatarComponent.displayName = 'Tag.Avatar';
+const Avatar = AvatarComponent;
+
+export { Avatar };

package/dist/esm/elements/Close.js

@@ -0,0 +1,27 @@
+/**
+* Copyright Zendesk, Inc.
+*
+* Use of this source code is governed under the Apache License, Version 2.0
+* found at http://www.apache.org/licenses/LICENSE-2.0.
+*/
+import React__default, { forwardRef } from 'react';
+import '../styled/StyledTag.js';
+import '../styled/StyledAvatar.js';
+import { StyledClose } from '../styled/StyledClose.js';
+import SvgXStroke from '../node_modules/@zendeskgarden/svg-icons/src/12/x-stroke.svg.js';
+import { useText } from '@zendeskgarden/react-theming';
+
+const CloseComponent = forwardRef((props, ref) => {
+  const ariaLabel = useText(CloseComponent, props, 'aria-label', 'Remove');
+  return React__default.createElement(StyledClose, Object.assign({
+    ref: ref,
+    "aria-label": ariaLabel
+  }, props, {
+    type: "button",
+    tabIndex: -1
+  }), React__default.createElement(SvgXStroke, null));
+});
+CloseComponent.displayName = 'Tag.Close';
+const Close = CloseComponent;
+
+export { Close };

package/dist/esm/elements/Tag.js

@@ -0,0 +1,43 @@
+/**
+* Copyright Zendesk, Inc.
+*
+* Use of this source code is governed under the Apache License, Version 2.0
+* found at http://www.apache.org/licenses/LICENSE-2.0.
+*/
+import React__default, { forwardRef } from 'react';
+import PropTypes from 'prop-types';
+import { SIZE } from '../types/index.js';
+import { StyledTag } from '../styled/StyledTag.js';
+import '../styled/StyledAvatar.js';
+import '../styled/StyledClose.js';
+import { Close } from './Close.js';
+import { Avatar } from './Avatar.js';
+
+const TagComponent = forwardRef((_ref, ref) => {
+  let {
+    size,
+    hue,
+    ...otherProps
+  } = _ref;
+  return React__default.createElement(StyledTag, Object.assign({
+    ref: ref,
+    size: size,
+    hue: hue
+  }, otherProps));
+});
+TagComponent.displayName = 'Tag';
+TagComponent.propTypes = {
+  size: PropTypes.oneOf(SIZE),
+  hue: PropTypes.string,
+  isPill: PropTypes.bool,
+  isRound: PropTypes.bool,
+  isRegular: PropTypes.bool
+};
+TagComponent.defaultProps = {
+  size: 'medium'
+};
+const Tag = TagComponent;
+Tag.Avatar = Avatar;
+Tag.Close = Close;
+
+export { Tag };

package/dist/esm/index.js

@@ -0,0 +1,7 @@
+/**
+* Copyright Zendesk, Inc.
+*
+* Use of this source code is governed under the Apache License, Version 2.0
+* found at http://www.apache.org/licenses/LICENSE-2.0.
+*/
+export { Tag } from './elements/Tag.js';

package/dist/esm/node_modules/@zendeskgarden/svg-icons/src/12/x-stroke.svg.js

@@ -0,0 +1,26 @@
+/**
+* Copyright Zendesk, Inc.
+*
+* Use of this source code is governed under the Apache License, Version 2.0
+* found at http://www.apache.org/licenses/LICENSE-2.0.
+*/
+import * as React from 'react';
+
+var _path;
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+var SvgXStroke = function SvgXStroke(props) {
+  return /*#__PURE__*/React.createElement("svg", _extends({
+    xmlns: "http://www.w3.org/2000/svg",
+    width: 12,
+    height: 12,
+    focusable: "false",
+    viewBox: "0 0 12 12",
+    "aria-hidden": "true"
+  }, props), _path || (_path = /*#__PURE__*/React.createElement("path", {
+    stroke: "currentColor",
+    strokeLinecap: "round",
+    d: "M3 9l6-6m0 6L3 3"
+  })));
+};
+
+export { SvgXStroke as default };

package/dist/esm/styled/StyledAvatar.js

@@ -0,0 +1,22 @@
+/**
+* Copyright Zendesk, Inc.
+*
+* Use of this source code is governed under the Apache License, Version 2.0
+* found at http://www.apache.org/licenses/LICENSE-2.0.
+*/
+import styled from 'styled-components';
+import { StyledBaseIcon, retrieveComponentStyles, DEFAULT_THEME } from '@zendeskgarden/react-theming';
+
+const COMPONENT_ID = 'tags.avatar';
+const StyledAvatar = styled(StyledBaseIcon).attrs({
+  'data-garden-id': COMPONENT_ID,
+  'data-garden-version': '9.0.0-next.9'
+}).withConfig({
+  displayName: "StyledAvatar",
+  componentId: "sc-3kdmgt-0"
+})(["flex-shrink:0;font-size:0;", ";"], props => retrieveComponentStyles(COMPONENT_ID, props));
+StyledAvatar.defaultProps = {
+  theme: DEFAULT_THEME
+};
+
+export { StyledAvatar };

package/dist/esm/styled/StyledClose.js

@@ -0,0 +1,22 @@
+/**
+* Copyright Zendesk, Inc.
+*
+* Use of this source code is governed under the Apache License, Version 2.0
+* found at http://www.apache.org/licenses/LICENSE-2.0.
+*/
+import styled from 'styled-components';
+import { retrieveComponentStyles, DEFAULT_THEME } from '@zendeskgarden/react-theming';
+
+const COMPONENT_ID = 'tags.close';
+const StyledClose = styled.button.attrs({
+  'data-garden-id': COMPONENT_ID,
+  'data-garden-version': '9.0.0-next.9'
+}).withConfig({
+  displayName: "StyledClose",
+  componentId: "sc-d6lrpn-0"
+})(["display:flex;flex-shrink:0;align-items:center;justify-content:center;transition:opacity 0.25s ease-in-out;opacity:0.8;border:0;background:transparent;cursor:pointer;padding:0;color:inherit;font-size:0;appearance:none;&:hover{opacity:0.9;}&:focus{outline:none;}", ";"], props => retrieveComponentStyles(COMPONENT_ID, props));
+StyledClose.defaultProps = {
+  theme: DEFAULT_THEME
+};
+
+export { StyledClose };

package/dist/{index.esm.js → esm/styled/StyledTag.js}

@@ -1,63 +1,14 @@
 /**
- * Copyright Zendesk, Inc.
- *
- * Use of this source code is governed under the Apache License, Version 2.0
- * found at http://www.apache.org/licenses/LICENSE-2.0.
- */
-
-import * as React from 'react';
-import React__default, { Children, forwardRef } from 'react';
-import PropTypes from 'prop-types';
+* Copyright Zendesk, Inc.
+*
+* Use of this source code is governed under the Apache License, Version 2.0
+* found at http://www.apache.org/licenses/LICENSE-2.0.
+*/
 import styled, { css } from 'styled-components';
 import { readableColor, math } from 'polished';
-import { retrieveComponentStyles, DEFAULT_THEME, SELECTOR_FOCUS_VISIBLE, getColorV8, focusStyles, getLineHeight, useText } from '@zendeskgarden/react-theming';
-
-function _extends$1() {
-  _extends$1 = Object.assign ? Object.assign.bind() : function (target) {
-    for (var i = 1; i < arguments.length; i++) {
-      var source = arguments[i];
-      for (var key in source) {
-        if (Object.prototype.hasOwnProperty.call(source, key)) {
-          target[key] = source[key];
-        }
-      }
-    }
-    return target;
-  };
-  return _extends$1.apply(this, arguments);
-}
-
-const SIZE = ['small', 'medium', 'large'];
-
-const COMPONENT_ID$2 = 'tags.avatar';
-const StyledAvatar = styled(_ref => {
-  let {
-    children,
-    ...props
-  } = _ref;
-  return React__default.cloneElement(Children.only(children), props);
-}).attrs({
-  'data-garden-id': COMPONENT_ID$2,
-  'data-garden-version': '9.0.0-next.7'
-}).withConfig({
-  displayName: "StyledAvatar",
-  componentId: "sc-3kdmgt-0"
-})(["flex-shrink:0;font-size:0;", ";"], props => retrieveComponentStyles(COMPONENT_ID$2, props));
-StyledAvatar.defaultProps = {
-  theme: DEFAULT_THEME
-};
-
-const COMPONENT_ID$1 = 'tags.close';
-const StyledClose = styled.button.attrs({
-  'data-garden-id': COMPONENT_ID$1,
-  'data-garden-version': '9.0.0-next.7'
-}).withConfig({
-  displayName: "StyledClose",
-  componentId: "sc-d6lrpn-0"
-})(["display:flex;flex-shrink:0;align-items:center;justify-content:center;transition:opacity 0.25s ease-in-out;opacity:0.8;border:0;background:transparent;cursor:pointer;padding:0;color:inherit;font-size:0;appearance:none;&:hover{opacity:0.9;}&:focus{outline:none;}", ";"], props => retrieveComponentStyles(COMPONENT_ID$1, props));
-StyledClose.defaultProps = {
-  theme: DEFAULT_THEME
-};
+import { SELECTOR_FOCUS_VISIBLE, retrieveComponentStyles, DEFAULT_THEME, getColorV8, focusStyles, getLineHeight } from '@zendeskgarden/react-theming';
+import { StyledAvatar } from './StyledAvatar.js';
+import { StyledClose } from './StyledClose.js';
 
 const COMPONENT_ID = 'tags.tag_view';
 const colorStyles = props => {
@@ -133,7 +84,7 @@ const sizeStyles = props => {
 };
 const StyledTag = styled.div.attrs({
   'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.0.0-next.7'
+  'data-garden-version': '9.0.0-next.9'
 }).withConfig({
   displayName: "StyledTag",
   componentId: "sc-1jvbe03-0"
@@ -143,65 +94,4 @@ StyledTag.defaultProps = {
   theme: DEFAULT_THEME
 };
 
-var _path;
-function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-var SvgXStroke = function SvgXStroke(props) {
-  return /*#__PURE__*/React.createElement("svg", _extends({
-    xmlns: "http://www.w3.org/2000/svg",
-    width: 12,
-    height: 12,
-    focusable: "false",
-    viewBox: "0 0 12 12",
-    "aria-hidden": "true"
-  }, props), _path || (_path = /*#__PURE__*/React.createElement("path", {
-    stroke: "currentColor",
-    strokeLinecap: "round",
-    d: "M3 9l6-6m0 6L3 3"
-  })));
-};
-
-const CloseComponent = forwardRef((props, ref) => {
-  const ariaLabel = useText(CloseComponent, props, 'aria-label', 'Remove');
-  return React__default.createElement(StyledClose, _extends$1({
-    ref: ref,
-    "aria-label": ariaLabel
-  }, props, {
-    type: "button",
-    tabIndex: -1
-  }), React__default.createElement(SvgXStroke, null));
-});
-CloseComponent.displayName = 'Tag.Close';
-const Close = CloseComponent;
-
-const AvatarComponent = props => React__default.createElement(StyledAvatar, props);
-AvatarComponent.displayName = 'Tag.Avatar';
-const Avatar = AvatarComponent;
-
-const TagComponent = forwardRef((_ref, ref) => {
-  let {
-    size,
-    hue,
-    ...otherProps
-  } = _ref;
-  return React__default.createElement(StyledTag, _extends$1({
-    ref: ref,
-    size: size,
-    hue: hue
-  }, otherProps));
-});
-TagComponent.displayName = 'Tag';
-TagComponent.propTypes = {
-  size: PropTypes.oneOf(SIZE),
-  hue: PropTypes.string,
-  isPill: PropTypes.bool,
-  isRound: PropTypes.bool,
-  isRegular: PropTypes.bool
-};
-TagComponent.defaultProps = {
-  size: 'medium'
-};
-const Tag = TagComponent;
-Tag.Avatar = Avatar;
-Tag.Close = Close;
-
-export { Tag };
+export { StyledTag };

package/dist/esm/types/index.js

@@ -0,0 +1,9 @@
+/**
+* Copyright Zendesk, Inc.
+*
+* Use of this source code is governed under the Apache License, Version 2.0
+* found at http://www.apache.org/licenses/LICENSE-2.0.
+*/
+const SIZE = ['small', 'medium', 'large'];
+
+export { SIZE };

package/dist/index.cjs.js

@@ -1,10 +1,9 @@
 /**
- * Copyright Zendesk, Inc.
- *
- * Use of this source code is governed under the Apache License, Version 2.0
- * found at http://www.apache.org/licenses/LICENSE-2.0.
- */
-
+* Copyright Zendesk, Inc.
+*
+* Use of this source code is governed under the Apache License, Version 2.0
+* found at http://www.apache.org/licenses/LICENSE-2.0.
+*/
 'use strict';
 
 var React = require('react');
@@ -37,33 +36,12 @@ var React__namespace = /*#__PURE__*/_interopNamespace(React);
 var PropTypes__default = /*#__PURE__*/_interopDefault(PropTypes);
 var styled__default = /*#__PURE__*/_interopDefault(styled);
 
-function _extends$1() {
-  _extends$1 = Object.assign ? Object.assign.bind() : function (target) {
-    for (var i = 1; i < arguments.length; i++) {
-      var source = arguments[i];
-      for (var key in source) {
-        if (Object.prototype.hasOwnProperty.call(source, key)) {
-          target[key] = source[key];
-        }
-      }
-    }
-    return target;
-  };
-  return _extends$1.apply(this, arguments);
-}
-
 const SIZE = ['small', 'medium', 'large'];
 
 const COMPONENT_ID$2 = 'tags.avatar';
-const StyledAvatar = styled__default.default(_ref => {
-  let {
-    children,
-    ...props
-  } = _ref;
-  return React__namespace.default.cloneElement(React.Children.only(children), props);
-}).attrs({
+const StyledAvatar = styled__default.default(reactTheming.StyledBaseIcon).attrs({
   'data-garden-id': COMPONENT_ID$2,
-  'data-garden-version': '9.0.0-next.7'
+  'data-garden-version': '9.0.0-next.9'
 }).withConfig({
   displayName: "StyledAvatar",
   componentId: "sc-3kdmgt-0"
@@ -75,7 +53,7 @@ StyledAvatar.defaultProps = {
 const COMPONENT_ID$1 = 'tags.close';
 const StyledClose = styled__default.default.button.attrs({
   'data-garden-id': COMPONENT_ID$1,
-  'data-garden-version': '9.0.0-next.7'
+  'data-garden-version': '9.0.0-next.9'
 }).withConfig({
   displayName: "StyledClose",
   componentId: "sc-d6lrpn-0"
@@ -158,7 +136,7 @@ const sizeStyles = props => {
 };
 const StyledTag = styled__default.default.div.attrs({
   'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.0.0-next.7'
+  'data-garden-version': '9.0.0-next.9'
 }).withConfig({
   displayName: "StyledTag",
   componentId: "sc-1jvbe03-0"
@@ -187,7 +165,7 @@ var SvgXStroke = function SvgXStroke(props) {
 
 const CloseComponent = React.forwardRef((props, ref) => {
   const ariaLabel = reactTheming.useText(CloseComponent, props, 'aria-label', 'Remove');
-  return React__namespace.default.createElement(StyledClose, _extends$1({
+  return React__namespace.default.createElement(StyledClose, Object.assign({
     ref: ref,
     "aria-label": ariaLabel
   }, props, {
@@ -208,7 +186,7 @@ const TagComponent = React.forwardRef((_ref, ref) => {
     hue,
     ...otherProps
   } = _ref;
-  return React__namespace.default.createElement(StyledTag, _extends$1({
+  return React__namespace.default.createElement(StyledTag, Object.assign({
     ref: ref,
     size: size,
     hue: hue

package/dist/typings/styled/StyledAvatar.d.ts

@@ -4,8 +4,8 @@
  * Use of this source code is governed under the Apache License, Version 2.0
  * found at http://www.apache.org/licenses/LICENSE-2.0.
  */
-import React from 'react';
-export declare const StyledAvatar: import("styled-components").StyledComponent<({ children, ...props }: any) => React.DetailedReactHTMLElement<any, HTMLElement>, import("styled-components").DefaultTheme, {
+/// <reference types="react" />
+export declare const StyledAvatar: import("styled-components").StyledComponent<({ children, theme, ...props }: any) => import("react").DetailedReactHTMLElement<any, HTMLElement>, import("styled-components").DefaultTheme, {
     'data-garden-id': string;
     'data-garden-version': string;
 }, "data-garden-id" | "data-garden-version">;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zendeskgarden/react-tags",
-  "version": "9.0.0-next.7",
+  "version": "9.0.0-next.9",
   "description": "Components relating to tags in the Garden Design System",
   "license": "Apache-2.0",
   "author": "Zendesk Garden <garden@zendesk.com>",
@@ -10,7 +10,7 @@
     "url": "https://github.com/zendeskgarden/react-components/issues"
   },
   "main": "dist/index.cjs.js",
-  "module": "dist/index.esm.js",
+  "module": "dist/esm/index.js",
   "files": [
     "dist"
   ],
@@ -26,13 +26,13 @@
     "prop-types": "^15.5.7"
   },
   "peerDependencies": {
-    "@zendeskgarden/react-theming": "^9.0.0",
+    "@zendeskgarden/react-theming": ">=9.0.0-next",
     "react": ">=16.8.0",
     "react-dom": ">=16.8.0",
     "styled-components": "^5.3.1"
   },
   "devDependencies": {
-    "@zendeskgarden/react-theming": "^9.0.0-next.7",
+    "@zendeskgarden/react-theming": "^9.0.0-next.9",
     "@zendeskgarden/svg-icons": "7.0.0"
   },
   "keywords": [
@@ -45,5 +45,5 @@
     "access": "public"
   },
   "zendeskgarden:src": "src/index.ts",
-  "gitHead": "50a2b45b2e237a490a6d460818d33498b92479ec"
+  "gitHead": "771281b562d376a6aee04b0cd71dd888b3ae4a1d"
 }