@andreyfedkovich/cozy-ui 0.10.1 → 1.0.4
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/CHANGELOG.md +15 -0
- package/README.md +13 -3
- package/dist-lib/index.d.ts +13 -15
- package/dist-lib/ui-library.cjs.js +8 -8
- package/dist-lib/ui-library.cjs.js.map +1 -1
- package/dist-lib/ui-library.es.js +4139 -4100
- package/dist-lib/ui-library.es.js.map +1 -1
- package/package.json +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,21 @@
|
|
|
3
3
|
Формат основан на [Keep a Changelog](https://keepachangelog.com/).
|
|
4
4
|
Версии соответствуют [Semantic Versioning](https://semver.org/) и git-тегам `v*`.
|
|
5
5
|
|
|
6
|
+
## 1.0.3 - 2026-07-09
|
|
7
|
+
|
|
8
|
+
- **feat:** `DialogSelect` — проп `excludeIds`; компонент передаёт его в `loadOptions` и перезапрашивает список при изменении исключений.
|
|
9
|
+
- **feat:** `TreeDialogSelect` — проп `resolveSelectedPath` для раскрытия дерева до выбранного значения при открытии диалога (с прокруткой к строке).
|
|
10
|
+
- **refactor:** `CommentFeed` и `ApprovalRoute` используют `excludeIds` prop вместо ручных обёрток `loadOptions`.
|
|
11
|
+
|
|
12
|
+
## 1.0.2 - 2026-07-09
|
|
13
|
+
|
|
14
|
+
- **feat:** `CommentFeed.recipientsSource` и `ApprovalRoute.loadApprovers` — опциональный параметр `excludeIds` для исключения уже выбранных сотрудников из списка в `DialogSelect`.
|
|
15
|
+
- **feat:** Экспорт типа `DialogSelectLoadOptionsParams`.
|
|
16
|
+
|
|
17
|
+
## 0.10.1 - 2026-07-08
|
|
18
|
+
|
|
19
|
+
- **fix:** `TreeDialogSelect` — при серверном поиске (`searchNodes`) скрывать ранее загруженные ветки, не входящие в результаты и цепочки предков.
|
|
20
|
+
|
|
6
21
|
## 0.10.0 - 2026-06-04
|
|
7
22
|
|
|
8
23
|
- **feat:** New `ShowErrorPolicy` presets — `draftFriendly`, `wizardStep`, `savedInvalid`, `onBlurOrSubmit`. Recommended for draft-friendly and wizard forms; legacy `default` unchanged (shows on `hasValue` alone).
|
package/README.md
CHANGED
|
@@ -665,19 +665,25 @@ Dialog-based picker for large datasets — search + paginated loading + multi-se
|
|
|
665
665
|
| `label` | `ReactNode` | Field label above the trigger. |
|
|
666
666
|
| `tooltipContent` | `ReactNode` | Help tooltip on the «?» icon next to the label. |
|
|
667
667
|
| `tooltipPopperClassName` | `string` | Extra class for the tooltip popper. |
|
|
668
|
+
| `excludeIds` | `string[]` | IDs to omit from the picker list (passed to `loadOptions`; filtering is done in your callback or API). |
|
|
668
669
|
|
|
669
670
|
```tsx
|
|
670
671
|
import { DialogSelect } from "@andreyfedkovich/cozy-ui";
|
|
671
672
|
|
|
673
|
+
const [reviewers, setReviewers] = useState<{ id: string; name: string }[]>([]);
|
|
674
|
+
|
|
672
675
|
<DialogSelect
|
|
673
676
|
title="Add reviewer"
|
|
674
677
|
placeholder="Choose a person"
|
|
675
|
-
|
|
676
|
-
|
|
678
|
+
excludeIds={reviewers.map((r) => r.id)}
|
|
679
|
+
loadOptions={async ({ search, page, pageSize, excludeIds }) => {
|
|
680
|
+
const res = await fetch(
|
|
681
|
+
`/api/people?q=${search}&page=${page}&size=${pageSize}&exclude=${excludeIds?.join(",") ?? ""}`,
|
|
682
|
+
);
|
|
677
683
|
const { items, total } = await res.json();
|
|
678
684
|
return { options: items.map((p) => ({ value: p.id, label: p.name })), total };
|
|
679
685
|
}}
|
|
680
|
-
onValueChange={(opt) =>
|
|
686
|
+
onValueChange={(opt) => setReviewers((prev) => [...prev, { id: String(opt.value), name: String(opt.label) }])}
|
|
681
687
|
/>;
|
|
682
688
|
```
|
|
683
689
|
|
|
@@ -690,6 +696,7 @@ Hierarchical picker with lazy-loaded branches and search.
|
|
|
690
696
|
| `label` | `ReactNode` | Field label above the trigger. |
|
|
691
697
|
| `tooltipContent` | `ReactNode` | Help tooltip on the «?» icon next to the label. |
|
|
692
698
|
| `tooltipPopperClassName` | `string` | Extra class for the tooltip popper. |
|
|
699
|
+
| `resolveSelectedPath` | `(value) => Promise<TreeSearchResult>` | Resolves the path to the current value when the dialog opens; expands the tree, highlights the row, and scrolls it into view. |
|
|
693
700
|
|
|
694
701
|
```tsx
|
|
695
702
|
import { TreeDialogSelect } from "@andreyfedkovich/cozy-ui";
|
|
@@ -701,6 +708,7 @@ import { TreeDialogSelect } from "@andreyfedkovich/cozy-ui";
|
|
|
701
708
|
nodes: await fetchChildren(parentId, search),
|
|
702
709
|
})}
|
|
703
710
|
searchNodes={async (search) => ({ matches: await searchTreeWithPath(search) })}
|
|
711
|
+
resolveSelectedPath={async (value) => ({ matches: await resolveTreePathById(value) })}
|
|
704
712
|
leafConfirmOnly
|
|
705
713
|
onValueChange={(node) => console.log(node)}
|
|
706
714
|
/>;
|
|
@@ -708,6 +716,8 @@ import { TreeDialogSelect } from "@andreyfedkovich/cozy-ui";
|
|
|
708
716
|
|
|
709
717
|
With **`leafConfirmOnly`**, the confirm button in the dialog stays disabled until a row is selected and that node’s `hasChildren` is not strictly `true` (only leaves can be confirmed). Omit the prop to allow confirming any selected node, including branches.
|
|
710
718
|
|
|
719
|
+
With **`resolveSelectedPath`**, reopening the dialog with an existing `value` expands the tree to that node, pre-selects it in the dialog, and scrolls the row into view. Works independently of `searchNodes`.
|
|
720
|
+
|
|
711
721
|
#### `InputCaption`
|
|
712
722
|
|
|
713
723
|
Small caption row under an input — supports neutral, error, and success tones.
|
package/dist-lib/index.d.ts
CHANGED
|
@@ -82,7 +82,7 @@ export declare interface ApprovalRouteProps {
|
|
|
82
82
|
title?: string;
|
|
83
83
|
eyebrow?: string;
|
|
84
84
|
className?: string;
|
|
85
|
-
loadApprovers?: (params:
|
|
85
|
+
loadApprovers?: (params: DialogSelectLoadOptionsParams) => Promise<LoadOptionsResult_2>;
|
|
86
86
|
onAddLevel?: (name: string) => void;
|
|
87
87
|
onRemoveLevel?: (levelId: string) => void;
|
|
88
88
|
onAddStage?: (levelId: string, name: string) => void;
|
|
@@ -340,11 +340,7 @@ export declare interface CommentFeedHandle {
|
|
|
340
340
|
export declare interface CommentFeedProps {
|
|
341
341
|
loadComments: (p: CommentLoadParams) => Promise<CommentLoadResult>;
|
|
342
342
|
currentUser: CommentAuthor;
|
|
343
|
-
recipientsSource?: (params: {
|
|
344
|
-
search: string;
|
|
345
|
-
page: number;
|
|
346
|
-
pageSize: number;
|
|
347
|
-
}) => Promise<{
|
|
343
|
+
recipientsSource?: (params: DialogSelectLoadOptionsParams) => Promise<{
|
|
348
344
|
options: CustomOption<CommentAuthor, string>[];
|
|
349
345
|
total?: number;
|
|
350
346
|
}>;
|
|
@@ -514,7 +510,7 @@ export declare interface DetailViewProps {
|
|
|
514
510
|
id?: string;
|
|
515
511
|
}
|
|
516
512
|
|
|
517
|
-
export declare const DialogSelect: <T, S extends string | number>({ value, placeholder, loadOptions, onValueChange, onChange, onBlur, onFocus, onClear, columns, label, tooltipContent, tooltipPopperClassName, title, searchPlaceholder, selectButtonText, closeButtonText, manualButtonText, onManualAdd, pageSize, debounceMs, disabled, error, suppressError, fieldMeta, showErrorPolicy, className, inputClassName, selectedOptionRender, }: DialogSelectProps<T, S>) => JSX.Element;
|
|
513
|
+
export declare const DialogSelect: <T, S extends string | number>({ value, placeholder, loadOptions, excludeIds, onValueChange, onChange, onBlur, onFocus, onClear, columns, label, tooltipContent, tooltipPopperClassName, title, searchPlaceholder, selectButtonText, closeButtonText, manualButtonText, onManualAdd, pageSize, debounceMs, disabled, error, suppressError, fieldMeta, showErrorPolicy, className, inputClassName, selectedOptionRender, }: DialogSelectProps<T, S>) => JSX.Element;
|
|
518
514
|
|
|
519
515
|
export declare type DialogSelectColumn<T, S extends string | number> = {
|
|
520
516
|
key: string;
|
|
@@ -523,10 +519,16 @@ export declare type DialogSelectColumn<T, S extends string | number> = {
|
|
|
523
519
|
render: (option: CustomOption<T, S>) => ReactNode;
|
|
524
520
|
};
|
|
525
521
|
|
|
522
|
+
export declare type DialogSelectLoadOptionsParams = LoadOptionsParams & {
|
|
523
|
+
excludeIds?: string[];
|
|
524
|
+
};
|
|
525
|
+
|
|
526
526
|
export declare interface DialogSelectProps<T, S extends string | number> extends ValueFieldCallbacks<CustomOption<T, S>>, FieldValidationProps {
|
|
527
527
|
value?: CustomOption<T, S> | null;
|
|
528
528
|
placeholder: string;
|
|
529
|
-
loadOptions: (params:
|
|
529
|
+
loadOptions: (params: DialogSelectLoadOptionsParams) => Promise<LoadOptionsResult<T, S>>;
|
|
530
|
+
/** ID записей, которые не должны попадать в список выбора (передаются в loadOptions). */
|
|
531
|
+
excludeIds?: string[];
|
|
530
532
|
onClear?: () => void;
|
|
531
533
|
onBlur?: default_2.FocusEventHandler<HTMLDivElement>;
|
|
532
534
|
onFocus?: default_2.FocusEventHandler<HTMLDivElement>;
|
|
@@ -756,12 +758,6 @@ declare type LoadOptionsParams = {
|
|
|
756
758
|
pageSize: number;
|
|
757
759
|
};
|
|
758
760
|
|
|
759
|
-
declare type LoadOptionsParams_2 = {
|
|
760
|
-
search: string;
|
|
761
|
-
page: number;
|
|
762
|
-
pageSize: number;
|
|
763
|
-
};
|
|
764
|
-
|
|
765
761
|
declare type LoadOptionsResult<T, S extends string | number> = {
|
|
766
762
|
options: CustomOption<T, S>[];
|
|
767
763
|
total?: number;
|
|
@@ -1228,7 +1224,7 @@ export declare type TooltipTrigger = "hover" | "click";
|
|
|
1228
1224
|
/** `yyyy-MM-dd` for API / form state */
|
|
1229
1225
|
export declare const toYmdString: (d: Date) => string;
|
|
1230
1226
|
|
|
1231
|
-
export declare const TreeDialogSelect: <T, S extends string | number>({ value, placeholder, loadChildren: loadChildrenProp, loadNodes, searchNodes, onValueChange, onChange, onBlur, onFocus, onClear, label, tooltipContent, tooltipPopperClassName, title, searchPlaceholder, selectButtonText, closeButtonText, confirmButtonText, debounceMs, disabled, error, suppressError, fieldMeta, showErrorPolicy, className, inputClassName, selectedOptionRender, nodeRender, leafConfirmOnly, }: TreeDialogSelectProps<T, S>) => JSX.Element;
|
|
1227
|
+
export declare const TreeDialogSelect: <T, S extends string | number>({ value, placeholder, loadChildren: loadChildrenProp, loadNodes, searchNodes, resolveSelectedPath, onValueChange, onChange, onBlur, onFocus, onClear, label, tooltipContent, tooltipPopperClassName, title, searchPlaceholder, selectButtonText, closeButtonText, confirmButtonText, debounceMs, disabled, error, suppressError, fieldMeta, showErrorPolicy, className, inputClassName, selectedOptionRender, nodeRender, leafConfirmOnly, }: TreeDialogSelectProps<T, S>) => JSX.Element;
|
|
1232
1228
|
|
|
1233
1229
|
/** Pass either {@link loadNodes} or {@link loadChildren} (deprecated alias). */
|
|
1234
1230
|
export declare type TreeDialogSelectProps<T, S extends string | number> = TreeDialogSelectShared<T, S> & ({
|
|
@@ -1243,6 +1239,8 @@ declare interface TreeDialogSelectShared<T, S extends string | number> extends V
|
|
|
1243
1239
|
value?: TreeNode<T, S> | null;
|
|
1244
1240
|
placeholder: string;
|
|
1245
1241
|
searchNodes?: (search: string) => Promise<TreeSearchResult<T, S>>;
|
|
1242
|
+
/** Resolves the path to the currently selected value when the dialog opens. */
|
|
1243
|
+
resolveSelectedPath?: (value: S) => Promise<TreeSearchResult<T, S>>;
|
|
1246
1244
|
onClear?: () => void;
|
|
1247
1245
|
onBlur?: default_2.FocusEventHandler<HTMLDivElement>;
|
|
1248
1246
|
onFocus?: default_2.FocusEventHandler<HTMLDivElement>;
|