@upstart.gg/sdk 0.0.138 → 0.0.139

package/dist/shared/theme.js

@@ -1,21 +1,264 @@
-/*! Upstart.gg - Copyright (C) 2024 Flippable - https://github.com/upstart-gg/upstart/blob/main/LICENSE */
+import { StringEnum } from "./utils/string-enum.js";
+import { Type } from "@sinclair/typebox";
+import chroma from "chroma-js";
+import { colorPalette } from "@upstart.gg/style-system/colors";
 
-import {
-  defaultTheme,
-  fontStacks,
-  isDefaultTheme,
-  processTheme,
-  themeSchema,
-  themesArray
-} from "./chunk-FD7YYFRI.js";
-import "./chunk-GDYCCB3B.js";
-import "./chunk-ZGQ3AQBG.js";
-export {
-  defaultTheme,
-  fontStacks,
-  isDefaultTheme,
-  processTheme,
-  themeSchema,
-  themesArray
+//#region src/shared/theme.ts
+const fontStacks = [
+	{
+		value: "system-ui",
+		label: "System UI"
+	},
+	{
+		value: "transitional",
+		label: "Transitional"
+	},
+	{
+		value: "old-style",
+		label: "Old style"
+	},
+	{
+		value: "humanist",
+		label: "Humanist"
+	},
+	{
+		value: "geometric-humanist",
+		label: "Geometric humanist"
+	},
+	{
+		value: "classical-humanist",
+		label: "Classical humanist"
+	},
+	{
+		value: "neo-grotesque",
+		label: "Neo-grotesque"
+	},
+	{
+		value: "monospace-slab-serif",
+		label: "Monospace slab serif"
+	},
+	{
+		value: "monospace-code",
+		label: "Monospace code"
+	},
+	{
+		value: "industrial",
+		label: "Industrial"
+	},
+	{
+		value: "rounded-sans",
+		label: "Rounded sans"
+	},
+	{
+		value: "slab-serif",
+		label: "Slab serif"
+	},
+	{
+		value: "antique",
+		label: "Antique"
+	},
+	{
+		value: "didone",
+		label: "Didone"
+	},
+	{
+		value: "handwritten",
+		label: "Handwritten"
+	}
+];
+const headingFont = Type.Object({
+	type: StringEnum([
+		"stack",
+		"theme",
+		"google"
+	], {
+		title: "Type of font",
+		description: "The type of font. Can be a font stack, a theme font or a Google font"
+	}),
+	family: Type.String({
+		title: "Family",
+		description: "The font family (eg. the name of the font)"
+	})
+}, {
+	title: "Headings font",
+	description: "Used for titles and headings"
+});
+const bodyFont = Type.Object({
+	type: StringEnum([
+		"stack",
+		"theme",
+		"google"
+	], {
+		title: "Type of font",
+		description: "The type of font. Can be a font stack, a theme font or a Google font"
+	}),
+	family: Type.String({
+		title: "Family",
+		description: "The font family (eg. the name of the font)"
+	})
+}, {
+	title: "Body font",
+	description: "Used for paragraphs and body text"
+});
+const themeSchema = Type.Object({
+	id: Type.String({
+		title: "ID",
+		description: "The unique identifier of the theme"
+	}),
+	name: Type.String({
+		title: "Name",
+		description: "The name of the theme"
+	}),
+	description: Type.String({
+		title: "Description",
+		description: "The description of the theme"
+	}),
+	tags: Type.Array(Type.String({ title: "Tag" }), {
+		title: "Tags",
+		description: "The tags of the theme"
+	}),
+	browserColorScheme: StringEnum(["light", "dark"], {
+		title: "Browser scheme",
+		description: "Color of browser-provided UI. Either 'light' or 'dark'"
+	}),
+	colors: Type.Object({
+		primary: Type.String({
+			title: "Primary",
+			description: "The brand's primary color.",
+			"ai:instructions": "Use oklch() css notation.",
+			examples: ["oklch(0.62 0.241 354.308)"]
+		}),
+		secondary: Type.String({
+			title: "Secondary",
+			description: "The brand's second most used color",
+			"ai:instructions": "Use oklch() css notation.",
+			examples: ["oklch(0.65 0.22 185)"]
+		}),
+		accent: Type.String({
+			title: "Accent",
+			description: "The brand's least used color",
+			"ai:instructions": "Use oklch() css notation.",
+			examples: ["oklch(0.82 0.18 85)"]
+		}),
+		neutral: Type.String({
+			title: "Neutral",
+			description: "The base neutral color",
+			"ai:instructions": "Use oklch() css notation.",
+			examples: ["oklch(0.38 0.08 280)"]
+		}),
+		base100: Type.String({
+			title: "Base",
+			description: "Base surface color of page, used for blank backgrounds. Should be white or near-white for light color-schemes, and black or near-black for dark color-schemes.",
+			"ai:instructions": "Use oklab() css notation.",
+			examples: ["oklch(0.99 0.008 92)"]
+		}),
+		base200: Type.String({
+			title: "Base 2",
+			description: "Should be darker than base 100 but still light for light color-schemes, and lighter but still dark for dark color-schemes.",
+			"ai:instructions": "Use oklab() css notation.",
+			examples: ["oklch(0.97 0.01 85)"]
+		}),
+		base300: Type.String({
+			title: "Base 3",
+			description: "3rd base color, should be darker than base 200 for light color-schemes, and lighter than base 200 for dark color-schemes.",
+			"ai:instructions": "Use oklab() css notation.",
+			examples: ["oklch(0.95 0.02 80)"]
+		})
+	}, {
+		title: "Theme base colors",
+		description: "The base colors of the theme. Each theme must declare all these colors"
+	}),
+	typography: Type.Object({
+		base: Type.Number({
+			title: "Base font size",
+			description: "The base font size in pixels. It is safe to keep it as is.",
+			"ai:instructions": "A safe value is 16."
+		}),
+		heading: headingFont,
+		body: bodyFont,
+		alternatives: Type.Array(Type.Object({
+			body: bodyFont,
+			heading: headingFont
+		}), {
+			title: "Alternative fonts",
+			description: "Alternative fonts that can be suggested to the user. Takes the same shape"
+		})
+	})
+});
+const themesArray = Type.Array(themeSchema);
+const defaultTheme = {
+	id: "_default_",
+	name: "default",
+	description: "Default Upstart theme",
+	tags: [
+		"gradient",
+		"vibrant",
+		"modern",
+		"creative",
+		"dynamic",
+		"artistic",
+		"bold"
+	],
+	browserColorScheme: "light",
+	colors: {
+		base100: "#FFF",
+		base200: "#F5F0E1",
+		base300: "#F0E3D2",
+		primary: "#FF6F20",
+		secondary: "#00BFFF",
+		accent: "#A4D65E",
+		neutral: "#B0B0B0"
+	},
+	typography: {
+		base: 16,
+		heading: {
+			type: "stack",
+			family: "system-ui"
+		},
+		body: {
+			type: "stack",
+			family: "system-ui"
+		},
+		alternatives: []
+	}
 };
+function isDefaultTheme(theme) {
+	return theme.id === defaultTheme.id;
+}
+/**
+* Process a theme, eventually fixing colors and translating them to oklch notations
+* @param theme
+*/
+function processTheme(theme) {
+	return {
+		...theme,
+		typography: {
+			...theme.typography,
+			base: 16
+		},
+		colors: Object.entries(theme.colors).reduce((acc, [key, value]) => {
+			const fixedColor = fixOklchColor(value);
+			return {
+				...acc,
+				[key]: fixedColor
+			};
+		}, {})
+	};
+}
+function fixOklchColor(color) {
+	if (chroma.valid(color)) return color;
+	if (/ok(lch|lab)\(([^)]+)\)/.test(color)) {
+		const withoutComma = color.replace(/,/g, " ");
+		if (chroma.valid(withoutComma)) return withoutComma;
+	}
+	if (/^([a-z]+)-([0-9]+)$/.test(color)) {
+		const [name, shade] = color.split("-");
+		const twColor = colorPalette[name]?.[shade];
+		if (twColor) return twColor;
+	}
+	return color;
+}
+
+//#endregion
+export { defaultTheme, fontStacks, isDefaultTheme, processTheme, themeSchema, themesArray };
 //# sourceMappingURL=theme.js.map

