"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;