@skbkontur/react-ui 0.0.0-fed57d84fb → 0.7.0-beta.1

package/lib/scrollInputCaretIntoView.js

@@ -0,0 +1,38 @@
+/** Отступ в символах от края видимой области, чтобы каретка не прилипала к границе */
+var PADDING = 1;
+var SHIFT = 3;
+/**
+ * Прокручивает input по горизонтали так, чтобы каретка (или голова выделения) оставалась в видимой области.
+ * Использует приближение средней ширины символа (scrollWidth / length).
+ *
+ * @param input — элемент input
+ * @param selection — опционально: выделение { start, end, direction }. Если не передано, читается из input.
+ */
+export function scrollInputCaretIntoView(input, selection) {
+    var _a, _b, _c, _d, _e, _f;
+    if (input.scrollWidth <= input.clientWidth) {
+        return;
+    }
+    var maxScroll = input.scrollWidth - input.clientWidth;
+    var start = (_b = (_a = selection === null || selection === void 0 ? void 0 : selection.start) !== null && _a !== void 0 ? _a : input.selectionStart) !== null && _b !== void 0 ? _b : 0;
+    var end = (_d = (_c = selection === null || selection === void 0 ? void 0 : selection.end) !== null && _c !== void 0 ? _c : input.selectionEnd) !== null && _d !== void 0 ? _d : 0;
+    var direction = ((_f = (_e = selection === null || selection === void 0 ? void 0 : selection.direction) !== null && _e !== void 0 ? _e : input.selectionDirection) !== null && _f !== void 0 ? _f : 'none');
+    var selected = start !== end;
+    var position = selected && direction === 'forward' ? end : start;
+    var value = input.value;
+    var charsCount = value.length;
+    if (charsCount === 0) {
+        return;
+    }
+    var charWidth = input.scrollWidth / charsCount;
+    var frame = Math.ceil(input.clientWidth / charWidth);
+    var frameStart = Math.ceil(input.scrollLeft / charWidth);
+    var frameEnd = frameStart + frame;
+    if (position < frameStart + PADDING) {
+        input.scrollLeft = Math.max(0, (position - SHIFT) * charWidth);
+    }
+    if (position > frameEnd - PADDING) {
+        input.scrollLeft = Math.min(maxScroll, (position - frame + SHIFT) * charWidth);
+    }
+}
+//# sourceMappingURL=scrollInputCaretIntoView.js.map

package/lib/scrollInputCaretIntoView.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"scrollInputCaretIntoView.js","sourceRoot":"","sources":["../../lib/scrollInputCaretIntoView.ts"],"names":[],"mappings":"AAQA,sFAAsF;AACtF,IAAM,OAAO,GAAG,CAAC,CAAC;AAClB,IAAM,KAAK,GAAG,CAAC,CAAC;AAEhB;;;;;;GAMG;AACH,MAAM,UAAU,wBAAwB,CAAC,KAAuB,EAAE,SAA0B;;IAC1F,IAAI,KAAK,CAAC,WAAW,IAAI,KAAK,CAAC,WAAW,EAAE,CAAC;QAC3C,OAAO;IACT,CAAC;IAED,IAAM,SAAS,GAAG,KAAK,CAAC,WAAW,GAAG,KAAK,CAAC,WAAW,CAAC;IAExD,IAAM,KAAK,GAAG,MAAA,MAAA,SAAS,aAAT,SAAS,uBAAT,SAAS,CAAE,KAAK,mCAAI,KAAK,CAAC,cAAc,mCAAI,CAAC,CAAC;IAC5D,IAAM,GAAG,GAAG,MAAA,MAAA,SAAS,aAAT,SAAS,uBAAT,SAAS,CAAE,GAAG,mCAAI,KAAK,CAAC,YAAY,mCAAI,CAAC,CAAC;IACtD,IAAM,SAAS,GAAG,CAAC,MAAA,MAAA,SAAS,aAAT,SAAS,uBAAT,SAAS,CAAE,SAAS,mCAAI,KAAK,CAAC,kBAAkB,mCAAI,MAAM,CAA4B,CAAC;IAE1G,IAAM,QAAQ,GAAG,KAAK,KAAK,GAAG,CAAC;IAC/B,IAAM,QAAQ,GAAG,QAAQ,IAAI,SAAS,KAAK,SAAS,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,KAAK,CAAC;IAEnE,IAAM,KAAK,GAAG,KAAK,CAAC,KAAK,CAAC;IAC1B,IAAM,UAAU,GAAG,KAAK,CAAC,MAAM,CAAC;IAChC,IAAI,UAAU,KAAK,CAAC,EAAE,CAAC;QACrB,OAAO;IACT,CAAC;IAED,IAAM,SAAS,GAAG,KAAK,CAAC,WAAW,GAAG,UAAU,CAAC;IACjD,IAAM,KAAK,GAAG,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,WAAW,GAAG,SAAS,CAAC,CAAC;IACvD,IAAM,UAAU,GAAG,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,UAAU,GAAG,SAAS,CAAC,CAAC;IAC3D,IAAM,QAAQ,GAAG,UAAU,GAAG,KAAK,CAAC;IAEpC,IAAI,QAAQ,GAAG,UAAU,GAAG,OAAO,EAAE,CAAC;QACpC,KAAK,CAAC,UAAU,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC,QAAQ,GAAG,KAAK,CAAC,GAAG,SAAS,CAAC,CAAC;IACjE,CAAC;IACD,IAAI,QAAQ,GAAG,QAAQ,GAAG,OAAO,EAAE,CAAC;QAClC,KAAK,CAAC,UAAU,GAAG,IAAI,CAAC,GAAG,CAAC,SAAS,EAAE,CAAC,QAAQ,GAAG,KAAK,GAAG,KAAK,CAAC,GAAG,SAAS,CAAC,CAAC;IACjF,CAAC;AACH,CAAC","sourcesContent":["export type InputSelectionDirection = 'forward' | 'backward' | 'none';\n\nexport interface InputSelection {\n  start: number;\n  end: number;\n  direction: InputSelectionDirection;\n}\n\n/** Отступ в символах от края видимой области, чтобы каретка не прилипала к границе */\nconst PADDING = 1;\nconst SHIFT = 3;\n\n/**\n * Прокручивает input по горизонтали так, чтобы каретка (или голова выделения) оставалась в видимой области.\n * Использует приближение средней ширины символа (scrollWidth / length).\n *\n * @param input — элемент input\n * @param selection — опционально: выделение { start, end, direction }. Если не передано, читается из input.\n */\nexport function scrollInputCaretIntoView(input: HTMLInputElement, selection?: InputSelection): void {\n  if (input.scrollWidth <= input.clientWidth) {\n    return;\n  }\n\n  const maxScroll = input.scrollWidth - input.clientWidth;\n\n  const start = selection?.start ?? input.selectionStart ?? 0;\n  const end = selection?.end ?? input.selectionEnd ?? 0;\n  const direction = (selection?.direction ?? input.selectionDirection ?? 'none') as InputSelectionDirection;\n\n  const selected = start !== end;\n  const position = selected && direction === 'forward' ? end : start;\n\n  const value = input.value;\n  const charsCount = value.length;\n  if (charsCount === 0) {\n    return;\n  }\n\n  const charWidth = input.scrollWidth / charsCount;\n  const frame = Math.ceil(input.clientWidth / charWidth);\n  const frameStart = Math.ceil(input.scrollLeft / charWidth);\n  const frameEnd = frameStart + frame;\n\n  if (position < frameStart + PADDING) {\n    input.scrollLeft = Math.max(0, (position - SHIFT) * charWidth);\n  }\n  if (position > frameEnd - PADDING) {\n    input.scrollLeft = Math.min(maxScroll, (position - frame + SHIFT) * charWidth);\n  }\n}\n"]}

