@yimingliao/cms 0.0.146 → 0.0.147

package/dist/src/client/interfaces/components/ui/cards/resource-card/card-status-bar.js

@@ -0,0 +1,51 @@
+import { jsx, jsxs } from 'react/jsx-runtime';
+import 'react';
+import 'ua-parser-js';
+import { cn } from '../../../../../applications/shadcn/utils.js';
+import 'next/navigation';
+import 'next/link';
+import '../../../../../../constants/paths/auth.js';
+import '../../../../../../constants/paths/main.js';
+import '../../../../../../constants/paths/resources.js';
+import '../../../../../../constants/redirect-paths.js';
+import '@radix-ui/react-avatar';
+import '../../../shadcn/badge.js';
+import '../../../shadcn/button.js';
+import '@radix-ui/react-collapsible';
+import '@radix-ui/react-dialog';
+import 'lucide-react';
+import '@radix-ui/react-dropdown-menu';
+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 'intor/react';
+import 'mime-types';
+import { Badge } from '../../display/badge.js';
+
+function CardStatusBar({
+  badge,
+  className,
+  children
+}) {
+  return /* @__PURE__ */ jsx("div", { className: cn("h-10", "relative z-10", "bg-background"), children: /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: cn(
+        className,
+        "size-full",
+        "flex items-center gap-1",
+        "px-4 py-1",
+        "bg-background group-hover:bg-accent/50 transition"
+      ),
+      children: [
+        children,
+        badge && /* @__PURE__ */ jsx("div", { className: "absolute top-[50%] left-[50%] translate-x-[-50%] translate-y-[-50%]", children: /* @__PURE__ */ jsx(Badge, { variant: "secondary", className: "h-6 w-20", children: badge }) })
+      ]
+    }
+  ) });
+}
+
+export { CardStatusBar };

package/dist/src/client/interfaces/components/ui/cards/resource-card/card-text-content.js

@@ -0,0 +1,38 @@
+import { jsx, jsxs } from 'react/jsx-runtime';
+import 'react';
+import 'ua-parser-js';
+import { cn } from '../../../../../applications/shadcn/utils.js';
+import 'next/navigation';
+import '@radix-ui/react-avatar';
+import '../../../shadcn/badge.js';
+import '../../../shadcn/button.js';
+import '@radix-ui/react-collapsible';
+import '@radix-ui/react-dialog';
+import 'lucide-react';
+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 '../../../shadcn/sidebar.js';
+import '@radix-ui/react-tooltip';
+
+function CardTextContent({ title, children }) {
+  return /* @__PURE__ */ jsx("div", { className: cn("relative z-10 h-fit", "mt-auto", "bg-background"), children: /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: cn(
+        "flex flex-col",
+        "bg-background group-hover:bg-accent/50 transition"
+      ),
+      children: [
+        /* @__PURE__ */ jsx(Separator, {}),
+        /* @__PURE__ */ jsx("div", { className: cn("h-10", "px-4", "flex items-center"), children: /* @__PURE__ */ jsx("p", { className: "truncate", children: title }) }),
+        children && /* @__PURE__ */ jsx(Separator, {}),
+        children && /* @__PURE__ */ jsx("div", { className: cn("px-4 py-2", "text-sm"), children })
+      ]
+    }
+  ) });
+}
+
+export { CardTextContent };

package/dist/src/client/interfaces/components/ui/cards/resource-card/resource-card.js

