diff --git a/packages/malloy-render/src/component/copy-to-html.ts b/packages/malloy-render/src/component/copy-to-html.ts
index 13c1427bf..e8c0844bc 100644
--- a/packages/malloy-render/src/component/copy-to-html.ts
+++ b/packages/malloy-render/src/component/copy-to-html.ts
@@ -2,6 +2,18 @@ import {MalloyRenderProps} from './render';
export async function copyMalloyRenderHTML(
element: HTMLElement & MalloyRenderProps
+) {
+ const html = await getMalloyRenderHTML(element);
+ try {
+ await navigator.clipboard.writeText(html);
+ } catch (error) {
+ /* eslint-disable no-console */
+ console.error('Failed to copy text: ', error);
+ }
+}
+
+export async function getMalloyRenderHTML(
+ element: HTMLElement & MalloyRenderProps
) {
let html = '';
@@ -23,6 +35,9 @@ export async function copyMalloyRenderHTML(
);
element.dashboardConfig = copyHTMLDashboardConfig;
+ // Give charts time to re-render after configuration changes
+ await sleep(1000);
+
if (element.shadowRoot) {
let styles = '';
for (const stylesheet of [...element.shadowRoot.adoptedStyleSheets]) {
@@ -34,29 +49,31 @@ export async function copyMalloyRenderHTML(
styles = styles.replaceAll(':host', '.malloy_html_host');
const shadowStyle = element.getAttribute('style');
html = `
-
-
-
- ${element.shadowRoot.innerHTML}
+ form.vega-bindings {
+ margin-block: 0em;
+ }
+
+
+ ${element.shadowRoot.innerHTML}
+
-
- `;
+ `;
}
} else html = element.innerHTML;
- try {
- await navigator.clipboard.writeText(html);
- element.tableConfig = originalTableConfig;
- element.dashboardConfig = originalDashboardConfig;
- } catch (error) {
- /* eslint-disable no-console */
- console.error('Failed to copy text: ', error);
- element.tableConfig = originalTableConfig;
- element.dashboardConfig = originalDashboardConfig;
- }
+
+ // Reset element configuration
+ element.tableConfig = originalTableConfig;
+ element.dashboardConfig = originalDashboardConfig;
+
+ return html;
+}
+
+function sleep(n: number) {
+ return new Promise(resolve => {
+ setTimeout(resolve, n);
+ });
}
diff --git a/packages/malloy-render/src/index.ts b/packages/malloy-render/src/index.ts
index 11944ace2..f611bdac2 100644
--- a/packages/malloy-render/src/index.ts
+++ b/packages/malloy-render/src/index.ts
@@ -26,4 +26,7 @@ export * from './html/data_styles';
export type {MalloyRenderProps} from './component/render';
// Needed for test only.
export {getDrillQuery} from './html/drill';
-export {copyMalloyRenderHTML} from './component/copy-to-html';
+export {
+ copyMalloyRenderHTML,
+ getMalloyRenderHTML,
+} from './component/copy-to-html';
diff --git a/packages/malloy-render/vite.config.base.ts b/packages/malloy-render/vite.config.base.ts
index 0445f2904..d3bbee4dd 100644
--- a/packages/malloy-render/vite.config.base.ts
+++ b/packages/malloy-render/vite.config.base.ts
@@ -1,19 +1,14 @@
-import {fileURLToPath} from 'node:url';
-import {defineConfig} from 'vite';
+import {PluginOption, defineConfig} from 'vite';
import solidPlugin from 'vite-plugin-solid';
export default defineConfig({
- plugins: [solidPlugin()],
+ plugins: [viteStripMalloyDevToolsPlugin(), solidPlugin()],
optimizeDeps: {
include: ['@malloydata/malloy'],
},
build: {
rollupOptions: {
- external: [
- fileURLToPath(
- new URL('src/component/chart/chart-dev-tool.tsx', import.meta.url)
- ),
- ],
+ external: [],
output: {},
},
commonjsOptions: {
@@ -24,3 +19,18 @@ export default defineConfig({
'process.env': {},
},
});
+
+function viteStripMalloyDevToolsPlugin(): PluginOption {
+ return {
+ name: 'vite-plugin-strip-malloy-dev-tools',
+ async transform(code, id) {
+ if (id.endsWith('chart-dev-tool.tsx')) {
+ return `
+ export default function noop() {
+ return null;
+ }
+ `;
+ }
+ },
+ };
+}