@collabchron/notiq 0.2.0 → 1.0.0

package/dist/chunk-QHIQKMVN.mjs

@@ -0,0 +1,427 @@
+import {
+  getSelectedNode
+} from "./chunk-4HBCVSE6.mjs";
+import {
+  sanitizeUrl
+} from "./chunk-4VWFVWYP.mjs";
+import {
+  Input
+} from "./chunk-POGRR73N.mjs";
+import {
+  Button
+} from "./chunk-BIU7WTLX.mjs";
+import {
+  cn
+} from "./chunk-YHPNOWFH.mjs";
+import {
+  React,
+  init_react_shim
+} from "./chunk-77KXU36M.mjs";
+
+// src/components/editor/plugins/FloatingLinkEditorPlugin/index.tsx
+init_react_shim();
+import { useLexicalComposerContext } from "@lexical/react/LexicalComposerContext";
+import { useCallback, useEffect, useRef, useState } from "react";
+import { createPortal } from "react-dom";
+import {
+  $createLinkNode,
+  $isAutoLinkNode,
+  $isLinkNode,
+  TOGGLE_LINK_COMMAND
+} from "@lexical/link";
+import { $findMatchingParent, mergeRegister } from "@lexical/utils";
+import {
+  $getSelection,
+  $isLineBreakNode,
+  $isRangeSelection,
+  CLICK_COMMAND,
+  COMMAND_PRIORITY_CRITICAL,
+  COMMAND_PRIORITY_HIGH,
+  COMMAND_PRIORITY_LOW,
+  getDOMSelection,
+  KEY_ESCAPE_COMMAND,
+  SELECTION_CHANGE_COMMAND
+} from "lexical";
+
+// src/components/editor/utils/setFloatingElemPositionForLinkEditor.ts
+init_react_shim();
+var VERTICAL_GAP = 10;
+var HORIZONTAL_OFFSET = 5;
+function setFloatingElemPositionForLinkEditor(targetRect, floatingElem, anchorElem, verticalGap = VERTICAL_GAP, horizontalOffset = HORIZONTAL_OFFSET) {
+  const scrollerElem = anchorElem.parentElement;
+  if (targetRect === null || !scrollerElem) {
+    floatingElem.style.opacity = "0";
+    floatingElem.style.transform = "translate(-10000px, -10000px)";
+    return;
+  }
+  const floatingElemRect = floatingElem.getBoundingClientRect();
+  const anchorElementRect = anchorElem.getBoundingClientRect();
+  const editorScrollerRect = scrollerElem.getBoundingClientRect();
+  let top = targetRect.top - verticalGap;
+  let left = targetRect.left - horizontalOffset;
+  if (top < editorScrollerRect.top) {
+    top += floatingElemRect.height + targetRect.height + verticalGap * 2;
+  }
+  if (left + floatingElemRect.width > editorScrollerRect.right) {
+    left = editorScrollerRect.right - floatingElemRect.width - horizontalOffset;
+  }
+  top -= anchorElementRect.top;
+  left -= anchorElementRect.left;
+  floatingElem.style.opacity = "1";
+  floatingElem.style.transform = `translate(${left}px, ${top}px)`;
+}
+
+// src/components/editor/plugins/FloatingLinkEditorPlugin/index.tsx
+import { Check, Edit2Icon, Link, X } from "lucide-react";
+function preventDefault(event) {
+  event.preventDefault();
+}
+function FloatingLinkEditor({
+  editor,
+  isLink,
+  setIsLink,
+  anchorElem,
+  isLinkEditMode,
+  setIsLinkEditMode
+}) {
+  const editorRef = useRef(null);
+  const inputRef = useRef(null);
+  const [linkUrl, setLinkUrl] = useState("");
+  const [editedLinkUrl, setEditedLinkUrl] = useState("https://");
+  const [lastSelection, setLastSelection] = useState(
+    null
+  );
+  const [urlLogo, setUrlLogo] = useState(null);
+  const $updateLinkEditor = useCallback(() => {
+    var _a, _b;
+    const selection = $getSelection();
+    if ($isRangeSelection(selection)) {
+      const node = getSelectedNode(selection);
+      const linkParent = $findMatchingParent(node, $isLinkNode);
+      if (linkParent) {
+        setLinkUrl(linkParent.getURL());
+      } else if ($isLinkNode(node)) {
+        setLinkUrl(node.getURL());
+      } else {
+        setLinkUrl("");
+      }
+      if (isLinkEditMode) {
+        setEditedLinkUrl(linkUrl);
+      }
+    }
+    const editorElem = editorRef.current;
+    const nativeSelection = getDOMSelection(editor._window);
+    const activeElement = document.activeElement;
+    if (editorElem === null) {
+      return;
+    }
+    const rootElement = editor.getRootElement();
+    if (selection !== null && nativeSelection !== null && rootElement !== null && rootElement.contains(nativeSelection.anchorNode) && editor.isEditable()) {
+      const domRect = (_b = (_a = nativeSelection.focusNode) == null ? void 0 : _a.parentElement) == null ? void 0 : _b.getBoundingClientRect();
+      if (domRect) {
+        domRect.y += 40;
+        setFloatingElemPositionForLinkEditor(domRect, editorElem, anchorElem);
+      }
+      setLastSelection(selection);
+    } else if (!activeElement || activeElement.className !== "link-input") {
+      if (rootElement !== null) {
+        setFloatingElemPositionForLinkEditor(null, editorElem, anchorElem);
+      }
+      setLastSelection(null);
+      setIsLinkEditMode(false);
+      setLinkUrl("");
+    }
+    return true;
+  }, [anchorElem, editor, setIsLinkEditMode, isLinkEditMode, linkUrl]);
+  useEffect(() => {
+    const scrollerElem = anchorElem.parentElement;
+    const update = () => {
+      editor.getEditorState().read(() => {
+        $updateLinkEditor();
+      });
+    };
+    window.addEventListener("resize", update);
+    if (scrollerElem) {
+      scrollerElem.addEventListener("scroll", update);
+    }
+    return () => {
+      window.removeEventListener("resize", update);
+      if (scrollerElem) {
+        scrollerElem.removeEventListener("scroll", update);
+      }
+    };
+  }, [anchorElem.parentElement, editor, $updateLinkEditor]);
+  useEffect(() => {
+    return mergeRegister(
+      editor.registerUpdateListener(({ editorState }) => {
+        editorState.read(() => {
+          $updateLinkEditor();
+        });
+      }),
+      editor.registerCommand(
+        SELECTION_CHANGE_COMMAND,
+        () => {
+          $updateLinkEditor();
+          return true;
+        },
+        COMMAND_PRIORITY_LOW
+      ),
+      editor.registerCommand(
+        KEY_ESCAPE_COMMAND,
+        () => {
+          if (isLink) {
+            setIsLink(false);
+            return true;
+          }
+          return false;
+        },
+        COMMAND_PRIORITY_HIGH
+      )
+    );
+  }, [editor, $updateLinkEditor, setIsLink, isLink]);
+  useEffect(() => {
+    editor.getEditorState().read(() => {
+      $updateLinkEditor();
+    });
+  }, [editor, $updateLinkEditor]);
+  useEffect(() => {
+    if (isLinkEditMode && inputRef.current) {
+      inputRef.current.focus();
+    }
+  }, [isLinkEditMode, isLink]);
+  const monitorInputInteraction = (event) => {
+    if (event.key === "Enter") {
+      handleLinkSubmission(event);
+    } else if (event.key === "Escape") {
+      event.preventDefault();
+      setIsLinkEditMode(false);
+    }
+  };
+  const handleLinkSubmission = (event) => {
+    event.preventDefault();
+    if (lastSelection !== null) {
+      if (linkUrl !== "") {
+        editor.update(() => {
+          editor.dispatchCommand(
+            TOGGLE_LINK_COMMAND,
+            sanitizeUrl(editedLinkUrl)
+          );
+          const selection = $getSelection();
+          if ($isRangeSelection(selection)) {
+            const parent = getSelectedNode(selection).getParent();
+            if ($isAutoLinkNode(parent)) {
+              const linkNode = $createLinkNode(parent.getURL(), {
+                rel: parent.__rel,
+                target: parent.__target,
+                title: parent.__title
+              });
+              parent.replace(linkNode, true);
+            }
+          }
+        });
+      }
+      setEditedLinkUrl("https://");
+      setIsLinkEditMode(false);
+    }
+  };
+  return /* @__PURE__ */ React.createElement(
+    "div",
+    {
+      ref: editorRef,
+      className: " absolute max-w-96 bg-background max-sm:mx-1 w-full  border-0 top-0 left-0"
+    },
+    isLinkEditMode ? /* @__PURE__ */ React.createElement("div", { className: " relative w-full" }, /* @__PURE__ */ React.createElement(
+      Link,
+      {
+        className: cn(
+          "size-[14px] text-muted-foreground absolute  transition-colors duration-500 transform -translate-x-1/2 -translate-y-1/2 left-4 top-1/2",
+          !!editedLinkUrl && "text-black dark:text-white"
+        )
+      }
+    ), /* @__PURE__ */ React.createElement(
+      Input,
+      {
+        placeholder: "https://",
+        value: editedLinkUrl,
+        onChange: (event) => {
+          setEditedLinkUrl(event.target.value);
+        },
+        onKeyDown: (event) => {
+          monitorInputInteraction(event);
+        },
+        ref: inputRef,
+        className: "text-gray-900 pl-7 dark:text-gray-100 rounded-xl placeholder-gray-400 dark:placeholder-gray-500"
+      }
+    ), /* @__PURE__ */ React.createElement("div", { className: " absolute  bg-background rounded-xl  flex flex-row  gap-x-1 items-center  transition-colors duration-500 transform -translate-y-1/2 right-2 top-1/2" }, /* @__PURE__ */ React.createElement(
+      Button,
+      {
+        className: " rounded-xl h-6 w-6 flex items-center",
+        role: "button",
+        variant: "destructive",
+        size: "Toolbar",
+        tip: "delete link",
+        tabIndex: 0,
+        onMouseDown: preventDefault,
+        onClick: () => {
+          setIsLinkEditMode(false);
+        }
+      },
+      /* @__PURE__ */ React.createElement(X, null)
+    ), /* @__PURE__ */ React.createElement(
+      Button,
+      {
+        className: " rounded-xl h-6 w-6 flex items-center",
+        role: "button",
+        tabIndex: 0,
+        tip: "confirm link",
+        onMouseDown: preventDefault,
+        onClick: handleLinkSubmission,
+        size: "Toolbar"
+      },
+      /* @__PURE__ */ React.createElement(Check, null)
+    ))) : /* @__PURE__ */ React.createElement("div", { className: "w-full border-input border rounded-xl h-9 flex items-center justify-between px-3 py-1 text-base shadow-sm " }, /* @__PURE__ */ React.createElement(
+      Link,
+      {
+        className: cn(
+          "size-[14px] text-muted-foreground absolute  transition-colors duration-500 transform -translate-x-1/2 -translate-y-1/2 left-4 top-1/2",
+          !!editedLinkUrl && "text-black dark:text-white"
+        )
+      }
+    ), /* @__PURE__ */ React.createElement(
+      "a",
+      {
+        href: sanitizeUrl(linkUrl),
+        target: "_blank",
+        rel: "noopener noreferrer",
+        className: "pl-4 mb-[1px]"
+      },
+      linkUrl
+    ), /* @__PURE__ */ React.createElement("div", { className: " absolute  bg-background rounded-xl  flex flex-row  gap-x-1 items-center  transition-colors duration-500 transform -translate-y-1/2 right-2 top-1/2" }, /* @__PURE__ */ React.createElement(
+      Button,
+      {
+        className: " rounded-xl z-50 h-6 w-6 flex items-center",
+        role: "button",
+        size: "Toolbar",
+        tip: "edit link",
+        tabIndex: 0,
+        onMouseDown: preventDefault,
+        onClick: (event) => {
+          event.preventDefault();
+          setEditedLinkUrl(linkUrl);
+          setIsLinkEditMode(true);
+        }
+      },
+      /* @__PURE__ */ React.createElement(Edit2Icon, { className: "size-4" })
+    ), /* @__PURE__ */ React.createElement(
+      Button,
+      {
+        className: " rounded-xl h-6 w-6 flex items-center",
+        role: "button",
+        tabIndex: 0,
+        variant: "secondary",
+        tip: "delet link",
+        size: "Toolbar",
+        onMouseDown: preventDefault,
+        onClick: () => {
+          editor.dispatchCommand(TOGGLE_LINK_COMMAND, null);
+        }
+      },
+      /* @__PURE__ */ React.createElement(X, null)
+    )))
+  );
+}
+function useFloatingLinkEditorToolbar(editor, anchorElem, isLinkEditMode, setIsLinkEditMode) {
+  const [activeEditor, setActiveEditor] = useState(editor);
+  const [isLink, setIsLink] = useState(false);
+  useEffect(() => {
+    function $updateToolbar() {
+      const selection = $getSelection();
+      if ($isRangeSelection(selection)) {
+        const focusNode = getSelectedNode(selection);
+        const focusLinkNode = $findMatchingParent(focusNode, $isLinkNode);
+        const focusAutoLinkNode = $findMatchingParent(
+          focusNode,
+          $isAutoLinkNode
+        );
+        if (!(focusLinkNode || focusAutoLinkNode)) {
+          setIsLink(false);
+          return;
+        }
+        const badNode = selection.getNodes().filter((node) => !$isLineBreakNode(node)).find((node) => {
+          const linkNode = $findMatchingParent(node, $isLinkNode);
+          const autoLinkNode = $findMatchingParent(node, $isAutoLinkNode);
+          return focusLinkNode && !focusLinkNode.is(linkNode) || linkNode && !linkNode.is(focusLinkNode) || focusAutoLinkNode && !focusAutoLinkNode.is(autoLinkNode) || autoLinkNode && (!autoLinkNode.is(focusAutoLinkNode) || autoLinkNode.getIsUnlinked());
+        });
+        if (!badNode) {
+          setIsLink(true);
+        } else {
+          setIsLink(false);
+        }
+      }
+    }
+    return mergeRegister(
+      editor.registerUpdateListener(({ editorState }) => {
+        editorState.read(() => {
+          $updateToolbar();
+        });
+      }),
+      editor.registerCommand(
+        SELECTION_CHANGE_COMMAND,
+        (_payload, newEditor) => {
+          $updateToolbar();
+          setActiveEditor(newEditor);
+          return false;
+        },
+        COMMAND_PRIORITY_CRITICAL
+      ),
+      editor.registerCommand(
+        CLICK_COMMAND,
+        (payload) => {
+          const selection = $getSelection();
+          if ($isRangeSelection(selection)) {
+            const node = getSelectedNode(selection);
+            const linkNode = $findMatchingParent(node, $isLinkNode);
+            if ($isLinkNode(linkNode) && (payload.metaKey || payload.ctrlKey)) {
+              window.open(linkNode.getURL(), "_blank");
+              return true;
+            }
+          }
+          return false;
+        },
+        COMMAND_PRIORITY_LOW
+      )
+    );
+  }, [editor]);
+  if (!isLink) return null;
+  return createPortal(
+    /* @__PURE__ */ React.createElement(
+      FloatingLinkEditor,
+      {
+        editor: activeEditor,
+        isLink,
+        anchorElem,
+        setIsLink,
+        isLinkEditMode,
+        setIsLinkEditMode
+      }
+    ),
+    anchorElem
+  );
+}
+function FloatingLinkEditorPlugin({
+  anchorElem = document.body,
+  isLinkEditMode,
+  setIsLinkEditMode
+}) {
+  const [editor] = useLexicalComposerContext();
+  return useFloatingLinkEditorToolbar(
+    editor,
+    anchorElem,
+    isLinkEditMode,
+    setIsLinkEditMode
+  );
+}
+
+export {
+  FloatingLinkEditorPlugin
+};