package/lib/size/SizeControlContext.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+import type { SizeProp } from '../types/props.js';
+export interface SizeControlContextProps {
+    size: SizeProp;
+}
+export declare const SizeControlContext: React.Context<SizeControlContextProps>;

package/lib/size/SizeControlContext.js

@@ -0,0 +1,8 @@
+import React from 'react';
+import { defaultSizeValue } from './constants.js';
+export var SizeControlContext = React.createContext({
+    size: defaultSizeValue,
+});
+SizeControlContext.displayName = 'SizeContext';
+SizeControlContext.__KONTUR_REACT_UI__ = 'SizeContext';
+//# sourceMappingURL=SizeControlContext.js.map

package/lib/size/SizeControlContext.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SizeControlContext.js","sourceRoot":"","sources":["../../../lib/size/SizeControlContext.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,OAAO,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAMlD,MAAM,CAAC,IAAM,kBAAkB,GAAG,KAAK,CAAC,aAAa,CAA0B;IAC7E,IAAI,EAAE,gBAAgB;CACvB,CAAC,CAAC;AAEH,kBAAkB,CAAC,WAAW,GAAG,aAAa,CAAC;AAC/C,kBAAkB,CAAC,mBAAmB,GAAG,aAAa,CAAC","sourcesContent":["import React from 'react';\n\nimport type { SizeProp } from '../types/props.js';\n\nimport { defaultSizeValue } from './constants.js';\n\nexport interface SizeControlContextProps {\n  size: SizeProp;\n}\n\nexport const SizeControlContext = React.createContext<SizeControlContextProps>({\n  size: defaultSizeValue,\n});\n\nSizeControlContext.displayName = 'SizeContext';\nSizeControlContext.__KONTUR_REACT_UI__ = 'SizeContext';\n"]}

package/lib/size/SizeDecorator.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import type { SizeProp } from '../types/props.js';
+type Constructor<T = NonNullable<unknown>> = new (...args: any[]) => T;
+interface WithSizeProps {
+    size?: SizeProp;
+}
+export declare function withSize<T extends Constructor<React.Component<WithSizeProps>>>(constructor: T): WithSizeProps & T;
+export {};

package/lib/size/SizeDecorator.js

