@geneui/components 3.0.0-next-89cc223-14032025 → 3.0.0-next-6c2658b-26032025

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.
package/Avatar.js CHANGED
@@ -1,6 +1,6 @@
1
1
  import React__default, { useState, useEffect } from 'react';
2
2
  import { c as classNames } from './index-ce02421b.js';
3
- import { _ as _objectWithoutProperties, a as _extends } from './ArrowLeft-b88e2ba8.js';
3
+ import { _ as _objectWithoutProperties, a as _extends } from './ActivityRecent-b88e2ba8.js';
4
4
  import { s as styleInject } from './style-inject.es-746bb8ed.js';
5
5
 
6
6
  var _excluded = ["size", "color"];
package/Checkbox.js CHANGED
@@ -1,19 +1,19 @@
1
1
  import React__default, { useRef, useState, useEffect, useMemo } from 'react';
2
2
  import { c as classNames } from './index-ce02421b.js';
3
- import { _ as _objectWithoutProperties, a as _extends } from './ArrowLeft-b88e2ba8.js';
3
+ import { _ as _objectWithoutProperties, a as _extends } from './ActivityRecent-b88e2ba8.js';
4
4
  import HelperText from './HelperText.js';
5
5
  import Label from './Label.js';
6
6
  import { s as styleInject } from './style-inject.es-746bb8ed.js';
7
- import './ErrorAlertFill-a0afebbf.js';
8
- import './WarningFill-143d0870.js';
7
+ import './Error-e14cf0e1.js';
8
+ import './TriangleAlert-14d7e83c.js';
9
9
  import './Tooltip.js';
10
10
  import './floating-ui.react-0485e4db.js';
11
11
  import 'react-dom';
12
- import './index-d055a077.js';
12
+ import './index-ae180991.js';
13
13
  import './useDebounceCallback-999deae7.js';
14
- import './useEllipsisDetection-500dc188.js';
14
+ import './useEllipsisDetection-dfe1a9d3.js';
15
15
  import './Info.js';
16
- import './InfoOutline-dd2e89d9.js';
16
+ import './InfoOutlined-fc7d9afa.js';
17
17
 
18
18
  var _excluded$1 = ["size", "color"];
19
19
  var SvgCheckMark = function SvgCheckMark(_ref) {
@@ -35,7 +35,7 @@ var SvgCheckMark = function SvgCheckMark(_ref) {
35
35
  };
36
36
 
37
37
  var _excluded = ["size", "color"];
38
- var SvgMinusOutline = function SvgMinusOutline(_ref) {
38
+ var SvgMinus = function SvgMinus(_ref) {
39
39
  var _ref$size = _ref.size,
40
40
  size = _ref$size === void 0 ? 24 : _ref$size,
41
41
  _ref$color = _ref.color,
@@ -53,7 +53,7 @@ var SvgMinusOutline = function SvgMinusOutline(_ref) {
53
53
  }));
54
54
  };
55
55
 
56
- var css_248z = ".checkbox{display:inline-flex;flex-direction:column;max-width:100%;min-width:0}.checkbox__input{appearance:none;background:none;border:none;border-radius:var(--guit-ref-radius-4xsmall);height:100%;left:0;position:absolute;top:0;width:100%;z-index:-1}.checkbox__input:checked+.checkbox__imitation,.checkbox__input:indeterminate+.checkbox__imitation{background-color:var(--guit-sem-color-background-selected-2);border-color:var(--guit-sem-color-background-selected-2)}.checkbox__input:checked+.checkbox__imitation:hover,.checkbox__input:indeterminate+.checkbox__imitation:hover{background-color:var(--guit-sem-color-background-selected-2-hover);border-color:var(--guit-sem-color-background-selected-2-hover)}.checkbox__input:checked+.checkbox__imitation:active,.checkbox__input:indeterminate+.checkbox__imitation:active{background-color:var(--guit-sem-color-background-selected-2-pressed);border-color:var(--guit-sem-color-background-selected-2-pressed)}.checkbox__input:checked+.checkbox__imitation .checkbox__icon,.checkbox__input:indeterminate+.checkbox__imitation .checkbox__icon{opacity:1}.checkbox__label{display:flex;max-width:-moz-fit-content;max-width:fit-content}.checkbox__imitationHolder{align-items:center;display:flex;flex:0 0 auto;height:var(--guit-sem-dimension-height-small);justify-content:center;width:var(--guit-sem-dimension-width-small)}.checkbox__imitationHolder .checkbox__input:not(:checked,:indeterminate)+.checkbox__imitation:hover{background-color:var(--guit-sem-color-background-transparent-1-hover)}.checkbox__imitationHolder .checkbox__input:not(:checked,:indeterminate)+.checkbox__imitation:active{background-color:var(--guit-sem-color-background-transparent-1-pressed)}.checkbox__imitationHolderInner{align-items:center;display:flex;flex:0 0 auto;height:var(--guit-sem-dimension-height-xsmall);justify-content:center;position:relative;width:var(--guit-sem-dimension-width-xsmall)}.checkbox__imitation{border:var(--guit-ref-border-width-thin) solid var(--guit-sem-color-border-neutral-3);border-radius:var(--guit-ref-radius-4xsmall);height:100%;width:100%}.checkbox__icon{color:var(--guit-sem-color-foreground-inverse);left:0;opacity:0;position:absolute;top:0}.checkbox__infoContainer{display:flex}.checkbox:not(.checkbox_labelTop){gap:var(--guit-ref-spacing-4xsmall)}.checkbox:not(.checkbox_labelTop) .checkbox__infoContainer{padding-inline-start:var(--guit-ref-spacing-4xlarge)}.checkbox:not(.checkbox_labelTop) .checkbox__label{gap:var(--guit-ref-spacing-xsmall)}.checkbox_labelTop{gap:var(--guit-ref-spacing-3xsmall)}.checkbox_labelTop .checkbox__label{align-items:normal;flex-direction:column-reverse;gap:var(--guit-ref-spacing-3xsmall)}.checkbox_error .checkbox__imitationHolder .checkbox__imitationHolderInner .checkbox__imitation{border-color:var(--guit-sem-color-border-error)}.checkbox_disabled{pointer-events:none;-webkit-user-select:none;user-select:none}.checkbox_disabled .checkbox__imitationHolder .checkbox__imitationHolderInner .checkbox__imitation{background-color:var(--guit-sem-color-background-disabled);border-color:var(--guit-sem-color-border-disabled-1)}.checkbox_disabled .checkbox__imitationHolder .checkbox__imitationHolderInner .checkbox__imitation .checkbox__icon{color:var(--guit-sem-color-foreground-disabled)}.checkbox_disabled .checkbox__input:not(:checked,:indeterminate)+.checkbox__imitation{background-color:var(--guit-sem-color-background-transparent-1)}.checkbox_readOnly{pointer-events:none}.checkbox_readOnly .checkbox__imitationHolder .checkbox__imitationHolderInner .checkbox__imitation{background-color:var(--guit-sem-color-background-neutral-3);border-color:#0000}.checkbox_readOnly .checkbox__imitationHolder .checkbox__imitationHolderInner .checkbox__imitation .checkbox__icon{color:var(--guit-sem-color-foreground-neutral-1)}.checkbox_readOnly .checkbox__input:not(:checked,:indeterminate)+.checkbox__imitation{border-color:var(--guit-sem-color-border-neutral-2)}";
56
+ var css_248z = ".checkbox{display:inline-flex;flex-direction:column;max-width:100%;min-width:0}.checkbox__input{appearance:none;background:none;border:none;border-radius:var(--guit-ref-radius-4xsmall);height:100%;left:0;position:absolute;top:0;width:100%;z-index:-1}.checkbox__input:checked+.checkbox__imitation,.checkbox__input:indeterminate+.checkbox__imitation{background-color:var(--guit-sem-color-background-selected-2);border-color:var(--guit-sem-color-background-selected-2)}.checkbox__input:checked+.checkbox__imitation:hover,.checkbox__input:indeterminate+.checkbox__imitation:hover{background-color:var(--guit-sem-color-background-selected-2-hover);border-color:var(--guit-sem-color-background-selected-2-hover)}.checkbox__input:checked+.checkbox__imitation:active,.checkbox__input:indeterminate+.checkbox__imitation:active{background-color:var(--guit-sem-color-background-selected-2-pressed);border-color:var(--guit-sem-color-background-selected-2-pressed)}.checkbox__input:checked+.checkbox__imitation .checkbox__icon,.checkbox__input:indeterminate+.checkbox__imitation .checkbox__icon{opacity:1}.checkbox__label{display:flex;max-width:-moz-fit-content;max-width:fit-content}.checkbox__imitationHolder{align-items:center;display:flex;flex:0 0 auto;justify-content:center}.checkbox__imitationHolder:only-child{height:var(--guit-sem-dimension-height-small);width:var(--guit-sem-dimension-width-small)}.checkbox__imitationHolder .checkbox__input:not(:checked,:indeterminate)+.checkbox__imitation:hover{background-color:var(--guit-sem-color-background-transparent-1-hover)}.checkbox__imitationHolder .checkbox__input:not(:checked,:indeterminate)+.checkbox__imitation:active{background-color:var(--guit-sem-color-background-transparent-1-pressed)}.checkbox__imitationHolderInner{align-items:center;display:flex;flex:0 0 auto;height:var(--guit-sem-dimension-height-xsmall);justify-content:center;position:relative;width:var(--guit-sem-dimension-width-xsmall)}.checkbox__imitation{border:var(--guit-ref-border-width-thin) solid var(--guit-sem-color-border-neutral-3);border-radius:var(--guit-ref-radius-4xsmall);height:100%;width:100%}.checkbox__icon{color:var(--guit-sem-color-foreground-inverse);left:0;opacity:0;position:absolute;top:0}.checkbox__infoContainer{display:flex}.checkbox:not(.checkbox_labelTop){gap:var(--guit-ref-spacing-3xsmall)}.checkbox:not(.checkbox_labelTop) .checkbox__infoContainer{padding-inline-start:var(--guit-ref-spacing-3xlarge)}.checkbox:not(.checkbox_labelTop) .checkbox__label{gap:var(--guit-ref-spacing-medium)}.checkbox_labelTop{gap:var(--guit-ref-spacing-3xsmall)}.checkbox_labelTop .checkbox__label{align-items:flex-start;flex-direction:column-reverse;gap:var(--guit-ref-spacing-3xsmall)}.checkbox_error .checkbox__imitationHolder .checkbox__imitationHolderInner .checkbox__imitation{border-color:var(--guit-sem-color-border-error)}.checkbox_disabled{pointer-events:none;-webkit-user-select:none;user-select:none}.checkbox_disabled .checkbox__imitationHolder .checkbox__imitationHolderInner .checkbox__imitation{background-color:var(--guit-sem-color-background-disabled);border-color:var(--guit-sem-color-border-disabled-1)}.checkbox_disabled .checkbox__imitationHolder .checkbox__imitationHolderInner .checkbox__imitation .checkbox__icon{color:var(--guit-sem-color-foreground-disabled)}.checkbox_disabled .checkbox__input:not(:checked,:indeterminate)+.checkbox__imitation{background-color:var(--guit-sem-color-background-transparent-1)}.checkbox_readOnly{pointer-events:none}.checkbox_readOnly .checkbox__imitationHolder .checkbox__imitationHolderInner .checkbox__imitation{background-color:var(--guit-sem-color-background-neutral-3);border-color:#0000}.checkbox_readOnly .checkbox__imitationHolder .checkbox__imitationHolderInner .checkbox__imitation .checkbox__icon{color:var(--guit-sem-color-foreground-neutral-1)}.checkbox_readOnly .checkbox__input:not(:checked,:indeterminate)+.checkbox__imitation{border-color:var(--guit-sem-color-border-neutral-2)}";
57
57
  styleInject(css_248z);
58
58
 
59
59
  /**
@@ -96,7 +96,7 @@ const Checkbox = ({ label, required, infoText, disabled, helperText, readOnly, t
96
96
  React__default.createElement("span", { className: "checkbox__imitationHolder" },
97
97
  React__default.createElement("span", { className: "checkbox__imitationHolderInner" },
98
98
  React__default.createElement("input", Object.assign({ type: "checkbox", className: "checkbox__input", onChange: onChangeHandler, onFocus: onFocusHandler, onBlur: onBlurHandler, checked: resolvedChecked, ref: interRef }, (name && { name }), (autoFocus && { autoFocus }), ((disabled || readOnly) && { tabIndex: -1 }))),
99
- React__default.createElement("span", { className: "checkbox__imitation" }, indeterminate && !checked ? (React__default.createElement(SvgMinusOutline, { className: "checkbox__icon", size: 16 })) : (React__default.createElement(SvgCheckMark, { className: "checkbox__icon", size: 16 })))))),
99
+ React__default.createElement("span", { className: "checkbox__imitation" }, indeterminate && !checked ? (React__default.createElement(SvgMinus, { className: "checkbox__icon", size: 16 })) : (React__default.createElement(SvgCheckMark, { className: "checkbox__icon", size: 16 })))))),
100
100
  helperText && (React__default.createElement("div", { className: "checkbox__infoContainer" },
101
101
  React__default.createElement(HelperText, { text: helperText, isDisabled: disabled, type: type })))));
102
102
  };
@@ -1,8 +1,8 @@
1
- import { _ as _objectWithoutProperties, a as _extends } from './ArrowLeft-b88e2ba8.js';
1
+ import { _ as _objectWithoutProperties, a as _extends } from './ActivityRecent-b88e2ba8.js';
2
2
  import React__default from 'react';
3
3
 
4
4
  var _excluded = ["size", "color"];
5
- var SvgClose = function SvgClose(_ref) {
5
+ var SvgCircleFilled = function SvgCircleFilled(_ref) {
6
6
  var _ref$size = _ref.size,
7
7
  size = _ref$size === void 0 ? 24 : _ref$size,
8
8
  _ref$color = _ref.color,
@@ -15,9 +15,9 @@ var SvgClose = function SvgClose(_ref) {
15
15
  fill: color,
16
16
  xmlns: "http://www.w3.org/2000/svg"
17
17
  }, props), /*#__PURE__*/React__default.createElement("path", {
18
- d: "m13.051 12 6.731-6.731a.743.743 0 1 0-1.052-1.051l-6.73 6.73-6.73-6.73a.743.743 0 1 0-1.052 1.05l6.73 6.732-6.73 6.73a.743.743 0 1 0 1.051 1.051l6.73-6.73 6.731 6.731a.743.743 0 1 0 1.052-1.05l-6.73-6.732Z",
18
+ d: "M7 12a5 5 0 1 1 10 0 5 5 0 0 1-10 0Z",
19
19
  fill: color
20
20
  }));
