@homecode/ui 5.15.0 → 5.15.2

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
@@ -111,7 +111,7 @@ export { queryParams };
111
111
  export { useAwake } from './src/hooks/useAwake.js';
112
112
  export { useThrottle, useThrottleCallback } from './src/hooks/useThrottle.js';
113
113
  export { useDebounce, useDebounceCallback } from './src/hooks/useDebounce.js';
114
- import 'react';
114
+ export { useEvent } from './src/hooks/useEvent.js';
115
115
  export { useIsMounted } from './src/hooks/useIsMounted.js';
116
116
  export { useListKeyboardControl } from './src/hooks/useListKeyboardControl.js';
117
117
  export { useResizeObserver } from './src/hooks/useResizeObserver.js';
@@ -49,12 +49,12 @@ import '../../tools/queryParams.js';
49
49
  import '../Draggable/Draggable.styl.js';
50
50
  import '../DropZone/DropZone.styl.js';
51
51
  import '../Flex/Flex.styl.js';
52
- import '../Gap/Gap.styl.js';
53
52
  import '../FoldedLine/FoldedLine.styl.js';
54
53
  import '../FoldedLine/FoldedLineActionsContext.js';
55
54
  import '../Form/Form.styl.js';
56
55
  import '../Form/Validator.js';
57
56
  import '../Form/SubmitButtons/SubmitButtons.styl.js';
57
+ import '../Gap/Gap.styl.js';
58
58
  import '../ProgressCircular/ProgressCircular.styl.js';
59
59
  import '../Slider/Slider.styl.js';
60
60
  import '../VideoPlayer/VideoPlayer.styl.js';
@@ -2,7 +2,6 @@ import { jsxs, jsx } from 'react/jsx-runtime';
2
2
  import cn from 'classnames';
3
3
  import { useState, useRef, useCallback, useEffect } from 'react';
4
4
  import { Button } from '../Button/Button.js';
5
- import { Gap } from '../Gap/Gap.js';
6
5
  import { Icon } from '../Icon/Icon.js';
7
6
  import { Scroll } from '../Scroll/Scroll.js';
8
7
  import S from './FoldedLine.styl.js';
@@ -51,10 +50,10 @@ function FoldedLine({ trigger, children, defaultFolded = true, className, folded
51
50
  setFolded(true);
52
51
  }
53
52
  };
54
- return (jsxs("div", { className: cn(S.root, isFolded && S.folded, Boolean(children) && S.hasChildren, isClear && S.clear, className), onClick: handleClick, children: [jsxs("div", { ref: triggerRef, className: cn(Boolean(children) && S.triggerInteractive), children: [typeof trigger === 'function' ? trigger(isFolded) : trigger, jsx(Gap, {}), showChevron && jsx(Icon, { type: "chevronDown", className: S.chevron })] }), !isFolded && children && (jsx("div", { className: S.content, children: jsxs(FoldedLineActionsProvider, { registerAction: registerAction, children: [contentScrolling ? (jsx(Scroll, { y: true, size: "s", autoHide: true, className: S.scroll, innerClassName: S.scrollInner, offset: { y: { before: 4, after: 14 } }, onInnerRef: onScrollInnerRef, onScroll: onScrollInner, children: children })) : (jsx("div", { className: S.scrollInner, children: children })), jsxs("div", { className: S.actions, children: [Array.from(actions.values()), !hideFoldButton && (jsxs(Button, { size: "xs", onClick: e => {
53
+ return (jsxs("div", { className: cn(S.root, isFolded && S.folded, Boolean(children) && S.hasChildren, isClear && S.clear, className), onClick: handleClick, children: [jsxs("div", { ref: triggerRef, className: cn(Boolean(children) && S.triggerInteractive), children: [typeof trigger === 'function' ? trigger(isFolded) : trigger, showChevron && jsx(Icon, { type: "chevronDown", className: S.chevron })] }), !isFolded && children && (jsx("div", { className: S.content, children: jsxs(FoldedLineActionsProvider, { registerAction: registerAction, children: [contentScrolling ? (jsx(Scroll, { y: true, size: "s", autoHide: true, className: S.scroll, innerClassName: S.scrollInner, offset: { y: { before: 4, after: 14 } }, onInnerRef: onScrollInnerRef, onScroll: onScrollInner, children: children })) : (jsx("div", { className: S.scrollInner, children: children })), jsxs("div", { className: S.actions, children: [Array.from(actions.values()), !hideFoldButton && (jsxs(Button, { size: "xs", onClick: e => {
55
54
  e.stopPropagation();
56
55
  setFolded(true);
57
- }, children: [jsx(Icon, { type: "chevronUp", size: "s" }), "Fold"] }))] })] }) }))] }));
56
+ }, children: [jsx(Icon, { type: "chevronUp", size: "xs" }), "\u00A0Fold"] }))] })] }) }))] }));
58
57
  }
