@adminide-stack/yantra-help-browser 12.0.16-alpha.1 → 12.0.16-alpha.14

package/lib/components/HelpCenterHeader.d.ts

@@ -1,6 +1,7 @@
 import React from 'react';
 interface HelpCenterHeaderProps {
     onSearch?: (query: string) => void;
+    initialSearchQuery?: string;
 }
 export declare const HelpCenterHeader: React.FC<HelpCenterHeaderProps>;
 export {};

package/lib/components/HelpCenterHeader.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"HelpCenterHeader.d.ts","sourceRoot":"","sources":["../../src/components/HelpCenterHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmB,MAAM,OAAO,CAAC;AAExC,UAAU,qBAAqB;IAC7B,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACpC;AAED,eAAO,MAAM,gBAAgB,EAAE,KAAK,CAAC,EAAE,CAAC,qBAAqB,CA2E5D,CAAC"}
+{"version":3,"file":"HelpCenterHeader.d.ts","sourceRoot":"","sources":["../../src/components/HelpCenterHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAsC,MAAM,OAAO,CAAC;AAK3D,UAAU,qBAAqB;IAC3B,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,kBAAkB,CAAC,EAAE,MAAM,CAAC;CAC/B;AAED,eAAO,MAAM,gBAAgB,EAAE,KAAK,CAAC,EAAE,CAAC,qBAAqB,CAoS5D,CAAC"}

package/lib/components/HelpCenterHeader.js

@@ -1,15 +1,121 @@
-import {jsxs,jsx}from'react/jsx-runtime';import {useState}from'react';const HelpCenterHeader = ({
-  onSearch
+import {jsxs,jsx,Fragment}from'react/jsx-runtime';import {useState,useRef,useEffect}from'react';import {createPortal}from'react-dom';import {useNavigate}from'@remix-run/react';import {searchArticles,getCategoryById}from'../utils/markdownLoader.js';const HelpCenterHeader = ({
+  onSearch,
+  initialSearchQuery = ''
 }) => {
-  const [searchQuery, setSearchQuery] = useState('');
+  const navigate = useNavigate();
+  const [searchQuery, setSearchQuery] = useState(initialSearchQuery);
+  const [searchResults, setSearchResults] = useState([]);
+  const [showDropdown, setShowDropdown] = useState(false);
+  const [selectedIndex, setSelectedIndex] = useState(-1);
+  const [dropdownPosition, setDropdownPosition] = useState({
+    top: 0,
+    left: 0,
+    width: 0
+  });
+  const searchContainerRef = useRef(null);
+  const inputRef = useRef(null);
+  // Update search query when initialSearchQuery changes
+  useEffect(() => {
+    setSearchQuery(initialSearchQuery);
+  }, [initialSearchQuery]);
+  // Calculate dropdown position
+  const updateDropdownPosition = useRef(() => {
+    if (searchContainerRef.current) {
+      const rect = searchContainerRef.current.getBoundingClientRect();
+      setDropdownPosition({
+        top: rect.bottom + window.scrollY + 4,
+        left: rect.left + window.scrollX,
+        width: rect.width
+      });
+    }
+  });
+  // Perform search as user types
+  useEffect(() => {
+    if (searchQuery.trim().length > 0) {
+      const results = searchArticles(searchQuery);
+      setSearchResults(results.slice(0, 10)); // Limit to 10 results
+      setShowDropdown(true);
+      setSelectedIndex(-1);
+      // Use setTimeout to ensure DOM is updated
+      setTimeout(() => {
+        updateDropdownPosition.current();
+      }, 0);
+    } else {
+      setSearchResults([]);
+      setShowDropdown(false);
+    }
+  }, [searchQuery]);
+  // Update position on scroll/resize
+  useEffect(() => {
+    if (showDropdown) {
+      updateDropdownPosition.current();
+      const handleScroll = () => updateDropdownPosition.current();
+      const handleResize = () => updateDropdownPosition.current();
+      window.addEventListener('scroll', handleScroll, true);
+      window.addEventListener('resize', handleResize);
+      return () => {
+        window.removeEventListener('scroll', handleScroll, true);
+        window.removeEventListener('resize', handleResize);
+      };
+    }
+  }, [showDropdown]);
+  // Close dropdown when clicking outside
+  useEffect(() => {
+    const handleClickOutside = event => {
+      const target = event.target;
+      // Check if click is outside search container AND not on dropdown
+      if (searchContainerRef.current && !searchContainerRef.current.contains(target)) {
+        // Check if click is on the dropdown (which is in a portal)
+        const dropdown = document.querySelector('[data-search-dropdown]');
+        if (!dropdown || !dropdown.contains(target)) {
+          setShowDropdown(false);
+        }
+      }
+    };
+    document.addEventListener('mousedown', handleClickOutside);
+    return () => {
+      document.removeEventListener('mousedown', handleClickOutside);
+    };
+  }, []);
   const handleSearch = e => {
     e.preventDefault();
     if (onSearch && searchQuery.trim()) {
       onSearch(searchQuery);
     }
+    // If there are results and user presses enter, navigate to first result
+    if (searchResults.length > 0) {
+      const firstResult = searchResults[0];
+      navigate(`/help-center/${firstResult.categoryId}/${firstResult.slug}`);
+      setShowDropdown(false);
+    }
+  };
+  const handleInputChange = e => {
+    setSearchQuery(e.target.value);
+  };
+  const handleInputFocus = () => {
+    if (searchResults.length > 0) {
+      setShowDropdown(true);
+    }
+  };
+  const handleResultClick = (article, e) => {
+    if (e) {
+      e.preventDefault();
+      e.stopPropagation();
+    }
+    // Verify article has required fields
+    if (!article || !article.categoryId || !article.slug) {
+      console.error('Article missing required fields:', article);
+      return;
+    }
+    // Close dropdown
+    setShowDropdown(false);
+    setSearchQuery('');
+    // Navigate to the article using Remix navigate
+    const path = `/help-center/${article.categoryId}/${article.slug}`;
+    navigate(path);
   };
   return jsxs("div", {
-    className: "relative overflow-hidden w-full ",
+    className: "relative overflow-visible w-full",
     children: [jsx("div", {
       className: "absolute inset-0 bg-[#057d78]",
       children: jsx("div", {
@@ -21,47 +127,62 @@ import {jsxs,jsx}from'react/jsx-runtime';import {useState}from'react';const Help
       })
     }), jsx("div", {
       className: "relative z-10 mx-auto flex min-h-[500px] max-w-7xl flex-col items-center justify-center px-6 pt-20 text-center lg:px-16",
+      style: {
+        overflow: 'visible'
+      },
       children: jsxs("div", {
-        className: "max-w-4xl",
+        className: "max-w-4xl w-full",
+        style: {
+          overflow: 'visible'
+        },
         children: [jsx("h1", {
           className: "mb-6 text-5xl font-light leading-[1.1] tracking-tight text-white lg:text-7xl",
           children: "How can we help?"
         }), jsx("p", {
           className: "mb-12 text-xl font-normal text-white/80 lg:text-2xl",
-          children: "Get answers to all things Yantra."
+          children: "Get answers to all things Clockbook."
         }), jsx("form", {
           onSubmit: handleSearch,
           className: "relative w-full max-w-2xl mx-auto",
-          children: jsxs("div", {
-            className: "flex w-full rounded-2xl bg-white shadow-2xl overflow-hidden",
-            children: [jsxs("div", {
-              className: "relative flex-1",
-              children: [jsx("div", {
-                className: "pointer-events-none absolute inset-y-0 left-0 flex items-center pl-6",
-                children: jsx("svg", {
-                  className: "h-6 w-6 text-gray-400",
-                  fill: "none",
-                  viewBox: "0 0 24 24",
-                  stroke: "currentColor",
-                  children: jsx("path", {
-                    strokeLinecap: "round",
-                    strokeLinejoin: "round",
-                    strokeWidth: 2,
-                    d: "M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z"
+          style: {
+            zIndex: 50
+          },
+          children: jsx("div", {
+            ref: searchContainerRef,
+            className: "relative w-full",
+            children: jsxs("div", {
+              className: "flex w-full rounded-2xl bg-white shadow-2xl",
+              children: [jsxs("div", {
+                className: "relative flex-1",
+                children: [jsx("div", {
+                  className: "pointer-events-none absolute inset-y-0 left-0 flex items-center pl-6 z-10",
+                  children: jsx("svg", {
+                    className: "h-6 w-6 text-gray-400",
+                    fill: "none",
+                    viewBox: "0 0 24 24",
+                    stroke: "currentColor",
+                    children: jsx("path", {
+                      strokeLinecap: "round",
+                      strokeLinejoin: "round",
+                      strokeWidth: 2,
+                      d: "M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z"
+                    })
                   })
-                })
-              }), jsx("input", {
-                type: "text",
-                className: "h-16 w-full bg-transparent py-6 pl-16 pr-6 text-lg text-gray-900 placeholder-gray-500 outline-none",
-                placeholder: "Search help center...",
-                value: searchQuery,
-                onChange: e => setSearchQuery(e.target.value)
+                }), jsx("input", {
+                  ref: inputRef,
+                  type: "text",
+                  className: "h-16 w-full bg-transparent py-6 pl-16 pr-6 text-lg text-gray-900 placeholder-gray-500 outline-none relative z-10",
+                  placeholder: "Search help center...",
+                  value: searchQuery,
+                  onChange: handleInputChange,
+                  onFocus: handleInputFocus
+                })]
+              }), jsx("button", {
+                type: "submit",
+                className: "flex items-center justify-center rounded-r-2xl bg-gray-900 px-8 text-lg font-medium text-white transition-colors hover:bg-gray-800 relative z-10",
+                children: "Search"
               })]
-            }), jsx("button", {
-              type: "submit",
-              className: "flex items-center justify-center rounded-r-2xl bg-gray-900 px-8 text-lg font-medium text-white transition-colors hover:bg-gray-800",
-              children: "Search"
-            })]
+            })
           })
         }), jsxs("div", {
           className: "mt-8 flex flex-wrap justify-center gap-3",
@@ -69,12 +190,77 @@ import {jsxs,jsx}from'react/jsx-runtime';import {useState}from'react';const Help
             className: "text-sm text-white/60",
             children: "Popular:"
           }), ['Getting started', 'Account setup', 'API documentation', 'Troubleshooting'].map(term => jsx("button", {
-            onClick: () => setSearchQuery(term),
+            onClick: () => {
+              setSearchQuery(term);
+              setShowDropdown(true);
+            },
             className: "rounded-full bg-white/10 px-4 py-2 text-sm text-white/80 transition-colors hover:bg-white/20 hover:text-white",
             children: term
           }, term))]
         })]
       })
-    })]
+    }), showDropdown && typeof document !== 'undefined' && createPortal(jsx(Fragment, {
+      children: searchResults.length > 0 ? jsx("div", {
+        "data-search-dropdown": true,
+        className: "fixed bg-white rounded-lg shadow-2xl border border-gray-200 max-h-96 overflow-y-auto z-[9999]",
+        style: {
+          top: `${dropdownPosition.top}px`,
+          left: `${dropdownPosition.left}px`,
+          width: `${dropdownPosition.width}px`
+        },
+        onClick: e => e.stopPropagation(),
+        children: jsx("div", {
+          className: "py-1",
+          children: searchResults.map((article, index) => {
+            const category = getCategoryById(article.categoryId);
+            `/help-center/${article.categoryId}/${article.slug}`;
+            return jsx("div", {
+              onClick: e => {
+                console.log('Click event fired on article:', article.title);
+                e.preventDefault();
+                e.stopPropagation();
+                handleResultClick(article, e);
+              },
+              className: `block px-4 py-3 hover:bg-blue-50 transition-colors cursor-pointer border-b border-gray-100 last:border-b-0 ${selectedIndex === index ? 'bg-blue-50' : ''}`,
+              role: "button",
+              tabIndex: 0,
+              onKeyDown: e => {
+                if (e.key === 'Enter' || e.key === ' ') {
+                  e.preventDefault();
+                  handleResultClick(article);
+                }
+              },
+              children: jsxs("div", {
+                className: "flex flex-col",
+                children: [jsx("div", {
+                  className: "text-base font-semibold text-gray-900",
+                  children: article.title
+                }), article.description && jsx("div", {
+                  className: "text-sm text-gray-600 mt-0.5",
+                  children: article.description
+                }), category && jsx("div", {
+                  className: "text-xs text-blue-600 mt-1 font-medium",
+                  children: category.title
+                })]
+              })
+            }, article.id);
+          })
+        })
+      }) : searchQuery.trim().length > 0 ? jsx("div", {
+        className: "fixed bg-white rounded-lg shadow-2xl border border-gray-200 z-[9999]",
+        style: {
+          top: `${dropdownPosition.top}px`,
+          left: `${dropdownPosition.left}px`,
+          width: `${dropdownPosition.width}px`
+        },
+        onClick: e => e.stopPropagation(),
+        children: jsx("div", {
+          className: "px-4 py-6 text-center text-gray-500",
+          children: jsxs("p", {
+            children: ["No results found for \"", searchQuery, "\""]
+          })
+        })
+      }) : null
+    }), document.body)]
   });
 };export{HelpCenterHeader};//# sourceMappingURL=HelpCenterHeader.js.map

package/lib/components/HelpCenterHeader.js.map

@@ -1 +1 @@
-{"version":3,"file":"HelpCenterHeader.js","sources":["../../src/components/HelpCenterHeader.tsx"],"sourcesContent":[null],"names":["_jsxs","_jsx"],"mappings":"4EAMa,gBAAgB,GAAoC,CAAC;;AAKhE,CAAA,KAAA;QACE,CAAC,WAAe,EAAA,cAAG,CAAA,GAAA,QAAA,CAAA,EAAA,CAAA;AACnB,EAAA,MAAA,YAAY,GAAI,CAAA,IAAA;oBACN,EAAY;QACtB,QAAC,IAAA,WAAA,CAAA,IAAA,EAAA,EAAA;AACH,MAAE,QAAA,CAAA,WAAA,CAAA;AAEF;AAKQ,GAAA;AACA,EAAA,OAAAA,IAAA,CAAA,KAAA,EAAA;AACD,IAAA,SAAA,EAAA;AAwDT,IAAE,QAAA,EAAA,CAAAC,GAAA,CAAA,KAAA,EAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"HelpCenterHeader.js","sources":["../../src/components/HelpCenterHeader.tsx"],"sourcesContent":[null],"names":["_jsxs","_jsx"],"mappings":"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"}

package/lib/components/SidebarSearch.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+interface SidebarSearchProps {
+    className?: string;
+    placeholder?: string;
+}
+export declare const SidebarSearch: React.FC<SidebarSearchProps>;
+export {};
+//# sourceMappingURL=SidebarSearch.d.ts.map

package/lib/components/SidebarSearch.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SidebarSearch.d.ts","sourceRoot":"","sources":["../../src/components/SidebarSearch.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAsC,MAAM,OAAO,CAAC;AAK3D,UAAU,kBAAkB;IACxB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;CACxB;AAED,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CAwHtD,CAAC"}

package/lib/components/SidebarSearch.js

@@ -0,0 +1,111 @@
+import {jsxs,jsx}from'react/jsx-runtime';import {useState,useRef,useEffect}from'react';import {useNavigate}from'@remix-run/react';import {FiSearch}from'@react-icons/all-files/fi/FiSearch.js';import {searchArticles,getCategoryById}from'../utils/markdownLoader.js';const SidebarSearch = ({
+  className = '',
+  placeholder = 'Search...'
+}) => {
+  const navigate = useNavigate();
+  const [searchQuery, setSearchQuery] = useState('');
+  const [searchResults, setSearchResults] = useState([]);
+  const [showDropdown, setShowDropdown] = useState(false);
+  const [selectedIndex, setSelectedIndex] = useState(-1);
+  const searchContainerRef = useRef(null);
+  const inputRef = useRef(null);
+  // Perform search as user types
+  useEffect(() => {
+    if (searchQuery.trim().length > 0) {
+      const results = searchArticles(searchQuery);
+      setSearchResults(results.slice(0, 5)); // Limit to 5 results for sidebar
+      setShowDropdown(true);
+      setSelectedIndex(-1);
+    } else {
+      setSearchResults([]);
+      setShowDropdown(false);
+    }
+  }, [searchQuery]);
+  // Close dropdown when clicking outside
+  useEffect(() => {
+    const handleClickOutside = event => {
+      const target = event.target;
+      if (searchContainerRef.current && !searchContainerRef.current.contains(target)) {
+        const dropdown = document.querySelector('[data-sidebar-search-dropdown]');
+        if (!dropdown || !dropdown.contains(target)) {
+          setShowDropdown(false);
+        }
+      }
+    };
+    document.addEventListener('mousedown', handleClickOutside);
+    return () => {
+      document.removeEventListener('mousedown', handleClickOutside);
+    };
+  }, []);
+  const handleSearch = e => {
+    e.preventDefault();
+    if (searchResults.length > 0) {
+      const firstResult = searchResults[0];
+      navigate(`/help-center/${firstResult.categoryId}/${firstResult.slug}`);
+      setShowDropdown(false);
+      setSearchQuery('');
+    }
+  };
+  const handleInputChange = e => {
+    setSearchQuery(e.target.value);
+  };
+  const handleInputFocus = () => {
+    if (searchResults.length > 0) {
+      setShowDropdown(true);
+    }
+  };
+  const handleResultClick = article => {
+    if (!article || !article.categoryId || !article.slug) {
+      return;
+    }
+    setShowDropdown(false);
+    setSearchQuery('');
+    navigate(`/help-center/${article.categoryId}/${article.slug}`);
+  };
+  return jsxs("div", {
+    className: `relative w-full ${className}`,
+    ref: searchContainerRef,
+    children: [jsx("form", {
+      onSubmit: handleSearch,
+      className: "relative",
+      children: jsxs("div", {
+        className: "relative",
+        children: [jsx("div", {
+          className: "pointer-events-none absolute inset-y-0 left-0 flex items-center pl-3",
+          children: jsx(FiSearch, {
+            className: "h-4 w-4 text-gray-400",
+            "aria-hidden": "true"
+          })
+        }), jsx("input", {
+          ref: inputRef,
+          type: "text",
+          className: "block w-full rounded-md border border-gray-300 dark:border-gray-700 bg-white dark:bg-gray-800 py-2 pl-10 pr-3 text-sm text-gray-900 dark:text-white placeholder-gray-500 dark:placeholder-gray-400 focus:border-blue-500 focus:outline-none focus:ring-1 focus:ring-blue-500",
+          placeholder: placeholder,
+          value: searchQuery,
+          onChange: handleInputChange,
+          onFocus: handleInputFocus
+        })]
+      })
+    }), showDropdown && searchResults.length > 0 && jsx("div", {
+      "data-sidebar-search-dropdown": true,
+      className: "absolute z-50 mt-1 w-full bg-white dark:bg-gray-800 rounded-md shadow-lg border border-gray-200 dark:border-gray-700 max-h-64 overflow-y-auto",
+      children: jsx("div", {
+        className: "py-1",
+        children: searchResults.map((article, index) => {
+          const category = getCategoryById(article.categoryId);
+          return jsxs("div", {
+            onClick: () => handleResultClick(article),
+            className: `block px-4 py-2 text-sm hover:bg-gray-50 dark:hover:bg-gray-700 cursor-pointer ${selectedIndex === index ? 'bg-gray-50 dark:bg-gray-700' : ''}`,
+            children: [jsx("div", {
+              className: "font-medium text-gray-900 dark:text-gray-100",
+              children: article.title
+            }), category && jsx("div", {
+              className: "text-xs text-gray-500 dark:text-gray-400 mt-0.5",
+              children: category.title
+            })]
+          }, article.id);
+        })
+      })
+    })]
+  });
+};export{SidebarSearch};//# sourceMappingURL=SidebarSearch.js.map

package/lib/components/SidebarSearch.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SidebarSearch.js","sources":["../../src/components/SidebarSearch.tsx"],"sourcesContent":[null],"names":[],"mappings":"uQAUO,MAAM,aAAa,GAAiC,CAAC;AACxD,EAAA,SAAc,GAAA,EAAA;aACI,GAAA;MACZ;QACA,QAAa,GAAA,WAAiB,EAAA;QAC9B,CAAA,WAAc,EAAA,cAAkB,CAAA,GAAA,QAAI,CAAA,EAAA,CAAA;AAC1C,EAAA,MAAA,CAAA,+BAAkD,CAAA,GAAM,QAAA,CAAA,EAAA,CAAA;AACxD,EAAA,MAAA,CAAA,YAAiB,EAAA,eAA+B,CAAA,GAAA,QAAA,CAAA,KAAA,CAAA;QAEjB,CAAA,aAAA,EAAA,gBAAA,CAAA,GAAA,QAAA,CAAA,EAAA,CAAA;QACtB,kBAAM,GAAA,MAAA,CAAA,IAAA,CAAA;QACX,QAAI,GAAA,MAAgB,CAAA,IAAE,CAAC;AACnB;AACA,EAAA,SAAA,CAAA,MAAA;mBACe,CAAA,IAAA,EAAA,CAAA,MAAM,GAAC,CAAA,EAAA;AACtB,MAAA,MAAA,OAAA,GAAA,cAAqB,CAAA,WAAA,CAAA;sBACxB,CAAA,OAAA,CAAA,KAAA,CAAA,CAAA,EAAA,CAAA,CAAA,CAAA,CAAA;qBAAO,CAAA,IAAA,CAAA;sBACY,CAAA,EAAA,CAAA;;sBAEnB,CAAA,EAAA,CAAA;AACL,MAAG,eAAc,CAAC,KAAA,CAAA;;KAGT,CAAA,WAAI,CAAE,CAAA;AACX;AACI,EAAA,SAAA,CAAA,MAAM;AACN,IAAA,MAAA,kBAAsB,GAAA,KAAQ,IAAA;kBACpB,GAAA,KAAA,CAAA,MAAW;4BACJ,CAAA,OAAK,IAAA,CAAA,kBAAyB,CAAA,OAAG,CAAA,QAAA,CAAA,MAAA,CAAA,EAAA;sBAC3B,GAAA,QAAA,CAAA,aAAQ,CAAA,gCAAA,CAAA;qBAC1B,IAAA,CAAA,QAAA,CAAA,QAAA,CAAA,MAAA,CAAA,EAAA;yBACJ,CAAA,KAAA,CAAA;AACL;AAEA;AACA,KAAA;AACI,IAAA,QAAA,CAAA,gBAA4B,CAAA,WAAC,oBAAa,CAAA;AAC9C,IAAA,OAAE,MAAA;MACL,QAAM,CAAA,mBAAA,CAAA,WAAA,EAAA,kBAAA,CAAA;AAEP,KAAA;QACI;AACA,EAAA,MAAA,oBAAkB;AACd,IAAA,CAAA,CAAA;qBACS,CAAgB,MAAA,GAAA,CAAA,EAAA;YACzB,WAAe,GAAA,aAAQ,CAAA,CAAA,CAAA;cACT,CAAA,CAAA,aAAG,EAAE,WAAA,CAAA,UAAA,CAAA,CAAA,EAAA,WAAA,CAAA,IAAA,CAAA,CAAA,CAAA;qBACtB,CAAA,KAAA,CAAA;AACL,MAAE,cAAA,CAAA,EAAA,CAAA;AAEF;AACI,GAAA;AACJ,EAAA,MAAE,iBAAA,GAAA,CAAA,IAAA;IAEF,cAAM,CAAA,CAAA,CAAA,MAAmB,CAAA,KAAK,CAAA;AAC1B,GAAA;wBACmB,GAAA,MAAM;QACzB,aAAC,CAAA,MAAA,GAAA,CAAA,EAAA;AACL,MAAE,eAAA,CAAA,IAAA,CAAA;AAEF;AACI,GAAA;yBACW,GAAA,OAAA,IAAA;QACX,CAAC,OAAA,IAAA,CAAA,OAAA,CAAA,UAAA,IAAA,CAAA,OAAA,CAAA,IAAA,EAAA;;;mBAIwB,CAAA,KAAA,CAAA;AAC7B,IAAA,cAAE,CAAA,EAAA,CAAA;IAEF,QACI,eAAK,EAAS,OAAA,CAAA,qBAA8B,CAAA,IAAA,CAAA,CAAA,CAAA;;;AA2C5B,IAAA,SAAA,EAAA,CAAA,gBAGX,EAER,SAAC,CAAA,CAAA;AACN,IAAE,GAAA,EAAA,kBAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/lib/pages/ArticlePage/ArticlePage.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+export declare const ArticlePage: React.FC;
+//# sourceMappingURL=ArticlePage.d.ts.map

package/lib/pages/ArticlePage/ArticlePage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ArticlePage.d.ts","sourceRoot":"","sources":["../../../src/pages/ArticlePage/ArticlePage.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAsC,MAAM,OAAO,CAAC;AAM3D,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAwP/B,CAAC"}