@xyd-js/components 0.1.0-xyd.0 → 0.1.0-xyd.10

package/dist/index.css

@@ -1,135 +1,217 @@
-.h1vf00q{position:relative;border-top:1px solid #f0f0f0;padding:32px;background-color:#fff;}
-.c1ny3ybl{margin:0 auto;max-width:1200px;text-align:center;}
-.t1ahtzu3{line-height:24px;font-size:14px;font-weight:500;color:rgba(60, 60, 67, .78);}
-
-.h1vbgqbd{padding:20px;}
-.c1qluffv{display:flex;align-items:center;justify-content:center;gap:80px;}
-.h7zyorj{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:40px;}
-.h10nnuqu{display:flex;align-items:center;justify-content:center;flex-direction:column;background:-webkit-linear-gradient(
-                120deg,
-                var(--headingEffect-color-tertiary) 20%,
-                var(--headingEffect-color-tertiary) 30%,
-                var(--headingEffect-color-secondary) 60%,
-                var(--headingEffect-color-primary) 75%,
-                var(--headingEffect-color-primary) 85%
-        );-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;animation:wave-h10nnuqu 5s infinite;background-size:200% 200%;-webkit-background-position:50% 50%;background-position:50% 50%;}
-@keyframes wave-h10nnuqu{0%{-webkit-background-position:50% 50%;background-position:50% 50%;}50%{-webkit-background-position:0% 50%;background-position:0% 50%;}100%{-webkit-background-position:50% 50%;background-position:50% 50%;}}
-.h1xgyvqe{display:flex;align-items:center;justify-content:center;flex-direction:column;}
-.t1rx1fna{font-size:76px;font-weight:900;text-align:center;letter-spacing:3px;margin:0;}
-.s9nduqh{color:#3c3c43;font-size:46px;font-weight:600;text-align:center;}
-.hth6on8{display:flex;align-items:center;justify-content:center;gap:10px;}
-
-.hfe0p8m{display:grid;grid-template-columns:repeat(2, 500px);justify-content:center;gap:30px;}@media (max-width: 1200px){.hfe0p8m{grid-template-columns:repeat(2, 1fr);}}@media (max-width: 768px){.hfe0p8m{grid-template-columns:1fr;}}
-
-.hn2r3b2{display:inline-block;border:1px solid transparent;text-align:center;font-weight:600;white-space:nowrap;border-radius:20px;padding:0 20px;line-height:38px;font-size:14px;border-color:transparent;color:#3c3c43;background-color:#f7f7f8;transition:color .25s,border-color .25s,background-color .25s;}.hn2r3b2:hover{background:#e3e3e6;}.hgvnekf{color:#fff;background-color:rgb(112, 81, 212);}.hgvnekf:hover{background-color:rgb(95, 59, 211);}
-
-.hfzpnxu{display:flex;flex-direction:column;min-height:100vh;}
-.h1k4ds7x{background:radial-gradient(circle, hsl(0 0% 9% / .3) 1px, transparent 1px);-webkit-backdrop-filter:sepia(10%);backdrop-filter:sepia(10%);background-size:30px 30px;padding:60px;flex:1;}
-.h1x4dha7{background:repeating-linear-gradient(to right, hsl(0 0% 9% / .1), hsl(0 0% 9% / .1) 1px, transparent 1px, transparent 50px),repeating-linear-gradient(to bottom, hsl(0 0% 9% / .1), hsl(0 0% 9% / .1) 1px, transparent 1px, transparent 50px);}
-.broqp2l{width:1200px;margin:0 auto;display:flex;flex-direction:column;gap:80px;}
-@media (max-width: 1200px){.broqp2l{width:100%;padding:0 20px;}}
-@media (max-width: 768px){.broqp2l{width:100%;padding:0 10px;}}
-
-.hhnegou{display:inline-flex;align-items:center;position:relative;width:100%;min-width:275px;padding:8px 12px;border-radius:8px;text-align:center;border:1px solid #ececf1;}
-._1ja9964{background-color:#f7f7f8;border-color:#ececf1;}
-.h1lyih3m{display:inline-flex;margin-right:14px;flex:0 0 auto;align-self:flex-start;color:#6e6e80;font-size:20px;margin-top:2px;}
-.h1gzjc3x{color:#353740;text-align:left;flex:1 1 auto;}
-.boe1v8p{font-size:14px;line-height:20px;}
-
-
-.hilz89t{display:flex;position:relative;overflow:hidden;border:.5px solid #ececf1;background:linear-gradient(238deg, rgba(247, 247, 248, .5) 0%, rgba(247, 247, 248, 1) 100%);border-radius:8px;padding:16px 20px 20px;z-index:0;transition:box-shadow .2s ease-in-out,background-image .2s ease;}.hilz89t:hover{background:linear-gradient(238deg, rgba(255, 255, 255, .5) 0%, rgba(250, 250, 250, 1) 100%);}.h1rnhmpa{padding:21px 25px 25px;}.lajci2p{width:100%;height:100%;}.iezrce7{border-radius:8px;display:flex;align-items:flex-start;cursor:pointer;transition:opacity .15s;}.iezrce7:hover [data-pointer="true"]{opacity:1;transform:translate(0);}.i1vhi0b8{width:100%;height:100%;}.i1m2lps9{line-height:0px;font-size:24px;border-radius:8px;width:48px;height:48px;display:flex;justify-content:center;align-items:center;color:#353740;border:1px solid #ececf1;background:linear-gradient(238deg, rgba(255, 255, 255, .5) 0%, rgba(250, 250, 250, 1) 100%);transition:background .2s ease;box-sizing:border-box;flex-shrink:0;}.r1new93p{padding-left:16px;display:flex;flex-direction:column;gap:4px;}.t1u3d3ty{display:flex;color:#202123;font-weight:400;align-items:center;transition:color .15s;}.t4udf3g{font-size:16px;line-height:20px;}.t1icpluq{font-size:18px;}.badgd67{font-weight:400;font-size:14px;line-height:20px;color:#6e6e80;white-space:normal;overflow:hidden;text-overflow:ellipsis;}.bcjznmh{font-size:16px;}.p13ekkiz{opacity:0;transform:translate(-4px);display:flex;justify-content:center;transition:opacity .15s ease-in-out,transform .15s ease-in-out;}.h15733ml{display:grid;grid-template-columns:1fr 1fr;justify-content:center;gap:30px;}
-
-.h1w59zdn{display:inline-block;padding:0 .3em;border-radius:6px;margin:0 3px;border:.5px solid #ececf1;font-size:14px;font-weight:500;line-height:1.6em;background:linear-gradient(45deg, #f7f7f8 0%, rgba(247, 247, 248, 1) 100%);}
-
-.h1ej4n95{border-color:rgb(229 229 229 / 0.7);}
-
-.h14vj3ri{display:block;overflow-x:scroll;border-collapse:collapse;border-radius:3px;}
-.t1l6tz9b{padding:0.5rem 1rem;margin:0;font-weight:600;border-width:1px;border-color:#D1D5DB;background:rgba(234, 238, 242, 0.5);}
-.thzxr0l{padding:0;margin:0;border-top-width:1px;border-color:#D1D5DB;}
-.t1g1altt{padding:0.5rem 1rem;margin:0;border-width:1px;border-color:#D1D5DB;}
-
-.h3kfd8c{padding-left:0;list-style:none;counter-reset:ordered-listitem;display:flex;flex-direction:column;gap:6px;}
-.l1et872q{padding-left:32px;position:relative;line-height:1.5;}
-.l1et872q::after{position:absolute;top:0;left:0;counter-increment:ordered-listitem;content:counter(ordered-listitem);background:#ececf1;color:#353740;font-size:12px;line-height:24px;font-weight:500;text-align:center;height:24px;width:24px;border-radius:12px;}
-
-.hwmojve{border-top:1px solid #ececf1;}.hwmojve[open] summary svg[data-icon="true"]{transform:rotate(90deg);}.h1an07j0{background-color:#f7f7f8;border:1px solid #ececf1;border-radius:8px;}.sbneplt{padding:16px 14px 16px 0;font-size:18px;cursor:pointer;font-weight:500;font-variant-numeric:tabular-nums;line-height:1.4;transition:color 0.3s;display:flex;flex-direction:row;align-items:center;justify-content:flex-start;list-style:none;}.sbneplt:hover{color:#565869;}.s1d31n8s{display:flex;justify-content:space-between;align-items:center;cursor:pointer;padding:20px 24px;}.s2p0kpw{display:flex;align-items:center;margin-bottom:8px;}.snk81qf{color:#6e6e80;text-transform:uppercase;font-size:12px;line-height:16px;letter-spacing:.08em;margin-left:8px;font-weight:700;}.lyq3zec{flex:1 1 auto;}.iq0a0s6{flex:0 0 auto;font-size:16px;display:flex;align-items:center;justify-content:center;padding-right:6px;}.c1ligx2c{padding:0 24px 20px;}.c89yndk code{background:white;}
-
-.h1xhrk1{display:flex;padding-top:2rem;margin-top:2rem;margin-bottom:2rem;justify-content:space-between;align-items:center;border-top-width:1px;}
-.l1elq7ab{display:flex;padding-top:1rem;padding-bottom:1rem;gap:0.25rem;align-items:center;font-size:1rem;line-height:1.5rem;font-weight:500;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:300ms;max-width:50%;}
-.i1mmatje{display:inline;height:1.25rem;flex-shrink:0;}
-
-.hh8vcxa{position:relative;max-width:100%;}
-.b2p5907{display:flex;align-items:center;}
-.coeb6fw{margin-top:16px;}
-.h196u2m6{padding:8px;background-color:#ffffff;box-shadow:0 1px 2px 0 rgba(0, 0, 0, 0.05);}
-.i1hlflsk{width:16px;height:16px;}
-.hownbu8{overflow-x:auto;flex-grow:1;}
-.cuwerl2{display:inline-flex;gap:4px;border-radius:8px;background-color:#F3F4F6;padding:4px;margin-left:4px;}
-.hlivi01{padding:0.5rem 1rem;border-radius:0.375rem;font-size:0.875rem;line-height:1.25rem;font-weight:500;white-space:nowrap;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:300ms;color:#6B7280;}
-.hlivi01:hover{color:#111827;}
-.hlivi01[data-state="active"]{color:#111827;background-color:#ffffff;box-shadow:0 1px 2px 0 rgba(0, 0, 0, 0.05);}
-._5m9mpz{color:#111827;background-color:#ffffff;box-shadow:0 1px 2px 0 rgba(0, 0, 0, 0.05);}
-
-.h1tn40xd{line-height:40px;font-weight:300;color:#202123;position:relative;display:inline-block;margin:0;padding:0 24px 0 0;scroll-snap-margin-top:30px;scroll-margin-top:30px;cursor:pointer;}.h1tn40xd:hover svg{opacity:1;}.hnf4kng{font-size:36px;}.hnf4kng code{font-size:30px;}.h1vdtsi8{font-size:30px;}.h1vdtsi8 code{font-size:24px;}.hz5xehg{font-size:26px;}.hz5xehg code{font-size:22px;}.hptgzam{font-size:22px;}.hptgzam code{font-size:18px;}.h11bbv2f{font-size:18px;}.h11bbv2f code{font-size:14px;}.hcoksa6{font-size:16px;}.hcoksa6 code{font-size:12px;}.l17d6dy1{position:absolute;top:50%;right:0;margin-top:-6px;opacity:0;color:#7051d4;transition:opacity .15s ease;}
-
-.h1wifk81{color:rgb(55 65 81 / 1);font-style:italic;border-color:rgb(209 213 219 / 1);margin:0;}
-
-.hutvd2b{display:inline-flex;align-items:center;line-height:1rem;font-style:normal;font-weight:500;letter-spacing:normal;white-space:nowrap;text-transform:none;}
-.hg9oorb{color:#000;background-color:#f8d047;}
-.h6jev6x{font-size:12px;height:18px;padding:0 6px;gap:3px;border-radius:6px;}
-.i1uvewli{position:relative;}
-
-.h1vb39qj{margin-top:0;border-radius:6px;padding:16px;border:0;background-color:rgb(246, 248, 250);overflow:auto;}
-
-.h1bta36o{align-items:center;display:flex;height:42px;background-color:#fff;border-bottom:1px solid hsl(212, 15%, calc(96% - 12% * 1));z-index:99;}
-.uxs4bf1{display:flex;gap:10px;height:100%;color:hsl(212, 15%, calc(96% - 12% * 4));list-style:none;padding:0;white-space:nowrap;}
-.ifn7ecb{height:100%;}
-.ifn7ecb[data-state="active"] a{border-bottom-color:rgb(112, 81, 212);}
-.i441kmn{display:inline-flex;border-bottom:3px solid transparent;-webkit-text-decoration:none;text-decoration:none;height:100%;padding:10px;}
-
-
-.hwgsk4h{display:flex;overflow:hidden;margin-top:0.375rem;gap:0.25rem;align-items:center;font-size:0.875rem;line-height:1.25rem;color:#6B7280;}
-.i1b95bxl{shrink:0;width:0.875rem;}
-.i1a3fa93{white-space:nowrap;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:300ms;}
-.i1dl7ywj{color:#000;font-weight:bold;}
-
-:root {--xyd-navbar-height:46px;--xyd-global-page-gutter:8px;}
-.h8dr7e{width:100%;}
-.h1ezaz84{display:flex;justify-content:space-between;align-items:center;position:fixed;top:0px;right:8px;left:8px;height:46px;}
-.h17wz13c{flex-direction:column;height:90px;transition:transform 200ms;}
-.h1bgh3rd{transform:translateY(calc(-46px + 3px));}
-.mxu2emt{position:fixed;top:calc(46px + 0px);bottom:8px;left:8px;right:8px;}
-.mslox5x{top:calc(90px + 0px);transition:top 200ms;}
-.s1i19hnd{flex-direction:column;position:absolute;top:0;left:0;bottom:0;right:0;z-index:101;width:210px;border:0;padding:12px 0 0;overflow:visible;background:none;border-radius:0;opacity:1;visibility:visible;transition:opacity .3s cubic-bezier(.65, 0, .35, 1);}
-.h13sn67b{position:absolute;top:12px;right:0;bottom:0;z-index:201;background:#fff;overflow:hidden;transition:opacity .3s cubic-bezier(.65, 0, .35, 1);left:210px;}
-.s1k9r3in{overflow:scroll;height:100%;}
-.c1t0msup{padding:0;width:100%;min-height:100%;max-width:100%;margin:0 auto;font-size:15px;line-height:24px;}
-.apqkghd{width:980px;padding:40px 56px;padding-top:20px;max-width:100%;margin:0 auto;}
-.a10qws06{width:1200px;}
-.h3zl32q{display:flex;gap:30px;width:100%;align-items:flex-start;}
-.c1cmkhbs{flex:1 1 0;overflow:hidden;}
-.n1rrfk2r{position:sticky;top:30px;width:180px;margin-top:0;margin-left:50px;padding-left:16px;flex:none;}
-
-.hmi9h9e{margin-top:-18px;font-size:18px;color:#7051d4;font-weight:300;}
-
-.h1seqss5{display:flex;flex-direction:column;gap:24px;}
-
-.htyux6{color:#7051d4;}
-
-.h1y6o0jn{overflow:hidden;min-width:0;border:1px solid rgb(236, 236, 241);border-radius:16px;}
-.h97thnz{display:flex;flex:1 1 0%;background:linear-gradient(45deg, rgb(247, 247, 248) 0%, rgb(247, 247, 248) 100%)!important;border-top-right-radius:10px;border-top-left-radius:10px;border-bottom:0px;min-width:0;}
-.lif8pqn{display:flex;flex-grow:1;justify-content:end;gap:8px;padding:0 10px;}
-.b1kpexyx{all:unset;cursor:pointer;display:flex;align-items:center;justify-content:center;border-radius:6px;padding:6px;font-size:14px;color:rgb(53, 55, 64);}
-.b1kpexyx[data-state="active"]{color:rgb(112, 81, 212);border-bottom:1px solid rgb(112, 81, 212);border-bottom-left-radius:0px;border-bottom-right-radius:0px;}
-.b1kpexyx:hover{transition:ease-in 0.1s;background:#e3e3eb;}
-.d1rpynm3{display:flex;align-items:center;gap:4px;font-size:14px;color:rgb(53, 55, 64);margin-left:4px;margin-right:4px;}
-.dl1m2ja{display:flex;padding-left:16px;padding-right:16px;flex:1 1 0%;gap:16px;border-radius:4px;}
-.clblb2f{display:flex;padding-left:8px;padding-right:8px;align-items:center;}
-.hulbopn{max-height:400px;background:linear-gradient(45deg, rgb(247, 247, 248) 0%, rgb(247, 247, 248) 100%)!important;margin:0;padding:8px 16px;border-top:1px solid rgb(236, 236, 241);border-bottom-left-radius:10px;border-bottom-right-radius:10px;font-size:12px;line-height:20px;white-space:pre-wrap;word-break:break-all;overflow-y:scroll;}
-.h4abprr{max-height:100%;}
-.h11cz9ao{display:flex;border-left-width:4px;border-color:transparent;margin:4px 0;}
-.l17rl0pt{flex:1 1 0%;}
-._1ilv7sf{border-color:#60A5FA;background-color:#EEF2FF;}
-.h1qcolfq{margin:0 4px;-webkit-user-select:none;-moz-user-select:none;user-select:none;opacity:0.5;}
-
-.h1hvsyfb{all:unset;cursor:pointer;display:flex;align-items:center;justify-content:center;border-radius:6px;padding:6px;}.h1hvsyfb:hover{transition:ease-in 0.1s;background:#e3e3eb;}
+.XydComponents-Component-brand-Footer__FooterHost{position:relative;border-top:1px solid #f0f0f0;padding:32px;background-color:#fff;}
+.XydComponents-Component-brand-Footer__FooterContainer{margin:0 auto;max-width:1200px;text-align:center;}
+.XydComponents-Component-brand-Footer__FooterTextContainer{line-height:24px;font-size:14px;font-weight:500;color:rgba(60, 60, 67, .78);}
+
+.XydComponents-Component-pages-HomePage__HomePageCardsHost{display:grid;grid-template-columns:repeat(2, 500px);justify-content:center;gap:30px;}@media (max-width: 1200px){.XydComponents-Component-pages-HomePage__HomePageCardsHost{grid-template-columns:repeat(2, 1fr);}}@media (max-width: 768px){.XydComponents-Component-pages-HomePage__HomePageCardsHost{grid-template-columns:1fr;}}
+
+.XydComponents-Component-brand-CTABanner__CTABannerHost{padding:20px;}
+.XydComponents-Component-brand-CTABanner__CTABannerContainer{display:flex;align-items:center;justify-content:center;gap:80px;}
+.XydComponents-Component-brand-CTABanner__CTABannerHero{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:40px;}
+.XydComponents-Component-brand-CTABanner__CTABannerHeadingEffect{display:flex;align-items:center;justify-content:center;flex-direction:column;background:-webkit-linear-gradient(
+            120deg,
+            var(--headingEffect-color-tertiary) 20%,
+            var(--headingEffect-color-tertiary) 30%,
+            var(--headingEffect-color-secondary) 60%,
+            var(--headingEffect-color-primary) 75%,
+            var(--headingEffect-color-primary) 85%
+    );-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;animation:wave-XydComponents-Component-brand-CTABanner__CTABannerHeadingEffect 5s infinite;background-size:200% 200%;-webkit-background-position:50% 50%;background-position:50% 50%;}
+@keyframes wave-XydComponents-Component-brand-CTABanner__CTABannerHeadingEffect{0%{-webkit-background-position:50% 50%;background-position:50% 50%;}50%{-webkit-background-position:0% 50%;background-position:0% 50%;}100%{-webkit-background-position:50% 50%;background-position:50% 50%;}}
+.XydComponents-Component-brand-CTABanner__CTABannerHeadingHost{display:flex;align-items:center;justify-content:center;flex-direction:column;}
+.XydComponents-Component-brand-CTABanner__CTABannerHeadingTitle{font-size:76px;font-weight:900;text-align:center;letter-spacing:3px;margin:0;}
+.XydComponents-Component-brand-CTABanner__CTABannerHeadingSubtitle{color:#3c3c43;font-size:46px;font-weight:600;text-align:center;}
+.XydComponents-Component-brand-CTABanner__CTABannerButtonGroupHost{display:flex;align-items:center;justify-content:center;gap:10px;}
+
+.XydComponents-Component-brand-Button__ButtonHost{display:inline-block;border:1px solid transparent;text-align:center;font-weight:600;white-space:nowrap;border-radius:20px;padding:0 20px;line-height:38px;font-size:14px;border-color:transparent;color:#3c3c43;background-color:#f7f7f8;transition:color .25s,border-color .25s,background-color .25s;}.XydComponents-Component-brand-Button__ButtonHost:hover{background:#e3e3e6;}.XydComponents-Component-brand-Button__ButtonHostSecondary{color:#fff;background-color:rgb(112, 81, 212);}.XydComponents-Component-brand-Button__ButtonHostSecondary:hover{background-color:rgb(95, 59, 211);}
+
+.XydComponents-Component-writer-Badge__BadgeHost{display:inline-flex;align-items:center;line-height:1rem;font-style:normal;font-weight:500;letter-spacing:normal;white-space:nowrap;text-transform:none;}
+.XydComponents-Component-writer-Badge__BadgeHostWarning{color:#434e4e;background-color:#ffffe1;}
+.XydComponents-Component-writer-Badge__BadgeHostInfo{color:#fff;background-color:#1971a8;}
+.XydComponents-Component-writer-Badge__BadgeHostSm{font-size:12px;height:18px;padding:0 6px;gap:3px;border-radius:6px;}
+.XydComponents-Component-writer-Badge__BadgeItem{position:relative;}
+
+.XydComponents-Component-views-HomeView__HomeViewHost{display:flex;flex-direction:column;min-height:100vh;}
+.XydComponents-Component-views-HomeView__HomeViewBodyHost{background:radial-gradient(circle, hsl(0 0% 9% / .3) 1px, transparent 1px);-webkit-backdrop-filter:sepia(10%);backdrop-filter:sepia(10%);background-size:30px 30px;padding:60px;flex:1;}
+.XydComponents-Component-views-HomeView__HomeViewBodyHostSecondary{background:repeating-linear-gradient(to right, hsl(0 0% 9% / .1), hsl(0 0% 9% / .1) 1px, transparent 1px, transparent 50px),repeating-linear-gradient(to bottom, hsl(0 0% 9% / .1), hsl(0 0% 9% / .1) 1px, transparent 1px, transparent 50px);}
+.XydComponents-Component-views-HomeView__HomeViewBodyContent{width:1200px;margin:0 auto;display:flex;flex-direction:column;gap:80px;}
+@media (max-width: 1200px){.XydComponents-Component-views-HomeView__HomeViewBodyContent{width:100%;padding:0 20px;}}
+@media (max-width: 768px){.XydComponents-Component-views-HomeView__HomeViewBodyContent{width:100%;padding:0 10px;}}
+
+
+.XydComponents-Component-writer-GuideCard__GuideHostSecondary{display:flex;position:relative;overflow:hidden;border:1px solid #ebebeb;background:#f8f8f8;border-radius:8px;padding:24px;z-index:0;transition:box-shadow .2s ease-in-out,background-image .2s ease;}.XydComponents-Component-writer-GuideCard__GuideHostSecondary:hover{background:#FFF;}.XydComponents-Component-writer-GuideCard__GuideHostSecondaryMd{padding:21px 25px 25px;}.XydComponents-Component-writer-GuideCard__GuideLink{width:100%;height:100%;}.XydComponents-Component-writer-GuideCard__GuideItem{border-radius:8px;display:flex;align-items:flex-start;cursor:pointer;transition:opacity .15s;}.XydComponents-Component-writer-GuideCard__GuideItem:hover [data-pointer="true"]{opacity:1;transform:translate(0);}.XydComponents-Component-writer-GuideCard__GuideItemSecondary{width:100%;height:100%;}.XydComponents-Component-writer-GuideCard__GuideIcon{line-height:0px;font-size:24px;height:32px;display:flex;justify-content:center;align-items:center;color:#000;transition:background .2s ease;box-sizing:border-box;flex-shrink:0;}.XydComponents-Component-writer-GuideCard__GuideRight{padding-left:16px;display:flex;flex-direction:column;gap:4px;}.XydComponents-Component-writer-GuideCard__GuideTitle{display:flex;color:#000;font-weight:600;align-items:center;transition:color .15s;}.XydComponents-Component-writer-GuideCard__GuideTitleBody{font-size:16px;line-height:20px;}.XydComponents-Component-writer-GuideCard__GuideTitleBodyMd{font-size:18px;}.XydComponents-Component-writer-GuideCard__GuideBody{font-weight:400;font-size:14px;line-height:20px;color:#5C5C5C;white-space:normal;overflow:hidden;text-overflow:ellipsis;}.XydComponents-Component-writer-GuideCard__GuideBodyMd{font-size:16px;}.XydComponents-Component-writer-GuideCard__GuidePointer{opacity:0;transform:translate(-4px);display:flex;justify-content:center;transition:opacity .15s ease-in-out,transform .15s ease-in-out;}.XydComponents-Component-writer-GuideCard__GuideListHost{display:grid;grid-template-columns:1fr 1fr;justify-content:center;gap:24px;}
+
+.XydComponents-Component-writer-Hr__HrHost{border-color:rgb(229 229 229 / 0.7);}
+
+.XydComponents-Component-writer-Blockquote__BlockquoteHost{color:rgb(55 65 81 / 1);font-style:italic;border-color:rgb(209 213 219 / 1);margin:0;}
+
+.XydComponents-Component-writer-Callout__CalloutHost{display:inline-flex;align-items:center;position:relative;width:100%;min-width:275px;padding:8px 12px;border-radius:8px;text-align:center;border:1px solid #ececf1;}
+.XydComponents-Component-writer-Callout__CalloutNeutral{background-color:#f7f7f8;border-color:#ececf1;}
+.XydComponents-Component-writer-Callout__CalloutIcon{display:inline-flex;margin-right:14px;flex:0 0 auto;align-self:flex-start;color:#6e6e80;font-size:20px;margin-top:2px;}
+.XydComponents-Component-writer-Callout__CalloutMessage{color:#353740;text-align:left;flex:1 1 auto;}
+.XydComponents-Component-writer-Callout__CalloutMessageBody{font-size:14px;line-height:20px;}
+
+.XydComponents-Component-writer-Breadcrumbs-Breadcrumbs_styles_ts__BreadcrumbsHost{display:flex;overflow:hidden;margin-top:0.375rem;gap:0.25rem;align-items:center;font-size:0.875rem;line-height:1.25rem;color:#6B7280;}
+.XydComponents-Component-writer-Breadcrumbs-Breadcrumbs_styles_ts__BreadcrumbsIcon{shrink:0;width:0.875rem;}
+.XydComponents-Component-writer-Breadcrumbs-Breadcrumbs_styles_ts__BreadcrumbsItem{white-space:nowrap;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:300ms;}
+.XydComponents-Component-writer-Breadcrumbs-Breadcrumbs_styles_ts__BreadcrumbsItemActive{color:#000;font-weight:bold;}
+
+.XydComponents-Component-writer-Table__TableHost{display:block;overflow-x:scroll;border-collapse:collapse;border-radius:3px;}
+.XydComponents-Component-writer-Table__TableTh{padding:0.5rem 1rem;margin:0;font-weight:600;border-width:1px;border-color:#D1D5DB;background:rgba(234, 238, 242, 0.5);}
+.XydComponents-Component-writer-Table__TableTr{padding:0;margin:0;border-top-width:1px;border-color:#D1D5DB;}
+.XydComponents-Component-writer-Table__TableTd{padding:0.5rem 1rem;margin:0;border-width:1px;border-color:#D1D5DB;}
+
+.XydComponents-Component-writer-Details__DetailsHost{border-top:1px solid #ececf1;}.XydComponents-Component-writer-Details__DetailsHost[open] summary svg[data-icon="true"]{transform:rotate(90deg);}.XydComponents-Component-writer-Details__DetailsHostSecondary{background-color:#f7f7f8;border:1px solid #ececf1;border-radius:8px;}.XydComponents-Component-writer-Details__DetailsSummary{padding:16px 14px 16px 0;font-size:18px;cursor:pointer;font-weight:500;font-variant-numeric:tabular-nums;line-height:1.4;transition:color 0.3s;display:flex;flex-direction:row;align-items:center;justify-content:flex-start;list-style:none;}.XydComponents-Component-writer-Details__DetailsSummary:hover{color:#565869;}.XydComponents-Component-writer-Details__DetailsSummarySecondary{display:flex;justify-content:space-between;align-items:center;cursor:pointer;padding:20px 24px;}.XydComponents-Component-writer-Details__DetailsSummaryTertiary{padding:10px 24px;}.XydComponents-Component-writer-Details__DetailsSummaryDeep{display:flex;align-items:center;margin-bottom:8px;}.XydComponents-Component-writer-Details__DetailsSummaryDeepText{color:#6e6e80;text-transform:uppercase;font-size:12px;line-height:16px;letter-spacing:.08em;margin-left:8px;font-weight:700;}.XydComponents-Component-writer-Details__DetailsSummaryDeepTextTertiary{text-transform:none;}.XydComponents-Component-writer-Details__DetailsSummaryDeepTextTertiary code{background:white;}.XydComponents-Component-writer-Details__DetailsLabel{flex:1 1 auto;}.XydComponents-Component-writer-Details__DetailsLabelTertiary{padding:10px;}.XydComponents-Component-writer-Details__DetailsIcon{flex:0 0 auto;font-size:16px;display:flex;align-items:center;justify-content:center;padding-right:6px;}.XydComponents-Component-writer-Details__DetailsContent{padding:0 24px 20px;}.XydComponents-Component-writer-Details__DetailsContentSecondary code{background:white;}.XydComponents-Component-writer-Details__DetailsContentTertiary{background:white;padding-top:20px;}
+
+.XydComponents-Component-writer-Heading__HeadingHost{line-height:40px;font-weight:600;position:relative;display:inline-block;margin:0;padding:0 24px 0 0;scroll-snap-margin-top:30px;scroll-margin-top:30px;cursor:pointer;}.XydComponents-Component-writer-Heading__HeadingHost:hover svg{opacity:1;}.XydComponents-Component-writer-Heading__HeadingH1{font-size:36px;}.XydComponents-Component-writer-Heading__HeadingH1 code{font-size:30px;}.XydComponents-Component-writer-Heading__HeadingH2{font-size:30px;}.XydComponents-Component-writer-Heading__HeadingH2 code{font-size:24px;}.XydComponents-Component-writer-Heading__HeadingH3{font-size:26px;}.XydComponents-Component-writer-Heading__HeadingH3 code{font-size:22px;}.XydComponents-Component-writer-Heading__HeadingH4{font-size:22px;}.XydComponents-Component-writer-Heading__HeadingH4 code{font-size:18px;}.XydComponents-Component-writer-Heading__HeadingH5{font-size:18px;}.XydComponents-Component-writer-Heading__HeadingH5 code{font-size:14px;}.XydComponents-Component-writer-Heading__HeadingH6{font-size:16px;}.XydComponents-Component-writer-Heading__HeadingH6 code{font-size:12px;}.XydComponents-Component-writer-Heading__HeadingLink{position:absolute;top:50%;right:0;margin-top:-6px;opacity:0;color:#7051d4;transition:opacity .15s ease;}
+
+.XydComponents-Component-writer-Code__CodeHost{display:inline-block;padding:0 .3em;border-radius:6px;margin:0 3px;border:.5px solid #ececf1;font-size:14px;font-weight:500;line-height:1.6em;background:linear-gradient(45deg, #f7f7f8 0%, rgba(247, 247, 248, 1) 100%);}
+
+.XydComponents-Component-writer-Steps__StepsHost{padding-left:0;list-style:none;counter-reset:ordered-listitem;display:flex;flex-direction:column;gap:6px;}
+.XydComponents-Component-writer-Steps__StepsLi{padding-left:32px;position:relative;line-height:1.5;}
+.XydComponents-Component-writer-Steps__StepsLi::after{position:absolute;top:0;left:0;counter-increment:ordered-listitem;content:counter(ordered-listitem);background:#ececf1;color:#353740;font-size:12px;line-height:24px;font-weight:500;text-align:center;height:24px;width:24px;border-radius:12px;}
+
+.XydComponents-Component-writer-Table__Host{width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;}
+.XydComponents-Component-writer-Table__Table{display:table;width:100%;min-width:640px;border-collapse:separate;border-spacing:0;border:1px solid #ECECF1;border-radius:8px;font-size:0.875rem;line-height:1.25rem;margin-top:1rem;overflow:hidden;}
+.XydComponents-Component-writer-Table__Thead{background:#F7F7F8;}
+.XydComponents-Component-writer-Table__Th{text-align:left;font-weight:500;padding:0.5rem 1rem;color:#353740;vertical-align:middle;border-bottom:1px solid #ECECF1;white-space:nowrap;}
+.XydComponents-Component-writer-Table__Th:first-child{width:24rem;max-width:40%;border-right:1px solid #ECECF1;}
+@media (max-width: 768px){.XydComponents-Component-writer-Table__Th:first-child{width:auto;min-width:12rem;}}
+.XydComponents-Component-writer-Table__Th.numeric{text-align:right;font-weight:400;min-width:5rem;}
+@media (max-width: 768px){.XydComponents-Component-writer-Table__Th.numeric{min-width:4rem;}}
+.XydComponents-Component-writer-Table__Tr:not(:last-child){border-bottom:1px solid #ECECF1;}
+.XydComponents-Component-writer-Table__Td{padding:0.5rem 1rem;vertical-align:middle;border-top:1px solid #ECECF1;}
+.XydComponents-Component-writer-Table__Td:first-child{border-right:1px solid #ECECF1;}
+.XydComponents-Component-writer-Table__Td.numeric{text-align:right;}
+.XydComponents-Component-writer-Table__Td.muted{color:#6E6E80;}
+@media (max-width: 768px){.XydComponents-Component-writer-Table__Td{padding:0.5rem;}}
+.XydComponents-Component-writer-Table__Cell{display:flex;align-items:baseline;width:100%;gap:0.5rem;}
+.XydComponents-Component-writer-Table__CellContent{flex:1;text-align:right;}
+.XydComponents-Component-writer-Table__ModelCell{display:flex;align-items:center;gap:0.5rem;white-space:nowrap;color:#202123;}
+@media (max-width: 768px){.XydComponents-Component-writer-Table__ModelCell{font-size:0.8125rem;}}
+
+.XydComponents-Component-writer-Pre__PreHost{margin-top:0;border-radius:6px;padding:16px;border:0;background-color:rgb(246, 248, 250);overflow:auto;}
+
+.XydComponents-Component-writer-UnderlineNav__UnderlineNavHost{align-items:center;display:flex;height:42px;background-color:#fff;border-bottom:1px solid hsl(212, 15%, calc(96% - 12% * 1));z-index:99;}
+.XydComponents-Component-writer-UnderlineNav__UnderlineNavUl{display:flex;gap:10px;height:100%;color:hsl(212, 15%, calc(96% - 12% * 4));list-style:none;padding:0;white-space:nowrap;}
+.XydComponents-Component-writer-UnderlineNav__UnderlineNavItem{height:100%;}
+.XydComponents-Component-writer-UnderlineNav__UnderlineNavItem[data-state="active"] a{border-bottom-color:rgb(112, 81, 212);}
+.XydComponents-Component-writer-UnderlineNav__UnderlineNavItemLink{display:inline-flex;border-bottom:3px solid transparent;-webkit-text-decoration:none;text-decoration:none;height:100%;padding:10px;}
+
+
+.XydComponents-Component-writer-NavLinks-NavLinks_styles_ts__NavLinksHost{display:flex;padding-top:2rem;margin-top:2rem;margin-bottom:2rem;justify-content:space-between;align-items:center;border-top-width:1px;border-color:#d7d7d7;}
+.XydComponents-Component-writer-NavLinks-NavLinks_styles_ts__NavLinksLink{display:flex;gap:8px;align-items:center;font-size:16px;line-height:1.5;font-weight:600;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:300ms;max-width:50%;}
+.XydComponents-Component-writer-NavLinks-NavLinks_styles_ts__NavLinksIcon{display:inline;height:1.25rem;flex-shrink:0;}
+
+.XydComponents-Component-writer-Tabs__TabsSampleHost{position:relative;max-width:100%;}
+.XydComponents-Component-writer-Tabs__TabsSampleButtons{display:flex;align-items:center;}
+.XydComponents-Component-writer-Tabs__TabsSampleContent{margin-top:16px;}
+.XydComponents-Component-writer-Tabs__TabsArrowHost{padding:8px;background-color:#ffffff;box-shadow:0 1px 2px 0 rgba(0, 0, 0, 0.05);}
+.XydComponents-Component-writer-Tabs__TabsArrowIcon{width:16px;height:16px;}
+.XydComponents-Component-writer-Tabs__TabsScrollerHost{overflow-x:auto;flex-grow:1;}
+.XydComponents-Component-writer-Tabs__TabsScrollerContainer{display:inline-flex;gap:4px;border-radius:8px;background-color:#F3F4F6;padding:4px;margin-left:4px;}
+.XydComponents-Component-writer-Tabs__TabsButtonHost{padding:0.5rem 1rem;border-radius:0.375rem;font-size:0.875rem;line-height:1.25rem;font-weight:500;white-space:nowrap;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:300ms;color:#6B7280;}
+.XydComponents-Component-writer-Tabs__TabsButtonHost:hover{color:#111827;}
+.XydComponents-Component-writer-Tabs__TabsButtonHost[data-state="active"]{color:#111827;background-color:#ffffff;box-shadow:0 1px 2px 0 rgba(0, 0, 0, 0.05);}
+.XydComponents-Component-writer-Tabs__TabsButtonActive{color:#111827;background-color:#ffffff;box-shadow:0 1px 2px 0 rgba(0, 0, 0, 0.05);}
+
+:root {--xyd-navbar-height:40px;--xyd-global-page-gutter:8px;}
+.XydComponents-Component-layouts__LayoutHost{width:100%;}
+.XydComponents-Component-layouts__LayoutHeader{display:flex;justify-content:space-between;align-items:center;position:fixed;top:0px;right:8px;left:8px;height:40px;}
+.XydComponents-Component-layouts__LayoutHeaderSub{flex-direction:column;height:94px;transition:transform 200ms;}
+.XydComponents-Component-layouts__LayoutHeaderHideMain{transform:translateY(calc(-40px + 3px));}
+.XydComponents-Component-layouts__LayoutMain{position:fixed;top:calc(40px + 0px);bottom:8px;left:8px;right:8px;}
+.XydComponents-Component-layouts__LayoutMainSub{top:calc(94px + 0px);transition:top 200ms;}
+.XydComponents-Component-layouts__LayoutSidebar{flex-direction:column;position:absolute;top:0;left:0;bottom:0;right:0;z-index:101;width:210px;border:0;padding:12px 0 0;overflow:visible;background:none;border-radius:0;opacity:1;visibility:visible;transition:opacity .3s cubic-bezier(.65, 0, .35, 1);}
+.XydComponents-Component-layouts__PageHost{position:absolute;top:12px;right:0;bottom:0;z-index:201;background:#fff;overflow:hidden;transition:opacity .3s cubic-bezier(.65, 0, .35, 1);left:210px;}
+.XydComponents-Component-layouts__PageScroll{overflow:scroll;height:100%;}
+.XydComponents-Component-layouts__PageContainer{padding:0;width:100%;min-height:100%;max-width:100%;margin:0 auto;font-size:15px;line-height:24px;}
+.XydComponents-Component-layouts__PageArticleContainer{width:980px;padding:40px 56px;padding-top:20px;max-width:100%;margin:0 auto;}
+.XydComponents-Component-layouts__PageArticleContainerFullWidth{width:1200px;}
+.XydComponents-Component-layouts__ArticleHost{display:flex;gap:30px;width:100%;align-items:flex-start;}
+.XydComponents-Component-layouts__ArticleContent{flex:1 1 0;overflow:hidden;}
+.XydComponents-Component-layouts__ArticleNav{position:sticky;top:30px;width:180px;margin-top:0;margin-left:50px;padding-left:16px;flex:none;}
+
+.XydComponents-Component-coder-Code__MarkHost{display:flex;border-left-width:4px;border-color:transparent;margin:4px 0;}
+.XydComponents-Component-coder-Code__MarkLine{flex:1 1 0%;}
+.XydComponents-Component-coder-Code__MarkAnnotated{border-color:#60A5FA;background-color:#EEF2FF;}
+.XydComponents-Component-coder-Code__LineNumberHost{margin:0 12px 0px 4px;-webkit-user-select:none;-moz-user-select:none;user-select:none;opacity:0.5;}
+.XydComponents-Component-coder-Code__CodeHost{max-height:400px;background:linear-gradient(45deg, rgb(247, 247, 248) 0%, rgb(247, 247, 248) 100%)!important;margin:0;padding:8px 16px;border-top:1px solid rgb(236, 236, 241);border-bottom-left-radius:10px;border-bottom-right-radius:10px;font-size:12px;line-height:20px;white-space:pre-wrap;word-break:break-all;overflow-y:scroll;}
+.XydComponents-Component-coder-Code__CodeHostFull{max-height:100%;}
+
+.XydComponents-Component-coder-CodeTabs__CodeTabsHost{overflow:hidden;min-width:0;border:1px solid rgb(236, 236, 241);border-radius:16px;}
+.XydComponents-Component-coder-CodeTabs__CodeTabsPreSingle{border:none!important;}
+.XydComponents-Component-coder-CodeTabs__CodeTabsLanguagesHost{display:flex;flex:1 1 0%;background:linear-gradient(45deg, rgb(247, 247, 248) 0%, rgb(247, 247, 248) 100%)!important;border-top-right-radius:10px;border-top-left-radius:10px;border-bottom:0px;min-width:0;}
+.XydComponents-Component-coder-CodeTabs__CodeTabsLanguagesHostSingle{height:0;}
+.XydComponents-Component-coder-CodeTabs__CodeTabsLanguagesList{display:flex;flex-grow:1;justify-content:end;gap:8px;padding:0 10px;}
+.XydComponents-Component-coder-CodeTabs__CodeTabsLanguagesButton{all:unset;cursor:pointer;display:flex;align-items:center;justify-content:center;border-radius:6px;padding:6px;font-size:14px;color:rgb(53, 55, 64);}
+.XydComponents-Component-coder-CodeTabs__CodeTabsLanguagesButton[data-state="active"]{color:rgb(112, 81, 212);border-bottom:1px solid rgb(112, 81, 212);border-bottom-left-radius:0px;border-bottom-right-radius:0px;}
+.XydComponents-Component-coder-CodeTabs__CodeTabsLanguagesButton:hover{transition:ease-in 0.1s;background:#e3e3eb;}
+.XydComponents-Component-coder-CodeTabs__CodeTabsLanguagesDescription{display:flex;align-items:center;gap:4px;font-size:14px;color:rgb(53, 55, 64);margin-left:4px;margin-right:4px;}
+.XydComponents-Component-coder-CodeTabs__CodeTabsLanguagesDescriptionItem{display:flex;padding-left:16px;padding-right:16px;flex:1 1 0%;gap:16px;border-radius:4px;}
+.XydComponents-Component-coder-CodeTabs__CodeTabsLanguagesCopy{display:flex;padding-left:8px;padding-right:8px;align-items:center;}
+.XydComponents-Component-coder-CodeTabs__CodeTabsLanguagesCopySingle{top:17px;position:relative;right:5px;}
+
+.XydComponents-Component-content-Content__ContentHost{display:flex;flex-direction:column;gap:24px;font-size:16px;line-height:1.5;}
+
+:root {--xyd-navbar-height:50px;--xyd-global-page-gutter:8px;--xyd-sidebar-width:250px;}
+.XydComponents-Component-layouts-LayoutPrimary__LayoutPrimaryHost{width:100%;overflow-x:hidden;background:#fff;}
+.XydComponents-Component-layouts-LayoutPrimary__LayoutPrimaryHeader{display:flex;justify-content:space-between;align-items:center;position:fixed;top:0px;right:8px;left:8px;height:50px;z-index:20;background:#fff;}
+@media (max-width: 768px){.XydComponents-Component-layouts-LayoutPrimary__LayoutPrimaryHeader{padding:0;}}
+.XydComponents-Component-layouts-LayoutPrimary__LayoutPrimaryHeaderContent{display:flex;align-items:center;width:100%;}
+.XydComponents-Component-layouts-LayoutPrimary__LayoutPrimaryHeaderSub{flex-direction:column;height:94px;transition:transform 200ms;}
+.XydComponents-Component-layouts-LayoutPrimary__LayoutPrimaryHeaderHideMain{transform:translateY(calc(-50px + 3px));}
+.XydComponents-Component-layouts-LayoutPrimary__LayoutPrimaryHamburgerButton{display:none;}
+@media (max-width: 768px){.XydComponents-Component-layouts-LayoutPrimary__LayoutPrimaryHamburgerButton{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border:none;background:none;cursor:pointer;padding:0;}}
+.XydComponents-Component-layouts-LayoutPrimary__LayoutPrimaryHamburgerIcon{width:24px;height:24px;position:relative;display:flex;flex-direction:column;justify-content:space-between;}
+.XydComponents-Component-layouts-LayoutPrimary__LayoutPrimaryHamburgerLine{width:100%;height:2px;background:#000;transition:transform 0.3s cubic-bezier(.65, 0, .35, 1);}
+.XydComponents-Component-layouts-LayoutPrimary__LayoutPrimaryHamburgerLineOpen:first-child{transform:translateY(11px) rotate(45deg);}
+.XydComponents-Component-layouts-LayoutPrimary__LayoutPrimaryHamburgerLineOpen:nth-child(2){opacity:0;}
+.XydComponents-Component-layouts-LayoutPrimary__LayoutPrimaryHamburgerLineOpen:last-child{transform:translateY(-11px) rotate(-45deg);}
+.XydComponents-Component-layouts-LayoutPrimary__LayoutPrimaryMain{position:fixed;display:flex;top:calc(50px + 0px);bottom:0;left:0;right:0;padding:8px;overflow:hidden;}
+@media (max-width: 1024px){.XydComponents-Component-layouts-LayoutPrimary__LayoutPrimaryMain{padding-top:calc(50px + 0px + 8px);}}
+.XydComponents-Component-layouts-LayoutPrimary__LayoutPrimaryMainSub{top:calc(94px + 0px);}
+@media (max-width: 1024px){.XydComponents-Component-layouts-LayoutPrimary__LayoutPrimaryMainSub{padding-top:calc(94px + 0px + 8px);}}
+.XydComponents-Component-layouts-LayoutPrimary__LayoutPrimaryStaticSidebar{flex:none;width:250px;background:#fff;display:flex;flex-direction:column;position:relative;height:100%;}
+@media (max-width: 1024px){.XydComponents-Component-layouts-LayoutPrimary__LayoutPrimaryStaticSidebar{display:none;}}
+.XydComponents-Component-layouts-LayoutPrimary__LayoutPrimaryMobileSidebar{display:none;}
+@media (max-width: 1024px){.XydComponents-Component-layouts-LayoutPrimary__LayoutPrimaryMobileSidebar{display:flex;position:fixed;top:0;bottom:0;left:0;width:250px;background:#fff;flex-direction:column;z-index:50;transform:translateX(-100%);transition:transform .3s cubic-bezier(.65, 0, .35, 1);box-shadow:4px 0 8px rgba(0, 0, 0, 0.1);}}
+@media (max-width: 1024px){.XydComponents-Component-layouts-LayoutPrimary__LayoutPrimaryMobileSidebarOpen{transform:translateX(0);}}
+.XydComponents-Component-layouts-LayoutPrimary__LayoutPrimarySidebarContent{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;height:100%;}
+.XydComponents-Component-layouts-LayoutPrimary__LayoutPrimaryCloseButton{position:absolute;top:12px;right:12px;width:32px;height:32px;border:none;background:none;padding:0;cursor:pointer;display:flex;align-items:center;justify-content:center;}
+.XydComponents-Component-layouts-LayoutPrimary__LayoutPrimarySearchInput{width:100%;height:40px;padding:0 12px;border:1px solid #eaeaea;border-radius:6px;font-size:14px;outline:none;transition:border-color 0.2s;}
+.XydComponents-Component-layouts-LayoutPrimary__LayoutPrimarySearchInput:focus{border-color:#666;}
+.XydComponents-Component-layouts-LayoutPrimary__LayoutPrimaryCloseIcon{width:20px;height:20px;position:relative;}
+.XydComponents-Component-layouts-LayoutPrimary__LayoutPrimaryCloseIcon::before,.XydComponents-Component-layouts-LayoutPrimary__LayoutPrimaryCloseIcon::after{content:'';position:absolute;top:50%;left:0;width:100%;height:2px;background:#666;transform-origin:center;}
+.XydComponents-Component-layouts-LayoutPrimary__LayoutPrimaryCloseIcon::before{transform:rotate(45deg);}
+.XydComponents-Component-layouts-LayoutPrimary__LayoutPrimaryCloseIcon::after{transform:rotate(-45deg);}
+.XydComponents-Component-layouts-LayoutPrimary__LayoutPrimaryOverlay{display:none;}
+@media (max-width: 1024px){.XydComponents-Component-layouts-LayoutPrimary__LayoutPrimaryOverlay{display:block;position:fixed;top:0;right:0;bottom:0;left:0;background:rgba(0, 0, 0, 0.6);transition:opacity .3s;opacity:0;pointer-events:none;z-index:40;height:100vh;}}
+.XydComponents-Component-layouts-LayoutPrimary__LayoutPrimaryOverlayVisible{opacity:1;pointer-events:auto;}
+.XydComponents-Component-layouts-LayoutPrimary__LayoutPrimaryPageHost{position:relative;flex:1;background:#fff;overflow:hidden;min-width:0;height:100%;}
+.XydComponents-Component-layouts-LayoutPrimary__LayoutPrimaryPageScroll{overflow-y:auto;height:100%;-webkit-overflow-scrolling:touch;padding:0 48px;}
+@media (max-width: 1024px){.XydComponents-Component-layouts-LayoutPrimary__LayoutPrimaryPageScroll{padding:0 32px;}}
+@media (max-width: 768px){.XydComponents-Component-layouts-LayoutPrimary__LayoutPrimaryPageScroll{padding:0 24px;}}
+.XydComponents-Component-layouts-LayoutPrimary__LayoutPrimaryPageContainer{max-width:1000px;margin:0 auto;padding:0 8px;}
+.XydComponents-Component-layouts-LayoutPrimary__LayoutPrimaryPageContainerLarge{max-width:1200px;}
+.XydComponents-Component-layouts-LayoutPrimary__LayoutPrimaryPageArticleContainer{display:flex;gap:48px;padding:48px 0;min-height:100%;}
+@media (max-width: 1024px){.XydComponents-Component-layouts-LayoutPrimary__LayoutPrimaryPageArticleContainer{gap:32px;}}
+@media (max-width: 768px){.XydComponents-Component-layouts-LayoutPrimary__LayoutPrimaryPageArticleContainer{flex-direction:column;padding:24px 0;gap:24px;}}
+.XydComponents-Component-layouts-LayoutPrimary__LayoutPrimaryArticleHost{flex:1;min-width:0;}
+.XydComponents-Component-layouts-LayoutPrimary__LayoutPrimaryArticleContent{width:100%;}
+.XydComponents-Component-layouts-LayoutPrimary__LayoutPrimaryArticleNav{flex:none;width:256px;position:sticky;top:0;height:-moz-fit-content;height:fit-content;max-height:100vh;overflow-y:auto;padding-right:24px;padding-top:12px;}
+@media (max-width: 1024px){.XydComponents-Component-layouts-LayoutPrimary__LayoutPrimaryArticleNav{width:200px;padding-right:16px;}}
+@media (max-width: 768px){.XydComponents-Component-layouts-LayoutPrimary__LayoutPrimaryArticleNav{width:100%;position:static;max-height:none;padding-right:0;}}
+
+.XydComponents-Component-content-Anchor__AnchorHost{color:#7051d4;}
+
+.XydComponents-Component-content-Subtitle-Subtitle_styles_ts__Host{margin-top:-18px;font-size:18px;color:#6e6e80;font-weight:300;}
+
+.XydComponents-Component-coder-CodeCopy__CodeCopyHost{all:unset;cursor:pointer;display:flex;align-items:center;justify-content:center;border-radius:6px;padding:6px;}.XydComponents-Component-coder-CodeCopy__CodeCopyHost:hover{transition:ease-in 0.1s;background:#e3e3eb;}
+
+.XydComponents-Component-ui-Loader__LoaderHost{display:inline-flex;align-items:center;justify-content:center;}
+.XydComponents-Component-ui-Loader__LoaderDots{display:flex;gap:4px;}
+.XydComponents-Component-ui-Loader__LoaderDot{width:8px;height:8px;background-color:currentColor;border-radius:50%;animation:pulse-XydComponents-Component-ui-Loader__LoaderDot 1.4s infinite ease-in-out;opacity:0.6;}
+.XydComponents-Component-ui-Loader__LoaderDot:nth-of-type(2){animation-delay:0.2s;}
+.XydComponents-Component-ui-Loader__LoaderDot:nth-of-type(3){animation-delay:0.4s;}
+@keyframes pulse-XydComponents-Component-ui-Loader__LoaderDot{0%,80%,100%{transform:scale(0.6);opacity:0.4;}40%{transform:scale(1);opacity:1;}}
+.XydComponents-Component-ui-Loader__LoaderSmall .XydComponents-Component-ui-Loader__LoaderDot{width:6px;height:6px;}
+.XydComponents-Component-ui-Loader__LoaderLarge .XydComponents-Component-ui-Loader__LoaderDot{width:12px;height:12px;}

package/dist/index.d.ts

@@ -1,2 +1,2 @@
 
-export {  }
+export { };

package/dist/index.js

@@ -1 +1,2 @@
 
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/layouts.d.ts

@@ -1,5 +1,15 @@
 import React from 'react';
 
+interface LayoutPrimaryProps {
+    header: React.ReactNode;
+    aside: React.ReactNode;
+    content: React.ReactNode;
+    contentNav?: React.ReactNode;
+    subheader?: React.ReactNode;
+    layoutSize?: "large";
+}
+declare function LayoutPrimary(props: LayoutPrimaryProps): React.JSX.Element;
+
 interface LayoutProps {
     header: React.ReactNode;
     aside: React.ReactNode;
@@ -16,4 +26,5 @@ declare namespace Layout {
     }) => React.JSX.Element;
 }
 
-export { Layout, type LayoutProps };
+export { Layout, LayoutPrimary };
+export type { LayoutPrimaryProps, LayoutProps };

package/dist/layouts.js

@@ -1 +1,2 @@
-import{_ as e}from"./_rollupPluginBabelHelpers-DfQAiTCw.js";import n,{useState as t,useEffect as a}from"react";var c="h8dr7e",r="h1ezaz84",l="h17wz13c",o="h1bgh3rd",s="mxu2emt",m="mslox5x",i="s1i19hnd",d="h13sn67b",u="s1k9r3in",v="c1t0msup",h="apqkghd",E="a10qws06",f="h3zl32q",N="c1cmkhbs",p="n1rrfk2r";function b(r){var g=t(!1),q=e(g,2),L=q[0],k=q[1],x=t(0),H=e(x,2),y=H[0],z=H[1],S=t(0),T=e(S,2),w=T[0],M=T[1];function _(e){var n;if(e.target instanceof HTMLElement){var t=null===(n=e.target)||void 0===n?void 0:n.scrollTop;z(t)}}function j(e){var n;e.target instanceof HTMLElement&&M(null===(n=e.target)||void 0===n?void 0:n.scrollTop)}return a((function(){if(y!==w){var e=parseInt("46px",10)/2,n=y-w,t=Math.abs(y-w);n>e?k(!0):t>e&&k(!1)}}),[y,w]),a((function(){var e,n;if(r.subheader)return null===(e=document.querySelector(".".concat(u)))||void 0===e||e.addEventListener("scroll",_),null===(n=document.querySelector(".".concat(u)))||void 0===n||n.addEventListener("scrollend",j),function(){var e,n;null===(e=document.querySelector(".".concat(u)))||void 0===e||e.removeEventListener("scroll",_),null===(n=document.querySelector(".".concat(u)))||void 0===n||n.removeEventListener("scrollend",j)}}),[]),n.createElement("div",{className:c},n.createElement(b.Header,{className:"\n            ".concat(r.subheader&&l,"\n            ").concat(L&&o,"\n        ")},r.header),n.createElement("main",{className:"\n            ".concat(s,"\n            ").concat(!L&&r.subheader&&m,"\n        ")},n.createElement("aside",{className:i},r.aside),n.createElement("div",{className:d},n.createElement("div",{className:u},n.createElement("div",{className:v},n.createElement("div",{className:"\n                            ".concat(h,"\n                            ").concat("fullwidth"==r.kind&&E,"\n                        ")},n.createElement("article",{className:f},n.createElement("section",{className:N},r.content),r.contentNav&&n.createElement("nav",{className:"\n                                    ".concat(p,"\n                                ")},r.contentNav))))))))}b.Header=function(e){var t=e.className,a=e.children;return n.createElement("header",{className:"\n            ".concat(r,"\n            ").concat(t,"\n        ")},a)};export{b as Layout};
+import{a as e}from"./_rollupPluginBabelHelpers-D0XU6lDu.js";import t,{useState as a,useEffect as n}from"react";var o="50px",r="XydComponents-Component-layouts-LayoutPrimary__LayoutPrimaryHamburgerLine",m="XydComponents-Component-layouts-LayoutPrimary__LayoutPrimaryHamburgerLineOpen",l="XydComponents-Component-layouts-LayoutPrimary__LayoutPrimaryPageScroll";function c(c){var s=a(!1),y=e(s,2),i=y[0],u=y[1],d=c.subheader?function(){var t=a(!1),r=e(t,2),m=r[0],c=r[1],s=a(0),y=e(s,2),i=y[0],u=y[1],d=a(0),p=e(d,2),C=p[0],_=p[1];function L(e){var t;if(e.target instanceof HTMLElement){var a=null===(t=e.target)||void 0===t?void 0:t.scrollTop;u(a)}}function v(e){var t;e.target instanceof HTMLElement&&_(null===(t=e.target)||void 0===t?void 0:t.scrollTop)}return n((function(){if(i!==C){var e=parseInt(o,10)/2,t=i-C,a=Math.abs(i-C);t>e?c(!0):a>e&&c(!1)}}),[i,C]),n((function(){var e,t;return null===(e=document.querySelector(".".concat(l)))||void 0===e||e.addEventListener("scroll",L),null===(t=document.querySelector(".".concat(l)))||void 0===t||t.addEventListener("scrollend",v),function(){var e,t;null===(e=document.querySelector(".".concat(l)))||void 0===e||e.removeEventListener("scroll",L),null===(t=document.querySelector(".".concat(l)))||void 0===t||t.removeEventListener("scrollend",v)}}),[]),{hideMainHeader:m}}():{hideMainHeader:!1},p=d.hideMainHeader;return t.createElement("div",{className:"XydComponents-Component-layouts-LayoutPrimary__LayoutPrimaryHost"},t.createElement("header",{className:" \n            ".concat("XydComponents-Component-layouts-LayoutPrimary__LayoutPrimaryHeader","\n            ").concat(c.subheader&&"XydComponents-Component-layouts-LayoutPrimary__LayoutPrimaryHeaderSub","\n            ").concat(p&&"XydComponents-Component-layouts-LayoutPrimary__LayoutPrimaryHeaderHideMain","\n        ")},t.createElement("div",{className:"XydComponents-Component-layouts-LayoutPrimary__LayoutPrimaryHeaderContent"},c.header,t.createElement("button",{className:"XydComponents-Component-layouts-LayoutPrimary__LayoutPrimaryHamburgerButton",onClick:function(){return u(!i)},"aria-label":"Toggle navigation menu"},t.createElement("div",{className:"XydComponents-Component-layouts-LayoutPrimary__LayoutPrimaryHamburgerIcon"},t.createElement("span",{className:"".concat(r," ").concat(i?m:"")}),t.createElement("span",{className:"".concat(r," ").concat(i?m:"")}),t.createElement("span",{className:"".concat(r," ").concat(i?m:"")})))),c.subheader),t.createElement("div",{className:"".concat("XydComponents-Component-layouts-LayoutPrimary__LayoutPrimaryOverlay"," ").concat(i?"XydComponents-Component-layouts-LayoutPrimary__LayoutPrimaryOverlayVisible":""),onClick:function(){return u(!1)}}),t.createElement("aside",{className:"\n            ".concat("XydComponents-Component-layouts-LayoutPrimary__LayoutPrimaryMobileSidebar","\n            ").concat(i?"XydComponents-Component-layouts-LayoutPrimary__LayoutPrimaryMobileSidebarOpen":"","\n        ")},t.createElement("div",{className:"XydComponents-Component-layouts-LayoutPrimary__LayoutPrimarySidebarContent"},c.aside),t.createElement("button",{className:"XydComponents-Component-layouts-LayoutPrimary__LayoutPrimaryCloseButton",onClick:function(){return u(!1)},"aria-label":"Close navigation menu"},t.createElement("div",{className:"XydComponents-Component-layouts-LayoutPrimary__LayoutPrimaryCloseIcon"}))),t.createElement("main",{className:"\n            ".concat("XydComponents-Component-layouts-LayoutPrimary__LayoutPrimaryMain","\n            ").concat(!p&&c.subheader&&"XydComponents-Component-layouts-LayoutPrimary__LayoutPrimaryMainSub","\n        ")},t.createElement("aside",{className:"XydComponents-Component-layouts-LayoutPrimary__LayoutPrimaryStaticSidebar"},c.aside),t.createElement("div",{className:"XydComponents-Component-layouts-LayoutPrimary__LayoutPrimaryPageHost"},t.createElement("div",{className:l},t.createElement("div",{className:"\n                        ".concat("XydComponents-Component-layouts-LayoutPrimary__LayoutPrimaryPageContainer","\n                        ").concat("large"==c.layoutSize&&"XydComponents-Component-layouts-LayoutPrimary__LayoutPrimaryPageContainerLarge","\n                    ")},t.createElement("div",{className:"XydComponents-Component-layouts-LayoutPrimary__LayoutPrimaryPageArticleContainer"},t.createElement("article",{className:"XydComponents-Component-layouts-LayoutPrimary__LayoutPrimaryArticleHost"},t.createElement("section",{className:"XydComponents-Component-layouts-LayoutPrimary__LayoutPrimaryArticleContent"},c.content)),c.contentNav&&t.createElement("nav",{className:"XydComponents-Component-layouts-LayoutPrimary__LayoutPrimaryArticleNav"},c.contentNav)))))))}var s="XydComponents-Component-layouts__PageScroll";function y(o){var r=a(!1),m=e(r,2),l=m[0],c=m[1],i=a(0),u=e(i,2),d=u[0],p=u[1],C=a(0),_=e(C,2),L=_[0],v=_[1];function P(e){var t;if(e.target instanceof HTMLElement){var a=null===(t=e.target)||void 0===t?void 0:t.scrollTop;p(a)}}function E(e){var t;e.target instanceof HTMLElement&&v(null===(t=e.target)||void 0===t?void 0:t.scrollTop)}return n((function(){if(d!==L){var e=parseInt("40px",10)/2,t=d-L,a=Math.abs(d-L);t>e?c(!0):a>e&&c(!1)}}),[d,L]),n((function(){var e,t;if(o.subheader)return null===(e=document.querySelector(".".concat(s)))||void 0===e||e.addEventListener("scroll",P),null===(t=document.querySelector(".".concat(s)))||void 0===t||t.addEventListener("scrollend",E),function(){var e,t;null===(e=document.querySelector(".".concat(s)))||void 0===e||e.removeEventListener("scroll",P),null===(t=document.querySelector(".".concat(s)))||void 0===t||t.removeEventListener("scrollend",E)}}),[]),t.createElement("div",{className:"XydComponents-Component-layouts__LayoutHost"},t.createElement(y.Header,{className:"\n            ".concat(o.subheader&&"XydComponents-Component-layouts__LayoutHeaderSub","\n            ").concat(l&&"XydComponents-Component-layouts__LayoutHeaderHideMain","\n        ")},o.header),t.createElement("main",{className:"\n            ".concat("XydComponents-Component-layouts__LayoutMain","\n            ").concat(!l&&o.subheader&&"XydComponents-Component-layouts__LayoutMainSub","\n        ")},t.createElement("aside",{className:"XydComponents-Component-layouts__LayoutSidebar"},o.aside),t.createElement("div",{className:"XydComponents-Component-layouts__PageHost"},t.createElement("div",{className:s},t.createElement("div",{className:"XydComponents-Component-layouts__PageContainer"},t.createElement("div",{className:"\n                            ".concat("XydComponents-Component-layouts__PageArticleContainer","\n                            ").concat("fullwidth"==o.kind&&"XydComponents-Component-layouts__PageArticleContainerFullWidth","\n                        ")},t.createElement("article",{className:"XydComponents-Component-layouts__ArticleHost"},t.createElement("section",{className:"XydComponents-Component-layouts__ArticleContent"},o.content),o.contentNav&&t.createElement("nav",{className:"XydComponents-Component-layouts__ArticleNav"},o.contentNav))))))))}y.Header=function(e){var a=e.className,n=e.children;return t.createElement("header",{className:"\n            ".concat("XydComponents-Component-layouts__LayoutHeader","\n            ").concat(a,"\n        ")},n)};export{y as Layout,c as LayoutPrimary};
+//# sourceMappingURL=layouts.js.map

package/dist/layouts.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"layouts.js","sources":["../src/layouts/LayoutPrimary/LayoutPrimary.styles.tsx","../src/layouts/LayoutPrimary/LayoutPrimary.tsx","../src/layouts/Layout.styles.tsx","../src/layouts/Layout.tsx"],"sourcesContent":["import {css} from \"@linaria/core\";\n\nconst globalPageGutter = '8px';\nexport const globalHeaderHeight = '50px';\nconst globalHeaderWarningHeight = \"0px\";\nconst contentTopSpace = \"12px\";\n\nconst globalHeaderHeightWithSub = '94px';\n\nconst cubicMove = \"cubic-bezier(.65, 0, .35, 1)\";\nconst sidebarWidth = \"250px\";\n\nconst tabletBreakpoint = '1024px';\nconst mobileBreakpoint = '768px';\n\n// TODO: better solution - design tokens\nexport const globals = css`\n    :global() {\n        :root {\n            --xyd-navbar-height: ${globalHeaderHeight};\n            --xyd-global-page-gutter: ${globalPageGutter};\n            --xyd-sidebar-width: ${sidebarWidth};\n        }\n    }\n`;\n\nexport const LayoutPrimaryHost = css`\n    width: 100%;\n    overflow-x: hidden;\n    background: #fff;\n`;\n\nexport const LayoutPrimaryHeader = css`\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    position: fixed;\n    top: ${globalHeaderWarningHeight};\n    right: ${globalPageGutter};\n    left: ${globalPageGutter};\n    height: ${globalHeaderHeight};\n    z-index: 20;\n    background: #fff;\n\n    @media (max-width: 768px) {\n        padding: 0;\n    }\n`;\n\nexport const LayoutPrimaryHeaderContent = css`\n    display: flex;\n    align-items: center;\n    width: 100%;\n`;\n\nexport const LayoutPrimaryHeaderSub = css`\n    flex-direction: column;\n    height: ${globalHeaderHeightWithSub};\n    transition: transform 200ms;\n`;\n\nexport const LayoutPrimaryHeaderHideMain = css`\n    transform: translateY(calc(-${globalHeaderHeight} + 3px));\n`;\n\nexport const LayoutPrimaryHamburgerButton = css`\n    display: none;\n\n    @media (max-width: 768px) {\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        width: 40px;\n        height: 40px;\n        border: none;\n        background: none;\n        cursor: pointer;\n        padding: 0;\n    }\n`;\n\nexport const LayoutPrimaryHamburgerIcon = css`\n    width: 24px;\n    height: 24px;\n    position: relative;\n    display: flex;\n    flex-direction: column;\n    justify-content: space-between;\n`;\n\nexport const LayoutPrimaryHamburgerLine = css`\n    width: 100%;\n    height: 2px;\n    background: #000;\n    transition: transform 0.3s ${cubicMove};\n`;\n\nexport const LayoutPrimaryHamburgerLineOpen = css`\n    &:first-child {\n        transform: translateY(11px) rotate(45deg);\n    }\n    &:nth-child(2) {\n        opacity: 0;\n    }\n    &:last-child {\n        transform: translateY(-11px) rotate(-45deg);\n    }\n`;\n\nexport const LayoutPrimaryMain = css`\n    position: fixed;\n    display: flex;\n    top: calc(${globalHeaderHeight} + ${globalHeaderWarningHeight});\n    bottom: 0;\n    left: 0;\n    right: 0;\n    padding: ${globalPageGutter};\n    overflow: hidden;\n\n    @media (max-width: ${tabletBreakpoint}) {\n        padding-top: calc(${globalHeaderHeight} + ${globalHeaderWarningHeight} + ${globalPageGutter});\n    }\n`;\n\nexport const LayoutPrimaryMainSub = css`\n    top: calc(${globalHeaderHeightWithSub} + ${globalHeaderWarningHeight});\n\n    @media (max-width: ${tabletBreakpoint}) {\n        padding-top: calc(${globalHeaderHeightWithSub} + ${globalHeaderWarningHeight} + ${globalPageGutter});\n    }\n`;\n\nexport const LayoutPrimaryStaticSidebar = css`\n    flex: none;\n    width: ${sidebarWidth};\n    background: #fff;\n    display: flex;\n    flex-direction: column;\n    position: relative;\n    height: 100%;\n    \n    @media (max-width: ${tabletBreakpoint}) {\n        display: none;\n    }\n`;\n\nexport const LayoutPrimaryMobileSidebar = css`\n    display: none;\n\n    @media (max-width: ${tabletBreakpoint}) {\n        display: flex;\n        position: fixed;\n        top: 0;\n        bottom: 0;\n        left: 0;\n        width: ${sidebarWidth};\n        background: #fff;\n        flex-direction: column;\n        z-index: 50;\n        transform: translateX(-100%);\n        transition: transform .3s ${cubicMove};\n        box-shadow: 4px 0 8px rgba(0, 0, 0, 0.1);\n    }\n`;\n\nexport const LayoutPrimaryMobileSidebarOpen = css`\n    @media (max-width: ${tabletBreakpoint}) {\n        transform: translateX(0);\n    }\n`;\n\nexport const LayoutPrimarySidebarContent = css`\n    flex: 1;\n    overflow-y: auto;\n    -webkit-overflow-scrolling: touch;\n    height: 100%;\n`;\n\nexport const LayoutPrimaryCloseButton = css`\n    position: absolute;\n    top: 12px;\n    right: 12px;\n    width: 32px;\n    height: 32px;\n    border: none;\n    background: none;\n    padding: 0;\n    cursor: pointer;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n`;\n\nexport const LayoutPrimarySearchInput = css`\n    width: 100%;\n    height: 40px;\n    padding: 0 12px;\n    border: 1px solid #eaeaea;\n    border-radius: 6px;\n    font-size: 14px;\n    outline: none;\n    transition: border-color 0.2s;\n\n    &:focus {\n        border-color: #666;\n    }\n`;\n\nexport const LayoutPrimaryCloseIcon = css`\n    width: 20px;\n    height: 20px;\n    position: relative;\n\n    &::before,\n    &::after {\n        content: '';\n        position: absolute;\n        top: 50%;\n        left: 0;\n        width: 100%;\n        height: 2px;\n        background: #666;\n        transform-origin: center;\n    }\n\n    &::before {\n        transform: rotate(45deg);\n    }\n\n    &::after {\n        transform: rotate(-45deg);\n    }\n`;\n\nexport const LayoutPrimaryOverlay = css`\n    display: none;\n\n    @media (max-width: ${tabletBreakpoint}) {\n        display: block;\n        position: fixed;\n        top: 0;\n        right: 0;\n        bottom: 0;\n        left: 0;\n        background: rgba(0, 0, 0, 0.6);\n        transition: opacity .3s;\n        opacity: 0;\n        pointer-events: none;\n        z-index: 40;\n        height: 100vh;\n    }\n`;\n\nexport const LayoutPrimaryOverlayVisible = css`\n    opacity: 1;\n    pointer-events: auto;\n`;\n\nexport const LayoutPrimaryPageHost = css`\n    position: relative;\n    flex: 1;\n    background: #fff;\n    overflow: hidden;\n    min-width: 0;\n    height: 100%;\n`;\n\nexport const LayoutPrimaryPageScroll = css`\n    overflow-y: auto;\n    height: 100%;\n    -webkit-overflow-scrolling: touch;\n    padding: 0 48px;\n\n    @media (max-width: ${tabletBreakpoint}) {\n        padding: 0 32px;\n    }\n\n    @media (max-width: ${mobileBreakpoint}) {\n        padding: 0 24px;\n    }\n`;\n\nexport const LayoutPrimaryPageContainer = css`\n    max-width: 1000px;\n    margin: 0 auto;\n    padding: 0 ${globalPageGutter};\n`;\n\nexport const LayoutPrimaryPageContainerLarge = css`\n    max-width: 1200px;\n`;\n\nexport const LayoutPrimaryPageArticleContainer = css`\n    display: flex;\n    gap: 48px;\n    padding: 48px 0;\n    min-height: 100%;\n\n    @media (max-width: ${tabletBreakpoint}) {\n        gap: 32px;\n    }\n\n    @media (max-width: ${mobileBreakpoint}) {\n        flex-direction: column;\n        padding: 24px 0;\n        gap: 24px;\n    }\n`;\n\nexport const LayoutPrimaryArticleHost = css`\n    flex: 1;\n    min-width: 0;\n`;\n\nexport const LayoutPrimaryArticleContent = css`\n    width: 100%;\n`;\n\nexport const LayoutPrimaryArticleNav = css`\n    flex: none;\n    width: 256px;\n    position: sticky;\n    top: 0;\n    height: fit-content;\n    max-height: 100vh;\n    overflow-y: auto;\n    padding-right: 24px;\n    padding-top: ${contentTopSpace};\n\n    @media (max-width: ${tabletBreakpoint}) {\n        width: 200px;\n        padding-right: 16px;\n    }\n\n    @media (max-width: ${mobileBreakpoint}) {\n        width: 100%;\n        position: static;\n        max-height: none;\n        padding-right: 0;\n    }\n`;","import React, {useEffect, useState} from \"react\"\n\nimport * as cn from \"./LayoutPrimary.styles\"\n\nexport interface LayoutPrimaryProps {\n    header: React.ReactNode;\n    aside: React.ReactNode;\n    content: React.ReactNode;\n    contentNav?: React.ReactNode;\n\n    subheader?: React.ReactNode;\n    layoutSize?: \"large\"\n}\n\n// TODO: move scroller to xyd-foo\nexport function LayoutPrimary(props: LayoutPrimaryProps) {\n    const [isMobileNavOpen, setIsMobileNavOpen] = useState(false)\n\n    const {hideMainHeader} = props.subheader ? useSubHeader() : {hideMainHeader: false}\n\n    return <div className={cn.LayoutPrimaryHost}>\n        <header className={` \n            ${cn.LayoutPrimaryHeader}\n            ${props.subheader && cn.LayoutPrimaryHeaderSub}\n            ${hideMainHeader && cn.LayoutPrimaryHeaderHideMain}\n        `}>\n            <div className={cn.LayoutPrimaryHeaderContent}>\n                {props.header}\n                <button\n                    className={cn.LayoutPrimaryHamburgerButton}\n                    onClick={() => setIsMobileNavOpen(!isMobileNavOpen)}\n                    aria-label=\"Toggle navigation menu\"\n                >\n                    <div className={cn.LayoutPrimaryHamburgerIcon}>\n                        <span\n                            className={`${cn.LayoutPrimaryHamburgerLine} ${isMobileNavOpen ? cn.LayoutPrimaryHamburgerLineOpen : ''}`}/>\n                        <span\n                            className={`${cn.LayoutPrimaryHamburgerLine} ${isMobileNavOpen ? cn.LayoutPrimaryHamburgerLineOpen : ''}`}/>\n                        <span\n                            className={`${cn.LayoutPrimaryHamburgerLine} ${isMobileNavOpen ? cn.LayoutPrimaryHamburgerLineOpen : ''}`}/>\n                    </div>\n                </button>\n            </div>\n            {props.subheader}\n        </header>\n\n        {/* Mobile Drawer Sidebar */}\n        <div\n            className={`${cn.LayoutPrimaryOverlay} ${isMobileNavOpen ? cn.LayoutPrimaryOverlayVisible : ''}`}\n            onClick={() => setIsMobileNavOpen(false)}\n        />\n        <aside className={`\n            ${cn.LayoutPrimaryMobileSidebar}\n            ${isMobileNavOpen ? cn.LayoutPrimaryMobileSidebarOpen : ''}\n        `}>\n            <div className={cn.LayoutPrimarySidebarContent}>\n                {props.aside}\n            </div>\n            <button\n                className={cn.LayoutPrimaryCloseButton}\n                onClick={() => setIsMobileNavOpen(false)}\n                aria-label=\"Close navigation menu\"\n            >\n                <div className={cn.LayoutPrimaryCloseIcon}/>\n            </button>\n        </aside>\n\n        <main className={`\n            ${cn.LayoutPrimaryMain}\n            ${!hideMainHeader && props.subheader && cn.LayoutPrimaryMainSub}\n        `}>\n            {/* Desktop Static Sidebar */}\n            <aside className={cn.LayoutPrimaryStaticSidebar}>\n                {props.aside}\n            </aside>\n\n            <div className={cn.LayoutPrimaryPageHost}>\n                <div className={cn.LayoutPrimaryPageScroll}>\n                    <div className={`\n                        ${cn.LayoutPrimaryPageContainer}\n                        ${props.layoutSize == \"large\" && cn.LayoutPrimaryPageContainerLarge}\n                    `}>\n                        <div className={cn.LayoutPrimaryPageArticleContainer}>\n                            <article className={cn.LayoutPrimaryArticleHost}>\n                                <section className={cn.LayoutPrimaryArticleContent}>\n                                    {props.content}\n                                </section>\n                            </article>\n                            {props.contentNav && <nav className={cn.LayoutPrimaryArticleNav}>\n                                {props.contentNav}\n                            </nav>}\n                        </div>\n                    </div>\n                </div>\n            </div>\n        </main>\n    </div>\n}\n\n// TODO: move to `xyd-foo` or somewhere else\nfunction useSubHeader() {\n    const [hideMainHeader, setHideMainHeader] = useState(false)\n    const [scrollTop, setScrollTop] = useState(0)\n    const [controlScrollPos, setControlScrollPos] = useState(0)\n\n    useEffect(() => {\n        if (scrollTop === controlScrollPos) {\n            return\n        }\n\n        const checkpoint = parseInt(cn.globalHeaderHeight, 10) / 2\n        const diff = scrollTop - controlScrollPos\n        const reversePosDiff = Math.abs(scrollTop - controlScrollPos)\n\n        if (diff > checkpoint) {\n            setHideMainHeader(true)\n        } else if (reversePosDiff > checkpoint) {\n            setHideMainHeader(false)\n        }\n    }, [\n        scrollTop,\n        controlScrollPos,\n    ]);\n\n    function onScroll(e: Event) {\n        if (!(e.target instanceof HTMLElement)) {\n            return\n        }\n\n        const scroll = e.target?.scrollTop\n        setScrollTop(scroll)\n    }\n\n    function onScrollFinish(e: Event) {\n        if (!(e.target instanceof HTMLElement)) {\n            return\n        }\n\n        setControlScrollPos(e.target?.scrollTop)\n    }\n\n    // TODO: by ref?\n    // TODO: MOVE SOMEWHERE ELSE BECAUSE IT DECREASE PERFORMANCE (RERENDER)\n    useEffect(() => {\n        document.querySelector(`.${cn.LayoutPrimaryPageScroll}`)?.addEventListener(\"scroll\", onScroll)\n        document.querySelector(`.${cn.LayoutPrimaryPageScroll}`)?.addEventListener(\"scrollend\", onScrollFinish)\n\n        return () => {\n            document.querySelector(`.${cn.LayoutPrimaryPageScroll}`)?.removeEventListener(\"scroll\", onScroll)\n            document.querySelector(`.${cn.LayoutPrimaryPageScroll}`)?.removeEventListener(\"scrollend\", onScrollFinish)\n        }\n    }, []);\n\n    return {\n        hideMainHeader,\n    }\n}","import {css} from \"@linaria/core\";\n\nconst globalPageGutter = '8px';\nexport const globalHeaderHeight = '40px';\nconst globalHeaderWarningHeight = \"0px\";\nconst contentTopSpace = \"12px\";\n\nconst globalHeaderHeightWithSub = '94px';\n\nconst cubicMove = \"cubic-bezier(.65, 0, .35, 1)\";\nconst sidebarWidth = \"210px\";\n\n// TODO: better solution - design tokens\nexport const globals = css`\n    :global() {\n        :root {\n            --xyd-navbar-height: ${globalHeaderHeight};\n            --xyd-global-page-gutter: ${globalPageGutter};\n        }\n    }\n`;\n\nexport const LayoutHost = css`\n    width: 100%;\n`;\n\nexport const LayoutHeader = css`\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n\n    position: fixed;\n    top: ${globalHeaderWarningHeight};\n    right: ${globalPageGutter};\n    left: ${globalPageGutter};\n\n    height: ${globalHeaderHeight};\n`;\n\nexport const LayoutHeaderSub = css`\n    flex-direction: column;\n    height: ${globalHeaderHeightWithSub};\n    transition: transform 200ms;\n`;\n\nexport const LayoutHeaderHideMain = css`\n    transform: translateY(calc(-${globalHeaderHeight} + 3px));\n`;\n\nexport const LayoutMain = css`\n    position: fixed;\n    top: calc(${globalHeaderHeight} + ${globalHeaderWarningHeight});\n    bottom: ${globalPageGutter};\n    left: ${globalPageGutter};\n    right: ${globalPageGutter};\n}`;\n\nexport const LayoutMainSub = css`\n    top: calc(${globalHeaderHeightWithSub} + ${globalHeaderWarningHeight});\n    transition: top 200ms;\n`;\n\nexport const LayoutSidebar = css`\n    flex-direction: column;\n    position: absolute;\n    top: 0;\n    left: 0;\n    bottom: 0;\n    right: 0;\n    z-index: 101;\n    width: ${sidebarWidth};\n    border: 0;\n    padding: ${contentTopSpace} 0 0;\n    overflow: visible;\n    background: none;\n    border-radius: 0;\n    opacity: 1;\n    visibility: visible;\n    transition: opacity .3s ${cubicMove};\n`;\n\nexport const PageHost = css`\n    position: absolute;\n    top: ${contentTopSpace};\n    right: 0;\n    bottom: 0;\n    z-index: 201;\n    background: #fff;\n\n    //border-radius: 8px;\n    //border: 1px solid #ececf1;\n\n    overflow: hidden;\n    transition: opacity .3s ${cubicMove};\n\n    left: ${sidebarWidth};\n`;\n\nexport const PageScroll = css`\n    //position: absolute;\n    //top: 0;\n    //right: 0;\n    //bottom: 0;\n    //left: 0;\n    //overflow: auto;\n\n    overflow: scroll;\n    height: 100%;\n`;\n\nexport const PageContainer = css`\n    padding: 0;\n    width: 100%;\n    //position: relative; TODO: unset if during client render?\n    min-height: 100%;\n\n    max-width: 100%;\n    margin: 0 auto;\n    font-size: 15px;\n    line-height: 24px;\n`;\n\nexport const PageArticleContainer = css`\n    width: 980px;\n    padding: 40px 56px;\n    padding-top: 20px;\n    max-width: 100%;\n    margin: 0 auto;\n`;\n\nexport const PageArticleContainerFullWidth = css`\n    width: 1200px;\n`;\n\nexport const ArticleHost = css`\n    display: flex;\n    gap: 30px;\n    width: 100%;\n    align-items: flex-start;;\n`;\n\nexport const ArticleContent = css`\n    flex: 1 1 0;\n    overflow: hidden;\n`;\n\nexport const ArticleNav = css`\n    position: sticky;\n    top: 30px;\n    width: 180px;\n    margin-top: 0;\n    margin-left: 50px;\n    padding-left: 16px;\n    flex: none;\n`;","import React, {useEffect, useState} from \"react\"\n\nimport * as cn from \"./Layout.styles\"\n\nexport interface LayoutProps {\n    header: React.ReactNode;\n    aside: React.ReactNode;\n    content: React.ReactNode;\n    contentNav: React.ReactNode;\n    subheader?: boolean;\n    kind?: \"fullwidth\"\n}\n\nexport function Layout(props: LayoutProps) {\n    const [hideMainHeader, setHideMainHeader] = useState(false)\n    const [scrollTop, setScrollTop] = useState(0)\n    const [controlScrollPos, setControlScrollPos] = useState(0)\n\n    useEffect(() => {\n        if (scrollTop === controlScrollPos) {\n            return\n        }\n\n        const checkpoint = parseInt(cn.globalHeaderHeight, 10) / 2\n        const diff = scrollTop - controlScrollPos\n        const reversePosDiff = Math.abs(scrollTop - controlScrollPos)\n\n        if (diff > checkpoint) {\n            setHideMainHeader(true)\n        } else if (reversePosDiff > checkpoint) {\n            setHideMainHeader(false)\n        }\n    }, [\n        scrollTop,\n        controlScrollPos,\n    ]);\n\n    function onScroll(e: Event) {\n        if (!(e.target instanceof HTMLElement)) {\n            return\n        }\n\n        const scroll = e.target?.scrollTop\n        setScrollTop(scroll)\n    }\n\n    function onScrollFinish(e: Event) {\n        if (!(e.target instanceof HTMLElement)) {\n            return\n        }\n\n        setControlScrollPos(e.target?.scrollTop)\n    }\n\n    // TODO: by ref?\n    // TODO: MOVE SOMEWHERE ELSE BECAUSE IT DECREASE PERFORMANCE (RERENDER)\n    useEffect(() => {\n        // return // TODO: UNCOMMENT\n\n        if (!props.subheader) {\n            return\n        }\n\n        document.querySelector(`.${cn.PageScroll}`)?.addEventListener(\"scroll\", onScroll)\n        document.querySelector(`.${cn.PageScroll}`)?.addEventListener(\"scrollend\", onScrollFinish)\n\n        return () => {\n            document.querySelector(`.${cn.PageScroll}`)?.removeEventListener(\"scroll\", onScroll)\n            document.querySelector(`.${cn.PageScroll}`)?.removeEventListener(\"scrollend\", onScrollFinish)\n        }\n    }, []);\n\n    return <div className={cn.LayoutHost}>\n        <Layout.Header className={`\n            ${props.subheader && cn.LayoutHeaderSub}\n            ${hideMainHeader && cn.LayoutHeaderHideMain}\n        `}>\n            {props.header}\n        </Layout.Header>\n        <main className={`\n            ${cn.LayoutMain}\n            ${!hideMainHeader && props.subheader && cn.LayoutMainSub}\n        `}>\n            <aside className={cn.LayoutSidebar}>\n                {props.aside}\n            </aside>\n            <div className={cn.PageHost}>\n                <div className={cn.PageScroll}>\n                    <div className={cn.PageContainer}>\n                        <div className={`\n                            ${cn.PageArticleContainer}\n                            ${props.kind == \"fullwidth\" && cn.PageArticleContainerFullWidth}\n                        `}>\n                            <article className={cn.ArticleHost}>\n                                <section className={cn.ArticleContent}>\n                                    {props.content}\n                                </section>\n                                {\n                                    props.contentNav && <nav className={cn.ArticleNav}>\n                                        {props.contentNav}\n                                    </nav>\n                                }\n                            </article>\n                        </div>\n                    </div>\n                </div>\n            </div>\n        </main>\n    </div>\n}\n\nLayout.Header = function LayoutHeader({className, children}: { className?: string, children: React.ReactNode }) {\n    return <header className={`\n            ${cn.LayoutHeader}\n            ${className}\n        `}>\n        {children}\n    </header>\n}\n"],"names":["globalHeaderHeight","LayoutPrimaryHamburgerLine","LayoutPrimaryHamburgerLineOpen","LayoutPrimaryPageScroll","LayoutPrimary","props","_useState","useState","_useState2","_slicedToArray","isMobileNavOpen","setIsMobileNavOpen","_ref","subheader","_useState3","_useState4","hideMainHeader","setHideMainHeader","_useState5","_useState6","scrollTop","setScrollTop","_useState7","_useState8","controlScrollPos","setControlScrollPos","onScroll","e","target","HTMLElement","scroll","_a","onScrollFinish","useEffect","checkpoint","parseInt","cn","diff","reversePosDiff","Math","abs","document","querySelector","concat","addEventListener","_b","removeEventListener","useSubHeader","React","createElement","className","header","onClick","aside","layoutSize","content","contentNav","PageScroll","Layout","Header","kind","children"],"mappings":"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"}

package/dist/pages.d.ts

@@ -27,4 +27,5 @@ interface HomePageProps {
 }
 declare function HomePage(props: HomePageProps): React.JSX.Element;
 
-export { HomePage, type HomePageProps, type IHomePageFeature, type IHomePageHero, type IHomePageHeroAction };
+export { HomePage };
+export type { HomePageProps, IHomePageFeature, IHomePageHero, IHomePageHeroAction };

package/dist/pages.js

@@ -1 +1,2 @@
-import e from"react";import"./tslib.es6-C3PNVQlC.js";import"@radix-ui/react-icons";import{G as t}from"./UnderlineNav-C8onw9Na.js";import{C as r,B as n}from"./CTABanner-CWX9isVG.js";import{H as i}from"./HomeView-CnAj-VYl.js";import"./_rollupPluginBabelHelpers-DfQAiTCw.js";import"@radix-ui/react-tabs";import"lucide-react";var o="hfe0p8m";function l(t){var r;return e.createElement(i,{header:t.header,body:e.createElement(i.Body,null,e.createElement(a,Object.assign({},t)),(null===(r=t.hero)||void 0===r?void 0:r.actions)&&e.createElement(c,Object.assign({},t)),t.children),footer:t.footer})}function a(t){var i,o,l,a,c;return e.createElement(r,null,e.createElement(r.Heading,{title:(null===(i=t.hero)||void 0===i?void 0:i.text)||"",headingEffect:null===(o=t.hero)||void 0===o?void 0:o.textEffect,subtitle:null===(l=t.hero)||void 0===l?void 0:l.subtitle}),(null===(a=null==t?void 0:t.hero)||void 0===a?void 0:a.actions)&&e.createElement(r.ButtonGroup,null,null===(c=null==t?void 0:t.hero)||void 0===c?void 0:c.actions.map((function(t,r){return e.createElement("a",{href:t.href},e.createElement(n,{key:t.text+r,kind:t.kind},t.text))}))))}function c(r){var n;return e.createElement("div",{className:"\n            ".concat(o,"\n            xyd_page-comp-homepage-cards\n        ")},null===(n=r.features)||void 0===n?void 0:n.map((function(r,n){return e.createElement(t,{key:r.title+n,href:r.href||"",title:r.title,icon:r.icon,kind:"secondary",size:"md"},r.description)})))}export{l as HomePage};
+import e from"react";import"./tslib.es6-CNVK7Xcu.js";import"@radix-ui/react-icons";import{G as t}from"./UnderlineNav-3-KptDYD.js";import{C as o,B as r}from"./CTABanner-BQx2SLf8.js";import{H as n}from"./HomeView-CHSb4HL6.js";import"./_rollupPluginBabelHelpers-D0XU6lDu.js";import"@radix-ui/react-tabs";import"lucide-react";function i(t){var o;return e.createElement(n,{header:t.header,body:e.createElement(n.Body,null,e.createElement(l,Object.assign({},t)),(null===(o=t.hero)||void 0===o?void 0:o.actions)&&e.createElement(a,Object.assign({},t)),t.children),footer:t.footer})}function l(t){var n,i,l,a,d,c,s="string"==typeof(null===(n=t.hero)||void 0===n?void 0:n.subtitle)?t.hero.subtitle:(null===(l=null===(i=t.hero)||void 0===i?void 0:i.subtitle)||void 0===l?void 0:l.toString())||"";return e.createElement(o,null,e.createElement(o.Heading,{title:(null===(a=t.hero)||void 0===a?void 0:a.text)||"",subtitle:s}),(null===(d=null==t?void 0:t.hero)||void 0===d?void 0:d.actions)&&e.createElement(o.ButtonGroup,null,null===(c=null==t?void 0:t.hero)||void 0===c?void 0:c.actions.map((function(t,o){return e.createElement("a",{href:t.href},e.createElement(r,{key:t.text+o,kind:t.kind},t.text))}))))}function a(o){var r;return e.createElement("div",{className:"\n            ".concat("XydComponents-Component-pages-HomePage__HomePageCardsHost","\n            xyd_page-comp-homepage-cards\n        ")},null===(r=o.features)||void 0===r?void 0:r.map((function(o,r){return e.createElement(t,{key:o.title+r,href:o.href||"",title:o.title,icon:o.icon,kind:"secondary",size:"md"},o.description)})))}export{i as HomePage};
+//# sourceMappingURL=pages.js.map