@yimingliao/cms 0.0.146 → 0.0.147

package/dist/src/client/interfaces/components/ui/layouts/navbar/theme-selector.js

@@ -0,0 +1,51 @@
+"use client";
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { useTranslator } from 'intor/react';
+import { Sun, Moon, TvMinimal } from 'lucide-react';
+import { useTheme } from 'next-themes';
+import '@radix-ui/react-avatar';
+import 'react';
+import 'ua-parser-js';
+import 'clsx';
+import 'tailwind-merge';
+import 'next/navigation';
+import '../../../shadcn/badge.js';
+import '../../../shadcn/button.js';
+import '@radix-ui/react-collapsible';
+import '@radix-ui/react-dialog';
+import { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuItem } from '../../../shadcn/dropdown-menu.js';
+import '../../../shadcn/input-group.js';
+import '@radix-ui/react-label';
+import '@radix-ui/react-select';
+import '@radix-ui/react-separator';
+import '../../../shadcn/sidebar.js';
+import '@radix-ui/react-tooltip';
+import { Button } from '../../buttons/button.js';
+
+function ThemeSelector() {
+  const { setTheme } = useTheme();
+  const { t } = useTranslator();
+  return /* @__PURE__ */ jsxs(DropdownMenu, { children: [
+    /* @__PURE__ */ jsx(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(Button, { variant: "outline", size: "icon", children: [
+      /* @__PURE__ */ jsx(Sun, { className: "h-[1.2rem] w-[1.2rem] scale-100 rotate-0 transition-all dark:scale-0 dark:-rotate-90" }),
+      /* @__PURE__ */ jsx(Moon, { className: "absolute h-[1.2rem] w-[1.2rem] scale-0 rotate-90 transition-all dark:scale-100 dark:rotate-0" }),
+      /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Select theme" })
+    ] }) }),
+    /* @__PURE__ */ jsxs(DropdownMenuContent, { align: "end", children: [
+      /* @__PURE__ */ jsxs(DropdownMenuItem, { onClick: () => setTheme("light"), children: [
+        /* @__PURE__ */ jsx(Sun, {}),
+        t("ui.layout.navbar.theme.light.text")
+      ] }),
+      /* @__PURE__ */ jsxs(DropdownMenuItem, { onClick: () => setTheme("dark"), children: [
+        /* @__PURE__ */ jsx(Moon, {}),
+        t("ui.layout.navbar.theme.dark.text")
+      ] }),
+      /* @__PURE__ */ jsxs(DropdownMenuItem, { onClick: () => setTheme("system"), children: [
+        /* @__PURE__ */ jsx(TvMinimal, {}),
+        t("ui.layout.navbar.theme.system.text")
+      ] })
+    ] })
+  ] });
+}
+
+export { ThemeSelector };

package/dist/src/client/interfaces/components/ui/layouts/sidebar/nav-main.js