@@ -0,0 +1,77 @@
+import { jsx, jsxs } from 'react/jsx-runtime';
+import Link from 'next/link';
+import '../../../../../../constants/paths/auth.js';
+import '../../../../../../constants/paths/main.js';
+import '../../../../../../constants/paths/resources.js';
+import { NEW_TAB_REL, NEW_TAB_TARGET } from '../../../../../../constants/anchor.js';
+import '../../../../../../constants/redirect-paths.js';
+import 'react';
+import 'ua-parser-js';
+import { cn } from '../../../../../applications/shadcn/utils.js';
+import 'next/navigation';
+import '@radix-ui/react-avatar';
+import '../../../shadcn/badge.js';
+import '../../../shadcn/button.js';
+import { Card } from '../../../shadcn/card.js';
+import '@radix-ui/react-collapsible';
+import '@radix-ui/react-dialog';
+import 'lucide-react';
+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 '../../../shadcn/sidebar.js';
+import '@radix-ui/react-tooltip';
+import { CardStatusBar } from './card-status-bar.js';
+import { CardTextContent } from './card-text-content.js';
+
+function ResourceCard({
+  // link
+  href = "",
+  openNewTab = false,
+  anchorProps,
+  // card
+  cardStatusBarProps,
+  cardTextContentProps,
+  // base
+  className = "",
+  style,
+  children
+}) {
+  return /* @__PURE__ */ jsx(
+    Link,
+    {
+      href: href ?? "",
+      target: openNewTab ? NEW_TAB_TARGET : void 0,
+      rel: openNewTab ? NEW_TAB_REL : void 0,
+      onClick: (e) => e.stopPropagation(),
+      ...anchorProps,
+      children: /* @__PURE__ */ jsxs(
+        Card,
+        {
+          className: cn(
+            "gap-0 p-0",
+            // reset
+            "group",
+            "hover:bg-accent/50 transition-colors duration-100",
+            // button-hover like
+            "relative size-full",
+            "flex flex-col",
+            "overflow-hidden",
+            className
+          ),
+          style,
+          children: [
+            /* @__PURE__ */ jsx(CardStatusBar, { ...cardStatusBarProps }),
+            children,
+            children && /* @__PURE__ */ jsx(Separator, {}),
+            /* @__PURE__ */ jsx(CardTextContent, { ...cardTextContentProps })
+          ]
+        }
+      )
+    }
+  );
+}
+
+export { ResourceCard };

package/dist/src/client/interfaces/components/ui/display/array-list.js

@@ -0,0 +1,69 @@
+"use client";
+import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
+import Link from 'next/link';
+import { useState } from 'react';
+import '../../../../../constants/paths/auth.js';
+import '../../../../../constants/paths/main.js';
+import '../../../../../constants/paths/resources.js';
+import { NEW_TAB_REL, NEW_TAB_TARGET } from '../../../../../constants/anchor.js';
+import '../../../../../constants/redirect-paths.js';
+import 'ua-parser-js';
+import { cn } from '../../../../applications/shadcn/utils.js';
+import 'next/navigation';
+import '@radix-ui/react-avatar';
+import '../../shadcn/badge.js';
+import '../../shadcn/button.js';
+import '@radix-ui/react-collapsible';
+import '@radix-ui/react-dialog';
+import 'lucide-react';
+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 '../../shadcn/sidebar.js';
+import '@radix-ui/react-tooltip';
+import { FieldBody } from '../form/field-body.js';
+import 'mime-types';
+import 'intor/react';
+
+function ArrayList({ values, isLink, isLoading }) {
+  const [expandedIndex, setExpandedIndex] = useState(null);
+  const toggle = (i) => setExpandedIndex((p) => p === i ? null : i);
+  const items = values?.filter((v) => typeof v === "string") ?? [];
+  if (items.length === 0) return /* @__PURE__ */ jsx(FieldBody, { isEmpty: true });
+  return /* @__PURE__ */ jsx(Fragment, { children: items.map((value, index) => {
+    const expanded = expandedIndex === index;
+    return /* @__PURE__ */ jsxs(
+      FieldBody,
+      {
+        isLoading,
+        className: cn(expanded ? "cursor-zoom-out" : "cursor-zoom-in"),
+        onClick: () => toggle(index),
+        children: [
+          /* @__PURE__ */ jsxs("div", { className: "flex-center absolute top-0 left-0 z-10 h-full", children: [
+            /* @__PURE__ */ jsx("span", { className: "min-w-10 px-2 text-center text-sm opacity-50", children: index + 1 }),
+            /* @__PURE__ */ jsx(Separator, { orientation: "vertical", className: "py-2" })
+          ] }),
+          isLink ? /* @__PURE__ */ jsx(
+            Link,
+            {
+              href: value,
+              target: NEW_TAB_TARGET,
+              rel: NEW_TAB_REL,
+              className: cn(
+                "ml-11 text-blue-500/80 underline underline-offset-2",
+                !expanded && "line-clamp-1"
+              ),
+              onClick: (e) => e.stopPropagation(),
+              children: value
+            }
+          ) : /* @__PURE__ */ jsx("p", { className: cn("ml-11", !expanded && "line-clamp-1"), children: value })
+        ]
+      },
+      `${value}-${index}`
+    );
+  }) });
+}
+
+export { ArrayList };

