@metamask/snaps-sdk 6.2.1 → 6.4.0

package/dist/jsx/components/Value.cjs

@@ -0,0 +1,21 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Value = void 0;
+const component_1 = require("../component.cjs");
+const TYPE = 'Value';
+/**
+ * A value component, which can be used to display two different text values side by side.
+ *
+ * This component can only be used as a child of the {@link Row} component.
+ *
+ * This component does not accept any children.
+ *
+ * @param props - The props of the component.
+ * @param props.value - The value shown on the right side.
+ * @param props.extra - The extra text shown on the left side.
+ * @returns A value element.
+ * @example
+ * <Value value="0.05 ETH" extra="$200" />
+ */
+exports.Value = (0, component_1.createSnapComponent)(TYPE);
+//# sourceMappingURL=Value.cjs.map

package/dist/jsx/components/Value.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Value.cjs","sourceRoot":"","sources":["../../../src/jsx/components/Value.ts"],"names":[],"mappings":";;;AAAA,gDAAmD;AAanD,MAAM,IAAI,GAAG,OAAO,CAAC;AAErB;;;;;;;;;;;;;GAaG;AACU,QAAA,KAAK,GAAG,IAAA,+BAAmB,EAA0B,IAAI,CAAC,CAAC","sourcesContent":["import { createSnapComponent } from '../component';\n\n/**\n * The props of the {@link Value} component.\n *\n * @property value - The value shown on the right side.\n * @property extra - The extra text shown on the left side.\n */\nexport type ValueProps = {\n  value: string;\n  extra: string;\n};\n\nconst TYPE = 'Value';\n\n/**\n * A value component, which can be used to display two different text values side by side.\n *\n * This component can only be used as a child of the {@link Row} component.\n *\n * This component does not accept any children.\n *\n * @param props - The props of the component.\n * @param props.value - The value shown on the right side.\n * @param props.extra - The extra text shown on the left side.\n * @returns A value element.\n * @example\n * <Value value=\"0.05 ETH\" extra=\"$200\" />\n */\nexport const Value = createSnapComponent<ValueProps, typeof TYPE>(TYPE);\n\n/**\n * A value element.\n *\n * @see Value\n */\nexport type ValueElement = ReturnType<typeof Value>;\n"]}

package/dist/{types/jsx/components/Value.d.ts → jsx/components/Value.d.cts}

@@ -29,3 +29,4 @@ export declare const Value: import("../component").SnapComponent<ValueProps, "Va
  * @see Value
  */
 export type ValueElement = ReturnType<typeof Value>;
+//# sourceMappingURL=Value.d.cts.map

package/dist/jsx/components/Value.d.cts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Value.d.cts","sourceRoot":"","sources":["../../../src/jsx/components/Value.ts"],"names":[],"mappings":"AAEA;;;;;GAKG;AACH,MAAM,MAAM,UAAU,GAAG;IACvB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;CACf,CAAC;AAIF;;;;;;;;;;;;;GAaG;AACH,eAAO,MAAM,KAAK,2DAAqD,CAAC;AAExE;;;;GAIG;AACH,MAAM,MAAM,YAAY,GAAG,UAAU,CAAC,OAAO,KAAK,CAAC,CAAC"}

package/dist/jsx/components/Value.d.mts

@@ -0,0 +1,32 @@
+/**
+ * The props of the {@link Value} component.
+ *
+ * @property value - The value shown on the right side.
+ * @property extra - The extra text shown on the left side.
+ */
+export type ValueProps = {
+    value: string;
+    extra: string;
+};
+/**
+ * A value component, which can be used to display two different text values side by side.
+ *
+ * This component can only be used as a child of the {@link Row} component.
+ *
+ * This component does not accept any children.
+ *
+ * @param props - The props of the component.
+ * @param props.value - The value shown on the right side.
+ * @param props.extra - The extra text shown on the left side.
+ * @returns A value element.
+ * @example
+ * <Value value="0.05 ETH" extra="$200" />
+ */
+export declare const Value: import("../component").SnapComponent<ValueProps, "Value">;
+/**
+ * A value element.
+ *
+ * @see Value
+ */
+export type ValueElement = ReturnType<typeof Value>;
+//# sourceMappingURL=Value.d.mts.map

package/dist/jsx/components/Value.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Value.d.mts","sourceRoot":"","sources":["../../../src/jsx/components/Value.ts"],"names":[],"mappings":"AAEA;;;;;GAKG;AACH,MAAM,MAAM,UAAU,GAAG;IACvB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;CACf,CAAC;AAIF;;;;;;;;;;;;;GAaG;AACH,eAAO,MAAM,KAAK,2DAAqD,CAAC;AAExE;;;;GAIG;AACH,MAAM,MAAM,YAAY,GAAG,UAAU,CAAC,OAAO,KAAK,CAAC,CAAC"}

package/dist/jsx/components/Value.mjs

@@ -0,0 +1,18 @@
+import { createSnapComponent } from "../component.mjs";
+const TYPE = 'Value';
+/**
+ * A value component, which can be used to display two different text values side by side.
+ *
+ * This component can only be used as a child of the {@link Row} component.
+ *
+ * This component does not accept any children.
+ *
+ * @param props - The props of the component.
+ * @param props.value - The value shown on the right side.
+ * @param props.extra - The extra text shown on the left side.
+ * @returns A value element.
+ * @example
+ * <Value value="0.05 ETH" extra="$200" />
+ */
+export const Value = createSnapComponent(TYPE);
+//# sourceMappingURL=Value.mjs.map

