@spark-web/field 5.1.1 → 5.2.0-rc.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/CHANGELOG.md CHANGED
@@ -1,5 +1,22 @@
1
1
  # @spark-web/field
2
2
 
3
+ ## 5.2.0-rc.0
4
+
5
+ ### Minor Changes
6
+
7
+ - update react version and other packages
8
+
9
+ ### Patch Changes
10
+
11
+ - Updated dependencies []:
12
+ - @spark-web/stack@5.1.0-rc.0
13
+ - @spark-web/theme@5.12.0-rc.0
14
+ - @spark-web/utils@5.1.0-rc.0
15
+ - @spark-web/a11y@5.3.0-rc.0
16
+ - @spark-web/icon@5.1.0-rc.0
17
+ - @spark-web/text@5.3.0-rc.0
18
+ - @spark-web/box@6.0.0-rc.0
19
+
3
20
  ## 5.1.1
4
21
 
5
22
  ### Patch Changes
@@ -2,7 +2,6 @@
2
2
  export declare type FieldState = {
3
3
  disabled: boolean;
4
4
  invalid: boolean;
5
- readOnly?: boolean;
6
5
  };
7
6
  export declare type InputPropsDerivedFromField = {
8
7
  'aria-describedby'?: string;
@@ -30,8 +30,6 @@ export declare type FieldProps = {
30
30
  secondaryLabel?: string;
31
31
  /** Provide a tone to influence elements of the field, and its input. */
32
32
  tone?: Tone;
33
- /** Sets input to readonly, which is focusable. */
34
- readOnly?: boolean;
35
33
  };
36
34
  /**
37
35
  * Using a [context](https://reactjs.org/docs/context.html), the field
@@ -41,9 +41,7 @@ var Field = /*#__PURE__*/react.forwardRef(function (_ref, forwardedRef) {
41
41
  message = _ref.message,
42
42
  secondaryLabel = _ref.secondaryLabel,
43
43
  _ref$tone = _ref.tone,
44
- tone = _ref$tone === void 0 ? 'neutral' : _ref$tone,
45
- _ref$readOnly = _ref.readOnly,
46
- readOnly = _ref$readOnly === void 0 ? false : _ref$readOnly;
44
+ tone = _ref$tone === void 0 ? 'neutral' : _ref$tone;
47
45
  var _useFieldIds = useFieldIds(idProp),
48
46
  descriptionId = _useFieldIds.descriptionId,
49
47
  inputId = _useFieldIds.inputId,
@@ -54,14 +52,13 @@ var Field = /*#__PURE__*/react.forwardRef(function (_ref, forwardedRef) {
54
52
  var fieldContext = react.useMemo(function () {
55
53
  return [{
56
54
  disabled: disabled,
57
- invalid: invalid,
58
- readOnly: readOnly
55
+ invalid: invalid
59
56
  }, {
60
57
  'aria-describedby': a11y.mergeIds(message && messageId, description && descriptionId),
61
58
  'aria-invalid': invalid || undefined,
62
59
  id: inputId
63
60
  }];
64
- }, [description, descriptionId, disabled, inputId, invalid, message, messageId, readOnly]);
61
+ }, [description, descriptionId, disabled, inputId, invalid, message, messageId]);
65
62
 
66
63
  // label prep
67
64
  var hiddenLabel = jsxRuntime.jsxs(a11y.VisuallyHidden, {
@@ -75,11 +72,11 @@ var Field = /*#__PURE__*/react.forwardRef(function (_ref, forwardedRef) {
75
72
  as: "label",
76
73
  htmlFor: inputId,
77
74
  children: jsxRuntime.jsxs(text.Text, {
78
- tone: disabled || readOnly ? 'field' : 'neutral',
75
+ tone: disabled ? 'disabled' : 'neutral',
79
76
  weight: "semibold",
80
77
  children: [label, ' ', secondaryLabel && jsxRuntime.jsx(text.Text, {
81
78
  inline: true,
82
- tone: disabled || readOnly ? 'field' : 'muted',
79
+ tone: disabled ? 'disabled' : 'muted',
83
80
  weight: "regular",
84
81
  children: secondaryLabel
85
82
  })]
@@ -41,9 +41,7 @@ var Field = /*#__PURE__*/react.forwardRef(function (_ref, forwardedRef) {
41
41
  message = _ref.message,
42
42
  secondaryLabel = _ref.secondaryLabel,
43
43
  _ref$tone = _ref.tone,
44
- tone = _ref$tone === void 0 ? 'neutral' : _ref$tone,
45
- _ref$readOnly = _ref.readOnly,
46
- readOnly = _ref$readOnly === void 0 ? false : _ref$readOnly;
44
+ tone = _ref$tone === void 0 ? 'neutral' : _ref$tone;
47
45
  var _useFieldIds = useFieldIds(idProp),
48
46
  descriptionId = _useFieldIds.descriptionId,
49
47
  inputId = _useFieldIds.inputId,
@@ -54,14 +52,13 @@ var Field = /*#__PURE__*/react.forwardRef(function (_ref, forwardedRef) {
54
52
  var fieldContext = react.useMemo(function () {
55
53
  return [{
56
54
  disabled: disabled,
57
- invalid: invalid,
58
- readOnly: readOnly
55
+ invalid: invalid
59
56
  }, {
60
57
  'aria-describedby': a11y.mergeIds(message && messageId, description && descriptionId),
61
58
  'aria-invalid': invalid || undefined,
62
59
  id: inputId
63
60
  }];
64
- }, [description, descriptionId, disabled, inputId, invalid, message, messageId, readOnly]);
61
+ }, [description, descriptionId, disabled, inputId, invalid, message, messageId]);
65
62
 
66
63
  // label prep
67
64
  var hiddenLabel = jsxRuntime.jsxs(a11y.VisuallyHidden, {
@@ -75,11 +72,11 @@ var Field = /*#__PURE__*/react.forwardRef(function (_ref, forwardedRef) {
75
72
  as: "label",
76
73
  htmlFor: inputId,
77
74
  children: jsxRuntime.jsxs(text.Text, {
78
- tone: disabled || readOnly ? 'field' : 'neutral',
75
+ tone: disabled ? 'disabled' : 'neutral',
79
76
  weight: "semibold",
80
77
  children: [label, ' ', secondaryLabel && jsxRuntime.jsx(text.Text, {
81
78
  inline: true,
82
- tone: disabled || readOnly ? 'field' : 'muted',
79
+ tone: disabled ? 'disabled' : 'muted',
83
80
  weight: "regular",
84
81
  children: secondaryLabel
85
82
  })]
@@ -37,9 +37,7 @@ var Field = /*#__PURE__*/forwardRef(function (_ref, forwardedRef) {
37
37
  message = _ref.message,
38
38
  secondaryLabel = _ref.secondaryLabel,
39
39
  _ref$tone = _ref.tone,
40
- tone = _ref$tone === void 0 ? 'neutral' : _ref$tone,
41
- _ref$readOnly = _ref.readOnly,
42
- readOnly = _ref$readOnly === void 0 ? false : _ref$readOnly;
40
+ tone = _ref$tone === void 0 ? 'neutral' : _ref$tone;
43
41
  var _useFieldIds = useFieldIds(idProp),
44
42
  descriptionId = _useFieldIds.descriptionId,
45
43
  inputId = _useFieldIds.inputId,
@@ -50,14 +48,13 @@ var Field = /*#__PURE__*/forwardRef(function (_ref, forwardedRef) {
50
48
  var fieldContext = useMemo(function () {
51
49
  return [{
52
50
  disabled: disabled,
53
- invalid: invalid,
54
- readOnly: readOnly
51
+ invalid: invalid
55
52
  }, {
56
53
  'aria-describedby': mergeIds(message && messageId, description && descriptionId),
57
54
  'aria-invalid': invalid || undefined,
58
55
  id: inputId
59
56
  }];
60
- }, [description, descriptionId, disabled, inputId, invalid, message, messageId, readOnly]);
57
+ }, [description, descriptionId, disabled, inputId, invalid, message, messageId]);
61
58
 
62
59
  // label prep
63
60
  var hiddenLabel = jsxs(VisuallyHidden, {
@@ -71,11 +68,11 @@ var Field = /*#__PURE__*/forwardRef(function (_ref, forwardedRef) {
71
68
  as: "label",
72
69
  htmlFor: inputId,
73
70
  children: jsxs(Text, {
74
- tone: disabled || readOnly ? 'field' : 'neutral',
71
+ tone: disabled ? 'disabled' : 'neutral',
75
72
  weight: "semibold",
76
73
  children: [label, ' ', secondaryLabel && jsx(Text, {
77
74
  inline: true,
78
- tone: disabled || readOnly ? 'field' : 'muted',
75
+ tone: disabled ? 'disabled' : 'muted',
79
76
  weight: "regular",
80
77
  children: secondaryLabel
81
78
  })]
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@spark-web/field",
3
- "version": "5.1.1",
3
+ "version": "5.2.0-rc.0",
4
4
  "homepage": "https://github.com/brighte-labs/spark-web#readme",
5
5
  "repository": {
6
6
  "type": "git",
@@ -17,20 +17,20 @@
17
17
  "dependencies": {
18
18
  "@babel/runtime": "^7.25.0",
19
19
  "@emotion/react": "^11.14.0",
20
- "@spark-web/a11y": "^5.0.0",
21
- "@spark-web/box": "^5.0.0",
22
- "@spark-web/icon": "^5.0.0",
23
- "@spark-web/stack": "^5.0.0",
24
- "@spark-web/text": "^5.0.0",
25
- "@spark-web/theme": "^5.10.6",
26
- "@spark-web/utils": "^5.0.0"
20
+ "@spark-web/a11y": "^5.3.0-rc.0",
21
+ "@spark-web/box": "^6.0.0-rc.0",
22
+ "@spark-web/icon": "^5.1.0-rc.0",
23
+ "@spark-web/stack": "^5.1.0-rc.0",
24
+ "@spark-web/text": "^5.3.0-rc.0",
25
+ "@spark-web/theme": "^5.12.0-rc.0",
26
+ "@spark-web/utils": "^5.1.0-rc.0"
27
27
  },
28
28
  "devDependencies": {
29
- "@types/react": "^18.2.0",
30
- "react": "^18.2.0"
29
+ "@types/react": "^19.1.0",
30
+ "react": "^19.1.0"
31
31
  },
32
32
  "peerDependencies": {
33
- "react": ">=17.0.2"
33
+ "react": ">=19.1.0"
34
34
  },
35
35
  "engines": {
36
36
  "node": ">=14"