@docubook/flame 1.0.0-beta.80 → 1.0.0

package/.docu/components/base/dropdown.tsx

@@ -1,94 +0,0 @@
-"use client";
-
-import { type HTMLAttributes, type ReactNode, forwardRef, useRef, useEffect } from "react";
-import { cn } from "../../node/utils";
-
-export interface DropdownProps extends HTMLAttributes<HTMLDetailsElement> {
-  align?: "start" | "end";
-  disabled?: boolean;
-  trigger?: ReactNode;
-  children?: ReactNode;
-}
-
-export const Dropdown = forwardRef<HTMLDetailsElement, DropdownProps>(
-  ({ className, align = "start", disabled = false, trigger, children, ...props }, ref) => {
-    const detailsRef = useRef<HTMLDetailsElement>(null);
-
-    // Close on click outside
-    useEffect(() => {
-      const handler = (e: MouseEvent) => {
-        if (detailsRef.current && !detailsRef.current.contains(e.target as Node)) {
-          detailsRef.current.open = false;
-        }
-      };
-      document.addEventListener("click", handler);
-      return () => document.removeEventListener("click", handler);
-    }, []);
-
-    return (
-      <details
-        ref={(el) => {
-          (detailsRef as React.MutableRefObject<HTMLDetailsElement | null>).current = el;
-          if (typeof ref === "function") ref(el);
-          else if (ref) ref.current = el;
-        }}
-        className={cn("relative", disabled && "pointer-events-none opacity-50", className)}
-        {...props}
-      >
-        <summary className="cursor-pointer list-none [&::-webkit-details-marker]:hidden">
-          {trigger}
-        </summary>
-        <ul
-          className={cn(
-            "bg-base-100 rounded-box border-base-300 absolute z-50 mt-1 w-full min-w-[200px] space-y-1 border p-2 shadow-lg",
-            align === "end" ? "right-0" : "left-0"
-          )}
-        >
-          {children}
-        </ul>
-      </details>
-    );
-  }
-);
-Dropdown.displayName = "Dropdown";
-
-export interface DropdownItemProps extends HTMLAttributes<HTMLLIElement> {
-  children?: ReactNode;
-}
-
-export const DropdownItem = forwardRef<HTMLLIElement, DropdownItemProps>(
-  ({ className, children, ...props }, ref) => (
-    <li ref={ref} className={cn(className)} role="menuitem" {...props}>
-      {children}
-    </li>
-  )
-);
-DropdownItem.displayName = "DropdownItem";
-
-export const DropdownLink = forwardRef<
-  HTMLAnchorElement,
-  HTMLAttributes<HTMLAnchorElement> & { href?: string }
->(({ className, children, href, ...props }, ref) => (
-  <li role="menuitem">
-    <a ref={ref} href={href} className={cn(className)} {...props}>
-      {children}
-    </a>
-  </li>
-));
-DropdownLink.displayName = "DropdownLink";
-
-export const DropdownLabel = forwardRef<HTMLLIElement, HTMLAttributes<HTMLLIElement>>(
-  ({ className, children, ...props }, ref) => (
-    <li ref={ref} className={cn("menu-title", className)} {...props}>
-      {children}
-    </li>
-  )
-);
-DropdownLabel.displayName = "DropdownLabel";
-
-export const DropdownDivider = forwardRef<HTMLLIElement, HTMLAttributes<HTMLLIElement>>(
-  ({ className, ...props }, ref) => (
-    <li ref={ref} className={cn("border-base-200 my-1 border-t", className)} {...props} />
-  )
-);
-DropdownDivider.displayName = "DropdownDivider";

package/.docu/components/base/input.tsx

@@ -1,53 +0,0 @@
-import { forwardRef } from "react";
-import { cn } from "../../node/utils";
-
-type InputColor =
-  | "neutral"
-  | "primary"
-  | "secondary"
-  | "accent"
-  | "info"
-  | "success"
-  | "warning"
-  | "error";
-type InputSize = "xs" | "sm" | "md" | "lg" | "xl";
-
-interface InputProps extends React.InputHTMLAttributes<HTMLInputElement> {
-  color?: InputColor;
-  inputSize?: InputSize;
-  ghost?: boolean;
-}
-
-export const Input = forwardRef<HTMLInputElement, InputProps>(
-  ({ className, color, inputSize, ghost, ...props }, ref) => {
-    return (
-      <input
-        ref={ref}
-        className={cn(
-          "input",
-          ghost && "input-ghost",
-          color && `input-${color}`,
-          inputSize && `input-${inputSize}`,
-          className
-        )}
-        {...props}
-      />
-    );
-  }
-);
-Input.displayName = "Input";
-
-interface InputGroupProps extends React.LabelHTMLAttributes<HTMLLabelElement> {
-  children: React.ReactNode;
-}
-
-export const InputGroup = forwardRef<HTMLLabelElement, InputGroupProps>(
-  ({ children, className, ...props }, ref) => {
-    return (
-      <label ref={ref} className={cn("input", className)} {...props}>
-        {children}
-      </label>
-    );
-  }
-);
-InputGroup.displayName = "InputGroup";

