@meistrari/tela-build 1.0.0

package/modules/tela-build-docs/index.ts

@@ -0,0 +1,139 @@
+/* eslint-disable no-console */
+import { defineNuxtModule, createResolver } from '@nuxt/kit'
+import { resolve } from 'pathe'
+import { existsSync, writeFileSync, mkdirSync } from 'node:fs'
+import { collectComponentDocs, generateMarkdown, generateDocsToDirectory } from '../../lib/doc-generator'
+import { ensureOverlayTsconfig } from '../../lib/extractors/volar-extract'
+
+export interface TelaBuildDocsOptions {
+    layer?: string
+    outFile?: string
+    outDir?: string
+    enabled?: boolean
+}
+
+export default defineNuxtModule<TelaBuildDocsOptions>({
+    meta: {
+        name: 'tela-build-docs',
+        configKey: 'telaBuildDocs',
+    },
+    defaults: {
+        layer: undefined,
+        // Prefer directory output suitable for Claude Skills-style indexing
+        outDir: '.claude/skills',
+        // Keep outFile for backward compatibility (used only if explicitly set)
+        outFile: undefined,
+        enabled: true,
+    },
+    async setup(options, nuxt) {
+        if (!options.enabled) {
+            return
+        }
+
+        let hasGenerated = false
+        const logger = console
+
+        const colors = {
+            gray: '\x1B[90m',
+            orange: '\x1B[38;5;208m',
+            cyan: '\x1B[36m',
+            yellow: '\x1B[33m',
+            purple: '\x1B[38;5;141m',
+            green: '\x1B[32m',
+            reset: '\x1B[0m',
+        }
+
+        function generateDocsInBackground() {
+            if (hasGenerated) {
+                return // Only generate once
+            }
+            hasGenerated = true
+
+            // The module runs from within the build layer itself
+            // So we need to resolve components relative to the module's location
+            const layerPath = resolveLayerPath()
+            if (!layerPath) {
+                console.log(`${colors.gray}[tela/build] ${colors.orange}✗${colors.gray} Could not resolve layer path${colors.reset}`)
+                return
+            }
+
+            logger.log(`${colors.gray}[tela/build] ${colors.cyan}◎${colors.gray} Scanning components from ${layerPath}${colors.reset}`)
+
+            // Run in background without blocking
+            setImmediate(async () => {
+                try {
+                    // Prepare tsconfig overlay (safe even if Volar is disabled; creation is idempotent)
+                    try {
+                        if (nuxt.options.rootDir) {
+                            ensureOverlayTsconfig(nuxt.options.rootDir, layerPath)
+                        }
+                    }
+                    catch {}
+
+                    // Collect component documentation with stories
+                    logger.log(`${colors.gray}[tela/build] ${colors.yellow}◒${colors.gray} Analyzing TypeScript types${colors.reset}`)
+                    // Pass the app's root directory so vue-docgen-api can find node_modules
+                    const { docs: componentDocs, typeResolver } = await collectComponentDocs(layerPath, nuxt.options.rootDir)
+
+                    // Generate documentation (directory-first unless outFile explicitly set)
+                    logger.log(`${colors.gray}[tela/build] ${colors.orange}◐${colors.gray} Generating documentation for ${componentDocs.length} components${colors.reset}`)
+
+                    if (options.outFile) {
+                        // Single-file mode (legacy)
+                        const outPath = resolve(nuxt.options.rootDir, options.outFile)
+                        const outDir = resolve(outPath, '..')
+                        if (!existsSync(outDir)) {
+                            mkdirSync(outDir, { recursive: true })
+                        }
+                        const markdown = generateMarkdown(componentDocs, typeResolver)
+                        writeFileSync(outPath, markdown, 'utf-8')
+                        logger.log(`${colors.gray}[tela/build] ${colors.green}●${colors.gray} Documentation complete → ${outPath}${colors.reset}`)
+                    }
+                    else {
+                        // Directory output: single Skill (tela-build) + supporting component pages
+                        const outDir = resolve(nuxt.options.rootDir, options.outDir!)
+                        generateDocsToDirectory(componentDocs, typeResolver, outDir, layerPath)
+                        logger.log(`${colors.gray}[tela/build] ${colors.green}●${colors.gray} Documentation complete → ${outDir}${colors.reset}`)
+                    }
+                }
+                catch (error: any) {
+                    console.log(`${colors.gray}[tela/build] ${colors.orange}✗${colors.gray} Generation failed: ${error.message}${colors.reset}`)
+                    if (nuxt.options.dev) {
+                        console.error(error)
+                    }
+                }
+            })
+        }
+
+        // Generate once on server ready for dev
+        if (nuxt.options.dev) {
+            nuxt.hook('ready', () => {
+                generateDocsInBackground()
+            })
+        }
+        else {
+            // Generate before production build
+            nuxt.hook('nitro:build:before', () => {
+                generateDocsInBackground()
+            })
+        }
+    },
+})
+
+function resolveLayerPath(): string | null {
+    // Use createResolver to resolve paths relative to this module
+    // This works correctly even when the module is installed from npm/github
+    const resolver = createResolver(import.meta.url)
+
+    // Module is at packages/build/modules/tela-build-docs/index.ts
+    // Build layer root is at packages/build
+    const buildLayerRoot = resolver.resolve('../..')
+
+    // Verify components directory exists
+    const componentsPath = resolver.resolve('../../components')
+    if (existsSync(componentsPath)) {
+        return buildLayerRoot
+    }
+
+    return null
+}

package/nuxt.config.ts

