lupine.api 1.0.41 → 1.0.42

package/admin/admin-db.tsx

@@ -39,6 +39,7 @@ const fetchRunSql = async (sql: string) => {
 
 export const RunSqlPage = () => {
   const onClick = async () => {
+    ref.$('.sql-result').innerHTML = 'Running...';
     const json = await fetchRunSql((ref.$('.sql') as HTMLFormElement).value);
     console.log('====homepage', json);
     ref.$('.sql-result').innerHTML = JSON.stringify(json.result, null, 4);

package/admin/admin-performance.tsx

@@ -16,7 +16,7 @@ export const AdminPerformancePage = () => {
       onRefresh();
     },
   };
-  const dom = HtmlVar('');
+  const dom = new HtmlVar('');
   return (
     <div ref={ref}>
       <button onClick={onRefresh} class='button-base'>

package/admin/admin-release.tsx

@@ -150,8 +150,8 @@ export const AdminReleasePage = () => {
       textDecoration: 'underline',
     },
   };
-  const domLog = HtmlVar('');
-  const domUpdate = HtmlVar('');
+  const domLog = new HtmlVar('');
+  const domUpdate = new HtmlVar('');
   const getDomData = () => {
     const dataOld = JSON.parse(localStorage.getItem('admin-release') || '{}');
     const data = {

package/admin/admin-resources.tsx

@@ -135,8 +135,8 @@ const ResourcesList = (props: {
   );
 };
 export const AdminResourcesPage = () => {
-  const domLog = HtmlVar('');
-  const domUpdate = HtmlVar('');
+  const domLog = new HtmlVar('');
+  const domUpdate = new HtmlVar('');
 
   let resourcesFullPath = '';
   const onResources = async () => {

package/admin/admin-table-data.tsx

@@ -125,7 +125,7 @@ export const AdminTableData = (props: { tableName: string; update?: TableDataUpd
     props.update.refreshRef = refresh;
   }
   bindGlobalStyles('admin-table-data', '.admin-table-data', css);
-  const dom = HtmlVar('');
+  const dom = new HtmlVar('');
   return (
     <div className='admin-table-data' ref={ref}>
       <button class='button-base button-s' onClick={refresh}>

package/admin/admin-test-animations.tsx

@@ -26,7 +26,7 @@ const TestButton = () => {
       dom.value = 'This value is set in onLoad event.';
     },
   };
-  const dom = HtmlVar('');
+  const dom = new HtmlVar('');
   return (
     <div ref={ref} class='row-box pt-m'>
       <button onClick={onClick} class='button-base'>
@@ -46,7 +46,7 @@ const TestInput = () => {
     refInput.current.value = '';
     refInput.current.dispatchEvent(new Event('input'));
   };
-  const dom = HtmlVar('');
+  const dom = new HtmlVar('');
   const refInput: RefProps = {};
   return (
     <div>
@@ -70,7 +70,7 @@ const TestMouse = () => {
   const onMMove = (ev: any) => {
     dom.value = `Moving: x: ${ev.clientX}, y: ${ev.clientY}`;
   };
-  const dom = HtmlVar('');
+  const dom = new HtmlVar('');
   return (
     <div style={{ border: 'solid 1px red' }} class='row-box p-m' onMouseMove={onMMove}>
       <button onClick={onClick} class='button-base'>
@@ -98,7 +98,7 @@ const TestCommunication = (props: CommunicationProps) => {
     dom.value = `received message, id: ${obj.id}, msg: ${obj.message}`;
     return { status: 'ok', message: 'echo: ' + obj.message };
   };
-  const dom = HtmlVar('');
+  const dom = new HtmlVar('');
   return (
     <div>
       <div class='row-box pt-m'>
@@ -130,7 +130,7 @@ const TestHtmlVar = () => {
       </>
     );
   };
-  const dom = HtmlVar(defaultContent());
+  const dom = new HtmlVar(defaultContent());
   const css: CssProps = {
     backgroundColor: '#a1ffe8',
     padding: '10px',

package/admin/admin-test-edit.tsx

@@ -217,7 +217,7 @@ export const BookShowItem = (props: { item: SampleDataProps }) => {
     );
   };
 
-  const dom = HtmlVar(makeDom(props.item));
+  const dom = new HtmlVar(makeDom(props.item));
   return (
     <div ref={ref} css={css} class='sample-data'>
       {dom.node}
@@ -280,7 +280,7 @@ export const BookList = () => {
       </div>
     );
   };
-  const listDom = HtmlVar(makeList(currentIndex));
+  const listDom = new HtmlVar(makeList(currentIndex));
   const css: CssProps = {
     display: 'flex',
     flexDirection: 'column',

package/admin/admin-tokens.tsx

@@ -234,7 +234,7 @@ export const TokenShowItem = (props: { item: TokenProps }) => {
     );
   };
 
-  const dom = HtmlVar(makeDom(props.item));
+  const dom = new HtmlVar(makeDom(props.item));
   return (
     <div ref={ref} css={css} class='sample-data'>
       {dom.node}
@@ -299,7 +299,7 @@ const TokenList = () => {
       </div>
     );
   };
-  const listDom = HtmlVar(<div></div>);
+  const listDom = new HtmlVar(<div></div>);
   const css: CssProps = {
     display: 'flex',
     flexDirection: 'column',

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "lupine.api",
-  "version": "1.0.41",
+  "version": "1.0.42",
   "license": "MIT",
   "author": "uuware.com",
   "homepage": "https://github.com/uuware/lupine.js",