@dxos/react-ui-form 0.8.1-main.ae460ac → 0.8.1-staging.31c3ee1

package/dist/types/src/components/deprecated/Form.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Form.stories.d.ts","sourceRoot":"","sources":["../../../../../src/components/deprecated/Form.stories.tsx"],"names":[],"mappings":"AAIA,OAAO,aAAa,CAAC;AAErB,OAAO,EAAE,KAAK,IAAI,EAAE,KAAK,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAI5D,OAAO,EAAkC,KAAK,QAAQ,EAAE,MAAM,sBAAsB,CAAC;AAGrF,OAAO,EAAkB,KAAK,mBAAmB,EAAE,MAAM,QAAQ,CAAC;AAIlE,QAAA,MAAM,YAAY,UAAW,mBAAmB,4CAM/C,CAAC;AAEF,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,YAAY,CAQnC,CAAC;AAEF,eAAe,IAAI,CAAC;AAEpB,KAAK,KAAK,GAAG,QAAQ,CAAC,mBAAmB,CAAC,QAAQ,CAAC,CAAC,CAAC;AAErD,eAAO,MAAM,OAAO,EAAE,KAMrB,CAAC;AAEF,eAAO,MAAM,KAAK,EAAE,KAKnB,CAAC;AAEF,eAAO,MAAM,QAAQ,EAAE,KAOtB,CAAC"}
+{"version":3,"file":"Form.stories.d.ts","sourceRoot":"","sources":["../../../../../src/components/deprecated/Form.stories.tsx"],"names":[],"mappings":"AAIA,OAAO,aAAa,CAAC;AAErB,OAAO,EAAE,KAAK,IAAI,EAAE,KAAK,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAC5D,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAAkC,KAAK,QAAQ,EAAE,MAAM,sBAAsB,CAAC;AAGrF,OAAO,EAAkB,KAAK,mBAAmB,EAAE,MAAM,QAAQ,CAAC;AAIlE,QAAA,MAAM,YAAY,UAAW,mBAAmB,sBAM/C,CAAC;AAEF,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,YAAY,CAQnC,CAAC;AAEF,eAAe,IAAI,CAAC;AAEpB,KAAK,KAAK,GAAG,QAAQ,CAAC,mBAAmB,CAAC,QAAQ,CAAC,CAAC,CAAC;AAErD,eAAO,MAAM,OAAO,EAAE,KAMrB,CAAC;AAEF,eAAO,MAAM,KAAK,EAAE,KAKnB,CAAC;AAEF,eAAO,MAAM,QAAQ,EAAE,KAOtB,CAAC"}

package/dist/types/src/components/deprecated/FormInput.d.ts

@@ -3,7 +3,7 @@ import { type ThemedClassName } from '@dxos/react-ui';
 /**
  * @deprecated
  */
-export declare const DeprecatedFormContainer: ({ children, classNames }: ThemedClassName<PropsWithChildren>) => import("react/jsx-runtime").JSX.Element;
+export declare const DeprecatedFormContainer: ({ children, classNames }: ThemedClassName<PropsWithChildren>) => JSX.Element;
 export type DeprecatedFormInputProps = {
     label: string;
     description?: JSX.Element;
@@ -12,5 +12,5 @@ export type DeprecatedFormInputProps = {
 /**
  * @deprecated
  */
-export declare const DeprecatedFormInput: ({ label, description, secondary, children, }: PropsWithChildren<DeprecatedFormInputProps>) => import("react/jsx-runtime").JSX.Element;
+export declare const DeprecatedFormInput: ({ label, description, secondary, children, }: PropsWithChildren<DeprecatedFormInputProps>) => JSX.Element;
 //# sourceMappingURL=FormInput.d.ts.map

package/dist/types/src/components/deprecated/FormInput.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FormInput.d.ts","sourceRoot":"","sources":["../../../../../src/components/deprecated/FormInput.tsx"],"names":[],"mappings":"AAIA,OAAc,EAAE,KAAK,GAAG,EAAE,KAAK,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAEhE,OAAO,EAAS,KAAK,eAAe,EAAE,MAAM,gBAAgB,CAAC;AAG7D;;GAEG;AACH,eAAO,MAAM,uBAAuB,6BAA8B,eAAe,CAAC,iBAAiB,CAAC,4CAQnG,CAAC;AAEF,MAAM,MAAM,wBAAwB,GAAG;IACrC,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;IAC1B,SAAS,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;CACzB,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,mBAAmB,iDAK7B,iBAAiB,CAAC,wBAAwB,CAAC,4CAkC7C,CAAC"}
+{"version":3,"file":"FormInput.d.ts","sourceRoot":"","sources":["../../../../../src/components/deprecated/FormInput.tsx"],"names":[],"mappings":"AAIA,OAAc,EAAE,KAAK,GAAG,EAAE,KAAK,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAEhE,OAAO,EAAS,KAAK,eAAe,EAAE,MAAM,gBAAgB,CAAC;AAG7D;;GAEG;AACH,eAAO,MAAM,uBAAuB,6BAA8B,eAAe,CAAC,iBAAiB,CAAC,gBAQnG,CAAC;AAEF,MAAM,MAAM,wBAAwB,GAAG;IACrC,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;IAC1B,SAAS,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;CACzB,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,mBAAmB,iDAK7B,iBAAiB,CAAC,wBAAwB,CAAC,gBAkC7C,CAAC"}

package/dist/types/src/components/index.d.ts

@@ -1,4 +1,5 @@
 export * from './deprecated';
+export * from './ControlSection';
 export * from './FieldEditor';
 export * from './Form';
 export * from './ViewEditor';

package/dist/types/src/components/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/index.ts"],"names":[],"mappings":"AAIA,cAAc,cAAc,CAAC;AAE7B,cAAc,eAAe,CAAC;AAC9B,cAAc,QAAQ,CAAC;AACvB,cAAc,cAAc,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/index.ts"],"names":[],"mappings":"AAIA,cAAc,cAAc,CAAC;AAC7B,cAAc,kBAAkB,CAAC;AACjC,cAAc,eAAe,CAAC;AAC9B,cAAc,QAAQ,CAAC;AACvB,cAAc,cAAc,CAAC"}

package/dist/types/src/components/testing.d.ts

@@ -1,7 +1,7 @@
-import { type PropsWithChildren } from 'react';
+import React, { type PropsWithChildren } from 'react';
 import { type ThemedClassName } from '@dxos/react-ui';
-export declare const TestPanel: ({ classNames, children }: ThemedClassName<PropsWithChildren>) => import("react/jsx-runtime").JSX.Element;
+export declare const TestPanel: ({ classNames, children }: ThemedClassName<PropsWithChildren>) => React.JSX.Element;
 export declare const TestLayout: ({ classNames, json, children }: ThemedClassName<PropsWithChildren<{
     json?: any;
-}>>) => import("react/jsx-runtime").JSX.Element;
+}>>) => React.JSX.Element;
 //# sourceMappingURL=testing.d.ts.map

