@nolwenture/formik-jsonschema-form 1.0.0-beta.20 → 1.0.0-beta.22

package/dist/cjs/Form/fields/SearchableMultiTagSelectField/styledComponents.js

@@ -44,7 +44,7 @@ exports.SearchableMultiTagSelectFieldOptionList = styled_components_1.styled.ul
   padding: unset;
   margin: unset;
   border: ${(props) => `${props.theme.strokeWidth.thin} solid ${props.theme.color.border.default}`};
-  border-radius: ${(props) => props.theme.borderRadius.s};
+  border-radius: ${(props) => props.theme.borderRadius.none};
   position: absolute;
   background: ${(props) => props.theme.color.background.default};
   top: 100%;

package/dist/cjs/FormView/FormView.js

@@ -12,8 +12,8 @@ const components_1 = require("./components");
 const templates_1 = require("./templates");
 const FormViewRegistry_1 = require("./FormViewRegistry");
 exports.FormWrapper = styled_components_1.default.div `
-    font-family: ${(props) => props.theme.typography.fontFamily.base};
-    //padding: ${(props) => props.theme.spacing.xxxxxl};
+  font-family: ${(props) => props.theme.typography.fontFamily.base};
+  //padding: ${(props) => props.theme.spacing.xxxxxl};
 `;
 const FormView = (props) => {
     (0, utils_1.warnFromUnsupportedKeys)("Form", props, [
@@ -28,9 +28,8 @@ const FormView = (props) => {
         "formContext",
         "components",
         "hideUnmarkedAdditionalProperties",
-        "values",
     ]);
-    const { schema, uiSchema = {}, className, fields = {}, templates = {}, components = {}, formContext = {}, useItemsAsAdditionalItems = false, hideUnmarkedAdditionalProperties = false, values = {}, } = props;
+    const { schema, uiSchema = {}, className, fields = {}, templates = {}, components = {}, formContext = {}, useItemsAsAdditionalItems = false, hideUnmarkedAdditionalProperties = false, } = props;
     const schemaDefinitions = schema.definitions;
     const uiSchemaDefinitions = uiSchema.definitions;
     const registry = {
@@ -45,6 +44,6 @@ const FormView = (props) => {
     };
     const { Form: FormEl } = registry.components;
     const SchemaField = registry.fields.SchemaField;
-    return ((0, jsx_runtime_1.jsx)(exports.FormWrapper, { children: (0, jsx_runtime_1.jsx)(FormViewRegistry_1.FormViewRegistry.Provider, { value: registry, children: (0, jsx_runtime_1.jsx)(FormEl, { className: className, children: (0, jsx_runtime_1.jsx)(SchemaField, { name: "", schema: schema, uiSchema: uiSchema, values: values }) }) }) }));
+    return ((0, jsx_runtime_1.jsx)(exports.FormWrapper, { children: (0, jsx_runtime_1.jsx)(FormViewRegistry_1.FormViewRegistry.Provider, { value: registry, children: (0, jsx_runtime_1.jsx)(FormEl, { className: className, children: (0, jsx_runtime_1.jsx)(SchemaField, { name: "", schema: schema, uiSchema: uiSchema }) }) }) }));
 };
 exports.FormView = FormView;

package/dist/cjs/FormView/components/Field.js

@@ -11,7 +11,7 @@ const getStyle_1 = require("../../utils/getStyle");
 exports.FieldWrapper = styled_components_1.default.div `
     color: ${(props) => props.theme.color.text.default};
     font-family: ${(props) => props.theme.typography.fontFamily.base};
-    margin: ${(props) => `${props.theme.spacing.l} 0`};
+    margin: ${(props) => `${props.theme.spacing.l} 0 `};
     width: clamp(20rem, 100%, 70rem);
 `;
 exports.FieldTitle = styled_components_1.default.label `
@@ -32,7 +32,7 @@ exports.FieldDescription = styled_components_1.default.div `
     font-weight: ${(props) => props.theme.typography.weight.normal};
     font-style: italic;
     font-size: ${(props) => props.theme.typography.size.base};
-    margin-bottom: ${(props) => props.theme.spacing.xs};
+    margin-bottom: ${(props) => props.theme.spacing.s};
     max-width: 66ch;
 `;
 exports.StringFieldValue = styled_components_1.default.div `
@@ -41,6 +41,7 @@ exports.StringFieldValue = styled_components_1.default.div `
     font-family: ${(props) => props.theme.typography.fontFamily.base};
     margin-bottom: ${(props) => props.theme.spacing.m};
     max-width: 66ch;
+    padding-left: ${(props) => props.theme.spacing.l};
     white-space: pre-line;
 `;
 exports.TextAreaValue = styled_components_1.default.div `
@@ -49,17 +50,20 @@ exports.TextAreaValue = styled_components_1.default.div `
     font-family: ${(props) => props.theme.typography.fontFamily.base};
     margin-bottom: ${(props) => props.theme.spacing.m};
     max-width: 66ch;
+    padding-left: ${(props) => props.theme.spacing.l};
     white-space: pre-line;
 `;
 exports.ArrayFieldItem = styled_components_1.default.div `
     break-before: avoid;
     color: ${(props) => props.theme.color.text.default};
     font-family: ${(props) => props.theme.typography.fontFamily.base};
+    padding-left: ${(props) => props.theme.spacing.l};
 `;
 exports.EJSFieldValue = styled_components_1.default.div `
     break-before: avoid;
     color: ${(props) => props.theme.color.text.default};
     font-family: ${(props) => props.theme.typography.fontFamily.base};
+    padding-left: ${(props) => props.theme.spacing.l};
     width: 100%;
 `;
 const NotSelected = styled_components_1.default.div `
@@ -97,6 +101,7 @@ const NotSelectedCircle = styled_components_1.default.span `
 exports.BooleanFieldWrapper = styled_components_1.default.div `
     break-before: avoid;
     font-family: ${(props) => props.theme.typography.fontFamily.base};
+    padding-left: ${(props) => props.theme.spacing.l};
   
 `;
 exports.MultipleChoiceFieldWrapper = styled_components_1.default.div `
@@ -104,6 +109,7 @@ exports.MultipleChoiceFieldWrapper = styled_components_1.default.div `
     label {
         align-items: start;
     }
+    padding-left: ${(props) => props.theme.spacing.l};
 `;
 const BooleanFieldValue = ({ name, className, value, label, }) => {
     return ((0, jsx_runtime_1.jsx)("div", { className: className, children: value === true ? ((0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("span", { children: "\u2713" }), (0, jsx_runtime_1.jsx)("span", { children: label !== undefined ? label : "Selected" })] })) : ((0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("span", { children: "\u2716" }), (0, jsx_runtime_1.jsx)("span", { children: label !== undefined ? label : "Not selected" })] })) }));

