@hanzo/ui 8.27.0 → 8.27.2
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/dist/backends/gui/control.cjs +16 -1
- package/dist/backends/gui/control.d.ts +15 -0
- package/dist/backends/gui/control.d.ts.map +1 -1
- package/dist/backends/gui/control.js +15 -0
- package/dist/backends/gui/control.js.map +1 -1
- package/dist/backends/gui/textarea.cjs +12 -5
- package/dist/backends/gui/textarea.d.ts.map +1 -1
- package/dist/backends/gui/textarea.js +13 -6
- package/dist/backends/gui/textarea.js.map +1 -1
- package/dist/gallery.html +5 -5
- package/dist/models/ModelSelector.cjs +1 -1
- package/dist/models/ModelSelector.d.ts.map +1 -1
- package/dist/models/ModelSelector.js +1 -1
- package/dist/models/ModelSelector.js.map +1 -1
- package/dist/styles.css +2 -2
- package/package.json +2 -2
|
@@ -25,7 +25,7 @@
|
|
|
25
25
|
* merely correct today, written in three files, is three chances to drift.
|
|
26
26
|
*/
|
|
27
27
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
28
|
-
exports.FIELD = exports.GUTTER = exports.CONTROL_H = void 0;
|
|
28
|
+
exports.FIELD = exports.RISER = exports.GUTTER = exports.CONTROL_H = void 0;
|
|
29
29
|
/**
|
|
30
30
|
* The control box.
|
|
31
31
|
*
|
|
@@ -35,6 +35,21 @@ exports.FIELD = exports.GUTTER = exports.CONTROL_H = void 0;
|
|
|
35
35
|
exports.CONTROL_H = 36;
|
|
36
36
|
/** The gutter, as the space rung — 12px. */
|
|
37
37
|
exports.GUTTER = 12;
|
|
38
|
+
/**
|
|
39
|
+
* The gutter ABOVE the text, for a field that stacks its lines from the top.
|
|
40
|
+
*
|
|
41
|
+
* An `<input>` centres its one line inside a fixed height, so its text lands
|
|
42
|
+
* (CONTROL_H − 2 borders − line height) / 2 = 7px below the edge. A `<textarea>`
|
|
43
|
+
* stacks from the top and had no vertical gutter at all, so its first line sat
|
|
44
|
+
* 1px below the edge — measured, and the seven pixels between them are visible
|
|
45
|
+
* the moment the two are stacked in one form: the tall field looks like the text
|
|
46
|
+
* is falling out of the top of it.
|
|
47
|
+
*
|
|
48
|
+
* Seven is that arithmetic, not a taste — the number is whatever makes a
|
|
49
|
+
* textarea's first line land where an input's only line does, and it is stated
|
|
50
|
+
* here so the two cannot drift apart in different files.
|
|
51
|
+
*/
|
|
52
|
+
exports.RISER = (exports.CONTROL_H - 2 - 20) / 2;
|
|
38
53
|
/**
|
|
39
54
|
* The edge, the gutter and the radius every field wears.
|
|
40
55
|
*
|
|
@@ -32,6 +32,21 @@
|
|
|
32
32
|
export declare const CONTROL_H = 36;
|
|
33
33
|
/** The gutter, as the space rung — 12px. */
|
|
34
34
|
export declare const GUTTER = 12;
|
|
35
|
+
/**
|
|
36
|
+
* The gutter ABOVE the text, for a field that stacks its lines from the top.
|
|
37
|
+
*
|
|
38
|
+
* An `<input>` centres its one line inside a fixed height, so its text lands
|
|
39
|
+
* (CONTROL_H − 2 borders − line height) / 2 = 7px below the edge. A `<textarea>`
|
|
40
|
+
* stacks from the top and had no vertical gutter at all, so its first line sat
|
|
41
|
+
* 1px below the edge — measured, and the seven pixels between them are visible
|
|
42
|
+
* the moment the two are stacked in one form: the tall field looks like the text
|
|
43
|
+
* is falling out of the top of it.
|
|
44
|
+
*
|
|
45
|
+
* Seven is that arithmetic, not a taste — the number is whatever makes a
|
|
46
|
+
* textarea's first line land where an input's only line does, and it is stated
|
|
47
|
+
* here so the two cannot drift apart in different files.
|
|
48
|
+
*/
|
|
49
|
+
export declare const RISER: number;
|
|
35
50
|
/**
|
|
36
51
|
* The edge, the gutter and the radius every field wears.
|
|
37
52
|
*
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"control.d.ts","sourceRoot":"","sources":["../../../src/backends/gui/control.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AAEH;;;;;GAKG;AACH,eAAO,MAAM,SAAS,KAAK,CAAA;AAE3B,4CAA4C;AAC5C,eAAO,MAAM,MAAM,KAAK,CAAA;AAExB;;;;;;GAMG;AACH,eAAO,MAAM,KAAK;aAChB,EAAE,EAAE,IAAI;aACR,OAAO,EAAE,IAAI;aACb,WAAW,EAAE,CAAC;aACd,WAAW,EAAE,cAAc;aAC3B,EAAE,EAAE,aAAa;CACT,CAAA;AAEV;;;;;;;;;;;;;;;;;;;;GAoBG"}
|
|
1
|
+
{"version":3,"file":"control.d.ts","sourceRoot":"","sources":["../../../src/backends/gui/control.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AAEH;;;;;GAKG;AACH,eAAO,MAAM,SAAS,KAAK,CAAA;AAE3B,4CAA4C;AAC5C,eAAO,MAAM,MAAM,KAAK,CAAA;AAExB;;;;;;;;;;;;;GAaG;AACH,eAAO,MAAM,KAAK,QAA2B,CAAA;AAE7C;;;;;;GAMG;AACH,eAAO,MAAM,KAAK;aAChB,EAAE,EAAE,IAAI;aACR,OAAO,EAAE,IAAI;aACb,WAAW,EAAE,CAAC;aACd,WAAW,EAAE,cAAc;aAC3B,EAAE,EAAE,aAAa;CACT,CAAA;AAEV;;;;;;;;;;;;;;;;;;;;GAoBG"}
|
|
@@ -32,6 +32,21 @@
|
|
|
32
32
|
export const CONTROL_H = 36;
|
|
33
33
|
/** The gutter, as the space rung — 12px. */
|
|
34
34
|
export const GUTTER = 12;
|
|
35
|
+
/**
|
|
36
|
+
* The gutter ABOVE the text, for a field that stacks its lines from the top.
|
|
37
|
+
*
|
|
38
|
+
* An `<input>` centres its one line inside a fixed height, so its text lands
|
|
39
|
+
* (CONTROL_H − 2 borders − line height) / 2 = 7px below the edge. A `<textarea>`
|
|
40
|
+
* stacks from the top and had no vertical gutter at all, so its first line sat
|
|
41
|
+
* 1px below the edge — measured, and the seven pixels between them are visible
|
|
42
|
+
* the moment the two are stacked in one form: the tall field looks like the text
|
|
43
|
+
* is falling out of the top of it.
|
|
44
|
+
*
|
|
45
|
+
* Seven is that arithmetic, not a taste — the number is whatever makes a
|
|
46
|
+
* textarea's first line land where an input's only line does, and it is stated
|
|
47
|
+
* here so the two cannot drift apart in different files.
|
|
48
|
+
*/
|
|
49
|
+
export const RISER = (CONTROL_H - 2 - 20) / 2;
|
|
35
50
|
/**
|
|
36
51
|
* The edge, the gutter and the radius every field wears.
|
|
37
52
|
*
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"control.js","sourceRoot":"","sources":["../../../src/backends/gui/control.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AAEH;;;;;GAKG;AACH,MAAM,CAAC,MAAM,SAAS,GAAG,EAAE,CAAA;AAE3B,4CAA4C;AAC5C,MAAM,CAAC,MAAM,MAAM,GAAG,EAAE,CAAA;AAExB;;;;;;GAMG;AACH,MAAM,CAAC,MAAM,KAAK,GAAG;IACnB,EAAE,EAAE,IAAI;IACR,OAAO,EAAE,IAAI;IACb,WAAW,EAAE,CAAC;IACd,WAAW,EAAE,cAAc;IAC3B,EAAE,EAAE,aAAa;CACT,CAAA;AAEV;;;;;;;;;;;;;;;;;;;;GAoBG"}
|
|
1
|
+
{"version":3,"file":"control.js","sourceRoot":"","sources":["../../../src/backends/gui/control.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AAEH;;;;;GAKG;AACH,MAAM,CAAC,MAAM,SAAS,GAAG,EAAE,CAAA;AAE3B,4CAA4C;AAC5C,MAAM,CAAC,MAAM,MAAM,GAAG,EAAE,CAAA;AAExB;;;;;;;;;;;;;GAaG;AACH,MAAM,CAAC,MAAM,KAAK,GAAG,CAAC,SAAS,GAAG,CAAC,GAAG,EAAE,CAAC,GAAG,CAAC,CAAA;AAE7C;;;;;;GAMG;AACH,MAAM,CAAC,MAAM,KAAK,GAAG;IACnB,EAAE,EAAE,IAAI;IACR,OAAO,EAAE,IAAI;IACb,WAAW,EAAE,CAAC;IACd,WAAW,EAAE,cAAc;IAC3B,EAAE,EAAE,aAAa;CACT,CAAA;AAEV;;;;;;;;;;;;;;;;;;;;GAoBG"}
|
|
@@ -72,11 +72,18 @@ const Textarea = /* @__PURE__ */ React.forwardRef(function Textarea({ rows, valu
|
|
|
72
72
|
setGrown((h) => (h === measured ? h : measured));
|
|
73
73
|
}, [shown]);
|
|
74
74
|
return ((0, jsx_runtime_1.jsx)(gui_1.TextArea, { ref: hold, ...(0, slot_1.slot)("textarea"), rows: Math.max(rows ?? MIN_ROWS, uncontrolled ? typed : rowsOf(value)), value: value, defaultValue: defaultValue, onChangeText: uncontrolled ? (t) => setTyped(rowsOf(t)) : undefined, ...control_1.FIELD, width: "100%", minH: 64,
|
|
75
|
-
// The gutter has to be NAMED. Left unsaid
|
|
76
|
-
// `textAreaSizeVariant`, which computes its own
|
|
77
|
-
//
|
|
78
|
-
//
|
|
79
|
-
|
|
75
|
+
// The gutter has to be NAMED, both ways. Left unsaid the HORIZONTAL one
|
|
76
|
+
// came from gui's `textAreaSizeVariant`, which computes its own and landed
|
|
77
|
+
// on 20 — so the one field a form makes tall was also the one indented
|
|
78
|
+
// differently from the two above it.
|
|
79
|
+
//
|
|
80
|
+
// The VERTICAL one was simply absent, which is the same fault seen from
|
|
81
|
+
// the other side: an input centres its single line inside a fixed height
|
|
82
|
+
// and a textarea stacks from the top, so with no gutter the tall field's
|
|
83
|
+
// first line sat 1px under the edge where its neighbours' sat at 8. In a
|
|
84
|
+
// form the two are read together, and the text looked like it was falling
|
|
85
|
+
// out of the top of the box. RISER is that arithmetic.
|
|
86
|
+
pt: control_1.RISER, pb: control_1.RISER, borderColor: invalid && invalid !== "false" ? "$red7" : "$borderColor", placeholderTextColor: "$soft", fontSize: "$3", opacity: props.disabled ? 0.5 : 1, ...props,
|
|
80
87
|
// After the caller's props, so a passed `style` cannot silently disable
|
|
81
88
|
// growth. A fixed height is asked for with `height`.
|
|
82
89
|
style: { ...style, ...(grown ? { height: grown } : null) } }));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"textarea.d.ts","sourceRoot":"","sources":["../../../src/backends/gui/textarea.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAUrC;;;;;;;;;;;;;;;GAeG;AACH;;;;GAIG;AACH,MAAM,MAAM,aAAa,GAAG,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,QAAQ,CAAC,EAAE,UAAU,CAAC,GACjF,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,UAAU,CAAC,EAAE,WAAW,GAAG,MAAM,CAAC,CAAA;AAE9D,QAAA,MAAM,QAAQ,
|
|
1
|
+
{"version":3,"file":"textarea.d.ts","sourceRoot":"","sources":["../../../src/backends/gui/textarea.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAUrC;;;;;;;;;;;;;;;GAeG;AACH;;;;GAIG;AACH,MAAM,MAAM,aAAa,GAAG,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,QAAQ,CAAC,EAAE,UAAU,CAAC,GACjF,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,UAAU,CAAC,EAAE,WAAW,GAAG,MAAM,CAAC,CAAA;AAE9D,QAAA,MAAM,QAAQ,wGAqEb,CAAA;AAED,OAAO,EAAE,QAAQ,EAAE,CAAA"}
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
3
3
|
import * as React from "react";
|
|
4
4
|
import { TextArea } from "@hanzo/gui";
|
|
5
|
-
import { FIELD } from "./control.js";
|
|
5
|
+
import { FIELD, RISER } from "./control.js";
|
|
6
6
|
import { slot } from "./slot.js";
|
|
7
7
|
/** Floor for the grown row count. */
|
|
8
8
|
const MIN_ROWS = 3;
|
|
@@ -36,11 +36,18 @@ const Textarea = /* @__PURE__ */ React.forwardRef(function Textarea({ rows, valu
|
|
|
36
36
|
setGrown((h) => (h === measured ? h : measured));
|
|
37
37
|
}, [shown]);
|
|
38
38
|
return (_jsx(TextArea, { ref: hold, ...slot("textarea"), rows: Math.max(rows ?? MIN_ROWS, uncontrolled ? typed : rowsOf(value)), value: value, defaultValue: defaultValue, onChangeText: uncontrolled ? (t) => setTyped(rowsOf(t)) : undefined, ...FIELD, width: "100%", minH: 64,
|
|
39
|
-
// The gutter has to be NAMED. Left unsaid
|
|
40
|
-
// `textAreaSizeVariant`, which computes its own
|
|
41
|
-
//
|
|
42
|
-
//
|
|
43
|
-
|
|
39
|
+
// The gutter has to be NAMED, both ways. Left unsaid the HORIZONTAL one
|
|
40
|
+
// came from gui's `textAreaSizeVariant`, which computes its own and landed
|
|
41
|
+
// on 20 — so the one field a form makes tall was also the one indented
|
|
42
|
+
// differently from the two above it.
|
|
43
|
+
//
|
|
44
|
+
// The VERTICAL one was simply absent, which is the same fault seen from
|
|
45
|
+
// the other side: an input centres its single line inside a fixed height
|
|
46
|
+
// and a textarea stacks from the top, so with no gutter the tall field's
|
|
47
|
+
// first line sat 1px under the edge where its neighbours' sat at 8. In a
|
|
48
|
+
// form the two are read together, and the text looked like it was falling
|
|
49
|
+
// out of the top of the box. RISER is that arithmetic.
|
|
50
|
+
pt: RISER, pb: RISER, borderColor: invalid && invalid !== "false" ? "$red7" : "$borderColor", placeholderTextColor: "$soft", fontSize: "$3", opacity: props.disabled ? 0.5 : 1, ...props,
|
|
44
51
|
// After the caller's props, so a passed `style` cannot silently disable
|
|
45
52
|
// growth. A fixed height is asked for with `height`.
|
|
46
53
|
style: { ...style, ...(grown ? { height: grown } : null) } }));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"textarea.js","sourceRoot":"","sources":["../../../src/backends/gui/textarea.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;;AAEZ,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AACrC,OAAO,EAAE,KAAK,EAAE,MAAM,WAAW,CAAA;
|
|
1
|
+
{"version":3,"file":"textarea.js","sourceRoot":"","sources":["../../../src/backends/gui/textarea.tsx"],"names":[],"mappings":"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"}
|