@xyd-js/components 0.1.0-build.168

package/dist/PageFirstSlide-BDNmCTiJ.js

@@ -0,0 +1,2 @@
+import{a as e}from"./_rollupPluginBabelHelpers-CvhQFv1t.js";import*as t from"react";import n from"react";import{H as a,b as r,G as l,N as i,L as o}from"./VideoGuide-DBY-EyxG.js";import"./Icon--77MqplU.js";import{T as c}from"./TabsAnalytics-B_JYpawG.js";import"./useUXEvents-CJtgGV4R.js";import{B as s}from"./Button-BLA2ghHZ.js";function m(n){var o,s=n.posts,m=void 0===s?[]:s,d=n.tabs,u=void 0===d?[]:d,v=n.initialTab,p=n.heading,E=n.subheading,h=n.prevLink,g=n.nextLink,f=n.as,y=void 0===f?"":f,b=t.useState(v||u&&(null===(o=u[0])||void 0===o?void 0:o.value)||""),z=e(b,2),k=z[0],B=z[1],j=t.useMemo(function(){return"everything"===k?m:null==m?void 0:m.filter(function(e){return e.tag.toLowerCase()===k})},[k,m]);return t.createElement("page-blog-home",{className:"p1evzq73"},t.createElement(a,{size:1,subtitle:E},p),t.createElement(r,{value:k,onChange:B},u.map(function(e){return t.createElement(r.Item,{as:y,href:e.href,value:e.value},e.label)})),t.createElement("div",{part:"posts"},j.map(function(e){return t.createElement(l,{key:e.id,href:e.href,kind:"secondary",size:"md"},t.createElement("div",{part:"card-content"},t.createElement("div",{part:"card-image"},t.createElement("img",{src:e.image,alt:e.title})),t.createElement(c,{size:"small",kind:"primary",as:"span"},e.tag),t.createElement(l.Title,null,t.createElement(c,{size:"large",weight:"bold",as:"span"},e.title)),t.createElement("div",{part:"card-author-row"},t.createElement("img",{src:e.author.avatar,alt:e.author.name,part:"card-author-avatar"}),t.createElement(c,{size:"small",as:"span"},e.author.name),t.createElement(c,{size:"small",kind:"secondary",as:"span"},e.date))))})),t.createElement("div",{part:"pagination"},t.createElement(i,{prev:h,next:g})))}var d="g1wc20vm";function u(e){var t=e.children,a=e.cols;return n.createElement("xyd-grid-decorator",{className:d,"data-cols":a},t)}function v(e){var n,r,i,c,m;return t.createElement("page-home",{className:"p1liujz1"},t.createElement("div",{part:"hero"},(null===(n=null==e?void 0:e.hero)||void 0===n?void 0:n.image)?t.createElement("img",{src:e.hero.image,alt:e.hero.title}):null,t.createElement(a,{size:1},null===(r=e.hero)||void 0===r?void 0:r.title),t.createElement(a,{size:3,kind:"muted"},null===(i=e.hero)||void 0===i?void 0:i.description),(null===(c=null==e?void 0:e.hero)||void 0===c?void 0:c.button)?t.createElement(s,{href:e.hero.button.href},e.hero.button.title):null),t.createElement("div",{part:"sections"},null===(m=e.sections)||void 0===m?void 0:m.map(function(e,n){var r,i;return t.createElement(t.Fragment,{key:"".concat(e.title,"-").concat(n)},(null==e?void 0:e.title)?t.createElement("div",{part:"section-title"},t.createElement(a,{size:3},e.title)):null,(null===(r=null==e?void 0:e.cards)||void 0===r?void 0:r.length)?t.createElement("div",{part:"section-cards"},t.createElement(u,{cols:3},t.createElement(o,null,t.createElement(o.Item,null,t.createElement(o,null,null===(i=e.cards)||void 0===i?void 0:i.map(function(e,n){return t.createElement(o.Item,{key:"".concat(e.title,"-").concat(n)},t.createElement(l,Object.assign({},e)))})))))):null)})))}function p(e){var n,r,l,i;return t.createElement("page-first-slide",{className:"p1s96yum"},t.createElement("div",{part:"left"},(null===(n=e.content)||void 0===n?void 0:n.title)&&t.createElement(a,{size:1},e.content.title),(null===(r=e.content)||void 0===r?void 0:r.description)&&t.createElement(a,{size:4,kind:"muted"},e.content.description),t.createElement("div",{part:"buttons"},(null===(l=e.content)||void 0===l?void 0:l.primaryButton)&&t.createElement(s,{href:e.content.primaryButton.href,kind:e.content.primaryButton.kind||"primary",size:"lg",disabled:e.content.primaryButton.disabled},e.content.primaryButton.title),(null===(i=e.content)||void 0===i?void 0:i.secondaryButton)&&t.createElement(s,{href:e.content.secondaryButton.href,kind:e.content.secondaryButton.kind||"secondary",size:"lg",disabled:e.content.secondaryButton.disabled},e.content.secondaryButton.title))),t.createElement("div",{part:"right"},e.rightContent))}export{u as G,m as P,v as a,p as b};
+//# sourceMappingURL=PageFirstSlide-BDNmCTiJ.js.map

package/dist/PageFirstSlide-BDNmCTiJ.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PageFirstSlide-BDNmCTiJ.js","sources":["../src/pages/PageBlogHome/PageBlogHome.tsx","../src/pages/PageBlogHome/PageBlogHome.styles.tsx","../src/content/GridDecorator.styles.tsx","../src/content/GridDecorator.tsx","../src/pages/PageHome/PageHome.tsx","../src/pages/PageHome/PageHome.styles.tsx","../src/pages/PageFirstSlide/PageFirstSlide.tsx","../src/pages/PageFirstSlide/PageFirstSlide.styles.tsx"],"sourcesContent":["import * as React from \"react\"\n\nimport { Heading, NavLinks, Tabs, GuideCard, Text } from \"../../writer\"\n\nimport * as cn from \"./PageBlogHome.styles\"\nimport { PageBlogHomeProps, BlogPost, BlogTab } from \"./types\"\n\nexport function PageBlogHome({\n    posts = [],\n    tabs = [],\n    initialTab,\n    heading,\n    subheading,\n    prevLink,\n    nextLink,\n    as = \"\",\n}: PageBlogHomeProps) {\n    const [tab, setTab] = React.useState(initialTab || (tabs && tabs[0]?.value) || \"\")\n\n    const filteredPosts = React.useMemo(() => {\n        if (tab === \"everything\") return posts\n        return posts?.filter(post => post.tag.toLowerCase() === tab)\n    }, [tab, posts])\n\n    return <page-blog-home className={cn.PageBlogHome}>\n        <Heading size={1} subtitle={subheading}>{heading}</Heading>\n        <Tabs value={tab} onChange={setTab}>\n            {tabs.map(t => (\n                <Tabs.Item as={as} href={t.href} value={t.value}>{t.label}</Tabs.Item>\n            ))}\n        </Tabs>\n        <div part=\"posts\">\n            {filteredPosts.map(post => (\n                <GuideCard\n                    key={post.id}\n                    href={post.href}\n                    kind=\"secondary\"\n                    size=\"md\"\n                >\n                    <div part=\"card-content\">\n                        <div part=\"card-image\">\n                            <img src={post.image} alt={post.title} />\n                        </div>\n                        <Text size=\"small\" kind=\"primary\" as=\"span\">{post.tag}</Text>\n                        <GuideCard.Title>\n                            <Text size=\"large\" weight=\"bold\" as=\"span\">{post.title}</Text>\n                        </GuideCard.Title>\n                        <div part=\"card-author-row\">\n                            <img src={post.author.avatar} alt={post.author.name} part=\"card-author-avatar\" />\n                            <Text size=\"small\" as=\"span\">{post.author.name}</Text>\n                            <Text size=\"small\" kind=\"secondary\" as=\"span\">{post.date}</Text>\n                        </div>\n                    </div>\n                </GuideCard>\n            ))}\n        </div>\n        <div part=\"pagination\">\n            <NavLinks\n                prev={prevLink}\n                next={nextLink}\n            />\n        </div>\n    </page-blog-home>\n}","import { css } from \"@linaria/core\"\n\nexport const PageBlogHome = css`\n    --page-blog-home-padding: calc(var(--xyd-nav-item-padding) + var(--xyd-nav-padding));\n    max-width: var(--page-bloghome-max-width, 800px);\n    margin: 0 auto;\n    padding: 48px var(--page-blog-home-padding) 0 var(--page-blog-home-padding);\n    display: flex;\n    flex-direction: column;\n\n    [part=\"posts\"] {\n        --spacing: .25rem;\n        display: grid;\n        grid-template-columns: repeat(auto-fill, minmax(calc(var(--spacing) * 80), 1fr));\n        grid-gap: calc(var(--spacing) * 12) calc(var(--spacing) * 8);\n        min-height: 430px;\n        \n        margin-top: 24px;\n        margin-bottom: 24px;\n    }\n\n    [part=\"pagination\"] {\n        margin-top: 32px;\n    }\n\n    [part=\"card-content\"] {\n        display: flex;\n        flex-direction: column;\n        gap: 12px;\n    }\n\n    [part=\"card-image\"] {\n        width: 100%;\n        height: 180px;\n        overflow: hidden;\n        border-radius: 8px;\n        margin-bottom: 16px;\n        img {\n            width: 100%;\n            height: 100%;\n            object-fit: cover;\n            display: block;\n        }\n    }\n\n    [part=\"card-author-row\"] {\n        display: flex;\n        align-items: end;\n        flex: 1;\n        gap: 8px;\n        margin-top: 8px;\n    }\n\n    [part=\"card-author-avatar\"] {\n        width: 32px;\n        height: 32px;\n        border-radius: 50%;\n        object-fit: cover;\n        display: block;\n    }\n\n    xyd-guidecard {\n        [part=\"right\"], [part=\"body\"], [part=\"card-content\"] {\n            height: 100%;\n        }\n    }\n`;","import { css } from \"@linaria/core\";\n\nexport default {\n    GridDecoratorHost: css`\n        @layer components {\n            display: grid;\n            gap: 1rem;\n            width: 100%;\n\n            /* First level ul - 1fr */\n            > ul {\n                display: grid;\n                grid-template-columns: 1fr;\n                gap: 1rem;\n                width: 100%;\n            }\n\n            /* Nested ul - 2fr */\n            ul ul {\n                display: grid;\n                grid-template-columns: repeat(2, 1fr);\n                gap: 1rem;\n                width: 100%;\n            }\n\n\n            &[data-cols=\"2\"] { --data-cols: 2; }\n            &[data-cols=\"3\"] { --data-cols: 3; }\n            &[data-cols=\"4\"] { --data-cols: 4; }\n            &[data-cols=\"5\"] { --data-cols: 5; }\n            &[data-cols=\"6\"] { --data-cols: 6; }\n\n            &[data-cols] {\n                --cols: var(--data-cols, 2);\n                ul ul {\n                    grid-template-columns: repeat(var(--cols), 1fr);\n                }\n            }\n\n            @media (max-width: 768px) {\n                > ul {\n                    gap: 0;\n                }\n                ul ul {\n                    grid-template-columns: 1fr;\n                }\n                \n                /* Override data-cols for mobile */\n                &[data-cols] {\n                    --data-cols: 1;\n                }\n            }\n\n            /* Tablet breakpoint for 2 columns */\n            @media (min-width: 769px) and (max-width: 1024px) {\n                ul ul {\n                    grid-template-columns: repeat(2, 1fr);\n                }\n                \n                /* Override data-cols for tablet */\n                &[data-cols] {\n                    --data-cols: 2;\n                }\n            }\n\n\n            ul, ol, li {\n                &::before {\n                    content: none;\n                }\n            }\n\n            ul, ol {\n                display: grid;\n                margin: 0;\n                padding: 0 !important;\n                list-style: none;\n            }\n\n            li {\n                margin-left: 0 !important;\n                padding-left: 0 !important;\n            }\n        }\n    `\n}\n","import React from 'react'\n\nimport cn from \"./GridDecorator.styles\";\n\nexport interface GridDecoratorProps {\n    children: React.ReactNode\n    cols?: 2 | 3 | 4 | 5 | 6\n}\n\n/**\n * A wrapper component that applies grid decoration styling to its children.\n * This component uses a custom element `xyd-grid-decorator` to provide grid-based layout decoration.\n *\n * @category Component\n */\nexport function GridDecorator({ children, cols }: GridDecoratorProps) {\n    return <xyd-grid-decorator\n        className={cn.GridDecoratorHost}\n        data-cols={cols}\n    >\n        {children}\n    </xyd-grid-decorator>\n}\n","import * as React from \"react\"\n\nimport {\n    Heading,\n    GuideCard,\n    List,\n    Button,\n} from \"../../writer\";\n\n\nimport { PageHomeProps } from \"./types\";\nimport { GridDecorator } from \"../../content/GridDecorator\";\n\nimport * as cn from \"./PageHome.styles\"\n\nexport function PageHome(props: PageHomeProps) {\n    return <page-home className={cn.PageHome}>\n        <div part=\"hero\">\n            {props?.hero?.image ? <img src={props.hero.image} alt={props.hero.title} /> : null}\n            <Heading size={1}>\n                {props.hero?.title}\n            </Heading>\n            <Heading size={3} kind=\"muted\">\n                {props.hero?.description}\n            </Heading>\n\n            {props?.hero?.button ? <Button href={props.hero.button.href}>{props.hero.button.title}</Button> : null}\n        </div>\n\n        <div part=\"sections\">\n            {\n                props.sections?.map((section, index) => <React.Fragment key={`${section.title}-${index}`}>\n                    {\n                        section?.title ? <div part=\"section-title\">\n                            <Heading size={3}>\n                                {section.title}\n                            </Heading>\n                        </div> : null\n                    }\n\n                    {\n                        section?.cards?.length ? <div part=\"section-cards\">\n                            <GridDecorator cols={3}>\n                                <List>\n                                    <List.Item>\n                                        <List>\n                                            {section.cards?.map((card, index) => (\n                                                <List.Item key={`${card.title}-${index}`}>\n                                                    <GuideCard {...card} />\n                                                </List.Item>\n                                            ))}\n                                        </List>\n                                    </List.Item>\n                                </List>\n                            </GridDecorator>\n                        </div> : null\n                    }\n                </React.Fragment>)\n            }\n        </div>\n    </page-home>\n}","import { css } from \"@linaria/core\";\n\nexport const globals = css`\n    :global() {\n        :root {\n            --page-home-hero-font-size: 50px;\n        }\n    }\n`;\n\nexport const PageHome = css`\n    [part=\"hero\"] {\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        flex-direction: column;\n        padding: 80px 50px;\n        background: var(--page-home-hero-background);\n\n        h1 {\n            font-size: var(--page-home-hero-font-size, 50px);\n            text-align: center;\n        }\n        h1, h2, h3, h4, h5, h6 {\n            font-weight: 400;\n        }\n\n        img {\n            width: auto;\n            max-height: 60px;\n            padding-bottom: 18px;\n        }\n\n        [data-button=\"true\"] {\n            margin-top: var(--xyd-padding-xlarge);\n        }\n    }\n\n    [part=\"sections\"] {\n        max-width: var(--page-home-container-width, 1300px);\n        margin: 0 auto;\n        padding: 30px 100px;\n    }\n\n    @media (max-width: 1024px) {\n        [part=\"sections\"] {\n            padding: 25px;\n            padding-inline: var(--theme-sidebar-padding-total, 25px);\n        }\n    }\n`; ","import * as React from \"react\"\n\nimport {\n    Heading,\n    Button,\n} from \"../../writer\";\n\nimport { PageFirstSlideProps } from \"./types\";\n\nimport * as cn from \"./PageFirstSlide.styles\"\n\nexport function PageFirstSlide(props: PageFirstSlideProps) {\n    return <page-first-slide className={cn.PageFirstSlide}>\n        <div part=\"left\">\n            {props.content?.title && (\n                <Heading size={1}>\n                    {props.content.title}\n                </Heading>\n            )}\n\n            {props.content?.description && (\n                <Heading size={4} kind=\"muted\">\n                    {props.content.description}\n                </Heading>\n            )}\n\n            <div part=\"buttons\">\n                {props.content?.primaryButton && (\n                    <Button\n                        href={props.content.primaryButton.href}\n                        kind={props.content.primaryButton.kind || \"primary\"}\n                        size=\"lg\"\n                        disabled={props.content.primaryButton.disabled}\n                    >\n                        {props.content.primaryButton.title}\n                    </Button>\n                )}\n\n                {props.content?.secondaryButton && (\n                    <Button\n                        href={props.content.secondaryButton.href}\n                        kind={props.content.secondaryButton.kind || \"secondary\"}\n                        size=\"lg\"\n                        disabled={props.content.secondaryButton.disabled}\n                    >\n                        {props.content.secondaryButton.title}\n                    </Button>\n                )}\n            </div>\n        </div>\n\n        <div part=\"right\">\n            {props.rightContent}\n        </div>\n    </page-first-slide>\n} ","import { css } from \"@linaria/core\";\n\nexport const globals = css`\n    :global() {\n        @layer themedecorator {\n            xyd-layout-primary[data-layout=\"page\"] {\n                [part=\"page-article-content\"] {\n                    height: 100%;\n                }\n            }\n            @media (min-width: 1024px) {\n                xyd-layout-primary[data-layout=\"page\"] {\n                    grid-template-rows: auto 1fr auto;\n                    grid-template-columns: 1fr;\n                    width: 100%;\n                    height: max-content;\n                    min-height: 100%;\n                    display: grid;\n                }\n            }\n            \n            body:has(xyd-layout-primary[data-layout=\"page\"]) {\n                height: 100%;\n            }\n            html:has(body xyd-layout-primary[data-layout=\"page\"]) {\n                height: 100%;\n            }\n            \n            [data-color-scheme=\"dark\"] {\n                --page-first-slide-special-text-color: var(--xyd-heading-color, #fff);\n            }\n            @media (prefers-color-scheme: dark) {\n                --page-first-slide-special-text-color: var(--xyd-heading-color, #fff);\n            }\n            @media (prefers-color-scheme: dark) {\n                :root:not([data-color-scheme=\"light\"]):not([data-color-scheme=\"dark\"]) {\n                    --page-first-slide-special-text-color: var(--xyd-heading-color, #fff);\n                }\n            }\n        }\n    }\n`\n\nexport const PageFirstSlide = css`\n    display: grid;\n    grid-template-columns: 2fr 3fr;\n    gap: 60px;\n    align-items: center;\n    max-width: var(--page-first-slide-container-width, var(--page-home-container-width, 1200px));\n    margin: 0 auto;\n    padding: 50px;\n    height: 100%;\n\n    [part=\"left\"] {\n        display: flex;\n        flex-direction: column;\n        gap: 24px;\n\n        h1 {\n            --special-text-color: var(--page-first-slide-special-text-color, #353535);\n            background-image: linear-gradient(180deg, var(--special-text-color) 0%, \n        color-mix(in oklab, var(--special-text-color) 80%, transparent) 100%);\n            background-clip: text;\n            -webkit-text-fill-color: transparent;\n            -webkit-background-clip: text;\n            font-size: var(--xyd-font-size-3xl);\n            line-height: var(--xyd-line-height-3xl);\n        }\n    }\n\n    [part=\"buttons\"] {\n        display: flex;\n        flex-direction: column;\n        gap: 16px;\n        margin-top: 16px;\n\n        [data-button=\"true\"] {\n            width: 100%;\n        }\n    }\n\n    [part=\"right\"] {\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        min-height: 400px;\n\n        img {\n            max-width: 100%;\n            height: auto;\n        }\n\n        pre {\n            width: 100%;\n            max-width: 100%;\n            overflow-x: auto;\n        }\n    }\n\n    @media (max-width: 768px) {\n        grid-template-columns: 1fr;\n        gap: 40px;\n        padding: 40px 20px;\n        min-height: auto;\n\n        [part=\"left\"] {\n            order: 1;\n            text-align: center;\n        }\n\n        [part=\"right\"] {\n            order: 2;\n            min-height: 300px;\n        }\n\n        [part=\"buttons\"] {\n            align-items: center;\n\n            [data-button=\"true\"] {\n                width: 100%;\n                max-width: 300px;\n            }\n        }\n    }\n\n    xyd-codetabs {\n        width: 100%;\n    }\n\n    @media (max-width: 480px) {\n        padding: 20px 16px;\n        gap: 32px;\n    }\n`; "],"names":["PageBlogHome","_ref","_ref$posts","posts","_ref$tabs","tabs","initialTab","heading","subheading","prevLink","nextLink","_ref$as","as","_React$useState","React","useState","_a","value","_React$useState2","_slicedToArray","tab","setTab","filteredPosts","useMemo","filter","post","tag","toLowerCase","createElement","className","Heading","size","subtitle","Tabs","onChange","map","t","Item","href","label","part","GuideCard","key","id","kind","src","image","alt","title","Text","Title","weight","author","avatar","name","date","NavLinks","prev","next","cn","GridDecorator","children","cols","PageHome","props","hero","_b","_c","description","_d","button","Button","_e","sections","section","index","Fragment","concat","cards","length","List","card","Object","assign","PageFirstSlide","content","primaryButton","disabled","secondaryButton","rightContent"],"mappings":"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"}

