@xyd-js/components 0.1.0-xyd.11 → 0.1.0-xyd.13

package/src/writer/VideoGuide/VideoGuide.module.css

@@ -0,0 +1,105 @@
+@layer defaults {
+    .VideoPlayerHost {
+        z-index: var(--xyd-videoguide-miniature-z-index);
+        width: var(--xyd-videoguide-miniature-mini-width);
+        height: var(--xyd-videoguide-miniature-mini-height);
+        overflow: visible;
+
+        [part="shape"] {
+            position: relative;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            overflow: visible;
+            box-shadow: var(--xyd-videoguide-miniature-shadow);
+            border-radius: var(--xyd-videoguide-miniature-radius);
+            box-sizing: border-box;
+            background-color: var(--xyd-videoguide-miniature-bgcolor);
+        }
+
+        [part="frame"] {
+            position: relative;
+            width: 100%;
+            height: var(--xyd-videoguide-miniature-mini-height);
+
+            background-color: var(--xyd-videoguide-miniature-bgcolor);
+            overflow: hidden;
+            border-radius: var(--xyd-videoguide-miniature-radius);
+            box-sizing: border-box;
+        }
+
+        [part="thumbnail"] {
+            position: absolute;
+            top: 0;
+            left: 0;
+            width: 100%;
+            height: 100%;
+            background-image: url(https://xyd-land.netlify.app/docs-hero.png);
+            background-size: cover;
+            background-position: center;
+        }
+
+        [part="cover"] {
+            background-color: transparent;
+            backdrop-filter: brightness(60%) blur(10px);
+            -webkit-backdrop-filter: brightness(60%) blur(10px);
+
+            position: absolute;
+            top: 0;
+            bottom: 0;
+            left: 0;
+            right: 0;
+            transition: backdrop-filter .1s ease-in-out, -webkit-backdrop-filter .1s ease-in-out, opacity .1s ease-in-out, background-color .1s ease-in-out;
+
+            overflow: hidden;
+
+            border-radius: var(--xyd-videoguide-miniature-radius);
+            box-sizing: border-box;
+        }
+
+        [part="controls"] {
+            position: absolute;
+            top: 0;
+            bottom: 0;
+            left: 0;
+            right: 0;
+            box-sizing: border-box;
+        }
+
+        [part="button"] {
+            display: flex;
+            flex-direction: column;
+            align-items: center;
+            justify-content: center;
+            width: 100%;
+            height: 100%;
+        }
+
+        [part="icon"] {
+            color: var(--xyd-videoguide-miniature-color);
+            display: flex;
+            box-sizing: border-box;
+
+            svg {
+                fill: currentColor;
+            }
+        }
+
+        [part="description"] {
+            box-sizing: border-box;
+            margin-top: 8px;
+        }
+
+        [part="description-container"] {
+            box-sizing: border-box;
+            margin-top: 8px;
+        }
+
+        [part="description"] {
+            text-align: center;
+            color: var(--xyd-videoguide-miniature-color);
+            display: block;
+            white-space: normal;
+        }
+    }
+}

package/src/writer/VideoGuide/VideoGuide.tsx

@@ -0,0 +1,75 @@
+import React from "react";
+
+import cn from "./VideoGuide.module.css";
+
+export function VideoGuide() {
+    return null
+};
+
+interface VideoGuideMiniatureProps {
+    videoSrc?: string;
+    description?: string;
+    className?: string;
+}
+
+VideoGuide.Miniature = function VideoGuideMiniature(props: VideoGuideMiniatureProps) {
+    const {
+        videoSrc,
+        description = "Watch the video guide"
+    } = props;
+
+    return <xyd-videoguide-miniature
+        className={`${cn.VideoPlayerHost} ${props.className || ""}`}
+    >
+        <div part="shape" >
+            <div part="frame" >
+                <iframe
+                    width="100%"
+                    height="100%"
+                    allow="autoplay; fullscreen"
+                    src={videoSrc}
+                />
+                <div part="thumbnail" />
+            </div>
+
+            <div part="cover">
+                <div part="controls">
+                    <button part="button" type="button">
+                        <div
+                            aria-hidden="true"
+                            part="icon"
+                        >
+                            <$PlayIcon />
+                        </div>
+
+                        <div part="description-container" >
+                            <span part="description" >
+                                {description}
+                            </span>
+                        </div>
+                    </button>
+                </div>
+            </div>
+        </div>
+    </xyd-videoguide-miniature>
+};
+
+
+function $PlayIcon() {
+    return <svg
+        aria-hidden="true"
+        height={32}
+        width={32}
+        viewBox="0 0 16 16"
+        fill="none"
+        xmlns="http://www.w3.org/2000/svg"
+    >
+        <path
+            fillRule="evenodd"
+            clipRule="evenodd"
+            d="M8 14.25A6.25 6.25 0 0 0 14.25 8 6.242 6.242 0 0 0 8 1.75 6.25 6.25 0 0 0 1.75 8 6.25 6.25 0 0 0 8 14.25ZM8 16a8 8 0 0 0 8-8c0-4.419-3.57-8-8-8a8 8 0 0 0-8 8 8 8 0 0 0 8 8Z"
+        />
+        <path
+            d="M10.817 7.659A.415.415 0 0 1 11 8a.415.415 0 0 1-.183.341L7.242 10.91c-.305.218-.742.02-.742-.34V5.431c0-.36.437-.56.742-.341l3.575 2.568Z" />
+    </svg>
+}

package/src/writer/VideoGuide/index.ts

@@ -0,0 +1 @@
+export {VideoGuide} from './VideoGuide'; 

package/src/writer/index.ts

@@ -1,13 +1,23 @@
+export * from "./Anchor"
+
 export * from "./Badge"
 
+export * from "./Banner"
+
 export * from "./Blockquote"
 
 export * from "./Breadcrumbs"
 
+export * from "./Button"
+
 export * from "./Callout"
 
+export * from "./Card"
+
 export * from "./Code"
 
+export * from "./ColorSchemeButton"
+
 export * from "./Details"
 
 export * from "./GuideCard"
@@ -18,6 +28,10 @@ export * from "./Hr"
 
 export * from "./Icon"
 
+export * from "./Image"
+
+export * from "./List"
+
 export * from "./NavLinks"
 
 export * from "./Pre"
@@ -26,7 +40,15 @@ export * from "./Steps"
 
 export * from "./Table"
 
-export * from "./Tabs"
+// export * from "./Tabs"
+
+export * from "./Text"
+
+export * from "./TocCard"
 
 export * from "./UnderlineNav"
 
+export * from "./Update"
+
+export * from "./VideoGuide"
+

package/tsconfig.json

@@ -25,14 +25,20 @@
     "strictNullChecks": true,
     "baseUrl": ".",
     "paths": {
-      "*": ["*", "*.ts"]
-    }
+      "@xyd-js/core": [
+        "../xyd-core/index.ts"
+      ],
+    },
+    "typeRoots": [
+      "./types.d.ts"
+    ]
   },
   "include": [
     "next-env.d.ts",
     "**/*.ts",
     "**/*.tsx",
-    ".next/types/**/*.ts"
+    ".next/types/**/*.ts",
+    "types.d.ts"
   ],
   "exclude": [
     "node_modules"

package/types.d.ts

@@ -0,0 +1,50 @@
+import * as React from 'react'
+
+declare global {
+  namespace React {
+    namespace JSX {
+      interface IntrinsicElements {
+        // Code
+        'xyd-code-bg': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;
+        'xyd-code-mark-inline': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;
+        'xyd-code-linenumber': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;
+        'xyd-code-mark': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;
+        'xyd-code-pre': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;
+        'xyd-code-loader': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;
+        'xyd-code-copy': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;
+        'xyd-codetabs': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;
+        'xyd-codetabs-languages': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;
+
+        // Layout
+        'xyd-layout-primary': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;
+
+        // Components
+        'xyd-badge': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;
+        'xyd-banner': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;
+        'xyd-callout': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;
+        'xyd-card': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;
+        'xyd-breadcrumbs': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;
+        'xyd-guidecard': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;
+        'xyd-guidecard-list': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;
+        'xyd-navlinks': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;
+        'xyd-steps': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;
+        'xyd-steps-item': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;
+        'xyd-table-cell': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;
+        'xyd-tabs': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;
+        'xyd-toccard': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;
+        'xyd-underlinenav': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;
+        'xyd-underlinenav-content': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;
+        'xyd-videoguide-miniature': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;
+        'xyd-content-decorator': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;
+        'xyd-grid-decorator': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;
+
+
+        // Kit
+        'xyd-loader': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;
+
+        // System
+        'xyd-search-button': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;
+      }
+    }
+  }
+}

package/writer.ts

@@ -1 +1 @@
-export * from "./src/writer"
+export * from "./src/writer"

package/dist/CTABanner-BLDHbq5h.js

@@ -1,2 +0,0 @@
-import n from"react";function e(e){var t=e.children,a=e.kind;return n.createElement("button",{className:"\n        ".concat("XydComponents-Component-brand-Button__ButtonHost","\n        ").concat("secondary"===a&&"XydComponents-Component-brand-Button__ButtonHostSecondary","\n    ")},t)}function t(e){var t=e.children;return n.createElement("div",{className:"XydComponents-Component-brand-CTABanner__CTABannerHost"},n.createElement("div",{className:"XydComponents-Component-brand-CTABanner__CTABannerContainer"},n.createElement("div",{className:"XydComponents-Component-brand-CTABanner__CTABannerHero"},t)))}t.Heading=function(e){var t=e.title,a=e.subtitle;return n.createElement("div",{className:"XydComponents-Component-brand-CTABanner__CTABannerHeadingHost"},n.createElement("div",{className:"XydComponents-Component-brand-CTABanner__CTABannerHeadingEffect"},n.createElement("h1",{className:"XydComponents-Component-brand-CTABanner__CTABannerHeadingTitle"},t)),n.createElement("h2",{className:"XydComponents-Component-brand-CTABanner__CTABannerHeadingSubtitle"},a))},t.ButtonGroup=function(e){var t=e.children;return n.createElement("div",{className:"XydComponents-Component-brand-CTABanner__CTABannerButtonGroupHost"},t)};export{e as B,t as C};
-//# sourceMappingURL=CTABanner-BLDHbq5h.js.map

package/dist/CTABanner-BLDHbq5h.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"CTABanner-BLDHbq5h.js","sources":["../src/brand/Button/Button.tsx","../src/brand/Button/Button.styles.tsx","../src/brand/CTABanner/CTABanner.tsx","../src/brand/CTABanner/CTABanner.styles.tsx"],"sourcesContent":["import React from \"react\";\nimport * as cn from \"./Button.styles\";\n\nexport interface ButtonProps {\n    children: React.ReactNode\n    kind?: \"secondary\"\n}\n\nexport function Button({children, kind}: ButtonProps) {\n    return <button className={`\n        ${cn.ButtonHost}\n        ${kind === \"secondary\" && cn.ButtonHostSecondary}\n    `}>\n        {children}\n    </button>\n}","import {css} from \"@linaria/core\";\n\nexport const ButtonHost = css`\n    display: inline-block;\n    border: 1px solid transparent;\n    text-align: center;\n    font-weight: 600;\n    white-space: nowrap;\n    border-radius: 20px;\n    padding: 0 20px;\n    line-height: 38px;\n    font-size: 14px;\n    border-color: transparent;\n    color: #3c3c43;\n    background-color: #f7f7f8;\n\n    transition: color .25s, border-color .25s, background-color .25s;\n\n    &:hover {\n        background: #e3e3e6;\n    }\n`;\n\nexport const ButtonHostSecondary = css`\n    color: #fff;\n    background-color: rgb(112, 81, 212);\n\n    &:hover {\n        background-color: rgb(95, 59, 211)\n    }\n`; ","import React from \"react\";\nimport * as cn from \"./CTABanner.styles\";\n\nexport interface CTABannerProps {\n    children: React.ReactNode;\n}\n\nexport interface CTABannerHeadingProps {\n    title: string;\n    subtitle: string;\n}\n\nexport interface CTABannerButtonGroupProps {\n    children: React.ReactNode;\n}\n\nexport function CTABanner({children}: CTABannerProps) {\n    return (\n        <div className={cn.CTABannerHost}>\n            <div className={cn.CTABannerContainer}>\n                <div className={cn.CTABannerHero}>\n                    {children}\n                </div>\n            </div>\n        </div>\n    );\n}\n\nfunction Heading({title, subtitle}: CTABannerHeadingProps) {\n    return (\n        <div className={cn.CTABannerHeadingHost}>\n            <div className={cn.CTABannerHeadingEffect}>\n                <h1 className={cn.CTABannerHeadingTitle}>{title}</h1>\n            </div>\n            <h2 className={cn.CTABannerHeadingSubtitle}>{subtitle}</h2>\n        </div>\n    );\n}\n\nfunction ButtonGroup({children}: CTABannerButtonGroupProps) {\n    return (\n        <div className={cn.CTABannerButtonGroupHost}>\n            {children}\n        </div>\n    );\n}\n\nCTABanner.Heading = Heading;\nCTABanner.ButtonGroup = ButtonGroup;","import {css} from \"@linaria/core\";\n\nexport const CTABannerHost = css`\n    padding: 20px;\n`;\n\nexport const CTABannerContainer = css`\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    gap: 80px;\n`;\n\nexport const CTABannerHero = css`\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    flex-direction: column;\n    gap: 40px;\n`;\n\nexport const CTABannerHeadingEffect = css`\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    flex-direction: column;\n\n    background: -webkit-linear-gradient(\n            120deg,\n            var(--headingEffect-color-tertiary) 20%,\n            var(--headingEffect-color-tertiary) 30%,\n            var(--headingEffect-color-secondary) 60%,\n            var(--headingEffect-color-primary) 75%,\n            var(--headingEffect-color-primary) 85%\n    );\n    background-clip: text;\n    -webkit-text-fill-color: transparent;\n    animation: wave 5s infinite;\n    background-size: 200% 200%;\n    background-position: 50% 50%; // Start with all colors visible\n\n    @keyframes wave {\n        0% {\n            background-position: 50% 50%;\n        }\n        50% {\n            background-position: 0% 50%;\n        }\n        100% {\n            background-position: 50% 50%;\n        }\n    }\n`;\n\nexport const CTABannerHeadingHost = css`\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    flex-direction: column;\n`;\n\nexport const CTABannerHeadingTitle = css`\n    font-size: 76px;\n    font-weight: 900;\n    text-align: center;\n    letter-spacing: 3px;\n    margin: 0;\n`;\n\nexport const CTABannerHeadingSubtitle = css`\n    color: #3c3c43;\n    font-size: 46px;\n    font-weight: 600;\n    text-align: center;\n`;\n\nexport const CTABannerButtonGroupHost = css`\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    gap: 10px;\n`; "],"names":["Button","_ref","children","kind","React","createElement","className","concat","CTABanner","Heading","_ref2","title","subtitle","ButtonGroup","_ref3"],"mappings":"8BAQgBA,EAAMC,GAA8B,IAA5BC,EAAQD,EAARC,SAAUC,EAAIF,EAAJE,KAC9B,OAAOC,EAAAC,cAAA,SAAA,CAAQC,UAASC,aAAAA,OCY3B,mDDXsB,cAAAA,OACJ,cAATJ,GCmBT,4DDnBuD,WAE/CD,EAET,CECgB,SAAAM,EAASP,GAA2B,IAAzBC,EAAQD,EAARC,SACvB,OACIE,EAAKC,cAAA,MAAA,CAAAC,UCdZ,0DDeWF,EAAAC,cAAA,MAAA,CAAKC,UCRhB,+DDSeF,EAAKC,cAAA,MAAA,CAAAC,UCDpB,0DDEoBJ,IAKrB,CAqBAM,EAAUC,QAnBV,SAAgBC,GAAyC,IAAvCC,EAAKD,EAALC,MAAOC,EAAQF,EAARE,SACrB,OACIR,EAAKC,cAAA,MAAA,CAAAC,UC6BZ,iED5BWF,EAAAC,cAAA,MAAA,CAAKC,UCqBhB,mEDpBeF,EAAIC,cAAA,KAAA,CAAAC,UCmCnB,kEDnCyDK,IAE9CP,EAAIC,cAAA,KAAA,CAAAC,UCwCf,qEDxCwDM,GAGzD,EAWAJ,EAAUK,YATV,SAAoBC,GAAsC,IAApCZ,EAAQY,EAARZ,SAClB,OACIE,EAAKC,cAAA,MAAA,CAAAC,UCwCZ,qEDvCYJ,EAGb"}

