@iziui/react 0.0.88-rc → 0.0.89-rc
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/dist/.types/_internal/core/options/CustomOptions.d.ts +6 -1
- package/dist/.types/_internal/core/options/createOptions/createOptions.d.ts +1 -1
- package/dist/.types/_internal/core/plugin/behavior/defineBoxShadow/defineBoxShadow.d.ts +5 -1
- package/dist/.types/_internal/core/plugin/breakpoint/defineBreakpoint/defineBreakpoint.d.ts +2 -0
- package/dist/.types/_internal/core/plugin/breakpoint/defineBreakpoint/index.d.ts +1 -0
- package/dist/.types/_internal/core/plugin/breakpoint/index.d.ts +1 -0
- package/dist/.types/_internal/core/plugin/color/defineBackground/defineBackground.d.ts +5 -1
- package/dist/.types/_internal/core/plugin/color/defineBackgroundColor/defineBackgroundColor.d.ts +5 -1
- package/dist/.types/_internal/core/plugin/color/defineBorderColor/defineBorderColor.d.ts +5 -1
- package/dist/.types/_internal/core/plugin/color/defineColor/defineColor.d.ts +5 -1
- package/dist/.types/_internal/core/plugin/definePlugin/definePlugin.d.ts +2 -3
- package/dist/.types/_internal/core/plugin/index.d.ts +1 -0
- package/dist/.types/_internal/core/plugin/plugin.d.ts +2 -1
- package/dist/.types/_internal/core/plugin/shape/defineBorderRadius/defineBorderRadius.d.ts +5 -1
- package/dist/.types/_internal/core/plugin/spacing/defineMargin/defineMargin.d.ts +7 -1
- package/dist/.types/_internal/core/plugin/spacing/definePadding/definePadding.d.ts +7 -1
- package/dist/.types/_internal/toolkit/string/string.d.ts +1 -0
- package/dist/.types/_internal/toolkit/uuid/index.d.ts +1 -1
- package/dist/.types/_internal/toolkit/uuid/uuid.d.ts +1 -0
- package/dist/.types/core/createComponent.d.ts.map +1 -1
- package/dist/.types/hooks/useResize/useResize.d.ts +1 -1
- package/dist/.types/hooks/useResize/useResize.d.ts.map +1 -1
- package/dist/.types/layout/Stack/Stack.stories.d.ts +1 -0
- package/dist/.types/layout/Stack/Stack.stories.d.ts.map +1 -1
- package/dist/chunks/{Alert-Cc5S-AfT.cjs → Alert-CUgp08gU.cjs} +2 -2
- package/dist/chunks/{Alert-Cc5S-AfT.cjs.map → Alert-CUgp08gU.cjs.map} +1 -1
- package/dist/chunks/{Alert-DJexLc9y.js → Alert-mOXPwc3e.js} +2 -2
- package/dist/chunks/{Alert-DJexLc9y.js.map → Alert-mOXPwc3e.js.map} +1 -1
- package/dist/chunks/{Box-D7fnBKFY.cjs → Box-DdpIV_Bl.cjs} +2 -2
- package/dist/chunks/{Box-D7fnBKFY.cjs.map → Box-DdpIV_Bl.cjs.map} +1 -1
- package/dist/chunks/{Box-BzStXj3R.js → Box-O2jw08Hf.js} +2 -2
- package/dist/chunks/{Box-BzStXj3R.js.map → Box-O2jw08Hf.js.map} +1 -1
- package/dist/chunks/{ButtonIcon-B-M87M5L.cjs → ButtonIcon-BMOZPxpN.cjs} +2 -2
- package/dist/chunks/{ButtonIcon-B-M87M5L.cjs.map → ButtonIcon-BMOZPxpN.cjs.map} +1 -1
- package/dist/chunks/{ButtonIcon-D0YH7wS6.js → ButtonIcon-CYO1Crb-.js} +2 -2
- package/dist/chunks/{ButtonIcon-D0YH7wS6.js.map → ButtonIcon-CYO1Crb-.js.map} +1 -1
- package/dist/chunks/{Card-wBDtOPXO.js → Card-D_RFnUk2.js} +2 -2
- package/dist/chunks/{Card-wBDtOPXO.js.map → Card-D_RFnUk2.js.map} +1 -1
- package/dist/chunks/{Card-DqoL_8z0.cjs → Card-DtjP8NP7.cjs} +2 -2
- package/dist/chunks/{Card-DqoL_8z0.cjs.map → Card-DtjP8NP7.cjs.map} +1 -1
- package/dist/chunks/{CardContent-BOuRiZyj.cjs → CardContent-BqqU9iwO.cjs} +2 -2
- package/dist/chunks/{CardContent-BOuRiZyj.cjs.map → CardContent-BqqU9iwO.cjs.map} +1 -1
- package/dist/chunks/{CardContent-D0o8c1Yf.js → CardContent-BsSfxSQH.js} +2 -2
- package/dist/chunks/{CardContent-D0o8c1Yf.js.map → CardContent-BsSfxSQH.js.map} +1 -1
- package/dist/chunks/{DrawerContent-DswF1783.js → DrawerContent-CYQSz1G-.js} +2 -2
- package/dist/chunks/{DrawerContent-DswF1783.js.map → DrawerContent-CYQSz1G-.js.map} +1 -1
- package/dist/chunks/{DrawerContent-CvWZGjje.cjs → DrawerContent-Dyc1evVF.cjs} +2 -2
- package/dist/chunks/{DrawerContent-CvWZGjje.cjs.map → DrawerContent-Dyc1evVF.cjs.map} +1 -1
- package/dist/chunks/{Icon-Dv3oduiN.cjs → Icon-CIrgQex7.cjs} +2 -2
- package/dist/chunks/{Icon-Dv3oduiN.cjs.map → Icon-CIrgQex7.cjs.map} +1 -1
- package/dist/chunks/{Icon-0KfCwKWR.js → Icon-imOBrsbL.js} +2 -2
- package/dist/chunks/{Icon-0KfCwKWR.js.map → Icon-imOBrsbL.js.map} +1 -1
- package/dist/chunks/{MenuButton-DbrtU31-.js → MenuButton-CvQxSdho.js} +2 -2
- package/dist/chunks/{MenuButton-DbrtU31-.js.map → MenuButton-CvQxSdho.js.map} +1 -1
- package/dist/chunks/{MenuButton-BF6coRYt.cjs → MenuButton-D0cPZU6x.cjs} +2 -2
- package/dist/chunks/{MenuButton-BF6coRYt.cjs.map → MenuButton-D0cPZU6x.cjs.map} +1 -1
- package/dist/chunks/{Stack-DsVkiTT_.cjs → Stack-B_lU0ez7.cjs} +2 -2
- package/dist/chunks/{Stack-DsVkiTT_.cjs.map → Stack-B_lU0ez7.cjs.map} +1 -1
- package/dist/chunks/{Stack-D0feJnm7.js → Stack-Deow48Th.js} +2 -2
- package/dist/chunks/{Stack-D0feJnm7.js.map → Stack-Deow48Th.js.map} +1 -1
- package/dist/chunks/{TableHeader-BDY2xI-0.js → TableHeader-DnifrYxO.js} +2 -2
- package/dist/chunks/{TableHeader-BDY2xI-0.js.map → TableHeader-DnifrYxO.js.map} +1 -1
- package/dist/chunks/{TableHeader-DNnzAUGG.cjs → TableHeader-SKzj2zHB.cjs} +2 -2
- package/dist/chunks/{TableHeader-DNnzAUGG.cjs.map → TableHeader-SKzj2zHB.cjs.map} +1 -1
- package/dist/chunks/{Typography-hazfs4Ye.js → Typography-BrJZyxiT.js} +2 -2
- package/dist/chunks/{Typography-hazfs4Ye.js.map → Typography-BrJZyxiT.js.map} +1 -1
- package/dist/chunks/{Typography-C7B3jwUf.cjs → Typography-DW57lh3e.cjs} +2 -2
- package/dist/chunks/{Typography-C7B3jwUf.cjs.map → Typography-DW57lh3e.cjs.map} +1 -1
- package/dist/chunks/createComponent-CovqNaAJ.js +8 -0
- package/dist/chunks/createComponent-CovqNaAJ.js.map +1 -0
- package/dist/chunks/createComponent-Dkt68kvT.cjs +8 -0
- package/dist/chunks/createComponent-Dkt68kvT.cjs.map +1 -0
- package/dist/chunks/useMenu-DewYBiar.cjs +2 -0
- package/dist/chunks/{useMenu-Bw3Im-FW.cjs.map → useMenu-DewYBiar.cjs.map} +1 -1
- package/dist/chunks/useMenu-DuX7EGHi.js +2 -0
- package/dist/chunks/{useMenu-DU5PYJUH.js.map → useMenu-DuX7EGHi.js.map} +1 -1
- package/dist/chunks/useResize-BUftB918.js +2 -0
- package/dist/chunks/useResize-BUftB918.js.map +1 -0
- package/dist/chunks/useResize-Dnf6Ktrn.cjs +2 -0
- package/dist/chunks/useResize-Dnf6Ktrn.cjs.map +1 -0
- package/dist/chunks/{useTheme-g5gOUmLf.js → useTheme-BYuNiCiH.js} +2 -2
- package/dist/chunks/{useTheme-g5gOUmLf.js.map → useTheme-BYuNiCiH.js.map} +1 -1
- package/dist/chunks/{useTheme-DhX2tM8O.cjs → useTheme-DsrjDJKC.cjs} +2 -2
- package/dist/chunks/{useTheme-DhX2tM8O.cjs.map → useTheme-DsrjDJKC.cjs.map} +1 -1
- package/dist/components/Alert/index.cjs +1 -1
- package/dist/components/Alert/index.js +1 -1
- package/dist/components/Avatar/index.cjs +1 -1
- package/dist/components/Avatar/index.cjs.map +1 -1
- package/dist/components/Avatar/index.js +1 -1
- package/dist/components/Avatar/index.js.map +1 -1
- package/dist/components/Box/index.cjs +1 -1
- package/dist/components/Box/index.js +1 -1
- package/dist/components/Button/index.cjs +1 -1
- package/dist/components/Button/index.js +1 -1
- package/dist/components/ButtonIcon/index.cjs +1 -1
- package/dist/components/ButtonIcon/index.js +1 -1
- package/dist/components/Card/index.cjs +1 -1
- package/dist/components/Card/index.js +1 -1
- package/dist/components/Checkbox/index.cjs +1 -1
- package/dist/components/Checkbox/index.js +1 -1
- package/dist/components/CheckboxGroup/index.cjs +1 -1
- package/dist/components/CheckboxGroup/index.js +1 -1
- package/dist/components/Chip/index.cjs +1 -1
- package/dist/components/Chip/index.js +1 -1
- package/dist/components/ColorPicker/index.cjs +1 -1
- package/dist/components/ColorPicker/index.cjs.map +1 -1
- package/dist/components/ColorPicker/index.js +1 -1
- package/dist/components/ColorPicker/index.js.map +1 -1
- package/dist/components/Container/index.cjs +1 -1
- package/dist/components/Container/index.js +1 -1
- package/dist/components/Divider/index.cjs +1 -1
- package/dist/components/Divider/index.js +1 -1
- package/dist/components/Drawer/index.cjs +1 -1
- package/dist/components/Drawer/index.js +1 -1
- package/dist/components/Icon/index.cjs +1 -1
- package/dist/components/Icon/index.js +1 -1
- package/dist/components/Input/index.cjs +1 -1
- package/dist/components/Input/index.js +1 -1
- package/dist/components/InputFile/index.cjs +1 -1
- package/dist/components/InputFile/index.js +1 -1
- package/dist/components/Loading/index.cjs +1 -1
- package/dist/components/Loading/index.js +1 -1
- package/dist/components/Menu/index.cjs +1 -1
- package/dist/components/Menu/index.js +1 -1
- package/dist/components/Modal/index.cjs +1 -1
- package/dist/components/Modal/index.js +1 -1
- package/dist/components/Select/index.cjs +1 -1
- package/dist/components/Select/index.cjs.map +1 -1
- package/dist/components/Select/index.js +1 -1
- package/dist/components/Select/index.js.map +1 -1
- package/dist/components/Skeleton/index.cjs +1 -1
- package/dist/components/Skeleton/index.js +1 -1
- package/dist/components/Stack/index.cjs +1 -1
- package/dist/components/Stack/index.js +1 -1
- package/dist/components/Switch/index.cjs +1 -1
- package/dist/components/Switch/index.cjs.map +1 -1
- package/dist/components/Switch/index.js +1 -1
- package/dist/components/Switch/index.js.map +1 -1
- package/dist/components/Table/index.cjs +1 -1
- package/dist/components/Table/index.js +1 -1
- package/dist/components/Toast/index.cjs +1 -1
- package/dist/components/Toast/index.cjs.map +1 -1
- package/dist/components/Toast/index.js +1 -1
- package/dist/components/Toast/index.js.map +1 -1
- package/dist/components/Tooltip/index.cjs +1 -1
- package/dist/components/Tooltip/index.js +1 -1
- package/dist/components/Typography/index.cjs +1 -1
- package/dist/components/Typography/index.js +1 -1
- package/dist/hooks/useResize/index.cjs +1 -1
- package/dist/hooks/useResize/index.js +1 -1
- package/dist/index.cjs +1 -1
- package/dist/index.js +1 -1
- package/dist/style.css +3 -3
- package/dist/theme/index.cjs +1 -1
- package/dist/theme/index.js +1 -1
- package/package.json +1 -1
- package/dist/chunks/createComponent-BBXW0GJ6.cjs +0 -2
- package/dist/chunks/createComponent-BBXW0GJ6.cjs.map +0 -1
- package/dist/chunks/createComponent-DZqrA_Tp.js +0 -2
- package/dist/chunks/createComponent-DZqrA_Tp.js.map +0 -1
- package/dist/chunks/useMenu-Bw3Im-FW.cjs +0 -2
- package/dist/chunks/useMenu-DU5PYJUH.js +0 -2
- package/dist/chunks/useResize-B-oebgDR.cjs +0 -2
- package/dist/chunks/useResize-B-oebgDR.cjs.map +0 -1
- package/dist/chunks/useResize-BjM6tiAF.js +0 -2
- package/dist/chunks/useResize-BjM6tiAF.js.map +0 -1
- package/dist/chunks/uuid-dGvr9vBZ.js +0 -2
- package/dist/chunks/uuid-dGvr9vBZ.js.map +0 -1
- package/dist/chunks/uuid-omnJ9TjZ.cjs +0 -2
- package/dist/chunks/uuid-omnJ9TjZ.cjs.map +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useTheme-g5gOUmLf.js","sources":["../../../../core/src/theme/createMappedColors.ts","../../../../core/src/theme/Theme.ts","../../../../core/src/theme/applyTheme/applyTheme.ts","../../../../core/src/theme/defaultTheme.ts","../../../../core/src/theme/createTheme/createTheme.ts","../../src/theme/ThemeProvider.tsx","../../src/theme/useTheme.ts"],"sourcesContent":["import type { MappedColors, Colors, colors } from './Theme';\n\nfunction generateMappedColor(color: Colors): MappedColors[] {\n return [\n `${color}.main`,\n `${color}.dark`,\n `${color}.light`,\n `${color}.opacity`,\n `${color}.contrast`,\n ];\n}\n\nexport function createMappedColors(_colors: typeof colors): MappedColors[] {\n return _colors.reduce<MappedColors[]>((acc, color) => {\n const mapped = generateMappedColor(color);\n\n acc = [...acc, ...mapped];\n\n return acc;\n }, [\n 'text.primary',\n 'text.secondary',\n 'text.disabled',\n 'background.paper',\n 'background.default',\n 'divider'\n ]);\n}","import type { Path } from '@iziui/toolkit/interface';\n\nimport { createMappedColors } from './createMappedColors';\n\nexport const colors = ['primary', 'secondary', 'error', 'warning', 'success', 'info', 'grey'] as const;\nexport const mappedColors = createMappedColors(colors);\n\nexport type Mode = 'light' | 'dark'\n\nexport type MappedColors = Path<PaletteBuilded>;\nexport type Colors = typeof colors[number];\n\nexport type Size = 'small' | 'medium' | 'large';\n\nexport interface Color {\n main: string;\n dark: string;\n light: string;\n opacity: string;\n contrast: string;\n}\n\nexport interface Palette {\n info: string;\n error: string;\n warning: string;\n success: string;\n primary: string;\n secondary: string;\n grey: string;\n text: {\n primary: string;\n secondary: string;\n disabled: string;\n };\n background: {\n paper: string;\n default: string;\n };\n divider: string;\n}\n\nexport type Spacing = number;\nexport type Shape = { radius: number; }\nexport type Typography = { family: string; url?: string; }\n\nexport interface PaletteBuilded extends Pick<Palette, 'text' | 'background' | 'divider'> {\n grey: Color;\n info: Color;\n error: Color;\n warning: Color;\n success: Color;\n primary: Color;\n secondary: Color;\n}\n\nexport interface Theme {\n mode: Mode;\n shape: Shape;\n palette: Palette;\n spacing: Spacing;\n typography: Typography;\n}\n\nexport interface ThemeOptions extends Omit<Partial<Theme>, 'palette'> {\n palette?: Partial<Palette>;\n}\nexport interface ThemeBuilded extends Omit<Theme, 'palette'> {\n palette: PaletteBuilded;\n}\n","import type { ThemeBuilded, Color } from '../Theme';\n\nfunction setColor(name: string, color: Color) {\n document.documentElement.style.setProperty(`--${name}`, color.main);\n document.documentElement.style.setProperty(`--${name}-light`, color.light);\n document.documentElement.style.setProperty(`--${name}-dark`, color.dark);\n document.documentElement.style.setProperty(`--${name}-contrast`, color.contrast);\n document.documentElement.style.setProperty(`--${name}-opacity`, color.opacity);\n}\n\nfunction ensureStylesheet(href: string) {\n if (document.querySelector(`link[href=\"${href}\"]`)) return;\n const link = document.createElement('link');\n link.rel = 'stylesheet';\n link.href = href;\n document.head.appendChild(link);\n}\n\nexport function applyTheme(theme: ThemeBuilded) {\n if (typeof window === 'undefined') { return; }\n\n const { palette, shape, spacing, typography } = theme;\n\n if (typography.url) { ensureStylesheet(typography.url); }\n\n // COLORS\n setColor('info', palette.info);\n setColor('error', palette.error);\n setColor('warning', palette.warning);\n setColor('success', palette.success);\n setColor('primary', palette.primary);\n setColor('secondary', palette.secondary);\n\n // GREY\n setColor('grey', palette.grey);\n\n // TYPOGRAPHY\n document.documentElement.style.setProperty('--typography', typography.family);\n\n // TEXT\n document.documentElement.style.setProperty('--text-primary', palette.text?.primary);\n document.documentElement.style.setProperty('--text-secondary', palette.text?.secondary);\n document.documentElement.style.setProperty('--text-disabled', palette.text?.disabled);\n\n // BACKGROUND\n document.documentElement.style.setProperty('--background-paper', palette.background?.paper);\n document.documentElement.style.setProperty('--background-default', palette.background?.default);\n\n // DIVIDER\n document.documentElement.style.setProperty('--divider', palette.divider);\n\n // SHAPE\n document.documentElement.style.setProperty('--radius', `${shape.radius}px`);\n\n // SPACING\n document.documentElement.style.setProperty('--spacing', `${spacing}px`);\n}","import type { Theme } from './Theme';\n\nexport const defaultSpacing: Theme['spacing'] = 8;\nexport const defaultShape: Theme['shape'] = { radius: 8 };\n\nexport const themeDefaultLight: Theme = {\n mode: 'light',\n palette: {\n info: '#72E4FC',\n error: '#FF5377',\n warning: '#FF9457',\n success: '#36E79B',\n primary: '#6C37F4',\n secondary: '#FB7185', //C026D3 // F97316 // FB7185 // F59E0B\n grey: '#545f6f',\n text: {\n primary: 'rgb(31, 41, 55)',\n secondary: 'rgb(75, 85, 99)',\n disabled: 'rgb(172, 172, 172)'\n },\n background: {\n paper: '#F9F8F9',\n default: '#FFF',\n },\n divider: 'rgba(0, 0, 0, 0.12)'\n },\n spacing: defaultSpacing,\n shape: defaultShape,\n typography: {\n family: 'Poppins',\n // eslint-disable-next-line\n url: 'https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500;1,600;1,700&display=swap'\n }\n};\n\nexport const themeDefaultDark: Theme = {\n mode: 'dark',\n palette: {\n info: '#72E4FC',\n error: '#FF5377',\n warning: '#FF9457',\n success: '#36E79B',\n primary: '#8b5dff',\n secondary: '#EBFF5E',\n grey: '#b3b3b3',\n text: {\n primary: 'rgba(255, 255, 255, 0.87)',\n secondary: 'rgba(255, 255, 255, 0.6)',\n disabled: 'rgba(255, 255, 255, 0.38)'\n },\n background: {\n paper: '#0D0225',\n default: '#30294E',\n },\n divider: 'rgba(255, 255, 255, 0.25)'\n },\n spacing: defaultSpacing,\n shape: defaultShape,\n typography: {\n family: 'Poppins',\n // eslint-disable-next-line\n url: 'https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500;1,600;1,700&display=swap'\n }\n};","import { generateSupportColors } from '../../utils';\nimport type { ThemeBuilded, ThemeOptions } from '../Theme';\nimport { themeDefaultDark, themeDefaultLight } from '../defaultTheme';\n\nconst SUPPORT_KEYS = [\n 'primary',\n 'secondary',\n 'error',\n 'warning',\n 'success',\n 'info',\n 'grey',\n] as const;\n\ntype SupportKey = (typeof SUPPORT_KEYS)[number];\n\nexport function createTheme(theme?: ThemeOptions): ThemeBuilded {\n const mode = theme?.mode ?? 'light';\n const ref = mode === 'dark' ? themeDefaultDark : themeDefaultLight;\n\n const paletteFromUser = theme?.palette ?? {};\n const paletteFromRef = ref.palette;\n\n const supportColors = Object.fromEntries(\n SUPPORT_KEYS.map((key) => [\n key,\n generateSupportColors(paletteFromUser[key] ?? paletteFromRef[key]),\n ])\n ) as Record<SupportKey, ThemeBuilded['palette'][SupportKey]>;\n\n return {\n mode,\n palette: {\n text: paletteFromUser.text ?? paletteFromRef.text,\n background: paletteFromUser.background ?? paletteFromRef.background,\n divider: paletteFromUser.divider ?? paletteFromRef.divider,\n ...supportColors,\n },\n shape: theme?.shape ?? ref.shape,\n spacing: theme?.spacing ?? ref.spacing,\n typography: theme?.typography ?? ref.typography,\n };\n}","import { createContext, useEffect, useMemo, useState, type PropsWithChildren } from 'react';\n\nimport type { ThemeBuilded } from '@iziui/core/theme';\nimport { createTheme, applyTheme, themeDefaultLight } from '@iziui/core/theme';\n\nimport '@iziui/styles/base/_base.scss';\n\nexport interface ThemeContextConfig {\n theme: ThemeBuilded;\n updateTheme: (theme: ThemeBuilded) => void;\n}\n\nexport const ThemeContext = createContext<ThemeContextConfig>({\n theme: createTheme(themeDefaultLight),\n updateTheme: () => { },\n});\n\ntype ThemeProviderProps = PropsWithChildren<{ theme: ThemeBuilded; }>\nexport default function ThemeProvider({ theme, children }: ThemeProviderProps) {\n const [_theme, setTheme] = useState<ThemeBuilded>(theme);\n\n const context = useMemo<ThemeContextConfig>(() => ({\n theme: _theme,\n updateTheme: (newTheme: ThemeBuilded) => updateTheme(newTheme),\n }), [theme, _theme]);\n\n useEffect(() => { applyTheme(_theme); }, [_theme]);\n\n const updateTheme = (newTheme: ThemeBuilded) => { setTheme(newTheme); };\n\n return (\n <ThemeContext.Provider value={context}>\n {children}\n </ThemeContext.Provider>\n );\n}\n\n","import { useContext } from 'react';\n\nimport { ThemeContext } from './ThemeProvider';\n\nexport default function useTheme() {\n return useContext(ThemeContext);\n}"],"names":["generateMappedColor","color","createMappedColors","_colors","acc","mapped","colors","setColor","name","ensureStylesheet","href","link","applyTheme","theme","palette","shape","spacing","typography","defaultSpacing","defaultShape","themeDefaultLight","themeDefaultDark","SUPPORT_KEYS","createTheme","mode","ref","paletteFromUser","paletteFromRef","supportColors","key","generateSupportColors","ThemeContext","createContext","ThemeProvider","children","_theme","setTheme","useState","context","useMemo","newTheme","updateTheme","useEffect","useTheme","useContext"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"useTheme-BYuNiCiH.js","sources":["../../../../core/src/theme/createMappedColors.ts","../../../../core/src/theme/Theme.ts","../../../../core/src/theme/applyTheme/applyTheme.ts","../../../../core/src/theme/defaultTheme.ts","../../../../core/src/theme/createTheme/createTheme.ts","../../src/theme/ThemeProvider.tsx","../../src/theme/useTheme.ts"],"sourcesContent":["import type { MappedColors, Colors, colors } from './Theme';\n\nfunction generateMappedColor(color: Colors): MappedColors[] {\n return [\n `${color}.main`,\n `${color}.dark`,\n `${color}.light`,\n `${color}.opacity`,\n `${color}.contrast`,\n ];\n}\n\nexport function createMappedColors(_colors: typeof colors): MappedColors[] {\n return _colors.reduce<MappedColors[]>((acc, color) => {\n const mapped = generateMappedColor(color);\n\n acc = [...acc, ...mapped];\n\n return acc;\n }, [\n 'text.primary',\n 'text.secondary',\n 'text.disabled',\n 'background.paper',\n 'background.default',\n 'divider'\n ]);\n}","import type { Path } from '@iziui/toolkit/interface';\n\nimport { createMappedColors } from './createMappedColors';\n\nexport const colors = ['primary', 'secondary', 'error', 'warning', 'success', 'info', 'grey'] as const;\nexport const mappedColors = createMappedColors(colors);\n\nexport type Mode = 'light' | 'dark'\n\nexport type MappedColors = Path<PaletteBuilded>;\nexport type Colors = typeof colors[number];\n\nexport type Size = 'small' | 'medium' | 'large';\n\nexport interface Color {\n main: string;\n dark: string;\n light: string;\n opacity: string;\n contrast: string;\n}\n\nexport interface Palette {\n info: string;\n error: string;\n warning: string;\n success: string;\n primary: string;\n secondary: string;\n grey: string;\n text: {\n primary: string;\n secondary: string;\n disabled: string;\n };\n background: {\n paper: string;\n default: string;\n };\n divider: string;\n}\n\nexport type Spacing = number;\nexport type Shape = { radius: number; }\nexport type Typography = { family: string; url?: string; }\n\nexport interface PaletteBuilded extends Pick<Palette, 'text' | 'background' | 'divider'> {\n grey: Color;\n info: Color;\n error: Color;\n warning: Color;\n success: Color;\n primary: Color;\n secondary: Color;\n}\n\nexport interface Theme {\n mode: Mode;\n shape: Shape;\n palette: Palette;\n spacing: Spacing;\n typography: Typography;\n}\n\nexport interface ThemeOptions extends Omit<Partial<Theme>, 'palette'> {\n palette?: Partial<Palette>;\n}\nexport interface ThemeBuilded extends Omit<Theme, 'palette'> {\n palette: PaletteBuilded;\n}\n","import type { ThemeBuilded, Color } from '../Theme';\n\nfunction setColor(name: string, color: Color) {\n document.documentElement.style.setProperty(`--${name}`, color.main);\n document.documentElement.style.setProperty(`--${name}-light`, color.light);\n document.documentElement.style.setProperty(`--${name}-dark`, color.dark);\n document.documentElement.style.setProperty(`--${name}-contrast`, color.contrast);\n document.documentElement.style.setProperty(`--${name}-opacity`, color.opacity);\n}\n\nfunction ensureStylesheet(href: string) {\n if (document.querySelector(`link[href=\"${href}\"]`)) return;\n const link = document.createElement('link');\n link.rel = 'stylesheet';\n link.href = href;\n document.head.appendChild(link);\n}\n\nexport function applyTheme(theme: ThemeBuilded) {\n if (typeof window === 'undefined') { return; }\n\n const { palette, shape, spacing, typography } = theme;\n\n if (typography.url) { ensureStylesheet(typography.url); }\n\n // COLORS\n setColor('info', palette.info);\n setColor('error', palette.error);\n setColor('warning', palette.warning);\n setColor('success', palette.success);\n setColor('primary', palette.primary);\n setColor('secondary', palette.secondary);\n\n // GREY\n setColor('grey', palette.grey);\n\n // TYPOGRAPHY\n document.documentElement.style.setProperty('--typography', typography.family);\n\n // TEXT\n document.documentElement.style.setProperty('--text-primary', palette.text?.primary);\n document.documentElement.style.setProperty('--text-secondary', palette.text?.secondary);\n document.documentElement.style.setProperty('--text-disabled', palette.text?.disabled);\n\n // BACKGROUND\n document.documentElement.style.setProperty('--background-paper', palette.background?.paper);\n document.documentElement.style.setProperty('--background-default', palette.background?.default);\n\n // DIVIDER\n document.documentElement.style.setProperty('--divider', palette.divider);\n\n // SHAPE\n document.documentElement.style.setProperty('--radius', `${shape.radius}px`);\n\n // SPACING\n document.documentElement.style.setProperty('--spacing', `${spacing}px`);\n}","import type { Theme } from './Theme';\n\nexport const defaultSpacing: Theme['spacing'] = 8;\nexport const defaultShape: Theme['shape'] = { radius: 8 };\n\nexport const themeDefaultLight: Theme = {\n mode: 'light',\n palette: {\n info: '#72E4FC',\n error: '#FF5377',\n warning: '#FF9457',\n success: '#36E79B',\n primary: '#6C37F4',\n secondary: '#FB7185', //C026D3 // F97316 // FB7185 // F59E0B\n grey: '#545f6f',\n text: {\n primary: 'rgb(31, 41, 55)',\n secondary: 'rgb(75, 85, 99)',\n disabled: 'rgb(172, 172, 172)'\n },\n background: {\n paper: '#F9F8F9',\n default: '#FFF',\n },\n divider: 'rgba(0, 0, 0, 0.12)'\n },\n spacing: defaultSpacing,\n shape: defaultShape,\n typography: {\n family: 'Poppins',\n // eslint-disable-next-line\n url: 'https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500;1,600;1,700&display=swap'\n }\n};\n\nexport const themeDefaultDark: Theme = {\n mode: 'dark',\n palette: {\n info: '#72E4FC',\n error: '#FF5377',\n warning: '#FF9457',\n success: '#36E79B',\n primary: '#8b5dff',\n secondary: '#EBFF5E',\n grey: '#2A2A2A',\n text: {\n primary: 'rgba(255, 255, 255, 0.87)',\n secondary: 'rgba(255, 255, 255, 0.6)',\n disabled: 'rgba(255, 255, 255, 0.38)'\n },\n background: {\n paper: '#0D0225',\n default: '#30294E',\n },\n divider: 'rgba(242, 242, 242, 0.12)'\n },\n spacing: defaultSpacing,\n shape: defaultShape,\n typography: {\n family: 'Poppins',\n // eslint-disable-next-line\n url: 'https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500;1,600;1,700&display=swap'\n }\n};","import { generateSupportColors } from '../../utils';\nimport type { ThemeBuilded, ThemeOptions } from '../Theme';\nimport { themeDefaultDark, themeDefaultLight } from '../defaultTheme';\n\nconst SUPPORT_KEYS = [\n 'primary',\n 'secondary',\n 'error',\n 'warning',\n 'success',\n 'info',\n 'grey',\n] as const;\n\ntype SupportKey = (typeof SUPPORT_KEYS)[number];\n\nexport function createTheme(theme?: ThemeOptions): ThemeBuilded {\n const mode = theme?.mode ?? 'light';\n const ref = mode === 'dark' ? themeDefaultDark : themeDefaultLight;\n\n const paletteFromUser = theme?.palette ?? {};\n const paletteFromRef = ref.palette;\n\n const supportColors = Object.fromEntries(\n SUPPORT_KEYS.map((key) => [\n key,\n generateSupportColors(paletteFromUser[key] ?? paletteFromRef[key]),\n ])\n ) as Record<SupportKey, ThemeBuilded['palette'][SupportKey]>;\n\n return {\n mode,\n palette: {\n text: paletteFromUser.text ?? paletteFromRef.text,\n background: paletteFromUser.background ?? paletteFromRef.background,\n divider: paletteFromUser.divider ?? paletteFromRef.divider,\n ...supportColors,\n },\n shape: theme?.shape ?? ref.shape,\n spacing: theme?.spacing ?? ref.spacing,\n typography: theme?.typography ?? ref.typography,\n };\n}","import { createContext, useEffect, useMemo, useState, type PropsWithChildren } from 'react';\n\nimport type { ThemeBuilded } from '@iziui/core/theme';\nimport { createTheme, applyTheme, themeDefaultLight } from '@iziui/core/theme';\n\nimport '@iziui/styles/base/_base.scss';\n\nexport interface ThemeContextConfig {\n theme: ThemeBuilded;\n updateTheme: (theme: ThemeBuilded) => void;\n}\n\nexport const ThemeContext = createContext<ThemeContextConfig>({\n theme: createTheme(themeDefaultLight),\n updateTheme: () => { },\n});\n\ntype ThemeProviderProps = PropsWithChildren<{ theme: ThemeBuilded; }>\nexport default function ThemeProvider({ theme, children }: ThemeProviderProps) {\n const [_theme, setTheme] = useState<ThemeBuilded>(theme);\n\n const context = useMemo<ThemeContextConfig>(() => ({\n theme: _theme,\n updateTheme: (newTheme: ThemeBuilded) => updateTheme(newTheme),\n }), [theme, _theme]);\n\n useEffect(() => { applyTheme(_theme); }, [_theme]);\n\n const updateTheme = (newTheme: ThemeBuilded) => { setTheme(newTheme); };\n\n return (\n <ThemeContext.Provider value={context}>\n {children}\n </ThemeContext.Provider>\n );\n}\n\n","import { useContext } from 'react';\n\nimport { ThemeContext } from './ThemeProvider';\n\nexport default function useTheme() {\n return useContext(ThemeContext);\n}"],"names":["generateMappedColor","color","createMappedColors","_colors","acc","mapped","colors","setColor","name","ensureStylesheet","href","link","applyTheme","theme","palette","shape","spacing","typography","defaultSpacing","defaultShape","themeDefaultLight","themeDefaultDark","SUPPORT_KEYS","createTheme","mode","ref","paletteFromUser","paletteFromRef","supportColors","key","generateSupportColors","ThemeContext","createContext","ThemeProvider","children","_theme","setTheme","useState","context","useMemo","newTheme","updateTheme","useEffect","useTheme","useContext"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";const d=require("react"),l=require("react/jsx-runtime"),g=require("./generateSupportColors-CTMoGhDf.cjs");function f(t){return[`${t}.main`,`${t}.dark`,`${t}.light`,`${t}.opacity`,`${t}.contrast`]}function h(t){return t.reduce((e,r)=>{const n=f(r);return e=[...e,...n],e},["text.primary","text.secondary","text.disabled","background.paper","background.default","divider"])}const b=["primary","secondary","error","warning","success","info","grey"];h(b);function a(t,e){document.documentElement.style.setProperty(`--${t}`,e.main),document.documentElement.style.setProperty(`--${t}-light`,e.light),document.documentElement.style.setProperty(`--${t}-dark`,e.dark),document.documentElement.style.setProperty(`--${t}-contrast`,e.contrast),document.documentElement.style.setProperty(`--${t}-opacity`,e.opacity)}function E(t){if(document.querySelector(`link[href="${t}"]`))return;const e=document.createElement("link");e.rel="stylesheet",e.href=t,document.head.appendChild(e)}function P(t){if(typeof window>"u")return;const{palette:e,shape:r,spacing:n,typography:o}=t;o.url&&E(o.url),a("info",e.info),a("error",e.error),a("warning",e.warning),a("success",e.success),a("primary",e.primary),a("secondary",e.secondary),a("grey",e.grey),document.documentElement.style.setProperty("--typography",o.family),document.documentElement.style.setProperty("--text-primary",e.text?.primary),document.documentElement.style.setProperty("--text-secondary",e.text?.secondary),document.documentElement.style.setProperty("--text-disabled",e.text?.disabled),document.documentElement.style.setProperty("--background-paper",e.background?.paper),document.documentElement.style.setProperty("--background-default",e.background?.default),document.documentElement.style.setProperty("--divider",e.divider),document.documentElement.style.setProperty("--radius",`${r.radius}px`),document.documentElement.style.setProperty("--spacing",`${n}px`)}const c=8,i={radius:8},u={mode:"light",palette:{info:"#72E4FC",error:"#FF5377",warning:"#FF9457",success:"#36E79B",primary:"#6C37F4",secondary:"#FB7185",grey:"#545f6f",text:{primary:"rgb(31, 41, 55)",secondary:"rgb(75, 85, 99)",disabled:"rgb(172, 172, 172)"},background:{paper:"#F9F8F9",default:"#FFF"},divider:"rgba(0, 0, 0, 0.12)"},spacing:c,shape:i,typography:{family:"Poppins",url:"https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500;1,600;1,700&display=swap"}},x={palette:{info:"#72E4FC",error:"#FF5377",warning:"#FF9457",success:"#36E79B",primary:"#8b5dff",secondary:"#EBFF5E",grey:"#
|
|
2
|
-
//# sourceMappingURL=useTheme-
|
|
1
|
+
"use strict";const d=require("react"),l=require("react/jsx-runtime"),g=require("./generateSupportColors-CTMoGhDf.cjs");function f(t){return[`${t}.main`,`${t}.dark`,`${t}.light`,`${t}.opacity`,`${t}.contrast`]}function h(t){return t.reduce((e,r)=>{const n=f(r);return e=[...e,...n],e},["text.primary","text.secondary","text.disabled","background.paper","background.default","divider"])}const b=["primary","secondary","error","warning","success","info","grey"];h(b);function a(t,e){document.documentElement.style.setProperty(`--${t}`,e.main),document.documentElement.style.setProperty(`--${t}-light`,e.light),document.documentElement.style.setProperty(`--${t}-dark`,e.dark),document.documentElement.style.setProperty(`--${t}-contrast`,e.contrast),document.documentElement.style.setProperty(`--${t}-opacity`,e.opacity)}function E(t){if(document.querySelector(`link[href="${t}"]`))return;const e=document.createElement("link");e.rel="stylesheet",e.href=t,document.head.appendChild(e)}function P(t){if(typeof window>"u")return;const{palette:e,shape:r,spacing:n,typography:o}=t;o.url&&E(o.url),a("info",e.info),a("error",e.error),a("warning",e.warning),a("success",e.success),a("primary",e.primary),a("secondary",e.secondary),a("grey",e.grey),document.documentElement.style.setProperty("--typography",o.family),document.documentElement.style.setProperty("--text-primary",e.text?.primary),document.documentElement.style.setProperty("--text-secondary",e.text?.secondary),document.documentElement.style.setProperty("--text-disabled",e.text?.disabled),document.documentElement.style.setProperty("--background-paper",e.background?.paper),document.documentElement.style.setProperty("--background-default",e.background?.default),document.documentElement.style.setProperty("--divider",e.divider),document.documentElement.style.setProperty("--radius",`${r.radius}px`),document.documentElement.style.setProperty("--spacing",`${n}px`)}const c=8,i={radius:8},u={mode:"light",palette:{info:"#72E4FC",error:"#FF5377",warning:"#FF9457",success:"#36E79B",primary:"#6C37F4",secondary:"#FB7185",grey:"#545f6f",text:{primary:"rgb(31, 41, 55)",secondary:"rgb(75, 85, 99)",disabled:"rgb(172, 172, 172)"},background:{paper:"#F9F8F9",default:"#FFF"},divider:"rgba(0, 0, 0, 0.12)"},spacing:c,shape:i,typography:{family:"Poppins",url:"https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500;1,600;1,700&display=swap"}},x={palette:{info:"#72E4FC",error:"#FF5377",warning:"#FF9457",success:"#36E79B",primary:"#8b5dff",secondary:"#EBFF5E",grey:"#2A2A2A",text:{primary:"rgba(255, 255, 255, 0.87)",secondary:"rgba(255, 255, 255, 0.6)",disabled:"rgba(255, 255, 255, 0.38)"},background:{paper:"#0D0225",default:"#30294E"},divider:"rgba(242, 242, 242, 0.12)"},spacing:c,shape:i,typography:{family:"Poppins",url:"https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500;1,600;1,700&display=swap"}},F=["primary","secondary","error","warning","success","info","grey"];function m(t){const e=t?.mode??"light",r=e==="dark"?x:u,n=t?.palette??{},o=r.palette,p=Object.fromEntries(F.map(s=>[s,g.generateSupportColors(n[s]??o[s])]));return{mode:e,palette:{text:n.text??o.text,background:n.background??o.background,divider:n.divider??o.divider,...p},shape:t?.shape??r.shape,spacing:t?.spacing??r.spacing,typography:t?.typography??r.typography}}const y=d.createContext({theme:m(u),updateTheme:()=>{}});function k({theme:t,children:e}){const[r,n]=d.useState(t),o=d.useMemo(()=>({theme:r,updateTheme:s=>p(s)}),[t,r]);d.useEffect(()=>{P(r)},[r]);const p=s=>{n(s)};return l.jsx(y.Provider,{value:o,children:e})}function C(){return d.useContext(y)}exports.ThemeProvider=k;exports.createTheme=m;exports.useTheme=C;
|
|
2
|
+
//# sourceMappingURL=useTheme-DsrjDJKC.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useTheme-DhX2tM8O.cjs","sources":["../../../../core/src/theme/createMappedColors.ts","../../../../core/src/theme/Theme.ts","../../../../core/src/theme/applyTheme/applyTheme.ts","../../../../core/src/theme/defaultTheme.ts","../../../../core/src/theme/createTheme/createTheme.ts","../../src/theme/ThemeProvider.tsx","../../src/theme/useTheme.ts"],"sourcesContent":["import type { MappedColors, Colors, colors } from './Theme';\n\nfunction generateMappedColor(color: Colors): MappedColors[] {\n return [\n `${color}.main`,\n `${color}.dark`,\n `${color}.light`,\n `${color}.opacity`,\n `${color}.contrast`,\n ];\n}\n\nexport function createMappedColors(_colors: typeof colors): MappedColors[] {\n return _colors.reduce<MappedColors[]>((acc, color) => {\n const mapped = generateMappedColor(color);\n\n acc = [...acc, ...mapped];\n\n return acc;\n }, [\n 'text.primary',\n 'text.secondary',\n 'text.disabled',\n 'background.paper',\n 'background.default',\n 'divider'\n ]);\n}","import type { Path } from '@iziui/toolkit/interface';\n\nimport { createMappedColors } from './createMappedColors';\n\nexport const colors = ['primary', 'secondary', 'error', 'warning', 'success', 'info', 'grey'] as const;\nexport const mappedColors = createMappedColors(colors);\n\nexport type Mode = 'light' | 'dark'\n\nexport type MappedColors = Path<PaletteBuilded>;\nexport type Colors = typeof colors[number];\n\nexport type Size = 'small' | 'medium' | 'large';\n\nexport interface Color {\n main: string;\n dark: string;\n light: string;\n opacity: string;\n contrast: string;\n}\n\nexport interface Palette {\n info: string;\n error: string;\n warning: string;\n success: string;\n primary: string;\n secondary: string;\n grey: string;\n text: {\n primary: string;\n secondary: string;\n disabled: string;\n };\n background: {\n paper: string;\n default: string;\n };\n divider: string;\n}\n\nexport type Spacing = number;\nexport type Shape = { radius: number; }\nexport type Typography = { family: string; url?: string; }\n\nexport interface PaletteBuilded extends Pick<Palette, 'text' | 'background' | 'divider'> {\n grey: Color;\n info: Color;\n error: Color;\n warning: Color;\n success: Color;\n primary: Color;\n secondary: Color;\n}\n\nexport interface Theme {\n mode: Mode;\n shape: Shape;\n palette: Palette;\n spacing: Spacing;\n typography: Typography;\n}\n\nexport interface ThemeOptions extends Omit<Partial<Theme>, 'palette'> {\n palette?: Partial<Palette>;\n}\nexport interface ThemeBuilded extends Omit<Theme, 'palette'> {\n palette: PaletteBuilded;\n}\n","import type { ThemeBuilded, Color } from '../Theme';\n\nfunction setColor(name: string, color: Color) {\n document.documentElement.style.setProperty(`--${name}`, color.main);\n document.documentElement.style.setProperty(`--${name}-light`, color.light);\n document.documentElement.style.setProperty(`--${name}-dark`, color.dark);\n document.documentElement.style.setProperty(`--${name}-contrast`, color.contrast);\n document.documentElement.style.setProperty(`--${name}-opacity`, color.opacity);\n}\n\nfunction ensureStylesheet(href: string) {\n if (document.querySelector(`link[href=\"${href}\"]`)) return;\n const link = document.createElement('link');\n link.rel = 'stylesheet';\n link.href = href;\n document.head.appendChild(link);\n}\n\nexport function applyTheme(theme: ThemeBuilded) {\n if (typeof window === 'undefined') { return; }\n\n const { palette, shape, spacing, typography } = theme;\n\n if (typography.url) { ensureStylesheet(typography.url); }\n\n // COLORS\n setColor('info', palette.info);\n setColor('error', palette.error);\n setColor('warning', palette.warning);\n setColor('success', palette.success);\n setColor('primary', palette.primary);\n setColor('secondary', palette.secondary);\n\n // GREY\n setColor('grey', palette.grey);\n\n // TYPOGRAPHY\n document.documentElement.style.setProperty('--typography', typography.family);\n\n // TEXT\n document.documentElement.style.setProperty('--text-primary', palette.text?.primary);\n document.documentElement.style.setProperty('--text-secondary', palette.text?.secondary);\n document.documentElement.style.setProperty('--text-disabled', palette.text?.disabled);\n\n // BACKGROUND\n document.documentElement.style.setProperty('--background-paper', palette.background?.paper);\n document.documentElement.style.setProperty('--background-default', palette.background?.default);\n\n // DIVIDER\n document.documentElement.style.setProperty('--divider', palette.divider);\n\n // SHAPE\n document.documentElement.style.setProperty('--radius', `${shape.radius}px`);\n\n // SPACING\n document.documentElement.style.setProperty('--spacing', `${spacing}px`);\n}","import type { Theme } from './Theme';\n\nexport const defaultSpacing: Theme['spacing'] = 8;\nexport const defaultShape: Theme['shape'] = { radius: 8 };\n\nexport const themeDefaultLight: Theme = {\n mode: 'light',\n palette: {\n info: '#72E4FC',\n error: '#FF5377',\n warning: '#FF9457',\n success: '#36E79B',\n primary: '#6C37F4',\n secondary: '#FB7185', //C026D3 // F97316 // FB7185 // F59E0B\n grey: '#545f6f',\n text: {\n primary: 'rgb(31, 41, 55)',\n secondary: 'rgb(75, 85, 99)',\n disabled: 'rgb(172, 172, 172)'\n },\n background: {\n paper: '#F9F8F9',\n default: '#FFF',\n },\n divider: 'rgba(0, 0, 0, 0.12)'\n },\n spacing: defaultSpacing,\n shape: defaultShape,\n typography: {\n family: 'Poppins',\n // eslint-disable-next-line\n url: 'https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500;1,600;1,700&display=swap'\n }\n};\n\nexport const themeDefaultDark: Theme = {\n mode: 'dark',\n palette: {\n info: '#72E4FC',\n error: '#FF5377',\n warning: '#FF9457',\n success: '#36E79B',\n primary: '#8b5dff',\n secondary: '#EBFF5E',\n grey: '#b3b3b3',\n text: {\n primary: 'rgba(255, 255, 255, 0.87)',\n secondary: 'rgba(255, 255, 255, 0.6)',\n disabled: 'rgba(255, 255, 255, 0.38)'\n },\n background: {\n paper: '#0D0225',\n default: '#30294E',\n },\n divider: 'rgba(255, 255, 255, 0.25)'\n },\n spacing: defaultSpacing,\n shape: defaultShape,\n typography: {\n family: 'Poppins',\n // eslint-disable-next-line\n url: 'https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500;1,600;1,700&display=swap'\n }\n};","import { generateSupportColors } from '../../utils';\nimport type { ThemeBuilded, ThemeOptions } from '../Theme';\nimport { themeDefaultDark, themeDefaultLight } from '../defaultTheme';\n\nconst SUPPORT_KEYS = [\n 'primary',\n 'secondary',\n 'error',\n 'warning',\n 'success',\n 'info',\n 'grey',\n] as const;\n\ntype SupportKey = (typeof SUPPORT_KEYS)[number];\n\nexport function createTheme(theme?: ThemeOptions): ThemeBuilded {\n const mode = theme?.mode ?? 'light';\n const ref = mode === 'dark' ? themeDefaultDark : themeDefaultLight;\n\n const paletteFromUser = theme?.palette ?? {};\n const paletteFromRef = ref.palette;\n\n const supportColors = Object.fromEntries(\n SUPPORT_KEYS.map((key) => [\n key,\n generateSupportColors(paletteFromUser[key] ?? paletteFromRef[key]),\n ])\n ) as Record<SupportKey, ThemeBuilded['palette'][SupportKey]>;\n\n return {\n mode,\n palette: {\n text: paletteFromUser.text ?? paletteFromRef.text,\n background: paletteFromUser.background ?? paletteFromRef.background,\n divider: paletteFromUser.divider ?? paletteFromRef.divider,\n ...supportColors,\n },\n shape: theme?.shape ?? ref.shape,\n spacing: theme?.spacing ?? ref.spacing,\n typography: theme?.typography ?? ref.typography,\n };\n}","import { createContext, useEffect, useMemo, useState, type PropsWithChildren } from 'react';\n\nimport type { ThemeBuilded } from '@iziui/core/theme';\nimport { createTheme, applyTheme, themeDefaultLight } from '@iziui/core/theme';\n\nimport '@iziui/styles/base/_base.scss';\n\nexport interface ThemeContextConfig {\n theme: ThemeBuilded;\n updateTheme: (theme: ThemeBuilded) => void;\n}\n\nexport const ThemeContext = createContext<ThemeContextConfig>({\n theme: createTheme(themeDefaultLight),\n updateTheme: () => { },\n});\n\ntype ThemeProviderProps = PropsWithChildren<{ theme: ThemeBuilded; }>\nexport default function ThemeProvider({ theme, children }: ThemeProviderProps) {\n const [_theme, setTheme] = useState<ThemeBuilded>(theme);\n\n const context = useMemo<ThemeContextConfig>(() => ({\n theme: _theme,\n updateTheme: (newTheme: ThemeBuilded) => updateTheme(newTheme),\n }), [theme, _theme]);\n\n useEffect(() => { applyTheme(_theme); }, [_theme]);\n\n const updateTheme = (newTheme: ThemeBuilded) => { setTheme(newTheme); };\n\n return (\n <ThemeContext.Provider value={context}>\n {children}\n </ThemeContext.Provider>\n );\n}\n\n","import { useContext } from 'react';\n\nimport { ThemeContext } from './ThemeProvider';\n\nexport default function useTheme() {\n return useContext(ThemeContext);\n}"],"names":["generateMappedColor","color","createMappedColors","_colors","acc","mapped","colors","setColor","name","ensureStylesheet","href","link","applyTheme","theme","palette","shape","spacing","typography","defaultSpacing","defaultShape","themeDefaultLight","themeDefaultDark","SUPPORT_KEYS","createTheme","mode","ref","paletteFromUser","paletteFromRef","supportColors","key","generateSupportColors","ThemeContext","createContext","ThemeProvider","children","_theme","setTheme","useState","context","useMemo","newTheme","updateTheme","useEffect","useTheme","useContext"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"useTheme-DsrjDJKC.cjs","sources":["../../../../core/src/theme/createMappedColors.ts","../../../../core/src/theme/Theme.ts","../../../../core/src/theme/applyTheme/applyTheme.ts","../../../../core/src/theme/defaultTheme.ts","../../../../core/src/theme/createTheme/createTheme.ts","../../src/theme/ThemeProvider.tsx","../../src/theme/useTheme.ts"],"sourcesContent":["import type { MappedColors, Colors, colors } from './Theme';\n\nfunction generateMappedColor(color: Colors): MappedColors[] {\n return [\n `${color}.main`,\n `${color}.dark`,\n `${color}.light`,\n `${color}.opacity`,\n `${color}.contrast`,\n ];\n}\n\nexport function createMappedColors(_colors: typeof colors): MappedColors[] {\n return _colors.reduce<MappedColors[]>((acc, color) => {\n const mapped = generateMappedColor(color);\n\n acc = [...acc, ...mapped];\n\n return acc;\n }, [\n 'text.primary',\n 'text.secondary',\n 'text.disabled',\n 'background.paper',\n 'background.default',\n 'divider'\n ]);\n}","import type { Path } from '@iziui/toolkit/interface';\n\nimport { createMappedColors } from './createMappedColors';\n\nexport const colors = ['primary', 'secondary', 'error', 'warning', 'success', 'info', 'grey'] as const;\nexport const mappedColors = createMappedColors(colors);\n\nexport type Mode = 'light' | 'dark'\n\nexport type MappedColors = Path<PaletteBuilded>;\nexport type Colors = typeof colors[number];\n\nexport type Size = 'small' | 'medium' | 'large';\n\nexport interface Color {\n main: string;\n dark: string;\n light: string;\n opacity: string;\n contrast: string;\n}\n\nexport interface Palette {\n info: string;\n error: string;\n warning: string;\n success: string;\n primary: string;\n secondary: string;\n grey: string;\n text: {\n primary: string;\n secondary: string;\n disabled: string;\n };\n background: {\n paper: string;\n default: string;\n };\n divider: string;\n}\n\nexport type Spacing = number;\nexport type Shape = { radius: number; }\nexport type Typography = { family: string; url?: string; }\n\nexport interface PaletteBuilded extends Pick<Palette, 'text' | 'background' | 'divider'> {\n grey: Color;\n info: Color;\n error: Color;\n warning: Color;\n success: Color;\n primary: Color;\n secondary: Color;\n}\n\nexport interface Theme {\n mode: Mode;\n shape: Shape;\n palette: Palette;\n spacing: Spacing;\n typography: Typography;\n}\n\nexport interface ThemeOptions extends Omit<Partial<Theme>, 'palette'> {\n palette?: Partial<Palette>;\n}\nexport interface ThemeBuilded extends Omit<Theme, 'palette'> {\n palette: PaletteBuilded;\n}\n","import type { ThemeBuilded, Color } from '../Theme';\n\nfunction setColor(name: string, color: Color) {\n document.documentElement.style.setProperty(`--${name}`, color.main);\n document.documentElement.style.setProperty(`--${name}-light`, color.light);\n document.documentElement.style.setProperty(`--${name}-dark`, color.dark);\n document.documentElement.style.setProperty(`--${name}-contrast`, color.contrast);\n document.documentElement.style.setProperty(`--${name}-opacity`, color.opacity);\n}\n\nfunction ensureStylesheet(href: string) {\n if (document.querySelector(`link[href=\"${href}\"]`)) return;\n const link = document.createElement('link');\n link.rel = 'stylesheet';\n link.href = href;\n document.head.appendChild(link);\n}\n\nexport function applyTheme(theme: ThemeBuilded) {\n if (typeof window === 'undefined') { return; }\n\n const { palette, shape, spacing, typography } = theme;\n\n if (typography.url) { ensureStylesheet(typography.url); }\n\n // COLORS\n setColor('info', palette.info);\n setColor('error', palette.error);\n setColor('warning', palette.warning);\n setColor('success', palette.success);\n setColor('primary', palette.primary);\n setColor('secondary', palette.secondary);\n\n // GREY\n setColor('grey', palette.grey);\n\n // TYPOGRAPHY\n document.documentElement.style.setProperty('--typography', typography.family);\n\n // TEXT\n document.documentElement.style.setProperty('--text-primary', palette.text?.primary);\n document.documentElement.style.setProperty('--text-secondary', palette.text?.secondary);\n document.documentElement.style.setProperty('--text-disabled', palette.text?.disabled);\n\n // BACKGROUND\n document.documentElement.style.setProperty('--background-paper', palette.background?.paper);\n document.documentElement.style.setProperty('--background-default', palette.background?.default);\n\n // DIVIDER\n document.documentElement.style.setProperty('--divider', palette.divider);\n\n // SHAPE\n document.documentElement.style.setProperty('--radius', `${shape.radius}px`);\n\n // SPACING\n document.documentElement.style.setProperty('--spacing', `${spacing}px`);\n}","import type { Theme } from './Theme';\n\nexport const defaultSpacing: Theme['spacing'] = 8;\nexport const defaultShape: Theme['shape'] = { radius: 8 };\n\nexport const themeDefaultLight: Theme = {\n mode: 'light',\n palette: {\n info: '#72E4FC',\n error: '#FF5377',\n warning: '#FF9457',\n success: '#36E79B',\n primary: '#6C37F4',\n secondary: '#FB7185', //C026D3 // F97316 // FB7185 // F59E0B\n grey: '#545f6f',\n text: {\n primary: 'rgb(31, 41, 55)',\n secondary: 'rgb(75, 85, 99)',\n disabled: 'rgb(172, 172, 172)'\n },\n background: {\n paper: '#F9F8F9',\n default: '#FFF',\n },\n divider: 'rgba(0, 0, 0, 0.12)'\n },\n spacing: defaultSpacing,\n shape: defaultShape,\n typography: {\n family: 'Poppins',\n // eslint-disable-next-line\n url: 'https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500;1,600;1,700&display=swap'\n }\n};\n\nexport const themeDefaultDark: Theme = {\n mode: 'dark',\n palette: {\n info: '#72E4FC',\n error: '#FF5377',\n warning: '#FF9457',\n success: '#36E79B',\n primary: '#8b5dff',\n secondary: '#EBFF5E',\n grey: '#2A2A2A',\n text: {\n primary: 'rgba(255, 255, 255, 0.87)',\n secondary: 'rgba(255, 255, 255, 0.6)',\n disabled: 'rgba(255, 255, 255, 0.38)'\n },\n background: {\n paper: '#0D0225',\n default: '#30294E',\n },\n divider: 'rgba(242, 242, 242, 0.12)'\n },\n spacing: defaultSpacing,\n shape: defaultShape,\n typography: {\n family: 'Poppins',\n // eslint-disable-next-line\n url: 'https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500;1,600;1,700&display=swap'\n }\n};","import { generateSupportColors } from '../../utils';\nimport type { ThemeBuilded, ThemeOptions } from '../Theme';\nimport { themeDefaultDark, themeDefaultLight } from '../defaultTheme';\n\nconst SUPPORT_KEYS = [\n 'primary',\n 'secondary',\n 'error',\n 'warning',\n 'success',\n 'info',\n 'grey',\n] as const;\n\ntype SupportKey = (typeof SUPPORT_KEYS)[number];\n\nexport function createTheme(theme?: ThemeOptions): ThemeBuilded {\n const mode = theme?.mode ?? 'light';\n const ref = mode === 'dark' ? themeDefaultDark : themeDefaultLight;\n\n const paletteFromUser = theme?.palette ?? {};\n const paletteFromRef = ref.palette;\n\n const supportColors = Object.fromEntries(\n SUPPORT_KEYS.map((key) => [\n key,\n generateSupportColors(paletteFromUser[key] ?? paletteFromRef[key]),\n ])\n ) as Record<SupportKey, ThemeBuilded['palette'][SupportKey]>;\n\n return {\n mode,\n palette: {\n text: paletteFromUser.text ?? paletteFromRef.text,\n background: paletteFromUser.background ?? paletteFromRef.background,\n divider: paletteFromUser.divider ?? paletteFromRef.divider,\n ...supportColors,\n },\n shape: theme?.shape ?? ref.shape,\n spacing: theme?.spacing ?? ref.spacing,\n typography: theme?.typography ?? ref.typography,\n };\n}","import { createContext, useEffect, useMemo, useState, type PropsWithChildren } from 'react';\n\nimport type { ThemeBuilded } from '@iziui/core/theme';\nimport { createTheme, applyTheme, themeDefaultLight } from '@iziui/core/theme';\n\nimport '@iziui/styles/base/_base.scss';\n\nexport interface ThemeContextConfig {\n theme: ThemeBuilded;\n updateTheme: (theme: ThemeBuilded) => void;\n}\n\nexport const ThemeContext = createContext<ThemeContextConfig>({\n theme: createTheme(themeDefaultLight),\n updateTheme: () => { },\n});\n\ntype ThemeProviderProps = PropsWithChildren<{ theme: ThemeBuilded; }>\nexport default function ThemeProvider({ theme, children }: ThemeProviderProps) {\n const [_theme, setTheme] = useState<ThemeBuilded>(theme);\n\n const context = useMemo<ThemeContextConfig>(() => ({\n theme: _theme,\n updateTheme: (newTheme: ThemeBuilded) => updateTheme(newTheme),\n }), [theme, _theme]);\n\n useEffect(() => { applyTheme(_theme); }, [_theme]);\n\n const updateTheme = (newTheme: ThemeBuilded) => { setTheme(newTheme); };\n\n return (\n <ThemeContext.Provider value={context}>\n {children}\n </ThemeContext.Provider>\n );\n}\n\n","import { useContext } from 'react';\n\nimport { ThemeContext } from './ThemeProvider';\n\nexport default function useTheme() {\n return useContext(ThemeContext);\n}"],"names":["generateMappedColor","color","createMappedColors","_colors","acc","mapped","colors","setColor","name","ensureStylesheet","href","link","applyTheme","theme","palette","shape","spacing","typography","defaultSpacing","defaultShape","themeDefaultLight","themeDefaultDark","SUPPORT_KEYS","createTheme","mode","ref","paletteFromUser","paletteFromRef","supportColors","key","generateSupportColors","ThemeContext","createContext","ThemeProvider","children","_theme","setTheme","useState","context","useMemo","newTheme","updateTheme","useEffect","useTheme","useContext"],"mappings":"uHAEA,SAASA,EAAoBC,EAA+B,CAC1D,MAAO,CACL,GAAGA,CAAK,QACR,GAAGA,CAAK,QACR,GAAGA,CAAK,SACR,GAAGA,CAAK,WACR,GAAGA,CAAK,WAAA,CAEZ,CAEO,SAASC,EAAmBC,EAAwC,CACzE,OAAOA,EAAQ,OAAuB,CAACC,EAAKH,IAAU,CACpD,MAAMI,EAASL,EAAoBC,CAAK,EAExC,OAAAG,EAAM,CAAC,GAAGA,EAAK,GAAGC,CAAM,EAEjBD,CACT,EAAG,CACD,eACA,iBACA,gBACA,mBACA,qBACA,SAAA,CACD,CACH,CCvBO,MAAME,EAAS,CAAC,UAAW,YAAa,QAAS,UAAW,UAAW,OAAQ,MAAM,EAChEJ,EAAmBI,CAAM,ECHrD,SAASC,EAASC,EAAcP,EAAc,CAC5C,SAAS,gBAAgB,MAAM,YAAY,KAAKO,CAAI,GAAIP,EAAM,IAAI,EAClE,SAAS,gBAAgB,MAAM,YAAY,KAAKO,CAAI,SAAUP,EAAM,KAAK,EACzE,SAAS,gBAAgB,MAAM,YAAY,KAAKO,CAAI,QAASP,EAAM,IAAI,EACvE,SAAS,gBAAgB,MAAM,YAAY,KAAKO,CAAI,YAAaP,EAAM,QAAQ,EAC/E,SAAS,gBAAgB,MAAM,YAAY,KAAKO,CAAI,WAAYP,EAAM,OAAO,CAC/E,CAEA,SAASQ,EAAiBC,EAAc,CACtC,GAAI,SAAS,cAAc,cAAcA,CAAI,IAAI,EAAG,OACpD,MAAMC,EAAO,SAAS,cAAc,MAAM,EAC1CA,EAAK,IAAM,aACXA,EAAK,KAAOD,EACZ,SAAS,KAAK,YAAYC,CAAI,CAChC,CAEO,SAASC,EAAWC,EAAqB,CAC9C,GAAI,OAAO,OAAW,IAAe,OAErC,KAAM,CAAE,QAAAC,EAAS,MAAAC,EAAO,QAAAC,EAAS,WAAAC,GAAeJ,EAE5CI,EAAW,KAAOR,EAAiBQ,EAAW,GAAG,EAGrDV,EAAS,OAAQO,EAAQ,IAAI,EAC7BP,EAAS,QAASO,EAAQ,KAAK,EAC/BP,EAAS,UAAWO,EAAQ,OAAO,EACnCP,EAAS,UAAWO,EAAQ,OAAO,EACnCP,EAAS,UAAWO,EAAQ,OAAO,EACnCP,EAAS,YAAaO,EAAQ,SAAS,EAGvCP,EAAS,OAAQO,EAAQ,IAAI,EAG7B,SAAS,gBAAgB,MAAM,YAAY,eAAgBG,EAAW,MAAM,EAG5E,SAAS,gBAAgB,MAAM,YAAY,iBAAkBH,EAAQ,MAAM,OAAO,EAClF,SAAS,gBAAgB,MAAM,YAAY,mBAAoBA,EAAQ,MAAM,SAAS,EACtF,SAAS,gBAAgB,MAAM,YAAY,kBAAmBA,EAAQ,MAAM,QAAQ,EAGpF,SAAS,gBAAgB,MAAM,YAAY,qBAAsBA,EAAQ,YAAY,KAAK,EAC1F,SAAS,gBAAgB,MAAM,YAAY,uBAAwBA,EAAQ,YAAY,OAAO,EAG9F,SAAS,gBAAgB,MAAM,YAAY,YAAaA,EAAQ,OAAO,EAGvE,SAAS,gBAAgB,MAAM,YAAY,WAAY,GAAGC,EAAM,MAAM,IAAI,EAG1E,SAAS,gBAAgB,MAAM,YAAY,YAAa,GAAGC,CAAO,IAAI,CACxE,CCtDO,MAAME,EAAmC,EACnCC,EAA+B,CAAE,OAAQ,CAAA,EAEzCC,EAA2B,CACtC,KAAM,QACN,QAAS,CACP,KAAM,UACN,MAAO,UACP,QAAS,UACT,QAAS,UACT,QAAS,UACT,UAAW,UACX,KAAM,UACN,KAAM,CACJ,QAAS,kBACT,UAAW,kBACX,SAAU,oBAAA,EAEZ,WAAY,CACV,MAAO,UACP,QAAS,MAAA,EAEX,QAAS,qBAAA,EAEX,QAASF,EACT,MAAOC,EACP,WAAY,CACV,OAAQ,UAER,IAAK,yHAAA,CAET,EAEaE,EAA0B,CAErC,QAAS,CACP,KAAM,UACN,MAAO,UACP,QAAS,UACT,QAAS,UACT,QAAS,UACT,UAAW,UACX,KAAM,UACN,KAAM,CACJ,QAAS,4BACT,UAAW,2BACX,SAAU,2BAAA,EAEZ,WAAY,CACV,MAAO,UACP,QAAS,SAAA,EAEX,QAAS,2BAAA,EAEX,QAASH,EACT,MAAOC,EACP,WAAY,CACV,OAAQ,UAER,IAAK,yHAAA,CAET,EC3DMG,EAAe,CACnB,UACA,YACA,QACA,UACA,UACA,OACA,MACF,EAIO,SAASC,EAAYV,EAAoC,CAC9D,MAAMW,EAAOX,GAAO,MAAQ,QACtBY,EAAMD,IAAS,OAASH,EAAmBD,EAE3CM,EAAkBb,GAAO,SAAW,CAAA,EACpCc,EAAiBF,EAAI,QAErBG,EAAgB,OAAO,YAC3BN,EAAa,IAAKO,GAAQ,CACxBA,EACAC,EAAAA,sBAAsBJ,EAAgBG,CAAG,GAAKF,EAAeE,CAAG,CAAC,CAAA,CAClE,CAAA,EAGH,MAAO,CACL,KAAAL,EACA,QAAS,CACP,KAAME,EAAgB,MAAQC,EAAe,KAC7C,WAAYD,EAAgB,YAAcC,EAAe,WACzD,QAASD,EAAgB,SAAWC,EAAe,QACnD,GAAGC,CAAA,EAEL,MAAOf,GAAO,OAASY,EAAI,MAC3B,QAASZ,GAAO,SAAWY,EAAI,QAC/B,WAAYZ,GAAO,YAAcY,EAAI,UAAA,CAEzC,CC9BO,MAAMM,EAAeC,EAAAA,cAAkC,CAC5D,MAAOT,EAAYH,CAAiB,EACpC,YAAa,IAAM,CAAE,CACvB,CAAC,EAGD,SAAwBa,EAAc,CAAE,MAAApB,EAAO,SAAAqB,GAAgC,CAC7E,KAAM,CAACC,EAAQC,CAAQ,EAAIC,EAAAA,SAAuBxB,CAAK,EAEjDyB,EAAUC,EAAAA,QAA4B,KAAO,CACjD,MAAOJ,EACP,YAAcK,GAA2BC,EAAYD,CAAQ,CAAA,GAC3D,CAAC3B,EAAOsB,CAAM,CAAC,EAEnBO,EAAAA,UAAU,IAAM,CAAE9B,EAAWuB,CAAM,CAAG,EAAG,CAACA,CAAM,CAAC,EAEjD,MAAMM,EAAeD,GAA2B,CAAEJ,EAASI,CAAQ,CAAG,EAEtE,aACGT,EAAa,SAAb,CAAsB,MAAOO,EAC3B,SAAAJ,EACH,CAEJ,CC/BA,SAAwBS,GAAW,CACjC,OAAOC,EAAAA,WAAWb,CAAY,CAChC"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("../../chunks/Alert-
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("../../chunks/Alert-CUgp08gU.cjs");require("react/jsx-runtime");require("react");require("../../chunks/index-DYxwT4uW.cjs");require("../../chunks/joinClass-Jk3EszKD.cjs");require("../../chunks/useTheme-DsrjDJKC.cjs");require("../../chunks/generateSupportColors-CTMoGhDf.cjs");require("../../chunks/Stack-B_lU0ez7.cjs");require("../../chunks/createComponent-Dkt68kvT.cjs");require("../../chunks/Typography-DW57lh3e.cjs");require("../../chunks/convertPathToColor-D8eBpd_D.cjs");require("../../chunks/ButtonIcon-BMOZPxpN.cjs");require("../../chunks/Ripple-Dy4i91j1.cjs");require("../../chunks/Icon-CIrgQex7.cjs");exports.default=e.Alert;
|
|
2
2
|
//# sourceMappingURL=index.cjs.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{A as b}from"../../chunks/Alert-
|
|
1
|
+
import{A as b}from"../../chunks/Alert-mOXPwc3e.js";import"react/jsx-runtime";import"react";import"../../chunks/index-CZ41y9Hn.js";import"../../chunks/joinClass-anSpaauN.js";import"../../chunks/useTheme-BYuNiCiH.js";import"../../chunks/generateSupportColors-BN5t8dA-.js";import"../../chunks/Stack-Deow48Th.js";import"../../chunks/createComponent-CovqNaAJ.js";import"../../chunks/Typography-BrJZyxiT.js";import"../../chunks/convertPathToColor-DtOjH4ZP.js";import"../../chunks/ButtonIcon-CYO1Crb-.js";import"../../chunks/Ripple-Bq9bxg4k.js";import"../../chunks/Icon-imOBrsbL.js";export{b as default};
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const i=require("react/jsx-runtime"),e=require("../../chunks/index-DYxwT4uW.cjs"),h=require("../../chunks/joinClass-Jk3EszKD.cjs"),l=require("../../chunks/createComponent-Dkt68kvT.cjs"),x=require("../../chunks/Ripple-Dy4i91j1.cjs"),v=require("../../chunks/Icon-CIrgQex7.cjs"),y=require("../../chunks/Typography-DW57lh3e.cjs");require("../../chunks/useTheme-DsrjDJKC.cjs");require("react");require("../../chunks/generateSupportColors-CTMoGhDf.cjs");require("../../chunks/convertPathToColor-D8eBpd_D.cjs");function g({src:a,alt:u,name:n,size:r=40,variant:c="circular",color:s="primary",icon:o,...t}){const f=h.joinClass(`${e.prefix}-avatar`,`${e.prefix}-avatar--${c}`,`${e.prefix}-avatar--${s}`,a&&`${e.prefix}-avatar--image`,n&&`${e.prefix}-avatar--name`,!a&&!n||o&&`${e.prefix}-avatar--icon`,t.onClick&&`${e.prefix}-avatar--clickable`,t.className),d=()=>a?i.jsx("img",{src:a,alt:u,width:r,height:r,sizes:"100vw",loading:"lazy",style:{width:"100%",height:"auto"}}):n?i.jsx(y.Typography,{style:{fontSize:r/2,color:"currentColor"},children:l.getInitials(n)}):o||i.jsx(v.Icon,{name:"user",size:r/1.6,style:{color:"currentColor"}});return i.jsxs("div",{...t,style:{width:r,height:r,...t.style},className:f,children:[d(),t.children,t.onClick&&i.jsx(x.Ripple,{})]})}const q=l.createComponent(g);exports.default=q;
|
|
2
2
|
//# sourceMappingURL=index.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.cjs","sources":["
|
|
1
|
+
{"version":3,"file":"index.cjs","sources":["../../../src/display/Avatar/Avatar.tsx"],"sourcesContent":["import { HTMLAttributes } from 'react';\n\nimport { prefix } from '@iziui/tokens/web/js';\n\nimport { joinClass } from '@iziui/core/utils/joinClass';\nimport type { Colors } from '@iziui/core/theme';\n\nimport { getInitials } from '@iziui/toolkit/string';\n\nimport Ripple from '@/actions/Ripple';\nimport createComponent from '@/core/createComponent';\n\nimport Icon from '../Icon';\nimport Typography from '../Typography';\n\nimport '@iziui/styles/components/Avatar.scss';\n\ninterface AvatarProps extends HTMLAttributes<HTMLElement> {\n alt?: string;\n src?: string;\n name?: string;\n size?: number;\n color?: Colors;\n variant?: 'rounded' | 'circular';\n icon?: React.JSX.Element;\n}\nfunction Avatar({\n src,\n alt,\n name,\n size = 40,\n variant = 'circular',\n color = 'primary',\n icon,\n ...props\n}: AvatarProps) {\n const className = joinClass(\n `${prefix}-avatar`,\n `${prefix}-avatar--${variant}`,\n `${prefix}-avatar--${color}`,\n src && `${prefix}-avatar--image`,\n name && `${prefix}-avatar--name`,\n (!src && !name) || icon && `${prefix}-avatar--icon`,\n props.onClick && `${prefix}-avatar--clickable`,\n props.className\n );\n\n const content = () => {\n if (src) {\n return (\n <img\n src={src}\n alt={alt}\n width={size}\n height={size}\n sizes=\"100vw\"\n loading=\"lazy\"\n style={{ width: '100%', height: 'auto' }}\n />\n );\n }\n if (name) {\n return (\n <Typography\n style={{\n fontSize: size / 2,\n color: 'currentColor'\n }}\n >\n {getInitials(name)}\n </Typography>\n );\n }\n\n if (icon) { return icon; }\n\n return (\n <Icon name=\"user\" size={size / 1.6} style={{ color: 'currentColor' }} />\n );\n };\n\n return (\n <div {...props} style={{ width: size, height: size, ...props.style }} className={className}>\n {content()}\n {props.children}\n {props.onClick && <Ripple />}\n </div>\n );\n}\n\nexport default createComponent(Avatar);"],"names":["Avatar","src","alt","name","size","variant","color","icon","props","className","joinClass","prefix","content","jsx","Typography","Icon","jsxs","Ripple","Avatar_default","createComponent"],"mappings":"omBA0BA,SAASA,EAAO,CACd,IAAAC,EACA,IAAAC,EACA,KAAAC,EACA,KAAAC,EAAO,GACP,QAAAC,EAAU,WACV,MAAAC,EAAQ,UACR,KAAAC,EACA,GAAGC,CACL,EAAgB,CACd,MAAMC,EAAYC,EAAAA,UAChB,GAAGC,EAAAA,MAAM,UACT,GAAGA,EAAAA,MAAM,YAAYN,CAAO,GAC5B,GAAGM,EAAAA,MAAM,YAAYL,CAAK,GAC1BL,GAAO,GAAGU,EAAAA,MAAM,iBAChBR,GAAQ,GAAGQ,EAAAA,MAAM,gBAChB,CAACV,GAAO,CAACE,GAASI,GAAQ,GAAGI,EAAAA,MAAM,gBACpCH,EAAM,SAAW,GAAGG,EAAAA,MAAM,qBAC1BH,EAAM,SAAA,EAGFI,EAAU,IACVX,EAEAY,EAAAA,IAAC,MAAA,CACC,IAAAZ,EACA,IAAAC,EACA,MAAOE,EACP,OAAQA,EACR,MAAM,QACN,QAAQ,OACR,MAAO,CAAE,MAAO,OAAQ,OAAQ,MAAA,CAAO,CAAA,EAIzCD,EAEAU,EAAAA,IAACC,EAAAA,WAAA,CACC,MAAO,CACL,SAAUV,EAAO,EACjB,MAAO,cAAA,EAGR,uBAAYD,CAAI,CAAA,CAAA,EAKnBI,GAGFM,EAAAA,IAACE,EAAAA,KAAA,CAAK,KAAK,OAAO,KAAMX,EAAO,IAAK,MAAO,CAAE,MAAO,cAAA,CAAe,CAAG,EAI1E,OACEY,EAAAA,KAAC,MAAA,CAAK,GAAGR,EAAO,MAAO,CAAE,MAAOJ,EAAM,OAAQA,EAAM,GAAGI,EAAM,KAAA,EAAS,UAAAC,EACnE,SAAA,CAAAG,EAAA,EACAJ,EAAM,SACNA,EAAM,SAAWK,MAACI,EAAAA,OAAA,CAAA,CAAO,CAAA,EAC5B,CAEJ,CAEA,MAAAC,EAAeC,EAAAA,gBAAgBnB,CAAM"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{jsxs as h,jsx as
|
|
1
|
+
import{jsxs as h,jsx as e}from"react/jsx-runtime";import{p as t}from"../../chunks/index-CZ41y9Hn.js";import{j as u}from"../../chunks/joinClass-anSpaauN.js";import{c as v,g as d}from"../../chunks/createComponent-CovqNaAJ.js";import{R as p}from"../../chunks/Ripple-Bq9bxg4k.js";import{I as g}from"../../chunks/Icon-imOBrsbL.js";import{T as y}from"../../chunks/Typography-BrJZyxiT.js";import"../../chunks/useTheme-BYuNiCiH.js";import"react";import"../../chunks/generateSupportColors-BN5t8dA-.js";import"../../chunks/convertPathToColor-DtOjH4ZP.js";function $({src:o,alt:n,name:i,size:a=40,variant:m="circular",color:c="primary",icon:l,...r}){const s=u(`${t}-avatar`,`${t}-avatar--${m}`,`${t}-avatar--${c}`,o&&`${t}-avatar--image`,i&&`${t}-avatar--name`,!o&&!i||l&&`${t}-avatar--icon`,r.onClick&&`${t}-avatar--clickable`,r.className),f=()=>o?e("img",{src:o,alt:n,width:a,height:a,sizes:"100vw",loading:"lazy",style:{width:"100%",height:"auto"}}):i?e(y,{style:{fontSize:a/2,color:"currentColor"},children:d(i)}):l||e(g,{name:"user",size:a/1.6,style:{color:"currentColor"}});return h("div",{...r,style:{width:a,height:a,...r.style},className:s,children:[f(),r.children,r.onClick&&e(p,{})]})}const S=v($);export{S as default};
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../../src/display/Avatar/Avatar.tsx"],"sourcesContent":["import { HTMLAttributes } from 'react';\n\nimport { prefix } from '@iziui/tokens/web/js';\n\nimport { joinClass } from '@iziui/core/utils/joinClass';\nimport type { Colors } from '@iziui/core/theme';\n\nimport { getInitials } from '@iziui/toolkit/string';\n\nimport Ripple from '@/actions/Ripple';\nimport createComponent from '@/core/createComponent';\n\nimport Icon from '../Icon';\nimport Typography from '../Typography';\n\nimport '@iziui/styles/components/Avatar.scss';\n\ninterface AvatarProps extends HTMLAttributes<HTMLElement> {\n alt?: string;\n src?: string;\n name?: string;\n size?: number;\n color?: Colors;\n variant?: 'rounded' | 'circular';\n icon?: React.JSX.Element;\n}\nfunction Avatar({\n src,\n alt,\n name,\n size = 40,\n variant = 'circular',\n color = 'primary',\n icon,\n ...props\n}: AvatarProps) {\n const className = joinClass(\n `${prefix}-avatar`,\n `${prefix}-avatar--${variant}`,\n `${prefix}-avatar--${color}`,\n src && `${prefix}-avatar--image`,\n name && `${prefix}-avatar--name`,\n (!src && !name) || icon && `${prefix}-avatar--icon`,\n props.onClick && `${prefix}-avatar--clickable`,\n props.className\n );\n\n const content = () => {\n if (src) {\n return (\n <img\n src={src}\n alt={alt}\n width={size}\n height={size}\n sizes=\"100vw\"\n loading=\"lazy\"\n style={{ width: '100%', height: 'auto' }}\n />\n );\n }\n if (name) {\n return (\n <Typography\n style={{\n fontSize: size / 2,\n color: 'currentColor'\n }}\n >\n {getInitials(name)}\n </Typography>\n );\n }\n\n if (icon) { return icon; }\n\n return (\n <Icon name=\"user\" size={size / 1.6} style={{ color: 'currentColor' }} />\n );\n };\n\n return (\n <div {...props} style={{ width: size, height: size, ...props.style }} className={className}>\n {content()}\n {props.children}\n {props.onClick && <Ripple />}\n </div>\n );\n}\n\nexport default createComponent(Avatar);"],"names":["Avatar","src","alt","name","size","variant","color","icon","props","className","joinClass","prefix","content","jsx","Typography","Icon","jsxs","Ripple","Avatar_default","createComponent"],"mappings":"iiBA0BA,SAASA,EAAO,CACd,IAAAC,EACA,IAAAC,EACA,KAAAC,EACA,KAAAC,EAAO,GACP,QAAAC,EAAU,WACV,MAAAC,EAAQ,UACR,KAAAC,EACA,GAAGC,CACL,EAAgB,CACd,MAAMC,EAAYC,EAChB,GAAGC,CAAM,UACT,GAAGA,CAAM,YAAYN,CAAO,GAC5B,GAAGM,CAAM,YAAYL,CAAK,GAC1BL,GAAO,GAAGU,CAAM,iBAChBR,GAAQ,GAAGQ,CAAM,gBAChB,CAACV,GAAO,CAACE,GAASI,GAAQ,GAAGI,CAAM,gBACpCH,EAAM,SAAW,GAAGG,CAAM,qBAC1BH,EAAM,SAAA,EAGFI,EAAU,IACVX,EAEAY,EAAC,MAAA,CACC,IAAAZ,EACA,IAAAC,EACA,MAAOE,EACP,OAAQA,EACR,MAAM,QACN,QAAQ,OACR,MAAO,CAAE,MAAO,OAAQ,OAAQ,MAAA,CAAO,CAAA,EAIzCD,EAEAU,EAACC,EAAA,CACC,MAAO,CACL,SAAUV,EAAO,EACjB,MAAO,cAAA,EAGR,WAAYD,CAAI,CAAA,CAAA,EAKnBI,GAGFM,EAACE,EAAA,CAAK,KAAK,OAAO,KAAMX,EAAO,IAAK,MAAO,CAAE,MAAO,cAAA,CAAe,CAAG,EAI1E,OACEY,EAAC,MAAA,CAAK,GAAGR,EAAO,MAAO,CAAE,MAAOJ,EAAM,OAAQA,EAAM,GAAGI,EAAM,KAAA,EAAS,UAAAC,EACnE,SAAA,CAAAG,EAAA,EACAJ,EAAM,SACNA,EAAM,SAAWK,EAACI,EAAA,CAAA,CAAO,CAAA,EAC5B,CAEJ,CAEA,MAAAC,EAAeC,EAAgBnB,CAAM"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("../../chunks/Box-
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("../../chunks/Box-DdpIV_Bl.cjs");require("react/jsx-runtime");require("react");require("../../chunks/createComponent-Dkt68kvT.cjs");require("../../chunks/index-DYxwT4uW.cjs");require("../../chunks/useTheme-DsrjDJKC.cjs");require("../../chunks/generateSupportColors-CTMoGhDf.cjs");exports.default=e.Box;
|
|
2
2
|
//# sourceMappingURL=index.cjs.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{B as f}from"../../chunks/Box-
|
|
1
|
+
import{B as f}from"../../chunks/Box-O2jw08Hf.js";import"react/jsx-runtime";import"react";import"../../chunks/createComponent-CovqNaAJ.js";import"../../chunks/index-CZ41y9Hn.js";import"../../chunks/useTheme-BYuNiCiH.js";import"../../chunks/generateSupportColors-BN5t8dA-.js";export{f as default};
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const n=require("react/jsx-runtime"),m=require("react"),e=require("../../chunks/index-DYxwT4uW.cjs"),i=require("../../chunks/joinClass-Jk3EszKD.cjs"),d=require("../../chunks/Ripple-Dy4i91j1.cjs"),_=require("../../chunks/createComponent-
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const n=require("react/jsx-runtime"),m=require("react"),e=require("../../chunks/index-DYxwT4uW.cjs"),i=require("../../chunks/joinClass-Jk3EszKD.cjs"),d=require("../../chunks/Ripple-Dy4i91j1.cjs"),_=require("../../chunks/createComponent-Dkt68kvT.cjs");require("../../chunks/useTheme-DsrjDJKC.cjs");require("../../chunks/generateSupportColors-CTMoGhDf.cjs");function j({size:u="medium",color:r="primary",variant:p="contained",startIcon:c,endIcon:a,loading:s,children:$,...o}){const f=i.joinClass(`${e.prefix}-button`,`${e.prefix}-button--${u}`,`${e.prefix}-button--${r}`,`${e.prefix}-button--${r}--${p}`,o.className),l=(t,b)=>m.cloneElement(t,{color:`${r}.contrast`,className:i.joinClass(t.props.className,`${e.prefix}-button__icon`,`${e.prefix}-button__icon--${b}`)}),x=t=>m.cloneElement(t,{className:i.joinClass(t.props.className,`${e.prefix}-button__loading`,`${e.prefix}-button__loading--${u}`),size:"1.1rem"});return n.jsxs("button",{...o,className:f,onClick:t=>!s&&o.onClick?.(t),children:[s?x(s):n.jsxs(n.Fragment,{children:[c&&l(c,"left"),$,a&&l(a,"right")]}),n.jsx(d.Ripple,{})]})}const q=_.createComponent(j);exports.default=q;
|
|
2
2
|
//# sourceMappingURL=index.cjs.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{jsxs as u,Fragment as d,jsx as _}from"react/jsx-runtime";import{cloneElement as l}from"react";import{p as t}from"../../chunks/index-CZ41y9Hn.js";import{j as m}from"../../chunks/joinClass-anSpaauN.js";import{R as N}from"../../chunks/Ripple-Bq9bxg4k.js";import{c as j}from"../../chunks/createComponent-
|
|
1
|
+
import{jsxs as u,Fragment as d,jsx as _}from"react/jsx-runtime";import{cloneElement as l}from"react";import{p as t}from"../../chunks/index-CZ41y9Hn.js";import{j as m}from"../../chunks/joinClass-anSpaauN.js";import{R as N}from"../../chunks/Ripple-Bq9bxg4k.js";import{c as j}from"../../chunks/createComponent-CovqNaAJ.js";import"../../chunks/useTheme-BYuNiCiH.js";import"../../chunks/generateSupportColors-BN5t8dA-.js";function x({size:s="medium",color:n="primary",variant:p="contained",startIcon:a,endIcon:i,loading:r,children:$,...e}){const f=m(`${t}-button`,`${t}-button--${s}`,`${t}-button--${n}`,`${t}-button--${n}--${p}`,e.className),c=(o,b)=>l(o,{color:`${n}.contrast`,className:m(o.props.className,`${t}-button__icon`,`${t}-button__icon--${b}`)});return u("button",{...e,className:f,onClick:o=>!r&&e.onClick?.(o),children:[r?(o=>l(o,{className:m(o.props.className,`${t}-button__loading`,`${t}-button__loading--${s}`),size:"1.1rem"}))(r):u(d,{children:[a&&c(a,"left"),$,i&&c(i,"right")]}),_(N,{})]})}const F=j(x);export{F as default};
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("../../chunks/ButtonIcon-
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("../../chunks/ButtonIcon-BMOZPxpN.cjs");require("react/jsx-runtime");require("react");require("../../chunks/index-DYxwT4uW.cjs");require("../../chunks/joinClass-Jk3EszKD.cjs");require("../../chunks/Ripple-Dy4i91j1.cjs");require("../../chunks/createComponent-Dkt68kvT.cjs");require("../../chunks/useTheme-DsrjDJKC.cjs");require("../../chunks/generateSupportColors-CTMoGhDf.cjs");exports.default=e.ButtonIcon;
|
|
2
2
|
//# sourceMappingURL=index.cjs.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{B as l}from"../../chunks/ButtonIcon-
|
|
1
|
+
import{B as l}from"../../chunks/ButtonIcon-CYO1Crb-.js";import"react/jsx-runtime";import"react";import"../../chunks/index-CZ41y9Hn.js";import"../../chunks/joinClass-anSpaauN.js";import"../../chunks/Ripple-Bq9bxg4k.js";import"../../chunks/createComponent-CovqNaAJ.js";import"../../chunks/useTheme-BYuNiCiH.js";import"../../chunks/generateSupportColors-BN5t8dA-.js";export{l as default};
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../../chunks/Card-
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../../chunks/Card-DtjP8NP7.cjs"),r=require("../../chunks/CardContent-BqqU9iwO.cjs");require("react/jsx-runtime");require("../../chunks/index-DYxwT4uW.cjs");require("../../chunks/joinClass-Jk3EszKD.cjs");require("../../chunks/Ripple-Dy4i91j1.cjs");require("react");require("../../chunks/createComponent-Dkt68kvT.cjs");require("../../chunks/useTheme-DsrjDJKC.cjs");require("../../chunks/generateSupportColors-CTMoGhDf.cjs");exports.Card=e.Card;exports.CardContent=r.CardContent;
|
|
2
2
|
//# sourceMappingURL=index.cjs.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{C as f}from"../../chunks/Card-
|
|
1
|
+
import{C as f}from"../../chunks/Card-D_RFnUk2.js";import{C as s}from"../../chunks/CardContent-BsSfxSQH.js";import"react/jsx-runtime";import"../../chunks/index-CZ41y9Hn.js";import"../../chunks/joinClass-anSpaauN.js";import"../../chunks/Ripple-Bq9bxg4k.js";import"react";import"../../chunks/createComponent-CovqNaAJ.js";import"../../chunks/useTheme-BYuNiCiH.js";import"../../chunks/generateSupportColors-BN5t8dA-.js";export{f as Card,s as CardContent};
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const r=require("react/jsx-runtime"),e=require("../../chunks/index-DYxwT4uW.cjs"),x=require("../../chunks/joinClass-Jk3EszKD.cjs"),h=require("../../chunks/Stack-
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const r=require("react/jsx-runtime"),e=require("../../chunks/index-DYxwT4uW.cjs"),x=require("../../chunks/joinClass-Jk3EszKD.cjs"),h=require("../../chunks/Stack-B_lU0ez7.cjs"),b=require("../../chunks/createComponent-Dkt68kvT.cjs");require("react");require("../../chunks/useTheme-DsrjDJKC.cjs");require("../../chunks/generateSupportColors-CTMoGhDf.cjs");function k({label:n,name:c,color:t="primary",checked:i,disabled:s,error:l,helperText:o,...u}){const a=x.joinClass(`${e.prefix}-checkbox`,`${e.prefix}-checkbox--${t}`,i&&`${e.prefix}-checkbox--${t}--checked`,s&&`${e.prefix}-checkbox--disabled`),p=x.joinClass(`${e.prefix}-checkbox__helper-text`,o&&`${e.prefix}-checkbox__helper-text--visible`,l&&`${e.prefix}-checkbox__helper-text--error`);return r.jsxs(h.Stack,{gap:4,children:[r.jsxs("label",{htmlFor:c,className:a,children:[r.jsx("input",{type:"checkbox",...u,id:c,name:c,checked:i,disabled:s}),n]}),r.jsx("span",{className:p,children:o})]})}const f=b.createComponent(k);exports.default=f;
|
|
2
2
|
//# sourceMappingURL=index.cjs.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{jsxs as p,jsx as i}from"react/jsx-runtime";import{p as e}from"../../chunks/index-CZ41y9Hn.js";import{j as h}from"../../chunks/joinClass-anSpaauN.js";import{S as n}from"../../chunks/Stack-
|
|
1
|
+
import{jsxs as p,jsx as i}from"react/jsx-runtime";import{p as e}from"../../chunks/index-CZ41y9Hn.js";import{j as h}from"../../chunks/joinClass-anSpaauN.js";import{S as n}from"../../chunks/Stack-Deow48Th.js";import{c as k}from"../../chunks/createComponent-CovqNaAJ.js";import"react";import"../../chunks/useTheme-BYuNiCiH.js";import"../../chunks/generateSupportColors-BN5t8dA-.js";function f({label:x,name:o,color:c="primary",checked:r,disabled:t,error:a,helperText:s,...m}){const l=h(`${e}-checkbox`,`${e}-checkbox--${c}`,r&&`${e}-checkbox--${c}--checked`,t&&`${e}-checkbox--disabled`),b=h(`${e}-checkbox__helper-text`,s&&`${e}-checkbox__helper-text--visible`,a&&`${e}-checkbox__helper-text--error`);return p(n,{gap:4,children:[p("label",{htmlFor:o,className:l,children:[i("input",{type:"checkbox",...m,id:o,name:o,checked:r,disabled:t}),x]}),i("span",{className:b,children:s})]})}const S=k(f);export{S as default};
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const C=require("react/jsx-runtime"),c=require("react"),x=require("../../chunks/index-DYxwT4uW.cjs"),b=require("../../chunks/joinClass-Jk3EszKD.cjs"),q=require("../../chunks/Stack-
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const C=require("react/jsx-runtime"),c=require("react"),x=require("../../chunks/index-DYxwT4uW.cjs"),b=require("../../chunks/joinClass-Jk3EszKD.cjs"),q=require("../../chunks/Stack-B_lU0ez7.cjs"),E=require("../../chunks/createComponent-Dkt68kvT.cjs");require("../../chunks/useTheme-DsrjDJKC.cjs");require("../../chunks/generateSupportColors-CTMoGhDf.cjs");let g=0;function j({children:d,values:r,onChange:a,className:i}){const l=++g,n=c.Children.toArray(d),k=b.joinClass(`${x.prefix}-checkbox-group`,i),[s,p]=c.useState(n.map(e=>({id:e.props.name,value:e.props.value,checked:r?r.some(o=>o===e.props.name):!1}))),m=c.useCallback(()=>n.map((e,o)=>{const f=e.props.name;return c.cloneElement(e,{key:o,name:`${e.props.name}-${l}`,checked:e.props.checked||s[o].checked,onChange:h=>{const u=s.map(t=>t.id===f?{...t,checked:h.target.checked}:t);a&&a(u),p(u)}})}),[r,s]);return c.useEffect(()=>{p(n.map(e=>({id:e.props.name,value:e.props.value,checked:r?r.some(o=>o===e.props.name):!1})))},[r]),C.jsx(q.Stack,{gap:2,className:k,children:m()})}const y=E.createComponent(j);exports.default=y;
|
|
2
2
|
//# sourceMappingURL=index.cjs.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{jsx as i}from"react/jsx-runtime";import{Children as C,useState as x,useCallback as b,cloneElement as E,useEffect as y}from"react";import{p as g}from"../../chunks/index-CZ41y9Hn.js";import{j}from"../../chunks/joinClass-anSpaauN.js";import{S}from"../../chunks/Stack-
|
|
1
|
+
import{jsx as i}from"react/jsx-runtime";import{Children as C,useState as x,useCallback as b,cloneElement as E,useEffect as y}from"react";import{p as g}from"../../chunks/index-CZ41y9Hn.js";import{j}from"../../chunks/joinClass-anSpaauN.js";import{S}from"../../chunks/Stack-Deow48Th.js";import{c as $}from"../../chunks/createComponent-CovqNaAJ.js";import"../../chunks/useTheme-BYuNiCiH.js";import"../../chunks/generateSupportColors-BN5t8dA-.js";let A=0;function G({children:m,values:r,onChange:a,className:f}){const k=++A,p=C.toArray(m),d=j(`${g}-checkbox-group`,f),[c,n]=x(p.map(e=>({id:e.props.name,value:e.props.value,checked:r?r.some(o=>o===e.props.name):!1}))),u=b(()=>p.map((e,o)=>{const h=e.props.name;return E(e,{key:o,name:`${e.props.name}-${k}`,checked:e.props.checked||c[o].checked,onChange:l=>{const t=c.map(s=>s.id===h?{...s,checked:l.target.checked}:s);a&&a(t),n(t)}})}),[r,c]);return y(()=>{n(p.map(e=>({id:e.props.name,value:e.props.value,checked:r?r.some(o=>o===e.props.name):!1})))},[r]),i(S,{gap:2,className:d,children:u()})}const q=$(G);export{q as default};
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const i=require("react/jsx-runtime"),a=require("react"),e=require("../../chunks/index-DYxwT4uW.cjs"),o=require("../../chunks/joinClass-Jk3EszKD.cjs"),p=require("../../chunks/Ripple-Dy4i91j1.cjs"),j=require("../../chunks/useTheme-
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const i=require("react/jsx-runtime"),a=require("react"),e=require("../../chunks/index-DYxwT4uW.cjs"),o=require("../../chunks/joinClass-Jk3EszKD.cjs"),p=require("../../chunks/Ripple-Dy4i91j1.cjs"),j=require("../../chunks/useTheme-DsrjDJKC.cjs"),C=require("../../chunks/createComponent-Dkt68kvT.cjs");require("../../chunks/generateSupportColors-CTMoGhDf.cjs");const _=a.forwardRef(({label:n,icon:t,size:u="medium",color:l="default",variant:d="contained",onDelete:c,...s},h)=>{const{theme:{mode:m}}=j.useTheme(),x=o.joinClass(`${e.prefix}-chip`,`${e.prefix}-chip--${m}`,`${e.prefix}-chip--${l}`,`${e.prefix}-chip--${l}--${d}`,`${e.prefix}-chip--${u}`,c&&`${e.prefix}-chip--deletable`,s.onClick&&`${e.prefix}-chip--clickable`,s.className),f=r=>a.cloneElement(r,{size:14,className:o.joinClass(r.props.className,`${e.prefix}-chip__icon`,n&&`${e.prefix}-chip__icon--margin`)}),$=r=>{r.stopPropagation(),c&&c()};return i.jsxs("div",{...s,ref:h,className:x,style:{...s.style},children:[t&&f(t),i.jsx("span",{children:n}),s.onClick&&i.jsx(p.Ripple,{}),c&&i.jsxs("button",{className:`${e.prefix}-chip__delete-icon`,onClick:$,children:[i.jsx("i",{className:"uil uil-times-circle"}),i.jsx(p.Ripple,{})]})]})}),q=C.createComponent(_);exports.default=q;
|
|
2
2
|
//# sourceMappingURL=index.cjs.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{jsxs as r,jsx as t}from"react/jsx-runtime";import{forwardRef as _,cloneElement as N}from"react";import{p as i}from"../../chunks/index-CZ41y9Hn.js";import{j as l}from"../../chunks/joinClass-anSpaauN.js";import{R as n}from"../../chunks/Ripple-Bq9bxg4k.js";import{u as j}from"../../chunks/useTheme-
|
|
1
|
+
import{jsxs as r,jsx as t}from"react/jsx-runtime";import{forwardRef as _,cloneElement as N}from"react";import{p as i}from"../../chunks/index-CZ41y9Hn.js";import{j as l}from"../../chunks/joinClass-anSpaauN.js";import{R as n}from"../../chunks/Ripple-Bq9bxg4k.js";import{u as j}from"../../chunks/useTheme-BYuNiCiH.js";import{c as k}from"../../chunks/createComponent-CovqNaAJ.js";import"../../chunks/generateSupportColors-BN5t8dA-.js";const x=_(({label:a,icon:m,size:p="medium",color:o="default",variant:h="contained",onDelete:c,...e},d)=>{const{theme:{mode:$}}=j(),f=l(`${i}-chip`,`${i}-chip--${$}`,`${i}-chip--${o}`,`${i}-chip--${o}--${h}`,`${i}-chip--${p}`,c&&`${i}-chip--deletable`,e.onClick&&`${i}-chip--clickable`,e.className),u=s=>N(s,{size:14,className:l(s.props.className,`${i}-chip__icon`,a&&`${i}-chip__icon--margin`)}),C=s=>{s.stopPropagation(),c&&c()};return r("div",{...e,ref:d,className:f,style:{...e.style},children:[m&&u(m),t("span",{children:a}),e.onClick&&t(n,{}),c&&r("button",{className:`${i}-chip__delete-icon`,onClick:C,children:[t("i",{className:"uil uil-times-circle"}),t(n,{})]})]})}),I=k(x);export{I as default};
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const r=require("react/jsx-runtime"),d=require("react"),e=require("../../chunks/index-DYxwT4uW.cjs"),s=require("../../chunks/joinClass-Jk3EszKD.cjs"),x=require("../../chunks/generateSupportColors-CTMoGhDf.cjs"),
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const r=require("react/jsx-runtime"),d=require("react"),e=require("../../chunks/index-DYxwT4uW.cjs"),s=require("../../chunks/joinClass-Jk3EszKD.cjs"),x=require("../../chunks/generateSupportColors-CTMoGhDf.cjs"),m=require("../../chunks/createComponent-Dkt68kvT.cjs"),R=require("../../chunks/Box-DdpIV_Bl.cjs"),C=require("../../chunks/Icon-CIrgQex7.cjs"),E=require("../../chunks/Stack-B_lU0ez7.cjs"),I=require("../../chunks/useTheme-DsrjDJKC.cjs"),_=require("../../chunks/useMenu-DewYBiar.cjs");require("../../chunks/useListenerResized-AwpsZLcP.cjs");require("../../chunks/Card-DtjP8NP7.cjs");require("../../chunks/Ripple-Dy4i91j1.cjs");require("../../chunks/CardContent-BqqU9iwO.cjs");const k=["#00aae6","#2e72fe","#6f4dff","#9f40f1","#9e2dbf","#db5bdc","#ea479b","#ff83a8","#d80051","#eb3d32","#fa8d2f","#f5cd2b","#93ca00","#62d26f","#38c5ab","#87969f"];function O({label:n,error:i,helperText:t,fitContent:b,value:c=k[0],autoClose:j,onChange:h,onInput:$,...q}){const{theme:{palette:a}}=I.useTheme(),l=d.useRef(null),[g,N,p]=_.useMenu(),u=d.useMemo(()=>m.uuid(),[]),y=s.joinClass(`${e.prefix}-color-picker__label`,i&&`${e.prefix}-color-picker__label--error`),v=s.joinClass(`${e.prefix}-color-picker-container`,i&&`${e.prefix}-color-picker-container--error`),M=s.joinClass(`${e.prefix}-color-picker`,i&&`${e.prefix}-color-picker--error`),S=s.joinClass(`${e.prefix}-color-picker__value`,i&&`${e.prefix}-color-picker__value--error`),w=s.joinClass(`${e.prefix}-color-picker__helper-text`,t&&`${e.prefix}-color-picker__helper-text--visible`,i&&`${e.prefix}-color-picker__helper-text--error`),f=o=>s.joinClass(`${e.prefix}-color-picker__color__icon`,c===o&&`${e.prefix}-color-picker__color__icon--visible`);function P(o){l.current&&(l.current.value=o,l.current.dispatchEvent(new Event("input",{bubbles:!0})))}return r.jsxs("div",{className:v,children:[n&&r.jsxs("label",{className:y,children:[n," ",q.required&&"*"]}),r.jsxs("button",{type:"button",onClick:p,className:M,children:[r.jsx("div",{className:`${e.prefix}-color-picker__preview`,children:r.jsx("div",{style:{backgroundColor:c}})}),r.jsx("div",{className:S,children:c})]}),r.jsx("span",{className:w,children:t}),r.jsx(_.Menu,{direction:"left",autoClose:j,open:g,anchorEl:N,width:b?"fit-content":"",onClose:p,children:r.jsx(R.Box,{sx:{p:1},children:r.jsxs(E.Stack,{gap:8,flexDirection:"row",justifyContent:"center",style:{flexWrap:"wrap"},children:[k.map(o=>r.jsx("button",{type:"button",className:`${e.prefix}-color-picker__color`,onClick:()=>P(o),style:{backgroundColor:o},children:r.jsx(C.Icon,{name:"check",className:f(o),style:{color:x.getContrastColor(c)}})},o)),r.jsxs("label",{htmlFor:`color-picker-${u}`,className:`${e.prefix}-color-picker__color`,style:{backgroundColor:a.grey.main},children:[r.jsx(C.Icon,{name:"plus",className:f(c),style:{color:x.getContrastColor(a.grey.main)}}),r.jsx("input",{ref:l,type:"color",id:`color-picker-${u}`,value:c,onChange:h,onInput:$})]})]})})})]})}const T=m.createComponent(O);exports.default=T;
|
|
2
2
|
//# sourceMappingURL=index.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.cjs","sources":["../../../src/fields/ColorPicker/colors.ts","../../../src/fields/ColorPicker/ColorPicker.tsx"],"sourcesContent":["export default [\n '#00aae6',\n '#2e72fe',\n '#6f4dff',\n '#9f40f1',\n '#9e2dbf',\n '#db5bdc',\n '#ea479b',\n '#ff83a8',\n '#d80051',\n '#eb3d32',\n '#fa8d2f',\n '#f5cd2b',\n '#93ca00',\n '#62d26f',\n '#38c5ab',\n '#87969f',\n];","import {\n useRef,\n useMemo,\n type InputHTMLAttributes,\n} from 'react';\n\nimport { prefix } from '@iziui/tokens/web/js';\n\nimport { joinClass } from '@iziui/core/utils/joinClass';\nimport { getContrastColor } from '@iziui/core/utils';\n\nimport { uuid } from '@iziui/toolkit/uuid';\n\nimport Box from '@/layout/Box';\nimport Icon from '@/display/Icon';\nimport Stack from '@/layout/Stack';\nimport { useTheme } from '@/theme';\nimport { Menu, useMenu } from '@/navigation/Menu';\n\nimport COLORS from './colors';\nimport createComponent from '../../core/createComponent';\n\nimport '@iziui/styles/components/ColorPicker.scss';\n\nexport interface ColorPickerProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'value'> {\n label?: string;\n value: string;\n error?: boolean;\n helperText?: string;\n fitContent?: boolean;\n autoClose?: boolean;\n}\n\nfunction ColorPicker({\n label,\n error,\n helperText,\n fitContent,\n value = COLORS[0],\n autoClose,\n onChange,\n onInput,\n ...props\n}: ColorPickerProps) {\n const { theme: { palette } } = useTheme();\n\n const inputRef = useRef<HTMLInputElement | null>(null);\n\n const [open, el, toggle] = useMenu();\n\n const id = useMemo(() => uuid(), []);\n\n const labelClss = joinClass(\n `${prefix}-color-picker__label`,\n error && `${prefix}-color-picker__label--error`,\n );\n\n const containerClassName = joinClass(\n `${prefix}-color-picker-container`,\n error && `${prefix}-color-picker-container--error`,\n );\n\n const colorPickerClassName = joinClass(\n `${prefix}-color-picker`,\n error && `${prefix}-color-picker--error`,\n );\n\n const valueClassName = joinClass(\n `${prefix}-color-picker__value`,\n error && `${prefix}-color-picker__value--error`,\n );\n\n const helperTextClss = joinClass(\n `${prefix}-color-picker__helper-text`,\n helperText && `${prefix}-color-picker__helper-text--visible`,\n error && `${prefix}-color-picker__helper-text--error`,\n );\n\n const iconClassName = (c: string) => joinClass(\n `${prefix}-color-picker__color__icon`,\n value === c && `${prefix}-color-picker__color__icon--visible`,\n );\n\n function handleColorChange(color: string) {\n if (!inputRef.current) { return; }\n // if (autoClose) { toggle(); }\n\n inputRef.current.value = color;\n inputRef.current.dispatchEvent(new Event('input', { bubbles: true }));\n }\n\n return (\n <div className={containerClassName}>\n {label && <label className={labelClss}>{label} {props.required && '*'}</label>}\n <button type=\"button\" onClick={toggle} className={colorPickerClassName}>\n <div className={`${prefix}-color-picker__preview`}>\n <div style={{ backgroundColor: value }} />\n </div>\n <div className={valueClassName}>\n {value}\n </div>\n </button>\n <span className={helperTextClss}>{helperText}</span>\n <Menu\n direction=\"left\"\n autoClose={autoClose}\n open={open}\n anchorEl={el}\n width={fitContent ? 'fit-content' : ''}\n onClose={toggle}\n >\n <Box sx={{ p: 1 }}>\n <Stack\n gap={8}\n flexDirection=\"row\"\n justifyContent=\"center\"\n style={{ flexWrap: 'wrap' }}\n >\n {\n COLORS.map((c) => (\n <button\n key={c}\n type=\"button\"\n className={`${prefix}-color-picker__color`}\n onClick={() => handleColorChange(c)}\n style={{ backgroundColor: c }}\n >\n <Icon\n name=\"check\"\n className={iconClassName(c)}\n style={{ color: getContrastColor(value) }}\n />\n </button>\n ))\n }\n <label\n htmlFor={`color-picker-${id}`}\n className={`${prefix}-color-picker__color`}\n style={{ backgroundColor: palette.grey.main }}\n >\n <Icon\n name=\"plus\"\n className={iconClassName(value)}\n style={{ color: getContrastColor(palette.grey.main) }}\n />\n <input\n ref={inputRef}\n type=\"color\"\n id={`color-picker-${id}`}\n value={value}\n onChange={onChange}\n onInput={onInput}\n />\n </label>\n </Stack>\n </Box>\n </Menu>\n </div>\n );\n}\n\nexport default createComponent(ColorPicker);\n"],"names":["COLORS","ColorPicker","label","error","helperText","fitContent","value","autoClose","onChange","onInput","props","palette","useTheme","inputRef","useRef","open","el","toggle","useMenu","id","useMemo","uuid","labelClss","joinClass","prefix","containerClassName","colorPickerClassName","valueClassName","helperTextClss","iconClassName","c","handleColorChange","color","jsxs","jsx","Menu","Box","Stack","Icon","getContrastColor","ColorPicker_default","createComponent"],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.cjs","sources":["../../../src/fields/ColorPicker/colors.ts","../../../src/fields/ColorPicker/ColorPicker.tsx"],"sourcesContent":["export default [\n '#00aae6',\n '#2e72fe',\n '#6f4dff',\n '#9f40f1',\n '#9e2dbf',\n '#db5bdc',\n '#ea479b',\n '#ff83a8',\n '#d80051',\n '#eb3d32',\n '#fa8d2f',\n '#f5cd2b',\n '#93ca00',\n '#62d26f',\n '#38c5ab',\n '#87969f',\n];","import {\n useRef,\n useMemo,\n type InputHTMLAttributes,\n} from 'react';\n\nimport { prefix } from '@iziui/tokens/web/js';\n\nimport { joinClass } from '@iziui/core/utils/joinClass';\nimport { getContrastColor } from '@iziui/core/utils';\n\nimport { uuid } from '@iziui/toolkit/uuid';\n\nimport Box from '@/layout/Box';\nimport Icon from '@/display/Icon';\nimport Stack from '@/layout/Stack';\nimport { useTheme } from '@/theme';\nimport { Menu, useMenu } from '@/navigation/Menu';\n\nimport COLORS from './colors';\nimport createComponent from '../../core/createComponent';\n\nimport '@iziui/styles/components/ColorPicker.scss';\n\nexport interface ColorPickerProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'value'> {\n label?: string;\n value: string;\n error?: boolean;\n helperText?: string;\n fitContent?: boolean;\n autoClose?: boolean;\n}\n\nfunction ColorPicker({\n label,\n error,\n helperText,\n fitContent,\n value = COLORS[0],\n autoClose,\n onChange,\n onInput,\n ...props\n}: ColorPickerProps) {\n const { theme: { palette } } = useTheme();\n\n const inputRef = useRef<HTMLInputElement | null>(null);\n\n const [open, el, toggle] = useMenu();\n\n const id = useMemo(() => uuid(), []);\n\n const labelClss = joinClass(\n `${prefix}-color-picker__label`,\n error && `${prefix}-color-picker__label--error`,\n );\n\n const containerClassName = joinClass(\n `${prefix}-color-picker-container`,\n error && `${prefix}-color-picker-container--error`,\n );\n\n const colorPickerClassName = joinClass(\n `${prefix}-color-picker`,\n error && `${prefix}-color-picker--error`,\n );\n\n const valueClassName = joinClass(\n `${prefix}-color-picker__value`,\n error && `${prefix}-color-picker__value--error`,\n );\n\n const helperTextClss = joinClass(\n `${prefix}-color-picker__helper-text`,\n helperText && `${prefix}-color-picker__helper-text--visible`,\n error && `${prefix}-color-picker__helper-text--error`,\n );\n\n const iconClassName = (c: string) => joinClass(\n `${prefix}-color-picker__color__icon`,\n value === c && `${prefix}-color-picker__color__icon--visible`,\n );\n\n function handleColorChange(color: string) {\n if (!inputRef.current) { return; }\n // if (autoClose) { toggle(); }\n\n inputRef.current.value = color;\n inputRef.current.dispatchEvent(new Event('input', { bubbles: true }));\n }\n\n return (\n <div className={containerClassName}>\n {label && <label className={labelClss}>{label} {props.required && '*'}</label>}\n <button type=\"button\" onClick={toggle} className={colorPickerClassName}>\n <div className={`${prefix}-color-picker__preview`}>\n <div style={{ backgroundColor: value }} />\n </div>\n <div className={valueClassName}>\n {value}\n </div>\n </button>\n <span className={helperTextClss}>{helperText}</span>\n <Menu\n direction=\"left\"\n autoClose={autoClose}\n open={open}\n anchorEl={el}\n width={fitContent ? 'fit-content' : ''}\n onClose={toggle}\n >\n <Box sx={{ p: 1 }}>\n <Stack\n gap={8}\n flexDirection=\"row\"\n justifyContent=\"center\"\n style={{ flexWrap: 'wrap' }}\n >\n {\n COLORS.map((c) => (\n <button\n key={c}\n type=\"button\"\n className={`${prefix}-color-picker__color`}\n onClick={() => handleColorChange(c)}\n style={{ backgroundColor: c }}\n >\n <Icon\n name=\"check\"\n className={iconClassName(c)}\n style={{ color: getContrastColor(value) }}\n />\n </button>\n ))\n }\n <label\n htmlFor={`color-picker-${id}`}\n className={`${prefix}-color-picker__color`}\n style={{ backgroundColor: palette.grey.main }}\n >\n <Icon\n name=\"plus\"\n className={iconClassName(value)}\n style={{ color: getContrastColor(palette.grey.main) }}\n />\n <input\n ref={inputRef}\n type=\"color\"\n id={`color-picker-${id}`}\n value={value}\n onChange={onChange}\n onInput={onInput}\n />\n </label>\n </Stack>\n </Box>\n </Menu>\n </div>\n );\n}\n\nexport default createComponent(ColorPicker);\n"],"names":["COLORS","ColorPicker","label","error","helperText","fitContent","value","autoClose","onChange","onInput","props","palette","useTheme","inputRef","useRef","open","el","toggle","useMenu","id","useMemo","uuid","labelClss","joinClass","prefix","containerClassName","colorPickerClassName","valueClassName","helperTextClss","iconClassName","c","handleColorChange","color","jsxs","jsx","Menu","Box","Stack","Icon","getContrastColor","ColorPicker_default","createComponent"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{jsxs as i,jsx as e}from"react/jsx-runtime";import{useRef as P,useMemo as R}from"react";import{p as o}from"../../chunks/index-CZ41y9Hn.js";import{j as l}from"../../chunks/joinClass-anSpaauN.js";import{b as u}from"../../chunks/generateSupportColors-BN5t8dA-.js";import{u as
|
|
1
|
+
import{jsxs as i,jsx as e}from"react/jsx-runtime";import{useRef as P,useMemo as R}from"react";import{p as o}from"../../chunks/index-CZ41y9Hn.js";import{j as l}from"../../chunks/joinClass-anSpaauN.js";import{b as u}from"../../chunks/generateSupportColors-BN5t8dA-.js";import{c as S,u as B}from"../../chunks/createComponent-CovqNaAJ.js";import{B as I}from"../../chunks/Box-O2jw08Hf.js";import{I as _}from"../../chunks/Icon-imOBrsbL.js";import{S as O}from"../../chunks/Stack-Deow48Th.js";import{u as q}from"../../chunks/useTheme-BYuNiCiH.js";import{u as D,M as F}from"../../chunks/useMenu-DuX7EGHi.js";import"../../chunks/useListenerResized-Bnqxrt7k.js";import"../../chunks/Card-D_RFnUk2.js";import"../../chunks/Ripple-Bq9bxg4k.js";import"../../chunks/CardContent-BsSfxSQH.js";const k=["#00aae6","#2e72fe","#6f4dff","#9f40f1","#9e2dbf","#db5bdc","#ea479b","#ff83a8","#d80051","#eb3d32","#fa8d2f","#f5cd2b","#93ca00","#62d26f","#38c5ab","#87969f"];function L({label:s,error:t,helperText:a,fitContent:b,value:c=k[0],autoClose:h,onChange:C,onInput:$,...N}){const{theme:{palette:p}}=q(),n=P(null),[y,x,m]=D(),f=R(()=>B(),[]),g=l(`${o}-color-picker__label`,t&&`${o}-color-picker__label--error`),v=l(`${o}-color-picker-container`,t&&`${o}-color-picker-container--error`),j=l(`${o}-color-picker`,t&&`${o}-color-picker--error`),w=l(`${o}-color-picker__value`,t&&`${o}-color-picker__value--error`),M=l(`${o}-color-picker__helper-text`,a&&`${o}-color-picker__helper-text--visible`,t&&`${o}-color-picker__helper-text--error`),d=r=>l(`${o}-color-picker__color__icon`,c===r&&`${o}-color-picker__color__icon--visible`);function E(r){n.current&&(n.current.value=r,n.current.dispatchEvent(new Event("input",{bubbles:!0})))}return i("div",{className:v,children:[s&&i("label",{className:g,children:[s," ",N.required&&"*"]}),i("button",{type:"button",onClick:m,className:j,children:[e("div",{className:`${o}-color-picker__preview`,children:e("div",{style:{backgroundColor:c}})}),e("div",{className:w,children:c})]}),e("span",{className:M,children:a}),e(F,{direction:"left",autoClose:h,open:y,anchorEl:x,width:b?"fit-content":"",onClose:m,children:e(I,{sx:{p:1},children:i(O,{gap:8,flexDirection:"row",justifyContent:"center",style:{flexWrap:"wrap"},children:[k.map(r=>e("button",{type:"button",className:`${o}-color-picker__color`,onClick:()=>E(r),style:{backgroundColor:r},children:e(_,{name:"check",className:d(r),style:{color:u(c)}})},r)),i("label",{htmlFor:`color-picker-${f}`,className:`${o}-color-picker__color`,style:{backgroundColor:p.grey.main},children:[e(_,{name:"plus",className:d(c),style:{color:u(p.grey.main)}}),e("input",{ref:n,type:"color",id:`color-picker-${f}`,value:c,onChange:C,onInput:$})]})]})})})]})}const eo=S(L);export{eo as default};
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../../src/fields/ColorPicker/colors.ts","../../../src/fields/ColorPicker/ColorPicker.tsx"],"sourcesContent":["export default [\n '#00aae6',\n '#2e72fe',\n '#6f4dff',\n '#9f40f1',\n '#9e2dbf',\n '#db5bdc',\n '#ea479b',\n '#ff83a8',\n '#d80051',\n '#eb3d32',\n '#fa8d2f',\n '#f5cd2b',\n '#93ca00',\n '#62d26f',\n '#38c5ab',\n '#87969f',\n];","import {\n useRef,\n useMemo,\n type InputHTMLAttributes,\n} from 'react';\n\nimport { prefix } from '@iziui/tokens/web/js';\n\nimport { joinClass } from '@iziui/core/utils/joinClass';\nimport { getContrastColor } from '@iziui/core/utils';\n\nimport { uuid } from '@iziui/toolkit/uuid';\n\nimport Box from '@/layout/Box';\nimport Icon from '@/display/Icon';\nimport Stack from '@/layout/Stack';\nimport { useTheme } from '@/theme';\nimport { Menu, useMenu } from '@/navigation/Menu';\n\nimport COLORS from './colors';\nimport createComponent from '../../core/createComponent';\n\nimport '@iziui/styles/components/ColorPicker.scss';\n\nexport interface ColorPickerProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'value'> {\n label?: string;\n value: string;\n error?: boolean;\n helperText?: string;\n fitContent?: boolean;\n autoClose?: boolean;\n}\n\nfunction ColorPicker({\n label,\n error,\n helperText,\n fitContent,\n value = COLORS[0],\n autoClose,\n onChange,\n onInput,\n ...props\n}: ColorPickerProps) {\n const { theme: { palette } } = useTheme();\n\n const inputRef = useRef<HTMLInputElement | null>(null);\n\n const [open, el, toggle] = useMenu();\n\n const id = useMemo(() => uuid(), []);\n\n const labelClss = joinClass(\n `${prefix}-color-picker__label`,\n error && `${prefix}-color-picker__label--error`,\n );\n\n const containerClassName = joinClass(\n `${prefix}-color-picker-container`,\n error && `${prefix}-color-picker-container--error`,\n );\n\n const colorPickerClassName = joinClass(\n `${prefix}-color-picker`,\n error && `${prefix}-color-picker--error`,\n );\n\n const valueClassName = joinClass(\n `${prefix}-color-picker__value`,\n error && `${prefix}-color-picker__value--error`,\n );\n\n const helperTextClss = joinClass(\n `${prefix}-color-picker__helper-text`,\n helperText && `${prefix}-color-picker__helper-text--visible`,\n error && `${prefix}-color-picker__helper-text--error`,\n );\n\n const iconClassName = (c: string) => joinClass(\n `${prefix}-color-picker__color__icon`,\n value === c && `${prefix}-color-picker__color__icon--visible`,\n );\n\n function handleColorChange(color: string) {\n if (!inputRef.current) { return; }\n // if (autoClose) { toggle(); }\n\n inputRef.current.value = color;\n inputRef.current.dispatchEvent(new Event('input', { bubbles: true }));\n }\n\n return (\n <div className={containerClassName}>\n {label && <label className={labelClss}>{label} {props.required && '*'}</label>}\n <button type=\"button\" onClick={toggle} className={colorPickerClassName}>\n <div className={`${prefix}-color-picker__preview`}>\n <div style={{ backgroundColor: value }} />\n </div>\n <div className={valueClassName}>\n {value}\n </div>\n </button>\n <span className={helperTextClss}>{helperText}</span>\n <Menu\n direction=\"left\"\n autoClose={autoClose}\n open={open}\n anchorEl={el}\n width={fitContent ? 'fit-content' : ''}\n onClose={toggle}\n >\n <Box sx={{ p: 1 }}>\n <Stack\n gap={8}\n flexDirection=\"row\"\n justifyContent=\"center\"\n style={{ flexWrap: 'wrap' }}\n >\n {\n COLORS.map((c) => (\n <button\n key={c}\n type=\"button\"\n className={`${prefix}-color-picker__color`}\n onClick={() => handleColorChange(c)}\n style={{ backgroundColor: c }}\n >\n <Icon\n name=\"check\"\n className={iconClassName(c)}\n style={{ color: getContrastColor(value) }}\n />\n </button>\n ))\n }\n <label\n htmlFor={`color-picker-${id}`}\n className={`${prefix}-color-picker__color`}\n style={{ backgroundColor: palette.grey.main }}\n >\n <Icon\n name=\"plus\"\n className={iconClassName(value)}\n style={{ color: getContrastColor(palette.grey.main) }}\n />\n <input\n ref={inputRef}\n type=\"color\"\n id={`color-picker-${id}`}\n value={value}\n onChange={onChange}\n onInput={onInput}\n />\n </label>\n </Stack>\n </Box>\n </Menu>\n </div>\n );\n}\n\nexport default createComponent(ColorPicker);\n"],"names":["COLORS","ColorPicker","label","error","helperText","fitContent","value","autoClose","onChange","onInput","props","palette","useTheme","inputRef","useRef","open","el","toggle","useMenu","id","useMemo","uuid","labelClss","joinClass","prefix","containerClassName","colorPickerClassName","valueClassName","helperTextClss","iconClassName","c","handleColorChange","color","jsxs","jsx","Menu","Box","Stack","Icon","getContrastColor","ColorPicker_default","createComponent"],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../../src/fields/ColorPicker/colors.ts","../../../src/fields/ColorPicker/ColorPicker.tsx"],"sourcesContent":["export default [\n '#00aae6',\n '#2e72fe',\n '#6f4dff',\n '#9f40f1',\n '#9e2dbf',\n '#db5bdc',\n '#ea479b',\n '#ff83a8',\n '#d80051',\n '#eb3d32',\n '#fa8d2f',\n '#f5cd2b',\n '#93ca00',\n '#62d26f',\n '#38c5ab',\n '#87969f',\n];","import {\n useRef,\n useMemo,\n type InputHTMLAttributes,\n} from 'react';\n\nimport { prefix } from '@iziui/tokens/web/js';\n\nimport { joinClass } from '@iziui/core/utils/joinClass';\nimport { getContrastColor } from '@iziui/core/utils';\n\nimport { uuid } from '@iziui/toolkit/uuid';\n\nimport Box from '@/layout/Box';\nimport Icon from '@/display/Icon';\nimport Stack from '@/layout/Stack';\nimport { useTheme } from '@/theme';\nimport { Menu, useMenu } from '@/navigation/Menu';\n\nimport COLORS from './colors';\nimport createComponent from '../../core/createComponent';\n\nimport '@iziui/styles/components/ColorPicker.scss';\n\nexport interface ColorPickerProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'value'> {\n label?: string;\n value: string;\n error?: boolean;\n helperText?: string;\n fitContent?: boolean;\n autoClose?: boolean;\n}\n\nfunction ColorPicker({\n label,\n error,\n helperText,\n fitContent,\n value = COLORS[0],\n autoClose,\n onChange,\n onInput,\n ...props\n}: ColorPickerProps) {\n const { theme: { palette } } = useTheme();\n\n const inputRef = useRef<HTMLInputElement | null>(null);\n\n const [open, el, toggle] = useMenu();\n\n const id = useMemo(() => uuid(), []);\n\n const labelClss = joinClass(\n `${prefix}-color-picker__label`,\n error && `${prefix}-color-picker__label--error`,\n );\n\n const containerClassName = joinClass(\n `${prefix}-color-picker-container`,\n error && `${prefix}-color-picker-container--error`,\n );\n\n const colorPickerClassName = joinClass(\n `${prefix}-color-picker`,\n error && `${prefix}-color-picker--error`,\n );\n\n const valueClassName = joinClass(\n `${prefix}-color-picker__value`,\n error && `${prefix}-color-picker__value--error`,\n );\n\n const helperTextClss = joinClass(\n `${prefix}-color-picker__helper-text`,\n helperText && `${prefix}-color-picker__helper-text--visible`,\n error && `${prefix}-color-picker__helper-text--error`,\n );\n\n const iconClassName = (c: string) => joinClass(\n `${prefix}-color-picker__color__icon`,\n value === c && `${prefix}-color-picker__color__icon--visible`,\n );\n\n function handleColorChange(color: string) {\n if (!inputRef.current) { return; }\n // if (autoClose) { toggle(); }\n\n inputRef.current.value = color;\n inputRef.current.dispatchEvent(new Event('input', { bubbles: true }));\n }\n\n return (\n <div className={containerClassName}>\n {label && <label className={labelClss}>{label} {props.required && '*'}</label>}\n <button type=\"button\" onClick={toggle} className={colorPickerClassName}>\n <div className={`${prefix}-color-picker__preview`}>\n <div style={{ backgroundColor: value }} />\n </div>\n <div className={valueClassName}>\n {value}\n </div>\n </button>\n <span className={helperTextClss}>{helperText}</span>\n <Menu\n direction=\"left\"\n autoClose={autoClose}\n open={open}\n anchorEl={el}\n width={fitContent ? 'fit-content' : ''}\n onClose={toggle}\n >\n <Box sx={{ p: 1 }}>\n <Stack\n gap={8}\n flexDirection=\"row\"\n justifyContent=\"center\"\n style={{ flexWrap: 'wrap' }}\n >\n {\n COLORS.map((c) => (\n <button\n key={c}\n type=\"button\"\n className={`${prefix}-color-picker__color`}\n onClick={() => handleColorChange(c)}\n style={{ backgroundColor: c }}\n >\n <Icon\n name=\"check\"\n className={iconClassName(c)}\n style={{ color: getContrastColor(value) }}\n />\n </button>\n ))\n }\n <label\n htmlFor={`color-picker-${id}`}\n className={`${prefix}-color-picker__color`}\n style={{ backgroundColor: palette.grey.main }}\n >\n <Icon\n name=\"plus\"\n className={iconClassName(value)}\n style={{ color: getContrastColor(palette.grey.main) }}\n />\n <input\n ref={inputRef}\n type=\"color\"\n id={`color-picker-${id}`}\n value={value}\n onChange={onChange}\n onInput={onInput}\n />\n </label>\n </Stack>\n </Box>\n </Menu>\n </div>\n );\n}\n\nexport default createComponent(ColorPicker);\n"],"names":["COLORS","ColorPicker","label","error","helperText","fitContent","value","autoClose","onChange","onInput","props","palette","useTheme","inputRef","useRef","open","el","toggle","useMenu","id","useMemo","uuid","labelClss","joinClass","prefix","containerClassName","colorPickerClassName","valueClassName","helperTextClss","iconClassName","c","handleColorChange","color","jsxs","jsx","Menu","Box","Stack","Icon","getContrastColor","ColorPicker_default","createComponent"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const q=require("react/jsx-runtime"),s=require("react"),C=require("../../chunks/joinClass-Jk3EszKD.cjs"),g=require("../../chunks/useResize-
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const q=require("react/jsx-runtime"),s=require("react"),C=require("../../chunks/joinClass-Jk3EszKD.cjs"),g=require("../../chunks/useResize-Dnf6Ktrn.cjs"),f=require("../../chunks/createComponent-Dkt68kvT.cjs");require("../../chunks/index-DYxwT4uW.cjs");require("../../chunks/useTheme-DsrjDJKC.cjs");require("../../chunks/generateSupportColors-CTMoGhDf.cjs");const j=s.forwardRef(function({sm:o="100%",md:r=750,lg:i=950,children:u,tag:a="div",...n},c){const[l,e]=s.useState(0),t={sm:o,lg:i,md:r},d=C.joinClass(n.className);g.useResize({onXs:()=>e(t.sm),onSm:()=>e(t.md),onMd:()=>e(t.md),onLg:()=>e(t.lg),onXl:()=>e(t.lg)});const m=a;return q.jsx(m,{...n,ref:c,style:{width:"100%",maxWidth:l,margin:"auto",...n.style},className:d,children:u})}),h=f.createComponent(j);exports.default=h;
|
|
2
2
|
//# sourceMappingURL=index.cjs.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{jsx as f}from"react/jsx-runtime";import{forwardRef as l,useState as u}from"react";import{j as C}from"../../chunks/joinClass-anSpaauN.js";import{u as g}from"../../chunks/useResize-
|
|
1
|
+
import{jsx as f}from"react/jsx-runtime";import{forwardRef as l,useState as u}from"react";import{j as C}from"../../chunks/joinClass-anSpaauN.js";import{u as g}from"../../chunks/useResize-BUftB918.js";import{c as p}from"../../chunks/createComponent-CovqNaAJ.js";import"../../chunks/index-CZ41y9Hn.js";import"../../chunks/useTheme-BYuNiCiH.js";import"../../chunks/generateSupportColors-BN5t8dA-.js";const h=l(function({sm:m="100%",md:n=750,lg:a=950,children:e,tag:r="div",...s},i){const[c,t]=u(0),o={sm:m,lg:a,md:n},d=C(s.className);return g({onXs:()=>t(o.sm),onSm:()=>t(o.md),onMd:()=>t(o.md),onLg:()=>t(o.lg),onXl:()=>t(o.lg)}),f(r,{...s,ref:i,style:{width:"100%",maxWidth:c,margin:"auto",...s.style},className:d,children:e})}),X=p(h);export{X as default};
|
|
2
2
|
//# sourceMappingURL=index.js.map
|