flexacore-ui-dev
Version:
Universal UI Framework for CDN, React, Angular, Vue, Svelte with TypeScript support
1 lines • 5.61 kB
JavaScript
!function(t,e){"use strict";class i{constructor(){this.version="2.0.0",this.plugins=new Map,this.components=new Map,this.themes=new Map,this.config={autoInit:!0,debug:!1,theme:"default",rtl:!1,locale:"en",breakpoints:{xs:0,sm:576,md:768,lg:992,xl:1200,xxl:1400},colors:{primary:"#007bff",secondary:"#6c757d",success:"#28a745",danger:"#dc3545",warning:"#ffc107",info:"#17a2b8",light:"#f8f9fa",dark:"#343a40"},spacing:{xs:"0.25rem",sm:"0.5rem",md:"1rem",lg:"1.5rem",xl:"3rem"},typography:{fontFamily:{sans:["-apple-system","BlinkMacSystemFont","Segoe UI","Roboto","sans-serif"],serif:["Georgia","Times","serif"],mono:["SFMono-Regular","Monaco","Consolas","monospace"]},fontSize:{xs:"0.75rem",sm:"0.875rem",base:"1rem",lg:"1.125rem",xl:"1.25rem","2xl":"1.5rem","3xl":"1.875rem","4xl":"2.25rem"}}},this.events=new Map,this.state=new Map,this.initialized=!1,this.init=this.init.bind(this),this.registerPlugin=this.registerPlugin.bind(this),this.registerComponent=this.registerComponent.bind(this),this.registerTheme=this.registerTheme.bind(this),this.emit=this.emit.bind(this),this.on=this.on.bind(this),this.off=this.off.bind(this)}init(t={}){return this.initialized?(this.log("FlexaCore already initialized"),this):(this.config=this.deepMerge(this.config,t),this.state.set("initialized",!0),this.state.set("theme",this.config.theme),this.state.set("rtl",this.config.rtl),this.initCore(),this.initPlugins(),this.initComponents(),this.initThemes(),this.setupEventListeners(),this.initialized=!0,this.emit("ready",{engine:this}),this.log("FlexaCore Engine initialized successfully"),this)}initCore(){e.body.classList.add("flexacore-loaded"),this.setupCSSProperties(),this.initResponsive(),this.initAccessibility()}setupCSSProperties(){const t=e.documentElement;Object.entries(this.config.colors).forEach(([e,i])=>{t.style.setProperty(`--fc-${e}`,i)}),Object.entries(this.config.spacing).forEach(([e,i])=>{t.style.setProperty(`--fc-spacing-${e}`,i)}),Object.entries(this.config.typography.fontSize).forEach(([e,i])=>{t.style.setProperty(`--fc-text-${e}`,i)}),Object.entries(this.config.breakpoints).forEach(([e,i])=>{t.style.setProperty(`--fc-breakpoint-${e}`,`${i}px`)})}initResponsive(){const e={};Object.entries(this.config.breakpoints).forEach(([i,s])=>{s>0&&(e[i]=t.matchMedia(`(min-width: ${s}px)`))}),this.state.set("mediaQueries",e),Object.entries(e).forEach(([t,e])=>{e.addListener(()=>{this.emit("breakpoint-change",{breakpoint:t,matches:e.matches})})})}initAccessibility(){e.addEventListener("keydown",t=>{"Tab"===t.key&&e.body.classList.add("keyboard-navigation")}),e.addEventListener("mousedown",()=>{e.body.classList.remove("keyboard-navigation")}),this.state.set("focusTrap",null)}initPlugins(){this.plugins.forEach((t,e)=>{if("function"==typeof t.init)try{t.init(this),this.log(`Plugin "${e}" initialized`)}catch(t){this.error(`Failed to initialize plugin "${e}":`,t)}})}initComponents(){this.components.forEach((t,e)=>{if("function"==typeof t.init)try{t.init(this),this.log(`Component "${e}" initialized`)}catch(t){this.error(`Failed to initialize component "${e}":`,t)}})}initThemes(){const t=this.state.get("theme"),e=this.themes.get(t);e&&"function"==typeof e.apply&&e.apply(this)}setupEventListeners(){t.addEventListener("flexacore-theme-change",t=>{this.state.set("theme",t.detail.theme)}),t.addEventListener("flexacore-rtl-change",t=>{this.state.set("rtl",t.detail.rtl)})}registerPlugin(t,e){return this.plugins.has(t)&&this.warn(`Plugin "${t}" already registered, overwriting`),this.plugins.set(t,e),this.initialized&&"function"==typeof e.init&&e.init(this),this.log(`Plugin "${t}" registered`),this}registerComponent(t,e){return this.components.has(t)&&this.warn(`Component "${t}" already registered, overwriting`),this.components.set(t,e),this.initialized&&"function"==typeof e.init&&e.init(this),this.log(`Component "${t}" registered`),this}registerTheme(t,e){return this.themes.has(t)&&this.warn(`Theme "${t}" already registered, overwriting`),this.themes.set(t,e),this.log(`Theme "${t}" registered`),this}on(t,e){return this.events.has(t)||this.events.set(t,[]),this.events.get(t).push(e),this}off(t,e){if(this.events.has(t)){const i=this.events.get(t),s=i.indexOf(e);s>-1&&i.splice(s,1)}return this}emit(e,i={}){return this.events.has(e)&&this.events.get(e).forEach(t=>{try{t(i)}catch(t){this.error(`Error in event "${e}" callback:`,t)}}),t.dispatchEvent(new CustomEvent(`flexacore-${e}`,{detail:i})),this}getState(t){return this.state.get(t)}setState(t,e){return this.state.set(t,e),this.emit("state-change",{key:t,value:e}),this}getConfig(t){return t?this.config[t]:this.config}setConfig(t,e){return"object"==typeof t?this.config=this.deepMerge(this.config,t):this.config[t]=e,this.emit("config-change",{key:t,value:e}),this}deepMerge(t,e){const i={...t};for(const t in e)e[t]&&"object"==typeof e[t]&&!Array.isArray(e[t])?i[t]=this.deepMerge(i[t]||{},e[t]):i[t]=e[t];return i}log(...t){this.config.debug&&console.log("[FlexaCore]",...t)}warn(...t){this.config.debug&&console.warn("[FlexaCore]",...t)}error(...t){console.error("[FlexaCore]",...t)}getAPI(){return{version:this.version,init:this.init.bind(this),registerPlugin:this.registerPlugin.bind(this),registerComponent:this.registerComponent.bind(this),registerTheme:this.registerTheme.bind(this),on:this.on.bind(this),off:this.off.bind(this),emit:this.emit.bind(this),getState:this.getState.bind(this),setState:this.setState.bind(this),getConfig:this.getConfig.bind(this),setConfig:this.setConfig.bind(this),plugins:this.plugins,components:this.components,themes:this.themes}}}t.FlexaCoreEngine=i,t.flexacore=new i}(window,document);