@vertigis/workflow 5.37.0 → 5.38.0

package/forms/FormHost.js

@@ -1 +1 @@
-import Bluebird from"bluebird";import{Task}from"../Task.js";import{DEFAULT_LOCALE}from"../constants.js";import*as defs from"./FormDefinition.js";import MutuallyExclusiveSectionGroup from"./MutuallyExclusiveSectionGroup.js";import NumberParser from"./NumberParser.js";import{FormElementTypes}from"./constants.js";import{format}from"./numberFormatter.js";import*as presenter from"./presenter.js";import{isAccordionSection,isCollapsibleSection,isSection,sortAndFilter,text}from"./utils.js";const guid="C0166F74-982A-464E-9FB6-9605CB7649C1:",eventName=guid+"FormEvent";function createEvent(e,t){return new CustomEvent(e,{bubbles:!1,cancelable:!1,detail:t})}function overlay(i,s){switch(typeof i){case"boolean":case"number":case"string":return i;case"object":break;default:return s}if(null===i)return s;if(i instanceof Array){let e=s;void 0!==e&&null!==e||(e=[]);let t=0;for(const r of i){var n=overlay(r,e[t]);void 0!==n&&(t<i.length?e[t]=n:e.push(n),++t)}return e}let e=s;void 0===e&&(e={});for(const t in i)e[t]=overlay(i[t],e[t]);return e}function createSubscription(e){function t(){return void 0!==e&&(t.active=!1,e(),!0)}return t.active=!0,t}class FormHost{constructor(){this.form={defaults:{},elements:{}},this.errors={},this.refs={},this.enabled=!1,this.visible=!1,this.dismiss=!1,this.custom=!1,this.container=document.createElement("div"),this.eventIndex=0,this.eventQueue=[],this.mutuallyExclusiveSections={},this.nextFocus=!1,this.nextRefresh=!1}deriveLocale(){return DEFAULT_LOCALE}mount(){var e=this.container,t=e.parentNode;null==t&&document.body.appendChild(e),this.update()}unmount(){var e=this.container;const t=e.parentNode;void 0!==t&&null!==t&&t.removeChild(e)}observeFocus(e){this.enabled&&e instanceof HTMLElement&&(this.lastFocus&&this.lastFocus.target===e||this.setLastFocus(e))}focus(e){!0===(e=null==e?!1:e)&&(this.lastFocus=void 0),!1===e&&!1===(e=this.nextFocus)&&(e=!0),this.nextFocus=e,this.invalidate(!0!==e?e:void 0)}show(){const e=this.container;if(void 0===e)return!1;this.custom||void 0!==this.focusObserver||e.addEventListener("focus",this.focusObserver=e=>this.observeFocus(e.target),!0),this.enabled||(this.nextRefresh=!0,this.focus()),this.enforceAccordionConstraints();var t=this.errors;for(const i in t){const s=this.form.elements[i];void 0!==s&&null!==s&&(s.error=t[i],this.invalidate(i))}return this.idle(),!1!==this.nextRefresh&&(this.enabled=!0,this.visible=!0,this.mount()),this.enabled}isInvalid(e){return!!e.error&&!1!==e.visible}getInvalidElements(){return Object.keys(this.form.elements).map(e=>this.form.elements[e]).filter(this.isInvalid)}hasInvalidChild(e){for(const i in this.form.elements){var t=this.form.elements[i];if(this.isInvalid(t)&&this.getParentSection(t)===e)return!0}return!1}spin(){return void 0!==this.container&&(this.idle(),this.visible&&!this.enabled||(this.nextRefresh=!0,this.enabled=!1,this.visible=!0,this.mount()),this.visible)}hide(){return void 0!==this.container&&(this.idle(),this.visible&&(this.enabled=!1,this.visible=!1,this.unmount()),!0)}dispose(){if(this.dismiss)return!1;{this.dismiss=!0;const t=this.container;t.dispatchEvent(createEvent(eventName));var e=this.focusObserver;return void 0!==e&&t.removeEventListener("focus",e,!0),this.idle(),this.unmount(),this.refs={},presenter.releaseForm(this.container),this.container=void 0,this.lastFocus=void 0,!(this.eventTask=void 0)}}renderFocus(e,t){var i=this.nextFocus;if(this.enabled&&e instanceof HTMLElement)if(!1!==i)if(void 0!==t){if(t===i||!0===i&&void 0===this.lastFocus)return this.nextFocus=!1,this.setLastFocus(e,t),e.focus(),!0}else{const s=this.lastFocus?.target;if(!0===i&&s instanceof HTMLElement&&e.contains(s))return this.nextFocus=!1,s.focus(),!0}else if(!1===i&&t&&t!==this.lastFocus?.name&&this.isElementPositionBeforeLastFocused(t))return this.setLastFocus(e,t),e.focus(),!0;return!1}renderHtml(e,t){return"string"==typeof e?text.textToHtml(e):text.isMarkdown(e)?text.markdownToSafeHtml(e.markdown,{inline:t===defs.HTMLContentCategory.Phrasing}):""}renderText(e){return"string"==typeof e?e:text.isMarkdown(e)?text.markdownToText(e.markdown):""}translateText(e){return"string"==typeof e||text.isMarkdown(e)?e:text.isStatus(e)?e.status:void 0}renderVisual(e){return presenter.render(e)||presenter.renderNone(e)}qualifyDefault(e){var t=sortAndFilter(this.form.elements);for(const r in t){var i=t[r];if(null!=i&&!1!==i.visible&&i.enabled){if(i.default)return e.value=i.value,r;var s=sortAndFilter(i.items);if(null!=s)for(const o in s){var n=s[o];if(null!=n&&n.visible&&n.enabled&&n.default)return e.item=o,e.value=n.value,r}}}}qualify(e,t){var i;return null==t&&(t={}),"clicked"===e&&void 0===t.name&&(t.name=this.qualifyDefault(t)),t.type=e,void 0===t.routingKey&&(i=t.name,t.routingKey=void 0!==i?e+"$"+i:e),t}post(e,t){t=this.publish(e,t);const i=this.container;void 0!==i&&i.dispatchEvent(createEvent(eventName,t))}subscribe(e){let i=e;const t=this.container;if(void 0===t)return createSubscription();const s=function(){i=void 0,t.removeEventListener(eventName,n)},n=function(e){const t=e.detail;void 0!==t?Bluebird.resolve().then(function(){"function"==typeof i&&i(t)}):s()};return t.addEventListener(eventName,n),createSubscription(s)}refresh(e){this.custom||("string"==typeof e?(e=this.refs[e],presenter.refresh(e)):(this.refs={},presenter.refreshForm(this,this.container)))}invalidate(e){const t=this.nextRefresh;"string"==typeof e&&!0!==t&&(!1===t?this.nextRefresh={[e]:!0}:t[e]=!0),void 0!==e&&!0!==e||(this.nextRefresh=!0),!1===e&&!1===t&&(this.nextRefresh={})}update(){var e=this.nextRefresh;if(!0===e&&(this.nextRefresh=!1,this.refresh()),"object"==typeof e){this.nextRefresh=!1;for(const t in e)!0===e[t]&&this.refresh(t)}}idle(){const e=this.timerHandle;void 0!==e&&(this.timerHandle=void 0,e())}busy(){if(void 0===this.timerHandle&&void 0!==this.container){let e=setTimeout(()=>this.spin());this.timerHandle=function(){void 0!==e&&(clearTimeout(e),e=void 0)}}}publish(e,t){return this.enabled?(t=this.enqueue(e,t),0<this.eventQueue.length&&this.spin(),t):this.qualify(e,t)}enqueue(e,t){return t=this.qualify(e,t),void 0!==this.eventTask?(this.resolveEvent(t),this.eventTask=void 0):this.eventQueue.push(t),t}dequeue(){const e=this.eventQueue;if(0<e.length){var t=this.eventIndex,i=e[t++];return t>=e.length?e.length=this.eventIndex=0:this.eventIndex=t,i}}observe(){const t=this;return Bluebird.attempt(function(){if(void 0!==t.eventTask)return t.eventTask;var e=t.dequeue();return void 0!==e?e:t.show()?(t.eventTask=new Task(e=>{t.resolveEvent=e}),t.eventTask):void 0})}load(e,t){if(void 0===this.container)return!1;if(this.eventQueue.length=this.eventIndex=0,this.eventTask=void 0,this.errors={},this.lastFocus=void 0,this.nextFocus=!0,this.nextRefresh=!0,this.enqueue("load"),this.enqueue("prepare"),null!=e){e=overlay(e,e={defaults:{},elements:{}});this.form=overlay(t,e);for(const i in this.form.elements){let e=this.form.elements[i];if(e=overlay(e,{showFilter:!1,checked:!1,enabled:!0,hoisted:!1,visible:!0,overlay:!1,default:!1,validates:!1,readOnly:!1,require:!1,autoActivate:!1}),e.items)for(const s in e.items)e.items[s]=overlay(e.items[s],{enabled:!0,checked:!1,visible:!0,default:!1,validates:!1});this.form.elements[i]=e}}return!0}route(e){switch(e.type){case"changed":return this.cascade(e.name);case"prepare":return this.hydrate(e);case"suggest":return this.suggest(e);case"clicked":return this.click(e);case"validate":return this.verify(e);case"verify":return this.submit(e);case"checked":return this.changed(e)}return!1}changed(e){return this.enqueue("changed",{name:e.name,item:e.item,value:e.value}),!0}isElementValid(e,t=!0,i={status:void 0}){return null!=e&&(i.status=void 0,text.isInvalidError(e.error)?!(i.status="invalid"):!0!==e.require||(this.isElementEffectivelyVisible(e)?!!this.isElementValueDefined(e)||!(i.status="missing"):t))}isElementEffectivelyVisible(e){return null!=e&&(!1!==this.getParentSection(e)?.visible&&!1!==e.visible)}isElementValueDefined(e){if(null==e)return!1;if(e.type===FormElementTypes.CHECKBOX)return!0;var t=e.current;if(null!=t)return!0;t=e.value;if(null!=t&&""!==t)return!0;if(e.type!==FormElementTypes.SIGNATURE){t=e.label;if(null!=t&&""!==t)return!0}var i=e.items;if(null!=i)for(const n in i){var s=i[n];if(null!=s&&!0===s.checked)return!0}return!1}trap(e){switch(e.type){case"populate":case"load":case"suggest":break;default:return!1}var t=e.name;const i=this.find(t);if(void 0===i||null===i)return!1;e=i.dependsOn;if("string"!=typeof e)return!1;e=this.find(e);return i.enabled=this.isElementEffectivelyVisible(e)&&this.isElementValueDefined(e),this.invalidate(t),!i.enabled}cascade(e){var t=this.find(e);if(null==t||!1===t.dependsOn)return!1;const i={[e]:!0};var s=sortAndFilter(this.form.elements);for(const r in s){const o=s[r];var n=o.dependsOn;if("string"==typeof n){const l=this.find(n);void 0!==l&&"string"!=typeof l.dependsOn&&(l.dependsOn=!0),!0===i[n]&&(i[r]=!0,o.checked=!1,o.current=void 0,o.label=void 0,o.items=void 0,o.value=void 0,this.invalidate(r),o.dependsOn===e&&this.enqueue("populate",{name:r}))}else o.dependsOn=!1}return!0}click(e){var t=this.form.elements[e.name];return null!=t&&t.type==FormElementTypes.BUTTONBAR&&this.validate(e)}hasInitialSelectionToDependOn(e){e=this.form.elements[e];return e.type===FormElementTypes.DROPDOWNLIST&&(void 0!==e.current&&null!==e.current)}hydrate(e){for(const i in sortAndFilter(this.form.elements)){var t=this.form.elements[i].dependsOn;"string"==typeof t&&!this.hasInitialSelectionToDependOn(t)||this.enqueue("populate",{name:i}),this.enqueue("load",{name:i})}return!0}shouldTriggerValidation(e){var t=this.find(e.name);if(null!=t&&"string"==typeof e.value){e=e.item;if("string"!=typeof e)return!0===t.validates;t=t.items;if(null!=t){e=t[e];if(null!=e)return!0===e.validates}}}validate(e){var t=this.shouldTriggerValidation(e);if(!0!==t)return!1===t&&(this.enqueue("end",{name:e.name,item:e.item,value:e.value,routingKey:"end"}),!0);{const n=this.errors={};var i=sortAndFilter(this.form.elements);for(const r in i){var s=i[r];null!=s&&(n[r]=void 0,this.enqueue("validate",{name:r}))}return this.enqueue("verify",{name:e.name,item:e.item,value:e.value,routingKey:"verify"}),!0}}verify(e){var t=e.name,i=this.form.elements[t],e={status:void 0};return!this.isElementValid(i,!0,e)&&(e.status&&(this.errors[t]={status:e.status}),!1===this.nextFocus&&this.focus(t),!0)}suggest(e){const t=this.form.elements[e.name];return void 0!==t&&null!==t&&(t.items={message:{label:{status:"trivial"},enabled:!1}},this.invalidate(e.name),!0)}submit(e){if(!this.hasErrors()){for(const r in this.form.elements)this.form.elements[r].error=void 0;return this.enqueue("submit",{name:e.name,item:e.item,value:e.value}),!0}var t=this.errors;for(const o in t){const l=this.form.elements[o];void 0!==l&&null!==l&&(l.error=t[o],this.invalidate(o))}const i=[];let s=!1;for(const a of this.getInvalidElements()){const u=this.getParentSection(a);if(isAccordionSection(u)){var n=this.findName(u);const h=this.getMutuallyExclusiveSectionGroup(n);if(h){const c=i.find(e=>e.group===h);c?c.element.rowNumber>u.rowNumber&&(c.element=u):(i.push({group:h,element:u}),s=!0)}}else this.isSectionCollapsed(u)&&(u.collapsed=!1,s=!0)}for(const d of i)d.group.expandedSection=d.element;return s&&this.invalidate(),!(this.errors={})}hasErrors(){var e=this.errors;for(const i in e){var t=e[i];if(null!=t)return!0}return!1}find(e){if(null!=e)return"string"==typeof(e="object"==typeof e?e.name:e)?this.form.elements[e]:void 0}findName(e){for(const t in this.form.elements)if(this.form.elements[t]===e)return t}coerceNumber(e){var t=this.deriveLocale();return new NumberParser(t).parse(e)}formatNumber(e,t){return t=t||{locale:this.deriveLocale()},format(t,e)}renderState(e,t,i){return!1}getParentSection(e){e=e.section;if(e){e="string"==typeof e?e:e.name;return this.form.elements[e]}}isSectionCollapsed(e){return!(!e||e.type!==FormElementTypes.SECTION||!isCollapsibleSection(e)&&!isAccordionSection(e))&&!0===e.collapsed}isElementPositionBeforeLastFocused(e){var t=this.lastFocus;if(!t)return!0;if("footer"===e)return!1;if("footer"===t.name)return!0;if(e&&void 0!==t?.rowNumber&&void 0!==t.rowIndex){e=this.form.elements?.[e];if(e)return void 0!==e.rowNumber&&void 0!==e.rowIndex?e.rowNumber<t.rowNumber||e.rowNumber===t.rowNumber&&e.rowIndex<t.rowIndex:e.index<t.rowNumber||e.index===t.rowNumber&&0<t.rowIndex}return!1}setLastFocus(e,t){this.lastFocus={target:e},t&&(this.lastFocus.name=t,(t=this.form.elements?.[t])&&(void 0!==t.rowNumber&&void 0!==t.rowIndex?(this.lastFocus.rowNumber=t.rowNumber,this.lastFocus.rowIndex=t.rowIndex):(this.lastFocus.rowNumber=t.index,this.lastFocus.rowIndex=0)))}getAllSectionElements(){const e={};for(const i in this.form.elements){var t=this.form.elements[i];isSection(t)&&(e[i]=t)}return e}getMutuallyExclusiveSectionGroup(t){let i=this.mutuallyExclusiveSections[t];if(!i){var e=this.find(t);if(!isAccordionSection(e))return;i=new MutuallyExclusiveSectionGroup({elementName:t,element:e});e=this.getAllSectionElements();const r=Object.keys(sortAndFilter(e,e=>e.rowNumber));t=r.indexOf(t);for(let e=t-1;0<=e;e--){const o=r[e];var s=this.find(o);if(!isAccordionSection(s))break;i.unshift({elementName:o,element:s})}for(let e=t+1;e<r.length;e++){const o=r[e];var n=this.find(o);if(!isAccordionSection(n))break;i.push({elementName:o,element:n})}i.forEach(e=>{this.mutuallyExclusiveSections[e.elementName]=i})}return i}updateAccordionSections(t){const e=this.getMutuallyExclusiveSectionGroup(t);e.forEach(e=>{e.element.collapsed=e.elementName!==t}),this.refresh()}enforceAccordionConstraints(){const e=[];for(const i of Object.keys(this.form.elements).map(e=>({elementName:e,element:this.form.elements[e]})).filter(e=>isAccordionSection(e.element)&&!1!==e.element.visible&&!0!==e.element.collapsed).sort((e,t)=>e.element.rowNumber-t.element.rowNumber)){var t=this.getMutuallyExclusiveSectionGroup(i.elementName);-1===e.indexOf(t)?e.push(t):i.element.collapsed=!0}}async displayDialog(e,t){await Promise.resolve()}}export{defs,FormHost};
+import Bluebird from"bluebird";import{Task}from"../Task.js";import{DEFAULT_LOCALE}from"../constants.js";import*as defs from"./FormDefinition.js";import MutuallyExclusiveSectionGroup from"./MutuallyExclusiveSectionGroup.js";import NumberParser from"./NumberParser.js";import{FormElementTypes}from"./constants.js";import{format}from"./numberFormatter.js";import*as presenter from"./presenter.js";import{isCollapsibleSection,isMutuallyExclusiveSection,isSection,sortAndFilter,text}from"./utils.js";const guid="C0166F74-982A-464E-9FB6-9605CB7649C1:",eventName=guid+"FormEvent";function createEvent(e,t){return new CustomEvent(e,{bubbles:!1,cancelable:!1,detail:t})}function overlay(i,s){switch(typeof i){case"boolean":case"number":case"string":return i;case"object":break;default:return s}if(null===i)return s;if(i instanceof Array){let e=s;void 0!==e&&null!==e||(e=[]);let t=0;for(const r of i){var n=overlay(r,e[t]);void 0!==n&&(t<i.length?e[t]=n:e.push(n),++t)}return e}let e=s;void 0===e&&(e={});for(const t in i)e[t]=overlay(i[t],e[t]);return e}function createSubscription(e){function t(){return void 0!==e&&(t.active=!1,e(),!0)}return t.active=!0,t}class FormHost{constructor(){this.form={defaults:{},elements:{}},this.errors={},this.refs={},this.enabled=!1,this.visible=!1,this.dismiss=!1,this.custom=!1,this.container=document.createElement("div"),this.eventIndex=0,this.eventQueue=[],this.mutuallyExclusiveSections={},this.nextFocus=!1,this.nextRefresh=!1,this.enqueueExternalEvent=e=>{e={type:`external$${e.name}`,name:"header",argument:e};this.enqueue(e.type,e)}}deriveLocale(){return DEFAULT_LOCALE}mount(){var e=this.container,t=e.parentNode;null==t&&document.body.appendChild(e),this.update()}unmount(){var e=this.container;const t=e.parentNode;void 0!==t&&null!==t&&t.removeChild(e)}observeFocus(e){this.enabled&&e instanceof HTMLElement&&(this.lastFocus&&this.lastFocus.target===e||this.setLastFocus(e))}focus(e){!0===(e=null==e?!1:e)&&(this.lastFocus=void 0),!1===e&&!1===(e=this.nextFocus)&&(e=!0),this.nextFocus=e,this.invalidate(!0!==e?e:void 0)}show(){const e=this.container;if(void 0===e)return!1;this.custom||void 0!==this.focusObserver||e.addEventListener("focus",this.focusObserver=e=>this.observeFocus(e.target),!0),this.enabled||(this.nextRefresh=!0,this.focus()),this.enforceMutuallyExclusiveConstraints();var t=this.errors;for(const i in t){const s=this.form.elements[i];void 0!==s&&null!==s&&(s.error=t[i],this.invalidate(i))}return this.idle(),!1!==this.nextRefresh&&(this.enabled=!0,this.visible=!0,this.mount()),this.enabled}isInvalid(e){return!!e.error&&!1!==e.visible}getInvalidElements(){return Object.keys(this.form.elements).map(e=>this.form.elements[e]).filter(this.isInvalid)}hasInvalidChild(e){for(const i in this.form.elements){var t=this.form.elements[i];if(this.isInvalid(t)&&this.getParentSection(t)===e)return!0}return!1}spin(){return void 0!==this.container&&(this.idle(),this.visible&&!this.enabled||(this.nextRefresh=!0,this.enabled=!1,this.visible=!0,this.mount()),this.visible)}hide(){return void 0!==this.container&&(this.idle(),this.visible&&(this.enabled=!1,this.visible=!1,this.unmount()),!0)}dispose(){if(this.dismiss)return!1;{this.dismiss=!0;const t=this.container;t.dispatchEvent(createEvent(eventName));var e=this.focusObserver;return void 0!==e&&t.removeEventListener("focus",e,!0),this.idle(),this.unmount(),this.refs={},presenter.releaseForm(this.container),this.container=void 0,this.lastFocus=void 0,!(this.eventTask=void 0)}}renderFocus(e,t){var i=this.nextFocus;if(this.enabled&&e instanceof HTMLElement)if(!1!==i)if(void 0!==t){if(t===i||!0===i&&void 0===this.lastFocus)return this.nextFocus=!1,this.setLastFocus(e,t),e.focus(),!0}else{const s=this.lastFocus?.target;if(!0===i&&s instanceof HTMLElement&&e.contains(s))return this.nextFocus=!1,s.focus(),!0}else if(!1===i&&t&&t!==this.lastFocus?.name&&this.isElementPositionBeforeLastFocused(t))return this.setLastFocus(e,t),e.focus(),!0;return!1}renderHtml(e,t){return"string"==typeof e?text.textToHtml(e):text.isMarkdown(e)?text.markdownToSafeHtml(e.markdown,{inline:t===defs.HTMLContentCategory.Phrasing}):""}renderText(e){return"string"==typeof e?e:text.isMarkdown(e)?text.markdownToText(e.markdown):""}translateText(e){return"string"==typeof e||text.isMarkdown(e)?e:text.isStatus(e)?e.status:void 0}renderVisual(e){return presenter.render(e)||presenter.renderNone(e)}qualifyDefault(e){var t=sortAndFilter(this.form.elements);for(const r in t){var i=t[r];if(null!=i&&!1!==i.visible&&i.enabled){if(i.default)return e.value=i.value,r;var s=sortAndFilter(i.items);if(null!=s)for(const o in s){var n=s[o];if(null!=n&&n.visible&&n.enabled&&n.default)return e.item=o,e.value=n.value,r}}}}qualify(e,t){var i;return null==t&&(t={}),"clicked"===e&&void 0===t.name&&(t.name=this.qualifyDefault(t)),t.type=e,void 0===t.routingKey&&(i=t.name,t.routingKey=void 0!==i?e+"$"+i:e),t}post(e,t){t=this.publish(e,t);const i=this.container;void 0!==i&&i.dispatchEvent(createEvent(eventName,t))}subscribe(e){let i=e;const t=this.container;if(void 0===t)return createSubscription();const s=function(){i=void 0,t.removeEventListener(eventName,n)},n=function(e){const t=e.detail;void 0!==t?Bluebird.resolve().then(function(){"function"==typeof i&&i(t)}):s()};return t.addEventListener(eventName,n),createSubscription(s)}refresh(e){this.custom||("string"==typeof e?(e=this.refs[e],presenter.refresh(e)):(this.refs={},presenter.refreshForm(this,this.container)))}invalidate(e){const t=this.nextRefresh;"string"==typeof e&&!0!==t&&(!1===t?this.nextRefresh={[e]:!0}:t[e]=!0),void 0!==e&&!0!==e||(this.nextRefresh=!0),!1===e&&!1===t&&(this.nextRefresh={})}update(){var e=this.nextRefresh;if(!0===e&&(this.nextRefresh=!1,this.refresh()),"object"==typeof e){this.nextRefresh=!1;for(const t in e)!0===e[t]&&this.refresh(t)}}idle(){const e=this.timerHandle;void 0!==e&&(this.timerHandle=void 0,e())}busy(){if(void 0===this.timerHandle&&void 0!==this.container){let e=setTimeout(()=>this.spin());this.timerHandle=function(){void 0!==e&&(clearTimeout(e),e=void 0)}}}publish(e,t){return this.enabled?(t=this.enqueue(e,t),0<this.eventQueue.length&&this.spin(),t):this.qualify(e,t)}enqueue(e,t){return t=this.qualify(e,t),void 0!==this.eventTask?(this.resolveEvent(t),this.eventTask=void 0):this.eventQueue.push(t),t}dequeue(){const e=this.eventQueue;if(0<e.length){var t=this.eventIndex,i=e[t++];return t>=e.length?e.length=this.eventIndex=0:this.eventIndex=t,i}}observe(){return Bluebird.attempt(()=>{if(void 0!==this.eventTask)return this.eventTask;var e=this.dequeue();return void 0!==e?e:this.show()?(this.eventTask=new Task(e=>{this.resolveEvent=e}),this.eventTask):void 0})}load(e,t){if(void 0===this.container)return!1;if(this.eventQueue.length=this.eventIndex=0,this.eventTask=void 0,this.errors={},this.lastFocus=void 0,this.nextFocus=!0,this.nextRefresh=!0,this.enqueue("load"),this.enqueue("prepare"),null!=e){e=overlay(e,e={defaults:{},elements:{}});this.form=overlay(t,e);for(const i in this.form.elements){let e=this.form.elements[i];if(e=overlay(e,{showFilter:!1,checked:!1,enabled:!0,hoisted:!1,visible:!0,overlay:!1,default:!1,validates:!1,readOnly:!1,require:!1,autoActivate:!1}),e.items)for(const s in e.items)e.items[s]=overlay(e.items[s],{enabled:!0,checked:!1,visible:!0,default:!1,validates:!1});this.form.elements[i]=e}}return!0}route(e){switch(e.type){case"changed":return this.cascade(e.name);case"checked":return this.changed(e);case"clicked":return this.click(e);case"prepare":return this.hydrate(e);case"suggest":return this.suggest(e);case"validate":return this.verify(e);case"verify":return this.submit(e)}return!1}changed(e){return this.enqueue("changed",{name:e.name,item:e.item,value:e.value}),!0}isElementValid(e,t=!0,i={status:void 0}){return null!=e&&(i.status=void 0,text.isInvalidError(e.error)?!(i.status="invalid"):!0!==e.require||(this.isElementEffectivelyVisible(e)?!!this.isElementValueDefined(e)||!(i.status="missing"):t))}isElementEffectivelyVisible(e){return null!=e&&(!1!==this.getParentSection(e)?.visible&&!1!==e.visible)}isElementValueDefined(e){if(null==e)return!1;if(e.type===FormElementTypes.CHECKBOX)return!0;var t=e.current;if(null!=t)return!0;t=e.value;if(null!=t&&""!==t)return!0;if(e.type!==FormElementTypes.SIGNATURE){t=e.label;if(null!=t&&""!==t)return!0}var i=e.items;if(null!=i)for(const n in i){var s=i[n];if(null!=s&&!0===s.checked)return!0}return!1}trap(e){switch(e.type){case"populate":case"load":case"suggest":break;default:return!1}var t=e.name;const i=this.find(t);if(void 0===i||null===i)return!1;e=i.dependsOn;if("string"!=typeof e)return!1;e=this.find(e);return i.enabled=this.isElementEffectivelyVisible(e)&&this.isElementValueDefined(e),this.invalidate(t),!i.enabled}cascade(e){var t=this.find(e);if(null==t||!1===t.dependsOn)return!1;const i={[e]:!0};var s=sortAndFilter(this.form.elements);for(const r in s){const o=s[r];var n=o.dependsOn;if("string"==typeof n){const l=this.find(n);void 0!==l&&"string"!=typeof l.dependsOn&&(l.dependsOn=!0),!0===i[n]&&(i[r]=!0,o.checked=!1,o.current=void 0,o.label=void 0,o.items=void 0,o.value=void 0,this.invalidate(r),o.dependsOn===e&&this.enqueue("populate",{name:r}))}else o.dependsOn=!1}return!0}click(e){var t=this.form.elements[e.name];return null!=t&&t.type==FormElementTypes.BUTTONBAR&&this.validate(e)}hasInitialSelectionToDependOn(e){e=this.form.elements[e];return e.type===FormElementTypes.DROPDOWNLIST&&(void 0!==e.current&&null!==e.current)}hydrate(e){for(const i in sortAndFilter(this.form.elements)){var t=this.form.elements[i].dependsOn;"string"==typeof t&&!this.hasInitialSelectionToDependOn(t)||this.enqueue("populate",{name:i}),this.enqueue("load",{name:i})}return!0}shouldTriggerValidation(e){var t=this.find(e.name);if(null!=t&&"string"==typeof e.value){e=e.item;if("string"!=typeof e)return!0===t.validates;t=t.items;if(null!=t){e=t[e];if(null!=e)return!0===e.validates}}}validate(e){var t=this.shouldTriggerValidation(e);if(!0!==t)return!1===t&&(this.enqueue("end",{name:e.name,item:e.item,value:e.value,routingKey:"end"}),!0);{const n=this.errors={};var i=sortAndFilter(this.form.elements);for(const r in i){var s=i[r];null!=s&&(n[r]=void 0,this.enqueue("validate",{name:r}))}return this.enqueue("verify",{name:e.name,item:e.item,value:e.value,routingKey:"verify"}),!0}}verify(e){var t=e.name,i=this.form.elements[t],e={status:void 0};return!this.isElementValid(i,!0,e)&&(e.status&&(this.errors[t]={status:e.status}),!1===this.nextFocus&&this.focus(t),!0)}suggest(e){const t=this.form.elements[e.name];return void 0!==t&&null!==t&&(t.items={message:{label:{status:"trivial"},enabled:!1}},this.invalidate(e.name),!0)}submit(e){if(!this.hasErrors()){for(const r in this.form.elements)this.form.elements[r].error=void 0;return this.enqueue("submit",{name:e.name,item:e.item,value:e.value}),!0}var t=this.errors;for(const o in t){const l=this.form.elements[o];void 0!==l&&null!==l&&(l.error=t[o],this.invalidate(o))}const i=[];let s=!1;for(const a of this.getInvalidElements()){const u=this.getParentSection(a);if(isMutuallyExclusiveSection(u)){var n=this.findName(u);const h=this.getMutuallyExclusiveSectionGroup(n);if(h){const m=i.find(e=>e.group===h);m?m.element.rowNumber>u.rowNumber&&(m.element=u):(i.push({group:h,element:u}),s=!0)}}else this.isSectionCollapsed(u)&&(u.collapsed=!1,s=!0)}for(const d of i)d.group.expandedSection=d.element;return s&&this.invalidate(),!(this.errors={})}hasErrors(){var e=this.errors;for(const i in e){var t=e[i];if(null!=t)return!0}return!1}find(e){if(null!=e)return"string"==typeof(e="object"==typeof e?e.name:e)?this.form.elements[e]:void 0}findName(e){for(const t in this.form.elements)if(this.form.elements[t]===e)return t}coerceNumber(e){var t=this.deriveLocale();return new NumberParser(t).parse(e)}formatNumber(e,t){return t=t||{locale:this.deriveLocale()},format(t,e)}renderState(e,t,i){return!1}getParentSection(e){e=e.section;if(e){e="string"==typeof e?e:e.name;return this.form.elements[e]}}isSectionCollapsed(e){return!(!e||e.type!==FormElementTypes.SECTION||!isCollapsibleSection(e)&&!isMutuallyExclusiveSection(e))&&!0===e.collapsed}isElementPositionBeforeLastFocused(e){var t=this.lastFocus;if(!t)return!0;if("footer"===e)return!1;if("footer"===t.name)return!0;if(e&&void 0!==t?.rowNumber&&void 0!==t.rowIndex){e=this.form.elements?.[e];if(e)return void 0!==e.rowNumber&&void 0!==e.rowIndex?e.rowNumber<t.rowNumber||e.rowNumber===t.rowNumber&&e.rowIndex<t.rowIndex:e.index<t.rowNumber||e.index===t.rowNumber&&0<t.rowIndex}return!1}setLastFocus(e,t){this.lastFocus={target:e},t&&(this.lastFocus.name=t,(t=this.form.elements?.[t])&&(void 0!==t.rowNumber&&void 0!==t.rowIndex?(this.lastFocus.rowNumber=t.rowNumber,this.lastFocus.rowIndex=t.rowIndex):(this.lastFocus.rowNumber=t.index,this.lastFocus.rowIndex=0)))}getAllSectionElements(){const e={};for(const i in this.form.elements){var t=this.form.elements[i];isSection(t)&&(e[i]=t)}return e}getMutuallyExclusiveSectionGroup(t){let i=this.mutuallyExclusiveSections[t];if(!i){var e=this.find(t);if(!e||!isMutuallyExclusiveSection(e))return;i=new MutuallyExclusiveSectionGroup({elementName:t,element:e});var s=e.format,e=this.getAllSectionElements();const o=Object.keys(sortAndFilter(e,e=>e.rowNumber));t=o.indexOf(t);for(let e=t-1;0<=e;e--){const l=o[e];var n=this.find(l);if(n.format!==s)break;i.unshift({elementName:l,element:n})}for(let e=t+1;e<o.length;e++){const l=o[e];var r=this.find(l);if(r.format!==s)break;i.push({elementName:l,element:r})}i.forEach(e=>{this.mutuallyExclusiveSections[e.elementName]=i})}return i}updateMutuallyExclusiveSections(t){const e=this.getMutuallyExclusiveSectionGroup(t);e.forEach(e=>{e.element.collapsed=e.elementName!==t}),this.refresh()}enforceMutuallyExclusiveConstraints(){const e=[];for(const i of Object.keys(this.form.elements).map(e=>({elementName:e,element:this.form.elements[e]})).filter(e=>isMutuallyExclusiveSection(e.element)&&!1!==e.element.visible&&!0!==e.element.collapsed).sort((e,t)=>e.element.rowNumber-t.element.rowNumber)){var t=this.getMutuallyExclusiveSectionGroup(i.elementName);-1===e.indexOf(t)?e.push(t):i.element.collapsed=!0}}async displayDialog(e,t){await Promise.resolve()}}export{defs,FormHost};