21
21
  };
22
22
 
23
- export { SvgClose as S };
23
+ export { SvgCircleFilled as S };
package/Divider.js CHANGED
@@ -2,7 +2,7 @@ import React__default from 'react';
2
2
  import { c as classNames } from './index-ce02421b.js';
3
3
  import { s as styleInject } from './style-inject.es-746bb8ed.js';
4
4
 
5
- var css_248z = ".divider{display:inline-flex;gap:var(--guit-ref-spacing-xsmall);overflow:hidden}.divider:before{content:\"\";display:block;flex:1;pointer-events:none}.divider_horizontal{align-items:center;width:100%}.divider_horizontal.divider:after,.divider_horizontal.divider:before{border-block-start:var(--guit-ref-border-width-thin) var(--guit-ref-border-style-solid);min-width:var(--guit-sem-dimension-width-medium)}.divider_horizontal.divider_inset{padding-inline:var(--guit-ref-spacing-large)}.divider_horizontal.divider:empty:after{display:none}.divider_vertical{align-items:center;flex-direction:column;height:100%}.divider_vertical.divider:before{border-inline-start:var(--guit-ref-border-width-thin) var(--guit-ref-border-style-solid)}.divider_vertical.divider:after{display:none}.divider_vertical.divider_inset{padding-block:var(--guit-ref-spacing-large)}.divider_color_default .divider__icon,.divider_color_default .divider__text,.divider_color_strong .divider__icon,.divider_color_strong .divider__text{color:var(--guit-sem-color-foreground-neutral-1)}.divider_color_default.divider:after,.divider_color_default.divider:before{border-block-color:var(--guit-sem-color-border-neutral-2);border-inline-color:var(--guit-sem-color-border-neutral-2)}.divider_color_strong.divider:after,.divider_color_strong.divider:before{border-block-color:var(--guit-sem-color-border-neutral-3);border-inline-color:var(--guit-sem-color-border-neutral-3)}.divider_color_brand.divider:after,.divider_color_brand.divider:before{border-block-color:var(--guit-sem-color-border-brand);border-inline-color:var(--guit-sem-color-border-brand)}.divider_color_brand .divider__icon,.divider_color_brand .divider__text{color:var(--guit-sem-color-foreground-brand)}.divider_color_inverse.divider:after,.divider_color_inverse.divider:before{border-block-color:var(--guit-sem-color-border-inverse);border-inline-color:var(--guit-sem-color-border-inverse)}.divider_color_inverse .divider__icon,.divider_color_inverse .divider__text{color:var(--guit-sem-color-foreground-inverse)}.divider_withLabel_before.divider:before{display:none}.divider_withLabel_before.divider:after,.divider_withLabel_center.divider:after{content:\"\";flex:1}.divider_withLabel_center .divider__element{max-width:calc(100% - var(--guit-sem-dimension-width-medium)*4)}.divider_withLabel_after.divider:before{flex:1}.divider_withLabel_after .divider__element,.divider_withLabel_before .divider__element{max-width:calc(100% - var(--guit-sem-dimension-width-medium)*2.8)}.divider__label{align-items:center;display:flex;gap:var(--guit-ref-spacing-3xsmall);overflow:hidden}.divider__text{font-family:var(--guit-sem-font-label-medium-default-semibold-font-family);font-size:var(--guit-sem-font-label-medium-default-semibold-font-size);font-weight:var(--guit-sem-font-label-medium-default-medium-font-weight);line-height:var(--guit-sem-font-label-medium-default-semibold-line-height)}.divider__icon{flex:0 0 auto}.divider__element{display:flex;flex:0 0 auto;min-width:0;order:1}";
5
+ var css_248z = ".divider{display:inline-flex;overflow:hidden}.divider:before{content:\"\";display:block;flex:1;pointer-events:none}.divider_horizontal{align-items:center;gap:var(--guit-ref-spacing-xsmall);width:100%}.divider_horizontal.divider:after,.divider_horizontal.divider:before{border-block-start:var(--guit-ref-border-width-thin) var(--guit-ref-border-style-solid);min-width:var(--guit-sem-dimension-width-medium)}.divider_horizontal.divider_inset{padding-inline:var(--guit-ref-spacing-large)}.divider_horizontal.divider:empty:after{display:none}.divider_vertical{align-items:center;flex-direction:column;height:100%}.divider_vertical.divider:before{border-inline-start:var(--guit-ref-border-width-thin) var(--guit-ref-border-style-solid)}.divider_vertical.divider:after{display:none}.divider_vertical.divider_inset{padding-block:var(--guit-ref-spacing-large)}.divider_color_default .divider__icon,.divider_color_default .divider__text,.divider_color_strong .divider__icon,.divider_color_strong .divider__text{color:var(--guit-sem-color-foreground-neutral-1)}.divider_color_default.divider:after,.divider_color_default.divider:before{border-block-color:var(--guit-sem-color-border-neutral-2);border-inline-color:var(--guit-sem-color-border-neutral-2)}.divider_color_strong.divider:after,.divider_color_strong.divider:before{border-block-color:var(--guit-sem-color-border-neutral-3);border-inline-color:var(--guit-sem-color-border-neutral-3)}.divider_color_brand.divider:after,.divider_color_brand.divider:before{border-block-color:var(--guit-sem-color-border-brand);border-inline-color:var(--guit-sem-color-border-brand)}.divider_color_brand .divider__icon,.divider_color_brand .divider__text{color:var(--guit-sem-color-foreground-brand)}.divider_color_inverse.divider:after,.divider_color_inverse.divider:before{border-block-color:var(--guit-sem-color-border-inverse);border-inline-color:var(--guit-sem-color-border-inverse)}.divider_color_inverse .divider__icon,.divider_color_inverse .divider__text{color:var(--guit-sem-color-foreground-inverse)}.divider_withLabel_before.divider:before{display:none}.divider_withLabel_before.divider:after,.divider_withLabel_center.divider:after{content:\"\";flex:1}.divider_withLabel_center .divider__element{max-width:calc(100% - var(--guit-sem-dimension-width-medium)*4)}.divider_withLabel_after.divider:before{flex:1}.divider_withLabel_after .divider__element,.divider_withLabel_before .divider__element{max-width:calc(100% - var(--guit-sem-dimension-width-medium)*2.8)}.divider__label{align-items:center;display:flex;gap:var(--guit-ref-spacing-3xsmall);overflow:hidden}.divider__text{font-family:var(--guit-sem-font-label-medium-default-semibold-font-family);font-size:var(--guit-sem-font-label-medium-default-semibold-font-size);font-weight:var(--guit-sem-font-label-medium-default-medium-font-weight);line-height:var(--guit-sem-font-label-medium-default-semibold-line-height)}.divider__icon{flex:0 0 auto}.divider__element{display:flex;flex:0 0 auto;min-width:0;order:1}";
6
6
  styleInject(css_248z);
7
7
 
8
8
  /**
@@ -1,8 +1,8 @@
1
- import { _ as _objectWithoutProperties, a as _extends } from './ArrowLeft-b88e2ba8.js';
1
+ import { _ as _objectWithoutProperties, a as _extends } from './ActivityRecent-b88e2ba8.js';
2
2
  import React__default from 'react';
3
3
 
4
4
  var _excluded = ["size", "color"];
5
- var SvgErrorAlertFill = function SvgErrorAlertFill(_ref) {
5
+ var SvgError = function SvgError(_ref) {
6
6
  var _ref$size = _ref.size,
7
7
  size = _ref$size === void 0 ? 24 : _ref$size,
8
8
  _ref$color = _ref.color,
@@ -20,4 +20,4 @@ var SvgErrorAlertFill = function SvgErrorAlertFill(_ref) {
20
20
  }));
21
21
  };
22
22
 
23
- export { SvgErrorAlertFill as S };
23
+ export { SvgError as S };
package/GeneUIProvider.js CHANGED
@@ -1,4 +1,4 @@
1
- export { a as GeneUIDesignSystemContext, G as default } from './index-d055a077.js';
1
+ export { a as GeneUIDesignSystemContext, G as default } from './index-ae180991.js';
2
2
  import 'react';
3
3
  import './useDebounceCallback-999deae7.js';
4
4
  import './style-inject.es-746bb8ed.js';
package/HelperText.js CHANGED
@@ -1,9 +1,9 @@
1
1
  import React__default from 'react';
2
2
  import { c as classNames } from './index-ce02421b.js';
3
- import { S as SvgErrorAlertFill } from './ErrorAlertFill-a0afebbf.js';
4
- import { S as SvgWarningFill } from './WarningFill-143d0870.js';
3
+ import { S as SvgError } from './Error-e14cf0e1.js';
4
+ import { S as SvgTriangleAlert } from './TriangleAlert-14d7e83c.js';
5
5
  import { s as styleInject } from './style-inject.es-746bb8ed.js';
6
- import './ArrowLeft-b88e2ba8.js';
6
+ import './ActivityRecent-b88e2ba8.js';
7
7
 
8
8
  var css_248z = ".helperText{display:inline-flex;gap:var(--guit-ref-spacing-3xsmall);max-width:100%}.helperText_size_medium .helperText__text{font-family:var(--guit-sem-font-label-medium-default-semibold-font-family);font-size:var(--guit-sem-font-label-medium-default-semibold-font-size);font-weight:var(--guit-sem-font-label-medium-default-medium-font-weight);line-height:var(--guit-sem-font-label-medium-default-semibold-line-height)}.helperText_size_small .helperText__text{font-family:var(--guit-sem-font-label-small-default-medium-font-family);font-size:var(--guit-sem-font-label-small-default-medium-font-size);font-weight:var(--guit-sem-font-label-small-default-medium-font-weight);line-height:var(--guit-sem-font-label-small-default-medium-line-height)}.helperText_type_rest{color:var(--guit-sem-color-foreground-neutral-2)}.helperText_type_error{color:var(--guit-sem-color-foreground-error)}.helperText_type_warning{color:var(--guit-sem-color-foreground-neutral-2)}.helperText_type_warning .helperText__icon{color:var(--guit-sem-color-foreground-warning)}.helperText_disabled,.helperText_disabled .helperText__icon{color:var(--guit-sem-color-foreground-disabled)}.helperText__icon{flex:0 0 auto}";
9
9
  styleInject(css_248z);
@@ -17,8 +17,8 @@ const iconSize = {
17
17
  */
18
18
  const HelperText = ({ size = "medium", type = "rest", text, Icon, isDisabled, className }) => {
19
19
  const iconMap = {
20
- error: React__default.createElement(SvgErrorAlertFill, { size: iconSize[size] }),
21
- warning: React__default.createElement(SvgWarningFill, { size: iconSize[size] }),
20
+ error: React__default.createElement(SvgError, { size: iconSize[size] }),
21
+ warning: React__default.createElement(SvgTriangleAlert, { size: iconSize[size] }),
22
22
  rest: Icon && React__default.createElement(Icon, { size: iconSize[size] })
23
23
  };
24
24
  return (React__default.createElement("div", { className: classNames(`helperText helperText_type_${type} helperText_size_${size}`, className, {
package/Info.js CHANGED
@@ -1,12 +1,12 @@
1
1
  import React__default, { useState, useMemo } from 'react';
2
2
  import { c as classNames } from './index-ce02421b.js';
3
- import { S as SvgInfoOutline } from './InfoOutline-dd2e89d9.js';
3
+ import { S as SvgInfoOutlined } from './InfoOutlined-fc7d9afa.js';
4
4
  import Tooltip from './Tooltip.js';
5
5
  import { s as styleInject } from './style-inject.es-746bb8ed.js';
6
- import './ArrowLeft-b88e2ba8.js';
6
+ import './ActivityRecent-b88e2ba8.js';
7
7
  import './floating-ui.react-0485e4db.js';
8
8
  import 'react-dom';
9
- import './index-d055a077.js';
9
+ import './index-ae180991.js';
10
10
  import './useDebounceCallback-999deae7.js';
11
11
 
12
12
  var css_248z = ".info{border-radius:var(--guit-ref-radius-3xsmall);line-height:0}.info_appearance_default{color:var(--guit-sem-color-foreground-neutral-2)}.info_appearance_brand{color:var(--guit-sem-color-foreground-brand)}.info_appearance_inverse{color:var(--guit-sem-color-foreground-inverse)}.info_disabled{color:var(--guit-sem-color-foreground-disabled);pointer-events:none}";
@@ -36,7 +36,7 @@ const Info = ({ infoText, disabled, size = "smallNudge", appearance = "default",
36
36
  }), [appearance, className, disabled]);
37
37
  return (React__default.createElement(Tooltip, { text: infoText, alwaysShow: alwaysShow, appearance: appearance === "inverse" ? "inverse" : "default" },
38
38
  React__default.createElement("button", { type: "button", disabled: disabled, "aria-pressed": alwaysShow, className: buttonClassNames, onKeyDown: keyDownHandler, onBlur: handleBlur },
39
- React__default.createElement(SvgInfoOutline, { className: "info__icon", size: iconSizes[size] }))));
39
+ React__default.createElement(SvgInfoOutlined, { className: "info__icon", size: iconSizes[size] }))));
40
40
  };
41
41
 
42
42
  export { Info as default };
@@ -1,8 +1,8 @@
1
- import { _ as _objectWithoutProperties, a as _extends } from './ArrowLeft-b88e2ba8.js';
1
+ import { _ as _objectWithoutProperties, a as _extends } from './ActivityRecent-b88e2ba8.js';
2
2
  import React__default from 'react';
3
3
 
4
4
  var _excluded = ["size", "color"];
5
- var SvgInfoOutline = function SvgInfoOutline(_ref) {
5
+ var SvgInfoOutlined = function SvgInfoOutlined(_ref) {
6
6
  var _ref$size = _ref.size,
7
7
  size = _ref$size === void 0 ? 24 : _ref$size,
8
8
  _ref$color = _ref.color,
@@ -26,4 +26,4 @@ var SvgInfoOutline = function SvgInfoOutline(_ref) {
26
26
  }));
27
27
  };
