{"ast":null,"code":"import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutProperties from \"@babel/runtime/helpers/esm/objectWithoutProperties\";\n\nvar _this = this,\n    _jsxFileName = \"/Users/silverdust/Projects/ConvertKit/convertkit-design/docs/components/navigation.js\";\n\nvar __jsx = React.createElement;\nimport React from \"react\";\nimport Stack from \"@convertkit/design/stack\";\nimport components from \"./components\";\nimport { ComponentLink, stringToUrl, TopNavLink } from \"./nav-link\";\nvar topNavLinks = [\"Getting Started\", \"Accessibility\", \"Styling\"];\nvar utilsNavLinks = [\"confirm\", \"useFetch\", \"useGet\", \"useToast\"];\nvar otherNavLinks = [\"FAQ\", \"Antipatterns\", \"Inspiration\"];\nvar guideNavLinks = [\"Add a Page\", \"Fetching Data\", \"Responsive Design\", \"Setting Default Props\", \"Button vs Link\", \"Tooltip Usage\"];\n\nvar NavGroupHeading = function NavGroupHeading(_ref) {\n  var _ref$className = _ref.className,\n      className = _ref$className === void 0 ? \"\" : _ref$className,\n      props = _objectWithoutProperties(_ref, [\"className\"]);\n\n  return __jsx(\"h2\", _extends({\n    className: \"text-base tracking-wide font-semibold \".concat(className)\n  }, props, {\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 22,\n      columnNumber: 3\n    }\n  }));\n};\n\n_c = NavGroupHeading;\nexport var NavigationContent = function NavigationContent(_ref2) {\n  var _ref2$contentHeight = _ref2.contentHeight,\n      contentHeight = _ref2$contentHeight === void 0 ? \"calc(100vh - 4rem)\" : _ref2$contentHeight,\n      _ref2$className = _ref2.className,\n      className = _ref2$className === void 0 ? \"\" : _ref2$className,\n      props = _objectWithoutProperties(_ref2, [\"contentHeight\", \"className\"]);\n\n  return __jsx(\"div\", _extends({\n    className: \"relative overflow-y-auto  w-full \".concat(className)\n  }, props, {\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 34,\n      columnNumber: 5\n    }\n  }), __jsx(\"nav\", {\n    as: \"nav\",\n    className: \"text-sm px-6 pb-6 pt-1\",\n    style: {\n      height: contentHeight\n    },\n    \"aria-label\": \"Main navigation\",\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 35,\n      columnNumber: 7\n    }\n  }, __jsx(\"div\", {\n    className: \"mb-6\",\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 41,\n      columnNumber: 9\n    }\n  }, __jsx(Stack, {\n    spacing: 3,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 42,\n      columnNumber: 11\n    }\n  }, topNavLinks.map(function (link) {\n    return __jsx(TopNavLink, {\n      key: link,\n      href: stringToUrl(link),\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 44,\n        columnNumber: 15\n      }\n    }, link);\n  }))), __jsx(\"div\", {\n    className: \"mb-6\",\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 51,\n      columnNumber: 9\n    }\n  }, __jsx(NavGroupHeading, {\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 52,\n      columnNumber: 11\n    }\n  }, \"Components\"), Object.keys(components).map(function (heading) {\n    return __jsx(Stack, {\n      key: heading,\n      spacing: 3,\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 56,\n        columnNumber: 15\n      }\n    }, heading && __jsx(NavGroupHeading, {\n      className: \"mt-4 normal-case\",\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 58,\n        columnNumber: 19\n      }\n    }, heading), components[heading].map(function (link) {\n      return __jsx(ComponentLink, {\n        key: \"\".concat(heading, \"-\").concat(link),\n        href: stringToUrl(link),\n        __self: _this,\n        __source: {\n          fileName: _jsxFileName,\n          lineNumber: 63,\n          columnNumber: 19\n        }\n      }, link);\n    }));\n  }), __jsx(Stack, {\n    spacing: 2,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 73,\n      columnNumber: 11\n    }\n  }, __jsx(NavGroupHeading, {\n    className: \"mt-4 text-sm normal-case\",\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 74,\n      columnNumber: 13\n    }\n  }, \"Forms\"), __jsx(Stack, {\n    spacing: 3,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 77,\n      columnNumber: 13\n    }\n  }, __jsx(ComponentLink, {\n    href: \"/forms/form\",\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 78,\n      columnNumber: 15\n    }\n  }, \"Form\")))), __jsx(\"div\", {\n    className: \"mb-6\",\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 83,\n      columnNumber: 9\n    }\n  }, __jsx(Stack, {\n    spacing: 3,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 84,\n      columnNumber: 11\n    }\n  }, __jsx(NavGroupHeading, {\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 85,\n      columnNumber: 13\n    }\n  }, \"Utilities\"), utilsNavLinks.map(function (link) {\n    return __jsx(ComponentLink, {\n      key: link,\n      href: stringToUrl(link),\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 87,\n        columnNumber: 15\n      }\n    }, link);\n  }))), __jsx(\"div\", {\n    className: \"mb-6\",\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 94,\n      columnNumber: 9\n    }\n  }, __jsx(Stack, {\n    spacing: 3,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 95,\n      columnNumber: 11\n    }\n  }, __jsx(NavGroupHeading, {\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 96,\n      columnNumber: 13\n    }\n  }, \"Guides\"), guideNavLinks.map(function (link) {\n    return __jsx(ComponentLink, {\n      key: link,\n      href: stringToUrl(link),\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 98,\n        columnNumber: 15\n      }\n    }, link);\n  }))), __jsx(\"div\", {\n    className: \"mb-8\",\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 105,\n      columnNumber: 9\n    }\n  }, __jsx(Stack, {\n    spacing: 3,\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 106,\n      columnNumber: 11\n    }\n  }, __jsx(NavGroupHeading, {\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 107,\n      columnNumber: 13\n    }\n  }, \"Other\"), otherNavLinks.map(function (link) {\n    return __jsx(ComponentLink, {\n      key: link,\n      href: stringToUrl(link),\n      __self: _this,\n      __source: {\n        fileName: _jsxFileName,\n        lineNumber: 109,\n        columnNumber: 15\n      }\n    }, link);\n  })))));\n};\n_c2 = NavigationContent;\n\nvar SideNavContainer = function SideNavContainer(props) {\n  return __jsx(\"div\", _extends({\n    className: \"height-full\",\n    style: {\n      maxWidth: \"16rem\"\n    }\n  }, props, {\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 121,\n      columnNumber: 3\n    }\n  }));\n};\n\n_c3 = SideNavContainer;\n\nvar SideNav = function SideNav(props) {\n  return __jsx(SideNavContainer, {\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 126,\n      columnNumber: 5\n    }\n  }, __jsx(NavigationContent, _extends({}, props, {\n    __self: _this,\n    __source: {\n      fileName: _jsxFileName,\n      lineNumber: 127,\n      columnNumber: 7\n    }\n  })));\n};\n\n_c4 = SideNav;\nexport default SideNav;\n\nvar _c, _c2, _c3, _c4;\n\n$RefreshReg$(_c, \"NavGroupHeading\");\n$RefreshReg$(_c2, \"NavigationContent\");\n$RefreshReg$(_c3, \"SideNavContainer\");\n$RefreshReg$(_c4, \"SideNav\");","map":{"version":3,"sources":["/Users/silverdust/Projects/ConvertKit/convertkit-design/docs/components/navigation.js"],"names":["React","Stack","components","ComponentLink","stringToUrl","TopNavLink","topNavLinks","utilsNavLinks","otherNavLinks","guideNavLinks","NavGroupHeading","className","props","NavigationContent","contentHeight","height","map","link","Object","keys","heading","SideNavContainer","maxWidth","SideNav"],"mappings":"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","sourcesContent":["import React from \"react\";\nimport Stack from \"@convertkit/design/stack\";\nimport components from \"./components\";\nimport { ComponentLink, stringToUrl, TopNavLink } from \"./nav-link\";\n\nconst topNavLinks = [\"Getting Started\", \"Accessibility\", \"Styling\"];\n\nconst utilsNavLinks = [\"confirm\", \"useFetch\", \"useGet\", \"useToast\"];\n\nconst otherNavLinks = [\"FAQ\", \"Antipatterns\", \"Inspiration\"];\n\nconst guideNavLinks = [\n  \"Add a Page\",\n  \"Fetching Data\",\n  \"Responsive Design\",\n  \"Setting Default Props\",\n  \"Button vs Link\",\n  \"Tooltip Usage\",\n];\n\nconst NavGroupHeading = ({ className = \"\", ...props }) => (\n  <h2\n    className={`text-base tracking-wide font-semibold ${className}`}\n    {...props}\n  />\n);\n\nexport const NavigationContent = ({\n  contentHeight = \"calc(100vh - 4rem)\",\n  className = \"\",\n  ...props\n}) => {\n  return (\n    <div className={`relative overflow-y-auto  w-full ${className}`} {...props}>\n      <nav\n        as=\"nav\"\n        className=\"text-sm px-6 pb-6 pt-1\"\n        style={{ height: contentHeight }}\n        aria-label=\"Main navigation\"\n      >\n        <div className=\"mb-6\">\n          <Stack spacing={3}>\n            {topNavLinks.map((link) => (\n              <TopNavLink key={link} href={stringToUrl(link)}>\n                {link}\n              </TopNavLink>\n            ))}\n          </Stack>\n        </div>\n\n        <div className=\"mb-6\">\n          <NavGroupHeading>Components</NavGroupHeading>\n\n          {Object.keys(components).map((heading) => {\n            return (\n              <Stack key={heading} spacing={3}>\n                {heading && (\n                  <NavGroupHeading className=\"mt-4 normal-case\">\n                    {heading}\n                  </NavGroupHeading>\n                )}\n                {components[heading].map((link) => (\n                  <ComponentLink\n                    key={`${heading}-${link}`}\n                    href={stringToUrl(link)}\n                  >\n                    {link}\n                  </ComponentLink>\n                ))}\n              </Stack>\n            );\n          })}\n          <Stack spacing={2}>\n            <NavGroupHeading className=\"mt-4 text-sm normal-case\">\n              Forms\n            </NavGroupHeading>\n            <Stack spacing={3}>\n              <ComponentLink href=\"/forms/form\">Form</ComponentLink>\n            </Stack>\n          </Stack>\n        </div>\n\n        <div className=\"mb-6\">\n          <Stack spacing={3}>\n            <NavGroupHeading>Utilities</NavGroupHeading>\n            {utilsNavLinks.map((link) => (\n              <ComponentLink key={link} href={stringToUrl(link)}>\n                {link}\n              </ComponentLink>\n            ))}\n          </Stack>\n        </div>\n\n        <div className=\"mb-6\">\n          <Stack spacing={3}>\n            <NavGroupHeading>Guides</NavGroupHeading>\n            {guideNavLinks.map((link) => (\n              <ComponentLink key={link} href={stringToUrl(link)}>\n                {link}\n              </ComponentLink>\n            ))}\n          </Stack>\n        </div>\n\n        <div className=\"mb-8\">\n          <Stack spacing={3}>\n            <NavGroupHeading>Other</NavGroupHeading>\n            {otherNavLinks.map((link) => (\n              <ComponentLink key={link} href={stringToUrl(link)}>\n                {link}\n              </ComponentLink>\n            ))}\n          </Stack>\n        </div>\n      </nav>\n    </div>\n  );\n};\n\nconst SideNavContainer = (props) => (\n  <div className=\"height-full\" style={{ maxWidth: \"16rem\" }} {...props} />\n);\n\nconst SideNav = (props) => {\n  return (\n    <SideNavContainer>\n      <NavigationContent {...props} />\n    </SideNavContainer>\n  );\n};\n\nexport default SideNav;\n"]},"metadata":{},"sourceType":"module"}