package/forms/FormPresenterHost.d.ts

@@ -1,6 +1,7 @@
-import { FormComponent } from "./FormComponent";
-import * as defs from "./FormDefinition";
-import { FormatOptions } from "./numberFormatter";
+import type { FormComponent } from "./FormComponent";
+import type * as defs from "./FormDefinition";
+import type { FormatOptions } from "./numberFormatter";
+import type { ExternalEvent } from "../execution/ExternalEvent";
 import type { ComponentType, ReactNode } from "react";
 /**
  * Exposes various features to components that require features of the environment.
@@ -44,10 +45,15 @@ export interface FormPresenterHost {
      */
     deriveLocale(): string;
     /**
-     * Collapses all neighbouring accordion sections except the one specified.
-     * @param expandedAccordionSection The name of the accordion section to be expanded. All others in the group will be collapsed.
+     * Passes on an external event (from the host application) to the form's event queue.
+     * @param event An event received from the host application.
      */
-    updateAccordionSections(expandedAccordionSection: string): void;
+    enqueueExternalEvent(event: ExternalEvent): void;
+    /**
+     * Collapses all neighbouring mutually exclusive sections except the one specified.
+     * @param expandedSection The name of the section to be expanded. All others in the group will be collapsed.
+     */
+    updateMutuallyExclusiveSections(expandedSection: string): void;
     /**
      * Shows a dialog in the context of the running application.
      * @param children A function that produces the children for the dialog.

package/forms/MutuallyExclusiveSectionGroup.d.ts

@@ -1,4 +1,4 @@
-import * as defs from "./FormDefinition";
+import type * as defs from "./FormDefinition";
 /**
  * The definition of a Form Element along with its name.
  */

