@genesislcap/foundation-forms 14.427.0 → 14.427.2-alpha-e0ffaad.0

package/dist/esm/jsonforms/renderers/VerticalCategorizationWrapperRenderer.js

@@ -1,6 +1,6 @@
 import { __decorate } from "tslib";
 import { attr, css, customElement, html, repeat, when, } from '@microsoft/fast-element';
-import { CategorizationWrapper, tabControlIconStyles } from './CategorizationWrapperRenderer';
+import { CategorizationWrapper } from './CategorizationWrapperRenderer';
 export const VerticalCategorizationWrapperRendererTemplate = (prefix = 'zero') => html `
   <template>
     <${prefix}-tabs class="tabs-container" orientation="vertical">
@@ -37,12 +37,12 @@ export const VerticalCategorizationWrapperRendererTemplate = (prefix = 'zero') =
   </template>
 `;
 const styles = css `
-  :host {
+  vertical-categorization-wrapper {
     display: block;
     height: var(--vertical-categorization-height, auto);
     overflow: hidden;
   }
-  .tabs-container::part(tablist) {
+  vertical-categorization-wrapper .tabs-container::part(tablist) {
     display: flex;
     flex-direction: column;
     height: auto;
@@ -55,11 +55,11 @@ const styles = css `
     padding: 0;
   }
 