package/dist/shared/theme.js.map

@@ -1 +1 @@
-{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}
+{"version":3,"file":"theme.js","names":["defaultTheme: Theme"],"sources":["../../src/shared/theme.ts"],"sourcesContent":["import { Type, type Static } from \"@sinclair/typebox\";\nimport chroma from \"chroma-js\";\nimport { colorPalette } from \"@upstart.gg/style-system/colors\";\nimport { StringEnum } from \"./utils/string-enum\";\nimport { toLLMSchema } from \"./utils/llm\";\n\nexport const fontStacks = [\n  { value: \"system-ui\", label: \"System UI\" },\n  { value: \"transitional\", label: \"Transitional\" },\n  { value: \"old-style\", label: \"Old style\" },\n  { value: \"humanist\", label: \"Humanist\" },\n  { value: \"geometric-humanist\", label: \"Geometric humanist\" },\n  { value: \"classical-humanist\", label: \"Classical humanist\" },\n  { value: \"neo-grotesque\", label: \"Neo-grotesque\" },\n  { value: \"monospace-slab-serif\", label: \"Monospace slab serif\" },\n  { value: \"monospace-code\", label: \"Monospace code\" },\n  { value: \"industrial\", label: \"Industrial\" },\n  { value: \"rounded-sans\", label: \"Rounded sans\" },\n  { value: \"slab-serif\", label: \"Slab serif\" },\n  { value: \"antique\", label: \"Antique\" },\n  { value: \"didone\", label: \"Didone\" },\n  { value: \"handwritten\", label: \"Handwritten\" },\n];\n\nconst headingFont = Type.Object(\n  {\n    type: StringEnum([\"stack\", \"theme\", \"google\"], {\n      title: \"Type of font\",\n      description: \"The type of font. Can be a font stack, a theme font or a Google font\",\n    }),\n    family: Type.String({\n      title: \"Family\",\n      description: \"The font family (eg. the name of the font)\",\n    }),\n  },\n  {\n    title: \"Headings font\",\n    description: \"Used for titles and headings\",\n  },\n);\n\nconst bodyFont = Type.Object(\n  {\n    type: StringEnum([\"stack\", \"theme\", \"google\"], {\n      title: \"Type of font\",\n      description: \"The type of font. Can be a font stack, a theme font or a Google font\",\n    }),\n    family: Type.String({\n      title: \"Family\",\n      description: \"The font family (eg. the name of the font)\",\n    }),\n  },\n  {\n    title: \"Body font\",\n    description: \"Used for paragraphs and body text\",\n  },\n);\n\nexport const themeSchema = Type.Object({\n  id: Type.String({ title: \"ID\", description: \"The unique identifier of the theme\" }),\n  name: Type.String({ title: \"Name\", description: \"The name of the theme\" }),\n  description: Type.String({ title: \"Description\", description: \"The description of the theme\" }),\n  tags: Type.Array(Type.String({ title: \"Tag\" }), { title: \"Tags\", description: \"The tags of the theme\" }),\n  browserColorScheme: StringEnum([\"light\", \"dark\"], {\n    title: \"Browser scheme\",\n    description: \"Color of browser-provided UI. Either 'light' or 'dark'\",\n  }),\n  // Define the theme colors\n  colors: Type.Object(\n    {\n      primary: Type.String({\n        title: \"Primary\",\n        description: \"The brand's primary color.\",\n        \"ai:instructions\": \"Use oklch() css notation.\",\n        examples: [\"oklch(0.62 0.241 354.308)\"],\n      }),\n      secondary: Type.String({\n        title: \"Secondary\",\n        description: \"The brand's second most used color\",\n        \"ai:instructions\": \"Use oklch() css notation.\",\n        examples: [\"oklch(0.65 0.22 185)\"],\n      }),\n      accent: Type.String({\n        title: \"Accent\",\n        description: \"The brand's least used color\",\n        \"ai:instructions\": \"Use oklch() css notation.\",\n        examples: [\"oklch(0.82 0.18 85)\"],\n      }),\n      neutral: Type.String({\n        title: \"Neutral\",\n        description: \"The base neutral color\",\n        \"ai:instructions\": \"Use oklch() css notation.\",\n        examples: [\"oklch(0.38 0.08 280)\"],\n      }),\n      base100: Type.String({\n        title: \"Base\",\n        description:\n          \"Base surface color of page, used for blank backgrounds. Should be white or near-white for light color-schemes, and black or near-black for dark color-schemes.\",\n        \"ai:instructions\": \"Use oklab() css notation.\",\n        examples: [\"oklch(0.99 0.008 92)\"],\n      }),\n      base200: Type.String({\n        title: \"Base 2\",\n        description:\n          \"Should be darker than base 100 but still light for light color-schemes, and lighter but still dark for dark color-schemes.\",\n        \"ai:instructions\": \"Use oklab() css notation.\",\n        examples: [\"oklch(0.97 0.01 85)\"],\n      }),\n      base300: Type.String({\n        title: \"Base 3\",\n        description:\n          \"3rd base color, should be darker than base 200 for light color-schemes, and lighter than base 200 for dark color-schemes.\",\n        \"ai:instructions\": \"Use oklab() css notation.\",\n        examples: [\"oklch(0.95 0.02 80)\"],\n      }),\n    },\n    {\n      title: \"Theme base colors\",\n      description: \"The base colors of the theme. Each theme must declare all these colors\",\n    },\n  ),\n\n  // Define the theme typography\n  typography: Type.Object({\n    base: Type.Number({\n      title: \"Base font size\",\n      description: \"The base font size in pixels. It is safe to keep it as is.\",\n      \"ai:instructions\": \"A safe value is 16.\",\n    }),\n    heading: headingFont,\n    body: bodyFont,\n    alternatives: Type.Array(\n      Type.Object({\n        body: bodyFont,\n        heading: headingFont,\n      }),\n      {\n        title: \"Alternative fonts\",\n        description: \"Alternative fonts that can be suggested to the user. Takes the same shape\",\n      },\n    ),\n  }),\n});\n\nexport type Theme = Static<typeof themeSchema>;\nexport const themesArray = Type.Array(themeSchema);\n\nexport type ThemesArray = Static<typeof themesArray>;\nexport type FontType = Theme[\"typography\"][\"body\"];\n\nexport const defaultTheme: Theme = {\n  id: \"_default_\",\n  name: \"default\",\n  description: \"Default Upstart theme\",\n  tags: [\"gradient\", \"vibrant\", \"modern\", \"creative\", \"dynamic\", \"artistic\", \"bold\"],\n  browserColorScheme: \"light\",\n  colors: {\n    base100: \"#FFF\", // Warm white background\n    base200: \"#F5F0E1\", // Soft cream in hex\n    base300: \"#F0E3D2\", // Light warm gray in hex\n    primary: \"#FF6F20\", // A vibrant orange in hex\n    secondary: \"#00BFFF\", // A bright cyan in hex\n    accent: \"#A4D65E\", // A lively lime green in hex\n    neutral: \"#B0B0B0\", // A balanced gray in hex\n  },\n  typography: {\n    base: 16,\n    heading: { type: \"stack\", family: \"system-ui\" },\n    body: { type: \"stack\", family: \"system-ui\" },\n    alternatives: [],\n  },\n};\n\nexport function isDefaultTheme(theme: Theme): boolean {\n  return theme.id === defaultTheme.id;\n}\n\n/**\n * Process a theme, eventually fixing colors and translating them to oklch notations\n * @param theme\n */\nexport function processTheme(theme: Theme): Theme {\n  return {\n    ...theme,\n    typography: {\n      ...theme.typography,\n      base: 16, // override any base size\n    },\n    colors: Object.entries(theme.colors).reduce(\n      (acc, [key, value]) => {\n        const fixedColor = fixOklchColor(value);\n        return {\n          // biome-ignore lint/performance/noAccumulatingSpread: <explanation>\n          ...acc,\n          [key]: fixedColor,\n        };\n      },\n      {} as typeof theme.colors,\n    ),\n  };\n}\n\nfunction fixOklchColor(color: string) {\n  const valid = chroma.valid(color);\n  if (valid) {\n    return color;\n  }\n  // Try to fix the color if it looks like oklch\n  const oklchRegex = /ok(lch|lab)\\(([^)]+)\\)/;\n  if (oklchRegex.test(color)) {\n    const withoutComma = color.replace(/,/g, \" \");\n    if (chroma.valid(withoutComma)) {\n      return withoutComma;\n    }\n  }\n  // tailwind colors\n  if (/^([a-z]+)-([0-9]+)$/.test(color)) {\n    const [name, shade] = color.split(\"-\");\n    // @ts-ignore\n    const twColor = colorPalette[name]?.[shade] as string | undefined;\n    if (twColor) {\n      return twColor;\n    }\n  }\n  return color;\n}\n"],"mappings":"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"}