package/dist/src/client/interfaces/components/ui/display/badge.js

@@ -0,0 +1,41 @@
+import { jsx } from 'react/jsx-runtime';
+import 'react';
+import 'ua-parser-js';
+import { cn } from '../../../../applications/shadcn/utils.js';
+import 'next/navigation';
+import '@radix-ui/react-avatar';
+import { Badge as Badge$1 } from '../../shadcn/badge.js';
+import '../../shadcn/button.js';
+import '@radix-ui/react-collapsible';
+import '@radix-ui/react-dialog';
+import 'lucide-react';
+import '@radix-ui/react-dropdown-menu';
+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 { Spinner } from '../../shadcn/spinner.js';
+import '@radix-ui/react-tooltip';
+
+function Badge({
+  // Processing States
+  isLoading = false,
+  // Base
+  variant = "secondary",
+  className,
+  children,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    Badge$1,
+    {
+      variant,
+      className: cn("h-6 w-20", className),
+      ...props,
+      children: /* @__PURE__ */ jsx("span", { className: "truncate", children: isLoading ? /* @__PURE__ */ jsx(Spinner, {}) : children })
+    }
+  );
+}
+
+export { Badge };

package/dist/src/client/interfaces/components/ui/display/html-display.js

@@ -0,0 +1,32 @@
+import { jsx } from 'react/jsx-runtime';
+import 'react';
+import 'ua-parser-js';
+import { cn } from '../../../../applications/shadcn/utils.js';
+import 'next/navigation';
+
+function HtmlDisplay({
+  html = "",
+  textOnly,
+  className = "",
+  ...props
+}) {
+  const content = textOnly ? normalizeHtmlText(html) : html ?? "";
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: cn(
+        className,
+        "ck ck-content"
+        // CKEditor styles prefix: .ck (ckeditor.css)
+      ),
+      dangerouslySetInnerHTML: { __html: content },
+      ...props
+    }
+  );
+}
+function normalizeHtmlText(html) {
+  if (!html) return "";
+  return html.replace(/<br\s*\/?>/gi, " ").replace(/<[^>]+>/g, "").replace(/\r?\n|\r/g, " ").replace(/\s{2,}/g, " ").trim();
+}
+
+export { HtmlDisplay };

package/dist/src/client/interfaces/components/ui/display/object-array-list.js

@@ -0,0 +1,75 @@
+"use client";
+import { jsx, jsxs } from 'react/jsx-runtime';
+import Link from 'next/link';
+import { useState } from 'react';
+import '../../../../../constants/paths/auth.js';
+import '../../../../../constants/paths/main.js';
+import '../../../../../constants/paths/resources.js';
+import { NEW_TAB_REL, NEW_TAB_TARGET } from '../../../../../constants/anchor.js';
+import '../../../../../constants/redirect-paths.js';
+import 'ua-parser-js';
+import { cn } from '../../../../applications/shadcn/utils.js';
+import 'next/navigation';
+import '@radix-ui/react-avatar';
+import '../../shadcn/badge.js';
+import '../../shadcn/button.js';
+import '@radix-ui/react-collapsible';
+import '@radix-ui/react-dialog';
+import 'lucide-react';
+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 '../../shadcn/sidebar.js';
+import '@radix-ui/react-tooltip';
+import { FieldBody } from '../form/field-body.js';
+import 'mime-types';
+import 'intor/react';
+
+function ObjectArrayList({
+  items,
+  fields,
+  isLoading
+}) {
+  const [expandedIndex, setExpandedIndex] = useState(null);
+  const toggle = (i) => setExpandedIndex((p) => p === i ? null : i);
+  const validItems = items?.filter(
+    (item) => typeof item === "object" && item !== null && Object.values(item).every((v) => typeof v === "string")
+  ) ?? [];
+  if (!fields?.length || validItems.length === 0) return /* @__PURE__ */ jsx(FieldBody, { isEmpty: true });
+  return /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-2", children: validItems.map((item, index) => {
+    const expanded = expandedIndex === index;
+    return /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-1", children: fields.map((field) => /* @__PURE__ */ jsxs(
+      FieldBody,
+      {
+        isLoading,
+        className: cn(expanded ? "cursor-zoom-out" : "cursor-zoom-in"),
+        onClick: () => toggle(index),
+        children: [
+          /* @__PURE__ */ jsxs("div", { className: "flex-center absolute top-0 left-0 z-10 h-full", children: [
+            /* @__PURE__ */ jsx("span", { className: "min-w-10 px-2 text-center text-sm opacity-50", children: index + 1 }),
+            /* @__PURE__ */ jsx(Separator, { orientation: "vertical", className: "py-2" })
+          ] }),
+          field.isLink ? /* @__PURE__ */ jsx(
+            Link,
+            {
+              href: item[field.key] ?? "",
+              target: NEW_TAB_TARGET,
+              rel: NEW_TAB_REL,
+              className: cn(
+                "ml-11 text-blue-500/80 underline underline-offset-2",
+                !expanded && "line-clamp-1"
+              ),
+              onClick: (e) => e.stopPropagation(),
+              children: item[field.key]
+            }
+          ) : /* @__PURE__ */ jsx("p", { className: cn("ml-11", !expanded && "line-clamp-1"), children: item[field.key] })
+        ]
+      },
+      field.key
+    )) }, index);
+  }) });
+}
+
+export { ObjectArrayList };