59
58
 
60
59
  export { FoldedLine };
@@ -1,6 +1,6 @@
1
1
  import styleInject from '../../../node_modules/style-inject/dist/style-inject.es.js';
2
2
 
3
- var css_248z = ".FoldedLine_root__lhi-1{border-radius:12px;display:flex;flex-direction:column;min-height:1rem;padding-left:calc(4px + var(--p-2));position:relative;transition:.1s ease-out;transition-property:border-radius,margin,background-color}.FoldedLine_root__lhi-1:before{background:var(--accent-color);border-radius:2px;bottom:2px;content:\"\";height:calc(100% - 4px);left:6px;opacity:.1;pointer-events:none;position:absolute;top:2px;width:4px}.FoldedLine_root__lhi-1:hover:before,.FoldedLine_root__lhi-1:not(.FoldedLine_folded__6zX8d):before{opacity:.7}.FoldedLine_root__lhi-1.FoldedLine_folded__6zX8d{border-radius:0;margin:0}.FoldedLine_root__lhi-1.FoldedLine_folded__6zX8d .FoldedLine_scroll__X7T5v{height:1em}.FoldedLine_root__lhi-1.FoldedLine_hasChildren__8hCZA.FoldedLine_folded__6zX8d{cursor:pointer}.FoldedLine_root__lhi-1.FoldedLine_hasChildren__8hCZA:not(.FoldedLine_folded__6zX8d) .FoldedLine_triggerInteractive__sCLnl{border-top-left-radius:inherit;border-top-right-radius:inherit}.FoldedLine_root__lhi-1.FoldedLine_clear__t47RA{border-radius:inherit;min-height:0;padding:0}.FoldedLine_root__lhi-1.FoldedLine_clear__t47RA:before{content:none}.FoldedLine_root__lhi-1.FoldedLine_clear__t47RA.FoldedLine_hasChildren__8hCZA{cursor:pointer}.FoldedLine_root__lhi-1.FoldedLine_clear__t47RA.FoldedLine_folded__6zX8d{-webkit-line-clamp:unset;-webkit-box-orient:unset;line-clamp:none;display:flex;overflow:visible;text-overflow:clip}.FoldedLine_root__lhi-1.FoldedLine_clear__t47RA .FoldedLine_triggerInteractive__sCLnl{opacity:1}.FoldedLine_chevron__zxu20{margin-right:var(--p-2);opacity:.3;transition:transform .1s ease-out,opacity .1s ease-out}.FoldedLine_root__lhi-1:hover .FoldedLine_chevron__zxu20{opacity:1}.FoldedLine_folded__6zX8d .FoldedLine_chevron__zxu20{transform:rotate(-90deg)}.FoldedLine_lineCompleted__sEfzm:before{background:var(--active-color)}.FoldedLine_lineInProgress__VcwjJ:before{animation:FoldedLine_foldedLinePulse__y-Dle 1.4s ease-in-out infinite}.FoldedLine_triggerInteractive__sCLnl{align-items:center;cursor:pointer;display:flex;gap:var(--p-1);opacity:.8;transition:background-color .1s ease-out}.FoldedLine_triggerInteractive__sCLnl:hover{opacity:1}.FoldedLine_triggerInteractive__sCLnl:hover:before{background-color:var(--accent-color-alpha-900)}.FoldedLine_header__gyQpI{cursor:pointer;height:100%;position:absolute;transition:opacity .1s ease-out;-webkit-user-select:none;-moz-user-select:none;user-select:none;width:100%;z-index:1}.FoldedLine_folded__6zX8d{-webkit-line-clamp:1;-webkit-box-orient:vertical;line-clamp:1;display:-webkit-box;overflow:hidden;text-overflow:ellipsis;transition:opacity .1s ease-out}.FoldedLine_folded__6zX8d:before{opacity:.4}.FoldedLine_folded__6zX8d .FoldedLine_scroll__X7T5v{max-height:1.5em}.FoldedLine_content__POIox{position:relative}.FoldedLine_scroll__X7T5v{max-height:50vh}.FoldedLine_scrollInner__1BGOP>div{-webkit-user-select:text;-moz-user-select:text;user-select:text}.FoldedLine_actions__SmF3b{align-items:center;bottom:0;display:flex;flex-shrink:0;flex-wrap:wrap;gap:var(--p-1);justify-content:flex-end;padding:0 var(--p-5) var(--p-3) var(--p-2);position:absolute;right:0}.FoldedLine_actions__SmF3b>button{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}@keyframes FoldedLine_foldedLinePulse__y-Dle{0%,to{background-color:var(--accent-color-alpha-400)}50%{background-color:var(--active-color)}}";
3
+ var css_248z = ".FoldedLine_root__lhi-1{border-radius:12px;display:flex;flex-direction:column;min-height:1rem;padding-left:calc(4px + var(--p-2));position:relative;transition:.1s ease-out;transition-property:border-radius,margin,background-color}.FoldedLine_root__lhi-1:before{background:var(--accent-color);border-radius:2px;bottom:2px;content:\"\";height:calc(100% - 4px);left:6px;opacity:.1;pointer-events:none;position:absolute;top:2px;width:4px}.FoldedLine_root__lhi-1:hover:before,.FoldedLine_root__lhi-1:not(.FoldedLine_folded__6zX8d):before{opacity:.7}.FoldedLine_root__lhi-1.FoldedLine_folded__6zX8d{border-radius:0;margin:0}.FoldedLine_root__lhi-1.FoldedLine_folded__6zX8d .FoldedLine_scroll__X7T5v{height:1em}.FoldedLine_root__lhi-1.FoldedLine_hasChildren__8hCZA.FoldedLine_folded__6zX8d{cursor:pointer}.FoldedLine_root__lhi-1.FoldedLine_hasChildren__8hCZA:not(.FoldedLine_folded__6zX8d) .FoldedLine_triggerInteractive__sCLnl{border-top-left-radius:inherit;border-top-right-radius:inherit}.FoldedLine_root__lhi-1.FoldedLine_clear__t47RA{border-radius:inherit;min-height:0;padding:0}.FoldedLine_root__lhi-1.FoldedLine_clear__t47RA:before{content:none}.FoldedLine_root__lhi-1.FoldedLine_clear__t47RA.FoldedLine_hasChildren__8hCZA{cursor:pointer}.FoldedLine_root__lhi-1.FoldedLine_clear__t47RA.FoldedLine_folded__6zX8d{-webkit-line-clamp:unset;-webkit-box-orient:unset;line-clamp:none;display:flex;overflow:visible;text-overflow:clip}.FoldedLine_root__lhi-1.FoldedLine_clear__t47RA .FoldedLine_triggerInteractive__sCLnl{opacity:1}.FoldedLine_chevron__zxu20{opacity:.3;position:absolute;right:var(--p-2);transition:transform .1s ease-out,opacity .1s ease-out}.FoldedLine_root__lhi-1:hover .FoldedLine_chevron__zxu20{opacity:1}.FoldedLine_folded__6zX8d .FoldedLine_chevron__zxu20{transform:rotate(-90deg)}.FoldedLine_lineCompleted__sEfzm:before{background:var(--active-color)}.FoldedLine_lineInProgress__VcwjJ:before{animation:FoldedLine_foldedLinePulse__y-Dle 1.4s ease-in-out infinite}.FoldedLine_triggerInteractive__sCLnl{align-items:center;cursor:pointer;display:flex;gap:var(--p-1);opacity:.8;padding-right:var(--p-6);transition:background-color .1s ease-out}.FoldedLine_triggerInteractive__sCLnl:hover{opacity:1}.FoldedLine_triggerInteractive__sCLnl:hover:before{background-color:var(--accent-color-alpha-900)}.FoldedLine_header__gyQpI{cursor:pointer;height:100%;position:absolute;transition:opacity .1s ease-out;-webkit-user-select:none;-moz-user-select:none;user-select:none;width:100%;z-index:1}.FoldedLine_folded__6zX8d{-webkit-line-clamp:1;-webkit-box-orient:vertical;line-clamp:1;display:-webkit-box;overflow:hidden;text-overflow:ellipsis;transition:opacity .1s ease-out}.FoldedLine_folded__6zX8d:before{opacity:.4}.FoldedLine_folded__6zX8d .FoldedLine_scroll__X7T5v{max-height:1.5em}.FoldedLine_content__POIox{position:relative}.FoldedLine_scroll__X7T5v{max-height:50vh}.FoldedLine_scrollInner__1BGOP>div{-webkit-user-select:text;-moz-user-select:text;user-select:text}.FoldedLine_actions__SmF3b{align-items:center;bottom:0;display:flex;flex-shrink:0;flex-wrap:wrap;gap:var(--p-1);justify-content:flex-end;padding:0 var(--p-5) var(--p-3) var(--p-2);position:absolute;right:0}.FoldedLine_actions__SmF3b>button{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}@keyframes FoldedLine_foldedLinePulse__y-Dle{0%,to{background-color:var(--accent-color-alpha-400)}50%{background-color:var(--active-color)}}";
4
4
  var S = {"root":"FoldedLine_root__lhi-1","folded":"FoldedLine_folded__6zX8d","scroll":"FoldedLine_scroll__X7T5v","hasChildren":"FoldedLine_hasChildren__8hCZA","triggerInteractive":"FoldedLine_triggerInteractive__sCLnl","clear":"FoldedLine_clear__t47RA","chevron":"FoldedLine_chevron__zxu20","lineCompleted":"FoldedLine_lineCompleted__sEfzm","lineInProgress":"FoldedLine_lineInProgress__VcwjJ","foldedLinePulse":"FoldedLine_foldedLinePulse__y-Dle","header":"FoldedLine_header__gyQpI","content":"FoldedLine_content__POIox","scrollInner":"FoldedLine_scrollInner__1BGOP","actions":"FoldedLine_actions__SmF3b"};
