@beweco/aurora-ui 0.1.27 → 0.1.28
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/assets/css/styles.css +1 -1
- package/dist/index.cjs.js +125 -14
- package/dist/index.esm.js +126 -16
- package/dist/types/components/accordion-list/AccordionList.d.ts +64 -0
- package/dist/types/components/accordion-list/AccordionList.d.ts.map +1 -0
- package/dist/types/components/accordion-list/AccordionList.types.d.ts +155 -0
- package/dist/types/components/accordion-list/AccordionList.types.d.ts.map +1 -0
- package/dist/types/components/accordion-list/index.d.ts +3 -0
- package/dist/types/components/accordion-list/index.d.ts.map +1 -0
- package/dist/types/index.d.ts +1 -0
- package/dist/types/index.d.ts.map +1 -1
- package/package.json +1 -1
package/dist/index.cjs.js
CHANGED
|
@@ -2,8 +2,8 @@
|
|
|
2
2
|
|
|
3
3
|
var react = require('@heroui/react');
|
|
4
4
|
var jsxRuntime = require('react/jsx-runtime');
|
|
5
|
-
var React = require('react');
|
|
6
5
|
var react$1 = require('@iconify/react');
|
|
6
|
+
var React = require('react');
|
|
7
7
|
var recharts = require('recharts');
|
|
8
8
|
var framerMotion = require('framer-motion');
|
|
9
9
|
var reactDom = require('react-dom');
|
|
@@ -102,6 +102,129 @@ typeof SuppressedError === "function" ? SuppressedError : function (error, suppr
|
|
|
102
102
|
return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
|
|
103
103
|
};
|
|
104
104
|
|
|
105
|
+
var sizeMap = {
|
|
106
|
+
sm: "16px",
|
|
107
|
+
md: "20px",
|
|
108
|
+
lg: "24px",
|
|
109
|
+
xl: "32px",
|
|
110
|
+
};
|
|
111
|
+
var IconComponent = function (_a) {
|
|
112
|
+
var _b;
|
|
113
|
+
var icon = _a.icon, _c = _a.size, size = _c === void 0 ? "md" : _c, className = _a.className, style = _a.style, color = _a.color, hFlip = _a.hFlip, vFlip = _a.vFlip, flip = _a.flip, rotate = _a.rotate, nativeProps = __rest(_a, ["icon", "size", "className", "style", "color", "hFlip", "vFlip", "flip", "rotate"]);
|
|
114
|
+
var iconSize = (_b = sizeMap[size]) !== null && _b !== void 0 ? _b : sizeMap.md;
|
|
115
|
+
return (jsxRuntime.jsx("span", __assign({}, nativeProps, { children: jsxRuntime.jsx(react$1.Icon, { icon: icon, width: iconSize, height: iconSize, className: className, style: style, color: color, hFlip: hFlip, vFlip: vFlip, flip: flip, rotate: rotate }) })));
|
|
116
|
+
};
|
|
117
|
+
|
|
118
|
+
/**
|
|
119
|
+
* AccordionList - A flexible component for displaying lists of items
|
|
120
|
+
* Supports two modes:
|
|
121
|
+
* - accordion: Expandable items with collapsible content
|
|
122
|
+
* - list: Flat list of items (similar to client notes/communications)
|
|
123
|
+
*
|
|
124
|
+
* **IMPORTANTE - Paginación:**
|
|
125
|
+
* Este componente NO maneja paginación internamente. El padre debe:
|
|
126
|
+
* 1. Pasar solo items de la página actual (ej: 20-30 items)
|
|
127
|
+
* 2. Calcular totalPages basado en total de registros del backend
|
|
128
|
+
* 3. Manejar onPageChange para fetch de nuevos datos
|
|
129
|
+
*
|
|
130
|
+
* @example
|
|
131
|
+
* ```tsx
|
|
132
|
+
* // Accordion mode (Social Networks - Proposed Content)
|
|
133
|
+
* <AccordionList
|
|
134
|
+
* mode="accordion"
|
|
135
|
+
* items={contents}
|
|
136
|
+
* header={{
|
|
137
|
+
* getTitle: (item) => item.title,
|
|
138
|
+
* getMetadata: (item) => [
|
|
139
|
+
* { key: "type", label: item.type, color: "primary" }
|
|
140
|
+
* ]
|
|
141
|
+
* }}
|
|
142
|
+
* content={{
|
|
143
|
+
* render: (item) => <div>{item.description}</div>
|
|
144
|
+
* }}
|
|
145
|
+
* actions={[
|
|
146
|
+
* { key: "edit", icon: "solar:pen-outline", onPress: handleEdit },
|
|
147
|
+
* { key: "delete", icon: "solar:trash-bin-minimalistic-outline", onPress: handleDelete, color: "danger" }
|
|
148
|
+
* ]}
|
|
149
|
+
* />
|
|
150
|
+
*
|
|
151
|
+
* // List mode (Clients - Notes History)
|
|
152
|
+
* <AccordionList
|
|
153
|
+
* mode="list"
|
|
154
|
+
* items={notes}
|
|
155
|
+
* header={{
|
|
156
|
+
* getTitle: (item) => item.title,
|
|
157
|
+
* getSubtitle: (item) => item.description
|
|
158
|
+
* }}
|
|
159
|
+
* actions={[
|
|
160
|
+
* { key: "edit", icon: "solar:pen-outline", onPress: handleEdit },
|
|
161
|
+
* { key: "delete", icon: "solar:trash-bin-minimalistic-outline", onPress: handleDelete, color: "danger" }
|
|
162
|
+
* ]}
|
|
163
|
+
* />
|
|
164
|
+
*
|
|
165
|
+
* // With pagination (controlled by parent)
|
|
166
|
+
* <AccordionList
|
|
167
|
+
* items={currentPageItems} // Only items of current page
|
|
168
|
+
* pagination={{
|
|
169
|
+
* currentPage: 1,
|
|
170
|
+
* totalPages: Math.ceil(totalRecords / pageSize), // Based on backend total
|
|
171
|
+
* onPageChange: (page) => fetchPage(page) // Parent fetches new data
|
|
172
|
+
* }}
|
|
173
|
+
* />
|
|
174
|
+
* ```
|
|
175
|
+
*/
|
|
176
|
+
function AccordionList(_a) {
|
|
177
|
+
var items = _a.items, header = _a.header, content = _a.content, _b = _a.actions, actions = _b === void 0 ? [] : _b, _c = _a.mode, mode = _c === void 0 ? "list" : _c, pagination = _a.pagination, _d = _a.isLoading, isLoading = _d === void 0 ? false : _d, emptyState = _a.emptyState, sectionTitle = _a.sectionTitle, sectionIcon = _a.sectionIcon, _e = _a.showCount, showCount = _e === void 0 ? true : _e, _f = _a.className, className = _f === void 0 ? "" : _f, _g = _a.accordionVariant, accordionVariant = _g === void 0 ? "splitted" : _g, _h = _a.selectionMode, selectionMode = _h === void 0 ? "multiple" : _h, _j = _a.disableIndicatorAnimation, disableIndicatorAnimation = _j === void 0 ? false : _j, loadingComponent = _a.loadingComponent, emptyStateComponent = _a.emptyStateComponent;
|
|
178
|
+
// Loading State
|
|
179
|
+
if (isLoading) {
|
|
180
|
+
if (loadingComponent) {
|
|
181
|
+
return jsxRuntime.jsx("div", { className: className, children: loadingComponent });
|
|
182
|
+
}
|
|
183
|
+
return (jsxRuntime.jsx("div", { className: "flex flex-col gap-3 ".concat(className), children: Array.from({ length: 3 }).map(function (_, index) { return (jsxRuntime.jsxs("div", { className: "p-4 border border-default-100 rounded-lg", children: [jsxRuntime.jsx(react.Skeleton, { className: "h-4 w-3/4 mb-2" }), jsxRuntime.jsx(react.Skeleton, { className: "h-3 w-full mb-2" }), jsxRuntime.jsx(react.Skeleton, { className: "h-3 w-2/3" })] }, "skeleton-".concat(index))); }) }));
|
|
184
|
+
}
|
|
185
|
+
// Empty State
|
|
186
|
+
if (items.length === 0) {
|
|
187
|
+
if (emptyStateComponent) {
|
|
188
|
+
return jsxRuntime.jsx("div", { className: className, children: emptyStateComponent });
|
|
189
|
+
}
|
|
190
|
+
if (emptyState) {
|
|
191
|
+
return (jsxRuntime.jsxs("div", { className: "flex flex-col items-center justify-center py-12 ".concat(className), children: [jsxRuntime.jsx(IconComponent, { icon: emptyState.icon, className: "w-16 h-16 text-default-300 mb-4" }), jsxRuntime.jsx("h3", { className: "text-lg font-semibold text-default-900 mb-2", children: emptyState.title }), emptyState.description && (jsxRuntime.jsx("p", { className: "text-sm text-default-500 mb-4 text-center max-w-md", children: emptyState.description })), emptyState.actionText && emptyState.onAction && (jsxRuntime.jsx(react.Button, { color: "primary", onPress: emptyState.onAction, children: emptyState.actionText }))] }));
|
|
192
|
+
}
|
|
193
|
+
return null;
|
|
194
|
+
}
|
|
195
|
+
// Render Actions
|
|
196
|
+
var renderActions = function (item) {
|
|
197
|
+
var visibleActions = actions.filter(function (action) {
|
|
198
|
+
if (action.show === undefined)
|
|
199
|
+
return true;
|
|
200
|
+
if (typeof action.show === "function")
|
|
201
|
+
return action.show(item);
|
|
202
|
+
return action.show;
|
|
203
|
+
});
|
|
204
|
+
return (jsxRuntime.jsx("div", { className: "flex items-center gap-1", onClick: function (e) { return e.stopPropagation(); }, children: visibleActions.map(function (action) { return (jsxRuntime.jsx(react.Button, { variant: "light", color: action.color || "default", size: "sm", isIconOnly: true, onPress: function () { return action.onPress(item); }, className: action.className, title: action.tooltip, children: jsxRuntime.jsx(IconComponent, { icon: action.icon, className: "w-4 h-4" }) }, action.key)); }) }));
|
|
205
|
+
};
|
|
206
|
+
// Render Metadata Chips
|
|
207
|
+
var renderMetadata = function (item) {
|
|
208
|
+
if (!header.getMetadata)
|
|
209
|
+
return null;
|
|
210
|
+
var metadata = header.getMetadata(item);
|
|
211
|
+
return (jsxRuntime.jsx("div", { className: "flex items-center gap-2 flex-wrap", children: metadata.map(function (meta) { return (jsxRuntime.jsx(react.Chip, { size: "sm", variant: meta.variant || "flat", color: meta.color || "default", className: "text-xs", startContent: meta.icon ? jsxRuntime.jsx(IconComponent, { icon: meta.icon, className: "w-3 h-3" }) : undefined, children: meta.label }, meta.key)); }) }));
|
|
212
|
+
};
|
|
213
|
+
// Accordion Mode
|
|
214
|
+
if (mode === "accordion") {
|
|
215
|
+
if (!content) {
|
|
216
|
+
console.warn("AccordionList: content prop is required for accordion mode");
|
|
217
|
+
return null;
|
|
218
|
+
}
|
|
219
|
+
return (jsxRuntime.jsxs("div", { className: "h-full w-full ".concat(className), children: [(sectionTitle || sectionIcon) && (jsxRuntime.jsx("div", { className: "mb-4 flex items-center justify-between", children: jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [sectionIcon && (jsxRuntime.jsx(IconComponent, { icon: sectionIcon, className: "w-5 h-5 text-violet-600 dark:text-violet-400" })), sectionTitle && (jsxRuntime.jsx("h3", { className: "text-base font-semibold text-foreground", children: sectionTitle })), showCount && (jsxRuntime.jsx(react.Chip, { size: "sm", variant: "flat", color: "secondary", children: items.length }))] }) })), jsxRuntime.jsx(react.Accordion, { variant: accordionVariant, selectionMode: selectionMode, disableIndicatorAnimation: disableIndicatorAnimation, children: items.map(function (item) { return (jsxRuntime.jsx(react.AccordionItem, { "aria-label": header.getTitle(item), indicator: jsxRuntime.jsx(IconComponent, { icon: "solar:alt-arrow-down-outline", className: "w-4 h-4 text-default-400 transition-transform duration-200 data-[open=true]:rotate-180" }), classNames: {
|
|
220
|
+
indicator: "data-[open=true]:rotate-180 transition-transform duration-200",
|
|
221
|
+
}, title: jsxRuntime.jsxs("div", { className: "flex items-center justify-between w-full pr-4", children: [jsxRuntime.jsx("div", { className: "flex items-center gap-3 flex-1 min-w-0", children: header.customRender ? (header.customRender(item)) : (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("span", { className: "text-sm text-default-900 truncate", children: header.getTitle(item) }), renderMetadata(item)] })) }), actions.length > 0 && renderActions(item)] }), children: jsxRuntime.jsx("div", { className: "pb-4", children: content.render(item) }) }, item.id)); }) }), pagination && pagination.totalPages > 1 && (jsxRuntime.jsx("div", { className: "flex justify-center mt-4", children: jsxRuntime.jsx(react.Pagination, { isCompact: pagination.isCompact, showControls: pagination.showControls, showShadow: true, color: "primary", page: pagination.currentPage, total: pagination.totalPages, onChange: pagination.onPageChange }) }))] }));
|
|
222
|
+
}
|
|
223
|
+
// List Mode
|
|
224
|
+
return (jsxRuntime.jsxs("div", { className: "flex flex-col gap-3 ".concat(className), children: [(sectionTitle || sectionIcon) && (jsxRuntime.jsx("div", { className: "mb-1 flex items-center justify-between", children: jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [sectionIcon && (jsxRuntime.jsx(IconComponent, { icon: sectionIcon, className: "w-5 h-5 text-primary-600 dark:text-primary-400" })), sectionTitle && (jsxRuntime.jsx("h3", { className: "text-base font-semibold text-foreground", children: sectionTitle })), showCount && (jsxRuntime.jsx(react.Chip, { size: "sm", variant: "flat", color: "primary", children: items.length }))] }) })), items.map(function (item) { return (jsxRuntime.jsxs("div", { className: "flex items-start justify-between p-4 border border-default-100 rounded-lg transition-colors bg-default-50 hover:bg-default-100", children: [jsxRuntime.jsx("div", { className: "flex-1 min-w-0", children: header.customRender ? (header.customRender(item)) : (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("div", { className: "flex items-center gap-2 mb-2", children: jsxRuntime.jsx("span", { className: "text-sm font-medium text-default-900 truncate", children: header.getTitle(item) }) }), header.getSubtitle && (jsxRuntime.jsx("p", { className: "text-sm text-default-700 line-clamp-2 leading-relaxed mb-2", children: header.getSubtitle(item) })), renderMetadata(item)] })) }), actions.length > 0 && (jsxRuntime.jsx("div", { className: "ml-4 flex-shrink-0", children: renderActions(item) }))] }, item.id)); }), pagination && pagination.totalPages > 1 && (jsxRuntime.jsx("div", { className: "flex justify-center mt-4", children: jsxRuntime.jsx(react.Pagination, { isCompact: pagination.isCompact, showControls: pagination.showControls, showShadow: true, color: "primary", page: pagination.currentPage, total: pagination.totalPages, onChange: pagination.onPageChange }) }))] }));
|
|
225
|
+
}
|
|
226
|
+
AccordionList.displayName = "AccordionList";
|
|
227
|
+
|
|
105
228
|
exports.HolidayType = void 0;
|
|
106
229
|
(function (HolidayType) {
|
|
107
230
|
HolidayType["SingleDay"] = "singleDay";
|
|
@@ -144,19 +267,6 @@ var DateRangePicker = function (_a) {
|
|
|
144
267
|
} }, props, { id: autoId })));
|
|
145
268
|
};
|
|
146
269
|
|
|
147
|
-
var sizeMap = {
|
|
148
|
-
sm: "16px",
|
|
149
|
-
md: "20px",
|
|
150
|
-
lg: "24px",
|
|
151
|
-
xl: "32px",
|
|
152
|
-
};
|
|
153
|
-
var IconComponent = function (_a) {
|
|
154
|
-
var _b;
|
|
155
|
-
var icon = _a.icon, _c = _a.size, size = _c === void 0 ? "md" : _c, className = _a.className, style = _a.style, color = _a.color, hFlip = _a.hFlip, vFlip = _a.vFlip, flip = _a.flip, rotate = _a.rotate, nativeProps = __rest(_a, ["icon", "size", "className", "style", "color", "hFlip", "vFlip", "flip", "rotate"]);
|
|
156
|
-
var iconSize = (_b = sizeMap[size]) !== null && _b !== void 0 ? _b : sizeMap.md;
|
|
157
|
-
return (jsxRuntime.jsx("span", __assign({}, nativeProps, { children: jsxRuntime.jsx(react$1.Icon, { icon: icon, width: iconSize, height: iconSize, className: className, style: style, color: color, hFlip: hFlip, vFlip: vFlip, flip: flip, rotate: rotate }) })));
|
|
158
|
-
};
|
|
159
|
-
|
|
160
270
|
/**
|
|
161
271
|
* Input genérico reutilizable basado en HeroUI siguiendo las reglas de diseño BeweOS.
|
|
162
272
|
*
|
|
@@ -4584,6 +4694,7 @@ Object.defineProperty(exports, "loadIcons", {
|
|
|
4584
4694
|
enumerable: true,
|
|
4585
4695
|
get: function () { return react$1.loadIcons; }
|
|
4586
4696
|
});
|
|
4697
|
+
exports.AccordionList = AccordionList;
|
|
4587
4698
|
exports.AddHolidayForm = AddHolidayForm;
|
|
4588
4699
|
exports.AnalyticsCard = AnalyticsCard;
|
|
4589
4700
|
exports.AuraAutocomplete = AuraAutocomplete;
|
package/dist/index.esm.js
CHANGED
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
import { Button as Button$1, DatePicker as DatePicker$1, DateRangePicker as DateRangePicker$1, Input as Input$1, RadioGroup, Radio, cn, Card as Card$1, Spacer, Tabs, Tab,
|
|
1
|
+
import { Skeleton, Button as Button$1, Chip as Chip$1, Accordion, AccordionItem, Pagination as Pagination$1, DatePicker as DatePicker$1, DateRangePicker as DateRangePicker$1, Input as Input$1, RadioGroup, Radio, cn, Card as Card$1, Spacer, Tabs, Tab, Dropdown, DropdownTrigger, DropdownMenu, DropdownItem, Autocomplete, Breadcrumbs, BreadcrumbItem, DropdownSection, ListboxItem, Popover, PopoverTrigger, Tooltip as Tooltip$1, PopoverContent, Listbox, ListboxSection, Avatar, CardBody, CardFooter, Link, Switch as Switch$1, TimeInput as TimeInput$1, Select as Select$1, Image as Image$1, Table, TableHeader, TableColumn, TableBody, TableRow, TableCell, Textarea as Textarea$1, Alert, Modal as Modal$1, ModalContent as ModalContent$1, ModalHeader as ModalHeader$1, ModalBody as ModalBody$1, Slider, ModalFooter as ModalFooter$1, Spinner, SelectItem, Drawer, DrawerContent, DrawerBody } from '@heroui/react';
|
|
2
2
|
export * from '@heroui/react';
|
|
3
3
|
export { Slider } from '@heroui/react';
|
|
4
4
|
import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
|
|
5
|
-
import React, { useId, useState, useCallback, useMemo, createContext, useContext, useEffect, createElement, useRef, useLayoutEffect } from 'react';
|
|
6
5
|
import { Icon } from '@iconify/react';
|
|
7
6
|
export { loadIcons } from '@iconify/react';
|
|
7
|
+
import React, { useId, useState, useCallback, useMemo, createContext, useContext, useEffect, createElement, useRef, useLayoutEffect } from 'react';
|
|
8
8
|
import { ResponsiveContainer, AreaChart, CartesianGrid, XAxis, Tooltip, Area } from 'recharts';
|
|
9
9
|
import { LazyMotion, domAnimation, m } from 'framer-motion';
|
|
10
10
|
import { createPortal } from 'react-dom';
|
|
@@ -103,6 +103,129 @@ typeof SuppressedError === "function" ? SuppressedError : function (error, suppr
|
|
|
103
103
|
return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
|
|
104
104
|
};
|
|
105
105
|
|
|
106
|
+
var sizeMap = {
|
|
107
|
+
sm: "16px",
|
|
108
|
+
md: "20px",
|
|
109
|
+
lg: "24px",
|
|
110
|
+
xl: "32px",
|
|
111
|
+
};
|
|
112
|
+
var IconComponent = function (_a) {
|
|
113
|
+
var _b;
|
|
114
|
+
var icon = _a.icon, _c = _a.size, size = _c === void 0 ? "md" : _c, className = _a.className, style = _a.style, color = _a.color, hFlip = _a.hFlip, vFlip = _a.vFlip, flip = _a.flip, rotate = _a.rotate, nativeProps = __rest(_a, ["icon", "size", "className", "style", "color", "hFlip", "vFlip", "flip", "rotate"]);
|
|
115
|
+
var iconSize = (_b = sizeMap[size]) !== null && _b !== void 0 ? _b : sizeMap.md;
|
|
116
|
+
return (jsx("span", __assign({}, nativeProps, { children: jsx(Icon, { icon: icon, width: iconSize, height: iconSize, className: className, style: style, color: color, hFlip: hFlip, vFlip: vFlip, flip: flip, rotate: rotate }) })));
|
|
117
|
+
};
|
|
118
|
+
|
|
119
|
+
/**
|
|
120
|
+
* AccordionList - A flexible component for displaying lists of items
|
|
121
|
+
* Supports two modes:
|
|
122
|
+
* - accordion: Expandable items with collapsible content
|
|
123
|
+
* - list: Flat list of items (similar to client notes/communications)
|
|
124
|
+
*
|
|
125
|
+
* **IMPORTANTE - Paginación:**
|
|
126
|
+
* Este componente NO maneja paginación internamente. El padre debe:
|
|
127
|
+
* 1. Pasar solo items de la página actual (ej: 20-30 items)
|
|
128
|
+
* 2. Calcular totalPages basado en total de registros del backend
|
|
129
|
+
* 3. Manejar onPageChange para fetch de nuevos datos
|
|
130
|
+
*
|
|
131
|
+
* @example
|
|
132
|
+
* ```tsx
|
|
133
|
+
* // Accordion mode (Social Networks - Proposed Content)
|
|
134
|
+
* <AccordionList
|
|
135
|
+
* mode="accordion"
|
|
136
|
+
* items={contents}
|
|
137
|
+
* header={{
|
|
138
|
+
* getTitle: (item) => item.title,
|
|
139
|
+
* getMetadata: (item) => [
|
|
140
|
+
* { key: "type", label: item.type, color: "primary" }
|
|
141
|
+
* ]
|
|
142
|
+
* }}
|
|
143
|
+
* content={{
|
|
144
|
+
* render: (item) => <div>{item.description}</div>
|
|
145
|
+
* }}
|
|
146
|
+
* actions={[
|
|
147
|
+
* { key: "edit", icon: "solar:pen-outline", onPress: handleEdit },
|
|
148
|
+
* { key: "delete", icon: "solar:trash-bin-minimalistic-outline", onPress: handleDelete, color: "danger" }
|
|
149
|
+
* ]}
|
|
150
|
+
* />
|
|
151
|
+
*
|
|
152
|
+
* // List mode (Clients - Notes History)
|
|
153
|
+
* <AccordionList
|
|
154
|
+
* mode="list"
|
|
155
|
+
* items={notes}
|
|
156
|
+
* header={{
|
|
157
|
+
* getTitle: (item) => item.title,
|
|
158
|
+
* getSubtitle: (item) => item.description
|
|
159
|
+
* }}
|
|
160
|
+
* actions={[
|
|
161
|
+
* { key: "edit", icon: "solar:pen-outline", onPress: handleEdit },
|
|
162
|
+
* { key: "delete", icon: "solar:trash-bin-minimalistic-outline", onPress: handleDelete, color: "danger" }
|
|
163
|
+
* ]}
|
|
164
|
+
* />
|
|
165
|
+
*
|
|
166
|
+
* // With pagination (controlled by parent)
|
|
167
|
+
* <AccordionList
|
|
168
|
+
* items={currentPageItems} // Only items of current page
|
|
169
|
+
* pagination={{
|
|
170
|
+
* currentPage: 1,
|
|
171
|
+
* totalPages: Math.ceil(totalRecords / pageSize), // Based on backend total
|
|
172
|
+
* onPageChange: (page) => fetchPage(page) // Parent fetches new data
|
|
173
|
+
* }}
|
|
174
|
+
* />
|
|
175
|
+
* ```
|
|
176
|
+
*/
|
|
177
|
+
function AccordionList(_a) {
|
|
178
|
+
var items = _a.items, header = _a.header, content = _a.content, _b = _a.actions, actions = _b === void 0 ? [] : _b, _c = _a.mode, mode = _c === void 0 ? "list" : _c, pagination = _a.pagination, _d = _a.isLoading, isLoading = _d === void 0 ? false : _d, emptyState = _a.emptyState, sectionTitle = _a.sectionTitle, sectionIcon = _a.sectionIcon, _e = _a.showCount, showCount = _e === void 0 ? true : _e, _f = _a.className, className = _f === void 0 ? "" : _f, _g = _a.accordionVariant, accordionVariant = _g === void 0 ? "splitted" : _g, _h = _a.selectionMode, selectionMode = _h === void 0 ? "multiple" : _h, _j = _a.disableIndicatorAnimation, disableIndicatorAnimation = _j === void 0 ? false : _j, loadingComponent = _a.loadingComponent, emptyStateComponent = _a.emptyStateComponent;
|
|
179
|
+
// Loading State
|
|
180
|
+
if (isLoading) {
|
|
181
|
+
if (loadingComponent) {
|
|
182
|
+
return jsx("div", { className: className, children: loadingComponent });
|
|
183
|
+
}
|
|
184
|
+
return (jsx("div", { className: "flex flex-col gap-3 ".concat(className), children: Array.from({ length: 3 }).map(function (_, index) { return (jsxs("div", { className: "p-4 border border-default-100 rounded-lg", children: [jsx(Skeleton, { className: "h-4 w-3/4 mb-2" }), jsx(Skeleton, { className: "h-3 w-full mb-2" }), jsx(Skeleton, { className: "h-3 w-2/3" })] }, "skeleton-".concat(index))); }) }));
|
|
185
|
+
}
|
|
186
|
+
// Empty State
|
|
187
|
+
if (items.length === 0) {
|
|
188
|
+
if (emptyStateComponent) {
|
|
189
|
+
return jsx("div", { className: className, children: emptyStateComponent });
|
|
190
|
+
}
|
|
191
|
+
if (emptyState) {
|
|
192
|
+
return (jsxs("div", { className: "flex flex-col items-center justify-center py-12 ".concat(className), children: [jsx(IconComponent, { icon: emptyState.icon, className: "w-16 h-16 text-default-300 mb-4" }), jsx("h3", { className: "text-lg font-semibold text-default-900 mb-2", children: emptyState.title }), emptyState.description && (jsx("p", { className: "text-sm text-default-500 mb-4 text-center max-w-md", children: emptyState.description })), emptyState.actionText && emptyState.onAction && (jsx(Button$1, { color: "primary", onPress: emptyState.onAction, children: emptyState.actionText }))] }));
|
|
193
|
+
}
|
|
194
|
+
return null;
|
|
195
|
+
}
|
|
196
|
+
// Render Actions
|
|
197
|
+
var renderActions = function (item) {
|
|
198
|
+
var visibleActions = actions.filter(function (action) {
|
|
199
|
+
if (action.show === undefined)
|
|
200
|
+
return true;
|
|
201
|
+
if (typeof action.show === "function")
|
|
202
|
+
return action.show(item);
|
|
203
|
+
return action.show;
|
|
204
|
+
});
|
|
205
|
+
return (jsx("div", { className: "flex items-center gap-1", onClick: function (e) { return e.stopPropagation(); }, children: visibleActions.map(function (action) { return (jsx(Button$1, { variant: "light", color: action.color || "default", size: "sm", isIconOnly: true, onPress: function () { return action.onPress(item); }, className: action.className, title: action.tooltip, children: jsx(IconComponent, { icon: action.icon, className: "w-4 h-4" }) }, action.key)); }) }));
|
|
206
|
+
};
|
|
207
|
+
// Render Metadata Chips
|
|
208
|
+
var renderMetadata = function (item) {
|
|
209
|
+
if (!header.getMetadata)
|
|
210
|
+
return null;
|
|
211
|
+
var metadata = header.getMetadata(item);
|
|
212
|
+
return (jsx("div", { className: "flex items-center gap-2 flex-wrap", children: metadata.map(function (meta) { return (jsx(Chip$1, { size: "sm", variant: meta.variant || "flat", color: meta.color || "default", className: "text-xs", startContent: meta.icon ? jsx(IconComponent, { icon: meta.icon, className: "w-3 h-3" }) : undefined, children: meta.label }, meta.key)); }) }));
|
|
213
|
+
};
|
|
214
|
+
// Accordion Mode
|
|
215
|
+
if (mode === "accordion") {
|
|
216
|
+
if (!content) {
|
|
217
|
+
console.warn("AccordionList: content prop is required for accordion mode");
|
|
218
|
+
return null;
|
|
219
|
+
}
|
|
220
|
+
return (jsxs("div", { className: "h-full w-full ".concat(className), children: [(sectionTitle || sectionIcon) && (jsx("div", { className: "mb-4 flex items-center justify-between", children: jsxs("div", { className: "flex items-center gap-2", children: [sectionIcon && (jsx(IconComponent, { icon: sectionIcon, className: "w-5 h-5 text-violet-600 dark:text-violet-400" })), sectionTitle && (jsx("h3", { className: "text-base font-semibold text-foreground", children: sectionTitle })), showCount && (jsx(Chip$1, { size: "sm", variant: "flat", color: "secondary", children: items.length }))] }) })), jsx(Accordion, { variant: accordionVariant, selectionMode: selectionMode, disableIndicatorAnimation: disableIndicatorAnimation, children: items.map(function (item) { return (jsx(AccordionItem, { "aria-label": header.getTitle(item), indicator: jsx(IconComponent, { icon: "solar:alt-arrow-down-outline", className: "w-4 h-4 text-default-400 transition-transform duration-200 data-[open=true]:rotate-180" }), classNames: {
|
|
221
|
+
indicator: "data-[open=true]:rotate-180 transition-transform duration-200",
|
|
222
|
+
}, title: jsxs("div", { className: "flex items-center justify-between w-full pr-4", children: [jsx("div", { className: "flex items-center gap-3 flex-1 min-w-0", children: header.customRender ? (header.customRender(item)) : (jsxs(Fragment, { children: [jsx("span", { className: "text-sm text-default-900 truncate", children: header.getTitle(item) }), renderMetadata(item)] })) }), actions.length > 0 && renderActions(item)] }), children: jsx("div", { className: "pb-4", children: content.render(item) }) }, item.id)); }) }), pagination && pagination.totalPages > 1 && (jsx("div", { className: "flex justify-center mt-4", children: jsx(Pagination$1, { isCompact: pagination.isCompact, showControls: pagination.showControls, showShadow: true, color: "primary", page: pagination.currentPage, total: pagination.totalPages, onChange: pagination.onPageChange }) }))] }));
|
|
223
|
+
}
|
|
224
|
+
// List Mode
|
|
225
|
+
return (jsxs("div", { className: "flex flex-col gap-3 ".concat(className), children: [(sectionTitle || sectionIcon) && (jsx("div", { className: "mb-1 flex items-center justify-between", children: jsxs("div", { className: "flex items-center gap-2", children: [sectionIcon && (jsx(IconComponent, { icon: sectionIcon, className: "w-5 h-5 text-primary-600 dark:text-primary-400" })), sectionTitle && (jsx("h3", { className: "text-base font-semibold text-foreground", children: sectionTitle })), showCount && (jsx(Chip$1, { size: "sm", variant: "flat", color: "primary", children: items.length }))] }) })), items.map(function (item) { return (jsxs("div", { className: "flex items-start justify-between p-4 border border-default-100 rounded-lg transition-colors bg-default-50 hover:bg-default-100", children: [jsx("div", { className: "flex-1 min-w-0", children: header.customRender ? (header.customRender(item)) : (jsxs(Fragment, { children: [jsx("div", { className: "flex items-center gap-2 mb-2", children: jsx("span", { className: "text-sm font-medium text-default-900 truncate", children: header.getTitle(item) }) }), header.getSubtitle && (jsx("p", { className: "text-sm text-default-700 line-clamp-2 leading-relaxed mb-2", children: header.getSubtitle(item) })), renderMetadata(item)] })) }), actions.length > 0 && (jsx("div", { className: "ml-4 flex-shrink-0", children: renderActions(item) }))] }, item.id)); }), pagination && pagination.totalPages > 1 && (jsx("div", { className: "flex justify-center mt-4", children: jsx(Pagination$1, { isCompact: pagination.isCompact, showControls: pagination.showControls, showShadow: true, color: "primary", page: pagination.currentPage, total: pagination.totalPages, onChange: pagination.onPageChange }) }))] }));
|
|
226
|
+
}
|
|
227
|
+
AccordionList.displayName = "AccordionList";
|
|
228
|
+
|
|
106
229
|
var HolidayType;
|
|
107
230
|
(function (HolidayType) {
|
|
108
231
|
HolidayType["SingleDay"] = "singleDay";
|
|
@@ -145,19 +268,6 @@ var DateRangePicker = function (_a) {
|
|
|
145
268
|
} }, props, { id: autoId })));
|
|
146
269
|
};
|
|
147
270
|
|
|
148
|
-
var sizeMap = {
|
|
149
|
-
sm: "16px",
|
|
150
|
-
md: "20px",
|
|
151
|
-
lg: "24px",
|
|
152
|
-
xl: "32px",
|
|
153
|
-
};
|
|
154
|
-
var IconComponent = function (_a) {
|
|
155
|
-
var _b;
|
|
156
|
-
var icon = _a.icon, _c = _a.size, size = _c === void 0 ? "md" : _c, className = _a.className, style = _a.style, color = _a.color, hFlip = _a.hFlip, vFlip = _a.vFlip, flip = _a.flip, rotate = _a.rotate, nativeProps = __rest(_a, ["icon", "size", "className", "style", "color", "hFlip", "vFlip", "flip", "rotate"]);
|
|
157
|
-
var iconSize = (_b = sizeMap[size]) !== null && _b !== void 0 ? _b : sizeMap.md;
|
|
158
|
-
return (jsx("span", __assign({}, nativeProps, { children: jsx(Icon, { icon: icon, width: iconSize, height: iconSize, className: className, style: style, color: color, hFlip: hFlip, vFlip: vFlip, flip: flip, rotate: rotate }) })));
|
|
159
|
-
};
|
|
160
|
-
|
|
161
271
|
/**
|
|
162
272
|
* Input genérico reutilizable basado en HeroUI siguiendo las reglas de diseño BeweOS.
|
|
163
273
|
*
|
|
@@ -4577,4 +4687,4 @@ var NavigationLoadingProvider = function (_a) {
|
|
|
4577
4687
|
return (jsxs(NavigationLoadingContext.Provider, { value: value, children: [children, jsx(NavigationLoadingOverlay, { isVisible: isVisible })] }));
|
|
4578
4688
|
};
|
|
4579
4689
|
|
|
4580
|
-
export { AddHolidayForm, AnalyticsCard, AuraAutocomplete, AuraTable, AuraToastProvider, BreadcrumbsComponent, Button, Card, Chip, ColorSelector, ContentCarousel, DatePicker, DateRangePicker, DateSelector, DrawerFilters, GlobalToast, H1, H2, H3, H4, HeaderComponent, HolidayType, IconComponent, ImagePreview, Input, MenuComponent, Modal, ModalBody, ModalContent, ModalFooter, ModalHeader, MultiStepWizard, NavigationLoadingContext, NavigationLoadingOverlay, NavigationLoadingProvider, P, Pagination, Phone, PromotionalBanner, RangeFilter, RowSteps, ScheduleRow, SearchInput, Select, SocialMediaBar, SocialMediaCarousel, SocialMediaPreview, StepIndicator, Switch as SwitchComponent, Textarea, ThemeContext, ThemePicker, ThemeProvider, TimeInput as TimeInputComponent, ToastContext, UploadFile, VerticalSteps, Wizard, WizardNavigation, WizardSidebar, defaultTranslations$4 as defaultTranslations, sizeMap, themeColors, useAuraToast, useNavigationLoading, useThemeContext };
|
|
4690
|
+
export { AccordionList, AddHolidayForm, AnalyticsCard, AuraAutocomplete, AuraTable, AuraToastProvider, BreadcrumbsComponent, Button, Card, Chip, ColorSelector, ContentCarousel, DatePicker, DateRangePicker, DateSelector, DrawerFilters, GlobalToast, H1, H2, H3, H4, HeaderComponent, HolidayType, IconComponent, ImagePreview, Input, MenuComponent, Modal, ModalBody, ModalContent, ModalFooter, ModalHeader, MultiStepWizard, NavigationLoadingContext, NavigationLoadingOverlay, NavigationLoadingProvider, P, Pagination, Phone, PromotionalBanner, RangeFilter, RowSteps, ScheduleRow, SearchInput, Select, SocialMediaBar, SocialMediaCarousel, SocialMediaPreview, StepIndicator, Switch as SwitchComponent, Textarea, ThemeContext, ThemePicker, ThemeProvider, TimeInput as TimeInputComponent, ToastContext, UploadFile, VerticalSteps, Wizard, WizardNavigation, WizardSidebar, defaultTranslations$4 as defaultTranslations, sizeMap, themeColors, useAuraToast, useNavigationLoading, useThemeContext };
|
|
@@ -0,0 +1,64 @@
|
|
|
1
|
+
import type { AccordionListProps, BaseAccordionItem } from "./AccordionList.types";
|
|
2
|
+
/**
|
|
3
|
+
* AccordionList - A flexible component for displaying lists of items
|
|
4
|
+
* Supports two modes:
|
|
5
|
+
* - accordion: Expandable items with collapsible content
|
|
6
|
+
* - list: Flat list of items (similar to client notes/communications)
|
|
7
|
+
*
|
|
8
|
+
* **IMPORTANTE - Paginación:**
|
|
9
|
+
* Este componente NO maneja paginación internamente. El padre debe:
|
|
10
|
+
* 1. Pasar solo items de la página actual (ej: 20-30 items)
|
|
11
|
+
* 2. Calcular totalPages basado en total de registros del backend
|
|
12
|
+
* 3. Manejar onPageChange para fetch de nuevos datos
|
|
13
|
+
*
|
|
14
|
+
* @example
|
|
15
|
+
* ```tsx
|
|
16
|
+
* // Accordion mode (Social Networks - Proposed Content)
|
|
17
|
+
* <AccordionList
|
|
18
|
+
* mode="accordion"
|
|
19
|
+
* items={contents}
|
|
20
|
+
* header={{
|
|
21
|
+
* getTitle: (item) => item.title,
|
|
22
|
+
* getMetadata: (item) => [
|
|
23
|
+
* { key: "type", label: item.type, color: "primary" }
|
|
24
|
+
* ]
|
|
25
|
+
* }}
|
|
26
|
+
* content={{
|
|
27
|
+
* render: (item) => <div>{item.description}</div>
|
|
28
|
+
* }}
|
|
29
|
+
* actions={[
|
|
30
|
+
* { key: "edit", icon: "solar:pen-outline", onPress: handleEdit },
|
|
31
|
+
* { key: "delete", icon: "solar:trash-bin-minimalistic-outline", onPress: handleDelete, color: "danger" }
|
|
32
|
+
* ]}
|
|
33
|
+
* />
|
|
34
|
+
*
|
|
35
|
+
* // List mode (Clients - Notes History)
|
|
36
|
+
* <AccordionList
|
|
37
|
+
* mode="list"
|
|
38
|
+
* items={notes}
|
|
39
|
+
* header={{
|
|
40
|
+
* getTitle: (item) => item.title,
|
|
41
|
+
* getSubtitle: (item) => item.description
|
|
42
|
+
* }}
|
|
43
|
+
* actions={[
|
|
44
|
+
* { key: "edit", icon: "solar:pen-outline", onPress: handleEdit },
|
|
45
|
+
* { key: "delete", icon: "solar:trash-bin-minimalistic-outline", onPress: handleDelete, color: "danger" }
|
|
46
|
+
* ]}
|
|
47
|
+
* />
|
|
48
|
+
*
|
|
49
|
+
* // With pagination (controlled by parent)
|
|
50
|
+
* <AccordionList
|
|
51
|
+
* items={currentPageItems} // Only items of current page
|
|
52
|
+
* pagination={{
|
|
53
|
+
* currentPage: 1,
|
|
54
|
+
* totalPages: Math.ceil(totalRecords / pageSize), // Based on backend total
|
|
55
|
+
* onPageChange: (page) => fetchPage(page) // Parent fetches new data
|
|
56
|
+
* }}
|
|
57
|
+
* />
|
|
58
|
+
* ```
|
|
59
|
+
*/
|
|
60
|
+
export declare function AccordionList<T extends BaseAccordionItem = BaseAccordionItem>({ items, header, content, actions, mode, pagination, isLoading, emptyState, sectionTitle, sectionIcon, showCount, className, accordionVariant, selectionMode, disableIndicatorAnimation, loadingComponent, emptyStateComponent, }: AccordionListProps<T>): import("react/jsx-runtime").JSX.Element | null;
|
|
61
|
+
export declare namespace AccordionList {
|
|
62
|
+
var displayName: string;
|
|
63
|
+
}
|
|
64
|
+
//# sourceMappingURL=AccordionList.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"AccordionList.d.ts","sourceRoot":"","sources":["../../../../src/components/accordion-list/AccordionList.tsx"],"names":[],"mappings":"AAUA,OAAO,KAAK,EACX,kBAAkB,EAClB,iBAAiB,EAEjB,MAAM,uBAAuB,CAAC;AAE/B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAyDG;AACH,wBAAgB,aAAa,CAAC,CAAC,SAAS,iBAAiB,GAAG,iBAAiB,EAAE,EAC9E,KAAK,EACL,MAAM,EACN,OAAO,EACP,OAAY,EACZ,IAAa,EACb,UAAU,EACV,SAAiB,EACjB,UAAU,EACV,YAAY,EACZ,WAAW,EACX,SAAgB,EAChB,SAAc,EACd,gBAA6B,EAC7B,aAA0B,EAC1B,yBAAiC,EACjC,gBAAgB,EAChB,mBAAmB,GACnB,EAAE,kBAAkB,CAAC,CAAC,CAAC,kDA8QvB;yBAhSe,aAAa"}
|
|
@@ -0,0 +1,155 @@
|
|
|
1
|
+
import type { ReactNode } from "react";
|
|
2
|
+
/**
|
|
3
|
+
* Base item interface that all items must extend
|
|
4
|
+
*/
|
|
5
|
+
export interface BaseAccordionItem {
|
|
6
|
+
id: string;
|
|
7
|
+
[key: string]: unknown;
|
|
8
|
+
}
|
|
9
|
+
/**
|
|
10
|
+
* Action button configuration
|
|
11
|
+
*/
|
|
12
|
+
export interface AccordionItemAction<T = BaseAccordionItem> {
|
|
13
|
+
/** Unique identifier for the action */
|
|
14
|
+
key: string;
|
|
15
|
+
/** Icon identifier (from Iconify) */
|
|
16
|
+
icon: string;
|
|
17
|
+
/** Tooltip text for the action */
|
|
18
|
+
tooltip?: string;
|
|
19
|
+
/** Color variant for the button */
|
|
20
|
+
color?: "default" | "primary" | "secondary" | "success" | "warning" | "danger";
|
|
21
|
+
/** Callback when action is triggered */
|
|
22
|
+
onPress: (item: T) => void;
|
|
23
|
+
/** Whether to show the action (defaults to true) */
|
|
24
|
+
show?: boolean | ((item: T) => boolean);
|
|
25
|
+
/** Custom className for the button */
|
|
26
|
+
className?: string;
|
|
27
|
+
}
|
|
28
|
+
/**
|
|
29
|
+
* Metadata chip/badge configuration
|
|
30
|
+
*/
|
|
31
|
+
export interface AccordionItemMetadata {
|
|
32
|
+
/** Unique key for the metadata */
|
|
33
|
+
key: string;
|
|
34
|
+
/** Label to display */
|
|
35
|
+
label: string;
|
|
36
|
+
/** Color variant */
|
|
37
|
+
color?: "default" | "primary" | "secondary" | "success" | "warning" | "danger";
|
|
38
|
+
/** Variant style */
|
|
39
|
+
variant?: "solid" | "flat" | "bordered" | "light" | "faded";
|
|
40
|
+
/** Icon to show before label */
|
|
41
|
+
icon?: string;
|
|
42
|
+
}
|
|
43
|
+
/**
|
|
44
|
+
* Configuration for expandable content rendering
|
|
45
|
+
*/
|
|
46
|
+
export interface AccordionContentConfig<T = BaseAccordionItem> {
|
|
47
|
+
/** Custom render function for expanded content */
|
|
48
|
+
render: (item: T) => ReactNode;
|
|
49
|
+
}
|
|
50
|
+
/**
|
|
51
|
+
* Configuration for the header/title rendering
|
|
52
|
+
*/
|
|
53
|
+
export interface AccordionHeaderConfig<T = BaseAccordionItem> {
|
|
54
|
+
/** Main title extraction function */
|
|
55
|
+
getTitle: (item: T) => string;
|
|
56
|
+
/** Subtitle extraction function (optional) */
|
|
57
|
+
getSubtitle?: (item: T) => string;
|
|
58
|
+
/** Metadata chips to show in header */
|
|
59
|
+
getMetadata?: (item: T) => AccordionItemMetadata[];
|
|
60
|
+
/** Custom render for entire header (overrides default) */
|
|
61
|
+
customRender?: (item: T) => ReactNode;
|
|
62
|
+
}
|
|
63
|
+
/**
|
|
64
|
+
* Pagination configuration
|
|
65
|
+
*
|
|
66
|
+
* **IMPORTANTE**: Este componente NO maneja la paginación internamente.
|
|
67
|
+
* El componente padre debe:
|
|
68
|
+
* 1. Controlar qué items pasar (ej: solo 20-30 items de la página actual)
|
|
69
|
+
* 2. Calcular totalPages basado en el total de registros del backend
|
|
70
|
+
* 3. Manejar el cambio de página y fetch de nuevos datos
|
|
71
|
+
*
|
|
72
|
+
* @example
|
|
73
|
+
* ```tsx
|
|
74
|
+
* const totalItems = 150; // Total de registros en backend
|
|
75
|
+
* const itemsPerPage = 20;
|
|
76
|
+
* const totalPages = Math.ceil(totalItems / itemsPerPage); // = 8 páginas
|
|
77
|
+
*
|
|
78
|
+
* // El componente recibe SOLO los items de la página actual
|
|
79
|
+
* <AccordionList
|
|
80
|
+
* items={currentPageItems} // Solo 20 items
|
|
81
|
+
* pagination={{
|
|
82
|
+
* currentPage: 1,
|
|
83
|
+
* totalPages: 8, // Calculado con total de backend
|
|
84
|
+
* onPageChange: (page) => fetchPage(page)
|
|
85
|
+
* }}
|
|
86
|
+
* />
|
|
87
|
+
* ```
|
|
88
|
+
*/
|
|
89
|
+
export interface PaginationConfig {
|
|
90
|
+
/** Current page (1-indexed) */
|
|
91
|
+
currentPage: number;
|
|
92
|
+
/** Total number of pages (calculado por el padre basado en total de registros) */
|
|
93
|
+
totalPages: number;
|
|
94
|
+
/** Callback when page changes - El padre debe manejar el fetch de nuevos datos */
|
|
95
|
+
onPageChange: (page: number) => void;
|
|
96
|
+
/** Show pagination controls */
|
|
97
|
+
showControls?: boolean;
|
|
98
|
+
/** Compact mode */
|
|
99
|
+
isCompact?: boolean;
|
|
100
|
+
}
|
|
101
|
+
/**
|
|
102
|
+
* Empty state configuration
|
|
103
|
+
*/
|
|
104
|
+
export interface EmptyStateConfig {
|
|
105
|
+
/** Icon to display */
|
|
106
|
+
icon: string;
|
|
107
|
+
/** Title text */
|
|
108
|
+
title: string;
|
|
109
|
+
/** Description text */
|
|
110
|
+
description?: string;
|
|
111
|
+
/** Action button text */
|
|
112
|
+
actionText?: string;
|
|
113
|
+
/** Action button callback */
|
|
114
|
+
onAction?: () => void;
|
|
115
|
+
}
|
|
116
|
+
/**
|
|
117
|
+
* Main component props
|
|
118
|
+
*/
|
|
119
|
+
export interface AccordionListProps<T extends BaseAccordionItem = BaseAccordionItem> {
|
|
120
|
+
/** Array of items to display */
|
|
121
|
+
items: T[];
|
|
122
|
+
/** Header configuration */
|
|
123
|
+
header: AccordionHeaderConfig<T>;
|
|
124
|
+
/** Content configuration (required for accordion mode) */
|
|
125
|
+
content?: AccordionContentConfig<T>;
|
|
126
|
+
/** Actions to display for each item */
|
|
127
|
+
actions?: AccordionItemAction<T>[];
|
|
128
|
+
/** Display mode: accordion (expandable) or list (flat) */
|
|
129
|
+
mode?: "accordion" | "list";
|
|
130
|
+
/** Pagination configuration (optional) */
|
|
131
|
+
pagination?: PaginationConfig;
|
|
132
|
+
/** Loading state */
|
|
133
|
+
isLoading?: boolean;
|
|
134
|
+
/** Empty state configuration */
|
|
135
|
+
emptyState?: EmptyStateConfig;
|
|
136
|
+
/** Section title */
|
|
137
|
+
sectionTitle?: string;
|
|
138
|
+
/** Section icon */
|
|
139
|
+
sectionIcon?: string;
|
|
140
|
+
/** Show item count badge */
|
|
141
|
+
showCount?: boolean;
|
|
142
|
+
/** Custom className for the container */
|
|
143
|
+
className?: string;
|
|
144
|
+
/** Accordion variant (for accordion mode) */
|
|
145
|
+
accordionVariant?: "splitted" | "shadow" | "bordered" | "light";
|
|
146
|
+
/** Selection mode for accordion */
|
|
147
|
+
selectionMode?: "none" | "single" | "multiple";
|
|
148
|
+
/** Disable indicator animation */
|
|
149
|
+
disableIndicatorAnimation?: boolean;
|
|
150
|
+
/** Custom loading component */
|
|
151
|
+
loadingComponent?: ReactNode;
|
|
152
|
+
/** Custom empty state component (overrides emptyState config) */
|
|
153
|
+
emptyStateComponent?: ReactNode;
|
|
154
|
+
}
|
|
155
|
+
//# sourceMappingURL=AccordionList.types.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"AccordionList.types.d.ts","sourceRoot":"","sources":["../../../../src/components/accordion-list/AccordionList.types.ts"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,3 @@
|
|
|
1
|
+
export { AccordionList } from "./AccordionList";
|
|
2
|
+
export type { AccordionListProps, BaseAccordionItem, AccordionItemAction, AccordionItemMetadata, AccordionContentConfig, AccordionHeaderConfig, PaginationConfig, EmptyStateConfig, } from "./AccordionList.types";
|
|
3
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/accordion-list/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,YAAY,EACX,kBAAkB,EAClB,iBAAiB,EACjB,mBAAmB,EACnB,qBAAqB,EACrB,sBAAsB,EACtB,qBAAqB,EACrB,gBAAgB,EAChB,gBAAgB,GAChB,MAAM,uBAAuB,CAAC"}
|
package/dist/types/index.d.ts
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import "./styles/globals.css";
|
|
2
2
|
export * from "@heroui/react";
|
|
3
3
|
export { Slider } from "@heroui/react";
|
|
4
|
+
export * from "./components/accordion-list";
|
|
4
5
|
export * from "./components/add-holiday-form";
|
|
5
6
|
export * from "./components/analytics-card";
|
|
6
7
|
export * from "./components/autocomplete";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.tsx"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.tsx"],"names":[],"mappings":"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"}
|