xmlui 0.7.21 → 0.7.22

package/dist/scripts/bin/build-lib.js

@@ -19,11 +19,11 @@ const vite_1 = require("vite");
 const path_1 = __importDefault(require("path"));
 const plugin_react_1 = __importDefault(require("@vitejs/plugin-react"));
 const vite_plugin_lib_inject_css_1 = require("vite-plugin-lib-inject-css");
-const buildLib = (_a) => __awaiter(void 0, [_a], void 0, function* ({ watchMode }) {
+const buildLib = (_a) => __awaiter(void 0, [_a], void 0, function* ({ watchMode, mode }) {
     const env = (0, vite_1.loadEnv)("production", process.cwd(), "");
     const umdFileName = `${env.npm_package_name}.js`;
     const esFileName = `${env.npm_package_name}.mjs`;
-    yield (0, vite_1.build)((0, vite_1.defineConfig)({
+    const config = {
         esbuild: {
             target: "es2020",
         },
@@ -40,7 +40,11 @@ const buildLib = (_a) => __awaiter(void 0, [_a], void 0, function* ({ watchMode
         build: {
             watch: watchMode ? {} : undefined,
             sourcemap: watchMode ? "inline" : false,
-            lib: {
+            lib: mode === "metadata" ? {
+                entry: [path_1.default.resolve("meta", "componentsMetadata.ts")],
+                name: `${env.npm_package_name}-metadata`,
+                fileName: `${env.npm_package_name}-metadata`,
+            } : {
                 entry: [path_1.default.resolve("src", "index.tsx")],
                 formats: watchMode ? ["es"] : ["umd", "es"],
                 name: env.npm_package_name,
@@ -53,6 +57,7 @@ const buildLib = (_a) => __awaiter(void 0, [_a], void 0, function* ({ watchMode
                         if (chunk.name === "index" && chunk.fileName === umdFileName) {
                             return `if(typeof window.xmlui !== "undefined"){window.xmlui.standalone.registerExtension(window['${env.npm_package_name}']);}`;
                         }
+                        return "";
                     },
                     globals: {
                         react: "React",
@@ -63,6 +68,7 @@ const buildLib = (_a) => __awaiter(void 0, [_a], void 0, function* ({ watchMode
             },
         },
         plugins: [(0, plugin_react_1.default)(), (0, vite_plugin_lib_inject_css_1.libInjectCss)()],
-    }));
+    };
+    yield (0, vite_1.build)((0, vite_1.defineConfig)(config));
 });
 exports.buildLib = buildLib;

package/dist/scripts/bin/build.js

@@ -102,7 +102,7 @@ function removeLeadingSlashForPath(path) {
     }
     return path;
 }
-const build = (_a) => __awaiter(void 0, [_a], void 0, function* ({ buildMode = "CONFIG_ONLY", flatDist = false, withMock = false, withHostingMetaFiles = false, withRelativeRoot = false, withLegacyParser = false, }) {
+const build = (_a) => __awaiter(void 0, [_a], void 0, function* ({ buildMode = "CONFIG_ONLY", flatDist = false, withMock = false, withHostingMetaFiles = false, withRelativeRoot = false, }) {
     const flatDistUiPrefix = "ui_";
     console.log("Building with options:", {
         buildMode,
@@ -110,18 +110,15 @@ const build = (_a) => __awaiter(void 0, [_a], void 0, function* ({ buildMode = "
         withMock,
         withHostingMetaFiles,
         withRelativeRoot,
-        withLegacyParser
     });
     yield (0, vite_1.build)(Object.assign(Object.assign({}, (0, viteConfig_1.getViteConfig)({
         flatDist,
         withRelativeRoot,
         flatDistUiPrefix,
-        withLegacyParser,
     })), { define: {
             "process.env.VITE_BUILD_MODE": JSON.stringify(buildMode),
             "process.env.VITE_DEV_MODE": false,
             "process.env.VITE_MOCK_ENABLED": withMock,
-            "process.env.VITE_LEGACY_PARSER": withLegacyParser,
             "process.env.VITE_APP_VERSION": JSON.stringify(process.env.VITE_APP_VERSION),
             "process.env.VITE_USED_COMPONENTS_App": JSON.stringify(process.env.VITE_USED_COMPONENTS_App),
             "process.env.VITE_USED_COMPONENTS_Chart": JSON.stringify(process.env.VITE_USED_COMPONENTS_Chart),

package/dist/scripts/bin/index.js

@@ -58,29 +58,29 @@ function getStringArg(arg, defaultValue) {
 }
 switch (script) {
     case "build": {
-        const { flatDist, prod, buildMode, withMock, withHostingMetaFiles, withRelativeRoot, withLegacyParser } = yargs_1.argv;
+        const { flatDist, prod, buildMode, withMock, withHostingMetaFiles, withRelativeRoot } = yargs_1.argv;
         (0, build_1.build)({
             buildMode: getStringArg(buildMode, prod ? "CONFIG_ONLY" : undefined),
             withMock: getBoolArg(withMock, prod ? false : undefined),
             withHostingMetaFiles: getBoolArg(withHostingMetaFiles, prod ? false : undefined),
             withRelativeRoot: getBoolArg(withRelativeRoot, prod ? true : undefined),
             flatDist: getBoolArg(flatDist, prod ? true : undefined),
-            withLegacyParser: getBoolArg(withLegacyParser),
         });
         break;
     }
     case "build-lib": {
-        const { watch } = yargs_1.argv;
-        (0, build_lib_1.buildLib)({ watchMode: getBoolArg(watch, false) });
+        const { watch, mode } = yargs_1.argv;
+        (0, build_lib_1.buildLib)({ watchMode: getBoolArg(watch, false), mode: getStringArg(mode, "") });
         break;
     }
     case "start": {
-        const { port, withMock, withLegacyParser, proxy } = yargs_1.argv;
-        (0, start_1.start)({ port, withMock: getBoolArg(withMock), withLegacyParser: getBoolArg(withLegacyParser), proxy });
+        const { port, withMock, proxy } = yargs_1.argv;
+        (0, start_1.start)({ port, withMock: getBoolArg(withMock), proxy });
         break;
     }
     case "preview": {
-        (0, preview_1.preview)();
+        const { proxy } = yargs_1.argv;
+        (0, preview_1.preview)({ proxy });
         break;
     }
     case "zip-dist": {

package/dist/scripts/bin/preview.js

@@ -12,9 +12,26 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.preview = void 0;
 const vite_1 = require("vite");
 const viteConfig_1 = require("./viteConfig");
-const preview = () => __awaiter(void 0, void 0, void 0, function* () {
+const preview = (_a) => __awaiter(void 0, [_a], void 0, function* ({ proxy }) {
     try {
-        const server = yield (0, vite_1.preview)((0, viteConfig_1.getViteConfig)());
+        let proxyDef;
+        if (proxy) {
+            const splitProxy = proxy.split("->");
+            if (splitProxy.length !== 2) {
+                console.error("Invalid proxy definition. Example: /api->http://localhost:3000");
+            }
+            else {
+                proxyDef = {
+                    [splitProxy[0]]: {
+                        target: splitProxy[1],
+                        changeOrigin: true,
+                    },
+                };
+            }
+        }
+        const server = yield (0, vite_1.preview)(Object.assign(Object.assign({}, (0, viteConfig_1.getViteConfig)()), { server: {
+                proxy: proxyDef,
+            } }));
         if (!server.httpServer) {
             throw new Error("HTTP server not available");
         }

package/dist/scripts/bin/start.js

@@ -12,10 +12,9 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.start = void 0;
 const vite_1 = require("vite");
 const viteConfig_1 = require("./viteConfig");
-const start = (_a) => __awaiter(void 0, [_a], void 0, function* ({ port, withMock = true, withLegacyParser = false, proxy, }) {
+const start = (_a) => __awaiter(void 0, [_a], void 0, function* ({ port, withMock = true, proxy, }) {
     console.log("Starting with options:", {
         withMock,
-        withLegacyParser,
         withProxy: proxy,
     });
     let proxyDef;
@@ -34,7 +33,7 @@ const start = (_a) => __awaiter(void 0, [_a], void 0, function* ({ port, withMoc
         }
     }
     try {
-        const server = yield (0, vite_1.createServer)(Object.assign(Object.assign({}, (0, viteConfig_1.getViteConfig)({ withLegacyParser })), { server: {
+        const server = yield (0, vite_1.createServer)(Object.assign(Object.assign({}, (0, viteConfig_1.getViteConfig)({})), { server: {
                 port,
                 proxy: proxyDef,
             }, define: {
@@ -43,7 +42,6 @@ const start = (_a) => __awaiter(void 0, [_a], void 0, function* ({ port, withMoc
                 "process.env.VITE_STANDALONE": process.env.VITE_STANDALONE,
                 "process.env.VITE_MOCK_ENABLED": withMock,
                 "process.env.VITE_INCLUDE_ALL_COMPONENTS": JSON.stringify("true"),
-                "process.env.VITE_LEGACY_PARSER": withLegacyParser,
             } }));
         // server.
         if (!server.httpServer) {

package/dist/scripts/bin/viteConfig.js

@@ -43,18 +43,9 @@ const vite_plugin_svgr_1 = __importDefault(require("vite-plugin-svgr"));
 const vite_plugin_yaml_1 = __importDefault(require("@modyfi/vite-plugin-yaml"));
 const vite_ueml_plugin_1 = __importDefault(require("./vite-ueml-plugin"));
 const path = __importStar(require("path"));
-function getViteConfig({ flatDist = false, withRelativeRoot = false, flatDistUiPrefix = "", withLegacyParser = false, } = {}) {
+function getViteConfig({ flatDist = false, withRelativeRoot = false, flatDistUiPrefix = "", } = {}) {
     return (0, vite_1.defineConfig)({
-        plugins: [(0, plugin_react_1.default)(), (0, vite_plugin_svgr_1.default)(), (0, vite_plugin_yaml_1.default)(), (0, vite_ueml_plugin_1.default)({ withLegacyParser })],
-        resolve: {
-            alias: {
-                "@abstractions": path.resolve(__dirname, "../src/abstractions"),
-                "@core": path.resolve(__dirname, "../src/core"),
-                "@components-core": path.resolve(__dirname, "../src/components-core"),
-                "@components": path.resolve(__dirname, "../src/components"),
-                "@parsers": path.resolve(__dirname, "../src/parsers"),
-            },
-        },
+        plugins: [(0, plugin_react_1.default)(), (0, vite_plugin_svgr_1.default)(), (0, vite_plugin_yaml_1.default)(), (0, vite_ueml_plugin_1.default)({})],
         base: withRelativeRoot ? "" : undefined,
         // experimental: {
         //   renderBuiltUrl: (filename, {type, hostType, hostId}) =>{

package/dist/scripts/src/abstractions/ComponentDefs.js

@@ -2,7 +2,7 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.createMetadata = createMetadata;
 exports.d = d;
-function createMetadata({ description, shortDescription, specializedFrom, status, props, events, contextVars, apis, nonVisual, opaque, themeVars, defaultThemeVars, toneSpecificThemeVars, allowArbitraryProps, docFolder, }) {
+function createMetadata({ description, shortDescription, specializedFrom, status, props, events, contextVars, apis, nonVisual, opaque, themeVars, defaultThemeVars, toneSpecificThemeVars, allowArbitraryProps, docFolder, isHtmlTag, }) {
     return {
         description,
         shortDescription,
@@ -19,6 +19,7 @@ function createMetadata({ description, shortDescription, specializedFrom, status
         toneSpecificThemeVars,
         allowArbitraryProps,
         docFolder,
+        isHtmlTag,
     };
 }
 function d(description, availableValues, valueType, defaultValue, isValid) {

package/dist/scripts/src/components/APICall/APICall.js

@@ -2,10 +2,10 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.apiCallRenderer = exports.APICallMd = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
-const ComponentDefs_1 = require("@abstractions/ComponentDefs");
-const renderers_1 = require("@components-core/renderers");
+const ComponentDefs_1 = require("../../abstractions/ComponentDefs");
+const renderers_1 = require("../../components-core/renderers");
+const metadata_helpers_1 = require("../../components/metadata-helpers");
 const APICallNative_1 = require("./APICallNative");
-const metadata_helpers_1 = require("@components/metadata-helpers");
 const COMP = "APICall";
 exports.APICallMd = (0, ComponentDefs_1.createMetadata)({
     description: `\`${COMP}\` is used to mutate (create, update or delete) some data on the backend. It ` +

package/dist/scripts/src/components/APICall/APICallNative.js

@@ -11,8 +11,8 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.APICallNative = APICallNative;
 const react_1 = require("react");
-const misc_1 = require("@components-core/utils/misc");
-const APICall_1 = require("@components-core/action/APICall");
+const misc_1 = require("../../components-core/utils/misc");
+const APICall_1 = require("../../components-core/action/APICall");
 function APICallNative({ registerComponentApi, node, uid }) {
     const execute = (0, misc_1.useEvent)((executionContext, ...eventArgs) => __awaiter(this, void 0, void 0, function* () {
         var _a, _b, _c, _d;

package/dist/scripts/src/components/Accordion/Accordion.js

@@ -5,13 +5,13 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.accordionComponentRenderer = exports.AccordionMd = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
-const ComponentDefs_1 = require("@abstractions/ComponentDefs");
 const Accordion_module_scss_1 = __importDefault(require("./Accordion.module.scss"));
-const renderers_1 = require("@components-core/renderers");
-const themeVars_1 = require("@components-core/theming/themeVars");
+const ComponentDefs_1 = require("../../abstractions/ComponentDefs");
+const renderers_1 = require("../../components-core/renderers");
+const themeVars_1 = require("../../components-core/theming/themeVars");
+const metadata_helpers_1 = require("../../components/metadata-helpers");
+const abstractions_1 = require("../../components/abstractions");
 const AccordionNative_1 = require("./AccordionNative");
-const metadata_helpers_1 = require("@components/metadata-helpers");
-const abstractions_1 = require("@components/abstractions");
 const COMP = "Accordion";
 // See reference implementation here: https://getbootstrap.com/docs/5.3/components/accordion/
 // Make the header focusable, handle ARIA attributes, and manage the state of the accordion.

package/dist/scripts/src/components/Accordion/AccordionContext.js

@@ -3,7 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.AccordionContext = void 0;
 exports.useAccordionContext = useAccordionContext;
 const react_1 = require("react");
-const constants_1 = require("@components-core/constants");
+const constants_1 = require("../../components-core/constants");
 exports.AccordionContext = (0, react_1.createContext)({
     expandedItems: null,
     rotateExpanded: null,

package/dist/scripts/src/components/Accordion/AccordionItem.js

@@ -2,11 +2,11 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.accordionItemComponentRenderer = exports.AccordionItemMd = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
-const ComponentDefs_1 = require("@abstractions/ComponentDefs");
-const AccordionItemNative_1 = require("@components/Accordion/AccordionItemNative");
-const metadata_helpers_1 = require("@components/metadata-helpers");
-const container_helpers_1 = require("@components/container-helpers");
-const renderers_1 = require("@components-core/renderers");
+const ComponentDefs_1 = require("../../abstractions/ComponentDefs");
+const renderers_1 = require("../../components-core/renderers");
+const metadata_helpers_1 = require("../../components/metadata-helpers");
+const container_helpers_1 = require("../../components/container-helpers");
+const AccordionItemNative_1 = require("../../components/Accordion/AccordionItemNative");
 const COMP = "AccordionItem";
 exports.AccordionItemMd = (0, ComponentDefs_1.createMetadata)({
     description: `\`${COMP}\` is a non-visual component describing a tab. Tabs component may use nested ` +

package/dist/scripts/src/components/Accordion/AccordionItemNative.js

@@ -39,11 +39,11 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.AccordionItemComponent = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
-const AccordionContext_1 = require("@components/Accordion/AccordionContext");
-const Accordion_module_scss_1 = __importDefault(require("@components/Accordion/Accordion.module.scss"));
-const IconNative_1 = __importDefault(require("@components/Icon/IconNative"));
 const RAccordion = __importStar(require("@radix-ui/react-accordion"));
 const classnames_1 = __importDefault(require("classnames"));
+const Accordion_module_scss_1 = __importDefault(require("../../components/Accordion/Accordion.module.scss"));
+const AccordionContext_1 = require("../../components/Accordion/AccordionContext");
+const IconNative_1 = __importDefault(require("../../components/Icon/IconNative"));
 function defaultRenderer(header) {
     return (0, jsx_runtime_1.jsx)("div", { children: header });
 }

package/dist/scripts/src/components/Accordion/AccordionNative.js

@@ -38,11 +38,11 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.AccordionComponent = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
 const RAccordion = __importStar(require("@radix-ui/react-accordion"));
-const AccordionContext_1 = require("@components/Accordion/AccordionContext");
 const Accordion_module_scss_1 = __importDefault(require("./Accordion.module.scss"));
-const react_1 = require("react");
-const constants_1 = require("@components-core/constants");
+const constants_1 = require("../../components-core/constants");
+const AccordionContext_1 = require("../../components/Accordion/AccordionContext");
 exports.AccordionComponent = (0, react_1.forwardRef)(function AccordionComponent({ style, children, hideIcon = false, expandedIcon, collapsedIcon = "chevrondown", triggerPosition = "end", onDisplayDidChange = constants_1.noop, registerComponentApi, rotateExpanded = "180deg", }, forwardedRef) {
     const [expandedItems, setExpandedItems] = (0, react_1.useState)([]);
     const [itemElements, setItemElements] = (0, react_1.useState)(new Set());

package/dist/scripts/src/components/Alert/Alert.js

@@ -5,12 +5,12 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.alertComponentRenderer = exports.AlertMd = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
-const ComponentDefs_1 = require("@abstractions/ComponentDefs");
 const Alert_module_scss_1 = __importDefault(require("./Alert.module.scss"));
-const renderers_1 = require("@components-core/renderers");
-const themeVars_1 = require("@components-core/theming/themeVars");
+const ComponentDefs_1 = require("../../abstractions/ComponentDefs");
+const renderers_1 = require("../../components-core/renderers");
+const themeVars_1 = require("../../components-core/theming/themeVars");
+const abstractions_1 = require("../../components/abstractions");
 const AlertNative_1 = require("./AlertNative");
-const abstractions_1 = require("@components/abstractions");
 const COMP = "Alert";
 // See reference implementation here: https://getbootstrap.com/docs/5.3/components/alerts/
 exports.AlertMd = (0, ComponentDefs_1.createMetadata)({

package/dist/scripts/src/components/App/App.js

@@ -5,12 +5,12 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.appRenderer = exports.AppMd = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
-const ComponentDefs_1 = require("@abstractions/ComponentDefs");
-const AppLayoutContext_1 = require("./AppLayoutContext");
 const App_module_scss_1 = __importDefault(require("./App.module.scss"));
-const renderers_1 = require("@components-core/renderers");
-const themeVars_1 = require("@components-core/theming/themeVars");
-const metadata_helpers_1 = require("@components/metadata-helpers");
+const ComponentDefs_1 = require("../../abstractions/ComponentDefs");
+const renderers_1 = require("../../components-core/renderers");
+const themeVars_1 = require("../../components-core/theming/themeVars");
+const metadata_helpers_1 = require("../../components/metadata-helpers");
+const AppLayoutContext_1 = require("./AppLayoutContext");
 const AppNative_1 = require("./AppNative");
 const COMP = "App";
 exports.AppMd = (0, ComponentDefs_1.createMetadata)({

package/dist/scripts/src/components/App/AppNative.js

@@ -18,37 +18,36 @@ exports.App = App;
 exports.getAppLayoutOrientation = getAppLayoutOrientation;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
-const react_2 = require("react");
-const AppLayoutContext_1 = require("./AppLayoutContext");
-const react_3 = require("@remix-run/react");
+const react_helmet_async_1 = require("react-helmet-async");
+const react_2 = require("@remix-run/react");
 const lodash_es_1 = require("lodash-es");
-const classnames_1 = __importDefault(require("@components-core/utils/classnames"));
+const classnames_1 = __importDefault(require("classnames"));
 const App_module_scss_1 = __importDefault(require("./App.module.scss"));
-const AppContext_1 = require("@components-core/AppContext");
-const Sheet_1 = require("@components/App/Sheet");
-const ScrollContext_1 = require("@components-core/ScrollContext");
-const hooks_1 = require("@components-core/utils/hooks");
-const ThemeContext_1 = require("@components-core/theming/ThemeContext");
-const AppHeaderNative_1 = require("@components/AppHeader/AppHeaderNative");
-const css_utils_1 = require("@components-core/utils/css-utils");
-const react_helmet_async_1 = require("react-helmet-async");
+const AppContext_1 = require("../../components-core/AppContext");
+const ScrollContext_1 = require("../../components-core/ScrollContext");
+const hooks_1 = require("../../components-core/utils/hooks");
+const ThemeContext_1 = require("../../components-core/theming/ThemeContext");
+const css_utils_1 = require("../../components-core/utils/css-utils");
+const Sheet_1 = require("../../components/App/Sheet");
+const AppHeaderNative_1 = require("../../components/AppHeader/AppHeaderNative");
+const AppLayoutContext_1 = require("./AppLayoutContext");
 function App({ children, style, layout, loggedInUser, scrollWholePage, noScrollbarGutters = false, onReady = lodash_es_1.noop, header, navPanel, footer, navPanelDef, logoContentDef, logo, logoDark, logoLight, defaultTone, defaultTheme, renderChild, name, }) {
     const { getThemeVar } = (0, ThemeContext_1.useTheme)();
     const { setActiveThemeTone, setActiveThemeId } = (0, ThemeContext_1.useThemes)();
-    const mounted = (0, react_2.useRef)(false);
+    const mounted = (0, react_1.useRef)(false);
     const layoutWithDefaultValue = layout || getThemeVar("layout-App") || "condensed-sticky";
     const safeLayout = layoutWithDefaultValue === null || layoutWithDefaultValue === void 0 ? void 0 : layoutWithDefaultValue.trim().replace(/[\u2013\u2014\u2011]/g, "-"); //It replaces all – (–) and — (—) and non-breaking hyphen '‑' symbols with simple dashes (-).
     const { setLoggedInUser, mediaSize } = (0, AppContext_1.useAppContext)();
     const hasRegisteredHeader = header !== undefined;
     const hasRegisteredNavPanel = navPanelDef !== undefined;
-    const pagesWrapperInnerStyle = (0, react_2.useMemo)(() => {
+    const pagesWrapperInnerStyle = (0, react_1.useMemo)(() => {
         const { padding, paddingLeft, paddingRight, paddingTop, paddingBottom } = style, rest = __rest(style, ["padding", "paddingLeft", "paddingRight", "paddingTop", "paddingBottom"]);
         return Object.assign(Object.assign({}, rest), { "--page-padding-left": padding || paddingLeft, "--page-padding-right": padding || paddingRight, "--page-padding-top": padding || paddingTop, "--page-padding-bottom": padding || paddingBottom });
     }, [style]);
-    (0, react_2.useEffect)(() => {
+    (0, react_1.useEffect)(() => {
         setLoggedInUser(loggedInUser);
     }, [loggedInUser, setLoggedInUser]);
-    (0, react_2.useEffect)(() => {
+    (0, react_1.useEffect)(() => {
         if (mounted.current)
             return;
         mounted.current = true;
@@ -62,7 +61,7 @@ function App({ children, style, layout, loggedInUser, scrollWholePage, noScrollb
             mounted.current = false;
         };
     }, [defaultTone, defaultTheme, setActiveThemeTone, setActiveThemeId]);
-    (0, react_2.useEffect)(() => {
+    (0, react_1.useEffect)(() => {
         onReady();
     }, [onReady]);
     // --- We don't hide the nav panel if there's no header; in that case, we don't have a show drawer
@@ -70,45 +69,45 @@ function App({ children, style, layout, loggedInUser, scrollWholePage, noScrollb
     // --- we couldn't show the NavPanel)
     const navPanelVisible = mediaSize.largeScreen ||
         (!hasRegisteredHeader && safeLayout !== "condensed" && safeLayout !== "condensed-sticky");
-    const scrollPageContainerRef = (0, react_2.useRef)(null);
-    const noScrollPageContainerRef = (0, react_2.useRef)(null);
+    const scrollPageContainerRef = (0, react_1.useRef)(null);
+    const noScrollPageContainerRef = (0, react_1.useRef)(null);
     const scrollContainerRef = scrollWholePage ? scrollPageContainerRef : noScrollPageContainerRef;
-    const [footerHeight, setFooterHeight] = (0, react_2.useState)(0);
-    const [headerHeight, setHeaderHeight] = (0, react_2.useState)(0);
+    const [footerHeight, setFooterHeight] = (0, react_1.useState)(0);
+    const [headerHeight, setHeaderHeight] = (0, react_1.useState)(0);
     const scrollbarWidth = (0, css_utils_1.useScrollbarWidth)();
-    const footerRef = (0, react_2.useRef)();
-    const footerRefCallback = (0, react_2.useCallback)((element) => {
+    const footerRef = (0, react_1.useRef)();
+    const footerRefCallback = (0, react_1.useCallback)((element) => {
         footerRef.current = element;
     }, []);
-    const headerRef = (0, react_2.useRef)();
-    const headerRefCallback = (0, react_2.useCallback)((element) => {
+    const headerRef = (0, react_1.useRef)();
+    const headerRefCallback = (0, react_1.useCallback)((element) => {
         headerRef.current = element;
     }, []);
-    (0, hooks_1.useResizeObserver)(footerRef, (0, react_2.useCallback)((entries) => {
+    (0, hooks_1.useResizeObserver)(footerRef, (0, react_1.useCallback)((entries) => {
         var _a, _b;
         setFooterHeight((_b = (_a = entries === null || entries === void 0 ? void 0 : entries[0]) === null || _a === void 0 ? void 0 : _a.contentRect) === null || _b === void 0 ? void 0 : _b.height);
     }, []));
-    (0, hooks_1.useResizeObserver)(headerRef, (0, react_2.useCallback)((entries) => {
+    (0, hooks_1.useResizeObserver)(headerRef, (0, react_1.useCallback)((entries) => {
         var _a, _b;
         setHeaderHeight((_b = (_a = entries === null || entries === void 0 ? void 0 : entries[0]) === null || _a === void 0 ? void 0 : _a.contentRect) === null || _b === void 0 ? void 0 : _b.height);
     }, []));
-    const styleWithHelpers = (0, react_2.useMemo)(() => {
+    const styleWithHelpers = (0, react_1.useMemo)(() => {
         return {
             "--header-height": !scrollWholePage ? 0 : headerHeight + "px",
             "--footer-height": !scrollWholePage ? 0 : footerHeight + "px",
             "--scrollbar-width": scrollbarWidth + "px",
         };
     }, [footerHeight, headerHeight, scrollWholePage, scrollbarWidth]);
-    const [drawerVisible, setDrawerVisible] = (0, react_2.useState)(false);
-    const location = (0, react_3.useLocation)();
-    const toggleDrawer = (0, react_2.useCallback)(() => {
+    const [drawerVisible, setDrawerVisible] = (0, react_1.useState)(false);
+    const location = (0, react_2.useLocation)();
+    const toggleDrawer = (0, react_1.useCallback)(() => {
         setDrawerVisible((prev) => !prev);
     }, []);
     (0, react_1.useLayoutEffect)(() => {
         var _a;
         (_a = scrollPageContainerRef.current) === null || _a === void 0 ? void 0 : _a.scrollTo(0, 0);
     }, [location.pathname]);
-    const layoutContextValue = (0, react_2.useMemo)(() => {
+    const layoutContextValue = (0, react_1.useMemo)(() => {
         return {
             hasRegisteredNavPanel,
             hasRegisteredHeader,
@@ -141,12 +140,12 @@ function App({ children, style, layout, loggedInUser, scrollWholePage, noScrollb
         navPanelDef,
         logoContentDef,
     ]);
-    (0, react_2.useEffect)(() => {
+    (0, react_1.useEffect)(() => {
         if (navPanelVisible) {
             setDrawerVisible(false);
         }
     }, [navPanelVisible]);
-    (0, react_2.useEffect)(() => {
+    (0, react_1.useEffect)(() => {
         setDrawerVisible(false);
     }, [location, safeLayout]);
     const wrapperBaseClasses = [

package/dist/scripts/src/components/App/Sheet.js

@@ -51,11 +51,11 @@ exports.SheetContent = exports.Sheet = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const React = __importStar(require("react"));
 const SheetPrimitive = __importStar(require("@radix-ui/react-dialog"));
-const classnames_1 = __importDefault(require("@components-core/utils/classnames"));
-const IconNative_1 = require("@components/Icon/IconNative");
-const Sheet_module_scss_1 = __importDefault(require("./Sheet.module.scss"));
+const classnames_1 = __importDefault(require("classnames"));
 const react_visually_hidden_1 = require("@radix-ui/react-visually-hidden");
-const ThemeContext_1 = require("@components-core/theming/ThemeContext");
+const Sheet_module_scss_1 = __importDefault(require("./Sheet.module.scss"));
+const ThemeContext_1 = require("../../components-core/theming/ThemeContext");
+const IconNative_1 = require("../../components/Icon/IconNative");
 //based on this: https://ui.shadcn.com/docs/components/sheet
 const Sheet = SheetPrimitive.Root;
 exports.Sheet = Sheet;

package/dist/scripts/src/components/AppHeader/AppHeader.js

@@ -6,13 +6,13 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.appHeaderComponentRenderer = exports.AppHeaderMd = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const AppHeader_module_scss_1 = __importDefault(require("./AppHeader.module.scss"));
-const ComponentDefs_1 = require("@abstractions/ComponentDefs");
-const renderers_1 = require("@components-core/renderers");
-const themeVars_1 = require("@components-core/theming/themeVars");
-const base_utils_1 = require("@components-core/theming/themes/base-utils");
+const ComponentDefs_1 = require("../../abstractions/ComponentDefs");
+const renderers_1 = require("../../components-core/renderers");
+const themeVars_1 = require("../../components-core/theming/themeVars");
+const base_utils_1 = require("../../components-core/theming/themes/base-utils");
+const metadata_helpers_1 = require("../../components/metadata-helpers");
+const SlotItem_1 = require("../../components/SlotItem");
 const AppHeaderNative_1 = require("./AppHeaderNative");
-const metadata_helpers_1 = require("@components/metadata-helpers");
-const SlotItem_1 = require("@components/SlotItem");
 const COMP = "AppHeader";
 exports.AppHeaderMd = (0, ComponentDefs_1.createMetadata)({
     status: "experimental",

package/dist/scripts/src/components/AppHeader/AppHeaderNative.js

@@ -7,16 +7,16 @@ exports.AppHeader = void 0;
 exports.useLogoUrl = useLogoUrl;
 exports.AppContextAwareAppHeader = AppContextAwareAppHeader;
 const jsx_runtime_1 = require("react/jsx-runtime");
-const classnames_1 = __importDefault(require("@components-core/utils/classnames"));
+const classnames_1 = __importDefault(require("classnames"));
 const AppHeader_module_scss_1 = __importDefault(require("./AppHeader.module.scss"));
-const IconNative_1 = require("@components/Icon/IconNative");
-const constants_1 = require("@components-core/constants");
-const LogoNative_1 = require("@components/Logo/LogoNative");
-const AppLayoutContext_1 = require("@components/App/AppLayoutContext");
-const ButtonNative_1 = require("@components/Button/ButtonNative");
-const ThemeContext_1 = require("@components-core/theming/ThemeContext");
-const NavLinkNative_1 = require("@components/NavLink/NavLinkNative");
-const AppContext_1 = require("@components-core/AppContext");
+const ThemeContext_1 = require("../../components-core/theming/ThemeContext");
+const constants_1 = require("../../components-core/constants");
+const AppContext_1 = require("../../components-core/AppContext");
+const IconNative_1 = require("../../components/Icon/IconNative");
+const LogoNative_1 = require("../../components/Logo/LogoNative");
+const AppLayoutContext_1 = require("../../components/App/AppLayoutContext");
+const ButtonNative_1 = require("../../components/Button/ButtonNative");
+const NavLinkNative_1 = require("../../components/NavLink/NavLinkNative");
 function tryLoadImage(url, onLoaded, onError) {
     const img = new Image();
     img.src = url;

package/dist/scripts/src/components/AppState/AppState.js

@@ -2,8 +2,8 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.appStateComponentRenderer = exports.AppStateMd = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
-const ComponentDefs_1 = require("@abstractions/ComponentDefs");
-const renderers_1 = require("@components-core/renderers");
+const ComponentDefs_1 = require("../../abstractions/ComponentDefs");
+const renderers_1 = require("../../components-core/renderers");
 const AppStateNative_1 = require("./AppStateNative");
 const COMP = "AppState";
 exports.AppStateMd = (0, ComponentDefs_1.createMetadata)({

package/dist/scripts/src/components/AppState/AppStateNative.js

@@ -1,8 +1,8 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.AppState = AppState;
-const hooks_1 = require("@components-core/utils/hooks");
-const AppStateContext_1 = require("@components/App/AppStateContext");
+const hooks_1 = require("../../components-core/utils/hooks");
+const AppStateContext_1 = require("../../components/App/AppStateContext");
 function AppState({ bucket = "default", updateState, initialValue, registerComponentApi, }) {
     const registerAppState = (0, AppStateContext_1.useAppStateContextPart)((value) => value.registerAppState);
     const update = (0, AppStateContext_1.useAppStateContextPart)((value) => value.update);

package/dist/scripts/src/components/AutoComplete/AutoComplete.js

@@ -5,13 +5,13 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.autoCompleteComponentRenderer = exports.AutoCompleteMd = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
-const ComponentDefs_1 = require("@abstractions/ComponentDefs");
-const renderers_1 = require("@components-core/renderers");
-const AutoComplete_module_scss_1 = __importDefault(require("@components/AutoComplete/AutoComplete.module.scss"));
-const container_helpers_1 = require("@components/container-helpers");
-const themeVars_1 = require("@components-core/theming/themeVars");
-const metadata_helpers_1 = require("@components/metadata-helpers");
-const AutoCompleteNative_1 = require("@components/AutoComplete/AutoCompleteNative");
+const AutoComplete_module_scss_1 = __importDefault(require("../../components/AutoComplete/AutoComplete.module.scss"));
+const ComponentDefs_1 = require("../../abstractions/ComponentDefs");
+const renderers_1 = require("../../components-core/renderers");
+const themeVars_1 = require("../../components-core/theming/themeVars");
+const container_helpers_1 = require("../../components/container-helpers");
+const metadata_helpers_1 = require("../../components/metadata-helpers");
+const AutoCompleteNative_1 = require("../../components/AutoComplete/AutoCompleteNative");
 const COMP = "AutoComplete";
 exports.AutoCompleteMd = (0, ComponentDefs_1.createMetadata)({
     description: "This component is a dropdown with a list of options. According to the " +