npm - @orangesk/orange-design-system - Versions diffs - 2.0.0-alpha.1 → 2.0.0-alpha.2 - Mend

@orangesk/orange-design-system 2.0.0-alpha.1 → 2.0.0-alpha.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (1122) hide show

package/build/components/divider.html ADDED Viewed

@@ -0,0 +1,6 @@
+<!DOCTYPE html><html lang="en" class="__className_df92c2"><head><meta charSet="utf-8"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="preload" href="/_next/static/media/671791babd225be4-s.p.woff2" as="font" crossorigin="" type="font/woff2"/><link rel="preload" href="/_next/static/media/c62d990acddde5f0-s.p.woff2" as="font" crossorigin="" type="font/woff2"/><link rel="preload" href="/_next/static/media/dfdbb1c4973e0bd7-s.p.woff2" as="font" crossorigin="" type="font/woff2"/><link rel="stylesheet" href="/_next/static/css/2cb6b1436172662a.css" data-precedence="next"/><link rel="stylesheet" href="/_next/static/css/ee49dfd49ae395ac.css" data-precedence="next"/><link rel="stylesheet" href="/_next/static/css/7f570791ca140154.css" data-precedence="next"/><link rel="stylesheet" href="/_next/static/css/ac1d2e9b77b16926.css" data-precedence="next"/><link rel="stylesheet" href="/_next/static/css/0e5de495ff48931f.css" data-precedence="next"/><link rel="stylesheet" href="/_next/static/css/57b0c84bbf7d7098.css" data-precedence="next"/><link rel="preload" as="script" fetchPriority="low" href="/_next/static/chunks/webpack-1a128887cf981885.js"/><script src="/_next/static/chunks/4bd1b696-63246a30a5dafad8.js" async=""></script><script src="/_next/static/chunks/1684-f3cca2440b2d04c9.js" async=""></script><script src="/_next/static/chunks/main-app-a265e200b32683f1.js" async=""></script><script src="/_next/static/chunks/app/layout-41aa6f28da614a69.js" async=""></script><script src="/_next/static/chunks/app/components/divider/page-048e0ea7f0f61c9f.js" async=""></script><meta name="next-size-adjust" content=""/><script>document.querySelectorAll('body link[rel="icon"], body link[rel="apple-touch-icon"]').forEach(el => document.head.appendChild(el))</script><script src="/_next/static/chunks/polyfills-42372ed130431b0a.js" noModule=""></script></head><body><div hidden=""><!--$--><!--/$--></div><div id="root"><div class="section"><div class="container"><h1>Divider</h1><p>Divider serves as an option for horizontal division of spaces/elements/contents.</p><h2>Example</h2><div class="divider"><div class="divider__line"></div></div><h2>Width</h2><p>Width of the divider line can be reduced to 1 pixel using <code>.divider__line--thin</code> class.</p><div class="divider"><div class="divider__line"></div></div><div class="divider"><div class="divider__line divider__line--thin"></div></div><h2>Content</h2><p>Divider can hold different contents if you need to visualise separation with
+something like a word or icon, you can do it here.</p><div class="divider"><div class="divider__line"></div></div><div class="divider"><div class="divider__line"></div><div class="divider__content"><svg class="icon icon--medium" aria-hidden="true"><use xlink:href="/sprite.svg#add"></use></svg></div><div class="divider__line"></div></div><div class="divider"><div class="divider__line"></div><div class="divider__content"><strong>custom text</strong></div><div class="divider__line"></div></div><h2>Color</h2><p>If you need to use divider on <strong>non-white backgrounds</strong> use
+<code>.divider--black</code> or <code>.divider--white</code> class</p><p>Default color is gray and it&#x27;s used on white backgrounds only</p><div class="divider"><div class="divider__line"></div></div><div class="divider"><div class="divider__line"></div><div class="divider__content"><svg class="icon icon--medium" aria-hidden="true"><use xlink:href="/sprite.svg#add"></use></svg></div><div class="divider__line"></div></div><div class="divider"><div class="divider__line"></div><div class="divider__content"><strong>custom text</strong></div><div class="divider__line"></div></div><div class="bg-black"><div class="divider divider--white"><div class="divider__line"></div></div><div class="divider divider--white"><div class="divider__line"></div><div class="divider__content"><svg class="icon icon--medium" aria-hidden="true"><use xlink:href="/sprite.svg#add"></use></svg></div><div class="divider__line"></div></div><div class="divider divider--white"><div class="divider__line"></div><div class="divider__content"><strong>custom text</strong></div><div class="divider__line"></div></div></div><div class="divider divider--black"><div class="divider__line"></div></div><div class="divider divider--black"><div class="divider__line"></div><div class="divider__content"><svg class="icon icon--medium" aria-hidden="true"><use xlink:href="/sprite.svg#add"></use></svg></div><div class="divider__line"></div></div><div class="divider divider--black"><div class="divider__line"></div><div class="divider__content"><strong>custom text</strong></div><div class="divider__line"></div></div></div></div>
+<div class="section bg-black"><div class="container"><h1>Divider</h1><p>Divider serves as an option for horizontal division of spaces/elements/contents.</p><h2>Example</h2><div class="divider"><div class="divider__line"></div></div><h2>Width</h2><p>Width of the divider line can be reduced to 1 pixel using <code>.divider__line--thin</code> class.</p><div class="divider"><div class="divider__line"></div></div><div class="divider"><div class="divider__line divider__line--thin"></div></div><h2>Content</h2><p>Divider can hold different contents if you need to visualise separation with
+something like a word or icon, you can do it here.</p><div class="divider"><div class="divider__line"></div></div><div class="divider"><div class="divider__line"></div><div class="divider__content"><svg class="icon icon--medium" aria-hidden="true"><use xlink:href="/sprite.svg#add"></use></svg></div><div class="divider__line"></div></div><div class="divider"><div class="divider__line"></div><div class="divider__content"><strong>custom text</strong></div><div class="divider__line"></div></div><h2>Color</h2><p>If you need to use divider on <strong>non-white backgrounds</strong> use
+<code>.divider--black</code> or <code>.divider--white</code> class</p><p>Default color is gray and it&#x27;s used on white backgrounds only</p><div class="divider"><div class="divider__line"></div></div><div class="divider"><div class="divider__line"></div><div class="divider__content"><svg class="icon icon--medium" aria-hidden="true"><use xlink:href="/sprite.svg#add"></use></svg></div><div class="divider__line"></div></div><div class="divider"><div class="divider__line"></div><div class="divider__content"><strong>custom text</strong></div><div class="divider__line"></div></div><div class="bg-black"><div class="divider divider--white"><div class="divider__line"></div></div><div class="divider divider--white"><div class="divider__line"></div><div class="divider__content"><svg class="icon icon--medium" aria-hidden="true"><use xlink:href="/sprite.svg#add"></use></svg></div><div class="divider__line"></div></div><div class="divider divider--white"><div class="divider__line"></div><div class="divider__content"><strong>custom text</strong></div><div class="divider__line"></div></div></div><div class="divider divider--black"><div class="divider__line"></div></div><div class="divider divider--black"><div class="divider__line"></div><div class="divider__content"><svg class="icon icon--medium" aria-hidden="true"><use xlink:href="/sprite.svg#add"></use></svg></div><div class="divider__line"></div></div><div class="divider divider--black"><div class="divider__line"></div><div class="divider__content"><strong>custom text</strong></div><div class="divider__line"></div></div></div></div><!--$--><!--/$--></div><div id="root-modals"></div><div id="root-dropdowns"></div><div id="root-tooltips"></div><script src="/_next/static/chunks/webpack-1a128887cf981885.js" async=""></script><script>(self.__next_f=self.__next_f||[]).push([0])</script><script>self.__next_f.push([1,"1:\"$Sreact.fragment\"\n2:I[3640,[\"7177\",\"static/chunks/app/layout-41aa6f28da614a69.js\"],\"default\"]\n3:I[5085,[\"8533\",\"static/chunks/app/components/divider/page-048e0ea7f0f61c9f.js\"],\"SpritePathProvider\"]\n4:I[7555,[],\"\"]\n5:I[1295,[],\"\"]\n6:I[593,[\"8533\",\"static/chunks/app/components/divider/page-048e0ea7f0f61c9f.js\"],\"Icon\"]\n7:I[9665,[],\"OutletBoundary\"]\na:I[4911,[],\"AsyncMetadataOutlet\"]\nc:I[9665,[],\"ViewportBoundary\"]\ne:I[9665,[],\"MetadataBoundary\"]\n10:I[6614,[],\"\"]\n:HL[\"/_next/static/media/671791babd225be4-s.p.woff2\",\"font\",{\"crossOrigin\":\"\",\"type\":\"font/woff2\"}]\n:HL[\"/_next/static/media/c62d990acddde5f0-s.p.woff2\",\"font\",{\"crossOrigin\":\"\",\"type\":\"font/woff2\"}]\n:HL[\"/_next/static/media/dfdbb1c4973e0bd7-s.p.woff2\",\"font\",{\"crossOrigin\":\"\",\"type\":\"font/woff2\"}]\n:HL[\"/_next/static/css/2cb6b1436172662a.css\",\"style\"]\n:HL[\"/_next/static/css/ee49dfd49ae395ac.css\",\"style\"]\n:HL[\"/_next/static/css/7f570791ca140154.css\",\"style\"]\n:HL[\"/_next/static/css/ac1d2e9b77b16926.css\",\"style\"]\n:HL[\"/_next/static/css/0e5de495ff48931f.css\",\"style\"]\n:HL[\"/_next/static/css/57b0c84bbf7d7098.css\",\"style\"]\n"])</script><script>self.__next_f.push([1,"0:{\"P\":null,\"b\":\"BGy4QLZfZPwswIZT7YGE2\",\"p\":\"\",\"c\":[\"\",\"components\",\"divider\"],\"i\":false,\"f\":[[[\"\",{\"children\":[\"components\",{\"children\":[\"divider\",{\"children\":[\"__PAGE__\",{}]}]}]},\"$undefined\",\"$undefined\",true],[\"\",[\"$\",\"$1\",\"c\",{\"children\":[[[\"$\",\"link\",\"0\",{\"rel\":\"stylesheet\",\"href\":\"/_next/static/css/2cb6b1436172662a.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\",\"nonce\":\"$undefined\"}],[\"$\",\"link\",\"1\",{\"rel\":\"stylesheet\",\"href\":\"/_next/static/css/ee49dfd49ae395ac.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\",\"nonce\":\"$undefined\"}]],[\"$\",\"html\",null,{\"lang\":\"en\",\"className\":\"__className_df92c2\",\"children\":[\"$\",\"body\",null,{\"children\":[[\"$\",\"$L2\",null,{}],[\"$\",\"div\",null,{\"id\":\"root\",\"children\":[\"$\",\"$L3\",null,{\"children\":[\"$\",\"$L4\",null,{\"parallelRouterKey\":\"children\",\"error\":\"$undefined\",\"errorStyles\":\"$undefined\",\"errorScripts\":\"$undefined\",\"template\":[\"$\",\"$L5\",null,{}],\"templateStyles\":\"$undefined\",\"templateScripts\":\"$undefined\",\"notFound\":[[[\"$\",\"title\",null,{\"children\":\"404: This page could not be found.\"}],[\"$\",\"div\",null,{\"style\":{\"fontFamily\":\"system-ui,\\\"Segoe UI\\\",Roboto,Helvetica,Arial,sans-serif,\\\"Apple Color Emoji\\\",\\\"Segoe UI Emoji\\\"\",\"height\":\"100vh\",\"textAlign\":\"center\",\"display\":\"flex\",\"flexDirection\":\"column\",\"alignItems\":\"center\",\"justifyContent\":\"center\"},\"children\":[\"$\",\"div\",null,{\"children\":[[\"$\",\"style\",null,{\"dangerouslySetInnerHTML\":{\"__html\":\"body{color:#000;background:#fff;margin:0}.next-error-h1{border-right:1px solid rgba(0,0,0,.3)}@media (prefers-color-scheme:dark){body{color:#fff;background:#000}.next-error-h1{border-right:1px solid rgba(255,255,255,.3)}}\"}}],[\"$\",\"h1\",null,{\"className\":\"next-error-h1\",\"style\":{\"display\":\"inline-block\",\"margin\":\"0 20px 0 0\",\"padding\":\"0 23px 0 0\",\"fontSize\":24,\"fontWeight\":500,\"verticalAlign\":\"top\",\"lineHeight\":\"49px\"},\"children\":404}],[\"$\",\"div\",null,{\"style\":{\"display\":\"inline-block\"},\"children\":[\"$\",\"h2\",null,{\"style\":{\"fontSize\":14,\"fontWeight\":400,\"lineHeight\":\"49px\",\"margin\":0},\"children\":\"This page could not be found.\"}]}]]}]}]],[]],\"forbidden\":\"$undefined\",\"unauthorized\":\"$undefined\"}]}]}],[\"$\",\"div\",null,{\"id\":\"root-modals\"}],[\"$\",\"div\",null,{\"id\":\"root-dropdowns\"}],[\"$\",\"div\",null,{\"id\":\"root-tooltips\"}]]}]}]]}],{\"children\":[\"components\",[\"$\",\"$1\",\"c\",{\"children\":[null,[\"$\",\"$L4\",null,{\"parallelRouterKey\":\"children\",\"error\":\"$undefined\",\"errorStyles\":\"$undefined\",\"errorScripts\":\"$undefined\",\"template\":[\"$\",\"$L5\",null,{}],\"templateStyles\":\"$undefined\",\"templateScripts\":\"$undefined\",\"notFound\":\"$undefined\",\"forbidden\":\"$undefined\",\"unauthorized\":\"$undefined\"}]]}],{\"children\":[\"divider\",[\"$\",\"$1\",\"c\",{\"children\":[null,[\"$\",\"$L4\",null,{\"parallelRouterKey\":\"children\",\"error\":\"$undefined\",\"errorStyles\":\"$undefined\",\"errorScripts\":\"$undefined\",\"template\":[\"$\",\"$L5\",null,{}],\"templateStyles\":\"$undefined\",\"templateScripts\":\"$undefined\",\"notFound\":\"$undefined\",\"forbidden\":\"$undefined\",\"unauthorized\":\"$undefined\"}]]}],{\"children\":[\"__PAGE__\",[\"$\",\"$1\",\"c\",{\"children\":[[[\"$\",\"div\",null,{\"className\":\"section\",\"children\":[\"$\",\"div\",null,{\"className\":\"container\",\"ref\":\"$undefined\",\"children\":[[\"$\",\"h1\",null,{\"children\":\"Divider\"}],[\"$\",\"p\",null,{\"children\":\"Divider serves as an option for horizontal division of spaces/elements/contents.\"}],[\"$\",\"h2\",null,{\"children\":\"Example\"}],[\"$\",\"div\",null,{\"className\":\"divider\",\"children\":[[\"$\",\"div\",null,{\"className\":\"divider__line\"}],\"$undefined\"]}],[\"$\",\"h2\",null,{\"children\":\"Width\"}],[\"$\",\"p\",null,{\"children\":[\"Width of the divider line can be reduced to 1 pixel using \",[\"$\",\"code\",null,{\"children\":\".divider__line--thin\"}],\" class.\"]}],[\"$\",\"div\",null,{\"className\":\"divider\",\"children\":[[\"$\",\"div\",null,{\"className\":\"divider__line\"}],\"$undefined\"]}],[\"$\",\"div\",null,{\"className\":\"divider\",\"children\":[[\"$\",\"div\",null,{\"className\":\"divider__line divider__line--thin\"}],\"$undefined\"]}],[\"$\",\"h2\",null,{\"children\":\"Content\"}],[\"$\",\"p\",null,{\"children\":\"Divider can hold different contents if you need to visualise separation with\\nsomething like a word or icon, you can do it here.\"}],[\"$\",\"div\",null,{\"className\":\"divider\",\"children\":[[\"$\",\"div\",null,{\"className\":\"divider__line\"}],\"$undefined\"]}],[\"$\",\"div\",null,{\"className\":\"divider\",\"children\":[[\"$\",\"div\",null,{\"className\":\"divider__line\"}],[[\"$\",\"div\",null,{\"className\":\"divider__content\",\"children\":[\"$\",\"$L6\",null,{\"name\":\"add\",\"size\":\"medium\"}]}],[\"$\",\"div\",null,{\"className\":\"divider__line\"}]]]}],[\"$\",\"div\",null,{\"className\":\"divider\",\"children\":[[\"$\",\"div\",null,{\"className\":\"divider__line\"}],[[\"$\",\"div\",null,{\"className\":\"divider__content\",\"children\":[\"$\",\"strong\",null,{\"children\":\"custom text\"}]}],[\"$\",\"div\",null,{\"className\":\"divider__line\"}]]]}],[\"$\",\"h2\",null,{\"children\":\"Color\"}],[\"$\",\"p\",null,{\"children\":[\"If you need to use divider on \",[\"$\",\"strong\",null,{\"children\":\"non-white backgrounds\"}],\" use\\n\",[\"$\",\"code\",null,{\"children\":\".divider--black\"}],\" or \",[\"$\",\"code\",null,{\"children\":\".divider--white\"}],\" class\"]}],[\"$\",\"p\",null,{\"children\":\"Default color is gray and it's used on white backgrounds only\"}],[\"$\",\"div\",null,{\"className\":\"divider\",\"children\":[[\"$\",\"div\",null,{\"className\":\"divider__line\"}],\"$undefined\"]}],[\"$\",\"div\",null,{\"className\":\"divider\",\"children\":[[\"$\",\"div\",null,{\"className\":\"divider__line\"}],[[\"$\",\"div\",null,{\"className\":\"divider__content\",\"children\":[\"$\",\"$L6\",null,{\"name\":\"add\",\"size\":\"medium\"}]}],[\"$\",\"div\",null,{\"className\":\"divider__line\"}]]]}],[\"$\",\"div\",null,{\"className\":\"divider\",\"children\":[[\"$\",\"div\",null,{\"className\":\"divider__line\"}],[[\"$\",\"div\",null,{\"className\":\"divider__content\",\"children\":[\"$\",\"strong\",null,{\"children\":\"custom text\"}]}],[\"$\",\"div\",null,{\"className\":\"divider__line\"}]]]}],[\"$\",\"div\",null,{\"className\":\"bg-black\",\"children\":[[\"$\",\"div\",null,{\"className\":\"divider divider--white\",\"children\":[[\"$\",\"div\",null,{\"className\":\"divider__line\"}],\"$undefined\"]}],[\"$\",\"div\",null,{\"className\":\"divider divider--white\",\"children\":[[\"$\",\"div\",null,{\"className\":\"divider__line\"}],[[\"$\",\"div\",null,{\"className\":\"divider__content\",\"children\":[\"$\",\"$L6\",null,{\"name\":\"add\",\"size\":\"medium\"}]}],[\"$\",\"div\",null,{\"className\":\"divider__line\"}]]]}],[\"$\",\"div\",null,{\"className\":\"divider divider--white\",\"children\":[[\"$\",\"div\",null,{\"className\":\"divider__line\"}],[[\"$\",\"div\",null,{\"className\":\"divider__content\",\"children\":[\"$\",\"strong\",null,{\"children\":\"custom text\"}]}],[\"$\",\"div\",null,{\"className\":\"divider__line\"}]]]}]]}],[\"$\",\"div\",null,{\"className\":\"divider divider--black\",\"children\":[[\"$\",\"div\",null,{\"className\":\"divider__line\"}],\"$undefined\"]}],[\"$\",\"div\",null,{\"className\":\"divider divider--black\",\"children\":[[\"$\",\"div\",null,{\"className\":\"divider__line\"}],[[\"$\",\"div\",null,{\"className\":\"divider__content\",\"children\":[\"$\",\"$L6\",null,{\"name\":\"add\",\"size\":\"medium\"}]}],[\"$\",\"div\",null,{\"className\":\"divider__line\"}]]]}],[\"$\",\"div\",null,{\"className\":\"divider divider--black\",\"children\":[[\"$\",\"div\",null,{\"className\":\"divider__line\"}],[[\"$\",\"div\",null,{\"className\":\"divider__content\",\"children\":[\"$\",\"strong\",null,{\"children\":\"custom text\"}]}],[\"$\",\"div\",null,{\"className\":\"divider__line\"}]]]}]]}]}],\"\\n\",[\"$\",\"div\",null,{\"className\":\"section bg-black\",\"children\":[\"$\",\"div\",null,{\"className\":\"container\",\"ref\":\"$undefined\",\"children\":[[\"$\",\"h1\",null,{\"children\":\"Divider\"}],[\"$\",\"p\",null,{\"children\":\"Divider serves as an option for horizontal division of spaces/elements/contents.\"}],[\"$\",\"h2\",null,{\"children\":\"Example\"}],[\"$\",\"div\",null,{\"className\":\"divider\",\"children\":[[\"$\",\"div\",null,{\"className\":\"divider__line\"}],\"$undefined\"]}],[\"$\",\"h2\",null,{\"children\":\"Width\"}],[\"$\",\"p\",null,{\"children\":[\"Width of the divider line can be reduced to 1 pixel using \",[\"$\",\"code\",null,{\"children\":\".divider__line--thin\"}],\" class.\"]}],[\"$\",\"div\",null,{\"className\":\"divider\",\"children\":[[\"$\",\"div\",null,{\"className\":\"divider__line\"}],\"$undefined\"]}],[\"$\",\"div\",null,{\"className\":\"divider\",\"children\":[[\"$\",\"div\",null,{\"className\":\"divider__line divider__line--thin\"}],\"$undefined\"]}],[\"$\",\"h2\",null,{\"children\":\"Content\"}],[\"$\",\"p\",null,{\"children\":\"Divider can hold different contents if you need to visualise separation with\\nsomething like a word or icon, you can do it here.\"}],[\"$\",\"div\",null,{\"className\":\"divider\",\"children\":[[\"$\",\"div\",null,{\"className\":\"divider__line\"}],\"$undefined\"]}],[\"$\",\"div\",null,{\"className\":\"divider\",\"children\":[[\"$\",\"div\",null,{\"className\":\"divider__line\"}],[[\"$\",\"div\",null,{\"className\":\"divider__content\",\"children\":[\"$\",\"$L6\",null,{\"name\":\"add\",\"size\":\"medium\"}]}],[\"$\",\"div\",null,{\"className\":\"divider__line\"}]]]}],[\"$\",\"div\",null,{\"className\":\"divider\",\"children\":[[\"$\",\"div\",null,{\"className\":\"divider__line\"}],[[\"$\",\"div\",null,{\"className\":\"divider__content\",\"children\":[\"$\",\"strong\",null,{\"children\":\"custom text\"}]}],[\"$\",\"div\",null,{\"className\":\"divider__line\"}]]]}],[\"$\",\"h2\",null,{\"children\":\"Color\"}],[\"$\",\"p\",null,{\"children\":[\"If you need to use divider on \",[\"$\",\"strong\",null,{\"children\":\"non-white backgrounds\"}],\" use\\n\",[\"$\",\"code\",null,{\"children\":\".divider--black\"}],\" or \",[\"$\",\"code\",null,{\"children\":\".divider--white\"}],\" class\"]}],[\"$\",\"p\",null,{\"children\":\"Default color is gray and it's used on white backgrounds only\"}],[\"$\",\"div\",null,{\"className\":\"divider\",\"children\":[[\"$\",\"div\",null,{\"className\":\"divider__line\"}],\"$undefined\"]}],[\"$\",\"div\",null,{\"className\":\"divider\",\"children\":[[\"$\",\"div\",null,{\"className\":\"divider__line\"}],[[\"$\",\"div\",null,{\"className\":\"divider__content\",\"children\":[\"$\",\"$L6\",null,{\"name\":\"add\",\"size\":\"medium\"}]}],[\"$\",\"div\",null,{\"className\":\"divider__line\"}]]]}],[\"$\",\"div\",null,{\"className\":\"divider\",\"children\":[[\"$\",\"div\",null,{\"className\":\"divider__line\"}],[[\"$\",\"div\",null,{\"className\":\"divider__content\",\"children\":[\"$\",\"strong\",null,{\"children\":\"custom text\"}]}],[\"$\",\"div\",null,{\"className\":\"divider__line\"}]]]}],[\"$\",\"div\",null,{\"className\":\"bg-black\",\"children\":[[\"$\",\"div\",null,{\"className\":\"divider divider--white\",\"children\":[[\"$\",\"div\",null,{\"className\":\"divider__line\"}],\"$undefined\"]}],[\"$\",\"div\",null,{\"className\":\"divider divider--white\",\"children\":[[\"$\",\"div\",null,{\"className\":\"divider__line\"}],[[\"$\",\"div\",null,{\"className\":\"divider__content\",\"children\":[\"$\",\"$L6\",null,{\"name\":\"add\",\"size\":\"medium\"}]}],[\"$\",\"div\",null,{\"className\":\"divider__line\"}]]]}],[\"$\",\"div\",null,{\"className\":\"divider divider--white\",\"children\":[[\"$\",\"div\",null,{\"className\":\"divider__line\"}],[[\"$\",\"div\",null,{\"className\":\"divider__content\",\"children\":[\"$\",\"strong\",null,{\"children\":\"custom text\"}]}],[\"$\",\"div\",null,{\"className\":\"divider__line\"}]]]}]]}],[\"$\",\"div\",null,{\"className\":\"divider divider--black\",\"children\":[[\"$\",\"div\",null,{\"className\":\"divider__line\"}],\"$undefined\"]}],[\"$\",\"div\",null,{\"className\":\"divider divider--black\",\"children\":[[\"$\",\"div\",null,{\"className\":\"divider__line\"}],[[\"$\",\"div\",null,{\"className\":\"divider__content\",\"children\":[\"$\",\"$L6\",null,{\"name\":\"add\",\"size\":\"medium\"}]}],[\"$\",\"div\",null,{\"className\":\"divider__line\"}]]]}],[\"$\",\"div\",null,{\"className\":\"divider divider--black\",\"children\":[[\"$\",\"div\",null,{\"className\":\"divider__line\"}],[[\"$\",\"div\",null,{\"className\":\"divider__content\",\"children\":[\"$\",\"strong\",null,{\"children\":\"custom text\"}]}],[\"$\",\"div\",null,{\"className\":\"divider__line\"}]]]}]]}]}]],[[\"$\",\"link\",\"0\",{\"rel\":\"stylesheet\",\"href\":\"/_next/static/css/7f570791ca140154.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\",\"nonce\":\"$undefined\"}],[\"$\",\"link\",\"1\",{\"rel\":\"stylesheet\",\"href\":\"/_next/static/css/ac1d2e9b77b16926.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\",\"nonce\":\"$undefined\"}],[\"$\",\"link\",\"2\",{\"rel\":\"stylesheet\",\"href\":\"/_next/static/css/0e5de495ff48931f.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\",\"nonce\":\"$undefined\"}],[\"$\",\"link\",\"3\",{\"rel\":\"stylesheet\",\"href\":\"/_next/static/css/57b0c84bbf7d7098.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\",\"nonce\":\"$undefined\"}]],[\"$\",\"$L7\",null,{\"children\":[\"$L8\",\"$L9\",[\"$\",\"$La\",null,{\"promise\":\"$@b\"}]]}]]}],{},null,false]},null,false]},null,false]},null,false],[\"$\",\"$1\",\"h\",{\"children\":[null,[\"$\",\"$1\",\"eEbg2Itnp7vONveWgyF9Dv\",{\"children\":[[\"$\",\"$Lc\",null,{\"children\":\"$Ld\"}],[\"$\",\"meta\",null,{\"name\":\"next-size-adjust\",\"content\":\"\"}]]}],[\"$\",\"$Le\",null,{\"children\":\"$Lf\"}]]}],false]],\"m\":\"$undefined\",\"G\":[\"$10\",\"$undefined\"],\"s\":false,\"S\":true}\n"])</script><script>self.__next_f.push([1,"11:\"$Sreact.suspense\"\n12:I[4911,[],\"AsyncMetadata\"]\nf:[\"$\",\"div\",null,{\"hidden\":true,\"children\":[\"$\",\"$11\",null,{\"fallback\":null,\"children\":[\"$\",\"$L12\",null,{\"promise\":\"$@13\"}]}]}]\n9:null\n"])</script><script>self.__next_f.push([1,"d:[[\"$\",\"meta\",\"0\",{\"charSet\":\"utf-8\"}],[\"$\",\"meta\",\"1\",{\"name\":\"viewport\",\"content\":\"width=device-width, initial-scale=1\"}]]\n8:null\n"])</script><script>self.__next_f.push([1,"b:{\"metadata\":[],\"error\":null,\"digest\":\"$undefined\"}\n13:{\"metadata\":\"$b:metadata\",\"error\":null,\"digest\":\"$undefined\"}\n"])</script></body></html>

