@epam/ai-dial-ui-kit 0.5.0-rc.62 → 0.5.0-rc.63
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/dial-ui-kit.es.js
CHANGED
|
@@ -48467,48 +48467,48 @@ function V8({
|
|
|
48467
48467
|
}
|
|
48468
48468
|
};
|
|
48469
48469
|
}
|
|
48470
|
-
const z8 = ({
|
|
48471
|
-
const
|
|
48472
|
-
refs: { containerRef:
|
|
48473
|
-
visibleActions:
|
|
48474
|
-
hiddenActions:
|
|
48470
|
+
const z8 = ({ getSelectionLabel: e, onClearSelection: t, actions: s, selectedCount: i }) => {
|
|
48471
|
+
const o = rC(), {
|
|
48472
|
+
refs: { containerRef: n, leftSectionRef: r, measureRef: a },
|
|
48473
|
+
visibleActions: l,
|
|
48474
|
+
hiddenActions: c
|
|
48475
48475
|
} = V8({
|
|
48476
48476
|
actions: s,
|
|
48477
48477
|
direction: Ai.Reverse,
|
|
48478
|
-
dependencies: [
|
|
48478
|
+
dependencies: [o],
|
|
48479
48479
|
actionsGap: G8,
|
|
48480
48480
|
containerPadding: B8
|
|
48481
|
-
});
|
|
48481
|
+
}), d = e(i);
|
|
48482
48482
|
return /* @__PURE__ */ z($e, { children: [
|
|
48483
48483
|
/* @__PURE__ */ C(
|
|
48484
48484
|
"div",
|
|
48485
48485
|
{
|
|
48486
|
-
ref:
|
|
48486
|
+
ref: a,
|
|
48487
48487
|
className: "absolute top-0 left-0 invisible pointer-events-none overflow-hidden whitespace-nowrap flex gap-3",
|
|
48488
|
-
children: s.map(({ key:
|
|
48488
|
+
children: s.map(({ key: u, icon: h, title: g }) => /* @__PURE__ */ C(
|
|
48489
48489
|
Te,
|
|
48490
48490
|
{
|
|
48491
|
-
iconBefore:
|
|
48492
|
-
label:
|
|
48491
|
+
iconBefore: h,
|
|
48492
|
+
label: g,
|
|
48493
48493
|
variant: Ae.Secondary,
|
|
48494
48494
|
hideTitleOnMobile: !0
|
|
48495
48495
|
},
|
|
48496
|
-
|
|
48496
|
+
u
|
|
48497
48497
|
))
|
|
48498
48498
|
}
|
|
48499
48499
|
),
|
|
48500
48500
|
/* @__PURE__ */ z(
|
|
48501
48501
|
"div",
|
|
48502
48502
|
{
|
|
48503
|
-
ref:
|
|
48503
|
+
ref: n,
|
|
48504
48504
|
className: "rounded bg-layer-0 p-2 flex justify-between items-center w-full",
|
|
48505
48505
|
role: "toolbar",
|
|
48506
48506
|
"aria-label": "File bulk actions",
|
|
48507
48507
|
children: [
|
|
48508
|
-
/* @__PURE__ */ C("div", { ref:
|
|
48508
|
+
/* @__PURE__ */ C("div", { ref: r, children: /* @__PURE__ */ C(
|
|
48509
48509
|
Te,
|
|
48510
48510
|
{
|
|
48511
|
-
label:
|
|
48511
|
+
label: d,
|
|
48512
48512
|
onClick: t,
|
|
48513
48513
|
textClassName: "text-accent-primary whitespace-nowrap",
|
|
48514
48514
|
variant: Ae.Tertiary,
|
|
@@ -48516,10 +48516,10 @@ const z8 = ({ selectionLabel: e, onClearSelection: t, actions: s }) => {
|
|
|
48516
48516
|
}
|
|
48517
48517
|
) }),
|
|
48518
48518
|
/* @__PURE__ */ z("div", { className: "flex flex-1 w-full gap-3 items-center justify-end", children: [
|
|
48519
|
-
|
|
48519
|
+
c.length > 0 && /* @__PURE__ */ C(
|
|
48520
48520
|
Nt,
|
|
48521
48521
|
{
|
|
48522
|
-
menu: { items:
|
|
48522
|
+
menu: { items: c },
|
|
48523
48523
|
allowedPlacements: ["bottom", "bottom-start"],
|
|
48524
48524
|
children: /* @__PURE__ */ C(
|
|
48525
48525
|
Te,
|
|
@@ -48536,18 +48536,18 @@ const z8 = ({ selectionLabel: e, onClearSelection: t, actions: s }) => {
|
|
|
48536
48536
|
)
|
|
48537
48537
|
}
|
|
48538
48538
|
),
|
|
48539
|
-
|
|
48539
|
+
l.map(({ key: u, icon: h, title: g, onClick: p, disabled: f }) => /* @__PURE__ */ C(
|
|
48540
48540
|
Te,
|
|
48541
48541
|
{
|
|
48542
48542
|
className: "!p-[9px]",
|
|
48543
|
-
iconBefore:
|
|
48544
|
-
label:
|
|
48543
|
+
iconBefore: h,
|
|
48544
|
+
label: g,
|
|
48545
48545
|
variant: Ae.Secondary,
|
|
48546
48546
|
hideTitleOnMobile: !0,
|
|
48547
|
-
disabled:
|
|
48548
|
-
onClick: (
|
|
48547
|
+
disabled: f,
|
|
48548
|
+
onClick: (m) => p?.({ key: u, domEvent: m })
|
|
48549
48549
|
},
|
|
48550
|
-
|
|
48550
|
+
u
|
|
48551
48551
|
))
|
|
48552
48552
|
] })
|
|
48553
48553
|
]
|
|
@@ -50408,7 +50408,8 @@ const J8 = ({
|
|
|
50408
50408
|
children: /* @__PURE__ */ C(
|
|
50409
50409
|
z8,
|
|
50410
50410
|
{
|
|
50411
|
-
|
|
50411
|
+
...l,
|
|
50412
|
+
selectedCount: w.size,
|
|
50412
50413
|
onClearSelection: y,
|
|
50413
50414
|
actions: pn
|
|
50414
50415
|
}
|
|
@@ -63,7 +63,7 @@ export type ToolbarOptions = Omit<DialFileManagerToolbarProps, 'areHiddenFilesVi
|
|
|
63
63
|
uploadArchive?: string;
|
|
64
64
|
};
|
|
65
65
|
};
|
|
66
|
-
export type BulkActionsToolbarOptions = Omit<DialFileManagerBulkActionsToolbarProps, 'onClearSelection' | 'actions'> & {
|
|
66
|
+
export type BulkActionsToolbarOptions = Omit<DialFileManagerBulkActionsToolbarProps, 'onClearSelection' | 'actions' | 'selectedCount'> & {
|
|
67
67
|
actionLabels?: {
|
|
68
68
|
[DialFileManagerActions.Duplicate]?: string;
|
|
69
69
|
[DialFileManagerActions.Copy]?: string;
|
|
@@ -4,9 +4,10 @@ export interface DialActionDropdownItem extends DropdownItem {
|
|
|
4
4
|
title: string;
|
|
5
5
|
}
|
|
6
6
|
export interface DialFileManagerBulkActionsToolbarProps {
|
|
7
|
-
|
|
7
|
+
getSelectionLabel: (selectedCount: number) => string;
|
|
8
8
|
onClearSelection: () => void;
|
|
9
9
|
actions: DialActionDropdownItem[];
|
|
10
|
+
selectedCount: number;
|
|
10
11
|
}
|
|
11
12
|
/**
|
|
12
13
|
* A responsive toolbar component displayed when files or items are selected
|
|
@@ -33,7 +34,7 @@ export interface DialFileManagerBulkActionsToolbarProps {
|
|
|
33
34
|
* @example
|
|
34
35
|
* ```tsx
|
|
35
36
|
* <DialFileManagerSelectionToolbar
|
|
36
|
-
*
|
|
37
|
+
* getSelectionLabel={(count) => `${count} files selected`}
|
|
37
38
|
* onClearSelection={() => console.log('Cleared')}
|
|
38
39
|
* actions={[
|
|
39
40
|
* { key: 'download', title: 'Download', icon: <IconDownload />, onClick: () => {} },
|
|
@@ -43,10 +44,11 @@ export interface DialFileManagerBulkActionsToolbarProps {
|
|
|
43
44
|
* ```
|
|
44
45
|
*
|
|
45
46
|
* @param {object} props
|
|
46
|
-
* @param {string} props.
|
|
47
|
+
* @param {() => string} props.getSelectionLabel - Function to get the label showing current selection status (e.g., "3 files selected").
|
|
47
48
|
* @param {() => void} props.onClearSelection - Callback invoked when the clear selection button is clicked.
|
|
48
49
|
* @param {DialActionDropdownItem[]} props.actions - List of available toolbar actions.
|
|
49
50
|
* Each action defines a title, icon, key, and optional click handler.
|
|
51
|
+
* @param {number} [props.selectedCount] - Count of currently selected items.
|
|
50
52
|
*
|
|
51
53
|
* @returns {JSX.Element} A responsive toolbar that adjusts visible actions based on available width.
|
|
52
54
|
*/
|