5
5
  styleInject(css_248z);
6
6
 
@@ -51,12 +51,12 @@ import '../Dialogue/Dialogue.js';
51
51
  import { Draggable } from '../Draggable/Draggable.js';
52
52
  import '../DropZone/DropZone.styl.js';
53
53
  import '../Flex/Flex.styl.js';
54
- import '../Gap/Gap.styl.js';
55
54
  import '../FoldedLine/FoldedLine.styl.js';
56
55
  import '../FoldedLine/FoldedLineActionsContext.js';
57
56
  import '../Form/Form.styl.js';
58
57
  import '../Form/Validator.js';
59
58
  import '../Form/SubmitButtons/SubmitButtons.styl.js';
59
+ import '../Gap/Gap.styl.js';
60
60
  import '../ProgressCircular/ProgressCircular.styl.js';
61
61
  import '../Slider/Slider.styl.js';
62
62
  import '../VideoPlayer/VideoPlayer.styl.js';
@@ -1,9 +1,9 @@
1
1
  import { jsx, jsxs } from 'react/jsx-runtime';
2
- import cn from 'classnames';
3
2
  import { useState, useEffect } from 'react';
4
3
  import { Icon } from '../Icon/Icon.js';
5
4
  import { Popup } from '../Popup/Popup.js';
