@webstudio-is/sdk-components-react-remix 0.87.1 → 0.89.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.
@@ -2,9 +2,25 @@ import type { PropMeta } from "@webstudio-is/generate-arg-types";
2
2
 
3
3
  export const props: Record<string, PropMeta> = {
4
4
  about: { required: false, control: "text", type: "string" },
5
- acceptCharset: { required: false, control: "text", type: "string" },
6
- accessKey: { required: false, control: "text", type: "string" },
7
- action: { required: false, control: "text", type: "string" },
5
+ acceptCharset: {
6
+ required: false,
7
+ control: "text",
8
+ type: "string",
9
+ description: "List of supported charsets.",
10
+ },
11
+ accessKey: {
12
+ required: false,
13
+ control: "text",
14
+ type: "string",
15
+ description: "Keyboard shortcut to activate or add focus to the element.",
16
+ },
17
+ action: {
18
+ required: false,
19
+ control: "text",
20
+ type: "string",
21
+ description:
22
+ "The URI of a program that processes the information submitted via the form.",
23
+ },
8
24
  "aria-activedescendant": {
9
25
  description:
10
26
  "Identifies the currently active element when DOM focus is on a composite widget, textbox, group, or application.",
@@ -185,7 +201,7 @@ export const props: Record<string, PropMeta> = {
185
201
  },
186
202
  "aria-label": {
187
203
  description:
188
- "Defines a string value that labels the current element.\n@see aria-labelledby.",
204
+ "Provides the accessible name that describes an interactive element if no other accessible name exists, for example in a button that contains an image with no text.",
189
205
  required: false,
190
206
  control: "text",
191
207
  type: "string",
@@ -384,19 +400,66 @@ export const props: Record<string, PropMeta> = {
384
400
  control: "text",
385
401
  type: "string",
386
402
  },
387
- autoCapitalize: { required: false, control: "text", type: "string" },
388
- autoComplete: { required: false, control: "text", type: "string" },
403
+ autoCapitalize: {
404
+ required: false,
405
+ control: "text",
406
+ type: "string",
407
+ description:
408
+ "Sets whether input is automatically capitalized when entered by user.",
409
+ },
410
+ autoComplete: {
411
+ required: false,
412
+ control: "text",
413
+ type: "string",
414
+ description:
415
+ "Indicates whether controls in this form can by default have their valuesautomatically completed by the browser.",
416
+ },
389
417
  autoCorrect: { required: false, control: "text", type: "string" },
390
- autoFocus: { required: false, control: "boolean", type: "boolean" },
418
+ autoFocus: {
419
+ required: false,
420
+ control: "boolean",
421
+ type: "boolean",
422
+ description:
423
+ "Indicates that an element should be focused on page load, or when its parent dialog is displayed.",
424
+ },
391
425
  autoSave: { required: false, control: "text", type: "string" },
392
426
  className: { required: false, control: "text", type: "string" },
393
- color: { required: false, control: "color", type: "string" },
394
- content: { required: false, control: "text", type: "string" },
395
- contextMenu: { required: false, control: "text", type: "string" },
427
+ color: {
428
+ required: false,
429
+ control: "color",
430
+ type: "string",
431
+ description:
432
+ "This attribute sets the text color using either a named color or a color specified in the hexadecimal #RRGGBB format. Note: This is a legacy attribute. Please use the CSS color property instead.",
433
+ },
434
+ content: {
435
+ required: false,
436
+ control: "text",
437
+ type: "string",
438
+ description:
439
+ "A value associated with http-equiv orname depending on the context.",
440
+ },
441
+ contextMenu: {
442
+ required: false,
443
+ control: "text",
444
+ type: "string",
445
+ description:
446
+ "Defines the ID of a menu element which willserve as the element's context menu.",
447
+ },
396
448
  datatype: { required: false, control: "text", type: "string" },
397
449
  defaultChecked: { required: false, control: "boolean", type: "boolean" },
398
- dir: { required: false, control: "text", type: "string" },
399
- draggable: { required: false, control: "boolean", type: "boolean" },
450
+ dir: {
451
+ required: false,
452
+ control: "text",
453
+ type: "string",
454
+ description:
455
+ "Defines the text direction. Allowed values are ltr (Left-To-Right) or rtl (Right-To-Left)",
456
+ },
457
+ draggable: {
458
+ required: false,
459
+ control: "boolean",
460
+ type: "boolean",
461
+ description: "Defines whether the element can be dragged.",
462
+ },
400
463
  encType: {
401
464
  required: false,
402
465
  control: "radio",
@@ -406,9 +469,23 @@ export const props: Record<string, PropMeta> = {
406
469
  "multipart/form-data",
407
470
  "text/plain",
408
471
  ],
472
+ description:
473
+ "Defines the content type of the form data when themethod is POST.",
474
+ },
475
+ hidden: {
476
+ required: false,
477
+ control: "boolean",
478
+ type: "boolean",
479
+ description:
480
+ "Prevents rendering of given element, while keeping child elements, e.g. script elements, active.",
481
+ },
482
+ id: {
483
+ required: false,
484
+ control: "text",
485
+ type: "string",
486
+ description:
487
+ "Often used with CSS to style a specific element. The value of this attribute must be unique.",
409
488
  },
410
- hidden: { required: false, control: "boolean", type: "boolean" },
411
- id: { required: false, control: "text", type: "string" },
412
489
  inputMode: {
413
490
  description:
414
491
  "Hints at the type of data that might be entered by the user while editing the element or its contents\n@see https://html.spec.whatwg.org/multipage/interaction.html#input-modalities:-the-inputmode-attribute",
@@ -438,24 +515,77 @@ export const props: Record<string, PropMeta> = {
438
515
  itemRef: { required: false, control: "text", type: "string" },
439
516
  itemScope: { required: false, control: "boolean", type: "boolean" },
440
517
  itemType: { required: false, control: "text", type: "string" },
441
- lang: { required: false, control: "text", type: "string" },
442
- method: { required: false, control: "text", type: "string" },
443
- name: { required: false, control: "text", type: "string" },
518
+ lang: {
519
+ required: false,
520
+ control: "text",
521
+ type: "string",
522
+ description: "Defines the language used in the element.",
523
+ },
524
+ method: {
525
+ required: false,
526
+ control: "text",
527
+ type: "string",
528
+ description:
529
+ "Defines which HTTP method to use when submitting the form. Can be GET (default) or POST.",
530
+ },
531
+ name: {
532
+ required: false,
533
+ control: "text",
534
+ type: "string",
535
+ description:
536
+ "This name is important when submitting form data to the server, as it identifies the data associated with the input. When multiple inputs share the same name attribute, they are treated as part of the same group (e.g., radio buttons or checkboxes).",
537
+ },
444
538
  nonce: { required: false, control: "text", type: "string" },
445
- noValidate: { required: false, control: "boolean", type: "boolean" },
446
- placeholder: { required: false, control: "text", type: "string" },
539
+ noValidate: {
540
+ required: false,
541
+ control: "boolean",
542
+ type: "boolean",
543
+ description:
544
+ "This attribute indicates that the form shouldn't be validated when submitted.",
545
+ },
546
+ placeholder: {
547
+ required: false,
548
+ control: "text",
549
+ type: "string",
550
+ description:
551
+ "Provides a hint to the user of what can be entered in the field.",
552
+ },
447
553
  prefix: { required: false, control: "text", type: "string" },
448
554
  property: { required: false, control: "text", type: "string" },
449
555
  radioGroup: { required: false, control: "text", type: "string" },
450
- rel: { required: false, control: "text", type: "string" },
556
+ rel: {
557
+ required: false,
558
+ control: "text",
559
+ type: "string",
560
+ description:
561
+ "Specifies the relationship of the target object to the link object.",
562
+ },
451
563
  resource: { required: false, control: "text", type: "string" },
452
564
  results: { required: false, control: "number", type: "number" },
453
565
  rev: { required: false, control: "text", type: "string" },
454
- role: { required: false, control: "text", type: "string" },
566
+ role: {
567
+ required: false,
568
+ control: "text",
569
+ type: "string",
570
+ description:
571
+ "Defines an explicit role for an element for use by assistive technologies.",
572
+ },
455
573
  security: { required: false, control: "text", type: "string" },
456
- slot: { required: false, control: "text", type: "string" },
457
- spellCheck: { required: false, control: "boolean", type: "boolean" },
574
+ slot: {
575
+ required: false,
576
+ control: "text",
577
+ type: "string",
578
+ description: "Assigns a slot in a shadow DOM shadow tree to an element.",
579
+ },
580
+ spellCheck: {
581
+ required: false,
582
+ control: "boolean",
583
+ type: "boolean",
584
+ description: "Indicates whether spell checking is allowed for the element.",
585
+ },
458
586
  state: {
587
+ description:
588
+ "Use this property to reveal the Success and Error states on the canvas so they can be styled. The Initial state is displayed when the page first opens. The Success and Error states are displayed depending on whether the Form submits successfully or unsuccessfully.",
459
589
  required: false,
460
590
  control: "radio",
461
591
  type: "string",
@@ -472,14 +602,34 @@ export const props: Record<string, PropMeta> = {
472
602
  control: "boolean",
473
603
  type: "boolean",
474
604
  },
475
- tabIndex: { required: false, control: "number", type: "number" },
476
- target: { required: false, control: "text", type: "string" },
477
- title: { required: false, control: "text", type: "string" },
605
+ tabIndex: {
606
+ required: false,
607
+ control: "number",
608
+ type: "number",
609
+ description:
610
+ "Overrides the browser's default tab order and follows the one specified instead.",
611
+ },
612
+ target: {
613
+ required: false,
614
+ control: "text",
615
+ type: "string",
616
+ description:
617
+ "Specifies where to open the linked document (in the case of an <a> element) or where to display the response received (in the case of a <form> element)",
618
+ },
619
+ title: {
620
+ required: false,
621
+ control: "text",
622
+ type: "string",
623
+ description:
624
+ "Text to be displayed in a tooltip when hovering over the element.",
625
+ },
478
626
  translate: {
479
627
  required: false,
480
628
  control: "radio",
481
629
  type: "string",
482
630
  options: ["yes", "no"],
631
+ description:
632
+ "Specify whether an element's attribute values and the values of its text node children are to be translated when the page is localized, or whether to leave them unchanged.",
483
633
  },
484
634
  typeof: { required: false, control: "text", type: "string" },
485
635
  unselectable: {
@@ -2,7 +2,12 @@ import type { PropMeta } from "@webstudio-is/generate-arg-types";
2
2
 
3
3
  export const props: Record<string, PropMeta> = {
4
4
  about: { required: false, control: "text", type: "string" },
5
- accessKey: { required: false, control: "text", type: "string" },
5
+ accessKey: {
6
+ required: false,
7
+ control: "text",
8
+ type: "string",
9
+ description: "Keyboard shortcut to activate or add focus to the element.",
10
+ },
6
11
  "aria-activedescendant": {
7
12
  description:
8
13
  "Identifies the currently active element when DOM focus is on a composite widget, textbox, group, or application.",
@@ -183,7 +188,7 @@ export const props: Record<string, PropMeta> = {
183
188
  },
184
189
  "aria-label": {
185
190
  description:
186
- "Defines a string value that labels the current element.\n@see aria-labelledby.",
191
+ "Provides the accessible name that describes an interactive element if no other accessible name exists, for example in a button that contains an image with no text.",
187
192
  required: false,
188
193
  control: "text",
189
194
  type: "string",
@@ -382,22 +387,85 @@ export const props: Record<string, PropMeta> = {
382
387
  control: "text",
383
388
  type: "string",
384
389
  },
385
- autoCapitalize: { required: false, control: "text", type: "string" },
390
+ autoCapitalize: {
391
+ required: false,
392
+ control: "text",
393
+ type: "string",
394
+ description:
395
+ "Sets whether input is automatically capitalized when entered by user.",
396
+ },
386
397
  autoCorrect: { required: false, control: "text", type: "string" },
387
- autoFocus: { required: false, control: "boolean", type: "boolean" },
398
+ autoFocus: {
399
+ required: false,
400
+ control: "boolean",
401
+ type: "boolean",
402
+ description:
403
+ "Indicates that an element should be focused on page load, or when its parent dialog is displayed.",
404
+ },
388
405
  autoSave: { required: false, control: "text", type: "string" },
389
406
  className: { required: false, control: "text", type: "string" },
390
- color: { required: false, control: "color", type: "string" },
391
- content: { required: false, control: "text", type: "string" },
392
- contextMenu: { required: false, control: "text", type: "string" },
407
+ color: {
408
+ required: false,
409
+ control: "color",
410
+ type: "string",
411
+ description:
412
+ "This attribute sets the text color using either a named color or a color specified in the hexadecimal #RRGGBB format. Note: This is a legacy attribute. Please use the CSS color property instead.",
413
+ },
414
+ content: {
415
+ required: false,
416
+ control: "text",
417
+ type: "string",
418
+ description:
419
+ "A value associated with http-equiv orname depending on the context.",
420
+ },
421
+ contextMenu: {
422
+ required: false,
423
+ control: "text",
424
+ type: "string",
425
+ description:
426
+ "Defines the ID of a menu element which willserve as the element's context menu.",
427
+ },
393
428
  datatype: { required: false, control: "text", type: "string" },
394
429
  defaultChecked: { required: false, control: "boolean", type: "boolean" },
395
- dir: { required: false, control: "text", type: "string" },
396
- draggable: { required: false, control: "boolean", type: "boolean" },
397
- hidden: { required: false, control: "boolean", type: "boolean" },
398
- href: { required: false, control: "text", type: "string" },
399
- hrefLang: { required: false, control: "text", type: "string" },
400
- id: { required: false, control: "text", type: "string" },
430
+ dir: {
431
+ required: false,
432
+ control: "text",
433
+ type: "string",
434
+ description:
435
+ "Defines the text direction. Allowed values are ltr (Left-To-Right) or rtl (Right-To-Left)",
436
+ },
437
+ draggable: {
438
+ required: false,
439
+ control: "boolean",
440
+ type: "boolean",
441
+ description: "Defines whether the element can be dragged.",
442
+ },
443
+ hidden: {
444
+ required: false,
445
+ control: "boolean",
446
+ type: "boolean",
447
+ description:
448
+ "Prevents rendering of given element, while keeping child elements, e.g. script elements, active.",
449
+ },
450
+ href: {
451
+ required: false,
452
+ control: "text",
453
+ type: "string",
454
+ description: "The URL of a linked resource.",
455
+ },
456
+ hrefLang: {
457
+ required: false,
458
+ control: "text",
459
+ type: "string",
460
+ description: "Specifies the language of the linked resource.",
461
+ },
462
+ id: {
463
+ required: false,
464
+ control: "text",
465
+ type: "string",
466
+ description:
467
+ "Often used with CSS to style a specific element. The value of this attribute must be unique.",
468
+ },
401
469
  inputMode: {
402
470
  description:
403
471
  "Hints at the type of data that might be entered by the user while editing the element or its contents\n@see https://html.spec.whatwg.org/multipage/interaction.html#input-modalities:-the-inputmode-attribute",
@@ -427,16 +495,41 @@ export const props: Record<string, PropMeta> = {
427
495
  itemRef: { required: false, control: "text", type: "string" },
428
496
  itemScope: { required: false, control: "boolean", type: "boolean" },
429
497
  itemType: { required: false, control: "text", type: "string" },
430
- lang: { required: false, control: "text", type: "string" },
431
- media: { required: false, control: "text", type: "string" },
498
+ lang: {
499
+ required: false,
500
+ control: "text",
501
+ type: "string",
502
+ description: "Defines the language used in the element.",
503
+ },
504
+ media: {
505
+ required: false,
506
+ control: "text",
507
+ type: "string",
508
+ description:
509
+ "Specifies a hint of the media for which the linked resource was designed.",
510
+ },
432
511
  nonce: { required: false, control: "text", type: "string" },
433
- ping: { required: false, control: "text", type: "string" },
434
- placeholder: { required: false, control: "text", type: "string" },
512
+ ping: {
513
+ required: false,
514
+ control: "text",
515
+ type: "string",
516
+ description:
517
+ "The ping attribute specifies a space-separated list of URLs to be notified if a user follows the hyperlink.",
518
+ },
519
+ placeholder: {
520
+ required: false,
521
+ control: "text",
522
+ type: "string",
523
+ description:
524
+ "Provides a hint to the user of what can be entered in the field.",
525
+ },
435
526
  prefetch: {
436
527
  required: false,
437
528
  control: "select",
438
529
  type: "string",
439
530
  options: ["none", "intent", "render", "viewport"],
531
+ description:
532
+ "Controls when and if the link prefetches the resources that the next page needs to make loading faster. “Intent” will prefetch when the link is hovered or focused. “Render” will prefetch when the link is rendered. “Viewport” will prefetch when the link is in the viewport. “None” will not prefetch.",
440
533
  },
441
534
  prefix: { required: false, control: "text", type: "string" },
442
535
  preventScrollReset: { required: false, control: "boolean", type: "boolean" },
@@ -457,17 +550,40 @@ export const props: Record<string, PropMeta> = {
457
550
  "strict-origin-when-cross-origin",
458
551
  "unsafe-url",
459
552
  ],
553
+ description: "Specifies which referrer is sent when fetching the resource.",
554
+ },
555
+ rel: {
556
+ required: false,
557
+ control: "text",
558
+ type: "string",
559
+ description:
560
+ "Specifies the relationship of the target object to the link object.",
460
561
  },
461
- rel: { required: false, control: "text", type: "string" },
462
562
  reloadDocument: { required: false, control: "boolean", type: "boolean" },
463
563
  replace: { required: false, control: "boolean", type: "boolean" },
464
564
  resource: { required: false, control: "text", type: "string" },
465
565
  results: { required: false, control: "number", type: "number" },
466
566
  rev: { required: false, control: "text", type: "string" },
467
- role: { required: false, control: "text", type: "string" },
567
+ role: {
568
+ required: false,
569
+ control: "text",
570
+ type: "string",
571
+ description:
572
+ "Defines an explicit role for an element for use by assistive technologies.",
573
+ },
468
574
  security: { required: false, control: "text", type: "string" },
469
- slot: { required: false, control: "text", type: "string" },
470
- spellCheck: { required: false, control: "boolean", type: "boolean" },
575
+ slot: {
576
+ required: false,
577
+ control: "text",
578
+ type: "string",
579
+ description: "Assigns a slot in a shadow DOM shadow tree to an element.",
580
+ },
581
+ spellCheck: {
582
+ required: false,
583
+ control: "boolean",
584
+ type: "boolean",
585
+ description: "Indicates whether spell checking is allowed for the element.",
586
+ },
471
587
  suppressContentEditableWarning: {
472
588
  required: false,
473
589
  control: "boolean",
@@ -478,21 +594,42 @@ export const props: Record<string, PropMeta> = {
478
594
  control: "boolean",
479
595
  type: "boolean",
480
596
  },
481
- tabIndex: { required: false, control: "number", type: "number" },
597
+ tabIndex: {
598
+ required: false,
599
+ control: "number",
600
+ type: "number",
601
+ description:
602
+ "Overrides the browser's default tab order and follows the one specified instead.",
603
+ },
482
604
  target: {
483
605
  required: false,
484
606
  control: "select",
485
607
  type: "string",
486
608
  options: ["_self", "_blank", "_parent", "_top"],
609
+ description:
610
+ "Specifies where to open the linked document (in the case of an <a> element) or where to display the response received (in the case of a <form> element)",
611
+ },
612
+ title: {
613
+ required: false,
614
+ control: "text",
615
+ type: "string",
616
+ description:
617
+ "Text to be displayed in a tooltip when hovering over the element.",
487
618
  },
488
- title: { required: false, control: "text", type: "string" },
489
619
  translate: {
490
620
  required: false,
491
621
  control: "radio",
492
622
  type: "string",
493
623
  options: ["yes", "no"],
624
+ description:
625
+ "Specify whether an element's attribute values and the values of its text node children are to be translated when the page is localized, or whether to leave them unchanged.",
626
+ },
627
+ type: {
628
+ required: false,
629
+ control: "text",
630
+ type: "string",
631
+ description: "Defines the type of the element.",
494
632
  },
495
- type: { required: false, control: "text", type: "string" },
496
633
  typeof: { required: false, control: "text", type: "string" },
497
634
  unselectable: {
498
635
  required: false,