@dxos/react-input 0.8.2-main.36232bc → 0.8.2-main.4c6cf53
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/lib/browser/index.mjs +161 -111
- package/dist/lib/browser/index.mjs.map +1 -1
- package/dist/lib/browser/meta.json +1 -1
- package/dist/lib/node/index.cjs +161 -111
- package/dist/lib/node/index.cjs.map +1 -1
- package/dist/lib/node/meta.json +1 -1
- package/dist/lib/node-esm/index.mjs +161 -111
- package/dist/lib/node-esm/index.mjs.map +1 -1
- package/dist/lib/node-esm/meta.json +1 -1
- package/dist/types/tsconfig.tsbuildinfo +1 -1
- package/package.json +3 -2
package/dist/lib/node/index.cjs
CHANGED
|
@@ -43,154 +43,204 @@ __export(node_exports, {
|
|
|
43
43
|
useInputContext: () => useInputContext
|
|
44
44
|
});
|
|
45
45
|
module.exports = __toCommonJS(node_exports);
|
|
46
|
+
var import_tracking = require("@preact-signals/safe-react/tracking");
|
|
46
47
|
var import_react_primitive = require("@radix-ui/react-primitive");
|
|
47
48
|
var import_react_slot = require("@radix-ui/react-slot");
|
|
48
49
|
var import_react = __toESM(require("react"));
|
|
50
|
+
var import_tracking2 = require("@preact-signals/safe-react/tracking");
|
|
49
51
|
var import_react_context = require("@radix-ui/react-context");
|
|
50
52
|
var import_react2 = __toESM(require("react"));
|
|
51
53
|
var import_react_hooks = require("@dxos/react-hooks");
|
|
54
|
+
var import_tracking3 = require("@preact-signals/safe-react/tracking");
|
|
52
55
|
var import_rci = require("rci");
|
|
53
56
|
var import_react3 = __toESM(require("react"));
|
|
54
57
|
var import_react_hooks2 = require("@dxos/react-hooks");
|
|
58
|
+
var import_tracking4 = require("@preact-signals/safe-react/tracking");
|
|
55
59
|
var import_react_primitive2 = require("@radix-ui/react-primitive");
|
|
56
60
|
var import_react4 = __toESM(require("react"));
|
|
61
|
+
var import_tracking5 = require("@preact-signals/safe-react/tracking");
|
|
57
62
|
var import_react5 = __toESM(require("react"));
|
|
58
63
|
var INPUT_NAME = "Input";
|
|
59
64
|
var [createInputContext, createInputScope] = (0, import_react_context.createContextScope)(INPUT_NAME, []);
|
|
60
65
|
var [InputProvider, useInputContext] = createInputContext(INPUT_NAME);
|
|
61
66
|
var InputRoot = ({ __inputScope, id: propsId, descriptionId: propsDescriptionId, errorMessageId: propsErrorMessageId, validationValence = "neutral", children }) => {
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
67
|
+
var _effect = (0, import_tracking2.useSignals)();
|
|
68
|
+
try {
|
|
69
|
+
const id = (0, import_react_hooks.useId)("input", propsId);
|
|
70
|
+
const descriptionId = (0, import_react_hooks.useId)("input__description", propsDescriptionId);
|
|
71
|
+
const errorMessageId = (0, import_react_hooks.useId)("input__error-message", propsErrorMessageId);
|
|
72
|
+
return /* @__PURE__ */ import_react2.default.createElement(InputProvider, {
|
|
73
|
+
id,
|
|
74
|
+
descriptionId,
|
|
75
|
+
errorMessageId,
|
|
76
|
+
validationValence,
|
|
77
|
+
scope: __inputScope
|
|
78
|
+
}, children);
|
|
79
|
+
} finally {
|
|
80
|
+
_effect.f();
|
|
81
|
+
}
|
|
72
82
|
};
|
|
73
83
|
InputRoot.displayName = INPUT_NAME;
|
|
74
84
|
var Label = /* @__PURE__ */ (0, import_react.forwardRef)(({ __inputScope, asChild, children, ...props }, forwardedRef) => {
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
85
|
+
var _effect = (0, import_tracking.useSignals)();
|
|
86
|
+
try {
|
|
87
|
+
const { id } = useInputContext(INPUT_NAME, __inputScope);
|
|
88
|
+
const Root = asChild ? import_react_slot.Slot : import_react_primitive.Primitive.label;
|
|
89
|
+
return /* @__PURE__ */ import_react.default.createElement(Root, {
|
|
90
|
+
...props,
|
|
91
|
+
htmlFor: id,
|
|
92
|
+
ref: forwardedRef
|
|
93
|
+
}, children);
|
|
94
|
+
} finally {
|
|
95
|
+
_effect.f();
|
|
96
|
+
}
|
|
82
97
|
});
|
|
83
98
|
var Description = /* @__PURE__ */ (0, import_react.forwardRef)(({ __inputScope, asChild, children, ...props }, forwardedRef) => {
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
id: descriptionId
|
|
90
|
-
},
|
|
91
|
-
ref: forwardedRef
|
|
92
|
-
}, children);
|
|
93
|
-
});
|
|
94
|
-
var ErrorMessage = /* @__PURE__ */ (0, import_react.forwardRef)(({ __inputScope, asChild, children, ...props }, forwardedRef) => {
|
|
95
|
-
const { errorMessageId } = useInputContext(INPUT_NAME, __inputScope);
|
|
96
|
-
const Root = asChild ? import_react_slot.Slot : import_react_primitive.Primitive.span;
|
|
97
|
-
return /* @__PURE__ */ import_react.default.createElement(Root, {
|
|
98
|
-
...props,
|
|
99
|
-
id: errorMessageId,
|
|
100
|
-
ref: forwardedRef
|
|
101
|
-
}, children);
|
|
102
|
-
});
|
|
103
|
-
var Validation = /* @__PURE__ */ (0, import_react.forwardRef)((props, forwardedRef) => {
|
|
104
|
-
const { __inputScope, asChild, children, ...otherProps } = props;
|
|
105
|
-
const { validationValence } = useInputContext(INPUT_NAME, __inputScope);
|
|
106
|
-
if (validationValence === "error") {
|
|
107
|
-
return /* @__PURE__ */ import_react.default.createElement(ErrorMessage, {
|
|
99
|
+
var _effect = (0, import_tracking.useSignals)();
|
|
100
|
+
try {
|
|
101
|
+
const { descriptionId, validationValence } = useInputContext(INPUT_NAME, __inputScope);
|
|
102
|
+
const Root = asChild ? import_react_slot.Slot : import_react_primitive.Primitive.span;
|
|
103
|
+
return /* @__PURE__ */ import_react.default.createElement(Root, {
|
|
108
104
|
...props,
|
|
105
|
+
...validationValence === "error" && {
|
|
106
|
+
id: descriptionId
|
|
107
|
+
},
|
|
109
108
|
ref: forwardedRef
|
|
110
|
-
});
|
|
111
|
-
}
|
|
109
|
+
}, children);
|
|
110
|
+
} finally {
|
|
111
|
+
_effect.f();
|
|
112
|
+
}
|
|
113
|
+
});
|
|
114
|
+
var ErrorMessage = /* @__PURE__ */ (0, import_react.forwardRef)(({ __inputScope, asChild, children, ...props }, forwardedRef) => {
|
|
115
|
+
var _effect = (0, import_tracking.useSignals)();
|
|
116
|
+
try {
|
|
117
|
+
const { errorMessageId } = useInputContext(INPUT_NAME, __inputScope);
|
|
112
118
|
const Root = asChild ? import_react_slot.Slot : import_react_primitive.Primitive.span;
|
|
113
119
|
return /* @__PURE__ */ import_react.default.createElement(Root, {
|
|
114
|
-
...
|
|
120
|
+
...props,
|
|
121
|
+
id: errorMessageId,
|
|
115
122
|
ref: forwardedRef
|
|
116
123
|
}, children);
|
|
124
|
+
} finally {
|
|
125
|
+
_effect.f();
|
|
126
|
+
}
|
|
127
|
+
});
|
|
128
|
+
var Validation = /* @__PURE__ */ (0, import_react.forwardRef)((props, forwardedRef) => {
|
|
129
|
+
var _effect = (0, import_tracking.useSignals)();
|
|
130
|
+
try {
|
|
131
|
+
const { __inputScope, asChild, children, ...otherProps } = props;
|
|
132
|
+
const { validationValence } = useInputContext(INPUT_NAME, __inputScope);
|
|
133
|
+
if (validationValence === "error") {
|
|
134
|
+
return /* @__PURE__ */ import_react.default.createElement(ErrorMessage, {
|
|
135
|
+
...props,
|
|
136
|
+
ref: forwardedRef
|
|
137
|
+
});
|
|
138
|
+
} else {
|
|
139
|
+
const Root = asChild ? import_react_slot.Slot : import_react_primitive.Primitive.span;
|
|
140
|
+
return /* @__PURE__ */ import_react.default.createElement(Root, {
|
|
141
|
+
...otherProps,
|
|
142
|
+
ref: forwardedRef
|
|
143
|
+
}, children);
|
|
144
|
+
}
|
|
145
|
+
} finally {
|
|
146
|
+
_effect.f();
|
|
117
147
|
}
|
|
118
148
|
});
|
|
119
149
|
var DescriptionAndValidation = /* @__PURE__ */ (0, import_react.forwardRef)(({ __inputScope, asChild, children, ...props }, forwardedRef) => {
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
150
|
+
var _effect = (0, import_tracking.useSignals)();
|
|
151
|
+
try {
|
|
152
|
+
const { descriptionId, validationValence } = useInputContext(INPUT_NAME, __inputScope);
|
|
153
|
+
const Root = asChild ? import_react_slot.Slot : import_react_primitive.Primitive.p;
|
|
154
|
+
return /* @__PURE__ */ import_react.default.createElement(Root, {
|
|
155
|
+
...props,
|
|
156
|
+
...validationValence !== "error" && {
|
|
157
|
+
id: descriptionId
|
|
158
|
+
},
|
|
159
|
+
ref: forwardedRef
|
|
160
|
+
}, children);
|
|
161
|
+
} finally {
|
|
162
|
+
_effect.f();
|
|
163
|
+
}
|
|
129
164
|
});
|
|
130
165
|
var PinInput = /* @__PURE__ */ (0, import_react3.forwardRef)(({ __inputScope, segmentClassName, inputClassName, segmentPadding = "8px", segmentHeight = "100%", ...props }, forwardedRef) => {
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
166
|
+
var _effect = (0, import_tracking3.useSignals)();
|
|
167
|
+
try {
|
|
168
|
+
const { id, validationValence, descriptionId, errorMessageId } = useInputContext(INPUT_NAME, __inputScope);
|
|
169
|
+
const width = (0, import_rci.getSegmentCssWidth)(segmentPadding);
|
|
170
|
+
const inputRef = (0, import_react_hooks2.useForwardedRef)(forwardedRef);
|
|
171
|
+
const inputFocused = (0, import_react_hooks2.useIsFocused)(inputRef);
|
|
172
|
+
const renderSegment = (0, import_react3.useCallback)(({ state, index }) => /* @__PURE__ */ import_react3.default.createElement("div", {
|
|
173
|
+
key: index,
|
|
174
|
+
className: segmentClassName?.({
|
|
175
|
+
focused: !!(inputFocused && state),
|
|
176
|
+
validationValence
|
|
177
|
+
}),
|
|
178
|
+
"data-state": state,
|
|
179
|
+
style: {
|
|
180
|
+
width,
|
|
181
|
+
height: segmentHeight
|
|
182
|
+
}
|
|
183
|
+
}), [
|
|
184
|
+
segmentClassName,
|
|
185
|
+
inputFocused,
|
|
139
186
|
validationValence
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
"aria-invalid": "true",
|
|
162
|
-
"aria-errormessage": errorMessageId
|
|
163
|
-
},
|
|
164
|
-
inputRef,
|
|
165
|
-
renderSegment,
|
|
166
|
-
className: inputClassName
|
|
167
|
-
});
|
|
187
|
+
]);
|
|
188
|
+
return /* @__PURE__ */ import_react3.default.createElement(import_rci.CodeInput, {
|
|
189
|
+
padding: "8px",
|
|
190
|
+
spacing: "8px",
|
|
191
|
+
fontFamily: "",
|
|
192
|
+
spellCheck: false,
|
|
193
|
+
length: 6,
|
|
194
|
+
...props,
|
|
195
|
+
id,
|
|
196
|
+
"aria-describedby": descriptionId,
|
|
197
|
+
...validationValence === "error" && {
|
|
198
|
+
"aria-invalid": "true",
|
|
199
|
+
"aria-errormessage": errorMessageId
|
|
200
|
+
},
|
|
201
|
+
inputRef,
|
|
202
|
+
renderSegment,
|
|
203
|
+
className: inputClassName
|
|
204
|
+
});
|
|
205
|
+
} finally {
|
|
206
|
+
_effect.f();
|
|
207
|
+
}
|
|
168
208
|
});
|
|
169
209
|
var TextInput = /* @__PURE__ */ (0, import_react4.forwardRef)(({ __inputScope, ...props }, forwardedRef) => {
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
"aria-
|
|
177
|
-
"
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
210
|
+
var _effect = (0, import_tracking4.useSignals)();
|
|
211
|
+
try {
|
|
212
|
+
const { id, validationValence, descriptionId, errorMessageId } = useInputContext(INPUT_NAME, __inputScope);
|
|
213
|
+
return /* @__PURE__ */ import_react4.default.createElement(import_react_primitive2.Primitive.input, {
|
|
214
|
+
...props,
|
|
215
|
+
id,
|
|
216
|
+
"aria-describedby": descriptionId,
|
|
217
|
+
...validationValence === "error" && {
|
|
218
|
+
"aria-invalid": "true",
|
|
219
|
+
"aria-errormessage": errorMessageId
|
|
220
|
+
},
|
|
221
|
+
ref: forwardedRef
|
|
222
|
+
});
|
|
223
|
+
} finally {
|
|
224
|
+
_effect.f();
|
|
225
|
+
}
|
|
181
226
|
});
|
|
182
227
|
var TextArea = /* @__PURE__ */ (0, import_react5.forwardRef)(({ __inputScope, ...props }, forwardedRef) => {
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
"aria-
|
|
190
|
-
"
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
228
|
+
var _effect = (0, import_tracking5.useSignals)();
|
|
229
|
+
try {
|
|
230
|
+
const { id, validationValence, descriptionId, errorMessageId } = useInputContext(INPUT_NAME, __inputScope);
|
|
231
|
+
return /* @__PURE__ */ import_react5.default.createElement("textarea", {
|
|
232
|
+
...props,
|
|
233
|
+
id,
|
|
234
|
+
"aria-describedby": descriptionId,
|
|
235
|
+
...validationValence === "error" && {
|
|
236
|
+
"aria-invalid": "true",
|
|
237
|
+
"aria-errormessage": errorMessageId
|
|
238
|
+
},
|
|
239
|
+
ref: forwardedRef
|
|
240
|
+
});
|
|
241
|
+
} finally {
|
|
242
|
+
_effect.f();
|
|
243
|
+
}
|
|
194
244
|
});
|
|
195
245
|
// Annotate the CommonJS export names for ESM import in node:
|
|
196
246
|
0 && (module.exports = {
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/InputMeta.tsx", "../../../src/Root.tsx", "../../../src/PinInput.tsx", "../../../src/TextInput.tsx", "../../../src/TextArea.tsx"],
|
|
4
4
|
"sourcesContent": ["//\n// Copyright 2023 DXOS.org\n//\n\nimport { Primitive } from '@radix-ui/react-primitive';\nimport { Slot } from '@radix-ui/react-slot';\nimport React, { type ComponentPropsWithRef, forwardRef } from 'react';\n\nimport { INPUT_NAME, type InputScopedProps, useInputContext } from './Root';\n\ntype LabelProps = ComponentPropsWithRef<typeof Primitive.label> & { asChild?: boolean };\n\nconst Label = forwardRef<HTMLLabelElement, LabelProps>(\n ({ __inputScope, asChild, children, ...props }: InputScopedProps<LabelProps>, forwardedRef) => {\n const { id } = useInputContext(INPUT_NAME, __inputScope);\n const Root = asChild ? Slot : Primitive.label;\n return (\n <Root {...props} htmlFor={id} ref={forwardedRef}>\n {children}\n </Root>\n );\n },\n);\n\ntype DescriptionProps = Omit<ComponentPropsWithRef<typeof Primitive.span>, 'id'> & { asChild?: boolean };\n\nconst Description = forwardRef<HTMLSpanElement, DescriptionProps>(\n ({ __inputScope, asChild, children, ...props }: InputScopedProps<DescriptionProps>, forwardedRef) => {\n const { descriptionId, validationValence } = useInputContext(INPUT_NAME, __inputScope);\n const Root = asChild ? Slot : Primitive.span;\n return (\n <Root {...props} {...(validationValence === 'error' && { id: descriptionId })} ref={forwardedRef}>\n {children}\n </Root>\n );\n },\n);\n\ntype ErrorMessageProps = Omit<ComponentPropsWithRef<typeof Primitive.span>, 'id'> & { asChild?: boolean };\n\nconst ErrorMessage = forwardRef<HTMLSpanElement, ErrorMessageProps>(\n ({ __inputScope, asChild, children, ...props }: InputScopedProps<ErrorMessageProps>, forwardedRef) => {\n const { errorMessageId } = useInputContext(INPUT_NAME, __inputScope);\n const Root = asChild ? Slot : Primitive.span;\n return (\n <Root {...props} id={errorMessageId} ref={forwardedRef}>\n {children}\n </Root>\n );\n },\n);\n\ntype ValidationProps = Omit<ComponentPropsWithRef<typeof Primitive.span>, 'id'> & { asChild?: boolean };\n\nconst Validation = forwardRef<HTMLSpanElement, ValidationProps>(\n (props: InputScopedProps<ValidationProps>, forwardedRef) => {\n const { __inputScope, asChild, children, ...otherProps } = props;\n const { validationValence } = useInputContext(INPUT_NAME, __inputScope);\n if (validationValence === 'error') {\n return <ErrorMessage {...props} ref={forwardedRef} />;\n } else {\n const Root = asChild ? Slot : Primitive.span;\n return (\n <Root {...otherProps} ref={forwardedRef}>\n {children}\n </Root>\n );\n }\n },\n);\n\ntype DescriptionAndValidationProps = ComponentPropsWithRef<typeof Primitive.p> & { asChild?: boolean };\n\nconst DescriptionAndValidation = forwardRef<HTMLParagraphElement, DescriptionAndValidationProps>(\n ({ __inputScope, asChild, children, ...props }: InputScopedProps<DescriptionAndValidationProps>, forwardedRef) => {\n const { descriptionId, validationValence } = useInputContext(INPUT_NAME, __inputScope);\n const Root = asChild ? Slot : Primitive.p;\n return (\n <Root {...props} {...(validationValence !== 'error' && { id: descriptionId })} ref={forwardedRef}>\n {children}\n </Root>\n );\n },\n);\n\nexport { Label, Validation, Description, DescriptionAndValidation, ErrorMessage };\n\nexport type { LabelProps, ValidationProps, DescriptionProps, DescriptionAndValidationProps, ErrorMessageProps };\n", "//\n// Copyright 2023 DXOS.org\n//\n\nimport { createContextScope, type Scope } from '@radix-ui/react-context';\nimport React, { type PropsWithChildren } from 'react';\n\nimport { useId } from '@dxos/react-hooks';\n\nconst INPUT_NAME = 'Input';\n\ntype Valence = 'success' | 'info' | 'warning' | 'error' | 'neutral';\n\ntype InputScopedProps<P> = P & { __inputScope?: Scope };\n\ntype InputRootProps = PropsWithChildren<{\n id?: string;\n validationValence?: Valence;\n descriptionId?: string;\n errorMessageId?: string;\n}>;\n\nconst [createInputContext, createInputScope] = createContextScope(INPUT_NAME, []);\n\ntype InputContextValue = {\n id: string;\n descriptionId: string;\n errorMessageId: string;\n validationValence: Valence;\n};\n\nconst [InputProvider, useInputContext] = createInputContext<InputContextValue>(INPUT_NAME);\n\nconst InputRoot = ({\n __inputScope,\n id: propsId,\n descriptionId: propsDescriptionId,\n errorMessageId: propsErrorMessageId,\n validationValence = 'neutral',\n children,\n}: InputScopedProps<InputRootProps>) => {\n const id = useId('input', propsId);\n const descriptionId = useId('input__description', propsDescriptionId);\n const errorMessageId = useId('input__error-message', propsErrorMessageId);\n return (\n <InputProvider {...{ id, descriptionId, errorMessageId, validationValence }} scope={__inputScope}>\n {children}\n </InputProvider>\n );\n};\n\nInputRoot.displayName = INPUT_NAME;\n\nexport { InputRoot, InputRoot as Root, createInputScope, useInputContext, INPUT_NAME };\n\nexport type { Valence, InputRootProps, InputScopedProps };\n", "//\n// Copyright 2023 DXOS.org\n//\n\nimport { CodeInput, getSegmentCssWidth } from 'rci';\nimport React, { type ComponentProps, type ComponentPropsWithRef, forwardRef, useCallback } from 'react';\n\nimport { useForwardedRef, useIsFocused } from '@dxos/react-hooks';\n\nimport { INPUT_NAME, type InputScopedProps, useInputContext, type Valence } from './Root';\n\ntype PinInputProps = Omit<\n ComponentPropsWithRef<typeof CodeInput>,\n 'id' | 'className' | 'inputRef' | 'renderSegment'\n> & {\n inputClassName?: string;\n segmentClassName?: (styleProps: { focused: boolean; validationValence: Valence }) => string;\n segmentPadding?: string;\n segmentHeight?: string;\n};\n\nconst PinInput = forwardRef<HTMLInputElement, PinInputProps>(\n (\n {\n __inputScope,\n segmentClassName,\n inputClassName,\n segmentPadding = '8px',\n segmentHeight = '100%',\n ...props\n }: InputScopedProps<PinInputProps>,\n forwardedRef,\n ) => {\n const { id, validationValence, descriptionId, errorMessageId } = useInputContext(INPUT_NAME, __inputScope);\n const width = getSegmentCssWidth(segmentPadding);\n const inputRef = useForwardedRef(forwardedRef);\n const inputFocused = useIsFocused(inputRef);\n\n const renderSegment = useCallback<ComponentProps<typeof CodeInput>['renderSegment']>(\n ({ state, index }) => (\n <div\n key={index}\n className={segmentClassName?.({\n focused: !!(inputFocused && state),\n validationValence,\n })}\n data-state={state}\n style={{ width, height: segmentHeight }}\n />\n ),\n [segmentClassName, inputFocused, validationValence],\n );\n\n return (\n <CodeInput\n {...{\n padding: '8px',\n spacing: '8px',\n fontFamily: '',\n spellCheck: false,\n length: 6,\n ...props,\n id,\n 'aria-describedby': descriptionId,\n ...(validationValence === 'error' && {\n 'aria-invalid': 'true' as const,\n 'aria-errormessage': errorMessageId,\n }),\n inputRef,\n renderSegment,\n className: inputClassName,\n }}\n />\n );\n },\n);\n\nexport { PinInput };\n\nexport type { PinInputProps };\n", "//\n// Copyright 2023 DXOS.org\n//\n\nimport { Primitive } from '@radix-ui/react-primitive';\nimport React, { type ComponentPropsWithRef, forwardRef } from 'react';\n\nimport { INPUT_NAME, type InputScopedProps, useInputContext } from './Root';\n\ntype TextInputProps = Omit<ComponentPropsWithRef<typeof Primitive.input>, 'id'>;\n\nconst TextInput = forwardRef<HTMLInputElement, TextInputProps>(\n ({ __inputScope, ...props }: InputScopedProps<TextInputProps>, forwardedRef) => {\n const { id, validationValence, descriptionId, errorMessageId } = useInputContext(INPUT_NAME, __inputScope);\n return (\n <Primitive.input\n {...{\n ...props,\n id,\n 'aria-describedby': descriptionId,\n ...(validationValence === 'error' && {\n 'aria-invalid': 'true' as const,\n 'aria-errormessage': errorMessageId,\n }),\n ref: forwardedRef,\n }}\n />\n );\n },\n);\n\nexport { TextInput };\n\nexport type { TextInputProps };\n", "//\n// Copyright 2023 DXOS.org\n//\n\nimport React, { type ComponentPropsWithRef, forwardRef } from 'react';\n\nimport { INPUT_NAME, type InputScopedProps, useInputContext } from './Root';\n\ntype TextAreaProps = Omit<ComponentPropsWithRef<'textarea'>, 'id'>;\n\nconst TextArea = forwardRef<HTMLTextAreaElement, TextAreaProps>(\n ({ __inputScope, ...props }: InputScopedProps<TextAreaProps>, forwardedRef) => {\n const { id, validationValence, descriptionId, errorMessageId } = useInputContext(INPUT_NAME, __inputScope);\n return (\n <textarea\n {...{\n ...props,\n id,\n 'aria-describedby': descriptionId,\n ...(validationValence === 'error' && {\n 'aria-invalid': 'true' as const,\n 'aria-errormessage': errorMessageId,\n }),\n ref: forwardedRef,\n }}\n />\n );\n },\n);\n\nexport { TextArea };\n\nexport type { TextAreaProps };\n"],
|
|
5
|
-
"mappings": "
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["import_react", "import_react_hooks", "import_react_primitive", "INPUT_NAME", "createInputContext", "createInputScope", "createContextScope", "InputProvider", "useInputContext", "InputRoot", "__inputScope", "id", "propsId", "descriptionId", "propsDescriptionId", "errorMessageId", "propsErrorMessageId", "validationValence", "children", "useId", "React", "scope", "displayName", "Label", "forwardRef", "asChild", "props", "forwardedRef", "Root", "Slot", "Primitive", "label", "htmlFor", "ref", "Description", "span", "ErrorMessage", "Validation", "otherProps", "DescriptionAndValidation", "p", "PinInput", "segmentClassName", "inputClassName", "segmentPadding", "segmentHeight", "width", "getSegmentCssWidth", "inputRef", "useForwardedRef", "inputFocused", "useIsFocused", "renderSegment", "useCallback", "state", "index", "div", "key", "className", "focused", "data-state", "style", "height", "CodeInput", "padding", "spacing", "fontFamily", "spellCheck", "length", "TextInput", "input", "TextArea", "textarea"]
|
|
7
7
|
}
|
package/dist/lib/node/meta.json
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"inputs":{"packages/ui/primitives/react-input/src/Root.tsx":{"bytes":
|
|
1
|
+
{"inputs":{"packages/ui/primitives/react-input/src/Root.tsx":{"bytes":4897,"imports":[{"path":"@preact-signals/safe-react/tracking","kind":"import-statement","external":true},{"path":"@radix-ui/react-context","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-hooks","kind":"import-statement","external":true}],"format":"esm"},"packages/ui/primitives/react-input/src/InputMeta.tsx":{"bytes":10829,"imports":[{"path":"@preact-signals/safe-react/tracking","kind":"import-statement","external":true},{"path":"@radix-ui/react-primitive","kind":"import-statement","external":true},{"path":"@radix-ui/react-slot","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"packages/ui/primitives/react-input/src/Root.tsx","kind":"import-statement","original":"./Root"}],"format":"esm"},"packages/ui/primitives/react-input/src/PinInput.tsx":{"bytes":7337,"imports":[{"path":"@preact-signals/safe-react/tracking","kind":"import-statement","external":true},{"path":"rci","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-hooks","kind":"import-statement","external":true},{"path":"packages/ui/primitives/react-input/src/Root.tsx","kind":"import-statement","original":"./Root"}],"format":"esm"},"packages/ui/primitives/react-input/src/TextInput.tsx":{"bytes":3432,"imports":[{"path":"@preact-signals/safe-react/tracking","kind":"import-statement","external":true},{"path":"@radix-ui/react-primitive","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"packages/ui/primitives/react-input/src/Root.tsx","kind":"import-statement","original":"./Root"}],"format":"esm"},"packages/ui/primitives/react-input/src/TextArea.tsx":{"bytes":3197,"imports":[{"path":"@preact-signals/safe-react/tracking","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"packages/ui/primitives/react-input/src/Root.tsx","kind":"import-statement","original":"./Root"}],"format":"esm"},"packages/ui/primitives/react-input/src/index.ts":{"bytes":824,"imports":[{"path":"packages/ui/primitives/react-input/src/InputMeta.tsx","kind":"import-statement","original":"./InputMeta"},{"path":"packages/ui/primitives/react-input/src/Root.tsx","kind":"import-statement","original":"./Root"},{"path":"packages/ui/primitives/react-input/src/PinInput.tsx","kind":"import-statement","original":"./PinInput"},{"path":"packages/ui/primitives/react-input/src/TextInput.tsx","kind":"import-statement","original":"./TextInput"},{"path":"packages/ui/primitives/react-input/src/TextArea.tsx","kind":"import-statement","original":"./TextArea"}],"format":"esm"}},"outputs":{"packages/ui/primitives/react-input/dist/lib/node/index.cjs.map":{"imports":[],"exports":[],"inputs":{},"bytes":15057},"packages/ui/primitives/react-input/dist/lib/node/index.cjs":{"imports":[{"path":"@preact-signals/safe-react/tracking","kind":"import-statement","external":true},{"path":"@radix-ui/react-primitive","kind":"import-statement","external":true},{"path":"@radix-ui/react-slot","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@preact-signals/safe-react/tracking","kind":"import-statement","external":true},{"path":"@radix-ui/react-context","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-hooks","kind":"import-statement","external":true},{"path":"@preact-signals/safe-react/tracking","kind":"import-statement","external":true},{"path":"rci","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-hooks","kind":"import-statement","external":true},{"path":"@preact-signals/safe-react/tracking","kind":"import-statement","external":true},{"path":"@radix-ui/react-primitive","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@preact-signals/safe-react/tracking","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true}],"exports":["Description","DescriptionAndValidation","ErrorMessage","INPUT_NAME","InputRoot","Label","PinInput","Root","TextArea","TextInput","Validation","createInputScope","useInputContext"],"entryPoint":"packages/ui/primitives/react-input/src/index.ts","inputs":{"packages/ui/primitives/react-input/src/InputMeta.tsx":{"bytesInOutput":2831},"packages/ui/primitives/react-input/src/Root.tsx":{"bytesInOutput":1050},"packages/ui/primitives/react-input/src/index.ts":{"bytesInOutput":0},"packages/ui/primitives/react-input/src/PinInput.tsx":{"bytesInOutput":1658},"packages/ui/primitives/react-input/src/TextInput.tsx":{"bytesInOutput":789},"packages/ui/primitives/react-input/src/TextArea.tsx":{"bytesInOutput":713}},"bytes":7627}}}
|