package/forms/common.d.ts

@@ -1,6 +1,6 @@
-import { ReactNode } from "react";
-import { FormPresenterHost } from "./FormComponent";
-import { defs } from "./FormHost";
+import type { FormPresenterHost } from "./FormComponent";
+import type { defs } from "./FormHost";
+import type { ReactNode } from "react";
 export declare function getTitleId(elementId: string): string;
 export declare function getDescriptionId(elementId: string): string;
 export declare function getErrorId(elementId: string): string;

package/forms/components/AccordionGroup.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import { FormComponent } from "../FormComponent";
+import type { FormComponent } from "../FormComponent";
 interface AccordionGroupProps {
     /** The CSS class name of the root element. */
     className?: string;

package/forms/components/AutoComplete.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
-import { FormElementProps } from "../..";
-import { defs } from "../FormHost";
+import type { FormElementProps } from "../..";
+import type { defs } from "../FormHost";
 /**
  * The component for the "Auto Complete" Form Element.
  */

package/forms/components/ButtonBar.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
-import { FormElementProps } from "../..";
-import { defs } from "../FormHost";
+import type { FormElementProps } from "../..";
+import type { defs } from "../FormHost";
 /**
  * The component for the "Button Bar" Form Element.
  */

package/forms/components/CheckBox.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import { FormElementProps } from "../..";
+import type { FormElementProps } from "../..";
 /**
  * The component for the "Check Box" Form Element.
  */

package/forms/components/CheckGroup.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
-import { FormElementProps } from "../..";
-import { defs } from "../FormHost";
+import type { FormElementProps } from "../..";
+import type { defs } from "../FormHost";
 /**
  * The component for the "Check Group" Form Element.
  */

package/forms/components/CheckGroup.js

@@ -1 +1 @@
-import Checkbox from"@vertigis/react-ui/Checkbox";import FormControlLabel from"@vertigis/react-ui/FormControlLabel";import FormGroup,{formGroupClasses}from"@vertigis/react-ui/FormGroup";import{styled}from"@vertigis/react-ui/styles";import*as React from"react";import{useEffect,useState}from"react";import FormElement from"../FormElement.js";import{Orientation}from"../constants.js";import{arrayEqual}from"../listUtilities.js";import{makeSafeClassName,inspectItems}from"../utils.js";import Markdown from"./Markdown.js";const Root=styled(FormElement)(({theme:{spacing:e}})=>({[`.${formGroupClasses.root}`]:{paddingBottom:e(2)}})),CheckGroup=({className:e,component:t,current:o,element:r,enabled:a,items:s,name:n,orientation:m,raiseEvent:c,renderFocus:i,renderText:l,setProperty:u,setValue:p,translateText:d,value:f})=>{const[h,v]=useState([]),[k,C]=useState();useEffect(()=>{var e=inspectItems(o,s,f)["items"];C(e);const t=[];for(const r in e)e[r].checked&&t.push(r);v(t)},[s]);var E=e=>{null===e||e.disabled||i(e,n)};var b=(r,o)=>function(e){const t=k?k[r]:void 0;t&&(e=t.checked=e.currentTarget.checked,function(){const e=[],t=[];for(const a in k){var r=k[a];r.checked&&(e.push(r),t.push(a))}var o=0===e.length?void 0:{refValueType:"items",items:e};p(o,!1),u("current",void 0),arrayEqual(t,h)||v(t)}(),c("changed",e?o:void 0,e,r))};const g=[];for(const G in k){var y=k[G],F=-1!==h.indexOf(G),R=a&&!1!==y.enabled,x=l(y.tooltip),N=y.styleName?makeSafeClassName(y.styleName):void 0;g.push(React.createElement(FormControlLabel,{className:N,control:React.createElement(Checkbox,{checked:F,onChange:b(G,y.value),inputRef:E}),disabled:!R,key:G,label:React.createElement(Markdown,{text:y.label,translateText:d}),title:x}))}return React.createElement(Root,{className:e,component:t,element:r},React.createElement(FormGroup,{row:m===Orientation.HORIZONTAL},g))};export default CheckGroup;
+import Checkbox from"@vertigis/react-ui/Checkbox";import FormControlLabel from"@vertigis/react-ui/FormControlLabel";import FormGroup,{formGroupClasses}from"@vertigis/react-ui/FormGroup";import{styled}from"@vertigis/react-ui/styles";import*as React from"react";import{useEffect,useState}from"react";import FormElement from"../FormElement.js";import{Orientation}from"../constants.js";import{arrayEqual}from"../listUtilities.js";import{makeSafeClassName,inspectItems}from"../utils.js";import Markdown from"./Markdown.js";const Root=styled(FormElement)(({theme:{spacing:e}})=>({[`.${formGroupClasses.root}`]:{paddingBottom:e(2)}})),CheckGroup=({className:e,component:t,current:o,element:r,enabled:a,items:s,name:n,orientation:c,raiseEvent:m,renderFocus:i,renderText:l,setProperty:u,setValue:p,translateText:f,value:d})=>{const[h,v]=useState([]),[k,E]=useState();useEffect(()=>{var e=inspectItems(o,s,d)["items"];E(e);const t=[];for(const r in e)e[r].checked&&t.push(r);arrayEqual(h,t)||v(t)},[s]),useEffect(()=>{const e=[];if(d)for(const t in s)d.items.includes(s[t])&&e.push(t);arrayEqual(h,e)||v(e)},[d]);var C=e=>{null===e||e.disabled||i(e,n)};var b=(r,o)=>function(e){const t=k?k[r]:void 0;t&&(e=t.checked=e.currentTarget.checked,function(){const e=[],t=[];for(const a in k){var r=k[a];r.checked&&(e.push(r),t.push(a))}var o=0===e.length?void 0:{refValueType:"items",items:e};p(o,!1),u("current",void 0),arrayEqual(t,h)||v(t)}(),m("changed",e?o:void 0,e,r))};const y=[];for(const G in k){var g=k[G],F=-1!==h.indexOf(G),R=a&&!1!==g.enabled,x=l(g.tooltip),N=g.styleName?makeSafeClassName(g.styleName):void 0;y.push(React.createElement(FormControlLabel,{className:N,control:React.createElement(Checkbox,{checked:F,onChange:b(G,g.value),inputRef:C}),disabled:!R,key:G,label:React.createElement(Markdown,{text:g.label,translateText:f}),title:x}))}return React.createElement(Root,{className:e,component:t,element:r},React.createElement(FormGroup,{row:c===Orientation.HORIZONTAL},y))};export default CheckGroup;

package/forms/components/Custom.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import { FormElementProps } from "../..";
+import type { FormElementProps } from "../..";
 /**
  * The component for the "Custom" Form Element.
  */

package/forms/components/DatePicker.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
-import { FormElementProps } from "../..";
-import { defs } from "../FormHost";
+import type { FormElementProps } from "../..";
+import type { defs } from "../FormHost";
 /**
  * The component for the "Date Picker" Form Element.
  */

package/forms/components/DateRangePicker.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
-import { FormElementProps } from "../..";
-import { DateRangeRef } from "../FormDefinition";
+import type { FormElementProps } from "../..";
+import type { DateRangeRef } from "../FormDefinition";
 export declare const dateRangePickerClasses: {
     root: string;
     toLabel: string;

package/forms/components/DateTimePicker.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
-import { FormElementProps } from "../..";
-import { defs } from "../FormHost";
+import type { FormElementProps } from "../..";
+import type { defs } from "../FormHost";
 /**
  * The component for the "Date Time Picker" Form Element.
  */

package/forms/components/DropDownList.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
-import { FormElementProps } from "../..";
-import { defs } from "../../activities/forms/FormRenderer";
+import type { FormElementProps } from "../..";
+import type { defs } from "../../activities/forms/FormRenderer";
 /**
  * The component for the "Drop Down List" Form Element.
  */

package/forms/components/DropDownList.js

@@ -1 +1 @@
-import NativeSelect from"@vertigis/react-ui/NativeSelect";import{useEffect,useState}from"react";import*as React from"react";import FormElement from"../FormElement.js";import{makeSafeClassName,makeUniqueId,inspectItems}from"../utils.js";const DEFAULT_VALUE="__default",DropDownList=({className:e,component:t,current:l,element:a,enabled:r,items:n,name:m,prompt:o,raiseEvent:s,renderFocus:i,renderText:c,setProperty:u,setValue:p,tooltip:d,value:v})=>{var E=`${makeUniqueId(m)}-input`;const[f,b]=useState({});useEffect(()=>{var{current:e,items:t,label:a,value:r}=inspectItems(l,n,v);u("current",e),u("label",a),u("value",r,!1),b(t)},[n]);d=c(d);return React.createElement(FormElement,{className:e,component:t,element:a,inputId:E},React.createElement(NativeSelect,{disabled:!r,inputProps:{id:E},inputRef:e=>{null===e||e.disabled||i(e,m)},onChange:e=>{var t=e.currentTarget.value,e=f[t].value;u("current",t),e!==v?p(e,{item:t}):s("changed",e,void 0,t)},title:d,value:l||DEFAULT_VALUE},void 0===l&&React.createElement("option",{key:"none",value:DEFAULT_VALUE,disabled:!0},c(o)),Object.keys(f).map(e=>{var t=f[e],a=c(t.label),r=t.styleName?makeSafeClassName(t.styleName):void 0;return React.createElement("option",{className:r,key:e,value:e,title:c(t.tooltip),disabled:!1===t.enabled},a)})))};export default DropDownList;
+import NativeSelect from"@vertigis/react-ui/NativeSelect";import{useEffect,useState}from"react";import*as React from"react";import FormElement from"../FormElement.js";import{makeSafeClassName,makeUniqueId,inspectItems}from"../utils.js";const DEFAULT_VALUE="__default",DropDownList=({className:e,component:t,current:r,element:a,enabled:l,items:n,name:m,prompt:o,raiseEvent:s,renderFocus:i,renderText:c,setProperty:u,setValue:p,tooltip:d,value:v})=>{var E=`${makeUniqueId(m)}-input`;const[f,b]=useState({});useEffect(()=>{var{current:e,items:t,label:a,value:l}=inspectItems(r,n,v);u("current",e),u("label",a),u("value",l,!1),b(t)},[n]);d=c(d);return React.createElement(FormElement,{className:e,component:t,element:a,inputId:E},React.createElement(NativeSelect,{disabled:!l,inputProps:{id:E},inputRef:e=>{null===e||e.disabled||i(e,m)},onChange:e=>{var t=e.currentTarget.value,e=f[t].value;u("current",t),u("label",f[t].label),e!==v?p(e,{item:t}):s("changed",e,void 0,t)},title:d,value:r||DEFAULT_VALUE},void 0===r&&React.createElement("option",{key:"none",value:DEFAULT_VALUE,disabled:!0},c(o)),Object.keys(f).map(e=>{var t=f[e],a=c(t.label),l=t.styleName?makeSafeClassName(t.styleName):void 0;return React.createElement("option",{className:l,key:e,value:e,title:c(t.tooltip),disabled:!1===t.enabled},a)})))};export default DropDownList;

package/forms/components/FilePicker.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
-import { FormElementProps } from "../..";
-import * as defs from "../FormDefinition";
+import type { FormElementProps } from "../..";
+import type * as defs from "../FormDefinition";
 export declare const filePickerClasses: {
     file: string;
     label: string;

package/forms/components/Form.js

@@ -1 +1 @@
-import AdapterDateFns from"@vertigis/react-ui/AdapterDateFns";import Box from"@vertigis/react-ui/Box";import{LicenseInfo}from"@vertigis/react-ui/LicenseInfo";import LocalizationProvider from"@vertigis/react-ui/LocalizationProvider";import{styled}from"@vertigis/react-ui/styles";import clsx from"clsx";import*as React from"react";import{useEffect,useState}from"react";import{FormComponent,FormElementComponent}from"../FormComponent.js";import{FormElementTypes}from"../constants.js";import{loadLocale}from"../dateUtilities.js";import{getKeyString}from"../keyboard.js";import{isAccordionSection,sortAndFilter}from"../utils.js";const PREFIX="Form",formClasses={body:`${PREFIX}-body`,footer:`${PREFIX}-footer`,formElementContent:`${PREFIX}-element-content`,formElementTitle:`${PREFIX}-element-title`,formElementWithTitleBeside:`${PREFIX}-element-with-title-beside`,header:`${PREFIX}-header`,main:`${PREFIX}-main`,root:`${PREFIX}-root`,row:`${PREFIX}-row`},Root=styled(Box)(e=>({"h1, h2, h3":{margin:0},[`.${formClasses.formElementWithTitleBeside}`]:{alignItems:"start",display:"grid",gridTemplateColumns:"1fr 2fr",[`> .${formClasses.formElementTitle}`]:{gridColumnStart:1,margin:0,overflowWrap:"anywhere"},[`> .${formClasses.formElementContent}`]:{display:"inline-flex",flexDirection:"column",gridColumnStart:2,overflow:"auto"}},[`.${formClasses.row}`]:{display:"flex",gap:"0.5em","> *":{flexGrow:1},"> .CheckBox, > .CheckGroup, > .Image, > .Number, > .RadioGroup":{flexGrow:0},[`.${formClasses.formElementWithTitleBeside}`]:{gridTemplateColumns:"1fr 1fr"}}}));LicenseInfo.setLicenseKey("dc21e4b722db0484344d94e6f3db523fT1JERVI6NjQ4MTMsRVhQSVJZPTE3MTM2Nzk1MDEyNzQsS0VZVkVSU0lPTj0x");const Form=({className:e,component:t})=>{const[o,r]=useState();useEffect(()=>{let t=!0;return loadLocale(i).then(e=>{t?r(e):console.warn("Component was unmounted while loading the locale.")}),()=>{t=!1}},[]);const i=t.props.host,n={host:i,type:"header",children:[]},l={host:i,type:"body",children:[]},m={host:i,type:"main",children:[]},a={host:i,type:"footer",children:[]},s={host:i,type:"body",children:[]},c={},d=[];function f(e){return e!==FormElementTypes.SECTION}function p(e){e=u[e];return null==e||!f(e.type)&&(!0!==e.hoisted&&!1!==e.visible)}function h(e){return e===n||e===l||e===a?`${e.type}-section`:e.name}const u=sortAndFilter(t.props.host.form.elements);for(const T in u){var y,E=u[T];if(!0!==(F=E).hoisted&&(!1!==F.visible&&f(F.type)))if(!0!==E.overlay){let e=function(e){if(void 0===e)return l;if("header"===e)return n;if("footer"===e)return a;let t;t="object"==typeof e?e.name:e;let o=(e=>{for(const t of d)if(t.name===e)return t})(t);return void 0===o&&(o={host:i,name:t,type:"section",children:[]},d.push(o)),o}(E.section);void 0!==E.rowNumber&&(y=h(e),e=function(e,t){let o=c[t];o=o||(c[t]=[]);let r=o[e];return void 0===r&&(r=o[e]={host:i,type:"row",children:[]}),r}(E.rowNumber,y)),e.children.push(React.createElement(FormElementComponent,{key:T,host:i,type:"element",name:T,children:[]}))}else s.children.push(React.createElement(FormElementComponent,{key:T,host:i,type:"element",name:T,children:[]}))}var F;const g=[];if(0<n.children.length&&g.push(React.createElement(FormComponent,{key:"header",...n})),0<s.children.length)g.push(React.createElement(FormComponent,{key:"main",...s}));else{v(l);let e,t=0;for(const b of d){var C=b.name;isAccordionSection(u[C])?p(C)&&(e?e.push(b):e=[b]):(e&&(x(e,++t),e=void 0),p(C)&&v(b))}e&&(x(e,++t),e=void 0),0<m.children.length&&g.push(React.createElement(FormComponent,{key:"main",...m}))}function R(e){if(!function(e){var t=h(e),o=c[t];if(o)for(const i of Object.keys(o).sort((e,t)=>parseInt(e)-parseInt(t))){var r,n=o[i];1<n.children.length?(r=`row-${i}`,e.children.push(React.createElement(FormComponent,{key:r,...n}))):1===n.children.length&&e.children.push(...n.children)}}(e),0<e.children.length){var t=e===l?"body":`$${e.name}`;return React.createElement(FormComponent,{key:t,...e})}}function v(e){e=R(e);e&&m.children.push(e)}function x(e,t){const o=[];for(const n of e){var r=R(n);r&&o.push(r)}e={children:o,host:i,name:`accordionGroup${t}`,type:"accordionGroup"};m.children.push(React.createElement(FormComponent,{key:`accordionGroup${t}`,...e}))}return 0<a.children.length&&g.push(React.createElement(FormComponent,{key:"footer",...a})),React.createElement(Root,{className:clsx(e,formClasses.root),onKeyDown:function(e){"enter"===getKeyString(e)&&(e.target instanceof HTMLButtonElement||i.post("clicked"))},ref:function(e){i.renderFocus(e)}},React.createElement(LocalizationProvider,{dateAdapter:AdapterDateFns,adapterLocale:o,localeText:{start:i.renderText("@date-range-picker-start-text"),end:i.renderText("@date-range-picker-end-text"),cancelButtonLabel:i.renderText("@common-cancel"),clearButtonLabel:i.renderText("@common-clear"),okButtonLabel:i.renderText("@common-ok"),todayButtonLabel:i.renderText("@common-today")}},g))};export default Form;export{formClasses};
+import AdapterDateFns from"@vertigis/react-ui/AdapterDateFns";import Box from"@vertigis/react-ui/Box";import{LicenseInfo}from"@vertigis/react-ui/LicenseInfo";import LocalizationProvider from"@vertigis/react-ui/LocalizationProvider";import{styled}from"@vertigis/react-ui/styles";import clsx from"clsx";import*as React from"react";import{useEffect,useState}from"react";import{FormComponent,FormElementComponent}from"../FormComponent.js";import{FormElementTypes}from"../constants.js";import{loadLocale}from"../dateUtilities.js";import{getKeyString}from"../keyboard.js";import{isMutuallyExclusiveSection,sortAndFilter}from"../utils.js";const PREFIX="Form",formClasses={body:`${PREFIX}-body`,footer:`${PREFIX}-footer`,formElementContent:`${PREFIX}-element-content`,formElementTitle:`${PREFIX}-element-title`,formElementWithTitleBeside:`${PREFIX}-element-with-title-beside`,header:`${PREFIX}-header`,main:`${PREFIX}-main`,root:`${PREFIX}-root`,row:`${PREFIX}-row`},Root=styled(Box)(e=>({"h1, h2, h3":{margin:0},[`.${formClasses.formElementWithTitleBeside}`]:{alignItems:"start",display:"grid",gridTemplateColumns:"1fr 2fr",[`> .${formClasses.formElementTitle}`]:{gridColumnStart:1,margin:0,overflowWrap:"anywhere"},[`> .${formClasses.formElementContent}`]:{display:"inline-flex",flexDirection:"column",gridColumnStart:2,overflow:"auto"}},[`.${formClasses.row}`]:{display:"flex",gap:"0.5em","> *":{flexGrow:1},"> .CheckBox, > .CheckGroup, > .Image, > .Number, > .RadioGroup":{flexGrow:0},[`.${formClasses.formElementWithTitleBeside}`]:{gridTemplateColumns:"1fr 1fr"}}}));LicenseInfo.setLicenseKey("dc21e4b722db0484344d94e6f3db523fT1JERVI6NjQ4MTMsRVhQSVJZPTE3MTM2Nzk1MDEyNzQsS0VZVkVSU0lPTj0x");const Form=({className:e,component:t})=>{const[o,r]=useState();useEffect(()=>{let t=!0;return loadLocale(l).then(e=>{t?r(e):console.warn("Component was unmounted while loading the locale.")}),()=>{t=!1}},[]);const l=t.props.host,n={host:l,type:"header",children:[]},i={host:l,type:"body",children:[]},a={host:l,type:"main",children:[]},s={host:l,type:"footer",children:[]},m={host:l,type:"body",children:[]},c={},d=[];function f(e){return e!==FormElementTypes.SECTION}function p(e){return e===n||e===i||e===s?`${e.type}-section`:e.name}const h=sortAndFilter(t.props.host.form.elements);for(const $ in h){var u,y=h[$];if(!0!==(E=y).hoisted&&(!1!==E.visible&&f(E.type)))if(!0!==y.overlay){let e=function(e){if(void 0===e)return i;if("header"===e)return n;if("footer"===e)return s;let t;t="object"==typeof e?e.name:e;let o=(e=>{for(const t of d)if(t.name===e)return t})(t);return void 0===o&&(o={host:l,name:t,type:"section",children:[]},d.push(o)),o}(y.section);void 0!==y.rowNumber&&(u=p(e),e=function(e,t){let o=c[t];o=o||(c[t]=[]);let r=o[e];return void 0===r&&(r=o[e]={host:l,type:"row",children:[]}),r}(y.rowNumber,u)),e.children.push(React.createElement(FormElementComponent,{key:$,host:l,type:"element",name:$,children:[]}))}else m.children.push(React.createElement(FormElementComponent,{key:$,host:l,type:"element",name:$,children:[]}))}var E,F;const g=[];if(0<n.children.length&&g.push(React.createElement(FormComponent,{key:"header",...n})),0<m.children.length)g.push(React.createElement(FormComponent,{key:"main",...m}));else{T(i);let e,t,o=0;var C=()=>{if(e){switch(t){case"accordion-section":k(e,++o,"accordionGroup");break;case"tab-section":k(e,++o,"tabGroup")}e=void 0,t=void 0}};for(const I of d){var v=I.name,R=h[v],x=R.format;t&&x!==t&&C(),null!=(F=h[F=v])&&(f(F.type)||!0===F.hoisted||!1===F.visible)||(isMutuallyExclusiveSection(R)?e?e.push(I):(e=[I],t=x):T(I))}C(),0<a.children.length&&g.push(React.createElement(FormComponent,{key:"main",...a}))}function b(e){if(!function(e){var t=p(e),o=c[t];if(o)for(const i of Object.keys(o).sort((e,t)=>parseInt(e)-parseInt(t))){var r,n=o[i];1<n.children.length?(r=`row-${i}`,e.children.push(React.createElement(FormComponent,{key:r,...n}))):1===n.children.length&&e.children.push(...n.children)}}(e),0<e.children.length){var t=e===i?"body":`$${e.name}`;return React.createElement(FormComponent,{key:t,...e})}}function T(e){e=b(e);e&&a.children.push(e)}function k(e,t,o){const r=[];for(const i of e){var n=b(i);n&&r.push(n)}t=`${o}${t}`,o={children:r,host:l,name:t,type:o};a.children.push(React.createElement(FormComponent,{key:t,...o}))}return 0<s.children.length&&g.push(React.createElement(FormComponent,{key:"footer",...s})),React.createElement(Root,{className:clsx(e,formClasses.root),onKeyDown:function(e){"enter"===getKeyString(e)&&(e.target instanceof HTMLButtonElement||l.post("clicked"))},ref:function(e){l.renderFocus(e)}},React.createElement(LocalizationProvider,{dateAdapter:AdapterDateFns,adapterLocale:o,localeText:{start:l.renderText("@date-range-picker-start-text"),end:l.renderText("@date-range-picker-end-text"),cancelButtonLabel:l.renderText("@common-cancel"),clearButtonLabel:l.renderText("@common-clear"),okButtonLabel:l.renderText("@common-ok"),todayButtonLabel:l.renderText("@common-today")}},g))};export default Form;export{formClasses};

package/forms/components/FormLabelNumberField.d.ts

@@ -1,5 +1,5 @@
-import { InputBaseProps } from "@vertigis/react-ui/InputBase";
 import * as React from "react";
+import type { InputBaseProps } from "@vertigis/react-ui/InputBase";
 interface FormLabelNumberFieldProps {
     disabled: boolean;
     endAdornment?: React.ReactNode;

package/forms/components/GeometryPicker.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import { FormElementProps } from "../..";
-import * as defs from "../FormDefinition";
+import type { FormElementProps } from "../..";
+import type * as defs from "../FormDefinition";
 declare const GeometryPicker: ({ autoActivate, className, component, element, enabled, itemLabel: elementItemLabel, name, prompt, raiseEvent, renderFocus, renderState, renderText, setProperty, setValue, size, state: elementState, tooltip: elementTooltip, translateText, value, }: FormElementProps<defs.GeometryRef | undefined>) => JSX.Element;
 export default GeometryPicker;

package/forms/components/GeometryPickerListItem.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import { ListItemProps } from "@vertigis/react-ui/ListItem";
+import type { ListItemProps } from "@vertigis/react-ui/ListItem";
 interface GeometryPickerListItemProps extends ListItemProps {
     /**
      * Numeric index referring to this item's position in the list.

package/forms/components/HorizontalRule.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import { FormElementProps } from "../..";
+import type { FormElementProps } from "../..";
 /**
  * The component for the "Horizontal Rule" Form Element.
  */

package/forms/components/Image.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import { FormElementProps } from "../..";
+import type { FormElementProps } from "../..";
 /**
  * The component for the "Image" Form Element.
  */

package/forms/components/ItemPicker.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
-import { FormElementProps } from "../..";
-import * as defs from "../FormDefinition";
+import type { FormElementProps } from "../..";
+import type * as defs from "../FormDefinition";
 export declare const itemPickerClasses: {
     allNone: string;
     button: string;

package/forms/components/ListBox.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
-import { FormElementProps } from "../..";
-import * as defs from "../FormDefinition";
+import type { FormElementProps } from "../..";
+import type * as defs from "../FormDefinition";
 export declare const listBoxClasses: {
     select: string;
 };

package/forms/components/Markdown.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
-import { MarkdownProps as BaseMarkdownProps } from "@vertigis/react-ui/Markdown";
-import { defs } from "../FormHost";
+import type { defs } from "../FormHost";
+import type { MarkdownProps as BaseMarkdownProps } from "@vertigis/react-ui/Markdown";
 /**
  * Properties for the `Markdown` component.
  */

package/forms/components/Number.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
-import { FormElementProps } from "../..";
-import * as defs from "../FormDefinition";
+import type { FormElementProps } from "../..";
+import type * as defs from "../FormDefinition";
 /**
  * The component for the "Number" Form Elements.
  */

package/forms/components/NumberRangeSlider.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import { FormElementProps } from "../..";
+import type { FormElementProps } from "../..";
 export declare const numberRangeSliderClasses: {
     container: string;
     inputContainer: string;

package/forms/components/NumberSlider.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
-import { FormElementProps } from "../..";
-import { NumberRef } from "../FormDefinition";
+import type { FormElementProps } from "../..";
+import type { NumberRef } from "../FormDefinition";
 export declare const numberSliderClasses: {
     container: string;
 };

package/forms/components/RadioGroup.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
-import { FormElementProps } from "../..";
-import { defs } from "../FormHost";
+import type { FormElementProps } from "../..";
+import type { defs } from "../FormHost";
 /**
  * The component for the "Radio Group" Form Element.
  */

package/forms/components/Scanner.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
-import { FormElementProps } from "../..";
-import * as defs from "../FormDefinition";
-import { ScanRef } from "../FormDefinition";
+import type { FormElementProps } from "../..";
+import type { ScanRef } from "../FormDefinition";
+import type * as defs from "../FormDefinition";
 export declare const scannerClasses: {
     container: string;
     button: string;

package/forms/components/Section.d.ts

@@ -1,14 +1,15 @@
 /// <reference types="react" />
-import { FormElementProps } from "../..";
+import type { FormElementProps } from "../..";
 export declare const sectionClasses: {
     root: string;
     basicSection: string;
     fieldSetSection: string;
+    tabSection: string;
     title: string;
     description: string;
 };
 /**
  * The component for the "Section" Form Element.
  */
-declare const Section: ({ accessibleDescription: elementAccessibleDescription, className, collapsed, component, description: elementDescription, element, enabled, error: elementError, hasInvalidChild, name, refs, renderFocus, setProperty, translateText, updateAccordionSections, }: FormElementProps) => JSX.Element;
+declare const Section: ({ accessibleDescription: elementAccessibleDescription, className, collapsed, component, description: elementDescription, element, enabled, error: elementError, hasInvalidChild, name, refs, renderFocus, setProperty, translateText, updateMutuallyExclusiveSections, }: FormElementProps) => JSX.Element;
 export default Section;

package/forms/components/Section.js

@@ -1 +1 @@
-import Accordion,{accordionClasses}from"@vertigis/react-ui/Accordion";import AccordionSummary from"@vertigis/react-ui/AccordionSummary";import Box from"@vertigis/react-ui/Box";import FormLabel from"@vertigis/react-ui/FormLabel";import ChevronDown from"@vertigis/react-ui/icons/ChevronDown";import{styled}from"@vertigis/react-ui/styles";import clsx from"clsx";import*as React from"react";import{useEffect}from"react";import{defs}from"../FormHost.js";import{renderAccessibleDescription,renderDescription,renderError}from"../common.js";import{isAccordionSection,isCollapsibleSection,makeSafeClassName,makeUniqueId}from"../utils.js";import Markdown from"./Markdown.js";const PREFIX="WorkflowSection",sectionClasses={root:`${PREFIX}-root`,basicSection:`${PREFIX}-basicSection`,fieldSetSection:`${PREFIX}-fieldSetSection`,title:`${PREFIX}-title`,description:`${PREFIX}-description`},AccordionRoot=styled(Accordion)(({theme:{spacing:e}})=>({[`.${accordionClasses.region}`]:{padding:e(1),[`.${sectionClasses.description} p`]:{marginBottom:0,marginTop:0,padding:e(.5)}}})),BoxRoot=styled(Box)(({theme:{palette:e,spacing:o,typography:{pxToRem:t}}})=>({marginBottom:o(4),marginTop:o(4),[`.${sectionClasses.description} p`]:{marginBottom:0,marginTop:0,padding:o(.5)},[`&.${sectionClasses.basicSection}`]:{borderLeft:`6px solid ${e.primary[500]}`,paddingLeft:o(1),paddingRight:o(1)},[`&.${sectionClasses.fieldSetSection}`]:{position:"relative",border:`3px solid ${e.primary[500]}`,borderLeft:"none",borderRight:"none",paddingTop:o(3),paddingBottom:o(2),[`.${sectionClasses.title}`]:{backgroundColor:e.background.default,position:"absolute",top:t(-22),left:0,padding:0,"& span":{paddingRight:o(1)}}}})),Section=({accessibleDescription:e,className:o,collapsed:t,component:i,description:r,element:s,enabled:n,error:a,hasInvalidChild:c,name:l,refs:d,renderFocus:m,setProperty:p,translateText:f,updateAccordionSections:g})=>{let u;null!=s&&s.format&&(u=s.format),u=void 0!==u&&null!==u?u:defs.DEFAULT_SECTION_FORMAT;const S=isAccordionSection(s),b=S||isCollapsibleSection(s);var C=`${makeUniqueId(l)}-input`;useEffect(()=>(d[l]=i,()=>{d[l]=void 0}),[]);var R,x,E=(R=s,x=C,React.createElement(FormLabel,{className:sectionClasses.title,error:b&&(c(R)||!!a),id:`${x}-label`,component:"h6"},React.createElement(Markdown,{inline:!0,text:R.title,translateText:f}))),n=renderDescription(r,C,n,f,sectionClasses.description),e=renderAccessibleDescription(e,r,C,f),r=renderError(a,f),C={"aria-labelledby":E?.props?.id,"aria-details":n?.props?.id,"aria-describedby":e?.props?.id},r=[n,e,r,i.props.children],s=clsx(o,s.type,sectionClasses.root,{[sectionClasses.basicSection]:"basic-section"===u,[sectionClasses.fieldSetSection]:"fieldset-section"===u,[makeSafeClassName(l)]:!!l,[makeSafeClassName(s.styleName)]:!!s.styleName});return b?React.createElement(AccordionRoot,{className:s,expanded:!0!==t,onChange:(e,o)=>{S&&o?g(l):p("collapsed",!o)},...C},React.createElement(AccordionSummary,{expandIcon:React.createElement(ChevronDown,null),ref:e=>{null!==e&&t&&m(e,l)}},E),...r):React.createElement(BoxRoot,{className:s,component:"section",...C},E,React.createElement(Box,null,...r))};export default Section;export{sectionClasses};
+import Accordion,{accordionClasses}from"@vertigis/react-ui/Accordion";import AccordionSummary from"@vertigis/react-ui/AccordionSummary";import Box from"@vertigis/react-ui/Box";import FormLabel from"@vertigis/react-ui/FormLabel";import ChevronDown from"@vertigis/react-ui/icons/ChevronDown";import{styled}from"@vertigis/react-ui/styles";import clsx from"clsx";import*as React from"react";import{useEffect}from"react";import{defs}from"../FormHost.js";import{renderAccessibleDescription,renderDescription,renderError}from"../common.js";import{isAccordionSection,isCollapsibleSection,isTabSection,makeSafeClassName,makeUniqueId}from"../utils.js";import Markdown from"./Markdown.js";const PREFIX="WorkflowSection",sectionClasses={root:`${PREFIX}-root`,basicSection:`${PREFIX}-basicSection`,fieldSetSection:`${PREFIX}-fieldSetSection`,tabSection:`${PREFIX}-tabSetSection`,title:`${PREFIX}-title`,description:`${PREFIX}-description`},StyledAccordion=styled(Accordion)(({theme:{spacing:e}})=>({[`.${accordionClasses.region}`]:{padding:e(1),[`.${sectionClasses.description} p`]:{marginBottom:0,marginTop:0,padding:e(.5)}}})),StyledTabPage=styled(Box)(({theme:{spacing:e}})=>({padding:e(1)})),StyledSection=styled(Box)(({theme:{palette:e,spacing:t,typography:{pxToRem:o}}})=>({marginBottom:t(4),marginTop:t(4),[`.${sectionClasses.description} p`]:{marginBottom:0,marginTop:0,padding:t(.5)},[`&.${sectionClasses.basicSection}`]:{borderLeft:`6px solid ${e.primary[500]}`,paddingLeft:t(1),paddingRight:t(1)},[`&.${sectionClasses.fieldSetSection}`]:{position:"relative",border:`3px solid ${e.primary[500]}`,borderLeft:"none",borderRight:"none",paddingTop:t(3),paddingBottom:t(2),[`.${sectionClasses.title}`]:{backgroundColor:e.background.default,position:"absolute",top:o(-22),left:0,padding:0,"& span":{paddingRight:t(1)}}}})),Section=({accessibleDescription:e,className:t,collapsed:o,component:i,description:s,element:r,enabled:a,error:n,hasInvalidChild:c,name:l,refs:d,renderFocus:m,setProperty:p,translateText:S,updateMutuallyExclusiveSections:b})=>{let f;null!=r&&r.format&&(f=r.format),f=void 0!==f&&null!==f?f:defs.DEFAULT_SECTION_FORMAT;const g=isAccordionSection(r);var u=isTabSection(r);const C=g||u||isCollapsibleSection(r);var y=`${makeUniqueId(l)}-input`;useEffect(()=>(d[l]=i,()=>{d[l]=void 0}),[]);var E,R,x=(E=r,R=y,React.createElement(FormLabel,{className:sectionClasses.title,error:C&&(c(E)||!!n),id:`${R}-label`,component:"h6"},React.createElement(Markdown,{inline:!0,text:E.title,translateText:S}))),a=renderDescription(s,y,a,S,sectionClasses.description),e=renderAccessibleDescription(e,s,y,S),s=renderError(n,S),y={"aria-labelledby":x?.props?.id,"aria-details":a?.props?.id,"aria-describedby":e?.props?.id},s=[a,e,s,i.props.children],r=clsx(t,r.type,sectionClasses.root,{[sectionClasses.basicSection]:"basic-section"===f,[sectionClasses.fieldSetSection]:"fieldset-section"===f,[sectionClasses.tabSection]:"tab-section"===f,[makeSafeClassName(l)]:!!l,[makeSafeClassName(r.styleName)]:!!r.styleName});return u?React.createElement(StyledTabPage,{"aria-labelledby":`simple-tab-${l}`,className:r,hidden:o,id:`simple-tabpanel-${l}`,role:"tabpanel"},...s):C?React.createElement(StyledAccordion,{className:r,expanded:!0!==o,onChange:(e,t)=>{g&&t?b(l):p("collapsed",!t)},...y},React.createElement(AccordionSummary,{expandIcon:React.createElement(ChevronDown,null),ref:e=>{null!==e&&o&&m(e,l)}},x),...s):React.createElement(StyledSection,{className:r,component:"section",...y},x,React.createElement(Box,null,...s))};export default Section;export{sectionClasses};

package/forms/components/Signature.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
-import { FormElementProps } from "../..";
-import * as defs from "../FormDefinition";
+import type { FormElementProps } from "../..";
+import type * as defs from "../FormDefinition";
 export declare const signatureClasses: {
     button: string;
     image: string;

package/forms/components/TabGroup.d.ts

@@ -0,0 +1,15 @@
+/// <reference types="react" />
+import type { FormComponent } from "../FormComponent";
+interface TabGroupProps {
+    /** The CSS class name of the root element. */
+    className?: string;
+    /**
+     * The `FormComponent` being used to render the Form Elements within this Component.
+     */
+    component: FormComponent;
+}
+/**
+ * This component contains a set of "Section" Form Elements with a `format` of `"tab-section"`.
+ */
+declare const TabGroup: ({ className, component }: TabGroupProps) => JSX.Element;
+export default TabGroup;

package/forms/components/TabGroup.js

@@ -0,0 +1 @@
+import Box from"@vertigis/react-ui/Box";import{formLabelClasses}from"@vertigis/react-ui/FormLabel";import FormLabel from"@vertigis/react-ui/FormLabel";import Tab from"@vertigis/react-ui/Tab";import Tabs from"@vertigis/react-ui/Tabs";import{styled}from"@vertigis/react-ui/styles";import*as React from"react";import{useEffect,useState}from"react";import Markdown from"./Markdown.js";const Root=styled(Box)(({theme:{spacing:e}})=>({marginBottom:e(4),marginTop:e(4)})),StyledFormLabel=styled(FormLabel)(()=>({[`&.${formLabelClasses.error}`]:{backgroundColor:"transparent"}})),TabGroup=({className:e,component:t})=>{const[r,a]=useState(!1),{children:o,host:l}=t.props;useEffect(()=>{let e=o.filter(e=>!0!==l.form.elements[e.props.name].collapsed)[0]?.props?.name;e?a(e):(e=o[0]?.props?.name,e?l.updateMutuallyExclusiveSections(e):a(!1))},[o]);return React.createElement(Root,{className:e},React.createElement(Tabs,{onChange:(e,t)=>{l.updateMutuallyExclusiveSections(t)},scrollButtons:"auto",value:r,variant:"scrollable"},o.map(e=>{var t,r=e.props["name"];return React.createElement(Tab,{"aria-controls":`simple-tabpanel-${r}`,id:`simple-tab-${r}`,key:r,label:(t=l.form.elements[r],e=r,React.createElement(StyledFormLabel,{error:l.hasInvalidChild(t)||!!t.error,id:`${e}-label`},React.createElement(Markdown,{inline:!0,text:t.title,translateText:l.translateText.bind(l)}))),value:r})})),o)};export default TabGroup;

package/forms/components/Text.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import { FormElementProps } from "../..";
+import type { FormElementProps } from "../..";
 /**
  * The component for the "Text" Form Element.
  * It just exposes the Title and Description which are common to all.

package/forms/components/TextArea.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import { FormElementProps } from "../..";
+import type { FormElementProps } from "../..";
 /**
  * The component for the "Text Area" Form Element.
  */

package/forms/components/TextBox.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import { FormElementProps } from "../..";
+import type { FormElementProps } from "../..";
 /**
  * The component for the "Text Box" and "Password Box" Form Elements.
  */

package/forms/components/TimePicker.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
-import { FormElementProps } from "../..";
-import { defs } from "../FormHost";
+import type { FormElementProps } from "../..";
+import type { defs } from "../FormHost";
 /**
  * The component for the "Time Picker" Form Element.
  */

package/forms/constants.d.ts

@@ -13,6 +13,7 @@ export declare const FormComponentTypes: {
     MAIN: string;
     ROW: string;
     SECTION: string;
+    TABGROUP: string;
 };
 /**
  * All of the types of Form Element that are included in VertiGIS Studio Workflow.

package/forms/constants.js

@@ -1 +1 @@
-const FormComponentTypes={ACCORDIONGROUP:"accordionGroup",BODY:"body",ELEMENT:"element",FOOTER:"footer",FORM:"form",HEADER:"header",MAIN:"main",ROW:"row",SECTION:"section"},FormElementTypes={AUTOCOMPLETE:"AutoComplete",BUTTONBAR:"ButtonBar",CHECKBOX:"CheckBox",CHECKGROUP:"CheckGroup",CUSTOM:"Custom",DATEPICKER:"DatePicker",DATERANGEPICKER:"DateRangePicker",DATETIMEPICKER:"DateTimePicker",DROPDOWNLIST:"DropDownList",FILEPICKER:"FilePicker",GEOMETRYPICKER:"GeometryPicker",HEADER:"Header",HORIZONTALRULE:"HorizontalRule",IMAGE:"Image",ITEMPICKER:"ItemPicker",LISTBOX:"ListBox",NUMBER:"Number",NUMBERRANGESLIDER:"NumberRangeSlider",NUMBERSLIDER:"NumberSlider",PASSWORDBOX:"PasswordBox",RADIOGROUP:"RadioGroup",SCANNER:"Scanner",SECTION:"Section",SIGNATURE:"Signature",TEXT:"Text",TEXTAREA:"TextArea",TEXTBOX:"TextBox",TIMEPICKER:"TimePicker"},Orientation={HORIZONTAL:"horizontal",VERTICAL:"vertical"};var ScanType;!function(e){e.BarCode="barcode",e.QrCode="qrcode"}(ScanType=ScanType||{});const TitleLocation={ABOVE:"above",BESIDE:"beside"};export{FormComponentTypes,FormElementTypes,Orientation,ScanType,TitleLocation};
+const FormComponentTypes={ACCORDIONGROUP:"accordionGroup",BODY:"body",ELEMENT:"element",FOOTER:"footer",FORM:"form",HEADER:"header",MAIN:"main",ROW:"row",SECTION:"section",TABGROUP:"tabGroup"},FormElementTypes={AUTOCOMPLETE:"AutoComplete",BUTTONBAR:"ButtonBar",CHECKBOX:"CheckBox",CHECKGROUP:"CheckGroup",CUSTOM:"Custom",DATEPICKER:"DatePicker",DATERANGEPICKER:"DateRangePicker",DATETIMEPICKER:"DateTimePicker",DROPDOWNLIST:"DropDownList",FILEPICKER:"FilePicker",GEOMETRYPICKER:"GeometryPicker",HEADER:"Header",HORIZONTALRULE:"HorizontalRule",IMAGE:"Image",ITEMPICKER:"ItemPicker",LISTBOX:"ListBox",NUMBER:"Number",NUMBERRANGESLIDER:"NumberRangeSlider",NUMBERSLIDER:"NumberSlider",PASSWORDBOX:"PasswordBox",RADIOGROUP:"RadioGroup",SCANNER:"Scanner",SECTION:"Section",SIGNATURE:"Signature",TEXT:"Text",TEXTAREA:"TextArea",TEXTBOX:"TextBox",TIMEPICKER:"TimePicker"},Orientation={HORIZONTAL:"horizontal",VERTICAL:"vertical"};var ScanType;!function(e){e.BarCode="barcode",e.QrCode="qrcode"}(ScanType=ScanType||{});const TitleLocation={ABOVE:"above",BESIDE:"beside"};export{FormComponentTypes,FormElementTypes,Orientation,ScanType,TitleLocation};

package/forms/dateUtilities.d.ts

@@ -1,7 +1,7 @@
 import { Calendar } from "./Calendar";
-import { DateRangeRef, DateTimeFormat, DateTimeRef, DateTimeType } from "./FormDefinition";
-import { defs } from "./FormHost";
-import { FormPresenterHost } from "./FormPresenterHost";
+import type { DateRangeRef, DateTimeFormat, DateTimeRef, DateTimeType } from "./FormDefinition";
+import type { defs } from "./FormHost";
+import type { FormPresenterHost } from "./FormPresenterHost";
 /**
  * Checks if a form element's value is equal to the supplied value.
  * @param elementValue The current value of a Form Element.

package/forms/elements/AutoComplete.d.ts

@@ -1,5 +1,5 @@
-import { FormElementPropertyConstraints, PropertyConstraintsWithDefault, PropertyConstraintsWithMinimum } from "../utils";
-import * as types from "./types";
+import type * as types from "./types";
+import type { FormElementPropertyConstraints, PropertyConstraintsWithDefault, PropertyConstraintsWithMinimum } from "../utils";
 export interface AutoComplete extends types.ElementBase, types.EditableElement, types.ElementWithItems<Item>, types.ElementWithStringLabel, types.ElementWithRequire {
     /** Indicates the current value. */
     readonly value?: any;

package/forms/elements/ButtonBar.d.ts

@@ -1,4 +1,4 @@
-import * as types from "./types";
+import type * as types from "./types";
 export interface ButtonBar extends types.ElementBase, types.EditableElement, types.ElementWithItems<Item> {
 }
 export interface Item extends types.ElementItemBase<any> {

package/forms/elements/CheckBox.d.ts

@@ -1,4 +1,4 @@
-import * as types from "./types";
+import type * as types from "./types";
 export interface CheckBox extends types.ElementBase, types.EditableElement, types.ElementWithTextLabel {
     /** Indicates that the element is checked or not. */
     readonly checked?: boolean;

package/forms/elements/CheckGroup.d.ts

@@ -1,4 +1,4 @@
-import * as types from "./types";
+import type * as types from "./types";
 export interface CheckGroup extends types.ElementBase, types.EditableElement, types.ElementWithItems<Item>, types.ElementWithRequire {
     /** Indicates the current value. */
     readonly value: ItemsRef;

package/forms/elements/Custom.d.ts

@@ -1,4 +1,4 @@
-import * as types from "./types";
+import type * as types from "./types";
 export interface Custom extends types.ElementBase, types.EditableElement {
     /** Indicates the type name of the custom form element implementation. */
     readonly customType?: string;