package/dist/PageFirstSlide-BpZ42bEU.js

@@ -0,0 +1,2 @@
+import{a as e}from"./_rollupPluginBabelHelpers-Dc-ocx4G.js";import*as t from"react";import n from"react";import{H as a,b as r,G as l,N as i,L as o}from"./VideoGuide-C0K9fFar.js";import"./Icon-DbNmvK_Q.js";import{T as c}from"./TabsAnalytics-DAOfTZgv.js";import"./useUXEvents-Cxgl7xb-.js";import{B as s}from"./Button-BTJ2hIal.js";function m(n){var o,s=n.posts,m=void 0===s?[]:s,d=n.tabs,u=void 0===d?[]:d,v=n.initialTab,p=n.heading,E=n.subheading,h=n.prevLink,g=n.nextLink,f=n.as,y=void 0===f?"":f,b=t.useState(v||u&&(null===(o=u[0])||void 0===o?void 0:o.value)||""),z=e(b,2),k=z[0],B=z[1],j=t.useMemo(function(){return"everything"===k?m:null==m?void 0:m.filter(function(e){return e.tag.toLowerCase()===k})},[k,m]);return t.createElement("page-blog-home",{className:"p1evzq73"},t.createElement(a,{size:1,subtitle:E},p),t.createElement(r,{value:k,onChange:B},u.map(function(e){return t.createElement(r.Item,{as:y,href:e.href,value:e.value},e.label)})),t.createElement("div",{part:"posts"},j.map(function(e){return t.createElement(l,{key:e.id,href:e.href,kind:"secondary",size:"md"},t.createElement("div",{part:"card-content"},t.createElement("div",{part:"card-image"},t.createElement("img",{src:e.image,alt:e.title})),t.createElement(c,{size:"small",kind:"primary",as:"span"},e.tag),t.createElement(l.Title,null,t.createElement(c,{size:"large",weight:"bold",as:"span"},e.title)),t.createElement("div",{part:"card-author-row"},t.createElement("img",{src:e.author.avatar,alt:e.author.name,part:"card-author-avatar"}),t.createElement(c,{size:"small",as:"span"},e.author.name),t.createElement(c,{size:"small",kind:"secondary",as:"span"},e.date))))})),t.createElement("div",{part:"pagination"},t.createElement(i,{prev:h,next:g})))}var d="g1wc20vm";function u(e){var t=e.children,a=e.cols;return n.createElement("xyd-grid-decorator",{className:d,"data-cols":a},t)}function v(e){var n,r,i,c,m;return t.createElement("page-home",{className:"p1liujz1"},t.createElement("div",{part:"hero"},(null===(n=null==e?void 0:e.hero)||void 0===n?void 0:n.image)?t.createElement("img",{src:e.hero.image,alt:e.hero.title}):null,t.createElement(a,{size:1},null===(r=e.hero)||void 0===r?void 0:r.title),t.createElement(a,{size:3,kind:"muted"},null===(i=e.hero)||void 0===i?void 0:i.description),(null===(c=null==e?void 0:e.hero)||void 0===c?void 0:c.button)?t.createElement(s,{href:e.hero.button.href},e.hero.button.title):null),t.createElement("div",{part:"sections"},null===(m=e.sections)||void 0===m?void 0:m.map(function(e,n){var r,i;return t.createElement(t.Fragment,{key:"".concat(e.title,"-").concat(n)},(null==e?void 0:e.title)?t.createElement("div",{part:"section-title"},t.createElement(a,{size:3},e.title)):null,(null===(r=null==e?void 0:e.cards)||void 0===r?void 0:r.length)?t.createElement("div",{part:"section-cards"},t.createElement(u,{cols:3},t.createElement(o,null,t.createElement(o.Item,null,t.createElement(o,null,null===(i=e.cards)||void 0===i?void 0:i.map(function(e,n){return t.createElement(o.Item,{key:"".concat(e.title,"-").concat(n)},t.createElement(l,Object.assign({},e)))})))))):null)})))}function p(e){var n,r,l,i;return t.createElement("page-first-slide",{className:"p1s96yum"},t.createElement("div",{part:"left"},(null===(n=e.content)||void 0===n?void 0:n.title)&&t.createElement(a,{size:1},e.content.title),(null===(r=e.content)||void 0===r?void 0:r.description)&&t.createElement(a,{size:4,kind:"muted"},e.content.description),t.createElement("div",{part:"buttons"},(null===(l=e.content)||void 0===l?void 0:l.primaryButton)&&t.createElement(s,{href:e.content.primaryButton.href,kind:e.content.primaryButton.kind||"primary",size:"lg",disabled:e.content.primaryButton.disabled},e.content.primaryButton.title),(null===(i=e.content)||void 0===i?void 0:i.secondaryButton)&&t.createElement(s,{href:e.content.secondaryButton.href,kind:e.content.secondaryButton.kind||"secondary",size:"lg",disabled:e.content.secondaryButton.disabled},e.content.secondaryButton.title))),t.createElement("div",{part:"right"},e.rightContent))}export{u as G,m as P,v as a,p as b};
+//# sourceMappingURL=PageFirstSlide-BpZ42bEU.js.map

package/dist/PageFirstSlide-BpZ42bEU.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PageFirstSlide-BpZ42bEU.js","sources":["../src/pages/PageBlogHome/PageBlogHome.tsx","../src/pages/PageBlogHome/PageBlogHome.styles.tsx","../src/content/GridDecorator.styles.tsx","../src/content/GridDecorator.tsx","../src/pages/PageHome/PageHome.tsx","../src/pages/PageHome/PageHome.styles.tsx","../src/pages/PageFirstSlide/PageFirstSlide.tsx","../src/pages/PageFirstSlide/PageFirstSlide.styles.tsx"],"sourcesContent":["import * as React from \"react\"\n\nimport { Heading, NavLinks, Tabs, GuideCard, Text } from \"../../writer\"\n\nimport * as cn from \"./PageBlogHome.styles\"\nimport { PageBlogHomeProps, BlogPost, BlogTab } from \"./types\"\n\nexport function PageBlogHome({\n    posts = [],\n    tabs = [],\n    initialTab,\n    heading,\n    subheading,\n    prevLink,\n    nextLink,\n    as = \"\",\n}: PageBlogHomeProps) {\n    const [tab, setTab] = React.useState(initialTab || (tabs && tabs[0]?.value) || \"\")\n\n    const filteredPosts = React.useMemo(() => {\n        if (tab === \"everything\") return posts\n        return posts?.filter(post => post.tag.toLowerCase() === tab)\n    }, [tab, posts])\n\n    return <page-blog-home className={cn.PageBlogHome}>\n        <Heading size={1} subtitle={subheading}>{heading}</Heading>\n        <Tabs value={tab} onChange={setTab}>\n            {tabs.map(t => (\n                <Tabs.Item as={as} href={t.href} value={t.value}>{t.label}</Tabs.Item>\n            ))}\n        </Tabs>\n        <div part=\"posts\">\n            {filteredPosts.map(post => (\n                <GuideCard\n                    key={post.id}\n                    href={post.href}\n                    kind=\"secondary\"\n                    size=\"md\"\n                >\n                    <div part=\"card-content\">\n                        <div part=\"card-image\">\n                            <img src={post.image} alt={post.title} />\n                        </div>\n                        <Text size=\"small\" kind=\"primary\" as=\"span\">{post.tag}</Text>\n                        <GuideCard.Title>\n                            <Text size=\"large\" weight=\"bold\" as=\"span\">{post.title}</Text>\n                        </GuideCard.Title>\n                        <div part=\"card-author-row\">\n                            <img src={post.author.avatar} alt={post.author.name} part=\"card-author-avatar\" />\n                            <Text size=\"small\" as=\"span\">{post.author.name}</Text>\n                            <Text size=\"small\" kind=\"secondary\" as=\"span\">{post.date}</Text>\n                        </div>\n                    </div>\n                </GuideCard>\n            ))}\n        </div>\n        <div part=\"pagination\">\n            <NavLinks\n                prev={prevLink}\n                next={nextLink}\n            />\n        </div>\n    </page-blog-home>\n}","import { css } from \"@linaria/core\"\n\nexport const PageBlogHome = css`\n    --page-blog-home-padding: calc(var(--xyd-nav-item-padding) + var(--xyd-nav-padding));\n    max-width: var(--page-bloghome-max-width, 800px);\n    margin: 0 auto;\n    padding: 48px var(--page-blog-home-padding) 0 var(--page-blog-home-padding);\n    display: flex;\n    flex-direction: column;\n\n    [part=\"posts\"] {\n        --spacing: .25rem;\n        display: grid;\n        grid-template-columns: repeat(auto-fill, minmax(calc(var(--spacing) * 80), 1fr));\n        grid-gap: calc(var(--spacing) * 12) calc(var(--spacing) * 8);\n        min-height: 430px;\n        \n        margin-top: 24px;\n        margin-bottom: 24px;\n    }\n\n    [part=\"pagination\"] {\n        margin-top: 32px;\n    }\n\n    [part=\"card-content\"] {\n        display: flex;\n        flex-direction: column;\n        gap: 12px;\n    }\n\n    [part=\"card-image\"] {\n        width: 100%;\n        height: 180px;\n        overflow: hidden;\n        border-radius: 8px;\n        margin-bottom: 16px;\n        img {\n            width: 100%;\n            height: 100%;\n            object-fit: cover;\n            display: block;\n        }\n    }\n\n    [part=\"card-author-row\"] {\n        display: flex;\n        align-items: end;\n        flex: 1;\n        gap: 8px;\n        margin-top: 8px;\n    }\n\n    [part=\"card-author-avatar\"] {\n        width: 32px;\n        height: 32px;\n        border-radius: 50%;\n        object-fit: cover;\n        display: block;\n    }\n\n    xyd-guidecard {\n        [part=\"right\"], [part=\"body\"], [part=\"card-content\"] {\n            height: 100%;\n        }\n    }\n`;","import { css } from \"@linaria/core\";\n\nexport default {\n    GridDecoratorHost: css`\n        @layer components {\n            display: grid;\n            gap: 1rem;\n            width: 100%;\n\n            /* First level ul - 1fr */\n            > ul {\n                display: grid;\n                grid-template-columns: 1fr;\n                gap: 1rem;\n                width: 100%;\n            }\n\n            /* Nested ul - 2fr */\n            ul ul {\n                display: grid;\n                grid-template-columns: repeat(2, 1fr);\n                gap: 1rem;\n                width: 100%;\n            }\n\n\n            &[data-cols=\"2\"] { --data-cols: 2; }\n            &[data-cols=\"3\"] { --data-cols: 3; }\n            &[data-cols=\"4\"] { --data-cols: 4; }\n            &[data-cols=\"5\"] { --data-cols: 5; }\n            &[data-cols=\"6\"] { --data-cols: 6; }\n\n            &[data-cols] {\n                --cols: var(--data-cols, 2);\n                ul ul {\n                    grid-template-columns: repeat(var(--cols), 1fr);\n                }\n            }\n\n            @media (max-width: 768px) {\n                > ul {\n                    gap: 0;\n                }\n                ul ul {\n                    grid-template-columns: 1fr;\n                }\n                \n                /* Override data-cols for mobile */\n                &[data-cols] {\n                    --data-cols: 1;\n                }\n            }\n\n            /* Tablet breakpoint for 2 columns */\n            @media (min-width: 769px) and (max-width: 1024px) {\n                ul ul {\n                    grid-template-columns: repeat(2, 1fr);\n                }\n                \n                /* Override data-cols for tablet */\n                &[data-cols] {\n                    --data-cols: 2;\n                }\n            }\n\n\n            ul, ol, li {\n                &::before {\n                    content: none;\n                }\n            }\n\n            ul, ol {\n                display: grid;\n                margin: 0;\n                padding: 0 !important;\n                list-style: none;\n            }\n\n            li {\n                margin-left: 0 !important;\n                padding-left: 0 !important;\n            }\n        }\n    `\n}\n","import React from 'react'\n\nimport cn from \"./GridDecorator.styles\";\n\nexport interface GridDecoratorProps {\n    children: React.ReactNode\n    cols?: 2 | 3 | 4 | 5 | 6\n}\n\n/**\n * A wrapper component that applies grid decoration styling to its children.\n * This component uses a custom element `xyd-grid-decorator` to provide grid-based layout decoration.\n *\n * @category Component\n */\nexport function GridDecorator({ children, cols }: GridDecoratorProps) {\n    return <xyd-grid-decorator\n        className={cn.GridDecoratorHost}\n        data-cols={cols}\n    >\n        {children}\n    </xyd-grid-decorator>\n}\n","import * as React from \"react\"\n\nimport {\n    Heading,\n    GuideCard,\n    List,\n    Button,\n} from \"../../writer\";\n\n\nimport { PageHomeProps } from \"./types\";\nimport { GridDecorator } from \"../../content/GridDecorator\";\n\nimport * as cn from \"./PageHome.styles\"\n\nexport function PageHome(props: PageHomeProps) {\n    return <page-home className={cn.PageHome}>\n        <div part=\"hero\">\n            {props?.hero?.image ? <img src={props.hero.image} alt={props.hero.title} /> : null}\n            <Heading size={1}>\n                {props.hero?.title}\n            </Heading>\n            <Heading size={3} kind=\"muted\">\n                {props.hero?.description}\n            </Heading>\n\n            {props?.hero?.button ? <Button href={props.hero.button.href}>{props.hero.button.title}</Button> : null}\n        </div>\n\n        <div part=\"sections\">\n            {\n                props.sections?.map((section, index) => <React.Fragment key={`${section.title}-${index}`}>\n                    {\n                        section?.title ? <div part=\"section-title\">\n                            <Heading size={3}>\n                                {section.title}\n                            </Heading>\n                        </div> : null\n                    }\n\n                    {\n                        section?.cards?.length ? <div part=\"section-cards\">\n                            <GridDecorator cols={3}>\n                                <List>\n                                    <List.Item>\n                                        <List>\n                                            {section.cards?.map((card, index) => (\n                                                <List.Item key={`${card.title}-${index}`}>\n                                                    <GuideCard {...card} />\n                                                </List.Item>\n                                            ))}\n                                        </List>\n                                    </List.Item>\n                                </List>\n                            </GridDecorator>\n                        </div> : null\n                    }\n                </React.Fragment>)\n            }\n        </div>\n    </page-home>\n}","import { css } from \"@linaria/core\";\n\nexport const globals = css`\n    :global() {\n        :root {\n            --page-home-hero-font-size: 50px;\n        }\n    }\n`;\n\nexport const PageHome = css`\n    [part=\"hero\"] {\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        flex-direction: column;\n        padding: 80px 50px;\n        background: var(--page-home-hero-background);\n\n        h1 {\n            font-size: var(--page-home-hero-font-size, 50px);\n            text-align: center;\n        }\n        h1, h2, h3, h4, h5, h6 {\n            font-weight: 400;\n        }\n\n        img {\n            width: auto;\n            max-height: 60px;\n            padding-bottom: 18px;\n        }\n\n        [data-button=\"true\"] {\n            margin-top: var(--xyd-padding-xlarge);\n        }\n    }\n\n    [part=\"sections\"] {\n        max-width: var(--page-home-container-width, 1300px);\n        margin: 0 auto;\n        padding: 30px 100px;\n    }\n\n    @media (max-width: 1024px) {\n        [part=\"sections\"] {\n            padding: 25px;\n            padding-inline: var(--theme-sidebar-padding-total, 25px);\n        }\n    }\n`; ","import * as React from \"react\"\n\nimport {\n    Heading,\n    Button,\n} from \"../../writer\";\n\nimport { PageFirstSlideProps } from \"./types\";\n\nimport * as cn from \"./PageFirstSlide.styles\"\n\nexport function PageFirstSlide(props: PageFirstSlideProps) {\n    return <page-first-slide className={cn.PageFirstSlide}>\n        <div part=\"left\">\n            {props.content?.title && (\n                <Heading size={1}>\n                    {props.content.title}\n                </Heading>\n            )}\n\n            {props.content?.description && (\n                <Heading size={4} kind=\"muted\">\n                    {props.content.description}\n                </Heading>\n            )}\n\n            <div part=\"buttons\">\n                {props.content?.primaryButton && (\n                    <Button\n                        href={props.content.primaryButton.href}\n                        kind={props.content.primaryButton.kind || \"primary\"}\n                        size=\"lg\"\n                        disabled={props.content.primaryButton.disabled}\n                    >\n                        {props.content.primaryButton.title}\n                    </Button>\n                )}\n\n                {props.content?.secondaryButton && (\n                    <Button\n                        href={props.content.secondaryButton.href}\n                        kind={props.content.secondaryButton.kind || \"secondary\"}\n                        size=\"lg\"\n                        disabled={props.content.secondaryButton.disabled}\n                    >\n                        {props.content.secondaryButton.title}\n                    </Button>\n                )}\n            </div>\n        </div>\n\n        <div part=\"right\">\n            {props.rightContent}\n        </div>\n    </page-first-slide>\n} ","import { css } from \"@linaria/core\";\n\nexport const globals = css`\n    :global() {\n        @layer themedecorator {\n            xyd-layout-primary[data-layout=\"page\"] {\n                [part=\"page-article-content\"] {\n                    height: 100%;\n                }\n            }\n            @media (min-width: 1024px) {\n                xyd-layout-primary[data-layout=\"page\"] {\n                    grid-template-rows: auto 1fr auto;\n                    grid-template-columns: 1fr;\n                    width: 100%;\n                    height: max-content;\n                    min-height: 100%;\n                    display: grid;\n                }\n            }\n            \n            body:has(xyd-layout-primary[data-layout=\"page\"]) {\n                height: 100%;\n            }\n            html:has(body xyd-layout-primary[data-layout=\"page\"]) {\n                height: 100%;\n            }\n            \n            [data-color-scheme=\"dark\"] {\n                --page-first-slide-special-text-color: var(--xyd-heading-color, #fff);\n            }\n            @media (prefers-color-scheme: dark) {\n                --page-first-slide-special-text-color: var(--xyd-heading-color, #fff);\n            }\n            @media (prefers-color-scheme: dark) {\n                :root:not([data-color-scheme=\"light\"]):not([data-color-scheme=\"dark\"]) {\n                    --page-first-slide-special-text-color: var(--xyd-heading-color, #fff);\n                }\n            }\n        }\n    }\n`\n\nexport const PageFirstSlide = css`\n    display: grid;\n    grid-template-columns: 2fr 3fr;\n    gap: 60px;\n    align-items: center;\n    max-width: var(--page-first-slide-container-width, var(--page-home-container-width, 1200px));\n    margin: 0 auto;\n    padding: 50px;\n    height: 100%;\n\n    [part=\"left\"] {\n        display: flex;\n        flex-direction: column;\n        gap: 24px;\n\n        h1 {\n            --special-text-color: var(--page-first-slide-special-text-color, #353535);\n            background-image: linear-gradient(180deg, var(--special-text-color) 0%, \n        color-mix(in oklab, var(--special-text-color) 80%, transparent) 100%);\n            background-clip: text;\n            -webkit-text-fill-color: transparent;\n            -webkit-background-clip: text;\n            font-size: var(--xyd-font-size-3xl);\n            line-height: var(--xyd-line-height-3xl);\n        }\n    }\n\n    [part=\"buttons\"] {\n        display: flex;\n        flex-direction: column;\n        gap: 16px;\n        margin-top: 16px;\n\n        [data-button=\"true\"] {\n            width: 100%;\n        }\n    }\n\n    [part=\"right\"] {\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        min-height: 400px;\n\n        img {\n            max-width: 100%;\n            height: auto;\n        }\n\n        pre {\n            width: 100%;\n            max-width: 100%;\n            overflow-x: auto;\n        }\n    }\n\n    @media (max-width: 768px) {\n        grid-template-columns: 1fr;\n        gap: 40px;\n        padding: 40px 20px;\n        min-height: auto;\n\n        [part=\"left\"] {\n            order: 1;\n            text-align: center;\n        }\n\n        [part=\"right\"] {\n            order: 2;\n            min-height: 300px;\n        }\n\n        [part=\"buttons\"] {\n            align-items: center;\n\n            [data-button=\"true\"] {\n                width: 100%;\n                max-width: 300px;\n            }\n        }\n    }\n\n    xyd-codetabs {\n        width: 100%;\n    }\n\n    @media (max-width: 480px) {\n        padding: 20px 16px;\n        gap: 32px;\n    }\n`; "],"names":["PageBlogHome","_ref","_ref$posts","posts","_ref$tabs","tabs","initialTab","heading","subheading","prevLink","nextLink","_ref$as","as","_React$useState","React","useState","_a","value","_React$useState2","_slicedToArray","tab","setTab","filteredPosts","useMemo","filter","post","tag","toLowerCase","createElement","className","Heading","size","subtitle","Tabs","onChange","map","t","Item","href","label","part","GuideCard","key","id","kind","src","image","alt","title","Text","Title","weight","author","avatar","name","date","NavLinks","prev","next","cn","GridDecorator","children","cols","PageHome","props","hero","_b","_c","description","_d","button","Button","_e","sections","section","index","Fragment","concat","cards","length","List","card","Object","assign","PageFirstSlide","content","primaryButton","disabled","secondaryButton","rightContent"],"mappings":"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"}