package/.docu/components/base/kbd.tsx

@@ -1,51 +0,0 @@
-import { forwardRef } from "react";
-import {
-  ArrowUp,
-  ArrowDown,
-  ArrowLeft,
-  ArrowRight,
-  Command,
-  Option,
-  ChevronUp,
-  ArrowBigUp,
-  CircleArrowOutUpLeft,
-  Space,
-  Delete,
-  ArrowRightToLine,
-} from "lucide-react";
-import { cn } from "../../node/utils";
-
-type KbdSize = "xs" | "sm" | "md" | "lg" | "xl";
-
-interface KbdProps extends React.HTMLAttributes<HTMLElement> {
-  children: React.ReactNode;
-  size?: KbdSize;
-}
-
-export const Kbd = forwardRef<HTMLElement, KbdProps>(
-  ({ children, className, size, ...props }, ref) => {
-    return (
-      <kbd ref={ref} className={cn("kbd", size && `kbd-${size}`, className)} {...props}>
-        {children}
-      </kbd>
-    );
-  }
-);
-Kbd.displayName = "Kbd";
-
-const iconSize = 12;
-
-export const FnKey = {
-  Cmd: () => <Command size={iconSize} />,
-  Option: () => <Option size={iconSize} />,
-  Ctrl: () => <ChevronUp size={iconSize} />,
-  Shift: () => <ArrowBigUp size={iconSize} />,
-  Esc: () => <CircleArrowOutUpLeft size={iconSize} />,
-  Space: () => <Space size={iconSize} />,
-  Delete: () => <Delete size={iconSize} />,
-  Tab: () => <ArrowRightToLine size={iconSize} />,
-  Up: () => <ArrowUp size={iconSize} />,
-  Down: () => <ArrowDown size={iconSize} />,
-  Left: () => <ArrowLeft size={iconSize} />,
-  Right: () => <ArrowRight size={iconSize} />,
-};

package/.docu/components/base/modal.tsx

@@ -1,56 +0,0 @@
-"use client";
-
-import { forwardRef, useRef, useCallback } from "react";
-import { cn } from "../../node/utils";
-
-interface ModalProps extends React.DialogHTMLAttributes<HTMLDialogElement> {
-  children: React.ReactNode;
-  closeOnBackdrop?: boolean;
-  placement?: "top" | "middle" | "bottom";
-  boxClassName?: string;
-}
-
-export const Modal = forwardRef<HTMLDialogElement, ModalProps>(
-  ({ children, className, closeOnBackdrop = true, placement, boxClassName, ...props }, ref) => {
-    const placementClass = placement ? `modal-${placement}` : "";
-
-    return (
-      <dialog ref={ref} className={cn("modal", placementClass, className)} {...props}>
-        <div className={cn("modal-box", boxClassName)}>{children}</div>
-        {closeOnBackdrop && (
-          <form method="dialog" className="modal-backdrop">
-            <button>esc</button>
-          </form>
-        )}
-      </dialog>
-    );
-  }
-);
-Modal.displayName = "Modal";
-
-export function ModalAction({
-  children,
-  className,
-}: {
-  children: React.ReactNode;
-  className?: string;
-}) {
-  return (
-    <div className={cn("modal-action", className)}>
-      <form method="dialog">{children}</form>
-    </div>
-  );
-}
-
-export function useModal() {
-  const ref = useRef<HTMLDialogElement>(null);
-  const open = useCallback(() => {
-    ref.current?.showModal();
-    setTimeout(() => {
-      const input = ref.current?.querySelector<HTMLElement>("input, [autofocus]");
-      input?.focus();
-    }, 0);
-  }, []);
-  const close = useCallback(() => ref.current?.close(), []);
-  return { ref, open, close };
-}

package/.docu/components/base/navbar.tsx

