tinacms 0.0.0-e024aec-20250526035050 → 0.0.0-e0bbd2e-20251203224419

package/dist/rich-text/static.d.ts

@@ -0,0 +1,154 @@
+/**
+ * This is a static-ready version of the TinaMarkdown component.
+ * The primary change is the removal of the `MemoNode` wrapper, which used
+ * the `React.useMemo` hook. This hook is for client-side performance
+ * optimization and is not needed for server-side rendering (SSR).
+ * By rendering the `Node` component directly, the component becomes
+ * fully static and can be rendered on the server.
+ */
+import React from 'react';
+type BaseComponents = {
+    h1?: {
+        children: JSX.Element;
+    };
+    h2?: {
+        children: JSX.Element;
+    };
+    h3?: {
+        children: JSX.Element;
+    };
+    h4?: {
+        children: JSX.Element;
+    };
+    h5?: {
+        children: JSX.Element;
+    };
+    h6?: {
+        children: JSX.Element;
+    };
+    p?: {
+        children: JSX.Element;
+    };
+    a?: {
+        url: string;
+        children: JSX.Element;
+    };
+    italic?: {
+        children: JSX.Element;
+    };
+    bold?: {
+        children: JSX.Element;
+    };
+    strikethrough?: {
+        children: JSX.Element;
+    };
+    underline?: {
+        children: JSX.Element;
+    };
+    code?: {
+        children: JSX.Element;
+    };
+    text?: {
+        children: string;
+    };
+    ul?: {
+        children: JSX.Element;
+    };
+    ol?: {
+        children: JSX.Element;
+    };
+    li?: {
+        children: JSX.Element;
+    };
+    lic?: {
+        children: JSX.Element;
+    };
+    /**
+     * @deprecated Use `blockquote` instead. This was incorrectly named and will be removed in a future version.
+     */
+    block_quote?: {
+        children: JSX.Element;
+    };
+    blockquote?: {
+        children: JSX.Element;
+    };
+    code_block?: {
+        lang?: string;
+        value: string;
+    };
+    mermaid?: {
+        value: string;
+    };
+    img?: {
+        url: string;
+        caption?: string;
+        alt?: string;
+    };
+    hr?: {};
+    break?: {};
+    maybe_mdx?: {
+        children: JSX.Element;
+    };
+    html?: {
+        value: string;
+    };
+    html_inline?: {
+        value: string;
+    };
+    table?: {
+        align?: ('left' | 'right' | 'center')[];
+        tableRows: {
+            tableCells: {
+                value: TinaMarkdownContent;
+            }[];
+        }[];
+    };
+    component_missing?: {
+        name: string;
+    };
+};
+type BaseComponentSignature = {
+    [BK in keyof BaseComponents]: (props: BaseComponents[BK]) => JSX.Element;
+};
+/**
+ * Define the allowed components and their props
+ * ```ts
+ * const components:
+ * Components<{
+ *  BlockQuote: {
+ *      children: TinaMarkdownContent;
+ *      authorName: string;
+ *    };
+ *  }> = {
+ *    BlockQuote: (props: {
+ *      children: TinaMarkdownContent;
+ *      authorName: string;
+ *    }) => {
+ *      return (
+ *        <div>
+ *          <blockquote>
+ *            <TinaMarkdown content={props.children} />
+ *            {props.authorName}
+ *          </blockquote>
+ *        </div>
+ *      );
+ *    }
+ *  }
+ * }
+ * ```
+ */
+export type Components<ComponentAndProps extends object> = {
+    [K in keyof ComponentAndProps]: (props: ComponentAndProps[K]) => JSX.Element;
+} & BaseComponentSignature;
+export type TinaMarkdownContent = {
+    type: string;
+    children: TinaMarkdownContent[];
+    [key: string]: any;
+};
+export declare const StaticTinaMarkdown: <CustomComponents extends {
+    [key: string]: object;
+} = any>({ content, components, }: {
+    content: TinaMarkdownContent | TinaMarkdownContent[];
+    components?: Components<{}> | Components<{ [BK in keyof CustomComponents]: (props: CustomComponents[BK]) => JSX.Element; }>;
+}) => React.JSX.Element;
+export {};

