@algorithm-shift/design-system 1.2.91 → 1.2.92
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/index.js +64 -41
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +47 -24
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -27775,7 +27775,8 @@ function useLazyDropdown(config) {
|
|
|
27775
27775
|
const limit = PAGE_SIZE;
|
|
27776
27776
|
const params = { page: pageNum, limit };
|
|
27777
27777
|
if (term) params[configRef.current.dataLabel ?? "search"] = term;
|
|
27778
|
-
const
|
|
27778
|
+
const axiosClient = configRef.current.axiosInstance ?? import_axios.default;
|
|
27779
|
+
const res = await axiosClient.get(configRef.current.apiUrl, {
|
|
27779
27780
|
params,
|
|
27780
27781
|
withCredentials: true
|
|
27781
27782
|
});
|
|
@@ -27823,7 +27824,8 @@ function useLazyDropdown(config) {
|
|
|
27823
27824
|
if (!configRef.current.apiUrl) return [];
|
|
27824
27825
|
try {
|
|
27825
27826
|
setLoading(true);
|
|
27826
|
-
const
|
|
27827
|
+
const axiosClient = configRef.current.axiosInstance ?? import_axios.default;
|
|
27828
|
+
const res = await axiosClient.get(configRef.current.apiUrl, {
|
|
27827
27829
|
params: { [configRef.current.dataKey]: configRef.current.value },
|
|
27828
27830
|
withCredentials: true
|
|
27829
27831
|
});
|
|
@@ -27899,7 +27901,8 @@ function LazySelectDropdown({
|
|
|
27899
27901
|
pageSize,
|
|
27900
27902
|
dataKey = "id",
|
|
27901
27903
|
dataLabel = "name",
|
|
27902
|
-
errorMessage
|
|
27904
|
+
errorMessage,
|
|
27905
|
+
axiosInstance
|
|
27903
27906
|
}) {
|
|
27904
27907
|
const [isOpen, setIsOpen] = (0, import_react20.useState)(false);
|
|
27905
27908
|
const [searchTerm, setSearchTerm] = (0, import_react20.useState)("");
|
|
@@ -27921,7 +27924,8 @@ function LazySelectDropdown({
|
|
|
27921
27924
|
dataKey,
|
|
27922
27925
|
dataLabel,
|
|
27923
27926
|
initialData: options || [],
|
|
27924
|
-
value
|
|
27927
|
+
value,
|
|
27928
|
+
axiosInstance
|
|
27925
27929
|
});
|
|
27926
27930
|
const selectedOption = lazyOptions.find((opt) => opt.value === value);
|
|
27927
27931
|
(0, import_react20.useEffect)(() => {
|
|
@@ -29010,7 +29014,7 @@ var MultiSelect = ({
|
|
|
29010
29014
|
var MultiSelect_default = MultiSelect;
|
|
29011
29015
|
|
|
29012
29016
|
// src/components/ui/data-table.tsx
|
|
29013
|
-
var
|
|
29017
|
+
var React10 = __toESM(require("react"));
|
|
29014
29018
|
var import_free_solid_svg_icons2 = require("@fortawesome/free-solid-svg-icons");
|
|
29015
29019
|
var import_react_fontawesome3 = require("@fortawesome/react-fontawesome");
|
|
29016
29020
|
var import_react_table2 = require("@tanstack/react-table");
|
|
@@ -29104,6 +29108,7 @@ function TableCell({ className, ...props }) {
|
|
|
29104
29108
|
var import_react_table = require("@tanstack/react-table");
|
|
29105
29109
|
|
|
29106
29110
|
// src/lib/table/cellRendererFactory.tsx
|
|
29111
|
+
var import_react29 = __toESM(require("react"));
|
|
29107
29112
|
var import_image3 = __toESM(require("next/image"));
|
|
29108
29113
|
|
|
29109
29114
|
// src/lib/dayjs-setup.ts
|
|
@@ -29184,6 +29189,22 @@ var getContrastColor = (bg) => {
|
|
|
29184
29189
|
const brightness = (r * 299 + g * 587 + b * 114) / 1e3;
|
|
29185
29190
|
return brightness > 160 ? "#000000" : "#FFFFFF";
|
|
29186
29191
|
};
|
|
29192
|
+
var sanitizeValue = (val) => {
|
|
29193
|
+
if (val == null) return null;
|
|
29194
|
+
if (import_react29.default.isValidElement(val)) return val;
|
|
29195
|
+
if (typeof val === "string" || typeof val === "number") return val;
|
|
29196
|
+
if (Array.isArray(val)) return val.map((v, i) => /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(import_react29.default.Fragment, { children: sanitizeValue(v) }, i));
|
|
29197
|
+
if (typeof val === "object") {
|
|
29198
|
+
if ("name" in val && typeof val.name === "string") return val.name;
|
|
29199
|
+
if ("label" in val && typeof val.label === "string") return val.label;
|
|
29200
|
+
try {
|
|
29201
|
+
return JSON.stringify(val);
|
|
29202
|
+
} catch {
|
|
29203
|
+
return "[object]";
|
|
29204
|
+
}
|
|
29205
|
+
}
|
|
29206
|
+
return String(val);
|
|
29207
|
+
};
|
|
29187
29208
|
var cellRendererFactory = (renderer, rendererProps, value, row, customRenderers = {}, format2, customFormatters = {}) => {
|
|
29188
29209
|
const formattedValue = valueFormatter(value, format2, customFormatters);
|
|
29189
29210
|
switch (renderer) {
|
|
@@ -29335,13 +29356,15 @@ var useDynamicColumns = (config, customRenderers = {}, customFormatters = {}) =>
|
|
|
29335
29356
|
return config.columns.map((col) => {
|
|
29336
29357
|
const accessorKey = col.accessorKey ?? col.id;
|
|
29337
29358
|
const accessorFn = (row) => {
|
|
29359
|
+
if (!row) return null;
|
|
29338
29360
|
if (Object.prototype.hasOwnProperty.call(row, accessorKey)) {
|
|
29339
|
-
return row[accessorKey];
|
|
29361
|
+
return sanitizeValue(row[accessorKey]);
|
|
29340
29362
|
}
|
|
29341
29363
|
if (accessorKey.includes(".")) {
|
|
29342
|
-
|
|
29364
|
+
const val = getValueByPath(row, accessorKey);
|
|
29365
|
+
return sanitizeValue(val);
|
|
29343
29366
|
}
|
|
29344
|
-
return row[accessorKey];
|
|
29367
|
+
return sanitizeValue(row[accessorKey]);
|
|
29345
29368
|
};
|
|
29346
29369
|
return columnHelper.accessor(accessorFn, {
|
|
29347
29370
|
id: col.id ?? accessorKey,
|
|
@@ -29386,13 +29409,13 @@ function DataTable({
|
|
|
29386
29409
|
onDeleteRow,
|
|
29387
29410
|
rowActions
|
|
29388
29411
|
}) {
|
|
29389
|
-
const [columnFilters, setColumnFilters] =
|
|
29390
|
-
const [columnVisibility, setColumnVisibility] =
|
|
29391
|
-
const [manualSort, setManualSort] =
|
|
29392
|
-
const [searchTerm, setSearchTerm] =
|
|
29412
|
+
const [columnFilters, setColumnFilters] = React10.useState([]);
|
|
29413
|
+
const [columnVisibility, setColumnVisibility] = React10.useState({});
|
|
29414
|
+
const [manualSort, setManualSort] = React10.useState(null);
|
|
29415
|
+
const [searchTerm, setSearchTerm] = React10.useState("");
|
|
29393
29416
|
const dynamicCols = useDynamicColumns({ columns });
|
|
29394
29417
|
const table = (0, import_react_table2.useReactTable)({
|
|
29395
|
-
data,
|
|
29418
|
+
data: data ?? [],
|
|
29396
29419
|
columns: dynamicCols,
|
|
29397
29420
|
state: {
|
|
29398
29421
|
columnFilters,
|
|
@@ -29605,7 +29628,7 @@ function DataTable({
|
|
|
29605
29628
|
return /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(
|
|
29606
29629
|
TableCell,
|
|
29607
29630
|
{
|
|
29608
|
-
className: `${meta?.cellClass ?? ""} ${isClickable ? "cursor-pointer hover:bg-gray-100" : ""} relative`,
|
|
29631
|
+
className: `${meta?.cellClass ?? ""} ${isClickable ? "cursor-pointer hover:bg-gray-100 underline text-blue-500" : ""} relative`,
|
|
29609
29632
|
style: meta?.cellStyle,
|
|
29610
29633
|
onClick: () => {
|
|
29611
29634
|
if (isClickable && onCellClick) {
|
|
@@ -29949,12 +29972,12 @@ var CustomPagination = ({
|
|
|
29949
29972
|
var Pagination_default = CustomPagination;
|
|
29950
29973
|
|
|
29951
29974
|
// src/components/Navigation/Tabs/Tabs.tsx
|
|
29952
|
-
var
|
|
29975
|
+
var import_react30 = require("react");
|
|
29953
29976
|
var import_link5 = __toESM(require("next/link"));
|
|
29954
29977
|
var import_navigation3 = require("next/navigation");
|
|
29955
29978
|
var import_jsx_runtime57 = require("react/jsx-runtime");
|
|
29956
29979
|
var Tabs = ({ className, style, tabs, verticalMenu, pathname, canvasMode, isBuilder = false, source, parentKey, menuNameKey, menuUrlKey, loading }) => {
|
|
29957
|
-
const [openIndex, setOpenIndex] = (0,
|
|
29980
|
+
const [openIndex, setOpenIndex] = (0, import_react30.useState)(null);
|
|
29958
29981
|
function groupMenus(menus = []) {
|
|
29959
29982
|
const menuMap = /* @__PURE__ */ new Map();
|
|
29960
29983
|
menus.forEach((menu) => {
|
|
@@ -29987,7 +30010,7 @@ var Tabs = ({ className, style, tabs, verticalMenu, pathname, canvasMode, isBuil
|
|
|
29987
30010
|
});
|
|
29988
30011
|
return sortMenus(rootMenus);
|
|
29989
30012
|
}
|
|
29990
|
-
const rawTabs = (0,
|
|
30013
|
+
const rawTabs = (0, import_react30.useMemo)(() => {
|
|
29991
30014
|
if (!Array.isArray(tabs)) return [];
|
|
29992
30015
|
if (source === "manual") return Array.isArray(tabs) ? tabs : [];
|
|
29993
30016
|
return groupMenus(tabs);
|
|
@@ -30000,9 +30023,9 @@ var Tabs = ({ className, style, tabs, verticalMenu, pathname, canvasMode, isBuil
|
|
|
30000
30023
|
return pathname === path || path !== "/" && pathname?.startsWith(path);
|
|
30001
30024
|
};
|
|
30002
30025
|
const router = (0, import_navigation3.useRouter)();
|
|
30003
|
-
const [showExitDialog, setShowExitDialog] = (0,
|
|
30004
|
-
const [pendingUrl, setPendingUrl] = (0,
|
|
30005
|
-
const handleBuilderExit = (0,
|
|
30026
|
+
const [showExitDialog, setShowExitDialog] = (0, import_react30.useState)(false);
|
|
30027
|
+
const [pendingUrl, setPendingUrl] = (0, import_react30.useState)(null);
|
|
30028
|
+
const handleBuilderExit = (0, import_react30.useCallback)(
|
|
30006
30029
|
(e, url) => {
|
|
30007
30030
|
if (isBuilder) {
|
|
30008
30031
|
e.preventDefault();
|
|
@@ -30157,10 +30180,10 @@ var Tabs = ({ className, style, tabs, verticalMenu, pathname, canvasMode, isBuil
|
|
|
30157
30180
|
var Tabs_default = Tabs;
|
|
30158
30181
|
|
|
30159
30182
|
// src/components/Navigation/Stages/Stages.tsx
|
|
30160
|
-
var
|
|
30183
|
+
var import_react31 = __toESM(require("react"));
|
|
30161
30184
|
var import_jsx_runtime58 = require("react/jsx-runtime");
|
|
30162
30185
|
var StagesComponent = ({ stages, isShowBtn, buttonText, className, style, onStageChange, currentStage, dataKey = "key", dataLabel = "header", loading }) => {
|
|
30163
|
-
const [activeStage, setActiveStage] = (0,
|
|
30186
|
+
const [activeStage, setActiveStage] = (0, import_react31.useState)(currentStage || (stages && stages.length > 0 ? stages[0].key : null));
|
|
30164
30187
|
const nextStage = () => {
|
|
30165
30188
|
if (!stages || stages.length === 0) return;
|
|
30166
30189
|
const currentIndex = stages.findIndex((stage) => stage[dataKey] === activeStage);
|
|
@@ -30192,7 +30215,7 @@ var StagesComponent = ({ stages, isShowBtn, buttonText, className, style, onStag
|
|
|
30192
30215
|
const currentIndex = stages.findIndex((s) => s[dataKey] === activeStage);
|
|
30193
30216
|
const isCompleted = isAllStagesCompleted || index < currentIndex;
|
|
30194
30217
|
const isActive = !isAllStagesCompleted && index === currentIndex;
|
|
30195
|
-
return /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)(
|
|
30218
|
+
return /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)(import_react31.default.Fragment, { children: [
|
|
30196
30219
|
/* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
|
|
30197
30220
|
"button",
|
|
30198
30221
|
{
|
|
@@ -30240,10 +30263,10 @@ var import_jsx_runtime61 = require("react/jsx-runtime");
|
|
|
30240
30263
|
var import_jsx_runtime62 = require("react/jsx-runtime");
|
|
30241
30264
|
|
|
30242
30265
|
// src/components/ui/avatar.tsx
|
|
30243
|
-
var
|
|
30266
|
+
var React12 = __toESM(require("react"));
|
|
30244
30267
|
var AvatarPrimitive = __toESM(require("@radix-ui/react-avatar"));
|
|
30245
30268
|
var import_jsx_runtime63 = require("react/jsx-runtime");
|
|
30246
|
-
var Avatar =
|
|
30269
|
+
var Avatar = React12.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
|
|
30247
30270
|
AvatarPrimitive.Root,
|
|
30248
30271
|
{
|
|
30249
30272
|
ref,
|
|
@@ -30255,7 +30278,7 @@ var Avatar = React11.forwardRef(({ className, ...props }, ref) => /* @__PURE__ *
|
|
|
30255
30278
|
}
|
|
30256
30279
|
));
|
|
30257
30280
|
Avatar.displayName = AvatarPrimitive.Root.displayName;
|
|
30258
|
-
var AvatarImage =
|
|
30281
|
+
var AvatarImage = React12.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
|
|
30259
30282
|
AvatarPrimitive.Image,
|
|
30260
30283
|
{
|
|
30261
30284
|
ref,
|
|
@@ -30264,7 +30287,7 @@ var AvatarImage = React11.forwardRef(({ className, ...props }, ref) => /* @__PUR
|
|
|
30264
30287
|
}
|
|
30265
30288
|
));
|
|
30266
30289
|
AvatarImage.displayName = AvatarPrimitive.Image.displayName;
|
|
30267
|
-
var AvatarFallback =
|
|
30290
|
+
var AvatarFallback = React12.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
|
|
30268
30291
|
AvatarPrimitive.Fallback,
|
|
30269
30292
|
{
|
|
30270
30293
|
ref,
|
|
@@ -30282,7 +30305,7 @@ var import_link6 = __toESM(require("next/link"));
|
|
|
30282
30305
|
var import_image4 = __toESM(require("next/image"));
|
|
30283
30306
|
var import_navigation4 = require("next/navigation");
|
|
30284
30307
|
var import_react_dropdown_menu = require("@radix-ui/react-dropdown-menu");
|
|
30285
|
-
var
|
|
30308
|
+
var import_react32 = require("react");
|
|
30286
30309
|
var import_jsx_runtime64 = require("react/jsx-runtime");
|
|
30287
30310
|
function Navbar({
|
|
30288
30311
|
style,
|
|
@@ -30303,9 +30326,9 @@ function Navbar({
|
|
|
30303
30326
|
}) {
|
|
30304
30327
|
const isMobileView = canvasMode === "mobile" || canvasMode === "tablet";
|
|
30305
30328
|
const router = (0, import_navigation4.useRouter)();
|
|
30306
|
-
const [showExitDialog, setShowExitDialog] = (0,
|
|
30307
|
-
const [pendingUrl, setPendingUrl] = (0,
|
|
30308
|
-
const handleBuilderExit = (0,
|
|
30329
|
+
const [showExitDialog, setShowExitDialog] = (0, import_react32.useState)(false);
|
|
30330
|
+
const [pendingUrl, setPendingUrl] = (0, import_react32.useState)(null);
|
|
30331
|
+
const handleBuilderExit = (0, import_react32.useCallback)(
|
|
30309
30332
|
(e, url) => {
|
|
30310
30333
|
if (isBuilder) {
|
|
30311
30334
|
e.preventDefault();
|
|
@@ -30321,7 +30344,7 @@ function Navbar({
|
|
|
30321
30344
|
router.push(pendingUrl);
|
|
30322
30345
|
}
|
|
30323
30346
|
};
|
|
30324
|
-
const formatedMenu = (0,
|
|
30347
|
+
const formatedMenu = (0, import_react32.useMemo)(() => {
|
|
30325
30348
|
if (source === "state" && navList && navList.length) {
|
|
30326
30349
|
return navList.map((i) => ({ ...i, header: i.name || "Menu" }));
|
|
30327
30350
|
}
|
|
@@ -30424,7 +30447,7 @@ function Navbar({
|
|
|
30424
30447
|
}
|
|
30425
30448
|
|
|
30426
30449
|
// src/components/Chart/BarChart.tsx
|
|
30427
|
-
var
|
|
30450
|
+
var import_react33 = __toESM(require("react"));
|
|
30428
30451
|
var import_recharts = require("recharts");
|
|
30429
30452
|
var import_jsx_runtime65 = require("react/jsx-runtime");
|
|
30430
30453
|
var ChartComponent = ({ className, style, loading, ...props }) => {
|
|
@@ -30485,10 +30508,10 @@ var ChartComponent = ({ className, style, loading, ...props }) => {
|
|
|
30485
30508
|
)
|
|
30486
30509
|
] }) }) });
|
|
30487
30510
|
};
|
|
30488
|
-
var BarChart_default =
|
|
30511
|
+
var BarChart_default = import_react33.default.memo(ChartComponent);
|
|
30489
30512
|
|
|
30490
30513
|
// src/components/Chart/PieChart.tsx
|
|
30491
|
-
var
|
|
30514
|
+
var import_react34 = __toESM(require("react"));
|
|
30492
30515
|
var import_recharts2 = require("recharts");
|
|
30493
30516
|
var import_jsx_runtime66 = require("react/jsx-runtime");
|
|
30494
30517
|
var getRandomColor = () => {
|
|
@@ -30510,18 +30533,18 @@ var DonutChart = ({ className, style, loading, ...props }) => {
|
|
|
30510
30533
|
const showLegends = props.showLegends ?? true;
|
|
30511
30534
|
const labelType = props.labelType || "inside";
|
|
30512
30535
|
const canvasMode = props.canvasMode;
|
|
30513
|
-
const data = (0,
|
|
30536
|
+
const data = (0, import_react34.useMemo)(() => {
|
|
30514
30537
|
if (!Array.isArray(props.data)) return [];
|
|
30515
30538
|
return props.data.map((item) => ({ ...item, color: getRandomColor() }));
|
|
30516
30539
|
}, [props.data]);
|
|
30517
|
-
const total = (0,
|
|
30540
|
+
const total = (0, import_react34.useMemo)(() => data.reduce((sum, d) => sum + d.value, 0), [data]);
|
|
30518
30541
|
const forceMobile = canvasMode === "mobile" || canvasMode === "tablet";
|
|
30519
|
-
const [mounted, setMounted] = (0,
|
|
30520
|
-
(0,
|
|
30542
|
+
const [mounted, setMounted] = (0, import_react34.useState)(false);
|
|
30543
|
+
(0, import_react34.useEffect)(() => {
|
|
30521
30544
|
const timeout = setTimeout(() => setMounted(true), 100);
|
|
30522
30545
|
return () => clearTimeout(timeout);
|
|
30523
30546
|
}, []);
|
|
30524
|
-
const renderLegends = (0,
|
|
30547
|
+
const renderLegends = (0, import_react34.useMemo)(() => {
|
|
30525
30548
|
if (!showLegends) return null;
|
|
30526
30549
|
return /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(import_jsx_runtime66.Fragment, { children: data.map((d) => /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(
|
|
30527
30550
|
"div",
|
|
@@ -30609,7 +30632,7 @@ var DonutChart = ({ className, style, loading, ...props }) => {
|
|
|
30609
30632
|
}
|
|
30610
30633
|
);
|
|
30611
30634
|
};
|
|
30612
|
-
var PieChart_default =
|
|
30635
|
+
var PieChart_default = import_react34.default.memo(DonutChart);
|
|
30613
30636
|
|
|
30614
30637
|
// src/components/Blocks/EmailComposer.tsx
|
|
30615
30638
|
var import_jsx_runtime67 = require("react/jsx-runtime");
|