balm-ui
Version:
A modular and customizable UI library based on Material Design and Vue 3
1 lines • 4.66 kB
JavaScript
!function(e,t){"object"===typeof exports&&"object"===typeof module?module.exports=t():"function"===typeof define&&define.amd?define("$theme",[],t):"object"===typeof exports?exports.$theme=t():e.$theme=t()}("undefined"!==typeof self?self:this,(function(){return function(){"use strict";var e={d:function(t,r){for(var o in r)e.o(r,o)&&!e.o(t,o)&&Object.defineProperty(t,o,{enumerable:!0,get:r[o]})},o:function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},r:function(e){"undefined"!==typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})}},t={};function r(e){return"dark"===function(e){var t,r,o;return e.match(/^rgb/)?(t=(e=e.match(/^rgba?\((\d+),\s*(\d+),\s*(\d+)(?:,\s*(\d+(?:\.\d+)?))?\)$/))[1],r=e[2],o=e[3]):(t=(e=+("0x"+e.slice(1).replace(e.length<5&&/./g,"$&$&")))>>16,r=e>>8&255,o=255&e),Math.sqrt(t*t*.299+r*r*.587+o*o*.114)>127.5?"light":"dark"}(e)?"light":"dark"}e.r(t),e.d(t,{default:function(){return p},install:function(){return y},useTheme:function(){return T}});const o=["primary","secondary","background","surface","error","on-primary","on-secondary","on-surface","on-error"],n=[...o,"primary-bg","secondary-bg"],s=["primary","secondary","hint","disabled","icon"],i=["background","light","dark"],a="Please choose a theme style: "+JSON.stringify(o),h="Please choose a theme style: "+JSON.stringify(n),c="Please choose a text style: "+JSON.stringify(s),u="Please choose a theme tone: "+JSON.stringify(i),l=new Map,d=new Map;class g{get themeColors(){return l}get textColors(){return d}getTheme(e){let t=arguments.length>1&&void 0!==arguments[1]&&arguments[1],r="";if(!n.includes(e))throw new Error(`[$theme]: Theme ${t?"Class":"Color"}]: ${h}`);return r=t?`mdc-theme--${e}`:l.get(e),r}setTheme(e,t){document.documentElement.style.setProperty(`--mdc-theme-${e}`,t),l.set(e,t)}themeText(e,t,r){let o="";if(!s.includes(e))throw new Error(`[$theme]: ${c}`);if(!i.includes(t))throw new Error(`[$theme]: ${u}`);return o=r(),o}getText(e,t){let r=arguments.length>2&&void 0!==arguments[2]&&arguments[2];return this.themeText(e,t,(()=>r?`mdc-theme--text-${e}-on-${t}`:d.get(`${e}-on-${t}`)))}setText(e,t,r){this.themeText(e,t,(()=>{document.documentElement.style.setProperty(`--mdc-theme-text-${e}-on-${t}`,r),d.set(`${e}-on-${t}`,r)}))}}const m=new class extends g{get primary(){return l.get("primary")}set primary(e){this.setTheme("primary",e),this.setTheme("on-primary","dark"===r(e)?"#000":"#fff")}get secondary(){return l.get("secondary")}set secondary(e){this.setTheme("secondary",e),this.setTheme("on-secondary","dark"===r(e)?"#000":"#fff")}get background(){return l.get("background")}set background(e){this.setTheme("background",e)}get surface(){return l.get("surface")}set surface(e){this.setTheme("surface",e),this.setTheme("on-surface","dark"===r(e)?"#000":"#fff")}get error(){return l.get("error")}set error(e){this.setTheme("error",e),this.setTheme("on-error","dark"===r(e)?"#000":"#fff")}get onPrimary(){return l.get("on-primary")}set onPrimary(e){this.setTheme("on-primary",e)}get onSecondary(){return l.get("on-secondary")}set onSecondary(e){this.setTheme("on-secondary",e)}get onSurface(){return l.get("on-surface")}set onSurface(e){this.setTheme("on-surface",e)}get onError(){return l.get("on-error")}set onError(e){this.setTheme("on-error",e)}set colors(e){const t=Object.keys(e);if(!t.every((e=>o.includes(e))))throw new Error(`[$theme]: ${a}`);t.forEach((t=>this.setTheme(t,e[t]))),["primary","secondary","surface","error"].forEach((o=>{t.includes(o)&&!t.includes(`on-${o}`)&&this.setTheme(`on-${o}`,"dark"===r(e[o])?"#000":"#fff")}))}getThemeColor(e){return this.getTheme(e)}getThemeClass(e){let t="";return t=Array.isArray(e)?e.map((e=>this.getTheme(e,!0))):this.getTheme(e,!0),t}getTextColor(e){let t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:"background";return this.getText(e,t)}getTextClass(e){let t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:"background";return this.getText(e,t,!0)}setTextColor(e,t){this.setText(e,"background",t)}getTextColorOnLight(e){return this.getTextColor(e,"light")}getTextClassOnLight(e){return this.getTextClass(e,"light")}setTextColorOnLight(e,t){this.setText(e,"light",t)}getTextColorOnDark(e){return this.getTextColor(e,"dark")}getTextClassOnDark(e){return this.getTextClass(e,"dark")}setTextColorOnDark(e,t){this.setText(e,"dark",t)}};let f=!1;function y(e){let t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};e.mixin({mounted(){f||(f=!0,m.colors=t)}}),e.config.globalProperties.$theme=m,e.provide("theme",m)}const T=()=>m;var p={install:y};return t}()}));