@plasmicpkgs/react-aria 0.0.42 → 0.0.44

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.
Files changed (146) hide show
  1. package/dist/.tsbuildinfo +1 -1
  2. package/dist/common.d.ts +8 -1
  3. package/dist/contexts.d.ts +3 -2
  4. package/dist/react-aria.esm.js +863 -670
  5. package/dist/react-aria.esm.js.map +1 -1
  6. package/dist/react-aria.js +861 -668
  7. package/dist/react-aria.js.map +1 -1
  8. package/dist/registerButton.d.ts +1 -1
  9. package/dist/registerCheckbox.d.ts +3 -4
  10. package/dist/registerCheckboxGroup.d.ts +2 -2
  11. package/dist/registerInput.d.ts +12 -5
  12. package/dist/registerListBox.d.ts +2 -3
  13. package/dist/registerModal.d.ts +2 -3
  14. package/dist/registerPopover.d.ts +4 -6
  15. package/dist/registerRadio.d.ts +3 -5
  16. package/dist/registerRadioGroup.d.ts +1 -1
  17. package/dist/registerSlider.d.ts +3 -20
  18. package/dist/registerSliderOutput.d.ts +1 -1
  19. package/dist/registerSliderThumb.d.ts +3 -3
  20. package/dist/registerSliderTrack.d.ts +3 -1
  21. package/dist/registerSwitch.d.ts +1 -1
  22. package/dist/registerTextArea.d.ts +11 -5
  23. package/dist/registerTextField.d.ts +3 -3
  24. package/dist/utils.d.ts +7 -1
  25. package/package.json +2 -2
  26. package/skinny/common-96be13c3.esm.js +341 -0
  27. package/skinny/common-96be13c3.esm.js.map +1 -0
  28. package/skinny/common-f51484c1.cjs.js +345 -0
  29. package/skinny/common-f51484c1.cjs.js.map +1 -0
  30. package/skinny/common.d.ts +8 -1
  31. package/skinny/{contexts-7236059e.cjs.js → contexts-3a98471a.cjs.js} +1 -3
  32. package/skinny/contexts-3a98471a.cjs.js.map +1 -0
  33. package/skinny/{contexts-21e0d928.esm.js → contexts-87c261f6.esm.js} +2 -3
  34. package/skinny/contexts-87c261f6.esm.js.map +1 -0
  35. package/skinny/contexts.d.ts +3 -2
  36. package/skinny/registerButton.cjs.js +2 -2
  37. package/skinny/registerButton.cjs.js.map +1 -1
  38. package/skinny/registerButton.d.ts +1 -1
  39. package/skinny/registerButton.esm.js +2 -2
  40. package/skinny/registerButton.esm.js.map +1 -1
  41. package/skinny/registerCheckbox.cjs.js +13 -18
  42. package/skinny/registerCheckbox.cjs.js.map +1 -1
  43. package/skinny/registerCheckbox.d.ts +3 -4
  44. package/skinny/registerCheckbox.esm.js +13 -18
  45. package/skinny/registerCheckbox.esm.js.map +1 -1
  46. package/skinny/registerCheckboxGroup.cjs.js +5 -5
  47. package/skinny/registerCheckboxGroup.cjs.js.map +1 -1
  48. package/skinny/registerCheckboxGroup.d.ts +2 -2
  49. package/skinny/registerCheckboxGroup.esm.js +5 -5
  50. package/skinny/registerCheckboxGroup.esm.js.map +1 -1
  51. package/skinny/registerComboBox.cjs.js +3 -3
  52. package/skinny/registerComboBox.esm.js +3 -3
  53. package/skinny/registerDialogTrigger.cjs.js +2 -2
  54. package/skinny/registerDialogTrigger.esm.js +2 -2
  55. package/skinny/registerHeader.cjs.js +1 -1
  56. package/skinny/registerHeader.esm.js +1 -1
  57. package/skinny/registerInput.cjs.js +76 -16
  58. package/skinny/registerInput.cjs.js.map +1 -1
  59. package/skinny/registerInput.d.ts +12 -5
  60. package/skinny/registerInput.esm.js +76 -17
  61. package/skinny/registerInput.esm.js.map +1 -1
  62. package/skinny/{registerListBox-f060da58.cjs.js → registerListBox-44316bb6.cjs.js} +7 -7
  63. package/skinny/registerListBox-44316bb6.cjs.js.map +1 -0
  64. package/skinny/{registerListBox-38a08460.esm.js → registerListBox-ccd14a2e.esm.js} +7 -7
  65. package/skinny/registerListBox-ccd14a2e.esm.js.map +1 -0
  66. package/skinny/registerListBox.cjs.js +3 -2
  67. package/skinny/registerListBox.cjs.js.map +1 -1
  68. package/skinny/registerListBox.d.ts +2 -3
  69. package/skinny/registerListBox.esm.js +3 -2
  70. package/skinny/registerListBox.esm.js.map +1 -1
  71. package/skinny/registerListBoxItem.cjs.js +1 -1
  72. package/skinny/registerListBoxItem.esm.js +1 -1
  73. package/skinny/registerModal.cjs.js +5 -4
  74. package/skinny/registerModal.cjs.js.map +1 -1
  75. package/skinny/registerModal.d.ts +2 -3
  76. package/skinny/registerModal.esm.js +5 -4
  77. package/skinny/registerModal.esm.js.map +1 -1
  78. package/skinny/registerPopover.cjs.js +23 -24
  79. package/skinny/registerPopover.cjs.js.map +1 -1
  80. package/skinny/registerPopover.d.ts +4 -6
  81. package/skinny/registerPopover.esm.js +24 -25
  82. package/skinny/registerPopover.esm.js.map +1 -1
  83. package/skinny/registerRadio.cjs.js +14 -26
  84. package/skinny/registerRadio.cjs.js.map +1 -1
  85. package/skinny/registerRadio.d.ts +3 -5
  86. package/skinny/registerRadio.esm.js +14 -26
  87. package/skinny/registerRadio.esm.js.map +1 -1
  88. package/skinny/registerRadioGroup.cjs.js +4 -4
  89. package/skinny/registerRadioGroup.cjs.js.map +1 -1
  90. package/skinny/registerRadioGroup.d.ts +1 -1
  91. package/skinny/registerRadioGroup.esm.js +4 -4
  92. package/skinny/registerRadioGroup.esm.js.map +1 -1
  93. package/skinny/registerSection.cjs.js +1 -1
  94. package/skinny/registerSection.esm.js +1 -1
  95. package/skinny/registerSelect.cjs.js +3 -3
  96. package/skinny/registerSelect.esm.js +3 -3
  97. package/skinny/registerSlider.cjs.js +305 -15
  98. package/skinny/registerSlider.cjs.js.map +1 -1
  99. package/skinny/registerSlider.d.ts +3 -20
  100. package/skinny/registerSlider.esm.js +303 -11
  101. package/skinny/registerSlider.esm.js.map +1 -1
  102. package/skinny/registerSliderOutput.cjs.js +1 -1
  103. package/skinny/registerSliderOutput.cjs.js.map +1 -1
  104. package/skinny/registerSliderOutput.d.ts +1 -1
  105. package/skinny/registerSliderOutput.esm.js +1 -1
  106. package/skinny/registerSliderOutput.esm.js.map +1 -1
  107. package/skinny/registerSliderThumb.cjs.js +4 -4
  108. package/skinny/registerSliderThumb.cjs.js.map +1 -1
  109. package/skinny/registerSliderThumb.d.ts +3 -3
  110. package/skinny/registerSliderThumb.esm.js +4 -4
  111. package/skinny/registerSliderThumb.esm.js.map +1 -1
  112. package/skinny/registerSliderTrack.cjs.js +188 -16
  113. package/skinny/registerSliderTrack.cjs.js.map +1 -1
  114. package/skinny/registerSliderTrack.d.ts +3 -1
  115. package/skinny/registerSliderTrack.esm.js +184 -13
  116. package/skinny/registerSliderTrack.esm.js.map +1 -1
  117. package/skinny/registerSwitch.cjs.js +10 -4
  118. package/skinny/registerSwitch.cjs.js.map +1 -1
  119. package/skinny/registerSwitch.d.ts +1 -1
  120. package/skinny/registerSwitch.esm.js +10 -4
  121. package/skinny/registerSwitch.esm.js.map +1 -1
  122. package/skinny/registerTextArea.cjs.js +56 -35
  123. package/skinny/registerTextArea.cjs.js.map +1 -1
  124. package/skinny/registerTextArea.d.ts +11 -5
  125. package/skinny/registerTextArea.esm.js +56 -36
  126. package/skinny/registerTextArea.esm.js.map +1 -1
  127. package/skinny/registerTextField.cjs.js +34 -215
  128. package/skinny/registerTextField.cjs.js.map +1 -1
  129. package/skinny/registerTextField.d.ts +3 -3
  130. package/skinny/registerTextField.esm.js +34 -215
  131. package/skinny/registerTextField.esm.js.map +1 -1
  132. package/skinny/utils-a1785802.esm.js.map +1 -1
  133. package/skinny/utils-d3708034.cjs.js.map +1 -1
  134. package/skinny/utils.d.ts +7 -1
  135. package/skinny/common-52c26d37.esm.js +0 -52
  136. package/skinny/common-52c26d37.esm.js.map +0 -1
  137. package/skinny/common-e74a9214.cjs.js +0 -54
  138. package/skinny/common-e74a9214.cjs.js.map +0 -1
  139. package/skinny/contexts-21e0d928.esm.js.map +0 -1
  140. package/skinny/contexts-7236059e.cjs.js.map +0 -1
  141. package/skinny/registerListBox-38a08460.esm.js.map +0 -1
  142. package/skinny/registerListBox-f060da58.cjs.js.map +0 -1
  143. package/skinny/registerSlider-58ef7e20.cjs.js +0 -473
  144. package/skinny/registerSlider-58ef7e20.cjs.js.map +0 -1
  145. package/skinny/registerSlider-d74e2330.esm.js +0 -460
  146. package/skinny/registerSlider-d74e2330.esm.js.map +0 -1
