@clayui/badge 3.159.0 → 3.161.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 (4) hide show
  1. package/lib/cjs/index.js +45 -3
  2. package/lib/esm/index.js +45 -3
  3. package/lib/index.d.ts +16 -1
  4. package/package.json +3 -2
package/lib/cjs/index.js CHANGED
@@ -28,17 +28,53 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
28
28
  var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
29
29
  var src_exports = {};
30
30
  __export(src_exports, {
31
+ ItemAfter: () => ItemAfter,
32
+ ItemBefore: () => ItemBefore,
33
+ ItemExpand: () => ItemExpand,
31
34
  default: () => src_default
32
35
  });
33
36
  module.exports = __toCommonJS(src_exports);
37
+ var import_icon = __toESM(require("@clayui/icon"));
34
38
  var import_classnames = __toESM(require("classnames"));
35
39
  var import_react = __toESM(require("react"));
36
- const Badge = import_react.default.forwardRef(
40
+ const ItemAfter = import_react.default.forwardRef(({ children, className, ...otherProps }, ref) => /* @__PURE__ */ import_react.default.createElement(
41
+ "span",
42
+ {
43
+ ...otherProps,
44
+ className: (0, import_classnames.default)(className, "badge-item badge-item-after"),
45
+ ref
46
+ },
47
+ children
48
+ ));
49
+ ItemAfter.displayName = "ClayBadgeItemAfter";
50
+ const ItemBefore = import_react.default.forwardRef(({ children, className, ...otherProps }, ref) => /* @__PURE__ */ import_react.default.createElement(
51
+ "span",
52
+ {
53
+ ...otherProps,
54
+ className: (0, import_classnames.default)(className, "badge-item badge-item-before"),
55
+ ref
56
+ },
57
+ children
58
+ ));
59
+ ItemBefore.displayName = "ClayBadgeItemBefore";
60
+ const ItemExpand = import_react.default.forwardRef(({ children, className, ...otherProps }, ref) => /* @__PURE__ */ import_react.default.createElement(
61
+ "span",
62
+ {
63
+ ...otherProps,
64
+ className: (0, import_classnames.default)(className, "badge-item badge-item-expand"),
65
+ ref
66
+ },
67
+ children
68
+ ));
69
+ ItemExpand.displayName = "ClayBadgeItemExpand";
70
+ const BadgeComponent = import_react.default.forwardRef(
37
71
  ({
38
72
  className,
39
73
  dark,
40
74
  displayType = "primary",
41
75
  label,
76
+ spritemap,
77
+ symbol,
42
78
  translucent,
43
79
  ...otherProps
44
80
  }, ref) => {
@@ -65,9 +101,15 @@ const Badge = import_react.default.forwardRef(
65
101
  ),
66
102
  ref
67
103
  },
68
- /* @__PURE__ */ import_react.default.createElement("span", { className: "badge-item badge-item-expand" }, label)
104
+ /* @__PURE__ */ import_react.default.createElement(ItemExpand, null, label),
105
+ symbol && /* @__PURE__ */ import_react.default.createElement(ItemAfter, null, /* @__PURE__ */ import_react.default.createElement(import_icon.default, { spritemap, symbol }))
69
106
  );
70
107
  }
71
108
  );
72
- Badge.displayName = "ClayBadge";
109
+ BadgeComponent.displayName = "ClayBadge";
110
+ const Badge = Object.assign(BadgeComponent, {
111
+ ItemAfter,
112
+ ItemBefore,
113
+ ItemExpand
114
+ });
73
115
  var src_default = Badge;
package/lib/esm/index.js CHANGED
@@ -1,11 +1,44 @@
1
+ import ClayIcon from "@clayui/icon";
1
2
  import classNames from "classnames";
2
3
  import React from "react";
3
- const Badge = React.forwardRef(
4
+ const ItemAfter = React.forwardRef(({ children, className, ...otherProps }, ref) => /* @__PURE__ */ React.createElement(
5
+ "span",
6
+ {
7
+ ...otherProps,
8
+ className: classNames(className, "badge-item badge-item-after"),
9
+ ref
10
+ },
11
+ children
12
+ ));
13
+ ItemAfter.displayName = "ClayBadgeItemAfter";
14
+ const ItemBefore = React.forwardRef(({ children, className, ...otherProps }, ref) => /* @__PURE__ */ React.createElement(
15
+ "span",
16
+ {
17
+ ...otherProps,
18
+ className: classNames(className, "badge-item badge-item-before"),
19
+ ref
20
+ },
21
+ children
22
+ ));
23
+ ItemBefore.displayName = "ClayBadgeItemBefore";
24
+ const ItemExpand = React.forwardRef(({ children, className, ...otherProps }, ref) => /* @__PURE__ */ React.createElement(
25
+ "span",
26
+ {
27
+ ...otherProps,
28
+ className: classNames(className, "badge-item badge-item-expand"),
29
+ ref
30
+ },
31
+ children
32
+ ));
33
+ ItemExpand.displayName = "ClayBadgeItemExpand";
34
+ const BadgeComponent = React.forwardRef(
4
35
  ({
5
36
  className,
6
37
  dark,
7
38
  displayType = "primary",
8
39
  label,
40
+ spritemap,
41
+ symbol,
9
42
  translucent,
10
43
  ...otherProps
11
44
  }, ref) => {
@@ -32,12 +65,21 @@ const Badge = React.forwardRef(
32
65
  ),
33
66
  ref
34
67
  },
35
- /* @__PURE__ */ React.createElement("span", { className: "badge-item badge-item-expand" }, label)
68
+ /* @__PURE__ */ React.createElement(ItemExpand, null, label),
69
+ symbol && /* @__PURE__ */ React.createElement(ItemAfter, null, /* @__PURE__ */ React.createElement(ClayIcon, { spritemap, symbol }))
36
70
  );
37
71
  }