@@ -0,0 +1,47 @@
+var __extends = (this && this.__extends) || (function () {
+    var extendStatics = function (d, b) {
+        extendStatics = Object.setPrototypeOf ||
+            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
+        return extendStatics(d, b);
+    };
+    return function (d, b) {
+        if (typeof b !== "function" && b !== null)
+            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
+import React from 'react';
+import { SizeControlContext } from './SizeControlContext.js';
+import { defaultSizeValue } from './constants.js';
+export function withSize(constructor) {
+    var SizeDecorator = /** @class */ (function (_super) {
+        __extends(class_1, _super);
+        function class_1() {
+            var _this = _super !== null && _super.apply(this, arguments) || this;
+            _this.size = defaultSizeValue;
+            return _this;
+        }
+        class_1.prototype.render = function () {
+            var _this = this;
+            return (React.createElement(SizeControlContext.Consumer, null, function (context) {
+                var _a;
+                _this.size = (_a = _this.props.size) !== null && _a !== void 0 ? _a : context.size;
+                var originalRender = _super.prototype.render;
+                if (typeof originalRender === 'function') {
+                    return originalRender.call(_this);
+                }
+                return null;
+            }));
+        };
+        return class_1;
+    }(constructor));
+    var nameDescriptor = Object.getOwnPropertyDescriptor(SizeDecorator, 'name');
+    if (!nameDescriptor || nameDescriptor.configurable) {
+        Object.defineProperty(SizeDecorator, 'name', { value: constructor.name });
+    }
+    return SizeDecorator;
+}
+//# sourceMappingURL=SizeDecorator.js.map

package/lib/size/SizeDecorator.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SizeDecorator.js","sourceRoot":"","sources":["../../../lib/size/SizeDecorator.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,OAAO,EAAE,kBAAkB,EAAE,MAAM,yBAAyB,CAAC;AAC7D,OAAO,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAQlD,MAAM,UAAU,QAAQ,CAAwD,WAAc;IAC5F,IAAM,aAAa;QAAiB,2BAAW;QAAzB;;YACb,UAAI,GAAa,gBAAgB,CAAC;;QAiB3C,CAAC;QAfQ,wBAAM,GAAb;YAAA,iBAcC;YAbC,OAAO,CACL,oBAAC,kBAAkB,CAAC,QAAQ,QACzB,UAAC,OAAO;;gBACP,KAAI,CAAC,IAAI,GAAG,MAAA,KAAI,CAAC,KAAK,CAAC,IAAI,mCAAI,OAAO,CAAC,IAAI,CAAC;gBAC5C,IAAM,cAAc,GAAG,gBAAK,CAAC,MAAM,CAAC;gBACpC,IAAI,OAAO,cAAc,KAAK,UAAU,EAAE,CAAC;oBACzC,OAAO,cAAc,CAAC,IAAI,CAAC,KAAI,CAAC,CAAC;gBACnC,CAAC;gBAED,OAAO,IAAI,CAAC;YACd,CAAC,CAC2B,CAC/B,CAAC;QACJ,CAAC;QACH,cAAC;IAAD,CAAC,AAlBqB,CAAc,WAAW,EAkB9C,CAAC;IAEF,IAAM,cAAc,GAAG,MAAM,CAAC,wBAAwB,CAAC,aAAa,EAAE,MAAM,CAAC,CAAC;IAC9E,IAAI,CAAC,cAAc,IAAI,cAAc,CAAC,YAAY,EAAE,CAAC;QACnD,MAAM,CAAC,cAAc,CAAC,aAAa,EAAE,MAAM,EAAE,EAAE,KAAK,EAAE,WAAW,CAAC,IAAI,EAAE,CAAC,CAAC;IAC5E,CAAC;IAED,OAAO,aAAa,CAAC;AACvB,CAAC","sourcesContent":["import React from 'react';\n\nimport type { SizeProp } from '../types/props.js';\n\nimport { SizeControlContext } from './SizeControlContext.js';\nimport { defaultSizeValue } from './constants.js';\n\ntype Constructor<T = NonNullable<unknown>> = new (...args: any[]) => T;\n\ninterface WithSizeProps {\n  size?: SizeProp;\n}\n\nexport function withSize<T extends Constructor<React.Component<WithSizeProps>>>(constructor: T): WithSizeProps & T {\n  const SizeDecorator = class extends constructor {\n    public size: SizeProp = defaultSizeValue;\n\n    public render(): React.ReactNode {\n      return (\n        <SizeControlContext.Consumer>\n          {(context) => {\n            this.size = this.props.size ?? context.size;\n            const originalRender = super.render;\n            if (typeof originalRender === 'function') {\n              return originalRender.call(this);\n            }\n\n            return null;\n          }}\n        </SizeControlContext.Consumer>\n      );\n    }\n  };\n\n  const nameDescriptor = Object.getOwnPropertyDescriptor(SizeDecorator, 'name');\n  if (!nameDescriptor || nameDescriptor.configurable) {\n    Object.defineProperty(SizeDecorator, 'name', { value: constructor.name });\n  }\n\n  return SizeDecorator;\n}\n"]}

package/lib/size/constants.d.ts

@@ -0,0 +1,2 @@
+import type { SizeProp } from '../types/props.js';
+export declare const defaultSizeValue: SizeProp;

package/lib/size/constants.js

@@ -0,0 +1,2 @@
+export var defaultSizeValue = 'small';
+//# sourceMappingURL=constants.js.map

package/lib/size/constants.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"constants.js","sourceRoot":"","sources":["../../../lib/size/constants.ts"],"names":[],"mappings":"AAEA,MAAM,CAAC,IAAM,gBAAgB,GAAa,OAAO,CAAC","sourcesContent":["import type { SizeProp } from '../types/props.js';\n\nexport const defaultSizeValue: SizeProp = 'small';\n"]}

package/lib/size/index.d.ts

@@ -0,0 +1 @@
+export * from './SizeControlContext.js';

package/lib/size/index.js

@@ -0,0 +1,2 @@
+export * from './SizeControlContext.js';
+//# sourceMappingURL=index.js.map

package/lib/size/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../lib/size/index.ts"],"names":[],"mappings":"AAAA,cAAc,yBAAyB,CAAC","sourcesContent":["export * from './SizeControlContext.js';\n"]}

package/lib/size/useSizeControl.d.ts

@@ -0,0 +1,2 @@
+import type { SizeProp } from '../types/props.js';
+export declare const useSizeControl: (propValueSize?: SizeProp) => SizeProp;

package/lib/size/useSizeControl.js

@@ -0,0 +1,7 @@
+import { useContext } from 'react';
+import { SizeControlContext } from './SizeControlContext.js';
+export var useSizeControl = function (propValueSize) {
+    var size = useContext(SizeControlContext).size;
+    return propValueSize !== null && propValueSize !== void 0 ? propValueSize : size;
+};
+//# sourceMappingURL=useSizeControl.js.map

package/lib/size/useSizeControl.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useSizeControl.js","sourceRoot":"","sources":["../../../lib/size/useSizeControl.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAInC,OAAO,EAAE,kBAAkB,EAAE,MAAM,yBAAyB,CAAC;AAE7D,MAAM,CAAC,IAAM,cAAc,GAAG,UAAC,aAAwB;IAC7C,IAAA,IAAI,GAAK,UAAU,CAAC,kBAAkB,CAAC,KAAnC,CAAoC;IAChD,OAAO,aAAa,aAAb,aAAa,cAAb,aAAa,GAAI,IAAI,CAAC;AAC/B,CAAC,CAAC","sourcesContent":["import { useContext } from 'react';\n\nimport type { SizeProp } from '../types/props.js';\n\nimport { SizeControlContext } from './SizeControlContext.js';\n\nexport const useSizeControl = (propValueSize?: SizeProp): SizeProp => {\n  const { size } = useContext(SizeControlContext);\n  return propValueSize ?? size;\n};\n"]}

package/lib/stringUtils.d.ts

@@ -1 +1 @@
-export declare const truncate: (truncateString: string, maxLength: number, separator?: string) => string;
+export declare const truncate: (truncateString: string, maxLength: number, separator?: string) => string;

package/lib/stringUtils.js

@@ -0,0 +1,12 @@
+export var truncate = function (truncateString, maxLength, separator) {
+    if (separator === void 0) { separator = '...'; }
+    if (truncateString.length <= maxLength) {
+        return truncateString;
+    }
+    var separatorLength = separator.length;
+    var charsCountToShow = maxLength - separatorLength;
+    var frontCharsCount = Math.ceil(charsCountToShow / 2);
+    var backCharsCount = Math.floor(charsCountToShow / 2);
+    return "".concat(truncateString.substr(0, frontCharsCount)).concat(separator).concat(truncateString.substr(truncateString.length - backCharsCount));
+};
+//# sourceMappingURL=stringUtils.js.map

package/lib/stringUtils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"stringUtils.js","sourceRoot":"","sources":["../../lib/stringUtils.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,IAAM,QAAQ,GAAG,UAAC,cAAsB,EAAE,SAAiB,EAAE,SAAiB;IAAjB,0BAAA,EAAA,iBAAiB;IACnF,IAAI,cAAc,CAAC,MAAM,IAAI,SAAS,EAAE,CAAC;QACvC,OAAO,cAAc,CAAC;IACxB,CAAC;IAED,IAAM,eAAe,GAAG,SAAS,CAAC,MAAM,CAAC;IACzC,IAAM,gBAAgB,GAAG,SAAS,GAAG,eAAe,CAAC;IAErD,IAAM,eAAe,GAAG,IAAI,CAAC,IAAI,CAAC,gBAAgB,GAAG,CAAC,CAAC,CAAC;IACxD,IAAM,cAAc,GAAG,IAAI,CAAC,KAAK,CAAC,gBAAgB,GAAG,CAAC,CAAC,CAAC;IAExD,OAAO,UAAG,cAAc,CAAC,MAAM,CAAC,CAAC,EAAE,eAAe,CAAC,SAAG,SAAS,SAAG,cAAc,CAAC,MAAM,CACrF,cAAc,CAAC,MAAM,GAAG,cAAc,CACvC,CAAE,CAAC;AACN,CAAC,CAAC","sourcesContent":["export const truncate = (truncateString: string, maxLength: number, separator = '...'): string => {\n  if (truncateString.length <= maxLength) {\n    return truncateString;\n  }\n\n  const separatorLength = separator.length;\n  const charsCountToShow = maxLength - separatorLength;\n\n  const frontCharsCount = Math.ceil(charsCountToShow / 2);\n  const backCharsCount = Math.floor(charsCountToShow / 2);\n\n  return `${truncateString.substr(0, frontCharsCount)}${separator}${truncateString.substr(\n    truncateString.length - backCharsCount,\n  )}`;\n};\n"]}

package/lib/styles/ColorFactory.d.ts

@@ -1,11 +1,11 @@
-import { ColorObject } from './ColorObject';
-export declare class ColorFactory {
-    static create(input: string): ColorObject;
-    private static cache;
-    private static instantiate;
-    private static isKeyword;
-    private static fromKeyword;
-    private static fromHex;
-    private static fromRGB;
-    private static fromHSL;
-}
+import { ColorObject } from './ColorObject.js';
+export declare class ColorFactory {
+    static create(input: string): ColorObject;
+    private static cache;
+    private static instantiate;
+    private static isKeyword;
+    private static fromKeyword;
+    private static fromHex;
+    private static fromRGB;
+    private static fromHSL;
+}

package/lib/styles/ColorFactory.js

@@ -0,0 +1,98 @@
+import warning from 'warning';
+import { clamp, extractColorParts, hue2rgb, parseHSLParts, parseRGBParts } from './ColorHelpers.js';
+import { ColorKeywords } from './ColorKeywords.js';
+import { ColorObject } from './ColorObject.js';
+var RGB_REGEX = /(?:rgba|rgb)\(\s*(\d{1,3}(?:(?:\.\d+)?%)?)\s*,?\s*(\d{1,3}(?:(?:\.\d+)?%)?)\s*,?\s*(\d{1,3}(?:(?:\.\d+)?%)?)\s*(?:\)|(?:,|\/)?\s*(0|0\.\d+|1|1\.0+|\d{1,3}(?:(?:\.\d+)?%))\s*\))/;
+var HSL_REGEX = /(?:hsla|hsl)\(\s*(\d{1,3}(?:deg)?\b)\s*,?\s*(\d{1,3}\.?\d*%|[0-1](?:\.\d*)?\b)\s*,?\s*(\d{1,3}\.?\d*%|[0-1](?:\.\d*)?\b)\s*(?:\)|(?:,|\/)?\s*(\d{1,3}\.?\d*%|\d+(?:\.\d*)?)\s*\))/;
+var HEX_REGEX = /^#([0-9a-f]{3}|[0-9a-f]{6})$/;
+var ColorFactory = /** @class */ (function () {
+    function ColorFactory() {
+    }
+    ColorFactory.create = function (input) {
+        if (!this.cache[input]) {
+            this.cache[input] = Object.freeze(this.instantiate(input));
+        }
+        return this.cache[input];
+    };
+    ColorFactory.instantiate = function (input) {
+        if (typeof input !== 'string') {
+            warning(false, "Invalid type of input (".concat(typeof input, "), expected a string. Returning transparent color"));
+            return new ColorObject([0, 0, 0], 1.0, 'transparent');
+        }
+        var lowercasedTrimmedInput = input.toLowerCase().trim();
+        if (lowercasedTrimmedInput === 'transparent') {
+            return new ColorObject([0, 0, 0], 0, 'transparent');
+        }
+        if (this.isKeyword(lowercasedTrimmedInput)) {
+            return this.fromKeyword(lowercasedTrimmedInput);
+        }
+        if (lowercasedTrimmedInput.startsWith('rgb')) {
+            var parts = extractColorParts(lowercasedTrimmedInput, RGB_REGEX);
+            var _a = parseRGBParts(parts), r = _a.r, g = _a.g, b = _a.b, a = _a.a;
+            r = clamp(r, 255);
+            g = clamp(g, 255);
+            b = clamp(b, 255);
+            a = clamp(a, 1);
+            return this.fromRGB(r, g, b, a);
+        }
+        if (lowercasedTrimmedInput.startsWith('hsl')) {
+            var parts = extractColorParts(lowercasedTrimmedInput, HSL_REGEX);
+            var _b = parseHSLParts(parts), h = _b.h, s = _b.s, l = _b.l, a = _b.a;
+            h = clamp(h, 360);
+            s = clamp(s, 1);
+            l = clamp(l, 1);
+            a = clamp(a, 1);
+            return this.fromHSL(h, s, l, a);
+        }
+        return this.fromHex(lowercasedTrimmedInput);
+    };
+    ColorFactory.isKeyword = function (input) {
+        return Object.prototype.hasOwnProperty.call(ColorKeywords, input);
+    };
+    ColorFactory.fromKeyword = function (keyword) {
+        return this.fromHex(ColorKeywords[keyword], keyword);
+    };
+    ColorFactory.fromHex = function (hexString, type) {
+        var _a;
+        if (type === void 0) { type = 'hex'; }
+        if (!HEX_REGEX.test(hexString)) {
+            throw new Error("".concat(hexString, " is not a valid hex color string"));
+        }
+        var colorCode = hexString.substring(1);
+        var rgb = [0, 0, 0];
+        if (colorCode.length === 6) {
+            (_a = colorCode.match(/.{2}/g)) === null || _a === void 0 ? void 0 : _a.forEach(function (c, i) {
+                rgb[i] = parseInt(c, 16);
+            });
+        }
+        else if (colorCode.length === 3) {
+            colorCode.split('').forEach(function (c, i) {
+                rgb[i] = parseInt(c + c, 16);
+            });
+        }
+        return new ColorObject(rgb, 1.0, type);
+    };
+    ColorFactory.fromRGB = function (r, g, b, a) {
+        if (a === void 0) { a = 1.0; }
+        return new ColorObject([r, g, b], a, a < 1 ? 'rgba' : 'rgb');
+    };
+    ColorFactory.fromHSL = function (h, s, l, a) {
+        if (a === void 0) { a = 1.0; }
+        if (s === 0) {
+            var gray = Math.round(l * 255);
+            return new ColorObject([gray, gray, gray], a, a < 1 ? 'hsla' : 'hsl');
+        }
+        var hDeg = h / 360;
+        var t1 = l < 0.5 ? l * (1 + s) : l + s - l * s;
+        var t2 = l * 2 - t1;
+        var r = hue2rgb(hDeg + 1 / 3, t1, t2);
+        var g = hue2rgb(hDeg, t1, t2);
+        var b = hue2rgb(hDeg - 1 / 3, t1, t2);
+        var rgb = [Math.round(r * 255), Math.round(g * 255), Math.round(b * 255)];
+        return new ColorObject(rgb, a, a < 1 ? 'hsla' : 'hsl');
+    };
+    ColorFactory.cache = Object.create(null);
+    return ColorFactory;
+}());
+export { ColorFactory };
+//# sourceMappingURL=ColorFactory.js.map

