@tempots/ui 0.9.0 → 0.10.0

package/package.json

@@ -1,14 +1,11 @@
 {
   "name": "@tempots/ui",
-  "version": "0.9.0",
+  "version": "0.10.0",
   "type": "module",
   "main": "./index.cjs",
   "module": "./index.js",
   "types": "./index.d.ts",
   "description": "Provides a higher level of renderables to help fast development with Tempo.",
-  "files": [
-    "dist"
-  ],
   "keywords": [
     "tempo",
     "tempots",

package/renderables/anchor.d.ts

@@ -0,0 +1,3 @@
+import { TNode, Value } from '@tempots/dom';
+
+export declare function Anchor(href: Value<string>, ...children: TNode[]): import('@tempots/dom').Renderable;

package/renderables/appearance.d.ts

@@ -0,0 +1,31 @@
+import { Signal, TNode } from '@tempots/dom';
+
+/**
+ * Defines the possible appearance types for the application.
+ * @type AppearanceType
+ */
+export type AppearanceType = 'light' | 'dark';
+/**
+ * A provider mark for a signal representing the current appearance type.
+ */
+export declare const appearanceMarker: import('@tempots/dom').ProviderMark<Signal<AppearanceType>>;
+/**
+ * Provides a child component with an appearance context, which can be used to
+ * determine the current appearance (light or dark) based on the user's system
+ * preferences.
+ *
+ * The appearance context is updated whenever the user's system preferences
+ * change, and the component is cleaned up when it is no longer needed.
+ *
+ * @param child - The child component to be provided with the appearance context.
+ * @returns The child component with the appearance context.
+ */
+export declare const ProvideAppearance: (child: TNode) => TNode;
+/**
+ * Makes the AppearanceType available to the child component by consuming the signal provided by the parent.
+ * The result of the function is returned as the final output.
+ *
+ * @param fn - A function that accepts the `AppearanceType` signal and returns a `TNode` element.
+ * @returns The `TNode` element returned by the provided function.
+ */
+export declare const UseAppearance: (fn: (appearance: Signal<AppearanceType>) => TNode) => TNode;

package/renderables/async-result-view.d.ts

@@ -0,0 +1,9 @@
+import { TNode, Signal, Value } from '@tempots/dom';
+import { AsyncResult } from '@tempots/std/async-result';
+
+export declare function AsyncResultView<T, E>(result: Value<AsyncResult<T, E>>, options: {
+    success: (value: Signal<T>) => TNode;
+    failure?: (error: Signal<E>) => TNode;
+    notAsked?: () => TNode;
+    loading?: (previousValue: Signal<T | undefined>) => TNode;
+} | ((value: Signal<T>) => TNode)): import('@tempots/dom').Renderable;

package/renderables/autofocus.d.ts

@@ -0,0 +1,3 @@
+import { Renderable } from '@tempots/dom';
+
+export declare const AutoFocus: (delay?: number) => Renderable;

package/renderables/autoselect.d.ts

@@ -0,0 +1,3 @@
+import { Renderable } from '@tempots/dom';
+
+export declare const AutoSelect: (delay?: number) => Renderable;

package/renderables/hidden-when-empty.d.ts

@@ -0,0 +1,3 @@
+import { Renderable } from '@tempots/dom';
+
+export declare const HiddenWhenEmpty: Renderable;

package/renderables/html-title.d.ts

@@ -0,0 +1,3 @@
+import { Value } from '@tempots/dom';
+
+export declare const HTMLTitle: (title: Value<string>) => (ctx: import('@tempots/dom').DOMContext) => () => void;

package/renderables/inviewport.d.ts

@@ -0,0 +1,5 @@
+import { Signal, TNode, Renderable } from '@tempots/dom';
+
+export type InViewportMode = 'partial' | 'full';
+export declare function InViewport(mode: InViewportMode, fn: (value: Signal<boolean>) => TNode): Renderable;
+export declare const WhenInViewport: (mode: InViewportMode, then: TNode, otherwise?: TNode) => Renderable;

package/renderables/pop-over.d.ts

@@ -0,0 +1,13 @@
+import { TNode, DOMContext, Value } from '@tempots/dom';
+
+export type Placement = 'top' | 'top-start' | 'top-end' | 'right' | 'right-start' | 'right-end' | 'bottom' | 'bottom-start' | 'bottom-end' | 'left' | 'left-start' | 'left-end';
+export interface PopOverProps {
+    open: Value<boolean>;
+    content: () => TNode;
+    placement?: Placement;
+    offset?: {
+        mainAxis?: number;
+        crossAxis?: number;
+    };
+}
+export declare function PopOver({ content, open, placement, offset: { mainAxis, crossAxis }, }: PopOverProps): (ctx: DOMContext) => import('@tempots/dom').Clear;

package/renderables/result-view.d.ts

@@ -0,0 +1,7 @@
+import { TNode, Signal, Value } from '@tempots/dom';
+import { Result } from '@tempots/std/result';
+
+export declare function ResultView<T, E>(result: Value<Result<T, E>>, options: {
+    success: (value: Signal<T>) => TNode;
+    failure?: (error: Signal<E>) => TNode;
+} | ((value: Signal<T>) => TNode)): import('@tempots/dom').Renderable;

package/renderables/router/location.d.ts

@@ -0,0 +1,15 @@
+import { TNode, Prop } from '@tempots/dom';
+
+export interface Location {
+    pathname: string;
+    search: Record<string, string>;
+    hash?: string;
+}
+export declare const LocationProviderMarker: import('@tempots/dom').ProviderMark<Prop<Location>>;
+export declare function makeLocation(): Location;
+export declare function equalsLocation(a: Location, b: Location): boolean;
+export declare function locationFromURL(url: string): Location;
+export declare function setLocationFromUrl(prop: Prop<Location>, url: string): Prop<Location>;
+export declare function makeLocationProp(): Prop<Location>;
+export declare function ProvideLocation(child: TNode): import('@tempots/dom').Renderable;
+export declare function UseLocation(fn: (location: Prop<Location>) => TNode): import('@tempots/dom').Renderable;

package/renderables/router/match.d.ts

@@ -0,0 +1,14 @@
+import { ExtractParams, Route } from './route-info';
+
+export type MatchResult<P extends string> = {
+    params: ExtractParams<P>;
+    path: P;
+} | null;
+export type MatchResultWithRoute<P extends string, R extends string> = {
+    params: ExtractParams<P>;
+    route: R;
+    path: P;
+} | null;
+export declare function matchesRoute<P extends string>(route: Route, path: P): MatchResult<P>;
+export declare function parseRouteSegments(route: string): Route;
+export declare function makeRouteMatcher<Routes extends string[]>(routes: Routes): <S extends string>(path: S) => MatchResultWithRoute<S, Routes[number]>;

package/renderables/router/route-info.d.ts

@@ -0,0 +1,27 @@
+import { SplitLiteral, TupleToUnion } from '@tempots/std/domain';
+
+export interface RouteInfo<P, R = string> {
+    params: P;
+    route: R;
+    path: string;
+    search: Record<string, string>;
+    hash?: string;
+}
+export type RouteParam = {
+    type: 'param';
+    name: string;
+};
+export type RouteLiteral = {
+    type: 'literal';
+    value: string;
+};
+export type RouteCatchAll = {
+    type: 'catch-all';
+};
+export type RouteSegment = RouteParam | RouteLiteral | RouteCatchAll;
+export type Route = RouteSegment[];
+export type MakeParams<P> = P extends string[] ? {
+    [K in TupleToUnion<P>]: string;
+} : never;
+export type ExtractParamsFromTuple<S extends unknown[]> = S extends [] ? [] : S extends [infer H, ...infer R] ? H extends `:${infer P}` ? [P, ...ExtractParamsFromTuple<R>] : ExtractParamsFromTuple<R> : never;
+export type ExtractParams<S extends string> = SplitLiteral<S, '/'> extends infer T ? T extends unknown[] ? ExtractParamsFromTuple<T> : never : never;

package/renderables/router/router.d.ts

@@ -0,0 +1,6 @@
+import { TNode, Renderable, Signal } from '@tempots/dom';
+import { ExtractParams, MakeParams, RouteInfo } from './route-info';
+
+export declare function Router<T extends {
+    [K in keyof T]: (info: K extends string ? Signal<RouteInfo<MakeParams<ExtractParams<K>>, K>> : never) => TNode;
+}>(routes: T): Renderable;

package/renderables/select-on-focus.d.ts

@@ -0,0 +1 @@
+export declare function SelectOnFocus(): import('@tempots/dom').Renderable;

package/renderables/size.d.ts

@@ -0,0 +1,6 @@
+import { DOMContext, Signal, TNode, Size } from '@tempots/dom';
+
+export declare const size: {
+    element: (fn: (size: Signal<Size>) => TNode) => (ctx: DOMContext) => (removeTree: boolean) => void;
+    window: (fn: (size: Signal<Size>) => TNode) => (ctx: DOMContext) => (removeTree: boolean) => void;
+};