6
5
  import S from './NestedMenu.styl.js';
6
+ import cn from 'classnames';
7
7
 
8
8
  const MOBILE_MQ = '(max-width: 720px)';
9
9
  const HOVER_MQ = '(hover: hover) and (pointer: fine)';
@@ -5,7 +5,7 @@ import Time from 'timen';
5
5
  import { isTouch } from '../../tools/dom.js';
6
6
  import { observe, unobserve } from '../../tools/resizeObserver.js';
7
7
  import S from './Scroll.styl.js';
8
- import useEvent from '../../hooks/useEvent.js';
8
+ import { useEvent } from '../../hooks/useEvent.js';
9
9
  import { useDebounce } from '../../hooks/useDebounce.js';
10
10
 
11
11
  const getEventCoords = e => ({
@@ -1,5 +1,5 @@
1
1
  import { useState, useRef, useCallback, useMemo, useEffect } from 'react';
2
- import useEvent from '../../hooks/useEvent.js';
2
+ import { useEvent } from '../../hooks/useEvent.js';
3
3
  import { idsKey, matchesSearch, isSelectable, mapById, toIds } from './Select.helpers.js';
4
4
 
5
5
  /**
@@ -14,7 +14,7 @@ import { Popup } from '../Popup/Popup.js';
14
14
  import { RequiredStar } from '../RequiredStar/RequiredStar.js';
15
15
  import { Scroll } from '../Scroll/Scroll.js';
16
16
  import { useThrottle } from '../../hooks/useThrottle.js';
17
- import useEvent from '../../hooks/useEvent.js';
17
+ import { useEvent } from '../../hooks/useEvent.js';
18
18
  import { generateUID } from '../../tools/uid.js';
19
19
  import { useSelectedIds, useSelectOptions, useSelectOpenState, useKeyboardNav } from './Select.hooks.js';
20
20
  import S from './Select.styl.js';
@@ -6,7 +6,7 @@ import { Icon } from '../Icon/Icon.js';
6
6
  import { Popup } from '../Popup/Popup.js';
7
7
  import { ProgressCircular } from '../ProgressCircular/ProgressCircular.js';
8
8
  import { Slider } from '../Slider/Slider.js';
9
- import useEvent from '../../hooks/useEvent.js';
9
+ import { useEvent } from '../../hooks/useEvent.js';
10
10
  import debounce from '../../tools/debounce.js';
11
11
  import S from './VideoPlayer.styl.js';
12
12
  import { TIME_PERSIST_DEBOUNCE_MS, saveStorage, formatTime, VOLUME_POPUP_HIDE_MS, clamp, leadingDebounce, isEditableTarget, loadStorage, getBufferedPercent, DOUBLE_TAP_MS, getStorageKey, timeToProgressPct, KEYBOARD_DEBOUNCE_MS, getSeekDelta, VOLUME_STEP } from './VideoPlayer.helpers.js';
@@ -24,4 +24,4 @@ function useEvent({ elem, event, callback, isActive = true, isCapture = false, }
24
24
  }, [isActive, elem, callback]);
25
25
  }
26
26
 
27
- export { useEvent as default };
27
+ export { useEvent as default, useEvent };
@@ -1,5 +1,5 @@
1
1
  import { useState, useCallback, useEffect } from 'react';
2
- import useEvent from './useEvent.js';
2
+ import { useEvent } from './useEvent.js';
3
3
 
4
4
  const useListKeyboardControl = ({ isActive, itemsCount, onSelect, }) => {
5
5
  const [focusedIndex, setFocusedIndex] = useState(-1);
@@ -6,4 +6,5 @@ export type UseEventParams = {
6
6
  isActive?: boolean;
7
7
  isCapture?: boolean;
8
8
  };
9
- export default function useEvent({ elem, event, callback, isActive, isCapture, }: UseEventParams): void;
9
+ export declare function useEvent({ elem, event, callback, isActive, isCapture, }: UseEventParams): void;
10
+ export default useEvent;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@homecode/ui",
3
- "version": "5.15.0",
3
+ "version": "5.15.2",
4
4
  "description": "React UI components library",
5
5
  "scripts": {
6
6
  "tests": "jest",