cursedbelt 5.52.0 → 5.52.1
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/react/components/FieldGrid.d.ts +3 -1
- package/dist/react/components/FieldGrid.d.ts.map +1 -1
- package/dist/react/components/FieldGrid.js +5 -1
- package/dist/react/components/FieldGrid.js.map +1 -1
- package/dist/react/components/SliderField.d.ts.map +1 -1
- package/dist/react/components/SliderField.js +10 -1
- package/dist/react/components/SliderField.js.map +1 -1
- package/dist/react/components/sliderField.css +51 -0
- package/package.json +1 -1
- package/src/react/components/FieldGrid.tsx +7 -2
- package/src/react/components/SliderField.tsx +11 -0
- package/src/react/components/sliderField.css +51 -0
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import type
|
|
1
|
+
import { type ReactNode } from 'react';
|
|
2
2
|
export interface FieldGridProps {
|
|
3
3
|
/** `Field layout="inline"`s and `SliderField`s — each draws its label in the grid's one label column. */
|
|
4
4
|
children: ReactNode;
|
|
@@ -11,6 +11,8 @@ export interface FieldGridProps {
|
|
|
11
11
|
density?: 'dense' | 'standard';
|
|
12
12
|
className?: string;
|
|
13
13
|
}
|
|
14
|
+
/** The enclosing FieldGrid's label width, or `null` outside one — SliderField sizes its narrow-grid threshold from it (forge task 2667). */
|
|
15
|
+
export declare const useFieldGridLabelWidth: () => NonNullable<"sm" | "md" | "lg" | undefined> | null;
|
|
14
16
|
/**
|
|
15
17
|
* A column of fields whose labels share ONE label column (FRM-1, FRM-2): every label shares a
|
|
16
18
|
* left edge, and every control shares its left edge, so a dense settings list or a control
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FieldGrid.d.ts","sourceRoot":"","sources":["../../../src/react/components/FieldGrid.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,
|
|
1
|
+
{"version":3,"file":"FieldGrid.d.ts","sourceRoot":"","sources":["../../../src/react/components/FieldGrid.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAqC,KAAK,SAAS,EAAc,MAAM,OAAO,CAAC;AAGtF,MAAM,WAAW,cAAc;IAC7B,yGAAyG;IACzG,QAAQ,EAAE,SAAS,CAAC;IACpB;;;OAGG;IACH,UAAU,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IAChC,0GAA0G;IAC1G,OAAO,CAAC,EAAE,OAAO,GAAG,UAAU,CAAC;IAC/B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAUD,4IAA4I;AAC5I,eAAO,MAAM,sBAAsB,0DAAsC,CAAC;AAE1E;;;;;;;GAOG;AACH,wBAAgB,SAAS,CAAC,EAAE,QAAQ,EAAE,UAAiB,EAAE,OAAiB,EAAE,SAAS,EAAE,EAAE,cAAc,+BAYtG"}
|
|
@@ -1,10 +1,14 @@
|
|
|
1
1
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
import { createContext, useContext } from 'react';
|
|
2
3
|
import { cn } from '../lib/cn.js';
|
|
3
4
|
const LABEL_COL = {
|
|
4
5
|
sm: '7rem',
|
|
5
6
|
md: '9rem',
|
|
6
7
|
lg: '11rem',
|
|
7
8
|
};
|
|
9
|
+
const LabelWidthContext = createContext(null);
|
|
10
|
+
/** The enclosing FieldGrid's label width, or `null` outside one — SliderField sizes its narrow-grid threshold from it (forge task 2667). */
|
|
11
|
+
export const useFieldGridLabelWidth = () => useContext(LabelWidthContext);
|
|
8
12
|
/**
|
|
9
13
|
* A column of fields whose labels share ONE label column (FRM-1, FRM-2): every label shares a
|
|
10
14
|
* left edge, and every control shares its left edge, so a dense settings list or a control
|
|
@@ -16,6 +20,6 @@ const LABEL_COL = {
|
|
|
16
20
|
export function FieldGrid({ children, labelWidth = 'md', density = 'dense', className }) {
|
|
17
21
|
return (_jsx("div", { className: cn('cb-field-grid', className), "data-cb-field-grid": '', "data-density": density,
|
|
18
22
|
// A live custom property — the one track every row's label column reads.
|
|
19
|
-
style: { '--cb-label-col': LABEL_COL[labelWidth] }, children: children }));
|
|
23
|
+
style: { '--cb-label-col': LABEL_COL[labelWidth] }, children: _jsx(LabelWidthContext.Provider, { value: labelWidth, children: children }) }));
|
|
20
24
|
}
|
|
21
25
|
//# sourceMappingURL=FieldGrid.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FieldGrid.js","sourceRoot":"","sources":["../../../src/react/components/FieldGrid.tsx"],"names":[],"mappings":";
|
|
1
|
+
{"version":3,"file":"FieldGrid.js","sourceRoot":"","sources":["../../../src/react/components/FieldGrid.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAsB,aAAa,EAAkB,UAAU,EAAE,MAAM,OAAO,CAAC;AACtF,OAAO,EAAE,EAAE,EAAE,MAAM,cAAc,CAAC;AAelC,MAAM,SAAS,GAA8D;IAC3E,EAAE,EAAE,MAAM;IACV,EAAE,EAAE,MAAM;IACV,EAAE,EAAE,OAAO;CACZ,CAAC;AAEF,MAAM,iBAAiB,GAAG,aAAa,CAAmD,IAAI,CAAC,CAAC;AAEhG,4IAA4I;AAC5I,MAAM,CAAC,MAAM,sBAAsB,GAAG,GAAG,EAAE,CAAC,UAAU,CAAC,iBAAiB,CAAC,CAAC;AAE1E;;;;;;;GAOG;AACH,MAAM,UAAU,SAAS,CAAC,EAAE,QAAQ,EAAE,UAAU,GAAG,IAAI,EAAE,OAAO,GAAG,OAAO,EAAE,SAAS,EAAkB;IACrG,OAAO,CACL,cACE,SAAS,EAAE,EAAE,CAAC,eAAe,EAAE,SAAS,CAAC,wBACtB,EAAE,kBACP,OAAO;QACrB,yEAAyE;QACzE,KAAK,EAAE,EAAE,gBAAgB,EAAE,SAAS,CAAC,UAAU,CAAC,EAAmB,YAEnE,KAAC,iBAAiB,CAAC,QAAQ,IAAC,KAAK,EAAE,UAAU,YAAG,QAAQ,GAA8B,GAClF,CACP,CAAC;AACJ,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SliderField.d.ts","sourceRoot":"","sources":["../../../src/react/components/SliderField.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,SAAS,EAAuD,MAAM,OAAO,CAAC;AAC5F,OAAO,mBAAmB,CAAC;
|
|
1
|
+
{"version":3,"file":"SliderField.d.ts","sourceRoot":"","sources":["../../../src/react/components/SliderField.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,SAAS,EAAuD,MAAM,OAAO,CAAC;AAC5F,OAAO,mBAAmB,CAAC;AAU3B;;;;GAIG;AACH,wBAAgB,gBAAgB,CAAC,GAAG,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,GAAG,MAAM,CAM9G;AAED,uFAAuF;AACvF,wBAAgB,YAAY,CAAC,IAAI,EAAE,MAAM,GAAG,MAAM,CAMjD;AAED,iFAAiF;AACjF,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,GAAG,MAAM,CAErE;AAOD,kHAAkH;AAClH,MAAM,WAAW,cAAc;IAC7B,IAAI,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAC9B,KAAK,EAAE,MAAM,OAAO,CAAC;CACtB;AAED;;;;GAIG;AACH,wBAAgB,cAAc,CAC5B,OAAO,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,EAChC,QAAQ,GAAE,CAAC,GAAG,EAAE,MAAM,IAAI,KAAK,MAA8B,EAC7D,MAAM,GAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAA2B,GAClD,cAAc,CAsBhB;AAaD,MAAM,WAAW,gBAAgB;IAC/B,8GAA8G;IAC9G,KAAK,EAAE,SAAS,CAAC;IACjB,wBAAwB;IACxB,KAAK,EAAE,MAAM,CAAC;IACd,GAAG,EAAE,MAAM,CAAC;IACZ,GAAG,EAAE,MAAM,CAAC;IACZ,4GAA4G;IAC5G,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;OAGG;IACH,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,qFAAqF;IACrF,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC;;;;OAIG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;;;OAIG;IACH,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,SAAS,CAAC;IAC3C;;;OAGG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB;;;;;;;OAOG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;OAGG;IACH,KAAK,CAAC,EAAE,SAAS,MAAM,EAAE,CAAC;IAC1B;;;OAGG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC,SAAS,EAAE,SAAS,CAAC,CAAC;IACvC;;;;OAIG;IACH,KAAK,CAAC,EAAE;QAAE,EAAE,EAAE,MAAM,CAAC;QAAC,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;QAAC,KAAK,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IAC7D,kGAAkG;IAClG,KAAK,CAAC,EAAE,QAAQ,GAAG,MAAM,CAAC;IAC1B,mGAAmG;IACnG,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;;;;;;;GAUG;AACH,wBAAgB,WAAW,CAAC,EAC1B,KAAK,EACL,KAAK,EACL,GAAG,EACH,GAAG,EACH,IAAQ,EACR,QAAQ,EACR,QAAQ,EACR,QAAQ,EACR,UAAc,EACd,QAAQ,EACR,KAAK,EACL,IAAI,EACJ,KAAK,EACL,WAAW,EACX,IAAI,EACJ,KAAgB,EAChB,YAAY,EAAE,SAAS,EACvB,SAAS,GACV,EAAE,gBAAgB,+BAkLlB"}
|
|
@@ -5,6 +5,7 @@ import { useDebouncedCallback } from '../hooks/useDebouncedCallback.js';
|
|
|
5
5
|
import { cn } from '../lib/cn.js';
|
|
6
6
|
import { HELP_FOLD_CHARS } from '../lib/field.js';
|
|
7
7
|
import { Button } from './Button.js';
|
|
8
|
+
import { useFieldGridLabelWidth } from './FieldGrid.js';
|
|
8
9
|
import { InfoHint } from './InfoHint.js';
|
|
9
10
|
import { Input } from './Input.js';
|
|
10
11
|
import { Slider } from './Slider.js';
|
|
@@ -72,6 +73,13 @@ export function frameCoalescer(deliver, schedule = requestAnimationFrame, cancel
|
|
|
72
73
|
}
|
|
73
74
|
/** A formatted readout longer than this widens the value cell instead of truncating. */
|
|
74
75
|
const WIDE_READOUT_CHARS = 6;
|
|
76
|
+
/**
|
|
77
|
+
* The FieldGrid width (rem) below which a row WITHOUT Reset stacks its label over track + value,
|
|
78
|
+
* per label width, [plain, wide readout]: the label column + a 6rem track floor + the value box
|
|
79
|
+
* (5rem, or 8rem when wide) + two 0.75rem gaps. md's and lg's plain rows round up a rem onto the
|
|
80
|
+
* next threshold, so sliderField.css carries four container queries, not six (forge task 2667).
|
|
81
|
+
*/
|
|
82
|
+
const STACK_BELOW = { sm: ['19.5', '22.5'], md: ['22.5', '24.5'], lg: ['24.5', '26.5'] };
|
|
75
83
|
/**
|
|
76
84
|
* The one numeric-range field: `[label] [track] [value]` on ONE row (FRM-5). The value cell
|
|
77
85
|
* is a fixed-width, right-aligned, `tabular-nums` box you can type into; it shows the value
|
|
@@ -155,6 +163,7 @@ export function SliderField({ label, value, min, max, step = 1, disabled, onChan
|
|
|
155
163
|
return typeof r === 'string' || typeof r === 'number' ? String(r).length : 0;
|
|
156
164
|
}));
|
|
157
165
|
const wide = widest > WIDE_READOUT_CHARS;
|
|
166
|
+
const gridLabel = useFieldGridLabelWidth();
|
|
158
167
|
const folds = typeof hint === 'string' && hint.length > HELP_FOLD_CHARS;
|
|
159
168
|
const resetNow = () => {
|
|
160
169
|
if (!reset)
|
|
@@ -189,7 +198,7 @@ export function SliderField({ label, value, min, max, step = 1, disabled, onChan
|
|
|
189
198
|
if (next !== shown)
|
|
190
199
|
commitTyped(next);
|
|
191
200
|
};
|
|
192
|
-
return (_jsxs("div", { className: cn('cb-slider-row', className), "data-cb-field": '', "data-cb-slider-width": width, "data-cb-slider-reset": reset ? '' : undefined, children: [_jsxs("div", { className: 'flex min-w-0 items-center gap-1', "data-cb-field-head": '', children: [_jsx("label", { htmlFor: id, className: 'text-sm font-medium text-foreground', "data-cb-field-label": '', children: label }), folds ? _jsx(InfoHint, { title: typeof label === 'string' ? label : undefined, children: hint }) : null] }), _jsx(Slider, { value: shown, min: min, max: max, step: step, disabled: disabled, onChange: change, onCommit: commit, ticks: ticks, "aria-label": name, "aria-valuetext": readoutText ?? undefined }), _jsx(Input, { id: id, type: 'text', inputMode: step > 0 && Number.isInteger(step) && min >= 0 ? 'numeric' : 'decimal', disabled: disabled, value: draft ?? readoutText ?? formatSliderValue(shown, step), ref: inputRef, onFocus: () => {
|
|
201
|
+
return (_jsxs("div", { className: cn('cb-slider-row', className), "data-cb-field": '', "data-cb-slider-width": width, "data-cb-slider-reset": reset ? '' : undefined, "data-cb-slider-fit": gridLabel && !reset ? STACK_BELOW[gridLabel][wide ? 1 : 0] : undefined, children: [_jsxs("div", { className: 'flex min-w-0 items-center gap-1', "data-cb-field-head": '', children: [_jsx("label", { htmlFor: id, className: 'text-sm font-medium text-foreground', "data-cb-field-label": '', children: label }), folds ? _jsx(InfoHint, { title: typeof label === 'string' ? label : undefined, children: hint }) : null] }), _jsx(Slider, { value: shown, min: min, max: max, step: step, disabled: disabled, onChange: change, onCommit: commit, ticks: ticks, "aria-label": name, "aria-valuetext": readoutText ?? undefined }), _jsx(Input, { id: id, type: 'text', inputMode: step > 0 && Number.isInteger(step) && min >= 0 ? 'numeric' : 'decimal', disabled: disabled, value: draft ?? readoutText ?? formatSliderValue(shown, step), ref: inputRef, onFocus: () => {
|
|
193
202
|
selectOnSwap.current = true;
|
|
194
203
|
setDraft(formatSliderValue(shown, step));
|
|
195
204
|
}, onChange: (e) => setDraft(e.target.value), onEnter: commitDraft, onBlur: commitDraft, "aria-label": name, "aria-describedby": hint != null && !folds ? helpId : undefined, className: cn('shrink-0 text-right tabular-nums', wide ? 'w-32' : 'w-20'), "data-cb-slider-value": '' }), reset ? (_jsx(Button, { variant: 'ghost',
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SliderField.js","sourceRoot":"","sources":["../../../src/react/components/SliderField.tsx"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"file":"SliderField.js","sourceRoot":"","sources":["../../../src/react/components/SliderField.tsx"],"names":[],"mappings":"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"}
|
|
@@ -77,6 +77,57 @@
|
|
|
77
77
|
}
|
|
78
78
|
}
|
|
79
79
|
|
|
80
|
+
/* A row WITHOUT Reset is three cells: the label column, a 6rem track floor and the value box,
|
|
81
|
+
plus two gaps. In a grid narrower than that — the control-studio blueprint's 320–360px
|
|
82
|
+
inspector — the label stacks over track + value, or the value box runs past the rail and is
|
|
83
|
+
clipped (forge task 2667: 4px past a 308px grid, 52px for "Auto 2×"). A container query
|
|
84
|
+
cannot read `--cb-label-col`, so SliderField writes the width its row needs as
|
|
85
|
+
`data-cb-slider-fit` (STACK_BELOW in SliderField.tsx) and each threshold is one block. */
|
|
86
|
+
@container (width < 19.5rem) {
|
|
87
|
+
.cb-slider-row[data-cb-slider-fit="19.5"] {
|
|
88
|
+
grid-template-columns: minmax(0, 1fr) auto;
|
|
89
|
+
}
|
|
90
|
+
.cb-slider-row[data-cb-slider-fit="19.5"] > :is([data-cb-field-head], [data-cb-field-help]) {
|
|
91
|
+
grid-column: 1 / -1;
|
|
92
|
+
}
|
|
93
|
+
.cb-slider-row[data-cb-slider-fit="19.5"] > [data-cb-slider-ends] {
|
|
94
|
+
grid-column: 1;
|
|
95
|
+
}
|
|
96
|
+
}
|
|
97
|
+
@container (width < 22.5rem) {
|
|
98
|
+
.cb-slider-row[data-cb-slider-fit="22.5"] {
|
|
99
|
+
grid-template-columns: minmax(0, 1fr) auto;
|
|
100
|
+
}
|
|
101
|
+
.cb-slider-row[data-cb-slider-fit="22.5"] > :is([data-cb-field-head], [data-cb-field-help]) {
|
|
102
|
+
grid-column: 1 / -1;
|
|
103
|
+
}
|
|
104
|
+
.cb-slider-row[data-cb-slider-fit="22.5"] > [data-cb-slider-ends] {
|
|
105
|
+
grid-column: 1;
|
|
106
|
+
}
|
|
107
|
+
}
|
|
108
|
+
@container (width < 24.5rem) {
|
|
109
|
+
.cb-slider-row[data-cb-slider-fit="24.5"] {
|
|
110
|
+
grid-template-columns: minmax(0, 1fr) auto;
|
|
111
|
+
}
|
|
112
|
+
.cb-slider-row[data-cb-slider-fit="24.5"] > :is([data-cb-field-head], [data-cb-field-help]) {
|
|
113
|
+
grid-column: 1 / -1;
|
|
114
|
+
}
|
|
115
|
+
.cb-slider-row[data-cb-slider-fit="24.5"] > [data-cb-slider-ends] {
|
|
116
|
+
grid-column: 1;
|
|
117
|
+
}
|
|
118
|
+
}
|
|
119
|
+
@container (width < 26.5rem) {
|
|
120
|
+
.cb-slider-row[data-cb-slider-fit="26.5"] {
|
|
121
|
+
grid-template-columns: minmax(0, 1fr) auto;
|
|
122
|
+
}
|
|
123
|
+
.cb-slider-row[data-cb-slider-fit="26.5"] > :is([data-cb-field-head], [data-cb-field-help]) {
|
|
124
|
+
grid-column: 1 / -1;
|
|
125
|
+
}
|
|
126
|
+
.cb-slider-row[data-cb-slider-fit="26.5"] > [data-cb-slider-ends] {
|
|
127
|
+
grid-column: 1;
|
|
128
|
+
}
|
|
129
|
+
}
|
|
130
|
+
|
|
80
131
|
/* A phone has no room for a label column: the label stacks over its control (FRM-1). */
|
|
81
132
|
@media (width < 40rem) {
|
|
82
133
|
.cb-slider-row,
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "cursedbelt",
|
|
3
|
-
"version": "5.52.
|
|
3
|
+
"version": "5.52.1",
|
|
4
4
|
"license": "ISC",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"description": "The React design system of the cursedbelt split — components, styles, theme. cursedbelt-core below it; server tier in cursedbelt-server.",
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import type
|
|
1
|
+
import { type CSSProperties, createContext, type ReactNode, useContext } from 'react';
|
|
2
2
|
import { cn } from '../lib/cn.js';
|
|
3
3
|
|
|
4
4
|
export interface FieldGridProps {
|
|
@@ -20,6 +20,11 @@ const LABEL_COL: Record<NonNullable<FieldGridProps['labelWidth']>, string> = {
|
|
|
20
20
|
lg: '11rem',
|
|
21
21
|
};
|
|
22
22
|
|
|
23
|
+
const LabelWidthContext = createContext<NonNullable<FieldGridProps['labelWidth']> | null>(null);
|
|
24
|
+
|
|
25
|
+
/** The enclosing FieldGrid's label width, or `null` outside one — SliderField sizes its narrow-grid threshold from it (forge task 2667). */
|
|
26
|
+
export const useFieldGridLabelWidth = () => useContext(LabelWidthContext);
|
|
27
|
+
|
|
23
28
|
/**
|
|
24
29
|
* A column of fields whose labels share ONE label column (FRM-1, FRM-2): every label shares a
|
|
25
30
|
* left edge, and every control shares its left edge, so a dense settings list or a control
|
|
@@ -37,7 +42,7 @@ export function FieldGrid({ children, labelWidth = 'md', density = 'dense', clas
|
|
|
37
42
|
// A live custom property — the one track every row's label column reads.
|
|
38
43
|
style={{ '--cb-label-col': LABEL_COL[labelWidth] } as CSSProperties}
|
|
39
44
|
>
|
|
40
|
-
{children}
|
|
45
|
+
<LabelWidthContext.Provider value={labelWidth}>{children}</LabelWidthContext.Provider>
|
|
41
46
|
</div>
|
|
42
47
|
);
|
|
43
48
|
}
|
|
@@ -4,6 +4,7 @@ import { useDebouncedCallback } from '../hooks/useDebouncedCallback.js';
|
|
|
4
4
|
import { cn } from '../lib/cn.js';
|
|
5
5
|
import { HELP_FOLD_CHARS } from '../lib/field.js';
|
|
6
6
|
import { Button } from './Button.js';
|
|
7
|
+
import { useFieldGridLabelWidth } from './FieldGrid.js';
|
|
7
8
|
import { InfoHint } from './InfoHint.js';
|
|
8
9
|
import { Input } from './Input.js';
|
|
9
10
|
import { Slider } from './Slider.js';
|
|
@@ -82,6 +83,14 @@ export function frameCoalescer(
|
|
|
82
83
|
/** A formatted readout longer than this widens the value cell instead of truncating. */
|
|
83
84
|
const WIDE_READOUT_CHARS = 6;
|
|
84
85
|
|
|
86
|
+
/**
|
|
87
|
+
* The FieldGrid width (rem) below which a row WITHOUT Reset stacks its label over track + value,
|
|
88
|
+
* per label width, [plain, wide readout]: the label column + a 6rem track floor + the value box
|
|
89
|
+
* (5rem, or 8rem when wide) + two 0.75rem gaps. md's and lg's plain rows round up a rem onto the
|
|
90
|
+
* next threshold, so sliderField.css carries four container queries, not six (forge task 2667).
|
|
91
|
+
*/
|
|
92
|
+
const STACK_BELOW = { sm: ['19.5', '22.5'], md: ['22.5', '24.5'], lg: ['24.5', '26.5'] } as const;
|
|
93
|
+
|
|
85
94
|
export interface SliderFieldProps {
|
|
86
95
|
/** Field label — the first cell of the row (FRM-5). Inside a `FieldGrid` it takes the shared label column. */
|
|
87
96
|
label: ReactNode;
|
|
@@ -251,6 +260,7 @@ export function SliderField({
|
|
|
251
260
|
}),
|
|
252
261
|
);
|
|
253
262
|
const wide = widest > WIDE_READOUT_CHARS;
|
|
263
|
+
const gridLabel = useFieldGridLabelWidth();
|
|
254
264
|
const folds = typeof hint === 'string' && hint.length > HELP_FOLD_CHARS;
|
|
255
265
|
|
|
256
266
|
const resetNow = () => {
|
|
@@ -290,6 +300,7 @@ export function SliderField({
|
|
|
290
300
|
data-cb-field=''
|
|
291
301
|
data-cb-slider-width={width}
|
|
292
302
|
data-cb-slider-reset={reset ? '' : undefined}
|
|
303
|
+
data-cb-slider-fit={gridLabel && !reset ? STACK_BELOW[gridLabel][wide ? 1 : 0] : undefined}
|
|
293
304
|
>
|
|
294
305
|
<div className='flex min-w-0 items-center gap-1' data-cb-field-head=''>
|
|
295
306
|
<label htmlFor={id} className='text-sm font-medium text-foreground' data-cb-field-label=''>
|
|
@@ -77,6 +77,57 @@
|
|
|
77
77
|
}
|
|
78
78
|
}
|
|
79
79
|
|
|
80
|
+
/* A row WITHOUT Reset is three cells: the label column, a 6rem track floor and the value box,
|
|
81
|
+
plus two gaps. In a grid narrower than that — the control-studio blueprint's 320–360px
|
|
82
|
+
inspector — the label stacks over track + value, or the value box runs past the rail and is
|
|
83
|
+
clipped (forge task 2667: 4px past a 308px grid, 52px for "Auto 2×"). A container query
|
|
84
|
+
cannot read `--cb-label-col`, so SliderField writes the width its row needs as
|
|
85
|
+
`data-cb-slider-fit` (STACK_BELOW in SliderField.tsx) and each threshold is one block. */
|
|
86
|
+
@container (width < 19.5rem) {
|
|
87
|
+
.cb-slider-row[data-cb-slider-fit="19.5"] {
|
|
88
|
+
grid-template-columns: minmax(0, 1fr) auto;
|
|
89
|
+
}
|
|
90
|
+
.cb-slider-row[data-cb-slider-fit="19.5"] > :is([data-cb-field-head], [data-cb-field-help]) {
|
|
91
|
+
grid-column: 1 / -1;
|
|
92
|
+
}
|
|
93
|
+
.cb-slider-row[data-cb-slider-fit="19.5"] > [data-cb-slider-ends] {
|
|
94
|
+
grid-column: 1;
|
|
95
|
+
}
|
|
96
|
+
}
|
|
97
|
+
@container (width < 22.5rem) {
|
|
98
|
+
.cb-slider-row[data-cb-slider-fit="22.5"] {
|
|
99
|
+
grid-template-columns: minmax(0, 1fr) auto;
|
|
100
|
+
}
|
|
101
|
+
.cb-slider-row[data-cb-slider-fit="22.5"] > :is([data-cb-field-head], [data-cb-field-help]) {
|
|
102
|
+
grid-column: 1 / -1;
|
|
103
|
+
}
|
|
104
|
+
.cb-slider-row[data-cb-slider-fit="22.5"] > [data-cb-slider-ends] {
|
|
105
|
+
grid-column: 1;
|
|
106
|
+
}
|
|
107
|
+
}
|
|
108
|
+
@container (width < 24.5rem) {
|
|
109
|
+
.cb-slider-row[data-cb-slider-fit="24.5"] {
|
|
110
|
+
grid-template-columns: minmax(0, 1fr) auto;
|
|
111
|
+
}
|
|
112
|
+
.cb-slider-row[data-cb-slider-fit="24.5"] > :is([data-cb-field-head], [data-cb-field-help]) {
|
|
113
|
+
grid-column: 1 / -1;
|
|
114
|
+
}
|
|
115
|
+
.cb-slider-row[data-cb-slider-fit="24.5"] > [data-cb-slider-ends] {
|
|
116
|
+
grid-column: 1;
|
|
117
|
+
}
|
|
118
|
+
}
|
|
119
|
+
@container (width < 26.5rem) {
|
|
120
|
+
.cb-slider-row[data-cb-slider-fit="26.5"] {
|
|
121
|
+
grid-template-columns: minmax(0, 1fr) auto;
|
|
122
|
+
}
|
|
123
|
+
.cb-slider-row[data-cb-slider-fit="26.5"] > :is([data-cb-field-head], [data-cb-field-help]) {
|
|
124
|
+
grid-column: 1 / -1;
|
|
125
|
+
}
|
|
126
|
+
.cb-slider-row[data-cb-slider-fit="26.5"] > [data-cb-slider-ends] {
|
|
127
|
+
grid-column: 1;
|
|
128
|
+
}
|
|
129
|
+
}
|
|
130
|
+
|
|
80
131
|
/* A phone has no room for a label column: the label stacks over its control (FRM-1). */
|
|
81
132
|
@media (width < 40rem) {
|
|
82
133
|
.cb-slider-row,
|