@webstudio-is/react-sdk 0.61.0 → 0.63.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.
- package/lib/app/custom-components/__generated__/form.props.js +412 -0
- package/lib/app/custom-components/__generated__/image.props.js +442 -0
- package/lib/app/custom-components/__generated__/link-block.props.js +432 -0
- package/lib/app/custom-components/__generated__/link.props.js +432 -0
- package/lib/app/custom-components/__generated__/rich-text-link.props.js +432 -0
- package/lib/app/custom-components/form.js +54 -0
- package/lib/app/custom-components/form.ws.js +81 -0
- package/lib/app/custom-components/index.js +10 -4
- package/lib/cjs/app/custom-components/__generated__/form.props.js +432 -0
- package/lib/cjs/app/custom-components/__generated__/image.props.js +462 -0
- package/lib/cjs/app/custom-components/__generated__/link-block.props.js +452 -0
- package/lib/cjs/app/custom-components/__generated__/link.props.js +452 -0
- package/lib/cjs/app/custom-components/__generated__/rich-text-link.props.js +452 -0
- package/lib/cjs/app/custom-components/form.js +70 -0
- package/lib/cjs/app/custom-components/form.ws.js +101 -0
- package/lib/cjs/app/custom-components/index.js +12 -6
- package/lib/cjs/components/__generated__/checkbox-field.props.js +419 -0
- package/lib/cjs/components/__generated__/checkbox.props.js +459 -0
- package/lib/cjs/components/__generated__/error-message.props.js +418 -0
- package/lib/cjs/components/__generated__/input.props.js +8 -3
- package/lib/cjs/components/__generated__/label.props.js +420 -0
- package/lib/cjs/components/__generated__/radio-button-field.props.js +419 -0
- package/lib/cjs/components/__generated__/radio-button.props.js +459 -0
- package/lib/cjs/components/__generated__/success-message.props.js +418 -0
- package/lib/cjs/components/__generated__/textarea.props.js +432 -0
- package/lib/cjs/components/blockquote.ws.js +2 -0
- package/lib/cjs/components/body.ws.js +2 -0
- package/lib/cjs/components/bold.ws.js +2 -0
- package/lib/cjs/components/box.ws.js +2 -0
- package/lib/cjs/components/button.ws.js +8 -2
- package/lib/cjs/components/checkbox-field.js +29 -0
- package/lib/cjs/components/checkbox-field.ws.js +55 -0
- package/lib/cjs/components/checkbox.js +29 -0
- package/lib/cjs/components/checkbox.ws.js +57 -0
- package/lib/cjs/components/code.ws.js +2 -0
- package/lib/cjs/components/component-meta.js +13 -1
- package/lib/cjs/components/components-utils.js +9 -1
- package/lib/cjs/components/components.js +17 -1
- package/lib/cjs/components/error-message.js +29 -0
- package/lib/cjs/components/error-message.ws.js +40 -0
- package/lib/cjs/components/form.js +1 -1
- package/lib/cjs/components/form.ws.js +27 -6
- package/lib/cjs/components/heading.ws.js +2 -0
- package/lib/cjs/components/image.ws.js +2 -0
- package/lib/cjs/components/index.js +43 -2
- package/lib/cjs/components/input.ws.js +17 -3
- package/lib/cjs/components/italic.ws.js +2 -0
- package/lib/cjs/components/label.js +29 -0
- package/lib/cjs/components/label.ws.js +56 -0
- package/lib/cjs/components/link-block.ws.js +1 -1
- package/lib/cjs/components/link.ws.js +13 -1
- package/lib/cjs/components/list-item.ws.js +3 -0
- package/lib/cjs/components/list.ws.js +2 -0
- package/lib/cjs/components/paragraph.ws.js +2 -0
- package/lib/cjs/components/radio-button-field.js +29 -0
- package/lib/cjs/components/radio-button-field.ws.js +55 -0
- package/lib/cjs/components/radio-button.js +29 -0
- package/lib/cjs/components/radio-button.ws.js +57 -0
- package/lib/cjs/components/separator.ws.js +2 -0
- package/lib/cjs/components/span.ws.js +2 -0
- package/lib/cjs/components/subscript.ws.js +2 -0
- package/lib/cjs/components/success-message.js +29 -0
- package/lib/cjs/components/success-message.ws.js +40 -0
- package/lib/cjs/components/superscript.ws.js +2 -0
- package/lib/cjs/components/text-block.ws.js +2 -0
- package/lib/cjs/components/textarea.js +29 -0
- package/lib/cjs/components/textarea.ws.js +58 -0
- package/lib/cjs/css/normalize.js +3 -1
- package/lib/cjs/css/presets.js +19 -1
- package/lib/cjs/index.js +2 -1
- package/lib/components/__generated__/checkbox-field.props.js +399 -0
- package/lib/components/__generated__/checkbox.props.js +439 -0
- package/lib/components/__generated__/error-message.props.js +398 -0
- package/lib/components/__generated__/input.props.js +8 -3
- package/lib/components/__generated__/label.props.js +400 -0
- package/lib/components/__generated__/radio-button-field.props.js +399 -0
- package/lib/components/__generated__/radio-button.props.js +439 -0
- package/lib/components/__generated__/success-message.props.js +398 -0
- package/lib/components/__generated__/textarea.props.js +412 -0
- package/lib/components/blockquote.ws.js +4 -0
- package/lib/components/body.ws.js +4 -0
- package/lib/components/bold.ws.js +4 -0
- package/lib/components/box.ws.js +4 -0
- package/lib/components/button.ws.js +10 -2
- package/lib/components/checkbox-field.js +9 -0
- package/lib/components/checkbox-field.ws.js +37 -0
- package/lib/components/checkbox.js +9 -0
- package/lib/components/checkbox.ws.js +39 -0
- package/lib/components/code.ws.js +4 -0
- package/lib/components/component-meta.js +13 -1
- package/lib/components/components-utils.js +9 -1
- package/lib/components/components.js +17 -1
- package/lib/components/error-message.js +9 -0
- package/lib/components/error-message.ws.js +20 -0
- package/lib/components/form.js +1 -1
- package/lib/components/form.ws.js +29 -6
- package/lib/components/heading.ws.js +4 -0
- package/lib/components/image.ws.js +4 -0
- package/lib/components/index.js +43 -2
- package/lib/components/input.ws.js +19 -3
- package/lib/components/italic.ws.js +4 -0
- package/lib/components/label.js +9 -0
- package/lib/components/label.ws.js +38 -0
- package/lib/components/link-block.ws.js +2 -2
- package/lib/components/link.ws.js +15 -1
- package/lib/components/list-item.ws.js +5 -0
- package/lib/components/list.ws.js +4 -0
- package/lib/components/paragraph.ws.js +4 -0
- package/lib/components/radio-button-field.js +9 -0
- package/lib/components/radio-button-field.ws.js +37 -0
- package/lib/components/radio-button.js +9 -0
- package/lib/components/radio-button.ws.js +39 -0
- package/lib/components/separator.ws.js +4 -0
- package/lib/components/span.ws.js +4 -0
- package/lib/components/subscript.ws.js +4 -0
- package/lib/components/success-message.js +9 -0
- package/lib/components/success-message.ws.js +20 -0
- package/lib/components/superscript.ws.js +4 -0
- package/lib/components/text-block.ws.js +4 -0
- package/lib/components/textarea.js +9 -0
- package/lib/components/textarea.ws.js +40 -0
- package/lib/css/normalize.js +4 -2
- package/lib/css/presets.js +19 -1
- package/lib/index.js +4 -2
- package/lib/types/app/custom-components/__generated__/form.props.d.ts +2 -0
- package/lib/types/app/custom-components/__generated__/image.props.d.ts +2 -0
- package/lib/types/app/custom-components/__generated__/link-block.props.d.ts +2 -0
- package/lib/types/app/custom-components/__generated__/link.props.d.ts +2 -0
- package/lib/types/app/custom-components/__generated__/rich-text-link.props.d.ts +2 -0
- package/lib/types/app/custom-components/form.d.ts +5 -0
- package/lib/types/app/custom-components/form.ws.d.ts +3 -0
- package/lib/types/app/custom-components/index.d.ts +6 -1
- package/lib/types/components/__generated__/checkbox-field.props.d.ts +2 -0
- package/lib/types/components/__generated__/checkbox.props.d.ts +2 -0
- package/lib/types/components/__generated__/error-message.props.d.ts +2 -0
- package/lib/types/components/__generated__/label.props.d.ts +2 -0
- package/lib/types/components/__generated__/radio-button-field.props.d.ts +2 -0
- package/lib/types/components/__generated__/radio-button.props.d.ts +2 -0
- package/lib/types/components/__generated__/success-message.props.d.ts +2 -0
- package/lib/types/components/__generated__/textarea.props.d.ts +2 -0
- package/lib/types/components/blockquote.ws.d.ts +1 -1
- package/lib/types/components/body.ws.d.ts +1 -1
- package/lib/types/components/bold.ws.d.ts +1 -1
- package/lib/types/components/box.ws.d.ts +1 -1
- package/lib/types/components/button.ws.d.ts +1 -1
- package/lib/types/components/checkbox-field.d.ts +3 -0
- package/lib/types/components/checkbox-field.ws.d.ts +3 -0
- package/lib/types/components/checkbox.d.ts +3 -0
- package/lib/types/components/checkbox.ws.d.ts +3 -0
- package/lib/types/components/code.ws.d.ts +1 -1
- package/lib/types/components/component-meta.d.ts +17 -4
- package/lib/types/components/components-utils.d.ts +5 -20
- package/lib/types/components/components.d.ts +8 -0
- package/lib/types/components/error-message.d.ts +3 -0
- package/lib/types/components/error-message.ws.d.ts +3 -0
- package/lib/types/components/form.ws.d.ts +1 -1
- package/lib/types/components/heading.ws.d.ts +1 -1
- package/lib/types/components/image.ws.d.ts +1 -1
- package/lib/types/components/index.d.ts +1 -0
- package/lib/types/components/input.d.ts +3 -1
- package/lib/types/components/input.stories.d.ts +6 -2
- package/lib/types/components/input.ws.d.ts +1 -1
- package/lib/types/components/italic.ws.d.ts +1 -1
- package/lib/types/components/label.d.ts +3 -0
- package/lib/types/components/label.ws.d.ts +3 -0
- package/lib/types/components/link.ws.d.ts +1 -1
- package/lib/types/components/list-item.ws.d.ts +1 -1
- package/lib/types/components/list.ws.d.ts +1 -1
- package/lib/types/components/paragraph.ws.d.ts +1 -1
- package/lib/types/components/radio-button-field.d.ts +3 -0
- package/lib/types/components/radio-button-field.ws.d.ts +3 -0
- package/lib/types/components/radio-button.d.ts +3 -0
- package/lib/types/components/radio-button.ws.d.ts +3 -0
- package/lib/types/components/separator.ws.d.ts +1 -1
- package/lib/types/components/span.ws.d.ts +1 -1
- package/lib/types/components/subscript.ws.d.ts +1 -1
- package/lib/types/components/success-message.d.ts +3 -0
- package/lib/types/components/success-message.ws.d.ts +3 -0
- package/lib/types/components/superscript.ws.d.ts +1 -1
- package/lib/types/components/text-block.ws.d.ts +1 -1
- package/lib/types/components/textarea.d.ts +3 -0
- package/lib/types/components/textarea.ws.d.ts +3 -0
- package/lib/types/css/normalize.d.ts +239 -46
- package/lib/types/css/presets.d.ts +3 -2
- package/lib/types/css/style-rules.d.ts +1 -1
- package/lib/types/embed-template.d.ts +4 -4
- package/lib/types/index.d.ts +1 -1
- package/package.json +12 -12
- package/src/app/custom-components/__generated__/form.props.ts +457 -0
- package/src/app/custom-components/__generated__/image.props.ts +487 -0
- package/src/app/custom-components/__generated__/link-block.props.ts +477 -0
- package/src/app/custom-components/__generated__/link.props.ts +477 -0
- package/src/app/custom-components/__generated__/rich-text-link.props.ts +477 -0
- package/src/app/custom-components/form.tsx +94 -0
- package/src/app/custom-components/form.ws.tsx +86 -0
- package/src/app/custom-components/index.ts +9 -4
- package/src/components/__generated__/checkbox-field.props.ts +444 -0
- package/src/components/__generated__/checkbox.props.ts +484 -0
- package/src/components/__generated__/error-message.props.ts +443 -0
- package/src/components/__generated__/input.props.ts +8 -3
- package/src/components/__generated__/label.props.ts +445 -0
- package/src/components/__generated__/radio-button-field.props.ts +444 -0
- package/src/components/__generated__/radio-button.props.ts +484 -0
- package/src/components/__generated__/success-message.props.ts +443 -0
- package/src/components/__generated__/textarea.props.ts +457 -0
- package/src/components/blockquote.ws.tsx +6 -4
- package/src/components/body.ws.tsx +6 -4
- package/src/components/bold.ws.tsx +6 -4
- package/src/components/box.ws.ts +6 -4
- package/src/components/button.ws.tsx +11 -5
- package/src/components/checkbox-field.tsx +10 -0
- package/src/components/checkbox-field.ws.tsx +40 -0
- package/src/components/checkbox.tsx +13 -0
- package/src/components/checkbox.ws.tsx +42 -0
- package/src/components/code.ws.tsx +6 -4
- package/src/components/component-meta.ts +12 -0
- package/src/components/components-utils.ts +16 -10
- package/src/components/components.ts +8 -0
- package/src/components/error-message.tsx +10 -0
- package/src/components/error-message.ws.tsx +24 -0
- package/src/components/form.tsx +5 -1
- package/src/components/form.ws.tsx +30 -9
- package/src/components/heading.ws.tsx +6 -4
- package/src/components/image.ws.tsx +6 -4
- package/src/components/index.ts +47 -0
- package/src/components/input.tsx +3 -1
- package/src/components/input.ws.tsx +19 -5
- package/src/components/italic.ws.tsx +6 -4
- package/src/components/label.tsx +10 -0
- package/src/components/label.ws.tsx +41 -0
- package/src/components/link-block.ws.tsx +2 -2
- package/src/components/link.ws.tsx +17 -5
- package/src/components/list-item.ws.tsx +7 -4
- package/src/components/list.ws.tsx +6 -4
- package/src/components/paragraph.ws.tsx +6 -4
- package/src/components/radio-button-field.tsx +10 -0
- package/src/components/radio-button-field.ws.tsx +40 -0
- package/src/components/radio-button.tsx +13 -0
- package/src/components/radio-button.ws.tsx +42 -0
- package/src/components/separator.ws.tsx +6 -4
- package/src/components/span.ws.tsx +6 -4
- package/src/components/subscript.ws.tsx +6 -4
- package/src/components/success-message.tsx +10 -0
- package/src/components/success-message.ws.tsx +24 -0
- package/src/components/superscript.ws.tsx +6 -4
- package/src/components/text-block.ws.tsx +6 -4
- package/src/components/textarea.tsx +13 -0
- package/src/components/textarea.ws.tsx +43 -0
- package/src/css/normalize.ts +21 -18
- package/src/css/presets.ts +20 -2
- package/src/index.ts +1 -0
|
@@ -1,4 +1,7 @@
|
|
|
1
1
|
import { TextBlockIcon } from "@webstudio-is/icons";
|
|
2
|
+
import {
|
|
3
|
+
defaultStates
|
|
4
|
+
} from "./component-meta";
|
|
2
5
|
import { props } from "./__generated__/text-block.props";
|
|
3
6
|
import { div } from "../css/normalize";
|
|
4
7
|
const presetStyle = {
|
|
@@ -15,6 +18,7 @@ const meta = {
|
|
|
15
18
|
type: "rich-text",
|
|
16
19
|
label: "Text Block",
|
|
17
20
|
Icon: TextBlockIcon,
|
|
21
|
+
states: defaultStates,
|
|
18
22
|
presetStyle,
|
|
19
23
|
children: [{ type: "text", value: "Block of text you can edit" }]
|
|
20
24
|
};
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { jsx } from "react/jsx-runtime";
|
|
2
|
+
import { forwardRef } from "react";
|
|
3
|
+
const defaultTag = "textarea";
|
|
4
|
+
const Textarea = forwardRef(({ children: _children, ...props }, ref) => /* @__PURE__ */ jsx("textarea", { ...props, ref }));
|
|
5
|
+
Textarea.displayName = "Textarea";
|
|
6
|
+
export {
|
|
7
|
+
Textarea,
|
|
8
|
+
defaultTag
|
|
9
|
+
};
|
|
@@ -0,0 +1,40 @@
|
|
|
1
|
+
import { FormTextAreaIcon } from "@webstudio-is/icons";
|
|
2
|
+
import { textarea } from "../css/normalize";
|
|
3
|
+
import {
|
|
4
|
+
defaultStates
|
|
5
|
+
} from "./component-meta";
|
|
6
|
+
import { props } from "./__generated__/textarea.props";
|
|
7
|
+
const presetStyle = {
|
|
8
|
+
textarea: [
|
|
9
|
+
...textarea,
|
|
10
|
+
// resize doesn't work well while on canvas
|
|
11
|
+
{ property: "resize", value: { type: "keyword", value: "none" } }
|
|
12
|
+
]
|
|
13
|
+
};
|
|
14
|
+
const meta = {
|
|
15
|
+
category: "forms",
|
|
16
|
+
type: "control",
|
|
17
|
+
label: "Text Area",
|
|
18
|
+
Icon: FormTextAreaIcon,
|
|
19
|
+
presetStyle,
|
|
20
|
+
states: [
|
|
21
|
+
...defaultStates,
|
|
22
|
+
{ selector: "::placeholder", label: "Placeholder" },
|
|
23
|
+
{ selector: ":valid", label: "Valid" },
|
|
24
|
+
{ selector: ":invalid", label: "Invalid" },
|
|
25
|
+
{ selector: ":required", label: "Required" },
|
|
26
|
+
{ selector: ":optional", label: "Optional" },
|
|
27
|
+
{ selector: ":disabled", label: "Disabled" },
|
|
28
|
+
{ selector: ":enabled", label: "Enabled" },
|
|
29
|
+
{ selector: ":read-only", label: "Read Only" },
|
|
30
|
+
{ selector: ":read-write", label: "Read Write" }
|
|
31
|
+
]
|
|
32
|
+
};
|
|
33
|
+
const propsMeta = {
|
|
34
|
+
props,
|
|
35
|
+
initialProps: ["name", "placeholder", "required", "autoFocus"]
|
|
36
|
+
};
|
|
37
|
+
export {
|
|
38
|
+
meta,
|
|
39
|
+
propsMeta
|
|
40
|
+
};
|
package/lib/css/normalize.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { borders } from "./presets";
|
|
1
|
+
import { borders, linkColors } from "./presets";
|
|
2
2
|
const boxSizing = {
|
|
3
3
|
property: "boxSizing",
|
|
4
4
|
value: { type: "keyword", value: "border-box" }
|
|
@@ -15,6 +15,7 @@ const main = baseStyle;
|
|
|
15
15
|
const nav = baseStyle;
|
|
16
16
|
const section = baseStyle;
|
|
17
17
|
const form = baseStyle;
|
|
18
|
+
const label = baseStyle;
|
|
18
19
|
const h1 = baseStyle;
|
|
19
20
|
const h2 = baseStyle;
|
|
20
21
|
const h3 = baseStyle;
|
|
@@ -23,7 +24,7 @@ const h5 = baseStyle;
|
|
|
23
24
|
const h6 = baseStyle;
|
|
24
25
|
const i = baseStyle;
|
|
25
26
|
const img = baseStyle;
|
|
26
|
-
const a =
|
|
27
|
+
const a = [boxSizing, ...borders, ...linkColors];
|
|
27
28
|
const li = baseStyle;
|
|
28
29
|
const ul = baseStyle;
|
|
29
30
|
const ol = baseStyle;
|
|
@@ -295,6 +296,7 @@ export {
|
|
|
295
296
|
img,
|
|
296
297
|
input,
|
|
297
298
|
kbd,
|
|
299
|
+
label,
|
|
298
300
|
legend,
|
|
299
301
|
li,
|
|
300
302
|
main,
|
package/lib/css/presets.js
CHANGED
|
@@ -16,6 +16,24 @@ const borders = [
|
|
|
16
16
|
value: { type: "unit", value: 1, unit: "px" }
|
|
17
17
|
}
|
|
18
18
|
];
|
|
19
|
+
const linkColors = [
|
|
20
|
+
{
|
|
21
|
+
property: "color",
|
|
22
|
+
value: { type: "rgb", r: 0, g: 0, b: 238, alpha: 1 }
|
|
23
|
+
},
|
|
24
|
+
{
|
|
25
|
+
state: ":active",
|
|
26
|
+
property: "color",
|
|
27
|
+
// chrome and safari use rgb(255, 0, 0)
|
|
28
|
+
value: { type: "rgb", r: 238, g: 0, b: 0, alpha: 1 }
|
|
29
|
+
},
|
|
30
|
+
{
|
|
31
|
+
state: ":visited",
|
|
32
|
+
property: "color",
|
|
33
|
+
value: { type: "rgb", r: 85, g: 26, b: 139, alpha: 1 }
|
|
34
|
+
}
|
|
35
|
+
];
|
|
19
36
|
export {
|
|
20
|
-
borders
|
|
37
|
+
borders,
|
|
38
|
+
linkColors
|
|
21
39
|
};
|
package/lib/index.js
CHANGED
|
@@ -11,12 +11,14 @@ import {
|
|
|
11
11
|
customComponentPropsMetas
|
|
12
12
|
} from "./app/custom-components";
|
|
13
13
|
import {
|
|
14
|
-
componentCategories
|
|
14
|
+
componentCategories,
|
|
15
|
+
stateCategories
|
|
15
16
|
} from "./components/component-meta";
|
|
16
17
|
export * from "./embed-template";
|
|
17
18
|
export {
|
|
18
19
|
componentCategories,
|
|
19
20
|
customComponentMetas,
|
|
20
21
|
customComponentPropsMetas,
|
|
21
|
-
customComponents
|
|
22
|
+
customComponents,
|
|
23
|
+
stateCategories
|
|
22
24
|
};
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
export declare const defaultTag = "form";
|
|
3
|
+
export declare const Form: import("react").ForwardRefExoticComponent<Omit<import("react").ClassAttributes<HTMLFormElement> & import("react").FormHTMLAttributes<HTMLFormElement> & {
|
|
4
|
+
initialState?: "error" | "initial" | "success" | undefined;
|
|
5
|
+
}, "ref"> & import("react").RefAttributes<HTMLFormElement>>;
|
|
@@ -21,6 +21,11 @@ export declare const customComponents: {
|
|
|
21
21
|
target?: "_self" | "_blank" | "_parent" | "_top" | undefined;
|
|
22
22
|
prefetch?: "none" | "intent" | "render" | undefined;
|
|
23
23
|
}, "ref"> & import("react").RefAttributes<HTMLAnchorElement>>;
|
|
24
|
+
Form: import("react").ForwardRefExoticComponent<Omit<import("react").ClassAttributes<HTMLFormElement> & import("react").FormHTMLAttributes<HTMLFormElement> & {
|
|
25
|
+
initialState?: "error" | "initial" | "success" | undefined;
|
|
26
|
+
}, "ref"> & import("react").RefAttributes<HTMLFormElement>>;
|
|
24
27
|
};
|
|
25
28
|
export declare const customComponentPropsMetas: Record<string, WsComponentPropsMeta>;
|
|
26
|
-
export declare const customComponentMetas: {
|
|
29
|
+
export declare const customComponentMetas: {
|
|
30
|
+
Form: import("../../components/component-meta").WsComponentMeta;
|
|
31
|
+
};
|
|
@@ -0,0 +1,3 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
export declare const defaultTag = "label";
|
|
3
|
+
export declare const CheckboxField: import("react").ForwardRefExoticComponent<Omit<Omit<import("react").DetailedHTMLProps<import("react").LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, "htmlFor">, "ref"> & import("react").RefAttributes<HTMLLabelElement>>;
|
|
@@ -0,0 +1,3 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
export declare const defaultTag = "input";
|
|
3
|
+
export declare const Checkbox: import("react").ForwardRefExoticComponent<Omit<Omit<import("react").DetailedHTMLProps<import("react").InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "type">, "ref"> & import("react").RefAttributes<HTMLInputElement>>;
|
|
@@ -581,30 +581,39 @@ declare const WsComponentPropsMeta: z.ZodObject<{
|
|
|
581
581
|
}>;
|
|
582
582
|
export type WsComponentPropsMeta = z.infer<typeof WsComponentPropsMeta>;
|
|
583
583
|
export declare const componentCategories: readonly ["general", "typography", "media", "forms"];
|
|
584
|
+
export declare const stateCategories: readonly ["states", "component-states"];
|
|
584
585
|
export declare const ComponentState: z.ZodObject<{
|
|
586
|
+
category: z.ZodOptional<z.ZodEnum<["states", "component-states"]>>;
|
|
585
587
|
selector: z.ZodString;
|
|
586
588
|
label: z.ZodString;
|
|
587
589
|
}, "strip", z.ZodTypeAny, {
|
|
590
|
+
category?: "states" | "component-states" | undefined;
|
|
588
591
|
label: string;
|
|
589
592
|
selector: string;
|
|
590
593
|
}, {
|
|
594
|
+
category?: "states" | "component-states" | undefined;
|
|
591
595
|
label: string;
|
|
592
596
|
selector: string;
|
|
593
597
|
}>;
|
|
594
598
|
export type ComponentState = z.infer<typeof ComponentState>;
|
|
599
|
+
export declare const defaultStates: ComponentState[];
|
|
595
600
|
declare const WsComponentMeta: z.ZodObject<{
|
|
596
601
|
category: z.ZodOptional<z.ZodEnum<["general", "typography", "media", "forms"]>>;
|
|
597
602
|
type: z.ZodEnum<["container", "control", "embed", "rich-text", "rich-text-child"]>;
|
|
603
|
+
acceptedParents: z.ZodOptional<z.ZodArray<z.ZodString, "many">>;
|
|
598
604
|
label: z.ZodString;
|
|
599
605
|
Icon: z.ZodFunction<z.ZodTuple<[], z.ZodUnknown>, z.ZodUnknown>;
|
|
600
606
|
presetStyle: z.ZodOptional<z.ZodAny>;
|
|
601
607
|
states: z.ZodOptional<z.ZodArray<z.ZodObject<{
|
|
608
|
+
category: z.ZodOptional<z.ZodEnum<["states", "component-states"]>>;
|
|
602
609
|
selector: z.ZodString;
|
|
603
610
|
label: z.ZodString;
|
|
604
611
|
}, "strip", z.ZodTypeAny, {
|
|
612
|
+
category?: "states" | "component-states" | undefined;
|
|
605
613
|
label: string;
|
|
606
614
|
selector: string;
|
|
607
615
|
}, {
|
|
616
|
+
category?: "states" | "component-states" | undefined;
|
|
608
617
|
label: string;
|
|
609
618
|
selector: string;
|
|
610
619
|
}>, "many">>;
|
|
@@ -623,12 +632,14 @@ declare const WsComponentMeta: z.ZodObject<{
|
|
|
623
632
|
type: "text";
|
|
624
633
|
value: string;
|
|
625
634
|
} | import("../embed-template").EmbedTemplateInstance)[] | undefined;
|
|
626
|
-
category?: "media" | "general" | "typography" | "forms" | undefined;
|
|
627
|
-
presetStyle?: any;
|
|
628
635
|
states?: {
|
|
636
|
+
category?: "states" | "component-states" | undefined;
|
|
629
637
|
label: string;
|
|
630
638
|
selector: string;
|
|
631
639
|
}[] | undefined;
|
|
640
|
+
category?: "media" | "general" | "typography" | "forms" | undefined;
|
|
641
|
+
acceptedParents?: string[] | undefined;
|
|
642
|
+
presetStyle?: any;
|
|
632
643
|
type: "embed" | "control" | "container" | "rich-text" | "rich-text-child";
|
|
633
644
|
label: string;
|
|
634
645
|
Icon: (...args: unknown[]) => unknown;
|
|
@@ -637,12 +648,14 @@ declare const WsComponentMeta: z.ZodObject<{
|
|
|
637
648
|
type: "text";
|
|
638
649
|
value: string;
|
|
639
650
|
} | import("../embed-template").EmbedTemplateInstance)[] | undefined;
|
|
640
|
-
category?: "media" | "general" | "typography" | "forms" | undefined;
|
|
641
|
-
presetStyle?: any;
|
|
642
651
|
states?: {
|
|
652
|
+
category?: "states" | "component-states" | undefined;
|
|
643
653
|
label: string;
|
|
644
654
|
selector: string;
|
|
645
655
|
}[] | undefined;
|
|
656
|
+
category?: "media" | "general" | "typography" | "forms" | undefined;
|
|
657
|
+
acceptedParents?: string[] | undefined;
|
|
658
|
+
presetStyle?: any;
|
|
646
659
|
type: "embed" | "control" | "container" | "rich-text" | "rich-text-child";
|
|
647
660
|
label: string;
|
|
648
661
|
Icon: (...args: unknown[]) => unknown;
|
|
@@ -1,34 +1,19 @@
|
|
|
1
|
-
|
|
1
|
+
import type { forwardRef } from "react";
|
|
2
2
|
import * as components from "./components";
|
|
3
3
|
export type ComponentName = keyof typeof components;
|
|
4
4
|
export declare const getComponentNames: () => ComponentName[];
|
|
5
|
+
type AnyComponent = ReturnType<typeof forwardRef<any, any>>;
|
|
5
6
|
/**
|
|
6
7
|
* Now used only in builder app
|
|
7
8
|
* @todo Consider using the same approach in the builder app as in the published apps . A dynamic import is needed
|
|
8
9
|
*/
|
|
9
|
-
export declare const getComponent: (name: string) => undefined |
|
|
10
|
+
export declare const getComponent: (name: string) => undefined | AnyComponent;
|
|
10
11
|
/**
|
|
11
12
|
* The application imports only the components it uses, then pass them to createGetComponent i.e.
|
|
12
13
|
* getComponent = createGetComponent({ Box, BlaBla })
|
|
13
14
|
* <RootInstance data={data} getComponent={getComponent} />
|
|
14
15
|
* see example /packages/sdk-size-test/app/routes/$.tsx
|
|
15
16
|
**/
|
|
16
|
-
export declare const createGetComponent: (comps: Partial<typeof components>) => (name: string) =>
|
|
17
|
-
children?: import("react").ReactNode;
|
|
18
|
-
} & import("react").RefAttributes<HTMLDivElement>> | import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLBodyElement>, HTMLBodyElement>, "ref"> & import("react").RefAttributes<HTMLBodyElement>> | import("react").ForwardRefExoticComponent<Omit<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & {
|
|
19
|
-
tag?: "address" | "article" | "aside" | "div" | "figure" | "footer" | "header" | "main" | "nav" | "section" | undefined;
|
|
20
|
-
}, "ref"> & import("react").RefAttributes<HTMLDivElement>> | import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>> | import("react").ForwardRefExoticComponent<Omit<import("react").ClassAttributes<HTMLHeadingElement> & import("react").HTMLAttributes<HTMLHeadingElement> & {
|
|
21
|
-
tag?: "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | undefined;
|
|
22
|
-
}, "ref"> & import("react").RefAttributes<HTMLHeadingElement>> | import("react").ForwardRefExoticComponent<Omit<Omit<import("react").DetailedHTMLProps<import("react").AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, "href" | "target"> & {
|
|
23
|
-
href?: string | undefined;
|
|
24
|
-
target?: "_self" | "_blank" | "_parent" | "_top" | undefined;
|
|
25
|
-
prefetch?: "none" | "intent" | "render" | undefined;
|
|
26
|
-
}, "ref"> & import("react").RefAttributes<HTMLAnchorElement>> | import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & import("react").RefAttributes<HTMLSpanElement>> | import("react").ForwardRefExoticComponent<Omit<import("react").ClassAttributes<HTMLButtonElement> & import("react").ButtonHTMLAttributes<HTMLButtonElement> & {
|
|
27
|
-
innerText?: string | undefined;
|
|
28
|
-
}, "ref"> & import("react").RefAttributes<HTMLButtonElement>> | import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref"> & import("react").RefAttributes<HTMLInputElement>> | import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").FormHTMLAttributes<HTMLFormElement>, HTMLFormElement>, "ref"> & import("react").RefAttributes<HTMLFormElement>> | import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, "ref"> & import("react").RefAttributes<HTMLImageElement>> | import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").BlockquoteHTMLAttributes<HTMLQuoteElement>, HTMLQuoteElement>, "ref"> & import("react").RefAttributes<HTMLQuoteElement>> | import("react").ForwardRefExoticComponent<Omit<import("react").ClassAttributes<HTMLUListElement> & import("react").HTMLAttributes<HTMLUListElement> & import("react").ClassAttributes<HTMLOListElement> & import("react").OlHTMLAttributes<HTMLOListElement> & {
|
|
29
|
-
ordered?: boolean | undefined;
|
|
30
|
-
}, "ref"> & import("react").RefAttributes<HTMLUListElement>> | import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, "ref"> & import("react").RefAttributes<HTMLLIElement>> | import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLHRElement>, HTMLHRElement>, "ref"> & import("react").RefAttributes<HTMLHRElement>> | import("react").ForwardRefExoticComponent<Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, "inline"> & {
|
|
31
|
-
inline?: boolean | undefined;
|
|
32
|
-
meta?: string | undefined;
|
|
33
|
-
}, "ref"> & import("react").RefAttributes<HTMLElement>> | undefined;
|
|
17
|
+
export declare const createGetComponent: (comps: Partial<typeof components>) => (name: string) => undefined | AnyComponent;
|
|
34
18
|
export type GetComponent = typeof getComponent;
|
|
19
|
+
export {};
|
|
@@ -29,3 +29,11 @@ export { List } from "./list";
|
|
|
29
29
|
export { ListItem } from "./list-item";
|
|
30
30
|
export { Separator } from "./separator";
|
|
31
31
|
export { Code } from "./code";
|
|
32
|
+
export { Label } from "./label";
|
|
33
|
+
export { SuccessMessage } from "./success-message";
|
|
34
|
+
export { ErrorMessage } from "./error-message";
|
|
35
|
+
export { Textarea } from "./textarea";
|
|
36
|
+
export { RadioButtonField } from "./radio-button-field";
|
|
37
|
+
export { RadioButton } from "./radio-button";
|
|
38
|
+
export { CheckboxField } from "./checkbox-field";
|
|
39
|
+
export { Checkbox } from "./checkbox";
|
|
@@ -0,0 +1,3 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
export declare const defaultTag = "div";
|
|
3
|
+
export declare const ErrorMessage: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
|
|
@@ -14,4 +14,5 @@ export declare let registeredComponents: RegisteredComponents | undefined;
|
|
|
14
14
|
* break otherwise, see getComponent etc. So its overwriteComponent now
|
|
15
15
|
**/
|
|
16
16
|
export declare const registerComponents: (components: RegisteredComponents) => void;
|
|
17
|
+
export declare const canAcceptComponent: (parentComponent: string, childComponent: string) => boolean;
|
|
17
18
|
export {};
|
|
@@ -1,3 +1,5 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
export declare const defaultTag = "input";
|
|
3
|
-
export declare const Input: import("react").ForwardRefExoticComponent<Omit<import("react").
|
|
3
|
+
export declare const Input: import("react").ForwardRefExoticComponent<Omit<import("react").ClassAttributes<HTMLInputElement> & import("react").InputHTMLAttributes<HTMLInputElement> & {
|
|
4
|
+
type?: "number" | "text" | "email" | "url" | "tel" | "password" | undefined;
|
|
5
|
+
}, "ref"> & import("react").RefAttributes<HTMLInputElement>>;
|
|
@@ -1,5 +1,9 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
import type { ComponentStory, ComponentMeta } from "@storybook/react";
|
|
3
|
-
declare const _default: ComponentMeta<import("react").ForwardRefExoticComponent<Omit<import("react").
|
|
3
|
+
declare const _default: ComponentMeta<import("react").ForwardRefExoticComponent<Omit<import("react").ClassAttributes<HTMLInputElement> & import("react").InputHTMLAttributes<HTMLInputElement> & {
|
|
4
|
+
type?: "number" | "text" | "email" | "url" | "tel" | "password" | undefined;
|
|
5
|
+
}, "ref"> & import("react").RefAttributes<HTMLInputElement>>>;
|
|
4
6
|
export default _default;
|
|
5
|
-
export declare const Input: ComponentStory<import("react").ForwardRefExoticComponent<Omit<import("react").
|
|
7
|
+
export declare const Input: ComponentStory<import("react").ForwardRefExoticComponent<Omit<import("react").ClassAttributes<HTMLInputElement> & import("react").InputHTMLAttributes<HTMLInputElement> & {
|
|
8
|
+
type?: "number" | "text" | "email" | "url" | "tel" | "password" | undefined;
|
|
9
|
+
}, "ref"> & import("react").RefAttributes<HTMLInputElement>>>;
|
|
@@ -0,0 +1,3 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
export declare const defaultTag = "label";
|
|
3
|
+
export declare const Label: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, "ref"> & import("react").RefAttributes<HTMLLabelElement>>;
|
|
@@ -0,0 +1,3 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
export declare const defaultTag = "label";
|
|
3
|
+
export declare const RadioButtonField: import("react").ForwardRefExoticComponent<Omit<Omit<import("react").DetailedHTMLProps<import("react").LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, "htmlFor">, "ref"> & import("react").RefAttributes<HTMLLabelElement>>;
|
|
@@ -0,0 +1,3 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
export declare const defaultTag = "input";
|
|
3
|
+
export declare const RadioButton: import("react").ForwardRefExoticComponent<Omit<Omit<import("react").DetailedHTMLProps<import("react").InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "type">, "ref"> & import("react").RefAttributes<HTMLInputElement>>;
|
|
@@ -0,0 +1,3 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
export declare const defaultTag = "div";
|
|
3
|
+
export declare const SuccessMessage: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
|
|
@@ -0,0 +1,3 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
export declare const defaultTag = "textarea";
|
|
3
|
+
export declare const Textarea: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").TextareaHTMLAttributes<HTMLTextAreaElement>, HTMLTextAreaElement>, "ref"> & import("react").RefAttributes<HTMLTextAreaElement>>;
|