28
28
 
29
- export { SvgInfoOutline as S };
29
+ export { SvgInfoOutlined as S };
package/KeyValue.js CHANGED
@@ -2,12 +2,12 @@ import React__default, { createContext, useMemo, useContext, cloneElement } from
2
2
  import { c as classNames } from './index-ce02421b.js';
3
3
  import { s as styleInject } from './style-inject.es-746bb8ed.js';
4
4
  import Info from './Info.js';
5
- import './InfoOutline-dd2e89d9.js';
6
- import './ArrowLeft-b88e2ba8.js';
5
+ import './InfoOutlined-fc7d9afa.js';
6
+ import './ActivityRecent-b88e2ba8.js';
7
7
  import './Tooltip.js';
8
8
  import './floating-ui.react-0485e4db.js';
9
9
  import 'react-dom';
10
- import './index-d055a077.js';
10
+ import './index-ae180991.js';
11
11
  import './useDebounceCallback-999deae7.js';
12
12
 
13
13
  var css_248z = ".keyValue{display:inline-flex;max-width:100%}.keyValue_direction_vertical{flex-direction:column}.keyValue_direction_horizontal.keyValue_spaceBetween{width:100%}.keyValue__content{align-items:center;color:var(--guit-sem-color-foreground-neutral-2);display:flex;flex:1}.keyValue__value{color:var(--guit-sem-color-foreground-neutral-1);word-break:break-word}.keyValue_size_large{gap:var(--guit-ref-spacing-medium)}.keyValue_size_large .keyValue__content{gap:var(--guit-ref-spacing-xsmall)}.keyValue_size_large .keyValue__title,.keyValue_size_large .keyValue__value{font-family:var(--guit-sem-font-label-large-default-medium-font-family),sans-serif;font-size:var(--guit-sem-font-label-large-default-semibold-font-size);font-weight:var(--guit-sem-font-label-large-default-medium-font-weight);line-height:var(--guit-sem-font-label-large-default-semibold-line-height)}.keyValue_size_medium{gap:var(--guit-ref-spacing-medium)}.keyValue_size_medium .keyValue__content{gap:var(--guit-ref-spacing-xsmall)}.keyValue_size_medium .keyValue__title,.keyValue_size_medium .keyValue__value{font-family:var(--guit-sem-font-label-medium-default-semibold-font-family),sans-serif;font-size:var(--guit-sem-font-label-medium-default-semibold-font-size);font-weight:var(--guit-sem-font-label-medium-default-medium-font-weight);line-height:var(--guit-sem-font-label-medium-default-semibold-line-height)}";
package/Label.js CHANGED
@@ -1,15 +1,15 @@
1
1
  import React__default, { useRef } from 'react';
2
2
  import { c as classNames } from './index-ce02421b.js';
3
3
  import Tooltip from './Tooltip.js';
4
- import { u as useEllipsisDetection } from './useEllipsisDetection-500dc188.js';
4
+ import { u as useEllipsisDetection } from './useEllipsisDetection-dfe1a9d3.js';
5
5
  import { s as styleInject } from './style-inject.es-746bb8ed.js';
6
6
  import Info from './Info.js';
7
7
  import './floating-ui.react-0485e4db.js';
8
8
  import 'react-dom';
9
- import './index-d055a077.js';
9
+ import './index-ae180991.js';
10
10
  import './useDebounceCallback-999deae7.js';
11
- import './InfoOutline-dd2e89d9.js';
12
- import './ArrowLeft-b88e2ba8.js';
11
+ import './InfoOutlined-fc7d9afa.js';
12
+ import './ActivityRecent-b88e2ba8.js';
13
13
 
14
14
  var css_248z = ".label{display:inline-flex;max-width:100%}.label,.label__container{align-items:center;min-width:0}.label__container{display:flex;gap:var(--guit-ref-spacing-3xsmall)}.label__container_readOnly{pointer-events:auto}.label__container-inner{align-items:center;display:flex;gap:var(--guit-ref-spacing-4xsmall);max-width:100%}.label__asterisk,.label__text{color:var(--guit-sem-color-foreground-neutral-2)}.label__asterisk_size_medium,.label__text_size_medium{font-family:var(--guit-sem-font-label-medium-default-semibold-font-family);font-size:var(--guit-sem-font-label-medium-default-semibold-font-size);font-weight:var(--guit-sem-font-label-medium-default-medium-font-weight);line-height:var(--guit-sem-font-label-medium-default-semibold-line-height)}.label__asterisk_size_small,.label__text_size_small{font-family:var(--guit-sem-font-label-small-default-medium-font-family);font-size:var(--guit-sem-font-label-small-default-medium-font-size);font-weight:var(--guit-sem-font-label-small-default-medium-font-weight);line-height:var(--guit-sem-font-label-small-default-medium-line-height)}.label__asterisk_disabled,.label__text_disabled{color:var(--guit-sem-color-foreground-disabled);pointer-events:none}";
15
15
  styleInject(css_248z);
package/Pill.js CHANGED
@@ -1,33 +1,15 @@
1
1
  import React__default, { useState, useRef, useEffect } from 'react';
2
2
  import { c as classNames } from './index-ce02421b.js';
3
- import { _ as _objectWithoutProperties, a as _extends } from './ArrowLeft-b88e2ba8.js';
3
+ import { S as SvgCircleFilled } from './CircleFilled-19a9ec62.js';
4
4
  import Tooltip from './Tooltip.js';
5
- import { u as useEllipsisDetection } from './useEllipsisDetection-500dc188.js';
5
+ import { u as useEllipsisDetection } from './useEllipsisDetection-dfe1a9d3.js';
6
6
  import { s as styleInject } from './style-inject.es-746bb8ed.js';
7
+ import './ActivityRecent-b88e2ba8.js';
7
8
  import './floating-ui.react-0485e4db.js';
8
9
  import 'react-dom';
9
- import './index-d055a077.js';
10
+ import './index-ae180991.js';
10
11
  import './useDebounceCallback-999deae7.js';
11
12
 
12
- var _excluded = ["size", "color"];
13
- var SvgDot = function SvgDot(_ref) {
14
- var _ref$size = _ref.size,
15
- size = _ref$size === void 0 ? 24 : _ref$size,
16
- _ref$color = _ref.color,
17
- color = _ref$color === void 0 ? "currentColor" : _ref$color,
18
- props = _objectWithoutProperties(_ref, _excluded);
19
- return /*#__PURE__*/React__default.createElement("svg", _extends({
20
- width: size,
21
- height: size,
22
- viewBox: "0 0 24 24",
23
- fill: color,
24
- xmlns: "http://www.w3.org/2000/svg"
25
- }, props), /*#__PURE__*/React__default.createElement("path", {
26
- d: "M12 17a5 5 0 1 0 0-10 5 5 0 0 0 0 10Z",
27
- fill: color
28
- }));
29
- };
30
-
31
13
  var css_248z = ".pill{align-items:center;display:inline-flex;max-width:100%;vertical-align:top}.pill_icon_after{flex-direction:row-reverse}.pill_size_medium:not(.pill_icon_only){gap:var(--guit-ref-spacing-xsmall);padding-bottom:var(--guit-ref-spacing-2xsmall);padding-top:var(--guit-ref-spacing-2xsmall)}.pill_size_medium:not(.pill_icon_before,.pill_size_medium.pill_icon_after,.pill_size_medium.pill_icon_only){min-width:var(--guit-sem-dimension-width-large);padding-inline-end:var(--guit-ref-spacing-medium);padding-inline-start:var(--guit-ref-spacing-medium)}.pill_size_medium.pill_icon_after,.pill_size_medium.pill_icon_before{min-width:var(--guit-sem-dimension-width-3xlarge)}.pill_size_medium.pill_icon_before{padding-inline-end:var(--guit-ref-spacing-medium);padding-inline-start:var(--guit-ref-spacing-xsmall)}.pill_size_medium.pill_icon_after{padding-inline-end:var(--guit-ref-spacing-xsmall);padding-inline-start:var(--guit-ref-spacing-medium)}.pill_size_medium.pill_icon_only{min-width:var(--guit-sem-dimension-width-medium);padding:var(--guit-ref-spacing-2xsmall)}.pill_size_small:not(.pill_icon_only){gap:var(--guit-ref-spacing-2xsmall);padding-bottom:var(--guit-ref-spacing-4xsmall);padding-top:var(--guit-ref-spacing-4xsmall)}.pill_size_small:not(.pill_icon_before,.pill_size_small.pill_icon_after,.pill_size_small.pill_icon_only){min-width:var(--guit-sem-dimension-width-large);padding-inline-end:var(--guit-ref-spacing-medium);padding-inline-start:var(--guit-ref-spacing-medium)}.pill_size_small.pill_icon_after,.pill_size_small.pill_icon_before{min-width:var(--guit-sem-dimension-width-3xlarge)}.pill_size_small.pill_icon_before{padding-inline-end:var(--guit-ref-spacing-medium);padding-inline-start:var(--guit-ref-spacing-xsmall)}.pill_size_small.pill_icon_after{padding-inline-end:var(--guit-ref-spacing-xsmall);padding-inline-start:var(--guit-ref-spacing-medium)}.pill_size_small.pill_icon_only{min-width:var(--guit-sem-dimension-width-small);padding:var(--guit-ref-spacing-4xsmall)}.pill_size_medium:not(.pill_icon_only),.pill_size_small:not(.pill_icon_only){font-family:var(--guit-sem-font-label-medium-default-semibold-font-family);font-size:var(--guit-sem-font-label-medium-default-semibold-font-size);font-weight:var(--guit-sem-font-label-medium-default-medium-font-weight);line-height:var(--guit-sem-font-label-medium-default-semibold-line-height)}.pill_size_smallNudge{gap:var(--guit-ref-spacing-3xsmall);padding-bottom:var(--guit-ref-spacing-4xsmall);padding-top:var(--guit-ref-spacing-4xsmall)}.pill_size_smallNudge:not(.pill_icon_only){font-family:var(--guit-sem-font-label-small-default-medium-font-family);font-size:var(--guit-sem-font-label-small-default-medium-font-size);font-weight:var(--guit-sem-font-label-small-default-medium-font-weight);line-height:var(--guit-sem-font-label-small-default-medium-line-height)}.pill_size_smallNudge:not(.pill_icon_before,.pill_size_smallNudge.pill_icon_after,.pill_size_smallNudge.pill_icon_only){min-width:var(--guit-sem-dimension-width-medium);padding-inline-end:var(--guit-ref-spacing-xsmall);padding-inline-start:var(--guit-ref-spacing-xsmall)}.pill_size_smallNudge.pill_icon_after,.pill_size_smallNudge.pill_icon_before{min-width:var(--guit-sem-dimension-width-large)}.pill_size_smallNudge.pill_icon_before{padding-inline-end:var(--guit-ref-spacing-xsmall);padding-inline-start:var(--guit-ref-spacing-3xsmall)}.pill_size_smallNudge.pill_icon_after{padding-inline-end:var(--guit-ref-spacing-3xsmall);padding-inline-start:var(--guit-ref-spacing-xsmall)}.pill_size_smallNudge.pill_icon_only{min-width:var(--guit-sem-dimension-width-small-nudge);padding:var(--guit-ref-spacing-4xsmall)}.pill_fill.pill_size_medium,.pill_fill.pill_size_small{border-radius:var(--guit-ref-radius-3xsmall)}.pill_fill.pill_size_smallNudge{border-radius:var(--guit-ref-radius-4xsmall)}.pill_fill.pill_color_informative{background-color:var(--guit-sem-color-background-informative)}.pill_fill.pill_color_neutral{background-color:var(--guit-sem-color-background-neutral-3)}.pill_fill.pill_color_error{background-color:var(--guit-sem-color-background-error-1)}.pill_fill.pill_color_success{background-color:var(--guit-sem-color-background-success-1)}.pill_fill.pill_color_warning{background-color:var(--guit-sem-color-background-warning-1)}.pill_fill.pill_color_purple{background-color:var(--guit-sem-color-background-accent-purple-1)}.pill_fill.pill_color_lagoon{background-color:var(--guit-sem-color-background-accent-lagoon-1)}.pill_fill.pill_color_magenta{background-color:var(--guit-sem-color-background-accent-magenta-1)}.pill_fill.pill_color_slate{background-color:var(--guit-sem-color-background-accent-slate-1)}.pill_fill.pill_color_inverse{background-color:var(--guit-sem-color-background-inverse);color:var(--guit-sem-color-foreground-neutral-2)}.pill_color_informative{color:var(--guit-sem-color-foreground-informative)}.pill_color_neutral{color:var(--guit-sem-color-foreground-neutral-2)}.pill_color_error{color:var(--guit-sem-color-foreground-error)}.pill_color_success{color:var(--guit-sem-color-foreground-success)}.pill_color_warning{color:var(--guit-sem-color-foreground-warning)}.pill_color_purple{color:var(--guit-sem-color-foreground-accent-purple)}.pill_color_lagoon{color:var(--guit-sem-color-foreground-accent-lagoon)}.pill_color_magenta{color:var(--guit-sem-color-foreground-accent-magenta)}.pill_color_slate{color:var(--guit-sem-color-foreground-accent-slate)}.pill:not(.pill_fill).pill_color_inverse{color:var(--guit-sem-color-foreground-inverse)}.pill__text{color:inherit;font-family:inherit;font-size:inherit;font-weight:inherit;line-height:inherit}.pill__icon{flex:0 0 auto}";