package/dist/jsx/components/Value.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Value.mjs","sourceRoot":"","sources":["../../../src/jsx/components/Value.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,mBAAmB,EAAE,yBAAqB;AAanD,MAAM,IAAI,GAAG,OAAO,CAAC;AAErB;;;;;;;;;;;;;GAaG;AACH,MAAM,CAAC,MAAM,KAAK,GAAG,mBAAmB,CAA0B,IAAI,CAAC,CAAC","sourcesContent":["import { createSnapComponent } from '../component';\n\n/**\n * The props of the {@link Value} component.\n *\n * @property value - The value shown on the right side.\n * @property extra - The extra text shown on the left side.\n */\nexport type ValueProps = {\n  value: string;\n  extra: string;\n};\n\nconst TYPE = 'Value';\n\n/**\n * A value component, which can be used to display two different text values side by side.\n *\n * This component can only be used as a child of the {@link Row} component.\n *\n * This component does not accept any children.\n *\n * @param props - The props of the component.\n * @param props.value - The value shown on the right side.\n * @param props.extra - The extra text shown on the left side.\n * @returns A value element.\n * @example\n * <Value value=\"0.05 ETH\" extra=\"$200\" />\n */\nexport const Value = createSnapComponent<ValueProps, typeof TYPE>(TYPE);\n\n/**\n * A value element.\n *\n * @see Value\n */\nexport type ValueElement = ReturnType<typeof Value>;\n"]}

package/dist/jsx/components/form/Button.cjs

@@ -0,0 +1,17 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Button = void 0;
+const component_1 = require("../../component.cjs");
+const TYPE = 'Button';
+/**
+ * A button component, which is used to create a clickable button.
+ *
+ * @param props - The props of the component.
+ * @param props.children - The text to display on the button. This should be a
+ * string or an array of strings.
+ * @returns A button element.
+ * @example
+ * <Button name="my-button">Click me</Button>
+ */
+exports.Button = (0, component_1.createSnapComponent)(TYPE);
+//# sourceMappingURL=Button.cjs.map

package/dist/jsx/components/form/Button.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Button.cjs","sourceRoot":"","sources":["../../../../src/jsx/components/form/Button.ts"],"names":[],"mappings":";;;AACA,mDAAsD;AA0BtD,MAAM,IAAI,GAAG,QAAQ,CAAC;AAEtB;;;;;;;;;GASG;AACU,QAAA,MAAM,GAAG,IAAA,+BAAmB,EAA2B,IAAI,CAAC,CAAC","sourcesContent":["import type { SnapsChildren, StringElement } from '../../component';\nimport { createSnapComponent } from '../../component';\nimport type { IconElement } from '../Icon';\nimport type { ImageElement } from '../Image';\n\n// TODO: Add the `onClick` prop to the `ButtonProps` type.\n\n/**\n * The props of the {@link Button} component.\n *\n * @property children - The text to display on the button.\n * @property name - The name of the button. This is used to identify the button\n * in the event handler.\n * @property type - The type of the button, i.e., `'button'` or `'submit'`.\n * Defaults to `'button'`.\n * @property variant - The variant of the button, i.e., `'primary'` or\n * `'destructive'`. Defaults to `'primary'`.\n * @property disabled - Whether the button is disabled. Defaults to `false`.\n */\nexport type ButtonProps = {\n  children: SnapsChildren<StringElement | IconElement | ImageElement>;\n  name?: string | undefined;\n  type?: 'button' | 'submit' | undefined;\n  variant?: 'primary' | 'destructive' | undefined;\n  disabled?: boolean | undefined;\n};\n\nconst TYPE = 'Button';\n\n/**\n * A button component, which is used to create a clickable button.\n *\n * @param props - The props of the component.\n * @param props.children - The text to display on the button. This should be a\n * string or an array of strings.\n * @returns A button element.\n * @example\n * <Button name=\"my-button\">Click me</Button>\n */\nexport const Button = createSnapComponent<ButtonProps, typeof TYPE>(TYPE);\n\n/**\n * A button element.\n *\n * @see Button\n */\nexport type ButtonElement = ReturnType<typeof Button>;\n"]}

package/dist/{types/jsx/components/form/Button.d.ts → jsx/components/form/Button.d.cts}

