@prediktif/ui 0.1.9 → 0.1.11

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.d.mts CHANGED
@@ -4,24 +4,24 @@ import { ReactNode } from 'react';
4
4
  interface NavItem {
5
5
  title: string;
6
6
  url: string;
7
- icon: React.ComponentType<{
7
+ icon?: React.ComponentType<{
8
8
  className?: string;
9
- }>;
9
+ }> | ReactNode;
10
10
  locked?: boolean;
11
11
  }
12
12
  interface OrganizationItem {
13
13
  name: string;
14
14
  logo?: React.ComponentType<{
15
15
  className?: string;
16
- }>;
16
+ }> | ReactNode;
17
17
  plan?: string;
18
18
  }
19
19
  interface AppSidebarProps {
20
- name: string;
21
- email: string;
22
- orgRole: string;
23
- brand: string;
24
- href: string;
20
+ name?: string | null;
21
+ email?: string | null;
22
+ orgRole?: string | null;
23
+ brand?: string;
24
+ href?: string;
25
25
  confirmDialog?: boolean;
26
26
  headerDropdown?: boolean;
27
27
  image?: string | null;
package/dist/index.d.ts CHANGED
@@ -4,24 +4,24 @@ import { ReactNode } from 'react';
4
4
  interface NavItem {
5
5
  title: string;
6
6
  url: string;
7
- icon: React.ComponentType<{
7
+ icon?: React.ComponentType<{
8
8
  className?: string;
9
- }>;
9
+ }> | ReactNode;
10
10
  locked?: boolean;
11
11
  }
12
12
  interface OrganizationItem {
13
13
  name: string;
14
14
  logo?: React.ComponentType<{
15
15
  className?: string;
16
- }>;
16
+ }> | ReactNode;
17
17
  plan?: string;
18
18
  }
19
19
  interface AppSidebarProps {
20
- name: string;
21
- email: string;
22
- orgRole: string;
23
- brand: string;
24
- href: string;
20
+ name?: string | null;
21
+ email?: string | null;
22
+ orgRole?: string | null;
23
+ brand?: string;
24
+ href?: string;
25
25
  confirmDialog?: boolean;
26
26
  headerDropdown?: boolean;
27
27
  image?: string | null;
package/dist/index.js CHANGED
@@ -1227,6 +1227,12 @@ function SidebarMenuBadge(_a) {
1227
1227
 
1228
1228
  // src/components/composed/app-sidebar.tsx
1229
1229
  var import_jsx_runtime12 = require("react/jsx-runtime");
1230
+ function renderNavIcon(icon) {
1231
+ if (!icon) return null;
1232
+ if ((0, import_react.isValidElement)(icon)) return icon;
1233
+ const IconComponent = icon;
1234
+ return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(IconComponent, {});
1235
+ }
1230
1236
  function formatSegment(segment, subHref, navMainItems = [], navSecondaryItems = []) {
1231
1237
  if (subHref) {
1232
1238
  const matched = [...navMainItems, ...navSecondaryItems].find(
@@ -1243,11 +1249,11 @@ function isRouteActive(url, pathname) {
1243
1249
  return pathname === url || pathname.startsWith(rootPrefix);
1244
1250
  }
1245
1251
  var AppSidebar = (0, import_react.memo)(function AppSidebar2({
1246
- name,
1247
- email,
1248
- orgRole,
1252
+ name = "",
1253
+ email = "",
1254
+ orgRole = "",
1249
1255
  brand = "Prediktif",
1250
- href,
1256
+ href = "#",
1251
1257
  confirmDialog = false,
1252
1258
  headerDropdown = false,
1253
1259
  image,
@@ -1278,7 +1284,7 @@ var AppSidebar = (0, import_react.memo)(function AppSidebar2({
1278
1284
  /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { className: "flex aspect-square size-8 items-center justify-center rounded-lg bg-sidebar-primary text-sidebar-primary-foreground", children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_lucide_react5.Command, { className: "size-4" }) }),
1279
1285
  /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "grid flex-1 text-left text-sm leading-tight", children: [
1280
1286
  /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { className: "truncate font-medium", children: (activeOrg == null ? void 0 : activeOrg.name) || brand }),
1281
- /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { className: "truncate text-xs", children: (activeOrg == null ? void 0 : activeOrg.plan) || orgRole })
1287
+ /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { className: "truncate text-xs capitalize", children: (activeOrg == null ? void 0 : activeOrg.plan) || orgRole })
1282
1288
  ] }),
1283
1289
  /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_lucide_react5.ChevronsUpDown, { className: "ml-auto" })
1284
1290
  ]
@@ -1316,13 +1322,13 @@ var AppSidebar = (0, import_react.memo)(function AppSidebar2({
1316
1322
  /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { className: "flex aspect-square size-8 items-center justify-center rounded-lg bg-sidebar-primary text-sidebar-primary-foreground", children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_lucide_react5.Command, { className: "size-4" }) }),
1317
1323
  /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "grid flex-1 text-left text-sm leading-tight", children: [
1318
1324
  /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { className: "truncate font-medium", children: brand }),
1319
- /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { className: "truncate text-xs", children: orgRole })
1325
+ /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { className: "truncate text-xs capitalize", children: orgRole })
1320
1326
  ] })