package/build/components/divider.txt ADDED Viewed

@@ -0,0 +1,29 @@
+1:"$Sreact.fragment"
+2:I[3640,["7177","static/chunks/app/layout-41aa6f28da614a69.js"],"default"]
+3:I[5085,["8533","static/chunks/app/components/divider/page-048e0ea7f0f61c9f.js"],"SpritePathProvider"]
+4:I[7555,[],""]
+5:I[1295,[],""]
+6:I[593,["8533","static/chunks/app/components/divider/page-048e0ea7f0f61c9f.js"],"Icon"]
+7:I[9665,[],"OutletBoundary"]
+a:I[4911,[],"AsyncMetadataOutlet"]
+c:I[9665,[],"ViewportBoundary"]
+e:I[9665,[],"MetadataBoundary"]
+10:I[6614,[],""]
+:HL["/_next/static/media/671791babd225be4-s.p.woff2","font",{"crossOrigin":"","type":"font/woff2"}]
+:HL["/_next/static/media/c62d990acddde5f0-s.p.woff2","font",{"crossOrigin":"","type":"font/woff2"}]
+:HL["/_next/static/media/dfdbb1c4973e0bd7-s.p.woff2","font",{"crossOrigin":"","type":"font/woff2"}]
+:HL["/_next/static/css/2cb6b1436172662a.css","style"]
+:HL["/_next/static/css/ee49dfd49ae395ac.css","style"]
+:HL["/_next/static/css/7f570791ca140154.css","style"]
+:HL["/_next/static/css/ac1d2e9b77b16926.css","style"]
+:HL["/_next/static/css/0e5de495ff48931f.css","style"]
+:HL["/_next/static/css/57b0c84bbf7d7098.css","style"]
+0:{"P":null,"b":"BGy4QLZfZPwswIZT7YGE2","p":"","c":["","components","divider"],"i":false,"f":[[["",{"children":["components",{"children":["divider",{"children":["__PAGE__",{}]}]}]},"$undefined","$undefined",true],["",["$","$1","c",{"children":[[["$","link","0",{"rel":"stylesheet","href":"/_next/static/css/2cb6b1436172662a.css","precedence":"next","crossOrigin":"$undefined","nonce":"$undefined"}],["$","link","1",{"rel":"stylesheet","href":"/_next/static/css/ee49dfd49ae395ac.css","precedence":"next","crossOrigin":"$undefined","nonce":"$undefined"}]],["$","html",null,{"lang":"en","className":"__className_df92c2","children":["$","body",null,{"children":[["$","$L2",null,{}],["$","div",null,{"id":"root","children":["$","$L3",null,{"children":["$","$L4",null,{"parallelRouterKey":"children","error":"$undefined","errorStyles":"$undefined","errorScripts":"$undefined","template":["$","$L5",null,{}],"templateStyles":"$undefined","templateScripts":"$undefined","notFound":[[["$","title",null,{"children":"404: This page could not be found."}],["$","div",null,{"style":{"fontFamily":"system-ui,\"Segoe UI\",Roboto,Helvetica,Arial,sans-serif,\"Apple Color Emoji\",\"Segoe UI Emoji\"","height":"100vh","textAlign":"center","display":"flex","flexDirection":"column","alignItems":"center","justifyContent":"center"},"children":["$","div",null,{"children":[["$","style",null,{"dangerouslySetInnerHTML":{"__html":"body{color:#000;background:#fff;margin:0}.next-error-h1{border-right:1px solid rgba(0,0,0,.3)}@media (prefers-color-scheme:dark){body{color:#fff;background:#000}.next-error-h1{border-right:1px solid rgba(255,255,255,.3)}}"}}],["$","h1",null,{"className":"next-error-h1","style":{"display":"inline-block","margin":"0 20px 0 0","padding":"0 23px 0 0","fontSize":24,"fontWeight":500,"verticalAlign":"top","lineHeight":"49px"},"children":404}],["$","div",null,{"style":{"display":"inline-block"},"children":["$","h2",null,{"style":{"fontSize":14,"fontWeight":400,"lineHeight":"49px","margin":0},"children":"This page could not be found."}]}]]}]}]],[]],"forbidden":"$undefined","unauthorized":"$undefined"}]}]}],["$","div",null,{"id":"root-modals"}],["$","div",null,{"id":"root-dropdowns"}],["$","div",null,{"id":"root-tooltips"}]]}]}]]}],{"children":["components",["$","$1","c",{"children":[null,["$","$L4",null,{"parallelRouterKey":"children","error":"$undefined","errorStyles":"$undefined","errorScripts":"$undefined","template":["$","$L5",null,{}],"templateStyles":"$undefined","templateScripts":"$undefined","notFound":"$undefined","forbidden":"$undefined","unauthorized":"$undefined"}]]}],{"children":["divider",["$","$1","c",{"children":[null,["$","$L4",null,{"parallelRouterKey":"children","error":"$undefined","errorStyles":"$undefined","errorScripts":"$undefined","template":["$","$L5",null,{}],"templateStyles":"$undefined","templateScripts":"$undefined","notFound":"$undefined","forbidden":"$undefined","unauthorized":"$undefined"}]]}],{"children":["__PAGE__",["$","$1","c",{"children":[[["$","div",null,{"className":"section","children":["$","div",null,{"className":"container","ref":"$undefined","children":[["$","h1",null,{"children":"Divider"}],["$","p",null,{"children":"Divider serves as an option for horizontal division of spaces/elements/contents."}],["$","h2",null,{"children":"Example"}],["$","div",null,{"className":"divider","children":[["$","div",null,{"className":"divider__line"}],"$undefined"]}],["$","h2",null,{"children":"Width"}],["$","p",null,{"children":["Width of the divider line can be reduced to 1 pixel using ",["$","code",null,{"children":".divider__line--thin"}]," class."]}],["$","div",null,{"className":"divider","children":[["$","div",null,{"className":"divider__line"}],"$undefined"]}],["$","div",null,{"className":"divider","children":[["$","div",null,{"className":"divider__line divider__line--thin"}],"$undefined"]}],["$","h2",null,{"children":"Content"}],["$","p",null,{"children":"Divider can hold different contents if you need to visualise separation with\nsomething like a word or icon, you can do it here."}],["$","div",null,{"className":"divider","children":[["$","div",null,{"className":"divider__line"}],"$undefined"]}],["$","div",null,{"className":"divider","children":[["$","div",null,{"className":"divider__line"}],[["$","div",null,{"className":"divider__content","children":["$","$L6",null,{"name":"add","size":"medium"}]}],["$","div",null,{"className":"divider__line"}]]]}],["$","div",null,{"className":"divider","children":[["$","div",null,{"className":"divider__line"}],[["$","div",null,{"className":"divider__content","children":["$","strong",null,{"children":"custom text"}]}],["$","div",null,{"className":"divider__line"}]]]}],["$","h2",null,{"children":"Color"}],["$","p",null,{"children":["If you need to use divider on ",["$","strong",null,{"children":"non-white backgrounds"}]," use\n",["$","code",null,{"children":".divider--black"}]," or ",["$","code",null,{"children":".divider--white"}]," class"]}],["$","p",null,{"children":"Default color is gray and it's used on white backgrounds only"}],["$","div",null,{"className":"divider","children":[["$","div",null,{"className":"divider__line"}],"$undefined"]}],["$","div",null,{"className":"divider","children":[["$","div",null,{"className":"divider__line"}],[["$","div",null,{"className":"divider__content","children":["$","$L6",null,{"name":"add","size":"medium"}]}],["$","div",null,{"className":"divider__line"}]]]}],["$","div",null,{"className":"divider","children":[["$","div",null,{"className":"divider__line"}],[["$","div",null,{"className":"divider__content","children":["$","strong",null,{"children":"custom text"}]}],["$","div",null,{"className":"divider__line"}]]]}],["$","div",null,{"className":"bg-black","children":[["$","div",null,{"className":"divider divider--white","children":[["$","div",null,{"className":"divider__line"}],"$undefined"]}],["$","div",null,{"className":"divider divider--white","children":[["$","div",null,{"className":"divider__line"}],[["$","div",null,{"className":"divider__content","children":["$","$L6",null,{"name":"add","size":"medium"}]}],["$","div",null,{"className":"divider__line"}]]]}],["$","div",null,{"className":"divider divider--white","children":[["$","div",null,{"className":"divider__line"}],[["$","div",null,{"className":"divider__content","children":["$","strong",null,{"children":"custom text"}]}],["$","div",null,{"className":"divider__line"}]]]}]]}],["$","div",null,{"className":"divider divider--black","children":[["$","div",null,{"className":"divider__line"}],"$undefined"]}],["$","div",null,{"className":"divider divider--black","children":[["$","div",null,{"className":"divider__line"}],[["$","div",null,{"className":"divider__content","children":["$","$L6",null,{"name":"add","size":"medium"}]}],["$","div",null,{"className":"divider__line"}]]]}],["$","div",null,{"className":"divider divider--black","children":[["$","div",null,{"className":"divider__line"}],[["$","div",null,{"className":"divider__content","children":["$","strong",null,{"children":"custom text"}]}],["$","div",null,{"className":"divider__line"}]]]}]]}]}],"\n",["$","div",null,{"className":"section bg-black","children":["$","div",null,{"className":"container","ref":"$undefined","children":[["$","h1",null,{"children":"Divider"}],["$","p",null,{"children":"Divider serves as an option for horizontal division of spaces/elements/contents."}],["$","h2",null,{"children":"Example"}],["$","div",null,{"className":"divider","children":[["$","div",null,{"className":"divider__line"}],"$undefined"]}],["$","h2",null,{"children":"Width"}],["$","p",null,{"children":["Width of the divider line can be reduced to 1 pixel using ",["$","code",null,{"children":".divider__line--thin"}]," class."]}],["$","div",null,{"className":"divider","children":[["$","div",null,{"className":"divider__line"}],"$undefined"]}],["$","div",null,{"className":"divider","children":[["$","div",null,{"className":"divider__line divider__line--thin"}],"$undefined"]}],["$","h2",null,{"children":"Content"}],["$","p",null,{"children":"Divider can hold different contents if you need to visualise separation with\nsomething like a word or icon, you can do it here."}],["$","div",null,{"className":"divider","children":[["$","div",null,{"className":"divider__line"}],"$undefined"]}],["$","div",null,{"className":"divider","children":[["$","div",null,{"className":"divider__line"}],[["$","div",null,{"className":"divider__content","children":["$","$L6",null,{"name":"add","size":"medium"}]}],["$","div",null,{"className":"divider__line"}]]]}],["$","div",null,{"className":"divider","children":[["$","div",null,{"className":"divider__line"}],[["$","div",null,{"className":"divider__content","children":["$","strong",null,{"children":"custom text"}]}],["$","div",null,{"className":"divider__line"}]]]}],["$","h2",null,{"children":"Color"}],["$","p",null,{"children":["If you need to use divider on ",["$","strong",null,{"children":"non-white backgrounds"}]," use\n",["$","code",null,{"children":".divider--black"}]," or ",["$","code",null,{"children":".divider--white"}]," class"]}],["$","p",null,{"children":"Default color is gray and it's used on white backgrounds only"}],["$","div",null,{"className":"divider","children":[["$","div",null,{"className":"divider__line"}],"$undefined"]}],["$","div",null,{"className":"divider","children":[["$","div",null,{"className":"divider__line"}],[["$","div",null,{"className":"divider__content","children":["$","$L6",null,{"name":"add","size":"medium"}]}],["$","div",null,{"className":"divider__line"}]]]}],["$","div",null,{"className":"divider","children":[["$","div",null,{"className":"divider__line"}],[["$","div",null,{"className":"divider__content","children":["$","strong",null,{"children":"custom text"}]}],["$","div",null,{"className":"divider__line"}]]]}],["$","div",null,{"className":"bg-black","children":[["$","div",null,{"className":"divider divider--white","children":[["$","div",null,{"className":"divider__line"}],"$undefined"]}],["$","div",null,{"className":"divider divider--white","children":[["$","div",null,{"className":"divider__line"}],[["$","div",null,{"className":"divider__content","children":["$","$L6",null,{"name":"add","size":"medium"}]}],["$","div",null,{"className":"divider__line"}]]]}],["$","div",null,{"className":"divider divider--white","children":[["$","div",null,{"className":"divider__line"}],[["$","div",null,{"className":"divider__content","children":["$","strong",null,{"children":"custom text"}]}],["$","div",null,{"className":"divider__line"}]]]}]]}],["$","div",null,{"className":"divider divider--black","children":[["$","div",null,{"className":"divider__line"}],"$undefined"]}],["$","div",null,{"className":"divider divider--black","children":[["$","div",null,{"className":"divider__line"}],[["$","div",null,{"className":"divider__content","children":["$","$L6",null,{"name":"add","size":"medium"}]}],["$","div",null,{"className":"divider__line"}]]]}],["$","div",null,{"className":"divider divider--black","children":[["$","div",null,{"className":"divider__line"}],[["$","div",null,{"className":"divider__content","children":["$","strong",null,{"children":"custom text"}]}],["$","div",null,{"className":"divider__line"}]]]}]]}]}]],[["$","link","0",{"rel":"stylesheet","href":"/_next/static/css/7f570791ca140154.css","precedence":"next","crossOrigin":"$undefined","nonce":"$undefined"}],["$","link","1",{"rel":"stylesheet","href":"/_next/static/css/ac1d2e9b77b16926.css","precedence":"next","crossOrigin":"$undefined","nonce":"$undefined"}],["$","link","2",{"rel":"stylesheet","href":"/_next/static/css/0e5de495ff48931f.css","precedence":"next","crossOrigin":"$undefined","nonce":"$undefined"}],["$","link","3",{"rel":"stylesheet","href":"/_next/static/css/57b0c84bbf7d7098.css","precedence":"next","crossOrigin":"$undefined","nonce":"$undefined"}]],["$","$L7",null,{"children":["$L8","$L9",["$","$La",null,{"promise":"$@b"}]]}]]}],{},null,false]},null,false]},null,false]},null,false],["$","$1","h",{"children":[null,["$","$1","eEbg2Itnp7vONveWgyF9Dv",{"children":[["$","$Lc",null,{"children":"$Ld"}],["$","meta",null,{"name":"next-size-adjust","content":""}]]}],["$","$Le",null,{"children":"$Lf"}]]}],false]],"m":"$undefined","G":["$10","$undefined"],"s":false,"S":true}
+11:"$Sreact.suspense"
+12:I[4911,[],"AsyncMetadata"]
+f:["$","div",null,{"hidden":true,"children":["$","$11",null,{"fallback":null,"children":["$","$L12",null,{"promise":"$@13"}]}]}]
+9:null
+d:[["$","meta","0",{"charSet":"utf-8"}],["$","meta","1",{"name":"viewport","content":"width=device-width, initial-scale=1"}]]
+8:null
+b:{"metadata":[],"error":null,"digest":"$undefined"}
+13:{"metadata":"$b:metadata","error":null,"digest":"$undefined"}