package/dist/shared/themes/color-system.d.ts

@@ -1,14 +1,18 @@
+import { Theme } from "../theme.js";
 import chroma from "chroma-js";
-import type { Theme } from "../theme";
-export type ColorType = keyof Theme["colors"];
-export type ElementColorType = "page-background" | "background" | "text" | "border" | "shadow";
-export declare const baseColors: Record<ColorType, string>;
-export declare const shadeNumbers: readonly [900, 800, 700, 600, 500, 400, 300, 200, 100, 50];
-export type ElementColor = string;
-export declare function getColorsSuggestions(baseHueOrColor: number | string, theme: Theme): never[];
-export declare function isStandardColor(color: unknown): boolean;
-export declare function propToStyle(prop: string | number | undefined, cssAttr: string): string | undefined;
-export declare function getContrastingTextColor(backgroundColor: string | chroma.Color, contrastThreshold?: number): string;
-export declare function propToClass(value: string | number | undefined, classPrefix: string): string | undefined;
-export declare function generateColorsVars(theme: Theme): Record<string, string>;
+
+//#region src/shared/themes/color-system.d.ts
+type ColorType = keyof Theme["colors"];
+type ElementColorType = "page-background" | "background" | "text" | "border" | "shadow";
+declare const baseColors: Record<ColorType, string>;
+declare const shadeNumbers: readonly [900, 800, 700, 600, 500, 400, 300, 200, 100, 50];
+type ElementColor = string;
+declare function getColorsSuggestions(baseHueOrColor: number | string, theme: Theme): never[];
+declare function isStandardColor(color: unknown): boolean;
+declare function propToStyle(prop: string | number | undefined, cssAttr: string): string | undefined;
+declare function getContrastingTextColor(backgroundColor: string | chroma.Color, contrastThreshold?: number): string;
+declare function propToClass(value: string | number | undefined, classPrefix: string): string | undefined;
+declare function generateColorsVars(theme: Theme): Record<string, string>;
+//#endregion
+export { ColorType, ElementColor, ElementColorType, baseColors, generateColorsVars, getColorsSuggestions, getContrastingTextColor, isStandardColor, propToClass, propToStyle, shadeNumbers };
 //# sourceMappingURL=color-system.d.ts.map

