@vladimirdukelic/revolutionary-ui-factory
Version:
Revolutionary UI Factory System v2 - Generate ANY UI component for ANY framework with 60-95% code reduction
183 lines • 7.33 kB
JavaScript
;
/**
* Revolutionary UI Factory - Complete Resources Configuration
* Master list of all frameworks, libraries, and tools available for component generation
*/
Object.defineProperty(exports, "__esModule", { value: true });
exports.FACTORY_CAPABILITIES = exports.FRAMEWORK_FEATURE_MATRIX = exports.FONTS = exports.COLOR_TOOLS = exports.DESIGN_TOOLS = exports.ICON_LIBRARIES = exports.UI_LIBRARIES = exports.FRAMEWORK_CONFIGS = exports.PACKAGE_CATEGORIES = exports.CSS_IN_JS_SOLUTIONS = exports.TAILWIND_UTILITIES = exports.getFactoryResourceStats = void 0;
const frameworks_1 = require("./frameworks");
Object.defineProperty(exports, "FRAMEWORK_CONFIGS", { enumerable: true, get: function () { return frameworks_1.FRAMEWORK_CONFIGS; } });
const ui_libraries_1 = require("./ui-libraries");
Object.defineProperty(exports, "UI_LIBRARIES", { enumerable: true, get: function () { return ui_libraries_1.UI_LIBRARIES; } });
const icon_libraries_1 = require("./icon-libraries");
Object.defineProperty(exports, "ICON_LIBRARIES", { enumerable: true, get: function () { return icon_libraries_1.ICON_LIBRARIES; } });
const design_tools_1 = require("./design-tools");
Object.defineProperty(exports, "DESIGN_TOOLS", { enumerable: true, get: function () { return design_tools_1.DESIGN_TOOLS; } });
Object.defineProperty(exports, "COLOR_TOOLS", { enumerable: true, get: function () { return design_tools_1.COLOR_TOOLS; } });
Object.defineProperty(exports, "FONTS", { enumerable: true, get: function () { return design_tools_1.FONTS; } });
const getFactoryResourceStats = () => {
const totalIcons = icon_libraries_1.ICON_LIBRARIES.reduce((total, lib) => {
const count = parseInt(lib.iconCount.replace(/[^0-9]/g, '')) || 0;
return total + count;
}, 0);
return {
totalFrameworks: frameworks_1.FRAMEWORK_CONFIGS.length,
totalUILibraries: ui_libraries_1.UI_LIBRARIES.length,
totalIconLibraries: icon_libraries_1.ICON_LIBRARIES.length,
totalIcons,
totalDesignTools: design_tools_1.DESIGN_TOOLS.length,
totalColorTools: design_tools_1.COLOR_TOOLS.length,
totalFonts: design_tools_1.FONTS.length,
totalPackages: frameworks_1.FRAMEWORK_CONFIGS.length + ui_libraries_1.UI_LIBRARIES.length + icon_libraries_1.ICON_LIBRARIES.length +
design_tools_1.DESIGN_TOOLS.length + design_tools_1.COLOR_TOOLS.length + design_tools_1.FONTS.length
};
};
exports.getFactoryResourceStats = getFactoryResourceStats;
// Tailwind CSS Utilities
exports.TAILWIND_UTILITIES = {
plugins: [
'@tailwindcss/forms',
'@tailwindcss/typography',
'@tailwindcss/aspect-ratio',
'@tailwindcss/container-queries',
'tailwindcss-animate'
],
utilities: [
'tailwind-merge',
'class-variance-authority'
]
};
// CSS-in-JS Solutions
exports.CSS_IN_JS_SOLUTIONS = [
{
id: 'styled-components',
name: 'Styled Components',
description: 'Visual primitives for the component age'
},
{
id: 'emotion',
name: 'Emotion',
description: 'CSS-in-JS library designed for high performance'
},
{
id: 'stitches',
name: 'Stitches',
description: 'CSS-in-JS with best-in-class developer experience'
},
{
id: 'vanilla-extract',
name: 'Vanilla Extract',
description: 'Zero-runtime CSS-in-TypeScript'
},
{
id: 'styled-system',
name: 'Styled System',
description: 'Style props for rapid UI development'
}
];
// Complete Package Categories
exports.PACKAGE_CATEGORIES = {
// JavaScript Frameworks
frameworks: {
title: 'JavaScript Frameworks',
description: 'Core frameworks for building web applications',
packages: frameworks_1.FRAMEWORK_CONFIGS.map(f => f.packageName)
},
// UI Component Libraries
uiLibraries: {
title: 'UI Component Libraries',
description: 'Pre-built component libraries and design systems',
packages: ui_libraries_1.UI_LIBRARIES.map(lib => lib.packageName)
},
// Icon Libraries
icons: {
title: 'Icon Libraries',
description: 'Comprehensive icon sets for every design need',
packages: icon_libraries_1.ICON_LIBRARIES.map(lib => lib.packageName)
},
// Design Tools
designTools: {
title: 'Design Tools & Converters',
description: 'Import and convert designs from Figma, Sketch, and more',
packages: design_tools_1.DESIGN_TOOLS.map(tool => tool.packageName)
},
// Color & Style Tools
styling: {
title: 'Color & Styling Tools',
description: 'Color manipulation and CSS-in-JS solutions',
packages: [...design_tools_1.COLOR_TOOLS.map(tool => tool.packageName), ...exports.CSS_IN_JS_SOLUTIONS.map(s => s.id)]
},
// Typography
typography: {
title: 'Typography & Fonts',
description: 'Beautiful fonts for every project',
packages: design_tools_1.FONTS.map(font => font.packageName)
},
// Utilities
utilities: {
title: 'Utilities & Helpers',
description: 'Essential utilities for component development',
packages: [
'clsx',
'tailwind-merge',
'class-variance-authority',
'framer-motion',
'zod'
]
}
};
// Feature Matrix - What each framework supports
exports.FRAMEWORK_FEATURE_MATRIX = {
react: {
frameworks: ['next', 'gatsby', 'remix', 'vite'],
uiLibraries: ['mui', 'antd', 'chakra', 'mantine', 'radix', 'headlessui'],
styling: ['styled-components', 'emotion', 'tailwind', 'css-modules'],
testing: ['jest', 'testing-library', 'cypress', 'playwright']
},
vue: {
frameworks: ['nuxt', 'vitepress', 'quasar'],
uiLibraries: ['vuetify', 'element-plus', 'naive-ui', 'headlessui'],
styling: ['tailwind', 'css-modules', 'scss'],
testing: ['vitest', 'cypress', 'playwright']
},
angular: {
frameworks: ['ionic', 'ngrx'],
uiLibraries: ['material', 'primeng', 'ng-bootstrap'],
styling: ['tailwind', 'scss', 'css-modules'],
testing: ['karma', 'jasmine', 'cypress']
},
svelte: {
frameworks: ['sveltekit'],
uiLibraries: ['carbon-components-svelte', 'smelte'],
styling: ['tailwind', 'scss', 'postcss'],
testing: ['vitest', 'playwright']
}
};
// Revolutionary UI Factory Capabilities
exports.FACTORY_CAPABILITIES = {
componentGeneration: {
frameworks: frameworks_1.FRAMEWORK_CONFIGS.length,
uiLibraries: ui_libraries_1.UI_LIBRARIES.length,
customization: 'Full theme and variant support',
codeReduction: '60-95%'
},
designImport: {
figma: true,
sketch: true,
adobe: false, // Coming soon
penpot: false // Coming soon
},
aiFeatures: {
naturalLanguage: true,
codeGeneration: true,
designToCode: true,
optimization: true
},
export: {
formats: ['React', 'Vue', 'Angular', 'Svelte', 'Web Components'],
styling: ['Tailwind', 'CSS-in-JS', 'CSS Modules', 'Vanilla CSS'],
typescript: true,
testing: true
}
};
//# sourceMappingURL=factory-resources.js.map