package/dist/CTABanner-n3vc4xW5.js

@@ -1,2 +0,0 @@
-import n from"react";function e(e){var t=e.children,a=e.kind;return n.createElement("button",{className:"\n        ".concat("XydComponents-Component-brand-Button__ButtonHost","\n        ").concat("secondary"===a&&"XydComponents-Component-brand-Button__ButtonHostSecondary","\n    ")},t)}function t(e){var t=e.children;return n.createElement("div",{className:"XydComponents-Component-brand-CTABanner__CTABannerHost"},n.createElement("div",{className:"XydComponents-Component-brand-CTABanner__CTABannerContainer"},n.createElement("div",{className:"XydComponents-Component-brand-CTABanner__CTABannerHero"},t)))}t.Heading=function(e){var t=e.title,a=e.subtitle;return n.createElement("div",{className:"XydComponents-Component-brand-CTABanner__CTABannerHeadingHost"},n.createElement("div",{className:"XydComponents-Component-brand-CTABanner__CTABannerHeadingEffect"},n.createElement("h1",{className:"XydComponents-Component-brand-CTABanner__CTABannerHeadingTitle"},t)),n.createElement("h2",{className:"XydComponents-Component-brand-CTABanner__CTABannerHeadingSubtitle"},a))},t.ButtonGroup=function(e){var t=e.children;return n.createElement("div",{className:"XydComponents-Component-brand-CTABanner__CTABannerButtonGroupHost"},t)};export{e as B,t as C};
-//# sourceMappingURL=CTABanner-n3vc4xW5.js.map

