@prestack/thread-ui 0.1.1 → 0.1.3

package/dist/ui/presented.js

@@ -1,11 +1,11 @@
 'use client';
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useEffect, useId, useRef, useState } from 'react';
 import { createPortal } from 'react-dom';
-import { PRESENTATION_BEHAVIOUR } from "./door.js";
-import { useDismissLayer } from "./dismiss-layer.js";
-import { useFocusScope } from "./focus-scope.js";
-import { lockScroll } from "./scroll-lock.js";
+import { PRESENTATION_BEHAVIOUR } from './door.js';
+import { useDismissLayer } from './dismiss-layer.js';
+import { useFocusScope } from './focus-scope.js';
+import { lockScroll } from './scroll-lock.js';
 export function Presented(props) {
     const behaviour = PRESENTATION_BEHAVIOUR[props.presentation];
     const open = props.open ?? true;

package/dist/ui/provider.d.ts

@@ -1,4 +1,5 @@
 import { type ReactNode } from 'react';
+import { type CollectorOptions } from './collector.ts';
 import { type UiConfig } from './wrappers.tsx';
 export interface ThreadUiProps {
     readonly children: ReactNode;
@@ -25,6 +26,8 @@ export interface ThreadUiProps {
         readonly endpoint?: string;
         readonly allowed: () => boolean;
         readonly sample?: number;
+        readonly beacon?: CollectorOptions['beacon'];
+        readonly fetch?: CollectorOptions['fetch'];
     };
     readonly dispatch?: (name: string, input?: Readonly<Record<string, unknown>>) => Promise<unknown>;
     readonly navigateTo?: (screen: string) => void;

package/dist/ui/provider.js

@@ -1,12 +1,12 @@
 'use client';
 import { jsx as _jsx } from "react/jsx-runtime";
 import { useCallback, useContext, useEffect, useMemo, useSyncExternalStore } from 'react';
-import { en } from "./i18n/catalogs/en.js";
-import { createTranslator } from "./i18n/translator.js";
-import { EDGE_SCROLL_DEFAULTS } from "./drag.js";
-import { createCollector, INERT_COLLECTOR } from "./collector.js";
-import { Clock, Ticker } from "./door.js";
-import { UiContext, UiProvider } from "./wrappers.js";
+import { en } from './i18n/catalogs/en.js';
+import { createTranslator } from './i18n/translator.js';
+import { EDGE_SCROLL_DEFAULTS } from './drag.js';
+import { createCollector, INERT_COLLECTOR } from './collector.js';
+import { Clock, Ticker } from './door.js';
+import { UiContext, UiProvider } from './wrappers.js';
 function useMedia(query, fallback) {
     const subscribe = useCallback((onChange) => {
         if (typeof globalThis.matchMedia !== 'function')
@@ -77,11 +77,10 @@ export function ThreadUi(props) {
             endpoint: props.telemetry.endpoint ?? '/obs/client',
             allowed: props.telemetry.allowed,
             ...(props.telemetry.sample === undefined ? {} : { sample: props.telemetry.sample }),
-            ...(typeof navigator === 'object' && typeof navigator.sendBeacon === 'function'
-                ? { beacon: (url, body) => navigator.sendBeacon(url, new Blob([body], { type: 'application/json' })) }
-                : {}),
+            ...(props.telemetry.beacon === undefined ? {} : { beacon: props.telemetry.beacon }),
+            ...(props.telemetry.fetch === undefined ? {} : { fetch: props.telemetry.fetch }),
         });
-    }, [telemetryOff, props.telemetry?.endpoint, props.telemetry?.sample, props.telemetry?.allowed]);
+    }, [telemetryOff, props.telemetry?.endpoint, props.telemetry?.sample, props.telemetry?.allowed, props.telemetry?.beacon, props.telemetry?.fetch]);
     useEffect(() => () => collector.stop(), [collector]);
     const gate = props.permits;
     const asked = props.asking;

package/dist/ui/provider.tsx

@@ -6,7 +6,7 @@ import { en } from './i18n/catalogs/en.ts'
 import { createTranslator } from './i18n/translator.ts'
 import { EDGE_SCROLL_DEFAULTS } from './drag.ts'
 
-import { createCollector, INERT_COLLECTOR } from './collector.ts'
+import { createCollector, INERT_COLLECTOR, type CollectorOptions } from './collector.ts'
 import { Clock, Ticker } from './door.ts'
 import { UiContext, UiProvider, type Appearance, type UiConfig } from './wrappers.tsx'
 
