musae 1.0.27-beta.20 → 1.0.27-beta.22

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/dist/components/tag/tag.cjs +8 -3
  2. package/dist/components/tag/tag.d.ts +1 -1
  3. package/dist/components/tag/tag.mjs +8 -3
  4. package/dist/styles.css +20 -0
  5. package/dist/types/tag.d.ts +4 -7
  6. package/package.json +1 -1
package/dist/components/tag/tag.cjs CHANGED
@@ -25,17 +25,17 @@ var styles = {
25
25
  },
26
26
  size: {
27
27
  small: {
28
- kg3NbH: "musaex-1g3a7fl",
29
28
  kaIpWk: "musaex-dshwmh",
30
29
  kOIVth: "musaex-15wobh7",
31
30
  kZKoxP: "musaex-1ksoi14",
31
+ "--padding-inline": "musaex-1rb5leg",
32
32
  $$css: true
33
33
  },
34
34
  medium: {
35
- kg3NbH: "musaex-81lxrv",
36
35
  kaIpWk: "musaex-1ezz4s",
37
36
  kOIVth: "musaex-wcf3z5",
38
37
  kZKoxP: "musaex-1si1pn3",
38
+ "--padding-inline": "musaex-1ur110t",
39
39
  $$css: true
40
40
  },
41
41
  large: {
@@ -43,6 +43,7 @@ var styles = {
43
43
  kaIpWk: "musaex-142dr1e",
44
44
  kOIVth: "musaex-1wm2zkp",
45
45
  kZKoxP: "musaex-4etbzz",
46
+ "--padding-inline": "musaex-58z396",
46
47
  $$css: true
47
48
  }
48
49
  },
@@ -50,6 +51,7 @@ var styles = {
50
51
  filled: {
51
52
  kWkggS: "musaex-1ncffr6",
52
53
  kMwMTN: "musaex-cm04b4",
54
+ kg3NbH: "musaex-1ioy7le",
53
55
  $$css: true
54
56
  },
55
57
  outlined: {
@@ -58,6 +60,7 @@ var styles = {
58
60
  ksu8eU: "musaex-1y0btm7",
59
61
  kVAM5u: "musaex-axmpxa",
60
62
  kMwMTN: "musaex-1heor9g",
63
+ kg3NbH: "musaex-13bwjiu",
61
64
  $$css: true
62
65
  }
63
66
  }
@@ -73,13 +76,15 @@ var Tag = function Tag(_ref) {
73
76
  _ref$closable = _ref.closable,
74
77
  closable = _ref$closable === void 0 ? false : _ref$closable,
75
78
  onClose = _ref.onClose,
79
+ onClick = _ref.onClick,
76
80
  leading = _ref.leading;
77
81
  var classNames = useClassNames.useClassNames(context.CLASS_NAMES);
78
82
  var _themeColorVars = useThemeColorVars.useThemeColorVars(["primary-container", "on-primary-container", "surface", "on-surface-variant", "outline"]);
79
83
  var styled = stylex.props(theme.$label[size], styles.tag["default"], styles.size[size], styles.variant[variant]);
80
84
  return /*#__PURE__*/React.createElement("span", {
81
85
  className: className.stringify(classNames.tag, className$1, styled.className),
82
- style: _objectSpread(_objectSpread(_objectSpread({}, styled.style), _themeColorVars), style)
86
+ style: _objectSpread(_objectSpread(_objectSpread({}, styled.style), _themeColorVars), style),
87
+ onClick: onClick
83
88
  }, leading, children, closable && /*#__PURE__*/React.createElement(close.default, {
84
89
  onClick: onClose
85
90
  }));
package/dist/components/tag/tag.d.ts CHANGED
@@ -1,4 +1,4 @@
1
1
  import React from "react";
2
2
  import type { TagProps } from "../../types/tag";
3
- declare const Tag: ({ children, variant, size, className, style, closable, onClose, leading, }: TagProps) => React.JSX.Element;
3
+ declare const Tag: ({ children, variant, size, className, style, closable, onClose, onClick, leading, }: TagProps) => React.JSX.Element;
4
4
  export default Tag;
package/dist/components/tag/tag.mjs CHANGED
@@ -21,17 +21,17 @@ var styles = {
21
21
  },
22
22
  size: {
23
23
  small: {
24
- kg3NbH: "musaex-1g3a7fl",
25
24
  kaIpWk: "musaex-dshwmh",
26
25
  kOIVth: "musaex-15wobh7",
27
26
  kZKoxP: "musaex-1ksoi14",
27
+ "--padding-inline": "musaex-1rb5leg",
28
28
  $$css: true
29
29
  },
30
30
  medium: {
31
- kg3NbH: "musaex-81lxrv",
32
31
  kaIpWk: "musaex-1ezz4s",
33
32
  kOIVth: "musaex-wcf3z5",
34
33
  kZKoxP: "musaex-1si1pn3",
34
+ "--padding-inline": "musaex-1ur110t",
35
35
  $$css: true
36
36
  },
37
37
  large: {
@@ -39,6 +39,7 @@ var styles = {
39
39
  kaIpWk: "musaex-142dr1e",
40
40
  kOIVth: "musaex-1wm2zkp",
41
41
  kZKoxP: "musaex-4etbzz",
42
+ "--padding-inline": "musaex-58z396",
42
43
  $$css: true
43
44
  }
44
45
  },
@@ -46,6 +47,7 @@ var styles = {
46
47
  filled: {
47
48
  kWkggS: "musaex-1ncffr6",
48
49
  kMwMTN: "musaex-cm04b4",
50
+ kg3NbH: "musaex-1ioy7le",
49
51
  $$css: true
50
52
  },
51
53
  outlined: {
@@ -54,6 +56,7 @@ var styles = {
54
56
  ksu8eU: "musaex-1y0btm7",
55
57
  kVAM5u: "musaex-axmpxa",
56
58
  kMwMTN: "musaex-1heor9g",
59
+ kg3NbH: "musaex-13bwjiu",
57
60
  $$css: true
58
61
  }
59
62
  }
@@ -69,13 +72,15 @@ var Tag = function Tag(_ref) {
69
72
  _ref$closable = _ref.closable,
70
73
  closable = _ref$closable === void 0 ? false : _ref$closable,
71
74
  onClose = _ref.onClose,
75
+ onClick = _ref.onClick,
72
76
  leading = _ref.leading;
73
77
  var classNames = useClassNames(CLASS_NAMES);
74
78
  var _themeColorVars = useThemeColorVars(["primary-container", "on-primary-container", "surface", "on-surface-variant", "outline"]);
75
79
  var styled = props($label[size], styles.tag["default"], styles.size[size], styles.variant[variant]);
76
80
  return /*#__PURE__*/React.createElement("span", {
77
81
  className: stringify(classNames.tag, className, styled.className),
78
- style: _objectSpread(_objectSpread(_objectSpread({}, styled.style), _themeColorVars), style)
82
+ style: _objectSpread(_objectSpread(_objectSpread({}, styled.style), _themeColorVars), style),
83
+ onClick: onClick
79
84
  }, leading, children, closable && /*#__PURE__*/React.createElement(Close, {
80
85
  onClick: onClose
81
86
  }));
package/dist/styles.css CHANGED
@@ -420,6 +420,10 @@
420
420
  padding-block: var(--musaex-mk8wyj);
421
421
  }
422
422
 
423
+ .musaex-13bwjiu {
424
+ padding-inline: calc(var(--padding-inline) - var(--musaex-6ewyph));
425
+ }
426
+
423
427
  .musaex-1v4gb6w {
424
428
  padding-inline: var(--musaex-14eq97i);
425
429
  }
@@ -464,6 +468,10 @@
464
468
  padding-inline: var(--musaex-mk8wyj);
465
469
  }
466
470
 
471
+ .musaex-1ioy7le {
472
+ padding-inline: var(--padding-inline);
473
+ }
474
+
467
475
  .musaex-mqliwb {
468
476
  text-decoration: line-through;
469
477
  }
@@ -3121,6 +3129,18 @@
3121
3129
  --check-size: var(--musaex-qe7ci9);
3122
3130
  }
3123
3131
 
3132
+ .musaex-58z396 {
3133
+ --padding-inline: var(--musaex-14eq97i);
3134
+ }
3135
+
3136
+ .musaex-1ur110t {
3137
+ --padding-inline: var(--musaex-1vpnstl);
3138
+ }
3139
+
3140
+ .musaex-1rb5leg {
3141
+ --padding-inline: var(--musaex-jo49ah);
3142
+ }
3143
+
3124
3144
  .musaex-1me236a {
3125
3145
  --size: var(--musaex-5c864h);
3126
3146
  }
package/dist/types/tag.d.ts CHANGED
@@ -3,41 +3,38 @@ import type { ComponentProps } from "./element";
3
3
  type Size = "small" | "medium" | "large";
4
4
  type Variant = "filled" | "outlined";
5
5
  /**
6
- * @description
7
6
  * tag props
8
7
  */
9
8
  export type TagProps = ComponentProps & {
10
9
  /**
11
- * @description
12
10
  * variant
13
11
  * @default "filled"
14
12
  */
15
13
  variant?: Variant;
16
14
  /**
17
- * @description
18
15
  * children
19
16
  * @default void 0
20
17
  */
21
18
  children?: ReactNode;
22
19
  /**
23
- * @description
24
20
  * size
25
21
  * @default "medium"
26
22
  */
27
23
  size?: Size;
28
24
  /**
29
- * @description
30
25
  * if current tag is closable
31
26
  * @default false
32
27
  */
33
28
  closable?: boolean;
34
29
  /**
35
- * @description
30
+ * click handler
31
+ */
32
+ onClick?: (event: MouseEvent<HTMLSpanElement>) => void;
33
+ /**
36
34
  * close handler
37
35
  */
38
36
  onClose?: (event: MouseEvent<HTMLSpanElement>) => void;
39
37
  /**
40
- * @description
41
38
  * leading node
42
39
  * @default void 0
43
40
  */
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "musae",
3
- "version": "1.0.27-beta.20",
3
+ "version": "1.0.27-beta.22",
4
4
  "description": "musae-ui",
5
5
  "author": "tutu@fantufantu.com",
6
6
  "license": "MIT",