package/build/components/dropdown.html ADDED Viewed

@@ -0,0 +1,18 @@
+<!DOCTYPE html><html lang="en" class="__className_df92c2"><head><meta charSet="utf-8"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="preload" href="/_next/static/media/671791babd225be4-s.p.woff2" as="font" crossorigin="" type="font/woff2"/><link rel="preload" href="/_next/static/media/c62d990acddde5f0-s.p.woff2" as="font" crossorigin="" type="font/woff2"/><link rel="preload" href="/_next/static/media/dfdbb1c4973e0bd7-s.p.woff2" as="font" crossorigin="" type="font/woff2"/><link rel="stylesheet" href="/_next/static/css/2cb6b1436172662a.css" data-precedence="next"/><link rel="stylesheet" href="/_next/static/css/ee49dfd49ae395ac.css" data-precedence="next"/><link rel="stylesheet" href="/_next/static/css/77590e66868bf291.css" data-precedence="next"/><link rel="stylesheet" href="/_next/static/css/0e5de495ff48931f.css" data-precedence="next"/><link rel="stylesheet" href="/_next/static/css/b853a4f8d045643a.css" data-precedence="next"/><link rel="stylesheet" href="/_next/static/css/ef46db3751d8e999.css" data-precedence="next"/><link rel="stylesheet" href="/_next/static/css/7202aa220abab0eb.css" data-precedence="next"/><link rel="stylesheet" href="/_next/static/css/7d4c59347b15c45f.css" data-precedence="next"/><link rel="stylesheet" href="/_next/static/css/7108a96a607fe7c5.css" data-precedence="next"/><link rel="stylesheet" href="/_next/static/css/ac1d2e9b77b16926.css" data-precedence="next"/><link rel="stylesheet" href="/_next/static/css/a88042aa83a2c354.css" data-precedence="next"/><link rel="stylesheet" href="/_next/static/css/57b0c84bbf7d7098.css" data-precedence="next"/><link rel="stylesheet" href="/_next/static/css/8ed102a331809889.css" data-precedence="next"/><link rel="preload" as="script" fetchPriority="low" href="/_next/static/chunks/webpack-1a128887cf981885.js"/><script src="/_next/static/chunks/4bd1b696-63246a30a5dafad8.js" async=""></script><script src="/_next/static/chunks/1684-f3cca2440b2d04c9.js" async=""></script><script src="/_next/static/chunks/main-app-a265e200b32683f1.js" async=""></script><script src="/_next/static/chunks/app/layout-41aa6f28da614a69.js" async=""></script><script src="/_next/static/chunks/9186-7ca86a881bc0fae7.js" async=""></script><script src="/_next/static/chunks/1206-59e86c9be0c6edc8.js" async=""></script><script src="/_next/static/chunks/1790-42537fde486481dc.js" async=""></script><script src="/_next/static/chunks/app/components/dropdown/page-86dc20ead95d1104.js" async=""></script><meta name="next-size-adjust" content=""/><script>document.querySelectorAll('body link[rel="icon"], body link[rel="apple-touch-icon"]').forEach(el => document.head.appendChild(el))</script><script src="/_next/static/chunks/polyfills-42372ed130431b0a.js" noModule=""></script></head><body><div hidden=""><!--$--><!--/$--></div><div id="root"><h1>Dropdown</h1>
+<p>It&#x27;s required to use <code>id</code> on dropdown a toogle button for it to work. <code>id</code> of dropdown should follow pattern <code>dropdown-&lt;name&gt;</code>
+and for toggle buttons <code>id</code> pattern <code>btn-&lt;name&gt;</code> should be used.</p>
+<div class="section"><div class="container"><button type="button" class="btn dropdown__button mb-none" aria-expanded="false" id="btn-1" data-toggle="[{&quot;target&quot;:&quot;self&quot;,&quot;attribute&quot;:&quot;aria-expanded&quot;}]">Dropdown<svg class="icon icon--medium btn__icon-right" aria-hidden="true"><use xlink:href="/sprite.svg#menu-arrow"></use></svg></button><div id="dropdown-1" class="dropdown" data-dropdown="" data-dropdown-placement="bottom-start" data-dropdown-interactive="false" data-dropdown-focus-trap="false"><a tabindex="0" href="#" class="dropdown__item">Laborum laboris amet minim.</a><a tabindex="-1" href="#" class="dropdown__item disabled" aria-disabled="true">Quis adipisicing eu consectetur.</a><div class="dropdown__divider"></div><a tabindex="0" href="#" class="dropdown__item">Deserunt id consectetur esse in.</a></div></div></div>
+<div class="section bg-black"><div class="container"><button type="button" class="btn dropdown__button mb-none" aria-expanded="false" id="btn-11" data-toggle="[{&quot;target&quot;:&quot;self&quot;,&quot;attribute&quot;:&quot;aria-expanded&quot;}]">Dropdown<svg class="icon icon--medium btn__icon-right" aria-hidden="true"><use xlink:href="/sprite.svg#menu-arrow"></use></svg></button><div id="dropdown-11" class="dropdown" data-dropdown="" data-dropdown-placement="bottom-start" data-dropdown-interactive="false" data-dropdown-focus-trap="false"><a tabindex="0" href="#" class="dropdown__item">Laborum laboris amet minim.</a><a tabindex="-1" href="#" class="dropdown__item disabled" aria-disabled="true">Quis adipisicing eu consectetur.</a><div class="dropdown__divider"></div><a tabindex="0" href="#" class="dropdown__item">Deserunt id consectetur esse in.</a></div></div></div>
+<h2>Dropdown Interactive</h2>
+<p>Dropdown menu with Interactive functionality eg. forms, buttons etc. should not close after click inside of dropdown component. This can be achieved with attribute <code>[data-dropdown-interactive]</code>.</p>
+<div class="section"><div class="container"><button type="button" class="btn dropdown__button mb-none" aria-expanded="false" id="btn-2" data-toggle="[{&quot;target&quot;:&quot;self&quot;,&quot;attribute&quot;:&quot;aria-expanded&quot;}]">Dropdown<svg class="icon icon--medium btn__icon-right" aria-hidden="true"><use xlink:href="/sprite.svg#menu-arrow"></use></svg></button><div id="dropdown-2" class="dropdown" data-dropdown="" data-dropdown-placement="bottom-start" data-dropdown-interactive="true" data-dropdown-focus-trap="false"><a tabindex="0" href="#" class="dropdown__item">Laborum laboris amet minim.</a><a tabindex="-1" href="#" class="dropdown__item disabled" aria-disabled="true">Quis adipisicing eu consectetur.</a><div class="dropdown__divider"></div><a tabindex="0" href="#" class="dropdown__item">Deserunt id consectetur esse in.</a></div></div></div>
+<div class="section bg-black"><div class="container"><button type="button" class="btn dropdown__button mb-none" aria-expanded="false" id="btn-22" data-toggle="[{&quot;target&quot;:&quot;self&quot;,&quot;attribute&quot;:&quot;aria-expanded&quot;}]">Dropdown<svg class="icon icon--medium btn__icon-right" aria-hidden="true"><use xlink:href="/sprite.svg#menu-arrow"></use></svg></button><div id="dropdown-22" class="dropdown" data-dropdown="" data-dropdown-placement="bottom-start" data-dropdown-interactive="true" data-dropdown-focus-trap="false"><a tabindex="0" href="#" class="dropdown__item">Laborum laboris amet minim.</a><a tabindex="-1" href="#" class="dropdown__item disabled" aria-disabled="true">Quis adipisicing eu consectetur.</a><div class="dropdown__divider"></div><a tabindex="0" href="#" class="dropdown__item">Deserunt id consectetur esse in.</a></div></div></div>
+<h2>Focus Trap</h2>
+<p>Prevents user from leaving the Dropdown using keyboard without closing the Dropdown. Can be achieved with attribute <code>[data-dropdown-focus-trap]</code>. In this case Dropdown can be
+close by using <code>Escape</code> key, but it&#x27;s also recommended to use close button. Close buttons <code>id</code> needs to follow pattern <code>close-btn-&lt;name&gt;</code> for it to work.</p>
+<div class="section"><div class="container"><button type="button" class="btn dropdown__button mb-none" aria-expanded="false" id="btn-3" data-toggle="[{&quot;target&quot;:&quot;self&quot;,&quot;attribute&quot;:&quot;aria-expanded&quot;}]">With focus trap<svg class="icon icon--medium btn__icon-right" aria-hidden="true"><use xlink:href="/sprite.svg#menu-arrow"></use></svg></button><div id="dropdown-3" class="dropdown dropdown-spacing" data-dropdown="" data-dropdown-placement="bottom-start" data-dropdown-interactive="true" data-dropdown-focus-trap="true"><div class="bar mb-small justify-content-end"><div class="bar__item"><button type="button" class="btn btn--square btn--small dropdown__close" aria-label="Zatvoriť" id="close-btn-3" data-toggle="[{&quot;target&quot;:&quot;#btn-3&quot;,&quot;action&quot;:&quot;click&quot;}]"><svg class="icon icon--small" aria-hidden="true"><use xlink:href="/sprite.svg#delete"></use></svg><span class="visually-hidden"></span></button></div></div><select id="select-in-dropdown" name="select-in-dropdown" class="select" style="width:100px"><option>Item 1</option><option>Item 2</option></select></div></div></div>
+<div class="section bg-black"><div class="container"><button type="button" class="btn dropdown__button mb-none" aria-expanded="false" id="btn-33" data-toggle="[{&quot;target&quot;:&quot;self&quot;,&quot;attribute&quot;:&quot;aria-expanded&quot;}]">With focus trap<svg class="icon icon--medium btn__icon-right" aria-hidden="true"><use xlink:href="/sprite.svg#menu-arrow"></use></svg></button><div id="dropdown-33" class="dropdown dropdown-spacing" data-dropdown="" data-dropdown-placement="bottom-start" data-dropdown-interactive="true" data-dropdown-focus-trap="true"><div class="bar mb-small justify-content-end"><div class="bar__item"><button type="button" class="btn btn--square btn--small dropdown__close" aria-label="Zatvoriť" id="close-btn-33" data-toggle="[{&quot;target&quot;:&quot;#btn-33&quot;,&quot;action&quot;:&quot;click&quot;}]"><svg class="icon icon--small" aria-hidden="true"><use xlink:href="/sprite.svg#delete"></use></svg><span class="visually-hidden"></span></button></div></div><select id="select-in-dropdown" name="select-in-dropdown" class="select" style="width:100px"><option>Item 1</option><option>Item 2</option></select></div></div></div>
+<h2>Position</h2>
+<p>Dropdown can be aligned to left, right or center side of toggle button.</p>
+<div class="section"><div class="container"><div class="grid"><div class="grid__col grid__col--md-4"><button type="button" class="btn dropdown__button mb-none" aria-expanded="false" id="btn-4" data-toggle="[{&quot;target&quot;:&quot;self&quot;,&quot;attribute&quot;:&quot;aria-expanded&quot;}]">Aligned to left</button><div id="dropdown-4" class="dropdown dropdown-spacing" data-dropdown="" data-dropdown-placement="bottom-start" data-dropdown-interactive="true" data-dropdown-focus-trap="false"><p>Told ya I&#x27;m aligned to left...</p></div></div><div class="grid__col grid__col--md-4"><button type="button" class="btn dropdown__button mb-none" aria-expanded="false" id="btn-5" data-toggle="[{&quot;target&quot;:&quot;self&quot;,&quot;attribute&quot;:&quot;aria-expanded&quot;}]">Aligned to center</button><div id="dropdown-5" class="dropdown dropdown-spacing" data-dropdown="" data-dropdown-placement="bottom" data-dropdown-interactive="true" data-dropdown-focus-trap="false"><p>Told ya I&#x27;m aligned to center...</p></div></div><div class="grid__col grid__col--md-4"><button type="button" class="btn dropdown__button mb-none" aria-expanded="false" id="btn-6" data-toggle="[{&quot;target&quot;:&quot;self&quot;,&quot;attribute&quot;:&quot;aria-expanded&quot;}]">Aligned to right</button><div id="dropdown-6" class="dropdown dropdown-spacing" data-dropdown="" data-dropdown-placement="bottom-end" data-dropdown-interactive="true" data-dropdown-focus-trap="false"><p>Told ya I&#x27;m aligned to right...</p></div></div></div></div></div>
+<div class="section bg-black"><div class="container"><div class="grid"><div class="grid__col grid__col--md-4"><button type="button" class="btn dropdown__button mb-none" aria-expanded="false" id="btn-44" data-toggle="[{&quot;target&quot;:&quot;self&quot;,&quot;attribute&quot;:&quot;aria-expanded&quot;}]">Aligned to left</button><div id="dropdown-44" class="dropdown dropdown-spacing" data-dropdown="" data-dropdown-placement="bottom-start" data-dropdown-interactive="true" data-dropdown-focus-trap="false"><p>Told ya I&#x27;m aligned to left...</p></div></div><div class="grid__col grid__col--md-4"><button type="button" class="btn dropdown__button mb-none" aria-expanded="false" id="btn-55" data-toggle="[{&quot;target&quot;:&quot;self&quot;,&quot;attribute&quot;:&quot;aria-expanded&quot;}]">Aligned to center</button><div id="dropdown-55" class="dropdown dropdown-spacing" data-dropdown="" data-dropdown-placement="bottom" data-dropdown-interactive="true" data-dropdown-focus-trap="false"><p>Told ya I&#x27;m aligned to center...</p></div></div><div class="grid__col grid__col--md-4"><button type="button" class="btn dropdown__button mb-none" aria-expanded="false" id="btn-66" data-toggle="[{&quot;target&quot;:&quot;self&quot;,&quot;attribute&quot;:&quot;aria-expanded&quot;}]">Aligned to right</button><div id="dropdown-66" class="dropdown dropdown-spacing" data-dropdown="" data-dropdown-placement="bottom-end" data-dropdown-interactive="true" data-dropdown-focus-trap="false"><p>Told ya I&#x27;m aligned to right...</p></div></div></div></div></div><!--$--><!--/$--></div><div id="root-modals"></div><div id="root-dropdowns"></div><div id="root-tooltips"></div><script src="/_next/static/chunks/webpack-1a128887cf981885.js" async=""></script><script>(self.__next_f=self.__next_f||[]).push([0])</script><script>self.__next_f.push([1,"1:\"$Sreact.fragment\"\n2:I[3640,[\"7177\",\"static/chunks/app/layout-41aa6f28da614a69.js\"],\"default\"]\n3:I[5085,[\"9186\",\"static/chunks/9186-7ca86a881bc0fae7.js\",\"1206\",\"static/chunks/1206-59e86c9be0c6edc8.js\",\"1790\",\"static/chunks/1790-42537fde486481dc.js\",\"3841\",\"static/chunks/app/components/dropdown/page-86dc20ead95d1104.js\"],\"SpritePathProvider\"]\n4:I[7555,[],\"\"]\n5:I[1295,[],\"\"]\n6:I[8242,[\"9186\",\"static/chunks/9186-7ca86a881bc0fae7.js\",\"1206\",\"static/chunks/1206-59e86c9be0c6edc8.js\",\"1790\",\"static/chunks/1790-42537fde486481dc.js\",\"3841\",\"static/chunks/app/components/dropdown/page-86dc20ead95d1104.js\"],\"Dropdown\"]\n7:I[9665,[],\"OutletBoundary\"]\na:I[4911,[],\"AsyncMetadataOutlet\"]\nc:I[9665,[],\"ViewportBoundary\"]\ne:I[9665,[],\"MetadataBoundary\"]\n10:I[6614,[],\"\"]\n:HL[\"/_next/static/media/671791babd225be4-s.p.woff2\",\"font\",{\"crossOrigin\":\"\",\"type\":\"font/woff2\"}]\n:HL[\"/_next/static/media/c62d990acddde5f0-s.p.woff2\",\"font\",{\"crossOrigin\":\"\",\"type\":\"font/woff2\"}]\n:HL[\"/_next/static/media/dfdbb1c4973e0bd7-s.p.woff2\",\"font\",{\"crossOrigin\":\"\",\"type\":\"font/woff2\"}]\n:HL[\"/_next/static/css/2cb6b1436172662a.css\",\"style\"]\n:HL[\"/_next/static/css/ee49dfd49ae395ac.css\",\"style\"]\n:HL[\"/_next/static/css/77590e66868bf291.css\",\"style\"]\n:HL[\"/_next/static/css/0e5de495ff48931f.css\",\"style\"]\n:HL[\"/_next/static/css/b853a4f8d045643a.css\",\"style\"]\n:HL[\"/_next/static/css/ef46db3751d8e999.css\",\"style\"]\n:HL[\"/_next/static/css/7202aa220abab0eb.css\",\"style\"]\n:HL[\"/_next/static/css/7d4c59347b15c45f.css\",\"style\"]\n:HL[\"/_next/static/css/7108a96a607fe7c5.css\",\"style\"]\n:HL[\"/_next/static/css/ac1d2e9b77b16926.css\",\"style\"]\n:HL[\"/_next/static/css/a88042aa83a2c354.css\",\"style\"]\n:HL[\"/_next/static/css/57b0c84bbf7d7098.css\",\"style\"]\n:HL[\"/_next/static/css/8ed102a331809889.css\",\"style\"]\n"])</script><script>self.__next_f.push([1,"0:{\"P\":null,\"b\":\"BGy4QLZfZPwswIZT7YGE2\",\"p\":\"\",\"c\":[\"\",\"components\",\"dropdown\"],\"i\":false,\"f\":[[[\"\",{\"children\":[\"components\",{\"children\":[\"dropdown\",{\"children\":[\"__PAGE__\",{}]}]}]},\"$undefined\",\"$undefined\",true],[\"\",[\"$\",\"$1\",\"c\",{\"children\":[[[\"$\",\"link\",\"0\",{\"rel\":\"stylesheet\",\"href\":\"/_next/static/css/2cb6b1436172662a.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\",\"nonce\":\"$undefined\"}],[\"$\",\"link\",\"1\",{\"rel\":\"stylesheet\",\"href\":\"/_next/static/css/ee49dfd49ae395ac.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\",\"nonce\":\"$undefined\"}]],[\"$\",\"html\",null,{\"lang\":\"en\",\"className\":\"__className_df92c2\",\"children\":[\"$\",\"body\",null,{\"children\":[[\"$\",\"$L2\",null,{}],[\"$\",\"div\",null,{\"id\":\"root\",\"children\":[\"$\",\"$L3\",null,{\"children\":[\"$\",\"$L4\",null,{\"parallelRouterKey\":\"children\",\"error\":\"$undefined\",\"errorStyles\":\"$undefined\",\"errorScripts\":\"$undefined\",\"template\":[\"$\",\"$L5\",null,{}],\"templateStyles\":\"$undefined\",\"templateScripts\":\"$undefined\",\"notFound\":[[[\"$\",\"title\",null,{\"children\":\"404: This page could not be found.\"}],[\"$\",\"div\",null,{\"style\":{\"fontFamily\":\"system-ui,\\\"Segoe UI\\\",Roboto,Helvetica,Arial,sans-serif,\\\"Apple Color Emoji\\\",\\\"Segoe UI Emoji\\\"\",\"height\":\"100vh\",\"textAlign\":\"center\",\"display\":\"flex\",\"flexDirection\":\"column\",\"alignItems\":\"center\",\"justifyContent\":\"center\"},\"children\":[\"$\",\"div\",null,{\"children\":[[\"$\",\"style\",null,{\"dangerouslySetInnerHTML\":{\"__html\":\"body{color:#000;background:#fff;margin:0}.next-error-h1{border-right:1px solid rgba(0,0,0,.3)}@media (prefers-color-scheme:dark){body{color:#fff;background:#000}.next-error-h1{border-right:1px solid rgba(255,255,255,.3)}}\"}}],[\"$\",\"h1\",null,{\"className\":\"next-error-h1\",\"style\":{\"display\":\"inline-block\",\"margin\":\"0 20px 0 0\",\"padding\":\"0 23px 0 0\",\"fontSize\":24,\"fontWeight\":500,\"verticalAlign\":\"top\",\"lineHeight\":\"49px\"},\"children\":404}],[\"$\",\"div\",null,{\"style\":{\"display\":\"inline-block\"},\"children\":[\"$\",\"h2\",null,{\"style\":{\"fontSize\":14,\"fontWeight\":400,\"lineHeight\":\"49px\",\"margin\":0},\"children\":\"This page could not be found.\"}]}]]}]}]],[]],\"forbidden\":\"$undefined\",\"unauthorized\":\"$undefined\"}]}]}],[\"$\",\"div\",null,{\"id\":\"root-modals\"}],[\"$\",\"div\",null,{\"id\":\"root-dropdowns\"}],[\"$\",\"div\",null,{\"id\":\"root-tooltips\"}]]}]}]]}],{\"children\":[\"components\",[\"$\",\"$1\",\"c\",{\"children\":[null,[\"$\",\"$L4\",null,{\"parallelRouterKey\":\"children\",\"error\":\"$undefined\",\"errorStyles\":\"$undefined\",\"errorScripts\":\"$undefined\",\"template\":[\"$\",\"$L5\",null,{}],\"templateStyles\":\"$undefined\",\"templateScripts\":\"$undefined\",\"notFound\":\"$undefined\",\"forbidden\":\"$undefined\",\"unauthorized\":\"$undefined\"}]]}],{\"children\":[\"dropdown\",[\"$\",\"$1\",\"c\",{\"children\":[null,[\"$\",\"$L4\",null,{\"parallelRouterKey\":\"children\",\"error\":\"$undefined\",\"errorStyles\":\"$undefined\",\"errorScripts\":\"$undefined\",\"template\":[\"$\",\"$L5\",null,{}],\"templateStyles\":\"$undefined\",\"templateScripts\":\"$undefined\",\"notFound\":\"$undefined\",\"forbidden\":\"$undefined\",\"unauthorized\":\"$undefined\"}]]}],{\"children\":[\"__PAGE__\",[\"$\",\"$1\",\"c\",{\"children\":[[[\"$\",\"h1\",null,{\"children\":\"Dropdown\"}],\"\\n\",[\"$\",\"p\",null,{\"children\":[\"It's required to use \",[\"$\",\"code\",null,{\"children\":\"id\"}],\" on dropdown a toogle button for it to work. \",[\"$\",\"code\",null,{\"children\":\"id\"}],\" of dropdown should follow pattern \",[\"$\",\"code\",null,{\"children\":\"dropdown-\u003cname\u003e\"}],\"\\nand for toggle buttons \",[\"$\",\"code\",null,{\"children\":\"id\"}],\" pattern \",[\"$\",\"code\",null,{\"children\":\"btn-\u003cname\u003e\"}],\" should be used.\"]}],\"\\n\",[\"$\",\"div\",null,{\"className\":\"section\",\"children\":[\"$\",\"div\",null,{\"className\":\"container\",\"ref\":\"$undefined\",\"children\":[\"$\",\"$L6\",null,{\"id\":\"1\",\"hasSpacing\":false,\"button\":{\"iconName\":\"menu-arrow\",\"children\":\"Dropdown\",\"iconPosition\":\"right\"},\"children\":[[\"$\",\"a\",null,{\"tabIndex\":0,\"href\":\"#\",\"className\":\"dropdown__item\",\"aria-disabled\":\"$undefined\",\"children\":\"Laborum laboris amet minim.\"}],[\"$\",\"a\",null,{\"tabIndex\":-1,\"href\":\"#\",\"className\":\"dropdown__item disabled\",\"aria-disabled\":true,\"children\":\"Quis adipisicing eu consectetur.\"}],[\"$\",\"div\",null,{\"className\":\"dropdown__divider\"}],[\"$\",\"a\",null,{\"tabIndex\":0,\"href\":\"#\",\"className\":\"dropdown__item\",\"aria-disabled\":\"$undefined\",\"children\":\"Deserunt id consectetur esse in.\"}]]}]}]}],\"\\n\",[\"$\",\"div\",null,{\"className\":\"section bg-black\",\"children\":[\"$\",\"div\",null,{\"className\":\"container\",\"ref\":\"$undefined\",\"children\":[\"$\",\"$L6\",null,{\"id\":\"11\",\"hasSpacing\":false,\"button\":{\"iconName\":\"menu-arrow\",\"children\":\"Dropdown\",\"iconPosition\":\"right\"},\"children\":[[\"$\",\"a\",null,{\"tabIndex\":0,\"href\":\"#\",\"className\":\"dropdown__item\",\"aria-disabled\":\"$undefined\",\"children\":\"Laborum laboris amet minim.\"}],[\"$\",\"a\",null,{\"tabIndex\":-1,\"href\":\"#\",\"className\":\"dropdown__item disabled\",\"aria-disabled\":true,\"children\":\"Quis adipisicing eu consectetur.\"}],[\"$\",\"div\",null,{\"className\":\"dropdown__divider\"}],[\"$\",\"a\",null,{\"tabIndex\":0,\"href\":\"#\",\"className\":\"dropdown__item\",\"aria-disabled\":\"$undefined\",\"children\":\"Deserunt id consectetur esse in.\"}]]}]}]}],\"\\n\",[\"$\",\"h2\",null,{\"children\":\"Dropdown Interactive\"}],\"\\n\",[\"$\",\"p\",null,{\"children\":[\"Dropdown menu with Interactive functionality eg. forms, buttons etc. should not close after click inside of dropdown component. This can be achieved with attribute \",[\"$\",\"code\",null,{\"children\":\"[data-dropdown-interactive]\"}],\".\"]}],\"\\n\",[\"$\",\"div\",null,{\"className\":\"section\",\"children\":[\"$\",\"div\",null,{\"className\":\"container\",\"ref\":\"$undefined\",\"children\":[\"$\",\"$L6\",null,{\"id\":\"2\",\"hasSpacing\":false,\"isInteractive\":true,\"button\":{\"iconName\":\"menu-arrow\",\"children\":\"Dropdown\",\"iconPosition\":\"right\"},\"children\":[[\"$\",\"a\",null,{\"tabIndex\":0,\"href\":\"#\",\"className\":\"dropdown__item\",\"aria-disabled\":\"$undefined\",\"children\":\"Laborum laboris amet minim.\"}],[\"$\",\"a\",null,{\"tabIndex\":-1,\"href\":\"#\",\"className\":\"dropdown__item disabled\",\"aria-disabled\":true,\"children\":\"Quis adipisicing eu consectetur.\"}],[\"$\",\"div\",null,{\"className\":\"dropdown__divider\"}],[\"$\",\"a\",null,{\"tabIndex\":0,\"href\":\"#\",\"className\":\"dropdown__item\",\"aria-disabled\":\"$undefined\",\"children\":\"Deserunt id consectetur esse in.\"}]]}]}]}],\"\\n\",[\"$\",\"div\",null,{\"className\":\"section bg-black\",\"children\":[\"$\",\"div\",null,{\"className\":\"container\",\"ref\":\"$undefined\",\"children\":[\"$\",\"$L6\",null,{\"id\":\"22\",\"hasSpacing\":false,\"isInteractive\":true,\"button\":{\"iconName\":\"menu-arrow\",\"children\":\"Dropdown\",\"iconPosition\":\"right\"},\"children\":[[\"$\",\"a\",null,{\"tabIndex\":0,\"href\":\"#\",\"className\":\"dropdown__item\",\"aria-disabled\":\"$undefined\",\"children\":\"Laborum laboris amet minim.\"}],[\"$\",\"a\",null,{\"tabIndex\":-1,\"href\":\"#\",\"className\":\"dropdown__item disabled\",\"aria-disabled\":true,\"children\":\"Quis adipisicing eu consectetur.\"}],[\"$\",\"div\",null,{\"className\":\"dropdown__divider\"}],[\"$\",\"a\",null,{\"tabIndex\":0,\"href\":\"#\",\"className\":\"dropdown__item\",\"aria-disabled\":\"$undefined\",\"children\":\"Deserunt id consectetur esse in.\"}]]}]}]}],\"\\n\",[\"$\",\"h2\",null,{\"children\":\"Focus Trap\"}],\"\\n\",[\"$\",\"p\",null,{\"children\":[\"Prevents user from leaving the Dropdown using keyboard without closing the Dropdown. Can be achieved with attribute \",[\"$\",\"code\",null,{\"children\":\"[data-dropdown-focus-trap]\"}],\". In this case Dropdown can be\\nclose by using \",[\"$\",\"code\",null,{\"children\":\"Escape\"}],\" key, but it's also recommended to use close button. Close buttons \",[\"$\",\"code\",null,{\"children\":\"id\"}],\" needs to follow pattern \",[\"$\",\"code\",null,{\"children\":\"close-btn-\u003cname\u003e\"}],\" for it to work.\"]}],\"\\n\",[\"$\",\"div\",null,{\"className\":\"section\",\"children\":[\"$\",\"div\",null,{\"className\":\"container\",\"ref\":\"$undefined\",\"children\":[\"$\",\"$L6\",null,{\"id\":\"3\",\"hasFocusTrap\":true,\"isInteractive\":true,\"button\":{\"iconName\":\"menu-arrow\",\"children\":\"With focus trap\",\"iconPosition\":\"right\"},\"children\":[\"$\",\"select\",null,{\"id\":\"select-in-dropdown\",\"name\":\"select-in-dropdown\",\"className\":\"select\",\"disabled\":\"$undefined\",\"ref\":\"$undefined\",\"style\":{\"width\":\"100px\"},\"children\":[[],[[\"$\",\"option\",null,{\"children\":\"Item 1\"}],[\"$\",\"option\",null,{\"children\":\"Item 2\"}]]]}]}]}]}],\"\\n\",[\"$\",\"div\",null,{\"className\":\"section bg-black\",\"children\":[\"$\",\"div\",null,{\"className\":\"container\",\"ref\":\"$undefined\",\"children\":[\"$\",\"$L6\",null,{\"id\":\"33\",\"hasFocusTrap\":true,\"isInteractive\":true,\"button\":{\"iconName\":\"menu-arrow\",\"children\":\"With focus trap\",\"iconPosition\":\"right\"},\"children\":[\"$\",\"select\",null,{\"id\":\"select-in-dropdown\",\"name\":\"select-in-dropdown\",\"className\":\"select\",\"disabled\":\"$undefined\",\"ref\":\"$undefined\",\"style\":{\"width\":\"100px\"},\"children\":[[],[[\"$\",\"option\",null,{\"children\":\"Item 1\"}],[\"$\",\"option\",null,{\"children\":\"Item 2\"}]]]}]}]}]}],\"\\n\",[\"$\",\"h2\",null,{\"children\":\"Position\"}],\"\\n\",[\"$\",\"p\",null,{\"children\":\"Dropdown can be aligned to left, right or center side of toggle button.\"}],\"\\n\",[\"$\",\"div\",null,{\"className\":\"section\",\"children\":[\"$\",\"div\",null,{\"className\":\"container\",\"ref\":\"$undefined\",\"children\":[\"$\",\"div\",null,{\"className\":\"grid\",\"ref\":\"$undefined\",\"children\":[[\"$\",\"div\",null,{\"className\":\"grid__col grid__col--md-4\",\"children\":[\"$\",\"$L6\",null,{\"isInteractive\":true,\"id\":\"4\",\"button\":{\"children\":\"Aligned to left\"},\"children\":[\"$\",\"p\",null,{\"children\":\"Told ya I'm aligned to left...\"}]}]}],[\"$\",\"div\",null,{\"className\":\"grid__col grid__col--md-4\",\"children\":[\"$\",\"$L6\",null,{\"isInteractive\":true,\"id\":\"5\",\"placement\":\"center\",\"button\":{\"children\":\"Aligned to center\"},\"children\":[\"$\",\"p\",null,{\"children\":\"Told ya I'm aligned to center...\"}]}]}],[\"$\",\"div\",null,{\"className\":\"grid__col grid__col--md-4\",\"children\":[\"$\",\"$L6\",null,{\"isInteractive\":true,\"id\":\"6\",\"placement\":\"right\",\"button\":{\"children\":\"Aligned to right\"},\"children\":[\"$\",\"p\",null,{\"children\":\"Told ya I'm aligned to right...\"}]}]}]]}]}]}],\"\\n\",[\"$\",\"div\",null,{\"className\":\"section bg-black\",\"children\":[\"$\",\"div\",null,{\"className\":\"container\",\"ref\":\"$undefined\",\"children\":[\"$\",\"div\",null,{\"className\":\"grid\",\"ref\":\"$undefined\",\"children\":[[\"$\",\"div\",null,{\"className\":\"grid__col grid__col--md-4\",\"children\":[\"$\",\"$L6\",null,{\"isInteractive\":true,\"id\":\"44\",\"button\":{\"children\":\"Aligned to left\"},\"children\":[\"$\",\"p\",null,{\"children\":\"Told ya I'm aligned to left...\"}]}]}],[\"$\",\"div\",null,{\"className\":\"grid__col grid__col--md-4\",\"children\":[\"$\",\"$L6\",null,{\"isInteractive\":true,\"id\":\"55\",\"placement\":\"center\",\"button\":{\"children\":\"Aligned to center\"},\"children\":[\"$\",\"p\",null,{\"children\":\"Told ya I'm aligned to center...\"}]}]}],[\"$\",\"div\",null,{\"className\":\"grid__col grid__col--md-4\",\"children\":[\"$\",\"$L6\",null,{\"isInteractive\":true,\"id\":\"66\",\"placement\":\"right\",\"button\":{\"children\":\"Aligned to right\"},\"children\":[\"$\",\"p\",null,{\"children\":\"Told ya I'm aligned to right...\"}]}]}]]}]}]}]],[[\"$\",\"link\",\"0\",{\"rel\":\"stylesheet\",\"href\":\"/_next/static/css/77590e66868bf291.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\",\"nonce\":\"$undefined\"}],[\"$\",\"link\",\"1\",{\"rel\":\"stylesheet\",\"href\":\"/_next/static/css/0e5de495ff48931f.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\",\"nonce\":\"$undefined\"}],[\"$\",\"link\",\"2\",{\"rel\":\"stylesheet\",\"href\":\"/_next/static/css/b853a4f8d045643a.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\",\"nonce\":\"$undefined\"}],[\"$\",\"link\",\"3\",{\"rel\":\"stylesheet\",\"href\":\"/_next/static/css/ef46db3751d8e999.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\",\"nonce\":\"$undefined\"}],[\"$\",\"link\",\"4\",{\"rel\":\"stylesheet\",\"href\":\"/_next/static/css/7202aa220abab0eb.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\",\"nonce\":\"$undefined\"}],[\"$\",\"link\",\"5\",{\"rel\":\"stylesheet\",\"href\":\"/_next/static/css/7d4c59347b15c45f.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\",\"nonce\":\"$undefined\"}],[\"$\",\"link\",\"6\",{\"rel\":\"stylesheet\",\"href\":\"/_next/static/css/7108a96a607fe7c5.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\",\"nonce\":\"$undefined\"}],[\"$\",\"link\",\"7\",{\"rel\":\"stylesheet\",\"href\":\"/_next/static/css/ac1d2e9b77b16926.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\",\"nonce\":\"$undefined\"}],[\"$\",\"link\",\"8\",{\"rel\":\"stylesheet\",\"href\":\"/_next/static/css/a88042aa83a2c354.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\",\"nonce\":\"$undefined\"}],[\"$\",\"link\",\"9\",{\"rel\":\"stylesheet\",\"href\":\"/_next/static/css/57b0c84bbf7d7098.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\",\"nonce\":\"$undefined\"}],[\"$\",\"link\",\"10\",{\"rel\":\"stylesheet\",\"href\":\"/_next/static/css/8ed102a331809889.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\",\"nonce\":\"$undefined\"}]],[\"$\",\"$L7\",null,{\"children\":[\"$L8\",\"$L9\",[\"$\",\"$La\",null,{\"promise\":\"$@b\"}]]}]]}],{},null,false]},null,false]},null,false]},null,false],[\"$\",\"$1\",\"h\",{\"children\":[null,[\"$\",\"$1\",\"8yWU96kzlxyMArVDMELpgv\",{\"children\":[[\"$\",\"$Lc\",null,{\"children\":\"$Ld\"}],[\"$\",\"meta\",null,{\"name\":\"next-size-adjust\",\"content\":\"\"}]]}],[\"$\",\"$Le\",null,{\"children\":\"$Lf\"}]]}],false]],\"m\":\"$undefined\",\"G\":[\"$10\",\"$undefined\"],\"s\":false,\"S\":true}\n"])</script><script>self.__next_f.push([1,"11:\"$Sreact.suspense\"\n12:I[4911,[],\"AsyncMetadata\"]\nf:[\"$\",\"div\",null,{\"hidden\":true,\"children\":[\"$\",\"$11\",null,{\"fallback\":null,\"children\":[\"$\",\"$L12\",null,{\"promise\":\"$@13\"}]}]}]\n9:null\n"])</script><script>self.__next_f.push([1,"d:[[\"$\",\"meta\",\"0\",{\"charSet\":\"utf-8\"}],[\"$\",\"meta\",\"1\",{\"name\":\"viewport\",\"content\":\"width=device-width, initial-scale=1\"}]]\n8:null\n"])</script><script>self.__next_f.push([1,"b:{\"metadata\":[],\"error\":null,\"digest\":\"$undefined\"}\n13:{\"metadata\":\"$b:metadata\",\"error\":null,\"digest\":\"$undefined\"}\n"])</script></body></html>