@@ -34,6 +34,9 @@ export interface ThreadUiProps {
     readonly allowed: () => boolean
 
     readonly sample?: number
+
+    readonly beacon?: CollectorOptions['beacon']
+    readonly fetch?: CollectorOptions['fetch']
   }
 
   readonly dispatch?: (name: string, input?: Readonly<Record<string, unknown>>) => Promise<unknown>
@@ -133,12 +136,11 @@ export function ThreadUi(props: ThreadUiProps): ReactNode {
       endpoint: props.telemetry.endpoint ?? '/obs/client',
       allowed: props.telemetry.allowed,
       ...(props.telemetry.sample === undefined ? {} : { sample: props.telemetry.sample }),
-      ...(typeof navigator === 'object' && typeof navigator.sendBeacon === 'function'
-        ? { beacon: (url: string, body: string) => navigator.sendBeacon(url, new Blob([body], { type: 'application/json' })) }
-        : {}),
+      ...(props.telemetry.beacon === undefined ? {} : { beacon: props.telemetry.beacon }),
+      ...(props.telemetry.fetch === undefined ? {} : { fetch: props.telemetry.fetch }),
     })
 
-  }, [telemetryOff, props.telemetry?.endpoint, props.telemetry?.sample, props.telemetry?.allowed])
+  }, [telemetryOff, props.telemetry?.endpoint, props.telemetry?.sample, props.telemetry?.allowed, props.telemetry?.beacon, props.telemetry?.fetch])
 
   useEffect(() => () => collector.stop(), [collector])
 

package/dist/ui/screens.js

@@ -1,11 +1,11 @@
-import { existsSync, readFileSync, writeFileSync } from "@prestack/thread/core/files";
+import { existsSync, readFileSync, writeFileSync } from '@prestack/thread/integrations/disk';
 import { basename, join } from 'node:path';
 import { argv, stdout } from 'node:process';