@@ -0,0 +1,80 @@
+import { dirname, join } from 'node:path'
+import { fileURLToPath } from 'node:url'
+import { createResolver } from 'nuxt/kit'
+
+const currentDir = dirname(fileURLToPath(import.meta.url))
+const { resolve } = createResolver(import.meta.url)
+
+export default defineNuxtConfig({
+    compatibilityDate: '2024-11-13',
+    devtools: { enabled: true },
+
+    modules: [
+        '@unocss/nuxt',
+        '@vueuse/nuxt',
+        '@nuxt/fonts',
+        'motion-v/nuxt',
+        resolve('./modules/tela-build-docs'),
+    ],
+
+    imports: {
+        dirs: [
+            './composables',
+            './utils',
+        ],
+    },
+
+    vue: {
+        runtimeCompiler: 'STORYBOOK' in process.env,
+    },
+
+    pages: !process.env.STORYBOOK,
+
+    unocss: {
+        attributify: true,
+        icons: {
+            scale: 1.2,
+            collections: {
+                custom: {
+                    command: '<svg viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M8.4375 6.75H7.5V5.25H8.4375C8.77126 5.25 9.09752 5.15103 9.37503 4.96561C9.65253 4.78018 9.86882 4.51663 9.99655 4.20828C10.1243 3.89993 10.1577 3.56063 10.0926 3.23329C10.0275 2.90594 9.86674 2.60526 9.63074 2.36926C9.39474 2.13326 9.09406 1.97254 8.76672 1.90743C8.43937 1.84231 8.10007 1.87573 7.79172 2.00345C7.48337 2.13118 7.21982 2.34747 7.0344 2.62498C6.84897 2.90248 6.75 3.22874 6.75 3.5625V4.5H5.25V3.5625C5.25 3.22874 5.15103 2.90248 4.96561 2.62498C4.78018 2.34747 4.51663 2.13118 4.20828 2.00345C3.89993 1.87573 3.56063 1.84231 3.23329 1.90743C2.90594 1.97254 2.60526 2.13326 2.36926 2.36926C2.13326 2.60526 1.97254 2.90594 1.90743 3.23329C1.84231 3.56063 1.87573 3.89993 2.00345 4.20828C2.13118 4.51663 2.34747 4.78018 2.62498 4.96561C2.90248 5.15103 3.22874 5.25 3.5625 5.25H4.5V6.75H3.5625C3.22874 6.75 2.90248 6.84897 2.62498 7.0344C2.34747 7.21982 2.13118 7.48337 2.00345 7.79172C1.87573 8.10007 1.84231 8.43937 1.90743 8.76672C1.97254 9.09406 2.13326 9.39474 2.36926 9.63074C2.60526 9.86674 2.90594 10.0275 3.23329 10.0926C3.56063 10.1577 3.89993 10.1243 4.20828 9.99655C4.51663 9.86882 4.78018 9.65253 4.96561 9.37503C5.15103 9.09752 5.25 8.77126 5.25 8.4375V7.5H6.75V8.4375C6.75 8.77126 6.84897 9.09752 7.0344 9.37503C7.21982 9.65253 7.48337 9.86882 7.79172 9.99655C8.10007 10.1243 8.43937 10.1577 8.76672 10.0926C9.09406 10.0275 9.39474 9.86674 9.63074 9.63074C9.86674 9.39474 10.0275 9.09406 10.0926 8.76672C10.1577 8.43937 10.1243 8.10007 9.99655 7.79172C9.86882 7.48337 9.65253 7.21982 9.37503 7.0344C9.09752 6.84897 8.77126 6.75 8.4375 6.75ZM7.5 3.5625C7.5 3.37708 7.55498 3.19582 7.658 3.04165C7.76101 2.88748 7.90743 2.76732 8.07874 2.69636C8.25004 2.62541 8.43854 2.60684 8.6204 2.64301C8.80226 2.67919 8.9693 2.76848 9.10041 2.89959C9.23153 3.0307 9.32081 3.19775 9.35699 3.3796C9.39316 3.56146 9.3746 3.74996 9.30364 3.92127C9.23268 4.09257 9.11252 4.23899 8.95835 4.342C8.80418 4.44502 8.62292 4.5 8.4375 4.5H7.5V3.5625ZM2.625 3.5625C2.625 3.31386 2.72377 3.0754 2.89959 2.89959C3.0754 2.72377 3.31386 2.625 3.5625 2.625C3.81114 2.625 4.0496 2.72377 4.22541 2.89959C4.40123 3.0754 4.5 3.31386 4.5 3.5625V4.5H3.5625C3.31386 4.5 3.0754 4.40123 2.89959 4.22541C2.72377 4.0496 2.625 3.81114 2.625 3.5625ZM4.5 8.4375C4.5 8.62292 4.44502 8.80418 4.342 8.95835C4.23899 9.11252 4.09257 9.23268 3.92127 9.30364C3.74996 9.3746 3.56146 9.39316 3.3796 9.35699C3.19775 9.32081 3.0307 9.23153 2.89959 9.10041C2.76848 8.9693 2.67919 8.80226 2.64301 8.6204C2.60684 8.43854 2.62541 8.25004 2.69636 8.07874C2.76732 7.90743 2.88748 7.76101 3.04165 7.658C3.19582 7.55498 3.37708 7.5 3.5625 7.5H4.5V8.4375ZM5.25 5.25H6.75V6.75H5.25V5.25ZM8.4375 9.375C8.18886 9.375 7.9504 9.27623 7.77459 9.10041C7.59877 8.9246 7.5 8.68614 7.5 8.4375V7.5H8.4375C8.68614 7.5 8.9246 7.59877 9.10041 7.77459C9.27623 7.9504 9.375 8.18886 9.375 8.4375C9.375 8.68614 9.27623 8.9246 9.10041 9.10041C8.9246 9.27623 8.68614 9.375 8.4375 9.375Z" fill="#3F4650"/></svg>',
+                    return: '<svg  viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M9.3753 2.41016V3V7.25C9.3753 7.34946 9.33579 7.44484 9.26546 7.51517C9.19513 7.58549 9.09975 7.625 9.0003 7.625H3.15545L4.76561 9.23469C4.80045 9.26953 4.82809 9.31089 4.84694 9.35641C4.8658 9.40194 4.8755 9.45073 4.8755 9.5C4.8755 9.54927 4.8658 9.59806 4.84694 9.64359C4.82809 9.68911 4.80045 9.73047 4.76561 9.76531C4.73077 9.80015 4.6894 9.82779 4.64388 9.84665C4.59836 9.8655 4.54957 9.87521 4.5003 9.87521C4.45102 9.87521 4.40223 9.8655 4.35671 9.84665C4.31119 9.82779 4.26982 9.80015 4.23498 9.76531L1.98498 7.51531C1.95012 7.48049 1.92246 7.43913 1.90359 7.3936C1.88471 7.34808 1.875 7.29928 1.875 7.25C1.875 7.20072 1.88471 7.15192 1.90359 7.1064C1.92246 7.06087 1.95012 7.01951 1.98498 6.98469L4.23498 4.73469C4.30535 4.66432 4.40078 4.62479 4.5003 4.62479C4.59981 4.62479 4.69524 4.66432 4.76561 4.73469C4.83597 4.80505 4.8755 4.90049 4.8755 5C4.8755 5.09951 4.83597 5.19495 4.76561 5.26531L3.15545 6.875H8.6253V2.41016C8.6253 2.3107 8.6648 2.21532 8.73513 2.14499C8.80546 2.07466 8.90084 2.03516 9.0003 2.03516C9.09975 2.03516 9.19513 2.07466 9.26546 2.14499C9.33579 2.21532 9.3753 2.3107 9.3753 2.41016Z" fill="#3F4650"/><rect x="6" y="2" width="3.38" height="0.75" rx="0.375" fill="#3F4650"/></svg>',
+                    variable: '<svg viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"><rect width="16" height="16" rx="4" fill="#FF822E" /><path d="M8 3.5C6.80653 3.5 5.66193 3.97411 4.81802 4.81802C3.97411 5.66193 3.5 6.80653 3.5 8C3.5 9.19347 3.97411 10.3381 4.81802 11.182C5.66193 12.0259 6.80653 12.5 8 12.5C8.92792 12.5 9.90375 12.2196 10.61 11.75C10.7205 11.6766 10.7973 11.5622 10.8235 11.4322C10.8497 11.3021 10.8232 11.167 10.7498 11.0565C10.6764 10.946 10.562 10.8691 10.432 10.8429C10.3019 10.8167 10.1668 10.8432 10.0563 10.9167C9.51458 11.2763 8.7275 11.5 8 11.5C7.30777 11.5 6.63108 11.2947 6.0555 10.9101C5.47993 10.5256 5.03133 9.97893 4.76642 9.33939C4.50151 8.69985 4.4322 7.99612 4.56725 7.31718C4.7023 6.63825 5.03564 6.01461 5.52513 5.52513C6.01461 5.03564 6.63825 4.7023 7.31718 4.56725C7.99612 4.4322 8.69985 4.50151 9.33939 4.76642C9.97893 5.03133 10.5256 5.47993 10.9101 6.0555C11.2947 6.63108 11.5 7.30777 11.5 8C11.5 8.38708 11.4304 8.71167 11.3046 8.91458C11.1946 9.09125 11.0546 9.16667 10.8333 9.16667C10.6121 9.16667 10.4721 9.09125 10.3621 8.91458C10.2371 8.71167 10.1667 8.38708 10.1667 8V6.33333C10.1667 6.21336 10.1235 6.09739 10.0451 6.00659C9.96667 5.91578 9.85822 5.8562 9.73953 5.83872C9.62083 5.82124 9.49981 5.84702 9.39855 5.91135C9.29728 5.97569 9.22252 6.07429 9.18792 6.18917C8.84414 5.96328 8.44316 5.83992 8.03187 5.83351C7.62057 5.8271 7.21594 5.93791 6.8653 6.15297C6.51465 6.36804 6.23247 6.67848 6.05175 7.04801C5.87102 7.41753 5.79923 7.83086 5.84475 8.23969C5.89027 8.64851 6.05123 9.03592 6.30881 9.35664C6.56639 9.67736 6.90994 9.91813 7.29931 10.0508C7.68868 10.1835 8.10777 10.2026 8.50758 10.1058C8.9074 10.0091 9.27142 9.80056 9.55708 9.50458C9.84583 9.92917 10.2838 10.1667 10.8333 10.1667C11.8613 10.1667 12.5 9.33667 12.5 8C12.4987 6.80693 12.0241 5.66311 11.1805 4.81948C10.3369 3.97585 9.19307 3.50132 8 3.5ZM8 9.16667C7.76926 9.16667 7.54369 9.09824 7.35183 8.97005C7.15998 8.84185 7.01044 8.65964 6.92214 8.44646C6.83384 8.23328 6.81073 7.99871 6.85575 7.77239C6.90077 7.54608 7.01188 7.3382 7.17504 7.17504C7.3382 7.01188 7.54608 6.90077 7.77239 6.85575C7.99871 6.81073 8.23328 6.83384 8.44646 6.92214C8.65964 7.01044 8.84185 7.15998 8.97005 7.35183C9.09824 7.54369 9.16667 7.76926 9.16667 8C9.16667 8.30942 9.04375 8.60617 8.82496 8.82496C8.60617 9.04375 8.30942 9.16667 8 9.16667Z" fill="white" /></svg>',
+                    variableUnassigned: '<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="none"><rect width="16" height="16" rx="4" fill="#CC8408"/><path d="M8 3.5C6.80653 3.5 5.66193 3.97411 4.81802 4.81802C3.97411 5.66193 3.5 6.80653 3.5 8C3.5 9.19347 3.97411 10.3381 4.81802 11.182C5.66193 12.0259 6.80653 12.5 8 12.5C8.92792 12.5 9.90375 12.2196 10.61 11.75C10.7205 11.6766 10.7973 11.5622 10.8235 11.4322C10.8497 11.3021 10.8232 11.167 10.7498 11.0565C10.6764 10.946 10.562 10.8691 10.432 10.8429C10.3019 10.8167 10.1668 10.8432 10.0563 10.9167C9.51458 11.2763 8.7275 11.5 8 11.5C7.30777 11.5 6.63108 11.2947 6.0555 10.9101C5.47993 10.5256 5.03133 9.97893 4.76642 9.33939C4.50151 8.69985 4.4322 7.99612 4.56725 7.31718C4.7023 6.63825 5.03564 6.01461 5.52513 5.52513C6.01461 5.03564 6.63825 4.7023 7.31718 4.56725C7.99612 4.4322 8.69985 4.50151 9.33939 4.76642C9.97893 5.03133 10.5256 5.47993 10.9101 6.0555C11.2947 6.63108 11.5 7.30777 11.5 8C11.5 8.38708 11.4304 8.71167 11.3046 8.91458C11.1946 9.09125 11.0546 9.16667 10.8333 9.16667C10.6121 9.16667 10.4721 9.09125 10.3621 8.91458C10.2371 8.71167 10.1667 8.38708 10.1667 8V6.33333C10.1667 6.21336 10.1235 6.09739 10.0451 6.00659C9.96667 5.91578 9.85822 5.8562 9.73953 5.83872C9.62083 5.82124 9.49981 5.84702 9.39855 5.91135C9.29728 5.97569 9.22252 6.07429 9.18792 6.18917C8.84414 5.96328 8.44316 5.83992 8.03187 5.83351C7.62057 5.8271 7.21594 5.93791 6.8653 6.15297C6.51465 6.36804 6.23247 6.67848 6.05175 7.04801C5.87102 7.41753 5.79923 7.83086 5.84475 8.23969C5.89027 8.64851 6.05123 9.03592 6.30881 9.35664C6.56639 9.67736 6.90994 9.91813 7.29931 10.0508C7.68868 10.1835 8.10777 10.2026 8.50758 10.1058C8.9074 10.0091 9.27142 9.80056 9.55708 9.50458C9.84583 9.92917 10.2838 10.1667 10.8333 10.1667C11.8612 10.1667 12.5 9.33667 12.5 8C12.4987 6.80693 12.0241 5.66311 11.1805 4.81948C10.3369 3.97585 9.19307 3.50132 8 3.5ZM8 9.16667C7.76926 9.16667 7.54369 9.09824 7.35183 8.97005C7.15998 8.84185 7.01044 8.65964 6.92214 8.44646C6.83384 8.23328 6.81073 7.99871 6.85575 7.77239C6.90077 7.54608 7.01188 7.3382 7.17504 7.17504C7.3382 7.01188 7.54608 6.90077 7.77239 6.85575C7.99871 6.81073 8.23328 6.83384 8.44646 6.92214C8.65964 7.01044 8.84185 7.15998 8.97005 7.35183C9.09824 7.54369 9.16667 7.76926 9.16667 8C9.16667 8.30942 9.04375 8.60617 8.82496 8.82496C8.60617 9.04375 8.30942 9.16667 8 9.16667Z" fill="white"/></svg>',
+                    variableReference: '<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 18 18" fill="none"><rect width="18" height="18" rx="5" fill="#FFF2E9"/><path d="M9 3.9375C7.65734 3.9375 6.36967 4.47087 5.42027 5.42027C4.47087 6.36967 3.9375 7.65734 3.9375 9C3.9375 10.3427 4.47087 11.6303 5.42027 12.5797C6.36967 13.5291 7.65734 14.0625 9 14.0625C10.0439 14.0625 11.1417 13.747 11.9362 13.2188C12.0606 13.1361 12.147 13.0075 12.1765 12.8612C12.206 12.7149 12.1761 12.5628 12.0935 12.4385C12.0109 12.3142 11.8823 12.2278 11.736 12.1983C11.5896 12.1688 11.4376 12.1986 11.3133 12.2812C10.7039 12.6858 9.81844 12.9375 9 12.9375C8.22124 12.9375 7.45996 12.7066 6.81244 12.2739C6.16492 11.8413 5.66024 11.2263 5.36222 10.5068C5.0642 9.78733 4.98623 8.99563 5.13816 8.23183C5.29009 7.46803 5.6651 6.76644 6.21577 6.21577C6.76644 5.6651 7.46803 5.29009 8.23183 5.13816C8.99563 4.98623 9.78733 5.0642 10.5068 5.36222C11.2263 5.66024 11.8413 6.16492 12.2739 6.81244C12.7066 7.45996 12.9375 8.22124 12.9375 9C12.9375 9.43547 12.8592 9.80062 12.7177 10.0289C12.5939 10.2277 12.4364 10.3125 12.1875 10.3125C11.9386 10.3125 11.7811 10.2277 11.6573 10.0289C11.5167 9.80062 11.4375 9.43547 11.4375 9V7.125C11.4375 6.99003 11.3889 6.85956 11.3007 6.75741C11.2125 6.65526 11.0905 6.58823 10.957 6.56856C10.8234 6.54889 10.6873 6.57789 10.5734 6.65027C10.4594 6.72265 10.3753 6.83358 10.3364 6.96281C9.94966 6.70869 9.49856 6.56991 9.03585 6.5627C8.57314 6.55549 8.11794 6.68014 7.72346 6.92209C7.32898 7.16405 7.01153 7.51329 6.80821 7.92901C6.6049 8.34472 6.52413 8.80972 6.57534 9.26965C6.62655 9.72957 6.80763 10.1654 7.09741 10.5262C7.38719 10.887 7.77369 11.1579 8.21173 11.3071C8.64976 11.4564 9.12124 11.4779 9.57103 11.3691C10.0208 11.2602 10.4303 11.0256 10.7517 10.6927C11.0766 11.1703 11.5692 11.4375 12.1875 11.4375C13.3439 11.4375 14.0625 10.5037 14.0625 9C14.061 7.6578 13.5272 6.371 12.5781 5.42192C11.629 4.47284 10.3422 3.93899 9 3.9375ZM9 10.3125C8.74041 10.3125 8.48665 10.2355 8.27081 10.0913C8.05497 9.94708 7.88675 9.7421 7.78741 9.50227C7.68807 9.26244 7.66208 8.99854 7.71272 8.74394C7.76336 8.48934 7.88837 8.25548 8.07192 8.07192C8.25548 7.88837 8.48934 7.76336 8.74394 7.71272C8.99854 7.66208 9.26244 7.68807 9.50227 7.78741C9.7421 7.88675 9.94708 8.05497 10.0913 8.27081C10.2355 8.48665 10.3125 8.74041 10.3125 9C10.3125 9.3481 10.1742 9.68194 9.92808 9.92808C9.68194 10.1742 9.3481 10.3125 9 10.3125Z" fill="#FF822E"/></svg>',
+                    variableOutput: '<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="none"><rect width="16" height="16" rx="4" fill="#E6ECFF"/><path d="M8 3.5C6.80653 3.5 5.66193 3.97411 4.81802 4.81802C3.97411 5.66193 3.5 6.80653 3.5 8C3.5 9.19347 3.97411 10.3381 4.81802 11.182C5.66193 12.0259 6.80653 12.5 8 12.5C8.92792 12.5 9.90375 12.2196 10.61 11.75C10.7205 11.6766 10.7973 11.5622 10.8235 11.4322C10.8497 11.3021 10.8232 11.167 10.7498 11.0565C10.6764 10.946 10.562 10.8691 10.432 10.8429C10.3019 10.8167 10.1668 10.8432 10.0563 10.9167C9.51458 11.2763 8.7275 11.5 8 11.5C7.30777 11.5 6.63108 11.2947 6.0555 10.9101C5.47993 10.5256 5.03133 9.97893 4.76642 9.33939C4.50151 8.69985 4.4322 7.99612 4.56725 7.31718C4.7023 6.63825 5.03564 6.01461 5.52513 5.52513C6.01461 5.03564 6.63825 4.7023 7.31718 4.56725C7.99612 4.4322 8.69985 4.50151 9.33939 4.76642C9.97893 5.03133 10.5256 5.47993 10.9101 6.0555C11.2947 6.63108 11.5 7.30777 11.5 8C11.5 8.38708 11.4304 8.71167 11.3046 8.91458C11.1946 9.09125 11.0546 9.16667 10.8333 9.16667C10.6121 9.16667 10.4721 9.09125 10.3621 8.91458C10.2371 8.71167 10.1667 8.38708 10.1667 8V6.33333C10.1667 6.21336 10.1235 6.09739 10.0451 6.00659C9.96667 5.91578 9.85822 5.8562 9.73953 5.83872C9.62083 5.82124 9.49981 5.84702 9.39855 5.91135C9.29728 5.97569 9.22252 6.07429 9.18792 6.18917C8.84414 5.96328 8.44316 5.83992 8.03187 5.83351C7.62057 5.8271 7.21594 5.93791 6.8653 6.15297C6.51465 6.36804 6.23247 6.67848 6.05175 7.04801C5.87102 7.41753 5.79923 7.83086 5.84475 8.23969C5.89027 8.64851 6.05123 9.03592 6.30881 9.35664C6.56639 9.67736 6.90994 9.91813 7.29931 10.0508C7.68868 10.1835 8.10777 10.2026 8.50758 10.1058C8.9074 10.0091 9.27142 9.80056 9.55708 9.50458C9.84583 9.92917 10.2838 10.1667 10.8333 10.1667C11.8612 10.1667 12.5 9.33667 12.5 8C12.4987 6.80693 12.0241 5.66311 11.1805 4.81948C10.3369 3.97585 9.19307 3.50132 8 3.5ZM8 9.16667C7.76926 9.16667 7.54369 9.09824 7.35183 8.97005C7.15998 8.84185 7.01044 8.65964 6.92214 8.44646C6.83384 8.23328 6.81073 7.99871 6.85575 7.77239C6.90077 7.54608 7.01188 7.3382 7.17504 7.17504C7.3382 7.01188 7.54608 6.90077 7.77239 6.85575C7.99871 6.81073 8.23328 6.83384 8.44646 6.92214C8.65964 7.01044 8.84185 7.15998 8.97005 7.35183C9.09824 7.54369 9.16667 7.76926 9.16667 8C9.16667 8.30942 9.04375 8.60617 8.82496 8.82496C8.60617 9.04375 8.30942 9.16667 8 9.16667Z" fill="#315FFF"/></svg>',
+                    outputFormat: '<svg viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg"><rect width="14" height="14" rx="4" fill="#EDF1FD" /><path d="M10.4294 8.06598L8.85436 9.64098C8.78039 9.71495 8.68006 9.75651 8.57545 9.75651C8.47084 9.75651 8.37052 9.71495 8.29655 9.64098C8.22258 9.56701 8.18102 9.46668 8.18102 9.36207C8.18102 9.25746 8.22258 9.15714 8.29655 9.08317L9.19922 8.18115H7.00078C6.06124 8.18011 5.16048 7.80642 4.49612 7.14206C3.83177 6.47771 3.45807 5.57694 3.45703 4.6374C3.45703 4.53297 3.49852 4.43282 3.57236 4.35898C3.6462 4.28514 3.74635 4.24365 3.85078 4.24365C3.95521 4.24365 4.05536 4.28514 4.1292 4.35898C4.20305 4.43282 4.24453 4.53297 4.24453 4.6374C4.24531 5.36817 4.53595 6.06877 5.05268 6.5855C5.56941 7.10223 6.27002 7.39287 7.00078 7.39365H9.19922L8.29622 6.49098C8.22225 6.41701 8.18069 6.31668 8.18069 6.21207C8.18069 6.10746 8.22225 6.00714 8.29622 5.93317C8.37019 5.8592 8.47052 5.81764 8.57513 5.81764C8.67974 5.81764 8.78006 5.8592 8.85403 5.93317L10.429 7.50817C10.4658 7.54473 10.4949 7.58818 10.5148 7.63603C10.5347 7.68388 10.545 7.73518 10.545 7.78701C10.545 7.83883 10.5348 7.89015 10.515 7.93802C10.4951 7.98589 10.466 8.02938 10.4294 8.06598Z" fill="#315FFF" /></svg>',
+                    loader: '<svg width="12" height="13" viewBox="0 0 12 13" fill="none" xmlns="http://www.w3.org/2000/svg"><g id="Icon" clip-path="url(#clip0_34022_28523)"><path id="Ellipse 1" d="M11.4 6.5C11.7314 6.5 12.0031 6.23069 11.97 5.90098C11.8722 4.92594 11.5366 3.98642 10.9888 3.16658C10.3295 2.17988 9.39246 1.41085 8.2961 0.956723C7.19974 0.502597 5.99334 0.383777 4.82946 0.615288C3.66557 0.8468 2.59647 1.41824 1.75736 2.25736C0.918244 3.09647 0.3468 4.16557 0.115288 5.32946C-0.116223 6.49334 0.00259702 7.69974 0.456723 8.7961C0.910849 9.89246 1.67988 10.8295 2.66658 11.4888C3.48642 12.0366 4.42594 12.3722 5.40098 12.47C5.73069 12.5031 6 12.2314 6 11.9C6 11.5686 5.73033 11.3039 5.40155 11.2626C4.66426 11.1699 3.95565 10.9069 3.33326 10.4911C2.54391 9.96362 1.92868 9.21397 1.56538 8.33688C1.20208 7.45979 1.10702 6.49468 1.29223 5.56357C1.47744 4.63246 1.9346 3.77718 2.60589 3.10589C3.27718 2.4346 4.13246 1.97744 5.06357 1.79223C5.99468 1.60702 6.95979 1.70208 7.83688 2.06538C8.71397 2.42868 9.46362 3.04391 9.99105 3.83326C10.4069 4.45565 10.6699 5.16426 10.7626 5.90155C10.8039 6.23033 11.0686 6.5 11.4 6.5Z" fill="#9DA2AA"/></g><defs><clipPath id="clip0_34022_28523"><rect width="12" height="12" fill="white" transform="translate(0 0.5)"/></clipPath></defs></svg>',
+                    variableOutputError: '<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"><rect width="16" height="16" rx="5" fill="rgba(237, 49, 81, 0.12)" /><path d="M8 3.5C6.80653 3.5 5.66193 3.97411 4.81802 4.81802C3.97411 5.66193 3.5 6.80653 3.5 8C3.5 9.19347 3.97411 10.3381 4.81802 11.182C5.66193 12.0259 6.80653 12.5 8 12.5C8.92792 12.5 9.90375 12.2196 10.61 11.75C10.7205 11.6766 10.7973 11.5622 10.8235 11.4322C10.8497 11.3021 10.8232 11.167 10.7498 11.0565C10.6764 10.946 10.562 10.8691 10.432 10.8429C10.3019 10.8167 10.1668 10.8432 10.0563 10.9167C9.51458 11.2763 8.7275 11.5 8 11.5C7.30777 11.5 6.63108 11.2947 6.0555 10.9101C5.47993 10.5256 5.03133 9.97893 4.76642 9.33939C4.50151 8.69985 4.4322 7.99612 4.56725 7.31718C4.7023 6.63825 5.03564 6.01461 5.52513 5.52513C6.01461 5.03564 6.63825 4.7023 7.31718 4.56725C7.99612 4.4322 8.69985 4.50151 9.33939 4.76642C9.97893 5.03133 10.5256 5.47993 10.9101 6.0555C11.2947 6.63108 11.5 7.30777 11.5 8C11.5 8.38708 11.4304 8.71167 11.3046 8.91458C11.1946 9.09125 11.0546 9.16667 10.8333 9.16667C10.6121 9.16667 10.4721 9.09125 10.3621 8.91458C10.2371 8.71167 10.1667 8.38708 10.1667 8V6.33333C10.1667 6.21336 10.1235 6.09739 10.0451 6.00659C9.96667 5.91578 9.85822 5.8562 9.73953 5.83872C9.62083 5.82124 9.49981 5.84702 9.39855 5.91135C9.29728 5.97569 9.22252 6.07429 9.18792 6.18917C8.84414 5.96328 8.44316 5.83992 8.03187 5.83351C7.62057 5.8271 7.21594 5.93791 6.8653 6.15297C6.51465 6.36804 6.23247 6.67848 6.05175 7.04801C5.87102 7.41753 5.79923 7.83086 5.84475 8.23969C5.89027 8.64851 6.05123 9.03592 6.30881 9.35664C6.56639 9.67736 6.90994 9.91813 7.29931 10.0508C7.68868 10.1835 8.10777 10.2026 8.50758 10.1058C8.9074 10.0091 9.27142 9.80056 9.55708 9.50458C9.84583 9.92917 10.2838 10.1667 10.8333 10.1667C11.8613 10.1667 12.5 9.33667 12.5 8C12.4987 6.80693 12.0241 5.66311 11.1805 4.81948C10.3369 3.97585 9.19307 3.50132 8 3.5ZM8 9.16667C7.76926 9.16667 7.54369 9.09824 7.35183 8.97005C7.15998 8.84185 7.01044 8.65964 6.92214 8.44646C6.83384 8.23328 6.81073 7.99871 6.85575 7.77239C6.90077 7.54608 7.01188 7.3382 7.17504 7.17504C7.3382 7.01188 7.54608 6.90077 7.77239 6.85575C7.99871 6.81073 8.23328 6.83384 8.44646 6.92214C8.65964 7.01044 8.84185 7.15998 8.97005 7.35183C9.09824 7.54369 9.16667 7.76926 9.16667 8C9.16667 8.30942 9.04375 8.60617 8.82496 8.82496C8.60617 9.04375 8.30942 9.16667 8 9.16667Z" fill="#BE2741" /></svg>',
+                    splitter: '<svg xmlns="http://www.w3.org/2000/svg" width="16" height="15" viewBox="0 0 16 15" fill="none"><path d="M8.6758 2.55V12.45C8.6758 12.629 8.60469 12.8007 8.4781 12.9273C8.35151 13.0539 8.17982 13.125 8.0008 13.125C7.82178 13.125 7.65009 13.0539 7.5235 12.9273C7.39692 12.8007 7.3258 12.629 7.3258 12.45V2.55C7.3258 2.37098 7.39692 2.19929 7.5235 2.0727C7.65009 1.94612 7.82178 1.875 8.0008 1.875C8.17982 1.875 8.35151 1.94612 8.4781 2.0727C8.60469 2.19929 8.6758 2.37098 8.6758 2.55ZM5.7508 6.825H3.33205L3.98005 6.17756C4.10686 6.05076 4.1781 5.87877 4.1781 5.69944C4.1781 5.52011 4.10686 5.34812 3.98005 5.22131C3.85324 5.09451 3.68126 5.02327 3.50193 5.02327C3.32259 5.02327 3.15061 5.09451 3.0238 5.22131L1.2238 7.02131C1.16087 7.08402 1.11094 7.15854 1.07687 7.24059C1.04281 7.32263 1.02527 7.4106 1.02527 7.49944C1.02527 7.58828 1.04281 7.67624 1.07687 7.75829C1.11094 7.84034 1.16087 7.91485 1.2238 7.97756L3.0238 9.77756C3.15061 9.90437 3.32259 9.97561 3.50193 9.97561C3.68126 9.97561 3.85324 9.90437 3.98005 9.77756C4.10686 9.65076 4.1781 9.47877 4.1781 9.29944C4.1781 9.12011 4.10686 8.94812 3.98005 8.82131L3.33205 8.175H5.7508C5.92982 8.175 6.10151 8.10388 6.2281 7.9773C6.35469 7.85071 6.4258 7.67902 6.4258 7.5C6.4258 7.32098 6.35469 7.14929 6.2281 7.0227C6.10151 6.89612 5.92982 6.825 5.7508 6.825ZM14.7784 7.02244L12.9784 5.22244C12.8516 5.09563 12.6796 5.02439 12.5002 5.02439C12.3209 5.02439 12.1489 5.09563 12.0221 5.22244C11.8953 5.34924 11.8241 5.52123 11.8241 5.70056C11.8241 5.8799 11.8953 6.05188 12.0221 6.17869L12.6696 6.825H10.2508C10.0718 6.825 9.90009 6.89612 9.77351 7.0227C9.64692 7.14929 9.5758 7.32098 9.5758 7.5C9.5758 7.67902 9.64692 7.85071 9.77351 7.9773C9.90009 8.10388 10.0718 8.175 10.2508 8.175H12.6696L12.0216 8.82244C11.8947 8.94924 11.8235 9.12123 11.8235 9.30056C11.8235 9.4799 11.8947 9.65188 12.0216 9.77869C12.1484 9.9055 12.3203 9.97673 12.4997 9.97673C12.679 9.97673 12.851 9.9055 12.9778 9.77869L14.7778 7.97869C14.8408 7.91602 14.8907 7.84153 14.9249 7.7595C14.959 7.67747 14.9766 7.58952 14.9766 7.50068C14.9767 7.41184 14.9592 7.32386 14.9252 7.2418C14.8911 7.15973 14.8413 7.08519 14.7784 7.02244Z" fill="#7114FF" /></svg>',
+                    favorited: '<svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" viewBox="-1 0 16 14" fill="none"><path d="M13.6555 6.14863L10.8367 8.60863L11.6811 12.2711C11.7258 12.4626 11.713 12.663 11.6445 12.8472C11.5759 13.0315 11.4545 13.1914 11.2955 13.3071C11.1365 13.4227 10.9469 13.489 10.7505 13.4975C10.5541 13.5059 10.3595 13.4564 10.1911 13.3549L6.99673 11.4174L3.80923 13.3549C3.64084 13.4564 3.44627 13.5059 3.24984 13.4975C3.05342 13.489 2.86385 13.4227 2.70485 13.3071C2.54586 13.1914 2.42447 13.0315 2.35589 12.8472C2.2873 12.663 2.27455 12.4626 2.31923 12.2711L3.16236 8.61238L0.342983 6.14863C0.193863 6.02002 0.086034 5.85024 0.0330176 5.66059C-0.0199988 5.47094 -0.0158426 5.26986 0.0449651 5.08257C0.105773 4.89527 0.220525 4.7301 0.374832 4.60776C0.529138 4.48542 0.71613 4.41137 0.912358 4.39488L4.62861 4.073L6.07923 0.613C6.15499 0.431448 6.28276 0.276367 6.44647 0.167286C6.61018 0.0582051 6.80251 0 6.99923 0C7.19596 0 7.38828 0.0582051 7.55199 0.167286C7.7157 0.276367 7.84348 0.431448 7.91923 0.613L9.37423 4.073L13.0892 4.39488C13.2855 4.41137 13.4725 4.48542 13.6268 4.60776C13.7811 4.7301 13.8958 4.89527 13.9566 5.08257C14.0174 5.26986 14.0216 5.47094 13.9686 5.66059C13.9156 5.85024 13.8077 6.02002 13.6586 6.14863H13.6555Z" fill="#FBE04B" /><path d="M6.99902 0.25C7.14627 0.25 7.29051 0.293425 7.41309 0.375C7.53566 0.456674 7.63171 0.573072 7.68848 0.708984V0.709961L9.14355 4.16992L9.20215 4.30859L9.35254 4.32227L13.0674 4.64355H13.0684C13.2155 4.65593 13.356 4.71196 13.4717 4.80371C13.5873 4.89545 13.6732 5.01975 13.7188 5.16016C13.7643 5.30054 13.7673 5.45162 13.7275 5.59375C13.6905 5.726 13.6166 5.84391 13.5166 5.9375L13.4912 5.95996L10.6719 8.41992L10.5596 8.51855L10.5928 8.66504L11.4375 12.3271V12.3281C11.471 12.4716 11.4615 12.6217 11.4102 12.7598C11.3587 12.8979 11.2676 13.0178 11.1484 13.1045C11.0292 13.1912 10.8866 13.2417 10.7393 13.248C10.5921 13.2543 10.4455 13.2167 10.3193 13.1406L7.12598 11.2041L6.99707 11.125L6.86719 11.2041L3.68066 13.1406C3.5544 13.2167 3.40802 13.2544 3.26074 13.248C3.11342 13.2417 2.97081 13.1912 2.85156 13.1045C2.73252 13.0178 2.64122 12.8978 2.58984 12.7598C2.53854 12.6217 2.52908 12.4715 2.5625 12.3281V12.3271L3.40625 8.66895L3.43945 8.52246L3.32715 8.42383L0.507812 5.95996L0.505859 5.95898C0.394312 5.86264 0.313187 5.73568 0.273438 5.59375C0.233696 5.45159 0.237665 5.30057 0.283203 5.16016C0.328809 5.01968 0.414543 4.89547 0.530273 4.80371C0.616997 4.73497 0.717368 4.68628 0.824219 4.66113L0.933594 4.64355L4.65039 4.32227L4.80078 4.30859L4.85938 4.16992L6.30957 0.709961V0.708984C6.36633 0.573009 6.46234 0.456704 6.58496 0.375C6.70754 0.293339 6.85173 0.250041 6.99902 0.25Z" stroke="#1C242D" stroke-opacity="0.12" stroke-width="0.5" /></svg>',
+                    google: '<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M15.04 8.16667C15.04 7.64667 14.9933 7.14667 14.9067 6.66667H8V9.50667H11.9467C11.7733 10.42 11.2533 11.1933 10.4733 11.7133V13.56H12.8533C14.24 12.28 15.04 10.4 15.04 8.16667Z" fill="#4285F4"/><path d="M7.99979 15.3333C9.97979 15.3333 11.6398 14.68 12.8531 13.56L10.4731 11.7133C9.81979 12.1533 8.98646 12.42 7.99979 12.42C6.09313 12.42 4.47313 11.1333 3.89313 9.39999H1.45312V11.2933C2.65979 13.6867 5.13313 15.3333 7.99979 15.3333Z" fill="#34A853"/><path d="M3.89317 9.39333C3.7465 8.95333 3.65984 8.48667 3.65984 8C3.65984 7.51333 3.7465 7.04667 3.89317 6.60667V4.71333H1.45317C0.953171 5.7 0.666504 6.81333 0.666504 8C0.666504 9.18667 0.953171 10.3 1.45317 11.2867L3.35317 9.80667L3.89317 9.39333Z" fill="#FBBC05"/><path d="M7.99979 3.58667C9.07979 3.58667 10.0398 3.96 10.8065 4.68L12.9065 2.58C11.6331 1.39334 9.97979 0.666672 7.99979 0.666672C5.13312 0.666672 2.65979 2.31334 1.45312 4.71334L3.89312 6.60667C4.47312 4.87334 6.09312 3.58667 7.99979 3.58667Z" fill="#EA4335"/></svg>',
+                    microsoft: '<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M0.695801 0.695656H7.65232V7.65218H0.695801V0.695656Z" fill="#F35325"/><path d="M8.34766 0.695656H15.3042V7.65218H8.34766V0.695656Z" fill="#81BC06"/><path d="M0.695801 8.34782H7.65232V15.3043H0.695801V8.34782Z" fill="#05A6F0"/><path d="M8.34766 8.34782H15.3042V15.3043H8.34766V8.34782Z" fill="#FFBA08"/></svg>',
+                },
+            },
+        },
+        configFile: join(currentDir, './unocss.config.ts'),
+        content: {
+            filesystem: [join(currentDir, './utils/design-tokens.ts')],
+            pipeline: {
+                include: [
+                    /composables\/.+\.ts($|\?)/,
+                    /\.stories\.ts($|\?)/,
+                    /\.(vue|svelte|[jt]sx|mdx?|astro|elm|php|phtml|html)($|\?)/,
+                ].filter(Boolean),
+            },
+        },
+    },
+
+    css: [
+        join(currentDir, './css/reset.css'),
+        join(currentDir, './css/text.css'),
+    ],
+
+    vite: {
+        vue: {
+            script: {
+                defineModel: true,
+            },
+        },
+    },
+})