package/dist/PageFirstSlide-CqxiyK57.js

@@ -0,0 +1,2 @@
+import{a as e}from"./_rollupPluginBabelHelpers-DSwDY1Dm.js";import*as t from"react";import n from"react";import{H as a,b as r,G as l,N as i,L as o}from"./VideoGuide-CJYkuLst.js";import"./Icon-uVIU1LW6.js";import{T as c}from"./TabsAnalytics-Dhyadlbu.js";import"./useUXEvents-XqAGxoEj.js";import{B as s}from"./Button-r4BCrEjy.js";function m(n){var o,s=n.posts,m=void 0===s?[]:s,d=n.tabs,u=void 0===d?[]:d,v=n.initialTab,p=n.heading,E=n.subheading,h=n.prevLink,g=n.nextLink,f=n.as,y=void 0===f?"":f,b=t.useState(v||u&&(null===(o=u[0])||void 0===o?void 0:o.value)||""),z=e(b,2),k=z[0],B=z[1],j=t.useMemo(function(){return"everything"===k?m:null==m?void 0:m.filter(function(e){return e.tag.toLowerCase()===k})},[k,m]);return t.createElement("page-blog-home",{className:"p1evzq73"},t.createElement(a,{size:1,subtitle:E},p),t.createElement(r,{value:k,onChange:B},u.map(function(e){return t.createElement(r.Item,{as:y,href:e.href,value:e.value},e.label)})),t.createElement("div",{part:"posts"},j.map(function(e){return t.createElement(l,{key:e.id,href:e.href,kind:"secondary",size:"md"},t.createElement("div",{part:"card-content"},t.createElement("div",{part:"card-image"},t.createElement("img",{src:e.image,alt:e.title})),t.createElement(c,{size:"small",kind:"primary",as:"span"},e.tag),t.createElement(l.Title,null,t.createElement(c,{size:"large",weight:"bold",as:"span"},e.title)),t.createElement("div",{part:"card-author-row"},t.createElement("img",{src:e.author.avatar,alt:e.author.name,part:"card-author-avatar"}),t.createElement(c,{size:"small",as:"span"},e.author.name),t.createElement(c,{size:"small",kind:"secondary",as:"span"},e.date))))})),t.createElement("div",{part:"pagination"},t.createElement(i,{prev:h,next:g})))}var d="g1wc20vm";function u(e){var t=e.children,a=e.cols;return n.createElement("xyd-grid-decorator",{className:d,"data-cols":a},t)}function v(e){var n,r,i,c,m;return t.createElement("page-home",{className:"p1liujz1"},t.createElement("div",{part:"hero"},(null===(n=null==e?void 0:e.hero)||void 0===n?void 0:n.image)?t.createElement("img",{src:e.hero.image,alt:e.hero.title}):null,t.createElement(a,{size:1},null===(r=e.hero)||void 0===r?void 0:r.title),t.createElement(a,{size:3,kind:"muted"},null===(i=e.hero)||void 0===i?void 0:i.description),(null===(c=null==e?void 0:e.hero)||void 0===c?void 0:c.button)?t.createElement(s,{href:e.hero.button.href},e.hero.button.title):null),t.createElement("div",{part:"sections"},null===(m=e.sections)||void 0===m?void 0:m.map(function(e,n){var r,i;return t.createElement(t.Fragment,{key:"".concat(e.title,"-").concat(n)},(null==e?void 0:e.title)?t.createElement("div",{part:"section-title"},t.createElement(a,{size:3},e.title)):null,(null===(r=null==e?void 0:e.cards)||void 0===r?void 0:r.length)?t.createElement("div",{part:"section-cards"},t.createElement(u,{cols:3},t.createElement(o,null,t.createElement(o.Item,null,t.createElement(o,null,null===(i=e.cards)||void 0===i?void 0:i.map(function(e,n){return t.createElement(o.Item,{key:"".concat(e.title,"-").concat(n)},t.createElement(l,Object.assign({},e)))})))))):null)})))}function p(e){var n,r,l,i;return t.createElement("page-first-slide",{className:"p1s96yum"},t.createElement("div",{part:"left"},(null===(n=e.content)||void 0===n?void 0:n.title)&&t.createElement(a,{size:1},e.content.title),(null===(r=e.content)||void 0===r?void 0:r.description)&&t.createElement(a,{size:4,kind:"muted"},e.content.description),t.createElement("div",{part:"buttons"},(null===(l=e.content)||void 0===l?void 0:l.primaryButton)&&t.createElement(s,{href:e.content.primaryButton.href,kind:e.content.primaryButton.kind||"primary",size:"lg",disabled:e.content.primaryButton.disabled},e.content.primaryButton.title),(null===(i=e.content)||void 0===i?void 0:i.secondaryButton)&&t.createElement(s,{href:e.content.secondaryButton.href,kind:e.content.secondaryButton.kind||"secondary",size:"lg",disabled:e.content.secondaryButton.disabled},e.content.secondaryButton.title))),t.createElement("div",{part:"right"},e.rightContent))}export{u as G,m as P,v as a,p as b};
+//# sourceMappingURL=PageFirstSlide-CqxiyK57.js.map

package/dist/PageFirstSlide-CqxiyK57.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PageFirstSlide-CqxiyK57.js","sources":["../src/pages/PageBlogHome/PageBlogHome.tsx","../src/pages/PageBlogHome/PageBlogHome.styles.tsx","../src/content/GridDecorator.styles.tsx","../src/content/GridDecorator.tsx","../src/pages/PageHome/PageHome.tsx","../src/pages/PageHome/PageHome.styles.tsx","../src/pages/PageFirstSlide/PageFirstSlide.tsx","../src/pages/PageFirstSlide/PageFirstSlide.styles.tsx"],"sourcesContent":["import * as React from \"react\"\n\nimport { Heading, NavLinks, Tabs, GuideCard, Text } from \"../../writer\"\n\nimport * as cn from \"./PageBlogHome.styles\"\nimport { PageBlogHomeProps, BlogPost, BlogTab } from \"./types\"\n\nexport function PageBlogHome({\n    posts = [],\n    tabs = [],\n    initialTab,\n    heading,\n    subheading,\n    prevLink,\n    nextLink,\n    as = \"\",\n}: PageBlogHomeProps) {\n    const [tab, setTab] = React.useState(initialTab || (tabs && tabs[0]?.value) || \"\")\n\n    const filteredPosts = React.useMemo(() => {\n        if (tab === \"everything\") return posts\n        return posts?.filter(post => post.tag.toLowerCase() === tab)\n    }, [tab, posts])\n\n    return <page-blog-home className={cn.PageBlogHome}>\n        <Heading size={1} subtitle={subheading}>{heading}</Heading>\n        <Tabs value={tab} onChange={setTab}>\n            {tabs.map(t => (\n                <Tabs.Item as={as} href={t.href} value={t.value}>{t.label}</Tabs.Item>\n            ))}\n        </Tabs>\n        <div part=\"posts\">\n            {filteredPosts.map(post => (\n                <GuideCard\n                    key={post.id}\n                    href={post.href}\n                    kind=\"secondary\"\n                    size=\"md\"\n                >\n                    <div part=\"card-content\">\n                        <div part=\"card-image\">\n                            <img src={post.image} alt={post.title} />\n                        </div>\n                        <Text size=\"small\" kind=\"primary\" as=\"span\">{post.tag}</Text>\n                        <GuideCard.Title>\n                            <Text size=\"large\" weight=\"bold\" as=\"span\">{post.title}</Text>\n                        </GuideCard.Title>\n                        <div part=\"card-author-row\">\n                            <img src={post.author.avatar} alt={post.author.name} part=\"card-author-avatar\" />\n                            <Text size=\"small\" as=\"span\">{post.author.name}</Text>\n                            <Text size=\"small\" kind=\"secondary\" as=\"span\">{post.date}</Text>\n                        </div>\n                    </div>\n                </GuideCard>\n            ))}\n        </div>\n        <div part=\"pagination\">\n            <NavLinks\n                prev={prevLink}\n                next={nextLink}\n            />\n        </div>\n    </page-blog-home>\n}","import { css } from \"@linaria/core\"\n\nexport const PageBlogHome = css`\n    --page-blog-home-padding: calc(var(--xyd-nav-item-padding) + var(--xyd-nav-padding));\n    max-width: var(--page-bloghome-max-width, 800px);\n    margin: 0 auto;\n    padding: 48px var(--page-blog-home-padding) 0 var(--page-blog-home-padding);\n    display: flex;\n    flex-direction: column;\n\n    [part=\"posts\"] {\n        --spacing: .25rem;\n        display: grid;\n        grid-template-columns: repeat(auto-fill, minmax(calc(var(--spacing) * 80), 1fr));\n        grid-gap: calc(var(--spacing) * 12) calc(var(--spacing) * 8);\n        min-height: 430px;\n        \n        margin-top: 24px;\n        margin-bottom: 24px;\n    }\n\n    [part=\"pagination\"] {\n        margin-top: 32px;\n    }\n\n    [part=\"card-content\"] {\n        display: flex;\n        flex-direction: column;\n        gap: 12px;\n    }\n\n    [part=\"card-image\"] {\n        width: 100%;\n        height: 180px;\n        overflow: hidden;\n        border-radius: 8px;\n        margin-bottom: 16px;\n        img {\n            width: 100%;\n            height: 100%;\n            object-fit: cover;\n            display: block;\n        }\n    }\n\n    [part=\"card-author-row\"] {\n        display: flex;\n        align-items: end;\n        flex: 1;\n        gap: 8px;\n        margin-top: 8px;\n    }\n\n    [part=\"card-author-avatar\"] {\n        width: 32px;\n        height: 32px;\n        border-radius: 50%;\n        object-fit: cover;\n        display: block;\n    }\n\n    xyd-guidecard {\n        [part=\"right\"], [part=\"body\"], [part=\"card-content\"] {\n            height: 100%;\n        }\n    }\n`;","import { css } from \"@linaria/core\";\n\nexport default {\n    GridDecoratorHost: css`\n        @layer components {\n            display: grid;\n            gap: 1rem;\n            width: 100%;\n\n            /* First level ul - 1fr */\n            > ul {\n                display: grid;\n                grid-template-columns: 1fr;\n                gap: 1rem;\n                width: 100%;\n            }\n\n            /* Nested ul - 2fr */\n            ul ul {\n                display: grid;\n                grid-template-columns: repeat(2, 1fr);\n                gap: 1rem;\n                width: 100%;\n            }\n\n\n            &[data-cols=\"2\"] { --data-cols: 2; }\n            &[data-cols=\"3\"] { --data-cols: 3; }\n            &[data-cols=\"4\"] { --data-cols: 4; }\n            &[data-cols=\"5\"] { --data-cols: 5; }\n            &[data-cols=\"6\"] { --data-cols: 6; }\n\n            &[data-cols] {\n                --cols: var(--data-cols, 2);\n                ul ul {\n                    grid-template-columns: repeat(var(--cols), 1fr);\n                }\n            }\n\n            @media (max-width: 768px) {\n                > ul {\n                    gap: 0;\n                }\n                ul ul {\n                    grid-template-columns: 1fr;\n                }\n                \n                /* Override data-cols for mobile */\n                &[data-cols] {\n                    --data-cols: 1;\n                }\n            }\n\n            /* Tablet breakpoint for 2 columns */\n            @media (min-width: 769px) and (max-width: 1024px) {\n                ul ul {\n                    grid-template-columns: repeat(2, 1fr);\n                }\n                \n                /* Override data-cols for tablet */\n                &[data-cols] {\n                    --data-cols: 2;\n                }\n            }\n\n\n            ul, ol, li {\n                &::before {\n                    content: none;\n                }\n            }\n\n            ul, ol {\n                display: grid;\n                margin: 0;\n                padding: 0 !important;\n                list-style: none;\n            }\n\n            li {\n                margin-left: 0 !important;\n                padding-left: 0 !important;\n            }\n        }\n    `\n}\n","import React from 'react'\n\nimport cn from \"./GridDecorator.styles\";\n\nexport interface GridDecoratorProps {\n    children: React.ReactNode\n    cols?: 2 | 3 | 4 | 5 | 6\n}\n\n/**\n * A wrapper component that applies grid decoration styling to its children.\n * This component uses a custom element `xyd-grid-decorator` to provide grid-based layout decoration.\n *\n * @category Component\n */\nexport function GridDecorator({ children, cols }: GridDecoratorProps) {\n    return <xyd-grid-decorator\n        className={cn.GridDecoratorHost}\n        data-cols={cols}\n    >\n        {children}\n    </xyd-grid-decorator>\n}\n","import * as React from \"react\"\n\nimport {\n    Heading,\n    GuideCard,\n    List,\n    Button,\n} from \"../../writer\";\n\n\nimport { PageHomeProps } from \"./types\";\nimport { GridDecorator } from \"../../content/GridDecorator\";\n\nimport * as cn from \"./PageHome.styles\"\n\nexport function PageHome(props: PageHomeProps) {\n    return <page-home className={cn.PageHome}>\n        <div part=\"hero\">\n            {props?.hero?.image ? <img src={props.hero.image} alt={props.hero.title} /> : null}\n            <Heading size={1}>\n                {props.hero?.title}\n            </Heading>\n            <Heading size={3} kind=\"muted\">\n                {props.hero?.description}\n            </Heading>\n\n            {props?.hero?.button ? <Button href={props.hero.button.href}>{props.hero.button.title}</Button> : null}\n        </div>\n\n        <div part=\"sections\">\n            {\n                props.sections?.map((section, index) => <React.Fragment key={`${section.title}-${index}`}>\n                    {\n                        section?.title ? <div part=\"section-title\">\n                            <Heading size={3}>\n                                {section.title}\n                            </Heading>\n                        </div> : null\n                    }\n\n                    {\n                        section?.cards?.length ? <div part=\"section-cards\">\n                            <GridDecorator cols={3}>\n                                <List>\n                                    <List.Item>\n                                        <List>\n                                            {section.cards?.map((card, index) => (\n                                                <List.Item key={`${card.title}-${index}`}>\n                                                    <GuideCard {...card} />\n                                                </List.Item>\n                                            ))}\n                                        </List>\n                                    </List.Item>\n                                </List>\n                            </GridDecorator>\n                        </div> : null\n                    }\n                </React.Fragment>)\n            }\n        </div>\n    </page-home>\n}","import { css } from \"@linaria/core\";\n\nexport const globals = css`\n    :global() {\n        :root {\n            --page-home-hero-font-size: 50px;\n        }\n    }\n`;\n\nexport const PageHome = css`\n    [part=\"hero\"] {\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        flex-direction: column;\n        padding: 80px 50px;\n        background: var(--page-home-hero-background);\n\n        h1 {\n            font-size: var(--page-home-hero-font-size, 50px);\n            text-align: center;\n        }\n        h1, h2, h3, h4, h5, h6 {\n            font-weight: 400;\n        }\n\n        img {\n            width: auto;\n            max-height: 60px;\n            padding-bottom: 18px;\n        }\n\n        [data-button=\"true\"] {\n            margin-top: var(--xyd-padding-xlarge);\n        }\n    }\n\n    [part=\"sections\"] {\n        max-width: var(--page-home-container-width, 1300px);\n        margin: 0 auto;\n        padding: 30px 100px;\n    }\n\n    @media (max-width: 1024px) {\n        [part=\"sections\"] {\n            padding: 25px;\n            padding-inline: var(--theme-sidebar-padding-total, 25px);\n        }\n    }\n`; ","import * as React from \"react\"\n\nimport {\n    Heading,\n    Button,\n} from \"../../writer\";\n\nimport { PageFirstSlideProps } from \"./types\";\n\nimport * as cn from \"./PageFirstSlide.styles\"\n\nexport function PageFirstSlide(props: PageFirstSlideProps) {\n    return <page-first-slide className={cn.PageFirstSlide}>\n        <div part=\"left\">\n            {props.content?.title && (\n                <Heading size={1}>\n                    {props.content.title}\n                </Heading>\n            )}\n\n            {props.content?.description && (\n                <Heading size={4} kind=\"muted\">\n                    {props.content.description}\n                </Heading>\n            )}\n\n            <div part=\"buttons\">\n                {props.content?.primaryButton && (\n                    <Button\n                        href={props.content.primaryButton.href}\n                        kind={props.content.primaryButton.kind || \"primary\"}\n                        size=\"lg\"\n                        disabled={props.content.primaryButton.disabled}\n                    >\n                        {props.content.primaryButton.title}\n                    </Button>\n                )}\n\n                {props.content?.secondaryButton && (\n                    <Button\n                        href={props.content.secondaryButton.href}\n                        kind={props.content.secondaryButton.kind || \"secondary\"}\n                        size=\"lg\"\n                        disabled={props.content.secondaryButton.disabled}\n                    >\n                        {props.content.secondaryButton.title}\n                    </Button>\n                )}\n            </div>\n        </div>\n\n        <div part=\"right\">\n            {props.rightContent}\n        </div>\n    </page-first-slide>\n} ","import { css } from \"@linaria/core\";\n\nexport const globals = css`\n    :global() {\n        @layer themedecorator {\n            xyd-layout-primary[data-layout=\"page\"] {\n                [part=\"page-article-content\"] {\n                    height: 100%;\n                }\n            }\n            @media (min-width: 1024px) {\n                xyd-layout-primary[data-layout=\"page\"] {\n                    grid-template-rows: auto 1fr auto;\n                    grid-template-columns: 1fr;\n                    width: 100%;\n                    height: max-content;\n                    min-height: 100%;\n                    display: grid;\n                }\n            }\n            \n            body:has(xyd-layout-primary[data-layout=\"page\"]) {\n                height: 100%;\n            }\n            html:has(body xyd-layout-primary[data-layout=\"page\"]) {\n                height: 100%;\n            }\n            \n            [data-color-scheme=\"dark\"] {\n                --page-first-slide-special-text-color: var(--xyd-heading-color, #fff);\n            }\n            @media (prefers-color-scheme: dark) {\n                --page-first-slide-special-text-color: var(--xyd-heading-color, #fff);\n            }\n            @media (prefers-color-scheme: dark) {\n                :root:not([data-color-scheme=\"light\"]):not([data-color-scheme=\"dark\"]) {\n                    --page-first-slide-special-text-color: var(--xyd-heading-color, #fff);\n                }\n            }\n        }\n    }\n`\n\nexport const PageFirstSlide = css`\n    display: grid;\n    grid-template-columns: 2fr 3fr;\n    gap: 60px;\n    align-items: center;\n    max-width: var(--page-first-slide-container-width, var(--page-home-container-width, 1200px));\n    margin: 0 auto;\n    padding: 50px;\n    height: 100%;\n\n    [part=\"left\"] {\n        display: flex;\n        flex-direction: column;\n        gap: 24px;\n\n        h1 {\n            --special-text-color: var(--page-first-slide-special-text-color, #353535);\n            background-image: linear-gradient(180deg, var(--special-text-color) 0%, \n        color-mix(in oklab, var(--special-text-color) 80%, transparent) 100%);\n            background-clip: text;\n            -webkit-text-fill-color: transparent;\n            -webkit-background-clip: text;\n            font-size: var(--xyd-font-size-3xl);\n            line-height: var(--xyd-line-height-3xl);\n        }\n    }\n\n    [part=\"buttons\"] {\n        display: flex;\n        flex-direction: column;\n        gap: 16px;\n        margin-top: 16px;\n\n        [data-button=\"true\"] {\n            width: 100%;\n        }\n    }\n\n    [part=\"right\"] {\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        min-height: 400px;\n\n        img {\n            max-width: 100%;\n            height: auto;\n        }\n\n        pre {\n            width: 100%;\n            max-width: 100%;\n            overflow-x: auto;\n        }\n    }\n\n    @media (max-width: 768px) {\n        grid-template-columns: 1fr;\n        gap: 40px;\n        padding: 40px 20px;\n        min-height: auto;\n\n        [part=\"left\"] {\n            order: 1;\n            text-align: center;\n        }\n\n        [part=\"right\"] {\n            order: 2;\n            min-height: 300px;\n        }\n\n        [part=\"buttons\"] {\n            align-items: center;\n\n            [data-button=\"true\"] {\n                width: 100%;\n                max-width: 300px;\n            }\n        }\n    }\n\n    xyd-codetabs {\n        width: 100%;\n    }\n\n    @media (max-width: 480px) {\n        padding: 20px 16px;\n        gap: 32px;\n    }\n`; "],"names":["PageBlogHome","_ref","_ref$posts","posts","_ref$tabs","tabs","initialTab","heading","subheading","prevLink","nextLink","_ref$as","as","_React$useState","React","useState","_a","value","_React$useState2","_slicedToArray","tab","setTab","filteredPosts","useMemo","filter","post","tag","toLowerCase","createElement","className","Heading","size","subtitle","Tabs","onChange","map","t","Item","href","label","part","GuideCard","key","id","kind","src","image","alt","title","Text","Title","weight","author","avatar","name","date","NavLinks","prev","next","cn","GridDecorator","children","cols","PageHome","props","hero","_b","_c","description","_d","button","Button","_e","sections","section","index","Fragment","concat","cards","length","List","card","Object","assign","PageFirstSlide","content","primaryButton","disabled","secondaryButton","rightContent"],"mappings":"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"}

