@intlayer/design-system 8.2.3 → 8.2.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/esm/components/IDE/CodeBlockClient.mjs.map +1 -1
- package/dist/esm/components/IDE/CodeBlockShiki.mjs +1 -1
- package/dist/esm/components/IDE/CodeBlockShiki.mjs.map +1 -1
- package/dist/esm/components/Input/Input.mjs +1 -1
- package/dist/esm/components/Input/Input.mjs.map +1 -1
- package/dist/esm/components/Label/index.mjs +1 -1
- package/dist/esm/components/Label/index.mjs.map +1 -1
- package/dist/esm/components/Link/Link.mjs +1 -1
- package/dist/esm/components/Link/Link.mjs.map +1 -1
- package/dist/esm/components/MarkDownRender/MarkDownRender.mjs +1 -1
- package/dist/esm/components/MarkDownRender/MarkDownRender.mjs.map +1 -1
- package/dist/esm/components/MarkDownRender/index.mjs +1 -1
- package/dist/esm/components/Select/Select.mjs +1 -1
- package/dist/esm/components/Select/Select.mjs.map +1 -1
- package/dist/esm/components/index.mjs +1 -1
- package/dist/esm/hooks/index.mjs +1 -1
- package/dist/esm/hooks/reactQuery.mjs +1 -1
- package/dist/esm/hooks/reactQuery.mjs.map +1 -1
- package/dist/esm/hooks/useIntlayerAPI.mjs.map +1 -1
- package/dist/types/components/Badge/index.d.ts +1 -1
- package/dist/types/components/Button/Button.d.ts +2 -2
- package/dist/types/components/Container/index.d.ts +2 -2
- package/dist/types/components/IDE/CodeBlockClient.d.ts +2 -2
- package/dist/types/components/IDE/CodeBlockClient.d.ts.map +1 -1
- package/dist/types/components/IDE/CodeBlockShiki.d.ts.map +1 -1
- package/dist/types/components/IDE/index.d.ts +2 -2
- package/dist/types/components/Input/Checkbox.d.ts +1 -1
- package/dist/types/components/Link/Link.d.ts +2 -2
- package/dist/types/components/MarkDownRender/MarkDownRender.d.ts +142 -14
- package/dist/types/components/MarkDownRender/MarkDownRender.d.ts.map +1 -1
- package/dist/types/components/MarkDownRender/index.d.ts +2 -2
- package/dist/types/components/Pagination/Pagination.d.ts +1 -1
- package/dist/types/components/Select/Select.d.ts.map +1 -1
- package/dist/types/components/SwitchSelector/index.d.ts +1 -1
- package/dist/types/components/Tab/Tab.d.ts +1 -1
- package/dist/types/components/TabSelector/TabSelector.d.ts +1 -1
- package/dist/types/components/Tag/index.d.ts +1 -1
- package/dist/types/components/index.d.ts +3 -3
- package/dist/types/hooks/index.d.ts +3 -3
- package/dist/types/hooks/reactQuery.d.ts +11 -3
- package/dist/types/hooks/reactQuery.d.ts.map +1 -1
- package/dist/types/hooks/useIntlayerAPI.d.ts +1 -1
- package/dist/types/hooks/useIntlayerAPI.d.ts.map +1 -1
- package/package.json +2 -2
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CodeBlockClient.mjs","names":[],"sources":["../../../../src/components/IDE/CodeBlockClient.tsx"],"sourcesContent":["import { cn } from '@utils/cn';\nimport { type FC, type HTMLAttributes, lazy, Suspense } from 'react';\nimport type { BundledLanguage } from 'shiki/bundle/web';\n\nexport const CodeDefault: FC<{ children: string }> = ({ children }) => (\n <div className=\"min-w-0 max-w-full overflow-x-auto\">\n <pre className=\"min-w-0 max-w-full overflow-x-auto [-ms-overflow-style:none] [scrollbar-width:none] [&::-webkit-scrollbar]:hidden\">\n <code>\n {typeof children === 'string'\n ? children.split('\\n').map((line, index) => (\n <span\n className=\"line block w-full\"\n key={`line-${index}-${line.slice(0, 10)}`}\n >\n {line}\n </span>\n ))\n : children}\n </code>\n </pre>\n </div>\n);\n\n// Lazy load the Shiki component\nconst CodeBlockShiki = lazy(() =>\n import('./CodeBlockShiki').then((mod) => ({\n default: mod.CodeBlockShiki,\n }))\n);\n\nexport type CodeBlockProps = {\n children: string;\n lang: BundledLanguage;\n isDarkMode?: boolean;\n isEditable?: boolean;\n onChange?: (content: string) => void;\n} & Omit<HTMLAttributes<HTMLDivElement>, 'onChange'>;\n\nexport const CodeBlock: FC<CodeBlockProps> = ({\n className,\n onChange,\n isEditable,\n children,\n lang,\n isDarkMode,\n ...props\n}) => (\n <div\n className={cn('flex w-full min-w-0 max-w-full overflow-x-auto', className)}\n {...props}\n >\n <Suspense fallback={<CodeDefault>{children}</CodeDefault>}>\n <CodeBlockShiki lang={lang} isDarkMode={isDarkMode}>\n {children}\n </CodeBlockShiki>\n </Suspense>\n </div>\n);\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"CodeBlockClient.mjs","names":[],"sources":["../../../../src/components/IDE/CodeBlockClient.tsx"],"sourcesContent":["import { cn } from '@utils/cn';\nimport { type FC, type HTMLAttributes, lazy, Suspense } from 'react';\nimport type { BundledLanguage } from 'shiki/bundle/web';\n\nexport type { BundledLanguage as CodeLanguage } from 'shiki/bundle/web';\n\nexport const CodeDefault: FC<{ children: string }> = ({ children }) => (\n <div className=\"min-w-0 max-w-full overflow-x-auto\">\n <pre className=\"min-w-0 max-w-full overflow-x-auto [-ms-overflow-style:none] [scrollbar-width:none] [&::-webkit-scrollbar]:hidden\">\n <code>\n {typeof children === 'string'\n ? children.split('\\n').map((line, index) => (\n <span\n className=\"line block w-full\"\n key={`line-${index}-${line.slice(0, 10)}`}\n >\n {line}\n </span>\n ))\n : children}\n </code>\n </pre>\n </div>\n);\n\n// Lazy load the Shiki component\nconst CodeBlockShiki = lazy(() =>\n import('./CodeBlockShiki').then((mod) => ({\n default: mod.CodeBlockShiki,\n }))\n);\n\nexport type CodeBlockProps = {\n children: string;\n lang: BundledLanguage;\n isDarkMode?: boolean;\n isEditable?: boolean;\n onChange?: (content: string) => void;\n} & Omit<HTMLAttributes<HTMLDivElement>, 'onChange'>;\n\nexport const CodeBlock: FC<CodeBlockProps> = ({\n className,\n onChange,\n isEditable,\n children,\n lang,\n isDarkMode,\n ...props\n}) => (\n <div\n className={cn('flex w-full min-w-0 max-w-full overflow-x-auto', className)}\n {...props}\n >\n <Suspense fallback={<CodeDefault>{children}</CodeDefault>}>\n <CodeBlockShiki lang={lang} isDarkMode={isDarkMode}>\n {children}\n </CodeBlockShiki>\n </Suspense>\n </div>\n);\n"],"mappings":"2HAMA,MAAa,GAAyC,CAAE,cACtD,EAAC,MAAD,CAAK,UAAU,8CACb,EAAC,MAAD,CAAK,UAAU,6HACb,EAAC,OAAD,CAAA,SACG,OAAO,GAAa,SACjB,EAAS,MAAM;EAAK,CAAC,KAAK,EAAM,IAC9B,EAAC,OAAD,CACE,UAAU,6BAGT,EACI,CAHA,QAAQ,EAAM,GAAG,EAAK,MAAM,EAAG,GAAG,GAGlC,CACP,CACF,EACC,CAAA,CACH,CAAA,CACF,CAAA,CAIF,EAAiB,MACrB,OAAO,wBAAoB,KAAM,IAAS,CACxC,QAAS,EAAI,eACd,EAAE,CACJ,CAUY,GAAiC,CAC5C,YACA,WACA,aACA,WACA,OACA,aACA,GAAG,KAEH,EAAC,MAAD,CACE,UAAW,EAAG,iDAAkD,EAAU,CAC1E,GAAI,WAEJ,EAAC,EAAD,CAAU,SAAU,EAAC,EAAD,CAAc,WAAuB,CAAA,UACvD,EAAC,EAAD,CAAsB,OAAkB,aACrC,WACc,CAAA,CACR,CAAA,CACP,CAAA"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use client";import{CodeDefault as e}from"./CodeBlockClient.mjs";import{useEffect as t,useState as n}from"react";import{jsx as r}from"react/jsx-runtime";const i=new Map,a=new Map,o=async e=>{if(i.has(e))return i.get(e);let t;switch(e){case`typescript`:case`ts`:t=await import(`shiki/langs/typescript.mjs`);break;case`javascript`:case`js`:t=await import(`shiki/langs/javascript.mjs`);break;case`bash`:case`sh`:case`shell`:t=await import(`shiki/langs/bash.mjs`);break;case`json`:t=await import(`shiki/langs/json.mjs`);break;case`tsx`:t=await import(`shiki/langs/tsx.mjs`);break;case`vue`:t=await import(`shiki/langs/vue.mjs`);break;case`html`:t=await import(`shiki/langs/html.mjs`);break;default:t=await import(`shiki/langs/typescript.mjs`);break}let n=t.default;return i.set(e,n),n},s=async e=>{if(a.has(e))return a.get(e);let t;switch(e){case`github-dark`:t=await import(`shiki/themes/github-dark.mjs`);break;default:t=await import(`shiki/themes/github-light.mjs`);break}let n=t.default;return a.set(e,n),n};let c=null;const l=async()=>(c||=import(`shiki/bundle/web`).then(({createHighlighter:e})=>e({langs:[],themes:[]})),c),u=async(e,t,n)=>{let r=n?`github-dark`:`github-light`,[i,a,c]=await Promise.all([l(),o(t),s(r)]);return i.getLoadedLanguages().includes(t)||await i.loadLanguage(a),i.getLoadedThemes().includes(r)||await i.loadTheme(c),i.codeToHtml(e,{lang:t,theme:r})},d=({children:i,lang:a,isDarkMode:o})=>{let[s,c]=n(null);return t(()=>{let e=!1;return u(i,a,o).then(t=>{e||c(t)}).catch(t=>{console.error(`Failed to highlight code:`,t),!e&&s===null&&c(``)}),()=>{e=!0}},[i,a,o]),r(`div`,{className:`min-w-0 max-w-full overflow-auto bg-transparent [-ms-overflow-style:none] [scrollbar-width:none] [&::-webkit-scrollbar]:hidden [&_pre::-webkit-scrollbar]:hidden [&_pre]:[-ms-overflow-style:none] [&_pre]:[scrollbar-width:none]`,children:s?r(`div`,{dangerouslySetInnerHTML:{__html:s}}):r(e,{children:i})})};export{d as CodeBlockShiki};
|
|
1
|
+
"use client";import{CodeDefault as e}from"./CodeBlockClient.mjs";import{useEffect as t,useState as n}from"react";import{jsx as r}from"react/jsx-runtime";const i=new Map,a=new Map,o=async e=>{if(i.has(e))return i.get(e);let t;switch(e){case`typescript`:case`ts`:t=await import(`shiki/langs/typescript.mjs`);break;case`javascript`:case`js`:t=await import(`shiki/langs/javascript.mjs`);break;case`bash`:case`sh`:case`shell`:t=await import(`shiki/langs/bash.mjs`);break;case`json`:t=await import(`shiki/langs/json.mjs`);break;case`tsx`:t=await import(`shiki/langs/tsx.mjs`);break;case`vue`:t=await import(`shiki/langs/vue.mjs`);break;case`html`:t=await import(`shiki/langs/html.mjs`);break;case`xml`:t=await import(`shiki/langs/xml.mjs`);break;case`yaml`:t=await import(`shiki/langs/yaml.mjs`);break;default:t=await import(`shiki/langs/typescript.mjs`);break}let n=t.default;return i.set(e,n),n},s=async e=>{if(a.has(e))return a.get(e);let t;switch(e){case`github-dark`:t=await import(`shiki/themes/github-dark.mjs`);break;default:t=await import(`shiki/themes/github-light.mjs`);break}let n=t.default;return a.set(e,n),n};let c=null;const l=async()=>(c||=import(`shiki/bundle/web`).then(({createHighlighter:e})=>e({langs:[],themes:[]})),c),u=async(e,t,n)=>{let r=n?`github-dark`:`github-light`,[i,a,c]=await Promise.all([l(),o(t),s(r)]);return i.getLoadedLanguages().includes(t)||await i.loadLanguage(a),i.getLoadedThemes().includes(r)||await i.loadTheme(c),i.codeToHtml(e,{lang:t,theme:r})},d=({children:i,lang:a,isDarkMode:o})=>{let[s,c]=n(null);return t(()=>{let e=!1;return u(i,a,o).then(t=>{e||c(t)}).catch(t=>{console.error(`Failed to highlight code:`,t),!e&&s===null&&c(``)}),()=>{e=!0}},[i,a,o]),r(`div`,{className:`min-w-0 max-w-full overflow-auto bg-transparent [-ms-overflow-style:none] [scrollbar-width:none] [&::-webkit-scrollbar]:hidden [&_pre::-webkit-scrollbar]:hidden [&_pre]:[-ms-overflow-style:none] [&_pre]:[scrollbar-width:none]`,children:s?r(`div`,{dangerouslySetInnerHTML:{__html:s}}):r(e,{children:i})})};export{d as CodeBlockShiki};
|
|
2
2
|
//# sourceMappingURL=CodeBlockShiki.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CodeBlockShiki.mjs","names":[],"sources":["../../../../src/components/IDE/CodeBlockShiki.tsx"],"sourcesContent":["'use client';\n\nimport { type FC, useEffect, useState } from 'react';\nimport type {\n BundledLanguage,\n BundledTheme,\n HighlighterGeneric,\n} from 'shiki/bundle/web';\nimport { CodeDefault } from './CodeBlockClient';\n\n// Map of loaded modules to avoid re-importing\nconst languageCache = new Map<BundledLanguage, any>();\nconst themeCache = new Map<BundledTheme, any>();\n\n// Lazy load language modules\nconst loadLanguage = async (lang: BundledLanguage): Promise<any> => {\n if (languageCache.has(lang)) return languageCache.get(lang);\n\n let languageModule: any;\n switch (lang) {\n case 'typescript':\n case 'ts':\n languageModule = await import('shiki/langs/typescript.mjs');\n break;\n case 'javascript':\n case 'js':\n languageModule = await import('shiki/langs/javascript.mjs');\n break;\n case 'bash':\n case 'sh':\n case 'shell':\n languageModule = await import('shiki/langs/bash.mjs');\n break;\n case 'json':\n languageModule = await import('shiki/langs/json.mjs');\n break;\n case 'tsx':\n languageModule = await import('shiki/langs/tsx.mjs');\n break;\n case 'vue':\n languageModule = await import('shiki/langs/vue.mjs');\n break;\n case 'html':\n languageModule = await import('shiki/langs/html.mjs');\n break;\n default:\n languageModule = await import('shiki/langs/typescript.mjs');\n break;\n }\n\n const language = languageModule.default;\n languageCache.set(lang, language);\n return language;\n};\n\n// Lazy load theme modules\nconst loadTheme = async (themeName: BundledTheme): Promise<any> => {\n if (themeCache.has(themeName)) return themeCache.get(themeName);\n\n let themeModule: any;\n switch (themeName) {\n case 'github-dark':\n themeModule = await import('shiki/themes/github-dark.mjs');\n break;\n case 'github-light':\n default:\n themeModule = await import('shiki/themes/github-light.mjs');\n break;\n }\n\n const theme = themeModule.default;\n themeCache.set(themeName, theme);\n return theme;\n};\n\n// Singleton Highlighter Instance\nlet highlighterPromise: Promise<HighlighterGeneric<any, any>> | null = null;\n\nconst getHighlighterInstance = async () => {\n if (!highlighterPromise) {\n highlighterPromise = import('shiki/bundle/web').then(\n ({ createHighlighter }) =>\n createHighlighter({\n langs: [],\n themes: [],\n })\n );\n }\n return highlighterPromise;\n};\n\n// Create a promise for highlighting\nconst highlightCode = async (\n code: string,\n lang: BundledLanguage,\n isDarkMode?: boolean\n): Promise<string> => {\n const themeName: BundledTheme = isDarkMode ? 'github-dark' : 'github-light';\n\n // Load highlighter, language, and theme in parallel\n const [highlighter, languageModule, themeModule] = await Promise.all([\n getHighlighterInstance(),\n loadLanguage(lang),\n loadTheme(themeName),\n ]);\n\n // Load into the singleton instance if not already loaded\n if (!highlighter.getLoadedLanguages().includes(lang)) {\n await highlighter.loadLanguage(languageModule);\n }\n if (!highlighter.getLoadedThemes().includes(themeName)) {\n await highlighter.loadTheme(themeModule);\n }\n\n return highlighter.codeToHtml(code, {\n lang,\n theme: themeName,\n });\n};\n\nexport type CodeBlockShikiProps = {\n children: string;\n lang: BundledLanguage;\n isDarkMode?: boolean;\n};\n\nexport const CodeBlockShiki: FC<CodeBlockShikiProps> = ({\n children,\n lang,\n isDarkMode,\n}) => {\n const [html, setHtml] = useState<string | null>(null);\n\n useEffect(() => {\n let isCancelled = false;\n\n highlightCode(children, lang, isDarkMode)\n .then((result) => {\n if (!isCancelled) setHtml(result);\n })\n .catch((error) => {\n console.error('Failed to highlight code:', error);\n if (!isCancelled && html === null) setHtml('');\n });\n\n return () => {\n isCancelled = true;\n };\n }, [children, lang, isDarkMode]);\n\n return (\n <div className=\"min-w-0 max-w-full overflow-auto bg-transparent [-ms-overflow-style:none] [scrollbar-width:none] [&::-webkit-scrollbar]:hidden [&_pre::-webkit-scrollbar]:hidden [&_pre]:[-ms-overflow-style:none] [&_pre]:[scrollbar-width:none]\">\n {html ? (\n // biome-ignore lint/security/noDangerouslySetInnerHtml: Shiki generates safe HTML for code highlighting\n <div dangerouslySetInnerHTML={{ __html: html }} />\n ) : (\n <CodeDefault>{children}</CodeDefault>\n )}\n </div>\n );\n};\n"],"mappings":"yJAWA,MAAM,EAAgB,IAAI,IACpB,EAAa,IAAI,IAGjB,EAAe,KAAO,IAAwC,CAClE,GAAI,EAAc,IAAI,EAAK,CAAE,OAAO,EAAc,IAAI,EAAK,CAE3D,IAAI,EACJ,OAAQ,EAAR,CACE,IAAK,aACL,IAAK,KACH,EAAiB,MAAM,OAAO,8BAC9B,MACF,IAAK,aACL,IAAK,KACH,EAAiB,MAAM,OAAO,8BAC9B,MACF,IAAK,OACL,IAAK,KACL,IAAK,QACH,EAAiB,MAAM,OAAO,wBAC9B,MACF,IAAK,OACH,EAAiB,MAAM,OAAO,wBAC9B,MACF,IAAK,MACH,EAAiB,MAAM,OAAO,uBAC9B,MACF,IAAK,MACH,EAAiB,MAAM,OAAO,uBAC9B,MACF,IAAK,OACH,EAAiB,MAAM,OAAO,wBAC9B,MACF,QACE,EAAiB,MAAM,OAAO,8BAC9B,MAGJ,IAAM,EAAW,EAAe,QAEhC,OADA,EAAc,IAAI,EAAM,EAAS,CAC1B,GAIH,EAAY,KAAO,IAA0C,CACjE,GAAI,EAAW,IAAI,EAAU,CAAE,OAAO,EAAW,IAAI,EAAU,CAE/D,IAAI,EACJ,OAAQ,EAAR,CACE,IAAK,cACH,EAAc,MAAM,OAAO,gCAC3B,MAEF,QACE,EAAc,MAAM,OAAO,iCAC3B,MAGJ,IAAM,EAAQ,EAAY,QAE1B,OADA,EAAW,IAAI,EAAW,EAAM,CACzB,GAIT,IAAI,EAAmE,KAEvE,MAAM,EAAyB,UAC7B,AACE,IAAqB,OAAO,oBAAoB,MAC7C,CAAE,uBACD,EAAkB,CAChB,MAAO,EAAE,CACT,OAAQ,EAAE,CACX,CAAC,CACL,CAEI,GAIH,EAAgB,MACpB,EACA,EACA,IACoB,CACpB,IAAM,EAA0B,EAAa,cAAgB,eAGvD,CAAC,EAAa,EAAgB,GAAe,MAAM,QAAQ,IAAI,CACnE,GAAwB,CACxB,EAAa,EAAK,CAClB,EAAU,EAAU,CACrB,CAAC,CAUF,OAPK,EAAY,oBAAoB,CAAC,SAAS,EAAK,EAClD,MAAM,EAAY,aAAa,EAAe,CAE3C,EAAY,iBAAiB,CAAC,SAAS,EAAU,EACpD,MAAM,EAAY,UAAU,EAAY,CAGnC,EAAY,WAAW,EAAM,CAClC,OACA,MAAO,EACR,CAAC,EASS,GAA2C,CACtD,WACA,OACA,gBACI,CACJ,GAAM,CAAC,EAAM,GAAW,EAAwB,KAAK,CAmBrD,OAjBA,MAAgB,CACd,IAAI,EAAc,GAWlB,OATA,EAAc,EAAU,EAAM,EAAW,CACtC,KAAM,GAAW,CACX,GAAa,EAAQ,EAAO,EACjC,CACD,MAAO,GAAU,CAChB,QAAQ,MAAM,4BAA6B,EAAM,CAC7C,CAAC,GAAe,IAAS,MAAM,EAAQ,GAAG,EAC9C,KAES,CACX,EAAc,KAEf,CAAC,EAAU,EAAM,EAAW,CAAC,CAG9B,EAAC,MAAD,CAAK,UAAU,6OACZ,EAEC,EAAC,MAAD,CAAK,wBAAyB,CAAE,OAAQ,EAAM,CAAI,CAAA,CAElD,EAAC,EAAD,CAAc,WAAuB,CAAA,CAEnC,CAAA"}
|
|
1
|
+
{"version":3,"file":"CodeBlockShiki.mjs","names":[],"sources":["../../../../src/components/IDE/CodeBlockShiki.tsx"],"sourcesContent":["'use client';\n\nimport { type FC, useEffect, useState } from 'react';\nimport type {\n BundledLanguage,\n BundledTheme,\n HighlighterGeneric,\n} from 'shiki/bundle/web';\nimport { CodeDefault } from './CodeBlockClient';\n\n// Map of loaded modules to avoid re-importing\nconst languageCache = new Map<BundledLanguage, any>();\nconst themeCache = new Map<BundledTheme, any>();\n\n// Lazy load language modules\nconst loadLanguage = async (lang: BundledLanguage): Promise<any> => {\n if (languageCache.has(lang)) return languageCache.get(lang);\n\n let languageModule: any;\n switch (lang) {\n case 'typescript':\n case 'ts':\n languageModule = await import('shiki/langs/typescript.mjs');\n break;\n case 'javascript':\n case 'js':\n languageModule = await import('shiki/langs/javascript.mjs');\n break;\n case 'bash':\n case 'sh':\n case 'shell':\n languageModule = await import('shiki/langs/bash.mjs');\n break;\n case 'json':\n languageModule = await import('shiki/langs/json.mjs');\n break;\n case 'tsx':\n languageModule = await import('shiki/langs/tsx.mjs');\n break;\n case 'vue':\n languageModule = await import('shiki/langs/vue.mjs');\n break;\n case 'html':\n languageModule = await import('shiki/langs/html.mjs');\n break;\n case 'xml':\n languageModule = await import('shiki/langs/xml.mjs');\n break;\n case 'yaml':\n languageModule = await import('shiki/langs/yaml.mjs');\n break;\n default:\n languageModule = await import('shiki/langs/typescript.mjs');\n break;\n }\n\n const language = languageModule.default;\n languageCache.set(lang, language);\n return language;\n};\n\n// Lazy load theme modules\nconst loadTheme = async (themeName: BundledTheme): Promise<any> => {\n if (themeCache.has(themeName)) return themeCache.get(themeName);\n\n let themeModule: any;\n switch (themeName) {\n case 'github-dark':\n themeModule = await import('shiki/themes/github-dark.mjs');\n break;\n case 'github-light':\n default:\n themeModule = await import('shiki/themes/github-light.mjs');\n break;\n }\n\n const theme = themeModule.default;\n themeCache.set(themeName, theme);\n return theme;\n};\n\n// Singleton Highlighter Instance\nlet highlighterPromise: Promise<HighlighterGeneric<any, any>> | null = null;\n\nconst getHighlighterInstance = async () => {\n if (!highlighterPromise) {\n highlighterPromise = import('shiki/bundle/web').then(\n ({ createHighlighter }) =>\n createHighlighter({\n langs: [],\n themes: [],\n })\n );\n }\n return highlighterPromise;\n};\n\n// Create a promise for highlighting\nconst highlightCode = async (\n code: string,\n lang: BundledLanguage,\n isDarkMode?: boolean\n): Promise<string> => {\n const themeName: BundledTheme = isDarkMode ? 'github-dark' : 'github-light';\n\n // Load highlighter, language, and theme in parallel\n const [highlighter, languageModule, themeModule] = await Promise.all([\n getHighlighterInstance(),\n loadLanguage(lang),\n loadTheme(themeName),\n ]);\n\n // Load into the singleton instance if not already loaded\n if (!highlighter.getLoadedLanguages().includes(lang)) {\n await highlighter.loadLanguage(languageModule);\n }\n if (!highlighter.getLoadedThemes().includes(themeName)) {\n await highlighter.loadTheme(themeModule);\n }\n\n return highlighter.codeToHtml(code, {\n lang,\n theme: themeName,\n });\n};\n\nexport type CodeBlockShikiProps = {\n children: string;\n lang: BundledLanguage;\n isDarkMode?: boolean;\n};\n\nexport const CodeBlockShiki: FC<CodeBlockShikiProps> = ({\n children,\n lang,\n isDarkMode,\n}) => {\n const [html, setHtml] = useState<string | null>(null);\n\n useEffect(() => {\n let isCancelled = false;\n\n highlightCode(children, lang, isDarkMode)\n .then((result) => {\n if (!isCancelled) setHtml(result);\n })\n .catch((error) => {\n console.error('Failed to highlight code:', error);\n if (!isCancelled && html === null) setHtml('');\n });\n\n return () => {\n isCancelled = true;\n };\n }, [children, lang, isDarkMode]);\n\n return (\n <div className=\"min-w-0 max-w-full overflow-auto bg-transparent [-ms-overflow-style:none] [scrollbar-width:none] [&::-webkit-scrollbar]:hidden [&_pre::-webkit-scrollbar]:hidden [&_pre]:[-ms-overflow-style:none] [&_pre]:[scrollbar-width:none]\">\n {html ? (\n // biome-ignore lint/security/noDangerouslySetInnerHtml: Shiki generates safe HTML for code highlighting\n <div dangerouslySetInnerHTML={{ __html: html }} />\n ) : (\n <CodeDefault>{children}</CodeDefault>\n )}\n </div>\n );\n};\n"],"mappings":"yJAWA,MAAM,EAAgB,IAAI,IACpB,EAAa,IAAI,IAGjB,EAAe,KAAO,IAAwC,CAClE,GAAI,EAAc,IAAI,EAAK,CAAE,OAAO,EAAc,IAAI,EAAK,CAE3D,IAAI,EACJ,OAAQ,EAAR,CACE,IAAK,aACL,IAAK,KACH,EAAiB,MAAM,OAAO,8BAC9B,MACF,IAAK,aACL,IAAK,KACH,EAAiB,MAAM,OAAO,8BAC9B,MACF,IAAK,OACL,IAAK,KACL,IAAK,QACH,EAAiB,MAAM,OAAO,wBAC9B,MACF,IAAK,OACH,EAAiB,MAAM,OAAO,wBAC9B,MACF,IAAK,MACH,EAAiB,MAAM,OAAO,uBAC9B,MACF,IAAK,MACH,EAAiB,MAAM,OAAO,uBAC9B,MACF,IAAK,OACH,EAAiB,MAAM,OAAO,wBAC9B,MACF,IAAK,MACH,EAAiB,MAAM,OAAO,uBAC9B,MACF,IAAK,OACH,EAAiB,MAAM,OAAO,wBAC9B,MACF,QACE,EAAiB,MAAM,OAAO,8BAC9B,MAGJ,IAAM,EAAW,EAAe,QAEhC,OADA,EAAc,IAAI,EAAM,EAAS,CAC1B,GAIH,EAAY,KAAO,IAA0C,CACjE,GAAI,EAAW,IAAI,EAAU,CAAE,OAAO,EAAW,IAAI,EAAU,CAE/D,IAAI,EACJ,OAAQ,EAAR,CACE,IAAK,cACH,EAAc,MAAM,OAAO,gCAC3B,MAEF,QACE,EAAc,MAAM,OAAO,iCAC3B,MAGJ,IAAM,EAAQ,EAAY,QAE1B,OADA,EAAW,IAAI,EAAW,EAAM,CACzB,GAIT,IAAI,EAAmE,KAEvE,MAAM,EAAyB,UAC7B,AACE,IAAqB,OAAO,oBAAoB,MAC7C,CAAE,uBACD,EAAkB,CAChB,MAAO,EAAE,CACT,OAAQ,EAAE,CACX,CAAC,CACL,CAEI,GAIH,EAAgB,MACpB,EACA,EACA,IACoB,CACpB,IAAM,EAA0B,EAAa,cAAgB,eAGvD,CAAC,EAAa,EAAgB,GAAe,MAAM,QAAQ,IAAI,CACnE,GAAwB,CACxB,EAAa,EAAK,CAClB,EAAU,EAAU,CACrB,CAAC,CAUF,OAPK,EAAY,oBAAoB,CAAC,SAAS,EAAK,EAClD,MAAM,EAAY,aAAa,EAAe,CAE3C,EAAY,iBAAiB,CAAC,SAAS,EAAU,EACpD,MAAM,EAAY,UAAU,EAAY,CAGnC,EAAY,WAAW,EAAM,CAClC,OACA,MAAO,EACR,CAAC,EASS,GAA2C,CACtD,WACA,OACA,gBACI,CACJ,GAAM,CAAC,EAAM,GAAW,EAAwB,KAAK,CAmBrD,OAjBA,MAAgB,CACd,IAAI,EAAc,GAWlB,OATA,EAAc,EAAU,EAAM,EAAW,CACtC,KAAM,GAAW,CACX,GAAa,EAAQ,EAAO,EACjC,CACD,MAAO,GAAU,CAChB,QAAQ,MAAM,4BAA6B,EAAM,CAC7C,CAAC,GAAe,IAAS,MAAM,EAAQ,GAAG,EAC9C,KAES,CACX,EAAc,KAEf,CAAC,EAAU,EAAM,EAAW,CAAC,CAG9B,EAAC,MAAD,CAAK,UAAU,6OACZ,EAEC,EAAC,MAAD,CAAK,wBAAyB,CAAE,OAAQ,EAAM,CAAI,CAAA,CAElD,EAAC,EAAD,CAAc,WAAuB,CAAA,CAEnC,CAAA"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{cva as e}from"class-variance-authority";import{jsx as t}from"react/jsx-runtime";const n=(...e)=>e.filter(Boolean).join(` `),r=e([`w-full select-text resize-none text-base shadow-none outline-none`,`transition-all duration-300 md:text-sm`,`ring-0`,`disabled:opacity-50`,`rounded-xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-2xl`].join(` `),{variants:{variant:{default:[`text-text`,`bg-neutral-50 dark:bg-neutral-950`,`ring-text/20`,`disabled:ring-0`,`hover:ring-3`,`focus-within:ring-4`,`focus-visible:outline-none focus-visible:ring-4`,`[box-shadow:none] focus:[box-shadow:none]`,`aria-invalid:border-error`].join(` `),invisible:`border-none text-inherit outline-none ring-0`},size:{sm:`px-2 py-2 text-sm md:py-1.5 md:text-xs`,md:`px-2 py-3 md:py-2`,lg:`p-4`},validationStyleEnabled:{disabled:``,enabled:`valid:border-success invalid:border-error`}},defaultVariants:{variant:`default`,size:`md`,validationStyleEnabled:`disabled`}});let i=function(e){return e.DEFAULT=`default`,e.INVISIBLE=`invisible`,e}({}),a=function(e){return e.MD=`md`,e.LG=`lg`,e}({});const o=({validationStyleEnabled:e=!1,variant:i,size:a,className:o,...s})=>t(`input`,{className:n(r({variant:i,size:a,validationStyleEnabled:e?`enabled`:`disabled`}),o),...s});export{o as Input,a as InputSize,i as InputVariant,r as inputVariants};
|
|
1
|
+
import{cva as e}from"class-variance-authority";import{jsx as t}from"react/jsx-runtime";const n=(...e)=>e.filter(Boolean).join(` `),r=e([`w-full select-text resize-none text-base shadow-none outline-none`,`transition-all duration-300 md:text-sm`,`ring-0`,`disabled:opacity-50`,`rounded-xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-2xl`].join(` `),{variants:{variant:{default:[`text-text`,`bg-neutral-50 dark:bg-neutral-950`,`ring-text/20`,`disabled:ring-0`,`hover:ring-3`,`focus-within:ring-4`,`focus-visible:outline-none focus-visible:ring-4`,`[box-shadow:none] focus:[box-shadow:none]`,`aria-invalid:border-error`].join(` `),invisible:`border-none text-inherit outline-none ring-0`},size:{sm:`px-2 py-2 text-sm md:py-1.5 md:text-xs`,md:`px-2 py-3 md:py-2`,lg:`p-4`},validationStyleEnabled:{disabled:``,enabled:`valid:border-success invalid:border-error`}},defaultVariants:{variant:`default`,size:`md`,validationStyleEnabled:`disabled`}});let i=function(e){return e.DEFAULT=`default`,e.INVISIBLE=`invisible`,e}({}),a=function(e){return e.MD=`md`,e.LG=`lg`,e}({});const o=({validationStyleEnabled:e=!1,variant:i,size:a,className:o,...s})=>t(`input`,{className:n(r({variant:i,size:a,validationStyleEnabled:e?`enabled`:`disabled`}),o),suppressHydrationWarning:!0,...s});export{o as Input,a as InputSize,i as InputVariant,r as inputVariants};
|
|
2
2
|
//# sourceMappingURL=Input.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Input.mjs","names":[],"sources":["../../../../src/components/Input/Input.tsx"],"sourcesContent":["import { cva, type VariantProps } from 'class-variance-authority';\nimport type { DetailedHTMLProps, FC, InputHTMLAttributes } from 'react';\n\n// Optional: your own cn helper to merge class names\nconst cn = (...classes: (string | undefined | false | null)[]) =>\n classes.filter(Boolean).join(' ');\n\nexport const inputVariants = cva(\n [\n // base styles\n 'w-full select-text resize-none text-base shadow-none outline-none',\n 'transition-all duration-300 md:text-sm',\n 'ring-0',\n 'disabled:opacity-50',\n\n // Corner shape\n 'rounded-xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-2xl',\n ].join(' '),\n {\n variants: {\n variant: {\n default: [\n 'text-text',\n 'bg-neutral-50 dark:bg-neutral-950',\n 'ring-text/20',\n\n // Focus ring\n 'disabled:ring-0',\n 'hover:ring-3',\n 'focus-within:ring-4',\n 'focus-visible:outline-none focus-visible:ring-4',\n\n // Remove any weird box-shadow\n '[box-shadow:none] focus:[box-shadow:none]',\n\n // aria-invalid border color\n 'aria-invalid:border-error',\n ].join(' '),\n invisible: 'border-none text-inherit outline-none ring-0',\n },\n size: {\n sm: 'px-2 py-2 text-sm md:py-1.5 md:text-xs',\n md: 'px-2 py-3 md:py-2',\n lg: 'p-4',\n },\n validationStyleEnabled: {\n disabled: '',\n enabled: 'valid:border-success invalid:border-error',\n },\n },\n defaultVariants: {\n variant: 'default',\n size: 'md',\n validationStyleEnabled: 'disabled',\n },\n }\n);\n\nexport enum InputVariant {\n DEFAULT = 'default',\n INVISIBLE = 'invisible',\n}\n\nexport enum InputSize {\n MD = 'md',\n LG = 'lg',\n}\n\nexport type InputProps = Omit<\n DetailedHTMLProps<InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>,\n 'size'\n> & {\n validationStyleEnabled?: boolean;\n} & Omit<VariantProps<typeof inputVariants>, 'validationStyleEnabled'>;\n\nexport const Input: FC<InputProps> = ({\n validationStyleEnabled = false,\n variant,\n size,\n className,\n ...props\n}) => (\n <input\n className={cn(\n inputVariants({\n variant,\n size,\n validationStyleEnabled: validationStyleEnabled ? 'enabled' : 'disabled',\n }),\n className\n )}\n {...props}\n />\n);\n"],"mappings":"uFAIA,MAAM,GAAM,GAAG,IACb,EAAQ,OAAO,QAAQ,CAAC,KAAK,IAAI,CAEtB,EAAgB,EAC3B,CAEE,oEACA,yCACA,SACA,sBAGA,kFACD,CAAC,KAAK,IAAI,CACX,CACE,SAAU,CACR,QAAS,CACP,QAAS,CACP,YACA,oCACA,eAGA,kBACA,eACA,sBACA,kDAGA,4CAGA,4BACD,CAAC,KAAK,IAAI,CACX,UAAW,+CACZ,CACD,KAAM,CACJ,GAAI,yCACJ,GAAI,oBACJ,GAAI,MACL,CACD,uBAAwB,CACtB,SAAU,GACV,QAAS,4CACV,CACF,CACD,gBAAiB,CACf,QAAS,UACT,KAAM,KACN,uBAAwB,WACzB,CACF,CACF,CAED,IAAY,EAAL,SAAA,EAAA,OACL,GAAA,QAAA,UACA,EAAA,UAAA,kBACD,CAEW,EAAL,SAAA,EAAA,OACL,GAAA,GAAA,KACA,EAAA,GAAA,WACD,CASD,MAAa,GAAyB,CACpC,yBAAyB,GACzB,UACA,OACA,YACA,GAAG,KAEH,EAAC,QAAD,CACE,UAAW,EACT,EAAc,CACZ,UACA,OACA,uBAAwB,EAAyB,UAAY,WAC9D,CAAC,CACF,EACD,CACD,GAAI,EACJ,CAAA"}
|
|
1
|
+
{"version":3,"file":"Input.mjs","names":[],"sources":["../../../../src/components/Input/Input.tsx"],"sourcesContent":["import { cva, type VariantProps } from 'class-variance-authority';\nimport type { DetailedHTMLProps, FC, InputHTMLAttributes } from 'react';\n\n// Optional: your own cn helper to merge class names\nconst cn = (...classes: (string | undefined | false | null)[]) =>\n classes.filter(Boolean).join(' ');\n\nexport const inputVariants = cva(\n [\n // base styles\n 'w-full select-text resize-none text-base shadow-none outline-none',\n 'transition-all duration-300 md:text-sm',\n 'ring-0',\n 'disabled:opacity-50',\n\n // Corner shape\n 'rounded-xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-2xl',\n ].join(' '),\n {\n variants: {\n variant: {\n default: [\n 'text-text',\n 'bg-neutral-50 dark:bg-neutral-950',\n 'ring-text/20',\n\n // Focus ring\n 'disabled:ring-0',\n 'hover:ring-3',\n 'focus-within:ring-4',\n 'focus-visible:outline-none focus-visible:ring-4',\n\n // Remove any weird box-shadow\n '[box-shadow:none] focus:[box-shadow:none]',\n\n // aria-invalid border color\n 'aria-invalid:border-error',\n ].join(' '),\n invisible: 'border-none text-inherit outline-none ring-0',\n },\n size: {\n sm: 'px-2 py-2 text-sm md:py-1.5 md:text-xs',\n md: 'px-2 py-3 md:py-2',\n lg: 'p-4',\n },\n validationStyleEnabled: {\n disabled: '',\n enabled: 'valid:border-success invalid:border-error',\n },\n },\n defaultVariants: {\n variant: 'default',\n size: 'md',\n validationStyleEnabled: 'disabled',\n },\n }\n);\n\nexport enum InputVariant {\n DEFAULT = 'default',\n INVISIBLE = 'invisible',\n}\n\nexport enum InputSize {\n MD = 'md',\n LG = 'lg',\n}\n\nexport type InputProps = Omit<\n DetailedHTMLProps<InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>,\n 'size'\n> & {\n validationStyleEnabled?: boolean;\n} & Omit<VariantProps<typeof inputVariants>, 'validationStyleEnabled'>;\n\nexport const Input: FC<InputProps> = ({\n validationStyleEnabled = false,\n variant,\n size,\n className,\n ...props\n}) => (\n <input\n className={cn(\n inputVariants({\n variant,\n size,\n validationStyleEnabled: validationStyleEnabled ? 'enabled' : 'disabled',\n }),\n className\n )}\n suppressHydrationWarning\n {...props}\n />\n);\n"],"mappings":"uFAIA,MAAM,GAAM,GAAG,IACb,EAAQ,OAAO,QAAQ,CAAC,KAAK,IAAI,CAEtB,EAAgB,EAC3B,CAEE,oEACA,yCACA,SACA,sBAGA,kFACD,CAAC,KAAK,IAAI,CACX,CACE,SAAU,CACR,QAAS,CACP,QAAS,CACP,YACA,oCACA,eAGA,kBACA,eACA,sBACA,kDAGA,4CAGA,4BACD,CAAC,KAAK,IAAI,CACX,UAAW,+CACZ,CACD,KAAM,CACJ,GAAI,yCACJ,GAAI,oBACJ,GAAI,MACL,CACD,uBAAwB,CACtB,SAAU,GACV,QAAS,4CACV,CACF,CACD,gBAAiB,CACf,QAAS,UACT,KAAM,KACN,uBAAwB,WACzB,CACF,CACF,CAED,IAAY,EAAL,SAAA,EAAA,OACL,GAAA,QAAA,UACA,EAAA,UAAA,kBACD,CAEW,EAAL,SAAA,EAAA,OACL,GAAA,GAAA,KACA,EAAA,GAAA,WACD,CASD,MAAa,GAAyB,CACpC,yBAAyB,GACzB,UACA,OACA,YACA,GAAG,KAEH,EAAC,QAAD,CACE,UAAW,EACT,EAAc,CACZ,UACA,OACA,uBAAwB,EAAyB,UAAY,WAC9D,CAAC,CACF,EACD,CACD,yBAAA,GACA,GAAI,EACJ,CAAA"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{cn as e}from"../../utils/cn.mjs";import{jsx as t,jsxs as n}from"react/jsx-runtime";const r=({htmlFor:r,required:i=!1,disabled:a=!1,className:o,children:s,...c})=>n(`label`,{className:e(`select-none font-medium text-sm leading-none`,`peer-disabled:cursor-not-allowed peer-disabled:opacity-70`,a&&`cursor-not-allowed text-muted-foreground opacity-70`,o),htmlFor:r,...c,children:[s,i&&t(`span`,{className:`ml-1 text-destructive`,"aria-label":`required`,title:`This field is required`,children:`*`})]});export{r as Label};
|
|
1
|
+
import{cn as e}from"../../utils/cn.mjs";import{jsx as t,jsxs as n}from"react/jsx-runtime";const r=({htmlFor:r,required:i=!1,disabled:a=!1,className:o,children:s,...c})=>n(`label`,{className:e(`select-none font-medium text-sm leading-none`,`peer-disabled:cursor-not-allowed peer-disabled:opacity-70`,a&&`cursor-not-allowed text-muted-foreground opacity-70`,o),htmlFor:r,suppressHydrationWarning:!0,...c,children:[s,i&&t(`span`,{className:`ml-1 text-destructive`,"aria-label":`required`,title:`This field is required`,children:`*`})]});export{r as Label};
|
|
2
2
|
//# sourceMappingURL=index.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.mjs","names":[],"sources":["../../../../src/components/Label/index.tsx"],"sourcesContent":["import { cn } from '@utils/cn';\nimport type { FC, LabelHTMLAttributes } from 'react';\n\n/**\n * Props for the Label component\n */\nexport interface LabelProps extends LabelHTMLAttributes<HTMLLabelElement> {\n /**\n * The ID of the form control this label is associated with.\n * This creates the accessible relationship between the label and its control.\n * @example \"email-input\"\n * @example \"password-field\"\n */\n htmlFor?: string;\n\n /**\n * Whether the associated form control is required.\n * Adds visual indicator and updates ARIA attributes.\n * @default false\n */\n required?: boolean;\n\n /**\n * Whether the associated form control is disabled.\n * Updates styling to indicate disabled state.\n * @default false\n */\n disabled?: boolean;\n\n /**\n * Additional CSS classes for custom styling\n * @example \"text-red-600 font-bold\"\n */\n className?: string;\n}\n\n/**\n * Label Component\n *\n * A form label component that provides accessible labeling for form controls.\n * Establishes proper relationships between labels and their associated form elements\n * with visual indicators for required and disabled states.\n *\n * @example\n * ```tsx\n * // Basic usage\n * <Label htmlFor=\"email\">Email Address</Label>\n * <input id=\"email\" type=\"email\" />\n *\n * // Required field\n * <Label htmlFor=\"password\" required>Password</Label>\n * <input id=\"password\" type=\"password\" required />\n *\n * // Disabled field\n * <Label htmlFor=\"disabled-field\" disabled>Disabled Field</Label>\n * <input id=\"disabled-field\" type=\"text\" disabled />\n *\n * // With custom styling\n * <Label htmlFor=\"custom\" className=\"text-blue-600 font-semibold\">\n * Custom Styled Label\n * </Label>\n * ```\n *\n * @component\n * @accessibility\n * - Uses semantic HTML <label> element\n * - Properly associates with form controls via htmlFor/id relationship\n * - Supports click-to-focus behavior automatically\n * - Visual indicators for required and disabled states\n * - Screen reader compatible with proper ARIA relationships\n */\nexport const Label: FC<LabelProps> = ({\n htmlFor,\n required = false,\n disabled = false,\n className,\n children,\n ...props\n}) => (\n <label\n className={cn(\n 'select-none font-medium text-sm leading-none',\n 'peer-disabled:cursor-not-allowed peer-disabled:opacity-70',\n disabled && 'cursor-not-allowed text-muted-foreground opacity-70',\n className\n )}\n htmlFor={htmlFor}\n {...props}\n >\n {children}\n {required && (\n <span\n className=\"ml-1 text-destructive\"\n aria-label=\"required\"\n title=\"This field is required\"\n >\n *\n </span>\n )}\n </label>\n);\n"],"mappings":"0FAuEA,MAAa,GAAyB,CACpC,UACA,WAAW,GACX,WAAW,GACX,YACA,WACA,GAAG,KAEH,EAAC,QAAD,CACE,UAAW,EACT,+CACA,4DACA,GAAY,sDACZ,EACD,CACQ,UACT,GAAI,
|
|
1
|
+
{"version":3,"file":"index.mjs","names":[],"sources":["../../../../src/components/Label/index.tsx"],"sourcesContent":["import { cn } from '@utils/cn';\nimport type { FC, LabelHTMLAttributes } from 'react';\n\n/**\n * Props for the Label component\n */\nexport interface LabelProps extends LabelHTMLAttributes<HTMLLabelElement> {\n /**\n * The ID of the form control this label is associated with.\n * This creates the accessible relationship between the label and its control.\n * @example \"email-input\"\n * @example \"password-field\"\n */\n htmlFor?: string;\n\n /**\n * Whether the associated form control is required.\n * Adds visual indicator and updates ARIA attributes.\n * @default false\n */\n required?: boolean;\n\n /**\n * Whether the associated form control is disabled.\n * Updates styling to indicate disabled state.\n * @default false\n */\n disabled?: boolean;\n\n /**\n * Additional CSS classes for custom styling\n * @example \"text-red-600 font-bold\"\n */\n className?: string;\n}\n\n/**\n * Label Component\n *\n * A form label component that provides accessible labeling for form controls.\n * Establishes proper relationships between labels and their associated form elements\n * with visual indicators for required and disabled states.\n *\n * @example\n * ```tsx\n * // Basic usage\n * <Label htmlFor=\"email\">Email Address</Label>\n * <input id=\"email\" type=\"email\" />\n *\n * // Required field\n * <Label htmlFor=\"password\" required>Password</Label>\n * <input id=\"password\" type=\"password\" required />\n *\n * // Disabled field\n * <Label htmlFor=\"disabled-field\" disabled>Disabled Field</Label>\n * <input id=\"disabled-field\" type=\"text\" disabled />\n *\n * // With custom styling\n * <Label htmlFor=\"custom\" className=\"text-blue-600 font-semibold\">\n * Custom Styled Label\n * </Label>\n * ```\n *\n * @component\n * @accessibility\n * - Uses semantic HTML <label> element\n * - Properly associates with form controls via htmlFor/id relationship\n * - Supports click-to-focus behavior automatically\n * - Visual indicators for required and disabled states\n * - Screen reader compatible with proper ARIA relationships\n */\nexport const Label: FC<LabelProps> = ({\n htmlFor,\n required = false,\n disabled = false,\n className,\n children,\n ...props\n}) => (\n <label\n className={cn(\n 'select-none font-medium text-sm leading-none',\n 'peer-disabled:cursor-not-allowed peer-disabled:opacity-70',\n disabled && 'cursor-not-allowed text-muted-foreground opacity-70',\n className\n )}\n htmlFor={htmlFor}\n suppressHydrationWarning\n {...props}\n >\n {children}\n {required && (\n <span\n className=\"ml-1 text-destructive\"\n aria-label=\"required\"\n title=\"This field is required\"\n >\n *\n </span>\n )}\n </label>\n);\n"],"mappings":"0FAuEA,MAAa,GAAyB,CACpC,UACA,WAAW,GACX,WAAW,GACX,YACA,WACA,GAAG,KAEH,EAAC,QAAD,CACE,UAAW,EACT,+CACA,4DACA,GAAY,sDACZ,EACD,CACQ,UACT,yBAAA,GACA,GAAI,WATN,CAWG,EACA,GACC,EAAC,OAAD,CACE,UAAU,wBACV,aAAW,WACX,MAAM,kCACP,IAEM,CAAA,CAEH"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{cn as e}from"../../utils/cn.mjs";import{ExternalLink as t,MoveRight as n}from"lucide-react";import{isValidElement as r}from"react";import{cva as i}from"class-variance-authority";import{jsx as a,jsxs as o}from"react/jsx-runtime";import{getLocalizedUrl as s}from"@intlayer/core/localization";let c=function(e){return e.DEFAULT=`default`,e.INVISIBLE_LINK=`invisible-link`,e.BUTTON=`button`,e.BUTTON_OUTLINED=`button-outlined`,e.HOVERABLE=`hoverable`,e}({}),l=function(e){return e.PRIMARY=`primary`,e.SECONDARY=`secondary`,e.DESTRUCTIVE=`destructive`,e.NEUTRAL=`neutral`,e.LIGHT=`light`,e.DARK=`dark`,e.TEXT=`text`,e.TEXT_INVERSE=`text-inverse`,e.ERROR=`error`,e.SUCCESS=`success`,e.CUSTOM=`custom`,e}({}),u=function(e){return e.NONE=`none`,e.SM=`sm`,e.MD=`md`,e.LG=`lg`,e.XL=`xl`,e.TWO_XL=`2xl`,e.THREE_XL=`3xl`,e.FULL=`full`,e}({}),d=function(e){return e.SM=`sm`,e.MD=`md`,e.LG=`lg`,e.XL=`xl`,e.CUSTOM=`custom`,e}({}),f=function(e){return e.DEFAULT=`default`,e.TRUE=`true`,e.FALSE=`false`,e}({});const p=i(`gap-3 transition-all duration-300 focus-visible:outline-none disabled:pointer-events-none disabled:opacity-50`,{variants:{variant:{[`${c.DEFAULT}`]:`h-auto justify-start border-inherit bg-current/0 px-1 font-medium decoration-[1.5] underline-offset-5 hover:bg-current/0 hover:text-current/80 hover:underline hover:underline-offset-6`,[`${c.INVISIBLE_LINK}`]:`h-auto justify-start border-inherit bg-current/0 px-1 underline-offset-5 hover:bg-current/0`,[`${c.BUTTON}`]:`relative flex cursor-pointer flex-row items-center justify-center gap-2 rounded-full bg-current text-center font-medium text-text ring-0 *:text-text-opposite hover:bg-current/90 hover:ring-5 aria-selected:ring-5`,[`${c.BUTTON_OUTLINED}`]:`relative flex cursor-pointer flex-row items-center justify-center gap-2 rounded-full border-[1.3px] border-current text-center font-medium text-text ring-0 *:text-text hover:bg-current/20 hover:ring-5 aria-selected:ring-5`,[`${c.HOVERABLE}`]:`block rounded-lg border-none bg-current/0 hover:bg-current/10 aria-[current]:bg-current/5`},roundedSize:{[`${u.NONE}`]:`rounded-none`,[`${u.SM}`]:`rounded-lg [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-xl`,[`${u.MD}`]:`rounded-xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-2xl`,[`${u.LG}`]:`rounded-2xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-3xl`,[`${u.XL}`]:`rounded-3xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-4xl`,[`${u.TWO_XL}`]:`rounded-4xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-[2.5rem]`,[`${u.THREE_XL}`]:`rounded-[2.5rem] [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-[3rem]`,[`${u.FULL}`]:`rounded-full`},color:{[`${l.PRIMARY}`]:`text-primary`,[`${l.SECONDARY}`]:`text-secondary`,[`${l.DESTRUCTIVE}`]:`text-destructive`,[`${l.NEUTRAL}`]:`text-neutral`,[`${l.LIGHT}`]:`text-white`,[`${l.DARK}`]:`text-neutral-800`,[`${l.TEXT}`]:`text-text`,[`${l.TEXT_INVERSE}`]:`text-text-opposite`,[`${l.ERROR}`]:`text-error`,[`${l.SUCCESS}`]:`text-success`,[`${l.CUSTOM}`]:``},size:{[`${d.SM}`]:`text-sm`,[`${d.MD}`]:`text-base`,[`${d.LG}`]:`text-lg`,[`${d.XL}`]:`text-xl`,[`${d.CUSTOM}`]:``},underlined:{[f.DEFAULT]:``,[f.TRUE]:`underline`,[f.FALSE]:`no-underline`}},compoundVariants:[{variant:c.BUTTON,color:l.TEXT_INVERSE,class:`*:text-text`},{variant:c.BUTTON_OUTLINED,color:l.TEXT_INVERSE,class:`text-text-opposite *:text-text-opposite`},{variant:[c.BUTTON,c.BUTTON_OUTLINED],size:d.SM,class:`min-h-7 px-3 max-md:py-1`},{variant:[c.BUTTON,c.BUTTON_OUTLINED],size:d.MD,class:`min-h-8 px-6 max-md:py-2`},{variant:[c.BUTTON,c.BUTTON_OUTLINED],size:d.LG,class:`min-h-10 px-8 max-md:py-3`},{variant:[c.BUTTON,c.BUTTON_OUTLINED],size:d.XL,class:`min-h-11 px-10 max-md:py-4`},{variant:[c.BUTTON,c.BUTTON_OUTLINED],color:l.PRIMARY,class:`ring-primary/20`},{variant:[c.BUTTON,c.BUTTON_OUTLINED],color:l.SECONDARY,class:`ring-secondary/20`},{variant:[c.BUTTON,c.BUTTON_OUTLINED],color:l.DESTRUCTIVE,class:`ring-destructive/20`},{variant:[c.BUTTON,c.BUTTON_OUTLINED],color:l.NEUTRAL,class:`ring-neutral/20`},{variant:[c.BUTTON,c.BUTTON_OUTLINED],color:l.LIGHT,class:`ring-white/20`},{variant:[c.BUTTON,c.BUTTON_OUTLINED],color:l.DARK,class:`ring-neutral-800/20`},{variant:[c.BUTTON,c.BUTTON_OUTLINED],color:l.TEXT,class:`ring-text/20`},{variant:[c.BUTTON,c.BUTTON_OUTLINED],color:l.TEXT_INVERSE,class:`ring-text-opposite/20`},{variant:[c.BUTTON,c.BUTTON_OUTLINED],color:l.ERROR,class:`ring-error/20`},{variant:[c.BUTTON,c.BUTTON_OUTLINED],color:l.SUCCESS,class:`ring-success/20`}],defaultVariants:{variant:c.DEFAULT,roundedSize:u.MD,underlined:f.DEFAULT,size:d.MD}}),m=({href:e,isExternalLink:t})=>{let n=typeof e==`string`&&e.trim()!==``;return t===!0||t===void 0&&n&&/^https?:\/\//.test(e)},h=e=>typeof e==`string`||typeof e==`number`?!0:Array.isArray(e)?e.every(h):r(e)?h(e.props.children):!1,g=r=>{let{variant:i=c.DEFAULT,color:u=l.CUSTOM,roundedSize:d,children:f,label:g,className:_,isActive:v,underlined:y,locale:b,size:x,isExternalLink:S,isPageSection:C,href:w,...T}=r,E=S??m(r),D=C??w?.startsWith(`#`)??!1,O=h(f),k=i===c.BUTTON||i===c.BUTTON_OUTLINED,A=E?`noopener noreferrer nofollow`:void 0,j=E?`_blank`:`_self`;return o(`a`,{href:b&&w&&!E&&!D?s(w,b):w,"aria-label":g,rel:A,target:j,"aria-current":v?`page`:void 0,className:e(p({variant:i,color:u,roundedSize:d,underlined:y,size:x,className:_})),...T,children:[k&&O?a(`span`,{children:f}):f,E&&O&&a(t,{className:`ml-2 inline-block size-4`}),D&&a(n,{className:`ml-2 inline-block size-4`})]})};export{g as Link,l as LinkColor,u as LinkRoundedSize,d as LinkSize,f as LinkUnderlined,c as LinkVariant,m as checkIsExternalLink,h as isTextChildren,p as linkVariants};
|
|
1
|
+
import{cn as e}from"../../utils/cn.mjs";import{ExternalLink as t,MoveRight as n}from"lucide-react";import{isValidElement as r}from"react";import{cva as i}from"class-variance-authority";import{jsx as a,jsxs as o}from"react/jsx-runtime";import{getLocalizedUrl as s}from"@intlayer/core/localization";let c=function(e){return e.DEFAULT=`default`,e.INVISIBLE_LINK=`invisible-link`,e.BUTTON=`button`,e.BUTTON_OUTLINED=`button-outlined`,e.HOVERABLE=`hoverable`,e}({}),l=function(e){return e.PRIMARY=`primary`,e.SECONDARY=`secondary`,e.DESTRUCTIVE=`destructive`,e.NEUTRAL=`neutral`,e.LIGHT=`light`,e.DARK=`dark`,e.TEXT=`text`,e.TEXT_INVERSE=`text-inverse`,e.ERROR=`error`,e.SUCCESS=`success`,e.CUSTOM=`custom`,e}({}),u=function(e){return e.NONE=`none`,e.SM=`sm`,e.MD=`md`,e.LG=`lg`,e.XL=`xl`,e.TWO_XL=`2xl`,e.THREE_XL=`3xl`,e.FULL=`full`,e}({}),d=function(e){return e.SM=`sm`,e.MD=`md`,e.LG=`lg`,e.XL=`xl`,e.CUSTOM=`custom`,e}({}),f=function(e){return e.DEFAULT=`default`,e.TRUE=`true`,e.FALSE=`false`,e}({});const p=i(`gap-3 transition-all duration-300 focus-visible:outline-none disabled:pointer-events-none disabled:opacity-50`,{variants:{variant:{[`${c.DEFAULT}`]:`h-auto justify-start border-inherit bg-current/0 px-1 font-medium decoration-[1.5] underline-offset-5 hover:bg-current/0 hover:text-current/80 hover:underline hover:underline-offset-6`,[`${c.INVISIBLE_LINK}`]:`h-auto justify-start border-inherit bg-current/0 px-1 underline-offset-5 hover:bg-current/0`,[`${c.BUTTON}`]:`relative flex cursor-pointer flex-row items-center justify-center gap-2 rounded-full bg-current text-center font-medium text-text ring-0 *:text-text-opposite hover:bg-current/90 hover:ring-5 aria-selected:ring-5`,[`${c.BUTTON_OUTLINED}`]:`relative flex cursor-pointer flex-row items-center justify-center gap-2 rounded-full border-[1.3px] border-current text-center font-medium text-text ring-0 *:text-text hover:bg-current/20 hover:ring-5 aria-selected:ring-5`,[`${c.HOVERABLE}`]:`block rounded-lg border-none bg-current/0 hover:bg-current/10 aria-[current]:bg-current/5`},roundedSize:{[`${u.NONE}`]:`rounded-none`,[`${u.SM}`]:`rounded-lg [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-xl`,[`${u.MD}`]:`rounded-xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-2xl`,[`${u.LG}`]:`rounded-2xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-3xl`,[`${u.XL}`]:`rounded-3xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-4xl`,[`${u.TWO_XL}`]:`rounded-4xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-[2.5rem]`,[`${u.THREE_XL}`]:`rounded-[2.5rem] [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-[3rem]`,[`${u.FULL}`]:`rounded-full`},color:{[`${l.PRIMARY}`]:`text-primary`,[`${l.SECONDARY}`]:`text-secondary`,[`${l.DESTRUCTIVE}`]:`text-destructive`,[`${l.NEUTRAL}`]:`text-neutral`,[`${l.LIGHT}`]:`text-white`,[`${l.DARK}`]:`text-neutral-800`,[`${l.TEXT}`]:`text-text`,[`${l.TEXT_INVERSE}`]:`text-text-opposite`,[`${l.ERROR}`]:`text-error`,[`${l.SUCCESS}`]:`text-success`,[`${l.CUSTOM}`]:``},size:{[`${d.SM}`]:`text-sm`,[`${d.MD}`]:`text-base`,[`${d.LG}`]:`text-lg`,[`${d.XL}`]:`text-xl`,[`${d.CUSTOM}`]:``},underlined:{[f.DEFAULT]:``,[f.TRUE]:`underline`,[f.FALSE]:`no-underline`}},compoundVariants:[{variant:c.BUTTON,color:l.TEXT_INVERSE,class:`*:text-text`},{variant:c.BUTTON_OUTLINED,color:l.TEXT_INVERSE,class:`text-text-opposite *:text-text-opposite`},{variant:[c.BUTTON,c.BUTTON_OUTLINED],size:d.SM,class:`min-h-7 px-3 max-md:py-1`},{variant:[c.BUTTON,c.BUTTON_OUTLINED],size:d.MD,class:`min-h-8 px-6 max-md:py-2`},{variant:[c.BUTTON,c.BUTTON_OUTLINED],size:d.LG,class:`min-h-10 px-8 max-md:py-3`},{variant:[c.BUTTON,c.BUTTON_OUTLINED],size:d.XL,class:`min-h-11 px-10 max-md:py-4`},{variant:[c.BUTTON,c.BUTTON_OUTLINED],color:l.PRIMARY,class:`ring-primary/20`},{variant:[c.BUTTON,c.BUTTON_OUTLINED],color:l.SECONDARY,class:`ring-secondary/20`},{variant:[c.BUTTON,c.BUTTON_OUTLINED],color:l.DESTRUCTIVE,class:`ring-destructive/20`},{variant:[c.BUTTON,c.BUTTON_OUTLINED],color:l.NEUTRAL,class:`ring-neutral/20`},{variant:[c.BUTTON,c.BUTTON_OUTLINED],color:l.LIGHT,class:`ring-white/20`},{variant:[c.BUTTON,c.BUTTON_OUTLINED],color:l.DARK,class:`ring-neutral-800/20`},{variant:[c.BUTTON,c.BUTTON_OUTLINED],color:l.TEXT,class:`ring-text/20`},{variant:[c.BUTTON,c.BUTTON_OUTLINED],color:l.TEXT_INVERSE,class:`ring-text-opposite/20`},{variant:[c.BUTTON,c.BUTTON_OUTLINED],color:l.ERROR,class:`ring-error/20`},{variant:[c.BUTTON,c.BUTTON_OUTLINED],color:l.SUCCESS,class:`ring-success/20`}],defaultVariants:{variant:c.DEFAULT,roundedSize:u.MD,underlined:f.DEFAULT,size:d.MD}}),m=({href:e,isExternalLink:t})=>{let n=typeof e==`string`&&e.trim()!==``;return t===!0||t===void 0&&n&&/^https?:\/\//.test(e)},h=e=>typeof e==`string`||typeof e==`number`?!0:Array.isArray(e)?e.every(h):r(e)?h(e.props.children):!1,g=r=>{let{variant:i=c.DEFAULT,color:u=l.CUSTOM,roundedSize:d,children:f,label:g,className:_,isActive:v,underlined:y,locale:b,size:x,isExternalLink:S,isPageSection:C,href:w,...T}=r,E=S??m(r),D=C??w?.startsWith(`#`)??!1,O=h(f),k=i===c.BUTTON||i===c.BUTTON_OUTLINED,A=E?`noopener noreferrer nofollow`:void 0,j=E?`_blank`:`_self`;return o(`a`,{href:b&&w&&!E&&!D?s(w,b):w,"aria-label":g,rel:A,target:j,"aria-current":v?`page`:void 0,suppressHydrationWarning:!0,className:e(p({variant:i,color:u,roundedSize:d,underlined:y,size:x,className:_})),...T,children:[k&&O?a(`span`,{children:f}):f,E&&O&&a(t,{className:`ml-2 inline-block size-4`}),D&&a(n,{className:`ml-2 inline-block size-4`})]})};export{g as Link,l as LinkColor,u as LinkRoundedSize,d as LinkSize,f as LinkUnderlined,c as LinkVariant,m as checkIsExternalLink,h as isTextChildren,p as linkVariants};
|
|
2
2
|
//# sourceMappingURL=Link.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Link.mjs","names":[],"sources":["../../../../src/components/Link/Link.tsx"],"sourcesContent":["import { getLocalizedUrl } from '@intlayer/core/localization';\nimport type { LocalesValues } from '@intlayer/types';\nimport { cn } from '@utils/cn';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { ExternalLink, MoveRight } from 'lucide-react';\nimport {\n type AnchorHTMLAttributes,\n type DetailedHTMLProps,\n type FC,\n isValidElement,\n type ReactNode,\n} from 'react';\n\n/**\n * Visual style variants for Link component\n */\nexport enum LinkVariant {\n DEFAULT = 'default',\n INVISIBLE_LINK = 'invisible-link',\n BUTTON = 'button',\n BUTTON_OUTLINED = 'button-outlined',\n HOVERABLE = 'hoverable',\n}\n\n/**\n * Color theme variants for Link component\n */\nexport enum LinkColor {\n PRIMARY = 'primary',\n SECONDARY = 'secondary',\n DESTRUCTIVE = 'destructive',\n NEUTRAL = 'neutral',\n LIGHT = 'light',\n DARK = 'dark',\n TEXT = 'text',\n TEXT_INVERSE = 'text-inverse',\n ERROR = 'error',\n SUCCESS = 'success',\n CUSTOM = 'custom',\n}\n\nexport enum LinkRoundedSize {\n NONE = 'none',\n SM = 'sm',\n MD = 'md',\n LG = 'lg',\n XL = 'xl',\n TWO_XL = '2xl',\n THREE_XL = '3xl',\n FULL = 'full',\n}\n\nexport enum LinkSize {\n SM = 'sm',\n MD = 'md',\n LG = 'lg',\n XL = 'xl',\n CUSTOM = 'custom',\n}\n\nexport enum LinkUnderlined {\n DEFAULT = 'default',\n TRUE = 'true',\n FALSE = 'false',\n}\n\nexport const linkVariants = cva(\n 'gap-3 transition-all duration-300 focus-visible:outline-none disabled:pointer-events-none disabled:opacity-50',\n {\n variants: {\n variant: {\n [`${LinkVariant.DEFAULT}`]:\n 'h-auto justify-start border-inherit bg-current/0 px-1 font-medium decoration-[1.5] underline-offset-5 hover:bg-current/0 hover:text-current/80 hover:underline hover:underline-offset-6',\n [`${LinkVariant.INVISIBLE_LINK}`]:\n 'h-auto justify-start border-inherit bg-current/0 px-1 underline-offset-5 hover:bg-current/0',\n\n [`${LinkVariant.BUTTON}`]:\n 'relative flex cursor-pointer flex-row items-center justify-center gap-2 rounded-full bg-current text-center font-medium text-text ring-0 *:text-text-opposite hover:bg-current/90 hover:ring-5 aria-selected:ring-5',\n\n [`${LinkVariant.BUTTON_OUTLINED}`]:\n 'relative flex cursor-pointer flex-row items-center justify-center gap-2 rounded-full border-[1.3px] border-current text-center font-medium text-text ring-0 *:text-text hover:bg-current/20 hover:ring-5 aria-selected:ring-5',\n\n [`${LinkVariant.HOVERABLE}`]:\n 'block rounded-lg border-none bg-current/0 hover:bg-current/10 aria-[current]:bg-current/5',\n },\n roundedSize: {\n [`${LinkRoundedSize.NONE}`]: 'rounded-none',\n [`${LinkRoundedSize.SM}`]:\n 'rounded-lg [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-xl',\n [`${LinkRoundedSize.MD}`]:\n 'rounded-xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-2xl',\n [`${LinkRoundedSize.LG}`]:\n 'rounded-2xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-3xl',\n [`${LinkRoundedSize.XL}`]:\n 'rounded-3xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-4xl',\n [`${LinkRoundedSize.TWO_XL}`]:\n 'rounded-4xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-[2.5rem]',\n [`${LinkRoundedSize.THREE_XL}`]:\n 'rounded-[2.5rem] [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-[3rem]',\n [`${LinkRoundedSize.FULL}`]: 'rounded-full',\n },\n color: {\n [`${LinkColor.PRIMARY}`]: 'text-primary',\n [`${LinkColor.SECONDARY}`]: 'text-secondary',\n [`${LinkColor.DESTRUCTIVE}`]: 'text-destructive',\n [`${LinkColor.NEUTRAL}`]: 'text-neutral',\n [`${LinkColor.LIGHT}`]: 'text-white',\n [`${LinkColor.DARK}`]: 'text-neutral-800',\n [`${LinkColor.TEXT}`]: 'text-text',\n [`${LinkColor.TEXT_INVERSE}`]: 'text-text-opposite',\n [`${LinkColor.ERROR}`]: 'text-error',\n [`${LinkColor.SUCCESS}`]: 'text-success',\n [`${LinkColor.CUSTOM}`]: '',\n },\n size: {\n [`${LinkSize.SM}`]: 'text-sm',\n [`${LinkSize.MD}`]: 'text-base',\n [`${LinkSize.LG}`]: 'text-lg',\n [`${LinkSize.XL}`]: 'text-xl',\n [`${LinkSize.CUSTOM}`]: '',\n },\n underlined: {\n [LinkUnderlined.DEFAULT]: '',\n [LinkUnderlined.TRUE]: 'underline',\n [LinkUnderlined.FALSE]: 'no-underline',\n },\n },\n // Compound variants handle height and padding\n compoundVariants: [\n // ---------------------------------------------------------\n // FIX START: Correctly Handle Contrast for TEXT_INVERSE\n // ---------------------------------------------------------\n {\n // Filled Button + Inverse Color (e.g., White Button):\n // We DO NOT override parent text color (it must remain 'text-opposite' so bg-current is white).\n // We ONLY override children to be 'text-text' (Dark) so they show up on white.\n variant: LinkVariant.BUTTON,\n color: LinkColor.TEXT_INVERSE,\n class: '*:text-text',\n },\n {\n // Outlined Button + Inverse Color (e.g., White Border):\n // Parent is 'text-opposite' (Border is white).\n // Children must also be 'text-opposite' (White text) to show on dark background.\n variant: LinkVariant.BUTTON_OUTLINED,\n color: LinkColor.TEXT_INVERSE,\n class: 'text-text-opposite *:text-text-opposite',\n },\n\n // Min height and padding for button variants\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n size: LinkSize.SM,\n class: 'min-h-7 px-3 max-md:py-1',\n },\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n size: LinkSize.MD,\n class: 'min-h-8 px-6 max-md:py-2',\n },\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n size: LinkSize.LG,\n class: 'min-h-10 px-8 max-md:py-3',\n },\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n size: LinkSize.XL,\n class: 'min-h-11 px-10 max-md:py-4',\n },\n // Ring color variants\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n color: LinkColor.PRIMARY,\n class: 'ring-primary/20',\n },\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n color: LinkColor.SECONDARY,\n class: 'ring-secondary/20',\n },\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n color: LinkColor.DESTRUCTIVE,\n class: 'ring-destructive/20',\n },\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n color: LinkColor.NEUTRAL,\n class: 'ring-neutral/20',\n },\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n color: LinkColor.LIGHT,\n class: 'ring-white/20',\n },\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n color: LinkColor.DARK,\n class: 'ring-neutral-800/20',\n },\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n color: LinkColor.TEXT,\n class: 'ring-text/20',\n },\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n color: LinkColor.TEXT_INVERSE,\n class: 'ring-text-opposite/20',\n },\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n color: LinkColor.ERROR,\n class: 'ring-error/20',\n },\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n color: LinkColor.SUCCESS,\n class: 'ring-success/20',\n },\n ],\n\n defaultVariants: {\n variant: LinkVariant.DEFAULT,\n roundedSize: LinkRoundedSize.MD,\n underlined: LinkUnderlined.DEFAULT,\n size: LinkSize.MD,\n },\n }\n);\n\nexport type LinkProps = DetailedHTMLProps<\n AnchorHTMLAttributes<HTMLAnchorElement>,\n HTMLAnchorElement\n> &\n VariantProps<typeof linkVariants> & {\n label: string;\n isExternalLink?: boolean;\n isPageSection?: boolean;\n isActive?: boolean;\n locale?: LocalesValues;\n };\n\nexport const checkIsExternalLink = ({\n href,\n isExternalLink: isExternalLinkProp,\n}: LinkProps): boolean => {\n const isValidHref = typeof href === 'string' && href.trim() !== '';\n const isExternalLink =\n isExternalLinkProp === true ||\n (typeof isExternalLinkProp === 'undefined' &&\n isValidHref &&\n /^https?:\\/\\//.test(href));\n\n return isExternalLink;\n};\n\nexport const isTextChildren = (children: ReactNode): boolean => {\n if (typeof children === 'string' || typeof children === 'number') {\n return true;\n }\n if (Array.isArray(children)) {\n return children.every(isTextChildren);\n }\n if (isValidElement(children)) {\n return isTextChildren(\n (children.props as { children?: ReactNode }).children\n );\n }\n return false;\n};\n\nexport const Link: FC<LinkProps> = (props) => {\n const {\n variant = LinkVariant.DEFAULT,\n color = LinkColor.CUSTOM,\n roundedSize,\n children,\n label,\n className,\n isActive,\n underlined,\n locale,\n size,\n isExternalLink: isExternalLinkProp,\n isPageSection: isPageSectionProp,\n href: hrefProp,\n ...otherProps\n } = props;\n\n const isExternalLink = isExternalLinkProp ?? checkIsExternalLink(props);\n const isPageSection = isPageSectionProp ?? hrefProp?.startsWith('#') ?? false;\n\n const isChildrenString = isTextChildren(children);\n const isButton =\n variant === LinkVariant.BUTTON || variant === LinkVariant.BUTTON_OUTLINED;\n\n const rel = isExternalLink ? 'noopener noreferrer nofollow' : undefined;\n\n const target = isExternalLink ? '_blank' : '_self';\n\n const href =\n locale && hrefProp && !isExternalLink && !isPageSection\n ? getLocalizedUrl(hrefProp, locale)\n : hrefProp;\n\n return (\n <a\n href={href}\n aria-label={label}\n rel={rel}\n target={target}\n aria-current={isActive ? 'page' : undefined}\n className={cn(\n linkVariants({\n variant,\n color,\n roundedSize,\n underlined,\n size,\n className,\n })\n )}\n {...otherProps}\n >\n {isButton && isChildrenString ? <span>{children}</span> : children}\n\n {isExternalLink && isChildrenString && (\n <ExternalLink className=\"ml-2 inline-block size-4\" />\n )}\n {isPageSection && <MoveRight className=\"ml-2 inline-block size-4\" />}\n </a>\n );\n};\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Link.mjs","names":[],"sources":["../../../../src/components/Link/Link.tsx"],"sourcesContent":["import { getLocalizedUrl } from '@intlayer/core/localization';\nimport type { LocalesValues } from '@intlayer/types';\nimport { cn } from '@utils/cn';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { ExternalLink, MoveRight } from 'lucide-react';\nimport {\n type AnchorHTMLAttributes,\n type DetailedHTMLProps,\n type FC,\n isValidElement,\n type ReactNode,\n} from 'react';\n\n/**\n * Visual style variants for Link component\n */\nexport enum LinkVariant {\n DEFAULT = 'default',\n INVISIBLE_LINK = 'invisible-link',\n BUTTON = 'button',\n BUTTON_OUTLINED = 'button-outlined',\n HOVERABLE = 'hoverable',\n}\n\n/**\n * Color theme variants for Link component\n */\nexport enum LinkColor {\n PRIMARY = 'primary',\n SECONDARY = 'secondary',\n DESTRUCTIVE = 'destructive',\n NEUTRAL = 'neutral',\n LIGHT = 'light',\n DARK = 'dark',\n TEXT = 'text',\n TEXT_INVERSE = 'text-inverse',\n ERROR = 'error',\n SUCCESS = 'success',\n CUSTOM = 'custom',\n}\n\nexport enum LinkRoundedSize {\n NONE = 'none',\n SM = 'sm',\n MD = 'md',\n LG = 'lg',\n XL = 'xl',\n TWO_XL = '2xl',\n THREE_XL = '3xl',\n FULL = 'full',\n}\n\nexport enum LinkSize {\n SM = 'sm',\n MD = 'md',\n LG = 'lg',\n XL = 'xl',\n CUSTOM = 'custom',\n}\n\nexport enum LinkUnderlined {\n DEFAULT = 'default',\n TRUE = 'true',\n FALSE = 'false',\n}\n\nexport const linkVariants = cva(\n 'gap-3 transition-all duration-300 focus-visible:outline-none disabled:pointer-events-none disabled:opacity-50',\n {\n variants: {\n variant: {\n [`${LinkVariant.DEFAULT}`]:\n 'h-auto justify-start border-inherit bg-current/0 px-1 font-medium decoration-[1.5] underline-offset-5 hover:bg-current/0 hover:text-current/80 hover:underline hover:underline-offset-6',\n [`${LinkVariant.INVISIBLE_LINK}`]:\n 'h-auto justify-start border-inherit bg-current/0 px-1 underline-offset-5 hover:bg-current/0',\n\n [`${LinkVariant.BUTTON}`]:\n 'relative flex cursor-pointer flex-row items-center justify-center gap-2 rounded-full bg-current text-center font-medium text-text ring-0 *:text-text-opposite hover:bg-current/90 hover:ring-5 aria-selected:ring-5',\n\n [`${LinkVariant.BUTTON_OUTLINED}`]:\n 'relative flex cursor-pointer flex-row items-center justify-center gap-2 rounded-full border-[1.3px] border-current text-center font-medium text-text ring-0 *:text-text hover:bg-current/20 hover:ring-5 aria-selected:ring-5',\n\n [`${LinkVariant.HOVERABLE}`]:\n 'block rounded-lg border-none bg-current/0 hover:bg-current/10 aria-[current]:bg-current/5',\n },\n roundedSize: {\n [`${LinkRoundedSize.NONE}`]: 'rounded-none',\n [`${LinkRoundedSize.SM}`]:\n 'rounded-lg [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-xl',\n [`${LinkRoundedSize.MD}`]:\n 'rounded-xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-2xl',\n [`${LinkRoundedSize.LG}`]:\n 'rounded-2xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-3xl',\n [`${LinkRoundedSize.XL}`]:\n 'rounded-3xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-4xl',\n [`${LinkRoundedSize.TWO_XL}`]:\n 'rounded-4xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-[2.5rem]',\n [`${LinkRoundedSize.THREE_XL}`]:\n 'rounded-[2.5rem] [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-[3rem]',\n [`${LinkRoundedSize.FULL}`]: 'rounded-full',\n },\n color: {\n [`${LinkColor.PRIMARY}`]: 'text-primary',\n [`${LinkColor.SECONDARY}`]: 'text-secondary',\n [`${LinkColor.DESTRUCTIVE}`]: 'text-destructive',\n [`${LinkColor.NEUTRAL}`]: 'text-neutral',\n [`${LinkColor.LIGHT}`]: 'text-white',\n [`${LinkColor.DARK}`]: 'text-neutral-800',\n [`${LinkColor.TEXT}`]: 'text-text',\n [`${LinkColor.TEXT_INVERSE}`]: 'text-text-opposite',\n [`${LinkColor.ERROR}`]: 'text-error',\n [`${LinkColor.SUCCESS}`]: 'text-success',\n [`${LinkColor.CUSTOM}`]: '',\n },\n size: {\n [`${LinkSize.SM}`]: 'text-sm',\n [`${LinkSize.MD}`]: 'text-base',\n [`${LinkSize.LG}`]: 'text-lg',\n [`${LinkSize.XL}`]: 'text-xl',\n [`${LinkSize.CUSTOM}`]: '',\n },\n underlined: {\n [LinkUnderlined.DEFAULT]: '',\n [LinkUnderlined.TRUE]: 'underline',\n [LinkUnderlined.FALSE]: 'no-underline',\n },\n },\n // Compound variants handle height and padding\n compoundVariants: [\n // ---------------------------------------------------------\n // FIX START: Correctly Handle Contrast for TEXT_INVERSE\n // ---------------------------------------------------------\n {\n // Filled Button + Inverse Color (e.g., White Button):\n // We DO NOT override parent text color (it must remain 'text-opposite' so bg-current is white).\n // We ONLY override children to be 'text-text' (Dark) so they show up on white.\n variant: LinkVariant.BUTTON,\n color: LinkColor.TEXT_INVERSE,\n class: '*:text-text',\n },\n {\n // Outlined Button + Inverse Color (e.g., White Border):\n // Parent is 'text-opposite' (Border is white).\n // Children must also be 'text-opposite' (White text) to show on dark background.\n variant: LinkVariant.BUTTON_OUTLINED,\n color: LinkColor.TEXT_INVERSE,\n class: 'text-text-opposite *:text-text-opposite',\n },\n\n // Min height and padding for button variants\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n size: LinkSize.SM,\n class: 'min-h-7 px-3 max-md:py-1',\n },\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n size: LinkSize.MD,\n class: 'min-h-8 px-6 max-md:py-2',\n },\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n size: LinkSize.LG,\n class: 'min-h-10 px-8 max-md:py-3',\n },\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n size: LinkSize.XL,\n class: 'min-h-11 px-10 max-md:py-4',\n },\n // Ring color variants\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n color: LinkColor.PRIMARY,\n class: 'ring-primary/20',\n },\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n color: LinkColor.SECONDARY,\n class: 'ring-secondary/20',\n },\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n color: LinkColor.DESTRUCTIVE,\n class: 'ring-destructive/20',\n },\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n color: LinkColor.NEUTRAL,\n class: 'ring-neutral/20',\n },\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n color: LinkColor.LIGHT,\n class: 'ring-white/20',\n },\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n color: LinkColor.DARK,\n class: 'ring-neutral-800/20',\n },\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n color: LinkColor.TEXT,\n class: 'ring-text/20',\n },\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n color: LinkColor.TEXT_INVERSE,\n class: 'ring-text-opposite/20',\n },\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n color: LinkColor.ERROR,\n class: 'ring-error/20',\n },\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n color: LinkColor.SUCCESS,\n class: 'ring-success/20',\n },\n ],\n\n defaultVariants: {\n variant: LinkVariant.DEFAULT,\n roundedSize: LinkRoundedSize.MD,\n underlined: LinkUnderlined.DEFAULT,\n size: LinkSize.MD,\n },\n }\n);\n\nexport type LinkProps = DetailedHTMLProps<\n AnchorHTMLAttributes<HTMLAnchorElement>,\n HTMLAnchorElement\n> &\n VariantProps<typeof linkVariants> & {\n label: string;\n isExternalLink?: boolean;\n isPageSection?: boolean;\n isActive?: boolean;\n locale?: LocalesValues;\n };\n\nexport const checkIsExternalLink = ({\n href,\n isExternalLink: isExternalLinkProp,\n}: LinkProps): boolean => {\n const isValidHref = typeof href === 'string' && href.trim() !== '';\n const isExternalLink =\n isExternalLinkProp === true ||\n (typeof isExternalLinkProp === 'undefined' &&\n isValidHref &&\n /^https?:\\/\\//.test(href));\n\n return isExternalLink;\n};\n\nexport const isTextChildren = (children: ReactNode): boolean => {\n if (typeof children === 'string' || typeof children === 'number') {\n return true;\n }\n if (Array.isArray(children)) {\n return children.every(isTextChildren);\n }\n if (isValidElement(children)) {\n return isTextChildren(\n (children.props as { children?: ReactNode }).children\n );\n }\n return false;\n};\n\nexport const Link: FC<LinkProps> = (props) => {\n const {\n variant = LinkVariant.DEFAULT,\n color = LinkColor.CUSTOM,\n roundedSize,\n children,\n label,\n className,\n isActive,\n underlined,\n locale,\n size,\n isExternalLink: isExternalLinkProp,\n isPageSection: isPageSectionProp,\n href: hrefProp,\n ...otherProps\n } = props;\n\n const isExternalLink = isExternalLinkProp ?? checkIsExternalLink(props);\n const isPageSection = isPageSectionProp ?? hrefProp?.startsWith('#') ?? false;\n\n const isChildrenString = isTextChildren(children);\n const isButton =\n variant === LinkVariant.BUTTON || variant === LinkVariant.BUTTON_OUTLINED;\n\n const rel = isExternalLink ? 'noopener noreferrer nofollow' : undefined;\n\n const target = isExternalLink ? '_blank' : '_self';\n\n const href =\n locale && hrefProp && !isExternalLink && !isPageSection\n ? getLocalizedUrl(hrefProp, locale)\n : hrefProp;\n\n return (\n <a\n href={href}\n aria-label={label}\n rel={rel}\n target={target}\n aria-current={isActive ? 'page' : undefined}\n suppressHydrationWarning\n className={cn(\n linkVariants({\n variant,\n color,\n roundedSize,\n underlined,\n size,\n className,\n })\n )}\n {...otherProps}\n >\n {isButton && isChildrenString ? <span>{children}</span> : children}\n\n {isExternalLink && isChildrenString && (\n <ExternalLink className=\"ml-2 inline-block size-4\" />\n )}\n {isPageSection && <MoveRight className=\"ml-2 inline-block size-4\" />}\n </a>\n );\n};\n"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{cn as e}from"../../utils/cn.mjs";import{Link as t}from"../Link/Link.mjs";import{H1 as n,H2 as r,H3 as i,H4 as a,H5 as o,H6 as s}from"../Headers/index.mjs";import{CodeProvider as c}from"../IDE/CodeContext.mjs";import{Code as l}from"../IDE/Code.mjs";import{TabProvider as u}from"../Tab/TabContext.mjs";import{Tab as d}from"../Tab/Tab.mjs";import{Table as f}from"../Table/Table.mjs";import{
|
|
1
|
+
import{cn as e}from"../../utils/cn.mjs";import{Link as t}from"../Link/Link.mjs";import{H1 as n,H2 as r,H3 as i,H4 as a,H5 as o,H6 as s}from"../Headers/index.mjs";import{CodeProvider as c}from"../IDE/CodeContext.mjs";import{Code as l}from"../IDE/Code.mjs";import{TabProvider as u}from"../Tab/TabContext.mjs";import{Tab as d}from"../Tab/Tab.mjs";import{Table as f}from"../Table/Table.mjs";import{createContext as p,useContext as m}from"react";import{Fragment as h,jsx as g}from"react/jsx-runtime";import{renderMarkdown as _}from"react-intlayer";const v=p({}),y={h1:e=>g(n,{isClickable:!0,className:`text-text`,...e}),h2:e=>g(r,{isClickable:!0,className:`mt-16 text-text`,...e}),h3:e=>g(i,{isClickable:!0,className:`mt-5 text-text`,...e}),h4:e=>g(a,{isClickable:!0,className:`mt-3 text-text`,...e}),h5:e=>g(o,{isClickable:!0,className:`mt-3 text-text`,...e}),h6:e=>g(s,{isClickable:!0,className:`mt-3 text-text`,...e}),strong:e=>g(`strong`,{className:`text-text`,...e}),code:({className:e,children:t,...n})=>{let{isDarkMode:r}=m(v),i=String(t??``).replace(/\n$/,``);if(!e)return g(`code`,{className:`rounded-md border border-neutral/30 bg-card/60 box-decoration-clone px-1.5 py-0.5 font-mono text-sm`,children:i});let a=e?.replace(/lang(?:uage)?-/,``)||`plaintext`;return g(l,{...n,language:a,showHeader:!0,isDarkMode:r,children:i})},blockquote:({className:t,...n})=>g(`blockquote`,{className:e(`mt-5 gap-3 border-card border-l-4 pl-5 text-neutral [&_strong]:text-neutral`,t),...n}),ul:({className:t,...n})=>g(`ul`,{className:e(`mt-5 flex list-disc flex-col gap-3 pl-5 marker:text-neutral/80`,t),...n}),ol:({className:t,...n})=>g(`ol`,{className:e(`mt-5 flex list-decimal flex-col gap-3 pl-5 marker:text-neutral/80`,t),...n}),img:({className:t,alt:n,src:r,...i})=>g(`img`,{...i,alt:n??``,loading:`lazy`,className:e(`max-h-[80vh] max-w-full rounded-md`,t),src:`${r}?raw=true`}),a:e=>{let{locale:n}=m(v);return g(t,{isExternalLink:e.href?.startsWith(`http`),underlined:!0,locale:n,label:``,color:`text`,...e})},pre:e=>g(h,{children:e.children}),table:e=>g(f,{isRollable:!0,...e}),th:({className:t,...n})=>g(`th`,{className:e(`border-neutral border-b bg-neutral/10 p-4`,t),...n}),tr:({className:t,...n})=>g(`tr`,{className:e(`hover:/10 hover:bg-neutral/10`,t),...n}),td:({className:t,...n})=>g(`td`,{className:e(`border-neutral-500/50 border-b p-4`,t),...n}),hr:({className:t,...n})=>g(`hr`,{className:e(`mx-6 mt-16 text-neutral`,t),...n}),Tabs:e=>g(d,{...e,className:`rounded-xl border border-card`,headerClassName:`sticky rounded-xl top-24 z-5 bg-background/70 backdrop-blur overflow-x-auto`}),Tab:d.Item,Columns:({className:t,...n})=>g(`div`,{className:e(`flex gap-4 max-md:flex-col`,t),...n}),Column:({className:t,...n})=>g(`div`,{className:e(`flex-1`,t),...n})},b=e=>({components:y}),x=({children:e,isDarkMode:t=!1,locale:n,forceBlock:r,preserveFrontmatter:i,tagfilter:a,components:o,wrapper:s})=>{let l=_(e,{components:{...y,...o},wrapper:s,forceBlock:r,preserveFrontmatter:i,tagfilter:a});return g(v.Provider,{value:{isDarkMode:t,locale:n},children:g(c,{children:g(u,{children:l})})})};export{x as MarkdownRenderer,y as baseMarkdownComponents,b as getIntlayerMarkdownOptions};
|
|
2
2
|
//# sourceMappingURL=MarkDownRender.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MarkDownRender.mjs","names":[],"sources":["../../../../src/components/MarkDownRender/MarkDownRender.tsx"],"sourcesContent":["import type { LocalesValues } from '@intlayer/types';\nimport { cn } from '@utils/cn';\nimport type { ComponentProps, ComponentPropsWithoutRef, FC } from 'react';\nimport {\n type MarkdownRenderer as MarkdownRendererIntlayer,\n type RenderMarkdownProps,\n renderMarkdown,\n} from 'react-intlayer';\nimport type { BundledLanguage } from 'shiki/bundle/web';\nimport { H1, H2, H3, H4, H5, H6 } from '../Headers';\nimport { Code } from '../IDE/Code';\nimport { CodeProvider } from '../IDE/CodeContext';\nimport { Link } from '../Link';\nimport { Tab } from '../Tab';\nimport { TabProvider } from '../Tab/TabContext';\nimport { Table } from '../Table';\n\ntype MarkdownRendererProps = {\n children: string;\n isDarkMode?: boolean;\n locale?: LocalesValues;\n forceBlock?: boolean;\n preserveFrontmatter?: boolean;\n tagfilter?: boolean;\n components?: ComponentProps<typeof MarkdownRendererIntlayer>['components'];\n wrapper?: ComponentProps<typeof MarkdownRendererIntlayer>['wrapper'];\n};\n\nexport const getIntlayerMarkdownOptions: (\n isDarkMode: boolean\n) => RenderMarkdownProps = (isDarkMode) => ({\n components: {\n h1: (props) => <H1 isClickable={true} className=\"text-text\" {...props} />,\n h2: (props) => (\n <H2 isClickable={true} className=\"mt-16 text-text\" {...props} />\n ),\n h3: (props) => (\n <H3 isClickable={true} className=\"mt-5 text-text\" {...props} />\n ),\n h4: (props) => (\n <H4 isClickable={true} className=\"mt-3 text-text\" {...props} />\n ),\n h5: (props) => (\n <H5 isClickable={true} className=\"mt-3 text-text\" {...props} />\n ),\n h6: (props) => (\n <H6 isClickable={true} className=\"mt-3 text-text\" {...props} />\n ),\n strong: (props) => <strong className=\"text-text\" {...props} />,\n\n code: ({ className, children, ...rest }: ComponentProps<'code'>) => {\n // Ensure children is a string (Markdown renderer might pass ReactNodes)\n const content = String(children ?? '').replace(/\\n$/, '');\n\n // Determine if it is inline code or a code block\n // Code blocks usually have a className like 'language-ts'\n const isBlock = !!className;\n\n if (!isBlock) {\n return (\n <code className=\"rounded-md border border-neutral/30 bg-card/60 box-decoration-clone px-1.5 py-0.5 font-mono text-sm\">\n {content}\n </code>\n );\n }\n\n // Extract language from className (e.g., \"language-typescript\" -> \"typescript\")\n const language = (className?.replace(/lang(?:uage)?-/, '') ||\n 'plaintext') as BundledLanguage;\n\n return (\n <Code\n {...rest}\n language={language}\n showHeader={true}\n isDarkMode={isDarkMode} // Ensure this variable is available in scope\n >\n {content}\n </Code>\n );\n },\n blockquote: ({ className, ...props }) => (\n <blockquote\n className={cn(\n 'mt-5 gap-3 border-card border-l-4 pl-5 text-neutral',\n '[&_strong]:text-neutral',\n className\n )}\n {...props}\n />\n ),\n ul: ({ className, ...props }) => (\n <ul\n className={cn(\n 'mt-5 flex list-disc flex-col gap-3 pl-5 marker:text-neutral/80',\n className\n )}\n {...props}\n />\n ),\n ol: ({ className, ...props }) => (\n <ol\n className={cn(\n 'mt-5 flex list-decimal flex-col gap-3 pl-5 marker:text-neutral/80',\n className\n )}\n {...props}\n />\n ),\n img: ({ className, ...props }) => (\n <img\n {...props}\n alt={props.alt ?? ''}\n loading=\"lazy\"\n className={cn('max-h-[80vh] max-w-full rounded-md', className)}\n src={`${props.src}?raw=true`}\n />\n ),\n a: (props) => (\n // @ts-expect-error - label is not required in LinkProps\n <Link\n isExternalLink={props.href?.startsWith('http')}\n underlined={true}\n // locale={locale}\n {...props}\n />\n ),\n pre: (props) => props.children,\n\n table: (props: ComponentProps<typeof Table>) => (\n <Table isRollable={true} {...props} />\n ),\n th: ({ className, ...props }) => (\n <th\n className={cn('border-neutral border-b bg-neutral/10 p-4', className)}\n {...props}\n />\n ),\n tr: ({ className, ...props }) => (\n <tr\n className={cn('hover:/10 hover:bg-neutral/10', className)}\n {...props}\n />\n ),\n td: ({ className, ...props }) => (\n <td\n className={cn('border-neutral-500/50 border-b p-4', className)}\n {...props}\n />\n ),\n hr: ({ className, ...props }) => (\n <hr className={cn('mx-6 mt-16 text-neutral', className)} {...props} />\n ),\n Tabs: (props: ComponentProps<typeof Tab>) => (\n <Tab\n {...props}\n className=\"rounded-xl border border-card\"\n headerClassName=\"sticky rounded-xl top-24 z-5 bg-background/70 backdrop-blur overflow-x-auto\"\n />\n ),\n Tab: Tab.Item,\n Columns: ({ className, ...props }: ComponentPropsWithoutRef<'div'>) => (\n <div className={cn('flex gap-4 max-md:flex-col', className)} {...props} />\n ),\n Column: ({ className, ...props }: ComponentPropsWithoutRef<'div'>) => (\n <div className={cn('flex-1', className)} {...props} />\n ),\n },\n});\n\n/**\n * MarkdownRenderer Component\n *\n * A comprehensive markdown renderer that transforms markdown text into rich,\n * interactive HTML with custom styling and Intlayer integration. Supports\n * code syntax highlighting, responsive tables, internationalized links,\n * and automatic frontmatter stripping.\n *\n * @component\n */\nexport const MarkdownRenderer: FC<MarkdownRendererProps> = ({\n children,\n isDarkMode,\n locale,\n forceBlock,\n preserveFrontmatter,\n tagfilter,\n components: componentsProp,\n wrapper,\n}) => {\n const markdownOptions = getIntlayerMarkdownOptions(isDarkMode ?? false);\n\n const markdownContent = renderMarkdown(children, {\n components: {\n ...markdownOptions.components,\n // Pass dynamic props to components\n code: ({ className, children, ...rest }: ComponentProps<'code'>) => {\n // Ensure children is a string (Markdown renderer might pass ReactNodes)\n const content = String(children ?? '').replace(/\\n$/, '');\n\n // Determine if it is inline code or a code block\n // Code blocks usually have a className like 'language-ts'\n const isBlock = !!className;\n\n if (!isBlock) {\n return (\n <code className=\"rounded-md border border-neutral/30 bg-card/60 box-decoration-clone px-1.5 py-0.5 font-mono text-sm\">\n {content}\n </code>\n );\n }\n\n // Extract language from className (e.g., \"language-typescript\" -> \"typescript\")\n const language = (className?.replace(/lang(?:uage)?-/, '') ||\n 'plaintext') as BundledLanguage;\n\n return (\n <Code\n {...rest}\n language={language}\n showHeader={true}\n isDarkMode={isDarkMode} // Ensure this variable is available in scope\n >\n {content}\n </Code>\n );\n },\n\n a: (props) => (\n <Link\n isExternalLink={props.href?.startsWith('http')}\n underlined={true}\n locale={locale}\n label=\"\"\n {...props}\n color=\"text\"\n />\n ),\n ...componentsProp,\n },\n wrapper: wrapper ?? markdownOptions.wrapper,\n forceBlock: forceBlock ?? markdownOptions.forceBlock,\n preserveFrontmatter:\n preserveFrontmatter ?? markdownOptions.preserveFrontmatter,\n tagfilter: tagfilter ?? markdownOptions.tagfilter,\n });\n\n return (\n <CodeProvider>\n <TabProvider>{markdownContent}</TabProvider>\n </CodeProvider>\n );\n};\n"],"mappings":"2dA4BA,MAAa,EAEe,IAAgB,CAC1C,WAAY,CACV,GAAK,GAAU,EAAC,EAAD,CAAI,YAAa,GAAM,UAAU,YAAY,GAAI,EAAS,CAAA,CACzE,GAAK,GACH,EAAC,EAAD,CAAI,YAAa,GAAM,UAAU,kBAAkB,GAAI,EAAS,CAAA,CAElE,GAAK,GACH,EAAC,EAAD,CAAI,YAAa,GAAM,UAAU,iBAAiB,GAAI,EAAS,CAAA,CAEjE,GAAK,GACH,EAAC,EAAD,CAAI,YAAa,GAAM,UAAU,iBAAiB,GAAI,EAAS,CAAA,CAEjE,GAAK,GACH,EAAC,EAAD,CAAI,YAAa,GAAM,UAAU,iBAAiB,GAAI,EAAS,CAAA,CAEjE,GAAK,GACH,EAAC,EAAD,CAAI,YAAa,GAAM,UAAU,iBAAiB,GAAI,EAAS,CAAA,CAEjE,OAAS,GAAU,EAAC,SAAD,CAAQ,UAAU,YAAY,GAAI,EAAS,CAAA,CAE9D,MAAO,CAAE,YAAW,WAAU,GAAG,KAAmC,CAElE,IAAM,EAAU,OAAO,GAAY,GAAG,CAAC,QAAQ,MAAO,GAAG,CAMzD,GAAI,CAFc,EAGhB,OACE,EAAC,OAAD,CAAM,UAAU,+GACb,EACI,CAAA,CAKX,IAAM,EAAY,GAAW,QAAQ,iBAAkB,GAAG,EACxD,YAEF,OACE,EAAC,EAAD,CACE,GAAI,EACM,WACV,WAAY,GACA,sBAEX,EACI,CAAA,EAGX,YAAa,CAAE,YAAW,GAAG,KAC3B,EAAC,aAAD,CACE,UAAW,EACT,sDACA,0BACA,EACD,CACD,GAAI,EACJ,CAAA,CAEJ,IAAK,CAAE,YAAW,GAAG,KACnB,EAAC,KAAD,CACE,UAAW,EACT,iEACA,EACD,CACD,GAAI,EACJ,CAAA,CAEJ,IAAK,CAAE,YAAW,GAAG,KACnB,EAAC,KAAD,CACE,UAAW,EACT,oEACA,EACD,CACD,GAAI,EACJ,CAAA,CAEJ,KAAM,CAAE,YAAW,GAAG,KACpB,EAAC,MAAD,CACE,GAAI,EACJ,IAAK,EAAM,KAAO,GAClB,QAAQ,OACR,UAAW,EAAG,qCAAsC,EAAU,CAC9D,IAAK,GAAG,EAAM,IAAI,WAClB,CAAA,CAEJ,EAAI,GAEF,EAAC,EAAD,CACE,eAAgB,EAAM,MAAM,WAAW,OAAO,CAC9C,WAAY,GAEZ,GAAI,EACJ,CAAA,CAEJ,IAAM,GAAU,EAAM,SAEtB,MAAQ,GACN,EAAC,EAAD,CAAO,WAAY,GAAM,GAAI,EAAS,CAAA,CAExC,IAAK,CAAE,YAAW,GAAG,KACnB,EAAC,KAAD,CACE,UAAW,EAAG,4CAA6C,EAAU,CACrE,GAAI,EACJ,CAAA,CAEJ,IAAK,CAAE,YAAW,GAAG,KACnB,EAAC,KAAD,CACE,UAAW,EAAG,gCAAiC,EAAU,CACzD,GAAI,EACJ,CAAA,CAEJ,IAAK,CAAE,YAAW,GAAG,KACnB,EAAC,KAAD,CACE,UAAW,EAAG,qCAAsC,EAAU,CAC9D,GAAI,EACJ,CAAA,CAEJ,IAAK,CAAE,YAAW,GAAG,KACnB,EAAC,KAAD,CAAI,UAAW,EAAG,0BAA2B,EAAU,CAAE,GAAI,EAAS,CAAA,CAExE,KAAO,GACL,EAAC,EAAD,CACE,GAAI,EACJ,UAAU,gCACV,gBAAgB,8EAChB,CAAA,CAEJ,IAAK,EAAI,KACT,SAAU,CAAE,YAAW,GAAG,KACxB,EAAC,MAAD,CAAK,UAAW,EAAG,6BAA8B,EAAU,CAAE,GAAI,EAAS,CAAA,CAE5E,QAAS,CAAE,YAAW,GAAG,KACvB,EAAC,MAAD,CAAK,UAAW,EAAG,SAAU,EAAU,CAAE,GAAI,EAAS,CAAA,CAEzD,CACF,EAYY,GAA+C,CAC1D,WACA,aACA,SACA,aACA,sBACA,YACA,WAAY,EACZ,aACI,CACJ,IAAM,EAAkB,EAA2B,GAAc,GAAM,CAyDvE,OACE,EAAC,EAAD,CAAA,SACE,EAAC,EAAD,CAAA,SAzDoB,EAAe,EAAU,CAC/C,WAAY,CACV,GAAG,EAAgB,WAEnB,MAAO,CAAE,YAAW,WAAU,GAAG,KAAmC,CAElE,IAAM,EAAU,OAAO,GAAY,GAAG,CAAC,QAAQ,MAAO,GAAG,CAMzD,GAAI,CAFc,EAGhB,OACE,EAAC,OAAD,CAAM,UAAU,+GACb,EACI,CAAA,CAKX,IAAM,EAAY,GAAW,QAAQ,iBAAkB,GAAG,EACxD,YAEF,OACE,EAAC,EAAD,CACE,GAAI,EACM,WACV,WAAY,GACA,sBAEX,EACI,CAAA,EAIX,EAAI,GACF,EAAC,EAAD,CACE,eAAgB,EAAM,MAAM,WAAW,OAAO,CAC9C,WAAY,GACJ,SACR,MAAM,GACN,GAAI,EACJ,MAAM,OACN,CAAA,CAEJ,GAAG,EACJ,CACD,QAAS,GAAW,EAAgB,QACpC,WAAY,GAAc,EAAgB,WAC1C,oBACE,GAAuB,EAAgB,oBACzC,UAAW,GAAa,EAAgB,UACzC,CAAC,CAI8C,CAAA,CAC/B,CAAA"}
|
|
1
|
+
{"version":3,"file":"MarkDownRender.mjs","names":[],"sources":["../../../../src/components/MarkDownRender/MarkDownRender.tsx"],"sourcesContent":["import type { LocalesValues } from '@intlayer/types';\nimport { cn } from '@utils/cn';\nimport {\n type ComponentProps,\n type ComponentPropsWithoutRef,\n createContext,\n type FC,\n useContext,\n} from 'react';\nimport {\n type MarkdownRenderer as MarkdownRendererIntlayer,\n renderMarkdown,\n} from 'react-intlayer';\nimport type { BundledLanguage } from 'shiki/bundle/web';\nimport { H1, H2, H3, H4, H5, H6 } from '../Headers';\nimport { Code } from '../IDE/Code';\nimport { CodeProvider } from '../IDE/CodeContext';\nimport { Link } from '../Link';\nimport { Tab } from '../Tab';\nimport { TabProvider } from '../Tab/TabContext';\nimport { Table } from '../Table';\n\n// Context to pass dynamic variables to static components without re-creating them\ninterface MarkdownContextType {\n isDarkMode?: boolean;\n locale?: LocalesValues;\n}\nconst MarkdownContext = createContext<MarkdownContextType>({});\n\n// Extracted, stable component renderers\nconst H1Renderer = (props: ComponentProps<'h1'>) => (\n <H1 isClickable className=\"text-text\" {...props} />\n);\nconst H2Renderer = (props: ComponentProps<'h2'>) => (\n <H2 isClickable className=\"mt-16 text-text\" {...props} />\n);\nconst H3Renderer = (props: ComponentProps<'h3'>) => (\n <H3 isClickable className=\"mt-5 text-text\" {...props} />\n);\nconst H4Renderer = (props: ComponentProps<'h4'>) => (\n <H4 isClickable className=\"mt-3 text-text\" {...props} />\n);\nconst H5Renderer = (props: ComponentProps<'h5'>) => (\n <H5 isClickable className=\"mt-3 text-text\" {...props} />\n);\nconst H6Renderer = (props: ComponentProps<'h6'>) => (\n <H6 isClickable className=\"mt-3 text-text\" {...props} />\n);\nconst StrongRenderer = (props: ComponentProps<'strong'>) => (\n <strong className=\"text-text\" {...props} />\n);\n\nconst CodeRenderer = ({\n className,\n children,\n ...rest\n}: ComponentProps<'code'>) => {\n const { isDarkMode } = useContext(MarkdownContext);\n const content = String(children ?? '').replace(/\\n$/, '');\n const isBlock = !!className;\n\n if (!isBlock) {\n return (\n <code className=\"rounded-md border border-neutral/30 bg-card/60 box-decoration-clone px-1.5 py-0.5 font-mono text-sm\">\n {content}\n </code>\n );\n }\n\n const language = (className?.replace(/lang(?:uage)?-/, '') ||\n 'plaintext') as BundledLanguage;\n\n return (\n <Code {...rest} language={language} showHeader isDarkMode={isDarkMode}>\n {content}\n </Code>\n );\n};\n\nconst BlockquoteRenderer = ({\n className,\n ...props\n}: ComponentProps<'blockquote'>) => (\n <blockquote\n className={cn(\n 'mt-5 gap-3 border-card border-l-4 pl-5 text-neutral [&_strong]:text-neutral',\n className\n )}\n {...props}\n />\n);\n\nconst UlRenderer = ({ className, ...props }: ComponentProps<'ul'>) => (\n <ul\n className={cn(\n 'mt-5 flex list-disc flex-col gap-3 pl-5 marker:text-neutral/80',\n className\n )}\n {...props}\n />\n);\n\nconst OlRenderer = ({ className, ...props }: ComponentProps<'ol'>) => (\n <ol\n className={cn(\n 'mt-5 flex list-decimal flex-col gap-3 pl-5 marker:text-neutral/80',\n className\n )}\n {...props}\n />\n);\n\nconst ImgRenderer = ({\n className,\n alt,\n src,\n ...props\n}: ComponentProps<'img'>) => (\n <img\n {...props}\n alt={alt ?? ''}\n loading=\"lazy\"\n className={cn('max-h-[80vh] max-w-full rounded-md', className)}\n src={`${src}?raw=true`}\n />\n);\n\nconst LinkRenderer = (props: ComponentProps<'a'>) => {\n const { locale } = useContext(MarkdownContext);\n return (\n <Link\n isExternalLink={props.href?.startsWith('http')}\n underlined\n locale={locale}\n label=\"\"\n color=\"text\"\n {...(props as any)}\n />\n );\n};\n\nconst PreRenderer = (props: ComponentProps<'pre'>) => <>{props.children}</>;\nconst TableRenderer = (props: ComponentProps<typeof Table>) => (\n <Table isRollable {...props} />\n);\nconst ThRenderer = ({ className, ...props }: ComponentProps<'th'>) => (\n <th\n className={cn('border-neutral border-b bg-neutral/10 p-4', className)}\n {...props}\n />\n);\nconst TrRenderer = ({ className, ...props }: ComponentProps<'tr'>) => (\n <tr className={cn('hover:/10 hover:bg-neutral/10', className)} {...props} />\n);\nconst TdRenderer = ({ className, ...props }: ComponentProps<'td'>) => (\n <td\n className={cn('border-neutral-500/50 border-b p-4', className)}\n {...props}\n />\n);\nconst HrRenderer = ({ className, ...props }: ComponentProps<'hr'>) => (\n <hr className={cn('mx-6 mt-16 text-neutral', className)} {...props} />\n);\n\nconst TabsRenderer = (props: ComponentProps<typeof Tab>) => (\n <Tab\n {...props}\n className=\"rounded-xl border border-card\"\n headerClassName=\"sticky rounded-xl top-24 z-5 bg-background/70 backdrop-blur overflow-x-auto\"\n />\n);\nconst ColumnsRenderer = ({\n className,\n ...props\n}: ComponentPropsWithoutRef<'div'>) => (\n <div className={cn('flex gap-4 max-md:flex-col', className)} {...props} />\n);\nconst ColumnRenderer = ({\n className,\n ...props\n}: ComponentPropsWithoutRef<'div'>) => (\n <div className={cn('flex-1', className)} {...props} />\n);\n\n// Static configuration object\nexport const baseMarkdownComponents = {\n h1: H1Renderer,\n h2: H2Renderer,\n h3: H3Renderer,\n h4: H4Renderer,\n h5: H5Renderer,\n h6: H6Renderer,\n strong: StrongRenderer,\n code: CodeRenderer,\n blockquote: BlockquoteRenderer,\n ul: UlRenderer,\n ol: OlRenderer,\n img: ImgRenderer,\n a: LinkRenderer,\n pre: PreRenderer,\n table: TableRenderer,\n th: ThRenderer,\n tr: TrRenderer,\n td: TdRenderer,\n hr: HrRenderer,\n Tabs: TabsRenderer,\n Tab: Tab.Item,\n Columns: ColumnsRenderer,\n Column: ColumnRenderer,\n};\n\ntype MarkdownRendererProps = {\n children: string;\n isDarkMode?: boolean;\n locale?: LocalesValues;\n forceBlock?: boolean;\n preserveFrontmatter?: boolean;\n tagfilter?: boolean;\n components?: ComponentProps<typeof MarkdownRendererIntlayer>['components'];\n wrapper?: ComponentProps<typeof MarkdownRendererIntlayer>['wrapper'];\n};\n\nexport const getIntlayerMarkdownOptions = (isDarkMode?: boolean) => ({\n components: baseMarkdownComponents,\n});\n\nexport const MarkdownRenderer: FC<MarkdownRendererProps> = ({\n children,\n isDarkMode = false,\n locale,\n forceBlock,\n preserveFrontmatter,\n tagfilter,\n components: componentsProp,\n wrapper,\n}) => {\n // `renderMarkdown` now receives stable object references.\n const markdownContent = renderMarkdown(children, {\n components: {\n ...baseMarkdownComponents,\n ...componentsProp,\n },\n wrapper,\n forceBlock,\n preserveFrontmatter,\n tagfilter,\n });\n\n return (\n <MarkdownContext.Provider value={{ isDarkMode, locale }}>\n <CodeProvider>\n <TabProvider>{markdownContent}</TabProvider>\n </CodeProvider>\n </MarkdownContext.Provider>\n );\n};\n"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{MarkdownRenderer as e,getIntlayerMarkdownOptions as
|
|
1
|
+
import{MarkdownRenderer as e,baseMarkdownComponents as t,getIntlayerMarkdownOptions as n}from"./MarkDownRender.mjs";export{e as MarkdownRenderer,t as baseMarkdownComponents,n as getIntlayerMarkdownOptions};
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use client";import{cn as e}from"../../utils/cn.mjs";import{CheckIcon as t,ChevronDownIcon as n,ChevronUpIcon as r,ChevronsUpDown as i}from"lucide-react";import{jsx as a,jsxs as o}from"react/jsx-runtime";import*as s from"@radix-ui/react-select";let c=function(e){return e.POPPER=`popper`,e.ITEM_ALIGNED=`item-aligned`,e}({});const l=s.Root,u=s.Group,d=s.Value,f=({validationStyleEnabled:t=!1,className:n,children:r,...c})=>o(s.Trigger,{className:e(`flex w-full cursor-pointer items-center justify-between whitespace-nowrap`,`select-text text-base shadow-none outline-none md:text-sm`,`rounded-xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-2xl`,`px-2 py-3 md:py-2`,`bg-neutral-50 dark:bg-neutral-950`,`text-text`,`ring-0`,`focus-visible:outline-none`,`focus-visible:ring-3`,`focus-visible:ring-neutral-200`,`dark:focus-visible:ring-neutral-500`,`focus-visible:ring-offset-white`,`dark:focus-visible:ring-offset-neutral-500`,`[box-shadow:none] focus:[box-shadow:none]`,`disabled:cursor-not-allowed disabled:opacity-50`,`aria-invalid:border-error`,`[&>span]:line-clamp-1`,t&&`valid:border-success invalid:border-error`,n),...c,children:[r,a(s.Icon,{asChild:!0,children:a(i,{className:`size-4 opacity-50`})})]}),p=({className:t,...n})=>a(s.ScrollUpButton,{className:e(`flex cursor-default items-center justify-center py-1`,t),...n,children:a(r,{})}),m=({className:t,...r})=>a(s.ScrollDownButton,{className:e(`flex cursor-default items-center justify-center py-1`,t),...r,children:a(n,{})}),h=({className:t,children:n,position:r=c.POPPER,...i})=>a(s.Portal,{children:o(s.Content,{className:e(`relative z-50 max-h-96 min-w-32 overflow-hidden`,`rounded-xl shadow-md`,`bg-white dark:bg-neutral-950`,`text-text`,`border border-neutral-200 dark:border-neutral-800`,`data-[state=closed]:animate-out data-[state=open]:animate-in`,`data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0`,`data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95`,`data-[side=bottom]:slide-in-from-top-2`,`data-[side=left]:slide-in-from-right-2`,`data-[side=right]:slide-in-from-left-2`,`data-[side=top]:slide-in-from-bottom-2`,r===`popper`&&`data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=bottom]:translate-y-1 data-[side=top]:-translate-y-1`,t),position:r,...i,children:[a(p,{}),a(s.Viewport,{className:e(`p-1`,r===`popper`&&`h-(--radix-select-trigger-height) w-full min-w-(--radix-select-trigger-width)`),children:n}),a(m,{})]})}),g=({className:t,...n})=>a(s.Label,{className:e(`px-1 py-0.5 font-semibold text-sm`,t),...n}),_=({className:n,children:r,...i})=>o(s.Item,{className:e(`relative flex w-full cursor-pointer select-none items-center rounded-lg py-1.5 pr-8 pl-2 text-sm outline-hidden focus:bg-neutral/10 data-disabled:pointer-events-none data-disabled:opacity-50`,n),...i,children:[a(`span`,{className:`absolute right-2 flex size-3.5 items-center justify-center`,children:a(s.ItemIndicator,{children:a(t,{className:`size-4`})})}),a(s.ItemText,{children:r})]}),v=({className:t,...n})=>a(s.Separator,{className:e(`-mx-1 my-1 h-px`,`bg-neutral-200 dark:bg-neutral-800`,t),...n}),y=l;y.Group=u,y.Value=d,y.Trigger=f,y.ScrollUpButton=p,y.ScrollDownButton=m,y.Content=h,y.Label=g,y.Item=_,y.Separator=v;export{y as Select,h as SelectContent,c as SelectContentPosition,g as SelectLabel,v as SelectSeparator};
|
|
1
|
+
"use client";import{cn as e}from"../../utils/cn.mjs";import{CheckIcon as t,ChevronDownIcon as n,ChevronUpIcon as r,ChevronsUpDown as i}from"lucide-react";import{jsx as a,jsxs as o}from"react/jsx-runtime";import*as s from"@radix-ui/react-select";let c=function(e){return e.POPPER=`popper`,e.ITEM_ALIGNED=`item-aligned`,e}({});const l=s.Root,u=s.Group,d=s.Value,f=({validationStyleEnabled:t=!1,className:n,children:r,...c})=>o(s.Trigger,{suppressHydrationWarning:!0,className:e(`flex w-full cursor-pointer items-center justify-between whitespace-nowrap`,`select-text text-base shadow-none outline-none md:text-sm`,`rounded-xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-2xl`,`px-2 py-3 md:py-2`,`bg-neutral-50 dark:bg-neutral-950`,`text-text`,`ring-0`,`focus-visible:outline-none`,`focus-visible:ring-3`,`focus-visible:ring-neutral-200`,`dark:focus-visible:ring-neutral-500`,`focus-visible:ring-offset-white`,`dark:focus-visible:ring-offset-neutral-500`,`[box-shadow:none] focus:[box-shadow:none]`,`disabled:cursor-not-allowed disabled:opacity-50`,`aria-invalid:border-error`,`[&>span]:line-clamp-1`,t&&`valid:border-success invalid:border-error`,n),...c,children:[r,a(s.Icon,{asChild:!0,children:a(i,{className:`size-4 opacity-50`})})]}),p=({className:t,...n})=>a(s.ScrollUpButton,{className:e(`flex cursor-default items-center justify-center py-1`,t),...n,children:a(r,{})}),m=({className:t,...r})=>a(s.ScrollDownButton,{className:e(`flex cursor-default items-center justify-center py-1`,t),...r,children:a(n,{})}),h=({className:t,children:n,position:r=c.POPPER,...i})=>a(s.Portal,{children:o(s.Content,{className:e(`relative z-50 max-h-96 min-w-32 overflow-hidden`,`rounded-xl shadow-md`,`bg-white dark:bg-neutral-950`,`text-text`,`border border-neutral-200 dark:border-neutral-800`,`data-[state=closed]:animate-out data-[state=open]:animate-in`,`data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0`,`data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95`,`data-[side=bottom]:slide-in-from-top-2`,`data-[side=left]:slide-in-from-right-2`,`data-[side=right]:slide-in-from-left-2`,`data-[side=top]:slide-in-from-bottom-2`,r===`popper`&&`data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=bottom]:translate-y-1 data-[side=top]:-translate-y-1`,t),position:r,...i,children:[a(p,{}),a(s.Viewport,{className:e(`p-1`,r===`popper`&&`h-(--radix-select-trigger-height) w-full min-w-(--radix-select-trigger-width)`),children:n}),a(m,{})]})}),g=({className:t,...n})=>a(s.Label,{className:e(`px-1 py-0.5 font-semibold text-sm`,t),...n}),_=({className:n,children:r,...i})=>o(s.Item,{className:e(`relative flex w-full cursor-pointer select-none items-center rounded-lg py-1.5 pr-8 pl-2 text-sm outline-hidden focus:bg-neutral/10 data-disabled:pointer-events-none data-disabled:opacity-50`,n),...i,children:[a(`span`,{className:`absolute right-2 flex size-3.5 items-center justify-center`,children:a(s.ItemIndicator,{children:a(t,{className:`size-4`})})}),a(s.ItemText,{children:r})]}),v=({className:t,...n})=>a(s.Separator,{className:e(`-mx-1 my-1 h-px`,`bg-neutral-200 dark:bg-neutral-800`,t),...n}),y=l;y.Group=u,y.Value=d,y.Trigger=f,y.ScrollUpButton=p,y.ScrollDownButton=m,y.Content=h,y.Label=g,y.Item=_,y.Separator=v;export{y as Select,h as SelectContent,c as SelectContentPosition,g as SelectLabel,v as SelectSeparator};
|
|
2
2
|
//# sourceMappingURL=Select.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Select.mjs","names":[],"sources":["../../../../src/components/Select/Select.tsx"],"sourcesContent":["'use client';\n\nimport * as SelectPrimitive from '@radix-ui/react-select';\nimport { cn } from '@utils/cn';\nimport {\n CheckIcon,\n ChevronDownIcon,\n ChevronsUpDown,\n ChevronUpIcon,\n} from 'lucide-react';\nimport type { ComponentProps, FC } from 'react';\n\n/**\n * Enum for Select content positioning strategies\n *\n * @enum SelectContentPosition\n */\nexport enum SelectContentPosition {\n /** Position relative to the trigger with automatic placement */\n POPPER = 'popper',\n /** Align content with the selected item */\n ITEM_ALIGNED = 'item-aligned',\n}\n\nconst SelectRoot = SelectPrimitive.Root;\nconst SelectGroup = SelectPrimitive.Group;\nconst SelectValue = SelectPrimitive.Value;\n\n/**\n * Select trigger button component that displays the current selection and opens the dropdown\n *\n * Features comprehensive styling with validation states, focus management, and accessibility support.\n * Uses design tokens for consistent theming across the application.\n *\n * @param validationStyleEnabled - Enables automatic success/error styling based on form validation state\n * @param className - Additional CSS classes for custom styling\n * @param children - Content to display inside the trigger (typically SelectValue)\n *\n * @example\n * ```tsx\n * <Select.Trigger validationStyleEnabled>\n * <Select.Value placeholder=\"Choose option...\" />\n * </Select.Trigger>\n * ```\n */\nconst SelectTrigger: FC<\n ComponentProps<typeof SelectPrimitive.Trigger> & {\n /**\n * Enables success/error border styling based on HTML5 validation state\n * @default false\n * @example\n * ```tsx\n * <Select.Trigger validationStyleEnabled>\n * <Select.Value placeholder=\"Required field\" />\n * </Select.Trigger>\n * ```\n */\n validationStyleEnabled?: boolean;\n }\n> = ({ validationStyleEnabled = false, className, children, ...props }) => (\n <SelectPrimitive.Trigger\n className={cn(\n // Base layout and typography\n 'flex w-full cursor-pointer items-center justify-between whitespace-nowrap',\n 'select-text text-base shadow-none outline-none md:text-sm',\n\n // Corner shape\n 'rounded-xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-2xl',\n\n // Spacing\n 'px-2 py-3 md:py-2',\n\n // Background and text\n 'bg-neutral-50 dark:bg-neutral-950',\n 'text-text',\n\n // Focus ring\n 'ring-0',\n 'focus-visible:outline-none',\n 'focus-visible:ring-3',\n 'focus-visible:ring-neutral-200',\n 'dark:focus-visible:ring-neutral-500',\n\n 'focus-visible:ring-offset-white',\n 'dark:focus-visible:ring-offset-neutral-500',\n\n // Remove box-shadow\n '[box-shadow:none] focus:[box-shadow:none]',\n\n // States\n 'disabled:cursor-not-allowed disabled:opacity-50',\n 'aria-invalid:border-error',\n '[&>span]:line-clamp-1',\n\n // Validation styles\n validationStyleEnabled && 'valid:border-success invalid:border-error',\n\n className\n )}\n {...props}\n >\n {children}\n <SelectPrimitive.Icon asChild>\n <ChevronsUpDown className=\"size-4 opacity-50\" />\n </SelectPrimitive.Icon>\n </SelectPrimitive.Trigger>\n);\n\n/**\n * Scroll up button for select content with long lists\n *\n * Automatically appears when content is scrollable upward, providing intuitive navigation\n * for users with large option lists.\n *\n * @param className - Additional CSS classes for custom styling\n */\nconst SelectScrollUpButton: FC<\n ComponentProps<typeof SelectPrimitive.ScrollUpButton>\n> = ({ className, ...props }) => (\n <SelectPrimitive.ScrollUpButton\n className={cn(\n 'flex cursor-default items-center justify-center py-1',\n className\n )}\n {...props}\n >\n <ChevronUpIcon />\n </SelectPrimitive.ScrollUpButton>\n);\n\n/**\n * Scroll down button for select content with long lists\n *\n * Automatically appears when content is scrollable downward, providing clear visual\n * indication of additional options below the current view.\n *\n * @param className - Additional CSS classes for custom styling\n */\nconst SelectScrollDownButton: FC<\n ComponentProps<typeof SelectPrimitive.ScrollDownButton>\n> = ({ className, ...props }) => (\n <SelectPrimitive.ScrollDownButton\n className={cn(\n 'flex cursor-default items-center justify-center py-1',\n className\n )}\n {...props}\n >\n <ChevronDownIcon />\n </SelectPrimitive.ScrollDownButton>\n);\n\n/**\n * Select dropdown content container with positioning and animation\n *\n * Provides the dropdown interface containing all selectable options. Features smooth\n * animations, flexible positioning strategies, and responsive design for optimal UX.\n *\n * @param position - Positioning strategy for the dropdown content\n * @param className - Additional CSS classes for custom styling\n * @param children - Select items, labels, and separators\n *\n * @example\n * ```tsx\n * <Select.Content position={SelectContentPosition.POPPER}>\n * <Select.Item value=\"option1\">Option 1</Select.Item>\n * <Select.Item value=\"option2\">Option 2</Select.Item>\n * </Select.Content>\n * ```\n */\nexport const SelectContent: FC<\n ComponentProps<typeof SelectPrimitive.Content>\n> = ({\n className,\n children,\n position = SelectContentPosition.POPPER,\n ...props\n}) => (\n <SelectPrimitive.Portal>\n <SelectPrimitive.Content\n className={cn(\n // Base styles\n 'relative z-50 max-h-96 min-w-32 overflow-hidden',\n 'rounded-xl shadow-md',\n\n // Background and text\n 'bg-white dark:bg-neutral-950',\n 'text-text',\n\n // Border\n 'border border-neutral-200 dark:border-neutral-800',\n\n // Animations\n 'data-[state=closed]:animate-out data-[state=open]:animate-in',\n 'data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0',\n 'data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95',\n 'data-[side=bottom]:slide-in-from-top-2',\n 'data-[side=left]:slide-in-from-right-2',\n 'data-[side=right]:slide-in-from-left-2',\n 'data-[side=top]:slide-in-from-bottom-2',\n\n // Positioning adjustments\n position === 'popper' &&\n 'data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=bottom]:translate-y-1 data-[side=top]:-translate-y-1',\n\n className\n )}\n position={position}\n {...props}\n >\n <SelectScrollUpButton />\n <SelectPrimitive.Viewport\n className={cn(\n 'p-1',\n position === 'popper' &&\n 'h-(--radix-select-trigger-height) w-full min-w-(--radix-select-trigger-width)'\n )}\n >\n {children}\n </SelectPrimitive.Viewport>\n <SelectScrollDownButton />\n </SelectPrimitive.Content>\n </SelectPrimitive.Portal>\n);\n\n/**\n * Label component for grouping select options\n *\n * Provides semantic grouping and visual organization of related options within\n * the select dropdown. Enhances accessibility and user experience.\n *\n * @param className - Additional CSS classes for custom styling\n *\n * @example\n * ```tsx\n * <Select.Content>\n * <Select.Label>Fruits</Select.Label>\n * <Select.Item value=\"apple\">Apple</Select.Item>\n * <Select.Item value=\"banana\">Banana</Select.Item>\n * <Select.Separator />\n * <Select.Label>Vegetables</Select.Label>\n * <Select.Item value=\"carrot\">Carrot</Select.Item>\n * </Select.Content>\n * ```\n */\nexport const SelectLabel: FC<ComponentProps<typeof SelectPrimitive.Label>> = ({\n className,\n ...props\n}) => (\n <SelectPrimitive.Label\n className={cn('px-1 py-0.5 font-semibold text-sm', className)}\n {...props}\n />\n);\n\n/**\n * Individual selectable item within the dropdown\n *\n * Represents a single option that users can select. Features hover states,\n * selection indicators, and keyboard navigation support for accessible interaction.\n *\n * @param className - Additional CSS classes for custom styling\n * @param children - The display text/content for the option\n *\n * @example\n * ```tsx\n * <Select.Item value=\"dark-mode\">\n * 🌙 Dark Mode\n * </Select.Item>\n * ```\n */\nconst SelectItem: FC<ComponentProps<typeof SelectPrimitive.Item>> = ({\n className,\n children,\n ...props\n}) => (\n <SelectPrimitive.Item\n className={cn(\n 'relative flex w-full cursor-pointer select-none items-center rounded-lg py-1.5 pr-8 pl-2 text-sm outline-hidden focus:bg-neutral/10 data-disabled:pointer-events-none data-disabled:opacity-50',\n className\n )}\n {...props}\n >\n <span className=\"absolute right-2 flex size-3.5 items-center justify-center\">\n <SelectPrimitive.ItemIndicator>\n <CheckIcon className=\"size-4\" />\n </SelectPrimitive.ItemIndicator>\n </span>\n <SelectPrimitive.ItemText>{children}</SelectPrimitive.ItemText>\n </SelectPrimitive.Item>\n);\n\n/**\n * Visual separator for grouping options in the dropdown\n *\n * Creates clear visual division between groups of related options,\n * improving readability and organization in complex select menus.\n *\n * @param className - Additional CSS classes for custom styling\n *\n * @example\n * ```tsx\n * <Select.Content>\n * <Select.Item value=\"recent\">Recent Files</Select.Item>\n * <Select.Separator />\n * <Select.Item value=\"all\">All Files</Select.Item>\n * </Select.Content>\n * ```\n */\nexport const SelectSeparator: FC<\n ComponentProps<typeof SelectPrimitive.Separator>\n> = ({ className, ...props }) => (\n <SelectPrimitive.Separator\n className={cn(\n '-mx-1 my-1 h-px',\n 'bg-neutral-200 dark:bg-neutral-800',\n className\n )}\n {...props}\n />\n);\n\n/**\n * Type definition for the compound Select component with all subcomponents\n */\ntype SelectType = typeof SelectRoot & {\n /** Group container for organizing related options */\n Group: typeof SelectGroup;\n /** Value display component for the trigger */\n Value: typeof SelectValue;\n /** Trigger button that opens the dropdown */\n Trigger: typeof SelectTrigger;\n /** Scroll up button for long lists */\n ScrollUpButton: typeof SelectScrollUpButton;\n /** Scroll down button for long lists */\n ScrollDownButton: typeof SelectScrollDownButton;\n /** Dropdown content container */\n Content: typeof SelectContent;\n /** Label component for option groups */\n Label: typeof SelectLabel;\n /** Individual selectable item */\n Item: typeof SelectItem;\n /** Visual separator between option groups */\n Separator: typeof SelectSeparator;\n};\n\n/**\n * Select - A comprehensive dropdown selection component\n *\n * A fully-featured select component built on Radix UI primitives with extensive customization,\n * accessibility features, and design system integration. Supports single selection with\n * keyboard navigation, validation states, and flexible content positioning.\n *\n * ## Key Features\n * - **Accessibility First**: Full keyboard navigation, screen reader support, and ARIA attributes\n * - **Flexible Positioning**: Multiple positioning strategies for optimal dropdown placement\n * - **Validation Integration**: Built-in support for form validation with visual feedback\n * - **Design System**: Consistent theming with design tokens and style variants\n * - **Responsive Design**: Works seamlessly across desktop and mobile devices\n * - **Rich Content**: Support for icons, separators, labels, and complex option layouts\n *\n * ## Use Cases\n * - Form field selections (theme, language, category)\n * - Settings and configuration options\n * - Filter and sort controls\n * - User preference selections\n * - Any single-choice dropdown interface\n *\n * ## Accessibility\n * - **Keyboard Navigation**: Arrow keys, Enter, Escape, and Home/End support\n * - **Screen Readers**: Proper ARIA labels and state announcements\n * - **Focus Management**: Intuitive focus flow and visual indicators\n * - **High Contrast**: Supports system high contrast modes\n *\n * ## Architecture\n * The Select component follows a compound component pattern with the following structure:\n * - `Select` (root): Manages state and provides context\n * - `Select.Trigger`: Button that displays current value and opens dropdown\n * - `Select.Value`: Displays the selected value with placeholder support\n * - `Select.Content`: Container for the dropdown options\n * - `Select.Item`: Individual selectable options\n * - `Select.Label`: Group labels for organizing options\n * - `Select.Separator`: Visual dividers between option groups\n *\n * @example\n * Basic usage with simple options:\n * ```tsx\n * <Select defaultValue=\"system\">\n * <Select.Trigger>\n * <Select.Value placeholder=\"Choose theme...\" />\n * </Select.Trigger>\n * <Select.Content>\n * <Select.Item value=\"light\">☀️ Light</Select.Item>\n * <Select.Item value=\"dark\">🌙 Dark</Select.Item>\n * <Select.Item value=\"system\">⚙️ System</Select.Item>\n * </Select.Content>\n * </Select>\n * ```\n *\n * @example\n * Advanced usage with groups and labels:\n * ```tsx\n * <Select>\n * <Select.Trigger validationStyleEnabled>\n * <Select.Value placeholder=\"Select category...\" />\n * </Select.Trigger>\n * <Select.Content>\n * <Select.Label>Web Technologies</Select.Label>\n * <Select.Item value=\"react\">React</Select.Item>\n * <Select.Item value=\"vue\">Vue</Select.Item>\n * <Select.Separator />\n * <Select.Label>Mobile</Select.Label>\n * <Select.Item value=\"react-native\">React Native</Select.Item>\n * <Select.Item value=\"flutter\">Flutter</Select.Item>\n * </Select.Content>\n * </Select>\n * ```\n *\n * @example\n * Form integration with validation:\n * ```tsx\n * <form>\n * <Select required name=\"country\">\n * <Select.Trigger validationStyleEnabled aria-invalid={hasError}>\n * <Select.Value placeholder=\"Select country...\" />\n * </Select.Trigger>\n * <Select.Content position={SelectContentPosition.ITEM_ALIGNED}>\n * <Select.Item value=\"us\">United States</Select.Item>\n * <Select.Item value=\"ca\">Canada</Select.Item>\n * <Select.Item value=\"uk\">United Kingdom</Select.Item>\n * </Select.Content>\n * </Select>\n * </form>\n * ```\n */\nexport const Select = SelectRoot as SelectType;\nSelect.Group = SelectGroup;\nSelect.Value = SelectValue;\nSelect.Trigger = SelectTrigger;\nSelect.ScrollUpButton = SelectScrollUpButton;\nSelect.ScrollDownButton = SelectScrollDownButton;\nSelect.Content = SelectContent;\nSelect.Label = SelectLabel;\nSelect.Item = SelectItem;\nSelect.Separator = SelectSeparator;\n"],"mappings":"qPAiBA,IAAY,EAAL,SAAA,EAAA,OAEL,GAAA,OAAA,SAEA,EAAA,aAAA,qBACD,CAED,MAAM,EAAa,EAAgB,KAC7B,EAAc,EAAgB,MAC9B,EAAc,EAAgB,MAmB9B,GAcD,CAAE,yBAAyB,GAAO,YAAW,WAAU,GAAG,KAC7D,EAAC,EAAgB,QAAjB,CACE,UAAW,EAET,4EACA,4DAGA,kFAGA,oBAGA,oCACA,YAGA,SACA,6BACA,uBACA,iCACA,sCAEA,kCACA,6CAGA,4CAGA,kDACA,4BACA,wBAGA,GAA0B,4CAE1B,EACD,CACD,GAAI,WAvCN,CAyCG,EACD,EAAC,EAAgB,KAAjB,CAAsB,QAAA,YACpB,EAAC,EAAD,CAAgB,UAAU,oBAAsB,CAAA,CAC3B,CAAA,CACC,GAWtB,GAED,CAAE,YAAW,GAAG,KACnB,EAAC,EAAgB,eAAjB,CACE,UAAW,EACT,uDACA,EACD,CACD,GAAI,WAEJ,EAAC,EAAD,EAAiB,CAAA,CACc,CAAA,CAW7B,GAED,CAAE,YAAW,GAAG,KACnB,EAAC,EAAgB,iBAAjB,CACE,UAAW,EACT,uDACA,EACD,CACD,GAAI,WAEJ,EAAC,EAAD,EAAmB,CAAA,CACc,CAAA,CAqBxB,GAER,CACH,YACA,WACA,WAAW,EAAsB,OACjC,GAAG,KAEH,EAAC,EAAgB,OAAjB,CAAA,SACE,EAAC,EAAgB,QAAjB,CACE,UAAW,EAET,kDACA,uBAGA,+BACA,YAGA,oDAGA,+DACA,6DACA,+DACA,yCACA,yCACA,yCACA,yCAGA,IAAa,UACX,kIAEF,EACD,CACS,WACV,GAAI,WA7BN,CA+BE,EAAC,EAAD,EAAwB,CAAA,CACxB,EAAC,EAAgB,SAAjB,CACE,UAAW,EACT,MACA,IAAa,UACX,gFACH,CAEA,WACwB,CAAA,CAC3B,EAAC,EAAD,EAA0B,CAAA,CACF,GACH,CAAA,CAuBd,GAAiE,CAC5E,YACA,GAAG,KAEH,EAAC,EAAgB,MAAjB,CACE,UAAW,EAAG,oCAAqC,EAAU,CAC7D,GAAI,EACJ,CAAA,CAmBE,GAA+D,CACnE,YACA,WACA,GAAG,KAEH,EAAC,EAAgB,KAAjB,CACE,UAAW,EACT,iMACA,EACD,CACD,GAAI,WALN,CAOE,EAAC,OAAD,CAAM,UAAU,sEACd,EAAC,EAAgB,cAAjB,CAAA,SACE,EAAC,EAAD,CAAW,UAAU,SAAW,CAAA,CACF,CAAA,CAC3B,CAAA,CACP,EAAC,EAAgB,SAAjB,CAA2B,WAAoC,CAAA,CAC1C,GAoBZ,GAER,CAAE,YAAW,GAAG,KACnB,EAAC,EAAgB,UAAjB,CACE,UAAW,EACT,kBACA,qCACA,EACD,CACD,GAAI,EACJ,CAAA,CAoHS,EAAS,EACtB,EAAO,MAAQ,EACf,EAAO,MAAQ,EACf,EAAO,QAAU,EACjB,EAAO,eAAiB,EACxB,EAAO,iBAAmB,EAC1B,EAAO,QAAU,EACjB,EAAO,MAAQ,EACf,EAAO,KAAO,EACd,EAAO,UAAY"}
|
|
1
|
+
{"version":3,"file":"Select.mjs","names":[],"sources":["../../../../src/components/Select/Select.tsx"],"sourcesContent":["'use client';\n\nimport * as SelectPrimitive from '@radix-ui/react-select';\nimport { cn } from '@utils/cn';\nimport {\n CheckIcon,\n ChevronDownIcon,\n ChevronsUpDown,\n ChevronUpIcon,\n} from 'lucide-react';\nimport type { ComponentProps, FC } from 'react';\n\n/**\n * Enum for Select content positioning strategies\n *\n * @enum SelectContentPosition\n */\nexport enum SelectContentPosition {\n /** Position relative to the trigger with automatic placement */\n POPPER = 'popper',\n /** Align content with the selected item */\n ITEM_ALIGNED = 'item-aligned',\n}\n\nconst SelectRoot = SelectPrimitive.Root;\nconst SelectGroup = SelectPrimitive.Group;\nconst SelectValue = SelectPrimitive.Value;\n\n/**\n * Select trigger button component that displays the current selection and opens the dropdown\n *\n * Features comprehensive styling with validation states, focus management, and accessibility support.\n * Uses design tokens for consistent theming across the application.\n *\n * @param validationStyleEnabled - Enables automatic success/error styling based on form validation state\n * @param className - Additional CSS classes for custom styling\n * @param children - Content to display inside the trigger (typically SelectValue)\n *\n * @example\n * ```tsx\n * <Select.Trigger validationStyleEnabled>\n * <Select.Value placeholder=\"Choose option...\" />\n * </Select.Trigger>\n * ```\n */\nconst SelectTrigger: FC<\n ComponentProps<typeof SelectPrimitive.Trigger> & {\n /**\n * Enables success/error border styling based on HTML5 validation state\n * @default false\n * @example\n * ```tsx\n * <Select.Trigger validationStyleEnabled>\n * <Select.Value placeholder=\"Required field\" />\n * </Select.Trigger>\n * ```\n */\n validationStyleEnabled?: boolean;\n }\n> = ({ validationStyleEnabled = false, className, children, ...props }) => (\n <SelectPrimitive.Trigger\n suppressHydrationWarning\n className={cn(\n // Base layout and typography\n 'flex w-full cursor-pointer items-center justify-between whitespace-nowrap',\n 'select-text text-base shadow-none outline-none md:text-sm',\n\n // Corner shape\n 'rounded-xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-2xl',\n\n // Spacing\n 'px-2 py-3 md:py-2',\n\n // Background and text\n 'bg-neutral-50 dark:bg-neutral-950',\n 'text-text',\n\n // Focus ring\n 'ring-0',\n 'focus-visible:outline-none',\n 'focus-visible:ring-3',\n 'focus-visible:ring-neutral-200',\n 'dark:focus-visible:ring-neutral-500',\n\n 'focus-visible:ring-offset-white',\n 'dark:focus-visible:ring-offset-neutral-500',\n\n // Remove box-shadow\n '[box-shadow:none] focus:[box-shadow:none]',\n\n // States\n 'disabled:cursor-not-allowed disabled:opacity-50',\n 'aria-invalid:border-error',\n '[&>span]:line-clamp-1',\n\n // Validation styles\n validationStyleEnabled && 'valid:border-success invalid:border-error',\n\n className\n )}\n {...props}\n >\n {children}\n <SelectPrimitive.Icon asChild>\n <ChevronsUpDown className=\"size-4 opacity-50\" />\n </SelectPrimitive.Icon>\n </SelectPrimitive.Trigger>\n);\n\n/**\n * Scroll up button for select content with long lists\n *\n * Automatically appears when content is scrollable upward, providing intuitive navigation\n * for users with large option lists.\n *\n * @param className - Additional CSS classes for custom styling\n */\nconst SelectScrollUpButton: FC<\n ComponentProps<typeof SelectPrimitive.ScrollUpButton>\n> = ({ className, ...props }) => (\n <SelectPrimitive.ScrollUpButton\n className={cn(\n 'flex cursor-default items-center justify-center py-1',\n className\n )}\n {...props}\n >\n <ChevronUpIcon />\n </SelectPrimitive.ScrollUpButton>\n);\n\n/**\n * Scroll down button for select content with long lists\n *\n * Automatically appears when content is scrollable downward, providing clear visual\n * indication of additional options below the current view.\n *\n * @param className - Additional CSS classes for custom styling\n */\nconst SelectScrollDownButton: FC<\n ComponentProps<typeof SelectPrimitive.ScrollDownButton>\n> = ({ className, ...props }) => (\n <SelectPrimitive.ScrollDownButton\n className={cn(\n 'flex cursor-default items-center justify-center py-1',\n className\n )}\n {...props}\n >\n <ChevronDownIcon />\n </SelectPrimitive.ScrollDownButton>\n);\n\n/**\n * Select dropdown content container with positioning and animation\n *\n * Provides the dropdown interface containing all selectable options. Features smooth\n * animations, flexible positioning strategies, and responsive design for optimal UX.\n *\n * @param position - Positioning strategy for the dropdown content\n * @param className - Additional CSS classes for custom styling\n * @param children - Select items, labels, and separators\n *\n * @example\n * ```tsx\n * <Select.Content position={SelectContentPosition.POPPER}>\n * <Select.Item value=\"option1\">Option 1</Select.Item>\n * <Select.Item value=\"option2\">Option 2</Select.Item>\n * </Select.Content>\n * ```\n */\nexport const SelectContent: FC<\n ComponentProps<typeof SelectPrimitive.Content>\n> = ({\n className,\n children,\n position = SelectContentPosition.POPPER,\n ...props\n}) => (\n <SelectPrimitive.Portal>\n <SelectPrimitive.Content\n className={cn(\n // Base styles\n 'relative z-50 max-h-96 min-w-32 overflow-hidden',\n 'rounded-xl shadow-md',\n\n // Background and text\n 'bg-white dark:bg-neutral-950',\n 'text-text',\n\n // Border\n 'border border-neutral-200 dark:border-neutral-800',\n\n // Animations\n 'data-[state=closed]:animate-out data-[state=open]:animate-in',\n 'data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0',\n 'data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95',\n 'data-[side=bottom]:slide-in-from-top-2',\n 'data-[side=left]:slide-in-from-right-2',\n 'data-[side=right]:slide-in-from-left-2',\n 'data-[side=top]:slide-in-from-bottom-2',\n\n // Positioning adjustments\n position === 'popper' &&\n 'data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=bottom]:translate-y-1 data-[side=top]:-translate-y-1',\n\n className\n )}\n position={position}\n {...props}\n >\n <SelectScrollUpButton />\n <SelectPrimitive.Viewport\n className={cn(\n 'p-1',\n position === 'popper' &&\n 'h-(--radix-select-trigger-height) w-full min-w-(--radix-select-trigger-width)'\n )}\n >\n {children}\n </SelectPrimitive.Viewport>\n <SelectScrollDownButton />\n </SelectPrimitive.Content>\n </SelectPrimitive.Portal>\n);\n\n/**\n * Label component for grouping select options\n *\n * Provides semantic grouping and visual organization of related options within\n * the select dropdown. Enhances accessibility and user experience.\n *\n * @param className - Additional CSS classes for custom styling\n *\n * @example\n * ```tsx\n * <Select.Content>\n * <Select.Label>Fruits</Select.Label>\n * <Select.Item value=\"apple\">Apple</Select.Item>\n * <Select.Item value=\"banana\">Banana</Select.Item>\n * <Select.Separator />\n * <Select.Label>Vegetables</Select.Label>\n * <Select.Item value=\"carrot\">Carrot</Select.Item>\n * </Select.Content>\n * ```\n */\nexport const SelectLabel: FC<ComponentProps<typeof SelectPrimitive.Label>> = ({\n className,\n ...props\n}) => (\n <SelectPrimitive.Label\n className={cn('px-1 py-0.5 font-semibold text-sm', className)}\n {...props}\n />\n);\n\n/**\n * Individual selectable item within the dropdown\n *\n * Represents a single option that users can select. Features hover states,\n * selection indicators, and keyboard navigation support for accessible interaction.\n *\n * @param className - Additional CSS classes for custom styling\n * @param children - The display text/content for the option\n *\n * @example\n * ```tsx\n * <Select.Item value=\"dark-mode\">\n * 🌙 Dark Mode\n * </Select.Item>\n * ```\n */\nconst SelectItem: FC<ComponentProps<typeof SelectPrimitive.Item>> = ({\n className,\n children,\n ...props\n}) => (\n <SelectPrimitive.Item\n className={cn(\n 'relative flex w-full cursor-pointer select-none items-center rounded-lg py-1.5 pr-8 pl-2 text-sm outline-hidden focus:bg-neutral/10 data-disabled:pointer-events-none data-disabled:opacity-50',\n className\n )}\n {...props}\n >\n <span className=\"absolute right-2 flex size-3.5 items-center justify-center\">\n <SelectPrimitive.ItemIndicator>\n <CheckIcon className=\"size-4\" />\n </SelectPrimitive.ItemIndicator>\n </span>\n <SelectPrimitive.ItemText>{children}</SelectPrimitive.ItemText>\n </SelectPrimitive.Item>\n);\n\n/**\n * Visual separator for grouping options in the dropdown\n *\n * Creates clear visual division between groups of related options,\n * improving readability and organization in complex select menus.\n *\n * @param className - Additional CSS classes for custom styling\n *\n * @example\n * ```tsx\n * <Select.Content>\n * <Select.Item value=\"recent\">Recent Files</Select.Item>\n * <Select.Separator />\n * <Select.Item value=\"all\">All Files</Select.Item>\n * </Select.Content>\n * ```\n */\nexport const SelectSeparator: FC<\n ComponentProps<typeof SelectPrimitive.Separator>\n> = ({ className, ...props }) => (\n <SelectPrimitive.Separator\n className={cn(\n '-mx-1 my-1 h-px',\n 'bg-neutral-200 dark:bg-neutral-800',\n className\n )}\n {...props}\n />\n);\n\n/**\n * Type definition for the compound Select component with all subcomponents\n */\ntype SelectType = typeof SelectRoot & {\n /** Group container for organizing related options */\n Group: typeof SelectGroup;\n /** Value display component for the trigger */\n Value: typeof SelectValue;\n /** Trigger button that opens the dropdown */\n Trigger: typeof SelectTrigger;\n /** Scroll up button for long lists */\n ScrollUpButton: typeof SelectScrollUpButton;\n /** Scroll down button for long lists */\n ScrollDownButton: typeof SelectScrollDownButton;\n /** Dropdown content container */\n Content: typeof SelectContent;\n /** Label component for option groups */\n Label: typeof SelectLabel;\n /** Individual selectable item */\n Item: typeof SelectItem;\n /** Visual separator between option groups */\n Separator: typeof SelectSeparator;\n};\n\n/**\n * Select - A comprehensive dropdown selection component\n *\n * A fully-featured select component built on Radix UI primitives with extensive customization,\n * accessibility features, and design system integration. Supports single selection with\n * keyboard navigation, validation states, and flexible content positioning.\n *\n * ## Key Features\n * - **Accessibility First**: Full keyboard navigation, screen reader support, and ARIA attributes\n * - **Flexible Positioning**: Multiple positioning strategies for optimal dropdown placement\n * - **Validation Integration**: Built-in support for form validation with visual feedback\n * - **Design System**: Consistent theming with design tokens and style variants\n * - **Responsive Design**: Works seamlessly across desktop and mobile devices\n * - **Rich Content**: Support for icons, separators, labels, and complex option layouts\n *\n * ## Use Cases\n * - Form field selections (theme, language, category)\n * - Settings and configuration options\n * - Filter and sort controls\n * - User preference selections\n * - Any single-choice dropdown interface\n *\n * ## Accessibility\n * - **Keyboard Navigation**: Arrow keys, Enter, Escape, and Home/End support\n * - **Screen Readers**: Proper ARIA labels and state announcements\n * - **Focus Management**: Intuitive focus flow and visual indicators\n * - **High Contrast**: Supports system high contrast modes\n *\n * ## Architecture\n * The Select component follows a compound component pattern with the following structure:\n * - `Select` (root): Manages state and provides context\n * - `Select.Trigger`: Button that displays current value and opens dropdown\n * - `Select.Value`: Displays the selected value with placeholder support\n * - `Select.Content`: Container for the dropdown options\n * - `Select.Item`: Individual selectable options\n * - `Select.Label`: Group labels for organizing options\n * - `Select.Separator`: Visual dividers between option groups\n *\n * @example\n * Basic usage with simple options:\n * ```tsx\n * <Select defaultValue=\"system\">\n * <Select.Trigger>\n * <Select.Value placeholder=\"Choose theme...\" />\n * </Select.Trigger>\n * <Select.Content>\n * <Select.Item value=\"light\">☀️ Light</Select.Item>\n * <Select.Item value=\"dark\">🌙 Dark</Select.Item>\n * <Select.Item value=\"system\">⚙️ System</Select.Item>\n * </Select.Content>\n * </Select>\n * ```\n *\n * @example\n * Advanced usage with groups and labels:\n * ```tsx\n * <Select>\n * <Select.Trigger validationStyleEnabled>\n * <Select.Value placeholder=\"Select category...\" />\n * </Select.Trigger>\n * <Select.Content>\n * <Select.Label>Web Technologies</Select.Label>\n * <Select.Item value=\"react\">React</Select.Item>\n * <Select.Item value=\"vue\">Vue</Select.Item>\n * <Select.Separator />\n * <Select.Label>Mobile</Select.Label>\n * <Select.Item value=\"react-native\">React Native</Select.Item>\n * <Select.Item value=\"flutter\">Flutter</Select.Item>\n * </Select.Content>\n * </Select>\n * ```\n *\n * @example\n * Form integration with validation:\n * ```tsx\n * <form>\n * <Select required name=\"country\">\n * <Select.Trigger validationStyleEnabled aria-invalid={hasError}>\n * <Select.Value placeholder=\"Select country...\" />\n * </Select.Trigger>\n * <Select.Content position={SelectContentPosition.ITEM_ALIGNED}>\n * <Select.Item value=\"us\">United States</Select.Item>\n * <Select.Item value=\"ca\">Canada</Select.Item>\n * <Select.Item value=\"uk\">United Kingdom</Select.Item>\n * </Select.Content>\n * </Select>\n * </form>\n * ```\n */\nexport const Select = SelectRoot as SelectType;\nSelect.Group = SelectGroup;\nSelect.Value = SelectValue;\nSelect.Trigger = SelectTrigger;\nSelect.ScrollUpButton = SelectScrollUpButton;\nSelect.ScrollDownButton = SelectScrollDownButton;\nSelect.Content = SelectContent;\nSelect.Label = SelectLabel;\nSelect.Item = SelectItem;\nSelect.Separator = SelectSeparator;\n"],"mappings":"qPAiBA,IAAY,EAAL,SAAA,EAAA,OAEL,GAAA,OAAA,SAEA,EAAA,aAAA,qBACD,CAED,MAAM,EAAa,EAAgB,KAC7B,EAAc,EAAgB,MAC9B,EAAc,EAAgB,MAmB9B,GAcD,CAAE,yBAAyB,GAAO,YAAW,WAAU,GAAG,KAC7D,EAAC,EAAgB,QAAjB,CACE,yBAAA,GACA,UAAW,EAET,4EACA,4DAGA,kFAGA,oBAGA,oCACA,YAGA,SACA,6BACA,uBACA,iCACA,sCAEA,kCACA,6CAGA,4CAGA,kDACA,4BACA,wBAGA,GAA0B,4CAE1B,EACD,CACD,GAAI,WAxCN,CA0CG,EACD,EAAC,EAAgB,KAAjB,CAAsB,QAAA,YACpB,EAAC,EAAD,CAAgB,UAAU,oBAAsB,CAAA,CAC3B,CAAA,CACC,GAWtB,GAED,CAAE,YAAW,GAAG,KACnB,EAAC,EAAgB,eAAjB,CACE,UAAW,EACT,uDACA,EACD,CACD,GAAI,WAEJ,EAAC,EAAD,EAAiB,CAAA,CACc,CAAA,CAW7B,GAED,CAAE,YAAW,GAAG,KACnB,EAAC,EAAgB,iBAAjB,CACE,UAAW,EACT,uDACA,EACD,CACD,GAAI,WAEJ,EAAC,EAAD,EAAmB,CAAA,CACc,CAAA,CAqBxB,GAER,CACH,YACA,WACA,WAAW,EAAsB,OACjC,GAAG,KAEH,EAAC,EAAgB,OAAjB,CAAA,SACE,EAAC,EAAgB,QAAjB,CACE,UAAW,EAET,kDACA,uBAGA,+BACA,YAGA,oDAGA,+DACA,6DACA,+DACA,yCACA,yCACA,yCACA,yCAGA,IAAa,UACX,kIAEF,EACD,CACS,WACV,GAAI,WA7BN,CA+BE,EAAC,EAAD,EAAwB,CAAA,CACxB,EAAC,EAAgB,SAAjB,CACE,UAAW,EACT,MACA,IAAa,UACX,gFACH,CAEA,WACwB,CAAA,CAC3B,EAAC,EAAD,EAA0B,CAAA,CACF,GACH,CAAA,CAuBd,GAAiE,CAC5E,YACA,GAAG,KAEH,EAAC,EAAgB,MAAjB,CACE,UAAW,EAAG,oCAAqC,EAAU,CAC7D,GAAI,EACJ,CAAA,CAmBE,GAA+D,CACnE,YACA,WACA,GAAG,KAEH,EAAC,EAAgB,KAAjB,CACE,UAAW,EACT,iMACA,EACD,CACD,GAAI,WALN,CAOE,EAAC,OAAD,CAAM,UAAU,sEACd,EAAC,EAAgB,cAAjB,CAAA,SACE,EAAC,EAAD,CAAW,UAAU,SAAW,CAAA,CACF,CAAA,CAC3B,CAAA,CACP,EAAC,EAAgB,SAAjB,CAA2B,WAAoC,CAAA,CAC1C,GAoBZ,GAER,CAAE,YAAW,GAAG,KACnB,EAAC,EAAgB,UAAjB,CACE,UAAW,EACT,kBACA,qCACA,EACD,CACD,GAAI,EACJ,CAAA,CAoHS,EAAS,EACtB,EAAO,MAAQ,EACf,EAAO,MAAQ,EACf,EAAO,QAAU,EACjB,EAAO,eAAiB,EACxB,EAAO,iBAAmB,EAC1B,EAAO,QAAU,EACjB,EAAO,MAAQ,EACf,EAAO,KAAO,EACd,EAAO,UAAY"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{Container as e,ContainerBackground as t,ContainerBorderColor as n,ContainerGap as r,ContainerPadding as i,ContainerRoundedSize as a,ContainerSeparator as o,ContainerTransparency as s,containerVariants as c}from"./Container/index.mjs";import{Loader as l}from"./Loader/index.mjs";import{Button as u,ButtonColor as d,ButtonSize as f,ButtonTextAlign as p,ButtonVariant as m,buttonVariants as h}from"./Button/Button.mjs";import{MaxHeightSmoother as g}from"./MaxHeightSmoother/index.mjs";import{Accordion as _}from"./Accordion/Accordion.mjs";import{Avatar as v,getCapitals as y}from"./Avatar/index.mjs";import{Badge as b,BadgeColor as x,BadgeSize as S,BadgeVariant as C,badgeVariants as w}from"./Badge/index.mjs";import{Link as T,LinkColor as E,LinkRoundedSize as D,LinkSize as O,LinkUnderlined as k,LinkVariant as A,checkIsExternalLink as j,isTextChildren as M,linkVariants as N}from"./Link/Link.mjs";import{Breadcrumb as P}from"./Breadcrumb/index.mjs";import{Checkbox as F,CheckboxColor as I,CheckboxSize as L,checkboxVariants as R}from"./Input/Checkbox.mjs";import{Input as z,InputSize as B,InputVariant as V,inputVariants as H}from"./Input/Input.mjs";import{InputPassword as U}from"./Input/InputPassword.mjs";import{InputIndicator as W,InputOTP as G,InputOTPGroup as K,InputOTPSeparator as q,InputOTPSlot as J,OTPInput as Y,OTPInputContext as X,inputSlotVariants as Z,usePasswordManagerBadge as Q,usePrevious as $}from"./Input/OTPInput.mjs";import{SearchInput as ee}from"./Input/SearchInput.mjs";import{Browser as te}from"./Browser/Browser.mjs";import{KeyList as ne,KeyboardShortcut as re}from"./KeyboardShortcut/KeyboardShortcut.mjs";import{Detail as ie,PopoverStatic as ae,PopoverXAlign as oe,PopoverYAlign as se}from"./Popover/static.mjs";import{Popover as ce}from"./Popover/dynamic.mjs";import{Carousel as le}from"./Carousel/index.mjs";import{ClickOutsideDiv as ue}from"./ClickOutsideDiv/index.mjs";import{CollapsibleTable as de}from"./CollapsibleTable/CollapsibleTable.mjs";import{Command as fe,CommandRoot as pe}from"./Command/index.mjs";import{PressableSpan as me}from"./PressableSpan/PressableSpan.mjs";import{ContentSelector as he}from"./ContentSelector/ContentSelector.mjs";import{CopyButton as ge}from"./CopyButton/index.mjs";import{CopyToClipboard as _e,useCopyToClipboard as ve}from"./CopyToClipboard/index.mjs";import{EditableFieldInput as ye}from"./EditableField/EditableFieldInput.mjs";import{TextArea as be}from"./TextArea/TextArea.mjs";import{AutoSizedTextArea as xe}from"./TextArea/AutoSizeTextArea.mjs";import{AutoCompleteTextarea as Se,useDebounce as Ce}from"./TextArea/AutocompleteTextArea.mjs";import{EditableFieldTextArea as we}from"./EditableField/EditableFieldTextArea.mjs";import{DictionaryEditor as Te}from"./DictionaryEditor/DictionaryEditor.mjs";import{DropDown as Ee,DropDownAlign as De,DropDownYAlign as Oe}from"./DropDown/index.mjs";import{SwitchSelector as ke,SwitchSelectorColor as Ae,SwitchSelectorSize as je}from"./SwitchSelector/index.mjs";import{LocaleSwitcherContentProvider as Me,useLocaleSwitcherContent as Ne}from"./LocaleSwitcherContentDropDown/LocaleSwitcherContentContext.mjs";import{LocaleSwitcherContent as Pe}from"./LocaleSwitcherContentDropDown/LocaleSwitcherContent.mjs";import{Label as Fe}from"./Label/index.mjs";import{H1 as Ie,H2 as Le,H3 as Re,H4 as ze,H5 as Be,H6 as Ve}from"./Headers/index.mjs";import{ExpandCollapse as He}from"./ExpandCollapse/ExpandCollapse.mjs";import{CodeBlock as Ue,CodeDefault as We}from"./IDE/CodeBlockClient.mjs";import{MultiSelect as Ge}from"./Select/Multiselect.mjs";import{Select as Ke,SelectContent as qe,SelectContentPosition as Je,SelectLabel as Ye,SelectSeparator as Xe}from"./Select/Select.mjs";import{Code as Ze}from"./IDE/Code.mjs";import{TabSelector as Qe,TabSelectorColor as $e}from"./TabSelector/TabSelector.mjs";import{Tab as et}from"./Tab/Tab.mjs";import{Modal as tt,ModalSize as nt}from"./Modal/Modal.mjs";import{Table as rt}from"./Table/Table.mjs";import{MarkdownRenderer as it,getIntlayerMarkdownOptions as at}from"./MarkDownRender/MarkDownRender.mjs";import{TextEditor as ot,TextEditorContainer as st,traceKeys as ct}from"./DictionaryFieldEditor/ContentEditorView/TextEditor.mjs";import{KeyPathBreadcrumb as lt}from"./DictionaryFieldEditor/KeyPathBreadcrumb.mjs";import{ContentEditor as ut}from"./DictionaryFieldEditor/ContentEditor.mjs";import{useFormField as dt}from"./Form/FormField.mjs";import{InformationTag as ft}from"./InformationTag/index.mjs";import{useForm as pt}from"./Form/FormBase.mjs";import{Form as mt}from"./Form/Form.mjs";import{DictionaryCreationForm as ht}from"./DictionaryFieldEditor/DictionaryCreationForm/DictionaryCreationForm.mjs";import{SaveForm as gt}from"./DictionaryFieldEditor/SaveForm/SaveForm.mjs";import{DictionaryFieldEditor as _t}from"./DictionaryFieldEditor/DictionaryFieldEditor.mjs";import{VersionSwitcherProvider as vt,useVersionSwitcher as yt}from"./DictionaryFieldEditor/VersionSwitcherDropDown/VersionSwitcherContext.mjs";import{VersionSwitcher as bt}from"./DictionaryFieldEditor/VersionSwitcherDropDown/VersionSwitcher.mjs";import{Flag as xt}from"./Flags/Flag.mjs";import{flags_exports as St}from"./Flags/flags.mjs";import{Logo as Ct}from"./Logo/Logo.mjs";import{LogoTextOnly as wt}from"./Logo/LogoTextOnly.mjs";import{LogoWithText as Tt}from"./Logo/LogoWithText.mjs";import{LogoWithTextBelow as Et}from"./Logo/LogoWithTextBelow.mjs";import{DiscordLogo as Dt}from"./SocialNetworks/DiscordLogo.mjs";import{InstagramLogo as Ot}from"./SocialNetworks/InstagramLogo.mjs";import{LinkedInLogo as kt}from"./SocialNetworks/LinkedInLogo.mjs";import{ProductHuntLogo as At}from"./SocialNetworks/ProductHuntLogo.mjs";import{TiktokLogo as jt}from"./SocialNetworks/TiktokLogo.mjs";import{XLogo as Mt}from"./SocialNetworks/XLogo.mjs";import{YoutubeLogo as Nt}from"./SocialNetworks/YoutubeLogo.mjs";import{FacebookLogo as Pt}from"./SocialNetworks/FacebookLogo.mjs";import{SocialNetworks as Ft}from"./SocialNetworks/index.mjs";import{Footer as It}from"./Footer/index.mjs";import{HeightResizer as Lt}from"./HeightResizer/index.mjs";import{HideShow as Rt}from"./HideShow/index.mjs";import{HTMLRenderer as zt,getIntlayerHTMLOptions as Bt}from"./HTMLRender/HTMLRender.mjs";import{FileList as Vt}from"./IDE/FileList.mjs";import{WithResizer as Ht}from"./WithResizer/index.mjs";import{IDE as Ut}from"./IDE/IDE.mjs";import{KeyboardScreenAdapter as Wt}from"./KeyboardScreenAdapter/index.mjs";import{LanguageBackground as Gt,LanguageSection as Kt}from"./LanguageBackground/index.mjs";import{LocaleSwitcher as qt}from"./LocaleSwitcherDropDown/LocaleSwitcher.mjs";import{MaxWidthSmoother as Jt}from"./MaxWidthSmoother/index.mjs";import{Navbar as Yt}from"./Navbar/index.mjs";import{NumberItemsSelector as Xt}from"./Pagination/NumberItemsSelector.mjs";import{Pagination as Zt,PaginationSize as Qt,PaginationVariant as $t,paginationVariants as en}from"./Pagination/Pagination.mjs";import{ShowingResultsNumberItems as tn}from"./Pagination/ShowingResultsNumberItems.mjs";import{DotPattern as nn}from"./Pattern/DotPattern.mjs";import{GridPattern as rn}from"./Pattern/GridPattern.mjs";import{Spotlight as an}from"./Pattern/SpotLight.mjs";import{drawerManager as on,useRightDrawer as sn}from"./RightDrawer/useRightDrawer.mjs";import{RightDrawer as cn}from"./RightDrawer/RightDrawer.mjs";import{Tag as ln,TagBackground as un,TagBorder as dn,TagColor as fn,TagRoundedSize as pn,TagSize as mn}from"./Tag/index.mjs";import{Terminal as hn}from"./Terminal/Terminal.mjs";import{Modes as gn}from"./ThemeSwitcherDropDown/types.mjs";import{DesktopThemeSwitcher as _n}from"./ThemeSwitcherDropDown/DesktopThemeSwitcher.mjs";import{MobileThemeSwitcher as vn}from"./ThemeSwitcherDropDown/MobileThemeSwitcher.mjs";import{Toast as yn,ToastAction as bn,ToastClose as xn,ToastDescription as Sn,ToastProvider as Cn,ToastTitle as wn,ToastViewport as Tn}from"./Toaster/Toast.mjs";import{reducer as En,toast as Dn,useToast as On}from"./Toaster/useToast.mjs";import{Toaster as kn}from"./Toaster/Toaster.mjs";export{_ as Accordion,Se as AutoCompleteTextarea,xe as AutoSizedTextArea,v as Avatar,b as Badge,x as BadgeColor,S as BadgeSize,C as BadgeVariant,P as Breadcrumb,te as Browser,u as Button,d as ButtonColor,f as ButtonSize,p as ButtonTextAlign,m as ButtonVariant,le as Carousel,F as Checkbox,I as CheckboxColor,L as CheckboxSize,ue as ClickOutsideDiv,Ze as Code,Ue as CodeBlock,We as CodeDefault,de as CollapsibleTable,fe as Command,pe as CommandRoot,e as Container,t as ContainerBackground,n as ContainerBorderColor,r as ContainerGap,i as ContainerPadding,a as ContainerRoundedSize,o as ContainerSeparator,s as ContainerTransparency,ut as ContentEditor,he as ContentSelector,ge as CopyButton,_e as CopyToClipboard,_n as DesktopThemeSwitcher,ie as Detail,ht as DictionaryCreationForm,Te as DictionaryEditor,_t as DictionaryFieldEditor,Dt as DiscordLogo,nn as DotPattern,Ee as DropDown,De as DropDownAlign,Oe as DropDownYAlign,ye as EditableFieldInput,we as EditableFieldTextArea,He as ExpandCollapse,Pt as FacebookLogo,Vt as FileList,xt as Flag,St as Flags,It as Footer,mt as Form,rn as GridPattern,Ie as H1,Le as H2,Re as H3,ze as H4,Be as H5,Ve as H6,zt as HTMLRenderer,Lt as HeightResizer,Rt as HideShow,Ut as IDE,ft as InformationTag,z as Input,W as InputIndicator,G as InputOTP,K as InputOTPGroup,q as InputOTPSeparator,J as InputOTPSlot,U as InputPassword,B as InputSize,V as InputVariant,Ot as InstagramLogo,ne as KeyList,lt as KeyPathBreadcrumb,Wt as KeyboardScreenAdapter,re as KeyboardShortcut,Fe as Label,Gt as LanguageBackground,Kt as LanguageSection,T as Link,E as LinkColor,D as LinkRoundedSize,O as LinkSize,k as LinkUnderlined,A as LinkVariant,kt as LinkedInLogo,l as Loader,qt as LocaleSwitcher,Pe as LocaleSwitcherContent,Me as LocaleSwitcherContentProvider,Ct as Logo,wt as LogoTextOnly,Tt as LogoWithText,Et as LogoWithTextBelow,it as MarkdownRenderer,g as MaxHeightSmoother,Jt as MaxWidthSmoother,vn as MobileThemeSwitcher,tt as Modal,nt as ModalSize,gn as Modes,Ge as MultiSelect,Yt as Navbar,Xt as NumberItemsSelector,Y as OTPInput,X as OTPInputContext,Zt as Pagination,Qt as PaginationSize,$t as PaginationVariant,ce as Popover,ae as PopoverStatic,oe as PopoverXAlign,se as PopoverYAlign,me as PressableSpan,At as ProductHuntLogo,cn as RightDrawer,gt as SaveForm,ee as SearchInput,Ke as Select,qe as SelectContent,Je as SelectContentPosition,Ye as SelectLabel,Xe as SelectSeparator,tn as ShowingResultsNumberItems,Ft as SocialNetworks,an as Spotlight,ke as SwitchSelector,Ae as SwitchSelectorColor,je as SwitchSelectorSize,et as Tab,Qe as TabSelector,$e as TabSelectorColor,rt as Table,ln as Tag,un as TagBackground,dn as TagBorder,fn as TagColor,pn as TagRoundedSize,mn as TagSize,hn as Terminal,be as TextArea,ot as TextEditor,st as TextEditorContainer,jt as TiktokLogo,yn as Toast,bn as ToastAction,xn as ToastClose,Sn as ToastDescription,Cn as ToastProvider,wn as ToastTitle,Tn as ToastViewport,kn as Toaster,bt as VersionSwitcher,vt as VersionSwitcherProvider,Ht as WithResizer,Mt as XLogo,Nt as YoutubeLogo,w as badgeVariants,h as buttonVariants,j as checkIsExternalLink,R as checkboxVariants,c as containerVariants,on as drawerManager,y as getCapitals,Bt as getIntlayerHTMLOptions,at as getIntlayerMarkdownOptions,Z as inputSlotVariants,H as inputVariants,M as isTextChildren,N as linkVariants,en as paginationVariants,En as reducer,Dn as toast,ct as traceKeys,ve as useCopyToClipboard,Ce as useDebounce,pt as useForm,dt as useFormField,Ne as useLocaleSwitcherContent,Q as usePasswordManagerBadge,$ as usePrevious,sn as useRightDrawer,On as useToast,yt as useVersionSwitcher};
|
|
1
|
+
import{Container as e,ContainerBackground as t,ContainerBorderColor as n,ContainerGap as r,ContainerPadding as i,ContainerRoundedSize as a,ContainerSeparator as o,ContainerTransparency as s,containerVariants as c}from"./Container/index.mjs";import{Loader as l}from"./Loader/index.mjs";import{Button as u,ButtonColor as d,ButtonSize as f,ButtonTextAlign as p,ButtonVariant as m,buttonVariants as h}from"./Button/Button.mjs";import{MaxHeightSmoother as g}from"./MaxHeightSmoother/index.mjs";import{Accordion as _}from"./Accordion/Accordion.mjs";import{Avatar as v,getCapitals as y}from"./Avatar/index.mjs";import{Badge as b,BadgeColor as x,BadgeSize as S,BadgeVariant as C,badgeVariants as w}from"./Badge/index.mjs";import{Link as T,LinkColor as E,LinkRoundedSize as D,LinkSize as O,LinkUnderlined as k,LinkVariant as A,checkIsExternalLink as j,isTextChildren as M,linkVariants as N}from"./Link/Link.mjs";import{Breadcrumb as P}from"./Breadcrumb/index.mjs";import{Checkbox as F,CheckboxColor as I,CheckboxSize as L,checkboxVariants as R}from"./Input/Checkbox.mjs";import{Input as z,InputSize as B,InputVariant as V,inputVariants as H}from"./Input/Input.mjs";import{InputPassword as U}from"./Input/InputPassword.mjs";import{InputIndicator as W,InputOTP as G,InputOTPGroup as K,InputOTPSeparator as q,InputOTPSlot as J,OTPInput as Y,OTPInputContext as X,inputSlotVariants as Z,usePasswordManagerBadge as Q,usePrevious as $}from"./Input/OTPInput.mjs";import{SearchInput as ee}from"./Input/SearchInput.mjs";import{Browser as te}from"./Browser/Browser.mjs";import{KeyList as ne,KeyboardShortcut as re}from"./KeyboardShortcut/KeyboardShortcut.mjs";import{Detail as ie,PopoverStatic as ae,PopoverXAlign as oe,PopoverYAlign as se}from"./Popover/static.mjs";import{Popover as ce}from"./Popover/dynamic.mjs";import{Carousel as le}from"./Carousel/index.mjs";import{ClickOutsideDiv as ue}from"./ClickOutsideDiv/index.mjs";import{CollapsibleTable as de}from"./CollapsibleTable/CollapsibleTable.mjs";import{Command as fe,CommandRoot as pe}from"./Command/index.mjs";import{PressableSpan as me}from"./PressableSpan/PressableSpan.mjs";import{ContentSelector as he}from"./ContentSelector/ContentSelector.mjs";import{CopyButton as ge}from"./CopyButton/index.mjs";import{CopyToClipboard as _e,useCopyToClipboard as ve}from"./CopyToClipboard/index.mjs";import{EditableFieldInput as ye}from"./EditableField/EditableFieldInput.mjs";import{TextArea as be}from"./TextArea/TextArea.mjs";import{AutoSizedTextArea as xe}from"./TextArea/AutoSizeTextArea.mjs";import{AutoCompleteTextarea as Se,useDebounce as Ce}from"./TextArea/AutocompleteTextArea.mjs";import{EditableFieldTextArea as we}from"./EditableField/EditableFieldTextArea.mjs";import{DictionaryEditor as Te}from"./DictionaryEditor/DictionaryEditor.mjs";import{DropDown as Ee,DropDownAlign as De,DropDownYAlign as Oe}from"./DropDown/index.mjs";import{SwitchSelector as ke,SwitchSelectorColor as Ae,SwitchSelectorSize as je}from"./SwitchSelector/index.mjs";import{LocaleSwitcherContentProvider as Me,useLocaleSwitcherContent as Ne}from"./LocaleSwitcherContentDropDown/LocaleSwitcherContentContext.mjs";import{LocaleSwitcherContent as Pe}from"./LocaleSwitcherContentDropDown/LocaleSwitcherContent.mjs";import{Label as Fe}from"./Label/index.mjs";import{H1 as Ie,H2 as Le,H3 as Re,H4 as ze,H5 as Be,H6 as Ve}from"./Headers/index.mjs";import{ExpandCollapse as He}from"./ExpandCollapse/ExpandCollapse.mjs";import{CodeBlock as Ue,CodeDefault as We}from"./IDE/CodeBlockClient.mjs";import{MultiSelect as Ge}from"./Select/Multiselect.mjs";import{Select as Ke,SelectContent as qe,SelectContentPosition as Je,SelectLabel as Ye,SelectSeparator as Xe}from"./Select/Select.mjs";import{Code as Ze}from"./IDE/Code.mjs";import{TabSelector as Qe,TabSelectorColor as $e}from"./TabSelector/TabSelector.mjs";import{Tab as et}from"./Tab/Tab.mjs";import{Modal as tt,ModalSize as nt}from"./Modal/Modal.mjs";import{Table as rt}from"./Table/Table.mjs";import{MarkdownRenderer as it,baseMarkdownComponents as at,getIntlayerMarkdownOptions as ot}from"./MarkDownRender/MarkDownRender.mjs";import{TextEditor as st,TextEditorContainer as ct,traceKeys as lt}from"./DictionaryFieldEditor/ContentEditorView/TextEditor.mjs";import{KeyPathBreadcrumb as ut}from"./DictionaryFieldEditor/KeyPathBreadcrumb.mjs";import{ContentEditor as dt}from"./DictionaryFieldEditor/ContentEditor.mjs";import{useFormField as ft}from"./Form/FormField.mjs";import{InformationTag as pt}from"./InformationTag/index.mjs";import{useForm as mt}from"./Form/FormBase.mjs";import{Form as ht}from"./Form/Form.mjs";import{DictionaryCreationForm as gt}from"./DictionaryFieldEditor/DictionaryCreationForm/DictionaryCreationForm.mjs";import{SaveForm as _t}from"./DictionaryFieldEditor/SaveForm/SaveForm.mjs";import{DictionaryFieldEditor as vt}from"./DictionaryFieldEditor/DictionaryFieldEditor.mjs";import{VersionSwitcherProvider as yt,useVersionSwitcher as bt}from"./DictionaryFieldEditor/VersionSwitcherDropDown/VersionSwitcherContext.mjs";import{VersionSwitcher as xt}from"./DictionaryFieldEditor/VersionSwitcherDropDown/VersionSwitcher.mjs";import{Flag as St}from"./Flags/Flag.mjs";import{flags_exports as Ct}from"./Flags/flags.mjs";import{Logo as wt}from"./Logo/Logo.mjs";import{LogoTextOnly as Tt}from"./Logo/LogoTextOnly.mjs";import{LogoWithText as Et}from"./Logo/LogoWithText.mjs";import{LogoWithTextBelow as Dt}from"./Logo/LogoWithTextBelow.mjs";import{DiscordLogo as Ot}from"./SocialNetworks/DiscordLogo.mjs";import{InstagramLogo as kt}from"./SocialNetworks/InstagramLogo.mjs";import{LinkedInLogo as At}from"./SocialNetworks/LinkedInLogo.mjs";import{ProductHuntLogo as jt}from"./SocialNetworks/ProductHuntLogo.mjs";import{TiktokLogo as Mt}from"./SocialNetworks/TiktokLogo.mjs";import{XLogo as Nt}from"./SocialNetworks/XLogo.mjs";import{YoutubeLogo as Pt}from"./SocialNetworks/YoutubeLogo.mjs";import{FacebookLogo as Ft}from"./SocialNetworks/FacebookLogo.mjs";import{SocialNetworks as It}from"./SocialNetworks/index.mjs";import{Footer as Lt}from"./Footer/index.mjs";import{HeightResizer as Rt}from"./HeightResizer/index.mjs";import{HideShow as zt}from"./HideShow/index.mjs";import{HTMLRenderer as Bt,getIntlayerHTMLOptions as Vt}from"./HTMLRender/HTMLRender.mjs";import{FileList as Ht}from"./IDE/FileList.mjs";import{WithResizer as Ut}from"./WithResizer/index.mjs";import{IDE as Wt}from"./IDE/IDE.mjs";import{KeyboardScreenAdapter as Gt}from"./KeyboardScreenAdapter/index.mjs";import{LanguageBackground as Kt,LanguageSection as qt}from"./LanguageBackground/index.mjs";import{LocaleSwitcher as Jt}from"./LocaleSwitcherDropDown/LocaleSwitcher.mjs";import{MaxWidthSmoother as Yt}from"./MaxWidthSmoother/index.mjs";import{Navbar as Xt}from"./Navbar/index.mjs";import{NumberItemsSelector as Zt}from"./Pagination/NumberItemsSelector.mjs";import{Pagination as Qt,PaginationSize as $t,PaginationVariant as en,paginationVariants as tn}from"./Pagination/Pagination.mjs";import{ShowingResultsNumberItems as nn}from"./Pagination/ShowingResultsNumberItems.mjs";import{DotPattern as rn}from"./Pattern/DotPattern.mjs";import{GridPattern as an}from"./Pattern/GridPattern.mjs";import{Spotlight as on}from"./Pattern/SpotLight.mjs";import{drawerManager as sn,useRightDrawer as cn}from"./RightDrawer/useRightDrawer.mjs";import{RightDrawer as ln}from"./RightDrawer/RightDrawer.mjs";import{Tag as un,TagBackground as dn,TagBorder as fn,TagColor as pn,TagRoundedSize as mn,TagSize as hn}from"./Tag/index.mjs";import{Terminal as gn}from"./Terminal/Terminal.mjs";import{Modes as _n}from"./ThemeSwitcherDropDown/types.mjs";import{DesktopThemeSwitcher as vn}from"./ThemeSwitcherDropDown/DesktopThemeSwitcher.mjs";import{MobileThemeSwitcher as yn}from"./ThemeSwitcherDropDown/MobileThemeSwitcher.mjs";import{Toast as bn,ToastAction as xn,ToastClose as Sn,ToastDescription as Cn,ToastProvider as wn,ToastTitle as Tn,ToastViewport as En}from"./Toaster/Toast.mjs";import{reducer as Dn,toast as On,useToast as kn}from"./Toaster/useToast.mjs";import{Toaster as An}from"./Toaster/Toaster.mjs";export{_ as Accordion,Se as AutoCompleteTextarea,xe as AutoSizedTextArea,v as Avatar,b as Badge,x as BadgeColor,S as BadgeSize,C as BadgeVariant,P as Breadcrumb,te as Browser,u as Button,d as ButtonColor,f as ButtonSize,p as ButtonTextAlign,m as ButtonVariant,le as Carousel,F as Checkbox,I as CheckboxColor,L as CheckboxSize,ue as ClickOutsideDiv,Ze as Code,Ue as CodeBlock,We as CodeDefault,de as CollapsibleTable,fe as Command,pe as CommandRoot,e as Container,t as ContainerBackground,n as ContainerBorderColor,r as ContainerGap,i as ContainerPadding,a as ContainerRoundedSize,o as ContainerSeparator,s as ContainerTransparency,dt as ContentEditor,he as ContentSelector,ge as CopyButton,_e as CopyToClipboard,vn as DesktopThemeSwitcher,ie as Detail,gt as DictionaryCreationForm,Te as DictionaryEditor,vt as DictionaryFieldEditor,Ot as DiscordLogo,rn as DotPattern,Ee as DropDown,De as DropDownAlign,Oe as DropDownYAlign,ye as EditableFieldInput,we as EditableFieldTextArea,He as ExpandCollapse,Ft as FacebookLogo,Ht as FileList,St as Flag,Ct as Flags,Lt as Footer,ht as Form,an as GridPattern,Ie as H1,Le as H2,Re as H3,ze as H4,Be as H5,Ve as H6,Bt as HTMLRenderer,Rt as HeightResizer,zt as HideShow,Wt as IDE,pt as InformationTag,z as Input,W as InputIndicator,G as InputOTP,K as InputOTPGroup,q as InputOTPSeparator,J as InputOTPSlot,U as InputPassword,B as InputSize,V as InputVariant,kt as InstagramLogo,ne as KeyList,ut as KeyPathBreadcrumb,Gt as KeyboardScreenAdapter,re as KeyboardShortcut,Fe as Label,Kt as LanguageBackground,qt as LanguageSection,T as Link,E as LinkColor,D as LinkRoundedSize,O as LinkSize,k as LinkUnderlined,A as LinkVariant,At as LinkedInLogo,l as Loader,Jt as LocaleSwitcher,Pe as LocaleSwitcherContent,Me as LocaleSwitcherContentProvider,wt as Logo,Tt as LogoTextOnly,Et as LogoWithText,Dt as LogoWithTextBelow,it as MarkdownRenderer,g as MaxHeightSmoother,Yt as MaxWidthSmoother,yn as MobileThemeSwitcher,tt as Modal,nt as ModalSize,_n as Modes,Ge as MultiSelect,Xt as Navbar,Zt as NumberItemsSelector,Y as OTPInput,X as OTPInputContext,Qt as Pagination,$t as PaginationSize,en as PaginationVariant,ce as Popover,ae as PopoverStatic,oe as PopoverXAlign,se as PopoverYAlign,me as PressableSpan,jt as ProductHuntLogo,ln as RightDrawer,_t as SaveForm,ee as SearchInput,Ke as Select,qe as SelectContent,Je as SelectContentPosition,Ye as SelectLabel,Xe as SelectSeparator,nn as ShowingResultsNumberItems,It as SocialNetworks,on as Spotlight,ke as SwitchSelector,Ae as SwitchSelectorColor,je as SwitchSelectorSize,et as Tab,Qe as TabSelector,$e as TabSelectorColor,rt as Table,un as Tag,dn as TagBackground,fn as TagBorder,pn as TagColor,mn as TagRoundedSize,hn as TagSize,gn as Terminal,be as TextArea,st as TextEditor,ct as TextEditorContainer,Mt as TiktokLogo,bn as Toast,xn as ToastAction,Sn as ToastClose,Cn as ToastDescription,wn as ToastProvider,Tn as ToastTitle,En as ToastViewport,An as Toaster,xt as VersionSwitcher,yt as VersionSwitcherProvider,Ut as WithResizer,Nt as XLogo,Pt as YoutubeLogo,w as badgeVariants,at as baseMarkdownComponents,h as buttonVariants,j as checkIsExternalLink,R as checkboxVariants,c as containerVariants,sn as drawerManager,y as getCapitals,Vt as getIntlayerHTMLOptions,ot as getIntlayerMarkdownOptions,Z as inputSlotVariants,H as inputVariants,M as isTextChildren,N as linkVariants,tn as paginationVariants,Dn as reducer,On as toast,lt as traceKeys,ve as useCopyToClipboard,Ce as useDebounce,mt as useForm,ft as useFormField,Ne as useLocaleSwitcherContent,Q as usePasswordManagerBadge,$ as usePrevious,cn as useRightDrawer,kn as useToast,bt as useVersionSwitcher};
|
package/dist/esm/hooks/index.mjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{calculateIsMobile as e,checkIsIOS as t,checkIsIphoneOrSafariDevice as n,checkIsMac as r,checkIsMobileScreen as i,checkIsMobileUserAgent as a,getBreakpointFromSize as o,useDevice as s}from"./useDevice.mjs";import{useOAuth2 as c}from"./useAuth/useOAuth2.mjs";import{useSession as l}from"./useAuth/useSession.mjs";import{useAuth as u}from"./useAuth/useAuth.mjs";import{useIntlayerAuth as d,useIntlayerOAuth as f}from"./useIntlayerAPI.mjs";import{useAddDictionary as p,useAddNewAccessKey as m,useAddOrganization as h,useAddOrganizationMember as g,useAddPasskey as _,useAddProject as v,useAddTag as y,useAppQuery as b,useAskDocQuestion as x,useAskResetPassword as S,useAuditContentDeclaration as C,useAuditContentDeclarationField as w,useAuditContentDeclarationMetadata as T,useAuditScan as E,useAuditTag as D,useAutocomplete as O,useBitbucketAuth as k,useBitbucketCheckConfig as A,useBitbucketGetConfigFile as j,useBitbucketRepos as M,useCancelSubscription as N,useChangePassword as P,useCreateUser as F,useDeleteAccessKey as I,useDeleteDictionary as L,useDeleteOrganization as R,useDeletePasskey as z,useDeleteProject as B,useDeleteSSOProvider as V,
|
|
1
|
+
import{calculateIsMobile as e,checkIsIOS as t,checkIsIphoneOrSafariDevice as n,checkIsMac as r,checkIsMobileScreen as i,checkIsMobileUserAgent as a,getBreakpointFromSize as o,useDevice as s}from"./useDevice.mjs";import{useOAuth2 as c}from"./useAuth/useOAuth2.mjs";import{useSession as l}from"./useAuth/useSession.mjs";import{useAuth as u}from"./useAuth/useAuth.mjs";import{useIntlayerAuth as d,useIntlayerOAuth as f}from"./useIntlayerAPI.mjs";import{useAddDictionary as p,useAddNewAccessKey as m,useAddOrganization as h,useAddOrganizationMember as g,useAddPasskey as _,useAddProject as v,useAddTag as y,useAppQuery as b,useAskDocQuestion as x,useAskResetPassword as S,useAuditContentDeclaration as C,useAuditContentDeclarationField as w,useAuditContentDeclarationMetadata as T,useAuditScan as E,useAuditTag as D,useAutocomplete as O,useBitbucketAuth as k,useBitbucketCheckConfig as A,useBitbucketGetConfigFile as j,useBitbucketRepos as M,useCancelSubscription as N,useChangePassword as P,useCreateUser as F,useDeleteAccessKey as I,useDeleteDictionary as L,useDeleteOrganization as R,useDeletePasskey as z,useDeleteProject as B,useDeleteSSOProvider as V,useDeleteShowcaseProject as H,useDeleteTag as U,useDeleteUser as W,useDisableTwoFactor as G,useEnableTwoFactor as K,useGetCIConfig as q,useGetDictionaries as J,useGetDictionariesKeys as Y,useGetDictionary as X,useGetDiscussions as Z,useGetDiscussionsData as Q,useGetEditorDictionaries as $,useGetNewsletterStatus as ee,useGetOrganizations as te,useGetOtherShowcaseProjects as ne,useGetPricing as re,useGetProjects as ie,useGetRecursiveAuditStatus as ae,useGetShowcaseProjectById as oe,useGetShowcaseProjects as se,useGetSubscription as ce,useGetTags as le,useGetUserByAccount as ue,useGetUserById as de,useGetUsers as fe,useGetVerifyEmailStatus as pe,useGithubAuth as me,useGithubCheckConfig as he,useGithubGetAuthUrl as ge,useGithubGetConfigFile as _e,useGithubRepos as ve,useGitlabAuth as ye,useGitlabCheckConfig as be,useGitlabGetConfigFile as xe,useGitlabProjects as Se,useInfiniteGetDictionaries as Ce,useListPasskeys as we,useListSSOProviders as Te,useLogin as Ee,useLogout as De,usePushCIConfig as Oe,usePushDictionaries as ke,useQueryClient as Ae,useRefreshAccessKey as je,useRegister as Me,useRegisterSSO as Ne,useResetPassword as Pe,useSearchDoc as Fe,useSelectOrganization as Ie,useSelectProject as Le,useSignInMagicLink as Re,useSignInPasskey as ze,useSignInSSO as Be,useStartRecursiveAudit as Ve,useSubmitShowcaseProject as He,useSubscribeToNewsletter as Ue,useToggleShowcaseDownvote as We,useToggleShowcaseUpvote as Ge,useTranslateJSONDeclaration as Ke,useTriggerBuild as qe,useTriggerWebhook as Je,useUnselectOrganization as Ye,useUnselectProject as Xe,useUnsubscribeFromNewsletter as Ze,useUpdateDictionary as Qe,useUpdateOrganization as $e,useUpdateOrganizationMembers as et,useUpdateOrganizationMembersById as tt,useUpdateProject as nt,useUpdateProjectMembers as rt,useUpdateShowcaseProject as it,useUpdateTag as at,useUpdateUser as ot,useVerifyBackupCode as st,useVerifyEmail as ct,useVerifyTotp as lt,useWriteDictionary as ut}from"./reactQuery.mjs";import{usePersistedStore as dt}from"./usePersistedStore.mjs";import{useItemSelector as ft}from"./useItemSelector.mjs";import{useUser as pt}from"./useUser/index.mjs";import{useHorizontalSwipe as mt}from"./useHorizontalSwipe.mjs";import{useGetElementById as ht}from"./useGetElementById.mjs";import{useGetElementOrWindow as gt}from"./useGetElementOrWindow.mjs";import{useIsDarkMode as _t}from"./useIsDarkMode.mjs";import{useIsMounted as vt}from"./useIsMounted.mjs";import{useKeyboardDetector as yt}from"./useKeyboardDetector.mjs";import{useScreenWidth as bt}from"./useScreenWidth.mjs";import{useScrollBlockage as xt}from"./useScrollBlockage/index.mjs";import{useScrollDetection as St}from"./useScrollDetection.mjs";import{useScrollY as Ct}from"./useScrollY.mjs";import{useSearch as wt}from"./useSearch.mjs";export{e as calculateIsMobile,t as checkIsIOS,n as checkIsIphoneOrSafariDevice,r as checkIsMac,i as checkIsMobileScreen,a as checkIsMobileUserAgent,o as getBreakpointFromSize,p as useAddDictionary,m as useAddNewAccessKey,h as useAddOrganization,g as useAddOrganizationMember,_ as useAddPasskey,v as useAddProject,y as useAddTag,b as useAppQuery,x as useAskDocQuestion,S as useAskResetPassword,C as useAuditContentDeclaration,w as useAuditContentDeclarationField,T as useAuditContentDeclarationMetadata,E as useAuditScan,D as useAuditTag,u as useAuth,O as useAutocomplete,k as useBitbucketAuth,A as useBitbucketCheckConfig,j as useBitbucketGetConfigFile,M as useBitbucketRepos,N as useCancelSubscription,P as useChangePassword,F as useCreateUser,I as useDeleteAccessKey,L as useDeleteDictionary,R as useDeleteOrganization,z as useDeletePasskey,B as useDeleteProject,V as useDeleteSSOProvider,H as useDeleteShowcaseProject,U as useDeleteTag,W as useDeleteUser,s as useDevice,G as useDisableTwoFactor,K as useEnableTwoFactor,q as useGetCIConfig,J as useGetDictionaries,Y as useGetDictionariesKeys,X as useGetDictionary,Z as useGetDiscussions,Q as useGetDiscussionsData,$ as useGetEditorDictionaries,ht as useGetElementById,gt as useGetElementOrWindow,ee as useGetNewsletterStatus,te as useGetOrganizations,ne as useGetOtherShowcaseProjects,re as useGetPricing,ie as useGetProjects,ae as useGetRecursiveAuditStatus,oe as useGetShowcaseProjectById,se as useGetShowcaseProjects,ce as useGetSubscription,le as useGetTags,ue as useGetUserByAccount,de as useGetUserById,fe as useGetUsers,pe as useGetVerifyEmailStatus,me as useGithubAuth,he as useGithubCheckConfig,ge as useGithubGetAuthUrl,_e as useGithubGetConfigFile,ve as useGithubRepos,ye as useGitlabAuth,be as useGitlabCheckConfig,xe as useGitlabGetConfigFile,Se as useGitlabProjects,mt as useHorizontalSwipe,Ce as useInfiniteGetDictionaries,d as useIntlayerAuth,f as useIntlayerOAuth,_t as useIsDarkMode,vt as useIsMounted,ft as useItemSelector,yt as useKeyboardDetector,we as useListPasskeys,Te as useListSSOProviders,Ee as useLogin,De as useLogout,c as useOAuth2,dt as usePersistedStore,Oe as usePushCIConfig,ke as usePushDictionaries,Ae as useQueryClient,je as useRefreshAccessKey,Me as useRegister,Ne as useRegisterSSO,Pe as useResetPassword,bt as useScreenWidth,xt as useScrollBlockage,St as useScrollDetection,Ct as useScrollY,wt as useSearch,Fe as useSearchDoc,Ie as useSelectOrganization,Le as useSelectProject,l as useSession,Re as useSignInMagicLink,ze as useSignInPasskey,Be as useSignInSSO,Ve as useStartRecursiveAudit,He as useSubmitShowcaseProject,Ue as useSubscribeToNewsletter,We as useToggleShowcaseDownvote,Ge as useToggleShowcaseUpvote,Ke as useTranslateJSONDeclaration,qe as useTriggerBuild,Je as useTriggerWebhook,Ye as useUnselectOrganization,Xe as useUnselectProject,Ze as useUnsubscribeFromNewsletter,Qe as useUpdateDictionary,$e as useUpdateOrganization,et as useUpdateOrganizationMembers,tt as useUpdateOrganizationMembersById,nt as useUpdateProject,rt as useUpdateProjectMembers,it as useUpdateShowcaseProject,at as useUpdateTag,ot as useUpdateUser,pt as useUser,st as useVerifyBackupCode,ct as useVerifyEmail,lt as useVerifyTotp,ut as useWriteDictionary};
|