package/dist/CTABanner-n3vc4xW5.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"CTABanner-n3vc4xW5.js","sources":["../src/brand/Button/Button.tsx","../src/brand/Button/Button.styles.tsx","../src/brand/CTABanner/CTABanner.tsx","../src/brand/CTABanner/CTABanner.styles.tsx"],"sourcesContent":["import React from \"react\";\nimport * as cn from \"./Button.styles\";\n\nexport interface ButtonProps {\n    children: React.ReactNode\n    kind?: \"secondary\"\n}\n\nexport function Button({children, kind}: ButtonProps) {\n    return <button className={`\n        ${cn.ButtonHost}\n        ${kind === \"secondary\" && cn.ButtonHostSecondary}\n    `}>\n        {children}\n    </button>\n}","import {css} from \"@linaria/core\";\n\nexport const ButtonHost = css`\n    display: inline-block;\n    border: 1px solid transparent;\n    text-align: center;\n    font-weight: 600;\n    white-space: nowrap;\n    border-radius: 20px;\n    padding: 0 20px;\n    line-height: 38px;\n    font-size: 14px;\n    border-color: transparent;\n    color: #3c3c43;\n    background-color: #f7f7f8;\n\n    transition: color .25s, border-color .25s, background-color .25s;\n\n    &:hover {\n        background: #e3e3e6;\n    }\n`;\n\nexport const ButtonHostSecondary = css`\n    color: #fff;\n    background-color: rgb(112, 81, 212);\n\n    &:hover {\n        background-color: rgb(95, 59, 211)\n    }\n`; ","import React from \"react\";\nimport * as cn from \"./CTABanner.styles\";\n\nexport interface CTABannerProps {\n    children: React.ReactNode;\n}\n\nexport interface CTABannerHeadingProps {\n    title: string;\n    subtitle: string;\n}\n\nexport interface CTABannerButtonGroupProps {\n    children: React.ReactNode;\n}\n\nexport function CTABanner({children}: CTABannerProps) {\n    return (\n        <div className={cn.CTABannerHost}>\n            <div className={cn.CTABannerContainer}>\n                <div className={cn.CTABannerHero}>\n                    {children}\n                </div>\n            </div>\n        </div>\n    );\n}\n\nfunction Heading({title, subtitle}: CTABannerHeadingProps) {\n    return (\n        <div className={cn.CTABannerHeadingHost}>\n            <div className={cn.CTABannerHeadingEffect}>\n                <h1 className={cn.CTABannerHeadingTitle}>{title}</h1>\n            </div>\n            <h2 className={cn.CTABannerHeadingSubtitle}>{subtitle}</h2>\n        </div>\n    );\n}\n\nfunction ButtonGroup({children}: CTABannerButtonGroupProps) {\n    return (\n        <div className={cn.CTABannerButtonGroupHost}>\n            {children}\n        </div>\n    );\n}\n\nCTABanner.Heading = Heading;\nCTABanner.ButtonGroup = ButtonGroup;","import {css} from \"@linaria/core\";\n\nexport const CTABannerHost = css`\n    padding: 20px;\n`;\n\nexport const CTABannerContainer = css`\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    gap: 80px;\n`;\n\nexport const CTABannerHero = css`\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    flex-direction: column;\n    gap: 40px;\n`;\n\nexport const CTABannerHeadingEffect = css`\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    flex-direction: column;\n\n    background: -webkit-linear-gradient(\n            120deg,\n            var(--headingEffect-color-tertiary) 20%,\n            var(--headingEffect-color-tertiary) 30%,\n            var(--headingEffect-color-secondary) 60%,\n            var(--headingEffect-color-primary) 75%,\n            var(--headingEffect-color-primary) 85%\n    );\n    background-clip: text;\n    -webkit-text-fill-color: transparent;\n    animation: wave 5s infinite;\n    background-size: 200% 200%;\n    background-position: 50% 50%; // Start with all colors visible\n\n    @keyframes wave {\n        0% {\n            background-position: 50% 50%;\n        }\n        50% {\n            background-position: 0% 50%;\n        }\n        100% {\n            background-position: 50% 50%;\n        }\n    }\n`;\n\nexport const CTABannerHeadingHost = css`\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    flex-direction: column;\n`;\n\nexport const CTABannerHeadingTitle = css`\n    font-size: 76px;\n    font-weight: 900;\n    text-align: center;\n    letter-spacing: 3px;\n    margin: 0;\n`;\n\nexport const CTABannerHeadingSubtitle = css`\n    color: #3c3c43;\n    font-size: 46px;\n    font-weight: 600;\n    text-align: center;\n`;\n\nexport const CTABannerButtonGroupHost = css`\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    gap: 10px;\n`; "],"names":["Button","_ref","children","kind","React","createElement","className","concat","CTABanner","Heading","_ref2","title","subtitle","ButtonGroup","_ref3"],"mappings":"8BAQgBA,EAAMC,GAA8B,IAA5BC,EAAQD,EAARC,SAAUC,EAAIF,EAAJE,KAC9B,OAAOC,EAAAC,cAAA,SAAA,CAAQC,UAASC,aAAAA,OCY3B,mDDXsB,cAAAA,OACJ,cAATJ,GCmBT,4DDnBuD,WAE/CD,EAET,CECgB,SAAAM,EAASP,GAA2B,IAAzBC,EAAQD,EAARC,SACvB,OACIE,EAAKC,cAAA,MAAA,CAAAC,UCdZ,0DDeWF,EAAAC,cAAA,MAAA,CAAKC,UCRhB,+DDSeF,EAAKC,cAAA,MAAA,CAAAC,UCDpB,0DDEoBJ,IAKrB,CAqBAM,EAAUC,QAnBV,SAAgBC,GAAyC,IAAvCC,EAAKD,EAALC,MAAOC,EAAQF,EAARE,SACrB,OACIR,EAAKC,cAAA,MAAA,CAAAC,UC6BZ,iED5BWF,EAAAC,cAAA,MAAA,CAAKC,UCqBhB,mEDpBeF,EAAIC,cAAA,KAAA,CAAAC,UCmCnB,kEDnCyDK,IAE9CP,EAAIC,cAAA,KAAA,CAAAC,UCwCf,qEDxCwDM,GAGzD,EAWAJ,EAAUK,YATV,SAAoBC,GAAsC,IAApCZ,EAAQY,EAARZ,SAClB,OACIE,EAAKC,cAAA,MAAA,CAAAC,UCwCZ,qEDvCYJ,EAGb"}