package/dist/TabsAnalytics-B_JYpawG.js

@@ -0,0 +1,2 @@
+import a,{useState as e,useRef as t,createContext as n,useContext as i}from"react";import{a as l}from"./_rollupPluginBabelHelpers-CvhQFv1t.js";function r(e){var t=e.size,n=void 0===t?"medium":t,i=e.kind,l=void 0===i?"default":i,r=e.weight,u=void 0===r?"normal":r,o=e.children,c=e.className,s=e.id,d=e.onClick,m=e.as,v=(void 0===m?"p":m)||"p";return a.createElement(v,{className:"".concat("tn8a2d4"," ").concat(c||""),"data-size":n,"data-kind":l,"data-weight":u,onClick:d,id:s},o)}var u=n({value:"",setValue:function(){},tabsRef:{current:null}});function o(n){var i=n.children,r=e(""),o=l(r,2),c=o[0],s=o[1],d=t(null);return a.createElement(u,{value:{value:c,setValue:s,tabsRef:d}},i)}function c(){return i(u)}export{r as T,o as a,c as u};
+//# sourceMappingURL=TabsAnalytics-B_JYpawG.js.map

package/dist/TabsAnalytics-B_JYpawG.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TabsAnalytics-B_JYpawG.js","sources":["../src/writer/Text/Text.tsx","../src/writer/Text/Text.styles.tsx","../src/writer/Tabs/TabsAnalytics.tsx"],"sourcesContent":["import React from \"react\"\n\nimport * as cn from \"./Text.styles\";\n\n/**\n * Available font sizes for the Text component\n */\nexport type TextFontSizes = \"xsmall\" | \"small\" | \"medium\" | \"large\" | \"xlarge\" | \"xxlarge\";\n\n/**\n * Available text styles/kinds for the Text component\n */\nexport type TextKindTypes = \"default\" | \"ghost\" | \"success\" | \"warn\" | \"error\" | \"primary\" | \"secondary\";\n\n/**\n * Available font weights for the Text component\n */\nexport type TextFontWeights = \"normal\" | \"bold\" | \"extra-bold\";\n\n/**\n * Props for the Text component\n */\nexport interface TextProps {\n    /** Font size of the text */\n    size?: TextFontSizes\n\n    /** Visual style/kind of the text */\n    kind?: TextKindTypes\n\n    /** Font weight of the text */\n    weight?: TextFontWeights\n\n    /** Content to be rendered inside the text component */\n    children?: React.ReactNode\n\n    /** Additional CSS class name */\n    className?: string\n\n    /** HTML id attribute */\n    id?: string\n    \n    /** Click event handler */\n    onClick?: () => void\n    \n    /** HTML tag to render the text as */\n    as?: \"span\" | \"p\"\n}\n\n/**\n * A flexible text component that supports different sizes, styles, and weights.\n * \n * @category Component\n */\nexport function Text({\n    size = \"medium\",\n    kind = \"default\",\n    weight = \"normal\",\n    children,\n    className,\n    id,\n    onClick,\n    as = \"p\"\n}: TextProps) {\n    const Tag = as || \"p\";\n\n    return (\n        <Tag\n            className={`${cn.TextHost} ${className || ''}`}\n            data-size={size}\n            data-kind={kind}\n            data-weight={weight}\n            onClick={onClick}\n            id={id}\n        >\n            {children}\n        </Tag>\n    )\n}\n\n","import { css } from \"@linaria/core\";\n\nexport const TextHost = css`\n    @layer defaults {\n        display: inline-block;\n        margin: 0;\n\n        &[data-size=\"xsmall\"] { \n            font-size: var(--xyd-font-size-xsmall);\n            line-height: var(--xyd-line-height-xsmall);\n        }\n        &[data-size=\"small\"] { \n            font-size: var(--xyd-font-size-small);\n            line-height: var(--xyd-line-height-small);\n        }\n        &[data-size=\"medium\"] { \n            font-size: var(--xyd-font-size-medium);\n            line-height: var(--xyd-line-height-medium);\n        }\n        &[data-size=\"large\"] { \n            font-size: var(--xyd-font-size-large);\n            line-height: var(--xyd-line-height-large);\n        }\n        &[data-size=\"xlarge\"] { \n            font-size: var(--xyd-font-size-xlarge);\n            line-height: var(--xyd-line-height-xlarge);\n        }\n        &[data-size=\"xxlarge\"] { \n            font-size: var(--xyd-font-size-xxlarge);\n            line-height: var(--xyd-line-height-xxlarge);\n        }\n\n        &[data-kind=\"default\"] { \n            color: var(--xyd-text-color--default);\n        }\n        &[data-kind=\"ghost\"] { \n            color: var(--xyd-text-color--ghost);\n        }\n        &[data-kind=\"success\"] { \n            color: var(--xyd-text-color--success);\n        }\n        &[data-kind=\"warn\"] { \n            color: var(--xyd-text-color--warn);\n        }\n        &[data-kind=\"error\"] { \n            color: var(--xyd-text-color--error);\n        }\n        &[data-kind=\"primary\"] { \n            color: var(--xyd-text-color--primary);\n        }\n        &[data-kind=\"secondary\"] { \n            color: var(--xyd-text-color--secondary);\n        }\n\n        &[data-weight=\"normal\"] { \n            font-weight: var(--xyd-font-weight-normal);\n        }\n        &[data-weight=\"bold\"] { \n            font-weight: bold;\n        }\n        &[data-weight=\"extra-bold\"] { \n            font-weight: var(--xyd-font-weight-extrabold);\n        }\n    }\n`;\n\n","import React, {createContext, useContext, useRef, useState} from \"react\";\n\nconst TabsAnalyticsContext = createContext<{\n    value: string\n    setValue: (value: string) => void\n    tabsRef: React.RefObject<HTMLElement | null>\n}>({\n    value: \"\",\n    setValue: () => {\n    },\n    tabsRef: {current: null}\n})\n\nexport function TabsAnalytics({children}: { children: React.ReactNode }) {\n    const [value, setValue] = useState(\"\")\n    const tabsRef = useRef<HTMLElement | null>(null)\n\n    return <TabsAnalyticsContext value={{value, setValue, tabsRef}}>\n        {children}\n    </TabsAnalyticsContext>\n}\n\nexport function useTabsAnalytics() {\n    return useContext(TabsAnalyticsContext)\n}"],"names":["Text","_ref","_ref$size","size","_ref$kind","kind","_ref$weight","weight","children","className","id","onClick","_ref$as","as","Tag","React","createElement","concat","TabsAnalyticsContext","createContext","value","setValue","tabsRef","current","TabsAnalytics","_useState","useState","_useState2","_slicedToArray","useRef","useTabsAnalytics","useContext"],"mappings":"+IAqDM,SAAUA,EAAIC,GASR,IAAAC,EAAAD,EARRE,KAAAA,OAAI,IAAAD,EAAG,SAAQA,EAAAE,EAAAH,EACfI,KAAAA,OAAI,IAAAD,EAAG,UAASA,EAAAE,EAAAL,EAChBM,OAAAA,OAAM,IAAAD,EAAG,SAAQA,EACjBE,EAAQP,EAARO,SACAC,EAASR,EAATQ,UACAC,EAAET,EAAFS,GACAC,EAAOV,EAAPU,QAAOC,EAAAX,EACPY,GAEMC,QAFJ,IAAAF,EAAG,IAAGA,IAEU,IAElB,OACIG,EAAAC,cAACF,EAAG,CACAL,UAAS,GAAAQ,OCjEA,UDiEgB,KAAAA,OAAIR,GAAa,IAAI,YACnCN,EAAI,YACJE,EAAI,cACFE,EACbI,QAASA,EACTD,GAAIA,GAEHF,EAGb,CE3EA,IAAMU,EAAuBC,EAI1B,CACCC,MAAO,GACPC,SAAU,WACV,EACAC,QAAS,CAACC,QAAS,QAGjB,SAAUC,EAAavB,GAA0C,IAAxCO,EAAQP,EAARO,SAC3BiB,EAA0BC,EAAS,IAAGC,EAAAC,EAAAH,EAAA,GAA/BL,EAAKO,EAAA,GAAEN,EAAQM,EAAA,GAChBL,EAAUO,EAA2B,MAE3C,OAAOd,EAAAC,cAACE,EAAoB,CAACE,MAAO,CAACA,MAAAA,EAAOC,SAAAA,EAAUC,QAAAA,IACjDd,EAET,UAEgBsB,IACZ,OAAOC,EAAWb,EACtB"}

package/dist/TabsAnalytics-DAOfTZgv.js

@@ -0,0 +1,2 @@
+import a,{useState as e,useRef as t,createContext as n,useContext as i}from"react";import{a as l}from"./_rollupPluginBabelHelpers-Dc-ocx4G.js";function r(e){var t=e.size,n=void 0===t?"medium":t,i=e.kind,l=void 0===i?"default":i,r=e.weight,u=void 0===r?"normal":r,o=e.children,c=e.className,s=e.id,d=e.onClick,m=e.as,v=(void 0===m?"p":m)||"p";return a.createElement(v,{className:"".concat("tn8a2d4"," ").concat(c||""),"data-size":n,"data-kind":l,"data-weight":u,onClick:d,id:s},o)}var u=n({value:"",setValue:function(){},tabsRef:{current:null}});function o(n){var i=n.children,r=e(""),o=l(r,2),c=o[0],s=o[1],d=t(null);return a.createElement(u,{value:{value:c,setValue:s,tabsRef:d}},i)}function c(){return i(u)}export{r as T,o as a,c as u};
+//# sourceMappingURL=TabsAnalytics-DAOfTZgv.js.map

package/dist/TabsAnalytics-DAOfTZgv.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TabsAnalytics-DAOfTZgv.js","sources":["../src/writer/Text/Text.tsx","../src/writer/Text/Text.styles.tsx","../src/writer/Tabs/TabsAnalytics.tsx"],"sourcesContent":["import React from \"react\"\n\nimport * as cn from \"./Text.styles\";\n\n/**\n * Available font sizes for the Text component\n */\nexport type TextFontSizes = \"xsmall\" | \"small\" | \"medium\" | \"large\" | \"xlarge\" | \"xxlarge\";\n\n/**\n * Available text styles/kinds for the Text component\n */\nexport type TextKindTypes = \"default\" | \"ghost\" | \"success\" | \"warn\" | \"error\" | \"primary\" | \"secondary\";\n\n/**\n * Available font weights for the Text component\n */\nexport type TextFontWeights = \"normal\" | \"bold\" | \"extra-bold\";\n\n/**\n * Props for the Text component\n */\nexport interface TextProps {\n    /** Font size of the text */\n    size?: TextFontSizes\n\n    /** Visual style/kind of the text */\n    kind?: TextKindTypes\n\n    /** Font weight of the text */\n    weight?: TextFontWeights\n\n    /** Content to be rendered inside the text component */\n    children?: React.ReactNode\n\n    /** Additional CSS class name */\n    className?: string\n\n    /** HTML id attribute */\n    id?: string\n    \n    /** Click event handler */\n    onClick?: () => void\n    \n    /** HTML tag to render the text as */\n    as?: \"span\" | \"p\"\n}\n\n/**\n * A flexible text component that supports different sizes, styles, and weights.\n * \n * @category Component\n */\nexport function Text({\n    size = \"medium\",\n    kind = \"default\",\n    weight = \"normal\",\n    children,\n    className,\n    id,\n    onClick,\n    as = \"p\"\n}: TextProps) {\n    const Tag = as || \"p\";\n\n    return (\n        <Tag\n            className={`${cn.TextHost} ${className || ''}`}\n            data-size={size}\n            data-kind={kind}\n            data-weight={weight}\n            onClick={onClick}\n            id={id}\n        >\n            {children}\n        </Tag>\n    )\n}\n\n","import { css } from \"@linaria/core\";\n\nexport const TextHost = css`\n    @layer defaults {\n        display: inline-block;\n        margin: 0;\n\n        &[data-size=\"xsmall\"] { \n            font-size: var(--xyd-font-size-xsmall);\n            line-height: var(--xyd-line-height-xsmall);\n        }\n        &[data-size=\"small\"] { \n            font-size: var(--xyd-font-size-small);\n            line-height: var(--xyd-line-height-small);\n        }\n        &[data-size=\"medium\"] { \n            font-size: var(--xyd-font-size-medium);\n            line-height: var(--xyd-line-height-medium);\n        }\n        &[data-size=\"large\"] { \n            font-size: var(--xyd-font-size-large);\n            line-height: var(--xyd-line-height-large);\n        }\n        &[data-size=\"xlarge\"] { \n            font-size: var(--xyd-font-size-xlarge);\n            line-height: var(--xyd-line-height-xlarge);\n        }\n        &[data-size=\"xxlarge\"] { \n            font-size: var(--xyd-font-size-xxlarge);\n            line-height: var(--xyd-line-height-xxlarge);\n        }\n\n        &[data-kind=\"default\"] { \n            color: var(--xyd-text-color--default);\n        }\n        &[data-kind=\"ghost\"] { \n            color: var(--xyd-text-color--ghost);\n        }\n        &[data-kind=\"success\"] { \n            color: var(--xyd-text-color--success);\n        }\n        &[data-kind=\"warn\"] { \n            color: var(--xyd-text-color--warn);\n        }\n        &[data-kind=\"error\"] { \n            color: var(--xyd-text-color--error);\n        }\n        &[data-kind=\"primary\"] { \n            color: var(--xyd-text-color--primary);\n        }\n        &[data-kind=\"secondary\"] { \n            color: var(--xyd-text-color--secondary);\n        }\n\n        &[data-weight=\"normal\"] { \n            font-weight: var(--xyd-font-weight-normal);\n        }\n        &[data-weight=\"bold\"] { \n            font-weight: bold;\n        }\n        &[data-weight=\"extra-bold\"] { \n            font-weight: var(--xyd-font-weight-extrabold);\n        }\n    }\n`;\n\n","import React, {createContext, useContext, useRef, useState} from \"react\";\n\nconst TabsAnalyticsContext = createContext<{\n    value: string\n    setValue: (value: string) => void\n    tabsRef: React.RefObject<HTMLElement | null>\n}>({\n    value: \"\",\n    setValue: () => {\n    },\n    tabsRef: {current: null}\n})\n\nexport function TabsAnalytics({children}: { children: React.ReactNode }) {\n    const [value, setValue] = useState(\"\")\n    const tabsRef = useRef<HTMLElement | null>(null)\n\n    return <TabsAnalyticsContext value={{value, setValue, tabsRef}}>\n        {children}\n    </TabsAnalyticsContext>\n}\n\nexport function useTabsAnalytics() {\n    return useContext(TabsAnalyticsContext)\n}"],"names":["Text","_ref","_ref$size","size","_ref$kind","kind","_ref$weight","weight","children","className","id","onClick","_ref$as","as","Tag","React","createElement","concat","TabsAnalyticsContext","createContext","value","setValue","tabsRef","current","TabsAnalytics","_useState","useState","_useState2","_slicedToArray","useRef","useTabsAnalytics","useContext"],"mappings":"+IAqDM,SAAUA,EAAIC,GASR,IAAAC,EAAAD,EARRE,KAAAA,OAAI,IAAAD,EAAG,SAAQA,EAAAE,EAAAH,EACfI,KAAAA,OAAI,IAAAD,EAAG,UAASA,EAAAE,EAAAL,EAChBM,OAAAA,OAAM,IAAAD,EAAG,SAAQA,EACjBE,EAAQP,EAARO,SACAC,EAASR,EAATQ,UACAC,EAAET,EAAFS,GACAC,EAAOV,EAAPU,QAAOC,EAAAX,EACPY,GAEMC,QAFJ,IAAAF,EAAG,IAAGA,IAEU,IAElB,OACIG,EAAAC,cAACF,EAAG,CACAL,UAAS,GAAAQ,OCjEA,UDiEgB,KAAAA,OAAIR,GAAa,IAAI,YACnCN,EAAI,YACJE,EAAI,cACFE,EACbI,QAASA,EACTD,GAAIA,GAEHF,EAGb,CE3EA,IAAMU,EAAuBC,EAI1B,CACCC,MAAO,GACPC,SAAU,WACV,EACAC,QAAS,CAACC,QAAS,QAGjB,SAAUC,EAAavB,GAA0C,IAAxCO,EAAQP,EAARO,SAC3BiB,EAA0BC,EAAS,IAAGC,EAAAC,EAAAH,EAAA,GAA/BL,EAAKO,EAAA,GAAEN,EAAQM,EAAA,GAChBL,EAAUO,EAA2B,MAE3C,OAAOd,EAAAC,cAACE,EAAoB,CAACE,MAAO,CAACA,MAAAA,EAAOC,SAAAA,EAAUC,QAAAA,IACjDd,EAET,UAEgBsB,IACZ,OAAOC,EAAWb,EACtB"}

package/dist/TabsAnalytics-Dhyadlbu.js

@@ -0,0 +1,2 @@
+import a,{useState as e,useRef as t,createContext as n,useContext as i}from"react";import{a as l}from"./_rollupPluginBabelHelpers-DSwDY1Dm.js";function r(e){var t=e.size,n=void 0===t?"medium":t,i=e.kind,l=void 0===i?"default":i,r=e.weight,u=void 0===r?"normal":r,o=e.children,c=e.className,s=e.id,d=e.onClick,m=e.as,v=(void 0===m?"p":m)||"p";return a.createElement(v,{className:"".concat("tn8a2d4"," ").concat(c||""),"data-size":n,"data-kind":l,"data-weight":u,onClick:d,id:s},o)}var u=n({value:"",setValue:function(){},tabsRef:{current:null}});function o(n){var i=n.children,r=e(""),o=l(r,2),c=o[0],s=o[1],d=t(null);return a.createElement(u,{value:{value:c,setValue:s,tabsRef:d}},i)}function c(){return i(u)}export{r as T,o as a,c as u};
+//# sourceMappingURL=TabsAnalytics-Dhyadlbu.js.map

