@homecode/ui 5.1.8 → 5.1.10

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/dist/esm/index.js CHANGED
@@ -44,6 +44,7 @@ export { Shimmer } from './src/components/Shimmer/Shimmer.js';
44
44
  export { Spinner } from './src/components/Spinner/Spinner.js';
45
45
  export { Table } from './src/components/Table/Table.js';
46
46
  export { Tabs } from './src/components/Tabs/Tabs.js';
47
+ export { TextShimmer } from './src/components/TextShimmer/TextShimmer.js';
47
48
  export { Tooltip } from './src/components/Tooltip/Tooltip.js';
48
49
  export { H1, H2, H3, H4, H5, H6 } from './src/components/Text/Text.js';
49
50
  export { Theme } from './src/components/Theme/Theme.js';
@@ -62,6 +62,7 @@ import '../RadioGroup/RadioGroup.styl.js';
62
62
  import '../Router/Router.js';
63
63
  import '../Table/Table.styl.js';
64
64
  import '../Tabs/Tabs.styl.js';
65
+ import '../TextShimmer/TextShimmer.js';
65
66
  import '../Text/Text.js';
66
67
  import '../Theme/Theme.defaults.js';
67
68
  import '../Theme/ThemeProvider.js';
@@ -61,6 +61,7 @@ import '../RadioGroup/RadioGroup.styl.js';
61
61
  import '../Router/Router.js';
62
62
  import '../Table/Table.styl.js';
63
63
  import '../Tabs/Tabs.styl.js';
64
+ import '../TextShimmer/TextShimmer.js';
64
65
  import '../Text/Text.js';
65
66
  import '../Theme/Theme.defaults.js';
66
67
  import '../Theme/ThemeProvider.js';
@@ -50,7 +50,7 @@ class Item extends Component {
50
50
  render() {
51
51
  const { type = 'default', title, content, visible, pause, unpause, } = this.props;
52
52
  const classes = cn(S.item, S[`type-${type}`], visible && S.visible);
53
- return (jsx("div", { className: classes, onMouseOver: pause, onFocus: pause, onTouchStart: this.onTouchStart, onTouchMove: this.onTouchMove, onMouseOut: unpause, onBlur: unpause, onTouchEnd: this.onTouchEnd, onTouchCancel: this.onTouchCancel, children: jsxs("div", { className: S.itemInner, children: [(title || content) && (jsxs("div", { className: S.text, children: [title && jsx("div", { className: S.title, children: title }), content && jsx("div", { className: S.content, children: content })] })), jsx(Button, { className: S.close, variant: "clear", square: true, onClick: this.closeMe, children: jsx(Icon, { type: "close", size: "s" }) })] }) }));
53
+ return (jsx("div", { className: classes, onMouseOver: pause, onFocus: pause, onTouchStart: this.onTouchStart, onTouchMove: this.onTouchMove, onMouseOut: unpause, onBlur: unpause, onTouchEnd: this.onTouchEnd, onTouchCancel: this.onTouchCancel, children: jsxs("div", { className: S.itemInner, children: [(title || content) && (jsxs("div", { className: S.text, children: [title && jsx("div", { className: S.title, children: title }), content != null && (jsx("div", { className: S.content, children: typeof content === 'function' ? content() : content }))] })), jsx(Button, { className: S.close, variant: "clear", square: true, onClick: this.closeMe, children: jsx(Icon, { type: "close", size: "s" }) })] }) }));
54
54
  }
55
55
  }
56
56
  const NotificationsStore = STORE;
@@ -5,6 +5,15 @@ import { generateUID } from '../../tools/uid.js';
5
5
  import C from './Notifications.constants.json.js';
6
6
 
7
7
  const SHOW_TIME = 5000;