@@ -2,8 +2,8 @@
2
2
 
3
3
  var React = require('react');
4
4
  var reactAriaComponents = require('react-aria-components');
5
- var common = require('./common-e74a9214.cjs.js');
6
- var contexts = require('./contexts-7236059e.cjs.js');
5
+ var common = require('./common-f51484c1.cjs.js');
6
+ var contexts = require('./contexts-3a98471a.cjs.js');
7
7
  var interactionVariantUtils = require('./interaction-variant-utils-36f1b397.cjs.js');
8
8
  var registerDescription = require('./registerDescription.cjs.js');
9
9
  var registerFieldError = require('./registerFieldError.cjs.js');
@@ -58,31 +58,15 @@ const { interactionVariants, withObservedValues } = interactionVariantUtils.pick
58
58
  TEXT_FIELD_INTERACTION_VARIANTS
59
59
  );
60
60
  function BaseTextField(props) {
61
- const _a = props, {
62
- enableAutoComplete,
63
- autoComplete,
61
+ const _a = props, { children, updateInteractionVariant, autoComplete } = _a, rest = __objRest(_a, ["children", "updateInteractionVariant", "autoComplete"]);
62
+ return /* @__PURE__ */ React__default.default.createElement(contexts.PlasmicTextFieldContext.Provider, { value: props }, /* @__PURE__ */ React__default.default.createElement(reactAriaComponents.TextField, __spreadValues({ autoComplete: common.resolveAutoComplete(autoComplete) }, rest), ({ isDisabled, isReadOnly }) => withObservedValues(
64
63
  children,
64
+ {
65
+ disabled: isDisabled,
66
+ readonly: isReadOnly
67
+ },
65
68
  updateInteractionVariant
66
- } = _a, rest = __objRest(_a, [
67
- "enableAutoComplete",
68
- "autoComplete",
69
- "children",
70
- "updateInteractionVariant"
71
- ]);
72
- return /* @__PURE__ */ React__default.default.createElement(contexts.PlasmicTextFieldContext.Provider, { value: props }, /* @__PURE__ */ React__default.default.createElement(
73
- reactAriaComponents.TextField,
74
- __spreadValues({
75
- autoComplete: enableAutoComplete ? autoComplete : void 0
76
- }, rest),
77
- ({ isDisabled, isReadOnly }) => withObservedValues(
78
- children,
79
- {
80
- disabled: isDisabled,
81
- readonly: isReadOnly
82
- },
83
- updateInteractionVariant
84
- )
85
- ));
69
+ )));
86
70
  }
