@webstudio-is/sdk-components-react 0.81.0 → 0.83.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.
Files changed (172) hide show
  1. package/LICENSE +661 -21
  2. package/lib/__generated__/blockquote.props.js +30 -5
  3. package/lib/__generated__/body.props.js +30 -5
  4. package/lib/__generated__/bold.props.js +30 -5
  5. package/lib/__generated__/box.props.js +30 -5
  6. package/lib/__generated__/button.props.js +30 -5
  7. package/lib/__generated__/checkbox.props.js +31 -6
  8. package/lib/__generated__/code-text.props.js +30 -5
  9. package/lib/__generated__/form.props.js +30 -5
  10. package/lib/__generated__/heading.props.js +30 -5
  11. package/lib/__generated__/image.props.js +31 -5
  12. package/lib/__generated__/input.props.js +30 -5
  13. package/lib/__generated__/italic.props.js +30 -5
  14. package/lib/__generated__/label.props.js +30 -5
  15. package/lib/__generated__/link.props.js +30 -5
  16. package/lib/__generated__/list-item.props.js +30 -5
  17. package/lib/__generated__/list.props.js +30 -5
  18. package/lib/__generated__/paragraph.props.js +30 -5
  19. package/lib/__generated__/radio-button.props.js +31 -6
  20. package/lib/__generated__/radix-dialog.props.js +2120 -0
  21. package/lib/__generated__/{link-block.props.js → radix-popover.props.js} +151 -114
  22. package/lib/__generated__/radix-tooltip.props.js +473 -0
  23. package/lib/__generated__/rich-text-link.props.js +30 -5
  24. package/lib/__generated__/separator.props.js +30 -5
  25. package/lib/__generated__/span.props.js +30 -5
  26. package/lib/__generated__/subscript.props.js +30 -5
  27. package/lib/__generated__/superscript.props.js +30 -5
  28. package/lib/__generated__/text.props.js +30 -5
  29. package/lib/__generated__/textarea.props.js +30 -5
  30. package/lib/__generated__/vimeo-play-button.props.js +30 -5
  31. package/lib/__generated__/vimeo-preview-image.props.js +30 -5
  32. package/lib/__generated__/vimeo-spinner.props.js +30 -5
  33. package/lib/__generated__/vimeo.props.js +30 -5
  34. package/lib/body.ws.js +11 -1
  35. package/lib/cjs/__generated__/blockquote.props.js +30 -5
  36. package/lib/cjs/__generated__/body.props.js +30 -5
  37. package/lib/cjs/__generated__/bold.props.js +30 -5
  38. package/lib/cjs/__generated__/box.props.js +30 -5
  39. package/lib/cjs/__generated__/button.props.js +30 -5
  40. package/lib/cjs/__generated__/checkbox.props.js +31 -6
  41. package/lib/cjs/__generated__/code-text.props.js +30 -5
  42. package/lib/cjs/__generated__/form.props.js +30 -5
  43. package/lib/cjs/__generated__/heading.props.js +30 -5
  44. package/lib/cjs/__generated__/image.props.js +31 -5
  45. package/lib/cjs/__generated__/input.props.js +30 -5
  46. package/lib/cjs/__generated__/italic.props.js +30 -5
  47. package/lib/cjs/__generated__/label.props.js +30 -5
  48. package/lib/cjs/__generated__/link.props.js +30 -5
  49. package/lib/cjs/__generated__/list-item.props.js +30 -5
  50. package/lib/cjs/__generated__/list.props.js +30 -5
  51. package/lib/cjs/__generated__/paragraph.props.js +30 -5
  52. package/lib/cjs/__generated__/radio-button.props.js +31 -6
  53. package/lib/cjs/__generated__/radix-dialog.props.js +2140 -0
  54. package/lib/cjs/__generated__/{link-block.props.js → radix-popover.props.js} +154 -117
  55. package/lib/cjs/__generated__/radix-tooltip.props.js +493 -0
  56. package/lib/cjs/__generated__/rich-text-link.props.js +30 -5
  57. package/lib/cjs/__generated__/separator.props.js +30 -5
  58. package/lib/cjs/__generated__/span.props.js +30 -5
  59. package/lib/cjs/__generated__/subscript.props.js +30 -5
  60. package/lib/cjs/__generated__/superscript.props.js +30 -5
  61. package/lib/cjs/__generated__/text.props.js +30 -5
  62. package/lib/cjs/__generated__/textarea.props.js +30 -5
  63. package/lib/cjs/__generated__/vimeo-play-button.props.js +30 -5
  64. package/lib/cjs/__generated__/vimeo-preview-image.props.js +30 -5
  65. package/lib/cjs/__generated__/vimeo-spinner.props.js +30 -5
  66. package/lib/cjs/__generated__/vimeo.props.js +30 -5
  67. package/lib/cjs/body.ws.js +11 -1
  68. package/lib/cjs/components.js +16 -0
  69. package/lib/cjs/image.js +12 -2
  70. package/lib/cjs/label.ws.js +1 -1
  71. package/lib/cjs/metas.js +16 -0
  72. package/lib/cjs/props.js +16 -0
  73. package/lib/cjs/radix-dialog.js +61 -0
  74. package/lib/cjs/radix-dialog.ws.js +300 -0
  75. package/lib/cjs/radix-popover.js +59 -0
  76. package/lib/cjs/radix-popover.ws.js +139 -0
  77. package/lib/cjs/radix-tooltip.js +51 -0
  78. package/lib/cjs/radix-tooltip.ws.js +140 -0
  79. package/lib/cjs/theme/radix-common-types.js +16 -0
  80. package/lib/cjs/theme/tailwind-classes.js +439 -0
  81. package/lib/cjs/theme/tailwind-colors.js +33 -0
  82. package/lib/cjs/theme/tailwind-theme.js +46 -0
  83. package/lib/cjs/vimeo-play-button.ws.js +1 -0
  84. package/lib/cjs/vimeo-preview-image.ws.js +1 -0
  85. package/lib/cjs/vimeo.ws.js +1 -0
  86. package/lib/components.js +24 -0
  87. package/lib/image.js +12 -2
  88. package/lib/label.ws.js +2 -2
  89. package/lib/metas.js +32 -0
  90. package/lib/props.js +32 -0
  91. package/lib/radix-dialog.js +36 -0
  92. package/lib/radix-dialog.ws.js +279 -0
  93. package/lib/radix-popover.js +34 -0
  94. package/lib/radix-popover.ws.js +114 -0
  95. package/lib/radix-tooltip.js +26 -0
  96. package/lib/radix-tooltip.ws.js +115 -0
  97. package/lib/theme/radix-common-types.js +0 -0
  98. package/lib/theme/tailwind-classes.js +419 -0
  99. package/lib/theme/tailwind-colors.js +13 -0
  100. package/lib/theme/tailwind-theme.js +16 -0
  101. package/lib/types/__generated__/radix-dialog.props.d.ts +8 -0
  102. package/lib/types/__generated__/radix-popover.props.d.ts +4 -0
  103. package/lib/types/__generated__/radix-tooltip.props.d.ts +4 -0
  104. package/lib/types/components.d.ts +3 -0
  105. package/lib/types/metas.d.ts +3 -0
  106. package/lib/types/props.d.ts +3 -0
  107. package/lib/types/radix-dialog.d.ts +26 -0
  108. package/lib/types/radix-dialog.ws.d.ts +23 -0
  109. package/lib/types/radix-popover.d.ts +22 -0
  110. package/lib/types/radix-popover.ws.d.ts +15 -0
  111. package/lib/types/radix-tooltip.d.ts +22 -0
  112. package/lib/types/radix-tooltip.ws.d.ts +15 -0
  113. package/lib/types/theme/radix-common-types.d.ts +84 -0
  114. package/lib/types/theme/tailwind-classes.d.ts +69 -0
  115. package/lib/types/theme/tailwind-colors.d.ts +19 -0
  116. package/lib/types/theme/tailwind-theme.d.ts +72 -0
  117. package/lib/types/vimeo-preview-image.d.ts +6 -1
  118. package/lib/vimeo-play-button.ws.js +1 -0
  119. package/lib/vimeo-preview-image.js +1 -1
  120. package/lib/vimeo-preview-image.ws.js +2 -0
  121. package/lib/vimeo.ws.js +1 -0
  122. package/package.json +18 -13
  123. package/src/LICENSE +661 -21
  124. package/src/__generated__/blockquote.props.ts +34 -5
  125. package/src/__generated__/body.props.ts +34 -5
  126. package/src/__generated__/bold.props.ts +34 -5
  127. package/src/__generated__/box.props.ts +34 -5
  128. package/src/__generated__/button.props.ts +34 -5
  129. package/src/__generated__/checkbox.props.ts +35 -6
  130. package/src/__generated__/code-text.props.ts +34 -5
  131. package/src/__generated__/form.props.ts +34 -5
  132. package/src/__generated__/heading.props.ts +34 -5
  133. package/src/__generated__/image.props.ts +35 -5
  134. package/src/__generated__/input.props.ts +34 -5
  135. package/src/__generated__/italic.props.ts +34 -5
  136. package/src/__generated__/label.props.ts +34 -5
  137. package/src/__generated__/link.props.ts +34 -5
  138. package/src/__generated__/list-item.props.ts +34 -5
  139. package/src/__generated__/list.props.ts +34 -5
  140. package/src/__generated__/paragraph.props.ts +34 -5
  141. package/src/__generated__/radio-button.props.ts +35 -6
  142. package/src/__generated__/radix-dialog.props.ts +2363 -0
  143. package/src/__generated__/{link-block.props.ts → radix-popover.props.ts} +153 -114
  144. package/src/__generated__/radix-tooltip.props.ts +521 -0
  145. package/src/__generated__/rich-text-link.props.ts +34 -5
  146. package/src/__generated__/separator.props.ts +34 -5
  147. package/src/__generated__/span.props.ts +34 -5
  148. package/src/__generated__/subscript.props.ts +34 -5
  149. package/src/__generated__/superscript.props.ts +34 -5
  150. package/src/__generated__/text.props.ts +34 -5
  151. package/src/__generated__/textarea.props.ts +34 -5
  152. package/src/__generated__/vimeo-play-button.props.ts +34 -5
  153. package/src/__generated__/vimeo-preview-image.props.ts +34 -5
  154. package/src/__generated__/vimeo-spinner.props.ts +34 -5
  155. package/src/__generated__/vimeo.props.ts +34 -5
  156. package/src/body.ws.tsx +11 -1
  157. package/src/components.ts +11 -0
  158. package/src/image.tsx +9 -2
  159. package/src/label.ws.tsx +2 -2
  160. package/src/metas.ts +21 -0
  161. package/src/props.ts +19 -0
  162. package/src/radix-dialog.tsx +91 -0
  163. package/src/radix-dialog.ws.tsx +291 -0
  164. package/src/radix-popover.tsx +89 -0
  165. package/src/radix-popover.ws.tsx +124 -0
  166. package/src/radix-tooltip.tsx +84 -0
  167. package/src/radix-tooltip.ws.tsx +125 -0
  168. package/src/theme/radix-common-types.ts +495 -0
  169. package/src/theme/tailwind-classes.ts +570 -0
  170. package/src/theme/tailwind-colors.ts +47 -0
  171. package/src/theme/tailwind-theme.ts +24 -0
  172. package/lib/types/__generated__/link-block.props.d.ts +0 -2