package/dist/cjs/FormView/index.js

@@ -14,6 +14,16 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
     for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-__exportStar(require("./fields"), exports);
-__exportStar(require("./templates"), exports);
+exports.FormViewTemplates = exports.FormViewFields = exports.FormViewComponents = void 0;
+__exportStar(require("../utils"), exports);
+__exportStar(require("../common/types"), exports);
+__exportStar(require("../common/constants"), exports);
+__exportStar(require("../common/FileUploadContext"), exports);
+const fields_1 = require("./fields");
+Object.defineProperty(exports, "FormViewFields", { enumerable: true, get: function () { return fields_1.fields; } });
+const components_1 = require("./components");
+Object.defineProperty(exports, "FormViewComponents", { enumerable: true, get: function () { return components_1.components; } });
+const templates_1 = require("./templates");
+Object.defineProperty(exports, "FormViewTemplates", { enumerable: true, get: function () { return templates_1.templates; } });
 __exportStar(require("./FormView"), exports);
+__exportStar(require("./FormViewRegistry"), exports);

package/dist/cjs/FormView/templates/ObjectFieldTemplate/styledComponents.js

@@ -13,7 +13,7 @@ exports.ObjectFieldTemplateTitle = styled_components_1.default.div `
     font-family: ${(props) => props.theme.typography.fontFamily.heading};
     font-size: ${(props) => props.theme.typography.size.h4};
     font-weight: ${(props) => props.theme.typography.weight.bold};
-    margin: ${(props) => `${props.theme.spacing.l} 0`};
+    margin: ${(props) => `${props.theme.spacing.s} 0`};
 `;
 exports.ObjectFieldTemplateDescription = undefined;
 function getComponents(components) {

package/dist/cjs/FormView/types/index.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/dist/cjs/index.js

@@ -10,33 +10,10 @@ var __createBinding = (this && this.__createBinding) || (Object.create ? (functi
     if (k2 === undefined) k2 = k;
     o[k2] = m[k];
 }));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
 var __exportStar = (this && this.__exportStar) || function(m, exports) {
     for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
 };