@@ -1,4 +1,6 @@
-import type { StringElement } from '../../component';
+import type { SnapsChildren, StringElement } from "../../component.cjs";
+import type { IconElement } from "../Icon.cjs";
+import type { ImageElement } from "../Image.cjs";
 /**
  * The props of the {@link Button} component.
  *
@@ -12,7 +14,7 @@ import type { StringElement } from '../../component';
  * @property disabled - Whether the button is disabled. Defaults to `false`.
  */
 export type ButtonProps = {
-    children: StringElement;
+    children: SnapsChildren<StringElement | IconElement | ImageElement>;
     name?: string | undefined;
     type?: 'button' | 'submit' | undefined;
     variant?: 'primary' | 'destructive' | undefined;
@@ -35,3 +37,4 @@ export declare const Button: import("../../component").SnapComponent<ButtonProps
  * @see Button
  */
 export type ButtonElement = ReturnType<typeof Button>;
+//# sourceMappingURL=Button.d.cts.map

package/dist/jsx/components/form/Button.d.cts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Button.d.cts","sourceRoot":"","sources":["../../../../src/jsx/components/form/Button.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,aAAa,EAAE,4BAAwB;AAEpE,OAAO,KAAK,EAAE,WAAW,EAAE,oBAAgB;AAC3C,OAAO,KAAK,EAAE,YAAY,EAAE,qBAAiB;AAI7C;;;;;;;;;;;GAWG;AACH,MAAM,MAAM,WAAW,GAAG;IACxB,QAAQ,EAAE,aAAa,CAAC,aAAa,GAAG,WAAW,GAAG,YAAY,CAAC,CAAC;IACpE,IAAI,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC1B,IAAI,CAAC,EAAE,QAAQ,GAAG,QAAQ,GAAG,SAAS,CAAC;IACvC,OAAO,CAAC,EAAE,SAAS,GAAG,aAAa,GAAG,SAAS,CAAC;IAChD,QAAQ,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;CAChC,CAAC;AAIF;;;;;;;;;GASG;AACH,eAAO,MAAM,MAAM,gEAAsD,CAAC;AAE1E;;;;GAIG;AACH,MAAM,MAAM,aAAa,GAAG,UAAU,CAAC,OAAO,MAAM,CAAC,CAAC"}

package/dist/jsx/components/form/Button.d.mts

@@ -0,0 +1,40 @@
+import type { SnapsChildren, StringElement } from "../../component.mjs";
+import type { IconElement } from "../Icon.mjs";
+import type { ImageElement } from "../Image.mjs";
+/**
+ * The props of the {@link Button} component.
+ *
+ * @property children - The text to display on the button.
+ * @property name - The name of the button. This is used to identify the button
+ * in the event handler.
+ * @property type - The type of the button, i.e., `'button'` or `'submit'`.
+ * Defaults to `'button'`.
+ * @property variant - The variant of the button, i.e., `'primary'` or
+ * `'destructive'`. Defaults to `'primary'`.
+ * @property disabled - Whether the button is disabled. Defaults to `false`.
+ */
+export type ButtonProps = {
+    children: SnapsChildren<StringElement | IconElement | ImageElement>;
+    name?: string | undefined;
+    type?: 'button' | 'submit' | undefined;
+    variant?: 'primary' | 'destructive' | undefined;
+    disabled?: boolean | undefined;
+};
+/**
+ * A button component, which is used to create a clickable button.
+ *
+ * @param props - The props of the component.
+ * @param props.children - The text to display on the button. This should be a
+ * string or an array of strings.
+ * @returns A button element.
+ * @example
+ * <Button name="my-button">Click me</Button>
+ */
+export declare const Button: import("../../component").SnapComponent<ButtonProps, "Button">;
+/**
+ * A button element.
+ *
+ * @see Button
+ */
+export type ButtonElement = ReturnType<typeof Button>;
+//# sourceMappingURL=Button.d.mts.map

package/dist/jsx/components/form/Button.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Button.d.mts","sourceRoot":"","sources":["../../../../src/jsx/components/form/Button.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,aAAa,EAAE,4BAAwB;AAEpE,OAAO,KAAK,EAAE,WAAW,EAAE,oBAAgB;AAC3C,OAAO,KAAK,EAAE,YAAY,EAAE,qBAAiB;AAI7C;;;;;;;;;;;GAWG;AACH,MAAM,MAAM,WAAW,GAAG;IACxB,QAAQ,EAAE,aAAa,CAAC,aAAa,GAAG,WAAW,GAAG,YAAY,CAAC,CAAC;IACpE,IAAI,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC1B,IAAI,CAAC,EAAE,QAAQ,GAAG,QAAQ,GAAG,SAAS,CAAC;IACvC,OAAO,CAAC,EAAE,SAAS,GAAG,aAAa,GAAG,SAAS,CAAC;IAChD,QAAQ,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;CAChC,CAAC;AAIF;;;;;;;;;GASG;AACH,eAAO,MAAM,MAAM,gEAAsD,CAAC;AAE1E;;;;GAIG;AACH,MAAM,MAAM,aAAa,GAAG,UAAU,CAAC,OAAO,MAAM,CAAC,CAAC"}

package/dist/jsx/components/form/Button.mjs

@@ -0,0 +1,14 @@
+import { createSnapComponent } from "../../component.mjs";
+const TYPE = 'Button';
+/**
+ * A button component, which is used to create a clickable button.
+ *
+ * @param props - The props of the component.
+ * @param props.children - The text to display on the button. This should be a
+ * string or an array of strings.
+ * @returns A button element.
+ * @example
+ * <Button name="my-button">Click me</Button>
+ */
+export const Button = createSnapComponent(TYPE);
+//# sourceMappingURL=Button.mjs.map

package/dist/jsx/components/form/Button.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Button.mjs","sourceRoot":"","sources":["../../../../src/jsx/components/form/Button.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,mBAAmB,EAAE,4BAAwB;AA0BtD,MAAM,IAAI,GAAG,QAAQ,CAAC;AAEtB;;;;;;;;;GASG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,mBAAmB,CAA2B,IAAI,CAAC,CAAC","sourcesContent":["import type { SnapsChildren, StringElement } from '../../component';\nimport { createSnapComponent } from '../../component';\nimport type { IconElement } from '../Icon';\nimport type { ImageElement } from '../Image';\n\n// TODO: Add the `onClick` prop to the `ButtonProps` type.\n\n/**\n * The props of the {@link Button} component.\n *\n * @property children - The text to display on the button.\n * @property name - The name of the button. This is used to identify the button\n * in the event handler.\n * @property type - The type of the button, i.e., `'button'` or `'submit'`.\n * Defaults to `'button'`.\n * @property variant - The variant of the button, i.e., `'primary'` or\n * `'destructive'`. Defaults to `'primary'`.\n * @property disabled - Whether the button is disabled. Defaults to `false`.\n */\nexport type ButtonProps = {\n  children: SnapsChildren<StringElement | IconElement | ImageElement>;\n  name?: string | undefined;\n  type?: 'button' | 'submit' | undefined;\n  variant?: 'primary' | 'destructive' | undefined;\n  disabled?: boolean | undefined;\n};\n\nconst TYPE = 'Button';\n\n/**\n * A button component, which is used to create a clickable button.\n *\n * @param props - The props of the component.\n * @param props.children - The text to display on the button. This should be a\n * string or an array of strings.\n * @returns A button element.\n * @example\n * <Button name=\"my-button\">Click me</Button>\n */\nexport const Button = createSnapComponent<ButtonProps, typeof TYPE>(TYPE);\n\n/**\n * A button element.\n *\n * @see Button\n */\nexport type ButtonElement = ReturnType<typeof Button>;\n"]}

package/dist/jsx/components/form/Checkbox.cjs

@@ -0,0 +1,20 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Checkbox = void 0;
+const component_1 = require("../../component.cjs");
+const TYPE = 'Checkbox';
+/**
+ * A checkbox component, which is used to create a checkbox.
+ *
+ * @param props - The props of the component.
+ * @param props.name - The name of the checkbox. This is used to identify the
+ * state in the form data.
+ * @param props.checked - Whether the checkbox is checked or not.
+ * @param props.label - An optional label for the checkbox.
+ * @param props.variant - An optional variant for the checkbox.
+ * @returns A checkbox element.
+ * @example
+ * <Checkbox name="accept-terms" />
+ */
+exports.Checkbox = (0, component_1.createSnapComponent)(TYPE);
+//# sourceMappingURL=Checkbox.cjs.map

package/dist/jsx/components/form/Checkbox.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Checkbox.cjs","sourceRoot":"","sources":["../../../../src/jsx/components/form/Checkbox.ts"],"names":[],"mappings":";;;AAAA,mDAAsD;AAkBtD,MAAM,IAAI,GAAG,UAAU,CAAC;AAExB;;;;;;;;;;;;GAYG;AACU,QAAA,QAAQ,GAAG,IAAA,+BAAmB,EAA6B,IAAI,CAAC,CAAC","sourcesContent":["import { createSnapComponent } from '../../component';\n\n/**\n * The props of the {@link Checkbox} component.\n *\n * @property name - The name of the checkbox. This is used to identify the\n * state in the form data.\n * @property checked - Whether the checkbox is checked or not.\n * @property label - An optional label for the checkbox.\n * @property variant - An optional variant for the checkbox.\n */\nexport type CheckboxProps = {\n  name: string;\n  checked?: boolean | undefined;\n  label?: string | undefined;\n  variant?: 'default' | 'toggle' | undefined;\n};\n\nconst TYPE = 'Checkbox';\n\n/**\n * A checkbox component, which is used to create a checkbox.\n *\n * @param props - The props of the component.\n * @param props.name - The name of the checkbox. This is used to identify the\n * state in the form data.\n * @param props.checked - Whether the checkbox is checked or not.\n * @param props.label - An optional label for the checkbox.\n * @param props.variant - An optional variant for the checkbox.\n * @returns A checkbox element.\n * @example\n * <Checkbox name=\"accept-terms\" />\n */\nexport const Checkbox = createSnapComponent<CheckboxProps, typeof TYPE>(TYPE);\n\n/**\n * A checkbox element.\n *\n * @see Checkbox\n */\nexport type CheckboxElement = ReturnType<typeof Checkbox>;\n"]}

package/dist/{types/jsx/components/form/Checkbox.d.ts → jsx/components/form/Checkbox.d.cts}

@@ -33,3 +33,4 @@ export declare const Checkbox: import("../../component").SnapComponent<CheckboxP
  * @see Checkbox
  */
 export type CheckboxElement = ReturnType<typeof Checkbox>;
+//# sourceMappingURL=Checkbox.d.cts.map

package/dist/jsx/components/form/Checkbox.d.cts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Checkbox.d.cts","sourceRoot":"","sources":["../../../../src/jsx/components/form/Checkbox.ts"],"names":[],"mappings":"AAEA;;;;;;;;GAQG;AACH,MAAM,MAAM,aAAa,GAAG;IAC1B,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IAC9B,KAAK,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC3B,OAAO,CAAC,EAAE,SAAS,GAAG,QAAQ,GAAG,SAAS,CAAC;CAC5C,CAAC;AAIF;;;;;;;;;;;;GAYG;AACH,eAAO,MAAM,QAAQ,oEAAwD,CAAC;AAE9E;;;;GAIG;AACH,MAAM,MAAM,eAAe,GAAG,UAAU,CAAC,OAAO,QAAQ,CAAC,CAAC"}

package/dist/jsx/components/form/Checkbox.d.mts

@@ -0,0 +1,36 @@
+/**
+ * The props of the {@link Checkbox} component.
+ *
+ * @property name - The name of the checkbox. This is used to identify the
+ * state in the form data.
+ * @property checked - Whether the checkbox is checked or not.
+ * @property label - An optional label for the checkbox.
+ * @property variant - An optional variant for the checkbox.
+ */
+export type CheckboxProps = {
+    name: string;
+    checked?: boolean | undefined;
+    label?: string | undefined;
+    variant?: 'default' | 'toggle' | undefined;
+};
+/**
+ * A checkbox component, which is used to create a checkbox.
+ *
+ * @param props - The props of the component.
+ * @param props.name - The name of the checkbox. This is used to identify the
+ * state in the form data.
+ * @param props.checked - Whether the checkbox is checked or not.
+ * @param props.label - An optional label for the checkbox.
+ * @param props.variant - An optional variant for the checkbox.
+ * @returns A checkbox element.
+ * @example
+ * <Checkbox name="accept-terms" />
+ */
+export declare const Checkbox: import("../../component").SnapComponent<CheckboxProps, "Checkbox">;
+/**
+ * A checkbox element.
+ *
+ * @see Checkbox
+ */
+export type CheckboxElement = ReturnType<typeof Checkbox>;
+//# sourceMappingURL=Checkbox.d.mts.map

package/dist/jsx/components/form/Checkbox.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Checkbox.d.mts","sourceRoot":"","sources":["../../../../src/jsx/components/form/Checkbox.ts"],"names":[],"mappings":"AAEA;;;;;;;;GAQG;AACH,MAAM,MAAM,aAAa,GAAG;IAC1B,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IAC9B,KAAK,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC3B,OAAO,CAAC,EAAE,SAAS,GAAG,QAAQ,GAAG,SAAS,CAAC;CAC5C,CAAC;AAIF;;;;;;;;;;;;GAYG;AACH,eAAO,MAAM,QAAQ,oEAAwD,CAAC;AAE9E;;;;GAIG;AACH,MAAM,MAAM,eAAe,GAAG,UAAU,CAAC,OAAO,QAAQ,CAAC,CAAC"}

package/dist/jsx/components/form/Checkbox.mjs

@@ -0,0 +1,17 @@
+import { createSnapComponent } from "../../component.mjs";
+const TYPE = 'Checkbox';
+/**
+ * A checkbox component, which is used to create a checkbox.
+ *
+ * @param props - The props of the component.
+ * @param props.name - The name of the checkbox. This is used to identify the
+ * state in the form data.
+ * @param props.checked - Whether the checkbox is checked or not.
+ * @param props.label - An optional label for the checkbox.
+ * @param props.variant - An optional variant for the checkbox.
+ * @returns A checkbox element.
+ * @example
+ * <Checkbox name="accept-terms" />
+ */
+export const Checkbox = createSnapComponent(TYPE);
+//# sourceMappingURL=Checkbox.mjs.map

package/dist/jsx/components/form/Checkbox.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Checkbox.mjs","sourceRoot":"","sources":["../../../../src/jsx/components/form/Checkbox.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,mBAAmB,EAAE,4BAAwB;AAkBtD,MAAM,IAAI,GAAG,UAAU,CAAC;AAExB;;;;;;;;;;;;GAYG;AACH,MAAM,CAAC,MAAM,QAAQ,GAAG,mBAAmB,CAA6B,IAAI,CAAC,CAAC","sourcesContent":["import { createSnapComponent } from '../../component';\n\n/**\n * The props of the {@link Checkbox} component.\n *\n * @property name - The name of the checkbox. This is used to identify the\n * state in the form data.\n * @property checked - Whether the checkbox is checked or not.\n * @property label - An optional label for the checkbox.\n * @property variant - An optional variant for the checkbox.\n */\nexport type CheckboxProps = {\n  name: string;\n  checked?: boolean | undefined;\n  label?: string | undefined;\n  variant?: 'default' | 'toggle' | undefined;\n};\n\nconst TYPE = 'Checkbox';\n\n/**\n * A checkbox component, which is used to create a checkbox.\n *\n * @param props - The props of the component.\n * @param props.name - The name of the checkbox. This is used to identify the\n * state in the form data.\n * @param props.checked - Whether the checkbox is checked or not.\n * @param props.label - An optional label for the checkbox.\n * @param props.variant - An optional variant for the checkbox.\n * @returns A checkbox element.\n * @example\n * <Checkbox name=\"accept-terms\" />\n */\nexport const Checkbox = createSnapComponent<CheckboxProps, typeof TYPE>(TYPE);\n\n/**\n * A checkbox element.\n *\n * @see Checkbox\n */\nexport type CheckboxElement = ReturnType<typeof Checkbox>;\n"]}

package/dist/jsx/components/form/Dropdown.cjs

@@ -0,0 +1,23 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Dropdown = void 0;
+const component_1 = require("../../component.cjs");
+const TYPE = 'Dropdown';
+/**
+ * A dropdown component, which is used to create a dropdown.
+ *
+ * @param props - The props of the component.
+ * @param props.name - The name of the dropdown field. This is used to identify the
+ * state in the form data.
+ * @param props.value - The selected value of the dropdown.
+ * @param props.children - The children of the dropdown.
+ * @returns A dropdown element.
+ * @example
+ * <Dropdown name="dropdown">
+ *  <Option value="option1">Option 1</Option>
+ *  <Option value="option2">Option 2</Option>
+ *  <Option value="option3">Option 3</Option>
+ * </Dropdown>
+ */
+exports.Dropdown = (0, component_1.createSnapComponent)(TYPE);
+//# sourceMappingURL=Dropdown.cjs.map

package/dist/jsx/components/form/Dropdown.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Dropdown.cjs","sourceRoot":"","sources":["../../../../src/jsx/components/form/Dropdown.ts"],"names":[],"mappings":";;;AACA,mDAAsD;AAiBtD,MAAM,IAAI,GAAG,UAAU,CAAC;AAExB;;;;;;;;;;;;;;;GAeG;AACU,QAAA,QAAQ,GAAG,IAAA,+BAAmB,EAA6B,IAAI,CAAC,CAAC","sourcesContent":["import type { SnapsChildren } from '../../component';\nimport { createSnapComponent } from '../../component';\nimport type { OptionElement } from './Option';\n\n/**\n * The props of the {@link Dropdown} component.\n *\n * @property name - The name of the dropdown. This is used to identify the\n * state in the form data.\n * @property value - The selected value of the dropdown.\n * @property children - The children of the dropdown.\n */\nexport type DropdownProps = {\n  name: string;\n  value?: string | undefined;\n  children: SnapsChildren<OptionElement>;\n};\n\nconst TYPE = 'Dropdown';\n\n/**\n * A dropdown component, which is used to create a dropdown.\n *\n * @param props - The props of the component.\n * @param props.name - The name of the dropdown field. This is used to identify the\n * state in the form data.\n * @param props.value - The selected value of the dropdown.\n * @param props.children - The children of the dropdown.\n * @returns A dropdown element.\n * @example\n * <Dropdown name=\"dropdown\">\n *  <Option value=\"option1\">Option 1</Option>\n *  <Option value=\"option2\">Option 2</Option>\n *  <Option value=\"option3\">Option 3</Option>\n * </Dropdown>\n */\nexport const Dropdown = createSnapComponent<DropdownProps, typeof TYPE>(TYPE);\n\n/**\n * A dropdown element.\n *\n * @see Dropdown\n */\nexport type DropdownElement = ReturnType<typeof Dropdown>;\n"]}

package/dist/{types/jsx/components/form/Dropdown.d.ts → jsx/components/form/Dropdown.d.cts}

@@ -1,5 +1,5 @@
-import type { SnapsChildren } from '../../component';
-import type { OptionElement } from './Option';
+import type { SnapsChildren } from "../../component.cjs";
+import type { OptionElement } from "./Option.cjs";
 /**
  * The props of the {@link Dropdown} component.
  *
@@ -36,3 +36,4 @@ export declare const Dropdown: import("../../component").SnapComponent<DropdownP
  * @see Dropdown
  */
 export type DropdownElement = ReturnType<typeof Dropdown>;
+//# sourceMappingURL=Dropdown.d.cts.map

package/dist/jsx/components/form/Dropdown.d.cts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Dropdown.d.cts","sourceRoot":"","sources":["../../../../src/jsx/components/form/Dropdown.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,4BAAwB;AAErD,OAAO,KAAK,EAAE,aAAa,EAAE,qBAAiB;AAE9C;;;;;;;GAOG;AACH,MAAM,MAAM,aAAa,GAAG;IAC1B,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC3B,QAAQ,EAAE,aAAa,CAAC,aAAa,CAAC,CAAC;CACxC,CAAC;AAIF;;;;;;;;;;;;;;;GAeG;AACH,eAAO,MAAM,QAAQ,oEAAwD,CAAC;AAE9E;;;;GAIG;AACH,MAAM,MAAM,eAAe,GAAG,UAAU,CAAC,OAAO,QAAQ,CAAC,CAAC"}

package/dist/jsx/components/form/Dropdown.d.mts

@@ -0,0 +1,39 @@
+import type { SnapsChildren } from "../../component.mjs";
+import type { OptionElement } from "./Option.mjs";
+/**
+ * The props of the {@link Dropdown} component.
+ *
+ * @property name - The name of the dropdown. This is used to identify the
+ * state in the form data.
+ * @property value - The selected value of the dropdown.
+ * @property children - The children of the dropdown.
+ */
+export type DropdownProps = {
+    name: string;
+    value?: string | undefined;
+    children: SnapsChildren<OptionElement>;
+};
+/**
+ * A dropdown component, which is used to create a dropdown.
+ *
+ * @param props - The props of the component.
+ * @param props.name - The name of the dropdown field. This is used to identify the
+ * state in the form data.
+ * @param props.value - The selected value of the dropdown.
+ * @param props.children - The children of the dropdown.
+ * @returns A dropdown element.
+ * @example
+ * <Dropdown name="dropdown">
+ *  <Option value="option1">Option 1</Option>
+ *  <Option value="option2">Option 2</Option>
+ *  <Option value="option3">Option 3</Option>
+ * </Dropdown>
+ */
+export declare const Dropdown: import("../../component").SnapComponent<DropdownProps, "Dropdown">;
+/**
+ * A dropdown element.
+ *
+ * @see Dropdown
+ */
+export type DropdownElement = ReturnType<typeof Dropdown>;
+//# sourceMappingURL=Dropdown.d.mts.map

package/dist/jsx/components/form/Dropdown.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Dropdown.d.mts","sourceRoot":"","sources":["../../../../src/jsx/components/form/Dropdown.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,4BAAwB;AAErD,OAAO,KAAK,EAAE,aAAa,EAAE,qBAAiB;AAE9C;;;;;;;GAOG;AACH,MAAM,MAAM,aAAa,GAAG;IAC1B,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC3B,QAAQ,EAAE,aAAa,CAAC,aAAa,CAAC,CAAC;CACxC,CAAC;AAIF;;;;;;;;;;;;;;;GAeG;AACH,eAAO,MAAM,QAAQ,oEAAwD,CAAC;AAE9E;;;;GAIG;AACH,MAAM,MAAM,eAAe,GAAG,UAAU,CAAC,OAAO,QAAQ,CAAC,CAAC"}

package/dist/jsx/components/form/Dropdown.mjs

@@ -0,0 +1,20 @@
+import { createSnapComponent } from "../../component.mjs";
+const TYPE = 'Dropdown';
+/**
+ * A dropdown component, which is used to create a dropdown.
+ *
+ * @param props - The props of the component.
+ * @param props.name - The name of the dropdown field. This is used to identify the
+ * state in the form data.
+ * @param props.value - The selected value of the dropdown.
+ * @param props.children - The children of the dropdown.
+ * @returns A dropdown element.
+ * @example
+ * <Dropdown name="dropdown">
+ *  <Option value="option1">Option 1</Option>
+ *  <Option value="option2">Option 2</Option>
+ *  <Option value="option3">Option 3</Option>
+ * </Dropdown>
+ */
+export const Dropdown = createSnapComponent(TYPE);
+//# sourceMappingURL=Dropdown.mjs.map

package/dist/jsx/components/form/Dropdown.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Dropdown.mjs","sourceRoot":"","sources":["../../../../src/jsx/components/form/Dropdown.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,mBAAmB,EAAE,4BAAwB;AAiBtD,MAAM,IAAI,GAAG,UAAU,CAAC;AAExB;;;;;;;;;;;;;;;GAeG;AACH,MAAM,CAAC,MAAM,QAAQ,GAAG,mBAAmB,CAA6B,IAAI,CAAC,CAAC","sourcesContent":["import type { SnapsChildren } from '../../component';\nimport { createSnapComponent } from '../../component';\nimport type { OptionElement } from './Option';\n\n/**\n * The props of the {@link Dropdown} component.\n *\n * @property name - The name of the dropdown. This is used to identify the\n * state in the form data.\n * @property value - The selected value of the dropdown.\n * @property children - The children of the dropdown.\n */\nexport type DropdownProps = {\n  name: string;\n  value?: string | undefined;\n  children: SnapsChildren<OptionElement>;\n};\n\nconst TYPE = 'Dropdown';\n\n/**\n * A dropdown component, which is used to create a dropdown.\n *\n * @param props - The props of the component.\n * @param props.name - The name of the dropdown field. This is used to identify the\n * state in the form data.\n * @param props.value - The selected value of the dropdown.\n * @param props.children - The children of the dropdown.\n * @returns A dropdown element.\n * @example\n * <Dropdown name=\"dropdown\">\n *  <Option value=\"option1\">Option 1</Option>\n *  <Option value=\"option2\">Option 2</Option>\n *  <Option value=\"option3\">Option 3</Option>\n * </Dropdown>\n */\nexport const Dropdown = createSnapComponent<DropdownProps, typeof TYPE>(TYPE);\n\n/**\n * A dropdown element.\n *\n * @see Dropdown\n */\nexport type DropdownElement = ReturnType<typeof Dropdown>;\n"]}

package/dist/jsx/components/form/Field.cjs

@@ -0,0 +1,26 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Field = void 0;
+const component_1 = require("../../component.cjs");
+const TYPE = 'Field';
+/**
+ * A field component, which is used to create a form field. This component can
+ * only be used as a child of the {@link Form} component.
+ *
+ * @param props - The props of the component.
+ * @param props.label - The label of the field.
+ * @param props.error - The error message of the field.
+ * @param props.children - The input field and the submit button.
+ * @returns A field element.
+ * @example
+ * <Field label="Username">
+ *   <Input name="username" type="text" />
+ *   <Button type="submit">Submit</Button>
+ * </Field>
+ * @example
+ * <Field label="Upload file">
+ *   <FileInput name="file" accept={['image/*']} multiple />
+ * </Field>
+ */
+exports.Field = (0, component_1.createSnapComponent)(TYPE);
+//# sourceMappingURL=Field.cjs.map

package/dist/jsx/components/form/Field.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Field.cjs","sourceRoot":"","sources":["../../../../src/jsx/components/form/Field.ts"],"names":[],"mappings":";;;AACA,mDAAsD;AA8BtD,MAAM,IAAI,GAAG,OAAO,CAAC;AAErB;;;;;;;;;;;;;;;;;;GAkBG;AACU,QAAA,KAAK,GAAG,IAAA,+BAAmB,EAA0B,IAAI,CAAC,CAAC","sourcesContent":["import type { GenericSnapElement } from '../../component';\nimport { createSnapComponent } from '../../component';\nimport type { CheckboxElement } from './Checkbox';\nimport type { DropdownElement } from './Dropdown';\nimport type { FileInputElement } from './FileInput';\nimport type { InputElement } from './Input';\nimport type { RadioGroupElement } from './RadioGroup';\nimport type { SelectorElement } from './Selector';\n\n/**\n * The props of the {@link Field} component.\n *\n * @property label - The label of the field.\n * @property error - The error message of the field.\n * @property children - The input field and the submit button.\n */\nexport type FieldProps = {\n  label?: string | undefined;\n  error?: string | undefined;\n  children:\n    | [InputElement, GenericSnapElement]\n    | [GenericSnapElement, InputElement]\n    | [GenericSnapElement, InputElement, GenericSnapElement]\n    | DropdownElement\n    | RadioGroupElement\n    | FileInputElement\n    | InputElement\n    | CheckboxElement\n    | SelectorElement;\n};\n\nconst TYPE = 'Field';\n\n/**\n * A field component, which is used to create a form field. This component can\n * only be used as a child of the {@link Form} component.\n *\n * @param props - The props of the component.\n * @param props.label - The label of the field.\n * @param props.error - The error message of the field.\n * @param props.children - The input field and the submit button.\n * @returns A field element.\n * @example\n * <Field label=\"Username\">\n *   <Input name=\"username\" type=\"text\" />\n *   <Button type=\"submit\">Submit</Button>\n * </Field>\n * @example\n * <Field label=\"Upload file\">\n *   <FileInput name=\"file\" accept={['image/*']} multiple />\n * </Field>\n */\nexport const Field = createSnapComponent<FieldProps, typeof TYPE>(TYPE);\n\n/**\n * A field element.\n *\n * @see Field\n */\nexport type FieldElement = ReturnType<typeof Field>;\n"]}

package/dist/{types/jsx/components/form/Field.d.ts → jsx/components/form/Field.d.cts}

@@ -1,9 +1,10 @@
-import type { ButtonElement } from './Button';
-import type { CheckboxElement } from './Checkbox';
-import type { DropdownElement } from './Dropdown';
-import type { FileInputElement } from './FileInput';
-import type { InputElement } from './Input';
-import type { RadioGroupElement } from './RadioGroup';
+import type { GenericSnapElement } from "../../component.cjs";
+import type { CheckboxElement } from "./Checkbox.cjs";
+import type { DropdownElement } from "./Dropdown.cjs";
+import type { FileInputElement } from "./FileInput.cjs";
+import type { InputElement } from "./Input.cjs";
+import type { RadioGroupElement } from "./RadioGroup.cjs";
+import type { SelectorElement } from "./Selector.cjs";
 /**
  * The props of the {@link Field} component.
  *
@@ -14,7 +15,7 @@ import type { RadioGroupElement } from './RadioGroup';
 export type FieldProps = {
     label?: string | undefined;
     error?: string | undefined;
-    children: [InputElement, ButtonElement] | DropdownElement | RadioGroupElement | FileInputElement | InputElement | CheckboxElement;
+    children: [InputElement, GenericSnapElement] | [GenericSnapElement, InputElement] | [GenericSnapElement, InputElement, GenericSnapElement] | DropdownElement | RadioGroupElement | FileInputElement | InputElement | CheckboxElement | SelectorElement;
 };
 /**
  * A field component, which is used to create a form field. This component can
@@ -42,3 +43,4 @@ export declare const Field: import("../../component").SnapComponent<FieldProps,
  * @see Field
  */
 export type FieldElement = ReturnType<typeof Field>;
+//# sourceMappingURL=Field.d.cts.map

package/dist/jsx/components/form/Field.d.cts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Field.d.cts","sourceRoot":"","sources":["../../../../src/jsx/components/form/Field.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,kBAAkB,EAAE,4BAAwB;AAE1D,OAAO,KAAK,EAAE,eAAe,EAAE,uBAAmB;AAClD,OAAO,KAAK,EAAE,eAAe,EAAE,uBAAmB;AAClD,OAAO,KAAK,EAAE,gBAAgB,EAAE,wBAAoB;AACpD,OAAO,KAAK,EAAE,YAAY,EAAE,oBAAgB;AAC5C,OAAO,KAAK,EAAE,iBAAiB,EAAE,yBAAqB;AACtD,OAAO,KAAK,EAAE,eAAe,EAAE,uBAAmB;AAElD;;;;;;GAMG;AACH,MAAM,MAAM,UAAU,GAAG;IACvB,KAAK,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC3B,KAAK,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC3B,QAAQ,EACJ,CAAC,YAAY,EAAE,kBAAkB,CAAC,GAClC,CAAC,kBAAkB,EAAE,YAAY,CAAC,GAClC,CAAC,kBAAkB,EAAE,YAAY,EAAE,kBAAkB,CAAC,GACtD,eAAe,GACf,iBAAiB,GACjB,gBAAgB,GAChB,YAAY,GACZ,eAAe,GACf,eAAe,CAAC;CACrB,CAAC;AAIF;;;;;;;;;;;;;;;;;;GAkBG;AACH,eAAO,MAAM,KAAK,8DAAqD,CAAC;AAExE;;;;GAIG;AACH,MAAM,MAAM,YAAY,GAAG,UAAU,CAAC,OAAO,KAAK,CAAC,CAAC"}

package/dist/jsx/components/form/Field.d.mts

@@ -0,0 +1,46 @@
+import type { GenericSnapElement } from "../../component.mjs";
+import type { CheckboxElement } from "./Checkbox.mjs";
+import type { DropdownElement } from "./Dropdown.mjs";
+import type { FileInputElement } from "./FileInput.mjs";
+import type { InputElement } from "./Input.mjs";
+import type { RadioGroupElement } from "./RadioGroup.mjs";
+import type { SelectorElement } from "./Selector.mjs";
+/**
+ * The props of the {@link Field} component.
+ *
+ * @property label - The label of the field.
+ * @property error - The error message of the field.
+ * @property children - The input field and the submit button.
+ */
+export type FieldProps = {
+    label?: string | undefined;
+    error?: string | undefined;
+    children: [InputElement, GenericSnapElement] | [GenericSnapElement, InputElement] | [GenericSnapElement, InputElement, GenericSnapElement] | DropdownElement | RadioGroupElement | FileInputElement | InputElement | CheckboxElement | SelectorElement;
+};
+/**
+ * A field component, which is used to create a form field. This component can
+ * only be used as a child of the {@link Form} component.
+ *
+ * @param props - The props of the component.
+ * @param props.label - The label of the field.
+ * @param props.error - The error message of the field.
+ * @param props.children - The input field and the submit button.
+ * @returns A field element.
+ * @example
+ * <Field label="Username">
+ *   <Input name="username" type="text" />
+ *   <Button type="submit">Submit</Button>
+ * </Field>
+ * @example
+ * <Field label="Upload file">
+ *   <FileInput name="file" accept={['image/*']} multiple />
+ * </Field>
+ */
+export declare const Field: import("../../component").SnapComponent<FieldProps, "Field">;
+/**
+ * A field element.
+ *
+ * @see Field
+ */
+export type FieldElement = ReturnType<typeof Field>;
+//# sourceMappingURL=Field.d.mts.map

package/dist/jsx/components/form/Field.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Field.d.mts","sourceRoot":"","sources":["../../../../src/jsx/components/form/Field.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,kBAAkB,EAAE,4BAAwB;AAE1D,OAAO,KAAK,EAAE,eAAe,EAAE,uBAAmB;AAClD,OAAO,KAAK,EAAE,eAAe,EAAE,uBAAmB;AAClD,OAAO,KAAK,EAAE,gBAAgB,EAAE,wBAAoB;AACpD,OAAO,KAAK,EAAE,YAAY,EAAE,oBAAgB;AAC5C,OAAO,KAAK,EAAE,iBAAiB,EAAE,yBAAqB;AACtD,OAAO,KAAK,EAAE,eAAe,EAAE,uBAAmB;AAElD;;;;;;GAMG;AACH,MAAM,MAAM,UAAU,GAAG;IACvB,KAAK,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC3B,KAAK,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC3B,QAAQ,EACJ,CAAC,YAAY,EAAE,kBAAkB,CAAC,GAClC,CAAC,kBAAkB,EAAE,YAAY,CAAC,GAClC,CAAC,kBAAkB,EAAE,YAAY,EAAE,kBAAkB,CAAC,GACtD,eAAe,GACf,iBAAiB,GACjB,gBAAgB,GAChB,YAAY,GACZ,eAAe,GACf,eAAe,CAAC;CACrB,CAAC;AAIF;;;;;;;;;;;;;;;;;;GAkBG;AACH,eAAO,MAAM,KAAK,8DAAqD,CAAC;AAExE;;;;GAIG;AACH,MAAM,MAAM,YAAY,GAAG,UAAU,CAAC,OAAO,KAAK,CAAC,CAAC"}

package/dist/jsx/components/form/Field.mjs

@@ -0,0 +1,23 @@
+import { createSnapComponent } from "../../component.mjs";
+const TYPE = 'Field';
+/**
+ * A field component, which is used to create a form field. This component can
+ * only be used as a child of the {@link Form} component.
+ *
+ * @param props - The props of the component.
+ * @param props.label - The label of the field.
+ * @param props.error - The error message of the field.
+ * @param props.children - The input field and the submit button.
+ * @returns A field element.
+ * @example
+ * <Field label="Username">
+ *   <Input name="username" type="text" />
+ *   <Button type="submit">Submit</Button>
+ * </Field>
+ * @example
+ * <Field label="Upload file">
+ *   <FileInput name="file" accept={['image/*']} multiple />
+ * </Field>
+ */
+export const Field = createSnapComponent(TYPE);
+//# sourceMappingURL=Field.mjs.map

package/dist/jsx/components/form/Field.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Field.mjs","sourceRoot":"","sources":["../../../../src/jsx/components/form/Field.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,mBAAmB,EAAE,4BAAwB;AA8BtD,MAAM,IAAI,GAAG,OAAO,CAAC;AAErB;;;;;;;;;;;;;;;;;;GAkBG;AACH,MAAM,CAAC,MAAM,KAAK,GAAG,mBAAmB,CAA0B,IAAI,CAAC,CAAC","sourcesContent":["import type { GenericSnapElement } from '../../component';\nimport { createSnapComponent } from '../../component';\nimport type { CheckboxElement } from './Checkbox';\nimport type { DropdownElement } from './Dropdown';\nimport type { FileInputElement } from './FileInput';\nimport type { InputElement } from './Input';\nimport type { RadioGroupElement } from './RadioGroup';\nimport type { SelectorElement } from './Selector';\n\n/**\n * The props of the {@link Field} component.\n *\n * @property label - The label of the field.\n * @property error - The error message of the field.\n * @property children - The input field and the submit button.\n */\nexport type FieldProps = {\n  label?: string | undefined;\n  error?: string | undefined;\n  children:\n    | [InputElement, GenericSnapElement]\n    | [GenericSnapElement, InputElement]\n    | [GenericSnapElement, InputElement, GenericSnapElement]\n    | DropdownElement\n    | RadioGroupElement\n    | FileInputElement\n    | InputElement\n    | CheckboxElement\n    | SelectorElement;\n};\n\nconst TYPE = 'Field';\n\n/**\n * A field component, which is used to create a form field. This component can\n * only be used as a child of the {@link Form} component.\n *\n * @param props - The props of the component.\n * @param props.label - The label of the field.\n * @param props.error - The error message of the field.\n * @param props.children - The input field and the submit button.\n * @returns A field element.\n * @example\n * <Field label=\"Username\">\n *   <Input name=\"username\" type=\"text\" />\n *   <Button type=\"submit\">Submit</Button>\n * </Field>\n * @example\n * <Field label=\"Upload file\">\n *   <FileInput name=\"file\" accept={['image/*']} multiple />\n * </Field>\n */\nexport const Field = createSnapComponent<FieldProps, typeof TYPE>(TYPE);\n\n/**\n * A field element.\n *\n * @see Field\n */\nexport type FieldElement = ReturnType<typeof Field>;\n"]}