package/dist/TabsAnalytics-Dhyadlbu.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TabsAnalytics-Dhyadlbu.js","sources":["../src/writer/Text/Text.tsx","../src/writer/Text/Text.styles.tsx","../src/writer/Tabs/TabsAnalytics.tsx"],"sourcesContent":["import React from \"react\"\n\nimport * as cn from \"./Text.styles\";\n\n/**\n * Available font sizes for the Text component\n */\nexport type TextFontSizes = \"xsmall\" | \"small\" | \"medium\" | \"large\" | \"xlarge\" | \"xxlarge\";\n\n/**\n * Available text styles/kinds for the Text component\n */\nexport type TextKindTypes = \"default\" | \"ghost\" | \"success\" | \"warn\" | \"error\" | \"primary\" | \"secondary\";\n\n/**\n * Available font weights for the Text component\n */\nexport type TextFontWeights = \"normal\" | \"bold\" | \"extra-bold\";\n\n/**\n * Props for the Text component\n */\nexport interface TextProps {\n    /** Font size of the text */\n    size?: TextFontSizes\n\n    /** Visual style/kind of the text */\n    kind?: TextKindTypes\n\n    /** Font weight of the text */\n    weight?: TextFontWeights\n\n    /** Content to be rendered inside the text component */\n    children?: React.ReactNode\n\n    /** Additional CSS class name */\n    className?: string\n\n    /** HTML id attribute */\n    id?: string\n    \n    /** Click event handler */\n    onClick?: () => void\n    \n    /** HTML tag to render the text as */\n    as?: \"span\" | \"p\"\n}\n\n/**\n * A flexible text component that supports different sizes, styles, and weights.\n * \n * @category Component\n */\nexport function Text({\n    size = \"medium\",\n    kind = \"default\",\n    weight = \"normal\",\n    children,\n    className,\n    id,\n    onClick,\n    as = \"p\"\n}: TextProps) {\n    const Tag = as || \"p\";\n\n    return (\n        <Tag\n            className={`${cn.TextHost} ${className || ''}`}\n            data-size={size}\n            data-kind={kind}\n            data-weight={weight}\n            onClick={onClick}\n            id={id}\n        >\n            {children}\n        </Tag>\n    )\n}\n\n","import { css } from \"@linaria/core\";\n\nexport const TextHost = css`\n    @layer defaults {\n        display: inline-block;\n        margin: 0;\n\n        &[data-size=\"xsmall\"] { \n            font-size: var(--xyd-font-size-xsmall);\n            line-height: var(--xyd-line-height-xsmall);\n        }\n        &[data-size=\"small\"] { \n            font-size: var(--xyd-font-size-small);\n            line-height: var(--xyd-line-height-small);\n        }\n        &[data-size=\"medium\"] { \n            font-size: var(--xyd-font-size-medium);\n            line-height: var(--xyd-line-height-medium);\n        }\n        &[data-size=\"large\"] { \n            font-size: var(--xyd-font-size-large);\n            line-height: var(--xyd-line-height-large);\n        }\n        &[data-size=\"xlarge\"] { \n            font-size: var(--xyd-font-size-xlarge);\n            line-height: var(--xyd-line-height-xlarge);\n        }\n        &[data-size=\"xxlarge\"] { \n            font-size: var(--xyd-font-size-xxlarge);\n            line-height: var(--xyd-line-height-xxlarge);\n        }\n\n        &[data-kind=\"default\"] { \n            color: var(--xyd-text-color--default);\n        }\n        &[data-kind=\"ghost\"] { \n            color: var(--xyd-text-color--ghost);\n        }\n        &[data-kind=\"success\"] { \n            color: var(--xyd-text-color--success);\n        }\n        &[data-kind=\"warn\"] { \n            color: var(--xyd-text-color--warn);\n        }\n        &[data-kind=\"error\"] { \n            color: var(--xyd-text-color--error);\n        }\n        &[data-kind=\"primary\"] { \n            color: var(--xyd-text-color--primary);\n        }\n        &[data-kind=\"secondary\"] { \n            color: var(--xyd-text-color--secondary);\n        }\n\n        &[data-weight=\"normal\"] { \n            font-weight: var(--xyd-font-weight-normal);\n        }\n        &[data-weight=\"bold\"] { \n            font-weight: bold;\n        }\n        &[data-weight=\"extra-bold\"] { \n            font-weight: var(--xyd-font-weight-extrabold);\n        }\n    }\n`;\n\n","import React, {createContext, useContext, useRef, useState} from \"react\";\n\nconst TabsAnalyticsContext = createContext<{\n    value: string\n    setValue: (value: string) => void\n    tabsRef: React.RefObject<HTMLElement | null>\n}>({\n    value: \"\",\n    setValue: () => {\n    },\n    tabsRef: {current: null}\n})\n\nexport function TabsAnalytics({children}: { children: React.ReactNode }) {\n    const [value, setValue] = useState(\"\")\n    const tabsRef = useRef<HTMLElement | null>(null)\n\n    return <TabsAnalyticsContext value={{value, setValue, tabsRef}}>\n        {children}\n    </TabsAnalyticsContext>\n}\n\nexport function useTabsAnalytics() {\n    return useContext(TabsAnalyticsContext)\n}"],"names":["Text","_ref","_ref$size","size","_ref$kind","kind","_ref$weight","weight","children","className","id","onClick","_ref$as","as","Tag","React","createElement","concat","TabsAnalyticsContext","createContext","value","setValue","tabsRef","current","TabsAnalytics","_useState","useState","_useState2","_slicedToArray","useRef","useTabsAnalytics","useContext"],"mappings":"+IAqDM,SAAUA,EAAIC,GASR,IAAAC,EAAAD,EARRE,KAAAA,OAAI,IAAAD,EAAG,SAAQA,EAAAE,EAAAH,EACfI,KAAAA,OAAI,IAAAD,EAAG,UAASA,EAAAE,EAAAL,EAChBM,OAAAA,OAAM,IAAAD,EAAG,SAAQA,EACjBE,EAAQP,EAARO,SACAC,EAASR,EAATQ,UACAC,EAAET,EAAFS,GACAC,EAAOV,EAAPU,QAAOC,EAAAX,EACPY,GAEMC,QAFJ,IAAAF,EAAG,IAAGA,IAEU,IAElB,OACIG,EAAAC,cAACF,EAAG,CACAL,UAAS,GAAAQ,OCjEA,UDiEgB,KAAAA,OAAIR,GAAa,IAAI,YACnCN,EAAI,YACJE,EAAI,cACFE,EACbI,QAASA,EACTD,GAAIA,GAEHF,EAGb,CE3EA,IAAMU,EAAuBC,EAI1B,CACCC,MAAO,GACPC,SAAU,WACV,EACAC,QAAS,CAACC,QAAS,QAGjB,SAAUC,EAAavB,GAA0C,IAAxCO,EAAQP,EAARO,SAC3BiB,EAA0BC,EAAS,IAAGC,EAAAC,EAAAH,EAAA,GAA/BL,EAAKO,EAAA,GAAEN,EAAQM,EAAA,GAChBL,EAAUO,EAA2B,MAE3C,OAAOd,EAAAC,cAACE,EAAoB,CAACE,MAAO,CAACA,MAAAA,EAAOC,SAAAA,EAAUC,QAAAA,IACjDd,EAET,UAEgBsB,IACZ,OAAOC,EAAWb,EACtB"}

package/dist/Update-53fEhmjh.js