package/lib/styles/ColorFactory.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ColorFactory.js","sourceRoot":"","sources":["../../../lib/styles/ColorFactory.ts"],"names":[],"mappings":"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","sourcesContent":["import warning from 'warning';\n\nimport { clamp, extractColorParts, hue2rgb, parseHSLParts, parseRGBParts } from './ColorHelpers.js';\nimport { ColorKeywords } from './ColorKeywords.js';\nimport type { ColorKeywordsType, ColorType, RGBTuple } from './ColorObject.js';\nimport { ColorObject } from './ColorObject.js';\n\ninterface ColorFactoryCacheType {\n  [key: string]: ColorObject;\n}\n\nconst RGB_REGEX =\n  /(?:rgba|rgb)\\(\\s*(\\d{1,3}(?:(?:\\.\\d+)?%)?)\\s*,?\\s*(\\d{1,3}(?:(?:\\.\\d+)?%)?)\\s*,?\\s*(\\d{1,3}(?:(?:\\.\\d+)?%)?)\\s*(?:\\)|(?:,|\\/)?\\s*(0|0\\.\\d+|1|1\\.0+|\\d{1,3}(?:(?:\\.\\d+)?%))\\s*\\))/;\nconst HSL_REGEX =\n  /(?:hsla|hsl)\\(\\s*(\\d{1,3}(?:deg)?\\b)\\s*,?\\s*(\\d{1,3}\\.?\\d*%|[0-1](?:\\.\\d*)?\\b)\\s*,?\\s*(\\d{1,3}\\.?\\d*%|[0-1](?:\\.\\d*)?\\b)\\s*(?:\\)|(?:,|\\/)?\\s*(\\d{1,3}\\.?\\d*%|\\d+(?:\\.\\d*)?)\\s*\\))/;\nconst HEX_REGEX = /^#([0-9a-f]{3}|[0-9a-f]{6})$/;\n\nexport class ColorFactory {\n  public static create(input: string): ColorObject {\n    if (!this.cache[input]) {\n      this.cache[input] = Object.freeze(this.instantiate(input));\n    }\n\n    return this.cache[input];\n  }\n\n  private static cache: ColorFactoryCacheType = Object.create(null);\n\n  private static instantiate(input: string) {\n    if (typeof input !== 'string') {\n      warning(false, `Invalid type of input (${typeof input}), expected a string. Returning transparent color`);\n      return new ColorObject([0, 0, 0], 1.0, 'transparent');\n    }\n    const lowercasedTrimmedInput = input.toLowerCase().trim();\n\n    if (lowercasedTrimmedInput === 'transparent') {\n      return new ColorObject([0, 0, 0], 0, 'transparent');\n    }\n\n    if (this.isKeyword(lowercasedTrimmedInput)) {\n      return this.fromKeyword(lowercasedTrimmedInput);\n    }\n\n    if (lowercasedTrimmedInput.startsWith('rgb')) {\n      const parts = extractColorParts(lowercasedTrimmedInput, RGB_REGEX);\n      let { r, g, b, a } = parseRGBParts(parts);\n\n      r = clamp(r, 255);\n      g = clamp(g, 255);\n      b = clamp(b, 255);\n      a = clamp(a, 1);\n\n      return this.fromRGB(r, g, b, a);\n    }\n\n    if (lowercasedTrimmedInput.startsWith('hsl')) {\n      const parts = extractColorParts(lowercasedTrimmedInput, HSL_REGEX);\n      let { h, s, l, a } = parseHSLParts(parts);\n\n      h = clamp(h, 360);\n      s = clamp(s, 1);\n      l = clamp(l, 1);\n      a = clamp(a, 1);\n\n      return this.fromHSL(h, s, l, a);\n    }\n\n    return this.fromHex(lowercasedTrimmedInput);\n  }\n\n  private static isKeyword(input: string): input is ColorKeywordsType {\n    return Object.prototype.hasOwnProperty.call(ColorKeywords, input);\n  }\n\n  private static fromKeyword(keyword: ColorKeywordsType) {\n    return this.fromHex(ColorKeywords[keyword], keyword);\n  }\n\n  private static fromHex(hexString: string, type: ColorType = 'hex') {\n    if (!HEX_REGEX.test(hexString)) {\n      throw new Error(`${hexString} is not a valid hex color string`);\n    }\n\n    const colorCode = hexString.substring(1);\n    const rgb: RGBTuple = [0, 0, 0];\n    if (colorCode.length === 6) {\n      colorCode.match(/.{2}/g)?.forEach((c, i) => {\n        rgb[i] = parseInt(c, 16);\n      });\n    } else if (colorCode.length === 3) {\n      colorCode.split('').forEach((c, i) => {\n        rgb[i] = parseInt(c + c, 16);\n      });\n    }\n    return new ColorObject(rgb, 1.0, type);\n  }\n\n  private static fromRGB(r: number, g: number, b: number, a = 1.0) {\n    return new ColorObject([r, g, b], a, a < 1 ? 'rgba' : 'rgb');\n  }\n\n  private static fromHSL(h: number, s: number, l: number, a = 1.0) {\n    if (s === 0) {\n      const gray = Math.round(l * 255);\n      return new ColorObject([gray, gray, gray], a, a < 1 ? 'hsla' : 'hsl');\n    }\n\n    const hDeg = h / 360;\n    const t1 = l < 0.5 ? l * (1 + s) : l + s - l * s;\n    const t2 = l * 2 - t1;\n\n    const r = hue2rgb(hDeg + 1 / 3, t1, t2);\n    const g = hue2rgb(hDeg, t1, t2);\n    const b = hue2rgb(hDeg - 1 / 3, t1, t2);\n\n    const rgb: RGBTuple = [Math.round(r * 255), Math.round(g * 255), Math.round(b * 255)];\n    return new ColorObject(rgb, a, a < 1 ? 'hsla' : 'hsl');\n  }\n}\n"]}