package/dist/shared/themes/color-system.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"color-system.d.ts","sourceRoot":"","sources":["../../../src/shared/themes/color-system.ts"],"names":[],"mappings":"AAAA,OAAO,MAAM,MAAM,WAAW,CAAC;AAC/B,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,UAAU,CAAC;AAItC,MAAM,MAAM,SAAS,GAAG,MAAM,KAAK,CAAC,QAAQ,CAAC,CAAC;AAC9C,MAAM,MAAM,gBAAgB,GAAG,iBAAiB,GAAG,YAAY,GAAG,MAAM,GAAG,QAAQ,GAAG,QAAQ,CAAC;AAE/F,eAAO,MAAM,UAAU,EAAE,MAAM,CAAC,SAAS,EAAE,MAAM,CAQhD,CAAC;AAEF,eAAO,MAAM,YAAY,4DAA6D,CAAC;AASvF,MAAM,MAAM,YAAY,GAAG,MAAM,CAAC;AAElC,wBAAgB,oBAAoB,CAAC,cAAc,EAAE,MAAM,GAAG,MAAM,EAAE,KAAK,EAAE,KAAK,WAEjF;AAED,wBAAgB,eAAe,CAAC,KAAK,EAAE,OAAO,GAAG,OAAO,CAYvD;AAED,wBAAgB,WAAW,CAAC,IAAI,EAAE,MAAM,GAAG,MAAM,GAAG,SAAS,EAAE,OAAO,EAAE,MAAM,sBAM7E;AAED,wBAAgB,uBAAuB,CACrC,eAAe,EAAE,MAAM,GAAG,MAAM,CAAC,KAAK,EACtC,iBAAiB,SAAM,GACtB,MAAM,CA8BR;AACD,wBAAgB,WAAW,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,GAAG,SAAS,EAAE,WAAW,EAAE,MAAM,sBAKlF;AAED,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,KAAK,0BAgD9C"}
+{"version":3,"file":"color-system.d.ts","names":[],"sources":["../../../src/shared/themes/color-system.ts"],"sourcesContent":[],"mappings":";;;;KAKY,SAAA,SAAkB;KAClB,gBAAA;AADA,cAGC,UAHiB,EAGL,MAHU,CAGH,SAHG,EAAA,MAAA,CAAA;AACvB,cAYC,YAZe,EAAA,SAAA,CAAA,GAAA,EAAA,GAAA,EAAA,GAAA,EAAA,GAAA,EAAA,GAAA,EAAA,GAAA,EAAA,GAAA,EAAA,GAAA,EAAA,GAAA,EAAA,EAAA,CAAA;AAEf,KAmBD,YAAA,GAXX,MAAA;AAAA,iBAae,oBAAA,CAbf,cAAA,EAAA,MAAA,GAAA,MAAA,EAAA,KAAA,EAa4E,KAb5E,CAAA,EAAA,KAAA,EAAA;AAR+B,iBAyBhB,eAAA,CAzBgB,KAAA,EAAA,OAAA,CAAA,EAAA,OAAA;AAAP,iBAuCT,WAAA,CAvCS,IAAA,EAAA,MAAA,GAAA,MAAA,GAAA,SAAA,EAAA,OAAA,EAAA,MAAA,CAAA,EAAA,MAAA,GAAA,SAAA;AAAM,iBA+Cf,uBAAA,CA/Ce,eAAA,EAAA,MAAA,GAgDH,MAAA,CAAO,KAhDJ,EAAA,iBAAA,CAAA,EAAA,MAAA,CAAA,EAAA,MAAA;AAUlB,iBAuEG,WAAA,CAvEsE,KAAA,EAAA,MAAA,GAAA,MAAA,GAAA,SAAA,EAAA,WAAA,EAAA,MAAA,CAAA,EAAA,MAAA,GAAA,SAAA;AAS1E,iBAqEI,kBAAA,CArEQ,KAAA,EAqEkB,KArElB,CAAA,EAqEuB,MArEvB,CAAA,MAAA,EAAA,MAAA,CAAA"}

