@skbkontur/colors 1.1.2-d1791.0 → 2.0.0-alpha.0

package/dist/cjs/constants/promo-hue-shift.d.ts

@@ -1,3 +1,3 @@
 export declare const PROMO_HUE_SHIFTS: {
-    [hueRange: number]: number;
+  [hueRange: number]: number;
 };

package/dist/cjs/constants/promo-hue-shift.js

@@ -1,14 +1,14 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
+'use strict';
+Object.defineProperty(exports, '__esModule', { value: true });
 exports.PROMO_HUE_SHIFTS = void 0;
 exports.PROMO_HUE_SHIFTS = {
-    0: -24,
-    25: -32,
-    44: -35,
-    148: 40,
-    177: 51,
-    253: 11,
-    264: 14,
-    294: 0,
-    319: -24,
+  0: -24,
+  25: -32,
+  44: -35,
+  148: 40,
+  177: 51,
+  253: 11,
+  264: 14,
+  294: 0,
+  319: -24,
 };

package/dist/cjs/constants/warning-hue-patch.d.ts

@@ -1,3 +1,3 @@
 export declare const WARNING_HUE_PATCH: {
-    [lightness: number]: number;
+  [lightness: number]: number;
 };

package/dist/cjs/constants/warning-hue-patch.js

@@ -1,25 +1,25 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
+'use strict';
+Object.defineProperty(exports, '__esModule', { value: true });
 exports.WARNING_HUE_PATCH = void 0;
 exports.WARNING_HUE_PATCH = {
-    96: 0,
-    92: 0,
-    88: 0,
-    84: 0,
-    80: 0,
-    76: 0,
-    72: -4,
-    68: -8,
-    64: -12,
-    60: -8,
-    56: -4,
-    52: -2,
-    48: 0,
-    44: 0,
-    40: 0,
-    36: 0,
-    32: 0,
-    28: 0,
-    24: 0,
-    20: 0,
+  96: 0,
+  92: 0,
+  88: 0,
+  84: 0,
+  80: 0,
+  76: 0,
+  72: -4,
+  68: -8,
+  64: -12,
+  60: -8,
+  56: -4,
+  52: -2,
+  48: 0,
+  44: 0,
+  40: 0,
+  36: 0,
+  32: 0,
+  28: 0,
+  24: 0,
+  20: 0,
 };

package/dist/cjs/get-base-tokens.d.ts

@@ -1,17 +1,19 @@
 import * as DEFAULT_SWATCH from './constants/default-swatch';
 import type { BaseTokens } from './types/base-tokens';
 type PresetOrCustom<T extends string> = T | (string & Record<never, never>);
+export declare const ACCENT_PARAMS: string[];
+export interface ColorObject {
+  [key: string]: ColorValue;
+}
+export type ColorValue = string | ColorObject | ColorValue[];
+type ColorStructure = ColorObject | ColorValue[];
 export interface ConfigOptions {
-    brand: PresetOrCustom<keyof typeof DEFAULT_SWATCH.brand>;
-    accent: PresetOrCustom<'brand' | 'gray'>;
-    system?: typeof DEFAULT_SWATCH.system;
+  brand: PresetOrCustom<keyof typeof DEFAULT_SWATCH.brand>;
+  accent: PresetOrCustom<(typeof ACCENT_PARAMS)[number]>;
+  system?: typeof DEFAULT_SWATCH.system;
 }
 export declare function getBaseTokens({ brand, accent, system }: ConfigOptions): BaseTokens;
-export declare const colorToHex: (color: string) => string;
-export declare const camelCaseToKebabCase: (str: string) => string;
-export declare const kebabCaseToCamelCase: (str: string) => string;
-export declare function convertOklchToHex(obj: any): any;
+export declare function convertOklchToHex(obj: ColorStructure): ColorStructure;
 export declare const convertOklchToRgba: (oklchString: string) => string;
-export declare function convertAlphaOklchToRgba(obj: any): any;
-export declare function flattenObject(obj: any, prefix?: string): any;
+export declare function convertAlphaOklchToRgba(obj: ColorStructure): ColorStructure;
 export {};