32
14
  styleInject(css_248z);
33
15
 
@@ -51,7 +33,7 @@ const Pill = ({ color = "informative", size = "medium", text, iconAlignment = "b
51
33
  iconContent = React__default.createElement(Icon, { size: iconSizes[size], className: "pill__icon" });
52
34
  }
53
35
  else if (isWithDot) {
54
- iconContent = React__default.createElement(SvgDot, { size: iconSizes[size], className: "pill__icon" });
36
+ iconContent = React__default.createElement(SvgCircleFilled, { size: iconSizes[size], className: "pill__icon" });
55
37
  }
56
38
  return (React__default.createElement("div", { className: classNames(`pill pill_size_${size} pill_color_${color}`, className, {
57
39
  [`pill_icon_${isWithDot ? "before" : iconAlignment}`]: text && iconContent,
package/Popover.js CHANGED
@@ -1,12 +1,12 @@
1
- export { P as Popover, a as PopoverBody, b as PopoverFooter, c as PopoverFooterActions } from './index-d5f349ff.js';
1
+ export { P as Popover, a as PopoverBody, b as PopoverFooter, c as PopoverFooterActions } from './index-5a59c1ea.js';
2
2
  import 'react';
3
3
  import './floating-ui.react-0485e4db.js';
4
4
  import 'react-dom';
5
- import './Close-e8302008.js';
6
- import './ArrowLeft-b88e2ba8.js';
7
- import './InfoOutline-dd2e89d9.js';
5
+ import './InfoOutlined-fc7d9afa.js';
6
+ import './ActivityRecent-b88e2ba8.js';
7
+ import './X-9c317d18.js';
8
8
  import './style-inject.es-746bb8ed.js';
9
- import './index-d055a077.js';
9
+ import './index-ae180991.js';
10
10
  import './useDebounceCallback-999deae7.js';
11
11
  import './Button.js';
12
12
  import './index-ce02421b.js';
package/ProgressBar.js CHANGED
@@ -3,17 +3,17 @@ import { c as classNames } from './index-ce02421b.js';
3
3
  import HelperText from './HelperText.js';
4
4
  import Label from './Label.js';
5
5
  import { s as styleInject } from './style-inject.es-746bb8ed.js';
6
- import './ErrorAlertFill-a0afebbf.js';
7
- import './ArrowLeft-b88e2ba8.js';
8
- import './WarningFill-143d0870.js';
6
+ import './Error-e14cf0e1.js';
7
+ import './ActivityRecent-b88e2ba8.js';
8
+ import './TriangleAlert-14d7e83c.js';
9
9
  import './Tooltip.js';
10
10
  import './floating-ui.react-0485e4db.js';
11
11
  import 'react-dom';
12
- import './index-d055a077.js';
12
+ import './index-ae180991.js';
13
13
  import './useDebounceCallback-999deae7.js';
14
- import './useEllipsisDetection-500dc188.js';
14
+ import './useEllipsisDetection-dfe1a9d3.js';
15
15
  import './Info.js';
16
- import './InfoOutline-dd2e89d9.js';
16
+ import './InfoOutlined-fc7d9afa.js';
17
17
 
18
18
  var css_248z = ".progressBar{display:flex;flex-direction:column;gap:var(--guit-ref-spacing-3xsmall);min-width:24rem;width:100%}.progressBar_type_determinate .progressBar__loadingBar,.progressBar_type_indeterminate .progressBar__fill{display:none}.progressBar_type_indeterminate .progressBar__loadingBar{animation-duration:1.6s;animation-iteration-count:infinite;animation-timing-function:var(--guit-ref-motion-easing-standard);will-change:transform}[dir=ltr] .progressBar_type_indeterminate .progressBar__loadingBar{animation-name:progress-bar-loading-from-left}[dir=rtl] .progressBar_type_indeterminate .progressBar__loadingBar{animation-name:progress-bar-loading-from-right}.progressBar_size_large .progressBar__status,.progressBar_size_medium .progressBar__status{font-family:var(--guit-sem-font-label-medium-default-semibold-font-family);font-size:var(--guit-sem-font-label-medium-default-semibold-font-size);font-weight:var(--guit-sem-font-label-medium-default-medium-font-weight);line-height:var(--guit-sem-font-label-medium-default-semibold-line-height)}.progressBar_size_large .progressBar__track{border-radius:var(--guit-ref-radius-xsmall);height:var(--guit-sem-dimension-height-xsmall)}.progressBar_size_medium .progressBar__track{border-radius:var(--guit-ref-radius-2xsmall);height:var(--guit-sem-dimension-height-2xsmall)}.progressBar_size_small .progressBar__track{border-radius:var(--guit-ref-radius-3xsmall);height:var(--guit-sem-dimension-height-3xsmall)}.progressBar_size_small .progressBar__status{font-family:var(--guit-sem-font-label-small-default-medium-font-family);font-size:var(--guit-sem-font-label-small-default-medium-font-size);font-weight:var(--guit-sem-font-label-small-default-medium-font-weight);line-height:var(--guit-sem-font-label-small-default-medium-line-height)}.progressBar_color_default .progressBar__fill,.progressBar_color_default .progressBar__loadingBar{background-color:var(--guit-sem-color-background-brand-2)}.progressBar_color_success .progressBar__fill,.progressBar_color_success .progressBar__loadingBar{background-color:var(--guit-sem-color-background-success-2)}.progressBar_color_error .progressBar__fill,.progressBar_color_error .progressBar__loadingBar{background-color:var(--guit-sem-color-background-error-2)}.progressBar__track{background-color:var(--guit-sem-color-background-neutral-2);overflow:hidden;width:100%}.progressBar__fill,.progressBar__loadingBar{border-radius:inherit;height:100%}.progressBar__loadingBar{width:50%}.progressBar__info{align-items:flex-start;display:flex;gap:var(--guit-ref-spacing-xsmall);justify-content:space-between;width:100%}.progressBar__helperText{word-break:break-word}.progressBar__status{color:var(--guit-sem-color-foreground-neutral-2);display:inline-flex;flex:0 0 auto;gap:.4rem;margin-inline-start:auto}.progressBar__uploadingText{display:inline-block}@keyframes progress-bar-loading-from-left{0%{transform:translate3d(-100%,0,0)}to{transform:translate3d(200%,0,0)}}@keyframes progress-bar-loading-from-right{0%{transform:translate3d(100%,0,0)}to{transform:translate3d(-200%,0,0)}}";
19
19
  styleInject(css_248z);
package/QRCode.js CHANGED
@@ -1,6 +1,6 @@
1
1
  import React__default, { useRef, useContext, useMemo, cloneElement } from 'react';
2
2
  import { c as classNames } from './index-ce02421b.js';
3
- import { a as GeneUIDesignSystemContext } from './index-d055a077.js';
3
+ import { a as GeneUIDesignSystemContext } from './index-ae180991.js';
4
4
  import { s as styleInject } from './style-inject.es-746bb8ed.js';
5
5
  import './useDebounceCallback-999deae7.js';
6
6
 
package/Radio.js ADDED
@@ -0,0 +1,57 @@
1
+ import React__default, { useState, useEffect } from 'react';
2
+ import { c as classNames } from './index-ce02421b.js';
3
+ import { S as SvgCircleFilled } from './CircleFilled-19a9ec62.js';
4
+ import HelperText from './HelperText.js';
5
+ import Label from './Label.js';
6
+ import { s as styleInject } from './style-inject.es-746bb8ed.js';
7
+ import './ActivityRecent-b88e2ba8.js';
8
+ import './Error-e14cf0e1.js';
9
+ import './TriangleAlert-14d7e83c.js';
10
+ import './Tooltip.js';
11
+ import './floating-ui.react-0485e4db.js';
12
+ import 'react-dom';
13
+ import './index-ae180991.js';
14
+ import './useDebounceCallback-999deae7.js';
15
+ import './useEllipsisDetection-dfe1a9d3.js';
16
+ import './Info.js';
17
+ import './InfoOutlined-fc7d9afa.js';
18
+
19
+ var css_248z = ".radio{display:inline-flex;flex-direction:column;max-width:100%;min-width:0}.radio__input{appearance:none;background:none;border:none;border-radius:inherit;height:100%;left:0;position:absolute;top:0;width:100%;z-index:-1}.radio__input:checked+.radio__imitation{border-color:var(--guit-sem-color-background-selected-2);color:var(--guit-sem-color-background-selected-2)}.radio__input:checked+.radio__imitation:hover{border-color:var(--guit-sem-color-background-selected-2-hover);color:var(--guit-sem-color-background-selected-2-hover)}.radio__input:checked+.radio__imitation:active{border-color:var(--guit-sem-color-background-selected-2-pressed);color:var(--guit-sem-color-background-selected-2-pressed)}.radio__input:checked+.radio__imitation .radio__icon{color:inherit;opacity:1}.radio__label{display:flex}.radio__imitationHolder{align-items:center;border-radius:50%;display:flex;flex:0 0 auto;justify-content:center}.radio__imitationHolder:only-child{height:var(--guit-sem-dimension-height-small);width:var(--guit-sem-dimension-width-small)}.radio__imitationHolder .radio__input:not(:checked)+.radio__imitation:hover{background-color:var(--guit-sem-color-background-transparent-1-hover)}.radio__imitationHolder .radio__input:not(:checked)+.radio__imitation:active{background-color:var(--guit-sem-color-background-transparent-1-pressed)}.radio__imitationHolderInner{border-radius:inherit;flex:0 0 auto;height:var(--guit-sem-dimension-height-xsmall);position:relative;width:var(--guit-sem-dimension-width-xsmall)}.radio__imitation,.radio__imitationHolderInner{align-items:center;display:flex;justify-content:center}.radio__imitation{border:var(--guit-ref-border-width-thin) solid var(--guit-sem-color-border-neutral-3);border-radius:inherit;height:100%;overflow:hidden;width:100%}.radio__icon{color:var(--guit-sem-color-foreground-inverse);flex:0 0 auto;opacity:0}.radio__infoContainer{display:flex}.radio:not(.radio_labelTop){gap:var(--guit-ref-spacing-3xsmall)}.radio:not(.radio_labelTop) .radio__infoContainer{padding-inline-start:var(--guit-ref-spacing-3xlarge)}.radio:not(.radio_labelTop) .radio__label{gap:var(--guit-ref-spacing-medium)}.radio_labelTop,.radio_labelTop .radio__label{gap:var(--guit-ref-spacing-3xsmall)}.radio_labelTop .radio__label{align-items:flex-start;flex-direction:column-reverse}.radio_error .radio__imitationHolder .radio__imitationHolderInner .radio__imitation{border-color:var(--guit-sem-color-border-error)}.radio_disabled{pointer-events:none;-webkit-user-select:none;user-select:none}.radio_disabled .radio__imitationHolder .radio__imitationHolderInner .radio__imitation{border-color:var(--guit-sem-color-border-disabled-1)}.radio_disabled .radio__imitationHolder .radio__imitationHolderInner .radio__imitation .radio__icon{color:var(--guit-sem-color-background-disabled)}.radio_disabled .radio__input:not(:checked)+.radio__imitation{border-color:var(--guit-sem-color-border-disabled-1)}.radio_readOnly{pointer-events:none}.radio_readOnly .radio__imitationHolder .radio__imitationHolderInner .radio__imitation{background-color:var(--guit-sem-color-background-neutral-3);border-color:#0000}.radio_readOnly .radio__imitationHolder .radio__imitationHolderInner .radio__imitation .radio__icon{color:var(--guit-sem-color-foreground-neutral-1)}.radio_readOnly .radio__input:not(:checked)+.radio__imitation{border-color:var(--guit-sem-color-border-neutral-2)}";
20
+ styleInject(css_248z);
21
+
22
+ /*
23
+ The radio component allows users to select one or more options from a set of choices. Each radio can be either checked or unchecked, indicating a binary state. Radios are commonly used in forms, settings, and lists where a user needs to select a single option from multiple options.
24
+ */
25
+ const Radio = (props) => {
26
+ const { label, required, infoText, disabled, helperText, readOnly, type = "rest", direction = "horizontal ", autoFocus, onChange, onFocus, onBlur, name, checked, defaultChecked, className, value } = props;
27
+ const isControlled = "checked" in props;
28
+ const [checkedState, setCheckedState] = useState(defaultChecked || false);
29
+ const onChangeHandler = (e) => {
30
+ if (!isControlled) {
31
+ setCheckedState(e.target.checked);
32
+ }
33
+ onChange === null || onChange === void 0 ? void 0 : onChange(e);
34
+ };
35
+ const onFocusHandler = (e) => onFocus === null || onFocus === void 0 ? void 0 : onFocus(e);
36
+ const onBlurHandler = (e) => onBlur === null || onBlur === void 0 ? void 0 : onBlur(e);
37
+ useEffect(() => {
38
+ if (isControlled) {
39
+ setCheckedState(!!checked);
40
+ }
41
+ }, [checked, isControlled]);
42
+ return (React__default.createElement("div", Object.assign({ className: classNames("radio ", `radio_${type}`, {
43
+ radio_disabled: disabled,
44
+ radio_readOnly: readOnly,
45
+ radio_labelTop: direction === "vertical"
46
+ }, className) }, ((disabled || readOnly) && { tabIndex: -1 })),
47
+ React__default.createElement(Label, { labelText: label, className: "radio__label", required: required, infoText: infoText, disabled: disabled, readOnly: readOnly },
48
+ React__default.createElement("span", { className: "radio__imitationHolder" },
49
+ React__default.createElement("span", { className: "radio__imitationHolderInner" },
50
+ React__default.createElement("input", Object.assign({ type: "radio", className: "radio__input", onChange: onChangeHandler, onFocus: onFocusHandler, onBlur: onBlurHandler, checked: checkedState, value: value, name: name }, (autoFocus && { autoFocus }), ((disabled || readOnly) && { tabIndex: -1 }))),
51
+ React__default.createElement("span", { className: "radio__imitation" },
52
+ React__default.createElement(SvgCircleFilled, { className: "radio__icon" }))))),
53
+ helperText && (React__default.createElement("div", { className: "radio__infoContainer" },
54
+ React__default.createElement(HelperText, { text: helperText, isDisabled: disabled, type: type })))));
55
+ };
56
+
57
+ export { Radio as default };
package/Steps.js CHANGED
@@ -1,8 +1,8 @@
1
1
  import React__default, { createContext, useMemo, Children, isValidElement, useContext } from 'react';
2
2
  import { c as classNames } from './index-ce02421b.js';
3
3
  import { s as styleInject } from './style-inject.es-746bb8ed.js';
4
- import { S as SvgErrorAlertFill } from './ErrorAlertFill-a0afebbf.js';
5
- import { _ as _objectWithoutProperties, a as _extends } from './ArrowLeft-b88e2ba8.js';
4
+ import { S as SvgError } from './Error-e14cf0e1.js';
5
+ import { _ as _objectWithoutProperties, a as _extends } from './ActivityRecent-b88e2ba8.js';
6
6
  import Divider from './Divider.js';
7
7
  import Loader from './Loader.js';
8
8
 
@@ -86,7 +86,7 @@ const PointTypes = ({ stepNumber = 1, error, isLoading, state }) => {
86
86
  return React__default.createElement(Loader, { size: "small" });
87
87
  }
88
88
  if (error) {
89
- return React__default.createElement(SvgErrorAlertFill, { size: 24, className: "steps__status_icon" });
89
+ return React__default.createElement(SvgError, { size: 24, className: "steps__status_icon" });
90
90
  }
91
91
  if (type === "dot") {
92
92
  if (state === "current") {
package/Tag.js CHANGED
@@ -1,19 +1,37 @@
1
1
  import React__default, { useRef } from 'react';
2
2
  import { c as classNames } from './index-ce02421b.js';
3
- import { S as SvgClose } from './Close-e8302008.js';
4
- import { S as SvgErrorAlertFill } from './ErrorAlertFill-a0afebbf.js';
5
- import { _ as _objectWithoutProperties, a as _extends } from './ArrowLeft-b88e2ba8.js';
6
- import { S as SvgWarningFill } from './WarningFill-143d0870.js';
3
+ import { _ as _objectWithoutProperties, a as _extends } from './ActivityRecent-b88e2ba8.js';
4
+ import { S as SvgTriangleAlert } from './TriangleAlert-14d7e83c.js';
5
+ import { S as SvgX } from './X-9c317d18.js';
7
6
  import Button from './Button.js';
8
- import { u as useEllipsisDetection } from './useEllipsisDetection-500dc188.js';
7
+ import { u as useEllipsisDetection } from './useEllipsisDetection-dfe1a9d3.js';
9
8
  import { s as styleInject } from './style-inject.es-746bb8ed.js';
10
9
  import Tooltip from './Tooltip.js';
11
10
  import './Loader.js';
12
- import './index-d055a077.js';
11
+ import './index-ae180991.js';
13
12
  import './useDebounceCallback-999deae7.js';
14
13
  import './floating-ui.react-0485e4db.js';
15
14
  import 'react-dom';
16
15
 
16
+ var _excluded$1 = ["size", "color"];
17
+ var SvgCircleAlert = function SvgCircleAlert(_ref) {
18
+ var _ref$size = _ref.size,
19
+ size = _ref$size === void 0 ? 24 : _ref$size,
20
+ _ref$color = _ref.color,
21
+ color = _ref$color === void 0 ? "currentColor" : _ref$color,
22
+ props = _objectWithoutProperties(_ref, _excluded$1);
23
+ return /*#__PURE__*/React__default.createElement("svg", _extends({
24
+ width: size,
25
+ height: size,
26
+ viewBox: "0 0 20 20",
27
+ fill: color,
28
+ xmlns: "http://www.w3.org/2000/svg"
29
+ }, props), /*#__PURE__*/React__default.createElement("path", {
30
+ d: "M10 0a10 10 0 1 0 0 20 10 10 0 0 0 0-20Zm-.75 5.758a.75.75 0 0 1 1.5 0v5.243a.75.75 0 0 1-1.5 0v-5.243Zm.75 9.235a.915.915 0 1 1 0-1.83.915.915 0 0 1 0 1.83Z",
31
+ fill: color
32
+ }));
33
+ };
34
+
17
35
  var _excluded = ["size", "color"];
18
36
  var SvgTagOutline = function SvgTagOutline(_ref) {
19
37
  var _ref$size = _ref.size,
@@ -41,8 +59,8 @@ styleInject(css_248z);
41
59
 
42
60
  const icons = {
43
61
  rest: SvgTagOutline,
44
- warning: SvgWarningFill,
45
- error: SvgErrorAlertFill
62
+ warning: SvgCircleAlert,
63
+ error: SvgTriangleAlert
46
64
  };
47
65
  /**
48
66
  * Tag is used to label, categorize, and organize content within an interface. It can be used to highlight keywords, topics, or attributes related to an item. Tags enhance user navigation and search functionality by providing a quick way to filter and identify relevant information.
@@ -59,7 +77,7 @@ const Tag = ({ className, text, type = "rest", disabled, size = "medium", withIc
59
77
  withIcon && React__default.createElement(Icon, { className: "tag__icon", size: 20 }),
60
78
  React__default.createElement(Tooltip, { text: text, isVisible: isTruncated },
61
79
  React__default.createElement("span", { ref: textRef, className: "tag__text ellipsis-text" }, text)),
62
- React__default.createElement(Button, { className: "tag__button", appearance: "secondary", displayType: "text", Icon: SvgClose, size: size, onClick: onClose, disabled: disabled })));
80
+ React__default.createElement(Button, { className: "tag__button", appearance: "secondary", displayType: "text", Icon: SvgX, size: size, onClick: onClose, disabled: disabled })));
63
81
  };
64
82
 
65
83
  export { Tag as default };
package/Text.js CHANGED
@@ -1,11 +1,11 @@
1
1
  import React__default, { useRef } from 'react';
2
2
  import { c as classNames } from './index-ce02421b.js';
3
3
  import Tooltip from './Tooltip.js';
4
- import { u as useEllipsisDetection } from './useEllipsisDetection-500dc188.js';
4
+ import { u as useEllipsisDetection } from './useEllipsisDetection-dfe1a9d3.js';
5
5
  import { s as styleInject } from './style-inject.es-746bb8ed.js';
6
6
  import './floating-ui.react-0485e4db.js';
7
7
  import 'react-dom';
8
- import './index-d055a077.js';
8
+ import './index-ae180991.js';
9
9
  import './useDebounceCallback-999deae7.js';
10
10
 
11
11
  var css_248z = ".text_variant_headingXLargeSemibold{font-family:var(--guit-sem-font-heading-xlarge-semibold-font-family);font-size:var(--guit-sem-font-heading-xlarge-semibold-font-size);font-weight:var(--guit-sem-font-heading-xlarge-semibold-font-weight);line-height:var(--guit-sem-font-heading-xlarge-semibold-line-height)}.text_variant_headingLargeSemibold{font-family:var(--guit-sem-font-heading-large-semibold-font-family);font-size:var(--guit-sem-font-heading-large-semibold-font-size);font-weight:var(--guit-sem-font-heading-large-semibold-font-weight);line-height:var(--guit-sem-font-heading-large-semibold-line-height)}.text_variant_headingMediumSemibold{font-family:var(--guit-sem-font-heading-medium-semibold-font-family);font-size:var(--guit-sem-font-heading-medium-semibold-font-size);font-weight:var(--guit-sem-font-heading-medium-semibold-font-weight);line-height:var(--guit-sem-font-heading-medium-semibold-line-height)}.text_variant_headingSmallSemibold{font-family:var(--guit-sem-font-heading-small-semibold-font-family);font-size:var(--guit-sem-font-heading-small-semibold-font-size);font-weight:var(--guit-sem-font-heading-small-semibold-font-weight);line-height:var(--guit-sem-font-heading-small-semibold-line-height)}.text_variant_headingXSmallSemibold{font-family:var(--guit-sem-font-heading-xsmall-semibold-font-family);font-size:var(--guit-sem-font-heading-xsmall-semibold-font-size);font-weight:var(--guit-sem-font-heading-xsmall-semibold-font-weight);line-height:var(--guit-sem-font-heading-xsmall-semibold-line-height)}.text_variant_subheadingLargeSemibold{font-family:var(--guit-sem-font-subheading-large-semibold-font-family);font-size:var(--guit-sem-font-subheading-large-semibold-font-size);font-weight:var(--guit-sem-font-subheading-large-semibold-font-weight);line-height:var(--guit-sem-font-subheading-large-semibold-line-height)}.text_variant_subheadingMediumSemibold{font-family:var(--guit-sem-font-subheading-medium-semibold-font-family);font-size:var(--guit-sem-font-subheading-medium-semibold-font-size);font-weight:var(--guit-sem-font-subheading-medium-semibold-font-weight);line-height:var(--guit-sem-font-subheading-medium-semibold-line-height)}.text_variant_labelLargeSemibold{font-family:var(--guit-sem-font-label-large-default-semibold-font-family);font-size:var(--guit-sem-font-label-large-default-semibold-font-size);font-weight:var(--guit-sem-font-label-large-default-semibold-font-weight);line-height:var(--guit-sem-font-label-large-default-semibold-line-height)}.text_variant_labelLargeMedium{font-family:var(--guit-sem-font-label-large-default-medium-font-family);font-size:var(--guit-sem-font-label-large-default-medium-font-size);font-weight:var(--guit-sem-font-label-large-default-medium-font-weight);line-height:var(--guit-sem-font-label-large-default-medium-line-height)}.text_variant_labelMediumSemibold{font-family:var(--guit-sem-font-label-medium-default-semibold-font-family);font-size:var(--guit-sem-font-label-medium-default-semibold-font-size);font-weight:var(--guit-sem-font-label-medium-default-semibold-font-weight);line-height:var(--guit-sem-font-label-medium-default-semibold-line-height)}.text_variant_labelMediumMedium{font-family:var(--guit-sem-font-label-medium-default-medium-font-family);font-size:var(--guit-sem-font-label-medium-default-medium-font-size);font-weight:var(--guit-sem-font-label-medium-default-medium-font-weight);line-height:var(--guit-sem-font-label-medium-default-medium-line-height)}.text_variant_labelSmallSemibold{font-family:var(--guit-sem-font-label-small-default-semibold-font-family);font-size:var(--guit-sem-font-label-small-default-semibold-font-size);font-weight:var(--guit-sem-font-label-small-default-semibold-font-weight);line-height:var(--guit-sem-font-label-small-default-semibold-line-height)}.text_variant_labelSmallMedium{font-family:var(--guit-sem-font-label-small-default-medium-font-family);font-size:var(--guit-sem-font-label-small-default-medium-font-size);font-weight:var(--guit-sem-font-label-small-default-medium-font-weight);line-height:var(--guit-sem-font-label-small-default-medium-line-height)}.text_variant_bodyLargeMedium_hasSpace,.text_variant_bodyLargeRegular_hasSpace,.text_variant_bodyLargeSemibold_hasSpace{margin-block-end:2.4rem}.text_variant_bodyMediumMedium_hasSpace,.text_variant_bodyMediumRegular_hasSpace,.text_variant_bodyMediumSemibold_hasSpace{margin-block-end:2rem}.text_variant_bodyLargeSemibold{font-family:var(--guit-sem-font-body-large-default-semibold-font-family);font-size:var(--guit-sem-font-body-large-default-semibold-font-size);font-weight:var(--guit-sem-font-body-large-default-semibold-font-weight);line-height:var(--guit-sem-font-body-large-default-semibold-line-height)}.text_variant_bodyLargeMedium{font-family:var(--guit-sem-font-body-large-default-medium-font-family);font-size:var(--guit-sem-font-body-large-default-medium-font-size);font-weight:var(--guit-sem-font-body-large-default-medium-font-weight);line-height:var(--guit-sem-font-body-large-default-medium-line-height)}.text_variant_bodyLargeRegular{font-family:var(--guit-sem-font-body-large-default-regular-font-family);font-size:var(--guit-sem-font-body-large-default-regular-font-size);font-weight:var(--guit-sem-font-body-large-default-regular-font-weight);line-height:var(--guit-sem-font-body-large-default-regular-line-height)}.text_variant_bodyMediumSemibold{font-family:var(--guit-sem-font-body-medium-default-semibold-font-family);font-size:var(--guit-sem-font-body-medium-default-semibold-font-size);font-weight:var(--guit-sem-font-body-medium-default-semibold-font-weight);line-height:var(--guit-sem-font-body-medium-default-semibold-line-height)}.text_variant_bodyMediumMedium{font-family:var(--guit-sem-font-body-medium-default-medium-font-family);font-size:var(--guit-sem-font-body-medium-default-medium-font-size);font-weight:var(--guit-sem-font-body-medium-default-medium-font-weight);line-height:var(--guit-sem-font-body-medium-default-medium-line-height)}.text_variant_bodyMediumRegular{font-family:var(--guit-sem-font-body-medium-default-regular-font-family);font-size:var(--guit-sem-font-body-medium-default-regular-font-size);font-weight:var(--guit-sem-font-body-medium-default-regular-font-weight);line-height:var(--guit-sem-font-body-medium-default-regular-line-height)}.text_variant_captionLargeMedium_hasSpace,.text_variant_captionLargeRegular_hasSpace,.text_variant_captionLargeSemibold_hasSpace{margin-block-end:1.6rem}.text_variant_captionMediumMedium_hasSpace,.text_variant_captionMediumRegular_hasSpace,.text_variant_captionMediumSemibold_hasSpace{margin-block-end:1.4rem}.text_variant_captionLargeSemibold{font-family:var(--guit-sem-font-caption-large-semibold-font-family);font-size:var(--guit-sem-font-caption-large-semibold-font-size);font-weight:var(--guit-sem-font-caption-large-semibold-font-weight);letter-spacing:var(--guit-sem-font-caption-large-semibold-letter-spacing);line-height:var(--guit-sem-font-caption-large-semibold-line-height)}.text_variant_captionLargeMedium{font-family:var(--guit-sem-font-caption-large-medium-font-family);font-size:var(--guit-sem-font-caption-large-medium-font-size);font-weight:var(--guit-sem-font-caption-large-medium-font-weight);letter-spacing:var(--guit-sem-font-caption-large-medium-letter-spacing);line-height:var(--guit-sem-font-caption-large-medium-line-height)}.text_variant_captionLargeRegular{font-family:var(--guit-sem-font-caption-large-regular-font-family);font-size:var(--guit-sem-font-caption-large-regular-font-size);font-weight:var(--guit-sem-font-caption-large-regular-font-weight);letter-spacing:var(--guit-sem-font-caption-large-regular-letter-spacing);line-height:var(--guit-sem-font-caption-large-regular-line-height)}.text_variant_captionMediumSemibold{font-family:var(--guit-sem-font-caption-medium-semibold-font-family);font-size:var(--guit-sem-font-caption-medium-semibold-font-size);font-weight:var(--guit-sem-font-caption-medium-semibold-font-weight);letter-spacing:var(--guit-sem-font-caption-medium-semibold-letter-spacing);line-height:var(--guit-sem-font-caption-medium-semibold-line-height)}.text_variant_captionMediumMedium{font-family:var(--guit-sem-font-caption-medium-medium-font-family);font-size:var(--guit-sem-font-caption-medium-medium-font-size);font-weight:var(--guit-sem-font-caption-medium-medium-font-weight);letter-spacing:var(--guit-sem-font-caption-medium-medium-letter-spacing);line-height:var(--guit-sem-font-caption-medium-medium-line-height)}.text_variant_captionMediumRegular{font-family:var(--guit-sem-font-caption-medium-regular-font-family);font-size:var(--guit-sem-font-caption-medium-regular-font-size);font-weight:var(--guit-sem-font-caption-medium-regular-font-weight);letter-spacing:var(--guit-sem-font-caption-medium-regular-letter-spacing);line-height:var(--guit-sem-font-caption-medium-regular-line-height)}.text_alignment_start{text-align:start}.text_alignment_center{text-align:center}.text_alignment_end{text-align:end}.text_case_uppercase{text-transform:uppercase}.text_decoration_underline{text-decoration:underline}.text_decoration_lineThrough{text-decoration:line-through}";
package/Timeline.js ADDED
@@ -0,0 +1,69 @@
1
+ import React__default, { createContext, useContext, useMemo, useRef } from 'react';
2
+ import { c as classNames } from './index-ce02421b.js';
3
+ import { a as GeneUIDesignSystemContext } from './index-ae180991.js';
4
+ import { s as styleInject } from './style-inject.es-746bb8ed.js';
5
+ import { S as SvgCircleFilled } from './CircleFilled-19a9ec62.js';
6
+ import { _ as _objectWithoutProperties, a as _extends } from './ActivityRecent-b88e2ba8.js';
7
+ import Divider from './Divider.js';
8
+ import Tooltip from './Tooltip.js';
9
+ import { u as useEllipsisDetection } from './useEllipsisDetection-dfe1a9d3.js';
10
+ import './useDebounceCallback-999deae7.js';
11
+ import './floating-ui.react-0485e4db.js';
12
+ import 'react-dom';
13
+
14
+ var _excluded = ["size", "color"];
15
+ var SvgClock = function SvgClock(_ref) {
16
+ var _ref$size = _ref.size,
17
+ size = _ref$size === void 0 ? 24 : _ref$size,
18
+ _ref$color = _ref.color,
19
+ color = _ref$color === void 0 ? "currentColor" : _ref$color,
20
+ props = _objectWithoutProperties(_ref, _excluded);
21
+ return /*#__PURE__*/React__default.createElement("svg", _extends({
22
+ width: size,
23
+ height: size,
24
+ viewBox: "0 0 24 24",
25
+ fill: color,
26
+ xmlns: "http://www.w3.org/2000/svg"
27
+ }, props), /*#__PURE__*/React__default.createElement("path", {
28
+ d: "M12 2c5.523 0 10 4.478 10 10s-4.477 10-10 10-10-4.478-10-10 4.477-10 10-10Zm0 1.667c-4.595 0-8.333 3.738-8.333 8.333 0 4.595 3.738 8.333 8.333 8.333 4.595 0 8.333-3.738 8.333-8.333 0-4.595-3.738-8.333-8.333-8.333Zm-.75 2.333a.75.75 0 0 1 .743.648l.007.102v5.25h3.25a.75.75 0 0 1 .102 1.493l-.102.007h-4a.75.75 0 0 1-.743-.648l-.007-.102v-6a.75.75 0 0 1 .75-.75Z",
29
+ fill: color
30
+ }));
31
+ };
32
+
33
+ var css_248z = ".timeline{display:inline-flex}.timeline_direction_horizontal{flex-direction:row;overflow-x:auto;overflow-y:hidden;width:100%}.timeline_direction_horizontal.timeline_position_before .timeline__element{grid-template-rows:1fr auto}.timeline_direction_horizontal.timeline_position_before .timeline__element .timeline__status{order:2}.timeline_direction_horizontal.timeline_position_after .timeline__element{grid-template-rows:auto 1fr}.timeline_direction_horizontal.timeline_position_alternate .timeline__element{grid-template-rows:1fr auto 1fr}.timeline_direction_horizontal.timeline_position_alternate .timeline__element:before{content:\"\";display:block}.timeline_direction_horizontal.timeline_position_alternate .timeline__element:nth-child(odd):before{order:3}.timeline_direction_horizontal.timeline_position_alternate .timeline__element:nth-child(odd) .timeline__status{order:2}.timeline_direction_horizontal .timeline__element{flex:1;max-width:64rem;min-height:var(--guit-sem-dimension-height-xlarge);min-width:var(--guit-sem-dimension-height-7xlarge)}.timeline_direction_horizontal .timeline__status{flex-direction:row}.timeline_direction_horizontal .timeline__status_icon_pending{padding-inline:var(--guit-ref-spacing-4xsmall)}.timeline_direction_horizontal .timeline__content{padding-inline-end:var(--guit-ref-spacing-large)}.timeline_direction_vertical{flex-direction:column;min-width:var(--guit-sem-dimension-width-3xlarge)}.timeline_direction_vertical.timeline_position_after .timeline__element{grid-template-columns:auto 1fr}.timeline_direction_vertical.timeline_position_after .timeline__content{text-align:start}.timeline_direction_vertical.timeline_position_before .timeline__element{grid-template-columns:1fr auto}.timeline_direction_vertical.timeline_position_before .timeline__element .timeline__status{order:2}.timeline_direction_vertical.timeline_position_before .timeline__content{text-align:end}.timeline_direction_vertical.timeline_position_before .timeline__description{margin-inline-end:-1em;padding-inline-end:1em}.timeline_direction_vertical.timeline_position_alternate .timeline__element{grid-template-columns:1fr auto 1fr}.timeline_direction_vertical.timeline_position_alternate .timeline__element:before{content:\"\";display:block}.timeline_direction_vertical.timeline_position_alternate .timeline__element:nth-child(2n) .timeline__content{text-align:start}.timeline_direction_vertical.timeline_position_alternate .timeline__element:nth-child(odd):before{order:3}.timeline_direction_vertical.timeline_position_alternate .timeline__element:nth-child(odd) .timeline__status{order:2}.timeline_direction_vertical.timeline_position_alternate .timeline__element:nth-child(odd) .timeline__content{text-align:end}.timeline_direction_vertical.timeline_position_alternate .timeline__element:nth-child(odd) .timeline__description{margin-inline-end:-1em;padding-inline-end:1em}.timeline_direction_vertical .timeline__element{max-width:24rem;min-height:var(--guit-ref-sizing-4xlarge);min-width:var(--guit-sem-dimension-width-3xlarge)}.timeline_direction_vertical .timeline__status{flex-direction:column}.timeline_direction_vertical .timeline__status_icon_pending{padding-block:var(--guit-ref-spacing-4xsmall)}.timeline_direction_vertical .timeline__content{padding-bottom:var(--guit-ref-spacing-large)}.timeline__element{grid-gap:var(--guit-ref-spacing-xsmall);display:inline-grid}.timeline__element:last-child .timeline__status_divider{display:none}.timeline__status{display:flex}.timeline__status_icon{flex:0 0 auto}.timeline__status_icon_pending{color:var(--guit-sem-color-foreground-brand)}.timeline__status_default .timeline__status_icon{color:var(--guit-sem-color-background-neutral-4)}.timeline__status_active .timeline__status_icon{color:var(--guit-sem-color-foreground-selected)}.timeline__status_success .timeline__status_icon{color:var(--guit-sem-color-background-success-2)}.timeline__status_error .timeline__status_icon{color:var(--guit-sem-color-foreground-error)}.timeline__status_divider{flex:1}.timeline__content{display:flex;flex-direction:column;gap:var(--guit-ref-spacing-3xsmall);min-width:0}.timeline__title{font-family:var(--guit-sem-font-label-medium-default-semibold-font-family),sans-serif;font-size:var(--guit-sem-font-label-medium-default-semibold-font-size);font-weight:var(--guit-sem-font-label-medium-default-semibold-font-weight);line-height:var(--guit-sem-font-label-medium-default-semibold-line-height)}.timeline__description,.timeline__title{color:var(--guit-sem-color-foreground-neutral-2)}.timeline__description{-webkit-line-clamp:3;-webkit-box-orient:vertical;display:-webkit-box;font-family:var(--guit-sem-font-body-medium-default-regular-font-family),sans-serif;font-size:var(--guit-sem-font-body-medium-default-regular-font-size);font-weight:var(--guit-sem-font-body-medium-default-regular-font-weight);line-height:var(--guit-sem-font-body-medium-default-regular-line-height);overflow:hidden;word-break:break-word}";
34
+ styleInject(css_248z);
35
+
36
+ const TimelineContext = createContext({});
37
+ /**
38
+ * Timeline component is used to display a sequence of events in chronological order. It provides a clear visual representation of a series of activities, milestones, or steps, helping users understand the progression and flow of events over time.
39
+ */
40
+ const Timelines = ({ direction = "vertical", position = "after", className, children }) => {
41
+ const { breakpoint } = useContext(GeneUIDesignSystemContext);
42
+ const memoizedTimelineContextValue = useMemo(() => ({
43
+ direction: (breakpoint === null || breakpoint === void 0 ? void 0 : breakpoint.isMobileBreakpoint) ? "vertical" : direction
44
+ }), [direction, breakpoint]);
45
+ return (React__default.createElement(TimelineContext.Provider, { value: memoizedTimelineContextValue },
46
+ React__default.createElement("div", { className: classNames(`timeline timeline_direction_${memoizedTimelineContextValue.direction} timeline_position_${position}`, className) }, children)));
47
+ };
48
+
49
+ /**
50
+ * Timeline component is used to display a sequence of events in chronological order. It provides a clear visual representation of a series of activities, milestones, or steps, helping users understand the progression and flow of events over time.
51
+ */
52
+ const TimelinePoint = ({ title, status, description }) => {
53
+ const { direction } = useContext(TimelineContext);
54
+ const titleRef = useRef(null);
55
+ const descriptionRef = useRef(null);
56
+ const isDescriptionTruncated = useEllipsisDetection(descriptionRef);
57
+ const isTitleTruncated = useEllipsisDetection(titleRef);
58
+ return (React__default.createElement("div", { className: "timeline__element" },
59
+ React__default.createElement("div", { className: classNames(`timeline__status timeline__status_${status}`) },
60
+ status === "pending" ? (React__default.createElement(SvgClock, { size: 20, className: "timeline__status_icon timeline__status_icon_pending" })) : (React__default.createElement(SvgCircleFilled, { size: 20, className: "timeline__status_icon" })),
61
+ React__default.createElement(Divider, { className: "timeline__status_divider", vertical: direction === "vertical" })),
62
+ React__default.createElement("div", { className: "timeline__content" },
63
+ React__default.createElement(Tooltip, { text: title, isVisible: isTitleTruncated },
64
+ React__default.createElement("p", { className: "timeline__title ellipsis-text", ref: titleRef }, title)),
65
+ React__default.createElement(Tooltip, { text: description, position: "right-bottom", isVisible: isDescriptionTruncated },
66
+ React__default.createElement("p", { className: "timeline__description", ref: descriptionRef }, description)))));
67
+ };
68
+
69
+ export { TimelinePoint, Timelines };
package/Tooltip.js CHANGED
@@ -1,7 +1,7 @@
1
1
  import React__default, { useContext, useState, useRef, useEffect, Children, cloneElement, Fragment } from 'react';
2
2
  import { u as useFloating, p as platform, h as offset, i as flip, a as arrow, j as shift, b as autoUpdate, k as useHover, g as useInteractions, F as FloatingPortal } from './floating-ui.react-0485e4db.js';
3
3
  import { s as styleInject } from './style-inject.es-746bb8ed.js';
4
- import { a as GeneUIDesignSystemContext } from './index-d055a077.js';
4
+ import { a as GeneUIDesignSystemContext } from './index-ae180991.js';
5
5
  import 'react-dom';
6
6
  import './useDebounceCallback-999deae7.js';
7
7
 
@@ -1,8 +1,8 @@
1
- import { _ as _objectWithoutProperties, a as _extends } from './ArrowLeft-b88e2ba8.js';
1
+ import { _ as _objectWithoutProperties, a as _extends } from './ActivityRecent-b88e2ba8.js';
2
2
  import React__default from 'react';
3
3
 
4
4
  var _excluded = ["size", "color"];
5
- var SvgWarningFill = function SvgWarningFill(_ref) {
5
+ var SvgTriangleAlert = function SvgTriangleAlert(_ref) {
6
6
  var _ref$size = _ref.size,
7
7
  size = _ref$size === void 0 ? 24 : _ref$size,
8
8
  _ref$color = _ref.color,
@@ -11,15 +11,15 @@ var SvgWarningFill = function SvgWarningFill(_ref) {
11
11
  return /*#__PURE__*/React__default.createElement("svg", _extends({
12
12
  width: size,
13
13
  height: size,
14
- viewBox: "0 0 24 24",
14
+ viewBox: "0 0 20 18",
15
15
  fill: color,
16
16
  xmlns: "http://www.w3.org/2000/svg"
17
17
  }, props), /*#__PURE__*/React__default.createElement("path", {
18
18
  fillRule: "evenodd",
19
19
  clipRule: "evenodd",
20
- d: "m2.13 19.503 9.075-15.997a1 1 0 0 1 1.375-.368 1 1 0 0 1 .365.375l8.928 15.996a1.004 1.004 0 0 1-.375 1.358.997.997 0 0 1-.497.133h-18.002a.997.997 0 0 1-.999-.997c0-.175.044-.348.13-.5Zm9.33-5.035a.748.748 0 0 0 1.278-.531v-5.254a.753.753 0 0 0-.749-.751.748.748 0 0 0-.749.751v5.254c0 .199.08.39.22.531Zm1.442 2.552a.915.915 0 0 1-.913.917.915.915 0 0 1-.914-.917.915.915 0 1 1 1.827 0Z",
20
+ d: "m.13 16.503 9.075-15.997a1 1 0 0 1 1.375-.368 1 1 0 0 1 .365.375l8.928 15.996a1.004 1.004 0 0 1-.375 1.358.997.997 0 0 1-.497.133h-18.002a.997.997 0 0 1-.999-.997c0-.175.044-.348.13-.5Zm9.33-5.035a.748.748 0 0 0 1.278-.531v-5.254a.753.753 0 0 0-.749-.751.748.748 0 0 0-.749.751v5.254c0 .199.08.39.22.531Zm1.442 2.552a.915.915 0 0 1-.913.917.915.915 0 0 1-.913-.917c0-.506.409-.916.913-.916s.913.41.913.916Z",
21
21
  fill: color
22
22
  }));
23
23
  };
24
24
 
25
- export { SvgWarningFill as S };
25
+ export { SvgTriangleAlert as S };
package/X-9c317d18.js ADDED
@@ -0,0 +1,23 @@
1
+ import { _ as _objectWithoutProperties, a as _extends } from './ActivityRecent-b88e2ba8.js';
2
+ import React__default from 'react';
3
+
4
+ var _excluded = ["size", "color"];
5
+ var SvgX = function SvgX(_ref) {
6
+ var _ref$size = _ref.size,
7
+ size = _ref$size === void 0 ? 24 : _ref$size,
8
+ _ref$color = _ref.color,
9
+ color = _ref$color === void 0 ? "currentColor" : _ref$color,
10
+ props = _objectWithoutProperties(_ref, _excluded);
11
+ return /*#__PURE__*/React__default.createElement("svg", _extends({
12
+ width: size,
13
+ height: size,
14
+ viewBox: "0 0 16 16",
15
+ fill: color,
16
+ xmlns: "http://www.w3.org/2000/svg"
17
+ }, props), /*#__PURE__*/React__default.createElement("path", {
18
+ d: "m9.051 8 6.731-6.731a.743.743 0 1 0-1.052-1.051l-6.73 6.73-6.73-6.73a.743.743 0 1 0-1.052 1.05l6.73 6.732-6.73 6.73a.743.743 0 1 0 1.051 1.051l6.73-6.73 6.731 6.731a.743.743 0 1 0 1.052-1.05l-6.73-6.732Z",
19
+ fill: color
20
+ }));
21
+ };
22
+
23
+ export { SvgX as S };
@@ -20,7 +20,7 @@ interface IHelperTextProps {
20
20
  text: string;
21
21
  /**
22
22
  * Optional. Icon to be displayed alongside the helper text.
23
- * If the `type` prop is set to `error` or `warning`, a default icon will be used (ErrorAlertFill for `error` and WarningFill for `warning`) unless an `Icon` is explicitly provided.
23
+ * If the `type` prop is set to `error` or `warning`, a default icon will be used (Error for `error` and TriangleAlert for `warning`) unless an `Icon` is explicitly provided.
24
24
  * If `type` is `rest`, the provided `Icon` will be used (if supplied), otherwise no icon will be displayed.
25
25
  * The size of the icon will automatically adjust based on the `size` prop (`small` or `medium`).
26
26
  */
@@ -0,0 +1,78 @@
1
+ import { ChangeEvent, FC, FocusEvent } from "react";
2
+ import "./Radio.scss";
3
+ interface IRadioProps {
4
+ /**
5
+ * The text displayed as the label for the radio, describing its purpose or function.
6
+ */
7
+ label?: string;
8
+ /**
9
+ * Toggles the label's and HelperText position between above or beside the radio.
10
+ * Possible values: `horizontal | vertical`
11
+ */
12
+ direction?: "horizontal " | "vertical";
13
+ /**
14
+ * Specifies whether the radio is mandatory for completing a form.
15
+ */
16
+ required?: boolean;
17
+ /**
18
+ * Disables the radio, preventing it from being interacted with.
19
+ */
20
+ disabled?: boolean;
21
+ /**
22
+ * Displays the radio as read-only, where users cannot modify its value.
23
+ */
24
+ readOnly?: boolean;
25
+ /**
26
+ * Manages the checked state of the radio in a controlled way.
27
+ */
28
+ checked?: boolean;
29
+ /**
30
+ * Automatically focuses the radio when the component mounts.
31
+ */
32
+ autoFocus?: boolean;
33
+ /**
34
+ * Extra information displayed with the tooltip for clarity or guidance.
35
+ */
36
+ infoText?: string;
37
+ /**
38
+ * Helper text to provide context or explain any errors, warnings related to the radio.
39
+ */
40
+ helperText?: string;
41
+ /**
42
+ * The initial state of the radio was checked before user interaction. This prop does not make the component controlled.
43
+ */
44
+ defaultChecked?: boolean;
45
+ /**
46
+ * Determines the radios appearance based on its status.<br>
47
+ * Possible values: `rest | warning | error`
48
+ */
49
+ type?: "rest" | "warning" | "error";
50
+ /**
51
+ * HTML name attribute for the input element.<br>
52
+ * A unique identifier for the radio within a form.
53
+ */
54
+ name: string;
55
+ /**
56
+ * Fires when the user changes the radio state. Provides the change event as a callback's argument.
57
+ */
58
+ onChange?: (e: ChangeEvent<HTMLInputElement>) => void;
59
+ /**
60
+ * Event handler for when the radio input element loses focus. Provides the focus event as a callback's argument.
61
+ */
62
+ onBlur?: (e: FocusEvent<HTMLInputElement>) => void;
63
+ /**
64
+ * Event handler for when the radio input element receives focus. Provides the focus event as a callback's argument.
65
+ */
66
+ onFocus?: (e: FocusEvent<HTMLInputElement>) => void;
67
+ /**
68
+ * Additional class for the parent element.
69
+ * This prop should be used to set placement properties for the element relative to its parent using BEM conventions.
70
+ */
71
+ className?: string;
72
+ /**
73
+ * The value of the component that will be returned in the onChange event.
74
+ * */
75
+ value: string;
76
+ }
77
+ declare const Radio: FC<IRadioProps>;
78
+ export { IRadioProps, Radio as default };
@@ -0,0 +1 @@
1
+ export { IRadioProps, default } from "./Radio";
@@ -0,0 +1,31 @@
1
+ import React, { FC, ReactNode } from "react";
2
+ import "./Timeline.scss";
3
+ interface ITimelineContextProps {
4
+ /**
5
+ * Steps direction <br/>
6
+ * Possible values: `vertical | horizontal`
7
+ */
8
+ direction?: "vertical" | "horizontal";
9
+ }
10
+ interface ITimelinesProps extends ITimelineContextProps {
11
+ /**
12
+ * Additional class for the parent element.
13
+ * This prop should be used to set placement properties for the element relative to its parent using BEM conventions.
14
+ */
15
+ className?: string;
16
+ /**
17
+ * Positions at which the timeline contents will be displayed compared to the Line <br>
18
+ * Possible values: `after | before | top | bottom | alternate`
19
+ */
20
+ position?: "after" | "before" | "alternate";
21
+ /**
22
+ * Provide `<Timeline/>` components to be rendered in the `<Timelines/>`
23
+ */
24
+ children: ReactNode;
25
+ }
26
+ export declare const TimelineContext: React.Context<ITimelineContextProps>;
27
+ /**
28
+ * Timeline component is used to display a sequence of events in chronological order. It provides a clear visual representation of a series of activities, milestones, or steps, helping users understand the progression and flow of events over time.
29
+ */
30
+ declare const Timelines: FC<ITimelinesProps>;
31
+ export { ITimelinesProps, Timelines as default };
@@ -0,0 +1,27 @@
1
+ import { FC } from "react";
2
+ import "./Timeline.scss";
3
+ interface ITimelinePointProps {
4
+ /**
5
+ * The title of the timeline item.
6
+ */
7
+ title: string;
8
+ /**
9
+ * A detailed description or context for the timeline item.
10
+ */
11
+ description: string;
12
+ /**
13
+ * The current status of the timeline item.
14
+ * Possible values:
15
+ * - 'default': The default state.
16
+ * - 'active': The item is currently active or being processed.
17
+ * - 'success': The item has completed successfully.
18
+ * - 'error': The item encountered an error.
19
+ * - 'pending': The item is waiting to be processed.
20
+ */
21
+ status: "default" | "active" | "success" | "error" | "pending";
22
+ }
23
+ /**
24
+ * Timeline component is used to display a sequence of events in chronological order. It provides a clear visual representation of a series of activities, milestones, or steps, helping users understand the progression and flow of events over time.
25
+ */
26
+ declare const TimelinePoint: FC<ITimelinePointProps>;
27
+ export { ITimelinePointProps, TimelinePoint as default };
@@ -0,0 +1,2 @@
1
+ export { ITimelinesProps, default as Timelines } from "./Timeline";
2
+ export { ITimelinePointProps, default as TimelinePoint } from "./TimelinePoint";
@@ -1,9 +1,9 @@
1
1
  import React__default, { useRef, useCallback, useEffect, useState, useContext, useLayoutEffect } from 'react';
2
2
  import { u as useFloating, p as platform, o as offset, f as flip, a as arrow, s as shift, b as autoUpdate, c as useDismiss, d as useClick, e as useRole, g as useInteractions, F as FloatingPortal } from './floating-ui.react-0485e4db.js';
3
- import { S as SvgClose } from './Close-e8302008.js';
4
- import { S as SvgInfoOutline } from './InfoOutline-dd2e89d9.js';
3
+ import { S as SvgInfoOutlined } from './InfoOutlined-fc7d9afa.js';
4
+ import { S as SvgX } from './X-9c317d18.js';
5
5
  import { s as styleInject } from './style-inject.es-746bb8ed.js';
6
- import { a as GeneUIDesignSystemContext } from './index-d055a077.js';
6
+ import { a as GeneUIDesignSystemContext } from './index-ae180991.js';
7
7
  import Button from './Button.js';
8
8
 
9
9
  var css_248z = ".popover{background-color:var(--guit-sem-color-background-neutral-1-nudge);border-top-left-radius:var(--guit-ref-radius-2xsmall);border-top-right-radius:var(--guit-ref-radius-2xsmall);filter:drop-shadow(var(--guit-sem-shadow-floating-2-position-x-1) var(--guit-sem-shadow-floating-2-position-y-1) var(--guit-sem-shadow-floating-2-blur-1) var(--guit-sem-color-floating-2-rgba-1)) drop-shadow(var(--guit-sem-shadow-floating-2-position-x-2) var(--guit-sem-shadow-floating-2-position-y-2) var(--guit-sem-shadow-floating-2-blur-2) var(--guit-sem-color-floating-2-rgba-2))}.popover:not(.popover_size_mobile){border-bottom-left-radius:var(--guit-ref-radius-2xsmall);border-bottom-right-radius:var(--guit-ref-radius-2xsmall)}.popover:not(.popover_size_mobile) .popover__arrow{position:absolute}.popover:not(.popover_size_mobile) .popover__arrowPath{fill:var(--guit-sem-color-background-neutral-1-nudge)}.popover_position_top .popover__arrow{transform:rotate(180deg)}.popover_position_bottom .popover__arrow{transform:rotate(0deg)}.popover_position_left .popover__arrow{transform:rotate(90deg)}.popover_position_right .popover__arrow{transform:rotate(-90deg)}.popover_size_xLarge{width:72rem}.popover_size_xLarge .popover__body{height:15.4rem}.popover_size_xLarge .popover__footer{height:6.4rem}.popover_size_large{width:48rem}.popover_size_medium{width:36rem}.popover_size_large .popover__body,.popover_size_medium .popover__body{height:17.2rem}.popover_size_large .popover__footer,.popover_size_medium .popover__footer{height:5.6rem}.popover_size_small{width:24rem}.popover_size_small .popover__body{height:8.8rem}.popover_size_small .popover__footer{height:5.6rem}.popover_size_mobile{min-width:32rem;width:100%}.popover_size_mobile .popover__body{height:17.2rem}.popover_size_mobile .popover__footer{height:6.4rem}.popover__header{border-bottom:var(--guit-ref-border-width-thin) var(--guit-ref-border-style-solid) var(--guit-sem-color-border-neutral-2);height:4.8rem;justify-content:space-between;padding-inline:var(--guit-ref-spacing-large)}.popover__header,.popover__title{align-items:center;column-gap:var(--guit-ref-spacing-xsmall);display:flex}.popover__title{color:var(--guit-sem-color-foreground-neutral-2);flex:1;overflow:hidden}.popover__title_icon{flex:0 0 auto}.popover__title_text{font-family:var(--guit-sem-font-label-medium-default-semibold-font-family);font-size:var(--guit-sem-font-label-medium-default-semibold-font-size);font-weight:var(--guit-sem-font-label-medium-default-semibold-font-weight);line-height:var(--guit-sem-font-label-medium-default-semibold-line-height)}.popover__close{flex:0 0 auto}.popover__body{padding-block:var(--guit-ref-spacing-large);padding-inline:var(--guit-ref-spacing-large)}.popover__content{height:100%;overflow-y:auto;width:100%}.popover__footer{border-top:var(--guit-ref-border-width-thin) var(--guit-ref-border-style-solid) var(--guit-sem-color-border-neutral-2);justify-content:space-between;padding-block:var(--guit-ref-spacing-large);padding-inline:var(--guit-ref-spacing-large)}.popover__footer,.popover__footer_buttons{align-items:center;column-gap:var(--guit-ref-spacing-xsmall);display:flex}.popover__footer_buttons{margin-inline-start:auto}";
@@ -317,9 +317,9 @@ const Popover = ({ size = "medium", position = "bottom-center", padding = 10, is
317
317
  React__default.createElement("div", { className: "popover__container" },
318
318
  title && (React__default.createElement("div", { className: "popover__header" },
319
319
  React__default.createElement("p", { className: "popover__title" },
320
- React__default.createElement(SvgInfoOutline, { className: "popover__title_icon", size: 20 }),
320
+ React__default.createElement(SvgInfoOutlined, { className: "popover__title_icon", size: 20 }),
321
321
  React__default.createElement("span", { className: "popover__title_text ellipsis-text" }, title)),
322
- React__default.createElement(Button, { Icon: SvgClose, size: "small", appearance: "secondary", displayType: "text", className: "popover__close", onClick: () => setPopoverOpened(false) }))),
322
+ React__default.createElement(Button, { Icon: SvgX, size: "small", appearance: "secondary", displayType: "text", className: "popover__close", onClick: () => setPopoverOpened(false) }))),
323
323
  children))))));
324
324
  };
325
325
 
@@ -1309,7 +1309,7 @@ var dependencies = {
1309
1309
  "@floating-ui/react": "^0.26.16",
1310
1310
  "@floating-ui/react-dom": "^2.1.2",
1311
1311
  "@floating-ui/utils": "^0.2.8",
1312
- "@geneui/icons": "^1.0.4",
1312
+ "@geneui/icons": "^1.0.6",
1313
1313
  "@geneui/tokens": "^1.0.0",
1314
1314
  classnames: "^2.3.2",
1315
1315
  "qrcode.react": "^4.2.0",
@@ -1385,4 +1385,4 @@ function GeneUIProvider({ children, tokens = null, theme = "light" }) {
1385
1385
  React__default.createElement("div", { className: "gene-ui-provider", "data-gene-ui-version": pgk.version, ref: geneUIProviderRef, style: { height: "100%" } }, isRefExist && children)));
1386
1386
  }
1387
1387
 
1388
- export { GeneUIProvider as G, GeneUIDesignSystemContext as a, useWindowSize as u };
1388
+ export { GeneUIProvider as G, GeneUIDesignSystemContext as a, useBreakpoint as b, useWindowSize as u };
package/index.d.ts CHANGED
@@ -6,6 +6,7 @@ export { default as Pill, IPillProps } from "./components/atoms/Pill";
6
6
  export { default as Divider, IDividerProps } from "./components/atoms/Divider";
7
7
  export { default as Info, IInfoProps } from "./components/atoms/Info";
8
8
  export { default as Button, IButtonProps } from "./components/atoms/Button";
9
+ export { default as Radio } from "./components/atoms/Radio";
9
10
  export { default as Text, ITextProps } from "./components/atoms/Text";
10
11
  export { Popover, PopoverBody, PopoverFooter, PopoverFooterActions, IPopoverProps } from "./components/atoms/Popover";
11
12
  export { default as Badge, IBadgeProps } from "./components/atoms/Badge";
@@ -15,11 +16,14 @@ export { default as Tooltip } from "./components/molecules/Tooltip";
15
16
  export { default as ProgressBar } from "./components/molecules/ProgressBar";
16
17
  export { Steps, Step, IStepProps, IStepsProps } from "./components/molecules/Steps";
17
18
  export { default as Tag, ITagProps } from "./components/molecules/Tag";
18
- export { default as QRCode } from "./components/molecules/QRCode";
19
+ export { Timelines, TimelinePoint, ITimelinesProps, ITimelinePointProps } from "./components/molecules/Timeline";
20
+ export { default as QRCode, IQRCodeProps } from "./components/molecules/QRCode";
19
21
  export { KeyValue, Key, Value, IKeyValueProps, IKeyProps, IValueProps } from "./components/molecules/KeyValue";
20
22
  export { default as GeneUIProvider, GeneUIDesignSystemContext, IGeneUIDesignSystemContext, IGeneUIProviderProps } from "./components/providers/GeneUIProvider";
21
23
  export { default as useDebounce } from "./hooks/useDebounceCallback";
22
24
  export { default as useEllipsisDetection } from "./hooks/useEllipsisDetection";
23
25
  export { default as useScrollLock } from "./hooks/useScrollLock";
24
26
  export { default as useWindowSize } from "./hooks/useWindowSize";
27
+ export { default as useClickOutside } from "./hooks/useClickOutside";
25
28
  export { default as useDeviceInfo } from "./hooks/useDeviceInfo";
29
+ export { default as useBreakpoint } from "./hooks/useBreakpoint";
package/index.js CHANGED
@@ -6,8 +6,9 @@ export { default as Pill } from './Pill.js';
6
6
  export { default as Divider } from './Divider.js';
7
7
  export { default as Info } from './Info.js';
8
8
  export { default as Button } from './Button.js';
9
+ export { default as Radio } from './Radio.js';
9
10
  export { default as Text } from './Text.js';
10
- export { P as Popover, a as PopoverBody, b as PopoverFooter, c as PopoverFooterActions, u as useScrollLock } from './index-d5f349ff.js';
11
+ export { P as Popover, a as PopoverBody, b as PopoverFooter, c as PopoverFooterActions, u as useScrollLock } from './index-5a59c1ea.js';
11
12
  export { default as Badge } from './Badge.js';
12
13
  export { default as Scrollbar } from './Scrollbar.js';
13
14
  export { Col, Grid, Row } from './Grid.js';
@@ -15,23 +16,45 @@ export { default as Tooltip } from './Tooltip.js';
15
16
  export { default as ProgressBar } from './ProgressBar.js';
16
17
  export { Step, Steps } from './Steps.js';
17
18
  export { default as Tag } from './Tag.js';
19
+ export { TimelinePoint, Timelines } from './Timeline.js';
18
20
  export { default as QRCode } from './QRCode.js';
19
21
  export { Key, KeyValue, Value } from './KeyValue.js';
20
- export { a as GeneUIDesignSystemContext, G as GeneUIProvider, u as useWindowSize } from './index-d055a077.js';
22
+ export { a as GeneUIDesignSystemContext, G as GeneUIProvider, b as useBreakpoint, u as useWindowSize } from './index-ae180991.js';
21
23
  export { u as useDebounce } from './useDebounceCallback-999deae7.js';
22
- export { u as useEllipsisDetection } from './useEllipsisDetection-500dc188.js';
23
- import { useMemo } from 'react';
24
+ export { u as useEllipsisDetection } from './useEllipsisDetection-dfe1a9d3.js';
25
+ import { useRef, useCallback, useEffect, useMemo } from 'react';
24
26
  import './index-ce02421b.js';
25
- import './ArrowLeft-b88e2ba8.js';
27
+ import './ActivityRecent-b88e2ba8.js';
26
28
  import './style-inject.es-746bb8ed.js';
27
- import './ErrorAlertFill-a0afebbf.js';
28
- import './WarningFill-143d0870.js';
29
- import './InfoOutline-dd2e89d9.js';
29
+ import './Error-e14cf0e1.js';
30
+ import './TriangleAlert-14d7e83c.js';
31
+ import './CircleFilled-19a9ec62.js';
32
+ import './InfoOutlined-fc7d9afa.js';
30
33
  import './floating-ui.react-0485e4db.js';
31
34
  import 'react-dom';
32
- import './Close-e8302008.js';
35
+ import './X-9c317d18.js';
33
36
  import 'prop-types';
34
37
 
38
+ const useClickOutside = (callback, relativeElements) => {
39
+ const ref = useRef(null);
40
+ const handleClickOutside = useCallback((e) => {
41
+ const { target } = e;
42
+ if (!(target instanceof Node))
43
+ return;
44
+ const isNotRelativeTarget = !(relativeElements === null || relativeElements === void 0 ? void 0 : relativeElements.some((relativeRef) => { var _a; return (_a = relativeRef.current) === null || _a === void 0 ? void 0 : _a.contains(target); }));
45
+ if (ref.current && !ref.current.contains(target) && isNotRelativeTarget) {
46
+ callback(e);
47
+ }
48
+ }, [callback, relativeElements]);
49
+ useEffect(() => {
50
+ document.addEventListener("mousedown", handleClickOutside);
51
+ return () => document.removeEventListener("mousedown", handleClickOutside);
52
+ }, [handleClickOutside]);
53
+ return (node) => {
54
+ ref.current = node;
55
+ };
56
+ };
57
+
35
58
  // Map of OS detection patterns
36
59
  const osPatterns = [
37
60
  ["Windows", /\b(windows nt|win)\b/i],
@@ -85,4 +108,4 @@ const useDeviceInfo = () => {
85
108
  }, []);
86
109
  };
87
110
 
88
- export { useDeviceInfo };
111
+ export { useClickOutside, useDeviceInfo };
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@geneui/components",
3
3
  "description": "The Gene UI components library designed for BI tools",
4
- "version": "3.0.0-next-89cc223-14032025",
4
+ "version": "3.0.0-next-6c2658b-26032025",
5
5
  "author": "SoftConstruct",
6
6
  "homepage": "https://github.com/softconstruct/gene-ui-components#readme",
7
7
  "repository": {
@@ -172,7 +172,7 @@
172
172
  "@floating-ui/react": "^0.26.16",
173
173
  "@floating-ui/react-dom": "^2.1.2",
174
174
  "@floating-ui/utils": "^0.2.8",
175
- "@geneui/icons": "^1.0.4",
175
+ "@geneui/icons": "^1.0.6",
176
176
  "@geneui/tokens": "^1.0.0",
177
177
  "classnames": "^2.3.2",
178
178
  "qrcode.react": "^4.2.0",
@@ -1,5 +1,5 @@
1
1
  import { useState, useEffect } from 'react';
2
- import { u as useWindowSize } from './index-d055a077.js';
2
+ import { u as useWindowSize } from './index-ae180991.js';
3
3
 
4
4
  const EQUAL_HEIGHT_DIFF = 3;
5
5
  const useEllipsisDetection = (ref, externalDependencies = []) => {