@harborclient/sdk 1.0.73 → 1.0.75
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/components/CodeEditor/index.js +1 -1
- package/dist/components/EmptyState/index.d.ts.map +1 -1
- package/dist/components/EmptyState/index.js +3 -3
- package/dist/components/FooterPanel/index.d.ts.map +1 -1
- package/dist/components/FooterPanel/index.js +1 -1
- package/dist/components/FormGroup/index.js +6 -6
- package/dist/components/KeyValueEditor/index.js +1 -1
- package/dist/components/PageHeader/index.d.ts.map +1 -1
- package/dist/components/PageHeader/index.js +1 -1
- package/dist/components/TabBar/TabContextMenu.js +1 -1
- package/dist/components/VariableInput/index.js +3 -3
- package/dist/components/VariableTable/index.js +1 -1
- package/dist/components/classes.js +2 -2
- package/dist/components/forms/classes.d.ts +1 -1
- package/dist/components/forms/classes.d.ts.map +1 -1
- package/dist/components/forms/classes.js +1 -1
- package/dist/components/rowActionsMenuHelpers.js +1 -1
- package/dist/styles.css +10 -0
- package/package.json +1 -1
|
@@ -1111,7 +1111,7 @@ export function CodeEditor({ value, onChange, language = 'text', readOnly = fals
|
|
|
1111
1111
|
...(height ? { height: '100%' } : {}),
|
|
1112
1112
|
basicSetup,
|
|
1113
1113
|
onCreateEditor: stableOnCreateEditor
|
|
1114
|
-
}), selectionTooltip && selectionTooltipContent && variables ? (_jsxs("div", { id: tooltipId, role: "tooltip", className: "hc-code-editor-tooltip app-no-drag pointer-events-auto fixed z-50 flex max-w-sm -translate-x-1/2 -translate-y-full flex-col gap-1.5 rounded-lg border border-separator bg-surface px-3 py-2 text-
|
|
1114
|
+
}), selectionTooltip && selectionTooltipContent && variables ? (_jsxs("div", { id: tooltipId, role: "tooltip", className: "hc-code-editor-tooltip app-no-drag pointer-events-auto fixed z-50 flex max-w-sm -translate-x-1/2 -translate-y-full flex-col gap-1.5 rounded-lg border border-separator bg-surface px-3 py-2 text-text shadow-md", style: { top: selectionTooltip.top - 4, left: selectionTooltip.left }, children: [_jsx(VariableTooltipValue, { value: selectionTooltipContent.text, variableKey: selectionTooltip.key, muted: selectionTooltipContent.muted }), onEditVariable ? (_jsx(Button, { variant: "secondary", className: "hc-code-editor-tooltip-edit self-start", "aria-label": `Edit value for ${selectionTooltip.key}`, onMouseDown: (event) => {
|
|
1115
1115
|
event.preventDefault();
|
|
1116
1116
|
onEditVariable(selectionTooltip.key);
|
|
1117
1117
|
setSelectionTooltip(null);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/EmptyState/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,wBAAwB,EAAE,GAAG,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGtE,KAAK,iBAAiB,GAAG,QAAQ,GAAG,UAAU,CAAC;AAE/C,UAAU,KAAM,SAAQ,IAAI,CAAC,wBAAwB,CAAC,KAAK,CAAC,EAAE,UAAU,CAAC;IACvE;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IAEpB;;OAEG;IACH,OAAO,CAAC,EAAE,iBAAiB,CAAC;CAC7B;AAcD;;GAEG;AACH,wBAAgB,UAAU,CAAC,EACzB,QAAQ,EACR,OAAkB,EAClB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,GAAG,GAAG,CAAC,OAAO,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/EmptyState/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,wBAAwB,EAAE,GAAG,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGtE,KAAK,iBAAiB,GAAG,QAAQ,GAAG,UAAU,CAAC;AAE/C,UAAU,KAAM,SAAQ,IAAI,CAAC,wBAAwB,CAAC,KAAK,CAAC,EAAE,UAAU,CAAC;IACvE;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IAEpB;;OAEG;IACH,OAAO,CAAC,EAAE,iBAAiB,CAAC;CAC7B;AAcD;;GAEG;AACH,wBAAgB,UAAU,CAAC,EACzB,QAAQ,EACR,OAAkB,EAClB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,GAAG,GAAG,CAAC,OAAO,CAMrB"}
|
|
@@ -7,13 +7,13 @@ import { cn } from '../utils.js';
|
|
|
7
7
|
*/
|
|
8
8
|
function variantClasses(variant) {
|
|
9
9
|
if (variant === 'centered') {
|
|
10
|
-
return 'flex flex-1 items-center justify-center p-4 text-center text-
|
|
10
|
+
return 'flex flex-1 items-center justify-center p-4 text-center text-muted';
|
|
11
11
|
}
|
|
12
|
-
return 'text-
|
|
12
|
+
return 'text-muted';
|
|
13
13
|
}
|
|
14
14
|
/**
|
|
15
15
|
* Placeholder shown when a panel or list has no content to display.
|
|
16
16
|
*/
|
|
17
17
|
export function EmptyState({ children, variant = 'inline', className, ...props }) {
|
|
18
|
-
return (_jsx("div", { ...props, className: cn('hc-empty-state
|
|
18
|
+
return (_jsx("div", { ...props, className: cn('hc-empty-state', variantClasses(variant), className), children: children }));
|
|
19
19
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/FooterPanel/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EAAE,KAAK,GAAG,EAAE,MAAM,OAAO,CAAC;AAIxC,UAAU,KAAK;IACb,EAAE,EAAE,MAAM,CAAC;IAEX;;OAEG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAExB;;OAEG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAExB;;OAEG;IACH,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAE9B;;OAEG;IACH,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,EAAE,CAAC;IAE5B;;OAEG;IACH,UAAU,EAAE,MAAM,CAAC;IAEnB;;OAEG;IACH,UAAU,EAAE,MAAM,CAAC;IAEnB;;OAEG;IACH,IAAI,EAAE,OAAO,CAAC;IAEd;;OAEG;IACH,OAAO,EAAE,MAAM,IAAI,CAAC;IAEpB;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAE1B;;OAEG;IACH,iBAAiB,CAAC,EAAE,OAAO,CAAC;CAC7B;AAED;;GAEG;AACH,wBAAgB,WAAW,CAAC,EAC1B,EAAE,EACF,KAAK,EACL,KAAK,EACL,WAAW,EACX,UAAU,EACV,UAAU,EACV,OAAO,EACP,IAAI,EACJ,OAAO,EACP,QAAQ,EACR,iBAAyB,EAC1B,EAAE,KAAK,GAAG,GAAG,CAAC,OAAO,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/FooterPanel/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EAAE,KAAK,GAAG,EAAE,MAAM,OAAO,CAAC;AAIxC,UAAU,KAAK;IACb,EAAE,EAAE,MAAM,CAAC;IAEX;;OAEG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAExB;;OAEG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAExB;;OAEG;IACH,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAE9B;;OAEG;IACH,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,EAAE,CAAC;IAE5B;;OAEG;IACH,UAAU,EAAE,MAAM,CAAC;IAEnB;;OAEG;IACH,UAAU,EAAE,MAAM,CAAC;IAEnB;;OAEG;IACH,IAAI,EAAE,OAAO,CAAC;IAEd;;OAEG;IACH,OAAO,EAAE,MAAM,IAAI,CAAC;IAEpB;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAE1B;;OAEG;IACH,iBAAiB,CAAC,EAAE,OAAO,CAAC;CAC7B;AAED;;GAEG;AACH,wBAAgB,WAAW,CAAC,EAC1B,EAAE,EACF,KAAK,EACL,KAAK,EACL,WAAW,EACX,UAAU,EACV,UAAU,EACV,OAAO,EACP,IAAI,EACJ,OAAO,EACP,QAAQ,EACR,iBAAyB,EAC1B,EAAE,KAAK,GAAG,GAAG,CAAC,OAAO,CAuCrB"}
|
|
@@ -7,5 +7,5 @@ import { RoundButton } from '../RoundButton/index.js';
|
|
|
7
7
|
*/
|
|
8
8
|
export function FooterPanel({ id, title, badge, description, closeLabel, storageKey, buttons, open, onClose, children, unmountWhenClosed = false }) {
|
|
9
9
|
const closeButton = (_jsx(RoundButton, { icon: faXmark, title: "Close", ariaLabel: `Close ${closeLabel}`, onClick: onClose, className: "hc-footer-panel-close" }));
|
|
10
|
-
return (_jsxs(Resizable, { id: id, open: open, onClose: onClose, closeLabel: closeLabel, storageKey: storageKey, unmountWhenClosed: unmountWhenClosed, showCloseButton: false, headerless: true, children: [_jsxs("div", { className: "hc-footer-panel flex shrink-0 items-center justify-between border-b border-separator px-3 py-2", children: [_jsxs("div", { children: [_jsxs("div", { className: "flex items-center gap-2
|
|
10
|
+
return (_jsxs(Resizable, { id: id, open: open, onClose: onClose, closeLabel: closeLabel, storageKey: storageKey, unmountWhenClosed: unmountWhenClosed, showCloseButton: false, headerless: true, children: [_jsxs("div", { className: "hc-footer-panel flex shrink-0 items-center justify-between border-b border-separator px-3 py-2", children: [_jsxs("div", { children: [_jsxs("div", { className: "flex items-center gap-2 font-medium text-text", children: [title, badge && _jsx("span", { className: "hc-footer-panel-badge font-normal text-muted", children: badge })] }), description && _jsx("span", { className: "truncate text-muted", children: description })] }), _jsxs("div", { className: "flex gap-2", children: [buttons, closeButton] })] }), _jsx("div", { className: "hc-footer-panel-body min-h-0 flex-1 overflow-auto", children: children })] }));
|
|
11
11
|
}
|
|
@@ -29,7 +29,7 @@ export function FormGroup({ label, children, htmlFor, description, error, errorI
|
|
|
29
29
|
if (layout === 'associated') {
|
|
30
30
|
const associatedClasses = labelClassName
|
|
31
31
|
? `hc-form-group ${labelClassName}`
|
|
32
|
-
: 'hc-form-group text-
|
|
32
|
+
: 'hc-form-group text-text';
|
|
33
33
|
return (_jsx("label", { htmlFor: htmlFor, className: associatedClasses, children: label }));
|
|
34
34
|
}
|
|
35
35
|
if (layout === 'checkboxAdjacent') {
|
|
@@ -38,14 +38,14 @@ export function FormGroup({ label, children, htmlFor, description, error, errorI
|
|
|
38
38
|
: 'hc-form-group flex items-start gap-2';
|
|
39
39
|
const adjacentLabelClasses = labelClassName
|
|
40
40
|
? `hc-form-group-label ${labelClassName}`
|
|
41
|
-
: 'hc-form-group-label min-w-0 flex-1 text-
|
|
41
|
+
: 'hc-form-group-label min-w-0 flex-1 text-text';
|
|
42
42
|
const linkedChildren = enhanceControl(children, { id: controlId });
|
|
43
43
|
return (_jsxs("div", { ...props, className: wrapperClasses, children: [linkedChildren, _jsx("label", { htmlFor: controlId, className: adjacentLabelClasses, children: label })] }));
|
|
44
44
|
}
|
|
45
45
|
if (layout === 'radio') {
|
|
46
46
|
const wrapperClasses = extra
|
|
47
|
-
? `hc-form-group inline-flex cursor-pointer items-center gap-1.5 text-
|
|
48
|
-
: 'hc-form-group inline-flex cursor-pointer items-center gap-1.5 text-
|
|
47
|
+
? `hc-form-group inline-flex cursor-pointer items-center gap-1.5 text-text app-no-drag ${extra}`
|
|
48
|
+
: 'hc-form-group inline-flex cursor-pointer items-center gap-1.5 text-text app-no-drag';
|
|
49
49
|
const linkedChildren = enhanceControl(children, { id: controlId });
|
|
50
50
|
return (_jsxs("label", { htmlFor: controlId, className: wrapperClasses, children: [linkedChildren, _jsx("span", { className: "hc-form-group-label", children: label })] }));
|
|
51
51
|
}
|
|
@@ -89,7 +89,7 @@ export function FormGroup({ label, children, htmlFor, description, error, errorI
|
|
|
89
89
|
id: htmlFor
|
|
90
90
|
});
|
|
91
91
|
const wrapperClasses = extra
|
|
92
|
-
? `hc-form-group flex flex-col gap-1 p-4
|
|
93
|
-
: 'hc-form-group flex flex-col gap-1 p-4
|
|
92
|
+
? `hc-form-group flex flex-col gap-1 p-4 border border-separator rounded-md ${extra}`
|
|
93
|
+
: 'hc-form-group flex flex-col gap-1 p-4 border border-separator rounded-md';
|
|
94
94
|
return (_jsxs("div", { ...props, className: wrapperClasses, children: [_jsxs("label", { htmlFor: htmlFor, className: "hc-form-group-label flex flex-col gap-1", children: [_jsx("span", { className: labelClasses(labelTone, srOnly, false), children: label }), resolvedDescriptionId ? (_jsx("p", { id: resolvedDescriptionId, className: "hc-form-group-description m-0 text-[14px] text-muted", children: description })) : null, control] }), resolvedErrorId ? (_jsx(FieldError, { id: resolvedErrorId, spacing: "field", children: error })) : null] }));
|
|
95
95
|
}
|
|
@@ -41,6 +41,6 @@ export function KeyValueEditor({ rows, onChange, placeholderKey = 'Key', placeho
|
|
|
41
41
|
});
|
|
42
42
|
return (_jsxs(Table, { className: "hc-key-value-editor", children: [_jsx(TableHeader, { className: "hc-key-value-editor-header", children: _jsxs("tr", { children: [_jsx(TableHead, { className: "w-6 p-0", children: _jsx("span", { className: "sr-only", children: "Enable" }) }), _jsx(TableHead, { children: "Key" }), _jsx(TableHead, { children: "Value" }), _jsx(TableHead, { className: "w-7 p-0" })] }) }), _jsx(TableBody, { className: "hc-key-value-editor-body", children: rows.map((row, index) => {
|
|
43
43
|
const normalizedRow = normalizeRow(row);
|
|
44
|
-
return (_jsxs("tr", { children: [_jsx(TableCell, { className: "hc-key-value-editor-cell w-6
|
|
44
|
+
return (_jsxs("tr", { children: [_jsx(TableCell, { className: "hc-key-value-editor-cell w-6 text-center", children: _jsx(Checkbox, { className: "app-no-drag", checked: normalizedRow.enabled, onChange: (e) => updateRow(index, { enabled: e.target.checked }), "aria-label": `Enable row ${index + 1}`, title: "Enable" }) }), _jsx(TableCell, { className: "hc-key-value-editor-cell", children: _jsx(AutocompleteInput, { type: "text", className: "w-full", value: normalizedRow.key, source: keySource, placeholder: placeholderKey, "aria-label": `Key, row ${index + 1}`, onChange: (key) => updateRow(index, { key }) }) }), _jsx(TableCell, { className: "hc-key-value-editor-cell", children: _jsx(VariableInput, { wrapperClassName: `${fieldFrame} w-full`, className: "app-no-drag", value: normalizedRow.value, onChange: (value) => updateRow(index, { value }), variables: variables, source: valueSource, placeholder: placeholderValue, "aria-label": `Value, row ${index + 1}`, onEditVariable: onEditVariable }) }), _jsx(TableCell, { className: "hc-key-value-editor-cell w-7 p-1 text-center", children: _jsx(Button, { type: "button", variant: "iconDanger", onClick: () => removeRow(index), title: "Remove", "aria-label": `Remove row ${index + 1}`, children: _jsx(FaIcon, { icon: faXmark, className: "h-3.5 w-3.5" }) }) })] }, index));
|
|
45
45
|
}) })] }));
|
|
46
46
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/PageHeader/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,mCAAmC,CAAC;AACxE,OAAO,KAAK,EAAE,wBAAwB,EAAE,GAAG,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAItE,UAAU,KAAM,SAAQ,IAAI,CAAC,wBAAwB,CAAC,KAAK,CAAC,EAAE,UAAU,CAAC;IACvE;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IAEd;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB;;OAEG;IACH,IAAI,CAAC,EAAE,cAAc,CAAC;IAEtB;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED;;;GAGG;AACH,wBAAgB,UAAU,CAAC,EACzB,KAAK,EACL,WAAW,EACX,IAAI,EACJ,QAAQ,EACR,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,GAAG,GAAG,CAAC,OAAO,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/PageHeader/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,mCAAmC,CAAC;AACxE,OAAO,KAAK,EAAE,wBAAwB,EAAE,GAAG,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAItE,UAAU,KAAM,SAAQ,IAAI,CAAC,wBAAwB,CAAC,KAAK,CAAC,EAAE,UAAU,CAAC;IACvE;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IAEd;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB;;OAEG;IACH,IAAI,CAAC,EAAE,cAAc,CAAC;IAEtB;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED;;;GAGG;AACH,wBAAgB,UAAU,CAAC,EACzB,KAAK,EACL,WAAW,EACX,IAAI,EACJ,QAAQ,EACR,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,GAAG,GAAG,CAAC,OAAO,CA6BrB"}
|
|
@@ -6,5 +6,5 @@ import { cn } from '../utils.js';
|
|
|
6
6
|
* and optional action controls on the right.
|
|
7
7
|
*/
|
|
8
8
|
export function PageHeader({ title, description, icon, children, className, ...props }) {
|
|
9
|
-
return (_jsxs("div", { ...props, className: cn('hc-page-header -mx-6 mb-4 flex flex-wrap items-center gap-2 border-b border-separator px-6 py-4', className), children: [_jsxs("div", { className: "hc-page-header-content min-w-0 flex-1", children: [_jsxs("h2", { className: "hc-page-header-title m-0 flex items-center gap-2 text-[22px] leading-[1.15] font-bold tracking-[-0.01em] text-text", children: [icon ? (_jsx(FaIcon, { icon: icon, className: "hc-page-header-title-icon h-4 w-4 shrink-0 text-muted", "aria-hidden": true })) : null, title] }), description ? (_jsx("p", { className: "hc-page-header-description m-0 mt-1
|
|
9
|
+
return (_jsxs("div", { ...props, className: cn('hc-page-header -mx-6 mb-4 flex flex-wrap items-center gap-2 border-b border-separator px-6 py-4', className), children: [_jsxs("div", { className: "hc-page-header-content min-w-0 flex-1", children: [_jsxs("h2", { className: "hc-page-header-title m-0 flex items-center gap-2 text-[22px] leading-[1.15] font-bold tracking-[-0.01em] text-text", children: [icon ? (_jsx(FaIcon, { icon: icon, className: "hc-page-header-title-icon h-4 w-4 shrink-0 text-muted", "aria-hidden": true })) : null, title] }), description ? (_jsx("p", { className: "hc-page-header-description m-0 mt-1 leading-6 text-muted", children: description })) : null] }), children ? (_jsx("div", { className: "hc-page-header-actions flex flex-wrap items-center gap-2", children: children })) : null] }));
|
|
10
10
|
}
|
|
@@ -9,7 +9,7 @@ import { cn, resolveTabListKeyAction } from '../utils.js';
|
|
|
9
9
|
* @param variant - Visual variant for default or destructive actions.
|
|
10
10
|
*/
|
|
11
11
|
function menuItemClass(variant) {
|
|
12
|
-
const base = 'block w-full cursor-pointer border-none bg-transparent px-3.5 py-1.5 text-left
|
|
12
|
+
const base = 'block w-full cursor-pointer border-none bg-transparent px-3.5 py-1.5 text-left app-no-drag';
|
|
13
13
|
return variant === 'danger'
|
|
14
14
|
? `${base} text-text hover:bg-danger/15 hover:text-danger`
|
|
15
15
|
: `${base} text-text hover:bg-selection`;
|
|
@@ -193,20 +193,20 @@ export function VariableInput({ value, onChange, variables, placeholder, onKeyDo
|
|
|
193
193
|
}
|
|
194
194
|
};
|
|
195
195
|
const tooltipContent = tooltip ? getVariableTooltipContent(tooltip.key, variables) : null;
|
|
196
|
-
return (_jsxs("div", { ...props, className: cn('hc-variable-input relative min-w-0', wrapperClassName ?? 'flex-1'), children: [_jsx("div", { ref: backdropRef, "aria-hidden": true, className: "hc-variable-input-backdrop pointer-events-none absolute inset-0 overflow-hidden px-2.5 py-1.5
|
|
196
|
+
return (_jsxs("div", { ...props, className: cn('hc-variable-input relative min-w-0', wrapperClassName ?? 'flex-1'), children: [_jsx("div", { ref: backdropRef, "aria-hidden": true, className: "hc-variable-input-backdrop pointer-events-none absolute inset-0 overflow-hidden px-2.5 py-1.5 whitespace-nowrap text-inherit", children: safeValue ? (tokens.map((token, index) => token.key ? (_jsx("span", { ref: (el) => {
|
|
197
197
|
if (el)
|
|
198
198
|
spanRefs.current.set(index, el);
|
|
199
199
|
else
|
|
200
200
|
spanRefs.current.delete(index);
|
|
201
201
|
}, className: "hc-variable-input-token hc-variable-input-token-variable text-[#32D2E2]", children: token.text }, index)) : (_jsx("span", { className: "hc-variable-input-token", children: token.text }, index)))) : (_jsx("span", { className: "hc-variable-input-placeholder text-muted", children: placeholder })) }), _jsx(Input, { ref: inputRef, id: id, variant: "plain", role: source ? 'combobox' : undefined, "aria-autocomplete": source ? 'list' : undefined, "aria-expanded": source ? autocompleteOpen : undefined, "aria-controls": source && autocompleteOpen ? listboxId : undefined, "aria-activedescendant": source && autocompleteOpen && autocompleteActiveIndex >= 0
|
|
202
202
|
? `${listboxId}-option-${autocompleteActiveIndex}`
|
|
203
|
-
: undefined, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, "aria-describedby": tooltip ? tooltipId : undefined, className: cn('hc-variable-input-field relative w-full min-w-0 border-none bg-transparent px-2.5 py-1.5 text-
|
|
203
|
+
: undefined, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, "aria-describedby": tooltip ? tooltipId : undefined, className: cn('hc-variable-input-field relative w-full min-w-0 border-none bg-transparent px-2.5 py-1.5 text-transparent caret-text focus-visible:shadow-none', className), type: "text", placeholder: placeholder, value: safeValue, onChange: (e) => {
|
|
204
204
|
onChange(e.target.value);
|
|
205
205
|
queueMicrotask(updateTooltipFromCaret);
|
|
206
206
|
}, onFocus: () => {
|
|
207
207
|
openAutocomplete();
|
|
208
208
|
updateTooltipFromCaret();
|
|
209
|
-
}, onBlur: closeAutocomplete, onKeyDown: handleKeyDown, onKeyUp: handleKeyUp, onSelect: updateTooltipFromCaret, onClick: updateTooltipFromCaret, onScroll: syncScroll, onMouseMove: handleMouseMove, onMouseLeave: handleMouseLeave }), source && (_jsx(SuggestionList, { open: autocompleteOpen, items: autocompleteItems, activeIndex: autocompleteActiveIndex, anchorRef: inputRef, listboxId: listboxId, onSelect: selectItem, onActiveIndexChange: setActiveIndex, onClose: closeSuggestions })), tooltip && tooltipContent && (_jsxs("div", { id: tooltipId, role: "tooltip", className: "hc-variable-input-tooltip pointer-events-auto fixed z-50 flex max-w-sm -translate-x-1/2 -translate-y-full flex-col gap-2 rounded-lg border border-separator bg-surface px-4 py-3 text-
|
|
209
|
+
}, onBlur: closeAutocomplete, onKeyDown: handleKeyDown, onKeyUp: handleKeyUp, onSelect: updateTooltipFromCaret, onClick: updateTooltipFromCaret, onScroll: syncScroll, onMouseMove: handleMouseMove, onMouseLeave: handleMouseLeave }), source && (_jsx(SuggestionList, { open: autocompleteOpen, items: autocompleteItems, activeIndex: autocompleteActiveIndex, anchorRef: inputRef, listboxId: listboxId, onSelect: selectItem, onActiveIndexChange: setActiveIndex, onClose: closeSuggestions })), tooltip && tooltipContent && (_jsxs("div", { id: tooltipId, role: "tooltip", className: "hc-variable-input-tooltip pointer-events-auto fixed z-50 flex max-w-sm -translate-x-1/2 -translate-y-full flex-col gap-2 rounded-lg border border-separator bg-surface px-4 py-3 text-text shadow-md after:pointer-events-auto after:absolute after:right-0 after:-bottom-2 after:left-0 after:h-2 after:content-['']", style: { top: tooltip.top - 4, left: tooltip.left }, onMouseEnter: cancelHide, onMouseLeave: scheduleHide, children: [_jsx(VariableTooltipValue, { value: tooltipContent.text, variableKey: tooltip.key, muted: tooltipContent.muted }), onEditVariable && (_jsx(Button, { variant: "secondary", className: "hc-variable-input-tooltip-edit self-start", "aria-label": `Edit value for ${tooltip.key}`, onClick: () => {
|
|
210
210
|
onEditVariable(tooltip.key);
|
|
211
211
|
setTooltip(null);
|
|
212
212
|
}, children: "Edit value" }))] }))] }));
|
|
@@ -74,5 +74,5 @@ export function VariableTable({ variables, onChange, description, focusKey, clas
|
|
|
74
74
|
valueInputRefs.current.set(index, element);
|
|
75
75
|
else
|
|
76
76
|
valueInputRefs.current.delete(index);
|
|
77
|
-
}, type: "text", className: "w-full", value: variable.value, placeholder: "value", "aria-label": `Value, row ${index + 1}`, onChange: (e) => updateVariable(index, { value: e.target.value }) }) }), _jsx(TableCell, { children: _jsx(Input, { type: "text", className: "w-full", value: variable.defaultValue, placeholder: "default", "aria-label": `Default, row ${index + 1}`, onChange: (e) => updateVariable(index, { defaultValue: e.target.value }) }) }), _jsx(TableCell, { className: "w-14 text-center", children: _jsx(Checkbox, { checked: variable.share, onChange: (e) => updateVariable(index, { share: e.target.checked }), "aria-label": `Include value in export, row ${index + 1}`, title: "Include value in export" }) }), _jsx(TableCell, { className: "w-7
|
|
77
|
+
}, type: "text", className: "w-full", value: variable.value, placeholder: "value", "aria-label": `Value, row ${index + 1}`, onChange: (e) => updateVariable(index, { value: e.target.value }) }) }), _jsx(TableCell, { children: _jsx(Input, { type: "text", className: "w-full", value: variable.defaultValue, placeholder: "default", "aria-label": `Default, row ${index + 1}`, onChange: (e) => updateVariable(index, { defaultValue: e.target.value }) }) }), _jsx(TableCell, { className: "w-14 text-center", children: _jsx(Checkbox, { checked: variable.share, onChange: (e) => updateVariable(index, { share: e.target.checked }), "aria-label": `Include value in export, row ${index + 1}`, title: "Include value in export" }) }), _jsx(TableCell, { className: "w-7 text-center", children: _jsx(Button, { type: "button", variant: "iconDanger", onClick: () => removeVariable(index), title: "Remove", "aria-label": `Remove row ${index + 1}`, children: _jsx(FaIcon, { icon: faXmark, className: "h-3.5 w-3.5" }) }) })] }, index))) })] }), _jsxs(Button, { type: "button", variant: "toolbar", className: "hc-variable-table-add inline-flex items-center gap-1 self-start", onClick: addVariable, children: [_jsx(FaIcon, { icon: faPlus, className: "h-3 w-3" }), "Add variable"] })] })] }));
|
|
78
78
|
}
|
|
@@ -10,8 +10,8 @@ const segmentFocusVisible = 'focus-visible:outline focus-visible:outline-2 focus
|
|
|
10
10
|
*/
|
|
11
11
|
export function segment(active) {
|
|
12
12
|
return active
|
|
13
|
-
? `cursor-pointer rounded-md border-none bg-selection px-3 py-1 text-
|
|
14
|
-
: `cursor-pointer rounded-md border-none bg-transparent px-3 py-1 text-
|
|
13
|
+
? `cursor-pointer rounded-md border-none bg-selection px-3 py-1 text-text app-no-drag ${segmentFocusVisible}`
|
|
14
|
+
: `cursor-pointer rounded-md border-none bg-transparent px-3 py-1 text-muted hover:text-text app-no-drag ${segmentFocusVisible}`;
|
|
15
15
|
}
|
|
16
16
|
/**
|
|
17
17
|
* Active/inactive surface classes for a document-style tab in the tab bar.
|
|
@@ -7,7 +7,7 @@ export type FieldVariant = 'control' | 'surface' | 'plain';
|
|
|
7
7
|
*/
|
|
8
8
|
export declare const fieldFrame = "overflow-hidden rounded-lg border border-separator bg-field";
|
|
9
9
|
/** Inset control style for standard settings and editor fields. */
|
|
10
|
-
export declare const field = "rounded-lg border border-separator bg-field px-2.5 py-1.5 text-
|
|
10
|
+
export declare const field = "rounded-lg border border-separator bg-field px-2.5 py-1.5 text-text app-no-drag";
|
|
11
11
|
/** Surface style for modal and Team Hub form fields. */
|
|
12
12
|
export declare const surfaceField = "w-full rounded-lg border border-separator bg-field px-3 py-2.5 text-[15px] text-text";
|
|
13
13
|
/** Transparent overlay checkbox input sized to {@link checkboxBox}. */
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"classes.d.ts","sourceRoot":"","sources":["../../../src/components/forms/classes.ts"],"names":[],"mappings":"AAKA;;GAEG;AACH,MAAM,MAAM,YAAY,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,CAAC;AAE3D;;GAEG;AACH,eAAO,MAAM,UAAU,gEAAgE,CAAC;AAExF,mEAAmE;AACnE,eAAO,MAAM,KAAK,
|
|
1
|
+
{"version":3,"file":"classes.d.ts","sourceRoot":"","sources":["../../../src/components/forms/classes.ts"],"names":[],"mappings":"AAKA;;GAEG;AACH,MAAM,MAAM,YAAY,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,CAAC;AAE3D;;GAEG;AACH,eAAO,MAAM,UAAU,gEAAgE,CAAC;AAExF,mEAAmE;AACnE,eAAO,MAAM,KAAK,oFACiE,CAAC;AAEpF,wDAAwD;AACxD,eAAO,MAAM,YAAY,yFAC+D,CAAC;AAEzF,uEAAuE;AACvE,eAAO,MAAM,aAAa,iGACsE,CAAC;AAEjG,qGAAqG;AACrG,eAAO,MAAM,WAAW,waAC+Y,CAAC;AAExa,oEAAoE;AACpE,eAAO,MAAM,UAAU,iGACyE,CAAC;AAEjG,kGAAkG;AAClG,eAAO,MAAM,WAAW,+XACsW,CAAC;AAE/X,6DAA6D;AAC7D,eAAO,MAAM,QAAQ,8GACwF,CAAC;AAE9G;;;;;;;GAOG;AACH,wBAAgB,iBAAiB,CAC/B,OAAO,EAAE,YAAY,EACrB,SAAS,CAAC,EAAE,MAAM,EAClB,SAAS,CAAC,EAAE,MAAM,GACjB,MAAM,GAAG,SAAS,CAOpB"}
|
|
@@ -7,7 +7,7 @@ import { cn } from '../utils.js';
|
|
|
7
7
|
*/
|
|
8
8
|
export const fieldFrame = 'overflow-hidden rounded-lg border border-separator bg-field';
|
|
9
9
|
/** Inset control style for standard settings and editor fields. */
|
|
10
|
-
export const field = 'rounded-lg border border-separator bg-field px-2.5 py-1.5 text-
|
|
10
|
+
export const field = 'rounded-lg border border-separator bg-field px-2.5 py-1.5 text-text app-no-drag';
|
|
11
11
|
/** Surface style for modal and Team Hub form fields. */
|
|
12
12
|
export const surfaceField = 'w-full rounded-lg border border-separator bg-field px-3 py-2.5 text-[15px] text-text';
|
|
13
13
|
/** Transparent overlay checkbox input sized to {@link checkboxBox}. */
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
* `RowActionsMenu` panel and its flyout `Submenu` panels.
|
|
4
4
|
*/
|
|
5
5
|
export function menuItemClass(variant, disabled) {
|
|
6
|
-
const base = 'flex w-full items-center gap-2 border-none bg-transparent px-3.5 py-1.5 text-left
|
|
6
|
+
const base = 'flex w-full items-center gap-2 border-none bg-transparent px-3.5 py-1.5 text-left app-no-drag';
|
|
7
7
|
if (disabled) {
|
|
8
8
|
return `${base} cursor-not-allowed text-muted opacity-60`;
|
|
9
9
|
}
|
package/dist/styles.css
CHANGED
|
@@ -90,3 +90,13 @@
|
|
|
90
90
|
aspect-ratio: auto;
|
|
91
91
|
border-radius: 9999px;
|
|
92
92
|
}
|
|
93
|
+
|
|
94
|
+
/**
|
|
95
|
+
* Default body text size for SDK and host renderers. Unlayered so it wins over
|
|
96
|
+
* host `@layer base` body rules. Hosts keep `:root { font-size: 14px }` as the
|
|
97
|
+
* rem base for layout; only inherited text size comes from here.
|
|
98
|
+
*/
|
|
99
|
+
body {
|
|
100
|
+
font-size: 16px;
|
|
101
|
+
line-height: 1.5;
|
|
102
|
+
}
|