doccupine 0.0.48 → 0.0.50

package/dist/templates/components/Docs.d.ts

@@ -1 +1 @@
-export declare const docsTemplate = "import { Flex } from \"cherry-styled-components/src/lib\";\nimport {\n  DocsContainer,\n  StyledMarkdownContainer,\n} from \"@/components/layout/DocsComponents\";\nimport { MDXRemote } from \"next-mdx-remote/rsc\";\nimport remarkGfm from \"remark-gfm\";\nimport { useMDXComponents } from \"@/components/MDXComponents\";\nimport { DocsSideBar } from \"@/components/DocsSideBar\";\nimport { ActionBar } from \"@/components/layout/ActionBar\";\n\ninterface DocsProps {\n  content: string;\n}\n\ninterface Heading {\n  id: string;\n  text: string;\n  level: number;\n}\n\nfunction generateId(text: string): string {\n  return text\n    .toLowerCase()\n    .replace(/[^\\w\\s-]/g, \"\")\n    .replace(/\\s+/g, \"-\")\n    .trim();\n}\n\nfunction extractHeadings(content: string): Heading[] {\n  const contentWithoutCodeBlocks = content.replace(/```[\\s\\S]*?```/g, \"\");\n  const headingRegex = /^(#{1,6})\\s+(.+)$/gm;\n  const headings: Heading[] = [];\n  let match;\n\n  while ((match = headingRegex.exec(contentWithoutCodeBlocks)) !== null) {\n    const level = match[1].length;\n    const text = match[2].trim();\n    const id = generateId(text);\n    headings.push({ id, text, level });\n  }\n\n  return headings;\n}\n\nfunction Docs({ content }: DocsProps) {\n  const headings = extractHeadings(content);\n  const components = useMDXComponents({});\n\n  return (\n    <>\n      <DocsContainer>\n        <ActionBar content={content}>\n          <Flex $gap={20}>\n            <StyledMarkdownContainer>\n              {content && (\n                <MDXRemote\n                  source={content}\n                  options={{\n                    mdxOptions: {\n                      remarkPlugins: [remarkGfm],\n                    },\n                  }}\n                  components={components}\n                />\n              )}\n            </StyledMarkdownContainer>\n          </Flex>\n        </ActionBar>\n      </DocsContainer>\n      <DocsSideBar headings={headings} />\n    </>\n  );\n}\n\nexport { Docs };\n";
+export declare const docsTemplate = "import { Flex } from \"cherry-styled-components/src/lib\";\nimport {\n  DocsContainer,\n  StyledMarkdownContainer,\n} from \"@/components/layout/DocsComponents\";\nimport { MDXRemote } from \"next-mdx-remote/rsc\";\nimport remarkGfm from \"remark-gfm\";\nimport { useMDXComponents } from \"@/components/MDXComponents\";\nimport { DocsSideBar } from \"@/components/DocsSideBar\";\nimport { ActionBar } from \"@/components/layout/ActionBar\";\n\ninterface DocsProps {\n  content: string;\n}\n\ninterface Heading {\n  id: string;\n  text: string;\n  level: number;\n}\n\nfunction generateId(text: string): string {\n  return text\n    .toLowerCase()\n    .replace(/[^\\w\\s-]/g, \"\")\n    .replace(/\\s+/g, \"-\")\n    .trim();\n}\n\nfunction extractHeadings(content: string): Heading[] {\n  const contentWithoutCodeBlocks = content.replace(/```[\\s\\S]*?```/g, \"\");\n  const headingRegex = /^(#{1,6})\\s+(.+)$/gm;\n  const headings: Heading[] = [];\n  let match;\n\n  while ((match = headingRegex.exec(contentWithoutCodeBlocks)) !== null) {\n    const level = match[1].length;\n    const text = match[2].trim();\n    const id = generateId(text);\n    headings.push({ id, text, level });\n  }\n\n  return headings;\n}\n\nfunction Docs({ content }: DocsProps) {\n  const headings = extractHeadings(content);\n  const components = useMDXComponents({});\n\n  return (\n    <>\n      <DocsContainer>\n        <ActionBar content={content}>\n          <Flex $gap={20}>\n            <StyledMarkdownContainer>\n              {content && (\n                <MDXRemote\n                  source={content}\n                  options={{\n                    blockJS: false,\n                    mdxOptions: {\n                      remarkPlugins: [remarkGfm],\n                    },\n                  }}\n                  components={components}\n                />\n              )}\n            </StyledMarkdownContainer>\n          </Flex>\n        </ActionBar>\n      </DocsContainer>\n      <DocsSideBar headings={headings} />\n    </>\n  );\n}\n\nexport { Docs };\n";

