@solidjs/start 2.0.0-rc.3 → 2.0.0-rc.5

package/dist/fns/serialization.js

@@ -1,6 +1,6 @@
 import { crossSerializeStream, deserialize, Feature, fromCrossJSON, getCrossReferenceHeader, toCrossJSONStream, } from "seroval";
 import { AbortSignalPlugin, CustomEventPlugin, DOMExceptionPlugin, EventPlugin, FormDataPlugin, HeadersPlugin, ReadableStreamPlugin, RequestPlugin, ResponsePlugin, URLPlugin, URLSearchParamsPlugin, } from "seroval-plugins/web";
-// TODO(Alexis): if we can, allow providing an option to extend these.
+import userPlugins from "solid-start:seroval-plugins";
 const DEFAULT_PLUGINS = [
     AbortSignalPlugin,
     CustomEventPlugin,
@@ -14,8 +14,37 @@ const DEFAULT_PLUGINS = [
     URLSearchParamsPlugin,
     URLPlugin,
 ];
+/**
+ * Plugins from `serialization.plugins` are appended rather than prepended:
+ * seroval picks the first plugin whose `test()` passes, so the built-ins win
+ * and a loose user `test()` can't take over `Request`/`FormData`/`URL`.
+ *
+ * The same list has to be used on both ends of a server function, which is why
+ * this comes from a virtual module bundled into the client and the server
+ * rather than a runtime option.
+ */
+const PLUGINS = [...DEFAULT_PLUGINS, ...userPlugins];
 const MAX_SERIALIZATION_DEPTH_LIMIT = 64;
 const DISABLED_FEATURES = Feature.RegExp;
+/**
+ * An error thrown by a server function is serialized and rethrown on the
+ * client, and seroval includes `Error.prototype.stack` by default. In
+ * production that leaks server file paths, internal function names and the
+ * shape of the deployment to anyone who can trigger a throw, so strip it.
+ * Development keeps the stack: that's where it's actually useful, and the
+ * paths it exposes are the developer's own.
+ *
+ * Only applied when writing; parsing leaves `DISABLED_FEATURES` alone so an
+ * incoming payload that does carry a stack still deserializes.
+ */
+const SERIALIZE_DISABLED_FEATURES = import.meta.env.PROD
+    ? DISABLED_FEATURES | Feature.ErrorPrototypeStack
+    : DISABLED_FEATURES;
+/**
+ * `crossSerializeStream` historically ran with every feature enabled, so only
+ * add the stack removal here rather than the full serialize set.
+ */
+const JS_SERIALIZE_DISABLED_FEATURES = import.meta.env.PROD ? Feature.ErrorPrototypeStack : 0;
 /**
  * Alexis:
  *
@@ -47,7 +76,8 @@ export function serializeToJSStream(id, value) {
         start(controller) {
             crossSerializeStream(value, {
                 scopeId: id,
-                plugins: DEFAULT_PLUGINS,
+                disabledFeatures: JS_SERIALIZE_DISABLED_FEATURES,
+                plugins: PLUGINS,
                 onSerialize(data, initial) {
                     controller.enqueue(createChunk(initial ? `(${getCrossReferenceHeader(id)},${data})` : data));
                 },
@@ -65,9 +95,9 @@ export function serializeToJSONStream(value) {
     return new ReadableStream({
         start(controller) {
             toCrossJSONStream(value, {
-                disabledFeatures: DISABLED_FEATURES,
+                disabledFeatures: SERIALIZE_DISABLED_FEATURES,
                 depthLimit: MAX_SERIALIZATION_DEPTH_LIMIT,
-                plugins: DEFAULT_PLUGINS,
+                plugins: PLUGINS,
                 onParse(node) {
                     controller.enqueue(createChunk(JSON.stringify(node)));
                 },
@@ -180,7 +210,7 @@ export async function deserializeJSONStream(response) {
                 refs,
                 disabledFeatures: DISABLED_FEATURES,
                 depthLimit: MAX_SERIALIZATION_DEPTH_LIMIT,
-                plugins: DEFAULT_PLUGINS,
+                plugins: PLUGINS,
             });
             return value;
         }

package/dist/server/assets/render.jsx

@@ -9,6 +9,6 @@ const assetMap = {
     noscript: (props) => (<noscript {...props.attrs}>{props.children}</noscript>),
 };
 export function renderAsset(asset, nonce) {
-    let { tag, attrs: { key, ...attrs } = { key: undefined }, children, } = asset;
+    let { tag, attrs: { key, ...attrs } = { key: undefined }, children } = asset;
     return assetMap[tag]({ attrs: { ...attrs, nonce }, key, children });
 }

package/dist/server/handler.js

@@ -171,9 +171,17 @@ function handleStreamCompleteRedirect(context) {
     return ({ write }) => {
         context.complete = true;
         const to = context.response && context.response.headers.get("Location");
-        to && write(`<script>window.location=${JSON.stringify(to).replace(/</g, "\\u003c")}</script>`);
+        if (!to)
+            return;
+        // The shell has already flushed, so the redirect has to happen client side.
+        // Carry the nonce so a strict `script-src` CSP doesn't block it.
+        const nonce = context.nonce ? ` nonce="${escapeAttribute(context.nonce)}"` : "";
+        write(`<script${nonce}>window.location=${JSON.stringify(to).replace(/</g, "\\u003c")}</script>`);
     };
 }
+function escapeAttribute(value) {
+    return value.replace(/&/g, "&amp;").replace(/"/g, "&quot;").replace(/</g, "&lt;");
+}
 function stripBaseUrl(path) {
     const base = import.meta.env.SERVER_BASE_URL || import.meta.env.BASE_URL || "/";
     return stripPathBase(path, base);

package/dist/server/spa/StartServer.jsx

@@ -18,7 +18,7 @@ export function StartServer(props) {
       <TopErrorBoundary>
         <props.document scripts={<>
               <PatchVirtualDevStyles nonce={nonce}/>
-              <script type="module" src={getSsrManifest("client").path(import.meta.env.START_CLIENT_ENTRY_URL)}/>
+              <script type="module" nonce={nonce} src={getSsrManifest("client").path(import.meta.env.START_CLIENT_ENTRY_URL)}/>
             </>}/>
       </TopErrorBoundary>
     </NoHydration>);

package/dist/shared/clientOnly.js

@@ -19,7 +19,9 @@ export default function clientOnly(fn, options = {}) {
             return Comp(rest);
         const [mounted, setMounted] = createSignal(!sharedConfig.context);
         onMount(() => setMounted(true));
-        return createMemo(() => ((Comp = comp()), (m = mounted()), untrack(() => (Comp && m ? Comp(rest) : props.fallback))));
+        return createMemo(() => ((Comp = comp()),
+            (m = mounted()),
+            untrack(() => (Comp && m ? Comp(rest) : props.fallback))));
     };
 }
 function load(fn, setComp) {

package/dist/shared/dev-toolbar/error-viewer/CodeView.jsx

@@ -51,7 +51,7 @@ export function CodeView(props) {
             for (let i = 0, len = lines.length; i < len; i++) {
                 const el = lines[i];
                 if (props.line - minLine() - 1 === i) {
-                    el.dataset.startErrorViewerErrorLine = '';
+                    el.dataset.startErrorViewerErrorLine = "";
                 }
             }
         }

package/dist/shared/dev-toolbar/functions/BlobViewer.css

@@ -1,4 +1,4 @@
 [data-start-blob-viewer] svg {
   width: 1rem;
   height: 1rem;
-}
+}

package/dist/shared/dev-toolbar/functions/BlobViewer.d.ts

@@ -1,5 +1,5 @@
-import { type JSX } from 'solid-js';
-import './BlobViewer.css';
+import { type JSX } from "solid-js";
+import "./BlobViewer.css";
 export interface BlobViewerProps {
     source: Blob | File | Promise<Blob | File>;
 }

package/dist/shared/dev-toolbar/functions/BlobViewer.jsx

@@ -1,7 +1,7 @@
-import { createMemo, createResource, onCleanup, Show, Suspense } from 'solid-js';
+import { createMemo, createResource, onCleanup, Show, Suspense } from "solid-js";
 import { Badge } from "../../ui/Badge.jsx";
 import Button from "../../ui/Button.jsx";
-import './BlobViewer.css';
+import "./BlobViewer.css";
 function DocumentIcon(props) {
     return (<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor" {...props}>
       <title>{props.title}</title>
@@ -23,19 +23,15 @@ function BlobViewerInner(props) {
         document.body.removeChild(link);
     }
     return (<Button data-start-blob-viewer onClick={() => openFileInNewTab()}>
-      {props.source instanceof File
-            ? (<Badge type="info">
-            <DocumentIcon title={props.source.name}/>
-            {props.source.name}
-          </Badge>)
-            : <Badge type="info">{props.source.type}</Badge>}
+      {props.source instanceof File ? (<Badge type="info">
+          <DocumentIcon title={props.source.name}/>
+          {props.source.name}
+        </Badge>) : (<Badge type="info">{props.source.type}</Badge>)}
     </Button>);
 }
 export function BlobViewer(props) {
     const [data] = createResource(() => props.source);
     return (<Suspense>
-      <Show when={data()}>
-        {(current) => <BlobViewerInner source={current()}/>}
-      </Show>
+      <Show when={data()}>{current => <BlobViewerInner source={current()}/>}</Show>
     </Suspense>);
 }

package/dist/shared/dev-toolbar/functions/FormDataViewer.d.ts

@@ -1,4 +1,4 @@
-import { type JSX } from 'solid-js';
+import { type JSX } from "solid-js";
 export interface FormDataViewerProps {
     source: FormData | Promise<FormData>;
 }

package/dist/shared/dev-toolbar/functions/FormDataViewer.jsx

@@ -1,17 +1,15 @@
-import { createResource, For, Show, Suspense } from 'solid-js';
-import { Section } from '../../ui/Section.jsx';
-import { BlobViewer } from './BlobViewer.jsx';
-import { PropertySeparator, SerovalValue } from './SerovalValue.jsx';
+import { createResource, For, Show, Suspense } from "solid-js";
+import { Section } from "../../ui/Section.jsx";
+import { BlobViewer } from "./BlobViewer.jsx";
+import { PropertySeparator, SerovalValue } from "./SerovalValue.jsx";
 function FormDataViewerInner(props) {
-    return (<Section title="FormData" options={{ size: 'sm' }}>
+    return (<Section title="FormData" options={{ size: "sm" }}>
       <div data-start-form-data-viewer data-start-properties>
         <For each={Array.from(props.source.entries())}>
           {([key, value]) => (<div data-start-property>
               <SerovalValue value={`"${key}"`}/>
               <PropertySeparator />
-              {typeof value === 'string'
-                ? <SerovalValue value={`"${JSON.stringify(value)}"`}/>
-                : <BlobViewer source={value}/>}
+              {typeof value === "string" ? (<SerovalValue value={`"${JSON.stringify(value)}"`}/>) : (<BlobViewer source={value}/>)}
             </div>)}
         </For>
       </div>
@@ -20,8 +18,6 @@ function FormDataViewerInner(props) {
 export function FormDataViewer(props) {
     const [data] = createResource(() => props.source);
     return (<Suspense>
-      <Show when={data()}>
-        {(current) => <FormDataViewerInner source={current()}/>}
-      </Show>
+      <Show when={data()}>{current => <FormDataViewerInner source={current()}/>}</Show>
     </Suspense>);
 }

package/dist/shared/dev-toolbar/functions/HeadersViewer.d.ts

@@ -1,4 +1,4 @@
-import './HeadersViewer.css';
+import "./HeadersViewer.css";
 interface HeadersViewerProps {
     headers: Headers;
 }

package/dist/shared/dev-toolbar/functions/HeadersViewer.jsx

@@ -1,12 +1,12 @@
 import { For } from "solid-js";
 import { PropertySeparator, SerovalValue } from "./SerovalValue.jsx";
-import './HeadersViewer.css';
+import "./HeadersViewer.css";
 import { Text } from "../../ui/Text.jsx";
 export function HeadersViewer(props) {
     return (<div data-start-headers-viewer data-start-properties>
       <For each={Array.from(props.headers.entries())}>
         {([key, value]) => (<div data-start-property>
-            <Text options={{ size: 'xs', weight: 'semibold', wrap: 'nowrap' }}>{key}</Text>
+            <Text options={{ size: "xs", weight: "semibold", wrap: "nowrap" }}>{key}</Text>
             <PropertySeparator />
             <SerovalValue value={value}/>
           </div>)}

package/dist/shared/dev-toolbar/functions/HexViewer.d.ts

@@ -1,5 +1,5 @@
 import { type JSX } from "solid-js";
-import './HexViewer.css';
+import "./HexViewer.css";
 interface HexViewerInnerProps {
     bytes: Uint8Array;
 }

package/dist/shared/dev-toolbar/functions/HexViewer.jsx

@@ -1,8 +1,8 @@
 import { createMemo, createResource, For, Show, Suspense } from "solid-js";
 import { Text } from "../../ui/Text.jsx";
-import './HexViewer.css';
+import "./HexViewer.css";
 function toHex(num, digits = 2) {
-    return num.toString(16).padStart(digits, '0').toUpperCase();
+    return num.toString(16).padStart(digits, "0").toUpperCase();
 }
 function HexChunk(props) {
     const content = createMemo(() => {
@@ -12,7 +12,7 @@ function HexChunk(props) {
         const byte4 = props.bytes[3] || 0;
         return `${toHex(byte1)} ${toHex(byte2)} ${toHex(byte3)} ${toHex(byte4)}`;
     });
-    return (<Text data-start-hex-chunk options={{ size: 'xs', weight: 'bold', wrap: 'nowrap' }}>
+    return (<Text data-start-hex-chunk options={{ size: "xs", weight: "bold", wrap: "nowrap" }}>
       {content()}
     </Text>);
 }
@@ -42,9 +42,7 @@ function HexText(props) {
         return result;
     });
     return (<div data-start-hex-text>
-      <Text options={{ size: 'xs', weight: 'bold', wrap: 'nowrap' }}>
-        {text()}
-      </Text>
+      <Text options={{ size: "xs", weight: "bold", wrap: "nowrap" }}>{text()}</Text>
     </div>);
 }
 export function HexViewerInner(props) {
@@ -57,22 +55,16 @@ export function HexViewerInner(props) {
     });
     return (<div data-start-hex-viewer>
       <div data-start-hex-viewer-bytes>
-        <For each={rows()}>
-          {(current) => <HexRow bytes={current}/>}
-        </For>
+        <For each={rows()}>{current => <HexRow bytes={current}/>}</For>
       </div>
       <div data-start-hex-viewer-text>
-        <For each={rows()}>
-          {(current) => <HexText bytes={current}/>}
-        </For>
+        <For each={rows()}>{current => <HexText bytes={current}/>}</For>
       </div>
     </div>);
 }
 export function HexViewer(props) {
     const [data] = createResource(() => props.bytes);
     return (<Suspense>
-      <Show when={data()}>
-        {(current) => <HexViewerInner bytes={current()}/>}
-      </Show>
+      <Show when={data()}>{current => <HexViewerInner bytes={current()}/>}</Show>
     </Suspense>);
 }

package/dist/shared/dev-toolbar/functions/SerovalValue.css

@@ -1,5 +1,3 @@
-
-
 [data-start-seroval-value] {
   display: flex;
   gap: 0.25rem;

package/dist/shared/dev-toolbar/functions/SerovalValue.d.ts

@@ -1,4 +1,4 @@
-import './SerovalValue.css';
+import "./SerovalValue.css";
 interface SerovalValueProps {
     value: string | number | boolean | undefined | null;
 }

package/dist/shared/dev-toolbar/functions/SerovalValue.jsx

@@ -1,10 +1,10 @@
 import { Text } from "../../ui/Text.jsx";
-import './SerovalValue.css';
+import "./SerovalValue.css";
 export function SerovalValue(props) {
-    return (<Text data-start-seroval-value options={{ size: 'xs', weight: 'semibold', wrap: 'nowrap' }}>
+    return (<Text data-start-seroval-value options={{ size: "xs", weight: "semibold", wrap: "nowrap" }}>
       {`${props.value}`}
     </Text>);
 }
 export function PropertySeparator() {
-    return <Text options={{ size: 'xs', weight: 'semibold', wrap: 'nowrap' }}>:</Text>;
+    return <Text options={{ size: "xs", weight: "semibold", wrap: "nowrap" }}>:</Text>;
 }

package/dist/shared/dev-toolbar/functions/SerovalViewer.css

@@ -68,4 +68,3 @@
   width: 1rem;
   height: 1rem;
 }
-

package/dist/shared/dev-toolbar/functions/URLSearchParamsViewer.d.ts

@@ -1,4 +1,4 @@
-import { type JSX } from 'solid-js';
+import { type JSX } from "solid-js";
 export interface URLSearchParamsViewerProps {
     source: URLSearchParams | Promise<URLSearchParams>;
 }

package/dist/shared/dev-toolbar/functions/URLSearchParamsViewer.jsx

@@ -1,8 +1,8 @@
-import { createResource, For, Show, Suspense } from 'solid-js';
-import { Section } from '../../ui/Section.jsx';
-import { PropertySeparator, SerovalValue } from './SerovalValue.jsx';
+import { createResource, For, Show, Suspense } from "solid-js";
+import { Section } from "../../ui/Section.jsx";
+import { PropertySeparator, SerovalValue } from "./SerovalValue.jsx";
 function URLSearchParamsViewerInner(props) {
-    return (<Section title="URLSearchParams" options={{ size: 'sm' }}>
+    return (<Section title="URLSearchParams" options={{ size: "sm" }}>
       <div data-start-properties>
         <For each={Array.from(props.source.entries())}>
           {([key, value]) => (<div data-start-property>
@@ -17,8 +17,6 @@ function URLSearchParamsViewerInner(props) {
 export function URLSearchParamsViewer(props) {
     const [data] = createResource(() => props.source);
     return (<Suspense>
-      <Show when={data()}>
-        {(current) => <URLSearchParamsViewerInner source={current()}/>}
-      </Show>
+      <Show when={data()}>{current => <URLSearchParamsViewerInner source={current()}/>}</Show>
     </Suspense>);
 }

package/dist/shared/dev-toolbar/functions/styles.css

@@ -101,7 +101,6 @@
 }
 
 [data-start-function-instance-viewer-content] {
-
   height: 100%;
 }
 

package/dist/shared/dev-toolbar/index.jsx

@@ -104,6 +104,11 @@ export function DevToolbar(props) {
     }
     createEffect(() => {
         const onErrorEvent = (error) => {
+            // Browsers dispatch benign ResizeObserver loop notifications as window
+            // "error" events carrying no error object. They aren't app errors.
+            if (!error.error && error.message?.startsWith("ResizeObserver loop")) {
+                return;
+            }
             pushError(error.error ?? error);
         };
         window.addEventListener("error", onErrorEvent);

package/dist/shared/ui/Badge.css

@@ -27,7 +27,6 @@
   --foreground: oklch(47.6% 0.114 61.907);
 }
 
-
 [data-start-badge="info"] {
   --background: oklch(97% 0.014 254.604);
   --foreground: oklch(48.8% 0.243 264.376);

package/dist/shared/ui/Badge.d.ts

@@ -1,7 +1,7 @@
-import type { JSX } from 'solid-js';
-import './Badge.css';
+import type { JSX } from "solid-js";
+import "./Badge.css";
 export interface BadgeProps {
-    type: 'info' | 'success' | 'failure' | 'warning';
+    type: "info" | "success" | "failure" | "warning";
     children: JSX.Element;
 }
 export declare function Badge(props: BadgeProps): JSX.Element;

package/dist/shared/ui/Badge.jsx

@@ -1,7 +1,7 @@
-import './Badge.css';
-import { Text } from './Text.jsx';
+import "./Badge.css";
+import { Text } from "./Text.jsx";
 export function Badge(props) {
-    return (<Text options={{ size: 'xs', wrap: 'nowrap', weight: 'semibold' }} data-start-badge={props.type}>
+    return (<Text options={{ size: "xs", wrap: "nowrap", weight: "semibold" }} data-start-badge={props.type}>
       {props.children}
     </Text>);
 }

package/dist/shared/ui/Button.jsx

@@ -1,4 +1,4 @@
 import { Button as BaseButton } from "terracotta";
 import "./Button.css";
-const Button = (props) => (<BaseButton type="button" data-start-button {...props}/>);
+const Button = props => (<BaseButton type="button" data-start-button {...props}/>);
 export default Button;

package/dist/shared/ui/Cascade.jsx

@@ -1,4 +1,4 @@
-import { Select as BaseSelect, SelectOption as BaseSelectOption, } from "terracotta";
+import { Select as BaseSelect, SelectOption as BaseSelectOption } from "terracotta";
 import "./Cascade.css";
-export const Cascade = (props) => (<BaseSelect data-start-cascade {...props}/>);
-export const CascadeOption = (props) => (<BaseSelectOption data-start-cascade-option {...props}/>);
+export const Cascade = props => <BaseSelect data-start-cascade {...props}/>;
+export const CascadeOption = props => (<BaseSelectOption data-start-cascade-option {...props}/>);

package/dist/shared/ui/Dialog.css

@@ -5,8 +5,7 @@
   overflow-y: auto;
 }
 
-
-[data-start-dialog]>div {
+[data-start-dialog] > div {
   position: relative;
   display: flex;
   align-items: center;

package/dist/shared/ui/Dialog.jsx

@@ -1,5 +1,5 @@
 import { Dialog as BaseDialog, DialogOverlay as BaseDialogOverlay, DialogPanel as BaseDialogPanel, } from "terracotta";
 import "./Dialog.css";
-export const Dialog = (props) => (<BaseDialog data-start-dialog {...props}/>);
-export const DialogOverlay = (props) => (<BaseDialogOverlay data-start-dialog-overlay {...props}/>);
-export const DialogPanel = (props) => (<BaseDialogPanel data-start-dialog-panel {...props}/>);
+export const Dialog = props => <BaseDialog data-start-dialog {...props}/>;
+export const DialogOverlay = props => (<BaseDialogOverlay data-start-dialog-overlay {...props}/>);
+export const DialogPanel = props => (<BaseDialogPanel data-start-dialog-panel {...props}/>);

package/dist/shared/ui/IconButton.jsx

@@ -1,4 +1,4 @@
 import { Button as BaseButton } from "terracotta";
 import "./IconButton.css";
-const IconButton = (props) => (<BaseButton type="button" data-start-icon-button {...props}/>);
+const IconButton = props => (<BaseButton type="button" data-start-icon-button {...props}/>);
 export default IconButton;

package/dist/shared/ui/Placeholder.css

@@ -9,4 +9,4 @@
 
 [data-start-placeholder] > span {
   text-align: center;
-}
+}

package/dist/shared/ui/Placeholder.d.ts

@@ -1,5 +1,5 @@
-import type { JSX } from 'solid-js';
-import './Placeholder.css';
+import type { JSX } from "solid-js";
+import "./Placeholder.css";
 export interface PlaceholderProps {
     children?: JSX.Element;
 }

package/dist/shared/ui/Placeholder.jsx

@@ -1,6 +1,4 @@
-import './Placeholder.css';
+import "./Placeholder.css";
 export default function Placeholder(props) {
-    return (<div data-start-placeholder>
-      {props.children}
-    </div>);
+    return <div data-start-placeholder>{props.children}</div>;
 }

package/dist/shared/ui/Section.css

@@ -7,7 +7,6 @@
   text-transform: uppercase;
 }
 
-
 [data-start-section-content] {
   margin-left: 0.5rem;
   padding-left: 0.5rem;

package/dist/shared/ui/Section.d.ts

@@ -1,9 +1,9 @@
 import type { JSX } from "solid-js";
 import { type TextProps } from "./Text.tsx";
-import './Section.css';
+import "./Section.css";
 export interface SectionProps {
     title: string;
-    options?: TextProps<'span'>['options'];
+    options?: TextProps<"span">["options"];
     children: JSX.Element;
 }
 export declare function Section(props: SectionProps): JSX.Element;

package/dist/shared/ui/Section.jsx

@@ -1,12 +1,10 @@
 import { Text } from "./Text.jsx";
-import './Section.css';
+import "./Section.css";
 export function Section(props) {
     return (<div data-start-section>
-      <Text data-start-section-title options={{ weight: 'bold', font: 'sans', ...props.options }}>
+      <Text data-start-section-title options={{ weight: "bold", font: "sans", ...props.options }}>
         {props.title}
       </Text>
-      <div data-start-section-content>
-        {props.children}
-      </div>
+      <div data-start-section-content>{props.children}</div>
     </div>);
 }

package/dist/shared/ui/Select.jsx

@@ -1,4 +1,4 @@
-import { Select as BaseSelect, SelectOption as BaseSelectOption, } from "terracotta";
+import { Select as BaseSelect, SelectOption as BaseSelectOption } from "terracotta";
 import "./Select.css";
-export const Select = (props) => (<BaseSelect data-start-select {...props}/>);
-export const SelectOption = (props) => (<BaseSelectOption data-start-select-option {...props}/>);
+export const Select = props => <BaseSelect data-start-select {...props}/>;
+export const SelectOption = props => (<BaseSelectOption data-start-select-option {...props}/>);

package/dist/shared/ui/Table.d.ts

@@ -1,11 +1,11 @@
-import type { ComponentProps, JSX } from 'solid-js';
-import './Table.css';
-type TableProps = ComponentProps<'div'>;
+import type { ComponentProps, JSX } from "solid-js";
+import "./Table.css";
+type TableProps = ComponentProps<"div">;
 export declare function Table(props: TableProps): JSX.Element;
-type TableHeaderProps = ComponentProps<'div'>;
+type TableHeaderProps = ComponentProps<"div">;
 export declare function TableHeader(props: TableHeaderProps): JSX.Element;
-type TableRowProps = ComponentProps<'div'>;
+type TableRowProps = ComponentProps<"div">;
 export declare function TableRow(props: TableRowProps): JSX.Element;
-type TableCellProps = ComponentProps<'div'>;
+type TableCellProps = ComponentProps<"div">;
 export declare function TableCell(props: TableCellProps): JSX.Element;
 export {};

package/dist/shared/ui/Table.jsx

@@ -1,13 +1,13 @@
-import './Table.css';
+import "./Table.css";
 export function Table(props) {
-    return (<div data-start-table {...props}/>);
+    return <div data-start-table {...props}/>;
 }
 export function TableHeader(props) {
-    return (<div data-start-table-header {...props}/>);
+    return <div data-start-table-header {...props}/>;
 }
 export function TableRow(props) {
-    return (<div data-start-table-row {...props}/>);
+    return <div data-start-table-row {...props}/>;
 }
 export function TableCell(props) {
-    return (<div data-start-table-cell {...props}/>);
+    return <div data-start-table-cell {...props}/>;
 }

package/dist/shared/ui/Tabs.jsx

@@ -1,6 +1,6 @@
 import { Tab as BaseTab, TabGroup as BaseTabGroup, TabList as BaseTabList, TabPanel as BaseTabPanel, } from "terracotta";
 import "./Tabs.css";
-export const Tab = (props) => (<BaseTab data-start-tab {...props}/>);
-export const TabGroup = (props) => (<BaseTabGroup data-start-tab-group {...props}/>);
-export const TabPanel = (props) => (<BaseTabPanel data-start-tab-panel {...props}/>);
-export const TabList = (props) => (<BaseTabList data-start-tab-list {...props}/>);
+export const Tab = props => <BaseTab data-start-tab {...props}/>;
+export const TabGroup = props => (<BaseTabGroup data-start-tab-group {...props}/>);
+export const TabPanel = props => (<BaseTabPanel data-start-tab-panel {...props}/>);
+export const TabList = props => <BaseTabList data-start-tab-list {...props}/>;