package/dist/chunk-TCYK7DM7.mjs

@@ -0,0 +1,36 @@
+import {
+  cn
+} from "./chunk-YHPNOWFH.mjs";
+import {
+  __objRest,
+  __spreadValues,
+  init_react_shim
+} from "./chunk-77KXU36M.mjs";
+
+// src/components/ui/separator.tsx
+init_react_shim();
+import * as React from "react";
+import * as SeparatorPrimitive from "@radix-ui/react-separator";
+var Separator = React.forwardRef(
+  (_a, ref) => {
+    var _b = _a, { className, orientation = "horizontal", decorative = true } = _b, props = __objRest(_b, ["className", "orientation", "decorative"]);
+    return /* @__PURE__ */ React.createElement(
+      SeparatorPrimitive.Root,
+      __spreadValues({
+        ref,
+        decorative,
+        orientation,
+        className: cn(
+          "shrink-0 bg-border",
+          orientation === "horizontal" ? "h-[1px] w-full" : "h-full w-[1px]",
+          className
+        )
+      }, props)
+    );
+  }
+);
+Separator.displayName = SeparatorPrimitive.Root.displayName;
+
+export {
+  Separator
+};

package/dist/chunk-TTHQCW5F.mjs

@@ -0,0 +1,47 @@
+import {
+  DropDown
+} from "./chunk-EGMI62PP.mjs";
+import {
+  init_react_shim
+} from "./chunk-77KXU36M.mjs";
+
+// src/components/ui/drop-downs/code.tsx
+init_react_shim();
+import React from "react";
+import {
+  CODE_LANGUAGE_FRIENDLY_NAME_MAP,
+  getLanguageFriendlyName
+} from "@lexical/code";
+function getCodeLanguageOptions() {
+  const options = [];
+  for (const [lang, friendlyName] of Object.entries(
+    CODE_LANGUAGE_FRIENDLY_NAME_MAP
+  )) {
+    options.push([lang, friendlyName]);
+  }
+  return options;
+}
+function CodeList({
+  onCodeLanguageSelect,
+  disabled = false,
+  codeLanguage
+}) {
+  const CODE_LANGUAGE_OPTIONS = getCodeLanguageOptions();
+  const languageButtons = CODE_LANGUAGE_OPTIONS.map(([lang]) => ({
+    label: lang,
+    func: () => onCodeLanguageSelect(lang)
+  }));
+  return /* @__PURE__ */ React.createElement(
+    DropDown,
+    {
+      values: languageButtons,
+      disabled,
+      TriggerClassName: { maxWidth: "200px", minWidth: "60px", width: "130px" },
+      TriggerLabel: getLanguageFriendlyName(codeLanguage)
+    }
+  );
+}
+
+export {
+  CodeList
+};