-  .tabs-container .tab-control {
+  vertical-categorization-wrapper .tabs-container .tab-control {
     padding: 0 calc((8 + var(--design-unit) * 2 * var(--density)) * 1px);
   }
 
-  .tab-label {
+  vertical-categorization-wrapper .tab-label {
     display: flex;
     align-items: center;
     width: 100%;
@@ -68,20 +68,23 @@ const styles = css `
     border-radius: 0 3px 3px 0;
   }
 
-  .tab-control[aria-selected='true'] .tab-label {
+  vertical-categorization-wrapper .tab-control[aria-selected='true'] .tab-label {
     border-left-color: var(--accent-fill-rest);
     background: var(--neutral-fill-active);
   }
 
-  ${tabControlIconStyles}
+  vertical-categorization-wrapper .tab-control-icon {
+    margin-left: 3px;
+    color: #f9644d;
+  }
 
-  .tabs-container::part(tabpanel) {
+  vertical-categorization-wrapper .tabs-container::part(tabpanel) {
     border: none;
     overflow-y: auto;
     height: 100%;
   }
 
-  .tab-panel-control {
+  vertical-categorization-wrapper .tab-panel-control {
     border: none;
     padding-left: 16px;
   }
@@ -108,6 +111,7 @@ VerticalCategorizationWrapper = __decorate([
     customElement({
         name: 'vertical-categorization-wrapper',
         styles,
+        shadowOptions: null,
         template: html `
     ${(x) => VerticalCategorizationWrapperRendererTemplate(x.form.prefix)}
   `,

package/dist/esm/jsonforms/renderers/dispatch-renderer.js

@@ -94,6 +94,7 @@ DispatchRenderer = __decorate([
         name: 'dispatch-renderer',
         template: template,
         styles: styles,
+        shadowOptions: null,
     })
 ], DispatchRenderer);
 export { DispatchRenderer };

package/dist/esm/jsonforms/testers/isOneOfNumber.js

@@ -1,5 +1,6 @@
 import { hasType, or, schemaMatches } from '@jsonforms/core';
 import { GenesisType } from '../../utils/types';
+import { optionIs } from './optionIs';
 const hasTypeNumberOrInteger = (schema) => hasType(schema, 'number') || hasType(schema, 'integer');
 const isNumberGenesisType = (s) => s.genesisType === GenesisType.DOUBLE ||
     s.genesisType === GenesisType.INT ||
@@ -9,4 +10,4 @@ const isNumberGenesisType = (s) => s.genesisType === GenesisType.DOUBLE ||
 const isNumberByGenesisType = schemaMatches(isNumberGenesisType);
 export const isOneOfNumber = or(schemaMatches((schema) => hasTypeNumberOrInteger(schema) ||
     (schema.hasOwnProperty('oneOf') &&
-        schema.oneOf.some((s) => hasTypeNumberOrInteger(s)))), isNumberByGenesisType, schemaMatches((schema) => schema.hasOwnProperty('oneOf') && schema.oneOf.some((s) => isNumberGenesisType(s))));
+        schema.oneOf.some((s) => hasTypeNumberOrInteger(s)))), isNumberByGenesisType, schemaMatches((schema) => schema.hasOwnProperty('oneOf') && schema.oneOf.some((s) => isNumberGenesisType(s))), optionIs('useNumberControl'));

package/dist/foundation-forms.api.json

@@ -562,6 +562,62 @@
             "endIndex": 6
           }
         },
+        {
+          "kind": "Function",
+          "canonicalReference": "@genesislcap/foundation-forms!controlWrapperTemplate:function(1)",
+          "docComment": "/**\n * Light-DOM-friendly control wrapper that replaces the former `<control-wrapper>` custom element. Renders label, error/description slots, and composes a provided inner control template inline within the renderer's template so that bindings stay on the `DispatchRenderer` source.\n *\n * @public\n */\n",
+          "excerptTokens": [
+            {
+              "kind": "Content",
+              "text": "controlWrapperTemplate: (options: "
+            },
+            {
+              "kind": "Reference",
+              "text": "ControlWrapperOptions",
+              "canonicalReference": "@genesislcap/foundation-forms!~ControlWrapperOptions:interface"
+            },
+            {
+              "kind": "Content",
+              "text": ") => "
+            },
+            {
+              "kind": "Reference",
+              "text": "ViewTemplate",
+              "canonicalReference": "@microsoft/fast-element!ViewTemplate:class"
+            },
+            {
+              "kind": "Content",
+              "text": "<"
+            },
+            {
+              "kind": "Reference",
+              "text": "DispatchRenderer",
+              "canonicalReference": "@genesislcap/foundation-forms!~DispatchRenderer:class"
+            },
+            {
+              "kind": "Content",
+              "text": ">"
+            }
+          ],
+          "fileUrlPath": "src/jsonforms/renderers/ControlWrapperRenderer.ts",
+          "returnTypeTokenRange": {
+            "startIndex": 3,
+            "endIndex": 7
+          },
+          "releaseTag": "Public",
+          "overloadIndex": 1,
+          "parameters": [
+            {
+              "parameterName": "options",
+              "parameterTypeTokenRange": {
+                "startIndex": 1,
+                "endIndex": 2
+              },
+              "isOptional": false
+            }
+          ],
+          "name": "controlWrapperTemplate"
+        },
         {
           "kind": "Interface",
           "canonicalReference": "@genesislcap/foundation-forms!CsvMappingResult:interface",
@@ -2617,6 +2673,62 @@
             "endIndex": 2
           }
         },
+        {
+          "kind": "Function",
+          "canonicalReference": "@genesislcap/foundation-forms!layoutWrapperTemplate:function(1)",
+          "docComment": "/**\n * Light-DOM-friendly layout wrapper that replaces the former `<layout-wrapper>` custom element. Renders the (optional) control label and, when the control is visible, composes the provided inner template inline so that bindings stay on the `DispatchRenderer` source.\n *\n * @public\n */\n",
+          "excerptTokens": [
+            {
+              "kind": "Content",
+              "text": "layoutWrapperTemplate: (options: "
+            },
+            {
+              "kind": "Reference",
+              "text": "LayoutWrapperOptions",
+              "canonicalReference": "@genesislcap/foundation-forms!~LayoutWrapperOptions:interface"
+            },
+            {
+              "kind": "Content",
+              "text": ") => "
+            },
+            {
+              "kind": "Reference",
+              "text": "ViewTemplate",
+              "canonicalReference": "@microsoft/fast-element!ViewTemplate:class"
+            },
+            {
+              "kind": "Content",
+              "text": "<"
+            },
+            {
+              "kind": "Reference",
+              "text": "DispatchRenderer",
+              "canonicalReference": "@genesislcap/foundation-forms!~DispatchRenderer:class"
+            },
+            {
+              "kind": "Content",
+              "text": ">"
+            }
+          ],
+          "fileUrlPath": "src/jsonforms/renderers/LayoutRenderer.ts",
+          "returnTypeTokenRange": {
+            "startIndex": 3,
+            "endIndex": 7
+          },
+          "releaseTag": "Public",
+          "overloadIndex": 1,
+          "parameters": [
+            {
+              "parameterName": "options",
+              "parameterTypeTokenRange": {
+                "startIndex": 1,
+                "endIndex": 2
+              },
+              "isOptional": false
+            }
+          ],
+          "name": "layoutWrapperTemplate"
+        },
         {
           "kind": "Function",
           "canonicalReference": "@genesislcap/foundation-forms!mapCsvToSchema:function(1)",
@@ -2907,7 +3019,7 @@
             },
             {
               "kind": "Content",
-              "text": ";\n    autocomplete?: string;\n    prefix?: string;\n    suffix?: string;\n    hideAffixFromScreenReader?: boolean;\n}"
+              "text": ";\n    autocomplete?: string;\n    prefix?: string;\n    suffix?: string;\n    hideAffixFromScreenReader?: boolean;\n    changeOnInput?: boolean;\n}"
             },
             {
               "kind": "Content",
@@ -3418,7 +3530,7 @@
             },
             {
               "kind": "Content",
-              "text": "[];\n    i18n?: {\n        [key: string]: any;\n    };\n    tooltip?: string;\n    tabIndex?: number;\n}"
+              "text": "[];\n    i18n?: {\n        [key: string]: any;\n    };\n    tooltip?: string;\n    tabIndex?: number;\n    useNumberControl?: boolean;\n}"
             },
             {
               "kind": "Content",
@@ -3532,7 +3644,7 @@
             },
             {
               "kind": "Content",
-              "text": "{\n    isPassword?: boolean;\n    textarea?: boolean;\n    autocomplete?: string;\n    textTransform?: 'none' | 'uppercase' | 'lowercase' | ((value: string) => string);\n    suffix?: string;\n    prefix?: string;\n    hideAffixFromScreenReader?: boolean;\n}"
+              "text": "{\n    isPassword?: boolean;\n    textarea?: boolean;\n    autocomplete?: string;\n    textTransform?: 'none' | 'uppercase' | 'lowercase' | ((value: string) => string);\n    suffix?: string;\n    prefix?: string;\n    hideAffixFromScreenReader?: boolean;\n    changeOnInput?: boolean;\n}"
             },
             {
               "kind": "Content",

package/dist/foundation-forms.d.ts

@@ -353,6 +353,39 @@ export declare type ConnectedRenderersOptions = {
     labelRowFormatter?: (any: any) => string;
 };
 
+declare interface ControlWrapperOptions {
+    /**
+     * Inner control template (e.g. a text-field, combobox, checkbox) to render inside
+     * the wrapper's `.foundation-control-wrapper` block. Must be authored against the
+     * `DispatchRenderer` source so its bindings resolve through the enclosing template.
+     */
+    innerTemplate: ViewTemplate<DispatchRenderer>;
+    /** Design system prefix forwarded to nested icon components (tooltip). */
+    prefix: string;
+    /** When true, the label is visually hidden but still announced to screen readers. */
+    hideLabel?: boolean;
+}
+
+/**
+ * Styles formerly scoped to the <control-wrapper> element. After the light-DOM
+ * refactor these are composed into `foundationFormStyles` so they reach every
+ * rendered control. Exported for consumers that render controls outside of
+ * `foundation-form` and need the same wrapper styling.
+ *
+ * @internal
+ */
+export declare const controlWrapperStyles: ElementStyles;
+
+/**
+ * Light-DOM-friendly control wrapper that replaces the former `<control-wrapper>`
+ * custom element. Renders label, error/description slots, and composes a provided
+ * inner control template inline within the renderer's template so that bindings
+ * stay on the `DispatchRenderer` source.
+ *
+ * @public
+ */
+export declare const controlWrapperTemplate: (options: ControlWrapperOptions) => ViewTemplate<DispatchRenderer>;
+
 /**
  * Creates a expressions/criteria from given payload
  * @internal
@@ -1330,15 +1363,7 @@ declare const Form_base: (new (...args: any[]) => {
     slot: string;
     readonly tagName: string;
     attachShadow(init: ShadowRootInit): ShadowRoot;
-    checkVisibility(options
-    /**
-    * Initializes the data with default empty items for bulk insert mode.
-    * @internal
-    */
-    ? /**
-    * Initializes the data with default empty items for bulk insert mode.
-    * @internal
-    */: CheckVisibilityOptions): boolean;
+    checkVisibility(options?: CheckVisibilityOptions): boolean;
     closest<K extends keyof HTMLElementTagNameMap>(selector: K): HTMLElementTagNameMap[K];
     closest<K extends keyof SVGElementTagNameMap>(selector: K): SVGElementTagNameMap[K];
     closest<K extends keyof MathMLElementTagNameMap>(selector: K): MathMLElementTagNameMap[K];
@@ -1627,7 +1652,9 @@ declare const Form_base: (new (...args: any[]) => {
     nonce?: string;
     tabIndex: number;
     blur(): void;
-    focus(options?: FocusOptions): void;
+    focus(options? /**
+    * @internal
+    */: FocusOptions): void;
 }) & typeof FoundationElement;
 
 /** @internal */
@@ -1724,6 +1751,26 @@ export { Layout }
 
 export declare const LayoutVerticalCategorizationRendererEntry: any;
 
+declare interface LayoutWrapperOptions {
+    /**
+     * Inner template to render inside the wrapper. Must be authored against the
+     * `DispatchRenderer` source so bindings resolve through the enclosing template.
+     */
+    innerTemplate: ViewTemplate<DispatchRenderer>;
+    /** When true, suppresses the auto-rendered label above the inner content. */
+    hideLabel?: boolean;
+}
+
+/**
+ * Light-DOM-friendly layout wrapper that replaces the former `<layout-wrapper>`
+ * custom element. Renders the (optional) control label and, when the control is
+ * visible, composes the provided inner template inline so that bindings stay on
+ * the `DispatchRenderer` source.
+ *
+ * @public
+ */
+export declare const layoutWrapperTemplate: (options: LayoutWrapperOptions) => ViewTemplate<DispatchRenderer>;
+
 /** @internal */
 export declare const logger: Logger;
 
@@ -1878,6 +1925,12 @@ export declare type NumberRendererOptions = {
      * @public
      */
     hideAffixFromScreenReader?: boolean;
+    /**
+     * When true, the form data is changed on every input event (as the user types)
+     * rather than only on change/blur. Defaults to `false`.
+     * @public
+     */
+    changeOnInput?: boolean;
 };
 
 /**
@@ -2039,6 +2092,12 @@ export declare type StandardRendererOptions = {
      * @public
      */
     tabIndex?: number;
+    /**
+     * When true on a `Control`, selects the number control renderer even if JSON Schema does not declare `number` or `integer`
+     * (for example metadata that types a numeric field as `string`).
+     * @public
+     */
+    useNumberControl?: boolean;
 };
 
 /**
@@ -2106,6 +2165,12 @@ export declare type StringRendererOptions = {
      * @public
      */
     hideAffixFromScreenReader?: boolean;
+    /**
+     * When true, the form data is changed on every input event (as the user types)
+     * rather than only on change/blur. Defaults to `false`.
+     * @public
+     */
+    changeOnInput?: boolean;
 };
 
 /**

package/dist/react.cjs

@@ -11,8 +11,6 @@ const { Form: FormWC } = require('./esm/form.js');
 const { JSONForms: JSONFormsWC } = require('./esm/jsonforms/json-forms.js');
 const { ArrayListWrapper: ArrayListWrapperWC } = require('./esm/jsonforms/renderers/ArrayListWrapperRenderer.js');
 const { CategorizationWrapper: CategorizationWrapperWC } = require('./esm/jsonforms/renderers/CategorizationWrapperRenderer.js');
-const { ControlWrapper: ControlWrapperWC } = require('./esm/jsonforms/renderers/ControlWrapperRenderer.js');
-const { LayoutWrapper: LayoutWrapperWC } = require('./esm/jsonforms/renderers/LayoutRenderer.js');
 const { StepperWrapper: StepperWrapperWC } = require('./esm/jsonforms/renderers/StepperWrapperRenderer.js');
 const { VerticalCategorizationWrapper: VerticalCategorizationWrapperWC } = require('./esm/jsonforms/renderers/VerticalCategorizationWrapperRenderer.js');
 const { DispatchRenderer: DispatchRendererWC } = require('./esm/jsonforms/renderers/dispatch-renderer.js');
@@ -130,16 +128,6 @@ const CategorizationWrapper = React.forwardRef(function CategorizationWrapper(pr
   return React.createElement(customElements.getName(CategorizationWrapperWC) ?? 'categorization-wrapper', { ...rest, ref }, children);
 });
 
-const ControlWrapper = React.forwardRef(function ControlWrapper(props, ref) {
-  const { children, ...rest } = props;
-  return React.createElement(customElements.getName(ControlWrapperWC) ?? 'control-wrapper', { ...rest, ref }, children);
-});
-
-const LayoutWrapper = React.forwardRef(function LayoutWrapper(props, ref) {
-  const { children, ...rest } = props;
-  return React.createElement(customElements.getName(LayoutWrapperWC) ?? 'layout-wrapper', { ...rest, ref }, children);
-});
-
 const StepperWrapper = React.forwardRef(function StepperWrapper(props, ref) {
   const { children, ...rest } = props;
   return React.createElement(customElements.getName(StepperWrapperWC) ?? 'stepper-wrapper', { ...rest, ref }, children);
@@ -161,8 +149,6 @@ module.exports = {
   JSONForms,
   ArrayListWrapper,
   CategorizationWrapper,
-  ControlWrapper,
-  LayoutWrapper,
   StepperWrapper,
   VerticalCategorizationWrapper,
   DispatchRenderer,

package/dist/react.mjs

@@ -9,8 +9,6 @@ import { Form as FormWC } from './esm/form.js';
 import { JSONForms as JSONFormsWC } from './esm/jsonforms/json-forms.js';
 import { ArrayListWrapper as ArrayListWrapperWC } from './esm/jsonforms/renderers/ArrayListWrapperRenderer.js';
 import { CategorizationWrapper as CategorizationWrapperWC } from './esm/jsonforms/renderers/CategorizationWrapperRenderer.js';
-import { ControlWrapper as ControlWrapperWC } from './esm/jsonforms/renderers/ControlWrapperRenderer.js';
-import { LayoutWrapper as LayoutWrapperWC } from './esm/jsonforms/renderers/LayoutRenderer.js';
 import { StepperWrapper as StepperWrapperWC } from './esm/jsonforms/renderers/StepperWrapperRenderer.js';
 import { VerticalCategorizationWrapper as VerticalCategorizationWrapperWC } from './esm/jsonforms/renderers/VerticalCategorizationWrapperRenderer.js';
 import { DispatchRenderer as DispatchRendererWC } from './esm/jsonforms/renderers/dispatch-renderer.js';
@@ -128,16 +126,6 @@ export const CategorizationWrapper = React.forwardRef(function CategorizationWra
   return React.createElement(customElements.getName(CategorizationWrapperWC) ?? 'categorization-wrapper', { ...rest, ref }, children);
 });
 
-export const ControlWrapper = React.forwardRef(function ControlWrapper(props, ref) {
-  const { children, ...rest } = props;
-  return React.createElement(customElements.getName(ControlWrapperWC) ?? 'control-wrapper', { ...rest, ref }, children);
-});
-
-export const LayoutWrapper = React.forwardRef(function LayoutWrapper(props, ref) {
-  const { children, ...rest } = props;
-  return React.createElement(customElements.getName(LayoutWrapperWC) ?? 'layout-wrapper', { ...rest, ref }, children);
-});
-
 export const StepperWrapper = React.forwardRef(function StepperWrapper(props, ref) {
   const { children, ...rest } = props;
   return React.createElement(customElements.getName(StepperWrapperWC) ?? 'stepper-wrapper', { ...rest, ref }, children);

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@genesislcap/foundation-forms",
   "description": "Genesis Foundation Forms",
-  "version": "14.427.0",
+  "version": "14.427.2-alpha-e0ffaad.0",
   "sideEffects": false,
   "license": "SEE LICENSE IN license.txt",
   "main": "dist/esm/index.js",
@@ -55,23 +55,23 @@
     }
   },
   "devDependencies": {
-    "@genesislcap/foundation-testing": "14.427.0",
-    "@genesislcap/genx": "14.427.0",
-    "@genesislcap/rollup-builder": "14.427.0",
-    "@genesislcap/ts-builder": "14.427.0",
-    "@genesislcap/uvu-playwright-builder": "14.427.0",
-    "@genesislcap/vite-builder": "14.427.0",
-    "@genesislcap/webpack-builder": "14.427.0",
+    "@genesislcap/foundation-testing": "14.427.2-alpha-e0ffaad.0",
+    "@genesislcap/genx": "14.427.2-alpha-e0ffaad.0",
+    "@genesislcap/rollup-builder": "14.427.2-alpha-e0ffaad.0",
+    "@genesislcap/ts-builder": "14.427.2-alpha-e0ffaad.0",
+    "@genesislcap/uvu-playwright-builder": "14.427.2-alpha-e0ffaad.0",
+    "@genesislcap/vite-builder": "14.427.2-alpha-e0ffaad.0",
+    "@genesislcap/webpack-builder": "14.427.2-alpha-e0ffaad.0",
     "@types/json-schema": "^7.0.11",
     "@types/papaparse": "^5.3.14"
   },
   "dependencies": {
-    "@genesislcap/foundation-comms": "14.427.0",
-    "@genesislcap/foundation-criteria": "14.427.0",
-    "@genesislcap/foundation-logger": "14.427.0",
-    "@genesislcap/foundation-notifications": "14.427.0",
-    "@genesislcap/foundation-ui": "14.427.0",
-    "@genesislcap/foundation-utils": "14.427.0",
+    "@genesislcap/foundation-comms": "14.427.2-alpha-e0ffaad.0",
+    "@genesislcap/foundation-criteria": "14.427.2-alpha-e0ffaad.0",
+    "@genesislcap/foundation-logger": "14.427.2-alpha-e0ffaad.0",
+    "@genesislcap/foundation-notifications": "14.427.2-alpha-e0ffaad.0",
+    "@genesislcap/foundation-ui": "14.427.2-alpha-e0ffaad.0",
+    "@genesislcap/foundation-utils": "14.427.2-alpha-e0ffaad.0",
     "@json-schema-tools/dereferencer": "^1.6.1",
     "@jsonforms/core": "^3.2.1",
     "@microsoft/fast-components": "2.30.6",
@@ -93,5 +93,5 @@
     "access": "public"
   },
   "customElements": "dist/custom-elements.json",
-  "gitHead": "8906c7c7a03330a19b81a9aa77b6c45f66b3ef6d"
+  "gitHead": "189e38590abb21df6ac6c641d58b758f5eba8eca"
 }