38
72
  );
39
- Badge.displayName = "ClayBadge";
73
+ BadgeComponent.displayName = "ClayBadge";
74
+ const Badge = Object.assign(BadgeComponent, {
75
+ ItemAfter,
76
+ ItemBefore,
77
+ ItemExpand
78
+ });
40
79
  var src_default = Badge;
41
80
  export {
81
+ ItemAfter,
82
+ ItemBefore,
83
+ ItemExpand,
42
84
  src_default as default
43
85
  };
package/lib/index.d.ts CHANGED
@@ -3,6 +3,9 @@
3
3
  * SPDX-License-Identifier: LGPL-2.1-or-later OR LicenseRef-Liferay-DXP-EULA-2.0.0-2023-06
4
4
  */
5
5
  import React from 'react';
6
+ export declare const ItemAfter: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLSpanElement> & React.RefAttributes<HTMLSpanElement>>;
7
+ export declare const ItemBefore: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLSpanElement> & React.RefAttributes<HTMLSpanElement>>;
8
+ export declare const ItemExpand: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLSpanElement> & React.RefAttributes<HTMLSpanElement>>;
6
9
  declare type DisplayType = 'primary' | 'secondary' | 'info' | 'danger' | 'success' | 'warning' | 'beta' | 'beta-dark';
7
10
  interface IProps extends React.HTMLAttributes<HTMLSpanElement> {
8
11
  /**
@@ -19,10 +22,22 @@ interface IProps extends React.HTMLAttributes<HTMLSpanElement> {
19
22
  * Info that is shown inside of the badge itself.
20
23
  */
21
24
  label?: string | number;
25
+ /**
26
+ * Path to the location of the spritemap resource.
27
+ */
28
+ spritemap?: string;
29
+ /**
30
+ * The id of the icon in the spritemap.
31
+ */
32
+ symbol?: string;
22
33
  /**
23
34
  * Flag to indicate if the badge should use the translucent variant.
24
35
  */
25
36
  translucent?: boolean;
26
37
  }
27
- declare const Badge: React.ForwardRefExoticComponent<IProps & React.RefAttributes<HTMLSpanElement>>;
38
+ declare const Badge: React.ForwardRefExoticComponent<IProps & React.RefAttributes<HTMLSpanElement>> & {
39
+ ItemAfter: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLSpanElement> & React.RefAttributes<HTMLSpanElement>>;
40
+ ItemBefore: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLSpanElement> & React.RefAttributes<HTMLSpanElement>>;
41
+ ItemExpand: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLSpanElement> & React.RefAttributes<HTMLSpanElement>>;
42
+ };
28
43
  export default Badge;
package/package.json CHANGED
@@ -3,6 +3,7 @@
3
3
  "extends browserslist-config-clay"
4
4
  ],
5
5
  "dependencies": {
6
+ "@clayui/icon": "^3.161.0",
6
7
  "classnames": "2.3.1"
7
8
  },
8
9
  "description": "ClayBadge component",
@@ -17,7 +18,7 @@
17
18
  "main": "lib/cjs/index.js",
18
19
  "name": "@clayui/badge",
19
20
  "peerDependencies": {
20
- "@clayui/css": "^3.159.0",
21
+ "@clayui/css": "^3.161.0",
21
22
  "react": "^16.0.0 || ^17.0.0 || ^18.0.0",
22
23
  "react-dom": "^16.0.0 || ^17.0.0 || ^18.0.0"
23
24
  },
@@ -29,7 +30,7 @@
29
30
  "buildTypes": "cross-env NODE_ENV=production tsc --project ./tsconfig.declarations.json",
30
31
  "test": "jest --config ../../jest.config.js"
31
32
  },
32
- "version": "3.159.0",
33
+ "version": "3.161.0",
33
34
  "module": "lib/esm/index.js",
34
35
  "exports": {
35
36
  ".": {