package/dist/chunk-U47ABU5Z.mjs

@@ -0,0 +1,53 @@
+import {
+  $createPollNode,
+  PollNode,
+  createPollOption
+} from "./chunk-GZPNVR7L.mjs";
+import {
+  init_react_shim
+} from "./chunk-77KXU36M.mjs";
+
+// src/components/editor/plugins/PollPlugin/index.tsx
+init_react_shim();
+import { useLexicalComposerContext } from "@lexical/react/LexicalComposerContext";
+import { $wrapNodeInElement } from "@lexical/utils";
+import {
+  $createParagraphNode,
+  $insertNodes,
+  $isRootOrShadowRoot,
+  COMMAND_PRIORITY_EDITOR,
+  createCommand
+} from "lexical";
+import { useEffect } from "react";
+var INSERT_POLL_COMMAND = createCommand(
+  "INSERT_POLL_COMMAND"
+);
+function PollPlugin() {
+  const [editor] = useLexicalComposerContext();
+  useEffect(() => {
+    if (!editor.hasNodes([PollNode])) {
+      throw new Error("PollPlugin: PollNode not registered on editor");
+    }
+    return editor.registerCommand(
+      INSERT_POLL_COMMAND,
+      (payload) => {
+        const pollNode = $createPollNode(payload, [
+          createPollOption(),
+          createPollOption()
+        ]);
+        $insertNodes([pollNode]);
+        if ($isRootOrShadowRoot(pollNode.getParentOrThrow())) {
+          $wrapNodeInElement(pollNode, $createParagraphNode).selectEnd();
+        }
+        return true;
+      },
+      COMMAND_PRIORITY_EDITOR
+    );
+  }, [editor]);
+  return null;
+}
+
+export {
+  INSERT_POLL_COMMAND,
+  PollPlugin
+};