@@ -1,132 +0,0 @@
-import type { ReactNode, CSSProperties } from "react";
-
-export interface NavbarProps {
-  id?: string;
-  children?: ReactNode;
-  className?: string;
-  style?: CSSProperties;
-}
-
-export interface LogoProps {
-  src?: string;
-  alt?: string;
-  text?: string;
-  href?: string;
-}
-
-export interface NavMenuItem {
-  title: string;
-  href: string;
-  isExternal?: boolean;
-}
-
-export interface NavMenuProps {
-  items: NavMenuItem[];
-  onItemClick?: () => void;
-  activePath?: string;
-}
-
-export function Navbar({ id, children, className, style }: NavbarProps) {
-  return (
-    <nav id={id} className={className} style={style}>
-      {children}
-    </nav>
-  );
-}
-
-export function NavbarContainer({
-  start,
-  center,
-  end,
-  className,
-}: {
-  start?: ReactNode;
-  center?: ReactNode;
-  end?: ReactNode;
-  className?: string;
-}) {
-  return (
-    <div className={className}>
-      {start && <div className="flex-start">{start}</div>}
-      {center && <div className="flex-center">{center}</div>}
-      {end && <div className="flex-none">{end}</div>}
-    </div>
-  );
-}
-
-export function Logo({ src, alt, text, href = "/" }: LogoProps) {
-  return (
-    <a href={href} className="logo-link">
-      {src ? (
-        <img src={src} alt={alt || text || "Logo"} className="logo-image" />
-      ) : (
-        <span className="logo-text">{text}</span>
-      )}
-    </a>
-  );
-}
-
-export function NavMenu({ items, activePath }: NavMenuProps) {
-  return (
-    <ul className="nav-menu">
-      {items.map((item) => {
-        const isActive = activePath
-          ? item.href === "/"
-            ? activePath === "/"
-            : activePath === item.href || activePath.startsWith(item.href + "/")
-          : false;
-        return (
-          <li key={item.title + item.href}>
-            <a
-              href={item.href}
-              className={`nav-menu-item ${isActive ? "active" : ""}`}
-              target={item.isExternal ? "_blank" : undefined}
-              rel={item.isExternal ? "noopener noreferrer" : undefined}
-            >
-              {item.title}
-            </a>
-          </li>
-        );
-      })}
-    </ul>
-  );
-}
-
-export function NavMenuLink({ item, isActive }: { item: NavMenuItem; isActive?: boolean }) {
-  return (
-    <a
-      href={item.href}
-      className={`nav-menu-item ${isActive ? "active" : ""}`}
-      target={item.isExternal ? "_blank" : undefined}
-      rel={item.isExternal ? "noopener noreferrer" : undefined}
-    >
-      {item.title}
-    </a>
-  );
-}
-
-export function NavToggle({
-  isOpen,
-  onClick,
-  label = "Toggle navigation",
-}: {
-  isOpen: boolean;
-  onClick: () => void;
-  label?: string;
-}) {
-  return (
-    <button
-      type="button"
-      onClick={onClick}
-      aria-label={label}
-      aria-expanded={isOpen}
-      className="nav-toggle"
-    >
-      <span className={`toggle-icon ${isOpen ? "open" : ""}`}>{isOpen ? "✕" : "☰"}</span>
-    </button>
-  );
-}
-
-export function NavbarVersion({ version }: { version: string }) {
-  return <span className="navbar-version">v{version}</span>;
-}

package/.docu/components/base/pagination/index.ts

@@ -1,21 +0,0 @@
-export { PaginationDocs } from "./pagination-docs";
-export {
-  Pagination,
-  PaginationItem,
-  PaginationButtons,
-  PaginationRange,
-  PaginationInfo,
-  PaginationFull,
-} from "./pagination-numbers";
-export { getPaginationRange } from "./types";
-export type {
-  PaginationRootProps as PaginationProps,
-  PaginationItemProps,
-  PaginationRangeProps,
-  PaginationButtonsProps,
-  PaginationInfoProps,
-  PaginationFullProps,
-  PaginationDocsProps,
-  PaginationSize,
-  PaginationVariant,
-} from "./types";

package/.docu/components/base/pagination/pagination-docs.tsx

@@ -1,39 +0,0 @@
-import { cn } from "../../../node/utils";
-import { ChevronLeft, ChevronRight } from "lucide-react";
-import type { PaginationDocsProps } from "./types";
-
-export function PaginationDocs({ prev, next, className }: PaginationDocsProps) {
-  return (
-    <div className={cn("grid grow grid-cols-1 gap-4 py-8 sm:grid-cols-2", className)}>
-      <div>
-        {prev && (
-          <a
-            href={prev.href}
-            className="btn btn-outline border-base-300 items-start! py-2! h-auto w-full flex-col pl-4 no-underline"
-          >
-            <span className="text-muted-foreground flex items-center text-xs">
-              <ChevronLeft className="mr-1 h-4 w-4" />
-              Previous
-            </span>
-            <span className="text-base-content mt-1 text-sm font-medium">{prev.title}</span>
-          </a>
-        )}
-      </div>
-
-      <div>
-        {next && (
-          <a
-            href={next.href}
-            className="btn btn-outline border-base-300 items-end! py-2! h-auto w-full flex-col pr-4 no-underline"
-          >
-            <span className="text-muted-foreground flex items-center text-xs">
-              Next
-              <ChevronRight className="ml-1 h-4 w-4" />
-            </span>
-            <span className="text-base-content mt-1 text-sm font-medium">{next.title}</span>
-          </a>
-        )}
-      </div>
-    </div>
-  );
-}