@webstudio-is/sdk-components-react-remix 0.83.0 → 0.85.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.
@@ -382,9 +382,9 @@ const props = {
382
382
  placeholder: { required: false, control: "text", type: "string" },
383
383
  prefetch: {
384
384
  required: false,
385
- control: "radio",
385
+ control: "select",
386
386
  type: "string",
387
- options: ["none", "intent", "render"]
387
+ options: ["none", "intent", "render", "viewport"]
388
388
  },
389
389
  prefix: { required: false, control: "text", type: "string" },
390
390
  preventScrollReset: { required: false, control: "boolean", type: "boolean" },
@@ -382,9 +382,9 @@ const props = {
382
382
  placeholder: { required: false, control: "text", type: "string" },
383
383
  prefetch: {
384
384
  required: false,
385
- control: "radio",
385
+ control: "select",
386
386
  type: "string",
387
- options: ["none", "intent", "render"]
387
+ options: ["none", "intent", "render", "viewport"]
388
388
  },
389
389
  prefix: { required: false, control: "text", type: "string" },
390
390
  preventScrollReset: { required: false, control: "boolean", type: "boolean" },
@@ -405,9 +405,9 @@ const props = {
405
405
  placeholder: { required: false, control: "text", type: "string" },
406
406
  prefetch: {
407
407
  required: false,
408
- control: "radio",
408
+ control: "select",
409
409
  type: "string",
410
- options: ["none", "intent", "render"]
410
+ options: ["none", "intent", "render", "viewport"]
411
411
  },
412
412
  prefix: { required: false, control: "text", type: "string" },
413
413
  preventScrollReset: { required: false, control: "boolean", type: "boolean" },
@@ -405,9 +405,9 @@ const props = {
405
405
  placeholder: { required: false, control: "text", type: "string" },
406
406
  prefetch: {
407
407
  required: false,
408
- control: "radio",
408
+ control: "select",
409
409
  type: "string",
410
- options: ["none", "intent", "render"]
410
+ options: ["none", "intent", "render", "viewport"]
411
411
  },
412
412
  prefix: { required: false, control: "text", type: "string" },
413
413
  preventScrollReset: { required: false, control: "boolean", type: "boolean" },
@@ -48,15 +48,14 @@ const meta = {
48
48
  {
49
49
  type: "instance",
50
50
  component: "Form",
51
+ dataSources: {
52
+ formState: { type: "variable", initialValue: "initial" }
53
+ },
51
54
  props: [
52
55
  {
56
+ type: "dataSource",
53
57
  name: "state",
54
- type: "string",
55
- value: "initial",
56
- dataSourceRef: {
57
- type: "variable",
58
- name: "formState"
59
- }
58
+ dataSourceName: "formState"
60
59
  }
61
60
  ],
62
61
  children: [
@@ -64,16 +63,17 @@ const meta = {
64
63
  type: "instance",
65
64
  label: "Form Content",
66
65
  component: "Box",
66
+ dataSources: {
67
+ formInitial: {
68
+ type: "expression",
69
+ code: `formState === 'initial' || formState === 'error'`
70
+ }
71
+ },
67
72
  props: [
68
73
  {
74
+ type: "dataSource",
69
75
  name: import_react_sdk.showAttribute,
70
- type: "boolean",
71
- value: false,
72
- dataSourceRef: {
73
- type: "expression",
74
- name: "formInitial",
75
- code: `formState === 'initial' || formState === 'error'`
76
- }
76
+ dataSourceName: "formInitial"
77
77
  }
78
78
  ],
79
79
  children: [
@@ -110,16 +110,17 @@ const meta = {
110
110
  type: "instance",
111
111
  label: "Success Message",
112
112
  component: "Box",
113
+ dataSources: {
114
+ formSuccess: {
115
+ type: "expression",
116
+ code: `formState === 'success'`
117
+ }
118
+ },
113
119
  props: [
114
120
  {
121
+ type: "dataSource",
115
122
  name: import_react_sdk.showAttribute,
116
- type: "boolean",
117
- value: false,
118
- dataSourceRef: {
119
- type: "expression",
120
- name: "formSuccess",
121
- code: `formState === 'success'`
122
- }
123
+ dataSourceName: "formSuccess"
123
124
  }
124
125
  ],
125
126
  children: [
@@ -130,16 +131,17 @@ const meta = {
130
131
  type: "instance",
131
132
  label: "Error Message",
132
133
  component: "Box",
134
+ dataSources: {
135
+ formError: {
136
+ type: "expression",
137
+ code: `formState === 'error'`
138
+ }
139
+ },
133
140
  props: [
134
141
  {
142
+ type: "dataSource",
135
143
  name: import_react_sdk.showAttribute,
136
- type: "boolean",
137
- value: false,
138
- dataSourceRef: {
139
- type: "expression",
140
- name: "formError",
141
- code: `formState === 'error'`
142
- }
144
+ dataSourceName: "formError"
143
145
  }
144
146
  ],
145
147
  children: [{ type: "text", value: "Sorry, something went wrong." }]
@@ -150,5 +152,5 @@ const meta = {
150
152
  };
151
153
  const propsMeta = {
152
154
  props: import_form.props,
153
- initialProps: ["id", "state"]
155
+ initialProps: ["id", "state", "action"]
154
156
  };
@@ -38,7 +38,8 @@ const wrapLinkComponent = (BaseLink) => {
38
38
  }
39
39
  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react2.NavLink, { ...props, to, ref });
40
40
  }
41
- return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(BaseLink, { ...props, ref });
41
+ const { prefetch, reloadDocument, replace, preventScrollReset, ...rest } = props;
42
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(BaseLink, { ...rest, ref });
42
43
  });
43
44
  Component.displayName = BaseLink.displayName;
44
45
  return Component;
package/lib/form.ws.js CHANGED
@@ -26,15 +26,14 @@ const meta = {
26
26
  {
27
27
  type: "instance",
28
28
  component: "Form",
29
+ dataSources: {
30
+ formState: { type: "variable", initialValue: "initial" }
31
+ },
29
32
  props: [
30
33
  {
34
+ type: "dataSource",
31
35
  name: "state",
32
- type: "string",
33
- value: "initial",
34
- dataSourceRef: {
35
- type: "variable",
36
- name: "formState"
37
- }
36
+ dataSourceName: "formState"
38
37
  }
39
38
  ],
40
39
  children: [
@@ -42,16 +41,17 @@ const meta = {
42
41
  type: "instance",
43
42
  label: "Form Content",
44
43
  component: "Box",
44
+ dataSources: {
45
+ formInitial: {
46
+ type: "expression",
47
+ code: `formState === 'initial' || formState === 'error'`
48
+ }
49
+ },
45
50
  props: [
46
51
  {
52
+ type: "dataSource",
47
53
  name: showAttribute,
48
- type: "boolean",
49
- value: false,
50
- dataSourceRef: {
51
- type: "expression",
52
- name: "formInitial",
53
- code: `formState === 'initial' || formState === 'error'`
54
- }
54
+ dataSourceName: "formInitial"
55
55
  }
56
56
  ],
57
57
  children: [
@@ -88,16 +88,17 @@ const meta = {
88
88
  type: "instance",
89
89
  label: "Success Message",
90
90
  component: "Box",
91
+ dataSources: {
92
+ formSuccess: {
93
+ type: "expression",
94
+ code: `formState === 'success'`
95
+ }
96
+ },
91
97
  props: [
92
98
  {
99
+ type: "dataSource",
93
100
  name: showAttribute,
94
- type: "boolean",
95
- value: false,
96
- dataSourceRef: {
97
- type: "expression",
98
- name: "formSuccess",
99
- code: `formState === 'success'`
100
- }
101
+ dataSourceName: "formSuccess"
101
102
  }
102
103
  ],
103
104
  children: [
@@ -108,16 +109,17 @@ const meta = {
108
109
  type: "instance",
109
110
  label: "Error Message",
110
111
  component: "Box",
112
+ dataSources: {
113
+ formError: {
114
+ type: "expression",
115
+ code: `formState === 'error'`
116
+ }
117
+ },
111
118
  props: [
112
119
  {
120
+ type: "dataSource",
113
121
  name: showAttribute,
114
- type: "boolean",
115
- value: false,
116
- dataSourceRef: {
117
- type: "expression",
118
- name: "formError",
119
- code: `formState === 'error'`
120
- }
122
+ dataSourceName: "formError"
121
123
  }
122
124
  ],
123
125
  children: [{ type: "text", value: "Sorry, something went wrong." }]
@@ -128,7 +130,7 @@ const meta = {
128
130
  };
129
131
  const propsMeta = {
130
132
  props,
131
- initialProps: ["id", "state"]
133
+ initialProps: ["id", "state", "action"]
132
134
  };
133
135
  export {
134
136
  meta,
@@ -18,7 +18,8 @@ const wrapLinkComponent = (BaseLink) => {
18
18
  }
19
19
  return /* @__PURE__ */ jsx(RemixLink, { ...props, to, ref });
20
20
  }
21
- return /* @__PURE__ */ jsx(BaseLink, { ...props, ref });
21
+ const { prefetch, reloadDocument, replace, preventScrollReset, ...rest } = props;
22
+ return /* @__PURE__ */ jsx(BaseLink, { ...rest, ref });
22
23
  });
23
24
  Component.displayName = BaseLink.displayName;
24
25
  return Component;
@@ -3,7 +3,7 @@ export declare const Link: import("react").ForwardRefExoticComponent<Omit<Omit<O
3
3
  target?: "_self" | "_blank" | "_parent" | "_top" | undefined;
4
4
  }, "ref"> & import("react").RefAttributes<HTMLAnchorElement>, "ref">, "target"> & {
5
5
  target?: "_self" | "_blank" | "_parent" | "_top" | undefined;
6
- prefetch?: "none" | "intent" | "render" | undefined;
6
+ prefetch?: "none" | "viewport" | "intent" | "render" | undefined;
7
7
  reloadDocument?: boolean | undefined;
8
8
  replace?: boolean | undefined;
9
9
  preventScrollReset?: boolean | undefined;
@@ -3,7 +3,7 @@ export declare const RichTextLink: import("react").ForwardRefExoticComponent<Omi
3
3
  target?: "_self" | "_blank" | "_parent" | "_top" | undefined;
4
4
  }, "ref"> & import("react").RefAttributes<HTMLAnchorElement>, "ref">, "target"> & {
5
5
  target?: "_self" | "_blank" | "_parent" | "_top" | undefined;
6
- prefetch?: "none" | "intent" | "render" | undefined;
6
+ prefetch?: "none" | "viewport" | "intent" | "render" | undefined;
7
7
  reloadDocument?: boolean | undefined;
8
8
  replace?: boolean | undefined;
9
9
  preventScrollReset?: boolean | undefined;
@@ -4,7 +4,7 @@ export declare const wrapLinkComponent: (BaseLink: typeof Link) => import("react
4
4
  target?: "_self" | "_blank" | "_parent" | "_top" | undefined;
5
5
  }, "ref"> & import("react").RefAttributes<HTMLAnchorElement>, "ref">, "target"> & {
6
6
  target?: "_self" | "_blank" | "_parent" | "_top" | undefined;
7
- prefetch?: "none" | "intent" | "render" | undefined;
7
+ prefetch?: "none" | "viewport" | "intent" | "render" | undefined;
8
8
  reloadDocument?: boolean | undefined;
9
9
  replace?: boolean | undefined;
10
10
  preventScrollReset?: boolean | undefined;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@webstudio-is/sdk-components-react-remix",
3
- "version": "0.83.0",
3
+ "version": "0.85.0",
4
4
  "description": "Webstudio components for Remix",
5
5
  "author": "Webstudio <github@webstudio.is>",
6
6
  "homepage": "https://webstudio.is",
@@ -33,26 +33,26 @@
33
33
  }
34
34
  },
35
35
  "peerDependencies": {
36
- "@remix-run/react": "^1.18.0",
36
+ "@remix-run/react": "^1.19.1",
37
37
  "react": "^18.2.0",
38
38
  "react-dom": "^18.2.0"
39
39
  },
40
40
  "dependencies": {
41
- "@webstudio-is/form-handlers": "^0.83.0",
42
- "@webstudio-is/generate-arg-types": "^0.83.0",
43
- "@webstudio-is/icons": "^0.83.0",
44
- "@webstudio-is/react-sdk": "^0.83.0",
45
- "@webstudio-is/sdk-components-react": "^0.83.0"
41
+ "@webstudio-is/form-handlers": "^0.85.0",
42
+ "@webstudio-is/generate-arg-types": "^0.85.0",
43
+ "@webstudio-is/icons": "^0.85.0",
44
+ "@webstudio-is/react-sdk": "^0.85.0",
45
+ "@webstudio-is/sdk-components-react": "^0.85.0"
46
46
  },
47
47
  "devDependencies": {
48
- "@remix-run/react": "^1.18.1",
48
+ "@remix-run/react": "^1.19.2",
49
49
  "@types/react": "^18.2.16",
50
50
  "@types/react-dom": "^18.2.7",
51
51
  "react": "^18.2.0",
52
52
  "react-dom": "^18.2.0",
53
53
  "typescript": "5.1.6",
54
54
  "@webstudio-is/scripts": "^0.0.0",
55
- "@webstudio-is/tsconfig": "^1.0.6"
55
+ "@webstudio-is/tsconfig": "^1.0.7"
56
56
  },
57
57
  "scripts": {
58
58
  "dev": "build-package --watch",
@@ -434,9 +434,9 @@ export const props: Record<string, PropMeta> = {
434
434
  placeholder: { required: false, control: "text", type: "string" },
435
435
  prefetch: {
436
436
  required: false,
437
- control: "radio",
437
+ control: "select",
438
438
  type: "string",
439
- options: ["none", "intent", "render"],
439
+ options: ["none", "intent", "render", "viewport"],
440
440
  },
441
441
  prefix: { required: false, control: "text", type: "string" },
442
442
  preventScrollReset: { required: false, control: "boolean", type: "boolean" },
@@ -434,9 +434,9 @@ export const props: Record<string, PropMeta> = {
434
434
  placeholder: { required: false, control: "text", type: "string" },
435
435
  prefetch: {
436
436
  required: false,
437
- control: "radio",
437
+ control: "select",
438
438
  type: "string",
439
- options: ["none", "intent", "render"],
439
+ options: ["none", "intent", "render", "viewport"],
440
440
  },
441
441
  prefix: { required: false, control: "text", type: "string" },
442
442
  preventScrollReset: { required: false, control: "boolean", type: "boolean" },
package/src/form.ws.tsx CHANGED
@@ -32,15 +32,14 @@ export const meta: WsComponentMeta = {
32
32
  {
33
33
  type: "instance",
34
34
  component: "Form",
35
+ dataSources: {
36
+ formState: { type: "variable", initialValue: "initial" },
37
+ },
35
38
  props: [
36
39
  {
40
+ type: "dataSource",
37
41
  name: "state",
38
- type: "string",
39
- value: "initial",
40
- dataSourceRef: {
41
- type: "variable",
42
- name: "formState",
43
- },
42
+ dataSourceName: "formState",
44
43
  },
45
44
  ],
46
45
  children: [
@@ -48,16 +47,17 @@ export const meta: WsComponentMeta = {
48
47
  type: "instance",
49
48
  label: "Form Content",
50
49
  component: "Box",
50
+ dataSources: {
51
+ formInitial: {
52
+ type: "expression",
53
+ code: `formState === 'initial' || formState === 'error'`,
54
+ },
55
+ },
51
56
  props: [
52
57
  {
58
+ type: "dataSource",
53
59
  name: showAttribute,
54
- type: "boolean",
55
- value: false,
56
- dataSourceRef: {
57
- type: "expression",
58
- name: "formInitial",
59
- code: `formState === 'initial' || formState === 'error'`,
60
- },
60
+ dataSourceName: "formInitial",
61
61
  },
62
62
  ],
63
63
  children: [
@@ -95,16 +95,17 @@ export const meta: WsComponentMeta = {
95
95
  type: "instance",
96
96
  label: "Success Message",
97
97
  component: "Box",
98
+ dataSources: {
99
+ formSuccess: {
100
+ type: "expression",
101
+ code: `formState === 'success'`,
102
+ },
103
+ },
98
104
  props: [
99
105
  {
106
+ type: "dataSource",
100
107
  name: showAttribute,
101
- type: "boolean",
102
- value: false,
103
- dataSourceRef: {
104
- type: "expression",
105
- name: "formSuccess",
106
- code: `formState === 'success'`,
107
- },
108
+ dataSourceName: "formSuccess",
108
109
  },
109
110
  ],
110
111
  children: [
@@ -116,16 +117,17 @@ export const meta: WsComponentMeta = {
116
117
  type: "instance",
117
118
  label: "Error Message",
118
119
  component: "Box",
120
+ dataSources: {
121
+ formError: {
122
+ type: "expression",
123
+ code: `formState === 'error'`,
124
+ },
125
+ },
119
126
  props: [
120
127
  {
128
+ type: "dataSource",
121
129
  name: showAttribute,
122
- type: "boolean",
123
- value: false,
124
- dataSourceRef: {
125
- type: "expression",
126
- name: "formError",
127
- code: `formState === 'error'`,
128
- },
130
+ dataSourceName: "formError",
129
131
  },
130
132
  ],
131
133
  children: [{ type: "text", value: "Sorry, something went wrong." }],
@@ -137,5 +139,5 @@ export const meta: WsComponentMeta = {
137
139
 
138
140
  export const propsMeta: WsComponentPropsMeta = {
139
141
  props,
140
- initialProps: ["id", "state"],
142
+ initialProps: ["id", "state", "action"],
141
143
  };
@@ -11,7 +11,7 @@ type Props = Omit<ComponentPropsWithoutRef<typeof Link>, "target"> & {
11
11
  target?: "_self" | "_blank" | "_parent" | "_top";
12
12
 
13
13
  // useful remix props
14
- prefetch?: "intent" | "render" | "none";
14
+ prefetch?: "none" | "intent" | "render" | "viewport";
15
15
  reloadDocument?: boolean;
16
16
  replace?: boolean;
17
17
  preventScrollReset?: boolean;
@@ -34,7 +34,10 @@ export const wrapLinkComponent = (BaseLink: typeof Link) => {
34
34
  return <RemixLink {...props} to={to} ref={ref} />;
35
35
  }
36
36
 
37
- return <BaseLink {...props} ref={ref} />;
37
+ const { prefetch, reloadDocument, replace, preventScrollReset, ...rest } =
38
+ props;
39
+
40
+ return <BaseLink {...rest} ref={ref} />;
38
41
  });
39
42
 
40
43
  Component.displayName = BaseLink.displayName;