@genexus/mercury 0.11.0 → 0.12.0

package/dist/assets-manager.js

@@ -1,177 +0,0 @@
-import { MERCURY_ASSETS } from "./assets/MERCURY_ASSETS.js";
-export { getThemeBundles, getBundles } from "./bundles.js";
-const ASSETS_BY_VENDOR = {};
-const ALIAS_TO_VENDOR_NAME = {};
-const SEPARATOR = "/";
-const EXPANDED_SEPARATOR = ":";
-const MERCURY_ALIAS = "mer";
-/**
- * Given a vendor and its assets, it register the assets of the vendor. After
- * the registration, the `getAsset` function can be used to retrieve any assets
- * related to the vendor.
- * @param vendorName The name of the vendor (for example, "Mercury"). Must be unique.
- * @param vendorAlias The alias of the vendor (for example, "mer"). Must be unique.
- * @param assets The assets (generated by the SVG Sass Generator) to register.
- */
-export const registerAssets = (vendorName, vendorAlias, assets) => {
-    // Already registered
-    if (ASSETS_BY_VENDOR[vendorName] || ALIAS_TO_VENDOR_NAME[vendorAlias]) {
-        return;
-    }
-    ASSETS_BY_VENDOR[vendorName] = assets;
-    ALIAS_TO_VENDOR_NAME[vendorAlias] = vendorName;
-};
-/**
- * @param vendorAlias The name or alias of the vendor.
- * @param assetMetadata The metadata required to retrieve the icon
- * @return The required asset or undefined if not found.
- */
-export const getAsset = (vendorAliasOrName, assetMetadata) => {
-    const vendorName = ALIAS_TO_VENDOR_NAME[vendorAliasOrName] ?? vendorAliasOrName;
-    const vendorAssets = ASSETS_BY_VENDOR[vendorName];
-    if (!vendorAssets) {
-        return undefined;
-    }
-    const iconCategoryObject = vendorAssets.icons[assetMetadata.category];
-    // The category does not exists
-    if (!iconCategoryObject) {
-        return undefined;
-    }
-    const iconNameObject = iconCategoryObject[assetMetadata.name];
-    // The name in the category does not exists
-    if (!iconNameObject) {
-        return undefined;
-    }
-    return assetMetadata.colorType
-        ? iconNameObject[assetMetadata.colorType]
-        : iconNameObject;
-};
-/**
- * Given the metadata of the icon, it transforms the metadata into a string
- * that contains the given information.
- */
-export const getIconPath = (iconMetadata, vendorAlias = MERCURY_ALIAS) => {
-    const additionalInfo = iconMetadata.colorType
-        ? `${SEPARATOR}${iconMetadata.colorType}`
-        : "";
-    return `${vendorAlias}${SEPARATOR}${iconMetadata.category}${SEPARATOR}${iconMetadata.name}${additionalInfo}`;
-};
-/**
- * Given the metadata of the icon and the metadata of its expanded version, it
- * transforms both metadata into a string that contains the given information.
- */
-export const getIconPathExpanded = (iconMetadata, iconMetadataExpanded, vendorAlias = MERCURY_ALIAS) => `${getIconPath(iconMetadata, vendorAlias)}${EXPANDED_SEPARATOR}${getIconPath(iconMetadataExpanded, vendorAlias)}`;
-const getCustomFullValue = (iconName, vendorAliasOrName, suffix) => {
-    const vendorPrefix = vendorAliasOrName === MERCURY_ALIAS
-        ? ""
-        : `-${vendorAliasOrName}`;
-    return suffix
-        ? `var(--icon${vendorPrefix}__${iconName}--${suffix})`
-        : `var(--icon${vendorPrefix}__${iconName})`;
-};
-/**
- * Parses the incoming iconMetadata, assuming Mercury as the default vendor if
- * the vendor is not specified (it is not found in the register)
- */
-const parseIconMetadata = (iconPath) => {
-    const iconMetadata = iconPath.split(SEPARATOR);
-    const vendorAliasOrName = iconMetadata[0];
-    const vendorName = ALIAS_TO_VENDOR_NAME[vendorAliasOrName] ?? vendorAliasOrName;
-    const vendorAssets = ASSETS_BY_VENDOR[vendorName];
-    // The vendor is not contained in the path, assume by default Mercury.
-    if (!vendorAssets) {
-        const category = iconMetadata[0]; // Assume that the first value is the category
-        const name = iconMetadata[1];
-        const colorType = iconMetadata[2];
-        return {
-            vendor: MERCURY_ALIAS,
-            category,
-            name,
-            colorType: colorType
-        };
-    }
-    const category = iconMetadata[1];
-    const name = iconMetadata[2];
-    const colorType = iconMetadata[3];
-    return {
-        vendor: vendorAliasOrName,
-        category,
-        name,
-        colorType: colorType
-    };
-};
-export const getImagePathCallback = (iconPath) => {
-    const { vendor, category, name, colorType } = parseIconMetadata(iconPath);
-    const assetStates = getAsset(vendor, colorType ? { category, name, colorType } : { category, name });
-    if (!assetStates) {
-        return undefined;
-    }
-    const result = {
-        base: getCustomFullValue(assetStates.enabled.name, vendor)
-    };
-    if (assetStates.hover) {
-        result.hover = getCustomFullValue(assetStates.hover.name, vendor);
-    }
-    if (assetStates.active) {
-        result.active = getCustomFullValue(assetStates.active.name, vendor);
-    }
-    if (assetStates.disabled) {
-        result.disabled = getCustomFullValue(assetStates.disabled.name, vendor);
-    }
-    return result;
-};
-export const getActionListImagePathCallback = (additionalItem) => additionalItem.imgSrc
-    ? getImagePathCallback(additionalItem.imgSrc)
-    : undefined;
-export const getNavigationListImagePathCallback = (itemModel) => itemModel.startImgSrc
-    ? getImagePathCallback(itemModel.startImgSrc)
-    : undefined;
-export const getTreeViewImagePathCallback = (item, iconDirection) => {
-    if ((!item.startImgSrc && iconDirection === "start") ||
-        (!item.endImgSrc && iconDirection === "end")) {
-        return undefined;
-    }
-    const imgSrc = iconDirection === "start" ? item.startImgSrc : item.endImgSrc;
-    // Split the path into the collapsed (default) and expanded
-    const collapsedAndExpandedSrc = imgSrc.split(EXPANDED_SEPARATOR);
-    const defaultPath = getImagePathCallback(collapsedAndExpandedSrc[0]);
-    if (!defaultPath) {
-        return undefined;
-    }
-    // If the icon has expanded state, process the expanded state
-    return collapsedAndExpandedSrc[1]
-        ? {
-            default: defaultPath,
-            expanded: getImagePathCallback(collapsedAndExpandedSrc[1])
-        }
-        : { default: defaultPath };
-};
-export const getComboBoxImagePathCallback = (item, iconDirection) => {
-    if ((!item.startImgSrc && iconDirection === "start") ||
-        (!item.endImgSrc && iconDirection === "end")) {
-        return undefined;
-    }
-    const imgSrc = iconDirection === "start" ? item.startImgSrc : item.endImgSrc;
-    return getImagePathCallback(imgSrc);
-};
-/**
- * This object is used to register the getImagePathCallback definitions for all
- * controls in Chameleon.
- *
- * @example
- * ```ts
- * registryProperty("getImagePathCallback", getImagePathCallbackDefinitions);
- * ```
- */
-export const getImagePathCallbackDefinitions = {
-    "ch-accordion-render": getImagePathCallback,
-    "ch-action-list-render": getActionListImagePathCallback,
-    "ch-combo-box-render": getComboBoxImagePathCallback,
-    "ch-navigation-list-render": getNavigationListImagePathCallback,
-    "ch-checkbox": getImagePathCallback,
-    "ch-edit": getImagePathCallback,
-    "ch-image": getImagePathCallback,
-    "ch-tree-view-render": getTreeViewImagePathCallback
-};
-// Initialize Mercury at the start
-registerAssets("Mercury", MERCURY_ALIAS, MERCURY_ASSETS);

