@soybeanjs/shadcn-theme 0.1.0 → 0.2.0
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/README.en_US.md +159 -211
- package/README.md +159 -250
- package/dist/index.d.ts +29 -39
- package/dist/index.js +1 -1
- package/package.json +26 -25
package/dist/index.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as _soybeanjs_colord_palette0 from "@soybeanjs/colord/palette";
|
|
2
|
-
import { TailwindPaletteKey, TailwindPaletteLevelColorKey } from "@soybeanjs/colord/palette";
|
|
2
|
+
import { SimplePaletteKey, TailwindPaletteKey, TailwindPaletteLevelColorKey } from "@soybeanjs/colord/palette";
|
|
3
3
|
|
|
4
4
|
//#region src/types.d.ts
|
|
5
5
|
interface ThemeRadius {
|
|
@@ -12,7 +12,7 @@ interface ThemeRadius {
|
|
|
12
12
|
}
|
|
13
13
|
type HSLColor = `hsl(${number} ${number}% ${number}%)` | `hsl(${number} ${number}% ${number}% / ${number})`;
|
|
14
14
|
type OKLCHColor = `oklch(${number}% ${number} ${number})` | `oklch(${number}% ${number} ${number} / ${number})`;
|
|
15
|
-
type ColorValue = HSLColor | OKLCHColor | TailwindPaletteLevelColorKey;
|
|
15
|
+
type ColorValue = HSLColor | OKLCHColor | SimplePaletteKey | TailwindPaletteLevelColorKey;
|
|
16
16
|
interface ShadcnColors {
|
|
17
17
|
background?: ColorValue;
|
|
18
18
|
foreground?: ColorValue;
|
|
@@ -112,7 +112,7 @@ type ThemeColorKey = keyof ThemeColors;
|
|
|
112
112
|
/**
|
|
113
113
|
* the built-in base color preset key
|
|
114
114
|
*/
|
|
115
|
-
type BuiltinBasePresetKey = Extract<TailwindPaletteKey, '
|
|
115
|
+
type BuiltinBasePresetKey = Extract<TailwindPaletteKey, 'neutral' | 'stone' | 'zinc' | 'slate' | 'gray'>;
|
|
116
116
|
/**
|
|
117
117
|
* the built-in primary color preset key
|
|
118
118
|
*/
|
|
@@ -121,11 +121,14 @@ type BuiltinPrimaryPresetKey = TailwindPaletteKey;
|
|
|
121
121
|
* the built-in feedback color preset key
|
|
122
122
|
*/
|
|
123
123
|
type BuiltinFeedbackPresetKey = 'classic' | 'vivid' | 'subtle' | 'warm' | 'cool' | 'nature' | 'modern' | 'vibrant' | 'professional' | 'soft' | 'bold' | 'calm' | 'candy' | 'deep' | 'light';
|
|
124
|
+
/**
|
|
125
|
+
* the built-in sidebar preset key
|
|
126
|
+
*/
|
|
127
|
+
type BuiltinSidebarPresetKey = 'extended';
|
|
124
128
|
type BasePresetColorKey = Extract<ThemeColorKey, 'background' | 'foreground' | 'card' | 'cardForeground' | 'popover' | 'popoverForeground' | 'primaryForeground' | 'secondary' | 'secondaryForeground' | 'muted' | 'mutedForeground' | 'accent' | 'accentForeground' | 'border' | 'input' | 'destructiveForeground' | 'successForeground' | 'warningForeground' | 'infoForeground' | 'carbon' | 'carbonForeground'>;
|
|
125
129
|
type PrimaryPresetColorKey = Extract<ThemeColorKey, 'primary' | 'ring'> | keyof ChartColors;
|
|
126
130
|
type FeedbackPresetColorKey = Extract<ThemeColorKey, 'destructive' | 'success' | 'warning' | 'info'>;
|
|
127
131
|
type SidebarPresetColorKey = keyof SidebarColors;
|
|
128
|
-
type SidebarExtendedColorKey = Extract<ThemeColorKey, 'background' | 'foreground' | 'primary' | 'primaryForeground' | 'accent' | 'accentForeground' | 'border' | 'ring'>;
|
|
129
132
|
type PresetItem<K extends string> = {
|
|
130
133
|
light: { [key in K]: ColorValue };
|
|
131
134
|
dark: { [key in K]: ColorValue };
|
|
@@ -134,64 +137,51 @@ type BasePresetItem = PresetItem<BasePresetColorKey>;
|
|
|
134
137
|
type PrimaryPresetItem = PresetItem<PrimaryPresetColorKey>;
|
|
135
138
|
type FeedbackPresetItem = PresetItem<FeedbackPresetColorKey>;
|
|
136
139
|
type SidebarPresetItem = PresetItem<SidebarPresetColorKey>;
|
|
137
|
-
type SidebarExtendedPresetItem = PresetItem<SidebarExtendedColorKey>;
|
|
138
140
|
type ThemeColorPresetItem = PresetItem<ThemeColorKey>;
|
|
139
141
|
type StyleTarget = 'html' | ':root';
|
|
140
142
|
type DarkSelector = 'class' | 'media';
|
|
141
143
|
type ColorFormat = 'hsl' | 'oklch';
|
|
142
|
-
interface CustomPreset {
|
|
143
|
-
base?: Record<string, BasePresetItem>;
|
|
144
|
-
primary?: Record<string, PrimaryPresetItem>;
|
|
145
|
-
feedback?: Record<string, FeedbackPresetItem>;
|
|
146
|
-
/**
|
|
147
|
-
* the sidebar presets
|
|
148
|
-
*
|
|
149
|
-
* if not set, will use extended colors from base and primary colors
|
|
150
|
-
*/
|
|
151
|
-
sidebar?: Record<string, SidebarPresetItem>;
|
|
152
|
-
}
|
|
153
|
-
type FullPreset<T extends CustomPreset | undefined> = {
|
|
154
|
-
base: Record<BuiltinBasePresetKey | (T extends CustomPreset ? keyof T['base'] : never), BasePresetItem>;
|
|
155
|
-
primary: Record<BuiltinPrimaryPresetKey | (T extends CustomPreset ? keyof T['primary'] : never), PrimaryPresetItem>;
|
|
156
|
-
feedback: Record<BuiltinFeedbackPresetKey | (T extends CustomPreset ? keyof T['feedback'] : never), FeedbackPresetItem>;
|
|
157
|
-
sidebar?: Record<T extends CustomPreset ? keyof T['sidebar'] : never, SidebarPresetItem>;
|
|
158
|
-
};
|
|
159
144
|
/**
|
|
160
145
|
* the preset config
|
|
161
146
|
*/
|
|
162
|
-
interface
|
|
147
|
+
interface PresetKeyConfig {
|
|
163
148
|
/**
|
|
164
149
|
* the base color key
|
|
165
150
|
*
|
|
166
|
-
* @default '
|
|
151
|
+
* @default 'neutral'
|
|
167
152
|
*/
|
|
168
|
-
base?:
|
|
169
|
-
/**
|
|
153
|
+
base?: BuiltinBasePresetKey;
|
|
154
|
+
/**
|
|
155
|
+
* the primary color key
|
|
170
156
|
*
|
|
171
157
|
* @default 'indigo'
|
|
172
158
|
*/
|
|
173
|
-
primary?:
|
|
159
|
+
primary?: BuiltinPrimaryPresetKey;
|
|
174
160
|
/**
|
|
175
161
|
* the feedback color key
|
|
176
162
|
*
|
|
177
163
|
* @default 'classic'
|
|
178
164
|
*/
|
|
179
|
-
feedback?:
|
|
165
|
+
feedback?: BuiltinFeedbackPresetKey;
|
|
180
166
|
/**
|
|
181
167
|
* the sidebar style key
|
|
182
168
|
*
|
|
183
|
-
* @default 'extended'
|
|
169
|
+
* @default 'extended'
|
|
184
170
|
*/
|
|
185
|
-
sidebar?:
|
|
171
|
+
sidebar?: BuiltinSidebarPresetKey;
|
|
186
172
|
}
|
|
187
|
-
|
|
188
|
-
* theme options
|
|
189
|
-
*/
|
|
190
|
-
interface ThemeOptions<T extends CustomPreset | undefined = undefined> extends PresetConfig<T>, ThemeRadius {
|
|
173
|
+
interface PresetConfig extends PresetKeyConfig {
|
|
191
174
|
/**
|
|
192
175
|
* custom preset colors
|
|
176
|
+
*
|
|
177
|
+
* @description if use custom preset, need to provide all colors in the preset
|
|
193
178
|
*/
|
|
194
|
-
preset?:
|
|
179
|
+
preset?: ThemeColorPresetItem;
|
|
180
|
+
}
|
|
181
|
+
/**
|
|
182
|
+
* theme options
|
|
183
|
+
*/
|
|
184
|
+
interface ThemeOptions extends PresetConfig, ThemeRadius {
|
|
195
185
|
/**
|
|
196
186
|
* the border radius
|
|
197
187
|
*
|
|
@@ -243,21 +233,21 @@ declare const builtinPrimaryPresetKeys: _soybeanjs_colord_palette0.TailwindPalet
|
|
|
243
233
|
declare const builtinFeedbackPresetKeys: BuiltinFeedbackPresetKey[];
|
|
244
234
|
//#endregion
|
|
245
235
|
//#region src/core.d.ts
|
|
246
|
-
declare function createShadcnTheme
|
|
236
|
+
declare function createShadcnTheme(options?: ThemeOptions): {
|
|
247
237
|
/**
|
|
248
238
|
* get the complete css variables string
|
|
249
239
|
*
|
|
250
240
|
* the result is the combination of color css variables and radius css variable
|
|
251
241
|
*/
|
|
252
|
-
getCss: (config?: PresetConfig
|
|
242
|
+
getCss: (config?: PresetConfig, radiusValue?: string) => string;
|
|
253
243
|
/**
|
|
254
244
|
* get the color css variables string
|
|
255
245
|
*/
|
|
256
|
-
getColorCss: (config
|
|
246
|
+
getColorCss: (config?: PresetConfig) => string;
|
|
257
247
|
/**
|
|
258
248
|
* get the radius css variable string
|
|
259
249
|
*/
|
|
260
250
|
getRadiusCss: (update?: string) => string;
|
|
261
251
|
};
|
|
262
252
|
//#endregion
|
|
263
|
-
export { type BasePresetColorKey, type BasePresetItem, type BuiltinBasePresetKey, type BuiltinFeedbackPresetKey, type BuiltinPrimaryPresetKey, type ChartColors, type ColorFormat, type ColorValue, type
|
|
253
|
+
export { type BasePresetColorKey, type BasePresetItem, type BuiltinBasePresetKey, type BuiltinFeedbackPresetKey, type BuiltinPrimaryPresetKey, type ChartColors, type ColorFormat, type ColorValue, type DarkSelector, type ExtendedColors, type FeedbackPresetColorKey, type FeedbackPresetItem, type HSLColor, type OKLCHColor, type PresetConfig, type PresetItem, type PrimaryPresetColorKey, type PrimaryPresetItem, type ShadcnColors, type SidebarColors, type SidebarPresetColorKey, type SidebarPresetItem, type StyleTarget, type ThemeColorPresetItem, type ThemeColors, type ThemeOptions, type ThemeRadius, builtinBasePreset, builtinBasePresetKeys, builtinFeedbackPreset, builtinFeedbackPresetKeys, builtinPrimaryPreset, builtinPrimaryPresetKeys, createShadcnTheme };
|
package/dist/index.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{colord as e}from"@soybeanjs/colord";import{generatePalette as t,tailwindPalette as n,tailwindPaletteHsl as r}from"@soybeanjs/colord/palette";function i(e){return Object.keys(e)}function a(e){return!e.startsWith(`hsl(`)&&!e.startsWith(`oklch(`)}function o(e){return e.replace(/hsl\(/g,``).replace(/\)/g,``)}function s(t,i){let o=t;if(!a(t))i===`hsl`&&t.startsWith(`oklch(`)&&(o=e(t).toHslString()),i===`oklch`&&t.startsWith(`hsl(`)&&(o=e(t).toOklchString());else{let[e,a]=t.split(`.`);o=i===`hsl`?r[e][a]:n[e][a]}return o}function c(e){return`base:${e.base};primary:${e.primary};feedback:${e.feedback};sidebar:${e.sidebar}`}const l={background:`--background`,foreground:`--foreground`,card:`--card`,cardForeground:`--card-foreground`,popover:`--popover`,popoverForeground:`--popover-foreground`,primary:`--primary`,primaryForeground:`--primary-foreground`,secondary:`--secondary`,secondaryForeground:`--secondary-foreground`,muted:`--muted`,mutedForeground:`--muted-foreground`,accent:`--accent`,accentForeground:`--accent-foreground`,destructive:`--destructive`,destructiveForeground:`--destructive-foreground`,border:`--border`,input:`--input`,ring:`--ring`,success:`--success`,successForeground:`--success-foreground`,warning:`--warning`,warningForeground:`--warning-foreground`,info:`--info`,infoForeground:`--info-foreground`,carbon:`--carbon`,carbonForeground:`--carbon-foreground`,sidebar:`--sidebar`,sidebarForeground:`--sidebar-foreground`,sidebarPrimary:`--sidebar-primary`,sidebarPrimaryForeground:`--sidebar-primary-foreground`,sidebarAccent:`--sidebar-accent`,sidebarAccentForeground:`--sidebar-accent-foreground`,sidebarBorder:`--sidebar-border`,sidebarRing:`--sidebar-ring`,chart1:`--chart-1`,chart2:`--chart-2`,chart3:`--chart-3`,chart4:`--chart-4`,chart5:`--chart-5`},u={borderAlpha:`--border-alpha`,inputAlpha:`--input-alpha`,sidebarBorderAlpha:`--sidebar-border-alpha`},d={class:`.dark`,media:`@media (prefers-color-scheme: dark)`},f={stone:{light:{background:`oklch(100% 0 0)`,foreground:`stone.950`,card:`oklch(100% 0 0)`,cardForeground:`stone.950`,popover:`oklch(100% 0 0)`,popoverForeground:`stone.950`,primaryForeground:`stone.50`,secondary:`stone.100`,secondaryForeground:`stone.900`,muted:`stone.100`,mutedForeground:`stone.500`,accent:`stone.100`,accentForeground:`stone.900`,destructiveForeground:`stone.50`,successForeground:`stone.50`,warningForeground:`stone.50`,infoForeground:`stone.50`,carbon:`stone.800`,carbonForeground:`stone.50`,border:`stone.200`,input:`stone.200`},dark:{background:`stone.950`,foreground:`stone.50`,card:`stone.900`,cardForeground:`stone.50`,popover:`stone.900`,popoverForeground:`stone.50`,primaryForeground:`stone.900`,secondary:`stone.800`,secondaryForeground:`stone.50`,muted:`stone.800`,mutedForeground:`stone.400`,accent:`stone.800`,accentForeground:`stone.50`,destructiveForeground:`stone.900`,successForeground:`stone.900`,warningForeground:`stone.900`,infoForeground:`stone.900`,carbon:`stone.100`,carbonForeground:`stone.900`,border:`oklch(100% 0 0 / 0.1)`,input:`oklch(100% 0 0 / 0.15)`}},zinc:{light:{background:`zinc.50`,foreground:`zinc.950`,card:`zinc.50`,cardForeground:`zinc.950`,popover:`zinc.50`,popoverForeground:`zinc.950`,primaryForeground:`zinc.50`,secondary:`zinc.100`,secondaryForeground:`zinc.900`,muted:`zinc.100`,mutedForeground:`zinc.500`,accent:`zinc.100`,accentForeground:`zinc.900`,destructiveForeground:`zinc.50`,successForeground:`zinc.50`,warningForeground:`zinc.50`,infoForeground:`zinc.50`,carbon:`zinc.800`,carbonForeground:`zinc.50`,border:`zinc.200`,input:`zinc.200`},dark:{background:`zinc.950`,foreground:`zinc.50`,card:`zinc.900`,cardForeground:`zinc.50`,popover:`zinc.900`,popoverForeground:`zinc.50`,primaryForeground:`zinc.900`,secondary:`zinc.800`,secondaryForeground:`zinc.50`,muted:`zinc.800`,mutedForeground:`zinc.400`,accent:`zinc.800`,accentForeground:`zinc.50`,destructiveForeground:`zinc.900`,successForeground:`zinc.900`,warningForeground:`zinc.900`,infoForeground:`zinc.900`,carbon:`zinc.100`,carbonForeground:`zinc.900`,border:`oklch(100% 0 0 / 0.1)`,input:`oklch(100% 0 0 / 0.15)`}},neutral:{light:{background:`neutral.50`,foreground:`neutral.950`,card:`neutral.50`,cardForeground:`neutral.950`,popover:`neutral.50`,popoverForeground:`neutral.950`,primaryForeground:`neutral.50`,secondary:`neutral.100`,secondaryForeground:`neutral.900`,muted:`neutral.100`,mutedForeground:`neutral.500`,accent:`neutral.100`,accentForeground:`neutral.900`,destructiveForeground:`neutral.50`,successForeground:`neutral.50`,warningForeground:`neutral.50`,infoForeground:`neutral.50`,carbon:`neutral.800`,carbonForeground:`neutral.50`,border:`neutral.200`,input:`neutral.200`},dark:{background:`neutral.950`,foreground:`neutral.50`,card:`neutral.900`,cardForeground:`neutral.50`,popover:`neutral.900`,popoverForeground:`neutral.50`,primaryForeground:`neutral.900`,secondary:`neutral.800`,secondaryForeground:`neutral.50`,muted:`neutral.800`,mutedForeground:`neutral.400`,accent:`neutral.800`,accentForeground:`neutral.50`,destructiveForeground:`neutral.900`,successForeground:`neutral.900`,warningForeground:`neutral.900`,infoForeground:`neutral.900`,carbon:`neutral.100`,carbonForeground:`neutral.900`,border:`oklch(100% 0 0 / 0.1)`,input:`oklch(100% 0 0 / 0.15)`}},gray:{light:{background:`oklch(100% 0 0)`,foreground:`gray.950`,card:`oklch(100% 0 0)`,cardForeground:`gray.950`,popover:`oklch(100% 0 0)`,popoverForeground:`gray.950`,primaryForeground:`gray.50`,secondary:`gray.100`,secondaryForeground:`gray.900`,muted:`gray.100`,mutedForeground:`gray.500`,accent:`gray.100`,accentForeground:`gray.900`,carbon:`gray.800`,destructiveForeground:`gray.50`,successForeground:`gray.50`,warningForeground:`gray.50`,infoForeground:`gray.50`,carbonForeground:`gray.50`,border:`gray.200`,input:`gray.200`},dark:{background:`gray.950`,foreground:`gray.50`,card:`gray.900`,cardForeground:`gray.50`,popover:`gray.900`,popoverForeground:`gray.50`,primaryForeground:`gray.900`,secondary:`gray.800`,secondaryForeground:`gray.50`,muted:`gray.800`,mutedForeground:`gray.400`,accent:`gray.800`,accentForeground:`gray.50`,carbon:`gray.100`,destructiveForeground:`gray.900`,successForeground:`gray.900`,warningForeground:`gray.900`,infoForeground:`gray.900`,carbonForeground:`gray.900`,border:`oklch(100% 0 0 / 0.1)`,input:`oklch(100% 0 0 / 0.15)`}},slate:{light:{background:`oklch(100% 0 0)`,foreground:`slate.950`,card:`oklch(100% 0 0)`,cardForeground:`slate.950`,popover:`oklch(100% 0 0)`,popoverForeground:`slate.950`,primaryForeground:`slate.50`,secondary:`slate.100`,secondaryForeground:`slate.900`,muted:`slate.100`,mutedForeground:`slate.500`,accent:`slate.100`,accentForeground:`slate.900`,destructiveForeground:`slate.50`,successForeground:`slate.50`,warningForeground:`slate.50`,infoForeground:`slate.50`,carbon:`slate.800`,carbonForeground:`slate.50`,border:`slate.200`,input:`slate.200`},dark:{background:`slate.950`,foreground:`slate.50`,card:`slate.900`,cardForeground:`slate.50`,popover:`slate.900`,popoverForeground:`slate.50`,primaryForeground:`slate.900`,secondary:`slate.800`,secondaryForeground:`slate.50`,muted:`slate.800`,mutedForeground:`slate.400`,accent:`slate.800`,accentForeground:`slate.50`,carbon:`slate.100`,destructiveForeground:`slate.900`,successForeground:`slate.900`,warningForeground:`slate.900`,infoForeground:`slate.900`,carbonForeground:`slate.900`,border:`oklch(100% 0 0 / 0.1)`,input:`oklch(100% 0 0 / 0.15)`}}},p={stone:{light:{primary:`stone.800`,ring:`stone.400`,chart1:`orange.600`,chart2:`teal.600`,chart3:`cyan.900`,chart4:`amber.400`,chart5:`amber.500`},dark:{primary:`stone.200`,ring:`stone.500`,chart1:`blue.700`,chart2:`emerald.500`,chart3:`amber.500`,chart4:`purple.500`,chart5:`rose.500`}},zinc:{light:{primary:`zinc.800`,ring:`stone.400`,chart1:`orange.600`,chart2:`teal.600`,chart3:`cyan.900`,chart4:`amber.400`,chart5:`amber.500`},dark:{primary:`zinc.200`,ring:`zinc.500`,chart1:`blue.700`,chart2:`emerald.500`,chart3:`amber.500`,chart4:`purple.500`,chart5:`rose.500`}},neutral:{light:{primary:`neutral.800`,ring:`stone.400`,chart1:`orange.600`,chart2:`teal.600`,chart3:`cyan.900`,chart4:`amber.400`,chart5:`amber.500`},dark:{primary:`neutral.200`,ring:`neutral.500`,chart1:`blue.700`,chart2:`emerald.500`,chart3:`amber.500`,chart4:`purple.500`,chart5:`rose.500`}},gray:{light:{primary:`gray.800`,ring:`stone.400`,chart1:`orange.600`,chart2:`teal.600`,chart3:`cyan.900`,chart4:`amber.400`,chart5:`amber.500`},dark:{primary:`gray.200`,ring:`gray.500`,chart1:`blue.700`,chart2:`emerald.500`,chart3:`amber.500`,chart4:`purple.500`,chart5:`rose.500`}},slate:{light:{primary:`slate.800`,ring:`stone.400`,chart1:`orange.600`,chart2:`teal.600`,chart3:`cyan.900`,chart4:`amber.400`,chart5:`amber.500`},dark:{primary:`slate.200`,ring:`slate.500`,chart1:`blue.700`,chart2:`emerald.500`,chart3:`amber.500`,chart4:`purple.500`,chart5:`rose.500`}},red:{light:{primary:`red.500`,ring:`red.400`,chart1:`red.300`,chart2:`red.500`,chart3:`red.600`,chart4:`red.700`,chart5:`red.800`},dark:{primary:`red.500`,ring:`red.900`,chart1:`red.300`,chart2:`red.500`,chart3:`red.600`,chart4:`red.700`,chart5:`red.800`}},orange:{light:{primary:`orange.500`,ring:`orange.400`,chart1:`orange.300`,chart2:`orange.500`,chart3:`orange.600`,chart4:`orange.700`,chart5:`orange.800`},dark:{primary:`orange.500`,ring:`orange.900`,chart1:`orange.300`,chart2:`orange.500`,chart3:`orange.600`,chart4:`orange.700`,chart5:`orange.800`}},amber:{light:{primary:`amber.500`,ring:`amber.400`,chart1:`amber.300`,chart2:`amber.500`,chart3:`amber.600`,chart4:`amber.700`,chart5:`amber.800`},dark:{primary:`amber.500`,ring:`amber.900`,chart1:`amber.300`,chart2:`amber.500`,chart3:`amber.600`,chart4:`amber.700`,chart5:`amber.800`}},yellow:{light:{primary:`yellow.500`,ring:`yellow.400`,chart1:`yellow.300`,chart2:`yellow.500`,chart3:`yellow.600`,chart4:`yellow.700`,chart5:`yellow.800`},dark:{primary:`yellow.500`,ring:`yellow.900`,chart1:`yellow.300`,chart2:`yellow.500`,chart3:`yellow.600`,chart4:`yellow.700`,chart5:`yellow.800`}},lime:{light:{primary:`lime.500`,ring:`lime.400`,chart1:`lime.300`,chart2:`lime.500`,chart3:`lime.600`,chart4:`lime.700`,chart5:`lime.800`},dark:{primary:`lime.600`,ring:`lime.900`,chart1:`lime.300`,chart2:`lime.500`,chart3:`lime.600`,chart4:`lime.700`,chart5:`lime.800`}},green:{light:{primary:`green.500`,ring:`green.400`,chart1:`green.300`,chart2:`green.500`,chart3:`green.600`,chart4:`green.700`,chart5:`green.800`},dark:{primary:`green.600`,ring:`green.900`,chart1:`green.300`,chart2:`green.500`,chart3:`green.600`,chart4:`green.700`,chart5:`green.800`}},emerald:{light:{primary:`emerald.500`,ring:`emerald.400`,chart1:`emerald.300`,chart2:`emerald.500`,chart3:`emerald.600`,chart4:`emerald.700`,chart5:`emerald.800`},dark:{primary:`emerald.600`,ring:`emerald.900`,chart1:`emerald.300`,chart2:`emerald.500`,chart3:`emerald.600`,chart4:`emerald.700`,chart5:`emerald.800`}},teal:{light:{primary:`teal.500`,ring:`teal.400`,chart1:`teal.300`,chart2:`teal.500`,chart3:`teal.600`,chart4:`teal.700`,chart5:`teal.800`},dark:{primary:`teal.500`,ring:`teal.900`,chart1:`teal.300`,chart2:`teal.500`,chart3:`teal.600`,chart4:`teal.700`,chart5:`teal.800`}},cyan:{light:{primary:`cyan.500`,ring:`cyan.400`,chart1:`cyan.300`,chart2:`cyan.500`,chart3:`cyan.600`,chart4:`cyan.700`,chart5:`cyan.800`},dark:{primary:`cyan.500`,ring:`cyan.900`,chart1:`cyan.300`,chart2:`cyan.500`,chart3:`cyan.600`,chart4:`cyan.700`,chart5:`cyan.800`}},sky:{light:{primary:`sky.500`,ring:`sky.400`,chart1:`sky.300`,chart2:`sky.500`,chart3:`sky.600`,chart4:`sky.700`,chart5:`sky.800`},dark:{primary:`sky.500`,ring:`sky.900`,chart1:`sky.300`,chart2:`sky.500`,chart3:`sky.600`,chart4:`sky.700`,chart5:`sky.800`}},blue:{light:{primary:`blue.500`,ring:`blue.400`,chart1:`blue.300`,chart2:`blue.500`,chart3:`blue.600`,chart4:`blue.700`,chart5:`blue.800`},dark:{primary:`blue.500`,ring:`blue.900`,chart1:`blue.300`,chart2:`blue.500`,chart3:`blue.600`,chart4:`blue.700`,chart5:`blue.800`}},indigo:{light:{primary:`indigo.500`,ring:`indigo.400`,chart1:`indigo.300`,chart2:`indigo.500`,chart3:`indigo.600`,chart4:`indigo.700`,chart5:`indigo.800`},dark:{primary:`indigo.500`,ring:`indigo.900`,chart1:`indigo.300`,chart2:`indigo.500`,chart3:`indigo.600`,chart4:`indigo.700`,chart5:`indigo.800`}},violet:{light:{primary:`violet.500`,ring:`violet.400`,chart1:`violet.300`,chart2:`violet.500`,chart3:`violet.600`,chart4:`violet.700`,chart5:`violet.800`},dark:{primary:`violet.500`,ring:`violet.900`,chart1:`violet.300`,chart2:`violet.500`,chart3:`violet.600`,chart4:`violet.700`,chart5:`violet.800`}},purple:{light:{primary:`purple.500`,ring:`purple.400`,chart1:`purple.300`,chart2:`purple.500`,chart3:`purple.600`,chart4:`purple.700`,chart5:`purple.800`},dark:{primary:`purple.500`,ring:`purple.900`,chart1:`purple.300`,chart2:`purple.500`,chart3:`purple.600`,chart4:`purple.700`,chart5:`purple.800`}},fuchsia:{light:{primary:`fuchsia.500`,ring:`fuchsia.400`,chart1:`fuchsia.300`,chart2:`fuchsia.500`,chart3:`fuchsia.600`,chart4:`fuchsia.700`,chart5:`fuchsia.800`},dark:{primary:`fuchsia.500`,ring:`fuchsia.900`,chart1:`fuchsia.300`,chart2:`fuchsia.500`,chart3:`fuchsia.600`,chart4:`fuchsia.700`,chart5:`fuchsia.800`}},pink:{light:{primary:`pink.500`,ring:`pink.400`,chart1:`pink.300`,chart2:`pink.500`,chart3:`pink.600`,chart4:`pink.700`,chart5:`pink.800`},dark:{primary:`pink.500`,ring:`pink.900`,chart1:`pink.300`,chart2:`pink.500`,chart3:`pink.600`,chart4:`pink.700`,chart5:`pink.800`}},rose:{light:{primary:`rose.500`,ring:`rose.400`,chart1:`rose.300`,chart2:`rose.500`,chart3:`rose.600`,chart4:`rose.700`,chart5:`rose.800`},dark:{primary:`rose.500`,ring:`rose.900`,chart1:`rose.300`,chart2:`rose.500`,chart3:`rose.600`,chart4:`rose.700`,chart5:`rose.800`}}},m={classic:{light:{destructive:`red.500`,success:`green.500`,warning:`yellow.500`,info:`blue.500`},dark:{destructive:`red.400`,success:`green.400`,warning:`yellow.400`,info:`blue.400`}},vivid:{light:{destructive:`red.500`,success:`emerald.500`,warning:`amber.500`,info:`sky.500`},dark:{destructive:`red.400`,success:`emerald.400`,warning:`amber.400`,info:`sky.400`}},subtle:{light:{destructive:`rose.500`,success:`emerald.600`,warning:`amber.600`,info:`indigo.600`},dark:{destructive:`rose.300`,success:`emerald.300`,warning:`amber.300`,info:`indigo.300`}},warm:{light:{destructive:`red.600`,success:`lime.600`,warning:`orange.600`,info:`amber.700`},dark:{destructive:`red.400`,success:`lime.400`,warning:`orange.400`,info:`amber.400`}},cool:{light:{destructive:`rose.600`,success:`teal.600`,warning:`cyan.700`,info:`blue.600`},dark:{destructive:`rose.400`,success:`teal.400`,warning:`cyan.400`,info:`blue.400`}},nature:{light:{destructive:`red.700`,success:`green.700`,warning:`lime.700`,info:`teal.700`},dark:{destructive:`red.300`,success:`green.300`,warning:`lime.300`,info:`teal.300`}},modern:{light:{destructive:`rose.600`,success:`emerald.600`,warning:`orange.600`,info:`sky.600`},dark:{destructive:`rose.400`,success:`emerald.400`,warning:`orange.400`,info:`sky.400`}},vibrant:{light:{destructive:`pink.600`,success:`lime.600`,warning:`amber.600`,info:`cyan.600`},dark:{destructive:`pink.400`,success:`lime.400`,warning:`amber.400`,info:`cyan.400`}},professional:{light:{destructive:`red.700`,success:`green.700`,warning:`amber.700`,info:`blue.700`},dark:{destructive:`red.300`,success:`green.300`,warning:`amber.300`,info:`blue.300`}},soft:{light:{destructive:`rose.500`,success:`teal.500`,warning:`yellow.500`,info:`violet.500`},dark:{destructive:`rose.300`,success:`teal.300`,warning:`yellow.300`,info:`violet.300`}},bold:{light:{destructive:`red.700`,success:`emerald.700`,warning:`orange.700`,info:`blue.700`},dark:{destructive:`red.300`,success:`emerald.300`,warning:`orange.300`,info:`blue.300`}},calm:{light:{destructive:`rose.600`,success:`teal.600`,warning:`amber.600`,info:`slate.600`},dark:{destructive:`rose.400`,success:`teal.400`,warning:`amber.400`,info:`slate.400`}},candy:{light:{destructive:`pink.500`,success:`emerald.500`,warning:`yellow.500`,info:`sky.500`},dark:{destructive:`pink.300`,success:`emerald.300`,warning:`yellow.300`,info:`sky.300`}},deep:{light:{destructive:`red.800`,success:`green.800`,warning:`amber.800`,info:`blue.800`},dark:{destructive:`red.200`,success:`green.200`,warning:`amber.200`,info:`blue.200`}},light:{light:{destructive:`red.500`,success:`emerald.500`,warning:`amber.500`,info:`sky.500`},dark:{destructive:`red.400`,success:`emerald.400`,warning:`amber.400`,info:`sky.400`}}},h=i(f),g=i(p),_=i(m);function v(e,t){let{base:n,primary:r,feedback:i,sidebar:a}=e,o=t.base[n],s=t.primary[r],c=t.feedback[i],l=(a===`extended`?void 0:t.sidebar?.[a])||{},u={light:{...o.light,...s.light,...c.light,...l.light},dark:{...o.dark,...s.dark,...c.dark,...l.dark}};if(a===`extended`){let e=y(u);Object.assign(u.light,e.light),Object.assign(u.dark,e.dark)}return u}function y(e){let{light:t,dark:n}=e;return{light:{sidebar:t.background,sidebarForeground:t.foreground,sidebarPrimary:t.primary,sidebarPrimaryForeground:t.primaryForeground,sidebarAccent:t.accent,sidebarAccentForeground:t.accentForeground,sidebarBorder:t.border,sidebarRing:t.ring},dark:{sidebar:n.background,sidebarForeground:n.foreground,sidebarPrimary:n.primary,sidebarPrimaryForeground:n.primaryForeground,sidebarAccent:n.accent,sidebarAccentForeground:n.accentForeground,sidebarBorder:n.border,sidebarRing:n.ring}}}function b(e,t){let{light:n,dark:r}=e,{format:a,styleTarget:o}=t,s=``,c=``;i(l).forEach(e=>{s+=S(e,a,n),c+=S(e,a,r)});let u=w(n,a),f=`${o} {\n${s}\n${u}\n}`,p=t.darkSelector;return(p===`class`||p===`media`)&&(p=d[p]),f+=`\n\n${p} {\n${c}\n}`,f}function x(e,t=`:root`){return`${t} {\n--radius: ${e};\n}`}function S(e,t,n){let r=s(n[e],t);t===`hsl`&&(r=o(r));let{color:i,alphaCss:a}=C(r,t,e);r=i;let c=`${l[e]}: ${r};\n`;return c+=a,c}function C(e,t,n){if(t===`oklch`||![`border`,`input`,`sidebarBorder`].includes(n))return{color:e,alphaCss:``};let[r,i=`1`]=e.split(`/`);r=r.trim(),i=i.trim();let a=Number.parseFloat(i);i.endsWith(`%`)&&(a/=100);let o=``;return n===`border`&&(o=`${u.borderAlpha}: ${a};\n`),n===`input`&&(o+=`${u.inputAlpha}: ${a};\n`),n===`sidebarBorder`&&(o+=`${u.sidebarBorderAlpha}: ${a};\n`),{color:r,alphaCss:o}}function w(e,n){let r=[`primary`,`destructive`,`success`,`warning`,`info`,`carbon`],a=``;return r.forEach(r=>{let c=t(s(e[r],n),n===`hsl`?`hslString`:`oklchString`);i(c).forEach(e=>{let t=c[e];n===`hsl`&&(t=o(t)),a+=`--${r}-${e}: ${t};\n`})}),a}function T(e){let{base:t=`gray`,primary:n=`indigo`,feedback:r=`classic`,sidebar:i=`extended`,preset:a,radius:o=`0.625rem`,styleTarget:s=`:root`,darkSelector:l=`class`,format:u=`hsl`}=e||{},d={base:{...f,...a?.base},primary:{...p,...a?.primary},feedback:{...m,...a?.feedback},sidebar:{...a?.sidebar}},h=new Map,g=e=>{let a={base:t,primary:n,feedback:r,sidebar:i,...e},o=c(a);if(h.has(o))return h.get(o);let f=b(v(a,d),{styleTarget:s,darkSelector:l,format:u});return h.set(o,f),f},_=(e=o)=>x(e,s);return{getCss:(e={base:t,primary:n,feedback:r,sidebar:i},a=o)=>`${_(a)}\n\n${g(e)}`,getColorCss:g,getRadiusCss:_}}export{f as builtinBasePreset,h as builtinBasePresetKeys,m as builtinFeedbackPreset,_ as builtinFeedbackPresetKeys,p as builtinPrimaryPreset,g as builtinPrimaryPresetKeys,T as createShadcnTheme};
|
|
1
|
+
import{colord as e}from"@soybeanjs/colord";import{generatePalette as t,simplePalette as n,tailwindPalette as r}from"@soybeanjs/colord/palette";function i(e){return Object.keys(e)}function a(e){return!e.startsWith(`hsl(`)&&!e.startsWith(`oklch(`)}function o(e){return e.replace(/hsl\(/g,``).replace(/\)/g,``)}const s=e=>[`inherit`,`currentColor`,`transparent`].includes(e);function c(t,i){let o=t;if(s(t))return o;if(t===`black`)return n.black[i];if(t===`white`)return n.white[i];if(a(t)){let[e,n]=t.split(`.`);o=r[e][n][i]}else i===`hsl`&&t.startsWith(`oklch(`)&&(o=e(t).toHslString()),i===`oklch`&&t.startsWith(`hsl(`)&&(o=e(t).toOklchString());return o}function l(e){let{base:t,primary:n,feedback:r,sidebar:i}=e;return`base:${t};primary:${n};feedback:${r};sidebar:${i}`}const u={background:`--background`,foreground:`--foreground`,card:`--card`,cardForeground:`--card-foreground`,popover:`--popover`,popoverForeground:`--popover-foreground`,primary:`--primary`,primaryForeground:`--primary-foreground`,secondary:`--secondary`,secondaryForeground:`--secondary-foreground`,muted:`--muted`,mutedForeground:`--muted-foreground`,accent:`--accent`,accentForeground:`--accent-foreground`,destructive:`--destructive`,destructiveForeground:`--destructive-foreground`,border:`--border`,input:`--input`,ring:`--ring`,success:`--success`,successForeground:`--success-foreground`,warning:`--warning`,warningForeground:`--warning-foreground`,info:`--info`,infoForeground:`--info-foreground`,carbon:`--carbon`,carbonForeground:`--carbon-foreground`,sidebar:`--sidebar`,sidebarForeground:`--sidebar-foreground`,sidebarPrimary:`--sidebar-primary`,sidebarPrimaryForeground:`--sidebar-primary-foreground`,sidebarAccent:`--sidebar-accent`,sidebarAccentForeground:`--sidebar-accent-foreground`,sidebarBorder:`--sidebar-border`,sidebarRing:`--sidebar-ring`,chart1:`--chart-1`,chart2:`--chart-2`,chart3:`--chart-3`,chart4:`--chart-4`,chart5:`--chart-5`},d={borderAlpha:`--border-alpha`,inputAlpha:`--input-alpha`,sidebarBorderAlpha:`--sidebar-border-alpha`},f={base:`neutral`,primary:`indigo`,feedback:`classic`},p={class:`.dark`,media:`@media (prefers-color-scheme: dark)`},m=`oklch(100% 0 0 / 0.1)`,h=`oklch(100% 0 0 / 0.15)`,g={stone:{light:{background:`white`,foreground:`stone.950`,card:`white`,cardForeground:`stone.950`,popover:`white`,popoverForeground:`stone.950`,primaryForeground:`stone.50`,secondary:`stone.100`,secondaryForeground:`stone.900`,muted:`stone.100`,mutedForeground:`stone.500`,accent:`stone.100`,accentForeground:`stone.900`,destructiveForeground:`stone.50`,successForeground:`stone.50`,warningForeground:`stone.50`,infoForeground:`stone.50`,carbon:`stone.800`,carbonForeground:`stone.50`,border:`stone.200`,input:`stone.200`},dark:{background:`stone.950`,foreground:`stone.50`,card:`stone.900`,cardForeground:`stone.50`,popover:`stone.900`,popoverForeground:`stone.50`,primaryForeground:`stone.900`,secondary:`stone.800`,secondaryForeground:`stone.50`,muted:`stone.800`,mutedForeground:`stone.400`,accent:`stone.800`,accentForeground:`stone.50`,destructiveForeground:`stone.900`,successForeground:`stone.900`,warningForeground:`stone.900`,infoForeground:`stone.900`,carbon:`stone.100`,carbonForeground:`stone.900`,border:m,input:h}},zinc:{light:{background:`white`,foreground:`zinc.950`,card:`white`,cardForeground:`zinc.950`,popover:`white`,popoverForeground:`zinc.950`,primaryForeground:`zinc.50`,secondary:`zinc.100`,secondaryForeground:`zinc.900`,muted:`zinc.100`,mutedForeground:`zinc.500`,accent:`zinc.100`,accentForeground:`zinc.900`,destructiveForeground:`zinc.50`,successForeground:`zinc.50`,warningForeground:`zinc.50`,infoForeground:`zinc.50`,carbon:`zinc.800`,carbonForeground:`zinc.50`,border:`zinc.200`,input:`zinc.200`},dark:{background:`zinc.950`,foreground:`zinc.50`,card:`zinc.900`,cardForeground:`zinc.50`,popover:`zinc.900`,popoverForeground:`zinc.50`,primaryForeground:`zinc.900`,secondary:`zinc.800`,secondaryForeground:`zinc.50`,muted:`zinc.800`,mutedForeground:`zinc.400`,accent:`zinc.800`,accentForeground:`zinc.50`,destructiveForeground:`zinc.900`,successForeground:`zinc.900`,warningForeground:`zinc.900`,infoForeground:`zinc.900`,carbon:`zinc.100`,carbonForeground:`zinc.900`,border:m,input:h}},neutral:{light:{background:`white`,foreground:`neutral.950`,card:`white`,cardForeground:`neutral.950`,popover:`white`,popoverForeground:`neutral.950`,primaryForeground:`neutral.50`,secondary:`neutral.100`,secondaryForeground:`neutral.900`,muted:`neutral.100`,mutedForeground:`neutral.500`,accent:`neutral.100`,accentForeground:`neutral.900`,destructiveForeground:`neutral.50`,successForeground:`neutral.50`,warningForeground:`neutral.50`,infoForeground:`neutral.50`,carbon:`neutral.800`,carbonForeground:`neutral.50`,border:`neutral.200`,input:`neutral.200`},dark:{background:`neutral.950`,foreground:`neutral.50`,card:`neutral.900`,cardForeground:`neutral.50`,popover:`neutral.900`,popoverForeground:`neutral.50`,primaryForeground:`neutral.900`,secondary:`neutral.800`,secondaryForeground:`neutral.50`,muted:`neutral.800`,mutedForeground:`neutral.400`,accent:`neutral.800`,accentForeground:`neutral.50`,destructiveForeground:`neutral.900`,successForeground:`neutral.900`,warningForeground:`neutral.900`,infoForeground:`neutral.900`,carbon:`neutral.100`,carbonForeground:`neutral.900`,border:m,input:h}},gray:{light:{background:`white`,foreground:`gray.950`,card:`white`,cardForeground:`gray.950`,popover:`white`,popoverForeground:`gray.950`,primaryForeground:`gray.50`,secondary:`gray.100`,secondaryForeground:`gray.900`,muted:`gray.100`,mutedForeground:`gray.500`,accent:`gray.100`,accentForeground:`gray.900`,carbon:`gray.800`,destructiveForeground:`gray.50`,successForeground:`gray.50`,warningForeground:`gray.50`,infoForeground:`gray.50`,carbonForeground:`gray.50`,border:`gray.200`,input:`gray.200`},dark:{background:`gray.950`,foreground:`gray.50`,card:`gray.900`,cardForeground:`gray.50`,popover:`gray.900`,popoverForeground:`gray.50`,primaryForeground:`gray.900`,secondary:`gray.800`,secondaryForeground:`gray.50`,muted:`gray.800`,mutedForeground:`gray.400`,accent:`gray.800`,accentForeground:`gray.50`,carbon:`gray.100`,destructiveForeground:`gray.900`,successForeground:`gray.900`,warningForeground:`gray.900`,infoForeground:`gray.900`,carbonForeground:`gray.900`,border:m,input:h}},slate:{light:{background:`white`,foreground:`slate.950`,card:`white`,cardForeground:`slate.950`,popover:`white`,popoverForeground:`slate.950`,primaryForeground:`slate.50`,secondary:`slate.100`,secondaryForeground:`slate.900`,muted:`slate.100`,mutedForeground:`slate.500`,accent:`slate.100`,accentForeground:`slate.900`,destructiveForeground:`slate.50`,successForeground:`slate.50`,warningForeground:`slate.50`,infoForeground:`slate.50`,carbon:`slate.800`,carbonForeground:`slate.50`,border:`slate.200`,input:`slate.200`},dark:{background:`slate.950`,foreground:`slate.50`,card:`slate.900`,cardForeground:`slate.50`,popover:`slate.900`,popoverForeground:`slate.50`,primaryForeground:`slate.900`,secondary:`slate.800`,secondaryForeground:`slate.50`,muted:`slate.800`,mutedForeground:`slate.400`,accent:`slate.800`,accentForeground:`slate.50`,carbon:`slate.100`,destructiveForeground:`slate.900`,successForeground:`slate.900`,warningForeground:`slate.900`,infoForeground:`slate.900`,carbonForeground:`slate.900`,border:m,input:h}}},_={stone:{light:{primary:`stone.800`,ring:`stone.400`,chart1:`orange.600`,chart2:`teal.600`,chart3:`cyan.900`,chart4:`amber.400`,chart5:`amber.500`},dark:{primary:`stone.200`,ring:`stone.500`,chart1:`blue.700`,chart2:`emerald.500`,chart3:`amber.500`,chart4:`purple.500`,chart5:`rose.500`}},zinc:{light:{primary:`zinc.800`,ring:`stone.400`,chart1:`orange.600`,chart2:`teal.600`,chart3:`cyan.900`,chart4:`amber.400`,chart5:`amber.500`},dark:{primary:`zinc.200`,ring:`zinc.500`,chart1:`blue.700`,chart2:`emerald.500`,chart3:`amber.500`,chart4:`purple.500`,chart5:`rose.500`}},neutral:{light:{primary:`neutral.800`,ring:`stone.400`,chart1:`orange.600`,chart2:`teal.600`,chart3:`cyan.900`,chart4:`amber.400`,chart5:`amber.500`},dark:{primary:`neutral.200`,ring:`neutral.500`,chart1:`blue.700`,chart2:`emerald.500`,chart3:`amber.500`,chart4:`purple.500`,chart5:`rose.500`}},gray:{light:{primary:`gray.800`,ring:`stone.400`,chart1:`orange.600`,chart2:`teal.600`,chart3:`cyan.900`,chart4:`amber.400`,chart5:`amber.500`},dark:{primary:`gray.200`,ring:`gray.500`,chart1:`blue.700`,chart2:`emerald.500`,chart3:`amber.500`,chart4:`purple.500`,chart5:`rose.500`}},slate:{light:{primary:`slate.800`,ring:`stone.400`,chart1:`orange.600`,chart2:`teal.600`,chart3:`cyan.900`,chart4:`amber.400`,chart5:`amber.500`},dark:{primary:`slate.200`,ring:`slate.500`,chart1:`blue.700`,chart2:`emerald.500`,chart3:`amber.500`,chart4:`purple.500`,chart5:`rose.500`}},red:{light:{primary:`red.500`,ring:`red.400`,chart1:`red.300`,chart2:`red.500`,chart3:`red.600`,chart4:`red.700`,chart5:`red.800`},dark:{primary:`red.500`,ring:`red.900`,chart1:`red.300`,chart2:`red.500`,chart3:`red.600`,chart4:`red.700`,chart5:`red.800`}},orange:{light:{primary:`orange.500`,ring:`orange.400`,chart1:`orange.300`,chart2:`orange.500`,chart3:`orange.600`,chart4:`orange.700`,chart5:`orange.800`},dark:{primary:`orange.500`,ring:`orange.900`,chart1:`orange.300`,chart2:`orange.500`,chart3:`orange.600`,chart4:`orange.700`,chart5:`orange.800`}},amber:{light:{primary:`amber.500`,ring:`amber.400`,chart1:`amber.300`,chart2:`amber.500`,chart3:`amber.600`,chart4:`amber.700`,chart5:`amber.800`},dark:{primary:`amber.500`,ring:`amber.900`,chart1:`amber.300`,chart2:`amber.500`,chart3:`amber.600`,chart4:`amber.700`,chart5:`amber.800`}},yellow:{light:{primary:`yellow.500`,ring:`yellow.400`,chart1:`yellow.300`,chart2:`yellow.500`,chart3:`yellow.600`,chart4:`yellow.700`,chart5:`yellow.800`},dark:{primary:`yellow.500`,ring:`yellow.900`,chart1:`yellow.300`,chart2:`yellow.500`,chart3:`yellow.600`,chart4:`yellow.700`,chart5:`yellow.800`}},lime:{light:{primary:`lime.500`,ring:`lime.400`,chart1:`lime.300`,chart2:`lime.500`,chart3:`lime.600`,chart4:`lime.700`,chart5:`lime.800`},dark:{primary:`lime.600`,ring:`lime.900`,chart1:`lime.300`,chart2:`lime.500`,chart3:`lime.600`,chart4:`lime.700`,chart5:`lime.800`}},green:{light:{primary:`green.500`,ring:`green.400`,chart1:`green.300`,chart2:`green.500`,chart3:`green.600`,chart4:`green.700`,chart5:`green.800`},dark:{primary:`green.600`,ring:`green.900`,chart1:`green.300`,chart2:`green.500`,chart3:`green.600`,chart4:`green.700`,chart5:`green.800`}},emerald:{light:{primary:`emerald.500`,ring:`emerald.400`,chart1:`emerald.300`,chart2:`emerald.500`,chart3:`emerald.600`,chart4:`emerald.700`,chart5:`emerald.800`},dark:{primary:`emerald.600`,ring:`emerald.900`,chart1:`emerald.300`,chart2:`emerald.500`,chart3:`emerald.600`,chart4:`emerald.700`,chart5:`emerald.800`}},teal:{light:{primary:`teal.500`,ring:`teal.400`,chart1:`teal.300`,chart2:`teal.500`,chart3:`teal.600`,chart4:`teal.700`,chart5:`teal.800`},dark:{primary:`teal.500`,ring:`teal.900`,chart1:`teal.300`,chart2:`teal.500`,chart3:`teal.600`,chart4:`teal.700`,chart5:`teal.800`}},cyan:{light:{primary:`cyan.500`,ring:`cyan.400`,chart1:`cyan.300`,chart2:`cyan.500`,chart3:`cyan.600`,chart4:`cyan.700`,chart5:`cyan.800`},dark:{primary:`cyan.500`,ring:`cyan.900`,chart1:`cyan.300`,chart2:`cyan.500`,chart3:`cyan.600`,chart4:`cyan.700`,chart5:`cyan.800`}},sky:{light:{primary:`sky.500`,ring:`sky.400`,chart1:`sky.300`,chart2:`sky.500`,chart3:`sky.600`,chart4:`sky.700`,chart5:`sky.800`},dark:{primary:`sky.500`,ring:`sky.900`,chart1:`sky.300`,chart2:`sky.500`,chart3:`sky.600`,chart4:`sky.700`,chart5:`sky.800`}},blue:{light:{primary:`blue.500`,ring:`blue.400`,chart1:`blue.300`,chart2:`blue.500`,chart3:`blue.600`,chart4:`blue.700`,chart5:`blue.800`},dark:{primary:`blue.500`,ring:`blue.900`,chart1:`blue.300`,chart2:`blue.500`,chart3:`blue.600`,chart4:`blue.700`,chart5:`blue.800`}},indigo:{light:{primary:`indigo.500`,ring:`indigo.400`,chart1:`indigo.300`,chart2:`indigo.500`,chart3:`indigo.600`,chart4:`indigo.700`,chart5:`indigo.800`},dark:{primary:`indigo.500`,ring:`indigo.900`,chart1:`indigo.300`,chart2:`indigo.500`,chart3:`indigo.600`,chart4:`indigo.700`,chart5:`indigo.800`}},violet:{light:{primary:`violet.500`,ring:`violet.400`,chart1:`violet.300`,chart2:`violet.500`,chart3:`violet.600`,chart4:`violet.700`,chart5:`violet.800`},dark:{primary:`violet.500`,ring:`violet.900`,chart1:`violet.300`,chart2:`violet.500`,chart3:`violet.600`,chart4:`violet.700`,chart5:`violet.800`}},purple:{light:{primary:`purple.500`,ring:`purple.400`,chart1:`purple.300`,chart2:`purple.500`,chart3:`purple.600`,chart4:`purple.700`,chart5:`purple.800`},dark:{primary:`purple.500`,ring:`purple.900`,chart1:`purple.300`,chart2:`purple.500`,chart3:`purple.600`,chart4:`purple.700`,chart5:`purple.800`}},fuchsia:{light:{primary:`fuchsia.500`,ring:`fuchsia.400`,chart1:`fuchsia.300`,chart2:`fuchsia.500`,chart3:`fuchsia.600`,chart4:`fuchsia.700`,chart5:`fuchsia.800`},dark:{primary:`fuchsia.500`,ring:`fuchsia.900`,chart1:`fuchsia.300`,chart2:`fuchsia.500`,chart3:`fuchsia.600`,chart4:`fuchsia.700`,chart5:`fuchsia.800`}},pink:{light:{primary:`pink.500`,ring:`pink.400`,chart1:`pink.300`,chart2:`pink.500`,chart3:`pink.600`,chart4:`pink.700`,chart5:`pink.800`},dark:{primary:`pink.500`,ring:`pink.900`,chart1:`pink.300`,chart2:`pink.500`,chart3:`pink.600`,chart4:`pink.700`,chart5:`pink.800`}},rose:{light:{primary:`rose.500`,ring:`rose.400`,chart1:`rose.300`,chart2:`rose.500`,chart3:`rose.600`,chart4:`rose.700`,chart5:`rose.800`},dark:{primary:`rose.500`,ring:`rose.900`,chart1:`rose.300`,chart2:`rose.500`,chart3:`rose.600`,chart4:`rose.700`,chart5:`rose.800`}}},v={classic:{light:{destructive:`red.500`,success:`green.500`,warning:`yellow.500`,info:`blue.500`},dark:{destructive:`red.400`,success:`green.400`,warning:`yellow.400`,info:`blue.400`}},vivid:{light:{destructive:`red.500`,success:`emerald.500`,warning:`amber.500`,info:`sky.500`},dark:{destructive:`red.400`,success:`emerald.400`,warning:`amber.400`,info:`sky.400`}},subtle:{light:{destructive:`rose.500`,success:`emerald.600`,warning:`amber.600`,info:`indigo.600`},dark:{destructive:`rose.300`,success:`emerald.300`,warning:`amber.300`,info:`indigo.300`}},warm:{light:{destructive:`red.600`,success:`lime.600`,warning:`orange.600`,info:`amber.700`},dark:{destructive:`red.400`,success:`lime.400`,warning:`orange.400`,info:`amber.400`}},cool:{light:{destructive:`rose.600`,success:`teal.600`,warning:`cyan.700`,info:`blue.600`},dark:{destructive:`rose.400`,success:`teal.400`,warning:`cyan.400`,info:`blue.400`}},nature:{light:{destructive:`red.700`,success:`green.700`,warning:`lime.700`,info:`teal.700`},dark:{destructive:`red.300`,success:`green.300`,warning:`lime.300`,info:`teal.300`}},modern:{light:{destructive:`rose.600`,success:`emerald.600`,warning:`orange.600`,info:`sky.600`},dark:{destructive:`rose.400`,success:`emerald.400`,warning:`orange.400`,info:`sky.400`}},vibrant:{light:{destructive:`pink.600`,success:`lime.600`,warning:`amber.600`,info:`cyan.600`},dark:{destructive:`pink.400`,success:`lime.400`,warning:`amber.400`,info:`cyan.400`}},professional:{light:{destructive:`red.700`,success:`green.700`,warning:`amber.700`,info:`blue.700`},dark:{destructive:`red.300`,success:`green.300`,warning:`amber.300`,info:`blue.300`}},soft:{light:{destructive:`rose.500`,success:`teal.500`,warning:`yellow.500`,info:`violet.500`},dark:{destructive:`rose.300`,success:`teal.300`,warning:`yellow.300`,info:`violet.300`}},bold:{light:{destructive:`red.700`,success:`emerald.700`,warning:`orange.700`,info:`blue.700`},dark:{destructive:`red.300`,success:`emerald.300`,warning:`orange.300`,info:`blue.300`}},calm:{light:{destructive:`rose.600`,success:`teal.600`,warning:`amber.600`,info:`slate.600`},dark:{destructive:`rose.400`,success:`teal.400`,warning:`amber.400`,info:`slate.400`}},candy:{light:{destructive:`pink.500`,success:`emerald.500`,warning:`yellow.500`,info:`sky.500`},dark:{destructive:`pink.300`,success:`emerald.300`,warning:`yellow.300`,info:`sky.300`}},deep:{light:{destructive:`red.800`,success:`green.800`,warning:`amber.800`,info:`blue.800`},dark:{destructive:`red.200`,success:`green.200`,warning:`amber.200`,info:`blue.200`}},light:{light:{destructive:`red.500`,success:`emerald.500`,warning:`amber.500`,info:`sky.500`},dark:{destructive:`red.400`,success:`emerald.400`,warning:`amber.400`,info:`sky.400`}}},y=i(g),b=i(_),x=i(v);function S(e,t){let n,r,i,a;if(t){let e=w(t);n=e.base,r=e.primary,i=e.feedback,a=e.sidebar}else{let{base:t,primary:o,feedback:s}=e;n=g[t],r=_[o],i=v[s],a=C(n,r)}return{light:{...n.light,...r.light,...i.light,...a.light},dark:{...n.dark,...r.dark,...i.dark,...a.dark}}}function C(e,t){return{light:{sidebar:e.light.background,sidebarForeground:e.light.foreground,sidebarPrimary:t.light.primary,sidebarPrimaryForeground:e.light.primaryForeground,sidebarAccent:e.light.accent,sidebarAccentForeground:e.light.accentForeground,sidebarBorder:e.light.border,sidebarRing:t.light.ring},dark:{sidebar:e.dark.card,sidebarForeground:e.dark.foreground,sidebarPrimary:t.dark.primary,sidebarPrimaryForeground:e.dark.primaryForeground,sidebarAccent:e.dark.accent,sidebarAccentForeground:e.dark.accentForeground,sidebarBorder:e.dark.border,sidebarRing:t.dark.ring}}}function w(e){let{light:t,dark:n}=e;return{base:{light:{background:t.background,foreground:t.background,card:t.background,cardForeground:t.background,popover:t.background,popoverForeground:t.background,primaryForeground:t.background,secondary:t.background,secondaryForeground:t.background,muted:t.background,mutedForeground:t.background,accent:t.background,accentForeground:t.background,destructiveForeground:t.background,successForeground:t.background,warningForeground:t.background,infoForeground:t.background,carbon:t.background,carbonForeground:t.background,border:t.background,input:t.background},dark:{background:n.background,foreground:n.background,card:n.background,cardForeground:n.background,popover:n.background,popoverForeground:n.background,primaryForeground:n.background,secondary:n.background,secondaryForeground:n.background,muted:n.background,mutedForeground:n.background,accent:n.background,accentForeground:n.background,destructiveForeground:n.background,successForeground:n.background,warningForeground:n.background,infoForeground:n.background,carbon:n.background,carbonForeground:n.background,border:n.background,input:n.background}},primary:{light:{primary:t.primary,ring:t.ring,chart1:t.chart1,chart2:t.chart2,chart3:t.chart3,chart4:t.chart4,chart5:t.chart5},dark:{primary:n.primary,ring:n.ring,chart1:n.chart1,chart2:n.chart2,chart3:n.chart3,chart4:n.chart4,chart5:n.chart5}},feedback:{light:{destructive:t.destructive,success:t.success,warning:t.warning,info:t.info},dark:{destructive:n.destructive,success:n.success,warning:n.warning,info:n.info}},sidebar:{light:{sidebar:t.sidebar,sidebarForeground:t.sidebarForeground,sidebarPrimary:t.sidebarPrimary,sidebarPrimaryForeground:t.sidebarPrimaryForeground,sidebarAccent:t.sidebarAccent,sidebarAccentForeground:t.sidebarAccentForeground,sidebarBorder:t.sidebarBorder,sidebarRing:t.sidebarRing},dark:{sidebar:n.sidebar,sidebarForeground:n.sidebarForeground,sidebarPrimary:n.sidebarPrimary,sidebarPrimaryForeground:n.sidebarPrimaryForeground,sidebarAccent:n.sidebarAccent,sidebarAccentForeground:n.sidebarAccentForeground,sidebarBorder:n.sidebarBorder,sidebarRing:n.sidebarRing}}}}function T(e,t){let{light:n,dark:r}=e,{format:a,styleTarget:o}=t,s=``,c=``;i(u).forEach(e=>{s+=D(e,a,n),c+=D(e,a,r)});let l=k(n,a),d=`${o} {\n${s}\n${l}\n}`,f=t.darkSelector;return(f===`class`||f===`media`)&&(f=p[f]),d+=`\n\n${f} {\n${c}\n}`,d}function E(e,t=`:root`){return`${t} {\n--radius: ${e};\n}`}function D(e,t,n){let r=c(n[e],t);t===`hsl`&&(r=o(r));let{color:i,alphaCss:a}=O(r,t,e);r=i;let s=`${u[e]}: ${r};\n`;return s+=a,s}function O(e,t,n){if(s(e)||t===`oklch`||![`border`,`input`,`sidebarBorder`].includes(n))return{color:e,alphaCss:``};let[r,i=`1`]=e.split(`/`);r=r.trim(),i=i.trim();let a=Number.parseFloat(i);i.endsWith(`%`)&&(a/=100);let o=``;return n===`border`&&(o=`${d.borderAlpha}: ${a};\n`),n===`input`&&(o+=`${d.inputAlpha}: ${a};\n`),n===`sidebarBorder`&&(o+=`${d.sidebarBorderAlpha}: ${a};\n`),{color:r,alphaCss:o}}function k(e,n){let r=[`primary`,`destructive`,`success`,`warning`,`info`,`carbon`],a=``;return r.forEach(r=>{let s=t(c(e[r],n),n===`hsl`?`hslString`:`oklchString`);i(s).forEach(e=>{let t=s[e];n===`hsl`&&(t=o(t)),a+=`--${r}-${e}: ${t};\n`})}),a}function A(e){let{base:t=f.base,primary:n=f.primary,feedback:r=f.feedback,sidebar:i=`extended`,preset:a,radius:o=`0.625rem`,styleTarget:s=`:root`,darkSelector:c=`class`,format:u=`hsl`}=e||{},d=new Map,p=e=>{let o={base:e?.base??t,primary:e?.primary??n,feedback:e?.feedback??r,sidebar:e?.sidebar??i},f=l(o);if(d.has(f))return d.get(f);let p=T(S(o,e?.preset??a),{styleTarget:s,darkSelector:c,format:u});return d.set(f,p),p},m=e=>E(e??o,s);return{getCss:(e,t)=>`${m(t??o)}\n\n${p(e)}`,getColorCss:p,getRadiusCss:m}}export{g as builtinBasePreset,y as builtinBasePresetKeys,v as builtinFeedbackPreset,x as builtinFeedbackPresetKeys,_ as builtinPrimaryPreset,b as builtinPrimaryPresetKeys,A as createShadcnTheme};
|
package/package.json
CHANGED
|
@@ -1,24 +1,27 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@soybeanjs/shadcn-theme",
|
|
3
|
-
"
|
|
4
|
-
"version": "0.1.0",
|
|
3
|
+
"version": "0.2.0",
|
|
5
4
|
"description": "A powerful and flexible shadcn/ui theme generator with support for dynamic CSS variable injection, preset color schemes, and light/dark mode switching.",
|
|
5
|
+
"homepage": "https://github.com/soybeanjs/shadcn-theme",
|
|
6
|
+
"bugs": {
|
|
7
|
+
"url": "https://github.com/soybeanjs/shadcn-theme/issues"
|
|
8
|
+
},
|
|
9
|
+
"license": "MIT",
|
|
6
10
|
"author": {
|
|
7
11
|
"name": "Soybean",
|
|
8
12
|
"email": "soybeanjs@outlook.com",
|
|
9
13
|
"url": "https://github.com/soybeanjs"
|
|
10
14
|
},
|
|
11
|
-
"license": "MIT",
|
|
12
|
-
"homepage": "https://github.com/soybeanjs/shadcn-theme",
|
|
13
15
|
"repository": {
|
|
14
16
|
"url": "https://github.com/soybeanjs/shadcn-theme.git"
|
|
15
17
|
},
|
|
16
|
-
"
|
|
17
|
-
"
|
|
18
|
-
|
|
19
|
-
"
|
|
20
|
-
|
|
21
|
-
|
|
18
|
+
"files": [
|
|
19
|
+
"dist"
|
|
20
|
+
],
|
|
21
|
+
"type": "module",
|
|
22
|
+
"main": "./dist/index.js",
|
|
23
|
+
"module": "./dist/index.js",
|
|
24
|
+
"types": "./dist/index.d.ts",
|
|
22
25
|
"exports": {
|
|
23
26
|
".": {
|
|
24
27
|
"types": "./dist/index.d.ts",
|
|
@@ -26,23 +29,20 @@
|
|
|
26
29
|
"require": "./dist/index.js"
|
|
27
30
|
}
|
|
28
31
|
},
|
|
29
|
-
"
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
"files": [
|
|
33
|
-
"dist"
|
|
34
|
-
],
|
|
32
|
+
"publishConfig": {
|
|
33
|
+
"registry": "https://registry.npmjs.org/"
|
|
34
|
+
},
|
|
35
35
|
"dependencies": {
|
|
36
|
-
"@soybeanjs/colord": "^0.
|
|
36
|
+
"@soybeanjs/colord": "^0.4.2"
|
|
37
37
|
},
|
|
38
38
|
"devDependencies": {
|
|
39
|
-
"@soybeanjs/cli": "1.
|
|
40
|
-
"@
|
|
41
|
-
"@types/node": "25.0.9",
|
|
42
|
-
"eslint": "9.39.2",
|
|
39
|
+
"@soybeanjs/cli": "1.5.0",
|
|
40
|
+
"@types/node": "25.2.1",
|
|
43
41
|
"lint-staged": "16.2.7",
|
|
42
|
+
"oxfmt": "^0.28.0",
|
|
43
|
+
"oxlint": "^1.43.0",
|
|
44
44
|
"simple-git-hooks": "2.13.1",
|
|
45
|
-
"tsdown": "0.
|
|
45
|
+
"tsdown": "0.20.3",
|
|
46
46
|
"tsx": "4.21.0",
|
|
47
47
|
"typescript": "5.9.3"
|
|
48
48
|
},
|
|
@@ -51,17 +51,18 @@
|
|
|
51
51
|
"pre-commit": "pnpm typecheck && pnpm lint-staged"
|
|
52
52
|
},
|
|
53
53
|
"lint-staged": {
|
|
54
|
-
"*": "
|
|
54
|
+
"*": "oxlint --fix && oxfmt"
|
|
55
55
|
},
|
|
56
56
|
"scripts": {
|
|
57
57
|
"build": "tsdown",
|
|
58
58
|
"cleanup": "soy cleanup",
|
|
59
59
|
"commit": "soy git-commit",
|
|
60
60
|
"dev": "tsup --watch",
|
|
61
|
-
"
|
|
61
|
+
"fmt": "oxfmt",
|
|
62
|
+
"lint": "oxlint --fix",
|
|
62
63
|
"publish-pkg": "pnpm publish --access public",
|
|
63
64
|
"release": "soy release",
|
|
64
65
|
"typecheck": "tsc --noEmit --skipLibCheck",
|
|
65
|
-
"
|
|
66
|
+
"upkg": "soy ncu"
|
|
66
67
|
}
|
|
67
68
|
}
|