@bysages/solid 0.2.3 → 0.3.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +16 -2
- package/dist/{ai-response-B_586r27.mjs → ai-response-ClGGptX3.mjs} +15 -15
- package/dist/chevron-D5RzcayK.mjs +9 -0
- package/dist/components/affix/index.mjs +15 -17
- package/dist/components/ai/index.d.mts +1 -1
- package/dist/components/ai/index.mjs +12 -10
- package/dist/components/ai-action/index.mjs +2 -2
- package/dist/components/ai-attachments/index.mjs +50 -38
- package/dist/components/ai-message/index.mjs +11 -13
- package/dist/components/ai-prompt-input/index.mjs +70 -53
- package/dist/components/ai-reasoning/index.mjs +10 -6
- package/dist/components/ai-response/index.mjs +1 -1
- package/dist/components/ai-source/index.mjs +23 -23
- package/dist/components/ai-suggestion/index.mjs +1 -1
- package/dist/components/ai-tool/index.mjs +29 -17
- package/dist/components/alert/index.mjs +37 -42
- package/dist/components/angle-slider/index.mjs +2 -2
- package/dist/components/aspect-ratio/index.mjs +14 -16
- package/dist/components/autocomplete/index.mjs +3 -2
- package/dist/components/avatar/index.d.mts +3 -0
- package/dist/components/avatar/index.mjs +10 -5
- package/dist/components/avatar-group/index.mjs +11 -13
- package/dist/components/back-top/index.mjs +31 -27
- package/dist/components/badge/index.mjs +14 -16
- package/dist/components/banner/index.mjs +24 -28
- package/dist/components/bento/index.d.mts +24 -0
- package/dist/components/bento/index.mjs +51 -0
- package/dist/components/block-ui/index.d.mts +12 -0
- package/dist/components/block-ui/index.mjs +43 -0
- package/dist/components/breadcrumb/index.mjs +7 -5
- package/dist/components/browser/index.d.mts +21 -0
- package/dist/components/browser/index.mjs +87 -0
- package/dist/components/button/index.mjs +27 -29
- package/dist/components/button-group/index.mjs +18 -20
- package/dist/components/calendar/index.mjs +141 -129
- package/dist/components/card/index.mjs +2 -2
- package/dist/components/cascade-select/index.mjs +160 -121
- package/dist/components/checkbox/index.mjs +2 -2
- package/dist/components/checkbox-group/index.mjs +53 -55
- package/dist/components/chip/index.mjs +22 -20
- package/dist/components/clipboard/index.mjs +2 -2
- package/dist/components/color-picker/index.mjs +2 -2
- package/dist/components/combobox/index.mjs +2 -2
- package/dist/components/command/index.mjs +73 -57
- package/dist/components/comment/index.mjs +77 -62
- package/dist/components/config-provider/index.mjs +10 -8
- package/dist/components/container/index.mjs +14 -16
- package/dist/components/data-view/index.d.mts +18 -0
- package/dist/components/data-view/index.mjs +110 -0
- package/dist/components/date-input/index.mjs +2 -2
- package/dist/components/date-picker/index.mjs +2 -2
- package/dist/components/deferred-content/index.d.mts +16 -0
- package/dist/components/deferred-content/index.mjs +52 -0
- package/dist/components/descriptions/index.d.mts +9 -1
- package/dist/components/descriptions/index.mjs +43 -16
- package/dist/components/dock/index.d.mts +22 -0
- package/dist/components/dock/index.mjs +64 -0
- package/dist/components/dynamic-input/index.mjs +71 -68
- package/dist/components/editable/index.mjs +2 -2
- package/dist/components/ellipsis/index.mjs +17 -19
- package/dist/components/empty/index.mjs +2 -2
- package/dist/components/file-upload/index.mjs +2 -2
- package/dist/components/float-button/index.mjs +39 -38
- package/dist/components/form/index.d.mts +1 -1
- package/dist/components/form/index.mjs +52 -37
- package/dist/components/grid/index.mjs +19 -21
- package/dist/components/icon/index.d.mts +9 -4
- package/dist/components/icon/index.mjs +37 -36
- package/dist/components/image/index.mjs +44 -43
- package/dist/components/image-viewer/index.mjs +46 -37
- package/dist/components/input/index.d.mts +3 -0
- package/dist/components/input/index.mjs +1 -41
- package/dist/components/input-group/index.mjs +14 -18
- package/dist/components/kbd/index.mjs +8 -10
- package/dist/components/layout/index.mjs +77 -77
- package/dist/components/link/index.mjs +12 -13
- package/dist/components/list/index.mjs +52 -47
- package/dist/components/listbox/index.mjs +2 -2
- package/dist/components/masonry/index.mjs +15 -17
- package/dist/components/mentions/index.mjs +1 -1
- package/dist/components/menu/index.mjs +2 -2
- package/dist/components/menubar/index.mjs +58 -57
- package/dist/components/meter/index.mjs +41 -41
- package/dist/components/number-input/index.mjs +2 -2
- package/dist/components/order-list/index.d.mts +21 -0
- package/dist/components/order-list/index.mjs +160 -0
- package/dist/components/page-header/index.mjs +2 -2
- package/dist/components/pagination/index.mjs +2 -2
- package/dist/components/password-input/index.mjs +2 -2
- package/dist/components/pin-input/index.mjs +2 -2
- package/dist/components/popconfirm/index.mjs +19 -12
- package/dist/components/progress/index.mjs +2 -2
- package/dist/components/progress-group/index.mjs +65 -58
- package/dist/components/radio-group/index.mjs +2 -2
- package/dist/components/rating-group/index.mjs +2 -2
- package/dist/components/result/index.d.mts +22 -0
- package/dist/components/result/index.mjs +66 -0
- package/dist/components/select/index.d.mts +2 -17
- package/dist/components/select/index.mjs +2 -18
- package/dist/components/separator/index.mjs +17 -19
- package/dist/components/skeleton/index.mjs +8 -10
- package/dist/components/slider/index.mjs +2 -2
- package/dist/components/spinner/index.mjs +15 -17
- package/dist/components/split-button/index.mjs +84 -83
- package/dist/components/spotlight/index.d.mts +11 -0
- package/dist/components/spotlight/index.mjs +38 -0
- package/dist/components/stack/index.mjs +20 -22
- package/dist/components/stat/index.mjs +12 -14
- package/dist/components/steps/index.mjs +2 -2
- package/dist/components/switch/index.mjs +2 -2
- package/dist/components/table/index.mjs +308 -211
- package/dist/components/tabs/index.d.mts +2 -0
- package/dist/components/tabs/index.mjs +10 -5
- package/dist/components/tags-input/index.mjs +2 -2
- package/dist/components/terminal/index.d.mts +17 -0
- package/dist/components/terminal/index.mjs +84 -0
- package/dist/components/textarea/index.mjs +8 -8
- package/dist/components/timeline/index.d.mts +9 -3
- package/dist/components/timeline/index.mjs +18 -3
- package/dist/components/toggle-group/index.mjs +2 -2
- package/dist/components/toolbar/index.d.mts +17 -0
- package/dist/components/toolbar/index.mjs +46 -0
- package/dist/components/transfer/index.mjs +116 -107
- package/dist/components/tree-select/index.mjs +29 -21
- package/dist/components/tree-view/index.mjs +2 -2
- package/dist/components/typography/index.mjs +2 -2
- package/dist/components/user/index.d.mts +19 -0
- package/dist/components/user/index.mjs +68 -0
- package/dist/components/virtual-list/index.d.mts +17 -0
- package/dist/components/virtual-list/index.mjs +71 -0
- package/dist/components/watermark/index.mjs +19 -13
- package/dist/{index-B4XS2n2y.d.mts → index-IfofF-SW.d.mts} +718 -3773
- package/dist/index-YPUiqD3n.d.mts +42 -0
- package/dist/index.d.mts +16 -3
- package/dist/index.mjs +20 -7
- package/dist/input-DoFQ7RXh.mjs +78 -0
- package/dist/{mentions-xbI6vJAP.mjs → mentions-f5Js_2W7.mjs} +76 -70
- package/dist/select-CHaXbzLX.mjs +115 -0
- package/package.json +28 -7
- package/dist/chevron-GWEoEYdO.mjs +0 -9
package/README.md
CHANGED
|
@@ -4,11 +4,11 @@
|
|
|
4
4
|

