@ultraviolet/ui 3.22.0 → 3.23.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 (7) hide show
  1. package/dist/components/TagInput/index.d.ts +4 -3
  2. package/dist/components/TagInput/index.d.ts.map +1 -1
  3. package/dist/components/TagInput/index.js +3 -2
  4. package/dist/components/TagList/index.d.ts +8 -3
  5. package/dist/components/TagList/index.d.ts.map +1 -1
  6. package/dist/components/TagList/index.js +23 -18
  7. package/package.json +5 -4
package/dist/components/TagInput/index.d.ts CHANGED
@@ -1,4 +1,5 @@
1
- import type { CSSProperties, ReactNode } from 'react';
1
+ import type { ComponentProps, CSSProperties, ReactNode } from 'react';
2
+ import { Tag } from '../Tag';
2
3
  import type { TAGINPUT_SIZE_PADDING } from './styles.css';
3
4
  type TagInputSize = keyof typeof TAGINPUT_SIZE_PADDING;
4
5
  type TagInputProp = (string | {
@@ -30,8 +31,8 @@ type TagInputProps = {
30
31
  clearable?: boolean;
31
32
  style?: CSSProperties;
32
33
  'aria-describedBy'?: string;
33
- };
34
- export declare function TagInput({ disabled, id, name, onChange, placeholder, value, className, 'data-testid': dataTestId, 'aria-label': ariaLabel, label, labelDescription, required, size, error, success, helper, readOnly, tooltip, clearable, style, 'aria-describedBy': ariaDescribedBy, }: TagInputProps): import("react").JSX.Element;
34
+ } & Pick<ComponentProps<typeof Tag>, 'sentiment' | 'variant'>;
35
+ export declare function TagInput({ disabled, id, name, onChange, placeholder, value, className, 'data-testid': dataTestId, 'aria-label': ariaLabel, label, labelDescription, required, size, error, success, helper, readOnly, tooltip, clearable, style, variant, sentiment, 'aria-describedBy': ariaDescribedBy, }: TagInputProps): import("react").JSX.Element;
35
36
  export declare namespace TagInput {
36
37
  var displayName: string;
37
38
  }
package/dist/components/TagInput/index.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/TagInput/index.tsx"],"names":[],"mappings":"AAOA,OAAO,KAAK,EAAe,aAAa,EAAwB,SAAS,EAAE,MAAM,OAAO,CAAA;AASxF,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,cAAc,CAAA;AAEzD,KAAK,YAAY,GAAG,MAAM,OAAO,qBAAqB,CAAA;AAiBtD,KAAK,YAAY,GAAG,CAAC,MAAM,GAAG;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,MAAM,CAAA;CAAE,CAAC,EAAE,CAAA;AAEjE,KAAK,aAAa,GAAG;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,IAAI,CAAA;IACnC,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,KAAK,CAAC,EAAE,YAAY,CAAA;IACpB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd;;OAEG;IACH,gBAAgB,CAAC,EAAE,SAAS,CAAA;IAC5B,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,IAAI,CAAC,EAAE,YAAY,CAAA;IACnB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,OAAO,CAAC,EAAE,MAAM,GAAG,OAAO,CAAA;IAC1B,MAAM,CAAC,EAAE,SAAS,CAAA;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,KAAK,CAAC,EAAE,aAAa,CAAA;IACrB,kBAAkB,CAAC,EAAE,MAAM,CAAA;CAC5B,CAAA;iCAKwB,EACvB,QAAgB,EAChB,EAAE,EACF,IAAI,EACJ,QAAQ,EACR,WAAW,EACX,KAAK,EACL,SAAS,EACT,aAAa,EAAE,UAAU,EACzB,YAAY,EAAE,SAAS,EACvB,KAAK,EACL,gBAAgB,EAChB,QAAgB,EAChB,IAAc,EACd,KAAK,EACL,OAAO,EACP,MAAM,EACN,QAAgB,EAChB,OAAO,EACP,SAAiB,EACjB,KAAK,EACL,kBAAkB,EAAE,eAAe,GACpC,EAAE,aAAa"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/TagInput/index.tsx"],"names":[],"mappings":"AAOA,OAAO,KAAK,EAAe,cAAc,EAAE,aAAa,EAAwB,SAAS,EAAE,MAAM,OAAO,CAAA;AAMxG,OAAO,EAAE,GAAG,EAAE,MAAM,QAAQ,CAAA;AAG5B,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,cAAc,CAAA;AAEzD,KAAK,YAAY,GAAG,MAAM,OAAO,qBAAqB,CAAA;AAiBtD,KAAK,YAAY,GAAG,CAAC,MAAM,GAAG;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,MAAM,CAAA;CAAE,CAAC,EAAE,CAAA;AAEjE,KAAK,aAAa,GAAG;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,IAAI,CAAA;IACnC,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,KAAK,CAAC,EAAE,YAAY,CAAA;IACpB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd;;OAEG;IACH,gBAAgB,CAAC,EAAE,SAAS,CAAA;IAC5B,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,IAAI,CAAC,EAAE,YAAY,CAAA;IACnB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,OAAO,CAAC,EAAE,MAAM,GAAG,OAAO,CAAA;IAC1B,MAAM,CAAC,EAAE,SAAS,CAAA;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,KAAK,CAAC,EAAE,aAAa,CAAA;IACrB,kBAAkB,CAAC,EAAE,MAAM,CAAA;CAC5B,GAAG,IAAI,CAAC,cAAc,CAAC,OAAO,GAAG,CAAC,EAAE,WAAW,GAAG,SAAS,CAAC,CAAA;iCAKpC,EACvB,QAAgB,EAChB,EAAE,EACF,IAAI,EACJ,QAAQ,EACR,WAAW,EACX,KAAK,EACL,SAAS,EACT,aAAa,EAAE,UAAU,EACzB,YAAY,EAAE,SAAS,EACvB,KAAK,EACL,gBAAgB,EAChB,QAAgB,EAChB,IAAc,EACd,KAAK,EACL,OAAO,EACP,MAAM,EACN,QAAgB,EAChB,OAAO,EACP,SAAiB,EACjB,KAAK,EACL,OAAmB,EACnB,SAAqB,EACrB,kBAAkB,EAAE,eAAe,GACpC,EAAE,aAAa"}
package/dist/components/TagInput/index.js CHANGED
@@ -40,7 +40,7 @@ function init_TagInput() {
40
40
  label: tag
41
41
  });