package/dist/rich-text/{index.mjs → static.js}

@@ -1,5 +1,5 @@
 import React from "react";
-const TinaMarkdown = ({
+const StaticTinaMarkdown = ({
   content,
   components = {}
 }) => {
@@ -11,64 +11,41 @@ const TinaMarkdown = ({
     return null;
   }
   return /* @__PURE__ */ React.createElement(React.Fragment, null, nodes.map((child, index) => {
-    return /* @__PURE__ */ React.createElement(MemoNode, { components, key: index, child });
+    return /* @__PURE__ */ React.createElement(Node, { components, key: index, child });
   }));
 };
 const Leaf = (props) => {
+  let el = /* @__PURE__ */ React.createElement(React.Fragment, null, props.text);
+  if (props.components.text) {
+    const Component = props.components.text;
+    el = /* @__PURE__ */ React.createElement(Component, null, props.text);
+  }
   if (props.bold) {
-    const { bold, ...rest } = props;
-    if (props.components.bold) {
-      const Component = props.components.bold;
-      return /* @__PURE__ */ React.createElement(Component, null, /* @__PURE__ */ React.createElement(Leaf, { ...rest }));
-    }
-    return /* @__PURE__ */ React.createElement("strong", null, /* @__PURE__ */ React.createElement(Leaf, { ...rest }));
+    const Component = props.components.bold || "strong";
+    el = /* @__PURE__ */ React.createElement(Component, null, el);
   }
   if (props.italic) {
-    const { italic, ...rest } = props;
-    if (props.components.italic) {
-      const Component = props.components.italic;
-      return /* @__PURE__ */ React.createElement(Component, null, /* @__PURE__ */ React.createElement(Leaf, { ...rest }));
-    }
-    return /* @__PURE__ */ React.createElement("em", null, /* @__PURE__ */ React.createElement(Leaf, { ...rest }));
+    const Component = props.components.italic || "em";
+    el = /* @__PURE__ */ React.createElement(Component, null, el);
   }
   if (props.underline) {
-    const { underline, ...rest } = props;
-    if (props.components.underline) {
-      const Component = props.components.underline;
-      return /* @__PURE__ */ React.createElement(Component, null, /* @__PURE__ */ React.createElement(Leaf, { ...rest }));
-    }
-    return /* @__PURE__ */ React.createElement("u", null, /* @__PURE__ */ React.createElement(Leaf, { ...rest }));
+    const Component = props.components.underline || "u";
+    el = /* @__PURE__ */ React.createElement(Component, null, el);
   }
   if (props.strikethrough) {
-    const { strikethrough, ...rest } = props;
-    if (props.components.strikethrough) {
-      const Component = props.components.strikethrough;
-      return /* @__PURE__ */ React.createElement(Component, null, /* @__PURE__ */ React.createElement(Leaf, { ...rest }));
-    }
-    return /* @__PURE__ */ React.createElement("s", null, /* @__PURE__ */ React.createElement(Leaf, { ...rest }));
+    const Component = props.components.strikethrough || "s";
+    el = /* @__PURE__ */ React.createElement(Component, null, el);
   }
   if (props.code) {
-    const { code, ...rest } = props;
-    if (props.components.code) {
-      const Component = props.components.code;
-      return /* @__PURE__ */ React.createElement(Component, null, /* @__PURE__ */ React.createElement(Leaf, { ...rest }));
-    }
-    return /* @__PURE__ */ React.createElement("code", null, /* @__PURE__ */ React.createElement(Leaf, { ...rest }));
-  }
-  if (props.components.text) {
-    const Component = props.components.text;
-    return /* @__PURE__ */ React.createElement(Component, null, props.text);
+    const Component = props.components.code || "code";
+    el = /* @__PURE__ */ React.createElement(Component, null, el);
   }
-  return /* @__PURE__ */ React.createElement(React.Fragment, null, props.text);
+  return el;
 };
-const MemoNode = (props) => {
-  const MNode = React.useMemo(
-    () => /* @__PURE__ */ React.createElement(Node, { ...props }),
-    [JSON.stringify(props)]
-  );
-  return MNode;
-};
-const Node = ({ components, child }) => {
+const Node = ({
+  components,
+  child
+}) => {
   var _a, _b, _c, _d, _e, _f, _g;
   const { children, ...props } = child;
   switch (child.type) {
@@ -79,23 +56,36 @@ const Node = ({ components, child }) => {
     case "h5":
     case "h6":
     case "p":
-    case "blockquote":
     case "ol":
     case "ul":
     case "li":
       if (components[child.type]) {
         const Component2 = components[child.type];
-        return /* @__PURE__ */ React.createElement(Component2, { ...props }, /* @__PURE__ */ React.createElement(TinaMarkdown, { components, content: children }));
+        return /* @__PURE__ */ React.createElement(Component2, { ...props }, /* @__PURE__ */ React.createElement(StaticTinaMarkdown, { components, content: children }));
       }
       return React.createElement(child.type, {
-        children: /* @__PURE__ */ React.createElement(TinaMarkdown, { components, content: children })
+        children: /* @__PURE__ */ React.createElement(StaticTinaMarkdown, { components, content: children })
+      });
+    case "blockquote":
+      const BlockquoteComponent = components.blockquote || components.block_quote;
+      if (BlockquoteComponent) {
+        return /* @__PURE__ */ React.createElement(BlockquoteComponent, { ...props }, /* @__PURE__ */ React.createElement(StaticTinaMarkdown, { components, content: children }));
+      }
+      return React.createElement("blockquote", {
+        children: /* @__PURE__ */ React.createElement(StaticTinaMarkdown, { components, content: children })
       });
     case "lic":
       if (components.lic) {
         const Component2 = components.lic;
-        return /* @__PURE__ */ React.createElement(Component2, { ...props }, /* @__PURE__ */ React.createElement(TinaMarkdown, { components, content: children }));
+        return /* @__PURE__ */ React.createElement(Component2, { ...props }, /* @__PURE__ */ React.createElement(StaticTinaMarkdown, { components, content: children }));
       }
-      return /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement(TinaMarkdown, { components, content: child.children }));
+      return /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement(
+        StaticTinaMarkdown,
+        {
+          components,
+          content: child.children
+        }
+      ));
     case "img":
       if (components[child.type]) {
         const Component2 = components[child.type];
@@ -106,25 +96,25 @@ const Node = ({ components, child }) => {
       if (components[child.type]) {
         const Component2 = components[child.type];
         return (
-          // @ts-ignore FIXME: TinaMarkdownContent needs to be a union of all possible node types
-          /* @__PURE__ */ React.createElement(Component2, { ...props }, /* @__PURE__ */ React.createElement(TinaMarkdown, { components, content: children }))
+          //@ts-ignore Same issue with TinaMarkdown
+          /* @__PURE__ */ React.createElement(Component2, { ...props }, /* @__PURE__ */ React.createElement(StaticTinaMarkdown, { components, content: children }))
         );
       }
-      return (
-        // @ts-ignore FIXME: TinaMarkdownContent needs to be a union of all possible node types
-        /* @__PURE__ */ React.createElement("a", { href: child.url }, /* @__PURE__ */ React.createElement(TinaMarkdown, { components, content: children }))
-      );
-    case "mermaid":
+      return /* @__PURE__ */ React.createElement("a", { href: child.url }, /* @__PURE__ */ React.createElement(StaticTinaMarkdown, { components, content: children }));
     case "code_block": {
-      const value = child.value;
+      let codeString = "";
+      if (Array.isArray(child.children)) {
+        codeString = child.children.map(
+          (line) => Array.isArray(line.children) ? line.children.map((t) => t.text).join("") : ""
+        ).join("\n");
+      } else if (typeof child.value === "string") {
+        codeString = child.value;
+      }
       if (components[child.type]) {
         const Component2 = components[child.type];
-        return (
-          // @ts-ignore FIXME: TinaMarkdownContent needs to be a union of all possible node types
-          /* @__PURE__ */ React.createElement(Component2, { ...props })
-        );
+        return /* @__PURE__ */ React.createElement(Component2, { ...props, value: codeString });
       }
-      return /* @__PURE__ */ React.createElement("pre", null, /* @__PURE__ */ React.createElement("code", null, value));
+      return /* @__PURE__ */ React.createElement("pre", null, /* @__PURE__ */ React.createElement("code", null, codeString));
     }
     case "hr":
       if (components[child.type]) {
@@ -151,37 +141,43 @@ const Node = ({ components, child }) => {
           const firstRowHeader = (_a = child.props) == null ? void 0 : _a.firstRowHeader;
           const rows2 = (firstRowHeader ? (_b = child.props) == null ? void 0 : _b.tableRows.filter((_, i) => i !== 0) : (_c = child.props) == null ? void 0 : _c.tableRows) || [];
           const header = (_e = (_d = child.props) == null ? void 0 : _d.tableRows) == null ? void 0 : _e.at(0);
-          const TableComponent2 = components["table"] || ((props2) => /* @__PURE__ */ React.createElement("table", { ...props2 }));
+          const TableComponent2 = (
+            //@ts-ignore Same issue with TinaMarkdown
+            components["table"] || ((props2) => /* @__PURE__ */ React.createElement("table", { ...props2 }))
+          );
           const TrComponent2 = components["tr"] || ((props2) => /* @__PURE__ */ React.createElement("tr", { ...props2 }));
           const ThComponent = components["th"] || ((props2) => /* @__PURE__ */ React.createElement("th", { style: { textAlign: (props2 == null ? void 0 : props2.align) || "auto" }, ...props2 }));
           const TdComponent2 = components["td"] || ((props2) => /* @__PURE__ */ React.createElement("td", { style: { textAlign: (props2 == null ? void 0 : props2.align) || "auto" }, ...props2 }));
           const align2 = ((_f = child.props) == null ? void 0 : _f.align) || [];
-          return /* @__PURE__ */ React.createElement(TableComponent2, null, firstRowHeader && /* @__PURE__ */ React.createElement("thead", null, /* @__PURE__ */ React.createElement(TrComponent2, null, header.tableCells.map((c, i) => {
-            return /* @__PURE__ */ React.createElement(
-              TinaMarkdown,
-              {
-                key: i,
-                components: {
-                  p: (props2) => /* @__PURE__ */ React.createElement(ThComponent, { align: align2[i], ...props2 })
-                },
-                content: c.value
-              }
-            );
-          }))), /* @__PURE__ */ React.createElement("tbody", null, rows2.map((row, i) => {
-            var _a2;
-            return /* @__PURE__ */ React.createElement(TrComponent2, { key: i }, (_a2 = row == null ? void 0 : row.tableCells) == null ? void 0 : _a2.map((c, i2) => {
+          return (
+            //@ts-ignore Same issue with TinaMarkdown
+            /* @__PURE__ */ React.createElement(TableComponent2, null, firstRowHeader && /* @__PURE__ */ React.createElement("thead", null, /* @__PURE__ */ React.createElement(TrComponent2, null, header.tableCells.map((c, i) => {
               return /* @__PURE__ */ React.createElement(
-                TinaMarkdown,
+                StaticTinaMarkdown,
                 {
-                  key: i2,
+                  key: i,
                   components: {
-                    p: (props2) => /* @__PURE__ */ React.createElement(TdComponent2, { align: align2[i2], ...props2 })
+                    p: (props2) => /* @__PURE__ */ React.createElement(ThComponent, { align: align2[i], ...props2 })
                   },
                   content: c.value
                 }
               );
-            }));
-          })));
+            }))), /* @__PURE__ */ React.createElement("tbody", null, rows2.map((row, i) => {
+              var _a2;
+              return /* @__PURE__ */ React.createElement(TrComponent2, { key: i }, (_a2 = row == null ? void 0 : row.tableCells) == null ? void 0 : _a2.map((c, i2) => {
+                return /* @__PURE__ */ React.createElement(
+                  StaticTinaMarkdown,
+                  {
+                    key: i2,
+                    components: {
+                      p: (props2) => /* @__PURE__ */ React.createElement(TdComponent2, { align: align2[i2], ...props2 })
+                    },
+                    content: c.value
+                  }
+                );
+              }));
+            })))
+          );
         }
         const ComponentMissing = components["component_missing"];
         if (ComponentMissing) {
@@ -206,21 +202,24 @@ const Node = ({ components, child }) => {
         }
       ));
       const align = ((_g = child.props) == null ? void 0 : _g.align) || [];
-      return /* @__PURE__ */ React.createElement(TableComponent, null, /* @__PURE__ */ React.createElement("tbody", null, rows.map((row, i) => {
-        var _a2;
-        return /* @__PURE__ */ React.createElement(TrComponent, { key: i }, (_a2 = row.children) == null ? void 0 : _a2.map((cell, i2) => {
-          return /* @__PURE__ */ React.createElement(
-            TinaMarkdown,
-            {
-              key: i2,
-              components: {
-                p: (props2) => /* @__PURE__ */ React.createElement(TdComponent, { align: align[i2], ...props2 })
-              },
-              content: cell.children
-            }
-          );
-        }));
-      })));
+      return (
+        //@ts-ignore Same issue with TinaMarkdown
+        /* @__PURE__ */ React.createElement(TableComponent, null, /* @__PURE__ */ React.createElement("tbody", null, rows.map((row, i) => {
+          var _a2;
+          return /* @__PURE__ */ React.createElement(TrComponent, { key: i }, (_a2 = row.children) == null ? void 0 : _a2.map((cell, i2) => {
+            return /* @__PURE__ */ React.createElement(
+              StaticTinaMarkdown,
+              {
+                key: i2,
+                components: {
+                  p: (props2) => /* @__PURE__ */ React.createElement(TdComponent, { align: align[i2], ...props2 })
+                },
+                content: cell.children
+              }
+            );
+          }));
+        })))
+      );
     case "maybe_mdx":
       return null;
     case "html":
@@ -236,8 +235,9 @@ const Node = ({ components, child }) => {
       if (typeof child.text === "string") {
         return /* @__PURE__ */ React.createElement(Leaf, { components, ...child });
       }
+      return null;
   }
 };
 export {
-  TinaMarkdown
+  StaticTinaMarkdown
 };

package/dist/tina-cms.d.ts

@@ -9,7 +9,7 @@ import type { TinaCMSProviderDefaultProps } from './types/cms';
 export declare const TinaCMSProvider2: ({ query, documentCreatorCallback, formifyCallback, schema, ...props }: TinaCMSProviderDefaultProps) => React.JSX.Element;
 export type DocumentCreatorCallback = Parameters<typeof useDocumentCreatorPlugin>[0];
 /**
- * @deprecated v0.62.0: Use `staticRequest` and a "try catch" block instead. see https://tina.io/docs/features/data-fetching/#querying-tina-content-in-nextjs for more details
+ * @deprecated v0.62.0: Use `staticRequest` and a "try catch" block instead. see https://tina.io/docs/r/content-api-overview for more details
  *
  * A convenience function which makes a GraphQL request
  * to a local GraphQL server and ensures the response fits

package/dist/toolkit/components/ProgressBar.d.ts

@@ -0,0 +1,11 @@
+import * as React from 'react';
+interface ProgressBarProps {
+    /** Progress percentage (0-100) */
+    progress: number;
+    /** Additional CSS classes */
+    className?: string;
+    /** Color of the progress bar */
+    color?: 'blue' | 'green';
+}
+export declare const ProgressBar: React.FC<ProgressBarProps>;
+export {};

package/dist/toolkit/components/media/media-item.d.ts

@@ -1,5 +1,5 @@
-import React from 'react';
 import { Media } from '../../core';
+import React from 'react';
 interface MediaItemProps {
     item: Media & {
         new?: boolean;
@@ -7,6 +7,16 @@ interface MediaItemProps {
     onClick(_item: Media | false): void;
     active: boolean;
 }
+export declare const checkerboardStyle: {
+    backgroundImage: string;
+    backgroundSize: string;
+    backgroundPosition: string;
+};
+export declare const smallCheckerboardStyle: {
+    backgroundImage: string;
+    backgroundSize: string;
+    backgroundPosition: string;
+};
 export declare function ListMediaItem({ item, onClick, active }: MediaItemProps): React.JSX.Element;
 export declare function GridMediaItem({ item, active, onClick }: MediaItemProps): React.JSX.Element;
 export {};

package/dist/toolkit/components/ui/breadcrumb.d.ts

@@ -0,0 +1,11 @@
+import * as React from 'react';
+declare function Breadcrumb({ ...props }: React.ComponentProps<'nav'>): React.JSX.Element;
+declare function BreadcrumbList({ className, ...props }: React.ComponentProps<'ol'>): React.JSX.Element;
+declare function BreadcrumbItem({ className, ...props }: React.ComponentProps<'li'>): React.JSX.Element;
+declare function BreadcrumbLink({ asChild, className, ...props }: React.ComponentProps<'a'> & {
+    asChild?: boolean;
+}): React.JSX.Element;
+declare function BreadcrumbPage({ className, ...props }: React.ComponentProps<'span'>): React.JSX.Element;
+declare function BreadcrumbSeparator({ children, className, ...props }: React.ComponentProps<'li'>): React.JSX.Element;
+declare function BreadcrumbEllipsis({ className, ...props }: React.ComponentProps<'span'>): React.JSX.Element;
+export { Breadcrumb, BreadcrumbList, BreadcrumbItem, BreadcrumbLink, BreadcrumbPage, BreadcrumbSeparator, BreadcrumbEllipsis, };

package/dist/toolkit/components/ui/button.d.ts

@@ -0,0 +1,11 @@
+import * as React from 'react';
+import { type VariantProps } from 'class-variance-authority';
+declare const buttonVariants: (props?: {
+    variant?: "default" | "link" | "secondary" | "ghost" | "destructive" | "outline";
+    size?: "default" | "icon" | "sm" | "lg";
+} & import("class-variance-authority/types").ClassProp) => string;
+export interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof buttonVariants> {
+    asChild?: boolean;
+}
+declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLButtonElement>>;
+export { Button, buttonVariants };

package/dist/toolkit/components/ui/calendar.d.ts

@@ -0,0 +1,8 @@
+import * as React from 'react';
+import { DayButton, DayPicker } from 'react-day-picker';
+import { Button } from './button';
+declare function Calendar({ className, classNames, showOutsideDays, captionLayout, buttonVariant, formatters, components, ...props }: React.ComponentProps<typeof DayPicker> & {
+    buttonVariant?: React.ComponentProps<typeof Button>['variant'];
+}): React.JSX.Element;
+declare function CalendarDayButton({ className, day, modifiers, ...props }: React.ComponentProps<typeof DayButton>): React.JSX.Element;
+export { Calendar, CalendarDayButton };

package/dist/toolkit/components/ui/date-time-picker.d.ts

@@ -0,0 +1,111 @@
+import 'moment-timezone';
+import * as React from 'react';
+import { DayPickerProps } from 'react-day-picker';
+type TimePickerType = 'minutes' | 'seconds' | 'hours' | '12hours';
+type Period = 'AM' | 'PM';
+declare const formatCurrentDate: ({ dateFormat, timeFormat, displayDate, }: {
+    dateFormat?: string;
+    timeFormat?: string;
+    displayDate: Date;
+}) => string;
+interface TimePickerInputProps extends React.InputHTMLAttributes<HTMLInputElement> {
+    picker: TimePickerType;
+    date?: Date | null;
+    onDateChange?: (date: Date | undefined) => void;
+    period?: Period;
+    onRightFocus?: () => void;
+    onLeftFocus?: () => void;
+}
+declare const TimePickerInput: React.ForwardRefExoticComponent<TimePickerInputProps & React.RefAttributes<HTMLInputElement>>;
+interface TimePickerProps {
+    date?: Date | null;
+    onChange?: (date: Date | undefined) => void;
+    hourCycle?: 12 | 24;
+    /**
+     * Determines the smallest unit that is displayed in the datetime picker.
+     * Default is 'second'.
+     * */
+    granularity?: Granularity;
+}
+interface TimePickerRef {
+    minuteRef: HTMLInputElement | null;
+    hourRef: HTMLInputElement | null;
+    secondRef: HTMLInputElement | null;
+}
+declare const TimePicker: React.ForwardRefExoticComponent<TimePickerProps & React.RefAttributes<TimePickerRef>>;
+type Granularity = 'day' | 'hour' | 'minute' | 'second';
+type DateTimePickerProps = {
+    value?: Date;
+    onChange?: (date: Date | undefined) => void;
+    disabled?: boolean;
+    dateFormat?: string;
+    timeFormat?: string;
+    /** showing `AM/PM` or not. */
+    hourCycle?: 12 | 24;
+    placeholder?: string;
+    /**
+     * The year range will be: `This year + yearRange` and `this year - yearRange`.
+     * Default is 50.
+     * For example:
+     * This year is 2024, The year dropdown will be 1974 to 2024 which is generated by `2024 - 50 = 1974` and `2024 + 50 = 2074`.
+     * */
+    yearRange?: number;
+    /**
+     * The format is derived from the `date-fns` documentation.
+     * @reference https://date-fns.org/v3.6.0/docs/format
+     **/
+    displayFormat?: {
+        hour24?: string;
+        hour12?: string;
+    };
+    /**
+     * The granularity prop allows you to control the smallest unit that is displayed by DateTimePicker.
+     * By default, the value is `second` which shows all time inputs.
+     **/
+    granularity?: Granularity;
+    className?: string;
+    /**
+     * Show the default month and time when popup the calendar. Default is the current Date().
+     **/
+    defaultPopupValue?: Date;
+} & Pick<DayPickerProps, 'locale' | 'weekStartsOn' | 'showWeekNumber' | 'showOutsideDays'>;
+type DateTimePickerRef = {
+    value?: Date;
+} & Omit<HTMLInputElement, 'value'>;
+declare const DateTimePicker: React.ForwardRefExoticComponent<{
+    value?: Date;
+    onChange?: (date: Date | undefined) => void;
+    disabled?: boolean;
+    dateFormat?: string;
+    timeFormat?: string;
+    /** showing `AM/PM` or not. */
+    hourCycle?: 12 | 24;
+    placeholder?: string;
+    /**
+     * The year range will be: `This year + yearRange` and `this year - yearRange`.
+     * Default is 50.
+     * For example:
+     * This year is 2024, The year dropdown will be 1974 to 2024 which is generated by `2024 - 50 = 1974` and `2024 + 50 = 2074`.
+     * */
+    yearRange?: number;
+    /**
+     * The format is derived from the `date-fns` documentation.
+     * @reference https://date-fns.org/v3.6.0/docs/format
+     **/
+    displayFormat?: {
+        hour24?: string;
+        hour12?: string;
+    };
+    /**
+     * The granularity prop allows you to control the smallest unit that is displayed by DateTimePicker.
+     * By default, the value is `second` which shows all time inputs.
+     **/
+    granularity?: Granularity;
+    className?: string;
+    /**
+     * Show the default month and time when popup the calendar. Default is the current Date().
+     **/
+    defaultPopupValue?: Date;
+} & Pick<DayPickerProps, "showOutsideDays" | "showWeekNumber" | "locale" | "weekStartsOn"> & React.RefAttributes<Partial<DateTimePickerRef>>>;
+export { DateTimePicker, TimePickerInput, TimePicker, formatCurrentDate };
+export type { TimePickerType, DateTimePickerProps, DateTimePickerRef };

package/dist/toolkit/components/ui/dropdown-menu.d.ts

@@ -0,0 +1,25 @@
+import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';
+import * as React from 'react';
+declare function DropdownMenu({ ...props }: React.ComponentProps<typeof DropdownMenuPrimitive.Root>): React.JSX.Element;
+declare function DropdownMenuPortal({ ...props }: React.ComponentProps<typeof DropdownMenuPrimitive.Portal>): React.JSX.Element;
+declare function DropdownMenuTrigger({ ...props }: React.ComponentProps<typeof DropdownMenuPrimitive.Trigger>): React.JSX.Element;
+declare function DropdownMenuContent({ className, sideOffset, ...props }: React.ComponentProps<typeof DropdownMenuPrimitive.Content>): React.JSX.Element;
+declare function DropdownMenuGroup({ ...props }: React.ComponentProps<typeof DropdownMenuPrimitive.Group>): React.JSX.Element;
+declare function DropdownMenuItem({ className, inset, variant, ...props }: React.ComponentProps<typeof DropdownMenuPrimitive.Item> & {
+    inset?: boolean;
+    variant?: 'default' | 'destructive';
+}): React.JSX.Element;
+declare function DropdownMenuCheckboxItem({ className, children, checked, ...props }: React.ComponentProps<typeof DropdownMenuPrimitive.CheckboxItem>): React.JSX.Element;
+declare function DropdownMenuRadioGroup({ ...props }: React.ComponentProps<typeof DropdownMenuPrimitive.RadioGroup>): React.JSX.Element;
+declare function DropdownMenuRadioItem({ className, children, ...props }: React.ComponentProps<typeof DropdownMenuPrimitive.RadioItem>): React.JSX.Element;
+declare function DropdownMenuLabel({ className, inset, ...props }: React.ComponentProps<typeof DropdownMenuPrimitive.Label> & {
+    inset?: boolean;
+}): React.JSX.Element;
+declare function DropdownMenuSeparator({ className, ...props }: React.ComponentProps<typeof DropdownMenuPrimitive.Separator>): React.JSX.Element;
+declare function DropdownMenuShortcut({ className, ...props }: React.ComponentProps<'span'>): React.JSX.Element;
+declare function DropdownMenuSub({ ...props }: React.ComponentProps<typeof DropdownMenuPrimitive.Sub>): React.JSX.Element;
+declare function DropdownMenuSubTrigger({ className, inset, children, ...props }: React.ComponentProps<typeof DropdownMenuPrimitive.SubTrigger> & {
+    inset?: boolean;
+}): React.JSX.Element;
+declare function DropdownMenuSubContent({ className, ...props }: React.ComponentProps<typeof DropdownMenuPrimitive.SubContent>): React.JSX.Element;
+export { DropdownMenu, DropdownMenuPortal, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuGroup, DropdownMenuLabel, DropdownMenuItem, DropdownMenuCheckboxItem, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubTrigger, DropdownMenuSubContent, };