@@ -0,0 +1,2 @@
+import e,{Fragment as t,useState as r,useEffect as n}from"react";import{a}from"./Icon-uVIU1LW6.js";import{B as c}from"./Button-r4BCrEjy.js";import{T as l}from"./TabsAnalytics-Dhyadlbu.js";import{a as o}from"./_rollupPluginBabelHelpers-DSwDY1Dm.js";import{u as i}from"./useUXClick-DO6qBcRy.js";import{u as s}from"./useUXEvents-XqAGxoEj.js";import{B as m}from"./VideoGuide-CJYkuLst.js";function d(t){var r=t.className,n=t.children;return e.createElement("blockquote",{className:"".concat("b1wifk81"," ").concat(r||"")},e.createElement(u,null),e.createElement("div",null,n))}function u(t){return e.createElement("svg",Object.assign({width:15,height:11,viewBox:"0 0 15 11",xmlns:"http://www.w3.org/2000/svg",part:"quote"},t),e.createElement("path",{d:"M15 1.72c-1.96.95-2.94 2.07-2.94 3.36.83.1 1.53.44 2.07 1.02.55.58.82 1.25.82 2.01a2.81 2.81 0 0 1-2.8 2.89c-.9 0-1.68-.36-2.33-1.09a3.78 3.78 0 0 1-1-2.63c0-3.1 1.76-5.53 5.26-7.28L15 1.72zm-8.83 0c-1.97.95-2.96 2.07-2.96 3.36.85.1 1.55.44 2.1 1.02.54.58.82 1.25.82 2.01A2.82 2.82 0 0 1 3.3 11 3 3 0 0 1 .98 9.91 3.8 3.8 0 0 1 0 7.28C0 4.18 1.74 1.75 5.23 0l.94 1.72z",fillRule:"nonzero"}))}function h(r){var n=r.className,a=r.items,c=r.as||E;return e.createElement("xyd-breadcrumbs",{className:"".concat("bwgsk4h"," ").concat(n||"")},a.map(function(r,n){var l=n===a.length-1;return e.createElement(t,{key:r.href+r.title},n>0&&e.createElement(p,null),e.createElement("div",{part:"item","data-active":l?"true":"false"},r.href&&!l?e.createElement(c,{href:r.href},r.title):r.title))}))}function p(){return e.createElement("span",{part:"icon"},"/")}function E(t){var r=t.href,n=t.children,c=a(t,["href","children"]);return e.createElement("a",Object.assign({href:r},c),n)}function v(t){var r,n=t.className,a=t.children,c=t.kind;switch(c){case"tip":r=e.createElement(w,null);break;case"check":r=e.createElement(f,null);break;case"warning":r=e.createElement(k,null);break;case"danger":r=e.createElement(L,null);break;case"note":r=e.createElement(b,null);break;default:r=e.createElement(g,null)}return e.createElement("xyd-callout",{"data-kind":c,className:"".concat("chnegou"," ").concat(n||"")},e.createElement("div",{part:"icon"},r),e.createElement("div",{part:"message"},e.createElement("div",{part:"message-body"},a)))}function g(){return e.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",width:"24",height:"24",fill:"currentColor",viewBox:"0 0 24 24"},e.createElement("path",{d:"M13 12a1 1 0 1 0-2 0v4a1 1 0 1 0 2 0v-4Zm-1-2.5A1.25 1.25 0 1 0 12 7a1.25 1.25 0 0 0 0 2.5Z"}),e.createElement("path",{fillRule:"evenodd",d:"M12 2C6.477 2 2 6.477 2 12s4.477 10 10 10 10-4.477 10-10S17.523 2 12 2ZM4 12a8 8 0 1 1 16 0 8 8 0 0 1-16 0Z",clipRule:"evenodd"}))}function w(){return e.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",width:"24",height:"24",viewBox:"0 0 24 24"},e.createElement("g",{fill:"none",stroke:"currentColor",strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:1.5},e.createElement("path",{d:"M17.252 12.49c-.284 2.365-1.833 3.31-2.502 3.996c-.67.688-.55.825-.505 1.834a.916.916 0 0 1-.916.971h-2.658a.92.92 0 0 1-.917-.971c0-.99.092-1.22-.504-1.834c-.76-.76-2.548-1.833-2.548-4.784a5.307 5.307 0 1 1 10.55.788"}),e.createElement("path",{d:"M10.46 19.236v1.512c0 .413.23.752.513.752h2.053c.285 0 .514-.34.514-.752v-1.512m-2.32-10.54a2.227 2.227 0 0 0-2.226 2.227m10.338.981h1.834m-3.68-6.012l1.301-1.301M18.486 17l1.301 1.3M12 2.377V3.86m-6.76.73l1.292 1.302M4.24 18.3L5.532 17m-.864-5.096H2.835"})))}function f(){return e.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",width:24,height:24,viewBox:"0 0 24 24"},e.createElement("path",{fill:"currentColor",d:"m9.55 18l-5.7-5.7l1.425-1.425L9.55 15.15l9.175-9.175L20.15 7.4z"}))}function k(){return e.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",width:24,height:24,viewBox:"-2 -3 24 24"},e.createElement("path",{fill:"currentColor",d:"m12.8 1.613l6.701 11.161c.963 1.603.49 3.712-1.057 4.71a3.2 3.2 0 0 1-1.743.516H3.298C1.477 18 0 16.47 0 14.581c0-.639.173-1.264.498-1.807L7.2 1.613C8.162.01 10.196-.481 11.743.517c.428.276.79.651 1.057 1.096m-2.22.839a1.077 1.077 0 0 0-1.514.365L2.365 13.98a1.17 1.17 0 0 0-.166.602c0 .63.492 1.14 1.1 1.14H16.7c.206 0 .407-.06.581-.172a1.164 1.164 0 0 0 .353-1.57L10.933 2.817a1.1 1.1 0 0 0-.352-.365zM10 14a1 1 0 1 1 0-2a1 1 0 0 1 0 2m0-9a1 1 0 0 1 1 1v4a1 1 0 0 1-2 0V6a1 1 0 0 1 1-1"}))}function L(){return e.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",width:24,height:24,viewBox:"0 0 24 24"},e.createElement("path",{fill:"none",stroke:"currentColor",strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:1.5,d:"M20.5 15.8V8.2a1.91 1.91 0 0 0-.944-1.645l-6.612-3.8a1.88 1.88 0 0 0-1.888 0l-6.612 3.8A1.9 1.9 0 0 0 3.5 8.2v7.602a1.91 1.91 0 0 0 .944 1.644l6.612 3.8a1.88 1.88 0 0 0 1.888 0l6.612-3.8A1.9 1.9 0 0 0 20.5 15.8M12 7.627v5.5m0 3.246v-.5"}))}function b(){return e.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",width:24,height:24,viewBox:"0 0 24 24"},e.createElement("g",{className:"pin-outline"},e.createElement("g",{fill:"currentColor",fillRule:"evenodd",className:"Vector",clipRule:"evenodd"},e.createElement("path",{d:"M12 16.143a1 1 0 0 1 1 1V21a1 1 0 0 1-2 0v-3.857a1 1 0 0 1 1-1"}),e.createElement("path",{d:"M8.447 4.223q0 .01.007.033c.05.17.12.344.198.51c.262.549.53 1.246.53 2.027v3.85c0 1.03-.442 1.97-1.109 2.666c-.49.512-.873.979-1.169 1.391c-.114.16-.133.269-.135.321a.25.25 0 0 0 .052.16c.089.126.352.319.83.319h4.985a1 1 0 1 1 0 2H7.652c-.987 0-1.93-.403-2.468-1.17c-.58-.827-.556-1.887.095-2.795c.355-.495.8-1.035 1.35-1.61c.358-.373.553-.833.553-1.282v-3.85c0-.335-.118-.71-.336-1.168a5.5 5.5 0 0 1-.31-.805c-.265-.898.081-1.68.664-2.168C7.736 2.204 8.455 2 9.124 2h3.512a1 1 0 1 1 0 2H9.124c-.303 0-.536.099-.64.186a.2.2 0 0 0-.037.037m-.005.007"}),e.createElement("path",{d:"M15.553 4.223a3.5 3.5 0 0 1-.206.543c-.26.549-.529 1.246-.529 2.027v3.85c0 1.03.442 1.97 1.109 2.666c.49.512.873.979 1.169 1.391c.114.16.133.269.135.321a.25.25 0 0 1-.052.16c-.089.126-.352.319-.83.319h-4.985a1 1 0 1 0 0 2h4.985c.986 0 1.928-.403 2.467-1.17c.58-.827.556-1.887-.095-2.795c-.355-.495-.8-1.035-1.35-1.61c-.358-.373-.553-.833-.553-1.282v-3.85c0-.335.118-.71.335-1.168c.116-.243.226-.515.311-.805c.265-.898-.081-1.68-.664-2.168C16.264 2.204 15.545 2 14.876 2h-3.512a1 1 0 1 0 0 2h3.512c.303 0 .536.099.64.186q.029.026.037.037m.005.007"}))))}function M(t){var r=t.title,n=t.description,a=t.imgSrc,o=t.imgAlt,i=t.logoSrc,s=t.logoAlt,m=t.shadow,d=t.href,u=t.link,h=t.btnText,p=u;return e.createElement("xyd-card",{"data-shadow":m||void 0,className:"c1vswvqd"},a&&e.createElement("div",{part:"image-container"},e.createElement("div",{part:"bg"},e.createElement("img",{src:a,alt:o}),e.createElement("div",{part:"bg-shadow"})),p&&d&&i&&e.createElement(p,{target:"_blank",rel:"noopener",part:"author-link",href:d},e.createElement("img",{src:i,alt:s}))),e.createElement("div",{part:"body"},e.createElement("div",{part:"header"},p&&d&&!i?e.createElement(l,{weight:"bold"},e.createElement(p,{href:d},r)):e.createElement(l,{weight:"bold"},r),h&&e.createElement(c,{size:"md",kind:"secondary"},h)),e.createElement("div",{part:"description"},e.createElement(l,{size:"small"},n))))}function x(t){var r=t.className,n=t.children;return e.createElement("code",{className:"".concat("c1w59zdn"," ").concat(r||"")},e.createElement("span",{part:"content"},n))}function y(){var t=C(),r=o(t,2),n=r[0],a=r[1];return e.createElement(c,{size:"sm",theme:"ghost",icon:"dark"===n?e.createElement(W,null):e.createElement(N,null),onClick:a})}function C(){var e=r(null),t=o(e,2),a=t[0],c=t[1];return n(function(){var e=function(){var e=document.querySelector("html");if(e){var t=e.getAttribute("data-color-scheme")||"os";if("os"===t){var r=B()||"light";c(r),j(r)}else{var n=t;c(n),j(n)}}};e();var t=new MutationObserver(e),r=document.querySelector("html");return r&&t.observe(r,{attributes:!0,attributeFilter:["data-color-scheme"]}),function(){return t.disconnect()}},[]),[a,function(){var e="",t=B();t&&(e="dark"===t?"light":"dark");var r=document.querySelector("html");if(r){var n=r.getAttribute("data-color-scheme");n&&"os"!==n&&(e="dark"===n?"light":"dark"),e||(e="light"),r.setAttribute("data-color-scheme",e),localStorage.setItem("xyd-color-scheme",e),j(e)}}]}function j(e){var t=document.querySelector("style[data-color-scheme-style]");t||((t=document.createElement("style")).setAttribute("data-color-scheme-style","true"),document.head.appendChild(t)),t.textContent=":root { color-scheme: ".concat(e,"; }")}function B(){return window.matchMedia("(prefers-color-scheme: dark)").matches?"dark":window.matchMedia("(prefers-color-scheme: light)").matches?"light":null}function N(){return e.createElement("svg",{width:16,height:16,viewBox:"0 0 16 16",fill:"none",stroke:"currentColor",xmlns:"http://www.w3.org/2000/svg"},e.createElement("g",{clipPath:"url(#clip0_2880_7340)"},e.createElement("path",{d:"M8 1.11133V2.00022",strokeWidth:1.5,strokeLinecap:"round",strokeLinejoin:"round"}),e.createElement("path",{d:"M12.8711 3.12891L12.2427 3.75735",strokeWidth:1.5,strokeLinecap:"round",strokeLinejoin:"round"}),e.createElement("path",{d:"M14.8889 8H14",strokeWidth:1.5,strokeLinecap:"round",strokeLinejoin:"round"}),e.createElement("path",{d:"M12.8711 12.8711L12.2427 12.2427",strokeWidth:1.5,strokeLinecap:"round",strokeLinejoin:"round"}),e.createElement("path",{d:"M8 14.8889V14",strokeWidth:1.5,strokeLinecap:"round",strokeLinejoin:"round"}),e.createElement("path",{d:"M3.12891 12.8711L3.75735 12.2427",strokeWidth:1.5,strokeLinecap:"round",strokeLinejoin:"round"}),e.createElement("path",{d:"M1.11133 8H2.00022",strokeWidth:1.5,strokeLinecap:"round",strokeLinejoin:"round"}),e.createElement("path",{d:"M3.12891 3.12891L3.75735 3.75735",strokeWidth:1.5,strokeLinecap:"round",strokeLinejoin:"round"}),e.createElement("path",{d:"M8.00043 11.7782C10.0868 11.7782 11.7782 10.0868 11.7782 8.00043C11.7782 5.91402 10.0868 4.22266 8.00043 4.22266C5.91402 4.22266 4.22266 5.91402 4.22266 8.00043C4.22266 10.0868 5.91402 11.7782 8.00043 11.7782Z",strokeWidth:1.5,strokeLinecap:"round",strokeLinejoin:"round"})),e.createElement("defs",null,e.createElement("clipPath",{id:"clip0_2880_7340"},e.createElement("rect",{width:16,height:16,fill:"white"}))))}function W(){return e.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",width:16,height:16,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round"},e.createElement("path",{d:"M12 3a6 6 0 0 0 9 9 9 9 0 1 1-9-9Z"}))}function z(t){var r,n=t.children,a=t.label,c=s(),l=i(c.docs.details.open,c.docs.details.close,function(){return{label:a}}),o=["secondary","tertiary"].includes(t.kind||"");o&&"title"in t&&(r=t.title);var m=t.kind||"primary";return e.createElement("details",{part:"details",className:"".concat("dwmojve"," ").concat(t.className||""),"data-kind":t.kind,onClick:l},e.createElement("summary",{part:"summary"},"primary"===m&&e.createElement(e.Fragment,null,t.icon||e.createElement(A,null),e.createElement("div",{part:"summary-deep-label"},a)),o&&e.createElement("div",null,e.createElement("div",{part:"summary-deep"},t.icon||e.createElement(H,null),e.createElement("div",{part:"summary-deep-text"},r)),e.createElement("div",{part:"summary-deep-label"},a)),o&&e.createElement(A,null)),e.createElement("div",{part:"content"},n))}function A(){return e.createElement("div",{part:"icon"},e.createElement("svg",{"data-icon":"true",xmlns:"http://www.w3.org/2000/svg",width:"1em",height:"1em",fill:"currentColor",viewBox:"0 0 24 24"},e.createElement("path",{fillRule:"evenodd",d:"M8.293 4.293a1 1 0 0 1 1.414 0l7 7a1 1 0 0 1 0 1.414l-7 7a1 1 0 0 1-1.414-1.414L14.586 12 8.293 5.707a1 1 0 0 1 0-1.414Z",clipRule:"evenodd"})))}function H(){return e.createElement("svg",{width:"1em",height:"1em",viewBox:"0 0 24 24",stroke:"none",fill:"currentColor",xmlns:"http://www.w3.org/2000/svg"},e.createElement("g",{clipPath:"url(#clip0_1689_2180)"},e.createElement("path",{d:"M4.3 4.3L7.1 7.1M10.6 5.7V1.5M14.8 7.8L17.6 5M5.7 11.3H1.5M7.1 14.8L4.3 17.6M15.5 22.5L9.9 9.9L22.5 14.8L16.9 16.2L15.5 22.5Z",stroke:"currentColor",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round"})),e.createElement("defs",null,e.createElement("clipPath",{id:"clip0_1689_2180"},e.createElement("rect",{width:24,height:24,fill:"white"}))))}function _(){return e.createElement("hr",{part:"hr",className:"h1ej4n95"})}function q(t){var r=t.src,n=t.alt,c=t.style,l=t.caption;t.children;var o=a(t,["src","alt","style","caption","children"]),i=e.createElement("img",Object.assign({src:r,alt:n,style:c,className:"iz14jlg"},o));return l?e.createElement(e.Fragment,null,e.createElement("figure",null,i,e.createElement("figcaption",null,l))):i}function V(t){var r=t.date,n=t.version,a=t.children;return e.createElement("xyd-update",{className:"u1465cfe"},e.createElement("div",{part:"meta"},r&&e.createElement("div",{part:"date"},e.createElement(m,null,r)),e.createElement("div",{part:"version"},e.createElement(l,{size:"small"},n))),e.createElement("div",{part:"content-container"},e.createElement("div",{part:"content"},a)))}export{d as B,y as C,z as D,_ as H,q as I,V as U,v as a,x as b,h as c,M as d,C as u};
+//# sourceMappingURL=Update-53fEhmjh.js.map

package/dist/Update-53fEhmjh.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Update-53fEhmjh.js","sources":["../src/writer/Blockquote/Blockquote.tsx","../src/writer/Blockquote/Blockquote.styles.tsx","../src/writer/Breadcrumbs/Breadcrumbs.tsx","../src/writer/Breadcrumbs/Breadcrumbs.styles.ts","../src/writer/Callout/Callout.tsx","../src/writer/Callout/Callout.styles.tsx","../src/writer/Card/Card.tsx","../src/writer/Card/Card.styles.tsx","../src/writer/Code/Code.tsx","../src/writer/Code/Code.styles.tsx","../src/writer/ColorSchemeButton/ColorSchemeButton.tsx","../src/writer/Details/Details.tsx","../src/writer/Details/Details.styles.tsx","../src/writer/Hr/Hr.tsx","../src/writer/Hr/Hr.styles.tsx","../src/writer/Image/Image.tsx","../src/writer/Image/Image.styles.tsx","../src/writer/Update/Update.tsx","../src/writer/Update/Update.styles.tsx"],"sourcesContent":["import React from \"react\"\n\nimport * as cn from \"./Blockquote.styles\";\n\nexport interface BlockquoteProps {\n    className?: string;\n    children: React.ReactNode;\n}\n\nexport function Blockquote({ className, children }: BlockquoteProps) {\n    return <blockquote\n        className={`${cn.BlockquoteHost} ${className || ''}`}\n    >\n        <$SVGQuote />\n\n        <div>\n            {children}\n        </div>\n    </blockquote>\n}\n\nfunction $SVGQuote(props: React.SVGProps<SVGSVGElement>) {\n    return (\n        <svg\n            width={15}\n            height={11}\n            viewBox=\"0 0 15 11\"\n            xmlns=\"http://www.w3.org/2000/svg\"\n            part=\"quote\"\n            {...props}\n        >\n            <path\n                d=\"M15 1.72c-1.96.95-2.94 2.07-2.94 3.36.83.1 1.53.44 2.07 1.02.55.58.82 1.25.82 2.01a2.81 2.81 0 0 1-2.8 2.89c-.9 0-1.68-.36-2.33-1.09a3.78 3.78 0 0 1-1-2.63c0-3.1 1.76-5.53 5.26-7.28L15 1.72zm-8.83 0c-1.97.95-2.96 2.07-2.96 3.36.85.1 1.55.44 2.1 1.02.54.58.82 1.25.82 2.01A2.82 2.82 0 0 1 3.3 11 3 3 0 0 1 .98 9.91 3.8 3.8 0 0 1 0 7.28C0 4.18 1.74 1.75 5.23 0l.94 1.72z\"\n                fillRule=\"nonzero\"\n            />\n        </svg>\n    )\n}","import {css} from \"@linaria/core\";\n\nexport const BlockquoteHost = css`\n    @layer defaults {\n        border-color: var(--xyd-blockquote-border-color);\n        color: var(--xyd-blockquote-color);\n        font-style: italic;\n        margin: 0;\n        display: grid;\n        grid: auto / 24px auto;\n\n        [part=\"quote\"] {\n            fill: var(--color-primary);\n        }\n        \n        p::after {\n            content: \"”\";\n        }\n    }\n`;","import React, { Fragment } from 'react'\nimport type { ReactElement } from 'react'\n\nimport * as cn from './Breadcrumbs.styles'\n\nexport interface BreadcrumbsProps {\n    className?: string;\n    items: {\n        title: string\n        href?: string\n    }[]\n\n    as?: React.ElementType\n}\n\nexport function Breadcrumbs({ className, items, as }: BreadcrumbsProps): ReactElement {\n    const Link = as || $Link\n\n    return (\n        <xyd-breadcrumbs\n            className={`${cn.BreadcrumbsHost} ${className || ''}`}\n        >\n            {items.map((item, index) => {\n                const lastActive = index === items.length - 1\n\n                return (\n                    <Fragment key={item.href + item.title}>\n                        {index > 0 && <$BreadcrumbIcon />}\n                        <div\n                            part=\"item\"\n                            data-active={lastActive ? \"true\" : \"false\"}\n                        >\n                            {item.href && !lastActive ? (\n                                <Link href={item.href}>{item.title}</Link>\n                            ) : (\n                                item.title\n                            )}\n                        </div>\n                    </Fragment>\n                )\n            })}\n        </xyd-breadcrumbs>\n    )\n}\n\nfunction $BreadcrumbIcon() {\n    return <span part=\"icon\">/</span>\n}\n\nfunction $Link({ href, children, ...rest }) {\n    return <a\n        href={href}\n        {...rest}\n    >\n        {children}\n    </a>\n}","import { css } from \"@linaria/core\";\n\nexport const BreadcrumbsHost = css`\n    @layer defaults {\n        display: flex;\n        overflow: hidden;\n        gap: 4px;\n        align-items: center;\n        color: var(--xyd-breadcrumbs-color);\n        \n        [part=\"icon\"] {\n        }\n        \n        [part=\"item\"] {\n            white-space: nowrap;\n            transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;\n            transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n            transition-duration: 300ms;\n        }\n        \n        [part=\"item\"][data-active=\"true\"] {\n        }\n    }\n`;\n","import React from \"react\"\n\nimport * as cn from \"./Callout.styles\";\n\n/**\n * Props for the Callout component\n */\nexport interface CalloutProps {\n    /** Additional CSS class name to be applied to the callout */\n    className?: string;\n\n    /** Content to be displayed inside the callout */\n    children: React.ReactNode;\n\n    kind?: \"warning\" | \"note\" | \"tip\" | \"check\" | \"danger\"\n}\n\n/**\n * A Callout component that displays important information or notices in a visually distinct way.\n * It includes an info icon and a message area for content.\n * \n * @category Component\n */\nexport function Callout({ className, children, kind }: CalloutProps) {\n    let icon\n\n    switch (kind) {\n        case \"tip\":\n            icon = <$BulbIcon />\n            break\n        case \"check\":\n            icon = <$CheckIcon />\n            break\n        case \"warning\":\n            icon = <$WarningIcon />\n            break\n        case \"danger\":\n            icon = <$DangerIcon />\n            break\n        case \"note\":\n            icon = <$NoteIcon />\n            break\n        default:\n            icon = <$IconInfo />\n            break\n    }\n\n    return <xyd-callout\n        data-kind={kind}\n        className={`${cn.CalloutHost} ${className || ''}`}\n    >\n        <div part=\"icon\">\n            {icon}\n        </div>\n        <div part=\"message\">\n            <div part=\"message-body\">\n                {children}\n            </div>\n        </div>\n    </xyd-callout>\n}\n\nfunction $IconInfo() {\n    return <svg\n        xmlns=\"http://www.w3.org/2000/svg\"\n        width=\"24\"\n        height=\"24\"\n        fill=\"currentColor\"\n        viewBox=\"0 0 24 24\"\n    >\n        <path d=\"M13 12a1 1 0 1 0-2 0v4a1 1 0 1 0 2 0v-4Zm-1-2.5A1.25 1.25 0 1 0 12 7a1.25 1.25 0 0 0 0 2.5Z\" />\n        <path\n            fillRule=\"evenodd\"\n            d=\"M12 2C6.477 2 2 6.477 2 12s4.477 10 10 10 10-4.477 10-10S17.523 2 12 2ZM4 12a8 8 0 1 1 16 0 8 8 0 0 1-16 0Z\"\n            clipRule=\"evenodd\"\n        />\n    </svg>\n}\n\nfunction $BulbIcon() {\n    return <svg\n        xmlns=\"http://www.w3.org/2000/svg\"\n        width=\"24\"\n        height=\"24\"\n        viewBox=\"0 0 24 24\"\n    >\n        <g\n            fill=\"none\"\n            stroke=\"currentColor\"\n            strokeLinecap=\"round\"\n            strokeLinejoin=\"round\"\n            strokeWidth={1.5}\n        >\n            <path d=\"M17.252 12.49c-.284 2.365-1.833 3.31-2.502 3.996c-.67.688-.55.825-.505 1.834a.916.916 0 0 1-.916.971h-2.658a.92.92 0 0 1-.917-.971c0-.99.092-1.22-.504-1.834c-.76-.76-2.548-1.833-2.548-4.784a5.307 5.307 0 1 1 10.55.788\" />\n            <path d=\"M10.46 19.236v1.512c0 .413.23.752.513.752h2.053c.285 0 .514-.34.514-.752v-1.512m-2.32-10.54a2.227 2.227 0 0 0-2.226 2.227m10.338.981h1.834m-3.68-6.012l1.301-1.301M18.486 17l1.301 1.3M12 2.377V3.86m-6.76.73l1.292 1.302M4.24 18.3L5.532 17m-.864-5.096H2.835\" />\n        </g>\n    </svg>\n}\n\nfunction $CheckIcon() {\n    return <svg\n        xmlns=\"http://www.w3.org/2000/svg\"\n        width={24}\n        height={24}\n        viewBox=\"0 0 24 24\"\n    >\n        <path\n            fill=\"currentColor\"\n            d=\"m9.55 18l-5.7-5.7l1.425-1.425L9.55 15.15l9.175-9.175L20.15 7.4z\"\n        />\n    </svg>\n}\n\nfunction $WarningIcon() {\n    return <svg\n        xmlns=\"http://www.w3.org/2000/svg\"\n        width={24}\n        height={24}\n        viewBox=\"-2 -3 24 24\"\n    >\n        <path\n            fill=\"currentColor\"\n            d=\"m12.8 1.613l6.701 11.161c.963 1.603.49 3.712-1.057 4.71a3.2 3.2 0 0 1-1.743.516H3.298C1.477 18 0 16.47 0 14.581c0-.639.173-1.264.498-1.807L7.2 1.613C8.162.01 10.196-.481 11.743.517c.428.276.79.651 1.057 1.096m-2.22.839a1.077 1.077 0 0 0-1.514.365L2.365 13.98a1.17 1.17 0 0 0-.166.602c0 .63.492 1.14 1.1 1.14H16.7c.206 0 .407-.06.581-.172a1.164 1.164 0 0 0 .353-1.57L10.933 2.817a1.1 1.1 0 0 0-.352-.365zM10 14a1 1 0 1 1 0-2a1 1 0 0 1 0 2m0-9a1 1 0 0 1 1 1v4a1 1 0 0 1-2 0V6a1 1 0 0 1 1-1\"\n        />\n    </svg>\n}\n\nfunction $DangerIcon() {\n    return <svg\n        xmlns=\"http://www.w3.org/2000/svg\"\n        width={24}\n        height={24}\n        viewBox=\"0 0 24 24\"\n    >\n        <path\n            fill=\"none\"\n            stroke=\"currentColor\"\n            strokeLinecap=\"round\"\n            strokeLinejoin=\"round\"\n            strokeWidth={1.5}\n            d=\"M20.5 15.8V8.2a1.91 1.91 0 0 0-.944-1.645l-6.612-3.8a1.88 1.88 0 0 0-1.888 0l-6.612 3.8A1.9 1.9 0 0 0 3.5 8.2v7.602a1.91 1.91 0 0 0 .944 1.644l6.612 3.8a1.88 1.88 0 0 0 1.888 0l6.612-3.8A1.9 1.9 0 0 0 20.5 15.8M12 7.627v5.5m0 3.246v-.5\"\n        />\n    </svg>\n}\n\nfunction $NoteIcon() {\n    return <svg\n        xmlns=\"http://www.w3.org/2000/svg\"\n        width={24}\n        height={24}\n        viewBox=\"0 0 24 24\"\n    >\n        <g className=\"pin-outline\">\n            <g\n                fill=\"currentColor\"\n                fillRule=\"evenodd\"\n                className=\"Vector\"\n                clipRule=\"evenodd\"\n            >\n                <path d=\"M12 16.143a1 1 0 0 1 1 1V21a1 1 0 0 1-2 0v-3.857a1 1 0 0 1 1-1\" />\n                <path d=\"M8.447 4.223q0 .01.007.033c.05.17.12.344.198.51c.262.549.53 1.246.53 2.027v3.85c0 1.03-.442 1.97-1.109 2.666c-.49.512-.873.979-1.169 1.391c-.114.16-.133.269-.135.321a.25.25 0 0 0 .052.16c.089.126.352.319.83.319h4.985a1 1 0 1 1 0 2H7.652c-.987 0-1.93-.403-2.468-1.17c-.58-.827-.556-1.887.095-2.795c.355-.495.8-1.035 1.35-1.61c.358-.373.553-.833.553-1.282v-3.85c0-.335-.118-.71-.336-1.168a5.5 5.5 0 0 1-.31-.805c-.265-.898.081-1.68.664-2.168C7.736 2.204 8.455 2 9.124 2h3.512a1 1 0 1 1 0 2H9.124c-.303 0-.536.099-.64.186a.2.2 0 0 0-.037.037m-.005.007\" />\n                <path d=\"M15.553 4.223a3.5 3.5 0 0 1-.206.543c-.26.549-.529 1.246-.529 2.027v3.85c0 1.03.442 1.97 1.109 2.666c.49.512.873.979 1.169 1.391c.114.16.133.269.135.321a.25.25 0 0 1-.052.16c-.089.126-.352.319-.83.319h-4.985a1 1 0 1 0 0 2h4.985c.986 0 1.928-.403 2.467-1.17c.58-.827.556-1.887-.095-2.795c-.355-.495-.8-1.035-1.35-1.61c-.358-.373-.553-.833-.553-1.282v-3.85c0-.335.118-.71.335-1.168c.116-.243.226-.515.311-.805c.265-.898-.081-1.68-.664-2.168C16.264 2.204 15.545 2 14.876 2h-3.512a1 1 0 1 0 0 2h3.512c.303 0 .536.099.64.186q.029.026.037.037m.005.007\" />\n            </g>\n        </g>\n    </svg>\n}","import { css } from \"@linaria/core\";\n\nexport const CalloutHost = css`\n    @layer defaults {\n        display: inline-flex;\n        align-items: center;\n        position: relative;\n        width: 100%;\n        min-width: 275px;\n        padding: 8px 12px;\n        border-radius: 8px;\n        text-align: center;\n        border: 1px solid var(--xyd-callout-border-color);\n        background-color: var(--xyd-callout-bgcolor);\n        overflow: auto;\n        \n        code {\n            background: var(--white);\n        }\n        \n        /* Common callout styles */\n        &[data-kind] {\n            --callout-border-color: color-mix(in srgb, var(--callout-color) 30%, transparent);\n            --callout-bgcolor: color-mix(in srgb, var(--callout-color-muted) 10%, transparent);\n            border-color: var(--callout-border-color);\n            background-color: var(--callout-bgcolor);\n\n            p {\n                color: var(--callout-color-active);\n            }\n\n            a {\n                color: var(--text-primary);\n                text-decoration: underline;\n                text-decoration-color: var(--callout-color-active);\n                text-underline-offset: 4px;\n                text-decoration-thickness: 1px;\n                font-weight: var(--xyd-font-weight--semibold);\n\n                &:hover {\n                    text-decoration-thickness: 2px;\n                }\n            }\n\n            [part=\"icon\"] {\n                svg {\n                    color: var(--callout-color-active);\n                    fill: var(--callout-color-active);\n                }\n            }\n        }\n        \n        &[data-kind=\"tip\"] {\n            --callout-color: var(--xyd-text-color--success);\n            --callout-color-muted: var(--xyd-text-color--success--muted);\n            --callout-color-active: var(--xyd-text-color--success--active);\n        }\n        \n        &[data-kind=\"check\"] {\n            --callout-color: var(--xyd-text-color--success);\n            --callout-color-muted: var(--xyd-text-color--success--muted);\n            --callout-color-active: var(--xyd-text-color--success--active);\n        }\n\n        &[data-kind=\"warning\"] {\n            --callout-color: var(--xyd-text-color--warn);\n            --callout-color-muted: var(--xyd-text-color--warn--muted);\n            --callout-color-active: var(--xyd-text-color--warn--active);\n        }\n        \n        &[data-kind=\"note\"] {\n            --callout-color: var(--xyd-text-color--info);\n            --callout-color-muted: var(--xyd-text-color--info--muted);\n            --callout-color-active: var(--xyd-text-color--info--active);\n        }\n        \n        &[data-kind=\"danger\"] {\n            --callout-color: var(--xyd-text-color--error);\n            --callout-color-muted: var(--xyd-text-color--error--muted);\n            --callout-color-active: var(--xyd-text-color--error--active);\n        }\n\n        [part=\"icon\"] {\n            display: inline-flex;\n            margin-right: 14px;\n            flex: 0 0 auto;\n            align-self: flex-start;\n            color: var(--xyd-callout-icon-color);\n            margin-top: 2px;\n        }\n        \n        [part=\"message\"] {\n            color: var(--xyd-callout-message-color);\n            text-align: left;\n            flex: 1 1 auto;\n        }\n        \n        [part=\"message-body\"] {\n        }\n        \n    }\n`;\n","import React from \"react\"\n\nimport { Button } from \"../Button\"\nimport { Text } from \"../Text\"\n\nimport * as cn from \"./Card.styles\"\n\ninterface CardProps {\n    title: string\n    href?: string\n    link?: React.ElementType\n\n    description?: string\n    btnText?: string\n\n    imgSrc?: string\n    imgAlt?: string\n\n    logoSrc?: string\n    logoAlt?: string\n\n    shadow?: \"md\"\n}\n\nexport function Card(props: CardProps) {\n    const {\n        title,\n        description,\n        imgSrc,\n        imgAlt,\n        logoSrc,\n        logoAlt,\n        shadow,\n        href,\n        link,\n        btnText,\n    } = props\n\n    const Link = link\n\n    return <xyd-card\n        data-shadow={shadow || undefined}\n        className={cn.CardHost}\n    >\n        {imgSrc && (\n            <div part=\"image-container\">\n                <div part=\"bg\">\n                    <img src={imgSrc} alt={imgAlt} />\n                    <div part=\"bg-shadow\" />\n                </div>\n\n                {\n                    Link && href && logoSrc && <Link\n                        target=\"_blank\"\n                        rel=\"noopener\"\n                        part=\"author-link\"\n                        href={href}\n                    >\n                        <img\n                            src={logoSrc}\n                            alt={logoAlt}\n                        />\n                    </Link>\n                }\n\n            </div>\n        )}\n\n        <div part=\"body\">\n            <div part=\"header\">\n                {Link && href && !logoSrc ?\n                    <Text weight=\"bold\">\n                        <Link href={href}>\n                            {title}\n                        </Link>\n                    </Text>\n                    : <Text weight=\"bold\">\n                        {title}\n                    </Text>}\n                {\n                    btnText && <Button size=\"md\" kind=\"secondary\">\n                        {btnText}\n                    </Button>\n                }\n            </div>\n            <div part=\"description\">\n                <Text size=\"small\">\n                    {description}\n                </Text>\n            </div>\n        </div>\n    </xyd-card>\n}\n\n","import { css } from \"@linaria/core\"\n\nexport const CardHost = css`\n    --card-shadow-atom-color: color-mix(\n        in srgb,\n        var(--black) 10%,\n        transparent 90%\n    );\n    --card-shadow: 0 1px 3px 0 var(--card-shadow-atom-color), 0 1px 2px -1px var(--card-shadow-atom-color);\n    --card-ring-offset-shadow: 0 0 var(--black);\n    --card-ring-shadow: 0 0 var(--black);\n\n    box-shadow: var(--card-ring-offset-shadow, 0 0 var(--black)), var(--card-ring-shadow, 0 0 var(--black)), var(--card-shadow);\n    /* box-shadow: 0 1px 2px 0 var(--xyd-card-shadow-color); */\n    \n    border-radius: 8px;\n    background-color: var(--xyd-card-bgcolor);\n    flex-direction: column;\n    display: flex;\n    overflow: hidden;\n    position: relative;\n    height: 100%;\n\n    /* &[data-shadow=\"md\"] {\n        box-shadow: 0 5px 40px var(--xyd-card-shadow-color);\n    } */\n\n    &:hover {\n        --card-shadow: 0 10px 15px -3px var(--card-shadow-atom-color), 0 4px 6px -4px var(--card-shadow-atom-color);\n        box-shadow: var(--card-ring-offset-shadow, 0 0 var(--black)), var(--card-ring-shadow, 0 0 var(--black)), var(--card-shadow);\n    }\n\n    [part=\"image-container\"] {\n        border-bottom: 2px solid var(--xyd-card-border-color);\n        height: 200px;\n        /* overflow: hidden; */\n        position: relative;\n        transition: transform 0.1s ease-in;\n\n        &:hover {\n            transform: scale(1.02);\n        }\n\n        [part=\"bg\"] {\n            background-size: cover;\n            background-repeat: no-repeat;\n            position: relative;\n            height: 100%;\n        }\n\n        [part=\"bg-shadow\"] {\n            --card-gradient-from: hsla(0, 0%, 4%, 0) var(--xyd-gradient-from-position);\n            --card-gradient-to: hsla(0, 0%, 4%, .2) var(--xyd-gradient-to-position);\n            --card-gradient-stops: var(--card-gradient-from), hsla(0, 0%, 4%, .1) var(--xyd-gradient-via-position), var(--card-gradient-to);\n            background-repeat: no-repeat;\n            background-size: cover;\n            height: 100%;\n            position: absolute;\n            top: 0;\n            width: 100%;\n            background-image: linear-gradient(to bottom, var(--card-gradient-stops));\n            pointer-events: none;\n        }\n        img {\n            width: 100%;\n            height: 100%;\n            object-fit: cover;\n            margin-bottom: -4px;\n        }\n    }\n\n    [part=\"author-link\"] {\n        --card-shadow: 0 4px 6px -1px var(--card-shadow-atom-color), 0 2px 4px -2px var(--card-shadow-atom-color);\n        --card-bg-opacity: 1;\n\n        box-shadow: var(--card-ring-offset-shadow, 0 0 var(--black)), var(--card-ring-shadow, 0 0 var(--black)), var(--card-shadow);\n        background-color: rgb(245 245 245 / var(--card-bg-opacity));\n        border-width: 1px;\n        border-color: var(--dark8);\n        border-radius: 9999px;\n        overflow: hidden;\n        width: 4rem;\n        height: 4rem;\n        z-index: 2;\n        left: 1.25rem;\n        bottom: -2rem;\n        position: absolute;\n\n        img {\n            width: 100%;\n            height: 100%;\n            display: block;\n            max-width: 100%;\n        }\n    }\n\n    [part=\"body\"] {\n        /* padding: 16px; */\n\n        padding: 50px 1.25rem;\n\n        [part=\"header\"] {\n            margin-right: 4px;\n            align-items: center;\n            justify-content: space-between;\n            /* margin-bottom: 12px; */\n            display: flex;\n        }\n    }\n`","import React from \"react\"\n\nimport * as cn from \"./Code.styles\";\n\nexport interface CodeProps {\n    className?: string;\n    children: React.ReactNode;\n}\n\nexport function Code({ className, children }: CodeProps) {\n    return <code className={`${cn.CodeHost} ${className || ''}`}>\n        <span part=\"content\">\n            {children}\n        </span>\n    </code>\n}","import {css} from \"@linaria/core\";\n\nexport const CodeHost = css`\n    @layer defaults {\n        display: inline-block;\n        padding: 0 .3em;\n        border-radius: 6px;\n        margin: 0 3px;\n        border: .5px solid var(--xyd-code-border-color);\n        background: var(--xyd-code-bgcolor);\n        \n        & [part=\"content\"] {\n            position: relative;\n        }\n    }\n`;","import React, { useEffect, useState } from \"react\";\n\nimport { Button } from \"../Button\";\n\nexport function ColorSchemeButton() {\n    const [currentScheme, changeColorScheme] = useColorScheme() as [string, () => void]\n\n    return <Button\n        size=\"sm\"\n        theme=\"ghost\"\n        icon={currentScheme === \"dark\" ? <IconDarkMode /> : <IconLightMode />}\n        onClick={changeColorScheme}\n    />\n}\n\nexport function useColorScheme(): [\"dark\" | \"light\" | null, () => void] {\n    const [currentScheme, setCurrentScheme] = useState<\"dark\" | \"light\" | null>(null)\n\n    // TODO: context \n    useEffect(() => {\n        const updateScheme = () => {\n            const html = document.querySelector(\"html\");\n            if (html) {\n                const scheme = html.getAttribute(\"data-color-scheme\") || \"os\";\n                if (scheme === \"os\") {\n                    const preferred = getPreferredColorScheme();\n                    const finalScheme = preferred || \"light\";\n                    setCurrentScheme(finalScheme);\n                    updateColorSchemeInHead(finalScheme);\n                } else {\n                    const finalScheme = scheme as \"dark\" | \"light\";\n                    setCurrentScheme(finalScheme);\n                    updateColorSchemeInHead(finalScheme);\n                }\n            }\n        };\n\n        updateScheme();\n\n        // Listen for changes to the color scheme\n        const observer = new MutationObserver(updateScheme);\n        const html = document.querySelector(\"html\");\n        if (html) {\n            observer.observe(html, { attributes: true, attributeFilter: ['data-color-scheme'] });\n        }\n\n        return () => observer.disconnect();\n    }, []);\n\n    function changeColorScheme() {\n        let colorScheme = \"\"\n\n        const preferredColorScheme = getPreferredColorScheme()\n        if (preferredColorScheme) {\n            colorScheme = preferredColorScheme === \"dark\" ? \"light\" : \"dark\"\n        }\n\n        const html = document.querySelector(\"html\");\n        if (!html) return;\n\n        const currentScheme = html.getAttribute(\"data-color-scheme\");\n        if (currentScheme && currentScheme !== \"os\") {\n            colorScheme = currentScheme === \"dark\" ? \"light\" : \"dark\";\n        }\n        if (!colorScheme) {\n            colorScheme = \"light\"\n        }\n\n        html.setAttribute(\"data-color-scheme\", colorScheme);\n        localStorage.setItem(\"xyd-color-scheme\", colorScheme);\n        updateColorSchemeInHead(colorScheme as \"dark\" | \"light\");\n    }\n\n    return [currentScheme, changeColorScheme]\n}\n\n\n// Function to update color-scheme in document head\nfunction updateColorSchemeInHead(scheme: \"dark\" | \"light\") {\n    let styleElement = document.querySelector('style[data-color-scheme-style]');\n\n    if (!styleElement) {\n        styleElement = document.createElement('style');\n        styleElement.setAttribute('data-color-scheme-style', 'true');\n        document.head.appendChild(styleElement);\n    }\n\n    styleElement.textContent = `:root { color-scheme: ${scheme}; }`;\n}\n\nfunction getPreferredColorScheme() {\n    if (window.matchMedia('(prefers-color-scheme: dark)').matches) {\n        return 'dark';\n    }\n\n    if (window.matchMedia('(prefers-color-scheme: light)').matches) {\n        return 'light';\n    }\n\n    return null\n}\n\n\nfunction IconLightMode() {\n    return <svg\n        width={16}\n        height={16}\n        viewBox=\"0 0 16 16\"\n        fill=\"none\"\n        stroke=\"currentColor\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n    >\n        <g clipPath=\"url(#clip0_2880_7340)\">\n            <path\n                d=\"M8 1.11133V2.00022\"\n                strokeWidth={1.5}\n                strokeLinecap=\"round\"\n                strokeLinejoin=\"round\"\n            />\n            <path\n                d=\"M12.8711 3.12891L12.2427 3.75735\"\n                strokeWidth={1.5}\n                strokeLinecap=\"round\"\n                strokeLinejoin=\"round\"\n            />\n            <path\n                d=\"M14.8889 8H14\"\n                strokeWidth={1.5}\n                strokeLinecap=\"round\"\n                strokeLinejoin=\"round\"\n            />\n            <path\n                d=\"M12.8711 12.8711L12.2427 12.2427\"\n                strokeWidth={1.5}\n                strokeLinecap=\"round\"\n                strokeLinejoin=\"round\"\n            />\n            <path\n                d=\"M8 14.8889V14\"\n                strokeWidth={1.5}\n                strokeLinecap=\"round\"\n                strokeLinejoin=\"round\"\n            />\n            <path\n                d=\"M3.12891 12.8711L3.75735 12.2427\"\n                strokeWidth={1.5}\n                strokeLinecap=\"round\"\n                strokeLinejoin=\"round\"\n            />\n            <path\n                d=\"M1.11133 8H2.00022\"\n                strokeWidth={1.5}\n                strokeLinecap=\"round\"\n                strokeLinejoin=\"round\"\n            />\n            <path\n                d=\"M3.12891 3.12891L3.75735 3.75735\"\n                strokeWidth={1.5}\n                strokeLinecap=\"round\"\n                strokeLinejoin=\"round\"\n            />\n            <path\n                d=\"M8.00043 11.7782C10.0868 11.7782 11.7782 10.0868 11.7782 8.00043C11.7782 5.91402 10.0868 4.22266 8.00043 4.22266C5.91402 4.22266 4.22266 5.91402 4.22266 8.00043C4.22266 10.0868 5.91402 11.7782 8.00043 11.7782Z\"\n                strokeWidth={1.5}\n                strokeLinecap=\"round\"\n                strokeLinejoin=\"round\"\n            />\n        </g>\n        <defs>\n            <clipPath id=\"clip0_2880_7340\">\n                <rect width={16} height={16} fill=\"white\" />\n            </clipPath>\n        </defs>\n    </svg>\n}\n\nfunction IconDarkMode() {\n    return <svg\n        xmlns=\"http://www.w3.org/2000/svg\"\n        width={16}\n        height={16}\n        viewBox=\"0 0 24 24\"\n        fill=\"none\"\n        stroke=\"currentColor\"\n        strokeWidth={2}\n        strokeLinecap=\"round\"\n        strokeLinejoin=\"round\"\n    >\n        <path d=\"M12 3a6 6 0 0 0 9 9 9 9 0 1 1-9-9Z\" />\n    </svg>\n}\n","import React, {} from \"react\"\n\nimport * as cn from \"./Details.styles\";\nimport {useUXClick, useUXEvents} from \"../../uxsdk\";\n\n/**\n * Base interface for all Details component variants\n */\nexport interface BaseDetailsProps {\n    /** Content to be displayed inside the details element */\n    children: React.ReactNode;\n\n    /** Label text displayed in the summary */\n    label: string;\n\n    /** Optional icon element to be displayed in the summary */\n    icon?: React.ReactElement;\n\n    /** Optional CSS class name for custom styling */\n    className?: string;\n}\n\n/**\n * Props for the tertiary variant of the Details component\n */\nexport interface TertiaryDetailsProps extends BaseDetailsProps {\n    /** Specifies the tertiary variant */\n    kind: \"tertiary\";\n\n    /** Title text or element displayed in the summary */\n    title: string | React.ReactNode;\n}\n\n/**\n * Props for the secondary variant of the Details component\n */\nexport interface SecondaryDetailsProps extends BaseDetailsProps {\n    /** Specifies the secondary variant */\n    kind: \"secondary\";\n\n    /** Title text or element displayed in the summary */\n    title: string | React.ReactNode;\n}\n\n/**\n * Props for the primary variant of the Details component\n */\nexport interface PrimaryDetailsProps extends BaseDetailsProps {\n    /** Specifies the primary variant (default) */\n    kind?: \"primary\";\n}\n\n/** Union type of all possible Details component variants */\nexport type DetailsProps = PrimaryDetailsProps | SecondaryDetailsProps | TertiaryDetailsProps\n\n/**\n * A collapsible details component that supports three variants: primary, secondary, and tertiary.\n * Each variant has a different visual style and structure.\n *\n * @param props - The component props\n * @returns A details element with collapsible content\n *\n * @category Component\n */\nexport function Details(props: DetailsProps): React.ReactElement {\n    const {children, label} = props;\n\n    const ux = useUXEvents();\n    const uxClick = useUXClick(\n        ux.docs.details.open,\n        ux.docs.details.close,\n        () => ({label})\n    )\n\n    let title\n\n    const isDeepKind = [\"secondary\", \"tertiary\"].includes(props.kind || \"\");\n\n    if (isDeepKind && \"title\" in props) {\n        title = props.title;\n    }\n\n    const kind = props.kind || \"primary\";\n\n    return <details\n        part=\"details\"\n        className={`${cn.DetailsHost} ${props.className || \"\"}`}\n        data-kind={props.kind}\n        onClick={uxClick}\n    >\n        <summary part=\"summary\">\n            {kind === \"primary\" && (\n                <>\n                    {props.icon || <$Icon/>}\n                    <div part=\"summary-deep-label\">\n                        {label}\n                    </div>\n                </>\n            )}\n\n            {isDeepKind && (\n                <div>\n                    <div part=\"summary-deep\">\n                        {props.icon || <$IconDeep/>}\n                        <div part=\"summary-deep-text\">\n                            {title}\n                        </div>\n                    </div>\n                    <div part=\"summary-deep-label\">\n                        {label}\n                    </div>\n                </div>\n            )}\n            {isDeepKind && <$Icon/>}\n        </summary>\n\n        <div part=\"content\">\n            {children}\n        </div>\n    </details>\n}\n\nfunction $Icon() {\n    return <div part=\"icon\">\n        <svg\n            // TODO: bad solution\n            data-icon=\"true\"\n            xmlns=\"http://www.w3.org/2000/svg\"\n            width=\"1em\"\n            height=\"1em\"\n            fill=\"currentColor\"\n            viewBox=\"0 0 24 24\"\n        >\n            <path\n                fillRule=\"evenodd\"\n                d=\"M8.293 4.293a1 1 0 0 1 1.414 0l7 7a1 1 0 0 1 0 1.414l-7 7a1 1 0 0 1-1.414-1.414L14.586 12 8.293 5.707a1 1 0 0 1 0-1.414Z\"\n                clipRule=\"evenodd\"\n            />\n        </svg>\n    </div>\n}\n\nfunction $IconDeep() {\n    return <svg\n        width=\"1em\"\n        height=\"1em\"\n        viewBox=\"0 0 24 24\"\n        stroke=\"none\"\n        fill=\"currentColor\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n    >\n        <g clipPath=\"url(#clip0_1689_2180)\">\n            <path\n                d=\"M4.3 4.3L7.1 7.1M10.6 5.7V1.5M14.8 7.8L17.6 5M5.7 11.3H1.5M7.1 14.8L4.3 17.6M15.5 22.5L9.9 9.9L22.5 14.8L16.9 16.2L15.5 22.5Z\"\n                stroke=\"currentColor\"\n                strokeWidth={2}\n                strokeLinecap=\"round\"\n                strokeLinejoin=\"round\"\n            />\n        </g>\n        <defs>\n            <clipPath id=\"clip0_1689_2180\">\n                <rect width={24} height={24} fill=\"white\"/>\n            </clipPath>\n        </defs>\n    </svg>\n}\n\n","import { css } from \"@linaria/core\";\n\nexport const DetailsHost = css`\n    @layer defaults {\n        border-top: 1px solid var(--xyd-details-border-color);\n    \n        &[data-kind=\"secondary\"], &[data-kind=\"tertiary\"] {\n            background-color:  var(--xyd-details-bgcolor--secondary);\n            border: 1px solid var(--xyd-details-border-color);\n            border-radius: 8px;\n        }\n\n        &[data-kind=\"tertiary\"] {\n            padding: 8px;\n\n            [part=\"content\"] {\n                border-radius: 8px;\n            }\n        }\n\n        &[open] [part=\"summary\"] svg[data-icon=\"true\"] { \n            transform: rotate(90deg);\n        }\n\n        [part=\"summary\"] {\n            padding: 16px 14px 16px 0;\n            cursor: pointer;\n            font-weight: var(--xyd-font-weight-medium);\n            font-variant-numeric: tabular-nums;\n            transition: color 0.3s;\n            display: flex;\n            flex-direction: row;\n            align-items: center;\n            justify-content: flex-start;\n            list-style: none;\n\n            &:hover {\n                color: var(--xyd-details-summary-color--active);\n            }\n        }\n\n        &[data-kind=\"tertiary\"] [part=\"summary\"]{\n            padding: 10px 24px;\n        }\n        &[data-kind=\"secondary\"],\n        &[data-kind=\"tertiary\"] {\n            [part=\"summary\"] {\n                display: flex;\n                justify-content: space-between;\n                align-items: center;\n                cursor: pointer;\n                padding: 20px 24px;\n            }\n        }\n\n        [part=\"summary-deep\"] {\n            display: flex;\n            align-items: center;\n            margin-bottom: 8px;\n        }\n\n        [part=\"summary-deep-text\"] {\n            color: var(--xyd-details-summary-color);\n            text-transform: none;\n            letter-spacing: .08em;\n            margin-left: 8px;\n            font-weight: var(--xyd-font-weight-bold);\n\n            code {\n                background: var(--xyd-details-summary-code-bgcolor);\n            }\n        }\n\n        [part=\"summary-deep-label\"] {\n            flex: 1 1 auto;\n        }\n\n        // TODO: after migration to web-components should be removed cuz 'part=\"content\"' can be also in another element as child\n        & > [part=\"content\"] { \n            padding: 0 24px 20px;\n        }\n        &[data-kind=\"tertiary\"] > [part=\"content\"] {\n            background-color: var(--xyd-details-content-bgcolor);\n            padding-top: 20px;\n\n            code {\n                background: var(--xyd-details-content-bgcolor);\n            }\n        }\n\n        [part=\"icon\"] {\n            flex: 0 0 auto;\n            font-size: var(--xyd-font-size-medium);\n            display: flex;\n            align-items: center;\n            justify-content: center;\n            padding-right: 6px;\n        }\n    }\n`;\n\n","import React from \"react\"\n\nimport * as cn from \"./Hr.styles\";\n\nexport interface HrProps {\n}\n\nexport function Hr() {\n    return <hr part=\"hr\" className={cn.HrHost}/>\n}","import {css} from \"@linaria/core\";\n\nexport const HrHost = css`\n    @layer defaults {\n        border: 0.5px solid var(--xyd-hr-border-color);\n    }\n`;","\n\nimport React from 'react';\n\nimport * as cn from \"./Image.styles\"\n\nexport interface ImageProps extends React.ImgHTMLAttributes<HTMLImageElement> {\n    src: string\n    alt: string\n    style?: React.CSSProperties\n    caption?: string\n}\n\nexport function Image(props: ImageProps) {\n    const { src, alt, style, caption, children, ...rest } = props\n\n    const img = <img\n        src={src}\n        alt={alt}\n        style={style}\n        className={cn.ImageHost}\n        {...rest}\n    />\n\n    if (!caption) {\n        return img\n    }\n\n    return <>\n        <figure>\n            {img}\n            <figcaption>{caption}</figcaption>\n        </figure>\n    </>\n}","import { css } from \"@linaria/core\"\n\nexport const ImageHost = css`\n    @layer defaults {\n        width: 100%;\n        border-radius: 16px;\n        box-shadow: 0 2px 16px rgba(0,0,0,0.06);\n    }\n`;","import React from 'react';\n\nimport { Badge } from '../Badge';\nimport { Text } from '../Text';\n\nimport * as cn from \"./Update.styles\"\n\ninterface UpdateProps {\n    children: React.ReactNode\n\n    version: string\n\n    date?: string\n}\n\nexport function Update(props: UpdateProps) {\n    const { date, version, children } = props;\n    return (\n        <xyd-update className={cn.UpdateHost}>\n            <div part=\"meta\">\n                {date && <div part=\"date\">\n                    <Badge>\n                        {date}\n                    </Badge>\n                </div>}\n                <div part=\"version\">\n                    <Text size=\"small\">\n                        {version}\n                    </Text>\n                </div>\n            </div>\n            <div part=\"content-container\">\n                <div part=\"content\">{children}</div>\n            </div>\n        </xyd-update>\n    );\n}\n","import { css } from \"@linaria/core\"\n\nexport const UpdateHost = css`\n    @layer defaults {\n        gap: 24px;\n        flex-direction: row;\n        padding-top: 32px;\n        padding-bottom: 32px;\n        align-items: flex-start;\n        width: 100%;\n        display: flex;\n        position: relative;\n\n        [part=\"meta\"] {\n            width: 160px;\n            position: sticky;\n            justify-content: flex-start;\n            align-items: flex-start;\n            flex-direction: column;\n            flex-shrink: 0;\n            display: flex;\n            gap: 10px;\n        }\n\n        [part=\"content-container\"] {\n            padding-left: 2px;\n            padding-right: 2px;\n            overflow: hidden;\n            flex: 1 1 0%;\n            max-width: 100%;\n        }\n    }\n`;"],"names":["Blockquote","_ref","className","children","React","createElement","concat","$SVGQuote","props","width","height","viewBox","xmlns","part","d","fillRule","Breadcrumbs","items","Link","as","$Link","map","item","index","lastActive","length","Fragment","key","href","title","$BreadcrumbIcon","_a","rest","__rest","Object","assign","Callout","icon","kind","$BulbIcon","$CheckIcon","$WarningIcon","$DangerIcon","$NoteIcon","$IconInfo","fill","clipRule","stroke","strokeLinecap","strokeLinejoin","strokeWidth","Card","description","imgSrc","imgAlt","logoSrc","logoAlt","shadow","link","btnText","undefined","src","alt","target","rel","Text","weight","Button","size","Code","ColorSchemeButton","_useColorScheme","useColorScheme","_useColorScheme2","_slicedToArray","currentScheme","changeColorScheme","theme","IconDarkMode","IconLightMode","onClick","_useState","useState","_useState2","setCurrentScheme","useEffect","updateScheme","html","document","querySelector","scheme","getAttribute","finalScheme","getPreferredColorScheme","updateColorSchemeInHead","observer","MutationObserver","observe","attributes","attributeFilter","disconnect","colorScheme","preferredColorScheme","setAttribute","localStorage","setItem","styleElement","head","appendChild","textContent","window","matchMedia","matches","clipPath","id","Details","label","ux","useUXEvents","uxClick","useUXClick","docs","details","open","close","isDeepKind","includes","$Icon","$IconDeep","Hr","Image","style","caption","img","Update","date","version","Badge"],"mappings":"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"}

package/dist/Update-CFi6uapq.js

@@ -0,0 +1,2 @@
+import e,{Fragment as t,useState as r,useEffect as n}from"react";import{a}from"./Icon-DbNmvK_Q.js";import{B as c}from"./Button-BTJ2hIal.js";import{T as l}from"./TabsAnalytics-DAOfTZgv.js";import{a as o}from"./_rollupPluginBabelHelpers-Dc-ocx4G.js";import{u as i}from"./useUXClick-DK3cTAMR.js";import{u as s}from"./useUXEvents-Cxgl7xb-.js";import{B as m}from"./VideoGuide-C0K9fFar.js";function d(t){var r=t.className,n=t.children;return e.createElement("blockquote",{className:"".concat("b1wifk81"," ").concat(r||"")},e.createElement(u,null),e.createElement("div",null,n))}function u(t){return e.createElement("svg",Object.assign({width:15,height:11,viewBox:"0 0 15 11",xmlns:"http://www.w3.org/2000/svg",part:"quote"},t),e.createElement("path",{d:"M15 1.72c-1.96.95-2.94 2.07-2.94 3.36.83.1 1.53.44 2.07 1.02.55.58.82 1.25.82 2.01a2.81 2.81 0 0 1-2.8 2.89c-.9 0-1.68-.36-2.33-1.09a3.78 3.78 0 0 1-1-2.63c0-3.1 1.76-5.53 5.26-7.28L15 1.72zm-8.83 0c-1.97.95-2.96 2.07-2.96 3.36.85.1 1.55.44 2.1 1.02.54.58.82 1.25.82 2.01A2.82 2.82 0 0 1 3.3 11 3 3 0 0 1 .98 9.91 3.8 3.8 0 0 1 0 7.28C0 4.18 1.74 1.75 5.23 0l.94 1.72z",fillRule:"nonzero"}))}function h(r){var n=r.className,a=r.items,c=r.as||E;return e.createElement("xyd-breadcrumbs",{className:"".concat("bwgsk4h"," ").concat(n||"")},a.map(function(r,n){var l=n===a.length-1;return e.createElement(t,{key:r.href+r.title},n>0&&e.createElement(p,null),e.createElement("div",{part:"item","data-active":l?"true":"false"},r.href&&!l?e.createElement(c,{href:r.href},r.title):r.title))}))}function p(){return e.createElement("span",{part:"icon"},"/")}function E(t){var r=t.href,n=t.children,c=a(t,["href","children"]);return e.createElement("a",Object.assign({href:r},c),n)}function v(t){var r,n=t.className,a=t.children,c=t.kind;switch(c){case"tip":r=e.createElement(w,null);break;case"check":r=e.createElement(f,null);break;case"warning":r=e.createElement(k,null);break;case"danger":r=e.createElement(L,null);break;case"note":r=e.createElement(b,null);break;default:r=e.createElement(g,null)}return e.createElement("xyd-callout",{"data-kind":c,className:"".concat("chnegou"," ").concat(n||"")},e.createElement("div",{part:"icon"},r),e.createElement("div",{part:"message"},e.createElement("div",{part:"message-body"},a)))}function g(){return e.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",width:"24",height:"24",fill:"currentColor",viewBox:"0 0 24 24"},e.createElement("path",{d:"M13 12a1 1 0 1 0-2 0v4a1 1 0 1 0 2 0v-4Zm-1-2.5A1.25 1.25 0 1 0 12 7a1.25 1.25 0 0 0 0 2.5Z"}),e.createElement("path",{fillRule:"evenodd",d:"M12 2C6.477 2 2 6.477 2 12s4.477 10 10 10 10-4.477 10-10S17.523 2 12 2ZM4 12a8 8 0 1 1 16 0 8 8 0 0 1-16 0Z",clipRule:"evenodd"}))}function w(){return e.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",width:"24",height:"24",viewBox:"0 0 24 24"},e.createElement("g",{fill:"none",stroke:"currentColor",strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:1.5},e.createElement("path",{d:"M17.252 12.49c-.284 2.365-1.833 3.31-2.502 3.996c-.67.688-.55.825-.505 1.834a.916.916 0 0 1-.916.971h-2.658a.92.92 0 0 1-.917-.971c0-.99.092-1.22-.504-1.834c-.76-.76-2.548-1.833-2.548-4.784a5.307 5.307 0 1 1 10.55.788"}),e.createElement("path",{d:"M10.46 19.236v1.512c0 .413.23.752.513.752h2.053c.285 0 .514-.34.514-.752v-1.512m-2.32-10.54a2.227 2.227 0 0 0-2.226 2.227m10.338.981h1.834m-3.68-6.012l1.301-1.301M18.486 17l1.301 1.3M12 2.377V3.86m-6.76.73l1.292 1.302M4.24 18.3L5.532 17m-.864-5.096H2.835"})))}function f(){return e.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",width:24,height:24,viewBox:"0 0 24 24"},e.createElement("path",{fill:"currentColor",d:"m9.55 18l-5.7-5.7l1.425-1.425L9.55 15.15l9.175-9.175L20.15 7.4z"}))}function k(){return e.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",width:24,height:24,viewBox:"-2 -3 24 24"},e.createElement("path",{fill:"currentColor",d:"m12.8 1.613l6.701 11.161c.963 1.603.49 3.712-1.057 4.71a3.2 3.2 0 0 1-1.743.516H3.298C1.477 18 0 16.47 0 14.581c0-.639.173-1.264.498-1.807L7.2 1.613C8.162.01 10.196-.481 11.743.517c.428.276.79.651 1.057 1.096m-2.22.839a1.077 1.077 0 0 0-1.514.365L2.365 13.98a1.17 1.17 0 0 0-.166.602c0 .63.492 1.14 1.1 1.14H16.7c.206 0 .407-.06.581-.172a1.164 1.164 0 0 0 .353-1.57L10.933 2.817a1.1 1.1 0 0 0-.352-.365zM10 14a1 1 0 1 1 0-2a1 1 0 0 1 0 2m0-9a1 1 0 0 1 1 1v4a1 1 0 0 1-2 0V6a1 1 0 0 1 1-1"}))}function L(){return e.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",width:24,height:24,viewBox:"0 0 24 24"},e.createElement("path",{fill:"none",stroke:"currentColor",strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:1.5,d:"M20.5 15.8V8.2a1.91 1.91 0 0 0-.944-1.645l-6.612-3.8a1.88 1.88 0 0 0-1.888 0l-6.612 3.8A1.9 1.9 0 0 0 3.5 8.2v7.602a1.91 1.91 0 0 0 .944 1.644l6.612 3.8a1.88 1.88 0 0 0 1.888 0l6.612-3.8A1.9 1.9 0 0 0 20.5 15.8M12 7.627v5.5m0 3.246v-.5"}))}function b(){return e.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",width:24,height:24,viewBox:"0 0 24 24"},e.createElement("g",{className:"pin-outline"},e.createElement("g",{fill:"currentColor",fillRule:"evenodd",className:"Vector",clipRule:"evenodd"},e.createElement("path",{d:"M12 16.143a1 1 0 0 1 1 1V21a1 1 0 0 1-2 0v-3.857a1 1 0 0 1 1-1"}),e.createElement("path",{d:"M8.447 4.223q0 .01.007.033c.05.17.12.344.198.51c.262.549.53 1.246.53 2.027v3.85c0 1.03-.442 1.97-1.109 2.666c-.49.512-.873.979-1.169 1.391c-.114.16-.133.269-.135.321a.25.25 0 0 0 .052.16c.089.126.352.319.83.319h4.985a1 1 0 1 1 0 2H7.652c-.987 0-1.93-.403-2.468-1.17c-.58-.827-.556-1.887.095-2.795c.355-.495.8-1.035 1.35-1.61c.358-.373.553-.833.553-1.282v-3.85c0-.335-.118-.71-.336-1.168a5.5 5.5 0 0 1-.31-.805c-.265-.898.081-1.68.664-2.168C7.736 2.204 8.455 2 9.124 2h3.512a1 1 0 1 1 0 2H9.124c-.303 0-.536.099-.64.186a.2.2 0 0 0-.037.037m-.005.007"}),e.createElement("path",{d:"M15.553 4.223a3.5 3.5 0 0 1-.206.543c-.26.549-.529 1.246-.529 2.027v3.85c0 1.03.442 1.97 1.109 2.666c.49.512.873.979 1.169 1.391c.114.16.133.269.135.321a.25.25 0 0 1-.052.16c-.089.126-.352.319-.83.319h-4.985a1 1 0 1 0 0 2h4.985c.986 0 1.928-.403 2.467-1.17c.58-.827.556-1.887-.095-2.795c-.355-.495-.8-1.035-1.35-1.61c-.358-.373-.553-.833-.553-1.282v-3.85c0-.335.118-.71.335-1.168c.116-.243.226-.515.311-.805c.265-.898-.081-1.68-.664-2.168C16.264 2.204 15.545 2 14.876 2h-3.512a1 1 0 1 0 0 2h3.512c.303 0 .536.099.64.186q.029.026.037.037m.005.007"}))))}function M(t){var r=t.title,n=t.description,a=t.imgSrc,o=t.imgAlt,i=t.logoSrc,s=t.logoAlt,m=t.shadow,d=t.href,u=t.link,h=t.btnText,p=u;return e.createElement("xyd-card",{"data-shadow":m||void 0,className:"c1vswvqd"},a&&e.createElement("div",{part:"image-container"},e.createElement("div",{part:"bg"},e.createElement("img",{src:a,alt:o}),e.createElement("div",{part:"bg-shadow"})),p&&d&&i&&e.createElement(p,{target:"_blank",rel:"noopener",part:"author-link",href:d},e.createElement("img",{src:i,alt:s}))),e.createElement("div",{part:"body"},e.createElement("div",{part:"header"},p&&d&&!i?e.createElement(l,{weight:"bold"},e.createElement(p,{href:d},r)):e.createElement(l,{weight:"bold"},r),h&&e.createElement(c,{size:"md",kind:"secondary"},h)),e.createElement("div",{part:"description"},e.createElement(l,{size:"small"},n))))}function x(t){var r=t.className,n=t.children;return e.createElement("code",{className:"".concat("c1w59zdn"," ").concat(r||"")},e.createElement("span",{part:"content"},n))}function y(){var t=C(),r=o(t,2),n=r[0],a=r[1];return e.createElement(c,{size:"sm",theme:"ghost",icon:"dark"===n?e.createElement(W,null):e.createElement(N,null),onClick:a})}function C(){var e=r(null),t=o(e,2),a=t[0],c=t[1];return n(function(){var e=function(){var e=document.querySelector("html");if(e){var t=e.getAttribute("data-color-scheme")||"os";if("os"===t){var r=B()||"light";c(r),j(r)}else{var n=t;c(n),j(n)}}};e();var t=new MutationObserver(e),r=document.querySelector("html");return r&&t.observe(r,{attributes:!0,attributeFilter:["data-color-scheme"]}),function(){return t.disconnect()}},[]),[a,function(){var e="",t=B();t&&(e="dark"===t?"light":"dark");var r=document.querySelector("html");if(r){var n=r.getAttribute("data-color-scheme");n&&"os"!==n&&(e="dark"===n?"light":"dark"),e||(e="light"),r.setAttribute("data-color-scheme",e),localStorage.setItem("xyd-color-scheme",e),j(e)}}]}function j(e){var t=document.querySelector("style[data-color-scheme-style]");t||((t=document.createElement("style")).setAttribute("data-color-scheme-style","true"),document.head.appendChild(t)),t.textContent=":root { color-scheme: ".concat(e,"; }")}function B(){return window.matchMedia("(prefers-color-scheme: dark)").matches?"dark":window.matchMedia("(prefers-color-scheme: light)").matches?"light":null}function N(){return e.createElement("svg",{width:16,height:16,viewBox:"0 0 16 16",fill:"none",stroke:"currentColor",xmlns:"http://www.w3.org/2000/svg"},e.createElement("g",{clipPath:"url(#clip0_2880_7340)"},e.createElement("path",{d:"M8 1.11133V2.00022",strokeWidth:1.5,strokeLinecap:"round",strokeLinejoin:"round"}),e.createElement("path",{d:"M12.8711 3.12891L12.2427 3.75735",strokeWidth:1.5,strokeLinecap:"round",strokeLinejoin:"round"}),e.createElement("path",{d:"M14.8889 8H14",strokeWidth:1.5,strokeLinecap:"round",strokeLinejoin:"round"}),e.createElement("path",{d:"M12.8711 12.8711L12.2427 12.2427",strokeWidth:1.5,strokeLinecap:"round",strokeLinejoin:"round"}),e.createElement("path",{d:"M8 14.8889V14",strokeWidth:1.5,strokeLinecap:"round",strokeLinejoin:"round"}),e.createElement("path",{d:"M3.12891 12.8711L3.75735 12.2427",strokeWidth:1.5,strokeLinecap:"round",strokeLinejoin:"round"}),e.createElement("path",{d:"M1.11133 8H2.00022",strokeWidth:1.5,strokeLinecap:"round",strokeLinejoin:"round"}),e.createElement("path",{d:"M3.12891 3.12891L3.75735 3.75735",strokeWidth:1.5,strokeLinecap:"round",strokeLinejoin:"round"}),e.createElement("path",{d:"M8.00043 11.7782C10.0868 11.7782 11.7782 10.0868 11.7782 8.00043C11.7782 5.91402 10.0868 4.22266 8.00043 4.22266C5.91402 4.22266 4.22266 5.91402 4.22266 8.00043C4.22266 10.0868 5.91402 11.7782 8.00043 11.7782Z",strokeWidth:1.5,strokeLinecap:"round",strokeLinejoin:"round"})),e.createElement("defs",null,e.createElement("clipPath",{id:"clip0_2880_7340"},e.createElement("rect",{width:16,height:16,fill:"white"}))))}function W(){return e.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",width:16,height:16,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round"},e.createElement("path",{d:"M12 3a6 6 0 0 0 9 9 9 9 0 1 1-9-9Z"}))}function z(t){var r,n=t.children,a=t.label,c=s(),l=i(c.docs.details.open,c.docs.details.close,function(){return{label:a}}),o=["secondary","tertiary"].includes(t.kind||"");o&&"title"in t&&(r=t.title);var m=t.kind||"primary";return e.createElement("details",{part:"details",className:"".concat("dwmojve"," ").concat(t.className||""),"data-kind":t.kind,onClick:l},e.createElement("summary",{part:"summary"},"primary"===m&&e.createElement(e.Fragment,null,t.icon||e.createElement(A,null),e.createElement("div",{part:"summary-deep-label"},a)),o&&e.createElement("div",null,e.createElement("div",{part:"summary-deep"},t.icon||e.createElement(H,null),e.createElement("div",{part:"summary-deep-text"},r)),e.createElement("div",{part:"summary-deep-label"},a)),o&&e.createElement(A,null)),e.createElement("div",{part:"content"},n))}function A(){return e.createElement("div",{part:"icon"},e.createElement("svg",{"data-icon":"true",xmlns:"http://www.w3.org/2000/svg",width:"1em",height:"1em",fill:"currentColor",viewBox:"0 0 24 24"},e.createElement("path",{fillRule:"evenodd",d:"M8.293 4.293a1 1 0 0 1 1.414 0l7 7a1 1 0 0 1 0 1.414l-7 7a1 1 0 0 1-1.414-1.414L14.586 12 8.293 5.707a1 1 0 0 1 0-1.414Z",clipRule:"evenodd"})))}function H(){return e.createElement("svg",{width:"1em",height:"1em",viewBox:"0 0 24 24",stroke:"none",fill:"currentColor",xmlns:"http://www.w3.org/2000/svg"},e.createElement("g",{clipPath:"url(#clip0_1689_2180)"},e.createElement("path",{d:"M4.3 4.3L7.1 7.1M10.6 5.7V1.5M14.8 7.8L17.6 5M5.7 11.3H1.5M7.1 14.8L4.3 17.6M15.5 22.5L9.9 9.9L22.5 14.8L16.9 16.2L15.5 22.5Z",stroke:"currentColor",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round"})),e.createElement("defs",null,e.createElement("clipPath",{id:"clip0_1689_2180"},e.createElement("rect",{width:24,height:24,fill:"white"}))))}function _(){return e.createElement("hr",{part:"hr",className:"h1ej4n95"})}function q(t){var r=t.src,n=t.alt,c=t.style,l=t.caption;t.children;var o=a(t,["src","alt","style","caption","children"]),i=e.createElement("img",Object.assign({src:r,alt:n,style:c,className:"iz14jlg"},o));return l?e.createElement(e.Fragment,null,e.createElement("figure",null,i,e.createElement("figcaption",null,l))):i}function V(t){var r=t.date,n=t.version,a=t.children;return e.createElement("xyd-update",{className:"u1465cfe"},e.createElement("div",{part:"meta"},r&&e.createElement("div",{part:"date"},e.createElement(m,null,r)),e.createElement("div",{part:"version"},e.createElement(l,{size:"small"},n))),e.createElement("div",{part:"content-container"},e.createElement("div",{part:"content"},a)))}export{d as B,y as C,z as D,_ as H,q as I,V as U,v as a,x as b,h as c,M as d,C as u};
+//# sourceMappingURL=Update-CFi6uapq.js.map