xmlui 0.11.4 → 0.11.7

package/dist/scripts/src/components-core/theming/ThemeContext.js

@@ -1,53 +0,0 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || (function () {
-    var ownKeys = function(o) {
-        ownKeys = Object.getOwnPropertyNames || function (o) {
-            var ar = [];
-            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
-            return ar;
-        };
-        return ownKeys(o);
-    };
-    return function (mod) {
-        if (mod && mod.__esModule) return mod;
-        var result = {};
-        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
-        __setModuleDefault(result, mod);
-        return result;
-    };
-})();
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.ThemesContext = exports.ThemeContext = void 0;
-exports.useTheme = useTheme;
-exports.useThemes = useThemes;
-exports.useResourceUrl = useResourceUrl;
-const react_1 = __importStar(require("react"));
-exports.ThemeContext = react_1.default.createContext(undefined);
-exports.ThemesContext = react_1.default.createContext(undefined);
-// This React hook makes the current theme information available within any component logic using the hook.
-function useTheme() {
-    return (0, react_1.useContext)(exports.ThemeContext);
-}
-function useThemes() {
-    return (0, react_1.useContext)(exports.ThemesContext);
-}
-function useResourceUrl(resourceString) {
-    const { getResourceUrl } = useTheme();
-    return getResourceUrl(resourceString);
-}

package/dist/scripts/src/components-core/theming/ThemeProvider.js