package/dist/shared/themes/color-system.js

@@ -1,106 +1,98 @@
-/*! Upstart.gg - Copyright (C) 2024 Flippable - https://github.com/upstart-gg/upstart/blob/main/LICENSE */
-
-import "../chunk-ZGQ3AQBG.js";
-
-// src/shared/themes/color-system.ts
-import chroma from "chroma-js";
 import { kebabCase } from "lodash-es";
+import chroma from "chroma-js";
 import { css } from "@upstart.gg/style-system/twind";
-var baseColors = {
-  primary: "Primary color",
-  secondary: "Secondary color",
-  accent: "Accent color",
-  neutral: "Neutral color",
-  base100: "Base color",
-  base200: "Base (level 2)",
-  base300: "Base (level 3)"
+
+//#region src/shared/themes/color-system.ts
+const baseColors = {
+	primary: "Primary color",
+	secondary: "Secondary color",
+	accent: "Accent color",
+	neutral: "Neutral color",
+	base100: "Base color",
+	base200: "Base (level 2)",
+	base300: "Base (level 3)"
 };
-var shadeNumbers = [900, 800, 700, 600, 500, 400, 300, 200, 100, 50];
-var semanticAliases = {
-  100: "subtle",
-  300: "light",
-  700: "dark"
+const shadeNumbers = [
+	900,
+	800,
+	700,
+	600,
+	500,
+	400,
+	300,
+	200,
+	100,
+	50
+];
+const semanticAliases = {
+	100: "subtle",
+	300: "light",
+	700: "dark"
 };
 function getColorsSuggestions(baseHueOrColor, theme) {
-  return [];
+	return [];
 }
 function isStandardColor(color) {
-  if (typeof color !== "string") {
-    return false;
-  }
-  return color.startsWith("oklch") || color.startsWith("oklab") || color.startsWith("rgb") || color.startsWith("hsl") || color.startsWith("#") || color.startsWith("var(--");
+	if (typeof color !== "string") return false;
+	return color.startsWith("oklch") || color.startsWith("oklab") || color.startsWith("rgb") || color.startsWith("hsl") || color.startsWith("#") || color.startsWith("var(--");
 }
 function propToStyle(prop, cssAttr) {
-  if (typeof prop === "undefined") {
-    return void 0;
-  }
-  return isStandardColor(prop) || typeof prop === "number" ? css({ [cssAttr]: prop }) : prop;
+	if (typeof prop === "undefined") return;
+	return isStandardColor(prop) || typeof prop === "number" ? css({ [cssAttr]: prop }) : prop;
 }
 function getContrastingTextColor(backgroundColor, contrastThreshold = 3.5) {
-  const bgColor = chroma(backgroundColor);
-  const white = "#ffffff";
-  const black = "#000000";
-  const contrastWithWhite = chroma.contrast(bgColor, white);
-  const contrastWithBlack = chroma.contrast(bgColor, black);
-  if (contrastWithWhite >= contrastThreshold && contrastWithBlack >= contrastThreshold) {
-    return white;
-  }
-  if (contrastWithWhite >= contrastThreshold) {
-    return white;
-  }
-  if (contrastWithBlack >= contrastThreshold) {
-    return black;
-  }
-  return contrastWithWhite >= contrastWithBlack ? white : black;
+	const bgColor = chroma(backgroundColor);
+	const white = "#ffffff";
+	const black = "#000000";
+	const contrastWithWhite = chroma.contrast(bgColor, white);
+	const contrastWithBlack = chroma.contrast(bgColor, black);
+	if (contrastWithWhite >= contrastThreshold && contrastWithBlack >= contrastThreshold) return white;
+	if (contrastWithWhite >= contrastThreshold) return white;
+	if (contrastWithBlack >= contrastThreshold) return black;
+	return contrastWithWhite >= contrastWithBlack ? white : black;
 }
 function propToClass(value, classPrefix) {
-  if (typeof value === "undefined") {
-    return void 0;
-  }
-  return isStandardColor(value) || typeof value === "number" ? `${classPrefix}-[${value}]` : value;
+	if (typeof value === "undefined") return;
+	return isStandardColor(value) || typeof value === "number" ? `${classPrefix}-[${value}]` : value;
 }
 function generateColorsVars(theme) {
-  const shades = {};
-  const colorNames = Object.keys(baseColors);
-  colorNames.forEach((_colorName) => {
-    const color = theme.colors[_colorName];
-    const colorName = kebabCase(_colorName);
-    shades[`color-${colorName}`] = color;
-    shades[`color-${colorName}-500`] = color;
-    const contentColor = getContrastingTextColor(color);
-    shades[`color-${colorName}-content`] = contentColor;
-    shades[`color-${colorName}-500-content`] = contentColor;
-    const baseColor = chroma(color);
-    const darkest = baseColor.darken(2.5);
-    const lightest = baseColor.brighten(3.5);
-    const colorScale = chroma.scale([lightest, baseColor, darkest]).domain([50, 500, 900]).mode("oklch");
-    if (!colorName.startsWith("base")) {
-      shadeNumbers.forEach((shade) => {
-        if (shade === 500) {
-          return;
-        }
-        const varName = `color-${colorName}-${shade}`;
-        const shadedColor = colorScale(shade);
-        shades[varName] = shadedColor.css("oklch");
-        const contentColor2 = getContrastingTextColor(shadedColor);
-        shades[`color-${colorName}-${shade}-content`] = contentColor2;
-        if (semanticAliases[shade]) {
-          shades[`color-${colorName}-${semanticAliases[shade]}`] = shades[varName];
-          shades[`color-${colorName}-${semanticAliases[shade]}-content`] = contentColor2;
-        }
-      });
-    }
-  });
-  return shades;
+	const shades = {};
+	Object.keys(baseColors).forEach((_colorName) => {
+		const color = theme.colors[_colorName];
+		const colorName = kebabCase(_colorName);
+		shades[`color-${colorName}`] = color;
+		shades[`color-${colorName}-500`] = color;
+		const contentColor = getContrastingTextColor(color);
+		shades[`color-${colorName}-content`] = contentColor;
+		shades[`color-${colorName}-500-content`] = contentColor;
+		const baseColor = chroma(color);
+		const darkest = baseColor.darken(2.5);
+		const lightest = baseColor.brighten(3.5);
+		const colorScale = chroma.scale([
+			lightest,
+			baseColor,
+			darkest
+		]).domain([
+			50,
+			500,
+			900
+		]).mode("oklch");
+		if (!colorName.startsWith("base")) shadeNumbers.forEach((shade) => {
+			if (shade === 500) return;
+			const varName = `color-${colorName}-${shade}`;
+			const shadedColor = colorScale(shade);
+			shades[varName] = shadedColor.css("oklch");
+			const contentColor$1 = getContrastingTextColor(shadedColor);
+			shades[`color-${colorName}-${shade}-content`] = contentColor$1;
+			if (semanticAliases[shade]) {
+				shades[`color-${colorName}-${semanticAliases[shade]}`] = shades[varName];
+				shades[`color-${colorName}-${semanticAliases[shade]}-content`] = contentColor$1;
+			}
+		});
+	});
+	return shades;
 }
-export {
-  baseColors,
-  generateColorsVars,
-  getColorsSuggestions,
-  getContrastingTextColor,
-  isStandardColor,
-  propToClass,
-  propToStyle,
-  shadeNumbers
-};
+
+//#endregion
+export { baseColors, generateColorsVars, getColorsSuggestions, getContrastingTextColor, isStandardColor, propToClass, propToStyle, shadeNumbers };
 //# sourceMappingURL=color-system.js.map

package/dist/shared/themes/color-system.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/shared/themes/color-system.ts"],"sourcesContent":["import chroma from \"chroma-js\";\nimport type { Theme } from \"../theme\";\nimport { kebabCase } from \"lodash-es\";\nimport { css } from \"@upstart.gg/style-system/twind\";\n\nexport type ColorType = keyof Theme[\"colors\"];\nexport type ElementColorType = \"page-background\" | \"background\" | \"text\" | \"border\" | \"shadow\";\n\nexport const baseColors: Record<ColorType, string> = {\n  primary: \"Primary color\",\n  secondary: \"Secondary color\",\n  accent: \"Accent color\",\n  neutral: \"Neutral color\",\n  base100: \"Base color\",\n  base200: \"Base (level 2)\",\n  base300: \"Base (level 3)\",\n};\n\nexport const shadeNumbers = [900, 800, 700, 600, 500, 400, 300, 200, 100, 50] as const;\ntype ShadeNumber = (typeof shadeNumbers)[number];\n\nconst semanticAliases: Partial<Record<ShadeNumber, string>> = {\n  100: \"subtle\",\n  300: \"light\",\n  700: \"dark\",\n};\n\nexport type ElementColor = string;\n\nexport function getColorsSuggestions(baseHueOrColor: number | string, theme: Theme) {\n  return [];\n}\n\nexport function isStandardColor(color: unknown): boolean {\n  if (typeof color !== \"string\") {\n    return false;\n  }\n  return (\n    color.startsWith(\"oklch\") ||\n    color.startsWith(\"oklab\") ||\n    color.startsWith(\"rgb\") ||\n    color.startsWith(\"hsl\") ||\n    color.startsWith(\"#\") ||\n    color.startsWith(\"var(--\")\n  );\n}\n\nexport function propToStyle(prop: string | number | undefined, cssAttr: string) {\n  if (typeof prop === \"undefined\") {\n    return undefined;\n  }\n  // @ts-ignore\n  return isStandardColor(prop) || typeof prop === \"number\" ? css({ [cssAttr as string]: prop }) : prop;\n}\n\nexport function getContrastingTextColor(\n  backgroundColor: string | chroma.Color,\n  contrastThreshold = 3.5,\n): string {\n  // Convert the background color to a chroma color object\n  const bgColor = chroma(backgroundColor);\n\n  // Get potential text colors\n  const white = \"#ffffff\";\n  const black = \"#000000\";\n\n  // Calculate contrast ratios\n  const contrastWithWhite = chroma.contrast(bgColor, white);\n  const contrastWithBlack = chroma.contrast(bgColor, black);\n\n  // If both options meet the contrast threshold, return the one with better contrast\n  if (contrastWithWhite >= contrastThreshold && contrastWithBlack >= contrastThreshold) {\n    return white;\n    // return contrastWithWhite >= contrastWithBlack ? white : black;\n  }\n\n  // If only one meets the threshold, use that one\n  if (contrastWithWhite >= contrastThreshold) {\n    return white;\n  }\n\n  if (contrastWithBlack >= contrastThreshold) {\n    return black;\n  }\n\n  // If neither meets the threshold, return the one with better contrast\n  // (though it may not meet accessibility standards)\n  return contrastWithWhite >= contrastWithBlack ? white : black;\n}\nexport function propToClass(value: string | number | undefined, classPrefix: string) {\n  if (typeof value === \"undefined\") {\n    return undefined;\n  }\n  return isStandardColor(value) || typeof value === \"number\" ? `${classPrefix}-[${value}]` : value;\n}\n\nexport function generateColorsVars(theme: Theme) {\n  const shades: Record<string, string> = {};\n  const colorNames = Object.keys(baseColors) as ColorType[];\n\n  colorNames.forEach((_colorName) => {\n    const color = theme.colors[_colorName];\n    const colorName = kebabCase(_colorName);\n    // Add the original color as the default (without number suffix)\n    shades[`color-${colorName}`] = color;\n    // Alias it to 500\n    shades[`color-${colorName}-500`] = color;\n\n    // Generate base color content\n    const contentColor = getContrastingTextColor(color);\n    shades[`color-${colorName}-content`] = contentColor;\n    shades[`color-${colorName}-500-content`] = contentColor;\n\n    const baseColor = chroma(color);\n    const darkest = baseColor.darken(2.5);\n    const lightest = baseColor.brighten(3.5);\n\n    const colorScale = chroma.scale([lightest, baseColor, darkest]).domain([50, 500, 900]).mode(\"oklch\");\n\n    // Generate shades for other colors than base colors\n    if (!colorName.startsWith(\"base\")) {\n      shadeNumbers.forEach((shade) => {\n        if (shade === 500) {\n          return;\n        }\n        const varName = `color-${colorName}-${shade}`;\n\n        // Gen color for the specific shade\n        const shadedColor = colorScale(shade);\n        shades[varName] = shadedColor.css(\"oklch\");\n\n        // Gen content color for this same shade\n        const contentColor = getContrastingTextColor(shadedColor);\n        shades[`color-${colorName}-${shade}-content`] = contentColor;\n\n        if (semanticAliases[shade]) {\n          shades[`color-${colorName}-${semanticAliases[shade]}`] = shades[varName];\n          shades[`color-${colorName}-${semanticAliases[shade]}-content`] = contentColor;\n        }\n      });\n    }\n  });\n\n  return shades;\n}\n"],"mappings":"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","names":["contentColor"]}
+{"version":3,"file":"color-system.js","names":["baseColors: Record<ColorType, string>","semanticAliases: Partial<Record<ShadeNumber, string>>","shades: Record<string, string>","contentColor"],"sources":["../../../src/shared/themes/color-system.ts"],"sourcesContent":["import chroma from \"chroma-js\";\nimport type { Theme } from \"../theme\";\nimport { kebabCase } from \"lodash-es\";\nimport { css } from \"@upstart.gg/style-system/twind\";\n\nexport type ColorType = keyof Theme[\"colors\"];\nexport type ElementColorType = \"page-background\" | \"background\" | \"text\" | \"border\" | \"shadow\";\n\nexport const baseColors: Record<ColorType, string> = {\n  primary: \"Primary color\",\n  secondary: \"Secondary color\",\n  accent: \"Accent color\",\n  neutral: \"Neutral color\",\n  base100: \"Base color\",\n  base200: \"Base (level 2)\",\n  base300: \"Base (level 3)\",\n};\n\nexport const shadeNumbers = [900, 800, 700, 600, 500, 400, 300, 200, 100, 50] as const;\ntype ShadeNumber = (typeof shadeNumbers)[number];\n\nconst semanticAliases: Partial<Record<ShadeNumber, string>> = {\n  100: \"subtle\",\n  300: \"light\",\n  700: \"dark\",\n};\n\nexport type ElementColor = string;\n\nexport function getColorsSuggestions(baseHueOrColor: number | string, theme: Theme) {\n  return [];\n}\n\nexport function isStandardColor(color: unknown): boolean {\n  if (typeof color !== \"string\") {\n    return false;\n  }\n  return (\n    color.startsWith(\"oklch\") ||\n    color.startsWith(\"oklab\") ||\n    color.startsWith(\"rgb\") ||\n    color.startsWith(\"hsl\") ||\n    color.startsWith(\"#\") ||\n    color.startsWith(\"var(--\")\n  );\n}\n\nexport function propToStyle(prop: string | number | undefined, cssAttr: string) {\n  if (typeof prop === \"undefined\") {\n    return undefined;\n  }\n  // @ts-ignore\n  return isStandardColor(prop) || typeof prop === \"number\" ? css({ [cssAttr as string]: prop }) : prop;\n}\n\nexport function getContrastingTextColor(\n  backgroundColor: string | chroma.Color,\n  contrastThreshold = 3.5,\n): string {\n  // Convert the background color to a chroma color object\n  const bgColor = chroma(backgroundColor);\n\n  // Get potential text colors\n  const white = \"#ffffff\";\n  const black = \"#000000\";\n\n  // Calculate contrast ratios\n  const contrastWithWhite = chroma.contrast(bgColor, white);\n  const contrastWithBlack = chroma.contrast(bgColor, black);\n\n  // If both options meet the contrast threshold, return the one with better contrast\n  if (contrastWithWhite >= contrastThreshold && contrastWithBlack >= contrastThreshold) {\n    return white;\n    // return contrastWithWhite >= contrastWithBlack ? white : black;\n  }\n\n  // If only one meets the threshold, use that one\n  if (contrastWithWhite >= contrastThreshold) {\n    return white;\n  }\n\n  if (contrastWithBlack >= contrastThreshold) {\n    return black;\n  }\n\n  // If neither meets the threshold, return the one with better contrast\n  // (though it may not meet accessibility standards)\n  return contrastWithWhite >= contrastWithBlack ? white : black;\n}\nexport function propToClass(value: string | number | undefined, classPrefix: string) {\n  if (typeof value === \"undefined\") {\n    return undefined;\n  }\n  return isStandardColor(value) || typeof value === \"number\" ? `${classPrefix}-[${value}]` : value;\n}\n\nexport function generateColorsVars(theme: Theme) {\n  const shades: Record<string, string> = {};\n  const colorNames = Object.keys(baseColors) as ColorType[];\n\n  colorNames.forEach((_colorName) => {\n    const color = theme.colors[_colorName];\n    const colorName = kebabCase(_colorName);\n    // Add the original color as the default (without number suffix)\n    shades[`color-${colorName}`] = color;\n    // Alias it to 500\n    shades[`color-${colorName}-500`] = color;\n\n    // Generate base color content\n    const contentColor = getContrastingTextColor(color);\n    shades[`color-${colorName}-content`] = contentColor;\n    shades[`color-${colorName}-500-content`] = contentColor;\n\n    const baseColor = chroma(color);\n    const darkest = baseColor.darken(2.5);\n    const lightest = baseColor.brighten(3.5);\n\n    const colorScale = chroma.scale([lightest, baseColor, darkest]).domain([50, 500, 900]).mode(\"oklch\");\n\n    // Generate shades for other colors than base colors\n    if (!colorName.startsWith(\"base\")) {\n      shadeNumbers.forEach((shade) => {\n        if (shade === 500) {\n          return;\n        }\n        const varName = `color-${colorName}-${shade}`;\n\n        // Gen color for the specific shade\n        const shadedColor = colorScale(shade);\n        shades[varName] = shadedColor.css(\"oklch\");\n\n        // Gen content color for this same shade\n        const contentColor = getContrastingTextColor(shadedColor);\n        shades[`color-${colorName}-${shade}-content`] = contentColor;\n\n        if (semanticAliases[shade]) {\n          shades[`color-${colorName}-${semanticAliases[shade]}`] = shades[varName];\n          shades[`color-${colorName}-${semanticAliases[shade]}-content`] = contentColor;\n        }\n      });\n    }\n  });\n\n  return shades;\n}\n"],"mappings":";;;;;AAQA,MAAaA,aAAwC;CACnD,SAAS;CACT,WAAW;CACX,QAAQ;CACR,SAAS;CACT,SAAS;CACT,SAAS;CACT,SAAS;CACV;AAED,MAAa,eAAe;CAAC;CAAK;CAAK;CAAK;CAAK;CAAK;CAAK;CAAK;CAAK;CAAK;CAAG;AAG7E,MAAMC,kBAAwD;CAC5D,KAAK;CACL,KAAK;CACL,KAAK;CACN;AAID,SAAgB,qBAAqB,gBAAiC,OAAc;AAClF,QAAO,EAAE;;AAGX,SAAgB,gBAAgB,OAAyB;AACvD,KAAI,OAAO,UAAU,SACnB,QAAO;AAET,QACE,MAAM,WAAW,QAAQ,IACzB,MAAM,WAAW,QAAQ,IACzB,MAAM,WAAW,MAAM,IACvB,MAAM,WAAW,MAAM,IACvB,MAAM,WAAW,IAAI,IACrB,MAAM,WAAW,SAAS;;AAI9B,SAAgB,YAAY,MAAmC,SAAiB;AAC9E,KAAI,OAAO,SAAS,YAClB;AAGF,QAAO,gBAAgB,KAAK,IAAI,OAAO,SAAS,WAAW,IAAI,GAAG,UAAoB,MAAM,CAAC,GAAG;;AAGlG,SAAgB,wBACd,iBACA,oBAAoB,KACZ;CAER,MAAM,UAAU,OAAO,gBAAgB;CAGvC,MAAM,QAAQ;CACd,MAAM,QAAQ;CAGd,MAAM,oBAAoB,OAAO,SAAS,SAAS,MAAM;CACzD,MAAM,oBAAoB,OAAO,SAAS,SAAS,MAAM;AAGzD,KAAI,qBAAqB,qBAAqB,qBAAqB,kBACjE,QAAO;AAKT,KAAI,qBAAqB,kBACvB,QAAO;AAGT,KAAI,qBAAqB,kBACvB,QAAO;AAKT,QAAO,qBAAqB,oBAAoB,QAAQ;;AAE1D,SAAgB,YAAY,OAAoC,aAAqB;AACnF,KAAI,OAAO,UAAU,YACnB;AAEF,QAAO,gBAAgB,MAAM,IAAI,OAAO,UAAU,WAAW,GAAG,YAAY,IAAI,MAAM,KAAK;;AAG7F,SAAgB,mBAAmB,OAAc;CAC/C,MAAMC,SAAiC,EAAE;AAGzC,CAFmB,OAAO,KAAK,WAAW,CAE/B,SAAS,eAAe;EACjC,MAAM,QAAQ,MAAM,OAAO;EAC3B,MAAM,YAAY,UAAU,WAAW;AAEvC,SAAO,SAAS,eAAe;AAE/B,SAAO,SAAS,UAAU,SAAS;EAGnC,MAAM,eAAe,wBAAwB,MAAM;AACnD,SAAO,SAAS,UAAU,aAAa;AACvC,SAAO,SAAS,UAAU,iBAAiB;EAE3C,MAAM,YAAY,OAAO,MAAM;EAC/B,MAAM,UAAU,UAAU,OAAO,IAAI;EACrC,MAAM,WAAW,UAAU,SAAS,IAAI;EAExC,MAAM,aAAa,OAAO,MAAM;GAAC;GAAU;GAAW;GAAQ,CAAC,CAAC,OAAO;GAAC;GAAI;GAAK;GAAI,CAAC,CAAC,KAAK,QAAQ;AAGpG,MAAI,CAAC,UAAU,WAAW,OAAO,CAC/B,cAAa,SAAS,UAAU;AAC9B,OAAI,UAAU,IACZ;GAEF,MAAM,UAAU,SAAS,UAAU,GAAG;GAGtC,MAAM,cAAc,WAAW,MAAM;AACrC,UAAO,WAAW,YAAY,IAAI,QAAQ;GAG1C,MAAMC,iBAAe,wBAAwB,YAAY;AACzD,UAAO,SAAS,UAAU,GAAG,MAAM,aAAaA;AAEhD,OAAI,gBAAgB,QAAQ;AAC1B,WAAO,SAAS,UAAU,GAAG,gBAAgB,YAAY,OAAO;AAChE,WAAO,SAAS,UAAU,GAAG,gBAAgB,OAAO,aAAaA;;IAEnE;GAEJ;AAEF,QAAO"}