-import { exit, invoked } from "@prestack/thread/core/invoked";
-import { valuesIn } from "@prestack/thread/core/rows";
-import { findTree, inTree } from "@prestack/thread/core/tree";
-import { HOME, settled, undeclared } from "./compositions.js";
-import { PRESENTATIONS } from "./door.js";
+import { exit, invoked } from '@prestack/thread/core/invoked';
+import { valuesIn } from '@prestack/thread/core/rows';
+import { findTree, inTree } from '@prestack/thread/core/tree';
+import { HOME, settled, undeclared } from './compositions.js';
+import { PRESENTATIONS } from './door.js';
 const here = 'thread/ui/screens.ts';
 const said = [
     {

package/dist/ui/screens.ts

@@ -1,4 +1,4 @@
-import { existsSync, readFileSync, writeFileSync } from '@prestack/thread/core/files'
+import { existsSync, readFileSync, writeFileSync } from '@prestack/thread/integrations/disk'
 import { basename, dirname, join } from 'node:path'
 import { argv, stdout } from 'node:process'
 

package/dist/ui/scroll-lock.js

@@ -1,4 +1,4 @@
-import { nameOf } from "./token.js";
+import { nameOf } from './token.js';
 let held = 0;
 let previous = null;
 export function lockScroll() {

package/dist/ui/series.js

@@ -1,4 +1,4 @@
-import { contrast, CONTRAST_LARGE } from "./contrast.js";
+import { contrast, CONTRAST_LARGE } from './contrast.js';
 const GOLDEN_ANGLE = 137.508;
 const toLinear = (c) => (c <= 0.04045 ? c / 12.92 : ((c + 0.055) / 1.055) ** 2.4);
 const toSrgb = (c) => (c <= 0.0031308 ? 12.92 * c : 1.055 * c ** (1 / 2.4) - 0.055);

package/dist/ui/styleguide.js

@@ -1,4 +1,4 @@
-import { held, sheeted } from "./token.js";
+import { held, sheeted } from './token.js';
 export function themedBy(theme) {
     return `:root[data-theme="${theme}"]`;
 }

package/dist/ui/tokens.d.ts

@@ -80,9 +80,9 @@ export declare const declares: readonly [Threaded & {
     readonly id: "shadow";
 }];
 export declare const TOKENS: {
-    readonly id: "token";
+    readonly id: 'token';
     readonly at: "thread/ui/tokens.ts";
-    readonly describes: "A sort of variable an app may have, named and never valued — colour, space, shadow. It says such a variable can exist; the style guide says which ones there are and what each holds. Where the thing is better stated as a rule than as a list, the token carries that rule and a style guide row hands it arguments instead of a value. An app adds one to bring a new sort of variable into being, and may not remove what the framework put there.";
+    readonly describes: 'A sort of variable an app may have, named and never valued — colour, space, shadow. It says such a variable can exist; the style guide says which ones there are and what each holds. Where the thing is better stated as a rule than as a list, the token carries that rule and a style guide row hands it arguments instead of a value. An app adds one to bring a new sort of variable into being, and may not remove what the framework put there.';
     readonly version: 1;
     readonly cites: {
         on: string;

package/dist/ui/tokens.js

@@ -6,12 +6,12 @@ var __rewriteRelativeImportExtension = (this && this.__rewriteRelativeImportExte
     }
     return path;
 };
-import { existsSync, readdirSync, writeFileSync } from "@prestack/thread/core/files";
+import { existsSync, readdirSync, writeFileSync } from '@prestack/thread/integrations/disk';
 import { basename, dirname, join } from 'node:path';
 import { argv, stdout } from 'node:process';
 import { pathToFileURL } from 'node:url';
-import { exit, invoked } from "@prestack/thread/core/invoked";
-import { findTree, inTree } from "@prestack/thread/core/tree";
+import { exit, invoked } from '@prestack/thread/core/invoked';
+import { findTree, inTree } from '@prestack/thread/core/tree';
 const here = 'thread/ui/tokens.ts';
 const said = [
     {

package/dist/ui/tokens.ts

@@ -1,4 +1,4 @@
-import { existsSync, readdirSync, writeFileSync } from '@prestack/thread/core/files'
+import { existsSync, readdirSync, writeFileSync } from '@prestack/thread/integrations/disk'
 import { basename, dirname, join } from 'node:path'
 import { argv, stdout } from 'node:process'
 import { pathToFileURL } from 'node:url'

package/dist/ui/validators.js

@@ -1,4 +1,4 @@
-import { ENTRY_MODES, FORMATS, KEYBOARDS, formatNamed, showValue, } from "@prestack/thread/core/types";
+import { ENTRY_MODES, FORMATS, KEYBOARDS, formatNamed, showValue, } from '@prestack/thread/core/types';
 export { ENTRY_MODES, KEYBOARDS };
 export const valid = (value) => ({ ok: true, value });
 export const invalid = (errorKey) => ({ ok: false, errorKey });

package/dist/ui/variant.d.ts

@@ -12,42 +12,42 @@ interface Stateful {
 type SignalId = (typeof holds)[number]['id'] | (string & {});
 type MaterialId = (typeof MATERIALS)['declares'][number]['id'] | (string & {});
 declare const BOUND: {
-    readonly background: readonly ["colour", "gradient", "texture", "noise", "img"];
-    readonly borderColor: readonly ["colour"];
-    readonly color: readonly ["colour"];
-    readonly borderRadius: readonly ["radius"];
-    readonly borderWidth: readonly ["edge"];
-    readonly borderStyle: readonly ["line"];
-    readonly boxShadow: readonly ["shadow"];
-    readonly cursor: readonly ["cursor"];
-    readonly gap: readonly ["space"];
-    readonly padding: readonly ["space"];
-    readonly outlineOffset: readonly ["space"];
-    readonly minHeight: readonly ["control", "space"];
-    readonly minWidth: readonly ["space"];
-    readonly maxWidth: readonly ["space"];
-    readonly opacity: readonly ["opacity"];
-    readonly transform: readonly ["transform"];
-    readonly animation: readonly ["animation"];
-    readonly width: readonly ["icon"];
-    readonly height: readonly ["control", "icon"];
-    readonly display: readonly ["layout"];
-    readonly flexDirection: readonly ["flow"];
-    readonly alignItems: readonly ["align"];
-    readonly justifyContent: readonly ["align"];
-    readonly flexWrap: readonly ["wrap"];
-    readonly position: readonly ["position"];
-    readonly visibility: readonly ["visibility"];
-    readonly pointerEvents: readonly ["reach"];
-    readonly userSelect: readonly ["picking"];
-    readonly touchAction: readonly ["touch"];
-    readonly willChange: readonly ["readying"];
-    readonly transformOrigin: readonly ["origin"];
-    readonly overflow: readonly ["overflow"];
-    readonly zIndex: readonly ["layer"];
-    readonly top: readonly ["space"];
-    readonly left: readonly ["space"];
-    readonly aspectRatio: readonly ["ratio"];
+    readonly background: readonly ['colour', 'gradient', 'texture', 'noise', 'img'];
+    readonly borderColor: readonly ['colour'];
+    readonly color: readonly ['colour'];
+    readonly borderRadius: readonly ['radius'];
+    readonly borderWidth: readonly ['edge'];
+    readonly borderStyle: readonly ['line'];
+    readonly boxShadow: readonly ['shadow'];
+    readonly cursor: readonly ['cursor'];
+    readonly gap: readonly ['space'];
+    readonly padding: readonly ['space'];
+    readonly outlineOffset: readonly ['space'];
+    readonly minHeight: readonly ['control', 'space'];
+    readonly minWidth: readonly ['space'];
+    readonly maxWidth: readonly ['space'];
+    readonly opacity: readonly ['opacity'];
+    readonly transform: readonly ['transform'];
+    readonly animation: readonly ['animation'];
+    readonly width: readonly ['icon'];
+    readonly height: readonly ['control', 'icon'];
+    readonly display: readonly ['layout'];
+    readonly flexDirection: readonly ['flow'];
+    readonly alignItems: readonly ['align'];
+    readonly justifyContent: readonly ['align'];
+    readonly flexWrap: readonly ['wrap'];
+    readonly position: readonly ['position'];
+    readonly visibility: readonly ['visibility'];
+    readonly pointerEvents: readonly ['reach'];
+    readonly userSelect: readonly ['picking'];
+    readonly touchAction: readonly ['touch'];
+    readonly willChange: readonly ['readying'];
+    readonly transformOrigin: readonly ['origin'];
+    readonly overflow: readonly ['overflow'];
+    readonly zIndex: readonly ['layer'];
+    readonly top: readonly ['space'];
+    readonly left: readonly ['space'];
+    readonly aspectRatio: readonly ['ratio'];
 };
 type Property = keyof typeof BOUND;
 type BoundSettingFor<P extends Property> = {
@@ -88,7 +88,7 @@ export declare function freeHeld(): readonly string[];
 export declare const structural: Set<string>;
 export declare function looking(made: Readonly<Record<string, string>>): boolean;
 export declare const variant: <const T extends Variant>(one: T & {
-    readonly sets: { readonly [I in keyof T["sets"]]: T["sets"][I] extends {
+    readonly sets: { readonly [I in keyof T['sets']]: T['sets'][I] extends {
         readonly is: infer Said;
     } ? {
         readonly is: Wearing<Said & string>;

package/dist/ui/variant.js

@@ -1,5 +1,5 @@
-import { BOUND as MATERIAL_BOUND, compose, composed, FREE } from "./material.js";
-import { coexist, isSignal, selectorOf, signalNames } from "./signals.js";
+import { BOUND as MATERIAL_BOUND, compose, composed, FREE } from './material.js';
+import { coexist, isSignal, selectorOf, signalNames } from './signals.js';
 const BOUND = {
     background: ['colour', 'gradient', 'texture', 'noise', 'img'],
     borderColor: ['colour'],

package/dist/ui/variants/var_avatar-round.d.ts

@@ -1,23 +1,23 @@
 export declare const AVATAR_ROUND: {
-    readonly id: "avatar-round";
+    readonly id: 'avatar-round';
     readonly sets: readonly [{
-        readonly property: "width";
-        readonly is: "icon-lg";
+        readonly property: 'width';
+        readonly is: 'icon-lg';
     }, {
-        readonly property: "height";
-        readonly is: "icon-lg";
+        readonly property: 'height';
+        readonly is: 'icon-lg';
     }, {
-        readonly property: "borderRadius";
-        readonly is: "radius-pill";
+        readonly property: 'borderRadius';
+        readonly is: 'radius-pill';
     }, {
-        readonly property: "background";
-        readonly is: "colour-sunken";
+        readonly property: 'background';
+        readonly is: 'colour-sunken';
     }, {
-        readonly property: "display";
-        readonly is: "layout-flex";
+        readonly property: 'display';
+        readonly is: 'layout-flex';
     }, {
-        readonly property: "alignItems";
-        readonly is: "align-centre";
+        readonly property: 'alignItems';
+        readonly is: 'align-centre';
     }];
     readonly reacts: readonly [];
 };

package/dist/ui/variants/var_avatar-round.js

@@ -1,4 +1,4 @@
-import { variant } from "../variant.js";
+import { variant } from '../variant.js';
 export const AVATAR_ROUND = variant({
     id: 'avatar-round',
     sets: [

package/dist/ui/variants/var_bubble-me.d.ts

@@ -1,21 +1,21 @@
 export declare const BUBBLE_ME: {
-    readonly id: "bubble-me";
-    readonly material: "flat";
+    readonly id: 'bubble-me';
+    readonly material: 'flat';
     readonly sets: readonly [{
-        readonly property: "background";
-        readonly is: "colour-accent";
+        readonly property: 'background';
+        readonly is: 'colour-accent';
     }, {
-        readonly property: "color";
-        readonly is: "colour-on-accent";
+        readonly property: 'color';
+        readonly is: 'colour-on-accent';
     }, {
-        readonly property: "borderRadius";
-        readonly is: "radius-lg";
+        readonly property: 'borderRadius';
+        readonly is: 'radius-lg';
     }, {
-        readonly property: "padding";
-        readonly is: "space-3 space-4";
+        readonly property: 'padding';
+        readonly is: 'space-3 space-4';
     }, {
-        readonly property: "gap";
-        readonly is: "space-2";
+        readonly property: 'gap';
+        readonly is: 'space-2';
     }];
     readonly reacts: readonly ["focus", "hover"];
 };

package/dist/ui/variants/var_bubble-me.js

@@ -1,4 +1,4 @@
-import { variant } from "../variant.js";
+import { variant } from '../variant.js';
 export const BUBBLE_ME = variant({
     id: 'bubble-me',
     material: 'flat',

package/dist/ui/variants/var_bubble-them.d.ts

@@ -1,18 +1,18 @@
 export declare const BUBBLE_THEM: {
-    readonly id: "bubble-them";
-    readonly material: "flat";
+    readonly id: 'bubble-them';
+    readonly material: 'flat';
     readonly sets: readonly [{
-        readonly property: "color";
-        readonly is: "colour-ink";
+        readonly property: 'color';
+        readonly is: 'colour-ink';
     }, {
-        readonly property: "borderRadius";
-        readonly is: "radius-lg";
+        readonly property: 'borderRadius';
+        readonly is: 'radius-lg';
     }, {
-        readonly property: "padding";
-        readonly is: "space-3 space-4";
+        readonly property: 'padding';
+        readonly is: 'space-3 space-4';
     }, {
-        readonly property: "gap";
-        readonly is: "space-2";
+        readonly property: 'gap';
+        readonly is: 'space-2';
     }];
     readonly reacts: readonly ["focus", "hover"];
 };

package/dist/ui/variants/var_bubble-them.js

@@ -1,4 +1,4 @@
-import { variant } from "../variant.js";
+import { variant } from '../variant.js';
 export const BUBBLE_THEM = variant({
     id: 'bubble-them',
     material: 'flat',

package/dist/ui/variants/var_button-border.d.ts

@@ -1,115 +1,115 @@
 export declare const BUTTON_BORDER: {
-    readonly id: "button-border";
-    readonly type: "label";
-    readonly icon: "md";
+    readonly id: 'button-border';
+    readonly type: 'label';
+    readonly icon: 'md';
     readonly sets: readonly [{
-        readonly property: "display";
-        readonly is: "layout-flex";
+        readonly property: 'display';
+        readonly is: 'layout-flex';
     }, {
-        readonly property: "alignItems";
-        readonly is: "align-centre";
+        readonly property: 'alignItems';
+        readonly is: 'align-centre';
     }, {
-        readonly property: "justifyContent";
-        readonly is: "align-centre";
+        readonly property: 'justifyContent';
+        readonly is: 'align-centre';
     }, {
-        readonly property: "borderRadius";
-        readonly is: "control-radius";
+        readonly property: 'borderRadius';
+        readonly is: 'control-radius';
     }, {
-        readonly property: "height";
-        readonly is: "control-md";
+        readonly property: 'height';
+        readonly is: 'control-md';
     }, {
-        readonly property: "padding";
-        readonly is: "control-pad-y control-pad-x";
+        readonly property: 'padding';
+        readonly is: 'control-pad-y control-pad-x';
     }, {
-        readonly property: "gap";
-        readonly is: "control-gap";
+        readonly property: 'gap';
+        readonly is: 'control-gap';
     }, {
-        readonly property: "cursor";
-        readonly is: "cursor-press";
+        readonly property: 'cursor';
+        readonly is: 'cursor-press';
     }, {
-        readonly property: "transition";
-        readonly is: "motion-quick ease-out";
+        readonly property: 'transition';
+        readonly is: 'motion-quick ease-out';
     }, {
-        readonly property: "background";
-        readonly is: "colour-clear";
+        readonly property: 'background';
+        readonly is: 'colour-clear';
     }, {
-        readonly property: "color";
-        readonly is: "colour-accent";
+        readonly property: 'color';
+        readonly is: 'colour-accent';
     }, {
-        readonly property: "borderWidth";
-        readonly is: "control-edge";
+        readonly property: 'borderWidth';
+        readonly is: 'control-edge';
     }, {
-        readonly property: "borderStyle";
-        readonly is: "line-solid";
+        readonly property: 'borderStyle';
+        readonly is: 'line-solid';
     }, {
-        readonly property: "borderColor";
-        readonly is: "colour-accent";
+        readonly property: 'borderColor';
+        readonly is: 'colour-accent';
     }, {
-        readonly property: "boxShadow";
-        readonly is: "shadow-0";
+        readonly property: 'boxShadow';
+        readonly is: 'shadow-0';
     }];
     readonly states: readonly [{
         readonly when: readonly ["hover"];
         readonly sets: readonly [{
-            readonly property: "background";
-            readonly is: "colour-surface-lit";
+            readonly property: 'background';
+            readonly is: 'colour-surface-lit';
         }, {
-            readonly property: "transform";
-            readonly is: "transform-lift";
+            readonly property: 'transform';
+            readonly is: 'transform-lift';
         }];
     }, {
         readonly when: readonly ["active"];
         readonly sets: readonly [{
-            readonly property: "background";
-            readonly is: "colour-surface-lit";
+            readonly property: 'background';
+            readonly is: 'colour-surface-lit';
         }, {
-            readonly property: "transform";
-            readonly is: "transform-press";
+            readonly property: 'transform';
+            readonly is: 'transform-press';
         }];
     }, {
         readonly when: readonly ["active", "hover"];
         readonly sets: readonly [{
-            readonly property: "background";
-            readonly is: "colour-surface-lit";
+            readonly property: 'background';
+            readonly is: 'colour-surface-lit';
         }, {
-            readonly property: "transform";
-            readonly is: "transform-press";
+            readonly property: 'transform';
+            readonly is: 'transform-press';
         }];
     }, {
         readonly when: readonly ["focus"];
         readonly sets: readonly [{
-            readonly property: "outline";
-            readonly is: "control-ring line-solid colour-accent";
+            readonly property: 'outline';
+            readonly is: 'control-ring line-solid colour-accent';
         }, {
-            readonly property: "outlineOffset";
-            readonly is: "control-ring-offset";
+            readonly property: 'outlineOffset';
+            readonly is: 'control-ring-offset';
         }];
     }, {
         readonly when: readonly ["loading"];
         readonly sets: readonly [{
-            readonly property: "opacity";
-            readonly is: "opacity-muted";
+            readonly property: 'opacity';
+            readonly is: 'opacity-muted';
         }];
     }, {
         readonly when: readonly ["disabled"];
         readonly sets: readonly [{
-            readonly property: "cursor";
-            readonly is: "cursor-refuse";
+            readonly property: 'cursor';
+            readonly is: 'cursor-refuse';
         }, {
-            readonly property: "borderColor";
-            readonly is: "colour-edge";
+            readonly property: 'borderColor';
+            readonly is: 'colour-edge';
         }, {
-            readonly property: "color";
-            readonly is: "colour-ink-faint";
+            readonly property: 'color';
+            readonly is: 'colour-ink-faint';
         }];
     }, {
         readonly when: readonly ["disabled", "hover"];
         readonly sets: readonly [{
-            readonly property: "background";
-            readonly is: "colour-clear";
+            readonly property: 'background';
+            readonly is: 'colour-clear';
         }, {
-            readonly property: "transform";
-            readonly is: "transform-rest";
+            readonly property: 'transform';
+            readonly is: 'transform-rest';
         }];
     }];
     readonly reacts: readonly ["active", "disabled", "focus", "hover", "loading"];

package/dist/ui/variants/var_button-border.js

@@ -1,4 +1,4 @@
-import { variant } from "../variant.js";
+import { variant } from '../variant.js';
 export const BUTTON_BORDER = variant({
     id: 'button-border',
     type: 'label',