@synerise/ds-tag 1.1.18 → 1.2.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.
Files changed (6) hide show
  1. package/CHANGELOG.md +11 -0
  2. package/README.md +14 -13
  3. package/dist/Tag.d.ts +1 -1
  4. package/dist/Tag.js +7 -4
  5. package/dist/Tag.types.d.ts +2 -0
  6. package/package.json +3 -3
package/CHANGELOG.md CHANGED
@@ -3,6 +3,17 @@
3
3
  All notable changes to this project will be documented in this file.
4
4
  See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
5
5
 
6
+ # [1.2.0](https://github.com/Synerise/synerise-design/compare/@synerise/ds-tag@1.1.18...@synerise/ds-tag@1.2.0) (2025-09-19)
7
+
8
+
9
+ ### Features
10
+
11
+ * **tag:** Implementation Infocard in Tag component ([d1f31fa](https://github.com/Synerise/synerise-design/commit/d1f31fa44a73da3787df1966e2046c5a577afd96))
12
+
13
+
14
+
15
+
16
+
6
17
  ## [1.1.18](https://github.com/Synerise/synerise-design/compare/@synerise/ds-tag@1.1.17...@synerise/ds-tag@1.1.18) (2025-09-16)
7
18
 
8
19
  **Note:** Version bump only for package @synerise/ds-tag
package/README.md CHANGED
@@ -28,19 +28,20 @@ import Tag from '@synerise/ds-tag'
28
28
 
29
29
  ## API
30
30
 
31
- | Property | Description | Type | Default |
32
- | --------- | ---------------------------------------- | --------------------------------- | ---------------------- |
33
- | className | tag container class | string | - |
34
- | color | primary color (background/border) of tag | string | - |
35
- | disabled | whether tag should be disabled | boolean | - |
36
- | id | id of tag (necessary if using Tags) | string / number | - |
37
- | name | title of tag | string | - |
38
- | onClick | onClick event on tag body | () => void | - |
39
- | onRemove | callback when tag is removed | (tagKey: string / number) => void | - |
40
- | removable | show remove button | boolean | - |
41
- | shape | shape of the tag | TagShape | TagShape.DEFAULT_ROUND |
42
- | textColor | color of tag name label | string | - |
43
- | dashed | make border dashed | boolean | - |
31
+ | Property | Description | Type | Default |
32
+ |--------------|-------------------------------------------------|-----------------------------------|------------------------|
33
+ | className | tag container class | string | - |
34
+ | color | primary color (background/border) of tag | string | - |
35
+ | disabled | whether tag should be disabled | boolean | - |
36
+ | id | id of tag (necessary if using Tags) | string / number | - |
37
+ | name | title of tag | string | - |
38
+ | onClick | onClick event on tag body | () => void | - |
39
+ | onRemove | callback when tag is removed | (tagKey: string / number) => void | - |
40
+ | removable | show remove button | boolean | - |
41
+ | shape | shape of the tag | TagShape | TagShape.DEFAULT_ROUND |
42
+ | textColor | color of tag name label | string | - |
43
+ | dashed | make border dashed | boolean | - |
44
+ | tooltipProps | tooltip to show over entire tag. see ds-tooltip | TooltipProps | |
44
45
 
45
46
  ## TagShape Enum
46
47
 
package/dist/Tag.d.ts CHANGED
@@ -1,4 +1,4 @@
1
1
  import React from 'react';
2
2
  import { type TagProps } from './Tag.types';
3
- declare const Tag: ({ id, name, className, disabled, removable, image, shape, color, textColor, onRemove, onClick, prefixel, suffixel, texts, asPill, dashed, ...htmlAttributes }: TagProps) => React.JSX.Element;
3
+ declare const Tag: ({ id, name, className, disabled, removable, image, shape, color, textColor, onRemove, onClick, prefixel, suffixel, texts, asPill, dashed, tooltipProps, ...htmlAttributes }: TagProps) => React.JSX.Element;
4
4
  export default Tag;
package/dist/Tag.js CHANGED
@@ -1,8 +1,8 @@
1
- var _excluded = ["id", "name", "className", "disabled", "removable", "image", "shape", "color", "textColor", "onRemove", "onClick", "prefixel", "suffixel", "texts", "asPill", "dashed"];
1
+ var _excluded = ["id", "name", "className", "disabled", "removable", "image", "shape", "color", "textColor", "onRemove", "onClick", "prefixel", "suffixel", "texts", "asPill", "dashed", "tooltipProps"];
2
2
  function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
3
3
  function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
4
4
  import React, { useState } from 'react';
5
- import { theme } from '@synerise/ds-core';
5
+ import { useTheme } from '@synerise/ds-core';
6
6
  import Icon, { CloseS } from '@synerise/ds-icon';
7
7
  import Tooltip from '@synerise/ds-tooltip';
8
8
  import * as S from './Tag.styles';
@@ -26,7 +26,9 @@ var Tag = function Tag(_ref) {
26
26
  texts = _ref.texts,
27
27
  asPill = _ref.asPill,
28
28
  dashed = _ref.dashed,
29
+ tooltipProps = _ref.tooltipProps,
29
30
  htmlAttributes = _objectWithoutPropertiesLoose(_ref, _excluded);
31
+ var theme = useTheme();
30
32
  var isDefaultType = shape && [TagShape.DEFAULT_ROUND, TagShape.DEFAULT_SQUARE].includes(shape);
31
33
  var isDefaultRound = shape === TagShape.DEFAULT_ROUND;
32
34
  var isDefaultSquare = shape === TagShape.DEFAULT_SQUARE;
@@ -63,7 +65,7 @@ var Tag = function Tag(_ref) {
63
65
  setIsIconHovered(false);
64
66
  htmlAttributes.onMouseLeave == null || htmlAttributes.onMouseLeave(event);
65
67
  };
66
- return /*#__PURE__*/React.createElement(S.Tag, _extends({
68
+ var renderedTag = /*#__PURE__*/React.createElement(S.Tag, _extends({
67
69
  className: "ds-tag " + (className != null ? className : ''),
68
70
  isStatusShape: isStatusShape,
69
71
  shape: shape,
@@ -87,7 +89,7 @@ var Tag = function Tag(_ref) {
87
89
  alt: ""
88
90
  }), !!prefixel && renderPrefixel(), /*#__PURE__*/React.createElement(S.TagName, null, name), !!suffixel && renderSuffixel(), isRemovable && /*#__PURE__*/React.createElement(Tooltip, {
89
91
  title: (texts == null ? void 0 : texts.deleteTooltip) || 'Delete',
90
- visible: isIconHovered
92
+ open: isIconHovered
91
93
  }, /*#__PURE__*/React.createElement(S.RemoveButton, {
92
94
  onClick: onRemoveCall,
93
95
  onMouseOver: handleMouseOver,
@@ -99,5 +101,6 @@ var Tag = function Tag(_ref) {
99
101
  size: 24,
100
102
  color: getColorText(theme, color)
101
103
  })))));
104
+ return tooltipProps ? /*#__PURE__*/React.createElement(Tooltip, tooltipProps, renderedTag) : renderedTag;
102
105
  };
103
106
  export default Tag;
package/dist/Tag.types.d.ts CHANGED
@@ -1,4 +1,5 @@
1
1
  import type { ReactNode } from 'react';
2
+ import { type TooltipProps } from '@synerise/ds-tooltip';
2
3
  import type { WithHTMLAttributes } from '@synerise/ds-utils';
3
4
  export type TagTexts = {
4
5
  addButtonLabel?: ReactNode;
@@ -27,6 +28,7 @@ export type TagProps = WithHTMLAttributes<HTMLDivElement, {
27
28
  texts?: TagTexts;
28
29
  asPill?: boolean;
29
30
  dashed?: boolean;
31
+ tooltipProps?: TooltipProps;
30
32
  }>;
31
33
  export declare enum TagShape {
32
34
  SINGLE_CHARACTER_ROUND = "single_character_round",
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@synerise/ds-tag",
3
- "version": "1.1.18",
3
+ "version": "1.2.0",
4
4
  "description": "Tag UI Component for the Synerise Design System",
5
5
  "license": "ISC",
6
6
  "repository": "Synerise/synerise-design",
@@ -36,7 +36,7 @@
36
36
  "types": "dist/index.d.ts",
37
37
  "dependencies": {
38
38
  "@synerise/ds-icon": "^1.7.2",
39
- "@synerise/ds-tooltip": "^1.1.18",
39
+ "@synerise/ds-tooltip": "^1.2.0",
40
40
  "@synerise/ds-utils": "^1.4.2"
41
41
  },
42
42
  "peerDependencies": {
@@ -44,5 +44,5 @@
44
44
  "react": ">=16.9.0 <= 18.3.1",
45
45
  "styled-components": "^5.3.3"
46
46
  },
47
- "gitHead": "5beb6ab5f2d77b9e98e04caab7dff20b8436078b"
47
+ "gitHead": "5029af8713235b315d36bb3c73363f2feca86da0"
48
48
  }