-var __importStar = (this && this.__importStar) || (function () {
-    var ownKeys = function(o) {
-        ownKeys = Object.getOwnPropertyNames || function (o) {
-            var ar = [];
-            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
-            return ar;
-        };
-        return ownKeys(o);
-    };
-    return function (mod) {
-        if (mod && mod.__esModule) return mod;
-        var result = {};
-        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
-        __setModuleDefault(result, mod);
-        return result;
-    };
-})();
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.view = void 0;
 //This file exists for purpose releasing "moduleResolution": "node" compatible version (until we split this to multiple packages)
 __exportStar(require("./Form"), exports);
-exports.view = __importStar(require("./FormView"));
+__exportStar(require("./FormView"), exports);

package/dist/esm/Form/fields/SearchableMultiTagSelectField/styledComponents.js

@@ -41,7 +41,7 @@ export const SearchableMultiTagSelectFieldOptionList = styled.ul `
   padding: unset;
   margin: unset;
   border: ${(props) => `${props.theme.strokeWidth.thin} solid ${props.theme.color.border.default}`};
-  border-radius: ${(props) => props.theme.borderRadius.s};
+  border-radius: ${(props) => props.theme.borderRadius.none};
   position: absolute;
   background: ${(props) => props.theme.color.background.default};
   top: 100%;

package/dist/esm/FormView/FormView.js

@@ -6,8 +6,8 @@ import { components as defaultComponents } from "./components";
 import { templates as defaultTemplates } from "./templates";
 import { FormViewRegistry } from "./FormViewRegistry";
 export const FormWrapper = styled.div `
-    font-family: ${(props) => props.theme.typography.fontFamily.base};
-    //padding: ${(props) => props.theme.spacing.xxxxxl};
+  font-family: ${(props) => props.theme.typography.fontFamily.base};
+  //padding: ${(props) => props.theme.spacing.xxxxxl};
 `;
 export const FormView = (props) => {
     warnFromUnsupportedKeys("Form", props, [
@@ -22,9 +22,8 @@ export const FormView = (props) => {
         "formContext",
         "components",
         "hideUnmarkedAdditionalProperties",
-        "values",
     ]);
-    const { schema, uiSchema = {}, className, fields = {}, templates = {}, components = {}, formContext = {}, useItemsAsAdditionalItems = false, hideUnmarkedAdditionalProperties = false, values = {}, } = props;
+    const { schema, uiSchema = {}, className, fields = {}, templates = {}, components = {}, formContext = {}, useItemsAsAdditionalItems = false, hideUnmarkedAdditionalProperties = false, } = props;
     const schemaDefinitions = schema.definitions;
     const uiSchemaDefinitions = uiSchema.definitions;
     const registry = {
@@ -39,5 +38,5 @@ export const FormView = (props) => {
     };
     const { Form: FormEl } = registry.components;
     const SchemaField = registry.fields.SchemaField;
-    return (_jsx(FormWrapper, { children: _jsx(FormViewRegistry.Provider, { value: registry, children: _jsx(FormEl, { className: className, children: _jsx(SchemaField, { name: "", schema: schema, uiSchema: uiSchema, values: values }) }) }) }));
+    return (_jsx(FormWrapper, { children: _jsx(FormViewRegistry.Provider, { value: registry, children: _jsx(FormEl, { className: className, children: _jsx(SchemaField, { name: "", schema: schema, uiSchema: uiSchema }) }) }) }));
 };

package/dist/esm/FormView/components/Field.js

@@ -5,7 +5,7 @@ import { getStyle } from "../../utils/getStyle";
 export const FieldWrapper = styled.div `
     color: ${(props) => props.theme.color.text.default};
     font-family: ${(props) => props.theme.typography.fontFamily.base};