@@ -1,342 +0,0 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || (function () {
-    var ownKeys = function(o) {
-        ownKeys = Object.getOwnPropertyNames || function (o) {
-            var ar = [];
-            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
-            return ar;
-        };
-        return ownKeys(o);
-    };
-    return function (mod) {
-        if (mod && mod.__esModule) return mod;
-        var result = {};
-        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
-        __setModuleDefault(result, mod);
-        return result;
-    };
-})();
-var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
-    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
-    return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-    });
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.builtInThemes = void 0;
-exports.useCompiledTheme = useCompiledTheme;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const transformThemeVars_1 = require("./transformThemeVars");
-const misc_1 = require("../utils/misc");
-const hvar_1 = require("../theming/hvar");
-const ThemeContext_1 = require("../theming/ThemeContext");
-const themeVars_1 = __importStar(require("../theming/themeVars"));
-const constants_1 = require("../constants");
-const extendThemeUtils_1 = require("../theming/extendThemeUtils");
-const ComponentRegistryContext_1 = require("../../components/ComponentRegistryContext");
-const xmlui_1 = require("../theming/themes/xmlui");
-const hooks_1 = require("../utils/hooks");
-const lodash_es_1 = require("lodash-es");
-const utils_1 = require("./utils");
-const StyleContext_1 = require("./StyleContext");
-function useCompiledTheme(activeTheme, activeTone, themes = constants_1.EMPTY_ARRAY, resources = constants_1.EMPTY_OBJECT, resourceMap = constants_1.EMPTY_OBJECT) {
-    const componentRegistry = (0, ComponentRegistryContext_1.useComponentRegistry)();
-    const { componentThemeVars, componentDefaultThemeVars } = componentRegistry;
-    const themeDefChain = (0, react_1.useMemo)(() => {
-        if (activeTheme) {
-            return (0, extendThemeUtils_1.collectThemeChainByExtends)(activeTheme, themes, componentDefaultThemeVars);
-        }
-        return undefined;
-    }, [activeTheme, componentDefaultThemeVars, themes]);
-    const allResources = (0, react_1.useMemo)(() => {
-        let mergedResources = {};
-        themeDefChain === null || themeDefChain === void 0 ? void 0 : themeDefChain.forEach((theme) => {
-            var _a, _b;
-            mergedResources = Object.assign(Object.assign(Object.assign({}, mergedResources), theme.resources), (_b = (_a = theme.tones) === null || _a === void 0 ? void 0 : _a[activeTone]) === null || _b === void 0 ? void 0 : _b.resources);
-        });
-        return Object.assign(Object.assign({}, resources), mergedResources);
-    }, [themeDefChain, resources, activeTone]);
-    const allFonts = (0, react_1.useMemo)(() => {
-        const ret = [];
-        Object.entries(allResources).forEach(([key, value]) => {
-            if (key.startsWith("font.")) {
-                ret === null || ret === void 0 ? void 0 : ret.push(value);
-            }
-        });
-        return ret;
-    }, [allResources]);
-    const getResourceUrl = (0, react_1.useCallback)((resourceString) => {
-        let resourceUrl = resourceString;
-        if (resourceString === null || resourceString === void 0 ? void 0 : resourceString.startsWith("resource:")) {
-            const resourceName = resourceString === null || resourceString === void 0 ? void 0 : resourceString.replace("resource:", "");
-            resourceUrl = allResources[resourceName];
-        }
-        if (!resourceUrl) {
-            return resourceUrl;
-        }
-        if (resourceMap[resourceUrl]) {
-            return resourceMap[resourceUrl];
-        }
-        if (resourceUrl.startsWith("/") && resourceMap[resourceUrl.substring(1)]) {
-            return resourceMap[resourceUrl.substring(1)];
-        }
-        return (0, misc_1.normalizePath)(resourceUrl);
-    }, [allResources, resourceMap]);
-    const fontLinks = (0, react_1.useMemo)(() => {
-        return ((allFonts === null || allFonts === void 0 ? void 0 : allFonts.filter((theme) => typeof theme === "string")) || []);
-    }, [allFonts]);
-    const themeDefChainVars = (0, react_1.useMemo)(() => {
-        var _a, _b, _c;
-        if (!(themeDefChain === null || themeDefChain === void 0 ? void 0 : themeDefChain.length)) {
-            return [];
-        }
-        let mergedThemeVars = {};
-        themeDefChain === null || themeDefChain === void 0 ? void 0 : themeDefChain.forEach((theme) => {
-            var _a, _b, _c;
-            mergedThemeVars = Object.assign(Object.assign(Object.assign(Object.assign({}, mergedThemeVars), (0, lodash_es_1.omit)(theme.themeVars, "light", "dark")), (_a = theme.themeVars) === null || _a === void 0 ? void 0 : _a[activeTone]), (_c = (_b = theme.tones) === null || _b === void 0 ? void 0 : _b[activeTone]) === null || _c === void 0 ? void 0 : _c.themeVars);
-        });
-        //we put the generated theme vars before the last item in the chain
-        const resultedTheme = [
-            ...themeDefChain
-                .map((themeDef) => {
-                var _a, _b, _c;
-                return (Object.assign(Object.assign(Object.assign({}, (0, lodash_es_1.omit)(themeDef.themeVars, "light", "dark")), (_a = themeDef.themeVars) === null || _a === void 0 ? void 0 : _a[activeTone]), (_c = (_b = themeDef.tones) === null || _b === void 0 ? void 0 : _b[activeTone]) === null || _c === void 0 ? void 0 : _c.themeVars));
-            })
-                .slice(0, themeDefChain.length - 1),
-            Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, (0, transformThemeVars_1.generateBaseSpacings)(mergedThemeVars)), (0, transformThemeVars_1.generateBaseFontSizes)(mergedThemeVars)), (0, transformThemeVars_1.generatePaddingSegments)(mergedThemeVars)), (0, transformThemeVars_1.generateBorderSegments)(mergedThemeVars)), (0, transformThemeVars_1.generateBaseTones)(mergedThemeVars)), (0, transformThemeVars_1.generateButtonTones)(mergedThemeVars)),
-            Object.assign(Object.assign(Object.assign(Object.assign({}, (0, lodash_es_1.omit)(themeDefChain[themeDefChain.length - 1].themeVars, "light", "dark")), (0, transformThemeVars_1.generateTextFontSizes)(mergedThemeVars)), (_a = themeDefChain[themeDefChain.length - 1].themeVars) === null || _a === void 0 ? void 0 : _a[activeTone]), (_c = (_b = themeDefChain[themeDefChain.length - 1].tones) === null || _b === void 0 ? void 0 : _b[activeTone]) === null || _c === void 0 ? void 0 : _c.themeVars),
-        ];
-        return resultedTheme;
-    }, [activeTone, themeDefChain]);
-    const allThemeVarsWithResolvedHierarchicalVars = (0, react_1.useMemo)(() => {
-        let mergedThemeVars = {};
-        themeDefChainVars === null || themeDefChainVars === void 0 ? void 0 : themeDefChainVars.forEach((theme) => {
-            theme = (0, transformThemeVars_1.generatePaddingSegments)(theme);
-            theme = (0, transformThemeVars_1.generateBorderSegments)(theme);
-            mergedThemeVars = Object.assign(Object.assign({}, mergedThemeVars), theme);
-        });
-        const resolvedThemeVarsFromChains = {};
-        new Set([...Object.keys(themeVars_1.default.themeVars), ...componentThemeVars]).forEach((themeVar) => {
-            const result = (0, hvar_1.matchThemeVar)(themeVar, themeDefChainVars);
-            if (result &&
-                result.forValue &&
-                result.matchedValue &&
-                result.forValue !== result.matchedValue) {
-                resolvedThemeVarsFromChains[result.forValue] = `$${result.matchedValue}`;
-            }
-        });
-        return resolveThemeVarsWithCssVars(Object.assign(Object.assign({}, mergedThemeVars), resolvedThemeVarsFromChains));
-    }, [componentThemeVars, themeDefChainVars]);
-    const themeCssVars = (0, react_1.useMemo)(() => {
-        const ret = {};
-        Object.entries(allThemeVarsWithResolvedHierarchicalVars).forEach(([key, value]) => {
-            const themeKey = `--${themeVars_1.default.keyPrefix}-${key}`;
-            if (value) {
-                ret[themeKey] = value;
-            }
-        });
-        return ret;
-    }, [allThemeVarsWithResolvedHierarchicalVars]);
-    const getThemeVar = (0, react_1.useCallback)((varName) => {
-        return (0, transformThemeVars_1.resolveThemeVar)(varName, allThemeVarsWithResolvedHierarchicalVars);
-    }, [allThemeVarsWithResolvedHierarchicalVars]);
-    (0, react_1.useEffect)(() => {
-        allFonts.forEach((font) => __awaiter(this, void 0, void 0, function* () {
-            if (typeof font !== "string") {
-                const resolvedSrc = getResourceUrl(font.src);
-                let src = `url(${resolvedSrc})`;
-                if (font.format) {
-                    src = `${src} format('${font.format}')`;
-                }
-                const ff = new FontFace(font.fontFamily, src, {
-                    weight: font.fontWeight,
-                    style: font.fontStyle,
-                    display: font.fontDisplay,
-                });
-                try {
-                    const loadedFontFace = yield ff.load();
-                    document.fonts.add(loadedFontFace);
-                }
-                catch (e) {
-                    console.error("loading fonts failed", e);
-                }
-            }
-        }));
-    }, [themeDefChain, getResourceUrl, allFonts]);
-    return {
-        getResourceUrl,
-        fontLinks,
-        allThemeVarsWithResolvedHierarchicalVars,
-        themeCssVars,
-        getThemeVar,
-    };
-}
-exports.builtInThemes = [
-    xmlui_1.XmlUiThemeDefinition,
-    xmlui_1.XmlUiGreenThemeDefinition,
-    xmlui_1.XmlUiGrayThemeDefinition,
-    xmlui_1.XmlUiOrangeThemeDefinition,
-    xmlui_1.XmlUiPurpleThemeDefinition,
-    xmlui_1.XmlUiCyanThemeDefinition,
-    xmlui_1.XmlUiRedThemeDefinition,
-    /*SolidThemeDefinition,*/
-];
-// theme-overriding properties change.
-function ThemeProvider({ children, themes: custThemes = constants_1.EMPTY_ARRAY, defaultTheme = "xmlui", defaultTone = "light", resources = constants_1.EMPTY_OBJECT, resourceMap = constants_1.EMPTY_OBJECT, localThemes = constants_1.EMPTY_OBJECT, }) {
-    const [activeThemeTone, setActiveThemeTone] = (0, react_1.useState)(() => {
-        if (!defaultTone) {
-            return utils_1.ThemeToneKeys[0];
-        }
-        return defaultTone;
-    });
-    (0, react_1.useEffect)(() => {
-        if (defaultTone) {
-            setActiveThemeTone(defaultTone);
-        }
-    }, [defaultTone]);
-    const themes = (0, react_1.useMemo)(() => {
-        return [...custThemes, ...exports.builtInThemes];
-    }, [custThemes]);
-    const availableThemeIds = (0, react_1.useMemo)(() => {
-        return [...new Set(themes.map((theme) => theme.id))];
-    }, [themes]);
-    const [activeThemeId, setActiveThemeId] = (0, react_1.useState)(() => {
-        if (!defaultTheme) {
-            return availableThemeIds[0];
-        }
-        return defaultTheme;
-    });
-    (0, hooks_1.useIsomorphicLayoutEffect)(() => {
-        //we sync the activeThemeId with the default theme (mostly for HMR)
-        if (defaultTheme && availableThemeIds.includes(defaultTheme)) {
-            setActiveThemeId(defaultTheme);
-        }
-        else {
-            setActiveThemeId(availableThemeIds[0]);
-        }
-    }, [availableThemeIds, defaultTheme]);
-    const activeTheme = (0, react_1.useMemo)(() => {
-        let foundTheme;
-        if (activeThemeId) {
-            foundTheme = themes.find((theme) => theme.id === activeThemeId);
-        }
-        if (!foundTheme) {
-            throw new Error(`Theme ${activeThemeId} not found, available themes: ${availableThemeIds}`);
-        }
-        return foundTheme;
-    }, [activeThemeId, availableThemeIds, themes]);
-    const { allThemeVarsWithResolvedHierarchicalVars, themeCssVars, getResourceUrl, getThemeVar } = useCompiledTheme(activeTheme, activeThemeTone, themes, resources, resourceMap);
-    const domRoot = (0, StyleContext_1.useDomRoot)();
-    const [root, setRoot] = (0, react_1.useState)(null);
-    (0, hooks_1.useIsomorphicLayoutEffect)(() => {
-        if (typeof document !== "undefined") {
-            if (domRoot instanceof ShadowRoot) {
-                setRoot(domRoot.getElementById("nested-app-root"));
-            }
-            else {
-                setRoot(document.body);
-            }
-        }
-    }, [domRoot]);
-    const themeValue = (0, react_1.useMemo)(() => {
-        const themeVal = {
-            themes,
-            resources,
-            resourceMap,
-            activeThemeId,
-            activeThemeTone,
-            setActiveThemeId,
-            setActiveThemeTone,
-            availableThemeIds,
-            activeTheme,
-            toggleThemeTone: () => setActiveThemeTone(activeThemeTone === "light" ? "dark" : "light"),
-        };
-        return themeVal;
-    }, [
-        activeTheme,
-        activeThemeId,
-        activeThemeTone,
-        availableThemeIds,
-        resourceMap,
-        resources,
-        themes,
-    ]);
-    const currentThemeContextValue = (0, react_1.useMemo)(() => {
-        const themeVal = {
-            root,
-            setRoot,
-            activeThemeId,
-            activeThemeTone: activeThemeTone,
-            activeTheme,
-            themeStyles: themeCssVars,
-            themeVars: allThemeVarsWithResolvedHierarchicalVars,
-            getResourceUrl,
-            getThemeVar,
-        };
-        return themeVal;
-    }, [
-        activeTheme,
-        activeThemeId,
-        activeThemeTone,
-        allThemeVarsWithResolvedHierarchicalVars,
-        getResourceUrl,
-        getThemeVar,
-        root,
-        themeCssVars,
-    ]);
-    return ((0, jsx_runtime_1.jsx)(ThemeContext_1.ThemesContext.Provider, { value: themeValue, children: (0, jsx_runtime_1.jsx)(ThemeContext_1.ThemeContext.Provider, { value: currentThemeContextValue, children: children }) }));
-}
-function resolveThemeVarsWithCssVars(theme) {
-    if (!theme) {
-        return {};
-    }
-    const ret = {};
-    Object.keys(theme).forEach((key) => {
-        ret[key] = resolveThemeVarToCssVars(key, theme);
-    });
-    return ret;
-    function resolveThemeVarToCssVars(varName, theme) {
-        const value = theme[varName];
-        if (typeof value === "string" && value.includes("$")) {
-            return replaceThemeVar(value);
-        }
-        return value;
-    }
-    function replaceThemeVar(input) {
-        const regex = /\$([a-zA-Z0-9_-]+)/gi;
-        const matches = input.matchAll(regex);
-        //we go from 1, because result[1] is the whole stuff
-        if (matches) {
-            let ret = input;
-            for (const match of matches) {
-                const varName = match[1];
-                if (varName) {
-                    ret = ret.replace(match[0], `var(${(0, themeVars_1.getVarKey)(varName)})`);
-                }
-            }
-            return ret;
-        }
-        return input;
-    }
-}
-exports.default = ThemeProvider;