|
|
5
5
|

|
|
6
6
|
|
|
7
|
-
> By Sages Elements for Solid —
|
|
7
|
+
> By Sages Elements for Solid — 140+ accessible component families, headless by construction, dressed by the paper-and-ink style layer.
|
|
8
8
|
|
|
9
9
|
## Features
|
|
10
10
|
|
|
11
|
-
- 🧩 **
|
|
11
|
+
- 🧩 **140+ families** — actions, forms, overlays, navigation, data, layout, an AI conversation family on ai-sdk formats, and a full generative vocabulary
|
|
12
12
|
- 🏛️ **Headless inside** — interaction, state, ARIA, and positioning come from proven headless state machines; wrappers add API narrowing and style injection, no DOM of their own
|
|
13
13
|
- 🎨 **Token-styled** — every visual value is a CSS custom property from `@bysages/core`; light/dark, accent pigments, contrast and density tiers are data, never hardcoded styles
|
|
14
14
|
- 📦 **Container-driven** — components respond to `@container`, not the viewport; the same component composes in a sidebar, a card, or a page
|
|
@@ -62,6 +62,20 @@ render(
|
|
|
62
62
|
);
|
|
63
63
|
```
|
|
64
64
|
|
|
65
|
+
## Generative UI
|
|
66
|
+
|
|
67
|
+
Every family carries a generative face — a zod-typed catalog entry that
|
|
68
|
+
lives beside the component. The faces compose into a
|
|
69
|
+
[json-render](https://json-render.dev) catalog and render through the
|
|
70
|
+
same package:
|
|
71
|
+
|
|
72
|
+
```ts
|
|
73
|
+
import { catalog } from "@bysages/solid/generative";
|
|
74
|
+
```
|
|
75
|
+
|
|
76
|
+
Point an AI SDK stream at the renderer and a prompt becomes real,
|
|
77
|
+
on-brand components — constrained to the families you registered.
|
|
78
|
+
|
|
65
79
|
## Documentation
|
|
66
80
|
|
|
67
81
|
The [documentation site](https://elements.bysages.com) carries every family with live demos and props tables.
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { injectComponentStyle } from "@bysages/core";
|
|
2
|
-
import {
|
|
2
|
+
import { ref, spread, template } from "@solidjs/web";
|
|
3
3
|
import { createEffect, createMemo, onMount, splitProps } from "solid-js";
|
|
4
4
|
import { renderHtml } from "@tanstack/markdown/html";
|
|
5
5
|
//#region src/components/ai-response/code-copy.ts
|
|
@@ -99,7 +99,7 @@ function wrapResponseTables(root) {
|
|
|
99
99
|
}
|
|
100
100
|
//#endregion
|
|
101
101
|
//#region src/components/ai-response/index.tsx
|
|
102
|
-
var _tmpl$ =
|
|
102
|
+
var _tmpl$ = /* @__PURE__ */ template(`<div>`);
|
|
103
103
|
/** Markdown set on the paper. Rendering goes through
|
|
104
104
|
* `@tanstack/markdown`, whose defaults leave raw HTML and executable
|
|
105
105
|
* links inert — streaming-safe by construction. */
|
|
@@ -121,19 +121,19 @@ function Response(props) {
|
|
|
121
121
|
const onClick = (event) => {
|
|
122
122
|
clickCodeCopy(event, own.copyLabel ?? "Copy code", own.copiedLabel ?? "Copied");
|
|
123
123
|
};
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
}
|
|
135
|
-
|
|
136
|
-
|
|
124
|
+
var _el$ = _tmpl$();
|
|
125
|
+
ref(() => {
|
|
126
|
+
return (el) => root = el;
|
|
127
|
+
}, _el$);
|
|
128
|
+
spread(_el$, [rest, {
|
|
129
|
+
"data-scope": "ai",
|
|
130
|
+
"data-part": "response",
|
|
131
|
+
onClick,
|
|
132
|
+
get innerHTML() {
|
|
133
|
+
return html();
|
|
134
|
+
}
|
|
135
|
+
}], false);
|
|
136
|
+
return _el$;
|
|
137
137
|
}
|
|
138
138
|
//#endregion
|
|
139
139
|
export { Response as t };
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { template } from "@solidjs/web";
|
|
2
|
+
//#region src/components/ai/chevron.tsx
|
|
3
|
+
var _tmpl$ = /* @__PURE__ */ template(`<svg viewBox="0 0 16 16"fill=none aria-hidden=true><path d="M6 4l4 4-4 4"stroke=currentColor stroke-width=1.5 stroke-linecap=round stroke-linejoin=round>`);
|
|
4
|
+
/** The folding chevron the shared indicator turns. */
|
|
5
|
+
function chevron() {
|
|
6
|
+
return _tmpl$();
|
|
7
|
+
}
|
|
8
|
+
//#endregion
|
|
9
|
+
export { chevron as t };
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { injectComponentStyle } from "@bysages/core";
|
|
2
|
-
import {
|
|
2
|
+
import { spread, template } from "@solidjs/web";
|
|
3
3
|
import { splitProps } from "solid-js";
|
|
4
4
|
//#region src/components/affix/index.tsx
|
|
5
|
-
var _tmpl$ =
|
|
5
|
+
var _tmpl$ = /* @__PURE__ */ template(`<div>`);
|
|
6
6
|
/**
|
|
7
7
|
* A nail: the wrapped content travels with the page until it reaches its
|
|
8
8
|
* offset, then stays put while the page moves on. The semantics are
|
|
@@ -15,21 +15,19 @@ var _tmpl$ = /*#__PURE__*/ template(`<div>`);
|
|
|
15
15
|
function Affix(props) {
|
|
16
16
|
injectComponentStyle("affix");
|
|
17
17
|
const [own, rest] = splitProps(props, ["offsetTop", "offsetBottom"]);
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
return _el$;
|
|
32
|
-
})();
|
|
18
|
+
var _el$ = _tmpl$();
|
|
19
|
+
spread(_el$, [rest, {
|
|
20
|
+
get style() {
|
|
21
|
+
return {
|
|
22
|
+
...rest.style,
|
|
23
|
+
top: own.offsetTop ?? "0px",
|
|
24
|
+
bottom: own.offsetBottom ?? "0px"
|
|
25
|
+
};
|
|
26
|
+
},
|
|
27
|
+
"data-scope": "affix",
|
|
28
|
+
"data-part": "root"
|
|
29
|
+
}], false);
|
|
30
|
+
return _el$;
|
|
33
31
|
}
|
|
34
32
|
//#endregion
|
|
35
33
|
export { Affix };
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { a as AiLoader, c as ReasoningUIPart, d as StepStartUIPart, f as TextUIPart, h as UIMessagePart, i as AiConversation, l as SourceDocumentUIPart, m as UIMessage, n as AiActions, o as DataUIPart, p as ToolUIPart, r as AiContent, s as FileUIPart, t as Ai, u as SourceUrlUIPart } from "../../index-
|
|
1
|
+
import { a as AiLoader, c as ReasoningUIPart, d as StepStartUIPart, f as TextUIPart, h as UIMessagePart, i as AiConversation, l as SourceDocumentUIPart, m as UIMessage, n as AiActions, o as DataUIPart, p as ToolUIPart, r as AiContent, s as FileUIPart, t as Ai, u as SourceUrlUIPart } from "../../index-IfofF-SW.mjs";
|
|
2
2
|
export { Ai, AiActions, AiContent, AiConversation, AiLoader, type DataUIPart, type FileUIPart, type ReasoningUIPart, type SourceDocumentUIPart, type SourceUrlUIPart, type StepStartUIPart, type TextUIPart, type ToolUIPart, type UIMessage, type UIMessagePart };
|
|
@@ -2,14 +2,14 @@ import { Action } from "../ai-action/index.mjs";
|
|
|
2
2
|
import { AiMessage as Message } from "../ai-message/index.mjs";
|
|
3
3
|
import { AiPromptInput as PromptInput } from "../ai-prompt-input/index.mjs";
|
|
4
4
|
import { AiReasoning as Reasoning } from "../ai-reasoning/index.mjs";
|
|
5
|
-
import { t as Response } from "../../ai-response-
|
|
5
|
+
import { t as Response } from "../../ai-response-ClGGptX3.mjs";
|
|
6
6
|
import { AiSource as Source, AiSources as Sources } from "../ai-source/index.mjs";
|
|
7
7
|
import { AiSuggestion as Suggestion } from "../ai-suggestion/index.mjs";
|
|
8
8
|
import { AiTool as Tool } from "../ai-tool/index.mjs";
|
|
9
9
|
import { injectComponentStyle } from "@bysages/core";
|
|
10
|
-
import {
|
|
10
|
+
import { spread, template } from "@solidjs/web";
|
|
11
11
|
//#region src/components/ai/index.tsx
|
|
12
|
-
var _tmpl$ =
|
|
12
|
+
var _tmpl$ = /* @__PURE__ */ template(`<div>`);
|
|
13
13
|
/** A conversation column: Root is the log, Message carries a role, and
|
|
14
14
|
* the speaking parts — Response, Reasoning, Tool, Sources — part the
|
|
15
15
|
* stream. The interactive folds are the shared Collapsible wearing a
|
|
@@ -18,16 +18,18 @@ var _tmpl$ = /*#__PURE__*/ template(`<div>`);
|
|
|
18
18
|
* `UIMessage` parts re-exported here) onto these primitives. */
|
|
19
19
|
function part(name, extra = {}) {
|
|
20
20
|
function Component(props) {
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
21
|
+
var _el$ = _tmpl$();
|
|
22
|
+
spread(_el$, [
|
|
23
|
+
extra,
|
|
24
|
+
props,
|
|
25
|
+
{
|
|
24
26
|
"data-scope": "ai",
|
|
25
|
-
get
|
|
27
|
+
get "data-part"() {
|
|
26
28
|
return name.toLowerCase();
|
|
27
29
|
}
|
|
28
|
-
}
|
|
29
|
-
|
|
30
|
-
|
|
30
|
+
}
|
|
31
|
+
], false);
|
|
32
|
+
return _el$;
|
|
31
33
|
}
|
|
32
34
|
return Component;
|
|
33
35
|
}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { Button } from "../button/index.mjs";
|
|
2
2
|
import { injectComponentStyle } from "@bysages/core";
|
|
3
|
-
import { createComponent, mergeProps } from "
|
|
3
|
+
import { createComponent, mergeProps } from "@solidjs/web";
|
|
4
4
|
import { splitProps } from "solid-js";
|
|
5
5
|
//#region src/components/ai-action/index.tsx
|
|
6
6
|
/** A quiet icon button — copy, retry, thumbs. The label names it to
|
|
@@ -13,7 +13,7 @@ function Action(props) {
|
|
|
13
13
|
variant: "ghost",
|
|
14
14
|
size: "sm",
|
|
15
15
|
square: true,
|
|
16
|
-
get
|
|
16
|
+
get "aria-label"() {
|
|
17
17
|
return own.label;
|
|
18
18
|
},
|
|
19
19
|
get title() {
|
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
import { injectComponentStyle } from "@bysages/core";
|
|
2
|
-
import { delegateEvents, effect, insert, memo,
|
|
2
|
+
import { delegateEvents, effect, insert, memo, setAttribute, spread, template } from "@solidjs/web";
|
|
3
3
|
import { splitProps } from "solid-js";
|
|
4
4
|
//#region src/components/ai-attachments/index.tsx
|
|
5
|
-
var _tmpl$ =
|
|
6
|
-
var _tmpl$2 =
|
|
7
|
-
var _tmpl$3 =
|
|
8
|
-
var _tmpl$4 =
|
|
9
|
-
var _tmpl$5 =
|
|
5
|
+
var _tmpl$ = /* @__PURE__ */ template(`<svg viewBox="0 0 16 16"aria-hidden=true fill=none stroke=currentColor stroke-width=1.5 stroke-linecap=square><rect x=2.5 y=3.5 width=11 height=9></rect><path d="M2.5 10.5 6 7l3 3 2-1.5 2.5 2"></path><circle cx=6 cy=6 r=0.75 fill=currentColor stroke=none>`);
|
|
6
|
+
var _tmpl$2 = /* @__PURE__ */ template(`<svg viewBox="0 0 16 16"aria-hidden=true fill=none stroke=currentColor stroke-width=1.5 stroke-linecap=square><path d="M4 2.5h5l3 3V13.5H4z"></path><path d="M9 2.5v3h3">`);
|
|
7
|
+
var _tmpl$3 = /* @__PURE__ */ template(`<svg viewBox="0 0 16 16"width=12 height=12 aria-hidden=true fill=none stroke=currentColor stroke-width=1.5 stroke-linecap=square><path d="M4 4l8 8M12 4l-8 8">`);
|
|
8
|
+
var _tmpl$4 = /* @__PURE__ */ template(`<span><span></span><button type=button data-remove>`);
|
|
9
|
+
var _tmpl$5 = /* @__PURE__ */ template(`<span>`);
|
|
10
10
|
function imageGlyph() {
|
|
11
11
|
return _tmpl$();
|
|
12
12
|
}
|
|
@@ -54,44 +54,56 @@ function Attachment(props) {
|
|
|
54
54
|
"status",
|
|
55
55
|
"onRemove"
|
|
56
56
|
]);
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
}
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
57
|
+
var _el$4 = _tmpl$4();
|
|
58
|
+
var _el$5 = _el$4.firstChild;
|
|
59
|
+
var _el$6 = _el$5.nextSibling;
|
|
60
|
+
spread(_el$4, [rest, {
|
|
61
|
+
"data-scope": "ai",
|
|
62
|
+
"data-part": "attachment",
|
|
63
|
+
get "data-status"() {
|
|
64
|
+
return own.status ?? "ready";
|
|
65
|
+
}
|
|
66
|
+
}], true);
|
|
67
|
+
insert(_el$4, (() => {
|
|
68
|
+
var _c$ = memo(() => {
|
|
69
|
+
return !!isImage(own.name);
|
|
70
|
+
});
|
|
71
|
+
return () => {
|
|
72
|
+
return _c$() ? imageGlyph() : fileGlyph();
|
|
73
|
+
};
|
|
74
|
+
})(), _el$5);
|
|
75
|
+
insert(_el$5, () => {
|
|
76
|
+
return own.name;
|
|
77
|
+
});
|
|
78
|
+
insert(_el$4, (() => {
|
|
79
|
+
var _c$2 = memo(() => {
|
|
80
|
+
return own.size !== void 0;
|
|
81
|
+
});
|
|
82
|
+
return () => {
|
|
83
|
+
return _c$2() ? (() => {
|
|
74
84
|
var _el$7 = _tmpl$5();
|
|
75
|
-
insert(_el$7, () =>
|
|
85
|
+
insert(_el$7, () => {
|
|
86
|
+
return humanSize(own.size);
|
|
87
|
+
});
|
|
76
88
|
return _el$7;
|
|
77
89
|
})() : null;
|
|
78
|
-
}
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
90
|
+
};
|
|
91
|
+
})(), _el$6);
|
|
92
|
+
_el$6._$$click = () => own.onRemove?.();
|
|
93
|
+
insert(_el$6, removeGlyph);
|
|
94
|
+
effect(() => `Remove ${own.name}`, (_v$) => {
|
|
95
|
+
setAttribute(_el$6, "aria-label", _v$);
|
|
96
|
+
});
|
|
97
|
+
return _el$4;
|
|
84
98
|
}
|
|
85
99
|
/** The row the files ride in — a wrapping line of chips. */
|
|
86
100
|
function Attachments(props) {
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
return _el$8;
|
|
94
|
-
})();
|
|
101
|
+
var _el$8 = _tmpl$5();
|
|
102
|
+
spread(_el$8, [props, {
|
|
103
|
+
"data-scope": "ai",
|
|
104
|
+
"data-part": "attachments"
|
|
105
|
+
}], false);
|
|
106
|
+
return _el$8;
|
|
95
107
|
}
|
|
96
108
|
delegateEvents(["click"]);
|
|
97
109
|
//#endregion
|
|
@@ -1,24 +1,22 @@
|
|
|
1
1
|
import { injectComponentStyle } from "@bysages/core";
|
|
2
|
-
import {
|
|
2
|
+
import { spread, template } from "@solidjs/web";
|
|
3
3
|
import { splitProps } from "solid-js";
|
|
4
4
|
//#region src/components/ai-message/index.tsx
|
|
5
|
-
var _tmpl$ =
|
|
5
|
+
var _tmpl$ = /* @__PURE__ */ template(`<article>`);
|
|
6
6
|
/** Whose stroke this is — the user's words sit in a recessed bubble,
|
|
7
7
|
* the assistant speaks flat on the paper. */
|
|
8
8
|
function Message(props) {
|
|
9
9
|
injectComponentStyle("ai");
|
|
10
10
|
const [own, rest] = splitProps(props, ["role"]);
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
return _el$;
|
|
21
|
-
})();
|
|
11
|
+
var _el$ = _tmpl$();
|
|
12
|
+
spread(_el$, [rest, {
|
|
13
|
+
"data-scope": "ai",
|
|
14
|
+
"data-part": "message",
|
|
15
|
+
get "data-role"() {
|
|
16
|
+
return own.role ?? "assistant";
|
|
17
|
+
}
|
|
18
|
+
}], false);
|
|
19
|
+
return _el$;
|
|
22
20
|
}
|
|
23
21
|
//#endregion
|
|
24
22
|
export { Message as AiMessage, Message };
|
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
import { Button } from "../button/index.mjs";
|
|
2
2
|
import { Field } from "../field/index.mjs";
|
|
3
3
|
import { injectComponentStyle } from "@bysages/core";
|
|
4
|
-
import { createComponent, insert,
|
|
4
|
+
import { claimElement, createComponent, insert, setAttribute, spread, template } from "@solidjs/web";
|
|
5
5
|
import { Show, splitProps } from "solid-js";
|
|
6
6
|
//#region src/components/ai-prompt-input/index.tsx
|
|
7
|
-
var _tmpl$ =
|
|
8
|
-
var _tmpl$2 =
|
|
9
|
-
var _tmpl$3 =
|
|
10
|
-
var _tmpl$4 =
|
|
11
|
-
var _tmpl$5 =
|
|
7
|
+
var _tmpl$ = /* @__PURE__ */ template(`<svg viewBox="0 0 16 16"width=14 height=14 aria-hidden=true fill=none stroke=currentColor stroke-width=1.5 stroke-linecap=square><path d="M8 13V3M3.5 7.5 8 3l4.5 4.5">`);
|
|
8
|
+
var _tmpl$2 = /* @__PURE__ */ template(`<svg viewBox="0 0 16 16"width=14 height=14 aria-hidden=true><rect x=4.5 y=4.5 width=7 height=7 fill=currentColor>`);
|
|
9
|
+
var _tmpl$3 = /* @__PURE__ */ template(`<div data-scope=ai>`);
|
|
10
|
+
var _tmpl$4 = /* @__PURE__ */ template(`<div data-scope=ai data-part=prompt-footer><div data-scope=ai data-part=prompt-end><!><!>`);
|
|
11
|
+
var _tmpl$5 = /* @__PURE__ */ template(`<form><div data-scope=ai data-part=prompt-main><!><!><!></div><!>`);
|
|
12
12
|
function arrowUpGlyph() {
|
|
13
13
|
return _tmpl$();
|
|
14
14
|
}
|
|
@@ -82,55 +82,72 @@ function PromptInput(props) {
|
|
|
82
82
|
}
|
|
83
83
|
});
|
|
84
84
|
const trailing = () => own.footer != null ? own.trailing : own.trailing ?? seal();
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
} }), null);
|
|
119
|
-
insert(_el$5, () => row("prompt-trailing", trailing()), null);
|
|
120
|
-
insert(_el$4, createComponent(Show, {
|
|
121
|
-
get when() {
|
|
122
|
-
return own.footer != null;
|
|
85
|
+
var _el$4 = _tmpl$5();
|
|
86
|
+
var _el$5 = _el$4.firstChild;
|
|
87
|
+
var _el$6 = _el$5.firstChild;
|
|
88
|
+
var _el$7 = _el$6.nextSibling;
|
|
89
|
+
var _el$8 = _el$7.nextSibling;
|
|
90
|
+
var _el$13 = _el$5.nextSibling;
|
|
91
|
+
claimElement(_el$4);
|
|
92
|
+
spread(_el$4, [rest, {
|
|
93
|
+
"data-scope": "ai",
|
|
94
|
+
"data-part": "prompt",
|
|
95
|
+
onSubmit: (event) => {
|
|
96
|
+
event.preventDefault();
|
|
97
|
+
send();
|
|
98
|
+
}
|
|
99
|
+
}], true);
|
|
100
|
+
insert(_el$4, () => {
|
|
101
|
+
return row("prompt-header", own.header);
|
|
102
|
+
}, _el$5);
|
|
103
|
+
insert(_el$5, () => {
|
|
104
|
+
return row("prompt-leading", own.leading);
|
|
105
|
+
}, _el$6);
|
|
106
|
+
insert(_el$5, createComponent(Field.Root, { get children() {
|
|
107
|
+
return createComponent(Field.Textarea, {
|
|
108
|
+
autoresize: true,
|
|
109
|
+
rows: 1,
|
|
110
|
+
get value() {
|
|
111
|
+
return own.value ?? "";
|
|
112
|
+
},
|
|
113
|
+
get placeholder() {
|
|
114
|
+
return own.placeholder ?? "Send a message";
|
|
115
|
+
},
|
|
116
|
+
get disabled() {
|
|
117
|
+
return own.disabled;
|
|
123
118
|
},
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
119
|
+
onInput: (event) => own.onValueChange?.(event.currentTarget.value),
|
|
120
|
+
onKeyDown: (event) => {
|
|
121
|
+
if (event.key === "Enter" && !event.shiftKey) {
|
|
122
|
+
event.preventDefault();
|
|
123
|
+
send();
|
|
124
|
+
}
|
|
130
125
|
}
|
|
131
|
-
})
|
|
132
|
-
|
|
133
|
-
|
|
126
|
+
});
|
|
127
|
+
} }), _el$7);
|
|
128
|
+
insert(_el$5, () => {
|
|
129
|
+
return row("prompt-trailing", trailing());
|
|
130
|
+
}, _el$8);
|
|
131
|
+
insert(_el$4, createComponent(Show, {
|
|
132
|
+
get when() {
|
|
133
|
+
return own.footer != null;
|
|
134
|
+
},
|
|
135
|
+
get children() {
|
|
136
|
+
var _el$9 = _tmpl$4();
|
|
137
|
+
var _el$10 = _el$9.firstChild;
|
|
138
|
+
var _el$11 = _el$10.firstChild;
|
|
139
|
+
var _el$12 = _el$11.nextSibling;
|
|
140
|
+
insert(_el$9, () => {
|
|
141
|
+
return own.footer;
|
|
142
|
+
}, _el$10);
|
|
143
|
+
insert(_el$10, () => {
|
|
144
|
+
return own.footerEnd;
|
|
145
|
+
}, _el$11);
|
|
146
|
+
insert(_el$10, seal, _el$12);
|
|
147
|
+
return _el$9;
|
|
148
|
+
}
|
|
149
|
+
}), _el$13);
|
|
150
|
+
return _el$4;
|
|
134
151
|
}
|
|
135
152
|
//#endregion
|
|
136
153
|
export { PromptInput as AiPromptInput, PromptInput };
|
|
@@ -1,11 +1,11 @@
|
|
|
1
|
-
import { t as chevron } from "../../chevron-
|
|
1
|
+
import { t as chevron } from "../../chevron-D5RzcayK.mjs";
|
|
2
2
|
import { Collapsible } from "../collapsible/index.mjs";
|
|
3
3
|
import { injectComponentStyle } from "@bysages/core";
|
|
4
|
-
import { createComponent, insert, mergeProps, template } from "
|
|
4
|
+
import { createComponent, insert, mergeProps, template } from "@solidjs/web";
|
|
5
5
|
import { splitProps } from "solid-js";
|
|
6
6
|
//#region src/components/ai-reasoning/index.tsx
|
|
7
|
-
var _tmpl$ =
|
|
8
|
-
var _tmpl$2 =
|
|
7
|
+
var _tmpl$ = /* @__PURE__ */ template(`<span>`);
|
|
8
|
+
var _tmpl$2 = /* @__PURE__ */ template(`<div data-scope=ai data-part=reasoning-content>`);
|
|
9
9
|
/** The model's thought, folded by the shared collapsible in its quiet
|
|
10
10
|
* register: bare ink for a trigger, the thought on one hairline. */
|
|
11
11
|
function Reasoning(props) {
|
|
@@ -17,14 +17,18 @@ function Reasoning(props) {
|
|
|
17
17
|
return [createComponent(Collapsible.Trigger, { get children() {
|
|
18
18
|
return [(() => {
|
|
19
19
|
var _el$ = _tmpl$();
|
|
20
|
-
insert(_el$, () =>
|
|
20
|
+
insert(_el$, () => {
|
|
21
|
+
return own.label ?? "Thinking";
|
|
22
|
+
});
|
|
21
23
|
return _el$;
|
|
22
24
|
})(), createComponent(Collapsible.Indicator, { get children() {
|
|
23
25
|
return chevron();
|
|
24
26
|
} })];
|
|
25
27
|
} }), createComponent(Collapsible.Content, { get children() {
|
|
26
28
|
var _el$2 = _tmpl$2();
|
|
27
|
-
insert(_el$2, () =>
|
|
29
|
+
insert(_el$2, () => {
|
|
30
|
+
return own.children;
|
|
31
|
+
});
|
|
28
32
|
return _el$2;
|
|
29
33
|
} })];
|
|
30
34
|
}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { t as Response } from "../../ai-response-
|
|
1
|
+
import { t as Response } from "../../ai-response-ClGGptX3.mjs";
|
|
2
2
|
export { Response as AiResponse, Response };
|
|
@@ -1,36 +1,36 @@
|
|
|
1
1
|
import { injectComponentStyle } from "@bysages/core";
|
|
2
|
-
import {
|
|
2
|
+
import { claimElement, insert, spread, template } from "@solidjs/web";
|
|
3
3
|
import { splitProps } from "solid-js";
|
|
4
4
|
//#region src/components/ai-source/index.tsx
|
|
5
|
-
var _tmpl$ =
|
|
6
|
-
var _tmpl$2 =
|
|
5
|
+
var _tmpl$ = /* @__PURE__ */ template(`<li data-scope=ai data-part=source><a>`);
|
|
6
|
+
var _tmpl$2 = /* @__PURE__ */ template(`<ol>`);
|
|
7
7
|
/** One place the ink came from; href and the rest ride the anchor. */
|
|
8
8
|
function Source(props) {
|
|
9
9
|
injectComponentStyle("ai");
|
|
10
10
|
const [own, rest] = splitProps(props, ["href", "children"]);
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
11
|
+
var _el$ = _tmpl$();
|
|
12
|
+
var _el$2 = _el$.firstChild;
|
|
13
|
+
claimElement(_el$2);
|
|
14
|
+
spread(_el$2, [rest, {
|
|
15
|
+
get href() {
|
|
16
|
+
return own.href;
|
|
17
|
+
},
|
|
18
|
+
target: "_blank",
|
|
19
|
+
rel: "noreferrer"
|
|
20
|
+
}], true);
|
|
21
|
+
insert(_el$2, () => {
|
|
22
|
+
return own.children ?? own.href;
|
|
23
|
+
});
|
|
24
|
+
return _el$;
|
|
23
25
|
}
|
|
24
26
|
/** The reading list under a response: where this ink came from. */
|
|
25
27
|
function Sources(props) {
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
return _el$3;
|
|
33
|
-
})();
|
|
28
|
+
var _el$3 = _tmpl$2();
|
|
29
|
+
spread(_el$3, [props, {
|
|
30
|
+
"data-scope": "ai",
|
|
31
|
+
"data-part": "sources"
|
|
32
|
+
}], false);
|
|
33
|
+
return _el$3;
|
|
34
34
|
}
|
|
35
35
|
//#endregion
|
|
36
36
|
export { Source as AiSource, Source, Sources as AiSources, Sources };
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { Button } from "../button/index.mjs";
|
|
2
2
|
import { injectComponentStyle } from "@bysages/core";
|
|
3
|
-
import { createComponent, mergeProps } from "
|
|
3
|
+
import { createComponent, mergeProps } from "@solidjs/web";
|
|
4
4
|
import { splitProps } from "solid-js";
|
|
5
5
|
//#region src/components/ai-suggestion/index.tsx
|
|
6
6
|
/** A seal-cut button proposing the next stroke; selection hands back
|