-    margin: ${(props) => `${props.theme.spacing.l} 0`};
+    margin: ${(props) => `${props.theme.spacing.l} 0 `};
     width: clamp(20rem, 100%, 70rem);
 `;
 export const FieldTitle = styled.label `
@@ -26,7 +26,7 @@ export const FieldDescription = styled.div `
     font-weight: ${(props) => props.theme.typography.weight.normal};
     font-style: italic;
     font-size: ${(props) => props.theme.typography.size.base};
-    margin-bottom: ${(props) => props.theme.spacing.xs};
+    margin-bottom: ${(props) => props.theme.spacing.s};
     max-width: 66ch;
 `;
 export const StringFieldValue = styled.div `
@@ -35,6 +35,7 @@ export const StringFieldValue = styled.div `
     font-family: ${(props) => props.theme.typography.fontFamily.base};
     margin-bottom: ${(props) => props.theme.spacing.m};
     max-width: 66ch;
+    padding-left: ${(props) => props.theme.spacing.l};
     white-space: pre-line;
 `;
 export const TextAreaValue = styled.div `
@@ -43,17 +44,20 @@ export const TextAreaValue = styled.div `
     font-family: ${(props) => props.theme.typography.fontFamily.base};
     margin-bottom: ${(props) => props.theme.spacing.m};
     max-width: 66ch;
+    padding-left: ${(props) => props.theme.spacing.l};
     white-space: pre-line;
 `;
 export const ArrayFieldItem = styled.div `
     break-before: avoid;
     color: ${(props) => props.theme.color.text.default};
     font-family: ${(props) => props.theme.typography.fontFamily.base};
+    padding-left: ${(props) => props.theme.spacing.l};
 `;
 export const EJSFieldValue = styled.div `
     break-before: avoid;
     color: ${(props) => props.theme.color.text.default};
     font-family: ${(props) => props.theme.typography.fontFamily.base};
+    padding-left: ${(props) => props.theme.spacing.l};
     width: 100%;
 `;
 const NotSelected = styled.div `
@@ -91,6 +95,7 @@ const NotSelectedCircle = styled.span `
 export const BooleanFieldWrapper = styled.div `
     break-before: avoid;
     font-family: ${(props) => props.theme.typography.fontFamily.base};
+    padding-left: ${(props) => props.theme.spacing.l};
   
 `;
 export const MultipleChoiceFieldWrapper = styled.div `
@@ -98,6 +103,7 @@ export const MultipleChoiceFieldWrapper = styled.div `
     label {
         align-items: start;
     }
