@xanui/core 1.1.2 → 1.1.3
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/ServerStyleTags.d.ts +3 -0
- package/ServerStyleTags.js +2 -0
- package/ServerStyleTags.js.map +7 -0
- package/Tag/cssPropList.d.ts +2 -0
- package/Tag/cssPropList.js +2 -0
- package/Tag/cssPropList.js.map +7 -0
- package/Tag/index.d.ts +4 -0
- package/Tag/index.js +2 -0
- package/Tag/index.js.map +7 -0
- package/{src/Tag/types.ts → Tag/types.d.ts} +9 -13
- package/Tag/types.js +1 -0
- package/Tag/types.js.map +7 -0
- package/Tag/useTagProps.d.ts +3 -0
- package/Tag/useTagProps.js +2 -0
- package/Tag/useTagProps.js.map +7 -0
- package/Transition/index.d.ts +31 -0
- package/Transition/index.js +2 -0
- package/Transition/index.js.map +7 -0
- package/Transition/variants.d.ts +131 -0
- package/Transition/variants.js +2 -0
- package/Transition/variants.js.map +7 -0
- package/breakpoint/index.d.ts +6 -0
- package/breakpoint/index.js +2 -0
- package/breakpoint/index.js.map +7 -0
- package/breakpoint/useBreakpoint.d.ts +10 -0
- package/breakpoint/useBreakpoint.js +2 -0
- package/breakpoint/useBreakpoint.js.map +7 -0
- package/breakpoint/useBreakpointProps.d.ts +6 -0
- package/breakpoint/useBreakpointProps.js +2 -0
- package/breakpoint/useBreakpointProps.js.map +7 -0
- package/cjs/ServerStyleTags.js +2 -0
- package/cjs/ServerStyleTags.js.map +7 -0
- package/cjs/Tag/cssPropList.js +2 -0
- package/cjs/Tag/cssPropList.js.map +7 -0
- package/cjs/Tag/index.js +2 -0
- package/cjs/Tag/index.js.map +7 -0
- package/cjs/Tag/types.js +2 -0
- package/cjs/Tag/types.js.map +7 -0
- package/cjs/Tag/useTagProps.js +2 -0
- package/cjs/Tag/useTagProps.js.map +7 -0
- package/cjs/Transition/index.js +2 -0
- package/cjs/Transition/index.js.map +7 -0
- package/cjs/Transition/variants.js +2 -0
- package/cjs/Transition/variants.js.map +7 -0
- package/cjs/breakpoint/index.js +2 -0
- package/cjs/breakpoint/index.js.map +7 -0
- package/cjs/breakpoint/useBreakpoint.js +2 -0
- package/cjs/breakpoint/useBreakpoint.js.map +7 -0
- package/cjs/breakpoint/useBreakpointProps.js +2 -0
- package/cjs/breakpoint/useBreakpointProps.js.map +7 -0
- package/cjs/css/aliases.js +2 -0
- package/cjs/css/aliases.js.map +7 -0
- package/cjs/css/getProps.js +2 -0
- package/cjs/css/getProps.js.map +7 -0
- package/cjs/css/getValue.js +2 -0
- package/cjs/css/getValue.js.map +7 -0
- package/cjs/css/index.js +2 -0
- package/cjs/css/index.js.map +7 -0
- package/cjs/css/types.js +2 -0
- package/cjs/css/types.js.map +7 -0
- package/cjs/index.js +2 -0
- package/cjs/index.js.map +7 -0
- package/cjs/isWindow.js +2 -0
- package/cjs/isWindow.js.map +7 -0
- package/cjs/theme/ThemeCssVars.js +2 -0
- package/cjs/theme/ThemeCssVars.js.map +7 -0
- package/cjs/theme/ThemeDefaultOptions.js +2 -0
- package/cjs/theme/ThemeDefaultOptions.js.map +7 -0
- package/cjs/theme/ThemeProvider.js +2 -0
- package/cjs/theme/ThemeProvider.js.map +7 -0
- package/cjs/theme/core.js +2 -0
- package/cjs/theme/core.js.map +7 -0
- package/cjs/theme/createColor.js +2 -0
- package/cjs/theme/createColor.js.map +7 -0
- package/cjs/theme/createTheme.js +2 -0
- package/cjs/theme/createTheme.js.map +7 -0
- package/cjs/theme/createThemeSwitcher.js +2 -0
- package/cjs/theme/createThemeSwitcher.js.map +7 -0
- package/cjs/theme/index.js +2 -0
- package/cjs/theme/index.js.map +7 -0
- package/cjs/theme/types.js +2 -0
- package/cjs/theme/types.js.map +7 -0
- package/cjs/useAnimation.js +2 -0
- package/cjs/useAnimation.js.map +7 -0
- package/cjs/useColorTemplate.js +2 -0
- package/cjs/useColorTemplate.js.map +7 -0
- package/cjs/useInterface.js +2 -0
- package/cjs/useInterface.js.map +7 -0
- package/css/aliases.d.ts +4 -0
- package/css/aliases.js +2 -0
- package/css/aliases.js.map +7 -0
- package/css/getProps.d.ts +3 -0
- package/css/getProps.js +2 -0
- package/css/getProps.js.map +7 -0
- package/css/getValue.d.ts +3 -0
- package/css/getValue.js +2 -0
- package/css/getValue.js.map +7 -0
- package/css/index.d.ts +15 -0
- package/css/index.js +2 -0
- package/css/index.js.map +7 -0
- package/{src/css/types.ts → css/types.d.ts} +16 -22
- package/css/types.js +1 -0
- package/css/types.js.map +7 -0
- package/index.d.ts +21 -0
- package/index.js +2 -0
- package/index.js.map +7 -0
- package/isWindow.d.ts +2 -0
- package/isWindow.js +2 -0
- package/isWindow.js.map +7 -0
- package/package.json +43 -49
- package/theme/ThemeCssVars.d.ts +3 -0
- package/theme/ThemeCssVars.js +2 -0
- package/theme/ThemeCssVars.js.map +7 -0
- package/theme/ThemeDefaultOptions.d.ts +68 -0
- package/theme/ThemeDefaultOptions.js +2 -0
- package/theme/ThemeDefaultOptions.js.map +7 -0
- package/theme/ThemeProvider.d.ts +11 -0
- package/theme/ThemeProvider.js +2 -0
- package/theme/ThemeProvider.js.map +7 -0
- package/theme/core.d.ts +7 -0
- package/theme/core.js +2 -0
- package/theme/core.js.map +7 -0
- package/theme/createColor.d.ts +41 -0
- package/theme/createColor.js +2 -0
- package/theme/createColor.js.map +7 -0
- package/theme/createTheme.d.ts +2 -0
- package/theme/createTheme.js +2 -0
- package/theme/createTheme.js.map +7 -0
- package/theme/createThemeSwitcher.d.ts +6 -0
- package/theme/createThemeSwitcher.js +2 -0
- package/theme/createThemeSwitcher.js.map +7 -0
- package/theme/index.d.ts +5 -0
- package/theme/index.js +2 -0
- package/theme/index.js.map +7 -0
- package/{src/theme/types.ts → theme/types.d.ts} +46 -103
- package/theme/types.js +1 -0
- package/theme/types.js.map +7 -0
- package/useAnimation.d.ts +18 -0
- package/useAnimation.js +2 -0
- package/useAnimation.js.map +7 -0
- package/useColorTemplate.d.ts +4 -0
- package/useColorTemplate.js +2 -0
- package/useColorTemplate.js.map +7 -0
- package/useInterface.d.ts +2 -0
- package/useInterface.js +2 -0
- package/useInterface.js.map +7 -0
- package/main.tsx +0 -97
- package/src/ServerStyleTags.tsx +0 -12
- package/src/Tag/cssPropList.ts +0 -191
- package/src/Tag/index.tsx +0 -11
- package/src/Tag/useTagProps.ts +0 -28
- package/src/Transition/index.tsx +0 -148
- package/src/Transition/variants.ts +0 -178
- package/src/breakpoint/index.tsx +0 -52
- package/src/breakpoint/useBreakpoint.ts +0 -31
- package/src/breakpoint/useBreakpointProps.ts +0 -57
- package/src/css/aliases.ts +0 -35
- package/src/css/getProps.ts +0 -38
- package/src/css/getValue.ts +0 -117
- package/src/css/index.ts +0 -78
- package/src/index.ts +0 -34
- package/src/isWindow.ts +0 -3
- package/src/theme/ThemeCssVars.ts +0 -107
- package/src/theme/ThemeDefaultOptions.ts +0 -146
- package/src/theme/ThemeProvider.tsx +0 -140
- package/src/theme/core.ts +0 -21
- package/src/theme/createColor.ts +0 -53
- package/src/theme/createTheme.ts +0 -33
- package/src/theme/createThemeSwitcher.ts +0 -18
- package/src/theme/index.tsx +0 -17
- package/src/useAnimation.ts +0 -40
- package/src/useColorTemplate.ts +0 -11
- package/src/useInterface.ts +0 -13
- package/tsconfig.json +0 -28
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
"use strict";var r=Object.defineProperty;var m=Object.getOwnPropertyDescriptor;var o=Object.getOwnPropertyNames;var s=Object.prototype.hasOwnProperty;var a=(t,e)=>{for(var n in e)r(t,n,{get:e[n],enumerable:!0})},h=(t,e,n,i)=>{if(e&&typeof e=="object"||typeof e=="function")for(let c of o(e))!s.call(t,c)&&c!==n&&r(t,c,{get:()=>e[c],enumerable:!(i=m(e,c))||i.enumerable});return t};var x=t=>h(r({},"__esModule",{value:!0}),t);var j={};a(j,{default:()=>g});module.exports=x(j);var f=require("./theme");const b=(t,e,n)=>{const i=(0,f.useTheme)(),c=i.interfaces[t];return c&&(n=c({...n,...e},i)),[{...n,...e},i]};var g=b;
|
|
2
|
+
//# sourceMappingURL=useInterface.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../src/useInterface.ts"],
|
|
4
|
+
"sourcesContent": ["import { useTheme } from \"./theme\"\n\nconst useInterface = <P extends object>(name: string, userPorps: P, defaultProps: P) => {\n const theme = useTheme()\n const _interface = theme.interfaces[name]\n\n if (_interface) {\n defaultProps = _interface<P>({ ...defaultProps, ...userPorps }, theme)\n }\n return [{ ...defaultProps, ...userPorps }, theme]\n}\n\nexport default useInterface"],
|
|
5
|
+
"mappings": "yaAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GAAA,IAAAI,EAAyB,mBAEzB,MAAMC,EAAe,CAAmBC,EAAcC,EAAcC,IAAoB,CACpF,MAAMC,KAAQ,YAAS,EACjBC,EAAaD,EAAM,WAAWH,CAAI,EAExC,OAAII,IACAF,EAAeE,EAAc,CAAE,GAAGF,EAAc,GAAGD,CAAU,EAAGE,CAAK,GAElE,CAAC,CAAE,GAAGD,EAAc,GAAGD,CAAU,EAAGE,CAAK,CACpD,EAEA,IAAOP,EAAQG",
|
|
6
|
+
"names": ["useInterface_exports", "__export", "useInterface_default", "__toCommonJS", "import_theme", "useInterface", "name", "userPorps", "defaultProps", "theme", "_interface"]
|
|
7
|
+
}
|
package/css/aliases.d.ts
ADDED
package/css/aliases.js
ADDED
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
const i=(o,a)=>typeof o=="string"?o:a,r={bgcolor:o=>({backgroundColor:o}),bgimage:o=>({backgroundImage:`url(${o})`,backgroundSize:"cover",backgroundRepeat:"no-repeat"}),bg:o=>({background:o}),p:o=>({padding:i(o,8*o)}),pt:o=>({paddingTop:i(o,8*o)}),pr:o=>({paddingRight:i(o,8*o)}),pb:o=>({paddingBottom:i(o,8*o)}),pl:o=>({paddingLeft:i(o,8*o)}),px:o=>({paddingLeft:i(o,8*o),paddingRight:i(o,8*o)}),py:o=>({paddingTop:i(o,8*o),paddingBottom:i(o,8*o)}),m:o=>({margin:i(o,8*o)}),mt:o=>({marginTop:i(o,8*o)}),mr:o=>({marginRight:i(o,8*o)}),mb:o=>({marginBottom:i(o,8*o)}),ml:o=>({marginLeft:i(o,8*o)}),mx:o=>({marginLeft:i(o,8*o),marginRight:i(o,8*o)}),my:o=>({marginTop:i(o,8*o),marginBottom:i(o,8*o)}),radius:o=>({borderRadius:i(o,8*o)}),borderRadius:o=>({borderRadius:i(o,8*o)}),shadow:o=>({boxShadow:o}),flexBox:o=>o?{display:"flex"}:{},flexRow:o=>o?{flexDirection:"row"}:{},flexColumn:o=>o?{flexDirection:"column"}:{},flexWraped:o=>o?{flexWrap:"wrap"}:{},direction:o=>o==="row"||o==="column"?{flexDirection:o}:{direction:o},gap:o=>({gap:i(o,8*o)})};var g=r;export{g as default};
|
|
2
|
+
//# sourceMappingURL=aliases.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../src/css/aliases.ts"],
|
|
4
|
+
"sourcesContent": ["import { OptionAliases } from 'oncss'\nimport { Aliases } from './types'\n\nconst isStr = (v: any, or: any) => typeof v === 'string' ? v : or\n\nconst aliases: OptionAliases<Aliases> = {\n bgcolor: (v) => ({ backgroundColor: v }),\n bgimage: (v) => ({ backgroundImage: `url(${v})`, backgroundSize: \"cover\", backgroundRepeat: \"no-repeat\" }),\n bg: (v) => ({ background: v }),\n p: (v) => ({ padding: isStr(v, 8 * v) }),\n pt: (v) => ({ paddingTop: isStr(v, 8 * v) }),\n pr: (v) => ({ paddingRight: isStr(v, 8 * v) }),\n pb: (v) => ({ paddingBottom: isStr(v, 8 * v) }),\n pl: (v) => ({ paddingLeft: isStr(v, 8 * v) }),\n px: (v) => ({ paddingLeft: isStr(v, 8 * v), paddingRight: isStr(v, 8 * v) }),\n py: (v) => ({ paddingTop: isStr(v, 8 * v), paddingBottom: isStr(v, 8 * v) }),\n m: (v) => ({ margin: isStr(v, 8 * v) }),\n mt: (v) => ({ marginTop: isStr(v, 8 * v) }),\n mr: (v) => ({ marginRight: isStr(v, 8 * v) }),\n mb: (v) => ({ marginBottom: isStr(v, 8 * v) }),\n ml: (v) => ({ marginLeft: isStr(v, 8 * v) }),\n mx: (v) => ({ marginLeft: isStr(v, 8 * v), marginRight: isStr(v, 8 * v) }),\n my: (v) => ({ marginTop: isStr(v, 8 * v), marginBottom: isStr(v, 8 * v) }),\n radius: (v) => ({ borderRadius: isStr(v, 8 * v) }),\n borderRadius: (v) => ({ borderRadius: isStr(v, 8 * v) }),\n shadow: (v) => ({ boxShadow: v }),\n flexBox: (v) => (v ? { display: \"flex\" } : {}),\n flexRow: (v) => (v ? { flexDirection: \"row\" } : {}),\n flexColumn: (v) => (v ? { flexDirection: \"column\" } : {}),\n flexWraped: (v) => (v ? { flexWrap: \"wrap\" } : {}),\n direction: (v) => (v === 'row' || v === 'column' ? { flexDirection: v } : { direction: v }),\n gap: (v) => ({ gap: isStr(v, 8 * v) }),\n};\n\nexport default aliases"],
|
|
5
|
+
"mappings": "AAGA,MAAMA,EAAQ,CAACC,EAAQC,IAAY,OAAOD,GAAM,SAAWA,EAAIC,EAEzDC,EAAkC,CACrC,QAAUF,IAAO,CAAE,gBAAiBA,CAAE,GACtC,QAAUA,IAAO,CAAE,gBAAiB,OAAOA,CAAC,IAAK,eAAgB,QAAS,iBAAkB,WAAY,GACxG,GAAKA,IAAO,CAAE,WAAYA,CAAE,GAC5B,EAAIA,IAAO,CAAE,QAASD,EAAMC,EAAG,EAAIA,CAAC,CAAE,GACtC,GAAKA,IAAO,CAAE,WAAYD,EAAMC,EAAG,EAAIA,CAAC,CAAE,GAC1C,GAAKA,IAAO,CAAE,aAAcD,EAAMC,EAAG,EAAIA,CAAC,CAAE,GAC5C,GAAKA,IAAO,CAAE,cAAeD,EAAMC,EAAG,EAAIA,CAAC,CAAE,GAC7C,GAAKA,IAAO,CAAE,YAAaD,EAAMC,EAAG,EAAIA,CAAC,CAAE,GAC3C,GAAKA,IAAO,CAAE,YAAaD,EAAMC,EAAG,EAAIA,CAAC,EAAG,aAAcD,EAAMC,EAAG,EAAIA,CAAC,CAAE,GAC1E,GAAKA,IAAO,CAAE,WAAYD,EAAMC,EAAG,EAAIA,CAAC,EAAG,cAAeD,EAAMC,EAAG,EAAIA,CAAC,CAAE,GAC1E,EAAIA,IAAO,CAAE,OAAQD,EAAMC,EAAG,EAAIA,CAAC,CAAE,GACrC,GAAKA,IAAO,CAAE,UAAWD,EAAMC,EAAG,EAAIA,CAAC,CAAE,GACzC,GAAKA,IAAO,CAAE,YAAaD,EAAMC,EAAG,EAAIA,CAAC,CAAE,GAC3C,GAAKA,IAAO,CAAE,aAAcD,EAAMC,EAAG,EAAIA,CAAC,CAAE,GAC5C,GAAKA,IAAO,CAAE,WAAYD,EAAMC,EAAG,EAAIA,CAAC,CAAE,GAC1C,GAAKA,IAAO,CAAE,WAAYD,EAAMC,EAAG,EAAIA,CAAC,EAAG,YAAaD,EAAMC,EAAG,EAAIA,CAAC,CAAE,GACxE,GAAKA,IAAO,CAAE,UAAWD,EAAMC,EAAG,EAAIA,CAAC,EAAG,aAAcD,EAAMC,EAAG,EAAIA,CAAC,CAAE,GACxE,OAASA,IAAO,CAAE,aAAcD,EAAMC,EAAG,EAAIA,CAAC,CAAE,GAChD,aAAeA,IAAO,CAAE,aAAcD,EAAMC,EAAG,EAAIA,CAAC,CAAE,GACtD,OAASA,IAAO,CAAE,UAAWA,CAAE,GAC/B,QAAUA,GAAOA,EAAI,CAAE,QAAS,MAAO,EAAI,CAAC,EAC5C,QAAUA,GAAOA,EAAI,CAAE,cAAe,KAAM,EAAI,CAAC,EACjD,WAAaA,GAAOA,EAAI,CAAE,cAAe,QAAS,EAAI,CAAC,EACvD,WAAaA,GAAOA,EAAI,CAAE,SAAU,MAAO,EAAI,CAAC,EAChD,UAAYA,GAAOA,IAAM,OAASA,IAAM,SAAW,CAAE,cAAeA,CAAE,EAAI,CAAE,UAAWA,CAAE,EACzF,IAAMA,IAAO,CAAE,IAAKD,EAAMC,EAAG,EAAIA,CAAC,CAAE,EACvC,EAEA,IAAOG,EAAQD",
|
|
6
|
+
"names": ["isStr", "v", "or", "aliases", "aliases_default"]
|
|
7
|
+
}
|
package/css/getProps.js
ADDED
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
const s=(t,r,o)=>{let i;if(typeof r=="string"){const e=r.split("!");i=e[1]?"!important":"",r=e[0]}if(t==="disabled")return r===!0?{pointerEvents:"none!important",cursor:"default!important",userSelect:"none!important",opacity:".8!important"}:{};if(r&&typeof r=="number"&&["border","borderRight","borderLeft","borderTop","borderBottom"].includes(t)){const e=Object.keys(o);let n={[`${t}Width`]:r+"px"+(i||"")};return e.includes(`${t}Color`)||(n[`${t}Color`]="divider"),e.includes(`${t}Style`)||(n[`${t}Style`]="solid"),n}};var f=s;export{f as default};
|
|
2
|
+
//# sourceMappingURL=getProps.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../src/css/getProps.ts"],
|
|
4
|
+
"sourcesContent": ["import { CSSProps } from \"./types\";\n\nconst getProps = (prop: string, value: string, _css: CSSProps) => {\n let important;\n if (typeof value === 'string') {\n const split = value.split(\"!\")\n important = split[1] ? \"!important\" : \"\"\n value = split[0]\n }\n\n if (prop === 'disabled') {\n if ((value as any) === true) {\n return {\n pointerEvents: \"none!important\",\n cursor: \"default!important\",\n userSelect: \"none!important\",\n opacity: \".8!important\"\n } as any\n }\n return {}\n }\n\n if (value && typeof value === \"number\" && [\"border\", \"borderRight\", \"borderLeft\", \"borderTop\", \"borderBottom\"].includes(prop as any)) {\n const keys: any = Object.keys(_css)\n let p: any = {\n [`${prop}Width`]: value + 'px' + (important || \"\"),\n }\n if (!keys.includes(`${prop}Color`)) {\n p[`${prop}Color`] = \"divider\"\n }\n if (!keys.includes(`${prop}Style`)) {\n p[`${prop}Style`] = \"solid\"\n }\n return p\n }\n}\n\nexport default getProps"],
|
|
5
|
+
"mappings": "AAEA,MAAMA,EAAW,CAACC,EAAcC,EAAeC,IAAmB,CAC9D,IAAIC,EACJ,GAAI,OAAOF,GAAU,SAAU,CAC3B,MAAMG,EAAQH,EAAM,MAAM,GAAG,EAC7BE,EAAYC,EAAM,CAAC,EAAI,aAAe,GACtCH,EAAQG,EAAM,CAAC,CACnB,CAEA,GAAIJ,IAAS,WACT,OAAKC,IAAkB,GACZ,CACH,cAAe,iBACf,OAAQ,oBACR,WAAY,iBACZ,QAAS,cACb,EAEG,CAAC,EAGZ,GAAIA,GAAS,OAAOA,GAAU,UAAY,CAAC,SAAU,cAAe,aAAc,YAAa,cAAc,EAAE,SAASD,CAAW,EAAG,CAClI,MAAMK,EAAY,OAAO,KAAKH,CAAI,EAClC,IAAII,EAAS,CACT,CAAC,GAAGN,CAAI,OAAO,EAAGC,EAAQ,MAAQE,GAAa,GACnD,EACA,OAAKE,EAAK,SAAS,GAAGL,CAAI,OAAO,IAC7BM,EAAE,GAAGN,CAAI,OAAO,EAAI,WAEnBK,EAAK,SAAS,GAAGL,CAAI,OAAO,IAC7BM,EAAE,GAAGN,CAAI,OAAO,EAAI,SAEjBM,CACX,CACJ,EAEA,IAAOC,EAAQR",
|
|
6
|
+
"names": ["getProps", "prop", "value", "_css", "important", "split", "keys", "p", "getProps_default"]
|
|
7
|
+
}
|
package/css/getValue.js
ADDED
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
const i=n=>({[`${n}`]:`var(--color-${n}-primary)`,[`${n}.primary`]:`var(--color-${n}-primary)`,[`${n}.secondary`]:`var(--color-${n}-secondary)`,[`${n}.text`]:`var(--color-${n}-text)`,[`${n}.alpha`]:`var(--color-${n}-alpha)`}),h=(n,t)=>n?t+n:t,e={text:"var(--color-text-primary)","text.primary":"var(--color-text-primary)","text.secondary":"var(--color-text-secondary)",background:"var(--color-background-primary)","background.primary":"var(--color-background-primary)","background.secondary":"var(--color-background-secondary)","background.alpha":"var(--color-background-alpha)",divider:"var(--color-divider)",...i("brand"),...i("accent"),...i("info"),...i("success"),...i("warning"),...i("danger")},o={xs:"var(--bp-xs)",sm:"var(--bp-sm)",md:"var(--bp-md)",lg:"var(--bp-lg)",xl:"var(--bp-xl)"};let s={h1:"var(--fontsize-h1)",h2:"var(--fontsize-h2)",h3:"var(--fontsize-h3)",h4:"var(--fontsize-h4)",h5:"var(--fontsize-h5)",h6:"var(--fontsize-h6)",text:"var(--fontsize-text)",button:"var(--fontsize-button)",small:"var(--fontsize-small)"},f={h1:"var(--lineheight-h1)",h2:"var(--lineheight-h2)",h3:"var(--lineheight-h3)",h4:"var(--lineheight-h4)",h5:"var(--lineheight-h5)",h6:"var(--lineheight-h6)",text:"var(--lineheight-text)",button:"var(--lineheight-button)",small:"var(--lineheight-small)"},l={h1:"var(--fontweight-h1)",h2:"var(--fontweight-h2)",h3:"var(--fontweight-h3)",h4:"var(--fontweight-h4)",h5:"var(--fontweight-h5)",h6:"var(--fontweight-h6)",text:"var(--fontweight-text)",button:"var(--fontweight-button)",small:"var(--fontweight-small)"},g={h1:"var(--font-h1)",h2:"var(--font-h2)",h3:"var(--font-h3)",h4:"var(--font-h4)",h5:"var(--font-h5)",h6:"var(--font-h6)",text:"var(--font-text)",button:"var(--font-button)",small:"var(--font-small)"};const d=(n,t,c)=>{let r;if(typeof t=="string"){const a=t.split("!");r=a[1]?"!important":"",t=a[0]}return["width","maxWidth","minWidth","max-width","min-width"].includes(n)?h(r,o[t]||t):["fontFamily","font-family"].includes(n)&&t==="default"?h(r,"var(--font-family)"):n==="font"&&typeof t=="string"&&["h1","h2","h3","h4","h5","h6","text","button","small"].includes(t)?h(r,g[t]||t):["fontWeight","font-weight"].includes(n)&&typeof t=="string"&&["h1","h2","h3","h4","h5","h6","text","button","small"].includes(t)?h(r,l[t]||t):["lineHeight","line-height"].includes(n)&&typeof t=="string"&&["h1","h2","h3","h4","h5","h6","text","button","small"].includes(t)?h(r,f[t]||t):["fontSize","font-size"].includes(n)&&typeof t=="string"?h(r,s[t]||t):typeof t=="number"&&["shadow","boxShadow"].includes(n)?h(r,`var(--shadow-${t})`):h(r,e[t]||t)};var v=d;export{v as default};
|
|
2
|
+
//# sourceMappingURL=getValue.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../src/css/getValue.ts"],
|
|
4
|
+
"sourcesContent": ["import { CSSProps } from \"./types\"\n\nconst getColor = (color: string) => {\n return {\n [`${color}`]: `var(--color-${color}-primary)`,\n [`${color}.primary`]: `var(--color-${color}-primary)`,\n [`${color}.secondary`]: `var(--color-${color}-secondary)`,\n [`${color}.text`]: `var(--color-${color}-text)`,\n [`${color}.alpha`]: `var(--color-${color}-alpha)`\n }\n}\n\nconst withImportant = (important: any, value: any) => important ? value + important : value\nconst colors: any = {\n \"text\": `var(--color-text-primary)`,\n \"text.primary\": `var(--color-text-primary)`,\n \"text.secondary\": `var(--color-text-secondary)`,\n\n \"background\": `var(--color-background-primary)`,\n \"background.primary\": `var(--color-background-primary)`,\n \"background.secondary\": `var(--color-background-secondary)`,\n \"background.alpha\": `var(--color-background-alpha)`,\n \"divider\": `var(--color-divider)`,\n\n ...getColor(\"brand\"),\n ...getColor(\"accent\"),\n ...getColor(\"info\"),\n ...getColor(\"success\"),\n ...getColor(\"warning\"),\n ...getColor(\"danger\"),\n}\n\nconst breakpoints: any = {\n \"xs\": \"var(--bp-xs)\",\n \"sm\": \"var(--bp-sm)\",\n \"md\": \"var(--bp-md)\",\n \"lg\": \"var(--bp-lg)\",\n \"xl\": \"var(--bp-xl)\"\n}\n\nlet fontsizes: any = {\n \"h1\": \"var(--fontsize-h1)\",\n \"h2\": \"var(--fontsize-h2)\",\n \"h3\": \"var(--fontsize-h3)\",\n \"h4\": \"var(--fontsize-h4)\",\n \"h5\": \"var(--fontsize-h5)\",\n \"h6\": \"var(--fontsize-h6)\",\n \"text\": \"var(--fontsize-text)\",\n \"button\": \"var(--fontsize-button)\",\n \"small\": \"var(--fontsize-small)\"\n}\n\nlet lineHeights: any = {\n \"h1\": \"var(--lineheight-h1)\",\n \"h2\": \"var(--lineheight-h2)\",\n \"h3\": \"var(--lineheight-h3)\",\n \"h4\": \"var(--lineheight-h4)\",\n \"h5\": \"var(--lineheight-h5)\",\n \"h6\": \"var(--lineheight-h6)\",\n \"text\": \"var(--lineheight-text)\",\n \"button\": \"var(--lineheight-button)\",\n \"small\": \"var(--lineheight-small)\"\n}\n\nlet fontWeights: any = {\n \"h1\": \"var(--fontweight-h1)\",\n \"h2\": \"var(--fontweight-h2)\",\n \"h3\": \"var(--fontweight-h3)\",\n \"h4\": \"var(--fontweight-h4)\",\n \"h5\": \"var(--fontweight-h5)\",\n \"h6\": \"var(--fontweight-h6)\",\n \"text\": \"var(--fontweight-text)\",\n \"button\": \"var(--fontweight-button)\",\n \"small\": \"var(--fontweight-small)\"\n}\n\nlet font: any = {\n \"h1\": \"var(--font-h1)\",\n \"h2\": \"var(--font-h2)\",\n \"h3\": \"var(--font-h3)\",\n \"h4\": \"var(--font-h4)\",\n \"h5\": \"var(--font-h5)\",\n \"h6\": \"var(--font-h6)\",\n \"text\": \"var(--font-text)\",\n \"button\": \"var(--font-button)\",\n \"small\": \"var(--font-small)\"\n}\n\nconst getValue = (prop: any, value: string | number, _css: CSSProps): any => {\n let important;\n\n if (typeof value === 'string') {\n const split = value.split(\"!\")\n important = split[1] ? \"!important\" : \"\"\n value = split[0]\n }\n\n if (['width', 'maxWidth', 'minWidth', 'max-width', 'min-width'].includes(prop)) {\n return withImportant(important, breakpoints[value] || value)\n } else if (['fontFamily', 'font-family'].includes(prop) && value === 'default') {\n return withImportant(important, \"var(--font-family)\")\n } if (prop === 'font' && typeof value === \"string\" && ['h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'text', 'button', 'small'].includes(value)) {\n return withImportant(important, font[value] || value)\n } if (['fontWeight', 'font-weight'].includes(prop) && typeof value === 'string' && ['h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'text', 'button', 'small'].includes(value)) {\n return withImportant(important, fontWeights[value] || value)\n } else if (['lineHeight', 'line-height'].includes(prop) && typeof value === 'string' && ['h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'text', 'button', 'small'].includes(value)) {\n return withImportant(important, lineHeights[value] || value)\n } else if (['fontSize', 'font-size'].includes(prop) && typeof value === 'string') {\n return withImportant(important, fontsizes[value] || value)\n } else if (typeof value === \"number\" && [\"shadow\", \"boxShadow\"].includes(prop)) {\n return withImportant(important, `var(--shadow-${value})`)\n }\n\n return withImportant(important, colors[value] || value)\n}\n\nexport default getValue"],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": ["getColor", "color", "withImportant", "important", "value", "colors", "breakpoints", "fontsizes", "lineHeights", "fontWeights", "font", "getValue", "prop", "_css", "split", "getValue_default"]
|
|
7
|
+
}
|
package/css/index.d.ts
ADDED
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import getValue from "./getValue";
|
|
2
|
+
import getProps from "./getProps";
|
|
3
|
+
import { CSSOptionProps, CSSProps } from './types';
|
|
4
|
+
export { getValue, getProps };
|
|
5
|
+
export declare const breakpoints: {
|
|
6
|
+
xs: number;
|
|
7
|
+
sm: number;
|
|
8
|
+
md: number;
|
|
9
|
+
lg: number;
|
|
10
|
+
xl: number;
|
|
11
|
+
};
|
|
12
|
+
export declare const css: (props: CSSProps, options?: CSSOptionProps) => import("oncss").CSSFactoryType;
|
|
13
|
+
export declare const adjustColor: (hex: string, factor: number) => string;
|
|
14
|
+
export declare const adjustTextContrast: (color: string) => "#FFFFFF" | "#111111";
|
|
15
|
+
export declare const alpha: (color: string, opacity?: number) => string;
|
package/css/index.js
ADDED
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import p from"./getValue";import l from"./getProps";import m from"./aliases";import{css as u}from"oncss";const g={xs:0,sm:600,md:900,lg:1200,xl:1536},d=(t,r)=>{const a={...r,breakpoints:g,aliases:m,getValue:(e,s,n,i)=>{if(r?.getValue){let o=r?.getValue(e,s,n,i);if(o)return o}return p(e,s,n)},getProps:(e,s,n,i)=>{if(r?.getProps){let o=r?.getProps(e,s,n,i);if(o)return o}return l(e,s,n)}};return u(t,a)},b=(t,r)=>{t=t.replace(/^#/,"");let a=parseInt(t.slice(0,2),16),e=parseInt(t.slice(2,4),16),s=parseInt(t.slice(4,6),16);return a=Math.floor(a*r),e=Math.floor(e*r),s=Math.floor(s*r),a=Math.min(255,Math.max(0,a)),e=Math.min(255,Math.max(0,e)),s=Math.min(255,Math.max(0,s)),`#${a.toString(16).padStart(2,"0")}${e.toString(16).padStart(2,"0")}${s.toString(16).padStart(2,"0")}`},F=t=>{t=t.replace(/^#/,"");const r=parseInt(t.slice(0,2),16),a=parseInt(t.slice(2,4),16),e=parseInt(t.slice(4,6),16);return(.299*r+.587*a+.114*e)/255>.5?"#111111":"#FFFFFF"},I=(t,r=1)=>{if(typeof r!="number")return t;let a=r*100;if(!t.startsWith("#"))throw new Error("color must be hex");return(t+`0${Math.round(255/100*a).toString(16)}`.slice(-2)).toUpperCase()};export{b as adjustColor,F as adjustTextContrast,I as alpha,g as breakpoints,d as css,l as getProps,p as getValue};
|
|
2
|
+
//# sourceMappingURL=index.js.map
|
package/css/index.js.map
ADDED
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../src/css/index.ts"],
|
|
4
|
+
"sourcesContent": ["import getValue from \"./getValue\"\nimport getProps from \"./getProps\"\nimport aliases from \"./aliases\"\nimport { Aliases, BreakpointKeys, CSSOptionProps, CSSProps } from './types'\nimport { css as _css } from \"oncss\"\n\nexport {\n getValue,\n getProps\n}\n\nexport const breakpoints = {\n xs: 0,\n sm: 600,\n md: 900,\n lg: 1200,\n xl: 1536\n}\n\nexport const css = (props: CSSProps, options?: CSSOptionProps) => {\n const cssOptions: CSSOptionProps = {\n ...options,\n breakpoints,\n aliases,\n getValue: (p: any, v: any, _c: any, dept) => {\n if (options?.getValue) {\n let _val = options?.getValue(p, v, _c, dept)\n if (_val) return _val\n }\n return getValue(p, v, _c)\n },\n getProps: (p: any, v: any, _c: any, dept) => {\n if (options?.getProps) {\n let _p = options?.getProps(p, v, _c, dept)\n if (_p) return _p\n }\n return getProps(p, v, _c)\n },\n }\n return _css<Aliases, BreakpointKeys>(props, cssOptions)\n}\n\nexport const adjustColor = (hex: string, factor: number) => {\n\n hex = hex.replace(/^#/, '')\n\n let r = parseInt(hex.slice(0, 2), 16)\n let g = parseInt(hex.slice(2, 4), 16)\n let b = parseInt(hex.slice(4, 6), 16)\n\n r = Math.floor(r * factor)\n g = Math.floor(g * factor)\n b = Math.floor(b * factor)\n\n r = Math.min(255, Math.max(0, r))\n g = Math.min(255, Math.max(0, g))\n b = Math.min(255, Math.max(0, b))\n\n return `#${r.toString(16).padStart(2, '0')}${g.toString(16).padStart(2, '0')}${b.toString(16).padStart(2, '0')}`;\n}\n\nexport const adjustTextContrast = (color: string) => {\n color = color.replace(/^#/, '')\n const r = parseInt(color.slice(0, 2), 16);\n const g = parseInt(color.slice(2, 4), 16);\n const b = parseInt(color.slice(4, 6), 16);\n\n const luminance = (0.299 * r + 0.587 * g + 0.114 * b) / 255;\n return luminance > 0.5 ? '#111111' : '#FFFFFF';\n}\n\nexport const alpha = (color: string, opacity = 1) => {\n if (typeof opacity !== 'number') return color\n let _opacity = opacity * 100\n if (!color.startsWith(\"#\")) throw new Error(`color must be hex`)\n return (color + (`0${Math.round((255 / 100) * _opacity).toString(16)}`.slice(-2))).toUpperCase();\n};\n\n"],
|
|
5
|
+
"mappings": "AAAA,OAAOA,MAAc,aACrB,OAAOC,MAAc,aACrB,OAAOC,MAAa,YAEpB,OAAS,OAAOC,MAAY,QAOrB,MAAMC,EAAc,CACvB,GAAI,EACJ,GAAI,IACJ,GAAI,IACJ,GAAI,KACJ,GAAI,IACR,EAEaC,EAAM,CAACC,EAAiBC,IAA6B,CAC9D,MAAMC,EAA6B,CAC/B,GAAGD,EACH,YAAAH,EACA,QAAAF,EACA,SAAU,CAACO,EAAQC,EAAQC,EAASC,IAAS,CACzC,GAAIL,GAAS,SAAU,CACnB,IAAIM,EAAON,GAAS,SAASE,EAAGC,EAAGC,EAAIC,CAAI,EAC3C,GAAIC,EAAM,OAAOA,CACrB,CACA,OAAOb,EAASS,EAAGC,EAAGC,CAAE,CAC5B,EACA,SAAU,CAACF,EAAQC,EAAQC,EAASC,IAAS,CACzC,GAAIL,GAAS,SAAU,CACnB,IAAIO,EAAKP,GAAS,SAASE,EAAGC,EAAGC,EAAIC,CAAI,EACzC,GAAIE,EAAI,OAAOA,CACnB,CACA,OAAOb,EAASQ,EAAGC,EAAGC,CAAE,CAC5B,CACJ,EACA,OAAOR,EAA8BG,EAAOE,CAAU,CAC1D,EAEaO,EAAc,CAACC,EAAaC,IAAmB,CAExDD,EAAMA,EAAI,QAAQ,KAAM,EAAE,EAE1B,IAAIE,EAAI,SAASF,EAAI,MAAM,EAAG,CAAC,EAAG,EAAE,EAChCG,EAAI,SAASH,EAAI,MAAM,EAAG,CAAC,EAAG,EAAE,EAChCI,EAAI,SAASJ,EAAI,MAAM,EAAG,CAAC,EAAG,EAAE,EAEpC,OAAAE,EAAI,KAAK,MAAMA,EAAID,CAAM,EACzBE,EAAI,KAAK,MAAMA,EAAIF,CAAM,EACzBG,EAAI,KAAK,MAAMA,EAAIH,CAAM,EAEzBC,EAAI,KAAK,IAAI,IAAK,KAAK,IAAI,EAAGA,CAAC,CAAC,EAChCC,EAAI,KAAK,IAAI,IAAK,KAAK,IAAI,EAAGA,CAAC,CAAC,EAChCC,EAAI,KAAK,IAAI,IAAK,KAAK,IAAI,EAAGA,CAAC,CAAC,EAEzB,IAAIF,EAAE,SAAS,EAAE,EAAE,SAAS,EAAG,GAAG,CAAC,GAAGC,EAAE,SAAS,EAAE,EAAE,SAAS,EAAG,GAAG,CAAC,GAAGC,EAAE,SAAS,EAAE,EAAE,SAAS,EAAG,GAAG,CAAC,EAClH,EAEaC,EAAsBC,GAAkB,CACjDA,EAAQA,EAAM,QAAQ,KAAM,EAAE,EAC9B,MAAM,EAAI,SAASA,EAAM,MAAM,EAAG,CAAC,EAAG,EAAE,EAClCH,EAAI,SAASG,EAAM,MAAM,EAAG,CAAC,EAAG,EAAE,EAClCF,EAAI,SAASE,EAAM,MAAM,EAAG,CAAC,EAAG,EAAE,EAGxC,OADmB,KAAQ,EAAI,KAAQH,EAAI,KAAQC,GAAK,IACrC,GAAM,UAAY,SACzC,EAEaG,EAAQ,CAACD,EAAeE,EAAU,IAAM,CACjD,GAAI,OAAOA,GAAY,SAAU,OAAOF,EACxC,IAAIG,EAAWD,EAAU,IACzB,GAAI,CAACF,EAAM,WAAW,GAAG,EAAG,MAAM,IAAI,MAAM,mBAAmB,EAC/D,OAAQA,EAAS,IAAI,KAAK,MAAO,IAAM,IAAOG,CAAQ,EAAE,SAAS,EAAE,CAAC,GAAG,MAAM,EAAE,GAAI,YAAY,CACnG",
|
|
6
|
+
"names": ["getValue", "getProps", "aliases", "_css", "breakpoints", "css", "props", "options", "cssOptions", "p", "v", "_c", "dept", "_val", "_p", "adjustColor", "hex", "factor", "r", "g", "b", "adjustTextContrast", "color", "alpha", "opacity", "_opacity"]
|
|
7
|
+
}
|
|
@@ -1,10 +1,11 @@
|
|
|
1
|
-
import * as CSS from 'csstype'
|
|
2
|
-
import { ColorsRefTypes, TypographyRefTypes, ThemeOptions
|
|
3
|
-
import * as oncss from 'oncss'
|
|
4
|
-
export type FN = (theme: ThemeOptions) => string | number
|
|
5
|
-
export type CSSBreakpointType = {
|
|
6
|
-
|
|
7
|
-
|
|
1
|
+
import * as CSS from 'csstype';
|
|
2
|
+
import { ColorsRefTypes, TypographyRefTypes, ThemeOptions } from '../theme/types';
|
|
3
|
+
import * as oncss from 'oncss';
|
|
4
|
+
export type FN = (theme: ThemeOptions) => string | number;
|
|
5
|
+
export type CSSBreakpointType = {
|
|
6
|
+
[key in BreakpointKeys]: string | number;
|
|
7
|
+
};
|
|
8
|
+
export type CSSValueType<T extends keyof CSS.Properties> = CSS.Properties[T] | Partial<CSSBreakpointType> | number;
|
|
8
9
|
export type Aliases = {
|
|
9
10
|
bgcolor?: CSSValueType<'background'> | ColorsRefTypes;
|
|
10
11
|
bgimage?: CSSValueType<'backgroundImage'>;
|
|
@@ -25,7 +26,6 @@ export type Aliases = {
|
|
|
25
26
|
my?: CSSValueType<'margin'>;
|
|
26
27
|
size?: CSSValueType<'width'>;
|
|
27
28
|
spacing?: Partial<CSSBreakpointType> | number;
|
|
28
|
-
|
|
29
29
|
radius?: CSSValueType<'borderRadius'> | number;
|
|
30
30
|
borderRadius?: CSSValueType<'borderRadius'> | number;
|
|
31
31
|
shadow?: CSSValueType<'boxShadow'> | number;
|
|
@@ -35,26 +35,20 @@ export type Aliases = {
|
|
|
35
35
|
flexWraped?: boolean;
|
|
36
36
|
direction?: "row" | "column" | CSSValueType<'direction'>;
|
|
37
37
|
gap?: CSSValueType<'gap'>;
|
|
38
|
-
|
|
39
38
|
color?: CSSValueType<'color'> | ColorsRefTypes;
|
|
40
39
|
width?: CSSValueType<'width'> | BreakpointKeys;
|
|
41
|
-
height?: CSSValueType<'height'
|
|
40
|
+
height?: CSSValueType<'height'>;
|
|
42
41
|
borderColor?: CSSValueType<'backgroundColor'> | ColorsRefTypes;
|
|
43
|
-
|
|
44
42
|
fontFamily?: CSSValueType<"fontFamily"> | "default";
|
|
45
43
|
fontSize?: CSSValueType<"fontSize"> | TypographyRefTypes;
|
|
46
44
|
minWidth?: CSSValueType<"minWidth"> | BreakpointKeys;
|
|
47
45
|
maxWidth?: CSSValueType<"maxWidth"> | BreakpointKeys;
|
|
48
|
-
minHeight?: CSSValueType<"minHeight"
|
|
49
|
-
maxHeight?: CSSValueType<"maxHeight"
|
|
50
|
-
}
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
export type
|
|
54
|
-
|
|
55
|
-
export type CSSProps = oncss.CSSProps<Aliases, BreakpointKeys>
|
|
56
|
-
export type CSSOptionProps = oncss.CSSOptionProps<Aliases, BreakpointKeys>
|
|
57
|
-
|
|
46
|
+
minHeight?: CSSValueType<"minHeight">;
|
|
47
|
+
maxHeight?: CSSValueType<"maxHeight">;
|
|
48
|
+
};
|
|
49
|
+
export type BreakpointKeys = "xs" | "sm" | "md" | "lg" | "xl";
|
|
50
|
+
export type CSSProps = oncss.CSSProps<Aliases, BreakpointKeys>;
|
|
51
|
+
export type CSSOptionProps = oncss.CSSOptionProps<Aliases, BreakpointKeys>;
|
|
58
52
|
export type GlobalCSS = {
|
|
59
53
|
[key: string]: oncss.CSSPropsWithoutGlobal<Aliases, BreakpointKeys>;
|
|
60
|
-
}
|
|
54
|
+
};
|
package/css/types.js
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
//# sourceMappingURL=types.js.map
|
package/css/types.js.map
ADDED
package/index.d.ts
ADDED
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
import Tag from './Tag';
|
|
2
|
+
import useTagProps from './Tag/useTagProps';
|
|
3
|
+
import useAnimation from './useAnimation';
|
|
4
|
+
import useColorTemplate from './useColorTemplate';
|
|
5
|
+
import useBreakpoint from './breakpoint/useBreakpoint';
|
|
6
|
+
import useBreakpointProps from './breakpoint/useBreakpointProps';
|
|
7
|
+
import ServerStyleTags from './ServerStyleTags';
|
|
8
|
+
import isWindow from './isWindow';
|
|
9
|
+
import useInterface from './useInterface';
|
|
10
|
+
import Transition from './Transition';
|
|
11
|
+
export * from './css';
|
|
12
|
+
export * from "./theme";
|
|
13
|
+
export * from './css/types';
|
|
14
|
+
export * from './Tag/types';
|
|
15
|
+
export * from './theme/types';
|
|
16
|
+
export * from './useColorTemplate';
|
|
17
|
+
export * from './useAnimation';
|
|
18
|
+
export type * from './Transition';
|
|
19
|
+
export type * from './Tag/types';
|
|
20
|
+
export type { useBreakpointPropsType } from './breakpoint/useBreakpointProps';
|
|
21
|
+
export { Tag, useTagProps, useAnimation, Transition, useColorTemplate, ServerStyleTags, useBreakpoint, useBreakpointProps, isWindow, useInterface };
|
package/index.js
ADDED
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import o from"./Tag";import r from"./Tag/useTagProps";import e from"./useAnimation";import p from"./useColorTemplate";import t from"./breakpoint/useBreakpoint";import m from"./breakpoint/useBreakpointProps";import i from"./ServerStyleTags";import f from"./isWindow";import s from"./useInterface";import a from"./Transition";export*from"./css";export*from"./theme";export*from"./css/types";export*from"./Tag/types";export*from"./theme/types";export*from"./useColorTemplate";export*from"./useAnimation";export{i as ServerStyleTags,o as Tag,a as Transition,f as isWindow,e as useAnimation,t as useBreakpoint,m as useBreakpointProps,p as useColorTemplate,s as useInterface,r as useTagProps};
|
|
2
|
+
//# sourceMappingURL=index.js.map
|
package/index.js.map
ADDED
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../src/index.ts"],
|
|
4
|
+
"sourcesContent": ["import Tag from './Tag'\nimport useTagProps from './Tag/useTagProps'\nimport useAnimation from './useAnimation'\nimport useColorTemplate from './useColorTemplate'\nimport useBreakpoint from './breakpoint/useBreakpoint'\nimport useBreakpointProps from './breakpoint/useBreakpointProps'\nimport ServerStyleTags from './ServerStyleTags'\nimport isWindow from './isWindow'\nimport useInterface from './useInterface'\nimport Transition from './Transition'\n\nexport * from './css'\nexport * from \"./theme\"\nexport * from './css/types'\nexport * from './Tag/types'\nexport * from './theme/types'\nexport * from './useColorTemplate'\nexport * from './useAnimation'\nexport type * from './Transition'\nexport type * from './Tag/types'\nexport type { useBreakpointPropsType } from './breakpoint/useBreakpointProps'\n\nexport {\n Tag,\n useTagProps,\n useAnimation,\n Transition,\n useColorTemplate,\n ServerStyleTags,\n useBreakpoint,\n useBreakpointProps,\n isWindow,\n useInterface\n}"],
|
|
5
|
+
"mappings": "AAAA,OAAOA,MAAS,QAChB,OAAOC,MAAiB,oBACxB,OAAOC,MAAkB,iBACzB,OAAOC,MAAsB,qBAC7B,OAAOC,MAAmB,6BAC1B,OAAOC,MAAwB,kCAC/B,OAAOC,MAAqB,oBAC5B,OAAOC,MAAc,aACrB,OAAOC,MAAkB,iBACzB,OAAOC,MAAgB,eAEvB,WAAc,QACd,WAAc,UACd,WAAc,cACd,WAAc,cACd,WAAc,gBACd,WAAc,qBACd,WAAc",
|
|
6
|
+
"names": ["Tag", "useTagProps", "useAnimation", "useColorTemplate", "useBreakpoint", "useBreakpointProps", "ServerStyleTags", "isWindow", "useInterface", "Transition"]
|
|
7
|
+
}
|
package/isWindow.d.ts
ADDED
package/isWindow.js
ADDED
package/isWindow.js.map
ADDED
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../src/isWindow.ts"],
|
|
4
|
+
"sourcesContent": ["\nconst isWindow = (): Window | void => typeof window !== 'undefined' ? window : undefined\nexport default isWindow"],
|
|
5
|
+
"mappings": "AACA,MAAMA,EAAW,IAAqB,OAAO,OAAW,IAAc,OAAS,OAC/E,IAAOC,EAAQD",
|
|
6
|
+
"names": ["isWindow", "isWindow_default"]
|
|
7
|
+
}
|
package/package.json
CHANGED
|
@@ -1,53 +1,47 @@
|
|
|
1
1
|
{
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
"
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
"keywords": [],
|
|
30
|
-
"exports": {
|
|
31
|
-
".": {
|
|
32
|
-
"require": {
|
|
33
|
-
"types": "./index.d.ts",
|
|
34
|
-
"default": "./cjs/index.js"
|
|
35
|
-
},
|
|
36
|
-
"import": {
|
|
37
|
-
"types": "./index.d.ts",
|
|
38
|
-
"default": "./index.js"
|
|
39
|
-
}
|
|
2
|
+
"name": "@xanui/core",
|
|
3
|
+
"version": "1.1.3",
|
|
4
|
+
"description": "",
|
|
5
|
+
"private": false,
|
|
6
|
+
"main": "./cjs/index.js",
|
|
7
|
+
"module": "./index.js",
|
|
8
|
+
"types": "./index.d.ts",
|
|
9
|
+
"sideEffects": false,
|
|
10
|
+
"dependencies": {
|
|
11
|
+
"oncss": "^1.1.17",
|
|
12
|
+
"pretty-class": "^1.0.5",
|
|
13
|
+
"react": "^19.0.0",
|
|
14
|
+
"react-dom": "^19.0.0",
|
|
15
|
+
"react-state-bucket": "^1.1.9"
|
|
16
|
+
},
|
|
17
|
+
"devDependencies": {
|
|
18
|
+
"@types/react": "^19.0.2",
|
|
19
|
+
"@types/react-dom": "^19.0.2",
|
|
20
|
+
"makepack": "^1.6.8",
|
|
21
|
+
"typescript": "^4.9.5"
|
|
22
|
+
},
|
|
23
|
+
"keywords": [],
|
|
24
|
+
"exports": {
|
|
25
|
+
".": {
|
|
26
|
+
"require": {
|
|
27
|
+
"types": "./index.d.ts",
|
|
28
|
+
"default": "./cjs/index.js"
|
|
40
29
|
},
|
|
41
|
-
"
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
30
|
+
"import": {
|
|
31
|
+
"types": "./index.d.ts",
|
|
32
|
+
"default": "./index.js"
|
|
33
|
+
}
|
|
34
|
+
},
|
|
35
|
+
"./*": {
|
|
36
|
+
"require": {
|
|
37
|
+
"types": "./*.d.ts",
|
|
38
|
+
"default": "./cjs/*.js"
|
|
50
39
|
},
|
|
51
|
-
"
|
|
52
|
-
|
|
40
|
+
"import": {
|
|
41
|
+
"types": "./*.d.ts",
|
|
42
|
+
"default": "./*.js"
|
|
43
|
+
}
|
|
44
|
+
},
|
|
45
|
+
"./cjs": null
|
|
46
|
+
}
|
|
53
47
|
}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
const p=o=>{const r={};return o.shadow.forEach((a,n)=>r[`--shadow-${n}`]=a),{"--bp-xs":o.breakpoints.xs,"--bp-sm":o.breakpoints.sm,"--bp-md":o.breakpoints.md,"--bp-lg":o.breakpoints.lg,"--bp-xl":o.breakpoints.xl,"--font-family":o.typography.fontFamily,"--font-h1":`${o.typography.h1.fontWeight} ${o.typography.h1.fontSize}px/${o.typography.h1.lineHeight} ${o.typography.fontFamily}`,"--font-h2":`${o.typography.h2.fontWeight} ${o.typography.h2.fontSize}px/${o.typography.h2.lineHeight} ${o.typography.fontFamily}`,"--font-h3":`${o.typography.h3.fontWeight} ${o.typography.h3.fontSize}px/${o.typography.h3.lineHeight} ${o.typography.fontFamily}`,"--font-h4":`${o.typography.h4.fontWeight} ${o.typography.h4.fontSize}px/${o.typography.h4.lineHeight} ${o.typography.fontFamily}`,"--font-h5":`${o.typography.h5.fontWeight} ${o.typography.h5.fontSize}px/${o.typography.h5.lineHeight} ${o.typography.fontFamily}`,"--font-h6":`${o.typography.h6.fontWeight} ${o.typography.h6.fontSize}px/${o.typography.h6.lineHeight} ${o.typography.fontFamily}`,"--font-text":`${o.typography.text.fontWeight} ${o.typography.text.fontSize}px/${o.typography.text.lineHeight} ${o.typography.fontFamily}`,"--font-button":`${o.typography.button.fontWeight} ${o.typography.button.fontSize}px/${o.typography.button.lineHeight} ${o.typography.fontFamily}`,"--font-small":`${o.typography.small.fontWeight} ${o.typography.small.fontSize}px/${o.typography.small.lineHeight} ${o.typography.fontFamily}`,"--fontsize-h1":`${o.typography.h1.fontSize}px`,"--fontsize-h2":`${o.typography.h2.fontSize}px`,"--fontsize-h3":`${o.typography.h3.fontSize}px`,"--fontsize-h4":`${o.typography.h4.fontSize}px`,"--fontsize-h5":`${o.typography.h5.fontSize}px`,"--fontsize-h6":`${o.typography.h6.fontSize}px`,"--fontsize-text":`${o.typography.text.fontSize}px`,"--fontsize-button":`${o.typography.button.fontSize}px`,"--fontsize-small":`${o.typography.small.fontSize}px`,"--fontweight-h1":o.typography.h1.fontWeight+"","--fontweight-h2":o.typography.h2.fontWeight+"","--fontweight-h3":o.typography.h3.fontWeight+"","--fontweight-h4":o.typography.h4.fontWeight+"","--fontweight-h5":o.typography.h5.fontWeight+"","--fontweight-h6":o.typography.h6.fontWeight+"","--fontweight-text":o.typography.text.fontWeight+"","--fontweight-button":o.typography.button.fontWeight+"","--fontweight-small":o.typography.small.fontWeight+"","--lineheight-h1":o.typography.h1.lineHeight+"","--lineheight-h2":o.typography.h2.lineHeight+"","--lineheight-h3":o.typography.h3.lineHeight+"","--lineheight-h4":o.typography.h4.lineHeight+"","--lineheight-h5":o.typography.h5.lineHeight+"","--lineheight-h6":o.typography.h6.lineHeight+"","--lineheight-text":o.typography.text.lineHeight+"","--lineheight-button":o.typography.button.lineHeight+"","--lineheight-small":o.typography.small.lineHeight+"","--color-text":o.colors.text.primary,"--color-text-primary":o.colors.text.primary,"--color-text-secondary":o.colors.text.secondary,"--color-background":o.colors.background.primary,"--color-background-primary":o.colors.background.primary,"--color-background-secondary":o.colors.background.secondary,"--color-background-alpha":o.colors.background.alpha,"--color-divider":o.colors.divider,"--color-brand":o.colors.brand.primary,"--color-brand-primary":o.colors.brand.primary,"--color-brand-secondary":o.colors.brand.secondary,"--color-brand-alpha":o.colors.brand.alpha,"--color-brand-text":o.colors.brand.text,"--color-accent":o.colors.accent.primary,"--color-accent-primary":o.colors.accent.primary,"--color-accent-secondary":o.colors.accent.secondary,"--color-accent-alpha":o.colors.accent.alpha,"--color-accent-text":o.colors.accent.text,"--color-info":o.colors.info.primary,"--color-info-primary":o.colors.info.primary,"--color-info-secondary":o.colors.info.secondary,"--color-info-alpha":o.colors.info.alpha,"--color-info-text":o.colors.info.text,"--color-success":o.colors.success.primary,"--color-success-primary":o.colors.success.primary,"--color-success-secondary":o.colors.success.secondary,"--color-success-alpha":o.colors.success.alpha,"--color-success-text":o.colors.success.text,"--color-warning":o.colors.warning.primary,"--color-warning-primary":o.colors.warning.primary,"--color-warning-secondary":o.colors.warning.secondary,"--color-warning-alpha":o.colors.warning.alpha,"--color-warning-text":o.colors.warning.text,"--color-danger":o.colors.danger.primary,"--color-danger-primary":o.colors.danger.primary,"--color-danger-secondary":o.colors.danger.secondary,"--color-danger-alpha":o.colors.danger.alpha,"--color-danger-text":o.colors.danger.text,...r}};var i=p;export{i as default};
|
|
2
|
+
//# sourceMappingURL=ThemeCssVars.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../src/theme/ThemeCssVars.ts"],
|
|
4
|
+
"sourcesContent": ["import { ThemeOptions } from \"./types\";\n\nconst ThemeCssVars = (theme: ThemeOptions) => {\n\n const shadows: any = {}\n theme.shadow.forEach((s, i) => shadows[`--shadow-${i}`] = s)\n\n return {\n \"--bp-xs\": theme.breakpoints.xs,\n \"--bp-sm\": theme.breakpoints.sm,\n \"--bp-md\": theme.breakpoints.md,\n \"--bp-lg\": theme.breakpoints.lg,\n \"--bp-xl\": theme.breakpoints.xl,\n\n \"--font-family\": theme.typography.fontFamily,\n \"--font-h1\": `${theme.typography.h1.fontWeight} ${theme.typography.h1.fontSize}px/${theme.typography.h1.lineHeight} ${theme.typography.fontFamily}`,\n \"--font-h2\": `${theme.typography.h2.fontWeight} ${theme.typography.h2.fontSize}px/${theme.typography.h2.lineHeight} ${theme.typography.fontFamily}`,\n \"--font-h3\": `${theme.typography.h3.fontWeight} ${theme.typography.h3.fontSize}px/${theme.typography.h3.lineHeight} ${theme.typography.fontFamily}`,\n \"--font-h4\": `${theme.typography.h4.fontWeight} ${theme.typography.h4.fontSize}px/${theme.typography.h4.lineHeight} ${theme.typography.fontFamily}`,\n \"--font-h5\": `${theme.typography.h5.fontWeight} ${theme.typography.h5.fontSize}px/${theme.typography.h5.lineHeight} ${theme.typography.fontFamily}`,\n \"--font-h6\": `${theme.typography.h6.fontWeight} ${theme.typography.h6.fontSize}px/${theme.typography.h6.lineHeight} ${theme.typography.fontFamily}`,\n \"--font-text\": `${theme.typography.text.fontWeight} ${theme.typography.text.fontSize}px/${theme.typography.text.lineHeight} ${theme.typography.fontFamily}`,\n \"--font-button\": `${theme.typography.button.fontWeight} ${theme.typography.button.fontSize}px/${theme.typography.button.lineHeight} ${theme.typography.fontFamily}`,\n \"--font-small\": `${theme.typography.small.fontWeight} ${theme.typography.small.fontSize}px/${theme.typography.small.lineHeight} ${theme.typography.fontFamily}`,\n\n \"--fontsize-h1\": `${theme.typography.h1.fontSize}px`,\n \"--fontsize-h2\": `${theme.typography.h2.fontSize}px`,\n \"--fontsize-h3\": `${theme.typography.h3.fontSize}px`,\n \"--fontsize-h4\": `${theme.typography.h4.fontSize}px`,\n \"--fontsize-h5\": `${theme.typography.h5.fontSize}px`,\n \"--fontsize-h6\": `${theme.typography.h6.fontSize}px`,\n \"--fontsize-text\": `${theme.typography.text.fontSize}px`,\n \"--fontsize-button\": `${theme.typography.button.fontSize}px`,\n \"--fontsize-small\": `${theme.typography.small.fontSize}px`,\n\n \"--fontweight-h1\": theme.typography.h1.fontWeight + \"\",\n \"--fontweight-h2\": theme.typography.h2.fontWeight + \"\",\n \"--fontweight-h3\": theme.typography.h3.fontWeight + \"\",\n \"--fontweight-h4\": theme.typography.h4.fontWeight + \"\",\n \"--fontweight-h5\": theme.typography.h5.fontWeight + \"\",\n \"--fontweight-h6\": theme.typography.h6.fontWeight + \"\",\n \"--fontweight-text\": theme.typography.text.fontWeight + \"\",\n \"--fontweight-button\": theme.typography.button.fontWeight + \"\",\n \"--fontweight-small\": theme.typography.small.fontWeight + \"\",\n\n \"--lineheight-h1\": theme.typography.h1.lineHeight + \"\",\n \"--lineheight-h2\": theme.typography.h2.lineHeight + \"\",\n \"--lineheight-h3\": theme.typography.h3.lineHeight + \"\",\n \"--lineheight-h4\": theme.typography.h4.lineHeight + \"\",\n \"--lineheight-h5\": theme.typography.h5.lineHeight + \"\",\n \"--lineheight-h6\": theme.typography.h6.lineHeight + \"\",\n \"--lineheight-text\": theme.typography.text.lineHeight + \"\",\n \"--lineheight-button\": theme.typography.button.lineHeight + \"\",\n \"--lineheight-small\": theme.typography.small.lineHeight + \"\",\n\n \"--color-text\": theme.colors.text.primary,\n \"--color-text-primary\": theme.colors.text.primary,\n \"--color-text-secondary\": theme.colors.text.secondary,\n\n \"--color-background\": theme.colors.background.primary,\n \"--color-background-primary\": theme.colors.background.primary,\n \"--color-background-secondary\": theme.colors.background.secondary,\n \"--color-background-alpha\": theme.colors.background.alpha,\n\n \"--color-divider\": theme.colors.divider,\n\n \"--color-brand\": theme.colors.brand.primary,\n \"--color-brand-primary\": theme.colors.brand.primary,\n \"--color-brand-secondary\": theme.colors.brand.secondary,\n \"--color-brand-alpha\": theme.colors.brand.alpha,\n \"--color-brand-text\": theme.colors.brand.text,\n\n \"--color-accent\": theme.colors.accent.primary,\n \"--color-accent-primary\": theme.colors.accent.primary,\n \"--color-accent-secondary\": theme.colors.accent.secondary,\n \"--color-accent-alpha\": theme.colors.accent.alpha,\n \"--color-accent-text\": theme.colors.accent.text,\n\n \"--color-info\": theme.colors.info.primary,\n \"--color-info-primary\": theme.colors.info.primary,\n \"--color-info-secondary\": theme.colors.info.secondary,\n \"--color-info-alpha\": theme.colors.info.alpha,\n \"--color-info-text\": theme.colors.info.text,\n\n \"--color-success\": theme.colors.success.primary,\n \"--color-success-primary\": theme.colors.success.primary,\n \"--color-success-secondary\": theme.colors.success.secondary,\n \"--color-success-alpha\": theme.colors.success.alpha,\n \"--color-success-text\": theme.colors.success.text,\n\n \"--color-warning\": theme.colors.warning.primary,\n \"--color-warning-primary\": theme.colors.warning.primary,\n \"--color-warning-secondary\": theme.colors.warning.secondary,\n \"--color-warning-alpha\": theme.colors.warning.alpha,\n \"--color-warning-text\": theme.colors.warning.text,\n\n \"--color-danger\": theme.colors.danger.primary,\n \"--color-danger-primary\": theme.colors.danger.primary,\n \"--color-danger-secondary\": theme.colors.danger.secondary,\n \"--color-danger-alpha\": theme.colors.danger.alpha,\n \"--color-danger-text\": theme.colors.danger.text,\n ...shadows,\n }\n}\n\n\nexport default ThemeCssVars"],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": ["ThemeCssVars", "theme", "shadows", "s", "i", "ThemeCssVars_default"]
|
|
7
|
+
}
|
|
@@ -0,0 +1,68 @@
|
|
|
1
|
+
import { ThemeOptionInput, ThemeTypographyType } from './types';
|
|
2
|
+
export declare const lightColorPallete: {
|
|
3
|
+
text: {
|
|
4
|
+
primary: string;
|
|
5
|
+
secondary: string;
|
|
6
|
+
};
|
|
7
|
+
background: {
|
|
8
|
+
primary: string;
|
|
9
|
+
secondary: string;
|
|
10
|
+
};
|
|
11
|
+
divider: string;
|
|
12
|
+
};
|
|
13
|
+
export declare const darkColorPallete: {
|
|
14
|
+
text: {
|
|
15
|
+
primary: string;
|
|
16
|
+
secondary: string;
|
|
17
|
+
};
|
|
18
|
+
background: {
|
|
19
|
+
primary: string;
|
|
20
|
+
secondary: string;
|
|
21
|
+
};
|
|
22
|
+
divider: string;
|
|
23
|
+
};
|
|
24
|
+
export declare const ThemeColors: {
|
|
25
|
+
brand: {
|
|
26
|
+
primary: string;
|
|
27
|
+
secondary: string;
|
|
28
|
+
text: string;
|
|
29
|
+
};
|
|
30
|
+
accent: {
|
|
31
|
+
primary: string;
|
|
32
|
+
secondary: string;
|
|
33
|
+
text: string;
|
|
34
|
+
};
|
|
35
|
+
info: {
|
|
36
|
+
primary: string;
|
|
37
|
+
secondary: string;
|
|
38
|
+
text: string;
|
|
39
|
+
};
|
|
40
|
+
success: {
|
|
41
|
+
primary: string;
|
|
42
|
+
secondary: string;
|
|
43
|
+
text: string;
|
|
44
|
+
};
|
|
45
|
+
warning: {
|
|
46
|
+
primary: string;
|
|
47
|
+
secondary: string;
|
|
48
|
+
text: string;
|
|
49
|
+
};
|
|
50
|
+
danger: {
|
|
51
|
+
primary: string;
|
|
52
|
+
secondary: string;
|
|
53
|
+
text: string;
|
|
54
|
+
};
|
|
55
|
+
text: {
|
|
56
|
+
primary: string;
|
|
57
|
+
secondary: string;
|
|
58
|
+
};
|
|
59
|
+
background: {
|
|
60
|
+
primary: string;
|
|
61
|
+
secondary: string;
|
|
62
|
+
};
|
|
63
|
+
divider: string;
|
|
64
|
+
};
|
|
65
|
+
export declare const ThemeTypography: ThemeTypographyType;
|
|
66
|
+
export declare const shadow: string[];
|
|
67
|
+
declare const _default: ThemeOptionInput;
|
|
68
|
+
export default _default;
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
const p={text:{primary:"#212B36",secondary:"#637381"},background:{primary:"#FFFFFF",secondary:"#EDEFF7"},divider:"#DADCE0"},b={text:{primary:"#FFFFFF",secondary:"#C4CDD5"},background:{primary:"#272727",secondary:"#1E1E1E"},divider:"#3D3D3D"},x={...p,brand:{primary:"#3b82f6",secondary:"#60a5fa",text:"#FFFFFF"},accent:{primary:"#14b8a6",secondary:"#2dd4bf",text:"#FFFFFF"},info:{primary:"#0ea5e9",secondary:"#60a5fa",text:"#FFFFFF"},success:{primary:"#22c55e",secondary:"#4ade80",text:"#FFFFFF"},warning:{primary:"#f59e0b",secondary:"#fbbf24",text:"#FFFFFF"},danger:{primary:"#ef4444",secondary:"#f87171",text:"#FFFFFF"}},r={fontFamily:'"Inter",sans-serif,"Helvetica","Arial"',h1:{fontSize:47.78,lineHeight:1.3,fontWeight:400},h2:{fontSize:39.81,lineHeight:1.35,fontWeight:400},h3:{fontSize:33.18,lineHeight:1.4,fontWeight:400},h4:{fontSize:27.65,lineHeight:1.45,fontWeight:400},h5:{fontSize:27.65,lineHeight:1.5,fontWeight:400},h6:{fontSize:23.04,lineHeight:1.55,fontWeight:400},text:{fontSize:16,lineHeight:1.6,fontWeight:400},button:{fontSize:13.33,lineHeight:1.6,fontWeight:500},small:{fontSize:12.33,lineHeight:1.6,fontWeight:400}},a=["none","0px 2px 1px -1px rgba(0,0,0,0.2),0px 1px 1px 0px rgba(0,0,0,0.14),0px 1px 3px 0px rgba(0,0,0,0.12)","0px 3px 1px -2px rgba(0,0,0,0.2),0px 2px 2px 0px rgba(0,0,0,0.14),0px 1px 5px 0px rgba(0,0,0,0.12)","0px 3px 3px -2px rgba(0,0,0,0.2),0px 3px 4px 0px rgba(0,0,0,0.14),0px 1px 8px 0px rgba(0,0,0,0.12)","0px 2px 4px -1px rgba(0,0,0,0.2),0px 4px 5px 0px rgba(0,0,0,0.14),0px 1px 10px 0px rgba(0,0,0,0.12)","0px 3px 5px -1px rgba(0,0,0,0.2),0px 5px 8px 0px rgba(0,0,0,0.14),0px 1px 14px 0px rgba(0,0,0,0.12)","0px 3px 5px -1px rgba(0,0,0,0.2),0px 6px 10px 0px rgba(0,0,0,0.14),0px 1px 18px 0px rgba(0,0,0,0.12)","0px 4px 5px -2px rgba(0,0,0,0.2),0px 7px 10px 1px rgba(0,0,0,0.14),0px 2px 16px 1px rgba(0,0,0,0.12)","0px 5px 5px -3px rgba(0,0,0,0.2),0px 8px 10px 1px rgba(0,0,0,0.14),0px 3px 14px 2px rgba(0,0,0,0.12)","0px 5px 6px -3px rgba(0,0,0,0.2),0px 9px 12px 1px rgba(0,0,0,0.14),0px 3px 16px 2px rgba(0,0,0,0.12)","0px 6px 6px -3px rgba(0,0,0,0.2),0px 10px 14px 1px rgba(0,0,0,0.14),0px 4px 18px 3px rgba(0,0,0,0.12)","0px 6px 7px -4px rgba(0,0,0,0.2),0px 11px 15px 1px rgba(0,0,0,0.14),0px 4px 20px 3px rgba(0,0,0,0.12)","0px 7px 8px -4px rgba(0,0,0,0.2),0px 12px 17px 2px rgba(0,0,0,0.14),0px 5px 22px 4px rgba(0,0,0,0.12)","0px 7px 8px -4px rgba(0,0,0,0.2),0px 13px 19px 2px rgba(0,0,0,0.14),0px 5px 24px 4px rgba(0,0,0,0.12)","0px 7px 9px -4px rgba(0,0,0,0.2),0px 14px 21px 2px rgba(0,0,0,0.14),0px 5px 26px 4px rgba(0,0,0,0.12)","0px 8px 9px -5px rgba(0,0,0,0.2),0px 15px 22px 2px rgba(0,0,0,0.14),0px 6px 28px 5px rgba(0,0,0,0.12)","0px 8px 10px -5px rgba(0,0,0,0.2),0px 16px 24px 2px rgba(0,0,0,0.14),0px 6px 30px 5px rgba(0,0,0,0.12)","0px 8px 11px -5px rgba(0,0,0,0.2),0px 17px 26px 2px rgba(0,0,0,0.14),0px 6px 32px 5px rgba(0,0,0,0.12)","0px 9px 11px -5px rgba(0,0,0,0.2),0px 18px 28px 2px rgba(0,0,0,0.14),0px 7px 34px 6px rgba(0,0,0,0.12)","0px 9px 12px -6px rgba(0,0,0,0.2),0px 19px 29px 2px rgba(0,0,0,0.14),0px 7px 36px 6px rgba(0,0,0,0.12)","0px 10px 13px -6px rgba(0,0,0,0.2),0px 20px 31px 3px rgba(0,0,0,0.14),0px 8px 38px 7px rgba(0,0,0,0.12)","0px 10px 13px -6px rgba(0,0,0,0.2),0px 21px 33px 3px rgba(0,0,0,0.14),0px 8px 40px 7px rgba(0,0,0,0.12)","0px 10px 14px -6px rgba(0,0,0,0.2),0px 22px 35px 3px rgba(0,0,0,0.14),0px 8px 42px 7px rgba(0,0,0,0.12)","0px 11px 14px -7px rgba(0,0,0,0.2),0px 23px 36px 3px rgba(0,0,0,0.14),0px 9px 44px 8px rgba(0,0,0,0.12)","0px 11px 15px -7px rgba(0,0,0,0.2),0px 24px 38px 3px rgba(0,0,0,0.14),0px 9px 46px 8px rgba(0,0,0,0.12)"];var o={name:"light",rtl:!1,shadow:a,globalStyle:{},colors:x,typography:r,interfaces:{}};export{x as ThemeColors,r as ThemeTypography,b as darkColorPallete,o as default,p as lightColorPallete,a as shadow};
|
|
2
|
+
//# sourceMappingURL=ThemeDefaultOptions.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../src/theme/ThemeDefaultOptions.ts"],
|
|
4
|
+
"sourcesContent": ["import { ThemeOptionInput, ThemeTypographyType } from './types'\n\nexport const lightColorPallete = {\n text: {\n primary: \"#212B36\",\n secondary: \"#637381\",\n },\n background: {\n primary: \"#FFFFFF\",\n secondary: \"#EDEFF7\",\n },\n divider: \"#DADCE0\"\n}\n\nexport const darkColorPallete = {\n text: {\n primary: \"#FFFFFF\",\n secondary: \"#C4CDD5\",\n },\n background: {\n primary: \"#272727\",\n secondary: \"#1E1E1E\",\n },\n divider: \"#3D3D3D\"\n}\n\nexport const ThemeColors = {\n ...lightColorPallete,\n brand: {\n primary: \"#3b82f6\",\n secondary: \"#60a5fa\",\n text: \"#FFFFFF\"\n },\n accent: {\n primary: \"#14b8a6\",\n secondary: \"#2dd4bf\",\n text: \"#FFFFFF\"\n },\n info: {\n primary: \"#0ea5e9\",\n secondary: \"#60a5fa\",\n text: \"#FFFFFF\"\n },\n success: {\n primary: \"#22c55e\",\n secondary: \"#4ade80\",\n text: \"#FFFFFF\"\n },\n warning: {\n primary: \"#f59e0b\",\n secondary: \"#fbbf24\",\n text: \"#FFFFFF\"\n },\n danger: {\n primary: \"#ef4444\",\n secondary: \"#f87171\",\n text: \"#FFFFFF\"\n },\n}\n\nexport const ThemeTypography: ThemeTypographyType = {\n fontFamily: '\"Inter\",sans-serif,\"Helvetica\",\"Arial\"',\n h1: {\n fontSize: 47.78,\n lineHeight: 1.3,\n fontWeight: 400,\n },\n h2: {\n fontSize: 39.81,\n lineHeight: 1.35,\n fontWeight: 400,\n },\n h3: {\n fontSize: 33.18,\n lineHeight: 1.4,\n fontWeight: 400,\n },\n h4: {\n fontSize: 27.65,\n lineHeight: 1.45,\n fontWeight: 400,\n },\n h5: {\n fontSize: 27.65,\n lineHeight: 1.5,\n fontWeight: 400,\n },\n h6: {\n fontSize: 23.04,\n lineHeight: 1.55,\n fontWeight: 400,\n },\n text: {\n fontSize: 16,\n lineHeight: 1.6,\n fontWeight: 400,\n },\n button: {\n fontSize: 13.33,\n lineHeight: 1.6,\n fontWeight: 500,\n },\n small: {\n fontSize: 12.33,\n lineHeight: 1.6,\n fontWeight: 400,\n }\n}\n\nexport const shadow = [\n \"none\",\n \"0px 2px 1px -1px rgba(0,0,0,0.2),0px 1px 1px 0px rgba(0,0,0,0.14),0px 1px 3px 0px rgba(0,0,0,0.12)\",\n \"0px 3px 1px -2px rgba(0,0,0,0.2),0px 2px 2px 0px rgba(0,0,0,0.14),0px 1px 5px 0px rgba(0,0,0,0.12)\",\n \"0px 3px 3px -2px rgba(0,0,0,0.2),0px 3px 4px 0px rgba(0,0,0,0.14),0px 1px 8px 0px rgba(0,0,0,0.12)\",\n \"0px 2px 4px -1px rgba(0,0,0,0.2),0px 4px 5px 0px rgba(0,0,0,0.14),0px 1px 10px 0px rgba(0,0,0,0.12)\",\n \"0px 3px 5px -1px rgba(0,0,0,0.2),0px 5px 8px 0px rgba(0,0,0,0.14),0px 1px 14px 0px rgba(0,0,0,0.12)\",\n \"0px 3px 5px -1px rgba(0,0,0,0.2),0px 6px 10px 0px rgba(0,0,0,0.14),0px 1px 18px 0px rgba(0,0,0,0.12)\",\n \"0px 4px 5px -2px rgba(0,0,0,0.2),0px 7px 10px 1px rgba(0,0,0,0.14),0px 2px 16px 1px rgba(0,0,0,0.12)\",\n \"0px 5px 5px -3px rgba(0,0,0,0.2),0px 8px 10px 1px rgba(0,0,0,0.14),0px 3px 14px 2px rgba(0,0,0,0.12)\",\n \"0px 5px 6px -3px rgba(0,0,0,0.2),0px 9px 12px 1px rgba(0,0,0,0.14),0px 3px 16px 2px rgba(0,0,0,0.12)\",\n \"0px 6px 6px -3px rgba(0,0,0,0.2),0px 10px 14px 1px rgba(0,0,0,0.14),0px 4px 18px 3px rgba(0,0,0,0.12)\",\n \"0px 6px 7px -4px rgba(0,0,0,0.2),0px 11px 15px 1px rgba(0,0,0,0.14),0px 4px 20px 3px rgba(0,0,0,0.12)\",\n \"0px 7px 8px -4px rgba(0,0,0,0.2),0px 12px 17px 2px rgba(0,0,0,0.14),0px 5px 22px 4px rgba(0,0,0,0.12)\",\n \"0px 7px 8px -4px rgba(0,0,0,0.2),0px 13px 19px 2px rgba(0,0,0,0.14),0px 5px 24px 4px rgba(0,0,0,0.12)\",\n \"0px 7px 9px -4px rgba(0,0,0,0.2),0px 14px 21px 2px rgba(0,0,0,0.14),0px 5px 26px 4px rgba(0,0,0,0.12)\",\n \"0px 8px 9px -5px rgba(0,0,0,0.2),0px 15px 22px 2px rgba(0,0,0,0.14),0px 6px 28px 5px rgba(0,0,0,0.12)\",\n \"0px 8px 10px -5px rgba(0,0,0,0.2),0px 16px 24px 2px rgba(0,0,0,0.14),0px 6px 30px 5px rgba(0,0,0,0.12)\",\n \"0px 8px 11px -5px rgba(0,0,0,0.2),0px 17px 26px 2px rgba(0,0,0,0.14),0px 6px 32px 5px rgba(0,0,0,0.12)\",\n \"0px 9px 11px -5px rgba(0,0,0,0.2),0px 18px 28px 2px rgba(0,0,0,0.14),0px 7px 34px 6px rgba(0,0,0,0.12)\",\n \"0px 9px 12px -6px rgba(0,0,0,0.2),0px 19px 29px 2px rgba(0,0,0,0.14),0px 7px 36px 6px rgba(0,0,0,0.12)\",\n \"0px 10px 13px -6px rgba(0,0,0,0.2),0px 20px 31px 3px rgba(0,0,0,0.14),0px 8px 38px 7px rgba(0,0,0,0.12)\",\n \"0px 10px 13px -6px rgba(0,0,0,0.2),0px 21px 33px 3px rgba(0,0,0,0.14),0px 8px 40px 7px rgba(0,0,0,0.12)\",\n \"0px 10px 14px -6px rgba(0,0,0,0.2),0px 22px 35px 3px rgba(0,0,0,0.14),0px 8px 42px 7px rgba(0,0,0,0.12)\",\n \"0px 11px 14px -7px rgba(0,0,0,0.2),0px 23px 36px 3px rgba(0,0,0,0.14),0px 9px 44px 8px rgba(0,0,0,0.12)\",\n \"0px 11px 15px -7px rgba(0,0,0,0.2),0px 24px 38px 3px rgba(0,0,0,0.14),0px 9px 46px 8px rgba(0,0,0,0.12)\",\n]\n\nexport default {\n name: \"light\",\n rtl: false,\n shadow,\n globalStyle: {},\n colors: ThemeColors,\n typography: ThemeTypography,\n interfaces: {}\n} as ThemeOptionInput\n"],
|
|
5
|
+
"mappings": "AAEO,MAAMA,EAAoB,CAC7B,KAAM,CACF,QAAS,UACT,UAAW,SACf,EACA,WAAY,CACR,QAAS,UACT,UAAW,SACf,EACA,QAAS,SACb,EAEaC,EAAmB,CAC5B,KAAM,CACF,QAAS,UACT,UAAW,SACf,EACA,WAAY,CACR,QAAS,UACT,UAAW,SACf,EACA,QAAS,SACb,EAEaC,EAAc,CACvB,GAAGF,EACH,MAAO,CACH,QAAS,UACT,UAAW,UACX,KAAM,SACV,EACA,OAAQ,CACJ,QAAS,UACT,UAAW,UACX,KAAM,SACV,EACA,KAAM,CACF,QAAS,UACT,UAAW,UACX,KAAM,SACV,EACA,QAAS,CACL,QAAS,UACT,UAAW,UACX,KAAM,SACV,EACA,QAAS,CACL,QAAS,UACT,UAAW,UACX,KAAM,SACV,EACA,OAAQ,CACJ,QAAS,UACT,UAAW,UACX,KAAM,SACV,CACJ,EAEaG,EAAuC,CAChD,WAAY,yCACZ,GAAI,CACA,SAAU,MACV,WAAY,IACZ,WAAY,GAChB,EACA,GAAI,CACA,SAAU,MACV,WAAY,KACZ,WAAY,GAChB,EACA,GAAI,CACA,SAAU,MACV,WAAY,IACZ,WAAY,GAChB,EACA,GAAI,CACA,SAAU,MACV,WAAY,KACZ,WAAY,GAChB,EACA,GAAI,CACA,SAAU,MACV,WAAY,IACZ,WAAY,GAChB,EACA,GAAI,CACA,SAAU,MACV,WAAY,KACZ,WAAY,GAChB,EACA,KAAM,CACF,SAAU,GACV,WAAY,IACZ,WAAY,GAChB,EACA,OAAQ,CACJ,SAAU,MACV,WAAY,IACZ,WAAY,GAChB,EACA,MAAO,CACH,SAAU,MACV,WAAY,IACZ,WAAY,GAChB,CACJ,EAEaC,EAAS,CAClB,OACA,qGACA,qGACA,qGACA,sGACA,sGACA,uGACA,uGACA,uGACA,uGACA,wGACA,wGACA,wGACA,wGACA,wGACA,wGACA,yGACA,yGACA,yGACA,yGACA,0GACA,0GACA,0GACA,0GACA,yGACJ,EAEA,IAAOC,EAAQ,CACX,KAAM,QACN,IAAK,GACL,OAAAD,EACA,YAAa,CAAC,EACd,OAAQF,EACR,WAAYC,EACZ,WAAY,CAAC,CACjB",
|
|
6
|
+
"names": ["lightColorPallete", "darkColorPallete", "ThemeColors", "ThemeTypography", "shadow", "ThemeDefaultOptions_default"]
|
|
7
|
+
}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
import { TagComponentType, TagProps } from "../Tag/types";
|
|
3
|
+
export type ThemeProviderProps<T extends TagComponentType = 'div'> = TagProps<T> & {
|
|
4
|
+
theme: string;
|
|
5
|
+
resetCss?: boolean;
|
|
6
|
+
scrollbarCss?: boolean;
|
|
7
|
+
isRootProvider?: boolean;
|
|
8
|
+
renderIsRoot?: React.ReactElement;
|
|
9
|
+
};
|
|
10
|
+
declare const ThemeProvider: ({ children, theme, resetCss, scrollbarCss, isRootProvider, renderIsRoot, ...props }: ThemeProviderProps) => React.JSX.Element;
|
|
11
|
+
export default ThemeProvider;
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import*as r from"react";import g from"../Tag";import{BreakpointProvider as d}from"../breakpoint";import{ThemeContex as y,ThemeFactory as c}from"./core";import f from"./ThemeCssVars";import{css as t}from"../css";const u=({children:l,theme:e,resetCss:a,scrollbarCss:n,isRootProvider:h,renderIsRoot:m,...p})=>{const o=c.get(e);if(!o)throw new Error(`Invalid theme name provided: ${e}`);return a??(a=!0),n??(n=!0),r.useMemo(()=>{if(Object.keys(o.globalStyle).length&&t({"@global":o.globalStyle}),t({"@global":{[`.xui-${e}-theme-root`]:f(o)}}),n&&typeof document<"u"){let s=10,i=o.colors.divider,b=o.colors.background.secondary;t({"@global":{"*":{scrollbarWidth:"thin",scrollbarColor:`${i} ${b}`},"::-webkit-scrollbar":{width:s,height:s},"::-webkit-scrollbar-thumb":{backgroundColor:i,borderRadius:"5px",border:"2px solid #f4f4f4"},"::-webkit-scrollbar-thumb:hover":{backgroundColor:i},"::-webkit-scrollbar-track":{backgroundColor:b,borderRadius:"5px"}}})}a&&t({"@global":{"*":{m:0,p:0,outline:"none",boxSizing:"border-box",verticalAlign:"baseline"},"html, body":{minHeight:"100%","-webkit-font-smoothing":"antialiased"},"img, picture, video, canvas, svg":{maxWidth:"100%",display:"block"},"input, button, textarea, select":{font:"inherit"},table:{borderCollapse:"collapse",borderSpacing:0},"ol, ul":{listStyle:"none"},a:{display:"inline-block"},"p, h1, h2, h3, h4, h5, h6":{overflowWrap:"break-word"}}})},[e]),r.createElement(y.Provider,{value:e},h?r.createElement(d,null,r.createElement(g,{minHeight:"100%",bgcolor:o.colors.background.primary,fontFamily:o.typography.fontFamily,fontSize:o.typography.text.fontSize,fontWeight:o.typography.text.fontWeight,lineHeight:o.typography.text.lineHeight,...p,baseClass:`${e}-theme-root`,direction:o.rtl?"rtl":"ltr"},l,m)):r.createElement(g,{minHeight:"100%",bgcolor:o.colors.background.primary,fontFamily:o.typography.fontFamily,fontSize:o.typography.text.fontSize,fontWeight:o.typography.text.fontWeight,lineHeight:o.typography.text.lineHeight,...p,baseClass:`${e}-theme-root`,direction:o.rtl?"rtl":"ltr"},l))};var z=u;export{z as default};
|
|
2
|
+
//# sourceMappingURL=ThemeProvider.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../src/theme/ThemeProvider.tsx"],
|
|
4
|
+
"sourcesContent": ["import * as React from \"react\"\nimport { ThemeOptions } from \"./types\"\nimport Tag from \"../Tag\"\nimport { TagComponentType, TagProps } from \"../Tag/types\"\nimport { BreakpointProvider } from \"../breakpoint\"\nimport { ThemeContex, ThemeFactory } from \"./core\"\nimport ThemeCssVars from \"./ThemeCssVars\"\nimport { css } from \"../css\"\n\nexport type ThemeProviderProps<T extends TagComponentType = 'div'> = TagProps<T> & {\n theme: string;\n resetCss?: boolean;\n scrollbarCss?: boolean;\n isRootProvider?: boolean;\n renderIsRoot?: React.ReactElement;\n}\n\nconst ThemeProvider = ({ children, theme, resetCss, scrollbarCss, isRootProvider, renderIsRoot, ...props }: ThemeProviderProps) => {\n const THEME = ThemeFactory.get(theme) as ThemeOptions\n if (!THEME) throw new Error(`Invalid theme name provided: ${theme}`)\n resetCss ??= true\n scrollbarCss ??= true\n\n React.useMemo(() => {\n if (!!Object.keys(THEME.globalStyle).length) {\n css({\n \"@global\": THEME.globalStyle\n })\n }\n\n css({\n \"@global\": {\n [`.xui-${theme}-theme-root`]: ThemeCssVars(THEME)\n }\n })\n\n if (scrollbarCss && typeof document !== 'undefined') {\n let thumbSize = 10\n let thumbColor = THEME.colors.divider\n let trackColor = THEME.colors.background.secondary\n css({\n \"@global\": {\n \"*\": {\n scrollbarWidth: \"thin\",\n scrollbarColor: `${thumbColor} ${trackColor}`,\n },\n \"::-webkit-scrollbar\": {\n width: thumbSize,\n height: thumbSize,\n },\n \"::-webkit-scrollbar-thumb\": {\n backgroundColor: thumbColor,\n borderRadius: \"5px\",\n border: \"2px solid #f4f4f4\",\n },\n \"::-webkit-scrollbar-thumb:hover\": {\n backgroundColor: thumbColor,\n },\n \"::-webkit-scrollbar-track\": {\n backgroundColor: trackColor,\n borderRadius: \"5px\",\n },\n }\n })\n }\n\n resetCss && css({\n \"@global\": {\n \"*\": {\n m: 0,\n p: 0,\n outline: \"none\",\n boxSizing: \"border-box\",\n verticalAlign: \"baseline\",\n },\n \"html, body\": {\n minHeight: \"100%\",\n \"-webkit-font-smoothing\": \"antialiased\"\n } as any,\n \"img, picture, video, canvas, svg\": {\n maxWidth: \"100%\",\n display: \"block\"\n },\n \"input, button, textarea, select\": {\n font: \"inherit\"\n },\n \"table\": {\n borderCollapse: \"collapse\",\n borderSpacing: 0\n },\n \"ol, ul\": {\n listStyle: \"none\"\n },\n \"a\": {\n display: \"inline-block\"\n },\n \"p, h1, h2, h3, h4, h5, h6\": {\n overflowWrap: \"break-word\",\n }\n }\n })\n }, [theme])\n\n return (\n <ThemeContex.Provider value={theme}>\n {\n isRootProvider ? <BreakpointProvider>\n <Tag\n minHeight=\"100%\"\n bgcolor={THEME.colors.background.primary}\n fontFamily={THEME.typography.fontFamily}\n fontSize={THEME.typography.text.fontSize}\n fontWeight={THEME.typography.text.fontWeight}\n lineHeight={THEME.typography.text.lineHeight}\n {...props}\n baseClass={`${theme}-theme-root`}\n direction={THEME.rtl ? \"rtl\" : \"ltr\"}\n >\n {children}\n {renderIsRoot}\n </Tag>\n </BreakpointProvider> : <Tag\n minHeight=\"100%\"\n bgcolor={THEME.colors.background.primary}\n fontFamily={THEME.typography.fontFamily}\n fontSize={THEME.typography.text.fontSize}\n fontWeight={THEME.typography.text.fontWeight}\n lineHeight={THEME.typography.text.lineHeight}\n {...props}\n baseClass={`${theme}-theme-root`}\n direction={THEME.rtl ? \"rtl\" : \"ltr\"}\n >\n {children}\n </Tag>\n }\n </ThemeContex.Provider>\n )\n}\n\nexport default ThemeProvider"],
|
|
5
|
+
"mappings": "AAAA,UAAYA,MAAW,QAEvB,OAAOC,MAAS,SAEhB,OAAS,sBAAAC,MAA0B,gBACnC,OAAS,eAAAC,EAAa,gBAAAC,MAAoB,SAC1C,OAAOC,MAAkB,iBACzB,OAAS,OAAAC,MAAW,SAUpB,MAAMC,EAAgB,CAAC,CAAE,SAAAC,EAAU,MAAAC,EAAO,SAAAC,EAAU,aAAAC,EAAc,eAAAC,EAAgB,aAAAC,EAAc,GAAGC,CAAM,IAA0B,CAChI,MAAMC,EAAQX,EAAa,IAAIK,CAAK,EACpC,GAAI,CAACM,EAAO,MAAM,IAAI,MAAM,gCAAgCN,CAAK,EAAE,EACnE,OAAAC,MAAa,IACbC,MAAiB,IAEjBX,EAAM,QAAQ,IAAM,CAajB,GAZM,OAAO,KAAKe,EAAM,WAAW,EAAE,QAClCT,EAAI,CACD,UAAWS,EAAM,WACpB,CAAC,EAGJT,EAAI,CACD,UAAW,CACR,CAAC,QAAQG,CAAK,aAAa,EAAGJ,EAAaU,CAAK,CACnD,CACH,CAAC,EAEGJ,GAAgB,OAAO,SAAa,IAAa,CAClD,IAAIK,EAAY,GACZC,EAAaF,EAAM,OAAO,QAC1BG,EAAaH,EAAM,OAAO,WAAW,UACzCT,EAAI,CACD,UAAW,CACR,IAAK,CACF,eAAgB,OAChB,eAAgB,GAAGW,CAAU,IAAIC,CAAU,EAC9C,EACA,sBAAuB,CACpB,MAAOF,EACP,OAAQA,CACX,EACA,4BAA6B,CAC1B,gBAAiBC,EACjB,aAAc,MACd,OAAQ,mBACX,EACA,kCAAmC,CAChC,gBAAiBA,CACpB,EACA,4BAA6B,CAC1B,gBAAiBC,EACjB,aAAc,KACjB,CACH,CACH,CAAC,CACJ,CAEAR,GAAYJ,EAAI,CACb,UAAW,CACR,IAAK,CACF,EAAG,EACH,EAAG,EACH,QAAS,OACT,UAAW,aACX,cAAe,UAClB,EACA,aAAc,CACX,UAAW,OACX,yBAA0B,aAC7B,EACA,mCAAoC,CACjC,SAAU,OACV,QAAS,OACZ,EACA,kCAAmC,CAChC,KAAM,SACT,EACA,MAAS,CACN,eAAgB,WAChB,cAAe,CAClB,EACA,SAAU,CACP,UAAW,MACd,EACA,EAAK,CACF,QAAS,cACZ,EACA,4BAA6B,CAC1B,aAAc,YACjB,CACH,CACH,CAAC,CACJ,EAAG,CAACG,CAAK,CAAC,EAGPT,EAAA,cAACG,EAAY,SAAZ,CAAqB,MAAOM,GAEvBG,EAAiBZ,EAAA,cAACE,EAAA,KACfF,EAAA,cAACC,EAAA,CACE,UAAU,OACV,QAASc,EAAM,OAAO,WAAW,QACjC,WAAYA,EAAM,WAAW,WAC7B,SAAUA,EAAM,WAAW,KAAK,SAChC,WAAYA,EAAM,WAAW,KAAK,WAClC,WAAYA,EAAM,WAAW,KAAK,WACjC,GAAGD,EACJ,UAAW,GAAGL,CAAK,cACnB,UAAWM,EAAM,IAAM,MAAQ,OAE9BP,EACAK,CACJ,CACH,EAAwBb,EAAA,cAACC,EAAA,CACtB,UAAU,OACV,QAASc,EAAM,OAAO,WAAW,QACjC,WAAYA,EAAM,WAAW,WAC7B,SAAUA,EAAM,WAAW,KAAK,SAChC,WAAYA,EAAM,WAAW,KAAK,WAClC,WAAYA,EAAM,WAAW,KAAK,WACjC,GAAGD,EACJ,UAAW,GAAGL,CAAK,cACnB,UAAWM,EAAM,IAAM,MAAQ,OAE9BP,CACJ,CAEN,CAEN,EAEA,IAAOW,EAAQZ",
|
|
6
|
+
"names": ["React", "Tag", "BreakpointProvider", "ThemeContex", "ThemeFactory", "ThemeCssVars", "css", "ThemeProvider", "children", "theme", "resetCss", "scrollbarCss", "isRootProvider", "renderIsRoot", "props", "THEME", "thumbSize", "thumbColor", "trackColor", "ThemeProvider_default"]
|
|
7
|
+
}
|
package/theme/core.d.ts
ADDED
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import { ObjectType, ThemeOptions } from "./types";
|
|
3
|
+
export declare const ThemeFactory: Map<string, ThemeOptions>;
|
|
4
|
+
export declare const ThemeContex: React.Context<string>;
|
|
5
|
+
export declare const getTheme: (theme: string) => ThemeOptions | undefined;
|
|
6
|
+
export declare const useTheme: () => ThemeOptions;
|
|
7
|
+
export declare const mergeObject: (a: ObjectType, b: ObjectType) => ObjectType;
|
package/theme/core.js
ADDED
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import r from"react";const s=new Map,c=r.createContext("light"),h=e=>s.get(e),x=()=>s.get(r.useContext(c)),p=(e,t)=>{e={...e},t={...t};for(const o in t){const n=t[o];typeof n=="object"&&!Array.isArray(n)&&!r.isValidElement(n)?e[o]=p(e[o],t[o]):e[o]=n}return e};export{c as ThemeContex,s as ThemeFactory,h as getTheme,p as mergeObject,x as useTheme};
|
|
2
|
+
//# sourceMappingURL=core.js.map
|