David Kruger
8df9031d27
``` ~/go/bin/sourcemapper -output ddb -jsurl https://media.dndbeyond.com/character-app/static/js/main.90aa78c5.js ```
123 lines
6.8 KiB
JavaScript
123 lines
6.8 KiB
JavaScript
"use strict";
|
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
exports.createMakeStyles = void 0;
|
|
/* eslint-disable @typescript-eslint/no-explicit-any */
|
|
const react_1 = require("react");
|
|
const Object_fromEntries_1 = require("./tools/polyfills/Object.fromEntries");
|
|
const objectKeys_1 = require("./tools/objectKeys");
|
|
const cssAndCx_1 = require("./cssAndCx");
|
|
const getDependencyArrayRef_1 = require("./tools/getDependencyArrayRef");
|
|
const typeGuard_1 = require("./tools/typeGuard");
|
|
const cache_1 = require("./cache");
|
|
const assert_1 = require("./tools/assert");
|
|
const mergeClasses_1 = require("./mergeClasses");
|
|
let counter = 0;
|
|
function createMakeStyles(params) {
|
|
const { useTheme } = params;
|
|
/** returns useStyle. */
|
|
function makeStyles(params) {
|
|
const { name: nameOrWrappedName, uniqId = counter++ } = params !== null && params !== void 0 ? params : {};
|
|
const name = typeof nameOrWrappedName !== "object"
|
|
? nameOrWrappedName
|
|
: Object.keys(nameOrWrappedName)[0];
|
|
return function (cssObjectByRuleNameOrGetCssObjectByRuleName) {
|
|
const getCssObjectByRuleName = typeof cssObjectByRuleNameOrGetCssObjectByRuleName ===
|
|
"function"
|
|
? cssObjectByRuleNameOrGetCssObjectByRuleName
|
|
: () => cssObjectByRuleNameOrGetCssObjectByRuleName;
|
|
return function useStyles(params, styleOverrides) {
|
|
var _a, _b;
|
|
const theme = useTheme();
|
|
const { css, cx } = (0, cssAndCx_1.useCssAndCx)();
|
|
const cache = (0, cache_1.useTssEmotionCache)();
|
|
let classes = (0, react_1.useMemo)(() => {
|
|
const refClassesCache = {};
|
|
const refClasses = typeof Proxy !== "undefined" &&
|
|
new Proxy({}, {
|
|
"get": (_target, propertyKey) => {
|
|
if (typeof propertyKey === "symbol") {
|
|
(0, assert_1.assert)(false);
|
|
}
|
|
return (refClassesCache[propertyKey] = `${cache.key}-${uniqId}${name !== undefined ? `-${name}` : ""}-${propertyKey}-ref`);
|
|
},
|
|
});
|
|
const cssObjectByRuleName = getCssObjectByRuleName(theme, params, refClasses || {});
|
|
const classes = (0, Object_fromEntries_1.objectFromEntries)((0, objectKeys_1.objectKeys)(cssObjectByRuleName).map(ruleName => {
|
|
const cssObject = cssObjectByRuleName[ruleName];
|
|
if (!cssObject.label) {
|
|
cssObject.label = `${name !== undefined ? `${name}-` : ""}${ruleName}`;
|
|
}
|
|
return [
|
|
ruleName,
|
|
`${css(cssObject)}${(0, typeGuard_1.typeGuard)(ruleName, ruleName in refClassesCache)
|
|
? ` ${refClassesCache[ruleName]}`
|
|
: ""}`,
|
|
];
|
|
}));
|
|
(0, objectKeys_1.objectKeys)(refClassesCache).forEach(ruleName => {
|
|
if (ruleName in classes) {
|
|
return;
|
|
}
|
|
classes[ruleName] =
|
|
refClassesCache[ruleName];
|
|
});
|
|
return classes;
|
|
}, [cache, css, cx, theme, (0, getDependencyArrayRef_1.getDependencyArrayRef)(params)]);
|
|
const propsClasses = styleOverrides === null || styleOverrides === void 0 ? void 0 : styleOverrides.props.classes;
|
|
{
|
|
classes = (0, react_1.useMemo)(() => (0, mergeClasses_1.mergeClasses)(classes, propsClasses, cx), [classes, (0, getDependencyArrayRef_1.getDependencyArrayRef)(propsClasses), cx]);
|
|
}
|
|
{
|
|
let cssObjectByRuleNameOrGetCssObjectByRuleName = undefined;
|
|
try {
|
|
cssObjectByRuleNameOrGetCssObjectByRuleName =
|
|
name !== undefined
|
|
? (_b = (_a = theme.components) === null || _a === void 0 ? void 0 : _a[name]) === null || _b === void 0 ? void 0 : _b.styleOverrides
|
|
: undefined;
|
|
// eslint-disable-next-line no-empty
|
|
}
|
|
catch (_c) { }
|
|
const themeClasses = (0, react_1.useMemo)(() => {
|
|
if (!cssObjectByRuleNameOrGetCssObjectByRuleName) {
|
|
return undefined;
|
|
}
|
|
const themeClasses = {};
|
|
for (const ruleName in cssObjectByRuleNameOrGetCssObjectByRuleName) {
|
|
const cssObjectOrGetCssObject = cssObjectByRuleNameOrGetCssObjectByRuleName[ruleName];
|
|
if (!(cssObjectOrGetCssObject instanceof Object)) {
|
|
continue;
|
|
}
|
|
themeClasses[ruleName] = css(typeof cssObjectOrGetCssObject === "function"
|
|
? cssObjectOrGetCssObject(Object.assign({ theme, "ownerState": styleOverrides === null || styleOverrides === void 0 ? void 0 : styleOverrides.ownerState }, styleOverrides === null || styleOverrides === void 0 ? void 0 : styleOverrides.props))
|
|
: cssObjectOrGetCssObject);
|
|
}
|
|
return themeClasses;
|
|
}, [
|
|
cssObjectByRuleNameOrGetCssObjectByRuleName ===
|
|
undefined
|
|
? undefined
|
|
: JSON.stringify(cssObjectByRuleNameOrGetCssObjectByRuleName),
|
|
(0, getDependencyArrayRef_1.getDependencyArrayRef)(styleOverrides === null || styleOverrides === void 0 ? void 0 : styleOverrides.props),
|
|
(0, getDependencyArrayRef_1.getDependencyArrayRef)(styleOverrides === null || styleOverrides === void 0 ? void 0 : styleOverrides.ownerState),
|
|
css,
|
|
]);
|
|
classes = (0, react_1.useMemo)(() => (0, mergeClasses_1.mergeClasses)(classes, themeClasses, cx), [classes, themeClasses, cx]);
|
|
}
|
|
return {
|
|
classes,
|
|
theme,
|
|
css,
|
|
cx,
|
|
};
|
|
};
|
|
};
|
|
}
|
|
function useStyles() {
|
|
const theme = useTheme();
|
|
const { css, cx } = (0, cssAndCx_1.useCssAndCx)();
|
|
return { theme, css, cx };
|
|
}
|
|
return { makeStyles, useStyles };
|
|
}
|
|
exports.createMakeStyles = createMakeStyles;
|