package/dist/chunk-WDG7J2DY.mjs

@@ -0,0 +1,116 @@
+import {
+  cn
+} from "./chunk-YHPNOWFH.mjs";
+import {
+  __objRest,
+  __spreadValues,
+  init_react_shim
+} from "./chunk-77KXU36M.mjs";
+
+// src/components/ui/dialog.tsx
+init_react_shim();
+import * as React from "react";
+import * as DialogPrimitive from "@radix-ui/react-dialog";
+import { X } from "lucide-react";
+var Dialog = DialogPrimitive.Root;
+var DialogTrigger = DialogPrimitive.Trigger;
+var DialogPortal = DialogPrimitive.Portal;
+var DialogOverlay = React.forwardRef((_a, ref) => {
+  var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
+  return /* @__PURE__ */ React.createElement(
+    DialogPrimitive.Overlay,
+    __spreadValues({
+      ref,
+      className: cn(
+        "fixed inset-0 z-50 bg-black/80  data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
+        className
+      )
+    }, props)
+  );
+});
+DialogOverlay.displayName = DialogPrimitive.Overlay.displayName;
+var DialogContent = React.forwardRef((_a, ref) => {
+  var _b = _a, { className, children } = _b, props = __objRest(_b, ["className", "children"]);
+  return /* @__PURE__ */ React.createElement(DialogPortal, null, /* @__PURE__ */ React.createElement(DialogOverlay, null), /* @__PURE__ */ React.createElement(
+    DialogPrimitive.Content,
+    __spreadValues({
+      ref,
+      className: cn(
+        "fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border bg-background p-6 shadow-lg duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] sm:rounded-lg",
+        className
+      )
+    }, props),
+    children,
+    /* @__PURE__ */ React.createElement(DialogPrimitive.Close, { className: "absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-accent data-[state=open]:text-muted-foreground" }, /* @__PURE__ */ React.createElement(X, { className: "h-4 w-4" }), /* @__PURE__ */ React.createElement("span", { className: "sr-only" }, "Close"))
+  ));
+});
+DialogContent.displayName = DialogPrimitive.Content.displayName;
+var DialogHeader = (_a) => {
+  var _b = _a, {
+    className
+  } = _b, props = __objRest(_b, [
+    "className"
+  ]);
+  return /* @__PURE__ */ React.createElement(
+    "div",
+    __spreadValues({
+      className: cn(
+        "flex flex-col space-y-1.5 text-center sm:text-left",
+        className
+      )
+    }, props)
+  );
+};
+DialogHeader.displayName = "DialogHeader";
+var DialogFooter = (_a) => {
+  var _b = _a, {
+    className
+  } = _b, props = __objRest(_b, [
+    "className"
+  ]);
+  return /* @__PURE__ */ React.createElement(
+    "div",
+    __spreadValues({
+      className: cn(
+        "flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2",
+        className
+      )
+    }, props)
+  );
+};
+DialogFooter.displayName = "DialogFooter";
+var DialogTitle = React.forwardRef((_a, ref) => {
+  var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
+  return /* @__PURE__ */ React.createElement(
+    DialogPrimitive.Title,
+    __spreadValues({
+      ref,
+      className: cn(
+        "text-lg font-semibold leading-none tracking-tight",
+        className
+      )
+    }, props)
+  );
+});
+DialogTitle.displayName = DialogPrimitive.Title.displayName;
+var DialogDescription = React.forwardRef((_a, ref) => {
+  var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
+  return /* @__PURE__ */ React.createElement(
+    DialogPrimitive.Description,
+    __spreadValues({
+      ref,
+      className: cn("text-sm text-muted-foreground", className)
+    }, props)
+  );
+});
+DialogDescription.displayName = DialogPrimitive.Description.displayName;
+
+export {
+  Dialog,
+  DialogTrigger,
+  DialogContent,
+  DialogHeader,
+  DialogFooter,
+  DialogTitle,
+  DialogDescription
+};