@@ -0,0 +1,99 @@
+"use client";
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+import { ChevronRight } from 'lucide-react';
+import Link from 'next/link';
+import { usePathname } from 'next/navigation';
+import { useState, useEffect } from 'react';
+import '@radix-ui/react-avatar';
+import 'ua-parser-js';
+import 'clsx';
+import 'tailwind-merge';
+import '../../../shadcn/badge.js';
+import '../../../shadcn/button.js';
+import { Collapsible, CollapsibleTrigger, CollapsibleContent } from '../../../shadcn/collapsible.js';
+import '@radix-ui/react-dialog';
+import '@radix-ui/react-dropdown-menu';
+import '../../../shadcn/input-group.js';
+import '@radix-ui/react-label';
+import '@radix-ui/react-select';
+import { Separator } from '../../../shadcn/separator.js';
+import { SidebarGroup, SidebarMenu, SidebarMenuItem, SidebarMenuButton, SidebarMenuAction, SidebarMenuSub, SidebarMenuSubItem, SidebarMenuSubButton } from '../../../shadcn/sidebar.js';
+import '@radix-ui/react-tooltip';
+
+const getMainPath = (path) => "/" + path.split("/").slice(3).filter(Boolean).join("/");
+const toSegments = (path) => path.split("/").filter(Boolean);
+const isSegmentMatch = (current, target) => {
+  const currentSeg = toSegments(current);
+  const targetSeg = toSegments(target);
+  if (targetSeg.length > currentSeg.length) return false;
+  return targetSeg.every((seg, i) => currentSeg[i] === seg);
+};
+function NavMain({ items }) {
+  const pathname = usePathname();
+  const [openItems, setOpenItems] = useState([]);
+  const toggleItem = (title, open) => {
+    setOpenItems(
+      (prev) => open ? [...prev, title] : prev.filter((t) => t !== title)
+    );
+  };
+  const parsedPathname = getMainPath(pathname);
+  useEffect(() => {
+    const matched = items.filter(
+      (item) => item.url ? isSegmentMatch(parsedPathname, getMainPath(item.url)) : false
+    ).map((item) => item.title || "");
+    queueMicrotask(() => setOpenItems(matched));
+  }, [parsedPathname, items]);
+  return /* @__PURE__ */ jsx(SidebarGroup, { children: /* @__PURE__ */ jsx(SidebarMenu, { children: items.map((item, index) => {
+    const isOpen = openItems.includes(item.title || "");
+    const parsedUrl = getMainPath(item.url || "");
+    const isCurrentPath = item.url ? isSegmentMatch(parsedPathname, parsedUrl) : false;
+    return /* @__PURE__ */ jsx(
+      Collapsible,
+      {
+        asChild: true,
+        open: isOpen,
+        onOpenChange: (open) => toggleItem(item.title || "", open),
+        children: /* @__PURE__ */ jsxs(SidebarMenuItem, { className: "[&>button]:top-2 [&>button]:size-6", children: [
+          !item.isSeparator ? /* @__PURE__ */ jsx(
+            SidebarMenuButton,
+            {
+              asChild: true,
+              size: "md",
+              isActive: isCurrentPath,
+              children: /* @__PURE__ */ jsxs(Link, { href: item.url || "", children: [
+                item.icon && /* @__PURE__ */ jsx(item.icon, {}),
+                /* @__PURE__ */ jsx("span", { children: item.title })
+              ] })
+            }
+          ) : /* @__PURE__ */ jsx(Separator, {}),
+          item.items?.length ? /* @__PURE__ */ jsxs(Fragment, { children: [
+            /* @__PURE__ */ jsx(CollapsibleTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(SidebarMenuAction, { className: "data-[state=open]:rotate-90", children: [
+              /* @__PURE__ */ jsx(ChevronRight, {}),
+              /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Toggle" })
+            ] }) }),
+            /* @__PURE__ */ jsx(CollapsibleContent, { children: /* @__PURE__ */ jsx(SidebarMenuSub, { children: item.items?.map((subItem, index2) => {
+              const parsedPathname2 = getMainPath(pathname);
+              const parsedUrl2 = getMainPath(subItem.url || "");
+              const isCurrentPath2 = subItem.url ? isSegmentMatch(parsedPathname2, parsedUrl2) : false;
+              return /* @__PURE__ */ jsx(SidebarMenuSubItem, { children: !subItem.isSeparator ? /* @__PURE__ */ jsx(
+                SidebarMenuSubButton,
+                {
+                  asChild: true,
+                  size: "lg",
+                  isActive: isCurrentPath2,
+                  children: /* @__PURE__ */ jsxs(Link, { href: subItem.url || "", children: [
+                    subItem.icon && /* @__PURE__ */ jsx(subItem.icon, {}),
+                    /* @__PURE__ */ jsx("span", { children: subItem.title })
+                  ] })
+                }
+              ) : /* @__PURE__ */ jsx(Separator, {}) }, index2);
+            }) }) })
+          ] }) : null
+        ] })
+      },
+      index
+    );
+  }) }) });
+}
+
+export { NavMain };

package/dist/src/client/interfaces/styles/constants.js

@@ -1,5 +1,7 @@
 const NAVBAR_HEIGHT = 60;
 const SIDEBAR_WIDTH = 288;
 const PAGE_HEADER_HEIGHT = 56;
+const FORM_SIDE_FIELDS_WIDTH = 320;
+const FORM_MIDDLE_GAP_WIDTH = 24;
 
-export { NAVBAR_HEIGHT, PAGE_HEADER_HEIGHT, SIDEBAR_WIDTH };
+export { FORM_MIDDLE_GAP_WIDTH, FORM_SIDE_FIELDS_WIDTH, NAVBAR_HEIGHT, PAGE_HEADER_HEIGHT, SIDEBAR_WIDTH };

package/dist/src/constants/file.js

@@ -0,0 +1,27 @@
+const IMAGE_EXTENSIONS = [
+  "png",
+  "jpg",
+  "jpeg",
+  "webp",
+  "gif",
+  "avif",
+  "svg",
+  "bmp",
+  "tiff"
+];
+const VIDEO_EXTENSIONS = [
+  "mp4",
+  "mov",
+  "webm",
+  "ogg",
+  "avi",
+  "mkv",
+  "flv",
+  "wmv",
+  "m4v",
+  "3gp",
+  "ts",
+  "mjpeg"
+];
+
+export { IMAGE_EXTENSIONS, VIDEO_EXTENSIONS };

package/dist/src/shared/list-items.js

@@ -0,0 +1,3 @@
+const DO_NOT_FETCH_KEY = "do-not-fetch";
+
+export { DO_NOT_FETCH_KEY };

package/dist/src/shared/utils/debounce.js

@@ -0,0 +1,14 @@
+const debounce = (fn, delay = 100) => {
+  let timer;
+  const debouncedFn = (...args) => {
+    if (timer) clearTimeout(timer);
+    timer = setTimeout(() => fn(...args), delay);
+  };
+  debouncedFn.clear = () => {
+    if (timer) clearTimeout(timer);
+    timer = void 0;
+  };
+  return debouncedFn;
+};
+
+export { debounce };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@yimingliao/cms",
-  "version": "0.0.146",
+  "version": "0.0.147",
   "author": "Yiming Liao",
   "license": "MIT",
   "type": "module",