package/package.json

@@ -0,0 +1,84 @@
+{
+  "name": "@meistrari/tela-build",
+  "version": "1.0.0",
+  "type": "module",
+  "files": [
+    "app.config.ts",
+    "components",
+    "components.json",
+    "composables",
+    "css",
+    "lib",
+    "modules",
+    "nuxt.config.ts",
+    "plugins",
+    "tsconfig.json",
+    "types",
+    "unocss.config.ts",
+    "utils"
+  ],
+  "dependencies": {
+    "@floating-ui/vue": "1.1.5",
+    "@iconify-json/ph": "1.2.2",
+    "@internationalized/date": "3.6.0",
+    "@internationalized/number": "3.6.0",
+    "@number-flow/vue": "^0.3.2",
+    "@nuxt/fonts": "^0.10.0",
+    "@nuxt/icon": "^1.9.0",
+    "@nuxt/kit": "4.2.0",
+    "@nuxtjs/color-mode": "^3.5.2",
+    "@nuxtjs/tailwindcss": "6.12.2",
+    "@unocss/nuxt": "0.65.4",
+    "@unocss/transformer-directives": "0.65.4",
+    "@vueuse/core": "11.2.0",
+    "@vueuse/nuxt": "12.8.2",
+    "class-variance-authority": "0.7.0",
+    "clsx": "2.1.1",
+    "glob": "11.0.0",
+    "gsap": "3.12.5",
+    "import-in-the-middle": "1.11.2",
+    "lucide-vue-next": "0.456.0",
+    "motion": "10.16.4",
+    "motion-v": "0.11.1",
+    "nitropack": "2.9.7",
+    "number-flow": "0.4.1",
+    "nuxt": "3.16.2",
+    "pathe": "1.1.2",
+    "radix-vue": "1.9.17",
+    "reka-ui": "2.3.0",
+    "resize-observer-polyfill": "1.5.1",
+    "tailwind-merge": "2.5.4",
+    "tailwindcss-animate": "1.0.7",
+    "ts-morph": "22.0.0",
+    "typescript": "5.8.2",
+    "unocss": "0.65.4",
+    "vue": "3.5.13",
+    "vue-component-meta": "3.0.8",
+    "vue-docgen-api": "4.78.0",
+    "vue-router": "4.5.0"
+  },
+  "devDependencies": {
+    "@storybook-vue/nuxt": "8.3.3",
+    "@storybook-vue/vue3": "7.4.0-alpha.2.1",
+    "@storybook/addon-essentials": "8.6.4",
+    "@storybook/addon-interactions": "8.6.4",
+    "@storybook/addon-links": "8.6.4",
+    "@storybook/blocks": "8.6.4",
+    "@storybook/builder-vite": "8.6.4",
+    "@storybook/test": "8.6.4",
+    "@types/node": "18.19.79",
+    "fs-extra": "11.2.0",
+    "gray-matter": "4.0.3",
+    "remark-gfm": "4.0.0",
+    "remark-parse": "11.0.0",
+    "remark-stringify": "11.0.0",
+    "storybook": "8.6.4",
+    "unified": "11.0.0"
+  },
+  "scripts": {
+    "postinstall": "nuxt prepare",
+    "storybook": "storybook dev --port 6006 --no-open",
+    "build-storybook": "IGNORE_APPLICATION=true storybook build",
+    "generate-docs": "bun scripts/generate-docs.ts"
+  }
+}