package/dist/src/client/interfaces/components/ui/features/accordion/accordion-container.js

@@ -0,0 +1,31 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+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 'lucide-react';
+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 '../../../shadcn/sidebar.js';
+import '@radix-ui/react-tooltip';
+
+function AccordionContainer({
+  children,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-6", ...props, children: [
+    /* @__PURE__ */ jsx(Separator, { className: "my-4" }),
+    children
+  ] });
+}
+
+export { AccordionContainer };

package/dist/src/client/interfaces/components/ui/features/accordion/accordion-header.js

@@ -0,0 +1,34 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { useTranslator } from 'intor/react';
+import 'react';
+import 'ua-parser-js';
+import { cn } from '../../../../../applications/shadcn/utils.js';
+import 'next/navigation';
+
+function AccordionHeader({
+  isRelated = false,
+  count,
+  children
+}) {
+  const { t } = useTranslator();
+  return /* @__PURE__ */ jsxs("div", { className: "flex h-full items-center gap-3 font-medium", children: [
+    count !== void 0 && /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: cn(
+          "flex-center",
+          "h-5 rounded-full px-3",
+          "bg-primary-foreground",
+          "shadow-xs"
+        ),
+        children: /* @__PURE__ */ jsx("p", { className: "text-xs", children: count })
+      }
+    ),
+    /* @__PURE__ */ jsxs("p", { className: cn("text-sm", "font-500"), children: [
+      isRelated && t("resources.related.text"),
+      children
+    ] })
+  ] });
+}
+
+export { AccordionHeader as default };

package/dist/src/client/interfaces/components/ui/features/accordion/accordion.js

