@unisane/ui 0.1.1 → 0.1.2-next.97f61b1d
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/month-picker.d.ts +2 -1
- package/dist/components/month-picker.d.ts.map +1 -1
- package/dist/components/month-picker.js +4 -4
- package/dist/components/month-picker.js.map +1 -1
- package/dist/components/select-field.d.ts +2 -1
- package/dist/components/select-field.d.ts.map +1 -1
- package/dist/components/select-field.js +9 -7
- package/dist/components/select-field.js.map +1 -1
- package/dist/components/text-field.d.ts +2 -1
- package/dist/components/text-field.d.ts.map +1 -1
- package/dist/components/text-field.js +11 -9
- package/dist/components/text-field.js.map +1 -1
- package/dist/components/token-field.d.ts +3 -1
- package/dist/components/token-field.d.ts.map +1 -1
- package/dist/components/token-field.js +7 -7
- package/dist/components/token-field.js.map +1 -1
- package/dist/index.css +5 -0
- package/dist/lib/field-shell.d.ts +3 -1
- package/dist/lib/field-shell.d.ts.map +1 -1
- package/dist/lib/field-shell.js +7 -2
- package/dist/lib/field-shell.js.map +1 -1
- package/package.json +3 -3
- package/registry/components/month-picker.tsx +6 -3
- package/registry/components/select-field.tsx +31 -6
- package/registry/components/text-field.tsx +48 -23
- package/registry/components/token-field.tsx +40 -17
- package/registry/lib/field-shell.ts +19 -3
|
@@ -1,8 +1,9 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { type FieldSize } from '../lib/field-size.js';
|
|
3
|
-
import { type FieldShellVariant } from '../lib/field-shell.js';
|
|
3
|
+
import { type FieldLabelPlacement, type FieldShellVariant } from '../lib/field-shell.js';
|
|
4
4
|
export type MonthPickerProps = {
|
|
5
5
|
variant?: FieldShellVariant;
|
|
6
|
+
labelPlacement?: FieldLabelPlacement;
|
|
6
7
|
value?: string;
|
|
7
8
|
defaultValue?: string;
|
|
8
9
|
onValueChange?: (value: string) => void;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"month-picker.d.ts","sourceRoot":"","sources":["../../src/components/month-picker.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA4D,MAAM,OAAO,CAAC;AAGjF,OAAO,EAAE,KAAK,SAAS,EAAE,MAAM,mBAAmB,CAAC;AACnD,OAAO,EAAE,KAAK,iBAAiB,EAAE,MAAM,oBAAoB,CAAC;
|
|
1
|
+
{"version":3,"file":"month-picker.d.ts","sourceRoot":"","sources":["../../src/components/month-picker.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA4D,MAAM,OAAO,CAAC;AAGjF,OAAO,EAAE,KAAK,SAAS,EAAE,MAAM,mBAAmB,CAAC;AACnD,OAAO,EAAE,KAAK,mBAAmB,EAAE,KAAK,iBAAiB,EAAE,MAAM,oBAAoB,CAAC;AAyBtF,MAAM,MAAM,gBAAgB,GAAG;IAC7B,OAAO,CAAC,EAAE,iBAAiB,CAAC;IAC5B,cAAc,CAAC,EAAE,mBAAmB,CAAC;IACrC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACvC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,SAAS,CAAC;CAClB,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,gBAAgB,CAsQlD,CAAC"}
|
|
@@ -25,7 +25,7 @@ const MONTHS = [
|
|
|
25
25
|
'November',
|
|
26
26
|
'December',
|
|
27
27
|
];
|
|
28
|
-
export const MonthPicker = ({ value, defaultValue, onValueChange, open, defaultOpen = false, onOpenChange, label = 'Month', disabled = false, error = false, helperText, className, variant = 'outlined', min, max, size = 'md', }) => {
|
|
28
|
+
export const MonthPicker = ({ value, defaultValue, onValueChange, open, defaultOpen = false, onOpenChange, label = 'Month', disabled = false, error = false, helperText, className, variant = 'outlined', labelPlacement = 'floating', min, max, size = 'md', }) => {
|
|
29
29
|
const [selectedValue, setSelectedValue] = useControllableState({
|
|
30
30
|
value,
|
|
31
31
|
defaultValue: normalizeMonthValue(defaultValue) ?? '',
|
|
@@ -130,7 +130,7 @@ export const MonthPicker = ({ value, defaultValue, onValueChange, open, defaultO
|
|
|
130
130
|
openPicker();
|
|
131
131
|
}
|
|
132
132
|
}, children: _jsx("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "currentColor", "aria-hidden": "true", children: _jsx("path", { d: "M19 3h-1V1h-2v2H8V1H6v2H5c-1.11 0-1.99.9-1.99 2L3 19c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm0 16H5V8h14v11z" }) }) }));
|
|
133
|
-
return (_jsxs("div", { className: cn('relative w-full', className), ref: containerRef, children: [_jsx(TextField, { disabled: disabled, ...(error ? { errorMessage: helperText } : { description: helperText }), invalid: error, label: label, size: size, trailingIcon: pickerButton, value: inputValue, variant: variant, onClick: openPicker, onBlur: scheduleInputCommit, onValueChange: setInputValue, onFocus: () => {
|
|
133
|
+
return (_jsxs("div", { className: cn('relative w-full', className), ref: containerRef, children: [_jsx(TextField, { disabled: disabled, ...(error ? { errorMessage: helperText } : { description: helperText }), invalid: error, label: label, labelPlacement: labelPlacement, size: size, trailingIcon: pickerButton, value: inputValue, variant: variant, onClick: openPicker, onBlur: scheduleInputCommit, onValueChange: setInputValue, onFocus: () => {
|
|
134
134
|
inputFocusedRef.current = true;
|
|
135
135
|
}, onKeyDown: (event) => {
|
|
136
136
|
if (event.key === 'Enter') {
|
|
@@ -153,9 +153,9 @@ export const MonthPicker = ({ value, defaultValue, onValueChange, open, defaultO
|
|
|
153
153
|
const optionValue = `${viewYear}-${String(monthIndex + 1).padStart(2, '0')}`;
|
|
154
154
|
const selected = normalizedValue === optionValue;
|
|
155
155
|
const disabledMonth = isMonthDisabled(optionValue, normalizedMin, normalizedMax);
|
|
156
|
-
return (_jsx("button", { type: "button", disabled: disabledMonth, role: "gridcell", "aria-selected": selected, "aria-label": `${month} ${viewYear}`, className: cn('text-label-large relative min-h-10 overflow-hidden rounded-sm px-2 transition-colors', 'focus-visible:ring-focus-ring focus-visible:
|
|
156
|
+
return (_jsx("button", { type: "button", disabled: disabledMonth, role: "gridcell", "aria-selected": selected, "aria-label": `${month} ${viewYear}`, className: cn('text-label-large relative min-h-10 overflow-hidden rounded-sm px-2 transition-colors', 'focus-visible:ring-focus-ring focus-visible:outline-none focus-visible:ring-2', selected
|
|
157
157
|
? 'bg-primary text-on-primary'
|
|
158
|
-
: 'text-on-surface hover:bg-state-hover', disabledMonth && 'pointer-events-none cursor-not-allowed
|
|
158
|
+
: 'text-on-surface hover:bg-state-hover', disabledMonth && 'opacity-38 pointer-events-none cursor-not-allowed'), onClick: () => selectMonth(monthIndex), children: month.slice(0, 3) }, month));
|
|
159
159
|
}) })] }) }), document.body)
|
|
160
160
|
: null] }));
|
|
161
161
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"month-picker.js","sourceRoot":"","sources":["../../src/components/month-picker.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAc,EAAE,WAAW,EAAE,SAAS,EAAE,OAAO,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACjF,OAAO,EAAE,YAAY,EAAE,MAAM,WAAW,CAAC;AACzC,OAAO,EAAE,EAAE,EAAE,MAAM,cAAc,CAAC;AAGlC,OAAO,EAAE,mBAAmB,EAAE,MAAM,qBAAqB,CAAC;AAC1D,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAClF,OAAO,EAAE,oBAAoB,EAAE,MAAM,+BAA+B,CAAC;AACrE,OAAO,EAAE,kBAAkB,EAAE,MAAM,6BAA6B,CAAC;AACjE,OAAO,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAC;AAChD,OAAO,EAAE,IAAI,EAAE,MAAM,oBAAoB,CAAC;AAC1C,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAC3C,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAEzC,MAAM,MAAM,GAAG;IACb,SAAS;IACT,UAAU;IACV,OAAO;IACP,OAAO;IACP,KAAK;IACL,MAAM;IACN,MAAM;IACN,QAAQ;IACR,WAAW;IACX,SAAS;IACT,UAAU;IACV,UAAU;CACF,CAAC;
|
|
1
|
+
{"version":3,"file":"month-picker.js","sourceRoot":"","sources":["../../src/components/month-picker.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import { type FieldSize } from '../lib/field-size.js';
|
|
3
|
-
import { type FieldShellVariant } from '../lib/field-shell.js';
|
|
3
|
+
import { type FieldLabelPlacement, type FieldShellVariant } from '../lib/field-shell.js';
|
|
4
4
|
export interface SelectFieldOption {
|
|
5
5
|
value: string;
|
|
6
6
|
label: React.ReactNode;
|
|
@@ -35,6 +35,7 @@ type SelectFieldCommonProps = {
|
|
|
35
35
|
portal?: boolean;
|
|
36
36
|
size?: FieldSize;
|
|
37
37
|
variant?: FieldShellVariant;
|
|
38
|
+
labelPlacement?: FieldLabelPlacement;
|
|
38
39
|
className?: string;
|
|
39
40
|
triggerClassName?: string;
|
|
40
41
|
contentClassName?: string;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"select-field.d.ts","sourceRoot":"","sources":["../../src/components/select-field.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,EAAsB,KAAK,SAAS,EAAE,MAAM,mBAAmB,CAAC;AACvE,OAAO,
|
|
1
|
+
{"version":3,"file":"select-field.d.ts","sourceRoot":"","sources":["../../src/components/select-field.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,EAAsB,KAAK,SAAS,EAAE,MAAM,mBAAmB,CAAC;AACvE,OAAO,EAIL,KAAK,mBAAmB,EACxB,KAAK,iBAAiB,EACvB,MAAM,oBAAoB,CAAC;AAG5B,MAAM,WAAW,iBAAiB;IAChC,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,KAAK,sBAAsB,GACvB;IACE,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB,GACD;IACE,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,SAAS,CAAC,EAAE,KAAK,CAAC;IAClB,YAAY,EAAE,MAAM,CAAC;CACtB,CAAC;AAEN,KAAK,sBAAsB,GAAG;IAC5B,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,OAAO,EAAE,iBAAiB,EAAE,CAAC;IAC7B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACvC,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC9B,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC/B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC9B,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,OAAO,CAAC,EAAE,iBAAiB,CAAC;IAC5B,cAAc,CAAC,EAAE,mBAAmB,CAAC;IACrC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,kBAAkB,CAAC,EAAE,MAAM,CAAC;CAC7B,CAAC;AAEF,MAAM,MAAM,gBAAgB,GAAG,sBAAsB,GAAG,sBAAsB,CAAC;AAE/E,eAAO,MAAM,WAAW,4FAoKvB,CAAC"}
|
|
@@ -5,9 +5,9 @@ import { Field, FieldDescription, FieldError, FieldLabel } from './field.js';
|
|
|
5
5
|
import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from './select.js';
|
|
6
6
|
import { cn } from '../lib/utils.js';
|
|
7
7
|
import { getFieldSizeStyles } from '../lib/field-size.js';
|
|
8
|
-
import { getFieldHelperTextClasses, getFieldLabelClasses, } from '../lib/field-shell.js';
|
|
8
|
+
import { getFieldHelperTextClasses, getFieldLabelClasses, getStackedFieldLabelClasses, } from '../lib/field-shell.js';
|
|
9
9
|
import { useControllableState } from '../lib/use-controllable-state.js';
|
|
10
|
-
export const SelectField = React.forwardRef(({ 'aria-describedby': externalDescribedBy, 'aria-label': ariaLabel, className, contentClassName, defaultOpen = false, defaultValue, description, disabled = false, errorMessage, hideLabel = false, id, invalid = false, label, name, onOpenChange, onValueChange, open, options, placeholder = 'Select an option', portal = true, required = false, size = 'md', triggerClassName, value, variant = 'outlined', }, ref) => {
|
|
10
|
+
export const SelectField = React.forwardRef(({ 'aria-describedby': externalDescribedBy, 'aria-label': ariaLabel, className, contentClassName, defaultOpen = false, defaultValue, description, disabled = false, errorMessage, hideLabel = false, id, invalid = false, label, name, onOpenChange, onValueChange, open, options, placeholder = 'Select an option', portal = true, required = false, size = 'md', triggerClassName, value, variant = 'outlined', labelPlacement = 'floating', }, ref) => {
|
|
11
11
|
const generatedId = React.useId();
|
|
12
12
|
const fieldId = id ?? `select-field-${generatedId}`;
|
|
13
13
|
const labelId = label ? `${fieldId}-label` : undefined;
|
|
@@ -28,10 +28,10 @@ export const SelectField = React.forwardRef(({ 'aria-describedby': externalDescr
|
|
|
28
28
|
onChange: onOpenChange,
|
|
29
29
|
});
|
|
30
30
|
const isOpen = openState ?? false;
|
|
31
|
-
const isFloating = hideLabel || isOpen || Boolean(selectedValue);
|
|
32
|
-
return (_jsxs(Field, { className: className, invalid: resolvedInvalid, children: [_jsxs(Select, { value: selectedValue, onValueChange: setSelectedValue, open: isOpen, onOpenChange: setOpenState, disabled: disabled, required: required, name: name, children: [_jsxs("div", { className: "relative", children: [_jsx(SelectTrigger, { ref: ref, id: fieldId, variant: variant, size: size, invalid: resolvedInvalid, "aria-label": ariaLabel, "aria-labelledby": labelId, "aria-describedby": describedBy, className: triggerClassName, children: _jsx("span", { className: cn('pointer-events-none flex h-full min-w-0 items-center', fieldSize.horizontalPadding, fieldSize.valueText, variant === 'filled' && label
|
|
31
|
+
const isFloating = labelPlacement === 'stacked' || hideLabel || isOpen || Boolean(selectedValue);
|
|
32
|
+
return (_jsxs(Field, { className: className, invalid: resolvedInvalid, children: [label && labelPlacement === 'stacked' ? (_jsx(FieldLabel, { id: labelId, htmlFor: fieldId, required: required, className: hideLabel ? 'sr-only' : getStackedFieldLabelClasses(size, resolvedInvalid, disabled), children: label })) : null, _jsxs(Select, { value: selectedValue, onValueChange: setSelectedValue, open: isOpen, onOpenChange: setOpenState, disabled: disabled, required: required, name: name, children: [_jsxs("div", { className: "relative", children: [_jsx(SelectTrigger, { ref: ref, id: fieldId, variant: variant, size: size, invalid: resolvedInvalid, "aria-label": ariaLabel, "aria-labelledby": labelId, "aria-describedby": describedBy, className: triggerClassName, children: _jsx("span", { className: cn('pointer-events-none flex h-full min-w-0 items-center', fieldSize.horizontalPadding, fieldSize.valueText, variant === 'filled' && labelPlacement === 'floating' && label
|
|
33
33
|
? cn('items-end', fieldSize.filledDisplayPadding)
|
|
34
|
-
: ''), children: _jsx(SelectValue, { placeholder: isFloating || !label ? placeholder : undefined }) }) }), label ? (_jsx(FieldLabel, { id: labelId, htmlFor: fieldId, required: required, className: hideLabel
|
|
34
|
+
: ''), children: _jsx(SelectValue, { placeholder: isFloating || !label ? placeholder : undefined }) }) }), label && labelPlacement === 'floating' ? (_jsx(FieldLabel, { id: labelId, htmlFor: fieldId, required: required, className: hideLabel
|
|
35
35
|
? 'sr-only'
|
|
36
36
|
: getFieldLabelClasses({
|
|
37
37
|
size,
|
|
@@ -39,8 +39,10 @@ export const SelectField = React.forwardRef(({ 'aria-describedby': externalDescr
|
|
|
39
39
|
floating: isFloating,
|
|
40
40
|
error: resolvedInvalid,
|
|
41
41
|
active: isOpen,
|
|
42
|
-
floatingClassName: variant === 'filled'
|
|
43
|
-
|
|
42
|
+
floatingClassName: variant === 'filled' && labelPlacement === 'floating'
|
|
43
|
+
? fieldSize.filledDisplayFloatingLabel
|
|
44
|
+
: undefined,
|
|
45
|
+
}), children: label })) : null] }), _jsxs(SelectContent, { portal: portal, className: contentClassName, children: [options.map((option) => (_jsx(SelectItem, { value: option.value, disabled: option.disabled, textValue: option.textValue ?? getOptionTextValue(option), children: option.label }, option.value))), options.length === 0 ? (_jsx("div", { className: "text-label-medium text-on-surface-variant px-3 py-3 font-medium", children: "No options" })) : null] })] }), errorMessage ? (_jsx(FieldError, { id: errorId, className: getFieldHelperTextClasses(size, true, labelPlacement), children: errorMessage })) : description ? (_jsx(FieldDescription, { id: descriptionId, className: getFieldHelperTextClasses(size, false, labelPlacement), children: description })) : null] }));
|
|
44
46
|
});
|
|
45
47
|
SelectField.displayName = 'SelectField';
|
|
46
48
|
function mergeIds(...ids) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"select-field.js","sourceRoot":"","sources":["../../src/components/select-field.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,KAAK,EAAE,gBAAgB,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAC1E,OAAO,EAAE,MAAM,EAAE,aAAa,EAAE,UAAU,EAAE,aAAa,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AACzF,OAAO,EAAE,EAAE,EAAE,MAAM,cAAc,CAAC;AAClC,OAAO,EAAE,kBAAkB,EAAkB,MAAM,mBAAmB,CAAC;AACvE,OAAO,EACL,yBAAyB,EACzB,oBAAoB,
|
|
1
|
+
{"version":3,"file":"select-field.js","sourceRoot":"","sources":["../../src/components/select-field.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import { type FieldSize } from '../lib/field-size.js';
|
|
3
|
-
import { type FieldShellVariant } from '../lib/field-shell.js';
|
|
3
|
+
import { type FieldLabelPlacement, type FieldShellVariant } from '../lib/field-shell.js';
|
|
4
4
|
type TextFieldControl = HTMLInputElement | HTMLTextAreaElement;
|
|
5
5
|
type TextFieldCommonProps = {
|
|
6
6
|
autoResize?: boolean;
|
|
@@ -18,6 +18,7 @@ type TextFieldCommonProps = {
|
|
|
18
18
|
trailingIcon?: React.ReactNode;
|
|
19
19
|
value?: string | number;
|
|
20
20
|
variant?: FieldShellVariant;
|
|
21
|
+
labelPlacement?: FieldLabelPlacement;
|
|
21
22
|
};
|
|
22
23
|
type ReplacedNativeProps = 'children' | 'className' | 'defaultValue' | 'onChange' | 'size' | 'value';
|
|
23
24
|
type TextFieldEvents = Omit<React.DOMAttributes<TextFieldControl>, 'children' | 'dangerouslySetInnerHTML' | 'onChange'>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"text-field.d.ts","sourceRoot":"","sources":["../../src/components/text-field.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAsB,KAAK,SAAS,EAAE,MAAM,mBAAmB,CAAC;AACvE,OAAO,
|
|
1
|
+
{"version":3,"file":"text-field.d.ts","sourceRoot":"","sources":["../../src/components/text-field.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAsB,KAAK,SAAS,EAAE,MAAM,mBAAmB,CAAC;AACvE,OAAO,EAML,KAAK,mBAAmB,EACxB,KAAK,iBAAiB,EACvB,MAAM,oBAAoB,CAAC;AAE5B,KAAK,gBAAgB,GAAG,gBAAgB,GAAG,mBAAmB,CAAC;AAE/D,KAAK,oBAAoB,GAAG;IAC1B,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,YAAY,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC/B,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC9B,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC/B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC9B,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC/B,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB,OAAO,CAAC,EAAE,iBAAiB,CAAC;IAC5B,cAAc,CAAC,EAAE,mBAAmB,CAAC;CACtC,CAAC;AAEF,KAAK,mBAAmB,GACpB,UAAU,GACV,WAAW,GACX,cAAc,GACd,UAAU,GACV,MAAM,GACN,OAAO,CAAC;AAEZ,KAAK,eAAe,GAAG,IAAI,CACzB,KAAK,CAAC,aAAa,CAAC,gBAAgB,CAAC,EACrC,UAAU,GAAG,yBAAyB,GAAG,UAAU,CACpD,CAAC;AAEF,KAAK,wBAAwB,GAAG,IAAI,CAClC,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EAC3C,mBAAmB,GAAG,MAAM,KAAK,CAAC,aAAa,CAAC,gBAAgB,CAAC,CAClE,CAAC;AAEF,KAAK,2BAA2B,GAAG,IAAI,CACrC,KAAK,CAAC,sBAAsB,CAAC,mBAAmB,CAAC,EACjD,mBAAmB,GAAG,MAAM,KAAK,CAAC,aAAa,CAAC,mBAAmB,CAAC,CACrE,CAAC;AAEF,MAAM,MAAM,cAAc,GAAG,oBAAoB,GAC/C,eAAe,GACf,CAAC,wBAAwB,GAAG,2BAA2B,CAAC,GAAG;IACzD,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB,CAAC;AAEJ,eAAO,MAAM,SAAS,yFAwNrB,CAAC"}
|
|
@@ -4,9 +4,9 @@ import * as React from 'react';
|
|
|
4
4
|
import { Field, FieldDescription, FieldError, FieldLabel } from './field.js';
|
|
5
5
|
import { cn } from '../lib/utils.js';
|
|
6
6
|
import { getFieldSizeStyles } from '../lib/field-size.js';
|
|
7
|
-
import { fieldContainerVariants, getFieldAffixClasses, getFieldHelperTextClasses, getFieldLabelClasses, } from '../lib/field-shell.js';
|
|
7
|
+
import { fieldContainerVariants, getFieldAffixClasses, getFieldHelperTextClasses, getFieldLabelClasses, getStackedFieldLabelClasses, } from '../lib/field-shell.js';
|
|
8
8
|
export const TextField = React.forwardRef((props, forwardedRef) => {
|
|
9
|
-
const { autoResize = false, autoResizeMaxHeight = 360, className, defaultValue = '', description, errorMessage, hideLabel = false, invalid = false, label, leadingIcon, multiline = false, onValueChange, size = 'md', trailingIcon, value, variant = 'outlined', ...nativeControlProps } = props;
|
|
9
|
+
const { autoResize = false, autoResizeMaxHeight = 360, className, defaultValue = '', description, errorMessage, hideLabel = false, invalid = false, label, leadingIcon, multiline = false, onValueChange, size = 'md', trailingIcon, value, variant = 'outlined', labelPlacement = 'floating', ...nativeControlProps } = props;
|
|
10
10
|
const inputProps = nativeControlProps;
|
|
11
11
|
const textareaProps = nativeControlProps;
|
|
12
12
|
const id = nativeControlProps.id;
|
|
@@ -27,7 +27,7 @@ export const TextField = React.forwardRef((props, forwardedRef) => {
|
|
|
27
27
|
const [uncontrolledValue, setUncontrolledValue] = React.useState(String(defaultValue));
|
|
28
28
|
const currentValue = value === undefined ? uncontrolledValue : String(value);
|
|
29
29
|
const hasValue = currentValue.length > 0;
|
|
30
|
-
const isFloating = hideLabel || Boolean(placeholder) || isFocused || hasValue;
|
|
30
|
+
const isFloating = labelPlacement === 'stacked' || hideLabel || Boolean(placeholder) || isFocused || hasValue;
|
|
31
31
|
const setControlRef = React.useCallback((node) => {
|
|
32
32
|
internalRef.current = node;
|
|
33
33
|
if (typeof forwardedRef === 'function') {
|
|
@@ -48,14 +48,16 @@ export const TextField = React.forwardRef((props, forwardedRef) => {
|
|
|
48
48
|
}
|
|
49
49
|
onValueChange?.(nextValue);
|
|
50
50
|
}
|
|
51
|
-
const controlClasses = cn('unisane-text-field-control text-on-surface caret-primary h-full w-full border-none bg-transparent outline-none focus:ring-0', 'placeholder:text-on-surface-variant', fieldSize.horizontalPadding, fieldSize.valueText, variant === 'filled' ? fieldSize.filledInputPadding : '');
|
|
52
|
-
return (_jsxs(Field, { className: className, invalid: resolvedInvalid, children: [_jsxs("div", { className: cn(fieldContainerVariants({ variant, error: resolvedInvalid, disabled }), multiline ? 'items-start py-0' : ['items-center', fieldSize.containerHeight]), children: [leadingIcon ? (_jsx("span", { className: getFieldAffixClasses({
|
|
51
|
+
const controlClasses = cn('unisane-text-field-control text-on-surface caret-primary h-full w-full border-none bg-transparent outline-none focus:ring-0', 'placeholder:text-on-surface-variant', fieldSize.horizontalPadding, fieldSize.valueText, labelPlacement === 'stacked' && 'tracking-normal', variant === 'filled' && labelPlacement === 'floating' ? fieldSize.filledInputPadding : '');
|
|
52
|
+
return (_jsxs(Field, { className: className, invalid: resolvedInvalid, children: [labelPlacement === 'stacked' && !hideLabel ? (_jsx(FieldLabel, { htmlFor: fieldId, required: required, className: getStackedFieldLabelClasses(size, resolvedInvalid, disabled), children: label })) : null, _jsxs("div", { className: cn(fieldContainerVariants({ variant, error: resolvedInvalid, disabled }), multiline ? 'items-start py-0' : ['items-center', fieldSize.containerHeight]), children: [leadingIcon ? (_jsx("span", { className: getFieldAffixClasses({
|
|
53
53
|
size,
|
|
54
54
|
error: resolvedInvalid,
|
|
55
55
|
active: isFocused,
|
|
56
56
|
multiline,
|
|
57
57
|
side: 'leading',
|
|
58
|
-
}), children: _jsx("span", { className: cn(fieldSize.iconSize, 'flex items-center justify-center'), children: leadingIcon }) })) : null, _jsxs("div", { className: "relative h-full min-w-0 flex-1", children: [multiline ? (_jsx("textarea", { ...textareaProps, ref: setControlRef, id: fieldId, value: value, defaultValue: value === undefined ? defaultValue : undefined, "aria-describedby": describedBy, "aria-invalid": resolvedInvalid || undefined, className: cn(controlClasses, 'min-h-24 resize-none', fieldSize.multilinePaddingY, variant === 'filled'
|
|
58
|
+
}), children: _jsx("span", { className: cn(fieldSize.iconSize, 'flex items-center justify-center'), children: leadingIcon }) })) : null, _jsxs("div", { className: "relative h-full min-w-0 flex-1", children: [multiline ? (_jsx("textarea", { ...textareaProps, ref: setControlRef, id: fieldId, value: value, defaultValue: value === undefined ? defaultValue : undefined, "aria-describedby": describedBy, "aria-invalid": resolvedInvalid || undefined, className: cn(controlClasses, 'min-h-24 resize-none', fieldSize.multilinePaddingY, variant === 'filled' && labelPlacement === 'floating'
|
|
59
|
+
? fieldSize.filledTextareaPadding
|
|
60
|
+
: ''), onBlur: (event) => {
|
|
59
61
|
setIsFocused(false);
|
|
60
62
|
textareaProps.onBlur?.(event);
|
|
61
63
|
}, onChange: (event) => {
|
|
@@ -71,7 +73,7 @@ export const TextField = React.forwardRef((props, forwardedRef) => {
|
|
|
71
73
|
}, onChange: (event) => handleValueChange(event.currentTarget.value), onFocus: (event) => {
|
|
72
74
|
setIsFocused(true);
|
|
73
75
|
inputProps.onFocus?.(event);
|
|
74
|
-
} })), _jsx(FieldLabel, { htmlFor: fieldId, required: required, className: hideLabel
|
|
76
|
+
} })), labelPlacement === 'floating' || hideLabel ? (_jsx(FieldLabel, { htmlFor: fieldId, required: required, className: hideLabel || labelPlacement === 'stacked'
|
|
75
77
|
? 'sr-only'
|
|
76
78
|
: getFieldLabelClasses({
|
|
77
79
|
size,
|
|
@@ -80,12 +82,12 @@ export const TextField = React.forwardRef((props, forwardedRef) => {
|
|
|
80
82
|
error: resolvedInvalid,
|
|
81
83
|
active: isFocused,
|
|
82
84
|
multiline,
|
|
83
|
-
}), children: label })] }), trailingIcon ? (_jsx("span", { className: getFieldAffixClasses({
|
|
85
|
+
}), children: label })) : null] }), trailingIcon ? (_jsx("span", { className: getFieldAffixClasses({
|
|
84
86
|
size,
|
|
85
87
|
error: resolvedInvalid,
|
|
86
88
|
multiline,
|
|
87
89
|
side: 'trailing',
|
|
88
|
-
}), children: _jsx("span", { className: cn(fieldSize.iconSize, 'flex items-center justify-center'), children: trailingIcon }) })) : null] }), errorMessage ? (_jsx(FieldError, { id: errorId, className: getFieldHelperTextClasses(size, true), children: errorMessage })) : description ? (_jsx(FieldDescription, { id: descriptionId, className: getFieldHelperTextClasses(size), children: description })) : null] }));
|
|
90
|
+
}), children: _jsx("span", { className: cn(fieldSize.iconSize, 'flex items-center justify-center'), children: trailingIcon }) })) : null] }), errorMessage ? (_jsx(FieldError, { id: errorId, className: getFieldHelperTextClasses(size, true, labelPlacement), children: errorMessage })) : description ? (_jsx(FieldDescription, { id: descriptionId, className: getFieldHelperTextClasses(size, false, labelPlacement), children: description })) : null] }));
|
|
89
91
|
});
|
|
90
92
|
TextField.displayName = 'TextField';
|
|
91
93
|
function mergeIds(...ids) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"text-field.js","sourceRoot":"","sources":["../../src/components/text-field.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,KAAK,EAAE,gBAAgB,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAC1E,OAAO,EAAE,EAAE,EAAE,MAAM,cAAc,CAAC;AAClC,OAAO,EAAE,kBAAkB,EAAkB,MAAM,mBAAmB,CAAC;AACvE,OAAO,EACL,sBAAsB,EACtB,oBAAoB,EACpB,yBAAyB,EACzB,oBAAoB,
|
|
1
|
+
{"version":3,"file":"text-field.js","sourceRoot":"","sources":["../../src/components/text-field.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import React, { type InputHTMLAttributes } from 'react';
|
|
2
2
|
import { type FieldSize } from '../lib/field-size.js';
|
|
3
|
-
import { type FieldShellVariant } from '../lib/field-shell.js';
|
|
3
|
+
import { type FieldLabelPlacement, type FieldShellVariant } from '../lib/field-shell.js';
|
|
4
4
|
type TokenFieldInputProps = Omit<InputHTMLAttributes<HTMLInputElement>, 'defaultValue' | 'value' | 'onChange' | 'size'>;
|
|
5
5
|
export type TokenFieldProps = TokenFieldInputProps & {
|
|
6
6
|
value?: readonly string[];
|
|
@@ -8,6 +8,7 @@ export type TokenFieldProps = TokenFieldInputProps & {
|
|
|
8
8
|
onValueChange?: (value: string[]) => void;
|
|
9
9
|
label: string;
|
|
10
10
|
variant?: FieldShellVariant;
|
|
11
|
+
labelPlacement?: FieldLabelPlacement;
|
|
11
12
|
size?: FieldSize;
|
|
12
13
|
error?: boolean;
|
|
13
14
|
helperText?: string;
|
|
@@ -28,6 +29,7 @@ export declare const TokenField: React.ForwardRefExoticComponent<TokenFieldInput
|
|
|
28
29
|
onValueChange?: (value: string[]) => void;
|
|
29
30
|
label: string;
|
|
30
31
|
variant?: FieldShellVariant;
|
|
32
|
+
labelPlacement?: FieldLabelPlacement;
|
|
31
33
|
size?: FieldSize;
|
|
32
34
|
error?: boolean;
|
|
33
35
|
helperText?: string;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"token-field.d.ts","sourceRoot":"","sources":["../../src/components/token-field.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,EAGZ,KAAK,mBAAmB,EAKzB,MAAM,OAAO,CAAC;AAGf,OAAO,EAAsB,KAAK,SAAS,EAAE,MAAM,mBAAmB,CAAC;AACvE,OAAO,
|
|
1
|
+
{"version":3,"file":"token-field.d.ts","sourceRoot":"","sources":["../../src/components/token-field.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,EAGZ,KAAK,mBAAmB,EAKzB,MAAM,OAAO,CAAC;AAGf,OAAO,EAAsB,KAAK,SAAS,EAAE,MAAM,mBAAmB,CAAC;AACvE,OAAO,EAML,KAAK,mBAAmB,EACxB,KAAK,iBAAiB,EACvB,MAAM,oBAAoB,CAAC;AAG5B,KAAK,oBAAoB,GAAG,IAAI,CAC9B,mBAAmB,CAAC,gBAAgB,CAAC,EACrC,cAAc,GAAG,OAAO,GAAG,UAAU,GAAG,MAAM,CAC/C,CAAC;AAEF,MAAM,MAAM,eAAe,GAAG,oBAAoB,GAAG;IACnD,KAAK,CAAC,EAAE,SAAS,MAAM,EAAE,CAAC;IAC1B,YAAY,CAAC,EAAE,SAAS,MAAM,EAAE,CAAC;IACjC,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IAC1C,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,iBAAiB,CAAC;IAC5B,cAAc,CAAC,EAAE,mBAAmB,CAAC;IACrC,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC9B,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC/B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,UAAU,CAAC,EAAE,SAAS,MAAM,EAAE,CAAC;IAC/B,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,SAAS,MAAM,EAAE,KAAK,MAAM,GAAG,IAAI,GAAG,SAAS,CAAC;IACxF,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;IAC3C,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB,CAAC;AAIF,eAAO,MAAM,UAAU;YAvBb,SAAS,MAAM,EAAE;mBACV,SAAS,MAAM,EAAE;oBAChB,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,IAAI;WAClC,MAAM;cACH,iBAAiB;qBACV,mBAAmB;WAC7B,SAAS;YACR,OAAO;iBACF,MAAM;kBACL,KAAK,CAAC,SAAS;mBACd,KAAK,CAAC,SAAS;gBAClB,MAAM;sBACA,OAAO;iBACZ,SAAS,MAAM,EAAE;oBACd,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,SAAS,MAAM,EAAE,KAAK,MAAM,GAAG,IAAI,GAAG,SAAS;qBACtE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM;qBACzB,MAAM;cACb,MAAM;qBACC,MAAM;wCAyXxB,CAAC;AAIF,wBAAgB,wBAAwB,CAAC,KAAK,EAAE,MAAM,UAErD;AAED,wBAAgB,oBAAoB,CAAC,KAAK,EAAE,MAAM,YAKjD"}
|
|
@@ -4,10 +4,10 @@ import React, { useEffect, useRef, useState, } from 'react';
|
|
|
4
4
|
import { Chip } from './chip.js';
|
|
5
5
|
import { cn } from '../lib/utils.js';
|
|
6
6
|
import { getFieldSizeStyles } from '../lib/field-size.js';
|
|
7
|
-
import { fieldContainerVariants, getFieldAffixClasses, getFieldHelperTextClasses, getFieldLabelClasses, } from '../lib/field-shell.js';
|
|
7
|
+
import { fieldContainerVariants, getFieldAffixClasses, getFieldHelperTextClasses, getFieldLabelClasses, getStackedFieldLabelClasses, } from '../lib/field-shell.js';
|
|
8
8
|
import { useFieldState } from '../lib/use-field-state.js';
|
|
9
9
|
const DEFAULT_SEPARATORS = ['Enter', ',', ';'];
|
|
10
|
-
export const TokenField = React.forwardRef(({ value, defaultValue, onValueChange, label, variant = 'outlined', size = 'md', error, helperText, leadingIcon, trailingIcon, maxTokens, allowDuplicates = false, separators = DEFAULT_SEPARATORS, validateToken, normalizeToken = normalizeTokenFieldToken, labelClassName, labelBg, inputClassName, className, id, disabled, placeholder, onFocus, onBlur, onKeyDown, onPaste, ...props }, ref) => {
|
|
10
|
+
export const TokenField = React.forwardRef(({ value, defaultValue, onValueChange, label, variant = 'outlined', labelPlacement = 'floating', size = 'md', error, helperText, leadingIcon, trailingIcon, maxTokens, allowDuplicates = false, separators = DEFAULT_SEPARATORS, validateToken, normalizeToken = normalizeTokenFieldToken, labelClassName, labelBg, inputClassName, className, id, disabled, placeholder, onFocus, onBlur, onKeyDown, onPaste, ...props }, ref) => {
|
|
11
11
|
const rootRef = useRef(null);
|
|
12
12
|
const inputRef = useRef(null);
|
|
13
13
|
const tokenRefs = useRef([]);
|
|
@@ -176,13 +176,13 @@ export const TokenField = React.forwardRef(({ value, defaultValue, onValueChange
|
|
|
176
176
|
addTokens(pastedTokens);
|
|
177
177
|
setDraft('');
|
|
178
178
|
};
|
|
179
|
-
return (_jsxs("div", { ref: setRootRef, className: cn('relative inline-flex w-full flex-col', className), onBlur: handleRootBlur, children: [_jsxs("div", { className: cn(fieldContainerVariants({ variant, error: effectiveError, disabled }), 'min-h-10 items-start py-0', size === 'sm' && 'min-h-8', size === 'lg' && 'min-h-12'), onClick: focusInput, children: [leadingIcon && (_jsx("span", { className: getFieldAffixClasses({
|
|
179
|
+
return (_jsxs("div", { ref: setRootRef, className: cn('relative inline-flex w-full flex-col', className), onBlur: handleRootBlur, children: [labelPlacement === 'stacked' ? (_jsx("label", { htmlFor: fieldId, className: cn(getStackedFieldLabelClasses(size, effectiveError, disabled), labelClassName), children: label })) : null, _jsxs("div", { className: cn(fieldContainerVariants({ variant, error: effectiveError, disabled }), 'min-h-10 items-start py-0', size === 'sm' && 'min-h-8', size === 'lg' && 'min-h-12'), onClick: focusInput, children: [leadingIcon && (_jsx("span", { className: getFieldAffixClasses({
|
|
180
180
|
size,
|
|
181
181
|
error: effectiveError,
|
|
182
182
|
active: isFocused,
|
|
183
183
|
multiline: true,
|
|
184
184
|
side: 'leading',
|
|
185
|
-
}), children: _jsx("div", { className: cn(fieldSize.iconSize, 'flex items-center justify-center'), children: leadingIcon }) })), _jsxs("div", { className: "relative min-h-full min-w-0 flex-1", children: [_jsxs("div", { className: cn('flex min-h-full w-full flex-wrap items-center gap-1.5', fieldSize.horizontalPadding, getTokenFieldContentPadding(size, variant)), children: [tokens.length ? (_jsx("span", { className: "contents", role: "list", "aria-label": `${label} values`, children: tokens.map((token, index) => (_jsx("span", { role: "listitem", children: _jsx(Chip, { ref: (node) => {
|
|
185
|
+
}), children: _jsx("div", { className: cn(fieldSize.iconSize, 'flex items-center justify-center'), children: leadingIcon }) })), _jsxs("div", { className: "relative min-h-full min-w-0 flex-1", children: [_jsxs("div", { className: cn('flex min-h-full w-full flex-wrap items-center gap-1.5', fieldSize.horizontalPadding, getTokenFieldContentPadding(size, labelPlacement === 'stacked' ? 'outlined' : variant)), children: [tokens.length ? (_jsx("span", { className: "contents", role: "list", "aria-label": `${label} values`, children: tokens.map((token, index) => (_jsx("span", { role: "listitem", children: _jsx(Chip, { ref: (node) => {
|
|
186
186
|
tokenRefs.current[index] = node;
|
|
187
187
|
}, "aria-label": `${token}. Press Delete to remove.`, deleteButtonTabIndex: -1, disabled: disabled, label: token, tabIndex: activeTokenIndex === index ? 0 : -1, variant: "input", onDelete: () => removeToken(index), onFocus: () => setActiveTokenIndex(index), onKeyDown: (event) => handleTokenKeyDown(event, index) }) }, `${token}:${index}`))) })) : null, _jsx("input", { ref: inputRef, id: fieldId, value: draft, disabled: disabled || atTokenLimit, placeholder: isFloating ? placeholder : ' ', "aria-describedby": helperId, "aria-invalid": effectiveError || undefined, className: cn('unisane-text-field-control text-on-surface caret-primary placeholder:text-on-surface-variant min-w-24 flex-1 border-none bg-transparent outline-none focus:ring-0 disabled:cursor-not-allowed', fieldSize.valueText, inputClassName), onFocus: (event) => {
|
|
188
188
|
setIsFocused(true);
|
|
@@ -194,7 +194,7 @@ export const TokenField = React.forwardRef(({ value, defaultValue, onValueChange
|
|
|
194
194
|
}, onChange: (event) => {
|
|
195
195
|
setValidationMessage(null);
|
|
196
196
|
setDraft(event.currentTarget.value);
|
|
197
|
-
}, onKeyDown: handleKeyDown, onPaste: handlePaste, ...props })] }), _jsx("label", { htmlFor: fieldId, className: getFieldLabelClasses({
|
|
197
|
+
}, onKeyDown: handleKeyDown, onPaste: handlePaste, ...props })] }), labelPlacement === 'floating' ? (_jsx("label", { htmlFor: fieldId, className: getFieldLabelClasses({
|
|
198
198
|
size,
|
|
199
199
|
variant,
|
|
200
200
|
floating: isFloating,
|
|
@@ -203,12 +203,12 @@ export const TokenField = React.forwardRef(({ value, defaultValue, onValueChange
|
|
|
203
203
|
multiline: true,
|
|
204
204
|
labelBg,
|
|
205
205
|
labelClassName,
|
|
206
|
-
}), children: label })] }), trailingIcon && (_jsx("span", { className: getFieldAffixClasses({
|
|
206
|
+
}), children: label })) : null] }), trailingIcon && (_jsx("span", { className: getFieldAffixClasses({
|
|
207
207
|
size,
|
|
208
208
|
error: effectiveError,
|
|
209
209
|
multiline: true,
|
|
210
210
|
side: 'trailing',
|
|
211
|
-
}), children: _jsx("div", { className: cn(fieldSize.iconSize, 'flex items-center justify-center'), children: trailingIcon }) }))] }), effectiveHelperText && (_jsx("span", { id: helperId, className: getFieldHelperTextClasses(size, effectiveError), children: effectiveHelperText }))] }));
|
|
211
|
+
}), children: _jsx("div", { className: cn(fieldSize.iconSize, 'flex items-center justify-center'), children: trailingIcon }) }))] }), effectiveHelperText && (_jsx("span", { id: helperId, className: getFieldHelperTextClasses(size, effectiveError, labelPlacement), children: effectiveHelperText }))] }));
|
|
212
212
|
});
|
|
213
213
|
TokenField.displayName = 'TokenField';
|
|
214
214
|
export function normalizeTokenFieldToken(token) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"token-field.js","sourceRoot":"","sources":["../../src/components/token-field.tsx"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"token-field.js","sourceRoot":"","sources":["../../src/components/token-field.tsx"],"names":[],"mappings":"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"}
|
package/dist/index.css
CHANGED
|
@@ -21,6 +21,7 @@
|
|
|
21
21
|
--font-weight-bold: 700;
|
|
22
22
|
--font-weight-extrabold: 800;
|
|
23
23
|
--font-weight-black: 900;
|
|
24
|
+
--tracking-normal: 0em;
|
|
24
25
|
--tracking-wide: 0.025em;
|
|
25
26
|
--tracking-wider: 0.05em;
|
|
26
27
|
--tracking-widest: 0.1em;
|
|
@@ -2233,6 +2234,10 @@
|
|
|
2233
2234
|
--tw-font-weight: var(--font-weight-thin);
|
|
2234
2235
|
font-weight: var(--font-weight-thin);
|
|
2235
2236
|
}
|
|
2237
|
+
.tracking-normal {
|
|
2238
|
+
--tw-tracking: var(--tracking-normal);
|
|
2239
|
+
letter-spacing: var(--tracking-normal);
|
|
2240
|
+
}
|
|
2236
2241
|
.tracking-wide {
|
|
2237
2242
|
--tw-tracking: var(--tracking-wide);
|
|
2238
2243
|
letter-spacing: var(--tracking-wide);
|
|
@@ -1,5 +1,7 @@
|
|
|
1
1
|
import { type FieldSize } from './field-size.js';
|
|
2
2
|
export type FieldShellVariant = 'outlined' | 'filled';
|
|
3
|
+
export type FieldLabelPlacement = 'floating' | 'stacked';
|
|
4
|
+
export declare function getStackedFieldLabelClasses(size: FieldSize, error?: boolean, disabled?: boolean): string;
|
|
3
5
|
export declare const fieldContainerVariants: (props?: ({
|
|
4
6
|
variant?: "filled" | "outlined" | null | undefined;
|
|
5
7
|
error?: boolean | null | undefined;
|
|
@@ -26,6 +28,6 @@ type FieldAffixClassOptions = {
|
|
|
26
28
|
side: 'leading' | 'trailing';
|
|
27
29
|
};
|
|
28
30
|
export declare function getFieldAffixClasses({ size, error, active, multiline, side, }: FieldAffixClassOptions): string;
|
|
29
|
-
export declare function getFieldHelperTextClasses(size?: FieldSize, error?: boolean): string;
|
|
31
|
+
export declare function getFieldHelperTextClasses(size?: FieldSize, error?: boolean, labelPlacement?: FieldLabelPlacement): string;
|
|
30
32
|
export {};
|
|
31
33
|
//# sourceMappingURL=field-shell.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"field-shell.d.ts","sourceRoot":"","sources":["../../src/lib/field-shell.ts"],"names":[],"mappings":"AAIA,OAAO,EAAsB,KAAK,SAAS,EAAE,MAAM,cAAc,CAAC;AAElE,MAAM,MAAM,iBAAiB,GAAG,UAAU,GAAG,QAAQ,CAAC;
|
|
1
|
+
{"version":3,"file":"field-shell.d.ts","sourceRoot":"","sources":["../../src/lib/field-shell.ts"],"names":[],"mappings":"AAIA,OAAO,EAAsB,KAAK,SAAS,EAAE,MAAM,cAAc,CAAC;AAElE,MAAM,MAAM,iBAAiB,GAAG,UAAU,GAAG,QAAQ,CAAC;AACtD,MAAM,MAAM,mBAAmB,GAAG,UAAU,GAAG,SAAS,CAAC;AAEzD,wBAAgB,2BAA2B,CAAC,IAAI,EAAE,SAAS,EAAE,KAAK,UAAQ,EAAE,QAAQ,UAAQ,UAO3F;AAED,eAAO,MAAM,sBAAsB;;;;8EAsBlC,CAAC;AAEF,KAAK,sBAAsB,GAAG;IAC5B,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,OAAO,CAAC,EAAE,iBAAiB,CAAC;IAC5B,QAAQ,EAAE,OAAO,CAAC;IAClB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,oBAAoB,CAAC,EAAE,MAAM,CAAC;CAC/B,CAAC;AAEF,wBAAgB,oBAAoB,CAAC,EACnC,IAAW,EACX,OAAoB,EACpB,QAAQ,EACR,KAAa,EACb,MAAc,EACd,SAAiB,EACjB,OAAO,EACP,cAAc,EACd,iBAAiB,EACjB,oBAAoB,GACrB,EAAE,sBAAsB,UAsBxB;AAED,KAAK,sBAAsB,GAAG;IAC5B,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,IAAI,EAAE,SAAS,GAAG,UAAU,CAAC;CAC9B,CAAC;AAEF,wBAAgB,oBAAoB,CAAC,EACnC,IAAW,EACX,KAAa,EACb,MAAc,EACd,SAAiB,EACjB,IAAI,GACL,EAAE,sBAAsB,UASxB;AAED,wBAAgB,yBAAyB,CACvC,IAAI,GAAE,SAAgB,EACtB,KAAK,UAAQ,EACb,cAAc,GAAE,mBAAgC,UAYjD"}
|
package/dist/lib/field-shell.js
CHANGED
|
@@ -2,6 +2,9 @@
|
|
|
2
2
|
import { cva } from 'class-variance-authority';
|
|
3
3
|
import { cn } from './utils.js';
|
|
4
4
|
import { getFieldSizeStyles } from './field-size.js';
|
|
5
|
+
export function getStackedFieldLabelClasses(size, error = false, disabled = false) {
|
|
6
|
+
return cn('mb-2 block font-semibold tracking-normal', getFieldSizeStyles(size).externalLabelText, error ? 'text-error' : 'text-on-surface', disabled && 'opacity-38');
|
|
7
|
+
}
|
|
5
8
|
export const fieldContainerVariants = cva('relative flex w-full transition-all duration-snappy ease-emphasized group cursor-text', {
|
|
6
9
|
variants: {
|
|
7
10
|
variant: {
|
|
@@ -41,8 +44,10 @@ export function getFieldAffixClasses({ size = 'md', error = false, active = fals
|
|
|
41
44
|
const fieldSize = getFieldSizeStyles(size);
|
|
42
45
|
return cn('transition-colors shrink-0 flex items-center justify-center', side === 'leading' ? fieldSize.leadingPadding : fieldSize.trailingPadding, multiline ? fieldSize.multilineIconOffset : 'h-full', error ? 'text-error' : active ? 'text-primary' : 'text-on-surface-variant');
|
|
43
46
|
}
|
|
44
|
-
export function getFieldHelperTextClasses(size = 'md', error = false) {
|
|
47
|
+
export function getFieldHelperTextClasses(size = 'md', error = false, labelPlacement = 'floating') {
|
|
45
48
|
const fieldSize = getFieldSizeStyles(size);
|
|
46
|
-
return cn(
|
|
49
|
+
return cn(labelPlacement === 'stacked'
|
|
50
|
+
? 'text-body-small font-normal tracking-normal'
|
|
51
|
+
: 'text-label-small font-medium', fieldSize.helperMarginTop, labelPlacement === 'floating' && fieldSize.helperPaddingX, error ? 'text-error' : 'text-on-surface-variant');
|
|
47
52
|
}
|
|
48
53
|
//# sourceMappingURL=field-shell.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"field-shell.js","sourceRoot":"","sources":["../../src/lib/field-shell.ts"],"names":[],"mappings":"AAAA,YAAY,CAAC;AAEb,OAAO,EAAE,GAAG,EAAE,MAAM,0BAA0B,CAAC;AAC/C,OAAO,EAAE,EAAE,EAAE,MAAM,SAAS,CAAC;AAC7B,OAAO,EAAE,kBAAkB,EAAkB,MAAM,cAAc,CAAC;
|
|
1
|
+
{"version":3,"file":"field-shell.js","sourceRoot":"","sources":["../../src/lib/field-shell.ts"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@unisane/ui",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.2-next.97f61b1d",
|
|
4
4
|
"description": "Open-code React component registry and optional runtime distribution for product interfaces",
|
|
5
5
|
"private": false,
|
|
6
6
|
"type": "module",
|
|
@@ -431,7 +431,7 @@
|
|
|
431
431
|
"publishConfig": {
|
|
432
432
|
"access": "public",
|
|
433
433
|
"provenance": true,
|
|
434
|
-
"tag": "
|
|
434
|
+
"tag": "next"
|
|
435
435
|
},
|
|
436
436
|
"engines": {
|
|
437
437
|
"node": ">=22.0.0"
|
|
@@ -456,7 +456,7 @@
|
|
|
456
456
|
"cmdk": "^1.1.1",
|
|
457
457
|
"tailwind-merge": "^3.4.0",
|
|
458
458
|
"vaul": "^1.1.2",
|
|
459
|
-
"@unisane/tokens": "0.1.
|
|
459
|
+
"@unisane/tokens": "0.1.2-next.97f61b1d"
|
|
460
460
|
},
|
|
461
461
|
"unisane": {
|
|
462
462
|
"kind": "ui",
|
|
@@ -4,7 +4,7 @@ import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react'
|
|
|
4
4
|
import { createPortal } from 'react-dom';
|
|
5
5
|
import { cn } from '@/lib/utils';
|
|
6
6
|
import { type FieldSize } from '@/lib/field-size';
|
|
7
|
-
import { type FieldShellVariant } from '@/lib/field-shell';
|
|
7
|
+
import { type FieldLabelPlacement, type FieldShellVariant } from '@/lib/field-shell';
|
|
8
8
|
import { getPortalLayerStyle } from '@/lib/portal-layer';
|
|
9
9
|
import { useAnchoredOverlayPosition } from '@/lib/use-anchored-overlay-position';
|
|
10
10
|
import { useControllableState } from '@/lib/use-controllable-state';
|
|
@@ -31,6 +31,7 @@ const MONTHS = [
|
|
|
31
31
|
|
|
32
32
|
export type MonthPickerProps = {
|
|
33
33
|
variant?: FieldShellVariant;
|
|
34
|
+
labelPlacement?: FieldLabelPlacement;
|
|
34
35
|
value?: string;
|
|
35
36
|
defaultValue?: string;
|
|
36
37
|
onValueChange?: (value: string) => void;
|
|
@@ -60,6 +61,7 @@ export const MonthPicker: React.FC<MonthPickerProps> = ({
|
|
|
60
61
|
helperText,
|
|
61
62
|
className,
|
|
62
63
|
variant = 'outlined',
|
|
64
|
+
labelPlacement = 'floating',
|
|
63
65
|
min,
|
|
64
66
|
max,
|
|
65
67
|
size = 'md',
|
|
@@ -208,6 +210,7 @@ export const MonthPicker: React.FC<MonthPickerProps> = ({
|
|
|
208
210
|
{...(error ? { errorMessage: helperText } : { description: helperText })}
|
|
209
211
|
invalid={error}
|
|
210
212
|
label={label}
|
|
213
|
+
labelPlacement={labelPlacement}
|
|
211
214
|
size={size}
|
|
212
215
|
trailingIcon={pickerButton}
|
|
213
216
|
value={inputValue}
|
|
@@ -287,11 +290,11 @@ export const MonthPicker: React.FC<MonthPickerProps> = ({
|
|
|
287
290
|
aria-label={`${month} ${viewYear}`}
|
|
288
291
|
className={cn(
|
|
289
292
|
'text-label-large relative min-h-10 overflow-hidden rounded-sm px-2 transition-colors',
|
|
290
|
-
'focus-visible:ring-focus-ring focus-visible:
|
|
293
|
+
'focus-visible:ring-focus-ring focus-visible:outline-none focus-visible:ring-2',
|
|
291
294
|
selected
|
|
292
295
|
? 'bg-primary text-on-primary'
|
|
293
296
|
: 'text-on-surface hover:bg-state-hover',
|
|
294
|
-
disabledMonth && 'pointer-events-none cursor-not-allowed
|
|
297
|
+
disabledMonth && 'opacity-38 pointer-events-none cursor-not-allowed',
|
|
295
298
|
)}
|
|
296
299
|
onClick={() => selectMonth(monthIndex)}
|
|
297
300
|
>
|
|
@@ -8,6 +8,8 @@ import { getFieldSizeStyles, type FieldSize } from '@/lib/field-size';
|
|
|
8
8
|
import {
|
|
9
9
|
getFieldHelperTextClasses,
|
|
10
10
|
getFieldLabelClasses,
|
|
11
|
+
getStackedFieldLabelClasses,
|
|
12
|
+
type FieldLabelPlacement,
|
|
11
13
|
type FieldShellVariant,
|
|
12
14
|
} from '@/lib/field-shell';
|
|
13
15
|
import { useControllableState } from '@/lib/use-controllable-state';
|
|
@@ -50,6 +52,7 @@ type SelectFieldCommonProps = {
|
|
|
50
52
|
portal?: boolean;
|
|
51
53
|
size?: FieldSize;
|
|
52
54
|
variant?: FieldShellVariant;
|
|
55
|
+
labelPlacement?: FieldLabelPlacement;
|
|
53
56
|
className?: string;
|
|
54
57
|
triggerClassName?: string;
|
|
55
58
|
contentClassName?: string;
|
|
@@ -86,6 +89,7 @@ export const SelectField = React.forwardRef<HTMLButtonElement, SelectFieldProps>
|
|
|
86
89
|
triggerClassName,
|
|
87
90
|
value,
|
|
88
91
|
variant = 'outlined',
|
|
92
|
+
labelPlacement = 'floating',
|
|
89
93
|
},
|
|
90
94
|
ref,
|
|
91
95
|
) => {
|
|
@@ -109,10 +113,23 @@ export const SelectField = React.forwardRef<HTMLButtonElement, SelectFieldProps>
|
|
|
109
113
|
onChange: onOpenChange,
|
|
110
114
|
});
|
|
111
115
|
const isOpen = openState ?? false;
|
|
112
|
-
const isFloating =
|
|
116
|
+
const isFloating =
|
|
117
|
+
labelPlacement === 'stacked' || hideLabel || isOpen || Boolean(selectedValue);
|
|
113
118
|
|
|
114
119
|
return (
|
|
115
120
|
<Field className={className} invalid={resolvedInvalid}>
|
|
121
|
+
{label && labelPlacement === 'stacked' ? (
|
|
122
|
+
<FieldLabel
|
|
123
|
+
id={labelId}
|
|
124
|
+
htmlFor={fieldId}
|
|
125
|
+
required={required}
|
|
126
|
+
className={
|
|
127
|
+
hideLabel ? 'sr-only' : getStackedFieldLabelClasses(size, resolvedInvalid, disabled)
|
|
128
|
+
}
|
|
129
|
+
>
|
|
130
|
+
{label}
|
|
131
|
+
</FieldLabel>
|
|
132
|
+
) : null}
|
|
116
133
|
<Select
|
|
117
134
|
value={selectedValue}
|
|
118
135
|
onValueChange={setSelectedValue}
|
|
@@ -139,7 +156,7 @@ export const SelectField = React.forwardRef<HTMLButtonElement, SelectFieldProps>
|
|
|
139
156
|
'pointer-events-none flex h-full min-w-0 items-center',
|
|
140
157
|
fieldSize.horizontalPadding,
|
|
141
158
|
fieldSize.valueText,
|
|
142
|
-
variant === 'filled' && label
|
|
159
|
+
variant === 'filled' && labelPlacement === 'floating' && label
|
|
143
160
|
? cn('items-end', fieldSize.filledDisplayPadding)
|
|
144
161
|
: '',
|
|
145
162
|
)}
|
|
@@ -147,7 +164,7 @@ export const SelectField = React.forwardRef<HTMLButtonElement, SelectFieldProps>
|
|
|
147
164
|
<SelectValue placeholder={isFloating || !label ? placeholder : undefined} />
|
|
148
165
|
</span>
|
|
149
166
|
</SelectTrigger>
|
|
150
|
-
{label ? (
|
|
167
|
+
{label && labelPlacement === 'floating' ? (
|
|
151
168
|
<FieldLabel
|
|
152
169
|
id={labelId}
|
|
153
170
|
htmlFor={fieldId}
|
|
@@ -162,7 +179,9 @@ export const SelectField = React.forwardRef<HTMLButtonElement, SelectFieldProps>
|
|
|
162
179
|
error: resolvedInvalid,
|
|
163
180
|
active: isOpen,
|
|
164
181
|
floatingClassName:
|
|
165
|
-
variant === 'filled'
|
|
182
|
+
variant === 'filled' && labelPlacement === 'floating'
|
|
183
|
+
? fieldSize.filledDisplayFloatingLabel
|
|
184
|
+
: undefined,
|
|
166
185
|
})
|
|
167
186
|
}
|
|
168
187
|
>
|
|
@@ -189,11 +208,17 @@ export const SelectField = React.forwardRef<HTMLButtonElement, SelectFieldProps>
|
|
|
189
208
|
</SelectContent>
|
|
190
209
|
</Select>
|
|
191
210
|
{errorMessage ? (
|
|
192
|
-
<FieldError
|
|
211
|
+
<FieldError
|
|
212
|
+
id={errorId}
|
|
213
|
+
className={getFieldHelperTextClasses(size, true, labelPlacement)}
|
|
214
|
+
>
|
|
193
215
|
{errorMessage}
|
|
194
216
|
</FieldError>
|
|
195
217
|
) : description ? (
|
|
196
|
-
<FieldDescription
|
|
218
|
+
<FieldDescription
|
|
219
|
+
id={descriptionId}
|
|
220
|
+
className={getFieldHelperTextClasses(size, false, labelPlacement)}
|
|
221
|
+
>
|
|
197
222
|
{description}
|
|
198
223
|
</FieldDescription>
|
|
199
224
|
) : null}
|
|
@@ -9,6 +9,8 @@ import {
|
|
|
9
9
|
getFieldAffixClasses,
|
|
10
10
|
getFieldHelperTextClasses,
|
|
11
11
|
getFieldLabelClasses,
|
|
12
|
+
getStackedFieldLabelClasses,
|
|
13
|
+
type FieldLabelPlacement,
|
|
12
14
|
type FieldShellVariant,
|
|
13
15
|
} from '@/lib/field-shell';
|
|
14
16
|
|
|
@@ -30,6 +32,7 @@ type TextFieldCommonProps = {
|
|
|
30
32
|
trailingIcon?: React.ReactNode;
|
|
31
33
|
value?: string | number;
|
|
32
34
|
variant?: FieldShellVariant;
|
|
35
|
+
labelPlacement?: FieldLabelPlacement;
|
|
33
36
|
};
|
|
34
37
|
|
|
35
38
|
type ReplacedNativeProps =
|
|
@@ -80,6 +83,7 @@ export const TextField = React.forwardRef<TextFieldControl, TextFieldProps>(
|
|
|
80
83
|
trailingIcon,
|
|
81
84
|
value,
|
|
82
85
|
variant = 'outlined',
|
|
86
|
+
labelPlacement = 'floating',
|
|
83
87
|
...nativeControlProps
|
|
84
88
|
} = props;
|
|
85
89
|
const inputProps = nativeControlProps as TextFieldInputAttributes & TextFieldEvents;
|
|
@@ -102,7 +106,8 @@ export const TextField = React.forwardRef<TextFieldControl, TextFieldProps>(
|
|
|
102
106
|
const [uncontrolledValue, setUncontrolledValue] = React.useState(String(defaultValue));
|
|
103
107
|
const currentValue = value === undefined ? uncontrolledValue : String(value);
|
|
104
108
|
const hasValue = currentValue.length > 0;
|
|
105
|
-
const isFloating =
|
|
109
|
+
const isFloating =
|
|
110
|
+
labelPlacement === 'stacked' || hideLabel || Boolean(placeholder) || isFocused || hasValue;
|
|
106
111
|
|
|
107
112
|
const setControlRef = React.useCallback(
|
|
108
113
|
(node: TextFieldControl | null) => {
|
|
@@ -133,11 +138,21 @@ export const TextField = React.forwardRef<TextFieldControl, TextFieldProps>(
|
|
|
133
138
|
'placeholder:text-on-surface-variant',
|
|
134
139
|
fieldSize.horizontalPadding,
|
|
135
140
|
fieldSize.valueText,
|
|
136
|
-
|
|
141
|
+
labelPlacement === 'stacked' && 'tracking-normal',
|
|
142
|
+
variant === 'filled' && labelPlacement === 'floating' ? fieldSize.filledInputPadding : '',
|
|
137
143
|
);
|
|
138
144
|
|
|
139
145
|
return (
|
|
140
146
|
<Field className={className} invalid={resolvedInvalid}>
|
|
147
|
+
{labelPlacement === 'stacked' && !hideLabel ? (
|
|
148
|
+
<FieldLabel
|
|
149
|
+
htmlFor={fieldId}
|
|
150
|
+
required={required}
|
|
151
|
+
className={getStackedFieldLabelClasses(size, resolvedInvalid, disabled)}
|
|
152
|
+
>
|
|
153
|
+
{label}
|
|
154
|
+
</FieldLabel>
|
|
155
|
+
) : null}
|
|
141
156
|
<div
|
|
142
157
|
className={cn(
|
|
143
158
|
fieldContainerVariants({ variant, error: resolvedInvalid, disabled }),
|
|
@@ -173,7 +188,9 @@ export const TextField = React.forwardRef<TextFieldControl, TextFieldProps>(
|
|
|
173
188
|
controlClasses,
|
|
174
189
|
'min-h-24 resize-none',
|
|
175
190
|
fieldSize.multilinePaddingY,
|
|
176
|
-
variant === 'filled'
|
|
191
|
+
variant === 'filled' && labelPlacement === 'floating'
|
|
192
|
+
? fieldSize.filledTextareaPadding
|
|
193
|
+
: '',
|
|
177
194
|
)}
|
|
178
195
|
onBlur={(event) => {
|
|
179
196
|
setIsFocused(false);
|
|
@@ -209,24 +226,26 @@ export const TextField = React.forwardRef<TextFieldControl, TextFieldProps>(
|
|
|
209
226
|
}}
|
|
210
227
|
/>
|
|
211
228
|
)}
|
|
212
|
-
|
|
213
|
-
|
|
214
|
-
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
|
|
218
|
-
|
|
219
|
-
|
|
220
|
-
|
|
221
|
-
|
|
222
|
-
|
|
223
|
-
|
|
224
|
-
|
|
225
|
-
|
|
226
|
-
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
|
|
229
|
+
{labelPlacement === 'floating' || hideLabel ? (
|
|
230
|
+
<FieldLabel
|
|
231
|
+
htmlFor={fieldId}
|
|
232
|
+
required={required}
|
|
233
|
+
className={
|
|
234
|
+
hideLabel || labelPlacement === 'stacked'
|
|
235
|
+
? 'sr-only'
|
|
236
|
+
: getFieldLabelClasses({
|
|
237
|
+
size,
|
|
238
|
+
variant,
|
|
239
|
+
floating: isFloating,
|
|
240
|
+
error: resolvedInvalid,
|
|
241
|
+
active: isFocused,
|
|
242
|
+
multiline,
|
|
243
|
+
})
|
|
244
|
+
}
|
|
245
|
+
>
|
|
246
|
+
{label}
|
|
247
|
+
</FieldLabel>
|
|
248
|
+
) : null}
|
|
230
249
|
</div>
|
|
231
250
|
{trailingIcon ? (
|
|
232
251
|
<span
|
|
@@ -244,11 +263,17 @@ export const TextField = React.forwardRef<TextFieldControl, TextFieldProps>(
|
|
|
244
263
|
) : null}
|
|
245
264
|
</div>
|
|
246
265
|
{errorMessage ? (
|
|
247
|
-
<FieldError
|
|
266
|
+
<FieldError
|
|
267
|
+
id={errorId}
|
|
268
|
+
className={getFieldHelperTextClasses(size, true, labelPlacement)}
|
|
269
|
+
>
|
|
248
270
|
{errorMessage}
|
|
249
271
|
</FieldError>
|
|
250
272
|
) : description ? (
|
|
251
|
-
<FieldDescription
|
|
273
|
+
<FieldDescription
|
|
274
|
+
id={descriptionId}
|
|
275
|
+
className={getFieldHelperTextClasses(size, false, labelPlacement)}
|
|
276
|
+
>
|
|
252
277
|
{description}
|
|
253
278
|
</FieldDescription>
|
|
254
279
|
) : null}
|
|
@@ -17,6 +17,8 @@ import {
|
|
|
17
17
|
getFieldAffixClasses,
|
|
18
18
|
getFieldHelperTextClasses,
|
|
19
19
|
getFieldLabelClasses,
|
|
20
|
+
getStackedFieldLabelClasses,
|
|
21
|
+
type FieldLabelPlacement,
|
|
20
22
|
type FieldShellVariant,
|
|
21
23
|
} from '@/lib/field-shell';
|
|
22
24
|
import { useFieldState } from '@/lib/use-field-state';
|
|
@@ -32,6 +34,7 @@ export type TokenFieldProps = TokenFieldInputProps & {
|
|
|
32
34
|
onValueChange?: (value: string[]) => void;
|
|
33
35
|
label: string;
|
|
34
36
|
variant?: FieldShellVariant;
|
|
37
|
+
labelPlacement?: FieldLabelPlacement;
|
|
35
38
|
size?: FieldSize;
|
|
36
39
|
error?: boolean;
|
|
37
40
|
helperText?: string;
|
|
@@ -57,6 +60,7 @@ export const TokenField = React.forwardRef<HTMLDivElement, TokenFieldProps>(
|
|
|
57
60
|
onValueChange,
|
|
58
61
|
label,
|
|
59
62
|
variant = 'outlined',
|
|
63
|
+
labelPlacement = 'floating',
|
|
60
64
|
size = 'md',
|
|
61
65
|
error,
|
|
62
66
|
helperText,
|
|
@@ -277,6 +281,17 @@ export const TokenField = React.forwardRef<HTMLDivElement, TokenFieldProps>(
|
|
|
277
281
|
className={cn('relative inline-flex w-full flex-col', className)}
|
|
278
282
|
onBlur={handleRootBlur}
|
|
279
283
|
>
|
|
284
|
+
{labelPlacement === 'stacked' ? (
|
|
285
|
+
<label
|
|
286
|
+
htmlFor={fieldId}
|
|
287
|
+
className={cn(
|
|
288
|
+
getStackedFieldLabelClasses(size, effectiveError, disabled),
|
|
289
|
+
labelClassName,
|
|
290
|
+
)}
|
|
291
|
+
>
|
|
292
|
+
{label}
|
|
293
|
+
</label>
|
|
294
|
+
) : null}
|
|
280
295
|
<div
|
|
281
296
|
className={cn(
|
|
282
297
|
fieldContainerVariants({ variant, error: effectiveError, disabled }),
|
|
@@ -306,7 +321,10 @@ export const TokenField = React.forwardRef<HTMLDivElement, TokenFieldProps>(
|
|
|
306
321
|
className={cn(
|
|
307
322
|
'flex min-h-full w-full flex-wrap items-center gap-1.5',
|
|
308
323
|
fieldSize.horizontalPadding,
|
|
309
|
-
getTokenFieldContentPadding(
|
|
324
|
+
getTokenFieldContentPadding(
|
|
325
|
+
size,
|
|
326
|
+
labelPlacement === 'stacked' ? 'outlined' : variant,
|
|
327
|
+
),
|
|
310
328
|
)}
|
|
311
329
|
>
|
|
312
330
|
{tokens.length ? (
|
|
@@ -362,21 +380,23 @@ export const TokenField = React.forwardRef<HTMLDivElement, TokenFieldProps>(
|
|
|
362
380
|
{...props}
|
|
363
381
|
/>
|
|
364
382
|
</div>
|
|
365
|
-
|
|
366
|
-
|
|
367
|
-
|
|
368
|
-
|
|
369
|
-
|
|
370
|
-
|
|
371
|
-
|
|
372
|
-
|
|
373
|
-
|
|
374
|
-
|
|
375
|
-
|
|
376
|
-
|
|
377
|
-
|
|
378
|
-
|
|
379
|
-
|
|
383
|
+
{labelPlacement === 'floating' ? (
|
|
384
|
+
<label
|
|
385
|
+
htmlFor={fieldId}
|
|
386
|
+
className={getFieldLabelClasses({
|
|
387
|
+
size,
|
|
388
|
+
variant,
|
|
389
|
+
floating: isFloating,
|
|
390
|
+
error: effectiveError,
|
|
391
|
+
active: isFocused,
|
|
392
|
+
multiline: true,
|
|
393
|
+
labelBg,
|
|
394
|
+
labelClassName,
|
|
395
|
+
})}
|
|
396
|
+
>
|
|
397
|
+
{label}
|
|
398
|
+
</label>
|
|
399
|
+
) : null}
|
|
380
400
|
</div>
|
|
381
401
|
{trailingIcon && (
|
|
382
402
|
<span
|
|
@@ -394,7 +414,10 @@ export const TokenField = React.forwardRef<HTMLDivElement, TokenFieldProps>(
|
|
|
394
414
|
)}
|
|
395
415
|
</div>
|
|
396
416
|
{effectiveHelperText && (
|
|
397
|
-
<span
|
|
417
|
+
<span
|
|
418
|
+
id={helperId}
|
|
419
|
+
className={getFieldHelperTextClasses(size, effectiveError, labelPlacement)}
|
|
420
|
+
>
|
|
398
421
|
{effectiveHelperText}
|
|
399
422
|
</span>
|
|
400
423
|
)}
|
|
@@ -5,6 +5,16 @@ import { cn } from '@/lib/utils';
|
|
|
5
5
|
import { getFieldSizeStyles, type FieldSize } from '@/lib/field-size';
|
|
6
6
|
|
|
7
7
|
export type FieldShellVariant = 'outlined' | 'filled';
|
|
8
|
+
export type FieldLabelPlacement = 'floating' | 'stacked';
|
|
9
|
+
|
|
10
|
+
export function getStackedFieldLabelClasses(size: FieldSize, error = false, disabled = false) {
|
|
11
|
+
return cn(
|
|
12
|
+
'mb-2 block font-semibold tracking-normal',
|
|
13
|
+
getFieldSizeStyles(size).externalLabelText,
|
|
14
|
+
error ? 'text-error' : 'text-on-surface',
|
|
15
|
+
disabled && 'opacity-38',
|
|
16
|
+
);
|
|
17
|
+
}
|
|
8
18
|
|
|
9
19
|
export const fieldContainerVariants = cva(
|
|
10
20
|
'relative flex w-full transition-all duration-snappy ease-emphasized group cursor-text',
|
|
@@ -103,13 +113,19 @@ export function getFieldAffixClasses({
|
|
|
103
113
|
);
|
|
104
114
|
}
|
|
105
115
|
|
|
106
|
-
export function getFieldHelperTextClasses(
|
|
116
|
+
export function getFieldHelperTextClasses(
|
|
117
|
+
size: FieldSize = 'md',
|
|
118
|
+
error = false,
|
|
119
|
+
labelPlacement: FieldLabelPlacement = 'floating',
|
|
120
|
+
) {
|
|
107
121
|
const fieldSize = getFieldSizeStyles(size);
|
|
108
122
|
|
|
109
123
|
return cn(
|
|
110
|
-
|
|
124
|
+
labelPlacement === 'stacked'
|
|
125
|
+
? 'text-body-small font-normal tracking-normal'
|
|
126
|
+
: 'text-label-small font-medium',
|
|
111
127
|
fieldSize.helperMarginTop,
|
|
112
|
-
fieldSize.helperPaddingX,
|
|
128
|
+
labelPlacement === 'floating' && fieldSize.helperPaddingX,
|
|
113
129
|
error ? 'text-error' : 'text-on-surface-variant',
|
|
114
130
|
);
|
|
115
131
|
}
|