@e1011/es-kit 1.1.28 → 1.1.34

package/dist/types/src/core/ui/components/atoms/index.d.ts

@@ -1,4 +1,5 @@
 export * from './button';
 export * from './text';
 export * from './textAndContent';
+export * from './tag';
 //# sourceMappingURL=index.d.ts.map

package/dist/types/src/core/ui/components/atoms/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../../src/core/ui/components/atoms/index.ts"],"names":[],"mappings":"AAAA,cAAc,UAAU,CAAA;AACxB,cAAc,QAAQ,CAAA;AACtB,cAAc,kBAAkB,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../../src/core/ui/components/atoms/index.ts"],"names":[],"mappings":"AAAA,cAAc,UAAU,CAAA;AACxB,cAAc,QAAQ,CAAA;AACtB,cAAc,kBAAkB,CAAA;AAChC,cAAc,OAAO,CAAA"}

package/dist/types/src/core/ui/components/atoms/tag/Tag.d.ts

@@ -1,33 +1,5 @@
-import { PropsWithChildren, FC, MouseEvent } from 'react';
-import { TextAndIconsProps } from '../textAndContent/textAndContent.types';
-import { LayoutBoxProps } from '../../container/layoutBox/layoutBox.types';
-import { CommonProps } from '../../../../types/CommonProps';
-import { TextProps } from '../text/text.types';
-export declare enum TagVariant {
-    info = "info",
-    veryLow = "very-low",
-    low = "low",
-    medium = "medium",
-    high = "high",
-    critical = "critical",
-    information = "information",
-    success = "success",
-    alert = "alert",
-    error = "error",
-    warning = "warning",
-    default = "default"
-}
-export type TagProps = PropsWithChildren & CommonProps & TextAndIconsProps & LayoutBoxProps & {
-    variant?: TagVariant;
-    text?: string;
-    hashtag?: boolean;
-    inTable?: boolean;
-    components?: {
-        TextComponent?: FC<TextProps>;
-    };
-    onClick?: (event?: MouseEvent) => void;
-    className?: string;
-};
+import { FC } from 'react';
+import { TagProps } from './tag.types';
 /**
  * Tag component.
  *  *

package/dist/types/src/core/ui/components/atoms/tag/Tag.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Tag.d.ts","sourceRoot":"","sources":["../../../../../../../../src/core/ui/components/atoms/tag/Tag.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAQ,iBAAiB,EAAE,EAAE,EAAE,UAAU,EAAuD,MAAM,OAAO,CAAA;AAGpH,OAAO,EAAE,iBAAiB,EAAE,MAAM,wCAAwC,CAAA;AAE1E,OAAO,EAAE,cAAc,EAAE,MAAM,2CAA2C,CAAA;AAG1E,OAAO,EAAE,WAAW,EAAE,MAAM,+BAA+B,CAAA;AAG3D,OAAO,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAA;AAK9C,oBAAY,UAAU;IACpB,IAAI,SAAS;IACb,OAAO,aAAa;IACpB,GAAG,QAAQ;IACX,MAAM,WAAW;IACjB,IAAI,SAAS;IACb,QAAQ,aAAa;IACrB,WAAW,gBAAgB;IAC3B,OAAO,YAAY;IACnB,KAAK,UAAU;IACf,KAAK,UAAU;IACf,OAAO,YAAY;IACnB,OAAO,YAAY;CACpB;AAED,MAAM,MAAM,QAAQ,GAAG,iBAAiB,GAAG,WAAW,GAAG,iBAAiB,GAAG,cAAc,GAAG;IAC5F,OAAO,CAAC,EAAE,UAAU,CAAA;IACpB,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,UAAU,CAAC,EAAE;QACX,aAAa,CAAC,EAAE,EAAE,CAAC,SAAS,CAAC,CAAA;KAC9B,CAAA;IACD,OAAO,CAAC,EAAE,CAAC,KAAK,CAAC,EAAE,UAAU,KAAK,IAAI,CAAA;IACtC,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB,CAAA;AAaD;;;;;GAKG;AACH,eAAO,MAAM,GAAG,EAAE,EAAE,CAAC,QAAQ,CAqF3B,CAAA"}
+{"version":3,"file":"Tag.d.ts","sourceRoot":"","sources":["../../../../../../../../src/core/ui/components/atoms/tag/Tag.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAQ,EAAE,EAAuD,MAAM,OAAO,CAAA;AAUrF,OAAO,EAAE,QAAQ,EAAc,MAAM,aAAa,CAAA;AAclD;;;;;GAKG;AACH,eAAO,MAAM,GAAG,EAAE,EAAE,CAAC,QAAQ,CAqF3B,CAAA"}

package/dist/types/src/core/ui/components/atoms/tag/index.d.ts

@@ -0,0 +1,3 @@
+export * from './Tag';
+export * from './tag.types';
+//# sourceMappingURL=index.d.ts.map

package/dist/types/src/core/ui/components/atoms/tag/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../../../src/core/ui/components/atoms/tag/index.ts"],"names":[],"mappings":"AAAA,cAAc,OAAO,CAAA;AACrB,cAAc,aAAa,CAAA"}

package/dist/types/src/core/ui/components/atoms/tag/tag.stories.d.ts

@@ -1,5 +1,5 @@
 import { Meta } from '@storybook/react';
-import { TagProps } from './Tag';
+import { TagProps } from './tag.types';
 declare const _default: Meta<TagProps>;
 export default _default;
 export declare const TagByDesign: import("@storybook/csf").AnnotatedStoryFn<import("@storybook/react").ReactRenderer, TagProps>;

package/dist/types/src/core/ui/components/atoms/tag/tag.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"tag.stories.d.ts","sourceRoot":"","sources":["../../../../../../../../src/core/ui/components/atoms/tag/tag.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAoB,MAAM,kBAAkB,CAAA;AASzD,OAAO,EAAO,QAAQ,EAAc,MAAM,OAAO,CAAA;wBAuB5C,IAAI,CAAC,QAAQ,CAAC;AApBnB,wBAoBmB;AAoFnB,eAAO,MAAM,WAAW,+FAAuB,CAAA"}
+{"version":3,"file":"tag.stories.d.ts","sourceRoot":"","sources":["../../../../../../../../src/core/ui/components/atoms/tag/tag.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAoB,MAAM,kBAAkB,CAAA;AAUzD,OAAO,EAAE,QAAQ,EAAc,MAAM,aAAa,CAAA;wBAuB7C,IAAI,CAAC,QAAQ,CAAC;AApBnB,wBAoBmB;AAoFnB,eAAO,MAAM,WAAW,+FAAuB,CAAA"}

package/dist/types/src/core/ui/components/atoms/tag/tag.types.d.ts

@@ -0,0 +1,31 @@
+import { PropsWithChildren, FC, MouseEvent } from 'react';
+import { TextAndIconsProps } from '../textAndContent/textAndContent.types';
+import { LayoutBoxProps } from '../../container/layoutBox/layoutBox.types';
+import { CommonProps } from '../../../../types/CommonProps';
+import { TextProps } from '../text/text.types';
+export declare enum TagVariant {
+    info = "info",
+    veryLow = "very-low",
+    low = "low",
+    medium = "medium",
+    high = "high",
+    critical = "critical",
+    information = "information",
+    success = "success",
+    alert = "alert",
+    error = "error",
+    warning = "warning",
+    default = "default"
+}
+export type TagProps = PropsWithChildren & CommonProps & TextAndIconsProps & LayoutBoxProps & {
+    variant?: TagVariant;
+    text?: string;
+    hashtag?: boolean;
+    inTable?: boolean;
+    components?: {
+        TextComponent?: FC<TextProps>;
+    };
+    onClick?: (event?: MouseEvent) => void;
+    className?: string;
+};
+//# sourceMappingURL=tag.types.d.ts.map

package/dist/types/src/core/ui/components/atoms/tag/tag.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"tag.types.d.ts","sourceRoot":"","sources":["../../../../../../../../src/core/ui/components/atoms/tag/tag.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AAEzD,OAAO,EAAE,iBAAiB,EAAE,MAAM,wCAAwC,CAAA;AAC1E,OAAO,EAAE,cAAc,EAAE,MAAM,2CAA2C,CAAA;AAC1E,OAAO,EAAE,WAAW,EAAE,MAAM,+BAA+B,CAAA;AAC3D,OAAO,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAA;AAG9C,oBAAY,UAAU;IACpB,IAAI,SAAS;IACb,OAAO,aAAa;IACpB,GAAG,QAAQ;IACX,MAAM,WAAW;IACjB,IAAI,SAAS;IACb,QAAQ,aAAa;IACrB,WAAW,gBAAgB;IAC3B,OAAO,YAAY;IACnB,KAAK,UAAU;IACf,KAAK,UAAU;IACf,OAAO,YAAY;IACnB,OAAO,YAAY;CACpB;AAED,MAAM,MAAM,QAAQ,GAAG,iBAAiB,GAAG,WAAW,GAAG,iBAAiB,GAAG,cAAc,GAAG;IAC5F,OAAO,CAAC,EAAE,UAAU,CAAA;IACpB,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,UAAU,CAAC,EAAE;QACX,aAAa,CAAC,EAAE,EAAE,CAAC,SAAS,CAAC,CAAA;KAC9B,CAAA;IACD,OAAO,CAAC,EAAE,CAAC,KAAK,CAAC,EAAE,UAAU,KAAK,IAAI,CAAA;IACtC,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB,CAAA"}

package/dist/ui/esm/index.css

@@ -694,4 +694,168 @@
 .popup-overlay-module_popup-modal-overlay__dlJqM[data-show=false] {
   opacity: 0;
   visibility: hidden;
+}
+:root {
+  --divider-line: #4a4b4b;
+}
+
+.tag-module_overflow-hidden__wlxDI, .tag-module_text-truncate__xqW1- {
+  overflow: hidden !important;
+}
+
+.tag-module_text-nowrap__CHhhg, .tag-module_text-truncate__xqW1- {
+  white-space: nowrap !important;
+}
+
+.tag-module_text-ellipsis__UX32n, .tag-module_text-truncate__xqW1- {
+  text-overflow: ellipsis !important;
+}
+
+.tag-module_tag__rGA-E {
+  display: inline-flex;
+  flex-direction: row;
+  flex-shrink: 1;
+  padding: 4px 8px;
+  gap: 4px;
+  min-height: 18px;
+  border-radius: 4px;
+  border-width: 1px;
+  border-style: solid;
+  align-items: center;
+}
+.tag-module_tag__rGA-E .icon-base {
+  color: #E2E369 !important;
+}
+.tag-module_tag__rGA-E .tag-module_text__WpK6w {
+  white-space: nowrap;
+}
+.tag-module_tag__rGA-E.tag-module_in-table__cWTuJ {
+  justify-content: center;
+  align-items: center;
+  overflow: hidden !important;
+  white-space: nowrap !important;
+  text-overflow: ellipsis !important;
+}
+.tag-module_tag__rGA-E.tag-module_default__6cv6k {
+  background-color: #434747;
+  border-color: #515757;
+  color: #F4F4F4;
+}
+.tag-module_tag__rGA-E.tag-module_clickable__W6arw {
+  cursor: pointer;
+  transition: background-color 0.25s ease;
+}
+.tag-module_tag__rGA-E.tag-module_clickable__W6arw.tag-module_default__6cv6k:hover {
+  background-color: #515757;
+}
+
+.cui-theme-dark .tag-module_tag__rGA-E.tag-module_info__PMCQH {
+  background-color: #203439;
+  border-color: #80D9F3;
+  color: #80D9F3;
+}
+.cui-theme-dark .tag-module_tag__rGA-E.tag-module_very-low__a6WSr {
+  background-color: #212A04;
+  border-color: #B1E02C;
+  color: #B1E02C;
+}
+.cui-theme-dark .tag-module_tag__rGA-E.tag-module_low__57msG {
+  background-color: #353505;
+  border-color: #E2E369;
+  color: #E2E369;
+}
+.cui-theme-dark .tag-module_tag__rGA-E.tag-module_medium__PtVKT {
+  background-color: #632E03;
+  border-color: #FD8F3E;
+  color: #FD8F3E;
+}
+.cui-theme-dark .tag-module_tag__rGA-E.tag-module_high__8ayT0 {
+  background-color: #371A1A;
+  border-color: #FD553E;
+  color: #FD553E;
+}
+.cui-theme-dark .tag-module_tag__rGA-E.tag-module_critical__fT5Pe {
+  background-color: #311616;
+  border-color: #EC515B;
+  color: #EC515B;
+}
+.cui-theme-dark .tag-module_tag__rGA-E.tag-module_information__gjuZe {
+  background-color: #203439;
+  border-color: #02B3E6;
+  color: #02B3E6;
+}
+.cui-theme-dark .tag-module_tag__rGA-E.tag-module_success__M-mEI {
+  background-color: #212A04;
+  border-color: #30D136;
+  color: #30D136;
+}
+.cui-theme-dark .tag-module_tag__rGA-E.tag-module_alert__1NDIs {
+  background-color: #311616;
+  border-color: #FD553E;
+  color: #FD553E;
+}
+.cui-theme-dark .tag-module_tag__rGA-E.tag-module_error__fo8QB {
+  background-color: #311616;
+  border-color: #FD553E;
+  color: #FD553E;
+}
+.cui-theme-dark .tag-module_tag__rGA-E.tag-module_warning__29pni {
+  background-color: #632E03;
+  border-color: #FD8F3E;
+  color: #FD8F3E;
+}
+.cui-theme-light .tag-module_tag__rGA-E.tag-module_info__PMCQH {
+  background-color: #80D9F3;
+  border-color: #80D9F3;
+  color: #203439;
+}
+.cui-theme-light .tag-module_tag__rGA-E.tag-module_very-low__a6WSr {
+  background-color: #B1E02C;
+  border-color: #B1E02C;
+  color: #212A04;
+}
+.cui-theme-light .tag-module_tag__rGA-E.tag-module_low__57msG {
+  background-color: #E2E369;
+  border-color: #E2E369;
+  color: #353505;
+}
+.cui-theme-light .tag-module_tag__rGA-E.tag-module_medium__PtVKT {
+  background-color: #FD8F3E;
+  border-color: #FD8F3E;
+  color: #632E03;
+}
+.cui-theme-light .tag-module_tag__rGA-E.tag-module_high__8ayT0 {
+  background-color: #FD553E;
+  border-color: #FD553E;
+  color: #371A1A;
+}
+.cui-theme-light .tag-module_tag__rGA-E.tag-module_critical__fT5Pe {
+  background-color: #EC515B;
+  border-color: #EC515B;
+  color: #311616;
+}
+.cui-theme-light .tag-module_tag__rGA-E.tag-module_information__gjuZe {
+  background-color: #02B3E6;
+  border-color: #02B3E6;
+  color: #203439;
+}
+.cui-theme-light .tag-module_tag__rGA-E.tag-module_success__M-mEI {
+  background-color: #30D136;
+  border-color: #30D136;
+  color: #212A04;
+}
+.cui-theme-light .tag-module_tag__rGA-E.tag-module_alert__1NDIs {
+  background-color: #FD553E;
+  border-color: #FD553E;
+  color: #311616;
+}
+.cui-theme-light .tag-module_tag__rGA-E.tag-module_error__fo8QB {
+  background-color: #FD553E;
+  border-color: #FD553E;
+  color: #311616;
+}
+.cui-theme-light .tag-module_tag__rGA-E.tag-module_warning__29pni {
+  background-color: #FD8F3E;
+  border-color: #FD8F3E;
+  color: #632E03;
 }

package/dist/ui/esm/src/core/hooks/useClassNames.js

@@ -0,0 +1,2 @@
+import{useMemo as r}from"react";import{classNames as o}from"../utils/helpers/ui.js";const t=(t,e)=>r((()=>o(...t)),[t,e]);export{t as useClassNames};
+//# sourceMappingURL=useClassNames.js.map

package/dist/ui/esm/src/core/hooks/useClassNames.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useClassNames.js","sources":["../../../../../../src/core/hooks/useClassNames.ts"],"sourcesContent":["import { useMemo } from 'react'\n\nimport { classNames, TClassName } from '../utils/helpers/ui'\n\n\n/**\n * Custom hook to memoize class names.\n * @param {TClassName[]} classes - Array of class names or conditions to be applied.\n * @param {unknown[]} deps - Dependencies array for the `useMemo` hook.\n * @returns {ReturnType<typeof classNames>} The computed class names as a string.\n */\nexport const useClassNames = (\n  classes: TClassName[],\n  deps: unknown[],\n// eslint-disable-next-line react-hooks/exhaustive-deps\n): ReturnType<typeof classNames> => useMemo(() => classNames(...classes), [classes, deps])\n"],"names":["useClassNames","classes","deps","useMemo","classNames"],"mappings":"oFAWaA,MAAAA,EAAgBA,CAC3BC,EACAC,IAEkCC,GAAQ,IAAMC,KAAcH,IAAU,CAACA,EAASC"}

package/dist/ui/esm/src/core/ui/components/atoms/tag/Tag.js

@@ -0,0 +1,2 @@
+import{extends as t}from"../../../../../../_virtual/_rollupPluginBabelHelpers.js";import{memo as e,useState as o,useRef as r,useMemo as a}from"react";import{TextAndIcons as n}from"../textAndContent/TextAndContent.js";import{LayoutBox as i}from"../../container/layoutBox/LayoutBox.js";import l from"./tag.module.scss.js";import{TagVariant as s}from"./tag.types.js";import{Text as c}from"../text/Text.js";import{useClassNames as m}from"../../../../hooks/useClassNames.js";import{useResize as p}from"../../../../hooks/useResize.js";import{Tooltip as d}from"../../molecules/popover/Tooltip.js";import{useParseProps as u}from"../../../../hooks/useParseProps.js";import{composeId as h}from"../../../../utils/helpers/text.js";const f={position:"absolute",top:0,background:"transparent",zIndex:0,userSelect:"none"},g=e((e=>{let{variant:g=s.default,text:x,hashtag:R,components:j,onClick:E,children:k,inTable:T,className:b="",...v}=e;const C=j?.TextComponent||c,N=m([l.tag,g&&l[g],E&&l.clickable,T&&l["in-table"],b],[l]),{dataProps:w,restProps:y}=u(v),[L,P]=o(!1),U=r(null),$=r(null),[z]=p(50,(t=>{let{width:e,height:o}=t;const r=z.current;r&&P(r.offsetWidth<r.scrollWidth),U.current={width:e,height:o}})),B=a((()=>!!(k||x||y?.iconLeftUrl||y?.iconLeft||y?.iconRightUrl||y?.iconRight)),[k,x,y?.iconLeftUrl,y?.iconLeft,y?.iconRightUrl,y?.iconRight]),A=a((()=>L?{...f,width:`${U?.current?.width}px`,height:`${U?.current?.height}px`}:null),[L,U?.current]);return React.createElement(React.Fragment,null,React.createElement(i,t({id:`${void 0!==v.id&&v.id||x&&h(x)}`,className:N},w,y,{"data-testid":`${w.dataTestId||w["data-testid"]||v.id||x&&h(x)}`,onClick:E}),R&&React.createElement(C,null,"#"),B&&React.createElement(n,t({className:l.text,iconSize:"0.8em"},y,{width:"auto"}),React.createElement("div",{ref:z,className:"text-truncate"},L&&React.createElement(React.Fragment,null,React.createElement("div",{ref:$,style:A}),React.createElement("span",null,k||x)),!L&&(k||x)))),L&&React.createElement(d,{text:x,targetRef:$}))}));g.displayName="Tag";export{g as Tag};
+//# sourceMappingURL=Tag.js.map

package/dist/ui/esm/src/core/ui/components/atoms/tag/Tag.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tag.js","sources":["../../../../../../../../../src/core/ui/components/atoms/tag/Tag.tsx"],"sourcesContent":["import { memo, FC, useMemo, useRef, CSSProperties, useState, RefObject } from 'react'\n\nimport { TextAndIcons } from '../textAndContent/TextAndContent'\nimport { LayoutBox } from '../../container/layoutBox/LayoutBox'\nimport { useClassNames, useParseProps, useResize, WrapperSize } from '../../../../hooks'\nimport { composeId } from '../../../../utils'\nimport { Tooltip } from '../../molecules'\nimport { Text as BodyText } from '../text'\n\nimport classes from './tag.module.scss'\nimport { TagProps, TagVariant } from './tag.types'\n\n\nconst styles = {\n  textWrapper: { position: 'relative' },\n  textTransformedWrapperTipPlaceholder: {\n    position: 'absolute',\n    top: 0,\n    background: 'transparent',\n    zIndex: 0,\n    userSelect: 'none',\n  },\n}\n\n/**\n * Tag component.\n *  *\n * @type {React.FC<TagProps>}\n * @returns {React.ReactElement} The Tag.\n */\nexport const Tag: FC<TagProps> = memo<TagProps>(({\n  variant = TagVariant.default,\n  text,\n  hashtag,\n  components,\n  onClick,\n  children,\n  inTable,\n  className = '',\n  ...props\n}: TagProps) => {\n  const TextComponent = components?.TextComponent || BodyText\n\n  const classesResolved = useClassNames([\n    classes.tag,\n    variant && classes[variant],\n    onClick && classes.clickable,\n    inTable && classes['in-table'],\n    className,\n  ], [classes])\n\n  const { dataProps, restProps } = useParseProps(props)\n  const [isTruncated, setIsTruncated] = useState(false)\n\n  const wrapperSizeRef = useRef<WrapperSize | null>(null)\n  const tooltipTargetRef = useRef<HTMLDivElement | null>(null)\n\n  const [textRef] = useResize(50, ({ width, height }: WrapperSize) => {\n    const element = textRef.current\n\n    if (element) {\n      setIsTruncated(element.offsetWidth < element.scrollWidth)\n    }\n    wrapperSizeRef.current = { width, height }\n  })\n\n  const hasContent = useMemo(() => !!(children\n    || text\n    || restProps?.iconLeftUrl\n    || restProps?.iconLeft\n    || restProps?.iconRightUrl\n    || restProps?.iconRight\n  ), [children, text, restProps?.iconLeftUrl, restProps?.iconLeft, restProps?.iconRightUrl, restProps?.iconRight])\n\n  const stylesTipPlaceholder = useMemo(() => (isTruncated ? ({\n    ...styles.textTransformedWrapperTipPlaceholder,\n    width: `${wrapperSizeRef?.current?.width}px`,\n    height: `${wrapperSizeRef?.current?.height}px`,\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }) : null), [isTruncated, wrapperSizeRef?.current])\n\n  return (\n    <>\n      <LayoutBox\n        id={`${(typeof props.id !== 'undefined' && props.id) || (text && composeId(text))}`}\n        className={classesResolved}\n        {...dataProps}\n        {...restProps}\n        data-testid={`${dataProps.dataTestId || dataProps['data-testid'] || props.id || (text && composeId(text))}`}\n        onClick={onClick}\n      >\n        {hashtag && <TextComponent>#</TextComponent>}\n        {hasContent\n          && (\n            <TextAndIcons\n              className={classes.text}\n              iconSize='0.8em'\n              {...restProps}\n              width='auto'\n            >\n              <div ref={textRef as RefObject<HTMLDivElement>} className='text-truncate'>\n                {isTruncated && (\n                  <>\n                    <div ref={tooltipTargetRef} style={stylesTipPlaceholder as CSSProperties} />\n                    <span>{children || text}</span>\n                  </>\n                )}\n                {!isTruncated && (children || text)}\n              </div>\n            </TextAndIcons>\n          )}\n      </LayoutBox>\n      {isTruncated && <Tooltip text={text} targetRef={tooltipTargetRef} />}\n    </>\n  )\n})\n\nTag.displayName = 'Tag'\n"],"names":["styles","position","top","background","zIndex","userSelect","Tag","memo","_ref","variant","TagVariant","default","text","hashtag","components","onClick","children","inTable","className","props","TextComponent","BodyText","classesResolved","useClassNames","classes","tag","clickable","dataProps","restProps","useParseProps","isTruncated","setIsTruncated","useState","wrapperSizeRef","useRef","tooltipTargetRef","textRef","useResize","_ref2","width","height","element","current","offsetWidth","scrollWidth","hasContent","useMemo","iconLeftUrl","iconLeft","iconRightUrl","iconRight","stylesTipPlaceholder","React","createElement","Fragment","LayoutBox","_extends","id","composeId","dataTestId","TextAndIcons","iconSize","ref","style","Tooltip","targetRef","displayName"],"mappings":"+sBAaA,MAAMA,EAEkC,CACpCC,SAAU,WACVC,IAAK,EACLC,WAAY,cACZC,OAAQ,EACRC,WAAY,QAUHC,EAAoBC,GAAeC,IAUhC,IAViCC,QAC/CA,EAAUC,EAAWC,QAAOC,KAC5BA,EAAIC,QACJA,EAAOC,WACPA,EAAUC,QACVA,EAAOC,SACPA,EAAQC,QACRA,EAAOC,UACPA,EAAY,MACTC,GACMX,EACT,MAAMY,EAAgBN,GAAYM,eAAiBC,EAE7CC,EAAkBC,EAAc,CACpCC,EAAQC,IACRhB,GAAWe,EAAQf,GACnBM,GAAWS,EAAQE,UACnBT,GAAWO,EAAQ,YACnBN,GACC,CAACM,KAEEG,UAAEA,EAASC,UAAEA,GAAcC,EAAcV,IACxCW,EAAaC,GAAkBC,GAAS,GAEzCC,EAAiBC,EAA2B,MAC5CC,EAAmBD,EAA8B,OAEhDE,GAAWC,EAAU,IAAIC,IAAoC,IAAnCC,MAAEA,EAAKC,OAAEA,GAAqBF,EAC7D,MAAMG,EAAUL,EAAQM,QAEpBD,GACFV,EAAeU,EAAQE,YAAcF,EAAQG,aAE/CX,EAAeS,QAAU,CAAEH,QAAOC,SAAQ,IAGtCK,EAAaC,GAAQ,OAAS9B,GAC/BJ,GACAgB,GAAWmB,aACXnB,GAAWoB,UACXpB,GAAWqB,cACXrB,GAAWsB,YACb,CAAClC,EAAUJ,EAAMgB,GAAWmB,YAAanB,GAAWoB,SAAUpB,GAAWqB,aAAcrB,GAAWsB,YAE/FC,EAAuBL,GAAQ,IAAOhB,EAAe,IACtD9B,EACHuC,MAAO,GAAGN,GAAgBS,SAASH,UACnCC,OAAQ,GAAGP,GAAgBS,SAASF,YAEjC,MAAO,CAACV,EAAaG,GAAgBS,UAE1C,OACEU,MAAAC,cAAAD,MAAAE,SACEF,KAAAA,MAAAC,cAACE,EAASC,EAAA,CACRC,GAAI,QAAwB,IAAbtC,EAAMsC,IAAsBtC,EAAMsC,IAAQ7C,GAAQ8C,EAAU9C,KAC3EM,UAAWI,GACPK,EACAC,EAAS,CACb,cAAa,GAAGD,EAAUgC,YAAchC,EAAU,gBAAkBR,EAAMsC,IAAO7C,GAAQ8C,EAAU9C,KACnGG,QAASA,IAERF,GAAWuC,MAAAC,cAACjC,EAAc,KAAA,KAC1ByB,GAEGO,MAAAC,cAACO,EAAYJ,EAAA,CACXtC,UAAWM,EAAQZ,KACnBiD,SAAS,SACLjC,EAAS,CACbW,MAAM,SAENa,MAAAC,cAAA,MAAA,CAAKS,IAAK1B,EAAsClB,UAAU,iBACvDY,GACCsB,MAAAC,cAAAD,MAAAE,SAAA,KACEF,MAAAC,cAAA,MAAA,CAAKS,IAAK3B,EAAkB4B,MAAOZ,IACnCC,MAAAC,cAAA,OAAA,KAAOrC,GAAYJ,KAGrBkB,IAAgBd,GAAYJ,MAKvCkB,GAAesB,MAAAC,cAACW,EAAO,CAACpD,KAAMA,EAAMqD,UAAW9B,IAC/C,IAIP7B,EAAI4D,YAAc"}

package/dist/ui/esm/src/core/ui/components/atoms/tag/tag.module.scss.js

@@ -0,0 +1,2 @@
+var _={"overflow-hidden":"tag-module_overflow-hidden__wlxDI","text-truncate":"tag-module_text-truncate__xqW1-","text-nowrap":"tag-module_text-nowrap__CHhhg","text-ellipsis":"tag-module_text-ellipsis__UX32n",tag:"tag-module_tag__rGA-E",text:"tag-module_text__WpK6w","in-table":"tag-module_in-table__cWTuJ",default:"tag-module_default__6cv6k",clickable:"tag-module_clickable__W6arw",info:"tag-module_info__PMCQH","very-low":"tag-module_very-low__a6WSr",low:"tag-module_low__57msG",medium:"tag-module_medium__PtVKT",high:"tag-module_high__8ayT0",critical:"tag-module_critical__fT5Pe",information:"tag-module_information__gjuZe",success:"tag-module_success__M-mEI",alert:"tag-module_alert__1NDIs",error:"tag-module_error__fo8QB",warning:"tag-module_warning__29pni"};export{_ as default};
+//# sourceMappingURL=tag.module.scss.js.map

package/dist/ui/esm/src/core/ui/components/atoms/tag/tag.module.scss.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tag.module.scss.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/ui/esm/src/core/ui/components/atoms/tag/tag.types.js

@@ -0,0 +1,2 @@
+let r=function(r){return r.info="info",r.veryLow="very-low",r.low="low",r.medium="medium",r.high="high",r.critical="critical",r.information="information",r.success="success",r.alert="alert",r.error="error",r.warning="warning",r.default="default",r}({});export{r as TagVariant};
+//# sourceMappingURL=tag.types.js.map

package/dist/ui/esm/src/core/ui/components/atoms/tag/tag.types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tag.types.js","sources":["../../../../../../../../../src/core/ui/components/atoms/tag/tag.types.ts"],"sourcesContent":["import { PropsWithChildren, FC, MouseEvent } from 'react'\n\nimport { TextAndIconsProps } from '../textAndContent/textAndContent.types'\nimport { LayoutBoxProps } from '../../container/layoutBox/layoutBox.types'\nimport { CommonProps } from '../../../../types/CommonProps'\nimport { TextProps } from '../text/text.types'\n\n\nexport enum TagVariant {\n  info = 'info',\n  veryLow = 'very-low',\n  low = 'low',\n  medium = 'medium',\n  high = 'high',\n  critical = 'critical',\n  information = 'information',\n  success = 'success',\n  alert = 'alert',\n  error = 'error',\n  warning = 'warning',\n  default = 'default'\n}\n\nexport type TagProps = PropsWithChildren & CommonProps & TextAndIconsProps & LayoutBoxProps & {\n  variant?: TagVariant\n  text?: string\n  hashtag?: boolean\n  inTable?: boolean\n  components?: {\n    TextComponent?: FC<TextProps>\n  }\n  onClick?: (event?: MouseEvent) => void\n  className?: string\n}\n"],"names":["TagVariant"],"mappings":"AAQYA,IAAAA,WAAAA,GAAU,OAAVA,EAAU,KAAA,OAAVA,EAAU,QAAA,WAAVA,EAAU,IAAA,MAAVA,EAAU,OAAA,SAAVA,EAAU,KAAA,OAAVA,EAAU,SAAA,WAAVA,EAAU,YAAA,cAAVA,EAAU,QAAA,UAAVA,EAAU,MAAA,QAAVA,EAAU,MAAA,QAAVA,EAAU,QAAA,UAAVA,EAAU,QAAA,UAAVA,CAAU,EAAA,CAAA"}

package/dist/ui/esm/src/core/ui/index.js

@@ -1,2 +1,2 @@
-export{calculateColors,calculatePercColor,convertHex,convertRGB,defaultFontSize,pxToRem,resolveStyleValue,setDefaultFontSize,toHex}from"./utils/style.js";export{LayoutBox}from"./components/container/layoutBox/LayoutBox.js";export{LayoutDirection}from"./components/container/layoutBox/layoutBox.types.js";export{LazyComponent,PendingBoundary,createLazyModule,createLazyModuleWithStore,wrapPromise}from"./components/container/lazyComponent/LazyComponent.js";export{CollapsibleContainer}from"./components/container/CollapsibleContainer.js";export{ResizableContainer}from"./components/container/ResizableContainer.js";export{DefaultErrorComponent,ErrorBoundary}from"./components/error/ErrorBoundary.js";export{Field,Select,setIconColor,setIconComponent}from"./components/field/Field.js";export{DividerHorizontal,DividerLine,DividerVertical}from"./components/dividers/DividerLine.js";export{IconBase}from"./components/icon/IconBase.js";export{Icon}from"./components/icon/Icon.js";export{ESIcon,ESIconBase}from"./components/icon/IconWC.js";export{Button,keys}from"./components/atoms/button/Button.js";export{Text}from"./components/atoms/text/Text.js";export{Headline,HeadlineSecondary,HeadlineTertiary}from"./components/atoms/text/Headline.js";export{Paragraph,ParagraphBold,ParagraphBoldSmall,ParagraphSmall}from"./components/atoms/text/Paragraph.js";export{Link}from"./components/atoms/text/Link.js";export{AnchorLink}from"./components/atoms/text/anchor-link/AnchorLink.js";export{TextAndContent,TextAndIcons}from"./components/atoms/textAndContent/TextAndContent.js";export{FlowLayout}from"./components/molecules/layouts/FlowLayout.js";export{Popover}from"./components/molecules/popover/PopoverLite.js";export{Tooltip}from"./components/molecules/popover/Tooltip.js";export{PopoverPlacement}from"./components/molecules/popover/popover.types.js";export{Popup}from"./components/molecules/popup/Popup.js";export{PopupAnimateVariant}from"./components/molecules/popup/popup.types.js";
+export{calculateColors,calculatePercColor,convertHex,convertRGB,defaultFontSize,pxToRem,resolveStyleValue,setDefaultFontSize,toHex}from"./utils/style.js";export{LayoutBox}from"./components/container/layoutBox/LayoutBox.js";export{LayoutDirection}from"./components/container/layoutBox/layoutBox.types.js";export{LazyComponent,PendingBoundary,createLazyModule,createLazyModuleWithStore,wrapPromise}from"./components/container/lazyComponent/LazyComponent.js";export{CollapsibleContainer}from"./components/container/CollapsibleContainer.js";export{ResizableContainer}from"./components/container/ResizableContainer.js";export{DefaultErrorComponent,ErrorBoundary}from"./components/error/ErrorBoundary.js";export{Field,Select,setIconColor,setIconComponent}from"./components/field/Field.js";export{DividerHorizontal,DividerLine,DividerVertical}from"./components/dividers/DividerLine.js";export{IconBase}from"./components/icon/IconBase.js";export{Icon}from"./components/icon/Icon.js";export{ESIcon,ESIconBase}from"./components/icon/IconWC.js";export{Button,keys}from"./components/atoms/button/Button.js";export{Text}from"./components/atoms/text/Text.js";export{Headline,HeadlineSecondary,HeadlineTertiary}from"./components/atoms/text/Headline.js";export{Paragraph,ParagraphBold,ParagraphBoldSmall,ParagraphSmall}from"./components/atoms/text/Paragraph.js";export{Link}from"./components/atoms/text/Link.js";export{AnchorLink}from"./components/atoms/text/anchor-link/AnchorLink.js";export{TextAndContent,TextAndIcons}from"./components/atoms/textAndContent/TextAndContent.js";export{Tag}from"./components/atoms/tag/Tag.js";export{TagVariant}from"./components/atoms/tag/tag.types.js";export{FlowLayout}from"./components/molecules/layouts/FlowLayout.js";export{Popover}from"./components/molecules/popover/PopoverLite.js";export{Tooltip}from"./components/molecules/popover/Tooltip.js";export{PopoverPlacement}from"./components/molecules/popover/popover.types.js";export{Popup}from"./components/molecules/popup/Popup.js";export{PopupAnimateVariant}from"./components/molecules/popup/popup.types.js";
 //# sourceMappingURL=index.js.map

package/dist/ui/index.css

@@ -694,4 +694,168 @@
 .popup-overlay-module_popup-modal-overlay__dlJqM[data-show=false] {
   opacity: 0;
   visibility: hidden;
+}
+:root {
+  --divider-line: #4a4b4b;
+}
+
+.tag-module_overflow-hidden__wlxDI, .tag-module_text-truncate__xqW1- {
+  overflow: hidden !important;
+}
+
+.tag-module_text-nowrap__CHhhg, .tag-module_text-truncate__xqW1- {
+  white-space: nowrap !important;
+}
+
+.tag-module_text-ellipsis__UX32n, .tag-module_text-truncate__xqW1- {
+  text-overflow: ellipsis !important;
+}
+
+.tag-module_tag__rGA-E {
+  display: inline-flex;
+  flex-direction: row;
+  flex-shrink: 1;
+  padding: 4px 8px;
+  gap: 4px;
+  min-height: 18px;
+  border-radius: 4px;
+  border-width: 1px;
+  border-style: solid;
+  align-items: center;
+}
+.tag-module_tag__rGA-E .icon-base {
+  color: #E2E369 !important;
+}
+.tag-module_tag__rGA-E .tag-module_text__WpK6w {
+  white-space: nowrap;
+}
+.tag-module_tag__rGA-E.tag-module_in-table__cWTuJ {
+  justify-content: center;
+  align-items: center;
+  overflow: hidden !important;
+  white-space: nowrap !important;
+  text-overflow: ellipsis !important;
+}
+.tag-module_tag__rGA-E.tag-module_default__6cv6k {
+  background-color: #434747;
+  border-color: #515757;
+  color: #F4F4F4;
+}
+.tag-module_tag__rGA-E.tag-module_clickable__W6arw {
+  cursor: pointer;
+  transition: background-color 0.25s ease;
+}
+.tag-module_tag__rGA-E.tag-module_clickable__W6arw.tag-module_default__6cv6k:hover {
+  background-color: #515757;
+}
+
+.cui-theme-dark .tag-module_tag__rGA-E.tag-module_info__PMCQH {
+  background-color: #203439;
+  border-color: #80D9F3;
+  color: #80D9F3;
+}
+.cui-theme-dark .tag-module_tag__rGA-E.tag-module_very-low__a6WSr {
+  background-color: #212A04;
+  border-color: #B1E02C;
+  color: #B1E02C;
+}
+.cui-theme-dark .tag-module_tag__rGA-E.tag-module_low__57msG {
+  background-color: #353505;
+  border-color: #E2E369;
+  color: #E2E369;
+}
+.cui-theme-dark .tag-module_tag__rGA-E.tag-module_medium__PtVKT {
+  background-color: #632E03;
+  border-color: #FD8F3E;
+  color: #FD8F3E;
+}
+.cui-theme-dark .tag-module_tag__rGA-E.tag-module_high__8ayT0 {
+  background-color: #371A1A;
+  border-color: #FD553E;
+  color: #FD553E;
+}
+.cui-theme-dark .tag-module_tag__rGA-E.tag-module_critical__fT5Pe {
+  background-color: #311616;
+  border-color: #EC515B;
+  color: #EC515B;
+}
+.cui-theme-dark .tag-module_tag__rGA-E.tag-module_information__gjuZe {
+  background-color: #203439;
+  border-color: #02B3E6;
+  color: #02B3E6;
+}
+.cui-theme-dark .tag-module_tag__rGA-E.tag-module_success__M-mEI {
+  background-color: #212A04;
+  border-color: #30D136;
+  color: #30D136;
+}
+.cui-theme-dark .tag-module_tag__rGA-E.tag-module_alert__1NDIs {
+  background-color: #311616;
+  border-color: #FD553E;
+  color: #FD553E;
+}
+.cui-theme-dark .tag-module_tag__rGA-E.tag-module_error__fo8QB {
+  background-color: #311616;
+  border-color: #FD553E;
+  color: #FD553E;
+}
+.cui-theme-dark .tag-module_tag__rGA-E.tag-module_warning__29pni {
+  background-color: #632E03;
+  border-color: #FD8F3E;
+  color: #FD8F3E;
+}
+.cui-theme-light .tag-module_tag__rGA-E.tag-module_info__PMCQH {
+  background-color: #80D9F3;
+  border-color: #80D9F3;
+  color: #203439;
+}
+.cui-theme-light .tag-module_tag__rGA-E.tag-module_very-low__a6WSr {
+  background-color: #B1E02C;
+  border-color: #B1E02C;
+  color: #212A04;
+}
+.cui-theme-light .tag-module_tag__rGA-E.tag-module_low__57msG {
+  background-color: #E2E369;
+  border-color: #E2E369;
+  color: #353505;
+}
+.cui-theme-light .tag-module_tag__rGA-E.tag-module_medium__PtVKT {
+  background-color: #FD8F3E;
+  border-color: #FD8F3E;
+  color: #632E03;
+}
+.cui-theme-light .tag-module_tag__rGA-E.tag-module_high__8ayT0 {
+  background-color: #FD553E;
+  border-color: #FD553E;
+  color: #371A1A;
+}
+.cui-theme-light .tag-module_tag__rGA-E.tag-module_critical__fT5Pe {
+  background-color: #EC515B;
+  border-color: #EC515B;
+  color: #311616;
+}
+.cui-theme-light .tag-module_tag__rGA-E.tag-module_information__gjuZe {
+  background-color: #02B3E6;
+  border-color: #02B3E6;
+  color: #203439;
+}
+.cui-theme-light .tag-module_tag__rGA-E.tag-module_success__M-mEI {
+  background-color: #30D136;
+  border-color: #30D136;
+  color: #212A04;
+}
+.cui-theme-light .tag-module_tag__rGA-E.tag-module_alert__1NDIs {
+  background-color: #FD553E;
+  border-color: #FD553E;
+  color: #311616;
+}
+.cui-theme-light .tag-module_tag__rGA-E.tag-module_error__fo8QB {
+  background-color: #FD553E;
+  border-color: #FD553E;
+  color: #311616;
+}
+.cui-theme-light .tag-module_tag__rGA-E.tag-module_warning__29pni {
+  background-color: #FD8F3E;
+  border-color: #FD8F3E;
+  color: #632E03;
 }

package/dist/ui/src/core/hooks/useClassNames.js

@@ -0,0 +1,2 @@
+"use strict";var e=require("react"),s=require("../utils/helpers/ui.js");exports.useClassNames=(r,u)=>e.useMemo((()=>s.classNames(...r)),[r,u]);
+//# sourceMappingURL=useClassNames.js.map

package/dist/ui/src/core/hooks/useClassNames.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useClassNames.js","sources":["../../../../../src/core/hooks/useClassNames.ts"],"sourcesContent":["import { useMemo } from 'react'\n\nimport { classNames, TClassName } from '../utils/helpers/ui'\n\n\n/**\n * Custom hook to memoize class names.\n * @param {TClassName[]} classes - Array of class names or conditions to be applied.\n * @param {unknown[]} deps - Dependencies array for the `useMemo` hook.\n * @returns {ReturnType<typeof classNames>} The computed class names as a string.\n */\nexport const useClassNames = (\n  classes: TClassName[],\n  deps: unknown[],\n// eslint-disable-next-line react-hooks/exhaustive-deps\n): ReturnType<typeof classNames> => useMemo(() => classNames(...classes), [classes, deps])\n"],"names":["useClassNames","classes","deps","useMemo","classNames"],"mappings":"8FAW6BA,CAC3BC,EACAC,IAEkCC,EAAOA,SAAC,IAAMC,EAAAA,cAAcH,IAAU,CAACA,EAASC"}

package/dist/ui/src/core/ui/components/atoms/tag/Tag.js

@@ -0,0 +1,2 @@
+"use strict";var e=require("../../../../../../_virtual/_rollupPluginBabelHelpers.js"),t=require("react"),a=require("../textAndContent/TextAndContent.js"),s=require("../../container/layoutBox/LayoutBox.js"),r=require("./tag.module.scss.js"),l=require("./tag.types.js"),n=require("../text/Text.js"),i=require("../../../../hooks/useClassNames.js"),o=require("../../../../hooks/useResize.js"),c=require("../../molecules/popover/Tooltip.js"),u=require("../../../../hooks/useParseProps.js"),d=require("../../../../utils/helpers/text.js");const m={position:"absolute",top:0,background:"transparent",zIndex:0,userSelect:"none"},h=t.memo((h=>{let{variant:p=l.TagVariant.default,text:x,hashtag:g,components:R,onClick:f,children:q,inTable:T,className:j="",...E}=h;const k=R?.TextComponent||n.Text,v=i.useClassNames([r.default.tag,p&&r.default[p],f&&r.default.clickable,T&&r.default["in-table"],j],[r.default]),{dataProps:C,restProps:N}=u.useParseProps(E),[P,b]=t.useState(!1),y=t.useRef(null),L=t.useRef(null),[w]=o.useResize(50,(e=>{let{width:t,height:a}=e;const s=w.current;s&&b(s.offsetWidth<s.scrollWidth),y.current={width:t,height:a}})),I=t.useMemo((()=>!!(q||x||N?.iconLeftUrl||N?.iconLeft||N?.iconRightUrl||N?.iconRight)),[q,x,N?.iconLeftUrl,N?.iconLeft,N?.iconRightUrl,N?.iconRight]),z=t.useMemo((()=>P?{...m,width:`${y?.current?.width}px`,height:`${y?.current?.height}px`}:null),[P,y?.current]);return React.createElement(React.Fragment,null,React.createElement(s.LayoutBox,e.extends({id:`${void 0!==E.id&&E.id||x&&d.composeId(x)}`,className:v},C,N,{"data-testid":`${C.dataTestId||C["data-testid"]||E.id||x&&d.composeId(x)}`,onClick:f}),g&&React.createElement(k,null,"#"),I&&React.createElement(a.TextAndIcons,e.extends({className:r.default.text,iconSize:"0.8em"},N,{width:"auto"}),React.createElement("div",{ref:w,className:"text-truncate"},P&&React.createElement(React.Fragment,null,React.createElement("div",{ref:L,style:z}),React.createElement("span",null,q||x)),!P&&(q||x)))),P&&React.createElement(c.Tooltip,{text:x,targetRef:L}))}));h.displayName="Tag",exports.Tag=h;
+//# sourceMappingURL=Tag.js.map

package/dist/ui/src/core/ui/components/atoms/tag/Tag.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tag.js","sources":["../../../../../../../../src/core/ui/components/atoms/tag/Tag.tsx"],"sourcesContent":["import { memo, FC, useMemo, useRef, CSSProperties, useState, RefObject } from 'react'\n\nimport { TextAndIcons } from '../textAndContent/TextAndContent'\nimport { LayoutBox } from '../../container/layoutBox/LayoutBox'\nimport { useClassNames, useParseProps, useResize, WrapperSize } from '../../../../hooks'\nimport { composeId } from '../../../../utils'\nimport { Tooltip } from '../../molecules'\nimport { Text as BodyText } from '../text'\n\nimport classes from './tag.module.scss'\nimport { TagProps, TagVariant } from './tag.types'\n\n\nconst styles = {\n  textWrapper: { position: 'relative' },\n  textTransformedWrapperTipPlaceholder: {\n    position: 'absolute',\n    top: 0,\n    background: 'transparent',\n    zIndex: 0,\n    userSelect: 'none',\n  },\n}\n\n/**\n * Tag component.\n *  *\n * @type {React.FC<TagProps>}\n * @returns {React.ReactElement} The Tag.\n */\nexport const Tag: FC<TagProps> = memo<TagProps>(({\n  variant = TagVariant.default,\n  text,\n  hashtag,\n  components,\n  onClick,\n  children,\n  inTable,\n  className = '',\n  ...props\n}: TagProps) => {\n  const TextComponent = components?.TextComponent || BodyText\n\n  const classesResolved = useClassNames([\n    classes.tag,\n    variant && classes[variant],\n    onClick && classes.clickable,\n    inTable && classes['in-table'],\n    className,\n  ], [classes])\n\n  const { dataProps, restProps } = useParseProps(props)\n  const [isTruncated, setIsTruncated] = useState(false)\n\n  const wrapperSizeRef = useRef<WrapperSize | null>(null)\n  const tooltipTargetRef = useRef<HTMLDivElement | null>(null)\n\n  const [textRef] = useResize(50, ({ width, height }: WrapperSize) => {\n    const element = textRef.current\n\n    if (element) {\n      setIsTruncated(element.offsetWidth < element.scrollWidth)\n    }\n    wrapperSizeRef.current = { width, height }\n  })\n\n  const hasContent = useMemo(() => !!(children\n    || text\n    || restProps?.iconLeftUrl\n    || restProps?.iconLeft\n    || restProps?.iconRightUrl\n    || restProps?.iconRight\n  ), [children, text, restProps?.iconLeftUrl, restProps?.iconLeft, restProps?.iconRightUrl, restProps?.iconRight])\n\n  const stylesTipPlaceholder = useMemo(() => (isTruncated ? ({\n    ...styles.textTransformedWrapperTipPlaceholder,\n    width: `${wrapperSizeRef?.current?.width}px`,\n    height: `${wrapperSizeRef?.current?.height}px`,\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }) : null), [isTruncated, wrapperSizeRef?.current])\n\n  return (\n    <>\n      <LayoutBox\n        id={`${(typeof props.id !== 'undefined' && props.id) || (text && composeId(text))}`}\n        className={classesResolved}\n        {...dataProps}\n        {...restProps}\n        data-testid={`${dataProps.dataTestId || dataProps['data-testid'] || props.id || (text && composeId(text))}`}\n        onClick={onClick}\n      >\n        {hashtag && <TextComponent>#</TextComponent>}\n        {hasContent\n          && (\n            <TextAndIcons\n              className={classes.text}\n              iconSize='0.8em'\n              {...restProps}\n              width='auto'\n            >\n              <div ref={textRef as RefObject<HTMLDivElement>} className='text-truncate'>\n                {isTruncated && (\n                  <>\n                    <div ref={tooltipTargetRef} style={stylesTipPlaceholder as CSSProperties} />\n                    <span>{children || text}</span>\n                  </>\n                )}\n                {!isTruncated && (children || text)}\n              </div>\n            </TextAndIcons>\n          )}\n      </LayoutBox>\n      {isTruncated && <Tooltip text={text} targetRef={tooltipTargetRef} />}\n    </>\n  )\n})\n\nTag.displayName = 'Tag'\n"],"names":["styles","position","top","background","zIndex","userSelect","Tag","memo","_ref","variant","TagVariant","default","text","hashtag","components","onClick","children","inTable","className","props","TextComponent","BodyText","classesResolved","useClassNames","classes","tag","clickable","dataProps","restProps","useParseProps","isTruncated","setIsTruncated","useState","wrapperSizeRef","useRef","tooltipTargetRef","textRef","useResize","_ref2","width","height","element","current","offsetWidth","scrollWidth","hasContent","useMemo","iconLeftUrl","iconLeft","iconRightUrl","iconRight","stylesTipPlaceholder","React","createElement","Fragment","LayoutBox","_extends","id","composeId","dataTestId","TextAndIcons","iconSize","ref","style","Tooltip","targetRef","displayName"],"mappings":"ohBAaA,MAAMA,EAEkC,CACpCC,SAAU,WACVC,IAAK,EACLC,WAAY,cACZC,OAAQ,EACRC,WAAY,QAUHC,EAAoBC,EAAIA,MAAWC,IAUhC,IAViCC,QAC/CA,EAAUC,EAAUA,WAACC,aACrBC,EAAIC,QACJA,EAAOC,WACPA,EAAUC,QACVA,EAAOC,SACPA,EAAQC,QACRA,EAAOC,UACPA,EAAY,MACTC,GACMX,EACT,MAAMY,EAAgBN,GAAYM,eAAiBC,OAE7CC,EAAkBC,EAAaA,cAAC,CACpCC,EAAOb,QAACc,IACRhB,GAAWe,EAAAA,QAAQf,GACnBM,GAAWS,EAAAA,QAAQE,UACnBT,GAAWO,UAAQ,YACnBN,GACC,CAACM,EAAOb,WAELgB,UAAEA,EAASC,UAAEA,GAAcC,EAAAA,cAAcV,IACxCW,EAAaC,GAAkBC,EAAQA,UAAC,GAEzCC,EAAiBC,SAA2B,MAC5CC,EAAmBD,SAA8B,OAEhDE,GAAWC,YAAU,IAAIC,IAAoC,IAAnCC,MAAEA,EAAKC,OAAEA,GAAqBF,EAC7D,MAAMG,EAAUL,EAAQM,QAEpBD,GACFV,EAAeU,EAAQE,YAAcF,EAAQG,aAE/CX,EAAeS,QAAU,CAAEH,QAAOC,SAAQ,IAGtCK,EAAaC,EAAAA,SAAQ,OAAS9B,GAC/BJ,GACAgB,GAAWmB,aACXnB,GAAWoB,UACXpB,GAAWqB,cACXrB,GAAWsB,YACb,CAAClC,EAAUJ,EAAMgB,GAAWmB,YAAanB,GAAWoB,SAAUpB,GAAWqB,aAAcrB,GAAWsB,YAE/FC,EAAuBL,WAAQ,IAAOhB,EAAe,IACtD9B,EACHuC,MAAO,GAAGN,GAAgBS,SAASH,UACnCC,OAAQ,GAAGP,GAAgBS,SAASF,YAEjC,MAAO,CAACV,EAAaG,GAAgBS,UAE1C,OACEU,MAAAC,cAAAD,MAAAE,SACEF,KAAAA,MAAAC,cAACE,EAASA,UAAAC,UAAA,CACRC,GAAI,QAAwB,IAAbtC,EAAMsC,IAAsBtC,EAAMsC,IAAQ7C,GAAQ8C,YAAU9C,KAC3EM,UAAWI,GACPK,EACAC,EAAS,CACb,cAAa,GAAGD,EAAUgC,YAAchC,EAAU,gBAAkBR,EAAMsC,IAAO7C,GAAQ8C,YAAU9C,KACnGG,QAASA,IAERF,GAAWuC,MAAAC,cAACjC,EAAc,KAAA,KAC1ByB,GAEGO,MAAAC,cAACO,EAAAA,aAAYJ,EAAAA,QAAA,CACXtC,UAAWM,EAAOb,QAACC,KACnBiD,SAAS,SACLjC,EAAS,CACbW,MAAM,SAENa,MAAAC,cAAA,MAAA,CAAKS,IAAK1B,EAAsClB,UAAU,iBACvDY,GACCsB,MAAAC,cAAAD,MAAAE,SAAA,KACEF,MAAAC,cAAA,MAAA,CAAKS,IAAK3B,EAAkB4B,MAAOZ,IACnCC,MAAAC,cAAA,OAAA,KAAOrC,GAAYJ,KAGrBkB,IAAgBd,GAAYJ,MAKvCkB,GAAesB,MAAAC,cAACW,UAAO,CAACpD,KAAMA,EAAMqD,UAAW9B,IAC/C,IAIP7B,EAAI4D,YAAc"}

package/dist/ui/src/core/ui/components/atoms/tag/tag.module.scss.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});exports.default={"overflow-hidden":"tag-module_overflow-hidden__wlxDI","text-truncate":"tag-module_text-truncate__xqW1-","text-nowrap":"tag-module_text-nowrap__CHhhg","text-ellipsis":"tag-module_text-ellipsis__UX32n",tag:"tag-module_tag__rGA-E",text:"tag-module_text__WpK6w","in-table":"tag-module_in-table__cWTuJ",default:"tag-module_default__6cv6k",clickable:"tag-module_clickable__W6arw",info:"tag-module_info__PMCQH","very-low":"tag-module_very-low__a6WSr",low:"tag-module_low__57msG",medium:"tag-module_medium__PtVKT",high:"tag-module_high__8ayT0",critical:"tag-module_critical__fT5Pe",information:"tag-module_information__gjuZe",success:"tag-module_success__M-mEI",alert:"tag-module_alert__1NDIs",error:"tag-module_error__fo8QB",warning:"tag-module_warning__29pni"};
+//# sourceMappingURL=tag.module.scss.js.map

package/dist/ui/src/core/ui/components/atoms/tag/tag.module.scss.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tag.module.scss.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/ui/src/core/ui/components/atoms/tag/tag.types.js

@@ -0,0 +1,2 @@
+"use strict";let r=function(r){return r.info="info",r.veryLow="very-low",r.low="low",r.medium="medium",r.high="high",r.critical="critical",r.information="information",r.success="success",r.alert="alert",r.error="error",r.warning="warning",r.default="default",r}({});exports.TagVariant=r;
+//# sourceMappingURL=tag.types.js.map

package/dist/ui/src/core/ui/components/atoms/tag/tag.types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tag.types.js","sources":["../../../../../../../../src/core/ui/components/atoms/tag/tag.types.ts"],"sourcesContent":["import { PropsWithChildren, FC, MouseEvent } from 'react'\n\nimport { TextAndIconsProps } from '../textAndContent/textAndContent.types'\nimport { LayoutBoxProps } from '../../container/layoutBox/layoutBox.types'\nimport { CommonProps } from '../../../../types/CommonProps'\nimport { TextProps } from '../text/text.types'\n\n\nexport enum TagVariant {\n  info = 'info',\n  veryLow = 'very-low',\n  low = 'low',\n  medium = 'medium',\n  high = 'high',\n  critical = 'critical',\n  information = 'information',\n  success = 'success',\n  alert = 'alert',\n  error = 'error',\n  warning = 'warning',\n  default = 'default'\n}\n\nexport type TagProps = PropsWithChildren & CommonProps & TextAndIconsProps & LayoutBoxProps & {\n  variant?: TagVariant\n  text?: string\n  hashtag?: boolean\n  inTable?: boolean\n  components?: {\n    TextComponent?: FC<TextProps>\n  }\n  onClick?: (event?: MouseEvent) => void\n  className?: string\n}\n"],"names":["TagVariant"],"mappings":"aAQYA,IAAAA,WAAAA,GAAU,OAAVA,EAAU,KAAA,OAAVA,EAAU,QAAA,WAAVA,EAAU,IAAA,MAAVA,EAAU,OAAA,SAAVA,EAAU,KAAA,OAAVA,EAAU,SAAA,WAAVA,EAAU,YAAA,cAAVA,EAAU,QAAA,UAAVA,EAAU,MAAA,QAAVA,EAAU,MAAA,QAAVA,EAAU,QAAA,UAAVA,EAAU,QAAA,UAAVA,CAAU,EAAA,CAAA"}

package/dist/ui/src/core/ui/index.js

@@ -1,2 +1,2 @@
-"use strict";var e=require("./utils/style.js"),o=require("./components/container/layoutBox/LayoutBox.js"),r=require("./components/container/layoutBox/layoutBox.types.js"),t=require("./components/container/lazyComponent/LazyComponent.js"),n=require("./components/container/CollapsibleContainer.js"),s=require("./components/container/ResizableContainer.js"),p=require("./components/error/ErrorBoundary.js"),a=require("./components/field/Field.js"),i=require("./components/dividers/DividerLine.js"),l=require("./components/icon/IconBase.js"),c=require("./components/icon/Icon.js"),u=require("./components/icon/IconWC.js"),x=require("./components/atoms/button/Button.js"),m=require("./components/atoms/text/Text.js"),d=require("./components/atoms/text/Headline.js"),y=require("./components/atoms/text/Paragraph.js"),C=require("./components/atoms/text/Link.js"),P=require("./components/atoms/text/anchor-link/AnchorLink.js"),j=require("./components/atoms/textAndContent/TextAndContent.js"),q=require("./components/molecules/layouts/FlowLayout.js"),B=require("./components/molecules/popover/PopoverLite.js"),L=require("./components/molecules/popover/Tooltip.js"),v=require("./components/molecules/popover/popover.types.js"),S=require("./components/molecules/popup/Popup.js"),z=require("./components/molecules/popup/popup.types.js");exports.calculateColors=e.calculateColors,exports.calculatePercColor=e.calculatePercColor,exports.convertHex=e.convertHex,exports.convertRGB=e.convertRGB,Object.defineProperty(exports,"defaultFontSize",{enumerable:!0,get:function(){return e.defaultFontSize}}),exports.pxToRem=e.pxToRem,exports.resolveStyleValue=e.resolveStyleValue,exports.setDefaultFontSize=e.setDefaultFontSize,exports.toHex=e.toHex,exports.LayoutBox=o.LayoutBox,exports.LayoutDirection=r.LayoutDirection,exports.LazyComponent=t.LazyComponent,exports.PendingBoundary=t.PendingBoundary,exports.createLazyModule=t.createLazyModule,exports.createLazyModuleWithStore=t.createLazyModuleWithStore,exports.wrapPromise=t.wrapPromise,exports.CollapsibleContainer=n.CollapsibleContainer,exports.ResizableContainer=s.ResizableContainer,exports.DefaultErrorComponent=p.DefaultErrorComponent,exports.ErrorBoundary=p.ErrorBoundary,exports.Field=a.Field,exports.Select=a.Select,exports.setIconColor=a.setIconColor,exports.setIconComponent=a.setIconComponent,exports.DividerHorizontal=i.DividerHorizontal,exports.DividerLine=i.DividerLine,exports.DividerVertical=i.DividerVertical,exports.IconBase=l.IconBase,exports.Icon=c.Icon,exports.ESIcon=u.ESIcon,exports.ESIconBase=u.ESIconBase,exports.Button=x.Button,exports.keys=x.keys,exports.Text=m.Text,exports.Headline=d.Headline,exports.HeadlineSecondary=d.HeadlineSecondary,exports.HeadlineTertiary=d.HeadlineTertiary,exports.Paragraph=y.Paragraph,exports.ParagraphBold=y.ParagraphBold,exports.ParagraphBoldSmall=y.ParagraphBoldSmall,exports.ParagraphSmall=y.ParagraphSmall,exports.Link=C.Link,exports.AnchorLink=P.AnchorLink,exports.TextAndContent=j.TextAndContent,exports.TextAndIcons=j.TextAndIcons,exports.FlowLayout=q.FlowLayout,exports.Popover=B.Popover,exports.Tooltip=L.Tooltip,exports.PopoverPlacement=v.PopoverPlacement,exports.Popup=S.Popup,exports.PopupAnimateVariant=z.PopupAnimateVariant;
+"use strict";var e=require("./utils/style.js"),o=require("./components/container/layoutBox/LayoutBox.js"),t=require("./components/container/layoutBox/layoutBox.types.js"),r=require("./components/container/lazyComponent/LazyComponent.js"),n=require("./components/container/CollapsibleContainer.js"),s=require("./components/container/ResizableContainer.js"),a=require("./components/error/ErrorBoundary.js"),p=require("./components/field/Field.js"),i=require("./components/dividers/DividerLine.js"),l=require("./components/icon/IconBase.js"),c=require("./components/icon/Icon.js"),u=require("./components/icon/IconWC.js"),x=require("./components/atoms/button/Button.js"),m=require("./components/atoms/text/Text.js"),d=require("./components/atoms/text/Headline.js"),y=require("./components/atoms/text/Paragraph.js"),j=require("./components/atoms/text/Link.js"),C=require("./components/atoms/text/anchor-link/AnchorLink.js"),P=require("./components/atoms/textAndContent/TextAndContent.js"),q=require("./components/atoms/tag/Tag.js"),B=require("./components/atoms/tag/tag.types.js"),L=require("./components/molecules/layouts/FlowLayout.js"),v=require("./components/molecules/popover/PopoverLite.js"),g=require("./components/molecules/popover/Tooltip.js"),S=require("./components/molecules/popover/popover.types.js"),T=require("./components/molecules/popup/Popup.js"),z=require("./components/molecules/popup/popup.types.js");exports.calculateColors=e.calculateColors,exports.calculatePercColor=e.calculatePercColor,exports.convertHex=e.convertHex,exports.convertRGB=e.convertRGB,Object.defineProperty(exports,"defaultFontSize",{enumerable:!0,get:function(){return e.defaultFontSize}}),exports.pxToRem=e.pxToRem,exports.resolveStyleValue=e.resolveStyleValue,exports.setDefaultFontSize=e.setDefaultFontSize,exports.toHex=e.toHex,exports.LayoutBox=o.LayoutBox,exports.LayoutDirection=t.LayoutDirection,exports.LazyComponent=r.LazyComponent,exports.PendingBoundary=r.PendingBoundary,exports.createLazyModule=r.createLazyModule,exports.createLazyModuleWithStore=r.createLazyModuleWithStore,exports.wrapPromise=r.wrapPromise,exports.CollapsibleContainer=n.CollapsibleContainer,exports.ResizableContainer=s.ResizableContainer,exports.DefaultErrorComponent=a.DefaultErrorComponent,exports.ErrorBoundary=a.ErrorBoundary,exports.Field=p.Field,exports.Select=p.Select,exports.setIconColor=p.setIconColor,exports.setIconComponent=p.setIconComponent,exports.DividerHorizontal=i.DividerHorizontal,exports.DividerLine=i.DividerLine,exports.DividerVertical=i.DividerVertical,exports.IconBase=l.IconBase,exports.Icon=c.Icon,exports.ESIcon=u.ESIcon,exports.ESIconBase=u.ESIconBase,exports.Button=x.Button,exports.keys=x.keys,exports.Text=m.Text,exports.Headline=d.Headline,exports.HeadlineSecondary=d.HeadlineSecondary,exports.HeadlineTertiary=d.HeadlineTertiary,exports.Paragraph=y.Paragraph,exports.ParagraphBold=y.ParagraphBold,exports.ParagraphBoldSmall=y.ParagraphBoldSmall,exports.ParagraphSmall=y.ParagraphSmall,exports.Link=j.Link,exports.AnchorLink=C.AnchorLink,exports.TextAndContent=P.TextAndContent,exports.TextAndIcons=P.TextAndIcons,exports.Tag=q.Tag,exports.TagVariant=B.TagVariant,exports.FlowLayout=L.FlowLayout,exports.Popover=v.Popover,exports.Tooltip=g.Tooltip,exports.PopoverPlacement=S.PopoverPlacement,exports.Popup=T.Popup,exports.PopupAnimateVariant=z.PopupAnimateVariant;
 //# sourceMappingURL=index.js.map