87
71
  const TEXT_FIELD_COMPONENT_NAME = utils.makeComponentName("textField");
88
72
  function registerTextField(loader, overrides) {
@@ -96,13 +80,36 @@ function registerTextField(loader, overrides) {
96
80
  importName: "BaseTextField",
97
81
  interactionVariants,
98
82
  // TODO: Support for validate prop
99
- props: __spreadProps(__spreadValues({}, common.getCommonInputProps("input", [
83
+ props: __spreadProps(__spreadValues({}, common.getCommonProps("Text Field", [
100
84
  "name",
101
85
  "isDisabled",
102
86
  "isReadOnly",
103
87
  "autoFocus",
104
88
  "aria-label",
105
- "isRequired"
89
+ "isRequired",
90
+ "value",
91
+ "maxLength",
92
+ "minLength",
93
+ "pattern",
94
+ "type",
95
+ "inputMode",
96
+ "validationBehavior",
97
+ "autoComplete",
98
+ "onChange",
99
+ "onFocus",
100
+ "onBlur",
101
+ "onFocusChange",
102
+ "onKeyDown",
103
+ "onKeyUp",
104
+ "onCopy",
105
+ "onCut",
106
+ "onPaste",
107
+ "onCompositionStart",
108
+ "onCompositionEnd",
109
+ "onCompositionUpdate",
110
+ "onSelect",
111
+ "onBeforeInput",
112
+ "onInput"
106
113
  ])), {
107
114
  children: {
108
115
  type: "slot",
@@ -146,12 +153,6 @@ function registerTextField(loader, overrides) {
146
153
  ]
147
154
  }
148
155
  },
149
- value: {
150
- type: "string",
151
- editOnly: true,
152
- uncontrolledProp: "defaultValue",
153
- description: "The current value"
154
- },
155
156
  isInvalid: {
156
157
  // TODO: Not sure if needed
157
158
  displayName: "Invalid",
@@ -163,190 +164,8 @@ function registerTextField(loader, overrides) {
163
164
  // TODO: Not sure if needed
164
165
  type: "array",
165
166
  description: "Errors for custom validation"
166
- },
167
- // validate: {
168
- // type: "function" as const,
169
- // argNames: ["value"],
170
- // argValues: (_ps: any, ctx: any) => [ctx.data[0]],
171
- // },
172
- enableAutoComplete: {
173
- type: "boolean",
174
- description: "Whether the browser is allowed to automatically complete the input",
175
- defaultValueHint: false
176
- },
177
- autoComplete: {
178
- type: "choice",
179
- hidden: ({ enableAutoComplete }) => !enableAutoComplete,
180
- description: "Guidance as to the type of data expected in the field",
181
- helpText: "For explanations on what each of the values mean, check https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autocomplete#values",
182
- options: [
183
- "name",
184
- "honorific-prefix",
185
- "given-name",
186
- "additional-name",
187
- "family-name",
188
- "honorific-suffix",
189
- "nickname",
190
- "email",
191
- "username",
192
- "new-password",
193
- "current-password",
194
- "one-time-code",
195
- "organization-title",
196
- "organization",
197
- "street-address",
198
- "shipping",
199
- "billing",
200
- "address-line1",
201
- "address-line2",
202
- "address-line3",
203
- "address-level4",
204
- "address-level3",
205
- "address-level2",
206
- "address-level1",
207
- "country",
208
- "country-name",
209
- "postal-code",
210
- "cc-name",
211
- "cc-given-name",
212
- "cc-additional-name",
213
- "cc-family-name",
214
- "cc-number",
215
- "cc-exp",
216
- "cc-exp-month",
217
- "cc-exp-year",
218
- "cc-csc",
219
- "cc-type",
220
- "transaction-currency",
221
- "transaction-amount",
222
- "language",
223
- "bday",
224
- "bday-day",
225
- "bday-month",
226
- "bday-year",
227
- "sex",
228
- "tel",
229
- "tel-country-code",
230
- "tel-national",
231
- "tel-area-code",
232
- "tel-local",
233
- "tel-local-suffix",
234
- "tel-local-prefix",
235
- "tel-extension",
236
- "impp",
237
- "url",
238
- "photo",
239
- "webauthn"
240
- ]
241
- },
242
- maxLength: {
243
- type: "number",
244
- description: "The maximum number of characters supported by the input"
245
- },
246
- minLength: {
247
- type: "number",
248
- description: "The minimum number of characters supported by the input"
249
- },
250
- pattern: {
251
- type: "string",
252
- description: "Regex pattern that the value of the input must match to be valid",
253
- helpText: "For more information about writing Regular Expressions (regex), check out https://regexr.com/",
254
- validator: (value) => {
255
- try {
256
- new RegExp(value);
257
- return true;
258
- } catch (error) {
259
- return "Invalid Regex";
260
- }
261
- }
262
- },
263
- type: {
264
- type: "choice",
265
- defaultValueHint: "text",
266
- options: ["text", "search", "url", "tel", "email", "password"]
267
- },
268
- inputMode: {
269
- type: "choice",
270
- description: "hint to browsers as to the type of virtual keyboard configuration to use when editing this element or its contents.",
271
- options: [
272
- "none",
273
- "text",
274
- "tel",
275
- "url",
276
- "email",
277
- "numeric",
278
- "decimal",
279
- "search"
280
- ]
281
- },
282
- validationBehavior: {
283
- type: "choice",
284
- options: ["native", "aria"],
285
- description: "Whether to use native HTML form validation to prevent form submission when the value is missing or invalid, or mark the field as required or invalid via ARIA.",
286
- defaultValueHint: "native"
287
- },
288
- onChange: {
289
- type: "eventHandler",
290
- argTypes: [{ name: "value", type: "string" }]
291
- },
292
- onFocus: {
293
- type: "eventHandler",
294
- argTypes: [{ name: "focusEvent", type: "object" }]
295
- },
296
- onBlur: {
297
- type: "eventHandler",
298
- argTypes: [{ name: "focusEvent", type: "object" }]
299
- },
300
- onFocusChange: {
301
- type: "eventHandler",
302
- argTypes: [{ name: "isFocused", type: "boolean" }]
303
- },
304
- onKeyDown: {
305
- type: "eventHandler",
306
- argTypes: [{ name: "keyboardEvent", type: "object" }]
307
- },
308
- onKeyUp: {
309
- type: "eventHandler",
310
- argTypes: [{ name: "keyboardEvent", type: "object" }]
311
- },
312
- onCopy: {
313
- type: "eventHandler",
314
- argTypes: [{ name: "clipbordEvent", type: "object" }]
315
- },
316
- onCut: {
317
- type: "eventHandler",
318
- argTypes: [{ name: "clipbordEvent", type: "object" }]
319
- },
320
- onPaste: {
321
- type: "eventHandler",
322
- argTypes: [{ name: "clipbordEvent", type: "object" }]
323
- },
324
- onCompositionStart: {
325
- type: "eventHandler",
326
- argTypes: [{ name: "compositionEvent", type: "object" }]
327
- },
328
- onCompositionEnd: {
329
- type: "eventHandler",
330
- argTypes: [{ name: "compositionEvent", type: "object" }]
331
- },
332
- onCompositionUpdate: {
333
- type: "eventHandler",
334
- argTypes: [{ name: "compositionEvent", type: "object" }]
335
- },
336
- onSelect: {
337
- type: "eventHandler",
338
- argTypes: [{ name: "selectionEvent", type: "object" }]
339
- },
340
- onBeforeInput: {
341
- type: "eventHandler",
342
- argTypes: [{ name: "inputEvent", type: "object" }]
343
- },
344
- onInput: {
345
- type: "eventHandler",
346
- argTypes: [{ name: "inputEvent", type: "object" }]
347
167
  }
348
168
  }),
349
- // NOTE: React-Aria does not support render props for <Input> and <Textarea>, so focusVisible and inputHovered states are not implemented
350
169
  states: {
351
170
  value: {
352
171
  type: "writable",
@@ -1 +1 @@
1
- {"version":3,"file":"registerTextField.cjs.js","sources":["../src/registerTextField.tsx"],"sourcesContent":["import React, { ReactNode } from \"react\";\nimport type { InputProps, TextFieldProps } from \"react-aria-components\";\nimport { TextField } from \"react-aria-components\";\nimport { getCommonInputProps } from \"./common\";\nimport { PlasmicTextFieldContext } from \"./contexts\";\nimport {\n UpdateInteractionVariant,\n pickAriaComponentVariants,\n} from \"./interaction-variant-utils\";\nimport { DESCRIPTION_COMPONENT_NAME } from \"./registerDescription\";\nimport { registerFieldError } from \"./registerFieldError\";\nimport { INPUT_COMPONENT_NAME, registerInput } from \"./registerInput\";\nimport { LABEL_COMPONENT_NAME, registerLabel } from \"./registerLabel\";\nimport { registerTextArea } from \"./registerTextArea\";\nimport {\n CodeComponentMetaOverrides,\n Registerable,\n makeChildComponentName,\n makeComponentName,\n registerComponentHelper,\n} from \"./utils\";\n\nconst TEXT_FIELD_INTERACTION_VARIANTS = [\n \"disabled\" as const,\n \"readonly\" as const,\n];\n\nexport interface BaseTextFieldProps extends TextFieldProps {\n label?: ReactNode;\n description?: ReactNode;\n enableAutoComplete?: boolean;\n multiline?: boolean;\n inputProps?: InputProps;\n children: ReactNode;\n // Optional callback to update the interaction variant state\n // as it's only provided if the component is the root of a Studio component\n updateInteractionVariant?: UpdateInteractionVariant<\n typeof TEXT_FIELD_INTERACTION_VARIANTS\n >;\n}\n\nconst { interactionVariants, withObservedValues } = pickAriaComponentVariants(\n TEXT_FIELD_INTERACTION_VARIANTS\n);\n\nexport function BaseTextField(props: BaseTextFieldProps) {\n const {\n enableAutoComplete,\n autoComplete,\n children,\n updateInteractionVariant,\n ...rest\n } = props;\n\n return (\n <PlasmicTextFieldContext.Provider value={props}>\n <TextField\n autoComplete={enableAutoComplete ? autoComplete : undefined}\n {...rest}\n >\n {({ isDisabled, isReadOnly }) =>\n withObservedValues(\n children,\n {\n disabled: isDisabled,\n readonly: isReadOnly,\n },\n updateInteractionVariant\n )\n }\n </TextField>\n </PlasmicTextFieldContext.Provider>\n );\n}\n\nexport const TEXT_FIELD_COMPONENT_NAME = makeComponentName(\"textField\");\n\nexport function registerTextField(\n loader?: Registerable,\n overrides?: CodeComponentMetaOverrides<typeof BaseTextField>\n) {\n registerComponentHelper(\n loader,\n BaseTextField,\n {\n name: TEXT_FIELD_COMPONENT_NAME,\n displayName: \"Aria TextField\",\n importPath: \"@plasmicpkgs/react-aria/skinny/registerTextField\",\n importName: \"BaseTextField\",\n interactionVariants,\n // TODO: Support for validate prop\n props: {\n ...getCommonInputProps<BaseTextFieldProps>(\"input\", [\n \"name\",\n \"isDisabled\",\n \"isReadOnly\",\n \"autoFocus\",\n \"aria-label\",\n \"isRequired\",\n ]),\n children: {\n type: \"slot\",\n mergeWithParent: true as any,\n defaultValue: {\n type: \"vbox\",\n styles: {\n justifyContent: \"flex-start\",\n alignItems: \"flex-start\",\n width: \"300px\",\n gap: \"5px\",\n },\n children: [\n {\n type: \"component\",\n name: LABEL_COMPONENT_NAME,\n props: {\n children: {\n type: \"text\",\n value: \"Label\",\n },\n },\n },\n {\n type: \"component\",\n name: INPUT_COMPONENT_NAME,\n styles: {\n width: \"100%\",\n },\n },\n {\n type: \"component\",\n name: DESCRIPTION_COMPONENT_NAME,\n props: {\n children: {\n type: \"text\",\n value: \"Type something...\",\n },\n },\n },\n ],\n },\n },\n value: {\n type: \"string\",\n editOnly: true,\n uncontrolledProp: \"defaultValue\",\n description: \"The current value\",\n },\n isInvalid: {\n // TODO: Not sure if needed\n displayName: \"Invalid\",\n type: \"boolean\",\n description: \"Whether the input value is invalid\",\n defaultValueHint: false,\n },\n customValidationErrors: {\n // TODO: Not sure if needed\n type: \"array\",\n description: \"Errors for custom validation\",\n },\n // validate: {\n // type: \"function\" as const,\n // argNames: [\"value\"],\n // argValues: (_ps: any, ctx: any) => [ctx.data[0]],\n // },\n enableAutoComplete: {\n type: \"boolean\",\n description:\n \"Whether the browser is allowed to automatically complete the input\",\n defaultValueHint: false,\n },\n autoComplete: {\n type: \"choice\",\n hidden: ({ enableAutoComplete }: BaseTextFieldProps) =>\n !enableAutoComplete,\n description: \"Guidance as to the type of data expected in the field\",\n helpText:\n \"For explanations on what each of the values mean, check https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autocomplete#values\",\n options: [\n \"name\",\n \"honorific-prefix\",\n \"given-name\",\n \"additional-name\",\n \"family-name\",\n \"honorific-suffix\",\n \"nickname\",\n \"email\",\n \"username\",\n \"new-password\",\n \"current-password\",\n \"one-time-code\",\n \"organization-title\",\n \"organization\",\n \"street-address\",\n \"shipping\",\n \"billing\",\n \"address-line1\",\n \"address-line2\",\n \"address-line3\",\n \"address-level4\",\n \"address-level3\",\n \"address-level2\",\n \"address-level1\",\n \"country\",\n \"country-name\",\n \"postal-code\",\n \"cc-name\",\n \"cc-given-name\",\n \"cc-additional-name\",\n \"cc-family-name\",\n \"cc-number\",\n \"cc-exp\",\n \"cc-exp-month\",\n \"cc-exp-year\",\n \"cc-csc\",\n \"cc-type\",\n \"transaction-currency\",\n \"transaction-amount\",\n \"language\",\n \"bday\",\n \"bday-day\",\n \"bday-month\",\n \"bday-year\",\n \"sex\",\n \"tel\",\n \"tel-country-code\",\n \"tel-national\",\n \"tel-area-code\",\n \"tel-local\",\n \"tel-local-suffix\",\n \"tel-local-prefix\",\n \"tel-extension\",\n \"impp\",\n \"url\",\n \"photo\",\n \"webauthn\",\n ],\n },\n maxLength: {\n type: \"number\",\n description:\n \"The maximum number of characters supported by the input\",\n },\n minLength: {\n type: \"number\",\n description:\n \"The minimum number of characters supported by the input\",\n },\n pattern: {\n type: \"string\",\n description:\n \"Regex pattern that the value of the input must match to be valid\",\n helpText:\n \"For more information about writing Regular Expressions (regex), check out https://regexr.com/\",\n validator: (value) => {\n try {\n new RegExp(value);\n return true;\n } catch (error) {\n return \"Invalid Regex\";\n }\n },\n },\n type: {\n type: \"choice\",\n defaultValueHint: \"text\",\n options: [\"text\", \"search\", \"url\", \"tel\", \"email\", \"password\"],\n },\n inputMode: {\n type: \"choice\",\n description:\n \"hint to browsers as to the type of virtual keyboard configuration to use when editing this element or its contents.\",\n options: [\n \"none\",\n \"text\",\n \"tel\",\n \"url\",\n \"email\",\n \"numeric\",\n \"decimal\",\n \"search\",\n ],\n },\n validationBehavior: {\n type: \"choice\",\n options: [\"native\", \"aria\"],\n description:\n \"Whether to use native HTML form validation to prevent form submission when the value is missing or invalid, or mark the field as required or invalid via ARIA.\",\n defaultValueHint: \"native\",\n },\n onChange: {\n type: \"eventHandler\",\n argTypes: [{ name: \"value\", type: \"string\" }],\n },\n onFocus: {\n type: \"eventHandler\",\n argTypes: [{ name: \"focusEvent\", type: \"object\" }],\n },\n onBlur: {\n type: \"eventHandler\",\n argTypes: [{ name: \"focusEvent\", type: \"object\" }],\n },\n onFocusChange: {\n type: \"eventHandler\",\n argTypes: [{ name: \"isFocused\", type: \"boolean\" }],\n },\n onKeyDown: {\n type: \"eventHandler\",\n argTypes: [{ name: \"keyboardEvent\", type: \"object\" }],\n },\n onKeyUp: {\n type: \"eventHandler\",\n argTypes: [{ name: \"keyboardEvent\", type: \"object\" }],\n },\n onCopy: {\n type: \"eventHandler\",\n argTypes: [{ name: \"clipbordEvent\", type: \"object\" }],\n },\n onCut: {\n type: \"eventHandler\",\n argTypes: [{ name: \"clipbordEvent\", type: \"object\" }],\n },\n onPaste: {\n type: \"eventHandler\",\n argTypes: [{ name: \"clipbordEvent\", type: \"object\" }],\n },\n onCompositionStart: {\n type: \"eventHandler\",\n argTypes: [{ name: \"compositionEvent\", type: \"object\" }],\n },\n onCompositionEnd: {\n type: \"eventHandler\",\n argTypes: [{ name: \"compositionEvent\", type: \"object\" }],\n },\n onCompositionUpdate: {\n type: \"eventHandler\",\n argTypes: [{ name: \"compositionEvent\", type: \"object\" }],\n },\n onSelect: {\n type: \"eventHandler\",\n argTypes: [{ name: \"selectionEvent\", type: \"object\" }],\n },\n onBeforeInput: {\n type: \"eventHandler\",\n argTypes: [{ name: \"inputEvent\", type: \"object\" }],\n },\n onInput: {\n type: \"eventHandler\",\n argTypes: [{ name: \"inputEvent\", type: \"object\" }],\n },\n },\n // NOTE: React-Aria does not support render props for <Input> and <Textarea>, so focusVisible and inputHovered states are not implemented\n states: {\n value: {\n type: \"writable\",\n valueProp: \"value\",\n onChangeProp: \"onChange\",\n variableType: \"text\",\n },\n },\n trapsFocus: true,\n },\n overrides\n );\n\n const thisName = makeChildComponentName(\n overrides?.parentComponentName,\n TEXT_FIELD_COMPONENT_NAME\n );\n\n registerFieldError(loader, { parentComponentName: thisName });\n registerInput(loader, { parentComponentName: thisName });\n registerLabel(loader, { parentComponentName: thisName });\n registerTextArea(loader, { parentComponentName: thisName });\n}\n"],"names":["pickAriaComponentVariants","React","PlasmicTextFieldContext","TextField","makeComponentName","registerComponentHelper","getCommonInputProps","LABEL_COMPONENT_NAME","INPUT_COMPONENT_NAME","DESCRIPTION_COMPONENT_NAME","makeChildComponentName","registerFieldError","registerInput","registerLabel","registerTextArea"],"mappings":"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"}
1
+ {"version":3,"file":"registerTextField.cjs.js","sources":["../src/registerTextField.tsx"],"sourcesContent":["import React, { ReactNode } from \"react\";\nimport type { InputProps, TextFieldProps } from \"react-aria-components\";\nimport { TextField } from \"react-aria-components\";\nimport { getCommonProps, resolveAutoComplete } from \"./common\";\nimport { PlasmicTextFieldContext } from \"./contexts\";\nimport {\n UpdateInteractionVariant,\n pickAriaComponentVariants,\n} from \"./interaction-variant-utils\";\nimport { DESCRIPTION_COMPONENT_NAME } from \"./registerDescription\";\nimport { registerFieldError } from \"./registerFieldError\";\nimport { INPUT_COMPONENT_NAME, registerInput } from \"./registerInput\";\nimport { LABEL_COMPONENT_NAME, registerLabel } from \"./registerLabel\";\nimport { registerTextArea } from \"./registerTextArea\";\nimport {\n CodeComponentMetaOverrides,\n Registerable,\n makeChildComponentName,\n makeComponentName,\n registerComponentHelper,\n} from \"./utils\";\n\nconst TEXT_FIELD_INTERACTION_VARIANTS = [\n \"disabled\" as const,\n \"readonly\" as const,\n];\n\nexport interface BaseTextFieldProps\n extends Omit<TextFieldProps, \"autoComplete\"> {\n label?: ReactNode;\n description?: ReactNode;\n multiline?: boolean;\n inputProps?: InputProps;\n autoComplete?: string[];\n children: ReactNode;\n // Optional callback to update the interaction variant state\n // as it's only provided if the component is the root of a Studio component\n updateInteractionVariant?: UpdateInteractionVariant<\n typeof TEXT_FIELD_INTERACTION_VARIANTS\n >;\n}\n\nconst { interactionVariants, withObservedValues } = pickAriaComponentVariants(\n TEXT_FIELD_INTERACTION_VARIANTS\n);\n\nexport function BaseTextField(props: BaseTextFieldProps) {\n const { children, updateInteractionVariant, autoComplete, ...rest } = props;\n\n return (\n <PlasmicTextFieldContext.Provider value={props}>\n <TextField autoComplete={resolveAutoComplete(autoComplete)} {...rest}>\n {({ isDisabled, isReadOnly }) =>\n withObservedValues(\n children,\n {\n disabled: isDisabled,\n readonly: isReadOnly,\n },\n updateInteractionVariant\n )\n }\n </TextField>\n </PlasmicTextFieldContext.Provider>\n );\n}\n\nexport const TEXT_FIELD_COMPONENT_NAME = makeComponentName(\"textField\");\n\nexport function registerTextField(\n loader?: Registerable,\n overrides?: CodeComponentMetaOverrides<typeof BaseTextField>\n) {\n registerComponentHelper(\n loader,\n BaseTextField,\n {\n name: TEXT_FIELD_COMPONENT_NAME,\n displayName: \"Aria TextField\",\n importPath: \"@plasmicpkgs/react-aria/skinny/registerTextField\",\n importName: \"BaseTextField\",\n interactionVariants,\n // TODO: Support for validate prop\n props: {\n ...getCommonProps<BaseTextFieldProps>(\"Text Field\", [\n \"name\",\n \"isDisabled\",\n \"isReadOnly\",\n \"autoFocus\",\n \"aria-label\",\n \"isRequired\",\n \"value\",\n \"maxLength\",\n \"minLength\",\n \"pattern\",\n \"type\",\n \"inputMode\",\n \"validationBehavior\",\n \"autoComplete\",\n \"onChange\",\n \"onFocus\",\n \"onBlur\",\n \"onFocusChange\",\n \"onKeyDown\",\n \"onKeyUp\",\n \"onCopy\",\n \"onCut\",\n \"onPaste\",\n \"onCompositionStart\",\n \"onCompositionEnd\",\n \"onCompositionUpdate\",\n \"onSelect\",\n \"onBeforeInput\",\n \"onInput\",\n ]),\n children: {\n type: \"slot\",\n mergeWithParent: true as any,\n defaultValue: {\n type: \"vbox\",\n styles: {\n justifyContent: \"flex-start\",\n alignItems: \"flex-start\",\n width: \"300px\",\n gap: \"5px\",\n },\n children: [\n {\n type: \"component\",\n name: LABEL_COMPONENT_NAME,\n props: {\n children: {\n type: \"text\",\n value: \"Label\",\n },\n },\n },\n {\n type: \"component\",\n name: INPUT_COMPONENT_NAME,\n styles: {\n width: \"100%\",\n },\n },\n {\n type: \"component\",\n name: DESCRIPTION_COMPONENT_NAME,\n props: {\n children: {\n type: \"text\",\n value: \"Type something...\",\n },\n },\n },\n ],\n },\n },\n\n isInvalid: {\n // TODO: Not sure if needed\n displayName: \"Invalid\",\n type: \"boolean\",\n description: \"Whether the input value is invalid\",\n defaultValueHint: false,\n },\n customValidationErrors: {\n // TODO: Not sure if needed\n type: \"array\",\n description: \"Errors for custom validation\",\n },\n },\n states: {\n value: {\n type: \"writable\",\n valueProp: \"value\",\n onChangeProp: \"onChange\",\n variableType: \"text\",\n },\n },\n trapsFocus: true,\n },\n overrides\n );\n\n const thisName = makeChildComponentName(\n overrides?.parentComponentName,\n TEXT_FIELD_COMPONENT_NAME\n );\n\n registerFieldError(loader, { parentComponentName: thisName });\n registerInput(loader, { parentComponentName: thisName });\n registerLabel(loader, { parentComponentName: thisName });\n registerTextArea(loader, { parentComponentName: thisName });\n}\n"],"names":["pickAriaComponentVariants","PlasmicTextFieldContext","React","TextField","resolveAutoComplete","makeComponentName","registerComponentHelper","getCommonProps","LABEL_COMPONENT_NAME","INPUT_COMPONENT_NAME","DESCRIPTION_COMPONENT_NAME","makeChildComponentName","registerFieldError","registerInput","registerLabel","registerTextArea"],"mappings":"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"}
@@ -2,13 +2,13 @@ import React, { ReactNode } from "react";
2
2
  import type { InputProps, TextFieldProps } from "react-aria-components";
3
3
  import { UpdateInteractionVariant } from "./interaction-variant-utils";
4
4
  import { CodeComponentMetaOverrides, Registerable } from "./utils";
5
- declare const TEXT_FIELD_INTERACTION_VARIANTS: ("readonly" | "disabled")[];
6
- export interface BaseTextFieldProps extends TextFieldProps {
5
+ declare const TEXT_FIELD_INTERACTION_VARIANTS: ("disabled" | "readonly")[];
6
+ export interface BaseTextFieldProps extends Omit<TextFieldProps, "autoComplete"> {
7
7
  label?: ReactNode;
8
8
  description?: ReactNode;
9
- enableAutoComplete?: boolean;
10
9
  multiline?: boolean;
11
10
  inputProps?: InputProps;
11
+ autoComplete?: string[];
12
12
  children: ReactNode;
13
13
  updateInteractionVariant?: UpdateInteractionVariant<typeof TEXT_FIELD_INTERACTION_VARIANTS>;
14
14
  }
@@ -1,7 +1,7 @@
1
1
  import React from 'react';
2
2
  import { TextField } from 'react-aria-components';
3
- import { g as getCommonInputProps } from './common-52c26d37.esm.js';
4
- import { j as PlasmicTextFieldContext } from './contexts-21e0d928.esm.js';
3
+ import { r as resolveAutoComplete, g as getCommonProps } from './common-96be13c3.esm.js';
4
+ import { i as PlasmicTextFieldContext } from './contexts-87c261f6.esm.js';
5
5
  import { p as pickAriaComponentVariants } from './interaction-variant-utils-abd0c319.esm.js';
6
6
  import { DESCRIPTION_COMPONENT_NAME } from './registerDescription.esm.js';
7
7
  import { registerFieldError } from './registerFieldError.esm.js';
@@ -52,31 +52,15 @@ const { interactionVariants, withObservedValues } = pickAriaComponentVariants(
52
52
  TEXT_FIELD_INTERACTION_VARIANTS
53
53
  );
54
54
  function BaseTextField(props) {
55
- const _a = props, {
56
- enableAutoComplete,
57
- autoComplete,
55
+ const _a = props, { children, updateInteractionVariant, autoComplete } = _a, rest = __objRest(_a, ["children", "updateInteractionVariant", "autoComplete"]);
56
+ return /* @__PURE__ */ React.createElement(PlasmicTextFieldContext.Provider, { value: props }, /* @__PURE__ */ React.createElement(TextField, __spreadValues({ autoComplete: resolveAutoComplete(autoComplete) }, rest), ({ isDisabled, isReadOnly }) => withObservedValues(
58
57
  children,
58
+ {
59
+ disabled: isDisabled,
60
+ readonly: isReadOnly
61
+ },
59
62
  updateInteractionVariant
60
- } = _a, rest = __objRest(_a, [
61
- "enableAutoComplete",
62
- "autoComplete",
63
- "children",
64
- "updateInteractionVariant"
65
- ]);
66
- return /* @__PURE__ */ React.createElement(PlasmicTextFieldContext.Provider, { value: props }, /* @__PURE__ */ React.createElement(
67
- TextField,
68
- __spreadValues({
69
- autoComplete: enableAutoComplete ? autoComplete : void 0
70
- }, rest),
71
- ({ isDisabled, isReadOnly }) => withObservedValues(
72
- children,
73
- {
74
- disabled: isDisabled,
75
- readonly: isReadOnly
76
- },
77
- updateInteractionVariant
78
- )
79
- ));
63
+ )));
80
64
  }
81
65
  const TEXT_FIELD_COMPONENT_NAME = makeComponentName("textField");
82
66
  function registerTextField(loader, overrides) {
@@ -90,13 +74,36 @@ function registerTextField(loader, overrides) {
90
74
  importName: "BaseTextField",
91
75
  interactionVariants,
92
76
  // TODO: Support for validate prop
93
- props: __spreadProps(__spreadValues({}, getCommonInputProps("input", [
77
+ props: __spreadProps(__spreadValues({}, getCommonProps("Text Field", [
94
78
  "name",
95
79
  "isDisabled",
96
80
  "isReadOnly",
97
81
  "autoFocus",
98
82
  "aria-label",
99
- "isRequired"
83
+ "isRequired",
84
+ "value",
85
+ "maxLength",
86
+ "minLength",
87
+ "pattern",
88
+ "type",
89
+ "inputMode",
90
+ "validationBehavior",
91
+ "autoComplete",
92
+ "onChange",
93
+ "onFocus",
94
+ "onBlur",
95
+ "onFocusChange",
96
+ "onKeyDown",
97
+ "onKeyUp",
98
+ "onCopy",
99
+ "onCut",
100
+ "onPaste",
101
+ "onCompositionStart",
102
+ "onCompositionEnd",
103
+ "onCompositionUpdate",
104
+ "onSelect",
105
+ "onBeforeInput",
106
+ "onInput"
100
107
  ])), {
101
108
  children: {
102
109
  type: "slot",
@@ -140,12 +147,6 @@ function registerTextField(loader, overrides) {
140
147
  ]
141
148
  }
142
149
  },
143
- value: {
144
- type: "string",
145
- editOnly: true,
146
- uncontrolledProp: "defaultValue",
147
- description: "The current value"
148
- },
149
150
  isInvalid: {
150
151
  // TODO: Not sure if needed
151
152
  displayName: "Invalid",
@@ -157,190 +158,8 @@ function registerTextField(loader, overrides) {
157
158
  // TODO: Not sure if needed
158
159
  type: "array",
159
160
  description: "Errors for custom validation"
160
- },
161
- // validate: {
162
- // type: "function" as const,
163
- // argNames: ["value"],
164
- // argValues: (_ps: any, ctx: any) => [ctx.data[0]],
165
- // },
166
- enableAutoComplete: {
167
- type: "boolean",
168
- description: "Whether the browser is allowed to automatically complete the input",
169
- defaultValueHint: false
170
- },
171
- autoComplete: {
172
- type: "choice",
173
- hidden: ({ enableAutoComplete }) => !enableAutoComplete,
174
- description: "Guidance as to the type of data expected in the field",
175
- helpText: "For explanations on what each of the values mean, check https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autocomplete#values",
176
- options: [
177
- "name",
178
- "honorific-prefix",
179
- "given-name",
180
- "additional-name",
181
- "family-name",
182
- "honorific-suffix",
183
- "nickname",
184
- "email",
185
- "username",
186
- "new-password",
187
- "current-password",
188
- "one-time-code",
189
- "organization-title",
190
- "organization",
191
- "street-address",
192
- "shipping",
193
- "billing",
194
- "address-line1",
195
- "address-line2",
196
- "address-line3",
197
- "address-level4",
198
- "address-level3",
199
- "address-level2",
200
- "address-level1",
201
- "country",
202
- "country-name",
203
- "postal-code",
204
- "cc-name",
205
- "cc-given-name",
206
- "cc-additional-name",
207
- "cc-family-name",
208
- "cc-number",
209
- "cc-exp",
210
- "cc-exp-month",
211
- "cc-exp-year",
212
- "cc-csc",
213
- "cc-type",
214
- "transaction-currency",
215
- "transaction-amount",
216
- "language",
217
- "bday",
218
- "bday-day",
219
- "bday-month",
220
- "bday-year",
221
- "sex",
222
- "tel",
223
- "tel-country-code",
224
- "tel-national",
225
- "tel-area-code",
226
- "tel-local",
227
- "tel-local-suffix",
228
- "tel-local-prefix",
229
- "tel-extension",
230
- "impp",
231
- "url",
232
- "photo",
233
- "webauthn"
234
- ]
235
- },
236
- maxLength: {
237
- type: "number",
238
- description: "The maximum number of characters supported by the input"
239
- },
240
- minLength: {
241
- type: "number",
242
- description: "The minimum number of characters supported by the input"
243
- },
244
- pattern: {
245
- type: "string",
246
- description: "Regex pattern that the value of the input must match to be valid",
247
- helpText: "For more information about writing Regular Expressions (regex), check out https://regexr.com/",
248
- validator: (value) => {
249
- try {
250
- new RegExp(value);
251
- return true;
252
- } catch (error) {
253
- return "Invalid Regex";
254
- }
255
- }
256
- },
257
- type: {
258
- type: "choice",
259
- defaultValueHint: "text",
260
- options: ["text", "search", "url", "tel", "email", "password"]
261
- },
262
- inputMode: {
263
- type: "choice",
264
- description: "hint to browsers as to the type of virtual keyboard configuration to use when editing this element or its contents.",
265
- options: [
266
- "none",
267
- "text",
268
- "tel",
269
- "url",
270
- "email",
271
- "numeric",
272
- "decimal",
273
- "search"
274
- ]
275
- },
276
- validationBehavior: {
277
- type: "choice",
278
- options: ["native", "aria"],
279
- description: "Whether to use native HTML form validation to prevent form submission when the value is missing or invalid, or mark the field as required or invalid via ARIA.",
280
- defaultValueHint: "native"
281
- },
282
- onChange: {
283
- type: "eventHandler",
284
- argTypes: [{ name: "value", type: "string" }]
285
- },
286
- onFocus: {
287
- type: "eventHandler",
288
- argTypes: [{ name: "focusEvent", type: "object" }]
289
- },
290
- onBlur: {
291
- type: "eventHandler",
292
- argTypes: [{ name: "focusEvent", type: "object" }]
293
- },
294
- onFocusChange: {
295
- type: "eventHandler",
296
- argTypes: [{ name: "isFocused", type: "boolean" }]
297
- },
298
- onKeyDown: {
299
- type: "eventHandler",
300
- argTypes: [{ name: "keyboardEvent", type: "object" }]
301
- },
302
- onKeyUp: {
303
- type: "eventHandler",
304
- argTypes: [{ name: "keyboardEvent", type: "object" }]
305
- },
306
- onCopy: {
307
- type: "eventHandler",
308
- argTypes: [{ name: "clipbordEvent", type: "object" }]
309
- },
310
- onCut: {
311
- type: "eventHandler",
312
- argTypes: [{ name: "clipbordEvent", type: "object" }]
313
- },
314
- onPaste: {
315
- type: "eventHandler",
316
- argTypes: [{ name: "clipbordEvent", type: "object" }]
317
- },
318
- onCompositionStart: {
319
- type: "eventHandler",
320
- argTypes: [{ name: "compositionEvent", type: "object" }]
321
- },
322
- onCompositionEnd: {
323
- type: "eventHandler",
324
- argTypes: [{ name: "compositionEvent", type: "object" }]
325
- },
326
- onCompositionUpdate: {
327
- type: "eventHandler",
328
- argTypes: [{ name: "compositionEvent", type: "object" }]
329
- },
330
- onSelect: {
331
- type: "eventHandler",
332
- argTypes: [{ name: "selectionEvent", type: "object" }]
333
- },
334
- onBeforeInput: {
335
- type: "eventHandler",
336
- argTypes: [{ name: "inputEvent", type: "object" }]
337
- },
338
- onInput: {
339
- type: "eventHandler",
340
- argTypes: [{ name: "inputEvent", type: "object" }]
341
161
  }
342
162
  }),
343
- // NOTE: React-Aria does not support render props for <Input> and <Textarea>, so focusVisible and inputHovered states are not implemented
344
163
  states: {
345
164
  value: {
346
165
  type: "writable",