@@ -0,0 +1,81 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { CircleChevronDown } from 'lucide-react';
+import { useState, useRef, useEffect } from 'react';
+import 'ua-parser-js';
+import { cn } from '../../../../../applications/shadcn/utils.js';
+import 'next/navigation';
+import AccordionHeader from './accordion-header.js';
+
+function Accordion({
+  initialOpen = false,
+  deps,
+  // children
+  children,
+  accordionHeaderProps,
+  // base
+  hasBorder,
+  className,
+  ...props
+}) {
+  const [isOpen, setIsOpen] = useState(initialOpen);
+  const containerRef = useRef(null);
+  useEffect(() => {
+    const el = containerRef.current;
+    if (el) el.style.maxHeight = initialOpen ? `${el.scrollHeight}px` : "0";
+  }, [initialOpen]);
+  useEffect(() => {
+    const el = containerRef.current;
+    if (el) el.style.maxHeight = isOpen ? `${el.scrollHeight}px` : "0";
+  }, [isOpen, deps]);
+  return /* @__PURE__ */ jsxs(
+    "section",
+    {
+      className: cn(
+        className,
+        "rounded-lg",
+        hasBorder && "border-secondary overflow-hidden border-2"
+      ),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsxs(
+          "div",
+          {
+            onClick: () => setIsOpen((prev) => !prev),
+            className: cn(
+              "h-9 w-full",
+              "flex items-center justify-between",
+              "px-3",
+              "bg-secondary",
+              "cursor-pointer",
+              hasBorder ? "" : "border-secondary rounded-lg border",
+              "transition"
+            ),
+            children: [
+              accordionHeaderProps && /* @__PURE__ */ jsx(AccordionHeader, { ...accordionHeaderProps }),
+              /* @__PURE__ */ jsx(
+                "div",
+                {
+                  className: cn("opacity-50", !isOpen && "-rotate-90", "transition"),
+                  children: /* @__PURE__ */ jsx(CircleChevronDown, { className: "size-5" })
+                }
+              )
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: cn(
+              "transition-[max-height] duration-300",
+              "overflow-hidden"
+            ),
+            ref: containerRef,
+            children: /* @__PURE__ */ jsx("div", { className: "p-6", children })
+          }
+        )
+      ]
+    }
+  );
+}
+
+export { Accordion };

package/dist/src/client/interfaces/components/ui/features/expandable-list/expand-bar.js

@@ -0,0 +1,39 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { CirclePlus, CircleMinus } from 'lucide-react';
+import 'react';
+import 'ua-parser-js';
+import { cn } from '../../../../../applications/shadcn/utils.js';
+import 'next/navigation';
+import '@radix-ui/react-avatar';
+import '../../../shadcn/badge.js';
+import '../../../shadcn/button.js';
+import '@radix-ui/react-collapsible';
+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 '../../../shadcn/sidebar.js';
+import '@radix-ui/react-tooltip';
+
+function ExpandBar({ isExpand }) {
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: cn(
+        "w-full",
+        "flex-center gap-1",
+        "opacity-50 group-hover:opacity-100",
+        "transition"
+      ),
+      children: [
+        /* @__PURE__ */ jsx(Separator, { className: "my-3 flex-1" }),
+        !isExpand ? /* @__PURE__ */ jsx(CirclePlus, { className: "text-base-content size-5 min-w-5" }) : /* @__PURE__ */ jsx(CircleMinus, { className: "text-base-content size-5 min-w-5" }),
+        /* @__PURE__ */ jsx(Separator, { className: "my-3 flex-1" })
+      ]
+    }
+  );
+}
+
+export { ExpandBar };

package/dist/src/client/interfaces/components/ui/features/expandable-list/expandable-list-content.js

@@ -0,0 +1,49 @@
+"use client";
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { useRef, useEffect } from 'react';
+import 'ua-parser-js';
+import { cn } from '../../../../../applications/shadcn/utils.js';
+import 'next/navigation';
+
+const COLLAPSED_HEIGHT = 48;
+function ExpandableListContent({
+  item,
+  items,
+  isExpand,
+  isDisabled,
+  isUnique,
+  onOverflowChange,
+  children
+}) {
+  const containerRef = useRef(null);
+  useEffect(() => {
+    const el = containerRef.current;
+    if (!el) return;
+    const height = el.scrollHeight;
+    onOverflowChange?.(height > COLLAPSED_HEIGHT);
+    if (isDisabled) {
+      el.style.maxHeight = "0px";
+      return;
+    }
+    el.style.maxHeight = isExpand ? `${height}px` : `${COLLAPSED_HEIGHT}px`;
+  }, [isExpand, isDisabled, items.length, children, onOverflowChange]);
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      ref: containerRef,
+      className: cn("overflow-hidden", "flex flex-wrap gap-1", "duration-150"),
+      children: [
+        children,
+        items.map((eachItem, idx) => {
+          const matched = isUnique && eachItem === item;
+          return /* @__PURE__ */ jsxs("span", { children: [
+            /* @__PURE__ */ jsx("span", { className: cn(matched && "text-error"), children: eachItem }),
+            idx !== items.length - 1 && ","
+          ] }, `${eachItem}-${idx}`);
+        })
+      ]
+    }
+  );
+}
+
+export { ExpandableListContent };