package/lib/styles/ColorFunctions.d.ts

@@ -1,11 +1,11 @@
-declare type MethodType = 'absolute' | 'relative';
-export declare function lighten(colorString: string, amount: number | string, method?: MethodType): string;
-export declare function darken(colorString: string, amount: number | string, method?: MethodType): string;
-export declare function contrast(colorString: string, darkString?: string, lightString?: string, threshold?: number): string;
-export declare const red: (colorString: string) => number;
-export declare const green: (colorString: string) => number;
-export declare const blue: (colorString: string) => number;
-export declare const alpha: (colorString: string) => number;
-export declare const isValid: (colorString: string) => boolean;
-export declare const fade: (colorString: string, alpha: number) => string;
-export {};
+type MethodType = 'absolute' | 'relative';
+export declare function lighten(colorString: string, amount: number | string, method?: MethodType): string;
+export declare function darken(colorString: string, amount: number | string, method?: MethodType): string;
+export declare function contrast(colorString: string, darkString?: string, lightString?: string, threshold?: number): string;
+export declare const red: (colorString: string) => number;
+export declare const green: (colorString: string) => number;
+export declare const blue: (colorString: string) => number;
+export declare const alpha: (colorString: string) => number;
+export declare const isValid: (colorString: string) => boolean;
+export declare const fade: (colorString: string, alpha: number) => string;
+export {};