package/build/components/dropdown.txt ADDED Viewed

@@ -0,0 +1,36 @@
+1:"$Sreact.fragment"
+2:I[3640,["7177","static/chunks/app/layout-41aa6f28da614a69.js"],"default"]
+3:I[5085,["9186","static/chunks/9186-7ca86a881bc0fae7.js","1206","static/chunks/1206-59e86c9be0c6edc8.js","1790","static/chunks/1790-42537fde486481dc.js","3841","static/chunks/app/components/dropdown/page-86dc20ead95d1104.js"],"SpritePathProvider"]
+4:I[7555,[],""]
+5:I[1295,[],""]
+6:I[8242,["9186","static/chunks/9186-7ca86a881bc0fae7.js","1206","static/chunks/1206-59e86c9be0c6edc8.js","1790","static/chunks/1790-42537fde486481dc.js","3841","static/chunks/app/components/dropdown/page-86dc20ead95d1104.js"],"Dropdown"]
+7:I[9665,[],"OutletBoundary"]
+a:I[4911,[],"AsyncMetadataOutlet"]
+c:I[9665,[],"ViewportBoundary"]
+e:I[9665,[],"MetadataBoundary"]
+10:I[6614,[],""]
+:HL["/_next/static/media/671791babd225be4-s.p.woff2","font",{"crossOrigin":"","type":"font/woff2"}]
+:HL["/_next/static/media/c62d990acddde5f0-s.p.woff2","font",{"crossOrigin":"","type":"font/woff2"}]
+:HL["/_next/static/media/dfdbb1c4973e0bd7-s.p.woff2","font",{"crossOrigin":"","type":"font/woff2"}]
+:HL["/_next/static/css/2cb6b1436172662a.css","style"]
+:HL["/_next/static/css/ee49dfd49ae395ac.css","style"]
+:HL["/_next/static/css/77590e66868bf291.css","style"]
+:HL["/_next/static/css/0e5de495ff48931f.css","style"]
+:HL["/_next/static/css/b853a4f8d045643a.css","style"]
+:HL["/_next/static/css/ef46db3751d8e999.css","style"]
+:HL["/_next/static/css/7202aa220abab0eb.css","style"]
+:HL["/_next/static/css/7d4c59347b15c45f.css","style"]
+:HL["/_next/static/css/7108a96a607fe7c5.css","style"]
+:HL["/_next/static/css/ac1d2e9b77b16926.css","style"]
+:HL["/_next/static/css/a88042aa83a2c354.css","style"]
+:HL["/_next/static/css/57b0c84bbf7d7098.css","style"]
+:HL["/_next/static/css/8ed102a331809889.css","style"]
+0:{"P":null,"b":"BGy4QLZfZPwswIZT7YGE2","p":"","c":["","components","dropdown"],"i":false,"f":[[["",{"children":["components",{"children":["dropdown",{"children":["__PAGE__",{}]}]}]},"$undefined","$undefined",true],["",["$","$1","c",{"children":[[["$","link","0",{"rel":"stylesheet","href":"/_next/static/css/2cb6b1436172662a.css","precedence":"next","crossOrigin":"$undefined","nonce":"$undefined"}],["$","link","1",{"rel":"stylesheet","href":"/_next/static/css/ee49dfd49ae395ac.css","precedence":"next","crossOrigin":"$undefined","nonce":"$undefined"}]],["$","html",null,{"lang":"en","className":"__className_df92c2","children":["$","body",null,{"children":[["$","$L2",null,{}],["$","div",null,{"id":"root","children":["$","$L3",null,{"children":["$","$L4",null,{"parallelRouterKey":"children","error":"$undefined","errorStyles":"$undefined","errorScripts":"$undefined","template":["$","$L5",null,{}],"templateStyles":"$undefined","templateScripts":"$undefined","notFound":[[["$","title",null,{"children":"404: This page could not be found."}],["$","div",null,{"style":{"fontFamily":"system-ui,\"Segoe UI\",Roboto,Helvetica,Arial,sans-serif,\"Apple Color Emoji\",\"Segoe UI Emoji\"","height":"100vh","textAlign":"center","display":"flex","flexDirection":"column","alignItems":"center","justifyContent":"center"},"children":["$","div",null,{"children":[["$","style",null,{"dangerouslySetInnerHTML":{"__html":"body{color:#000;background:#fff;margin:0}.next-error-h1{border-right:1px solid rgba(0,0,0,.3)}@media (prefers-color-scheme:dark){body{color:#fff;background:#000}.next-error-h1{border-right:1px solid rgba(255,255,255,.3)}}"}}],["$","h1",null,{"className":"next-error-h1","style":{"display":"inline-block","margin":"0 20px 0 0","padding":"0 23px 0 0","fontSize":24,"fontWeight":500,"verticalAlign":"top","lineHeight":"49px"},"children":404}],["$","div",null,{"style":{"display":"inline-block"},"children":["$","h2",null,{"style":{"fontSize":14,"fontWeight":400,"lineHeight":"49px","margin":0},"children":"This page could not be found."}]}]]}]}]],[]],"forbidden":"$undefined","unauthorized":"$undefined"}]}]}],["$","div",null,{"id":"root-modals"}],["$","div",null,{"id":"root-dropdowns"}],["$","div",null,{"id":"root-tooltips"}]]}]}]]}],{"children":["components",["$","$1","c",{"children":[null,["$","$L4",null,{"parallelRouterKey":"children","error":"$undefined","errorStyles":"$undefined","errorScripts":"$undefined","template":["$","$L5",null,{}],"templateStyles":"$undefined","templateScripts":"$undefined","notFound":"$undefined","forbidden":"$undefined","unauthorized":"$undefined"}]]}],{"children":["dropdown",["$","$1","c",{"children":[null,["$","$L4",null,{"parallelRouterKey":"children","error":"$undefined","errorStyles":"$undefined","errorScripts":"$undefined","template":["$","$L5",null,{}],"templateStyles":"$undefined","templateScripts":"$undefined","notFound":"$undefined","forbidden":"$undefined","unauthorized":"$undefined"}]]}],{"children":["__PAGE__",["$","$1","c",{"children":[[["$","h1",null,{"children":"Dropdown"}],"\n",["$","p",null,{"children":["It's required to use ",["$","code",null,{"children":"id"}]," on dropdown a toogle button for it to work. ",["$","code",null,{"children":"id"}]," of dropdown should follow pattern ",["$","code",null,{"children":"dropdown-<name>"}],"\nand for toggle buttons ",["$","code",null,{"children":"id"}]," pattern ",["$","code",null,{"children":"btn-<name>"}]," should be used."]}],"\n",["$","div",null,{"className":"section","children":["$","div",null,{"className":"container","ref":"$undefined","children":["$","$L6",null,{"id":"1","hasSpacing":false,"button":{"iconName":"menu-arrow","children":"Dropdown","iconPosition":"right"},"children":[["$","a",null,{"tabIndex":0,"href":"#","className":"dropdown__item","aria-disabled":"$undefined","children":"Laborum laboris amet minim."}],["$","a",null,{"tabIndex":-1,"href":"#","className":"dropdown__item disabled","aria-disabled":true,"children":"Quis adipisicing eu consectetur."}],["$","div",null,{"className":"dropdown__divider"}],["$","a",null,{"tabIndex":0,"href":"#","className":"dropdown__item","aria-disabled":"$undefined","children":"Deserunt id consectetur esse in."}]]}]}]}],"\n",["$","div",null,{"className":"section bg-black","children":["$","div",null,{"className":"container","ref":"$undefined","children":["$","$L6",null,{"id":"11","hasSpacing":false,"button":{"iconName":"menu-arrow","children":"Dropdown","iconPosition":"right"},"children":[["$","a",null,{"tabIndex":0,"href":"#","className":"dropdown__item","aria-disabled":"$undefined","children":"Laborum laboris amet minim."}],["$","a",null,{"tabIndex":-1,"href":"#","className":"dropdown__item disabled","aria-disabled":true,"children":"Quis adipisicing eu consectetur."}],["$","div",null,{"className":"dropdown__divider"}],["$","a",null,{"tabIndex":0,"href":"#","className":"dropdown__item","aria-disabled":"$undefined","children":"Deserunt id consectetur esse in."}]]}]}]}],"\n",["$","h2",null,{"children":"Dropdown Interactive"}],"\n",["$","p",null,{"children":["Dropdown menu with Interactive functionality eg. forms, buttons etc. should not close after click inside of dropdown component. This can be achieved with attribute ",["$","code",null,{"children":"[data-dropdown-interactive]"}],"."]}],"\n",["$","div",null,{"className":"section","children":["$","div",null,{"className":"container","ref":"$undefined","children":["$","$L6",null,{"id":"2","hasSpacing":false,"isInteractive":true,"button":{"iconName":"menu-arrow","children":"Dropdown","iconPosition":"right"},"children":[["$","a",null,{"tabIndex":0,"href":"#","className":"dropdown__item","aria-disabled":"$undefined","children":"Laborum laboris amet minim."}],["$","a",null,{"tabIndex":-1,"href":"#","className":"dropdown__item disabled","aria-disabled":true,"children":"Quis adipisicing eu consectetur."}],["$","div",null,{"className":"dropdown__divider"}],["$","a",null,{"tabIndex":0,"href":"#","className":"dropdown__item","aria-disabled":"$undefined","children":"Deserunt id consectetur esse in."}]]}]}]}],"\n",["$","div",null,{"className":"section bg-black","children":["$","div",null,{"className":"container","ref":"$undefined","children":["$","$L6",null,{"id":"22","hasSpacing":false,"isInteractive":true,"button":{"iconName":"menu-arrow","children":"Dropdown","iconPosition":"right"},"children":[["$","a",null,{"tabIndex":0,"href":"#","className":"dropdown__item","aria-disabled":"$undefined","children":"Laborum laboris amet minim."}],["$","a",null,{"tabIndex":-1,"href":"#","className":"dropdown__item disabled","aria-disabled":true,"children":"Quis adipisicing eu consectetur."}],["$","div",null,{"className":"dropdown__divider"}],["$","a",null,{"tabIndex":0,"href":"#","className":"dropdown__item","aria-disabled":"$undefined","children":"Deserunt id consectetur esse in."}]]}]}]}],"\n",["$","h2",null,{"children":"Focus Trap"}],"\n",["$","p",null,{"children":["Prevents user from leaving the Dropdown using keyboard without closing the Dropdown. Can be achieved with attribute ",["$","code",null,{"children":"[data-dropdown-focus-trap]"}],". In this case Dropdown can be\nclose by using ",["$","code",null,{"children":"Escape"}]," key, but it's also recommended to use close button. Close buttons ",["$","code",null,{"children":"id"}]," needs to follow pattern ",["$","code",null,{"children":"close-btn-<name>"}]," for it to work."]}],"\n",["$","div",null,{"className":"section","children":["$","div",null,{"className":"container","ref":"$undefined","children":["$","$L6",null,{"id":"3","hasFocusTrap":true,"isInteractive":true,"button":{"iconName":"menu-arrow","children":"With focus trap","iconPosition":"right"},"children":["$","select",null,{"id":"select-in-dropdown","name":"select-in-dropdown","className":"select","disabled":"$undefined","ref":"$undefined","style":{"width":"100px"},"children":[[],[["$","option",null,{"children":"Item 1"}],["$","option",null,{"children":"Item 2"}]]]}]}]}]}],"\n",["$","div",null,{"className":"section bg-black","children":["$","div",null,{"className":"container","ref":"$undefined","children":["$","$L6",null,{"id":"33","hasFocusTrap":true,"isInteractive":true,"button":{"iconName":"menu-arrow","children":"With focus trap","iconPosition":"right"},"children":["$","select",null,{"id":"select-in-dropdown","name":"select-in-dropdown","className":"select","disabled":"$undefined","ref":"$undefined","style":{"width":"100px"},"children":[[],[["$","option",null,{"children":"Item 1"}],["$","option",null,{"children":"Item 2"}]]]}]}]}]}],"\n",["$","h2",null,{"children":"Position"}],"\n",["$","p",null,{"children":"Dropdown can be aligned to left, right or center side of toggle button."}],"\n",["$","div",null,{"className":"section","children":["$","div",null,{"className":"container","ref":"$undefined","children":["$","div",null,{"className":"grid","ref":"$undefined","children":[["$","div",null,{"className":"grid__col grid__col--md-4","children":["$","$L6",null,{"isInteractive":true,"id":"4","button":{"children":"Aligned to left"},"children":["$","p",null,{"children":"Told ya I'm aligned to left..."}]}]}],["$","div",null,{"className":"grid__col grid__col--md-4","children":["$","$L6",null,{"isInteractive":true,"id":"5","placement":"center","button":{"children":"Aligned to center"},"children":["$","p",null,{"children":"Told ya I'm aligned to center..."}]}]}],["$","div",null,{"className":"grid__col grid__col--md-4","children":["$","$L6",null,{"isInteractive":true,"id":"6","placement":"right","button":{"children":"Aligned to right"},"children":["$","p",null,{"children":"Told ya I'm aligned to right..."}]}]}]]}]}]}],"\n",["$","div",null,{"className":"section bg-black","children":["$","div",null,{"className":"container","ref":"$undefined","children":["$","div",null,{"className":"grid","ref":"$undefined","children":[["$","div",null,{"className":"grid__col grid__col--md-4","children":["$","$L6",null,{"isInteractive":true,"id":"44","button":{"children":"Aligned to left"},"children":["$","p",null,{"children":"Told ya I'm aligned to left..."}]}]}],["$","div",null,{"className":"grid__col grid__col--md-4","children":["$","$L6",null,{"isInteractive":true,"id":"55","placement":"center","button":{"children":"Aligned to center"},"children":["$","p",null,{"children":"Told ya I'm aligned to center..."}]}]}],["$","div",null,{"className":"grid__col grid__col--md-4","children":["$","$L6",null,{"isInteractive":true,"id":"66","placement":"right","button":{"children":"Aligned to right"},"children":["$","p",null,{"children":"Told ya I'm aligned to right..."}]}]}]]}]}]}]],[["$","link","0",{"rel":"stylesheet","href":"/_next/static/css/77590e66868bf291.css","precedence":"next","crossOrigin":"$undefined","nonce":"$undefined"}],["$","link","1",{"rel":"stylesheet","href":"/_next/static/css/0e5de495ff48931f.css","precedence":"next","crossOrigin":"$undefined","nonce":"$undefined"}],["$","link","2",{"rel":"stylesheet","href":"/_next/static/css/b853a4f8d045643a.css","precedence":"next","crossOrigin":"$undefined","nonce":"$undefined"}],["$","link","3",{"rel":"stylesheet","href":"/_next/static/css/ef46db3751d8e999.css","precedence":"next","crossOrigin":"$undefined","nonce":"$undefined"}],["$","link","4",{"rel":"stylesheet","href":"/_next/static/css/7202aa220abab0eb.css","precedence":"next","crossOrigin":"$undefined","nonce":"$undefined"}],["$","link","5",{"rel":"stylesheet","href":"/_next/static/css/7d4c59347b15c45f.css","precedence":"next","crossOrigin":"$undefined","nonce":"$undefined"}],["$","link","6",{"rel":"stylesheet","href":"/_next/static/css/7108a96a607fe7c5.css","precedence":"next","crossOrigin":"$undefined","nonce":"$undefined"}],["$","link","7",{"rel":"stylesheet","href":"/_next/static/css/ac1d2e9b77b16926.css","precedence":"next","crossOrigin":"$undefined","nonce":"$undefined"}],["$","link","8",{"rel":"stylesheet","href":"/_next/static/css/a88042aa83a2c354.css","precedence":"next","crossOrigin":"$undefined","nonce":"$undefined"}],["$","link","9",{"rel":"stylesheet","href":"/_next/static/css/57b0c84bbf7d7098.css","precedence":"next","crossOrigin":"$undefined","nonce":"$undefined"}],["$","link","10",{"rel":"stylesheet","href":"/_next/static/css/8ed102a331809889.css","precedence":"next","crossOrigin":"$undefined","nonce":"$undefined"}]],["$","$L7",null,{"children":["$L8","$L9",["$","$La",null,{"promise":"$@b"}]]}]]}],{},null,false]},null,false]},null,false]},null,false],["$","$1","h",{"children":[null,["$","$1","8yWU96kzlxyMArVDMELpgv",{"children":[["$","$Lc",null,{"children":"$Ld"}],["$","meta",null,{"name":"next-size-adjust","content":""}]]}],["$","$Le",null,{"children":"$Lf"}]]}],false]],"m":"$undefined","G":["$10","$undefined"],"s":false,"S":true}
+11:"$Sreact.suspense"
+12:I[4911,[],"AsyncMetadata"]
+f:["$","div",null,{"hidden":true,"children":["$","$11",null,{"fallback":null,"children":["$","$L12",null,{"promise":"$@13"}]}]}]
+9:null
+d:[["$","meta","0",{"charSet":"utf-8"}],["$","meta","1",{"name":"viewport","content":"width=device-width, initial-scale=1"}]]
+8:null
+b:{"metadata":[],"error":null,"digest":"$undefined"}
+13:{"metadata":"$b:metadata","error":null,"digest":"$undefined"}

