@riverbankcms/sdk 0.108.0 → 0.111.0

package/dist/_dts/theme-core/src/gradients/presets.d.ts

@@ -1,14 +1,206 @@
 /**
  * Curated gradient presets based on theme palette
  */
-import type { GradientConfig } from './types';
-export type GradientPreset = GradientConfig & {
-    id: string;
-    name: string;
-    description: string;
+import type { GradientConfig, GradientStop } from './types';
+export type GradientPresetForeground = Readonly<{
+    textColor: string;
+    headingColor: string;
+    linkColor: string;
+    supportingColor: string;
+}>;
+declare const rawGradientPresets: readonly [{
+    readonly id: "primary-secondary";
+    readonly name: "Primary to Secondary";
+    readonly description: "Blend your primary and secondary brand colors";
+    readonly type: "linear";
+    readonly angle: 135;
+    readonly stops: readonly [{
+        readonly color: "primary-500";
+        readonly position: 0;
+    }, {
+        readonly color: "secondary-500";
+        readonly position: 100;
+    }];
+}, {
+    readonly id: "primary-accent";
+    readonly name: "Primary to Accent";
+    readonly description: "Energetic gradient from primary to accent";
+    readonly type: "linear";
+    readonly angle: 135;
+    readonly stops: readonly [{
+        readonly color: "primary-500";
+        readonly position: 0;
+    }, {
+        readonly color: "accent-500";
+        readonly position: 100;
+    }];
+}, {
+    readonly id: "secondary-accent";
+    readonly name: "Secondary to Accent";
+    readonly description: "Vibrant secondary to accent blend";
+    readonly type: "linear";
+    readonly angle: 135;
+    readonly stops: readonly [{
+        readonly color: "secondary-500";
+        readonly position: 0;
+    }, {
+        readonly color: "accent-500";
+        readonly position: 100;
+    }];
+}, {
+    readonly id: "primary-light-dark";
+    readonly name: "Primary Light to Dark";
+    readonly description: "Subtle primary color fade";
+    readonly type: "linear";
+    readonly angle: 180;
+    readonly stops: readonly [{
+        readonly color: "primary-500";
+        readonly position: 0;
+    }, {
+        readonly color: "primary-900";
+        readonly position: 100;
+    }];
+}, {
+    readonly id: "primary-dark-light";
+    readonly name: "Primary Dark to Light";
+    readonly description: "Reverse primary fade";
+    readonly type: "linear";
+    readonly angle: 180;
+    readonly stops: readonly [{
+        readonly color: "primary-900";
+        readonly position: 0;
+    }, {
+        readonly color: "primary-50";
+        readonly position: 100;
+    }];
+}, {
+    readonly id: "secondary-light-dark";
+    readonly name: "Secondary Light to Dark";
+    readonly description: "Subtle secondary color fade";
+    readonly type: "linear";
+    readonly angle: 180;
+    readonly stops: readonly [{
+        readonly color: "secondary-500";
+        readonly position: 0;
+    }, {
+        readonly color: "secondary-900";
+        readonly position: 100;
+    }];
+}, {
+    readonly id: "accent-light-dark";
+    readonly name: "Accent Light to Dark";
+    readonly description: "Accent color depth fade";
+    readonly type: "linear";
+    readonly angle: 180;
+    readonly stops: readonly [{
+        readonly color: "accent-500";
+        readonly position: 0;
+    }, {
+        readonly color: "accent-900";
+        readonly position: 100;
+    }];
+}, {
+    readonly id: "background-surface";
+    readonly name: "Background to Surface";
+    readonly description: "Subtle depth using base colors";
+    readonly type: "linear";
+    readonly angle: 180;
+    readonly stops: readonly [{
+        readonly color: "background";
+        readonly position: 0;
+    }, {
+        readonly color: "surface";
+        readonly position: 100;
+    }];
+}, {
+    readonly id: "neutral-fade";
+    readonly name: "Neutral Gradient";
+    readonly description: "Elegant neutral color fade";
+    readonly type: "linear";
+    readonly angle: 180;
+    readonly stops: readonly [{
+        readonly color: "neutral-900";
+        readonly position: 0;
+    }, {
+        readonly color: "neutral-50";
+        readonly position: 100;
+    }];
+}, {
+    readonly id: "primary-glow";
+    readonly name: "Primary glow";
+    readonly description: "A soft top-centred glow using your primary palette";
+    readonly type: "radial";
+    readonly shape: "ellipse";
+    readonly position: "top center";
+    readonly stops: readonly [{
+        readonly color: "primary-900";
+        readonly position: 0;
+    }, {
+        readonly color: "primary-950";
+        readonly position: 100;
+    }];
+    readonly foreground: {
+        readonly textColor: "onPrimary900";
+        readonly headingColor: "onPrimary900";
+        readonly linkColor: "onPrimary900";
+        readonly supportingColor: "onPrimary900";
+    };
+}, {
+    readonly id: "accent-glow";
+    readonly name: "Accent glow";
+    readonly description: "A soft top-centred glow using your accent palette";
+    readonly type: "radial";
+    readonly shape: "ellipse";
+    readonly position: "top center";
+    readonly stops: readonly [{
+        readonly color: "accent-900";
+        readonly position: 0;
+    }, {
+        readonly color: "accent-950";
+        readonly position: 100;
+    }];
+    readonly foreground: {
+        readonly textColor: "onAccent900";
+        readonly headingColor: "onAccent900";
+        readonly linkColor: "onAccent900";
+        readonly supportingColor: "onAccent900";
+    };
+}, {
+    readonly id: "primary-secondary-accent";
+    readonly name: "Brand Trio";
+    readonly description: "All three brand colors in harmony";
+    readonly type: "linear";
+    readonly angle: 135;
+    readonly stops: readonly [{
+        readonly color: "primary-500";
+        readonly position: 0;
+    }, {
+        readonly color: "secondary-500";
+        readonly position: 50;
+    }, {
+        readonly color: "accent-500";
+        readonly position: 100;
+    }];
+}];
+type GradientPresetIdValue = (typeof rawGradientPresets)[number]['id'];
+declare const gradientPresetIdBrand: unique symbol;
+export type GradientPresetId = GradientPresetIdValue & {
+    readonly [gradientPresetIdBrand]: 'GradientPresetId';
+};
+export type GradientPreset = Omit<GradientConfig, 'stops'> & {
+    readonly id: GradientPresetId;
+    readonly name: string;
+    readonly description: string;
+    readonly stops: readonly GradientStop[];
+    readonly foreground?: GradientPresetForeground;
 };
 /**
- * Curated library of gradient presets
- * All gradients use theme color tokens, so they adapt to the site's palette
+ * Curated library of gradient presets.
+ * All gradients use theme color tokens, so they adapt to the site's palette.
  */
-export declare const GRADIENT_PRESETS: GradientPreset[];
+export declare const GRADIENT_PRESETS: readonly GradientPreset[];
+export declare const GRADIENT_PRESET_IDS: readonly GradientPresetId[];
+export declare function parseGradientPresetId(value: unknown): GradientPresetId | null;
+export declare function isGradientPresetId(value: unknown): value is GradientPresetId;
+export declare function getGradientPreset(id: GradientPresetId): GradientPreset;
+export {};

package/dist/_dts/theme-core/src/gradients/utils.d.ts

@@ -1,5 +1,8 @@
-import type { GradientConfig } from './types';
+import type { GradientConfig, GradientStop } from './types';
 export type PaletteTokenMap = Record<string, string | undefined>;
+type GradientCssInput = Omit<GradientConfig, 'stops'> & {
+    readonly stops: readonly GradientStop[];
+};
 /**
  * Convert a GradientConfig to a CSS gradient string
  *
@@ -7,4 +10,5 @@ export type PaletteTokenMap = Record<string, string | undefined>;
  * @param tokens - Map of theme color tokens to hex values
  * @returns CSS gradient string (e.g., "linear-gradient(180deg, #3b82f6 0%, #f59e0b 100%)")
  */
-export declare function gradientToCss(config: GradientConfig, tokens: PaletteTokenMap): string;
+export declare function gradientToCss(config: GradientCssInput, tokens: PaletteTokenMap): string;
+export {};