42
42
  };
43
- TagInput = ({ disabled = false, id, name, onChange, placeholder, value, className, "data-testid": dataTestId, "aria-label": ariaLabel, label, labelDescription, required = false, size = "large", error, success, helper, readOnly = false, tooltip, clearable = false, style, "aria-describedBy": ariaDescribedBy }) => {
43
+ TagInput = ({ disabled = false, id, name, onChange, placeholder, value, className, "data-testid": dataTestId, "aria-label": ariaLabel, label, labelDescription, required = false, size = "large", error, success, helper, readOnly = false, tooltip, clearable = false, style, variant = "default", sentiment = "neutral", "aria-describedBy": ariaDescribedBy }) => {
44
44
  const [tagInputState, setTagInput] = useState(convertTagArrayToTagStateArray(value));
45
45
  const [input, setInput] = useState("");
46
46
  const [status, setStatus] = useState({});
@@ -149,7 +149,8 @@ function init_TagInput() {
149
149
  e.stopPropagation();
150
150
  deleteTag(tag.index);
151
151
  },
152
- sentiment: "neutral",
152
+ sentiment,
153
+ variant,
153
154
  children: tag.label
154
155
  }, tag.index)), disabled ? null : /* @__PURE__ */ jsx("input", {
155
156
  "aria-describedby": ariaDescribedBy || (hasHelperText(helper, error, success) ? helperId : void 0),
package/dist/components/TagList/index.d.ts CHANGED
@@ -1,10 +1,15 @@
1
1
  import type { ComponentProps, CSSProperties, ReactNode } from 'react';
2
2
  import { Popover } from '../Popover';
3
3
  import { Tag } from '../Tag';
4
- export type TagType = string | {
4
+ type TagKeyValue = {
5
+ key: string;
6
+ value: string;
7
+ };
8
+ type TagIcon = {
5
9
  label: string;
6
10
  icon: ReactNode;
7
11
  };
12
+ export type TagType = string | TagKeyValue | TagIcon;
8
13
  type TagListProps = {
9
14
  /**
10
15
  * This property define maximum characters length of all tags until it hide tags into tooltip.
@@ -36,8 +41,8 @@ type TagListProps = {
36
41
  className?: string;
37
42
  'data-testid'?: string;
38
43
  style?: CSSProperties;
39
- } & Pick<ComponentProps<typeof Tag>, 'copiable' | 'copyText' | 'copiedText'>;
40
- export declare function TagList({ maxLength, tags, threshold, multiline, popoverTitle, popoverPlacement, popoverMaxHeight, copiable, copyText, copiedText, className, 'data-testid': dataTestId, style, }: TagListProps): import("react").JSX.Element;
44
+ } & Pick<ComponentProps<typeof Tag>, 'copiable' | 'copyText' | 'copiedText' | 'variant' | 'sentiment'>;
45
+ export declare function TagList({ maxLength, tags, threshold, multiline, popoverTitle, popoverPlacement, popoverMaxHeight, copiable, copyText, copiedText, sentiment, variant, className, 'data-testid': dataTestId, style, }: TagListProps): import("react").JSX.Element;
41
46
  export declare namespace TagList {
42
47
  var displayName: string;
43
48
  }
package/dist/components/TagList/index.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/TagList/index.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,cAAc,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AACrE,OAAO,EAAE,OAAO,EAAE,MAAM,YAAY,CAAA;AACpC,OAAO,EAAE,GAAG,EAAE,MAAM,QAAQ,CAAA;AAI5B,MAAM,MAAM,OAAO,GAAG,MAAM,GAAG;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,IAAI,EAAE,SAAS,CAAA;CAAE,CAAA;AAEjE,KAAK,YAAY,GAAG;IAClB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,IAAI,CAAC,EAAE,OAAO,EAAE,CAAA;IAChB;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB;;OAEG;IACH,YAAY,EAAE,MAAM,CAAA;IACpB;;;OAGG;IACH,gBAAgB,CAAC,EAAE,cAAc,CAAC,OAAO,OAAO,CAAC,CAAC,WAAW,CAAC,CAAA;IAC9D;;OAEG;IACH,gBAAgB,CAAC,EAAE,cAAc,CAAC,OAAO,OAAO,CAAC,CAAC,WAAW,CAAC,CAAA;IAC9D,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,KAAK,CAAC,EAAE,aAAa,CAAA;CACtB,GAAG,IAAI,CAAC,cAAc,CAAC,OAAO,GAAG,CAAC,EAAE,UAAU,GAAG,UAAU,GAAG,YAAY,CAAC,CAAA;gCASpD,EACtB,SAAe,EACf,IAAmB,EACnB,SAAa,EACb,SAAiB,EACjB,YAAY,EACZ,gBAAgB,EAChB,gBAA6C,EAC7C,QAAQ,EACR,QAAQ,EACR,UAAU,EACV,SAAS,EACT,aAAa,EAAE,UAAU,EACzB,KAAK,GACN,EAAE,YAAY"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/TagList/index.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,cAAc,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AACrE,OAAO,EAAE,OAAO,EAAE,MAAM,YAAY,CAAA;AACpC,OAAO,EAAE,GAAG,EAAE,MAAM,QAAQ,CAAA;AAI5B,KAAK,WAAW,GAAG;IAAE,GAAG,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,MAAM,CAAA;CAAE,CAAA;AACjD,KAAK,OAAO,GAAG;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,IAAI,EAAE,SAAS,CAAA;CAAE,CAAA;AACjD,MAAM,MAAM,OAAO,GAAG,MAAM,GAAG,WAAW,GAAG,OAAO,CAAA;AAEpD,KAAK,YAAY,GAAG;IAClB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,IAAI,CAAC,EAAE,OAAO,EAAE,CAAA;IAChB;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB;;OAEG;IACH,YAAY,EAAE,MAAM,CAAA;IACpB;;;OAGG;IACH,gBAAgB,CAAC,EAAE,cAAc,CAAC,OAAO,OAAO,CAAC,CAAC,WAAW,CAAC,CAAA;IAC9D;;OAEG;IACH,gBAAgB,CAAC,EAAE,cAAc,CAAC,OAAO,OAAO,CAAC,CAAC,WAAW,CAAC,CAAA;IAC9D,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,KAAK,CAAC,EAAE,aAAa,CAAA;CACtB,GAAG,IAAI,CAAC,cAAc,CAAC,OAAO,GAAG,CAAC,EAAE,UAAU,GAAG,UAAU,GAAG,YAAY,GAAG,SAAS,GAAG,WAAW,CAAC,CAAA;gCAyB9E,EACtB,SAAe,EACf,IAAmB,EACnB,SAAa,EACb,SAAiB,EACjB,YAAY,EACZ,gBAAgB,EAChB,gBAA6C,EAC7C,QAAQ,EACR,QAAQ,EACR,UAAU,EACV,SAAqB,EACrB,OAAmB,EACnB,SAAS,EACT,aAAa,EAAE,UAAU,EACzB,KAAK,GACN,EAAE,YAAY"}
package/dist/components/TagList/index.js CHANGED
@@ -11,7 +11,7 @@ import { assignInlineVars } from "@vanilla-extract/dynamic";
11
11
  import { jsx, jsxs } from "react/jsx-runtime";
12
12
 
13
13
  //#region src/components/TagList/index.tsx
14
- var DEFAULT_TAGS, getTagLabel, TagList;
14
+ var DEFAULT_TAGS, isLabelIconTag, isKeyValueTag, getTagLabel, TagList;
15
15
  function init_TagList() {
16
16
  return (init_TagList = __esmMin(() => {
17
17
  init_Popover();
@@ -20,8 +20,14 @@ function init_TagList() {
20
20
  init_styles_css();
21
21
  init_objectSpread2();
22
22
  DEFAULT_TAGS = [];
23
- getTagLabel = (tag) => typeof tag === "object" ? tag.label : tag;
24
- TagList = ({ maxLength = 600, tags = DEFAULT_TAGS, threshold = 1, multiline = false, popoverTitle, popoverPlacement, popoverMaxHeight = DEFAULT_POPOVER_MAX_HEIGHT, copiable, copyText, copiedText, className, "data-testid": dataTestId, style }) => {
23
+ isLabelIconTag = (tag) => typeof tag === "object" && tag !== null && "label" in tag && "icon" in tag;
24
+ isKeyValueTag = (tag) => typeof tag === "object" && tag !== null && "key" in tag && "value" in tag;
25
+ getTagLabel = (tag) => {
26
+ if (isKeyValueTag(tag)) return `${tag.key}-${tag.value}`;
27
+ if (isLabelIconTag(tag)) return tag.label;
28
+ return tag;
29
+ };
30
+ TagList = ({ maxLength = 600, tags = DEFAULT_TAGS, threshold = 1, multiline = false, popoverTitle, popoverPlacement, popoverMaxHeight = DEFAULT_POPOVER_MAX_HEIGHT, copiable, copyText, copiedText, sentiment = "neutral", variant = "default", className, "data-testid": dataTestId, style }) => {
25
31
  var _containerRef$current3;
26
32
  var _containerRef$current6;
27
33
  const containerRef = useRef(null);
@@ -117,21 +123,20 @@ function init_TagList() {
117
123
  visibleTags.length,
118
124
  (_containerRef$current6 = containerRef.current) === null || _containerRef$current6 === void 0 || (_containerRef$current6 = _containerRef$current6.parentElement) === null || _containerRef$current6 === void 0 ? void 0 : _containerRef$current6.offsetWidth
119
125
  ]);
120
- const renderTag = (tag, index, isEllipsis = false, hidden) => typeof tag !== "string" && tag.icon ? /* @__PURE__ */ jsxs(Tag, {
121
- className: cn(isEllipsis ? "ellipsed" : "", tagListStyle.ellipsisChild),
122
- copiable,
123
- copiedText,
124
- copyText,
125
- "data-testid": hidden ? "" : getTagLabel(tag),
126
- children: [tag.icon, getTagLabel(tag)]
127
- }, `${getTagLabel(tag)}-${index}`) : /* @__PURE__ */ jsx(Tag, {
128
- className: cn(isEllipsis ? "ellipsed" : "", tagListStyle.ellipsisChild),
129
- copiable,
130
- copiedText,
131
- copyText,
132
- "data-testid": hidden ? "" : getTagLabel(tag),
133
- children: getTagLabel(tag)
134
- }, `${getTagLabel(tag)}-${index}`);
126
+ const renderTag = (tag, index, isEllipsis = false, hidden) => {
127
+ const commonProps = {
128
+ className: cn(isEllipsis ? "ellipsed" : "", tagListStyle.ellipsisChild),
129
+ copiable,
130
+ copiedText,
131
+ copyText,
132
+ key: `${getTagLabel(tag)}-${index}`,
133
+ "data-testid": hidden ? "" : getTagLabel(tag),
134
+ variant,
135
+ sentiment
136
+ };
137
+ if (isKeyValueTag(tag)) return /* @__PURE__ */ jsx(Tag, _objectSpread2({ keyValue: tag }, commonProps));
138
+ return /* @__PURE__ */ jsxs(Tag, _objectSpread2(_objectSpread2({}, commonProps), {}, { children: [isLabelIconTag(tag) ? tag.icon : void 0, getTagLabel(tag)] }));
139
+ };
135
140
  return /* @__PURE__ */ jsxs("div", {
136
141
  className: cn(className, tagListStyle.container),
137
142
  "data-testid": dataTestId,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ultraviolet/ui",
3
- "version": "3.22.0",
3
+ "version": "3.23.0",
4
4
  "description": "Ultraviolet UI",
5
5
  "keywords": [
6
6
  "react",
@@ -24,7 +24,8 @@
24
24
  "type": "module",
25
25
  "sideEffects": [
26
26
  "**/*.css",
27
- "**/*.css.ts"
27
+ "**/*.css.ts",
28
+ "**/compositions/*/index.js"
28
29
  ],
29
30
  "main": "./dist/index.js",
30
31
  "module": "./dist/index.js",
@@ -81,7 +82,7 @@
81
82
  "codemirror": "6.0.2",
82
83
  "csstype": "3.2.3",
83
84
  "deepmerge": "4.3.1",
84
- "prosemirror-commands": "1.7.1",
85
+ "prosemirror-commands": "1.7.2",
85
86
  "prosemirror-keymap": "1.2.3",
86
87
  "prosemirror-model": "1.25.11",
87
88
  "prosemirror-schema-basic": "1.2.4",
@@ -91,7 +92,7 @@
91
92
  "react-intersection-observer": "11.0.0",
92
93
  "react-toastify": "11.1.0",
93
94
  "@ultraviolet/animations": "1.0.2",
94
- "@ultraviolet/icons": "5.4.9",
95
+ "@ultraviolet/icons": "5.5.0",
95
96
  "@ultraviolet/themes": "3.1.11",
96
97
  "@ultraviolet/utils": "1.0.14"
97
98
  },