package/build/components/expander.html ADDED Viewed

@@ -0,0 +1 @@

package/build/components/expander.txt ADDED Viewed

@@ -0,0 +1,27 @@
+1:"$Sreact.fragment"
+2:I[3640,["7177","static/chunks/app/layout-41aa6f28da614a69.js"],"default"]
+3:I[5085,["7177","static/chunks/app/layout-41aa6f28da614a69.js"],"SpritePathProvider"]
+4:I[7555,[],""]
+5:I[1295,[],""]
+6:I[4636,["5671","static/chunks/app/components/expander/page-37e9fdf98c038541.js"],"default"]
+7:I[9665,[],"OutletBoundary"]
+a:I[4911,[],"AsyncMetadataOutlet"]
+c:I[9665,[],"ViewportBoundary"]
+e:I[9665,[],"MetadataBoundary"]
+10:I[6614,[],""]
+:HL["/_next/static/media/671791babd225be4-s.p.woff2","font",{"crossOrigin":"","type":"font/woff2"}]
+:HL["/_next/static/media/c62d990acddde5f0-s.p.woff2","font",{"crossOrigin":"","type":"font/woff2"}]
+:HL["/_next/static/media/dfdbb1c4973e0bd7-s.p.woff2","font",{"crossOrigin":"","type":"font/woff2"}]
+:HL["/_next/static/css/2cb6b1436172662a.css","style"]
+:HL["/_next/static/css/ee49dfd49ae395ac.css","style"]
+:HL["/_next/static/css/ac1d2e9b77b16926.css","style"]
+:HL["/_next/static/css/0e5de495ff48931f.css","style"]
+0:{"P":null,"b":"BGy4QLZfZPwswIZT7YGE2","p":"","c":["","components","expander"],"i":false,"f":[[["",{"children":["components",{"children":["expander",{"children":["__PAGE__",{}]}]}]},"$undefined","$undefined",true],["",["$","$1","c",{"children":[[["$","link","0",{"rel":"stylesheet","href":"/_next/static/css/2cb6b1436172662a.css","precedence":"next","crossOrigin":"$undefined","nonce":"$undefined"}],["$","link","1",{"rel":"stylesheet","href":"/_next/static/css/ee49dfd49ae395ac.css","precedence":"next","crossOrigin":"$undefined","nonce":"$undefined"}]],["$","html",null,{"lang":"en","className":"__className_df92c2","children":["$","body",null,{"children":[["$","$L2",null,{}],["$","div",null,{"id":"root","children":["$","$L3",null,{"children":["$","$L4",null,{"parallelRouterKey":"children","error":"$undefined","errorStyles":"$undefined","errorScripts":"$undefined","template":["$","$L5",null,{}],"templateStyles":"$undefined","templateScripts":"$undefined","notFound":[[["$","title",null,{"children":"404: This page could not be found."}],["$","div",null,{"style":{"fontFamily":"system-ui,\"Segoe UI\",Roboto,Helvetica,Arial,sans-serif,\"Apple Color Emoji\",\"Segoe UI Emoji\"","height":"100vh","textAlign":"center","display":"flex","flexDirection":"column","alignItems":"center","justifyContent":"center"},"children":["$","div",null,{"children":[["$","style",null,{"dangerouslySetInnerHTML":{"__html":"body{color:#000;background:#fff;margin:0}.next-error-h1{border-right:1px solid rgba(0,0,0,.3)}@media (prefers-color-scheme:dark){body{color:#fff;background:#000}.next-error-h1{border-right:1px solid rgba(255,255,255,.3)}}"}}],["$","h1",null,{"className":"next-error-h1","style":{"display":"inline-block","margin":"0 20px 0 0","padding":"0 23px 0 0","fontSize":24,"fontWeight":500,"verticalAlign":"top","lineHeight":"49px"},"children":404}],["$","div",null,{"style":{"display":"inline-block"},"children":["$","h2",null,{"style":{"fontSize":14,"fontWeight":400,"lineHeight":"49px","margin":0},"children":"This page could not be found."}]}]]}]}]],[]],"forbidden":"$undefined","unauthorized":"$undefined"}]}]}],["$","div",null,{"id":"root-modals"}],["$","div",null,{"id":"root-dropdowns"}],["$","div",null,{"id":"root-tooltips"}]]}]}]]}],{"children":["components",["$","$1","c",{"children":[null,["$","$L4",null,{"parallelRouterKey":"children","error":"$undefined","errorStyles":"$undefined","errorScripts":"$undefined","template":["$","$L5",null,{}],"templateStyles":"$undefined","templateScripts":"$undefined","notFound":"$undefined","forbidden":"$undefined","unauthorized":"$undefined"}]]}],{"children":["expander",["$","$1","c",{"children":[null,["$","$L4",null,{"parallelRouterKey":"children","error":"$undefined","errorStyles":"$undefined","errorScripts":"$undefined","template":["$","$L5",null,{}],"templateStyles":"$undefined","templateScripts":"$undefined","notFound":"$undefined","forbidden":"$undefined","unauthorized":"$undefined"}]]}],{"children":["__PAGE__",["$","$1","c",{"children":[["$","$L6",null,{}],[["$","link","0",{"rel":"stylesheet","href":"/_next/static/css/ac1d2e9b77b16926.css","precedence":"next","crossOrigin":"$undefined","nonce":"$undefined"}],["$","link","1",{"rel":"stylesheet","href":"/_next/static/css/0e5de495ff48931f.css","precedence":"next","crossOrigin":"$undefined","nonce":"$undefined"}]],["$","$L7",null,{"children":["$L8","$L9",["$","$La",null,{"promise":"$@b"}]]}]]}],{},null,false]},null,false]},null,false]},null,false],["$","$1","h",{"children":[null,["$","$1","OJTu8Olg99M8AQ7ZOgrKtv",{"children":[["$","$Lc",null,{"children":"$Ld"}],["$","meta",null,{"name":"next-size-adjust","content":""}]]}],["$","$Le",null,{"children":"$Lf"}]]}],false]],"m":"$undefined","G":["$10","$undefined"],"s":false,"S":true}
+11:"$Sreact.suspense"
+12:I[4911,[],"AsyncMetadata"]
+f:["$","div",null,{"hidden":true,"children":["$","$11",null,{"fallback":null,"children":["$","$L12",null,{"promise":"$@13"}]}]}]
+9:null
+d:[["$","meta","0",{"charSet":"utf-8"}],["$","meta","1",{"name":"viewport","content":"width=device-width, initial-scale=1"}]]
+8:null
+b:{"metadata":[],"error":null,"digest":"$undefined"}
+13:{"metadata":"$b:metadata","error":null,"digest":"$undefined"}