package/lib/styles/ColorFunctions.js

@@ -0,0 +1,120 @@
+import { clamp, floatFromPercent } from './ColorHelpers.js';
+import { ColorFactory } from './ColorFactory.js';
+var DEFAULT_DARK = ColorFactory.create('#333333');
+var DEFAULT_LIGHT = ColorFactory.create('#fff');
+var ColorFunctionsCache = Object.create(null);
+var buildCacheKey = function (name) {
+    var args = [];
+    for (var _i = 1; _i < arguments.length; _i++) {
+        args[_i - 1] = arguments[_i];
+    }
+    return "".concat(name, "(").concat(args.join(), ")");
+};
+var shiftColor = function (colorString, a, sign, method) {
+    if (!colorString) {
+        return '';
+    }
+    if (colorString.toLowerCase() === 'transparent') {
+        return 'transparent';
+    }
+    var amount;
+    if (typeof a === 'string') {
+        amount = a.endsWith('%') ? floatFromPercent(a) : parseFloat(a);
+    }
+    else {
+        amount = a;
+    }
+    amount = clamp(amount, 1);
+    var color = ColorFactory.create(colorString);
+    var hsl = color.toHSL();
+    if (sign === '+') {
+        hsl.l += method === 'relative' ? hsl.l * amount : amount;
+    }
+    else {
+        hsl.l -= method === 'relative' ? hsl.l * amount : amount;
+    }
+    hsl.l = clamp(hsl.l);
+    var newColor;
+    if (color.alpha < 1) {
+        newColor = ColorFactory.create("hsla(".concat(hsl.h, ", ").concat(hsl.s, ", ").concat(hsl.l, ", ").concat(hsl.a, ")"));
+    }
+    else {
+        newColor = ColorFactory.create("hsl(".concat(hsl.h, ", ").concat(hsl.s, ", ").concat(hsl.l, ")"));
+    }
+    return newColor.toColorString(color.type);
+};
+export function lighten(colorString, amount, method) {
+    var key = buildCacheKey('lighten', colorString, amount, method);
+    if (ColorFunctionsCache[key] === undefined) {
+        ColorFunctionsCache[key] = shiftColor(colorString, amount, '+', method);
+        return ColorFunctionsCache[key];
+    }
+    return ColorFunctionsCache[key];
+}
+export function darken(colorString, amount, method) {
+    var key = buildCacheKey('darken', colorString, amount, method);
+    if (ColorFunctionsCache[key] === undefined) {
+        ColorFunctionsCache[key] = shiftColor(colorString, amount, '-', method);
+        return ColorFunctionsCache[key];
+    }
+    return ColorFunctionsCache[key];
+}
+export function contrast(colorString, darkString, lightString, threshold) {
+    var _a;
+    if (threshold === void 0) { threshold = 0.43; }
+    var key = buildCacheKey('contrast', colorString, darkString, lightString, threshold);
+    if (!colorString) {
+        ColorFunctionsCache[key] = '';
+    }
+    if (ColorFunctionsCache[key] === undefined) {
+        var color = ColorFactory.create(colorString);
+        var dark = typeof darkString === 'undefined' ? DEFAULT_DARK : ColorFactory.create(darkString);
+        var light = typeof lightString === 'undefined' ? DEFAULT_LIGHT : ColorFactory.create(lightString);
+        // Figure out which is actually light and dark:
+        if (dark.luma() > light.luma()) {
+            _a = [light, dark], dark = _a[0], light = _a[1];
+        }
+        if (color.luma() < threshold) {
+            ColorFunctionsCache[key] = light.alpha < 1 ? light.toRGBString() : light.toHEXString();
+        }
+        else {
+            ColorFunctionsCache[key] = dark.alpha < 1 ? dark.toRGBString() : dark.toHEXString();
+        }
+    }
+    return ColorFunctionsCache[key];
+}
+export var red = function (colorString) {
+    var color = ColorFactory.create(colorString);
+    return color.rgb[0];
+};
+export var green = function (colorString) {
+    var color = ColorFactory.create(colorString);
+    return color.rgb[1];
+};
+export var blue = function (colorString) {
+    var color = ColorFactory.create(colorString);
+    return color.rgb[2];
+};
+export var alpha = function (colorString) {
+    var color = ColorFactory.create(colorString);
+    return color.alpha;
+};
+export var isValid = function (colorString) {
+    try {
+        ColorFactory.create(colorString);
+        return true;
+    }
+    catch (e) {
+        return false;
+    }
+};
+export var fade = function (colorString, alpha) {
+    var key = buildCacheKey('fade', colorString, alpha);
+    if (ColorFunctionsCache[key] === undefined) {
+        var color = ColorFactory.create(colorString).clone();
+        color.alpha = alpha;
+        ColorFunctionsCache[key] = color.toColorString(color.type === 'hex' ? 'rgba' : color.type);
+    }
+    return ColorFunctionsCache[key];
+};
+//# sourceMappingURL=ColorFunctions.js.map