package/dist/cjs/get-base-tokens.js

@@ -1,223 +1,199 @@
-"use strict";
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
+'use strict';
+var __createBinding =
+  (this && this.__createBinding) ||
+  (Object.create
+    ? function (o, m, k, k2) {
+        if (k2 === undefined) k2 = k;
+        var desc = Object.getOwnPropertyDescriptor(m, k);
+        if (!desc || ('get' in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+          desc = {
+            enumerable: true,
+            get: function () {
+              return m[k];
+            },
+          };
         }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
+        Object.defineProperty(o, k2, desc);
+      }
+    : function (o, m, k, k2) {
+        if (k2 === undefined) k2 = k;
+        o[k2] = m[k];
+      });
+var __setModuleDefault =
+  (this && this.__setModuleDefault) ||
+  (Object.create
+    ? function (o, v) {
+        Object.defineProperty(o, 'default', { enumerable: true, value: v });
+      }
+    : function (o, v) {
+        o['default'] = v;
+      });
+var __importStar =
+  (this && this.__importStar) ||
+  function (mod) {
     if (mod && mod.__esModule) return mod;
     var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    if (mod != null)
+      for (var k in mod)
+        if (k !== 'default' && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
     __setModuleDefault(result, mod);
     return result;
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.flattenObject = exports.convertAlphaOklchToRgba = exports.convertOklchToRgba = exports.convertOklchToHex = exports.kebabCaseToCamelCase = exports.camelCaseToKebabCase = exports.colorToHex = exports.getBaseTokens = void 0;
-var culori_1 = require("culori");
-var get_palette_1 = require("./helpers/get-palette");
-var get_promo_1 = require("./helpers/get-promo");
-var DEFAULT_SWATCH = __importStar(require("./constants/default-swatch"));
-var get_logo_1 = require("./helpers/get-logo");
+  };
+Object.defineProperty(exports, '__esModule', { value: true });
+exports.convertAlphaOklchToRgba =
+  exports.convertOklchToRgba =
+  exports.convertOklchToHex =
+  exports.getBaseTokens =
+  exports.ACCENT_PARAMS =
+    void 0;
+var culori_1 = require('culori');
+var get_palette_1 = require('./helpers/get-palette');
+var get_promo_1 = require('./helpers/get-promo');
+var DEFAULT_SWATCH = __importStar(require('./constants/default-swatch'));
+var get_logo_1 = require('./helpers/get-logo');
+var get_interactions_1 = require('./helpers/get-interactions');
+exports.ACCENT_PARAMS = ['brand', 'gray'];
 function getBaseTokens(_a) {
-    var brand = _a.brand, accent = _a.accent, _b = _a.system, system = _b === void 0 ? DEFAULT_SWATCH.system : _b;
-    var brandColor = (0, exports.colorToHex)(brand);
-    var brandPalette = (0, get_palette_1.getPalette)({ color: brandColor });
-    var accentPalette;
-    switch (accent) {
-        case 'brand':
-            accentPalette = brandPalette;
-            break;
-        case 'gray':
-            accentPalette = undefined;
-            break;
-        default:
-            accentPalette = (0, get_palette_1.getPalette)({ color: accent });
+  var brand = _a.brand,
+    _b = _a.accent,
+    accent = _b === void 0 ? 'gray' : _b,
+    _c = _a.system,
+    system = _c === void 0 ? DEFAULT_SWATCH.system : _c;
+  var isPresetColor = brand in DEFAULT_SWATCH.brand;
+  var brandColor;
+  if (isPresetColor) {
+    brandColor = DEFAULT_SWATCH.brand[brand];
+  } else {
+    brandColor = brand;
+  }
+  var accentColor;
+  if (accent === 'brand') {
+    accentColor = brandColor;
+  } else if (accent !== 'gray') {
+    accentColor = accent;
+  }
+  var brandPalette = (0, get_palette_1.getPalette)({ color: brandColor });
+  var accentPalette;
+  if (accent === 'brand') {
+    accentPalette = brandPalette;
+  } else if (accent !== 'gray' && accentColor) {
+    accentPalette = (0, get_palette_1.getPalette)({ color: accentColor });
+  }
+  var customizablePalettes = {};
+  for (var colorKey in DEFAULT_SWATCH.customizable) {
+    var key = colorKey;
+    if (key === brand && isPresetColor) {
+      customizablePalettes[key] = brandPalette;
+      continue;
     }
-    var warningPalette = (0, get_palette_1.getPalette)({
-        color: system.warning,
+    customizablePalettes[key] = (0, get_palette_1.getPalette)({
+      color: DEFAULT_SWATCH.customizable[key],
     });
-    var errorPalette = (0, get_palette_1.getPalette)({ color: system.error });
-    var successPalette = (0, get_palette_1.getPalette)({
-        color: system.success,
-    });
-    var customizable = {};
-    for (var colorKey in DEFAULT_SWATCH.brand) {
-        // @ts-expect-error
-        customizable[colorKey] = (0, get_palette_1.getPalette)({
-            // @ts-expect-error
-            color: DEFAULT_SWATCH.brand[colorKey],
-        });
-    }
-    return {
-        brandLogo: (0, get_logo_1.getLogo)(brand),
-        brandPromo: {
-            light: (0, get_promo_1.getPromo)(brandColor),
-            dark: 'blue',
-        },
-        brand: {
-            // todo Brand
-            original: {
-                light: brand,
-                dark: brand,
-            },
-            // todo interactions
-            interactions: {
-                hover: {
-                    light: '',
-                    dark: '',
-                },
-                pressed: {
-                    light: '',
-                    dark: '',
-                },
-            },
-            palette: brandPalette,
-        },
-        accent: {
-            original: {
-                // todo Fix gray
-                light: accent === 'gray' ? accent : '#3d3d3d',
-                dark: accent === 'gray' ? accent : '#3d3d3d',
-            },
-            // todo interactions
-            interactions: {
-                hover: {
-                    light: '',
-                    dark: '',
-                },
-                pressed: {
-                    light: '',
-                    dark: '',
-                },
-            },
-            palette: accentPalette || undefined,
-        },
-        warning: warningPalette,
-        error: errorPalette,
-        success: successPalette,
-        gray: DEFAULT_SWATCH.gray,
-        whiteAlpha: DEFAULT_SWATCH.whiteAlpha,
-        blackAlpha: DEFAULT_SWATCH.blackAlpha,
-        onBrand: (0, get_palette_1.calcOnBrand)(brandColor),
-        customizable: customizable,
-    };
+  }
+  return {
+    brand: {
+      logo: (0, get_logo_1.getLogo)(brandColor),
+      promo: (0, get_promo_1.getPromo)(brandColor),
+      original: brandColor,
+      interactions: {
+        hover: (0, get_interactions_1.getHover)(brandColor),
+        pressed: (0, get_interactions_1.getPressed)(brandColor),
+      },
+      palette: brandPalette,
+    },
+    accent: accentColor
+      ? {
+          original: {
+            light: accentColor,
+            dark: accentColor,
+          },
+          interactions: {
+            hover: (0, get_interactions_1.getHover)(accentColor),
+            pressed: (0, get_interactions_1.getPressed)(accentColor),
+          },
+          palette: accentPalette,
+        }
+      : undefined,
+    warning: (0, get_palette_1.getPalette)({ color: system.warning }),
+    error: (0, get_palette_1.getPalette)({ color: system.error }),
+    success: (0, get_palette_1.getPalette)({ color: system.success }),
+    gray: DEFAULT_SWATCH.gray,
+    whiteAlpha: DEFAULT_SWATCH.whiteAlpha,
+    blackAlpha: DEFAULT_SWATCH.blackAlpha,
+    onBrand: (0, get_palette_1.calcOnBrand)(brandColor),
+    onAccent: accentColor ? (0, get_palette_1.calcOnBrand)(accentColor) : undefined,
+    customizable: customizablePalettes,
+  };
 }
 exports.getBaseTokens = getBaseTokens;
-var colorToHex = function (color) {
-    if (DEFAULT_SWATCH.brand[color]) {
-        return DEFAULT_SWATCH.brand[color];
-    }
-    return color;
-};
-exports.colorToHex = colorToHex;
-var camelCaseToKebabCase = function (str) {
-    return str.replace(/[A-Z]/g, function (match) { return "-".concat(match.toLowerCase()); });
-};
-exports.camelCaseToKebabCase = camelCaseToKebabCase;
-var kebabCaseToCamelCase = function (str) {
-    return str.replace(/-(\w)/g, function (_, c) { return c.toUpperCase(); });
-};
-exports.kebabCaseToCamelCase = kebabCaseToCamelCase;
 function convertOklchToHex(obj) {
-    if (typeof obj !== 'object' || obj === null) {
-        return obj;
-    }
-    if (Array.isArray(obj)) {
-        return obj.map(function (item) { return convertOklchToHex(item); });
-    }
-    var newObj = {};
-    for (var key in obj) {
-        if (Object.prototype.hasOwnProperty.call(obj, key)) {
-            var value = obj[key];
-            if (typeof value === 'string' && value.startsWith('oklch(') && !value.includes('/')) {
-                try {
-                    var toHex = (0, culori_1.converter)('oklch');
-                    value = (0, culori_1.formatHex)(toHex(value));
-                }
-                catch (e) {
-                    console.error("Failed to convert OKLCH to hex: ".concat(value), e);
-                }
-            }
-            newObj[key] = convertOklchToHex(value);
-        }
+  if (typeof obj !== 'object' || obj === null) {
+    return obj;
+  }
+  if (Array.isArray(obj)) {
+    return obj.map(function (item) {
+      if (typeof item === 'object' && item !== null) {
+        return convertOklchToHex(item);
+      }
+      return item;
+    });
+  }
+  var newObj = {};
+  for (var key in obj) {
+    if (Object.prototype.hasOwnProperty.call(obj, key)) {
+      var value = obj[key];
+      if (typeof value === 'string' && value.startsWith('oklch(') && !value.includes('/')) {
+        var oklchColor = (0, culori_1.converter)('oklch')(value);
+        var rgbColor = (0, culori_1.converter)('rgb')(oklchColor);
+        value = (0, culori_1.formatHex)(rgbColor);
+      }
+      if (typeof value === 'object' && value !== null) {
+        newObj[key] = convertOklchToHex(value);
+      } else {
+        newObj[key] = value;
+      }
     }
-    return newObj;
+  }
+  return newObj;
 }
 exports.convertOklchToHex = convertOklchToHex;
 var convertOklchToRgba = function (oklchString) {
-    var oklch = (0, culori_1.converter)('oklch')(oklchString);
-    var rgb = (0, culori_1.converter)('rgb')(oklch);
-    if (!rgb) {
-        throw new Error("Invalid color format: ".concat(oklchString));
-    }
-    var r = Math.round(rgb.r * 255);
-    var g = Math.round(rgb.g * 255);
-    var b = Math.round(rgb.b * 255);
-    var alpha = oklch.alpha;
-    return "rgba(".concat(r, ", ").concat(g, ", ").concat(b, ", ").concat(alpha, ")");
+  var _a;
+  var oklch = (0, culori_1.converter)('oklch')(oklchString);
+  var rgb = (0, culori_1.converter)('rgb')(oklch);
+  var r = Math.round(rgb.r * 255);
+  var g = Math.round(rgb.g * 255);
+  var b = Math.round(rgb.b * 255);
+  var alpha = (_a = oklch.alpha) !== null && _a !== void 0 ? _a : 1;
+  return 'rgba('.concat(r, ', ').concat(g, ', ').concat(b, ', ').concat(alpha, ')');
 };
 exports.convertOklchToRgba = convertOklchToRgba;
 function convertAlphaOklchToRgba(obj) {
-    if (typeof obj !== 'object' || obj === null) {
-        return obj;
-    }
-    if (Array.isArray(obj)) {
-        return obj.map(function (item) { return convertAlphaOklchToRgba(item); });
-    }
-    var newObj = {};
-    for (var key in obj) {
-        if (Object.prototype.hasOwnProperty.call(obj, key)) {
-            var value = obj[key];
-            if (typeof value === 'string' && value.includes('oklch(')) {
-                try {
-                    value = (0, exports.convertOklchToRgba)(value);
-                }
-                catch (e) {
-                    console.error("Failed to convert OKLCH with alpha to rgba: ".concat(value), e);
-                }
-            }
-            newObj[key] = convertAlphaOklchToRgba(value);
-        }
+  if (typeof obj !== 'object' || obj === null) {
+    return obj;
+  }
+  if (Array.isArray(obj)) {
+    return obj.map(function (item) {
+      if (typeof item === 'object' && item !== null) {
+        return convertAlphaOklchToRgba(item);
+      }
+      return item;
+    });
+  }
+  var newObj = {};
+  for (var key in obj) {
+    if (Object.prototype.hasOwnProperty.call(obj, key)) {
+      var value = obj[key];
+      if (typeof value === 'string' && value.includes('oklch(')) {
+        value = (0, exports.convertOklchToRgba)(value);
+      }
+      if (typeof value === 'object' && value !== null) {
+        newObj[key] = convertAlphaOklchToRgba(value);
+      } else {
+        newObj[key] = value;
+      }
     }
-    return newObj;
+  }
+  return newObj;
 }
 exports.convertAlphaOklchToRgba = convertAlphaOklchToRgba;
-function flattenObject(obj, prefix) {
-    if (prefix === void 0) { prefix = ''; }
-    var result = {};
-    for (var key in obj) {
-        if (Object.prototype.hasOwnProperty.call(obj, key)) {
-            var newKey = prefix ? "".concat(prefix, "-").concat((0, exports.camelCaseToKebabCase)(key)) : key;
-            if (typeof obj[key] === 'object' && !Array.isArray(obj[key])) {
-                result = __assign(__assign({}, result), flattenObject(obj[key], newKey));
-            }
-            else {
-                result[newKey] = obj[key];
-            }
-        }
-    }
-    return result;
-}
-exports.flattenObject = flattenObject;

package/dist/cjs/get-colors.d.ts

@@ -0,0 +1,19 @@
+import { type ConfigOptions } from './get-base-tokens';
+import { getDefaultTokens } from './get-default-tokens';
+import type { BaseTokens } from './types/base-tokens';
+export interface Themed<T> {
+  light: T;
+  dark: T;
+}
+export type DefaultTokensFull = ReturnType<typeof getDefaultTokens>;
+export type DefaultTokens = DefaultTokensFull['light' | 'dark'];
+export interface SemanticConfigOptions<T> extends ConfigOptions {
+  theme?: 'light' | 'dark';
+  overrides?: (base: BaseTokens, defaults?: DefaultTokensFull, params?: SemanticConfigOptions<T>) => Themed<T>;
+}
+export declare function getColors(params: SemanticConfigOptions<DefaultTokens>): DefaultTokens;
+export declare function getColors<T>(
+  params: SemanticConfigOptions<T> & {
+    overrides: (base: BaseTokens) => Themed<T>;
+  }
+): Themed<T>;

package/dist/cjs/get-colors.js

@@ -0,0 +1,16 @@
+'use strict';
+Object.defineProperty(exports, '__esModule', { value: true });
+exports.getColors = void 0;
+var get_base_tokens_1 = require('./get-base-tokens');
+var get_default_tokens_1 = require('./get-default-tokens');
+var DEFAULT_THEME = 'light';
+function getColors(params) {
+  var theme = params.theme || DEFAULT_THEME;
+  var base = (0, get_base_tokens_1.getBaseTokens)(params);
+  var defaults = (0, get_default_tokens_1.getDefaultTokens)(base);
+  if (params.overrides) {
+    return params.overrides(base, defaults, params)[theme];
+  }
+  return defaults[theme];
+}
+exports.getColors = getColors;