package/build/components/feature-accordion.html ADDED Viewed

@@ -0,0 +1 @@

+ <!DOCTYPE html><html lang="en" class="__className_df92c2"><head><meta charSet="utf-8"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="preload" href="/_next/static/media/671791babd225be4-s.p.woff2" as="font" crossorigin="" type="font/woff2"/><link rel="preload" href="/_next/static/media/c62d990acddde5f0-s.p.woff2" as="font" crossorigin="" type="font/woff2"/><link rel="preload" href="/_next/static/media/dfdbb1c4973e0bd7-s.p.woff2" as="font" crossorigin="" type="font/woff2"/><link rel="preload" as="image" href="https://picsum.photos/seed/1/400/300"/><link rel="preload" as="image" href="https://picsum.photos/seed/2/400/300"/><link rel="preload" as="image" href="https://picsum.photos/seed/3/400/300"/><link rel="stylesheet" href="/_next/static/css/2cb6b1436172662a.css" data-precedence="next"/><link rel="stylesheet" href="/_next/static/css/ee49dfd49ae395ac.css" data-precedence="next"/><link rel="stylesheet" href="/_next/static/css/ef46db3751d8e999.css" data-precedence="next"/><link rel="stylesheet" href="/_next/static/css/75e15d3944ffd4f3.css" data-precedence="next"/><link rel="stylesheet" href="/_next/static/css/0e5de495ff48931f.css" data-precedence="next"/><link rel="stylesheet" href="/_next/static/css/b853a4f8d045643a.css" data-precedence="next"/><link rel="stylesheet" href="/_next/static/css/57b0c84bbf7d7098.css" data-precedence="next"/><link rel="stylesheet" href="/_next/static/css/ac1d2e9b77b16926.css" data-precedence="next"/><link rel="preload" as="script" fetchPriority="low" href="/_next/static/chunks/webpack-1a128887cf981885.js"/><script src="/_next/static/chunks/4bd1b696-63246a30a5dafad8.js" async=""></script><script src="/_next/static/chunks/1684-f3cca2440b2d04c9.js" async=""></script><script src="/_next/static/chunks/main-app-a265e200b32683f1.js" async=""></script><script src="/_next/static/chunks/app/layout-41aa6f28da614a69.js" async=""></script><script src="/_next/static/chunks/1856-87fba6dedcfa51f4.js" async=""></script><script src="/_next/static/chunks/5426-60b8df37a33e8cf3.js" async=""></script><script src="/_next/static/chunks/app/components/feature-accordion/page-994e106b83948b2a.js" async=""></script><meta name="next-size-adjust" content=""/><script>document.querySelectorAll('body link[rel="icon"], body link[rel="apple-touch-icon"]').forEach(el => document.head.appendChild(el))</script><script src="/_next/static/chunks/polyfills-42372ed130431b0a.js" noModule=""></script></head><body><div hidden=""></div><div id="root"><div class="section"><div class="container"><div class="grid feature-accordion" data-feature-accordion="true"><div class="grid__col grid__col--12 grid__col--md-6 feature-accordion__accordion"><ul class="accordion" data-accordion="true"><li class="accordion__item feature-accordion__item"><h3 class="accordion__header"><button type="button" class="accordion__button" aria-controls="item-1-section" id="item-1" data-accordion-toggle="true" data-feature-accordion-item="true" data-image-url="https://picsum.photos/seed/1/400/300" data-image-alt="Feature Accordion 1"><span class="accordion__title">OPPO Reno12 séria s AI</span><svg class="icon icon--medium accordion__icon" aria-hidden="true"><use xlink:href="/sprite.svg#chevron-down"></use></svg></button></h3><div id="item-1-section" aria-labelledby="item-1" class="accordion__body" hidden=""><div class="feature-accordion__content"><h3>S 3-ročnou zárukou a výmenou rozbitého displeja</h3><button type="button" class="btn btn--fill">Chcem ho</button></div><div class="feature-accordion__preview hide-md"><img class="img feature-accordion__image--mobile" src="https://picsum.photos/seed/1/400/300" alt="Feature Accordion 1" data-feature-accordion-image="true" data-feature-accordion-image-for="item-1"/></div></div></li><li class="accordion__item feature-accordion__item"><h3 class="accordion__header"><button type="button" class="accordion__button" aria-controls="item-2-section" id="item-2" data-accordion-toggle="true" data-feature-accordion-item="true" data-image-url="https://picsum.photos/seed/2/400/300" data-image-alt="Feature Accordion 2"><span class="accordion__title">Samsung Galaxy S24</span><svg class="icon icon--medium accordion__icon" aria-hidden="true"><use xlink:href="/sprite.svg#chevron-down"></use></svg></button></h3><div id="item-2-section" aria-labelledby="item-2" class="accordion__body" hidden=""><div class="feature-accordion__content"><h3>S 3-ročnou zárukou a výmenou rozbitého displeja</h3><button type="button" class="btn btn--fill">Chcem ho</button></div><div class="feature-accordion__preview hide-md"><img class="img feature-accordion__image--mobile" src="https://picsum.photos/seed/2/400/300" alt="Feature Accordion 2" data-feature-accordion-image="true" data-feature-accordion-image-for="item-2"/></div></div></li><li class="accordion__item feature-accordion__item"><h3 class="accordion__header"><button type="button" class="accordion__button" aria-controls="item-3-section" id="item-3" data-accordion-toggle="true" data-feature-accordion-item="true" data-image-url="https://picsum.photos/seed/3/400/300" data-image-alt="Feature Accordion 3"><span class="accordion__title">Apple iPhone 15</span><svg class="icon icon--medium accordion__icon" aria-hidden="true"><use xlink:href="/sprite.svg#chevron-down"></use></svg></button></h3><div id="item-3-section" aria-labelledby="item-3" class="accordion__body" hidden=""><div class="feature-accordion__content"><h3>S 3-ročnou zárukou a výmenou rozbitého displeja</h3><button type="button" class="btn btn--fill">Chcem ho</button></div><div class="feature-accordion__preview hide-md"><img class="img feature-accordion__image--mobile" src="https://picsum.photos/seed/3/400/300" alt="Feature Accordion 3" data-feature-accordion-image="true" data-feature-accordion-image-for="item-3"/></div></div></li></ul></div><div class="grid__col grid__col--12 grid__col--md-6 feature-accordion__preview hide show-md"><img class="img hide" src="https://picsum.photos/seed/1/400/300" alt="Feature Accordion 1" data-feature-accordion-image="true" data-feature-accordion-image-for="item-1"/><img class="img hide" src="https://picsum.photos/seed/2/400/300" alt="Feature Accordion 2" data-feature-accordion-image="true" data-feature-accordion-image-for="item-2"/><img class="img hide" src="https://picsum.photos/seed/3/400/300" alt="Feature Accordion 3" data-feature-accordion-image="true" data-feature-accordion-image-for="item-3"/></div></div></div></div><div class="section bg-black"><div class="container"><div class="grid feature-accordion" data-feature-accordion="true"><div class="grid__col grid__col--12 grid__col--md-6 feature-accordion__accordion"><ul class="accordion" data-accordion="true"><li class="accordion__item feature-accordion__item"><h3 class="accordion__header"><button type="button" class="accordion__button" aria-controls="item-4-section" id="item-4" data-accordion-toggle="true" data-feature-accordion-item="true" data-image-url="https://picsum.photos/seed/1/400/300" data-image-alt="Feature Accordion 1"><span class="accordion__title">OPPO Reno12 séria s AI</span><svg class="icon icon--medium accordion__icon" aria-hidden="true"><use xlink:href="/sprite.svg#chevron-down"></use></svg></button></h3><div id="item-4-section" aria-labelledby="item-4" class="accordion__body" hidden=""><div class="feature-accordion__content"><h3>S 3-ročnou zárukou a výmenou rozbitého displeja</h3><button type="button" class="btn btn--fill">Chcem ho</button></div><div class="feature-accordion__preview hide-md"><img class="img feature-accordion__image--mobile" src="https://picsum.photos/seed/1/400/300" alt="Feature Accordion 1" data-feature-accordion-image="true" data-feature-accordion-image-for="item-4"/></div></div></li><li class="accordion__item feature-accordion__item"><h3 class="accordion__header"><button type="button" class="accordion__button" aria-controls="item-5-section" id="item-5" data-accordion-toggle="true" data-feature-accordion-item="true" data-image-url="https://picsum.photos/seed/2/400/300" data-image-alt="Feature Accordion 2"><span class="accordion__title">Samsung Galaxy S24</span><svg class="icon icon--medium accordion__icon" aria-hidden="true"><use xlink:href="/sprite.svg#chevron-down"></use></svg></button></h3><div id="item-5-section" aria-labelledby="item-5" class="accordion__body" hidden=""><div class="feature-accordion__content"><h3>S 3-ročnou zárukou a výmenou rozbitého displeja</h3><button type="button" class="btn btn--fill">Chcem ho</button></div><div class="feature-accordion__preview hide-md"><img class="img feature-accordion__image--mobile" src="https://picsum.photos/seed/2/400/300" alt="Feature Accordion 2" data-feature-accordion-image="true" data-feature-accordion-image-for="item-5"/></div></div></li><li class="accordion__item feature-accordion__item"><h3 class="accordion__header"><button type="button" class="accordion__button" aria-controls="item-6-section" id="item-6" data-accordion-toggle="true" data-feature-accordion-item="true" data-image-url="https://picsum.photos/seed/3/400/300" data-image-alt="Feature Accordion 3"><span class="accordion__title">Apple iPhone 15</span><svg class="icon icon--medium accordion__icon" aria-hidden="true"><use xlink:href="/sprite.svg#chevron-down"></use></svg></button></h3><div id="item-6-section" aria-labelledby="item-6" class="accordion__body" hidden=""><div class="feature-accordion__content"><h3>S 3-ročnou zárukou a výmenou rozbitého displeja</h3><button type="button" class="btn btn--fill">Chcem ho</button></div><div class="feature-accordion__preview hide-md"><img class="img feature-accordion__image--mobile" src="https://picsum.photos/seed/3/400/300" alt="Feature Accordion 3" data-feature-accordion-image="true" data-feature-accordion-image-for="item-6"/></div></div></li></ul></div><div class="grid__col grid__col--12 grid__col--md-6 feature-accordion__preview hide show-md"><img class="img hide" src="https://picsum.photos/seed/1/400/300" alt="Feature Accordion 1" data-feature-accordion-image="true" data-feature-accordion-image-for="item-4"/><img class="img hide" src="https://picsum.photos/seed/2/400/300" alt="Feature Accordion 2" data-feature-accordion-image="true" data-feature-accordion-image-for="item-5"/><img class="img hide" src="https://picsum.photos/seed/3/400/300" alt="Feature Accordion 3" data-feature-accordion-image="true" data-feature-accordion-image-for="item-6"/></div></div></div></div><div class="section bg-gray"><div class="container"><div class="grid feature-accordion is-white" data-feature-accordion="true"><div class="grid__col grid__col--12 grid__col--md-6 feature-accordion__accordion"><ul class="accordion" data-accordion="true"><li class="accordion__item feature-accordion__item"><h3 class="accordion__header"><button type="button" class="accordion__button" aria-controls="item-4-section" id="item-4" data-accordion-toggle="true" data-feature-accordion-item="true" data-image-url="https://picsum.photos/seed/1/400/300" data-image-alt="Feature Accordion 1"><span class="accordion__title">OPPO Reno12 séria s AI</span><svg class="icon icon--medium accordion__icon" aria-hidden="true"><use xlink:href="/sprite.svg#chevron-down"></use></svg></button></h3><div id="item-4-section" aria-labelledby="item-4" class="accordion__body" hidden=""><div class="feature-accordion__content"><h3>S 3-ročnou zárukou a výmenou rozbitého displeja</h3><button type="button" class="btn btn--fill">Chcem ho</button></div><div class="feature-accordion__preview hide-md"><img class="img feature-accordion__image--mobile" src="https://picsum.photos/seed/1/400/300" alt="Feature Accordion 1" data-feature-accordion-image="true" data-feature-accordion-image-for="item-4"/></div></div></li><li class="accordion__item feature-accordion__item"><h3 class="accordion__header"><button type="button" class="accordion__button" aria-controls="item-5-section" id="item-5" data-accordion-toggle="true" data-feature-accordion-item="true" data-image-url="https://picsum.photos/seed/2/400/300" data-image-alt="Feature Accordion 2"><span class="accordion__title">Samsung Galaxy S24</span><svg class="icon icon--medium accordion__icon" aria-hidden="true"><use xlink:href="/sprite.svg#chevron-down"></use></svg></button></h3><div id="item-5-section" aria-labelledby="item-5" class="accordion__body" hidden=""><div class="feature-accordion__content"><h3>S 3-ročnou zárukou a výmenou rozbitého displeja</h3><button type="button" class="btn btn--fill">Chcem ho</button></div><div class="feature-accordion__preview hide-md"><img class="img feature-accordion__image--mobile" src="https://picsum.photos/seed/2/400/300" alt="Feature Accordion 2" data-feature-accordion-image="true" data-feature-accordion-image-for="item-5"/></div></div></li><li class="accordion__item feature-accordion__item"><h3 class="accordion__header"><button type="button" class="accordion__button" aria-controls="item-6-section" id="item-6" data-accordion-toggle="true" data-feature-accordion-item="true" data-image-url="https://picsum.photos/seed/3/400/300" data-image-alt="Feature Accordion 3"><span class="accordion__title">Apple iPhone 15</span><svg class="icon icon--medium accordion__icon" aria-hidden="true"><use xlink:href="/sprite.svg#chevron-down"></use></svg></button></h3><div id="item-6-section" aria-labelledby="item-6" class="accordion__body" hidden=""><div class="feature-accordion__content"><h3>S 3-ročnou zárukou a výmenou rozbitého displeja</h3><button type="button" class="btn btn--fill">Chcem ho</button></div><div class="feature-accordion__preview hide-md"><img class="img feature-accordion__image--mobile" src="https://picsum.photos/seed/3/400/300" alt="Feature Accordion 3" data-feature-accordion-image="true" data-feature-accordion-image-for="item-6"/></div></div></li></ul></div><div class="grid__col grid__col--12 grid__col--md-6 feature-accordion__preview hide show-md"><img class="img hide" src="https://picsum.photos/seed/1/400/300" alt="Feature Accordion 1" data-feature-accordion-image="true" data-feature-accordion-image-for="item-4"/><img class="img hide" src="https://picsum.photos/seed/2/400/300" alt="Feature Accordion 2" data-feature-accordion-image="true" data-feature-accordion-image-for="item-5"/><img class="img hide" src="https://picsum.photos/seed/3/400/300" alt="Feature Accordion 3" data-feature-accordion-image="true" data-feature-accordion-image-for="item-6"/></div></div></div></div></div><div id="root-modals"></div><div id="root-dropdowns"></div><div id="root-tooltips"></div><script src="/_next/static/chunks/webpack-1a128887cf981885.js" async=""></script><script>(self.__next_f=self.__next_f||[]).push([0])</script><script>self.__next_f.push([1,"1:\"$Sreact.fragment\"\n2:I[3640,[\"7177\",\"static/chunks/app/layout-41aa6f28da614a69.js\"],\"default\"]\n3:I[5085,[\"7177\",\"static/chunks/app/layout-41aa6f28da614a69.js\"],\"SpritePathProvider\"]\n4:I[7555,[],\"\"]\n5:I[1295,[],\"\"]\n6:I[4082,[\"1856\",\"static/chunks/1856-87fba6dedcfa51f4.js\",\"5426\",\"static/chunks/5426-60b8df37a33e8cf3.js\",\"4881\",\"static/chunks/app/components/feature-accordion/page-994e106b83948b2a.js\"],\"FeatureAccordionClientWrapper\"]\n7:I[9665,[],\"OutletBoundary\"]\na:I[4911,[],\"AsyncMetadataOutlet\"]\nc:I[9665,[],\"ViewportBoundary\"]\ne:I[9665,[],\"MetadataBoundary\"]\n10:I[6614,[],\"\"]\n:HL[\"/_next/static/media/671791babd225be4-s.p.woff2\",\"font\",{\"crossOrigin\":\"\",\"type\":\"font/woff2\"}]\n:HL[\"/_next/static/media/c62d990acddde5f0-s.p.woff2\",\"font\",{\"crossOrigin\":\"\",\"type\":\"font/woff2\"}]\n:HL[\"/_next/static/media/dfdbb1c4973e0bd7-s.p.woff2\",\"font\",{\"crossOrigin\":\"\",\"type\":\"font/woff2\"}]\n:HL[\"/_next/static/css/2cb6b1436172662a.css\",\"style\"]\n:HL[\"/_next/static/css/ee49dfd49ae395ac.css\",\"style\"]\n:HL[\"/_next/static/css/ef46db3751d8e999.css\",\"style\"]\n:HL[\"/_next/static/css/75e15d3944ffd4f3.css\",\"style\"]\n:HL[\"/_next/static/css/0e5de495ff48931f.css\",\"style\"]\n:HL[\"/_next/static/css/b853a4f8d045643a.css\",\"style\"]\n:HL[\"/_next/static/css/57b0c84bbf7d7098.css\",\"style\"]\n:HL[\"/_next/static/css/ac1d2e9b77b16926.css\",\"style\"]\n"])</script><script>self.__next_f.push([1,"0:{\"P\":null,\"b\":\"BGy4QLZfZPwswIZT7YGE2\",\"p\":\"\",\"c\":[\"\",\"components\",\"feature-accordion\"],\"i\":false,\"f\":[[[\"\",{\"children\":[\"components\",{\"children\":[\"feature-accordion\",{\"children\":[\"__PAGE__\",{}]}]}]},\"$undefined\",\"$undefined\",true],[\"\",[\"$\",\"$1\",\"c\",{\"children\":[[[\"$\",\"link\",\"0\",{\"rel\":\"stylesheet\",\"href\":\"/_next/static/css/2cb6b1436172662a.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\",\"nonce\":\"$undefined\"}],[\"$\",\"link\",\"1\",{\"rel\":\"stylesheet\",\"href\":\"/_next/static/css/ee49dfd49ae395ac.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\",\"nonce\":\"$undefined\"}]],[\"$\",\"html\",null,{\"lang\":\"en\",\"className\":\"__className_df92c2\",\"children\":[\"$\",\"body\",null,{\"children\":[[\"$\",\"$L2\",null,{}],[\"$\",\"div\",null,{\"id\":\"root\",\"children\":[\"$\",\"$L3\",null,{\"children\":[\"$\",\"$L4\",null,{\"parallelRouterKey\":\"children\",\"error\":\"$undefined\",\"errorStyles\":\"$undefined\",\"errorScripts\":\"$undefined\",\"template\":[\"$\",\"$L5\",null,{}],\"templateStyles\":\"$undefined\",\"templateScripts\":\"$undefined\",\"notFound\":[[[\"$\",\"title\",null,{\"children\":\"404: This page could not be found.\"}],[\"$\",\"div\",null,{\"style\":{\"fontFamily\":\"system-ui,\\\"Segoe UI\\\",Roboto,Helvetica,Arial,sans-serif,\\\"Apple Color Emoji\\\",\\\"Segoe UI Emoji\\\"\",\"height\":\"100vh\",\"textAlign\":\"center\",\"display\":\"flex\",\"flexDirection\":\"column\",\"alignItems\":\"center\",\"justifyContent\":\"center\"},\"children\":[\"$\",\"div\",null,{\"children\":[[\"$\",\"style\",null,{\"dangerouslySetInnerHTML\":{\"__html\":\"body{color:#000;background:#fff;margin:0}.next-error-h1{border-right:1px solid rgba(0,0,0,.3)}@media (prefers-color-scheme:dark){body{color:#fff;background:#000}.next-error-h1{border-right:1px solid rgba(255,255,255,.3)}}\"}}],[\"$\",\"h1\",null,{\"className\":\"next-error-h1\",\"style\":{\"display\":\"inline-block\",\"margin\":\"0 20px 0 0\",\"padding\":\"0 23px 0 0\",\"fontSize\":24,\"fontWeight\":500,\"verticalAlign\":\"top\",\"lineHeight\":\"49px\"},\"children\":404}],[\"$\",\"div\",null,{\"style\":{\"display\":\"inline-block\"},\"children\":[\"$\",\"h2\",null,{\"style\":{\"fontSize\":14,\"fontWeight\":400,\"lineHeight\":\"49px\",\"margin\":0},\"children\":\"This page could not be found.\"}]}]]}]}]],[]],\"forbidden\":\"$undefined\",\"unauthorized\":\"$undefined\"}]}]}],[\"$\",\"div\",null,{\"id\":\"root-modals\"}],[\"$\",\"div\",null,{\"id\":\"root-dropdowns\"}],[\"$\",\"div\",null,{\"id\":\"root-tooltips\"}]]}]}]]}],{\"children\":[\"components\",[\"$\",\"$1\",\"c\",{\"children\":[null,[\"$\",\"$L4\",null,{\"parallelRouterKey\":\"children\",\"error\":\"$undefined\",\"errorStyles\":\"$undefined\",\"errorScripts\":\"$undefined\",\"template\":[\"$\",\"$L5\",null,{}],\"templateStyles\":\"$undefined\",\"templateScripts\":\"$undefined\",\"notFound\":\"$undefined\",\"forbidden\":\"$undefined\",\"unauthorized\":\"$undefined\"}]]}],{\"children\":[\"feature-accordion\",[\"$\",\"$1\",\"c\",{\"children\":[null,[\"$\",\"$L4\",null,{\"parallelRouterKey\":\"children\",\"error\":\"$undefined\",\"errorStyles\":\"$undefined\",\"errorScripts\":\"$undefined\",\"template\":[\"$\",\"$L5\",null,{}],\"templateStyles\":\"$undefined\",\"templateScripts\":\"$undefined\",\"notFound\":\"$undefined\",\"forbidden\":\"$undefined\",\"unauthorized\":\"$undefined\"}]]}],{\"children\":[\"__PAGE__\",[\"$\",\"$1\",\"c\",{\"children\":[[\"$\",\"$L6\",null,{}],[[\"$\",\"link\",\"0\",{\"rel\":\"stylesheet\",\"href\":\"/_next/static/css/ef46db3751d8e999.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\",\"nonce\":\"$undefined\"}],[\"$\",\"link\",\"1\",{\"rel\":\"stylesheet\",\"href\":\"/_next/static/css/75e15d3944ffd4f3.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\",\"nonce\":\"$undefined\"}],[\"$\",\"link\",\"2\",{\"rel\":\"stylesheet\",\"href\":\"/_next/static/css/0e5de495ff48931f.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\",\"nonce\":\"$undefined\"}],[\"$\",\"link\",\"3\",{\"rel\":\"stylesheet\",\"href\":\"/_next/static/css/b853a4f8d045643a.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\",\"nonce\":\"$undefined\"}],[\"$\",\"link\",\"4\",{\"rel\":\"stylesheet\",\"href\":\"/_next/static/css/57b0c84bbf7d7098.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\",\"nonce\":\"$undefined\"}],[\"$\",\"link\",\"5\",{\"rel\":\"stylesheet\",\"href\":\"/_next/static/css/ac1d2e9b77b16926.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\",\"nonce\":\"$undefined\"}]],[\"$\",\"$L7\",null,{\"children\":[\"$L8\",\"$L9\",[\"$\",\"$La\",null,{\"promise\":\"$@b\"}]]}]]}],{},null,false]},null,false]},null,false]},null,false],[\"$\",\"$1\",\"h\",{\"children\":[null,[\"$\",\"$1\",\"Kl06H21KwUmEdgdV7-fZiv\",{\"children\":[[\"$\",\"$Lc\",null,{\"children\":\"$Ld\"}],[\"$\",\"meta\",null,{\"name\":\"next-size-adjust\",\"content\":\"\"}]]}],[\"$\",\"$Le\",null,{\"children\":\"$Lf\"}]]}],false]],\"m\":\"$undefined\",\"G\":[\"$10\",\"$undefined\"],\"s\":false,\"S\":true}\n"])</script><script>self.__next_f.push([1,"11:\"$Sreact.suspense\"\n12:I[4911,[],\"AsyncMetadata\"]\nf:[\"$\",\"div\",null,{\"hidden\":true,\"children\":[\"$\",\"$11\",null,{\"fallback\":null,\"children\":[\"$\",\"$L12\",null,{\"promise\":\"$@13\"}]}]}]\n9:null\n"])</script><script>self.__next_f.push([1,"d:[[\"$\",\"meta\",\"0\",{\"charSet\":\"utf-8\"}],[\"$\",\"meta\",\"1\",{\"name\":\"viewport\",\"content\":\"width=device-width, initial-scale=1\"}]]\n8:null\n"])</script><script>self.__next_f.push([1,"b:{\"metadata\":[],\"error\":null,\"digest\":\"$undefined\"}\n13:{\"metadata\":\"$b:metadata\",\"error\":null,\"digest\":\"$undefined\"}\n"])</script></body></html>