package/plugins/test-id.ts

@@ -0,0 +1,7 @@
+export default defineNuxtPlugin((nuxtApp) => {
+    nuxtApp.vueApp.directive('test', {
+        created(el, binding) {
+            el.setAttribute('data-testid', binding.value)
+        },
+    })
+})

package/tsconfig.json

@@ -0,0 +1,7 @@
+{
+    // https://nuxt.com/docs/guide/concepts/typescript
+    "extends": [
+        "./.nuxt/tsconfig.json",
+        "../../node_modules/@meistrari/mise-en-place/tsconfig.base.json"
+    ],
+}

package/types/custom-icon.ts

@@ -0,0 +1 @@
+export type TelaCustomIconName = 'circle' | 'pause' | 'queued' | 'close' | 'circle-notch' | 'circle-minus' | 'stop' | 'circle-dashed' | 'warning' | 'check' | 'check-dashed' | 'semi-circle' | 'arrow-down' | 'reported' | 'circle-warning' | 'slice' | 'half-slice'

package/types/index.ts

@@ -0,0 +1,2 @@
+export * from './custom-icon'
+export * from './status'

package/types/status.ts

@@ -0,0 +1 @@
+export type TelaStatusVariant = 'pending-run' | 'preparing-run' | 'waiting' | 'on-hold' | 'queued' | 'validation-error' | 'running' | 'executing' | 'processing' | 'verifying' | 'initializing' | 'waiting-user' | 'awaiting-approval' | 'paused' | 'stopped' | 'suspended' | 'running-issues' | 'completed' | 'success' | 'error' | 'failed' | 'cancelled' | 'archived' | 'reported' | 'expired' | 'pending-review' | 'reviewing' | 'reviewed' | 'approved' | 'approved-changes' | 'reproved' | 'partially-completed' | 'completed' | 'warning' | 'low-coverage' | 'medium-coverage'