package/src/__generated__/{link-block.props.ts → radix-popover.props.ts} RENAMED
@@ -1,123 +1,28 @@
1
1
  import type { PropMeta } from "@webstudio-is/generate-arg-types";
2
2
 
3
- export const props: Record<string, PropMeta> = {
4
- slot: { required: false, control: "text", type: "string" },
5
- style: { required: false, control: "text", type: "string" },
6
- title: { required: false, control: "text", type: "string" },
7
- target: {
8
- required: false,
9
- control: "select",
10
- type: "string",
11
- options: ["_self", "_blank", "_parent", "_top"],
12
- },
13
- download: { required: false, control: "text", type: "string" },
14
- href: { required: false, control: "text", type: "string" },
15
- hrefLang: { required: false, control: "text", type: "string" },
16
- media: { required: false, control: "text", type: "string" },
17
- ping: { required: false, control: "text", type: "string" },
18
- type: { required: false, control: "text", type: "string" },
19
- referrerPolicy: {
20
- required: false,
21
- control: "select",
22
- type: "string",
23
- options: [
24
- "",
25
- "no-referrer",
26
- "no-referrer-when-downgrade",
27
- "origin",
28
- "origin-when-cross-origin",
29
- "same-origin",
30
- "strict-origin",
31
- "strict-origin-when-cross-origin",
32
- "unsafe-url",
33
- ],
34
- },
35
- defaultChecked: { required: false, control: "boolean", type: "boolean" },
36
- defaultValue: { required: false, control: "text", type: "string" },
37
- suppressContentEditableWarning: {
38
- required: false,
39
- control: "boolean",
40
- type: "boolean",
41
- },
42
- suppressHydrationWarning: {
43
- required: false,
44
- control: "boolean",
45
- type: "boolean",
46
- },
47
- accessKey: { required: false, control: "text", type: "string" },
48
- autoFocus: { required: false, control: "boolean", type: "boolean" },
49
- className: { required: false, control: "text", type: "string" },
50
- contentEditable: { required: false, control: "text", type: "string" },
51
- contextMenu: { required: false, control: "text", type: "string" },
52
- dir: { required: false, control: "text", type: "string" },
53
- draggable: { required: false, control: "boolean", type: "boolean" },
54
- hidden: { required: false, control: "boolean", type: "boolean" },
55
- id: { required: false, control: "text", type: "string" },
56
- lang: { required: false, control: "text", type: "string" },
57
- nonce: { required: false, control: "text", type: "string" },
58
- placeholder: { required: false, control: "text", type: "string" },
59
- spellCheck: { required: false, control: "boolean", type: "boolean" },
60
- tabIndex: { required: false, control: "number", type: "number" },
61
- translate: {
62
- required: false,
3
+ export const propsPopover: Record<string, PropMeta> = {
4
+ defaultOpen: { required: false, control: "boolean", type: "boolean" },
5
+ isOpen: {
6
+ required: true,
63
7
  control: "radio",
64
8
  type: "string",
65
- options: ["yes", "no"],
9
+ options: ["open", "initial", "closed"],
66
10
  },
67
- radioGroup: { required: false, control: "text", type: "string" },
68
- role: { required: false, control: "text", type: "string" },
11
+ modal: { required: false, control: "boolean", type: "boolean" },
12
+ open: { required: false, control: "boolean", type: "boolean" },
13
+ };
14
+ export const propsPopoverTrigger: Record<string, PropMeta> = {};
15
+ export const propsPopoverContent: Record<string, PropMeta> = {
69
16
  about: { required: false, control: "text", type: "string" },
70
- content: { required: false, control: "text", type: "string" },
71
- datatype: { required: false, control: "text", type: "string" },
72
- inlist: { required: false, control: "text", type: "string" },
73
- prefix: { required: false, control: "text", type: "string" },
74
- property: { required: false, control: "text", type: "string" },
75
- rel: { required: false, control: "text", type: "string" },
76
- resource: { required: false, control: "text", type: "string" },
77
- rev: { required: false, control: "text", type: "string" },
78
- typeof: { required: false, control: "text", type: "string" },
79
- vocab: { required: false, control: "text", type: "string" },
80
- autoCapitalize: { required: false, control: "text", type: "string" },
81
- autoCorrect: { required: false, control: "text", type: "string" },
82
- autoSave: { required: false, control: "text", type: "string" },
83
- color: { required: false, control: "color", type: "string" },
84
- itemProp: { required: false, control: "text", type: "string" },
85
- itemScope: { required: false, control: "boolean", type: "boolean" },
86
- itemType: { required: false, control: "text", type: "string" },
87
- itemID: { required: false, control: "text", type: "string" },
88
- itemRef: { required: false, control: "text", type: "string" },
89
- results: { required: false, control: "number", type: "number" },
90
- security: { required: false, control: "text", type: "string" },
91
- unselectable: {
17
+ accessKey: { required: false, control: "text", type: "string" },
18
+ align: {
92
19
  required: false,
93
20
  control: "radio",
94
21
  type: "string",
95
- options: ["on", "off"],
96
- },
97
- inputMode: {
98
- description:
99
- "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",
100
- required: false,
101
- control: "select",
102
- type: "string",
103
- options: [
104
- "text",
105
- "none",
106
- "search",
107
- "tel",
108
- "url",
109
- "email",
110
- "numeric",
111
- "decimal",
112
- ],
113
- },
114
- is: {
115
- description:
116
- "Specify that a standard HTML element should behave like a defined custom built-in element\n@see https://html.spec.whatwg.org/multipage/custom-elements.html#attr-is",
117
- required: false,
118
- control: "text",
119
- type: "string",
22
+ defaultValue: "center",
23
+ options: ["center", "start", "end"],
120
24
  },
25
+ alignOffset: { required: false, control: "number", type: "number" },
121
26
  "aria-activedescendant": {
122
27
  description:
123
28
  "Identifies the currently active element when DOM focus is on a composite widget, textbox, group, or application.",
@@ -140,13 +45,21 @@ export const props: Record<string, PropMeta> = {
140
45
  type: "string",
141
46
  options: ["list", "none", "inline", "both"],
142
47
  },
143
- "aria-busy": {
48
+ "aria-braillelabel": {
144
49
  description:
145
- "Indicates an element is being modified and that assistive technologies MAY want to wait until the modifications are complete before exposing them to the user.",
50
+ "Defines a string value that labels the current element, which is intended to be converted into Braille.\n@see aria-label.",
146
51
  required: false,
147
- control: "boolean",
148
- type: "boolean",
52
+ control: "text",
53
+ type: "string",
54
+ },
55
+ "aria-brailleroledescription": {
56
+ description:
57
+ "Defines a human-readable, author-localized abbreviated description for the role of an element, which is intended to be converted into Braille.\n@see aria-roledescription.",
58
+ required: false,
59
+ control: "text",
60
+ type: "string",
149
61
  },
62
+ "aria-busy": { required: false, control: "boolean", type: "boolean" },
150
63
  "aria-checked": {
151
64
  description:
152
65
  'Indicates the current "checked" state of checkboxes, radio buttons, and other widgets.\n@see aria-pressed\n@see aria-selected.',
@@ -168,6 +81,13 @@ export const props: Record<string, PropMeta> = {
168
81
  control: "number",
169
82
  type: "number",
170
83
  },
84
+ "aria-colindextext": {
85
+ description:
86
+ "Defines a human readable text alternative of aria-colindex.\n@see aria-rowindextext.",
87
+ required: false,
88
+ control: "text",
89
+ type: "string",
90
+ },
171
91
  "aria-colspan": {
172
92
  description:
173
93
  "Defines the number of columns spanned by a cell or gridcell within a table, grid, or treegrid.\n@see aria-colindex\n@see aria-rowspan.",
@@ -196,6 +116,13 @@ export const props: Record<string, PropMeta> = {
196
116
  control: "text",
197
117
  type: "string",
198
118
  },
119
+ "aria-description": {
120
+ description:
121
+ "Defines a string value that describes or annotates the current element.\n@see related aria-describedby.",
122
+ required: false,
123
+ control: "text",
124
+ type: "string",
125
+ },
199
126
  "aria-details": {
200
127
  description:
201
128
  "Identifies the element that provides a detailed, extended description for the object.\n@see aria-describedby.",
@@ -413,6 +340,13 @@ export const props: Record<string, PropMeta> = {
413
340
  control: "number",
414
341
  type: "number",
415
342
  },
343
+ "aria-rowindextext": {
344
+ description:
345
+ "Defines a human readable text alternative of aria-rowindex.\n@see aria-colindextext.",
346
+ required: false,
347
+ control: "text",
348
+ type: "string",
349
+ },
416
350
  "aria-rowspan": {
417
351
  description:
418
352
  "Defines the number of rows spanned by a cell or gridcell within a table, grid, or treegrid.\n@see aria-rowindex\n@see aria-colspan.",
@@ -468,4 +402,109 @@ export const props: Record<string, PropMeta> = {
468
402
  control: "text",
469
403
  type: "string",
470
404
  },
405
+ arrowPadding: { required: false, control: "number", type: "number" },
406
+ asChild: { required: false, control: "boolean", type: "boolean" },
407
+ autoCapitalize: { required: false, control: "text", type: "string" },
408
+ autoCorrect: { required: false, control: "text", type: "string" },
409
+ autoFocus: { required: false, control: "boolean", type: "boolean" },
410
+ autoSave: { required: false, control: "text", type: "string" },
411
+ avoidCollisions: { required: false, control: "boolean", type: "boolean" },
412
+ className: { required: false, control: "text", type: "string" },
413
+ color: { required: false, control: "color", type: "string" },
414
+ content: { required: false, control: "text", type: "string" },
415
+ contextMenu: { required: false, control: "text", type: "string" },
416
+ datatype: { required: false, control: "text", type: "string" },
417
+ defaultChecked: { required: false, control: "boolean", type: "boolean" },
418
+ dir: { required: false, control: "text", type: "string" },
419
+ draggable: { required: false, control: "boolean", type: "boolean" },
420
+ hidden: { required: false, control: "boolean", type: "boolean" },
421
+ hideWhenDetached: { required: false, control: "boolean", type: "boolean" },
422
+ id: { required: false, control: "text", type: "string" },
423
+ inputMode: {
424
+ description:
425
+ "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",
426
+ required: false,
427
+ control: "select",
428
+ type: "string",
429
+ options: [
430
+ "search",
431
+ "text",
432
+ "none",
433
+ "tel",
434
+ "url",
435
+ "email",
436
+ "numeric",
437
+ "decimal",
438
+ ],
439
+ },
440
+ is: {
441
+ description:
442
+ "Specify that a standard HTML element should behave like a defined custom built-in element\n@see https://html.spec.whatwg.org/multipage/custom-elements.html#attr-is",
443
+ required: false,
444
+ control: "text",
445
+ type: "string",
446
+ },
447
+ itemID: { required: false, control: "text", type: "string" },
448
+ itemProp: { required: false, control: "text", type: "string" },
449
+ itemRef: { required: false, control: "text", type: "string" },
450
+ itemScope: { required: false, control: "boolean", type: "boolean" },
451
+ itemType: { required: false, control: "text", type: "string" },
452
+ lang: { required: false, control: "text", type: "string" },
453
+ nonce: { required: false, control: "text", type: "string" },
454
+ placeholder: { required: false, control: "text", type: "string" },
455
+ prefix: { required: false, control: "text", type: "string" },
456
+ property: { required: false, control: "text", type: "string" },
457
+ radioGroup: { required: false, control: "text", type: "string" },
458
+ rel: { required: false, control: "text", type: "string" },
459
+ resource: { required: false, control: "text", type: "string" },
460
+ results: { required: false, control: "number", type: "number" },
461
+ rev: { required: false, control: "text", type: "string" },
462
+ role: { required: false, control: "text", type: "string" },
463
+ security: { required: false, control: "text", type: "string" },
464
+ side: {
465
+ required: false,
466
+ control: "select",
467
+ type: "string",
468
+ options: ["top", "right", "bottom", "left"],
469
+ },
470
+ sideOffset: {
471
+ required: false,
472
+ control: "number",
473
+ type: "number",
474
+ defaultValue: 4,
475
+ },
476
+ slot: { required: false, control: "text", type: "string" },
477
+ spellCheck: { required: false, control: "boolean", type: "boolean" },
478
+ sticky: {
479
+ required: false,
480
+ control: "radio",
481
+ type: "string",
482
+ options: ["partial", "always"],
483
+ },
484
+ suppressContentEditableWarning: {
485
+ required: false,
486
+ control: "boolean",
487
+ type: "boolean",
488
+ },
489
+ suppressHydrationWarning: {
490
+ required: false,
491
+ control: "boolean",
492
+ type: "boolean",
493
+ },
494
+ tabIndex: { required: false, control: "number", type: "number" },
495
+ title: { required: false, control: "text", type: "string" },
496
+ translate: {
497
+ required: false,
498
+ control: "radio",
499
+ type: "string",
500
+ options: ["yes", "no"],
501
+ },
502
+ typeof: { required: false, control: "text", type: "string" },
503
+ unselectable: {
504
+ required: false,
505
+ control: "radio",
506
+ type: "string",
507
+ options: ["on", "off"],
508
+ },
509
+ vocab: { required: false, control: "text", type: "string" },
471
510
  };