package/dist/types/src/components/testing.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"testing.d.ts","sourceRoot":"","sources":["../../../../src/components/testing.tsx"],"names":[],"mappings":"AAIA,OAAc,EAAE,KAAK,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAEtD,OAAO,EAAE,KAAK,eAAe,EAAE,MAAM,gBAAgB,CAAC;AAItD,eAAO,MAAM,SAAS,6BAA8B,eAAe,CAAC,iBAAiB,CAAC,4CAIrF,CAAC;AAEF,eAAO,MAAM,UAAU,mCAAoC,eAAe,CAAC,iBAAiB,CAAC;IAAE,IAAI,CAAC,EAAE,GAAG,CAAA;CAAE,CAAC,CAAC,4CAO5G,CAAC"}
+{"version":3,"file":"testing.d.ts","sourceRoot":"","sources":["../../../../src/components/testing.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,EAAE,KAAK,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAEtD,OAAO,EAAE,KAAK,eAAe,EAAE,MAAM,gBAAgB,CAAC;AAItD,eAAO,MAAM,SAAS,6BAA8B,eAAe,CAAC,iBAAiB,CAAC,sBAIrF,CAAC;AAEF,eAAO,MAAM,UAAU,mCAAoC,eAAe,CAAC,iBAAiB,CAAC;IAAE,IAAI,CAAC,EAAE,GAAG,CAAA;CAAE,CAAC,CAAC,sBAO5G,CAAC"}

package/dist/types/src/hooks/useForm.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useForm.d.ts","sourceRoot":"","sources":["../../../../src/hooks/useForm.ts"],"names":[],"mappings":"AAIA,OAAO,EAAoB,KAAK,MAAM,IAAI,CAAC,EAAE,MAAM,QAAQ,CAAC;AAG5D,OAAO,EAAE,KAAK,UAAU,EAAsB,MAAM,mBAAmB,CAAC;AACxE,OAAO,EAAE,KAAK,UAAU,EAAE,KAAK,QAAQ,EAA4C,MAAM,cAAc,CAAC;AAGxG,OAAO,EAAkB,KAAK,eAAe,EAAE,MAAM,cAAc,CAAC;AACpE,OAAO,EAAE,KAAK,YAAY,EAAE,MAAM,YAAY,CAAC;AAE/C;;GAEG;AACH,MAAM,MAAM,WAAW,CAAC,CAAC,SAAS,UAAU,IAAI;IAK9C,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC,CAAC;IACnB,MAAM,EAAE,MAAM,CAAC,QAAQ,EAAE,MAAM,CAAC,CAAC;IACjC,OAAO,EAAE,MAAM,CAAC,QAAQ,EAAE,OAAO,CAAC,CAAC;IACnC,OAAO,EAAE,MAAM,CAAC,QAAQ,EAAE,OAAO,CAAC,CAAC;IACnC,OAAO,EAAE,OAAO,CAAC;IACjB,WAAW,EAAE,OAAO,CAAC;IACrB,UAAU,EAAE,MAAM,IAAI,CAAC;IAMvB,SAAS,EAAE,CAAC,IAAI,EAAE,MAAM,GAAG,CAAC,MAAM,GAAG,MAAM,CAAC,EAAE,KAAK;QAAE,MAAM,CAAC,EAAE,OAAO,CAAC;QAAC,KAAK,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IACxF,QAAQ,EAAE,CAAC,CAAC,EAAE,IAAI,EAAE,CAAC,MAAM,GAAG,MAAM,CAAC,EAAE,KAAK,CAAC,GAAG,SAAS,CAAC;IAC1D,aAAa,EAAE,CAAC,CAAC,EAAE,IAAI,EAAE,CAAC,MAAM,GAAG,MAAM,CAAC,EAAE,EAAE,IAAI,EAAE,UAAU,EAAE,KAAK,EAAE,CAAC,KAAK,IAAI,CAAC;IAClF,SAAS,EAAE,CAAC,IAAI,EAAE,CAAC,MAAM,GAAG,MAAM,CAAC,EAAE,KAAK,IAAI,CAAC;CAChD,CAAC;AAEF;;GAEG;AACH,MAAM,WAAW,WAAW,CAAC,CAAC,SAAS,UAAU;IAC/C;;OAEG;IACH,MAAM,EAAE,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC;IAEpB;;OAEG;IACH,aAAa,EAAE,OAAO,CAAC,CAAC,CAAC,CAAC;IAE1B;;;;OAIG;IACH,eAAe,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC,KAAK,IAAI,CAAC;IAE/C;;;;OAIG;IAEH,UAAU,CAAC,EAAE,CAAC,MAAM,EAAE,CAAC,KAAK,eAAe,EAAE,GAAG,SAAS,CAAC;IAE1D;;OAEG;IACH,OAAO,CAAC,EAAE,CAAC,MAAM,EAAE,CAAC,EAAE,IAAI,EAAE;QAAE,OAAO,EAAE,WAAW,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,CAAA;KAAE,KAAK,IAAI,CAAC;IAE5E;;OAEG;IACH,MAAM,CAAC,EAAE,CAAC,MAAM,EAAE,CAAC,EAAE,IAAI,EAAE;QAAE,OAAO,EAAE,WAAW,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,CAAA;KAAE,KAAK,YAAY,CAAC,IAAI,CAAC,CAAC;CAC1F;AAED;;;GAGG;AACH,eAAO,MAAM,OAAO,GAAI,CAAC,SAAS,UAAU,4EAOzC,WAAW,CAAC,CAAC,CAAC,KAAG,WAAW,CAAC,CAAC,CA0KhC,CAAC"}
+{"version":3,"file":"useForm.d.ts","sourceRoot":"","sources":["../../../../src/hooks/useForm.ts"],"names":[],"mappings":"AAIA,OAAO,EAAoB,KAAK,MAAM,IAAI,CAAC,EAAE,MAAM,QAAQ,CAAC;AAG5D,OAAO,EAAE,KAAK,UAAU,EAAsB,MAAM,mBAAmB,CAAC;AACxE,OAAO,EAAE,KAAK,UAAU,EAAE,KAAK,QAAQ,EAA4C,MAAM,cAAc,CAAC;AAGxG,OAAO,EAAkB,KAAK,eAAe,EAAE,MAAM,cAAc,CAAC;AACpE,OAAO,EAAE,KAAK,YAAY,EAAE,MAAM,YAAY,CAAC;AAE/C;;GAEG;AACH,MAAM,MAAM,WAAW,CAAC,CAAC,SAAS,UAAU,IAAI;IAK9C,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC,CAAC;IACnB,MAAM,EAAE,MAAM,CAAC,QAAQ,EAAE,MAAM,CAAC,CAAC;IACjC,OAAO,EAAE,MAAM,CAAC,QAAQ,EAAE,OAAO,CAAC,CAAC;IACnC,OAAO,EAAE,MAAM,CAAC,QAAQ,EAAE,OAAO,CAAC,CAAC;IACnC,OAAO,EAAE,OAAO,CAAC;IACjB,WAAW,EAAE,OAAO,CAAC;IACrB,UAAU,EAAE,MAAM,IAAI,CAAC;IAMvB,SAAS,EAAE,CAAC,IAAI,EAAE,MAAM,GAAG,CAAC,MAAM,GAAG,MAAM,CAAC,EAAE,KAAK;QAAE,MAAM,CAAC,EAAE,OAAO,CAAC;QAAC,KAAK,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IACxF,QAAQ,EAAE,CAAC,CAAC,EAAE,IAAI,EAAE,CAAC,MAAM,GAAG,MAAM,CAAC,EAAE,KAAK,CAAC,GAAG,SAAS,CAAC;IAC1D,aAAa,EAAE,CAAC,CAAC,EAAE,IAAI,EAAE,CAAC,MAAM,GAAG,MAAM,CAAC,EAAE,EAAE,IAAI,EAAE,UAAU,EAAE,KAAK,EAAE,CAAC,KAAK,IAAI,CAAC;IAClF,SAAS,EAAE,CAAC,IAAI,EAAE,CAAC,MAAM,GAAG,MAAM,CAAC,EAAE,KAAK,IAAI,CAAC;CAChD,CAAC;AAEF;;GAEG;AACH,MAAM,WAAW,WAAW,CAAC,CAAC,SAAS,UAAU;IAC/C;;OAEG;IACH,MAAM,EAAE,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC;IAEpB;;OAEG;IACH,aAAa,EAAE,OAAO,CAAC,CAAC,CAAC,CAAC;IAE1B;;;;OAIG;IACH,eAAe,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC,KAAK,IAAI,CAAC;IAE/C;;;;OAIG;IAEH,UAAU,CAAC,EAAE,CAAC,MAAM,EAAE,CAAC,KAAK,eAAe,EAAE,GAAG,SAAS,CAAC;IAE1D;;OAEG;IACH,OAAO,CAAC,EAAE,CAAC,MAAM,EAAE,CAAC,EAAE,IAAI,EAAE;QAAE,OAAO,EAAE,WAAW,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,CAAA;KAAE,KAAK,IAAI,CAAC;IAE5E;;OAEG;IACH,MAAM,CAAC,EAAE,CAAC,MAAM,EAAE,CAAC,EAAE,IAAI,EAAE;QAAE,OAAO,EAAE,WAAW,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,CAAA;KAAE,KAAK,YAAY,CAAC,IAAI,CAAC,CAAC;CAC1F;AAED;;;GAGG;AACH,eAAO,MAAM,OAAO,GAAI,CAAC,SAAS,UAAU,4EAOzC,WAAW,CAAC,CAAC,CAAC,KAAG,WAAW,CAAC,CAAC,CAmLhC,CAAC"}

package/dist/types/src/translations.d.ts

@@ -3,6 +3,7 @@ declare const _default: {
     'en-US': {
         "react-ui-form": {
             'fields label': string;
+            'hidden fields label': string;
             'button add property': string;
             'field property label': string;
             'field property placeholder': string;

package/dist/types/src/translations.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"translations.d.ts","sourceRoot":"","sources":["../../../src/translations.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,cAAc,kBAAkB,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAE9C,wBA4DE"}
+{"version":3,"file":"translations.d.ts","sourceRoot":"","sources":["../../../src/translations.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,cAAc,kBAAkB,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAE9C,wBA6DE"}

package/dist/types/src/util/field.d.ts

@@ -17,6 +17,5 @@ export type CellClassesForFieldTypeProps = {
     format?: FormatEnum;
 };
 export declare const cellClassesForFieldType: ({ type, format }: CellClassesForFieldTypeProps) => string[] | undefined;
-export declare const cellClassesForRowSelection: (selected: boolean) => string[] | undefined;
 export declare const pathNotUniqueError: (path: string) => ValidationError;
 //# sourceMappingURL=field.d.ts.map

package/dist/types/src/util/field.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"field.d.ts","sourceRoot":"","sources":["../../../../src/util/field.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,UAAU,EAAe,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AACtE,OAAO,EAAE,KAAK,eAAe,EAAE,MAAM,cAAc,CAAC;AAEpD;;;;;GAKG;AACH,MAAM,MAAM,UAAU,GAAG;IACvB,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,MAAM,CAAC,EAAE,UAAU,CAAC;IACpB,KAAK,EAAE,GAAG,CAAC;CACZ,CAAC;AAEF,eAAO,MAAM,UAAU,4BAA6B,UAAU,QAsF7D,CAAC;AAGF,MAAM,MAAM,4BAA4B,GAAG;IACzC,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,MAAM,CAAC,EAAE,UAAU,CAAC;CACrB,CAAC;AAEF,eAAO,MAAM,uBAAuB,qBAAsB,4BAA4B,KAAG,MAAM,EAAE,GAAG,SAiCnG,CAAC;AAEF,eAAO,MAAM,0BAA0B,aAAc,OAAO,yBAAsD,CAAC;AAGnH,eAAO,MAAM,kBAAkB,SAAU,MAAM,KAAG,eAGhD,CAAC"}
+{"version":3,"file":"field.d.ts","sourceRoot":"","sources":["../../../../src/util/field.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,UAAU,EAAe,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AACtE,OAAO,EAAE,KAAK,eAAe,EAAE,MAAM,cAAc,CAAC;AAEpD;;;;;GAKG;AACH,MAAM,MAAM,UAAU,GAAG;IACvB,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,MAAM,CAAC,EAAE,UAAU,CAAC;IACpB,KAAK,EAAE,GAAG,CAAC;CACZ,CAAC;AAEF,eAAO,MAAM,UAAU,4BAA6B,UAAU,QAsF7D,CAAC;AAGF,MAAM,MAAM,4BAA4B,GAAG;IACzC,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,MAAM,CAAC,EAAE,UAAU,CAAC;CACrB,CAAC;AAEF,eAAO,MAAM,uBAAuB,qBAAsB,4BAA4B,KAAG,MAAM,EAAE,GAAG,SAmCnG,CAAC;AAGF,eAAO,MAAM,kBAAkB,SAAU,MAAM,KAAG,eAGhD,CAAC"}

package/dist/types/src/util/formatting.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"formatting.d.ts","sourceRoot":"","sources":["../../../../src/util/formatting.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,UAAU,EAAe,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAEtE,KAAK,gBAAgB,GAAG;IACtB,IAAI,EAAE,QAAQ,CAAC;IACf,MAAM,CAAC,EAAE,UAAU,GAAG,SAAS,CAAC;IAChC,KAAK,EAAE,GAAG,CAAC;IACX,MAAM,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;CAC7B,CAAC;AAEF;;;GAGG;AAGH,eAAO,MAAM,gBAAgB,oCAAiD,gBAAgB,KAAG,MA4EhG,CAAC;AAEF,eAAO,MAAM,gBAAgB,oCAAiD,gBAAgB,KAAG,MA8DhG,CAAC"}
+{"version":3,"file":"formatting.d.ts","sourceRoot":"","sources":["../../../../src/util/formatting.ts"],"names":[],"mappings":"AAMA,OAAO,EAAE,UAAU,EAAe,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAEtE,KAAK,gBAAgB,GAAG;IACtB,IAAI,EAAE,QAAQ,CAAC;IACf,MAAM,CAAC,EAAE,UAAU,GAAG,SAAS,CAAC;IAChC,KAAK,EAAE,GAAG,CAAC;IACX,MAAM,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;CAC7B,CAAC;AAEF;;;GAGG;AAGH,eAAO,MAAM,gBAAgB,oCAAiD,gBAAgB,KAAG,MAyEhG,CAAC;AAEF,eAAO,MAAM,gBAAgB,oCAAiD,gBAAgB,KAAG,MA8DhG,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dxos/react-ui-form",
-  "version": "0.8.1-main.ae460ac",
+  "version": "0.8.1-staging.31c3ee1",
   "description": "Data components.",
   "homepage": "https://dxos.org",
   "bugs": "https://github.com/dxos/dxos/issues",
@@ -28,46 +28,46 @@
     "@radix-ui/react-context": "1.1.1",
     "date-fns": "^3.3.1",
     "jsonpath": "^1.1.1",
-    "@dxos/async": "0.8.1-main.ae460ac",
-    "@dxos/echo-db": "0.8.1-main.ae460ac",
-    "@dxos/debug": "0.8.1-main.ae460ac",
-    "@dxos/echo-schema": "0.8.1-main.ae460ac",
-    "@dxos/invariant": "0.8.1-main.ae460ac",
-    "@dxos/keys": "0.8.1-main.ae460ac",
-    "@dxos/live-object": "0.8.1-main.ae460ac",
-    "@dxos/log": "0.8.1-main.ae460ac",
-    "@dxos/react-ui-list": "0.8.1-main.ae460ac",
-    "@dxos/react-ui-pickers": "0.8.1-main.ae460ac",
-    "@dxos/effect": "0.8.1-main.ae460ac",
-    "@dxos/react-ui-types": "0.8.1-main.ae460ac",
-    "@dxos/react-client": "0.8.1-main.ae460ac",
-    "@dxos/schema": "0.8.1-main.ae460ac",
-    "@dxos/util": "0.8.1-main.ae460ac"
+    "@dxos/async": "0.8.1-staging.31c3ee1",
+    "@dxos/debug": "0.8.1-staging.31c3ee1",
+    "@dxos/effect": "0.8.1-staging.31c3ee1",
+    "@dxos/echo-db": "0.8.1-staging.31c3ee1",
+    "@dxos/echo-schema": "0.8.1-staging.31c3ee1",
+    "@dxos/invariant": "0.8.1-staging.31c3ee1",
+    "@dxos/keys": "0.8.1-staging.31c3ee1",
+    "@dxos/log": "0.8.1-staging.31c3ee1",
+    "@dxos/live-object": "0.8.1-staging.31c3ee1",
+    "@dxos/react-client": "0.8.1-staging.31c3ee1",
+    "@dxos/react-ui-list": "0.8.1-staging.31c3ee1",
+    "@dxos/react-ui-pickers": "0.8.1-staging.31c3ee1",
+    "@dxos/react-ui-types": "0.8.1-staging.31c3ee1",
+    "@dxos/util": "0.8.1-staging.31c3ee1",
+    "@dxos/schema": "0.8.1-staging.31c3ee1"
   },
   "devDependencies": {
     "@phosphor-icons/react": "^2.1.5",
     "@types/jsonpath": "^0.2.4",
     "@types/react": "~18.2.0",
     "@types/react-dom": "~18.2.0",
-    "effect": "^3.12.3",
+    "effect": "3.13.3",
     "fast-check": "^3.19.0",
     "react": "~18.2.0",
     "react-dom": "~18.2.0",
     "vite": "5.4.7",
-    "@dxos/echo-signals": "0.8.1-main.ae460ac",
-    "@dxos/random": "0.8.1-main.ae460ac",
-    "@dxos/react-ui-syntax-highlighter": "0.8.1-main.ae460ac",
-    "@dxos/react-ui": "0.8.1-main.ae460ac",
-    "@dxos/react-ui-theme": "0.8.1-main.ae460ac",
-    "@dxos/storybook-utils": "0.8.1-main.ae460ac"
+    "@dxos/random": "0.8.1-staging.31c3ee1",
+    "@dxos/react-ui": "0.8.1-staging.31c3ee1",
+    "@dxos/echo-signals": "0.8.1-staging.31c3ee1",
+    "@dxos/react-ui-syntax-highlighter": "0.8.1-staging.31c3ee1",
+    "@dxos/storybook-utils": "0.8.1-staging.31c3ee1",
+    "@dxos/react-ui-theme": "0.8.1-staging.31c3ee1"
   },
   "peerDependencies": {
     "@phosphor-icons/react": "^2.1.5",
-    "effect": "^3.12.3",
+    "effect": "3.13.3",
     "react": "~18.2.0",
     "react-dom": "~18.2.0",
-    "@dxos/react-ui": "0.8.1-main.ae460ac",
-    "@dxos/react-ui-theme": "0.8.1-main.ae460ac"
+    "@dxos/react-ui-theme": "0.8.1-staging.31c3ee1",
+    "@dxos/react-ui": "0.8.1-staging.31c3ee1"
   },
   "publishConfig": {
     "access": "public"

package/src/components/ControlSection.tsx

@@ -0,0 +1,113 @@
+//
+// Copyright 2025 DXOS.org
+//
+
+import React, { type PropsWithChildren } from 'react';
+
+import { type Label, toLocalizedString, useTranslation, Input } from '@dxos/react-ui';
+
+import { translationKey } from '../translations';
+
+// TODO(wittjosiah): Copied from @dxos/plugin-client. Reconcile/factor out.
+
+export type ControlSectionProps = PropsWithChildren<{
+  title: Label;
+  description?: Label;
+}>;
+
+export const ControlSectionHeading = ({ title, description }: Omit<ControlSectionProps, 'children'>) => {
+  const { t } = useTranslation(translationKey);
+  return (
+    <>
+      <h2 className='pli-4 container-max-width text-xl mbs-6 mbe-4'>{toLocalizedString(title, t)}</h2>
+      {description && (
+        <p className='pli-4 mlb-4 container-max-width text-description'>{toLocalizedString(description, t)}</p>
+      )}
+    </>
+  );
+};
+
+export const ControlSection = ({ title, description, children }: ControlSectionProps) => {
+  return (
+    <>
+      <ControlSectionHeading title={title} description={description} />
+      {children}
+    </>
+  );
+};
+
+export type ControlGroupProps = PropsWithChildren<{}>;
+
+export const ControlGroup = ({ children }: ControlGroupProps) => (
+  <div role='none' className='group container-max-width grid grid-cols-1 md:grid-cols-[1fr_min-content] gap-4'>
+    {children}
+  </div>
+);
+
+export const ControlFrame = ({ children }: ControlGroupProps) => (
+  <div
+    role='none'
+    className='p-4 border border-separator rounded-lg container-max-width grid grid-cols-1 md:grid-cols-[1fr_1fr] gap-2 md:gap-8'
+  >
+    {children}
+  </div>
+);
+
+export type ControlItemProps = PropsWithChildren<{
+  title: Label;
+  description?: Label;
+}>;
+
+export const controlItemClasses =
+  'p-4 border border-separator rounded-lg container-max-width grid md:col-span-2 grid-cols-subgrid items-center';
+
+const controlItemTitleClasses = 'text-lg font-normal mbe-2';
+const controlItemDescriptionClasses = 'text-base mlb-2 md:mbe-0 text-description';
+
+export const ControlItem = ({ title, description, children }: ControlItemProps) => {
+  const { t } = useTranslation(translationKey);
+
+  return (
+    <div className={controlItemClasses}>
+      <div role='none'>
+        <h3 className={controlItemTitleClasses}>{toLocalizedString(title, t)}</h3>
+        {description && <p className={controlItemDescriptionClasses}>{toLocalizedString(description, t)}</p>}
+      </div>
+      {children}
+    </div>
+  );
+};
+
+export const ControlItemInput = ({ title, description, children }: ControlItemProps) => {
+  const { t } = useTranslation(translationKey);
+
+  return (
+    <Input.Root>
+      <div className={controlItemClasses}>
+        <div role='none'>
+          <Input.Label classNames={controlItemTitleClasses}>{toLocalizedString(title, t)}</Input.Label>
+          {description && (
+            <Input.DescriptionAndValidation>
+              <Input.Description classNames={controlItemDescriptionClasses}>
+                {toLocalizedString(description, t)}
+              </Input.Description>
+            </Input.DescriptionAndValidation>
+          )}
+        </div>
+        {children}
+      </div>
+    </Input.Root>
+  );
+};
+
+export const ControlFrameItem = ({ title, description, children }: ControlItemProps) => {
+  const { t } = useTranslation(translationKey);
+
+  return (
+    <div role='group' className='min-is-0'>
+      <h3 className='text-lg mbe-2'>{toLocalizedString(title, t)}</h3>
+      {description && <p className='mlb-2 md:mbe-0 text-description'>{toLocalizedString(description, t)}</p>}
+      {children}
+    </div>
+  );
+};

package/src/components/FieldEditor/FieldEditor.stories.tsx

@@ -49,7 +49,7 @@ type Story = StoryObj<StoryProps>;
 
 export const Default: Story = {
   args: {
-    projection: new ViewProjection(createEchoSchema(TestSchema), testView),
+    projection: new ViewProjection(createEchoSchema(TestSchema).jsonSchema, testView),
     view: testView,
     field: testView.fields[0],
   },

package/src/components/Form/Form.stories.tsx

@@ -78,7 +78,7 @@ export const Default: Story<TestType> = {
   },
 };
 
-export const Org: Story<Testing.OrgSchemaType> = {
+export const Org: Story<Testing.Org> = {
   args: {
     schema: Testing.OrgSchema,
     values: {
@@ -88,7 +88,7 @@ export const Org: Story<Testing.OrgSchemaType> = {
   },
 };
 
-export const OrgAutoSave: Story<Testing.OrgSchemaType> = {
+export const OrgAutoSave: Story<Testing.Org> = {
   args: {
     schema: Testing.OrgSchema,
     values: {

package/src/components/Form/Input.tsx

@@ -17,7 +17,7 @@ import { type FormInputStateProps } from './FormContext';
 export type InputProps = {
   type: SimpleType;
   format?: FormatEnum;
-  label?: string;
+  label: string;
   disabled?: boolean;
   placeholder?: string;
   inputOnly?: boolean;

package/src/components/Form/custom/SelectOptionsInput.tsx

@@ -154,7 +154,11 @@ export const SelectOptionInput = ({ type, label, disabled, getStatus, getValue,
                               data-no-submit
                             />
                             <Toolbar.Root classNames='p-0 m-0 !is-auto'>
-                              <HuePicker value={item.color} onChange={handleColorChange(item.id)} />
+                              <HuePicker
+                                value={item.color}
+                                onChange={handleColorChange(item.id)}
+                                rootVariant='toolbar-button'
+                              />
                             </Toolbar.Root>
                             <IconButton
                               icon='ph--trash--fill'

package/src/components/Form/index.ts

@@ -2,11 +2,9 @@
 // Copyright 2024 DXOS.org
 //
 
-import { useFormValues } from './FormContext';
-
 export * from './custom';
 
 export * from './Defaults';
 export * from './Form';
+export * from './FormContext';
 export * from './Input';
-export { useFormValues };

package/src/components/ViewEditor/ViewEditor.stories.tsx

@@ -33,7 +33,7 @@ const DefaultStory = () => {
 
       const [schema] = await space.db.schemaRegistry.register([TestSchema]);
       const view = createView({ name: 'Test', typename: schema.typename, jsonSchema: toJsonSchema(TestSchema) });
-      const projection = new ViewProjection(schema, view);
+      const projection = new ViewProjection(schema.jsonSchema, view);
 
       setSchema(schema);
       setView(view);

package/src/components/ViewEditor/ViewEditor.tsx

@@ -5,7 +5,8 @@
 import React, { useCallback, useMemo, useState } from 'react';
 
 import { type SchemaRegistry } from '@dxos/echo-db';
-import { AST, Format, type EchoSchema, S } from '@dxos/echo-schema';
+import { AST, Format, type BaseSchema, S, type JsonProp } from '@dxos/echo-schema';
+import { invariant } from '@dxos/invariant';
 import { IconButton, type ThemedClassName, useTranslation } from '@dxos/react-ui';
 import { List } from '@dxos/react-ui-list';
 import { ghostHover, inputTextLabel, mx } from '@dxos/react-ui-theme';
@@ -29,13 +30,13 @@ const ViewMetaSchema = S.Struct({
 type ViewMetaType = S.Schema.Type<typeof ViewMetaSchema>;
 
 export type ViewEditorProps = ThemedClassName<{
-  schema: EchoSchema;
+  schema: BaseSchema;
   view: ViewType;
   registry?: SchemaRegistry;
   readonly?: boolean;
   showHeading?: boolean;
-  onTypenameChanged: (typename: string) => void;
-  onDelete: (fieldId: string) => void;
+  onTypenameChanged?: (typename: string) => void;
+  onDelete?: (fieldId: string) => void;
 }>;
 
 /**
@@ -52,7 +53,7 @@ export const ViewEditor = ({
   onDelete,
 }: ViewEditorProps) => {
   const { t } = useTranslation(translationKey);
-  const projection = useMemo(() => new ViewProjection(schema, view), [schema, view]);
+  const projection = useMemo(() => new ViewProjection(schema.jsonSchema, view), [schema, view]);
   const [field, setField] = useState<FieldType>();
 
   // TODO(burdon): Should be reactive.
@@ -65,45 +66,86 @@ export const ViewEditor = ({
     };
   }, [view]);
 
-  const handleViewUpdate = useCallback(
+  const handleSelect = useCallback((field: FieldType) => {
+    setField((f) => (f === field ? undefined : field));
+  }, []);
+
+  // TODO(burdon): Check if mutable; variant of useCallback that return undefined if readonly?
+
+  const handleAdd = useCallback(() => {
+    invariant(!schema.readonly);
+    const field = projection.createFieldProjection();
+    setField(field);
+  }, [schema, view]);
+
+  const handleUpdate = useCallback(
     ({ name, typename }: ViewMetaType) => {
+      invariant(!schema.readonly);
       requestAnimationFrame(() => {
         if (view.name !== name) {
           view.name = name;
         }
+
         if (view.query.typename !== typename) {
-          onTypenameChanged(typename);
+          onTypenameChanged?.(typename);
         }
       });
     },
-    [view, schema, onTypenameChanged],
+    [schema, view, onTypenameChanged],
   );
 
-  const handleSelect = useCallback((field: FieldType) => {
-    setField((f) => (f === field ? undefined : field));
-  }, []);
+  const handleDelete = useCallback(
+    (fieldId: string) => {
+      invariant(!schema.readonly);
+      if (fieldId === field?.id) {
+        setField(undefined);
+      }
 
-  const handleAdd = useCallback(() => {
-    const field = projection.createFieldProjection();
-    setField(field);
-  }, [view]);
+      onDelete?.(fieldId);
+    },
+    [schema, field, onDelete],
+  );
 
   const handleMove = useCallback(
     (fromIndex: number, toIndex: number) => {
+      invariant(!schema.readonly);
       // NOTE(ZaymonFC): Using arrayMove here causes a race condition with the kanban model.
       const fields = [...view.fields];
       const [moved] = fields.splice(fromIndex, 1);
       fields.splice(toIndex, 0, moved);
       view.fields = fields;
     },
-    [view.fields],
+    [schema, view.fields],
   );
 
   const handleClose = useCallback(() => setField(undefined), []);
 
+  const hiddenProperties = projection.getHiddenProperties();
+
+  const handleHide = useCallback(
+    (fieldId: string) => {
+      setField(undefined);
+      projection.hideFieldProjection(fieldId);
+    },
+    [projection],
+  );
+
+  const handleShow = useCallback(
+    (property: string) => {
+      setField(undefined);
+      projection.showFieldProjection(property as JsonProp);
+    },
+    [projection],
+  );
+
   return (
     <div role='none' className={mx('flex flex-col w-full divide-y divide-separator', classNames)}>
-      <Form<ViewMetaType> autoSave schema={ViewMetaSchema} values={viewValues} onSave={handleViewUpdate} />
+      <Form<ViewMetaType>
+        autoSave
+        schema={ViewMetaSchema}
+        values={viewValues}
+        onSave={schema.readonly ? undefined : handleUpdate}
+      />
 
       <div>
         {/* TODO(burdon): Clean up common form ux. */}
@@ -115,7 +157,7 @@ export const ViewEditor = ({
           items={view.fields}
           isItem={S.is(FieldSchema)}
           getId={(field) => field.id}
-          onMove={handleMove}
+          onMove={schema.readonly ? undefined : handleMove}
         >
           {({ items: fields }) => (
             <>
@@ -131,13 +173,56 @@ export const ViewEditor = ({
                   <List.Item<FieldType> key={field.id} item={field} classNames={mx(grid, ghostHover, 'cursor-pointer')}>
                     <List.ItemDragHandle />
                     <List.ItemTitle onClick={() => handleSelect(field)}>{field.path}</List.ItemTitle>
-                    <List.ItemDeleteButton disabled={view.fields.length <= 1} onClick={() => onDelete(field.id)} />
+                    <div className='flex items-center gap-2 -ml-4'>
+                      <List.ItemButton
+                        icon='ph--eye-slash--regular'
+                        disabled={view.fields.length <= 1}
+                        onClick={() => handleHide(field.id)}
+                      />
+                      {!schema.readonly && (
+                        <List.ItemDeleteButton
+                          icon='ph--trash--regular'
+                          disabled={view.fields.length <= 1}
+                          onClick={() => handleDelete(field.id)}
+                        />
+                      )}
+                    </div>
                   </List.Item>
                 ))}
               </div>
             </>
           )}
         </List.Root>
+
+        {hiddenProperties.length > 0 && (
+          <div>
+            <div role='none' className='p-2'>
+              <label className={mx(inputTextLabel)}>{t('hidden fields label')}</label>
+            </div>
+
+            <List.Root<string>
+              items={hiddenProperties}
+              isItem={(item): item is string => typeof item === 'string'}
+              getId={(property) => property}
+            >
+              {({ items: properties }) => (
+                <div role='list' className='flex flex-col w-full'>
+                  {properties?.map((property) => (
+                    <List.Item<string>
+                      key={property}
+                      item={property}
+                      classNames={mx(grid, ghostHover, 'cursor-pointer')}
+                    >
+                      <div />
+                      <List.ItemTitle>{property}</List.ItemTitle>
+                      <List.ItemButton icon='ph--eye--regular' onClick={() => handleShow(property)} />
+                    </List.Item>
+                  ))}
+                </div>
+              )}
+            </List.Root>
+          </div>
+        )}
       </div>
 
       {field && (
@@ -156,7 +241,7 @@ export const ViewEditor = ({
           <IconButton
             icon='ph--plus--regular'
             label={t('button add property')}
-            onClick={handleAdd}
+            onClick={schema.readonly ? undefined : handleAdd}
             // TODO(burdon): Show field limit in ux (not tooltip).
             disabled={view.fields.length >= VIEW_FIELD_LIMIT}
           />

package/src/components/index.ts

@@ -3,7 +3,7 @@
 //
 
 export * from './deprecated';
-
+export * from './ControlSection';
 export * from './FieldEditor';
 export * from './Form';
 export * from './ViewEditor';

package/src/hooks/useForm.ts

@@ -176,12 +176,21 @@ export const useForm = <T extends BaseObject>({
           errorPath === jsonPath || errorPath.startsWith(`${jsonPath}.`) || errorPath.startsWith(`${jsonPath}[`),
       );
 
+      // Only show errors for touched fields.
+      const isTouched = touched[jsonPath as JsonPath];
+      if (!isTouched) {
+        return {
+          status: undefined,
+          error: undefined,
+        };
+      }
+
       return {
         status: matchingError ? 'error' : undefined,
         error: matchingError ? matchingError[1] : undefined,
       };
     },
-    [errors],
+    [errors, touched],
   );
 
   const getFormValue = useCallback<FormHandler<T>['getValue']>(

package/src/translations.ts

@@ -9,6 +9,7 @@ export default [
     'en-US': {
       [translationKey]: {
         'fields label': 'Fields',
+        'hidden fields label': 'Hidden Fields',
 
         // TODO(burdon): Standardize field/property.
         'button add property': 'Add property',