package/dist/CodeSample-CVki5fdQ.js

@@ -1,2 +0,0 @@
-import e,{useRef as n,forwardRef as t,use as r,createContext as o,useState as a,useEffect as i,Suspense as c}from"react";import{a as l,_ as s}from"./tslib.es6-sxmRJynD.js";import{b as u,c as f,_ as d,d as m,e as p,f as h,a as g,g as v,h as y}from"./_rollupPluginBabelHelpers-CrdNG0jb.js";import{extractAnnotations as b,highlight as k,LANG_NAMES as C}from"@code-hike/lighter";import _ from"./coder/themes/cosmo-light.js";import*as E from"@radix-ui/react-tabs";import{CheckCheck as w,Copy as N}from"lucide-react";function j(e,n,t){return S.apply(this,arguments)}function S(){return S=u(f().mark((function e(n,t,r){var o,a,i,c,l;return f().wrap((function(e){for(;;)switch(e.prev=e.next){case 0:return o=[],a=n,e.next=4,x(a,t,r);case 4:return i=e.sent,c=i.code,l=i.annotations,o=[].concat(d(o),d(l)),a=c,e.abrupt("return",{code:a,annotations:o});case 10:case"end":return e.stop()}}),e)}))),S.apply(this,arguments)}function x(e,n){return O.apply(this,arguments)}function O(){return O=u(f().mark((function e(n,t){var r,o,a,i,c,l=arguments;return f().wrap((function(e){for(;;)switch(e.prev=e.next){case 0:return r=l.length>2&&void 0!==l[2]?l[2]:"!",o=function(e){var n,t=new RegExp("\\s*(".concat(r,"?[\\w-]+)?(\\([^\\)]*\\)|\\[[^\\]]*\\])?(.*)$")),o=e.match(t);if(!o)return null;var a=o[1],i=o[2],c=null===(n=o[3])||void 0===n?void 0:n.trim();return a&&a.startsWith(r)?{name:a.slice(r.length),rangeString:i,query:c}:null},e.next=4,b(n,t,o);case 4:return a=e.sent,i=a.code,c=a.annotations,e.abrupt("return",{code:i,annotations:c});case 8:case"end":return e.stop()}}),e)}))),O.apply(this,arguments)}function L(e){return!T(e)}function T(e){return e.hasOwnProperty("lineNumber")}function R(e){return"string"==typeof e}var $=["color"];function P(e,n){return X.apply(this,arguments)}function X(){return X=u(f().mark((function e(n,t){var r,o,a,i,c,l,s,u,d,p,h,g,v,y,b=arguments;return f().wrap((function(e){for(;;)switch(e.prev=e.next){case 0:return r=b.length>2&&void 0!==b[2]?b[2]:{},o=n.value,a=n.lang,i=void 0===a?"txt":a,C.includes(i)||(console.warn('Code Hike warning: Unknown language "'.concat(i,'"')),i="txt"),e.next=5,j(o,i,r.annotationPrefix||"!");case 5:return c=e.sent,l=c.code,s=c.annotations,e.next=10,k(l,i,t,{annotations:[],scopes:!1});case 10:return u=e.sent,d=u.lines,p=u.lang,h=u.style,g=A(d),v=F(g),y=H(v),e.abrupt("return",m(m({},n),{},{code:l,tokens:y,lang:p,annotations:D(s),themeName:"string"==typeof t?t:(null==t?void 0:t.name)||"unknown",style:h}));case 18:case"end":return e.stop()}}),e)}))),X.apply(this,arguments)}function D(e){var n,t=[],r=p(e);try{for(r.s();!(n=r.n()).done;){var o,a=n.value,i=a.name,c=a.query,l=a.ranges,s=p(l);try{for(s.s();!(o=s.n()).done;){var u=o.value;if(u.lineNumber){var f=u.lineNumber,d=u.fromColumn,m=u.toColumn;t.push({name:i,query:c,lineNumber:f,fromColumn:d,toColumn:m})}else{var h=u.fromLineNumber,g=u.toLineNumber;t.push({name:i,query:c,fromLineNumber:h,toLineNumber:g})}}}catch(e){s.e(e)}finally{s.f()}}}catch(e){r.e(e)}finally{r.f()}return t}function A(e){var n=[];return e.forEach((function(t,r){if("lines"in t)throw new Error("Shouldnt be groups");var o=function(e){return e.map((function(e){if("tokens"in e)throw new Error("Shouldnt be groups");var n=[e.content],t=e.style||{},r=t.color,o=h(t,$);return n.push(r),Object.keys(o).length&&n.push(o),n}))}(t.tokens);n.push.apply(n,d(o)),r<e.length-1&&n.push("\n")})),n}function F(e){var n=[];return e.forEach((function(e){if(R(e))n.push(e);else{var t=function(e){var n=e.trim(),t=e.slice(0,e.indexOf(n)),r=e.slice(e.indexOf(n)+n.length);return[t,n,r]}(e[0]),r=g(t,3),o=r[0],a=r[1],i=r[2];if((null==o?void 0:o.length)&&n.push(o),a.length){var c=d(e);c[0]=a,n.push(c)}(null==i?void 0:i.length)&&n.push(i)}})),n}function H(e){var n=[];return e.forEach((function(e){if(R(e)){var t=n[n.length-1];t&&R(t)?n[n.length-1]+=e:""!==e&&n.push(e)}else e[0].length>0&&n.push(e)})),n}var z,I={exports:{}},M={};var W,B,U={};function q(){return W||(W=1,"production"!==process.env.NODE_ENV&&function(){function n(e){if(null==e)return null;if("function"==typeof e)return e.$$typeof===A?null:e.displayName||e.name||null;if("string"==typeof e)return e;switch(e){case N:return"Fragment";case w:return"Portal";case S:return"Profiler";case j:return"StrictMode";case T:return"Suspense";case R:return"SuspenseList"}if("object"===v(e))switch("number"==typeof e.tag&&console.error("Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."),e.$$typeof){case O:return(e.displayName||"Context")+".Provider";case x:return(e._context.displayName||"Context")+".Consumer";case L:var t=e.render;return(e=e.displayName)||(e=""!==(e=t.displayName||t.name||"")?"ForwardRef("+e+")":"ForwardRef"),e;case $:return null!==(t=e.displayName||null)?t:n(e.type)||"Memo";case P:t=e._payload,e=e._init;try{return n(e(t))}catch(e){}}return null}function t(e){return""+e}function r(e){try{t(e);var n=!1}catch(e){n=!0}if(n){var r=(n=console).error,o="function"==typeof Symbol&&Symbol.toStringTag&&e[Symbol.toStringTag]||e.constructor.name||"Object";return r.call(n,"The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",o),t(e)}}function o(){}function a(e){if(void 0===B)try{throw Error()}catch(e){var n=e.stack.trim().match(/\n( *(at )?)/);B=n&&n[1]||"",q=-1<e.stack.indexOf("\n    at")?" (<anonymous>)":-1<e.stack.indexOf("@")?"@unknown:0:0":""}return"\n"+B+e+q}function i(e,n){if(!e||J)return"";var t=V.get(e);if(void 0!==t)return t;J=!0,t=Error.prepareStackTrace,Error.prepareStackTrace=void 0;var r;r=F.H,F.H=null,function(){if(0===W){p=console.log,h=console.info,g=console.warn,y=console.error,b=console.group,k=console.groupCollapsed,C=console.groupEnd;var e={configurable:!0,enumerable:!0,value:o,writable:!0};Object.defineProperties(console,{info:e,log:e,warn:e,error:e,group:e,groupCollapsed:e,groupEnd:e})}W++}();try{var i={DetermineComponentFrameRoot:function(){try{if(n){var t=function(){throw Error()};if(Object.defineProperty(t.prototype,"props",{set:function(){throw Error()}}),"object"===("undefined"==typeof Reflect?"undefined":v(Reflect))&&Reflect.construct){try{Reflect.construct(t,[])}catch(e){var r=e}Reflect.construct(e,[],t)}else{try{t.call()}catch(e){r=e}e.call(t.prototype)}}else{try{throw Error()}catch(e){r=e}(t=e())&&"function"==typeof t.catch&&t.catch((function(){}))}}catch(e){if(e&&r&&"string"==typeof e.stack)return[e.stack,r.stack]}return[null,null]}};i.DetermineComponentFrameRoot.displayName="DetermineComponentFrameRoot";var c=Object.getOwnPropertyDescriptor(i.DetermineComponentFrameRoot,"name");c&&c.configurable&&Object.defineProperty(i.DetermineComponentFrameRoot,"name",{value:"DetermineComponentFrameRoot"});var l=i.DetermineComponentFrameRoot(),s=l[0],u=l[1];if(s&&u){var f=s.split("\n"),d=u.split("\n");for(l=c=0;c<f.length&&!f[c].includes("DetermineComponentFrameRoot");)c++;for(;l<d.length&&!d[l].includes("DetermineComponentFrameRoot");)l++;if(c===f.length||l===d.length)for(c=f.length-1,l=d.length-1;1<=c&&0<=l&&f[c]!==d[l];)l--;for(;1<=c&&0<=l;c--,l--)if(f[c]!==d[l]){if(1!==c||1!==l)do{if(c--,0>--l||f[c]!==d[l]){var m="\n"+f[c].replace(" at new "," at ");return e.displayName&&m.includes("<anonymous>")&&(m=m.replace("<anonymous>",e.displayName)),"function"==typeof e&&V.set(e,m),m}}while(1<=c&&0<=l);break}}}finally{J=!1,F.H=r,function(){if(0==--W){var e={configurable:!0,enumerable:!0,writable:!0};Object.defineProperties(console,{log:z({},e,{value:p}),info:z({},e,{value:h}),warn:z({},e,{value:g}),error:z({},e,{value:y}),group:z({},e,{value:b}),groupCollapsed:z({},e,{value:k}),groupEnd:z({},e,{value:C})})}0>W&&console.error("disabledDepth fell below zero. This is a bug in React. Please file an issue.")}(),Error.prepareStackTrace=t}return f=(f=e?e.displayName||e.name:"")?a(f):"","function"==typeof e&&V.set(e,f),f}function c(e){if(null==e)return"";if("function"==typeof e){var n=e.prototype;return i(e,!(!n||!n.isReactComponent))}if("string"==typeof e)return a(e);switch(e){case T:return a("Suspense");case R:return a("SuspenseList")}if("object"===v(e))switch(e.$$typeof){case L:return e=i(e.render,!1);case $:return c(e.type);case P:n=e._payload,e=e._init;try{return c(e(n))}catch(e){}}return""}function l(){var e=F.A;return null===e?null:e.getOwner()}function s(){var e=n(this.type);return Y[e]||(Y[e]=!0,console.error("Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release.")),void 0!==(e=this.props.ref)?e:null}function u(e,t,o,a,i,c){if("string"==typeof e||"function"==typeof e||e===N||e===S||e===j||e===T||e===R||e===X||"object"===v(e)&&null!==e&&(e.$$typeof===P||e.$$typeof===$||e.$$typeof===O||e.$$typeof===x||e.$$typeof===L||e.$$typeof===I||void 0!==e.getModuleId)){var u=t.children;if(void 0!==u)if(a)if(M(u)){for(a=0;a<u.length;a++)f(u[a],e);Object.freeze&&Object.freeze(u)}else console.error("React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead.");else f(u,e)}else u="",(void 0===e||"object"===v(e)&&null!==e&&0===Object.keys(e).length)&&(u+=" You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports."),null===e?a="null":M(e)?a="array":void 0!==e&&e.$$typeof===E?(a="<"+(n(e.type)||"Unknown")+" />",u=" Did you accidentally export a JSX literal instead of a component?"):a=v(e),console.error("React.jsx: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: %s.%s",a,u);if(H.call(t,"key")){u=n(e);var d=Object.keys(t).filter((function(e){return"key"!==e}));a=0<d.length?"{key: someKey, "+d.join(": ..., ")+": ...}":"{key: someKey}",Q[u+a]||(d=0<d.length?"{"+d.join(": ..., ")+": ...}":"{}",console.error('A props object containing a "key" prop is being spread into JSX:\n  let props = %s;\n  <%s {...props} />\nReact keys must be passed directly to JSX without using spread:\n  let props = %s;\n  <%s key={someKey} {...props} />',a,u,d,u),Q[u+a]=!0)}if(u=null,void 0!==o&&(r(o),u=""+o),function(e){if(H.call(e,"key")){var n=Object.getOwnPropertyDescriptor(e,"key").get;if(n&&n.isReactWarning)return!1}return void 0!==e.key}(t)&&(r(t.key),u=""+t.key),"key"in t)for(var m in o={},t)"key"!==m&&(o[m]=t[m]);else o=t;return u&&function(e,n){function t(){G||(G=!0,console.error("%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://react.dev/link/special-props)",n))}t.isReactWarning=!0,Object.defineProperty(e,"key",{get:t,configurable:!0})}(o,"function"==typeof e?e.displayName||e.name||"Unknown":e),function(e,n,t,r,o,a){return t=a.ref,e={$$typeof:E,type:e,key:n,props:a,_owner:o},null!==(void 0!==t?t:null)?Object.defineProperty(e,"ref",{enumerable:!1,get:s}):Object.defineProperty(e,"ref",{enumerable:!1,value:null}),e._store={},Object.defineProperty(e._store,"validated",{configurable:!1,enumerable:!1,writable:!0,value:0}),Object.defineProperty(e,"_debugInfo",{configurable:!1,enumerable:!1,writable:!0,value:null}),Object.freeze&&(Object.freeze(e.props),Object.freeze(e)),e}(e,u,c,0,l(),o)}function f(e,n){if("object"===v(e)&&e&&e.$$typeof!==K)if(M(e))for(var t=0;t<e.length;t++){var r=e[t];d(r)&&m(r,n)}else if(d(e))e._store&&(e._store.validated=1);else if(null===e||"object"!==v(e)?t=null:t="function"==typeof(t=D&&e[D]||e["@@iterator"])?t:null,"function"==typeof t&&t!==e.entries&&(t=t.call(e))!==e)for(;!(e=t.next()).done;)d(e.value)&&m(e.value,n)}function d(e){return"object"===v(e)&&null!==e&&e.$$typeof===E}function m(e,t){if(e._store&&!e._store.validated&&null==e.key&&(e._store.validated=1,t=function(e){var t="",r=l();return r&&(r=n(r.type))&&(t="\n\nCheck the render method of `"+r+"`."),t||(e=n(e))&&(t="\n\nCheck the top-level render call using <"+e+">."),t}(t),!Z[t])){Z[t]=!0;var r="";e&&null!=e._owner&&e._owner!==l()&&(r=null,"number"==typeof e._owner.tag?r=n(e._owner.type):"string"==typeof e._owner.name&&(r=e._owner.name),r=" It was passed a child from "+r+".");var o=F.getCurrentStack;F.getCurrentStack=function(){var n=c(e.type);return o&&(n+=o()||""),n},console.error('Each child in a list should have a unique "key" prop.%s%s See https://react.dev/link/warning-keys for more information.',t,r),F.getCurrentStack=o}}var p,h,g,y,b,k,C,_=e,E=Symbol.for("react.transitional.element"),w=Symbol.for("react.portal"),N=Symbol.for("react.fragment"),j=Symbol.for("react.strict_mode"),S=Symbol.for("react.profiler"),x=Symbol.for("react.consumer"),O=Symbol.for("react.context"),L=Symbol.for("react.forward_ref"),T=Symbol.for("react.suspense"),R=Symbol.for("react.suspense_list"),$=Symbol.for("react.memo"),P=Symbol.for("react.lazy"),X=Symbol.for("react.offscreen"),D=Symbol.iterator,A=Symbol.for("react.client.reference"),F=_.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE,H=Object.prototype.hasOwnProperty,z=Object.assign,I=Symbol.for("react.client.reference"),M=Array.isArray,W=0;o.__reactDisabledLog=!0;var B,q,G,J=!1,V=new("function"==typeof WeakMap?WeakMap:Map),K=Symbol.for("react.client.reference"),Y={},Q={},Z={};U.Fragment=N,U.jsx=function(e,n,t,r,o){return u(e,n,t,!1,0,o)},U.jsxs=function(e,n,t,r,o){return u(e,n,t,!0,0,o)}}()),U}var G=(B||(B=1,"production"===process.env.NODE_ENV?I.exports=function(){if(z)return M;z=1;var e=Symbol.for("react.transitional.element"),n=Symbol.for("react.fragment");function t(n,t,r){var o=null;if(void 0!==r&&(o=""+r),void 0!==t.key&&(o=""+t.key),"key"in t)for(var a in r={},t)"key"!==a&&(r[a]=t[a]);else r=t;return t=r.ref,{$$typeof:e,type:n,key:o,ref:void 0!==t?t:null,props:r}}return M.Fragment=n,M.jsx=t,M.jsxs=t,M}():I.exports=q()),I.exports);function J(e,n,t){if("children"===n)e.children=t||e.children;else if("_ref"===n)e._ref=t||e._ref;else if("data"===n)e.data=e.data?m(m({},e.data),t):t;else if("className"===n)e.className=[e.className,t].join(" ").trim();else if("style"===n)e.style=m(m({},e.style),t);else if("function"==typeof t){var r=e[n];e[n]=r?function(){r.apply(void 0,arguments),t.apply(void 0,arguments)}:t}else{if(void 0===t||"object"!==v(t)&&t===e[n])return;if(n in e)throw new Error("Didn’t know how to merge prop '".concat(n,"'. ")+"Only 'className', 'style', and event handlers are supported");e[n]=t}}function V(){for(var e=arguments.length,n=new Array(e),t=0;t<e;t++)n[t]=arguments[t];return 1===n.length?n[0]:n.reduce((function(e,n){for(var t in n)J(e,t,n[t]);return e}),{})}var K=["merge"],Y=["_stack"],Q=["_ref","data","children"],Z=["merge"],ee=["_stack"],ne=["lineNumber","totalLines","indentation","data","annotation"],te=["merge"],re=["_stack"],oe=["value","data"],ae=function(e){var n=V(e.merge,h(e,K)),t=n._stack,r=h(n,Y),o=y(t),a=o[0],i=o.slice(1);if(a)return G.jsx(a,m({_stack:i},r));var c=r._ref;r.data;var l=r.children,s=h(r,Q);return G.jsx("pre",m(m({},s),{},{ref:c,"data-ch":!0,children:G.jsx("div",{style:{minWidth:"fit-content"},children:l})}))},ie=function(e){var n=V(e.merge,h(e,Z)),t=n._stack,r=h(n,ee),o=y(t),a=o[0],i=o.slice(1);if(a){var c=a.Component,l=a.annotation;return G.jsx(c,m(m({_stack:i},r),{},{annotation:l}))}r.lineNumber,r.totalLines,r.indentation,r.data,r.annotation;var s=h(r,ne);return G.jsx("div",m({},s))},ce=function(e){var n=V(e.merge,h(e,te)),t=n._stack,r=h(n,re),o=y(t),a=o[0],i=o.slice(1);if(a){var c=a.Component,l=a.annotation;return G.jsx(c,m(m({_stack:i},r),{},{annotation:l}))}var s=r.value;r.data;var u=h(r,oe);return G.jsx("span",m(m({},u),{},{children:s}))},le=function(e){var t=n(null),r=e._ref||t;return G.jsx(ae,{merge:e,_ref:r})};function se(e,n){var t=[n.fromColumn,n.toColumn],r=ue(e,t[0]);r=ue(r,t[1]+1);var o=[],a=[],i=[];return r.forEach((function(e){e.range[1]<t[0]?o.push(e):e.range[0]>t[1]?i.push(e):a.push(e)})),[].concat(o,[{annotation:n,content:a,range:[a[0].range[0],a[a.length-1].range[1]]}],i)}function ue(e,n){var t=e.findIndex((function(e){return e.range[0]<n&&n<=e.range[1]}));if(-1===t)return e;var r=e[t];if(fe(r)){var o,a=ue(r.content,n),i=[],c=[],l=p(a);try{for(l.s();!(o=l.n()).done;){var s=o.value;s.range[1]<n?i.push(s):c.push(s)}}catch(e){l.e(e)}finally{l.f()}return[].concat(d(e.slice(0,t)),[m(m({},r),{},{content:i,range:[r.range[0],n-1]}),m(m({},r),{},{content:c,range:[n,r.range[1]]})],d(e.slice(t+1)))}return[].concat(d(e.slice(0,t)),[m(m({},r),{},{value:r.value.slice(0,n-r.range[0]),range:[r.range[0],n-1]}),m(m({},r),{},{value:r.value.slice(n-r.range[0]),range:[n,r.range[1]]})],d(e.slice(t+1)))}function fe(e){return void 0!==e.content}function de(e){var n=e.content,t=e.handlers,r=e.annotationStack;return n.map((function(e,n){return fe(e)?G.jsx(pe,{annotationStack:r,handlers:t,group:e},n):e.style?G.jsx(me,{annotationStack:r,handlers:t,token:e},n):e.value}))}function me(e){var n=e.handlers,t=e.token,r=function(e,n){var t=[];return e.forEach((function(e){var r=e.name,o=e.Token,a=e.AnnotatedToken,i=n.filter((function(e){return e.name===r}));a&&i.forEach((function(e){return t.push({Component:a,annotation:e})})),o&&(i.length||t.push({Component:o}),i.forEach((function(e){return t.push({Component:o,annotation:e})})))})),t}(n,e.annotationStack);return G.jsx(ce,{merge:{_stack:r,style:t.style,value:t.value}})}function pe(e){var n,t=e.group,r=e.handlers,o=e.annotationStack,a=t.annotation,i=t.content,c=a.name,l=de({content:i,handlers:r,annotationStack:[].concat(d(o),[a])}),s=null===(n=r.find((function(e){return e.name===c})))||void 0===n?void 0:n.Inline;return s?G.jsx(s,{annotation:a,children:l}):l}function he(e,n){var t=[n.fromLineNumber,n.toLineNumber],r=ge(e,t[0]);r=ge(r,t[1]+1);var o=[],a=[],i=[];return r.forEach((function(e){e.range[1]<t[0]?o.push(e):e.range[0]>t[1]?i.push(e):a.push(e)})),[].concat(o,[{annotation:n,lines:a,range:[a[0].range[0],a[a.length-1].range[1]]}],i)}function ge(e,n){var t=e.findIndex((function(e){return ve(e)&&e.range[0]<n&&n<=e.range[1]}));if(-1===t)return e;var r=e[t],o=ge(r.lines,n),a=[],i=[];return o.forEach((function(e){e.range[1]<n?a.push(e):i.push(e)})),[].concat(d(e.slice(0,t)),[m(m({},r),{},{lines:a,range:[r.range[0],n-1]}),m(m({},r),{},{lines:i,range:[n,r.range[1]]})],d(e.slice(t+1)))}function ve(e){return void 0!==e.annotation}function ye(e){var n=e.linesOrGroups,t=e.handlers,r=e.inlineAnnotations,o=e.annotationStack,a=void 0===o?[]:o;return n.map((function(e){return ve(e)?G.jsx(ke,{group:e,handlers:t,inlineAnnotations:r,annotationStack:a},e.range[0]):G.jsx(be,{line:e,handlers:t,inlineAnnotations:r,annotationStack:a},e.lineNumber)}))}function be(e){var n=e.line,t=e.handlers,r=e.inlineAnnotations,o=e.annotationStack,a=void 0===o?[]:o,i=n.lineNumber,c=n.totalLines,l=n.indentation,s=r.filter((function(e){return e.lineNumber===i})),u=function(e,n){for(var t=e,r=n.length-1;r>=0;r--)t=se(t,n[r]);return t}(n.tokens,s),f=function(e,n){var t=[];return e.forEach((function(e){var r=e.name,o=e.Line,a=e.AnnotatedLine,i=n.filter((function(e){return e.name===r}));a&&i.forEach((function(e){t.push({Component:a,annotation:e})})),o&&(i.length||t.push({Component:o}),i.forEach((function(e){t.push({Component:o,annotation:e})})))})),t}(t,a),d=de({content:u,handlers:t,annotationStack:a}),m={lineNumber:i,indentation:l,totalLines:c,_stack:f};return G.jsx(ie,{merge:m,children:d},i)}function ke(e){var n,t=e.group,r=e.handlers,o=e.inlineAnnotations,a=e.annotationStack,i=t.annotation,c=t.lines,l=i.name,s=null===(n=r.find((function(e){return e.name===l})))||void 0===n?void 0:n.Block,u=ye({linesOrGroups:c,handlers:r,inlineAnnotations:o,annotationStack:[].concat(d(a),[i])});return s?G.jsx(s,{annotation:i,children:u}):u}var Ce=["code","handlers"],_e=t((function(e,n){var t=e.code,r=e.handlers,o=void 0===r?[]:r,a=h(e,Ce),i=t.tokens,c=t.themeName,l=t.lang,s=t.annotations;if(!i)throw new Error("Missing tokens in code block. Use the `highlight` function to generate the tokens.");o.filter((function(e){return e.transform})).forEach((function(e){s=s.flatMap((function(n){return e.name!=n.name?n:e.transform(n)||[]}))}));var u=new Set(s.map((function(e){return e.name}))),f=o.filter((function(e){return!e.onlyIfAnnotated||u.has(e.name)})),p=function(e){var n=e.map((function(e){return e.Pre})).filter(Boolean),t=e.map((function(e){return e.PreWithRef})).filter(Boolean);t.length>0&&t.unshift(le);return[].concat(d(n),d(t))}(f),g={_stack:p,_ref:n};return G.jsx(ae,m(m({merge:g,"data-theme":c,"data-lang":l},a),{},{children:G.jsx(Ee,{tokens:i,handlers:f,annotations:s})}))}));function Ee(e){var n=e.tokens,t=e.handlers,r=e.annotations,o=function(e){for(var n=[[]],t=e.slice(),r=1;t.length;){var o=t.shift();if("string"==typeof o){var a=o.split("\n"),i=y(a),c=i[0],l=i.slice(1);if(c){var s=r;r+=c.length,n[n.length-1].push({value:c,range:[s,r]})}l.length&&(n[n.length-1].push({value:"\n",range:[r,r+1]}),n.push([]),r=1,t.unshift(l.join("\n")))}else{var u=g(o,3),f=u[0],d=u[1],p=u[2],h=void 0===p?{}:p,v=r;r+=f.length,n[n.length-1].push({value:f,style:m({color:d},h),range:[v,r]})}}var b=n.length;return n.map((function(e,n){var t,r,o;return{tokens:e,range:[n+1,n+1],lineNumber:n+1,indentation:(null===(o=null===(r=null===(t=e[0])||void 0===t?void 0:t.value)||void 0===r?void 0:r.replace(/\t/g,"  ").match(/^\s*/))||void 0===o?void 0:o[0].length)||0,totalLines:b}}))}(n),a=r.filter(L),i=r.filter(T),c=function(e,n){for(var t=e,r=n.length-1;r>=0;r--)t=he(t,n[r]);return t}(o,a);return ye({linesOrGroups:c,handlers:t,inlineAnnotations:i})}var we="XydComponents-Component-ui-Loader__LoaderDot";function Ne(n){var t=n.size,r=void 0===t?"medium":t,o=n.className;return e.createElement("div",{className:"\n        ".concat("XydComponents-Component-ui-Loader__LoaderHost","\n        ").concat("small"===r&&"XydComponents-Component-ui-Loader__LoaderSmall","\n        ").concat("large"===r&&"XydComponents-Component-ui-Loader__LoaderLarge","\n        ").concat(o,"\n      ")},e.createElement("div",{className:"XydComponents-Component-ui-Loader__LoaderDots"},e.createElement("div",{className:we}),e.createElement("div",{className:we}),e.createElement("div",{className:we})))}var je=o({highlighted:[]});function Se(){return r(je)}function xe(n){var t=r(Le(n.codeblocks,n.theme||_));return e.createElement(je,{value:{highlighted:t}},n.children)}function Oe(n){var t=a([]),r=g(t,2),o=r[0],c=r[1];return i((function(){Le(n.codeblocks,n.theme||_).then(c)}),[n.codeblocks,n.theme]),o?e.createElement(je,{value:{highlighted:o}},n.children):e.createElement(Ne,null)}function Le(e,n){return l(this,void 0,void 0,f().mark((function t(){return f().wrap((function(t){for(;;)switch(t.prev=t.next){case 0:return t.next=2,Promise.all(null==e?void 0:e.map((function(e){return P(e,n)})));case 2:return t.abrupt("return",t.sent);case 3:case"end":return t.stop()}}),t)})))}var Te="XydComponents-Component-coder-Code__MarkAnnotated",Re="XydComponents-Component-coder-Code__CodeHost";function $e(){return e.createElement("div",{className:Re},e.createElement(Ne,null))}function Pe(n){return e.createElement(c,{fallback:e.createElement($e,null)},e.createElement(xe,{codeblocks:n.codeblocks,theme:n.theme},n.children))}Pe.LineNumber=function(n){return n.children&&n.children.length?e.createElement(e.Fragment,null,e.createElement("span",{style:{minWidth:"".concat(n.width,"ch")},className:"XydComponents-Component-coder-Code__LineNumberHost"},n.lineNumber),e.createElement(ie,{merge:n})):null},Pe.Mark=function(n){return e.createElement("div",{className:"".concat("XydComponents-Component-coder-Code__MarkHost"," ").concat(n.annotation&&Te)},e.createElement(ie,{merge:n,className:"XydComponents-Component-coder-Code__MarkLine"}))},Pe.Bg=function(n){return e.createElement("span",{className:"".concat(n.annotation&&Te)},n.children)},Pe.Pre=function(n){var t,r;return e.createElement(_e,{className:"\n            ".concat(Re,"\n            ").concat("full"===(null==n?void 0:n.size)&&"XydComponents-Component-coder-Code__CodeHostFull","\n            ").concat(n.className,"\n        "),style:(null===(t=n.codeblock)||void 0===t?void 0:t.style)||(null===(r=n.codeblock)||void 0===r?void 0:r.style),code:n.codeblock,handlers:n.handlers})};var Xe={mark:{name:"mark",Line:function(n){return e.createElement(Pe.Mark,Object.assign({},n))}},bg:{name:"bg",Inline:function(n){return e.createElement(Pe.Bg,Object.assign({},n))}},lineNumbers:{name:"line-numbers",Line:function(n){n.annotation;var t=s(n,["annotation"]);return e.createElement(Pe.LineNumber,Object.assign({},t))}}};function De(n){var t=n.text,r=a(!1),o=g(r,2),i=o[0],c=o[1];return e.createElement("button",{"aria-label":"Copy to clipboard",onClick:function(){navigator.clipboard.writeText(t),c(!0),setTimeout((function(){c(!1)}),1200)},className:"XydComponents-Component-coder-CodeCopy__CodeCopyHost"},i?e.createElement(w,{size:16}):e.createElement(N,{size:16}))}function Ae(n){return function(t){var r,o,a,i=1===t.highlighted.length&&!t.description;return e.createElement(E.Root,{className:"XydComponents-Component-coder-CodeTabs__CodeTabsHost",style:null===(r=t.highlighted[0])||void 0===r?void 0:r.style,defaultValue:null===(o=t.highlighted[0])||void 0===o?void 0:o.meta},e.createElement(Fe,{description:t.description,highlighted:t.highlighted}),null===(a=t.highlighted)||void 0===a?void 0:a.map((function(t,r){return e.createElement(E.Content,{value:t.meta,key:r},e.createElement(n,{style:(null==t?void 0:t.style)||(null==t?void 0:t.style),codeblock:t,className:"\n                                ".concat(i&&"XydComponents-Component-coder-CodeTabs__CodeTabsPreSingle","\n                            ")}))})))}}function Fe(n){var t,r,o=1===n.highlighted.length&&!n.description;return e.createElement("div",{className:"\n        ".concat("XydComponents-Component-coder-CodeTabs__CodeTabsLanguagesHost","\n        ").concat(o&&"XydComponents-Component-coder-CodeTabs__CodeTabsLanguagesHostSingle","\n    ")},e.createElement(He,{description:n.description}),e.createElement(E.List,{className:"XydComponents-Component-coder-CodeTabs__CodeTabsLanguagesList"},null===(t=n.highlighted)||void 0===t?void 0:t.map((function(n,t){var r=n.meta;return o?null:e.createElement(E.Trigger,{value:r,key:t,className:"XydComponents-Component-coder-CodeTabs__CodeTabsLanguagesButton"},r)}))),e.createElement("div",{className:"\n            ".concat("XydComponents-Component-coder-CodeTabs__CodeTabsLanguagesCopy","\n            ").concat(o&&"XydComponents-Component-coder-CodeTabs__CodeTabsLanguagesCopySingle","\n        ")},null===(r=n.highlighted)||void 0===r?void 0:r.map((function(n,t){return e.createElement(E.Content,{value:n.meta,asChild:!0,key:t},e.createElement(De,{text:n.value}))}))))}function He(n){return e.createElement("div",{className:"XydComponents-Component-coder-CodeTabs__CodeTabsLanguagesDescription"},e.createElement("div",{className:"XydComponents-Component-coder-CodeTabs__CodeTabsLanguagesDescriptionItem"},n.description))}function ze(n){return e.createElement(Pe,{codeblocks:n.codeblocks,theme:n.theme},e.createElement(Ie,Object.assign({},n)))}function Ie(n){var t=Se().highlighted;return"secondary"===n.kind?e.createElement(Pe.Pre,{codeblock:t[0],handlers:[Xe.mark,Xe.bg,Xe.lineNumbers]}):e.createElement(Me,{description:n.description,highlighted:t,size:n.size})}var Me=Ae((function(n){return e.createElement(Pe.Pre,Object.assign({},n,{handlers:[Xe.mark,Xe.bg,Xe.lineNumbers]}))}));export{Pe as C,Xe as a,$e as b,ze as c,xe as d,Oe as e,Se as u,Ae as w};
-//# sourceMappingURL=CodeSample-CVki5fdQ.js.map