package/dist/scripts/src/components-core/theming/component-layout-resolver.js

@@ -1,153 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.specialResolvers = exports.BASE_COMPONENT_PART = exports.THEME_VAR_PREFIX = void 0;
-exports.resolveComponentLayoutProps = resolveComponentLayoutProps;
-const constants_1 = require("../constants");
-const parse_layout_props_1 = require("./parse-layout-props");
-exports.THEME_VAR_PREFIX = "xmlui";
-exports.BASE_COMPONENT_PART = "_base_";
-const themeVarCapturesRegex = /(\$[a-zA-Z][a-zA-Z0-9-_]*)/g;
-const starSizeRegex = /^\d*\*$/;
-function resolveComponentLayoutProps(layoutProps = constants_1.EMPTY_OBJECT, layoutContext) {
-    var _a, _b, _c, _d, _e, _f, _g;
-    var _h, _j, _k;
-    const result = {};
-    for (const [key, value] of Object.entries(layoutProps)) {
-        const parsed = (0, parse_layout_props_1.parseLayoutProperty)(key, false);
-        if (typeof parsed === "string") {
-            // --- Ignore failed properties
-            continue;
-        }
-        // --- Process the properties, resolve theme variables to CSS variables
-        const cssPropName = parsed.property;
-        const appliedValue = (_a = value === null || value === void 0 ? void 0 : value.toString()) === null || _a === void 0 ? void 0 : _a.replace(themeVarCapturesRegex, (match) => toCssVar(match.trim()));
-        // --- Some properties may need transformation
-        const cssProps = cssPropName in exports.specialResolvers
-            ? exports.specialResolvers[cssPropName](appliedValue, layoutContext)
-            : { [cssPropName]: appliedValue };
-        // --- Check if the property belongs to one or more states
-        const stateName = parsed.states && parsed.states.length > 0 ? parsed.states.join("&") : null;
-        // --- Prepare the place to store the styles. It belongs to the specified part.
-        const partName = parsed.part ? parsed.part : exports.BASE_COMPONENT_PART;
-        let propertyTarget = ((_b = result[partName]) !== null && _b !== void 0 ? _b : (result[partName] = {}));
-        if (parsed.screenSizes && parsed.screenSizes.length > 0) {
-            const screenSizeKey = parsed.screenSizes.join("&");
-            (_c = propertyTarget.responsiveStyles) !== null && _c !== void 0 ? _c : (propertyTarget.responsiveStyles = {});
-            (_d = (_h = propertyTarget.responsiveStyles)[screenSizeKey]) !== null && _d !== void 0 ? _d : (_h[screenSizeKey] = {});
-            if (stateName) {
-                (_e = (_j = propertyTarget.responsiveStyles[screenSizeKey]).states) !== null && _e !== void 0 ? _e : (_j.states = {});
-                propertyTarget.responsiveStyles[screenSizeKey].states = Object.assign(Object.assign({}, propertyTarget.responsiveStyles[screenSizeKey].states), { [stateName]: Object.assign(Object.assign({}, propertyTarget.responsiveStyles[screenSizeKey].states[stateName]), cssProps) });
-            }
-            else {
-                propertyTarget.responsiveStyles[screenSizeKey] = Object.assign(Object.assign({}, propertyTarget.responsiveStyles[screenSizeKey]), cssProps);
-            }
-        }
-        else {
-            // --- No screen sizes specified, the property belongs to the base styles
-            (_f = propertyTarget.baseStyles) !== null && _f !== void 0 ? _f : (propertyTarget.baseStyles = {});
-            if (stateName) {
-                (_g = (_k = propertyTarget.baseStyles).states) !== null && _g !== void 0 ? _g : (_k.states = {});
-                propertyTarget.baseStyles.states = Object.assign(Object.assign({}, propertyTarget.baseStyles.states), { [stateName]: Object.assign(Object.assign({}, propertyTarget.baseStyles.states[stateName]), cssProps) });
-            }
-            else {
-                propertyTarget.baseStyles = Object.assign(Object.assign({}, propertyTarget.baseStyles), cssProps);
-            }
-        }
-    }
-    // --- Done
-    return result;
-}
-// --- Checks if the specified size is a star size and the orientation is horizontal
-function getHorizontalStarSize(size, layoutContext) {
-    if (!size)
-        return null;
-    const orientation = getOrientation(layoutContext);
-    return orientation === "horizontal" && starSizeRegex.test(size.toString())
-        ? getStarSizeNumber(size.toString())
-        : null;
-}
-// --- Checks if the specified size is a star size and the orientation is vertical
-function getVerticalStarSize(size, layoutContext) {
-    if (!size)
-        return null;
-    const orientation = getOrientation(layoutContext);
-    return orientation === "vertical" && starSizeRegex.test(size.toString())
-        ? getStarSizeNumber(size.toString())
-        : null;
-}
-// ---  Obtains the integer number from a string that matches the starSizeRegex.
-function getStarSizeNumber(input) {
-    if (starSizeRegex.test(input)) {
-        const numberPart = input.slice(0, -1); // Remove the trailing '*'
-        return numberPart === "" ? 1 : parseInt(numberPart, 10); // Default to 1 if no number is present
-    }
-    return null;
-}
-// --- Gets the current orientation from the layout context
-function getOrientation(layoutContext) {
-    if (!layoutContext)
-        return;
-    let orientation = (layoutContext === null || layoutContext === void 0 ? void 0 : layoutContext.type) === "Stack" && (layoutContext === null || layoutContext === void 0 ? void 0 : layoutContext.orientation);
-    return orientation === null || orientation === void 0 ? void 0 : orientation.toString();
-}
-function toCssVar(c) {
-    return `var(--${exports.THEME_VAR_PREFIX}-${c.substring(1)})`;
-}
-exports.specialResolvers = {
-    paddingHorizontal: (propValue) => ({
-        paddingLeft: propValue,
-        paddingRight: propValue,
-    }),
-    paddingVertical: (propValue) => ({
-        paddingTop: propValue,
-        paddingBottom: propValue,
-    }),
-    marginHorizontal: (propValue) => ({
-        marginLeft: propValue,
-        marginRight: propValue,
-    }),
-    marginVertical: (propValue) => ({
-        marginTop: propValue,
-        marginBottom: propValue,
-    }),
-    borderHorizontal: (propValue) => ({
-        borderLeft: propValue,
-        borderRight: propValue,
-    }),
-    borderVertical: (propValue) => ({
-        borderTop: propValue,
-        borderBottom: propValue,
-    }),
-    wrapContent: (propValue) => ({
-        flexWrap: propValue === "true" ? "wrap" : "nowrap",
-    }),
-    canShrink: (propValue) => ({
-        flexShrink: propValue === "true" ? 1 : 0,
-    }),
-    width: (propValue, layoutContext) => {
-        const horizontalStarSize = getHorizontalStarSize(propValue, layoutContext);
-        const result = {};
-        if (horizontalStarSize !== null) {
-            // --- We use "flex" when width is in start-size and allow shrinking
-            result.flex = horizontalStarSize;
-            result.flexShrink = 1;
-        }
-        else {
-            result.width = propValue;
-        }
-        return result;
-    },
-    height: (propValue, layoutContext) => {
-        const verticalStarSize = getVerticalStarSize(propValue, layoutContext);
-        const result = {};
-        if (verticalStarSize !== null) {
-            // --- We use "flex" when height is in start-size and allow shrinking
-            result.flex = verticalStarSize;
-            result.flexShrink = 1;
-        }
-        else {
-            result.height = propValue;
-        }
-        return result;
-    },
-};