package/lib/styles/ColorFunctions.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ColorFunctions.js","sourceRoot":"","sources":["../../../lib/styles/ColorFunctions.ts"],"names":[],"mappings":"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","sourcesContent":["import { clamp, floatFromPercent } from './ColorHelpers.js';\nimport { ColorFactory } from './ColorFactory.js';\nimport type { ColorObject } from './ColorObject.js';\n\ntype SignType = '+' | '-';\ntype MethodType = 'absolute' | 'relative';\n\nconst DEFAULT_DARK = ColorFactory.create('#333333');\nconst DEFAULT_LIGHT = ColorFactory.create('#fff');\nconst ColorFunctionsCache: { [key: string]: string } = Object.create(null);\n\nconst buildCacheKey = (name: string, ...args: any[]) => `${name}(${args.join()})`;\n\nconst shiftColor = (colorString: string, a: number | string, sign: SignType, method?: MethodType): string => {\n  if (!colorString) {\n    return '';\n  }\n\n  if (colorString.toLowerCase() === 'transparent') {\n    return 'transparent';\n  }\n\n  let amount: number;\n  if (typeof a === 'string') {\n    amount = a.endsWith('%') ? floatFromPercent(a) : parseFloat(a);\n  } else {\n    amount = a;\n  }\n  amount = clamp(amount, 1);\n\n  const color = ColorFactory.create(colorString);\n  const hsl = color.toHSL();\n\n  if (sign === '+') {\n    hsl.l += method === 'relative' ? hsl.l * amount : amount;\n  } else {\n    hsl.l -= method === 'relative' ? hsl.l * amount : amount;\n  }\n\n  hsl.l = clamp(hsl.l);\n\n  let newColor: ColorObject;\n  if (color.alpha < 1) {\n    newColor = ColorFactory.create(`hsla(${hsl.h}, ${hsl.s}, ${hsl.l}, ${hsl.a})`);\n  } else {\n    newColor = ColorFactory.create(`hsl(${hsl.h}, ${hsl.s}, ${hsl.l})`);\n  }\n  return newColor.toColorString(color.type);\n};\n\nexport function lighten(colorString: string, amount: number | string, method?: MethodType): string {\n  const key = buildCacheKey('lighten', colorString, amount, method);\n  if (ColorFunctionsCache[key] === undefined) {\n    ColorFunctionsCache[key] = shiftColor(colorString, amount, '+', method);\n    return ColorFunctionsCache[key];\n  }\n  return ColorFunctionsCache[key];\n}\nexport function darken(colorString: string, amount: number | string, method?: MethodType): string {\n  const key = buildCacheKey('darken', colorString, amount, method);\n  if (ColorFunctionsCache[key] === undefined) {\n    ColorFunctionsCache[key] = shiftColor(colorString, amount, '-', method);\n    return ColorFunctionsCache[key];\n  }\n\n  return ColorFunctionsCache[key];\n}\nexport function contrast(colorString: string, darkString?: string, lightString?: string, threshold = 0.43): string {\n  const key = buildCacheKey('contrast', colorString, darkString, lightString, threshold);\n  if (!colorString) {\n    ColorFunctionsCache[key] = '';\n  }\n  if (ColorFunctionsCache[key] === undefined) {\n    const color = ColorFactory.create(colorString);\n    let dark = typeof darkString === 'undefined' ? DEFAULT_DARK : ColorFactory.create(darkString);\n    let light = typeof lightString === 'undefined' ? DEFAULT_LIGHT : ColorFactory.create(lightString);\n\n    // Figure out which is actually light and dark:\n    if (dark.luma() > light.luma()) {\n      [dark, light] = [light, dark];\n    }\n\n    if (color.luma() < threshold) {\n      ColorFunctionsCache[key] = light.alpha < 1 ? light.toRGBString() : light.toHEXString();\n    } else {\n      ColorFunctionsCache[key] = dark.alpha < 1 ? dark.toRGBString() : dark.toHEXString();\n    }\n  }\n  return ColorFunctionsCache[key];\n}\n\nexport const red = (colorString: string): number => {\n  const color = ColorFactory.create(colorString);\n  return color.rgb[0];\n};\nexport const green = (colorString: string): number => {\n  const color = ColorFactory.create(colorString);\n  return color.rgb[1];\n};\nexport const blue = (colorString: string): number => {\n  const color = ColorFactory.create(colorString);\n  return color.rgb[2];\n};\nexport const alpha = (colorString: string): number => {\n  const color = ColorFactory.create(colorString);\n  return color.alpha;\n};\nexport const isValid = (colorString: string): boolean => {\n  try {\n    ColorFactory.create(colorString);\n    return true;\n  } catch (e) {\n    return false;\n  }\n};\nexport const fade = (colorString: string, alpha: number): string => {\n  const key = buildCacheKey('fade', colorString, alpha);\n\n  if (ColorFunctionsCache[key] === undefined) {\n    const color = ColorFactory.create(colorString).clone();\n    color.alpha = alpha;\n    ColorFunctionsCache[key] = color.toColorString(color.type === 'hex' ? 'rgba' : color.type);\n  }\n  return ColorFunctionsCache[key];\n};\n"]}

package/lib/styles/ColorHelpers.d.ts

@@ -1,21 +1,21 @@
-export declare function clamp(val: number, max?: number): number;
-export declare function integerFromPercent(n: string, size: number): number;
-export declare function floatFromPercent(n: string): number;
-export declare function roundToPrecision(n: number, precision?: number): number;
-export declare function extractColorParts(input: string, solidRegex: RegExp, alphaRegex?: RegExp): RegExpExecArray;
-export declare function parseRGBParts(parts: string[]): {
-    r: number;
-    g: number;
-    b: number;
-    a: number;
-};
-export declare function parseHSLParts(parts: string[]): {
-    h: number;
-    s: number;
-    l: number;
-    a: number;
-};
-export declare function parseToInteger(part: string, size: number): number;
-export declare function parseToFloat(part: string): number;
-export declare function hue2rgb(hue: number, t1: number, t2: number): number;
-export declare const isColor: (input: string) => boolean;
+export declare function clamp(val: number, max?: number): number;
+export declare function integerFromPercent(n: string, size: number): number;
+export declare function floatFromPercent(n: string): number;
+export declare function roundToPrecision(n: number, precision?: number): number;
+export declare function extractColorParts(input: string, regex: RegExp): RegExpExecArray;
+export declare function parseRGBParts(parts: string[]): {
+    r: number;
+    g: number;
+    b: number;
+    a: number;
+};
+export declare function parseHSLParts(parts: string[]): {
+    h: number;
+    s: number;
+    l: number;
+    a: number;
+};
+export declare function parseToInteger(part: string, size: number): number;
+export declare function parseToFloat(part: string): number;
+export declare function hue2rgb(hue: number, t1: number, t2: number): number;
+export declare const isColor: (input: string) => boolean;