miscellaneous fixes and patches (#98)

* add missing card component to local api

* fix missing `JSX` import in loading boundary file

* fix type errors in progress-field.tsx

* fix type errors in `basics.tsx`

* fix type errors in data-array.ts

* fix type errors related to `width` property in `table.tsx`

* append special line to plugin output after `yarn dev` to ensure sourcemaps aren't stripped

* fix inability to query `MarkdownListBlock`s by fields

Author: GamerGirlandCo

esbuild.config.mjs

@@ -51,6 +51,7 @@ async function build(prod) {
 	// Copy the manifest and styles.
 	fs.copyFileSync("manifest-beta.json", "build/plugin/manifest.json");
 	fs.renameSync("build/plugin/main.css", "build/plugin/styles.css");
+	fs.appendFileSync("build/plugin/main.js", "\n/* nosourcemap */")
 	fs.writeFileSync("build/meta.json", JSON.stringify(result.metafile));
 }
 

src/api/data-array.ts

@@ -391,10 +391,10 @@ class DataArrayImpl<T> implements DataArray<T> {
     }
 
     public first(): T {
-        return this.values.length > 0 ? this.values[0] : undefined;
+        return this.values.length > 0 ? this.values[0] : (undefined as T);
     }
     public last(): T {
-        return this.values.length > 0 ? this.values[this.values.length - 1] : undefined;
+        return this.values.length > 0 ? this.values[this.values.length - 1] : (undefined as T);
     }
 
     public to(key: string): DataArray<any> {

src/api/local-api.tsx

@@ -26,6 +26,7 @@ import { DataArray } from "./data-array";
 import { Coerce } from "./coerce";
 import { ScriptCache } from "./script-cache";
 import { Expression } from "expression/expression";
+import { Card } from "./ui/views/cards";
 
 /** Local API provided to specific codeblocks when they are executing.
  * @group Core
@@ -318,6 +319,7 @@ export class DatacoreLocalApi {
     ///////////
 
     public VanillaTable = VanillaTable;
+    public Card = Card;
 
     /////////////////////////
     // Interative elements //

src/api/ui/basics.tsx

@@ -26,7 +26,7 @@ export const INTENT_CLASSES: Record<Intent, string> = {
  * @group Components
  */
 export function Button(
-    props: { className?: string; intent?: Intent; children: ComponentChildren } & React.HTMLProps<HTMLButtonElement>
+    props: { className?: string; intent?: Intent; children: ComponentChildren } & React.ComponentProps<"button">
 ) {
     const { className, intent, children, ...forwardingProps } = props;
     return (
@@ -43,7 +43,7 @@ export function Button(
  * A simple textbox which accepts text.
  * @group Components
  */
-export function Textbox(props: { className?: string } & React.HTMLProps<HTMLInputElement>) {
+export function Textbox(props: React.ComponentProps<"input"> & { className?: string }) {
     const { className, children, ...forwardingProps } = props;
     return (
         <input type={props.type ?? "text"} className={combineClasses("dc-textbox", className)} {...forwardingProps} />
@@ -62,7 +62,7 @@ export function Checkbox(
         defaultChecked?: boolean;
         onCheckChange?: (checked: boolean) => void;
         children?: ComponentChildren;
-    } & React.HTMLProps<HTMLInputElement>
+    } & React.ComponentProps<"input">
 ) {
     const {
         className,
@@ -105,7 +105,7 @@ export function Slider(
         value?: number;
         defaultValue?: number;
         onValueChange?: (value: number) => void;
-    } & React.HTMLProps<HTMLInputElement>
+    } & React.ComponentProps<"input">
 ) {
     const { className, min = 0, max = 10, step = 1, value, defaultValue, onValueChange, ...forwardingProps } = props;
     const [slider, setSlider] = useControlledState(defaultValue ?? 0, value, onValueChange);
@@ -138,7 +138,7 @@ export function Switch(
         checked?: boolean;
         defaultChecked?: boolean;
         onToggleChange?: (checked: boolean) => void;
-    } & React.HTMLProps<HTMLInputElement>
+    } & React.ComponentProps<"input">
 ) {
     const { className, disabled, defaultChecked, checked, onToggleChange, ...forwardingProps } = props;
     const [toggled, setToggled] = useControlledState(defaultChecked ?? false, checked, onToggleChange);
@@ -178,7 +178,7 @@ export function VanillaSelect(
         value?: string;
         defaultValue?: string;
         onValueChange?: (value: string) => void;
-    } & React.HTMLProps<HTMLSelectElement>
+    } & React.ComponentProps<"select">
 ) {
     const { className, options = [], value, defaultValue, onValueChange, ...forwardingProps } = props;
     const [selectedValue, setSelectedValue] = React.useState(value ?? defaultValue ?? "");

src/api/ui/views/table.tsx

@@ -148,7 +148,7 @@ export function VanillaTableHeaderCell<T>({ column }: { column: VanillaColumn<T>
 
     // We use an internal div to avoid flex messing with the table layout.
     return (
-        <th width={realWidth} className="datacore-table-header-cell">
+        <th style={{ width: realWidth }} className="datacore-table-header-cell">
             <div className="datacore-table-header-title">{header}</div>
         </th>
     );

src/index/types/markdown.ts

@@ -354,7 +354,7 @@ export class MarkdownBlock implements Indexable, Linkbearing, Taggable, Fieldbea
 
 /** Special block for markdown lists (of either plain list entries or tasks). */
 export class MarkdownListBlock extends MarkdownBlock implements Taggable, Linkbearing {
-    static TYPES = ["markdown", "block", "block-list", TAGGABLE_TYPE, LINKBEARING_TYPE];
+    static TYPES = ["markdown", "block", "block-list", TAGGABLE_TYPE, LINKBEARING_TYPE, FIELDBEARING_TYPE];
 
     $types: string[] = MarkdownListBlock.TYPES;
     $typename: string = "List Block";

src/ui/fields/progress-field.tsx

@@ -37,10 +37,17 @@ export function ProgressEditable(
         },
         [val.current, props.sourcePath]
     );
-    const readOnly = <progress value={val.current} min={props.min} max={props.max} step={props.step} />;
+    const readOnly = <progress value={val.current} max={props.max} />;
 
     const editor = (
-        <input type="range" className="datacore-progress-editable" value={val.current} onChange={changeCB} />
+        <input
+            type="range"
+            className="datacore-progress-editable"
+            min={props.min}
+            value={val.current}
+            onChange={changeCB}
+            step={props.step}
+        />
     );
 
     return (

src/ui/loading-boundary.tsx

@@ -2,7 +2,7 @@ import { Datacore } from "index/datacore";
 import { PropsWithChildren, useEffect, useState } from "preact/compat";
 import { useIndexUpdates } from "./hooks";
 import { Literal } from "expression/literal";
-import { VNode, createElement, isValidElement } from "preact";
+import { JSX, VNode, createElement, isValidElement } from "preact";
 import { ErrorMessage, Lit } from "./markdown";
 
 import "./errors.css";