8
+ function normalizeContent(content) {
9
+ if (content == null)
10
+ return content;
11
+ if (typeof content === 'string' || typeof content === 'function') {
12
+ return content;
13
+ }
14
+ // justorm proxies nested objects; React elements break on internal _store.
15
+ return () => content;
16
+ }
8
17
  const STORE = createStore('notifications', {
9
18
  items: [],
10
19
  autoHide: [],
@@ -12,9 +21,11 @@ const STORE = createStore('notifications', {
12
21
  paused: false,
13
22
  show(data) {
14
23
  const id = generateUID();
24
+ const { content, ...rest } = data;
15
25
  this.items.push(id);
16
26
  this.data[id] = {
17
- ...data,
27
+ ...rest,
28
+ content: normalizeContent(content),
18
29
  createdAt: Date.now(),
19
30
  };
20
31
  Time.after(C.ANIMATION_DURATION, () => (this.data[id].visible = true));
@@ -1,6 +1,6 @@
1
1
  import styleInject from '../../../node_modules/style-inject/dist/style-inject.es.js';
2
2
 
3
- var css_248z = ".Scroll_root__NNx5K{--hide-delay:0.3s;display:flex;position:relative}.Scroll_inner__DmxTb{-webkit-overflow-scrolling:touch;-ms-overflow-style:none;overflow:hidden;position:relative;scrollbar-width:none;transition:-webkit-mask-image .3s ease-out;transition:mask-image .3s ease-out;transition:mask-image .3s ease-out,-webkit-mask-image .3s ease-out;width:100%}.Scroll_inner__DmxTb.Scroll_smooth__2vqKe{scroll-behavior:smooth}.Scroll_inner__DmxTb::-webkit-scrollbar{display:none}.Scroll_y__2xWol .Scroll_inner__DmxTb{max-height:100%;overflow-y:auto}.Scroll_x__--Ycm .Scroll_inner__DmxTb{max-width:100%;overflow-x:auto}.Scroll_fadeSize-xs__iPkYe .Scroll_inner__DmxTb{--fade-size:6px}.Scroll_fadeSize-s__WeI0f .Scroll_inner__DmxTb{--fade-size:10px}.Scroll_fadeSize-m__Hb-1p .Scroll_inner__DmxTb{--fade-size:16px}.Scroll_fadeSize-l__E0CbA .Scroll_inner__DmxTb{--fade-size:20px}.Scroll_fadeSize-xl__jcYk0 .Scroll_inner__DmxTb{--fade-size:30px}.Scroll_y__2xWol .Scroll_inner__DmxTb.Scroll_hasOffsetTop__zEkUg.Scroll_hasOffsetBottom__S2rCM{-webkit-mask-image:linear-gradient(to bottom,transparent,#000 var(--fade-size),#000 calc(100% - var(--fade-size)),transparent);mask-image:linear-gradient(to bottom,transparent,#000 var(--fade-size),#000 calc(100% - var(--fade-size)),transparent)}.Scroll_y__2xWol .Scroll_inner__DmxTb.Scroll_hasOffsetTop__zEkUg{-webkit-mask-image:linear-gradient(to bottom,transparent,#000 var(--fade-size));mask-image:linear-gradient(to bottom,transparent,#000 var(--fade-size))}.Scroll_y__2xWol .Scroll_inner__DmxTb.Scroll_hasOffsetBottom__S2rCM{-webkit-mask-image:linear-gradient(to top,transparent,#000 var(--fade-size));mask-image:linear-gradient(to top,transparent,#000 var(--fade-size))}.Scroll_x__--Ycm .Scroll_inner__DmxTb.Scroll_hasOffsetLeft__WWEyC.Scroll_hasOffsetRight__HhJWt{-webkit-mask-image:linear-gradient(to right,transparent,#000 var(--fade-size),#000 calc(100% - var(--fade-size)),transparent);mask-image:linear-gradient(to right,transparent,#000 var(--fade-size),#000 calc(100% - var(--fade-size)),transparent)}.Scroll_x__--Ycm .Scroll_inner__DmxTb.Scroll_hasOffsetLeft__WWEyC{-webkit-mask-image:linear-gradient(to right,transparent,#000 var(--fade-size));mask-image:linear-gradient(to right,transparent,#000 var(--fade-size))}.Scroll_x__--Ycm .Scroll_inner__DmxTb.Scroll_hasOffsetRight__HhJWt{-webkit-mask-image:linear-gradient(to left,transparent,#000 var(--fade-size));mask-image:linear-gradient(to left,transparent,#000 var(--fade-size))}.Scroll_thumb__ccEPj{background-color:var(--accent-color-alpha-200);border-radius:1px;position:absolute;transform-origin:center;transition:background-color .1s ease-out}.Scroll_y__2xWol>.Scroll_thumb__ccEPj{min-height:30px;top:0;width:100%}.Scroll_x__--Ycm>.Scroll_thumb__ccEPj{height:100%;left:0;min-width:30px}.Scroll_bar__6CL7R{border-radius:2px;cursor:pointer;overscroll-behavior:contain;position:absolute;touch-action:none;transition:.1s opacity var(--hide-delay) ease-out;z-index:2}.Scroll_autoHide__URLqx>.Scroll_bar__6CL7R{opacity:0;transition:.3s opacity calc(var(--hide-delay)*.6) ease-out}.Scroll_bar__6CL7R:before{content:\"\";pointer-events:none;position:absolute;transition:.3s background-color var(--hide-delay) ease-out}.Scroll_bar__6CL7R.Scroll_isActive__Nkkmi,.Scroll_isDesktop__7r-bH .Scroll_bar__6CL7R:hover{opacity:1;transition-delay:0s;z-index:1}.Scroll_bar__6CL7R.Scroll_isActive__Nkkmi:before,.Scroll_isDesktop__7r-bH .Scroll_bar__6CL7R:hover:before{background-color:var(--accent-color-alpha-100)}.Scroll_bar__6CL7R.Scroll_isActive__Nkkmi .Scroll_thumb__ccEPj,.Scroll_isDesktop__7r-bH .Scroll_bar__6CL7R:hover .Scroll_thumb__ccEPj{background-color:var(--active-color)}.Scroll_isScrolling__yV2Pj>.Scroll_bar__6CL7R{opacity:1;transition:none}.Scroll_bar__6CL7R.Scroll_y__2xWol{bottom:8px;right:0;top:8px}.Scroll_isTouch__Vb2mT .Scroll_bar__6CL7R.Scroll_y__2xWol{width:32px}.Scroll_bar__6CL7R.Scroll_y__2xWol:before{height:100%;width:16px}.Scroll_bar__6CL7R.Scroll_x__--Ycm{bottom:0;height:16px;left:8px;right:8px}.Scroll_isTouch__Vb2mT .Scroll_bar__6CL7R.Scroll_x__--Ycm{height:32px}.Scroll_bar__6CL7R.Scroll_x__--Ycm:before{width:100%}.Scroll_bar__6CL7R.Scroll_x__--Ycm{height:32px}.Scroll_bar__6CL7R.Scroll_x__--Ycm .Scroll_thumb__ccEPj,.Scroll_bar__6CL7R.Scroll_x__--Ycm:before{bottom:0}.Scroll_size-s__px8sG>.Scroll_bar__6CL7R.Scroll_x__--Ycm .Scroll_thumb__ccEPj,.Scroll_size-s__px8sG>.Scroll_bar__6CL7R.Scroll_x__--Ycm:before,.Scroll_size-xs__Hebsj>.Scroll_bar__6CL7R.Scroll_x__--Ycm .Scroll_thumb__ccEPj,.Scroll_size-xs__Hebsj>.Scroll_bar__6CL7R.Scroll_x__--Ycm:before{border-radius:.5px;height:1px}.Scroll_size-m__gfTwB>.Scroll_bar__6CL7R.Scroll_x__--Ycm .Scroll_thumb__ccEPj,.Scroll_size-m__gfTwB>.Scroll_bar__6CL7R.Scroll_x__--Ycm:before{border-radius:2.5px;height:5px}.Scroll_size-l__Pe4z7>.Scroll_bar__6CL7R.Scroll_x__--Ycm .Scroll_thumb__ccEPj,.Scroll_size-l__Pe4z7>.Scroll_bar__6CL7R.Scroll_x__--Ycm:before{border-radius:4.5px;height:9px}.Scroll_size-xl__Fvx02>.Scroll_bar__6CL7R.Scroll_x__--Ycm .Scroll_thumb__ccEPj,.Scroll_size-xl__Fvx02>.Scroll_bar__6CL7R.Scroll_x__--Ycm:before{border-radius:7px;height:14px}.Scroll_bar__6CL7R.Scroll_y__2xWol{width:32px}.Scroll_bar__6CL7R.Scroll_y__2xWol .Scroll_thumb__ccEPj,.Scroll_bar__6CL7R.Scroll_y__2xWol:before{right:0}.Scroll_size-xs__Hebsj>.Scroll_bar__6CL7R.Scroll_y__2xWol .Scroll_thumb__ccEPj,.Scroll_size-xs__Hebsj>.Scroll_bar__6CL7R.Scroll_y__2xWol:before{border-radius:.5px;width:1px}.Scroll_size-s__px8sG>.Scroll_bar__6CL7R.Scroll_y__2xWol .Scroll_thumb__ccEPj,.Scroll_size-s__px8sG>.Scroll_bar__6CL7R.Scroll_y__2xWol:before{width:1px}.Scroll_size-m__gfTwB>.Scroll_bar__6CL7R.Scroll_y__2xWol .Scroll_thumb__ccEPj,.Scroll_size-m__gfTwB>.Scroll_bar__6CL7R.Scroll_y__2xWol:before{border-radius:2.5px;width:5px}.Scroll_size-l__Pe4z7>.Scroll_bar__6CL7R.Scroll_y__2xWol .Scroll_thumb__ccEPj,.Scroll_size-l__Pe4z7>.Scroll_bar__6CL7R.Scroll_y__2xWol:before{border-radius:4.5px;width:9px}.Scroll_size-xl__Fvx02>.Scroll_bar__6CL7R.Scroll_y__2xWol .Scroll_thumb__ccEPj,.Scroll_size-xl__Fvx02>.Scroll_bar__6CL7R.Scroll_y__2xWol:before{border-radius:7px;width:14px}";
3
+ var css_248z = ".Scroll_root__NNx5K{--hide-delay:0.3s;display:flex;position:relative}.Scroll_inner__DmxTb{-webkit-overflow-scrolling:touch;-ms-overflow-style:none;overflow:hidden;position:relative;scrollbar-width:none;transition:-webkit-mask-image .3s ease-out;transition:mask-image .3s ease-out;transition:mask-image .3s ease-out,-webkit-mask-image .3s ease-out;width:100%}.Scroll_inner__DmxTb.Scroll_smooth__2vqKe{scroll-behavior:smooth}.Scroll_inner__DmxTb::-webkit-scrollbar{display:none}.Scroll_y__2xWol .Scroll_inner__DmxTb{max-height:100%;overflow-y:auto}.Scroll_x__--Ycm .Scroll_inner__DmxTb{max-width:100%;overflow-x:auto}.Scroll_fadeSize-xs__iPkYe .Scroll_inner__DmxTb{--fade-size:6px}.Scroll_fadeSize-s__WeI0f .Scroll_inner__DmxTb{--fade-size:10px}.Scroll_fadeSize-m__Hb-1p .Scroll_inner__DmxTb{--fade-size:16px}.Scroll_fadeSize-l__E0CbA .Scroll_inner__DmxTb{--fade-size:20px}.Scroll_fadeSize-xl__jcYk0 .Scroll_inner__DmxTb{--fade-size:30px}.Scroll_y__2xWol .Scroll_inner__DmxTb.Scroll_hasOffsetTop__zEkUg.Scroll_hasOffsetBottom__S2rCM{-webkit-mask-image:linear-gradient(to bottom,transparent,#000 var(--fade-size),#000 calc(100% - var(--fade-size)),transparent);mask-image:linear-gradient(to bottom,transparent,#000 var(--fade-size),#000 calc(100% - var(--fade-size)),transparent)}.Scroll_y__2xWol .Scroll_inner__DmxTb.Scroll_hasOffsetTop__zEkUg{-webkit-mask-image:linear-gradient(to bottom,transparent,#000 var(--fade-size));mask-image:linear-gradient(to bottom,transparent,#000 var(--fade-size))}.Scroll_y__2xWol .Scroll_inner__DmxTb.Scroll_hasOffsetBottom__S2rCM{-webkit-mask-image:linear-gradient(to top,transparent,#000 var(--fade-size));mask-image:linear-gradient(to top,transparent,#000 var(--fade-size))}.Scroll_x__--Ycm .Scroll_inner__DmxTb.Scroll_hasOffsetLeft__WWEyC.Scroll_hasOffsetRight__HhJWt{-webkit-mask-image:linear-gradient(to right,transparent,#000 var(--fade-size),#000 calc(100% - var(--fade-size)),transparent);mask-image:linear-gradient(to right,transparent,#000 var(--fade-size),#000 calc(100% - var(--fade-size)),transparent)}.Scroll_x__--Ycm .Scroll_inner__DmxTb.Scroll_hasOffsetLeft__WWEyC{-webkit-mask-image:linear-gradient(to right,transparent,#000 var(--fade-size));mask-image:linear-gradient(to right,transparent,#000 var(--fade-size))}.Scroll_x__--Ycm .Scroll_inner__DmxTb.Scroll_hasOffsetRight__HhJWt{-webkit-mask-image:linear-gradient(to left,transparent,#000 var(--fade-size));mask-image:linear-gradient(to left,transparent,#000 var(--fade-size))}.Scroll_thumb__ccEPj{background-color:var(--accent-color-alpha-200);border-radius:1px;position:absolute;transform-origin:center;transition:background-color .1s ease-out}.Scroll_y__2xWol>.Scroll_thumb__ccEPj{min-height:30px;top:0;width:100%}.Scroll_x__--Ycm>.Scroll_thumb__ccEPj{height:100%;left:0;min-width:30px}.Scroll_bar__6CL7R{border-radius:2px;cursor:pointer;overscroll-behavior:contain;position:absolute;touch-action:none;transition:.1s opacity var(--hide-delay) ease-out;z-index:2}.Scroll_autoHide__URLqx>.Scroll_bar__6CL7R{opacity:0;transition:.3s opacity calc(var(--hide-delay)*.6) ease-out}.Scroll_bar__6CL7R:before{content:\"\";pointer-events:none;position:absolute;transition:.3s background-color var(--hide-delay) ease-out}.Scroll_bar__6CL7R.Scroll_isActive__Nkkmi,.Scroll_isDesktop__7r-bH .Scroll_bar__6CL7R:hover{opacity:1;transition-delay:0s;z-index:1}.Scroll_bar__6CL7R.Scroll_isActive__Nkkmi:before,.Scroll_isDesktop__7r-bH .Scroll_bar__6CL7R:hover:before{background-color:var(--accent-color-alpha-100)}.Scroll_bar__6CL7R.Scroll_isActive__Nkkmi .Scroll_thumb__ccEPj,.Scroll_isDesktop__7r-bH .Scroll_bar__6CL7R:hover .Scroll_thumb__ccEPj{background-color:var(--active-color)}.Scroll_isScrolling__yV2Pj>.Scroll_bar__6CL7R{opacity:1;transition:none}.Scroll_bar__6CL7R.Scroll_y__2xWol{bottom:8px;right:0;top:8px}.Scroll_isTouch__Vb2mT .Scroll_bar__6CL7R.Scroll_y__2xWol{width:32px}.Scroll_bar__6CL7R.Scroll_y__2xWol:before{height:100%;width:16px}.Scroll_bar__6CL7R.Scroll_x__--Ycm{bottom:0;height:16px;left:8px;right:8px}.Scroll_isTouch__Vb2mT .Scroll_bar__6CL7R.Scroll_x__--Ycm{height:32px}.Scroll_bar__6CL7R.Scroll_x__--Ycm:before{width:100%}.Scroll_bar__6CL7R.Scroll_x__--Ycm{height:32px}.Scroll_bar__6CL7R.Scroll_x__--Ycm:before{left:0}.Scroll_bar__6CL7R.Scroll_x__--Ycm .Scroll_thumb__ccEPj,.Scroll_bar__6CL7R.Scroll_x__--Ycm:before{bottom:0}.Scroll_size-s__px8sG>.Scroll_bar__6CL7R.Scroll_x__--Ycm .Scroll_thumb__ccEPj,.Scroll_size-s__px8sG>.Scroll_bar__6CL7R.Scroll_x__--Ycm:before,.Scroll_size-xs__Hebsj>.Scroll_bar__6CL7R.Scroll_x__--Ycm .Scroll_thumb__ccEPj,.Scroll_size-xs__Hebsj>.Scroll_bar__6CL7R.Scroll_x__--Ycm:before{border-radius:.5px;height:1px}.Scroll_size-m__gfTwB>.Scroll_bar__6CL7R.Scroll_x__--Ycm .Scroll_thumb__ccEPj,.Scroll_size-m__gfTwB>.Scroll_bar__6CL7R.Scroll_x__--Ycm:before{border-radius:2.5px;height:5px}.Scroll_size-l__Pe4z7>.Scroll_bar__6CL7R.Scroll_x__--Ycm .Scroll_thumb__ccEPj,.Scroll_size-l__Pe4z7>.Scroll_bar__6CL7R.Scroll_x__--Ycm:before{border-radius:4.5px;height:9px}.Scroll_size-xl__Fvx02>.Scroll_bar__6CL7R.Scroll_x__--Ycm .Scroll_thumb__ccEPj,.Scroll_size-xl__Fvx02>.Scroll_bar__6CL7R.Scroll_x__--Ycm:before{border-radius:7px;height:14px}.Scroll_bar__6CL7R.Scroll_y__2xWol{width:32px}.Scroll_bar__6CL7R.Scroll_y__2xWol:before{top:0}.Scroll_bar__6CL7R.Scroll_y__2xWol .Scroll_thumb__ccEPj,.Scroll_bar__6CL7R.Scroll_y__2xWol:before{right:0}.Scroll_size-xs__Hebsj>.Scroll_bar__6CL7R.Scroll_y__2xWol .Scroll_thumb__ccEPj,.Scroll_size-xs__Hebsj>.Scroll_bar__6CL7R.Scroll_y__2xWol:before{border-radius:.5px;width:1px}.Scroll_size-s__px8sG>.Scroll_bar__6CL7R.Scroll_y__2xWol .Scroll_thumb__ccEPj,.Scroll_size-s__px8sG>.Scroll_bar__6CL7R.Scroll_y__2xWol:before{width:1px}.Scroll_size-m__gfTwB>.Scroll_bar__6CL7R.Scroll_y__2xWol .Scroll_thumb__ccEPj,.Scroll_size-m__gfTwB>.Scroll_bar__6CL7R.Scroll_y__2xWol:before{border-radius:2.5px;width:5px}.Scroll_size-l__Pe4z7>.Scroll_bar__6CL7R.Scroll_y__2xWol .Scroll_thumb__ccEPj,.Scroll_size-l__Pe4z7>.Scroll_bar__6CL7R.Scroll_y__2xWol:before{border-radius:4.5px;width:9px}.Scroll_size-xl__Fvx02>.Scroll_bar__6CL7R.Scroll_y__2xWol .Scroll_thumb__ccEPj,.Scroll_size-xl__Fvx02>.Scroll_bar__6CL7R.Scroll_y__2xWol:before{border-radius:7px;width:14px}";
4
4
  var S = {"root":"Scroll_root__NNx5K","inner":"Scroll_inner__DmxTb","smooth":"Scroll_smooth__2vqKe","y":"Scroll_y__2xWol","x":"Scroll_x__--Ycm","fadeSize-xs":"Scroll_fadeSize-xs__iPkYe","fadeSize-s":"Scroll_fadeSize-s__WeI0f","fadeSize-m":"Scroll_fadeSize-m__Hb-1p","fadeSize-l":"Scroll_fadeSize-l__E0CbA","fadeSize-xl":"Scroll_fadeSize-xl__jcYk0","hasOffsetTop":"Scroll_hasOffsetTop__zEkUg","hasOffsetBottom":"Scroll_hasOffsetBottom__S2rCM","hasOffsetLeft":"Scroll_hasOffsetLeft__WWEyC","hasOffsetRight":"Scroll_hasOffsetRight__HhJWt","thumb":"Scroll_thumb__ccEPj","bar":"Scroll_bar__6CL7R","autoHide":"Scroll_autoHide__URLqx","isDesktop":"Scroll_isDesktop__7r-bH","isActive":"Scroll_isActive__Nkkmi","isScrolling":"Scroll_isScrolling__yV2Pj","isTouch":"Scroll_isTouch__Vb2mT","size-xs":"Scroll_size-xs__Hebsj","size-s":"Scroll_size-s__px8sG","size-m":"Scroll_size-m__gfTwB","size-l":"Scroll_size-l__Pe4z7","size-xl":"Scroll_size-xl__Fvx02"};
5
5
  styleInject(css_248z);
6
6
 
@@ -0,0 +1,29 @@
1
+ import { jsx, Fragment } from 'react/jsx-runtime';
2
+ import cn from 'classnames';
3
+ import React__default, { useMemo } from 'react';
4
+ import S from './TextShimmer.styl.js';
5
+
6
+ function TextShimmerComponent({ children, as: Component = 'p', className, duration = 1, spread = 3, inverted = false, active = true, }) {
7
+ const { backgroundGradient } = useMemo(() => {
8
+ const raw = Math.min(48, 3.5 + Math.max(0, Math.min(1, spread / 10)) * 100.5);
9
+ // Wide blend stops “vertical knife” artefacts when the ramp only spans few pixels inside the glyph mask.
10
+ const ridgeHalf = Math.min(49, Math.max(36, raw + 17));
11
+ const baseColor = inverted
12
+ ? 'var(--txt-sh-highlight)'
13
+ : 'var(--txt-sh-fill)';
14
+ const bandColor = inverted
15
+ ? 'var(--txt-sh-fill)'
16
+ : 'var(--txt-sh-highlight)';
17
+ const backgroundGradient = `linear-gradient(90deg, ${baseColor} calc(50% - ${ridgeHalf}%), ${bandColor} 50%, ${baseColor} calc(50% + ${ridgeHalf}%))`;
18
+ return { backgroundGradient };
19
+ }, [spread, inverted]);
20
+ if (!active)
21
+ return jsx(Fragment, { children: children });
22
+ return (jsx(Component, { className: cn(S.root, className), style: {
23
+ '--text-shimmer-duration': `${duration}s`,
24
+ backgroundImage: backgroundGradient,
25
+ }, children: children }));
26
+ }
27
+ const TextShimmer = React__default.memo(TextShimmerComponent);
28
+
29
+ export { TextShimmer };
@@ -0,0 +1,7 @@
1
+ import styleInject from '../../../node_modules/style-inject/dist/style-inject.es.js';
2
+
3
+ var css_248z = ".TextShimmer_root__cnKtV{-webkit-text-fill-color:transparent;-webkit-font-smoothing:antialiased;--txt-sh-fill:var(--text-shimmer-decent-tone,var(--accent-color));--txt-sh-highlight:var(--text-shimmer-accent-tone,var(--decent-color));animation:TextShimmer_textShimmer__w7rQj 1s linear infinite;animation:TextShimmer_textShimmer__w7rQj var(--text-shimmer-duration,1s) linear infinite;-webkit-background-clip:text;background-clip:text;background-repeat:repeat-x;background-size:200% 100%;color:transparent!important;display:inline-block;position:relative}@keyframes TextShimmer_textShimmer__w7rQj{0%{background-position:100%}to{background-position:-100%}}";
4
+ var S = {"root":"TextShimmer_root__cnKtV","textShimmer":"TextShimmer_textShimmer__w7rQj"};
5
+ styleInject(css_248z);
6
+
7
+ export { S as default };
@@ -1,9 +1,10 @@
1
+ import type { ReactNode } from 'react';
1
2
  export type NotificationType = 'warning' | 'danger' | 'loading';
2
3
  type Id = string;
3
4
  export type ItemParams = {
4
5
  type?: NotificationType;
5
6
  title?: string;
6
- content?: string;
7
+ content?: ReactNode;
7
8
  autoHide?: boolean;
8
9
  };
9
10
  export type Methods = {
@@ -13,8 +14,9 @@ export type Methods = {
13
14
  close: (id: Id) => void;
14
15
  remove: (id: Id) => void;
15
16
  };
16
- export type ItemProps = ItemParams & Methods & {
17
+ export type ItemProps = Omit<ItemParams, 'content'> & Methods & {
17
18
  id: string;
18
19
  visible: boolean;
20
+ content?: ReactNode | (() => ReactNode);
19
21
  };
20
22
  export {};
@@ -27,6 +27,7 @@ export declare class Select extends Component<T.Props, T.State> {
27
27
  controlProps?: import("../Input/Input.types").ControlProps & import("../../types").ComponentType;
28
28
  checkAutofill?: boolean;
29
29
  scrollProps?: Partial<import("../Scroll/Scroll.types").Props>;
30
+ fitContentWidth?: boolean;
30
31
  } & import("react").RefAttributes<HTMLInputElement>>>;
31
32
  triggerInputRef: import("react").RefObject<HTMLDivElement>;
32
33
  contentRef: import("react").RefObject<HTMLDivElement>;
@@ -0,0 +1,5 @@
1
+ import React from 'react';
2
+ import { TextShimmerProps } from './TextShimmer.types';
3
+ declare function TextShimmerComponent({ children, as: Component, className, duration, spread, inverted, active, }: TextShimmerProps): JSX.Element;
4
+ export declare const TextShimmer: React.MemoExoticComponent<typeof TextShimmerComponent>;
5
+ export {};
@@ -0,0 +1,9 @@
1
+ import { type ComponentProps, type ReactNode } from 'react';
2
+ export interface TextShimmerProps extends ComponentProps<'p'> {
3
+ children: ReactNode;
4
+ as?: React.ElementType;
5
+ duration?: number;
6
+ spread?: number;
7
+ inverted?: boolean;
8
+ active?: boolean;
9
+ }
@@ -0,0 +1,2 @@
1
+ export { TextShimmer } from './TextShimmer';
2
+ export type { TextShimmerProps } from './TextShimmer.types';
@@ -44,6 +44,7 @@ export * from './Shimmer/Shimmer';
44
44
  export * from './Spinner/Spinner';
45
45
  export * from './Table/Table';
46
46
  export * from './Tabs/Tabs';
47
+ export * from './TextShimmer/TextShimmer';
47
48
  export * from './Tooltip/Tooltip';
48
49
  export * from './Text/Text';
49
50
  export * from './Theme/Theme';
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@homecode/ui",
3
- "version": "5.1.8",
3
+ "version": "5.1.10",
4
4
  "description": "React UI components library",
5
5
  "scripts": {
6
6
  "tests": "jest",