@proteos/ui 0.32.1 → 0.33.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.cjs +17 -3
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +22 -1
- package/dist/index.d.ts +22 -1
- package/dist/index.js +17 -3
- package/dist/index.js.map +1 -1
- package/package.json +2 -2
- package/src/components/field/field.tsx +14 -1
- package/src/components/input/input.tsx +6 -2
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@proteos/ui",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.33.0",
|
|
4
4
|
"license": "FSL-1.1-Apache-2.0",
|
|
5
5
|
"description": "Proteos React component library (React Aria Components + Tailwind v4).",
|
|
6
6
|
"repository": {
|
|
@@ -55,7 +55,7 @@
|
|
|
55
55
|
"tailwind-merge": "^3.5.0",
|
|
56
56
|
"tailwind-variants": "^3.2.2",
|
|
57
57
|
"tailwindcss": "^4.2.4",
|
|
58
|
-
"@proteos/sdk": "0.
|
|
58
|
+
"@proteos/sdk": "0.33.0"
|
|
59
59
|
},
|
|
60
60
|
"devDependencies": {
|
|
61
61
|
"@biomejs/biome": "^2.4.13",
|
|
@@ -69,11 +69,24 @@ export const fieldControlStyles = tv({
|
|
|
69
69
|
content: 'py-1',
|
|
70
70
|
},
|
|
71
71
|
},
|
|
72
|
+
/* `hasFocusRing: false` — keep the full field chrome but drop the
|
|
73
|
+
focus/invalid ring, for tight hosts whose overflow clip would cut it
|
|
74
|
+
off (e.g. the editor-header title). The border still turns accent on
|
|
75
|
+
focus / danger on invalid. Declared after `appearance` so its
|
|
76
|
+
shadow-none wins the tailwind-merge order. */
|
|
77
|
+
hasFocusRing: {
|
|
78
|
+
true: {},
|
|
79
|
+
false: {
|
|
80
|
+
box: 'focus:shadow-none data-[focused]:shadow-none data-[invalid]:shadow-none',
|
|
81
|
+
},
|
|
82
|
+
},
|
|
72
83
|
},
|
|
73
84
|
compoundVariants: [
|
|
74
85
|
{ appearance: 'cell', invalid: true, class: { box: 'shadow-none' } },
|
|
86
|
+
// invalid:true's RESTING danger ring — reduce back to the inset shadow.
|
|
87
|
+
{ hasFocusRing: false, invalid: true, class: { box: 'shadow-[var(--shadow-inset)]' } },
|
|
75
88
|
],
|
|
76
|
-
defaultVariants: { size: 'md', invalid: false, appearance: 'field' },
|
|
89
|
+
defaultVariants: { size: 'md', invalid: false, appearance: 'field', hasFocusRing: true },
|
|
77
90
|
})
|
|
78
91
|
|
|
79
92
|
export type FieldControlVariants = VariantProps<typeof fieldControlStyles>
|
|
@@ -11,9 +11,9 @@ import {
|
|
|
11
11
|
import { cn } from '../../lib/cn'
|
|
12
12
|
import {
|
|
13
13
|
type FieldAppearance,
|
|
14
|
+
type FieldSize,
|
|
14
15
|
fieldControlStyles,
|
|
15
16
|
fieldErrorStyles,
|
|
16
|
-
type FieldSize,
|
|
17
17
|
fieldHintStyles,
|
|
18
18
|
fieldLabelStyles,
|
|
19
19
|
} from '../field/field'
|
|
@@ -28,6 +28,9 @@ export type InputProps = AriaTextFieldProps & {
|
|
|
28
28
|
/** Chrome variant. Defaults to `field`. `cell` flattens the box for
|
|
29
29
|
* spreadsheet-style inline editing (2px radius, no halo / resting shadow). */
|
|
30
30
|
appearance?: FieldAppearance
|
|
31
|
+
/** Set false to drop the focus/invalid ring — for tight hosts whose
|
|
32
|
+
* overflow clip would cut it off. Border states stay. Defaults to true. */
|
|
33
|
+
hasFocusRing?: boolean
|
|
31
34
|
/** Extra props forwarded to the underlying <input>. */
|
|
32
35
|
inputProps?: Omit<AriaInputProps, 'className'>
|
|
33
36
|
/** Visual override for the input control only. */
|
|
@@ -41,12 +44,13 @@ export function Input({
|
|
|
41
44
|
placeholder,
|
|
42
45
|
size,
|
|
43
46
|
appearance,
|
|
47
|
+
hasFocusRing,
|
|
44
48
|
inputProps,
|
|
45
49
|
inputClassName,
|
|
46
50
|
className,
|
|
47
51
|
...props
|
|
48
52
|
}: InputProps) {
|
|
49
|
-
const styles = fieldControlStyles({ size, appearance })
|
|
53
|
+
const styles = fieldControlStyles({ size, appearance, hasFocusRing })
|
|
50
54
|
return (
|
|
51
55
|
<TextField
|
|
52
56
|
{...props}
|