+    padding-left: ${(props) => props.theme.spacing.l};
 `;
 export const BooleanFieldValue = ({ name, className, value, label, }) => {
     return (_jsx("div", { className: className, children: value === true ? (_jsxs("div", { children: [_jsx("span", { children: "\u2713" }), _jsx("span", { children: label !== undefined ? label : "Selected" })] })) : (_jsxs("div", { children: [_jsx("span", { children: "\u2716" }), _jsx("span", { children: label !== undefined ? label : "Not selected" })] })) }));

package/dist/esm/FormView/index.js

@@ -1,3 +1,10 @@
-export * from "./fields";
-export * from "./templates";
+export * from "../utils";
+export * from "../common/types";
+export * from "../common/constants";
+export * from "../common/FileUploadContext";
+import { fields as FormViewFields } from "./fields";
+import { components as FormViewComponents } from "./components";
+import { templates as FormViewTemplates } from "./templates";
 export * from "./FormView";
+export * from "./FormViewRegistry";
+export { FormViewComponents, FormViewFields, FormViewTemplates };

package/dist/esm/FormView/templates/ObjectFieldTemplate/styledComponents.js

@@ -6,7 +6,7 @@ export const ObjectFieldTemplateTitle = styled.div `
     font-family: ${(props) => props.theme.typography.fontFamily.heading};
     font-size: ${(props) => props.theme.typography.size.h4};
     font-weight: ${(props) => props.theme.typography.weight.bold};
-    margin: ${(props) => `${props.theme.spacing.l} 0`};
+    margin: ${(props) => `${props.theme.spacing.s} 0`};
 `;
 export const ObjectFieldTemplateDescription = undefined;
 export function getComponents(components) {

package/dist/esm/FormView/types/index.js

@@ -0,0 +1 @@
+export {};

package/dist/esm/index.js

@@ -1,3 +1,3 @@
 //This file exists for purpose releasing "moduleResolution": "node" compatible version (until we split this to multiple packages)
 export * from "./Form";
-export * as view from "./FormView";
+export * from "./FormView";

package/dist/types/FormView/FormView.d.ts

@@ -1,6 +1,4 @@
 import type { FormProps } from "../common/types";
 import React from "react";
 export declare const FormWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
-export declare const FormView: <T>(props: FormProps<T> & {
-    values: Record<string, any>;
-}) => import("react/jsx-runtime").JSX.Element;
+export declare const FormView: <T>(props: FormProps<T>) => import("react/jsx-runtime").JSX.Element;

package/dist/types/FormView/index.d.ts

@@ -1,3 +1,11 @@
-export * from "./fields";
-export * from "./templates";
+export * from "../utils";
+export * from "../common/types";
+export * from "../common/constants";
+export * from "../common/FileUploadContext";
+import { fields as FormViewFields } from "./fields";
+import { components as FormViewComponents } from "./components";
+import { templates as FormViewTemplates } from "./templates";
 export * from "./FormView";
+export * from "./FormViewRegistry";
+export { FormViewComponents, FormViewFields, FormViewTemplates };
+export type * from "./types";

package/dist/types/FormView/templates/CollapsibleObjectFieldTemplate/CollapsibleObjectFieldTemplate.d.ts

@@ -1 +1 @@
-export declare const CollapsibleObjectFieldTemplate: import("../../..").Field;
+export declare const CollapsibleObjectFieldTemplate: import("../..").Field;

package/dist/types/FormView/templates/index.d.ts

@@ -13,7 +13,7 @@ export declare const templateComponents: {
     ArrayFieldTemplateDescription: typeof import("../components").FieldDescription | undefined;
 };
 export declare const templates: {
-    CollapsibleObjectFieldTemplate: import("../..").Field;
+    CollapsibleObjectFieldTemplate: import("..").Field;
     ObjectFieldTemplate: React.FC<import("./ObjectFieldTemplate/types").ObjectFieldTemplateProps>;
     FieldTemplate: React.FC<import("./FieldTemplate/types").FieldTemplateProps>;
     ArrayFieldTemplate: React.FC<import("./ArrayFieldTemplate/types").ArrayFieldTemplateProps>;

package/dist/types/FormView/types/index.d.ts

@@ -0,0 +1 @@
+export type * from "./FormViewRegistryContext";

package/dist/types/index.d.ts

@@ -1,2 +1,2 @@
 export * from "./Form";
-export * as view from "./FormView";
+export * from "./FormView";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nolwenture/formik-jsonschema-form",
-  "version": "1.0.0-beta.20",
+  "version": "1.0.0-beta.22",
   "description": "Formik form generation from json schema",
   "author": "anttivikman <antti.vikman@nolwenture.com>",
   "contributors": [