package/dist/bundles.js

@@ -1,96 +0,0 @@
-const getThemeModelItem = (basePath, bundleName, attachStyleSheet = undefined) => attachStyleSheet === undefined
-    ? {
-        name: bundleName,
-        url: `${basePath}${bundleName}.css`
-    }
-    : {
-        name: bundleName,
-        url: `${basePath}${bundleName}.css`,
-        attachStyleSheet
-    };
-/**
- * Given the basePath, returns all bundles (except base and icons) in the
- * format of type `ThemeModel`.
- *
- * This is useful for defining the following in an `index.html`:
- *
- * ```tsx
- * const THEME_BUNDLES = getThemeBundles("<base path>");
- *
- * HTML/render/template:
- *   <body>
- *     <ch-theme model={THEME_BUNDLES}></ch-theme>
- *     ...
- *   </body>
- * ```
- */
-export const getThemeBundles = (basePath) => [
-    // Components
-    getThemeModelItem(basePath, "components/accordion"),
-    getThemeModelItem(basePath, "components/button"),
-    getThemeModelItem(basePath, "components/chat"),
-    getThemeModelItem(basePath, "components/checkbox"),
-    getThemeModelItem(basePath, "components/code"),
-    getThemeModelItem(basePath, "components/combo-box"),
-    getThemeModelItem(basePath, "components/flexible-layout"),
-    getThemeModelItem(basePath, "components/dialog"),
-    getThemeModelItem(basePath, "components/icon"),
-    getThemeModelItem(basePath, "components/edit"),
-    getThemeModelItem(basePath, "components/layout-splitter"),
-    getThemeModelItem(basePath, "components/list-box"),
-    getThemeModelItem(basePath, "components/markdown-viewer", false),
-    getThemeModelItem(basePath, "components/navigation-list"),
-    getThemeModelItem(basePath, "components/pills"),
-    getThemeModelItem(basePath, "components/radio-group"),
-    getThemeModelItem(basePath, "components/segmented-control"),
-    getThemeModelItem(basePath, "components/sidebar"),
-    getThemeModelItem(basePath, "components/slider"),
-    getThemeModelItem(basePath, "components/tab"),
-    getThemeModelItem(basePath, "components/tabular-grid"),
-    getThemeModelItem(basePath, "components/ticket-list"),
-    getThemeModelItem(basePath, "components/toggle"),
-    getThemeModelItem(basePath, "components/tooltip"),
-    getThemeModelItem(basePath, "components/tree-view"),
-    getThemeModelItem(basePath, "components/widget"),
-    // Resets
-    getThemeModelItem(basePath, "resets/box-sizing"),
-    // Utils
-    getThemeModelItem(basePath, "utils/form"),
-    getThemeModelItem(basePath, "utils/elevation"),
-    getThemeModelItem(basePath, "utils/form--full"),
-    getThemeModelItem(basePath, "utils/layout"),
-    getThemeModelItem(basePath, "utils/spacing"),
-    getThemeModelItem(basePath, "utils/typography"),
-    getThemeModelItem(basePath, "chameleon/scrollbar")
-];
-/**
- * Given the bundles array and the basePath (optional), returns the given
- * bundles in the format of type `ThemeModel`.
- *
- * This is useful for defining the following in a dialog:
- *
- * ```tsx
- * const CSS_BUNDLES: ThemeModel = getBundles(
- *   [
- *     "components/accordion",
- *     "components/button",
- *     "components/checkbox",
- *     "components/combo-box",
- *     "components/edit",
- *     "components/tree-view",
- *     "utils/form",
- *     "utils/layout",
- *   ],
- *   "./assets/css/"
- * );
- *
- * HTML/render/template:
- *   <Host>
- *     <ch-theme model={CSS_BUNDLES}></ch-theme>
- *     ...
- *   </Host>
- * ```
- */
-export const getBundles = (bundles, basePath) => basePath
-    ? bundles.map(bundle => getThemeModelItem(basePath, bundle))
-    : bundles;