@prestack/thread-ui 0.1.1 → 0.1.2

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',

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

@@ -1,115 +1,115 @@
 export declare const BUTTON_CTA: {
-    readonly id: "button-cta";
-    readonly type: "body";
-    readonly icon: "md";
+    readonly id: 'button-cta';
+    readonly type: 'body';
+    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-lg";
+        readonly property: 'height';
+        readonly is: 'control-lg';
     }, {
-        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-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: "borderWidth";
-        readonly is: "edge-hair";
+        readonly property: 'borderWidth';
+        readonly is: 'edge-hair';
     }, {
-        readonly property: "borderStyle";
-        readonly is: "line-off";
+        readonly property: 'borderStyle';
+        readonly is: 'line-off';
     }, {
-        readonly property: "borderColor";
-        readonly is: "colour-clear";
+        readonly property: 'borderColor';
+        readonly is: 'colour-clear';
     }, {
-        readonly property: "boxShadow";
-        readonly is: "shadow-2";
+        readonly property: 'boxShadow';
+        readonly is: 'shadow-2';
     }];
     readonly states: readonly [{
         readonly when: readonly ["hover"];
         readonly sets: readonly [{
-            readonly property: "background";
-            readonly is: "colour-accent-hover";
+            readonly property: 'background';
+            readonly is: 'colour-accent-hover';
         }, {
-            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-accent-press";
+            readonly property: 'background';
+            readonly is: 'colour-accent-press';
         }, {
-            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-accent-press";
+            readonly property: 'background';
+            readonly is: 'colour-accent-press';
         }, {
-            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: "background";
-            readonly is: "colour-sunken";
+            readonly property: 'background';
+            readonly is: 'colour-sunken';
         }, {
-            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-sunken";
+            readonly property: 'background';
+            readonly is: 'colour-sunken';
         }, {
-            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-cta.js

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