package/unocss.config.ts

@@ -0,0 +1,89 @@
+import transformerDirectives from '@unocss/transformer-directives'
+import { defineConfig, toEscapedSelector } from 'unocss'
+import { DT } from './utils/design-tokens'
+
+export default defineConfig({
+    theme: {
+        ...DT,
+        animation: {
+            'accordion-down': 'accordion-down 0.2s ease-out',
+            'accordion-up': 'accordion-up 0.2s ease-out',
+            'collapsible-down': 'collapsible-down 0.2s ease-in-out',
+            'collapsible-up': 'collapsible-up 0.2s ease-in-out',
+        },
+        keyframes: {
+            'accordion-down': {
+                from: { height: 0 },
+                to: { height: 'var(--radix-accordion-content-height)' },
+            },
+            'accordion-up': {
+                from: { height: 'var(--radix-accordion-content-height)' },
+                to: { height: 0 },
+            },
+            'collapsible-down': {
+                from: { height: 0 },
+                to: { height: 'var(--radix-collapsible-content-height)' },
+            },
+            'collapsible-up': {
+                from: { height: 'var(--radix-collapsible-content-height)' },
+                to: { height: 0 },
+            },
+        },
+        dropShadow: {
+            DEFAULT: '0 1px 2px rgba(0, 0, 0, 0.05)',
+        },
+        easing: {
+            'out-slow': 'cubic-bezier(0,0,0.2,0.94)',
+        },
+    },
+
+    transformers: [transformerDirectives()],
+
+    shortcuts: [
+        ['debug', 'ring-2 ring-red ring-inset'],
+        ['clickable', 'cursor-pointer transition hover:translate-y--1px active:translate-y-1px'],
+        [/u-ring-([\d.]+)/, ([_, v]) => `ring-${v}`],
+        // typography
+        [/(body|heading)(-caption)?-(h[1-6]|\d+)-(thin|regular|medium|semibold|bold)/i, ([_, tag, type, size, weight]) => {
+            const [sizeFromToken] = Object
+                .entries(DT.fontSize)
+                .find(([sizeKey, [sizeValue]]) => {
+                    if (tag === 'body' && !sizeKey.includes('h'))
+                        return sizeValue === `${size}px`
+                    else if (tag === 'heading' && sizeKey.includes('h'))
+                        return sizeValue === `${size}px` || sizeKey === size
+                    else
+                        return false
+                }) ?? []
+
+            if (!sizeFromToken) {
+                return `text-${size}px leading-1em font-${weight} ${type === '-caption' ? 'uppercase' : ''}`
+            }
+
+            const sizeFontSpecs = (DT.fontSize as any)[sizeFromToken] as [string, { 'line-height': string, 'letter-spacing': string }]
+            const sizeStyle = `text-size-[${sizeFontSpecs[0]}] leading-${sizeFontSpecs[1]['line-height']} tracking-[${sizeFontSpecs[1]['letter-spacing']}]`
+            const isCaption = type === '-caption'
+
+            return `${sizeStyle} font-${weight} ${isCaption ? 'uppercase tracking-0.05em!' : ''}`
+        }],
+        // Catch for `text-(primary|secondary|tertiary|subtle|contrast|success|error|warning|pending)`
+        [/text-(primary|secondary|tertiary|subtle|contrast|success|error|warning|pending)/, ([_, v]) => `text-text-${v}`],
+        // Catch for `bg-(subtle|muted|lowered|success|error|warning)`
+        // Handle bg, bg-subtle, etc. Use bg-background if just 'bg'
+        [/^bg(?:-(subtle|muted|lowered|success|error|warning))?$/, ([_, v]) => v ? `bg-background-${v}` : 'bg-background'],
+        // Catch for `border-(subtle|strong)`
+        [/^border(?:-(subtle|strong))?$/, ([_, v]) => v ? `border-border-${v.toLowerCase()}` : 'border-border'],
+    ],
+    rules: [
+        [/bg-gradient-(\d+)/, ([_, v]) => ({
+            'background-image': `linear-gradient(${v}deg, var(--un-gradient-stops))`,
+        })],
+        [/no-scrollbar/, ([_], { rawSelector }) => {
+            const selector = toEscapedSelector(rawSelector)
+            return [
+                `${selector}::-webkit-scrollbar { display: none; }`,
+                `${selector} { -ms-overflow-style: none; scrollbar-width: none; }`,
+            ].join('\n')
+        }],
+    ],
+})

package/utils/component-utils.ts

@@ -0,0 +1,30 @@
+import { type ClassValue, clsx } from 'clsx'
+import { twMerge } from 'tailwind-merge'
+import { camelize, getCurrentInstance, toHandlerKey } from 'vue'
+
+export type NumericProperties<T extends object> = {
+    [K in keyof T]-?: [number] extends [T[K]] ? K : never
+}[keyof T]
+
+export function cn(...inputs: ClassValue[]) {
+    return twMerge(clsx(inputs))
+}
+
+export function useEmitAsProps<Name extends string>(
+    emit: (name: Name, ...args: any[]) => void,
+) {
+    const vm = getCurrentInstance()
+
+    const events = vm?.type.emits as Name[]
+    const result: Record<string, any> = {}
+    if (!events?.length) {
+        console.warn(
+            `No emitted event found. Please check component: ${vm?.type.__name}`,
+        )
+    }
+
+    events?.forEach((ev) => {
+        result[toHandlerKey(camelize(ev))] = (...arg: any) => emit(ev, ...arg)
+    })
+    return result
+}