first commit

This commit is contained in:
Stefan Hacker
2026-04-03 09:38:48 +02:00
commit 37ad745546
47450 changed files with 3120798 additions and 0 deletions
+14
View File
@@ -0,0 +1,14 @@
/**
* TypeScript type to return a deep partial object (each property can be undefined, recursively.)
* @deprecated - This type will hit infinite type instantiation recursion. Please use {@link DeepPartialV2}
*/
export type DeepPartial<T> = {
[P in keyof T]?: T[P] extends Array<infer U> ? Array<DeepPartial<U>> : T[P] extends object ? DeepPartial<T[P]> : T[P];
};
interface IDeepPartialArray<T> extends Array<DeepPartialV2<T>> {
}
type DeepPartialObject<T> = {
[Key in keyof T]?: DeepPartialV2<T[Key]>;
};
export type DeepPartialV2<T> = T extends Function ? T : T extends Array<infer U> ? IDeepPartialArray<U> : T extends object ? DeepPartialObject<T> : T;
export {};
+3
View File
@@ -0,0 +1,3 @@
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
//# sourceMappingURL=DeepPartial.js.map
+1
View File
@@ -0,0 +1 @@
{"version":3,"file":"DeepPartial.js","sourceRoot":"../src/","sources":["DeepPartial.ts"],"names":[],"mappings":"","sourcesContent":["/**\n * TypeScript type to return a deep partial object (each property can be undefined, recursively.)\n * @deprecated - This type will hit infinite type instantiation recursion. Please use {@link DeepPartialV2}\n */\nexport type DeepPartial<T> = {\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n [P in keyof T]?: T[P] extends Array<infer U> ? Array<DeepPartial<U>> : T[P] extends object ? DeepPartial<T[P]> : T[P];\n};\n\ninterface IDeepPartialArray<T> extends Array<DeepPartialV2<T>> {}\n\ntype DeepPartialObject<T> = {\n [Key in keyof T]?: DeepPartialV2<T[Key]>;\n};\n\nexport type DeepPartialV2<T> = T extends Function\n ? T\n : T extends Array<infer U>\n ? IDeepPartialArray<U>\n : T extends object\n ? DeepPartialObject<T>\n : T;\n"]}
+5
View File
@@ -0,0 +1,5 @@
import { IRawStyle } from './IRawStyle';
/**
* Keyframe definition.
*/
export type IKeyframes = Record<string, IRawStyle>;
+3
View File
@@ -0,0 +1,3 @@
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
//# sourceMappingURL=IKeyframes.js.map
+1
View File
@@ -0,0 +1 @@
{"version":3,"file":"IKeyframes.js","sourceRoot":"../src/","sources":["IKeyframes.ts"],"names":[],"mappings":"","sourcesContent":["import { IRawStyle } from './IRawStyle';\n/**\n * Keyframe definition.\n */\nexport type IKeyframes = Record<string, IRawStyle>;\n"]}
+27
View File
@@ -0,0 +1,27 @@
import type { IRawStyleBase } from './IRawStyleBase';
import type { IStyle } from './IStyle';
/**
* IRawStyle extends a raw style object, but allows selectors to be defined
* under the selectors node.
* @public
* {@docCategory IRawStyle}
*/
export interface IRawStyle extends IRawStyleBase {
/**
* Allow css variables, strings, objects. While we should have more strict typing
* here, partners are broken in many unpredictable cases where typescript can't infer
* the right typing. Loosening the typing to both allow for css variables and other things.
*/
[key: string]: any;
/**
* Display name for the style.
*/
displayName?: string;
/**
* @deprecated - The selectors wrapper is no longer required. You may add selectors as siblings to other
* style properties, like most css-in-js libraries support.
*/
selectors?: {
[key: string]: IStyle;
};
}
+3
View File
@@ -0,0 +1,3 @@
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
//# sourceMappingURL=IRawStyle.js.map
+1
View File
@@ -0,0 +1 @@
{"version":3,"file":"IRawStyle.js","sourceRoot":"../src/","sources":["IRawStyle.ts"],"names":[],"mappings":"","sourcesContent":["import type { IRawStyleBase } from './IRawStyleBase';\nimport type { IStyle } from './IStyle';\n\n/**\n * IRawStyle extends a raw style object, but allows selectors to be defined\n * under the selectors node.\n * @public\n * {@docCategory IRawStyle}\n */\n\nexport interface IRawStyle extends IRawStyleBase {\n /**\n * Allow css variables, strings, objects. While we should have more strict typing\n * here, partners are broken in many unpredictable cases where typescript can't infer\n * the right typing. Loosening the typing to both allow for css variables and other things.\n */\n [key: string]: any;\n\n /**\n * Display name for the style.\n */\n displayName?: string;\n\n /**\n * @deprecated - The selectors wrapper is no longer required. You may add selectors as siblings to other\n * style properties, like most css-in-js libraries support.\n */\n selectors?: {\n [key: string]: IStyle;\n };\n}\n"]}
File diff suppressed because it is too large Load Diff
+3
View File
@@ -0,0 +1,3 @@
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
//# sourceMappingURL=IRawStyleBase.js.map
File diff suppressed because one or more lines are too long
+17
View File
@@ -0,0 +1,17 @@
import type { IRawStyle } from './IRawStyle';
/**
* {@docCategory IStyleBase}
*/
export type IStyleBase = IRawStyle | string | false | null | undefined;
/**
* {@docCategory IStyleBaseArray}
*/
export interface IStyleBaseArray extends Array<IStyle> {
}
/**
* IStyleObject extends a raw style objects, but allows selectors to be defined
* under the selectors node.
* @public
* {@docCategory IStyle}
*/
export type IStyle = IStyleBase | IStyleBaseArray;
+3
View File
@@ -0,0 +1,3 @@
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
//# sourceMappingURL=IStyle.js.map
+1
View File
@@ -0,0 +1 @@
{"version":3,"file":"IStyle.js","sourceRoot":"../src/","sources":["IStyle.ts"],"names":[],"mappings":"","sourcesContent":["import type { IRawStyle } from './IRawStyle';\n\n/**\n * {@docCategory IStyleBase}\n */\nexport type IStyleBase = IRawStyle | string | false | null | undefined;\n\n/**\n * {@docCategory IStyleBaseArray}\n */\nexport interface IStyleBaseArray extends Array<IStyle> {}\n\n/**\n * IStyleObject extends a raw style objects, but allows selectors to be defined\n * under the selectors node.\n * @public\n * {@docCategory IStyle}\n */\nexport type IStyle = IStyleBase | IStyleBaseArray;\n"]}
+13
View File
@@ -0,0 +1,13 @@
import { IStyleSetBase } from './IStyleSet';
import type { DeepPartialV2 as DeepPartial } from './DeepPartial';
/**
* A style function takes in styleprops and returns a partial styleset.
* {@docCategory IStyleFunction}
*/
export type IStyleFunction<TStylesProps, TStyleSet extends IStyleSetBase> = (props: TStylesProps) => DeepPartial<TStyleSet>;
/**
* Represents either a style function that takes in style props and returns a partial styleset,
* or a partial styleset object.
* {@docCategory IStyleFunctionOrObject}
*/
export type IStyleFunctionOrObject<TStylesProps, TStyleSet extends IStyleSetBase> = IStyleFunction<TStylesProps, TStyleSet> | DeepPartial<TStyleSet>;
+3
View File
@@ -0,0 +1,3 @@
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
//# sourceMappingURL=IStyleFunction.js.map
@@ -0,0 +1 @@
{"version":3,"file":"IStyleFunction.js","sourceRoot":"../src/","sources":["IStyleFunction.ts"],"names":[],"mappings":"","sourcesContent":["import { IStyleSetBase } from './IStyleSet';\nimport type { DeepPartialV2 as DeepPartial } from './DeepPartial';\n\n/**\n * A style function takes in styleprops and returns a partial styleset.\n * {@docCategory IStyleFunction}\n */\nexport type IStyleFunction<TStylesProps, TStyleSet extends IStyleSetBase> = (\n props: TStylesProps,\n) => DeepPartial<TStyleSet>;\n\n/**\n * Represents either a style function that takes in style props and returns a partial styleset,\n * or a partial styleset object.\n * {@docCategory IStyleFunctionOrObject}\n */\nexport type IStyleFunctionOrObject<TStylesProps, TStyleSet extends IStyleSetBase> =\n | IStyleFunction<TStylesProps, TStyleSet>\n | DeepPartial<TStyleSet>;\n"]}
+8
View File
@@ -0,0 +1,8 @@
import type { ShadowConfig } from './shadowConfig';
import type { Stylesheet } from './Stylesheet';
export interface IStyleOptions {
rtl?: boolean;
specificityMultiplier?: number;
shadowConfig?: ShadowConfig;
stylesheet?: Stylesheet;
}
+3
View File
@@ -0,0 +1,3 @@
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
//# sourceMappingURL=IStyleOptions.js.map
@@ -0,0 +1 @@
{"version":3,"file":"IStyleOptions.js","sourceRoot":"../src/","sources":["IStyleOptions.ts"],"names":[],"mappings":"","sourcesContent":["import type { ShadowConfig } from './shadowConfig';\nimport type { Stylesheet } from './Stylesheet';\n\nexport interface IStyleOptions {\n rtl?: boolean;\n specificityMultiplier?: number;\n shadowConfig?: ShadowConfig;\n stylesheet?: Stylesheet;\n}\n"]}
+68
View File
@@ -0,0 +1,68 @@
import { IStyle } from './IStyle';
import { IStyleFunctionOrObject, IStyleFunction } from './IStyleFunction';
import type { ShadowConfig } from './shadowConfig';
/**
* @deprecated Use `Exclude` provided by TypeScript instead.
*/
export type Diff<T extends keyof any, U extends keyof any> = ({
[P in T]: P;
} & {
[P in U]: never;
} & {
[x: string]: never;
})[T];
/**
* @deprecated Use the version provided by TypeScript instead.
*/
type _Omit<U, K extends keyof U> = Pick<U, Diff<keyof U, K>>;
export type { _Omit as Omit };
/**
* Helper function whose role is supposed to express that regardless if T is a style object or style function,
* it will always map to a style function.
*/
export type __MapToFunctionType<T> = Extract<T, Function> extends never ? (...args: any[]) => Partial<T> : Extract<T, Function>;
/**
* Used for 'extends IStyleSetBase' type constraints when an IStyleSet type argument is needed.
*/
export interface IStyleSetBase {
[key: string]: any;
subComponentStyles?: any;
}
/**
* A style set is a dictionary of display areas to IStyle objects.
* It may optionally contain style functions for sub components in the special `subComponentStyles`
* property.
*/
export type IStyleSet<TStyleSet extends IStyleSetBase = {
[key: string]: any;
}> = {
[P in keyof _Omit<TStyleSet, 'subComponentStyles'>]: IStyle;
} & {
subComponentStyles?: {
[P in keyof TStyleSet['subComponentStyles']]: IStyleFunctionOrObject<any, any>;
};
} & IShadowConfig;
/**
* A concatenated style set differs from `IStyleSet` in that subComponentStyles will always be a style function.
*/
export type IConcatenatedStyleSet<TStyleSet extends IStyleSetBase> = {
[P in keyof _Omit<TStyleSet, 'subComponentStyles'>]: IStyle;
} & {
subComponentStyles?: {
[P in keyof TStyleSet['subComponentStyles']]: IStyleFunction<any, any>;
};
} & IShadowConfig;
/**
* A processed style set is one which the set of styles associated with each area has been converted
* into a class name. Additionally, all subComponentStyles are style functions.
*/
export type IProcessedStyleSet<TStyleSet extends IStyleSetBase> = {
[P in keyof _Omit<TStyleSet, 'subComponentStyles'>]: string;
} & {
subComponentStyles: {
[P in keyof TStyleSet['subComponentStyles']]: __MapToFunctionType<TStyleSet['subComponentStyles'] extends infer J ? (P extends keyof J ? J[P] : never) : never>;
};
} & IShadowConfig;
type IShadowConfig = {
__shadowConfig__?: ShadowConfig;
};
+3
View File
@@ -0,0 +1,3 @@
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
//# sourceMappingURL=IStyleSet.js.map
+1
View File
@@ -0,0 +1 @@
{"version":3,"file":"IStyleSet.js","sourceRoot":"../src/","sources":["IStyleSet.ts"],"names":[],"mappings":"","sourcesContent":["import { IStyle } from './IStyle';\nimport { IStyleFunctionOrObject, IStyleFunction } from './IStyleFunction';\nimport type { ShadowConfig } from './shadowConfig';\n\n/**\n * @deprecated Use `Exclude` provided by TypeScript instead.\n */\nexport type Diff<T extends keyof any, U extends keyof any> = ({ [P in T]: P } & { [P in U]: never } & {\n [x: string]: never;\n})[T];\n\n/**\n * @deprecated Use the version provided by TypeScript instead.\n */\n// eslint-disable-next-line @typescript-eslint/no-deprecated, @typescript-eslint/naming-convention\ntype _Omit<U, K extends keyof U> = Pick<U, Diff<keyof U, K>>;\n// eslint-disable-next-line @typescript-eslint/no-deprecated\nexport type { _Omit as Omit };\n\n/**\n * Helper function whose role is supposed to express that regardless if T is a style object or style function,\n * it will always map to a style function.\n */\n// eslint-disable-next-line @typescript-eslint/naming-convention\nexport type __MapToFunctionType<T> = Extract<T, Function> extends never\n ? (...args: any[]) => Partial<T>\n : Extract<T, Function>;\n\n/**\n * Used for 'extends IStyleSetBase' type constraints when an IStyleSet type argument is needed.\n */\nexport interface IStyleSetBase {\n [key: string]: any;\n subComponentStyles?: any;\n}\n\n/**\n * A style set is a dictionary of display areas to IStyle objects.\n * It may optionally contain style functions for sub components in the special `subComponentStyles`\n * property.\n */\nexport type IStyleSet<TStyleSet extends IStyleSetBase = { [key: string]: any }> = {\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n [P in keyof _Omit<TStyleSet, 'subComponentStyles'>]: IStyle;\n} & {\n subComponentStyles?: { [P in keyof TStyleSet['subComponentStyles']]: IStyleFunctionOrObject<any, any> };\n} & IShadowConfig;\n\n/**\n * A concatenated style set differs from `IStyleSet` in that subComponentStyles will always be a style function.\n */\nexport type IConcatenatedStyleSet<TStyleSet extends IStyleSetBase> = {\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n [P in keyof _Omit<TStyleSet, 'subComponentStyles'>]: IStyle;\n} & {\n subComponentStyles?: { [P in keyof TStyleSet['subComponentStyles']]: IStyleFunction<any, any> };\n} & IShadowConfig;\n\n/**\n * A processed style set is one which the set of styles associated with each area has been converted\n * into a class name. Additionally, all subComponentStyles are style functions.\n */\nexport type IProcessedStyleSet<TStyleSet extends IStyleSetBase> = {\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n [P in keyof _Omit<TStyleSet, 'subComponentStyles'>]: string;\n} & {\n subComponentStyles: {\n [P in keyof TStyleSet['subComponentStyles']]: __MapToFunctionType<\n TStyleSet['subComponentStyles'] extends infer J ? (P extends keyof J ? J[P] : never) : never\n >;\n };\n} & IShadowConfig;\n\ntype IShadowConfig = {\n __shadowConfig__?: ShadowConfig;\n};\n"]}
+1
View File
@@ -0,0 +1 @@
export type ObjectOnly<TArg> = TArg extends {} ? TArg : {};
+3
View File
@@ -0,0 +1,3 @@
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
//# sourceMappingURL=ObjectOnly.js.map
+1
View File
@@ -0,0 +1 @@
{"version":3,"file":"ObjectOnly.js","sourceRoot":"../src/","sources":["ObjectOnly.ts"],"names":[],"mappings":"","sourcesContent":["export type ObjectOnly<TArg> = TArg extends {} ? TArg : {};\n"]}
@@ -0,0 +1,24 @@
import { Stylesheet } from './Stylesheet';
import type { ExtendedCSSStyleSheet, ISerializedStylesheet, IStyleSheetConfig } from './Stylesheet';
import type { ShadowConfig } from './shadowConfig';
export declare const SUPPORTS_CONSTRUCTABLE_STYLESHEETS: boolean;
export declare const SUPPORTS_MODIFYING_ADOPTED_STYLESHEETS: boolean;
export type AddSheetCallback = ({ key, sheet }: {
key: string;
sheet: ExtendedCSSStyleSheet;
}) => void;
export declare class ShadowDomStylesheet extends Stylesheet {
private _onAddSheetCallbacks;
private _adoptableSheets;
private _sheetCounter;
static getInstance(shadowConfig?: ShadowConfig): ShadowDomStylesheet;
constructor(config?: IStyleSheetConfig, serializedStylesheet?: ISerializedStylesheet);
getAdoptedSheets(): Map<string, ExtendedCSSStyleSheet>;
onAddSheet(callback: AddSheetCallback): Function;
insertRule(rule: string, preserve?: boolean): void;
protected _getCacheKey(key: string): string;
protected _createStyleElement(): HTMLStyleElement;
private _makeCSSStyleSheet;
private _addAdoptableStyleSheet;
private _getAdoptableStyleSheet;
}
+194
View File
@@ -0,0 +1,194 @@
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.ShadowDomStylesheet = exports.SUPPORTS_MODIFYING_ADOPTED_STYLESHEETS = exports.SUPPORTS_CONSTRUCTABLE_STYLESHEETS = void 0;
var tslib_1 = require("tslib");
/* eslint no-restricted-globals: 0 */
var Stylesheet_1 = require("./Stylesheet");
var shadowConfig_1 = require("./shadowConfig");
exports.SUPPORTS_CONSTRUCTABLE_STYLESHEETS = typeof document !== 'undefined' && Array.isArray(document.adoptedStyleSheets) && 'replace' in CSSStyleSheet.prototype;
var supportsModifyingAdoptedStyleSheets = false;
if (exports.SUPPORTS_CONSTRUCTABLE_STYLESHEETS) {
try {
document.adoptedStyleSheets.push();
supportsModifyingAdoptedStyleSheets = true;
}
catch (e) {
supportsModifyingAdoptedStyleSheets = false;
}
}
exports.SUPPORTS_MODIFYING_ADOPTED_STYLESHEETS = supportsModifyingAdoptedStyleSheets;
var _stylesheet;
var _global = {};
// Grab window.
try {
// Why the cast?
// if compiled/type checked in same program with `@fluentui/font-icons-mdl2` which extends `Window` on global
// ( check packages/font-icons-mdl2/src/index.ts ) the definitions don't match! Thus the need of this extra assertion
_global = (window || {});
}
catch (_a) {
/* leave as blank object */
}
var copyOldGlobalRules = function (stylesheet, inShadow, win, doc) {
var _a;
if (inShadow === void 0) { inShadow = false; }
if (!doc) {
// SSR
return;
}
var oldGlobalRules = doc.querySelectorAll('[data-merge-styles]');
if (oldGlobalRules) {
stylesheet.setConfig({
window: win,
inShadow: inShadow,
stylesheetKey: shadowConfig_1.GLOBAL_STYLESHEET_KEY,
});
for (var i = 0; i < oldGlobalRules.length; i++) {
var styleElem = oldGlobalRules[i];
styleElem.setAttribute('data-merge-styles-global', 'true');
var cssRules = ((_a = styleElem.sheet) === null || _a === void 0 ? void 0 : _a.cssRules) || [];
for (var j = 0; j < cssRules.length; j++) {
var rule = cssRules[j];
stylesheet.insertRule(rule.cssText);
}
}
}
};
var ShadowDomStylesheet = /** @class */ (function (_super) {
tslib_1.__extends(ShadowDomStylesheet, _super);
function ShadowDomStylesheet(config, serializedStylesheet) {
var _this = _super.call(this, config, serializedStylesheet) || this;
_this._onAddSheetCallbacks = [];
_this._sheetCounter = 0;
_this._adoptableSheets = new Map();
_global[shadowConfig_1.SHADOW_DOM_STYLESHEET_SETTING] = ShadowDomStylesheet;
return _this;
}
ShadowDomStylesheet.getInstance = function (shadowConfig) {
var sConfig = shadowConfig || shadowConfig_1.DEFAULT_SHADOW_CONFIG;
var stylesheetKey = sConfig.stylesheetKey || shadowConfig_1.GLOBAL_STYLESHEET_KEY;
var inShadow = sConfig.inShadow;
var win = sConfig.window || (typeof window !== 'undefined' ? window : undefined);
var global = (win || _global);
var doc = win ? win.document : typeof document !== 'undefined' ? document : undefined;
_stylesheet = global[Stylesheet_1.STYLESHEET_SETTING];
// When an app has multiple versions of Fluent v8 it is possible
// that an older version of Stylesheet is initialized before
// the version that supports shadow DOM. We check for this case
// and re-initialize the stylesheet in that case.
var oldStylesheetInitializedFirst = _stylesheet && !_stylesheet.getAdoptedSheets;
if (!_stylesheet ||
oldStylesheetInitializedFirst ||
(_stylesheet._lastStyleElement && _stylesheet._lastStyleElement.ownerDocument !== doc)) {
var fabricConfig = (global === null || global === void 0 ? void 0 : global.FabricConfig) || {};
var defaultMergeStyles = {
window: win,
inShadow: inShadow,
stylesheetKey: stylesheetKey,
};
fabricConfig.mergeStyles = fabricConfig.mergeStyles || {};
fabricConfig.mergeStyles = tslib_1.__assign(tslib_1.__assign({}, defaultMergeStyles), fabricConfig.mergeStyles);
var stylesheet = void 0;
if (oldStylesheetInitializedFirst) {
stylesheet = new ShadowDomStylesheet(fabricConfig.mergeStyles, JSON.parse(_stylesheet.serialize()));
copyOldGlobalRules(stylesheet, inShadow, win, doc);
}
else {
stylesheet = new ShadowDomStylesheet(fabricConfig.mergeStyles, fabricConfig.serializedStylesheet);
}
_stylesheet = stylesheet;
global[Stylesheet_1.STYLESHEET_SETTING] = _stylesheet;
}
else {
_stylesheet.setConfig({
window: win,
inShadow: inShadow,
stylesheetKey: stylesheetKey,
});
}
if (win) {
_stylesheet._getAdoptableStyleSheet(stylesheetKey);
}
return _stylesheet;
};
ShadowDomStylesheet.prototype.getAdoptedSheets = function () {
return this._adoptableSheets;
};
ShadowDomStylesheet.prototype.onAddSheet = function (callback) {
var _this = this;
this._onAddSheetCallbacks.push(callback);
return function () {
_this._onAddSheetCallbacks = _this._onAddSheetCallbacks.filter(function (cb) { return cb !== callback; });
};
};
ShadowDomStylesheet.prototype.insertRule = function (rule, preserve) {
var _a = this._config, injectionMode = _a.injectionMode, _b = _a.stylesheetKey, stylesheetKey = _b === void 0 ? shadowConfig_1.GLOBAL_STYLESHEET_KEY : _b;
var injectStyles = injectionMode !== Stylesheet_1.InjectionMode.none;
var addToConstructableStylesheet = stylesheetKey === shadowConfig_1.GLOBAL_STYLESHEET_KEY || !!this._adoptableSheets.has(stylesheetKey);
var constructableSheet = undefined;
if (injectStyles && addToConstructableStylesheet) {
constructableSheet = this._getAdoptableStyleSheet(stylesheetKey);
}
if (constructableSheet) {
this._insertRuleIntoSheet(constructableSheet, rule);
}
_super.prototype.insertRule.call(this, rule, preserve, stylesheetKey);
};
ShadowDomStylesheet.prototype._getCacheKey = function (key) {
var _a = this._config, _b = _a.inShadow, inShadow = _b === void 0 ? false : _b, _c = _a.stylesheetKey, currentStylesheetKey = _c === void 0 ? shadowConfig_1.GLOBAL_STYLESHEET_KEY : _c;
if (inShadow) {
return "__".concat(currentStylesheetKey, "__").concat(key);
}
return _super.prototype._getCacheKey.call(this, key);
};
ShadowDomStylesheet.prototype._createStyleElement = function () {
var styleElement = _super.prototype._createStyleElement.call(this);
if (this._config.stylesheetKey === shadowConfig_1.GLOBAL_STYLESHEET_KEY) {
styleElement.setAttribute('data-merge-styles-global', 'true');
}
return styleElement;
};
ShadowDomStylesheet.prototype._makeCSSStyleSheet = function () {
var win = this._config.window || window;
var sheet = undefined;
if (!exports.SUPPORTS_CONSTRUCTABLE_STYLESHEETS) {
var style = this._createStyleElement();
sheet = style.sheet;
}
else {
sheet = new win.CSSStyleSheet();
}
if (sheet) {
sheet.bucketName = 'merge-styles';
sheet.metadata = {
stylesheetKey: this._config.stylesheetKey || shadowConfig_1.GLOBAL_STYLESHEET_KEY,
sortOrder: this._sheetCounter++,
};
}
return sheet;
};
ShadowDomStylesheet.prototype._addAdoptableStyleSheet = function (key, sheet, queue) {
var _this = this;
if (queue === void 0) { queue = true; }
if (!this._adoptableSheets.has(key)) {
this._adoptableSheets.set(key, sheet);
var win = this._config.window;
if (queue && win) {
win.queueMicrotask(function () {
_this._onAddSheetCallbacks.forEach(function (callback) { return callback({ key: key, sheet: sheet }); });
});
}
}
};
ShadowDomStylesheet.prototype._getAdoptableStyleSheet = function (key) {
var sheet = this._adoptableSheets.get(key);
if (!sheet) {
sheet = this._makeCSSStyleSheet();
this._addAdoptableStyleSheet(key, sheet);
}
return sheet;
};
return ShadowDomStylesheet;
}(Stylesheet_1.Stylesheet));
exports.ShadowDomStylesheet = ShadowDomStylesheet;
//# sourceMappingURL=ShadowDomStylesheet.js.map
File diff suppressed because one or more lines are too long
@@ -0,0 +1,10 @@
import { IStyleOptions } from './IStyleOptions';
/**
* Sets the current RTL value.
*/
export declare function setRTL(isRTL: boolean): void;
/**
* Gets the current RTL value.
*/
export declare function getRTL(): boolean;
export declare function getStyleOptions(): IStyleOptions;
+42
View File
@@ -0,0 +1,42 @@
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.getStyleOptions = exports.getRTL = exports.setRTL = void 0;
var shadowConfig_1 = require("./shadowConfig");
/**
* Sets the current RTL value.
*/
function setRTL(isRTL) {
if (_rtl !== isRTL) {
_rtl = isRTL;
}
}
exports.setRTL = setRTL;
/**
* Gets the current RTL value.
*/
function getRTL() {
if (_rtl === undefined) {
_rtl =
// eslint-disable-next-line no-restricted-globals
typeof document !== 'undefined' &&
// eslint-disable-next-line no-restricted-globals
!!document.documentElement &&
// eslint-disable-next-line no-restricted-globals
document.documentElement.getAttribute('dir') === 'rtl';
}
return _rtl;
}
exports.getRTL = getRTL;
// This has been split into 2 lines because it was working in Fabric due to the code being transpiled to es5, so this
// was converted to var while not working in Fluent that uses babel to transpile the code to be es6-like. Splitting the
// logic into two lines, however, allows it to work in both scenarios.
var _rtl;
_rtl = getRTL();
function getStyleOptions() {
return {
rtl: getRTL(),
shadowConfig: shadowConfig_1.DEFAULT_SHADOW_CONFIG,
};
}
exports.getStyleOptions = getStyleOptions;
//# sourceMappingURL=StyleOptionsState.js.map
@@ -0,0 +1 @@
{"version":3,"file":"StyleOptionsState.js","sourceRoot":"../src/","sources":["StyleOptionsState.ts"],"names":[],"mappings":";;;AACA,+CAAuD;AAEvD;;GAEG;AACH,SAAgB,MAAM,CAAC,KAAc;IACnC,IAAI,IAAI,KAAK,KAAK,EAAE,CAAC;QACnB,IAAI,GAAG,KAAK,CAAC;IACf,CAAC;AACH,CAAC;AAJD,wBAIC;AAED;;GAEG;AACH,SAAgB,MAAM;IACpB,IAAI,IAAI,KAAK,SAAS,EAAE,CAAC;QACvB,IAAI;YACF,iDAAiD;YACjD,OAAO,QAAQ,KAAK,WAAW;gBAC/B,iDAAiD;gBACjD,CAAC,CAAC,QAAQ,CAAC,eAAe;gBAC1B,iDAAiD;gBACjD,QAAQ,CAAC,eAAe,CAAC,YAAY,CAAC,KAAK,CAAC,KAAK,KAAK,CAAC;IAC3D,CAAC;IACD,OAAO,IAAI,CAAC;AACd,CAAC;AAXD,wBAWC;AAED,qHAAqH;AACrH,uHAAuH;AACvH,sEAAsE;AACtE,IAAI,IAAa,CAAC;AAClB,IAAI,GAAG,MAAM,EAAE,CAAC;AAEhB,SAAgB,eAAe;IAC7B,OAAO;QACL,GAAG,EAAE,MAAM,EAAE;QACb,YAAY,EAAE,oCAAqB;KACpC,CAAC;AACJ,CAAC;AALD,0CAKC","sourcesContent":["import { IStyleOptions } from './IStyleOptions';\nimport { DEFAULT_SHADOW_CONFIG } from './shadowConfig';\n\n/**\n * Sets the current RTL value.\n */\nexport function setRTL(isRTL: boolean): void {\n if (_rtl !== isRTL) {\n _rtl = isRTL;\n }\n}\n\n/**\n * Gets the current RTL value.\n */\nexport function getRTL(): boolean {\n if (_rtl === undefined) {\n _rtl =\n // eslint-disable-next-line no-restricted-globals\n typeof document !== 'undefined' &&\n // eslint-disable-next-line no-restricted-globals\n !!document.documentElement &&\n // eslint-disable-next-line no-restricted-globals\n document.documentElement.getAttribute('dir') === 'rtl';\n }\n return _rtl;\n}\n\n// This has been split into 2 lines because it was working in Fabric due to the code being transpiled to es5, so this\n// was converted to var while not working in Fluent that uses babel to transpile the code to be es6-like. Splitting the\n// logic into two lines, however, allows it to work in both scenarios.\nlet _rtl: boolean;\n_rtl = getRTL();\n\nexport function getStyleOptions(): IStyleOptions {\n return {\n rtl: getRTL(),\n shadowConfig: DEFAULT_SHADOW_CONFIG,\n };\n}\n"]}
+207
View File
@@ -0,0 +1,207 @@
import { IStyle } from './IStyle';
import { SHADOW_DOM_STYLESHEET_SETTING } from './shadowConfig';
import type { ShadowConfig } from './shadowConfig';
export declare const InjectionMode: {
/**
* Avoids style injection, use getRules() to read the styles.
*/
none: 0;
/**
* Inserts rules using the insertRule api.
*/
insertNode: 1;
/**
* Appends rules using appendChild.
*/
appendChild: 2;
};
export type InjectionMode = (typeof InjectionMode)[keyof typeof InjectionMode];
/**
* CSP settings for the stylesheet
*/
export interface ICSPSettings {
/**
* Nonce to inject into script tag
*/
nonce?: string;
}
/**
* Stylesheet config.
*
* @public
*/
export interface IStyleSheetConfig {
/**
* Injection mode for how rules are inserted.
*/
injectionMode?: InjectionMode;
/**
* Default 'displayName' to use for a className.
* @defaultvalue 'css'
*/
defaultPrefix?: string;
/**
* Defines the default direction of rules for auto-rtlifying things.
* While typically this is represented as a DIR attribute in the markup,
* the DIR is not enough to control whether padding goes on the left or
* right. Use this to set the default direction when rules are registered.
*/
rtl?: boolean;
/**
* Default 'namespace' to attach before the className.
*/
namespace?: string;
/**
* CSP settings
*/
cspSettings?: ICSPSettings;
/**
* Callback executed when a rule is inserted.
* @deprecated Use `Stylesheet.onInsertRule` instead.
*/
onInsertRule?: (rule: string) => void;
/**
* Initial value for classnames cache. Key is serialized css rules associated with a classname.
*/
classNameCache?: {
[key: string]: string;
};
window?: Window;
inShadow?: boolean;
stylesheetKey?: string;
}
/**
* Representation of Stylesheet used for rehydration.
*/
export interface ISerializedStylesheet {
classNameToArgs: Stylesheet['_classNameToArgs'];
counter: Stylesheet['_counter'];
keyToClassName: Stylesheet['_keyToClassName'];
preservedRules: Stylesheet['_preservedRules'];
rules: Stylesheet['_rules'];
}
export declare const STYLESHEET_SETTING = "__stylesheet__";
declare global {
interface Document {
adoptedStyleSheets: CSSStyleSheet[];
}
}
export type WindowWithMergeStyles = (Window | {}) & {
[STYLESHEET_SETTING]?: Stylesheet;
[SHADOW_DOM_STYLESHEET_SETTING]?: typeof Stylesheet;
FabricConfig?: {
mergeStyles?: IStyleSheetConfig;
serializedStylesheet?: ISerializedStylesheet;
};
};
export type ExtendedCSSStyleSheet = CSSStyleSheet & {
bucketName: string;
metadata: Record<string, unknown>;
};
type InsertRuleArgs = {
key?: string;
sheet?: ExtendedCSSStyleSheet | null;
rule?: string;
};
export type InsertRuleCallback = ({ key, sheet, rule }: InsertRuleArgs) => void;
/**
* Represents the state of styles registered in the page. Abstracts
* the surface for adding styles to the stylesheet, exposes helpers
* for reading the styles registered in server rendered scenarios.
*
* @public
*/
export declare class Stylesheet {
protected _lastStyleElement?: HTMLStyleElement;
protected _config: IStyleSheetConfig;
private _styleElement?;
private _rules;
private _preservedRules;
private _counter;
private _keyToClassName;
private _onInsertRuleCallbacks;
private _onResetCallbacks;
private _classNameToArgs;
/**
* Gets the singleton instance.
*/
static getInstance(shadowConfig?: ShadowConfig): Stylesheet;
constructor(config?: IStyleSheetConfig, serializedStylesheet?: ISerializedStylesheet);
/**
* Serializes the Stylesheet instance into a format which allows rehydration on creation.
* @returns string representation of `ISerializedStylesheet` interface.
*/
serialize(): string;
/**
* Configures the stylesheet.
*/
setConfig(config?: IStyleSheetConfig): void;
/**
* Configures a reset callback.
*
* @param callback - A callback which will be called when the Stylesheet is reset.
* @returns function which when called un-registers provided callback.
*/
onReset(callback: Function): Function;
/**
* Configures an insert rule callback.
*
* @param callback - A callback which will be called when a rule is inserted.
* @returns function which when called un-registers provided callback.
*/
onInsertRule(callback: Function | InsertRuleCallback): Function;
/**
* Generates a unique classname.
*
* @param displayName - Optional value to use as a prefix.
*/
getClassName(displayName?: string): string;
/**
* Used internally to cache information about a class which was
* registered with the stylesheet.
*/
cacheClassName(className: string, key: string, args: IStyle[], rules: string[]): void;
/**
* Gets the appropriate classname given a key which was previously
* registered using cacheClassName.
*/
classNameFromKey(key: string): string | undefined;
/**
* Gets all classnames cache with the stylesheet.
*/
getClassNameCache(): {
[key: string]: string;
};
/**
* Gets the arguments associated with a given classname which was
* previously registered using cacheClassName.
*/
argsFromClassName(className: string): IStyle[] | undefined;
/**
* Gets the rules associated with a given classname which was
* previously registered using cacheClassName.
*/
insertedRulesFromClassName(className: string): string[] | undefined;
/**
* Inserts a css rule into the stylesheet.
* @param preserve - Preserves the rule beyond a reset boundary.
*/
insertRule(rule: string, preserve?: boolean, stylesheetKey?: string): void;
/**
* Gets all rules registered with the stylesheet; only valid when
* using InsertionMode.none.
*/
getRules(includePreservedRules?: boolean): string;
/**
* Resets the internal state of the stylesheet. Only used in server
* rendered scenarios where we're using InsertionMode.none.
*/
reset(): void;
resetKeys(): void;
protected _createStyleElement(): HTMLStyleElement;
protected _insertRuleIntoSheet(sheet: CSSStyleSheet | undefined | null, rule: string): boolean;
protected _getCacheKey(key: string): string;
private _getStyleElement;
private _findPlaceholderStyleTag;
}
export {};
+302
View File
@@ -0,0 +1,302 @@
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.Stylesheet = exports.STYLESHEET_SETTING = exports.InjectionMode = void 0;
var tslib_1 = require("tslib");
var shadowConfig_1 = require("./shadowConfig");
exports.InjectionMode = {
/**
* Avoids style injection, use getRules() to read the styles.
*/
none: 0,
/**
* Inserts rules using the insertRule api.
*/
insertNode: 1,
/**
* Appends rules using appendChild.
*/
appendChild: 2,
};
exports.STYLESHEET_SETTING = '__stylesheet__';
/**
* MSIE 11 doesn't cascade styles based on DOM ordering, but rather on the order that each style node
* is created. As such, to maintain consistent priority, IE11 should reuse a single style node.
*/
var REUSE_STYLE_NODE = typeof navigator !== 'undefined' && /rv:11.0/.test(navigator.userAgent);
var _global = {};
// Grab window.
try {
// Why the cast?
// if compiled/type checked in same program with `@fluentui/font-icons-mdl2` which extends `Window` on global
// ( check packages/font-icons-mdl2/src/index.ts ) the definitions don't match! Thus the need of this extra assertion
_global = (window || {});
}
catch (_a) {
/* leave as blank object */
}
var _stylesheet;
/**
* Represents the state of styles registered in the page. Abstracts
* the surface for adding styles to the stylesheet, exposes helpers
* for reading the styles registered in server rendered scenarios.
*
* @public
*/
var Stylesheet = /** @class */ (function () {
function Stylesheet(config, serializedStylesheet) {
var _a, _b, _c, _d, _e, _f;
this._rules = [];
this._preservedRules = [];
this._counter = 0;
this._keyToClassName = {};
this._onInsertRuleCallbacks = [];
this._onResetCallbacks = [];
this._classNameToArgs = {};
// If there is no document we won't have an element to inject into.
this._config = tslib_1.__assign({ injectionMode: typeof document === 'undefined' ? exports.InjectionMode.none : exports.InjectionMode.insertNode, defaultPrefix: 'css', namespace: undefined, cspSettings: undefined }, config);
this._classNameToArgs = (_a = serializedStylesheet === null || serializedStylesheet === void 0 ? void 0 : serializedStylesheet.classNameToArgs) !== null && _a !== void 0 ? _a : this._classNameToArgs;
this._counter = (_b = serializedStylesheet === null || serializedStylesheet === void 0 ? void 0 : serializedStylesheet.counter) !== null && _b !== void 0 ? _b : this._counter;
this._keyToClassName = (_d = (_c = this._config.classNameCache) !== null && _c !== void 0 ? _c : serializedStylesheet === null || serializedStylesheet === void 0 ? void 0 : serializedStylesheet.keyToClassName) !== null && _d !== void 0 ? _d : this._keyToClassName;
this._preservedRules = (_e = serializedStylesheet === null || serializedStylesheet === void 0 ? void 0 : serializedStylesheet.preservedRules) !== null && _e !== void 0 ? _e : this._preservedRules;
this._rules = (_f = serializedStylesheet === null || serializedStylesheet === void 0 ? void 0 : serializedStylesheet.rules) !== null && _f !== void 0 ? _f : this._rules;
}
/**
* Gets the singleton instance.
*/
Stylesheet.getInstance = function (shadowConfig) {
_stylesheet = _global[exports.STYLESHEET_SETTING];
if (_global[shadowConfig_1.SHADOW_DOM_STYLESHEET_SETTING]) {
return _global[shadowConfig_1.SHADOW_DOM_STYLESHEET_SETTING].getInstance(shadowConfig);
}
if (!_stylesheet || (_stylesheet._lastStyleElement && _stylesheet._lastStyleElement.ownerDocument !== document)) {
var fabricConfig = (_global === null || _global === void 0 ? void 0 : _global.FabricConfig) || {};
var stylesheet = new Stylesheet(fabricConfig.mergeStyles, fabricConfig.serializedStylesheet);
_stylesheet = stylesheet;
_global[exports.STYLESHEET_SETTING] = stylesheet;
}
return _stylesheet;
};
/**
* Serializes the Stylesheet instance into a format which allows rehydration on creation.
* @returns string representation of `ISerializedStylesheet` interface.
*/
Stylesheet.prototype.serialize = function () {
return JSON.stringify({
classNameToArgs: this._classNameToArgs,
counter: this._counter,
keyToClassName: this._keyToClassName,
preservedRules: this._preservedRules,
rules: this._rules,
});
};
/**
* Configures the stylesheet.
*/
Stylesheet.prototype.setConfig = function (config) {
this._config = tslib_1.__assign(tslib_1.__assign({}, this._config), config);
};
/**
* Configures a reset callback.
*
* @param callback - A callback which will be called when the Stylesheet is reset.
* @returns function which when called un-registers provided callback.
*/
Stylesheet.prototype.onReset = function (callback) {
var _this = this;
this._onResetCallbacks.push(callback);
return function () {
_this._onResetCallbacks = _this._onResetCallbacks.filter(function (cb) { return cb !== callback; });
};
};
/**
* Configures an insert rule callback.
*
* @param callback - A callback which will be called when a rule is inserted.
* @returns function which when called un-registers provided callback.
*/
Stylesheet.prototype.onInsertRule = function (callback) {
var _this = this;
this._onInsertRuleCallbacks.push(callback);
return function () {
_this._onInsertRuleCallbacks = _this._onInsertRuleCallbacks.filter(function (cb) { return cb !== callback; });
};
};
/**
* Generates a unique classname.
*
* @param displayName - Optional value to use as a prefix.
*/
Stylesheet.prototype.getClassName = function (displayName) {
var namespace = this._config.namespace;
var prefix = displayName || this._config.defaultPrefix;
return "".concat(namespace ? namespace + '-' : '').concat(prefix, "-").concat(this._counter++);
};
/**
* Used internally to cache information about a class which was
* registered with the stylesheet.
*/
Stylesheet.prototype.cacheClassName = function (className, key, args, rules) {
this._keyToClassName[this._getCacheKey(key)] = className;
this._classNameToArgs[className] = {
args: args,
rules: rules,
};
};
/**
* Gets the appropriate classname given a key which was previously
* registered using cacheClassName.
*/
Stylesheet.prototype.classNameFromKey = function (key) {
return this._keyToClassName[this._getCacheKey(key)];
};
/**
* Gets all classnames cache with the stylesheet.
*/
Stylesheet.prototype.getClassNameCache = function () {
return this._keyToClassName;
};
/**
* Gets the arguments associated with a given classname which was
* previously registered using cacheClassName.
*/
Stylesheet.prototype.argsFromClassName = function (className) {
var entry = this._classNameToArgs[className];
return entry && entry.args;
};
/**
* Gets the rules associated with a given classname which was
* previously registered using cacheClassName.
*/
Stylesheet.prototype.insertedRulesFromClassName = function (className) {
var entry = this._classNameToArgs[className];
return entry && entry.rules;
};
/**
* Inserts a css rule into the stylesheet.
* @param preserve - Preserves the rule beyond a reset boundary.
*/
Stylesheet.prototype.insertRule = function (rule, preserve, stylesheetKey) {
if (stylesheetKey === void 0) { stylesheetKey = shadowConfig_1.GLOBAL_STYLESHEET_KEY; }
var injectionMode = this._config.injectionMode;
var element = injectionMode !== exports.InjectionMode.none ? this._getStyleElement() : undefined;
if (preserve) {
this._preservedRules.push(rule);
}
if (element) {
switch (injectionMode) {
case exports.InjectionMode.insertNode:
this._insertRuleIntoSheet(element.sheet, rule);
break;
case exports.InjectionMode.appendChild:
element.appendChild(document.createTextNode(rule));
break;
}
}
else {
this._rules.push(rule);
}
// eslint-disable-next-line @typescript-eslint/no-deprecated
if (this._config.onInsertRule) {
// eslint-disable-next-line @typescript-eslint/no-deprecated
this._config.onInsertRule(rule);
}
this._onInsertRuleCallbacks.forEach(function (callback) {
return callback({ key: stylesheetKey, sheet: (element ? element.sheet : undefined), rule: rule });
});
};
/**
* Gets all rules registered with the stylesheet; only valid when
* using InsertionMode.none.
*/
Stylesheet.prototype.getRules = function (includePreservedRules) {
return (includePreservedRules ? this._preservedRules.join('') : '') + this._rules.join('');
};
/**
* Resets the internal state of the stylesheet. Only used in server
* rendered scenarios where we're using InsertionMode.none.
*/
Stylesheet.prototype.reset = function () {
this._rules = [];
this._counter = 0;
this._classNameToArgs = {};
this._keyToClassName = {};
this._onResetCallbacks.forEach(function (callback) { return callback(); });
};
// Forces the regeneration of incoming styles without totally resetting the stylesheet.
Stylesheet.prototype.resetKeys = function () {
this._keyToClassName = {};
};
Stylesheet.prototype._createStyleElement = function () {
var _a;
var doc = ((_a = this._config.window) === null || _a === void 0 ? void 0 : _a.document) || document;
var head = doc.head;
var styleElement = doc.createElement('style');
var nodeToInsertBefore = null;
styleElement.setAttribute('data-merge-styles', 'true');
var cspSettings = this._config.cspSettings;
if (cspSettings) {
if (cspSettings.nonce) {
styleElement.setAttribute('nonce', cspSettings.nonce);
}
}
if (this._lastStyleElement) {
// If the `nextElementSibling` is null, then the insertBefore will act as a regular append.
// https://developer.mozilla.org/en-US/docs/Web/API/Node/insertBefore#Syntax
nodeToInsertBefore = this._lastStyleElement.nextElementSibling;
}
else {
var placeholderStyleTag = this._findPlaceholderStyleTag();
if (placeholderStyleTag) {
nodeToInsertBefore = placeholderStyleTag.nextElementSibling;
}
else {
nodeToInsertBefore = head.childNodes[0];
}
}
head.insertBefore(styleElement, head.contains(nodeToInsertBefore) ? nodeToInsertBefore : null);
this._lastStyleElement = styleElement;
return styleElement;
};
Stylesheet.prototype._insertRuleIntoSheet = function (sheet, rule) {
if (!sheet) {
return false;
}
try {
sheet.insertRule(rule, sheet.cssRules.length);
return true;
}
catch (e) {
// The browser will throw exceptions on unsupported rules (such as a moz prefix in webkit.)
// We need to swallow the exceptions for this scenario, otherwise we'd need to filter
// which could be slower and bulkier.
}
return false;
};
Stylesheet.prototype._getCacheKey = function (key) {
return key;
};
Stylesheet.prototype._getStyleElement = function () {
var _this = this;
if (!this._styleElement) {
this._styleElement = this._createStyleElement();
if (!REUSE_STYLE_NODE) {
// Reset the style element on the next frame.
var win = this._config.window || window;
win.requestAnimationFrame(function () {
_this._styleElement = undefined;
});
}
}
return this._styleElement;
};
Stylesheet.prototype._findPlaceholderStyleTag = function () {
var head = document.head;
if (head) {
return head.querySelector('style[data-merge-styles]');
}
return null;
};
return Stylesheet;
}());
exports.Stylesheet = Stylesheet;
//# sourceMappingURL=Stylesheet.js.map
File diff suppressed because one or more lines are too long
@@ -0,0 +1,3 @@
import type { ExtendedCSSStyleSheet } from './Stylesheet';
export declare const cloneCSSStyleSheet: (srcSheet: CSSStyleSheet, targetSheet: CSSStyleSheet) => CSSStyleSheet;
export declare const cloneExtendedCSSStyleSheet: (srcSheet: ExtendedCSSStyleSheet, targetSheet: ExtendedCSSStyleSheet) => ExtendedCSSStyleSheet;
+21
View File
@@ -0,0 +1,21 @@
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.cloneExtendedCSSStyleSheet = exports.cloneCSSStyleSheet = void 0;
var cloneCSSStyleSheet = function (srcSheet, targetSheet) {
for (var i = 0; i < srcSheet.cssRules.length; i++) {
targetSheet.insertRule(srcSheet.cssRules[i].cssText, i);
}
return targetSheet;
};
exports.cloneCSSStyleSheet = cloneCSSStyleSheet;
var cloneExtendedCSSStyleSheet = function (srcSheet, targetSheet) {
var clone = (0, exports.cloneCSSStyleSheet)(srcSheet, targetSheet);
clone.bucketName = srcSheet.bucketName;
for (var _i = 0, _a = Object.keys(srcSheet.metadata); _i < _a.length; _i++) {
var key = _a[_i];
clone.metadata[key] = srcSheet.metadata[key];
}
return clone;
};
exports.cloneExtendedCSSStyleSheet = cloneExtendedCSSStyleSheet;
//# sourceMappingURL=cloneCSSStyleSheet.js.map
@@ -0,0 +1 @@
{"version":3,"file":"cloneCSSStyleSheet.js","sourceRoot":"../src/","sources":["cloneCSSStyleSheet.ts"],"names":[],"mappings":";;;AAEO,IAAM,kBAAkB,GAAG,UAAC,QAAuB,EAAE,WAA0B;IACpF,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,QAAQ,CAAC,QAAQ,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE,CAAC;QAClD,WAAW,CAAC,UAAU,CAAC,QAAQ,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,OAAO,EAAE,CAAC,CAAC,CAAC;IAC1D,CAAC;IAED,OAAO,WAAW,CAAC;AACrB,CAAC,CAAC;AANW,QAAA,kBAAkB,sBAM7B;AAEK,IAAM,0BAA0B,GAAG,UACxC,QAA+B,EAC/B,WAAkC;IAElC,IAAM,KAAK,GAAG,IAAA,0BAAkB,EAAC,QAAQ,EAAE,WAAW,CAA0B,CAAC;IAEjF,KAAK,CAAC,UAAU,GAAG,QAAQ,CAAC,UAAU,CAAC;IACvC,KAAkB,UAA8B,EAA9B,KAAA,MAAM,CAAC,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,EAA9B,cAA8B,EAA9B,IAA8B,EAAE,CAAC;QAA9C,IAAM,GAAG,SAAA;QACZ,KAAK,CAAC,QAAQ,CAAC,GAAG,CAAC,GAAG,QAAQ,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC;IAC/C,CAAC;IAED,OAAO,KAAK,CAAC;AACf,CAAC,CAAC;AAZW,QAAA,0BAA0B,8BAYrC","sourcesContent":["import type { ExtendedCSSStyleSheet } from './Stylesheet';\n\nexport const cloneCSSStyleSheet = (srcSheet: CSSStyleSheet, targetSheet: CSSStyleSheet): CSSStyleSheet => {\n for (let i = 0; i < srcSheet.cssRules.length; i++) {\n targetSheet.insertRule(srcSheet.cssRules[i].cssText, i);\n }\n\n return targetSheet;\n};\n\nexport const cloneExtendedCSSStyleSheet = (\n srcSheet: ExtendedCSSStyleSheet,\n targetSheet: ExtendedCSSStyleSheet,\n): ExtendedCSSStyleSheet => {\n const clone = cloneCSSStyleSheet(srcSheet, targetSheet) as ExtendedCSSStyleSheet;\n\n clone.bucketName = srcSheet.bucketName;\n for (const key of Object.keys(srcSheet.metadata)) {\n clone.metadata[key] = srcSheet.metadata[key];\n }\n\n return clone;\n};\n"]}
+56
View File
@@ -0,0 +1,56 @@
import { IStyleSet, IConcatenatedStyleSet } from './IStyleSet';
import { ObjectOnly } from './ObjectOnly';
import { ShadowConfig } from './shadowConfig';
type Missing = false | null | undefined;
type MissingOrShadowConfig = Missing | ShadowConfig;
/**
* Combine a set of styles together (but does not register css classes).
* @param styleSet - The first style set to be concatenated.
*/
export declare function concatStyleSets<TStyleSet>(styleSet: TStyleSet | Missing): IConcatenatedStyleSet<ObjectOnly<TStyleSet>>;
/**
* Combine a set of styles together (but does not register css classes).
* @param styleSet1 - The first style set to be concatenated.
* @param styleSet2 - The second style set to be concatenated.
*/
export declare function concatStyleSets<TStyleSet1, TStyleSet2>(styleSet1: TStyleSet1 | MissingOrShadowConfig, styleSet2: TStyleSet2 | Missing): IConcatenatedStyleSet<ObjectOnly<TStyleSet1> & ObjectOnly<TStyleSet2>>;
/**
* Combine a set of styles together (but does not register css classes).
* @param styleSet1 - The first style set to be concatenated.
* @param styleSet2 - The second style set to be concatenated.
* @param styleSet3 - The third style set to be concatenated.
*/
export declare function concatStyleSets<TStyleSet1, TStyleSet2, TStyleSet3>(styleSet1: TStyleSet1 | MissingOrShadowConfig, styleSet2: TStyleSet2 | Missing, styleSet3: TStyleSet3 | Missing): IConcatenatedStyleSet<ObjectOnly<TStyleSet1> & ObjectOnly<TStyleSet2> & ObjectOnly<TStyleSet3>>;
/**
* Combine a set of styles together (but does not register css classes).
* @param styleSet1 - The first style set to be concatenated.
* @param styleSet2 - The second style set to be concatenated.
* @param styleSet3 - The third style set to be concatenated.
* @param styleSet4 - The fourth style set to be concatenated.
*/
export declare function concatStyleSets<TStyleSet1, TStyleSet2, TStyleSet3, TStyleSet4>(styleSet1: TStyleSet1 | MissingOrShadowConfig, styleSet2: TStyleSet2 | Missing, styleSet3: TStyleSet3 | Missing, styleSet4: TStyleSet4 | Missing): IConcatenatedStyleSet<ObjectOnly<TStyleSet1> & ObjectOnly<TStyleSet2> & ObjectOnly<TStyleSet3> & ObjectOnly<TStyleSet4>>;
/**
* Combine a set of styles together (but does not register css classes).
* @param styleSet1 - The first style set to be concatenated.
* @param styleSet2 - The second style set to be concatenated.
* @param styleSet3 - The third style set to be concatenated.
* @param styleSet4 - The fourth style set to be concatenated.
* @param styleSet5 - The fifth set to be concatenated.
*/
export declare function concatStyleSets<TStyleSet1, TStyleSet2, TStyleSet3, TStyleSet4, TStyleSet5>(styleSet1: TStyleSet1 | MissingOrShadowConfig, styleSet2: TStyleSet2 | Missing, styleSet3: TStyleSet3 | Missing, styleSet4: TStyleSet4 | Missing, styleSet5: TStyleSet5 | Missing): IConcatenatedStyleSet<ObjectOnly<TStyleSet1> & ObjectOnly<TStyleSet2> & ObjectOnly<TStyleSet3> & ObjectOnly<TStyleSet4> & ObjectOnly<TStyleSet5>>;
/**
* Combine a set of styles together (but does not register css classes).
* @param styleSet1 - The first style set to be concatenated.
* @param styleSet2 - The second style set to be concatenated.
* @param styleSet3 - The third style set to be concatenated.
* @param styleSet4 - The fourth style set to be concatenated.
* @param styleSet5 - The fifth set to be concatenated.
* @param styleSet6 - The sixth set to be concatenated.
*/
export declare function concatStyleSets<TStyleSet1, TStyleSet2, TStyleSet3, TStyleSet4, TStyleSet5, TStyleSet6>(styleSet1: TStyleSet1 | MissingOrShadowConfig, styleSet2: TStyleSet2 | Missing, styleSet3: TStyleSet3 | Missing, styleSet4: TStyleSet4 | Missing, styleSet5: TStyleSet5 | Missing, styleSet6: TStyleSet6 | Missing): IConcatenatedStyleSet<ObjectOnly<TStyleSet1> & ObjectOnly<TStyleSet2> & ObjectOnly<TStyleSet3> & ObjectOnly<TStyleSet4> & ObjectOnly<TStyleSet5> & ObjectOnly<TStyleSet6>>;
/**
* Combine a set of styles together (but does not register css classes).
* @param styleSets - One or more stylesets to be merged (each param can also be falsy).
*/
export declare function concatStyleSets(...styleSets: (IStyleSet | MissingOrShadowConfig)[]): IConcatenatedStyleSet<any>;
export {};
+80
View File
@@ -0,0 +1,80 @@
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.concatStyleSets = void 0;
var tslib_1 = require("tslib");
var shadowConfig_1 = require("./shadowConfig");
/**
* Combine a set of styles together (but does not register css classes).
* @param styleSets - One or more stylesets to be merged (each param can also be falsy).
*/
function concatStyleSets() {
var styleSets = [];
for (var _i = 0; _i < arguments.length; _i++) {
styleSets[_i] = arguments[_i];
}
if (styleSets &&
styleSets.length === 1 &&
styleSets[0] &&
!styleSets[0].subComponentStyles &&
!(0, shadowConfig_1.isShadowConfig)(styleSets[0])) {
return styleSets[0];
}
var mergedSet = {};
// We process sub component styles in two phases. First we collect them, then we combine them into 1 style function.
var workingSubcomponentStyles = {};
for (var _a = 0, styleSets_1 = styleSets; _a < styleSets_1.length; _a++) {
var currentSet = styleSets_1[_a];
if (currentSet && !(0, shadowConfig_1.isShadowConfig)(currentSet)) {
for (var prop in currentSet) {
if (currentSet.hasOwnProperty(prop)) {
if (prop === 'subComponentStyles' && currentSet.subComponentStyles !== undefined) {
// subcomponent styles - style functions or objects
var currentComponentStyles = currentSet.subComponentStyles;
for (var subCompProp in currentComponentStyles) {
if (currentComponentStyles.hasOwnProperty(subCompProp)) {
if (workingSubcomponentStyles.hasOwnProperty(subCompProp)) {
workingSubcomponentStyles[subCompProp].push(currentComponentStyles[subCompProp]);
}
else {
workingSubcomponentStyles[subCompProp] = [currentComponentStyles[subCompProp]];
}
}
}
continue;
}
// the as any casts below is a workaround for ts 2.8.
// todo: remove cast to any in ts 2.9.
var mergedValue = mergedSet[prop];
var currentValue = currentSet[prop];
if (mergedValue === undefined) {
mergedSet[prop] = currentValue;
}
else {
mergedSet[prop] = tslib_1.__spreadArray(tslib_1.__spreadArray([], (Array.isArray(mergedValue) ? mergedValue : [mergedValue]), true), (Array.isArray(currentValue) ? currentValue : [currentValue]), true);
}
}
}
}
}
if (Object.keys(workingSubcomponentStyles).length > 0) {
mergedSet.subComponentStyles = {};
var mergedSubStyles = mergedSet.subComponentStyles;
var _loop_1 = function (subCompProp) {
if (workingSubcomponentStyles.hasOwnProperty(subCompProp)) {
var workingSet_1 = workingSubcomponentStyles[subCompProp];
mergedSubStyles[subCompProp] = function (styleProps) {
return concatStyleSets.apply(void 0, workingSet_1.map(function (styleFunctionOrObject) {
return typeof styleFunctionOrObject === 'function' ? styleFunctionOrObject(styleProps) : styleFunctionOrObject;
}));
};
}
};
// now we process the subcomponent styles if there are any
for (var subCompProp in workingSubcomponentStyles) {
_loop_1(subCompProp);
}
}
return mergedSet;
}
exports.concatStyleSets = concatStyleSets;
//# sourceMappingURL=concatStyleSets.js.map
File diff suppressed because one or more lines are too long
@@ -0,0 +1,9 @@
import { IStyleSetBase } from './IStyleSet';
import { IStyleFunctionOrObject } from './IStyleFunction';
import { DeepPartialV2 as DeepPartial } from './DeepPartial';
/**
* Concatenates style sets into one, but resolves functional sets using the given props.
* @param styleProps - Props used to resolve functional sets.
* @param allStyles - Style sets, which can be functions or objects.
*/
export declare function concatStyleSetsWithProps<TStyleProps, TStyleSet extends IStyleSetBase>(styleProps: TStyleProps, ...allStyles: (IStyleFunctionOrObject<TStyleProps, TStyleSet> | undefined)[]): DeepPartial<TStyleSet>;
@@ -0,0 +1,35 @@
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.concatStyleSetsWithProps = void 0;
var concatStyleSets_1 = require("./concatStyleSets");
/**
* Concatenates style sets into one, but resolves functional sets using the given props.
* @param styleProps - Props used to resolve functional sets.
* @param allStyles - Style sets, which can be functions or objects.
*/
function concatStyleSetsWithProps(styleProps) {
var allStyles = [];
for (var _i = 1; _i < arguments.length; _i++) {
allStyles[_i - 1] = arguments[_i];
}
var result = [];
for (var _a = 0, allStyles_1 = allStyles; _a < allStyles_1.length; _a++) {
var styles = allStyles_1[_a];
if (styles) {
result.push(typeof styles === 'function' ? styles(styleProps) : styles);
}
}
if (result.length === 1) {
return result[0];
}
else if (result.length) {
// cliffkoh: I cannot figure out how to avoid the cast to any here.
// It is something to do with the use of Omit in IStyleSet.
// It might not be necessary once Omit becomes part of lib.d.ts (when we remove our own Omit and rely on
// the official version).
return concatStyleSets_1.concatStyleSets.apply(void 0, result);
}
return {};
}
exports.concatStyleSetsWithProps = concatStyleSetsWithProps;
//# sourceMappingURL=concatStyleSetsWithProps.js.map
@@ -0,0 +1 @@
{"version":3,"file":"concatStyleSetsWithProps.js","sourceRoot":"../src/","sources":["concatStyleSetsWithProps.ts"],"names":[],"mappings":";;;AAAA,qDAAoD;AAKpD;;;;GAIG;AACH,SAAgB,wBAAwB,CACtC,UAAuB;IACvB,mBAA4E;SAA5E,UAA4E,EAA5E,qBAA4E,EAA5E,IAA4E;QAA5E,kCAA4E;;IAE5E,IAAM,MAAM,GAAkC,EAAE,CAAC;IACjD,KAAqB,UAAS,EAAT,uBAAS,EAAT,uBAAS,EAAT,IAAS,EAAE,CAAC;QAA5B,IAAM,MAAM,kBAAA;QACf,IAAI,MAAM,EAAE,CAAC;YACX,MAAM,CAAC,IAAI,CAAC,OAAO,MAAM,KAAK,UAAU,CAAC,CAAC,CAAC,MAAM,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC;QAC1E,CAAC;IACH,CAAC;IACD,IAAI,MAAM,CAAC,MAAM,KAAK,CAAC,EAAE,CAAC;QACxB,OAAO,MAAM,CAAC,CAAC,CAAC,CAAC;IACnB,CAAC;SAAM,IAAI,MAAM,CAAC,MAAM,EAAE,CAAC;QACzB,mEAAmE;QACnE,2DAA2D;QAC3D,yGAAyG;QACzG,yBAAyB;QACzB,OAAO,iCAAe,eAAI,MAAM,CAA2B,CAAC;IAC9D,CAAC;IAED,OAAO,EAA4B,CAAC;AACtC,CAAC;AArBD,4DAqBC","sourcesContent":["import { concatStyleSets } from './concatStyleSets';\nimport { IStyleSetBase } from './IStyleSet';\nimport { IStyleFunctionOrObject } from './IStyleFunction';\nimport { DeepPartialV2 as DeepPartial } from './DeepPartial';\n\n/**\n * Concatenates style sets into one, but resolves functional sets using the given props.\n * @param styleProps - Props used to resolve functional sets.\n * @param allStyles - Style sets, which can be functions or objects.\n */\nexport function concatStyleSetsWithProps<TStyleProps, TStyleSet extends IStyleSetBase>(\n styleProps: TStyleProps,\n ...allStyles: (IStyleFunctionOrObject<TStyleProps, TStyleSet> | undefined)[]\n): DeepPartial<TStyleSet> {\n const result: Array<DeepPartial<TStyleSet>> = [];\n for (const styles of allStyles) {\n if (styles) {\n result.push(typeof styles === 'function' ? styles(styleProps) : styles);\n }\n }\n if (result.length === 1) {\n return result[0];\n } else if (result.length) {\n // cliffkoh: I cannot figure out how to avoid the cast to any here.\n // It is something to do with the use of Omit in IStyleSet.\n // It might not be necessary once Omit becomes part of lib.d.ts (when we remove our own Omit and rely on\n // the official version).\n return concatStyleSets(...result) as DeepPartial<TStyleSet>;\n }\n\n return {} as DeepPartial<TStyleSet>;\n}\n"]}
@@ -0,0 +1,10 @@
import { IStyle, IStyleBaseArray } from './IStyle';
import { Stylesheet } from './Stylesheet';
/**
* Separates the classes and style objects. Any classes that are pre-registered
* args are auto expanded into objects.
*/
export declare function extractStyleParts(sheet: Stylesheet, ...args: (IStyle | IStyle[] | false | null | undefined)[]): {
classes: string[];
objects: IStyleBaseArray;
};
+54
View File
@@ -0,0 +1,54 @@
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.extractStyleParts = void 0;
var shadowConfig_1 = require("./shadowConfig");
/**
* Separates the classes and style objects. Any classes that are pre-registered
* args are auto expanded into objects.
*/
function extractStyleParts(sheet) {
var args = [];
for (var _i = 1; _i < arguments.length; _i++) {
args[_i - 1] = arguments[_i];
}
var classes = [];
var objects = [];
var stylesheet = sheet;
function _processArgs(argsList) {
for (var _i = 0, argsList_1 = argsList; _i < argsList_1.length; _i++) {
var arg = argsList_1[_i];
if (arg && !(0, shadowConfig_1.isShadowConfig)(arg)) {
if (typeof arg === 'string') {
if (arg.indexOf(' ') >= 0) {
_processArgs(arg.split(' '));
}
else {
var translatedArgs = stylesheet.argsFromClassName(arg);
if (translatedArgs) {
_processArgs(translatedArgs);
}
else {
// Avoid adding the same class twice.
if (classes.indexOf(arg) === -1) {
classes.push(arg);
}
}
}
}
else if (Array.isArray(arg)) {
_processArgs(arg);
}
else if (typeof arg === 'object') {
objects.push(arg);
}
}
}
}
_processArgs(args);
return {
classes: classes,
objects: objects,
};
}
exports.extractStyleParts = extractStyleParts;
//# sourceMappingURL=extractStyleParts.js.map
@@ -0,0 +1 @@
{"version":3,"file":"extractStyleParts.js","sourceRoot":"../src/","sources":["extractStyleParts.ts"],"names":[],"mappings":";;;AAEA,+CAAgD;AAEhD;;;GAGG;AACH,SAAgB,iBAAiB,CAC/B,KAAiB;IACjB,cAAyD;SAAzD,UAAyD,EAAzD,qBAAyD,EAAzD,IAAyD;QAAzD,6BAAyD;;IAKzD,IAAM,OAAO,GAAa,EAAE,CAAC;IAC7B,IAAM,OAAO,GAAS,EAAE,CAAC;IACzB,IAAM,UAAU,GAAG,KAAK,CAAC;IAEzB,SAAS,YAAY,CAAC,QAA+B;QACnD,KAAkB,UAAQ,EAAR,qBAAQ,EAAR,sBAAQ,EAAR,IAAQ,EAAE,CAAC;YAAxB,IAAM,GAAG,iBAAA;YACZ,IAAI,GAAG,IAAI,CAAC,IAAA,6BAAc,EAAC,GAAG,CAAC,EAAE,CAAC;gBAChC,IAAI,OAAO,GAAG,KAAK,QAAQ,EAAE,CAAC;oBAC5B,IAAI,GAAG,CAAC,OAAO,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC;wBAC1B,YAAY,CAAC,GAAG,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC;oBAC/B,CAAC;yBAAM,CAAC;wBACN,IAAM,cAAc,GAAG,UAAU,CAAC,iBAAiB,CAAC,GAAG,CAAC,CAAC;wBAEzD,IAAI,cAAc,EAAE,CAAC;4BACnB,YAAY,CAAC,cAAc,CAAC,CAAC;wBAC/B,CAAC;6BAAM,CAAC;4BACN,qCAAqC;4BACrC,IAAI,OAAO,CAAC,OAAO,CAAC,GAAG,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC;gCAChC,OAAO,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;4BACpB,CAAC;wBACH,CAAC;oBACH,CAAC;gBACH,CAAC;qBAAM,IAAI,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC,EAAE,CAAC;oBAC9B,YAAY,CAAC,GAAG,CAAC,CAAC;gBACpB,CAAC;qBAAM,IAAI,OAAO,GAAG,KAAK,QAAQ,EAAE,CAAC;oBACnC,OAAO,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;gBACpB,CAAC;YACH,CAAC;QACH,CAAC;IACH,CAAC;IAED,YAAY,CAAC,IAAI,CAAC,CAAC;IAEnB,OAAO;QACL,OAAO,SAAA;QACP,OAAO,SAAA;KACR,CAAC;AACJ,CAAC;AA5CD,8CA4CC","sourcesContent":["import { IStyle, IStyleBaseArray } from './IStyle';\nimport { Stylesheet } from './Stylesheet';\nimport { isShadowConfig } from './shadowConfig';\n\n/**\n * Separates the classes and style objects. Any classes that are pre-registered\n * args are auto expanded into objects.\n */\nexport function extractStyleParts(\n sheet: Stylesheet,\n ...args: (IStyle | IStyle[] | false | null | undefined)[]\n): {\n classes: string[];\n objects: IStyleBaseArray;\n} {\n const classes: string[] = [];\n const objects: {}[] = [];\n const stylesheet = sheet;\n\n function _processArgs(argsList: (IStyle | IStyle[])[]): void {\n for (const arg of argsList) {\n if (arg && !isShadowConfig(arg)) {\n if (typeof arg === 'string') {\n if (arg.indexOf(' ') >= 0) {\n _processArgs(arg.split(' '));\n } else {\n const translatedArgs = stylesheet.argsFromClassName(arg);\n\n if (translatedArgs) {\n _processArgs(translatedArgs);\n } else {\n // Avoid adding the same class twice.\n if (classes.indexOf(arg) === -1) {\n classes.push(arg);\n }\n }\n }\n } else if (Array.isArray(arg)) {\n _processArgs(arg);\n } else if (typeof arg === 'object') {\n objects.push(arg);\n }\n }\n }\n }\n\n _processArgs(args);\n\n return {\n classes,\n objects,\n };\n}\n"]}
+6
View File
@@ -0,0 +1,6 @@
import { IFontFace } from './IRawStyleBase';
/**
* Registers a font face.
* @public
*/
export declare function fontFace(font: IFontFace): void;
+23
View File
@@ -0,0 +1,23 @@
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.fontFace = void 0;
var StyleOptionsState_1 = require("./StyleOptionsState");
var Stylesheet_1 = require("./Stylesheet");
var styleToClassName_1 = require("./styleToClassName");
/**
* Registers a font face.
* @public
*/
function fontFace(font) {
var stylesheet = Stylesheet_1.Stylesheet.getInstance();
var rule = (0, styleToClassName_1.serializeRuleEntries)((0, StyleOptionsState_1.getStyleOptions)(), font);
var className = stylesheet.classNameFromKey(rule);
if (className) {
return;
}
var name = stylesheet.getClassName();
stylesheet.insertRule("@font-face{".concat(rule, "}"), true);
stylesheet.cacheClassName(name, rule, [], ['font-face', rule]);
}
exports.fontFace = fontFace;
//# sourceMappingURL=fontFace.js.map
+1
View File
@@ -0,0 +1 @@
{"version":3,"file":"fontFace.js","sourceRoot":"../src/","sources":["fontFace.ts"],"names":[],"mappings":";;;AACA,yDAAsD;AACtD,2CAA0C;AAC1C,uDAA0D;AAE1D;;;GAGG;AACH,SAAgB,QAAQ,CAAC,IAAe;IACtC,IAAM,UAAU,GAAG,uBAAU,CAAC,WAAW,EAAE,CAAC;IAE5C,IAAM,IAAI,GAAG,IAAA,uCAAoB,EAAC,IAAA,mCAAe,GAAE,EAAE,IAAU,CAAC,CAAC;IAEjE,IAAM,SAAS,GAAG,UAAU,CAAC,gBAAgB,CAAC,IAAI,CAAC,CAAC;IAEpD,IAAI,SAAS,EAAE,CAAC;QACd,OAAO;IACT,CAAC;IAED,IAAM,IAAI,GAAG,UAAU,CAAC,YAAY,EAAE,CAAC;IACvC,UAAU,CAAC,UAAU,CAAC,qBAAc,IAAI,MAAG,EAAE,IAAI,CAAC,CAAC;IACnD,UAAU,CAAC,cAAc,CAAC,IAAI,EAAE,IAAI,EAAE,EAAE,EAAE,CAAC,WAAW,EAAE,IAAI,CAAC,CAAC,CAAC;AACjE,CAAC;AAdD,4BAcC","sourcesContent":["import { IFontFace } from './IRawStyleBase';\nimport { getStyleOptions } from './StyleOptionsState';\nimport { Stylesheet } from './Stylesheet';\nimport { serializeRuleEntries } from './styleToClassName';\n\n/**\n * Registers a font face.\n * @public\n */\nexport function fontFace(font: IFontFace): void {\n const stylesheet = Stylesheet.getInstance();\n\n const rule = serializeRuleEntries(getStyleOptions(), font as {});\n\n const className = stylesheet.classNameFromKey(rule);\n\n if (className) {\n return;\n }\n\n const name = stylesheet.getClassName();\n stylesheet.insertRule(`@font-face{${rule}}`, true);\n stylesheet.cacheClassName(name, rule, [], ['font-face', rule]);\n}\n"]}
@@ -0,0 +1,11 @@
export interface IVendorSettings {
isWebkit?: boolean;
isMoz?: boolean;
isMs?: boolean;
isOpera?: boolean;
}
export declare function getVendorSettings(): IVendorSettings;
/**
* Sets the vendor settings for prefixing and vendor specific operations.
*/
export declare function setVendorSettings(vendorSettings?: IVendorSettings): void;
+39
View File
@@ -0,0 +1,39 @@
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.setVendorSettings = exports.getVendorSettings = void 0;
var _vendorSettings;
function getVendorSettings() {
var _a;
if (!_vendorSettings) {
// eslint-disable-next-line no-restricted-globals
var doc = typeof document !== 'undefined' ? document : undefined;
var nav = typeof navigator !== 'undefined' ? navigator : undefined;
var userAgent = (_a = nav === null || nav === void 0 ? void 0 : nav.userAgent) === null || _a === void 0 ? void 0 : _a.toLowerCase();
if (!doc) {
_vendorSettings = {
isWebkit: true,
isMoz: true,
isOpera: true,
isMs: true,
};
}
else {
_vendorSettings = {
isWebkit: !!(doc && 'WebkitAppearance' in doc.documentElement.style),
isMoz: !!(userAgent && userAgent.indexOf('firefox') > -1),
isOpera: !!(userAgent && userAgent.indexOf('opera') > -1),
isMs: !!(nav && (/rv:11.0/i.test(nav.userAgent) || /Edge\/\d./i.test(navigator.userAgent))),
};
}
}
return _vendorSettings;
}
exports.getVendorSettings = getVendorSettings;
/**
* Sets the vendor settings for prefixing and vendor specific operations.
*/
function setVendorSettings(vendorSettings) {
_vendorSettings = vendorSettings;
}
exports.setVendorSettings = setVendorSettings;
//# sourceMappingURL=getVendorSettings.js.map
@@ -0,0 +1 @@
{"version":3,"file":"getVendorSettings.js","sourceRoot":"../src/","sources":["getVendorSettings.ts"],"names":[],"mappings":";;;AAOA,IAAI,eAA4C,CAAC;AAEjD,SAAgB,iBAAiB;;IAC/B,IAAI,CAAC,eAAe,EAAE,CAAC;QACrB,iDAAiD;QACjD,IAAM,GAAG,GAAG,OAAO,QAAQ,KAAK,WAAW,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,CAAC;QACnE,IAAM,GAAG,GAAG,OAAO,SAAS,KAAK,WAAW,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC;QACrE,IAAM,SAAS,GAAG,MAAA,GAAG,aAAH,GAAG,uBAAH,GAAG,CAAE,SAAS,0CAAE,WAAW,EAAE,CAAC;QAEhD,IAAI,CAAC,GAAG,EAAE,CAAC;YACT,eAAe,GAAG;gBAChB,QAAQ,EAAE,IAAI;gBACd,KAAK,EAAE,IAAI;gBACX,OAAO,EAAE,IAAI;gBACb,IAAI,EAAE,IAAI;aACX,CAAC;QACJ,CAAC;aAAM,CAAC;YACN,eAAe,GAAG;gBAChB,QAAQ,EAAE,CAAC,CAAC,CAAC,GAAG,IAAI,kBAAkB,IAAI,GAAG,CAAC,eAAe,CAAC,KAAK,CAAC;gBACpE,KAAK,EAAE,CAAC,CAAC,CAAC,SAAS,IAAI,SAAS,CAAC,OAAO,CAAC,SAAS,CAAC,GAAG,CAAC,CAAC,CAAC;gBACzD,OAAO,EAAE,CAAC,CAAC,CAAC,SAAS,IAAI,SAAS,CAAC,OAAO,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,CAAC;gBACzD,IAAI,EAAE,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,GAAG,CAAC,SAAS,CAAC,IAAI,YAAY,CAAC,IAAI,CAAC,SAAS,CAAC,SAAS,CAAC,CAAC,CAAC;aAC5F,CAAC;QACJ,CAAC;IACH,CAAC;IAED,OAAO,eAAe,CAAC;AACzB,CAAC;AAzBD,8CAyBC;AAED;;GAEG;AACH,SAAgB,iBAAiB,CAAC,cAAgC;IAChE,eAAe,GAAG,cAAc,CAAC;AACnC,CAAC;AAFD,8CAEC","sourcesContent":["export interface IVendorSettings {\n isWebkit?: boolean;\n isMoz?: boolean;\n isMs?: boolean;\n isOpera?: boolean;\n}\n\nlet _vendorSettings: IVendorSettings | undefined;\n\nexport function getVendorSettings(): IVendorSettings {\n if (!_vendorSettings) {\n // eslint-disable-next-line no-restricted-globals\n const doc = typeof document !== 'undefined' ? document : undefined;\n const nav = typeof navigator !== 'undefined' ? navigator : undefined;\n const userAgent = nav?.userAgent?.toLowerCase();\n\n if (!doc) {\n _vendorSettings = {\n isWebkit: true,\n isMoz: true,\n isOpera: true,\n isMs: true,\n };\n } else {\n _vendorSettings = {\n isWebkit: !!(doc && 'WebkitAppearance' in doc.documentElement.style),\n isMoz: !!(userAgent && userAgent.indexOf('firefox') > -1),\n isOpera: !!(userAgent && userAgent.indexOf('opera') > -1),\n isMs: !!(nav && (/rv:11.0/i.test(nav.userAgent) || /Edge\\/\\d./i.test(navigator.userAgent))),\n };\n }\n }\n\n return _vendorSettings;\n}\n\n/**\n * Sets the vendor settings for prefixing and vendor specific operations.\n */\nexport function setVendorSettings(vendorSettings?: IVendorSettings): void {\n _vendorSettings = vendorSettings;\n}\n"]}
+23
View File
@@ -0,0 +1,23 @@
export type { IStyle, IStyleBase, IStyleBaseArray } from './IStyle';
export type { IRawStyle } from './IRawStyle';
export type { IKeyframes } from './IKeyframes';
export type { IStyleFunction, IStyleFunctionOrObject } from './IStyleFunction';
export type { DeepPartial } from './DeepPartial';
export type { IConcatenatedStyleSet, IProcessedStyleSet, IStyleSet, IStyleSetBase, Omit } from './IStyleSet';
export type { ICSSRule, ICSSPixelUnitRule, IFontFace, IFontWeight, IRawFontStyle, IRawStyleBase, } from './IRawStyleBase';
export { mergeStyles, mergeCss } from './mergeStyles';
export { mergeStyleSets, mergeCssSets } from './mergeStyleSets';
export { concatStyleSets } from './concatStyleSets';
export { concatStyleSetsWithProps } from './concatStyleSetsWithProps';
export { fontFace } from './fontFace';
export { keyframes } from './keyframes';
export { InjectionMode, Stylesheet } from './Stylesheet';
export type { ICSPSettings, ISerializedStylesheet, IStyleSheetConfig, ExtendedCSSStyleSheet, InsertRuleCallback, } from './Stylesheet';
export { ShadowDomStylesheet, SUPPORTS_CONSTRUCTABLE_STYLESHEETS, SUPPORTS_MODIFYING_ADOPTED_STYLESHEETS, } from './ShadowDomStylesheet';
export type { AddSheetCallback } from './ShadowDomStylesheet';
export { setRTL } from './StyleOptionsState';
export type { ObjectOnly } from './ObjectOnly';
export { DEFAULT_SHADOW_CONFIG, GLOBAL_STYLESHEET_KEY, makeShadowConfig } from './shadowConfig';
export type { ShadowConfig } from './shadowConfig';
export { cloneCSSStyleSheet } from './cloneCSSStyleSheet';
import './version';
+34
View File
@@ -0,0 +1,34 @@
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.cloneCSSStyleSheet = exports.makeShadowConfig = exports.GLOBAL_STYLESHEET_KEY = exports.DEFAULT_SHADOW_CONFIG = exports.setRTL = exports.SUPPORTS_MODIFYING_ADOPTED_STYLESHEETS = exports.SUPPORTS_CONSTRUCTABLE_STYLESHEETS = exports.ShadowDomStylesheet = exports.Stylesheet = exports.InjectionMode = exports.keyframes = exports.fontFace = exports.concatStyleSetsWithProps = exports.concatStyleSets = exports.mergeCssSets = exports.mergeStyleSets = exports.mergeCss = exports.mergeStyles = void 0;
var mergeStyles_1 = require("./mergeStyles");
Object.defineProperty(exports, "mergeStyles", { enumerable: true, get: function () { return mergeStyles_1.mergeStyles; } });
Object.defineProperty(exports, "mergeCss", { enumerable: true, get: function () { return mergeStyles_1.mergeCss; } });
var mergeStyleSets_1 = require("./mergeStyleSets");
Object.defineProperty(exports, "mergeStyleSets", { enumerable: true, get: function () { return mergeStyleSets_1.mergeStyleSets; } });
Object.defineProperty(exports, "mergeCssSets", { enumerable: true, get: function () { return mergeStyleSets_1.mergeCssSets; } });
var concatStyleSets_1 = require("./concatStyleSets");
Object.defineProperty(exports, "concatStyleSets", { enumerable: true, get: function () { return concatStyleSets_1.concatStyleSets; } });
var concatStyleSetsWithProps_1 = require("./concatStyleSetsWithProps");
Object.defineProperty(exports, "concatStyleSetsWithProps", { enumerable: true, get: function () { return concatStyleSetsWithProps_1.concatStyleSetsWithProps; } });
var fontFace_1 = require("./fontFace");
Object.defineProperty(exports, "fontFace", { enumerable: true, get: function () { return fontFace_1.fontFace; } });
var keyframes_1 = require("./keyframes");
Object.defineProperty(exports, "keyframes", { enumerable: true, get: function () { return keyframes_1.keyframes; } });
var Stylesheet_1 = require("./Stylesheet");
Object.defineProperty(exports, "InjectionMode", { enumerable: true, get: function () { return Stylesheet_1.InjectionMode; } });
Object.defineProperty(exports, "Stylesheet", { enumerable: true, get: function () { return Stylesheet_1.Stylesheet; } });
var ShadowDomStylesheet_1 = require("./ShadowDomStylesheet");
Object.defineProperty(exports, "ShadowDomStylesheet", { enumerable: true, get: function () { return ShadowDomStylesheet_1.ShadowDomStylesheet; } });
Object.defineProperty(exports, "SUPPORTS_CONSTRUCTABLE_STYLESHEETS", { enumerable: true, get: function () { return ShadowDomStylesheet_1.SUPPORTS_CONSTRUCTABLE_STYLESHEETS; } });
Object.defineProperty(exports, "SUPPORTS_MODIFYING_ADOPTED_STYLESHEETS", { enumerable: true, get: function () { return ShadowDomStylesheet_1.SUPPORTS_MODIFYING_ADOPTED_STYLESHEETS; } });
var StyleOptionsState_1 = require("./StyleOptionsState");
Object.defineProperty(exports, "setRTL", { enumerable: true, get: function () { return StyleOptionsState_1.setRTL; } });
var shadowConfig_1 = require("./shadowConfig");
Object.defineProperty(exports, "DEFAULT_SHADOW_CONFIG", { enumerable: true, get: function () { return shadowConfig_1.DEFAULT_SHADOW_CONFIG; } });
Object.defineProperty(exports, "GLOBAL_STYLESHEET_KEY", { enumerable: true, get: function () { return shadowConfig_1.GLOBAL_STYLESHEET_KEY; } });
Object.defineProperty(exports, "makeShadowConfig", { enumerable: true, get: function () { return shadowConfig_1.makeShadowConfig; } });
var cloneCSSStyleSheet_1 = require("./cloneCSSStyleSheet");
Object.defineProperty(exports, "cloneCSSStyleSheet", { enumerable: true, get: function () { return cloneCSSStyleSheet_1.cloneCSSStyleSheet; } });
require("./version");
//# sourceMappingURL=index.js.map
+1
View File
@@ -0,0 +1 @@
{"version":3,"file":"index.js","sourceRoot":"../src/","sources":["index.ts"],"names":[],"mappings":";;;AAuBA,6CAAsD;AAA7C,0GAAA,WAAW,OAAA;AAAE,uGAAA,QAAQ,OAAA;AAE9B,mDAAgE;AAAvD,gHAAA,cAAc,OAAA;AAAE,8GAAA,YAAY,OAAA;AAErC,qDAAoD;AAA3C,kHAAA,eAAe,OAAA;AAExB,uEAAsE;AAA7D,oIAAA,wBAAwB,OAAA;AAEjC,uCAAsC;AAA7B,oGAAA,QAAQ,OAAA;AAEjB,yCAAwC;AAA/B,sGAAA,SAAS,OAAA;AAElB,2CAAyD;AAAhD,2GAAA,aAAa,OAAA;AAAE,wGAAA,UAAU,OAAA;AASlC,6DAI+B;AAH7B,0HAAA,mBAAmB,OAAA;AACnB,yIAAA,kCAAkC,OAAA;AAClC,6IAAA,sCAAsC,OAAA;AAKxC,yDAA6C;AAApC,2GAAA,MAAM,OAAA;AAIf,+CAAgG;AAAvF,qHAAA,qBAAqB,OAAA;AAAE,qHAAA,qBAAqB,OAAA;AAAE,gHAAA,gBAAgB,OAAA;AAGvE,2DAA0D;AAAjD,wHAAA,kBAAkB,OAAA;AAE3B,qBAAmB","sourcesContent":["export type { IStyle, IStyleBase, IStyleBaseArray } from './IStyle';\n\nexport type { IRawStyle } from './IRawStyle';\n\nexport type { IKeyframes } from './IKeyframes';\n\nexport type { IStyleFunction, IStyleFunctionOrObject } from './IStyleFunction';\n\n// eslint-disable-next-line @typescript-eslint/no-deprecated\nexport type { DeepPartial } from './DeepPartial';\n\n// eslint-disable-next-line @typescript-eslint/no-deprecated\nexport type { IConcatenatedStyleSet, IProcessedStyleSet, IStyleSet, IStyleSetBase, Omit } from './IStyleSet';\n\nexport type {\n ICSSRule,\n ICSSPixelUnitRule,\n IFontFace,\n IFontWeight,\n IRawFontStyle,\n IRawStyleBase,\n} from './IRawStyleBase';\n\nexport { mergeStyles, mergeCss } from './mergeStyles';\n\nexport { mergeStyleSets, mergeCssSets } from './mergeStyleSets';\n\nexport { concatStyleSets } from './concatStyleSets';\n\nexport { concatStyleSetsWithProps } from './concatStyleSetsWithProps';\n\nexport { fontFace } from './fontFace';\n\nexport { keyframes } from './keyframes';\n\nexport { InjectionMode, Stylesheet } from './Stylesheet';\nexport type {\n ICSPSettings,\n ISerializedStylesheet,\n IStyleSheetConfig,\n ExtendedCSSStyleSheet,\n InsertRuleCallback,\n} from './Stylesheet';\n\nexport {\n ShadowDomStylesheet,\n SUPPORTS_CONSTRUCTABLE_STYLESHEETS,\n SUPPORTS_MODIFYING_ADOPTED_STYLESHEETS,\n} from './ShadowDomStylesheet';\n\nexport type { AddSheetCallback } from './ShadowDomStylesheet';\n\nexport { setRTL } from './StyleOptionsState';\n\nexport type { ObjectOnly } from './ObjectOnly';\n\nexport { DEFAULT_SHADOW_CONFIG, GLOBAL_STYLESHEET_KEY, makeShadowConfig } from './shadowConfig';\nexport type { ShadowConfig } from './shadowConfig';\n\nexport { cloneCSSStyleSheet } from './cloneCSSStyleSheet';\n\nimport './version';\n"]}
+7
View File
@@ -0,0 +1,7 @@
import { IKeyframes } from './IKeyframes';
/**
* Registers keyframe definitions.
*
* @public
*/
export declare function keyframes(timeline: IKeyframes): string;
+31
View File
@@ -0,0 +1,31 @@
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.keyframes = void 0;
var StyleOptionsState_1 = require("./StyleOptionsState");
var Stylesheet_1 = require("./Stylesheet");
var styleToClassName_1 = require("./styleToClassName");
/**
* Registers keyframe definitions.
*
* @public
*/
function keyframes(timeline) {
var stylesheet = Stylesheet_1.Stylesheet.getInstance();
var rulesArray = [];
for (var prop in timeline) {
if (timeline.hasOwnProperty(prop)) {
rulesArray.push(prop, '{', (0, styleToClassName_1.serializeRuleEntries)((0, StyleOptionsState_1.getStyleOptions)(), timeline[prop]), '}');
}
}
var rules = rulesArray.join('');
var className = stylesheet.classNameFromKey(rules);
if (className) {
return className;
}
var name = stylesheet.getClassName();
stylesheet.insertRule("@keyframes ".concat(name, "{").concat(rules, "}"), true);
stylesheet.cacheClassName(name, rules, [], ['keyframes', rules]);
return name;
}
exports.keyframes = keyframes;
//# sourceMappingURL=keyframes.js.map
+1
View File
@@ -0,0 +1 @@
{"version":3,"file":"keyframes.js","sourceRoot":"../src/","sources":["keyframes.ts"],"names":[],"mappings":";;;AACA,yDAAsD;AACtD,2CAA0C;AAC1C,uDAA0D;AAE1D;;;;GAIG;AACH,SAAgB,SAAS,CAAC,QAAoB;IAC5C,IAAM,UAAU,GAAG,uBAAU,CAAC,WAAW,EAAE,CAAC;IAC5C,IAAM,UAAU,GAAa,EAAE,CAAC;IAEhC,KAAK,IAAM,IAAI,IAAI,QAAQ,EAAE,CAAC;QAC5B,IAAI,QAAQ,CAAC,cAAc,CAAC,IAAI,CAAC,EAAE,CAAC;YAClC,UAAU,CAAC,IAAI,CAAC,IAAI,EAAE,GAAG,EAAE,IAAA,uCAAoB,EAAC,IAAA,mCAAe,GAAE,EAAE,QAAQ,CAAC,IAAI,CAAC,CAAC,EAAE,GAAG,CAAC,CAAC;QAC3F,CAAC;IACH,CAAC;IACD,IAAM,KAAK,GAAG,UAAU,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;IAElC,IAAM,SAAS,GAAG,UAAU,CAAC,gBAAgB,CAAC,KAAK,CAAC,CAAC;IAErD,IAAI,SAAS,EAAE,CAAC;QACd,OAAO,SAAS,CAAC;IACnB,CAAC;IAED,IAAM,IAAI,GAAG,UAAU,CAAC,YAAY,EAAE,CAAC;IACvC,UAAU,CAAC,UAAU,CAAC,qBAAc,IAAI,cAAI,KAAK,MAAG,EAAE,IAAI,CAAC,CAAC;IAC5D,UAAU,CAAC,cAAc,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,WAAW,EAAE,KAAK,CAAC,CAAC,CAAC;IAEjE,OAAO,IAAI,CAAC;AACd,CAAC;AAtBD,8BAsBC","sourcesContent":["import { IKeyframes } from './IKeyframes';\nimport { getStyleOptions } from './StyleOptionsState';\nimport { Stylesheet } from './Stylesheet';\nimport { serializeRuleEntries } from './styleToClassName';\n\n/**\n * Registers keyframe definitions.\n *\n * @public\n */\nexport function keyframes(timeline: IKeyframes): string {\n const stylesheet = Stylesheet.getInstance();\n const rulesArray: string[] = [];\n\n for (const prop in timeline) {\n if (timeline.hasOwnProperty(prop)) {\n rulesArray.push(prop, '{', serializeRuleEntries(getStyleOptions(), timeline[prop]), '}');\n }\n }\n const rules = rulesArray.join('');\n\n const className = stylesheet.classNameFromKey(rules);\n\n if (className) {\n return className;\n }\n\n const name = stylesheet.getClassName();\n stylesheet.insertRule(`@keyframes ${name}{${rules}}`, true);\n stylesheet.cacheClassName(name, rules, [], ['keyframes', rules]);\n\n return name;\n}\n"]}
+109
View File
@@ -0,0 +1,109 @@
import { IStyleOptions } from './IStyleOptions';
import { IProcessedStyleSet, IStyleSet } from './IStyleSet';
import { ObjectOnly } from './ObjectOnly';
import { ShadowConfig } from './shadowConfig';
type Missing = false | null | undefined;
type MissingOrShadowConfig = Missing | ShadowConfig;
/**
* Takes in one or more style set objects, each consisting of a set of areas,
* each which will produce a class name. Using this is analogous to calling
* `mergeStyles` for each property in the object, but ensures we maintain the
* set ordering when multiple style sets are merged.
*
* @param styleSet - The first style set to be merged and reigstered.
*/
export declare function mergeStyleSets<TStyleSet>(styleSet: TStyleSet | Missing): IProcessedStyleSet<ObjectOnly<TStyleSet>>;
/**
* Takes in one or more style set objects, each consisting of a set of areas,
* each which will produce a class name. Using this is analogous to calling
* `mergeStyles` for each property in the object, but ensures we maintain the
* set ordering when multiple style sets are merged.
*
* @param styleSet1 - The first style set to be merged.
* @param styleSet2 - The second style set to be merged.
*/
export declare function mergeStyleSets<TStyleSet1, TStyleSet2>(styleSet1: TStyleSet1 | Missing, styleSet2: TStyleSet2 | Missing): IProcessedStyleSet<ObjectOnly<TStyleSet1> & ObjectOnly<TStyleSet2>>;
/**
* Takes in one or more style set objects, each consisting of a set of areas,
* each which will produce a class name. Using this is analogous to calling
* `mergeStyles` for each property in the object, but ensures we maintain the
* set ordering when multiple style sets are merged.
*
* @param styleSet1 - The first style set to be merged.
* @param styleSet2 - The second style set to be merged.
* @param styleSet3 - The third style set to be merged.
*/
export declare function mergeStyleSets<TStyleSet1, TStyleSet2, TStyleSet3>(styleSet1: TStyleSet1 | Missing, styleSet2: TStyleSet2 | Missing, styleSet3: TStyleSet3 | Missing): IProcessedStyleSet<ObjectOnly<TStyleSet1> & ObjectOnly<TStyleSet2> & ObjectOnly<TStyleSet3>>;
/**
* Takes in one or more style set objects, each consisting of a set of areas,
* each which will produce a class name. Using this is analogous to calling
* `mergeStyles` for each property in the object, but ensures we maintain the
* set ordering when multiple style sets are merged.
*
* @param styleSet1 - The first style set to be merged.
* @param styleSet2 - The second style set to be merged.
* @param styleSet3 - The third style set to be merged.
* @param styleSet4 - The fourth style set to be merged.
*/
export declare function mergeStyleSets<TStyleSet1, TStyleSet2, TStyleSet3, TStyleSet4>(styleSet1: TStyleSet1 | Missing, styleSet2: TStyleSet2 | Missing, styleSet3: TStyleSet3 | Missing, styleSet4: TStyleSet4 | Missing): IProcessedStyleSet<ObjectOnly<TStyleSet1> & ObjectOnly<TStyleSet2> & ObjectOnly<TStyleSet3> & ObjectOnly<TStyleSet4>>;
/**
* Takes in one or more style set objects, each consisting of a set of areas,
* each which will produce a class name. Using this is analogous to calling
* `mergeStyles` for each property in the object, but ensures we maintain the
* set ordering when multiple style sets are merged.
*
* @param styleSets - One or more style sets to be merged.
*/
export declare function mergeStyleSets(...styleSets: Array<IStyleSet | MissingOrShadowConfig>): IProcessedStyleSet<any>;
export declare function mergeStyleSets(shadowConfig: ShadowConfig, ...styleSets: Array<IStyleSet | Missing>): IProcessedStyleSet<any>;
/**
* Takes in one or more style set objects, each1consisting of a set of areas,
* each which will produce a class name. Using this is analogous to calling
* `mergeCss` for each property in the object, but ensures we maintain the
* set ordering when multiple style sets are merged.
*
* @param styleSets - One or more style sets to be merged.
* @param options - (optional) Options to use when creating rules.
*/
export declare function mergeCssSets<TStyleSet>(styleSets: [TStyleSet | Missing], options?: IStyleOptions): IProcessedStyleSet<ObjectOnly<TStyleSet>>;
/**
* Takes in one or more style set objects, each1consisting of a set of areas,
* each which will produce a class name. Using this is analogous to calling
* `mergeCss` for each property in the object, but ensures we maintain the
* set ordering when multiple style sets are merged.
*
* @param styleSets - One or more style sets to be merged.
* @param options - (optional) Options to use when creating rules.
*/
export declare function mergeCssSets<TStyleSet1, TStyleSet2>(styleSets: [TStyleSet1 | MissingOrShadowConfig, TStyleSet2 | Missing], options?: IStyleOptions): IProcessedStyleSet<ObjectOnly<TStyleSet1> & ObjectOnly<TStyleSet2>>;
/**
* Takes in one or more style set objects, each1consisting of a set of areas,
* each which will produce a class name. Using this is analogous to calling
* `mergeCss` for each property in the object, but ensures we maintain the
* set ordering when multiple style sets are merged.
*
* @param styleSets - One or more style sets to be merged.
* @param options - (optional) Options to use when creating rules.
*/
export declare function mergeCssSets<TStyleSet1, TStyleSet2, TStyleSet3>(styleSets: [TStyleSet1 | MissingOrShadowConfig, TStyleSet2 | Missing, TStyleSet3 | Missing], options?: IStyleOptions): IProcessedStyleSet<ObjectOnly<TStyleSet1> & ObjectOnly<TStyleSet2> & ObjectOnly<TStyleSet3>>;
/**
* Takes in one or more style set objects, each1consisting of a set of areas,
* each which will produce a class name. Using this is analogous to calling
* `mergeCss` for each property in the object, but ensures we maintain the
* set ordering when multiple style sets are merged.
*
* @param styleSets - One or more style sets to be merged.
* @param options - (optional) Options to use when creating rules.
*/
export declare function mergeCssSets<TStyleSet1, TStyleSet2, TStyleSet3, TStyleSet4>(styleSets: [TStyleSet1 | MissingOrShadowConfig, TStyleSet2 | Missing, TStyleSet3 | Missing, TStyleSet4 | Missing], options?: IStyleOptions): IProcessedStyleSet<ObjectOnly<TStyleSet1> & ObjectOnly<TStyleSet2> & ObjectOnly<TStyleSet3> & ObjectOnly<TStyleSet4>>;
/**
* Takes in one or more style set objects, each1consisting of a set of areas,
* each which will produce a class name. Using this is analogous to calling
* `mergeCss` for each property in the object, but ensures we maintain the
* set ordering when multiple style sets are merged.
*
* @param styleSets - One or more style sets to be merged.
* @param options - (optional) Options to use when creating rules.
*/
export declare function mergeCssSets<TStyleSet>(styleSet: [TStyleSet | Missing], options?: IStyleOptions): IProcessedStyleSet<ObjectOnly<TStyleSet>>;
export {};
+88
View File
@@ -0,0 +1,88 @@
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.mergeCssSets = exports.mergeStyleSets = void 0;
var tslib_1 = require("tslib");
var concatStyleSets_1 = require("./concatStyleSets");
var extractStyleParts_1 = require("./extractStyleParts");
var StyleOptionsState_1 = require("./StyleOptionsState");
var styleToClassName_1 = require("./styleToClassName");
var shadowConfig_1 = require("./shadowConfig");
var Stylesheet_1 = require("./Stylesheet");
/**
* Takes in one or more style set objects, each consisting of a set of areas,
* each which will produce a class name. Using this is analogous to calling
* `mergeStyles` for each property in the object, but ensures we maintain the
* set ordering when multiple style sets are merged.
*
* @param styleSets - One or more style sets to be merged.
*/
function mergeStyleSets() {
var styleSets = [];
for (var _i = 0; _i < arguments.length; _i++) {
styleSets[_i] = arguments[_i];
}
return mergeCssSets(styleSets, (0, StyleOptionsState_1.getStyleOptions)());
}
exports.mergeStyleSets = mergeStyleSets;
/**
* Takes in one or more style set objects, each1consisting of a set of areas,
* each which will produce a class name. Using this is analogous to calling
* `mergeCss` for each property in the object, but ensures the
* set ordering when multiple style sets are merged.
*
* @param styleSets - One or more style sets to be merged.
* @param options - (optional) Options to use when creating rules.
*/
function mergeCssSets(styleSets, options) {
var classNameSet = { subComponentStyles: {} };
var shadowConfig = undefined;
var styleSet;
if ((0, shadowConfig_1.isShadowConfig)(styleSets[0])) {
shadowConfig = styleSets[0];
styleSet = styleSets[1];
}
else {
styleSet = styleSets[0];
}
shadowConfig !== null && shadowConfig !== void 0 ? shadowConfig : (shadowConfig = options === null || options === void 0 ? void 0 : options.shadowConfig);
var opts = tslib_1.__assign(tslib_1.__assign({}, options), { shadowConfig: shadowConfig });
if (!styleSet && styleSets.length <= 1) {
return { subComponentStyles: {} };
}
var sheet = Stylesheet_1.Stylesheet.getInstance(shadowConfig);
opts.stylesheet = sheet;
var concatenatedStyleSet = concatStyleSets_1.concatStyleSets.apply(void 0, styleSets);
var registrations = [];
for (var styleSetArea in concatenatedStyleSet) {
if (concatenatedStyleSet.hasOwnProperty(styleSetArea)) {
if (styleSetArea === 'subComponentStyles') {
classNameSet.subComponentStyles = concatenatedStyleSet.subComponentStyles || {};
continue;
}
else if (styleSetArea === '__shadowConfig__') {
continue;
}
var styles = concatenatedStyleSet[styleSetArea];
var _a = (0, extractStyleParts_1.extractStyleParts)(sheet, styles), classes = _a.classes, objects = _a.objects;
if (objects === null || objects === void 0 ? void 0 : objects.length) {
var registration = (0, styleToClassName_1.styleToRegistration)(opts || {}, { displayName: styleSetArea }, objects);
if (registration) {
registrations.push(registration);
classNameSet[styleSetArea] = classes.concat([registration.className]).join(' ');
}
}
else {
classNameSet[styleSetArea] = classes.join(' ');
}
}
}
for (var _i = 0, registrations_1 = registrations; _i < registrations_1.length; _i++) {
var registration = registrations_1[_i];
if (registration) {
(0, styleToClassName_1.applyRegistration)(registration, options === null || options === void 0 ? void 0 : options.specificityMultiplier, shadowConfig);
}
}
return classNameSet;
}
exports.mergeCssSets = mergeCssSets;
//# sourceMappingURL=mergeStyleSets.js.map
File diff suppressed because one or more lines are too long
+16
View File
@@ -0,0 +1,16 @@
import { IStyle, IStyleBaseArray } from './IStyle';
import { IStyleOptions } from './IStyleOptions';
import { ShadowConfig } from './shadowConfig';
type Missing = false | null | undefined;
type StyleArg = IStyle | IStyleBaseArray | Missing;
type StyleArgWithShadow = StyleArg | ShadowConfig;
export declare function mergeStyles(...args: StyleArg[]): string;
export declare function mergeStyles(shadowConfig: ShadowConfig, ...args: StyleArg[]): string;
/**
* Concatenation helper, which can merge class names together. Skips over falsey values.
* Accepts a set of options that will be used when calculating styles.
*
* @public
*/
export declare function mergeCss(args: StyleArgWithShadow | StyleArgWithShadow[], options?: IStyleOptions): string;
export {};
+43
View File
@@ -0,0 +1,43 @@
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.mergeCss = exports.mergeStyles = void 0;
var extractStyleParts_1 = require("./extractStyleParts");
var shadowConfig_1 = require("./shadowConfig");
var StyleOptionsState_1 = require("./StyleOptionsState");
var Stylesheet_1 = require("./Stylesheet");
var styleToClassName_1 = require("./styleToClassName");
/**
* Concatenation helper, which can merge class names together. Skips over falsey values.
*
* @public
*/
function mergeStyles() {
var args = [];
for (var _i = 0; _i < arguments.length; _i++) {
args[_i] = arguments[_i];
}
return mergeCss(args, (0, StyleOptionsState_1.getStyleOptions)());
}
exports.mergeStyles = mergeStyles;
/**
* Concatenation helper, which can merge class names together. Skips over falsey values.
* Accepts a set of options that will be used when calculating styles.
*
* @public
*/
function mergeCss(args, options) {
var styleArgs = args instanceof Array ? args : [args];
var opts = options || {};
var hasShadowConfig = (0, shadowConfig_1.isShadowConfig)(styleArgs[0]);
if (hasShadowConfig) {
opts.shadowConfig = styleArgs[0];
}
opts.stylesheet = Stylesheet_1.Stylesheet.getInstance(opts.shadowConfig);
var _a = (0, extractStyleParts_1.extractStyleParts)(opts.stylesheet, styleArgs), classes = _a.classes, objects = _a.objects;
if (objects.length) {
classes.push((0, styleToClassName_1.styleToClassName)(opts, objects));
}
return classes.join(' ');
}
exports.mergeCss = mergeCss;
//# sourceMappingURL=mergeStyles.js.map
+1
View File
@@ -0,0 +1 @@
{"version":3,"file":"mergeStyles.js","sourceRoot":"../src/","sources":["mergeStyles.ts"],"names":[],"mappings":";;;AAAA,yDAAwD;AAGxD,+CAA8D;AAC9D,yDAAsD;AACtD,2CAA0C;AAC1C,uDAAsD;AAQtD;;;;GAIG;AACH,SAAgB,WAAW;IAAC,cAAc;SAAd,UAAc,EAAd,qBAAc,EAAd,IAAc;QAAd,yBAAc;;IACxC,OAAO,QAAQ,CAAC,IAAI,EAAE,IAAA,mCAAe,GAAE,CAAC,CAAC;AAC3C,CAAC;AAFD,kCAEC;AAED;;;;;GAKG;AACH,SAAgB,QAAQ,CAAC,IAA+C,EAAE,OAAuB;IAC/F,IAAM,SAAS,GAAG,IAAI,YAAY,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC;IACxD,IAAM,IAAI,GAAG,OAAO,IAAI,EAAE,CAAC;IAC3B,IAAM,eAAe,GAAG,IAAA,6BAAc,EAAC,SAAS,CAAC,CAAC,CAAC,CAAC,CAAC;IACrD,IAAI,eAAe,EAAE,CAAC;QACpB,IAAI,CAAC,YAAY,GAAG,SAAS,CAAC,CAAC,CAAiB,CAAC;IACnD,CAAC;IACD,IAAI,CAAC,UAAU,GAAG,uBAAU,CAAC,WAAW,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;IACtD,IAAA,KAAuB,IAAA,qCAAiB,EAAC,IAAI,CAAC,UAAU,EAAE,SAAS,CAAC,EAAlE,OAAO,aAAA,EAAE,OAAO,aAAkD,CAAC;IAE3E,IAAI,OAAO,CAAC,MAAM,EAAE,CAAC;QACnB,OAAO,CAAC,IAAI,CAAC,IAAA,mCAAgB,EAAC,IAAI,EAAE,OAAO,CAAC,CAAC,CAAC;IAChD,CAAC;IAED,OAAO,OAAO,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;AAC3B,CAAC;AAfD,4BAeC","sourcesContent":["import { extractStyleParts } from './extractStyleParts';\nimport { IStyle, IStyleBaseArray } from './IStyle';\nimport { IStyleOptions } from './IStyleOptions';\nimport { isShadowConfig, ShadowConfig } from './shadowConfig';\nimport { getStyleOptions } from './StyleOptionsState';\nimport { Stylesheet } from './Stylesheet';\nimport { styleToClassName } from './styleToClassName';\n\ntype Missing = false | null | undefined;\ntype StyleArg = IStyle | IStyleBaseArray | Missing;\ntype StyleArgWithShadow = StyleArg | ShadowConfig;\n\nexport function mergeStyles(...args: StyleArg[]): string;\nexport function mergeStyles(shadowConfig: ShadowConfig, ...args: StyleArg[]): string;\n/**\n * Concatenation helper, which can merge class names together. Skips over falsey values.\n *\n * @public\n */\nexport function mergeStyles(...args: any[]): string {\n return mergeCss(args, getStyleOptions());\n}\n\n/**\n * Concatenation helper, which can merge class names together. Skips over falsey values.\n * Accepts a set of options that will be used when calculating styles.\n *\n * @public\n */\nexport function mergeCss(args: StyleArgWithShadow | StyleArgWithShadow[], options?: IStyleOptions): string {\n const styleArgs = args instanceof Array ? args : [args];\n const opts = options || {};\n const hasShadowConfig = isShadowConfig(styleArgs[0]);\n if (hasShadowConfig) {\n opts.shadowConfig = styleArgs[0] as ShadowConfig;\n }\n opts.stylesheet = Stylesheet.getInstance(opts.shadowConfig);\n const { classes, objects } = extractStyleParts(opts.stylesheet, styleArgs);\n\n if (objects.length) {\n classes.push(styleToClassName(opts, objects));\n }\n\n return classes.join(' ');\n}\n"]}
+9
View File
@@ -0,0 +1,9 @@
/**
* Renders a given string and returns both html and css needed for the html.
* @param onRender - Function that returns a string.
* @param namespace - Optional namespace to prepend to css classnames to avoid collisions.
*/
export declare function renderStatic(onRender: () => string, namespace?: string): {
html: string;
css: string;
};
+23
View File
@@ -0,0 +1,23 @@
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.renderStatic = void 0;
var Stylesheet_1 = require("./Stylesheet");
/**
* Renders a given string and returns both html and css needed for the html.
* @param onRender - Function that returns a string.
* @param namespace - Optional namespace to prepend to css classnames to avoid collisions.
*/
function renderStatic(onRender, namespace) {
var stylesheet = Stylesheet_1.Stylesheet.getInstance();
stylesheet.setConfig({
injectionMode: Stylesheet_1.InjectionMode.none,
namespace: namespace,
});
stylesheet.reset();
return {
html: onRender(),
css: stylesheet.getRules(true),
};
}
exports.renderStatic = renderStatic;
//# sourceMappingURL=server.js.map
+1
View File
@@ -0,0 +1 @@
{"version":3,"file":"server.js","sourceRoot":"../src/","sources":["server.ts"],"names":[],"mappings":";;;AAAA,2CAAyD;AAEzD;;;;GAIG;AACH,SAAgB,YAAY,CAAC,QAAsB,EAAE,SAAkB;IACrE,IAAM,UAAU,GAAG,uBAAU,CAAC,WAAW,EAAE,CAAC;IAE5C,UAAU,CAAC,SAAS,CAAC;QACnB,aAAa,EAAE,0BAAa,CAAC,IAAI;QACjC,SAAS,WAAA;KACV,CAAC,CAAC;IACH,UAAU,CAAC,KAAK,EAAE,CAAC;IAEnB,OAAO;QACL,IAAI,EAAE,QAAQ,EAAE;QAChB,GAAG,EAAE,UAAU,CAAC,QAAQ,CAAC,IAAI,CAAC;KAC/B,CAAC;AACJ,CAAC;AAbD,oCAaC","sourcesContent":["import { InjectionMode, Stylesheet } from './Stylesheet';\n\n/**\n * Renders a given string and returns both html and css needed for the html.\n * @param onRender - Function that returns a string.\n * @param namespace - Optional namespace to prepend to css classnames to avoid collisions.\n */\nexport function renderStatic(onRender: () => string, namespace?: string): { html: string; css: string } {\n const stylesheet = Stylesheet.getInstance();\n\n stylesheet.setConfig({\n injectionMode: InjectionMode.none,\n namespace,\n });\n stylesheet.reset();\n\n return {\n html: onRender(),\n css: stylesheet.getRules(true),\n };\n}\n"]}
+11
View File
@@ -0,0 +1,11 @@
export interface ShadowConfig {
stylesheetKey: string;
inShadow: boolean;
window?: Window;
__isShadowConfig__: true;
}
export declare const GLOBAL_STYLESHEET_KEY = "__global__";
export declare const SHADOW_DOM_STYLESHEET_SETTING = "__shadow_dom_stylesheet__";
export declare const DEFAULT_SHADOW_CONFIG: ShadowConfig;
export declare const makeShadowConfig: (stylesheetKey: string, inShadow: boolean, window?: Window) => ShadowConfig;
export declare const isShadowConfig: (value: unknown) => value is ShadowConfig;
+31
View File
@@ -0,0 +1,31 @@
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.isShadowConfig = exports.makeShadowConfig = exports.DEFAULT_SHADOW_CONFIG = exports.SHADOW_DOM_STYLESHEET_SETTING = exports.GLOBAL_STYLESHEET_KEY = void 0;
exports.GLOBAL_STYLESHEET_KEY = '__global__';
exports.SHADOW_DOM_STYLESHEET_SETTING = '__shadow_dom_stylesheet__';
exports.DEFAULT_SHADOW_CONFIG = {
stylesheetKey: exports.GLOBAL_STYLESHEET_KEY,
inShadow: false,
window: undefined,
__isShadowConfig__: true,
};
var makeShadowConfig = function (stylesheetKey, inShadow, window) {
return {
stylesheetKey: stylesheetKey,
inShadow: inShadow,
window: window,
__isShadowConfig__: true,
};
};
exports.makeShadowConfig = makeShadowConfig;
var isShadowConfig = function (value) {
if (!(value && isRecord(value))) {
return false;
}
return value.__isShadowConfig__ === true;
};
exports.isShadowConfig = isShadowConfig;
function isRecord(value) {
return value !== null && typeof value === 'object' && !Array.isArray(value);
}
//# sourceMappingURL=shadowConfig.js.map
+1
View File
@@ -0,0 +1 @@
{"version":3,"file":"shadowConfig.js","sourceRoot":"../src/","sources":["shadowConfig.ts"],"names":[],"mappings":";;;AAQa,QAAA,qBAAqB,GAAG,YAAY,CAAC;AACrC,QAAA,6BAA6B,GAAG,2BAA2B,CAAC;AAE5D,QAAA,qBAAqB,GAAiB;IACjD,aAAa,EAAE,6BAAqB;IACpC,QAAQ,EAAE,KAAK;IACf,MAAM,EAAE,SAAS;IACjB,kBAAkB,EAAE,IAAI;CACzB,CAAC;AAEK,IAAM,gBAAgB,GAAG,UAAC,aAAqB,EAAE,QAAiB,EAAE,MAAe;IACxF,OAAO;QACL,aAAa,eAAA;QACb,QAAQ,UAAA;QACR,MAAM,QAAA;QACN,kBAAkB,EAAE,IAAI;KACzB,CAAC;AACJ,CAAC,CAAC;AAPW,QAAA,gBAAgB,oBAO3B;AAEK,IAAM,cAAc,GAAG,UAAC,KAAc;IAC3C,IAAI,CAAC,CAAC,KAAK,IAAI,QAAQ,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC;QAChC,OAAO,KAAK,CAAC;IACf,CAAC;IAED,OAAO,KAAK,CAAC,kBAAkB,KAAK,IAAI,CAAC;AAC3C,CAAC,CAAC;AANW,QAAA,cAAc,kBAMzB;AAEF,SAAS,QAAQ,CAAC,KAAc;IAC9B,OAAO,KAAK,KAAK,IAAI,IAAI,OAAO,KAAK,KAAK,QAAQ,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;AAC9E,CAAC","sourcesContent":["// eslint-disable-next-line @typescript-eslint/naming-convention\nexport interface ShadowConfig {\n stylesheetKey: string;\n inShadow: boolean;\n window?: Window;\n __isShadowConfig__: true;\n}\n\nexport const GLOBAL_STYLESHEET_KEY = '__global__';\nexport const SHADOW_DOM_STYLESHEET_SETTING = '__shadow_dom_stylesheet__';\n\nexport const DEFAULT_SHADOW_CONFIG: ShadowConfig = {\n stylesheetKey: GLOBAL_STYLESHEET_KEY,\n inShadow: false,\n window: undefined,\n __isShadowConfig__: true,\n};\n\nexport const makeShadowConfig = (stylesheetKey: string, inShadow: boolean, window?: Window): ShadowConfig => {\n return {\n stylesheetKey,\n inShadow,\n window,\n __isShadowConfig__: true,\n };\n};\n\nexport const isShadowConfig = (value: unknown): value is ShadowConfig => {\n if (!(value && isRecord(value))) {\n return false;\n }\n\n return value.__isShadowConfig__ === true;\n};\n\nfunction isRecord(value: unknown): value is Record<string, unknown> {\n return value !== null && typeof value === 'object' && !Array.isArray(value);\n}\n"]}
+22
View File
@@ -0,0 +1,22 @@
import { IStyle } from './IStyle';
import { Stylesheet } from './Stylesheet';
import { IStyleOptions } from './IStyleOptions';
import { ShadowConfig } from './shadowConfig';
export declare function serializeRuleEntries(options: IStyleOptions, ruleEntries: {
[key: string]: string | number;
}): string;
export interface IRegistration {
className: string;
key: string;
args: IStyle[];
rulesToInsert: string[];
}
export declare function styleToRegistration(options: IStyleOptions, ...args: IStyle[]): IRegistration | undefined;
/**
* Insert style to stylesheet.
* @param registration Style registration.
* @param specificityMultiplier Number of times classname selector is repeated in the css rule.
* This is to increase css specificity in case it's needed. Default to 1.
*/
export declare function applyRegistration(registration: IRegistration, specificityMultiplier?: number, shadowConfig?: ShadowConfig, sheet?: Stylesheet): void;
export declare function styleToClassName(options: IStyleOptions, ...args: IStyle[]): string;
+282
View File
@@ -0,0 +1,282 @@
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.styleToClassName = exports.applyRegistration = exports.styleToRegistration = exports.serializeRuleEntries = void 0;
var tslib_1 = require("tslib");
var Stylesheet_1 = require("./Stylesheet");
var kebabRules_1 = require("./transforms/kebabRules");
var prefixRules_1 = require("./transforms/prefixRules");
var provideUnits_1 = require("./transforms/provideUnits");
var rtlifyRules_1 = require("./transforms/rtlifyRules");
var tokenizeWithParentheses_1 = require("./tokenizeWithParentheses");
var DISPLAY_NAME = 'displayName';
function getDisplayName(rules) {
var rootStyle = rules && rules['&'];
return rootStyle ? rootStyle.displayName : undefined;
}
var globalSelectorRegExp = /\:global\((.+?)\)/g;
/**
* Finds comma separated selectors in a :global() e.g. ":global(.class1, .class2, .class3)"
* and wraps them each in their own global ":global(.class1), :global(.class2), :global(.class3)"
*
* @param selectorWithGlobals The selector to process
* @returns The updated selector
*/
function expandCommaSeparatedGlobals(selectorWithGlobals) {
// We the selector does not have a :global() we can shortcut
if (!globalSelectorRegExp.test(selectorWithGlobals)) {
return selectorWithGlobals;
}
var replacementInfo = [];
var findGlobal = /\:global\((.+?)\)/g;
var match = null;
// Create a result list for global selectors so we can replace them.
while ((match = findGlobal.exec(selectorWithGlobals))) {
// Only if the found selector is a comma separated list we'll process it.
if (match[1].indexOf(',') > -1) {
replacementInfo.push([
match.index,
match.index + match[0].length,
// Wrap each of the found selectors in :global()
match[1]
.split(',')
.map(function (v) { return ":global(".concat(v.trim(), ")"); })
.join(', '),
]);
}
}
// Replace the found selectors with their wrapped variants in reverse order
return replacementInfo
.reverse()
.reduce(function (selector, _a) {
var matchIndex = _a[0], matchEndIndex = _a[1], replacement = _a[2];
var prefix = selector.slice(0, matchIndex);
var suffix = selector.slice(matchEndIndex);
return prefix + replacement + suffix;
}, selectorWithGlobals);
}
function isSelector(potentialSelector) {
return potentialSelector.indexOf(':global(') >= 0 || potentialSelector.indexOf(':') === 0;
}
function expandSelector(newSelector, currentSelector) {
if (newSelector.indexOf(':global(') >= 0) {
return newSelector.replace(globalSelectorRegExp, '$1');
}
else if (newSelector.indexOf(':host(') === 0) {
return newSelector;
}
else if (newSelector.indexOf(':') === 0) {
return currentSelector + newSelector;
}
else if (newSelector.indexOf('&') < 0) {
return currentSelector + ' ' + newSelector;
}
return newSelector;
}
function extractSelector(currentSelector, rules, selector, value, stylesheet) {
if (rules === void 0) { rules = { __order: [] }; }
if (selector.indexOf('@') === 0) {
selector = selector + '{' + currentSelector;
extractRules([value], rules, selector, stylesheet);
}
else if (selector.indexOf(',') > -1) {
expandCommaSeparatedGlobals(selector)
.split(',')
.map(function (s) { return s.trim(); })
.forEach(function (separatedSelector) {
return extractRules([value], rules, expandSelector(separatedSelector, currentSelector), stylesheet);
});
}
else {
extractRules([value], rules, expandSelector(selector, currentSelector), stylesheet);
}
}
function extractRules(args, rules, currentSelector, stylesheet) {
if (rules === void 0) { rules = { __order: [] }; }
if (currentSelector === void 0) { currentSelector = '&'; }
var currentRules = rules[currentSelector];
if (!currentRules) {
currentRules = {};
rules[currentSelector] = currentRules;
rules.__order.push(currentSelector);
}
for (var _i = 0, args_1 = args; _i < args_1.length; _i++) {
var arg = args_1[_i];
// If the arg is a string, we need to look up the class map and merge.
if (typeof arg === 'string') {
var expandedRules = stylesheet.argsFromClassName(arg);
if (expandedRules) {
extractRules(expandedRules, rules, currentSelector, stylesheet);
}
// Else if the arg is an array, we need to recurse in.
}
else if (Array.isArray(arg)) {
extractRules(arg, rules, currentSelector, stylesheet);
}
else {
for (var prop in arg) {
if (arg.hasOwnProperty(prop)) {
var propValue = arg[prop];
if (prop === 'selectors') {
// every child is a selector.
var selectors = arg.selectors;
for (var newSelector in selectors) {
if (selectors.hasOwnProperty(newSelector)) {
extractSelector(currentSelector, rules, newSelector, selectors[newSelector], stylesheet);
}
}
}
else if (typeof propValue === 'object' || isSelector(prop)) {
// prop is a selector.
if (propValue !== null && propValue !== undefined) {
extractSelector(currentSelector, rules, prop, propValue, stylesheet);
}
}
else {
if (propValue !== undefined) {
// Else, add the rule to the currentSelector.
if (prop === 'margin' || prop === 'padding') {
expandQuads(currentRules, prop, propValue);
}
else {
currentRules[prop] = propValue;
}
}
}
}
}
}
}
return rules;
}
function expandQuads(currentRules, name, value) {
var parts = typeof value === 'string' ? (0, tokenizeWithParentheses_1.tokenizeWithParentheses)(value) : [value];
if (parts.length === 0) {
parts.push(value);
}
if (parts[parts.length - 1] === '!important') {
// Remove !important from parts, and append it to each part individually
parts = parts.slice(0, -1).map(function (p) { return p + ' !important'; });
}
currentRules[name + 'Top'] = parts[0];
currentRules[name + 'Right'] = parts[1] || parts[0];
currentRules[name + 'Bottom'] = parts[2] || parts[0];
currentRules[name + 'Left'] = parts[3] || parts[1] || parts[0];
}
function getKeyForRules(options, rules) {
var serialized = [options.rtl ? 'rtl' : 'ltr'];
var hasProps = false;
for (var _i = 0, _a = rules.__order; _i < _a.length; _i++) {
var selector = _a[_i];
serialized.push(selector);
var rulesForSelector = rules[selector];
for (var propName in rulesForSelector) {
if (rulesForSelector.hasOwnProperty(propName) && rulesForSelector[propName] !== undefined) {
hasProps = true;
serialized.push(propName, rulesForSelector[propName]);
}
}
}
return hasProps ? serialized.join('') : undefined;
}
function repeatString(target, count) {
if (count <= 0) {
return '';
}
if (count === 1) {
return target;
}
return target + repeatString(target, count - 1);
}
function serializeRuleEntries(options, ruleEntries) {
if (!ruleEntries) {
return '';
}
var allEntries = [];
for (var entry in ruleEntries) {
if (ruleEntries.hasOwnProperty(entry) && entry !== DISPLAY_NAME && ruleEntries[entry] !== undefined) {
allEntries.push(entry, ruleEntries[entry]);
}
}
// Apply transforms.
for (var i = 0; i < allEntries.length; i += 2) {
(0, kebabRules_1.kebabRules)(allEntries, i);
(0, provideUnits_1.provideUnits)(allEntries, i);
(0, rtlifyRules_1.rtlifyRules)(options, allEntries, i);
(0, prefixRules_1.prefixRules)(allEntries, i);
}
// Apply punctuation.
for (var i = 1; i < allEntries.length; i += 4) {
allEntries.splice(i, 1, ':', allEntries[i], ';');
}
return allEntries.join('');
}
exports.serializeRuleEntries = serializeRuleEntries;
function styleToRegistration(options) {
var _a;
var args = [];
for (var _i = 1; _i < arguments.length; _i++) {
args[_i - 1] = arguments[_i];
}
var stylesheet = (_a = options.stylesheet) !== null && _a !== void 0 ? _a : Stylesheet_1.Stylesheet.getInstance(options.shadowConfig);
var rules = extractRules(args, undefined, undefined, stylesheet);
var key = getKeyForRules(options, rules);
if (key) {
var registration = {
className: stylesheet.classNameFromKey(key),
key: key,
args: args,
};
if (!registration.className) {
registration.className = stylesheet.getClassName(getDisplayName(rules));
var rulesToInsert = [];
for (var _b = 0, _c = rules.__order; _b < _c.length; _b++) {
var selector = _c[_b];
rulesToInsert.push(selector, serializeRuleEntries(options, rules[selector]));
}
registration.rulesToInsert = rulesToInsert;
}
return registration;
}
return undefined;
}
exports.styleToRegistration = styleToRegistration;
/**
* Insert style to stylesheet.
* @param registration Style registration.
* @param specificityMultiplier Number of times classname selector is repeated in the css rule.
* This is to increase css specificity in case it's needed. Default to 1.
*/
function applyRegistration(registration, specificityMultiplier, shadowConfig, sheet) {
if (specificityMultiplier === void 0) { specificityMultiplier = 1; }
var stylesheet = sheet !== null && sheet !== void 0 ? sheet : Stylesheet_1.Stylesheet.getInstance(shadowConfig);
var className = registration.className, key = registration.key, args = registration.args, rulesToInsert = registration.rulesToInsert;
if (rulesToInsert) {
// rulesToInsert is an ordered array of selector/rule pairs.
for (var i = 0; i < rulesToInsert.length; i += 2) {
var rules = rulesToInsert[i + 1];
if (rules) {
var selector = rulesToInsert[i];
selector = selector.replace(/&/g, repeatString(".".concat(registration.className), specificityMultiplier));
// Insert. Note if a media query, we must close the query with a final bracket.
var processedRule = "".concat(selector, "{").concat(rules, "}").concat(selector.indexOf('@') === 0 ? '}' : '');
stylesheet.insertRule(processedRule);
}
}
stylesheet.cacheClassName(className, key, args, rulesToInsert);
}
}
exports.applyRegistration = applyRegistration;
function styleToClassName(options) {
var args = [];
for (var _i = 1; _i < arguments.length; _i++) {
args[_i - 1] = arguments[_i];
}
var registration = styleToRegistration.apply(void 0, tslib_1.__spreadArray([options], args, false));
if (registration) {
applyRegistration(registration, options.specificityMultiplier, options.shadowConfig, options.stylesheet);
return registration.className;
}
return '';
}
exports.styleToClassName = styleToClassName;
//# sourceMappingURL=styleToClassName.js.map
File diff suppressed because one or more lines are too long
@@ -0,0 +1,14 @@
/**
* Split a string into tokens separated by whitespace, except all text within parentheses
* is treated as a single token (whitespace is ignored within parentheses).
*
* Unlike String.split(' '), multiple consecutive space characters are collapsed and
* removed from the returned array (including leading and trailing spaces).
*
* For example:
* `tokenizeWithParentheses("3px calc(var(--x) / 2) 9px 0 ")`
* => `["3px", "calc(var(--x) / 2)", "9px", "0"]`
*
* @returns The array of tokens. Returns an empty array if the string was empty or contained only whitespace.
*/
export declare function tokenizeWithParentheses(value: string): string[];
@@ -0,0 +1,50 @@
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.tokenizeWithParentheses = void 0;
/**
* Split a string into tokens separated by whitespace, except all text within parentheses
* is treated as a single token (whitespace is ignored within parentheses).
*
* Unlike String.split(' '), multiple consecutive space characters are collapsed and
* removed from the returned array (including leading and trailing spaces).
*
* For example:
* `tokenizeWithParentheses("3px calc(var(--x) / 2) 9px 0 ")`
* => `["3px", "calc(var(--x) / 2)", "9px", "0"]`
*
* @returns The array of tokens. Returns an empty array if the string was empty or contained only whitespace.
*/
function tokenizeWithParentheses(value) {
var parts = [];
var partStart = 0;
var parens = 0;
for (var i = 0; i < value.length; i++) {
switch (value[i]) {
case '(':
parens++;
break;
case ')':
if (parens) {
parens--;
}
break;
case '\t':
case ' ':
if (!parens) {
// Add the new part if it's not an empty string
if (i > partStart) {
parts.push(value.substring(partStart, i));
}
partStart = i + 1;
}
break;
}
}
// Add the last part
if (partStart < value.length) {
parts.push(value.substring(partStart));
}
return parts;
}
exports.tokenizeWithParentheses = tokenizeWithParentheses;
//# sourceMappingURL=tokenizeWithParentheses.js.map
@@ -0,0 +1 @@
{"version":3,"file":"tokenizeWithParentheses.js","sourceRoot":"../src/","sources":["tokenizeWithParentheses.ts"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;GAYG;AACH,SAAgB,uBAAuB,CAAC,KAAa;IACnD,IAAM,KAAK,GAAG,EAAE,CAAC;IACjB,IAAI,SAAS,GAAG,CAAC,CAAC;IAClB,IAAI,MAAM,GAAG,CAAC,CAAC;IAEf,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,KAAK,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE,CAAC;QACtC,QAAQ,KAAK,CAAC,CAAC,CAAC,EAAE,CAAC;YACjB,KAAK,GAAG;gBACN,MAAM,EAAE,CAAC;gBACT,MAAM;YACR,KAAK,GAAG;gBACN,IAAI,MAAM,EAAE,CAAC;oBACX,MAAM,EAAE,CAAC;gBACX,CAAC;gBACD,MAAM;YACR,KAAK,IAAI,CAAC;YACV,KAAK,GAAG;gBACN,IAAI,CAAC,MAAM,EAAE,CAAC;oBACZ,+CAA+C;oBAC/C,IAAI,CAAC,GAAG,SAAS,EAAE,CAAC;wBAClB,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,SAAS,EAAE,CAAC,CAAC,CAAC,CAAC;oBAC5C,CAAC;oBACD,SAAS,GAAG,CAAC,GAAG,CAAC,CAAC;gBACpB,CAAC;gBACD,MAAM;QACV,CAAC;IACH,CAAC;IAED,oBAAoB;IACpB,IAAI,SAAS,GAAG,KAAK,CAAC,MAAM,EAAE,CAAC;QAC7B,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,SAAS,CAAC,CAAC,CAAC;IACzC,CAAC;IAED,OAAO,KAAK,CAAC;AACf,CAAC;AAlCD,0DAkCC","sourcesContent":["/**\n * Split a string into tokens separated by whitespace, except all text within parentheses\n * is treated as a single token (whitespace is ignored within parentheses).\n *\n * Unlike String.split(' '), multiple consecutive space characters are collapsed and\n * removed from the returned array (including leading and trailing spaces).\n *\n * For example:\n * `tokenizeWithParentheses(\"3px calc(var(--x) / 2) 9px 0 \")`\n * => `[\"3px\", \"calc(var(--x) / 2)\", \"9px\", \"0\"]`\n *\n * @returns The array of tokens. Returns an empty array if the string was empty or contained only whitespace.\n */\nexport function tokenizeWithParentheses(value: string): string[] {\n const parts = [];\n let partStart = 0;\n let parens = 0;\n\n for (let i = 0; i < value.length; i++) {\n switch (value[i]) {\n case '(':\n parens++;\n break;\n case ')':\n if (parens) {\n parens--;\n }\n break;\n case '\\t':\n case ' ':\n if (!parens) {\n // Add the new part if it's not an empty string\n if (i > partStart) {\n parts.push(value.substring(partStart, i));\n }\n partStart = i + 1;\n }\n break;\n }\n }\n\n // Add the last part\n if (partStart < value.length) {\n parts.push(value.substring(partStart));\n }\n\n return parts;\n}\n"]}
@@ -0,0 +1 @@
export declare function kebabRules(rulePairs: (string | number)[], index: number): void;
@@ -0,0 +1,12 @@
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.kebabRules = void 0;
var rules = {};
function kebabRules(rulePairs, index) {
var rule = rulePairs[index];
if (rule.charAt(0) !== '-') {
rulePairs[index] = rules[rule] = rules[rule] || rule.replace(/([A-Z])/g, '-$1').toLowerCase();
}
}
exports.kebabRules = kebabRules;
//# sourceMappingURL=kebabRules.js.map
@@ -0,0 +1 @@
{"version":3,"file":"kebabRules.js","sourceRoot":"../src/","sources":["transforms/kebabRules.ts"],"names":[],"mappings":";;;AAAA,IAAM,KAAK,GAA8B,EAAE,CAAC;AAE5C,SAAgB,UAAU,CAAC,SAA8B,EAAE,KAAa;IACtE,IAAM,IAAI,GAAW,SAAS,CAAC,KAAK,CAAW,CAAC;IAEhD,IAAI,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,KAAK,GAAG,EAAE,CAAC;QAC3B,SAAS,CAAC,KAAK,CAAC,GAAG,KAAK,CAAC,IAAI,CAAC,GAAG,KAAK,CAAC,IAAI,CAAC,IAAI,IAAI,CAAC,OAAO,CAAC,UAAU,EAAE,KAAK,CAAC,CAAC,WAAW,EAAE,CAAC;IAChG,CAAC;AACH,CAAC;AAND,gCAMC","sourcesContent":["const rules: { [key: string]: string } = {};\n\nexport function kebabRules(rulePairs: (string | number)[], index: number): void {\n const rule: string = rulePairs[index] as string;\n\n if (rule.charAt(0) !== '-') {\n rulePairs[index] = rules[rule] = rules[rule] || rule.replace(/([A-Z])/g, '-$1').toLowerCase();\n }\n}\n"]}
@@ -0,0 +1 @@
export declare function prefixRules(rulePairs: (string | number)[], index: number): void;
@@ -0,0 +1,30 @@
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.prefixRules = void 0;
var getVendorSettings_1 = require("../getVendorSettings");
var autoPrefixNames = {
'user-select': 1,
};
function prefixRules(rulePairs, index) {
var vendorSettings = (0, getVendorSettings_1.getVendorSettings)();
var name = rulePairs[index];
if (autoPrefixNames[name]) {
var value = rulePairs[index + 1];
if (autoPrefixNames[name]) {
if (vendorSettings.isWebkit) {
rulePairs.push('-webkit-' + name, value);
}
if (vendorSettings.isMoz) {
rulePairs.push('-moz-' + name, value);
}
if (vendorSettings.isMs) {
rulePairs.push('-ms-' + name, value);
}
if (vendorSettings.isOpera) {
rulePairs.push('-o-' + name, value);
}
}
}
}
exports.prefixRules = prefixRules;
//# sourceMappingURL=prefixRules.js.map
@@ -0,0 +1 @@
{"version":3,"file":"prefixRules.js","sourceRoot":"../src/","sources":["transforms/prefixRules.ts"],"names":[],"mappings":";;;AAAA,0DAAyD;AAEzD,IAAM,eAAe,GAA8B;IACjD,aAAa,EAAE,CAAC;CACjB,CAAC;AAEF,SAAgB,WAAW,CAAC,SAA8B,EAAE,KAAa;IACvE,IAAM,cAAc,GAAG,IAAA,qCAAiB,GAAE,CAAC;IAE3C,IAAM,IAAI,GAAG,SAAS,CAAC,KAAK,CAAC,CAAC;IAE9B,IAAI,eAAe,CAAC,IAAI,CAAC,EAAE,CAAC;QAC1B,IAAM,KAAK,GAAG,SAAS,CAAC,KAAK,GAAG,CAAC,CAAC,CAAC;QAEnC,IAAI,eAAe,CAAC,IAAI,CAAC,EAAE,CAAC;YAC1B,IAAI,cAAc,CAAC,QAAQ,EAAE,CAAC;gBAC5B,SAAS,CAAC,IAAI,CAAC,UAAU,GAAG,IAAI,EAAE,KAAK,CAAC,CAAC;YAC3C,CAAC;YACD,IAAI,cAAc,CAAC,KAAK,EAAE,CAAC;gBACzB,SAAS,CAAC,IAAI,CAAC,OAAO,GAAG,IAAI,EAAE,KAAK,CAAC,CAAC;YACxC,CAAC;YACD,IAAI,cAAc,CAAC,IAAI,EAAE,CAAC;gBACxB,SAAS,CAAC,IAAI,CAAC,MAAM,GAAG,IAAI,EAAE,KAAK,CAAC,CAAC;YACvC,CAAC;YACD,IAAI,cAAc,CAAC,OAAO,EAAE,CAAC;gBAC3B,SAAS,CAAC,IAAI,CAAC,KAAK,GAAG,IAAI,EAAE,KAAK,CAAC,CAAC;YACtC,CAAC;QACH,CAAC;IACH,CAAC;AACH,CAAC;AAvBD,kCAuBC","sourcesContent":["import { getVendorSettings } from '../getVendorSettings';\n\nconst autoPrefixNames: { [key: string]: number } = {\n 'user-select': 1,\n};\n\nexport function prefixRules(rulePairs: (string | number)[], index: number): void {\n const vendorSettings = getVendorSettings();\n\n const name = rulePairs[index];\n\n if (autoPrefixNames[name]) {\n const value = rulePairs[index + 1];\n\n if (autoPrefixNames[name]) {\n if (vendorSettings.isWebkit) {\n rulePairs.push('-webkit-' + name, value);\n }\n if (vendorSettings.isMoz) {\n rulePairs.push('-moz-' + name, value);\n }\n if (vendorSettings.isMs) {\n rulePairs.push('-ms-' + name, value);\n }\n if (vendorSettings.isOpera) {\n rulePairs.push('-o-' + name, value);\n }\n }\n }\n}\n"]}
@@ -0,0 +1 @@
export declare function provideUnits(rulePairs: (string | number)[], index: number): void;
@@ -0,0 +1,27 @@
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.provideUnits = void 0;
var NON_PIXEL_NUMBER_PROPS = [
'column-count',
'font-weight',
'flex',
'flex-grow',
'flex-shrink',
'fill-opacity',
'opacity',
'order',
'z-index',
'zoom',
];
function provideUnits(rulePairs, index) {
var name = rulePairs[index];
var value = rulePairs[index + 1];
if (typeof value === 'number') {
var isNonPixelProp = NON_PIXEL_NUMBER_PROPS.indexOf(name) > -1;
var isVariableOrPrefixed = name.indexOf('--') > -1;
var unit = isNonPixelProp || isVariableOrPrefixed ? '' : 'px';
rulePairs[index + 1] = "".concat(value).concat(unit);
}
}
exports.provideUnits = provideUnits;
//# sourceMappingURL=provideUnits.js.map
@@ -0,0 +1 @@
{"version":3,"file":"provideUnits.js","sourceRoot":"../src/","sources":["transforms/provideUnits.ts"],"names":[],"mappings":";;;AAAA,IAAM,sBAAsB,GAAG;IAC7B,cAAc;IACd,aAAa;IACb,MAAM;IACN,WAAW;IACX,aAAa;IACb,cAAc;IACd,SAAS;IACT,OAAO;IACP,SAAS;IACT,MAAM;CACP,CAAC;AAEF,SAAgB,YAAY,CAAC,SAA8B,EAAE,KAAa;IACxE,IAAM,IAAI,GAAG,SAAS,CAAC,KAAK,CAAW,CAAC;IACxC,IAAM,KAAK,GAAG,SAAS,CAAC,KAAK,GAAG,CAAC,CAAC,CAAC;IAEnC,IAAI,OAAO,KAAK,KAAK,QAAQ,EAAE,CAAC;QAC9B,IAAM,cAAc,GAAG,sBAAsB,CAAC,OAAO,CAAC,IAAc,CAAC,GAAG,CAAC,CAAC,CAAC;QAC3E,IAAM,oBAAoB,GAAG,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC;QACrD,IAAM,IAAI,GAAG,cAAc,IAAI,oBAAoB,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC;QAEhE,SAAS,CAAC,KAAK,GAAG,CAAC,CAAC,GAAG,UAAG,KAAK,SAAG,IAAI,CAAE,CAAC;IAC3C,CAAC;AACH,CAAC;AAXD,oCAWC","sourcesContent":["const NON_PIXEL_NUMBER_PROPS = [\n 'column-count',\n 'font-weight',\n 'flex',\n 'flex-grow',\n 'flex-shrink',\n 'fill-opacity',\n 'opacity',\n 'order',\n 'z-index',\n 'zoom',\n];\n\nexport function provideUnits(rulePairs: (string | number)[], index: number): void {\n const name = rulePairs[index] as string;\n const value = rulePairs[index + 1];\n\n if (typeof value === 'number') {\n const isNonPixelProp = NON_PIXEL_NUMBER_PROPS.indexOf(name as string) > -1;\n const isVariableOrPrefixed = name.indexOf('--') > -1;\n const unit = isNonPixelProp || isVariableOrPrefixed ? '' : 'px';\n\n rulePairs[index + 1] = `${value}${unit}`;\n }\n}\n"]}
@@ -0,0 +1,6 @@
import { IStyleOptions } from '../IStyleOptions';
/**
* RTLifies the rulePair in the array at the current index. This mutates the array for performance
* reasons.
*/
export declare function rtlifyRules(options: IStyleOptions, rulePairs: (string | number)[], index: number): void;
@@ -0,0 +1,84 @@
"use strict";
var _a;
Object.defineProperty(exports, "__esModule", { value: true });
exports.rtlifyRules = void 0;
var LEFT = 'left';
var RIGHT = 'right';
var NO_FLIP = '@noflip';
var NAME_REPLACEMENTS = (_a = {},
_a[LEFT] = RIGHT,
_a[RIGHT] = LEFT,
_a);
var VALUE_REPLACEMENTS = {
'w-resize': 'e-resize',
'sw-resize': 'se-resize',
'nw-resize': 'ne-resize',
};
/**
* RTLifies the rulePair in the array at the current index. This mutates the array for performance
* reasons.
*/
function rtlifyRules(options, rulePairs, index) {
if (options.rtl) {
var name_1 = rulePairs[index];
if (!name_1) {
return;
}
var value = rulePairs[index + 1];
if (typeof value === 'string' && value.indexOf(NO_FLIP) >= 0) {
rulePairs[index + 1] = value.replace(/\s*(?:\/\*\s*)?\@noflip\b(?:\s*\*\/)?\s*?/g, '');
}
else if (name_1.indexOf(LEFT) >= 0) {
rulePairs[index] = name_1.replace(LEFT, RIGHT);
}
else if (name_1.indexOf(RIGHT) >= 0) {
rulePairs[index] = name_1.replace(RIGHT, LEFT);
}
else if (String(value).indexOf(LEFT) >= 0) {
rulePairs[index + 1] = value.replace(LEFT, RIGHT);
}
else if (String(value).indexOf(RIGHT) >= 0) {
rulePairs[index + 1] = value.replace(RIGHT, LEFT);
}
else if (NAME_REPLACEMENTS[name_1]) {
rulePairs[index] = NAME_REPLACEMENTS[name_1];
}
else if (VALUE_REPLACEMENTS[value]) {
rulePairs[index + 1] = VALUE_REPLACEMENTS[value];
}
else {
switch (name_1) {
case 'margin':
case 'padding':
rulePairs[index + 1] = flipQuad(value);
break;
case 'box-shadow':
rulePairs[index + 1] = negateNum(value, 0);
break;
}
}
}
}
exports.rtlifyRules = rtlifyRules;
/**
* Given a string value in a space delimited format (e.g. "1 2 3 4"), negates a particular value.
*/
function negateNum(value, partIndex) {
var parts = value.split(' ');
var numberVal = parseInt(parts[partIndex], 10);
parts[0] = parts[0].replace(String(numberVal), String(numberVal * -1));
return parts.join(' ');
}
/**
* Given a string quad, flips the left and right values.
*/
function flipQuad(value) {
if (typeof value === 'string') {
var parts = value.split(' ');
if (parts.length === 4) {
return "".concat(parts[0], " ").concat(parts[3], " ").concat(parts[2], " ").concat(parts[1]);
}
}
return value;
}
//# sourceMappingURL=rtlifyRules.js.map
File diff suppressed because one or more lines are too long
+1
View File
@@ -0,0 +1 @@
export {};
+7
View File
@@ -0,0 +1,7 @@
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
// Do not modify this file; it is generated as part of publish.
// The checked in version is a placeholder only and will not be updated.
var set_version_1 = require("@fluentui/set-version");
(0, set_version_1.setVersion)('@fluentui/merge-styles', '8.6.14');
//# sourceMappingURL=version.js.map
+1
View File
@@ -0,0 +1 @@
{"version":3,"file":"version.js","sourceRoot":"../src/","sources":["version.ts"],"names":[],"mappings":";;AAAA,+DAA+D;AAC/D,wEAAwE;AACxE,qDAAmD;AACnD,IAAA,wBAAU,EAAC,wBAAwB,EAAE,QAAQ,CAAC,CAAC","sourcesContent":["// Do not modify this file; it is generated as part of publish.\n// The checked in version is a placeholder only and will not be updated.\nimport { setVersion } from '@fluentui/set-version';\nsetVersion('@fluentui/merge-styles', '8.6.14');"]}