https://farm-nightly.netlify.app/assets/js/04848b18.842f5c51.js

1"use strict";(self.webpackChunkfarm_docs=self.webpackChunkfarm_docs||[]).push([[8682],{59791:(e,s,n)=>{n.r(s),n.d(s,{assets:()=>u,contentTitle:()=>a,default:()=>h,frontMatter:()=>c,metadata:()=>d,toc:()=>p});var t=n(49214),o=n(36906),l=n(87955),r=n(12790),i=n(71947);const c={},a="@farmfe/js-plugin-postcss",d={id:"plugins/official-plugins/js-postcss",title:"@farmfe/js-plugin-postcss",description:"Support postcss for Farm.",source:"@site/docs/plugins/official-plugins/js-postcss.mdx",sourceDirName:"plugins/official-plugins",slug:"/plugins/official-plugins/js-postcss",permalink:"/docs/plugins/official-plugins/js-postcss",draft:!1,unlisted:!1,editUrl:"https://github.com/farm-fe/farm-fe.github.io/tree/main/docs/plugins/official-plugins/js-postcss.mdx",tags:[],version:"current",frontMatter:{},sidebar:"pluginSidebar",previous:{title:"@farmfe/plugin-react-components",permalink:"/docs/plugins/official-plugins/react-components"},next:{title:"@farmfe/js-plugin-less",permalink:"/docs/plugins/official-plugins/js-less"}},u={},p=[{value:"Installation",id:"installation",level:2},{value:"Usage",id:"usage",level:2},{value:"Options",id:"options",level:2},{value:"postcssLoadConfig",id:"postcssloadconfig",level:3},{value:"filters",id:"filters",level:3},{value:"implementation",id:"implementation",level:3}];function f(e){const s={a:"a",code:"code",h1:"h1",h2:"h2",h3:"h3",header:"header",li:"li",p:"p",pre:"pre",ul:"ul",...(0,o.R)(),...e.components};return(0,t.jsxs)(t.Fragment,{children:[(0,t.jsx)(s.header,{children:(0,t.jsx)(s.h1,{id:"farmfejs-plugin-postcss",children:"@farmfe/js-plugin-postcss"})}),"\n",(0,t.jsxs)(s.p,{children:["Support ",(0,t.jsx)(s.code,{children:"postcss"})," for Farm."]}),"\n",(0,t.jsx)(s.h2,{id:"installation",children:"Installation"}),"\n",(0,t.jsxs)(r.A,{children:[(0,t.jsx)(i.A,{value:"npm",label:"npm",children:(0,t.jsx)(l.A,{children:"npm install @farmfe/js-plugin-postcss postcss"})}),(0,t.jsx)(i.A,{value:"yarn",label:"yarn",children:(0,t.jsx)(l.A,{children:"yarn add @farmfe/js-plugin-postcss postcss"})}),(0,t.jsx)(i.A,{value:"pnpm",label:"pnpm",children:(0,t.jsx)(l.A,{children:"pnpm add @farmfe/js-plugin-postcss postcss"})})]}),"\n",(0,t.jsx)(s.h2,{id:"usage",children:"Usage"}),"\n",(0,t.jsx)(s.pre,{children:(0,t.jsx)(s.code,{className:"language-ts",metastring:"{2,6}",children:"import { UserConfig } from '@farmfe/core';\nimport farmJsPluginPostcss from '@farmfe/js-plugin-postcss';\n\nconst config: UserConfig = {\n  plugins: [\n    farmJsPluginPostcss({ /* options */ })\n  ]\n}\n"})}),"\n",(0,t.jsx)(s.h2,{id:"options",children:"Options"}),"\n",(0,t.jsx)(s.pre,{children:(0,t.jsx)(s.code,{className:"language-ts",children:"export type PostcssPluginOptions = {\n  /**\n   * @default undefined\n   * postcss-load-config options. path default to farm.config.js root.\n   */\n  postcssLoadConfig?: {\n    ctx?: postcssLoadConfig.ConfigContext;\n    path?: string;\n    options?: Parameters<typeof postcssLoadConfig>[2];\n  };\n  filters?: {\n    resolvedPaths?: string[];\n    moduleTypes?: string[];\n  };\n  implementation?: string;\n};\n\n"})}),"\n",(0,t.jsx)(s.h3,{id:"postcssloadconfig",children:"postcssLoadConfig"}),"\n",(0,t.jsxs)(s.p,{children:["Farm uses ",(0,t.jsx)(s.code,{children:"postcss-load-config"})," to load ",(0,t.jsx)(s.code,{children:"postcss"})," config, so you can use ",(0,t.jsx)(s.code,{children:"postcss-load-config"}),"'s options. Refer to ",(0,t.jsx)(s.a,{href:"https://github.com/postcss/postcss-load-config",children:"postcss-load-config"}),"."]}),"\n",(0,t.jsx)(s.p,{children:"Example:"}),"\n",(0,t.jsx)(s.pre,{children:(0,t.jsx)(s.code,{className:"language-ts",children:"import path from 'node:path';\nimport { UserConfig } from '@farmfe/core';\nimport farmJsPluginPostcss from '@farmfe/js-plugin-postcss';\n\nconst config: UserConfig = {\n  plugins: [\n    farmJsPluginPostcss({\n      postcssLoadConfig: {\n        // load config from client/postcss.config.js\n        path: path.join(process.cwd(), 'client')\n      }\n    })\n  ]\n}\n\nexport default config;\n"})}),"\n",(0,t.jsx)(s.h3,{id:"filters",children:"filters"}),"\n",(0,t.jsxs)(s.p,{children:["Which files should be processed by ",(0,t.jsx)(s.code,{children:"postcss"}),". default to ",(0,t.jsx)(s.code,{children:"{ moduleTypes: ['css'] }"}),"."]}),"\n",(0,t.jsxs)(s.ul,{children:["\n",(0,t.jsxs)(s.li,{children:[(0,t.jsx)(s.code,{children:"resolvedPaths"}),": Only files under these paths will be processed. Support regex."]}),"\n",(0,t.jsxs)(s.li,{children:[(0,t.jsx)(s.code,{children:"moduleTypes"}),": Only files with these module types will be processed. note that less/sass files should be processed by ",(0,t.jsx)(s.code,{children:"@farmfe/js-plugin-less"}),"/",(0,t.jsx)(s.code,{children:"@farmfe/plugin-sass"})," first."]}),"\n"]}),"\n",(0,t.jsxs)(s.p,{children:[(0,t.jsx)(s.code,{children:"resolvedPaths"})," and ",(0,t.jsx)(s.code,{children:"moduleTypes"})," are unioned, which means files match any of them will be processed."]}),"\n",(0,t.jsx)(s.p,{children:"Example:"}),"\n",(0,t.jsx)(s.pre,{children:(0,t.jsx)(s.code,{className:"language-ts",children:"import { UserConfig } from '@farmfe/core';\nimport farmJsPluginPostcss from '@farmfe/js-plugin-postcss';\n\nconst config: UserConfig = {\n  plugins: [\n    farmJsPluginPostcss({\n      filters: {\n        // all files end with .custom-css will be processed\n        resolvedPaths: ['\\\\.custom-css$'],\n        moduleTypes: ['css']\n      }\n    })\n  ]\n}\n\nexport default config;\n"})}),"\n",(0,t.jsx)(s.h3,{id:"implementation",children:"implementation"}),"\n",(0,t.jsxs)(s.p,{children:[(0,t.jsx)(s.code,{children:"implementation"})," package name of ",(0,t.jsx)(s.code,{children:"postcss"}),". Default to ",(0,t.jsx)(s.code,{children:"postcss"}),"."]})]})}function h(e={}){const{wrapper:s}={...(0,o.R)(),...e.components};return s?(0,t.jsx)(s,{...e,children:(0,t.jsx)(f,{...e})}):f(e)}},87955:(e,s,n)=>{n.d(s,{A:()=>a});var t=n(48318);const o={"shiki-wrapper":"shiki-wrapper_eFVS","code-header":"code-header_obPU","code-title":"code-title_n3kD","copy-button":"copy-button_MpeX","copy-icon":"copy-icon_DvHB",pop

1In:"popIn_sXIp","copy-success":"copy-success_xuS0"};var l=n(70251),r=n(21970);const i=[{name:"ts",content:'<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 256 256"><path fill="#3178C6" d="M20 0h216c11.046 0 20 8.954 20 20v216c0 11.046-8.954 20-20 20H20c-11.046 0-20-8.954-20-20V20C0 8.954 8.954 0 20 0Z"/><path fill="#FFF" d="M150.518 200.475v27.62c4.492 2.302 9.805 4.028 15.938 5.179c6.133 1.151 12.597 1.726 19.393 1.726c6.622 0 12.914-.633 18.874-1.899c5.96-1.266 11.187-3.352 15.678-6.257c4.492-2.906 8.048-6.704 10.669-11.394c2.62-4.689 3.93-10.486 3.93-17.391c0-5.006-.749-9.394-2.246-13.163a30.748 30.748 0 0 0-6.479-10.055c-2.821-2.935-6.205-5.567-10.149-7.898c-3.945-2.33-8.394-4.531-13.347-6.602c-3.628-1.497-6.881-2.949-9.761-4.359c-2.879-1.41-5.327-2.848-7.342-4.316c-2.016-1.467-3.571-3.021-4.665-4.661c-1.094-1.64-1.641-3.495-1.641-5.567c0-1.899.489-3.61 1.468-5.135s2.362-2.834 4.147-3.927c1.785-1.094 3.973-1.942 6.565-2.547c2.591-.604 5.471-.906 8.638-.906c2.304 0 4.737.173 7.299.518c2.563.345 5.14.877 7.732 1.597a53.669 53.669 0 0 1 7.558 2.719a41.7 41.7 0 0 1 6.781 3.797v-25.807c-4.204-1.611-8.797-2.805-13.778-3.582c-4.981-.777-10.697-1.165-17.147-1.165c-6.565 0-12.784.705-18.658 2.115c-5.874 1.409-11.043 3.61-15.506 6.602c-4.463 2.993-7.99 6.805-10.582 11.437c-2.591 4.632-3.887 10.17-3.887 16.615c0 8.228 2.375 15.248 7.127 21.06c4.751 5.811 11.963 10.731 21.638 14.759a291.458 291.458 0 0 1 10.625 4.575c3.283 1.496 6.119 3.049 8.509 4.66c2.39 1.611 4.276 3.366 5.658 5.265c1.382 1.899 2.073 4.057 2.073 6.474a9.901 9.901 0 0 1-1.296 4.963c-.863 1.524-2.174 2.848-3.93 3.97c-1.756 1.122-3.945 1.999-6.565 2.632c-2.62.633-5.687.95-9.2.95c-5.989 0-11.92-1.05-17.794-3.151c-5.875-2.1-11.317-5.25-16.327-9.451Zm-46.036-68.733H140V109H41v22.742h35.345V233h28.137V131.742Z"/></svg>'},{name:"js",content:'<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 256 256"><path fill="#F7DF1E" d="M0 0h256v256H0V0Z"/><path d="m67.312 213.932l19.59-11.856c3.78 6.701 7.218 12.371 15.465 12.371c7.905 0 12.89-3.092 12.89-15.12v-81.798h24.057v82.138c0 24.917-14.606 36.259-35.916 36.259c-19.245 0-30.416-9.967-36.087-21.996m85.07-2.576l19.588-11.341c5.157 8.421 11.859 14.607 23.715 14.607c9.969 0 16.325-4.984 16.325-11.858c0-8.248-6.53-11.17-17.528-15.98l-6.013-2.58c-17.357-7.387-28.87-16.667-28.87-36.257c0-18.044 13.747-31.792 35.228-31.792c15.294 0 26.292 5.328 34.196 19.247l-18.732 12.03c-4.125-7.389-8.591-10.31-15.465-10.31c-7.046 0-11.514 4.468-11.514 10.31c0 7.217 4.468 10.14 14.778 14.608l6.014 2.577c20.45 8.765 31.963 17.7 31.963 37.804c0 21.654-17.012 33.51-39.867 33.51c-22.339 0-36.774-10.654-43.819-24.574"/></svg>'},{name:"css",content:'<svg xmlns="http://www.w3.org/2000/svg" width="29.37" height="32" viewBox="0 0 256 279"><defs><linearGradient id="logosWindiCss0" x1="16.639%" x2="137.275%" y1="36.186%" y2="175.371%"><stop offset="7.822%" stop-color="#54C8F1"/><stop offset="57.292%" stop-color="#41A2EF"/><stop offset="100%" stop-color="#3386EE"/></linearGradient><linearGradient id="logosWindiCss1" x1="-22.099%" x2="91.451%" y1="-49.621%" y2="73.695%"><stop offset="7.822%" stop-color="#54C8F1"/><stop offset="57.292%" stop-color="#41A2EF"/><stop offset="100%" stop-color="#3386EE"/></linearGradient><linearGradient id="logosWindiCss2" x1="8.696%" x2="71.739%" y1="37.461%" y2="80.271%"><stop offset="7.822%" stop-color="#54C8F1"/><stop offset="57.292%" stop-color="#41A2EF"/><stop offset="100%" stop-color="#3386EE"/></linearGradient><linearGradient id="logosWindiCss3" x1="60.744%" x2="501.135%" y1="-308.636%" y2="225.788%"><stop offset="7.822%" stop-color="#54C8F1"/><stop offset="57.292%" stop-color="#41A2EF"/><stop offset="100%" stop-color="#3386EE"/></linearGradient></defs><path fill="url(#logosWindiCss0)" d="M133.784 48.922C133.784 21.945 111.84 0 84.863 0c-28.43 0-45.428 21.316-45.428 41.933h27.956c0-5.8 5.423-13.978 17.472-13.978c11.56 0 20.966 9.407 20.966 20.967c0 11.56-8.438 20.966-29.715 20.966H0v27.955h76.114c35.911 0 57.67-21.944 57.67-48.921Zm0 0C133.784 21.945 111.84 0 84.863 0c-28.43 0-45.428 21.316-45.428 41.933h27.956c0-5.8 5.423-13.978 17.472-13.978c11.56 0 20.966 9.407 20.966 20.967c0 11.56-8.438 20.966-29.715 20.966H0v27.955h76.114c35.911 0 57.67-21.944 57.67-48.921Z"/><path fill="url(#logosWindiCss1)" d="M195.803 229.339c0 26.978-21.945 48.922-48.922 48.922c-28.43 0-45.427-21.315-45.427-41.933h27.955c0 5.8 5.423 13.979 17.472 13.979c11.56 0 20.967-9.408 20.967-20.968s-10.63-20.966-29.716-20.966H53.671v-27.956h84.461c35.912 0 57.671 21.945 57.671 48.922Zm0 0c0 26.978-21.945 48.922-48.922 48.922c-28.43 0-45.427-21.315-45.427-41.933h27.955c0 5.8 5.423 13.979 17.472 13.979c11.56 0 20.967-9.408 20.967-20.968s-10.63-20.966-29.716-20.966H53.671v-27.956h84.461c35.912 0 57.671 21.945 57.671 48.922Z"/><path fill="url(#logosWindiCss2)" d="M203.13 43.13c-30.834 0-52.585 23.45-52.585 54.284h24.76c0-15.327 11.13-26.457 27.825-26.457c16.696 0 25.044 11.13 25.044 26.457s-10.842 27.955-40.348 27.955H0v27.956h192c43.695 0 64-28.085 64-55.911c0-30.835-20.87-54.284-52.87-54.284Z"/><path fill="url(#logosWindiCss3)" d="M36.647 180.417H0v28.19h36.647z"/></svg>'},{name:"json",content:'<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 16 16"><path fill="none" stroke="#eed49f" stroke-linecap="round" stroke-linejoin="round" d="M4.5 2.5H4c-.75 0-1.5.75-1.5 1.5v2c0 1.1-1 2-1.83 2c.83 0 1.83.9 1.83 2v2c0 .75.75 1.5 1.5 1.5h.5m7-11h.5c.75 0 1.5.75 1.5 1.5v2c0 1.1 1 2 1.83 2c-.83 0-1.83.9-1.83 2v2c0 .74-.75 1.5-1.5 1.5h-.5m-6.5-3a.5.5 0 1 0 0-1a.5.5 0 0 0 0 1m3 0a.5.5 0 1 0 0-1a.5.5 0 0 0 0 1m3 0a.5.5 0 1 0 0-1a.5.5 0 0 0 0 1"/></svg>'},{name:"text",content:'<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 48 48"><g fill="none" stroke-width="4"><path fill="#2F88FF" stroke="#000" stroke-linejoin="round" d="M10 4H30L40 14V42C40 43.1046 39.1046 44 38 44H10C8.89543 44 8 43.1046 8 42V6C8 4.89543 8.89543 4 10 4Z"/><path stroke="#fff" stroke-linecap="round" d="M18 18.0083H30"/><path stroke="#fff" stroke-linecap="round" d="M24.0083 18.0083V34"/></g></svg>'},{name:"vue",content:'<svg xmlns="http://www.w3.org/2000/svg" width="37.07" height="32" viewBox="0 0 256 221"><path fill="#41B883" d="M204.8 0H256L128 220.8L0 0h97.92L128 51.2L157.44 

10h47.36Z"/><path fill="#41B883" d="m0 0l128 220.8L256 0h-51.2L128 132.48L50.56 0H0Z"/><path fill="#35495E" d="M50.56 0L128 133.12L204.8 0h-47.36L128 51.2L97.92 0H50.56Z"/></svg>'}];var c=n(49214);function a(e){const[s,n]=(0,t.useState)(""),[a,d]=(0,t.useState)(!1),u=e.className?e.className.replace(/language-/,""):"javascript",p=e.metastring?e.metastring.match(/title="([^"]+)"/):null,f=p?p[1]:null,h=e.metastring?e.metastring.match(/{([\d,-]+)}/):null,{colorMode:m}=(0,r.G)(),g={ts:i.find((e=>"ts"===e.name))?.content,js:i.find((e=>"js"===e.name))?.content,css:i.find((e=>"css"===e.name))?.content,json:i.find((e=>"json"===e.name))?.content,txt:i.find((e=>"text"===e.name))?.content,vue:i.find((e=>"vue"===e.name))?.content},v=(e,s)=>(0,c.jsx)("span",{className:s,dangerouslySetInnerHTML:{__html:e}});(0,t.useEffect)((()=>{(async()=>{let s=[];h&&(s=h[1].split(",").flatMap((e=>{const[s,n]=e.split("-").map(Number);return n?Array.from({length:n-s+1},((e,n)=>s+n)):[s]})));const t=await(0,l.Yz)(e.children,{lang:u,theme:"dark"===m?"vitesse-dark":"vitesse-light",transformers:[{name:"line-highlight",code(e){let n=0;return e.children.forEach((e=>{"element"===e.type&&"span"===e.tagName&&"line"===e.properties.class&&(n++,s.includes(n)&&(e.properties.class="line highlighted-line"))})),e}}]});n(t)})()}),[e.children,m,u,h]);return(0,c.jsx)(c.Fragment,{children:(0,c.jsxs)("div",{className:o["shiki-wrapper"],children:[(0,c.jsxs)("div",{className:o["code-header"],children:[f&&(0,c.jsxs)("div",{className:o["code-title"],children:[(e=>{if(!e)return null;const s=e.split(".").pop().toLowerCase(),n=g[s];return n?v(n,o["file-icon"]):null})(f),f]}),(0,c.jsx)("button",{className:o["copy-button"],onClick:()=>{navigator.clipboard.writeText(e.children).then((()=>{d(!0),setTimeout((()=>d(!1)),2e3)}))},children:a?(0,c.jsx)("svg",{className:`${o["copy-icon"]} ${o["copy-success"]}`,viewBox:"0 0 24 24",children:(0,c.jsx)("path",{d:"M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41L9 16.17z"})}):(0,c.jsx)("svg",{className:o["copy-icon"],viewBox:"0 0 24 24",children:(0,c.jsx)("path",{d:"M16 1H4c-1.1 0-2 .9-2 2v14h2V3h12V1zm3 4H8c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h11c1.1 0 2-.9 2-2V7c0-1.1-.9-2-2-2zm0 16H8V7h11v14z"})})})]}),(0,c.jsx)("div",{className:o["code-content"],dangerouslySetInnerHTML:{__html:s}})]})})}},71947:(e,s,n)=>{n.d(s,{A:()=>r});n(48318);var t=n(23372);const o={tabItem:"tabItem_Q1qS"};var l=n(49214);function r(e){let{children:s,hidden:n,className:r}=e;return(0,l.jsx)("div",{role:"tabpanel",className:(0,t.A)(o.tabItem,r),hidden:n,children:s})}},12790:(e,s,n)=>{n.d(s,{A:()=>y});var t=n(48318),o=n(23372),l=n(52521),r=n(66325),i=n(97478),c=n(37202),a=n(42587),d=n(7152);function u(e){return t.Children.toArray(e).filter((e=>"\n"!==e)).map((e=>{if(!e||(0,t.isValidElement)(e)&&function(e){const{props:s}=e;return!!s&&"object"==typeof s&&"value"in s}(e))return e;throw new Error(`Docusaurus error: Bad <Tabs> child <${"string"==typeof e.type?e.type:e.type.name}>: all children of the <Tabs> component should be <TabItem>, and every <TabItem> should have a unique "value" prop.`)}))?.filter(Boolean)??[]}function p(e){const{values:s,children:n}=e;return(0,t.useMemo)((()=>{const e=s??function(e){return u(e).map((e=>{let{props:{value:s,label:n,attributes:t,default:o}}=e;return{value:s,label:n,attributes:t,default:o}}))}(n);return function(e){const s=(0,a.XI)(e,((e,s)=>e.value===s.value));if(s.length>0)throw new Error(`Docusaurus error: Duplicate values "${s.map((e=>e.value)).join(", ")}" found in <Tabs>. Every value needs to be unique.`)}(e),e}),[s,n])}function f(e){let{value:s,tabValues:n}=e;return n.some((e=>e.value===s))}function h(e){let{queryString:s=!1,groupId:n}=e;const o=(0,r.W6)(),l=function(e){let{queryString:s=!1,groupId:n}=e;if("string"==typeof s)return s;if(!1===s)return null;if(!0===s&&!n)throw new Error('Docusaurus error: The <Tabs> component groupId prop is required if queryString=true, because this value is used as the search param name. You can also provide an explicit value such as queryString="my-search-param".');return n??null}({queryString:s,groupId:n});return[(0,c.aZ)(l),(0,t.useCallback)((e=>{if(!l)return;const s=new URLSearchParams(o.location.search);s.set(l,e),o.replace({...o.location,search:s.toString()})}),[l,o])]}function m(e){const{defaultValue:s,queryString:n=!1,groupId:o}=e,l=p(e),[r,c]=(0,t.useState)((()=>function(e){let{defaultValue:s,tabValues:n}=e;if(0===n.length)throw new Error("Docusaurus error: the <Tabs> component requires at least one <TabItem> children component");if(s){if(!f({value:s,tabValues:n}))throw new Error(`Docusaurus error: The <Tabs> has a defaultValue "${s}" but none of its children has the corresponding value. Available values are: ${n.map((e=>e.value)).join(", ")}. If you intend to show no default tab, use defaultValue={null} instead.`);return s}const t=n.find((e=>e.default))??n[0];if(!t)throw new Error("Unexpected error: 0 tabValues");return t.value}({defaultValue:s,tabValues:l}))),[a,u]=h({queryString:n,groupId:o}),[m,g]=function(e){let{groupId:s}=e;const n=function(e){return e?`docusaurus.tab.${e}`:null}(s),[o,l]=(0,d.Dv)(n);return[o,(0,t.useCallback)((e=>{n&&l.set(e)}),[n,l])]}({groupId:o}),v=(()=>{const e=a??m;return f({value:e,tabValues:l})?e:null})();(0,i.A)((()=>{v&&c(v)}),[v]);return{selectedValue:r,selectValue:(0,t.useCallback)((e=>{if(!f({value:e,tabValues:l}))throw new Error(`Can't select invalid tab value=${e}`);c(e),u(e),g(e)}),[u,g,l]),tabValues:l}}var g=n(3662);const v={tabList:"tabList_vzF7",tabItem:"tabItem_gx_e"};var x=n(49214);function j(e){let{className:s,block:n,selectedValue:t,selectValue:r,tabValues:i}=e;const c=[],{blockElementScrollPositionUntilNextRender:a}=(0,l.a_)(),d=e=>{const s=e.currentTarget,n=c.indexOf(s),o=i[n].value;o!==t&&(a(s),r(o))},u=e=>{let s=null;switch(e.key){case"Enter":d(e);break;case"ArrowRight":{const n=c.indexOf(e.currentTarget)+1;s=c[n]??c[0];break}case"ArrowLeft":{const n=c.indexOf(e.currentTarget)-1;s=c[n]??c[c.length-1];break}}s?.focus()};return(0,x.jsx)("ul",{role:"tablist","aria-orientation":"horizontal",className:(0,o.A)("tabs",{"tabs--block":n},s),children:i.map((e=>{let{value:s,label:n,attributes:l}=e;return(0,x.jsx)("li",{role:"tab",tabIndex:t===s?0:-1,"aria-selected":t===s,ref:e=>c.push(e),onKeyDown:u,onClick:d,...l,className:(0,o.A)("tabs__item",v.tabItem,l?.className,{"tabs__item--active":t===s}),children:n??s},s)}))})}function b(e){let{lazy:s,children:n,selectedValue:l}=e;

1const r=(Array.isArray(n)?n:[n]).filter(Boolean);if(s){const e=r.find((e=>e.props.value===l));return e?(0,t.cloneElement)(e,{className:(0,o.A)("margin-top--md",e.props.className)}):null}return(0,x.jsx)("div",{className:"margin-top--md",children:r.map(((e,s)=>(0,t.cloneElement)(e,{key:s,hidden:e.props.value!==l})))})}function w(e){const s=m(e);return(0,x.jsxs)("div",{className:(0,o.A)("tabs-container",v.tabList),children:[(0,x.jsx)(j,{...s,...e}),(0,x.jsx)(b,{...s,...e})]})}function y(e){const s=(0,g.A)();return(0,x.jsx)(w,{...e,children:u(e.children)},String(s))}}}]);