package/dist/templates/components/Docs.js

@@ -57,6 +57,7 @@ function Docs({ content }: DocsProps) {
                 <MDXRemote
                   source={content}
                   options={{
+                    blockJS: false,
                     mdxOptions: {
                       remarkPlugins: [remarkGfm],
                     },

package/dist/templates/components/layout/Button.d.ts

@@ -1 +1 @@
-export declare const buttonTemplate = "\"use client\";\nimport Link from \"next/link\";\nimport styled from \"styled-components\";\nimport {\n  theme as localTheme,\n  ButtonProps,\n  buttonStyles,\n} from \"cherry-styled-components/src/lib\";\nimport { Icon } from \"@/components/layout/Icon\";\n\ninterface LinkButtonProps extends ButtonProps {\n  href?: string;\n  target?: \"_blank\" | \"_self\" | \"_parent\" | \"_top\";\n  variant?: \"primary\" | \"secondary\" | \"tertiary\";\n  size?: \"default\" | \"big\";\n  outline?: boolean;\n  fullWidth?: boolean;\n  icon?: string;\n  iconPosition?: \"left\" | \"right\";\n}\n\nconst StyledLinkButton = styled(Link)<LinkButtonProps>`\n  ${({ theme, $variant, $size, $outline, $fullWidth, disabled }) =>\n    buttonStyles(theme, $variant, $size, $outline, $fullWidth, disabled)}\n\n  & svg.lucide {\n    margin: auto 0;\n    min-width: min-content;\n    color: ${({ theme, $outline }) =>\n      $outline ? \"inherit\" : theme.colors.light};\n    stroke: ${({ theme, $outline }) =>\n      $outline ? \"currentColor\" : theme.colors.light};\n  }\n`;\n\nconst ButtonBase = styled.button<ButtonProps>`\n  ${({ theme, $variant, $size, $outline, $fullWidth, disabled }) =>\n    buttonStyles(theme, $variant, $size, $outline, $fullWidth, disabled)}\n\n  & svg.lucide {\n    margin: auto 0;\n    min-width: min-content;\n    color: ${({ theme, $outline }) =>\n      $outline ? \"inherit\" : theme.colors.light};\n    stroke: ${({ theme, $outline }) =>\n      $outline ? \"currentColor\" : theme.colors.light};\n  }\n`;\n\nfunction Button({\n  variant = \"primary\",\n  size,\n  outline,\n  fullWidth,\n  icon,\n  iconPosition = \"left\",\n  theme = localTheme,\n  href,\n  ...props\n}: LinkButtonProps) {\n  return href ? (\n    <div>\n      <StyledLinkButton\n        {...props}\n        href={href}\n        $variant={variant}\n        $size={size}\n        $outline={outline}\n        $fullWidth={fullWidth}\n      >\n        {iconPosition === \"left\" && icon && (\n          <Icon name={icon} color={theme.colors.light} size={16} />\n        )}\n        {props.children}\n        {iconPosition === \"right\" && icon && (\n          <Icon name={icon} color={theme.colors.light} size={16} />\n        )}\n      </StyledLinkButton>\n    </div>\n  ) : (\n    <div>\n      <ButtonBase\n        {...props}\n        $variant={variant}\n        $size={size}\n        $outline={outline}\n        $fullWidth={fullWidth}\n      >\n        {iconPosition === \"left\" && icon && (\n          <Icon name={icon} color={theme.colors.light} size={16} />\n        )}\n        {props.children}\n        {iconPosition === \"right\" && icon && (\n          <Icon name={icon} color={theme.colors.light} size={16} />\n        )}\n      </ButtonBase>\n    </div>\n  );\n}\n\nexport { Button };\n";
+export declare const buttonTemplate = "\"use client\";\nimport Link from \"next/link\";\nimport styled from \"styled-components\";\nimport {\n  theme as localTheme,\n  ButtonProps,\n  buttonStyles,\n} from \"cherry-styled-components/src/lib\";\nimport { Icon } from \"@/components/layout/Icon\";\n\ninterface LinkButtonProps extends ButtonProps {\n  href?: string;\n  target?: \"_blank\" | \"_self\" | \"_parent\" | \"_top\";\n  variant?: \"primary\" | \"secondary\" | \"tertiary\";\n  size?: \"default\" | \"big\";\n  outline?: boolean;\n  fullWidth?: boolean;\n  icon?: string;\n  iconPosition?: \"left\" | \"right\";\n}\n\nconst StyledLinkButton = styled(Link)<LinkButtonProps>`\n  ${({ theme, $variant, $size, $outline, $fullWidth, disabled }) =>\n    buttonStyles(theme, $variant, $size, $outline, $fullWidth, disabled)}\n\n  & svg.lucide {\n    margin: auto 0;\n    min-width: min-content;\n    color: inherit;\n  }\n`;\n\nconst ButtonBase = styled.button<ButtonProps>`\n  ${({ theme, $variant, $size, $outline, $fullWidth, disabled }) =>\n    buttonStyles(theme, $variant, $size, $outline, $fullWidth, disabled)}\n\n  & svg.lucide {\n    margin: auto 0;\n    min-width: min-content;\n    color: inherit;\n  }\n`;\n\nfunction Button({\n  variant = \"primary\",\n  size,\n  outline,\n  fullWidth,\n  icon,\n  iconPosition = \"left\",\n  theme = localTheme,\n  href,\n  ...props\n}: LinkButtonProps) {\n  return href ? (\n    <div>\n      <StyledLinkButton\n        {...props}\n        href={href}\n        $variant={variant}\n        $size={size}\n        $outline={outline}\n        $fullWidth={fullWidth}\n      >\n        {iconPosition === \"left\" && icon && <Icon name={icon} size={16} />}\n        {props.children}\n        {iconPosition === \"right\" && icon && <Icon name={icon} size={16} />}\n      </StyledLinkButton>\n    </div>\n  ) : (\n    <div>\n      <ButtonBase\n        {...props}\n        $variant={variant}\n        $size={size}\n        $outline={outline}\n        $fullWidth={fullWidth}\n      >\n        {iconPosition === \"left\" && icon && <Icon name={icon} size={16} />}\n        {props.children}\n        {iconPosition === \"right\" && icon && <Icon name={icon} size={16} />}\n      </ButtonBase>\n    </div>\n  );\n}\n\nexport { Button };\n";

package/dist/templates/components/layout/Button.js

@@ -26,10 +26,7 @@ const StyledLinkButton = styled(Link)<LinkButtonProps>\`
   & svg.lucide {
     margin: auto 0;
     min-width: min-content;
-    color: \${({ theme, $outline }) =>
-      $outline ? "inherit" : theme.colors.light};
-    stroke: \${({ theme, $outline }) =>
-      $outline ? "currentColor" : theme.colors.light};
+    color: inherit;
   }
 \`;
 
@@ -40,10 +37,7 @@ const ButtonBase = styled.button<ButtonProps>\`
   & svg.lucide {
     margin: auto 0;
     min-width: min-content;
-    color: \${({ theme, $outline }) =>
-      $outline ? "inherit" : theme.colors.light};
-    stroke: \${({ theme, $outline }) =>
-      $outline ? "currentColor" : theme.colors.light};
+    color: inherit;
   }
 \`;
 
@@ -68,13 +62,9 @@ function Button({
         $outline={outline}
         $fullWidth={fullWidth}
       >
-        {iconPosition === "left" && icon && (
-          <Icon name={icon} color={theme.colors.light} size={16} />
-        )}
+        {iconPosition === "left" && icon && <Icon name={icon} size={16} />}
         {props.children}
-        {iconPosition === "right" && icon && (
-          <Icon name={icon} color={theme.colors.light} size={16} />
-        )}
+        {iconPosition === "right" && icon && <Icon name={icon} size={16} />}
       </StyledLinkButton>
     </div>
   ) : (
@@ -86,13 +76,9 @@ function Button({
         $outline={outline}
         $fullWidth={fullWidth}
       >
-        {iconPosition === "left" && icon && (
-          <Icon name={icon} color={theme.colors.light} size={16} />
-        )}
+        {iconPosition === "left" && icon && <Icon name={icon} size={16} />}
         {props.children}
-        {iconPosition === "right" && icon && (
-          <Icon name={icon} color={theme.colors.light} size={16} />
-        )}
+        {iconPosition === "right" && icon && <Icon name={icon} size={16} />}
       </ButtonBase>
     </div>
   );

package/dist/templates/components/layout/Icon.d.ts

@@ -1 +1 @@
-export declare const iconTemplate = "import { icons } from \"lucide-react\";\n\nexport type IconProps = keyof typeof icons;\n\ninterface Props {\n  name: string | IconProps;\n  color?: string;\n  size?: number;\n  className?: string;\n}\n\nfunction transformIconName(name: string): string {\n  return name\n    .split(\"-\")\n    .map((word) => word.charAt(0).toUpperCase() + word.slice(1))\n    .join(\"\");\n}\n\nconst Icon = ({ name, color, size, className }: Props) => {\n  const IconName = transformIconName(name as string);\n  const LucideIcon = icons[IconName as keyof typeof icons];\n  if (!LucideIcon) return null;\n\n  return <LucideIcon color={color} size={size} className={className} />;\n};\n\nexport { Icon };\n";
+export declare const iconTemplate = "import { icons } from \"lucide-react\";\n\nexport type IconProps = keyof typeof icons;\n\ninterface Props {\n  name: string | IconProps;\n  color?: string;\n  size?: string | number;\n  className?: string;\n}\n\nfunction transformIconName(name: string): string {\n  return name\n    .split(\"-\")\n    .map((word) => word.charAt(0).toUpperCase() + word.slice(1))\n    .join(\"\");\n}\n\nconst Icon = ({ name, color, size, className }: Props) => {\n  const IconName = transformIconName(name as string);\n  const LucideIcon = icons[IconName as keyof typeof icons];\n  if (!LucideIcon) return null;\n\n  const numericSize = size != null ? Number(size) : undefined;\n\n  return <LucideIcon color={color} size={numericSize} className={className} />;\n};\n\nexport { Icon };\n";

package/dist/templates/components/layout/Icon.js

@@ -5,7 +5,7 @@ export type IconProps = keyof typeof icons;
 interface Props {
   name: string | IconProps;
   color?: string;
-  size?: number;
+  size?: string | number;
   className?: string;
 }
 
@@ -21,7 +21,9 @@ const Icon = ({ name, color, size, className }: Props) => {
   const LucideIcon = icons[IconName as keyof typeof icons];
   if (!LucideIcon) return null;
 
-  return <LucideIcon color={color} size={size} className={className} />;
+  const numericSize = size != null ? Number(size) : undefined;
+
+  return <LucideIcon color={color} size={numericSize} className={className} />;
 };
 
 export { Icon };

package/dist/templates/components/layout/StaticLinks.d.ts

@@ -1 +1 @@
-export declare const staticLinksTemplate = "\"use client\";\nimport { useContext } from \"react\";\nimport styled, { css } from \"styled-components\";\nimport { rgba } from \"polished\";\nimport { mq, Theme } from \"@/app/theme\";\nimport { ChatContext } from \"@/components/Chat\";\nimport { interactiveStyles } from \"@/components/layout/SharedStyled\";\nimport { Icon } from \"@/components/layout/Icon\";\nimport linksData from \"@/links.json\";\n\ninterface LinkProps {\n  title: string;\n  url: string;\n  icon?: string;\n}\n\nconst links = linksData as LinkProps[];\n\nconst StyledStaticLinks = styled.div<{ theme: Theme; $isChatOpen?: boolean }>`\n  position: fixed;\n  border-bottom: solid 1px ${({ theme }) => theme.colors.grayLight};\n  top: 70px;\n  padding: 10px 20px;\n  display: flex;\n  justify-content: space-between;\n  width: 100%;\n  z-index: 999;\n  transition: all 0.3s ease;\n  margin: auto;\n  background: ${({ theme }) => theme.colors.light};\n  overflow-x: auto;\n  left: 50%;\n  transform: translateX(-50%);\n\n  ${mq(\"lg\")} {\n    padding: 20px;\n    height: 73px;\n    top: 0;\n    max-width: calc(100vw - 640px);\n    width: 100%;\n    margin: auto;\n\n    ${({ $isChatOpen }) =>\n      $isChatOpen &&\n      css`\n        padding: 20px 120px 20px 20px;\n      `}\n  }\n`;\n\nconst StyledStaticLinksContent = styled.div`\n  margin: auto 0;\n  display: flex;\n  gap: 16px;\n  flex-wrap: nowrap;\n`;\n\nconst StyledLink = styled.a<{ theme: Theme; $hasIcon?: boolean }>`\n  position: relative;\n  text-decoration: none;\n  font-size: ${({ theme }) => theme.fontSizes.small.lg};\n  line-height: 1;\n  color: ${({ theme }) =>\n    theme.isDark ? theme.colors.primary : theme.colors.primary};\n  padding: 0;\n  display: flex;\n  gap: 6px;\n  transition: all 0.3s ease;\n  font-weight: 600;\n  white-space: nowrap;\n  min-width: fit-content;\n  background: ${({ theme }) => rgba(theme.colors.primaryLight, 0.1)};\n  padding: 6px 8px;\n  border-radius: ${({ theme }) => theme.spacing.radius.xs};\n  ${interactiveStyles};\n\n  ${({ $hasIcon }) =>\n    $hasIcon &&\n    css`\n      padding-left: 30px;\n    `}\n\n  & * {\n    margin: auto 0;\n  }\n\n  & svg {\n    position: absolute;\n    top: 50%;\n    left: 8px;\n    transform: translateY(-50%);\n  }\n\n  &:hover {\n    color: ${({ theme }) =>\n      theme.isDark ? theme.colors.primaryLight : theme.colors.primaryDark};\n  }\n`;\n\nconst StyledEmpty = styled.div`\n  width: 1px;\n  max-width: 1px;\n  min-width: 1px;\n  overflow: hidden;\n  text-indent: -9999px;\n`;\n\nfunction StaticLinks() {\n  const { isOpen } = useContext(ChatContext);\n\n  if (links.length === 0) {\n    return null;\n  }\n\n  return (\n    <>\n      <StyledStaticLinks $isChatOpen={isOpen}>\n        <StyledStaticLinksContent>\n          {links.map((link, index) => (\n            <StyledLink\n              key={index}\n              href={link.url}\n              target=\"_blank\"\n              rel=\"noopener noreferrer\"\n              $hasIcon={link.icon ? true : false}\n            >\n              {link.icon && <Icon name={link.icon} size={16} />}\n              <span>{link.title}</span>\n            </StyledLink>\n          ))}\n          <StyledEmpty />\n        </StyledStaticLinksContent>\n      </StyledStaticLinks>\n    </>\n  );\n}\n\nexport { StaticLinks };\n";
+export declare const staticLinksTemplate = "\"use client\";\nimport { useContext } from \"react\";\nimport styled, { css } from \"styled-components\";\nimport { rgba } from \"polished\";\nimport { mq, Theme } from \"@/app/theme\";\nimport { ChatContext } from \"@/components/Chat\";\nimport { interactiveStyles } from \"@/components/layout/SharedStyled\";\nimport { Icon } from \"@/components/layout/Icon\";\nimport linksData from \"@/links.json\";\n\ninterface LinkProps {\n  title: string;\n  url: string;\n  icon?: string;\n}\n\nconst links = linksData as LinkProps[];\n\nconst StyledStaticLinks = styled.div<{ theme: Theme; $isChatOpen?: boolean }>`\n  position: fixed;\n  border-bottom: solid 1px ${({ theme }) => theme.colors.grayLight};\n  top: 70px;\n  padding: 10px 20px;\n  display: flex;\n  justify-content: space-between;\n  width: 100%;\n  z-index: 999;\n  transition: all 0.3s ease;\n  margin: auto;\n  background: ${({ theme }) => theme.colors.light};\n  overflow-x: auto;\n  left: 50%;\n  transform: translateX(-50%);\n\n  ${mq(\"lg\")} {\n    padding: 20px;\n    height: 73px;\n    top: 0;\n    max-width: calc(100vw - 640px);\n    width: 100%;\n    margin: auto;\n\n    ${({ $isChatOpen }) =>\n      $isChatOpen &&\n      css`\n        padding: 20px 120px 20px 20px;\n      `}\n  }\n`;\n\nconst StyledStaticLinksContent = styled.div`\n  margin: auto 0;\n  display: flex;\n  gap: 16px;\n  flex-wrap: nowrap;\n`;\n\nconst StyledLink = styled.a<{ theme: Theme; $hasIcon?: boolean }>`\n  position: relative;\n  text-decoration: none;\n  font-size: ${({ theme }) => theme.fontSizes.small.lg};\n  line-height: 1;\n  color: ${({ theme }) =>\n    theme.isDark ? theme.colors.primary : theme.colors.primary};\n  padding: 0;\n  display: flex;\n  gap: 6px;\n  transition: all 0.3s ease;\n  font-weight: 600;\n  white-space: nowrap;\n  min-width: fit-content;\n  background: ${({ theme }) => rgba(theme.colors.primaryLight, 0.1)};\n  padding: 6px 8px;\n  border-radius: ${({ theme }) => theme.spacing.radius.xs};\n  ${interactiveStyles};\n\n  ${({ $hasIcon }) =>\n    $hasIcon &&\n    css`\n      padding-left: 30px;\n    `}\n\n  & * {\n    margin: auto 0;\n  }\n\n  & svg {\n    position: absolute;\n    top: 50%;\n    left: 8px;\n    transform: translateY(-50%);\n  }\n\n  &:hover {\n    color: ${({ theme }) =>\n      theme.isDark ? theme.colors.primaryLight : theme.colors.primaryDark};\n  }\n`;\n\nconst StyledEmpty = styled.div`\n  width: 1px;\n  max-width: 1px;\n  min-width: 1px;\n  overflow: hidden;\n  text-indent: -9999px;\n`;\n\nfunction StaticLinks() {\n  const { isOpen } = useContext(ChatContext);\n\n  if (links.length === 0) {\n    return null;\n  }\n\n  return (\n    <>\n      <StyledStaticLinks $isChatOpen={isOpen} id=\"static-links\">\n        <StyledStaticLinksContent>\n          {links.map((link, index) => (\n            <StyledLink\n              key={index}\n              href={link.url}\n              target=\"_blank\"\n              rel=\"noopener noreferrer\"\n              $hasIcon={link.icon ? true : false}\n            >\n              {link.icon && <Icon name={link.icon} size={16} />}\n              <span>{link.title}</span>\n            </StyledLink>\n          ))}\n          <StyledEmpty />\n        </StyledStaticLinksContent>\n      </StyledStaticLinks>\n    </>\n  );\n}\n\nexport { StaticLinks };\n";

package/dist/templates/components/layout/StaticLinks.js

@@ -114,7 +114,7 @@ function StaticLinks() {
 
   return (
     <>
-      <StyledStaticLinks $isChatOpen={isOpen}>
+      <StyledStaticLinks $isChatOpen={isOpen} id="static-links">
         <StyledStaticLinksContent>
           {links.map((link, index) => (
             <StyledLink

package/dist/templates/package.js

@@ -24,10 +24,10 @@ export const packageJsonTemplate = JSON.stringify({
         "@types/react": "^19",
         "@types/react-dom": "^19",
         "baseline-browser-mapping": "^2.9.19",
-        "cherry-styled-components": "^0.1.8",
+        "cherry-styled-components": "^0.1.11",
         eslint: "^9",
         "eslint-config-next": "16.1.6",
-        "lucide-react": "^0.563.0",
+        "lucide-react": "^0.564.0",
         "next-mdx-remote": "^6.0.0",
         polished: "^4.3.1",
         prettier: "^3.8.1",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "doccupine",
-  "version": "0.0.48",
+  "version": "0.0.50",
   "description": "Document management system that allows you to store, organize, and share your documentation with ease. AI-ready.",
   "main": "dist/index.js",
   "bin": {
@@ -20,6 +20,7 @@
     "mdx",
     "ai",
     "llm",
+    "mcp",
     "nextjs",
     "cli",
     "generator",