1321
1327
  ] }) }) }) }),
1322
1328
  /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(SidebarContent, { children: [
1323
1329
  /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(SidebarGroup, { children: [
1324
1330
  /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(SidebarGroupLabel, { children: "Platform" }),
1325
- /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(SidebarMenu, { children: navMainItems.map(({ title, url, icon: Icon, locked }) => {
1331
+ /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(SidebarMenu, { children: navMainItems.map(({ title, url, icon, locked }) => {
1326
1332
  const isActive = isRouteActive(url, pathname);
1327
1333
  return /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(SidebarMenuItem, { children: [
1328
1334
  /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
@@ -1332,7 +1338,7 @@ var AppSidebar = (0, import_react.memo)(function AppSidebar2({
1332
1338
  tooltip: title,
1333
1339
  render: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_link.default, { href: url }),
1334
1340
  children: [
1335
- /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(Icon, {}),
1341
+ renderNavIcon(icon),
1336
1342
  /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { children: title })
1337
1343
  ]
1338
1344
  }
@@ -1341,7 +1347,7 @@ var AppSidebar = (0, import_react.memo)(function AppSidebar2({
1341
1347
  ] }, title);
1342
1348
  }) })
1343
1349
  ] }),
1344
- /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(SidebarGroup, { className: "mt-auto", children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(SidebarGroupContent, { children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(SidebarMenu, { children: navSecondaryItems.map(({ title, url, icon: Icon, locked }) => {
1350
+ /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(SidebarGroup, { className: "mt-auto", children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(SidebarGroupContent, { children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(SidebarMenu, { children: navSecondaryItems.map(({ title, url, icon, locked }) => {
1345
1351
  const isActive = isRouteActive(url, pathname);
1346
1352
  return /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(SidebarMenuItem, { children: [
1347
1353
  /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
@@ -1352,7 +1358,7 @@ var AppSidebar = (0, import_react.memo)(function AppSidebar2({
1352
1358
  tooltip: title,
1353
1359
  render: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_link.default, { href: url }),
1354
1360
  children: [
1355
- /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(Icon, {}),
1361
+ renderNavIcon(icon),
1356
1362
  /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { children: title })
1357
1363
  ]
1358
1364
  }
package/dist/index.mjs CHANGED
@@ -35,7 +35,7 @@ var __objRest = (source, exclude) => {
35
35
  import { ChevronsUpDown, Command, LockIcon } from "lucide-react";
36
36
  import Link from "next/link";
37
37
  import { usePathname } from "next/navigation";
38
- import { memo } from "react";
38
+ import { isValidElement, memo } from "react";
39
39
 
40
40
  // src/components/ui/alert-dialog.tsx
41
41
  import { AlertDialog as AlertDialogPrimitive } from "@base-ui/react/alert-dialog";
@@ -1193,6 +1193,12 @@ function SidebarMenuBadge(_a) {
1193
1193
 
1194
1194
  // src/components/composed/app-sidebar.tsx
1195
1195
  import { jsx as jsx12, jsxs as jsxs7 } from "react/jsx-runtime";
1196
+ function renderNavIcon(icon) {
1197
+ if (!icon) return null;
1198
+ if (isValidElement(icon)) return icon;
1199
+ const IconComponent = icon;
1200
+ return /* @__PURE__ */ jsx12(IconComponent, {});
1201
+ }
1196
1202
  function formatSegment(segment, subHref, navMainItems = [], navSecondaryItems = []) {
1197
1203
  if (subHref) {
1198
1204
  const matched = [...navMainItems, ...navSecondaryItems].find(
@@ -1209,11 +1215,11 @@ function isRouteActive(url, pathname) {
1209
1215
  return pathname === url || pathname.startsWith(rootPrefix);
1210
1216
  }
1211
1217
  var AppSidebar = memo(function AppSidebar2({
1212
- name,
1213
- email,
1214
- orgRole,
1218
+ name = "",
1219
+ email = "",
1220
+ orgRole = "",
1215
1221
  brand = "Prediktif",
1216
- href,
1222
+ href = "#",
1217
1223
  confirmDialog = false,
1218
1224
  headerDropdown = false,
1219
1225
  image,
@@ -1244,7 +1250,7 @@ var AppSidebar = memo(function AppSidebar2({
1244
1250
  /* @__PURE__ */ jsx12("div", { className: "flex aspect-square size-8 items-center justify-center rounded-lg bg-sidebar-primary text-sidebar-primary-foreground", children: /* @__PURE__ */ jsx12(Command, { className: "size-4" }) }),
1245
1251
  /* @__PURE__ */ jsxs7("div", { className: "grid flex-1 text-left text-sm leading-tight", children: [
1246
1252
  /* @__PURE__ */ jsx12("span", { className: "truncate font-medium", children: (activeOrg == null ? void 0 : activeOrg.name) || brand }),
1247
- /* @__PURE__ */ jsx12("span", { className: "truncate text-xs", children: (activeOrg == null ? void 0 : activeOrg.plan) || orgRole })
1253
+ /* @__PURE__ */ jsx12("span", { className: "truncate text-xs capitalize", children: (activeOrg == null ? void 0 : activeOrg.plan) || orgRole })
1248
1254
  ] }),
1249
1255
  /* @__PURE__ */ jsx12(ChevronsUpDown, { className: "ml-auto" })
1250
1256
  ]
@@ -1282,13 +1288,13 @@ var AppSidebar = memo(function AppSidebar2({
1282
1288
  /* @__PURE__ */ jsx12("div", { className: "flex aspect-square size-8 items-center justify-center rounded-lg bg-sidebar-primary text-sidebar-primary-foreground", children: /* @__PURE__ */ jsx12(Command, { className: "size-4" }) }),
1283
1289
  /* @__PURE__ */ jsxs7("div", { className: "grid flex-1 text-left text-sm leading-tight", children: [
1284
1290
  /* @__PURE__ */ jsx12("span", { className: "truncate font-medium", children: brand }),
1285
- /* @__PURE__ */ jsx12("span", { className: "truncate text-xs", children: orgRole })
1291
+ /* @__PURE__ */ jsx12("span", { className: "truncate text-xs capitalize", children: orgRole })
1286
1292
  ] })
1287
1293
  ] }) }) }) }),
1288
1294
  /* @__PURE__ */ jsxs7(SidebarContent, { children: [
1289
1295
  /* @__PURE__ */ jsxs7(SidebarGroup, { children: [
1290
1296
  /* @__PURE__ */ jsx12(SidebarGroupLabel, { children: "Platform" }),
1291
- /* @__PURE__ */ jsx12(SidebarMenu, { children: navMainItems.map(({ title, url, icon: Icon, locked }) => {
1297
+ /* @__PURE__ */ jsx12(SidebarMenu, { children: navMainItems.map(({ title, url, icon, locked }) => {
1292
1298
  const isActive = isRouteActive(url, pathname);
1293
1299
  return /* @__PURE__ */ jsxs7(SidebarMenuItem, { children: [
1294
1300
  /* @__PURE__ */ jsxs7(
@@ -1298,7 +1304,7 @@ var AppSidebar = memo(function AppSidebar2({
1298
1304
  tooltip: title,
1299
1305
  render: /* @__PURE__ */ jsx12(Link, { href: url }),
1300
1306
  children: [
1301
- /* @__PURE__ */ jsx12(Icon, {}),
1307
+ renderNavIcon(icon),
1302
1308
  /* @__PURE__ */ jsx12("span", { children: title })
1303
1309
  ]
1304
1310
  }
@@ -1307,7 +1313,7 @@ var AppSidebar = memo(function AppSidebar2({
1307
1313
  ] }, title);
1308
1314
  }) })
1309
1315
  ] }),
1310
- /* @__PURE__ */ jsx12(SidebarGroup, { className: "mt-auto", children: /* @__PURE__ */ jsx12(SidebarGroupContent, { children: /* @__PURE__ */ jsx12(SidebarMenu, { children: navSecondaryItems.map(({ title, url, icon: Icon, locked }) => {
1316
+ /* @__PURE__ */ jsx12(SidebarGroup, { className: "mt-auto", children: /* @__PURE__ */ jsx12(SidebarGroupContent, { children: /* @__PURE__ */ jsx12(SidebarMenu, { children: navSecondaryItems.map(({ title, url, icon, locked }) => {
1311
1317
  const isActive = isRouteActive(url, pathname);
1312
1318
  return /* @__PURE__ */ jsxs7(SidebarMenuItem, { children: [
1313
1319
  /* @__PURE__ */ jsxs7(
@@ -1318,7 +1324,7 @@ var AppSidebar = memo(function AppSidebar2({
1318
1324
  tooltip: title,
1319
1325
  render: /* @__PURE__ */ jsx12(Link, { href: url }),
1320
1326
  children: [
1321
- /* @__PURE__ */ jsx12(Icon, {}),
1327
+ renderNavIcon(icon),
1322
1328
  /* @__PURE__ */ jsx12("span", { children: title })
1323
1329
  ]
1324
1330
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@prediktif/ui",
3
- "version": "0.1.9",
3
+ "version": "0.1.11",
4
4
  "main": "./dist/index.js",
5
5
  "module": "./dist/index.mjs",
6
6
  "types": "./dist/index.d.ts",