package/dist/scripts/src/components-core/theming/extendThemeUtils.js

@@ -1,47 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.collectThemeChainByExtends = collectThemeChainByExtends;
-const lodash_es_1 = require("lodash-es");
-const root_1 = require("../theming/themes/root");
-function collectExtends(cTheme, allThemes) {
-    if (!cTheme) {
-        return [];
-    }
-    if (!cTheme.extends) {
-        return [];
-    }
-    const arrayExtends = typeof cTheme.extends === "string" ? [cTheme.extends] : cTheme.extends;
-    const ret = [];
-    arrayExtends.forEach((ext) => {
-        const parentTheme = allThemes.find((theme) => theme.id === ext);
-        if (parentTheme) {
-            ret.push(...collectExtends(parentTheme, allThemes));
-            ret.push(parentTheme);
-        }
-    });
-    return ret;
-}
-function collectThemeChainByExtends(customTheme, allThemes, componentDefaultThemeVars) {
-    const rootThemeVars = (0, lodash_es_1.cloneDeep)(root_1.RootThemeDefinition.themeVars) || {};
-    const rootTones = (0, lodash_es_1.cloneDeep)(root_1.RootThemeDefinition.tones) || {};
-    Object.entries(componentDefaultThemeVars).forEach(([key, value]) => {
-        if (typeof value === "string") {
-            rootThemeVars[key.trim()] = value;
-        }
-        else {
-            Object.entries(value).forEach(([themeVarKey, themeVarVal]) => {
-                if (!rootTones[key]) {
-                    rootTones[key] = { themeVars: {} };
-                }
-                rootTones[key].themeVars = Object.assign(Object.assign({}, rootTones[key].themeVars), { [themeVarKey.trim()]: themeVarVal });
-            });
-        }
-    });
-    const root = {
-        id: "root",
-        themeVars: rootThemeVars,
-        resources: {},
-        tones: rootTones,
-    };
-    return [root, ...collectExtends(customTheme, allThemes), customTheme];
-}